kd-aiot-frontend-eom/src/views/financialManage/receivableManage/components/addReceivableDialog.vue

<template>
  <ele-modal
    custom-class="ele-dialog-form long-dialog-form"
    :centered="true"
    :visible="visible"
    :title="title"
    :append-to-body="true"
    :close-on-click-modal="false"
    :maxable="true"
    :resizable="true"
    width="85%"
    :before-close="cancel"
  >
    <div v-loading="loading">
      <!--基本信息-->
      <headerTitle title="基本信息" style="margin-top: 30px"></headerTitle>
      <el-form ref="form" :model="dataForm" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="会计科目:" prop="accountingSubjectId">
              <ele-tree-select
                clearable
                :disabled="dialogType == 'view'"
                filterable
                ref="treeSelect"
                :data="accountingSubjectList"
                v-model="dataForm.accountingSubjectId"
                valueKey="id"
                labelKey="name"
                placeholder="请选择"
                @change="changeSubjectInfo"
                default-expand-all
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item
              label="应收日期"
              prop="receivableDate"
            >
              <el-date-picker
                :disabled="dialogType == 'view'"
                v-model="dataForm.receivableDate"
                value-format="yyyy-MM-dd"
                type="date"
                style="width: 100%"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="receivableTotalPrice" label="应收金额">
              <el-input :disabled="dialogType == 'view'" v-model="dataForm.receivableTotalPrice"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="invoiceCode" label="发票编码">
              <el-input disabled v-model="dataForm.invoiceCode"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="invoiceNos" label="发票号">
              <el-input disabled v-model="dataForm.invoiceNos"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="invoiceCategory" label="发票种类">
              <el-select
                :disabled="true"
                clearable
                class="ele-block"
                v-model="dataForm.invoiceCategory"
                placeholder="请选择"
              >
                <el-option label="增值税专用发票" :value="1"></el-option>
                <el-option label="增值税普通发票" :value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item prop="contactName" label="公司名称">
              <el-input disabled v-model="dataForm.contactName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="来源类型" prop="sourceType">
              <el-select
                :disabled="true"
                clearable
                class="ele-block"
                v-model="dataForm.sourceType"
                placeholder="请选择"
              >
                <el-option label="对账单" :value="1" />
                <el-option label="合同" :value="2"/>
                <el-option label="售后管理" :value="4" />
                <el-option label="销售订单" :value="3" />
                <el-option label="发货单" :value="5" />
                <el-option label="收款计划单" :value="7" />
                <el-option label="采购收货单" :value="6" />
                <el-option label="付款计划单" :value="8" />
                <el-option label="其他" :value="99" />
                <el-option label="其他" :value="9" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="sourceCode" label="来源编码">
              <el-input disabled v-model="dataForm.sourceCode"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item prop="remark" label="备注">
              <el-input :disabled="dialogType == 'view'" v-model="dataForm.remark"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="files" label="附件">
              <fileMain v-model="dataForm.files" :type="dialogType == 'view' ? 'view' : 'add'"></fileMain>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <headerTitle title="应收信息" style="margin-top: 30px"></headerTitle>
      <receivable-info
        :dataForm.sync="dataForm"
        :receivableList.sync="receivableList"
        dialogType="view"
        @addAdvanceReceipt="addAdvanceReceipt"
        ref="receivableInfoRef"
      ></receivable-info>

      <headerTitle title="对账明细" style="margin-top: 30px"></headerTitle>
      <account-detail-table
        ref="accountDetailTableRef"
        :datasource.sync="datasource"
        dialogType="view"
        :queryDimension="dataForm.queryDimension"
        @totalChange="handleTotalChange"
        @countChange="handleCountChange"
      ></account-detail-table>
    </div>
    <advance-receipt-select-dialog
      ref="advanceReceiptSelectRef"
      :contactId="dataForm.contactId"
      @changeParent="onAdvanceReceiptSelected"
    ></advance-receipt-select-dialog>
    <div slot="footer" class="footer">
      <el-button
        v-if="dialogType !== 'view'"
        type="primary"
        @click="save"
        v-click-once
        >保存
      </el-button>
      <el-button
        v-if="dialogType !== 'view'"
        type="primary"
        @click="save('sub')"
        v-click-once
        >提交
      </el-button>
      <el-button @click="cancel">返回</el-button>
    </div>
    <process-submit-dialog
      :processSubmitDialogFlag.sync="processSubmitDialogFlag"
      v-if="processSubmitDialogFlag"
      ref="processSubmitDialogRef"
      @reload="reload"
    ></process-submit-dialog>
  </ele-modal>
