nsgk_mobile/src/views/user/index.vue

<template>
  <div class="app-container" >
    <div class="header">
      <div class="font_size">
        <span>字体：</span>
        <span @click="openSmall">正常</span>
        <span @click="openBig">大号</span>
      </div>
      <van-row style="width: 90%; margin: 0 auto">
        <van-col span="7">
          <img v-if="user.avatar" :src="'/api'+user.avatar" style="border: 2px solid #FFF;width: 2rem;height: 2rem;border-radius: 50%;">
          <img v-else src="../../assets/images/user_tx.png" style="width: 2rem;height: 2rem;border-radius: 50%;">
        </van-col>
        <van-col span="17">
          <p @click="openView = true">
            {{phone}}
            <span class="activitiStatus">
              {{
                activitiStatus == '1' ? '待审':
                activitiStatus == '2' ? '驳回':
                activitiStatus == '3' ? '通过':''
              }}
            </span>
          </p>
          <p onclick="window.location='accountSetting'">账户设置</p>
        </van-col>
      </van-row>
    </div>
    <div style="width: 96%;transform: translateY(-18%);margin: 0 auto;border-radius: 0.4rem;overflow: hidden;">
      <van-cell title="我的报名" is-link icon="balance-list-o" to="application" />
      <van-cell title="我的竞价" is-link icon="bar-chart-o" to="bidding" />
      <van-cell title="我的咨询" is-link icon="service-o" to="userInteraction" />
      <van-cell title="我的供求" is-link icon="bag-o" to="userSupply" />
      <van-cell title="合同网签" is-link icon="orders-o" to="/user/signature/signatureList" />
    </div>
    <van-button class="loginOut" round color="#007E72" @click="loginOut">
      退出登录
    </van-button>
    <van-dialog v-model="openView" title="审核记录">
      <div style="height: 50vh;overflow-y: scroll;padding: 0 5PX;">
        <van-cell-group :title="'进度'+(index+1)" v-for="(item,index) in historyList">
          <van-cell title="活动名称" v-model="item.activityName" :border="false" />
          <van-cell title="办理人ID" v-model="item.assignee" :border="false" />
          <van-cell title="办理人"   v-model="item.assigneeName" :border="false" />
          <van-cell title="审批意见" v-model="item.comment" :border="false" />
          <van-cell title="开始时间" v-model="item.startTime" :border="false" />
          <van-cell title="结束时间" v-model="item.endTime" :border="false" />
          <van-cell title="耗时" v-model="item.durationInMillis" :border="false" />
        </van-cell-group>

      </div>
    </van-dialog>
  </div>
</template>

<script>
import { getMember , supplyList , deleteSupply} from "@/api/user/index";
import { logout ,getInfo } from "@/api/login/index";
import Cookies from "js-cookie";
import request from "@/utils/request";
export default {
  name: "user",
  data() {
    return {
      phone:'',
      user:'',
      activitiStatus:'',
      instanceId:'',
      historyList:[],
      openView:false,
      memberType:0
    };
  },
  created() {
    this.getInfo();
  },
  methods: {
    getHistoryList: function () {
      this.loading = true;
      var queryParams = {
        processInstanceId: this.instanceId
      };
      return request({
        url: "/activiti/process/listHistory",
        method: "post",
        data: queryParams,
      })
        .then((response) => {
          this.historyList = response.rows;
          this.historyList.forEach((row) => {
            row.startTime = this.format(row.startTime, "yyyy-MM-dd HH:mm:ss");
            row.endTime =  this.format(row.endTime, "yyyy-MM-dd HH:mm:ss");
            row.durationInMillis = this.formatTotalDateSub(
              row.durationInMillis / 1000
            );
          });
          this.total = response.total;
          this.loading = false;
        })
        .then(() => {});
    },
    loginOut(){
      logout().then(response => {
        var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
        if(keys) {
          for(var i = keys.length; i--;)
            document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString()
        }
        this.$router.push({name:'indexCJ'})
      });
    },
    getInfo(){
      getInfo().then(response => {
        console.log(response)
        this.user = response.user;
        getMember(response.user.userId).then(response => {
          console.log(response)
          Cookies.set('memberId',response.data.id)
          this.phone = response.data.phone;
          this.activitiStatus = response.data.activitiStatus;
          this.instanceId = response.data.instanceId;
          this.memberType = response.data.memberType;
          if(this.instanceId !== "" && this.instanceId != null){
            this.getHistoryList()
          }

        });
      });
    },
    format(time, format) {
      var t = new Date(time);
      var tf = function (i) { return (i < 10 ? '0' : '') + i };
      return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
        switch (a) {
          case 'yyyy':
            return tf(t.getFullYear());
            break;
          case 'MM':
            return tf(t.getMonth() + 1);
            break;
          case 'mm':
            return tf(t.getMinutes());
            break;
          case 'dd':
            return tf(t.getDate());
            break;
          case 'HH':
            return tf(t.getHours());
            break;
          case 'ss':
            return tf(t.getSeconds());
            break;
        }
      })
    },
    /**
     * 计算出相差天数
     * @param secondSub
     */
    formatTotalDateSub (secondSub) {
      var days = Math.floor(secondSub / (24 * 3600));     // 计算出小时数
      var leave1 = secondSub % (24*3600) ;                // 计算天数后剩余的毫秒数
      var hours = Math.floor(leave1 / 3600);              // 计算相差分钟数
      var leave2 = leave1 % (3600);                       // 计算小时数后剩余的毫秒数
      var minutes = Math.floor(leave2 / 60);              // 计算相差秒数
      var leave3 = leave2 % 60;                           // 计算分钟数后剩余的毫秒数
      var seconds = Math.round(leave3);
      return days + "天" + hours + "时" + minutes + "分" + seconds + '秒';
    },

    openBig(){
      this.$parent.isCq = true;
      Cookies.set('isCq',true)
    },

    openSmall(){
      this.$parent.isCq = false;
      Cookies.remove('isCq')
    }
  },
};
</script>

<style scoped lang="scss">
.app-container {

}

.font_size{
  color: #fff;
  font-size: .4rem;
  position: absolute;
  top: 1vh;
  right: 2%;
  display: flex;
  align-items: center;
  span{
    display: block;
  }
  span:nth-child(n+2){
    font-size: .3rem;
    border: 1px solid #ffffff;
    padding: 5px 15px;
    margin-right: 10PX;
  }
}

.activitiStatus{
  color: #FEE1AA;
  border: 1px solid #FEE1AA;
  display: inline-block;
  padding: 2px 10px;
  border-radius: 5px;
  margin-left: 10px;
  cursor: pointer;
  font-size: 14Px;
}
  .header{
    background-color: #007E72;
    padding: 1rem 0rem 1.5rem;
    width: 100%;
    p{
      color: #FFF;
      font-size: 0.4rem;
      margin-top: 0.2rem;
    }
    p:nth-child(2){
      width: 40%;
      text-align: center;
      padding: 10px;
      border-radius: 0.5rem;
      margin-top: 0.4rem;
      font-size: 12PX;
      background: #FEE1AA url("../../assets/images/seting.png") no-repeat left center;
      background-size: 0.5rem;
      color: #007E72;
      padding-left: 7%;
      background-position-x: 6%;
      line-height: 1;
    }
  }
  .van-icon{
    color: #007E72;
  }
  .loginOut{
    width: 94%;
    margin-left: 3%;
  }
</style>