Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
86e6872e 1 parent ff88f88e

✨ feat: 适配cookie保存未完成表单

Inline Side-by-side
Showing 4 changed files with 66 additions and 52 deletions
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-11-20 16:57:46 4 + * @LastEditTime: 2024-11-20 18:27:26
5 * @FilePath: /data-table/src/components/NameField/index.vue 5 * @FilePath: /data-table/src/components/NameField/index.vue
6 * @Description: 姓名输入框 6 * @Description: 姓名输入框
7 --> 7 -->
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
27 :disabled="item.component_props.disabled" 27 :disabled="item.component_props.disabled"
28 :input-align="item.component_props.align" 28 :input-align="item.component_props.align"
29 :border="false" 29 :border="false"
30 + @blur="onBlur(item)"
30 /> 31 />
31 </div> 32 </div>
32 </template> 33 </template>
...@@ -70,23 +71,20 @@ watch( ...@@ -70,23 +71,20 @@ watch(
70 ); 71 );
71 72
72 // 适配cookie保存未完成表单 73 // 适配cookie保存未完成表单
73 -watch( 74 +const onBlur = (item) => {
74 - () => props.item.value, 75 + const currentValue = item.value;
75 - (v) => { 76 + const existingCookie = Cookies.get($route.query.code);
76 - const currentValue = v;
77 - const existingCookie = Cookies.get($route.query.code);
78 77
79 - if (existingCookie) { 78 + if (existingCookie) {
80 - // 如果Cookie存在，更新它 79 + // 如果Cookie存在，更新它
81 - let obj = JSON.parse(existingCookie); 80 + let obj = JSON.parse(existingCookie);
82 - obj[props.item.key] = currentValue; // 替换掉旧值 81 + obj[props.item.key] = currentValue; // 替换掉旧值
83 - Cookies.set($route.query.code, JSON.stringify(obj)); 82 + Cookies.set($route.query.code, JSON.stringify(obj));
84 - } else { 83 + } else {
85 - // 如果Cookie不存在，新增它 84 + // 如果Cookie不存在，新增它
86 - Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue })); 85 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
87 - } 86 + }
88 - } 87 +}
89 - );
90 </script> 88 </script>
91 89
92 <style lang="less" scoped> 90 <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-19 15:22:41 4 + * @LastEditTime: 2024-11-21 09:32:58
5 * @FilePath: /data-table/src/components/NumberField/index.vue 5 * @FilePath: /data-table/src/components/NumberField/index.vue
6 * @Description: 数字输入框 6 * @Description: 数字输入框
7 --> 7 -->
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
27 readonly 27 readonly
28 @touchstart.stop="showKeyboard($event)" 28 @touchstart.stop="showKeyboard($event)"
29 :border="false" 29 :border="false"
30 + @blur="onBlur(item)"
30 > 31 >
31 </van-field> 32 </van-field>
32 <van-number-keyboard 33 <van-number-keyboard
...@@ -55,6 +56,8 @@ ...@@ -55,6 +56,8 @@
55 import $ from "jquery"; 56 import $ from "jquery";
56 import { storeToRefs, mainStore } from "@/utils/generatePackage"; 57 import { storeToRefs, mainStore } from "@/utils/generatePackage";
57 import { useRoute } from "vue-router"; 58 import { useRoute } from "vue-router";
59 +import Cookies from 'js-cookie';
60 +
58 const $route = useRoute(); 61 const $route = useRoute();
59 62
60 const props = defineProps({ 63 const props = defineProps({
...@@ -193,6 +196,22 @@ const rules = [{ validator, message: validatorMessage }]; ...@@ -193,6 +196,22 @@ const rules = [{ validator, message: validatorMessage }];
193 196
194 const onInput = (value) => {}; 197 const onInput = (value) => {};
195 const onDelete = () => {}; 198 const onDelete = () => {};
199 +
200 +// 适配cookie保存未完成表单
201 +const onBlur = (item) => {
202 + const currentValue = v.value;
203 + const existingCookie = Cookies.get($route.query.code);
204 +
205 + if (existingCookie) {
206 + // 如果Cookie存在，更新它
207 + let obj = JSON.parse(existingCookie);
208 + obj[props.item.key] = currentValue; // 替换掉旧值
209 + Cookies.set($route.query.code, JSON.stringify(obj));
210 + } else {
211 + // 如果Cookie不存在，新增它
212 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
213 + }
214 +}
196 </script> 215 </script>
197 216
198 <style lang="less" scoped> 217 <style lang="less" scoped>
......
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-22 09:54:46 4 + * @LastEditTime: 2024-11-21 09:25:23
5 * @FilePath: /data-table/src/components/TextField/index.vue 5 * @FilePath: /data-table/src/components/TextField/index.vue
6 * @Description: 单行文本输入框(微信扫描功能) 6 * @Description: 单行文本输入框(微信扫描功能)
7 --> 7 -->
...@@ -21,7 +21,9 @@ ...@@ -21,7 +21,9 @@
21 :required="item.required" 21 :required="item.required"
22 :readonly="item.component_props.readonly || (item.component_props.is_camera_scan && !item.component_props.is_edit_camera_scan_result)" 22 :readonly="item.component_props.readonly || (item.component_props.is_camera_scan && !item.component_props.is_edit_camera_scan_result)"
23 :disabled="item.component_props.disabled" :input-align="item.component_props.align" 23 :disabled="item.component_props.disabled" :input-align="item.component_props.align"
24 - :right-icon="item.component_props.is_camera_scan ? 'scan' : ''" @click-right-icon="clickRightIcon" /> 24 + :right-icon="item.component_props.is_camera_scan ? 'scan' : ''" @click-right-icon="clickRightIcon"
25 + @blur="onBlur(item)"
26 + />
25 </div> 27 </div>
26 </template> 28 </template>
27 29
...@@ -67,23 +69,20 @@ watch( ...@@ -67,23 +69,20 @@ watch(
67 ); 69 );
68 70
69 // 适配cookie保存未完成表单 71 // 适配cookie保存未完成表单
70 -watch( 72 +const onBlur = (item) => {
71 - () => props.item.value, 73 + const currentValue = item.value;
72 - (v) => { 74 + const existingCookie = Cookies.get($route.query.code);
73 - const currentValue = v;
74 - const existingCookie = Cookies.get($route.query.code);
75 75
76 - if (existingCookie) { 76 + if (existingCookie) {
77 - // 如果Cookie存在，更新它 77 + // 如果Cookie存在，更新它
78 - let obj = JSON.parse(existingCookie); 78 + let obj = JSON.parse(existingCookie);
79 - obj[props.item.key] = currentValue; // 替换掉旧值 79 + obj[props.item.key] = currentValue; // 替换掉旧值
80 - Cookies.set($route.query.code, JSON.stringify(obj)); 80 + Cookies.set($route.query.code, JSON.stringify(obj));
81 - } else { 81 + } else {
82 - // 如果Cookie不存在，新增它 82 + // 如果Cookie不存在，新增它
83 - Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue })); 83 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
84 - } 84 + }
85 - } 85 +};
86 - );
87 86
88 // 默认识别类型 87 // 默认识别类型
89 const scan_type_code = ref('ALL_CODE'); 88 const scan_type_code = ref('ALL_CODE');
......
...@@ -31,6 +31,7 @@ ...@@ -31,6 +31,7 @@
31 autosize 31 autosize
32 :maxlength="item.component_props.maxlength ? item.component_props.maxlength : null" 32 :maxlength="item.component_props.maxlength ? item.component_props.maxlength : null"
33 :show-word-limit="item.component_props.maxlength" 33 :show-word-limit="item.component_props.maxlength"
34 + @blur="onBlur(item)"
34 /> 35 />
35 </div> 36 </div>
36 </template> 37 </template>
...@@ -61,23 +62,20 @@ onMounted(() => { ...@@ -61,23 +62,20 @@ onMounted(() => {
61 }) 62 })
62 63
63 // 适配cookie保存未完成表单 64 // 适配cookie保存未完成表单
64 -watch( 65 +const onBlur = (item) => {
65 - () => props.item.value, 66 + const currentValue = item.value;
66 - (v) => { 67 + const existingCookie = Cookies.get($route.query.code);
67 - const currentValue = v;
68 - const existingCookie = Cookies.get($route.query.code);
69 68
70 - if (existingCookie) { 69 + if (existingCookie) {
71 - // 如果Cookie存在，更新它 70 + // 如果Cookie存在，更新它
72 - let obj = JSON.parse(existingCookie); 71 + let obj = JSON.parse(existingCookie);
73 - obj[props.item.key] = currentValue; // 替换掉旧值 72 + obj[props.item.key] = currentValue; // 替换掉旧值
74 - Cookies.set($route.query.code, JSON.stringify(obj)); 73 + Cookies.set($route.query.code, JSON.stringify(obj));
75 - } else { 74 + } else {
76 - // 如果Cookie不存在，新增它 75 + // 如果Cookie不存在，新增它
77 - Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue })); 76 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
78 - } 77 + }
79 - } 78 +}
80 - );
81 </script> 79 </script>
82 80
83 <style lang="less" scoped> 81 <style lang="less" scoped>
......