210 lines
7.9 KiB
Vue
210 lines
7.9 KiB
Vue
<template>
|
|
<div class="project-committee-drawer">
|
|
<el-drawer v-if="isOpen" :visible.sync="isOpen" direction="rtl" size="40%" style="padding-left: 20px">
|
|
<template slot="title">
|
|
<div>工委会管理</div>
|
|
</template>
|
|
<el-form ref="form" label-width="120px">
|
|
<el-tabs type="card" v-model="activeName" @tab-click="handleClick">
|
|
<el-tab-pane v-for="(dict, idx) in dict.type.project_working_type" :key="dict.value"
|
|
:label="dict.label" :name="'' + dict.value">
|
|
<el-row v-for="(dataItem, index) in datas[idx]" :key="idx + '-' + index">
|
|
<el-col :span="4">
|
|
<el-form-item :label="dataItem.committeeName"></el-form-item>
|
|
</el-col>
|
|
<el-col :span="10">
|
|
<el-form-item label="成本名称">
|
|
<el-input v-model="dataItem.costName" placeholder="请输成本名称" maxlength="200" :class="checkRow(dataItem,1)"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="10">
|
|
<el-form-item label="申报金额">
|
|
<el-input v-model="dataItem.money" placeholder="请输申报金额" :class="checkRow(dataItem,2)"
|
|
@blur="v => formatAmount(dataItem)" maxlength="200">
|
|
<template slot="append">万元</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
|
|
</el-form>
|
|
<div class="dialog-footer" style="text-align: center;">
|
|
<el-button type="primary" @click="submitForm">保存</el-button>
|
|
<el-button @click="doCancel">取 消</el-button>
|
|
</div>
|
|
</el-drawer>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { listProjectCommittee, getProjectCommittee, delProjectCommittee, addProjectCommittee, updateProjectCommittee,addProjectCommitteeList } from "@/api/project/projectCommittee";
|
|
import { listCommittee, getCommittee, delCommittee, addCommittee, updateCommittee } from "@/api/base/committee";
|
|
import axios from 'axios'
|
|
export default {
|
|
|
|
dicts: ['project_working_type'],
|
|
data() {
|
|
return {
|
|
isOpen: false,
|
|
projectId: 0,
|
|
prjInfo: null,
|
|
activeName: '1',
|
|
datas: [],
|
|
}
|
|
},
|
|
methods: {
|
|
checkRow(datas,type){
|
|
let costName=(datas.costName||"").trim();
|
|
let money=((datas.money||"")+"").trim();
|
|
let tmp=costName+money;
|
|
return (tmp.length>0 && (costName.length==0 || money.length==0) && (type==1?costName.length==0:money.length==0)) ?"is-error":"";
|
|
},
|
|
submitForm(){
|
|
let dicts=this.dict.type.project_working_type
|
|
let tmps=dicts.filter(d=>d.value==this.activeName);
|
|
if(tmps.length==0){ return;}
|
|
let tmp=tmps[0];
|
|
let idx=dicts.indexOf(tmp);
|
|
if(idx==-1){return;}
|
|
if(!this.checkDatas(idx)){
|
|
this.$modal.msgError("请输入数据!");
|
|
return;
|
|
}
|
|
for(let i=0;i<dicts.length;i++){
|
|
if(i!=idx){
|
|
if(!this.checkDatas(i)){
|
|
this.activeName=dicts[i].value;
|
|
this.$modal.msgError("请输入数据!");
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
let postData=[];
|
|
this.datas.forEach(it=>{
|
|
it.forEach(item=>{
|
|
item.money*=1;
|
|
item.applicationDate=this.$dt(item.committeeName)
|
|
postData.push(item);
|
|
})
|
|
});
|
|
addProjectCommitteeList(postData).then(d=>{
|
|
if(d.code==200){
|
|
this.$modal.msgSuccess("保存成功!");
|
|
this.loadData();
|
|
}else{
|
|
this.$modal.msgError("保存失败！!");
|
|
}
|
|
});
|
|
},
|
|
checkDatas(idx){
|
|
let tmps=this.datas[idx];
|
|
let isPass=true;
|
|
tmps.forEach(d=>{
|
|
let data1=d.costName||"";
|
|
let data2=d.money||""+"";
|
|
let data3=data1+data2;
|
|
if(data3.length>0 && (data1.length==0 || data2.length==0)){
|
|
isPass=false;
|
|
}
|
|
});
|
|
return isPass;
|
|
},
|
|
doCancel(){
|
|
this.isOpen=false;
|
|
},
|
|
formatAmount(it) {
|
|
let value=it.money;
|
|
// 使用正则表达式来格式化金额输入
|
|
it.money = value.replace(/[^\d.]/g, '') // 清除非数字和点
|
|
.replace(/\.{2,}/g, '.') // 只保留第一个点
|
|
.replace(/^(\d+)\./g, '$1.') // 保证第一个数字前有一个点
|
|
.replace('.', '$#$')
|
|
.replace(/\./g, '')
|
|
.replace('$#$', '.')
|
|
.replace(/^(\d+)$/, '$1.00') // 保证输入为一个整数时，末尾有两个零
|
|
.replace(/^0+([1-9])/, '$1') // 保证输入的金额不以零开头
|
|
.replace(/^(\d+\.\d{2})./, '$1'); // 保留两位小数
|
|
},
|
|
handleClick(tab, event) {
|
|
},
|
|
show(row) {
|
|
this.prjInfo = row;
|
|
this.isOpen = true;
|
|
this.activeName=this.dict.type.project_working_type.length>0?this.dict.type.project_working_type[0].value:"";
|
|
this.loadData();
|
|
},
|
|
loadData() {
|
|
let ajaxs = [
|
|
listProjectCommittee({ projectId: this.prjInfo.id, pageNum: 1, pageSize: 1000 }),
|
|
listCommittee({ pageNum: 1, pageSize: 1000 })
|
|
]
|
|
axios.all(ajaxs).then(res => {
|
|
this.makeData(res[0].rows || [], res[1].rows || []);
|
|
});
|
|
},
|
|
makeData(data, commits) {
|
|
let list = [];
|
|
this.dict.type.project_working_type.forEach(dic => {
|
|
let tmps = [];
|
|
commits.forEach(c => {
|
|
var find = data.filter(d => d.committeeId == c.id && d.workingType == dic.value);
|
|
if (find.length > 0) {
|
|
let f = find[0]
|
|
f.committeeName = c.name,
|
|
tmps.push(f);
|
|
} else {
|
|
tmps.push({
|
|
committeeId: c.id,
|
|
committeeName: c.name,
|
|
projectId: this.prjInfo.id,
|
|
workingType: dic.value,
|
|
costName: '',
|
|
money: null
|
|
})
|
|
}
|
|
});
|
|
list.push(tmps);
|
|
})
|
|
this.datas = list;
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss">
|
|
.project-committee-drawer {
|
|
.el-drawer__header {
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.el-drawer__body {
|
|
padding: 12px 24px 60px;
|
|
position: relative;
|
|
.el-row{
|
|
.el-input.is-error{
|
|
.el-input__inner{
|
|
border:solid 1px red;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.dialog-footer{
|
|
position: fixed;
|
|
bottom: 0px;
|
|
line-height: 60px;
|
|
background: #fff;
|
|
width: 100%;
|
|
text-align: left !important;
|
|
box-shadow: 0 8px 10px -5px rgba(0,0,0,.2), 0 16px 24px 2px rgba(0,0,0,.14), 0 6px 30px 5px rgba(0,0,0,.12);
|
|
margin-left: -24px;
|
|
padding-left: 20%;
|
|
}
|
|
.el-drawer {
|
|
min-width: 800px;
|
|
}
|
|
|
|
}
|
|
</style> |