1.修改了部分字段名

2.调整了按钮的间距和位置大小
3.新增了关于模拟数据的条件查询功能，可以进行条件查询
Signed-off-by: AiNoeLiYa <jzbcxy@gmail.com>

src/views/processManagement/basicProcessManagement/index.vue

@@ -41,8 +41,14 @@
 
       <!-- TODO: 以下为基础工序管理列表 -->
       <div class="mb12 font-small-bold">基础工序管理列表</div>
-      <el-table v-loading="loading" border :data="roleList" @selection-change="handleSelectionChange">
-        <el-table-column type="index" label="序号" width="50" />
+      <el-table
+        v-loading="loading"
+        class="processList"
+        border
+        :data="processList"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="index" label="序号" width="50"/>
         <el-table-column label="工序名称" prop="processName" :show-overflow-tooltip="true">
           <template slot-scope="scope">
             {{ scope.row.processName || '-' }}
@@ -53,18 +59,23 @@
             {{ scope.row.workshop || '-' }}
           </template>
         </el-table-column>
-        <el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
+        <el-table-column label="操作时间" :show-overflow-tooltip="true" align="center" prop="createTime">
           <template slot-scope="scope">
             <span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="创建人" prop="createBy">
+        <el-table-column label="操作人" prop="createBy">
           <template slot-scope="scope">
             {{ scope.row.createBy || '-' }}
           </template>
         </el-table-column>
-        <el-table-column label="操作" class-name="small-padding fixed-width" width="240px">
+        <el-table-column
+          label="操作"
+          class-name="small-padding fixed-width"
+          width="180px"
+        >
           <template slot-scope="scope">
+            <div class="processListBtns">
               <el-button :type="typeParent" :size="size" @click="handleDetail(scope.row)">
                 详情
               </el-button>
@@ -75,7 +86,9 @@
                 size="mini"
                 type="text"
                 @click="handleDelete(scope.row)"
-            >删除</el-button>
+              >删除
+              </el-button>
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -92,13 +105,13 @@
     <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="名称" prop="processName">
-          <el-input v-model.trim="form.processName" show-word-limit :maxlength="30" placeholder="请输入工序名称" />
+          <el-input v-model.trim="form.processName" show-word-limit :maxlength="30" placeholder="请输入工序名称"/>
         </el-form-item>
         <el-form-item label="工厂车间" prop="workshop">
-          <el-input v-model.trim="form.workshop" show-word-limit :maxlength="30" placeholder="请输入工厂车间" />
+          <el-input v-model.trim="form.workshop" show-word-limit :maxlength="30" placeholder="请输入工厂车间"/>
         </el-form-item>
-        <el-form-item label="创建人" prop="createBy">
-          <el-input v-model.trim="form.createBy" :maxlength="30" show-word-limit placeholder="请输入创建人" />
+        <el-form-item label="操作人" prop="createBy">
+          <el-input v-model.trim="form.createBy" :maxlength="30" show-word-limit placeholder="请输入操作人"/>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -111,16 +124,20 @@
     <el-dialog class="aboutSingleDetails" :title="title" :visible.sync="openDetails" width="700px" append-to-body>
       <el-form ref="formDetails" :model="singleDetails" size="small" label-width="90px">
         <el-form-item label="名称：" prop="processName">
-          <el-input v-model.trim="singleDetails.processName" :readonly="isReadOnly" />
+          <el-input v-model.trim="singleDetails.processName" :readonly="isReadOnly"/>
         </el-form-item>
         <el-form-item label="工厂车间：" prop="workshop">
-          <el-input v-model.trim="singleDetails.workshop" :readonly="isReadOnly" />
+          <el-input v-model.trim="singleDetails.workshop" :readonly="isReadOnly"/>
         </el-form-item>
-        <el-form-item label="创建时间：" prop="createTime">
+        <el-form-item label="操作时间：" prop="createTime">
+          <!--
+            TODO: el-input 里不能调用全局日期过滤器  transformDateByFormat('YYYY-MM-DD HH:mm')
             <el-input v-model.trim="singleDetails.createTime" :readonly="isReadOnly" />
