sap同步页面优化

src/views/mes/md/sapdata/index.vue

 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="类型ID" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择类型ID" clearable>
-          <el-option label="请选择字典生成" value="" />
+      <el-form-item label="特性类型" prop="type">
+        <el-select v-model="queryParams.type" placeholder="请选择特新类型" clearable >
+          <el-option v-for="item in dict.type.sap_property_type" :key="item.value" v-bind="item"/>
         </el-select>
       </el-form-item>
       <el-form-item label="关联ID" prop="relationId">
@@ -14,15 +14,23 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="是否上传过sap" prop="uploadFlag">
-        <el-input
-          v-model="queryParams.uploadFlag"
-          placeholder="请输入是否上传过sap"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+      <el-form-item label="是否上传过sap" prop="uploadFlag" label-width="9em">
+<!--        <el-input-->
+<!--          v-model="queryParams.uploadFlag"-->
+<!--          placeholder="请输入是否上传过sap"-->
+<!--          clearable-->
+<!--          @keyup.enter.native="handleQuery"-->
+<!--        />-->
+        <el-select v-model="queryParams.uploadFlag" placeholder="请选择是否" clearable>
+          <el-option
+            v-for="dict in dict.type.sys_yes_no"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+            />
+        </el-select>
       </el-form-item>
-      <el-form-item label="上传sap时间" prop="uploadTime">
+      <el-form-item label="上传sap时间" prop="uploadTime" label-width="8em">
         <el-date-picker clearable
                         v-model="queryParams.uploadTime"
                         type="date"
@@ -93,10 +101,10 @@
     </el-row>
 
     <el-table v-loading="loading" :data="sapdataList" @selection-change="handleSelectionChange">
-
-      <el-table-column label="客户ID" align="center" prop="id" />
-      <el-table-column label="类型ID" align="center" prop="type" />
-      <el-table-column label="关联ID" align="center" prop="relationId" />
+<!--      <el-table-column type="selection" width="55" />-->
+      <el-table-column label="id" align="center" prop="id" />
+      <el-table-column label="特性类型" align="center" prop="type" :formatter="formatType"/>
+      <el-table-column label="相关id" align="center" prop="relationId" />
 <!--      <el-table-column label="客户SAP特性info" align="center" prop="sapData" />-->
       <el-table-column label="是否上传过sap" align="center" prop="uploadFlag" >
         <template slot-scope="scope">
@@ -182,7 +190,7 @@ import { listSapdata, getSapdata, delSapdata, addSapdata, updateSapdata,uploadSa
 
 export default {
   name: "Sapdata",
-  dicts:['sys_yes_no'],
+  dicts:['sys_yes_no','sap_property_type'],
   data() {
     return {
       // 遮罩层
@@ -219,6 +227,10 @@ export default {
     this.getList();
   },
   methods: {
+    formatType(row) {
+      let item = this.dict.type.sap_property_type.find(item => item.value == row.type)
+      return item ? item.label : ''
+    },
     /** 查询客户SAP特性信息列表 */
     getList() {
       this.loading = true;
@@ -255,64 +267,74 @@ export default {
       this.single = selection.length!==1
       this.multiple = !selection.length
     },
-    /** 新增按钮操作 */
-    handleAdd() {
-      this.reset();
-      this.open = true;
-      this.title = "添加客户SAP特性信息";
-    },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      const id = row.id || this.ids
-      getSapdata(id).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改客户SAP特性信息";
-      });
-    },
+    // /** 新增按钮操作 */
+    // handleAdd() {
+    //   this.reset();
+    //   this.open = true;
+    //   this.title = "添加客户SAP特性信息";
+    // },
+    // /** 修改按钮操作 */
+    // handleUpdate(row) {
+    //   this.reset();
+    //   const id = row.id || this.ids
+    //   getSapdata(id).then(response => {
+    //     this.form = response.data;
+    //     this.open = true;
+    //     this.title = "修改客户SAP特性信息";
+    //   });
+    // },
     /** 上传给sap操作 */
     handleUpload(row) {
-
+      const type = row.type;
       const ids = row.id || this.ids;
-      this.$modal.confirm('是否确认上传客户SAP特性信息编号为"' + ids + '"的数据项？').then(function() {
-        return uploadSapdata(ids);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("上传成功");
-      }).catch(() => {});
+
+      switch (type) {
+        case '1':
+          this.$modal.confirm('是否确认上传客户SAP特性信息编号为"' + ids + '"的数据项？').then(function() {
+            return uploadSapdata(ids);
+          }).then(() => {
+            this.getList();
+            this.$modal.msgSuccess("上传成功");
+          }).catch(() => {});
+        case '2':
+        case '3':
+        case '4':
+        case '5':
+      }
+
+
 
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate(valid => {
-        if (valid) {
-          if (this.form.id != null) {
-            updateSapdata(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addSapdata(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
-        }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      const ids = row.id || this.ids;
-      this.$modal.confirm('是否确认删除客户SAP特性信息编号为"' + ids + '"的数据项？').then(function() {
-        return delSapdata(ids);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {});
-    },
+    // /** 提交按钮 */
+    // submitForm() {
+    //   this.$refs["form"].validate(valid => {
+    //     if (valid) {
+    //       if (this.form.id != null) {
+    //         updateSapdata(this.form).then(response => {
+    //           this.$modal.msgSuccess("修改成功");
+    //           this.open = false;
+    //           this.getList();
+    //         });
+    //       } else {
+    //         addSapdata(this.form).then(response => {
+    //           this.$modal.msgSuccess("新增成功");
+    //           this.open = false;
+    //           this.getList();
+    //         });
+    //       }
+    //     }
+    //   });
+    // },
+    // /** 删除按钮操作 */
+    // handleDelete(row) {
+    //   const ids = row.id || this.ids;
+    //   this.$modal.confirm('是否确认删除客户SAP特性信息编号为"' + ids + '"的数据项？').then(function() {
+    //     return delSapdata(ids);
+    //   }).then(() => {
+    //     this.getList();
+    //     this.$modal.msgSuccess("删除成功");
+    //   }).catch(() => {});
+    // },
     /** 导出按钮操作 */
     handleExport() {
       this.download('md/sapdata/export', {