From b194d55f72a6ac6ec41afa92066c8d77a18f2fd5 Mon Sep 17 00:00:00 2001
From: lilu <lilu@myshipping.net>
Date: Wed, 21 Dec 2022 17:18:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9BUG?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../detail/components/sedOrder.vue            |  33 +++-
 .../detail/modules/basicInfo.vue              | 178 ++++++++++++------
 .../detail/modules/rightContent.vue           |   2 +-
 src/views/main/BookingLedger/list/index.vue   |   2 -
 4 files changed, 146 insertions(+), 69 deletions(-)

diff --git a/src/views/main/BookingLedger/detail/components/sedOrder.vue b/src/views/main/BookingLedger/detail/components/sedOrder.vue
index e0ab26e..be4bfa3 100644
--- a/src/views/main/BookingLedger/detail/components/sedOrder.vue
+++ b/src/views/main/BookingLedger/detail/components/sedOrder.vue
@@ -106,7 +106,8 @@ export default {
       inPageLoading: false,
       editDetails: null,
       editIndex: 0,
-      showSecNav: true
+      showSecNav: true,
+      inSecLoad: false
     }
   },
   watch: {
@@ -148,7 +149,6 @@ export default {
    },
   created() {
     if (this.sedOrderList.length > 0) {
-      console.log('=== 分单加载 created ===')
       const data = JSON.parse(JSON.stringify(this.sedOrderList[0]))
       if (!data.bookingEDIExt) {
         data.bookingEDIExt = {
@@ -159,6 +159,10 @@ export default {
         }
       }
       this.editDetails = data
+      this.inSecLoad = true
+      setTimeout(() => {
+        this.inSecLoad = false
+      }, 1000)
     }
   },
   mounted() {
@@ -202,12 +206,26 @@ export default {
           ediAttnMail: ''
         }
       }
+      // console.log('=== 分单更新 ===', !this.inSecLoad, this.ifCompare(this.sedOrderList[this.editIndex], detail))
+      if (this.ifCompare(this.sedOrderList[this.editIndex], detail) && !this.inSecLoad) {
+        this.sedOrderList[this.editIndex].isNoSave = true
+      }
       this.editDetails = detail
       this.sedOrderList[this.editIndex] = detail
-      this.editDetails.isNoSave = true
-      this.sedOrderList[this.editIndex].isNoSave = true
       this.$forceUpdate()
     },
+
+    ifCompare(object1, object2) {
+      var o1keys = Object.keys(object1);
+      var o2keys = Object.keys(object2);
+      if (o2keys.length !== o1keys.length) return false;
+      for (let i = 0; i <= o1keys.length - 1; i++) {
+        let key = o1keys[i];
+        if (!o2keys.includes(key)) return false;
+        if (object2[key] !== object1[key]) return false;
+      }
+      return true;
+    },
 		// 操作按钮
     refreshPage() {
       // this.init()
@@ -252,7 +270,7 @@ export default {
       }
       let data = JSON.parse(JSON.stringify(this.editDetails))
       delete data.isNoSave
-      data.pid = this.$route.query.id
+      data.parentId = this.$route.query.id
       data.id = 0
       data.ctnInputs.map((item, index) => {
         item.id = 0
@@ -263,7 +281,6 @@ export default {
           this.sedOrderList[this.editIndex].isNoSave = false
           this.editDetails.isNoSave = false
           this.sedOrderList[this.editIndex].id = res.data
-          debugger
           this.$message.success('保存成功')
           this.$emit('changeHB', this.sedOrderList)
           this.$forceUpdate()
@@ -291,6 +308,10 @@ export default {
         }
       }
       this.editDetails = data
+      this.inSecLoad = true
+      setTimeout(() => {
+        this.inSecLoad = false
+      }, 1000)
     },
 
     copyFun () {
diff --git a/src/views/main/BookingLedger/detail/modules/basicInfo.vue b/src/views/main/BookingLedger/detail/modules/basicInfo.vue
index 0479811..86fcdb8 100644
--- a/src/views/main/BookingLedger/detail/modules/basicInfo.vue
+++ b/src/views/main/BookingLedger/detail/modules/basicInfo.vue
@@ -370,13 +370,14 @@
           <vxe-toolbar>
             <template #buttons>
               <vxe-button status="success" icon="vxe-icon-square-plus" @click="insertEvent()">新增</vxe-button>
-              <vxe-button status="danger" icon="vxe-icon-delete" @click="$refs.xTable.removeCheckboxRow()">
+              <vxe-button status="danger" icon="vxe-icon-delete" @click="removeLine">
                 删除选中
               </vxe-button>
               <vxe-button status="primary" icon="vxe-icon-save" @click="saveEvent">保存</vxe-button>
             </template>
           </vxe-toolbar>
-          <vxe-table
+
+          <!-- <vxe-table
             border
             show-overflow
             keep-source
@@ -435,7 +436,20 @@
                 </vxe-select>
               </template>
             </vxe-column>
-          </vxe-table>
+          </vxe-table> -->
+          
+          <ve-table
+            borderY
+            :columns="columns"
+            :table-data="tableData"
+            :cell-autofill-option="cellAutofillOption"
+            :editOption="editOption"
+            rowKeyFieldName="rowKey"
+            :rowStyleOption="rowStyleOption"
+            :checkbox-option="checkboxOption"
+            :clipboard-option="clipboardOption"
+          />
+          <div class="table-no-data" v-if="tableData.length == 0">暂无数据</div>
         </div>
       </template>
       <template v-else-if="customerType === 'add'">
@@ -523,11 +537,54 @@ export default {
         hideSelectAll: false,
         // 行选择改变事件
         selectedRowChange: ({ row, isSelected, selectedRowKeys }) => {
-          console.log('行选择', row, isSelected, selectedRowKeys)
+          this.selectArr = selectedRowKeys
         },
         // 全选改变事件
         selectedAllChange: ({ isSelected, selectedRowKeys }) => {
-          console.log('全选', isSelected, selectedRowKeys)
+          if (isSelected) {
+            this.selectArr = selectedRowKeys
+          } else {
+            this.selectArr = []
+          }
+        }
+      },
+      // 单元格复制
+      clipboardOption: {
+        copy: true,
+        paste: true,
+        cut: true,
+        delete: true,
+        beforeCopy: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('beforeCopy')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        afterCopy: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('afterCopy')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        beforePaste: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('beforePaste')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        afterPaste: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('afterPaste')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        beforeCut: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('beforeCut')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        afterCut: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('afterCut')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        beforeDelete: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('beforeDelete')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
+        },
+        afterDelete: ({ data, selectionRangeIndexes, selectionRangeKeys }) => {
+          console.log('afterDelete')
+          this.log({ data, selectionRangeIndexes, selectionRangeKeys })
         }
       },
       columns: [
@@ -540,61 +597,38 @@ export default {
           operationColumn: true,
           align: 'center'
         },
-        { field: 'col1', key: 'col1', title: '联系人', edit: true },
-        { field: 'col2', key: 'col2', title: '邮箱', edit: true },
-        { field: 'col3', key: 'col3', title: '电话', edit: true },
-        { field: 'col4', key: 'col4', title: '备注', edit: true },
-        {
-          field: 'col5',
-          key: 'col5',
-          title: 'BC',
-          width: '7%',
-          renderBodyCell: ({ row, column, rowIndex }, h) => {
-            return (
-              <a-checkbox
-                value={row['BC']}
-                on-change={val => {
-                  console.log(val)
-                }}
-              />
-            )
-          }
-        },
-        {
-          field: 'col6',
-          key: 'col6',
-          title: '提单',
-          width: '7%',
-          renderBodyCell: ({ row, column, rowIndex }, h) => {
-            return (
-              <a-checkbox
-                value={row['col6']}
-                on-change={val => {
-                  console.log(val)
-                }}
-              />
-            )
-          }
-        },
-        {
-          field: 'col7',
-          key: 'col7',
-          title: '账单',
-          width: '7%',
+        { field: 'name', key: 'name', title: '联系人', edit: true },
+        { field: 'email', key: 'email', title: '邮箱', edit: true },
+        { field: 'tel', key: 'tel', title: '电话', edit: true },
+        { field: 'remark', key: 'remark', title: '备注', edit: true },
+        { field: 'roleCode',
+          key: 'roleCode',
+          title: '角色',
+          edit: false,
+          width: 260,
           renderBodyCell: ({ row, column, rowIndex }, h) => {
             return (
-              <a-checkbox
-                value={row['col7']}
+              <a-select
+                mode="multiple"
+                value={row['roleCode']}
+                option-filter-prop="children"
+                style="width: 240px"
+                placeholder="请选择角色"
                 on-change={val => {
-                  console.log(val)
+                 console.log(val, row['roleCode'])
+                 row['roleCode'] = val
                 }}
-              />
+              >
+                {this.ContactType.map((item, index) => {
+                  return <a-select-option value={item.name}>{item.name}</a-select-option>
+                })}
+              </a-select>
             )
-          }
-        }
+          } }
       ],
       tableData: [],
       etdWeek: '',
+      selectArr: [],
       // 选择客户 / 关系人弹窗 - end
       customerContactsData: [],
       ContactType: [],
@@ -803,15 +837,23 @@ export default {
 
     // ---------- 新增 ----------
     async insertEvent(row) {
-      const $table = this.$refs.xTable
-      const record = {}
-      const { row: newRow } = await $table.insertAt(record, row)
-      await $table.setActiveCell(newRow, 'name')
+      // const $table = this.$refs.xTable
+      // const record = {}
+      // const { row: newRow } = await $table.insertAt(record, row)
+      // await $table.setActiveCell(newRow, 'name')
+      const data = {
+        email: '',
+        name: '',
+        remark: '',
+        roleCode: [],
+        tel: '',
+        rowKey: this.tableData.length > 0 ? Number(this.tableData[this.tableData.length - 1].rowKey) + 1 : 0
+      }
+      this.tableData.push(data)
     },
     // ---------- 保存 ----------
     saveEvent() {
-      const $table = this.$refs.xTable
-      const { fullData } = $table.getTableData()
+      const fullData = this.tableData
       fullData.forEach(item => {
         item.WroleCode = ''
         item.bookingId = this.$route.query.id
@@ -829,10 +871,11 @@ export default {
           })
         }
       })
-      let data = JSON.parse(JSON.stringify(fullData))
+      const data = JSON.parse(JSON.stringify(fullData))
       data.forEach(item => {
         // if (item.WroleCode) {
         item.roleCode = item.WroleCode
+        delete item.rowKey
         // }
       })
       BookingOrderContactSavebatch(this.$route.query.id, data).then(res => {
@@ -860,7 +903,7 @@ export default {
         this.etdWeek = this.getWeek(this.details.etd)
       }
       this.ContactType = this.$options.filters['dictData']('booking_contact_type')
-      // console.log(this.ContactType, 'this.ContactType')
+      console.log(this.ContactType, 'this.ContactType')
     },
     // 客户 - start
     getDjyCustomerpage(name = '', type, key) {
@@ -1121,6 +1164,9 @@ export default {
               }
               item.roleCode = WroleCode
             })
+            res.data.rows.map((item, index) => {
+              item.rowKey = index
+            })
             this.tableData = res.data.rows
           })
         } else {
@@ -1135,6 +1181,15 @@ export default {
       this.customerType = ''
       this.customerVisible = false
     },
+    removeLine() {
+      this.selectArr.map((item, index) => {
+        this.tableData.map((oitem, oindex) => {
+          if (item === oitem.rowKey) {
+            this.tableData.splice(oindex, 1)
+          }
+        })
+      })
+    },
     // 关系人弹窗 - end
     changeEtd(date, dateString) {
       this.details.etd = dateString
@@ -1243,6 +1298,9 @@ export default {
 .list-item2:hover {
   background-color: #f5f7fa;
 }
+.table-no-data {
+  text-align: center;
+}
 
 // .ant-calendar-picker-input{
 //   padding: 0 4px;
diff --git a/src/views/main/BookingLedger/detail/modules/rightContent.vue b/src/views/main/BookingLedger/detail/modules/rightContent.vue
index 4d44fcf..087a934 100644
--- a/src/views/main/BookingLedger/detail/modules/rightContent.vue
+++ b/src/views/main/BookingLedger/detail/modules/rightContent.vue
@@ -50,7 +50,7 @@
         <div class="remark" v-for="(remark, rindex) in remarkList" :key="rindex">
           <div class="remark-main">
             <div class="top"><i class="iconfont icon-yuandian"></i>{{ remark.remark }}</div>
-            <div class="bottom">{{ remark.createdTime }} </div>
+            <div class="bottom">{{ remark.updatedTime || remark.createdTime }} </div>
           </div>
           <div class="remark-btn" @click="editRemark(remark)"><i class="iconfont icon-bianji1"></i></div>
         </div>
diff --git a/src/views/main/BookingLedger/list/index.vue b/src/views/main/BookingLedger/list/index.vue
index 3a7362c..119173d 100644
--- a/src/views/main/BookingLedger/list/index.vue
+++ b/src/views/main/BookingLedger/list/index.vue
@@ -765,14 +765,12 @@ export default {
     remarkhover (e, data) {
       if (data.bookremark.length > 0) {
         const maxWidth = window.innerWidth
-        const maxHeight = window.innerHeight
         if (maxWidth - e.pageX > 230) {
           this.remarkScreenX = e.pageX + 20
         } else {
           this.remarkScreenX = e.pageX - 300
         }
         this.remarkScreenY = e.pageY + 20
-        console.log(this.remarkScreenX, this.remarkScreenY, maxWidth, maxHeight)
         this.remarkData = data.bookremark
         this.remarkShow = true
       }