478 lines
16 KiB
Vue

<template>
<div id="content-container" :class="{'expand-right': expandRight}">
<!--Page Title-->
<div id="page-title">
<h1 class="page-header text-overflow">项目预算执行率监控周报</h1>
</div>
<!--End page title-->
<!--Breadcrumb-->
<!--<ol class="breadcrumb">-->
<!--<li><a href="#">Home</a></li>-->
<!--<li><a href="#">Layouts</a></li>-->
<!--<li class="active">Demo</li>-->
<!--</ol>-->
<!--End breadcrumb-->
<!--Page content-->
<div class="page-content">
<div class="panel">
<div class="panel-body">
<el-form :model="formModel" label-width="100px" ref="formName">
<el-form-item label="项目编号" prop="projectNo">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.projectNo"
:disabled="true"
>
</el-input>
</el-form-item>
<el-form-item label="项目名称" prop="projectName">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.projectName"
:disabled="true"
>
</el-input>
</el-form-item>
<el-form-item label="周数" prop="week">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.week"
:disabled="true"
>
</el-input>
</el-form-item>
<el-form-item label="预算(万元)" prop="budget">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.budget"
:disabled="true"
>
</el-input>
</el-form-item>
<el-form-item label="执行(万元)" prop="execute">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.execute"
>
</el-input>
</el-form-item>
<el-form-item label="预算执行率" prop="implementationRate">
<el-input
class="form-input"
placeholder="请输入内容"
v-model="formModel.implementationRate"
:disabled="true"
>
</el-input>
</el-form-item>
<!-- </div>-->
<el-form-item>
<div style="float: right">
<el-button @click="cancel()" type="default">取消</el-button>
<el-button @click="save('formName')" type="primary" :disabled="!isSave">保存</el-button>
</div>
</el-form-item>
</el-form>
</div>
</div>
</div>
<!--End Page content-->
</div>
</template>
<script>
import DataForm from '../../../../components/form/DataForm.vue'
import DataTable from '../../../../components/DataTable.vue'
import Api from '../../../../server/index'
import app from '../../../../assets/js/common/app.js'
import {baseUrl} from '../../../../config/env.js'
import verifyButton from '../../../../components/verifyButton.vue'
import FlowRecordTable from '../../../../components/FlowRecordTable.vue'
export default {
beforeRouteEnter (to, from, next) {
next(function (vm) {
global.getMenuIndex(vm)
})
},
data () {
return {
ext: {},
thisWeek: '',
nextWeek: '',
userId: '',
workload: '',
projectName: '',
week: '',
money: '',
projectNo: '',
expandRight: false,
app: app,
reimburseId: '',
actionUrl: `${baseUrl}/api/common/file-upload`, // 上传路径
baseUrl: baseUrl,
formModel: {
userInfoId: '',
witness: '',
deptId: '',
reimburseCategory: '', // 报销种类
reason: '', // 报销事由
selectBudgetCategoryId: [], // 预算种类
reimburseDetail: [
{
time: '',
money: '',
moneyDetail: '',
total: 0,
hasBill: '', // 是否有发票
fileList: [], // 文件列表
}
], // 报销详情
activie: 0
},
formWitnessData: [], // 证明人数据源
orgOptions: [],
userInfoOption: [],
reimburseCategoryData: app.reimbursement, // 报销种类
budgetCategory: [], // 预算种类层级
reimburseIndex: 0, // 点击哪个报销明细做个标记
// 审批相关
rewriteAgreeVerify: false, //是否要重写同意审批事件
rewriteRejectVerify: false, //是否要重写驳回审批事件
rewriteDestroyVerify: false, //是否要重写作废审批事件
flowId: '',
taskId: '',
checkOrVerify: false, //标识是查看详情还是审批
isSave: true,
isEdit: false,
canEditReimburseCategory: false, //标识是否能改报销分类
canEditBudgetCategory: false, //标识是否能改预算类别
isVerify: false,
isNotVerifyReady: false // 是否未审核
}
},
created () {
this.taskId = this.$route.params.taskId
if (this.$route.name === 'ExpenseClaimApplyEdit') {
this.isEdit = true
this.flowId = this.$route.params.id
console.log('路由ID为', this.$route.params.id)
this.checkOrVerify = true
} else if (this.$route.name === 'ExpenseClaimApplyVerify') {
this.isVerify = true
this.flowId = this.$route.params.verifyId
this.checkOrVerify = false
this.isNotVerifyReady = this.$route.query.isNotVerifyReady === 'Y'
} else if (this.$route.name === 'ExpenseClaimApplyArchive') {
this.flowId = this.$route.params.id
this.checkOrVerify = true
} else {
this.flowId = this.$route.params.id
this.checkOrVerify = true
}
this.init()
this.getBudgetCategory()
},
methods: {
init () {
this.reimburseId = this.$route.params.id
this.getBudget()
// Api.FinanceManagement.getReimburseDetail(this.reimburseId).then(result => {
// console.log("====",result);
// if (result.status === 0) {
// this.userInfoOption.push({
// label: result.data.userInfo.userInfoName,
// model: result.data.userInfo.userInfoId
// });
// let orgName = '';
// if (result.data.userInfo.dept.length) {
// for (let i=0; i<result.data.userInfo.dept.length; i++) {
// orgName += result.data.userInfo.dept[i].orgName;
// if (i<result.data.userInfo.dept.length-1) {
// orgName += '>'
// }
// }
// this.orgOptions.push({
// label: orgName,
// model: result.data.userInfo.dept[result.data.userInfo.dept.length-1].id
// });
// this.formModel.deptId = result.data.userInfo.dept[result.data.userInfo.dept.length-1].id;
// }
// if (result.data.activitiStatus == '0' || result.data.activitiStatus == '1' || result.data.activitiStatus == '3') {
// this.formModel.activie = 2;
// }
// if (result.data.activitiStatus == '2' || result.data.activitiStatus == '4') {
// this.formModel.activie = 3;
// }
// this.formModel.userInfoId = result.data.userInfo.userInfoId;
// this.formModel.reimburseCategory = result.data.ext.reimburseCategory;
// this.formModel.reason = result.data.ext.reason;
// this.formModel.total = result.data.ext.total;
// this.formModel.witness = result.data.ext.witness;
// this.formModel.selectBudgetCategoryId = [];
// for(let i=0; i<result.data.budgetCategory.length; i++) {
// this.formModel.selectBudgetCategoryId.push(result.data.budgetCategory[i].id);
// }
// this.formModel.reimburseDetail = result.data.ext.detail;
// this.judgeEditAuth(result.data.isEdit);
// } else {
// this.$message.error(`${result.msg}`);
// }
// })
},
getBudget () {
let projectBudgetImplementFindReq = {
pageNo: 1,
pageSize: 1,
id: this.reimburseId
}
Api.ProjectManagements.getBudget(projectBudgetImplementFindReq).then(result => {
this.tableRowsData = []
this.pageLoading = false
console.log('预算执行率', result)
if (result.status === 0) {
let dataList = result.data.ls[0]
this.formModel = dataList
// this.tableRowsData.push({
// id: dataList.id,
// projectNo: dataList.projectNo,
// projectName: dataList.projectName,
// budget: dataList.budget,
// execute: dataList.execute,
// implementationRate: dataList.implementationRate
// })
}
})
},
//判断是否能修改报销分类和预算类别(财务专员在审批中能修改)
judgeEditAuth (canEdit) {
if (this.isNotVerifyReady === true) {
if (this.$route.name === 'ExpenseClaimApplyVerify') {
this.canEditBudgetCategory = canEdit
this.rewriteAgreeVerify = canEdit
this.rewriteRejectVerify = canEdit
this.rewriteDestroyVerify = canEdit
if (this.formModel.reimburseCategory !== 'medical') {
this.canEditReimburseCategory = canEdit
//其他类型的报销不能改为医疗保险
let destData = []
this.reimburseCategoryData.forEach((category, index) => {
destData.push(
{
label: category.label,
model: category.model,
disabled: category.model === 'medical',
}
)
})
this.reimburseCategoryData = destData
}
this.isEdit = false
} else {
this.isEdit = canEdit
}
}
},
getBudgetCategory () {
Api.Common.getBudgetCategory().then(result => {
if (result.status === 0) {
this.budgetCategory = this.assembleOrgData(result.data)
} else {
this.$message.error(`${result.msg}`)
}
})
},
//请求所有人员
getAllPeople () {
// Api.PersonnelManagement.personListNew(1, 10000).then((result) => {
// if (result.status === 0) {
// for (let i = 0; i < result.data.ls.length; i++) {
// let people = result.data.ls[i]
// this.formWitnessData.push({
// model: people.id,
// label: people.personName,
// disabled: people.id === this.formModel.userInfoId
// })
// }
// } else {
// this.$message.error(`${result.msg}`)
// }
// })
let params = {
path: {
id: 0
}
}
Api.Administration.getPeers(params).then((result) => {
console.log('查询所有')
console.log('查询所有人员的方法')
if (result.status === 0) {
// this.formModel.deptId=this.assembleOrgData(result.data)
this.orgOptions = this.assembleOrgData(result.data)
// this.formModel.userId=this.assembleOrgData(result.data)
// this.userInfoOption=this.assembleOrgData(result.data)
console.log('deptId', this.formModel.deptId)
console.log('orgOptions', this.orgOptions)
console.log('userId', this.formModel.userId)
console.log('userInfoOption', this.userInfoOption)
//执行部门所有下拉数据
// this.formPermissionsData = this.assembleOrgData(result.data)
//任务执行人下拉回显
// this.formProjectManagerData = this.assembleOrgData(result.data)
// this.formPeopleData = this.assembleOrgData(result.data)
// this.formProjectAdmin = this.assembleOrgData(result.data)
// this.formMainLeader = this.assembleOrgData(result.data)
// this.formBranchLeader = this.assembleOrgData(result.data)
} else {
this.$message.error(result.msg)
}
})
},
//递归组装部门级联选择器数据源
assembleOrgData (source) {
let dest = []
for (let i = 0; i < source.length; i++) {
let org = {
value: source[i].id,
parentId: source[i].parentId,
label: source[i].name,
depth: source[i].depth
}
if (source[i].childList && source[i].childList.length > 0) {
org['children'] = this.assembleOrgData(source[i].childList)
}
dest.push(org)
}
return dest
},
addFile () {
this.formModel.reimburseDetail.push({
time: '',
money: '',
moneyDetail: '',
hasBill: '', // 是否有发票
fileList: [] // 文件列表
})
},
deleteFile (index) {
if (this.formModel.reimburseDetail.length === 1) {
this.$message.warning('报销明细不能为空!')
return false
}
this.formModel.reimburseDetail.splice(index, 1)
},
// 上传附件
handleFileRemove (file, fileList) {
console.log(fileList)
setTimeout(() => {
this.formModel.reimburseDetail[this.reimburseIndex].fileList = []
for (let i = 0; i < fileList.length; i++) {
this.formModel.reimburseDetail[this.reimburseIndex].fileList.push({
name: fileList[i].name,
url: fileList[i].url
})
}
}, 10)
},
handleFileSuccess (res, file, fileList) {
if (res.status === 0) {
this.formModel.reimburseDetail[this.reimburseIndex].fileList.push({
name: file.name,
url: file.response.data.url
})
} else {
this.$message.error(`${res.msg}`)
}
console.log(this.formModel.reimburseDetail[this.reimburseIndex].fileList)
},
reimburseClick (index) {
this.reimburseIndex = index
console.log(index)
},
//重写同意审批按钮事件
agreeFlowVerify (comment) {
this.save('formName', 'commit', comment)
},
//重写驳回审批按钮事件
rejectFlowVerify (comment) {
this.save('formName', 'back', comment)
},
//重写作废审批按钮事件
destroyFlowVerify (comment) {
this.save('formName', 'end', comment)
},
cancel () {
this.$router.go(-1)
},
save (formName) {
console.log('formName', formName)
this.$refs[formName].validate((valid) => {
if (valid) {
let data = {
projectBudgetImplement: {
id: this.reimburseId,
projectNo: this.formModel.projectNo,
projectName: this.formModel.projectName,
budget: this.formModel.budget,
execute: this.formModel.execute,
week: this.formModel.week,
implementationRate: this.formModel.implementationRate
}
}
this.isSave = false
Api.ProjectManagements.addBudget(data.projectBudgetImplement).then(result => {
this.isSave = true
if (result.status === 0) {
this.$message.success(result.data)
this.$router.push({name: 'ProjectBudgetApply'})
} else {
this.$message.error(result.data)
}
})
console.log(data)
} else {
console.log('error submit!!')
return false
}
})
},
moneyChange () {
let total = 0
for (let i = 0; i < this.formModel.reimburseDetail.length; i++) {
if (this.formModel.reimburseDetail[i].money === '' || !this.formModel.reimburseDetail[i].money) {
total += 0
} else {
total += Number(this.formModel.reimburseDetail[i].money)
}
}
this.formModel.total = total.toFixed(2)
}
},
components: {
DataTable, DataForm, verifyButton, FlowRecordTable
}
}
</script>
<style scoped lang="less" rel="stylesheet/less">
.expand-right {
@media (min-width: 768px) {
padding-left: 0 !important;
}
}
.page-content {
padding: 15px;
}
</style>