修改search

src/components/VueFormMaking/components/GenerateForm.vue

@@ -214,12 +214,14 @@ export default {
       let hiddenFormList = this.getSelectValueObject(tempData);
       this.formStatus = hiddenFormList;
       this.relationFormChange();
-      // 如果不是预览时，则默认给子表单添加一行数据
-      tempData.forEach(async (item) => {
-        if (item.type === "subform") {
-          await this.addSubformCol(item);
-        }
-      });
+      if (!this.value) {
+        // 如果不是预览时，则默认给子表单添加一行数据
+        tempData.forEach(async (item) => {
+          if (item.type === "subform") {
+            await this.addSubformCol(item);
+          }
+        });
+      }
     } else {
       let tempData = this.templateData;
       let hiddenFormList = this.getSelectValueObject(tempData);
@@ -503,6 +505,9 @@ export default {
         });
       });
     },
+    getDataNoValid() {
+      return this.models;
+    },
     reset() {
       this.$refs.generateForm.resetFields();
     },
@@ -522,4 +527,4 @@ export default {
   padding-top: 10px;
   padding-bottom: 15px;
 }
-</style>
+</style>

src/components/VueFormMaking/components/GenerateFormItem.vue

@@ -12,7 +12,7 @@
         : widget.name
     "
     :prop="propValue"
-    :class="[parentForm, preview && widget.type == 'text' && 'dataModelText']"
+    :class="[parentForm, widget.type == 'text' && 'dataModelText']"
     :style="subformIndex !== undefined ? { 'margin-bottom': '0' } : {}"
   >
     <template v-if="preview">
@@ -138,9 +138,7 @@
         <span v-html="dataFormatBr(dataModel)"></span>
       </template>
       <template v-else-if="widget.type === 'text'">
-        <span class="dataModelText">{{
-          dataModel
-        }}</span>
+        <span class="dataModelText">{{ dataModel }}</span>
       </template>
       <template v-else>
         <div v-if="dataModel">
@@ -438,13 +436,14 @@
       </template>
 
       <template v-if="widget.type === 'text'">
+        <!-- color: widget.options.font_color, -->
         <span
           :style="{
             'font-size': widget.options.font_size,
             'font-family': widget.options.font_family,
             'font-weight': widget.options.font_weight,
-            color: widget.options.font_color,
           }"
+          class="dataModelText"
         >
           {{ widget.options.defaultValue }}
         </span>
@@ -963,6 +962,6 @@ export default {
   color: #e7af84;
 }
 .dataModelText .el-form-item__label {
-  color: #e7af84;
+  color: #e7af84 !important;
 }
 </style>

src/utils/request.js

@@ -1,61 +1,63 @@
-import axios from 'axios'
-import { Message } from 'element-ui'
-import store from '@/store'
-import { getToken } from '@/utils/auth'
+import axios from "axios";
+import { Message } from "element-ui";
+import store from "@/store";
+import { getToken } from "@/utils/auth";
 
 // create an axios instance
 //
 // console.log(process.env.VUE_APP_BASE_API)
 const service = axios.create({
-  baseURL: '', // url = base url + request url
+  baseURL: "", // url = base url + request url
   // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 10000 // request timeout
-})
+  timeout: 10000, // request timeout
+});
 
 // request interceptor
 service.interceptors.request.use(
-  config => {
+  (config) => {
     // do something before request is sent
 
     if (store.getters.token) {
       // let each request carry token
       // ['X-Token'] is a custom headers key
       // please modify it according to the actual situation
-      const token = getToken()
+      const token = getToken();
       // 为了处理两端登录问题
-      config.headers['Authorization'] = token.charAt(0).toUpperCase() + token.slice(1)
+      config.headers["Authorization"] =
+        token.charAt(0).toUpperCase() + token.slice(1);
     }
-    return config
+    return config;
   },
-  error => {
+  (error) => {
     // do something with request error
-    return Promise.reject(error)
+    return Promise.reject(error);
   }
-)
+);
 
 // response interceptor
 service.interceptors.response.use(
   /**
    * If you want to get http information such as headers or status
    * Please return  response => response
-  */
+   */
 
   /**
    * Determine the request status by custom code
    * Here is just an example
    * You can also judge the status by HTTP Status Code
    */
-  response => {
-    const code = response.data.code
+  (response) => {
+    const code = response.data.code;
     if (code === 401 || code == 403) {
-      store.dispatch('user/resetToken')
-      if (location.href.indexOf('login') !== -1) {
-        location.reload() // 为了重新实例化vue-router对象 避免bug
+      store.dispatch("user/resetToken");
+      localStorage.removeItem("create-ticket-form-data");
+      if (location.href.indexOf("login") !== -1) {
+        location.reload(); // 为了重新实例化vue-router对象 避免bug
       } else {
-        Message.error('登录状态已过期，请重新登录')
+        Message.error("登录状态已过期，请重新登录");
         setTimeout(() => {
-          location.reload() // 为了重新实例化vue-router对象 避免bug
-        }, 1500)
+          location.reload(); // 为了重新实例化vue-router对象 避免bug
+        }, 1500);
         // MessageBox.confirm(
         //   '登录状态已过期，您可以继续留在该页面，或者重新登录',
         //   '系统提示',
@@ -69,11 +71,12 @@ service.interceptors.response.use(
         // })
       }
     } else if (code === 6401) {
-      store.dispatch('user/resetToken')
-      Message.error('登录状态已过期，请重新登录')
+      store.dispatch("user/resetToken");
+      localStorage.removeItem("create-ticket-form-data");
+      Message.error("登录状态已过期，请重新登录");
       setTimeout(() => {
-        location.reload() // 为了重新实例化vue-router对象 避免bug
-      }, 1500)
+        location.reload(); // 为了重新实例化vue-router对象 避免bug
+      }, 1500);
       // MessageBox.confirm(
       //   '登录状态已过期，您可以继续留在该页面，或者重新登录',
       //   '系统提示',
@@ -85,36 +88,36 @@ service.interceptors.response.use(
       // ).then(() => {
       //   location.reload() // 为了重新实例化vue-router对象 避免bug
       // })
-      return false
+      return false;
     } else if (code === 400 || code !== 200) {
       Message({
         message: response.data.msg,
-        type: 'error',
-        duration: 5 * 1000
-      })
-      return Promise.reject('error')
+        type: "error",
+        duration: 5 * 1000,
+      });
+      return Promise.reject("error");
     } else {
-      return response.data
+      return response.data;
     }
   },
-  error => {
-    if (error.message === 'Network Error') {
+  (error) => {
+    if (error.message === "Network Error") {
       Message({
-        message: '服务器连接异常，请检查服务器！',
-        type: 'error',
-        duration: 5 * 1000
-      })
-      return
+        message: "服务器连接异常，请检查服务器！",
+        type: "error",
+        duration: 5 * 1000,
+      });
+      return;
     }
 
     Message({
       message: error.message,
-      type: 'error',
-      duration: 5 * 1000
-    })
+      type: "error",
+      duration: 5 * 1000,
+    });
 
-    return Promise.reject(error)
+    return Promise.reject(error);
   }
-)
+);
 
-export default service
+export default service;

src/views/login/index.vue

