自编号报表优化

src/views/ecw/financial/selfNoReport.vue

@@ -9,11 +9,11 @@
         inline
         class="card"
       >
-          <el-form-item :label="$t('自编号')">
+          <el-form-item :label="$t('自编号')" prop="selfNo">
             <el-input v-model="queryParams.selfNo" clearable></el-input>
           </el-form-item>
-          <el-form-item :label="$t('始发仓')">
-            <el-select v-model="queryParams.startWarehouseIdList" :placeholder="$t('请选择')" clearable>
+          <el-form-item :label="$t('始发仓')" :rules="{required: true, message: $t('请选择始发仓')}" prop="startWarehouseIdList">
+            <el-select v-model="queryParams.startWarehouseIdList" multiple :placeholder="$t('请选择')" clearable>
               <el-option
                 v-for="item in exportWarehouseList"
                 :key="item.id"
@@ -22,7 +22,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item :label="$t('目的国')" :rules="{required: true}">
+          <el-form-item :label="$t('目的国')" :rules="{required: true, message: $t('请选择目的国')}" prop="destCountryId">
             <el-select v-model="queryParams.destCountryId" :placeholder="$t('请选择')" filterable default-first-option>
               <el-option
                 v-for="item in countryList"
@@ -32,8 +32,8 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item :label="$t('目的仓')">
-            <el-select v-model="queryParams.destWarehouseId" :placeholder="queryParams.destCountryId ? $t('请选择') : $t('请先选择目的国')" clearable>
+          <el-form-item :label="$t('目的仓')" prop="destWarehouseIdList">
+            <el-select v-model="queryParams.destWarehouseIdList" multiple :placeholder="queryParams.destCountryId ? $t('请选择') : $t('请先选择目的国')" clearable>
               <el-option
                 v-for="item in importWarehouseList"
                 :key="item.id"
@@ -42,10 +42,10 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item :label="$t('自编号状态')">
+          <el-form-item :label="$t('自编号状态')" prop="status">
             <dict-selector :type="DICT_TYPE.BOX_ORDER_SHIPMENT_STATE" v-model="queryParams.status" clearable></dict-selector>
           </el-form-item>
-          <el-form-item :label="$t('结算时间')" >
+          <el-form-item :label="$t('结算时间')"  prop="dateFilter">
             <el-date-picker v-model="dateFilter" type="datetimerange"  range-separator="-"
               :start-placeholder="$t('开始日期')"
               :end-placeholder="$t('结束日期')"
@@ -54,7 +54,7 @@
             >
             </el-date-picker>
           </el-form-item>
-          <el-form-item :label="$t('是否结算')">
+          <el-form-item :label="$t('是否结算')" prop="slStatus">
             <dict-selector :type="DICT_TYPE.SETTLEMENT_STATUS" v-model="queryParams.slStatus" clearable></dict-selector>
           </el-form-item>
           <el-form-item>
@@ -81,20 +81,56 @@
         </template>
       </el-table-column>
       <el-table-column :label="$t('应收款(Accounts receivable)')" align="center" prop="summaryInfo.receivableTotalFeeGroup"></el-table-column>
-      <el-table-column :label="$t('received in + 目的国国家(目的地实收)')" align="center" prop="">
-        <el-table-column :label="$t('运费')" prop="summaryInfo.netReceiptsCollectFreightFeeGroup"></el-table-column>
-        <el-table-column :label="$t('清关费')" prop="summaryInfo.netReceiptsCollectClearanceFeeGroup"></el-table-column>
-        <el-table-column :label="$t('额外费用')" prop="summaryInfo.netReceiptsCollectOtherFeeGroup"></el-table-column>
+      <el-table-column :label="'received in ' + (dstCountryName || $t('目的国')) + `(${$t('目的地实收')})`" align="center" prop="">
+        <el-table-column :label="$t('运费')" prop="summaryInfo.netReceiptsCollectFreightFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.totalNetReceiptsCollectFreightFee}}{{row.summaryInfo.netReceiptsCollectFreightFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('清关费')" prop="summaryInfo.netReceiptsCollectClearanceFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.totalNetReceiptsCollectClearanceFee}}{{row.summaryInfo.netReceiptsCollectClearanceFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('额外费用')" prop="summaryInfo.netReceiptsCollectOtherFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.totalNetReceiptsCollectOtherFee}}{{row.summaryInfo.netReceiptsCollectOtherFeeCurrency}}
+          </template>
+        </el-table-column>
       </el-table-column>
       <el-table-column :label="$t('received in China(中国实收)')" align="center" prop="" >
