public-opinion/pagesA/community/opinion-handle/opinion-handle.vue

114 lines
3.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view>
<statusContainer titlet="民意办理" :ifReturn="false">
<view slot="content">
<view class="bacf disja pad-sx20 fon30" :style="{top:newtop+42+'px'}" style="margin: -20rpx -20rpx 0 -20rpx;position: sticky;z-index: 10;">
<view @tap="switchEv(0)" class="pad-sx20 disjcac radius20" :style="switchIndex==0?'background-color:#39d091;color:#FFFFFF;':''" style="width: 288rpx;">待办理</view>
<view @tap="switchEv(1)" class="pad-sx20 disjcac radius20" :style="switchIndex==1?'background-color:#39d091;color:#FFFFFF;':''" style="width: 288rpx;">已办理</view>
</view>
<view class="mar-s20 radius20 fon24 bacf posir" v-for="(item,index) in communityList" :key="index">
<view class="pad-sx20 pad-zy50 status-box" :style="{backgroundColor:['#f8bf00','#39d091'][switchIndex]}">{{['待办理','已办理'][switchIndex]}}</view>
<view class="pad20 bbot line-h46 pad-x40">
<view class="fon30">{{item.coding}}</view>
<view class="">用户名{{item.is_anonymous==1?'匿名提交':item.u_name}}</view>
<view class="">金牛社区A村</view>
<view class="">反馈问题{{item.description}}</view>
</view>
<view class="dis fon30 disjcac" v-if="switchIndex==0">
<view @tap="handleEv(item.id)" class="pad-sx30 disac">
<image class="mar-y20" src="/static/icon/icon-handle.png" mode="" style="width: 34rpx;height: 34rpx;"></image>
立即办理
</view>
</view>
</view>
</view>
</statusContainer>
</view>
</template>
<script>
import statusContainer from '@/components/containers/status-container.vue';
export default {
components:{
statusContainer
},
data() {
return {
switchIndex:0,
newtop:uni.getSystemInfoSync().statusBarHeight,
communityList:[], //数据列表
type:['doing','done','all'], //办理状态
page:1, //页数
size:15, //条数
total:0, //总数
noMore:false, // 没有更多
isLoading:false,
}
},
onShow() {
// 查询列表
this.getListEv();
},
onReachBottom() {
if(!this.noMore){
this.page++;
// 查询列表
this.getListEv();
}
},
methods: {
// 切换事件
switchEv(index){
if(index !== this.switchIndex){
this.switchIndex = index;
// 重置数据
this.communityList= [];
this.page = 1;
// 查询列表
this.getListEv();
}
},
// 查询列表
getListEv(){
uni.showLoading({
title:'加载中'
})
let params = {
page:this.page,
size:this.size,
type:this.type[this.switchIndex]
}
this.$requst.get('opinion/community-list',params).then(res => {
if(res.code==0){
console.log(res,'社区工单列表');
this.total = res.data.total;
this.communityList = this.communityList.concat(res.data.list)
if(this.communityList.length == this.total){
this.noMore =true;
}
} else {
this.$toolAll.tools.showToast(res.msg);
}
uni.hideLoading();
this.isLoading = true;
})
},
// 前往详情页面
handleEv(id){
uni.navigateTo({
url:`/pagesA/detail/detail?id=${id}&manager=0`
})
},
}
}
</script>
<style>
page{
background-color: #f5f5f5;
}
.status-box{position: absolute;right: 0;top: 0;border-radius: 0 0 0 30rpx;}
</style>