|
@@ -1,6 +1,4 @@
|
|
|
<template>
|
|
|
- <!-- <div :class="showDatePicker || showSelect? 'homeMobeilMask': ''">
|
|
|
- </div> -->
|
|
|
<div class="reportConpanyPage">
|
|
|
<van-nav-bar title="单位考评报告" />
|
|
|
<div class="mobeilVant">
|
|
@@ -30,63 +28,83 @@
|
|
|
placeholder="单位名称"
|
|
|
/>
|
|
|
<van-field
|
|
|
+ v-model="form.checkCycle"
|
|
|
+ is-link
|
|
|
+ readonly
|
|
|
+ label="考评周期"
|
|
|
+ placeholder="点击考评周期"
|
|
|
+ @click="showcheckCycle = true"
|
|
|
+ />
|
|
|
+ <van-popup v-model:show="showcheckCycle" position="bottom">
|
|
|
+ <van-picker
|
|
|
+ :columns="checkCycleSection"
|
|
|
+ @confirm="selectcheckCycle"
|
|
|
+ @cancel="showcheckCycle = false"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
+ <van-field
|
|
|
v-model="form.binSection"
|
|
|
is-link
|
|
|
readonly
|
|
|
- label="选择板块"
|
|
|
- placeholder="点击选择板块"
|
|
|
+ label="业务属性"
|
|
|
+ placeholder="点击业务属性"
|
|
|
@click="showSelect = true"
|
|
|
/>
|
|
|
<van-popup v-model:show="showSelect" position="bottom">
|
|
|
<van-picker
|
|
|
:columns="columnSection"
|
|
|
+ :columns-field-names="{
|
|
|
+ text: 'sectionName',
|
|
|
+ value: 'id'
|
|
|
+ }"
|
|
|
@confirm="selectConfirm"
|
|
|
@cancel="showSelect = false"
|
|
|
/>
|
|
|
</van-popup>
|
|
|
<van-field
|
|
|
- v-model="form.year"
|
|
|
+ v-model="form.time"
|
|
|
is-link
|
|
|
readonly
|
|
|
name="datePicker"
|
|
|
label="时间选择"
|
|
|
- placeholder="点击选择年度与季度"
|
|
|
+ placeholder="点击选择时间"
|
|
|
@click="showDatePicker = true"
|
|
|
/>
|
|
|
<van-popup v-model:show="showDatePicker" position="bottom">
|
|
|
<van-date-picker
|
|
|
- title="年度/季度"
|
|
|
+ v-model="datePickerData"
|
|
|
: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 style="margin: 16px;display: flex;justify-content: space-between;">
|
|
|
+ <div class="seachBtnFrom" @click="seachmobeilReportData">
|
|
|
+ <span>搜索</span>
|
|
|
+ </div>
|
|
|
+ <div class="restBtnFrom" @click="restSeach">
|
|
|
+ <span>重置</span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</van-form>
|
|
|
</div>
|
|
|
</van-popup>
|
|
|
</div>
|
|
|
<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" width="150" />
|
|
|
- <el-table-column label="考评周期">
|
|
|
- <template #default="scope">
|
|
|
- <span v-if="scope.row.checkCycle === 'YDKP'" style="font-size: 12px;">月度考评</span>
|
|
|
- <span v-else-if="scope.row.checkCycle === 'JDKP'" style="font-size: 12px;">季度考评</span>
|
|
|
- <span v-else style="font-size: 12px;">年度考评</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="年度" prop="year" />
|
|
|
- <el-table-column label="月度/季度" prop="month" align="center" />
|
|
|
- <el-table-column label="业务简述" prop="des" width="200" />
|
|
|
- </el-table>
|
|
|
+ <el-table :data="mobeilReportData" style="width: 100%" @row-click="rowDetail">
|
|
|
+ <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" width="150" />
|
|
|
+ <el-table-column label="考评周期">
|
|
|
+ <template #default="scope">
|
|
|
+ <span v-if="scope.row.checkCycle === 'YDKP'" style="font-size: 12px;">月度考评</span>
|
|
|
+ <span v-else-if="scope.row.checkCycle === 'JDKP'" style="font-size: 12px;">季度考评</span>
|
|
|
+ <span v-else style="font-size: 12px;">年度考评</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="年度" prop="year" />
|
|
|
+ <el-table-column label="月度/季度" prop="month" align="center" />
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -99,14 +117,11 @@ import daohangImg from '../assets/mobeilImg/daohang.png'
|
|
|
import dateImg from '../assets/mobeilImg/date.png'
|
|
|
import sortImg from '../assets/mobeilImg/sort.png'
|
|
|
import seachImg from '../assets/mobeilImg/seach.png'
|
|
|
-import cup1 from '../assets/getwayImg/cup1.png'
|
|
|
-import cup2 from '../assets/getwayImg/cup2.png'
|
|
|
-import cup3 from '../assets/getwayImg/cup3.png'
|
|
|
import topImg from '../assets/getwayImg/topNew.png'
|
|
|
import botImg from '../assets/getwayImg/botNew.png'
|
|
|
import cenImg from '../assets/getwayImg/cenNew.png'
|
|
|
|
|
|
-import {apiGetEvalReportList} from '../api/api'
|
|
|
+import {apiGetEvalReportList, apiGetbinsectionList} from '../api/api'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
@@ -120,42 +135,55 @@ export default {
|
|
|
cenImg: cenImg,
|
|
|
showDatePicker: false,
|
|
|
showSelect: false,
|
|
|
+ showcheckCycle: false,
|
|
|
showVanPopup: false,
|
|
|
form: {
|
|
|
company: '',
|
|
|
+ checkCycle: '',
|
|
|
binSection: '',
|
|
|
- year: '',
|
|
|
- season: ''
|
|
|
+ time: ''
|
|
|
},
|
|
|
- binSection: 'HD',
|
|
|
mobeilReportData: [],
|
|
|
columnSection: [],
|
|
|
+ checkCycleSection: [],
|
|
|
datePickerData: []
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.getReportData()
|
|
|
- this.columnSection = [
|
|
|
- { text: '火电', value: 'HD' },
|
|
|
- { text: '水电', value: 'SD' },
|
|
|
- { text: '新能源', value: 'XNYFG' },
|
|
|
- { text: '海外业务', value: 'GJYW' },
|
|
|
- { text: '煤电一体化', value: 'MDYTH' }
|
|
|
+ this.getBinSectionData()
|
|
|
+ this.datePickerData = [new Date().getFullYear(), new Date().getMonth()]
|
|
|
+ this.checkCycleSection = [
|
|
|
+ { text: '月度考评', value: 'YDKP' },
|
|
|
+ { text: '季度考评', value: 'JDKP' },
|
|
|
+ { text: '年度考评', value: 'NDKP' }
|
|
|
]
|
|
|
-
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取考评报告数据
|
|
|
getReportData() {
|
|
|
let that = this
|
|
|
that.mobeilReportData = []
|
|
|
+ let binSectionStr = ''
|
|
|
+ let checkCycleStr = ''
|
|
|
+ that.columnSection.forEach(it =>{
|
|
|
+ if (it.sectionName === that.form.binSection) {
|
|
|
+ binSectionStr = it.id
|
|
|
+ }
|
|
|
+ })
|
|
|
+ that.checkCycleSection.forEach(it =>{
|
|
|
+ if (it.text === that.form.checkCycle) {
|
|
|
+ checkCycleStr = it.value
|
|
|
+ }
|
|
|
+ })
|
|
|
let params = {
|
|
|
pageNum: 1,
|
|
|
pageSize: 500,
|
|
|
- binSection: '',
|
|
|
- checkCycle: '',
|
|
|
- year: '',
|
|
|
- month: ''
|
|
|
+ evaluateReportName: that.form.company,
|
|
|
+ binSection: binSectionStr,
|
|
|
+ checkCycle: checkCycleStr,
|
|
|
+ year: that.datePickerData[0],
|
|
|
+ month: that.datePickerData[1]
|
|
|
}
|
|
|
apiGetEvalReportList(params).then(datas =>{
|
|
|
if (datas && datas.data) {
|
|
@@ -163,63 +191,57 @@ export default {
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- showPopup() {
|
|
|
- this.showVanPopup = true
|
|
|
+ getBinSectionData() {
|
|
|
+ let that = this
|
|
|
+ apiGetbinsectionList().then(datas =>{
|
|
|
+ if (datas && datas.data) {
|
|
|
+ that.columnSection = datas.data
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- filterPicker(type, options) {
|
|
|
- if (type === 'month') {
|
|
|
- return options.filter((option) => Number(option.value) < 5);
|
|
|
+ rowDetail(row) {
|
|
|
+ let detailObj = JSON.stringify(row)
|
|
|
+ this.$router.push({ path: "/reportDetail", query: {row: detailObj}})
|
|
|
+ },
|
|
|
+ seachmobeilReportData() {
|
|
|
+ this.showVanPopup = false
|
|
|
+ this.getReportData()
|
|
|
+ },
|
|
|
+ restSeach() {
|
|
|
+ this.form = {
|
|
|
+ company: '',
|
|
|
+ checkCycle: '',
|
|
|
+ binSection: '',
|
|
|
+ time: ''
|
|
|
}
|
|
|
- return options;
|
|
|
+ },
|
|
|
+ showPopup() {
|
|
|
+ this.showVanPopup = true
|
|
|
},
|
|
|
chooseMenu() {
|
|
|
this.$router.push({ path: "/menu"})
|
|
|
},
|
|
|
- changeSelect() {
|
|
|
- this.showSelect = true
|
|
|
- },
|
|
|
confirmFn(val) {
|
|
|
- debugger
|
|
|
- this.form.year = val.selectedValues[0]+'年'+val.selectedValues[1]+'季度'
|
|
|
+ this.form.time = 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.form.binSection = '火电'
|
|
|
- } else if (this.binSection === 'SD') {
|
|
|
- this.form.binSection = '水电'
|
|
|
- } else if (this.binSection === 'XNYFG') {
|
|
|
- this.form.binSection = '新能源'
|
|
|
- } else if (this.binSection === 'GJYW') {
|
|
|
- this.form.binSection = '海外业务'
|
|
|
- } else if (this.binSection === 'MDYTH') {
|
|
|
- this.form.binSection = '煤电一体化'
|
|
|
- }
|
|
|
- this.cancelSelect()
|
|
|
+ selectConfirm({selectedOptions}) {
|
|
|
+ this.form.binSection = selectedOptions[0].sectionName
|
|
|
+ this.showSelect = false
|
|
|
+ },
|
|
|
+ selectcheckCycle({selectedOptions}) {
|
|
|
+ this.form.checkCycle = selectedOptions[0].text
|
|
|
+ this.showcheckCycle = false
|
|
|
},
|
|
|
cancelpickerFn() {
|
|
|
this.showDatePicker = false
|
|
|
},
|
|
|
- cancelSelect() {
|
|
|
- this.showSelect = false
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
-.homeMobeilMask{
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- background-color: rgba(0,0,0,0.5);
|
|
|
- z-index: 111;
|
|
|
-}
|
|
|
.reportConpanyPage {
|
|
|
background-color: #184FB4;
|
|
|
.van-nav-bar{
|
|
@@ -305,6 +327,32 @@ export default {
|
|
|
}
|
|
|
.vanForm{
|
|
|
margin-top: 60px;
|
|
|
+ .seachBtnFrom{
|
|
|
+ width: 65%;
|
|
|
+ height: 40px;
|
|
|
+ background: #184FB4;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ text-align: center;
|
|
|
+ span{
|
|
|
+ display: inline-block;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .restBtnFrom{
|
|
|
+ width: 30%;
|
|
|
+ height: 40px;
|
|
|
+ background: #838DAB;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ text-align: center;
|
|
|
+ span{
|
|
|
+ display: inline-block;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.mainModel{
|