From d242f751488b4d02a477bd616e81caac43024087 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=90=8C=E6=B5=B7?= <963808678@qq.com>
Date: Mon, 17 Apr 2023 09:04:19 +0800
Subject: [PATCH] 4/17

---
 src/views/main/BookingLedger/list/index.vue   |   22 +-
 .../main/BookingLedger/list/index_zth.vue     | 2731 -----------------
 2 files changed, 17 insertions(+), 2736 deletions(-)
 delete mode 100644 src/views/main/BookingLedger/list/index_zth.vue

diff --git a/src/views/main/BookingLedger/list/index.vue b/src/views/main/BookingLedger/list/index.vue
index 5c3d475..50e9bf3 100644
--- a/src/views/main/BookingLedger/list/index.vue
+++ b/src/views/main/BookingLedger/list/index.vue
@@ -300,10 +300,10 @@
             >
               <p>{{ item.fieldName }}:</p>
               <p>{{ item.reqVal }}</p>
-              <p v-if="item.msg">
+              <p v-if="item.msg" :style="{ flex: 1 }">
                 <a-icon type="close" :style="{ color: 'red' }" />
               </p>
-              <p v-else><a-icon type="check" :style="{ color: 'green' }" /></p>
+              <p v-else :style="{ flex: 1 }"><a-icon type="check" :style="{ color: 'green' }" /></p>
               <p>{{ item.fieldName }}:</p>
               <p v-if="!item.isDiff">{{ item.targetVal }}</p>
               <p v-else v-html="item.mergeHtml"></p>
@@ -329,10 +329,10 @@
             >
               <p>{{ item.fieldName }}:</p>
               <p>{{ item.reqVal }}</p>
-              <p v-if="item.msg">
+              <p v-if="item.msg" :style="{ flex: 1 }">
                 <a-icon type="close" :style="{ color: 'red' }" />
               </p>
-              <p v-else><a-icon type="check" :style="{ color: 'green' }" /></p>
+              <p v-else :style="{ flex: 1 }"><a-icon type="check" :style="{ color: 'green' }" /></p>
               <p>{{ item.fieldName }}:</p>
               <p v-if="!item.isDiff">{{ item.targetVal }}</p>
               <p v-else v-html="item.mergeHtml"></p>
