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

 <!--
 <!--
  * @Date: 2022-08-30 11:34:19
  * @Date: 2022-08-30 11:34:19
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-08-22 09:58:37
+ * @LastEditTime: 2024-11-20 17:52:28
  * @FilePath: /data-table/src/components/CheckboxField/index.vue
  * @FilePath: /data-table/src/components/CheckboxField/index.vue
  * @Description: 多项选择控件
  * @Description: 多项选择控件
 -->
 -->
@@ -40,6 +40,8 @@
 <script setup>
 <script setup>
 import { styleColor } from "@/constant.js";
 import { styleColor } from "@/constant.js";
 import { useRoute } from "vue-router";
 import { useRoute } from "vue-router";
+import Cookies from 'js-cookie';
+import _ from 'lodash';
 
 
 const $route = useRoute();
 const $route = useRoute();
 
 
@@ -151,6 +153,33 @@ onMounted(() => {
   props.item.value = { key: props.item.key, value: checkbox_value.value, affix: affix_value.value, type: "checkbox" };
   props.item.value = { key: props.item.key, value: checkbox_value.value, affix: affix_value.value, type: "checkbox" };
   emit("active", props.item.value);
   emit("active", props.item.value);
 })
 })
+
+// 适配cookie保存未完成表单
+watch(
+    () => props.item.value,
+    (v) => {
+      const checkbox_value = _.cloneDeep(v.value)
+      checkbox_value?.forEach((element, index) => {
+        for (const key in v.affix) {
+          if (v.affix[key] && element === key) {
+            checkbox_value[index] = v.affix[key]
+          }
+        }
+      });
+      const currentValue = checkbox_value;
+      const existingCookie = Cookies.get($route.query.code);
+
+      if (existingCookie) {
+        // 如果Cookie存在，更新它
+        let obj = JSON.parse(existingCookie);
+        obj[props.item.key] = currentValue; // 替换掉旧值
+        Cookies.set($route.query.code, JSON.stringify(obj));
+      } else {
+        // 如果Cookie不存在，新增它
+        Cookies.set($route.query.code, JSON.stringify({ [props.item.key]: currentValue }));
+      }
+    }
+  );
 </script>
 </script>
 
 
 <style lang="less" scoped>
 <style lang="less" scoped>