688 lines
14 KiB
Vue
Raw Normal View History

2025-03-24 17:48:52 +08:00
<template>
<view class="dangerbig-list">
<view class="fixedheader">
<headers :showBack="true">
<view class="headerName">
党员列表
</view>
</headers>
</view>
<view :style="{ 'padding-top': statusBarHeight + (44 * 2)+ 'rpx' }">
<view class="party_header">
<view class="party_header_title">
<image src="@/static/bthgIcon/partymemberindex_icon1.png" mode=""></image>
<text>党员总数{{ politicalDataInfo.total }}</text>
</view>
<view class="party_header_main">
<view v-for="(item, index) in politicalDataList" :key="index">
<text>{{ item.value }}</text>
<text>{{ item.name }}</text>
<image :src="item.imageUrl" mode=""></image>
</view>
</view>
</view>
<RecursiveCollapse class="recursivecollapse" v-if="listData" :data="listData" />
</view>
</view>
</template>
<script>
import RecursiveCollapse from "@/components/recursive-collapse/index.vue"
import partymemberindex_icon2 from "@/static/bthgIcon/partymemberindex_icon2.png"
import partymemberindex_icon3 from "@/static/bthgIcon/partymemberindex_icon3.png"
import partymemberindex_icon4 from "@/static/bthgIcon/partymemberindex_icon4.png"
import partymemberindex_icon5 from "@/static/bthgIcon/partymemberindex_icon5.png"
import {
isJSON
} from '@/utils/tool.js'
export default {
components: {
RecursiveCollapse
},
data() {
return {
statusBarHeight: 0,
pageNo: 1,
pageSize: 10,
projectSn: "",
oldListData: [],
listData: [],
isLoadMore: false,
loadStatus: 'more',
workList: [],
levelList: [{
id: 1,
workCategoryName: "一级"
}, {
id: 2,
workCategoryName: "二级"
}, {
id: 3,
workCategoryName: "三级"
}, {
id: 4,
workCategoryName: "普通"
}],
searchName: "",
popupShow: false,
partyConstructionOrganizationId: "",
primarySchoolList: [{
id: 1,
name: "小学",
}, {
id: 2,
name: "初中",
}, {
id: 3,
name: "中专",
}, {
id: 4,
name: "高中",
}, {
id: 5,
name: "大专",
}, {
id: 6,
name: "本科",
}, {
id: 7,
name: "研究生",
}, {
id: 8,
name: "博士",
}, {
id: 9,
name: "博士后",
}],
politicalDataInfo: {},
politicalDataList: [],
}
},
onShow() {
this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
this.projectSn = JSON.parse(uni.getStorageSync('userInfo')).sn
},
onLoad() {
this.projectSn = JSON.parse(uni.getStorageSync('userInfo')).sn
// this.initData()
// this.getWorkList()
this.getConstructionTree();
this.getPoliticalList();
},
onReachBottom() {
console.log(1)
if (!this.isLoadMore) { //此处判断,上锁,防止重复请求
this.isLoadMore = true
this.pageNo += 1
this.getWorkList()
}
},
onPullDownRefresh() {
console.log(2)
this.pageNo = 1
this.getWorkList();
},
methods: {
getPoliticalList() {
let data = {
projectSn: this.projectSn,
}
this.sendRequest({
url: 'xmgl/partyConstructionMember/stats',
method: 'get',
data: data,
success: res => {
uni.hideLoading()
if (res.code == 200) {
this.politicalDataInfo = res.result;
let picData = [{
value: res.result.menNum,
percent: res.result.menPercent,
imageUrl: partymemberindex_icon2,
name: '男党员'
},
{
value: res.result.womenNum,
percent: res.result.womenPercent,
imageUrl: partymemberindex_icon3,
name: '女党员'
},
{
value: res.result.ssNum,
percent: res.result.ssPercent,
imageUrl: partymemberindex_icon4,
name: '少数民族'
},
{
value: res.result.dzNum,
percent: res.result.dzPercent,
imageUrl: partymemberindex_icon5,
name: '大专以上'
}
];
this.politicalDataList = picData;
}
}
})
},
//tree 树形选择器 选中--回显
checkPointBtn(val, type) {
console.log(val)
// type==1 检查项 3 通知人
if (type == 1) {
this.partyConstructionOrganizationId = val[0].id;
this.handleInput();
}
},
//点击打开筛选
screenData() {
this.$refs.screenShow.open();
this.listData = JSON.parse(JSON.stringify(this.oldListData));
console.log(this.listData, this.oldListData)
this._renderTreeList(this.listData)
this.popupShow = true
},
//扁平化树结构
_renderTreeList(list = []) {
const find = list.find(item => item.id == this.partyConstructionOrganizationId)
console.log(3333, find)
if (find) {
find.checked = true;
return;
}
list.forEach(item => {
if (Array.isArray(item.children) && item.children.length > 0) {
this._renderTreeList(item.children);
}
})
// console.log(list)
},
closeMenu(e) {
console.log("关闭!!!!", e)
if (e.show == false) {
// this.$refs.screenShow.close()
this.popupShow = false;
// this.resettingBtn()
}
},
//关闭筛选
closeBtn() {
this.$refs.screenShow.close()
this.popupShow = false;
},
closeRed() {
this.$refs.locationTree._confirm()
this.$refs.screenShow.close()
this.popupShow = false;
},
//预览图片
previewImage(url) {
uni.previewImage({
urls: [url]
})
},
handleInput() {
this.pageNo = 1;
this.workList = [];
this.getWorkList();
},
getConstructionTree() {
let data = {
projectSn: this.projectSn,
partyConstructionOrganizationId: "",
}
this.sendRequest({
url: 'xmgl/partyConstructionOrganization/tree/list',
method: 'get',
data: data,
success: res => {
uni.hideLoading()
if (res.code == 200) {
console.log("workList======================", res)
const newResult = [{
children: [],
classificationName: "全部",
id: "",
parentId: "0",
}, ...res.result]
this.listData = res.result;
this.oldListData = [...newResult];
}
}
})
},
getWorkList() {
let data = {
pageNo: this.pageNo,
pageSize: this.pageSize,
projectSn: this.projectSn,
workerName: this.searchName,
partyConstructionOrganizationId: this.partyConstructionOrganizationId,
}
this.sendRequest({
url: 'xmgl/partyConstructionMember/page',
method: 'get',
data: data,
success: res => {
uni.hideLoading()
if (res.code == 200) {
console.log("workList======================", res)
// this.listData = res.result.records
// this.workList=this.workList.concat(res.result)
const newResult = res.result.records.map(item => {
return {
...item,
image: isJSON(item.file) ? JSON
.parse(item.file) : [],
}
})
this.workList = this.workList.concat(newResult)
if (res.result.records.length < this.pageSize) { //判断接口返回数据量小于请求数据量,则表示此为最后一页
this.isLoadMore = true
this.loadStatus = 'nomore'
} else {
this.isLoadMore = false
// that.loadStatus='more'
}
uni.stopPullDownRefresh()
}
}
})
},
checkItem(val) {
console.log(val)
uni.navigateTo({
url: './detail?id=' + val.id
})
}
}
}
</script>
<style lang="scss" scoped>
.recursivecollapse {
margin-top: 26rpx;
}
.party_header {
background-color: white;
padding: 30rpx 40rpx;
.party_header_title {
font-size: 30rpx;
color: #171717;
display: flex;
align-items: center;
>image {
width: 36rpx;
height: 36rpx;
margin-right: 18rpx;
}
}
.party_header_main {
display: flex;
font-size: 30rpx;
margin-top: 20rpx;
>view {
width: 25%;
border-radius: 16rpx;
padding: 22rpx 0 32rpx 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
>text {
margin-top: 10rpx;
}
>image {
margin-top: 36rpx;
width: 60rpx;
height: 60rpx;
}
}
>view:not(:first-child) {
margin-left: 12rpx;
}
>view:nth-child(1) {
background-color: #2788FD;
}
>view:nth-child(2) {
background-color: #FC9C45;
}
>view:nth-child(3) {
background-color: #59C9CA;
}
>view:nth-child(4) {
background-color: #74B4FC;
}
}
}
.tki-tree-view {
max-height: 70%;
}
.screenDialog {
position: absolute;
// top: 11%;
// height: 95%;
/* background: pink; */
background: white;
width: 100%;
border-radius: 40rpx;
margin-left: -4%;
background-color: white;
/* 设置为半透明的灰色 */
z-index: 9;
/* 设置一个较大的 z-index 值,保证遮罩层在最上层 */
.closeIcon {
float: right;
font-size: 50rpx;
color: gray;
margin-right: 3%;
}
.screenTitle {
text-align: center;
margin-top: 4%;
font-size: 36rpx;
font-weight: 500;
}
.uni-popup__wrapper-box {
height: 70vh;
overflow: scroll;
position: fixed;
bottom: 0,
}
.screenContent {
width: 100vw;
height: 70%;
// width: 90%;
// margin: -65% 0%;
overflow: scroll;
// position: relative;
// margin-top: 180%;
border-radius: 40rpx 40rpx 0 0;
// margin-left: -4%;
background-color: white;
padding-left: 10%;
position: fixed;
left: 0;
bottom: 0;
.titleItem {
font-size: 28rpx;
.regionText {
display: inline-block;
margin-left: 16%;
width: 380rpx;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
}
}
.footerBtn {
display: flex;
text-align: center;
line-height: 80rpx;
margin-top: 2%;
// margin-left: 6%;
position: absolute;
bottom: 10%;
width: 100%;
.foterLeft {
width: 43%;
background: #f6f7f8;
height: 80rpx;
border-top-left-radius: 40rpx;
border-bottom-left-radius: 40rpx;
color: #5181f6;
}
.foterRight {
width: 43%;
background: #5181f6;
height: 80rpx;
border-top-right-radius: 40rpx;
border-bottom-right-radius: 40rpx;
color: #fff;
}
}
}
.searchBox {
// background-color: white;
// background-color: #F3F5F7;
}
.uni-form-item {
position: relative;
display: flex;
align-items: center;
font-size: 28rpx;
/* .search-icon{
position: absolute;
top: 50%;
right: 50rpx;
transform: translateY(-50%);
} */
}
.uni-input {
border-radius: 40rpx;
margin: 20rpx;
// background-color: #f7f8fa;
background: #FFFFFF;
height: 70rpx;
line-height: 60rpx;
padding: 0 40rpx;
font-size: 28rpx;
flex: 1;
}
.screen {
line-height: 100rpx;
color: gray;
}
.flex {
display: flex;
align-items: center;
}
.content {
padding: 0px 30rpx 20rpx;
box-sizing: border-box;
width: 100%;
}
.download {
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 10rpx;
// justify-content: center;
}
.img {
width: 120rpx;
height: 120rpx;
}
.dangerbig-list {
min-height: 100%;
// background: #F6F6F6;
background-color: #F3F5F7;
.fixedheader {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 2;
.headerName {
z-index: 1;
}
:deep(.headerBox) {
// background-color: #F3F5F7;
}
:deep(.right) {
font-size: 24rpx;
position: absolute;
right: 20rpx;
top: 50%;
z-index: 4;
transform: translateY(-50%);
.scancode {
width: 44rpx;
height: 44rpx;
}
}
}
.list {
padding: 20rpx 0;
margin: 0 20rpx;
.list-item {
background: #fff;
margin-bottom: 20rpx;
padding: 20rpx 0;
position: relative;
border-radius: 24rpx;
.list-title {
padding: 10rpx 20rpx;
// border-bottom: 4rpx solid #F6F6F6;
display: flex;
align-items: center;
justify-content: space-between;
.tag {
background: #F0AD4E;
color: #fff;
padding: 4rpx 8rpx;
font-size: 24rpx;
margin-right: 20rpx;
margin-left: -20rpx;
height: 32rpx;
}
.status1 {
background: #2b8df3;
color: #fff;
padding: 4rpx 8rpx;
font-size: 24rpx;
}
.status2 {
background: #F0AD4E;
color: #fff;
padding: 4rpx 8rpx;
font-size: 24rpx;
}
.status3 {
background: #B22222;
color: #fff;
padding: 4rpx 8rpx;
font-size: 24rpx;
}
.status4 {
background: #ccc;
color: #fff;
padding: 4rpx 8rpx;
font-size: 24rpx;
}
}
.list-info {
display: flex;
padding: 10rpx 20rpx;
font-size: 28rpx;
// border-bottom: 2rpx solid #F6F6F6;
}
.info-status {
padding: 3rpx 16rpx;
// border: 1px solid #DD524D;
// border-radius: 6rpx;
// color: #DD524D;
margin-left: 10rpx;
border-radius: 30rpx;
background-color: #DD524D;
color: white;
}
.btn_detail {
background-color: #4181FE;
color: white;
padding: 3rpx 16rpx;
border-radius: 30rpx;
position: absolute;
bottom: 16rpx;
right: 16rpx;
}
}
}
.btn {
height: 96rpx;
width: 100%;
line-height: 96rpx;
text-align: center;
background: #4181FE;
color: #fff;
position: fixed;
bottom: 0;
left: 0;
}
.no-data {
text-align: center;
.img {
display: block;
height: 200rpx;
width: 200rpx;
margin: 0 auto;
margin-top: 560rpx;
margin-bottom: 60rpx;
}
.txt {
color: #CFC8CC;
}
}
}
</style>