来票登记，开票登记一些计算问题(后端接口未完善)

zhangwencui

12 小时以前 a4203d1c0e24a69b3de3a4cf9f3cb1d727602224

 src/views/procurementManagement/invoiceEntry/index.vue

@@ -1,18 +1,30 @@
<template>
  <div class="app-container">
    <div class="search_form">
      <el-form :model="filters" :inline="true">
        <el-form-item label="采购合同号：">
          <el-input
            v-model="filters.purchaseContractNumber"
            placeholder="请输入"
            clearable
            prefix-icon="Search"
            @change="getTableData"
          />
      <el-form :model="filters"
               :inline="true">
        <el-form-item label="供应商名称">
          <el-input v-model="filters.supplierName"
                    placeholder="请输入名称搜索"
                    clearable
                    prefix-icon="Search"
                    @change="getTableData" />
        </el-form-item>
        <el-form-item label="采购订单号：">
          <el-input v-model="filters.purchaseContractNumber"
                    placeholder="请输入"
                    clearable
                    prefix-icon="Search"
                    @change="getTableData" />
        </el-form-item>
        <el-form-item label="销售合同号">
          <el-input v-model="filters.salesContractNo"
                    placeholder="请输入销售合同号"
                    clearable />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="getTableData"> 搜索 </el-button>
          <el-button type="primary"
                     @click="getTableData"> 搜索 </el-button>
          <el-button @click="resetFilters"> 重置 </el-button>
        </el-form-item>
      </el-form>
@@ -21,165 +33,269 @@
      <div class="actions">
        <div></div>
        <div>
          <el-button type="primary" @click="handleAdd('add')">
          <el-button @click="handleExport"
                     style="margin-right: 10px">导出</el-button>
          <el-button type="primary"
                     @click="handleAdd('add')">
            新增登记
          </el-button>
          <el-button @click="handleOut">导出</el-button>
          <el-button type="danger" plain @click="handleDelete">删除</el-button>
          <!--          <el-button type="danger" plain @click="handleDelete">删除</el-button>-->
        </div>
      </div>
      <PIMTable
        rowKey="id"
        :column="columns"
        :tableData="dataList"
        :tableLoading="loading"
        :isSelection="true"
        :page="{
      <PIMTable rowKey="id"
                :column="columns"
                :tableData="dataList"
                :tableLoading="loading"
                :isSelection="true"
                :page="{
          current: pagination.currentPage,
          size: pagination.pageSize,
          total: pagination.total,
        }"
        :expand-row-keys="expandRowKeys"
        @expand-change="expandChange"
        @selection-change="handleSelectionChange"
      >
                :expand-row-keys="expandRowKeys"
                :summaryMethod="summarizeMainTable"
                :isShowSummary="true"
                @expand-change="expandChange"
                @selection-change="handleSelectionChange"
                @pagination="changePage">
        <template #expand="{ row }">
          <ExpandTable ref="expandTableRef" />
        </template>
        <template #operation="{ row }">
          <el-button
            text
            type="primary"
            size="small"
            @click="handleEdit('edit', row.id)"
          >
          <el-button text
                     type="primary"
                     size="small"
                     @click="handleEdit('edit', row.id)">
            编辑
          </el-button>
        </template>
      </PIMTable>
    </div>
    <Modal ref="modalRef"></Modal>
    <Modal ref="modalRef"
           @refreshList="getTableData"></Modal>
  </div>
</template>

<script setup>
import { usePaginationApi } from "@/hooks/usePaginationApi";
import { gePurchaseListPage } from "@/api/procurementManagement/invoiceEntry.js";
import { nextTick, onMounted, getCurrentInstance } from "vue";
import ExpandTable from "./components/ExpandTable.vue";
import Modal from "./components/Modal.vue";
  import { usePaginationApi } from "@/hooks/usePaginationApi";
  import {
    delRegistration,
    gePurchaseListPage,
  } from "@/api/procurementManagement/invoiceEntry.js";
  import { nextTick, onMounted, getCurrentInstance, ref } from "vue";
  import ExpandTable from "./components/ExpandTable.vue";
  import Modal from "./components/Modal.vue";
  import { ElMessageBox } from "element-plus";

defineOptions({
  name: "来票登记",
});
  defineOptions({
    name: "来票登记",
  });

const { proxy } = getCurrentInstance();
const expandRowKeys = ref([]);
const expandTableRef = ref();
const modalRef = ref();
const selectedRows = ref([]);
  const { proxy } = getCurrentInstance();
  const expandRowKeys = ref([]);
  const expandTableRef = ref();
  const modalRef = ref();
  const selectedRows = ref([]);

