qgb-process 0.2.3 → 0.2.7

package/src/formBuilder/components/app-main/components/main-header.vue

@@ -1,351 +1,351 @@
-<template>
-  <div
-    class="app-main-header"
-    ref="MainHeader"
-  >
-    <!-- 顶部按钮 -->
-    <el-button
-      @click="isPreview = true"
-      size="small"
-      icon="el-icon-view"
-      style="background: #FFF;
-    border-color: #409EFF;
-    color: #409EFF;"
-      plain
-    >预览</el-button>
-    <el-button
-      @click="saveDate"
-      size="small"
-      icon="el-icon-upload2"
-      type="primary"
-      style="margin-left:20px;"
-      :loading="loading"
-    >保存</el-button>
-    <!-- <el-button
-      @click="clearForm(1)"
-      icon="el-icon-delete"
-      type="info"
-    >清空表单</el-button> -->
-    <!-- 预览弹窗 -->
-    <preview-dialog
-      :formDesc="formDesc"
-      :visible.sync="isPreview"
-    />
-
-  </div>
-</template>
-
-<script>
-import _ from "lodash-es";
-import configList from "@/formBuilder/config";
-import { mapState, mapMutations } from "vuex";
-import formAttrDefault from "@/store/formBuilder/formAttrDefault";
-import previewDialog from "./components/previewDialog";
-import {
-  saveBlankForm,
-  updateBlankForm,
-  savePresetForm,
-  updatePresetForm
-} from "@/api/apiFormBuilder/menu";
-import { business } from "@/formBuilder/component/components/data";
-// import formMinxins from "@/formBuilder/mixins/index.js";
-export default {
-  name: "AppMainHeader",
-  //   mixins: [formMinxins],
-  components: {
-    previewDialog
-  },
-  computed: {
-    ...mapState(["formAttr", "list", "formBuilder"]),
-    filterFormAttr() {
-      const formAttr = _.cloneDeep(this.formAttr);
-      for (const key in formAttr) {
-        const val = formAttr[key];
-        // 删除默认值 & 空值, 不需要展示
-        if (_.isNil(val) || val === formAttrDefault[key]) {
-          delete formAttr[key];
-        }
-      }
-      return formAttr;
-    },
-    formDesc() {
-      const obj = {};
-      for (name in this.list) {
-        const item = this.formatFormDes(this.list[name]);
-        obj[name] = item;
-      }
-      return obj;
-    }
-  },
-  data() {
-    return {
-      loading: false,
-      isShowExportData: false,
-      isShowHtmlCode: false,
-      isPreview: false
-    };
-  },
-  methods: {
-    ...mapMutations([
-      "clearForm",
-      "updateFormAttr",
-      "updateList",
-      "updateFormBuilder"
-    ]),
-    processData(obj, defaultObj = {}, assistProperty = [], formatterObj = {}) {
-      obj = _.cloneDeep(obj);
-      if (!obj) {
-        return {};
-      }
-      for (const key of Reflect.ownKeys(obj)) {
-        // 对数据格式化
-
-        if (formatterObj[key] && formatterObj[key].valueFormatter) {
-          obj[key] = formatterObj[key].valueFormatter(obj[key]);
-        }
-
-        // 删除默认值 & 无值的 & 辅助属性 & 私有属性
-        const deleteValidator = [
-          _.isEqual(obj[key], defaultObj[key]),
-          _.isNil(obj[key]),
-          assistProperty.includes(key),
-          key.startsWith("_")
-        ];
-
-        if (deleteValidator.some(Boolean)) {
-          delete obj[key];
-        }
-      }
-      console.log(obj, "@#$@$");
-      return obj;
-    },
-    formatFormDes(item) {
-      // 以 field 为 key, 转为对象
-      const formDesc = _.keyBy(_.cloneDeep(item), "field");
-      // 将数组转为对象, 并删除无用的属性
-      for (const key in formDesc) {
-        let formItem = formDesc[key];
-        // 判断默认值, 如果默认值不存在, 则删除此属性(无需展示)
-        const {
-          commonDefaultData = {},
-          attrsDefaultData = {},
-          assistProperty = [],
-          attrs = {}
-        } = configList[formItem.type] || {};
-
-        formItem = this.processData(formItem, commonDefaultData);
-
-        // 组件自身属性
-        if (formItem.type !== "switch") {
-          formItem.attrs = this.processData(
-            formItem.attrs,
-            attrsDefaultData,
-            assistProperty,
-            attrs
-          );
-        }
-
-        if (_.isEmpty(formItem.attrs)) {
-          delete formItem.attrs;
-        }
-
-        // 删除多余字段
-        delete formItem["field"];
-        formDesc[key] = formItem;
-      }
-
-      return formDesc;
-    },
-    async saveDate() {
-      // TODO: 保存数据操作
-      const vm = this;
-      if (Object.keys(vm.filterFormAttr).length <= 0) {
-        vm.$message.error("保存失败，请选择数据标题");
-        vm.loading = false;
-        return;
-      }
-      if (this.$store.state.formAttr.title.length <= 0) {
-        vm.$message.error({
-          message: "保存失败，请选择数据标题",
-          duration: 2500
-        });
-        vm.loading = false;
-        return;
-      }
-      for (var i = 0; i < vm.$parent.$children.length; i++) {
-        const child = vm.$parent.$children[i];
-        if (child.$refs.builder) {
-          const res = await child.$refs.builder.getCurrentErrorItem();
-          if (res) {
-            if (vm.formBuilder.type == "blank") {
-              vm.saveBlankDate();
-            } else {
-              vm.savePretDate();
-            }
-            return;
-          } else {
-            vm.$message.warning({
-              message: "请完善必填项",
-              duration: 2500
-            });
-            return;
-          }
-        } else if (child.$refs.FormItemConfig) {
-          const res = await child.$refs.FormItemConfig.getlabelFormV();
-          if (res) {
-            if (vm.formBuilder.type == "blank") {
-              vm.saveBlankDate();
-            } else {
-              vm.savePretDate();
-            }
-            return;
-          } else {
-            vm.$message.warning({
-              message: "请完善必填项",
-              duration: 2500
-            });
-            return;
-          }
-        }
-      }
-      //   vm.$parent.$children.map(async(child, i) => {
-
-      //   });
-    },
-    async saveBlankDate() {
-      const vm = this;
-      vm.loading = true;
-
-      for (const key in vm.formDesc.default) {
-        if (Object.hasOwnProperty.call(vm.formDesc.default, key)) {
-          const element = vm.formDesc.default[key];
-          if (key != "bank-form-heard" && element.default) {
-            // element.default == "";
-            // element._defaultValue == "";
-            this.$delete(vm.formDesc.default[key], ["default"]);
-            this.$delete(vm.formDesc.default[key], ["_defaultValue"]);
-          }
-        }
-      }
-
-      let data = Object.assign(
-        {},
-        {
-          formDesc: vm.formDesc.default,
-          formAttr: vm.filterFormAttr
-        }
-      );
-      data = JSON.stringify(data);
-      let res;
-      if (
-        vm.formBuilder.formDesId !== undefined &&
-        vm.formBuilder.formDesId !== "" &&
-        vm.formBuilder.formDesId !== null
-      ) {
-        const param = {
-          id: vm.formBuilder.formDesId,
-          content: data,
-          menuId: vm.formBuilder.menuId
-        };
-        res = await updateBlankForm(param);
-      } else {
-        const param = {
-          content: data,
-          menuId: vm.formBuilder.menuId,
-          companyNo: vm.$store.state.user.cno
-        };
-        res = await saveBlankForm(param);
-      }
-      if (res.data.state == "ok") {
-        vm.loading = false;
-        vm.$message.success({
-          //   message: res.data.msg || res.data.data,
-          message: "保存成功",
-          duration: 1500
-        });
-
-        if (vm.formBuilder.formDesId !== "") {
-          vm.updateFormBuilder({
-            menuId: vm.formBuilder.menuId,
-            name: vm.formBuilder.name,
-            formDesId: vm.formBuilder.formDesId
-              ? vm.formBuilder.formDesId
-              : res.data.data == "更新成功"
-                ? res.data.msg
-                : res.data.data,
-            type: "blank"
-          });
-        }
-      } else {
-        vm.$message.error({
-          message: res.data.msg ? res.data.msg : "保存失败",
-          duration: 1500
-        });
-        vm.loading = false;
-      }
-    },
-    async savePretDate() {
-      const vm = this;
-      vm.loading = true;
-      let data = Object.assign(
-        {},
-        {
-          formDesc: this.formDesc,
-          formAttr: this.filterFormAttr
-        }
-      );
-      data = JSON.stringify(data);
-      let res;
-      if (this.formBuilder.formDesId !== "") {
-        const param = {
-          id: this.formBuilder.formDesId,
-          content: data,
-          menuId: this.formBuilder.menuId
-        };
-        res = await updatePresetForm(param);
-      } else {
-        const param = {
-          content: data,
-          menuId: this.formBuilder.menuId,
-          companyNo: this.$store.state.user.cno
-        };
-        res = await savePresetForm(param);
-      }
-      if (res.data.state == "ok") {
-        vm.loading = false;
-        this.$message.success({
-          message: res.data.msg || res.data.data,
-          duration: 1500
-        });
-        if (this.formBuilder.formDesId == "") {
-          this.updateFormBuilder({
-            menuId: this.formBuilder.menuId,
-            name: this.formBuilder.name,
-            formDesId: res.data.data,
-            type: "precut"
-          });
-        }
-      } else {
-        this.$message.error({
-          message: res.data.msg ? res.data.msg : "保存失败",
-          duration: 1500
-        });
-        vm.loading = false;
-      }
-    }
-  },
-  mounted() {
-    this.$delete(this.formDesc.default, "business");
-  }
-};
-</script>
-
-<style>
-.app-main-header {
-  height: 54px;
-  line-height: 48px;
-  padding-left: 20px;
-  padding-right: 30px;
-  text-align: right;
-}
-</style>
+<template>
+  <div
+    class="app-main-header"
+    ref="MainHeader"
+  >
+    <!-- 顶部按钮 -->
+    <el-button
+      @click="isPreview = true"
+      size="small"
+      icon="el-icon-view"
+      style="background: #FFF;
+    border-color: #409EFF;
+    color: #409EFF;"
+      plain
+    >预览</el-button>
+    <el-button
+      @click="saveDate"
+      size="small"
+      icon="el-icon-upload2"
+      type="primary"
+      style="margin-left:20px;"
+      :loading="loading"
+    >保存</el-button>
+    <!-- <el-button
+      @click="clearForm(1)"
+      icon="el-icon-delete"
+      type="info"
+    >清空表单</el-button> -->
+    <!-- 预览弹窗 -->
+    <preview-dialog
+      :formDesc="formDesc"
+      :visible.sync="isPreview"
+    />
+
+  </div>
+</template>
+
+<script>
+import _ from "lodash-es";
+import configList from "@/formBuilder/config";
+import { mapState, mapMutations } from "vuex";
+import formAttrDefault from "@/store/formBuilder/formAttrDefault";
+import previewDialog from "./components/previewDialog";
+import {
+  saveBlankForm,
+  updateBlankForm,
+  savePresetForm,
+  updatePresetForm
+} from "@/api/apiFormBuilder/menu";
+import { business } from "@/formBuilder/component/components/data";
+// import formMinxins from "@/formBuilder/mixins/index.js";
+export default {
+  name: "AppMainHeader",
+  //   mixins: [formMinxins],
+  components: {
+    previewDialog
+  },
+  computed: {
+    ...mapState(["formAttr", "list", "formBuilder"]),
+    filterFormAttr() {
+      const formAttr = _.cloneDeep(this.formAttr);
+      for (const key in formAttr) {
+        const val = formAttr[key];
+        // 删除默认值 & 空值, 不需要展示
+        if (_.isNil(val) || val === formAttrDefault[key]) {
+          delete formAttr[key];
+        }
+      }
+      return formAttr;
+    },
+    formDesc() {
+      const obj = {};
+      for (name in this.list) {
+        const item = this.formatFormDes(this.list[name]);
+        obj[name] = item;
+      }
+      return obj;
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      isShowExportData: false,
+      isShowHtmlCode: false,
+      isPreview: false
+    };
+  },
+  methods: {
+    ...mapMutations([
+      "clearForm",
+      "updateFormAttr",
+      "updateList",
+      "updateFormBuilder"
+    ]),
+    processData(obj, defaultObj = {}, assistProperty = [], formatterObj = {}) {
+      obj = _.cloneDeep(obj);
+      if (!obj) {
+        return {};
+      }
+      for (const key of Reflect.ownKeys(obj)) {
+        // 对数据格式化
+
+        if (formatterObj[key] && formatterObj[key].valueFormatter) {
+          obj[key] = formatterObj[key].valueFormatter(obj[key]);
+        }
+
+        // 删除默认值 & 无值的 & 辅助属性 & 私有属性
+        const deleteValidator = [
+          _.isEqual(obj[key], defaultObj[key]),
+          _.isNil(obj[key]),
+          assistProperty.includes(key),
+          key.startsWith("_")
+        ];
+
+        if (deleteValidator.some(Boolean)) {
+          delete obj[key];
+        }
+      }
+      console.log(obj, "@#$@$");
+      return obj;
+    },
+    formatFormDes(item) {
+      // 以 field 为 key, 转为对象
+      const formDesc = _.keyBy(_.cloneDeep(item), "field");
+      // 将数组转为对象, 并删除无用的属性
+      for (const key in formDesc) {
+        let formItem = formDesc[key];
+        // 判断默认值, 如果默认值不存在, 则删除此属性(无需展示)
+        const {
+          commonDefaultData = {},
+          attrsDefaultData = {},
+          assistProperty = [],
+          attrs = {}
+        } = configList[formItem.type] || {};
+
+        formItem = this.processData(formItem, commonDefaultData);
+
+        // 组件自身属性
+        if (formItem.type !== "switch") {
+          formItem.attrs = this.processData(
+            formItem.attrs,
+            attrsDefaultData,
+            assistProperty,
+            attrs
+          );
+        }
+
+        if (_.isEmpty(formItem.attrs)) {
+          delete formItem.attrs;
+        }
+
+        // 删除多余字段
+        delete formItem["field"];
+        formDesc[key] = formItem;
+      }
+
+      return formDesc;
+    },
+    async saveDate() {
+      // TODO: 保存数据操作
+      const vm = this;
+      if (Object.keys(vm.filterFormAttr).length <= 0) {
+        vm.$message.error("保存失败，请选择数据标题");
+        vm.loading = false;
+        return;
+      }
+      if (this.$store.state.formAttr.title.length <= 0) {
+        vm.$message.error({
+          message: "保存失败，请选择数据标题",
+          duration: 2500
+        });
+        vm.loading = false;
+        return;
+      }
+      for (var i = 0; i < vm.$parent.$children.length; i++) {
+        const child = vm.$parent.$children[i];
+        if (child.$refs.builder) {
+          const res = await child.$refs.builder.getCurrentErrorItem();
+          if (res) {
+            if (vm.formBuilder.type == "blank") {
+              vm.saveBlankDate();
+            } else {
+              vm.savePretDate();
+            }
+            return;
+          } else {
+            vm.$message.warning({
+              message: "请完善必填项",
+              duration: 2500
+            });
+            return;
+          }
+        } else if (child.$refs.FormItemConfig) {
+          const res = await child.$refs.FormItemConfig.getlabelFormV();
+          if (res) {
+            if (vm.formBuilder.type == "blank") {
+              vm.saveBlankDate();
+            } else {
+              vm.savePretDate();
+            }
+            return;
+          } else {
+            vm.$message.warning({
+              message: "请完善必填项",
+              duration: 2500
+            });
+            return;
+          }
+        }
+      }
+      //   vm.$parent.$children.map(async(child, i) => {
+
+      //   });
+    },
+    async saveBlankDate() {
+      const vm = this;
+      vm.loading = true;
+
+      for (const key in vm.formDesc.default) {
+        if (Object.hasOwnProperty.call(vm.formDesc.default, key)) {
+          const element = vm.formDesc.default[key];
+          if (key != "bank-form-heard" && element.default) {
+            // element.default == "";
+            // element._defaultValue == "";
+            this.$delete(vm.formDesc.default[key], ["default"]);
+            this.$delete(vm.formDesc.default[key], ["_defaultValue"]);
+          }
+        }
+      }
+
+      let data = Object.assign(
+        {},
+        {
+          formDesc: vm.formDesc.default,
+          formAttr: vm.filterFormAttr
+        }
+      );
+      data = JSON.stringify(data);
+      let res;
+      if (
+        vm.formBuilder.formDesId !== undefined &&
+        vm.formBuilder.formDesId !== "" &&
+        vm.formBuilder.formDesId !== null
+      ) {
+        const param = {
+          id: vm.formBuilder.formDesId,
+          content: data,
+          menuId: vm.formBuilder.menuId
+        };
+        res = await updateBlankForm(param);
+      } else {
+        const param = {
+          content: data,
+          menuId: vm.formBuilder.menuId,
+          companyNo: vm.$store.state.user.cno
+        };
+        res = await saveBlankForm(param);
+      }
+      if (res.data.state == "ok") {
+        vm.loading = false;
+        vm.$message.success({
+          //   message: res.data.msg || res.data.data,
+          message: "保存成功",
+          duration: 1500
+        });
+
+        if (vm.formBuilder.formDesId !== "") {
+          vm.updateFormBuilder({
+            menuId: vm.formBuilder.menuId,
+            name: vm.formBuilder.name,
+            formDesId: vm.formBuilder.formDesId
+              ? vm.formBuilder.formDesId
+              : res.data.data == "更新成功"
+                ? res.data.msg
+                : res.data.data,
+            type: "blank"
+          });
+        }
+      } else {
+        vm.$message.error({
+          message: res.data.msg ? res.data.msg : "保存失败",
+          duration: 1500
+        });
+        vm.loading = false;
+      }
+    },
+    async savePretDate() {
+      const vm = this;
+      vm.loading = true;
+      let data = Object.assign(
+        {},
+        {
+          formDesc: this.formDesc,
+          formAttr: this.filterFormAttr
+        }
+      );
+      data = JSON.stringify(data);
+      let res;
+      if (this.formBuilder.formDesId !== "") {
+        const param = {
+          id: this.formBuilder.formDesId,
+          content: data,
+          menuId: this.formBuilder.menuId
+        };
+        res = await updatePresetForm(param);
+      } else {
+        const param = {
+          content: data,
+          menuId: this.formBuilder.menuId,
+          companyNo: this.$store.state.user.cno
+        };
+        res = await savePresetForm(param);
+      }
+      if (res.data.state == "ok") {
+        vm.loading = false;
+        this.$message.success({
+          message: res.data.msg || res.data.data,
+          duration: 1500
+        });
+        if (this.formBuilder.formDesId == "") {
+          this.updateFormBuilder({
+            menuId: this.formBuilder.menuId,
+            name: this.formBuilder.name,
+            formDesId: res.data.data,
+            type: "precut"
+          });
+        }
+      } else {
+        this.$message.error({
+          message: res.data.msg ? res.data.msg : "保存失败",
+          duration: 1500
+        });
+        vm.loading = false;
+      }
+    }
+  },
+  mounted() {
+    this.$delete(this.formDesc.default, "business");
+  }
+};
+</script>
+
+<style>
+.app-main-header {
+  height: 54px;
+  line-height: 48px;
+  padding-left: 20px;
+  padding-right: 30px;
+  text-align: right;
+}
+</style>