From c4b339705e5d2d1a33f4f3d6b5d7e19ac7d68faa Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期三, 20 八月 2025 10:14:27 +0800 Subject: [PATCH] 劳保台账修改 --- src/views/lavorissue/ledger/index.vue | 556 ++++++++++++++++++++++++++++--------------------------- 1 files changed, 285 insertions(+), 271 deletions(-) diff --git a/src/views/lavorissue/ledger/index.vue b/src/views/lavorissue/ledger/index.vue index 13b9cf5..b23bffe 100644 --- a/src/views/lavorissue/ledger/index.vue +++ b/src/views/lavorissue/ledger/index.vue @@ -1,300 +1,314 @@ <template> - <div class="app-container"> - <el-form :model="filters" :inline="true"> - <el-form-item label="鍙戞斁瀛e害:" prop="season"> - <el-select - style="width: 200px;" - @change="handleQuery" - v-model="filters.season" - placeholder="璇烽�夋嫨" - :clearable="false" - > - <el-option :label="item.label" :value="item.value" v-for="(item,index) in jidu" :key="value" /> - </el-select> - </el-form-item> - <el-form-item label="鍛樺伐鍚嶇О:"> - <el-input - v-model="filters.staffName" - style="width: 240px" - placeholder="璇疯緭鍏�" - @change="handleQuery" - clearable - prefix-icon="Search" - /> - </el-form-item> - <el-form-item> - <el-button type="primary" @click="getTableData">鎼滅储</el-button> - <el-button @click="resetFilters">閲嶇疆</el-button> - </el-form-item> - </el-form> - <div class="table_list"> - <div class="actions"> - <div></div> - <div> - <el-button type="primary" @click="add" icon="Plus"> 鏂板 </el-button> - <el-button @click="handleOut" icon="download">瀵煎嚭</el-button> - <el-button - type="danger" - icon="Delete" - :disabled="multipleList.length <= 0" - @click="deleteRow(multipleList.map((item) => item.id))" - > - 鎵归噺鍒犻櫎 - </el-button> - </div> - </div> - <PIMTable - rowKey="id" - isSelection - :column="columns" - :tableData="dataList" - :page="{ - current: pagination.currentPage, - size: pagination.pageSize, - total: pagination.total, - }" - @selection-change="handleSelectionChange" - @pagination="changePage" - > - <template #operation="{ row }"> - <el-button type="primary" text @click="edit(row)" icon="editPen"> - 缂栬緫 - </el-button> - <el-button type="primary" :disabled="row.adoptedDate ? true : false" text @click="adopted(row)"> - 棰嗙敤 - </el-button> - </template> - </PIMTable> - </div> - <Modal ref="modalRef" @success="getTableData"></Modal> - <files-dia ref="filesDia"></files-dia> - </div> + <div class="app-container"> + <div class="search_form"> + <div> + <span class="search_title">鍙戞斁瀛e害锛�</span> + <el-select + style="width: 200px;" + @change="handleQuery" + v-model="searchForm.season" + placeholder="璇烽�夋嫨" + :clearable="false" + > + <el-option :label="item.label" :value="item.value" v-for="(item,index) in jidu" :key="item.value" /> + </el-select> + <span class="search_title ml10">鍛樺伐鍚嶇О锛�</span> + <el-input + v-model="searchForm.staffName" + style="width: 240px" + placeholder="璇疯緭鍏�" + @change="handleQuery" + clearable + prefix-icon="Search" + /> + <el-button type="primary" @click="handleQuery" style="margin-left: 10px" + >鎼滅储</el-button + > + </div> + <div> + <el-button type="primary" @click="add" icon="Plus"> 鏂板 </el-button> + <el-button @click="handleOut" icon="download">瀵煎嚭</el-button> + <el-button + type="danger" + icon="Delete" + :disabled="multipleList.length <= 0" + @click="deleteRow(multipleList.map((item) => item.id))" + > + 鎵归噺鍒犻櫎 + </el-button> + </div> + </div> + <div class="table_list"> + <el-table + ref="tableRef" + v-loading="tableLoading" + :data="tableData" + border + height="calc(100vh - 21em)" + :header-cell-style="{ background: '#F0F1F5', color: '#333333' }" + style="width: 100%" + @selection-change="handleSelectionChange" + > + <!-- 閫夋嫨鍒� --> + <el-table-column + align="center" + type="selection" + width="55" + fixed="left" + /> + + <!-- 搴忓彿鍒� --> + <el-table-column + align="center" + label="搴忓彿" + type="index" + width="60" + fixed="left" + /> + + <!-- 鍥哄畾鍒楋細閮ㄩ棬 --> +<!-- <el-table-column--> +<!-- label="閮ㄩ棬"--> +<!-- prop="deptName"--> +<!-- width="120"--> +<!-- show-overflow-tooltip--> +<!-- align="center"--> +<!-- fixed="left"--> +<!-- />--> + + <!-- 鍥哄畾鍒楋細濮撳悕 --> + <el-table-column + label="濮撳悕" + prop="staffName" + width="100" + show-overflow-tooltip + align="center" + fixed="left" + /> + + <!-- 鍥哄畾鍒楋細宸ュ彿 --> + <el-table-column + label="宸ュ彿" + prop="staffNo" + width="100" + show-overflow-tooltip + align="center" + fixed="left" + /> + + <!-- 鍔ㄦ�佸垪锛氭牴鎹瓧鍏告覆鏌� --> + <el-table-column + v-for="(dictItem, index) in sys_lavor_issue" + :key="dictItem.value" + :label="dictItem.label" + :prop="dictItem.value" + show-overflow-tooltip + > + </el-table-column> + + <!-- 鎿嶄綔鍒� --> + <el-table-column + label="鎿嶄綔" + width="150" + align="center" + fixed="right" + > + <template #default="scope"> + <el-button + type="primary" + link + size="small" + @click="edit(scope.row)" + > + 缂栬緫 + </el-button> + <el-button + type="danger" + link + size="small" + :disabled="!!scope.row.adoptedDate" + @click="adopted(scope.row)" + > + 棰嗙敤 + </el-button> + </template> + </el-table-column> + </el-table> + <pagination :total="total" layout="total, sizes, prev, pager, next, jumper" + :page="page.current" :limit="page.size" @pagination="paginationChange" /> + </div> + <Modal ref="modalRef" @success="handleQuery"></Modal> + <files-dia ref="filesDia"></files-dia> + </div> </template> <script setup> -import { usePaginationApi } from "@/hooks/usePaginationApi"; -import { listPage,deleteLedger,update } from "@/api/lavorissce/ledger"; -import { onMounted, getCurrentInstance } from "vue"; -import Modal from "./Modal.vue"; -import { ElMessageBox, ElMessage } from "element-plus"; +import { ref, onMounted } from 'vue' import dayjs from "dayjs"; +import Modal from "./Modal.vue"; import FilesDia from "./filesDia.vue"; -import { getCurrentMonth } from "@/utils/util" - -// 琛ㄦ牸澶氶�夋閫変腑椤� -const multipleList = ref([]); +import {lavorIssueListPage} from "@/api/lavorissce/ledger.js"; +import {ElMessageBox} from "element-plus"; const { proxy } = getCurrentInstance(); + +const page = ref({ + current: 1, + size: 100, +}) +const total = ref(0) +// 鍝嶅簲寮忔暟鎹� +const tableRef = ref(null) +const tableData = ref([]) +const tableLoading = ref(false) +const { sys_lavor_issue } = proxy.useDict("sys_lavor_issue") +const data = reactive({ + searchForm: { + feedbackDate: "", + disDate: "", + }, +}); const modalRef = ref(); -const { payment_methods } = proxy.useDict("payment_methods"); -const { income_types } = proxy.useDict("income_types"); -const filesDia = ref() - -const { - filters, - columns, - dataList, - pagination, - getTableData, - resetFilters, - onCurrentChange, -} = usePaginationApi( - listPage, - { - staffName: '', - season: getCurrentMonth(), - }, - [ - { - label: "鍔充繚鍗曞彿", - align: "center", - prop: "orderNo", - }, - { - label: "鍛樺伐鍚嶇О", - align: "center", - prop: "staffName", - }, - { - label: "鍛樺伐缂栧彿", - align: "center", - prop: "staffNo" - }, - - { - label: "鍔充繚绫诲瀷", - align: "center", - prop: "dictTypeName", - - }, - { - label: "鍔充繚闃插叿", - align: "center", - prop: "dictName", - - }, - { - label: "鍙戞斁鏁伴噺", - align: "center", - prop: "num", - - }, - { - label: "杩涘巶鏃ユ湡", - align: "center", - prop: "factoryDate", - - }, - { - label: "鍙戞斁鏃ユ湡", - align: "center", - prop: "issueDate", - - }, - { - label: "棰嗙敤鏃ユ湡", - align: "center", - prop: "adoptedDate", - - }, - { - fixed: "right", - label: "鎿嶄綔", - dataType: "slot", - slot: "operation", - align: "center", - width: "200px", - }, - ] -); - +const filesDia = ref(); +const { searchForm } = toRefs(data); +const multipleList = ref([]); const jidu = ref([ - { - value: '1', - label: '绗竴瀛e害' - }, - { - value: '2', - label: '绗簩瀛e害' - }, - { - value: '3', - label: '绗笁瀛e害' - }, - { - value: '4', - label: '绗洓瀛e害' - } + { + value: '1', + label: '绗竴瀛e害' + }, + { + value: '2', + label: '绗簩瀛e害' + }, + { + value: '3', + label: '绗笁瀛e害' + }, + { + value: '4', + label: '绗洓瀛e害' + } ]) - -// 澶氶�夊悗鍋氫粈涔� -const handleSelectionChange = (selectionList) => { - multipleList.value = selectionList; -}; - -const adopted = (row) => { - ElMessageBox.confirm("鏄惁纭棰嗙敤?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", - }).then(async () => { - const params = { - id: row.id, - adoptedDate: dayjs().format("YYYY-MM-DD") - } - const { code } = await update(params); - if (code == 200) { - ElMessage({ - type: "success", - message: "棰嗙敤鎴愬姛", - }); - getTableData(); - } - }) -} - -const add = () => { - modalRef.value.openModal(); -}; -const edit = (row) => { - modalRef.value.loadForm(row); -}; /** 鎼滅储鎸夐挳鎿嶄綔 */ const handleQuery = () => { - getTableData(); + page.current = 1; + getList(); }; -const changePage = ({ page, limit }) => { - pagination.currentPage = page; - pagination.pageSize = limit; - onCurrentChange(page); +// 鑾峰彇瀛楀吀鏁版嵁 +const getList = async () => { + tableLoading.value = true; + lavorIssueListPage().then(res => { + tableLoading.value = false; + tableData.value = res.data.records; + page.total = res.data.total; + }).catch(err => { + tableLoading.value = false; + }) +} +const add = () => { + modalRef.value.openModal(); +}; +const edit = (row) => { + modalRef.value.loadForm(row); }; const deleteRow = (id) => { - ElMessageBox.confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ暟鎹�, 鏄惁缁х画?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", - }).then(async () => { - const { code } = await deleteLedger(id); - if (code == 200) { - ElMessage({ - type: "success", - message: "鍒犻櫎鎴愬姛", - }); - getTableData(); - } - }); + ElMessageBox.confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ暟鎹�, 鏄惁缁х画?", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }).then(async () => { + const { code } = await deleteLedger(id); + if (code == 200) { + ElMessage({ + type: "success", + message: "鍒犻櫎鎴愬姛", + }); + getTableData(); + } + }); }; - -const changeDaterange = (value) => { - if (value) { - filters.entryDateStart = dayjs(value[0]).format("YYYY-MM-DD"); - filters.entryDateEnd = dayjs(value[1]).format("YYYY-MM-DD"); - } else { - filters.entryDateStart = undefined; - filters.entryDateEnd = undefined; - } - getTableData(); -}; - const handleOut = () => { - ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", { - confirmButtonText: "纭", - cancelButtonText: "鍙栨秷", - type: "warning", - }) - .then(() => { - proxy.download(`/lavorIssue/exportCopy`, {season: filters.season}, "鍔充繚鍙拌处.xlsx"); - }) - .catch(() => { - proxy.$modal.msg("宸插彇娑�"); - }); + ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", { + confirmButtonText: "纭", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + proxy.download(`/lavorIssue/exportCopy`, {season: filters.season}, "鍔充繚鍙拌处.xlsx"); + }) + .catch(() => { + proxy.$modal.msg("宸插彇娑�"); + }); }; +const adopted = (row) => { + ElMessageBox.confirm("鏄惁纭棰嗙敤?", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }).then(async () => { + const params = { + id: row.id, + adoptedDate: dayjs().format("YYYY-MM-DD") + } + const { code } = await update(params); + if (code == 200) { + ElMessage({ + type: "success", + message: "棰嗙敤鎴愬姛", + }); + getTableData(); + } + }) +} // 鎵撳紑闄勪欢寮规 const openFilesFormDia = (row) => { - nextTick(() => { - filesDia.value?.openDialog( row,'鏀跺叆') - }) + nextTick(() => { + filesDia.value?.openDialog( row,'鏀跺叆') + }) }; +// 浜嬩欢澶勭悊鍑芥暟 +const handleSelectionChange = (selection) => { + multipleList.value = selection; +} +const paginationChange = (size) => { + console.log(size) + +} + +// 缁勪欢鎸傝浇鏃跺姞杞藉瓧鍏告暟鎹� onMounted(() => { - filters.entryDate = [ - dayjs().format("YYYY-MM-DD"), - dayjs().add(1, "day").format("YYYY-MM-DD"), - ] - filters.entryDateStart = dayjs().format("YYYY-MM-DD") - filters.entryDateEnd = dayjs().add(1, "day").format("YYYY-MM-DD") - getTableData(); -}); + handleQuery() +}) </script> -<style lang="scss" scoped> -.table_list { - margin-top: unset; +<style scoped> +.dynamic-table-container { + width: 100%; } -.actions { - display: flex; - justify-content: space-between; - margin-bottom: 10px; + +.pagination-container { + margin-top: 20px; + display: flex; + justify-content: flex-end; +} + +:deep(.el-table .el-table__header-wrapper th) { + background-color: #F0F1F5 !important; + color: #333333; + font-weight: 600; +} + +:deep(.el-table .el-table__body-wrapper td) { + padding: 8px 0; +} + +:deep(.el-select) { + width: 100%; +} + +:deep(.el-input) { + width: 100%; } </style> - -- Gitblit v1.9.3