doctor-admin-components 1.0.14-beta.3 → 1.0.14-beta.30

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

@@ -2,115 +2,259 @@
  * @Author: zhangpengwei 15038779532@163.com
  * @Date: 2023-07-31 17:40:56
  * @LastEditors: zhangpengwei@1338418459736990.onaliyun.com zhangpengwei@1338418459736990.onaliyun.com
- * @LastEditTime: 2024-04-02 17:58:33
+ * @LastEditTime: 2024-08-23 14:16:00
  * @FilePath: /doctor-admin-components/packages/src/views/biz/contractTracing/chargingDialog.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
 <template>
   <div class="app-container">
     <!-- 合同争议详情对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
       <el-form :model="form">
-        <el-row>
-          <el-col :span="8">
-            <el-row>
-              <el-col :span="18">
-                <el-form-item label="本次扣减定金:"
-                  >{{ '$' + form.purchaseDepositAmount ? form.purchaseDepositAmount : '' }}
-                  <el-tooltip class="item" effect="dark" content="当前提单抵扣定金金额" placement="top-start">
+        <el-table 
+        :data="form.containerPurchaseAmountRespList"
+        :cell-style="{'padding': '10px 0'}"
+        :header-cell-style="{'padding': '10px 0'}"
+        >
+          <el-table-column align="center" prop="containerNo" width="150" label="柜号"></el-table-column>
+          <el-table-column align="center" label="货物名称"  width="150" >
+            <template slot-scope="{ row }">
+              <div style="white-space: pre-line !important" v-for="(item, index) in getColumnPropArray(row)" :key="index">{{item.askName}}</div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" label="净量(MT)" prop="goodsNetWeight">
+              <template slot-scope="{ row }">
+                <div style="white-space: pre-line !important" v-for="(item, index) in getColumnPropArray(row)" :key="index">
+                  <span :style="item.goodsNetWeight != item.purchaseActualNetWeight ? 'color:red' : ''">{{$formatNumber(item.goodsNetWeight, 3)}}</span>
+                </div>
+              </template>
+          </el-table-column>
+          <el-table-column align="center" label="单价($)" width="100" prop="purchasePriceResult">
+            <template slot-scope="{ row }">
+              <div style="white-space: pre-line !important" v-for="(item, index) in getColumnPropArray(row)" :key="index">
+                <el-tooltip v-if="getPurchaseAmountTip(item, row)" class="ml10" effect="dark" placement="top">
+                    <template slot="content">
+                      {{getPurchaseAmountTip(item, row)}}
+                    </template>
                     <span>
-                      <i class="el-icon-warning" />
+                      <span :style="item.purchasePriceResult != item.purchaseActualUnitPrice ? 'color:red' : ''"> {{item.purchasePriceResult ? $formatNumber(item.purchasePriceResult, 2) : (item.purchaseUnitPriceFormula || getPrice(item)) }}
+                      </span>
+                      <i class="el-icon-question"></i>
                     </span>
