优化

src/views/material/product/index.vue

@@ -25,14 +25,14 @@
           >
             <!-- 表头工具栏 -->
             <template v-slot:action="{ row }">
-              <el-link
+              <!-- <el-link
                 type="primary"
                 :underline="false"
                 icon="el-icon-edit"
                 @click="handleEdit(row)"
               >
                 修改
-              </el-link>
+              </el-link> -->
             </template>
           </ele-pro-table>
         </template>

src/views/technology/route/index.vue

@@ -16,7 +16,7 @@
         <el-button
             size="small"
             type="primary"
-            icon="el-icon-refresh-left"
+            icon="el-icon-plus"
             class="ele-btn-icon"
             @click="openEdit(null)"
           

src/views/technology/version/components/user-edit.vue

@@ -0,0 +1,216 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <ele-modal width="1060px" :visible="visible" :append-to-body="true" :close-on-click-modal="true"
+    custom-class="ele-dialog-form" :title="isUpdate ? '修改生产版本' : '添加生产版本'" @update:visible="updateVisible">
+    <header-title title="基本信息"> </header-title>
+    <el-form ref="form" :model="form" :rules="rules" label-width="140px">
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="版本号:" prop="code">
+            <el-input clearable v-model="form.code" placeholder="请输入版本号" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="8">
+          <el-form-item label="版本名称:" prop="name">
+            <el-input v-model="form.name" clearable placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="所属工厂:" prop="factoryId">
+            <el-select v-model="form.factoryId" placeholder="请选择" filterable>
+              <el-option v-for="item in fList" :key="item.id" :label="item.name" :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="8">
+          <el-form-item label="产品名称:" prop="categoryName">
+            <el-input @click.native="chooseProduct" v-model="form.categoryName" readonly />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="8">
+          <el-form-item label="产品编码:" prop="categoryCode">
+            <el-input placeholder="点击选择产品编码" disabled v-model="form.categoryCode" />
+          </el-form-item>
+        </el-col>
+
+      </el-row>
+
+
+      <header-title title="关联生产信息"></header-title>
+
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="工艺路线版本:" prop="version">
+            <el-input  v-model="form.version" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+
+        </el-col>
+      </el-row>
+
+    </el-form>
+    <template v-slot:footer>
+      <el-button @click="updateVisible(false)">取消</el-button>
+      <el-button type="primary" :loading="loading" @click="save">
+        保存
+      </el-button>
+    </template>
+
+    <!-- 选择产品弹窗 -->
+    <ProductModal ref="productRefs" @changeProduct='determineChoose' />
+  </ele-modal>
+</template>
+
+<script>
+import ProductModal from '@/views/technology/route/components/ProductModal.vue';
+import route from '@/api/technology/route';
+import { addUsers, putUsers } from '@/api/system/user';
+
+export default {
+  components: {
+    ProductModal
+  },
+  props: {
+    // 弹窗是否打开
+    visible: Boolean,
+    // 修改回显的数据
+    data: Object
+  },
+  data() {
+    const defaultForm = {
+      code: '',
+      name: '',
+      factoryId: '',
+
+      categoryId: '',
+      version: '',
+      id: '',
+      categoryCode: '',
+      categoryName: ''
+    };
+    return {
+      defaultForm,
+      fList: [], //仓库列表
+      categoryCode: '',
+      categoryName: '',
+      // 表单数据
+      form: { ...defaultForm },
+
+
+
+      // 表单验证规则
+      rules: {
+        name: [
+          { required: true, message: '请输入版本名称', trigger: 'blur' }
+        ],
+        code: [
+          { required: true, message: '请输入请输入版本号', trigger: 'blur' }
+        ],
+        factoryId: [
+          { required: true, message: '请输入工艺路线', trigger: 'blur' }
+        ],
+        categoryCode: [
+          { required: true, message: '请选择产品编码', trigger: 'change' }
+        ],
+        categoryName: [
+          { required: true, message: '请选择产品名称', trigger: 'change' }
+        ],
+
+        version: [
+          { required: true, message: '请输入工艺路线版本', trigger: 'blur' }
+        ]
+      },
+      // 提交状态
+      loading: false,
+      // 是否是修改
+      isUpdate: false
+    };
+  },
+  computed: {
+    statusTitle() {
+      return this.isUpdate ? '修改' : '保存';
+    },
+    // 是否开启响应式布局
+    styleResponsive() {
+      return this.$store.state.theme.styleResponsive;
+    }
+  },
+  methods: {
+    chooseProduct() {
+      this.$refs.productRefs.open(this.form)
+    },
+    determineChoose(row) {
+      this.$set(this.form, 'categoryName', row.name)
+      this.$set(this.form, 'categoryId', row.id)
+      this.$set(this.form, 'categoryCode', row.code)
+    },
+    /* 保存编辑 */
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (!valid) {
+          return false;
+        }
+        if (!this.data) {
+          delete this.form.id;
+        }
+
+        this.loading = true;
+        let title = this.isUpdate ? '修改' : '新建'; // 提交的名称或编号是否有效率有用的标识，
+
+
+        route
+          .save(this.form)
+          .then((msg) => {
+            this.form = {};
+            this.categoryName = '';
+            this.categoryCode = '';
+            this.loading = false;
+            let tit = title + msg;
+            this.$message.success(tit);
+            this.updateVisible(false);
+            this.$emit('done');
+          })
+          .catch((e) => {
+            this.loading = false;
+            // this.$message.error(e.message);
+          });
+      });
+    },
+    /* 更新visible */
+    updateVisible(value) {
+      this.$emit('update:visible', value);
+    }
+  },
+
+  watch: {
+    async visible(visible) {
+      if (visible) {
+        const res = await route.Flist({
+          pageNum: 1,
+          size: -1,
+          type: 1
+        });
+        this.fList = res.list;
+        if (this.data) {
+          const res = await route.getById(this.data.id);
+
+          this.$util.assignObject(this.form, {
+            ...res
+          });
+          this.isUpdate = true;
+        } else {
+          this.isUpdate = false;
+        }
+      } else {
+        this.$refs.form.clearValidate();
+        this.form = { ...this.defaultForm };
+      }
+    }
+  }
+};
+</script>

