From 9b36bf37924e7d9c665837c13832a033754974ae Mon Sep 17 00:00:00 2001 From: maven <2163098428@qq.com> Date: 星期三, 20 八月 2025 13:16:50 +0800 Subject: [PATCH] yys 修改劳保统计表格 --- src/api/lavorissce/ledger.js | 10 src/views/inventoryManagement/index.vue | 309 ++++++++++++++ src/views/lavorissue/statistics/index.vue | 359 +++++++++------- src/views/lavorissue/ledger/index.vue | 559 ++++++++++++------------- 4 files changed, 793 insertions(+), 444 deletions(-) diff --git a/src/api/lavorissce/ledger.js b/src/api/lavorissce/ledger.js index 90730c1..f4f710c 100644 --- a/src/api/lavorissce/ledger.js +++ b/src/api/lavorissce/ledger.js @@ -1,7 +1,7 @@ import request from '@/utils/request' // 鍒嗛〉鏌ヨ -export function lavorIssueListPage(query) { +export function listPage(query) { return request({ url: '/lavorIssue/listPage', method: 'get', @@ -18,6 +18,14 @@ }) } +export function statisticsList(params) { + return request({ + url: '/lavorIssue/statisticsList', + method: 'get', + params + }) +} + // 娣诲姞 export function add(data) { return request({ diff --git a/src/views/inventoryManagement/index.vue b/src/views/inventoryManagement/index.vue new file mode 100644 index 0000000..5e97bcb --- /dev/null +++ b/src/views/inventoryManagement/index.vue @@ -0,0 +1,309 @@ +<template> + <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="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 { ref, onMounted, reactive, toRefs, nextTick, getCurrentInstance } from 'vue' +import dayjs from "dayjs"; +import Modal from "./Modal.vue"; +import FilesDia from "./filesDia.vue"; +import Pagination from "@/components/Pagination/index.vue"; +import {lavorIssueListPage, deleteLedger, update} from "@/api/lavorissce/ledger.js"; +import {ElMessageBox, ElMessage} from "element-plus"; +const { proxy } = getCurrentInstance(); +import { getCurrentMonth } from "@/utils/util" + +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: { + season: "", + staffName: "", + }, +}); +const { searchForm } = toRefs(data); + +const modalRef = ref(); +const filesDia = ref(); +const multipleList = ref([]); +const jidu = ref([ + { + value: '1', + label: '绗竴瀛e害' + }, + { + value: '2', + label: '绗簩瀛e害' + }, + { + value: '3', + label: '绗笁瀛e害' + }, + { + value: '4', + label: '绗洓瀛e害' + } +]) + +/** 鎼滅储鎸夐挳鎿嶄綔 */ +const handleQuery = () => { + page.value.current = 1; + getList(); +}; +// 鑾峰彇瀛楀吀鏁版嵁 +const getList = async () => { + tableLoading.value = true; + const params = { ...searchForm.value, ...page.value }; + lavorIssueListPage(params).then(res => { + tableLoading.value = false; + tableData.value = res.data.records; + total.value = 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: "鍒犻櫎鎴愬姛", + }); + await getList(); + } + }); +}; +const handleOut = () => { + ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", { + confirmButtonText: "纭", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + proxy.download(`/lavorIssue/exportCopy`, {season: searchForm.value.season}, "鍔充繚鍙拌处.xlsx"); + }) + .catch(() => { + ElMessage.info("宸插彇娑�"); + }); +}; +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: "棰嗙敤鎴愬姛", + }); + await getList(); + } + }) +} +// 鎵撳紑闄勪欢寮规 +const openFilesFormDia = (row) => { + nextTick(() => { + filesDia.value?.openDialog( row,'鏀跺叆') + }) +}; +// 浜嬩欢澶勭悊鍑芥暟 +const handleSelectionChange = (selection) => { + multipleList.value = selection; +} + +const paginationChange = (pagination) => { + page.value.current = pagination.page; + page.value.size = pagination.limit; + getList(); +} + +// 缁勪欢鎸傝浇鏃跺姞杞藉瓧鍏告暟鎹� +onMounted(() => { + handleQuery() +}) +</script> + +<style scoped> +.dynamic-table-container { + width: 100%; +} + +.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> diff --git a/src/views/lavorissue/ledger/index.vue b/src/views/lavorissue/ledger/index.vue index 33a1461..6b7e5a8 100644 --- a/src/views/lavorissue/ledger/index.vue +++ b/src/views/lavorissue/ledger/index.vue @@ -1,319 +1,300 @@ <template> - <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> + <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> </template> <script setup> -import { ref, onMounted, reactive, toRefs, nextTick, getCurrentInstance } from 'vue' -import dayjs from "dayjs"; +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 dayjs from "dayjs"; import FilesDia from "./filesDia.vue"; -import Pagination from "@/components/Pagination/index.vue"; -import {lavorIssueListPage, deleteLedger, update} from "@/api/lavorissce/ledger.js"; -import {ElMessageBox, ElMessage} from "element-plus"; -const { proxy } = getCurrentInstance(); import { getCurrentMonth } from "@/utils/util" -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: { - season: "", - staffName: "", - }, -}); -const { searchForm } = toRefs(data); - -const modalRef = ref(); -const filesDia = ref(); +// 琛ㄦ牸澶氶�夋閫変腑椤� const multipleList = ref([]); +const { proxy } = getCurrentInstance(); +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 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 = () => { - page.value.current = 1; - getList(); + getTableData(); }; -// 鑾峰彇瀛楀吀鏁版嵁 -const getList = async () => { - tableLoading.value = true; - const params = { ...searchForm.value, ...page.value }; - lavorIssueListPage(params).then(res => { - tableLoading.value = false; - tableData.value = res.data.records; - total.value = res.data.total; - }).catch(err => { - tableLoading.value = false; - }) -} -const add = () => { - modalRef.value.openModal(); -}; -const edit = (row) => { - modalRef.value.loadForm(row); +const changePage = ({ page, limit }) => { + pagination.currentPage = page; + pagination.pageSize = limit; + onCurrentChange(page); }; const deleteRow = (id) => { - ElMessageBox.confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ暟鎹�, 鏄惁缁х画?", "鎻愮ず", { - confirmButtonText: "纭畾", - cancelButtonText: "鍙栨秷", - type: "warning", - }).then(async () => { - const { code } = await deleteLedger(id); - if (code == 200) { - ElMessage({ - type: "success", - message: "鍒犻櫎鎴愬姛", - }); - getList(); - } - }); + 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: searchForm.value.season}, "鍔充繚鍙拌处.xlsx"); - }) - .catch(() => { - ElMessage.info("宸插彇娑�"); - }); + 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: "棰嗙敤鎴愬姛", - }); - getList(); - } - }) -} // 鎵撳紑闄勪欢寮规 const openFilesFormDia = (row) => { - nextTick(() => { - filesDia.value?.openDialog( row,'鏀跺叆') - }) + nextTick(() => { + filesDia.value?.openDialog( row,'鏀跺叆') + }) }; -// 浜嬩欢澶勭悊鍑芥暟 -const handleSelectionChange = (selection) => { - multipleList.value = selection; -} -const paginationChange = (pagination) => { - page.value.current = pagination.page; - page.value.size = pagination.limit; - getList(); -} - -// 缁勪欢鎸傝浇鏃跺姞杞藉瓧鍏告暟鎹� onMounted(() => { - handleQuery() -}) + 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(); +}); </script> -<style scoped> -.dynamic-table-container { - width: 100%; +<style lang="scss" scoped> +.table_list { + margin-top: unset; } - -.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%; +.actions { + display: flex; + justify-content: space-between; + margin-bottom: 10px; } </style> + diff --git a/src/views/lavorissue/statistics/index.vue b/src/views/lavorissue/statistics/index.vue index 5c6f286..2c34f67 100644 --- a/src/views/lavorissue/statistics/index.vue +++ b/src/views/lavorissue/statistics/index.vue @@ -1,67 +1,141 @@ <template> <div class="app-container"> - <el-form :model="filters" :inline="true"> - <el-form-item label="鍙戞斁瀛e害:" prop="season"> + <div class="search_form"> + <div> + <span class="search_title">鍙戞斁瀛e害锛�</span> <el-select - :disabled="filters.issueDate ? true : false" style="width: 200px;" - @change="getList" - v-model="filters.season" + @change="handleQuery" + v-model="searchForm.season" placeholder="璇烽�夋嫨" + @clear="clearSeason" clearable + :disabled="searchForm.issueDate ? true : false" + > - <el-option :label="item.label" :value="item.value" v-for="(item,index) in jidu" :key="value" /> + <el-option :label="item.label" :value="item.value" v-for="(item,index) in jidu" :key="item.value" /> </el-select> - </el-form-item> - <el-form-item label="鍙戞斁鏈堜唤:" prop="issueDate"> + <span class="search_title ml10">鍙戞斁鏈堜唤锛�</span> <el-date-picker - :disabled="filters.season ? true : false" - v-model="filters.issueDate" - @change="getList" + style="width: 200px;" + :disabled="searchForm.season ? true : false" + v-model="searchForm.issueDate" + @change="handleQuery" + @clear="clearIssueDaten" type="month" value-format="YYYY-MM-DD" format="YYYY-MM" placeholder="璇烽�夋嫨鏈堜唤" clearable - style="width: 100%" /> - </el-form-item> - <el-form-item> - <el-button type="primary" @click="getList">鎼滅储</el-button> - <el-button @click="resetParams">閲嶇疆</el-button> - </el-form-item> - </el-form> + <el-button type="primary" @click="handleQuery" style="margin-left: 10px" + >鎼滅储</el-button + > + <el-button type="primary" @click="resetHandleQuery" style="margin-left: 10px" + >閲嶇疆</el-button + > + </div> + <div> + <el-button @click="handleOut" icon="download">瀵煎嚭</el-button> + </div> + </div> <div class="table_list"> <div class="actions"> - <div class="head" @click="getList(1)">宸查鍙栧姵淇濇暟閲�:{{statisticsObj.ylqNum}}</div> - <div class="head" @click="getList(2)">鏈鍙栧姵淇濇暟閲�: {{ statisticsObj.wlqNum }}</div> - <div class="head" @click="getList(3)">瓒呮椂宸查鍙栧姵淇濇暟閲�: {{statisticsObj.csylqNum}}</div> - <div class="head" @click="getList(4)">瓒呮椂鏈鍙栧姵淇濇暟閲�: {{statisticsObj.cswlqNum}}</div> + <div class="head" @click="handleQuery(1)">宸查鍙栧姵淇濇暟閲�:{{statisticsObj.ylqNum}}</div> + <div class="head" @click="handleQuery(2)">鏈鍙栧姵淇濇暟閲�: {{ statisticsObj.wlqNum }}</div> + <div class="head" @click="handleQuery(3)">瓒呮椂宸查鍙栧姵淇濇暟閲�: {{statisticsObj.csylqNum}}</div> + <div class="head" @click="handleQuery(4)">瓒呮椂鏈鍙栧姵淇濇暟閲�: {{statisticsObj.cswlqNum}}</div> </div> - <PIMTable - rowKey="id" - isSelection - :column="columns" - :tableData="dataList" - :page="{ - current: pagination.currentPage, - size: pagination.pageSize, - total: pagination.total, - }" + <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" - @pagination="changePage" > - </PIMTable> + <!-- 閫夋嫨鍒� --> + <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="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> </div> </div> </template> <script setup> -import { usePaginationApi } from "@/hooks/usePaginationApi"; -import {lavorIssueListPage, statistics} from "@/api/lavorissce/ledger"; -import { onMounted } from "vue"; +import { ref, onMounted, reactive, toRefs, nextTick, getCurrentInstance } from 'vue' +import dayjs from "dayjs"; +import {statisticsList, statistics} from "@/api/lavorissce/ledger.js"; +import {ElMessageBox, ElMessage} from "element-plus"; +const { proxy } = getCurrentInstance(); +import { getCurrentMonth } from "@/utils/util" -// 琛ㄦ牸澶氶�夋閫変腑椤� +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: { + season: getCurrentMonth(), + issueDate: "", + status: 0 + }, +}); +const { searchForm } = toRefs(data); + +const modalRef = ref(); +const filesDia = ref(); const multipleList = ref([]); const jidu = ref([ { @@ -81,148 +155,126 @@ label: '绗洓瀛e害' } ]) +const clearSeason = () => { + console.log("req") + searchForm.value.season = "" + searchForm.value.issueDate = dayjs().format("YYYY-MM-DD"); +} -const { - filters, - columns, - dataList, - pagination, - getTableData, - resetFilters, - onCurrentChange, -} = usePaginationApi( - lavorIssueListPage, - { - season: '', - issueDate: '', - status: 0 - }, - [ - { - 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", - - } - ] -); +const clearIssueDaten = () => { + searchForm.value.issueDate = "" + searchForm.value.season = getCurrentMonth() +} const statisticsObj = ref({ ylqNum: 0, // 宸查鍙栨暟閲� wlqNum: 0, // 鏈鍙栨暟閲� csylqNum: 0, // 瓒呮椂宸查鍙栨暟閲� cswlqNum: 0 // 瓒呮椂鏈鍙栨暟閲� }) - -const resetParams = () => { - resetFilters(); - getStatistics(); -}; - -// 澶氶�夊悗鍋氫粈涔� -const handleSelectionChange = (selectionList) => { - multipleList.value = selectionList; -}; -const getList = (status) => { - switch (status){ - case 1: - filters.status = 1 - break; - case 2: - filters.status = 2 - break; - case 3: - filters.status = 3 - break; - case 4: - filters.status = 4 - break; - default: - filters.status = 0 - } - console.log(filters) - getTableData(); - getStatistics(); +const resetHandleQuery = () => { + searchForm.value.issueDate = ""; + searchForm.value.season = getCurrentMonth(); + handleQuery(0) }; /** 鎼滅储鎸夐挳鎿嶄綔 */ -const handleQuery = () => { - pagination.current = 1; - getTableData(); +const handleQuery = (status) => { + switch (status){ + case 1: + searchForm.value.status = 1 + break; + case 2: + searchForm.value.status = 2 + break; + case 3: + searchForm.value.status = 3 + break; + case 4: + searchForm.value.status = 4 + break; + default: + searchForm.value.status = 0 + } + getList(); + getStatistics(); }; -const changePage = ({ page, limit }) => { - pagination.currentPage = page; - pagination.pageSize = limit; - onCurrentChange(page); -}; + const getStatistics = () => { - statistics(filters).then(res => { + statistics(searchForm.value).then(res => { statisticsObj.value.cswlqNum = res.data.cswlqNum statisticsObj.value.csylqNum = res.data.csylqNum statisticsObj.value.ylqNum = res.data.ylqNum statisticsObj.value.wlqNum = res.data.wlqNum }) } +// 鑾峰彇瀛楀吀鏁版嵁 +const getList = async () => { + tableLoading.value = true; + const params = { ...searchForm.value}; + statisticsList(params).then(res => { + tableLoading.value = false; + tableData.value = res.data; + }).catch(err => { + tableLoading.value = false; + }) +} +const handleOut = () => { + ElMessageBox.confirm("閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�", "瀵煎嚭", { + confirmButtonText: "纭", + cancelButtonText: "鍙栨秷", + type: "warning", + }) + .then(() => { + proxy.download(`/lavorIssue/exportCopy`, {season: searchForm.value.season,issueDate: searchForm.value.issueDate}, "鍔充繚鍙拌处.xlsx"); + }) + .catch(() => { + ElMessage.info("宸插彇娑�"); + }); +}; +// 浜嬩欢澶勭悊鍑芥暟 +const handleSelectionChange = (selection) => { + multipleList.value = selection; +} + +// 缁勪欢鎸傝浇鏃跺姞杞藉瓧鍏告暟鎹� onMounted(() => { - getList() -}); + handleQuery() +}) </script> -<style lang="scss" scoped> -.table_list { - margin-top: unset; +<style scoped> +.dynamic-table-container { + width: 100%; +} + +.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%; } .actions { display: flex; justify-content: space-around; align-items: center; - //margin-top: 20px; margin-bottom: 30px; } .head{ @@ -231,4 +283,3 @@ font-weight: 600; } </style> - -- Gitblit v1.9.3