SxhGroup / sxhPersonalCenterZLB

Download as
Browse Code »

Commit 91ec018f8f18e34d94a037b015879f873fb5a8cd

Authored by 夏洋涛
1 parent 0cf3eb03
Exists in master

feat:新版功能基本搭建，等设计稿

Showing 7 changed files with 125 additions and 299 deletions   Show diff stats
@@ -7,6 +7,10 @@ import store from './store' @@ -7,6 +7,10 @@ import store from './store'
7 import Moment from 'moment' 7 import Moment from 'moment'
8 Vue.prototype.Moment = Moment; 8 Vue.prototype.Moment = Moment;
9 9
  10 +// Vue.prototype.yanxueUrl = 'https://yanxue.myjxt.com';
  11 +
  12 +// import yxAxios from '@/https/yxAxios'
  13 +// Vue.prototype.yxAxios = yxAxios;
10 14
11 import { mgop } from '@aligov/jssdk-mgop'; 15 import { mgop } from '@aligov/jssdk-mgop';
12 Vue.prototype.mgop = mgop; 16 Vue.prototype.mgop = mgop;
src/router/index.js
  Diff comments   View file @91ec018
@@ -33,6 +33,9 @@ import schoolFollow from '@/views/Travel/schoolFollow.vue' //已关注学校列è @@ -33,6 +33,9 @@ import schoolFollow from '@/views/Travel/schoolFollow.vue' //已关注学校列è
33 import schoolAttestation from '@/views/Travel/schoolAttestation.vue' //已认è¯å­¦æ ¡åˆ—表 33 import schoolAttestation from '@/views/Travel/schoolAttestation.vue' //已认è¯å­¦æ ¡åˆ—表
34 import classAttestation from '@/views/Travel/classAttestation.vue' //已集团æƒé™å¹´çº§ç­çº§åˆ—表 34 import classAttestation from '@/views/Travel/classAttestation.vue' //已集团æƒé™å¹´çº§ç­çº§åˆ—表
35 35
  36 +import YanxuePage from '@/views/Yanxue/YanxuePage.vue' //研学
  37 +import YanxueDetail from '@/views/Yanxue/YanxueDetail.vue' //研学
  38 +
36 Vue.use(VueRouter) 39 Vue.use(VueRouter)
37 const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace]; 40 const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace];
38 VueRouter.prototype.push = function push(to) { 41 VueRouter.prototype.push = function push(to) {
@@ -119,7 +122,7 @@ const routes = [{ @@ -119,7 +122,7 @@ const routes = [{
119 name: 'ServiceOrderXST', 122 name: 'ServiceOrderXST',
120 component: ServiceOrderXST, 123 component: ServiceOrderXST,
121 meta: { 124 meta: {
122 - title: '我的订å•' 125 + title: '我的评价'
123 } 126 }
124 }, 127 },
125 { 128 {
@@ -250,6 +253,22 @@ const routes = [{ @@ -250,6 +253,22 @@ const routes = [{
250 title: '集团认领' 253 title: '集团认领'
251 } 254 }
252 }, 255 },
  256 + {
  257 + path: '/YanxuePage',
  258 + name: 'YanxuePage',
  259 + component: YanxuePage,
  260 + meta: {
  261 + title: '研学'
  262 + }
  263 + },
  264 + {
  265 + path: '/YanxueDetail',
  266 + name: 'YanxueDetail',
  267 + component: YanxueDetail,
  268 + meta: {
  269 + title: '研学'
  270 + }
  271 + },
253 272
254 ] 273 ]
255 const router = new VueRouter({ 274 const router = new VueRouter({
src/views/Home/Home.vue
  Diff comments   View file @91ec018
@@ -20,10 +20,10 @@ @@ -20,10 +20,10 @@
20 </div> 20 </div>
21 <HomeOrder></HomeOrder> 21 <HomeOrder></HomeOrder>
22 <div class="function"> 22 <div class="function">
23 - <div class="item" @click="handleMyCard"> 23 + <div class="item" @click="handleYanxue">
24 <div class="left"> 24 <div class="left">
25 <van-icon class="icon" name="discount" /> 25 <van-icon class="icon" name="discount" />
26 - <span>我的优惠券</span> 26 + <span>研学</span>
27 </div> 27 </div>
28 <van-icon name="arrow" /> 28 <van-icon name="arrow" />
29 </div> 29 </div>
@@ -107,9 +107,9 @@ export default { @@ -107,9 +107,9 @@ export default {
107 }, 107 },
108 }, 108 },
109 methods: { 109 methods: {
110 - // 研学码 110 +
111 handleYanxue() { 111 handleYanxue() {
112 - this.$router.push({ name: 'YanxueCode' }) 112 + this.$router.push({ name: 'YanxuePage' })
113 }, 113 },
114 // 我的订单 114 // 我的订单
115 handleOrder() { 115 handleOrder() {
src/views/Home/component/HomeOrder.vue
  Diff comments   View file @91ec018
1 <template> 1 <template>
2 <div class="home_order"> 2 <div class="home_order">
3 <div class="top"> 3 <div class="top">
4 - <p>我的订单</p> 4 + <p>我的评价</p>
5 </div> 5 </div>
6 <div class="icon_box"> 6 <div class="icon_box">
7 <!-- <div @click="handleCustom"> 7 <!-- <div @click="handleCustom">
8 <img src="@/assets/home/icon_kq1.png" alt=""> 8 <img src="@/assets/home/icon_kq1.png" alt="">
9 <p>定制研学</p> 9 <p>定制研学</p>
10 </div> --> 10 </div> -->
11 - <div @click="handleServiceOrder(0)"> 11 + <!-- <div @click="handleServiceOrder(0)">
12 <img src="@/assets/home/icon_kq2.png" alt=""> 12 <img src="@/assets/home/icon_kq2.png" alt="">
13 <p>待付款</p> 13 <p>待付款</p>
14 </div> 14 </div>
15 <div @click="handleServiceOrder(1)"> 15 <div @click="handleServiceOrder(1)">
16 <img src="@/assets/home/icon_kq3.png" alt=""> 16 <img src="@/assets/home/icon_kq3.png" alt="">
17 <p>待使用</p> 17 <p>待使用</p>
18 - </div>  
19 - <div @click="handleServiceOrder(2)">  
20 - <img src="@/assets/home/icon_kq4.png" alt=""> 18 + </div> -->
  19 + <div @click="handleServiceOrder(0)">
  20 + <img src="@/assets/home/icon_kq4.png" alt="" />
21 <p>待评价</p> 21 <p>待评价</p>
22 </div> 22 </div>
23 - <div @click="handleServiceOrder(3)">  
24 - <img src="@/assets/home/icon_kq5.png" alt=""> 23 + <div @click="handleServiceOrder(1)">
  24 + <img src="@/assets/home/icon_kq5.png" alt="" />
25 <p>已评价</p> 25 <p>已评价</p>
26 </div> 26 </div>
27 - 27 + <div></div>
  28 + <div></div>
  29 + <div></div>
28 </div> 30 </div>
29 </div> 31 </div>
30 </template> 32 </template>
31 <script> 33 <script>
32 export default { 34 export default {
33 - props:{  
34 - parent:{  
35 - type:String,  
36 - default:''  
37 - } 35 + props: {
  36 + parent: {
  37 + type: String,
  38 + default: '',
  39 + },
38 }, 40 },
39 methods: { 41 methods: {
40 // 定制研学 42 // 定制研学
41 - handleCustom () {  
42 - this.$toast('暂未开放，敬请期待！'); 43 + handleCustom() {
  44 + this.$toast('暂未开放，敬请期待！')
43 }, 45 },
44 - handleServiceOrder (active) { 46 + handleServiceOrder(active) {
45 this.$router.push({ name: 'ServiceOrderXST', query: { active: active } }) 47 this.$router.push({ name: 'ServiceOrderXST', query: { active: active } })
46 - }  
47 - } 48 + },
  49 + },
48 } 50 }
49 </script> 51 </script>
50 <style lang="scss" scoped> 52 <style lang="scss" scoped>
@@ -68,6 +70,9 @@ export default { @@ -68,6 +70,9 @@ export default {
68 justify-content: space-between; 70 justify-content: space-between;
69 height: 140px; 71 height: 140px;
70 margin-top: 20px; 72 margin-top: 20px;
  73 + div{
  74 + width: 80px;
  75 + }
71 img { 76 img {
72 display: block; 77 display: block;
73 width: 62px; 78 width: 62px;
@@ -81,16 +86,16 @@ export default { @@ -81,16 +86,16 @@ export default {
81 } 86 }
82 </style> 87 </style>
83 <style lang="scss"> 88 <style lang="scss">
84 - .elder{  
85 - .home_order{  
86 - .top{  
87 - p{  
88 - font-size: 44px;  
89 - } 89 +.elder {
  90 + .home_order {
  91 + .top {
  92 + p {
  93 + font-size: 44px;
90 } 94 }
91 - .icon_box p{  
92 - font-size: 34px;  
93 - } 95 + }
  96 + .icon_box p {
  97 + font-size: 34px;
94 } 98 }
95 } 99 }
96 -</style>  
97 \ No newline at end of file 100 \ No newline at end of file
  101 +}
  102 +</style>
src/views/Service/ServiceOrderXST.vue
  Diff comments   View file @91ec018
1 <template> 1 <template>
2 <div class="myOrders"> 2 <div class="myOrders">
3 - <!-- <van-nav-bar title="" left-text="返回首页" left-arrow @click-left="back" /> -->  
4 <van-tabs v-model="active" :before-change="beforeTabChange"> 3 <van-tabs v-model="active" :before-change="beforeTabChange">
5 - <van-tab title="待付款">  
6 - <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadpay()">  
7 - <div class="showBoxDPJ" v-for="(item,index) in paylist" :key="index">  
8 - <div class="topLine">  
9 - <div class="topLineL">订单编号：{{item.orderpaynum}}</div>  
10 - <div class="topLineR" style="color:#F64C37">待付款</div>  
11 - </div>  
12 - <div class="top" @click="toEdit(item)">  
13 - <div class="pic">  
14 - <img :src="item.coverUrl ? item.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">  
15 - </div>  
16 - <div class="basefont">  
17 - <div class="titlefont">{{item.baseName}}</div>  
18 - <div class="tcfont">套餐名称：{{item.courseName}}</div>  
19 - <div class="tcfont">数量*{{item.orderCount}}</div>  
20 - </div>  
21 - <div class="priceRight">¥{{item.paymoney}}</div>  
22 - </div>  
23 - <div class="detailsBox">  
24 - <div class="detailsBoxOne">  
25 - <div>订单创建时间</div>  
26 - <div>{{item.intime.replace(/T/,' ')}}</div>  
27 - </div>  
28 - </div>  
29 - </div>  
30 - </van-list>  
31 - </van-tab>  
32 - <van-tab title="待使用">  
33 - <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadmove()">  
34 - <div class="showBox" v-for="(item,index) in movelist" :key="index">  
35 - <div class="top" @click="toEdit(item)">  
36 - <div class="pic">  
37 - <img :src="item.coverUrl ? item.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">  
38 - </div>  
39 - <div class="basefont">  
40 - <div class="titlefont">{{item.baseName}}</div>  
41 - <div class="tcfont">套餐名称：{{item.courseName}}</div>  
42 - <div class="tcfont">数量*{{item.orderCount}}</div>  
43 - </div>  
44 - <div class="priceRight">¥{{item.paymoney}}</div>  
45 - </div>  
46 - <div class="groupTime">  
47 - <van-icon name="clock-o" /><span class="grey"> 活动日期</span><span> {{item.startDate}} - {{ item.endDate}}</span>  
48 - </div>  
49 - <div class="btnBox">  
50 - <div></div>  
51 - <div>  
52 - <van-button class="btn" type="warning" plain size="small" @click="showPintuanAbout = true" style="margin-right:15px">退款说明</van-button>  
53 - <!-- <van-button type="info" size="small" @click="makeCode(item.id)">核销码</van-button> -->  
54 - <van-button class="btn" type="info" size="small" @click="toCode(item)">核销码</van-button>  
55 - </div>  
56 - </div>  
57 - <div class="detailsBox">  
58 - <div class="detailsBoxOne">  
59 - <div>订单创建时间</div>  
60 - <div>{{item.intime.replace(/T/,' ')}}</div>  
61 - </div>  
62 - <div class="detailsBoxOne">  
63 - <div>订单编号</div>  
64 - <div>{{item.orderpaynum}}</div>  
65 - </div>  
66 - </div>  
67 - </div>  
68 - </van-list>  
69 - </van-tab>  
70 <van-tab title="待评价"> 4 <van-tab title="待评价">
71 <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadCareer()"> 5 <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoadCareer()">
72 <div class="showBoxDPJ" v-for="(item,index) in datalist" :key="index"> 6 <div class="showBoxDPJ" v-for="(item,index) in datalist" :key="index">
@@ -132,58 +66,6 @@ @@ -132,58 +66,6 @@
132 </van-tab> 66 </van-tab>
133 </van-tabs> 67 </van-tabs>
134 68
135 - <!--二维码-->  
136 - <!-- <div class="qrcodeBox" @click.self="qrcodeShow = false" v-show="qrcodeShow">  
137 - <div id="qrcode"></div>  
138 - </div> -->  
139 -  
140 - <!--退款说明-->  
141 - <van-popup v-model="showPintuanAbout" round>  
142 - <div class="pintuan_about">  
143 - <img class="about_img" src="@/assets/service/tip.png" alt="">  
144 - <p class="about_title">退款说明</p>  
145 - <div class="about_box">  
146 - <p class="about_content">1、凡拼团活动报名人数未达最低成团数，本团活动则不开营，系统将在72小时内，全额退还，且不产生违约风险赔偿。</p>  
147 - <p class="about_content">2、如果您因行程发生变动需要取消预订，建议您尽可能提前与平台商户取得联系，并按商品订购须知或该商户旅游合同条款进行退款。</p>  
148 - <p class="about_content" style="font-weight:bold">如若未声明与明确的，按《浙江省境内旅游合同》条款退款。</p>  
149 - <!-- <p class="about_content">（1）出发前7日至4日，支付旅游费用总额的10%。</p>  
150 - <p class="about_content">（2）出发前3日至1日，支付旅游费用总额的15%。</p>  
151 - <p class="about_content">（3）出发当日，支付旅游费用总额的20%。</p> -->  
152 - </div>  
153 - <p class="about_know" @click="showPintuanAbout=false">我知道了</p>  
154 - </div>  
155 - </van-popup>  
156 -  
157 - <van-popup v-model="showCode" round get-container="body">  
158 - <div class="codeCss">  
159 - <div class="showBox">  
160 - <div class="top">  
161 - <div class="pic">  
162 - <img :src="codeData.coverUrl ? codeData.coverUrl : require('@/assets/service/defCoure.jpg')" alt="" style="width:100%;height:100%">  
163 - </div>  
164 - <div class="basefont">  
165 - <div class="titlefont">{{codeData.baseName}}</div>  
166 - <div class="tcfont">套餐名称：{{codeData.courseName}}</div>  
167 - <div class="tcfont">数量*{{codeData.orderCount}}</div>  
168 - </div>  
169 - <!-- <div class="priceRight">¥{{codeData.paymoney}}</div> -->  
170 - </div>  
171 - <div class="groupTime">  
172 - <van-icon name="clock-o" /><span class="grey"> 活动日期</span><span> {{codeData.startDate}} - {{ codeData.endDate}}</span>  
173 - </div>  
174 - <div class="qrcodeBox">  
175 - <div id="qrcode" ref="imageWrapper" v-if="!imgUrl"></div>  
176 - <div class="imgBox">  
177 - <img :src="imgUrl" v-if="imgUrl" style="width:100%;height:100%" />  
178 - </div>  
179 - </div>  
180 - <div class="numShow">  
181 - {{codeData.id}}  
182 - </div>  
183 - <div class="fontBottom">请向工作人员出示</div>  
184 - </div>  
185 - </div>  
186 - </van-popup>  
187 <van-popup v-model="showPreview" round get-container="body"> 69 <van-popup v-model="showPreview" round get-container="body">
188 <img class="preview_img" :src="previewUrl" alt=""> 70 <img class="preview_img" :src="previewUrl" alt="">
189 </van-popup> 71 </van-popup>
@@ -191,25 +73,17 @@ @@ -191,25 +73,17 @@
191 </template> 73 </template>
192 74
193 <script> 75 <script>
194 -import QRCode from 'qrcodejs2' // 引入qrcode  
195 -import html2canvas from "html2canvas"  
196 -// let Base64 = require('js-base64').Base64;  
197 export default { 76 export default {
198 name: 'ServiceOrder', 77 name: 'ServiceOrder',
199 data () { 78 data () {
200 return { 79 return {
201 userInfo: '', 80 userInfo: '',
202 active: 1, 81 active: 1,
203 - paylist: [], //待付款  
204 - movelist: [], //待核销  
205 list: [], //所有 82 list: [], //所有
206 datalist: [], //未评价 83 datalist: [], //未评价
207 loading: false, 84 loading: false,
208 finished: false, 85 finished: false,
209 pageCareerIndex: 0, 86 pageCareerIndex: 0,
210 - qrcodeShow: false,  
211 - showPintuanAbout: false,  
212 - showCode: false,  
213 codeData: {}, 87 codeData: {},
214 imgUrl: '', 88 imgUrl: '',
215 previewUrl: '',//图片预览 89 previewUrl: '',//图片预览
@@ -232,91 +106,17 @@ export default { @@ -232,91 +106,17 @@ export default {
232 } 106 }
233 }, 107 },
234 methods: { 108 methods: {
235 - back () {  
236 - this.$router.push({ name: 'ServiceKQ' })  
237 - },  
238 beforeTabChange (item) { 109 beforeTabChange (item) {
239 console.log(item) 110 console.log(item)
240 - this.paylist = [];  
241 - this.movelist = [];  
242 this.list = []; 111 this.list = [];
243 this.datalist = []; 112 this.datalist = [];
244 if (item == 0) { 113 if (item == 0) {
245 - this.onLoadpay()  
246 - } else if (item == 1) {  
247 - // this.onLoadCareer()  
248 - this.onLoadmove()  
249 - } else if (item == 2) {  
250 this.onLoadCareer() 114 this.onLoadCareer()
251 - } else { 115 + } else if (item == 1) {
252 this.onLoad() 116 this.onLoad()
253 } 117 }
254 return true; 118 return true;
255 }, 119 },
256 - //获取待支付  
257 - onLoadpay () {  
258 - this.mgop({  
259 - api: 'mgop.sz.hswsy.GetOrderPayList', // 必须  
260 - host: 'https://mapi.zjzwfw.gov.cn/',  
261 - dataType: 'JSON',  
262 - type: 'GET',  
263 - appKey: 'fuxgnukl+2001895516+edccpx', // 必须  
264 - headers: {  
265 - // 'isTestUrl': '1'  
266 - },  
267 - data: {  
268 - "userId": localStorage.getItem('centerNo'),  
269 - "type": 1,  
270 - "page": 1,  
271 - "pageSize": 999  
272 - },  
273 - onSuccess: res => {  
274 - console.log('待支付:', res)  
275 - if (res.data.status == 1) {  
276 - this.paylist = res.data.data.list;  
277 - this.loading = false;  
278 - this.finished = true;  
279 - } else {  
280 - this.$toast.fail(res.data.message);  
281 - }  
282 - },  
283 - onFail: err => {  
284 - console.log('err', err)  
285 - }  
286 - });  
287 - },  
288 - //获取已支付  
289 - onLoadmove () {  
290 - this.mgop({  
291 - api: 'mgop.sz.hswsy.GetOrderPayList', // 必须  
292 - host: 'https://mapi.zjzwfw.gov.cn/',  
293 - dataType: 'JSON',  
294 - type: 'GET',  
295 - appKey: 'fuxgnukl+2001895516+edccpx', // 必须  
296 - headers: {  
297 - // 'isTestUrl': '1'  
298 - },  
299 - data: {  
300 - "userId": localStorage.getItem('centerNo'),  
301 - "type": 2,  
302 - "page": 1,  
303 - "pageSize": 999  
304 - },  
305 - onSuccess: res => {  
306 - console.log('已支付:', res)  
307 - if (res.data.status == 1) {  
308 - this.movelist = res.data.data.list;  
309 - this.loading = false;  
310 - this.finished = true;  
311 - } else {  
312 - this.$toast.fail(res.data.message);  
313 - }  
314 - },  
315 - onFail: err => {  
316 - console.log('err', err)  
317 - }  
318 - });  
319 - },  
320 //获取待评价 120 //获取待评价
321 onLoadCareer () { 121 onLoadCareer () {
322 this.mgop({ 122 this.mgop({
@@ -381,48 +181,15 @@ export default { @@ -381,48 +181,15 @@ export default {
381 } 181 }
382 }); 182 });
383 }, 183 },
384 - //生成核销码  
385 - makeCode (id) {  
386 - console.log(id.toString())  
387 - document.getElementById('qrcode').innerHTML = '';  
388 - this.qrcodeShow = true;  
389 -  
390 - let qrcode = new QRCode('qrcode', {  
391 - width: 200,  
392 - height: 200,  
393 - text: id.toString(), // 二维码地址  
394 - })  
395 - this.canvanqrCode()  
396 - },  
397 //评价 184 //评价
398 evaluate (item) { 185 evaluate (item) {
399 window.localStorage.setItem('courseInfo', JSON.stringify(item)) 186 window.localStorage.setItem('courseInfo', JSON.stringify(item))
400 this.$router.push({ name: 'evaluateCourse' }) 187 this.$router.push({ name: 'evaluateCourse' })
401 }, 188 },
402 - //核销码  
403 - toCode (item) {  
404 - this.codeData = {}  
405 - this.showCode = true  
406 - this.codeData = item  
407 - this.imgUrl = ''  
408 - setTimeout(() => {  
409 - this.makeCode(item.id)  
410 - }, 1000);  
411 - },  
412 //跳转 189 //跳转
413 toEdit (item) { 190 toEdit (item) {
414 this.$router.push({ path: 'abroad_detail', query: { courseId: item.courseId } }) 191 this.$router.push({ path: 'abroad_detail', query: { courseId: item.courseId } })
415 }, 192 },
416 - //二维码转图片  
417 - canvanqrCode () {  
418 - html2canvas(this.$refs.imageWrapper, {  
419 - width: 200,  
420 - height: 200  
421 - }).then(canvas => {  
422 - let dataURL = canvas.toDataURL("image/png");  
423 - this.imgUrl = dataURL;  
424 - });  
425 - },  
426 // 预览图片 193 // 预览图片
427 previewImg (url) { 194 previewImg (url) {
428 this.previewUrl = url; 195 this.previewUrl = url;
@@ -444,23 +211,6 @@ export default { @@ -444,23 +211,6 @@ export default {
444 overflow: auto; 211 overflow: auto;
445 background: #f6f7fa; 212 background: #f6f7fa;
446 213
447 - // .qrcodeBox {  
448 - // position: fixed;  
449 - // top: 0;  
450 - // left: 0;  
451 - // bottom: 0;  
452 - // right: 0;  
453 - // background-color: rgba(0, 0, 0, 0.4);  
454 -  
455 - // #qrcode {  
456 - // position: absolute;  
457 - // top: 50%;  
458 - // left: 50%;  
459 - // transform: translate(-50%, -50%);  
460 - // padding: 20px;  
461 - // background: #fff;  
462 - // }  
463 - // }  
464 214
465 .list { 215 .list {
466 padding: 20px; 216 padding: 20px;
@@ -794,21 +544,6 @@ export default { @@ -794,21 +544,6 @@ export default {
794 color: #999999; 544 color: #999999;
795 } 545 }
796 } 546 }
797 - .qrcodeBox {  
798 - width: 100%;  
799 - height: 430px;  
800 -  
801 - #qrcode {  
802 - transform: translate(25%, 10%);  
803 - // margin: auto;  
804 - }  
805 - .imgBox {  
806 - width: 370px;  
807 - height: 370px;  
808 - margin: 30px auto 0;  
809 - // transform: translate(25%, 10%);  
810 - }  
811 - }  
812 .numShow { 547 .numShow {
813 width: 100%; 548 width: 100%;
814 font-size: 28px; 549 font-size: 28px;
src/views/Yanxue/YanxueDetail.vue 0 → 100644
  Diff comments   View file @91ec018
@@ -0,0 +1,25 @@ @@ -0,0 +1,25 @@
  1 +<template>
  2 + <div class="yanxue_detail">
  3 + <img :src="image" alt="">
  4 + </div>
  5 +</template>
  6 +<script>
  7 +import axios from 'axios'
  8 +export default {
  9 + data() {
  10 + return {
  11 + image:''
  12 + }
  13 + },
  14 + mounted() {
  15 + this.image = `https://payment.myjxt.com/zlb_assets/image/${this.$route.query.image}.jpg`
  16 + },
  17 +}
  18 +</script>
  19 +<style lang="scss">
  20 +.yanxue_detail {
  21 + img{
  22 + width: 100%;
  23 + }
  24 +}
  25 +</style>
src/views/Yanxue/YanxuePage.vue 0 → 100644
  Diff comments   View file @91ec018
@@ -0,0 +1,38 @@ @@ -0,0 +1,38 @@
  1 +<template>
  2 + <div class="yanxue_page">
  3 + <p class="item" v-for="(item,index) in listData" :key="index" @click="handleItem(item.title)">{{item.title}}</p>
  4 + </div>
  5 +</template>
  6 +<script>
  7 +import axios from 'axios'
  8 +export default {
  9 + data() {
  10 + return {
  11 + listData:[]
  12 + }
  13 + },
  14 + mounted() {
  15 + this.getList()
  16 + },
  17 + methods: {
  18 + getList() {
  19 + this.$toast.loading('加载中...')
  20 + axios.get(`https://payment.myjxt.com/zlb_assets/yanxue.json`).then((res) => {
  21 + this.$toast.clear()
  22 + console.log('列表：', res.data)
  23 + this.listData = res.data
  24 + })
  25 + },
  26 + handleItem(image){
  27 + this.$router.push({ name: 'YanxueDetail' ,query:{image:image}})
  28 + }
  29 + },
  30 +}
  31 +</script>
  32 +<style lang="scss">
  33 +.yanxue_page {
  34 + .item{
  35 + font-size: 30px;
  36 + }
  37 +}
  38 +</style>