spring
3 天以前 fd3e3b19aaf23c4f68d8b98d514499510b152e39
src/views/procurementManagement/invoiceEntry/components/Modal.vue
@@ -1,6 +1,12 @@
<template>
  <el-dialog :title="modalOptions.title" v-model="visible" width="70%">
    <el-form ref="formRef" :model="form" :rules="rules" label-width="120px" label-position="top">
    <el-form
      ref="formRef"
      :model="form"
      :rules="rules"
      label-width="120px"
      label-position="top"
    >
      <el-row :gutter="30">
        <el-col :span="12">
          <el-form-item label="采购合同号:" prop="purchaseLedgerNo">
@@ -9,61 +15,129 @@
        </el-col>
        <el-col :span="12">
          <el-form-item label="销售合同号:" prop="salesContractNo">
            <el-input v-model="form.salesContractNo" placeholder="自动填充" clearable disabled />
            <el-input
              v-model="form.salesContractNo"
              placeholder="自动填充"
              clearable
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="供应商名称:" prop="supplierName">
            <el-input v-model="form.supplierName" placeholder="自动填充" clearable disabled />
            <el-input
              v-model="form.supplierName"
              placeholder="自动填充"
              clearable
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目名称:" prop="projectName">
            <el-input v-model="form.projectName" placeholder="自动填充" clearable disabled />
            <el-input
              v-model="form.projectName"
              placeholder="自动填充"
              clearable
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="发票号:" prop="invoiceNumber">
            <el-input v-model="form.invoiceNumber" placeholder="请输入" clearable />
            <el-input
              v-model="form.invoiceNumber"
              placeholder="请输入"
              clearable
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="发票金额(元):" prop="invoiceAmount">
            <el-input type="number" :step="0.01" :min="0" v-model="form.invoiceAmount" placeholder="自动填充" clearable />
            <el-input-number :step="0.01" :min="0" style="width: 100%"
              v-model="form.invoiceAmount"
              placeholder="自动填充"
              clearable
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="录入人:" prop="issUer">
            <el-input v-model="form.issUer" placeholder="请输入" clearable disabled />
            <el-input
              v-model="form.issUer"
              placeholder="请输入"
              clearable
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="开票日期:" prop="entryDate">
            <el-date-picker style="width: 100%" v-model="form.entryDate" type="date" clearable />
            <el-date-picker
              style="width: 100%"
              v-model="form.entryDate"
              type="date"
              clearable
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="上传附件">
            <FileUpload :showTip="false" accept="*" :autoUpload="true" :action="action" :headers="{
              Authorization: 'Bearer ' + getToken(),
            }" :limit="10" @success="uploadSuccess" @remove="removeFile" />
            <FileUpload
              :showTip="false"
              accept="*"
              :autoUpload="true"
              :action="action"
              :headers="{
                Authorization: 'Bearer ' + getToken(),
              }"
              :limit="10"
              @success="uploadSuccess"
              @remove="removeFile"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="录入日期:" prop="enterDate">
            <el-date-picker style="width: 100%" v-model="form.enterDate" type="date" clearable />
            <el-date-picker
              style="width: 100%"
              v-model="form.enterDate"
              type="date"
              clearable
            />
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="产品信息:"> </el-form-item>
      <PIMTable rowKey="id" :column="columns" :tableData="form.productData" height="auto">
      <PIMTable
        rowKey="id"
        :column="columns"
        :tableData="form.productData"
            :summaryMethod="summarizeChildrenTable"
            :isShowSummary="true"
        height="auto"
      >
        <template #ticketsNumRef="{ row }">
          <el-input-number v-model="row.ticketsNum" placeholder="请选择" :min="0" :step="0.1" clearable style="width: 100%"
            @change="invoiceNumBlur(row)" />
          <el-input-number
            v-model="row.ticketsNum"
            placeholder="请输入"
            :min="0"
            :step="0.1"
            clearable
            style="width: 100%"
            @change="invoiceNumBlur(row)"
          />
        </template>
        <template #ticketsAmountRef="{ row }">
          <el-input-number v-model="row.ticketsAmount" placeholder="请选择" :min="0" :step="0.1" clearable
            style="width: 100%" @change="invoiceAmountBlur(row)" />
          <el-input-number
            v-model="row.ticketsAmount"
            placeholder="请输入"
            :min="0"
            :step="0.1"
            clearable
            style="width: 100%"
            @change="invoiceAmountBlur(row)"
          />
        </template>
      </PIMTable>
    </el-form>
