odjbin/mosr-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix : 修复实施图片

Browse Source
This commit is contained in:
dengjie
2025-07-09 22:56:09 +08:00
parent 64e2ff0647
commit 973dc0f2e4
338 changed files with 62195 additions and 62193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

550
src/views/expense-management/cost-detail/index.vue
View File

@@ -1,275 +1,275 @@
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 15px"></fvSearchForm>
<div style="float: left">
<import-cost-excel @success="importTheExpenseLedger"/>
</div>
<fvTable ref="tableIns" class="tablte" :tableConfig="tableConfig" @headBtnClick="headBtnClick" :changeExportPosition="true">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import {reactive, ref} from "vue";
import {useRoute, useRouter} from "vue-router";
import {costTemplateDownload, exportExcel, ledgerTemplateDownload} from "../../../api/project-manage";
import ImportCostExcel from "@/components/ImportCostExcel.vue";
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: 'recordedAmount',
component: 'el-input',
props: {
placeholder: '请输入会计凭证记载金额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '归集研发费用金额(元)',
prop: 'rdAmount',
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: 'rdYear',
label: '年',
align: 'center',
width: 80
},
{
prop: 'rdMonth',
label: '月',
align: 'center',
width: 80
},
{
prop: 'rdDay',
label: '日',
align: 'center',
width: 80
},
{
prop: 'masterProjectName',
label: '主项目',
align: 'center',
width: 120,
},
{
prop: 'subProjectName',
label: '子项目',
align: 'center',
width: 120,
},
{
prop: 'certificateDate',
label: '凭证日期',
align: 'center',
width: 120,
},
{
prop: 'voucherNumber',
label: '凭证号',
align: 'center'
},
{
prop: 'entryNumber',
label: '分录号',
align: 'center',
},
{
prop: 'digest',
label: '摘要',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'accountCode',
label: '科目编码',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'accountName',
label: '科目名称',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'auxiliaryItem',
label: '辅助项',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'recordedAmount',
label: '会计凭证记载金额(元)',
align: 'center',
width: 170
},
{
prop: 'rdAmount',
label: '归集研发费用金额(元)',
align: 'center',
width: 170
},
],
api: '/workflow/mosr/rd/expense/list',
params: {},
btns: [
{name: '模板下载', key: 'down', color: '#DED0B2'},
// {name: '导入', key: 'import', color: '#DED0B2'}
],
export:{
open :true,
fileName:`研发费用明细表`
}
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const headBtnClick = (key) => {
switch (key) {
case 'down':
handleImportTemplateDownload()
break;
case 'import':
handleAdd()
break;
}
}
const exportTable = () => {
const $e = tableIns.value.$el
let $table = $e.querySelector('.el-table__fixed')
if (!$table) {
$table = $e
}
exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表", 2)
}
//导入模板下载
const handleImportTemplateDownload=()=>{
costTemplateDownload().then(res => {
let link = document.createElement('a')
try {
let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});
let _fileName = "研发费用明细表模板.xlsx"//文件名，中文无法解析的时候会显示 _(下划线),生产环境获取不到
link.style.display='none';
// 兼容不同浏览器的URL对象
const url = window.URL || window.webkitURL || window.moxURL;
link.href=url.createObjectURL(blob);
link.setAttribute('download', _fileName.substring(_fileName.lastIndexOf('_')+1))
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
url.revokeObjectURL(link.href);//销毁url对象
}catch (e) {
console.log('下载的文件出错',e)
}
})
}
const importTheExpenseLedger = () => {
tableIns.value.refresh()
}
</script>
<style scoped lang="scss">
:deep(.el-form-item__label-wrap){
margin-left: 0!important;
}
: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>
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 15px"></fvSearchForm>
<div style="float: left">
<import-cost-excel @success="importTheExpenseLedger"/>
</div>
<fvTable ref="tableIns" class="tablte" :tableConfig="tableConfig" @headBtnClick="headBtnClick" :changeExportPosition="true">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import {reactive, ref} from "vue";
import {useRoute, useRouter} from "vue-router";
import {costTemplateDownload, exportExcel, ledgerTemplateDownload} from "../../../api/project-manage";
import ImportCostExcel from "@/components/ImportCostExcel.vue";
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: 'recordedAmount',
component: 'el-input',
props: {
placeholder: '请输入会计凭证记载金额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '归集研发费用金额(元)',
prop: 'rdAmount',
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: 'rdYear',
label: '年',
align: 'center',
width: 80
},
{
prop: 'rdMonth',
label: '月',
align: 'center',
width: 80
},
{
prop: 'rdDay',
label: '日',
align: 'center',
width: 80
},
{
prop: 'masterProjectName',
label: '主项目',
align: 'center',
width: 120,
},
{
prop: 'subProjectName',
label: '子项目',
align: 'center',
width: 120,
},
{
prop: 'certificateDate',
label: '凭证日期',
align: 'center',
width: 120,
},
{
prop: 'voucherNumber',
label: '凭证号',
align: 'center'
},
{
prop: 'entryNumber',
label: '分录号',
align: 'center',
},
{
prop: 'digest',
label: '摘要',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'accountCode',
label: '科目编码',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'accountName',
label: '科目名称',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'auxiliaryItem',
label: '辅助项',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'recordedAmount',
label: '会计凭证记载金额(元)',
align: 'center',
width: 170
},
{
prop: 'rdAmount',
label: '归集研发费用金额(元)',
align: 'center',
width: 170
},
],
api: '/workflow/mosr/rd/expense/list',
params: {},
btns: [
{name: '模板下载', key: 'down', color: '#DED0B2'},
// {name: '导入', key: 'import', color: '#DED0B2'}
],
export:{
open :true,
fileName:`研发费用明细表`
}
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const headBtnClick = (key) => {
switch (key) {
case 'down':
handleImportTemplateDownload()
break;
case 'import':
handleAdd()
break;
}
}
const exportTable = () => {
const $e = tableIns.value.$el
let $table = $e.querySelector('.el-table__fixed')
if (!$table) {
$table = $e
}
exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表", 2)
}
//导入模板下载
const handleImportTemplateDownload=()=>{
costTemplateDownload().then(res => {
let link = document.createElement('a')
try {
let blob = new Blob([res.data],{type: 'application/vnd.ms-excel'});
let _fileName = "研发费用明细表模板.xlsx"//文件名，中文无法解析的时候会显示 _(下划线),生产环境获取不到
link.style.display='none';
// 兼容不同浏览器的URL对象
const url = window.URL || window.webkitURL || window.moxURL;
link.href=url.createObjectURL(blob);
link.setAttribute('download', _fileName.substring(_fileName.lastIndexOf('_')+1))
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
url.revokeObjectURL(link.href);//销毁url对象
}catch (e) {
console.log('下载的文件出错',e)
}
})
}
const importTheExpenseLedger = () => {
tableIns.value.refresh()
}
</script>
<style scoped lang="scss">
:deep(.el-form-item__label-wrap){
margin-left: 0!important;
}
: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>

464
src/views/expense-management/expend-detail/index.vue
View File

@@ -1,232 +1,232 @@
<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>
<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>

454
src/views/expense-management/ledger/index.vue
View File

@@ -1,227 +1,227 @@
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></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: 'affiliatedCompanyIds',
component: 'el-tree-select',
props: {
placeholder: '请输入公司名称查询',
clearable: true,
data: [],
filterable: true,
checkStrictly: true,
remote: true
}
},
{
label: '项目名称',
prop: 'projectName',
component: 'el-input',
props: {
placeholder: '请输入项目名称查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '项目费用',
prop: 'projectCost',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目费用查询',
clearable: true,
filterable: true,
cacheKey: 'project_cost',
remote: true
}
},
{
label: '研发阶段',
prop: 'researchStage',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择研发阶段查询',
clearable: true,
filterable: true,
checkStrictly: true,
cacheKey: 'fee_stage',
remote: true
}
},
{
label: '时间',
prop: 'time',
component: 'el-date-picker',
props: {
placeholder: '请选择时间',
clearable: true,
type:'month',
format: 'YYYY-MM',
valueFormat:'YYYY-MM',
},
colProps: {}
},
{
label: '税后余额',
prop: 'afterTax',
component: 'el-input',
props: {
placeholder: '请输入税后余额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '摘要',
prop: 'digest',
component: 'el-input',
props: {
placeholder: '请输入摘要查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
])
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: 'affiliatedCompany',
label: '公司名称',
align: 'center'
},
{
prop: 'projectName',
label: '项目名称',
align: 'center'
},
{
prop: 'projectCost',
label: '项目费用',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.projectCost !== null&&row.projectCost !== null&&row.projectCost!==undefined) {
return (<Tag dictType={'project_cost'} value={row.projectCost}/>)
} else {
return '--'
}
}
},
{
prop: 'researchStage',
label: '研发阶段',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.researchStage&&row.researchStage !== null&&row.researchStage!==undefined) {
return (<Tag dictType={'research_stage'} value={row.researchStage}/>)
} else {
return '--'
}
}
},
{
prop: 'time',
label: '时间',
align: 'center',
width: 120,
},
{
label: '摘要',
prop: 'digest',
align: 'center'
},
{
prop: 'afterTax',
label: '税后余额(元)',
align: 'center',
currentRender:({row})=>{
return <span>{toThousands(row.afterTax)}</span>
}
},
{
prop: 'source',
label: '来源',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.source&&row.source !== null&&row.source!==undefined) {
return (<Tag dictType={'ledger_source'} value={row.source}/>)
} else {
return '--'
}
}
},
],
api: '/workflow/mosr/expense/ledger',
params: {},
export:{
open :true,
fileName:`科技创新项目费用台账.xlsx`
}
})
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>
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></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: 'affiliatedCompanyIds',
component: 'el-tree-select',
props: {
placeholder: '请输入公司名称查询',
clearable: true,
data: [],
filterable: true,
checkStrictly: true,
remote: true
}
},
{
label: '项目名称',
prop: 'projectName',
component: 'el-input',
props: {
placeholder: '请输入项目名称查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '项目费用',
prop: 'projectCost',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目费用查询',
clearable: true,
filterable: true,
cacheKey: 'project_cost',
remote: true
}
},
{
label: '研发阶段',
prop: 'researchStage',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择研发阶段查询',
clearable: true,
filterable: true,
checkStrictly: true,
cacheKey: 'fee_stage',
remote: true
}
},
{
label: '时间',
prop: 'time',
component: 'el-date-picker',
props: {
placeholder: '请选择时间',
clearable: true,
type:'month',
format: 'YYYY-MM',
valueFormat:'YYYY-MM',
},
colProps: {}
},
{
label: '税后余额',
prop: 'afterTax',
component: 'el-input',
props: {
placeholder: '请输入税后余额查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '摘要',
prop: 'digest',
component: 'el-input',
props: {
placeholder: '请输入摘要查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
])
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: 'affiliatedCompany',
label: '公司名称',
align: 'center'
},
{
prop: 'projectName',
label: '项目名称',
align: 'center'
},
{
prop: 'projectCost',
label: '项目费用',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.projectCost !== null&&row.projectCost !== null&&row.projectCost!==undefined) {
return (<Tag dictType={'project_cost'} value={row.projectCost}/>)
} else {
return '--'
}
}
},
{
prop: 'researchStage',
label: '研发阶段',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.researchStage&&row.researchStage !== null&&row.researchStage!==undefined) {
return (<Tag dictType={'research_stage'} value={row.researchStage}/>)
} else {
return '--'
}
}
},
{
prop: 'time',
label: '时间',
align: 'center',
width: 120,
},
{
label: '摘要',
prop: 'digest',
align: 'center'
},
{
prop: 'afterTax',
label: '税后余额(元)',
align: 'center',
currentRender:({row})=>{
return <span>{toThousands(row.afterTax)}</span>
}
},
{
prop: 'source',
label: '来源',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.source&&row.source !== null&&row.source!==undefined) {
return (<Tag dictType={'ledger_source'} value={row.source}/>)
} else {
return '--'
}
}
},
],
api: '/workflow/mosr/expense/ledger',
params: {},
export:{
open :true,
fileName:`科技创新项目费用台账.xlsx`
}
})
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>

666
src/views/expense-management/project-ledger/index.vue
View File

@@ -1,333 +1,333 @@
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></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 route = useRoute()
const router = useRouter()
const shortcuts = [
{
text: '上周',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
return [start, end]
},
},
{
text: '上月',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
return [start, end]
},
},
{
text: '三月前',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
return [start, end]
},
},
]
const searchConfig = ref([
{
label: '征集公司',
prop: 'affiliatedCompanyId',
component: 'el-tree-select',
props: {
placeholder: '请输入征集公司查询',
clearable: true,
data: [],
filterable: true,
checkStrictly: true,
remote: true
}
},
{
label: '项目名称',
prop: 'projectName',
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
}
},
{
label: '项目影响',
prop: 'projectImpact',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目影响',
cacheKey: 'project_impact',
clearable: true,
filterable: true,
remote: true
},
colProps: {}
},
{
label: '研发主体',
prop: 'rdSubject',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择研发主体',
cacheKey: 'rd_subject',
clearable: true,
filterable: true,
remote: true
}
},
{
label: '起止时间',
prop: 'dateValue',
component: 'el-date-picker',
props: {
clearable: true,
type: 'daterange',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
shortcuts: shortcuts
}
}
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
// {
// type: 'selection',
// prop: 'selection'
// },
{
prop: 'index',
type: 'index',
label: '序号',
align: 'center',
width:85,
index: index => {
return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
}
},
{
prop: 'affiliatedCompany',
label: '征集公司',
align: 'center'
},
{
prop: 'projectName',
label: '项目名称',
align: 'center'
},
{
prop: 'projectType',
label: '项目类型',
align: 'center',
width: 100,
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: 'rdSubject',
label: '研发主体',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.rdSubject && row.rdSubject !== null && row.rdSubject !== undefined) {
return (<Tag dictType={'rd_subject'} value={row.rdSubject}/>)
} else {
return '--'
}
}
},
{
prop: 'researchStage',
label: '研发阶段',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.researchStage && row.researchStage !== null && row.researchStage !== undefined) {
return (<Tag dictType={'research_stage'} value={row.researchStage}/>)
} else {
return '--'
}
}
},
{
prop: 'projectImpact',
label: '项目影响',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.projectImpact && row.projectImpact !== null && row.projectImpact !== undefined) {
return (<Tag dictType={'project_impact'} value={row.projectImpact}/>)
} else {
return '--'
}
}
},
{
prop: 'economicEstimate',
label: '预估经费预算(元)',
align: 'center',
width: 150,
currentRender:({row})=>{
return <span>{toThousands(row.economicEstimate)}</span>
}
},
{
prop: 'startTime',
label: '起止时间',
align: 'center',
currentRender: ({row}) => {
return row.startTime + ' 至 ' + row.endTime
}
},
{
prop: 'approveName',
label: '当前审批节点',
align: 'center',
width: 120,
currentRender: ({row, index}) => {
if(row.state=='3'||row.state=='4'){
return <span>{row.taskNode}</span>
}else if(row.state=='1'){
return <span>{row.approveName}</span>
}else {
return <span>--</span>
}
}
},
{
prop: 'state',
label: '状态',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.state && row.state !== null && row.state !== undefined) {
return (<Tag dictType={'project_implementation'} value={row.state}/>)
} else {
return '--'
}
}
},
{
prop: 'oper',
label: '操作',
align: 'center',
fixed:'right',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
let btn = []
let buttons = new Set(Array.from(row.buttons))
if (buttons.has("standing")) {
btn.push({label: '台账', prem: ['project:management:implementation:account'], func: () => handleStandingBook(row), type: 'primary'})
}
return (
<div style={{width: '100%'}}>
{
btn.map(item => (
<el-button
type={item.type}
v-perm={item.prem}
onClick={() => item.func()}
link
>
{item.label}
</el-button>
))
}
</div>
)
}
}
],
api: '/workflow/mosr/project/implementation',
params: {
state:0
},
btns: [
// {name: '生成分摊报表', key: '_export', color: '#DED0B2', auth: ''}
]
})
const search = (val) => {
let obj = {...val}
if(obj.dateValue) {
obj.startTime = obj.dateValue[0]
obj.endTime = obj.dateValue[1]
delete obj.dateValue
}
tableConfig.params = obj
tableIns.value.refresh()
}
const handleStandingBook = (row) => {
router.push({
name: 'Implementation/account',
query: {
id: row.projectId
}
})
}
const init = async () => {
const res = await getSubCompOpt()
searchConfig.value.find(item=>item.prop == 'affiliatedCompanyId').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;
}
}
}
</style>
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></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 route = useRoute()
const router = useRouter()
const shortcuts = [
{
text: '上周',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
return [start, end]
},
},
{
text: '上月',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
return [start, end]
},
},
{
text: '三月前',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
return [start, end]
},
},
]
const searchConfig = ref([
{
label: '征集公司',
prop: 'affiliatedCompanyId',
component: 'el-tree-select',
props: {
placeholder: '请输入征集公司查询',
clearable: true,
data: [],
filterable: true,
checkStrictly: true,
remote: true
}
},
{
label: '项目名称',
prop: 'projectName',
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
}
},
{
label: '项目影响',
prop: 'projectImpact',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择项目影响',
cacheKey: 'project_impact',
clearable: true,
filterable: true,
remote: true
},
colProps: {}
},
{
label: '研发主体',
prop: 'rdSubject',
component: shallowRef(fvSelect),
props: {
placeholder: '请选择研发主体',
cacheKey: 'rd_subject',
clearable: true,
filterable: true,
remote: true
}
},
{
label: '起止时间',
prop: 'dateValue',
component: 'el-date-picker',
props: {
clearable: true,
type: 'daterange',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
shortcuts: shortcuts
}
}
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
// {
// type: 'selection',
// prop: 'selection'
// },
{
prop: 'index',
type: 'index',
label: '序号',
align: 'center',
width:85,
index: index => {
return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
}
},
{
prop: 'affiliatedCompany',
label: '征集公司',
align: 'center'
},
{
prop: 'projectName',
label: '项目名称',
align: 'center'
},
{
prop: 'projectType',
label: '项目类型',
align: 'center',
width: 100,
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: 'rdSubject',
label: '研发主体',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.rdSubject && row.rdSubject !== null && row.rdSubject !== undefined) {
return (<Tag dictType={'rd_subject'} value={row.rdSubject}/>)
} else {
return '--'
}
}
},
{
prop: 'researchStage',
label: '研发阶段',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.researchStage && row.researchStage !== null && row.researchStage !== undefined) {
return (<Tag dictType={'research_stage'} value={row.researchStage}/>)
} else {
return '--'
}
}
},
{
prop: 'projectImpact',
label: '项目影响',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.projectImpact && row.projectImpact !== null && row.projectImpact !== undefined) {
return (<Tag dictType={'project_impact'} value={row.projectImpact}/>)
} else {
return '--'
}
}
},
{
prop: 'economicEstimate',
label: '预估经费预算(元)',
align: 'center',
width: 150,
currentRender:({row})=>{
return <span>{toThousands(row.economicEstimate)}</span>
}
},
{
prop: 'startTime',
label: '起止时间',
align: 'center',
currentRender: ({row}) => {
return row.startTime + ' 至 ' + row.endTime
}
},
{
prop: 'approveName',
label: '当前审批节点',
align: 'center',
width: 120,
currentRender: ({row, index}) => {
if(row.state=='3'||row.state=='4'){
return <span>{row.taskNode}</span>
}else if(row.state=='1'){
return <span>{row.approveName}</span>
}else {
return <span>--</span>
}
}
},
{
prop: 'state',
label: '状态',
align: 'center',
width: 100,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.state && row.state !== null && row.state !== undefined) {
return (<Tag dictType={'project_implementation'} value={row.state}/>)
} else {
return '--'
}
}
},
{
prop: 'oper',
label: '操作',
align: 'center',
fixed:'right',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
let btn = []
let buttons = new Set(Array.from(row.buttons))
if (buttons.has("standing")) {
btn.push({label: '台账', prem: ['project:management:implementation:account'], func: () => handleStandingBook(row), type: 'primary'})
}
return (
<div style={{width: '100%'}}>
{
btn.map(item => (
<el-button
type={item.type}
v-perm={item.prem}
onClick={() => item.func()}
link
>
{item.label}
</el-button>
))
}
</div>
)
}
}
],
api: '/workflow/mosr/project/implementation',
params: {
state:0
},
btns: [
// {name: '生成分摊报表', key: '_export', color: '#DED0B2', auth: ''}
]
})
const search = (val) => {
let obj = {...val}
if(obj.dateValue) {
obj.startTime = obj.dateValue[0]
obj.endTime = obj.dateValue[1]
delete obj.dateValue
}
tableConfig.params = obj
tableIns.value.refresh()
}
const handleStandingBook = (row) => {
router.push({
name: 'Implementation/account',
query: {
id: row.projectId
}
})
}
const init = async () => {
const res = await getSubCompOpt()
searchConfig.value.find(item=>item.prop == 'affiliatedCompanyId').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;
}
}
}
</style>

1182
src/views/expense-management/share-detail/add.vue
View File

File diff suppressed because it is too large Load Diff

438
src/views/expense-management/share-detail/index.vue
View File

@@ -1,219 +1,219 @@
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></fvSearchForm>
<!-- <el-button color="#DED0B2" style="float: left;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>-->
<fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick" style="margin-top: 15px" @selectionChange="selectionChange">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import { getSubCompOpt } from '@/api/user/user.js';
import {reactive, ref} from "vue";
import {shareDetailExport, shareExportExcel} from "@/api/expense-manage";
import {ElMessage} from "element-plus";
const router = useRouter()
const route = useRoute()
const searchConfig = reactive([
{
label: '子项目',
prop: 'subProjectName',
component: 'el-input',
props: {
placeholder: '请输入子项目查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
// {
// label: '支付月份',
// prop: 'apportionmentMonth',
// component: 'el-date-picker',
// props: {
// placeholder: '请选择支付月份',
// clearable: true,
// type:'month',
// format: 'YYYY-MM',
// valueFormat:"YYYY-MM"
// },
// colProps: {}
// },
// {
// label: '人员性质',
// prop: 'personnelNature',
// component: shallowRef(fvSelect),
// props: {
// placeholder: '请选择人员性质',
// clearable: true,
// filterable: true,
// cacheKey: 'nature_of_personnel'
// }
// },
])
const tableIns = ref()
const selectData = ref([])
const tableConfig = reactive({
columns: [
{
type: 'selection',
prop: 'selection',
},
// {
// 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',
},
{
prop: 'subProjectName',
label: '子项目',
align: 'center',
},
{
prop: 'researchPersonnel',
label: '研发人员',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'personnelNature',
label: '人员性质',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.personnelNature&&row.personnelNature !== null&&row.personnelNature!==undefined) {
return (<Tag dictType={'nature_of_personnel'} value={row.personnelNature}/>)
} else {
return '--'
}
}
},
{
prop: 'researchDuration',
label: '当月研发工时(天)',
align: 'center',
// currentRender:({row})=>{
// return <span>{toThousands(row.afterTax)}</span>
// }
},
{
prop: 'workday',
label: '当月总工时(天)',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'subtotal',
label: '人工成本分摊(元)',
align: 'center',
},
],
api: '/workflow/mosr/cost/share',
params: {},
btns: [
{name: '添加分摊', key: 'add', color: '#DED0B2'},
{name: '导出', key: 'export', color: '#DED0B2'}
],
export:{
open :false,
}
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const headBtnClick = (key) => {
switch (key) {
case 'add':
handleAdd()
break;
case 'export':
exportTable()
break;
}
}
const selectionChange = (data) => {
console.log('data', data)
selectData.value=data.map(item=>item.id)
}
const exportTable = () => {
console.log('selectData',selectData.value)
if (selectData.value.length === 0) {
ElMessage.warning('请选择要导出的费用分摊')
return
}
shareDetailExport(selectData.value).then(res => {
console.log(res)
let fileName = `科技研发项目工时及成本分摊汇总表.xlsx`
const blob = new Blob([res.data])
let a = document.createElement('a')
a.href = URL.createObjectURL(blob)
a.download = fileName
a.click()
})
}
const handleAdd = () => {
router.push({
name: 'Sharedetail/add',
query: {}
})
}
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>
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></fvSearchForm>
<!-- <el-button color="#DED0B2" style="float: left;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>-->
<fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick" style="margin-top: 15px" @selectionChange="selectionChange">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import { getSubCompOpt } from '@/api/user/user.js';
import {reactive, ref} from "vue";
import {shareDetailExport, shareExportExcel} from "@/api/expense-manage";
import {ElMessage} from "element-plus";
const router = useRouter()
const route = useRoute()
const searchConfig = reactive([
{
label: '子项目',
prop: 'subProjectName',
component: 'el-input',
props: {
placeholder: '请输入子项目查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
// {
// label: '支付月份',
// prop: 'apportionmentMonth',
// component: 'el-date-picker',
// props: {
// placeholder: '请选择支付月份',
// clearable: true,
// type:'month',
// format: 'YYYY-MM',
// valueFormat:"YYYY-MM"
// },
// colProps: {}
// },
// {
// label: '人员性质',
// prop: 'personnelNature',
// component: shallowRef(fvSelect),
// props: {
// placeholder: '请选择人员性质',
// clearable: true,
// filterable: true,
// cacheKey: 'nature_of_personnel'
// }
// },
])
const tableIns = ref()
const selectData = ref([])
const tableConfig = reactive({
columns: [
{
type: 'selection',
prop: 'selection',
},
// {
// 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',
},
{
prop: 'subProjectName',
label: '子项目',
align: 'center',
},
{
prop: 'researchPersonnel',
label: '研发人员',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'personnelNature',
label: '人员性质',
align: 'center',
width: 120,
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.personnelNature&&row.personnelNature !== null&&row.personnelNature!==undefined) {
return (<Tag dictType={'nature_of_personnel'} value={row.personnelNature}/>)
} else {
return '--'
}
}
},
{
prop: 'researchDuration',
label: '当月研发工时(天)',
align: 'center',
// currentRender:({row})=>{
// return <span>{toThousands(row.afterTax)}</span>
// }
},
{
prop: 'workday',
label: '当月总工时(天)',
align: 'center',
showOverflowTooltip: false,
},
{
prop: 'subtotal',
label: '人工成本分摊(元)',
align: 'center',
},
],
api: '/workflow/mosr/cost/share',
params: {},
btns: [
{name: '添加分摊', key: 'add', color: '#DED0B2'},
{name: '导出', key: 'export', color: '#DED0B2'}
],
export:{
open :false,
}
})
const search = (val) => {
tableConfig.params = {...val}
tableIns.value.refresh()
}
const headBtnClick = (key) => {
switch (key) {
case 'add':
handleAdd()
break;
case 'export':
exportTable()
break;
}
}
const selectionChange = (data) => {
console.log('data', data)
selectData.value=data.map(item=>item.id)
}
const exportTable = () => {
console.log('selectData',selectData.value)
if (selectData.value.length === 0) {
ElMessage.warning('请选择要导出的费用分摊')
return
}
shareDetailExport(selectData.value).then(res => {
console.log(res)
let fileName = `科技研发项目工时及成本分摊汇总表.xlsx`
const blob = new Blob([res.data])
let a = document.createElement('a')
a.href = URL.createObjectURL(blob)
a.download = fileName
a.click()
})
}
const handleAdd = () => {
router.push({
name: 'Sharedetail/add',
query: {}
})
}
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>

1216
src/views/expense-management/share/add.vue
View File

File diff suppressed because it is too large Load Diff

274
src/views/expense-management/share/detail.vue
View File

@@ -1,137 +1,137 @@
<template>
<div style="padding: 0 30px">
<el-form :model="formData" ref="form" label-width="auto" style="margin-top: 18px">
<el-row>
<el-col :span="6">
<el-form-item label="分摊名称">
<span>{{ formData.shareName }}</span>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="分摊月份">
<span>{{ formData.apportionmentMonth }}</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="分摊汇总" name="first" v-loading="loading">
<allocation-summary-detail :allocation-name="formData.shareName" />
</el-tab-pane>
<el-tab-pane label="分摊明细" name="second">
<expense-detail/>
</el-tab-pane>
</el-tabs>
<div v-if="shareData.taskId">
<baseTitle title="审核意见"></baseTitle>
<el-form-item prop="auditOpinion">
<el-input
v-model="auditOpinion"
:rows="3"
type="textarea"
placeholder="请输入审核意见"
/>
</el-form-item>
</div>
<div class="approval-record">
<div class="approval-title">
<baseTitle title="审批记录"></baseTitle>
<div class="diagram">
<div class="base-title">流程图</div>
<el-switch
v-model="changeDiagram"
style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
/>
</div>
</div>
<div class="process">
<operation-render
v-if="shareProcessViewer&& shareData.operationList && shareData.operationList.length > 0&&!changeDiagram"
:operation-list="shareData.operationList"
:state="shareData.state"/>
<process-diagram-viewer v-if="shareProcessViewer&&changeDiagram" id-name="shareProcess"/>
</div>
</div>
<opinion v-if="shareData.taskId" :formData="shareData.formData" :taskId="shareData.taskId"
:taskUserOptionList="shareData.taskUserOptionList"
v-model:value="auditOpinion"></opinion>
</div>
</template>
<script setup lang="jsx">
import OperationRender from '@/views/workflow/common/OperationRender.vue'
import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
import {ElNotification} from "element-plus";
import {useProcessStore} from '@/stores/processStore.js';
import {getAllocationDetail} from "@/api/expense-manage";
const changeDiagram = ref(false)
const processStore = useProcessStore()
const route = useRoute()
const shareData = ref({})
const formData = ref({})
const auditOpinion = ref('')
const shareProcessViewer = ref(true)
const loading = ref(false)
const activeName = ref('first')
// const activeName = ref('second')
const getDetail = async () => {
const id = route.query.id
shareProcessViewer.value = false
const {code, data, msg} = await getAllocationDetail(id)
if (code === 1000) {
shareData.value = data
formData.value = data.formData
processStore.setDesign(data)
processStore.runningList.value = data.runningList;
processStore.endList.value = data.endList;
processStore.noTakeList.value = data.noTakeList;
processStore.refuseList.value = data.refuseList;
processStore.passList.value = data.passList;
nextTick(() => {
shareProcessViewer.value = true
})
} else {
ElNotification({
title: '提示',
message: msg,
type: 'error'
})
}
}
const handleClick = (tab) => {
if (tab.index == 0) {
getDetail()
}
}
getDetail()
</script>
<style scoped lang="scss">
:deep(.el-table--fit ) {
width: 100%;
height: 479px !important;
}
:deep(.el-tabs__nav-scroll) {
width: 100%;
display: flex;
.el-tabs__nav {
display: flex;
flex: 1;
.el-tabs__item {
flex: 1;
font-size: 16px;
}
.is-active {
color: black;
//background-color: #DED0B2;
}
}
}
</style>
<template>
<div style="padding: 0 30px">
<el-form :model="formData" ref="form" label-width="auto" style="margin-top: 18px">
<el-row>
<el-col :span="6">
<el-form-item label="分摊名称">
<span>{{ formData.shareName }}</span>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="分摊月份">
<span>{{ formData.apportionmentMonth }}</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="分摊汇总" name="first" v-loading="loading">
<allocation-summary-detail :allocation-name="formData.shareName" />
</el-tab-pane>
<el-tab-pane label="分摊明细" name="second">
<expense-detail/>
</el-tab-pane>
</el-tabs>
<div v-if="shareData.taskId">
<baseTitle title="审核意见"></baseTitle>
<el-form-item prop="auditOpinion">
<el-input
v-model="auditOpinion"
:rows="3"
type="textarea"
placeholder="请输入审核意见"
/>
</el-form-item>
</div>
<div class="approval-record">
<div class="approval-title">
<baseTitle title="审批记录"></baseTitle>
<div class="diagram">
<div class="base-title">流程图</div>
<el-switch
v-model="changeDiagram"
style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
/>
</div>
</div>
<div class="process">
<operation-render
v-if="shareProcessViewer&& shareData.operationList && shareData.operationList.length > 0&&!changeDiagram"
:operation-list="shareData.operationList"
:state="shareData.state"/>
<process-diagram-viewer v-if="shareProcessViewer&&changeDiagram" id-name="shareProcess"/>
</div>
</div>
<opinion v-if="shareData.taskId" :formData="shareData.formData" :taskId="shareData.taskId"
:taskUserOptionList="shareData.taskUserOptionList"
v-model:value="auditOpinion"></opinion>
</div>
</template>
<script setup lang="jsx">
import OperationRender from '@/views/workflow/common/OperationRender.vue'
import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
import {ElNotification} from "element-plus";
import {useProcessStore} from '@/stores/processStore.js';
import {getAllocationDetail} from "@/api/expense-manage";
const changeDiagram = ref(false)
const processStore = useProcessStore()
const route = useRoute()
const shareData = ref({})
const formData = ref({})
const auditOpinion = ref('')
const shareProcessViewer = ref(true)
const loading = ref(false)
const activeName = ref('first')
// const activeName = ref('second')
const getDetail = async () => {
const id = route.query.id
shareProcessViewer.value = false
const {code, data, msg} = await getAllocationDetail(id)
if (code === 1000) {
shareData.value = data
formData.value = data.formData
processStore.setDesign(data)
processStore.runningList.value = data.runningList;
processStore.endList.value = data.endList;
processStore.noTakeList.value = data.noTakeList;
processStore.refuseList.value = data.refuseList;
processStore.passList.value = data.passList;
nextTick(() => {
shareProcessViewer.value = true
})
} else {
ElNotification({
title: '提示',
message: msg,
type: 'error'
})
}
}
const handleClick = (tab) => {
if (tab.index == 0) {
getDetail()
}
}
getDetail()
</script>
<style scoped lang="scss">
:deep(.el-table--fit ) {
width: 100%;
height: 479px !important;
}
:deep(.el-tabs__nav-scroll) {
width: 100%;
display: flex;
.el-tabs__nav {
display: flex;
flex: 1;
.el-tabs__item {
flex: 1;
font-size: 16px;
}
.is-active {
color: black;
//background-color: #DED0B2;
}
}
}
</style>

530
src/views/expense-management/share/index.vue
View File

@@ -1,265 +1,265 @@
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></fvSearchForm>
<fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
// import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import { ElNotification} from "element-plus";
import {deleteAllocation} from "@/api/expense-manage";
const router = useRouter();
const shortcuts = [
{
text: '上周',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
return [start, end]
},
},
{
text: '上月',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
return [start, end]
},
},
{
text: '三月前',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
return [start, end]
},
},
]
const searchConfig = reactive([
{
label: '分摊名称',
prop: 'shareName',
component: 'el-input',
props: {
placeholder: '请输入分摊名称查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '分摊月份',
prop: 'apportionmentMonth',
component: 'el-date-picker',
props: {
placeholder: '请选择分摊月份',
clearable: true,
type:'month',
format: 'YYYY-MM',
valueFormat:"YYYY-MM"
},
colProps: {}
},
{
label: '生成时间',
prop: 'dateValue',
component: 'el-date-picker',
props: {
clearable: true,
type: 'daterange',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
shortcuts: shortcuts
},
colProps: {}
},
// {
// label: '状态',
// prop: 'state',
// component: shallowRef(fvSelect),
// props: {
// placeholder: '请选择状态',
// clearable: true,
// cacheKey: 'special_fund'
// }
// },
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
{
prop: 'index',
type: 'index',
label: '序号',
align: 'center',
width:85,
index: index => {
return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
}
},
{
prop: 'shareName',
label: '分摊名称',
align: 'center'
},
{
prop: 'apportionmentMonth',
label: '分摊月份',
align: 'center'
},
{
prop: 'generationTime',
label: '生成时间',
align: 'center'
},
{
prop: 'state',
label: '状态',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.state == undefined || row.state == 0) {
return '--'
} else {
return (<Tag dictType={'special_fund'} value={row.state}/>)
}
}
},
{
prop: 'oper',
label: '操作',
align: 'center',
fixed:'right',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
let btn = []
let buttons
if (row.buttons) {
buttons = new Set(Array.from(row.buttons))
}
if (buttons.has("details")) {
btn.push({label: '详情', prem: ['mosr:requirement:info'], func: () => handleDetail(row), type: 'primary'})
}
if (buttons.has("edit")) {
btn.push({label: '编辑', prem: ['mosr:requirement:resubmit'], func: () => handleEdit(row), type: 'primary'})
}
// if (buttons.has("report")) {
// btn.push({label: '明细导出', prem: ['mosr:requirement:info'], func: () => handleReport(row), type: 'primary'})
// }
// if (buttons.has("report")) {
// btn.push({label: '汇总导出', prem: ['mosr:requirement:info'], func: () => handleReport(row), type: 'primary'})
// }
return (
<div style={{width: '100%'}}>
{
btn.map(item => (
<el-button
type={item.type}
// v-perm={item.prem}
onClick={() => item.func()}
link
>
{item.label}
</el-button>
))
}
{
buttons.has("delete") ?
<popover-delete name={row.shareName} type={'费用分摊'} btnType={'danger'}
onDelete={() => handleDelete(row)}/>
: ''
}
</div>
)
}
}
],
api: '/workflow/mosr/cost/allocation',
btns: [
{name: '添加分摊', key: 'add', color: '#DED0B2'}
],
params: {}
})
const search = (val) => {
let obj = {...val}
if (obj.dateValue) {
obj.startGenerationTime = obj.dateValue[0]
obj.endGenerationTime = obj.dateValue[1]
delete obj.dateValue
}
tableConfig.params = obj
tableIns.value.refresh()
}
const handleAdd = () => {
router.push({
name: 'Share/add',
query: {}
})
}
const handleDetail = (row) => {
router.push({
name: 'Share/detail',
query: {
id: row.allocationId
}
})
}
const handleEdit = (row) => {
router.push({
name: 'Share/edit',
query: {
id: row.allocationId
}
})
}
const handleDelete = (row) => {
deleteAllocation(row.allocationId).then(res => {
ElNotification({
title: '提示',
message: res.msg,
type: res.code === 1000 ? 'success' : 'error'
})
if (res.code === 1000) {
tableIns.value.refresh()
}
});
}
const headBtnClick = (key) => {
switch (key) {
case 'add':
handleAdd()
break;
}
}
</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>
<template>
<fvSearchForm :searchConfig="searchConfig" @search="search" style="margin-left: 16px"></fvSearchForm>
<fvTable ref="tableIns" :tableConfig="tableConfig" @headBtnClick="headBtnClick">
<template #empty>
<el-empty description="暂无数据"/>
</template>
</fvTable>
</template>
<script setup lang="jsx">
// import fvSelect from '@/fvcomponents/fvSelect/index.vue'
import { ElNotification} from "element-plus";
import {deleteAllocation} from "@/api/expense-manage";
const router = useRouter();
const shortcuts = [
{
text: '上周',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
return [start, end]
},
},
{
text: '上月',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
return [start, end]
},
},
{
text: '三月前',
value: () => {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
return [start, end]
},
},
]
const searchConfig = reactive([
{
label: '分摊名称',
prop: 'shareName',
component: 'el-input',
props: {
placeholder: '请输入分摊名称查询',
clearable: true,
filterable: true,
checkStrictly: true
}
},
{
label: '分摊月份',
prop: 'apportionmentMonth',
component: 'el-date-picker',
props: {
placeholder: '请选择分摊月份',
clearable: true,
type:'month',
format: 'YYYY-MM',
valueFormat:"YYYY-MM"
},
colProps: {}
},
{
label: '生成时间',
prop: 'dateValue',
component: 'el-date-picker',
props: {
clearable: true,
type: 'daterange',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
shortcuts: shortcuts
},
colProps: {}
},
// {
// label: '状态',
// prop: 'state',
// component: shallowRef(fvSelect),
// props: {
// placeholder: '请选择状态',
// clearable: true,
// cacheKey: 'special_fund'
// }
// },
])
const tableIns = ref()
const tableConfig = reactive({
columns: [
{
prop: 'index',
type: 'index',
label: '序号',
align: 'center',
width:85,
index: index => {
return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
}
},
{
prop: 'shareName',
label: '分摊名称',
align: 'center'
},
{
prop: 'apportionmentMonth',
label: '分摊月份',
align: 'center'
},
{
prop: 'generationTime',
label: '生成时间',
align: 'center'
},
{
prop: 'state',
label: '状态',
align: 'center',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
if (row.state == undefined || row.state == 0) {
return '--'
} else {
return (<Tag dictType={'special_fund'} value={row.state}/>)
}
}
},
{
prop: 'oper',
label: '操作',
align: 'center',
fixed:'right',
showOverflowTooltip: false,
currentRender: ({row, index}) => {
let btn = []
let buttons
if (row.buttons) {
buttons = new Set(Array.from(row.buttons))
}
if (buttons.has("details")) {
btn.push({label: '详情', prem: ['mosr:requirement:info'], func: () => handleDetail(row), type: 'primary'})
}
if (buttons.has("edit")) {
btn.push({label: '编辑', prem: ['mosr:requirement:resubmit'], func: () => handleEdit(row), type: 'primary'})
}
// if (buttons.has("report")) {
// btn.push({label: '明细导出', prem: ['mosr:requirement:info'], func: () => handleReport(row), type: 'primary'})
// }
// if (buttons.has("report")) {
// btn.push({label: '汇总导出', prem: ['mosr:requirement:info'], func: () => handleReport(row), type: 'primary'})
// }
return (
<div style={{width: '100%'}}>
{
btn.map(item => (
<el-button
type={item.type}
// v-perm={item.prem}
onClick={() => item.func()}
link
>
{item.label}
</el-button>
))
}
{
buttons.has("delete") ?
<popover-delete name={row.shareName} type={'费用分摊'} btnType={'danger'}
onDelete={() => handleDelete(row)}/>
: ''
}
</div>
)
}
}
],
api: '/workflow/mosr/cost/allocation',
btns: [
{name: '添加分摊', key: 'add', color: '#DED0B2'}
],
params: {}
})
const search = (val) => {
let obj = {...val}
if (obj.dateValue) {
obj.startGenerationTime = obj.dateValue[0]
obj.endGenerationTime = obj.dateValue[1]
delete obj.dateValue
}
tableConfig.params = obj
tableIns.value.refresh()
}
const handleAdd = () => {
router.push({
name: 'Share/add',
query: {}
})
}
const handleDetail = (row) => {
router.push({
name: 'Share/detail',
query: {
id: row.allocationId
}
})
}
const handleEdit = (row) => {
router.push({
name: 'Share/edit',
query: {
id: row.allocationId
}
})
}
const handleDelete = (row) => {
deleteAllocation(row.allocationId).then(res => {
ElNotification({
title: '提示',
message: res.msg,
type: res.code === 1000 ? 'success' : 'error'
})
if (res.code === 1000) {
tableIns.value.refresh()
}
});
}
const headBtnClick = (key) => {
switch (key) {
case 'add':
handleAdd()
break;
}
}
</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>

202
src/views/expense-management/share/moblieDetail/AllocationSummaryDetailMoblie.vue
View File

@@ -1,101 +1,101 @@
<template>
<el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
<el-table ref="table" :data="tableData" style="width: 100%;height: 479px" :show-summary="true" border
:summary-method="getSummaries" v-loading="loading" :header-cell-style="{background:'#f5f7fa'}">
<el-table-column type="index" label="序号" align="center" width="60"/>
<el-table-column prop="projectName" label="项目名称" align="center"/>
<el-table-column prop="projectCost" label="费用性质" align="center">
<template #default="scope">
<div v-if="scope.row.projectCost !== null">
<Tag dictType="project_cost" :value="scope.row.projectCost"/>
</div>
<div v-else>--</div>
</template>
</el-table-column>
<el-table-column prop="researchStage" label="研发阶段" align="center">
<template #default="scope">
<div
v-if="scope.row.researchStage !== null && scope.row.researchStage !== null && scope.row.researchStage !== undefined">
<el-tag effect="plain">{{scope.row.researchStage==1?'开发阶段':'研究阶段'}}</el-tag>
</div>
<div v-else>--</div>
</template>
</el-table-column>
<el-table-column prop="afterTax" label="分摊金额" align="center">
<template #default="scope">
<div v-if="scope.row.afterTax !== null">
<!-- {{ toThousands(scope.row.afterTax) }}-->
{{ scope.row.afterTax }}
</div>
</template>
</el-table-column>
</el-table>
</template>
<script setup>
import {getAllocationSummaryDetails} from "@/api/expense-manage";
import {shareExportExcel} from "@/api/expense-manage";
const tableData = ref([])
const loading = ref(false)
const table = ref()
const route = useRoute()
const props = defineProps({
allocationName :{
type: String,
default: ''
}
})
const getSummaries = (param) => {
const {columns, data} = param
const sums = []
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '小计'
} else if (index === 4) {
const values = data.map((item) => Number(item[column.property]))
if (!values.every((value) => Number.isNaN(value))) {
sums[index] = `${values.reduce((prev, curr) => {
const value = Number(curr)
if (!Number.isNaN(value)) {
return prev + curr
} else {
return prev
}
}, 0)}`
sums[index] = parseFloat(sums[index]).toFixed(2)
} else {
sums[index] = '-'
}
}
})
return sums
}
const exportTable = () => {
shareExportExcel(route.query.id).then(res => {
console.log(res)
let fileName = `科技创新项目费用分摊表-${props.allocationName}.zip`
const blob = new Blob([res.data])
let a = document.createElement('a')
a.href = URL.createObjectURL(blob)
a.download = fileName
a.click()
})
}
const init = () => {
loading.value = true
let params = {
allocationId: route.query.id
}
getAllocationSummaryDetails(params).then(res => {
tableData.value = res.data
loading.value = false
})
}
init()
</script>
<style scoped>
</style>
<template>
<el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
<el-table ref="table" :data="tableData" style="width: 100%;height: 479px" :show-summary="true" border
:summary-method="getSummaries" v-loading="loading" :header-cell-style="{background:'#f5f7fa'}">
<el-table-column type="index" label="序号" align="center" width="60"/>
<el-table-column prop="projectName" label="项目名称" align="center"/>
<el-table-column prop="projectCost" label="费用性质" align="center">
<template #default="scope">
<div v-if="scope.row.projectCost !== null">
<Tag dictType="project_cost" :value="scope.row.projectCost"/>
</div>
<div v-else>--</div>
</template>
</el-table-column>
<el-table-column prop="researchStage" label="研发阶段" align="center">
<template #default="scope">
<div
v-if="scope.row.researchStage !== null && scope.row.researchStage !== null && scope.row.researchStage !== undefined">
<el-tag effect="plain">{{scope.row.researchStage==1?'开发阶段':'研究阶段'}}</el-tag>
</div>
<div v-else>--</div>
</template>
</el-table-column>
<el-table-column prop="afterTax" label="分摊金额" align="center">
<template #default="scope">
<div v-if="scope.row.afterTax !== null">
<!-- {{ toThousands(scope.row.afterTax) }}-->
{{ scope.row.afterTax }}
</div>
</template>
</el-table-column>
</el-table>
</template>
<script setup>
import {getAllocationSummaryDetails} from "@/api/expense-manage";
import {shareExportExcel} from "@/api/expense-manage";
const tableData = ref([])
const loading = ref(false)
const table = ref()
const route = useRoute()
const props = defineProps({
allocationName :{
type: String,
default: ''
}
})
const getSummaries = (param) => {
const {columns, data} = param
const sums = []
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '小计'
} else if (index === 4) {
const values = data.map((item) => Number(item[column.property]))
if (!values.every((value) => Number.isNaN(value))) {
sums[index] = `${values.reduce((prev, curr) => {
const value = Number(curr)
if (!Number.isNaN(value)) {
return prev + curr
} else {
return prev
}
}, 0)}`
sums[index] = parseFloat(sums[index]).toFixed(2)
} else {
sums[index] = '-'
}
}
})
return sums
}
const exportTable = () => {
shareExportExcel(route.query.id).then(res => {
console.log(res)
let fileName = `科技创新项目费用分摊表-${props.allocationName}.zip`
const blob = new Blob([res.data])
let a = document.createElement('a')
a.href = URL.createObjectURL(blob)
a.download = fileName
a.click()
})
}
const init = () => {
loading.value = true
let params = {
allocationId: route.query.id
}
getAllocationSummaryDetails(params).then(res => {
tableData.value = res.data
loading.value = false
})
}
init()
</script>
<style scoped>
</style>

514
src/views/expense-management/share/moblieDetail/ExpenseDetailMoblie.vue
View File

@@ -1,257 +1,257 @@
<template>
<el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
<div style="width: 375px; overflow-x: scroll;">
<el-table ref="reportTable" :data="tableData" style="width: 100%;height: 479px"
:span-method="objectSpanMethod" v-loading="loading">
<!-- <el-table-column label="四川省国有资产经营投资管理有限责任公司-->
<!-- 科技创新项目人工成本分摊明细表" align="center">-->
<el-table-column v-for="column in columnInfo" :prop="column.prop" :label="column.label" align="center">
<template #default="scope">
<template v-if="column.children">
<el-table-column v-for="childColumn in column.children"
:prop="column.prop + '.'+ childColumn.prop"
:label="childColumn.label"
:width="childColumn.prop === 'subtotal' ? 160 : 130">
<template #default="columnScope">
<template v-if="(tableData.length -1) !== columnScope.$index">
{{
columnScope.row[column.prop][childColumn.prop] ? columnScope.row[column.prop][childColumn.prop] : '/'
}}
</template>
<template v-else>
{{ columnScope.row[column.prop][childColumn.prop] }}
</template>
</template>
</el-table-column>
</template>
<template v-else>
<!--分摊金额合计与分摊金额总计计算-->
<template
v-if="(column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost') && (tableData.length -1) !== scope.$index">
{{ getTotalSeparation(scope.row, column.prop) }}
</template>
<template
v-else-if="(tableData.length -1) === scope.$index && (column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost')">
{{ getTotalSummary(scope.row, column.prop) }}
</template>
<template v-else>
{{ scope.row[column.prop] }}
</template>
</template>
</template>
</el-table-column>
<!-- </el-table-column>-->
</el-table>
</div>
</template>
<script setup lang="jsx">
import {getResearchUser, getAllocationDetails} from "@/api/expense-manage";
import {exportExcel} from "@/utils/export-excel";
import {ElNotification} from "element-plus";
const route = useRoute()
const tableIns = ref()
const reportTable = ref({});
const columnInfo = ref([])
const monthConcat = new Map()
const tableData = ref([])
const loading = ref(false)
const researchOptions = ref([])
const objectSpanMethod = ({row, column, rowIndex, columnIndex}) => {
if (columnIndex === 0) {
if (monthConcat.has(rowIndex)) {
return {
rowspan: monthConcat.get(rowIndex),
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 0,
}
}
} else {
let length = Object.keys(row).length
console.log(length)
if (length > 5) {
if (concatColumn(columnIndex, length, rowIndex)) {
if (rowIndex % 5 === 0) {
return {
rowspan: 5,
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 0,
}
}
}
}
}
}
const getTotalSeparation = (row, prop) => {
let totalSeparation = 0.00
for (let key of Object.keys(row)) {
if (key.startsWith('personInfo')) {
let value = prop === 'totalSeparation' ? (row[key].separationAmount ? row[key].separationAmount : 0) : row[key].subtotal
if ("/" !== value) {
try {
totalSeparation += parseFloat(value)
} catch (e) {
}
}
}
}
if (totalSeparation !== 0) {
return totalSeparation.toFixed(2);
} else {
return "/"
}
}
const getTotalSummary = (row, prop) => {
let key;
if (prop === 'totalSeparation') {
key = 'separationAmount'
} else {
key = 'subtotal'
}
let result = 0
for (const rowKey of Object.keys(row)) {
if (rowKey.startsWith('personInfo')) {
let value = row[rowKey][key]
if (value && "/" !== value) {
try {
result += parseFloat(value)
} catch (e) {
}
}
}
}
return result.toFixed(2);
}
const concatColumn = (columnIndex, length, rowIndex) => {
if (rowIndex === tableData.value.length - 1) {
return false
}
let columnLength = 5 + (length - 5) * 5
if (columnIndex === 1
|| columnIndex === columnLength - 1) {
return true;
}
for (let i = 0; i < length - 5; i++) {
if (columnIndex === 4 + (i * 5)
|| columnIndex === 5 + (i * 5)
|| columnIndex === 7 + (i * 5)) {
return true
}
}
return false
}
const init = () => {
loading.value = true
getAllocationDetails(route.query.id).then(res => {
if(res.code!==1000){
ElNotification({
title: '提示',
message: res.msg,
type: 'error'
})
}
columnInfo.value = res.data.columns
let tableDataLet = res.data.tableData;
let personInfoKey = []
columnInfo.value.forEach(item => {
if (item.prop.startsWith('personInfo')) {
personInfoKey.push(item.prop)
}
})
tableData.value = []
let rowIndex = 0;
let summary = {
month: "",
salaryType: '',
projectName: "合计",
totalSeparation: 10,
totalSeparationCost: 10
}
for (const key of personInfoKey) {
summary[key] = {
researchDuration: "",
separationAmount: 0,
subtotal: 0,
wagesPayable: "",
workday: "",
}
}
tableDataLet.forEach((tableDatum) => {
let rowspan = tableDatum.rows.length * 5
monthConcat.set(rowIndex, rowspan)
rowIndex += rowspan
for (const tableDatumElement of tableDatum.rows) {
tableData.value = tableData.value.concat(tableDatumElement)
let row = tableDatumElement[0]
for (const key of personInfoKey) {
try {
if (row[key].subtotal && '/' !== row[key].subtotal) {
summary[key].subtotal += parseFloat(row[key].subtotal)
}
} catch (e) {
}
}
}
})
for (const row of tableData.value) {
for (const key of personInfoKey) {
try {
if (row[key].separationAmount && '/' !== row[key].separationAmount) {
summary[key].separationAmount += parseFloat(row[key].separationAmount)
}
} catch (e) {
}
}
}
for (const key of personInfoKey) {
summary[key].subtotal = summary[key].subtotal.toFixed(2)
summary[key].separationAmount = summary[key].separationAmount.toFixed(2)
}
monthConcat.set(rowIndex, 1)
tableData.value.push(summary)
loading.value = false
})
}
const getResearchOptions = async () => {
const res = await getResearchUser()
researchOptions.value = res.data
}
const search = (val) => {
tableConfig.params = {
allocationId: route.query.id,
...val
}
tableIns.value.refresh()
}
getResearchOptions()
init()
const exportTable = () => {
const $e = reportTable.value.$el
let $table = $e.querySelector('.el-table__fixed')
if (!$table) {
$table = $e
}
exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表", 2)
}
</script>
<template>
<el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
<div style="width: 375px; overflow-x: scroll;">
<el-table ref="reportTable" :data="tableData" style="width: 100%;height: 479px"
:span-method="objectSpanMethod" v-loading="loading">
<!-- <el-table-column label="四川省国有资产经营投资管理有限责任公司-->
<!-- 科技创新项目人工成本分摊明细表" align="center">-->
<el-table-column v-for="column in columnInfo" :prop="column.prop" :label="column.label" align="center">
<template #default="scope">
<template v-if="column.children">
<el-table-column v-for="childColumn in column.children"
:prop="column.prop + '.'+ childColumn.prop"
:label="childColumn.label"
:width="childColumn.prop === 'subtotal' ? 160 : 130">
<template #default="columnScope">
<template v-if="(tableData.length -1) !== columnScope.$index">
{{
columnScope.row[column.prop][childColumn.prop] ? columnScope.row[column.prop][childColumn.prop] : '/'
}}
</template>
<template v-else>
{{ columnScope.row[column.prop][childColumn.prop] }}
</template>
</template>
</el-table-column>
</template>
<template v-else>
<!--分摊金额合计与分摊金额总计计算-->
<template
v-if="(column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost') && (tableData.length -1) !== scope.$index">
{{ getTotalSeparation(scope.row, column.prop) }}
</template>
<template
v-else-if="(tableData.length -1) === scope.$index && (column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost')">
{{ getTotalSummary(scope.row, column.prop) }}
</template>
<template v-else>
{{ scope.row[column.prop] }}
</template>
</template>
</template>
</el-table-column>
<!-- </el-table-column>-->
</el-table>
</div>
</template>
<script setup lang="jsx">
import {getResearchUser, getAllocationDetails} from "@/api/expense-manage";
import {exportExcel} from "@/utils/export-excel";
import {ElNotification} from "element-plus";
const route = useRoute()
const tableIns = ref()
const reportTable = ref({});
const columnInfo = ref([])
const monthConcat = new Map()
const tableData = ref([])
const loading = ref(false)
const researchOptions = ref([])
const objectSpanMethod = ({row, column, rowIndex, columnIndex}) => {
if (columnIndex === 0) {
if (monthConcat.has(rowIndex)) {
return {
rowspan: monthConcat.get(rowIndex),
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 0,
}
}
} else {
let length = Object.keys(row).length
console.log(length)
if (length > 5) {
if (concatColumn(columnIndex, length, rowIndex)) {
if (rowIndex % 5 === 0) {
return {
rowspan: 5,
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 0,
}
}
}
}
}
}
const getTotalSeparation = (row, prop) => {
let totalSeparation = 0.00
for (let key of Object.keys(row)) {
if (key.startsWith('personInfo')) {
let value = prop === 'totalSeparation' ? (row[key].separationAmount ? row[key].separationAmount : 0) : row[key].subtotal
if ("/" !== value) {
try {
totalSeparation += parseFloat(value)
} catch (e) {
}
}
}
}
if (totalSeparation !== 0) {
return totalSeparation.toFixed(2);
} else {
return "/"
}
}
const getTotalSummary = (row, prop) => {
let key;
if (prop === 'totalSeparation') {
key = 'separationAmount'
} else {
key = 'subtotal'
}
let result = 0
for (const rowKey of Object.keys(row)) {
if (rowKey.startsWith('personInfo')) {
let value = row[rowKey][key]
if (value && "/" !== value) {
try {
result += parseFloat(value)
} catch (e) {
}
}
}
}
return result.toFixed(2);
}
const concatColumn = (columnIndex, length, rowIndex) => {
if (rowIndex === tableData.value.length - 1) {
return false
}
let columnLength = 5 + (length - 5) * 5
if (columnIndex === 1
|| columnIndex === columnLength - 1) {
return true;
}
for (let i = 0; i < length - 5; i++) {
if (columnIndex === 4 + (i * 5)
|| columnIndex === 5 + (i * 5)
|| columnIndex === 7 + (i * 5)) {
return true
}
}
return false
}
const init = () => {
loading.value = true
getAllocationDetails(route.query.id).then(res => {
if(res.code!==1000){
ElNotification({
title: '提示',
message: res.msg,
type: 'error'
})
}
columnInfo.value = res.data.columns
let tableDataLet = res.data.tableData;
let personInfoKey = []
columnInfo.value.forEach(item => {
if (item.prop.startsWith('personInfo')) {
personInfoKey.push(item.prop)
}
})
tableData.value = []
let rowIndex = 0;
let summary = {
month: "",
salaryType: '',
projectName: "合计",
totalSeparation: 10,
totalSeparationCost: 10
}
for (const key of personInfoKey) {
summary[key] = {
researchDuration: "",
separationAmount: 0,
subtotal: 0,
wagesPayable: "",
workday: "",
}
}
tableDataLet.forEach((tableDatum) => {
let rowspan = tableDatum.rows.length * 5
monthConcat.set(rowIndex, rowspan)
rowIndex += rowspan
for (const tableDatumElement of tableDatum.rows) {
tableData.value = tableData.value.concat(tableDatumElement)
let row = tableDatumElement[0]
for (const key of personInfoKey) {
try {
if (row[key].subtotal && '/' !== row[key].subtotal) {
summary[key].subtotal += parseFloat(row[key].subtotal)
}
} catch (e) {
}
}
}
})
for (const row of tableData.value) {
for (const key of personInfoKey) {
try {
if (row[key].separationAmount && '/' !== row[key].separationAmount) {
summary[key].separationAmount += parseFloat(row[key].separationAmount)
}
} catch (e) {
}
}
}
for (const key of personInfoKey) {
summary[key].subtotal = summary[key].subtotal.toFixed(2)
summary[key].separationAmount = summary[key].separationAmount.toFixed(2)
}
monthConcat.set(rowIndex, 1)
tableData.value.push(summary)
loading.value = false
})
}
const getResearchOptions = async () => {
const res = await getResearchUser()
researchOptions.value = res.data
}
const search = (val) => {
tableConfig.params = {
allocationId: route.query.id,
...val
}
tableIns.value.refresh()
}
getResearchOptions()
init()
const exportTable = () => {
const $e = reportTable.value.$el
let $table = $e.querySelector('.el-table__fixed')
if (!$table) {
$table = $e
}
exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表", 2)
}
</script>

280
src/views/expense-management/share/moblieDetail/index.vue
View File

@@ -1,140 +1,140 @@
<template>
<div style="padding: 0 10px;">
<baseTitle title="费用分摊详情"></baseTitle>
<el-form :model="formData" ref="form" class="query-form" label-width="auto">
<el-row>
<el-col :span="24">
<el-form-item label="分摊名称">
<span>{{ formData.shareName }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="分摊月份">
<span>{{ formData.apportionmentMonth }}</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="分摊汇总" name="first" v-loading="loading">
<allocation-summary-detail-moblie :allocation-name="formData.shareName" />
</el-tab-pane>
<el-tab-pane label="分摊明细" name="second">
<expense-detail-moblie/>
</el-tab-pane>
</el-tabs>
<div v-if="shareData.taskId">
<baseTitle title="审核意见"></baseTitle>
<el-form-item prop="auditOpinion">
<el-input
v-model="auditOpinion"
:rows="3"
type="textarea"
placeholder="请输入审核意见"
/>
</el-form-item>
</div>
<div class="approval-record">
<div class="approval-title">
<baseTitle title="审批记录"></baseTitle>
<div class="diagram">
<div class="base-title">流程图</div>
<el-switch
v-model="changeDiagram"
style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
/>
</div>
</div>
<div class="process">
<operation-render
v-if="shareProcessViewer&& shareData.operationList && shareData.operationList.length > 0&&!changeDiagram"
:operation-list="shareData.operationList"
:state="shareData.state"/>
<process-diagram-viewer v-if="shareProcessViewer&&changeDiagram" id-name="shareProcess"/>
</div>
</div>
<opinion-moblie v-if="shareData.taskId" :formData="shareData.formData" :taskId="shareData.taskId"
:taskUserOptionList="shareData.taskUserOptionList"
v-model:value="auditOpinion"></opinion-moblie>
</div>
</template>
<script setup lang="jsx">
import OperationRender from '@/views/workflow/common/OperationRender.vue'
import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
import {ElNotification} from "element-plus";
import {useProcessStore} from '@/stores/processStore.js';
import {getAllocationDetail} from "@/api/expense-manage";
import AllocationSummaryDetailMoblie from './AllocationSummaryDetailMoblie.vue'
import ExpenseDetailMoblie from './ExpenseDetailMoblie.vue'
import OpinionMoblie from '@/views/project-management/mobledetail/OpinionMoblie.vue'
const changeDiagram = ref(false)
const processStore = useProcessStore()
const route = useRoute()
const shareData = ref({})
const formData = ref({})
const auditOpinion = ref('')
const shareProcessViewer = ref(true)
const loading = ref(false)
const activeName = ref('first')
// const activeName = ref('second')
const getDetail = async () => {
const id = route.query.id
shareProcessViewer.value = false
const {code, data, msg} = await getAllocationDetail(id)
if (code === 1000) {
shareData.value = data
formData.value = data.formData
processStore.setDesign(data)
processStore.runningList.value = data.runningList;
processStore.endList.value = data.endList;
processStore.noTakeList.value = data.noTakeList;
processStore.refuseList.value = data.refuseList;
processStore.passList.value = data.passList;
nextTick(() => {
shareProcessViewer.value = true
})
} else {
ElNotification({
title: '提示',
message: msg,
type: 'error'
})
}
}
const handleClick = (tab) => {
if (tab.index == 0) {
getDetail()
}
}
getDetail()
</script>
<style scoped lang="scss">
:deep(.el-table--fit ) {
width: 100%;
height: 479px !important;
}
:deep(.el-tabs__nav-scroll) {
width: 100%;
display: flex;
.el-tabs__nav {
display: flex;
flex: 1;
.el-tabs__item {
flex: 1;
font-size: 16px;
}
.is-active {
color: black;
//background-color: #DED0B2;
}
}
}
</style>
<template>
<div style="padding: 0 10px;">
<baseTitle title="费用分摊详情"></baseTitle>
<el-form :model="formData" ref="form" class="query-form" label-width="auto">
<el-row>
<el-col :span="24">
<el-form-item label="分摊名称">
<span>{{ formData.shareName }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="分摊月份">
<span>{{ formData.apportionmentMonth }}</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="分摊汇总" name="first" v-loading="loading">
<allocation-summary-detail-moblie :allocation-name="formData.shareName" />
</el-tab-pane>
<el-tab-pane label="分摊明细" name="second">
<expense-detail-moblie/>
</el-tab-pane>
</el-tabs>
<div v-if="shareData.taskId">
<baseTitle title="审核意见"></baseTitle>
<el-form-item prop="auditOpinion">
<el-input
v-model="auditOpinion"
:rows="3"
type="textarea"
placeholder="请输入审核意见"
/>
</el-form-item>
</div>
<div class="approval-record">
<div class="approval-title">
<baseTitle title="审批记录"></baseTitle>
<div class="diagram">
<div class="base-title">流程图</div>
<el-switch
v-model="changeDiagram"
style="--el-switch-on-color:#BEA266 ; --el-switch-off-color:#cecdcd"
/>
</div>
</div>
<div class="process">
<operation-render
v-if="shareProcessViewer&& shareData.operationList && shareData.operationList.length > 0&&!changeDiagram"
:operation-list="shareData.operationList"
:state="shareData.state"/>
<process-diagram-viewer v-if="shareProcessViewer&&changeDiagram" id-name="shareProcess"/>
</div>
</div>
<opinion-moblie v-if="shareData.taskId" :formData="shareData.formData" :taskId="shareData.taskId"
:taskUserOptionList="shareData.taskUserOptionList"
v-model:value="auditOpinion"></opinion-moblie>
</div>
</template>
<script setup lang="jsx">
import OperationRender from '@/views/workflow/common/OperationRender.vue'
import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
import {ElNotification} from "element-plus";
import {useProcessStore} from '@/stores/processStore.js';
import {getAllocationDetail} from "@/api/expense-manage";
import AllocationSummaryDetailMoblie from './AllocationSummaryDetailMoblie.vue'
import ExpenseDetailMoblie from './ExpenseDetailMoblie.vue'
import OpinionMoblie from '@/views/project-management/mobledetail/OpinionMoblie.vue'
const changeDiagram = ref(false)
const processStore = useProcessStore()
const route = useRoute()
const shareData = ref({})
const formData = ref({})
const auditOpinion = ref('')
const shareProcessViewer = ref(true)
const loading = ref(false)
const activeName = ref('first')
// const activeName = ref('second')
const getDetail = async () => {
const id = route.query.id
shareProcessViewer.value = false
const {code, data, msg} = await getAllocationDetail(id)
if (code === 1000) {
shareData.value = data
formData.value = data.formData
processStore.setDesign(data)
processStore.runningList.value = data.runningList;
processStore.endList.value = data.endList;
processStore.noTakeList.value = data.noTakeList;
processStore.refuseList.value = data.refuseList;
processStore.passList.value = data.passList;
nextTick(() => {
shareProcessViewer.value = true
})
} else {
ElNotification({
title: '提示',
message: msg,
type: 'error'
})
}
}
const handleClick = (tab) => {
if (tab.index == 0) {
getDetail()
}
}
getDetail()
</script>
<style scoped lang="scss">
:deep(.el-table--fit ) {
width: 100%;
height: 479px !important;
}
:deep(.el-tabs__nav-scroll) {
width: 100%;
display: flex;
.el-tabs__nav {
display: flex;
flex: 1;
.el-tabs__item {
flex: 1;
font-size: 16px;
}
.is-active {
color: black;
//background-color: #DED0B2;
}
}
}
</style>