From a9c3543f4b4fa5a092a8dea688aedc2b2adbd576 Mon Sep 17 00:00:00 2001
From: 曹睿 <360930172@qq.com>
Date: 星期二, 24 六月 2025 17:34:50 +0800
Subject: [PATCH] feat: 【来票台账】显示附件

---
 src/views/procurementManagement/invoiceEntry/components/Modal.vue |  408 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 408 insertions(+), 0 deletions(-)

diff --git a/src/views/procurementManagement/invoiceEntry/components/Modal.vue b/src/views/procurementManagement/invoiceEntry/components/Modal.vue
new file mode 100644
index 0000000..1fd32e9
--- /dev/null
+++ b/src/views/procurementManagement/invoiceEntry/components/Modal.vue
@@ -0,0 +1,408 @@
+<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-row :gutter="30">
+        <el-col :span="12">
+          <el-form-item label="閲囪喘鍚堝悓鍙凤細" prop="purchaseLedgerNo">
+            <el-input v-model="form.purchaseLedgerNo" disabled />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesContractNo">
+            <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-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="椤圭洰鍚嶇О锛�" prop="projectName">
+            <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-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
+              :disabled="true"
+            />
+          </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-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-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"
+            />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="浜у搧淇℃伅锛�" prop="entryDate"> </el-form-item>
+      <PIMTable
+        rowKey="id"
+        :column="columns"
+        :tableData="form.productData"
+        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)"
+          />
+        </template>
+        <template #ticketsAmountRef="{ 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>
+    <template #footer>
+      <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button>
+      <el-button type="primary" :loading="modalLoading" @click="submitForm">
+        {{ modalOptions.confirmText }}
+      </el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, getCurrentInstance } from "vue";
+import { useModal } from "@/hooks/useModal";
+import useFormData from "@/hooks/useFormData";
+import FileUpload from "@/components/Upload/FileUpload.vue";
+import {
+  getPurchaseNoById,
+  getInfo,
+  addOrUpdateRegistration,
+} from "@/api/procurementManagement/invoiceEntry.js";
+import { getPurchaseById } from "@/api/procurementManagement/procurementLedger.js";
+import { getToken } from "@/utils/auth";
+import useUserStore from "@/store/modules/user";
+
+defineOptions({
+  name: "鏉ョエ鐧昏妯℃�佹",
+});
+
+const userStore = useUserStore();
+const action = import.meta.env.VITE_APP_BASE_API + "/file/upload";
+const formRef = ref();
+const { proxy } = getCurrentInstance();
+const { form } = useFormData({
+  purchaseLedgerNo: undefined, // 閲囪喘鍚堝悓鍙�
+  salesContractNo: undefined, // 閿�鍞悎鍚屽彿
+  supplierName: undefined, // 渚涘簲鍟嗗悕绉�
+  projectName: undefined, // 椤圭洰鍚嶇О
+  invoiceNumber: undefined, // 鍙戠エ鍙�
+  invoiceAmount: undefined, // 鍙戠エ閲戦(鍏�)
+  issUerId: userStore.id, // 褰曞叆浜�
+  issUer: userStore.nickName, // 褰曞叆浜�
+  entryDate: undefined, // 寮�绁ㄦ棩鏈�
+  salesContractNoId: undefined, // 寮�绁ㄦ棩鏈�
+  productData: [], // 琛ㄦ牸
+  tempFileIds: [], // 鏂囦欢
+});
+
+const rules = ref({
+  invoiceNumber: [
+    { required: true, message: "璇疯緭鍏ュ彂绁ㄥ彿", trigger: "blur" },
+    { type: "string" },
+  ],
+  invoiceAmount: [
+    { required: true, message: "璇疯緭鍏ュ彂绁ㄩ噾棰�", trigger: "blur" },
+  ],
+});
+
+const {
+  id,
+  visible,
+  loading: modalLoading,
+  openModal,
+  modalOptions,
+  handleConfirm,
+  closeModal,
+} = useModal({
+  title: "鏉ョエ鐧昏",
+});
+
+const columns = [
+  {
+    label: "浜у搧澶х被",
+    prop: "productCategory",
+  },
+  {
+    label: "瑙勬牸鍨嬪彿",
+    prop: "specificationModel",
+  },
+  {
+    label: "鍗曚綅",
+    prop: "unit",
+    width: 80,
+  },
+  {
+    label: "鏁伴噺",
+    prop: "quantity",
+    width: 80,
+  },
+  {
+    label: "绋庣巼(%)",
+    prop: "taxRate",
+    width: 80,
+  },
+  {
+    label: "褰曞叆鏃ユ湡",
+    prop: "registerDate",
+    width: 120,
+  },
+  {
+    label: "鍚◣鍗曚环(鍏�)",
+    prop: "taxInclusiveUnitPrice",
+    width: 150,
+    formatData: (val) => {
+      return parseFloat(val).toFixed(2) ?? 0;
+    },
+  },
+  {
+    label: "鍚◣鎬讳环(鍏�)",
+    prop: "taxInclusiveTotalPrice",
+    width: 150,
+    formatData: (val) => {
+      return parseFloat(val).toFixed(2) ?? 0;
+    },
+  },
+  {
+    label: "涓嶅惈绋庢�讳环(鍏�)",
+    prop: "taxExclusiveTotalPrice",
+    width: 150,
+    formatData: (val) => {
+      return parseFloat(val).toFixed(2) ?? 0;
+    },
+  },
+  {
+    label: "鏈鏉ョエ鏁�",
+    prop: "ticketsNum",
+    dataType: "slot",
+    slot: "ticketsNumRef",
+    width: 180,
+    align: "center",
+  },
+  {
+    label: "鏈鏉ョエ閲戦(鍏�)",
+    prop: "ticketsAmount",
+    dataType: "slot",
+    slot: "ticketsAmountRef",
+    width: 180,
+    align: "center",
+  },
+  {
+    label: "鏈潵绁ㄦ暟",
+    prop: "futureTickets",
+  },
+  {
+    label: "鏈潵绁ㄩ噾棰�(鍏�)",
+    prop: "futureTicketsAmount",
+  },
+];
+
+const getTableData = async (type, id) => {
+  if (type == "add") {
+    const { data } = await getPurchaseNoById({ id });
+    form.purchaseLedgerNo = data.purchaseContractNumber;
+    form.invoiceAmount = data.invoiceAmount;
+    form.invoiceNumber = data.invoiceNumber;
+    form.entryDate = data.entryDate;
+    form.salesContractNoId = data.salesContractNoId;
+
+    const { data: infoData } = await getInfo({ id });
+    form.salesContractNo = infoData.salesContractNo;
+    form.projectName = infoData.projectName;
+    form.supplierName = infoData.supplierName;
+    form.productData = infoData.productData;
+  } else if (type == "edit") {
+    const data = await getPurchaseById({ id, type: 2 });
+    form.purchaseLedgerNo = data.purchaseContractNumber;
+    form.invoiceAmount = data.invoiceAmount;
+    form.invoiceNumber = data.invoiceNumber;
+    form.salesContractNo = data.salesContractNo;
+    form.projectName = data.projectName;
+    form.supplierName = data.supplierName;
+    form.entryDate = data.entryDate;
+    form.productData = data.productData;
+  }
+};
+
+//鏈鏉ョエ鏁板け鐒︽搷浣�
+const invoiceNumBlur = (row) => {
+  if (!row.ticketsNum || row.ticketsNum === "") {
+    row.ticketsNum = 0;
+  }
+  if (Number(row.ticketsNum) > Number(row.tempFutureTickets)) {
+    proxy.$modal.msgWarning("鏈寮�绁ㄦ暟涓嶅緱澶т簬鏈紑绁ㄦ暟");
+    row.ticketsNum = 0;
+    return;
+  }
+  // 璁$畻鏈鏉ョエ閲戦
+  row.ticketsAmount = row.ticketsNum * row.taxInclusiveUnitPrice;
+  // 璁$畻鏈潵绁ㄦ暟
+  row.futureTickets = row.tempFutureTickets - row.ticketsNum;
+  // 璁$畻鏈潵绁ㄩ噾棰�
+  row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount;
+  calculateinvoiceAmount();
+};
+
+// 鏈鏉ョエ閲戦澶辩劍鎿嶄綔
+const invoiceAmountBlur = (row) => {
+  if (!row.ticketsAmount) {
+    row.ticketsAmount = 0;
+  }
+  // 璁$畻鏄惁瓒呰繃鏉ョエ鎬婚噾棰�
+  if (row.ticketsAmount > row.tempFutureTicketsAmount) {
+    proxy.$modal.msgWarning("鏈鏉ョエ閲戦涓嶅緱澶т簬鏈潵绁ㄩ噾棰�");
+    row.ticketsAmount = 0;
+  }
+  // 璁$畻鏈鏉ョエ鏁�
+  row.ticketsNum = Number(
+    (row.ticketsAmount / row.taxInclusiveUnitPrice).toFixed(2)
+  );
+  // 璁$畻鏈潵绁ㄦ暟
+  row.futureTickets = row.tempFutureTickets - row.ticketsNum;
+  // 璁$畻鏈潵绁ㄩ噾棰�
+  row.futureTicketsAmount = row.tempFutureTicketsAmount - row.ticketsAmount;
+  calculateinvoiceAmount();
+};
+
+const calculateinvoiceAmount = () => {
+  let invoiceAmountTotal = 0;
+  form.productData.forEach((item) => {
+    if (item.ticketsAmount) {
+      invoiceAmountTotal += item.ticketsAmount;
+    }
+  });
+  form.invoiceAmount = invoiceAmountTotal.toFixed(2);
+};
+
+const open = (type, eid) => {
+  openModal();
+  getTableData(type, eid);
+  id.value = eid;
+};
+
+const uploadSuccess = (response) => {
+  form.tempFileIds.push(response.data.tempId);
+  console.log(form);
+};
+
+const removeFile = (file) => {
+  const { tempId } = file.response.data;
+  form.tempFileIds = form.tempFileIds.filter((item) => item !== tempId);
+};
+
+const submitForm = () => {
+  formRef.value.validate(async (valid, fields) => {
+    if (valid) {
+      modalLoading.value = true;
+      const { code } = await addOrUpdateRegistration({
+        purchaseLedgerId: id.value,
+        purchaseContractNumber: form.purchaseLedgerNo,
+        invoiceNumber: form.invoiceNumber,
+        invoiceAmount: form.invoiceAmount,
+        salesContractNo: form.salesContractNo,
+        projectName: form.projectName,
+        productData: form.productData,
+        issUerId: form.issUerId, // 褰曞叆浜�
+        issUer: form.issUer, // 褰曞叆浜�
+        salesContractNoId: form.salesContractNoId,
+        supplierName: form.supplierName,
+        tempFileIds: form.tempFileIds,
+        type: 4,
+      });
+      modalLoading.value = false;
+      if (code == 200) {
+        closeModal();
+      }
+    }
+  });
+};
+
+defineExpose({
+  open,
+});
+</script>
+
+<style lang="scss" scoped></style>

--
Gitblit v1.9.3