hookehuyr

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

...@@ -15,8 +15,9 @@ ...@@ -15,8 +15,9 @@
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 + <div class="multi-rule-field-box">
20 <van-checkbox 21 <van-checkbox
21 :name="idx" 22 :name="idx"
22 shape="square" 23 shape="square"
...@@ -26,6 +27,7 @@ ...@@ -26,6 +27,7 @@
26 <div class="rule-box" @click="showRule(rule)"> 27 <div class="rule-box" @click="showRule(rule)">
27 {{ rule.rule_link }}&nbsp;>> 28 {{ rule.rule_link }}&nbsp;>>
28 </div> 29 </div>
30 + </div>
29 </template> 31 </template>
30 </van-checkbox-group> 32 </van-checkbox-group>
31 </template> 33 </template>
...@@ -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>
......