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 36 additions and 22 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,10 +71,8 @@ watch( ...@@ -70,10 +71,8 @@ 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 currentValue = v;
77 const existingCookie = Cookies.get($route.query.code); 76 const existingCookie = Cookies.get($route.query.code);
78 77
79 if (existingCookie) { 78 if (existingCookie) {
...@@ -85,8 +84,7 @@ watch( ...@@ -85,8 +84,7 @@ watch(
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,10 +69,8 @@ watch( ...@@ -67,10 +69,8 @@ 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) => {
73 - const currentValue = v;
74 const existingCookie = Cookies.get($route.query.code); 74 const existingCookie = Cookies.get($route.query.code);
75 75
76 if (existingCookie) { 76 if (existingCookie) {
...@@ -82,8 +82,7 @@ watch( ...@@ -82,8 +82,7 @@ watch(
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,10 +62,8 @@ onMounted(() => { ...@@ -61,10 +62,8 @@ 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 currentValue = v;
68 const existingCookie = Cookies.get($route.query.code); 67 const existingCookie = Cookies.get($route.query.code);
69 68
70 if (existingCookie) { 69 if (existingCookie) {
...@@ -76,8 +75,7 @@ watch( ...@@ -76,8 +75,7 @@ watch(
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>
......