[update] 打包项目维护来款、开票修改

2021-09-14 15:31:11 +08:00
parent 757bb11e7a
commit 551473d78f
4 changed files with 296 additions and 124 deletions
@@ -9,50 +9,51 @@
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
-      <div v-for="(item, index) in stageList" :key="index" class="stage-box">
-        <div class="title">
-          <div class="title-text">第{{ item.chinaNumIndex }}阶段</div>
-          <img src="../../../../assets/imgs/icon/icon_edit.png" @click="handleEdit(item)">
+      <template v-if="stageList.length > 0">
+        <div v-for="(item, index) in stageList" :key="index" class="stage-box">
+          <div class="title">
+            <div class="title-text">第{{ item.chinaNumIndex }}阶段</div>
+            <img src="../../../../assets/imgs/icon/icon_edit.png" @click="handleEdit(item)">
+          </div>
+          <a-row>
+            <a-col :span="6">
+              <div class="stage">
+                <div class="stage-title">项目名称：</div>
+                <div class="stage-content">{{ item.projectName }}</div>
+              </div>
+            </a-col>
+            <a-col :span="6">
+              <div class="stage">
+                <div class="stage-title">开票金额：</div>
+                <div class="stage-content stage-content-money">{{ item.invoiceAmount }}</div>
+              </div>
+            </a-col>
+            <a-col :span="6">
+              <div class="stage">
+                <div class="stage-title">开票号：</div>
+                <div class="stage-content">{{ item.billNo }}</div>
+              </div>
+            </a-col>
+            <a-col :span="6">
+              <div class="stage">
+                <div class="stage-title">开票日期：</div>
+                <div class="stage-content">{{ item.billDate }}</div>
+              </div>
+            </a-col>
+          </a-row>
+          <a-row>
+            <a-col>
+              <div class="stage">
+                <div class="stage-title">备注：</div>
+                <div class="stage-content">{{ item.remark }}</div>
+              </div>
+            </a-col>
+          </a-row>
        </div>
-        <a-row>
-          <a-col :span="6">
-            <div class="stage">
-              <div class="stage-title">项目名称：</div>
-              <div class="stage-content">{{ item.projectName }}</div>
-            </div>
-          </a-col>
-          <a-col :span="6">
-            <div class="stage">
-              <div class="stage-title">开票金额：</div>
-              <div class="stage-content stage-content-money">{{ item.invoiceAmount }}</div>
-            </div>
-          </a-col>
-          <a-col :span="6">
-            <div class="stage">
-              <div class="stage-title">开票号：</div>
-              <div class="stage-content">{{ item.billNo }}</div>
-            </div>
-          </a-col>
-          <a-col :span="6">
-            <div class="stage">
-              <div class="stage-title">开票日期：</div>
-              <div class="stage-content">{{ item.billDate }}</div>
-            </div>
-          </a-col>
-        </a-row>
-        <a-row>
-          <a-col>
-            <div class="stage">
-              <div class="stage-title">备注：</div>
-              <div class="stage-content">{{ item.remark }}</div>
-            </div>
-          </a-col>
-        </a-row>
-      </div>
+      </template>
+      <a-empty v-else></a-empty>
    </a-spin>

-    <!--    <a-empty v-else></a-empty>-->
-
    <template slot="footer">
      <a-button type="primary" @click="handleAdd">添加阶段</a-button>
    </template>
