Files
mosr-web/src/views/expense-management/expend-detail/index.vue

233 lines
5.0 KiB
Vue

<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" ></fvSearchForm>
<fvTable ref="tableIns" :tableConfig="tableConfig" >
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import {toThousands} from '@/utils/changePrice.js'
import { getSubCompOpt } from '@/api/user/user.js';
const router = useRouter()
const route = useRoute()
const searchConfig = ref(
[
{
label: '主项目',
prop: 'masterProjectName',
component: 'el-input',
props: {
placeholder: '请输入主项目查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '子项目',
prop: 'subProjectName',
component: 'el-input',
props: {
placeholder: '请输入子项目查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '项目类型',
prop: 'projectType',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目类型',
cacheKey: 'project_type',
clearable: true,
filterable: true,
remote: true
},
colProps: {}
},
// {
// label: '归档时间',
// prop: 'filingTime',
// component: 'el-date-picker',
// props: {
// placeholder: '请选择归档时间',
// clearable: true,
// type:'date',
// format: 'YYYY-MM-DD HH:mm',
// valueFormat:'YYYY-MM-DD HH:mm',
// },
// colProps: {}
// },
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
// {
// prop: 'name',
// type: 'index',
// label: '序号',
// align: 'center',
// width:85,
// index: index => {
// return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
// }
// },
{
prop: 'paymentYear',
label: '支付年份',
align: 'center'
},
{
prop: 'paymentMonth',
label: '支付月份',
align: 'center'
},
{
prop: 'masterProjectName',
label: '主项目',
align: 'center',
width: 120,
},
{
prop: 'subProjectName',
label: '子项目',
align: 'center',
width: 120,
},
{
prop: 'projectType',
label: '项目类型',
align: 'center',
width: 120,
showOverflowTooltip: false,
// currentRender: ({row, index}) => {
// if (row.projectType&&row.projectType !== null&&row.projectType!==undefined) {
// return (<Tag dictType={'project_type'} value={row.projectType}/>)
// } else {
// return '--'
// }
// }
},
{
prop: 'rdType',
label: 'R&D统计类型',
align: 'center',
width: 200
},
{
prop: 'rdSub',
label: 'R&D统计子项',
align: 'center',
width: 150
},
{
prop: 'paymentProcessType',
label: '付款流程类型',
align: 'center',
width: 150
},
{
prop: 'processState',
label: '流程状态',
align: 'center',
},
{
prop: 'filingTime',
label: '归档时间',
align: 'center',
width: 180
},
{
prop: 'paymentProcessNum',
label: '付款流程编号',
align: 'center',
width: 150
},
{
prop: 'paymentAmount',
label: '付款金额',
align: 'center',
},
{
prop: 'paymentSubject',
label: '付款/请款事由',
align: 'center',
width: 130
},
{
prop: 'contractNum',
label: '合同编号',
align: 'center',
},
{
prop: 'contractName',
label: '合同名称',
align: 'center',
},
{
prop: 'contractSumAmount',
label: '合同总额(元)',
align: 'center',
width: 130
},
{
prop: 'recipientName',
label: '收款方名称',
align: 'center',
width: 130
},
{
prop: 'remarks',
label: '备注说明',
align: 'center',
},
],
api: '/workflow/mosr/payment/list',
params: {},
export:{
open :true,
fileName:`科研项日现金支出明细表`
}
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const init = async () => {
const res = await getSubCompOpt()
searchConfig.value.find(item=>item.prop == 'affiliatedCompanyIds').props.data = res.data
}
// init()
</script>
<style scoped lang="scss">
:deep(.el-table__header) {
.is-leaf:first-child {
.cell {
margin-left: -25px !important;
}
}
}
:deep(.el-table__body) {
.el-table__cell:first-child {
.cell {
margin-left: -13px !important;
}
}
}
:deep(.el-date-editor--month){
width: 100%;
}
</style>