From 81a88342f02e185abae52c19e3cd6ce734aa04a3 Mon Sep 17 00:00:00 2001 From: chenrui <1187576398@qq.com> Date: 星期二, 13 五月 2025 16:53:32 +0800 Subject: [PATCH] 开票台账前后端联调 --- src/views/salesManagement/invoiceLedger/index.vue | 471 ++++++++++++++++++++++++++++++++++++++++++++++++++++ src/api/salesManagement/invoiceLedger.js | 48 +++++ src/views/salesManagement/invoiceRegistration/index.vue | 1 3 files changed, 519 insertions(+), 1 deletions(-) diff --git a/src/api/salesManagement/invoiceLedger.js b/src/api/salesManagement/invoiceLedger.js new file mode 100644 index 0000000..598a973 --- /dev/null +++ b/src/api/salesManagement/invoiceLedger.js @@ -0,0 +1,48 @@ +// 寮�绁ㄥ彴璐﹂〉闈㈡帴鍙� +import request from '@/utils/request' + +// 鍒嗛〉鏌ヨ +export function invoiceLedgerList(query) { + return request({ + url: '/invoiceLedger/page', + method: 'get', + params: query + }) +} + +// 鏂板 +export function invoiceLedgerSaveOrUpdate(query) { + return request({ + url: '/invoiceLedger/saveOrUpdate', + method: 'post', + data: query + }) +} + +// 寮�绁ㄥ彴璐﹀垹闄� +export function invoiceLedgerDel(query) { + return request({ + url: '/invoiceLedger/del', + method: 'delete', + data: query + }) +} + +// 璇︽儏鏌ヨ +export function invoiceLedgerDetail(query) { + return request({ + url: '/invoiceLedger/info', + method: 'get', + params: query + }) +} + +// 闄勪欢鎻愪氦 +export function commitFile(query) { + return request({ + url: '/invoiceLedger/commitFile', + method: 'post', + data: query + }) +} + diff --git a/src/views/salesManagement/invoiceLedger/index.vue b/src/views/salesManagement/invoiceLedger/index.vue new file mode 100644 index 0000000..f7669cc --- /dev/null +++ b/src/views/salesManagement/invoiceLedger/index.vue @@ -0,0 +1,471 @@ +<template> + <div class="app-container"> + <div class="search_form"> + <div> + <span class="search_title">寮�绁ㄥ彴璐︼細</span> + <el-input + v-model="searchForm.searchText" + style="width: 240px" + placeholder="杈撳叆瀹㈡埛鍚嶇О/鍚堝悓鍙锋悳绱�" + @change="handleQuery" + clearable + :prefix-icon="Search" + /> + <span class="search_title">寮�绁ㄦ棩鏈燂細</span> + <el-date-picker + style="width: 240px" + v-model="form.invoiceDate" + value-format="YYYY-MM-DD" + format="YYYY-MM-DD" + type="date" + placeholder="璇烽�夋嫨" + clearable + /> + <el-button type="primary" @click="handleQuery" style="margin-left: 10px">鎼滅储</el-button> + </div> + <div> + <el-button type="primary" @click="openForm('add')">鏂板鍙拌处</el-button> + <el-button @click="handleOut">瀵煎嚭</el-button> + <el-button type="danger" plain @click="handleDelete">鍒犻櫎</el-button> + </div> + </div> + <div class="table_list"> + <el-table :data="tableData" border v-loading="tableLoading" + @selection-change="handleSelectionChange" + :row-key="row => row.id" + show-summary + :summary-method="summarizeMainTable" + height="calc(100vh - 18.5em)"> + <el-table-column align="center" type="selection" width="55" /> + <el-table-column align="center" label="搴忓彿" type="index" width="60" /> + <el-table-column label="閿�鍞悎鍚屽彿" prop="salesContractNo" show-overflow-tooltip/> + <el-table-column label="瀹㈡埛鍚堝悓鍙�" prop="customerContractNo" show-overflow-tooltip/> + <el-table-column label="瀹㈡埛鍚嶇О" prop="customerName" show-overflow-tooltip/> + <el-table-column label="鍙戠エ鍙�" prop="invoiceNo" show-overflow-tooltip/> + <el-table-column label="鍙戠エ閲戦(鍏�)" prop="invoiceAmount" show-overflow-tooltip/> + <el-table-column label="绋庣巼" prop="taxRate" show-overflow-tooltip/> + <el-table-column label="寮�绁ㄤ汉" prop="invoicePerson" show-overflow-tooltip/> + <el-table-column label="寮�绁ㄦ棩鏈�" prop="invoiceDate" show-overflow-tooltip/> + <el-table-column label="鍙戠エ" prop="invoiceDate" show-overflow-tooltip> + <template #default="scope"> + <span v-if="scope.row.invoiceFileName">{{ scope.row.invoiceFileName }}</span> + <el-button v-else link type="primary" @click="handleDownload(scope.row)">涓婁紶</el-button> + </template> + </el-table-column> + <el-table-column fixed="right" label="鎿嶄綔" min-width="60" align="center"> + <template #default="scope"> + <el-button link type="primary" size="small" @click="openForm('edit', scope.row);">缂栬緫</el-button> + </template> + </el-table-column> + </el-table> + <pagination v-show="total > 0" :total="total" layout="total, sizes, prev, pager, next, jumper" :page="page.current" + :limit="page.size" @pagination="paginationChange" /> + </div> + <el-dialog v-model="dialogFormVisible" :title="operationType === 'add' ? '鏂板寮�绁ㄥ彴璐﹂〉闈�' : '缂栬緫寮�绁ㄥ彴璐﹂〉闈�'" width="70%" @close="closeDia"> + <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef"> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="閿�鍞悎鍚屽彿锛�" prop="salesLedgerId"> + <el-select v-model="form.salesLedgerId" placeholder="璇烽�夋嫨" clearable @change="ledgerChange" :disabled="operationType === 'edit'"> + <el-option v-for="item in ledgerList" :key="item.id" :label="item.salesContractNo" :value="item.id"/> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="瀹㈡埛鍚嶇О锛�" prop="customerName"> + <el-input v-model="form.customerName" placeholder="鑷姩濉厖" clearable :disabled="operationType === 'edit'"/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="鍙戠エ鍙凤細" prop="invoiceNo"> + <el-input v-model="form.invoiceNo" placeholder="璇疯緭鍏�" clearable/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鍙戠エ閲戦(鍏�)锛�" prop="invoiceAmount"> + <el-input type="number" :step="0.01" v-model="form.invoiceAmount" placeholder="璇疯緭鍏�" clearable/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="绋庣巼锛�" prop="taxRate"> + <el-input type="number" :step="0.01" v-model="form.taxRate" placeholder="璇疯緭鍏�" clearable/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="寮�绁ㄤ汉锛�" prop="invoicePerson"> + <el-input v-model="form.invoicePerson" placeholder="璇疯緭鍏�" clearable/> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="12"> + <el-form-item label="寮�绁ㄦ棩鏈燂細" prop="invoiceDate"> + <el-date-picker + style="width: 100%" + v-model="form.invoiceDate" + value-format="YYYY-MM-DD" + format="YYYY-MM-DD" + type="date" + placeholder="璇烽�夋嫨" + clearable + /> + </el-form-item> + </el-col> + </el-row> + <el-row :gutter="30"> + <el-col :span="24"> + <el-form-item label="闄勪欢鏉愭枡锛�" prop="remark"> + <el-upload + v-model:file-list="fileList" + :action="upload.url" + multiple + ref="fileUpload" + auto-upload + :headers="upload.headers" + :before-upload="handleBeforeUpload" + :on-error="handleUploadError" + :on-success="handleUploadSuccess" + :on-remove="handleRemove" + > + <el-button type="primary">涓婁紶</el-button> + <template #tip> +<!-- 鏂囦欢鏍煎紡鏀寔 doc锛宒ocx锛寈ls锛寈lsx锛宲pt锛宲ptx锛宲df锛宼xt锛寈ml锛宩pg锛宩peg锛宲ng锛実if锛宐mp锛宺ar锛寊ip锛�7z--> + <div class="el-upload__tip"> + 鏂囦欢鏍煎紡鏀寔 pdf + </div> + </template> + </el-upload> + </el-form-item> + </el-col> + </el-row> + </el-form> + <template #footer> + <div class="dialog-footer"> + <el-button type="primary" @click="submitForm">纭</el-button> + <el-button @click="closeDia">鍙栨秷</el-button> + </div> + </template> + </el-dialog> + <el-dialog title="涓婁紶寮圭獥" width="20%" v-model="uploadModal"> + <el-row :gutter="30"> + <el-col :span="24"> + <el-form-item label="闄勪欢鏉愭枡锛�" prop="remark"> + <el-upload + v-model:file-list="fileList" + :action="upload.url" + multiple + ref="fileUpload" + auto-upload + :headers="upload.headers" + :before-upload="handleBeforeUpload" + :on-error="handleUploadError" + :on-success="handleUploadSuccess" + :on-remove="handleRemove" + > + <el-button type="primary">涓婁紶</el-button> + <template #tip> + <!-- 鏂囦欢鏍煎紡鏀寔 doc锛宒ocx锛寈ls锛寈lsx锛宲pt锛宲ptx锛宲df锛宼xt锛寈ml锛宩pg锛宩peg锛宲ng锛実if锛宐mp锛宺ar锛寊ip锛�7z--> + <div class="el-upload__tip"> + 鏂囦欢鏍煎紡鏀寔 pdf + </div> + </template> + </el-upload> + </el-form-item> + </el-col> + </el-row> + <template #footer> + <div class="dialog-footer"> + <el-button @click="commiInvoicetFile" type="primary">纭</el-button> + <el-button @click="uploadModal = false">鍙栨秷</el-button> + </div> + </template> + </el-dialog> + </div> +</template> + +<script setup> +import pagination from '@/components/PIMTable/Pagination.vue' +import { ref } from 'vue' +import {Search} from "@element-plus/icons-vue"; +import {ElMessageBox } from "element-plus"; +import { + getSalesLedgerWithProducts, + ledgerListNoPage +} from "@/api/salesManagement/salesLedger.js"; +import { getToken } from "@/utils/auth" +import { + invoiceLedgerList, + invoiceLedgerDel, + invoiceLedgerSaveOrUpdate, + invoiceLedgerDetail, + commitFile, +} from "../../../api/salesManagement/invoiceLedger.js"; +const { proxy } = getCurrentInstance() +const tableData = ref([]) +const productData = ref([]) +const selectedRows = ref([]) +const tableLoading = ref(false) +const page = reactive({ + current: 1, + size: 10, +}) +const total = ref(0) +const fileList = ref([]) +const ledgerList = ref([]) +// 鐢ㄦ埛淇℃伅琛ㄥ崟寮规鏁版嵁 +const operationType = ref('') +const dialogFormVisible = ref(false) +const data = reactive({ + searchForm: { + searchText: '', + invoiceDate:'' + }, + form: { + salesLedgerId: '', + customerId: '', + invoiceNo: '', + invoiceAmount: '', + taxRate: '', + invoicePerson: '', + invoiceDate: '', + customerName:'', + fileList:[] + }, + rules: { + salesLedgerId: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + customerId: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + invoiceNo: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + invoiceAmount: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }], + taxRate: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + invoicePerson: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + invoiceDate: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + customerName: [{ required: true, message: "璇烽�夋嫨", trigger: "change" }], + } +}) +const { searchForm, form, rules } = toRefs(data) +const currentId = ref('') +const upload = reactive({ + // 涓婁紶鐨勫湴鍧� + url: import.meta.env.VITE_APP_BASE_API + "/invoiceLedger/uploadFile", + // 璁剧疆涓婁紶鐨勮姹傚ご閮� + headers: { Authorization: "Bearer " + getToken() }, +}) +const matchFileType = ref(['pdf']) +const uploadModal = ref(false) +// 鏌ヨ鍒楄〃 +/** 鎼滅储鎸夐挳鎿嶄綔 */ +const handleQuery = () => { + page.current = 1 + getList() +} +const paginationChange = ({ current, limit }) => { + page.current = current; + page.size = limit; + getList() +} +const getList = () => { + tableLoading.value = true + invoiceLedgerList({...searchForm.value, ...page}).then(res => { + tableLoading.value = false + tableData.value = res.data.records; + total.value = res.data.total; + }) +} +// 琛ㄦ牸閫夋嫨鏁版嵁 +const handleSelectionChange = (selection) => { + selectedRows.value = selection +} +// 涓昏〃鍚堣鏂规硶 +const summarizeMainTable = (param) => { + const { columns, data } = param; + const sums = []; + columns.forEach((column, index) => { + if (index === 0) { + sums[index] = '鍚堣'; + return; + } + const prop = column.property; + if (['invoiceAmount'].includes(prop)) { + const values = data.map(item => Number(item[prop])); + if (!values.every(value => isNaN(value))) { + sums[index] = values.reduce((acc, val) => (!isNaN(val) ? acc + val : acc), 0); + } else { + sums[index] = ''; + } + } else { + sums[index] = ''; + } + }) + return sums; +}; +// 鎵撳紑寮规 +const openForm = (type, row) => { + operationType.value = type + form.value = {} + productData.value = [] + fileList.value = [] + // 鏌ヨ閿�鍞悎鍚� + ledgerListNoPage({}).then(res => { + ledgerList.value = res.data; + }) + if (type === 'edit') { + currentId.value = row.id; + invoiceLedgerDetail({id: row.id}).then(res => { + form.value = {...res.data} + fileList.value = res.data.fileList; + }) + } + dialogFormVisible.value = true +} +// 涓婁紶鍓嶆牎妫� +function handleBeforeUpload(file) { + // 鏍℃鏂囦欢澶у皬 + if (file.size > 1024 * 1024) { + proxy.$modal.msgError('涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃10MB!') + return false + } + // 鍒ゆ柇鏂囦欢鏍煎紡鏄惁绗﹀悎 + const fileType = file.name.split('.').pop().toLowerCase(); + if(!matchFileType.value.includes(fileType)) { + proxy.$modal.msgError('鏂囦欢鏍煎紡涓嶅尮閰�') + return false + } + proxy.$modal.loading("姝e湪涓婁紶鏂囦欢锛岃绋嶅��...") + return true +} +// 涓婁紶澶辫触 +function handleUploadError(err) { + proxy.$modal.msgError("涓婁紶鏂囦欢澶辫触") + proxy.$modal.closeLoading() +} +// 涓婁紶鎴愬姛鍥炶皟 +function handleUploadSuccess(res, file, uploadFiles) { + proxy.$modal.closeLoading() + if (res.code === 200) { + proxy.$refs["fileUpload"].handleRemove(file) + fileList.value.push(res.data) + proxy.$modal.msgSuccess("涓婁紶鎴愬姛") + } else { + proxy.$modal.msgError(res.msg) + proxy.$refs.fileUpload.handleRemove(file) + } +} +// 绉婚櫎鏂囦欢 +function handleRemove (file) { + let index = fileList.value.findIndex(item => item.url === file.url) + if(index > -1) { + fileList.value.splice(index, 1) + } +} +// 鎻愪氦琛ㄥ崟 +const submitForm = () => { + proxy.$refs["formRef"].validate(valid => { + if (valid) { + form.value.fileList = fileList.value; + invoiceLedgerSaveOrUpdate(form.value).then(res => { + proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") + closeDia() + getList() + }) + } + }) +} +// 鍏抽棴寮规 +const closeDia = () => { + proxy.resetForm("formRef") + dialogFormVisible.value = false +} +// 瀵煎嚭 +const handleOut = () => { + ElMessageBox.confirm( + '閫変腑鐨勫唴瀹瑰皢琚鍑猴紝鏄惁纭瀵煎嚭锛�', + '瀵煎嚭', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + } + ).then(() => { + proxy.download("/invoiceLedger/export", {}, '寮�绁ㄥ彴璐�.xlsx') + }).catch(() => { + proxy.$modal.msg("宸插彇娑�") + }) +} +// 鍒犻櫎 +const handleDelete = () => { + let ids = [] + if (selectedRows.value.length > 0) { + ids = selectedRows.value.map(item => item.id); + } else { + proxy.$modal.msgWarning('璇烽�夋嫨鏁版嵁') + return + } + ElMessageBox.confirm( + '閫変腑鐨勫唴瀹瑰皢琚垹闄わ紝鏄惁纭鍒犻櫎锛�', + '瀵煎嚭', { + confirmButtonText: '纭', + cancelButtonText: '鍙栨秷', + type: 'warning', + } + ).then(() => { + invoiceLedgerDel(ids).then(res => { + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + getList() + }) + }).catch(() => { + proxy.$modal.msg("宸插彇娑�") + }) +} + +// 閿�鍞彴璐︾瓫閫� +const ledgerChange = (val) => { + if(val){ + getSalesLedgerWithProducts({id: val}).then(res => { + form.value = { + salesLedgerId: res.id, + customerName: res.customerName, + customerId: res.customerId, + salesContractNo: res.salesContractNo + } + }) + }else { + form.value.salesLedgerId = '' + form.value.customerName = '' + form.value.customerId = '' + } +} + +// 鎵撳紑闄勪欢涓婁紶寮圭獥 +const handleDownload = (val) => { + fileList.value = [] + uploadModal.value = true + currentId.value = val.id +} + +// 纭鏂囦欢涓婁紶 +const commiInvoicetFile = () => { + const object = { + fileList: fileList.value, + id: currentId.value, + } + commitFile(object).then(res => { + if (res.code === 200) { + proxy.$modal.msgSuccess("鎻愪氦鎴愬姛") + uploadModal.value = false + } + getList(); + currentId.value = '' + fileList.value = [] + }) + +} + +getList() +</script> + +<style scoped lang="scss"> + +</style> diff --git a/src/views/salesManagement/invoiceRegistration/index.vue b/src/views/salesManagement/invoiceRegistration/index.vue index d20fe1d..08336e5 100644 --- a/src/views/salesManagement/invoiceRegistration/index.vue +++ b/src/views/salesManagement/invoiceRegistration/index.vue @@ -161,7 +161,6 @@ invoiceRegistrationDel, productList, invoiceRegistrationDetail, - invoiceRegistrationExport } from "@/api/salesManagement/invoiceRegistration.js"; const { proxy } = getCurrentInstance() const tableData = ref([]) -- Gitblit v1.9.3