mycode.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <!-- 0审核中,1不通过,2通过,9未提交 -->
  2. <template>
  3. <view>
  4. <image class="bg" src="../../static/img/mycode-bg.png" mode="widthFix"></image>
  5. <view class="content" style="padding-top: 20vh;">
  6. <view class="qrimg">
  7. <tki-qrcode
  8. ref="qrcode"
  9. cid="cid"
  10. :showLoading="false"
  11. :val="memberinfo.id"
  12. :size="300"
  13. background="#000"
  14. foreground="#fff"
  15. pdground="#fff"
  16. :icon="icon"
  17. :iconSize="40"
  18. :usingComponents="true"
  19. :onval="true"
  20. @result="qrR" />
  21. </view>
  22. </view>
  23. <view class="code-text" v-show="memberinfo.auditStatus==2">
  24. <view class="code-id">{{memberinfo.id}}</view>
  25. <view class="thanks">
  26. {{memberinfo.name}}{{memberinfo.menSex|verifySexFilter}},感谢您为国家的付出
  27. </view>
  28. <view v-if="!memberinfo.id">还没有退役军人码</view>
  29. </view>
  30. <view class="content fixed" v-if="memberinfo.auditStatus==9">
  31. <!-- 9未提交 -->
  32. <view class="tip">
  33. 提交退役军人身份审核,获取退役军人码,并享受平台提供的专享培训、就业服务。
  34. </view>
  35. </view>
  36. <view class="content fixed" v-else-if="memberinfo.auditStatus==0">
  37. <!-- 0审核中 -->
  38. <view class="tip">
  39. 您已提交退役军人身份审核,通过后生成退役军人码,并可享受平台提供的专享培训、就业服务,请耐心等待。
  40. </view>
  41. </view>
  42. <view class="content fixed" v-else-if="memberinfo.auditStatus==1">
  43. <!-- 1不通过 -->
  44. <view class="tip">
  45. 很抱歉,您提交的退役军人身份信息未通过审核,请审查后重新提交。
  46. </view>
  47. </view>
  48. <!-- ########################## -- 底部导航栏 -- ################################ -->
  49. <u-tabbar
  50. :list="tabbarConfig.tabbarList"
  51. :height="tabbarConfig.height"
  52. :mid-button="tabbarConfig.midButton"
  53. :inactive-color="tabbarConfig.inactiveColor"
  54. :active-color="tabbarConfig.activeColor"
  55. :mid-button-size="tabbarConfig.midButtonSize"
  56. ></u-tabbar>
  57. </view>
  58. </template>
  59. <script>
  60. import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue";
  61. import tabbarconfig from 'tabbarconfig.js';
  62. export default{
  63. components: {tkiQrcode},
  64. data(){
  65. return{
  66. memberinfo:[],
  67. icon:'/static/icons/index.png',
  68. tabbarConfig: tabbarconfig
  69. }
  70. },
  71. onLoad(page){
  72. },
  73. onShow(){
  74. this.getmemberinfo();
  75. },
  76. filters:{
  77. verifySexFilter(value){
  78. if (value == 0) {
  79. return '先生';
  80. }else if(value == 1){
  81. return '女士';
  82. }
  83. }
  84. },
  85. methods:{
  86. getmemberinfo(){
  87. this.$u.api.getmemberinfo().then(res=>{
  88. if(res.code==200){
  89. this.memberinfo = res.data;
  90. if(this.memberinfo.auditStatus!==2){
  91. this.memberinfo.id = null
  92. }
  93. console.log('this',this)
  94. console.log('this.memberinfo',JSON.parse(JSON.stringify(this.memberinfo)));
  95. }else{
  96. uni.showToast({
  97. icon:'none',
  98. title:res.msg
  99. })
  100. }
  101. })
  102. },
  103. qrR(e){
  104. // console.log(e)
  105. }
  106. }
  107. }
  108. </script>
  109. <style lang="scss" scoped>
  110. .bg{z-index: -1;width: 100%;height: auto;position: fixed;left: 0;top: 100rpx;opacity: 0.2;}
  111. .qrimg{min-height: 100rpx;}
  112. .content{text-align: center;padding: 60vh 24rpx 24rpx;}
  113. .content.fixed{position: absolute;left: 0;top: 60vh;right: 0;padding-top: 0;}
  114. .content .tip{font-size: 36rpx;margin: 0 24rpx;text-align: left;text-indent: 2em;}
  115. .code-text{margin: 24rpx auto;text-align: center;}
  116. .code-id{font-size: 36rpx;font-weight: bold;}
  117. .thanks{margin-top: 100rpx;}
  118. // @import './mycode.scss'
  119. </style>