修改工序所属机台新增功能

src/views/modules/qc/OperationForResource.vue

@@ -38,14 +38,19 @@ export default {
         resourceId:'',
         resourceDesc:''
       },
+      itemList1:[],
+      itemSelections1:[],
+      itemList2:[],
+      itemSelections2:[],
       operationList:[],
-      resourceList:[],
+      // resourceList:[],
       userBuList: [],
       modalData: {
         page: 1,
         pageCount: 50,
         operation: '',
-        resource:''
+        resource: '',
+        resourceList: []
       },
       columns: [
         {
@@ -207,7 +212,8 @@ export default {
         page: 1,
         pageCount: 50,
         resource: '',
-        operation:''
+        operation: '',
+        resourceList: []
       }
       this.addResourceDataFlag = false
       this.modalFlag = true
@@ -224,7 +230,6 @@ export default {
       this.modalFlag = true
     },
     async saveModalData(){
-      this.ifexist=0
       if (this.modalData.bu==null ||this.modalData.bu==''){
         this.$message.warning("请选择BU！")
         return
@@ -233,19 +238,19 @@ export default {
         this.$message.warning("工序类别不能为空！")
         return
       }
-      if (this.modalData.resource==null ||this.modalData.resource==''){
-        this.$message.warning("机台编码不能为空！")
-        return
-      }
-       await queryOperationForResourceList(this.modalData).then(({data})=>{
-        if (data.code==3){
-          this.$message.warning("该工序和机台存在记录")
-          this.ifexist = data.code
-        }
-      }).catch()
-      if (this.ifexist==3){
+      if (this.modalData.resourceList.length < 1){
+        this.$message.warning("请添加机台！")
         return
       }
+      // await queryOperationForResourceList(this.modalData).then(({data})=>{
+      //   if (data.code==3){
+      //     this.$message.warning("该工序和机台存在记录")
+      //     this.ifexist = data.code
+      //   }
+      // }).catch()
+      // if (this.ifexist==3){
+      //   return
+      // }
       saveOperationForResource(this.modalData).then(({data})=>{
         if (data.code==0){
           this.$message.success("保存成功")
@@ -275,20 +280,93 @@ export default {
         console.log(error)
       })
     },
+    deleteData3(row){
+      this.modalData.resourceList = this.modalData.resourceList.filter(item => row.resourceId != item.resourceId)
+    },
     queryResourceList(){
-      // 原下拉列表查询
-      // queryResourceList().then(({data})=>{
-      //   if (data.code==0){
-      //     this.resourceList = data.rows
-      //   }
-      // }).catch()
-      this.resourceFlag = true
+      let resourceDataList;
+      if (this.modalData.bu==null ||this.modalData.bu==''){
+        this.$message.warning("请选择BU！")
+        return
+      }
+      if (this.modalData.operation==null ||this.modalData.operation==''){
+        this.$message.warning("工序类别不能为空！")
+        return
+      }
+      this.resourceData.bu = this.modalData.bu
+      this.resourceData.operation = this.modalData.operation
+      getResourceDataOperationForResource(this.resourceData).then(({data})=>{
+        if (data && data.code==0) {
+          resourceDataList = data.rows
+          // this.itemList2 = resourceDataList
+        }
+      })
+      this.resourData.site = this.modalData.bu.split('_')[0]
       queryResourceList2(this.resourData).then(({data}) => {
         if (data.code == 0) {
-          this.resourceList = data.rows
+          let itemList = data.rows
+          if (this.itemList2.length > 0) {
+            itemList = itemList.filter(item =>
+              !this.itemList2.some(i => i.resourceId === item.resourceId)
+            )
+          }
+          if (resourceDataList != null && resourceDataList.length > 0){
+            itemList = itemList.filter(item =>
+              !resourceDataList.some(i => i.resourceId === item.resourceId)
+            )
+          }
+          this.itemList1 = itemList
+          this.itemList2 = this.modalData.resourceList
+          this.resourceFlag = true
         }
       }).catch()
     },
+    // 添加矩阵
+    addItem () {
+      if (this.itemSelections1 == null || this.itemSelections1.length === 0) {
+        this.$message.warning('请选择可选机台！')
+        return
+      }
+      let resourceId = []
+      this.itemSelections1.forEach(data => {
+        resourceId.push(data.resourceId)
+      })
+      this.itemList1 = this.itemList1.filter(item =>
+        !resourceId.includes(item.resourceId)
+      )
+      this.itemList2.push(...this.itemSelections1)
+      this.$set(this.modalData, 'resourceList', this.itemList2)
+    },
+
+    // 删除矩阵
+    deleteItem () {
+      if (this.itemSelections2 == null || this.itemSelections2.length === 0) {
+        this.$message.warning('请选择已有机台！')
+        return
+      }
+      this.itemList1.push(...this.itemSelections2)
+      this.itemList2 = this.itemList2.filter(item => !this.itemSelections2.includes(item))
+      this.modalData.resourceList = this.itemList2
+    },
+    // 可选项目
+    itemClickRow1 (row) {
+      this.$refs.itemTable1.toggleRowSelection(row)
+    },
+
+    // 已有项目
+    itemClickRow2 (row) {
+      this.$refs.itemTable2.toggleRowSelection(row)
+    },
+    selectionItem1 (val) {
+      this.itemSelections1 = val
+    },
+
+    selectionItem2 (val) {
+      this.itemSelections2 = val
+    },
+    selectFlag () {
+      return true
+    },
     getRowData (row) {
       this.modalData.resource = row.resourceId
       this.modalData.resourceDesc = row.resourceDesc
@@ -389,7 +467,7 @@ export default {
         <el-table-column label="操作" align="center" width="100">
           <template slot-scope="scope">
             <a @click="deleteData(scope.row)" type="primary" style="margin-left: 2px">{{'删除'}}</a>
-            <a @click="getResourceData(scope.row)" type="primary" style="margin-left: 2px">{{'机台信息'}}</a>
+            <a @click="getResourceData(scope.row,1)" type="primary" style="margin-left: 2px">{{'机台信息'}}</a>
           </template>
         </el-table-column>
         <el-table-column
@@ -442,31 +520,45 @@ export default {
             </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item :label="'机台编码'">
-          <span style="cursor: pointer"   slot="label" @click="queryResourceList"><a>机台编码</a></span>
-          <el-input v-model="modalData.resource"  readonly style="width: 100px"></el-input>
-<!--          <el-select v-model="modalData.resource"  filterable  style="width: 100px">-->
-<!--            <el-option-->
-<!--              v-for = "i in resourceList"-->
-<!--              :key = "i.resourceId"-->
-<!--              :label = "i.resourceDesc"-->
-<!--              :value = "i.resourceId">-->
-<!--            </el-option>-->
-<!--          </el-select>-->
-        </el-form-item>
-        <el-form-item :label="'机台名称'">
-          <el-input v-model="modalData.resourceDesc" disabled style="width: 342px"></el-input>
+<!--        <el-form-item :label="'机台编码'">-->
+<!--          <span style="cursor: pointer"   slot="label" @click="queryResourceList"><a>机台编码</a></span>-->
+<!--          <el-input v-model="modalData.resource"  readonly style="width: 100px"></el-input>-->
+<!--        </el-form-item>-->
+<!--        <el-form-item :label="'机台名称'">-->
+<!--          <el-input v-model="modalData.resourceDesc" disabled style="width: 342px"></el-input>-->
+<!--        </el-form-item>-->
+        <el-form-item :label="' '">
+          <el-button type="primary" @click="queryResourceList()">添加机台</el-button>
         </el-form-item>
       </el-form>
+      <el-table
+        :height="300"
+        :data="modalData.resourceList"
+        border
+        style="width: 100%;">
+        <el-table-column
+          prop="resourceId"
+          label="机台编码">
+        </el-table-column>
+        <el-table-column
+          prop="resourceDesc"
+          label="机台名称">
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="100">
+          <template slot-scope="scope">
+            <a @click="deleteData3(scope.row)" type="primary" style="margin-left: 2px">{{'删除'}}</a>
+          </template>
+        </el-table-column>
+      </el-table>
       <el-footer style="height:40px;margin-top: 10px;text-align:center">
         <el-button type="primary" @click="saveModalData()">保 存</el-button>
         <el-button @click="modalFlag = false">取 消</el-button>
       </el-footer>
     </el-dialog>
 
-    <!--    新增时机台选择dialog-->
-    <el-dialog title="选择机台" :close-on-click-modal="false" v-drag :visible.sync="resourceFlag" width="520px">
-      <div class="rq">
+    <!-- 机台详情->快速新增 -->
+    <el-dialog title="机台新增"  :close-on-click-modal="false" v-drag :visible.sync="resourceFlag" width="900px">
+      <div style="font-size: 12px">
         <el-form :inline="true" label-position="top" :model="resourData">
           <el-form-item :label="'机台编码'">
             <el-input v-model="resourData.resourceId" clearable style="width: 120px"></el-input>
@@ -478,34 +570,132 @@ export default {
             <el-button type="primary" @click="queryResourceList">查询</el-button>
           </el-form-item>
         </el-form>
-        <el-table
-          :height="300"
-          :data="resourceList"
-          @row-dblclick="getRowData"
-          border
-          style="width: 100%;">
-          <el-table-column
-            v-for="(item,index) in resourceColomn" :key="index"
-            :sortable="item.columnSortable"
-            :prop="item.columnProp"
-            :header-align="item.headerAlign"
-            :show-overflow-tooltip="item.showOverflowTooltip"
-            :align="item.align"
-            :fixed="item.fixed==''?false:item.fixed"
-            :min-width="item.columnWidth"
-            :label="item.columnLabel">
-            <template slot-scope="scope">
-              <span v-if="!item.columnHidden">{{scope.row[item.columnProp]}}</span>
-              <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
-            </template>
-          </el-table-column>
-        </el-table>
       </div>
+      <el-container style="margin-top: 0px;">
+        <el-main style="width: 400px;padding: 0px">
+          <span style="font-size: 12px" >可选机台：</span>
+          <el-table
+            height="400px"
+            :data="itemList1"
+            border
+            ref="itemTable1"
+            @row-click="itemClickRow1"
+            @selection-change="selectionItem1"
+            highlight-current-row
+            style="width: 100%">
+            <el-table-column
+              type="selection"
+              header-align="center"
+              align="center"
+              :selectable="selectFlag"
+              width="50">
+            </el-table-column>
+            <el-table-column
+              prop="resourceId"
+              header-align="center"
+              align="center"
+              min-width="110"
+              label="机台编码">
+            </el-table-column>
+            <el-table-column
+              prop="resourceDesc"
+              header-align="center"
+              align="center"
+              min-width="170"
+              label="机台名称">
+            </el-table-column>
+          </el-table>
+        </el-main>
+        <el-main style="width: 100px;padding: 0px">
+          <div style="margin-top: 182px;margin-left: 18px">
+            <el-button type="primary" @click="addItem()">添加>></el-button>
+          </div>
+          <div style="margin-top: 15px;margin-left: 18px">
+            <el-button type="primary" @click="deleteItem()">删除<<</el-button>
+          </div>
+        </el-main>
+        <el-main style="width: 400px;padding: 0px">
+          <span style="font-size: 12px">选中机台：</span>
+          <el-table
+            height="400px"
+            :data="itemList2"
+            border
+            ref="itemTable2"
+            @row-click="itemClickRow2"
+            @selection-change="selectionItem2"
+            highlight-current-row
+            style="width: 100%">
+            <el-table-column
+              type="selection"
+              header-align="center"
+              align="center"
+              :selectable="selectFlag"
+              width="50">
+            </el-table-column>
+            <el-table-column
+              prop="resourceId"
+              header-align="center"
+              align="center"
+              min-width="110"
+              label="机台编码">
+            </el-table-column>
+            <el-table-column
+              prop="resourceDesc"
+              header-align="center"
+              align="center"
+              min-width="170"
+              label="机台名称">
+            </el-table-column>
+          </el-table>
+        </el-main>
+      </el-container>
       <el-footer style="height:40px;margin-top: 20px;text-align:center">
-        <el-button type="primary" @click="resourceFlag=false">关闭</el-button>
+        <el-button type="primary" @click="resourceFlag = false">关闭</el-button>
       </el-footer>
     </el-dialog>
 
+    <!--    新增时机台选择dialog-->
+<!--    <el-dialog title="选择机台" :close-on-click-modal="false" v-drag :visible.sync="resourceFlag1" width="520px">-->
+<!--      <div class="rq">-->
+<!--        <el-form :inline="true" label-position="top" :model="resourData">-->
+<!--          <el-form-item :label="'机台编码'">-->
+<!--            <el-input v-model="resourData.resourceId" clearable style="width: 120px"></el-input>-->
+<!--          </el-form-item>-->
+<!--          <el-form-item :label="'机台名称'">-->
+<!--            <el-input v-model="resourData.resourceDesc" clearable style="width: 120px"></el-input>-->
+<!--          </el-form-item>-->
+<!--          <el-form-item :label="' '">-->
+<!--            <el-button type="primary" @click="queryResourceList">查询</el-button>-->
+<!--          </el-form-item>-->
+<!--        </el-form>-->
+<!--        <el-table-->
+<!--          :height="300"-->
+<!--          :data="resourceList"-->
+<!--          @row-dblclick="getRowData"-->
+<!--          border-->
+<!--          style="width: 100%;">-->
+<!--          <el-table-column-->
+<!--            v-for="(item,index) in resourceColomn" :key="index"-->
+<!--            :sortable="item.columnSortable"-->
+<!--            :prop="item.columnProp"-->
+<!--            :header-align="item.headerAlign"-->
+<!--            :show-overflow-tooltip="item.showOverflowTooltip"-->
+<!--            :align="item.align"-->
+<!--            :fixed="item.fixed==''?false:item.fixed"-->
+<!--            :min-width="item.columnWidth"-->
+<!--            :label="item.columnLabel">-->
+<!--            <template slot-scope="scope">-->
+<!--              <span v-if="!item.columnHidden">{{scope.row[item.columnProp]}}</span>-->
+<!--              <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>-->
+<!--            </template>-->
+<!--          </el-table-column>-->
+<!--        </el-table>-->
+<!--      </div>-->
+<!--      <el-footer style="height:40px;margin-top: 20px;text-align:center">-->
+<!--        <el-button type="primary" @click="resourceFlag=false">关闭</el-button>-->
+<!--      </el-footer>-->
+<!--    </el-dialog>-->
+
     <!--    机台详细信息-->
     <el-dialog title="机台信息" :close-on-click-modal="false" v-drag :visible.sync="resourceDataFlag" width="520px">
       <div class="rq">
@@ -519,9 +709,9 @@ export default {
           <el-form-item :label="'工序名称'">
             <el-input v-model="resourceData.operationDesc" disabled style="width: 120px"></el-input>
           </el-form-item>
-          <el-form-item :label="' '">
-            <el-button type="primary" @click="addResourceData">新增</el-button>
-          </el-form-item>
+<!--          <el-form-item :label="' '">-->
+<!--            <el-button type="primary" @click="addResourceData">新增</el-button>-->
+<!--          </el-form-item>-->
         </el-form>
         <el-table
           :height="300"