12/2

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

@@ -37,7 +37,9 @@
                     <a-button class="more-search" @click="tableMoreRefresh"
                       >多提单号查询<a-icon type="search"
                     /></a-button>
-                    <span class="tab-btn" @click="formSetting"><a-icon type="setting" :style="{marginLeft:'0px'}" /></span>
+                    <span class="tab-btn" @click="formSetting"
+                      ><a-icon type="setting" :style="{ marginLeft: '0px' }"
+                    /></span>
                     <a class="senior-search" @click="toggleAdvanced">
                       {{ advanced ? '收起查询' : '更多查询' }}
                       <!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
@@ -73,7 +75,10 @@
               style="margin-top:15px;"
             >
               <template #mblno="{ row }">
-                <div class="mblno">{{ row.mblno }}</div>
+                <div class="mblno">
+                  <span @click="editColumns(row)">{{ row.mblno }}</span>
+                  <a-icon class="CSMblnoCopy" type="copy" @click="FnCopy(row.mblno)" />
+                </div>
               </template>
               <template #vessel="{ row }">
                 <div class="vessel">{{ row.vessel }}</div>
@@ -236,6 +241,15 @@ export default {
   },
   methods: {
     ...mapActions(['setBookingList']),
+    FnCopy(data) {
+      const el = document.createElement('input')
+      el.setAttribute('value', data)
+      document.body.appendChild(el)
+      el.select()
+      document.execCommand('copy')
+      document.body.removeChild(el)
+      this.$message.success('复制成功!')
+    },
     init(queryParam = {}) {
       console.log(queryParam, 'queryParam')
       this.gridOptions.pagerConfig = {
@@ -558,12 +572,19 @@ export default {
 </style>
 <style lang="less" scoped>
 /*订舱表格内字体颜色 */
-/*.mblno{
+.mblno {
   color: #3277ff;
+  span {
+    margin-right: 0.5rem;
+    cursor: pointer;
+  }
+  .CSMblnoCopy {
+    cursor: pointer;
+  }
 }
-.vessel {
+// .vessel {
-  color: #77c950;
+//   color: #77c950;
-}*/
+// }
 .nav-box {
   margin-bottom: 10px;
   padding: 0 10px;
@@ -763,8 +784,8 @@ export default {
   }
 }
 /*查询区日期默认颜色 */
-/deep/ .ant-calendar-today{
+/deep/ .ant-calendar-today {
-  .ant-calendar-date{
+  .ant-calendar-date {
     color: @primary-color !important;
     border-color: @primary-color !important;
   }