src/views/technology/version/index.vue

@@ -4,169 +4,178 @@
       <!-- 搜索表单 -->
       <user-search @search="reload" />
       <!-- 数据表格 -->
-      <ele-pro-table
-        ref="table"
-        :columns="columns"
-        :datasource="datasource"
-        :selection.sync="selection"
-        row-key="id"
-      >
+      <ele-pro-table ref="table" :columns="columns" :datasource="datasource" :selection.sync="selection" row-key="id">
         <!-- 表头工具栏 -->
-       <template v-slot:toolbar>
-          <el-button
-            size="small"
-            type="primary"
-            icon="el-icon-refresh-left"
-            class="ele-btn-icon"
-            :loading="loading"
-            @click="toRefresh()"
-          >
+        <template v-slot:toolbar>
+
+          <el-button size="small" type="primary" icon="el-icon-plus" class="ele-btn-icon"
+            @click="openEdit(null)">新增</el-button>
+
+          <el-button size="small" type="primary" icon="el-icon-refresh-left" class="ele-btn-icon" :loading="loading"
+            @click="toRefresh()">
             刷新
           </el-button>
         </template>
 
         <!-- 状态列 -->
-<!--        <template v-slot:status="{ row }">
+        <!--     <template v-slot:status="{ row }">
           {{ checkStatus(row) }}
         </template> -->
 
         <!-- 操作列 -->
         <template v-slot:action="{ row }">
-          <el-link
-            type="primary"
-            :underline="false"
-            icon="el-icon-edit"
-            @click="openEdit(row)"
-          >
+
+          <el-link type="primary" :underline="false" icon="el-icon-edit" @click="openEdit(row)">
+            修改
+          </el-link>
+
+          <el-link type="primary" :underline="false" @click="btnView(row)">
             查看
           </el-link>
         </template>
       </ele-pro-table>
     </el-card>
 
+
+
+    <!-- 编辑弹窗 -->
+    <user-edit :visible.sync="showEdit" :data="current" @done="reload" ref="userEdit" />
+
+
   </div>
 </template>
 
 <script>
