迁移
This commit is contained in:
		
							
								
								
									
										219
									
								
								src/project/biaopin/AppGeneralElection/AppGeneralElection.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										219
									
								
								src/project/biaopin/AppGeneralElection/AppGeneralElection.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,219 @@
 | 
			
		||||
<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}¤t=${this.pageNum}&size=${this.pageSize}`, null, {}).then(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
 | 
			
		||||
          }
 | 
			
		||||
        })
 | 
			
		||||
      },
 | 
			
		||||
      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>
 | 
			
		||||
							
								
								
									
										377
									
								
								src/project/biaopin/AppGeneralElection/generalElectionDetail.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										377
									
								
								src/project/biaopin/AppGeneralElection/generalElectionDetail.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,377 @@
 | 
			
		||||
<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、本次选举采用无记名投票方式,差额选举的办法</view>
 | 
			
		||||
        <view class="mask-text">2、选举工作由选举委员会主持,未尽事宜由选举委员会研究决定。</view> -->
 | 
			
		||||
        <view class="mask-text">{{ votingInstructions }}</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: "",
 | 
			
		||||
      votingInstructions: "",
 | 
			
		||||
    };
 | 
			
		||||
  },
 | 
			
		||||
  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.votingInstructions = res.data.votingInstructions;
 | 
			
		||||
            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: 137px;
 | 
			
		||||
 | 
			
		||||
      .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;
 | 
			
		||||
        text-align: center;
 | 
			
		||||
        padding: 12px 0 10px 0;
 | 
			
		||||
        box-sizing: border-box;
 | 
			
		||||
        overflow: hidden;
 | 
			
		||||
        text-overflow: ellipsis;
 | 
			
		||||
        display: -webkit-box;
 | 
			
		||||
        -webkit-box-orient: vertical;
 | 
			
		||||
        -webkit-line-clamp: 2;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .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, 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;
 | 
			
		||||
        height: 460px;
 | 
			
		||||
        font-family: PingFangSC-Medium, PingFang SC;
 | 
			
		||||
        color: #333;
 | 
			
		||||
        word-break: break-all;
 | 
			
		||||
        overflow-y: scroll;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      .mask-btn {
 | 
			
		||||
        width: 128px;
 | 
			
		||||
        height: 40px;
 | 
			
		||||
        font-size: 28px;
 | 
			
		||||
        font-family: PingFangSC-Medium, PingFang SC;
 | 
			
		||||
        font-weight: 500;
 | 
			
		||||
        color: #1365dd;
 | 
			
		||||
        line-height: 40px;
 | 
			
		||||
        margin: 30px 0 20px 332px;
 | 
			
		||||
        text-align: center;
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										210
									
								
								src/project/biaopin/AppOrganizational/AppOrganizational.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										210
									
								
								src/project/biaopin/AppOrganizational/AppOrganizational.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,210 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <view class="AppOrganizational" :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']),
 | 
			
		||||
    formatTime() {
 | 
			
		||||
      return function (time) {
 | 
			
		||||
        return time && time.substring(0, 10);
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      tabIndex: 0,
 | 
			
		||||
      historyList: [],
 | 
			
		||||
      dataInfo: {}
 | 
			
		||||
    };
 | 
			
		||||
  },
 | 
			
		||||
  onShow() {
 | 
			
		||||
    uni.setNavigationBarColor({
 | 
			
		||||
      frontColor: "#ffffff",
 | 
			
		||||
      backgroundColor: "#e60012",
 | 
			
		||||
    })
 | 
			
		||||
    this.$dict.load('organizationChangeType').then(() => {
 | 
			
		||||
      this.getDetail()
 | 
			
		||||
      this.getHistory()
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  methods: {
 | 
			
		||||
    getDetail() {
 | 
			
		||||
      this.$instance.post(`/app/apporganizationgeneralelection/queryDetailByOrganizationId-forwx`, null, {
 | 
			
		||||
        params: {organizationId: this.user.partyOrgId}
 | 
			
		||||
      }).then(res => {
 | 
			
		||||
        if (res?.data) {
 | 
			
		||||
          this.dataInfo = res.data
 | 
			
		||||
        }
 | 
			
		||||
      }).catch(err => {
 | 
			
		||||
        this.$toast(err)
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    getHistory() {
 | 
			
		||||
      this.$instance.post(`/app/apporganizationgeneralelection/list-forwx?organizationId=${this.user.partyOrgId}`).then(res => {
 | 
			
		||||
        if (res && res.data) {
 | 
			
		||||
          this.historyList = res.data
 | 
			
		||||
        }
 | 
			
		||||
      })
 | 
			
		||||
    },
 | 
			
		||||
    tabClick(index) {
 | 
			
		||||
      this.tabIndex = index
 | 
			
		||||
    },
 | 
			
		||||
    toDetail(id) {
 | 
			
		||||
      uni.navigateTo({
 | 
			
		||||
        url: `./detail?id=${id}`
 | 
			
		||||
      })
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.AppOrganizational {
 | 
			
		||||
  .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>
 | 
			
		||||
							
								
								
									
										65
									
								
								src/project/biaopin/AppOrganizational/detail.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										65
									
								
								src/project/biaopin/AppOrganizational/detail.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,65 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <view class="detail">
 | 
			
		||||
    <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){
 | 
			
		||||
    uni.setNavigationBarColor({
 | 
			
		||||
      frontColor: "#ffffff",
 | 
			
		||||
      backgroundColor: "#e60012",
 | 
			
		||||
    })
 | 
			
		||||
    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>
 | 
			
		||||
.detail {
 | 
			
		||||
    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