kubbo/dvcp_v2_wechat_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

在职党员社区报到，换届选举

Browse Source
This commit is contained in:
liuye
2022-10-21 10:53:24 +08:00
parent a8436087e6
commit 46276a83ff
11 changed files with 3384 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

221
src/project/pingchang/AppGeneralElection/AppGeneralElection.vue Normal file
View File

@@ -0,0 +1,221 @@
<template>
<view class="page">
<view v-if="isShow" style="height:100%;">
<view class="session-list">
<view class="session-item" v-for="(item, index) in list" :key="index">
<view class="item-top">
<view class="item-title mar-b9">{{item.title}}</view>
<view class="item-info">
<text class="info-label">选举状态：</text>
<text class="info-value" :class="'item-status'+item.status">
{{$dict.getLabel('electionStatus',item.status)||'-'}}
</text>
</view>
<view class="item-info mar-b9">
<text class="info-label">应选人数：</text>
<text class="info-value" style="display:inline-block;width: 100rpx;">{{item.chooseNumber || '0'}}</text>
<text class="info-label">候选人数：</text>
<text class="info-value">{{item.candidatesNumber || '0'}}</text>
</view>
</view>
<view class="item-bottom">
<text class="item-btn" v-if="item.status == 1 && item.partyVoteStatus === null" @click="toDetail(item.id)">去投票</text>
<text class="item-btn border-999" v-if="item.status == 2 && item.partyVoteStatus != null" @click="showTips(item.status)">已投票</text>
<text class="item-btn border-999" v-if="item.status == 1 && item.partyVoteStatus != null" @click="showTips(item.status)">已投票</text>
<text class="item-btn border-999" v-if="item.status == 0" @click="showTips(item.status)">未开始</text>
<text class="item-btn border-999" v-if="item.status == 2 && item.partyVoteStatus === null" @click="showTips(item.status)">未投票</text>
</view>
<view class="item-status" :class="'item-status'+item.status">
{{$dict.getLabel('electionStatus',item.status)||'-'}}
</view>
</view>
</view>
<AiEmpty v-if="list.length == 0"/>
</view>
</view>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'AppGeneralElection',
appName: "换届选举",
computed: {
...mapState(['user', 'token']),
},
data() {
return {
isShow: true,
list: [],
pageNum: 1,
pageSize: 10,
pages: 2,
partyId: ''
};
},
onLoad() {
this.$dict.load('electionStatus').then(() => {
this.partyId =this.user.partyId
this.getList()
})
},
onShow() {
this.$dict.load('electionStatus').then(() => {
this.partyId = this.user.partyId
this.getList()
})
},
methods: {
getList() {
if (this.pageNum > this.pages) return
this.$instance.post(`/app/appgeneralelectioninfo/list-xcx?partyId=${this.partyId}&current=${this.pageNum}&size=${this.pageSize}`, null, {}).then(res => {
console.log(res)
if (res.code == 0) {
const list = this.pageNum > 1 ? [...this.list, ...res.data.records] : res.data.records
this.pages = Math.ceil(res.data.total / 10)
this.list = list
console.log(this.list)
}
})
},
toSessionDetail(id) {
// uni.navigateTo({
// url: '../threeSessions/threeSessionsDetail?id=' + id
// })
},
toDetail(id) {
uni.navigateTo({
url: `./generalElectionDetail?id=${id}`
})
},
showTips(status) {
var title = '投票未开始'
if (status == 1) {
title = '已投票'
}
if (status == 2) {
title = '已结束'
}
uni.showToast({
title: title,
icon: "none"
})
}
},
onReachBottom() {
this.pageNum = this.pageNum + 1
this.getList()
}
};
</script>
<style lang="scss" scope>
.page {
background-color: #F3F6F9;
.session-list {
.session-item {
width: 686px;
margin: 32px auto 0 auto;
background-color: #fff;
// min-height: 308px;
position: relative;
overflow: hidden;
border-radius: 8px;
.item-top {
padding: 32px 32px 0 32px;
}
.item-title {
font-size: 32px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333;
line-height: 44px;
word-break: break-all;
}
.item-info {
line-height: 42px;
font-size: 28px;
margin-bottom: 8px;
.info-label {
color: #999;
}
}
.item-bottom {
border-top: 2px solid #EEE;
text-align: right;
padding-right: 34px;
box-sizing: border-box;
line-height: 96px;
.item-btn {
display: inline-block;
width: 152px;
height: 52px;
line-height: 52px;
border-radius: 28px;
text-align: center;
font-size: 28px;
margin-left: 32px;
border: 2px solid #E1E1E1;
color: #1365DD;
border: 2px solid #1365DD;
}
}
.info-value {
color: #343D65;
background-color: #fff !important;
}
.item-status {
position: absolute;
top: 14px;
right: -30rpx;
width: 140px;
text-align: center;
line-height: 44px;
font-size: 24px;
transform: rotate(45deg);
}
.item-status0 {
color: #FF9B2B;
background-color: #FFF3E8;
}
.item-status1 {
color: #5A98F2;
background-color: #F1F6FF;
}
.item-status2 {
color: #f46;
background-color: #FFECF0;
}
.border-999 {
color: #999 !important;
border-color: #999 !important;
}
.mar-b9 {
margin-bottom: 18px !important;
}
}
}
.no-affairs {
width: 100%;
height: calc(100% - 210rpx);
display: flex;
justify-content: center;
align-items: center;
}
}
</style>

