Merge branch 'feature-financialTax-yjl-1031' into dev
commit
0efda80e08
@ -0,0 +1,117 @@
|
||||
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||
import { numberThousandFormat } from '/@/utils/commonUtil'
|
||||
|
||||
export type BillItem = {
|
||||
id: string
|
||||
reimbursementId: string
|
||||
creationTime: string
|
||||
reimburser: string
|
||||
reimbursementType: number
|
||||
department: string | null
|
||||
voucherNumber: string
|
||||
payeeAccountNumber: string
|
||||
bankName: string
|
||||
payeeName: string
|
||||
amount: number
|
||||
userId: string
|
||||
rejectReason: string | null
|
||||
note: string | null
|
||||
[key: string]: any
|
||||
}
|
||||
|
||||
export const statusList: LabelValueOptions = [
|
||||
{ label: '未提交', value: 0, class: 'icon-jichu_yuanquan', color: '#7A8798' },
|
||||
{ label: '已提交', value: 1, class: 'icon-yiwancheng2-copy', color: '#257AFA' },
|
||||
{ label: '审核通过', value: 2, class: 'icon-yiwancheng2', color: '#17A6A3' },
|
||||
{ label: '审核驳回', value: 3, class: 'icon-weiwancheng-copy', color: '#BA3849' },
|
||||
{ label: '已撤销', value: 4, class: 'icon-yichexiao', color: '#7A8798' },
|
||||
]
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '报销单编号',
|
||||
dataIndex: 'reimbursementId',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '制单时间',
|
||||
dataIndex: 'creationTime',
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return text ?? '-'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '报销人',
|
||||
dataIndex: 'reimburser',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'reimbursementType',
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return statusList.find((el) => el.value === text)?.label || ''
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
dataIndex: 'department',
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return text ?? '-'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '凭证号',
|
||||
dataIndex: 'voucherNumber',
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return text ?? '-'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '收款人账号',
|
||||
dataIndex: 'payeeAccountNumber',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '开户行',
|
||||
dataIndex: 'bankName',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '收款人名称',
|
||||
dataIndex: 'payeeName',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '合计金额',
|
||||
dataIndex: 'amount',
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
]
|
||||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'reimbursementId',
|
||||
label: '报销单编号',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'reimburser',
|
||||
label: '报销人',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'voucherNumber',
|
||||
label: '凭证号',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
]
|
||||
@ -0,0 +1,264 @@
|
||||
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||
import moment from 'moment'
|
||||
import { numberThousandFormat } from '/@/utils/commonUtil'
|
||||
import { BillItem } from '../columns'
|
||||
import { GetClientBankList } from '../api'
|
||||
|
||||
export type PageType = '' | 'ADD' | 'EDIT' | 'VIEW' | 'AUDIT'
|
||||
|
||||
export type BillRowMap = {
|
||||
[key: string]: any
|
||||
}
|
||||
|
||||
export interface BillDetail extends BillItem {
|
||||
data: Recordable[]
|
||||
}
|
||||
|
||||
export const invoiceCodeList: LabelValueOptions = [
|
||||
{ label: '全电发票（铁路电子客票）', value: '51' },
|
||||
{ label: '全电发票（航空运输电子客票行程单）', value: '61' },
|
||||
{ label: '全电发票（增值税专用发票）', value: '81' },
|
||||
{ label: '全电发票（普通发票）', value: '82' },
|
||||
{ label: '全电纸质发票（增值税专用发票）', value: '85' },
|
||||
{ label: '全电纸质发票（普通发票）', value: '86' },
|
||||
{ label: '增值税电子普票发票', value: '026' },
|
||||
{ label: '增值税电子专用发票', value: '028' },
|
||||
{ label: '增值税普通发票', value: '007' },
|
||||
{ label: '增值税专用发票', value: '004' },
|
||||
{ label: '税控卷票', value: '025' },
|
||||
]
|
||||
export const invoiceStatusList: LabelValueOptions = [
|
||||
{ label: '蓝票', value: '00' },
|
||||
{ label: '红票', value: '01' },
|
||||
]
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '发票号码',
|
||||
dataIndex: 'invoiceNumber',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '发票类型代码',
|
||||
dataIndex: 'invoiceTypeCode',
|
||||
width: 200,
|
||||
customRender({ text }) {
|
||||
return invoiceCodeList.find((el) => el.value === text)?.label || ''
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '开票日期',
|
||||
dataIndex: 'invoicingDate',
|
||||
width: 140,
|
||||
},
|
||||
{
|
||||
title: '合计金额',
|
||||
dataIndex: 'totalAmount',
|
||||
// sorter: true,
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '合计税额',
|
||||
dataIndex: 'totalTax',
|
||||
width: 100,
|
||||
// sorter: true,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '价税合计',
|
||||
dataIndex: 'totalWithTax',
|
||||
width: 100,
|
||||
// sorter: true,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '发票状态',
|
||||
dataIndex: 'invoiceStatus',
|
||||
width: 100,
|
||||
// sorter: true,
|
||||
customRender: ({ text }) => {
|
||||
return invoiceStatusList.find((el) => el.value === text)?.label || '未知'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '开票人',
|
||||
dataIndex: 'invoicer',
|
||||
width: 80,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '原发票号码',
|
||||
dataIndex: 'originalInvoiceNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '购方开票名称',
|
||||
dataIndex: 'buyerInvoiceName',
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '购方开票税号',
|
||||
dataIndex: 'buyerInvoiceTaxNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方开票名称',
|
||||
dataIndex: 'sellerInvoiceName',
|
||||
width: 150,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方开票税号',
|
||||
dataIndex: 'sellerInvoiceTaxNumber',
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '是否已获取详情',
|
||||
dataIndex: 'isDetailObtained',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方识别号',
|
||||
dataIndex: 'sellerIdentificationNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
]
|
||||
|
||||
export const getDetailForm = (type: PageType): FormSchema[] => {
|
||||
return [
|
||||
{
|
||||
field: 'bankName',
|
||||
label: '开户行',
|
||||
colProps: { span: 4 },
|
||||
rules: [{ required: true }],
|
||||
dynamicDisabled: ['VIEW', 'AUDIT'].includes(type),
|
||||
component: 'ApiSelect',
|
||||
isEdit: ['VIEW', 'AUDIT'].includes(type) ? 1 : 0,
|
||||
componentProps: ({ formModel }) => {
|
||||
return {
|
||||
immediate: true,
|
||||
api: () => {
|
||||
return new Promise((resolve) => {
|
||||
GetClientBankList({
|
||||
pageCondition: { sortConditions: [] },
|
||||
queryCondition:
|
||||
'[{"FieldName":"clientId","FieldValue":"1844556123181551616","ConditionalType":1}]',
|
||||
}).then((res) => {
|
||||
const dataResult = res?.data || []
|
||||
const defaultData = dataResult.find((item) => item.isInvoiceDefault)
|
||||
|
||||
if (defaultData) {
|
||||
formModel.payeeAccountNumber = defaultData.bankAccountNo
|
||||
formModel.bankName = defaultData.bankName
|
||||
}
|
||||
resolve(res?.data || [])
|
||||
})
|
||||
})
|
||||
},
|
||||
labelField: 'bankName',
|
||||
valueField: 'bankName',
|
||||
onChange: (e, obj) => {
|
||||
if (e && obj) {
|
||||
formModel.payeeAccountNumber = obj.bankAccountNo
|
||||
}
|
||||
if (!e && !obj) {
|
||||
formModel.payeeAccountNumber = ''
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'payeeName',
|
||||
label: '收款人名称',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'payeeAccountNumber',
|
||||
label: '收款人账号',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'reimburser',
|
||||
label: '报销人',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'department',
|
||||
label: '部门',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'amount',
|
||||
label: '金额',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
show: ['VIEW', 'AUDIT'].includes(type),
|
||||
field: 'ledgerAccount',
|
||||
label: '会计科目',
|
||||
rules: [{ required: true }],
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: type === 'VIEW',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
show: ['VIEW', 'AUDIT'].includes(type),
|
||||
field: 'voucherNo',
|
||||
label: '凭证号',
|
||||
colProps: { span: 4 },
|
||||
isEdit: 1,
|
||||
dynamicDisabled: true,
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
// show: type === 'VIEW',
|
||||
field: 'reason',
|
||||
label: '事由',
|
||||
colProps: { span: 4 },
|
||||
component: 'InputTextArea',
|
||||
componentProps: {
|
||||
disTrans: true,
|
||||
disabled: ['VIEW', 'AUDIT'].includes(type),
|
||||
},
|
||||
},
|
||||
{
|
||||
component: 'Divider',
|
||||
colProps: {
|
||||
span: 24,
|
||||
},
|
||||
},
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<BasicModal
|
||||
v-bind="$attrs"
|
||||
:use-wrapper="true"
|
||||
title="审核驳回"
|
||||
width="50%"
|
||||
@register="registerModal"
|
||||
@ok="handleSave"
|
||||
>
|
||||
<!-- 表单 -->
|
||||
<BasicForm @register="registerForm" class="reject-form"> </BasicForm>
|
||||
<!--右下角按钮-->
|
||||
<template #footer>
|
||||
<a-button
|
||||
pre-icon="ant-design:close-outlined"
|
||||
type="warning"
|
||||
:loading="loading"
|
||||
ghost
|
||||
style="margin-right: 0.8rem"
|
||||
@click="closeModal"
|
||||
>
|
||||
取消
|
||||
</a-button>
|
||||
<a-button
|
||||
pre-icon="ant-design:check-circle-outlined"
|
||||
type="primary"
|
||||
:loading="loading"
|
||||
@click="handleSave(true)"
|
||||
>
|
||||
确定
|
||||
</a-button>
|
||||
</template>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import { ReimbursementAudit } from '../../api'
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal'
|
||||
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index'
|
||||
import { useMessage } from '/@/hooks/web/useMessage'
|
||||
const { createMessage } = useMessage()
|
||||
const formSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'reason',
|
||||
label: '驳回原因',
|
||||
defaultValue: '',
|
||||
component: 'InputTextArea',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
rows: 4,
|
||||
disTrans: true,
|
||||
},
|
||||
},
|
||||
]
|
||||
// 声明Emits
|
||||
const emit = defineEmits(['success'])
|
||||
|
||||
const loading = ref(false)
|
||||
const [registerForm, { resetFields, validate }] = useForm({
|
||||
labelWidth: 150,
|
||||
schemas: formSchema,
|
||||
showActionButtonGroup: false,
|
||||
})
|
||||
const rejectRowId = ref('')
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
console.log('data', data)
|
||||
|
||||
resetFields()
|
||||
rejectRowId.value = data.id
|
||||
})
|
||||
|
||||
async function handleSave(exit) {
|
||||
try {
|
||||
const values = await validate()
|
||||
loading.value = true
|
||||
setModalProps({ confirmLoading: true, loading: true })
|
||||
const postData = {
|
||||
result: 2,
|
||||
remark: values.reason,
|
||||
ids: [rejectRowId.value],
|
||||
businessType: 0,
|
||||
}
|
||||
const res = await ReimbursementAudit(postData)
|
||||
loading.value = false
|
||||
if (res.succeeded) {
|
||||
createMessage.success(res.message)
|
||||
emit('success')
|
||||
}
|
||||
exit && closeModal()
|
||||
} finally {
|
||||
setModalProps({ confirmLoading: false, loading: false })
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.reject-form {
|
||||
#form_item_reason {
|
||||
height: 170px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,159 @@
|
||||
import { BasicColumn, FormSchema } from '/@/components/Table'
|
||||
import moment from 'moment'
|
||||
import { numberThousandFormat } from '/@/utils/commonUtil'
|
||||
|
||||
export const invoiceCodeList: LabelValueOptions = [
|
||||
{ label: '全电发票（铁路电子客票）', value: '51' },
|
||||
{ label: '全电发票（航空运输电子客票行程单）', value: '61' },
|
||||
{ label: '全电发票（增值税专用发票）', value: '81' },
|
||||
{ label: '全电发票（普通发票）', value: '82' },
|
||||
{ label: '全电纸质发票（增值税专用发票）', value: '85' },
|
||||
{ label: '全电纸质发票（普通发票）', value: '86' },
|
||||
{ label: '增值税电子普票发票', value: '026' },
|
||||
{ label: '增值税电子专用发票', value: '028' },
|
||||
{ label: '增值税普通发票', value: '007' },
|
||||
{ label: '增值税专用发票', value: '004' },
|
||||
{ label: '税控卷票', value: '025' },
|
||||
]
|
||||
export const invoiceStatusList: LabelValueOptions = [
|
||||
{ label: '蓝票', value: '00' },
|
||||
{ label: '红票', value: '01' },
|
||||
]
|
||||
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '发票号码',
|
||||
dataIndex: 'invoiceNumber',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '发票类型代码',
|
||||
dataIndex: 'invoiceTypeCode',
|
||||
width: 200,
|
||||
customRender({ text }) {
|
||||
return invoiceCodeList.find((el) => el.value === text)?.label || ''
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '开票日期',
|
||||
dataIndex: 'invoicingDate',
|
||||
width: 140,
|
||||
},
|
||||
{
|
||||
title: '合计金额',
|
||||
dataIndex: 'totalAmount',
|
||||
sorter: true,
|
||||
width: 100,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '合计税额',
|
||||
dataIndex: 'totalTax',
|
||||
width: 100,
|
||||
sorter: true,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '价税合计',
|
||||
dataIndex: 'totalWithTax',
|
||||
width: 100,
|
||||
sorter: true,
|
||||
customRender({ text }) {
|
||||
return numberThousandFormat(text)
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '发票状态',
|
||||
dataIndex: 'invoiceStatus',
|
||||
width: 100,
|
||||
sorter: true,
|
||||
customRender: ({ text }) => {
|
||||
return invoiceStatusList.find((el) => el.value === text)?.label || '未知'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '开票人',
|
||||
dataIndex: 'invoicer',
|
||||
width: 80,
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '原发票号码',
|
||||
dataIndex: 'originalInvoiceNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '购方开票名称',
|
||||
dataIndex: 'buyerInvoiceName',
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '购方开票税号',
|
||||
dataIndex: 'buyerInvoiceTaxNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方开票名称',
|
||||
dataIndex: 'sellerInvoiceName',
|
||||
width: 130,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方开票税号',
|
||||
dataIndex: 'sellerInvoiceTaxNumber',
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '是否已获取详情',
|
||||
dataIndex: 'isDetailObtained',
|
||||
width: 120,
|
||||
align: 'center',
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '销方识别号',
|
||||
dataIndex: 'sellerIdentificationNumber',
|
||||
width: 200,
|
||||
// sorter: true,
|
||||
},
|
||||
]
|
||||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'invoiceNumber',
|
||||
label: '发票号码',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'buyerInvoiceTaxNumber',
|
||||
label: '购方开票税号',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'buyerInvoiceName',
|
||||
label: '购方开票名称',
|
||||
colProps: { span: 4 },
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
field: 'invoicingDate',
|
||||
label: '开票时间',
|
||||
component: 'RangePicker',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
},
|
||||
},
|
||||
]
|
||||
@ -0,0 +1,224 @@
|
||||
<template>
|
||||
<div class="ds-fee-settle-main-table">
|
||||
<BasicTable @row-dbClick="GoDetailed" class="ds-table" @register="registerTable">
|
||||
<template #tableTitle>
|
||||
<div class="ds-h-aciton-btns-fee">
|
||||
<a-tooltip placement="top" :mouseEnterDelay="0.5">
|
||||
<template #title>
|
||||
<span>新建</span>
|
||||
</template>
|
||||
<span class="ds-action-svg-btn" @click="GoAdd">
|
||||
<img src="../../../assets/svg/infoclient/xinjian.svg" class="SvgImg" />
|
||||
</span>
|
||||
</a-tooltip>
|
||||
<a-tooltip placement="top" :mouseEnterDelay="0.5">
|
||||
<template #title>
|
||||
<span>删除</span>
|
||||
</template>
|
||||
<a-popconfirm
|
||||
title="确定删除当前选中数据？"
|
||||
@confirm="FnDel"
|
||||
ok-text="是"
|
||||
cancel-text="否"
|
||||
>
|
||||
<span class="ds-action-svg-btn">
|
||||
<img src="../../../assets/svg/infoclient/shanchu.svg" class="SvgImg" />
|
||||
</span>
|
||||
</a-popconfirm>
|
||||
</a-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<template v-slot:bodyCell="{ column, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<TableAction :actions="getActionOptList(record)" />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'invoiceNumber'">
|
||||
<span>{{ record.invoiceNumber || '' }}</span>
|
||||
<i
|
||||
class="iconfont icon-fuzhi3"
|
||||
style="color: #257afa; font-size: 14px; margin-left: 4px; cursor: pointer"
|
||||
v-if="record.invoiceNumber"
|
||||
@click="copyHandle(record)"
|
||||
></i>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'reimbursementType'">
|
||||
<span
|
||||
:class="['status-box', 'iconfont', getStatusInfo(record, 'class')]"
|
||||
:style="{ color: getStatusInfo(record, 'color'), fontSize: '16px' }"
|
||||
>
|
||||
<span :style="{ color: getStatusInfo(record, 'color') }">
|
||||
{{ getStatusInfo(record, 'label') }}
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ReimbursementGetList, ReimbursementDelete } from './api.js'
|
||||
import { BasicTable, useTable, TableAction, ActionItem } from '/@/components/Table'
|
||||
import { formatParams } from '/@/hooks/web/common'
|
||||
import { BillItem, columns, searchFormSchema, statusList } from './columns'
|
||||
import { useMessage } from '/@/hooks/web/useMessage'
|
||||
const { createMessage } = useMessage()
|
||||
import { useGo } from '/@/hooks/web/usePage'
|
||||
import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'
|
||||
import { useAppStore } from '/@/store/modules/app'
|
||||
const appStore = useAppStore()
|
||||
|
||||
const go = useGo()
|
||||
const [registerTable, { reload, setLoading, getSelectRows }] = useTable({
|
||||
api: async (p) => {
|
||||
const res: API.DataResult<BillItem[]> = await ReimbursementGetList(p)
|
||||
return new Promise((resolve) => {
|
||||
const ids = res.data.map((item) => {
|
||||
return item.id
|
||||
})
|
||||
appStore.setIdsData(res.data, 'expenseAccount')
|
||||
appStore.setIds(ids, 'expenseAccount')
|
||||
resolve({ data: [...res.data], total: res.count })
|
||||
})
|
||||
},
|
||||
beforeFetch: (p) => {
|
||||
return formatParams(p)
|
||||
},
|
||||
columns,
|
||||
formConfig: {
|
||||
labelWidth: 120,
|
||||
schemas: searchFormSchema,
|
||||
useAdvancedSearch: true,
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox',
|
||||
},
|
||||
isTreeTable: false,
|
||||
pagination: true,
|
||||
striped: true,
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
bordered: true,
|
||||
showIndexColumn: true,
|
||||
indexColumnProps: {
|
||||
width: 60,
|
||||
},
|
||||
canResize: true,
|
||||
immediate: true,
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
fixed: 'right',
|
||||
},
|
||||
})
|
||||
|
||||
const getStatusInfo = (row, key) => {
|
||||
const item = statusList?.find((el) => el.value === row?.reimbursementType)
|
||||
return (item?.[key] as string) || ''
|
||||
}
|
||||
|
||||
const getActionOptList = (record: BillItem): ActionItem[] => {
|
||||
const canEditable = [0, 2, 4].includes(record.reimbursementType)
|
||||
return [
|
||||
{
|
||||
icon: canEditable ? 'clarity:note-edit-line' : 'ant-design:file-text-outlined',
|
||||
/* icon: canEditable
|
||||
? 'clarity:note-edit-line'
|
||||
: h('i', {
|
||||
class: 'iconfont icon-chakan',
|
||||
style: { color: '#257afa', fontSize: '16px' },
|
||||
}), */
|
||||
// isCustomIcon: !canEditable,
|
||||
tooltip: canEditable ? '编辑' : '查看',
|
||||
onClick: GoDetailed.bind(null, record),
|
||||
},
|
||||
]
|
||||
}
|
||||
function FnDel() {
|
||||
if (getSelectRows().length == 0) {
|
||||
return createMessage.error('请选择数据')
|
||||
}
|
||||
if (getSelectRows().some((el) => el.reimbursementType != 0)) {
|
||||
return createMessage.error('只能删除未提交的数据')
|
||||
}
|
||||
const data: { ids: string[] } = {
|
||||
ids: getSelectRows().map((item) => item.id),
|
||||
}
|
||||
setLoading(true)
|
||||
ReimbursementDelete(data)
|
||||
.then((res) => {
|
||||
if (res.succeeded) {
|
||||
createMessage.success('删除成功')
|
||||
reload()
|
||||
}
|
||||
setLoading(false)
|
||||
})
|
||||
.catch(() => {
|
||||
setLoading(false)
|
||||
})
|
||||
}
|
||||
const copyHandle = (row: BillItem) => {
|
||||
const { clipboardRef, isSuccessRef } = useCopyToClipboard(row.invoiceNumber)
|
||||
clipboardRef.value = row.invoiceNumber
|
||||
if (unref(isSuccessRef)) {
|
||||
createMessage.success('复制成功！')
|
||||
}
|
||||
}
|
||||
function GoAdd() {
|
||||
go({
|
||||
path: '/expenseAccountDetail',
|
||||
query: {
|
||||
type: 'ADD',
|
||||
tabName: '报销单申请',
|
||||
},
|
||||
})
|
||||
}
|
||||
function GoDetailed(row: BillItem) {
|
||||
const pageType = [0, 2, 4].includes(row.reimbursementType) ? 'EDIT' : 'VIEW'
|
||||
go({
|
||||
path: '/expenseAccountDetail',
|
||||
query: {
|
||||
type: pageType,
|
||||
id: row.id,
|
||||
tabName: pageType == 'EDIT' ? '报销单申请' : '报销单详情',
|
||||
},
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.SvgImg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: 6.8px;
|
||||
}
|
||||
:deep(.ant-table-title) {
|
||||
padding: 0 20px !important;
|
||||
}
|
||||
.ds-h-aciton-btns-fee {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.ds-action-svg-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 2px;
|
||||
margin-right: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ds-action-svg-btn:hover {
|
||||
box-shadow: 0px 2px 4px #cad1db;
|
||||
}
|
||||
}
|
||||
.status-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
& > span {
|
||||
margin-left: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue