BJ_web_developers / HSpark

Blame view

src/views/cardticket/index.vue 3.62 KB
Edit Raw Normal View History
a72ae217   王富生   第一次提交 
1
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
2
3
4
5
6
7
 
  <template>
    <div class="app-container" style="padding: 0px">
      <!--卡券 sta-->
      <el-row :gutter="16" class="">
        <el-col :span="6" v-for="(ticket,id) in ticketList" :key="id" class="margin-bottom16">
          <el-card class="box-card">
ea291b39   王富生   提交登陆 
8
9
10
11
 
            <div class="ticket-title boxshadow-4 eff-bgcolor " >
              <div class=" float-left eff-icon"></div>
              <div class="ticket-name hs-hidden-nowrap hs-cursor-pointer float-left" >{{ticket.orgName}}-{{ticket.cardName}}</div>
              <div class="ticket-oper float-right">有效</div>
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
12
13
 
            </div>
            <div class="ticket-content">
ea291b39   王富生   提交登陆 
14
15
16
 
              <div class="ticket-main clearfix" >
                <div class=" hs-hidden-nowrap hs-cursor-pointer float-left ticket-effmoney"  >{{ticket.fullCutValue | fen2Yuan}}</div>
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
17
18
 
                <div class="ticket-notes float-left">元 优惠券</div>
              </div>
ea291b39   王富生   提交登陆 
19
 
              <div class="ticket-time">有效时间:{{ticket.endTime | string2Date(1)}}</div>
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
20
21
22
23
 
            </div>
          </el-card>
        </el-col>
      </el-row>
a72ae217   王富生   第一次提交 
24
25
26
27
 
    </div>
  </template>
  
  <script>
ea291b39   王富生   提交登陆 
28
 
    import {getCouponPerson} from '@/api/cardticket.js';
a72ae217   王富生   第一次提交 
29
 
  export default {
a72ae217   王富生   第一次提交 
30
31
 
    data() {
      return {
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
32
 
        ticketList:[
ea291b39   王富生   提交登陆 
33
 
          /*{
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
34
35
36
37
38
39
 
            id:'123',
            ptype:'1',
            plname:'静雅地上停车场',
            pname:'有效',
            pmoney:'50',
            ptime:'2019/8/30',
ea291b39   王富生   提交登陆 
40
 
          }*/
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
41
 
        ]
a72ae217   王富生   第一次提交 
42
43
 
      }
    },
a72ae217   王富生   第一次提交 
44
 
    methods: {
ea291b39   王富生   提交登陆 
45
46
47
48
49
50
51
52
53
54
55
 
      /**查询车主个人卡券*/
      getCouponPerson:function () {
        getCouponPerson().then(response =>{
          if(response.code='8888'){
               this.ticketList=response.data;
          }
        });
      }
    },
    mounted:function () {
      this.getCouponPerson();
a72ae217   王富生   第一次提交 
56
57
58
59
 
    }
  }
  </script>
f53f45e7   Andy   add 我的卡券 账户前端页面 t... 
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
 
  <style lang="scss" scoped>
    .el-card__body{
      padding: 0;
    }
    .ticket-title{
      height: 46px;
      line-height: 46px;
      width: 100%;
    }
    .ticket-content{
      height: 98px;
      width: 100%;
    }
    .eff-bgcolor{
      background-color: rgb(64, 158, 255);
    }
    .off-bgcolor{
      background-color: #909399;
    }
    .eff-icon{
      margin:8px 8px 8px 16px;
      height: 30px;
      width: 30px;
      background-image: url("../../assets/cardticket/card_red.png");
      background-size: 100% 100%;
      background-repeat: no-repeat;
    }
    .off-icon{
      margin:8px 8px 8px 16px;
      height: 30px;
      width: 30px;
      background-image: url("../../assets/cardticket/card_gray.png");
      background-size: 100% 100%;
      background-repeat: no-repeat;
    }
    .ticket-name{
      width:120px;
      height:46px;
      font-size:14px;
      font-weight:500;
      color:rgba(255,255,255,1);
      line-height:46px;
    }
    .ticket-oper{
      font-size:12px;
      font-weight:500;
      color:rgba(255,255,255,1);
      width:42px;
      height:20px;
      line-height: 20px;
      text-align: center;
      border-radius:2px;
      margin-top: 10px;
      margin-right: 16px;
      border:1px solid rgba(255,255,255,1);
    }
    .ticket-main{
      width:100%;
      height:62px;
      .ticket-effmoney{
        font-size:44px;
        font-weight:600;
        color:rgb(64, 158, 255);
        height:62px;
        line-height:62px;
        margin-left: 16px;
        max-width: 120px;
      }
      .ticket-offmoney{
        font-size:44px;
        font-weight:600;
        color:rgba(92,92,92,1);
        height:62px;
        line-height:62px;
        margin-left: 16px;
        max-width: 120px;
      }
      .ticket-notes{
        height: 20px;
        line-height: 20px;
        font-size:14px;
        font-weight:500;
        color:rgba(64,64,64,1);
        width: 70px;
        margin-left: 10px;
        margin-top: 30px;
      }
    }
    .ticket-time{
      width:143px;
      height:20px;
      font-size:14px;
      font-weight:500;
      color:rgba(64,64,64,1);
      line-height:20px;
      margin-left: 16px;
    }
  
  </style>