Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
ff88f88e 1 parent b6e897c8

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

Inline Side-by-side
Showing 2 changed files with 36 additions and 1 deletions
...@@ -61,6 +61,7 @@ ...@@ -61,6 +61,7 @@
61 import { useRoute } from "vue-router"; 61 import { useRoute } from "vue-router";
62 import { styleColor } from "@/constant.js"; 62 import { styleColor } from "@/constant.js";
63 import $ from "jquery"; 63 import $ from "jquery";
64 +import Cookies from 'js-cookie';
64 65
65 const $route = useRoute(); 66 const $route = useRoute();
66 const props = defineProps({ 67 const props = defineProps({
...@@ -124,6 +125,25 @@ const validatorMessage = (val, rule) => { ...@@ -124,6 +125,25 @@ const validatorMessage = (val, rule) => {
124 } 125 }
125 }; 126 };
126 const rules = [{ validator, message: validatorMessage }]; 127 const rules = [{ validator, message: validatorMessage }];
128 +
129 +// 适配cookie保存未完成表单
130 +watch(
131 + () => props.item.value,
132 + (v) => {
133 + const currentValue = v;
134 + const existingCookie = Cookies.get($route.query.code);
135 +
136 + if (existingCookie) {
137 + // 如果Cookie存在，更新它
138 + let obj = JSON.parse(existingCookie);
139 + obj[props.item.key] = currentValue; // 替换掉旧值
140 + Cookies.set($route.query.code, JSON.stringify(obj));
141 + } else {
142 + // 如果Cookie不存在，新增它
143 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
144 + }
145 + }
146 + );
127 </script> 147 </script>
128 148
129 <style lang="less" scoped> 149 <style lang="less" scoped>
......
1 <!-- 1 <!--
2 * @Date: 2022-08-30 13:46:51 2 * @Date: 2022-08-30 13:46:51
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2024-08-07 18:14:51 4 + * @LastEditTime: 2024-11-20 18:23:21
5 * @FilePath: /data-table/src/components/PickerField/index.vue 5 * @FilePath: /data-table/src/components/PickerField/index.vue
6 * @Description: 单列选择器组件 6 * @Description: 单列选择器组件
7 --> 7 -->
...@@ -23,6 +23,7 @@ ...@@ -23,6 +23,7 @@
23 <script setup> 23 <script setup>
24 import { useRoute } from "vue-router"; 24 import { useRoute } from "vue-router";
25 import MyComponent from './MyComponent.vue'; 25 import MyComponent from './MyComponent.vue';
26 +import Cookies from 'js-cookie';
26 27
27 const $route = useRoute(); 28 const $route = useRoute();
28 29
...@@ -47,8 +48,22 @@ const ReadonlyShow = computed(() => { ...@@ -47,8 +48,22 @@ const ReadonlyShow = computed(() => {
47 // 子组件通信，适配规则触发 48 // 子组件通信，适配规则触发
48 const onActive = (val) => { 49 const onActive = (val) => {
49 emit("active", val); 50 emit("active", val);
51 + // 适配cookie保存未完成表单
52 + const currentValue = val.value;
53 + const existingCookie = Cookies.get($route.query.code);
54 +
55 + if (existingCookie) {
56 + // 如果Cookie存在，更新它
57 + let obj = JSON.parse(existingCookie);
58 + obj[props.item.key] = currentValue; // 替换掉旧值
59 + Cookies.set($route.query.code, JSON.stringify(obj));
60 + } else {
61 + // 如果Cookie不存在，新增它
62 + Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
63 + }
50 }; 64 };
51 65
66 +
52 </script> 67 </script>
53 68
54 <style lang="less" scoped> 69 <style lang="less" scoped>
......