-                  </el-tooltip>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-button type="text" @click="updateShipmentDepositAmount(form.shipmentId, form.purchaseDepositAmount)">编辑</el-button>
-              </el-col>
-            </el-row>
+                </el-tooltip>
+                <span v-else :style="item.purchasePriceResult != item.purchaseActualUnitPrice ? 'color:red' : ''"> {{item.purchasePriceResult ? $formatNumber(item.purchasePriceResult, 2) : (item.purchaseUnitPriceFormula || getPrice(item)) }}
+                </span>
+              </div>
+              </template>
+          </el-table-column>
+          <el-table-column align="center" label="修正净重(MT)" width="130" prop="purchaseActualNetWeight">
+            <template slot-scope="{ row }">
+              <div style="white-space: pre-line !important" v-for="(item, index) in getColumnPropArray(row)" :key="index">
+                <span :style="item.goodsNetWeight != item.purchaseActualNetWeight ? 'color:red' : ''">{{$formatNumber(item.purchaseActualNetWeight, 3)}}</span>
+                <i class="el-icon-edit-outline edit-style" @click.stop="editInfo(item,'purchaseActualNetWeight', '1')"/>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" label="修正单价($)" width="130" prop="purchaseActualUnitPrice">
+            <template slot-scope="{ row }">
+              <div style="white-space: pre-line !important" v-for="(item, index) in getColumnPropArray(row)" :key="index">
+                <span :style="item.purchasePriceResult != item.purchaseActualUnitPrice ? 'color:red' : ''"> {{$formatNumber(item.purchaseActualUnitPrice, 2)}}</span>
+                <i class="el-icon-edit-outline edit-style" @click.stop="editInfo(item, 'purchaseActualUnitPrice', '1')"/>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="amount" label="采购金额($)" width="130">
+            <template slot-scope="{ row }">{{ $formatNumber(row.amount, 2) }}</template>
+          </el-table-column>
+          <el-table-column align="center" prop="purchaseDepositAmount" label="扣减定金($)" width="130">
+            <template slot-scope="{ row }">{{ $formatNumber(row.purchaseDepositAmount, 2) }}</template>
+          </el-table-column>
+          <el-table-column align="center" label="尾款">
+            <template slot-scope="{ row }">{{ $formatNumber(row.amount - row.purchaseDepositAmount, 2) }}</template>
+          </el-table-column>
+        </el-table>
+        <div class="my-footer">
+          <div class="footer-item" style="width:150px;text-align:center"> 总计</div>
+          <div class="footer-item" style="width:150px;text-align:center"> 柜数：{{ form && form.containerPurchaseAmountRespList && form.containerPurchaseAmountRespList.length }}柜</div>
+          <div class="footer-item">装运总净重：<br/>{{$formatNumber(form.totalNetWeight || 0, 3) + 'MT'}}</div>
+          <div style="width:100px"></div>
+          <div class="footer-item">装运总修正净重：<br/>{{$formatNumber(form.actualTotalNetWeight || 0, 3)  + 'MT'}}</div>
+          <div style="width:135px"></div>
+          <div class="footer-item">采购总金额：
+            <i class="el-icon-edit-outline edit-style" @click.stop="editInfo(form,'purchaseActualTotalAmount', '2')"/>
+            <br/>$ {{ $formatNumber(form.totalPurchaseAmount, 2)  }}
+          </div>
+          <div class="footer-item">本次扣减定金：
+            <i class="el-icon-edit-outline edit-style" @click.stop="editInfo(form,'purchaseDepositAmount', '2')"/>
+            <br/>$ {{ $formatNumber(form.purchaseDepositAmount, 2) }}
+          </div>
+          <div class="footer-item">采购总尾款：<br/>$ {{ $formatNumber(form.totalPurchaseAmount - form.purchaseDepositAmount, 2) }}</div>
+        </div>
+         <!-- 自定义合并行 -->
+        <div>
+
+        </div>
+        <el-row style="margin-top:20px">
+          <el-col :span="8">
+            <el-form-item label="本次装运总修正净重:">
+              <el-tooltip class="ml10" effect="dark" content="本次一共装了多少吨的货（取修正重量汇总）" placement="top">
+                <span>
+                   {{  $formatNumber(form.actualTotalNetWeight || 0, ) + 'MT'}}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="上次剩余定金余额:">
-              {{ '$' + form.purchaseDepositBalanceAmount ? form.purchaseDepositBalanceAmount : '' }}
-              <el-tooltip class="item" effect="dark" content="还剩多少定金可抵扣，可为负数" placement="top-start">
+            <el-form-item label="本次装运柜数:">
+              <el-tooltip class="ml10" effect="dark" content="当前装运装了多少柜" placement="top">
                 <span>
-                  <i class="el-icon-warning" />
-                </span>
-              </el-tooltip>
+                   {{form && form.containerPurchaseAmountRespList && form.containerPurchaseAmountRespList.length }}柜
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
             </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="定金总额:"
-              >{{ '$' + form.totalPurchaseDepositAmount ? form.totalPurchaseDepositAmount : '' }}
-              <el-tooltip class="item" effect="dark" content="定金发票一共有多少" placement="top-start">
+            <el-form-item label="定金总额:">
+              <el-tooltip class="ml10" effect="dark" content="采购定金发票一共已付多少金额" placement="top">
+                 <span>
+                    $ {{
+                       $formatNumber(form.totalPurchaseDepositAmount || 0, 2)
+                    }}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="总已装运净重:">
+              <el-tooltip class="ml10" effect="dark" content="该采购合同一共装了多少吨的货" placement="top">
                 <span>
