coupon.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <view class="container home clearfix">
  3. <view class="coupon-title" v-if="userIdentity == 4">优惠券仅限{{userName}}(机构)使用 </view>
  4. <view class="coupon-title" v-if="userIdentity == 2">优惠券仅限{{userName}}使用 </view>
  5. <image class="coupon-image" src="http://static.caimei365.com/app/meibohui/meibo_coupon_04.jpg" mode=""></image>
  6. </view>
  7. </template>
  8. <script>
  9. import { mapState,mapMutations} from 'vuex';
  10. export default {
  11. components:{
  12. },
  13. data() {
  14. return {
  15. userName:'',
  16. userIdentity:0
  17. }
  18. },
  19. onLoad() {
  20. },
  21. computed: {
  22. ...mapState(['hasLogin','userInfo','identity','isActivity'])
  23. },
  24. methods: {
  25. },
  26. onShow(){
  27. this.$api.getComStorage('userInfo').then((resolve) =>{
  28. this.userName = resolve.name;
  29. this.userIdentity = resolve.userIdentity
  30. }).catch(error =>{
  31. })
  32. }
  33. }
  34. </script>
  35. <style lang="scss">
  36. page{
  37. background-color: #ff2e4c;
  38. }
  39. .container{
  40. width: 100%;
  41. height: auto;
  42. .coupon-title{
  43. width: 100%;
  44. height: 110rpx;
  45. line-height: 110rpx;
  46. font-size: $font-size-28;
  47. font-weight: bold;
  48. background-image: linear-gradient(0deg, #fffaec 0%, #fff7d6 50%, #fff4b9 100%), linear-gradient(#fffaef, #fffaef);
  49. box-sizing: border-box;
  50. padding: 0 24rpx;
  51. white-space: nowrap;
  52. text-overflow: ellipsis;
  53. overflow: hidden;
  54. color: #fd3c5b;
  55. text-align: center;
  56. }
  57. .coupon-image{
  58. width: 100%;
  59. height: 2381rpx;
  60. display: block;
  61. }
  62. }
  63. </style>