Showing
3 changed files
with
19 additions
and
13 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2022-09-14 14:44:30 | 2 | * @Date: 2022-09-14 14:44:30 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2022-11-21 16:00:36 | 4 | + * @LastEditTime: 2022-12-28 18:54:38 |
| 5 | * @FilePath: /data-table/src/components/IdentityField/index.vue | 5 | * @FilePath: /data-table/src/components/IdentityField/index.vue |
| 6 | * @Description: 身份证输入控件 | 6 | * @Description: 身份证输入控件 |
| 7 | --> | 7 | --> |
| ... | @@ -11,7 +11,9 @@ | ... | @@ -11,7 +11,9 @@ |
| 11 | {{ item.component_props.label | 11 | {{ item.component_props.label |
| 12 | }}<span v-if="item.component_props.required"> *</span> | 12 | }}<span v-if="item.component_props.required"> *</span> |
| 13 | </div> | 13 | </div> |
| 14 | + <div v-if="item.component_props.readonly" style="padding: 0.5rem 1rem;">{{ item.value }}</div> | ||
| 14 | <van-field | 15 | <van-field |
| 16 | + v-else | ||
| 15 | v-model="item.value" | 17 | v-model="item.value" |
| 16 | :id="item.name" | 18 | :id="item.name" |
| 17 | :name="item.name" | 19 | :name="item.name" |
| ... | @@ -63,8 +65,9 @@ watch( | ... | @@ -63,8 +65,9 @@ watch( |
| 63 | } | 65 | } |
| 64 | } | 66 | } |
| 65 | ); | 67 | ); |
| 66 | - | 68 | +const readonly = props.item.component_props.readonly; |
| 67 | const openKeyboard = (e) => { | 69 | const openKeyboard = (e) => { |
| 70 | + if (readonly) return false; // 如果为只读,不能设置 | ||
| 68 | // // 键盘上移动 | 71 | // // 键盘上移动 |
| 69 | // const target_to_view_height = window.innerHeight - e.target.getBoundingClientRect().y; // 元素到适口高度 | 72 | // const target_to_view_height = window.innerHeight - e.target.getBoundingClientRect().y; // 元素到适口高度 |
| 70 | // const target_top = document.body.scrollHeight - $(e.target).offset().top; // 元素到正文高度 | 73 | // const target_top = document.body.scrollHeight - $(e.target).offset().top; // 元素到正文高度 |
| ... | @@ -106,19 +109,21 @@ const blurKeyboard = () => { | ... | @@ -106,19 +109,21 @@ const blurKeyboard = () => { |
| 106 | 109 | ||
| 107 | // 校验函数返回 true 表示校验通过,false 表示不通过 | 110 | // 校验函数返回 true 表示校验通过,false 表示不通过 |
| 108 | // 身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X | 111 | // 身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X |
| 112 | +const required = props.item.component_props.required; | ||
| 109 | const validator = (val) => { | 113 | const validator = (val) => { |
| 110 | - if (!props.item.component_props.required) { | 114 | + if (required && !val) { |
| 111 | - // 非必填 | 115 | + return false; |
| 112 | - return true; | 116 | + } else if (val && !/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(val)) { |
| 117 | + return false; | ||
| 113 | } else { | 118 | } else { |
| 114 | - return /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(val); | 119 | + return true; |
| 115 | } | 120 | } |
| 116 | }; | 121 | }; |
| 117 | // 错误提示文案 | 122 | // 错误提示文案 |
| 118 | const validatorMessage = (val, rule) => { | 123 | const validatorMessage = (val, rule) => { |
| 119 | - if (!val) { | 124 | + if (required && !val) { |
| 120 | return "身份证号码不能为空"; | 125 | return "身份证号码不能为空"; |
| 121 | - } else if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(val)) { | 126 | + } else if (val && !/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(val)) { |
| 122 | return "请输入正确身份证号码"; | 127 | return "请输入正确身份证号码"; |
| 123 | } | 128 | } |
| 124 | }; | 129 | }; | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2022-09-08 15:47:54 | 2 | * @Date: 2022-09-08 15:47:54 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2022-11-21 15:16:10 | 4 | + * @LastEditTime: 2022-12-28 18:51:11 |
| 5 | * @FilePath: /data-table/src/components/RatePickerField/index.vue | 5 | * @FilePath: /data-table/src/components/RatePickerField/index.vue |
| 6 | * @Description: 评分选择控件 | 6 | * @Description: 评分选择控件 |
| 7 | --> | 7 | --> |
| ... | @@ -13,7 +13,8 @@ | ... | @@ -13,7 +13,8 @@ |
| 13 | </div> | 13 | </div> |
| 14 | <van-rate | 14 | <van-rate |
| 15 | v-model="rate_value" | 15 | v-model="rate_value" |
| 16 | - :count="item.component_props.count" | 16 | + :count="item.component_props.data_length" |
| 17 | + :readonly="item.component_props.readonly" | ||
| 17 | :color="styleColor.baseColor" | 18 | :color="styleColor.baseColor" |
| 18 | @change="onChange" | 19 | @change="onChange" |
| 19 | style="padding: 1rem" | 20 | style="padding: 1rem" |
| ... | @@ -37,7 +38,7 @@ const props = defineProps({ | ... | @@ -37,7 +38,7 @@ const props = defineProps({ |
| 37 | }); | 38 | }); |
| 38 | const emit = defineEmits(["active"]); | 39 | const emit = defineEmits(["active"]); |
| 39 | const show_empty = ref(false); | 40 | const show_empty = ref(false); |
| 40 | -const rate_value = ref(0); | 41 | +const rate_value = ref(props.item.component_props.default); |
| 41 | 42 | ||
| 42 | const onChange = (value) => { | 43 | const onChange = (value) => { |
| 43 | props.item.value = { key: props.item.key, value, type: "rate" }; | 44 | props.item.value = { key: props.item.key, value, type: "rate" }; | ... | ... |
| ... | @@ -115,7 +115,7 @@ export function createComponentType(data) { | ... | @@ -115,7 +115,7 @@ export function createComponentType(data) { |
| 115 | item.name = item.key; | 115 | item.name = item.key; |
| 116 | item.component = SignField; | 116 | item.component = SignField; |
| 117 | } | 117 | } |
| 118 | - if (item.component_props.tag === 'rate_picker') { | 118 | + if (item.component_props.tag === 'rate') { |
| 119 | item.name = item.key; | 119 | item.name = item.key; |
| 120 | item.component = RatePickerField; | 120 | item.component = RatePickerField; |
| 121 | } | 121 | } |
| ... | @@ -123,7 +123,7 @@ export function createComponentType(data) { | ... | @@ -123,7 +123,7 @@ export function createComponentType(data) { |
| 123 | item.name = item.key; | 123 | item.name = item.key; |
| 124 | item.component = CalendarField; | 124 | item.component = CalendarField; |
| 125 | } | 125 | } |
| 126 | - if (item.component_props.tag === 'id_code') { | 126 | + if (item.component_props.tag === 'id_card') { |
| 127 | item.name = item.key; | 127 | item.name = item.key; |
| 128 | item.component = IdentityField; | 128 | item.component = IdentityField; |
| 129 | } | 129 | } | ... | ... |
-
Please register or login to post a comment