分单删除

src/views/main/BookingLedger/detail/index.vue

@@ -133,6 +133,7 @@
           :checkFrom="checkFrom"
           :scrollTop="scrollTop"
           @changeHB="changeHBFun"
+          @sedOrderRemove="sedOrderRemoveFun"
         ></sedOrder>
       </a-tab-pane>
     </a-tabs>
@@ -327,39 +328,39 @@ const initDetail = {
 }
 const bookingEDIExt = {
   weiTuoFang: '',
-  ediAttn: '',
+    ediAttn: '',
-  ediAttnTel: '',
+    ediAttnTel: '',
-  ediAttnMail: '',
+    ediAttnMail: '',
-  sendCode: '',
+    sendCode: '',
-  receiveCode: '',
+    receiveCode: '',
-  amsConsignee: '',
+    amsConsignee: '',
-  amsNotifyParty: '',
+    amsNotifyParty: '',
-  opEName: '',
+    opEName: '',
-  opTel: '',
+    opTel: '',
-  opEmail: '',
+    opEmail: '',
-  goodsName: '',
+    goodsName: '',
-  orderRemark: '',
+    orderRemark: '',
-  kingTareweight: '',
+    kingTareweight: '',
-  exRemark1: '',
+    exRemark1: '',
-  exRemark2: '',
+    exRemark2: '',
-  exRemark3: '',
+    exRemark3: '',
-  exRemark4: '',
+    exRemark4: '',
-  // == 以下为太平 ==
+    // == 以下为太平 ==
-  consigneeEdiCode: '',
+    consigneeEdiCode: '',
-  shipperEdiCode: '',
+    shipperEdiCode: '',
-  notifyCdoe: '',
+    notifyCdoe: '',
-  salerCode: '',
+    salerCode: '',
-  emanifestHbl: '',
+    emanifestHbl: '',
-  masterBolIndicator: '',
+    masterBolIndicator: '',
-  s0CC0C: '',
+    s0CC0C: '',
-  ckhi: '',
+    ckhi: '',
-  cncm: '',
+    cncm: '',
-  wncm: '',
+    wncm: '',
-  acihbl: ''
+    acihbl: ''
 }
 export default {
   name: 'BookingDetail',
-  activated: function() {}, // 当页面被激活时触发 仅限首次加载
+  activated: function() { }, // 当页面被激活时触发 仅限首次加载
   inject: ['reload'],
   components: {
     operationArea,
@@ -413,18 +414,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters([
+    ...mapGetters(['bookingList', 'needSavePages', 'hasbookingDetail', 'bookingList', 'bookingGridOptions', 'carrierList', 'yardList', 'packageList', 'issuetypeList', 'blfrtList'])
-      'bookingList',
-      'needSavePages',
-      'hasbookingDetail',
-      'bookingList',
-      'bookingGridOptions',
-      'carrierList',
-      'yardList',
-      'packageList',
-      'issuetypeList',
-      'blfrtList'
-    ])
   },
   created() {
     this.init()
@@ -871,23 +861,23 @@ export default {
       this.$forceUpdate()
     },
 
-    getRightAll() {
+    getRightAll () {
       GetAllData({
         bookingId: this.id
       })
-        .then(res => {
+      .then(res => {
-          if (res.success) {
+        if (res.success) {
-            this.$set(this, 'bookingDetails', { ...this.bookingDetails, ...res.data })
+          this.$set(this, 'bookingDetails', { ...this.bookingDetails, ...res.data })
-          } else {
+        } else {
-            console.log(res.message)
+          console.log(res.message)
-          }
+        }
-        })
+      })
-        .catch(err => {
+      .catch(err => {
-          console.log(err)
+        console.log(err)
-        })
+      })
     },
 
-    upDateRightFun() {
+    upDateRightFun () {
       this.getRightAll()
     },
 
@@ -1388,6 +1378,15 @@ export default {
       if (type) {
         this.$refs.mailingInfo.$data.userHasLine = !!this.bookingDetails.lineName
       }
+    },
+    sedOrderRemoveFun(sedData) {
+      console.log('== 父组件收到子单删除数据 ==', sedData, this.bookingDetails.hbList)
+      this.$set(this.bookingDetails, 'hbList', sedData)
+      if (sedData.length === 0) {
+        console.log('== 子单删除完毕 ==')
+        this.Showtabs = false
+        this.tabActiveKey = '1'
+      }
     }
   }
 }
@@ -1395,8 +1394,9 @@ export default {
 <style lang="less" scoped>
 @import url('./style/index.less');
 .Showtabs {
-  /deep/ .ant-tabs-top-bar {
+    /deep/ .ant-tabs-top-bar {
-    display: none !important;
+      display: none !important;
+    }
   }
-}
+
 </style>

src/views/main/BookingLedger/detail/modules/sedOperationArea.vue

@@ -8,7 +8,15 @@
         <button @click="copyFun"><span class="iconfont icon-fuzhi1"></span>复制</button>
         <button @click="saveFun"><span class="iconfont icon-icon_baocun"></span>保存</button>
         <button @click="FSnhowPrintModal"><span class="iconfont icon-printing"></span>打印</button>
-        <!-- <button><span class="iconfont icon-shanchu1"></span>删除</button> -->
+        <a-popconfirm
+          title="确定删除分单？"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="removeOrder"
+          @cancel="cancelRemove"
+        >
+          <button><span class="iconfont icon-shanchu1"></span>删除</button>
+        </a-popconfirm>
       </div>
     </a-card>
     <!-- 打印弹窗 start -->
@@ -140,6 +148,12 @@ export default {
         .catch(err => {
           console.log(err)
         })
+    },
+    removeOrder () {
+      this.$emit('remove')
+    },
+    cancelRemove () {
+      console.log('= 取消删除 =')
     }
   }
 }

src/views/main/BookingLedger/detail/modules/sedOrder.vue

@@ -14,12 +14,20 @@
               v-for="(sedDetail, sindex) in sedOrderList"
               :key="sindex"
               :class="{ active: editIndex === sindex }"
-              @click="changeOrder(sindex)"
             >
-              <i class="iconfont icon-dingdan"></i>
+              <div class="left" @click.stop="changeOrder(sindex)">
-              分单{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
+                <i class="iconfont icon-dingdan"></i>分单{{ sindex + 1 }}: {{ sedDetail.hblno || '请填写分单号' }}
+              </div>
               <span class="no-save" v-if="sedDetail.isNoSave && editIndex !== sindex">（未保存） </span>
-              <!-- <i class="remove-btn iconfont icon-shanchu1"></i> -->
+              <a-popconfirm
+                title="确定删除分单？"
+                ok-text="是"
+                cancel-text="否"
+                @confirm.stop="removeSedOrderFun(sedDetail, sindex)"
+                @cancel="cancelRemove"
+              >
+                <span class="remove-btn iconfont icon-shanchu1"></span>
+              </a-popconfirm>
             </div>
             <div class="sed-order-btn" @click="addSedOrder"><i class="iconfont icon-jiahao2fill"></i>添加分单</div>
           </div>
@@ -36,6 +44,7 @@
             :class="scrollTop < 100 ? 'normal-nav' : 'fixed-nav'"
             @save="saveFun"
             @copy="copyFun"
+            @remove="removeFun"
           ></sedOperationArea>
           <ul class="sec-parent-tabs-box">
             <div class="parents-tabs-top">
@@ -146,7 +155,7 @@ import remarksInfo from './remarksInfo'
 import goodsTable from './goodsTable'
 import ediMore from './ediMore'
 import rules from '../rules'
-import { BookingOrderSave } from '@/api/modular/main/BookingLedger'
+import { BookingOrderSave, DeleteBookingOrder } from '@/api/modular/main/BookingLedger'
 export default {
   name: 'SedOrder',
   props: {
@@ -376,7 +385,7 @@ export default {
           ediAttnMail: ''
         }
       }
-      if (this.ifCompare(this.sedOrderList[this.editIndex], detail) && !this.inSecLoad) {
+      if (this.ifCompare(this.sedOrderList[this.editIndex], detail) && !this.inSecLoad && type !== 'save') {
         this.sedOrderList[this.editIndex].isNoSave = true
       }
       this.editDetails = detail
@@ -556,6 +565,60 @@ export default {
     },
     changeParentTabs(type) {
       this.mainOrderActiveKey = type
+    },
+    removeSedOrderFun (data, index) {
+      this.deleteBookingOrder(data.id, index)
+    },
+    removeFun () {
+      this.deleteBookingOrder(this.editDetails.id, this.editIndex)
+    },
+    deleteBookingOrder (id, index) {
+      // eslint-disable-next-line eqeqeq
+      if (id == 0) {
+        this.removeSucc(id, index)
+        return false
+      }
+      this.inSecLoad = true
+      DeleteBookingOrder([id].toString()).then(res => {
+        if (res.success) {
+          this.$message.success('删除成功')
+          this.removeSucc(id, index)
+        } else {
+          this.$message.error(res.message)
+        }
+      })
+      .catch(err => {
+        console.log(err)
+      })
+    },
+    removeSucc (id, index) {
+      const removeIndex = index
+      console.log('当前删除分单index为', removeIndex)
+      this.sedOrderList.splice(removeIndex, 1)
+      this.$emit('sedOrderRemove', this.sedOrderList)
+      if (this.sedOrderList.length === 0) {
+        console.log('== 子单列表删除完毕 ==')
+        this.editIndex = 0
+        this.editDetails = null
+        return false
+      }
+      if (this.editDetails.id === id) {
+        console.log('== 删除数据为当前编辑数据 ==')
+        const num = this.editIndex === 0 ? 0 : this.editIndex - 1
+        this.editIndex = num > this.sedOrderList.length ? this.sedOrderList.length - 1 : num
+        this.editDetails = this.sedOrderList[this.editIndex]
+        console.log('== 删除数据为当前编辑数据 end ==', this.editIndex, this.editDetails)
+      } else {
+        this.editIndex = removeIndex < this.editIndex ? this.editIndex - 1 : this.editIndex
+        console.log('== 删除分单 index ==', this.editIndex)
+      }
+      setTimeout(() => {
+        this.inSecLoad = false
+      }, 200)
+      this.$forceUpdate()
+    },
+    cancelRemove () {
+      console.log('== 取消删除 ==')
     }
   }
 }

src/views/main/BookingLedger/detail/style/sedOrder.less

@@ -57,6 +57,14 @@
     padding-top: 0px;
     transition: 0.5s all;
     border-radius: 4px;
+    .remove-btn{
+      float: right;
+      color: #f6826b;
+      display: block;
+      width: 30px;
+      text-align: center;
+      cursor: pointer;
+    }
     &.show-nav {
       width: 100%;
       animation-name: showNav 0.6s;
@@ -156,13 +164,18 @@
       text-overflow: ellipsis;
       white-space: nowrap;
       cursor: pointer;
-      // display: flex;
+      display: flex;
       padding-left: 10px;
+      .left{
+        flex: 1;
+        // float: left;
+      }
     }
     .active {
       color: @primary-color;
       // background: #f5f9fe;
       position: relative;
+      padding-right: 30px;
       &::after {
         content: '';
         position: absolute;
@@ -174,6 +187,9 @@
         background: @primary-color;
         opacity: 0.04;
       }
+      .remove-btn{
+        display: none;
+      }
     }
     .sed-order-btn {
       margin: 20px auto;