|
@@ -2,7 +2,6 @@
|
|
|
<loading v-if="loading"></loading>
|
|
|
|
|
|
<view v-else class="carVideo">
|
|
|
-
|
|
|
<!-- <topbar>
|
|
|
<van-search shape="round" placeholder="搜索学车视频" @search="search" />
|
|
|
</topbar>
|
|
@@ -44,20 +43,30 @@
|
|
|
<view>
|
|
|
<swiper :indicator-dots="false" style="height: 200rpx">
|
|
|
<swiper-item class="swiperBanner">
|
|
|
- <image class="banner" src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/banner.png"></image>
|
|
|
+ <image
|
|
|
+ class="banner"
|
|
|
+ src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/banner.png"
|
|
|
+ ></image>
|
|
|
</swiper-item>
|
|
|
-
|
|
|
</swiper>
|
|
|
</view>
|
|
|
<view class="carType">
|
|
|
- <view v-for="(item, index) in carType" @click="changeVehicle(item)" :key="index">
|
|
|
- <view @click="
|
|
|
- () => {
|
|
|
- carTypeIndex = index;
|
|
|
- }
|
|
|
- " class="col" :class="{
|
|
|
- col_selected: carTypeIndex == index,
|
|
|
-}">
|
|
|
+ <view
|
|
|
+ v-for="(item, index) in carType"
|
|
|
+ @click="changeVehicle(item)"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ carTypeIndex = index;
|
|
|
+ }
|
|
|
+ "
|
|
|
+ class="col"
|
|
|
+ :class="{
|
|
|
+ col_selected: carTypeIndex == index,
|
|
|
+ }"
|
|
|
+ >
|
|
|
<image :class="['carType-img' + index]" :src="item.img"></image>
|
|
|
<view class="h6"></view>
|
|
|
<text class="carType-title">{{ item.title }}</text>
|
|
@@ -66,10 +75,16 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="point">
|
|
|
- <view :style="{
|
|
|
- left: carTypeIndex * 172 + 'rpx',
|
|
|
- }" class="point-area">
|
|
|
- <image class="" src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/triangle1@2x.png"></image>
|
|
|
+ <view
|
|
|
+ :style="{
|
|
|
+ left: carTypeIndex * 172 + 'rpx',
|
|
|
+ }"
|
|
|
+ class="point-area"
|
|
|
+ >
|
|
|
+ <image
|
|
|
+ class=""
|
|
|
+ src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/triangle1@2x.png"
|
|
|
+ ></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- #ifdef MP-WEIXIN-->
|
|
@@ -97,45 +112,104 @@
|
|
|
</view> -->
|
|
|
<view class="subject">
|
|
|
<view class="subject-tab">
|
|
|
- <view class="subject-slider" :class="{
|
|
|
- 'left0': active == 0,
|
|
|
- 'right0': active == 1
|
|
|
- }"></view>
|
|
|
- <view @click="() => {
|
|
|
- active = 0
|
|
|
- }" class="subject-tabs">
|
|
|
+ <view
|
|
|
+ class="subject-slider"
|
|
|
+ :class="{
|
|
|
+ left0: active == 0,
|
|
|
+ right0: active == 1,
|
|
|
+ }"
|
|
|
+ ></view>
|
|
|
+ <view
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ active = 0;
|
|
|
+ tabQuery.subject =1
|
|
|
+ }
|
|
|
+ "
|
|
|
+ class="subject-tabs"
|
|
|
+ >
|
|
|
<span v-if="active == 0">科目一</span>
|
|
|
- <span style="color: #498EF5;" v-else>科目一</span>
|
|
|
+ <span style="color: #498ef5" v-else>科目一</span>
|
|
|
</view>
|
|
|
- <view @click="() => {
|
|
|
- active = 1
|
|
|
- }" class="subject-tabs">
|
|
|
- <span v-if="active == 1">科目四</span>
|
|
|
- <span style="color: #498EF5;" v-else>科目四</span>
|
|
|
+ <view
|
|
|
+ @click="
|
|
|
+ () => {
|
|
|
+ active = 1;
|
|
|
+ tabQuery.subject =4
|
|
|
+ }
|
|
|
+ "
|
|
|
+ class="subject-tabs"
|
|
|
+ >
|
|
|
+ <span v-if="active == 1">科目四</span>
|
|
|
+ <span style="color: #498ef5" v-else>科目四</span>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
</view>
|
|
|
<view class="tab">
|
|
|
- <scroll-view @scrolltoupper="() => {
|
|
|
- active = 0
|
|
|
- }" @scrolltolower="() => {
|
|
|
- active = 1
|
|
|
-}" scroll-with-animation :scroll-into-view="'tab-container' + (active)" enhanced
|
|
|
- style="width: 100%;white-space: nowrap;" enable-flex :scroll-x="true">
|
|
|
- <view id="tab-container0" style="display:inline-block;white-space:nowrap;">
|
|
|
+ <scroll-view
|
|
|
+ @scrolltoupper="
|
|
|
+ () => {
|
|
|
+ active = 0;
|
|
|
+ tabQuery.subject =1
|
|
|
+
|
|
|
+ }
|
|
|
+ "
|
|
|
+ @scrolltolower="
|
|
|
+ () => {
|
|
|
+ active = 1;
|
|
|
+ tabQuery.subject =4
|
|
|
+ }
|
|
|
+ "
|
|
|
+ scroll-with-animation
|
|
|
+ :scroll-into-view="'tab-container' + active"
|
|
|
+ enhanced
|
|
|
+ style="width: 100%; white-space: nowrap"
|
|
|
+ enable-flex
|
|
|
+ :scroll-x="true"
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ id="tab-container0"
|
|
|
+ style="display: inline-block; white-space: nowrap"
|
|
|
+ >
|
|
|
<view class="tab-container">
|
|
|
- <tab-left :subject="1" :query="tabQuery" :leftList="leftList1"></tab-left>
|
|
|
- <tab-center :subject="1" :query="tabQuery" :centerList="centerList1"></tab-center>
|
|
|
- <tab-right :subject="1" :query="tabQuery" :rightList="rightList1"></tab-right>
|
|
|
+ <tab-left
|
|
|
+ :subject="1"
|
|
|
+ :query="tabQuery"
|
|
|
+ :leftList="leftList1"
|
|
|
+ ></tab-left>
|
|
|
+ <tab-center
|
|
|
+ :subject="1"
|
|
|
+ :query="tabQuery"
|
|
|
+ :centerList="centerList1"
|
|
|
+ ></tab-center>
|
|
|
+ <tab-right
|
|
|
+ :subject="1"
|
|
|
+ :query="tabQuery"
|
|
|
+ :rightList="rightList1"
|
|
|
+ ></tab-right>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <view id="tab-container1" style="display:inline-block;white-space:nowrap;">
|
|
|
+ <view
|
|
|
+ id="tab-container1"
|
|
|
+ style="display: inline-block; white-space: nowrap"
|
|
|
+ >
|
|
|
<view class="tab-container">
|
|
|
- <tab-left :query="tabQuery" :subject="4" :leftList="leftList4"></tab-left>
|
|
|
- <tab-center :query="tabQuery" :subject="4" :centerList="centerList4"></tab-center>
|
|
|
- <tab-right :query="tabQuery" :subject="4" :rightList="rightList4"></tab-right>
|
|
|
+ <tab-left
|
|
|
+ :query="tabQuery"
|
|
|
+ :subject="4"
|
|
|
+ :leftList="leftList4"
|
|
|
+ ></tab-left>
|
|
|
+ <tab-center
|
|
|
+ :query="tabQuery"
|
|
|
+ :subject="4"
|
|
|
+ :centerList="centerList4"
|
|
|
+ ></tab-center>
|
|
|
+ <tab-right
|
|
|
+ :query="tabQuery"
|
|
|
+ :subject="4"
|
|
|
+ :rightList="rightList4"
|
|
|
+ ></tab-right>
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
@@ -143,25 +217,33 @@
|
|
|
|
|
|
<!-- #endif -->
|
|
|
|
|
|
- <view class="splitLine">
|
|
|
-
|
|
|
- </view>
|
|
|
+ <view class="splitLine"> </view>
|
|
|
<view v-if="tabQuery.name !== '教学视频'" class="two">
|
|
|
-
|
|
|
- <view @click="
|
|
|
- goPath(
|
|
|
- '/otherPages/selectRulePaper/index',
|
|
|
- {
|
|
|
- title: '新规秘卷',
|
|
|
- },
|
|
|
- true
|
|
|
- )
|
|
|
- " class="two-item">
|
|
|
- <image class="" src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/xingui.png"></image>
|
|
|
- <text style="color: #fff;font-size: 46rpx;top:34rpx" class="twp-text">新规秘卷</text>
|
|
|
- <text style="color: #fff;font-size: 30rpx;top:104rpx" class="twp-text">考前秘籍 直击考点</text>
|
|
|
+ <view
|
|
|
+ @click="
|
|
|
+ goPath(
|
|
|
+ '/otherPages/selectRulePaper/index',
|
|
|
+ {
|
|
|
+ title: '新规秘卷',
|
|
|
+ },
|
|
|
+ true
|
|
|
+ )
|
|
|
+ "
|
|
|
+ class="two-item"
|
|
|
+ >
|
|
|
+ <image
|
|
|
+ class=""
|
|
|
+ src="https://ct.zzxcx.net/ctjk/mp-wx/carVideo/xingui.png"
|
|
|
+ ></image>
|
|
|
+ <text style="color: #fff; font-size: 46rpx; top: 34rpx" class="twp-text"
|
|
|
+ >新规秘卷</text
|
|
|
+ >
|
|
|
+ <text
|
|
|
+ style="color: #fff; font-size: 30rpx; top: 104rpx"
|
|
|
+ class="twp-text"
|
|
|
+ >考前秘籍 直击考点</text
|
|
|
+ >
|
|
|
</view>
|
|
|
-
|
|
|
</view>
|
|
|
<!-- <view v-if="active == 0 || active == 3">
|
|
|
<van-cell
|
|
@@ -212,9 +294,9 @@ import userInfoHead from "./components/userInfoHead.vue";
|
|
|
import freeUseBg from "@/assets/img/freeUseBg.png";
|
|
|
import newRulesBg from "@/assets/img/newRulesPaperBg.png";
|
|
|
import utils from "@/utils/index";
|
|
|
-import api from '@/api'
|
|
|
-import subjectVideoSelect from './components/subjectVideoSelect.vue'
|
|
|
-import userInfoAuth from './components/userInfoAuth.vue';
|
|
|
+import api from "@/api";
|
|
|
+import subjectVideoSelect from "./components/subjectVideoSelect.vue";
|
|
|
+import userInfoAuth from "./components/userInfoAuth.vue";
|
|
|
export default {
|
|
|
components: {
|
|
|
userInfoAuth,
|
|
@@ -226,7 +308,7 @@ export default {
|
|
|
tabRight,
|
|
|
VideoListBox,
|
|
|
userInfoHead,
|
|
|
- subjectVideoSelect
|
|
|
+ subjectVideoSelect,
|
|
|
},
|
|
|
data: () => ({
|
|
|
userInfoAuthVisible: false,
|
|
@@ -298,7 +380,7 @@ export default {
|
|
|
{
|
|
|
img: "https://ct.zzxcx.net/ctjk/mp-wx/carVideo/realExaminationRoomSimulation@2x.png",
|
|
|
text: "真实考场模拟",
|
|
|
- path: '/pages/extraHorWeb/index',
|
|
|
+ path: "/pages/extraHorWeb/index",
|
|
|
},
|
|
|
|
|
|
{
|
|
@@ -356,7 +438,7 @@ export default {
|
|
|
{
|
|
|
img: "https://ct.zzxcx.net/ctjk/mp-wx/carVideo/realExaminationRoomSimulation@2x.png",
|
|
|
text: "真实考场模拟",
|
|
|
- path: '/pages/extraHorWeb/index',
|
|
|
+ path: "/pages/extraHorWeb/index",
|
|
|
},
|
|
|
|
|
|
{
|
|
@@ -437,7 +519,7 @@ export default {
|
|
|
}),
|
|
|
computed: {
|
|
|
userData() {
|
|
|
- console.log(this.$store.state)
|
|
|
+ console.log(this.$store.state);
|
|
|
return this.$store.state.user.userInfo || {};
|
|
|
},
|
|
|
},
|
|
@@ -450,16 +532,15 @@ export default {
|
|
|
},
|
|
|
|
|
|
async mounted() {
|
|
|
-
|
|
|
this.loading = false;
|
|
|
- api.system.systemConfigConfigKey('xcx_video_open').then(res => {
|
|
|
- this.xcx_video_open = Number(res.data)
|
|
|
+ api.system.systemConfigConfigKey("xcx_video_open").then((res) => {
|
|
|
+ this.xcx_video_open = Number(res.data);
|
|
|
this.$nextTick(() => {
|
|
|
// 需要延迟
|
|
|
|
|
|
- api.user.getInfo().then(res => {
|
|
|
+ api.user.getInfo().then((res) => {
|
|
|
uni.setStorageSync("userInfo", res.data);
|
|
|
- this.$store.commit('SET_USERINFO', res.data)
|
|
|
+ this.$store.commit("SET_USERINFO", res.data);
|
|
|
// if (!res.data.nickName) {
|
|
|
// uni.showModal({
|
|
|
// title: "新用户更新信息",
|
|
@@ -474,10 +555,9 @@ export default {
|
|
|
// }
|
|
|
// }
|
|
|
// })
|
|
|
- })
|
|
|
-
|
|
|
- })
|
|
|
- })
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
|
|
|
// api.user.getInfo().then(res => {
|
|
|
// uni.setStorageSync("userInfo", res.data);
|
|
@@ -497,7 +577,6 @@ export default {
|
|
|
// // }
|
|
|
// // })
|
|
|
|
|
|
-
|
|
|
// // }
|
|
|
// })
|
|
|
// this.$nextTick(() => {
|
|
@@ -506,13 +585,16 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
clickCell(carVideoList) {
|
|
|
- this.$utils.route.goPage(`/pages/carVideo/moreVideo?active=${this.active}`, null, {
|
|
|
- carVideoList: carVideoList,
|
|
|
- active: this.active
|
|
|
- });
|
|
|
+ this.$utils.route.goPage(
|
|
|
+ `/pages/carVideo/moreVideo?active=${this.active}`,
|
|
|
+ null,
|
|
|
+ {
|
|
|
+ carVideoList: carVideoList,
|
|
|
+ active: this.active,
|
|
|
+ }
|
|
|
+ );
|
|
|
},
|
|
|
goPath(url, extraQuery = {}, needVip = false) {
|
|
|
-
|
|
|
uni.navigateTo({
|
|
|
url:
|
|
|
url + "?" + utils.mapToUrlQuery({ ...this.tabQuery, ...extraQuery }),
|
|
@@ -558,7 +640,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
changeSubject(e) {
|
|
|
- this.tabQuery.subject = e.detail.title == '科目一' ? 1 : 4;
|
|
|
+ this.tabQuery.subject = e.detail.title == "科目一" ? 1 : 4;
|
|
|
this.tabQuery.name = e.detail.title;
|
|
|
},
|
|
|
goLightMock(e) {
|
|
@@ -586,7 +668,7 @@ export default {
|
|
|
.splitLine {
|
|
|
width: 750rpx;
|
|
|
height: 20rpx;
|
|
|
- background: #F2F3F5;
|
|
|
+ background: #f2f3f5;
|
|
|
}
|
|
|
|
|
|
.subject {
|
|
@@ -598,7 +680,7 @@ export default {
|
|
|
.subject-tab {
|
|
|
width: 546rpx;
|
|
|
height: 80rpx;
|
|
|
- background: #E3EDFC;
|
|
|
+ background: #e3edfc;
|
|
|
border-radius: 46rpx;
|
|
|
position: relative;
|
|
|
display: flex;
|
|
@@ -615,17 +697,14 @@ export default {
|
|
|
|
|
|
.subject-slider {
|
|
|
border-radius: 46rpx;
|
|
|
- background: -webkit-linear-gradient(left, #26A1EE, #498EF5);
|
|
|
- ;
|
|
|
+ background: -webkit-linear-gradient(left, #26a1ee, #498ef5);
|
|
|
width: 300rpx;
|
|
|
height: 100%;
|
|
|
position: absolute;
|
|
|
|
|
|
z-index: 10;
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
.two {
|
|
@@ -636,8 +715,6 @@ export default {
|
|
|
flex-wrap: wrap;
|
|
|
background: #fff;
|
|
|
|
|
|
-
|
|
|
-
|
|
|
.two-item {
|
|
|
position: relative;
|
|
|
|
|
@@ -798,9 +875,7 @@ swiper-item {
|
|
|
font-size: $uni-app-fontsize-paragraph;
|
|
|
white-space: nowrap;
|
|
|
|
|
|
-
|
|
|
#tabs {
|
|
|
-
|
|
|
height: 800rpx;
|
|
|
}
|
|
|
|
|
@@ -817,7 +892,6 @@ swiper-item {
|
|
|
align-content: flex-start;
|
|
|
align-items: flex-start;
|
|
|
padding: 0 30rpx;
|
|
|
-
|
|
|
}
|
|
|
}
|
|
|
|