</template>

<script>
  import AccountDetailTable from '@/views/saleManage/saleOrder/accountstatement/components/accountDetailTable.vue';
  import ReceivableInfo from '@/views/saleManage/saleOrder/accountstatement/components//receivableInfo.vue';
  import AdvanceReceiptSelectDialog from '@/views/saleManage/saleOrder/accountstatement/components//advanceReceiptSelectDialog.vue';

  import saleForm from '@/views/saleManage/saleOrder/accountstatement/components/saleForm.vue';
  import {
    getStatementRecordListAPI,
    infoAccountStatementAPI,
    saveAccountStatementAPI,
    createAccountStatementAPI,
    updateAccountStatementAPI,
    accountstatementInfoAPI,
    accountstatementUpdateAPI
  } from '@/api/saleManage/accountstatement';
  import { getFinReceivableInitInfoAPI, getFinReceivableInfoAPI, saveReceivableAPI, updateReceivableAPI } from '@/api/financialManage/receivableManage';
  import processSubmitDialog from '@/BIZComponents/processSubmitDialog/processSubmitDialog.vue';
  import { paymentTypeOp } from '@/enum/dict';
  import { getTreeByPid } from '@/api/classifyManage';

  export default {
    name: 'addReceivableDialog',
    components: {
      processSubmitDialog,
      AccountDetailTable,
      ReceivableInfo,
      AdvanceReceiptSelectDialog,
      saleForm
    },
    //客户管理数据
    props: {
      visible: {
        type: Boolean,
        default: false
      },
      contactData: {
        type: Object,
        default: () => {
          return {};
        }
      },
      saleOrderData: {
        type: Object,
        default: () => {
          return {};
        }
      }
    },
    data() {
      return {
        paymentTypeOp,
        fullscreen: false,
        loading: false,
        saveLoading: false,
        datasource: [],
        recorpayList: [],
        receivableList: [],
        accountingSubjectList: [],
        isDetail: false,
        statReceipt: null,
        dataForm: {
          accountingSubjectId: '',
          accountingSubjectCode: '',
          accountingSubjectName: '',
          sourceType: 1,
          dateType: 1,
          queryDimension: 1,
          dateValue: '',
          contactId: '',
          contactName: '',
          sourceName: '',
          sourceId: '',
          type: '',
          year: '',
          quarter: '',
          month: '',
          dateTimeRange: [],
          orderNo: '',
          orderId: '',
          id: '',
          startDate: '',
          endDate: '',
          repliedFiles: [],
          // 应收信息字段
          fundType: 2,
          transactionMethod: 1,
          collectionTerms: '',
          receiptStatus: 0,
          totalAdvanceConfirmAmount: 0,
          totalReceivableAmount: 0
        },
        rules: {
          accountingSubjectId: { required: true, message: '请选择', trigger: 'change' },
          receivableDate: { required: true, message: '请选择', trigger: 'change' },
          receivableTotalPrice: { required: true, message: '请输入', trigger: 'change' },
          // sourceType: { required: true, message: '请选择', trigger: 'change' },
          // contactId: { required: true, message: '请选择', trigger: 'change' },
          // projectId: { required: true, message: '请选择', trigger: 'change' },
          // orderId: { required: true, message: '请选择', trigger: 'change' },
          // dateType: { required: true, message: '请选择', trigger: 'change' },
          // year: { required: true, message: '请选择', trigger: 'change' },
          // quarter: { required: true, message: '请选择', trigger: 'change' },
          // month: { required: true, message: '请选择', trigger: 'change' },
          // dateTimeRange: {
          //   required: true,
          //   message: '请选择',
          //   trigger: 'change'
          // },
          // sourceId: { required: true, message: '请选择', trigger: 'change' },
          // contractId: { required: true, message: '请选择', trigger: 'change' },
          // queryDimension: {
          //   required: true,
          //   message: '请选择',
          //   trigger: 'change'
          // }
        },
        title: '',
        processSubmitDialogFlag: false,
        dialogType: '',
        businessId: ''
      };
    },
    computed: {
      // isNonDirectionalSale() {
      //   return this.datasource.some((item) => item.orderCategory == 4);
      // }
    },
    methods: {
      changeSubjectInfo(val) {
        const { code, name } = this.$refs.treeSelect.getNodeByValue(val);
        this.dataForm.accountingSubjectCode = code;
        this.dataForm.accountingSubjectName = name;
      },
      //获取分类管理中的数据
      async getClassifyList(id, listName) {
        let res = await getTreeByPid(id);
        this[listName] = res.data;
      },
      handleTotalChange(total) {
        this.dataForm.amountTotalPrice = total;
      },
      handleCountChange(count) {
        this.dataForm.totalStatementCount = count;
      },
      // 新增预收款：打开预收款选择弹窗
      addAdvanceReceipt() {
        this.$refs.advanceReceiptSelectRef.open();
      },
      // 预收款选择器回调：将选中的预收款映射为应收信息行
      onAdvanceReceiptSelected(row) {
        this.receivableList.push({
          saleOrderNo: row.saleOrderNo || '',
          advanceReceiptCode: row.advanceReceiptCode || '',
          fundTypeName: this.fundTypeLabel(row.fundType),
          unConfirmAmount: +row.unConfirmAmount || 0,
          // 本次对账预收款确收金额上限取「未对账确收金额」
          statementAmount: +row.unConfirmAmount || 0,
          currentConfirmAmount: 0,
          currentReceivableAmount: 0
        });
      },
      fundTypeLabel(val) {
        const item = (this.paymentTypeOp || []).find((i) => i.value === val);
        return item ? item.label : val != null && val !== '' ? String(val) : '';
      },
      async open(dialogType, row, type = '') {
        this.dialogType = dialogType;
        this.title =
          dialogType == 'add'
            ? '新增'
            : dialogType == 'update'
            ? '修改'
            : '详情';
        // this.dataForm.type = type;
        await this.getClassifyList(24, 'accountingSubjectList');
        // this.$nextTick(() => {
        //   if (this.contactData.id) {
        //     this.$refs.saleFormRef.getCusInfo(this.contactData);
        //   }
        //   if (this.saleOrderData.id) {
        //     this.$refs.saleFormRef.getOrderInfo(this.saleOrderData);
        //   }
        // });
        if (this.dialogType !== 'add') {
          this.businessId = row.id;
          this.getInfo(row);
        } else {
          let data = await getFinReceivableInitInfoAPI({
            statementId: row.id
          });

          this.dataForm = {
            ...this.dataForm,
            ...data,
            invoiceCategory: Number(data?.invoiceCategory) || 1
          };

          this.statReceipt = data.statReceipt || null;

          this.receivableList =
          (data.statReceipt && data.statReceipt.statReceiptDetailList) || [];

          this.datasource = data.productList || [];


          console.log('data~~~~~~~', data);
        }
      },
      // 应收
      // handleAddReceivable(type, row) {
      //   this.addReceivableDialogFlag = true;
      //   this.$nextTick(() => {
      //     this.$refs.addReceivableDialogRef.open(type, row);
      //   });
      // },
      //获取对账单详情
      async getInfo(row) {
        let data = await getFinReceivableInfoAPI(row.id);
        console.log('getInfo~~~', data);

        this.dataForm = {
          ...this.dataForm,
          ...data,
          invoiceCategory: Number(data?.invoiceCategory) || 1
        };

        this.statReceipt = data.statReceipt || null;

        this.receivableList =
        (data.statReceipt && data.statReceipt.statReceiptDetailList) || [];

        this.datasource = data.productList || [];
        // this.recorpayList = data.recorpayList || [];
        // 解决小数精度丢失问题，使用分进行计算
        // data.orderTotalAmount =
        //   data.orderList.reduce(
        //     (pre, cur) => pre + Math.round(+cur.orderAmount * 100),
        //     0
        //   ) / 100;
        // data.amountTotalPrice =
        //   data.orderList.reduce(
        //     (pre, cur) => pre + Math.round(+cur.statementAmount * 100),
        //     0
        //   ) / 100;
        // data.amountCompletePrice =
        //   data.orderList.reduce(
        //     (pre, cur) => pre + Math.round(+cur.statementedAmount * 100),
        //     0
        //   ) / 100;
        // data.amountUnCompletePrice =
        //   data.orderList.reduce(
        //     (pre, cur) => pre + Math.round(+cur.unStatementAmount * 100),
        //     0
        //   ) / 100;
        // data.orderList = data.orderList.map((item) => {
        //   item.deliveryProducts = item.deliveryProducts.map((i) => {
        //     return {
        //       ...i,
        //       taxRate: i.taxRate || 0,
        //       discountRatio: i.discountRatio || 100,
        //       singlePrice: i.singlePrice || 0,
        //       originalTotalCount: i.totalCount // 保存原始数量值用于校验
        //     };
        //   });
        //   return item;
        // });
        // this.datasource = data.orderList || [];
        // this.receivableList = data.receivableList || [];
        // this.dataForm = {
        //   ...this.dataForm,
        //   ...data,
        //   fundType: data.fundType || 2,
        //   transactionMethod: data.transactionMethod || 1,
        //   collectionTerms: data.collectionTerms || '',
        //   receiptStatus: data.receiptStatus || 0,
        //   totalAdvanceConfirmAmount: data.totalAdvanceConfirmAmount || 0,
        //   totalReceivableAmount: data.totalReceivableAmount || 0
        // };
        // switch (this.dataForm.dateType) {
        //   case 1:
        //     // this.dataForm.year = this.dataForm.dateValue;
        //     this.$set(this.dataForm, 'year', this.dataForm.dateValue);
        //     break;
        //   case 2: {
        //     //2023年-四季度
        //     let data = this.dataForm.dateValue.split('年-');

        //     this.$set(this.dataForm, 'year', data[0]);
        //     this.$set(this.dataForm, 'quarter', data[1]);
        //     break;
        //   }
        //   case 3:
        //     this.$set(this.dataForm, 'month', this.dataForm.dateValue);

        //     break;
        //   default:
        //     this.dataForm.dateValue = '';
        //     this.$set(this.dataForm, 'dateTimeRange', [
        //       this.dataForm.startDate,
        //       this.dataForm.endDate
        //     ]);
        // }
        this.$forceUpdate();
      },
      //关闭弹窗
      cancel() {
        this.$emit('update:visible', false);
      },
      //查询获取订单数据
      async handleSearch(params) {
        // console.log('this.$refs.inventoryTableRef~~~', this.$refs.inventoryTableref);
        let searchQuery = {
          endDate: params.endDate,
          sourceId: params.sourceId,
          sourceType: params.sourceType,
          startDate: params.startDate,
          queryDimension: params.queryDimension,
          type: 1
        };

        // const searchQuery = ["SALES20251225007","SALES20251225005","SALES20251225009"];
        this.loading = true;
        try {
          let data = await getStatementRecordListAPI(searchQuery);
          console.log(data, 'data');
          this.loading = false;
          data = data.map((item) => {
            item.deliveryProducts = item.deliveryProducts.map((i) => {
              return {
                ...i,
                taxRate: i.taxRate || 0,
                discountRatio: i.discountRatio || 100,
                singlePrice: i.singlePrice || 0,
                originalTotalCount: i.totalCount // 保存原始数量值用于校验
              };
            });
            return item;
          });
          this.datasource = data || [];

          console.log(this.datasource, 'this.datasource~~~');
          // this.recorpayList = data.recorpayList || [];
          this.dataForm = {
            ...this.dataForm,
            // amountPayablePrice: data.amountPayablePrice,
            // amountReceivablePrice: data.amountReceivablePrice,
            // amountTotalPrice: data.amountTotalPrice,
            // amountPayablePass: data.amountPayablePass,
            // amountReceivablePass: data.amountReceivablePass
            orderTotalAmount:
              data.reduce(
                (pre, cur) => pre + Math.round(+cur.orderAmount * 100),
                0
              ) / 100,
            amountTotalPrice:
              data.reduce(
                (pre, cur) => pre + Math.round(+cur.statementAmount * 100),
                0
              ) / 100,
            amountCompletePrice:
              data.reduce(
                (pre, cur) => pre + Math.round(+cur.statementedAmount * 100),
                0
              ) / 100,
            amountUnCompletePrice:
              data.reduce(
                (pre, cur) => pre + Math.round(+cur.unStatementAmount * 100),
                0
              ) / 100
          };
          this.$forceUpdate();
        } catch (error) {
          this.loading = false;
        }
        // if (!this.datasource.length) this.$message.warning('暂无订单信息');
      },
      //保存
      async save(is) {
        if (!this.datasource.length)
          return this.$message.warning('暂无对账信息');

        try {
          // 校验明细表与应收信息表单
          await this.$refs.accountDetailTableRef.getValidForm();
          await this.$refs.receivableInfoRef.validate();
          console.log(this.dialogType, 'this.dialogType~~~');
          let api =
            this.dialogType == 'add'
              ? saveReceivableAPI
              : updateReceivableAPI;
          // const totalAdvanceConfirmAmount =
          //   this.receivableList.reduce(
          //     (pre, cur) =>
          //       pre + Math.round((+cur.currentConfirmAmount || 0) * 100),
          //     0
          //   ) / 100;
          // const totalReceivableAmount =
          //   Math.round(
          //     ((+this.dataForm.amountTotalPrice || 0) -
          //       totalAdvanceConfirmAmount) *
          //       100
          //   ) / 100;
          let params = {
            ...this.dataForm,
            // totalAdvanceConfirmAmount,
            // totalReceivableAmount,
            productList: this.datasource,
            statReceipt: this.statReceipt
            // recorpayList: this.recorpayList
          };
          this.saveLoading = true;
          let data = await api(params);
          if (is == 'sub') {
            await this.submitApprove(data);
            return;
            // await submitAccountStatementApproveAPI({
            //   businessId: data,
            //   type: this.dataForm.type
            // });
          }
          this.$message.success('操作成功');
          this.reload();
          this.saveLoading = false;
        } catch (error) {
          console.error('保存失败:', error);
          // 错误提示已经在 getValidForm 方法中处理
          this.saveLoading = false;
        }
      },
      async submitApprove(res) {
        console.log(res, 'res~~~');
        console.log(this.businessId || res, 'this.businessId || res');
        const data = await getFinReceivableInfoAPI(this.businessId || res);
        console.log(data, 'data~~~');
        this.processSubmitDialogFlag = true;
        this.$nextTick(() => {
          let params = {
            businessId: data.id,
            businessKey: 'fin_receivable_approve',
            formCreateUserId: data.createUserId,
            variables: {
              businessCode: data.code,
              businessName: data.contactName,
              businessType: '应收'
            }
          };
          this.$refs.processSubmitDialogRef.init(params);
        });
      },
      reload() {
        this.cancel();
        //刷新主页面
        this.$emit('done');
      }
    }
  };
</script>
<style scoped lang="scss">
  ::v-deep.el-divider {
    margin: 10px;
    font-weight: bold;
  }
</style>