|
|
@ -1,506 +0,0 @@
|
|
|
|
<!--
|
|
|
|
|
|
|
|
* @Description: 审核审批 -> 应收应付费用审批
|
|
|
|
|
|
|
|
* @Author: lijj
|
|
|
|
|
|
|
|
* @Date: 2024-06-13 17:08:08
|
|
|
|
|
|
|
|
-->
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
|
|
|
<a-spin :spinning="loading">
|
|
|
|
|
|
|
|
<div class="ds-approve-fee-sf">
|
|
|
|
|
|
|
|
<BasicTable
|
|
|
|
|
|
|
|
class="ds-mini-table fee-table"
|
|
|
|
|
|
|
|
height="500px"
|
|
|
|
|
|
|
|
:scroll="{ 'x': '100%', 'y': fheight + 'px' }"
|
|
|
|
|
|
|
|
@register="registerTable"
|
|
|
|
|
|
|
|
@selection-change="selectHandle"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<template #toolbar>
|
|
|
|
|
|
|
|
<MainActionBar
|
|
|
|
|
|
|
|
:ids="busId"
|
|
|
|
|
|
|
|
:data="data"
|
|
|
|
|
|
|
|
@apporveHandle="mainApprove"
|
|
|
|
|
|
|
|
></MainActionBar>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<template v-slot:bodyCell="{ column, record }">
|
|
|
|
|
|
|
|
<!-- 应收费用 -->
|
|
|
|
|
|
|
|
<template v-if="column.dataIndex == 'arFeeStatus'">
|
|
|
|
|
|
|
|
<span v-if="record.arFeeStatus == 0" class="ds-green-tag">
|
|
|
|
|
|
|
|
{{ record.arFeeStatusText }}</span>
|
|
|
|
|
|
|
|
<span v-else-if="record.arFeeStatus == 1" class="ds-blue-tag">{{
|
|
|
|
|
|
|
|
record.arFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else-if="/^2|3|4|5|6$/.test(record.arFeeStatus)" class="ds-orange-tag">{{
|
|
|
|
|
|
|
|
record.arFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else-if="/^7|8$/.test(record.arFeeStatus)" class="ds-red-tag">{{
|
|
|
|
|
|
|
|
record.arFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else class="ds-purple-tag">{{ record.arFeeStatusText }}</span>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<!-- 应付费用 -->
|
|
|
|
|
|
|
|
<template v-if="column.dataIndex == 'apFeeStatus'">
|
|
|
|
|
|
|
|
<span v-if="record.apFeeStatus == 0" class="ds-green-tag">{{
|
|
|
|
|
|
|
|
record.apFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else-if="record.apFeeStatus == 1" class="ds-blue-tag">{{
|
|
|
|
|
|
|
|
record.apFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else-if="/^2|3|4|5|6$/.test(record.apFeeStatus)" class="ds-orange-tag">{{
|
|
|
|
|
|
|
|
record.apFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else-if="/^7|8$/.test(record.apFeeStatus)" class="ds-red-tag">{{
|
|
|
|
|
|
|
|
record.apFeeStatusText
|
|
|
|
|
|
|
|
}}</span>
|
|
|
|
|
|
|
|
<span v-else class="ds-purple-tag">{{ record.apFeeStatusText }}</span>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</BasicTable>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- <Statistic v-show="busId.length" :id="busId"></Statistic> -->
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</a-spin>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
|
|
|
import { onMounted, ref, defineExpose } from 'vue'
|
|
|
|
|
|
|
|
import { BasicTable, useTable } from '/@/components/Table'
|
|
|
|
|
|
|
|
import { formatParams } from '/@/hooks/web/common'
|
|
|
|
|
|
|
|
import { GetList, GetFees } from './api'
|
|
|
|
|
|
|
|
import { Divider } from 'ant-design-vue'
|
|
|
|
|
|
|
|
import FeeActionBar from './components/feeActionBar.vue'
|
|
|
|
|
|
|
|
// import { useModal } from '/@/components/Modal'
|
|
|
|
|
|
|
|
import { columns, searchFormSchema } from './columns'
|
|
|
|
|
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'
|
|
|
|
|
|
|
|
// import FeeTable from './components/feeTable.vue'
|
|
|
|
|
|
|
|
// import Statistic from './components/Statistic.vue'
|
|
|
|
|
|
|
|
import MainActionBar from './components/mainActionBar.vue'
|
|
|
|
|
|
|
|
import { formatTableData } from '/@/hooks/web/common'
|
|
|
|
|
|
|
|
const { createMessage } = useMessage()
|
|
|
|
|
|
|
|
// 主窗口loading
|
|
|
|
|
|
|
|
const loading = ref(false)
|
|
|
|
|
|
|
|
// 选中的业务id
|
|
|
|
|
|
|
|
const busId = ref([])
|
|
|
|
|
|
|
|
const data = ref([])
|
|
|
|
|
|
|
|
const innerHeight = window.innerHeight
|
|
|
|
|
|
|
|
const fheight = (innerHeight / 2) - 97
|
|
|
|
|
|
|
|
const [registerTable, { reload, getDataSource }] = useTable({
|
|
|
|
|
|
|
|
maxHeight: (innerHeight - 60) / 2,
|
|
|
|
|
|
|
|
api: async (p) => {
|
|
|
|
|
|
|
|
const res = await GetList(p)
|
|
|
|
|
|
|
|
return new Promise((resolve) => {
|
|
|
|
|
|
|
|
res.data.forEach(item => {
|
|
|
|
|
|
|
|
item.etd = formatTableData(item.etd)
|
|
|
|
|
|
|
|
item.accountDate = formatTableData(item.accountDate)
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
data.value = res.data
|
|
|
|
|
|
|
|
resolve({ data: [...res.data], total: res.count })
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
beforeFetch: (p) => {
|
|
|
|
|
|
|
|
return formatParams(p)
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
afterFetch: () => {
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
columns,
|
|
|
|
|
|
|
|
formConfig: {
|
|
|
|
|
|
|
|
labelWidth: 120,
|
|
|
|
|
|
|
|
schemas: searchFormSchema,
|
|
|
|
|
|
|
|
// 是否显示高级查询(默认否)
|
|
|
|
|
|
|
|
useAdvancedSearch: true,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
isTreeTable: false,
|
|
|
|
|
|
|
|
pagination: true,
|
|
|
|
|
|
|
|
striped: false,
|
|
|
|
|
|
|
|
useSearchForm: true,
|
|
|
|
|
|
|
|
showTableSetting: true,
|
|
|
|
|
|
|
|
showIndexColumn: true,
|
|
|
|
|
|
|
|
rowSelection: { type: 'checkbox' },
|
|
|
|
|
|
|
|
canResize: false,
|
|
|
|
|
|
|
|
immediate: false,
|
|
|
|
|
|
|
|
resizeHeightOffset: (innerHeight - 60) / 2
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
// 应收应付表格数据整体
|
|
|
|
|
|
|
|
const tableData = ref([])
|
|
|
|
|
|
|
|
const selectHandle = (v) => {
|
|
|
|
|
|
|
|
let ids = []
|
|
|
|
|
|
|
|
if (v.rows && v.rows.length) {
|
|
|
|
|
|
|
|
ids = v.rows.map(item => {
|
|
|
|
|
|
|
|
return { id: item.id, businessType: item.businessType }
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 默认选择当前显示费用的业务类型
|
|
|
|
|
|
|
|
busId.value = ids
|
|
|
|
|
|
|
|
if (ids && ids.length) {
|
|
|
|
|
|
|
|
GetFees(ids[0]).then(res => {
|
|
|
|
|
|
|
|
const val = res.data
|
|
|
|
|
|
|
|
// 处理详情信息数据
|
|
|
|
|
|
|
|
if (val.etd) val.etd = val.etd.split(' ')[0]
|
|
|
|
|
|
|
|
if (val.eta) val.etd = val.eta.split(' ')[0]
|
|
|
|
|
|
|
|
val.etd = val.etd || '' + (val.etd ? '/' : '') + val.eta || ''
|
|
|
|
|
|
|
|
val.loadPort = val.loadPort || '' + (val.loadPort ? '/' : '') + val.dischargePort || ''
|
|
|
|
|
|
|
|
val.vessel = val.vessel || '' + (val.vessel ? '/' : '') + val.voyno || ''
|
|
|
|
|
|
|
|
list.value.forEach(item => {
|
|
|
|
|
|
|
|
for(let key in val) {
|
|
|
|
|
|
|
|
if (item.field === key) {
|
|
|
|
|
|
|
|
if (key == 'etd' && val[key]) {
|
|
|
|
|
|
|
|
val[key] = val[key].split(' ')[0]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
item.value = val[key]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
// 处理表格数据
|
|
|
|
|
|
|
|
tableData.value = val.itemGroups
|
|
|
|
|
|
|
|
// 应收费用数据
|
|
|
|
|
|
|
|
if (val.itemGroups) {
|
|
|
|
|
|
|
|
RData.value = []
|
|
|
|
|
|
|
|
PData.value = []
|
|
|
|
|
|
|
|
val.itemGroups.forEach(item => {
|
|
|
|
|
|
|
|
if (item.items.length == 0) {
|
|
|
|
|
|
|
|
item.items = [{ feeType: 1 }, { feeType: 2 }]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (item.items.length == 1) {
|
|
|
|
|
|
|
|
if (item.items[0].feeType == 1) {
|
|
|
|
|
|
|
|
item.items[1] = { feeType: 2 }
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
item.items[1] = { feeType: 1 }
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
item.items.forEach(row => {
|
|
|
|
|
|
|
|
if (row.currency == 'RMB') {
|
|
|
|
|
|
|
|
row['RMB'] = row.amount
|
|
|
|
|
|
|
|
} else if (row.currency == 'USD') {
|
|
|
|
|
|
|
|
row['USD'] = row.amount
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
row['other'] = row.amount
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 应收
|
|
|
|
|
|
|
|
if (row.feeType === 1) {
|
|
|
|
|
|
|
|
RData.value.push(row)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 应付
|
|
|
|
|
|
|
|
if (row.feeType === 2) {
|
|
|
|
|
|
|
|
PData.value.push(row)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
list.value.forEach(item => {
|
|
|
|
|
|
|
|
item.value = ''
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
tableData.value = []
|
|
|
|
|
|
|
|
PData.value = []
|
|
|
|
|
|
|
|
RData.value = []
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const feeColumns = (v) => {
|
|
|
|
|
|
|
|
return [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
title: v == 1 ? '应收' : '应付',
|
|
|
|
|
|
|
|
align: 'center',
|
|
|
|
|
|
|
|
width: 200,
|
|
|
|
|
|
|
|
children: [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'RMB',
|
|
|
|
|
|
|
|
title: 'RMB',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
minWidth: 80
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'USD',
|
|
|
|
|
|
|
|
title: 'USD',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
minWidth: 80
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'other',
|
|
|
|
|
|
|
|
title: '其他币别',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
minWidth: 80
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'customerFullName',
|
|
|
|
|
|
|
|
title: '客户名称',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
minWidth: 80
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'feeStatusText',
|
|
|
|
|
|
|
|
title: '状态',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
width: 85
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'unitPrice',
|
|
|
|
|
|
|
|
title: '单价',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
width: 100
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'quantity',
|
|
|
|
|
|
|
|
title: '数量',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
width: 50
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
dataIndex: 'exchangeRate',
|
|
|
|
|
|
|
|
title: '汇率',
|
|
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
|
|
width: 50
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 应收费用数据
|
|
|
|
|
|
|
|
const RData = ref([])
|
|
|
|
|
|
|
|
// 应付费用数据
|
|
|
|
|
|
|
|
const PData = ref([])
|
|
|
|
|
|
|
|
const [registerTable1] = useTable({
|
|
|
|
|
|
|
|
dataSource: RData,
|
|
|
|
|
|
|
|
columns: feeColumns(1),
|
|
|
|
|
|
|
|
isTreeTable: false,
|
|
|
|
|
|
|
|
pagination: false,
|
|
|
|
|
|
|
|
showIndexColumn: false,
|
|
|
|
|
|
|
|
bordered: true,
|
|
|
|
|
|
|
|
rowSelection: { type: 'checkbox' },
|
|
|
|
|
|
|
|
canResize: false,
|
|
|
|
|
|
|
|
showSummary: true,
|
|
|
|
|
|
|
|
summaryFunc(param) {
|
|
|
|
|
|
|
|
const sums = {}
|
|
|
|
|
|
|
|
// 遍历所有列,找出需要合计的列
|
|
|
|
|
|
|
|
const columns = feeColumns(1)
|
|
|
|
|
|
|
|
columns[0].children.forEach(column => {
|
|
|
|
|
|
|
|
if (['RMB', 'USD', 'other'].includes(column.dataIndex)) {
|
|
|
|
|
|
|
|
console.log(column)
|
|
|
|
|
|
|
|
// 初始化合计值为0
|
|
|
|
|
|
|
|
sums[column.dataIndex] = 0
|
|
|
|
|
|
|
|
// 遍历所有行数据,累加对应字段的值
|
|
|
|
|
|
|
|
param.forEach(row => {
|
|
|
|
|
|
|
|
if (!isNaN(row[column.dataIndex])) {
|
|
|
|
|
|
|
|
sums[column.dataIndex] += Number(row[column.dataIndex])
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
// 返回合计数据对象
|
|
|
|
|
|
|
|
return [sums]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
const [registerTable2] = useTable({
|
|
|
|
|
|
|
|
dataSource: PData,
|
|
|
|
|
|
|
|
columns: feeColumns(2),
|
|
|
|
|
|
|
|
isTreeTable: false,
|
|
|
|
|
|
|
|
pagination: false,
|
|
|
|
|
|
|
|
showIndexColumn: false,
|
|
|
|
|
|
|
|
bordered: true,
|
|
|
|
|
|
|
|
rowSelection: { type: 'checkbox' },
|
|
|
|
|
|
|
|
canResize: false,
|
|
|
|
|
|
|
|
showSummary: true,
|
|
|
|
|
|
|
|
summaryFunc(param) {
|
|
|
|
|
|
|
|
const sums = {}
|
|
|
|
|
|
|
|
// 遍历所有列,找出需要合计的列
|
|
|
|
|
|
|
|
const columns = feeColumns(2)
|
|
|
|
|
|
|
|
columns[0].children.forEach(column => {
|
|
|
|
|
|
|
|
if (['RMB', 'USD', 'other'].includes(column.dataIndex)) {
|
|
|
|
|
|
|
|
console.log(column)
|
|
|
|
|
|
|
|
// 初始化合计值为0
|
|
|
|
|
|
|
|
sums[column.dataIndex] = 0
|
|
|
|
|
|
|
|
// 遍历所有行数据,累加对应字段的值
|
|
|
|
|
|
|
|
param.forEach(row => {
|
|
|
|
|
|
|
|
if (!isNaN(row[column.dataIndex])) {
|
|
|
|
|
|
|
|
sums[column.dataIndex] += Number(row[column.dataIndex])
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
// 返回合计数据对象
|
|
|
|
|
|
|
|
return [sums]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
const receiveTable = ref(null)
|
|
|
|
|
|
|
|
const payTable = ref(null)
|
|
|
|
|
|
|
|
const mainApprove = () => {
|
|
|
|
|
|
|
|
loading.value = !loading.value
|
|
|
|
|
|
|
|
if (!loading.value) {
|
|
|
|
|
|
|
|
receiveTable.value.reload()
|
|
|
|
|
|
|
|
payTable.value.reload()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 业务费用利润
|
|
|
|
|
|
|
|
const profit = ref(0)
|
|
|
|
|
|
|
|
// 校验费用利润
|
|
|
|
|
|
|
|
const checkProfit = () => {
|
|
|
|
|
|
|
|
const receiveData = receiveTable.value.getDataSource()
|
|
|
|
|
|
|
|
const payData = payTable.value.getDataSource()
|
|
|
|
|
|
|
|
let rAmount = 0
|
|
|
|
|
|
|
|
receiveData.forEach(item => {
|
|
|
|
|
|
|
|
rAmount = rAmount + Number(item.amount )
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
let pAmount = 0
|
|
|
|
|
|
|
|
payData.forEach(item => {
|
|
|
|
|
|
|
|
pAmount = pAmount + Number(item.amount )
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
profit.value = rAmount - pAmount
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 表单字段
|
|
|
|
|
|
|
|
const list = ref([
|
|
|
|
|
|
|
|
{ label: 'M B/L NO', field: 'mblno', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: '业务类别', field: 'businessTypeText', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: '委托单位', field: 'cntrTotal', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: '业务编号', field: 'customerNo', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: 'VSL/VOY', field: 'vessel', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: 'CARRIER', field: 'carrier', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: '会计期间', field: 'accountDate', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: 'ETD/ETA', field: 'etd', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: '放单方式', field: 'voyno', span: 5, value: '' },
|
|
|
|
|
|
|
|
{ label: 'POL/POD', field: 'loadPort', span: 5, value: '' }
|
|
|
|
|
|
|
|
])
|
|
|
|
|
|
|
|
// 记录费用表格表格box的高度
|
|
|
|
|
|
|
|
// const feeHeight = ref(465)
|
|
|
|
|
|
|
|
// const oldFeeHeight = ref(465)
|
|
|
|
|
|
|
|
// // 记录数据按下时候的Y轴坐标
|
|
|
|
|
|
|
|
// const clientY = ref()
|
|
|
|
|
|
|
|
// const handleMouseDown = (event) => {
|
|
|
|
|
|
|
|
// // 禁止用户选择网页中文字
|
|
|
|
|
|
|
|
// document.onselectstart = () => false
|
|
|
|
|
|
|
|
// // 禁止用户拖动元素
|
|
|
|
|
|
|
|
// document.ondragstart = () => false
|
|
|
|
|
|
|
|
// // 保存鼠标最后移动的位置(Y轴)
|
|
|
|
|
|
|
|
// clientY.value = event.clientY
|
|
|
|
|
|
|
|
// // 绑定鼠标移动事件
|
|
|
|
|
|
|
|
// document.addEventListener('mousemove', handleMouseMove)
|
|
|
|
|
|
|
|
// // 绑定鼠标放开事件
|
|
|
|
|
|
|
|
// document.addEventListener('mouseup', handleMouseUp)
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// // 富文本鼠标按钮移动事件
|
|
|
|
|
|
|
|
// const handleMouseMove = (event) => {
|
|
|
|
|
|
|
|
// feeHeight.value = clientY.value - event.clientY + Number(oldFeeHeight.value)
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
// const handleMouseUp = (event) => {
|
|
|
|
|
|
|
|
// oldFeeHeight.value = feeHeight.value
|
|
|
|
|
|
|
|
// // 移除鼠标移动事件
|
|
|
|
|
|
|
|
// document.removeEventListener('mousemove', handleMouseMove)
|
|
|
|
|
|
|
|
// // 移除鼠标放开事件
|
|
|
|
|
|
|
|
// document.removeEventListener('mouseup', handleMouseUp)
|
|
|
|
|
|
|
|
// // 允许用户选择网页中文字
|
|
|
|
|
|
|
|
// document.onselectstart = null
|
|
|
|
|
|
|
|
// // 允许用户拖动元素
|
|
|
|
|
|
|
|
// document.ondragstart = null
|
|
|
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
|
|
|
//初始化
|
|
|
|
|
|
|
|
reload()
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
defineExpose({
|
|
|
|
|
|
|
|
getDataSource
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="less">
|
|
|
|
|
|
|
|
.ds-approve-fee-sf {
|
|
|
|
|
|
|
|
.vben-basic-table-header__toolbar {
|
|
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.content {
|
|
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.columns-name {
|
|
|
|
|
|
|
|
width: 110px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.fee-tables {
|
|
|
|
|
|
|
|
height: calc(50vh - 136px);
|
|
|
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.receive-table, .pay-table {
|
|
|
|
|
|
|
|
flex: 1;
|
|
|
|
|
|
|
|
th::before {
|
|
|
|
|
|
|
|
height: 0!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-table-footer {
|
|
|
|
|
|
|
|
.ant-table-measure-row {
|
|
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-table-row-level-0 {
|
|
|
|
|
|
|
|
height: 26px!important;
|
|
|
|
|
|
|
|
padding-left: 50px;
|
|
|
|
|
|
|
|
td {
|
|
|
|
|
|
|
|
padding: 5px 6px!important;
|
|
|
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
|
|
font-weight: 600!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.receive-table {
|
|
|
|
|
|
|
|
.ant-table-footer {
|
|
|
|
|
|
|
|
td {
|
|
|
|
|
|
|
|
color: #17A6A3!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.pay-table {
|
|
|
|
|
|
|
|
.ant-table-footer {
|
|
|
|
|
|
|
|
td {
|
|
|
|
|
|
|
|
color: #BA3849!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.receive-table {
|
|
|
|
|
|
|
|
th {
|
|
|
|
|
|
|
|
background: #F2FAFA!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.pay-table {
|
|
|
|
|
|
|
|
th {
|
|
|
|
|
|
|
|
background: #FCF5F5!important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
ul {
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
.fee-name, .fee-data {
|
|
|
|
|
|
|
|
background: #FFFDF5;
|
|
|
|
|
|
|
|
padding-left: 10px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.fee-name {
|
|
|
|
|
|
|
|
height: 51px;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
align-items: flex-end;
|
|
|
|
|
|
|
|
padding-bottom: 5px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.fee-data {
|
|
|
|
|
|
|
|
height: 26px;
|
|
|
|
|
|
|
|
border-top: 1px solid #e5e7eb;
|
|
|
|
|
|
|
|
line-height: 26px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-form-item-label {
|
|
|
|
|
|
|
|
label {
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
height: 24px;
|
|
|
|
|
|
|
|
color: #7A8798;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-form-item-control-input {
|
|
|
|
|
|
|
|
min-height: 24px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-form-item-control-input-content {
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ant-form-item {
|
|
|
|
|
|
|
|
margin-bottom: 4px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.ds-green-tag, .ds-blue-tag, .ds-orange-tag, .ds-red-tag, .ds-purple-tag {
|
|
|
|
|
|
|
|
padding: 2px 13px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.fee-table {
|
|
|
|
|
|
|
|
.ant-table-body {
|
|
|
|
|
|
|
|
min-height: calc(50vh - 210px);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|