From a3c7a21828653c2c74c20b1f69baf6a9fbfb8e1c Mon Sep 17 00:00:00 2001
From: chenhj <1263187585@qq.com>
Date: 星期三, 18 三月 2026 11:01:51 +0800
Subject: [PATCH] 车间订单处理工艺文件工序排序错误问题

---
 src/views/plan/manufacturingorder/productorder-form.vue |  433 +++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 280 insertions(+), 153 deletions(-)

diff --git a/src/views/plan/manufacturingorder/productorder-form.vue b/src/views/plan/manufacturingorder/productorder-form.vue
index 46be539..7b49f3d 100644
--- a/src/views/plan/manufacturingorder/productorder-form.vue
+++ b/src/views/plan/manufacturingorder/productorder-form.vue
@@ -7,8 +7,11 @@
         <h2 v-if="!editable">鏌ョ湅-杞﹂棿璁㈠崟</h2>
       </div>
       <div class="btn-group header-right" v-if="editable">
-        <el-button :disabled="isSubmit" v-thinclick="`dataFormSubmit`"
-          type="primary">淇濆瓨</el-button
+        <el-button
+          :disabled="isSubmit"
+          v-thinclick="`dataFormSubmit`"
+          type="primary"
+          >淇濆瓨</el-button
         >
       </div>
     </div>
@@ -65,15 +68,15 @@
             </el-col>
             <el-col :span="6">
               <el-form-item label="闆朵欢" prop="partId">
-                <el-tooltip class="item" effect="dark" :content="partStr" >
-                <el-input v-model="partStr" placeholder="" readonly>
-                  <el-button
-                    v-if="!this.dataForm.id"
-                    slot="append"
-                    icon="el-icon-search"
-                    @click="openRoutingDialog()"
-                  ></el-button>
-                </el-input>
+                <el-tooltip class="item" effect="dark" :content="partStr">
+                  <el-input v-model="partStr" placeholder="" readonly>
+                    <el-button
+                      v-if="!this.dataForm.id"
+                      slot="append"
+                      icon="el-icon-search"
+                      @click="openRoutingDialog()"
+                    ></el-button>
+                  </el-input>
                 </el-tooltip>
               </el-form-item>
             </el-col>
@@ -91,7 +94,7 @@
             <el-col :span="4">
               <el-form-item label="瀹屾垚鏁伴噺" prop="qtyFinished">
                 <el-input-number
-                  style= "width: 90%"
+                  style="width: 90%"
                   v-model="dataForm.qtyFinished"
                   placeholder=""
                   :controls="false"
@@ -128,11 +131,15 @@
                 ></el-input>
               </el-form-item>
             </el-col> -->
-             <el-col :span="5">
+            <el-col :span="5">
               <el-form-item label="澶囨敞" prop="remark">
-                <el-tooltip class="item" effect="dark" :content="dataForm.remark">
-                <el-input v-model="dataForm.remark" placeholder="">
-                </el-input>
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  :content="dataForm.remark"
+                >
+                  <el-input v-model="dataForm.remark" placeholder="">
+                  </el-input>
                 </el-tooltip>
               </el-form-item>
             </el-col>
@@ -156,14 +163,21 @@
             </el-col>
             <el-col :span="10">
               <el-form-item label="宸ヨ壓鏂囦欢" prop="technologyDocumentName">
-                 <el-tooltip class="item" effect="dark" :content="dataForm.technologyDocumentName">
-                  <el-input v-model="dataForm.technologyDocumentName" placeholder="">
-                </el-input>
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  :content="dataForm.technologyDocumentName"
+                >
+                  <el-input
+                    v-model="dataForm.technologyDocumentName"
+                    placeholder=""
+                  >
+                  </el-input>
                 </el-tooltip>
               </el-form-item>
             </el-col>
           </el-row>
-            <!-- <el-col
+          <!-- <el-col
               :span="2"
               v-if="permissions.plan_manufacturingorder_bom_sure"
             >
@@ -189,7 +203,7 @@
                 </el-switch>
               </el-form-item>
             </el-col> -->
-            <!-- <el-col :span="2">
+          <!-- <el-col :span="2">
               <el-form-item
                 label="IFS杞﹂棿璁㈠崟鎺ユ敹鏃舵姤鍛婂伐搴�"
                 prop="isReportOperation"
