删除菜单

src/views/dashboard/index.vue

 <template>
-  <div class="dashboard-container">
-    <div class="dashboard-text">当前用户: {{ name }}</div>
-    <div class="dashboard-text">当前权限: <span v-for="role in roles" :key="role">{{ role }}</span></div>
-  </div>
+<!--  <div class="dashboard-container">-->
+<!--    <div class="dashboard-text">当前用户: {{ name }}</div>-->
+<!--    <div class="dashboard-text">当前权限: <span v-for="role in roles" :key="role">{{ role }}</span></div>-->
+<!--  </div>-->
 </template>
 
 <script>

src/views/instance/TaskDetail.vue

-<!--
- * @Description: 待办事项、已办事项 的详情页
- * @version:
- * @Author: jooey wong
- * @Date: 2020-06-24 15:33:44
- * @LastEditors: jooey wong
- * @LastEditTime: 2020-06-28 11:01:44
--->
-<template>
-  <div class="instance-task-detail">
-    <div class="instance-task-detail-title">{{ title }}</div>
-    <field-item
-      v-for="(field, index) in fields"
-      :key="index"
-      class="task-item"
-      :field="field"
-      :disabled="field.isEdit === '0'"
-      :to-show="field.isEdit === '0' || toShow"
-      :api-params="apiParam"
-      :can-click="canClick"
-      :cannot-drag="true"
-    />
-    <div class="bottom-btn">
-      <el-button
-        v-for="(item, index) in commitButtons"
-        :key="index"
-        type="primary"
-        @click.stop="buttonClick(item)"
-      >
-        {{ item }}
-      </el-button>
-    </div>
-  </div>
-</template>
-
-<script>
-import fieldItem from '@/components/formDesigner/fieldItem'
-export default {
-  components: {
-    fieldItem
-  },
-  data() {
-    return {
-      fields: [],
-      // 当为查看已办事项时，置为true
-      toShow: false,
-      apiParam: {},
-      // 禁止点击事件
-      canClick: true,
-      // 按钮列表
-      commitButtons: []
-    }
-  },
-  computed: {
-    pageType() {
-      return this.$route.params.param
-    },
-    /**
-     * @author: jooey wong
-     * @description: 页面标题
-     * @param: {Object}
-     * @return:
-     */
-    title() {
-      const switchData = {
-        1: '项目审核',
-        2: '提交表单'
-      }
-      return switchData[this.pageType]
-    }
-  },
-  watch: {},
-  created() {
-    this.getProjectInfo()
-    this.getCommitButton()
-  },
-  mounted() {},
-  beforeCreate() {},
-  beforeMount() {},
-  beforeUpdate() {},
-  updated() {},
-  beforeDestroy() {},
-  destroyed() {},
-  activated() {}, // 如果页面有keep-alive缓存功能，这个函数会触发
-  methods: {
-    /**
-     * @author: jooey wong
-     * @description: 查询当前项目的实例字段值 数组
-     * @param: {}
-     * @return:
-     */
-    getProjectInfo() {
-      // api 请求回来的原始数据
-      const res = {
-        code: '200',
-        msg: '操作成功',
-        timestamp: 1593310595388,
-        data: [
-          {
-            businessId: 'b38cc9e2a1a4496d873278a695901825',
-            templateId: '3e793318009540f5b209af949bbfe0d5',
-            fieldName: '456',
-            fieldType: 'select',
-            fieldHint: '输入提示',
-            fieldDefault: '',
-            fieldOrder: 1,
-            fieldColumn: 24,
-            isRequired: 0,
-            createBy: '281',
-            createDate: '2020-06-17T15:35:32',
-            updateBy: '281',
-            updateDate: '2020-06-17T16:26:31',
-            delFlag: 1,
-            flag: 0,
-            fieldOptionMode: 'origin',
-            fieldOptionStatic:
-              '[{"label":"选项1","value":"6bfd9c00-9faf"},{"label":"选项2","value":"e0baedb0-92e2"}]',
-            fieldOptionOrigin:
-              '{"mode":"builtIn","builtIn":"getServiceType","configOut":{"name":"","method":"get"}}',
-            specialTag: 'serviceType',
-            showHeader: 1,
-            sort: 2,
-            filter: 0,
-            tableHeaderOrder: 0,
-            instanceId: '1846a3b479cb4819af6fbcc74837c720',
-            isShow: '1',
-            isEdit: '0',
-            fieldValue: 'szjizhan'
-          },
-          {
-            businessId: '0d8d113c728d49a78aa769feb13201bb',
-            templateId: '3e793318009540f5b209af949bbfe0d5',
-            fieldName: '123',
-            fieldType: 'radio',
-            fieldHint: '123',
-            fieldDefault: '',
-            fieldOrder: 2,
-            fieldColumn: 24,
-            isRequired: 0,
-            createBy: '281',
-            createDate: '2020-06-17T15:35:32',
-            updateBy: '281',
-            updateDate: '2020-06-17T16:26:31',
-            delFlag: 1,
-            flag: 0,
-            fieldOptionMode: 'origin',
-            fieldOptionStatic:
-              '[{"label":"选项1","value":"3491c82e-980c"},{"label":"选项2","value":"52cebbdb-94f6"}]',
-            fieldOptionOrigin:
-              '{"mode":"builtIn","builtIn":"getProjectStage","configOut":{"name":"","method":"get"}}',
-            specialTag: '',
-            showHeader: 1,
-            sort: 2,
-            filter: 0,
-            tableHeaderOrder: 0,
-            instanceId: '1846a3b479cb4819af6fbcc74837c720',
-            isShow: '1',
-            isEdit: '0',
-            fieldValue: 'guidang'
-          },
-          {
-            businessId: '05e37d4a6fec4837b0819da78029add2',
-            templateId: '3e793318009540f5b209af949bbfe0d5',
-            fieldName: '123',
-            fieldType: 'input',
-            fieldHint: '请输入内容',
-            fieldDefault: '',
-            fieldOrder: 0,
-            fieldColumn: 24,
-            isRequired: 0,
-            createBy: '281',
-            createDate: '2020-06-17T15:35:32',
-            updateBy: '281',
-            updateDate: '2020-06-17T16:26:31',
-            delFlag: 1,
-            flag: 0,
-            fieldOptionStatic: '',
-            fieldOptionOrigin: '',
-            specialTag: '',
-            showHeader: 1,
-            sort: 2,
-            filter: 0,
-            tableHeaderOrder: 0,
-            ruleRegular: '',
-            ruleApi: '',
-            instanceId: '1846a3b479cb4819af6fbcc74837c720',
-            isShow: '1',
-            isEdit: '0',
-            fieldValue: '222222'
-          }
-        ]
-      }
-      const groupMap = {}
-      const topFields = []
-      res.data.forEach((field, index) => {
-        field.dead = false
-        // 将group字段中value未修改前放入 一个字段数组中、方便“更新保存”时比对“group字段本身（不包括子字段）”是否改变
-        if (field.parentId) {
-          if (!groupMap[field.parentId]) {
-            groupMap[field.parentId] = []
-          }
-          groupMap[field.parentId].push(field)
-        } else {
-          topFields.push(field)
-        }
-      })
-      this.$ha.handleBackFields(topFields, (field) => {
-        if (field.type === 'group') {
-          // field.value中存放的应该是groupId ,然后从映射groupMap去除该id下的group子字段数组
-          field.value = this.$ha.handleBackFields(
-            groupMap[field.value],
-            (son) => {
-              if (son.fieldValue !== undefined) {
-                son.value = this.$ha.parseJsonString(son.fieldValue)
-              }
-            }
-          )
-        } else if (field.fieldValue !== undefined) {
-          field.value = this.$ha.parseJsonString(field.fieldValue)
-        }
-        // 根据任务节点id获取节点详情信息，无需验证isShow
-        if (field.isShow === '1') {
-          this.fields.push(field)
-        } else if (this.detailType === 'done') {
-          this.fields.push(field)
-        }
-        // this.fields.push(field)
-      })
-    },
-    /**
-    * @author: WangXinYu
-    * @describe: 查询按钮
-    * @param: {}
-    * @return:
-    **/
-    getCommitButton() {
-      const res = { 'code': '200', 'msg': '操作成功', 'timestamp': 1593322152972, 'data': ['通过'] }
-      this.commitButtons.splice(0, 0, ...res.data)
-    },
-    /**
-    * @author: WangXinYu
-    * @describe: 通过驳回事件
-    * @param: {String} name
-    * @return:
-    **/
-    buttonClick(name) {
-      const params = {
-        processId: this.processId,
-        instanceId: this.instanceId,
-        commitMessage: name,
-        userTaskId: this.userTaskId,
-        queryProcessCommitDtoList: []
-      }
-      const isError = this.$ha.validateFields(this, this.fields, (field) => {
-        params.queryProcessCommitDtoList.push(field)
-      })
-      if (isError) {
-        this.$message.warning('请检查表单填写！')
-      } else {
-        this.openFullScreenLoading('处理中...')
-        params.queryProcessCommitDtoList = JSON.stringify(
-          params.queryProcessCommitDtoList.map((field) => {
-            return {
-              fieldId: field.businessId,
-              fieldValue:
-                typeof field.value === 'string'
-                  ? field.value
-                  : JSON.stringify(field.value),
-              remarks: field.remarks
-            }
-          })
-        )
-        this.$http.post('/pmsinstance/complateTask', params).then((res) => {
-          this.closeFullScreenLoading()
-          this.$message.success(name + '成功')
-          window.history.back(-1)
-        }).catch(err => {
-          this.closeFullScreenLoading()
-        })
-      }
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.instance-task-detail {
-  padding: 12px;
-  &-title {
-    text-align: left;
-    margin-bottom: 5px;
-    font-size: 24px;
-    font-weight: 400;
-    padding-bottom: 8px;
-    border-bottom: 1px dashed #d3d3d3;
-  }
-  .bottom-btn {
-    text-align: center;
-  }
-}
-</style>

src/views/instance/TodoList.vue

-<!--
- * @Descripttion: 待办事项页面
- * @version:
- * @Author: jooey wong
- * @Date: 2020-06-24 11:09:48
- * @LastEditors: jooey wong
- * @LastEditTime: 2020-07-07 15:00:33
--->
-<template>
-  <div class="instance-todo-list">
-    <el-form
-      ref="instance-search-form"
-      size="small"
-      :inline="true"
-      :model="searchForm"
-      class="instance-todo-list-search-param"
-    >
-      <el-form-item label="申请人">
-        <el-input v-model.trim="searchForm.user" :maxlength="30" />
-      </el-form-item>
-      <el-form-item label="申请人所属部门">
-        <el-cascader
-          v-model="searchForm.userDept"
-          :options="userDeptOptions"
-          :props="{ value: 'label',label: 'label' }"
-          :show-all-levels="false"
-          @change="userDeptHandleChange"
-        />
-      </el-form-item>
-      <el-form-item label="业务类型">
-        <el-select v-model="searchForm.process" clearable placeholder="请选择业务类型">
-          <el-option
-            v-for="(item, idx) in processOptions"
-            :key="'process-options-' + idx"
-            :label="item.processName"
-            :value="item.businessId"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="serachSubmit" />
-        <el-button
-          type="danger"
-          icon="el-icon-refresh-left"
-          @click="resetSearchForm"
-        />
-      </el-form-item>
-    </el-form>
-    <el-table
-      ref="mainTable"
-      :data="tableData.rows"
-      border
-    >
-      <el-table-column type="index" label="序号" width="50" />
-      <el-table-column prop="userName" label="申请人" />
-      <el-table-column prop="deptName" label="申请人所在部门" />
-      <el-table-column prop="processName" label="业务类型" />
-      <el-table-column prop="createTime" label="任务开始时间" />
-      <el-table-column prop="actName" label="当前任务" />
-      <el-table-column label="操作" width="250">
-        <template slot-scope="scope">
-          <el-button
-            v-if="pageType === 1"
-            size="small"
-            type="primary"
-            @click="routerGo(scope.row)"
-          >
-            办理
-          </el-button>
-          <el-button
-            v-else
-            size="small"
-            type="primary"
-            @click="routerGo(scope.row)"
-          >
-            查看
-          </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination
-      class="instance-todo-list-pagination"
-      :current-page="currentPage"
-      background
-      :page-size="pageSize"
-      layout="total, prev, pager, next, jumper"
-      :total="tableData.total"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    />
-  </div>
-</template>
-
-<script>
-// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
-// 例如：import 《组件名称》 from '《组件路径》';
-import { toDoTaskBypage, queryWfProcessHis } from '@/api/workflow.js'
-import { treeselect } from '@/api/system/dept'
-export default {
-  // import引入的组件需要注入到对象中才能使用
-  components: {},
-  data() {
-    // 这里存放数据
-    return {
-      // 申请人所属部门选项
-      userDeptOptions: [],
-      // 条件查询form
-      searchForm: {
-        name: '',
-        process: '',
-        user: '',
-        userDept: []
-      },
-      // 所属流程选项
-      processOptions: [],
-      // tableData 存放所有分页数据
-      tableData: {},
-      currentPage: 1, // 默认显示页面为1
-      pageSize: 10 // 每页的数据条数
-    }
-  },
-  // 监听属性 类似于data概念
-  computed: {
-    /**
-     * @author: jooey wong
-     * @description: 因为待办事项、个人待办共用一个页面，所以根据此值区分
-     * @return: {number} pageType 1:待办事项 2：已办事项
-     */
-    pageType() {
-      return this.$route.meta.pageType
-    }
-  },
-  // 监控data中的数据变化
-  watch: {},
-  // 生命周期 - 创建完成（可以访问当前this实例）
-  created() {
-    // queryTodoListData()
-    // 查询表格信息
-    this.queryTableData()
-    // 查询所属流程options
-    this.queryBelongingProcess()
-    // 查询申请人部门
-    this.getTreeselect()
-  },
-  // 生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {},
-  beforeCreate() {}, // 生命周期 - 创建之前
-  beforeMount() {}, // 生命周期 - 挂载之前
-  beforeUpdate() {}, // 生命周期 - 更新之前
-  updated() {}, // 生命周期 - 更新之后
-  beforeDestroy() {}, // 生命周期 - 销毁之前
-  destroyed() {}, // 生命周期 - 销毁完成
-  activated() {},
-  // 方法集合
-  methods: {
-    /** 查询部门下拉树结构 */
-    getTreeselect() {
-      treeselect().then(response => {
-        this.userDeptOptions = []
-        this.userDeptOptions = this.userDeptOptions.concat(response.data)
-      })
-    },
-    /**
-     * @Description: 所属部门改变调
-     * @author liuhuaizhi
-     * @date 2020/7/23
-    */
-    userDeptHandleChange(data) {
-    },
-    /**
-     * @Description: 条件查询
-     * @author liuhuaizhi
-     * @date 2020/7/20
-    */
-    serachSubmit() {
-      this.currentPage = 1
-      this.pageSize = 10
-      this.queryTableData()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 查询所属流程options
-     * @param {}
-     * @return:
-     */
-    queryBelongingProcess() {
-      queryWfProcessHis().then(res => {
-        this.processOptions = res.data
-      })
-    },
-    /**
-     * @author: jooey wong
-     * @description: 查询表格信息
-     * @param {}
-     * @return:
-     */
-    queryTableData() {
-      toDoTaskBypage({ page: this.currentPage, rows: this.pageSize, userName: this.searchForm.user, deptName: (this.searchForm.userDept.length > 0 ? this.searchForm.userDept[this.searchForm.userDept.length - 1] : ''), processId: this.searchForm.process }).then(res => {
-        this.tableData = res
-      }).catch(err => {
-      })
-    },
-    /**
-      * @Description: 页数变化
-      * @author liuhuaizhi
-      * @date 2020/7/17
-     */
-    handleSizeChange() {
-      this.queryTableData()
-    },
-    /**
-     * @Description: 当前页变化
-     * @author liuhuaizhi
-     * @date 2020/7/17
-    */
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.queryTableData()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 重置查询表单
-     * @return:
-     */
-    resetSearchForm() {
-      this.searchForm = {
-        name: '',
-        process: '',
-        user: '',
-        userDept: []
-      }
-      this.$refs['instance-search-form'].resetFields()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 暂时在这儿写页面跳转，移动后使用mixin函数跳转
-     * @param {Object} row 表格行数据
-     * @return:
-     */
-    routerGo(row) {
-      this.$router.push({
-        path: '/businessManage/template',
-        query: {
-          taskId: row.userTaskId,
-          instanceId: row.instanceId,
-          flowType: 2, // 流程类型
-          processName: row.processName,
-          // 状态
-          instanceStatus: row.instanceStatus,
-          processId: row.processId
-        }
-      })
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.instance-todo-list {
-  padding: 12px;
-  &-pagination {
-    text-align: right;
-    margin-top: 8px;
-  }
-}
-</style>

src/views/instance/components/TemplateEndorsementDialog.vue

-<template>
-  <el-dialog
-    class="TemplateEndorsementDialog"
-    title="加签"
-    :visible.sync="endorsementDialogFormVisible"
-    :before-close="beforeClose"
-    @closed="resetForm"
-  >
-    <div class="main-dialog-content">
-      <el-form
-        ref="dialogSearchForm"
-        size="small"
-        :inline="true"
-        :model="dialogSearchForm"
-        label-width="80px"
-      >
-        <el-form-item label="部门">
-          <el-input v-model.trim="dialogSearchForm.department" :maxlength="30" />
-        </el-form-item>
-        <el-form-item label="名称">
-          <el-input v-model.trim="dialogSearchForm.department" :maxlength="30" />
-        </el-form-item>
-        <el-button type="primary" size="small">查 询</el-button>
-      </el-form>
-      <el-table
-        ref="multipleTable"
-        :data="tableData"
-        tooltip-effect="dark"
-        style="width: 100%"
-        height="200px"
-        @selection-change="handleSelectionChange"
-      >
-        <el-table-column type="selection" width="55" />
-        <el-table-column prop="department" label="部门" show-overflow-tooltip />
-        <el-table-column :show-overflow-tooltip="true" prop="name" label="姓名" width="120" />
-      </el-table>
-      <el-pagination
-        class="my-right-pagination"
-        background
-        layout="prev, pager, next"
-        :total="1000"
-      />
-      <el-form ref="form" :model="submitForm" label-width="80px">
-        <el-form-item label="加签类型">
-          <el-radio v-model="submitForm.type" label="1">前加签</el-radio>
-          <el-radio v-model="submitForm.type" label="2">后加签</el-radio>
-        </el-form-item>
-      </el-form>
-    </div>
-    <div slot="footer" class="dialog-footer">
-      <el-button type="primary">确 定</el-button>
-      <el-button @click="closeDialog">取 消</el-button>
-
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  name: 'TemplateEndorsementDialog',
-  components: {},
-  props: {
-    // 控制dialog是否能显示
-    visible: {
-      type: Boolean,
-      require: true
-    }
-  },
-  data() {
-    return {
-      // 控制显隐
-      endorsementDialogFormVisible: false,
-      // 表单标签宽度
-      formLabelWidth: '100px',
-      // 条件查询表单
-      dialogSearchForm: {
-        // 部门
-        department: '',
-        // 人员名称
-        name: ''
-      },
-      // 表格数据
-      tableData: [
-        {
-          name: '李逍遥',
-          department: '网络办'
-        },
-        {
-          name: '王小虎',
-          department: '政治部'
-        }
-      ],
-      // 需要提交的表单
-      submitForm: {
-        // 加签类型
-        type: '1',
-      },
-      // 多选选中的数据
-      multipleSelection: []
-    }
-  },
-  computed: {},
-  watch: {
-    visible: {
-      handler(newVal) {
-        this.endorsementDialogFormVisible = newVal
-      },
-      immediate: true
-    }
-  },
-  created() {},
-  mounted() {},
-  methods: {
-    /**
-     * @author WangXinYu
-     * @describe 关闭模态框前的回调
-     **/
-    beforeClose(done) {
-      this.$emit('update:visible', false)
-      done()
-    },
-    /**
-     * @author WangXinYu
-     * @describe 重置表单
-     **/
-    resetForm() {},
-    /**
-     * @author WangXinYu
-     * @describe 关闭模态框
-     **/
-    closeDialog() {
-      this.$emit('update:visible', false)
-    },
-    /**
-    * @author WangXinYu
-    * @describe 表格选中的时候 触发事件
-    * @param {Array} val 多选选中的数组
-    **/
-    handleSelectionChange(val) {
-      this.multipleSelection = val
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.TemplateEndorsementDialog {
-  .my-right-pagination {
-    text-align: right;
-    margin-top: 8px;
-  }
-}
-</style>

src/views/instance/components/TemplateRejectDialog.vue

-<template>
-  <el-dialog
-    class="rejectDialog"
-    title="拒绝"
-    :visible.sync="rejectDialogFormVisible"
-    :before-close="beforeClose"
-    @closed="resetForm"
-  >
-    <el-form :model="rejectForm">
-      <el-form-item label="拒绝备注" :label-width="formLabelWidth">
-        <el-input
-          v-model="rejectForm.remark"
-          :maxlength="30"
-          type="textarea"
-          :autosize="{ minRows: 2, maxRows: 4 }"
-          placeholder="请输入拒绝备注"
-        />
-      </el-form-item>
-    </el-form>
-    <div slot="footer" class="dialog-footer">
-      <el-button @click="closeDialog">取 消</el-button>
-      <el-button
-        type="primary"
-        @click="onSubmit"
-      >确 定</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  name: 'RejectDialog',
-  components: {},
-  props: {
-    // 控制dialog是否能显示
-    visible: {
-      type: Boolean,
-      require: true
-    }
-  },
-  data() {
-    return {
-      // 控制显隐
-      rejectDialogFormVisible: false,
-      // 表单标签宽度
-      formLabelWidth: '100px',
-      // 表单数据
-      rejectForm: {
-        remark: ''
-      }
-    }
-  },
-  computed: {},
-  watch: {
-    visible: {
-      handler(newVal) {
-        this.rejectDialogFormVisible = newVal
-      },
-      immediate: true
-    }
-  },
-  created() {},
-  mounted() {},
-  methods: {
-    /**
-    * @author WangXinYu
-    * @describe 关闭模态框前的回调
-    **/
-    beforeClose(done) {
-      this.$emit('update:visible', false)
-      done()
-    },
-    /**
-    * @author WangXinYu
-    * @describe 重置表单
-    **/
-    resetForm() {
-      this.rejectForm = {
-        remark: ''
-      }
-    },
-    /**
-    * @author WangXinYu
-    * @describe 关闭模态框
-    **/
-    closeDialog() {
-      this.$emit('update:visible', false)
-    },
-    /**
-    * @author WangXinYu
-    * @describe 处理确定事件
-    **/
-    onSubmit() {
-      this.$emit('onConfirm', this.rejectForm)
-    }
-  }
-}
-</script>
-
-<style scoped>
-.rejectDialog {
-}
-</style>

src/views/instance/doneList.vue

-<!--
- * @Descripttion: 已办事项页面
- * @version:
- * @Author: jooey wong
- * @Date: 2020-06-24 11:09:48
- * @LastEditors: jooey wong
- * @LastEditTime: 2020-07-07 15:00:33
--->
-<template>
-  <div class="instance-todo-list">
-    <el-form
-      ref="instance-search-form"
-      size="small"
-      :inline="true"
-      :model="searchForm"
-      class="instance-todo-list-search-param"
-    >
-      <el-form-item label="申请人">
-        <el-input v-model.trim="searchForm.user" :maxlength="30"/>
-      </el-form-item>
-      <el-form-item label="申请人所属部门">
-        <el-cascader
-          v-model="searchForm.userDept"
-          :options="userDeptOptions"
-          :props="{ value: 'label',label: 'label' }"
-          :show-all-levels="false"
-          @change="userDeptHandleChange"
-        />
-      </el-form-item>
-      <el-form-item label="业务类型">
-        <el-select v-model="searchForm.process" clearable placeholder="请选择业务类型">
-          <el-option
-            v-for="(item, idx) in processOptions"
-            :key="'process-options-' + idx"
-            :label="item.processName"
-            :value="item.businessId"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="审批操作">
-        <el-select v-model="searchForm.status" clearable placeholder="请选择审批操作">
-          <el-option
-            v-for="(item, idx) in statusOptions"
-            :key="'status-options-' + idx"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="serachSubmit" />
-        <el-button
-          type="danger"
-          icon="el-icon-refresh-left"
-          @click="resetSearchForm"
-        />
-      </el-form-item>
-    </el-form>
-    <el-table
-      ref="mainTable"
-      :data="tableData.rows"
-      class="main-table"
-      border
-    >
-      <el-table-column type="index" label="序号" width="50" />
-      <el-table-column prop="userName" label="申请人" />
-      <el-table-column prop="deptName" label="申请人所在部门" />
-      <el-table-column prop="processName" label="业务类型" />
-      <el-table-column prop="createTime" label="任务开始时间" />
-      <el-table-column prop="endTime" label="任务结束时间" />
-      <el-table-column prop="status" label="审批操作" />
-      <el-table-column label="操作" width="250">
-        <template slot-scope="scope">
-          <el-button
-            v-if="pageType === 1"
-            size="small"
-            type="primary"
-            @click="routerGo(scope.row)"
-          >
-            操作
-          </el-button>
-          <el-button
-            v-else
-            size="small"
-            type="primary"
-            @click="routerGo(scope.row)"
-          >
-            查看
-          </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination
-      class="instance-todo-list-pagination"
-      :current-page="currentPage"
-      background
-      :page-size="pageSize"
-      layout="total, prev, pager, next, jumper"
-      :total="tableData.total"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    />
-  </div>
-</template>
-
-<script>
-// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
-// 例如：import 《组件名称》 from '《组件路径》';
-import { doneTaskBypage, queryWfProcessHis } from '@/api/workflow.js'
-import { treeselect } from '@/api/system/dept'
-export default {
-  // import引入的组件需要注入到对象中才能使用
-  components: {},
-  data() {
-    // 这里存放数据
-    return {
-      statusOptions: [
-        {
-          label: '通过',
-          value: '通过'
-        },
-        {
-          label: '驳回',
-          value: '驳回'
-        },
-        {
-          label: '完成',
-          value: '完成'
-        },
-        {
-          label: '提交',
-          value: '提交'
-        },
-        {
-          label: '撤销',
-          value: '撤销'
-        },
-        {
-          label: '拒绝',
-          value: '拒绝'
-        }
-      ],
-      // 申请人所属部门选项
-      userDeptOptions: [],
-      // 条件查询form
-      searchForm: {
-        name: '',
-        process: '',
-        user: '',
-        userDept: [],
-        status: ''
-      },
-      // 所属流程选项
-      processOptions: [],
-      // tableData 存放所有分页数据
-      tableData: {},
-      currentPage: 1, // 默认显示页面为1
-      pageSize: 10 // 每页的数据条数
-    }
-  },
-  // 监听属性 类似于data概念
-  computed: {
-    /**
-     * @author: jooey wong
-     * @description: 因为待办事项、个人待办共用一个页面，所以根据此值区分
-     * @return: {number} pageType 1:待办事项 2：已办事项
-     */
-    pageType() {
-      return this.$route.meta.pageType
-    }
-  },
-  // 监控data中的数据变化
-  watch: {},
-  // 生命周期 - 创建完成（可以访问当前this实例）
-  created() {
-    // queryTodoListData()
-    // 查询表格信息
-    this.queryTableData()
-    // 查询所属流程options
-    this.queryBelongingProcess()
-    // 查询申请人部门
-    this.getTreeselect()
-  },
-  // 生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {},
-  beforeCreate() {}, // 生命周期 - 创建之前
-  beforeMount() {}, // 生命周期 - 挂载之前
-  beforeUpdate() {}, // 生命周期 - 更新之前
-  updated() {}, // 生命周期 - 更新之后
-  beforeDestroy() {}, // 生命周期 - 销毁之前
-  destroyed() {}, // 生命周期 - 销毁完成
-  activated() {},
-  // 方法集合
-  methods: {
-    /**
-     * @Description: 所属部门改变调
-     * @author liuhuaizhi
-     * @date 2020/7/23
-     */
-    userDeptHandleChange(data) {
-    },
-    /** 查询部门下拉树结构 */
-    getTreeselect() {
-      treeselect().then(response => {
-        this.userDeptOptions = []
-        this.userDeptOptions = this.userDeptOptions.concat(response.data)
-      })
-    },
-    /**
-     * @Description: 条件查询
-     * @author liuhuaizhi
-     * @date 2020/7/20
-     */
-    serachSubmit() {
-      this.currentPage = 1
-      this.pageSize = 10
-      this.queryTableData()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 查询所属流程options
-     * @param {}
-     * @return:
-     */
-    queryBelongingProcess() {
-      queryWfProcessHis().then(res => {
-        this.processOptions = res.data
-      })
-    },
-    /**
-     * @author: jooey wong
-     * @description: 查询表格信息
-     * @param {}
-     * @return:
-     */
-    queryTableData() {
-      doneTaskBypage({ page: this.currentPage, rows: this.pageSize, userName: this.searchForm.user, deptName: (this.searchForm.userDept.length > 0 ? this.searchForm.userDept[this.searchForm.userDept.length - 1] : ''), processId: this.searchForm.process, status: this.searchForm.status }).then(res => {
-        this.tableData = res
-      }).catch(err => {
-      })
-    },
-    /**
-      * @Description: 页数变化
-      * @author liuhuaizhi
-      * @date 2020/7/17
-     */
-    handleSizeChange() {
-      this.queryTableData()
-    },
-    /**
-     * @Description: 当前页变化
-     * @author liuhuaizhi
-     * @date 2020/7/17
-    */
-    handleCurrentChange(val) {
-      this.currentPage = val
-      this.queryTableData()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 重置查询表单
-     * @return:
-     */
-    resetSearchForm() {
-      this.searchForm = {
-        name: '',
-        process: '',
-        user: '',
-        userDept: [],
-        status: ''
-      }
-      this.$refs['instance-search-form'].resetFields()
-    },
-    /**
-     * @author: jooey wong
-     * @description: 暂时在这儿写页面跳转，移动后使用mixin函数跳转
-     * @param {Object} row 表格行数据
-     * @return:
-     */
-    routerGo(row) {
-      this.$router.push({
-        path: '/businessManage/template',
-        query: {
-          taskId: row.userTaskId,
-          processName: row.processName,
-          flowType: 3 // 流程类型
-        }
-      })
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.instance-todo-list {
-  padding: 12px;
-  &-pagination {
-    text-align: right;
-    margin-top: 8px;
-  }
-}
-</style>

src/views/instance/js/tableHeader.js

-/**
- * @author: Wang.X.Y/comrade.wang.cn@gmail.com
- * @Date: 2020/7/14
- * @Time: 10:09
- * @Description: 默认表头
- */
-
-export default [
-  {
-    specialTag: 'state',
-    fieldName: '流程状态'
-  },
-  {
-    specialTag: 'name',
-    fieldName: '任务节点'
-  },
-  /* {
-    businessId: 'taskHandler',
-    fieldName: '当前节点处理者'
-  },
-  {
-    businessId: 'stage',
-    fieldName: '项目阶段'
-  },*/
-  {
-    specialTag: 'createBy',
-    fieldName: '申请人'
-  },
-  {
-    specialTag: 'createDate',
-    fieldName: '创建时间'
-  }/*,
-  {
-    businessId: 'updateBy',
-    fieldName: '修改人'
-  },
-  {
-    businessId: 'updateDate',
-    fieldName: '修改日期'
-  }*/
-]

src/views/sample/basicInformation/index.vue

@@ -126,7 +126,35 @@
       @pagination="getList"
     />
     <!--  新增修改弹出  -->
-
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
+        <el-form-item label="pn" prop="pn">
+          <el-input v-model.trim="form.pn" show-word-limit :maxlength="30" placeholder="请输入pn" />
+        </el-form-item>
+        <el-form-item label="qty" prop="qty">
+          <el-input v-model.trim="form.qty" show-word-limit :maxlength="30" placeholder="请输入qty" />
+        </el-form-item>
+        <el-form-item label="name" prop="name">
+          <el-input v-model.trim="form.name" show-word-limit :maxlength="30" placeholder="请输入name" />
+        </el-form-item>
+        <el-form-item label="pgx" prop="pgx">
+          <el-input-number v-model="form.pgx" style="width: 100%" controls-position="right" :min="0" placeholder="请输入pgx" />
+        </el-form-item>
+        <el-form-item label="max_qty" prop="max_qty">
+          <el-input-number v-model="form.max_qty" style="width: 100%" controls-position="right" :min="0" placeholder="请输入max_qty" />
+        </el-form-item>
+        <el-form-item label="min_qty" prop="min_qty">
+          <el-input-number v-model="form.min_qty" style="width: 100%" controls-position="right" :min="0" placeholder="请输入min_qty" />
+        </el-form-item>
+        <el-form-item label="unit" prop="unit">
+          <el-input-number v-model="form.unit" style="width: 100%" controls-position="right" :min="0" placeholder="请输入unit" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="cancel">取 消</el-button>
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -137,6 +165,14 @@ export default {
   name: 'Index',
   data() {
     return {
+      title: '',
+      open: false,
+      form: {
+
+      },
+      rules: {
+        pn: [{ required: true, message: '输入pn', trigger: 'change' }]
+      },
       total: 0,
       loading: false,
       queryParams: {
@@ -153,6 +189,12 @@ export default {
     this.getList()
   },
   methods: {
+    submitForm() {
+
+    },
+    cancel() {
+
+    },
     handleDelete() {
 
     },