SxhGroup / sxhPersonalCenterZLB

Download as
Browse Code »

Commit 0550164092a07211012f4299b48e43e6e97ebb25

Authored by 夏洋涛
1 parent f4a31a2f
Exists in master

feat:视频播放修改

Showing 6 changed files with 345 additions and 462 deletions   Show diff stats
src/App.vue
  Diff comments   View file @0550164
... ... @@ -12,42 +12,20 @@ export default {
12 12 }
13 13 },
14 14 watch: {
15   - $route(to, from) {
16   - console.log('zheliban 》》》 ', to, from)
17   - this.$zwlogPvGlobal({ url: to.meta.pagePath, enterPageTime: new Date() })
18   - this.$zwlogPvGlobal({
19   - url: from.meta.pagePath,
20   - leavePageTime: new Date(),
21   - })
22   - },
  15 + // $route(to, from) {
  16 + // console.log('zheliban 》》》 ', to, from)
  17 + // this.$zwlogPvGlobal({ url: to.meta.pagePath, enterPageTime: new Date() })
  18 + // this.$zwlogPvGlobal({
  19 + // url: from.meta.pagePath,
  20 + // leavePageTime: new Date(),
  21 + // })
  22 + // },
23 23 },
24 24 mounted() {
25   - ZWJSBridge.onReady(() => {
26   - console.log('初始化完成后，执行bridge方法')
27   - })
28 25 const isElder = localStorage.getItem('isElder')
29 26 if (isElder) {
30 27 this.isElder = true
31   - } else {
32   - ZWJSBridge.getUiStyle({})
33   - .then((result) => {
34   - console.log(result)
35   - if (result.uiStyle == 'elder') {
36   - this.isElder = true
37   - localStorage.setItem('isElder', 1)
38   - }
39   - })
40   - //浙里办APP 6.11.0 版本以下版本标准模式兼容
41   - .catch((error) => {
42   - console.log(error)
43   - })
44   - }
45   - // 健康地址调用
46   - this.yxAxios.get(`https://ocp.sxsedu.net/szsh/health/check`).then((res) => {
47   - console.log('健康地址:', JSON.stringify(res.data))
48   - const bodyElement = document.getElementsByTagName('body')[0]
49   - bodyElement.append(JSON.stringify(res.data))
50   - })
  28 + }
51 29 },
52 30 methods: {
53 31 setElder(e) {
... ...
src/router/index.js
  Diff comments   View file @0550164
... ... @@ -23,7 +23,6 @@ import StudentDetail from '@/views/Home/StudentDetail.vue' //学生信息
23 23 import payneed from '@/views/Service/payneed.vue' //购买须知
24 24 import protocol from '@/views/Service/protocol.vue' //用户协议
25 25  
26   -
27 26 import schoolFollow from '@/views/Travel/schoolFollow.vue' //已关注学校列表
28 27 import schoolAttestation from '@/views/Travel/schoolAttestation.vue' //已认证学校列表
29 28 import classAttestation from '@/views/Travel/classAttestation.vue' //已集团权限年级班级列表
... ... @@ -44,328 +43,337 @@ import studyList from '@/views/dayStudy/studyList.vue' //每日一习主页面
44 43 import summerVacation from '@/views/dayStudy/summerVacation.vue' //每日一习主页面
45 44 import ans_question from '@/views/answerRank/ans_question.vue' //答题
46 45 import switchUser from '@/views/answerRank/switchUser.vue' //切换
  46 +import video from '@/views/dayStudy/video.vue' //视频播放
47 47 import store from '../store'
48 48  
49 49 Vue.use(VueRouter)
50   -const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace];
51   -VueRouter.prototype.push = function push (to) {
52   - return routerPush.call(this, to).catch(err => err)
  50 +const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace]
  51 +VueRouter.prototype.push = function push(to) {
  52 + return routerPush.call(this, to).catch((err) => err)
  53 +}
  54 +VueRouter.prototype.replace = function replace(location) {
  55 + return routerReplace.call(this, location).catch((error) => error)
53 56 }
54   -VueRouter.prototype.replace = function replace (location) {
55   - return routerReplace.call(this, location).catch(error => error);
56   -};
57   -const routes = [{
  57 +const routes = [
  58 + {
58 59 path: '/',
59 60 name: 'ServiceKQ',
60 61 component: ServiceKQ,
61 62 meta: {
62   - title: '红色网上游'
63   - }
64   -}, {
  63 + title: '红色网上游',
  64 + },
  65 + },
  66 + {
65 67 path: '/home',
66 68 name: 'Home',
67 69 component: Home,
68 70 meta: {
69   - title: '红色网上游'
70   - }
71   -},
72   -{
  71 + title: '红色网上游',
  72 + },
  73 + },
  74 + {
73 75 path: '/home_user_info',
74 76 name: 'HomeUserInfo',
75 77 component: HomeUserInfo,
76 78 meta: {
77   - title: '红色网上游'
78   - }
79   -},
80   -{
  79 + title: '红色网上游',
  80 + },
  81 + },
  82 + {
81 83 path: '/abroad_detail',
82 84 name: 'ServiceAbroadDetail',
83 85 component: ServiceAbroadDetail,
84 86 meta: {
85   - title: '红色网上游'
86   - }
87   -},
  87 + title: '红色网上游',
  88 + },
  89 + },
