135 lines
4.7 KiB
Vue
135 lines
4.7 KiB
Vue
<template>
|
|
<div class="project-quarterly-assess-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">
|
|
<template slot="left" v-if="years.length>0">
|
|
<el-popover placement="top" v-model="showPop2">
|
|
<p>选择年份</p>
|
|
<div style="margin-bottom: 12px;">
|
|
<el-date-picker v-model="selYear" type="year" placeholder="选择年" >
|
|
</el-date-picker>
|
|
</div>
|
|
<div style="text-align: right; margin: 0">
|
|
<el-button size="mini" type="text" @click="showPop2 = false">取消</el-button>
|
|
<el-button type="primary" size="mini" @click="doAddYear">确定</el-button>
|
|
</div>
|
|
<el-button slot="reference" size="mini" type="success" style="margin-right: 12px;" round>增加年份</el-button>
|
|
</el-popover>
|
|
</template>
|
|
</right-toolbar>
|
|
</template>
|
|
<no-data v-if="years.length==0">
|
|
<el-popover placement="top" v-model="showPop">
|
|
<p>选择年份</p>
|
|
<div style="margin-bottom: 12px;">
|
|
<el-date-picker v-model="selYear" type="year" placeholder="选择年">
|
|
</el-date-picker>
|
|
</div>
|
|
<div style="text-align: right; margin: 0">
|
|
<el-button size="mini" type="text" @click="showPop = false">取消</el-button>
|
|
<el-button type="primary" size="mini" @click="doAddYear">确定</el-button>
|
|
</div>
|
|
<el-button slot="reference" style="margin-top:24px;">增加年份</el-button>
|
|
</el-popover>
|
|
</no-data>
|
|
<div v-else :key="activeName">
|
|
<el-tabs v-model="activeName" >
|
|
<el-tab-pane :label="''+it.year" :name="''+it.year" :key="idx" v-for="(it,idx) in years" >
|
|
<assess-item :datas="it.datas"></assess-item>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</div>
|
|
</el-drawer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import AssessItem from './assessItem.vue'
|
|
export default {
|
|
name: 'RuoyiUiProjectquarterlyAssessDrawer',
|
|
components:{
|
|
AssessItem
|
|
},
|
|
data() {
|
|
return {
|
|
isOpen: false,
|
|
showPop: false,
|
|
showPop2: false,
|
|
prj: null,
|
|
selYear: new Date(),
|
|
years: [],
|
|
activeName:''+new Date().getFullYear()
|
|
};
|
|
},
|
|
mounted() {
|
|
|
|
},
|
|
methods: {
|
|
|
|
checkDate(a,b,it){
|
|
return true
|
|
},
|
|
doAddYear() {
|
|
this.showPop = false;
|
|
this.showPop2=false;
|
|
let postData = {
|
|
year: this.selYear.getFullYear(),
|
|
projectId: this.prj.id
|
|
}
|
|
this.$api.projectAsscess.addYear(postData).then(d => {
|
|
this.loadData();
|
|
})
|
|
},
|
|
loadData() {
|
|
this.$api.projectAsscess.listAssess({ projectId: this.prj.id }).then(d => {
|
|
let years = [];
|
|
d.rows.map(it => {
|
|
let tmps = years.filter(item => item.year == it.year);
|
|
if (tmps.length == 0) {
|
|
years.push({
|
|
year: it.year,
|
|
datas: [it]
|
|
})
|
|
} else {
|
|
tmps[0].datas.push(it);
|
|
}
|
|
})
|
|
this.years = years;
|
|
})
|
|
},
|
|
show(prj) {
|
|
this.prj = prj;
|
|
this.title = prj.projectName;
|
|
this.isOpen = true;
|
|
this.showPop=false;
|
|
this.showPop2=false;
|
|
this.activeName=''+new Date().getFullYear();
|
|
this.selYear=new Date();
|
|
this.loadData();
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.project-quarterly-assess-drawer {
|
|
::v-deep .el-drawer{
|
|
min-width: 800px;
|
|
}
|
|
::v-deep .el-drawer__header{
|
|
margin-bottom: 0px;
|
|
}
|
|
::v-deep .el-drawer__body{
|
|
padding:0px 24px;
|
|
.el-collapse-item__header{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
}
|
|
.el-collapse-item__content{
|
|
padding-bottom:0px;
|
|
}
|
|
}
|
|
}
|
|
</style> |