组织换届
This commit is contained in:
liuye
215
src/project/pingchang/AppOrganizational/AppOrganizational.vue
Normal file
215
src/project/pingchang/AppOrganizational/AppOrganizational.vue
Normal file
@@ -0,0 +1,215 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page" :class="tabIndex == 1 ? 'bg-369' : 'bg-fff'">
|
||||||
|
<div class="detail-top">
|
||||||
|
<p>{{ dataInfo.organizationName || '-' }}</p>
|
||||||
|
<div>成立时间：{{ formatTime(dataInfo.createOrganizationTime) || '-' }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="line-bg"></div>
|
||||||
|
<div class="select-tab">
|
||||||
|
<div :class="tabIndex == 0 ? 'tab-active' : ''" @click="tabClick(0)">当前届次</div>
|
||||||
|
<div :class="tabIndex == 1 ? 'tab-active' : ''" @click="tabClick(1)">历史届次</div>
|
||||||
|
</div>
|
||||||
|
<div class="organization-detail" v-if="!tabIndex">
|
||||||
|
<p>当前届次：{{ dataInfo.sessionTime || '-' }}</p>
|
||||||
|
<p>本届换届时间：{{ dataInfo.changeTime || '-' }}</p>
|
||||||
|
<p>换届类型：{{ $dict.getLabel('organizationChangeType', dataInfo.type) || '-' }}</p>
|
||||||
|
<p class="padd-b32">下届换届时间：{{ dataInfo.nextChangeTime || '-' }}</p>
|
||||||
|
|
||||||
|
<p class="fw500">本届任职</p>
|
||||||
|
<div style="margin-bottom: 40px;">
|
||||||
|
<p v-for="(item, index) in dataInfo.serveList" :key="index">{{ item.position }}：{{ item.name }}</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="fw500">本届候选人</p>
|
||||||
|
<p v-for="(item, index) in dataInfo.candidateList" :key="index">{{ item.position }}：{{ item.name }}</p>
|
||||||
|
</div>
|
||||||
|
<div class="history-list" v-if="historyList.length && tabIndex">
|
||||||
|
<div class="item" v-for="(item, index) in historyList" :key="index" @click="toDetail(item.id)">
|
||||||
|
<div class="item-top">
|
||||||
|
<image src="https://cdn.cunwuyun.cn/img/organizationalchange-icon.png"/>
|
||||||
|
届次：{{ item.sessionTime }}
|
||||||
|
</div>
|
||||||
|
<div class="item-date">换届时间：{{ item.changeTime }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<AiEmpty v-if="!historyList.length && tabIndex"/>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import {mapState} from 'vuex'
|
||||||
|
export default {
|
||||||
|
name:"AppOrganizational",
|
||||||
|
appName: "组织换届",
|
||||||
|
computed: {
|
||||||
|
...mapState(['user']),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabIndex: 0,
|
||||||
|
historyList: [],
|
||||||
|
dataInfo: {}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
uni.setNavigationBarColor({
|
||||||
|
frontColor: "#ffffff",
|
||||||
|
backgroundColor: "#e60012",
|
||||||
|
})
|
||||||
|
this.$dict.load('organizationChangeType').then(() => {
|
||||||
|
this.getDetail()
|
||||||
|
this.getHistory()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getDetail() {
|
||||||
|
this.$instance.post(`/app/apporganizationchangeconfig/queryDetailByOrganizationIdFromApplet`, null, {
|
||||||
|
params: {organizationId: this.user.partyOrgId}
|
||||||
|
}).then(res => {
|
||||||
|
this.dataInfo = res.data
|
||||||
|
}).catch(err => {
|
||||||
|
this.$toast(err)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getHistory() {
|
||||||
|
this.$instance.post(`/app/apporganizationgeneralelection/list-forwx?organizationId=${this.user.partyId}`).then(res => {
|
||||||
|
if (res && res.data) {
|
||||||
|
this.historyList = res.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
tabClick(index) {
|
||||||
|
this.tabIndex = index
|
||||||
|
},
|
||||||
|
toDetail(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `./detail?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
user() {
|
||||||
|
return uni.getStorageSync("userInfo")
|
||||||
|
},
|
||||||
|
formatTime() {
|
||||||
|
return function (time) {
|
||||||
|
return time && time.substring(0, 10);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
|
||||||
|
.page {
|
||||||
|
.detail-top {
|
||||||
|
padding: 32px;
|
||||||
|
background-color: #E60012;
|
||||||
|
color: #fff;
|
||||||
|
|
||||||
|
p {
|
||||||
|
line-height: 64px;
|
||||||
|
font-size: 40px;
|
||||||
|
font-family: PingFangSC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
line-height: 40px;
|
||||||
|
font-size: 28px;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-bg {
|
||||||
|
height: 8px;
|
||||||
|
background-color: #F3F6F9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-tab {
|
||||||
|
display: flex;
|
||||||
|
line-height: 96px;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
div {
|
||||||
|
flex: 1;
|
||||||
|
border-bottom: 2px solid #D8DDE6;
|
||||||
|
font-size: 28px;
|
||||||
|
text-align: center;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-active {
|
||||||
|
color: #F26C77;
|
||||||
|
border-bottom: 4px solid #E60012;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.organization-detail {
|
||||||
|
padding: 48px 32px 0;
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 32px;
|
||||||
|
color: #666;
|
||||||
|
line-height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.padd-b32 {
|
||||||
|
padding-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fw500 {
|
||||||
|
font-weight: 600;
|
||||||
|
font-family: PingFangSC-Medium, PingFang SC;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.history-list {
|
||||||
|
padding: 16px 32px;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
width: 686px;
|
||||||
|
background: #fff;
|
||||||
|
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.02);
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.item-top {
|
||||||
|
width: 622px;
|
||||||
|
height: 108px;
|
||||||
|
line-height: 106px;
|
||||||
|
margin-left: 16px;
|
||||||
|
color: #333;
|
||||||
|
font-size: 32px;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin: 0 20px 0 16px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-date {
|
||||||
|
line-height: 106px;
|
||||||
|
padding-right: 32px;
|
||||||
|
flex: 1;
|
||||||
|
color: #999;
|
||||||
|
font-size: 28px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-fff {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-369 {
|
||||||
|
background-color: #F3F6F9 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
62
src/project/pingchang/AppOrganizational/detail.vue
Normal file
62
src/project/pingchang/AppOrganizational/detail.vue
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page">
|
||||||
|
<div class="line-bg"></div>
|
||||||
|
<div class="organization-detail">
|
||||||
|
<p>当前届次：{{dataInfo.sessionTime || '-'}}</p>
|
||||||
|
<p>换届时间：{{dataInfo.changeTime || '-'}}</p>
|
||||||
|
<p class="fw500">该届任职</p>
|
||||||
|
<div style="margin-bottom: 40rpx;">
|
||||||
|
<p v-for="(item, index) in dataInfo.serveList" :key="index">{{item.position}}：{{item.name}}</p>
|
||||||
|
</div>
|
||||||
|
<p class="fw500">该届候选人</p>
|
||||||
|
<p v-for="(item, index) in dataInfo.candidateList" :key="index">{{item.position}}：{{item.name}}</p>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: '',
|
||||||
|
dataInfo: {}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(options){
|
||||||
|
this.$dict.load('organizationChangeType')
|
||||||
|
this.id = options.id
|
||||||
|
this.getDetail()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getDetail() {
|
||||||
|
this.$instance.post(`/app/apporganizationgeneralelection/queryDetailById-forwx?id=${this.id}`).then( res => {
|
||||||
|
this.dataInfo = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scope>
|
||||||
|
|
||||||
|
.page {
|
||||||
|
background-color: #fff;
|
||||||
|
.line-bg{
|
||||||
|
height: 20rpx;
|
||||||
|
background-color: #F3F6F9;
|
||||||
|
}
|
||||||
|
.organization-detail{
|
||||||
|
padding: 20rpx 32rpx 0;
|
||||||
|
p{
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #666;
|
||||||
|
line-height: 48rpx;
|
||||||
|
}
|
||||||
|
.padd-b32{
|
||||||
|
padding-bottom: 40rpx;
|
||||||
|
}
|
||||||
|
.fw500{
|
||||||
|
font-weight: 600;
|
||||||
|
font-family:PingFangSC-Medium,PingFang SC;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user