88 90  
89   -
90   -{
  91 + {
91 92 path: '/service_orderXST',
92 93 name: 'ServiceOrderXST',
93 94 component: ServiceOrderXST,
94 95 meta: {
95   - title: '我的评价'
96   - }
97   -},
98   -{
  96 + title: '我的评价',
  97 + },
  98 + },
  99 + {
99 100 path: '/evaluateCourse',
100 101 name: 'evaluateCourse',
101 102 component: evaluateCourse,
102 103 meta: {
103   - title: '评价'
104   - }
105   -},
106   -{
  104 + title: '评价',
  105 + },
  106 + },
  107 + {
107 108 path: '/evaluateBase',
108 109 name: 'evaluateBase',
109 110 component: evaluateBase,
110 111 meta: {
111   - title: '基地评价'
112   - }
113   -},
114   -{
  112 + title: '基地评价',
  113 + },
  114 + },
  115 + {
115 116 path: '/evaluateDetail',
116 117 name: 'evaluateDetail',
117 118 component: evaluateDetail,
118 119 meta: {
119   - title: '评价详情'
120   - }
121   -},
122   -{
  120 + title: '评价详情',
  121 + },
  122 + },
  123 + {
123 124 path: '/service_abroad_evaluate',
124 125 name: 'ServiceAbroadEvaluate',
125 126 component: ServiceAbroadEvaluate,
126 127 meta: {
127   - title: '评价'
128   - }
129   -},
130   -{
  128 + title: '评价',
  129 + },
  130 + },
  131 + {
131 132 path: '/YanxueCode',
132 133 name: 'YanxueCode',
133 134 component: YanxueCode,
134 135 meta: {
135   - title: '研学码'
136   - }
137   -},
138   -{
  136 + title: '研学码',
  137 + },
  138 + },
  139 + {
139 140 path: '/YanxueInfo',
140 141 name: 'YanxueInfo',
141 142 component: YanxueInfo,
142 143 meta: {
143   - title: '研学码信息'
144   - }
145   -},
146   -{
  144 + title: '研学码信息',
  145 + },
  146 + },
  147 + {
147 148 path: '/chooseSchool',
148 149 name: 'chooseSchool',
149 150 component: chooseSchool,
150 151 meta: {
151   - title: '选择学校'
152   - }
153   -},
154   -{
  152 + title: '选择学校',
  153 + },
  154 + },
  155 + {
155 156 path: '/select_contact',
156 157 name: 'SelectContact',
157 158 component: SelectContact,
158 159 meta: {
159   - title: '选择出行人'
160   - }
161   -},
162   -{
  160 + title: '选择出行人',
  161 + },
  162 + },
  163 + {
163 164 path: '/edit_contact',
164 165 name: 'EditContact',
165 166 component: EditContact,
166 167 meta: {
167   - title: '修改出行人'
168   - }
169   -},
170   -{
  168 + title: '修改出行人',
  169 + },
  170 + },
  171 + {
171 172 path: '/MyClassList',
172 173 name: 'MyClassList',
173 174 component: MyClassList,
174 175 meta: {
175   - title: '基地签到'
176   - }
177   -},
178   -{
  176 + title: '基地签到',
  177 + },
  178 + },
  179 + {
179 180 path: '/StudentDetail',
180 181 name: 'StudentDetail',
181 182 component: StudentDetail,
182 183 meta: {
183   - title: '学生信息'
184   - }
185   -},
186   -{
  184 + title: '学生信息',
  185 + },
  186 + },
  187 + {
187 188 path: '/payneed',
188 189 name: 'payneed',
189 190 component: payneed,
190 191 meta: {
191   - title: '购买须知'
192   - }
193   -},
194   -{
  192 + title: '购买须知',
  193 + },
  194 + },
  195 + {
195 196 path: '/protocol',
196 197 name: 'protocol',
197 198 component: protocol,
198 199 meta: {
199   - title: '用户协议'
200   - }
201   -},
202   -{
  200 + title: '用户协议',
  201 + },
  202 + },
  203 + {
203 204 path: '/schoolFollow',
204 205 name: 'schoolFollow',
205 206 component: schoolFollow,
206 207 meta: {
207   - title: '关注学校'
208   - }
209   -},
210   -{
  208 + title: '关注学校',
  209 + },
  210 + },
  211 + {
211 212 path: '/schoolAttestation',
212 213 name: 'schoolAttestation',
213 214 component: schoolAttestation,
214 215 meta: {
215   - title: '已认证学校'
216   - }
217   -},
218   -{
  216 + title: '已认证学校',
  217 + },
  218 + },
  219 + {
219 220 path: '/classAttestation',
220 221 name: 'classAttestation',
221 222 component: classAttestation,
222 223 meta: {
223   - title: '集团认领'
224   - }
225   -},
226   -{
  224 + title: '集团认领',
  225 + },
  226 + },
  227 + {
227 228 path: '/YanxuePage',
228 229 name: 'YanxuePage',
229 230 component: YanxuePage,
230 231 meta: {
231   - title: '每日一习'
232   - }
233   -},
234   -{
  232 + title: '每日一习',
  233 + },
  234 + },
  235 + {
235 236 path: '/achievements',
236 237 name: 'achievements',
237 238 component: achievements,
238 239 meta: {
239   - title: '研学成果'
240   - }
241   -},
242   -{
  240 + title: '研学成果',
  241 + },
  242 + },
  243 + {
243 244 path: '/achievementsOne',
244 245 name: 'achievementsOne',
245 246 component: achievementsOne,
246 247 meta: {
247   - title: '研学成果'
248   - }
249   -},
250   -{
  248 + title: '研学成果',
  249 + },
  250 + },
  251 + {
251 252 path: '/chooseSchoolOne',
252 253 name: 'chooseSchoolOne',
253 254 component: chooseSchoolOne,
254 255 meta: {
255   - title: '选择学校'
256   - }
257   -},
258   -{
  256 + title: '选择学校',
  257 + },
  258 + },
  259 + {
259 260 path: '/pageDetails',
260 261 name: 'pageDetails',
261 262 component: pageDetails,
262 263 meta: {
263   - title: '研学成果'
264   - }
265   -},
266   -{
  264 + title: '研学成果',
  265 + },
  266 + },
  267 + {
267 268 path: '/rank',
268 269 name: 'rank',
269 270 component: rank,
270 271 meta: {
271   - title: '排行榜'
272   - }
273   -},
274   -{
  272 + title: '排行榜',
  273 + },
  274 + },
  275 + {
275 276 path: '/ans_rank',
276 277 name: 'ans_rank',
277 278 component: ans_rank,
278 279 meta: {
279   - title: '排行榜'
280   - }
281   -},
282   -{
  280 + title: '排行榜',
  281 + },
  282 + },
  283 + {
283 284 path: '/brush_questions',
284 285 name: 'brush_questions',
285 286 component: brush_questions,
286 287 meta: {
287   - title: '刷题记录'
288   - }
289   -},
290   -{
  288 + title: '刷题记录',
  289 + },
  290 + },
  291 + {
291 292 path: '/category',
292 293 name: 'category',
293 294 component: category,
294 295 meta: {
295   - title: '题库'
296   - }
297   -},
298   -{
  296 + title: '题库',
  297 + },
  298 + },
  299 + {
299 300 path: '/stars',
300 301 name: 'stars',
301 302 component: stars,
302 303 meta: {
303   - title: '五星少年'
304   - }
305   -},
306   -{
  304 + title: '五星少年',
  305 + },
  306 + },
  307 + {
307 308 path: '/dayStudy',
308 309 name: 'dayStudy',
309 310 component: dayStudy,
310 311 meta: {
311   - title: '每日一习'
312   - }
313   -},
314   -{
  312 + title: '每日一习',
  313 + },
  314 + },
  315 + {
315 316 path: '/studyList',
316 317 name: 'studyList',
317 318 component: studyList,
318 319 meta: {
319   - title: '每日一习'
320   - }
321   -},
322   -{
  320 + title: '每日一习',
  321 + },
  322 + },
  323 + {
323 324 path: '/summerVacation',
324 325 name: 'summerVacation',
325 326 component: summerVacation,
326 327 meta: {
327   - title: '每日一习'
328   - }
329   -},
330   -{
  328 + title: '每日一习',
  329 + },
  330 + },
  331 + {
  332 + path: '/video',
  333 + name: 'video',
  334 + component: video,
  335 + meta: {
  336 + title: '视频',
  337 + },
  338 + },
  339 + {
331 340 path: '/ans_question',
332 341 name: 'ans_question',
333 342 component: ans_question,
334 343 meta: {
335   - title: '答题'
336   - }
337   -},
338   -{
  344 + title: '答题',
  345 + },
  346 + },
  347 + {
339 348 path: '/switchUser',
340 349 name: 'switchUser',
341 350 component: switchUser,
342 351 meta: {
343   - title: '切换用户'
344   - }
345   -},
346   -{
  352 + title: '切换用户',
  353 + },
  354 + },
  355 + {
347 356 path: '/YanxueDetail',
348 357 name: 'YanxueDetail',
349 358 component: YanxueDetail,
350   - meta: {}
351   -},
352   -
  359 + meta: {},
  360 + },