const {
  loading,
  filters,
  columns,
  dataList,
  pagination,
  getTableData,
  resetFilters,
} = usePaginationApi(
  gePurchaseListPage,
  {
    purchaseContractNumber: undefined,
  },
  [
  const {
    loading,
    filters,
    columns,
    dataList,
    pagination,
    getTableData,
    resetFilters,
    onCurrentChange,
  } = usePaginationApi(
    gePurchaseListPage,
    {
      type: "expand",
      dataType: "slot",
      slot: "expand",
      purchaseContractNumber: undefined,
    },
    {
      label: "销售合同号",
      prop: "salesContractNo",
    },
    {
      label: "供应商名称",
      prop: "supplierName",
    },
    {
      label: "项目名称",
      prop: "projectName",
    },
    {
      label: "合同金额(元)",
      prop: "contractAmount",
      formatData: (val) => {
        return val ? parseFloat(val).toFixed(2) : 0;
    [
      {
        type: "expand",
        dataType: "slot",
        slot: "expand",
      },
    },
    {
      label: "已开票金额(元)",
      prop: "receiptPaymentAmount",
      formatData: (val) => {
        return val ? parseFloat(val).toFixed(2) : 0;
      {
        label: "采购订单号",
        prop: "purchaseContractNumber",
        width: 150,
      },
    },
    {
      label: "待开票金额(元)",
      prop: "unReceiptPaymentAmount",
      formatData: (val) => {
        return val ? parseFloat(val).toFixed(2) : 0;
      {
        label: "销售合同号",
        prop: "salesContractNo",
        width: 150,
      },
    },
    // {
    //   fixed: "right",
    //   label: "操作",
    //   dataType: "slot",
    //   slot: "operation",
    //   align: "center",
    //   width: "200px",
    // },
  ]
);

const handleSelectionChange = (selection) => {
  selectedRows.value = selection.filter(
    (item) => item.purchaseContractNumber !== undefined
      {
        label: "供应商名称",
        prop: "supplierName",
        width: 300,
      },
      {
        label: "录入人",
        prop: "recorderName",
      },
      {
        label: "录入日期",
        prop: "entryDate",
        width: 110,
      },
      {
        label: "合同金额(元)",
        prop: "contractAmount",
        width: 200,
        formatData: val => {
          return val ? parseFloat(val).toFixed(2) : 0;
        },
      },
      {
        label: "已来票金额(元)",
        prop: "receiptPaymentAmount",
        width: 200,
        formatData: val => {
          return val ? parseFloat(val).toFixed(2) : 0;
        },
      },
      {
        label: "待来票金额(元)",
        prop: "unReceiptPaymentAmount",
        width: 200,
        formatData: val => {
          return val ? parseFloat(val).toFixed(2) : 0;
        },
      },
      // {
      //   fixed: "right",
      //   label: "操作",
      //   dataType: "slot",
      //   slot: "operation",
      //   align: "center",
      //   width: "200px",
      // },
    ]
  );
};
  // 计算属性过滤 审批通过approvalStatus=1 的数据
  // const filteredDataList = computed(() => {
  //   // return dataList.value.filter(item => item.approvalStatus == 1);
  //   return dataList;
  // });
  const handleSelectionChange = selection => {
    selectedRows.value = selection.filter(
      item => item.purchaseContractNumber !== undefined
    );
  };

const handleAdd = (type) => {
  if (selectedRows.value.length !== 1) {
    proxy.$modal.msgWarning("请先选中一条数据");
    return;
  }
  modalRef.value.open(type, selectedRows.value[0].id);
};
  const handleAdd = type => {
    if (selectedRows.value.length < 1) {
      proxy.$modal.msgWarning("请至少选中一条数据");
      return;
    }
    modalRef.value.open(type, selectedRows.value);
  };

const handleEdit = (type, id) => {
  modalRef.value.open(type, id);
};
  const handleEdit = (type, id) => {
    modalRef.value.open(type, id);
  };

const handleOut = () => {};
const handleDelete = () => {};
  // 导出
  const handleOut = () => {
    ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        proxy.download("/purchase/registration/export", {}, "来票登记.xlsx");
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
  };

const expandChange = async (row, expandedRows) => {
  await nextTick();
  expandTableRef.value.getList(row.id);
};
  // 导出采购台账
  const handleExport = () => {
    ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        proxy.download("/purchase/ledger/exportOne", {}, "来票登记.xlsx");
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
  };

onMounted(() => {
  getTableData();
});
  // 删除
  const handleDelete = () => {
    let ids = [];
    if (selectedRows.value.length > 0) {
      // 新增判断：如果有选中的数据没有ticketRegistrationId，提示并终止
      const noTicket = selectedRows.value.some(
        item => !item.ticketRegistrationId
      );
      if (noTicket) {
        proxy.$modal.msgWarning("采购台账还未进行来票登记,无法进行删除操作");
        return;
      }
      ids = selectedRows.value.map(item => item.ticketRegistrationId);
    } else {
      proxy.$modal.msgWarning("请选择数据");
      return;
    }
    ElMessageBox.confirm("选中的内容将被删除，是否确认删除？", "导出", {
      confirmButtonText: "确认",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        delRegistration(ids).then(res => {
          proxy.$modal.msgSuccess("删除成功");
          getList();
        });
      })
      .catch(() => {
        proxy.$modal.msg("已取消");
      });
  };

  const expandChange = async (row, expandedRows) => {
    if (expandedRows.length > 0) {
      await nextTick();
      expandTableRef.value.getList(row.id);
    }
  };

  const changePage = ({ page, limit }) => {
    pagination.currentPage = page;
    pagination.pageSize = limit;
    onCurrentChange(page);
  };
  // 主表合计方法
  const summarizeMainTable = param => {
    return proxy.summarizeTable(
      param,
      ["contractAmount", "receiptPaymentAmount", "unReceiptPaymentAmount"],
      {
        ticketsNum: { noDecimal: true }, // 不保留小数
        futureTickets: { noDecimal: true }, // 不保留小数
      }
    );
  };
  onMounted(() => {
    getTableData();
  });
</script>

<style lang="scss" scoped>
.table_list {
  margin-top: unset;
}
.actions {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
  .table_list {
    margin-top: unset;
  }
  .actions {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
  }
</style>