style: 纸吸管计算页面布局调整
- 将卡片式布局调整为列表式布局
This commit is contained in:
@ -66,68 +66,84 @@
|
|||||||
/>
|
/>
|
||||||
{{ $t('results') }}
|
{{ $t('results') }}
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-row>
|
<v-list lines="two">
|
||||||
<v-col cols="12">
|
<result-section
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeInnerDiameter')}`"
|
:label="`${$t('paperStrawResult.paperTubeInnerDiameter')}`"
|
||||||
:value="result.paperCoreDiameter"
|
:value="result.paperCoreDiameter"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeExternalDiameter')}`"
|
:label="`${$t('paperStrawResult.paperTubeExternalDiameter')}`"
|
||||||
:value="result.paperTubeExternalDiameter"
|
:value="result.paperTubeExternalDiameter"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeThickness')}`"
|
:label="`${$t('paperStrawResult.paperTubeThickness')}`"
|
||||||
:value="result.paperTubeWallThickness"
|
:value="result.paperTubeWallThickness"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.bottomPaperAngle')}`"
|
:label="`${$t('paperStrawResult.bottomPaperAngle')}`"
|
||||||
:value="result.bottomPaperAngle"
|
:value="result.bottomPaperAngle"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.leadingLength')}`"
|
:label="`${$t('paperStrawResult.leadingLength')}`"
|
||||||
:value="result.leadingLength"
|
:value="result.leadingLength"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.bottomPaperWidth')}`"
|
:label="`${$t('paperStrawResult.bottomPaperWidth')}`"
|
||||||
:value="result.bottomPaperWidth"
|
:value="result.bottomPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.secondLayerPaperWidth')}`"
|
:label="`${$t('paperStrawResult.secondLayerPaperWidth')}`"
|
||||||
:value="result.secondLayerPaperWidth"
|
:value="result.secondLayerPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.thirdLayerPaperWidth')}`"
|
:label="`${$t('paperStrawResult.thirdLayerPaperWidth')}`"
|
||||||
:value="result.thirdLayerPaperWidth"
|
:value="result.thirdLayerPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.topPaperWidth')}`"
|
:label="`${$t('paperStrawResult.topPaperWidth')}`"
|
||||||
:value="result.topPaperWidth"
|
:value="result.topPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.beltWidth')}`"
|
:label="`${$t('paperStrawResult.beltWidth')}`"
|
||||||
:value="result.beltWidth"
|
:value="result.beltWidth"
|
||||||
/>
|
/>
|
||||||
|
</v-list>
|
||||||
|
|
||||||
|
<v-expansion-panels flat multiple>
|
||||||
|
<v-expansion-panel hide-actions>
|
||||||
|
<v-expansion-panel-title class="text-warning font-weight-bold">
|
||||||
|
<template #default="{ expanded }">
|
||||||
|
<span>
|
||||||
|
<v-icon icon="mdi-information-outline" />
|
||||||
|
{{ expanded ? $t('calculationParameters') : $t('expandToShowCalculationParameters') }}
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</v-expansion-panel-title>
|
||||||
|
<v-expansion-panel-text>
|
||||||
|
<v-row>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('paperTubeInnerDiameter')" :value="paperCoreDiameter" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('bottomPaperWidth')" :value="bottomPaperWidth" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('bottomPaperThickness')" :value="bottomPaperThickness" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('secondLayerPaperThickness')" :value="secondLayerPaperThickness" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('thirdLayerPaperThickness')" :value="thirdLayerPaperThickness" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('topPaperThickness')" :value="topPaperThickness" />
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
</v-expansion-panel-text>
|
||||||
|
</v-expansion-panel>
|
||||||
|
</v-expansion-panels>
|
||||||
|
|
||||||
</v-card>
|
</v-card>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
|||||||
@ -63,62 +63,76 @@
|
|||||||
/>
|
/>
|
||||||
{{ $t('results') }}
|
{{ $t('results') }}
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-row>
|
<v-list lines="two">
|
||||||
<v-col cols="12">
|
<result-section
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeInnerDiameter')}`"
|
:label="`${$t('paperStrawResult.paperTubeInnerDiameter')}`"
|
||||||
:value="result.paperCoreDiameter"
|
:value="result.paperCoreDiameter"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeExternalDiameter')}`"
|
:label="`${$t('paperStrawResult.paperTubeExternalDiameter')}`"
|
||||||
:value="result.paperTubeExternalDiameter"
|
:value="result.paperTubeExternalDiameter"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.paperTubeThickness')}`"
|
:label="`${$t('paperStrawResult.paperTubeThickness')}`"
|
||||||
:value="result.paperTubeWallThickness"
|
:value="result.paperTubeWallThickness"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.bottomPaperAngle')}`"
|
:label="`${$t('paperStrawResult.bottomPaperAngle')}`"
|
||||||
:value="result.bottomPaperAngle"
|
:value="result.bottomPaperAngle"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.leadingLength')}`"
|
:label="`${$t('paperStrawResult.leadingLength')}`"
|
||||||
:value="result.leadingLength"
|
:value="result.leadingLength"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.bottomPaperWidth')}`"
|
:label="`${$t('paperStrawResult.bottomPaperWidth')}`"
|
||||||
:value="result.bottomPaperWidth"
|
:value="result.bottomPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.middlePaperWidth')}`"
|
:label="`${$t('paperStrawResult.middlePaperWidth')}`"
|
||||||
:value="result.middlePaperWidth"
|
:value="result.middlePaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.topPaperWidth')}`"
|
:label="`${$t('paperStrawResult.topPaperWidth')}`"
|
||||||
:value="result.topPaperWidth"
|
:value="result.topPaperWidth"
|
||||||
/>
|
/>
|
||||||
</v-col>
|
<result-section
|
||||||
<v-col cols="12">
|
|
||||||
<result-card
|
|
||||||
:label="`${$t('paperStrawResult.beltWidth')}`"
|
:label="`${$t('paperStrawResult.beltWidth')}`"
|
||||||
:value="result.beltWidth"
|
:value="result.beltWidth"
|
||||||
/>
|
/>
|
||||||
|
</v-list>
|
||||||
|
|
||||||
|
<v-expansion-panels flat multiple>
|
||||||
|
<v-expansion-panel hide-actions>
|
||||||
|
<v-expansion-panel-title class="text-warning font-weight-bold">
|
||||||
|
<template #default="{ expanded }">
|
||||||
|
<span>
|
||||||
|
<v-icon icon="mdi-information-outline" />
|
||||||
|
{{ expanded ? $t('calculationParameters') : $t('expandToShowCalculationParameters') }}
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</v-expansion-panel-title>
|
||||||
|
<v-expansion-panel-text>
|
||||||
|
<v-row>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('paperTubeInnerDiameter')" :value="paperCoreDiameter" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('bottomPaperWidth')" :value="bottomPaperWidth" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('bottomPaperThickness')" :value="bottomPaperThickness" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('middlePaperThickness')" :value="middlePaperThickness" />
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="6">
|
||||||
|
<input-param-section :label="$t('topPaperThickness')" :value="topPaperThickness" />
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
</v-expansion-panel-text>
|
||||||
|
</v-expansion-panel>
|
||||||
|
</v-expansion-panels>
|
||||||
</v-card>
|
</v-card>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
|
|||||||
Reference in New Issue
Block a user