From 624faa46fb237709a40db1567e3b708ec24c4222 Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期四, 12 六月 2025 17:30:41 +0800 Subject: [PATCH] 1.巡检管理页面开发 --- src/views/salesOutbound/index.vue | 130 +++++++++++++++++++++++++++++++++---------- 1 files changed, 100 insertions(+), 30 deletions(-) diff --git a/src/views/salesOutbound/index.vue b/src/views/salesOutbound/index.vue index f104b4a..1c28393 100644 --- a/src/views/salesOutbound/index.vue +++ b/src/views/salesOutbound/index.vue @@ -1,33 +1,27 @@ <template> <div class="app-container"> <el-form :inline="true" :model="queryParams" class="search-form"> - <el-form-item label="鎼滅储"> - <el-input - v-model="queryParams.searchText" - placeholder="璇疯緭鍏ュ叧閿瘝" + <el-form-item label="閿�鍞棩鏈�"> + <el-date-picker + v-model="queryParams.saleDate" + type="date" + placeholder="璇烽�夋嫨" + value-format="YYYY-MM-DD" + format="YYYY-MM-DD" clearable - :style="{ width: '100%' }" /> </el-form-item> - <el-form-item label="渚涘簲鍟嗗悕绉�"> + <el-form-item label="瀹㈡埛"> <el-input - v-model="queryParams.supplierName" + v-model="queryParams.customer" placeholder="璇疯緭鍏�" clearable :style="{ width: '100%' }" /> </el-form-item> - <el-form-item label="缁熶竴浜鸿瘑鍒彿"> + <el-form-item label="鐓ょ"> <el-input - v-model="queryParams.identifyNumber" - placeholder="璇疯緭鍏�" - clearable - :style="{ width: '100%' }" - /> - </el-form-item> - <el-form-item label="缁忚惀鍦板潃"> - <el-input - v-model="queryParams.address" + v-model="queryParams.coal" placeholder="璇疯緭鍏�" clearable :style="{ width: '100%' }" @@ -50,38 +44,96 @@ </el-tabs> <!-- 鎿嶄綔鎸夐挳鍖� --> <el-space> - <el-button type="primary" :icon="Plus" @click="handleAdd">鏂板缓</el-button> + <el-button type="primary" :icon="Plus" @click="openDia()">鏂板缓</el-button> <el-button type="danger" :icon="Delete" @click="handleDelete">鍒犻櫎</el-button> - <el-button type="info" :icon="Download" @click="handleExport">瀵煎嚭</el-button> + <el-button type="info" plain :icon="Download" @click="handleExport">瀵煎嚭</el-button> </el-space> + <!-- 琛ㄦ牸缁勪欢 --> + <div> + <ETable :loading="tableLoading" + :table-data="tableData" + :columns="columns" + @selection-change="handleSelectionChange" + :show-selection="true" + :border="true" + :maxHeight="480" + @edit="openDia"></ETable> + </div> + <pagination + v-if="total>0" + :page-num="pageNum" + :page-size="pageSize" + :total="total" + @pagination="handleQuery" + :layout="'total, prev, pager, next, jumper'" + /> </el-card> + <form-dia ref="formDia" @closeDia="handleQuery"></form-dia> </div> </template> <script setup> -import {ref, reactive} from "vue"; +import {ref, reactive, onMounted} from "vue"; +const { proxy } = getCurrentInstance() import {Delete, Download, Plus} from "@element-plus/icons-vue"; +import ETable from "@/components/Table/ETable.vue"; +import Pagination from "@/components/Pagination/index.vue"; +import FormDia from "@/views/salesOutbound/components/formDia.vue"; +import {delSalesRecord, salesRecordList} from "../../api/salesOutbound/index.js"; +const formDia = ref() const activeTab = ref("out"); // 鏍囩椤垫暟鎹� const tabs = reactive([ { name: "out", label: "閿�鍞嚭搴�" }, ]); +// 琛ㄦ牸鏁版嵁 const tableLoading = ref(false); +const tableData = ref([]); +const columns = ref([ + { prop: "saleDate", label: "閿�鍞棩鏈�", minWidth: 160 }, + { prop: "customer", label: "瀹㈡埛", minWidth: 120 }, + { prop: "coal", label: "鐓ょ", minWidth: 150 }, + { prop: "unit", label: "鍗曚綅", minWidth: 150 }, + { prop: "priceIncludingTax", label: "鍗曚环(鍚◣)", minWidth: 150 }, + { prop: "inventoryQuantity", label: "搴撳瓨鏁伴噺", minWidth: 120 }, + { prop: "saleQuantity", label: "閿�鍞暟閲�", minWidth: 120 }, + { prop: "salePrice", label: "閿�鍞崟浠�(鍚◣)", minWidth: 150 }, + { prop: "totalAmount", label: "閿�鍞�讳环(鍚◣)", minWidth: 120 }, + { prop: "freight", label: "杩愯垂", minWidth: 90 }, + { prop: "taxCoal", label: "璐攢鐓ょ◣鐜�(%)", minWidth: 120 }, + { prop: "taxTrans", label: "杩愯緭绋庣巼(%)", minWidth: 120 }, + { prop: "grossProfit", label: "姣涘埄娑�", minWidth: 90 }, + { prop: "netProfit", label: "鍑�鍒╂鼎", minWidth: 90 }, + { prop: "registrant", label: "鐧昏浜�", minWidth: 100 }, + { prop: "registrationDate", label: "鐧昏鏃ユ湡", minWidth: 100 }, +]); +const selectedRows = ref([]); +const total = ref(0); +const pageNum = ref(1); +const pageSize = ref(10); // 鏌ヨ鍙傛暟 const queryParams = reactive({ - searchText: "", - supplierName: "", - identifyNumber: "", - address: "", + saleDate: "", + customer: "", + coal: "", }) - +onMounted(() => { + handleQuery() +}); // 鐐瑰嚮鏌ヨ const handleQuery = () => { + pageNum.value = 1 + pageSize.value = 10 + getList() +} +const getList = () => { tableLoading.value = true; - setTimeout(() => { + salesRecordList({...queryParams, current: pageNum.value, size: pageSize.value}).then(res => { tableLoading.value = false; - }, 500); + tableData.value = res.data.records; + total.value = res.data.total; + }) } // 閲嶇疆鏌ヨ const resetQuery = () => { @@ -93,17 +145,35 @@ handleQuery(); }; // 鏂板鍑哄簱 -const handleAdd = () => { - +const openDia = (row) => { + console.log(row) + const type = row === undefined ? 'add' : 'edit' + nextTick(() => { + formDia.value?.openDialog(type, row) + }) }; // 鍒犻櫎鍑哄簱 const handleDelete = () => { - + if (selectedRows.value.length === 0) { + proxy.$modal.msgWarning("璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁"); + return; + } + const deleteIds = selectedRows.value.map(item => item.id); + proxy.$modal.confirm('鏄惁纭鍒犻櫎鎵�閫夋暟鎹」锛�').then(function() { + return delSalesRecord(deleteIds) + }).then(() => { + handleQuery() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + }).catch(() => {}) }; // 瀵煎嚭鍑哄簱 const handleExport = () => { }; +// 閫夋嫨琛� +const handleSelectionChange = (selection) => { + selectedRows.value = selection; +}; </script> <style scoped> -- Gitblit v1.9.3