进销存-升级
1.修改上传组件bug
2.付款流水和回款流水添加删除功能
3.调整财务管理页面样式和运用组件
| | |
| | | |
| | | const handleUpload = async () => { |
| | | if (props.uploadMethod) { |
| | | const newItem = await props.uploadMethod() |
| | | if (newItem) { |
| | | addAttachment(newItem) |
| | | } |
| | | // 妿æä¾äºèªå®ä¹ä¸ä¼ æ¹æ³ï¼ç±ç¶ç»ä»¶è´è´£æ´æ°å表ï¼éè¿ setListï¼ |
| | | // è¿éä¸åèªå¨æ·»å ï¼é¿å
ä¸ç¶ç»ä»¶ç setList éå¤ |
| | | await props.uploadMethod() |
| | | } |
| | | emit('upload') |
| | | } |
| | |
| | | :fixed="item.fixed" |
| | | :label="item.label" |
| | | :prop="item.prop" |
| | | :show-overflow-tooltip="item.dataType !== 'action'" |
| | | :show-overflow-tooltip="item.dataType !== 'action' && item.dataType !== 'slot'" |
| | | :align="item.align" |
| | | :sortable="!!item.sortable" |
| | | :type="item.type" |
| | |
| | | <template> |
| | | <el-dialog :title="modalOptions.title" v-model="visible" @close="close" width="30%"> |
| | | <Form ref="formRef"></Form> |
| | | <template #footer> |
| | | <el-button type="primary" @click="sendForm" :loading="loading"> |
| | | {{ modalOptions.confirmText }} |
| | | </el-button> |
| | | <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | <FormDialog |
| | | v-model="dialogVisible" |
| | | :title="dialogTitle" |
| | | :operationType="operationType" |
| | | width="50%" |
| | | @confirm="sendForm" |
| | | @close="close" |
| | | @cancel="close" |
| | | > |
| | | <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> |
| | | <el-form-item label="æ¯åºæ¥æ" prop="expenseDate"> |
| | | <el-date-picker |
| | | style="width: 100%" |
| | | v-model="form.expenseDate" |
| | | format="YYYY-MM-DD" |
| | | value-format="YYYY-MM-DD" |
| | | type="date" |
| | | placeholder="è¯·éæ©æ¥æ" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¯åºç±»å" prop="expenseType"> |
| | | <el-select |
| | | v-model="form.expenseType" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | > |
| | | <el-option :label="item.label" :value="item.value" v-for="(item,index) in expense_types" :key="index" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="ä¾åºååç§°" prop="supplierName"> |
| | | <el-input v-model="form.supplierName" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¯åºéé¢" prop="expenseMoney"> |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.expenseMoney" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¯åºæè¿°" prop="expenseDescribed"> |
| | | <el-input v-model="form.expenseDescribed" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="仿¬¾æ¹å¼" prop="expenseMethod"> |
| | | <el-select |
| | | v-model="form.expenseMethod" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | > |
| | | <el-option :label="item.label" :value="item.value" v-for="(item,index) in checkout_payment" :key="index" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="å票å·ç " prop="invoiceNumber"> |
| | | <el-input v-model="form.invoiceNumber" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="夿³¨" prop="note"> |
| | | <el-input |
| | | v-model="form.note" |
| | | placeholder="夿³¨" |
| | | /> |
| | | </el-form-item> |
| | | </el-form> |
| | | </FormDialog> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { useModal } from "@/hooks/useModal"; |
| | | import { add, update } from "@/api/financialManagement/expenseManagement"; |
| | | import Form from "./Form.vue"; |
| | | import { add, update, getAccountExpense } from "@/api/financialManagement/expenseManagement"; |
| | | import { ElMessage } from "element-plus"; |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import FormDialog from "@/components/Dialog/FormDialog.vue"; |
| | | import { ref } from "vue"; |
| | | |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | | defineOptions({ |
| | |
| | | |
| | | const emits = defineEmits(["success"]); |
| | | |
| | | const formRef = ref(); |
| | | const { |
| | | id, |
| | | visible, |
| | | loading, |
| | | openModal, |
| | | modalOptions, |
| | | handleConfirm, |
| | | closeModal, |
| | | } = useModal({ title: "æ¯åº" }); |
| | | const formRef = ref(null); |
| | | const dialogVisible = ref(false); |
| | | const operationType = ref("add"); // add | edit |
| | | const id = ref(undefined); |
| | | const submitting = ref(false); |
| | | |
| | | const dialogTitle = (type) => { |
| | | if (type === "edit") return "ç¼è¾æ¯åº"; |
| | | return "æ°å¢æ¯åº"; |
| | | }; |
| | | |
| | | const { expense_types } = proxy.useDict("expense_types"); |
| | | const { checkout_payment } = proxy.useDict("checkout_payment"); |
| | | |
| | | const formRules = { |
| | | supplierName: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | expenseMoney: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | expenseDescribed: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | expenseDate: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | expenseType: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | expenseMethod: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | } |
| | | |
| | | const { form, resetForm } = useFormData({ |
| | | expenseDate: undefined, // æ¯åºæ¥æ |
| | | expenseType: undefined, // æ¯åºç±»å |
| | | supplierName: undefined, // ä¾åºååç§° |
| | | expenseMoney: undefined, // æ¯åºéé¢ |
| | | expenseDescribed: undefined, // æ¯åºæè¿° |
| | | expenseMethod: undefined, // 仿¬¾æ¹å¼ |
| | | invoiceNumber: undefined, // å票å·ç |
| | | note: undefined, // 夿³¨ |
| | | }); |
| | | |
| | | const sendForm = () => { |
| | | proxy.$refs.formRef.$refs.formRef.validate(async valid => { |
| | | if (submitting.value) return; |
| | | formRef.value?.validate(async (valid) => { |
| | | if (valid) { |
| | | submitting.value = true; |
| | | try { |
| | | const {code} = id.value |
| | | ? await update({id: id.value, ...formRef.value.form}) |
| | | : await add(formRef.value.form); |
| | | ? await update({ id: id.value, ...form }) |
| | | : await add(form); |
| | | if (code == 200) { |
| | | emits("success"); |
| | | ElMessage({message: "æä½æå", type: "success"}); |
| | | close(); |
| | | } else { |
| | | loading.value = false; |
| | | } |
| | | } finally { |
| | | submitting.value = false; |
| | | } |
| | | } |
| | | }) |
| | | }; |
| | | |
| | | const close = () => { |
| | | formRef.value.resetFormAndValidate(); |
| | | closeModal(); |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | id.value = undefined; |
| | | dialogVisible.value = false; |
| | | }; |
| | | |
| | | const loadForm = async (id) => { |
| | | openModal(id); |
| | | await nextTick(); |
| | | formRef.value.loadForm(id); |
| | | const loadForm = async (rowId) => { |
| | | operationType.value = "edit"; |
| | | id.value = rowId; |
| | | dialogVisible.value = true; |
| | | if (rowId) { |
| | | const { code, data } = await getAccountExpense(rowId); |
| | | if (code == 200) { |
| | | form.expenseDate = data.expenseDate; |
| | | form.expenseType = data.expenseType; |
| | | form.supplierName = data.supplierName; |
| | | form.expenseMoney = data.expenseMoney; |
| | | form.expenseDescribed = data.expenseDescribed; |
| | | form.expenseMethod = data.expenseMethod; |
| | | form.invoiceNumber = data.invoiceNumber; |
| | | form.note = data.note; |
| | | } |
| | | } else { |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | } |
| | | }; |
| | | |
| | | const openModal = () => { |
| | | operationType.value = "add"; |
| | | id.value = undefined; |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | dialogVisible.value = true; |
| | | }; |
| | | |
| | | defineExpose({ |
| | |
| | | @pagination="changePage" |
| | | > |
| | | <template #operation="{ row }"> |
| | | <el-button type="primary" text @click="edit(row.id)" icon="editPen"> |
| | | <el-button type="primary" link @click="edit(row.id)"> |
| | | ç¼è¾ |
| | | </el-button> |
| | | <el-button |
| | | type="primary" |
| | | text |
| | | link |
| | | @click="openFilesFormDia(row)" |
| | | > |
| | | éä»¶ |
| | |
| | | </PIMTable> |
| | | </div> |
| | | <Modal ref="modalRef" @success="getTableData"></Modal> |
| | | <files-dia ref="filesDia"></files-dia> |
| | | <FileListDialog |
| | | ref="fileListRef" |
| | | v-model="fileListDialogVisible" |
| | | :show-upload-button="true" |
| | | :show-delete-button="true" |
| | | :upload-method="handleUpload" |
| | | :delete-method="handleFileDelete" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { usePaginationApi } from "@/hooks/usePaginationApi"; |
| | | import { listPage, delAccountExpense } from "@/api/financialManagement/expenseManagement"; |
| | | import { listPage, delAccountExpense, fileListPage, fileAdd, fileDel } from "@/api/financialManagement/expenseManagement"; |
| | | import { onMounted, getCurrentInstance } from "vue"; |
| | | import Modal from "./Modal.vue"; |
| | | import { ElMessageBox, ElMessage } from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | import FilesDia from "../revenueManagement/filesDia.vue"; |
| | | import FileListDialog from "@/components/Dialog/FileListDialog.vue"; |
| | | import request from "@/utils/request"; |
| | | import { getToken } from "@/utils/auth"; |
| | | |
| | | defineOptions({ |
| | | name: "æ¯åºç®¡ç", |
| | |
| | | const modalRef = ref(); |
| | | const { checkout_payment } = proxy.useDict("checkout_payment"); |
| | | const { expense_types } = proxy.useDict("expense_types"); |
| | | const filesDia = ref() |
| | | const fileListRef = ref(null); |
| | | const fileListDialogVisible = ref(false); |
| | | const currentFileRow = ref(null); |
| | | const accountType = ref('æ¯åº'); |
| | | |
| | | const { |
| | | filters, |
| | |
| | | [ |
| | | { |
| | | label: "æ¯åºæ¥æ", |
| | | align: "center", |
| | | prop: "expenseDate", |
| | | }, |
| | | { |
| | |
| | | }, |
| | | { |
| | | label: "ä¾åºååç§°", |
| | | align: "center", |
| | | prop: "supplierName", |
| | | |
| | | }, |
| | | { |
| | | label: "æ¯åºéé¢", |
| | | align: "center", |
| | | prop: "expenseMoney", |
| | | |
| | | }, |
| | | { |
| | | label: "æ¯åºæè¿°", |
| | | align: "center", |
| | | prop: "expenseDescribed", |
| | | |
| | | }, |
| | |
| | | label: "仿¬¾æ¹å¼", |
| | | align: "center", |
| | | prop: "expenseMethod", |
| | | width: '120', |
| | | dataType: "tag", |
| | | formatData: (params) => { |
| | | if (checkout_payment.value.find((m) => m.value == params)) { |
| | |
| | | }, |
| | | { |
| | | label: "å票å·ç ", |
| | | align: "center", |
| | | prop: "invoiceNumber", |
| | | |
| | | }, |
| | | { |
| | | label: "夿³¨", |
| | | align: "center", |
| | | prop: "note", |
| | | |
| | | }, |
| | | { |
| | | label: "å½å
¥äºº", |
| | | align: "center", |
| | | prop: "inputUser", |
| | | }, |
| | | { |
| | | label: "å½å
¥æ¥æ", |
| | | align: "center", |
| | | prop: "inputTime", |
| | | |
| | | }, |
| | |
| | | dataType: "slot", |
| | | slot: "operation", |
| | | align: "center", |
| | | width: "200px", |
| | | width: "160px", |
| | | }, |
| | | ] |
| | | ); |
| | |
| | | }); |
| | | }; |
| | | // æå¼éä»¶å¼¹æ¡ |
| | | const openFilesFormDia = (row) => { |
| | | nextTick(() => { |
| | | filesDia.value?.openDialog( row,'æ¯åº') |
| | | }) |
| | | const openFilesFormDia = async (row) => { |
| | | currentFileRow.value = row; |
| | | accountType.value = 'æ¯åº'; |
| | | try { |
| | | const res = await fileListPage({ |
| | | accountId: row.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (res.code === 200 && fileListRef.value) { |
| | | // å°æ°æ®è½¬æ¢ä¸º FileListDialog éè¦çæ ¼å¼ |
| | | const fileList = (res.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.open(fileList); |
| | | fileListDialogVisible.value = true; |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("è·åéä»¶å表失败"); |
| | | } |
| | | }; |
| | | |
| | | // ä¸ä¼ éä»¶ |
| | | const handleUpload = async () => { |
| | | if (!currentFileRow.value) { |
| | | proxy.$modal.msgWarning("请å
éæ©æ°æ®"); |
| | | return null; |
| | | } |
| | | |
| | | return new Promise((resolve) => { |
| | | // å建ä¸ä¸ªéèçæä»¶è¾å
¥å
ç´ |
| | | const input = document.createElement('input'); |
| | | input.type = 'file'; |
| | | input.style.display = 'none'; |
| | | input.onchange = async (e) => { |
| | | const file = e.target.files[0]; |
| | | if (!file) { |
| | | resolve(null); |
| | | return; |
| | | } |
| | | |
| | | try { |
| | | // ä½¿ç¨ FormData ä¸ä¼ æä»¶ |
| | | const formData = new FormData(); |
| | | formData.append('file', file); |
| | | |
| | | const uploadRes = await request({ |
| | | url: '/file/upload', |
| | | method: 'post', |
| | | data: formData, |
| | | headers: { |
| | | 'Content-Type': 'multipart/form-data', |
| | | Authorization: `Bearer ${getToken()}` |
| | | } |
| | | }); |
| | | |
| | | if (uploadRes.code === 200) { |
| | | // ä¿åéä»¶ä¿¡æ¯ |
| | | const fileData = { |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | name: uploadRes.data.originalName || file.name, |
| | | url: uploadRes.data.tempPath || uploadRes.data.url |
| | | }; |
| | | |
| | | const saveRes = await fileAdd(fileData); |
| | | if (saveRes.code === 200) { |
| | | proxy.$modal.msgSuccess("æä»¶ä¸ä¼ æå"); |
| | | // éæ°å è½½æä»¶å表 |
| | | const listRes = await fileListPage({ |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (listRes.code === 200 && fileListRef.value) { |
| | | const fileList = (listRes.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.setList(fileList); |
| | | } |
| | | // è¿åæ°æä»¶ä¿¡æ¯ |
| | | resolve({ |
| | | name: fileData.name, |
| | | url: fileData.url, |
| | | id: saveRes.data?.id |
| | | }); |
| | | } else { |
| | | proxy.$modal.msgError(saveRes.msg || "æä»¶ä¿å失败"); |
| | | resolve(null); |
| | | } |
| | | } else { |
| | | proxy.$modal.msgError(uploadRes.msg || "æä»¶ä¸ä¼ 失败"); |
| | | resolve(null); |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("æä»¶ä¸ä¼ 失败"); |
| | | resolve(null); |
| | | } finally { |
| | | document.body.removeChild(input); |
| | | } |
| | | }; |
| | | |
| | | document.body.appendChild(input); |
| | | input.click(); |
| | | }); |
| | | }; |
| | | |
| | | // å é¤éä»¶ |
| | | const handleFileDelete = async (row) => { |
| | | try { |
| | | const res = await fileDel([row.id]); |
| | | if (res.code === 200) { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | // éæ°å è½½æä»¶å表 |
| | | if (currentFileRow.value && fileListRef.value) { |
| | | const listRes = await fileListPage({ |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (listRes.code === 200) { |
| | | const fileList = (listRes.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.setList(fileList); |
| | | } |
| | | } |
| | | return true; // è¿å true 表示å 餿åï¼ç»ä»¶ä¼æ´æ°å表 |
| | | } else { |
| | | proxy.$modal.msgError(res.msg || "å é¤å¤±è´¥"); |
| | | return false; |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("å é¤å¤±è´¥"); |
| | | return false; |
| | | } |
| | | }; |
| | | |
| | | onMounted(() => { |
| | |
| | | ç¼è¾ |
| | | </el-button> |
| | | <el-button |
| | | v-if="row.status == 1" |
| | | :disabled="row.status !== 1" |
| | | type="primary" |
| | | link |
| | | @click="repay(row)" |
| | |
| | | { |
| | | label: "忬¾äººå§å", |
| | | prop: "borrowerName", |
| | | width: 150, |
| | | }, |
| | | { |
| | | label: "忬¾éé¢ï¼å
ï¼", |
| | | prop: "borrowAmount", |
| | | width: 150, |
| | | formatData: (val) => { |
| | | return val ? `Â¥${parseFloat(val).toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}` : 'Â¥0.00'; |
| | | }, |
| | |
| | | { |
| | | label: "忬¾å©çï¼%ï¼", |
| | | prop: "interestRate", |
| | | width: 130, |
| | | formatData: (val) => { |
| | | return val ? `${parseFloat(val).toFixed(2)}%` : '-'; |
| | | }, |
| | |
| | | { |
| | | label: "忬¾æ¥æ", |
| | | prop: "borrowDate", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "å®é
è¿æ¬¾æ¥æ", |
| | | prop: "repayDate", |
| | | width: 130, |
| | | }, |
| | | { |
| | | label: "忬¾ç¶æ", |
| | | prop: "status", |
| | | width: 100, |
| | | dataType: "tag", |
| | | align: 'center', |
| | | formatData: (params) => { |
| | | if (params == 1) { |
| | | return "å¾
è¿æ¬¾"; |
| | |
| | | <template> |
| | | <el-dialog :title="modalOptions.title" v-model="visible" @close="close" width="30%"> |
| | | <Form ref="formRef"></Form> |
| | | <template #footer> |
| | | <el-button type="primary" @click="sendForm" :loading="loading"> |
| | | {{ modalOptions.confirmText }} |
| | | </el-button> |
| | | <el-button @click="closeModal">{{ modalOptions.cancelText }}</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | <FormDialog |
| | | v-model="dialogVisible" |
| | | :title="dialogTitle" |
| | | :operationType="operationType" |
| | | width="30%" |
| | | @confirm="sendForm" |
| | | @close="close" |
| | | @cancel="close" |
| | | > |
| | | <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> |
| | | <el-form-item label="æ¶å
¥æ¥æ" prop="incomeDate"> |
| | | <el-date-picker |
| | | style="width: 100%" |
| | | v-model="form.incomeDate" |
| | | format="YYYY-MM-DD" |
| | | value-format="YYYY-MM-DD" |
| | | type="date" |
| | | placeholder="è¯·éæ©æ¥æ" |
| | | clearable |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¶å
¥ç±»å" prop="incomeType"> |
| | | <el-select |
| | | v-model="form.incomeType" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | > |
| | | <el-option :label="item.label" :value="item.value" v-for="(item,index) in income_types" :key="index" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="客æ·åç§°" prop="customerName"> |
| | | <el-input v-model="form.customerName" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¶å
¥éé¢" prop="incomeMoney"> |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.incomeMoney" |
| | | placeholder="请è¾å
¥" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¶å
¥æè¿°" prop="incomeDescribed"> |
| | | <el-input v-model="form.incomeDescribed" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="æ¶æ¬¾æ¹å¼" prop="incomeMethod"> |
| | | <el-select |
| | | v-model="form.incomeMethod" |
| | | placeholder="è¯·éæ©" |
| | | clearable |
| | | > |
| | | <el-option :label="item.label" :value="item.value" v-for="(item,index) in payment_methods" :key="index" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="å票å·ç " prop="invoiceNumber"> |
| | | <el-input v-model="form.invoiceNumber" placeholder="请è¾å
¥" /> |
| | | </el-form-item> |
| | | <el-form-item label="夿³¨" prop="note"> |
| | | <el-input |
| | | v-model="form.note" |
| | | placeholder="夿³¨" |
| | | /> |
| | | </el-form-item> |
| | | </el-form> |
| | | </FormDialog> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { useModal } from "@/hooks/useModal"; |
| | | import { add, update } from "@/api/financialManagement/revenueManagement"; |
| | | import Form from "./Form.vue"; |
| | | import { add, update, getAccountIncome } from "@/api/financialManagement/revenueManagement"; |
| | | import { ElMessage } from "element-plus"; |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import FormDialog from "@/components/Dialog/FormDialog.vue"; |
| | | import { ref } from "vue"; |
| | | |
| | | const { proxy } = getCurrentInstance() |
| | | |
| | | defineOptions({ |
| | |
| | | |
| | | const emits = defineEmits(["success"]); |
| | | |
| | | const formRef = ref(); |
| | | const { |
| | | id, |
| | | visible, |
| | | loading, |
| | | openModal, |
| | | modalOptions, |
| | | handleConfirm, |
| | | closeModal, |
| | | } = useModal({ title: "æ¶å
¥" }); |
| | | const formRef = ref(null); |
| | | const dialogVisible = ref(false); |
| | | const operationType = ref("add"); // add | edit |
| | | const id = ref(undefined); |
| | | const submitting = ref(false); |
| | | |
| | | const dialogTitle = (type) => { |
| | | if (type === "edit") return "ç¼è¾æ¶å
¥"; |
| | | return "æ°å¢æ¶å
¥"; |
| | | }; |
| | | |
| | | const { income_types } = proxy.useDict("income_types"); |
| | | const { payment_methods } = proxy.useDict("payment_methods"); |
| | | |
| | | const formRules = { |
| | | customerName: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeMoney: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeDescribed: [{ required: true, trigger: "blur", message: "请è¾å
¥" }], |
| | | incomeDate: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | incomeType: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | incomeMethod: [{ required: true, trigger: "change", message: "è¯·éæ©" }], |
| | | } |
| | | |
| | | const { form, resetForm } = useFormData({ |
| | | incomeDate: undefined, // æ¶å
¥æ¥æ |
| | | incomeType: undefined, // æ¶å
¥ç±»å |
| | | customerName: undefined, // 客æ·åç§° |
| | | incomeMoney: undefined, // æ¶å
¥éé¢ |
| | | incomeDescribed: undefined, // æ¶å
¥æè¿° |
| | | incomeMethod: undefined, // æ¶æ¬¾æ¹å¼ |
| | | invoiceNumber: undefined, // å票å·ç |
| | | note: undefined, // 夿³¨ |
| | | }); |
| | | |
| | | const sendForm = () => { |
| | | proxy.$refs.formRef.$refs.formRef.validate(async valid => { |
| | | if (submitting.value) return; |
| | | formRef.value?.validate(async (valid) => { |
| | | if (valid) { |
| | | submitting.value = true; |
| | | try { |
| | | const {code} = id.value |
| | | ? await update({id: id.value, ...formRef.value.form}) |
| | | : await add(formRef.value.form); |
| | | ? await update({ id: id.value, ...form }) |
| | | : await add(form); |
| | | if (code == 200) { |
| | | emits("success"); |
| | | ElMessage({message: "æä½æå", type: "success"}); |
| | | close(); |
| | | } else { |
| | | loading.value = false; |
| | | } |
| | | } finally { |
| | | submitting.value = false; |
| | | } |
| | | } |
| | | }) |
| | | }; |
| | | |
| | | const close = () => { |
| | | formRef.value.resetFormAndValidate(); |
| | | closeModal(); |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | id.value = undefined; |
| | | dialogVisible.value = false; |
| | | }; |
| | | |
| | | const loadForm = async (id) => { |
| | | openModal(id); |
| | | await nextTick(); |
| | | formRef.value.loadForm(id); |
| | | const loadForm = async (rowId) => { |
| | | operationType.value = "edit"; |
| | | id.value = rowId; |
| | | dialogVisible.value = true; |
| | | if (rowId) { |
| | | const { code, data } = await getAccountIncome(rowId); |
| | | if (code == 200) { |
| | | form.incomeDate = data.incomeDate; |
| | | form.incomeType = data.incomeType; |
| | | form.customerName = data.customerName; |
| | | form.incomeMoney = data.incomeMoney; |
| | | form.incomeDescribed = data.incomeDescribed; |
| | | form.incomeMethod = data.incomeMethod; |
| | | form.invoiceNumber = data.invoiceNumber; |
| | | form.note = data.note; |
| | | } |
| | | } else { |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | } |
| | | }; |
| | | |
| | | const openModal = () => { |
| | | operationType.value = "add"; |
| | | id.value = undefined; |
| | | resetForm(); |
| | | formRef.value?.clearValidate(); |
| | | dialogVisible.value = true; |
| | | }; |
| | | |
| | | defineExpose({ |
| | |
| | | @pagination="changePage" |
| | | > |
| | | <template #operation="{ row }"> |
| | | <el-button type="primary" text @click="edit(row.id)" icon="editPen"> |
| | | <el-button type="primary" link @click="edit(row.id)"> |
| | | ç¼è¾ |
| | | </el-button> |
| | | <el-button |
| | | type="primary" |
| | | text |
| | | link |
| | | @click="openFilesFormDia(row)" |
| | | > |
| | | éä»¶ |
| | |
| | | </PIMTable> |
| | | </div> |
| | | <Modal ref="modalRef" @success="getTableData"></Modal> |
| | | <files-dia ref="filesDia"></files-dia> |
| | | <FileListDialog |
| | | ref="fileListRef" |
| | | v-model="fileListDialogVisible" |
| | | :show-upload-button="true" |
| | | :show-delete-button="true" |
| | | :upload-method="handleUpload" |
| | | :delete-method="handleFileDelete" |
| | | /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { usePaginationApi } from "@/hooks/usePaginationApi"; |
| | | import { listPage, delAccountIncome } from "@/api/financialManagement/revenueManagement"; |
| | | import { listPage, delAccountIncome, fileListPage, fileAdd, fileDel } from "@/api/financialManagement/revenueManagement"; |
| | | 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 FileListDialog from "@/components/Dialog/FileListDialog.vue"; |
| | | import request from "@/utils/request"; |
| | | import { getToken } from "@/utils/auth"; |
| | | |
| | | defineOptions({ |
| | | name: "æ¶å
¥ç®¡ç", |
| | |
| | | const modalRef = ref(); |
| | | const { payment_methods } = proxy.useDict("payment_methods"); |
| | | const { income_types } = proxy.useDict("income_types"); |
| | | const filesDia = ref() |
| | | const fileListRef = ref(null); |
| | | const fileListDialogVisible = ref(false); |
| | | const currentFileRow = ref(null); |
| | | const accountType = ref('æ¶å
¥'); |
| | | |
| | | const { |
| | | filters, |
| | |
| | | [ |
| | | { |
| | | label: "æ¶å
¥æ¥æ", |
| | | align: "center", |
| | | prop: "incomeDate", |
| | | }, |
| | | { |
| | | label: "æ¶å
¥ç±»å", |
| | | align: "center", |
| | | prop: "incomeType", |
| | | dataType: "tag", |
| | | formatData: (params) => { |
| | |
| | | }, |
| | | { |
| | | label: "客æ·åç§°", |
| | | align: "center", |
| | | prop: "customerName", |
| | | width: '200' |
| | | |
| | | }, |
| | | { |
| | | label: "æ¶å
¥éé¢", |
| | | align: "center", |
| | | prop: "incomeMoney", |
| | | |
| | | }, |
| | | { |
| | | label: "æ¶å
¥æè¿°", |
| | | align: "center", |
| | | prop: "incomeDescribed", |
| | | |
| | | }, |
| | | { |
| | | label: "æ¶æ¬¾æ¹å¼", |
| | | align: "center", |
| | | prop: "incomeMethod", |
| | | align: 'center', |
| | | width: '100', |
| | | dataType: "tag", |
| | | formatData: (params) => { |
| | | if (payment_methods.value.find((m) => m.value == params)) { |
| | |
| | | }, |
| | | { |
| | | label: "å票å·ç ", |
| | | align: "center", |
| | | prop: "invoiceNumber", |
| | | |
| | | }, |
| | | { |
| | | label: "夿³¨", |
| | | align: "center", |
| | | prop: "note", |
| | | |
| | | }, |
| | | { |
| | | label: "å½å
¥äºº", |
| | | align: "center", |
| | | prop: "inputUser", |
| | | }, |
| | | { |
| | | label: "å½å
¥æ¥æ", |
| | | align: "center", |
| | | prop: "inputTime", |
| | | |
| | | }, |
| | |
| | | dataType: "slot", |
| | | slot: "operation", |
| | | align: "center", |
| | | width: "200px", |
| | | width: "160px", |
| | | }, |
| | | ] |
| | | ); |
| | |
| | | }); |
| | | }; |
| | | // æå¼éä»¶å¼¹æ¡ |
| | | const openFilesFormDia = (row) => { |
| | | nextTick(() => { |
| | | filesDia.value?.openDialog( row,'æ¶å
¥') |
| | | }) |
| | | const openFilesFormDia = async (row) => { |
| | | currentFileRow.value = row; |
| | | accountType.value = 'æ¶å
¥'; |
| | | try { |
| | | const res = await fileListPage({ |
| | | accountId: row.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (res.code === 200 && fileListRef.value) { |
| | | // å°æ°æ®è½¬æ¢ä¸º FileListDialog éè¦çæ ¼å¼ |
| | | const fileList = (res.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.open(fileList); |
| | | fileListDialogVisible.value = true; |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("è·åéä»¶å表失败"); |
| | | } |
| | | }; |
| | | |
| | | // ä¸ä¼ éä»¶ |
| | | const handleUpload = async () => { |
| | | if (!currentFileRow.value) { |
| | | proxy.$modal.msgWarning("请å
éæ©æ°æ®"); |
| | | return null; |
| | | } |
| | | |
| | | return new Promise((resolve) => { |
| | | // å建ä¸ä¸ªéèçæä»¶è¾å
¥å
ç´ |
| | | const input = document.createElement('input'); |
| | | input.type = 'file'; |
| | | input.style.display = 'none'; |
| | | input.onchange = async (e) => { |
| | | const file = e.target.files[0]; |
| | | if (!file) { |
| | | resolve(null); |
| | | return; |
| | | } |
| | | |
| | | try { |
| | | // ä½¿ç¨ FormData ä¸ä¼ æä»¶ |
| | | const formData = new FormData(); |
| | | formData.append('file', file); |
| | | |
| | | const uploadRes = await request({ |
| | | url: '/file/upload', |
| | | method: 'post', |
| | | data: formData, |
| | | headers: { |
| | | 'Content-Type': 'multipart/form-data', |
| | | Authorization: `Bearer ${getToken()}` |
| | | } |
| | | }); |
| | | |
| | | if (uploadRes.code === 200) { |
| | | // ä¿åéä»¶ä¿¡æ¯ |
| | | const fileData = { |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | name: uploadRes.data.originalName || file.name, |
| | | url: uploadRes.data.tempPath || uploadRes.data.url |
| | | }; |
| | | |
| | | const saveRes = await fileAdd(fileData); |
| | | if (saveRes.code === 200) { |
| | | proxy.$modal.msgSuccess("æä»¶ä¸ä¼ æå"); |
| | | // éæ°å è½½æä»¶å表 |
| | | const listRes = await fileListPage({ |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (listRes.code === 200 && fileListRef.value) { |
| | | const fileList = (listRes.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.setList(fileList); |
| | | } |
| | | // è¿åæ°æä»¶ä¿¡æ¯ |
| | | resolve({ |
| | | name: fileData.name, |
| | | url: fileData.url, |
| | | id: saveRes.data?.id |
| | | }); |
| | | } else { |
| | | proxy.$modal.msgError(saveRes.msg || "æä»¶ä¿å失败"); |
| | | resolve(null); |
| | | } |
| | | } else { |
| | | proxy.$modal.msgError(uploadRes.msg || "æä»¶ä¸ä¼ 失败"); |
| | | resolve(null); |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("æä»¶ä¸ä¼ 失败"); |
| | | resolve(null); |
| | | } finally { |
| | | document.body.removeChild(input); |
| | | } |
| | | }; |
| | | |
| | | document.body.appendChild(input); |
| | | input.click(); |
| | | }); |
| | | }; |
| | | |
| | | // å é¤éä»¶ |
| | | const handleFileDelete = async (row) => { |
| | | try { |
| | | const res = await fileDel([row.id]); |
| | | if (res.code === 200) { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | // éæ°å è½½æä»¶å表 |
| | | if (currentFileRow.value && fileListRef.value) { |
| | | const listRes = await fileListPage({ |
| | | accountId: currentFileRow.value.id, |
| | | accountType: accountType.value, |
| | | current: 1, |
| | | size: 100 |
| | | }); |
| | | if (listRes.code === 200) { |
| | | const fileList = (listRes.data?.records || []).map(item => ({ |
| | | name: item.name, |
| | | url: item.url, |
| | | id: item.id, |
| | | ...item |
| | | })); |
| | | fileListRef.value.setList(fileList); |
| | | } |
| | | } |
| | | return true; // è¿å true 表示å 餿åï¼ç»ä»¶ä¼æ´æ°å表 |
| | | } else { |
| | | proxy.$modal.msgError(res.msg || "å é¤å¤±è´¥"); |
| | | return false; |
| | | } |
| | | } catch (error) { |
| | | proxy.$modal.msgError("å é¤å¤±è´¥"); |
| | | return false; |
| | | } |
| | | }; |
| | | |
| | | onMounted(() => { |
| | |
| | | }) |
| | | .then(() => { |
| | | tableLoading.value = true; |
| | | delPaymentRegistration(row.id) |
| | | delPaymentRegistration([row.id]) |
| | | .then((res) => { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | getList(); |
| | |
| | | æç´¢ |
| | | </el-button> |
| | | <el-button @click="handleExport">导åº</el-button> |
| | | <el-button |
| | | type="danger" |
| | | :disabled="selectedRows.length === 0" |
| | | @click="handleBatchDelete" |
| | | > |
| | | æ¹éå é¤ ({{ selectedRows.length }}) |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div class="table_list"> |
| | |
| | | :tableLoading="tableLoading" |
| | | @pagination="pagination" |
| | | :total="page.total" |
| | | ></PIMTable> |
| | | > |
| | | <template #operation="{ row }"> |
| | | <el-button |
| | | type="primary" |
| | | link |
| | | size="small" |
| | | @click="handleDelete(row)" |
| | | > |
| | | å é¤ |
| | | </el-button> |
| | | </template> |
| | | </PIMTable> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | <script setup> |
| | | import { ref, reactive, getCurrentInstance, onMounted } from "vue"; |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import { paymentHistoryListPage } from "@/api/procurementManagement/paymentEntry.js"; |
| | | import {delPaymentRegistration } from "@/api/procurementManagement/procurementInvoiceLedger.js"; |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import dayjs from "dayjs"; |
| | | |
| | |
| | | { |
| | | label: "ç»è®°æ¥æ", |
| | | prop: "registrationtDate", |
| | | }, |
| | | { |
| | | label: "æä½", |
| | | dataType: "slot", |
| | | slot: "operation", |
| | | width: 100, |
| | | align: "center", |
| | | }, |
| | | ]); |
| | | const tableData = ref([]); |
| | |
| | | getList(); |
| | | }; |
| | | |
| | | // å é¤ |
| | | const handleDelete = (row) => { |
| | | ElMessageBox.confirm("éä¸çå
容å°è¢«å é¤ï¼æ¯å¦ç¡®è®¤å é¤ï¼", "å é¤æç¤º", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | tableLoading.value = true; |
| | | delPaymentRegistration([row.id]) |
| | | .then((res) => { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | getList(); |
| | | }) |
| | | .finally(() => { |
| | | tableLoading.value = false; |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | |
| | | // æ¹éå é¤ |
| | | const handleBatchDelete = () => { |
| | | if (selectedRows.value.length === 0) { |
| | | proxy.$modal.msgWarning("è¯·éæ©è¦å é¤çæ°æ®"); |
| | | return; |
| | | } |
| | | ElMessageBox.confirm( |
| | | `ç¡®å®è¦å é¤éä¸ç ${selectedRows.value.length} æ¡æ°æ®åï¼`, |
| | | "å é¤æç¤º", |
| | | { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | } |
| | | ) |
| | | .then(() => { |
| | | tableLoading.value = true; |
| | | const ids = selectedRows.value.map((item) => item.id); |
| | | delPaymentRegistration(ids) |
| | | .then((res) => { |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | selectedRows.value = []; |
| | | getList(); |
| | | }) |
| | | .finally(() => { |
| | | tableLoading.value = false; |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | |
| | | // å¯¼åº |
| | | const handleExport = () => { |
| | | const { paymentDate, ...rest } = searchForm; |
| | |
| | | <el-form-item> |
| | | <el-button type="primary" @click="handleQuery"> æç´¢ </el-button> |
| | | <el-button @click="handleExport">导åº</el-button> |
| | | <el-button |
| | | type="danger" |
| | | :disabled="selectedRows.length === 0" |
| | | @click="handleBatchDelete" |
| | | > |
| | | æ¹éå é¤ ({{ selectedRows.length }}) |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div class="table_list"> |
| | |
| | | :total="page.total" |
| | | @pagination="pagination" |
| | | @selection-change="handleSelectionChange" |
| | | ></PIMTable> |
| | | > |
| | | <template #operation="{ row }"> |
| | | <el-button |
| | | type="primary" |
| | | link |
| | | size="small" |
| | | @click="handleDelete(row)" |
| | | > |
| | | å é¤ |
| | | </el-button> |
| | | </template> |
| | | </PIMTable> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | <script setup> |
| | | import { ref, reactive, getCurrentInstance, onMounted } from "vue"; |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { receiptPaymentHistoryListPage } from "@/api/salesManagement/receiptPayment.js"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import { receiptPaymentHistoryListPage, receiptPaymentDel } from "@/api/salesManagement/receiptPayment.js"; |
| | | import useFormData from "@/hooks/useFormData"; |
| | | import dayjs from "dayjs"; |
| | | |
| | |
| | | label: "ç»è®°æ¥æ", |
| | | prop: "createTime", |
| | | width:100 |
| | | }, |
| | | { |
| | | label: "æä½", |
| | | dataType: "slot", |
| | | fixed: "right", |
| | | slot: "operation", |
| | | width: 100, |
| | | align: "center", |
| | | }, |
| | | ]); |
| | | const tableData = ref([]); |
| | |
| | | getList(); |
| | | }; |
| | | |
| | | // å é¤ |
| | | const handleDelete = (row) => { |
| | | ElMessageBox.confirm("确认å é¤è¯¥è®°å½åï¼", "æç¤º", { |
| | | confirmButtonText: "ç¡®å®", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | }) |
| | | .then(async () => { |
| | | try { |
| | | tableLoading.value = true; |
| | | await receiptPaymentDel([row.id]); |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | getList(); |
| | | } catch (error) { |
| | | console.error("å é¤å¤±è´¥:", error); |
| | | proxy.$modal.msgError("å é¤å¤±è´¥"); |
| | | } finally { |
| | | tableLoading.value = false; |
| | | } |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶å é¤"); |
| | | }); |
| | | }; |
| | | |
| | | // æ¹éå é¤ |
| | | const handleBatchDelete = () => { |
| | | if (selectedRows.value.length === 0) { |
| | | proxy.$modal.msgWarning("è¯·éæ©è¦å é¤çæ°æ®"); |
| | | return; |
| | | } |
| | | ElMessageBox.confirm( |
| | | `ç¡®å®è¦å é¤éä¸ç ${selectedRows.value.length} æ¡æ°æ®åï¼`, |
| | | "å é¤æç¤º", |
| | | { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "åæ¶", |
| | | type: "warning", |
| | | } |
| | | ) |
| | | .then(async () => { |
| | | try { |
| | | tableLoading.value = true; |
| | | const ids = selectedRows.value.map((item) => item.id); |
| | | await receiptPaymentDel(ids); |
| | | proxy.$modal.msgSuccess("å 餿å"); |
| | | selectedRows.value = []; |
| | | getList(); |
| | | } catch (error) { |
| | | console.error("å é¤å¤±è´¥:", error); |
| | | proxy.$modal.msgError("å é¤å¤±è´¥"); |
| | | } finally { |
| | | tableLoading.value = false; |
| | | } |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已忶"); |
| | | }); |
| | | }; |
| | | |
| | | // å¯¼åº |
| | | const handleExport = () => { |
| | | const { receiptPaymentDate, ...rest } = searchForm; |