doctor-admin-components 1.0.13-pro.1 → 1.0.14-beta.10

package/packages/src/views/biz/contractTracing/contractTracingDetail copy.vue

@@ -0,0 +1,107 @@
+<!--
+ * @Author: zhangpengwei 15038779532@163.com
+ * @Date: 2023-07-20 17:13:54
+ * @LastEditors: zhangpengwei@1338418459736990.onaliyun.com zhangpengwei@1338418459736990.onaliyun.com
+ * @LastEditTime: 2024-01-19 13:54:56
+ * @FilePath: /recycle-vue-ui再生博士后台管理/src/views/biz/contractTracing/contractTracingDetail.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div class="app-container">
+    <div style="position: relative">
+      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+        <el-tab-pane :label="$t('contractDetail.summary')" name="first">
+          <contract-summary v-if="activeName == 'first'" :channel="channel"></contract-summary>
+        </el-tab-pane>
+        <el-tab-pane :label="$t('contractDetail.info')" name="second">
+          <contract-info v-if="activeName == 'second'" :channel="channel"></contract-info>
+        </el-tab-pane>
+        <el-tab-pane
+          v-if="contract.contractType == 'sale'"
+          :label="$t('contractDetail.blInfo')"
+          name="third"
+        >
+          <bill-info :contract="contract" v-if="activeName == 'third'"
+          :channel="channel"
+          ></bill-info>
+        </el-tab-pane>
+        <el-tab-pane :label="$t('contractDetail.fileManage')" name="fourth">
+          <contract-file
+            v-if="activeName == 'fourth'"
+            :contract="contract"
+            :channel="channel"
+            :buyerFlag="buyerFlag"
+          ></contract-file>
+        </el-tab-pane>
+      </el-tabs>
+
+      <!-- 这里添加合同编号的显示 -->
+      <div
+        style="
+          position: absolute;
+          right: 10px;
+          top: 5px;
+          margin-top: 10px;
+          font-weight: bold;
+        "
+      >{{$t('contractDetail.Contract_No')}}：{{ contract.contractNo }}</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getBizContract } from '../../../api/biz/bizContract';
+import ContractSummary from './contractSummary.vue';
+import BillInfo from './billInfo.vue';
+import ContractFile from '../bizFileInfo/contract.vue';
+import ContractInfo from './contractInfo.vue';
+
+export default {
+  name: 'ContractTracingDetail',
+  mixins: [],
+  components: {
+    ContractSummary,
+    BillInfo,
+    ContractFile,
+    ContractInfo,
+  },
+  props: {
+    channel: '',
+  },
+  data() {
+    return {
+      activeName: 'first',
+      contract: {},
+      buyerFlag: true,
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {
+    const contractId = this.$route.params && this.$route.params.contractId;
+    this.getContract(contractId);
+    const activeName = this.$route.query && this.$route.query.activeName;
+    this.activeName = activeName || 'first';
+    localStorage.setItem('contractDetail', location.href);
+    location.href;
+  },
+  mounted() {},
+  methods: {
+    getContract(contractId) {
+      getBizContract(contractId).then((res) => {
+        this.contract = res.data;
+        // Debit note是给卖家的，要放在 ARS 下
+        // Credit note是给买家的，要放在 ARP 下
+        this.buyerFlag = this.contract?.contractNo
+          ?.toLowerCase()
+          ?.includes('arp');
+      });
+    },
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss"></style>

package/packages/src/views/biz/contractTracing/contractTracingDetail.vue

@@ -2,14 +2,55 @@
  * @Author: zhangpengwei 15038779532@163.com
  * @Date: 2023-07-20 17:13:54
  * @LastEditors: zhangpengwei@1338418459736990.onaliyun.com zhangpengwei@1338418459736990.onaliyun.com
- * @LastEditTime: 2024-01-19 13:54:56
+ * @LastEditTime: 2024-05-08 14:21:04
  * @FilePath: /recycle-vue-ui再生博士后台管理/src/views/biz/contractTracing/contractTracingDetail.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
   <div class="app-container">
-    <div style="position: relative">
-      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+    <div class="app-container-container">
+      <div class="app-container-left">
+        <div class="contract-number">
+          <div>{{ $t('contractDetail.Contract_No') }}</div>
+          <div>{{ contract.contractNo }}</div>
+        </div>
+        <div class="contract-number">
+          <div>
+            <span>{{$t('contractDetail.Reference_No')}}</span>
+            <el-button size="mini" type="text" icon="el-icon-edit" @click="clickEditReference"></el-button>
+          </div>
+          <div>{{ contract.reference  || '--' }}</div>
+        </div>
+        <div class="tab-root">
+          <div :class="['tab', activeName == tabsItem.name ? 'active' : '']" v-for="tabsItem in saleTabsArr" :key="tabsItem.id" @click="changeTabs(tabsItem)">
+            {{ tabsItem.label }}
+          </div>
+        </div>
+      </div>
+      <div class="app-container-right" :style="activeName == 'fourth' ? 'overflow:visible' : 'overflow:auto'">
+        <contract-summary v-if="activeName == 'first'" :channel="channel"></contract-summary>
+        <contract-info v-if="activeName == 'second'" :channel="channel"></contract-info>
+        <!-- 提单指令 -->
+        <div v-if="activeName == 'third'">
+          <!-- 标题分栏 -->
+          <el-tabs v-model="activeBillIndex">
+            <el-tab-pane v-for="(bill, i) in blList" :key="i" :label="contract.contractNo + ' 提单指令'" :name="i.toString()">
+              <bill-info @refresh="getBlList" :contract="contract" :billData="bill" :channel="channel"></bill-info>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+
+        <contract-file
+          v-if="activeName == 'fourth' && contract.contractType"
+          :contract="contract"
+          :channel="channel"
+          :buyerFlag="buyerFlag"
+          ref="contractFileRef"
+        ></contract-file>
+      </div>
+    </div>
+    <!-- <div style="position: relative">
+      <el-tabs tabPosition="left" v-model="activeName" type="card" @tab-click="handleClick">
         <el-tab-pane :label="$t('contractDetail.summary')" name="first">
           <contract-summary v-if="activeName == 'first'" :channel="channel"></contract-summary>
         </el-tab-pane>
@@ -33,10 +74,10 @@
             :buyerFlag="buyerFlag"
           ></contract-file>
         </el-tab-pane>
-      </el-tabs>
+      </el-tabs> -->
 
-      <!-- 这里添加合同编号的显示 -->
-      <div
+    <!-- 这里添加合同编号的显示 -->
+    <!-- <div
         style="
           position: absolute;
           right: 10px;
@@ -45,16 +86,16 @@
           font-weight: bold;
         "
       >{{$t('contractDetail.Contract_No')}}：{{ contract.contractNo }}</div>
-    </div>
+    </div> -->
   </div>
 </template>
 
 <script>
-import { getBizContract } from '../../../api/biz/bizContract';
-import ContractSummary from './contractSummary.vue';
-import BillInfo from './billInfo.vue';
-import ContractFile from '../bizFileInfo/contract.vue';
-import ContractInfo from './contractInfo.vue';
+import { getBizContract, getContractBlList, editReferenceNo } from '../../../api/biz/bizContract'
+import ContractSummary from './contractSummary.vue'
+import BillInfo from './billInfo.vue'
+import ContractFile from '../bizFileInfo/contract.vue'
+import ContractInfo from './contractInfo.vue'
 
 export default {
   name: 'ContractTracingDetail',
@@ -63,45 +104,182 @@ export default {
     ContractSummary,
     BillInfo,
     ContractFile,
-    ContractInfo,
+    ContractInfo
   },
   props: {
-    channel: '',
+    channel: ''
   },
   data() {
     return {
       activeName: 'first',
       contract: {},
       buyerFlag: true,
-    };
+      saleTabsArr: [
+        {
+          label: this.$t('contractDetail.summary'),
+          name: 'first',
+          id: 0
+        },
+        {
+          label: this.$t('contractDetail.info'),
+          name: 'second',
+          id: 1
+        },
+        {
+          label: this.$t('contractDetail.blInfo'),
+          name: 'third',
+          id: 2
+        },
+        {
+          label: this.$t('contractDetail.fileManage'),
+          name: 'fourth',
+          id: 3
+        }
+      ],
+      purchaseTabsArr: [
+        {
+          label: this.$t('contractDetail.summary'),
+          name: 'first',
+          id: 0
+        },
+        {
+          label: this.$t('contractDetail.info'),
+          name: 'second',
+          id: 1
+        },
+        {
+          label: this.$t('contractDetail.fileManage'),
+          name: 'fourth',
+          id: 2
+        }
+      ],
+
+      // 提单指令列表
+      blList: null,
+      activeBillIndex: null
+    }
   },
   computed: {},
   watch: {},
   created() {
-    const contractId = this.$route.params && this.$route.params.contractId;
-    this.getContract(contractId);
-    const activeName = this.$route.query && this.$route.query.activeName;
-    this.activeName = activeName || 'first';
-    localStorage.setItem('contractDetail', location.href);
-    location.href;
+    const contractId = this.$route.params && this.$route.params.contractId
+    this.getContract(contractId)
+    const activeName = this.$route.query && this.$route.query.activeName
+    this.activeName = activeName || 'first'
+    // this.activeName = 'fourth'
+    localStorage.setItem('contractDetail', location.href)
+    location.href
   },
   mounted() {},
   methods: {
+    // 编辑合同参考号
+    clickEditReference() {
+      const contractId = this.$route.params && this.$route.params.contractId;
+      this.$prompt('请在下方填写合同参考号', '编辑合同参考号', {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        inputType: 'text',
+        inputValue: this.contract.reference,
+        inputPlaceholder: '请填写合同参考号'
+      })
+        .then(({ value }) => {
+          return editReferenceNo({reference: value, contractId:contractId})
+        })
+        .then(() => {
+          this.$modal.msgSuccess('编辑成功')
+          this.getContract(contractId)
+        })
+        .catch((e) => {
+          console.log(e)
+        })
+    },
+    
+    /**
+     * @description: 切换tab
+     * @param {*} tab
+     * @return {*}
+     */
+    changeTabs(tab) {
+      this.activeName = tab.name
+    },
     getContract(contractId) {
       getBizContract(contractId).then((res) => {
-        this.contract = res.data;
+        this.contract = res.data
         // Debit note是给卖家的，要放在 ARS 下
         // Credit note是给买家的，要放在 ARP 下
-        this.buyerFlag = this.contract?.contractNo
-          ?.toLowerCase()
-          ?.includes('arp');
-      });
+        this.buyerFlag = this.contract?.contractNo?.toLowerCase()?.includes('arp')
+        // 获取提单指令
+        this.getBlList()
+      })
     },
-    handleClick(tab, event) {
-      console.log(tab, event);
+    getBlList() {
+      const contractId = this.$route.params && this.$route.params.contractId
+      if (contractId) {
+        getContractBlList(contractId).then((res) => {
+          this.blList = res.rows
+          // 默认选中第一个
+          if (!this.activeBillIndex) {
+            this.activeBillIndex = '0'
+          }
+        })
+      }
     },
-  },
-};
+
+    handleClick(tab, event) {
+      console.log(tab, event)
+    }
+  }
+}
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.app-container {
+  .app-container-container {
+    display: flex;
+    height: calc(100vh - 126px);
+    .app-container-left {
+      width: 141px;
+      height: 100%;
+      margin-right: 10px;
+      background-color: #d9dfe8;
+      .contract-number {
+        font-size: 12px;
+        font-weight: normal;
+        color: #000000;
+        line-height: 14px;
+        text-align: left;
+        padding: 10px 0 0 15px;
+      }
+      .tab-root {
+        margin-top: 40px;
+        display: flex;
+        flex-direction: column;
+        align-items: flex-end;
+        .tab {
+          height: 48px;
+          font-size: 14px;
+          font-weight: normal;
+          color: #000;
+          line-height: 48px;
+          text-align: right;
+          width: max-content;
+          padding: 0 20px;
+          box-sizing: border-box;
+        }
+        .active {
+          background: #eff5ff;
+          border-radius: 5px 0px 0px 5px;
+          color: #009444;
+        }
+      }
+    }
+    .app-container-right {
+      flex: 1;
+      height: 100%;
+      overflow: auto;
+    }
+    
+  }
+}
+
+</style>