@@ -199,7 +213,7 @@
                 </el-switch>
               </el-form-item>
             </el-col> -->
-            <!-- <el-col :span="2">
+          <!-- <el-col :span="2">
               <el-form-item label="BOM纭">
                 <el-switch >
                 </el-switch>
@@ -217,7 +231,6 @@
                 </el-switch>
               </el-form-item>
             </el-col> -->
-
         </div>
         <div class="productorder-detail">
           <el-card class="productorder-list">
@@ -239,7 +252,7 @@
                             <el-option
                               v-for="item in dataForm.routingList"
                               :key="item.id"
-                              :label="item.routingNo "
+                              :label="item.routingNo"
                               :value="item.id"
                             >
                             </el-option>
@@ -267,7 +280,23 @@
                     </el-row>
                     <el-row>
                       <el-col :span="24" class="productorder-operates-col">
-                        <el-card class="productorder-operates" >
+                        <el-card class="productorder-operates">
+                          <div style="display:flex;justify-content:flex-end;">
+<!--                            <el-button-->
+<!--                              style="padding: 3px 0;margin-right:10px;"-->
+<!--                              type="text"-->
+<!--                              size="medium"-->
+<!--                              @click="refresh"-->
+<!--                              >鍒锋柊-->
+<!--                            </el-button>-->
+                            <el-button
+                              style="padding: 3px 0;margin-right:10px;"
+                              type="text"
+                              size="medium"
+                              @click="addOrderOperation"
+                              >娣诲姞
+                            </el-button>
+                          </div>
                           <!-- <el-row>
                             <el-col :span="2" class="frame1">搴忓彿
                             </el-col>
@@ -281,10 +310,13 @@
                             </el-col>
                           </el-row> -->
                           <el-table
+                            :key="operationIndex"
+                            :data-operation-index="operationIndex"
                             id="operationTable"
                             ref="operationTable"
                             class="basic-template-table"
                             :data="operations"
+                            row-key="id"
                             height="593px"
                             border
                             highlight-current-row
@@ -296,14 +328,16 @@
                               min-width="50"
                               label="搴忓彿"
                             >
-                            <template slot-scope="scope">
+                              <template slot-scope="scope">
                                 <div style="display:flex">
-                                    <span style="width:20px;">
-                                    <i class="icon aufontAll  h-icon-all-drag"></i
-                                    ></span>
-                                    <span>{{ scope.row.operationOrder }}</span>
+                                  <span style="width:20px;">
+                                    <i
+                                      class="icon aufontAll  h-icon-all-drag"
+                                    ></i
+                                  ></span>
+                                  <span>{{ scope.row.operationOrder }}</span>
                                 </div>
-                            </template>
+                              </template>
                             </el-table-column>
                             <el-table-column
                               prop="operationNo"
@@ -338,6 +372,13 @@
                                   size="mini"
                                   @click.stop="openOrderOperation(scope.row)"
                                   >缂栬緫
+                                </el-button>
+                                <el-button
+                                  style="color:#f56c6c;"
+                                  type="text"
+                                  size="mini"
+                                  @click.stop="deleteOrderOperation(scope.row)"
+                                  >鍒犻櫎
                                 </el-button>
                               </template>
                             </el-table-column>
@@ -548,7 +589,7 @@
                           </el-table>
                         </el-card>
                       </el-tab-pane>
-                     <!--  <el-tab-pane
+                      <!--  <el-tab-pane
                         label="妫�娴嬫爣鍑�"
                         key="tb1"
                         id="tb1"
@@ -986,25 +1027,25 @@
   </div>
 </template>
 <style lang="scss">
