<template>
<view :style="'padding-top:'+nvaHeight+'px;'">
<view class="navbox">
<uni-nav-bar color="#ffffff" rightWidth="150rpx" title="履职信息" @clickLeft="getBack" @clickRight="getChFn" :background-color="backgroundColor" :border="false" statusBar='true' fixed="true">
<block slot="left">
<view class="topl">
<image :src="backimg" ></image>
</view>
</block>
<block slot="right">
<view class="topr" v-if="checkPermi(['zxBonus:bonus:add'])">
<image :src="ccicoimg"></image>
<view>履职加分</view>
</view>
</block>
</uni-nav-bar>
<view class="plr12 mt18">
<view class="search flex0 mb24">
<image :src="searchimg"></image>
<input placeholder="输入委员姓名进行查询" v-model="title" @confirm="getConfirm"/>
</view>
</view>
<view class="tablists flexc mb20">
<block v-for="(ite,idx) in tabList" >
<view v-if="!ite.limit||ite.limit&&checkPermi([ite.limit])" @click="getTabFn(ite)" :class="{act:tabidx==ite.val}" :key="idx">{{ite.tit}}</view>
</block>
</view>
<view style="height: 56rpx;"></view>
<view class="lbtab flexc">
<image :src="lbicoimg" class="limg"></image>
<view class="lbtabs flexc">
<view class="lbtabp">
<picker range-key='label' :range="jblist" @change='bindDateChangea'>
<view :class="jbtxt?'':'f16 co80'">{{jbtxt || '选择界别'}}</view>
</picker>
<image :src="upimg" class="upimg"></image>
</view>
<view class="lbtabp" v-if="tabidx!='jfju'">
<picker range-key='label' :range="dplist" @change='bindDateChangeb'>
<view :class="dptxt?'':'f16 co80'">{{dptxt || '选择党派'}}</view>
</picker>
<image :src="upimg" class="upimg"></image>
</view>
<view class="lbtabp" @click="getReafFn" v-if="checkPermi(['member:info:assessmentScore'])">
<image :src="reashimg" class="reashimg"></image>
<view :class="dptxt?'':'f16 co80'">刷新排名</view>
</view>
</view>
</view>
</view>
<!-- 列表 -->
<view class="mbox">
<report-list :type="tabidx" :datalist="list" :wtdt="wtdt" :jcList="jcList" :khlxList='khlxList' :jflxList="jflxList" :dplist="dplist" :jblist='jblist' @getDetail="getDetail" @getTuiFn="getTuiFn"></report-list>
</view>
<view style="height: 100rpx;" v-if="checkPermi(['member:info:add'])&&tabidx=='lzxx'"></view>
<view class="fwbtns" @click="getAddFn" v-if="checkPermi(['member:info:add'])&&tabidx=='lzxx'">履职档案</view>
<!-- 弹窗 -->
<pop-up :type='ptype' @getClose="getClose"></pop-up>
</view>
</template>
<script>
import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
import {getInfojopList,getBonusListFn,getBonusDelFn,getInfojopDel,getinfoScoreFn} from "@/api/mine/report.js"
import popUp from "@/work/components/popup/popup.vue"
import reportList from "@/work/components/report/list.vue"
import {getDictionaryFn} from "@/api/mine/register.js"
export default{
components:{reportList,popUp},
data(){
return{
searchimg: require("@/work/static/images/search.png"),
ccicoimg:require("@/work/static/images/ccico.png"),
lbicoimg:require("@/work/static/images/lbico.png"),
backimg:require("@/work/static/images/back.png"),
upimg:require("@/work/static/images/up.png"),
reashimg:require("@/work/static/images/sxicon.png"),
backgroundColor:"#1D64E2",
tabidx:'lzxx',
tabList:[{tit:'履职信息',val:'lzxx',limit:'member:info:list'},{tit:'加分记录',val:'jfju',limit:'zxBonus:bonus:list'}
],
nvaHeight:44,
taztList:[{label:'是',value:'0'},{label:'否',value:'1'}],
talbidx:'',
datainfo:{
talb:'',
},
ptype:'',//弹窗类型
list:[],
pageSize: 10,
pageNum: 1,
reachflag: true,
wtdt:'',
jblist:[],
dplist:[],
jbtxt:'',
dptxt:"",
jbval:'',
dpval:'',
title:'',
jflxList:[],
khlxList:[],
jcList:[],
userId:this.$store.state.user.userId,
}
},
onUnload(){
uni.$off('lzrefreshlist')
},
onLoad(e) {
var that=this;
this.getDataFn()
this.init()
uni.$on('lzrefreshlist', (e) => {
console.log(23)
that.getrefreshData()
})
},
// 上拉触底加载更多触发事件
onReachBottom() {
if (this.reachflag) {
this.pageNum++
this.getDataFn()
}
},
mounted() {
this.getHeightFn()
},
methods:{
checkPermi, checkRole,
init(){
// 界别
getDictionaryFn('circles').then(res=>{
if(res.code==200&&res.data.length){
this.jblist = res.data.map(v => {
return {
label: v.dictLabel,
value:v.dictValue
}
})
}
})
// 党派
getDictionaryFn('political_parties').then(res=>{
if(res.code==200&&res.data.length){
this.dplist = res.data.map(v => {
return {
label: v.dictLabel,
value: v.dictValue
}
})
}
})
//界别
getDictionaryFn('circles').then(res=>{
if(res.code==200&&res.data.length){
this.jcList = res.data.map(v => {
return {
label: v.dictLabel,
value: v.dictValue
}
})
}
})
// 考核类型
getDictionaryFn('check_type').then(res=>{
if(res.code==200&&res.data.length){
this.khlxList = res.data.map(v => {
return {
label: v.dictLabel,
value: v.dictValue
}
})
}
})
// 加分类型
getDictionaryFn('bonus_type').then(res=>{
if(res.code==200&&res.data.length){
this.jflxList = res.data.map(v => {
return {
label: v.dictLabel,
value: v.dictValue
}
})
}
})
},
getReafFn(){
var that=this;
getinfoScoreFn().then(res=>{
if(res.code==200){
that.getrefreshData()
}
})
},
getHeightFn(){
var s=uni.getSystemInfoSync().statusBarHeight;
let query = uni.createSelectorQuery().in(this);
//需要给黄色区域设置一个id标识，在这里是demo
query.select('.navbox').boundingClientRect(data => {
this.nvaHeight =s? data.height:Number(data.height)-20//赋值，待会要用
}).exec();
},
getClose(){
this.ptype=""
},
getTabFn(ite){
this.tabidx=ite.val;
this.pageNum=1;
this.list=[],
this.reachflag=true;
this.getDataFn()
},
getBack(){
uni.navigateBack({
delta:1
})
},
bindDateChangea(e){
var val=e.detail.value;
this.jbtxt=this.jblist[val].label;
this.jbval=this.jblist[val].value;
this.getrefreshData()
},
bindDateChangeb(e){
var val=e.detail.value;
this.dptxt=this.dplist[val].label;
this.dpval=this.dplist[val].value;
this.getrefreshData()
},
getrefreshData(){
this.pageNum=1;
this.list=[];
this.reachflag=true;
this.getDataFn()
},
getConfirm(){
this.pageNum=1;
this.list=[];
this.reachflag=true;
this.getDataFn()
},
getChFn(){
if(checkPermi(['zxBonus:bonus:add'])){
this.$tab.navigateTo('/work/pages/report/addscore')
}
},
getTuiFn(ite){
var type=ite.type;
var that=this;
if(type=='del'){
uni.showModal({
title: '确认删除',
content: "是否确认删除",
cancelText: '取消',
confirmText: '确认',
success: function(res) {
if (res.confirm) {
if(that.tabidx=='jfju'){
getBonusDelFn(ite.id).then(res=>{
if(res.code==200){
that.$toast('删除成功'),
setTimeout(function(){
that.getrefreshData()
},1200)
}
})
}else if(that.tabidx=='lzxx'){
getInfojopDel(ite.id).then(res=>{
if(res.code==200){
that.$toast('删除成功'),
setTimeout(function(){
that.getrefreshData()
},1200)
}
})
}
} else if (res.cancel) {
}
}
});
}else if(type=='edit'){
if(this.tabidx=='jfju'){
this.$tab.navigateTo('/work/pages/report/addscore?type=edit&id='+ite.id)
}else if(this.tabidx=='lzxx'){
this.$tab.navigateTo('/work/pages/report/mineinfo?type=edit&id='+ite.id)
}
}
// this.ptype=ite.type
},
getAddFn(){
this.$tab.navigateTo('/work/pages/report/mineinfo?type=add')
},
getDetail(data){
this.$tab.navigateTo('/work/pages/report/details?id='+data)
},
getDataFn(){
var params={
pageSize:this.pageSize,
pageNum: this.pageNum,
}
params.boundary=this.jbval
params.partyAffiliation=this.dpval
if(this.title){
params.name=this.title
}
if(this.tabidx=='lzxx'){
if(checkPermi(['member:info:alllist'])){
}else {
params.userId=this.userId
}
getInfojopList(params).then(res=>{
if(res.code==200){
if (res.rows.length < this.pageSize) {
this.reachflag = false
this.wtdt = '到底了~';
} else {
var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1)
if (num < res.total) {
this.reachflag = true
this.wtdt = '上拉加载更多'
} else {
this.reachflag = false
this.wtdt = '到底了~';
}
}
if (this.pageNum == 1) {
this.list = res.rows;
} else {
this.list = this.list.concat(res.rows)
}
}else{
this.$toast(res.msg)
}
})
}else if(this.tabidx=='jfju'){
if(checkPermi(['zxBonus:bonus:alllist'])){
}else {
params.userId=this.userId
}
getBonusListFn(params).then(res=>{
if(res.code==200){
if (res.rows.length < this.pageSize) {
this.reachflag = false
this.wtdt = '到底了~';
} else {
var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1)
if (num < res.total) {
this.reachflag = true
this.wtdt = '上拉加载更多'
} else {
this.reachflag = false
this.wtdt = '到底了~';
}
}
if (this.pageNum == 1) {
this.list = res.rows;
} else {
this.list = this.list.concat(res.rows)
}
}else{
this.$toast(res.msg)
}
})
}
},
}
}
</script>
<style scoped lang="scss">
.navbox{position: fixed;left: 0;right: 0;top: 0;z-index: 4;background-color: $com-cd3;
.topl{width: 60rpx;height: 60rpx;display: flex;align-items: center;justify-content: center;
image{width: 40rpx;height: 30rpx;}
}
.topr{display: flex;align-items: center;
image{width: 26rpx;height: 26rpx;margin-right: 12rpx;}
view{font-weight: 500;font-size: 26rpx;color: #FFFFFF;}
}
.tablists{
overflow: auto;flex-wrap: nowrap;
view{font-weight: bold;font-size: 26rpx;color: #FFFFFF;position: relative;flex: 0 0 auto;padding: 22rpx 24rpx;margin-right: 6rpx;box-sizing: border-box;
&:last-child{margin-right: 0;}
&.act{font-size: 30rpx;
&::after{content: '';width: 62rpx;height: 10rpx;background: #FFFFFF;border-radius: 4rpx;left: 50%;margin-left: -31rpx;bottom: 0rpx;position: absolute;}
}
}
}
.lbtab{height: 114rpx;background: #FFFFFF;border-radius: 30rpx;padding-left: 24rpx;position: absolute;left:24rpx;right: 24rpx;bottom: -58rpx;
.limg{width: 40rpx;height: 34rpx;margin-right: 10rpx;flex:0 0 auto;}
.lbtabs{overflow: auto;flex-wrap: nowrap;flex: 1;
.lbtabp{display: flex;align-items: center;flex:1;margin-right: 24rpx;}
.upimg{width: 18rpx;height: 10rpx;}
}
}
}
.reashimg{width: 26rpx;height: 22rpx; margin-right: 18rpx;}
.mbox{padding:58rpx 24rpx 28rpx;}
.lbtabs /deep/ picker{padding: 0 18rpx;}
</style>