三项优化内容

zhangwencui

2026-04-07 3b0d62ccee6666c8e87470b333a19311e49547d1

 src/views/productionManagement/productionCosting/index.vue

@@ -1,21 +1,29 @@
<template>
   <div class="app-container">
      <el-row :gutter="16" class="content-row">
    <el-row :gutter="16"
            class="content-row">
         <!-- 左侧台账 + 顶部筛选 -->
         <el-col :xs="24" :sm="24" :md="24" :lg="8" :xl="8" class="left-col">
      <el-col :xs="24"
              :sm="24"
              :md="24"
              :lg="8"
              :xl="8"
              class="left-col">
            <div class="left-panel">
            <div class="left-header">
          <el-form :model="searchForm" inline>
            <el-form :model="searchForm"
                     inline>
            <el-form-item prop="dateType">
              <el-radio-group v-model="searchForm.dateType" size="small" @change="handleDateTypeChange">
                <el-radio-group v-model="searchForm.dateType"
                                size="small"
                                @change="handleDateTypeChange">
                <el-radio-button label="day">日</el-radio-button>
                <el-radio-button label="month">月</el-radio-button>
              </el-radio-group>
            </el-form-item>

            <el-form-item label="日期：" prop="dateRange">
              <el-date-picker
                  v-model="searchForm.dateRange"
              <el-form-item label="日期："
                            prop="dateRange">
                <el-date-picker v-model="searchForm.dateRange"
                  :type="searchForm.dateType === 'day' ? 'date' : 'daterange'"
                  range-separator="至"
                  start-placeholder="开始日期"
@@ -23,41 +31,40 @@
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                  style="width: 200px"
                  @change="handleDateRangeChange"
              />
                                @change="handleDateRangeChange" />
            </el-form-item>
          </el-form>
            </div>
            <PIMTable
               rowKey="id"
          <PIMTable rowKey="id"
               :column="leftTableColumn"
               :tableData="leftTableData"
               :tableLoading="tableLoading"
          :page="page"
          @row-click="handleLeftRowClick"
          @pagination="pagination"
        ></PIMTable>
                    @pagination="pagination"></PIMTable>
            </div>
         </el-col>

         <!-- 右侧明细 -->
         <el-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16" class="right-col">
      <el-col :xs="24"
              :sm="24"
              :md="24"
              :lg="16"
              :xl="16"
              class="right-col">
            <div class="right-panel">
				
               <el-form inline>
                  <el-form-item>
                     <el-button type="primary" @click="handleOut">导出</el-button>
              <el-button type="primary"
                         @click="handleOut">导出</el-button>
                  </el-form-item>
               </el-form>
               <PIMTable
                  rowKey="id"
          <PIMTable rowKey="id"
                  :column="tableColumn"
                  :tableData="tableData"
                  :page="page1"
                  :tableLoading="tableLoading1"
                  style="margin-right: 20px;"
                  @pagination="pagination1"
               ></PIMTable>
                    @pagination="pagination1"></PIMTable>
            </div>
         </el-col>
      </el-row>
@@ -68,7 +75,10 @@
import {onMounted, ref} from "vue";
import { ElMessageBox } from "element-plus";
import dayjs from "dayjs";
import {salesLedgerProductionAccountingListProductionDetails, salesLedgerProductionAccountingList} from "@/api/productionManagement/productionCosting.js";
  import {
    salesLedgerProductionAccountingListProductionDetails,
    salesLedgerProductionAccountingList,
  } from "@/api/productionManagement/productionCosting.js";
const { proxy } = getCurrentInstance();

const tableColumn = ref([
@@ -82,16 +92,16 @@
      prop: "schedulingUserName",
    minWidth: 100,
   },
   {
      label: "合同号",
      prop: "salesContractNo",
    minWidth: 100,
   },
   {
      label: "客户名称",
      prop: "customerName",
    minWidth: 100,
   },
    // {
    //    label: "合同号",
    //    prop: "salesContractNo",
    //   minWidth: 100,
    // },
    // {
    //    label: "客户名称",
    //    prop: "customerName",
    //   minWidth: 100,
    // },
   {
      label: "产品大类",
      prop: "productName",
@@ -140,21 +150,19 @@
      label: "产量",
      prop: "outputNum",
    minWidth: 100,

  },
   {
      label: "工资",
      prop: "wages",
    minWidth: 100,

   },
   {
      label: "合格率",
      prop: "outputRate",
    minWidth: 100,
    formatData: (val) => {
      if (val == null || val === '') return '-'
      return parseFloat(val).toFixed(2)
      formatData: val => {
        if (val == null || val === "") return "-";
        return parseFloat(val).toFixed(2);
    },
   },
]);
@@ -189,19 +197,19 @@
});
const { searchForm } = toRefs(data);