-        <el-table-column :label="$t('运费')" prop="summaryInfo.netReceiptsAdvanceFreightFeeGroup"></el-table-column>
-        <el-table-column :label="$t('清关费')" prop="summaryInfo.netReceiptsAdvanceClearanceFeeGroup"></el-table-column>
-        <el-table-column :label="$t('额外费用')" prop="summaryInfo.netReceiptsAdvanceOtherFeeGroup"></el-table-column>
+        <el-table-column :label="$t('运费')" prop="summaryInfo.netReceiptsAdvanceFreightFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.netReceiptsAdvanceFreightFeeCurrency}}{{row.summaryInfo.netReceiptsAdvanceClearanceFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('清关费')" prop="summaryInfo.netReceiptsAdvanceClearanceFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.totalNetReceiptsAdvanceClearanceFee}}{{row.summaryInfo.netReceiptsAdvanceClearanceFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('额外费用')" prop="summaryInfo.netReceiptsAdvanceOtherFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.totalNetReceiptsAdvanceOtherFee}}{{row.summaryInfo.netReceiptsAdvanceOtherFeeCurrency}}
+          </template>
+        </el-table-column>
       </el-table-column>
       <el-table-column :label="$t('Discounts 折扣')" align="center" prop="">
-        <el-table-column :label="$t('运费')" prop="summaryInfo.discountFreightFeeGroup"></el-table-column>
-        <el-table-column :label="$t('清关费')" prop="summaryInfo.discountClearanceFeeGroup"></el-table-column>
-        <el-table-column :label="$t('额外费用')" prop="summaryInfo.discountOtherFeeGroup"></el-table-column>
+        <el-table-column :label="$t('运费')" prop="summaryInfo.discountFreightFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.discountFreightFee}}{{row.summaryInfo.netReceiptsCollectFreightFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('清关费')" prop="summaryInfo.discountClearanceFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.discountClearanceFee}}{{row.summaryInfo.netReceiptsCollectClearanceFeeCurrency}}
+          </template>
+        </el-table-column>
+        <el-table-column :label="$t('额外费用')" prop="summaryInfo.discountOtherFeeGroup">
+          <template slot-scope="{row}">
+            {{row.summaryInfo.discountOtherFee}}{{row.summaryInfo.netReceiptsCollectOtherFeeCurrency}}
+          </template>
+        </el-table-column>
       </el-table-column>
       <el-table-column :label="$t('操作')" v-if="permissions.indexOf('selfno:report:detail') > -1">
         <template slot-scope="scope">
@@ -120,8 +156,10 @@ import {boxSettlementPage, exportSettlementExcel} from "@/api/ecw/box";
 import {DICT_TYPE} from "@/utils/dict";
 import {getCountryListAll} from "@/api/ecw/country";
 import {getListTree} from "@/api/ecw/region";
+import Template from "@/views/cms/template/index.vue";
 
 export default {
+  components: {Template},
   data() {
     return {
       loading: false, // 是否加载中
@@ -131,6 +169,8 @@ export default {
       queryParams: {
         page: 1,
         rows: 10,
+        startWarehouseIdList:[],
+        destWarehouseIdList: []
       },
       // tradeCityList: [],
       currencyList:[],
@@ -146,7 +186,7 @@ export default {
   created() {
     getCurrencyPage(this.params).then(res => this.currencyList = res.data.list)
     // getTradeCityList().then((res) => (this.tradeCityList = res.data));
-    this.getList();
+    // 默认不查询，必须选择目的国以后才可以查询 this.getList();
     getWarehouseList().then(res => this.warehouseList = res.data)
     getListTree({treeType: 1}).then(r => {
       this.countryList = r.data
@@ -182,6 +222,13 @@ export default {
         return this.queryParams.destCountryId === item.guojia && ( +item.tradeType === 1 || +item.tradeType === 3)
       })
     },
+    // 目的国名称
+    dstCountryName(){
+      if(!this.queryParams.destCountryId) return null
+      const country = this.countryList.find(item => item.id == this.queryParams.destCountryId)
+      if(!country) return null
+      return this.$l(country, 'title')
+    }
   },
   methods: {
     getCurrencyLabel(id){
@@ -192,7 +239,11 @@ export default {
     /** 查询列表 */
     getList() {
       this.loading = true;
-      let params = {...this.queryParams}
+      let params = {
+        ...this.queryParams,
+        startWarehouseIdList: this.queryParams.startWarehouseIdList.join(','),
+        destWarehouseIdList: this.queryParams.destWarehouseIdList.join(',')
+      }
       this.addBeginAndEndTime(params, this.dateFilter, "JsDate", false);
       // 执行查询
       boxSettlementPage(params).then((response) => {
@@ -204,11 +255,19 @@ export default {
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.queryParams.page = 1;
-      if(!this.queryParams.destCountryId){
-        return this.$message.error(this.$t('请选择目的国'))
-      }
-      this.getList();
+      this.$refs.queryForm.validate((valid) => {
+        console.log({valid})
+        if(!valid) return
+        this.queryParams.page = 1;
+        if(!this.queryParams.destCountryId){
+          return this.$message.error(this.$t('请选择目的国'))
+        }
+        if(!this.queryParams.startWarehouseIdList || !this.queryParams.startWarehouseIdList.length){
+          return this.$message.error(this.$t('请选择始发仓'))
+        }
+        this.getList();
+      })
+
     },
     handleReset(){
       this.$refs['queryForm'].resetFields()