-                  <i class="el-icon-warning" />
-                </span>
-              </el-tooltip>
+                   {{ $formatNumber(form.totalNetWeight, 3) + 'MT'}}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
             </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
-            <el-form-item label="采购尾款:">{{ '$' + (form.totalPurchaseAmount - form.purchaseDepositAmount).toFixed(2) }}</el-form-item>
+            <el-form-item label="总已装运柜数:">
+              <el-tooltip class="ml10" effect="dark" content="此采购合同一共已经装了多少柜（根据最新的装运数据实时刷新）" placement="top">
+                <span>
+                   {{form.loadedContainerNumber + '柜'}}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="装运总价:">{{ '$' + form.totalPurchaseAmount }}</el-form-item>
+            <el-form-item label="上次剩余定金:">
+              <el-tooltip class="ml10" effect="dark" content="创建时间在此之前的装运还剩多少定金可以抵扣，不会随着上次的抵扣金额中途变更而刷新，可为负数" placement="top">
+                <span>
+                  <span v-if="form.purchaseDepositBalanceAmount == null">$0</span>
+                  <span v-else>
+                    $ {{  $formatNumber(form.purchaseDepositBalanceAmount, 2) }}
+                     <span @click.stop="queryDeductionRecords" class="edit-style">点击查询扣减记录</span>
+                  </span>
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
           </el-col>
-        </el-row>
-        <el-row>
           <el-col :span="8">
-            <el-form-item label="重量/柜数:">{{ form.totalNetWeight + 'MT/' + form.containerNumber + '柜' }}</el-form-item>
+            <el-form-item label="签约总净重:">
+              <el-tooltip class="ml10" effect="dark" content="该采购合同一共签了多少吨的货（实时刷新合同的签约重量）" placement="top">
+                <span>
+                   {{ $formatNumber(form.signedContractWeight || 0, 3) + 'MT'}}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="已装柜数/签约柜数:">{{ form.loadedContainerNumber + '柜/' + form.signedContainerNumber + '柜' }}</el-form-item>
+            <el-form-item label="本次扣减定金基于总柜数:">
+              <el-tooltip class="ml10" effect="dark" content="生成此装运时，采购合同签了多少柜（在此装运后再修改合同不刷新该数据）" placement="top">
+                <span>
+                   {{(form.purchaseDepositContainerNumber || 0) + '柜'}}
+                   <i class="el-icon-question"></i>
+                   <span class="edit-style" @click.stop="editInfo(form,'purchaseDepositContainerNumber', '2')">编辑</span>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
           </el-col>
-        </el-row>
-
-        <el-table :data="form.containerPurchaseAmountRespList">
-          <el-table-column align="center" prop="containerNo" label="柜号"></el-table-column>
-          <el-table-column align="center" label="货物名称">
-            <template slot-scope="{ row }">
-              <div style="white-space: pre-line !important">{{ getColumnProp(row, 'askName') }}</div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" label="重量(MT)">
-            <template slot-scope="{ row }">
-              <div style="white-space: pre-line !important">{{ getColumnProp(row, 'goodsNetWeight') }}</div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" label="单价($)" width="130">
-            <template slot-scope="{ row }">
-              <div v-for="(item, index) in getColumnPropArray(row)" :key="index">
-                {{ item.purchasePriceResult }};
-                <!-- 显示每个项的值 -->
-                <el-tooltip
-                  v-if="item.quoteType != 'FIXED' && row.pointPrice"
-                  class="item"
-                  effect="dark"
-                  :content="getPurchaseAmountTip(item, row)"
-                  placement="top-start"
-                >
-                  <span>
-                    <i class="el-icon-question" />
+          <el-col :span="8">
+            <el-form-item label="本次扣减定金:">
+              <el-tooltip class="ml10" effect="dark" content="当前装运抵扣了多少定金" placement="top">
+                <span>
+                  <span v-if="form.purchaseDepositAmount == null">$0</span>
+                  <span v-else>
+                    $ {{  $formatNumber(form.purchaseDepositAmount || 0, 2)}}
                   </span>
+                   <i class="el-icon-question"></i>
+                 </span>
                 </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="签约总柜:">