330
src/project/pingchang/AppGeneralElection/generalElectionDetail.vue Normal file
View File

@@ -0,0 +1,330 @@
<template>
<view class="page">
<div class="line-bg"></div>
<div class="banner-top">
<image src="https://cdn.cunwuyun.cn/img/election-banner.png" class="banner-img"></image>
<span class="tips" @click="viewMask()"><image src="https://cdn.cunwuyun.cn/img/explain-icon.png" class="tips-icon"></image>投票说明</span>
<image src="https://cdn.cunwuyun.cn/img/party-icon.png" class="party-icon"></image>
<div class="banner-info">
<div class="title">{{ title }}</div>
<div class="num-info">应选人{{ chooseNumber || '0' }}人</div>
<div class="user-list">
<div class="user-item user-item-title">
<span>候选人</span>
<span>赞成</span>
<span>反对</span>
<span>弃权</span>
</div>
<div class="user-item" v-for="(item, index) in userList" :key="index">
<span>{{ item.candidateUserName }}</span>
<span>
<image
:src="item.voteStatus == '0' ? 'https://cdn.cunwuyun.cn/img/circle-check.png' : 'https://cdn.cunwuyun.cn/img/circle-icon.png'"
class="check-icon" @click="checkClick(index, '0')"></image>
</span>
<span>
<image
:src="item.voteStatus == '1' ? 'https://cdn.cunwuyun.cn/img/circle-check.png' : 'https://cdn.cunwuyun.cn/img/circle-icon.png'"
class="check-icon" @click="checkClick(index, '1')"></image>
</span>
<span>
<image
:src="item.voteStatus == '2' ? 'https://cdn.cunwuyun.cn/img/circle-check.png' : 'https://cdn.cunwuyun.cn/img/circle-icon.png'"
class="check-icon" @click="checkClick(index, '2')"></image>
</span>
</div>
</div>
</div>
</div>
<div class="btn-bottom">
<div class="btn" @click="submitVote()">提交投票</div>
</div>
<view class="mask" v-if="showMask">
<view class="mask-content">
<view class="mask-title">投票说明</view>
<view class="mask-text">1、本次选举采用无记名投票方式，差额选举的办法，选举第十一届村民委员会主任1名。选举工作由选举委员会主持，未尽事宜由选举委员会研究决定；</view>
<view class="mask-text">2、差额选举的办法，选举第十一届村民委员会主任1名。选举工作由选举委员会主持，未尽事宜由选举委员会研究决定。</view>
<view class="mask-btn" @click="closeMask()">关闭</view>
</view>
</view>
</view>
</template>
<script>
import {mapState} from 'vuex'
export default {
computed: {
...mapState(['user']),
},
data() {
return {
detailId: '',
userList: [],
showMask: false,
title: '',
chooseNumber: '',
partyId: ''
};
},
onLoad(options) {
this.detailId = options.id
this.partyId = this.user.partyId
this.getDetailInfo()
},
methods: {
submitVote() {
var flags = true
var checkNum = 0
var checkList = []
this.userList.map((item) => {
if (item.voteStatus) {
checkNum++
checkList.push(item)
}
})
if (checkNum > this.chooseNumber) {
uni.showToast({title: `投票人数大于应选人数，请重试`, icon: 'none'})
flags = false
}
// if (checkNum < this.chooseNumber) {
// uni.showToast({title: `请给候选人投票`, icon: 'none'})
// flags = false
// }
if (checkNum < this.userList.length) {
uni.showToast({title: `请给候选人投票`, icon: 'none'})
flags = false
}
if (!flags) return
this.$instance.post('/app/appgeneralelectioninfo/vote', checkList).then(res => {
if (res.code == 0) {
uni.showToast({title: '投票成功！'})
setTimeout(function () {
uni.navigateBack({
delta: 1
});
}, 1000)
}
})
},
checkClick(index, status) {
if (this.userList[index].voteStatus == status) {
this.userList[index].voteStatus = ''
} else {
this.userList[index].voteStatus = status
}
},
closeMask() {
this.showMask = false
},
viewMask() {
this.showMask = true
},
getDetailInfo() {
this.$instance.post(`/app/appgeneralelectioninfo/queryDetailById?id=${this.detailId}`, null).then(res => {
if (res.data) {
this.chooseNumber = res.data.chooseNumber
this.title = res.data.title
res.data.candidateUsers.map((item) => {
var info = {
"candidateUserId": item.id,
"candidateUserName": item.name,
"electionId": this.detailId,
"voteStatus": '',
"voterUserId": this.partyId
}
this.userList.push(info)
})
}
});
},
},
};
</script>
<style lang="scss" scope>
.page {
.line-bg {
width: 100%;
height: 12px;
background-color: #E60012;
}
.banner-top {
width: 100%;
height: 340px;
position: relative;
.banner-img {
position: absolute;
width: 100%;
height: 340px;
top: 0;
left: 0;
z-index: 1;
}
.tips {
position: absolute;
right: 42px;
color: #fff;
font-size: 30px;
z-index: 88;
top: 116px;
.tips-icon {
width: 40px;
height: 40px;
vertical-align: text-top;
margin-right: 8px;
}
}
.party-icon {
position: absolute;
z-index: 3;
width: 140px;
height: 140px;
left: 50%;
margin-left: -70rpx;
top: 180px;
}
.banner-info {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 100%;
color: #fff;
padding-bottom: 136px;
.title {
width: 100%;
font-size: 44px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
line-height: 60px;
text-align: center;
padding: 12px 0 40px 0;
}
.num-info {
width: 100%;
font-size: 36px;
font-family: PingFangSC-Semibold, PingFang SC;
line-height: 50px;
text-align: center;
margin-bottom: 80px;
}
.user-list {
width: 710px;
background: #fff;
border-radius: 24px 24px 0 0;
margin: 0 auto;
.user-item {
width: 688px;
height: 112px;
line-height: 112px;
margin: 0 auto;
border-bottom: 2px solid #eee;
display: flex;
font-size: 32px;
color: #666;
span {
flex: 1;
text-align: center;
.check-icon {
width: 40px;
height: 40px;
}
}
}
.user-item:nth-last-of-type(1) {
border-bottom: 0;
}
.user-item-title {
color: #333;
font-size: 34px;
padding-top: 88px;
}
}
}
}
.btn-bottom {
position: fixed;
bottom: 0;
left: 0;
z-index: 9;
width: 100%;
.btn {
width: 100%;
line-height: 112px;
background: #E60012;
color: #fff;
font-size: 32px;
text-align: center;
}
}
.mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, .3);
z-index: 99;
.mask-content {
width: 560px;
height: 680px;
background: #fff;
border-radius: 8px;
border: 2px solid rgba(151, 151, 151, 1);
margin: 200px auto 0;
padding: 48px 48px 0;
box-sizing: border-box;
.mask-title {
font-size: 32px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #333;
line-height: 44px;
margin-bottom: 36px;
}
.mask-text {
width: 100%;
line-height: 44px;
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
color: #333;
word-break: break-all;
}
.mask-btn {
width: 128px;
height: 40px;
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #1365DD;
line-height: 40px;
margin: 60px 0 0 332px;
text-align: center;
}
}
}
}
</style>