Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
1c31ab51 1 parent 965f01ef

fix 多选规则控件显示样式调整

Inline Side-by-side
Showing 1 changed file with 19 additions and 9 deletions
...@@ -15,16 +15,18 @@ ...@@ -15,16 +15,18 @@
15 </div> 15 </div>
16 <van-field :name="item.key" :rules="rules" :border="false" style="padding-bottom: 0"> 16 <van-field :name="item.key" :rules="rules" :border="false" style="padding-bottom: 0">
17 <template #input> 17 <template #input>
18 - <van-checkbox-group v-model="item.value"> 18 + <van-checkbox-group v-model="item.value" style="width: 100%">
19 <template v-for="(rule, idx) in item.component_props.rules" :key="idx"> 19 <template v-for="(rule, idx) in item.component_props.rules" :key="idx">
20 - <van-checkbox 20 + <div class="multi-rule-field-box">
21 - :name="idx" 21 + <van-checkbox
22 - shape="square" 22 + :name="idx"
23 - :checked-color="themeVars.radioColor" 23 + shape="square"
24 - >{{ rule.rule_desc }}</van-checkbox 24 + :checked-color="themeVars.radioColor"
25 - > 25 + >{{ rule.rule_desc }}</van-checkbox
26 - <div class="rule-box" @click="showRule(rule)"> 26 + >
27 - {{ rule.rule_link }}&nbsp;>> 27 + <div class="rule-box" @click="showRule(rule)">
28 + {{ rule.rule_link }}&nbsp;>>
29 + </div>
28 </div> 30 </div>
29 </template> 31 </template>
30 </van-checkbox-group> 32 </van-checkbox-group>
...@@ -107,6 +109,7 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -107,6 +109,7 @@ const rules = [{ validator, message: validatorMessage }];
107 font-size: 0.85rem; 109 font-size: 0.85rem;
108 margin-left: 1.8rem; 110 margin-left: 1.8rem;
109 padding-bottom: 0.5rem; 111 padding-bottom: 0.5rem;
112 + width: fit-content;
110 } 113 }
111 } 114 }
112 .rule-wrapper { 115 .rule-wrapper {
...@@ -130,4 +133,11 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -130,4 +133,11 @@ const rules = [{ validator, message: validatorMessage }];
130 width: calc(100% - 2rem); 133 width: calc(100% - 2rem);
131 } 134 }
132 } 135 }
136 +.multi-rule-field-box {
137 + border: 1px solid #eaeaea;
138 + border-radius: 0.25rem;
139 + padding: 1rem 0.5rem 0 0.5rem;
140 + // width: 100vw;
141 + margin-bottom: 0.5rem;
142 +}
133 </style> 143 </style>
......