Merge remote-tracking branch 'origin/newprotect' into newprotect

src/views/processManagement/basicProcessManagement/componets/processTable.vue

 <template>
   <div>
+    <div class="mb12 font-small-bold">基础工序列表</div>
     <div class="tableList" style="height:600px;">
       <el-scrollbar style="height: 100%;">
         <el-table
-          v-loading="loading"
+          v-loading="allTableArguments.loading"
           class="processList"
           border
-          :data="processList.slice((queryParams.pageNum - 1) * queryParams.pageSize, queryParams.pageNum * queryParams.pageSize)"
+          :data="allTableArguments.processList.slice((allTableArguments.queryParams.pageNum - 1) * allTableArguments.queryParams.pageSize, allTableArguments.queryParams.pageNum * allTableArguments.queryParams.pageSize)"
           style="width: 100%"
           @selection-change="handleSelectionChange"
         >
-          <el-table-column type="index" label="序号" width="50" :index="nIndex" />
+          <el-table-column type="index" label="序号" width="50" :index="allTableArguments.nIndex" />
           <el-table-column label="工序名称" prop="processName" :show-overflow-tooltip="true">
             <template slot-scope="scope">
               {{ scope.row.processName || '-' }}
@@ -62,25 +63,16 @@
 export default {
   name: 'ProcessTable',
   props: {
-    processList: {
-      required: true,
-      type: Array,
-      default: null
-    },
-    queryParams: {
-      required: true,
+    allTableArguments: {
       type: Object,
-      default: null
-    },
-    nIndex: {
-      required: true,
-      type: Number,
-      default: null
-    },
-    loading: {
-      required: true,
-      type: Boolean,
-      default: null
+      default: () => {
+        return {
+          processList: [],
+          queryParams: {},
+          nIndex: 0,
+          loading: true
+        }
+      }
     }
   },
   data() {

src/views/processManagement/basicProcessManagement/index.vue

 <template>
   <div class="app-container">
-
     <!-- TODO: 基础工序管理-->
     <el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
       <el-form-item label="工序名称" prop="roleName">
@@ -33,23 +32,15 @@
         </el-form-item>
       </div>
     </el-form>
-
-    <div class="placeholder" />
-
     <!-- TODO: 中间的分隔符号   -->
+    <div class="placeholder" />
     <div class="main" style="padding:5px 10px">
-
       <!-- TODO: 以下为基础工序管理列表 -->
-      <div class="mb12 font-small-bold">基础工序列表</div>
-
       <transition name="fade-transform" mode="out-in">
         <component
           :is="ProcessTable"
           :key="queryParams.pageNum"
-          :query-params="queryParams"
-          :process-list="processList"
-          :n-index="nIndex"
-          :loading.sync="loading"
+          :all-table-arguments="allTableArguments"
           @handle-detail="handleDetail"
           @handle-update="handleUpdate"
           @handle-delete="handleDelete"
@@ -62,7 +53,6 @@
         :limit.sync="queryParams.pageSize"
         @pagination="getList"
       />
-
     </div>
 
     <!-- TODO: 添加或修改工序配置对话框 -->
@@ -123,75 +113,78 @@ export default {
   components: { Coolbutton, ProcessTable },
   data() {
     return {
+      // TODO: 动态按钮类型
       typeParent: 'text',
       typePrimary: 'primary',
       typeSuccess: 'success',
+      // TODO: 动态按钮名称
       nameParent: '删除',
       resetName: '重置',
       addName: '新增',
       updataName: '修改',
+      // TODO: 动态按钮尺寸
       size: 'mini',
       smallSize: 'small',
+      // TODO: 图标名
       delicon: 'el-icon-delete',
       addIcon: 'el-icon-plus',
       exportIcon: 'el-icon-download',
       resetIcon: '',
       // TODO: 控制只读
       isReadOnly: true,
-      // 遮罩层
+      // TODO: 遮罩层 (加载进度条)
       loading: true,
-      // 非单个禁用
-      single: true,
-      // 非多个禁用
-      multiple: true,
-      // 总条数
+      // TODO: 分页的总条数
       total: 0,
-      // TODO: 工序表格数据
-      processList: null,
-      // TODO: 模拟数据中转表 (为了解决模拟数据的查询问题)
-      toList: [],
-      // 弹出层标题
-      title: '',
+
       // TODO: 是否显示弹出层
       open: false,
-      // TODO: 是否显示弹出层（数据详情）
+      // TODO: 是否显示弹出层（数据详情的）
       openDetails: false,
-      // 日期范围
-      // dateRange: [],
-      // 菜单表格数据
-      menuList: [],
-      menuExpand: false,
-      menuNodeAll: false,
-      deptExpand: true,
-      deptNodeAll: false,
-      // TODO: 查询参数
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        processName: '',
-        workshop: ''
-      },
-      defaultProps: {},
-      // TODO: 表单参数
-      form: {
+
+      /* 以下为所有table的基本数据 */
+      // TODO: 模拟测试数据的数据库
+      simulateProcessList: [],
+      // TODO: 模拟数据中转表 (为了解决模拟数据的查询问题)
+      toList: [],
+      // TODO: 工序表格数据
+      processList: [],
+
+      // TODO: 表单初始化专用参数
+      formReset: {
         processName: '',
         workshop: '',
         flag: '1',
-        remark: '',
         createTime: new Date(),
         updataTime: new Date(),
         createBy: ''
       },
-      // TODO: 表单初始参数
-      formReset: {
+      // TODO: 弹出框层标题
+      title: '',
+      // TODO: 表单校验参数
+      rules: {
+        processName: [
+          { required: true, message: '请输入工序名称', trigger: 'blur' },
+          { min: 2, max: 5, message: '长度在 2 到 5 个字符', trigger: 'blur' }
+        ],
+        workshop: [
+          { required: true, message: '请输入车间名称', trigger: 'blur' }
+        ],
+        createBy: [
+          { required: true, message: '请输入创建人姓名', trigger: 'blur' }
+        ]
+      },
+      // TODO: 新增+修改的 表单参数
+      form: {
         processName: '',
         workshop: '',
         flag: '1',
+        remark: '',
         createTime: new Date(),
         updataTime: new Date(),
         createBy: ''
       },
-      // TODO: 表单里的单项详情参数
+      // TODO: 表单里的单项详情的参数
       singleDetails: {
         processName: '',
         workshop: '',
@@ -200,31 +193,33 @@ export default {
         updataTime: new Date(),
         createBy: ''
       },
-      // TODO: 模拟测试数据
-      simulateProcessList: [],
 
-      // TODO: 表单校验
-      rules: {
-        processName: [
-          { required: true, message: '请输入工序名称', trigger: 'blur' },
-          { min: 2, max: 5, message: '长度在 2 到 5 个字符', trigger: 'blur' }
-        ],
-        workshop: [
-          { required: true, message: '请输入车间名称', trigger: 'blur' }
-        ],
-        createBy: [
-          { required: true, message: '请输入创建人姓名', trigger: 'blur' }
-        ]
-      },
-      deptOptions: []
+      // TODO: 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        processName: '',
+        workshop: ''
+      }
+
     }
   },
   computed: {
     ProcessTable() {
       return ProcessTable
+    },
+
+    // TODO: 用来汇总Table组件所需要的全部数据并一次性传输给子组件
+    allTableArguments() {
+      return {
+        processList: this.processList,
+        queryParams: this.queryParams,
+        nIndex: this.nIndex,
+        loading: this.loading
+      }
     }
   },
-  /** 路由离开前存储筛选条件*/
+  /** TODO: 路由离开前存储筛选条件*/
   beforeRouteLeave(to, from, next) {
     this.$store.dispatch('searchSave/searchParamsSet', {
       path: this.$route.path,
@@ -235,15 +230,9 @@ export default {
     next()
   },
   created() {
-    if (this.$store.getters.searchParams[this.$route.path]) {
-      const { searchParams } = this.$store.getters; const { path } = this.$route
-      const param = JSON.parse(searchParams[path]) // 保留着的查询条件
-      this.queryParams = { ...param }
-    }
     // TODO: 获取大量模拟数据！ require用于将 JSON 数据转换为 JavaScript 对象数组
     // 测试用 console.log('this is json', simulateDataList)
     this.simulateProcessList = simulateDataList
-
     this.getList()
   },
   methods: {
@@ -290,24 +279,17 @@ export default {
       console.log(this.processList)
       this.loading = false
     },
-    // 取消按钮
+    // TODO: 表单的取消按钮
     cancel() {
       this.open = false
       this.reset()
     },
-    // 表单重置
+    // TODO: 表单+数据列表+中转数据的重置
     reset() {
       // TODO: 将模拟数据的空对象赋值给表单对象，达成清空填写表单的效果
       this.processList = null
       this.toList = null
-      this.form = {
-        processName: '',
-        workshop: '',
-        flag: '1',
-        createTime: new Date(),
-        updataTime: new Date(),
-        createBy: ''
-      }
+      this.form = { ...this.formReset }
     },
     /** TODO: 查询按钮操作 */
     handleQuery() {
@@ -356,25 +338,22 @@ export default {
                 obj.processName === this.form.processName ? this.form : obj
               )
               this.msgSuccess('修改成功')
-              this.getList()
               this.reset()
+              this.getList()
               this.open = !this.open
-              return
+              break
             } else {
-              if (this.form !== undefined && this.form !== null) {
               this.simulateProcessList.push(this.form)
               this.msgSuccess('新增成功')
-                this.getList()
               this.reset()
+              this.getList()
               this.open = !this.open
               return
             }
           }
         }
-        }
       })
     },
-
     /** TODO: 关于模拟数据的 删除list数组所调用的删除方法,封装的函数如下 */
     delProcess(delProcessName) {
       let tip = false