From 3b0d62ccee6666c8e87470b333a19311e49547d1 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期二, 07 四月 2026 14:40:03 +0800
Subject: [PATCH] 三项优化内容
---
src/views/productionManagement/productionCosting/index.vue | 692 +++++++++++++++++++++++++++++----------------------------
1 files changed, 354 insertions(+), 338 deletions(-)
diff --git a/src/views/productionManagement/productionCosting/index.vue b/src/views/productionManagement/productionCosting/index.vue
index 8e1d40b..19736e3 100644
--- a/src/views/productionManagement/productionCosting/index.vue
+++ b/src/views/productionManagement/productionCosting/index.vue
@@ -1,371 +1,387 @@
<template>
- <div class="app-container">
- <el-row :gutter="16" class="content-row">
- <!-- 宸︿晶鍙拌处 + 椤堕儴绛涢�� -->
- <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-item prop="dateType">
- <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"
- :type="searchForm.dateType === 'day' ? 'date' : 'daterange'"
- range-separator="鑷�"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- format="YYYY-MM-DD"
- value-format="YYYY-MM-DD"
- style="width: 200px"
- @change="handleDateRangeChange"
- />
+ <div class="app-container">
+ <el-row :gutter="16"
+ class="content-row">
+ <!-- 宸︿晶鍙拌处 + 椤堕儴绛涢�� -->
+ <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-item prop="dateType">
+ <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"
+ :type="searchForm.dateType === 'day' ? 'date' : 'daterange'"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ style="width: 200px"
+ @change="handleDateRangeChange" />
+ </el-form-item>
+ </el-form>
+ </div>
+ <PIMTable rowKey="id"
+ :column="leftTableColumn"
+ :tableData="leftTableData"
+ :tableLoading="tableLoading"
+ :page="page"
+ @row-click="handleLeftRowClick"
+ @pagination="pagination"></PIMTable>
+ </div>
+ </el-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-form-item>
</el-form>
- </div>
- <PIMTable
- rowKey="id"
- :column="leftTableColumn"
- :tableData="leftTableData"
- :tableLoading="tableLoading"
- :page="page"
- @row-click="handleLeftRowClick"
- @pagination="pagination"
- ></PIMTable>
- </div>
- </el-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-form-item>
- </el-form>
- <PIMTable
- rowKey="id"
- :column="tableColumn"
- :tableData="tableData"
- :page="page1"
- :tableLoading="tableLoading1"
- style="margin-right: 20px;"
- @pagination="pagination1"
- ></PIMTable>
- </div>
- </el-col>
- </el-row>
- </div>
+ <PIMTable rowKey="id"
+ :column="tableColumn"
+ :tableData="tableData"
+ :page="page1"
+ :tableLoading="tableLoading1"
+ style="margin-right: 20px;"
+ @pagination="pagination1"></PIMTable>
+ </div>
+ </el-col>
+ </el-row>
+ </div>
</template>
<script setup>
-import {onMounted, ref} from "vue";
-import { ElMessageBox } from "element-plus";
-import dayjs from "dayjs";
-import {salesLedgerProductionAccountingListProductionDetails, salesLedgerProductionAccountingList} from "@/api/productionManagement/productionCosting.js";
-const { proxy } = getCurrentInstance();
+ import { onMounted, ref } from "vue";
+ import { ElMessageBox } from "element-plus";
+ import dayjs from "dayjs";
+ import {
+ salesLedgerProductionAccountingListProductionDetails,
+ salesLedgerProductionAccountingList,
+ } from "@/api/productionManagement/productionCosting.js";
+ const { proxy } = getCurrentInstance();
-const tableColumn = ref([
- {
- label: "鐢熶骇鏃ユ湡",
- prop: "schedulingDate",
- minWidth: 100,
- },
- {
- label: "鐢熶骇浜�",
- prop: "schedulingUserName",
- minWidth: 100,
- },
- {
- label: "鍚堝悓鍙�",
- prop: "salesContractNo",
- minWidth: 100,
- },
- {
- label: "瀹㈡埛鍚嶇О",
- prop: "customerName",
- minWidth: 100,
- },
- {
- label: "浜у搧澶х被",
- prop: "productName",
- minWidth: 100,
- },
- {
- label: "瑙勬牸鍨嬪彿",
- prop: "productModelName",
- minWidth: 100,
- },
- {
- label: "鍗曚綅",
- prop: "unit",
- minWidth: 100,
- },
- {
- label: "宸ュ簭",
- prop: "process",
- minWidth: 100,
- },
- {
- label: "鐢熶骇鏁伴噺",
- prop: "quantity",
- minWidth: 100,
- },
- {
- label: "宸ユ椂瀹氶",
- prop: "workHours",
- minWidth: 100,
- },
- {
- label: "宸ヨ祫",
- prop: "wages",
- minWidth: 100,
- },
-]);
-
-// 宸︿晶姹囨�诲彴璐﹀垪锛堢敓浜т汉銆佷骇閲忋�佸伐璧勩�佸悎鏍肩巼锛�
-const leftTableColumn = ref([
- {
- label: "鐢熶骇浜�",
- prop: "schedulingUserName",
- minWidth: 100,
- },
- {
- 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)
+ const tableColumn = ref([
+ {
+ label: "鐢熶骇鏃ユ湡",
+ prop: "schedulingDate",
+ minWidth: 100,
},
- },
-]);
+ {
+ label: "鐢熶骇浜�",
+ prop: "schedulingUserName",
+ minWidth: 100,
+ },
+ // {
+ // label: "鍚堝悓鍙�",
+ // prop: "salesContractNo",
+ // minWidth: 100,
+ // },
+ // {
+ // label: "瀹㈡埛鍚嶇О",
+ // prop: "customerName",
+ // minWidth: 100,
+ // },
+ {
+ label: "浜у搧澶х被",
+ prop: "productName",
+ minWidth: 100,
+ },
+ {
+ label: "瑙勬牸鍨嬪彿",
+ prop: "productModelName",
+ minWidth: 100,
+ },
+ {
+ label: "鍗曚綅",
+ prop: "unit",
+ minWidth: 100,
+ },
+ {
+ label: "宸ュ簭",
+ prop: "process",
+ minWidth: 100,
+ },
+ {
+ label: "鐢熶骇鏁伴噺",
+ prop: "quantity",
+ minWidth: 100,
+ },
+ {
+ label: "宸ユ椂瀹氶",
+ prop: "workHours",
+ minWidth: 100,
+ },
+ {
+ label: "宸ヨ祫",
+ prop: "wages",
+ minWidth: 100,
+ },
+ ]);
-const tableData = ref([]);
-const tableLoading = ref(false);
-const tableLoading1 = ref(false);
-const leftTableData = ref([]);
-// 鏃� / 鏈� 鍒囨崲锛堥粯璁ゆ寜鏃ワ級
-const page = reactive({
- current: 1,
- size: 100,
- total: 0,
-});
+ // 宸︿晶姹囨�诲彴璐﹀垪锛堢敓浜т汉銆佷骇閲忋�佸伐璧勩�佸悎鏍肩巼锛�
+ const leftTableColumn = ref([
+ {
+ label: "鐢熶骇浜�",
+ prop: "schedulingUserName",
+ minWidth: 100,
+ },
+ {
+ 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);
+ },
+ },
+ ]);
-const page1 = reactive({
- current: 1,
- size: 100,
- total: 0,
-});
+ const tableData = ref([]);
+ const tableLoading = ref(false);
+ const tableLoading1 = ref(false);
+ const leftTableData = ref([]);
+ // 鏃� / 鏈� 鍒囨崲锛堥粯璁ゆ寜鏃ワ級
+ const page = reactive({
+ current: 1,
+ size: 100,
+ total: 0,
+ });
-const data = reactive({
- searchForm: {
- schedulingUserName: "",
- salesContractNo: "",
- dateType: "day",
- dateRange: dayjs().format("YYYY-MM-DD"),
- entryDate: dayjs().format("YYYY-MM-DD"),
- entryDateStart: undefined,
- entryDateEnd: undefined,
- },
-});
-const { searchForm } = toRefs(data);
+ const page1 = reactive({
+ current: 1,
+ size: 100,
+ total: 0,
+ });
-const pagination = (obj) => {
- page.current = obj.page;
- page.size = obj.limit;
- getList();
-};
+ const data = reactive({
+ searchForm: {
+ schedulingUserName: "",
+ salesContractNo: "",
+ dateType: "day",
+ dateRange: dayjs().format("YYYY-MM-DD"),
+ entryDate: dayjs().format("YYYY-MM-DD"),
+ entryDateStart: undefined,
+ entryDateEnd: undefined,
+ },
+ });
+ const { searchForm } = toRefs(data);
-const pagination1 = (obj) => {
- page1.current = obj.page;
- page1.size = obj.limit;
- getList1();
-};
+ const pagination = obj => {
+ page.current = obj.page;
+ page.size = obj.limit;
+ getList();
+ };
-const handleDateRangeChange = (value) => {
- if (value) {
- if (searchForm.value.dateType === "day") {
- searchForm.value.entryDate = value;
+ const pagination1 = obj => {
+ page1.current = obj.page;
+ page1.size = obj.limit;
+ getList1();
+ };
+
+ const handleDateRangeChange = value => {
+ if (value) {
+ if (searchForm.value.dateType === "day") {
+ searchForm.value.entryDate = value;
+ } else {
+ searchForm.value.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
+ searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
+ }
} else {
- searchForm.value.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD");
- searchForm.value.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD");
+ searchForm.value.entryDate = undefined;
+ searchForm.value.entryDateStart = undefined;
+ searchForm.value.entryDateEnd = undefined;
+ }
+ reloadData();
+ };
+
+ const getList = () => {
+ tableLoading.value = true;
+ const params = { ...searchForm.value, ...page };
+
+ salesLedgerProductionAccountingList(params)
+ .then(res => {
+ const records = res.data.records || [];
+ leftTableData.value = records;
+ page.total = res.data.total || 0;
+ })
+ .finally(() => {
+ tableLoading.value = false;
+ });
+ };
+
+ const getList1 = () => {
+ tableLoading1.value = true;
+ const params = { ...page1, ...searchForm.value };
+ salesLedgerProductionAccountingListProductionDetails(params)
+ .then(res => {
+ tableData.value = res.data.records || [];
+ page1.total = res.data.total || 0;
+ })
+ .finally(() => {
+ tableLoading1.value = false;
+ });
+ };
+
+ // 鏋勫缓宸︿晶姹囨�诲彴璐︼紙鎸夌敓浜т汉姹囨�讳骇閲忋�佸伐璧勭瓑锛�
+ const buildLeftTableData = records => {
+ const map = {};
+ records.forEach(item => {
+ const key = item.schedulingUserName || "鏈煡";
+ if (!map[key]) {
+ map[key] = {
+ id: key,
+ schedulingUserName: key,
+ finishedNum: 0,
+ wages: 0,
+ qualifiedRate: item.qualifiedRate ?? null,
+ };
+ }
+ map[key].finishedNum += Number(item.finishedNum || 0);
+ map[key].wages += Number(item.wages || 0);
+ if (item.qualifiedRate != null) {
+ map[key].qualifiedRate = item.qualifiedRate;
+ }
+ });
+ leftTableData.value = Object.values(map);
+ };
+
+ // 宸︿晶鏃�/鏈堝垏鎹�
+ const handleDateTypeChange = value => {
+ // 杩欓噷鍙綔涓虹瓫閫夋潯浠剁殑涓�閮ㄥ垎锛岀洿鎺ラ噸鏂版煡璇㈠垪琛�
+ if (value === "day") {
+ searchForm.value.entryDate = dayjs().format("YYYY-MM-DD");
+ searchForm.value.dateRange = searchForm.value.entryDate;
+ } else {
+ 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,
+ ];
}
- } 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 };
+ const reloadData = () => {
+ page.current = 1;
+ page1.current = 1;
+ getList();
+ tableData.value = [];
+ };
- salesLedgerProductionAccountingList(params).then((res) => {
- const records = res.data.records || [];
- leftTableData.value = records;
- page.total = res.data.total || 0;
- }).finally(() => {
- tableLoading.value = false;
- })
+ // 鐐瑰嚮宸︿晶琛岋紝鍒峰彸渚ф槑缁嗭紙鎸夌敓浜т汉杩囨护锛�
+ const handleLeftRowClick = row => {
+ searchForm.value.schedulingUserName = row.schedulingUserName || "";
+ handleQuery();
+ };
+ // 鏌ヨ鍒楄〃
+ /** 鎼滅储鎸夐挳鎿嶄綔 */
+ const handleQuery = () => {
+ page1.current = 1;
+ getList1();
+ };
+ // 瀵煎嚭
+ const handleOut = () => {
+ ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
+ confirmButtonText: "纭",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ proxy.download(
+ "/salesLedger/productionAccounting/export",
+ {},
+ "鐢熶骇鏍哥畻.xlsx"
+ );
+ })
+ .catch(() => {
+ proxy.$modal.msg("宸插彇娑�");
+ });
+ };
-};
-
-const getList1 = () => {
- tableLoading1.value = true;
- const params = { ...page1, ...searchForm.value };
- salesLedgerProductionAccountingListProductionDetails(params).then((res) => {
- tableData.value = res.data.records || [];;
- page1.total = res.data.total || 0;
- }).finally(() => {
- tableLoading1.value = false;
- })
-};
-
-// 鏋勫缓宸︿晶姹囨�诲彴璐︼紙鎸夌敓浜т汉姹囨�讳骇閲忋�佸伐璧勭瓑锛�
-const buildLeftTableData = (records) => {
- const map = {};
- records.forEach((item) => {
- const key = item.schedulingUserName || "鏈煡";
- if (!map[key]) {
- map[key] = {
- id: key,
- schedulingUserName: key,
- finishedNum: 0,
- wages: 0,
- qualifiedRate: item.qualifiedRate ?? null,
- };
- }
- map[key].finishedNum += Number(item.finishedNum || 0);
- map[key].wages += Number(item.wages || 0);
- if (item.qualifiedRate != null) {
- map[key].qualifiedRate = item.qualifiedRate;
- }
- });
- leftTableData.value = Object.values(map);
-};
-
-// 宸︿晶鏃�/鏈堝垏鎹�
-const handleDateTypeChange = (value) => {
- // 杩欓噷鍙綔涓虹瓫閫夋潯浠剁殑涓�閮ㄥ垎锛岀洿鎺ラ噸鏂版煡璇㈠垪琛�
- if (value === "day") {
- searchForm.value.entryDate = dayjs().format("YYYY-MM-DD");
- searchForm.value.dateRange = searchForm.value.entryDate
- } else {
- 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]
- }
-
- reloadData()
-};
-
-const reloadData = () => {
- page.current = 1;
- page1.current = 1;
- getList();
- tableData.value = []
-}
-
-// 鐐瑰嚮宸︿晶琛岋紝鍒峰彸渚ф槑缁嗭紙鎸夌敓浜т汉杩囨护锛�
-const handleLeftRowClick = (row) => {
- searchForm.value.schedulingUserName = row.schedulingUserName || "";
- handleQuery();
-};
-
-// 鏌ヨ鍒楄〃
-/** 鎼滅储鎸夐挳鎿嶄綔 */
-const handleQuery = () => {
- page1.current = 1;
- getList1();
-};
-
-
-// 瀵煎嚭
-const handleOut = () => {
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
- confirmButtonText: "纭",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- })
- .then(() => {
- proxy.download("/salesLedger/productionAccounting/export", {}, "鐢熶骇鏍哥畻.xlsx");
- })
- .catch(() => {
- proxy.$modal.msg("宸插彇娑�");
- });
-};
-
-onMounted(() => {
- getList();
-});
+ onMounted(() => {
+ getList();
+ });
</script>
<style scoped lang="scss">
-.content-row {
- width: 100%;
-}
+ .content-row {
+ width: 100%;
+ }
-.content-row .left-col,
-.content-row .right-col {
- margin-bottom: 16px;
-}
+ .content-row .left-col,
+ .content-row .right-col {
+ margin-bottom: 16px;
+ }
-.left-panel,
-.right-panel {
- display: flex;
- flex-direction: column;
- gap: 10px;
- min-width: 0;
-}
+ .left-panel,
+ .right-panel {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+ min-width: 0;
+ }
-.left-header {
- display: flex;
- align-items: center;
- gap: 12px;
-}
+ .left-header {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ }
-.left-title {
- font-size: 16px;
- color: #ffffff;
-}
+ .left-title {
+ font-size: 16px;
+ color: #ffffff;
+ }
-.header-filters {
- display: flex;
- align-items: center;
- flex: 1;
- justify-content: flex-end;
- gap: 8px;
-}
+ .header-filters {
+ display: flex;
+ align-items: center;
+ flex: 1;
+ justify-content: flex-end;
+ gap: 8px;
+ }
-.search_title {
- color: #ffffff;
-}
+ .search_title {
+ color: #ffffff;
+ }
-.ml10 {
- margin-left: 10px;
-}
+ .ml10 {
+ margin-left: 10px;
+ }
</style>
--
Gitblit v1.9.3