-.frame{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 100px;
-    // border-width: 1px;
-    // border-color: rgb(129, 129, 129);
-    // border-style: solid;
-    font-size: 15px;
-}
-.frame1{
+.frame {
   display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 50px;
-    // border-width: 1px;
-    // border-color: rgb(129, 129, 129);
-    // border-style: solid;
-    font-size: 15px;
+  justify-content: center;
+  align-items: center;
+  height: 100px;
+  // border-width: 1px;
+  // border-color: rgb(129, 129, 129);
+  // border-style: solid;
+  font-size: 15px;
+}
+.frame1 {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 50px;
+  // border-width: 1px;
+  // border-color: rgb(129, 129, 129);
+  // border-style: solid;
+  font-size: 15px;
 }
 .productorder-basic {
   background-color: #fff;
@@ -1106,7 +1147,6 @@
 /deep/ .el-input-number.is-without-controls .el-input__inner {
   text-align: start;
 }
-
 </style>
 <script>
 import {
@@ -1126,6 +1166,7 @@
   delMoBom,
   bomSelectChange,
   changeOrder,
+  addMoRoutingOperation
 } from '@/api/plan/manufacturingorder'
 import { qryMoSamplingRule, delMoSamplingRule } from '@/api/plan/mosamplingrule'
 import {
@@ -1177,7 +1218,7 @@
 
   data() {
     return {
-      componentsTable:[],
+      componentsTable: [],
       typeOptions: [],
       paramTemplateSelArr: [],
       paramTemplateSelCol: 'operationTemplateNo',
@@ -1233,18 +1274,20 @@
         isReportOperation: false,
         outPutBatchList: [],
         technologyDocumentId: null,
-        technologyDocumentName: null,
+        technologyDocumentName: null
       },
       currentRow: [],
       currentRouting: {}, // 褰撳墠閫夋嫨鐨勫伐鑹�
       operations: [], // 褰撳墠閫夋嫨宸ヨ壓瀵瑰簲鐨勫伐搴�
+      operationIndex: 10,
+      operationSortable: null,
       currentBom: {}, // 褰撳墠閫夋嫨鐨勪骇鍝佺粨鏋�
       components: [], // 褰撳墠閫夋嫨浜у搧缁撴瀯瀵瑰簲鐨勭粨鏋勭粍浠�
       factoryOptions: [],
       operationTemplateList: [], // 鍙傛暟闆�
       templateParamList: [], // 鍙傛暟
       dataRule: {
-        technologyDocumentName:[
+        technologyDocumentName: [
           { required: true, message: '宸ヨ壓鏂囦欢涓嶈兘涓虹┖', trigger: 'blur' }
         ],
         workshopTypeCode: [
@@ -1294,6 +1337,12 @@
       },
       false
     )
+  },
+  beforeDestroy() {
+    if (this.operationSortable) {
+      this.operationSortable.destroy()
+      this.operationSortable = null
+    }
   },
   created() {
     this.dataForm.id = Number(this.$route.query.id)
@@ -1358,8 +1407,7 @@
         }
       }
     },
-    components(newVal,oldVal){
-    },
+    components(newVal, oldVal) {},
     currentRouting(newValue, oldValue) {
       if (newValue && newValue.id) {
         if (this.dataForm.id != null && this.dataForm.id !== 0) {
@@ -1418,6 +1466,9 @@
         dataType: '鐢熶骇瑕佹眰',
         routingOperationId: newValue
       })
+    },
+    operationIndex() {
+      this.rowDrop()
     }
   },
   computed: {
@@ -1444,68 +1495,94 @@
   },
   methods: {
     rowDrop() {
-      const that = this
-      const tbody = document.querySelector(
-        '#operationTable .el-table__body-wrapper tbody'
-      )
-      Sortable.create(tbody, {
-        // 缁撴潫鎷栨嫿
-        onEnd({ newIndex, oldIndex }) {
-          if (newIndex > oldIndex) {
-            // 涓嬬Щ
-            that.operations
-              .filter((e) => e.operationOrder == oldIndex + 1)
-              .forEach((e) => (e.operationOrder = 'x'))
-            that.operations
-              .filter((e) => e.operationOrder > oldIndex + 1 && e.operationOrder <= newIndex + 1)
-              .forEach((e) => (e.operationOrder = e.operationOrder - 1))
-            that.operations
-              .filter((e) => e.operationOrder == 'x')
-              .forEach((e) => (e.operationOrder = newIndex + 1))
-          } else if (oldIndex > newIndex) {
-            // 涓婄Щ
-            that.operations
-              .filter((e) => e.operationOrder == oldIndex + 1)
-              .forEach((e) => (e.operationOrder = 'x'))
-            that.operations
-              .filter((e) => e.operationOrder < oldIndex + 1 && e.operationOrder >= newIndex + 1)
-              .forEach((e) => (e.operationOrder = e.operationOrder + 1))
-            that.operations
-              .filter((e) => e.operationOrder == 'x')
-              .forEach((e) => (e.operationOrder = newIndex + 1))
-          }
-          // 鎷栨嫿缁撴潫鍚庯紝淇濆瓨鏂扮殑鎺掑簭
-          let data = that.operations.map(el =>{
-            return {
-              id:el.id,
-              operationOrder:el.operationOrder,
+      if (this.operationSortable) {
+        this.operationSortable.destroy()
+        this.operationSortable = null
+      }
+
+      this.$nextTick(() => {
+        requestAnimationFrame(() => {
+          const that = this
+          const root =
+            this.$el.querySelector(
+              `#operationTable[data-operation-index="${this.operationIndex}"]`
+            ) || this.$el.querySelector('#operationTable')
+          const tbody = root
+            ? root.querySelector('.el-table__body-wrapper tbody')
+            : null
+          if (!tbody) return
+
+          this.operationSortable = Sortable.create(tbody, {
+            // 缁撴潫鎷栨嫿
+            onEnd({ newIndex, oldIndex }) {
+              if (newIndex > oldIndex) {
+                // 涓嬬Щ
+                that.operations
+                  .filter((e) => e.operationOrder == oldIndex + 1)
+                  .forEach((e) => (e.operationOrder = 'x'))
+                that.operations
+                  .filter(
+                    (e) =>
+                      e.operationOrder > oldIndex + 1 &&
+                      e.operationOrder <= newIndex + 1
+                  )
+                  .forEach((e) => (e.operationOrder = e.operationOrder - 1))
+                that.operations
+                  .filter((e) => e.operationOrder == 'x')
+                  .forEach((e) => (e.operationOrder = newIndex + 1))
+              } else if (oldIndex > newIndex) {
+                // 涓婄Щ
+                that.operations
+                  .filter((e) => e.operationOrder == oldIndex + 1)
+                  .forEach((e) => (e.operationOrder = 'x'))
+                that.operations
+                  .filter(
+                    (e) =>
+                      e.operationOrder < oldIndex + 1 &&
+                      e.operationOrder >= newIndex + 1
+                  )
+                  .forEach((e) => (e.operationOrder = e.operationOrder + 1))
+                that.operations
+                  .filter((e) => e.operationOrder == 'x')
+                  .forEach((e) => (e.operationOrder = newIndex + 1))
+              }
+              // 鎷栨嫿缁撴潫鍚庯紝淇濆瓨鏂扮殑鎺掑簭
+              const data = that.operations.map((el) => {
+                return {
+                  id: el.id,
+                  operationOrder: el.operationOrder
+                }
+              })
+              changeOrder(data)
+                .then()
+                .catch((error) => {
+                  console.error(error)
+                })
             }
           })
-          changeOrder(data).then().catch(error => {
-                console.error(error)
-          });
-        }
+        })
       })
     },
-    dragEnd(e){
+    dragEnd(e) {
       this.operations.forEach((e, i) => {
         e.index = i + 1
-        e.operationOrder = i+1
+        e.operationOrder = i + 1
       })
-      console.log(this.operations,"鎷栨嫿缁撴潫kk");
+      console.log(this.operations, '鎷栨嫿缁撴潫kk')
       this.dragEndstart()
     },
-    dragEndstart(){
-        let data = this.operations.map(el =>{
-            return {
-              id:el.id,
-              operationOrder:el.operationOrder,
-            }
+    dragEndstart() {
+      const data = this.operations.map((el) => {
+        return {
+          id: el.id,
+          operationOrder: el.operationOrder
+        }
+      })
+      changeOrder(data)
+        .then((res) => {})
+        .catch((error) => {
+          console.error(error)
         })
-        changeOrder(data).then((res) =>{
-        }).catch(error => {
-			console.error(error)
-		});
     },
     getSysParam(paramKey) {
       getSysParam(paramKey).then((response) => {
@@ -1575,7 +1652,7 @@
     },
     // 鏌ヨ褰撳墠杞﹂棿璁㈠崟淇℃伅
     getOrderInfo() {
-      let that=this
+      const that = this
       getManufacturingOrder(this.dataForm.id).then((response) => {
         this.dataForm = response.data.data
         // 鎶婂伐鑹烘寕涓婂幓
@@ -1745,7 +1822,7 @@
       this.showRouting = true
     },
     selectRouting(param) {
-      console.log(param);
+      console.log(param)
       if (param) {
         this.dataForm.partNo = param.partNo
         this.dataForm.partName = param.partName
@@ -1771,7 +1848,7 @@
       })
     },
     // 2.tabs-宸ヨ壓璺嚎
-    //宸ヨ壓鏂囦欢閫夋嫨
+    // 宸ヨ壓鏂囦欢閫夋嫨
 
     // 宸ヨ壓璺嚎閫夋嫨
     routingSelectChanged(routingId) {
@@ -1846,8 +1923,8 @@
     },
     // 鐐瑰嚮宸ヨ壓宸ュ簭琛岃Е鍙戞牎楠屽伐鑹烘槸鍚︿慨鏀癸紝鑻ヤ慨鏀瑰垯涓嶅彲鎿嶄綔锛岄渶鍏堜繚瀛橈紝鑻ユ湭淇敼锛屽垯鍙煡璇㈠嚭瀵瑰簲鐨勫弬鏁伴泦
     operationRowClick(row) {
-        //   const row = this.operations[event.oldIndex]
-          console.log(row);
+      //   const row = this.operations[event.oldIndex]
+      console.log(row)
       if (this.dataForm.id != null && this.dataForm.id !== 0) {
         this.routingOperationId = row.technologyRoutingOperationId
         this.moRoutingOperationId = row.id
@@ -2101,11 +2178,14 @@
     },
     // 淇濆瓨鎵�鏈夊弬鏁扮殑淇敼
     saveAllParamChange() {
-      this.templateParamList.forEach(e=>{
-        if(e.paramValue!=null){
-          e.paramValue=e.paramValue.replace(',','锛�').replace('(','锛�').replace(')','锛�')
+      this.templateParamList.forEach((e) => {
+        if (e.paramValue != null) {
+          e.paramValue = e.paramValue
+            .replace(',', '锛�')
+            .replace('(', '锛�')
+            .replace(')', '锛�')
           if (!isNaN(e.paramValue)) {
-            e.paramValue='='+e.paramValue
+            e.paramValue = '=' + e.paramValue
           }
         }
       })
@@ -2215,45 +2295,70 @@
         }
       }
     },
-    // 鍒犻櫎褰撳墠宸ュ簭
-    deleteOrderOperation(row) {
-      deleteMoRoutingOperation(row.id).then((response) => {
-        const resData = response.data
-        if (resData.code === 0) {
-          const delOperation = this.operations.find((item) => {
-            return item.id === row.id
-          })
-          const delIndex = this.operations.indexOf(delOperation)
-          this.operations.splice(delIndex, 1)
-
-          // 鏌ユ壘褰撳墠鐨勯�変腑鐨勫伐搴廼d
-          const selectedOperation = this.operations.find((item) => {
-            return item.id === this.moRoutingOperationId
-          })
-          // 瀛樺湪閫変腑鐨勫伐搴�
-          if (selectedOperation) {
-            this.operationRowClick(selectedOperation)
-          } else {
-            // 涓嶅瓨鍦ㄩ�変腑鐨勫伐搴忥紝鑻his.operations涓嶄负绌猴紝鍒欏彇绗竴鏉″伐搴忥紝鑻ヤ负绌猴紝鍒欐竻绌虹浉鍏冲伐搴�
-            if (this.operations.length > 0) {
-              this.operationRowClick(this.operations[0])
-            } else {
-              // 鍙栨秷閫変腑楂樹寒
-              this.$refs.operationTable.setCurrentRow()
-              // 娓呯┖褰撳墠宸ヨ壓宸ュ簭id銆佹竻绌簉outingTemplateId銆佹竻绌哄弬鏁伴泦operationTemplateList銆佹竻绌哄弬鏁皌emplateParamList
-              this.routingOperationId = null
-              this.moRoutingOperationId = null
-              this.moRoutingOperationName = null
-              this.routingTemplateId = null
-              this.operationTemplateList = []
-              this.templateParamList = []
-            }
-          }
-          this.$message.success('璁㈠崟宸ュ簭鍒犻櫎鎴愬姛')
+    refresh() {
+      getMoRoutingOption(this.dataForm.id).then((response) => {
+        if (response.data.code === 0) {
+          this.operations = response.data.data
+          this.operationIndex += 1
         } else {
-          this.$message.error('璁㈠崟宸ュ簭鍒犻櫎澶辫触')
+          this.operations = []
         }
       })
+    },
+    // 鍒犻櫎褰撳墠宸ュ簭
+    deleteOrderOperation(row) {
+      this.$confirm('鏄惁纭鍒犻櫎?', '鎻愮ず', {
+        confirmButtonText: '纭畾',
+        cancelButtonText: '鍙栨秷',
+        type: 'warning'
+      })
+        .then(() => {
+          deleteMoRoutingOperation(row.id).then((response) => {
+            const resData = response.data
+            if (resData.code === 0) {
+              const delOperation = this.operations.find((item) => {
+                return item.id === row.id
+              })
+              const delIndex = this.operations.indexOf(delOperation)
+              this.operations.splice(delIndex, 1)
+
+              // 鏌ユ壘褰撳墠鐨勯�変腑鐨勫伐搴廼d
+              const selectedOperation = this.operations.find((item) => {
+                return item.id === this.moRoutingOperationId
+              })
+              // 瀛樺湪閫変腑鐨勫伐搴�
+              if (selectedOperation) {
+                this.operationRowClick(selectedOperation)
+              } else {
+                // 涓嶅瓨鍦ㄩ�変腑鐨勫伐搴忥紝鑻his.operations涓嶄负绌猴紝鍒欏彇绗竴鏉″伐搴忥紝鑻ヤ负绌猴紝鍒欐竻绌虹浉鍏冲伐搴�
+                if (this.operations.length > 0) {
+                  this.operationRowClick(this.operations[0])
+                } else {
+                  // 鍙栨秷閫変腑楂樹寒
+                  this.$refs.operationTable.setCurrentRow()
+                  // 娓呯┖褰撳墠宸ヨ壓宸ュ簭id銆佹竻绌簉outingTemplateId銆佹竻绌哄弬鏁伴泦operationTemplateList銆佹竻绌哄弬鏁皌emplateParamList
+                  this.routingOperationId = null
+                  this.moRoutingOperationId = null
+                  this.routingTemplateId = null
+                  this.operationTemplateList = []
+                  this.templateParamList = []
+                }
+              }
+              this.$message.success('璁㈠崟宸ュ簭鍒犻櫎鎴愬姛')
+              getMoRoutingOption(this.dataForm.id).then((response) => {
+                if (response.data.code === 0) {
+                  this.operations = response.data.data
+                  this.operationIndex += 1
+                } else {
+                  this.operations = []
+                }
+              })
+            } else {
+              this.$message.error('璁㈠崟宸ュ簭鍒犻櫎澶辫触')
+            }
+          })
+        })
+        .catch(() => {})
     },
     // 寮瑰嚭鍩虹宸ュ簭鍒楄〃
     addOrderOperation() {
@@ -2286,6 +2391,28 @@
     },
     // 鏂板宸ュ簭
     addOperation(operation) {
+      operation.moId = this.dataForm.id
+      operation.moRoutingId = this.dataForm.technologyRoutingId
+      operation.operationId = operation.id
+      operation.partId = this.dataForm.partId
+      operation.loc = null
+      operation.operationOrder = this.operations.length + 1
+      operation.id = null
+      addMoRoutingOperation(operation).then((response) => {
+        const data = response.data
+        if (data.code === 0) {
+          getMoRoutingOption(this.dataForm.id).then((response) => {
+            if (response.data.code === 0) {
+              this.operations = response.data.data
+              this.operationIndex += 1
+            } else {
+              this.operations = []
+            }
+          })
+        } else {
+          this.$message.error('娣诲姞澶辫触')
+        }
+      })
     },
     insertOperation(operation) {},
     structSelectionChange(val) {

--
Gitblit v1.9.3