252 lines
9.3 KiB
Vue
252 lines
9.3 KiB
Vue
<template>
|
|
<div class="project-cost-outpu-drawer" v-if="isOpen">
|
|
<el-drawer v-if="isOpen" :visible.sync="isOpen" direction="rtl" size="50%" style="padding-left: 20px">
|
|
<template slot="title">
|
|
<div>{{ (title) + " 【项目成本产值管理】" }}</div>
|
|
<right-toolbar @queryTable="loadData" :search="false">
|
|
</right-toolbar>
|
|
</template>
|
|
<div style="margin-top:12px;" v-if="form.totalInv">
|
|
<el-form ref="form" label-width="160px">
|
|
<el-form-item label="总投资" class="w400">
|
|
<el-input-number :precision="4" v-model="form.totalInv.money" placeholder="请输入总投资">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
<div class="div-title fblue" style="color: #409eff;">年度投资</div>
|
|
<costYear ref="costYear" @success="doAddYearSuccess">
|
|
|
|
</costYear>
|
|
|
|
<div class="div-title fblue" style="color: #409eff;border-bottom: solid 1px #409eff;line-height: 40px;">合同金额</div>
|
|
<el-row style="margin-top:12px;">
|
|
<el-col :span="8">
|
|
<el-form-item label="合同金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.contract1.money" placeholder="请输入合同金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="合同支付金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.contract2.money" placeholder="请输入合同支付金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="合同挂账金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.contract3.money" placeholder="请输入合同挂账金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<div class="div-title fblue" style="color: #409eff;border-bottom: solid 1px #409eff;line-height: 40px;">安措费</div>
|
|
<el-row style="margin-top:12px;">
|
|
<el-col :span="8">
|
|
<el-form-item label="安措费金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.safety1.money" placeholder="请输入安措费金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="安措支付金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.safety2.money" placeholder="请输入安措支付金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="安措挂账金额" class="w200">
|
|
<el-input-number :precision="4" v-model="form.safety3.money" placeholder="请输入安措挂账金额">
|
|
</el-input-number>
|
|
<span class="sp-unit">万元</span>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<div class="div-title fblue" style="color: #409eff;">月度产值</div>
|
|
<costMonth ref="costMonth" @success="doAddYearSuccess"></costMonth>
|
|
</el-form>
|
|
<div style="text-align: center;margin-top: 24px;">
|
|
<el-button type="success" @click="doSave">保存</el-button>
|
|
</div>
|
|
</div>
|
|
|
|
</el-drawer>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { listByProjectId,batchUpdate } from "@/api/project/costOutput.js";
|
|
import costYear from './costYear.vue'
|
|
import costMonth from './costMonth.vue'
|
|
export default {
|
|
components: {
|
|
costYear,costMonth
|
|
},
|
|
data() {
|
|
return {
|
|
title:'',
|
|
isOpen: false,
|
|
prj: null,
|
|
form:{
|
|
totalInv:null,//总投资
|
|
contract1:null,//合同金额
|
|
contract2:null,//合同支付金额
|
|
contract3:null,//合同挂账金额
|
|
safety1:null,//安措金额
|
|
safety2:null,//安措支付金额
|
|
safety3:null,//安措挂账金额
|
|
|
|
},
|
|
yearInv:[],//年度投资
|
|
monthInv:[],//月度产值
|
|
oldData:[]
|
|
};
|
|
},
|
|
|
|
mounted() { },
|
|
|
|
methods: {
|
|
doSave(){
|
|
let objs=this.oldData.map(it=>{
|
|
let obj={...it};
|
|
obj.money=obj.money?obj.money*10000:0;
|
|
return obj;
|
|
});
|
|
batchUpdate(objs).then(d=>{
|
|
if(d.code!=200){
|
|
this.loadData();
|
|
}else{
|
|
this.$modal.msgSuccess("保存成功");
|
|
}
|
|
});
|
|
},
|
|
doAddYearSuccess(){
|
|
this.loadData();
|
|
},
|
|
resetData(tmps){
|
|
if(this.oldData.length==0){
|
|
return;
|
|
}
|
|
tmps.forEach(it=>{
|
|
let objs=this.oldData.filter(d=>d.id==it.id);
|
|
if(objs.length>0){
|
|
it.money=objs[0].money;
|
|
}
|
|
});
|
|
|
|
},
|
|
loadData(init) {
|
|
listByProjectId(this.prj.id).then((d) => {
|
|
let tmps=(d.data||[]).map(it=>{
|
|
it.money=it.money?it.money/10000.0:0;
|
|
return it;
|
|
});
|
|
this.resetData(tmps);
|
|
this.oldData=tmps;
|
|
this.form.totalInv=this.getValue(tmps,1);
|
|
this.yearInv=tmps.filter(it=>it.costType==2);
|
|
this.form.contract1=this.getValue(tmps,3);
|
|
this.form.contract2=this.getValue(tmps,4);
|
|
this.form.contract3=this.getValue(tmps,5);
|
|
this.form.safety1=this.getValue(tmps,6);
|
|
this.form.safety2=this.getValue(tmps,7);
|
|
this.form.safety3=this.getValue(tmps,8);
|
|
let objs=tmps.filter(it=>it.costType==9);
|
|
let obj={};
|
|
this.monthInv=[];
|
|
objs.forEach(it=>{
|
|
if(!obj[it.year]){
|
|
obj[it.year]=[];
|
|
}
|
|
obj[it.year].push(it);
|
|
});
|
|
for(let k in obj){
|
|
this.monthInv.push({
|
|
year:k,
|
|
value:obj[k]
|
|
})
|
|
}
|
|
setTimeout(()=>{
|
|
this.$refs.costYear.init(this.yearInv,this.prj);
|
|
this.$refs.costMonth.init(this.monthInv,this.prj);
|
|
},400)
|
|
});
|
|
},
|
|
getValue(tmps,type){
|
|
let objs=tmps.filter(d=>d.costType==type);
|
|
return objs.length>0?objs[0]:{};
|
|
},
|
|
show(prj) {
|
|
this.prj = prj;
|
|
this.title = prj.projectName;
|
|
this.isOpen = true;
|
|
this.loadData(true);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.project-cost-outpu-drawer {
|
|
::v-deep .el-drawer {
|
|
min-width: 1400px;
|
|
}
|
|
|
|
::v-deep .el-drawer__header {
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
::v-deep .el-drawer__body {
|
|
padding: 0px 24px;
|
|
.el-popover__reference-wrapper{
|
|
position: absolute;
|
|
right: 0px;
|
|
z-index: 999;
|
|
}
|
|
.el-form {
|
|
overflow: hidden;
|
|
|
|
.el-form-item {
|
|
margin-bottom: 8px !important;
|
|
&.w400{
|
|
.el-input-number{
|
|
width:400px;
|
|
}
|
|
}
|
|
.el-input-number{
|
|
.el-input-number__decrease{
|
|
display: none;
|
|
}
|
|
.el-input-number__increase{
|
|
display: none;
|
|
}
|
|
.el-input__inner{
|
|
padding: 0px 12px;
|
|
text-align: right;
|
|
}
|
|
}
|
|
.sp-unit{
|
|
margin-left:12px;
|
|
}
|
|
}
|
|
.div-title{
|
|
|
|
}
|
|
}
|
|
|
|
.lvl-3 {
|
|
.lbl-title {
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|