+          -->
+          {{ singleDetails.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}
         </el-form-item>
-        <el-form-item label="创建人：" prop="createBy">
-          <el-input v-model.trim="singleDetails.createBy" :readonly="isReadOnly" />
+        <el-form-item label="操作人：" prop="createBy">
+          <el-input v-model.trim="singleDetails.createBy" :readonly="isReadOnly"/>
         </el-form-item>
       </el-form>
     </el-dialog>
@@ -159,13 +176,15 @@ export default {
       multiple: true,
       // 总条数
       total: 0,
-      // 角色表格数据
-      roleList: [],
+      // TODO: 工序表格数据
+      processList: [],
+      // TODO: 模拟数据中转表 (为了解决模拟数据的查询问题)
+      toList: [],
       // 弹出层标题
       title: '',
-      // 是否显示弹出层
+      // TODO: 是否显示弹出层
       open: false,
-      // 是否显示弹出层（数据详情）
+      // TODO: 是否显示弹出层（数据详情）
       openDetails: false,
       // 日期范围
       // dateRange: [],
@@ -175,13 +194,12 @@ export default {
       menuNodeAll: false,
       deptExpand: true,
       deptNodeAll: false,
-      // 查询参数
+      // TODO: 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        processName: undefined,
-        workshop: undefined,
-        flag: undefined
+        processName: '',
+        workshop: ''
       },
       defaultProps: {},
       // TODO: 表单参数
@@ -213,16 +231,33 @@ export default {
         createBy: ''
       },
       // TODO: 模拟测试数据
-      simulateProcessList: [{ processName: '打磨', workshop: '车间1', flag: 1, createTime: new Date(), updataTime: new Date(), createBy: '张三' }, { processName: '焊接', workshop: '车间2', flag: 2, createTime: new Date(), updataTime: new Date(), createBy: '李四' }],
+      simulateProcessList: [
+        {
+          processName: '打磨',
+          workshop: '车间1',
+          flag: 1,
+          createTime: new Date(),
+          updataTime: new Date(),
+          createBy: '张三'
+        },
+        {
+          processName: '焊接',
+          workshop: '车间2',
+          flag: 2,
+          createTime: new Date(),
+          updataTime: new Date(),
+          createBy: '李四'
+        }
+      ],
 
-      // 表单校验
+      // TODO: 表单校验
       rules: {
         processName: [
-          { required: true, message: '请输入工序名称', trigger: 'blur' },
-          { min: 2, max: 5, message: '长度在 2 到 5 个字符', trigger: 'blur' }
+          {required: true, message: '请输入工序名称', trigger: 'blur'},
+          {min: 2, max: 5, message: '长度在 2 到 5 个字符', trigger: 'blur'}
         ],
         workshop: [
-          { required: true, message: '请输入车间名称', trigger: 'blur' }
+          {required: true, message: '请输入车间名称', trigger: 'blur'}
         ],
         createBy: [
           { required: true, message: '请输入创建人姓名', trigger: 'blur' }
@@ -250,11 +285,37 @@ export default {
     this.getList()
   },
   methods: {
-    /** 查询角色列表 */
+    /** TODO: 查询列表 */
     getList() {
       this.loading = true
-      this.roleList = this.simulateProcessList
-      console.log(this.roleList)
+      this.reset()
+      // TODO: 此处为模拟数据的，根据不同条件去查询的过滤方法，可以删除！
+      if (this.queryParams.workshop === '' && this.queryParams.processName !== '') {
+        for (const ps of this.simulateProcessList) {
+          if (ps.processName === this.queryParams.processName) {
+            this.toList.push(ps)
+          }
+        }
+      } else if (this.queryParams.workshop !== '' && this.queryParams.processName === '') {
+        for (const ps of this.simulateProcessList) {
+          if (ps.workshop === this.queryParams.workshop) {
+            this.toList.push(ps)
+          }
+        }
+      } else if (this.queryParams.workshop !== '' && this.queryParams.processName !== '') {
+        for (const ps of this.simulateProcessList) {
+          if (ps.workshop === this.queryParams.workshop && ps.processName === this.queryParams.processName) {
+            this.toList.push(ps)
+          }
+        }
+      } else {
+        this.toList = this.simulateProcessList
+      }
+      // DONE: 此上为模拟数据的，根据不同条件去查询的过滤方法，可以删除！
+
+      this.processList = this.toList
+      this.total = this.toList.length
+      console.log(this.processList)
       this.loading = false
     },
     // 取消按钮
@@ -265,6 +326,7 @@ export default {
     // 表单重置
     reset() {
       // TODO: 将模拟数据的空对象赋值给表单对象，达成清空填写表单的效果
+      this.toList = []
       this.form = {
         processName: '',
         workshop: '',
@@ -278,6 +340,7 @@ export default {
     handleQuery() {
       this.queryParams.pageNum = 1
       this.getList()
+      console.log('this is queryParams', this.queryParams)
     },
     /** TODO: 重置按钮操作 */
     resetQuery() {},
@@ -399,14 +462,23 @@ export default {
     margin-left: 15px;
   }
 }
-.el-divider--vertical{
+
+.el-divider--vertical {
   height: 12em;
   width: 4px;
 }
 
-.aboutSingleDetails{
-  .el-form-item{
-    .el-input >>> .el-input__inner {
+//TODO: 这里是控制内容列表的样式
+.processListBtns {
+  .el-button {
+    margin: 0 7px;
+  }
+}
+
+//TODO: readOnly里去删除el-input的边框样式
+.aboutSingleDetails {
+  .el-form-item {
+    .el-input > > > .el-input__inner {
       -webkit-appearance: none;
       background-color: #FFF;
       background-image: none;