Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
bbb41476 1 parent 7fce06a4

给联系人相关字段绑定监听事件用于更新值变化

Inline Side-by-side
Showing 6 changed files with 73 additions and 7 deletions
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: 2024-08-07 18:14:05 4 + * @LastEditTime: 2024-08-19 15:21:52
5 * @FilePath: /data-table/src/components/GenderField/index.vue 5 * @FilePath: /data-table/src/components/GenderField/index.vue
6 * @Description: 性别选择控件 6 * @Description: 性别选择控件
7 --> 7 -->
...@@ -65,6 +65,19 @@ onMounted(() => { ...@@ -65,6 +65,19 @@ onMounted(() => {
65 emit("active", props.item.value); 65 emit("active", props.item.value);
66 }); 66 });
67 67
68 +// 监听默认值变化
69 +watch(
70 + () => props.item.component_props.default,
71 + (v) => {
72 + if (v) {
73 + gender_value.value = v;
74 + // 发送自定义数据结构
75 + props.item.value = { key: props.item.key, value: gender_value.value, type: "gender" };
76 + emit("active", props.item.value);
77 + }
78 + }
79 +);
80 +
68 const emit = defineEmits(["active"]); 81 const emit = defineEmits(["active"]);
69 82
70 const onChange = (item) => { 83 const onChange = (item) => {
......
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: 2024-08-13 15:48:11 4 + * @LastEditTime: 2024-08-19 15:22:29
5 * @FilePath: /data-table/src/components/IdentityField/index.vue 5 * @FilePath: /data-table/src/components/IdentityField/index.vue
6 * @Description: 身份证输入控件 6 * @Description: 身份证输入控件
7 --> 7 -->
...@@ -100,6 +100,16 @@ watch( ...@@ -100,6 +100,16 @@ watch(
100 } 100 }
101 ); 101 );
102 102
103 +// 监听默认值变化
104 +watch(
105 + () => props.item.component_props.default,
106 + (v) => {
107 + if (v) {
108 + props.item.value = v;
109 + }
110 + }
111 +);
112 +
103 var checkProv = function (val) { 113 var checkProv = function (val) {
104 var pattern = /^[1-9][0-9]/; 114 var pattern = /^[1-9][0-9]/;
105 var provs = {11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江 ",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北 ",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏 ",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门"}; 115 var provs = {11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江 ",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北 ",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏 ",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门"};
......
1 <!-- 1 <!--
2 * @Date: 2022-08-29 14:31:20 2 * @Date: 2022-08-29 14:31:20
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-08-12 18:03:44 4 + * @LastEditTime: 2024-08-19 15:22:34
5 * @FilePath: /data-table/src/components/NameField/index.vue 5 * @FilePath: /data-table/src/components/NameField/index.vue
6 * @Description: 姓名输入框 6 * @Description: 姓名输入框
7 --> 7 -->
...@@ -55,7 +55,17 @@ const isGroup = computed(() => { ...@@ -55,7 +55,17 @@ const isGroup = computed(() => {
55 55
56 onMounted(() => { 56 onMounted(() => {
57 props.item.value = props.item.component_props.default; 57 props.item.value = props.item.component_props.default;
58 -}) 58 +});
59 +
60 +// 监听默认值变化
61 +watch(
62 + () => props.item.component_props.default,
63 + (v) => {
64 + if (v) {
65 + props.item.value = v;
66 + }
67 + }
68 +);
59 </script> 69 </script>
60 70
61 <style lang="less" scoped> 71 <style lang="less" scoped>
......
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: 2024-08-07 18:14:33 4 + * @LastEditTime: 2024-08-19 15:22:41
5 * @FilePath: /data-table/src/components/NumberField/index.vue 5 * @FilePath: /data-table/src/components/NumberField/index.vue
6 * @Description: 数字输入框 6 * @Description: 数字输入框
7 --> 7 -->
...@@ -96,6 +96,17 @@ watch( ...@@ -96,6 +96,17 @@ watch(
96 } 96 }
97 } 97 }
98 ); 98 );
99 +
100 +// 监听默认值变化
101 +watch(
102 + () => props.item.component_props.default,
103 + (v) => {
104 + if (v) {
105 + props.item.value = v;
106 + }
107 + }
108 +);
109 +
99 const readonly = props.item.component_props.readonly; 110 const readonly = props.item.component_props.readonly;
100 const showKeyboard = (e) => { 111 const showKeyboard = (e) => {
101 if (readonly) return false; // 如果为只读，不能设置 112 if (readonly) return false; // 如果为只读，不能设置
......
1 <!-- 1 <!--
2 * @Date: 2022-09-02 10:46:03 2 * @Date: 2022-09-02 10:46:03
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-08-12 17:39:00 4 + * @LastEditTime: 2024-08-19 15:17:46
5 * @FilePath: /data-table/src/components/PhoneField/index.vue 5 * @FilePath: /data-table/src/components/PhoneField/index.vue
6 * @Description: 手机输入框 6 * @Description: 手机输入框
7 --> 7 -->
...@@ -133,6 +133,16 @@ watch( ...@@ -133,6 +133,16 @@ watch(
133 } 133 }
134 ); 134 );
135 135
136 +// 监听默认值变化
137 +watch(
138 + () => props.item.component_props.default,
139 + (v) => {
140 + if (v) {
141 + props.item.value = v;
142 + }
143 + }
144 +);
145 +
136 const openKeyboard = (e) => { 146 const openKeyboard = (e) => {
137 if (props.item.component_props.readonly) return false; // 如果为只读，不能设置 147 if (props.item.component_props.readonly) return false; // 如果为只读，不能设置
138 // 键盘上移动 148 // 键盘上移动
......
1 <!-- 1 <!--
2 * @Date: 2022-07-18 10:22:22 2 * @Date: 2022-07-18 10:22:22
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-08-14 14:28:08 4 + * @LastEditTime: 2024-08-19 15:17:29
5 * @FilePath: /data-table/src/views/index.vue 5 * @FilePath: /data-table/src/views/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -542,6 +542,18 @@ onMounted(async () => { ...@@ -542,6 +542,18 @@ onMounted(async () => {
542 document.documentElement.style.setProperty('--border-style', '0'); 542 document.documentElement.style.setProperty('--border-style', '0');
543 }) 543 })
544 } 544 }
545 + // TODO: iframe通信-读取联系人身份证信息
546 + window.addEventListener('message', (ev) => {
547 + let data = ev.data || null;
548 + console.warn('读取联系人身份证信息', data);
549 + const objectMap = new Map(data.map(item => [item.key, item.value]));
550 + formData.value.forEach((item) => {
551 + // TODO: 绑定别名字段-待确定
552 + if (objectMap.has(item.component_props.tag)) {
553 + item.component_props.default = objectMap.get(item.component_props.tag);
554 + }
555 + });
556 + }, false);
545 }); 557 });
546 558
547 // 打开轮询用户是否关注 559 // 打开轮询用户是否关注
......