const pagination = (obj) => {
  const pagination = obj => {
   page.current = obj.page;
   page.size = obj.limit;
   getList();
};

const pagination1 = (obj) => {
  const pagination1 = obj => {
  page1.current = obj.page;
  page1.size = obj.limit;
   getList1();
};

const handleDateRangeChange = (value) => {
  const handleDateRangeChange = value => {
   if (value) {
    if (searchForm.value.dateType === "day") {
      searchForm.value.entryDate = value;
@@ -209,46 +217,46 @@
      searchForm.value.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
      searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
    }

   } else {
      searchForm.value.entryDate = undefined;
      searchForm.value.entryDateStart = undefined;
      searchForm.value.entryDateEnd = undefined;
   }
  reloadData()
    reloadData();
};

const getList = () => {
   tableLoading.value = true;
   const params = { ...searchForm.value, ...page };

  salesLedgerProductionAccountingList(params).then((res) => {
    salesLedgerProductionAccountingList(params)
      .then(res => {
      const records = res.data.records || [];
    leftTableData.value = records;
      page.total = res.data.total || 0;
   }).finally(() => {
    tableLoading.value = false;
  })



      .finally(() => {
        tableLoading.value = false;
      });
};

const getList1 = () => {
  tableLoading1.value = true;
  const params = { ...page1, ...searchForm.value };
  salesLedgerProductionAccountingListProductionDetails(params).then((res) => {
    tableData.value = res.data.records || [];;
    salesLedgerProductionAccountingListProductionDetails(params)
      .then(res => {
        tableData.value = res.data.records || [];
    page1.total = res.data.total || 0;
  }).finally(() => {
    tableLoading1.value = false;
  })
      .finally(() => {
        tableLoading1.value = false;
      });
};

// 构建左侧汇总台账（按生产人汇总产量、工资等）
const buildLeftTableData = (records) => {
  const buildLeftTableData = records => {
   const map = {};
   records.forEach((item) => {
    records.forEach(item => {
      const key = item.schedulingUserName || "未知";
      if (!map[key]) {
         map[key] = {
@@ -269,29 +277,34 @@
};

// 左侧日/月切换
const handleDateTypeChange = (value) => {
  const handleDateTypeChange = value => {
   // 这里只作为筛选条件的一部分，直接重新查询列表
  if (value === "day") {
    searchForm.value.entryDate = dayjs().format("YYYY-MM-DD");
    searchForm.value.dateRange = searchForm.value.entryDate
      searchForm.value.dateRange = searchForm.value.entryDate;
  } else {
    searchForm.value.entryDateStart = dayjs().startOf("month").format("YYYY-MM-DD");
      searchForm.value.entryDateStart = dayjs()
        .startOf("month")
        .format("YYYY-MM-DD");
    searchForm.value.entryDateEnd = dayjs().endOf("month").format("YYYY-MM-DD");
    searchForm.value.dateRange = [searchForm.value.entryDateStart, searchForm.value.entryDateEnd]
      searchForm.value.dateRange = [
        searchForm.value.entryDateStart,
        searchForm.value.entryDateEnd,
      ];
  }

  reloadData()
    reloadData();
};

const reloadData = () => {
  page.current = 1;
  page1.current = 1;
  getList();
  tableData.value = []
}
    tableData.value = [];
  };

// 点击左侧行，刷右侧明细（按生产人过滤）
const handleLeftRowClick = (row) => {
  const handleLeftRowClick = row => {
   searchForm.value.schedulingUserName = row.schedulingUserName || "";
   handleQuery();
};
@@ -303,7 +316,6 @@
  getList1();
};


// 导出
const handleOut = () => {
   ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
@@ -312,7 +324,11 @@
      type: "warning",
   })
      .then(() => {
         proxy.download("/salesLedger/productionAccounting/export", {}, "生产核算.xlsx");
        proxy.download(
          "/salesLedger/productionAccounting/export",
          {},
          "生产核算.xlsx"
        );
      })
      .catch(() => {
         proxy.$modal.msg("已取消");