package/packages/src/views/biz/contractTracing/editBill.vue

@@ -4,11 +4,18 @@
       <div class="contract">
         <div class="info" id="printPdf">
           <!-- <div class="title">{{ $t("contract.billTip") }}</div> -->
-          <div style="padding-bottom: 20px">
-            <span style="font-size: 16px; font-weight: bold"> {{ $t('contractDetail.BLConfirm') + '：' }} </span>
-            <el-switch v-model="confirmFlag" :inactive-text="$t('contractDetail.BL_Not_Confirm')" :active-text="$t('contractDetail.BL_Confirmed')"> </el-switch>
-          </div>
-          <el-form :model="form" ref="form" size="mini" :rules="rules" label-width="130px">
+          <el-row>
+            <el-col :span="12" v-if="voidFlag" style="padding-bottom: 20px">
+              <span style="font-size: 16px; color: red; font-weight: bold"> 已作废 </span>
+            </el-col>
+            <el-col :span="12" v-else>
+              <div style="padding-bottom: 20px">
+                <span style="font-size: 16px; font-weight: bold"> {{ $t('contractDetail.BLConfirm') + '：' }} </span>
+                <el-switch v-model="confirmFlag" :inactive-text="$t('contractDetail.BL_Not_Confirm')" :active-text="$t('contractDetail.BL_Confirmed')"> </el-switch>
+              </div>
+            </el-col>
+          </el-row>
+          <el-form :disabled="voidFlag" :model="form" ref="form" size="mini" :rules="rules" label-width="130px">
             <el-collapse v-model="expandItems">
               <el-collapse-item name="0" v-if="channel !== 'official-website'">
                 <template slot="title">
