Merge branch 'dev' of http://60.209.125.238:20010/lijingjia/ds-wms-client-web into szh-new
commit
cfe9b11781
@ -1,471 +0,0 @@
|
||||
<!--
|
||||
* @Description: 审核审批 -> 费用表格组件
|
||||
* @Author: lijj
|
||||
* @Date: 2024-06-13 17:08:08
|
||||
-->
|
||||
<template>
|
||||
<div class="ds-approve-fee-table">
|
||||
<data class="ds-table" :style="{ width: tbWidth + '%' }">
|
||||
<BasicTable
|
||||
class="ds-fee-child-table"
|
||||
@register="registerTable"
|
||||
:scroll="{ 'x': '100%', 'y': fheight + 'px'}"
|
||||
@selection-change="selectHandle"
|
||||
>
|
||||
<template #toolbar>
|
||||
<FeeActionBar
|
||||
:ids="feeIds"
|
||||
:feeStatus="feeStatus"
|
||||
:profit="profit"
|
||||
:data="data"
|
||||
@refresh="reload"
|
||||
@checkProfit="checkProfit"
|
||||
></FeeActionBar>
|
||||
</template>
|
||||
<template v-slot:bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'feeStatusText'">
|
||||
<span v-if="record.feeStatus != 1" class="ds-green-status">● {{ record.feeStatusText }}</span>
|
||||
<span v-else class="ds-orange-status">● {{ record.feeStatusText }}</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</data>
|
||||
<data class="ds-form">
|
||||
<!-- 修改后的新值组件 -->
|
||||
<AlterNewValue
|
||||
:selectRow="selectRow"
|
||||
:style="{ 'height': '100%', 'overflow': 'auto' }"
|
||||
v-if="tbWidth == 70"
|
||||
:id="feeIds[feeIds.length - 1]"
|
||||
/>
|
||||
</data>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref, reactive, defineProps, watch, defineExpose, defineEmits } from 'vue'
|
||||
import { BasicTable, useTable } from '/@/components/Table'
|
||||
import { useMessage } from '/@/hooks/web/useMessage'
|
||||
import { GetFees } from '../api'
|
||||
import FeeActionBar from './feeActionBar.vue'
|
||||
import AlterNewValue from './AlterNewValue.vue'
|
||||
import { formatTableData } from '/@/hooks/web/common'
|
||||
import emitter from '/@/utils/Bus'
|
||||
const { createMessage } = useMessage()
|
||||
const props = defineProps({
|
||||
// 业务id
|
||||
id: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// 表格类型
|
||||
tbType: {
|
||||
type: String,
|
||||
default: null
|
||||
},
|
||||
// 业务费用利润
|
||||
profit: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
// 表格的高度
|
||||
feeHeight: {
|
||||
type: Number,
|
||||
default: 162
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['checkProfit'])
|
||||
const checkProfit = () => {
|
||||
return emit('checkProfit')
|
||||
}
|
||||
const data = ref([])
|
||||
// 表格宽度
|
||||
const tbWidth = ref(100)
|
||||
// 原始数据
|
||||
const oldData = ref([])
|
||||
const [registerTable, { reload, setTableData, getDataSource, getSelectRows }] = useTable({
|
||||
title: props.tbType == 'receive' ? '应收费用' : '应付费用',
|
||||
striped: false,
|
||||
api: async (p) => {
|
||||
const res = await GetFees(p)
|
||||
return new Promise((resolve) => {
|
||||
res.data.forEach(item => {
|
||||
item.createTime = formatTableData(item.createTime)
|
||||
})
|
||||
data.value = res.data
|
||||
oldData.value = JSON.parse(JSON.stringify(res.data))
|
||||
resolve({ data: [...res.data], total: res.count })
|
||||
})
|
||||
},
|
||||
beforeFetch: () => {
|
||||
const postParam = {
|
||||
id: props.id[props.id.length - 1]?.id,
|
||||
businessType: props.id[props.id.length - 1]?.businessType,
|
||||
queryCondition: JSON.stringify([
|
||||
// { FieldName: 'BusinessId', FieldValue: props.id[props.id.length - 1]?.id, ConditionalType: 1 },
|
||||
{ FieldName: 'FeeType', FieldValue: props.tbType == 'receive' ? 1 : 2, ConditionalType: 1 }
|
||||
])
|
||||
}
|
||||
return postParam
|
||||
},
|
||||
afterFetch: () => {
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
dataIndex: 'feeStatusText',
|
||||
title: '费用状态',
|
||||
align: 'left',
|
||||
width: 90
|
||||
},
|
||||
{
|
||||
dataIndex: 'feeName',
|
||||
title: props.tbType == 'receive' ? '应收费用名称' : '应付费用名称',
|
||||
align: 'left',
|
||||
width: 130
|
||||
},
|
||||
{
|
||||
dataIndex: 'feeEnName',
|
||||
title: '费用英文名称',
|
||||
align: 'left',
|
||||
width: 130
|
||||
},
|
||||
{
|
||||
dataIndex: 'customerTypeText',
|
||||
align: 'left',
|
||||
title: '客户类别',
|
||||
width: 130
|
||||
},
|
||||
{
|
||||
dataIndex: 'customerName',
|
||||
align: 'left',
|
||||
title: '结算对象',
|
||||
width: 130
|
||||
},
|
||||
{
|
||||
dataIndex: 'unitText',
|
||||
align: 'left',
|
||||
title: '单位标准',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'taxRate',
|
||||
align: 'left',
|
||||
title: '税率',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'unitPrice',
|
||||
align: 'left',
|
||||
title: '单价',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'quantity',
|
||||
align: 'left',
|
||||
title: '数量',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'noTaxPrice',
|
||||
align: 'left',
|
||||
title: '不含税单价',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'noTaxAmount',
|
||||
align: 'left',
|
||||
title: '不含税金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'amount',
|
||||
align: 'left',
|
||||
title: '金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'currency',
|
||||
align: 'left',
|
||||
title: '币别',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'exchangeRate',
|
||||
align: 'left',
|
||||
title: '汇率',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'accTaxRate',
|
||||
align: 'left',
|
||||
title: '销项税率',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'remark',
|
||||
align: 'left',
|
||||
title: '备注',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'isAdvancedPay',
|
||||
align: 'left',
|
||||
title: '是否垫付',
|
||||
width: 120,
|
||||
customRender: ({ text }) => {
|
||||
if (text === true) {
|
||||
return '是'
|
||||
} else if (text === false) {
|
||||
return '否'
|
||||
}
|
||||
return text
|
||||
}
|
||||
},
|
||||
{
|
||||
dataIndex: 'isInvoice',
|
||||
align: 'left',
|
||||
title: '禁开发票',
|
||||
width: 120,
|
||||
customRender: ({ text }) => {
|
||||
if (text === true) {
|
||||
return '是'
|
||||
} else if (text === false) {
|
||||
return '否'
|
||||
}
|
||||
return text
|
||||
}
|
||||
},
|
||||
{
|
||||
dataIndex: 'commissionRate',
|
||||
align: 'left',
|
||||
title: '佣金比率',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'createByName',
|
||||
align: 'left',
|
||||
title: '录入人',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'createTime',
|
||||
align: 'left',
|
||||
title: '录入日期',
|
||||
width: 120
|
||||
},
|
||||
// {
|
||||
// dataIndex: 'createByName',
|
||||
// align: 'left',
|
||||
// title: '审核人',
|
||||
// width: 120
|
||||
// },
|
||||
// {
|
||||
// dataIndex: 'createTime',
|
||||
// align: 'left',
|
||||
// title: '审核日期',
|
||||
// width: 120
|
||||
// },
|
||||
{
|
||||
dataIndex: 'settlementAmount',
|
||||
align: 'left',
|
||||
title: '结算金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'invoiceAmount',
|
||||
align: 'left',
|
||||
title: '已开票金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'orderAmount',
|
||||
align: 'left',
|
||||
title: '申请金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'invoiceNum',
|
||||
align: 'left',
|
||||
title: '发票号码',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'customerFullName',
|
||||
align: 'left',
|
||||
title: '结算对象全称',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'tax',
|
||||
align: 'left',
|
||||
title: '税额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'accTax',
|
||||
align: 'left',
|
||||
title: '销项税额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'accTaxValue',
|
||||
align: 'left',
|
||||
title: '销项金额',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'debitNo',
|
||||
align: 'left',
|
||||
title: '对账编号',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'saleOrg',
|
||||
align: 'left',
|
||||
title: '核算单位',
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
dataIndex: 'reason',
|
||||
align: 'left',
|
||||
title: '驳回/删除原因',
|
||||
width: 140
|
||||
},
|
||||
{
|
||||
dataIndex: 'isOpen',
|
||||
align: 'left',
|
||||
title: '是否机密',
|
||||
width: 120,
|
||||
customRender: ({ text }) => {
|
||||
if (text === true) {
|
||||
return '是'
|
||||
} else if (text === false) {
|
||||
return '否'
|
||||
}
|
||||
return text
|
||||
}
|
||||
},
|
||||
// {
|
||||
// dataIndex: 'reason',
|
||||
// align: 'left',
|
||||
// title: '录入方式',
|
||||
// width: 140
|
||||
// }
|
||||
// {
|
||||
// dataIndex: 'remark',
|
||||
// align: 'left',
|
||||
// title: 'FRT',
|
||||
// width: 120
|
||||
// }
|
||||
],
|
||||
isTreeTable: false,
|
||||
pagination: false,
|
||||
useSearchForm: false,
|
||||
showTableSetting: false,
|
||||
bordered: false,
|
||||
showIndexColumn: true,
|
||||
canResize: false,
|
||||
rowSelection: { type: 'checkbox' },
|
||||
immediate: false
|
||||
})
|
||||
emitter.on('showTodo', (v) => {
|
||||
if (v) {
|
||||
const source = getDataSource()
|
||||
const res = source.filter(item => {
|
||||
return item.feeStatus == 1
|
||||
})
|
||||
setTableData(res)
|
||||
} else {
|
||||
setTableData(oldData.value)
|
||||
}
|
||||
})
|
||||
// 选中数据的id集合
|
||||
const feeIds = ref()
|
||||
// 选中的费用状态
|
||||
const feeStatus = ref()
|
||||
const selectRow = ref()
|
||||
// 选择数据
|
||||
const selectHandle = (v) => {
|
||||
let ids = []
|
||||
let status = []
|
||||
if (v.rows && v.rows.length) {
|
||||
ids = v.rows.map(item => {
|
||||
return item.id
|
||||
})
|
||||
status = v.rows.map(item => {
|
||||
return item.feeStatus
|
||||
})
|
||||
}
|
||||
feeStatus.value = status
|
||||
feeIds.value = ids
|
||||
// 选中的费用修改
|
||||
if (status[status.length - 1] == 3) {
|
||||
// 弹出数据
|
||||
tbWidth.value = 70
|
||||
selectRow.value = v.rows[v.rows.length - 1]
|
||||
} else {
|
||||
tbWidth.value = 100
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.id,
|
||||
(v) => {
|
||||
if (v && v.length) {
|
||||
reload()
|
||||
} else {
|
||||
setTableData([])
|
||||
}
|
||||
}
|
||||
)
|
||||
// 表格滚动的高度 (默认162)
|
||||
const fheight = ref(162)
|
||||
watch(
|
||||
() => props.feeHeight,
|
||||
(v) => {
|
||||
if ( v < 140) {
|
||||
fheight.value = 0
|
||||
} else {
|
||||
fheight.value = v / 2 - 70
|
||||
}
|
||||
const tb = document.getElementsByClassName('ds-fee-child-table')
|
||||
for (let i = 0; i < tb.length; i++) {
|
||||
const child = tb[i].getElementsByClassName('ant-table-body')
|
||||
child[0].style.minHeight = fheight.value + 'px'
|
||||
child[0].style.maxHeight = 'none'
|
||||
}
|
||||
}
|
||||
)
|
||||
onMounted(() => {
|
||||
if (props.id && props.id.length) {
|
||||
//初始化
|
||||
reload()
|
||||
}
|
||||
})
|
||||
defineExpose({
|
||||
reload,
|
||||
getDataSource
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.ds-approve-fee-table {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.ds-form {
|
||||
flex: 1;
|
||||
}
|
||||
.ant-table-body {
|
||||
min-height: 162px;
|
||||
}
|
||||
.ant-table-title {
|
||||
min-height: 22px!important;
|
||||
.items-center {
|
||||
height: 22px;
|
||||
}
|
||||
.vben-basic-title {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue