377 lines
13 KiB
Vue
377 lines
13 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="deptId">
|
|
<el-select class="form-input" filterable placeholder="请选择" v-model="formModel.deptId" :disabled="true">
|
|
<el-option
|
|
v-for="subItem in orgOptions"
|
|
:key="subItem.model"
|
|
:label="subItem.label"
|
|
:value="subItem.model"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="姓名" prop="userId">
|
|
<el-select class="form-input" filterable placeholder="请选择" :disabled="true"
|
|
v-model="formModel.userInfoId">
|
|
<el-option
|
|
v-for="subItem in userInfoOption"
|
|
:key="subItem.model"
|
|
:label="subItem.label"
|
|
:value="subItem.model"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="项目编号" prop="projectNo">
|
|
<el-input
|
|
class="form-input"
|
|
placeholder="请输入内容"
|
|
v-model="formModel.projectNo"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
|
|
<!-- :rules="[-->
|
|
<!-- {projectName: true, message: '项目名称不能为空'}]"-->
|
|
<el-form-item label="项目名称" prop="projectName">
|
|
<el-input
|
|
class="form-input"
|
|
placeholder="请输入内容"
|
|
v-model="formModel.projectName"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
<!-- <el-form-item label="证明人" prop="witness" :rules="[-->
|
|
<!-- {required: true, message: '证明人不能为空'}]" v-if="formModel.reimburseCategory !== 'medical'">-->
|
|
<!-- <el-select class="form-input" filterable placeholder="请选择" v-model="formModel.witness">-->
|
|
<!-- <el-option-->
|
|
<!-- v-for="subItem in formWitnessData"-->
|
|
<!-- :key="subItem.model"-->
|
|
<!-- :label="subItem.label"-->
|
|
<!-- :value="subItem.model"-->
|
|
<!-- :disabled="subItem.disabled"-->
|
|
<!-- >-->
|
|
<!-- </el-option>-->
|
|
<!-- </el-select>-->
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <el-form-item label="预算种类" prop="selectBudgetCategoryId" :rules="[-->
|
|
<!-- {required: true, message: '预算种类不能为空'}]">-->
|
|
<!-- <el-cascader-->
|
|
<!-- :options="budgetCategory"-->
|
|
<!-- v-model="formModel.selectBudgetCategoryId"-->
|
|
<!-- class="form-input"-->
|
|
<!-- ></el-cascader>-->
|
|
<!-- </el-form-item>-->
|
|
|
|
<!-- <el-form-item label="报销事由" prop="reason" :rules="[-->
|
|
<!-- {required: true, message: '报销事由不能为空'}]">-->
|
|
<!-- <el-input-->
|
|
<!-- class="form-input"-->
|
|
<!-- placeholder="请输入内容"-->
|
|
<!-- v-model="formModel.reason"-->
|
|
<!-- >-->
|
|
<!-- </el-input>-->
|
|
<!-- </el-form-item>-->
|
|
<!--明细-->
|
|
<!-- <div class="form-item-border" v-for="(item, index) in formModel.reimburseDetail" @click="reimburseClick(index)">-->
|
|
<!-- :rules="[-->
|
|
<!-- {required: true, message: '工作量不能为空'}, { type: 'number', message: '工作量必须为数字值'}]"-->
|
|
<el-form-item label="工作量(人日)" prop="workload">
|
|
<el-input
|
|
class="form-input"
|
|
placeholder="请输入内容"
|
|
v-model.number="formModel.workload"
|
|
@change="moneyChange"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="本周进展" prop="thisWeek">
|
|
<el-input
|
|
class="form-input"
|
|
placeholder="请输入内容"
|
|
v-model="formModel.thisWeek"
|
|
>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="下周计划" prop="nextWeek">
|
|
<el-input
|
|
class="form-input"
|
|
placeholder="请输入内容"
|
|
v-model="formModel.nextWeek"
|
|
>
|
|
</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.js'
|
|
import app from '../../../assets/js/common/app.js'
|
|
import {getItem} from '../../../config/mUtils.js'
|
|
import {baseUrl} from '../../../config/env.js'
|
|
|
|
export default {
|
|
beforeRouteEnter (to, from, next) {
|
|
next(function (vm) {
|
|
global.getMenuIndex(vm)
|
|
})
|
|
},
|
|
data () {
|
|
return {
|
|
ext: {},
|
|
thisWeek: '',
|
|
nextWeek: '',
|
|
userId: '',
|
|
workload: '',
|
|
projectName: '',
|
|
money: '',
|
|
projectNo: '',
|
|
expandRight: false,
|
|
app: app,
|
|
actionUrl: `${baseUrl}/api/common/file-upload`, // 上传路径
|
|
baseUrl: baseUrl,
|
|
formModel: {
|
|
userInfoId: '',
|
|
witness: '',
|
|
deptId: '',
|
|
reimburseCategory: '', // 报销种类
|
|
reason: '', // 报销事由
|
|
selectBudgetCategoryId: [], // 预算种类
|
|
total: 0,
|
|
reimburseDetail: [
|
|
{
|
|
time: '',
|
|
money: '',
|
|
moneyDetail: '',
|
|
hasBill: '', // 是否有发票
|
|
fileList: [], // 文件列表
|
|
}
|
|
] // 报销详情
|
|
},
|
|
formWitnessData: [], // 证明人数据源
|
|
orgOptions: [],
|
|
userInfoOption: [],
|
|
isSave: true,
|
|
budgetCategory: [], // 预算种类层级
|
|
reimburseIndex: 0 // 点击哪个报销明细做个标记
|
|
}
|
|
},
|
|
created () {
|
|
this.init()
|
|
this.getBudgetCategory()
|
|
this.getAllPeople()
|
|
},
|
|
computed: {},
|
|
methods: {
|
|
init () {
|
|
let orgIdArr = JSON.parse(getItem('orgIdData'))
|
|
this.formModel.deptId = orgIdArr[orgIdArr.length - 1]
|
|
this.formModel.userInfoId = getItem('userInfoId')
|
|
let orgName = getItem('orgNameStr')
|
|
this.orgOptions.push({
|
|
label: orgName,
|
|
model: this.formModel.deptId
|
|
})
|
|
this.userInfoOption.push({
|
|
label: getItem('userName'),
|
|
model: getItem('userInfoId')
|
|
})
|
|
},
|
|
getBudgetCategory () {
|
|
Api.Common.getBudgetCategory().then(result => {
|
|
if (result.status === 0) {
|
|
console.log(result)
|
|
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 === getItem('userInfoId')
|
|
})
|
|
}
|
|
} 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)
|
|
},
|
|
cancel () {
|
|
this.$router.go(-1)
|
|
},
|
|
save (formName) {
|
|
console.log('formName', formName)
|
|
this.$refs[formName].validate((valid) => {
|
|
if (valid) {
|
|
let data = {
|
|
projectWeeklyAddReq: {
|
|
projectWeekly: {
|
|
userId: this.formModel.userInfoId,
|
|
thisWeek: this.formModel.thisWeek,
|
|
nextWeek: this.formModel.nextWeek,
|
|
workload: this.formModel.workload,
|
|
deptId: this.formModel.deptId
|
|
},
|
|
ext: {
|
|
projectName: this.formModel.projectName,
|
|
projectNo: this.formModel.projectNo,
|
|
deptName: this.orgOptions[0].label,
|
|
userName: this.userInfoOption[0].label
|
|
}
|
|
}
|
|
}
|
|
this.isSave = false
|
|
Api.ProjectManagements.addWeekly(data.projectWeeklyAddReq).then(result => {
|
|
this.isSave = true
|
|
if (result.status === 0) {
|
|
this.$message.success('添加成功！')
|
|
this.$router.push({name: 'WeeklyClaimApply'})
|
|
} 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
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less" rel="stylesheet/less">
|
|
.expand-right {
|
|
@media (min-width: 768px) {
|
|
padding-left: 0 !important;
|
|
}
|
|
}
|
|
|
|
.page-content {
|
|
padding: 15px;
|
|
}
|
|
|
|
</style>
|