@@ -72,9 +73,7 @@ import { payBillList } from '../../../../api/incomePaymentsApi'
 export default {
  name: 'InvoicingStageModule',
  components: { InvoicingModule },
-  provide: {
-
-  },
+  provide: {},
  props: {
    // 项目id
    projectId: {
@@ -104,7 +103,7 @@ export default {
    // 弹窗显示时获取数据
    visible: {
      handler(value) {
-        if(value) {
+        if (value) {
          this.open()
        }
      }
@@ -175,7 +174,7 @@ export default {
      //将【一十】换成【十】
      result = result.replace(/^一十/g, '十')
      return result
-    },
+    }
  }
 }
 </script>
@@ -108,9 +108,9 @@
          </template>

          <span slot="action" class="action-span-cell" slot-scope="text, record">
-            <a @click="incomePayment(record.id)">来款</a>
+            <a @click="incomePayment(record)" :disabled="Number(record.receivableAmount) === 0">来款</a>
            <a @click="cancelPack(record.id)">取消打包</a>
-            <a @click="invoicing(record.id)">开票</a>
+            <a @click="invoicing(record)" :disabled="record.needInvoice === 0 || Number(record.receivableAmount) === 0">开票</a>
          </span>
        </a-table>
      </div>
@@ -118,17 +118,40 @@
    </a-card>

    <!--    打包-->
-    <pack-project-select-project-module :visible.sync="selectPackProjectVisible"
-                                        :pack-id="companyDataById.id"
-                                        @ok="modalFormOk"></pack-project-select-project-module>
+    <pack-project-select-project-module
+      :visible.sync="selectPackProjectVisible"
+      :pack-id="companyDataById.id"
+      @ok="modalFormOk"></pack-project-select-project-module>
+
    <!--    批量来款-->
-    <batch-income-payment-module ref="batchIncomePaymentModal" @ok="modalFormOk"></batch-income-payment-module>
+    <batch-income-payment-module
+      ref="batchIncomePaymentModal"
+      :table-data="selectedProject"
+      :visible.sync="incomeVisible"
+      @ok="modalFormOk"></batch-income-payment-module>
+
    <!--    批量开票-->
-    <batch-invoicing-module ref="batchInvoicingModal" @ok="modalFormOk"></batch-invoicing-module>
+    <batch-invoicing-module
+      ref="batchInvoicingModal"
+      :selected-data="selectedProject"
+      :visible.sync="batchInvoicingVisible"
+      @ok="modalFormOk"></batch-invoicing-module>
+
    <!--    来款阶段-->
-    <arrive-stage-module ref="arriveStage" @ok="modalFormOk"></arrive-stage-module>
+    <arrive-stage-module
+      ref="arriveStage"
+      :project-id="selectProjectId"
+      :visible.sync="arriveStageVisible"
+      @ok="modalFormOk"></arrive-stage-module>
+
    <!--    开票阶段-->
-    <invoicing-stage-module ref="invoicingStage" @ok="modalFormOk"></invoicing-stage-module>
+    <invoicing-stage-module
+      ref="invoicingStage"
+      :visible.sync="invoicingStageVisible"
+      :project-id="selectProjectId"
+      :project-type="selectProjectType"
+      :project-name="selectProjectName"
+      @ok="modalFormOk"></invoicing-stage-module>
  </div>
 </template>

@@ -293,6 +316,15 @@ export default {
      ],
      disableMixinCreated: true,
      selectPackProjectVisible: false,
+      selectedProject: [], // 选中的项目
+      batchInvoicingVisible: false, // 批量开票对话框开启状态
+      incomeVisible: false, // 批量来款对话框开启状态
+      arriveStageVisible: false, // 来款阶段对话框开启状态
+      invoicingStageVisible: false, // 开票阶段对话框开启状态
+      selectProjectId: null, // 选中项目id
+      selectProjectType: null, // 选中项目类型
+      selectProjectName: null, // 选中项目名称
+      selectProjectChargeCompanyName: null, // 选中项目来款企业
      url: {
        list: '/pack/payPackCompanyProject/listAll',
        exportXlsUrl: '/pack/payPackCompanyProject/exportXls'
@@ -369,22 +401,39 @@ export default {
     * 批量来款
     */
    batchIncomePayment() {
-      this.$refs.batchIncomePaymentModal.open()
+      this.selectedProject = []
+      if (this.selectedRowKeys.length === 0) {
+        this.$message.warn('请选择至少一个项目')
+        return
+      }
+      this.getProjectListBySelectedKeys(this.selectedRowKeys, 'incomePayment').then(res => {
+        this.selectedProject = res
+        this.incomeVisible = true
+      }).catch(message => {
+        this.$message.warn(message)
+      }).finally(() => {
+        this.onClearSelected()
+      })
    },
    /**
     * 批量开票
     */
    batchInvoicing() {
-      this.$refs.batchInvoicingModal.open()
-    },
-    /**
-     * 来款
-     * @param id
-     */
-    incomePayment(id) {
-      console.log(id)
-      this.$refs.arriveStage.open()
+      this.selectedProject = []
+      if (this.selectedRowKeys.length === 0) {
+        this.$message.warn('请选择至少一个项目')
+        return
+      }
+      this.getProjectListBySelectedKeys(this.selectedRowKeys, 'invoic').then(res => {
+        this.selectedProject = res
+        this.batchInvoicingVisible = true
+      }).catch((message) => {
+        this.$message.warn(message)
+      }).finally(() => {
+        this.onClearSelected()
+      })
    },
+
    /**
     * 取消打包
     * @param id
@@ -416,12 +465,51 @@ export default {
      })
    },
    /**
-     * 开票
-     * @param id
+     * 来款
+     * @param record
     */
-    invoicing(id) {
-      console.log(id)
-      this.$refs.invoicingStage.open()
+    incomePayment(record) {
+      this.selectProjectId = record.id
+      this.arriveStageVisible = true
+    },
+    /**
+     * 开票
+     * @param record
+     */
+    invoicing(record) {
+      console.log(record)
+      this.selectProjectName = record.chargeProject
+      this.selectProjectId = record.id
+      this.selectProjectType = record.projectType
+      this.selectProjectChargeCompanyName = this.companyDataById.companyTemporaryName
+      this.invoicingStageVisible = true
+    },
+    /**
+     * 通过选中项目id获取数据，并进行相应提示
+     * @param selectedKeys
+     * @param operateType
+     * @returns {Promise<unknown>}
+     */
+    getProjectListBySelectedKeys(selectedKeys, operateType) {
+      return new Promise((resolve, reject) => {
+        let arr = []
+        arr = this.dataSource.filter(tt => selectedKeys.indexOf(tt.id) > -1)
+        // 开票
+        if (operateType === 'invoic') {
+          // 是否存在不需要发票的项目
+          if (arr.some(item => item.needInvoice === 0 || Number(item.receivableAmount) === 0)){
+            reject('存在不需要发票的项目！')
+          }
+        }
+        // 来款
+        if (operateType === 'incomePayment') {
+          // 是否存在应收金额为0的项目
+          if (arr.some(item => Number(item.receivableAmount) === 0)) {
+            reject('存在应收金额为0的项目！')
+          }
+        }
+        resolve(arr)
+      })
    }
  }
 }
@@ -42,12 +42,7 @@
          bordered
          rowKey="id"
          :columns="columns"
-
          :dataSource="dataSource"
-          :pagination="ipagination"
-          :loading="loading"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
-          @change="handleTableChange"
          class="j-table-force-nowrap">

          <!--          输入-->
@@ -68,19 +63,36 @@
 </template>

 <script>
-import { JeroListMixin } from '../../../mixins/JeroListMixin'
 import JDate from '../../../components/tools/JDate'
 import { money } from '../../../utils/validate'

 export default {
  name: 'BatchIncomePaymentModule',
  components: { JDate },
-  mixins: [JeroListMixin],
+  props: {
+    // 选中的项目
+    tableData: {
+      type: Array,
+      required: false,
+      default: []
+    },
+    visible: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  watch: {
+    visible(value) {
+      if (value) {
+        this.open()
+      }
+    }
+  },
  data() {
    return {
      title: '批量来款',
      width: 1000,
-      visible: false,
      confirmLoading: false,
      form: this.$form.createForm(this),
      labelCol: {
@@ -148,31 +160,8 @@ export default {
          scopedSlots: { customRender: 'input-text' }
        }
      ],
+      dataSource: [],
      inputIncomingAmount: null, // 输入的来款金额
-      dataSource: [
-        {
-          id: 1,
-          chargeProject: '项目名称',
-          receivableAmount: 100,
-          paidAmount: 50,
-          thisIncomingAmount: null,
-          remark: ''
-        }, {
-          id: 2,
-          chargeProject: '项目名称2',
-          receivableAmount: 200,
-          paidAmount: 0,
-          thisIncomingAmount: null,
-          remark: ''
-        }, {
-          id: 3,
-          chargeProject: '项目名称3',
-          receivableAmount: 5000,
-          paidAmount: 0,
-          thisIncomingAmount: null,
-          remark: ''
-        }
-      ],
      disableMixinCreated: true
    }
  },
@@ -191,11 +180,12 @@ export default {
      this.close()
    },
    open() {
+      this.dataSource = this.tableData
+      console.log(this.dataSource)
      this.loadData()
-      this.visible = true
    },
    close() {
-      this.visible = false
+      this.$emit('update:visible', false)
    },
    /**
     * 来款金额输入失去焦点，进行金额分配
@@ -206,6 +196,7 @@ export default {
      this.inputIncomingAmount = Number(e.target.value)
      this.clearThisTimeAmount().then(() => {
        this.calculateThisTimeAmount()
+        this.$forceUpdate()
      })
    },
    /**
@@ -16,6 +16,7 @@
              <a-input placeholder="请输入开票金额"
                       v-decorator="['invoicingAmount',validatorRules.invoicingAmount]"
                       :maxLength='50'
+                       @blur="invoicingAmountBlur"
                       @change="(e) => {e.target.value = (e.target.value.replace(/[^0-9.]/g,'')).trim()}"></a-input>
            </a-form-item>
          </a-col>
@@ -40,18 +41,6 @@
            </a-form-item>
          </a-col>
        </a-row>
-        <a-row>
-          <a-col>
-            <a-form-item label="备注" :labelCol="remarksLabelCol" :wrapperCol="remarksWrapperCol">
-              <a-textarea
-                placeholder="请输入备注"
-                v-decorator="['remarks']"
-                :auto-size="{ minRows: 3, maxRows: 6 }"
-                :maxLength='200'
-                @change="e => {e.target.value = (e.target.value + '').trim()}"/>
-            </a-form-item>
-          </a-col>
-        </a-row>
      </a-form>

      <a-table
@@ -61,13 +50,19 @@
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
-        :loading="loading"
        class="j-table-force-nowrap">
-
        <template slot="text" slot-scope="text">
          <j-ellipsis :value="text" :length="18"></j-ellipsis>
        </template>

+        <!--          输入-->
+        <template slot="input-text">
+          <a-input placeholder="请输入备注"
+                   v-decorator="['remark']"
+                   :maxLength='50'
+                   @change="e => {e.target.value = (e.target.value + '').trim()}"></a-input>
+        </template>
+
      </a-table>
    </a-spin>
  </j-modal>
@@ -80,11 +75,31 @@ import { money } from '../../../utils/validate'
 export default {
  name: 'BatchInvoicingModule',
  components: { JDate },
+  props: {
+    // 选中的项目信息
+    selectedData: {
+      type: Array,
+      required: false,
+      default: []
+    },
+    visible: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  watch: {
+    visible(value) {
+      console.log(value)
+      if (value) {
+        this.open()
+      }
+    }
+  },
  data() {
    return {
      title: '批量开票',
      width: 1000,
-      visible: false,
      confirmLoading: false,
      form: this.$form.createForm(this),
      labelCol: {
@@ -118,10 +133,30 @@ export default {
          align: 'center',
          dataIndex: 'chargeProject',
          scopedSlots: { customRender: 'projectName' }
+        }, {
+          title: '应收金额',
+          align: 'center',
+          width: 100,
+          dataIndex: 'receivableAmount'
+        }, {
+          title: '已开票金额',
+          align: 'center',
+          width: 100,
+          dataIndex: 'paidAmount'
+        }, {
+          title: '本次开票金额',
+          align: 'center',
+          width: 140,
+          dataIndex: 'thisInvoicingAmount'
+        }, {
+          title: '备注',
+          align: 'center',
+          width: 200,
+          dataIndex: 'remark',
+          scopedSlots: { customRender: 'input-text' }
        }
      ],
      dataSource: [],
-      loading: false,
      validatorRules: {
        invoicingAmount: {
          rules: [{ required: true, validator: this.checkMoney }],
@@ -134,11 +169,69 @@ export default {
        invoicingTime: {
          rules: [{ required: true, message: '请选择开票时间' }],
          validateTrigger: 'blur'
-        },
-      }
+        }
+      },
+      inputInvoicingAmount: null, // 输入的开票金额
    }
  },
  methods: {
+    loadData() {
+      // 计算项目欠款信息
+      this.dataSource.forEach(item => {
+        item.amountOwed = Number(item.receivableAmount) - Number(item.paidAmount)
+      })
+      this.$forceUpdate()
+    },
+    /**
+     * blur时分配金额
+     */
+    invoicingAmountBlur(e) {
+      e.target.value = (e.target.value.replace(/[^0-9.]/g, '')).trim()
+      this.inputInvoicingAmount = Number(e.target.value)
+      this.clearThisTimeAmount().then(() => {
+        this.calculateThisTimeAmount()
+        this.$forceUpdate()
+      })
+    },
+    /**
+     * 清空本次来款金额
+     * @returns {Promise<unknown>}
+     */
+    clearThisTimeAmount() {
+      return new Promise(resolve => {
+        this.dataSource.forEach(item => {
+          item.thisInvoicingAmount = null
+        })
+        resolve()
+      })
+    },
+    /**
+     * 计算此次来款信息
+     */
+    calculateThisTimeAmount() {
+      if (this.inputInvoicingAmount <= 0) {
+        this.$message.warn('请输入大于0的来款金额')
+        return
+      }
+      this.dataSource.forEach(item => {
+        // 当前项目欠款是否 >0
+        if (Number(item.amountOwed) > 0) {
+          // 输入的来款金额是否 >= 当前项目欠款
+          if (this.inputInvoicingAmount >= Number(item.amountOwed)) {
+            item.thisInvoicingAmount = Number(item.amountOwed)
+            this.inputInvoicingAmount -= Number(item.amountOwed)
+            // item.amountOwed = 0
+          } else {
+            // 输入的来款金额小于当前项目欠款且剩余的输入来款金额大于0，则将剩余全部来款算入当前项目的此次来款
+            if (this.inputInvoicingAmount > 0) {
+              item.thisInvoicingAmount = this.inputInvoicingAmount
+              // item.amountOwed = Number(item.amountOwed) - item.thisIncomingAmount
+              this.inputInvoicingAmount = 0
+            }
+          }
+        }
+      })
+    },
    handleOk() {

    },
@@ -146,10 +239,11 @@ export default {
      this.close()
    },
    open() {
-      this.visible = true
+      this.dataSource = this.selectedData
+      this.loadData()
    },
    close() {
-      this.visible = false
+      this.$emit('update:visible', false)
    },
    /**
     * 校验金额格式