From 0f4dc4ea8a7de1ffdf34a640c79c29d55b79321c Mon Sep 17 00:00:00 2001
From: 张诺 <zhang_12370@163.com>
Date: 星期五, 13 六月 2025 17:53:27 +0800
Subject: [PATCH] 添加生产管理接口及优化表格字段
---
src/views/production/index.vue | 364 ++++++++++++++++++++++++---------------------------
1 files changed, 174 insertions(+), 190 deletions(-)
diff --git a/src/views/production/index.vue b/src/views/production/index.vue
index c113e9f..d298680 100644
--- a/src/views/production/index.vue
+++ b/src/views/production/index.vue
@@ -1,274 +1,258 @@
<template>
<div class="production-container">
- <div class="search-bar">
- <el-input v-model="searchForm.keyword" placeholder="璇疯緭鍏ュ叧閿瘝" clearable />
- <el-input v-model="searchForm.addUser" placeholder="璇疯緭鍏ヤ汉" clearable />
- <el-button type="primary" @click="handleSearch">鏌ヨ</el-button>
- <el-button @click="handleReset">閲嶇疆</el-button>
- </div>
-
- <div class="operation-bar">
- <!-- <el-button type="primary" @click="handleAdd">鏂板閰嶉」</el-button> -->
+ <el-form :inline="true" :model="queryParams" class="search-form" style="width: 100%">
+ <el-form-item label="鎼滅储">
+ <el-input v-model="queryParams.searchAll" placeholder="璇疯緭鍏ュ叧閿瘝" clearable />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="handleSearch">鏌ヨ</el-button>
+ <el-button @click="handleReset">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ <el-card>
<el-button type="success" :icon="Plus" @click="handleAddBatch">鏂板鍔犲伐</el-button>
<el-button type="danger" :icon="Delete">鍒犻櫎</el-button>
<el-button type="info" :icon="Download">瀵煎嚭</el-button>
- </div>
-
- <el-table :data="tableData" border style="width: 100%" @selection-change="handleSelectionChange">
- <el-table-column type="selection" width="55" />
- <el-table-column prop="sequence" label="搴忓彿" width="80" />
- <el-table-column prop="category" label="鐓ょ" width="120" />
- <el-table-column prop="unit" label="鍗曚綅" width="100" />
- <el-table-column prop="productionVolume" label="鐢熶骇鏁伴噺" width="120" />
- <el-table-column prop="laborCost" label="浜哄伐鎴愭湰" width="120" />
- <el-table-column prop="materialCost" label="鍘熸枡鎴愭湰" width="120" />
- <el-table-column prop="equipmentCost" label="璁惧璐圭敤" width="120" />
- <el-table-column prop="totalCost" label="鎬绘垚鏈�" width="120" />
- <el-table-column prop="totalPrice" label="鎬绘垚鏈�" width="120" />
- <el-table-column prop="profit" label="鍒╂鼎" width="100" />
- <el-table-column prop="reviewer" label="澶嶈浜�" width="120" />
- <el-table-column prop="date" label="鏃ユ湡" width="120" />
- <el-table-column label="鎿嶄綔" fixed="right" width="220">
- <template #default="scope">
- <el-button type="primary" link @click="handleEdit(scope.row)">鐧昏</el-button>
- <el-button type="success" link @click="handleEdit(scope.row)">缂栬緫</el-button>
- <el-button type="danger" link @click="handleDelete(scope.row)">鍒犻櫎</el-button>
- <el-button type="warning" link @click="handleExport(scope.row)">瀵煎嚭</el-button>
- </template>
- </el-table-column>
- </el-table>
-
- <div class="pagination">
- <el-pagination
- v-model:current-page="pagination.currentPage"
- v-model:page-size="pagination.pageSize"
- :page-sizes="[10, 20, 30, 50]"
- :total="pagination.total"
- layout="total, sizes, prev, pager, next, jumper"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- />
- </div>
-
- <!-- 寮圭獥缁勪欢 -->
- <ProductionDialog
- v-model:visible="dialogVisible"
- :type="dialogType"
- :row-data="currentRow"
- @success="handleDialogSuccess"
- />
+ <ETable :loading="loading" :table-data="tableData" :columns="columns" @selection-change="handleSelectionChange"
+ @edit="handleEdit" @view-detail="handleViewDetail" :show-selection="true" :border="true" :maxHeight="480" />
+ <Pagination
+ :total="total"
+ :page="queryParams.current"
+ :limit="queryParams.size"
+ :show-total="true"
+ @pagination="handlePageChange"
+ :layout="'total, prev, pager, next, jumper'"
+ ></Pagination>
+ </el-card>
+ <ProductionDialog v-model:visible="dialogVisible" ref="childRef" :type="dialogType"
+ @success="handleDialogSuccess" />
</div>
</template>
<script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import { Plus, Delete, Download } from "@element-plus/icons-vue";
-import ProductionDialog from './components/ProductionDialog.vue'
+import { ref, reactive, onMounted } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Plus, Delete, Download, List } from "@element-plus/icons-vue";
+import ProductionDialog from "./components/ProductionDialog.vue";
+import ETable from "@/components/Table/ETable.vue";
+import Pagination from "@/components/Pagination/index.vue";
+import { getProductionMasterList } from "@/api/production";
+const childRef = ref(null);
+const columns = [
+ { prop: "category", label: "鐓ょ", minWidth: 150 },
+ { prop: "unit", label: "鍗曚綅", minWidth: 120 },
+ { prop: "productionVolume", label: "鐢熶骇鏁伴噺", minWidth: 150 },
+ { prop: "laborCost", label: "浜哄伐鎴愭湰", minWidth: 150 },
+ { prop: "materialCost", label: "鍘熸枡鎴愭湰", minWidth: 120 },
+ { prop: "equipmentCost", label: "璁惧璐圭敤", minWidth: 143 },
+ { prop: "totalCost", label: "鎬绘垚鏈�", minWidth: 150 },
+ { prop: "totalPrice", label: "鎬诲敭浠�", minWidth: 150 },
+ { prop: "profit", label: "鍒╂鼎", minWidth: 100 },
+ { prop: "reviewer", label: "澶嶈浜�", minWidth: 120 },
+ { prop: "date", label: "鏃ユ湡", minWidth: 150 },
+];
// 鎼滅储琛ㄥ崟鏁版嵁
-const searchForm = reactive({
- keyword: '',
- addUser: ''
-})
// 琛ㄦ牸鏁版嵁
-const tableData = ref([])
-const loading = ref(false)
+const tableData = ref([]);
+const loading = ref(false);
+const total = ref(0);
-// 鍒嗛〉鏁版嵁
-const pagination = reactive({
- currentPage: 1,
- pageSize: 10,
- total: 0
-})
-
+const queryParams = reactive({
+ searchAll:"",
+ current: 1,
+ size: 10, // 鍥哄畾姣忛〉10鏉�
+});
+const handlePageChange = ({ page }) => {
+ console.log("鍒嗛〉鍙樺寲:", { page });
+ queryParams.current = page;
+ getList();
+};
// 閫変腑鐨勮鏁版嵁
-const selectedRows = ref([])
+const selectedRows = ref([]);
// 寮圭獥鐩稿叧
-const dialogVisible = ref(false)
-const dialogType = ref('add')
-const currentRow = ref(null)
+const dialogVisible = ref(false);
+const dialogType = ref("add");
+const currentRow = ref(null);
+
+// 鐢熶骇鏄庣粏瀵硅瘽妗嗘帶鍒�
+const detailDialogVisible = ref(false);
+const currentDetailRow = ref(null);
// 鑾峰彇琛ㄦ牸鏁版嵁
const getList = async () => {
- loading.value = true
+ loading.value = true;
try {
- const params = {
- ...searchForm,
- pageNum: pagination.currentPage,
- pageSize: pagination.pageSize
- }
- // const res = await getProductionList(params)
- // 鍋囨暟鎹�
- const res = {
- data: {
- list: [{
- sequence: 1,
- category: '鐓ょ',
- unit: '鍗曚綅',
- productionVolume: '鐢熶骇鏁伴噺',
- laborCost: '浜哄伐鎴愭湰',
- materialCost: '鍘熸枡鎴愭湰',
- equipmentCost: '璁惧璐圭敤',
- totalCost: '鎬绘垚鏈�',
- totalPrice: '鎬绘垚鏈�',
- profit: '鍒╂鼎',
- reviewer: '澶嶈浜�',
- date: '鏃ユ湡'
- }],
- total: 0
- }
- }
-
-
- tableData.value = res.data.list
- pagination.total = res.data.total
+ const res = await getProductionMasterList({...queryParams});
+ tableData.value = res.data.records || [];
+ total.value = res.data.total || 0;
} catch (error) {
- ElMessage.error('鑾峰彇鏁版嵁澶辫触')
+ ElMessage.error("鑾峰彇鏁版嵁澶辫触");
} finally {
- loading.value = false
+ loading.value = false;
}
-}
+};
// 澶勭悊琛ㄦ牸閫夋嫨鍙樺寲
const handleSelectionChange = (selection) => {
- selectedRows.value = selection
-}
+ selectedRows.value = selection;
+};
// 鎼滅储鏂规硶
const handleSearch = () => {
- pagination.currentPage = 1
- getList()
-}
+ pagination.currentPage = 1;
+ getList();
+};
// 閲嶇疆鎼滅储
const handleReset = () => {
- searchForm.keyword = ''
- searchForm.addUser = ''
- handleSearch()
-}
-
-// 鏂板閰嶉」
-const handleAdd = () => {
- dialogType.value = 'add'
- dialogVisible.value = true
-}
+ handleSearch();
+};
// 鏂板鍔犲伐
const handleAddBatch = () => {
- dialogType.value = 'add'
- dialogVisible.value = true
-}
+ dialogType.value = "add";
+ dialogVisible.value = true;
+ childRef.value.Initialization();
+};
// 缂栬緫
const handleEdit = (row) => {
- currentRow.value = row
- dialogType.value = 'edit'
- dialogVisible.value = true
-}
+ currentRow.value = row;
+ dialogType.value = "edit";
+ dialogVisible.value = true;
+};
+
+// 鎵撳紑鐢熶骇鏄庣粏瀵硅瘽妗�
+const handleViewDetail = (row) => {
+ currentDetailRow.value = row;
+ detailDialogVisible.value = true;
+};
// 澶勭悊寮圭獥鎻愪氦
const handleDialogSuccess = async (formData) => {
try {
- if (dialogType.value === 'add') {
- await addProduction(formData)
- ElMessage.success('鏂板鎴愬姛')
+ if (dialogType.value === "add") {
+ await addProduction(formData);
+ ElMessage.success("鏂板鎴愬姛");
} else {
await updateProduction({
...formData,
- id: currentRow.value.id
- })
- ElMessage.success('鏇存柊鎴愬姛')
+ id: currentRow.value.id,
+ });
+ ElMessage.success("鏇存柊鎴愬姛");
}
- getList()
+ getList();
} catch (error) {
- ElMessage.error(dialogType.value === 'add' ? '鏂板澶辫触' : '鏇存柊澶辫触')
+ ElMessage.error(dialogType.value === "add" ? "鏂板澶辫触" : "鏇存柊澶辫触");
}
-}
+};
+
+// 澶勭悊鐢熶骇鏄庣粏寮圭獥鎻愪氦
+const handleDetailDialogSuccess = async (formData) => {
+ try {
+ ElMessage.success("淇濆瓨鎴愬姛");
+ getList();
+ } catch (error) {
+ ElMessage.error("淇濆瓨澶辫触");
+ }
+};
// 鍒犻櫎
const handleDelete = (row) => {
- ElMessageBox.confirm('纭鍒犻櫎璇ヨ褰曞悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(async () => {
- try {
- await deleteProduction(row.id)
- ElMessage.success('鍒犻櫎鎴愬姛')
- getList()
- } catch (error) {
- console.error('鍒犻櫎澶辫触:', error)
- ElMessage.error('鍒犻櫎澶辫触')
- }
- }).catch(() => {
- ElMessage.info('宸插彇娑堝垹闄�')
+ ElMessageBox.confirm("纭鍒犻櫎璇ヨ褰曞悧锛�", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
})
-}
+ .then(async () => {
+ try {
+ await deleteProduction(row.id);
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ getList();
+ } catch (error) {
+ console.error("鍒犻櫎澶辫触:", error);
+ ElMessage.error("鍒犻櫎澶辫触");
+ }
+ })
+ .catch(() => {
+ ElMessage.info("宸插彇娑堝垹闄�");
+ });
+};
// 瀵煎嚭
const handleExport = async (row) => {
try {
- const res = await exportProduction({ id: row.id })
- const blob = new Blob([res], { type: 'application/vnd.ms-excel' })
- const fileName = `鐢熶骇鍔犲伐璁板綍_${new Date().getTime()}.xlsx`
- if ('download' in document.createElement('a')) {
- const elink = document.createElement('a')
- elink.download = fileName
- elink.style.display = 'none'
- elink.href = URL.createObjectURL(blob)
- document.body.appendChild(elink)
- elink.click()
- URL.revokeObjectURL(elink.href)
- document.body.removeChild(elink)
+ const res = await exportProduction({ id: row.id });
+ const blob = new Blob([res], { type: "application/vnd.ms-excel" });
+ const fileName = `鐢熶骇鍔犲伐璁板綍_${new Date().getTime()}.xlsx`;
+ if ("download" in document.createElement("a")) {
+ const elink = document.createElement("a");
+ elink.download = fileName;
+ elink.style.display = "none";
+ elink.href = URL.createObjectURL(blob);
+ document.body.appendChild(elink);
+ elink.click();
+ URL.revokeObjectURL(elink.href);
+ document.body.removeChild(elink);
} else {
- navigator.msSaveBlob(blob, fileName)
+ navigator.msSaveBlob(blob, fileName);
}
} catch (error) {
- ElMessage.error('瀵煎嚭澶辫触')
+ ElMessage.error("瀵煎嚭澶辫触");
}
-}
+};
// 澶勭悊姣忛〉鏄剧ず鏁伴噺鍙樺寲
const handleSizeChange = (val) => {
- pagination.pageSize = val
- getList()
-}
+ pagination.size = val;
+ getList();
+};
// 澶勭悊椤电爜鍙樺寲
const handleCurrentChange = (val) => {
- pagination.currentPage = val
- getList()
-}
+ pagination.currentPage = val;
+ getList();
+};
// 缁勪欢鎸傝浇鏃跺姞杞芥暟鎹�
onMounted(() => {
- getList()
-})
+ getList();
+});
</script>
-<style scoped>
+<style scoped lang="scss">
.production-container {
padding: 20px;
+
+ .el-card:nth-child(1) {
+ margin-bottom: 20px;
+ }
}
.search-bar {
margin-bottom: 20px;
display: flex;
gap: 10px;
-}
-.operation-bar {
+ .el-input {
+ width: 20%;
+ }
+}
+.search-form{
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
margin-bottom: 20px;
- display: flex;
- gap: 10px;
-}
-.pagination {
- margin-top: 20px;
- display: flex;
- justify-content: flex-end;
+ .el-form-item {
+ margin-right: 10px;
+ }
+
+ .el-button {
+ margin-left: 10px;
+ }
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.9.3