353 361 ]
354 362 const router = new VueRouter({
355   - mode: 'hash',
356   - // base: process.env.BASE_URL+'/center',
357   - base: process.env.BASE_URL,
358   - routes
  363 + mode: 'hash',
  364 + // base: process.env.BASE_URL+'/center',
  365 + base: process.env.BASE_URL,
  366 + routes,
359 367 })
360 368 router.beforeEach((to, from, next) => {
361   - /* 路由发生变化修改页面title */
362   - if (to.meta.title) {
363   - // document.title = to.meta.title
364   - ZWJSBridge.setTitle({
365   - "title": to.meta.title
366   - })
367   - }
368   - next()
  369 + /* 路由发生变化修改页面title */
  370 + if (to.meta.title) {
  371 + // document.title = to.meta.title
  372 + ZWJSBridge.setTitle({
  373 + title: to.meta.title,
  374 + })
  375 + }
  376 + next()
369 377 })
370 378  
371   -export default router
372 379 \ No newline at end of file
  380 +export default router
... ...
src/views/Service/ServiceKQ.vue
  Diff comments   View file @0550164
... ... @@ -13,151 +13,8 @@ export default {
13 13 }
14 14 },
15 15 mounted() {
16   - console.log('xst mounted')
17   - // this.checkAuth()
18   - //二次回退
19   - const sUserAgent = window.navigator.userAgent.toLowerCase()
20   - const bIsAlipayMini = sUserAgent.indexOf('miniprogram') > -1 && sUserAgent.indexOf('alipay') > -1
21   - if (bIsAlipayMini) {
22   - console.log('我来自支付宝,popstate')
23   - window.addEventListener('popstate', this.listenerPopstate, true)
24   - } else {
25   - console.log('我来自浙里办,popstate')
26   - window.addEventListener('popstate', this.listenerPopstate, true)
27   - }
28   - },
29   - //销毁监听
30   - destroyed() {
31   - console.log('销毁支付宝监听')
32   - window.removeEventListener('popstate', this.listenerPopstate, true)
33 16 },
34 17 methods: {
35   - //支付宝二次回退方法，addEventListener和removeEventListener一定要调用方法，不然无效
36   - listenerPopstate() {
37   - ZWJSBridge.close()
38   - },
39   - checkAuth() {
40   - let centerNo = localStorage.getItem('centerNo')
41   - let ticket = this.common.getUrlParam('ticket') //浙里办app访问
42   - let ticketId = this.common.getUrlParam('ticketId') //浙里办微信小程序访问
43   - if (centerNo) {
44   - // alert('有中台编号：' + centerNo)
45   - this.centerNo = centerNo
46   - localStorage.setItem('centerNo', centerNo)
47   - this.getUserInfo()
48   - } else if (ticket && ticket.indexOf('debug') == -1) {
49   - // ZWJSBridge.alert({
50   - // message: '有ticket：' + ticket,
51   - // })
52   - this.getCenterByTicket(ticket)
53   - } else if (ticketId && ticketId.indexOf('debug') == -1) {
54   - // ZWJSBridge.alert({
55   - // message: '有ticketId：' + ticketId,
56   - // })
57   - this.getCenterByTicketId(ticketId)
58   - localStorage.setItem('isWechat', 1)
59   - } else {
60   - const sUserAgent = window.navigator.userAgent.toLowerCase()
61   - const dtdreamweb = sUserAgent.indexOf('dtdreamweb') > -1
62   - const miniprogram = sUserAgent.indexOf('miniprogram') > -1 && sUserAgent.indexOf('alipay') > -1
63   - if (dtdreamweb) {
64   - // alert('浙里办')
65   - window.location.href = `https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=82a7a71edb794fc285895f9e33290ddc`
66   - } else if (miniprogram) {
67   - // alert('支付宝')
68   - window.location.href = `https://puser.zjzwfw.gov.cn/sso/alipay.do?action=ssoLogin&servicecode=82a7a71edb794fc285895f9e33290ddc`
69   - } else {
70   - alert('非浙里办渠道访问，显示测试用户数据')
71   - console.log('非浙里办渠道访问，显示测试用户数据', userData)
72   - this.centerNo = '2022031508525674030748540013076'
73   - localStorage.setItem('centerNo', '2022031508525674030748540013076')
74   - let userInfo = JSON.stringify(userData)
75   - localStorage.setItem('userInfo', userInfo)
76   - this.getUserInfo()
77   - }
78   - }
79   - },
80   - // 通过ticket获取centerNo
81   - getCenterByTicket(ticket) {
82   - this.yxAxios.get(`${this.proxyUrl}/api/third/getCenterNo?ticket=${ticket}`).then((res) => {
83   - if (res.data.code == 200) {
84   - console.log('通过ticket获取centerNo成功:', res.data)
85   - this.centerNo = res.data.message
86   - localStorage.setItem('centerNo', res.data.message)
87   - this.getUserInfo()
88   - } else {
89   - console.log('通过ticket获取centerNo失败:', res.data.code)
90   - this.reLoad()
91   - }
92   - })
93   - },
94   - // 通过ticketId获取centerNo
95   - getCenterByTicketId(ticketId) {
96   - // alert(ticketId)
97   - this.yxAxios.get(`${this.proxyUrl}/api/third/getCenterNoWx?ticket=${ticketId}`).then((res) => {
98   - if (res.data.code == 200) {
99   - console.log('通过ticketId获取centerNo成功:', res.data)
100   - this.centerNo = res.data.message
101   - localStorage.setItem('centerNo', res.data.message)
102   - this.getUserInfo()
103   - } else {
104   - console.log('通过ticketId获取centerNo失败:', res.data.code)
105   - this.reLoad()
106   - }
107   - })
108   - },
109   - reLoad() {
110   - console.log('reload')
111   - const sUserAgent = window.navigator.userAgent.toLowerCase()
112   - const dtdreamweb = sUserAgent.indexOf('dtdreamweb') > -1
113   - const miniprogram = sUserAgent.indexOf('miniprogram') > -1 && sUserAgent.indexOf('alipay') > -1
114   - // if (localStorage.getItem('reloadCount') == 2) {
115   - // localStorage.setItem('reloadCount', 1)
116   - // ZWJSBridge.confirm({
117   - // title: '警告',
118   - // buttonLabels: ['重新载入'],
119   - // message: '用户身份验证失败，请重新加载',
120   - // }).then((res) => {
121   - // if (dtdreamweb) {
122   - // // alert('浙里办')
123   - // window.location.href = `https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=82a7a71edb794fc285895f9e33290ddc`
124   - // } else if (miniprogram) {
125   - // // alert('支付宝')
126   - // window.location.href = `https://puser.zjzwfw.gov.cn/sso/alipay.do?action=ssoLogin&servicecode=82a7a71edb794fc285895f9e33290ddc`
127   - // } else {
128   - // // alert('浙里办')
129   - // window.location.href = `https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=82a7a71edb794fc285895f9e33290ddc`
130   - // }
131   - // })
132   - // } else {
133   - // localStorage.setItem('reloadCount', 2)
134   - if (miniprogram) {
135   - // alert('支付宝')
136   - window.location.href = `https://puser.zjzwfw.gov.cn/sso/alipay.do?action=ssoLogin&servicecode=82a7a71edb794fc285895f9e33290ddc`
137   - } else {
138   - // alert('浙里办')
139   - window.location.href = `https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=82a7a71edb794fc285895f9e33290ddc`
140   - }
141   - // }
142   - },
143   - // 获取用户信息
144   - getUserInfo() {
145   - this.centerNo = localStorage.getItem('centerNo')
146   - // alert('getUserInfo:' + this.centerNo)
147   - this.yxAxios.post(`${this.proxyUrl}/user/info/getPortalUserByNumV2?userNum=${localStorage.getItem('centerNo')}`).then((res) => {
148   - console.log('获取用户信息getPortalUserByNum:', res)
149   - if (res.data.code == 200) {
150   - let userInfo = res.data.data.userInfo
151   - localStorage.setItem('userInfo', JSON.stringify(userInfo))
152   - this.userInfo = userInfo
153   - localStorage.setItem('_user_nick', userInfo.travelerName)
154   - this.$zwlogPvGlobal({ loadTime: new Date() })
155   - this.$nextTick(() => {
156   - this.$zwlogPvGlobal({ responseTime: new Date() })
157   - })
158   - }
159   - })
160   - },
161 18 },
162 19 components: {
163 20 ServiceBasekq,
... ...
src/views/dayStudy/studyList.vue
  Diff comments   View file @0550164
1 1 <template>
2   - <div class="box">
3   - <div class="card" v-for="(v, i) in videoList" :key="i" @click="toPath(v)">
4   - <div class="card_pic">
5   - <img :src="v.url" />
6   - </div>
7   - <div class="card_context">
8   - <div class="title">{{v.title}}</div>
9   - <div class="group_font">{{v.greyTitle}}</div>
10   - </div>
11   - </div>
12   -
  2 + <div class="box">
  3 + <div class="card" v-for="(v, i) in videoList" :key="i" @click="toPath(v)">
  4 + <div class="card_pic">
  5 + <img :src="v.url" />
  6 + </div>
  7 + <div class="card_context">
  8 + <div class="title">{{ v.title }}</div>
  9 + <div class="group_font">{{ v.greyTitle }}</div>
  10 + </div>
13 11 </div>
  12 + </div>
14 13 </template>
15 14  
16 15 <script>
17 16 import videoList from '@/views/dayStudy/data.json'
18 17 export default {
19   - data() {
20   - return {
21   - };
  18 + data() {
  19 + return {}
  20 + },
  21 + computed: {
  22 + videoList() {
  23 + return videoList
22 24 },
23   - computed: {
24   - videoList() {
25   - return videoList
26   - }
  25 + },
  26 + methods: {
  27 + toPath(val) {
  28 + console.log(val)
  29 + this.$router.push({
  30 + name: 'video',
  31 + query: {
  32 + url: val.videoUrl,
  33 + },
  34 + })
27 35 },
28   - methods: {
29   - toPath(val) {
30   - console.log(val)
31   - window.open(val.videoUrl)
32   - }
33   - }
34   -};
  36 + },
  37 +}
35 38 </script>
36 39  
37 40 <style lang="scss" scoped>
38 41 .box {
39   - padding-bottom: 30px;
40   - box-sizing: border-box;
  42 + padding-bottom: 30px;
  43 + box-sizing: border-box;
  44 +
  45 + .card {
  46 + width: 100vw;
  47 + height: 535px;
  48 + background-color: #fff;
  49 + margin-bottom: 30px;
  50 +
  51 + .card_pic {
  52 + height: 400px;
  53 +
  54 + img {
  55 + width: 100%;
  56 + height: 100%;
  57 + }
  58 + }
  59 + .card_context {
  60 + height: calc(535px - 400px);
  61 + padding: 25px 50px 10px;
  62 + box-sizing: border-box;
  63 + display: flex;
  64 + align-content: space-between;
  65 + flex-wrap: wrap;
41 66  
42   - .card {
43   - width: 100vw;
44   - height: 535px;
45   - background-color: #fff;
46   - margin-bottom: 30px;
47   -
48   - .card_pic {
49   - height: 400px;
50   -
51   - img {
52   - width: 100%;
53   - height: 100%;
54   - }
55   - }
56   - .card_context {
57   - height: calc(535px - 400px);
58   - padding: 25px 50px 10px;
59   - box-sizing: border-box;
60   - display: flex;
61   - align-content: space-between;
62   - flex-wrap: wrap;
63   -
64   - .title {
65   - width: 100%;
66   - font-weight: bold;
67   - font-size: 32px;
68   - }
69   - .group_font {
70   - font-size: 28px;
71   - color: #999;
72   - }
73   - }
  67 + .title {
  68 + width: 100%;
  69 + font-weight: bold;
  70 + font-size: 32px;
  71 + }
  72 + .group_font {
  73 + font-size: 28px;
  74 + color: #999;
  75 + }
74 76 }
  77 + }
75 78 }
76   -</style>
77 79 \ No newline at end of file
  80 +</style>
... ...
src/views/dayStudy/summerVacation.vue
  Diff comments   View file @0550164
1 1 <template>
2   - <div class="box">
3   - <div class="card" v-for="(v, i) in videoList" :key="i" @click="toPath(v)">
4   - <div class="card_pic">
5   - <img :src="v.url" />
6   - </div>
7   - <div class="card_context">
8   - <div class="title">{{v.title}}</div>
9   - <div class="group_font">{{v.greyTitle}}</div>
10   - </div>
11   - </div>
12   -
  2 + <div class="box">
  3 + <div class="card" v-for="(v, i) in videoList" :key="i" @click="toPath(v)">
  4 + <div class="card_pic">
  5 + <img :src="v.url" />
  6 + </div>
  7 + <div class="card_context">
  8 + <div class="title">{{ v.title }}</div>
  9 + <div class="group_font">{{ v.greyTitle }}</div>
  10 + </div>
13 11 </div>
  12 + </div>
14 13 </template>
15 14  
16 15 <script>
17 16 import videoList from '@/views/dayStudy/data2.json'
18 17 export default {
19   - data() {
20   - return {
21   - };
  18 + data() {
  19 + return {}
  20 + },
  21 + computed: {
  22 + videoList() {
  23 + return videoList
22 24 },
23   - computed: {
24   - videoList() {
25   - return videoList
26   - }
  25 + },
  26 + methods: {
  27 + toPath(val) {
  28 + console.log(val)
  29 + this.$router.push({
  30 + name: 'video',
  31 + query: {
  32 + url: val.videoUrl,
  33 + },
  34 + })
27 35 },
28   - methods: {
29   - toPath(val) {
30   - console.log(val)
31   - window.open(val.videoUrl)
32   - }
33   - }
34   -};
  36 + },
  37 +}
35 38 </script>
36 39  
37 40 <style lang="scss" scoped>
38 41 .box {
39   - padding-bottom: 30px;
40   - box-sizing: border-box;
  42 + padding-bottom: 30px;
  43 + box-sizing: border-box;
  44 +
  45 + .card {
  46 + width: 100vw;
  47 + height: 535px;
  48 + background-color: #fff;
  49 + margin-bottom: 30px;
  50 +
  51 + .card_pic {
  52 + height: 400px;
  53 +
  54 + img {
  55 + width: 100%;
  56 + height: 100%;
  57 + }
  58 + }
  59 + .card_context {
  60 + height: calc(535px - 400px);
  61 + padding: 25px 50px 10px;
  62 + box-sizing: border-box;
  63 + display: flex;
  64 + align-content: space-between;
  65 + flex-wrap: wrap;
41 66  
42   - .card {
43   - width: 100vw;
44   - height: 535px;
45   - background-color: #fff;
46   - margin-bottom: 30px;
47   -
48   - .card_pic {
49   - height: 400px;
50   -
51   - img {
52   - width: 100%;
53   - height: 100%;
54   - }
55   - }
56   - .card_context {
57   - height: calc(535px - 400px);
58   - padding: 25px 50px 10px;
59   - box-sizing: border-box;
60   - display: flex;
61   - align-content: space-between;
62   - flex-wrap: wrap;
63   -
64   - .title {
65   - width: 100%;
66   - font-weight: bold;
67   - font-size: 32px;
68   - }
69   - .group_font {
70   - font-size: 28px;
71   - color: #999;
72   - }
73   - }
  67 + .title {
  68 + width: 100%;
  69 + font-weight: bold;
  70 + font-size: 32px;
  71 + }
  72 + .group_font {
  73 + font-size: 28px;
  74 + color: #999;
  75 + }
74 76 }
  77 + }
75 78 }
76   -</style>
77 79 \ No newline at end of file
  80 +</style>
... ...
src/views/dayStudy/video.vue 0 → 100644
  Diff comments   View file @0550164
... ... @@ -0,0 +1,34 @@
  1 +<template>
  2 + <div class="box">
  3 + <video class="video" :src="videoUrl" controls autoplay></video>
  4 + </div>
  5 +</template>
  6 +
  7 +<script>
  8 +import videoList from '@/views/dayStudy/data2.json'
  9 +export default {
  10 + data() {
  11 + return {
  12 + videoUrl: '',
  13 + }
  14 + },
  15 + mounted() {
  16 + this.videoUrl = decodeURIComponent(this.$route.query.url)
  17 + },
  18 + methods: {},
  19 +}
  20 +</script>
  21 +
  22 +<style lang="scss" scoped>
  23 +.box {
  24 + padding-bottom: 30px;
  25 + box-sizing: border-box;
  26 +
  27 + .video {
  28 + width: 100%;
  29 + position: absolute;
  30 + top: 50%;
  31 + transform: translateY(-50%);
  32 + }
  33 +}
  34 +</style>
... ...