|
@@ -1,15 +1,22 @@
|
|
|
<script setup lang="ts">
|
|
|
import AForm from '@/components/AForm/index.vue'
|
|
|
-import {FormConfigType} from '@/components/AForm/type'
|
|
|
-import {ToolbarConfigType} from '@/components/AToolbar/type'
|
|
|
-import {ColumnConfigType} from '@/components/ATable/type'
|
|
|
-import {StrAnyObj, StrAnyObjArr} from '@/typings'
|
|
|
-import {useHandleData} from '@/utils/useHandleData'
|
|
|
-import {addApi, deleteApi, editApi, getDetailApi, getPageApi} from '@/api/business/payment/requests'
|
|
|
-import {getPageApi as getCorporationPageApi} from '@/api/business/corporation/corporation'
|
|
|
+import { FormConfigType } from '@/components/AForm/type'
|
|
|
+import { ToolbarConfigType } from '@/components/AToolbar/type'
|
|
|
+import { ColumnConfigType } from '@/components/ATable/type'
|
|
|
+import { StrAnyObj, StrAnyObjArr } from '@/typings'
|
|
|
+import { useHandleData } from '@/utils/useHandleData'
|
|
|
+import {
|
|
|
+ addApi,
|
|
|
+ deleteApi,
|
|
|
+ editApi,
|
|
|
+ getDetailApi,
|
|
|
+ getPageApi
|
|
|
+} from '@/api/business/payment/requests'
|
|
|
+import { getPageApi as getCorporationPageApi } from '@/api/business/corporation/corporation'
|
|
|
import DeptTreeSelect from '@/views/components/DeptTreeSelect/index.vue'
|
|
|
-import {getPageApi as getCapitalAccountPageApi} from '@/api/business/capital/account'
|
|
|
+import { getPageApi as getCapitalAccountPageApi } from '@/api/business/capital/account'
|
|
|
import FileUpload from '@/components/FlieUpload/index.vue'
|
|
|
+import { getDictByCode } from '@/utils/dict'
|
|
|
|
|
|
const queryRef = ref<InstanceType<typeof AForm>>()
|
|
|
const formRef = ref<InstanceType<typeof AForm>>()
|
|
@@ -18,9 +25,9 @@ const showQuery = ref<boolean>(true)
|
|
|
const selectKeys = ref<string[]>([])
|
|
|
const pageTotal = ref<number>(0)
|
|
|
|
|
|
-const queryData = ref<StrAnyObj>({pageNum: 1, pageSize: 10})
|
|
|
+const queryData = ref<StrAnyObj>({ pageNum: 1, pageSize: 10 })
|
|
|
const tableData = ref<StrAnyObjArr>([])
|
|
|
-const formData = ref<StrAnyObj>({paymentRequestsDetailList: [{}]})
|
|
|
+const formData = ref<StrAnyObj>({ paymentRequestsDetailList: [{}] })
|
|
|
|
|
|
const dialogTitle = ref<string>('')
|
|
|
const dialogVisible = ref<boolean>(false)
|
|
@@ -40,12 +47,12 @@ const queryConfig: FormConfigType[] = [
|
|
|
async option() {
|
|
|
const data = await getCorporationPageApi({ searchAll: true })
|
|
|
return data.records
|
|
|
- },
|
|
|
+ }
|
|
|
},
|
|
|
{
|
|
|
type: 'slot',
|
|
|
prop: 'deptId',
|
|
|
- label: '归属部门',
|
|
|
+ label: '归属部门'
|
|
|
},
|
|
|
{
|
|
|
type: 'select',
|
|
@@ -79,7 +86,7 @@ const queryConfig: FormConfigType[] = [
|
|
|
{
|
|
|
key: 3,
|
|
|
label: '已驳回'
|
|
|
- },
|
|
|
+ }
|
|
|
]
|
|
|
},
|
|
|
{
|
|
@@ -208,7 +215,7 @@ const columnConfig: ColumnConfigType[] = [
|
|
|
dialogVisible.value = true
|
|
|
dialogTitle.value = '重新发起'
|
|
|
disabled.value = false
|
|
|
- getDetailApi({id: row.id}).then((resp: StrAnyObj) => {
|
|
|
+ getDetailApi({ id: row.id }).then((resp: StrAnyObj) => {
|
|
|
formData.value = resp
|
|
|
})
|
|
|
nextTick(() => deptIdRef.value?.load())
|
|
@@ -223,8 +230,6 @@ const columnConfig: ColumnConfigType[] = [
|
|
|
nextTick(() => deptIdRef.value?.load())
|
|
|
getDetailApi({ id: row.id }).then((resp: StrAnyObj) => {
|
|
|
formData.value = resp
|
|
|
- updateAmount()
|
|
|
- updateDetailRemark()
|
|
|
})
|
|
|
}
|
|
|
}
|
|
@@ -240,23 +245,23 @@ const formConfig: FormConfigType[] = [
|
|
|
keyName: 'id',
|
|
|
labelName: 'name',
|
|
|
async option() {
|
|
|
- const data = await getCorporationPageApi({searchAll: true})
|
|
|
+ const data = await getCorporationPageApi({ searchAll: true })
|
|
|
return data.records
|
|
|
},
|
|
|
- rule: [{required: true, message: '归属公司id不能为空', trigger: 'blur'}]
|
|
|
+ rule: [{ required: true, message: '归属公司id不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
{
|
|
|
type: 'slot',
|
|
|
prop: 'deptId',
|
|
|
label: '归属部门',
|
|
|
- rule: [{required: true, message: '部门id不能为空', trigger: 'blur'}]
|
|
|
+ rule: [{ required: true, message: '部门id不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
{
|
|
|
type: 'select',
|
|
|
prop: 'type',
|
|
|
label: '请款类型',
|
|
|
dict: 'payment_requests_type',
|
|
|
- rule: [{required: true, message: '请款类型不能为空', trigger: 'blur'}]
|
|
|
+ rule: [{ required: true, message: '请款类型不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
{
|
|
|
type: 'datePicker',
|
|
@@ -301,14 +306,14 @@ const formConfig: FormConfigType[] = [
|
|
|
label: '单据数量',
|
|
|
min: 0,
|
|
|
precision: 0,
|
|
|
- rule: [{required: true, message: '单据数量不能为空', trigger: 'blur'}]
|
|
|
+ rule: [{ required: true, message: '单据数量不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
{
|
|
|
type: 'select',
|
|
|
prop: 'payType',
|
|
|
label: '付款方式',
|
|
|
dict: 'pay_type',
|
|
|
- rule: [{required: true, message: '付款方式不能为空', trigger: 'blur'}]
|
|
|
+ rule: [{ required: true, message: '付款方式不能为空', trigger: 'blur' }]
|
|
|
},
|
|
|
{
|
|
|
type: 'select',
|
|
@@ -317,7 +322,7 @@ const formConfig: FormConfigType[] = [
|
|
|
keyName: 'id',
|
|
|
labelName: 'accountAlias',
|
|
|
async option() {
|
|
|
- const data = await getCapitalAccountPageApi({searchAll: true})
|
|
|
+ const data = await getCapitalAccountPageApi({ searchAll: true })
|
|
|
return data.records
|
|
|
}
|
|
|
},
|
|
@@ -366,7 +371,6 @@ const detailTableColumnConfig: ColumnConfigType[] = [
|
|
|
common: 'delete',
|
|
|
click(row, index) {
|
|
|
formData.value.paymentRequestsDetailList.splice(index, 1)
|
|
|
- updateDetailRemark()
|
|
|
updateAmount()
|
|
|
}
|
|
|
}
|
|
@@ -434,7 +438,7 @@ function formClosed() {
|
|
|
|
|
|
function handleRemove(idList: string[]) {
|
|
|
useHandleData('是否确认删除?', () => {
|
|
|
- deleteApi({idList}).then(() => {
|
|
|
+ deleteApi({ idList }).then(() => {
|
|
|
ElMessage.success('删除成功')
|
|
|
getPage()
|
|
|
})
|
|
@@ -445,18 +449,27 @@ function addPaymentRequestsDetailList() {
|
|
|
formData.value.paymentRequestsDetailList.push({})
|
|
|
}
|
|
|
|
|
|
-function updateDetailRemark() {
|
|
|
+async function updateDetailRemark() {
|
|
|
+ const expenseTypes = await getDictByCode('expense_type')
|
|
|
+ const expenseMap = new Map<number, string>()
|
|
|
+ for (const item of expenseTypes) {
|
|
|
+ expenseMap.set(item.value, item.label)
|
|
|
+ }
|
|
|
formData.value.useRemark = formData.value.paymentRequestsDetailList
|
|
|
- .map((item) => item.remark)
|
|
|
- .filter((item) => item !== '' && item !== null && item !== undefined)
|
|
|
- .join(' - \n')
|
|
|
+ .map(
|
|
|
+ (item) =>
|
|
|
+ `【${expenseMap.get(item.expenseType) ?? ''}】 - ${item.remark ?? ''} - ${item.amount ?? ''}`
|
|
|
+ )
|
|
|
+ .join('\n')
|
|
|
}
|
|
|
|
|
|
function updateAmount() {
|
|
|
formData.value.totalAmount = formData.value.paymentRequestsDetailList
|
|
|
- .map((item) => item.amount)
|
|
|
- .filter((item) => item !== '' && item !== null && item !== undefined)
|
|
|
- .reduce((pre, next) => pre + next, 0)
|
|
|
+ .map((item) => item.amount)
|
|
|
+ .filter((item) => item !== '' && item !== null && item !== undefined)
|
|
|
+ .reduce((pre, next) => pre + next, 0)
|
|
|
+
|
|
|
+ updateDetailRemark()
|
|
|
}
|
|
|
</script>
|
|
|
|
|
@@ -471,69 +484,73 @@ function updateAmount() {
|
|
|
</el-card>
|
|
|
|
|
|
<a-table
|
|
|
- selection
|
|
|
- :data="tableData"
|
|
|
- :page-total="pageTotal"
|
|
|
- :toolbar-config="toolbarConfig"
|
|
|
- :column-config="columnConfig"
|
|
|
- v-model:showQuery="showQuery"
|
|
|
- v-model:page-num="queryData.pageNum"
|
|
|
- v-model:page-size="queryData.pageSize"
|
|
|
- @page-num-change="getPage"
|
|
|
- @page-size-change="getPage"
|
|
|
- @selection-change="tableSelectionChange"
|
|
|
+ :data="tableData"
|
|
|
+ :page-total="pageTotal"
|
|
|
+ :toolbar-config="toolbarConfig"
|
|
|
+ :column-config="columnConfig"
|
|
|
+ v-model:showQuery="showQuery"
|
|
|
+ v-model:page-num="queryData.pageNum"
|
|
|
+ v-model:page-size="queryData.pageSize"
|
|
|
+ @page-num-change="getPage"
|
|
|
+ @page-size-change="getPage"
|
|
|
+ @selection-change="tableSelectionChange"
|
|
|
>
|
|
|
</a-table>
|
|
|
|
|
|
<a-dialog
|
|
|
- v-model="dialogVisible"
|
|
|
- :title="dialogTitle"
|
|
|
- @submit="formSubmit"
|
|
|
- @closed="formClosed"
|
|
|
- width="1400px"
|
|
|
- height="200px"
|
|
|
+ v-model="dialogVisible"
|
|
|
+ :title="dialogTitle"
|
|
|
+ @submit="formSubmit"
|
|
|
+ @closed="formClosed"
|
|
|
+ width="1400px"
|
|
|
+ height="200px"
|
|
|
>
|
|
|
- <a-form ref="formRef" v-model="formData" :config="formConfig" :span="12" :disabled="disabled">
|
|
|
+ <a-form ref="formRef" v-model="formData" :config="formConfig" :span="12" :disabled="disabled">
|
|
|
<template #deptId>
|
|
|
- <dept-tree-select ref="deptIdRef" v-model="formData.deptId" :disabled="disabled"/>
|
|
|
+ <dept-tree-select ref="deptIdRef" v-model="formData.deptId" :disabled="disabled" />
|
|
|
</template>
|
|
|
<template #atts>
|
|
|
- <file-upload v-model="formData.atts" :disabled="disabled"/>
|
|
|
+ <file-upload v-model="formData.atts" :disabled="disabled" />
|
|
|
</template>
|
|
|
<template #detailTable>
|
|
|
<a-table
|
|
|
- :data="formData.paymentRequestsDetailList"
|
|
|
- :columnConfig="detailTableColumnConfig"
|
|
|
- style="width: 100%"
|
|
|
- :card="false"
|
|
|
+ :data="formData.paymentRequestsDetailList"
|
|
|
+ :columnConfig="detailTableColumnConfig"
|
|
|
+ style="width: 100%"
|
|
|
+ :card="false"
|
|
|
>
|
|
|
<template #expenseType="scope">
|
|
|
- <a-select v-model="scope.row.expenseType" dict="expense_type" :disabled="disabled"/>
|
|
|
+ <a-select
|
|
|
+ v-model="scope.row.expenseType"
|
|
|
+ dict="expense_type"
|
|
|
+ :disabled="disabled"
|
|
|
+ @change="updateDetailRemark"
|
|
|
+ />
|
|
|
</template>
|
|
|
<template #remark="scope">
|
|
|
<a-input
|
|
|
- v-model="scope.row.remark"
|
|
|
- type="textarea"
|
|
|
- :rows="2"
|
|
|
- @change="updateDetailRemark"
|
|
|
- :disabled="disabled"
|
|
|
+ v-model="scope.row.remark"
|
|
|
+ type="textarea"
|
|
|
+ :rows="2"
|
|
|
+ @change="updateDetailRemark"
|
|
|
+ :disabled="disabled"
|
|
|
/>
|
|
|
</template>
|
|
|
<template #amount="scope">
|
|
|
<a-inputNumber
|
|
|
- v-model="scope.row.amount"
|
|
|
- :min="0.01"
|
|
|
- :precision="2"
|
|
|
- @change="updateAmount"
|
|
|
- :disabled="disabled"
|
|
|
+ v-model="scope.row.amount"
|
|
|
+ :min="0.01"
|
|
|
+ :precision="2"
|
|
|
+ @change="updateAmount"
|
|
|
+ :disabled="disabled"
|
|
|
/>
|
|
|
</template>
|
|
|
</a-table>
|
|
|
<el-button
|
|
|
- v-if="!disabled"
|
|
|
- style="width: 100%; margin-bottom: 20px"
|
|
|
- type="primary"
|
|
|
- @click="addPaymentRequestsDetailList"
|
|
|
+ v-if="!disabled"
|
|
|
+ style="width: 100%; margin-bottom: 20px"
|
|
|
+ type="primary"
|
|
|
+ @click="addPaymentRequestsDetailList"
|
|
|
>
|
|
|
添加行
|
|
|
</el-button>
|