@@ -189,6 +189,7 @@ export default {
     },
   },
   created() {
+    localStorage.removeItem("create-ticket-form-data");
     // this.getCode()
     // window.addEventListener('storage', this.afterQRScan)
     this.getCurrentTime();

src/views/process/list/create.vue

@@ -68,6 +68,7 @@
             "
             :remote="remoteFunc"
             :data="tplItem.form_structure"
+            :value="tplItem.form_data"
             :disabled="
               currentNode.readonlyTpls === undefined ||
               currentNode.readonlyTpls === null ||
@@ -89,6 +90,7 @@
           @click="submitAction(item.target)"
           >提交</el-button
         >
+        <!-- <el-button type="default" @click="onGetFormData"> 获取数据 </el-button> -->
       </div>
     </el-card>
   </div>
@@ -99,7 +101,7 @@ import Vue from "vue";
 import { GenerateForm } from "@/components/VueFormMaking";
 import "form-making/dist/FormMaking.css";
 Vue.component(GenerateForm.name, GenerateForm);
-
+import { Searchs } from "./save-data";
 import {
   processStructure,
   createWorkOrder,
@@ -122,6 +124,7 @@ export default {
       userId: null,
       tenantId: 1,
       userType: "SYSTEM",
+      cacheFormData: [],
       ruleForm: {
         priority: 1,
         deptId: null, // 社保部分
@@ -159,14 +162,30 @@ export default {
         },
       },
       documentState: 0, // 草稿状态
+      searchs: null,
     };
   },
   async mounted() {
+    const processId = this.$route.query.processId;
+    this.searchs = new Searchs("process" + processId);
+    const getSearch = this.searchs.get();
+    this.cacheFormData = getSearch || [];
+
     await this.getUserInfo();
     await this.getAllOrgan();
     this.getProcessNodeList();
   },
   methods: {
+    onGetFormData() {
+      var promiseList = [];
+      for (var tpl of this.processStructureValue.tpls) {
+        promiseList.push({
+          tplId: tpl.id,
+          formData: this.$refs["generateForm-" + tpl.id][0].getDataNoValid(),
+        });
+      }
+      this.searchs.update(promiseList, null);
+    },
     async getUserInfo() {
       await queryUserInfo().then((res) => {
         if (res.code == 200) {
@@ -286,6 +305,20 @@ export default {
           });
         });
 
+        const responseData = response.data;
+        for (let i in responseData.tpls) {
+          const findItem = this.cacheFormData.find(
+            (item) => item.tplId == responseData.tpls[i].id
+          );
+          if (findItem) {
+            responseData.tpls[i].form_data = JSON.parse(
+              JSON.stringify(findItem.formData)
+            );
+          } else {
+            responseData.tpls[i].form_data = "";
+          }
+        }
+
         this.processStructureValue = response.data;
         this.currentNode = this.processStructureValue.nodes[0];
 
@@ -440,6 +473,7 @@ export default {
       return modelStatus;
     },
     submitAction(target) {
+      console.log(this.ruleForm, "ruleForm");
       this.$refs["ruleForm"].validate((valid) => {
         if (valid) {
           this.submitDisabled = true;
@@ -510,7 +544,11 @@ export default {
                     if (response.code === 200) {
                       this.$message.success("工单申请成功");
                       this.documentState = 1;
-                      this.$router.push({ path: "/process/my-create" });
+                      // 删除已经有数据
+                      this.searchs.removeByKey();
+                      setTimeout(() => {
+                        this.$router.push({ path: "/process/my-create" });
+                      }, 50);
                     }
                   })
                   .catch(() => {
@@ -527,7 +565,6 @@ export default {
         }
       });
     },
-    compareData() {},
   },
   beforeRouteLeave(to, from, next) {
     if (this.documentState == 0) {
@@ -540,10 +577,11 @@ export default {
           type: "warning",
         })
           .then(() => {
+            this.onGetFormData();
             next();
           })
           .catch(() => {
-            next(false)
+            next(false);
           });
       }, 200);
     } else {

src/views/process/list/save-data.js

@@ -0,0 +1,79 @@
+/* eslint-disable no-empty */
+export class Searchs {
+  saveKey = "create-ticket-form-data";
+
+  initSearch = {};
+
+  searchs = {};
+
+  constructor(key) {
+    this.key = key;
+    this.searchs = this.parse();
+  }
+
+  save() {
+    localStorage.setItem(this.saveKey, JSON.stringify(this.searchs));
+  }
+
+  parse() {
+    let json = {};
+    try {
+      const val = localStorage.getItem(this.saveKey);
+      json = JSON.parse(val) || json;
+    } catch (error) {}
+    return json;
+  }
+
+  get(key) {
+    const k = key || this.key;
+    if (!this.searchs[k]) {
+      this.searchs[k] = [];
+    }
+    return this.searchs[k];
+  }
+
+  // remove(type) {
+  //   if (this.searchs && this.searchs[this.key]) {
+  //     type
+  //       ? delete this.searchs[this.key][type]
+  //       : delete this.searchs[this.key];
+  //     this.save();
+  //   }
+  //   return this.searchs;
+  // }
+
+  // getSearchs() {
+  //   return this.searchs;
+  // }
+
+  removeByKey(key) {
+    delete this.searchs[key || this.key];
+    console.log("removeByKey", key, this.key, this.searchs);
+    this.save();
+    return this.searchs;
+  }
+
+  removeAll() {
+    this.searchs = {};
+    localStorage.setItem(this.saveKey, JSON.stringify(this.searchs));
+    return this.searchs;
+  }
+
+  update(data, key, type) {
+    this.searchs = this.parse();
+    const k = key || this.key;
+    if (!this.searchs[k]) {
+      this.searchs[k] = { ...initSearch };
+    }
+
+    if (type) {
+      this.searchs[k][type] = data;
+    } else {
+      this.searchs[k] = data;
+    }
+    this.save();
+    return this.searchs;
+  }
+}
+
+const initSearch = {};