@@ -169,10 +176,13 @@
               </el-collapse-item>
             </el-collapse>
 
-            <el-form-item :label="$t('contract.destination') + ':'">
+            <el-form-item v-if="contract && contract.freightTerms && contract.freightTerms != 'EXW'" :label="$t('contract.destination') + ':'">
               {{ this.contract && this.contract.destination ? this.contract.destination : '' }}
             </el-form-item>
-            <el-form-item :label="$t('contract.terminal') + ':'" prop="terminal">
+            <el-form-item v-else :label="'EXW Address' + ':'">
+              {{ this.contract && this.contract.exw ? this.contract.exw : '' }}
+            </el-form-item>
+            <el-form-item v-if="contract && contract.freightTerms && contract.freightTerms != 'EXW'" :label="$t('contract.terminal') + ':'" prop="terminal">
               <el-input v-model="form.terminal" type="textarea" autosize :placeholder="$t('contract.terminalTip')"></el-input>
             </el-form-item>
 
@@ -260,7 +270,7 @@
             </el-form-item>
           </el-form>
         </div>
-        <div class="footer" v-if="!printModel">
+        <div class="footer" v-if="!printModel && !voidFlag">
           <el-button type="primary" @click="submitForm">{{ $t('button.saveDraft') }}</el-button>
         </div>
       </div>
@@ -298,6 +308,8 @@ export default {
       open: false,
       // 是否已确认
       confirmFlag: false,
+      // 是否已作废
+      voidFlag: false,
       // 表单参数
       form: {
         //买家公司提单货物名称
@@ -379,7 +391,8 @@ export default {
         getBizContract(contractId)
           .then((response) => {
             this.contract = response.data
-            this.confirmFlag = this.contract.blConfirmFlag ?? false
+            this.confirmFlag = this.contract.blConfirmFlag == '1'
+            this.voidFlag = this.contract.blConfirmFlag == '2'
             resolve(response) // 异步操作成功，解决Promise
           })
           .catch((error) => {