+              <el-tooltip class="ml10" effect="dark" content="采购合同签了多少柜（根据最新的合同数据实时刷新）" placement="top">
+                <span>
+                   {{(form.signedContainerNumber || 0) + '柜'}}
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="本次剩余定金:">
+              <el-tooltip class="ml10" effect="dark" content="本次还剩多少定金可供下次抵扣，不会随着下次的抵扣行为刷新，可为负数" placement="top">
+                <span>
+                  <span v-if="form.thisRemainingDeposit == null">$0</span>
+                  <span v-else>
+                    $ {{  $formatNumber(form.thisRemainingDeposit || 0, 2) }}
+                  </span>
+                  <i class="el-icon-question"></i>
+                </span>
+                </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="总剩余定金:">
+              <el-tooltip class="ml10" effect="dark" content="当前时间该合同还剩余多少定金可以用于抵扣，随着每次的抵扣行为实时刷新，可为负数" placement="top">
+                <span>
+                  <span v-if="form.purchaseDepositBalanceAmount == null">$0</span>
+                  <span v-else>
+                    $ {{  $formatNumber(form.purchaseDepositBalanceAmount || 0 ,2) }}
+                  </span>
+                   <i class="el-icon-question"></i>
+                 </span>
+                </el-tooltip>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item>
+              <div>
+                <span style="font-weight: bold;margin-right:5px;">备注:</span>
+                <el-button size="mini" v-if="!remarkEditable" type="primary" @click.stop="remarkEditable = true">编辑备注</el-button>
+                <el-button size="mini" v-else type="success" @click.stop="editRemark">保存备注</el-button>
               </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="amount" label="小计($)" width="130"></el-table-column>
-          <el-table-column align="center" prop="purchaseDepositAmount" label="扣减定金($)" width="130"></el-table-column>
-          <el-table-column align="center" label="单柜尾款">
-            <template slot-scope="{ row }">{{ (row.amount - row.purchaseDepositAmount).toFixed(2) }}</template>
-          </el-table-column>
-        </el-table>
-      </el-form>
+              <el-input type="textarea" :rows="2" v-model="form.remark" :disabled="!remarkEditable"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+       </el-form>
+       <ShipmentPurchaseAmountEditDialog ref="ShipmentPurchaseAmountEditDialog" @refresh="refresh"></ShipmentPurchaseAmountEditDialog>
+       <ChangrLogList :list="form.changeLogList"></ChangrLogList>
+       <QueryDeductionRecords ref="QueryDeductionRecords"></QueryDeductionRecords>
     </el-dialog>
   </div>
 </template>
 
 <script>
 import { getPurchaseAmount, updateBizShipment } from '../../../api/biz/bizShipment'
+import ShipmentPurchaseAmountEditDialog from './shipmentPurchaseAmountEditDialog.vue'
+import ChangrLogList from './changrLogList.vue'
+import QueryDeductionRecords from './queryDeductionRecords.vue'
 
 export default {
   name: 'ShipmentPurchaseAmount',
@@ -119,19 +263,28 @@ export default {
       // 遮罩层
       loading: true,
       // 弹出层标题
-      title: '',
+      title: '尾款计算明细',
       // 是否显示弹出层
       open: false,
       // 表单参数
-      form: {},
+      form: {
+        changrLogList: [],
+      },
       // 非单个禁用
       single: true,
       // 非多个禁用
       multiple: true,
       //
-      contract: null
+      contract: null,
+      remarkEditable: false,
+      tableList: []
     }
   },
