hookehuyr

✨ feat: 控件必填提示红星号调整到前面

1 <!-- 1 <!--
2 * @Date: 2022-08-30 14:32:11 2 * @Date: 2022-08-30 14:32:11
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-12-29 15:42:46 4 + * @LastEditTime: 2023-02-10 10:06:14
5 * @FilePath: /data-table/src/components/AreaPickerField/index.vue 5 * @FilePath: /data-table/src/components/AreaPickerField/index.vue
6 * @Description: 省市区选择控件 6 * @Description: 省市区选择控件
7 --> 7 -->
8 <template> 8 <template>
9 <div v-if="HideShow" class="area-picker-field"> 9 <div v-if="HideShow" class="area-picker-field">
10 - <div class="label">{{ item.component_props.label }}<span v-if="item.component_props.required">&nbsp;*</span></div> 10 + <div class="label"><span v-if="item.component_props.required">&nbsp;*</span>{{ item.component_props.label }}</div>
11 <van-field 11 <van-field
12 name="ignore" 12 name="ignore"
13 v-model="fieldValue" 13 v-model="fieldValue"
......
1 <!-- 1 <!--
2 * @Date: 2022-09-14 11:00:01 2 * @Date: 2022-09-14 11:00:01
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-11-21 14:38:06 4 + * @LastEditTime: 2023-02-10 10:06:27
5 * @FilePath: /data-table/src/components/CalendarField/index.vue 5 * @FilePath: /data-table/src/components/CalendarField/index.vue
6 * @Description: 日历选择控件 6 * @Description: 日历选择控件
7 --> 7 -->
8 <template> 8 <template>
9 <div class="calendar-page"> 9 <div class="calendar-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required">&nbsp;*</span> 11 <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
1 <!-- 1 <!--
2 * @Date: 2022-08-30 11:34:19 2 * @Date: 2022-08-30 11:34:19
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-02-01 18:57:37 4 + * @LastEditTime: 2023-02-10 10:06:43
5 * @FilePath: /data-table/src/components/CheckboxField/index.vue 5 * @FilePath: /data-table/src/components/CheckboxField/index.vue
6 * @Description: 多项选择控件 6 * @Description: 多项选择控件
7 --> 7 -->
8 <template> 8 <template>
9 <div v-if="HideShow" class="checkbox-field-page"> 9 <div v-if="HideShow" class="checkbox-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required" style="color: red">&nbsp;*</span> 11 <span v-if="item.component_props.required" style="color: red">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 <span v-if="item.component_props.max" style="color: gray"> 13 <span v-if="item.component_props.max" style="color: gray">
14 (最多可选数:&nbsp;{{ item.component_props.max }}) 14 (最多可选数:&nbsp;{{ item.component_props.max }})
15 </span> 15 </span>
......
1 <!-- 1 <!--
2 * @Date: 2022-08-31 11:45:30 2 * @Date: 2022-08-31 11:45:30
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-02-08 15:01:56 4 + * @LastEditTime: 2023-02-10 10:07:31
5 * @FilePath: /data-table/src/components/DatePickerField/index.vue 5 * @FilePath: /data-table/src/components/DatePickerField/index.vue
6 * @Description: 日期选择组件 6 * @Description: 日期选择组件
7 --> 7 -->
8 <template> 8 <template>
9 <div v-if="HideShow" class="date-picker-field"> 9 <div v-if="HideShow" class="date-picker-field">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required">&nbsp;*</span> 11 <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="datetime-picker"> 9 <div v-if="HideShow" class="datetime-picker">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required">&nbsp;*</span> 11 <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="text-field-page"> 9 <div v-if="HideShow" class="text-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="file-uploader-field"> 9 <div v-if="HideShow" class="file-uploader-field">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div 14 <div
15 v-if="item.component_props.note" 15 v-if="item.component_props.note"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="gender-field-page"> 9 <div v-if="HideShow" class="gender-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div v-if="item.component_props.note" class="note" v-html="item.component_props.note" /> 14 <div v-if="item.component_props.note" class="note" v-html="item.component_props.note" />
15 <van-field 15 <van-field
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="identity-page"> 9 <div v-if="HideShow" class="identity-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <!-- <div v-if="item.component_props.readonly" style="padding: 0.5rem 1rem;">{{ item.value }}</div> --> 14 <!-- <div v-if="item.component_props.readonly" style="padding: 0.5rem 1rem;">{{ item.value }}</div> -->
15 <van-field 15 <van-field
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="image-uploader-field"> 9 <div v-if="HideShow" class="image-uploader-field">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div 14 <div
15 v-if="item.component_props.note" 15 v-if="item.component_props.note"
......
...@@ -7,7 +7,9 @@ ...@@ -7,7 +7,9 @@
7 --> 7 -->
8 <template> 8 <template>
9 <div v-if="HideShow" class="multi-rule-field-page"> 9 <div v-if="HideShow" class="multi-rule-field-page">
10 - <div class="label"> {{ item.component_props.label }}<span v-if="item.component_props.required" class="required">&nbsp;*</span> 10 + <div class="label">
11 + <span v-if="item.component_props.required" class="required">&nbsp;*</span>
12 + {{ item.component_props.label }}
11 <span v-if="item.component_props.min_count" style="color: #999; font-size: 0.85rem;">(最少选{{ item.component_props.min_count }}项)</span> 13 <span v-if="item.component_props.min_count" style="color: #999; font-size: 0.85rem;">(最少选{{ item.component_props.min_count }}项)</span>
12 </div> 14 </div>
13 <van-field :name="item.key" :rules="rules" :border="false" style="padding-bottom: 0"> 15 <van-field :name="item.key" :rules="rules" :border="false" style="padding-bottom: 0">
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="name-field-page"> 9 <div v-if="HideShow" class="name-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
...@@ -7,7 +7,10 @@ ...@@ -7,7 +7,10 @@
7 --> 7 -->
8 <template> 8 <template>
9 <div class="note-field-page"> 9 <div class="note-field-page">
10 - <div class="label">{{ item.component_props.label }}<span v-if="item.component_props.required">&nbsp;*</span></div> 10 + <div class="label">
11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 + </div>
11 <div class="html" style="padding: 0.5rem 1rem 0 1rem;" v-html="item.component_props.note"></div> 14 <div class="html" style="padding: 0.5rem 1rem 0 1rem;" v-html="item.component_props.note"></div>
12 </div> 15 </div>
13 </template> 16 </template>
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="number-page"> 9 <div v-if="HideShow" class="number-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required">&nbsp;*</span> 11 <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div 14 <div
15 v-if="item.component_props.note" 15 v-if="item.component_props.note"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="phone-field-page"> 9 <div v-if="HideShow" class="phone-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}
12 <span v-if="item.component_props.required">&nbsp;*</span> 11 <span v-if="item.component_props.required">&nbsp;*</span>
12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 :id="item.name" 15 :id="item.name"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="picker-field-page"> 9 <div v-if="HideShow" class="picker-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......
...@@ -8,9 +8,8 @@ ...@@ -8,9 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="radio-field-page"> 9 <div v-if="HideShow" class="radio-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - item.component_props.label 12 + {{ item.component_props.label }}
13 - }}<span v-if="item.component_props.required">&nbsp;*</span>
14 </div> 13 </div>
15 <div v-if="item.component_props.note" class="note" v-html="item.component_props.note" /> 14 <div v-if="item.component_props.note" class="note" v-html="item.component_props.note" />
16 <van-field :rules="item.rules"> 15 <van-field :rules="item.rules">
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="rate-field"> 9 <div v-if="HideShow" class="rate-field">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-rate 14 <van-rate
15 v-model="rate_value" 15 v-model="rate_value"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div class="rule-field-page"> 9 <div class="rule-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 :name="item.key" 15 :name="item.key"
......
...@@ -8,9 +8,9 @@ ...@@ -8,9 +8,9 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="sign-page"> 9 <div v-if="HideShow" class="sign-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label }}{{ 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - valid 12 + {{ item.component_props.label }}
13 - }}<span v-if="item.component_props.required">&nbsp;*</span> 13 + {{ valid }}
14 </div> 14 </div>
15 <div ref="wrapperRef" class="esign-wrapper"> 15 <div ref="wrapperRef" class="esign-wrapper">
16 <!-- <div style="padding: 1rem; position: relative; height: 150px; background-color: #FCFCFC;border: 1px solid #EAEAEA; border-radius: 5px;"> --> 16 <!-- <div style="padding: 1rem; position: relative; height: 150px; background-color: #FCFCFC;border: 1px solid #EAEAEA; border-radius: 5px;"> -->
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="text-field-page"> 9 <div v-if="HideShow" class="text-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div 14 <div
15 v-if="item.component_props.note" 15 v-if="item.component_props.note"
......
...@@ -8,8 +8,8 @@ ...@@ -8,8 +8,8 @@
8 <template> 8 <template>
9 <div v-if="HideShow" class="textarea-field-page"> 9 <div v-if="HideShow" class="textarea-field-page">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <div 14 <div
15 v-if="item.component_props.note" 15 v-if="item.component_props.note"
......
1 <!-- 1 <!--
2 * @Date: 2022-08-31 11:45:30 2 * @Date: 2022-08-31 11:45:30
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-02-09 15:56:45 4 + * @LastEditTime: 2023-02-10 10:11:05
5 * @FilePath: /data-table/src/components/TimePickerField/index.vue 5 * @FilePath: /data-table/src/components/TimePickerField/index.vue
6 * @Description: 时间选择组件 6 * @Description: 时间选择组件
7 --> 7 -->
8 <template> 8 <template>
9 <div v-if="HideShow" class="time-picker-field"> 9 <div v-if="HideShow" class="time-picker-field">
10 <div class="label"> 10 <div class="label">
11 - {{ item.component_props.label 11 + <span v-if="item.component_props.required">&nbsp;*</span>
12 - }}<span v-if="item.component_props.required">&nbsp;*</span> 12 + {{ item.component_props.label }}
13 </div> 13 </div>
14 <van-field 14 <van-field
15 v-model="item.value" 15 v-model="item.value"
......