wiki_enterprise_js/pages/user-code/user-code.vue

<template>
  <view class="padding-lg">
    <template v-if="userInfo">
      <view class="padding bg-purple shadow-blur radius margin-bottom-xl">
        <view>
          <view class="text-xl text-bold margin-bottom">个人申报信息</view>
          <view class="text-lg text-grey">
            <text class="margin-right">{{ userInfo.name }}</text>
            <text>{{ post }}</text>
          </view>
          <view class="text-lg text-grey">
            身份证：
            <text>{{ userInfo.idCard }}</text>
          </view>
          <view class="text-lg text-grey">
            手机号：
            <text>{{ userInfo.phone }}</text>
          </view>
          <view class="text-lg text-grey">
            学号：
            <text>{{ userInfo.no }}</text>
          </view>
          <view class="text-lg text-grey">
            登记时间：
            <text>{{ time }}</text>
          </view>
          <view class="text-lg text-grey">
            健康状态：
            <text>{{ level }}</text>
          </view>
        </view>
      </view>
      <view class="padding-top-xl">
        <image
          :src="userInfo.healthCodeList[0].healthCode"
          class="img solid radius"
          mode="aspectFit"
        />
      </view>
	  
	  <!-- 返回首页 -->
	  <button
	    @tap="openPage('/pages/index/index')"
	    class="shadow round bg-purple index-btn iconfont icon-home"
	    hover-class="cc-active"
	  >首页</button>
	  
    </template>
  </view>
</template>

<script>
import { mapState, mapActions } from 'vuex';
import { formatQuery } from 'utils/util';

export default {
  data() {
    return {
      userInfo: null,
      // userInfo: {
      //   healthCodeList: [
      //     {
      //       healthCode: 'https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/gh_33446d7f7a26_430.jpg',
      //       healthLevel: 0,
      //       time: Date.now(),
      //     },
      //   ],
      //   id: '123',
      //   idCard: '1407241989****019X',
      //   no: '080800009',
      //   phone: '18603454788',
      //   post: 0,
      //   name: '冯教授',
      // },
      timer: null,
    };
  },

  computed: {
    ...mapState('user', ['token']),

    // 身份
    post() {
      if (!this.userInfo) return '学生';
      let str = '学生';
      console.log('this.userInfo.post: ', this.userInfo.post);
      switch (this.userInfo.post) {
        case 0:
          str = '学生';
          break;
        case 1:
          str = '老师';
          break;
        case 2:
          str = '工作人员';
          break;
        default:
          break;
      }
      return str;
    },

    // 健康状态 登记
    level() {
      if (!this.userInfo || !this.userInfo.healthCodeList) return '正常';
      let str = '正常';
      switch (this.userInfo.healthCodeList[0].healthLevel) {
        case 0:
          str = '正常';
          break;
        case 1:
          str = '隔离中或疑似';
          break;
        case 2:
          str = '确诊';
          break;
        default:
          break;
      }
      return str;
    },

    time() {
      if (!this.userInfo || !this.userInfo.healthCodeList) return;
      return this.$moment(this.userInfo.healthCodeList[0].time - 0).format('YYYY-MM-DD HH:mm');
    },
  },

  onLoad(options) {
    this.init(options);
  },

  methods: {
    ...mapActions('user', ['getUserInfo']),

    init(options) {
      try {
        console.log('options: ', options);
        const query = formatQuery(decodeURIComponent(options.scene));
        const { d } = query;
        if (!d) {
          uni.showToast({
            title: '二维码参数错误',
            icon: 'none',
            duration: 3000,
          });
        }
        const params = { param: { userId: d } };
        this.getUserInfoData(params);
      } catch (error) {
        console.log('error: ', error);
      }
    },

    /**
     * 获取场所的基本信息
     * @param {object} params 提交给后端的参数
     */
    async getUserInfoData(params) {
      this.timer && clearInterval(this.timer);
      if (!this.token) {
        this.timer = setTimeout(() => {
          this.getUserInfoData(params);
        }, 100);
      } else {
        console.log('params: ', params);
        this.userInfo = await this.getUserInfo(params);
        if (!this.userInfo.healthCodeList.length) {
          showToast('健康码信息有误, 请重新生成');
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.img {
  display: block;
  width: 400rpx;
  height: 400rpx;
  margin: 0 auto;
}

.index-btn {
  position: fixed;
  bottom: 40rpx;
  right: 40rpx;
  width: 96rpx;
  height: 96rpx;
  line-height: 96rpx;
  padding: 0;
}

.index-btn::after {
  border: none;
}
</style>