+  components: {
+    ShipmentPurchaseAmountEditDialog,
+    ChangrLogList,
+    QueryDeductionRecords
+  },
   props: {
     getContractFileInfoCallback: {
       type: Function
@@ -140,6 +293,97 @@ export default {
   created() {},
   mounted() {},
   methods: {
+    /**
+     * @description: 查询扣减记录
+     * @return {*}
+     */
+    queryDeductionRecords() {
+      if(!this.form.shipmentId) {
+          this.$message.error('shipmentId不能为空')
+          return
+      }
+      this.$refs.QueryDeductionRecords.handlerOpen(this.form.shipmentId)
+
+    },
+    /**
+     * @description: 编辑备注
+     * @return {*}
+     */
+    editRemark() {
+      updateBizShipment({
+        shipmentId: this.form.shipmentId,
+        remark: this.form.remark
+      }).then(() => {
+        this.$message({
+          type: 'success',
+          message: '修改成功'
+        })
+        this.refresh()
+        this.remarkEditable = false
+      })
+    },
+    // 编辑信息
+    editInfo(detail, prop, type) {
+      this.remarkEditable = false
+      let textInfo = {}
+      let info = {}
+      if(type == 1) {
+        info = {
+          containerId: detail.containerId,
+          containerDetailId: detail.containerDetailId,
+          purchaseActualNetWeight: detail.purchaseActualNetWeight,
+          purchaseActualUnitPrice: detail.purchaseActualUnitPrice,
+        } 
+        // 修改表格净重
+        if(prop == 'purchaseActualNetWeight') {
+          textInfo = {
+            title: `请输入柜号${detail.containerNo}的修正净重`,
+            label: detail.askName,
+            unit: 'MT'
+          }
+        }
+        // 修改表格单价
+        if(prop == 'purchaseActualUnitPrice') {
+          textInfo = {
+            title: `请输入柜号${detail.containerNo}的修正单价`,
+            label: detail.askName,
+            unit: '$'
+          }
+        }
+      }
+
+      if(type == 2) {
+        info = {
+          shipmentId: detail.shipmentId,
+          purchaseDepositContainerNumber: detail.purchaseDepositContainerNumber,
+          purchaseActualTotalAmount: detail.totalPurchaseAmount,
+          purchaseDepositAmount: detail.purchaseDepositAmount,
+        }
+        if(prop == 'purchaseDepositContainerNumber') {
+          textInfo = {
+            title: `请输入本次扣减定金基于总柜数`,
+            label: '本次扣减定金基于总柜数',
+            unit: '柜'
+          }
+        }
+        if(prop == 'purchaseActualTotalAmount') {
+          textInfo = {
+            title: `直接修改采购总金额`,
+            label: '',
+            unit: '$'
+          }
+        }
+
+        if(prop == 'purchaseDepositAmount') {
+          textInfo = {
+            title: `请输入本次扣减定金`,
+            label: '本次扣减定金',
+            unit: '$'
+          }
+        }
+      }
+      this.$refs.ShipmentPurchaseAmountEditDialog.handlerOpen(info, type, textInfo,prop)
+    },
     //更新装运采购定金
     updateShipmentDepositAmount(shipmentId, purchaseDepositAmount) {
       this.$prompt('本次扣减定金$', '请输入本次扣减定金', {
@@ -171,12 +415,17 @@ export default {
         })
     },
     getPurchaseAmountTip(item, row) {
-      var msg
-      msg = '成交单价为'
-      msg = msg + (item.quoteType == 'CMX' ? 'CMX-' + item.purchaseUnitPrice : item.quoteType == 'LME' ? item.purchaseUnitPrice + '%LME' : '')
-      msg = msg + ',' + row.pointDate + '点到的期货价格为$' + row.pointPrice
+      if(item.quoteType == 'FIXED' || !item.pointDate) {
+        return ''
+      }
+      let msg = '成交单价为'
+      msg = msg + this.getPrice(item)
+      msg = msg + ', ' + row.pointDate + '点到的期货价格为$' + row.pointPrice
       return msg
     },
+    getPrice(item) {
+      return (item.quoteType.includes('CMX') ? item.quoteType + '-' +item.purchaseUnitPrice : item.quoteType.includes('LME') ? item.purchaseUnitPrice + '%' + item.quoteType : '')
+    },
     getColumnProp(row, type) {
       var list = []
       row?.containerDetailPurchaseAmountRespList?.forEach((containerDetail) => {
@@ -203,7 +452,32 @@ export default {
         this.form = res.data
         this.open = true
       })
+    },
+    refresh() {
+      this.handleShow(this.form.shipmentId)
+      this.getContractFileInfoCallback && this.getContractFileInfoCallback()
     }
   }
 }
 </script>
+<style scoped lang="scss">
+.edit-style {
+  cursor: pointer;
+  color: #409eff;
+}
+.my-footer {
+  display: flex;
+  justify-content: space-between;
+  background-color: #f5f7fa;
+  padding: 10px;
+  font-weight: bold;
+  .footer-item {
+    text-align: center;
+    width:130px;
+  }
+}
+::v-deep .cell {
+  padding: 0;
+  word-break: break-word;
+}
+</style>