|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
- <div :class="showDatePicker || showSelect? 'homeMobeilMask': ''">
|
|
|
- </div>
|
|
|
+ <!-- <div :class="showDatePicker || showSelect? 'homeMobeilMask': ''">
|
|
|
+ </div> -->
|
|
|
<div class="reportConpanyPage">
|
|
|
<van-nav-bar title="单位考评报告" />
|
|
|
<div class="mobeilVant">
|
|
@@ -18,39 +18,64 @@
|
|
|
</div>
|
|
|
<div class="reportConpanyMain">
|
|
|
<div class="mainSeach">
|
|
|
- <div class="rankingList">
|
|
|
- <span>{{showDate}}年度</span>
|
|
|
- <img :src="dateImg" @click="changePickerDate" alt="">
|
|
|
- </div>
|
|
|
- <div class="sectionModel">
|
|
|
- <span @click="changeSelect">{{binSectionName}}板块</span>
|
|
|
- </div>
|
|
|
- <div class="mainSeachImg">
|
|
|
- <img :src="sortImg" alt="">
|
|
|
- <img :src="seachImg" alt="" @click="getReportData(binSection, showDate)">
|
|
|
+ <div class="seachFrom" @click="showPopup">
|
|
|
+ <span>搜索栏</span>
|
|
|
</div>
|
|
|
+ <van-popup v-model:show="showVanPopup" position="top">
|
|
|
+ <div class="vanForm">
|
|
|
+ <van-form>
|
|
|
+ <van-field
|
|
|
+ v-model="form.company"
|
|
|
+ label="单位名称"
|
|
|
+ placeholder="单位名称"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ v-model="form.binSection"
|
|
|
+ is-link
|
|
|
+ readonly
|
|
|
+ label="选择板块"
|
|
|
+ placeholder="点击选择板块"
|
|
|
+ @click="showSelect = true"
|
|
|
+ />
|
|
|
+ <van-popup v-model:show="showSelect" position="bottom">
|
|
|
+ <van-picker
|
|
|
+ :columns="columnSection"
|
|
|
+ @confirm="selectConfirm"
|
|
|
+ @cancel="showSelect = false"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
+ <van-field
|
|
|
+ v-model="form.year"
|
|
|
+ is-link
|
|
|
+ readonly
|
|
|
+ name="datePicker"
|
|
|
+ label="时间选择"
|
|
|
+ placeholder="点击选择年度与季度"
|
|
|
+ @click="showDatePicker = true"
|
|
|
+ />
|
|
|
+ <van-popup v-model:show="showDatePicker" position="bottom">
|
|
|
+ <van-date-picker
|
|
|
+ title="年度/季度"
|
|
|
+ :columns-type="['year', 'month']"
|
|
|
+ :filter="filterPicker"
|
|
|
+ @confirm="confirmFn"
|
|
|
+ @cancel="cancelpickerFn"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
+ <div style="margin: 16px;">
|
|
|
+ <van-button round block type="primary" native-type="submit">
|
|
|
+ 提交
|
|
|
+ </van-button>
|
|
|
+ </div>
|
|
|
+ </van-form>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
</div>
|
|
|
- <van-date-picker
|
|
|
- v-model="currentDate"
|
|
|
- title="选择年季"
|
|
|
- :columns-type="['year', 'month']"
|
|
|
- :filter="filterPicker"
|
|
|
- @confirm="confirmFn"
|
|
|
- @cancel="cancelpickerFn"
|
|
|
- v-if="showDatePicker"
|
|
|
- />
|
|
|
- <van-picker
|
|
|
- title="选择板块"
|
|
|
- :columns="columnSection"
|
|
|
- @confirm="selectConfirm"
|
|
|
- @cancel="cancelSelect"
|
|
|
- v-if="showSelect"
|
|
|
- />
|
|
|
<div class="mainModel">
|
|
|
<el-table :data="mobeilReportData" style="width: 100%">
|
|
|
<el-table-column type="index" label="序号" align="center"></el-table-column>
|
|
|
<el-table-column label="报告名称" prop="evaluateReportName" width="330" />
|
|
|
- <el-table-column label="业务属性" prop="binSectionName" />
|
|
|
+ <el-table-column label="业务属性" prop="binSectionName" width="150" />
|
|
|
<el-table-column label="考评周期">
|
|
|
<template #default="scope">
|
|
|
<span v-if="scope.row.checkCycle === 'YDKP'" style="font-size: 12px;">月度考评</span>
|
|
@@ -60,7 +85,7 @@
|
|
|
</el-table-column>
|
|
|
<el-table-column label="年度" prop="year" />
|
|
|
<el-table-column label="月度/季度" prop="month" align="center" />
|
|
|
- <el-table-column label="业务简述" prop="des" />
|
|
|
+ <el-table-column label="业务简述" prop="des" width="200" />
|
|
|
</el-table>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -95,17 +120,21 @@ export default {
|
|
|
cenImg: cenImg,
|
|
|
showDatePicker: false,
|
|
|
showSelect: false,
|
|
|
- currentDate: [],
|
|
|
- showDate: '',
|
|
|
+ showVanPopup: false,
|
|
|
+ form: {
|
|
|
+ company: '',
|
|
|
+ binSection: '',
|
|
|
+ year: '',
|
|
|
+ season: ''
|
|
|
+ },
|
|
|
binSection: 'HD',
|
|
|
- binSectionName: '火电',
|
|
|
mobeilReportData: [],
|
|
|
- columnSection: []
|
|
|
+ columnSection: [],
|
|
|
+ datePickerData: []
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
- this.showDate = new Date().getFullYear()-1
|
|
|
- this.getReportData(this.binSection, this.showDate)
|
|
|
+ this.getReportData()
|
|
|
this.columnSection = [
|
|
|
{ text: '火电', value: 'HD' },
|
|
|
{ text: '水电', value: 'SD' },
|
|
@@ -117,7 +146,7 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取考评报告数据
|
|
|
- getReportData(name, year) {
|
|
|
+ getReportData() {
|
|
|
let that = this
|
|
|
that.mobeilReportData = []
|
|
|
let params = {
|
|
@@ -134,6 +163,9 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ showPopup() {
|
|
|
+ this.showVanPopup = true
|
|
|
+ },
|
|
|
filterPicker(type, options) {
|
|
|
if (type === 'month') {
|
|
|
return options.filter((option) => Number(option.value) < 5);
|
|
@@ -143,28 +175,28 @@ export default {
|
|
|
chooseMenu() {
|
|
|
this.$router.push({ path: "/menu"})
|
|
|
},
|
|
|
- changePickerDate() {
|
|
|
- this.showDatePicker = true
|
|
|
- },
|
|
|
changeSelect() {
|
|
|
this.showSelect = true
|
|
|
},
|
|
|
confirmFn(val) {
|
|
|
- this.showDate = val.selectedValues[0]
|
|
|
+ debugger
|
|
|
+ this.form.year = val.selectedValues[0]+'年'+val.selectedValues[1]+'季度'
|
|
|
+ this.datePickerData = val.selectedValues
|
|
|
this.cancelpickerFn()
|
|
|
},
|
|
|
selectConfirm(val) {
|
|
|
+ this.form.binSection = val.selectedValues[0]
|
|
|
this.binSection = val.selectedValues[0]
|
|
|
if (this.binSection === 'HD') {
|
|
|
- this.binSectionName = '火电'
|
|
|
+ this.form.binSection = '火电'
|
|
|
} else if (this.binSection === 'SD') {
|
|
|
- this.binSectionName = '水电'
|
|
|
+ this.form.binSection = '水电'
|
|
|
} else if (this.binSection === 'XNYFG') {
|
|
|
- this.binSectionName = '新能源'
|
|
|
+ this.form.binSection = '新能源'
|
|
|
} else if (this.binSection === 'GJYW') {
|
|
|
- this.binSectionName = '海外业务'
|
|
|
+ this.form.binSection = '海外业务'
|
|
|
} else if (this.binSection === 'MDYTH') {
|
|
|
- this.binSectionName = '煤电一体化'
|
|
|
+ this.form.binSection = '煤电一体化'
|
|
|
}
|
|
|
this.cancelSelect()
|
|
|
},
|
|
@@ -258,69 +290,23 @@ export default {
|
|
|
.mainSeach{
|
|
|
display: flex;
|
|
|
// justify-content: space-between;
|
|
|
- .rankingList{
|
|
|
- width: 37%;
|
|
|
+ .seachFrom{
|
|
|
+ width: 100%;
|
|
|
height: 40px;
|
|
|
background: #184FB4;
|
|
|
border-radius: 5px;
|
|
|
margin-bottom: 15px;
|
|
|
- margin-right: 10px;
|
|
|
+ text-align: center;
|
|
|
span{
|
|
|
display: inline-block;
|
|
|
- width: 85%;
|
|
|
- font-family: MicrosoftYaHei;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 16px;
|
|
|
color: #fff;
|
|
|
- margin-right: 5px;
|
|
|
- position: relative;
|
|
|
- left: 20px;
|
|
|
- top: 10px;
|
|
|
- }
|
|
|
- img{
|
|
|
- width: 22px;
|
|
|
- height: 18px;
|
|
|
- position: relative;
|
|
|
- top: -10px;
|
|
|
- left: 90px;
|
|
|
- }
|
|
|
- }
|
|
|
- .sectionModel{
|
|
|
- width: 37%;
|
|
|
- height: 40px;
|
|
|
- background: #838DAB;
|
|
|
- border-radius: 5px;
|
|
|
- margin-bottom: 15px;
|
|
|
- margin-right: 15px;
|
|
|
- span{
|
|
|
- display: inline-block;
|
|
|
- width: 100%;
|
|
|
line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
}
|
|
|
}
|
|
|
- .mainSeachImg{
|
|
|
- width: 17%;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- position: relative;
|
|
|
- top: 10px;
|
|
|
- img:nth-child(1){
|
|
|
- width: 25px;
|
|
|
- height: 15px;
|
|
|
- position: relative;
|
|
|
- top: 2px;
|
|
|
- }
|
|
|
- img:nth-child(2){
|
|
|
- width: 22px;
|
|
|
- height: 22px;
|
|
|
- }
|
|
|
+ .vanForm{
|
|
|
+ margin-top: 60px;
|
|
|
}
|
|
|
}
|
|
|
- .van-picker{
|
|
|
- z-index: 222222
|
|
|
- }
|
|
|
.mainModel{
|
|
|
background: #fff;
|
|
|
border-radius: 5px;
|