@@ -78,6 +152,7 @@
<script setup>
import { ref, getCurrentInstance } from "vue";
import { defineEmits } from 'vue';
import { useModal } from "@/hooks/useModal";
import useFormData from "@/hooks/useFormData";
import FileUpload from "@/components/Upload/FileUpload.vue";
@@ -138,6 +213,8 @@
} = useModal({
  title: "来票登记",
});
const emit = defineEmits(['refreshList']);
const columns = [
  {
@@ -211,10 +288,12 @@
  {
    label: "未来票数",
    prop: "futureTickets",
      width: 100,
  },
  {
    label: "未来票金额(元)",
    prop: "futureTicketsAmount",
      width: 200,
  },
];
@@ -244,7 +323,19 @@
    form.productData = data.productData;
  }
};
// 子表合计方法
const summarizeChildrenTable = (param) => {
   return proxy.summarizeTable(param, [
      "taxInclusiveUnitPrice",
      "taxInclusiveTotalPrice",
      "taxExclusiveTotalPrice",
      "ticketsNum",
      "ticketsAmount",
      "ticketsAmountRef",
      "futureTickets",
      "futureTicketsAmount",
   ]);
};
//本次来票数失焦操作
const invoiceNumBlur = (row) => {
  if (!row.ticketsNum || row.ticketsNum === "") {
@@ -256,11 +347,11 @@
    return;
  }
  // 计算本次来票金额
  row.ticketsAmount = row.ticketsNum * row.taxInclusiveUnitPrice;
  row.ticketsAmount = (row.ticketsNum * row.taxInclusiveUnitPrice).toFixed(2)
  // 计算未来票数
  row.futureTickets = row.tempFutureTickets - row.ticketsNum;
  row.futureTickets = (row.tempFutureTickets - row.ticketsNum).toFixed(2)
  // 计算未来票金额
  row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount;
  row.futureTicketsAmount = (row.tempFutureTicketsAmount - row.ticketsAmount).toFixed(2)
  calculateinvoiceAmount();
};
@@ -279,9 +370,9 @@
    (row.ticketsAmount / row.taxInclusiveUnitPrice).toFixed(2)
  );
  // 计算未来票数
  row.futureTickets = row.tempFutureTickets - row.ticketsNum;
  row.futureTickets = (row.tempFutureTickets - row.ticketsNum).toFixed(2)
  // 计算未来票金额
  row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount;
  row.futureTicketsAmount = (row.tempFutureTicketsAmount - row.ticketsAmount).toFixed(2)
  calculateinvoiceAmount();
};
@@ -289,7 +380,7 @@
  let invoiceAmountTotal = 0;
  form.productData.forEach((item) => {
    if (item.ticketsAmount) {
      invoiceAmountTotal += item.ticketsAmount;
      invoiceAmountTotal += Number(item.ticketsAmount);
    }
  });
  form.invoiceAmount = invoiceAmountTotal.toFixed(2);
@@ -309,6 +400,11 @@
const removeFile = (file) => {
  const { tempId } = file.response.data;
  form.tempFileIds = form.tempFileIds.filter((item) => item !== tempId);
};
const closeAndRefresh = () => {
  closeModal();
  emit('refreshList');
};
const submitForm = () => {
@@ -334,7 +430,7 @@
      });
      modalLoading.value = false;
      if (code == 200) {
        closeModal();
        closeAndRefresh();
      }
    } else {
      modalLoading.value = false;
@@ -344,6 +440,7 @@
defineExpose({
  open,
  closeAndRefresh,
});
</script>