@@ -2707,6 +2707,12 @@ export default {
     .TaskShippingOrderCompareMainHeader {
       display: flex;
       > div {
+        &:nth-child(1) {
+          flex: 3;
+        }
+        &:nth-child(3) {
+          flex: 3;
+        }
         flex: 1;
         > p {
           &:first-child {
@@ -2726,7 +2732,13 @@ export default {
       align-items: center;
       margin-bottom: 0.5rem;
       > p {
-        flex: 1;
+        flex: 2;
+        &:nth-child(1) {
+          flex: 1;
+        }
+        &:nth-child(4) {
+          flex: 1;
+        }
         // &:nth-child(3) {
         //   flex: 2;
         //   margin: 0 1rem;
diff --git a/src/views/main/BookingLedger/list/index_zth.vue b/src/views/main/BookingLedger/list/index_zth.vue
deleted file mode 100644
index 7a39331..0000000
--- a/src/views/main/BookingLedger/list/index_zth.vue
+++ /dev/null
@@ -1,2731 +0,0 @@
-<template>
-  <div style="margin-top: -16px;margin-left:-4px;margin-right:-4px;" @click="pageClick">
-    <a-spin tip="Loading..." :spinning="spinning">
-      <a-row :gutter="24">
-        <a-col :md="24" :sm="24" style="padding: 0 0 0 0" class="content-box">
-          <x-card class="content-nav">
-            <div slot="content" class="table-page-search-wrapper">
-              <a-form layout="inline">
-                <a-row :gutter="48" class="booking-from-box">
-                  <template v-for="(formLabel, findex) in formData">
-                    <a-col
-                      :md="6"
-                      :lg="6"
-                      :xl="4"
-                      :key="findex"
-                      v-if="(findex < 4 && !advanced) || advanced"
-                      class="from-label"
-                    >
-                      <a-form-item style="padding-left:10px;padding-right:10px;" :label="formLabel.title">
-                        <formLabel
-                          :ref="`fromlabel-${formLabel.label}`"
-                          :labelData="formLabel"
-                          :formRes="formRes"
-                          :resetType="ResetType"
-                          :formIndex="findex"
-                          @change="formChange"
-                          @pressEnter="pressEnterFun"
-                          @getCompleteList="getCompleteListFun"
-                          @selectFirst="getSelectFirst"
-                        ></formLabel>
-                      </a-form-item>
-                    </a-col>
-                  </template>
-                  <a-col :xl="formBtnCol || (!advanced && 8)" :lg="24" :md="24" :sm="24">
-                    <span
-                      class="table-page-search-submitButtons"
-                      :style="(advanced && { float: 'right', overflow: 'hidden' }) || {}"
-                    >
-                      <a-button size="small" type="primary" @click="tableRefresh">查询</a-button>
-                      <a-button size="small" class="reset" @click="tableReset">重置</a-button>
-                      <template v-if="screenWidth > 1600">
-                        <a-button size="small" 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>
-                        <a class="senior-search" @click="toggleAdvanced" v-if="formData.length > 4">
-                          {{ advanced ? '收起查询' : '更多查询' }}
-                          <!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
-                          <i class="iconfont" :class="advanced ? 'icon-shouqi' : 'icon-zhankai'"></i>
-                        </a>
-                      </template>
-                      <template v-else>
-                        <a-button size="small" 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>
-                        <a class="senior-search" @click="toggleAdvanced" v-if="formData.length > 4">
-                          {{ advanced ? '收起' : '更多' }}
-                          <!-- <a-icon :type="advanced ? 'up' : 'down'" /> -->
-                          <i class="iconfont" :class="advanced ? 'icon-shouqi' : 'icon-zhankai'"></i>
-                        </a>
-                      </template>
-                    </span>
-                  </a-col>
-                </a-row>
-              </a-form>
-              <!-- <template v-for="(formLabel, findex) in formData" v-if="(findex < 4 && !advanced) || advanced">
-              <div class="form-box" :key="findex">
-                <div class="form-label">
-                  <span class="label">{{ formLabel.title }}</span>
-                </div>
-                <div class="form-content">
-                  <formLabel
-                    :ref="`fromlabel-${formLabel.label}`"
-                    :labelData="formLabel"
-                    :formRes="formRes"
-                    :resetType="ResetType"
-                    :formIndex="findex"
-                    @change="formChange"
-                    @pressEnter="pressEnterFun"
-                    @getCompleteList="getCompleteListFun"
-                    @selectFirst="getSelectFirst"
-                  ></formLabel>
-                </div>
-              </div>
-            </template> -->
-            </div>
-          </x-card>
-          <x-card class="content-table" style="margin-top:-6px;">
-            <div slot="content" class="table-page-search-wrapper" :style="{ marginTop: '-8px' }">
-              <vxe-toolbar>
-                <template #buttons>
-                  <div class="nav-box">
-                    <div class="nav" @click="addBooking"><i class="iconfont icon-jiahao2fill"></i>新建</div>
-                    <div class="nav" @click="copyBooking"><i class="iconfont icon-fuzhi"></i>复制</div>
-                    <div class="nav" @click="copyBookingMore"><i class="iconfont icon-fuzhi1"></i>复制多票</div>
-                    <div class="nav" @click="batchEditing"><i class="iconfont icon-bianjiwenjian"></i>批量编辑</div>
-                    <div class="nav"><i class="iconfont icon-shujushangchuan-shixin"></i>批量VGM</div>
-                    <!-- <div class="nav" @click="excuteShippingOrderCompareBatch"><i class="iconfont icon-weibiaoti--"></i>下货纸比对</div> -->
-                    <a-popconfirm
-                      title="确定进行下货纸比对？"
-                      ok-text="是"
-                      cancel-text="否"
-                      @confirm="excuteShippingOrderCompareBatch"
-                      @cancel="cancelRemove"
-                    >
-                      <div class="nav"><i class="iconfont  icon-duibi"></i>下货纸比对</div>
-                    </a-popconfirm>
-                    <a-popconfirm
-                      title="确定删除当前选中订舱？"
-                      ok-text="是"
-                      cancel-text="否"
-                      @confirm="removeMoreFun"
-                      @cancel="cancelRemove"
-                    >
-                      <div class="nav"><i class="iconfont icon-shanchu2"></i>删除</div>
-                    </a-popconfirm>
-                    <div class="nav"><i class="iconfont icon-shishijifei"></i>定时订舱</div>
-                    <div class="nav"><i class="iconfont icon-xiaopiaodayin"></i>小票状态</div>
-                    <div class="nav" @click="openTraceModel"><i class="iconfont icon-yunshu1"></i>运踪订阅</div>
-                  </div>
-                </template>
-                <template #tools>
-                  <div class="right BookTopButton">
-                    <span class="tab-btn" @click="tableRefresh">
-                      <a-icon type="redo" :style="{ fontSize: '14px', transform: 'rotate(278deg)' }" />
-                    </span>
-                    <span class="tab-btn" @click="tableHeaderEdit">
-                      <a-icon type="setting" :style="{ fontSize: '14px' }" />
-                    </span>
-                  </div>
-                </template>
-              </vxe-toolbar>
-              <vxe-grid
-                ref="xGrid"
-                v-bind="gridOptions"
-                row-class-name="line-box"
-                :height="tableHeight"
-                :checkbox_config="{ checkField: 'checked' }"
-                :scroll-x="{ gt: 10, oSize: 10, enabled: false }"
-                :scroll-y="{ gt: 20, oSize: 20, enabled: true }"
-                @page-change="handlePageChange"
-                @cell-dblclick="handledbclick"
-                @resizable-change="resizableChange"
-                @sort-change="tableSortChange"
-                @scroll="pageClick"
-                @checkbox-change="checkboxChangeEvent"
-              >
-                <template #mblno="{ row }">
-                  <div class="mblno">
-                    <span @click="editColumns(row)">{{ row.mblno }}</span>
-                    <a-icon class="CSMblnoCopy" type="copy" @click="FnCopy(row.mblno)" />
-                  </div>
-                </template>
-                <template #pono="{ row }">
-                  <div class="pono">
-                    {{ row.pono }}
-                  </div>
-                </template>
-                <template #vessel="{ row }">
-                  <div class="vessel">{{ row.vessel }}</div>
-                </template>
-                <template #remarks="{ row }">
-                  <a-popover title="备注消息">
-                    <template slot="content">
-                      <p>订舱备注： {{ row.soremark }}</p>
-                      <p>截单备注： {{ row.siremark }}</p>
-                    </template>
-                    <div class="remarks">{{ row.soremark }} / {{ row.siremark }}</div>
-                  </a-popover>
-                </template>
-                <template #etd="{ row }">
-                  <div class="etd" v-if="row.etd">{{ row.etd.substring(0, 10) }}</div>
-                </template>
-                <template #atd="{ row }">
-                  <div class="atd" v-if="row.atd">{{ row.atd.substring(0, 10) }}</div>
-                </template>
-                <template #issuedate="{ row }">
-                  <div class="atd" v-if="row.issuedate">{{ row.issuedate.substring(0, 10) }}</div>
-                </template>
-                <template #closingdate="{ row }">
-                  <div class="closingdate" v-if="row.closingdate">{{ row.closingdate.substring(0, 13) }}</div>
-                </template>
-                <template #operate="{ row }">
-                  <vxe-button
-                    class="operate-btn"
-                    type="text"
-                    icon="vxe-icon-edit"
-                    @click="editColumns(row)"
-                  ></vxe-button>
-                  <a-popconfirm
-                    title="确定删除当前订舱？"
-                    ok-text="是"
-                    cancel-text="否"
-                    @confirm="removeFun(row)"
-                    @cancel="cancelRemove"
-                  >
-                    <vxe-button class="operate-btn" type="text" icon="vxe-icon-delete"></vxe-button>
-                  </a-popconfirm>
-                </template>
-                <!-- <template #bookstatus="{ row }">
-                <span class="book-btn" v-for="(btn,bindex) in row.bookstatus" :class="btn.staCode" :key="bindex"> {{ enmuBookingBtn(btn.staCode) }}<i>/</i></span>
-              </template> -->
-                <template #bookstatus="{ row, column }">
-                  <div class="billtrace-box" :class="column.resizeWidth > 240 ? 'normal-box' : 'flex-box'">
-                    <div
-                      class="billtrace-btn"
-                      v-for="(btn, bindex) in row.bookstatus"
-                      :class="btn.staCode"
-                      :key="bindex"
-                    >
-                      <a-popover placement="topLeft" v-if="btn.staTime">
-                        <div slot="content">{{ btn.staTime }}</div>
-                        <span :class="{ active: btn.isChecked }">{{ enmuBookingBtn(btn.staCode) }}</span>
-                      </a-popover>
-                      <span :class="{ active: btn.isChecked }" v-else>{{ enmuBookingBtn(btn.staCode) }}</span>
-                      <i
-                        class="iconfont icon-xiaoyoujiantou"
-                        :class="{ hide: bindex === row.bookstatus.length - 1 }"
-                      ></i>
-                    </div>
-                  </div>
-                </template>
-                <template #bookremark="{ row }">
-                  <!-- @mouseover="remarkhover($event, row)" -->
-                  <div class="bookremark" @mouseover="remarkhover($event, row)" @mouseleave="remarkLeave($event, row)">
-                    <span class="reamrk-label">
-                      <template v-for="remark in row.bookremark">
-                        {{ remark.remark }}
-                      </template>
-                    </span>
-                  </div>
-                </template>
-
-                <template #goodsStatusList="{ row }">
-                  <div class="goods-status">
-                    <div class="goods-status-left">
-                      <template v-for="(status, sindex) in row.goodsStatusList">
-                        <a-popover placement="top" :key="sindex" v-show="status.finishTime || status.remark">
-                          <div slot="content">
-                            <div v-if="status.finishTime">时间：{{ status.finishTime }}</div>
-                            <div v-if="status.remark">备注：{{ status.remark }}</div>
-                            <div v-if="status.extData">显示天数：{{ status.extData }}</div>
-                          </div>
-                          <span class="goods-tip">{{ status.statusName }}</span>
-                        </a-popover>
-                      </template>
-                    </div>
-                    <!-- @mouseover="goodStatusHover($event, row)" @mouseleave="goodStatusLeave($event, row)" -->
-                    <div class="goods-status-right" @click.stop="goodStatusclick($event, row)" v-if="row.hasGoods > 0">
-                      <i class="iconfont icon-zhankai2"></i>
-                    </div>
-                  </div>
-                </template>
-
-                <template #dzRemark="{ row }">
-                  <div v-if="row.dzRemark">
-                    <a-popover placement="topLeft" :content="row.dzRemark">
-                      <span class="dzRemark">{{ row.dzRemark }}</span>
-                    </a-popover>
-                  </div>
-                </template>
-
-                <template #czRemark="{ row }">
-                  <div v-if="row.czRemark">
-                    <a-popover placement="topLeft" :content="row.czRemark">
-                      <span class="czRemark">{{ row.czRemark }}</span>
-                    </a-popover>
-                  </div>
-                </template>
-
-                <template #empty>
-                  <span class="no-data">
-                    <i class="iconfont icon-queshengye_zanwushuju"></i>
-                    <p>没有更多数据了！</p>
-                  </span>
-                </template>
-              </vxe-grid>
-            </div>
-          </x-card>
-        </a-col>
-      </a-row>
-      <a-modal
-        title="下货纸比对（有差异）"
-        @cancel="TaskShippingOrderCompareHandleCancel"
-        :visible="TaskShippingOrderCompareVisible"
-        width="60%"
-      >
-        <template slot="footer">
-          <a-button key="back" @click="TaskShippingOrderCompareHandleCancel">
-            关闭
-          </a-button>
-        </template>
-        <p class="TaskShippingOrderCompareP">
-          {{ TaskShippingOrderCompareData.compareTime }} 比对异常 合计
-          <span class="TaskShippingOrderCompareSpan">{{ TaskShippingOrderCompareData.showDetailList.length }}</span> 条
-        </p>
-        <div class="TaskShippingOrderCompareMainBox">
-          <div class="TaskShippingOrderCompareMain">
-            <div class="TaskShippingOrderCompareMainHeader">
-              <div>
-                <p>提单号：（本地数据）</p>
-                <p>--------------------------</p>
-                <p>{{ TaskShippingOrderCompareData.mBlNo }}</p>
-              </div>
-              <div></div>
-              <div>
-                <p>提单号：（场站数据）</p>
-                <p>--------------------------</p>
-                <p>{{ TaskShippingOrderCompareData.mBlNo }}</p>
-              </div>
-            </div>
-            <div
-              class="TaskShippingOrderCompareMainList"
-              v-for="(item, index) in TaskShippingOrderCompareData.showDetailList"
-              :key="index"
-              v-show="item.pCode != 'ContaList'"
-            >
-              <p>{{ item.fieldName }}:</p>
-              <p>{{ item.reqVal }}</p>
-              <p>{{ item.msg }}</p>
-              <p>{{ item.fieldName }}:</p>
-              <p v-html="item.mergeHtml"></p>
-            </div>
-          </div>
-          <div class="TaskShippingOrderCompareMain">
-            <div class="TaskShippingOrderCompareMainHeader Box">
-              <div>
-                <p>箱信息：（本地数据）</p>
-              </div>
-              <div></div>
-              <div>
-                <p>箱信息：（场站数据）</p>
-              </div>
-            </div>
-            <div
-              v-for="(item, index) in TaskShippingOrderCompareData.showDetailList"
-              :key="index"
-              v-show="item.pCode == 'ContaList'"
-              :class="
-                item.fieldName == '箱号' ? 'TaskShippingOrderCompareMainList BoxNo' : 'TaskShippingOrderCompareMainList'
-              "
-            >
-              <p>{{ item.fieldName }}:</p>
-              <p>{{ item.reqVal }}</p>
-              <p>{{ item.msg }}</p>
-              <p>{{ item.fieldName }}:</p>
-              <p v-html="item.mergeHtml"></p>
-            </div>
-          </div>
-        </div>
-      </a-modal>
-      <a-modal :maskClosable="false" :width="1700" :visible="addVisible" @ok="addSubmit" @cancel="addCancel">
-        <a-radio-group class="group-label-box" v-model="carrierRadio">
-          <p v-if="RecentlyCarrierData.length" class="Awrapper">最近使用 <span class="line"></span></p>
-          <div class="group-label" v-if="RecentlyCarrierData.length">
-            <a-radio :style="radioStyle" :value="item.code" v-for="item in RecentlyCarrierData" :key="item.code">
-              <img class="radio-logo" :src="item.ImgSrc" />
-              <!-- {{ item.code }} -->
-              {{ item.cnName }}
-            </a-radio>
-          </div>
-
-          <div v-for="e in Object.keys(RcarrierData)" :key="e">
-            <p class="Awrapper">{{ e }}<span class="line"></span></p>
-            <div class="group-label">
-              <a-radio :style="radioStyle" :value="item.code" v-for="item in RcarrierData[e]" :key="item.code">
-                <img class="radio-logo" :src="item.ImgSrc" />
-                {{ item.cnName }}
-              </a-radio>
-            </div>
-          </div>
-        </a-radio-group>
-      </a-modal>
-
-      <a-modal
-        title="多提单号查询"
-        :maskClosable="false"
-        :width="400"
-        :visible="moreNumVisible"
-        @ok="moreNumSubmit"
-        @cancel="moreNumCancel"
-      >
-        <div>
-          <a-textarea v-model="moreNumVal" style="height: 200px" />
-        </div>
-      </a-modal>
-
-      <setFormModel
-        ref="setForm"
-        :formData="formData"
-        :formAllData="formMoreData"
-        type="from"
-        @ok="submitForm"
-        v-if="formMoreData"
-      ></setFormModel>
-
-      <setFormModel
-        ref="setTableForm"
-        :formData="formTableData"
-        :formAllData="formMoreTableData"
-        :maxNum="30"
-        type="table"
-        @ok="submitTableForm"
-        v-if="formMoreTableData"
-      ></setFormModel>
-
-      <div class="hovers-list" :style="{ top: `${remarkScreenY}px`, left: `${remarkScreenX}px` }" v-if="remarkShow">
-        <div class="title">备注内容：</div>
-        <div class="list" v-for="(remarkItem, rindex) in remarkData" :key="rindex">
-          <i class="iconfont icon-yuandian icon"></i> {{ remarkItem.remark }}
-        </div>
-      </div>
-
-      <!-- v-show="goodStatusShow" -->
-      <div
-        class="goods-hovers-list"
-        :class="{ 'hide-goods-hover': !goodStatusShow }"
-        :style="{ top: `${goodStatusScreenY}px`, left: `${goodStatusScreenX}px` }"
-      >
-        <div class="title">货运动态</div>
-        <template v-for="(goodStatusItem, gindex) in goodStatusData">
-          <template v-if="goodStatusItem.finishTime || goodStatusItem.remark">
-            <a-popover placement="top" :key="gindex">
-              <div slot="content">
-                <div v-if="goodStatusItem.finishTime">时间：{{ goodStatusItem.finishTime }}</div>
-                <div v-if="goodStatusItem.remark">备注：{{ goodStatusItem.remark }}</div>
-                <div v-if="goodStatusItem.extData">显示天数：{{ goodStatusItem.extData }}</div>
-              </div>
-              <div class="goods-btn" :class="{ active: goodStatusItem.finishTime || goodStatusItem.remark }">
-                {{ goodStatusItem.statusName }}
-              </div>
-            </a-popover>
-          </template>
-          <template v-else>
-            <div
-              class="goods-btn"
-              :key="gindex"
-              :class="{ active: goodStatusItem.finishTime || goodStatusItem.remark }"
-            >
-              {{ goodStatusItem.statusName }}
-            </div>
-          </template>
-        </template>
-      </div>
-      <a-modal width="50vw" :maskClosable="false" v-model="traceModalVisible" title="运踪订阅">
-        <div class="trace-box">
-          <a-form>
-            <a-row :gutter="16">
-              <a-col :span="24" class="book-model-box">
-                <a-form-item
-                  label="请选择订阅内容"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 6 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 15 } }"
-                  has-feedback
-                >
-                  <a-checkbox-group
-                    class="trace-check"
-                    v-model="traceValue"
-                    name="checkboxgroup"
-                    :options="traceOptions"
-                    @change="onTraceChange"
-                  />
-                </a-form-item>
-              </a-col>
-            </a-row>
-          </a-form>
-        </div>
-        <template slot="footer">
-          <a-button type="primary" @click="traceSend">订阅</a-button>
-        </template>
-      </a-modal>
-      <a-modal
-        width="820px"
-        :maskClosable="false"
-        v-model="editingModalVisible"
-        title="批量编辑"
-        @ok="editingHandleOk"
-        @cancel="editingHandleCancel"
-      >
-        <div class="trace-box">
-          <a-form :form="editingForm">
-            <a-row :gutter="26">
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="船名"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-select
-                    placeholder="请选择船名"
-                    v-decorator="['vessel', { rules: [{ required: true, message: '请选择船名！' }] }]"
-                    show-search
-                    @focus="vesselSearch"
-                    @search="vesselSearch"
-                    @blur="vesselBlur"
-                    :default-active-first-option="false"
-                    :show-arrow="false"
-                    :filter-option="false"
-                    :not-found-content="null"
-                  >
-                    <a-select-option v-for="item in vesselData" :key="item.name" :value="item.name">
-                      {{ item.name }}
-                    </a-select-option>
-                  </a-select>
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="开船日期"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-date-picker
-                    v-decorator="['etd', { rules: [{ required: true, message: '请选择开船日期！' }] }]"
-                    :style="{ width: '100%' }"
-                    placeholder="请选择开船日期"
-                    valueFormat="YYYY-MM-DD"
-                  />
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="内部航次"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-input v-decorator="['voynoinner']" />
-                </a-form-item>
-              </a-col>
-
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="海关航次"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-input v-decorator="['voyno']" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="卸货港"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-select
-                    placeholder="请选择卸货港"
-                    v-decorator="['portDischarge']"
-                    show-search
-                    @focus="portDischargeSearch"
-                    @search="portDischargeSearch"
-                    @change="portDischargeChange"
-                    :default-active-first-option="false"
-                    :show-arrow="false"
-                    :filter-option="false"
-                    :not-found-content="null"
-                  >
-                    <a-select-option v-for="item in portDischargeData" :key="item.code" :value="item.enName">
-                      {{ item.enName }}
-                    </a-select-option>
-                  </a-select>
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="卸货代码"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-input v-decorator="['portDischargeId']" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="目的港"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-select
-                    placeholder="请选择目的港"
-                    v-decorator="['destination']"
-                    show-search
-                    @focus="destinationSearch"
-                    @search="destinationSearch"
-                    @change="destinationChange"
-                    :default-active-first-option="false"
-                    :show-arrow="false"
-                    :filter-option="false"
-                    :not-found-content="null"
-                  >
-                    <a-select-option v-for="item in destinationData" :key="item.code" :value="item.enName">
-                      {{ item.enName }}
-                    </a-select-option>
-                  </a-select>
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="目的代码"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-input v-decorator="['destinationid']" />
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="截港时间"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-date-picker
-                    show-time
-                    v-decorator="['closingdate']"
-                    :style="{ width: '100%' }"
-                    placeholder="请选择截港时间"
-                    valueFormat="YYYY-MM-DD HH:mm:ss"
-                    format="YYYY-MM-DD HH"
-                  />
-                </a-form-item>
-              </a-col>
-              <a-col :span="12" class="book-model-box">
-                <a-form-item
-                  label="截单时间"
-                  :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
-                  :wrapperCol="{ xs: { span: 24 }, sm: { span: 18 } }"
-                  has-feedback
-                >
-                  <a-date-picker
-                    show-time
-                    v-decorator="['closedocdate']"
-                    :style="{ width: '100%' }"
-                    placeholder="请选择截单时间"
-                    valueFormat="YYYY-MM-DD HH:mm:ss"
-                    format="YYYY-MM-DD HH"
-                  />
-                </a-form-item>
-              </a-col>
-            </a-row>
-          </a-form>
-        </div>
-      </a-modal>
-    </a-spin>
-  </div>
-</template>
-<script>
-import { XCard, setFormModel } from '@/components'
-import columnSetting from '@/components/tableColumnSetting'
-import formLabel from './modules/formLabel'
-import {
-  BookingOrderPage,
-  SendTrace,
-  GetVessellist,
-  GetPortlist,
-  GetPortloadlist,
-  BookingOrderBachUpdate,
-  GetCarrierlist,
-  DjyCustomerSuggest,
-  GetYardlist,
-  GetSysUserPage,
-  DjyCustomerpage,
-  GetCtn,
-  GetPackage,
-  Codeissuetypelist,
-  GetFrt,
-  GetService,
-  GetForwarderlist,
-  DjyUserConfigMulti,
-  DeleteBookingOrder,
-  ExcuteShippingOrderCompareBatch
-} from '@/api/modular/main/BookingLedger'
-
-import initData from './modules/initData'
-import { DjyUserConfigGet, DjyUserConfigAdd } from '@/api/modular/main/DjyUserConfig'
-import { mapGetters, mapActions } from 'vuex'
-const formInitData = [
-  { title: '主提单号', align: 'center', width: '90', label: 'MBLNO', type: 'input' },
-  { title: '分提单号', align: 'center', width: '90', label: 'HBLNO', type: 'input' },
-  { title: '订舱编号', align: 'center', width: '90', label: 'CUSTNO', type: 'input' },
-  { title: '开船日期', align: 'center', width: 160, label: 'ETD', type: 'dateRange', resLabel: ['BETD', 'EETD'] },
-  { title: '实际开船日期', align: 'center', width: 160, label: 'ATD', type: 'dateRange', resLabel: ['BATD', 'EATD'] },
-  { title: '船名', align: 'center', width: '90', label: 'VESSEL', type: 'input' }
-]
-export default {
-  name: 'BookingLedger',
-  inject: ['reload'],
-  components: {
-    XCard,
-    columnSetting,
-    setFormModel,
-    formLabel
-  },
-  data() {
-    return {
-      spinning: false,
-      TaskShippingOrderCompareVisible: false,
-      TaskShippingOrderCompareData: {
-        showDetailList: ''
-      },
-      ResetType: true,
-      tstyle: { 'padding-bottom': '0px', 'margin-bottom': '10px' },
-      advanced: false,
-      formData: formInitData,
-      formRes: {},
-      searchData: {},
-      formAllData: null,
-      formMoreData: null,
-      formBtnCol: 8,
-      formBtnLoading: false,
-      setVisible: false,
-      showColumns: null,
-      gridOptions: {
-        border: false,
-        resizable: true,
-        showOverflow: true,
-        loading: true,
-        stripe: true,
-        round: true,
-        autoResize: true,
-        align: 'left',
-        scrollY: { enabled: true },
-        columnConfig: { resizable: true },
-        importConfig: {},
-        exportConfig: {},
-        pagerConfig: {
-          total: 0,
-          currentPage: 1,
-          pageSize: 20,
-          pageSizes: [10, 20, 50, 100, 200, 500]
-        },
-        columns: JSON.parse(JSON.stringify(initData.columns)),
-        data: []
-        // treeConfig: {
-        //   transform: true,
-        //   rowField: 'index',
-        //   parentField: 'parentId',
-        // },
-      },
-      formTableData: JSON.parse(JSON.stringify(initData.columns)),
-      fromTableAllData: null,
-      formMoreTableData: null,
-      addVisible: false,
-      carrierRadio: 'CMA',
-      radioStyle: {
-        display: 'block',
-        height: '50px',
-        lineHeight: '50px'
-      },
-      moreNumVisible: false,
-      moreNumVal: '',
-      tableOrderLabel: '',
-      tableOrderType: '',
-      screenWidth: document.body.clientWidth,
-      remarkShow: false,
-      remarkScreenX: 0,
-      remarkScreenY: 0,
-      remarkData: null,
-      traceModalVisible: false,
-      editingModalVisible: false,
-      traceOptions: [
-        { label: '起运港', value: '1' },
-        { label: '目的港', value: '2' }
-      ],
-      traceValue: [],
-      addNum: 0,
-      tableHeight: 0,
-      goodStatusShow: false,
-      goodStatusScreenX: 0,
-      goodStatusScreenY: 0,
-      goodStatusData: null,
-      editingForm: this.$form.createForm(this),
-      vesselData: [],
-      WebVessel: '',
-      portDischargeData: [],
-      destinationData: [],
-      RcarrierData: [],
-      RecentlyCarrierData: []
-    }
-  },
-  computed: {
-    ...mapGetters(['bookingList', 'bookingGridOptions'])
-  },
-  beforeRouteLeave(to, from, next) {
-    // const copyArr = JSON.parse(JSON.stringify(this.gridOptions.data))
-    // const first = copyArr.splice(0, 20)
-    this.setBookingGridOptions(this.gridOptions)
-    // this.gridOptions = {
-    //   border: false,
-    //   resizable: true,
-    //   showOverflow: true,
-    //   loading: false,
-    //   stripe: true,
-    //   round: true,
-    //   autoResize: true,
-    //   align: 'left',
-    //   columnConfig: { resizable: true },
-    //   importConfig: {},
-    //   exportConfig: {},
-    //   pagerConfig: {
-    //     total: 0,
-    //     currentPage: 1,
-    //     pageSize: 10,
-    //     pageSizes: [10, 20, 50, 100, 200, 500]
-    //   },
-    //   columns: this.gridOptions.columns,
-    //   data: first
-    // }
-    next()
-  },
-  beforeRouteEnter(to, from, next) {
-    next(vm => {
-      vm.upDate()
-    })
-  },
-  created() {
-    this.createdInit()
-  },
-  mounted() {
-    this.onresize()
-  },
-  methods: {
-    ...mapActions(['setBookingList', 'setBookingGridOptions']),
-    createdInit() {
-      this.showColumns = JSON.parse(JSON.stringify(initData.columns))
-      this.formAllData = JSON.parse(JSON.stringify(initData.condAllData))
-      this.fromTableAllData = JSON.parse(JSON.stringify(initData.columnsAllData))
-      this.tableHeight = document.body.clientHeight - 230
-      this.getList({}, true)
-      this.getConfigUser(true)
-      this.getCarrier()
-    },
-    onresize() {
-      window.onresize = () => {
-        this.screenWidth = document.body.clientWidth
-      }
-    },
-    upDate() {
-      if (Object.keys(this.gridOptions).length > 0) {
-        if (Object.keys(this.bookingGridOptions).length === 0) {
-          return false
-        }
-        const newData = JSON.parse(JSON.stringify(this.bookingGridOptions))
-        if (newData && newData.data.length > this.gridOptions.data.length) {
-          console.log('这里插入最新舱单', newData.data.length, this.gridOptions.data.length)
-        }
-      }
-    },
-    upDate1() {
-      if (Object.keys(this.gridOptions).length > 0) {
-        if (Object.keys(this.bookingGridOptions).length === 0) {
-          return false
-        }
-        const newData = JSON.parse(JSON.stringify(this.bookingGridOptions))
-        if (this.bookingGridOptions.data && this.bookingGridOptions.data.length > 0) {
-          setTimeout(() => {
-            const copyArr = JSON.parse(JSON.stringify(this.bookingGridOptions.data))
-            const first = copyArr.splice(0, 20)
-            const more = this.bookingGridOptions.data.splice(20, this.bookingGridOptions.data.length)
-            newData.data = first
-            this.gridOptions = { ...this.gridOptions, ...newData }
-            setTimeout(() => {
-              this.gridOptions.data = [...this.gridOptions.data, ...more]
-              console.log(this.gridOptions.data.length)
-            }, 600)
-          }, 10)
-        }
-        // if (this.bookingGridOptions.data && this.bookingGridOptions.data.length > 0) {
-        //   console.log(this.gridOptions.loading)
-        //   const copyArr = JSON.parse(JSON.stringify(this.bookingGridOptions.data))
-        //   console.log('== 获取到了历史数据 ==', copyArr)
-        //   newData.data = copyArr
-        //   setTimeout(() => {
-        //     this.gridOptions = { ...this.gridOptions, ...newData }
-        //   }, 200)
-        // }
-      }
-    },
-    // 批量编辑
-    editingHandleOk() {
-      const {
-        editingForm: { validateFields }
-      } = this
-      validateFields((errors, values) => {
-        if (!errors) {
-          values.id = []
-          const select = this.$refs.xGrid.getCheckboxRecords()
-          select.forEach(item => {
-            values.id.push(item.id)
-          })
-          BookingOrderBachUpdate(values).then(res => {
-            if (res.success) {
-              this.$message.success('编辑成功')
-              this.editingHandleCancel()
-            } else {
-              this.$message.error(`编辑失败,${res.message}`)
-            }
-          })
-        } else {
-          // this.editingModalVisible = false
-        }
-      })
-    },
-    editingHandleCancel() {
-      this.editingForm.resetFields()
-      this.editingModalVisible = false
-    },
-    TaskShippingOrderCompareHandleCancel() {
-      this.TaskShippingOrderCompareVisible = false
-    },
-    TaskShippingOrderCompareHandleOk() {},
-    vesselSearch(data) {
-      if (data) {
-        this.WebVessel = data
-      } else if (data === undefined) {
-        this.WebVessel = data
-      }
-
-      GetVessellist({ KeyWord: data }).then(res => {
-        this.vesselData = res.data
-      })
-    },
-    vesselBlur() {
-      if (this.WebVessel !== undefined) {
-        setTimeout(() => {
-          this.editingForm.setFieldsValue({
-            ...this.editingForm.getFieldsValue(),
-            vessel: this.WebVessel
-          })
-        }, 100)
-      }
-    },
-    portDischargeSearch(data) {
-      GetPortlist({ KeyWord: data }).then(res => {
-        this.portDischargeData = res.data
-      })
-    },
-    portDischargeChange(value) {
-      this.portDischargeData.forEach(item => {
-        if (item.enName == value) {
-          setTimeout(() => {
-            this.editingForm.setFieldsValue({
-              ...this.editingForm.getFieldsValue(),
-              portDischargeId: item.ediCode
-            })
-          }, 100)
-        }
-      })
-    },
-    destinationSearch(data) {
-      GetPortlist({ KeyWord: data }).then(res => {
-        this.destinationData = res.data
-      })
-    },
-    destinationChange(value) {
-      this.destinationData.forEach(item => {
-        if (item.enName == value) {
-          setTimeout(() => {
-            this.editingForm.setFieldsValue({
-              ...this.editingForm.getFieldsValue(),
-              destinationid: item.ediCode
-            })
-          }, 100)
-        }
-      })
-    },
-    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 = {}) {
-      this.gridOptions.pagerConfig = {
-        total: 0,
-        currentPage: 1,
-        pageSize: this.gridOptions.pagerConfig.pageSize,
-        pageSizes: [10, 20, 50, 100, 200, 500]
-      }
-      // this.tableOrderLabel = ''
-      // this.tableOrderType = ''
-      // this.$refs.xGrid.clearSort()
-      // debugger
-      this.gridOptions.data = []
-      this.getList(queryParam)
-    },
-    getConfigUser(isInit = false) {
-      const query = {
-        typeArr: ['booking_list_cond', 'booking_list_column', 'booking_list_page']
-      }
-      DjyUserConfigMulti(this.$qs.stringify(query, { arrayFormat: 'repeat' })).then(res => {
-        const $data = {}
-        res.data.map((item, index) => {
-          switch (item.type) {
-            case 'booking_list_cond':
-              this.$set($data, 'booking_list_cond', item)
-              // this.setFormData(item, false, true)
-              break
-            case 'booking_list_column':
-              this.$set($data, 'booking_list_column', item)
-              // this.setTableList(item)
-              break
-            case 'booking_list_page':
-              this.setPageSize(item)
-              break
-          }
-        })
-        if (Object.keys($data).includes('booking_list_cond')) {
-          this.setFormData($data.booking_list_cond, false, true)
-        } else {
-          this.setFormData({}, false, true)
-        }
-        if (Object.keys($data).includes('booking_list_column')) {
-          this.setTableList($data.booking_list_column)
-        } else {
-          this.setTableList({})
-        }
-      })
-    },
-    // 船公司 - start
-    getCarrier() {
-      const Rdata = data => {
-        let RData = {}
-        for (var i = 0; i < 26; i++) {
-          RData[String.fromCharCode(65 + i)] = []
-          data.forEach(item => {
-            if (String.fromCharCode(65 + i) == item.enName[0].toUpperCase()) {
-              RData[String.fromCharCode(65 + i)].push(item)
-            }
-          })
-        }
-        let Obj = {
-          'A-D': ['A', 'B', 'C', 'D'],
-          'E-L': ['E', 'F', 'G', 'H', 'I', 'J', 'K', 'L'],
-          'M-R': ['M', 'N', 'O', 'P', 'Q', 'R'],
-          'S-U': ['S', 'T', 'U'],
-          'V-Z': ['V', 'W', 'X', 'Y', 'Z']
-        }
-        let Data = {
-          'A-D': [],
-          'E-L': [],
-          'M-R': [],
-          'S-U': [],
-          'V-Z': []
-        }
-        Object.keys(Obj).forEach(e => {
-          Obj[e].forEach(item => {
-            RData[item].forEach((Ai, AiIndex) => {
-              let imgSrc = ''
-              try {
-                imgSrc = require(`@/assets/logo/${Ai.code}.png`)
-              } catch (error) {
-                imgSrc = require('@/assets/logo/default.png')
-              }
-              RData[item][AiIndex].ImgSrc = imgSrc
-            })
-            Data[e].push(...RData[item])
-          })
-        })
-        this.RcarrierData = Data
-      }
-      GetCarrierlist()
-        .then(res => {
-          if (res.code === 200) {
-            Rdata(res.data)
-            DjyUserConfigGet({ type: 'booking_memory' })
-              .then(e => {
-                if (e.data) {
-                  let data = []
-                  JSON.parse(e.data.configJson).forEach(item => {
-                    res.data.forEach(item2 => {
-                      if (item == item2.code) {
-                        data.push(item2)
-                      }
-                    })
-                  })
-                  this.RecentlyCarrierData = data
-                }
-              })
-              .catch(() => {
-                Rdata(res.data)
-              })
-          }
-        })
-        .catch(err => {
-          console.log(err)
-        })
-    },
-    setFormData(data, isReset = false, isInit = false) {
-      if (Object.keys(data).length > 0 && JSON.parse(data.configJson).length) {
-        const arr = JSON.parse(data.configJson)
-        const nowData = []
-        const moreData = []
-        arr.map((item, index) => {
-          this.formAllData.map((fitem, findex) => {
-            if (fitem.label === item) {
-              nowData.push(fitem)
-            }
-          })
-        })
-        this.formAllData.map((item, index) => {
-          if (!arr.includes(item.label)) {
-            moreData.push(item)
-          }
-        })
-        this.formData = nowData
-        this.formMoreData = moreData
-      } else {
-        const nowData = this.formData.map((item, index) => {
-          return item.label
-        })
-        const moreData = []
-        this.formAllData.map((item, index) => {
-          if (!nowData.includes(item.label)) {
-            moreData.push(item)
-          }
-        })
-        this.formMoreData = moreData
-      }
-      this.formData.map((item, index) => {
-        this.$set(this.formRes, item.label, this.formRes[item.label] || '')
-        // select 船公司 等获取下拉列表
-        if (item.type === 'select') {
-          if (['NOBILL', 'CARGOID'].includes(item.label)) {
-            item.dataList = item.data
-            setTimeout(() => {
-              this.$refs[`fromlabel-${item.label}`][0].$data.dataList = item.data
-            }, 300)
-          }
-        }
-      })
-      if (!isReset && !isInit) {
-        this.getList(this.formRes)
-      }
-      const len = this.formData.length % 4
-      if (this.formData.length === 4 || this.formData.length > 4) {
-        this.formBtnCol = 8
-      } else {
-        this.formBtnCol = 24 - len * 4
-      }
-      this.$forceUpdate()
-    },
-    setTableList(data) {
-      if (Object.keys(data).length > 0 && JSON.parse(data.configJson).length) {
-        this.formTableData = JSON.parse(data.configJson)
-        const nowTableArr = this.formTableData.map((item, index) => {
-          if (item.field === 'operate') {
-            item.width = 110
-          }
-          return item.field
-        })
-        this.gridOptions.columns = JSON.parse(JSON.stringify(this.formTableData))
-        const moreTableArr = []
-        this.fromTableAllData.map((item, index) => {
-          if (!nowTableArr.includes(item.field)) {
-            moreTableArr.push(item)
-          }
-        })
-        this.formMoreTableData = moreTableArr
-        this.$forceUpdate()
-      } else {
-        const nowTableArr = this.formTableData.map((item, index) => {
-          return item.field
-        })
-        const moreTableArr = []
-        this.fromTableAllData.map((item, index) => {
-          if (!nowTableArr.includes(item.field)) {
-            moreTableArr.push(item)
-          }
-        })
-        this.formMoreTableData = moreTableArr
-        this.$forceUpdate()
-      }
-    },
-    setPageSize(data) {
-      if (data && JSON.parse(data.configJson)) {
-        this.gridOptions.pagerConfig.pageSize = JSON.parse(data.configJson).pageSize
-        this.getList({}, true, 'add')
-        this.$forceUpdate()
-      }
-    },
-
-    getFormData(isReset = false) {
-      DjyUserConfigGet({ type: 'booking_list_cond' }).then(res => {
-        this.setFormData(res.data)
-      })
-    },
-    emnuSelectApi(type) {
-      switch (type) {
-        case 'CARRIER':
-          return GetCarrierlist
-        case 'YARDID':
-          return GetYardlist
-        case 'CNTRTOTAL':
-          return GetCtn
-        case 'KINDPKGS':
-          return GetPackage
-        case 'ISSUETYPE':
-          return Codeissuetypelist
-      }
-    },
-    getFromSelectData(func, ...args) {
-      return new Promise((resolve, reject) => {
-        func(...args).then(res => {
-          if (res.code === 200) {
-            resolve(res.data)
-          } else {
-            reject(res)
-          }
-        })
-      })
-    },
-    handlePageChange({ currentPage, pageSize }) {
-      if (this.gridOptions.pagerConfig.pageSize !== pageSize) {
-        this.editPageSizeSave(pageSize)
-      }
-      this.gridOptions.pagerConfig.currentPage = currentPage
-      this.gridOptions.pagerConfig.pageSize = pageSize
-      this.getList(this.searchData)
-    },
-
-    editPageSizeSave(pageSize = 10) {
-      const data = {
-        pageSize: pageSize
-      }
-      DjyUserConfigAdd({
-        type: 'booking_list_page',
-        configJson: JSON.stringify(data)
-      }).then(res => {
-        console.log('页码设置成功')
-      })
-    },
-
-    toggleAdvanced() {
-      this.advanced = !this.advanced
-      let start = new Date().getTime()
-      console.log('== 点击展开 ==')
-      if (!this.advanced) {
-        const len = this.formData.length % 4
-        if (this.formData.length === 4 || this.formData.length > 4) {
-          this.formBtnCol = 8
-        } else {
-          this.formBtnCol = 24 - len * 4
-        }
-      } else {
-        const len = this.formData.length % 6
-        // this.formBtnCol = 24 - len * 4
-        this.formBtnCol = 24 - len * 4 === 4 ? 24 : 24 - len * 4
-      }
-      console.log('== 展开结束 ==', new Date().getTime() - start)
-    },
-    tableRefresh() {
-      const data = { ...this.formRes }
-      this.searchData = JSON.parse(JSON.stringify(data))
-      this.init(this.searchData)
-      this.formRes = data
-    },
-    tableMoreRefresh() {
-      const arr = this.formRes.MBLNO.split(/，|,/)
-      let val = ``
-      arr.map((item, index) => {
-        val += `${item}
-` // 这里不要格式化
-      })
-      this.moreNumVal = val
-      this.moreNumVisible = !this.moreNumVisible
-    },
-
-    dateFtt(fmt, date) {
-      const o = {
-        'Y+': date.getFullYear(),
-        'M+': date.getMonth() + 1,
-        'D+': date.getDate(),
-        'h+': date.getHours(),
-        'm+': date.getMinutes(),
-        's+': date.getSeconds()
-      }
-      for (const k in o) {
-        if (new RegExp(`(${k})`).test(fmt)) {
-          const str = o[k] + ''
-          fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : this.padZero(str))
-        }
-      }
-      return fmt
-    },
-
-    padZero(num) {
-      return new RegExp(/^\d$/g).test(num) ? `0${num}` : num
-    },
-
-    tableReset() {
-      this.ResetType = false
-      Object.keys(this.formRes).map((item, index) => {
-        this.formRes[item] = ''
-      })
-      this.searchData = JSON.parse(JSON.stringify(this.formRes))
-      Object.keys(this.$refs).map((label, index) => {
-        if (label.includes('fromlabel-') && this.$refs[label].length > 0) {
-          this.$refs[label][0].$data.value = ''
-        }
-      })
-      this.tableOrderLabel = ''
-      this.tableOrderType = ''
-      this.$refs.xGrid.clearSort()
-      setTimeout(() => {
-        this.ResetType = true
-      }, 100)
-    },
-
-    submitForm(data) {
-      this.formData = data
-      const arr = data.map((item, index) => {
-        return item.label
-      })
-
-      this.formRes = {}
-      this.searchData = {}
-      DjyUserConfigAdd({
-        type: 'booking_list_cond',
-        configJson: JSON.stringify(arr)
-      }).then(res => {
-        this.$message.success('保存成功')
-        this.$refs.setForm.handleCancel()
-        Object.keys(this.$refs).map((label, index) => {
-          if (label.includes('fromlabel-') && this.$refs[label].length > 0) {
-            this.$refs[label][0].$data.value = ''
-          }
-        })
-        this.getFormData()
-        this.init()
-      })
-    },
-
-    formChange(data) {
-      const { form, value } = data
-      if (form.type === 'input') {
-        this.formRes[form.label] = value
-      } else if (form.type === 'date') {
-        this.formRes[form.label] = value
-      } else if (form.type === 'dateRange') {
-        this.formRes[form.resLabel[0]] = value[0] || ''
-        this.formRes[form.resLabel[1]] = value[1] || ''
-      } else if (form.type === 'select') {
-        this.formRes[form.label] = value
-      } else if (form.type === 'complete') {
-        this.formRes[form.label] = value
-      }
-      this.$forceUpdate()
-    },
-
-    // table
-
-    /// 表格编辑
-    tableHeaderEdit() {
-      this.$refs.setTableForm.open()
-    },
-    submitTableForm(data) {
-      this.gridOptions.columns = JSON.parse(JSON.stringify(data))
-      this.$refs.setTableForm.handleCancel()
-      this.editColumnsSave(this.gridOptions.columns)
-    },
-
-    resizableChange(e) {
-      this.gridOptions.columns[e.columnIndex].width = e.resizeWidth
-      this.editColumnsSave(this.gridOptions.columns)
-    },
-    editColumnsSave(data = {}) {
-      DjyUserConfigAdd({
-        type: 'booking_list_column',
-        configJson: JSON.stringify(data)
-      }).then(res => {
-        this.$refs.setForm.handleCancel()
-      })
-    },
-
-    columnChange(data) {
-      const arr = []
-      data.map((item, index) => {
-        if (item.checked) {
-          arr.push(item)
-        }
-      })
-      this.showColumns = []
-      this.showColumns = arr
-      this.gridOptions.columns = arr
-      this.$forceUpdate()
-    },
-    handledbclick({ row }) {
-      this.editColumns(row)
-    },
-    editColumns(row) {
-      this.$router.push({ name: 'BookingDetail', query: { id: row.id, type: row.carrierid, mblno: row.mblno } })
-    },
-    getList(queryParam = {}, isInit = false, isAdd = 'normal') {
-      this.$set(this.gridOptions, 'loading', true)
-      const { currentPage, pageSize } = this.gridOptions.pagerConfig
-      const query = {
-        ...queryParam,
-        ...{
-          PageNo: currentPage,
-          PageSize: pageSize
-        },
-        ...{
-          SortField: this.tableOrderLabel
-        }
-      }
-      Object.keys(query).map((item, index) => {
-        if (!query[item]) {
-          delete query[item]
-        }
-      })
-      if (this.tableOrderType !== '') {
-        query.DescSort = this.tableOrderType === 'desc'
-      }
-      if (query.MBLNO && query.MBLNO.split(/，|,/).length > 0) {
-        const arr = this.searchData.MBLNO.split(/，|,/)
-        query.MBLNO = arr.toString()
-      }
-      if (isInit) {
-        query.firstFlag = true
-      }
-      BookingOrderPage(query)
-        .then(res => {
-          if (res.success) {
-            let newBookingList = {}
-            if (query.PageNo !== 1) {
-              newBookingList = this.bookingList
-            }
-            const _data = res.data.items.map((item, index) => {
-              this.$set(newBookingList, item.id, item)
-              item.index = (currentPage - 1) * pageSize + index
-              const bookstatus = [
-                { staCode: 'sta_cangdan', isChecked: false },
-                { staCode: 'sta_haifang', isChecked: false },
-                { staCode: 'sta_zhuangzai', isChecked: false },
-                { staCode: 'sta_mafang', isChecked: false },
-                { staCode: 'sta_zhuangchuan', isChecked: false },
-                { staCode: 'sta_atd', isChecked: false }
-              ]
-              if (item.bookstatus.length > 0) {
-                bookstatus.map((book, bindex) => {
-                  item.bookstatus.map((item, index) => {
-                    if (item.staCode === book.staCode) {
-                      bookstatus[bindex] = item
-                      bookstatus[bindex].isChecked = true
-                    }
-                  })
-                })
-              }
-              item.bookstatus = bookstatus
-              let hasGoods = 0
-              item.goodsStatusList.map((gitem, gindex) => {
-                if (gitem.finishTime || gitem.remark) {
-                  hasGoods++
-                }
-              })
-              item.hasGoods = hasGoods
-              return item
-            })
-            this.$set(this.gridOptions.pagerConfig, 'columns', JSON.parse(JSON.stringify(initData.columns)))
-            // debugger
-            // this.$set(this.gridOptions, 'data', [..._data])
-            this.$refs.xGrid.reloadData(_data).then(() => {
-              this.$set(this.gridOptions, 'loading', false)
-            })
-            this.$set(this.gridOptions.pagerConfig, 'total', res.data.totalCount)
-            this.setBookingList(newBookingList)
-            this.$forceUpdate()
-          } else {
-            this.$set(this.gridOptions, 'data', [...[]])
-            this.$set(this.gridOptions, 'loading', false)
-            this.$forceUpdate()
-          }
-          this.ResetType = true
-        })
-        .catch(err => {
-          console.log(err)
-        })
-    },
-
-    addBooking() {
-      this.addVisible = !this.addVisible
-    },
-    copyBooking() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      const pkIdArr = select.map((item, index) => {
-        return item.id
-      })
-      if (pkIdArr.length > 1) {
-        this.$message.error('请选择一条数据')
-        return false
-      } else if (pkIdArr.length === 0) {
-        this.$message.error('请至少选择一条数据')
-        return false
-      }
-      this.$router.push({ name: 'BookingDetail', query: { id: pkIdArr[0], isCopy: true } })
-    },
-    copyBookingMore() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      const pkIdArr = select.map((item, index) => {
-        return item.id
-      })
-      if (pkIdArr.length === 0) {
-        this.$message.error('请至少选择一条数据')
-        return false
-      }
-    },
-    addSubmit() {
-      let data = []
-      data.push(this.carrierRadio)
-      if (this.RecentlyCarrierData.length) {
-        this.RecentlyCarrierData.forEach(item => {
-          if (item.code != this.carrierRadio && data.length < 10) {
-            data.push(item.code)
-          }
-        })
-      }
-
-      DjyUserConfigAdd({
-        type: 'booking_memory',
-        configJson: JSON.stringify(data)
-      }).then(res => {
-        this.getCarrier()
-        this.addVisible = false
-        this.addNum = Math.round(Math.random() * 1000)
-        this.$router.push({ name: 'BookingDetail', query: { type: this.carrierRadio, addNum: this.addNum } })
-      })
-    },
-    addCancel() {
-      this.addVisible = false
-    },
-
-    // 表单编辑
-    formSetting() {
-      this.$refs.setForm.open()
-    },
-
-    // 多表单
-    moreNumSubmit() {
-      let data = ''
-      this.moreNumVal
-        .replace(/\n|\r/g, ',')
-        .split(',')
-        .forEach(item => {
-          if (item.replace(/\s*/g, '')) {
-            if (data) {
-              data = `${data},${item}`
-            } else {
-              data = item
-            }
-          }
-        })
-
-      this.formRes.MBLNO = data
-      this.$refs['fromlabel-MBLNO'][0].$data.value = this.formRes.MBLNO
-      this.$forceUpdate()
-      this.moreNumCancel()
-    },
-    moreNumCancel() {
-      this.moreNumVisible = false
-    },
-    tableSortChange(e) {
-      const { property, order } = e
-      this.tableOrderLabel = property || ''
-      this.tableOrderType = order || ''
-      console.log('== 当前搜索内容 ==', this.searchData)
-      this.getList(this.searchData)
-    },
-    enmuBookingBtn(val) {
-      switch (val) {
-        case 'sta_cangdan':
-          return '舱单'
-        case 'sta_haifang':
-          return '海放'
-        case 'sta_zhuangzai':
-          return '装载'
-        case 'sta_mafang':
-          return '码放'
-        case 'sta_zhuangchuan':
-          return '装船'
-        case 'sta_atd':
-          return '离港'
-        case 'sta_so':
-          return '已订舱'
-        case 'sta_bc':
-          return '订舱确认'
-        case 'sta_letter_yard':
-          return '放舱'
-        case 'sta_xhz':
-          return '下货纸'
-        default:
-          return '--'
-      }
-    },
-    pressEnterFun() {
-      this.tableRefresh()
-    },
-    remarkhover(e, data) {
-      if (data.bookremark.length > 0) {
-        const maxWidth = window.innerWidth
-        if (maxWidth - e.pageX > 230) {
-          this.remarkScreenX = e.pageX + 20
-        } else {
-          this.remarkScreenX = e.pageX - 300
-        }
-        this.remarkScreenY = e.pageY + 20
-        this.remarkData = data.bookremark
-        this.remarkShow = true
-      }
-    },
-    remarkLeave(e, data) {
-      this.remarkShow = false
-      this.remarkData = null
-    },
-    goodStatusclick(e, data) {
-      console.log('是否已展示', this.goodStatusShow)
-      if (!this.goodStatusShow) {
-        this.goodStatusHover(e, data)
-      } else {
-        this.goodStatusLeave(e, data)
-      }
-    },
-    goodStatusHover(e, data) {
-      const maxWidth = window.innerWidth
-      if (maxWidth - e.pageX > 230) {
-        // this.goodStatusScreenX = e.pageX + 20
-        this.goodStatusScreenX = e.pageX - 139
-      } else {
-        // this.goodStatusScreenX = e.pageX - 300
-        this.goodStatusScreenX = e.pageX - 139
-      }
-      // this.goodStatusScreenY = e.pageY + 20
-      this.goodStatusScreenY = e.pageY + 25
-      this.goodStatusData = data.goodsStatusList
-      this.goodStatusShow = true
-    },
-    goodStatusLeave(e, data) {
-      this.goodStatusShow = false
-      this.goodStatusData = null
-    },
-    openTraceModel() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      if (select.length === 0) {
-        this.$message.error('请选择操作订单')
-        return false
-      }
-      this.traceModalVisible = !this.traceModalVisible
-    },
-    batchEditing() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      if (select.length === 0) {
-        this.$message.error('请选择操作订单')
-        return false
-      }
-      this.editingModalVisible = !this.editingModalVisible
-    },
-    onTraceChange(values) {
-      console.log(this.traceValue)
-    },
-    traceSend() {
-      if (!this.traceValue) {
-        this.$message.error('请选择订阅内容')
-        return false
-      }
-      const arr = []
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      if (select.length === 0) {
-        this.$message.error('请选择操作订单')
-        return false
-      }
-      let errorTip = ''
-      select.map((item, index) => {
-        if (this.traceValue.includes('1') && (!item.yard || !item.yardid)) {
-          errorTip = `单号${item.mblno}未选择场站`
-        }
-        if (this.traceValue.includes('2') && (!item.carrierid || !item.carrier)) {
-          errorTip = `单号${item.mblno}未选择船公司`
-        }
-        const query = {
-          businessId: item.id,
-          mblno: item.mblno,
-          yard: this.traceValue.includes('1') ? item.yard : '',
-          yardCode: this.traceValue.includes('1') ? item.yardid : '',
-          carrierid: this.traceValue.includes('2') ? item.carrierid : '',
-          carrier: this.traceValue.includes('2') ? item.carrier : '',
-          isBook: !!this.traceValue.includes('2')
-        }
-        arr.push(query)
-      })
-
-      if (errorTip !== '') {
-        this.$message.error(errorTip)
-        return false
-      }
-
-      SendTrace(arr)
-        .then(res => {
-          if (res.success) {
-            const tip = `订阅成功`
-            this.$message.success(tip)
-            this.traceModalVisible = false
-            this.traceValue = []
-          } else {
-            this.$message.error(res.message)
-            this.traceModalVisible = false
-            this.traceValue = []
-          }
-        })
-        .catch(err => {
-          console.log(err)
-        })
-    },
-    getCompleteListFun({ form, value }) {
-      let query = {}
-      if (
-        [
-          'VESSEL',
-          'PORTDISCHARGE',
-          'PORTLOAD',
-          'PLACERECEIPT',
-          'DESTINATION',
-          'PLACEDELIVERY',
-          'PAYABLEAT',
-          'BLFRT',
-          'ISSUEPLACE',
-          'PREPARDAT',
-          'SERVICE',
-          'SHIPAGENCY'
-        ].includes(form.label)
-      ) {
-        // 船公司  卸货港
-        query = {
-          KeyWord: value
-        }
-      } else if (form.label === 'CUSTOMERNAME') {
-        // 客户/ 委托单位
-        query = {
-          KeyWord: value,
-          type: 'consignor'
-        }
-      } else if (form.label === 'FORWARDER') {
-        // 订舱代理
-        query = {
-          KeyWord: value,
-          type: 'booking_agent'
-        }
-      } else if (['SALE', 'CUSTSERVICE', 'DOC', 'ROUTE', 'OP'].includes(form.label)) {
-        // 销售 、 揽货人, 航线操作
-        query = {
-          name: value
-        }
-      } else if (form.label === 'CUSTOMSER') {
-        // 报关行
-        query = {
-          SearchValue: value,
-          PropString: 'customs_broker'
-        }
-      } else if (form.label === 'AGENTID') {
-        query = {
-          SearchValue: value,
-          PropString: 'out_agent'
-        }
-      } else if (form.label === 'TRUCKER') {
-        query = {
-          SearchValue: value,
-          PropString: 'fleet'
-        }
-      }
-      const fun = this.emnuCompleteApi(form.label)
-      if (fun) {
-        this.getFromSelectData(this.emnuCompleteApi(form.label), query).then(data => {
-          if (['CUSTOMERNAME', 'FORWARDER', 'CUSTOMSER', 'AGENTID', 'TRUCKER'].includes(form.label)) {
-            this.$refs[`fromlabel-${form.label}`][0].$data.dataSourceList = data.rows
-          } else {
-            this.$refs[`fromlabel-${form.label}`][0].$data.dataSourceList = data
-          }
-        })
-      }
-    },
-
-    emnuCompleteApi(type) {
-      switch (type) {
-        case 'VESSEL':
-          return GetVessellist
-        case 'CUSTOMERNAME':
-          return DjyCustomerSuggest
-        case 'FORWARDER':
-          return DjyCustomerSuggest
-        case 'PORTDISCHARGE': // 卸货港
-          return GetPortlist
-        case 'PORTLOAD': // 装货港
-          return GetPortloadlist
-        case 'PLACERECEIPT': // 收货地
-          return GetPortloadlist
-        case 'DESTINATION': // 目的地
-          return GetPortlist
-        case 'PLACEDELIVERY': // 交货地
-          return GetPortlist
-        case 'SALE':
-          return GetSysUserPage
-        case 'CUSTSERVICE':
-          return GetSysUserPage
-        case 'ROUTE':
-          return GetSysUserPage
-        case 'OP':
-          return GetSysUserPage
-        case 'DOC':
-          return GetSysUserPage
-        case 'CUSTOMSER':
-          return DjyCustomerpage
-        case 'PAYABLEAT':
-          return GetPortlist
-        case 'BLFRT':
-          return GetFrt
-        case 'ISSUEPLACE':
-          return GetPortloadlist
-        case 'PREPARDAT':
-          return GetPortloadlist
-        case 'SERVICE':
-          return GetService
-        case 'AGENTID':
-          return DjyCustomerpage
-        case 'TRUCKER':
-          return DjyCustomerpage
-        case 'SHIPAGENCY':
-          return GetForwarderlist
-      }
-    },
-
-    getSelectFirst({ form, index, value }) {
-      const fun = this.emnuSelectApi(form.label)
-      if (fun) {
-        this.getFromSelectData(fun).then(data => {
-          this.formData[index].dataList = data
-          this.$refs[`fromlabel-${form.label}`][0].$data.dataList = data
-        })
-      }
-    },
-
-    removeMoreFun() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      if (select.length === 0) {
-        this.$message.error('请选择操作订单')
-        return false
-      }
-      const removeArr = select.map((item, index) => {
-        return item.id
-      })
-      this.deleteBookingOrder(removeArr)
-    },
-    removeFun(data) {
-      this.deleteBookingOrder([data.id])
-    },
-    deleteBookingOrder(arr) {
-      DeleteBookingOrder(arr.toString())
-        .then(res => {
-          if (res.success) {
-            this.$message.success('删除成功')
-            this.gridOptions.data = this.gridOptions.data.filter(item => !arr.includes(item.id))
-            this.gridOptions.pagerConfig.total = this.gridOptions.pagerConfig.total - arr.length
-            this.$forceUpdate()
-          } else {
-            this.$message.error(res.message)
-          }
-        })
-        .catch(err => {
-          console.log(err)
-        })
-    },
-    cancelRemove() {
-      console.log('== 取消 ==')
-    },
-    pageClick() {
-      this.goodStatusShow = false
-      this.goodStatusData = null
-    },
-    checkboxChangeEvent() {
-      console.log('== 选中，取消选中 ==', this.$refs.xGrid.getCheckboxRecords())
-    },
-    excuteShippingOrderCompareBatch() {
-      const select = this.$refs.xGrid.getCheckboxRecords()
-      const arr = select.map((item, index) => {
-        return item.id.toString()
-      })
-      if (arr.length === 0) {
-        this.$message.error('请选择操作订单')
-        return false
-      }
-      this.spinning = true
-      ExcuteShippingOrderCompareBatch(arr)
-        .then(res => {
-          if (res.success) {
-            this.spinning = false
-            if (!res.data.succ) {
-              this.$message.success(res.data.msg)
-            } else {
-              this.TaskShippingOrderCompareData = res.data.extra
-              this.TaskShippingOrderCompareVisible = true
-            }
-          } else {
-            this.spinning = false
-            this.$message.error(res.data.msg)
-          }
-        })
-        .catch(err => {
-          console.log(err)
-          this.spinning = false
-        })
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-/*.ant-layout{
-  background: #f4f4f4;
-}*/
-/*列表排序按钮 */
-.vxe-cell--sort {
-  margin-top: -6px;
-  i {
-    font-size: 10px;
-  }
-  .vxe-sort--asc-btn {
-    margin-top: 6px;
-  }
-}
-/*列表表头 */
-.vxe-header--row {
-  position: relative;
-  background: #fff !important;
-  .vxe-cell--sort {
-    position: absolute;
-    z-index: 3;
-    right: 0;
-  }
-  &::after {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 0;
-    background: @primary-color;
-    opacity: 0.04;
-  }
-}
-/*列表分页 */
-.vxe-pager {
-  margin: 8px 0;
-}
-</style>
-<style lang="less" scoped>
-/*订舱表格内字体颜色 */
-.mblno {
-  text-align: left;
-  color: @primary-color;
-  span {
-    margin-right: 0.5rem;
-    cursor: pointer;
-  }
-  .CSMblnoCopy {
-    cursor: pointer;
-  }
-}
-// .vessel {
-//   color: #77c950;
-// }
-.nav-box {
-  padding: 0 10px;
-
-  .nav {
-    display: inline-block;
-    margin-right: 8px;
-    cursor: pointer;
-    border: 1px solid rgba(255, 255, 255, 0);
-    padding: 0 10px;
-    height: 28px;
-    line-height: 26px;
-
-    .iconfont {
-      margin-right: 6px;
-    }
-
-    &:hover {
-      border: 1px solid rgba(255, 255, 255, 0);
-      border-radius: 4px;
-    }
-
-    &:nth-of-type(1) {
-      .iconfont {
-        color: #1d8aff;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(2) {
-      .iconfont {
-        color: #865ef8;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(3) {
-      .iconfont {
-        color: #ff9702;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(4) {
-      .iconfont {
-        color: #1d8aff;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(5) {
-      .iconfont {
-        color: #ff1062;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(6) {
-      .iconfont {
-        color: #1ebeca;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(7) {
-      .iconfont {
-        color: #82c93d;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-
-    &:nth-of-type(8) {
-      .iconfont {
-        color: #1d8aff;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-    &:nth-of-type(9) {
-      .iconfont {
-        color: #f6826b;
-      }
-      &:hover {
-        background: #fff;
-        box-shadow: 0 0 10px #eee;
-      }
-    }
-  }
-}
-
-.right {
-  float: right;
-  cursor: pointer;
-  padding-top: 6px;
-}
-.BookTopButton {
-  height: 33px;
-  .tab-btn {
-    padding: 6px 9px;
-    border: 1px solid #c7c7c9;
-    background: #f9fafe;
-    border-radius: 2px;
-    margin-right: 10px;
-    cursor: pointer;
-    -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
-    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
-    -webkit-user-select: 0 2px 0 rgba(0, 0, 0, 0.02);
-  }
-}
-.table-page-search-submitButtons {
-  text-align: right;
-  padding-top: 6px;
-  .reset {
-    margin-left: 8px;
-    margin-right: 8px;
-  }
-  .more-search {
-    margin-left: 8px;
-    margin-right: 20px;
-    padding-right: 20px;
-    border: none;
-    position: relative;
-    box-shadow: none !important;
-  }
-  /*.tab-btn{
-    margin-left:8px;
-    margin-right: 10px;
-    padding:6px 9px;
-    padding-top:5px;
-    border: 1px solid #c7c7c9;
-    border-radius: 3px;
-    cursor: pointer;
-  }*/
-  .tab-btn {
-    cursor: pointer;
-    position: relative;
-    i {
-      font-size: 14px;
-      margin-left: 8px;
-    }
-  }
-  .tab-btn::before {
-    content: '';
-    position: absolute;
-    width: 1px;
-    height: 17px;
-    background: #ccc;
-    top: 2px;
-    left: -20px;
-  }
-  .senior-search {
-    margin-left: 36px;
-    color: rgba(0, 0, 0, 0.65);
-    position: relative;
-    i {
-      margin-left: 3px;
-      font-size: 15px;
-    }
-  }
-  .senior-search::before {
-    content: '';
-    position: absolute;
-    width: 1px;
-    height: 17px;
-    background: #ccc;
-    top: 2px;
-    left: -16px;
-  }
-  .senior-search:hover {
-    color: @primary-color;
-    i {
-      color: @primary-color;
-    }
-  }
-}
-.ant-btn {
-  margin-right: 8px;
-}
-.table {
-  margin: 8px auto 20px;
-}
-
-.radio-logo {
-  width: 50px;
-  // height: 40px;
-  display: inline-block;
-}
-.group-label-box {
-  width: 100%;
-  .group-label {
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    .ant-radio-wrapper {
-      height: 45px !important;
-      line-height: 45px !important;
-      width: 10%;
-      margin: 0;
-    }
-    // .label-flex {
-    //   flex: 1;
-    // }
-  }
-}
-.Awrapper {
-  width: 100% !important;
-  display: flex !important;
-  height: 45px !important;
-  line-height: 45px !important;
-  width: 10%;
-  margin: 0;
-  .line {
-    margin-left: 10px;
-    margin-right: 40px;
-    height: 24px;
-    flex: 1;
-    border-bottom: 1px solid #c9c9c9;
-  }
-}
-/*查询区日期默认颜色 */
-/deep/ .ant-calendar-today {
-  .ant-calendar-date {
-    color: @primary-color !important;
-    border-color: @primary-color !important;
-  }
-}
-/*方块边框按钮 */
-.tab-btn:hover {
-  border-color: @primary-color;
-  color: @primary-color;
-  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-/*列表双列背景色 */
-// /deep/ .vxe-table--render-default .vxe-body--row.row--stripe {
-//   // background: #f5f9fe;
-//   position: relative;
-//   background: #fff;
-//   z-index: 1;
-//   &::after {
-//     content: '';
-//     position: absolute;
-//     top: 0;
-//     left: 0;
-//     width: 100%;
-//     height: 100%;
-//     z-index: 0;
-//     background: @primary-color;
-//     opacity: 0.04;
-//     z-index: -1;
-//   }
-// }
-/*列表操作按钮颜色 */
-/deep/ .operate-btn {
-  color: @primary-color;
-}
-/deep/ .operate-btn:hover {
-  color: @primary-color !important;
-  opacity: 0.7;
-}
-.book-btn {
-  display: inline-block;
-  padding: 0 10px;
-  height: 24px;
-  margin-right: 8px;
-  border: 1px solid #eee;
-  color: #999;
-  font-size: 12px;
-  line-height: 24px;
-  i {
-    display: none;
-  }
-  &.sta_so {
-    color: #8bc34a;
-    border: 1px solid #8bc34a;
-  }
-  &.sta_bc {
-    color: #fbc02d;
-    border: 1px solid #fbc02d;
-  }
-  &.sta_letter_yard {
-    color: #00bcd4;
-    border: 1px solid #00bcd4;
-  }
-  &.sta_xhz {
-    color: #e64a19;
-    border: 1px solid #e64a19;
-  }
-}
-.billtrace-box {
-  width: 100%;
-  // display: flex;
-  // height: 48px;
-  // flex-wrap:wrap;
-  // padding:3px 0;
-  // text-align: center;
-  .billtrace-btn {
-    display: inline-block;
-    font-size: 12px;
-    height: 16px;
-    // width:30%;
-    // display: flex;
-    span {
-      // flex: 1;
-      text-align: right;
-      color: #999;
-    }
-    i {
-      font-size: 12px;
-      color: #ccc;
-      // flex: 1;
-      text-align: center;
-      &.hide {
-        opacity: 0;
-      }
-    }
-    .active {
-      cursor: pointer;
-      // color: @primary-color;
-      color: #004d11;
-    }
-  }
-}
-.normal-box {
-  .billtrace-btn {
-    display: inline-block;
-  }
-}
-.flex-box {
-  display: flex;
-  height: 48px;
-  flex-wrap: wrap;
-  padding: 3px 0;
-  text-align: center;
-  justify-content: center;
-  .billtrace-btn {
-    font-size: 12px;
-    height: 16px;
-    width: 30%;
-    display: flex;
-    span {
-      flex: 1;
-      text-align: right;
-      color: #999;
-    }
-    i {
-      font-size: 12px;
-      color: #ccc;
-      flex: 1;
-      text-align: center;
-      &.hide {
-        opacity: 0;
-      }
-    }
-    .active {
-      cursor: pointer;
-      // color: @primary-color;
-      color: #004d11;
-    }
-    &:nth-of-type(3) {
-      i {
-        opacity: 0;
-      }
-    }
-  }
-}
-/deep/ .ant-form-item {
-  margin-bottom: 10px !important;
-}
-/deep/ .table-page-search-submitButtons {
-  margin-bottom: 10px !important;
-}
-/deep/ .ant-input {
-  height: 28px;
-  margin-top: 4px;
-  // transform: scaleY(.8);
-}
-/deep/ .ant-card-body {
-  padding-top: 10px;
-}
-/deep/ .ant-calendar-picker-input {
-  padding: 0 4px;
-}
-/deep/ .ant-calendar-range-picker-input {
-  height: 28px;
-  font-size: 12px;
-  vertical-align: top;
-  text-align: center;
-  // background: #f99;
-}
-.reamrk-btns {
-  overflow: visible;
-}
-/deep/ .from-label {
-  padding: 0 !important;
-}
-
-.booking-from-box {
-  padding: 0 10px;
-}
-
-@media (min-width: 1200px) and (max-width: 1600px) {
-  .from-label {
-    padding-right: 0 !important;
-  }
-}
-
-@media (min-width: 1200px) and (max-width: 1438px) {
-  .table-page-search-submitButtons {
-    .ant-btn {
-      margin-left: 4px;
-      margin-right: 4px;
-    }
-  }
-  .table-page-search-submitButtons .senior-search {
-    margin-left: 20px;
-    &::before {
-      left: -7px;
-    }
-  }
-}
-
-/deep/ .book-remark-box {
-  > .vxe-cell {
-    overflow: visible !important;
-  }
-  /deep/ .vxe-cell {
-    overflow: visible !important;
-  }
-}
-
-.bookremark {
-  position: relative;
-  .reamrk-label {
-    width: 100%;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-    display: block;
-    cursor: pointer;
-  }
-}
-
-// 货物状态
-.goods-status {
-  width: 100%;
-  display: flex;
-  height: 48px;
-  .goods-status-left {
-    flex: 1;
-    overflow: hidden;
-    height: 48px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    .goods-tip {
-      font-size: 12px;
-      margin: 0 4px;
-      cursor: pointer;
-      height: 48px;
-      line-height: 48px;
-      display: inline-block;
-      color: @primary-color;
-    }
-  }
-  .goods-status-right {
-    width: 30px;
-    text-align: center;
-    height: 48px;
-    i {
-      color: @primary-color;
-      cursor: pointer;
-      height: 48px;
-      line-height: 48px;
-    }
-  }
-}
-
-.dzRemark,
-.czRemark {
-  display: block;
-  text-align: left;
-  width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-/deep/ .line-box:nth-last-of-type(-n + 5) {
-  .book-remark-box {
-    .bookremark {
-      .reamrk-list {
-        top: inherit;
-        bottom: calc(100% + 8px);
-      }
-    }
-  }
-}
-
-/deep/.line-box:nth-of-type(2n) {
-  position: relative;
-  background: #fff;
-  > * {
-    z-index: 1;
-  }
-  &::after {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 0;
-    background: @primary-color;
-    opacity: 0.04;
-  }
-  .book-remark-box {
-    .bookremark {
-      .reamrk-list {
-        top: inherit;
-        bottom: calc(100% + 8px);
-      }
-    }
-  }
-}
-
-.hovers-list {
-  max-height: 400px;
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 999;
-  width: 300px;
-  background: #fff;
-  box-shadow: 0 0 10px #eee;
-  border-radius: 4px;
-  border: 1px solid #eee;
-  padding: 5px 20px 10px 20px;
-  white-space: normal;
-  text-align: left;
-  z-index: 999 !important;
-  .title {
-    height: 30px;
-    line-height: 30px;
-    font-size: 12px;
-    font-weight: 600;
-  }
-  .list {
-    border-bottom: 1px solid #eee;
-    padding: 6px 0;
-    line-height: 18px;
-    font-size: 12px;
-    color: #666;
-    word-break: break-all;
-    &:nth-last-of-type(1) {
-      border: none;
-    }
-    .icon {
-      margin-right: 4px;
-      color: @primary-color;
-    }
-  }
-}
-.goods-hovers-list {
-  max-height: 400px;
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 999;
-  width: 300px;
-  background: #fff;
-  box-shadow: 0 0 50px #eee;
-  border-radius: 4px;
-  border: 1px solid #eee;
-  padding: 5px 20px 10px 20px;
-  white-space: normal;
-  text-align: left;
-  z-index: 999 !important;
-  transition: 0.5s all;
-  display: block;
-  opacity: 1;
-  &.hide-goods-hover {
-    display: none;
-    opacity: 0;
-  }
-  // overflow: auto;
-  &::before {
-    content: '';
-    float: left;
-    width: 0;
-    height: 0;
-    border-width: 8px;
-    border-style: solid;
-    border-color: transparent #fff transparent transparent;
-    -webkit-transform: rotate(90deg);
-    transform: rotate(90deg);
-    position: absolute;
-    top: -15px;
-    left: 50%;
-    margin-left: -16px;
-  }
-  .title {
-    height: 30px;
-    line-height: 30px;
-    font-size: 12px;
-    font-weight: 600;
-  }
-  .goods-btn {
-    display: inline-block;
-    font-size: 12px;
-    color: #666;
-    word-break: break-all;
-    width: 82px;
-    height: 28px;
-    line-height: 28px;
-    border-radius: 4px;
-    border: 1px solid #eee;
-    margin-bottom: 6px;
-    text-align: center;
-    margin: 0 2px 8px;
-    cursor: pointer;
-    &.active {
-      color: @primary-color;
-      border: 1px solid @primary-color;
-    }
-    .icon {
-      margin-right: 4px;
-      color: @primary-color;
-    }
-  }
-}
-
-@media (min-width: 1192px) and (max-width: 1591px) {
-  .booking-from-box {
-    padding-right: 24px;
-    /deep/ .ant-calendar-picker-icon {
-      display: none;
-    }
-  }
-}
-
-.booking-from-box {
-  /deep/ .ant-calendar-picker-icon {
-    margin-top: -4px !important;
-  }
-}
-/deep/ .ant-form-item-control-wrapper {
-  overflow: hidden !important;
-}
-
-.no-data {
-  display: block;
-  color: #aaa;
-  font-size: 14px;
-  i {
-    line-height: 120px;
-    font-size: 100px;
-  }
-}
-.pono {
-  text-align: left;
-}
-/deep/ .vxe-header--row th {
-  text-align: left !important;
-}
-/deep/ .vxe-cell--title {
-  width: 100%;
-  text-align: left;
-}
-.TaskShippingOrderCompareP {
-  border-bottom: 1px solid #000;
-  padding-bottom: 5px;
-  .TaskShippingOrderCompareSpan {
-    font-weight: bolder;
-    color: red;
-  }
-}
-.TaskShippingOrderCompareMainBox {
-  height: 55vh;
-  overflow-y: auto;
-  .TaskShippingOrderCompareMain {
-    p {
-      margin-bottom: 0;
-    }
-    .TaskShippingOrderCompareMainHeader {
-      display: flex;
-      > div {
-        flex: 1;
-        > p {
-          &:first-child {
-            font-weight: bolder;
-          }
-        }
-      }
-      &.Box {
-        border-top: 1px solid #000;
-        // border-bottom: 1px solid #000;
-        padding: 0.5rem 0 0 0;
-        margin-bottom: 0.5rem;
-      }
-    }
-    .TaskShippingOrderCompareMainList {
-      display: flex;
-      align-items: center;
-      margin-bottom: 0.5rem;
-      > p {
-        flex: 1;
-        &:nth-child(3) {
-          flex: 2;
-          background: #facd91;
-          border: 1px solid red;
-          margin: 0 1rem;
-          padding-left: 0.5rem;
-        }
-      }
-      &.BoxNo {
-        padding-top: 0.5rem;
-        border-top: 1px solid #000;
-        &:nth-child(1) {
-          padding-top: 0;
-          border: none;
-        }
-      }
-    }
-  }
-}
-</style>