qgb-process 0.2.3 → 0.2.7

package/src/views/formBuilder/designListPage.vue

@@ -1,457 +1,457 @@
-<template>
-  <div class="wrapper">
-    <el-form
-      ref="form"
-      :inline="true"
-      class="h-search-form"
-      :model="form"
-      label-width="100px"
-    >
-      <el-form-item label="申请单位：">
-        <el-select
-          v-model="form.companyNo"
-          placeholder="请选择申请单位"
-          @change="handleOrgChange"
-        >
-          <el-option
-            v-for="item in orgOptions"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-
-      <el-form-item label="申请部门：">
-        <el-cascader
-          :show-all-levels="false"
-          placeholder="请选择申请部门"
-          :disabled="!form.companyNo"
-          :options="depOptions"
-          v-model="form.departmentNo"
-          :props="cascaderProps"
-          @change="handleChange"
-          :key="count"
-        ></el-cascader>
-      </el-form-item>
-
-      <el-form-item label="申请人：">
-        <el-select
-          v-model="form.staffNo"
-          placeholder="请选择申请人"
-          clearable
-          :disabled="!form.departmentNo"
-        >
-          <el-option
-            v-for="item in staffs"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          ></el-option>
-        </el-select>
-      </el-form-item>
-
-      <!-- <el-form-item label="经办人：">
-        <el-input placeholder="请输入经办人" v-model="form.operator" maxlength="30"></el-input>
-      </el-form-item> -->
-    </el-form>
-    <ele-form
-      class="design"
-      :formDesc="formDesc"
-      v-model="formData"
-      :isLoading="isLoading"
-      @request="handleRequest"
-      @reset="handleRest"
-      v-bind="formAttr"
-    >
-    </ele-form>
-    <el-button
-      type="primary"
-      @click="goAddFormData"
-    >新增</el-button>
-    <div class="table-contain">
-      <table-list
-        :formDesign="formDesign"
-        :tableData="tableData"
-        :tableConfig="tableConfig"
-        :buttons="buttons"
-        :title="title"
-        @handleButton="(e)=>e.func(e.row)"
-      ></table-list>
-    </div>
-    <div style="paddingTop:10px;textAlign:center">
-      <el-pagination
-        class="page"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :current-page="pageNum"
-        :page-sizes="[10, 50, 100]"
-        :page-size="pageSize"
-        layout="total, prev, pager, next, jumper"
-        :total="total"
-      ></el-pagination>
-    </div>
-  </div>
-</template>
-
-<script>
-import apiSystem from "@/api/apiSystem";
-import {
-  queryList,
-  deleteFormDataById,
-  queryFormByMenu,
-  queryListdesign
-} from "@/api/apiFormBuilder/menu.js";
-import tableList from "@/formBuilder/components/app-main/components/components/tableList.vue";
-import formAttrDefault from "@/store/formBuilder/formAttrDefault";
-import _ from "lodash-es";
-export default {
-  name: "",
-  mixins: [],
-  extends: {},
-  components: {
-    tableList
-  },
-  props: {},
-  data() {
-    return {
-      title: "",
-      form: {
-        companyNo: "",
-        departmentNo: "",
-        staffNo: "",
-        operator: ""
-      },
-      orgOptions: [],
-      depOptions: [],
-      cascaderProps: {
-        checkStrictly: true,
-        value: "id",
-        label: "name",
-        children: "children"
-      },
-      staffs: [],
-      count: 1,
-      menuId: "",
-      formDesc: {},
-      formData: {},
-      isLoading: false,
-      tableData: [],
-      tableConfig: [],
-      buttons: [
-        {
-          name: "编辑",
-          func: e => {
-            this.editFormData(e);
-          },
-          event: "handleButton"
-        },
-        {
-          name: "删除",
-          func: e => {
-            this.deleteFormData(e);
-          },
-          event: "handleButton"
-        }
-        // {
-        //   name: "查看",
-        //   func: (e) => {
-        //     this.goFormData(e);
-        //   },
-        //   event: "handleButton"
-        // }
-      ],
-      pageNum: 1,
-      total: 0,
-      pageSize: 10,
-      formDesign: {}
-    };
-  },
-  watch: {
-    $route(to, from) {
-      this.init();
-    }
-  },
-  computed: {
-    formAttr() {
-      return Object.assign({}, formAttrDefault, {
-        submitBtnText: "查询",
-        resetBtnText: "重置",
-        isShowSubmitBtn: true,
-        isShowResetBtn: true,
-        inline: true
-      });
-    },
-    user() {
-      return this.$store.state.user;
-    }
-  },
-  methods: {
-    async deleteFormData(obj) {
-      this.$confirm("确定要删除这条数据吗", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-        closeOnClickModal: false
-      })
-        .then(async() => {
-          const res = await deleteFormDataById({ id: obj["_id"] });
-          this.getList();
-        })
-        .catch(() => {});
-    },
-    goAddFormData() {
-      this.$router.push({
-        name: "formGeneration",
-        params: { id: this.menuId },
-        query: { title: "新增" + this.title }
-      });
-    },
-    handleOrgChange(val) {
-      this.form.departmentNo = "";
-      this.depOptions = [];
-      this.form.staffNo = "";
-      this.staffs = [];
-      this.form.companyNo = val;
-      this.depList(val);
-    },
-    handleChange(val) {
-      this.form.staffNo = "";
-      this.staffs = [];
-      this.form.departmentNo = val[val.length - 1];
-      this.getStaffsList(this.form.departmentNo);
-    },
-    async depList(data) {
-      this.count++;
-      const res = await apiSystem.deplist(data);
-      if (res.data.code == 200) {
-        this.depOptions = res.data.data;
-      }
-    },
-    async getStaffsList(id) {
-      const res = await apiSystem.getUserByParentId(id);
-      if (res.data.code == 200) {
-        this.staffs = res.data.data;
-      }
-    },
-    async companyList(data) {
-      const res = await apiSystem.companylist(data);
-      this.orgOptions = res.data.data;
-    },
-    // 查询按钮
-    async handleRequest(data) {
-      const _this = this;
-      const query = {};
-      Object.keys(data).forEach(item => {
-        const type = _this.setType(_this.formDesc[item].type);
-        const value = data[item] ? data[item] : "";
-        query[item] = { value: value, type: type };
-      });
-      Object.keys(_this.form).forEach(item => {
-        const type = item == "operator" ? "like" : "eque";
-        query[item] = { value: _this.form[item], type: type };
-      });
-      //   query = Object.assign(query, { title: "5" })
-      const parse = JSON.stringify(query);
-      const res = await queryList({
-        menuId: this.menuId,
-        companyNo: this.user.cno,
-        userNo: this.user.no,
-        formId: this.formId,
-        pageNum: this.pageNum,
-        pageSize: this.pageSize,
-        data: parse
-      });
-      if (res.data.state == "ok") {
-        this.tableData = res.data.data.formDatas.list;
-        this.total = res.data.data.formDatas.totalRow;
-      } else {
-        this.$message.error(
-          res.data.msg ? res.data.msg : "请求失败，请刷新重试"
-        );
-      }
-    },
-    findKeyInDesign(item, v) {
-      const arr = this.formDesign[item.key].attrs.columns.filter(
-        (val, index) => val.prop && val.prop == v.prop
-      );
-      return arr[0] ? arr[0] : {};
-    },
-    formatterConfig(columns) {
-      const _this = this;
-
-      const config = columns.map(item => {
-        // if (item.label !== "数据标题") {
-        const type =
-          item.label !== "数据标题" ? _this.formDesign[item.key].type : "input";
-        let options = [];
-        if (type != "custom-table") {
-          options =
-            (_this.formDesign[item.key] &&
-              _this.formDesign[item.key].options) ||
-            [];
-        } else {
-          item.children.forEach((v, i) => {
-            const obj = _this.findKeyInDesign(item, v);
-            const childType = obj.content.type
-              ? obj.content.type.replace("ele-form-", "")
-              : "";
-            const childOption = obj.content.options || [];
-            item.children[i] = { ...v, type: childType, options: childOption };
-          });
-        }
-        return { ...item, type: type, options: options };
-        // }
-      });
-      return config;
-    },
-    // 设置查询数据
-    setType(type) {
-      const config = {
-        input: "like",
-        select: "eque",
-        date: "eque",
-        time: "eque",
-        daterange: "interval",
-        timerange: "interval"
-      };
-      return config[type];
-    },
-    // 重置按钮
-    handleRest() {
-      this.form = {
-        companyNo: "",
-        departmentNo: "",
-        staffNo: "",
-        operator: ""
-      };
-      this.formData = {};
-      this.$refs.form.resetFields();
-      this.getList();
-    },
-    async getList() {
-      const res = await queryList({
-        menuId: this.menuId,
-        companyNo: this.user.cno,
-        userNo: this.user.no,
-        formId: this.formId,
-        pageNum: this.pageNum,
-        pageSize: this.pageSize,
-        data: "{}"
-      });
-      if (res.data.state == "ok") {
-        this.tableData = res.data.data.formDatas.list;
-        this.total = res.data.data.formDatas.totalRow;
-      } else {
-        this.$message.error(
-          res.data.msg ? res.data.msg : "请求失败，请刷新重试"
-        );
-      }
-    },
-    // 编辑跳转
-    editFormData(obj) {
-      this.$router.push({
-        name: "formGeneration",
-        params: { id: this.menuId },
-        query: { dataId: obj._id, title: "编辑" + this.title }
-      });
-    },
-    goFormData(obj) {
-      this.$router.push({
-        name: "formDataDetail",
-        params: { id: this.menuId },
-        query: { auditId: obj.content.auditId }
-      });
-    },
-    // 获取formId
-    async getFormId() {
-      const { data } = await queryFormByMenu({
-        menuId: this.menuId,
-        companyNo: this.user.cno
-      });
-      if (data.state == "ok") {
-        this.formId = data.data.id;
-        const formDesc = data.data.content.formDesc;
-        this.title = data.data.name;
-        Object.keys(formDesc).forEach(item => {
-          if (formDesc[item].type.indexOf("columns") > -1) {
-            Object.assign(
-              formDesc,
-              _.keyBy(formDesc[item].attrs.columns, "field")
-            );
-          }
-        });
-        this.formDesign = formDesc;
-        this.getList();
-        this.getConfig();
-      }
-    },
-    // 获取列表配置
-    async getConfig() {
-      const vm = this;
-      const parse = {
-        companyNo: this.user.cno,
-        menuId: this.menuId,
-        formId: this.formDesId
-      };
-      const res = await queryListdesign(parse);
-      if (res.data.state == "ok" && res.data.data.content) {
-        const content = res.data.data.content;
-        this.formDesc = content.formDesc;
-        const tableConfig = [];
-        content.tableConfig.forEach(item => {
-          if (vm.formDesign[item.prop] || item.label == "数据标题") {
-            tableConfig.push({
-              label: item.label,
-              key: item.prop,
-              children: item.children
-            });
-          }
-        });
-        this.tableConfig = this.formatterConfig(tableConfig);
-        console.log(
-          "🚀 ~ file: designListPage.vue ~ line 377 ~ getConfig ~ this.tableConfig",
-          this.tableConfig
-        );
-      }
-    },
-    handleSizeChange(val) {
-      this.pageSize = val;
-      this.handleRequest(this.formData);
-    },
-    handleCurrentChange(val) {
-      this.pageNum = val;
-      this.handleRequest(this.formData);
-    },
-    init() {
-      this.menuId = this.$route.params.id;
-      this.formDesc = {};
-      this.tableConfig = [];
-      this.tableData = [];
-      this.total = 0;
-      this.companyList();
-      this.getFormId();
-    }
-  },
-  created() {
-    this.init();
-  },
-  mounted() {}
-};
-</script>
-<style lang="scss" scoped>
-/deep/ .ele-form-btns {
-  /deep/ .el-button--default {
-    color: #409eff;
-    border-color: #c6e2ff;
-    // background-color: #ecf5ff;
-  }
-}
-.wrapper {
-  padding: 20px;
-
-  .table-contain {
-    margin-top: 20px;
-  }
-}
-</style>
+<template>
+  <div class="wrapper">
+    <el-form
+      ref="form"
+      :inline="true"
+      class="h-search-form"
+      :model="form"
+      label-width="100px"
+    >
+      <el-form-item label="申请单位：">
+        <el-select
+          v-model="form.companyNo"
+          placeholder="请选择申请单位"
+          @change="handleOrgChange"
+        >
+          <el-option
+            v-for="item in orgOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="申请部门：">
+        <el-cascader
+          :show-all-levels="false"
+          placeholder="请选择申请部门"
+          :disabled="!form.companyNo"
+          :options="depOptions"
+          v-model="form.departmentNo"
+          :props="cascaderProps"
+          @change="handleChange"
+          :key="count"
+        ></el-cascader>
+      </el-form-item>
+
+      <el-form-item label="申请人：">
+        <el-select
+          v-model="form.staffNo"
+          placeholder="请选择申请人"
+          clearable
+          :disabled="!form.departmentNo"
+        >
+          <el-option
+            v-for="item in staffs"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+
+      <!-- <el-form-item label="经办人：">
+        <el-input placeholder="请输入经办人" v-model="form.operator" maxlength="30"></el-input>
+      </el-form-item> -->
+    </el-form>
+    <ele-form
+      class="design"
+      :formDesc="formDesc"
+      v-model="formData"
+      :isLoading="isLoading"
+      @request="handleRequest"
+      @reset="handleRest"
+      v-bind="formAttr"
+    >
+    </ele-form>
+    <el-button
+      type="primary"
+      @click="goAddFormData"
+    >新增</el-button>
+    <div class="table-contain">
+      <table-list
+        :formDesign="formDesign"
+        :tableData="tableData"
+        :tableConfig="tableConfig"
+        :buttons="buttons"
+        :title="title"
+        @handleButton="(e)=>e.func(e.row)"
+      ></table-list>
+    </div>
+    <div style="paddingTop:10px;textAlign:center">
+      <el-pagination
+        class="page"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="pageNum"
+        :page-sizes="[10, 50, 100]"
+        :page-size="pageSize"
+        layout="total, prev, pager, next, jumper"
+        :total="total"
+      ></el-pagination>
+    </div>
+  </div>
+</template>
+
+<script>
+import apiSystem from "@/api/apiSystem";
+import {
+  queryList,
+  deleteFormDataById,
+  queryFormByMenu,
+  queryListdesign
+} from "@/api/apiFormBuilder/menu.js";
+import tableList from "@/formBuilder/components/app-main/components/components/tableList.vue";
+import formAttrDefault from "@/store/formBuilder/formAttrDefault";
+import _ from "lodash-es";
+export default {
+  name: "",
+  mixins: [],
+  extends: {},
+  components: {
+    tableList
+  },
+  props: {},
+  data() {
+    return {
+      title: "",
+      form: {
+        companyNo: "",
+        departmentNo: "",
+        staffNo: "",
+        operator: ""
+      },
+      orgOptions: [],
+      depOptions: [],
+      cascaderProps: {
+        checkStrictly: true,
+        value: "id",
+        label: "name",
+        children: "children"
+      },
+      staffs: [],
+      count: 1,
+      menuId: "",
+      formDesc: {},
+      formData: {},
+      isLoading: false,
+      tableData: [],
+      tableConfig: [],
+      buttons: [
+        {
+          name: "编辑",
+          func: e => {
+            this.editFormData(e);
+          },
+          event: "handleButton"
+        },
+        {
+          name: "删除",
+          func: e => {
+            this.deleteFormData(e);
+          },
+          event: "handleButton"
+        }
+        // {
+        //   name: "查看",
+        //   func: (e) => {
+        //     this.goFormData(e);
+        //   },
+        //   event: "handleButton"
+        // }
+      ],
+      pageNum: 1,
+      total: 0,
+      pageSize: 10,
+      formDesign: {}
+    };
+  },
+  watch: {
+    $route(to, from) {
+      this.init();
+    }
+  },
+  computed: {
+    formAttr() {
+      return Object.assign({}, formAttrDefault, {
+        submitBtnText: "查询",
+        resetBtnText: "重置",
+        isShowSubmitBtn: true,
+        isShowResetBtn: true,
+        inline: true
+      });
+    },
+    user() {
+      return this.$store.state.user;
+    }
+  },
+  methods: {
+    async deleteFormData(obj) {
+      this.$confirm("确定要删除这条数据吗", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+        closeOnClickModal: false
+      })
+        .then(async() => {
+          const res = await deleteFormDataById({ id: obj["_id"] });
+          this.getList();
+        })
+        .catch(() => {});
+    },
+    goAddFormData() {
+      this.$router.push({
+        name: "formGeneration",
+        params: { id: this.menuId },
+        query: { title: "新增" + this.title }
+      });
+    },
+    handleOrgChange(val) {
+      this.form.departmentNo = "";
+      this.depOptions = [];
+      this.form.staffNo = "";
+      this.staffs = [];
+      this.form.companyNo = val;
+      this.depList(val);
+    },
+    handleChange(val) {
+      this.form.staffNo = "";
+      this.staffs = [];
+      this.form.departmentNo = val[val.length - 1];
+      this.getStaffsList(this.form.departmentNo);
+    },
+    async depList(data) {
+      this.count++;
+      const res = await apiSystem.deplist(data);
+      if (res.data.code == 200) {
+        this.depOptions = res.data.data;
+      }
+    },
+    async getStaffsList(id) {
+      const res = await apiSystem.getUserByParentId(id);
+      if (res.data.code == 200) {
+        this.staffs = res.data.data;
+      }
+    },
+    async companyList(data) {
+      const res = await apiSystem.companylist(data);
+      this.orgOptions = res.data.data;
+    },
+    // 查询按钮
+    async handleRequest(data) {
+      const _this = this;
+      const query = {};
+      Object.keys(data).forEach(item => {
+        const type = _this.setType(_this.formDesc[item].type);
+        const value = data[item] ? data[item] : "";
+        query[item] = { value: value, type: type };
+      });
+      Object.keys(_this.form).forEach(item => {
+        const type = item == "operator" ? "like" : "eque";
+        query[item] = { value: _this.form[item], type: type };
+      });
+      //   query = Object.assign(query, { title: "5" })
+      const parse = JSON.stringify(query);
+      const res = await queryList({
+        menuId: this.menuId,
+        companyNo: this.user.cno,
+        userNo: this.user.no,
+        formId: this.formId,
+        pageNum: this.pageNum,
+        pageSize: this.pageSize,
+        data: parse
+      });
+      if (res.data.state == "ok") {
+        this.tableData = res.data.data.formDatas.list;
+        this.total = res.data.data.formDatas.totalRow;
+      } else {
+        this.$message.error(
+          res.data.msg ? res.data.msg : "请求失败，请刷新重试"
+        );
+      }
+    },
+    findKeyInDesign(item, v) {
+      const arr = this.formDesign[item.key].attrs.columns.filter(
+        (val, index) => val.prop && val.prop == v.prop
+      );
+      return arr[0] ? arr[0] : {};
+    },
+    formatterConfig(columns) {
+      const _this = this;
+
+      const config = columns.map(item => {
+        // if (item.label !== "数据标题") {
+        const type =
+          item.label !== "数据标题" ? _this.formDesign[item.key].type : "input";
+        let options = [];
+        if (type != "custom-table") {
+          options =
+            (_this.formDesign[item.key] &&
+              _this.formDesign[item.key].options) ||
+            [];
+        } else {
+          item.children.forEach((v, i) => {
+            const obj = _this.findKeyInDesign(item, v);
+            const childType = obj.content.type
+              ? obj.content.type.replace("ele-form-", "")
+              : "";
+            const childOption = obj.content.options || [];
+            item.children[i] = { ...v, type: childType, options: childOption };
+          });
+        }
+        return { ...item, type: type, options: options };
+        // }
+      });
+      return config;
+    },
+    // 设置查询数据
+    setType(type) {
+      const config = {
+        input: "like",
+        select: "eque",
+        date: "eque",
+        time: "eque",
+        daterange: "interval",
+        timerange: "interval"
+      };
+      return config[type];
+    },
+    // 重置按钮
+    handleRest() {
+      this.form = {
+        companyNo: "",
+        departmentNo: "",
+        staffNo: "",
+        operator: ""
+      };
+      this.formData = {};
+      this.$refs.form.resetFields();
+      this.getList();
+    },
+    async getList() {
+      const res = await queryList({
+        menuId: this.menuId,
+        companyNo: this.user.cno,
+        userNo: this.user.no,
+        formId: this.formId,
+        pageNum: this.pageNum,
+        pageSize: this.pageSize,
+        data: "{}"
+      });
+      if (res.data.state == "ok") {
+        this.tableData = res.data.data.formDatas.list;
+        this.total = res.data.data.formDatas.totalRow;
+      } else {
+        this.$message.error(
+          res.data.msg ? res.data.msg : "请求失败，请刷新重试"
+        );
+      }
+    },
+    // 编辑跳转
+    editFormData(obj) {
+      this.$router.push({
+        name: "formGeneration",
+        params: { id: this.menuId },
+        query: { dataId: obj._id, title: "编辑" + this.title }
+      });
+    },
+    goFormData(obj) {
+      this.$router.push({
+        name: "formDataDetail",
+        params: { id: this.menuId },
+        query: { auditId: obj.content.auditId }
+      });
+    },
+    // 获取formId
+    async getFormId() {
+      const { data } = await queryFormByMenu({
+        menuId: this.menuId,
+        companyNo: this.user.cno
+      });
+      if (data.state == "ok") {
+        this.formId = data.data.id;
+        const formDesc = data.data.content.formDesc;
+        this.title = data.data.name;
+        Object.keys(formDesc).forEach(item => {
+          if (formDesc[item].type.indexOf("columns") > -1) {
+            Object.assign(
+              formDesc,
+              _.keyBy(formDesc[item].attrs.columns, "field")
+            );
+          }
+        });
+        this.formDesign = formDesc;
+        this.getList();
+        this.getConfig();
+      }
+    },
+    // 获取列表配置
+    async getConfig() {
+      const vm = this;
+      const parse = {
+        companyNo: this.user.cno,
+        menuId: this.menuId,
+        formId: this.formDesId
+      };
+      const res = await queryListdesign(parse);
+      if (res.data.state == "ok" && res.data.data.content) {
+        const content = res.data.data.content;
+        this.formDesc = content.formDesc;
+        const tableConfig = [];
+        content.tableConfig.forEach(item => {
+          if (vm.formDesign[item.prop] || item.label == "数据标题") {
+            tableConfig.push({
+              label: item.label,
+              key: item.prop,
+              children: item.children
+            });
+          }
+        });
+        this.tableConfig = this.formatterConfig(tableConfig);
+        console.log(
+          "🚀 ~ file: designListPage.vue ~ line 377 ~ getConfig ~ this.tableConfig",
+          this.tableConfig
+        );
+      }
+    },
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.handleRequest(this.formData);
+    },
+    handleCurrentChange(val) {
+      this.pageNum = val;
+      this.handleRequest(this.formData);
+    },
+    init() {
+      this.menuId = this.$route.params.id;
+      this.formDesc = {};
+      this.tableConfig = [];
+      this.tableData = [];
+      this.total = 0;
+      this.companyList();
+      this.getFormId();
+    }
+  },
+  created() {
+    this.init();
+  },
+  mounted() {}
+};
+</script>
+<style lang="scss" scoped>
+/deep/ .ele-form-btns {
+  /deep/ .el-button--default {
+    color: #409eff;
+    border-color: #c6e2ff;
+    // background-color: #ecf5ff;
+  }
+}
+.wrapper {
+  padding: 20px;
+
+  .table-contain {
+    margin-top: 20px;
+  }
+}
+</style>