From 8d48fa86c9096f6bac90e83ed779e5a5b62b0fc7 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期二, 24 三月 2026 18:01:47 +0800
Subject: [PATCH] 生产报工模块
---
src/views/productionManagement/productionReporting/index.vue | 657 +++++++++++++++++++++++++++++++---------------------------
1 files changed, 350 insertions(+), 307 deletions(-)
diff --git a/src/views/productionManagement/productionReporting/index.vue b/src/views/productionManagement/productionReporting/index.vue
index 0b42dae..81ea100 100644
--- a/src/views/productionManagement/productionReporting/index.vue
+++ b/src/views/productionManagement/productionReporting/index.vue
@@ -3,418 +3,461 @@
<div class="search_form">
<el-form :model="searchForm"
:inline="true">
- <el-form-item label="鎶ュ伐浜哄憳鍚嶇О:">
- <el-input v-model="searchForm.nickName"
+ <el-form-item label="鐢熶骇璁㈠崟鍙�:">
+ <el-input v-model="searchForm.npsNo"
placeholder="璇疯緭鍏�"
clearable
- prefix-icon="Search"
- style="width: 200px;"
- @change="handleQuery" />
+ style="width: 160px;"
+ @keyup.enter="handleQuery" />
</el-form-item>
- <el-form-item label="宸ュ崟鍙�:">
- <el-input v-model="searchForm.workOrderNo"
+ <el-form-item label="鐝粍:">
+ <el-select v-model="searchForm.schedule"
+ placeholder="璇烽�夋嫨"
+ clearable
+ style="width: 160px;"
+ @keyup.enter="handleQuery">
+ <el-option label="鐧界彮"
+ value="鐧界彮" />
+ <el-option label="澶滅彮"
+ value="澶滅彮" />
+ </el-select>
+ <!-- <el-input v-model="searchForm.schedule"
+ placeholder="璇疯緭鍏�""
+ @keyup.enter="handleQuery" /> -->
+ </el-form-item>
+ <el-form-item label="浜у搧鍚嶇О:">
+ <el-input v-model="searchForm.productName"
placeholder="璇疯緭鍏�"
clearable
- prefix-icon="Search"
- style="width: 200px;"
- @change="handleQuery" />
+ style="width: 160px;"
+ @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary"
@click="handleQuery">鎼滅储</el-button>
+ <el-button type="primary"
+ @click="handleReset">閲嶇疆</el-button>
</el-form-item>
</el-form>
+ <div>
+ <el-button type="primary"
+ @click="handleAdd">鏂板</el-button>
+ <el-button @click="handleExport">瀵煎嚭</el-button>
+ </div>
</div>
<div class="table_list">
- <div style="text-align: right"
- class="mb10">
- <!-- <el-button type="primary"
- @click="openForm('add')">鐢熶骇鎶ュ伐</el-button> -->
- <el-button @click="handleOut">瀵煎嚭</el-button>
- </div>
<PIMTable rowKey="id"
:column="tableColumn"
:tableData="tableData"
:page="page"
- :isSelection="true"
- :expandRowKeys="expandedRowKeys"
- @expand-change="expandChange"
- @selection-change="handleSelectionChange"
:tableLoading="tableLoading"
- @pagination="pagination"
- :total="page.total">
- <template #expand="{ row }">
- <el-table :data="expandData"
- border
- show-summary
- :summary-method="summarizeMainTable"
- v-loading="childrenLoading">
- <el-table-column align="center"
- label="搴忓彿"
- type="index"
- width="60" />
- <el-table-column label="鏈鐢熶骇鏁伴噺"
- prop="finishedNum"
- align="center"
- width="400">
- <template #default="scope">
- <el-input-number :step="0.01"
- :min="0"
- style="width: 100%"
- v-model="scope.row.finishedNum"
- :disabled="!scope.row.editType"
- :precision="2"
- placeholder="璇疯緭鍏�"
- clearable
- @change="changeNum(scope.row)" />
- </template>
- </el-table-column>
- <!-- <el-table-column label="寰呯敓浜ф暟閲�" prop="pendingNum" width="240" align="center"></el-table-column>-->
- <el-table-column label="鐢熶骇浜�"
- prop="schedulingUserId"
- width="400">
- <template #default="scope">
- <el-select v-model="scope.row.schedulingUserId"
- placeholder="閫夋嫨浜哄憳"
- :disabled="!scope.row.editType"
- style="width: 100%;">
- <el-option v-for="user in userList"
- :key="user.userId"
- :label="user.nickName"
- :value="user.userId" />
- </el-select>
- </template>
- </el-table-column>
- <el-table-column label="鐢熶骇鏃ユ湡"
- prop="schedulingDate"
- width="400">
- <template #default="scope">
- <el-date-picker v-model="scope.row.schedulingDate"
- type="date"
- :disabled="!scope.row.editType"
- placeholder="璇烽�夋嫨鏃ユ湡"
- value-format="YYYY-MM-DD"
- format="YYYY-MM-DD"
- clearable
- style="width: 100%" />
- </template>
- </el-table-column>
- <el-table-column label="鎿嶄綔"
- >
- <template #default="scope">
- <el-button link
- type="primary"
- size="small"
- @click="changeEditType(scope.row)"
- v-if="!scope.row.editType"
- :disabled="scope.row.parentStatus === 3">缂栬緫</el-button>
- <el-button link
- type="primary"
- size="small"
- @click="saveReceiptPayment(scope.row)"
- v-if="scope.row.editType">淇濆瓨</el-button>
- </template>
- </el-table-column>
- </el-table>
+ :isSelection="false"
+ @selection-change="handleSelectionChange"
+ @pagination="pagination">
+ <template #totalQuantity="{ row }">
+ <span style="font-weight: bold;color: #409eff;">{{ row.totalQuantity }}</span><span style="margin-left: 5px;color: #909399;">鏂�</span>
+ </template>
+ <template #scrapQty="{ row }">
+ <span style="font-weight: bold;color: #b43434;">{{ row.scrapQty }}</span><span style="margin-left: 5px;color: #909399;">鏂�</span>
+ </template>
+ <template #quantity="{ row }">
+ <span style="font-weight: bold;color: #28e431;">{{ row.quantity }}</span><span style="margin-left: 5px;color: #909399;">鏂�</span>
</template>
</PIMTable>
</div>
- <form-dia ref="formDia"
- @close="handleQuery"></form-dia>
- <input-modal v-if="isShowInput"
- v-model:visible="isShowInput"
- :production-product-main-id="isShowingId" />
+ <!-- 璇︽儏寮圭獥 -->
+ <detail-dialog v-model:visible="detailDialogVisible"
+ :data="detailData" />
</div>
</template>
<script setup>
- import { onMounted, ref } from "vue";
- import FormDia from "@/views/productionManagement/productionReporting/components/formDia.vue";
- import { ElMessageBox } from "element-plus";
+ import { onMounted, ref, reactive, getCurrentInstance } from "vue";
+ import { useRouter } from "vue-router";
+ import { ElMessage, ElMessageBox } from "element-plus";
+ import dayjs from "dayjs";
import {
- productionReportUpdate,
- workListPageById,
productionReportDelete,
+ productionReportDetail,
+ productionReportListPage,
} from "@/api/productionManagement/productionReporting.js";
- import { productionProductMainListPage } from "@/api/productionManagement/productionProductMain.js";
- import { userListNoPageByTenantId } from "@/api/system/user.js";
- import InputModal from "@/views/productionManagement/productionReporting/Input.vue";
+ import PIMTable from "@/components/PIMTable/PIMTable.vue";
+ import DetailDialog from "./detailDialog.vue";
- const data = reactive({
- searchForm: {
- nickName: "",
- workOrderNo: "",
- workOrderStatus: "",
- },
- });
- const { searchForm } = toRefs(data);
- const expandedRowKeys = ref([]);
- const expandData = ref([]);
- const userList = ref([]);
+ const router = useRouter();
+ const { proxy } = getCurrentInstance();
+
const tableColumn = ref([
{
- label: "鎶ュ伐鍗曞彿",
- prop: "productNo",
- width: 120,
+ label: "鐢熶骇璁㈠崟鍙�",
+ prop: "npsNo",
+ width: "150px",
},
{
- label: "鎶ュ伐浜哄憳",
- prop: "nickName",
- width: 120,
+ label: "鐝粍",
+ prop: "schedule",
+ width: "120px",
+ dataType: "tag",
+ formatType: params => {
+ return params === "鐧界彮" ? "primary" : "warning";
+ },
},
{
- label: "宸ュ簭",
- prop: "process",
- width: 120,
- },
- {
- label: "宸ュ崟缂栧彿",
- prop: "workOrderNo",
- width: 120,
- },
- {
- label: "閿�鍞悎鍚屽彿",
- prop: "salesContractNo",
- width: 120,
+ label: "浜у搧缂栫爜",
+ prop: "materialCode",
+ width: "150px",
},
{
label: "浜у搧鍚嶇О",
prop: "productName",
- width: 120,
+ width: "150px",
},
{
- label: "浜у搧瑙勬牸鍨嬪彿",
+ label: "瑙勬牸",
prop: "productModelName",
- width: 120,
+ width: "150px",
+ className: "productModelName-cell",
},
{
- label: "浜у嚭鏁伴噺",
- prop: "quantity",
- width: 120,
+ label: "浜у嚭鏂归噺",
+ prop: "totalQuantity",
+ width: "100px",
+ align: "right",
+ dataType: "slot",
+ slot: "totalQuantity",
},
{
- label: "鎶ュ簾鏁伴噺",
+ label: "涓嶅悎鏍兼柟閲�",
prop: "scrapQty",
- width: 120,
+ width: "100px",
+ align: "right",
+ dataType: "slot",
+ slot: "scrapQty",
},
{
- label: "鍗曚綅",
- prop: "unit",
- width: 120,
+ label: "瀹屾垚鏂归噺",
+ prop: "quantity",
+ width: "100px",
+ align: "right",
+ dataType: "slot",
+ slot: "quantity",
},
-
+ {
+ label: "鍒涘缓浜�",
+ prop: "postName",
+ width: "120px",
+ dataType: "tag",
+ },
{
label: "鍒涘缓鏃堕棿",
prop: "createTime",
- width: 120,
+ width: "160px",
+ formatData: val => (val ? dayjs(val).format("YYYY-MM-DD HH:mm:ss") : ""),
},
{
- dataType: "action",
label: "鎿嶄綔",
- align: "center",
+ dataType: "action",
+ width: "200px",
fixed: "right",
operation: [
{
- name: "鏌ョ湅鎶曞叆",
+ name: "璇︽儏",
type: "text",
clickFun: row => {
- showInput(row);
+ handleDetail(row);
+ },
+ },
+ {
+ name: "缂栬緫",
+ type: "text",
+ clickFun: row => {
+ handleEdit(row);
},
},
{
name: "鍒犻櫎",
- type: "danger",
+ type: "text",
clickFun: row => {
- deleteReport(row);
+ handleDelete(row);
},
},
],
},
]);
+
const tableData = ref([]);
- const selectedRows = ref([]);
const tableLoading = ref(false);
- const childrenLoading = ref(false);
const page = reactive({
current: 1,
- size: 100,
+ size: 10,
total: 0,
});
- const formDia = ref();
- const { proxy } = getCurrentInstance();
- // 鏌ヨ鍒楄〃
- /** 鎼滅储鎸夐挳鎿嶄綔 */
+ const searchForm = reactive({
+ npsNo: "",
+ schedule: "",
+ productName: "",
+ });
+
+ const form = reactive({
+ id: undefined,
+ orderId: "",
+ npsNo: "",
+ schedule: "",
+ materialCode: "",
+ productName: "",
+ productModelName: "",
+ totalQuantity: 0,
+ scrapQty: 0,
+ quantity: 0,
+ processId: "",
+ params: {},
+ });
+
+ const selectedRows = ref([]);
+ const detailDialogVisible = ref(false);
+ const detailData = ref({});
+
+ const getList = () => {
+ tableLoading.value = true;
+ productionReportListPage({
+ current: page.current,
+ size: page.size,
+ ...searchForm,
+ }).then(res => {
+ tableData.value = res.data.records;
+ page.total = res.data.total;
+ tableLoading.value = false;
+ });
+ };
+
const handleQuery = () => {
page.current = 1;
getList();
};
- const changeDaterange = value => {
- if (value) {
- searchForm.value.entryDateStart = value[0];
- searchForm.value.entryDateEnd = value[1];
- } else {
- searchForm.value.entryDateStart = undefined;
- searchForm.value.entryDateEnd = undefined;
- }
- handleQuery();
+
+ const handleReset = () => {
+ searchForm.npsNo = "";
+ searchForm.schedule = "";
+ searchForm.productName = "";
+ page.current = 1;
+ getList();
};
- const deleteReport = row => {
- ElMessageBox.confirm("纭畾鍒犻櫎璇ユ姤宸ュ悧锛�", "鎻愮ず", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- type: "warning",
- }).then(() => {
- productionReportDelete({ id: row.id }).then(res => {
- if (res.code === 200) {
- proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- getList();
- } else {
- ElMessageBox.alert(res.msg || "鍒犻櫎澶辫触", "鎻愮ず", {
- confirmButtonText: "纭畾",
- });
- }
- });
- });
- };
+
const pagination = obj => {
page.current = obj.page;
page.size = obj.limit;
getList();
};
- const getList = () => {
- tableLoading.value = true;
- const params = { ...searchForm.value, ...page };
- params.entryDate = undefined;
- expandedRowKeys.value = [];
- productionProductMainListPage(params)
- .then(res => {
- tableLoading.value = false;
- tableData.value = res.data.records.map(item => ({
- ...item,
- pendingFinishNum:
- (Number(item.schedulingNum) || 0) - (Number(item.finishedNum) || 0),
- }));
- page.total = res.data.total;
- })
- .catch(err => {
- tableLoading.value = false;
- });
- };
- // 灞曞紑琛�
- const expandChange = (row, expandedRows) => {
- userListNoPageByTenantId().then(res => {
- userList.value = res.data;
- });
- if (expandedRows.length > 0) {
- nextTick(() => {
- expandedRowKeys.value = [];
- try {
- childrenLoading.value = true;
- workListPageById({ id: row.id }).then(res => {
- childrenLoading.value = false;
- const index = tableData.value.findIndex(item => item.id === row.id);
- if (index > -1) {
- expandData.value = res.data.map(item => ({
- ...item,
- pendingNum:
- (Number(item.schedulingNum) || 0) -
- (Number(item.finishedNum) || 0),
- parentStatus: row.status, // 鏂板鐖惰〃鐘舵��
- }));
- }
- expandedRowKeys.value.push(row.id);
- });
- } catch (error) {
- childrenLoading.value = false;
- console.log(error);
- }
- });
- } else {
- expandedRowKeys.value = [];
- }
- };
- const changeNum = row => {
- // 鎵惧埌鐖惰〃鏍兼暟鎹�
- const parentRow = tableData.value.find(
- item => item.id === expandedRowKeys.value[0]
- );
- // 璁＄畻鎵�鏈夊瓙琛ㄦ牸 finishedNum 鐨勬�诲拰
- const totalFinishedNum = expandData.value.reduce(
- (sum, item) => sum + (Number(item.finishedNum) || 0),
- 0
- );
- // 鐖惰〃鏍肩殑鎺掍骇鏁伴噺
- const schedulingNum = parentRow ? Number(parentRow.schedulingNum) : 0;
- if (totalFinishedNum > schedulingNum) {
- // 鍥為��鏈杈撳叆
- row.finishedNum =
- schedulingNum - (totalFinishedNum - Number(row.finishedNum));
- proxy.$modal.msgWarning("鎵�鏈夋湰娆＄敓浜ф暟閲忎箣鍜屼笉鍙ぇ浜庢帓浜ф暟閲�");
- }
- row.pendingNum = row.schedulingNum - row.finishedNum;
- };
- // 缂栬緫淇敼鐘舵��
- const changeEditType = row => {
- row.editType = !row.editType;
- };
- // 淇濆瓨璁板綍
- const saveReceiptPayment = row => {
- productionReportUpdate(row).then(res => {
- row.editType = !row.editType;
- getList();
- proxy.$modal.msgSuccess("鎻愪氦鎴愬姛");
- });
- };
- // 琛ㄦ牸閫夋嫨鏁版嵁
const handleSelectionChange = selection => {
selectedRows.value = selection;
};
- const summarizeMainTable = param => {
- return proxy.summarizeTable(param, ["finishedNum"]);
- };
- // 鎵撳紑寮规
- const openForm = (type, row) => {
- if (selectedRows.value.length !== 1) {
- proxy.$message.error("璇烽�夋嫨涓�鏉℃暟鎹�");
- return;
- }
- if (selectedRows.value[0].pendingFinishNum == 0) {
- proxy.$message.warning("鏃犻渶鍐嶆姤宸�");
- return;
- }
- nextTick(() => {
- const rowInfo = type === "add" ? selectedRows.value[0] : row;
- formDia.value?.openDialog(type, rowInfo);
+
+ const handleAdd = () => {
+ Object.assign(form, {
+ type: "add",
+ id: undefined,
+ orderId: "",
+ npsNo: "",
+ schedule: "",
+ materialCode: "",
+ productName: "",
+ productModelName: "",
+ totalQuantity: 0,
+ scrapQty: 0,
+ quantity: 0,
+ processId: "",
+ params: {},
+ });
+ router.push({
+ path: "/productionManagement/ReportingDialog",
+ // query: { data: JSON.stringify(form) },
});
};
- // 鎵撳紑鎶曞叆妯℃�佹
- const isShowInput = ref(false);
- const isShowingId = ref(0);
- const showInput = row => {
- isShowInput.value = true;
- isShowingId.value = row.id;
+ const handleEdit = row => {
+ // 璋冪敤璇︽儏鎺ュ彛鑾峰彇瀹屾暣鏁版嵁
+ productionReportDetail(row.id)
+ .then(res => {
+ if (res.code === 200) {
+ const detailData = res.data;
+ // 鏋勫缓缂栬緫琛ㄥ崟鏁版嵁
+ const editForm = {
+ id: row.id,
+ type: "edit",
+ orderId: detailData.productOrderId || "",
+ npsNo: detailData.npsNo || "",
+ schedule: detailData.schedule || "",
+ materialCode: detailData.materialCode || "",
+ productName: detailData.productName || "",
+ productModelName: detailData.model || "",
+ totalQuantity: detailData.quantity || 0,
+ scrapQty: detailData.unqualifiedQuantity || 0,
+ quantity: detailData.qualifiedQuantity || 0,
+ createBy: detailData.postName || "",
+ createTime: detailData.createTime || new Date(),
+ processId: "",
+ params: {},
+ // 浼犻�掑伐搴忎俊鎭�
+ productionProductRouteItemDtoList:
+ detailData.productionProductRouteItemDtoList || [],
+ };
+ router.push({
+ path: "/productionManagement/ReportingDialog",
+ query: { data: JSON.stringify(editForm) },
+ });
+ } else {
+ ElMessage.error("鑾峰彇璇︽儏澶辫触");
+ }
+ })
+ .catch(() => {
+ ElMessage.error("鑾峰彇璇︽儏澶辫触");
+ });
};
- // 瀵煎嚭
- const handleOut = () => {
- ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", {
- confirmButtonText: "纭",
+ const handleDetail = row => {
+ productionReportDetail(row.id)
+ .then(res => {
+ if (res.code === 200) {
+ detailData.value = res.data;
+ detailDialogVisible.value = true;
+ } else {
+ ElMessage.error("鑾峰彇璇︽儏澶辫触");
+ }
+ })
+ .catch(() => {
+ ElMessage.error("鑾峰彇璇︽儏澶辫触");
+ });
+ };
+
+ const handleDelete = row => {
+ ElMessageBox.confirm("纭鍒犻櫎璇ユ潯鏁版嵁鍚�?", "鎻愮ず", {
+ confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning",
})
.then(() => {
- proxy.download("/productionProductMain/export", {}, "鐢熶骇鎶ュ伐.xlsx");
+ productionReportDelete(row.id)
+ .then(() => {
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ })
+ .catch(() => {
+ ElMessage.error("鍒犻櫎澶辫触");
+ });
})
- .catch(() => {
- proxy.$modal.msg("宸插彇娑�");
- });
+ .catch(() => {});
};
+
+ const handleExport = () => {
+ ElMessage.info("瀵煎嚭鍔熻兘寰呭疄鐜�");
+ };
+
onMounted(() => {
getList();
});
</script>
-<style scoped></style>
+<style scoped lang="scss">
+ .app-container {
+ padding: 24px;
+ background-color: #f0f2f5;
+ min-height: calc(100vh - 48px);
+ }
+
+ .search_form {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+ flex-wrap: wrap;
+ gap: 16px;
+ margin-bottom: 24px;
+ padding: 20px;
+ background-color: #ffffff;
+ border-radius: 6px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05);
+ transition: all 0.3s ease;
+
+ &:hover {
+ box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.08);
+ }
+
+ :deep(.el-form) {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 0;
+
+ .el-form-item {
+ margin-right: 16px;
+ margin-bottom: 0;
+
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+ }
+
+ > div {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ flex-shrink: 0;
+ }
+ }
+
+ .table_list {
+ background-color: #ffffff;
+ border-radius: 6px;
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05);
+ overflow: hidden;
+ height: calc(100vh - 220px);
+ }
+
+ :deep(.el-table) {
+ border: none;
+ border-radius: 6px;
+ overflow: hidden;
+
+ .el-table__header-wrapper {
+ background-color: #fafafa;
+
+ th {
+ background-color: #fafafa;
+ font-weight: 600;
+ color: #303133;
+ border-bottom: 1px solid #ebeef5;
+ padding: 14px 0;
+ }
+ }
+
+ .el-table__body-wrapper {
+ tr {
+ transition: all 0.3s ease;
+
+ &:hover {
+ background-color: #f5f7fa;
+ }
+
+ td {
+ border-bottom: 1px solid #ebeef5;
+ padding: 12px 0;
+ }
+ }
+
+ tr.current-row {
+ background-color: #ecf5ff;
+ }
+ }
+
+ .el-table__empty-block {
+ padding: 40px 0;
+ }
+ }
+</style>
+<style lang="scss">
+ .productModelName-cell {
+ color: #7a7d81;
+ font-style: italic;
+ }
+</style>
--
Gitblit v1.9.3