-  import UserSearch from './components/user-search.vue';
-  import { pageList , syncVersion } from '@/api/technology/version/version.js';
-  export default {
-    name: 'technologyVersion',
-    components: {
-      UserSearch,
+import UserSearch from './components/user-search.vue';
+import UserEdit from './components/user-edit.vue';
+import { pageList, syncVersion } from '@/api/technology/version/version.js';
+export default {
+  name: 'technologyVersion',
+  components: {
+    UserSearch,
+    UserEdit
+  },
+  data() {
+    return {
+      // 表格列配置
+      columns: [
+        {
+          prop: 'categoryCode',
+          label: '产品编码',
+          showOverflowTooltip: true,
+          align: 'center',
+          minWidth: 110
+        },
+        {
+          prop: 'categoryName',
+          label: '产品名称',
+          showOverflowTooltip: true,
+          align: 'center',
+          minWidth: 110
+        },
+        {
+          align: 'center',
+          prop: 'code',
+          label: '版本号',
+          showOverflowTooltip: true,
+          minWidth: 110
+        },
+        {
+          prop: 'name',
+          label: '版本名称',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 110
+        },
+        {
+          prop: 'routingCode',
+          label: '工艺路线编码',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 110
+        },
+        {
+          prop: 'routingVersion',
+          label: '工艺版本号',
+          align: 'center',
+          showOverflowTooltip: true,
+          minWidth: 110
+        },
+
+        {
+          columnKey: 'action',
+          label: '操作',
+          width: 220,
+          align: 'center',
+          resizable: false,
+          slot: 'action',
+          showOverflowTooltip: true
+        }
+      ],
+      // 表格选中数据
+      selection: [],
+      // 当前编辑数据
+      current: null,
+      // 是否显示编辑弹窗
+      showEdit: false,
+      // 是否显示导入弹窗
+      showImport: false,
+      statusList: [
+        { label: '草稿', value: -1 },
+        { label: '失效', value: 0 },
+        { label: '生效', value: 1 }
+      ],
+      loading: false
+    };
+  },
+  methods: {
+    /* 表格数据源 */
+    datasource({ page, limit, where, order }) {
+      return pageList({ pageNum: page, size: limit, ...where });
+    },
+    // async datasource({ page, limit, where, order }) {
+    //   const res = await pageList({
+    //     ...where,
+    //     ...order,
+    //     pageNum: page,
+    //     size: limit
+    //   });
+    //   return res;
+    // },
+    /* 点击刷新 */
+    toRefresh() {
+      this.loading = true;
+      syncVersion().then(res => {
+        if (res == '0') {
+          this.loading = false;
+          this.$message.success('数据刷新成功！')
+          this.reload()
+        }
+      })
+        .catch((e) => {
+          this.loading = false;
+        });
+    },
+    /* 刷新表格 */
+    reload(where) {
+      this.$refs.table.reload({ page: 1, where: where });
     },
-    data() {
-      return {
-        // 表格列配置
-        columns: [
-          {
-            prop: 'categoryCode',
-            label: '产品编码',
-            showOverflowTooltip: true,
-            align: 'center',
-            minWidth: 110
-          },
-          {
-            prop: 'categoryName',
-            label: '产品名称',
-            showOverflowTooltip: true,
-            align: 'center',
-            minWidth: 110
-          },
-          {
-            align: 'center',
-            prop: 'code',
-            label: '版本号',
-            showOverflowTooltip: true,
-            minWidth: 110
-          },
-          {
-            prop: 'name',
-            label: '版本名称',
-            align: 'center',
-            showOverflowTooltip: true,
-            minWidth: 110
-          },
-          {
-            prop: 'routingCode',
-            label: '工艺路线编码',
-            align: 'center',
-            showOverflowTooltip: true,
-            minWidth: 110
-          },
-          {
-            prop: 'routingVersion',
-            label: '工艺版本号',
-            align: 'center',
-            showOverflowTooltip: true,
-            minWidth: 110
-          },
 
-          {
-            columnKey: 'action',
-            label: '操作',
-            width: 220,
-            align: 'center',
-            resizable: false,
-            slot: 'action',
-            showOverflowTooltip: true
-          }
-        ],
-        // 表格选中数据
-        selection: [],
-        // 当前编辑数据
-        current: null,
-        // 是否显示编辑弹窗
-        showEdit: false,
-        // 是否显示导入弹窗
-        showImport: false,
-        statusList: [
-          { label: '草稿', value: -1 },
-          { label: '失效', value: 0 },
-          { label: '生效', value: 1 }
-        ],
-        loading:false
-      };
+    /* 打开编辑弹窗 */
+    openEdit(row) {
+      this.current = row;
+      this.showEdit = true;
+      this.$refs.userEdit.$refs.form &&
+        this.$refs.userEdit.$refs.form.clearValidate();
     },
-    methods: {
-      /* 表格数据源 */
-      datasource({ page, limit, where, order }) {
-        return pageList({ pageNum: page, size: limit, ...where });
-      },
-      // async datasource({ page, limit, where, order }) {
-      //   const res = await pageList({
-      //     ...where,
-      //     ...order,
-      //     pageNum: page,
-      //     size: limit
-      //   });
-      //   return res;
-      // },
-      /* 点击刷新 */
-      toRefresh(){
-         this.loading = true;
-         syncVersion().then(res=>{
-            if(res=='0'){
-              this.loading = false;
-               this.$message.success('数据刷新成功！')
-               this.reload()
-            }
-         })
-         .catch((e) => {
-           this.loading = false;
-         });
-      },
-      /* 刷新表格 */
-      reload(where) {
-        this.$refs.table.reload({ page: 1, where: where });
-      },
-      /* 查看详情 */
-      openEdit({id}) {
-        this.$router.push({
-          path: '/technology/version/details',
-          query: {id}
-        })
-      }
+
+    /* 查看详情 */
+    btnView({ id }) {
+      this.$router.push({
+        path: '/technology/version/details',
+        query: { id }
+      })
     }
-  };
+  }
+};
 </script>