btn calc #28

Merged
ksenia_mikhailova merged 1 commits from bx-1028-policy into dev 2024-07-15 11:50:16 +03:00
2 changed files with 37 additions and 33 deletions
Showing only changes of commit 835221f99c - Show all commits

View File

@ -350,16 +350,16 @@ button {
}
.calc_table {
@apply flex flex-col gap-4 max-w-4xl;
@apply flex flex-col gap-2 mb-4;
>.grid {
@apply gap-4 border-solid border-b items-center last:border-b-0;
@apply gap-2 items-center;
>[class*=col] {
@apply p-2;
@apply p-1 border-solid border-b;
}
>[class*=row-span]+[class*=col-span] {
>.col-span-4:not(.calc_table-maincell) {
@apply pl-4;
}
}

View File

@ -203,39 +203,43 @@ const goal = (target: string, params: object) => {
</div>
</div>
</div>
<div class="col-span-12 grid calc_table">
<template v-if="(form_state.total_length * 1000) >= parametric.length.min">
<template v-if="(form_state.total_length * 1000) >= parametric.length.min">
<div class="col-span-12 xl:col-span-8 xl:col-start-3 grid calc_table">
<div class="grid grid-cols-6">
<div class="col-span-4">Секции</div>
<div class="col-span-1">{{ section_count }}</div>
<div class="col-span-1 row-span-2">{{
`${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}
<div class="col-span-4 calc_table-maincell">Секции</div>
<div class="col-span-2 calc_table-maincell">{{ section_count }}</div>
<div class="col-span-4">
Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
</div>
<div class="col-span-4">Ламели, RAL {{ lamelle_color }}, {{
getColorNameFromRal(lamelle_color)?.toLowerCase() }}</div>
<div class="col-span-1"> {{ section_count * lamelles_count }}</div>
</div>
<div class="grid grid-cols-6" v-if="form_state.extra_section">
<div class="col-span-4">Дополнительная секция</div>
<div class="col-span-1">1</div>
<div class="col-span-1 row-span-2">{{
`${parseFloat(form_state.extra_section.toString()).toFixed(2)}\xa0мм` }}</div>
<div class="col-span-4">Ламели, RAL {{ lamelle_color }}, {{
getColorNameFromRal(lamelle_color)?.toLowerCase() }}</div>
<div class="col-span-1"> {{ 1 * lamelles_count }}</div>
</div>
<div class="grid grid-cols-6" v-if="!form_state.remove_pillar">
<div class="col-span-4">Столбы, RAL {{ pillar_color }}, {{
getColorNameFromRal(pillar_color)?.toLowerCase() }}</div>
<div class="col-span-1">{{ section_count * lamelles_count }}</div>
<div class="col-span-1">
{{ section_count + ~~(!!form_state.extra_section) + 1 }}
</div>
<div class="col-span-1">
{{ `${parseFloat(form_state.fence_length.toString()).toFixed(2)}\xa0мм` }}
</div>
{{ `${parseFloat(form_state.length.toString()).toFixed(2)}\xa0мм` }}</div>
<template v-if="!form_state.remove_pillar">
<div class="col-span-4">Столбы, RAL {{ pillar_color }}, {{
getColorNameFromRal(pillar_color)?.toLowerCase() }}</div>
<div class="col-span-1">
{{ section_count + ~~(!!form_state.extra_section) + 1 }}
</div>
<div class="col-span-1">
{{ `${parseFloat(form_state.fence_length.toString()).toFixed(2)}\xa0мм` }}
</div>
</template>
<template v-if="form_state.extra_section">
<div class="col-span-4 calc_table-maincell">Секции</div>
<div class="col-span-2 calc_table-maincell">1</div>
<div class="col-span-4">
Ламели, RAL {{ lamelle_color }}, {{ getColorNameFromRal(lamelle_color)?.toLowerCase() }}
</div>
<div class="col-span-1">{{ 1 * lamelles_count }}</div>
<div class="col-span-1">{{
`${parseFloat(form_state.extra_section.toString()).toFixed(2)}\xa0мм` }}</div>
</template>
</div>
</template>
</div>
</div>
<div class="col-span-12 text-center mb-4">
<button @click.prevent="toggleModal">Рассчитать</button>
</div>
</template>
</form>
</div>
</template>