39 Commits

Author SHA1 Message Date
7b1db47383 提交 2023-11-07 20:50:15 +08:00
79236493e6 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-10-30 20:29:32 +08:00
59c49bfdf2 提交 2023-10-30 20:29:18 +08:00
110e9d4adc Merge pull request '屏蔽Ios支付' (#32) from dev-qsh into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/32
2023-10-25 20:33:06 +08:00
qsh
b533581a5d 屏蔽Ios支付 2023-10-25 20:30:58 +08:00
ac8acdccda Merge pull request 'dev-hxf' (#31) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/31
2023-10-17 12:03:51 +08:00
f4b6f96649 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-10-17 12:01:11 +08:00
9ba3f6ed48 提交 2023-10-17 12:00:58 +08:00
253ab2a80d Merge pull request 'dev-hxf' (#30) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/30
2023-10-10 18:07:01 +08:00
bfdbd3f7f3 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-10-10 17:56:31 +08:00
e3544ee06e 提交 2023-10-10 17:56:20 +08:00
7e15974ea6 Merge pull request 'dev-hxf' (#29) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/29
2023-09-21 16:34:55 +08:00
46972d5bff Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-09-21 16:31:30 +08:00
851319e24c 提交 2023-09-21 16:30:36 +08:00
19616d56c5 Merge pull request 'dev-hxf' (#28) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/28
2023-09-20 22:32:22 +08:00
89c4b2148e 提交 2023-09-20 22:23:21 +08:00
e68a422cc8 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-09-20 22:18:41 +08:00
2e93ad93e9 提交 2023-09-20 22:18:19 +08:00
c783ff969d Merge pull request 'dev-hxf' (#27) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/27
2023-09-18 21:44:49 +08:00
4526430a38 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-09-18 21:43:29 +08:00
3a0545852f 提交 2023-09-18 21:42:50 +08:00
0410e5dda9 Merge pull request 'dev-hxf' (#26) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/26
2023-09-17 23:53:26 +08:00
0c230fa5f1 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-09-17 23:49:59 +08:00
ded28b62fb 提交 2023-09-17 23:49:42 +08:00
6834b3f9fe Merge pull request 'dev-hxf' (#25) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/25
2023-09-17 13:23:02 +08:00
3379a9b18e Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-09-17 13:19:26 +08:00
9e871e4079 提交 2023-09-17 13:18:59 +08:00
728fefac03 Merge pull request 'dev-hxf' (#24) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/24
2023-09-07 09:55:25 +08:00
bf05f771f7 提交 2023-09-07 09:47:38 +08:00
287f123ac7 提交 2023-09-06 00:28:46 +08:00
89c72e336b Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-08-30 23:15:55 +08:00
135bcc71ee 提交 2023-08-30 23:15:41 +08:00
a09ef61e2f Merge pull request 'dev-hxf' (#23) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/23
2023-08-29 00:30:36 +08:00
d88f92a893 Merge branch 'master' of http://114.55.169.15:3000/huxiaofeng666/jwl-applet into dev-hxf 2023-08-29 00:24:59 +08:00
dc340c7f4d 提交 2023-08-29 00:24:24 +08:00
0c6182e6f5 Merge pull request '提交' (#22) from dev-hxf into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/22
2023-08-28 02:07:39 +08:00
f762ca430d 提交 2023-08-28 02:02:46 +08:00
37c5de0899 Merge pull request '科一真实考场' (#21) from dev-qsh into master
Reviewed-on: http://114.55.169.15:3000/huxiaofeng666/jwl-applet/pulls/21
2023-08-27 02:38:45 +08:00
qsh
04a4a4781d 科一真实考场 2023-08-27 02:37:34 +08:00
58 changed files with 5289 additions and 2173 deletions

View File

@@ -5,7 +5,6 @@ VITE_APP_TITLE = 金武联驾校
VITE_APP_ENV = 'development' VITE_APP_ENV = 'development'
# 金武联驾校/开发环境 # 金武联驾校/开发环境
VITE_APP_BASE_API = 'https://jwl.ahduima.com/' VITE_APP_BASE_API = 'https://jwl.ahduima.com/'
# #
VITE_WEB_BASE_URL = 'https://jwl.ahduima.com' VITE_WEB_BASE_URL = 'https://jwl.ahduima.com'

View File

@@ -5,7 +5,7 @@ VITE_APP_TITLE = 金武联驾校
VITE_APP_ENV = 'production' VITE_APP_ENV = 'production'
# 金武联驾校/开发环境 # 金武联驾校/开发环境
VITE_APP_BASE_API = 'https://jwl.ahduima.com/' VITE_APP_BASE_API = 'https://jwl.ahduima.com/'
# #
VITE_WEB_BASE_URL = 'https://jwl.ahduima.com' VITE_WEB_BASE_URL = 'https://jwl.ahduima.com'

View File

@@ -1,20 +1,21 @@
<script> <script>
import useUserStore from '@/jtools/store/user' import useUserStore from '@/jtools/store/user'
import useQuestionStore from '@/jtools/store/question' //引入store import useQuestionStore from '@/jtools/store/question' //引入store
import storage from './jtools/storage'
export default { export default {
onLaunch: function () { onLaunch: function (options) {
// 如果是二维码扫描过来的需要保存公司id
if (options.query?.scene) {
storage.set('companyId', options.query?.scene)
}
useUserStore().queryVipList() useUserStore().queryVipList()
if(useQuestionStore().curSubject=='1'){ if (useUserStore().isLogin) {
useQuestionStore().getOrderQuestion_sub1()
}else if(useQuestionStore().curSubject=='4'){
useQuestionStore().getOrderQuestion_sub4()
}
if(useUserStore().isLogin) {
useUserStore().getUserInfo() useUserStore().getUserInfo()
useUserStore().searchUserVip() useUserStore().searchUserVip()
} }
}, },
onShow: function () { onShow: function () {
useQuestionStore().getAllQuestion()
console.log('App Show') console.log('App Show')
}, },
onHide: function () { onHide: function () {
@@ -27,5 +28,8 @@ export default {
/*每个页面公共css */ /*每个页面公共css */
@import "uni_modules/uview-plus/index.scss"; @import "uni_modules/uview-plus/index.scss";
@import "static/style/index.scss"; @import "static/style/index.scss";
button::after{ border: none;}
button::after {
border: none;
}
</style> </style>

View File

@@ -7,4 +7,21 @@ export function getAliCompanyInfo(data) {
data, data,
noToken: true noToken: true
}); });
}
export function getCarTypeList(data) {
return request({
url: 'driver-api/tdCar/list',
method: 'GET',
data,
noToken: true
});
}
export function addInfo(data) {
return request({
url: 'chaoyuan-api/driver/addInfo',
method: 'POST',
data
});
} }

View File

@@ -50,7 +50,14 @@ export function querySysConfigList(carTypeId, configKey) {
noToken: true noToken: true
}); });
} }
//获取配置
export function querySysConfig(carTypeId, configKey) {
return request({
url: 'driver-api/tdSysConfig/queryConfigByKey?configKey=' + configKey + '&carTypeId=' + carTypeId,
method: 'GET',
noToken: true
});
}
//获取项目列表 (考试项目和基础操作) //获取项目列表 (考试项目和基础操作)
export function queryProjectList(data) { export function queryProjectList(data) {
return request({ return request({
@@ -60,3 +67,44 @@ export function queryProjectList(data) {
noToken:true noToken:true
}); });
} }
//
//获取专项题目数量
export function querySpecialNum(data) {
return request({
url: 'driver-api/tdQuestion/querySpecialNum',
method: 'POST',
data,
noToken:true
});
}
//获取题库版本
export function getVersion(carTypeId) {
return request({
url: '/driver-api/tdQuestionVersion/currentVersion?carTypeId='+carTypeId,
method: 'GET',
noToken:true
});
}
//获取题目ID
export function queryQuestionId(data) {
return request({
url: '/driver-api/tdQuestion/queryQuestionId',
method: 'POST',
data,
noToken:true
});
}
//获取模拟考试ID
export function getTestQuestionId(data) {
return request({
url: '/driver-api/tdQuestion/getTestQuestionId',
method: 'POST',
data,
noToken:true
});
}

View File

@@ -64,12 +64,14 @@ export default class JtoolsPay {
"description": this.order.description, "description": this.order.description,
"money": this.order.money, "money": this.order.money,
"outTradeNo": this.order.outTradeNo, "outTradeNo": this.order.outTradeNo,
"userId": this.order.userId "userId": this.order.userId,
"tradeType":'1'
} }
if (uni.getStorageSync('openId')) { if (uni.getStorageSync('openId')) {
params.openId = uni.getStorageSync('openId'); params.openId = uni.getStorageSync('openId');
} }
prePay(params).then(res => { prePay(params).then(res => {
console.log('预支付',res);
if (res.code == '0000') { if (res.code == '0000') {
resolve(res); resolve(res);
} }

View File

@@ -29,10 +29,10 @@ function service(options = {}) {
title: res?.data?.message || '请重新登录', title: res?.data?.message || '请重新登录',
icon: 'none' icon: 'none'
}); });
useUserStore().logout() useUserStore().logoutWithoutToken()
//请求成功 //请求成功
resolved(res.data); resolved(res.data);
} else if(res.data.code != '0000') { } else if(res.data.code != '0000'&&res.data.code !='4001') {
uni.showToast({ uni.showToast({
title: res?.data?.message || '访问出错', title: res?.data?.message || '访问出错',
icon: 'none' icon: 'none'

View File

@@ -3,7 +3,9 @@ import {
} from 'pinia'; } from 'pinia';
import http from '@/jtools/request/index'; import http from '@/jtools/request/index';
import { import {
queryQuestion queryQuestion,
getVersion,
querySysConfig
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
@@ -11,82 +13,224 @@ const question = defineStore({
id: 'question', id: 'question',
state: () => ({ state: () => ({
currentCartype: storage.get('carType') || '1001', currentCartype: storage.get('carType') || '1001',
orderQuestion_subject1: [], //科目一顺序做题 currentCarName: storage.get('carName') || '小车C1/C2/C3',
orderQuestion_subject4:[],//科目顺序做题 orderQuestion_subject1: storage.get('question_subject1') || [], //科目顺序做题
currentIndex_subject1:0,//科目一索引 顺序做题 orderQuestion_subject4: storage.get('question_subject4') || [], //科目顺序做题
currentIndex_subject4:0,//科目索引 顺序做题 currentIndex_subject1: 0, //科目索引 顺序做题
curSubject:storage.get('curSubject') || '1' currentIndex_subject4: 0, //科目四索引 顺序做题
curSubject: storage.get('curSubject') || '1',
loading_subject1: false,
loading_subject4: false,
version: storage.get('version') || ''
}), }),
actions: { actions: {
resetStorage(){
this.currentIndex_subject1=0
this.currentIndex_subject4=0
this.curSubject=0
storage.remove('curSubject')
storage.remove('wrongList_subject1')
storage.remove('wrongList_subject4')
storage.remove('rightList_subject1')
storage.remove('rightList_subject4')
this.getAllQuestion()
},
getAllQuestion() {
this.currentCartype = storage.get('carType') || '1001'
getVersion(this.currentCartype).then(resp => {
if (resp.code === '0000') {
querySysConfig(this.currentCartype, 'QuestionBank').then(res => {
const urlList = JSON.parse(res.data.configJson)
const urlOne = urlList.find(item => item.subject == '1').url
const urlFour = urlList.find(item => item.subject == '4').url
if (this.version != resp.data) {
this.version = resp.data
storage.set('version', resp.data)
this.getOrderQuestion_sub1(true, urlOne)
this.getOrderQuestion_sub4(true, urlFour)
} else {
this.getOrderQuestion_sub1(false, urlOne)
this.getOrderQuestion_sub4(false, urlOne)
}
})
}
})
},
divideArray(array, numChunks) {
var chunkSize = Math.ceil(array.length / numChunks);
var dividedArray = [];
for (var i = 0; i < array.length; i += chunkSize) {
dividedArray.push(array.slice(i, i + chunkSize));
}
return dividedArray;
},
//改变当前科目 //改变当前科目
changeSubject(val){ changeSubject(val) {
this.curSubject=val this.curSubject = val
storage.set('curSubject',val) storage.set('curSubject', val)
}, },
// 获取顺序做题科目1 // 获取顺序做题科目1
getOrderQuestion_sub1() { getOrderQuestion_sub1(isUpdate, url) {
this.curSubject='1' if (isUpdate) {
storage.set('curSubject','1') this.loading_subject1 = true
if(!this.orderQuestion_subject1.length){ const that = this
queryQuestion({ uni.request({
carTypeId: this.currentCartype, url: url,
subject: '1', success(resp) {
// questionIdList:[10982,10983,10985,10986] if (resp.data) {
}).then(res => { that.orderQuestion_subject1 = resp.data.data
if (res.code == '0000') { const diveList = that.divideArray(that.orderQuestion_subject1, 5)
this.orderQuestion_subject1 = res.data that.loading_subject1 = false
const falseList =storage.get('wrongList_subject1') || [] uni.setStorageSync('questionOneSub1', diveList[0])
const trueList =storage.get('rightList_subject1')|| [] uni.setStorageSync('questionOneSub2', diveList[1])
const falseArr=[] uni.setStorageSync('questionOneSub3', diveList[2])
const rightArr=[] uni.setStorageSync('questionOneSub4', diveList[3])
this.orderQuestion_subject1.forEach(item=>{ uni.setStorageSync('questionOneSub5', diveList[4])
if(falseList.includes(item.questionId)){ const falseList = storage.get('wrongList_subject1') || []
falseArr.push(item.questionId) const trueList = storage.get('rightList_subject1') || []
} const falseArr = []
if(trueList.includes(item.questionId)){ const rightArr = []
rightArr.push(item.questionId) that.orderQuestion_subject1.forEach(item => {
} if (falseList.includes(item.questionId)) {
}) falseArr.push(item.questionId)
storage.set('wrongList_subject1',falseArr) }
storage.set('rightList_subject1',rightArr) if (trueList.includes(item.questionId)) {
rightArr.push(item.questionId)
}
})
storage.set('wrongList_subject1', falseArr)
storage.set('rightList_subject1', rightArr)
}
} }
}) })
} else {
const list1 = uni.getStorageSync('questionOneSub1') || []
const list2 = uni.getStorageSync('questionOneSub2') || []
const list3 = uni.getStorageSync('questionOneSub3') || []
const list4 = uni.getStorageSync('questionOneSub4') || []
const list5 = uni.getStorageSync('questionOneSub5') || []
this.orderQuestion_subject1 = [...list1, ...list2, ...list3, ...list4, ...list5]
if (this.orderQuestion_subject1 && this.orderQuestion_subject1.length) {
} else {
this.loading_subject1 = true
const that = this
uni.request({
url: url,
success(resp) {
if (resp.data) {
that.orderQuestion_subject1 = resp.data.data
const diveList = that.divideArray(that.orderQuestion_subject1, 5)
that.loading_subject1 = false
uni.setStorageSync('questionOneSub1', diveList[0])
uni.setStorageSync('questionOneSub2', diveList[1])
uni.setStorageSync('questionOneSub3', diveList[2])
uni.setStorageSync('questionOneSub4', diveList[3])
uni.setStorageSync('questionOneSub5', diveList[4])
const falseList = storage.get('wrongList_subject1') || []
const trueList = storage.get('rightList_subject1') || []
const falseArr = []
const rightArr = []
that.orderQuestion_subject1.forEach(item => {
if (falseList.includes(item.questionId)) {
falseArr.push(item.questionId)
}
if (trueList.includes(item.questionId)) {
rightArr.push(item.questionId)
}
})
storage.set('wrongList_subject1', falseArr)
storage.set('rightList_subject1', rightArr)
}
}
})
}
} }
}, },
// 获取顺序做题科目4 // 获取顺序做题科目4
getOrderQuestion_sub4() { getOrderQuestion_sub4(isUpdate, url) {
this.curSubject='4' if (isUpdate) {
storage.set('curSubject','4') this.loading_subject4 = true
if(!this.orderQuestion_subject4.length){ const that = this
queryQuestion({ uni.request({
carTypeId: this.currentCartype, url: url,
subject: '4', success(resp) {
// questionIdList:[10982,10983,10985,10986] if (resp.data) {
}).then(res => { that.orderQuestion_subject4 = resp.data.data
if (res.code == '0000') { const diveList = that.divideArray(that.orderQuestion_subject4, 5)
this.orderQuestion_subject4 = res.data that.loading_subject4 = false
const falseList =storage.get('wrongList_subject4') || [] uni.setStorageSync('questionFourSub1', diveList[0])
const trueList =storage.get('rightList_subject4')|| [] uni.setStorageSync('questionFourSub2', diveList[1])
const falseArr=[] uni.setStorageSync('questionFourSub3', diveList[2])
const rightArr=[] uni.setStorageSync('questionFourSub4', diveList[3])
this.orderQuestion_subject4.forEach(item=>{ uni.setStorageSync('questionFourSub5', diveList[4])
if(falseList.includes(item.questionId)){ const falseList = storage.get('wrongList_subject4') || []
falseArr.push(item.questionId) const trueList = storage.get('rightList_subject4') || []
} const falseArr = []
if(trueList.includes(item.questionId)){ const rightArr = []
rightArr.push(item.questionId) that.orderQuestion_subject4.forEach(item => {
} if (falseList.includes(item.questionId)) {
}) falseArr.push(item.questionId)
storage.set('wrongList_subject4',falseArr) }
storage.set('rightList_subject4',rightArr) if (trueList.includes(item.questionId)) {
rightArr.push(item.questionId)
}
})
storage.set('wrongList_subject4', falseArr)
storage.set('rightList_subject4', rightArr)
}
} }
}) })
} else {
const list1 = uni.getStorageSync('questionFourSub1') || []
const list2 = uni.getStorageSync('questionFourSub2') || []
const list3 = uni.getStorageSync('questionFourSub3') || []
const list4 = uni.getStorageSync('questionFourSub4') || []
const list5 = uni.getStorageSync('questionFourSub5') || []
this.orderQuestion_subject4 = [...list1, ...list2, ...list3, ...list4, ...list5]
if (this.orderQuestion_subject4 && this.orderQuestion_subject4.length) {
} else {
this.loading_subject4 = true
const that = this
uni.request({
url: url,
success(resp) {
if (resp.data) {
that.orderQuestion_subject4 = resp.data.data
const diveList = that.divideArray(that.orderQuestion_subject4, 5)
that.loading_subject4 = false
uni.setStorageSync('questionFourSub1', diveList[0])
uni.setStorageSync('questionFourSub2', diveList[1])
uni.setStorageSync('questionFourSub3', diveList[2])
uni.setStorageSync('questionFourSub4', diveList[3])
uni.setStorageSync('questionFourSub5', diveList[4])
const falseList = storage.get('wrongList_subject4') || []
const trueList = storage.get('rightList_subject4') || []
const falseArr = []
const rightArr = []
that.orderQuestion_subject4.forEach(item => {
if (falseList.includes(item.questionId)) {
falseArr.push(item.questionId)
}
if (trueList.includes(item.questionId)) {
rightArr.push(item.questionId)
}
})
storage.set('wrongList_subject4', falseArr)
storage.set('rightList_subject4', rightArr)
}
}
})
}
} }
}, },
//获取索引 //获取索引
getCurrentIndex(index,val){ getCurrentIndex(index, val) {
this[`currentIndex_subject${val}`]=index this[`currentIndex_subject${val}`] = index
} }
} }
}); });

View File

@@ -1,6 +1,6 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { login,logout,getInfo } from '@/jtools/api/login'; import { login, logout, getInfo } from '@/jtools/api/login';
import { queryVip,getVipList } from '@/jtools/api/vip' import { queryVip, getVipList } from '@/jtools/api/vip';
import constants from '@/jtools/constants'; import constants from '@/jtools/constants';
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
@@ -16,67 +16,77 @@ const useUserStore = defineStore({
}), }),
actions: { actions: {
login(params) { login(params) {
return new Promise(async (resolve, reject) => { return new Promise(async (resolve, reject) => {
const resp = await login(params); const resp = await login(params);
if (resp.code === '0000') { if (resp.code === '0000') {
// 保存登录信息,用于重新登录 // 保存登录信息,用于重新登录
this.isLogin = true; this.isLogin = true;
this.token = resp.data.token; this.token = resp.data.token;
this.userInfo = resp.data this.userInfo = resp.data;
storage.set('isLogin', true) storage.set('isLogin', true);
storage.set('token', resp.data.token) storage.set('token', resp.data.token);
storage.set('userInfo', resp.data) storage.set('userInfo', resp.data);
resolve(resp.data); storage.remove('companyId');
} else { resolve(resp.data);
reject(); } else {
} reject();
}); }
}, });
},
// 登出 // 登出
logout(force = false) { logout(force = false) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
this.resetUserData(); this.resetUserData();
uni.redirectTo({ uni.redirectTo({
url: '/pages/login/login' url: '/pages/login/login'
}) });
resolve(); resolve();
}) });
},
//过期登出
logoutWithoutToken(force = false) {
return new Promise((resolve, reject) => {
this.resetUserData();
resolve();
});
}, },
// 获取用户信息 // 获取用户信息
getUserInfo() { getUserInfo() {
getInfo().then(resp => { getInfo().then(resp => {
if(resp.code == '0000') { if (resp.code == '0000') {
this.userInfo = resp.data this.userInfo = resp.data;
storage.set('userInfo', resp.data) storage.set('userInfo', resp.data);
} }
}) });
}, },
resetUserData() { resetUserData() {
this.isLogin = false; this.isLogin = false;
this.token = ''; this.token = '';
this.userInfo = {} this.userInfo = {};
this.vipOnList = [] this.vipOnList = [];
storage.remove('isLogin') storage.remove('isLogin');
storage.remove('token') storage.remove('token');
storage.remove('userInfo') storage.remove('userInfo');
}, },
// 查询当前用户的vip开通情况 // 查询当前用户的vip开通情况
async searchUserVip() { async searchUserVip() {
const resp=await queryVip({ carTypeId: this.currentCartype,memberId: null, subject:'' }) this.currentCartype = storage.get('carType') || '1001';
if(resp.code == '0000') { const resp = await queryVip({ carTypeId: this.currentCartype, memberId: null, subject: '' });
this.vipOnList = resp.data if (resp.code == '0000') {
} this.vipOnList = resp.data;
}
}, },
// 查询所有的vip // 查询所有的vip
queryVipList() { queryVipList() {
getVipList({ carTypeId: this.currentCartype,memberId: null, subject:'' }).then(resp => { this.currentCartype = storage.get('carType') || '1001';
if(resp.code == '0000') { getVipList({ carTypeId: this.currentCartype, memberId: null, subject: '' }).then(resp => {
this.vipAllList = resp.data if (resp.code == '0000') {
this.vipAllList = resp.data;
} }
}) });
} }
}, }
}); });
export default useUserStore; export default useUserStore;

View File

@@ -8,7 +8,8 @@
{ {
"path": "pages/index/index", "path": "pages/index/index",
"style": { "style": {
"navigationBarTitleText": "金武联驾考" "navigationStyle": "custom",
"enablePullDownRefresh": false
} }
}, },
{ {
@@ -86,7 +87,7 @@
{ {
"path": "pages/me/tijian", "path": "pages/me/tijian",
"style": { "style": {
"navigationBarTitleText": "我的体检", "navigationBarTitleText": "上传证件照",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
}, },
@@ -104,6 +105,13 @@
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
}, },
{
"path": "pages/index/testTip",
"style": {
"navigationBarTitleText": "模拟考试",
"enablePullDownRefresh": false
}
},
{ {
"path": "pages/login/login", "path": "pages/login/login",
"style": { "style": {
@@ -144,8 +152,28 @@
"navigationBarTitleText": "真实考场模拟", "navigationBarTitleText": "真实考场模拟",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
},
} {
"path": "pages/me/uploadPic",
"style": {
"navigationBarTitleText": "上传证件照",
"enablePullDownRefresh": false
}
},
{
"path": "pages/index/secretPapers",
"style": {
"navigationBarTitleText": "考前密卷",
"enablePullDownRefresh": false
}
},
{
"path": "pages/me/changeCarType",
"style": {
"navigationBarTitleText": "切换车型",
"enablePullDownRefresh": false
}
}
], ],
"globalStyle": { "globalStyle": {
@@ -156,7 +184,7 @@
}, },
"tabBar": { "tabBar": {
"borderStyle": "white", "borderStyle": "white",
"selectedColor": "#333333", "selectedColor": "#05C341",
"backgroundColor": "#FFFFFF", "backgroundColor": "#FFFFFF",
"color": "#999999", "color": "#999999",
"list": [{ "list": [{

View File

@@ -1,86 +1,87 @@
<template> <template>
<view> <view>
<view class="box-nav"> <view class="box-nav">
<image style="width: 100%;" src="../../static/image/index/index_bg.jpg"></image> <image style="width: 100%;"
src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E9%A6%96%E9%A1%B5_20230830213855.png">
</image>
<view class="center-box flex jc-sb ai-c"> <view class="center-box flex jc-sb ai-c">
<view class="box-item flex ai-c jc-c"> <view class="box-item flex ai-c jc-c">
<view class="flex jc-c ai-c relative" style="width: 230rpx;height: 230rpx;" @tap="toAnswer('顺序答题',false)"> <view class="flex jc-c ai-c relative" style="width: 230rpx;height: 230rpx;" @tap="toAnswer('顺序答题',false)">
<image style="width: 230rpx;height: 230rpx;position: absolute;left: 0;top: 0;" src="../../../static/image/index/green_bg.png"></image> <image style="width: 230rpx;height: 230rpx;position: absolute;left: 0;top: 0;"
<view class="btn-item flex ai-c jc-c"> src="../../../static/image/index/green_bg.png"></image>
<view class="text-center cor-fff" style="line-height: 40rpx;"> <view class="btn-item flex ai-c jc-c">
<view class="fs16">顺序练习</view> <view class="text-center cor-fff" style="line-height: 40rpx;">
<text class="fs14">{{getDoNum}}/{{subject=='1'?orderQuestion_subject1.length:orderQuestion_subject4.length}}</text> <view class="fs16">顺序练习</view>
</view> <text
class="fs14">{{getDoNum}}/{{subject=='1'?orderQuestion_subject1.length:orderQuestion_subject4.length}}</text>
</view> </view>
</view>
</view> </view>
</view> </view>
<view class="box-item flex ai-c jc-c"> <view class="box-item flex ai-c jc-c">
<view class="flex jc-c ai-c relative" style="width: 230rpx;height: 230rpx;" @tap="toExams"> <view class="flex jc-c ai-c relative" style="width: 230rpx;height: 230rpx;" @tap="toExams('模拟考试')">
<image style="width: 230rpx;height: 230rpx;position: absolute;left: 0;top: 0;" src="../../../static/image/index/orange_bg.png"></image> <image style="width: 230rpx;height: 230rpx;position: absolute;left: 0;top: 0;"
<view class="btn2-item flex ai-c jc-c"> src="../../../static/image/index/orange_bg.png"></image>
<view class="text-center cor-fff" style="line-height: 40rpx;"> <view class="btn2-item flex ai-c jc-c">
<view class="fs16">模拟考试</view> <view class="text-center cor-fff" style="line-height: 40rpx;">
<text class="fs14">考试</text> <view class="fs16">模拟考试</view>
</view> <text class="fs14">去考试</text>
</view> </view>
</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view style="padding: 0 28rpx;margin-top: 60rpx;"> <view style="padding: 0 28rpx;margin-top: calc(100% - 718rpx);">
<view class="tabs-box"> <view class="tabs-box">
<view class="wp33 flex ai-c jc-c" @tap="toVip"> <view class="wp33 flex ai-c jc-c" @tap="toVip">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto" <image style="width: 72rpx;height: 72rpx;margin: 0 auto" src="../../static/image/index/vipicon.png">
src="../../static/image/index/vipicon.png">
</image> </image>
<view class="mt5">VIP课程</view> <view class="mt5">VIP课程</view>
</view> </view>
</view> </view>
<view class="wp33 flex ai-c jc-c" @tap="toAnswer('精简500题',true)"> <view class="wp33 flex ai-c jc-c" @tap="toAnswer(`精简${titleNum}题`,true)">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto" <image style="width: 72rpx;height: 72rpx;margin: 0 auto" src="../../static/image/index/500icon.png">
src="../../static/image/index/500icon.png">
</image> </image>
<view class="mt5">精简500</view> <view class="mt5">精简{{titleNum}}</view>
</view> </view>
</view> </view>
<view class="wp33 flex ai-c jc-c" @tap="toExclusive"> <view class="wp33 flex ai-c jc-c" @tap="toExclusive">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto" <image style="width: 72rpx;height: 72rpx;margin: 0 auto" src="../../static/image/index/zxicon.png">
src="../../static/image/index/zxicon.png">
</image> </image>
<view class="mt5">专项练习</view> <view class="mt5">专项练习</view>
</view> </view>
</view> </view>
<view class="wp33 flex ai-c jc-c" @tap="toTestRoom"> <view class="wp33 flex ai-c jc-c" @tap="toTestRoom">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto;" <image style="width: 72rpx;height: 72rpx;margin: 0 auto;" src="../../static/image/index/realicon.png">
src="../../static/image/index/realicon.png"></image> </image>
<view class="mt5">真实考场模拟</view> <view class="mt5">真实考场模拟</view>
</view> </view>
</view> </view>
<view class="wp33 flex ai-c jc-c"> <view class="wp33 flex ai-c jc-c" @tap="toExams('考前秘卷')">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto" <image style="width: 72rpx;height: 72rpx;margin: 0 auto" src="../../static/image/index/testbeforeicon.png">
src="../../static/image/index/testbeforeicon.png"></image> </image>
<view class="mt5">考前</view> <view class="mt5">考前</view>
</view> </view>
</view> </view>
<view class="wp33 flex ai-c jc-c" @tap="toWrongList"> <view class="wp33 flex ai-c jc-c" @tap="toWrongList">
<view class="text-center wp100"> <view class="text-center wp100">
<image style="width: 72rpx;height: 72rpx;margin: 0 auto" <image style="width: 72rpx;height: 72rpx;margin: 0 auto" src="../../static/image/index/worryicon.png">
src="../../static/image/index/worryicon.png"></image> </image>
<view class="mt5">错题收藏</view> <view class="mt5">错题收藏</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<view style="padding: 0 28rpx;margin-top: 30rpx;" @tap="toClass"> <!-- <view style="padding: 0 28rpx;margin-top: 30rpx;" @tap="toClass">
<view class="video-box"> <view class="video-box">
<view class="flex jc-sb ai-c wp100"> <view class="flex jc-sb ai-c wp100">
<text style="color: #05C341;font-size: 36rpx;">{{subject==1?'一':'四'}}精品视频课</text> <text style="color: #05C341;font-size: 36rpx;">{{subject==1?'一':'四'}}精品视频课</text>
<text class="cor-666 fs12">全部10节课 ></text>
</view> </view>
<view class="flex ai-c mt20"> <view class="flex ai-c mt20">
<view class="contain-box relative"> <view class="contain-box relative">
@@ -88,110 +89,294 @@
<image class="play_btn_2" src="../../static/image/index/play.png" /> <image class="play_btn_2" src="../../static/image/index/play.png" />
</view> </view>
<view class="ml15 text-center"> <view class="ml15 text-center">
<u-button :customStyle="{width:'200rpx',height:'66rpx',borderRadius: '33rpx'}" iconColor="#fff" <u-button :customStyle="{width:'200rpx',height:'66rpx',borderRadius: '33rpx'}" iconColor="#fff" text="去看视频"
text="去看视频" color="linear-gradient(90deg, #11DF20 0%, #00B74F 100%)" icon="play-circle"> color="linear-gradient(90deg, #11DF20 0%, #00B74F 100%)" icon="play-circle">
</u-button> </u-button>
<view class="cor-333 fs15 fw600 mt10">{{subject==1?'一':'四'}}易错试题</view> <view class="cor-333 fs15 fw600 mt10">{{subject==1?'一':'四'}}易错试题</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view> -->
</view> </view>
</template> </template>
<script> <script>
import { mapState,mapActions } from 'pinia' //引入映射函数 import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useUserStore from '@/jtools/store/user'
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
import useQuestionStore from '@/jtools/store/question' //引入store import useQuestionStore from '@/jtools/store/question' //引入store
import {
querySysConfig,
queryQuestionId,
getTestQuestionId
} from '@/jtools/api/question';
export default { export default {
props:{ props: {
subject:{ subject: {
type:[String,Number], type: [String, Number],
}, },
rightList:{ rightList: {
type:Array type: Array
}, },
wrongList:{ wrongList: {
type:Array type: Array
} }
}, },
data() { data() {
return { return {
allQuestionNum:0, titleNum:500,
allQuestionNum: 0,
} }
}, },
mounted(){ mounted() {
this.getTitle()
}, },
computed: { computed: {
...mapState(useQuestionStore, ["orderQuestion_subject1","orderQuestion_subject4"]) ,//映射函数取出tagslist ...mapState(useUserStore, ["vipOnList", "token"]),
getDoNum(){ ...mapState(useQuestionStore, ["orderQuestion_subject1", "orderQuestion_subject4", "version"]), //映射函数取出tagslist
return this.rightList.length+this.wrongList.length getDoNum() {
return this.rightList.length + this.wrongList.length
} }
}, },
methods: { methods: {
toTestRoom(){ ...mapActions(useUserStore, ['searchUserVip']),
uni.navigateTo({ ...mapActions(useQuestionStore, ['getOrderQuestion_sub1', 'getOrderQuestion_sub4', 'getAllQuestion']),
url:"/pages/index/trueTest" getTitle(){
const carId=storage.get('carType') || '1001'
querySysConfig(carId,'SimplifyQuestionNum').then(resp=>{
if(resp.code==='0000'){
const list = JSON.parse(resp.data.configJson)
this.titleNum=list.find(item=>item.subject==this.subject).num
}
}) })
}, },
toVip(){ async toTestRoom() {
if(storage.get('token')){ // uni.navigateTo({
uni.navigateTo({ // url:"/pages/index/trueTest"
url:"/pages/index/videoVip?subject="+this.subject // })
if (this.token) {
await this.searchUserVip()
const res = this.vipOnList.some(item => item.subjects.includes(this.subject))
if (!res) {
uni.navigateTo({
url: "/pages/index/videoVip?subject=" + this.subject
})
} else {
getTestQuestionId({
versionId: this.version,
carTypeId: storage.get('carType') || '1001',
subject: this.subject,
}).then(async (resp) => {
if (resp.code === '0000') {
if(resp.data&&resp.data.length){
const arr = resp.data
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/index/trueTest?subject="+ this.subject + "&questionIdList=" + listJson
})
}else{
uni.showToast({
title: '暂无题目',
icon: 'none'
})
}
} else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
})
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
},
async toVip() {
if (this.token) {
await this.searchUserVip()
const res = this.vipOnList.some(item => item.subjects.includes(this.subject))
if (!res) {
uni.navigateTo({
url: "/pages/index/videoVip?subject=" + this.subject
})
} else {
uni.navigateTo({
url: "/pages/me/vip"
})
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
},
toClass() {
uni.showToast({
title: '敬请期待',
icon: 'none'
})
},
toAnswer(title, val) {
if (title == `精简${this.titleNum}`) {
queryQuestionId({
versionId: this.version,
carTypeId: storage.get('carType') || '1001',
subject: this.subject,
isVip: '1'
}).then(async (resp) => {
if (resp.code === '0000') {
if (this.token) {
await this.searchUserVip()
const result = this.vipOnList.some(item => item.subjects.includes(this.subject))
let arr = []
if (result) {
if(resp.data&&resp.data.length){
const listJson = JSON.stringify(resp.data)
uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + title + "&subject=" + this.subject +
"&needVip=" + !result + "&questionIdList=" + listJson
})
}else{
uni.showToast({
title: '暂无题目',
icon: 'none'
})
}
} else {
if (resp.data && resp.data.length > 3) {
arr = resp.data.slice(0, 3)
} else {
arr = resp.data
}
if(arr&&arr.length){
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + title + "&subject=" + this.subject +
"&needVip=" + !result + "&questionIdList=" + listJson
})
}else{
uni.showToast({
title: '暂无题目',
icon: 'none'
})
}
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
} else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
}) })
}else{ } else {
uni.navigateTo({ uni.navigateTo({
url:'/pages/login/login' url: "/pages/questionBank/questionBank?navTitle=" + title + "&subject=" + this.subject + "&needVip=" +
val
}) })
} }
}, },
toClass(){ toExams(title) {
if(storage.get('token')){ if (storage.get('token')) {
uni.navigateTo({ if(title=='模拟考试'){
url:"/pages/questionBank/baseOperate" getTestQuestionId({
}) versionId: this.version,
}else{ carTypeId: storage.get('carType') || '1001',
uni.navigateTo({ subject: this.subject,
url:'/pages/login/login' }).then(async (resp) => {
}) if (resp.code === '0000') {
} const arr = resp.data
}, const listJson = JSON.stringify(arr)
toAnswer(title,val) { uni.navigateTo({
url: "/pages/index/testTip?subject=" + this.subject + "&questionIdList=" + listJson
})
} else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
})
}else if(title=='考前秘卷'){
const param=this.subject=='1'?{isExam1: '1'}:{isExam2: '1'}
queryQuestionId({
versionId: this.version,
carTypeId: storage.get('carType') || '1001',
subject: this.subject,
...param
}).then(async (resp) => {
if (resp.code === '0000') {
let arr = []
if (this.token) {
await this.searchUserVip()
const result = this.vipOnList.some(item => item.subjects.includes(this.subject))
if (result) {
uni.navigateTo({
url: "/pages/index/secretPapers?subject=" + this.subject
})
} else {
if (resp.data && resp.data.length > 3) {
arr = resp.data.slice(0, 3)
} else {
arr = resp.data
}
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/index/videoVip?subject=" + this.subject
})
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
} else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
})
}
} else {
uni.navigateTo({ uni.navigateTo({
url:"/pages/questionBank/questionBank?navTitle="+title+"&subject="+this.subject+"&needVip="+val url: '/pages/login/login'
})
},
toExams(){
if(storage.get('token')){
uni.navigateTo({
url:"/pages/questionBank/practiceExams?subject="+this.subject
})
}else{
uni.navigateTo({
url:'/pages/login/login'
})
}
},
toExclusive(){
uni.navigateTo({
url:"/pages/questionBank/exclusiveExercise?subject="+this.subject
})
},
toWrongList(){
uni.navigateTo({
url:"/pages/questionBank/wrongQuestion?subject="+this.subject
}) })
} }
},
toExclusive() {
uni.navigateTo({
url: "/pages/questionBank/exclusiveExercise?subject=" + this.subject
})
},
toWrongList() {
uni.navigateTo({
url: "/pages/questionBank/wrongQuestion?subject=" + this.subject
})
} }
} }
}
</script> </script>
<style scoped> <style scoped>
.box-nav { .box-nav {
width: 100%; width: 100%;
position: relative; position: relative;
height: 500rpx;
} }
.center-box { .center-box {
@@ -254,6 +439,7 @@
background: #00B74F; background: #00B74F;
border-radius: 16rpx; border-radius: 16rpx;
} }
.play_btn_2 { .play_btn_2 {
width: 65rpx; width: 65rpx;
height: 65rpx; height: 65rpx;
@@ -261,4 +447,4 @@
left: 165.5rpx; left: 165.5rpx;
top: 78rpx top: 78rpx
} }
</style> </style>

View File

@@ -1,31 +1,45 @@
<template> <template>
<view> <view>
<view class="box-nav"> <view class="box-nav">
<image style="width: 100%;" src="../../../static/image/index/index_bg.jpg"></image> <image style="width: 100%;" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E9%A6%96%E9%A1%B5_20230830213855.png"></image>
<view style="width: 100%;position: absolute;top: 80px;left: 0;" class="flex jc-c"> <view style="width: 100%;position: absolute;top: 80px;left: 0;" class="flex jc-c" @tap="toVipVideo">
<image style="width: 694rpx" mode="widthFix" :src="subject=='2'?'../../../static/image/index/subject2_bg.png':'../../../static/image/index/subject3_bg.png'"></image> <image style="width: 694rpx" mode="widthFix"
:src="subject=='2'?'https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E7%A7%91%E4%BA%8C%E9%A6%96%E9%A1%B5banner_20230830214212.png':'https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E7%A7%91%E4%B8%89%E9%A6%96%E9%A1%B5banner_20230830214245.png'">
</image>
</view> </view>
</view> </view>
<view class="p14lr" style="margin-top: -20px;"> <view class="p14lr" style="margin-top: -20px;">
<view class="video_box"> <view class="video_box">
<view class="flex ai-c jc-sb mt5"> <view class="flex ai-c jc-sb mt5">
<text class="fs18 cor-000">{{subject=='2'?'二':'三'}}考试项目讲解</text> <text class="fs18 cor-000">{{subject=='2'?'二':'三'}}考试项目讲解</text>
<view class="flex ai-c" style="height: 34rpx;line-height: 34rpx;" @tap="changeDiverType"> <!-- <view class="flex ai-c" style="height: 34rpx;line-height: 34rpx;" @tap="changeDiverType">
<text style="color:#05C341;font-size: 16px;">{{diverTypeList[diverTypeIndex]?.configItemName}}</text> <text style="color:#05C341;font-size: 16px;">{{diverTypeList[diverTypeIndex]?.configItemName}}</text>
<u-icon name="list" color="#05C341" size="18"></u-icon> <u-icon name="list" color="#05C341" size="18"></u-icon>
</view> </view> -->
</view> </view>
<view class="flex ai-c jc-fa mt15" style="flex-wrap: wrap;"> <view class="skill-sequence-panel-content-wrapper">
<view class="tab_iem mr10 mb10" :class="videoIndex===index?'checked_tab':''" v-for="(item,index) of operateList" :key="index" @tap="checkVideo(index)">{{item.description}}</view> <scroll-view class="skill-sequence-panel-content" scroll-x :scroll-into-view="intoindex">
</view> <view class="skill-sequence-skill-wrapper tab_iem m15tb" :class="videoIndex===index?'checked_tab':''"
<view @tap="toVideo"> v-for="(item,index) of operateList" :key="index" :id='"text"+index' @tap="checkVideo(index)">
<view class="wp100 relative" style="height: 362rpx;border-radius: 16rpx;"> {{item.description}}
<image style="width: 100%;height: 362rpx;border-radius: 16rpx;" id="myVideo" src="../../../static/image/index/jpsp.png"></image> </view>
<image class="play_btn_2" src="../../static/image/index/play.png" /> </scroll-view>
</view>
</view> </view>
<swiper class="swiper" :current="videoIndex" style="height: 362rpx;" :autoplay="false"
:disable-programmatic-animation="true" @change="onChange">
<swiper-item v-for="(item,index) of operateList" :key="index" @tap="toVideo">
<view class="p5lr wp100">
<view class="wp100 relative hide"
style="height: 362rpx;border-radius: 16rpx;overflow: hidden;">
<image style="width: 100%;height: 362rpx;position: absolute;left: 0;top: 0;" mode="widthFix"
:src="item.videoList[0].videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
<image class="play_btn_2" src="../../static/image/index/play.png" />
</view>
</view>
</swiper-item>
</swiper>
</view> </view>
<view class="video_box mt10"> <view class="video_box mt10" v-if="subject=='2'">
<view class="flex ai-c jc-sb"> <view class="flex ai-c jc-sb">
<text class="fs18 cor-000">基础操作讲解</text> <text class="fs18 cor-000">基础操作讲解</text>
<view class="flex cor-666" @tap="toDetail"> <view class="flex cor-666" @tap="toDetail">
@@ -33,146 +47,274 @@
<u-icon color="#666" name="arrow-right" size="18"></u-icon> <u-icon color="#666" name="arrow-right" size="18"></u-icon>
</view> </view>
</view> </view>
<view class="flex p14lr p20tb bc-fff mt10" style="border-bottom: 1rpx solid #DDDCDC;;" v-for="(item,index) of operateList" :key="index" @tap="toVideo"> <view class="flex p14lr p20tb bc-fff" style="border-bottom: 1rpx solid #DDDCDC;"
<view class="pic relative"> v-for="(item,index) of videoList" :key="index" @click="toOperateDetail(item.videoId)">
<image class="pic" src="../../static/image/index/index_bg.jpg"></image> <view class="pic relative hide" style="overflow: hidden;">
<image class="play_btn_3" src="../../static/image/index/play.png" /> <image class="pic" style="position: absolute;left: 0;top: 0;" mode="widthFix" :src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
</view> <image class="play_btn_3" src="../../static/image/index/play.png" />
<view class="ml10"> </view>
<text class="fs16 cor-000 fw600">上车下车的方法</text> <view class="ml10">
<view class="fs14 mt5 cor-666">上车下车的方法</view> <text class="fs16 cor-000 fw600">{{baseList[0]?.description}}</text>
</view> <view class="fs14 mt5 cor-666">{{item.description}}</view>
</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useUserStore from '@/jtools/store/user'
import { import {
querySysConfigList, querySysConfigList,
queryProjectList queryProjectList
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
export default { export default {
name: "Subject2", name: "Subject2",
props:{ props: {
subject:{ subject: {
type:[String,Number] type: [String, Number]
} }
},
data(){
return{
diverTypeIndex:0,
diverTypeList:[],
videoIndex:0,
projectId:undefined,
operateList:[]
}
},
async mounted(){
await this.getDiverType()
},
methods:{
getOperateList(){
queryProjectList({
"carTypeId": storage.get('carType') || '1001',
"subject": String(this.subject),
"type": "2"
}).then(resp=>{
console.log(resp);
})
}, },
toVideo(){ data() {
uni.navigateTo({ return {
url:"/pages/questionBank/videoDetail?driveType="+this.diverTypeList[this.diverTypeIndex].configItemCode+"&subject="+this.subject+"&projectId="+this.projectId+"&type=1" intoindex: '',
}) diverTypeIndex: 0,
diverTypeList: [],
videoIndex: 0,
projectId: undefined,
operateList: [],
baseList: [],
videoList: []
}
}, },
getVideoList(){ async mounted() {
queryProjectList({ // await this.getDiverType()
"carTypeId": storage.get('carType') || '1001',
"driveType": this.diverTypeList[this.diverTypeIndex].configItemCode,
"subject": String(this.subject),
"type": "1"
}).then(resp=>{
this.operateList=resp.data
this.projectId=this.operateList[0]?.projectId
})
}, },
getDiverType(){ computed: {
const carTypeId=storage.get('carType') || '1001' ...mapState(useUserStore, ["vipOnList", "token"])
querySysConfigList(carTypeId,'DriveType').then(resp=>{ },
if(resp.code==='0000'){ methods: {
this.diverTypeList=resp.data ...mapActions(useUserStore, ['searchUserVip']),
this.getVideoList() //vip视频页面
async toVipVideo(){
if (this.token) {
await this.searchUserVip()
const res = this.vipOnList.some(item => item.subjects.includes(this.subject))
if (!res) {
uni.navigateTo({
url:"/pages/index/videoVip?subject="+this.subject
})
}else{
uni.navigateTo({
url: "/pages/questionBank/baseOperate?subject=" + this.subject+"&type=3"
})
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
},
onChange(e) {
this.videoIndex = e.detail.current
this.$nextTick(() => {
const index = this.videoIndex - 1 < 0 ? 0 : this.videoIndex - 1
this.intoindex = "text" + index
});
},
getOperateList() {
queryProjectList({
"carTypeId": storage.get('carType') || '1001',
"subject": String(this.subject),
"type": "2"
}).then(resp => {
if (resp.code === '0000' && resp.data &&resp.data.length) {
this.baseList = resp.data
this.videoList = resp.data[0] && resp.data[0].videoList? resp.data[0].videoList.slice(0, 5) : []
} }
}) })
}, },
changeDiverType(){ formateTime(time) {
this.diverTypeIndex=this.diverTypeIndex==0?1:0 const h = parseInt(time / 3600)
this.getVideoList() const minute = parseInt(time / 60 % 60)
const second = Math.ceil(time % 60)
const hours = h < 10 ? '0' + h : h
const formatSecond = second > 59 ? 59 : second
return `${hours > 0 ? `${hours}:` : ''}${minute < 10 ? '0' + minute : minute}:${formatSecond < 10 ? '0' + formatSecond : formatSecond}`
}, },
checkVideo(val){ async toVideo() {
this.projectId=this.operateList[val]?.projectId if (this.token) {
this.videoIndex=val await this.searchUserVip()
}, const res = this.vipOnList.some(item => item.subjects.includes(this.subject))
toDetail(){ if (!res) {
uni.navigateTo({ uni.navigateTo({
url:"/pages/questionBank/baseOperate" url:"/pages/index/videoVip?subject="+this.subject
}) })
}else{
let arr = JSON.parse(JSON.stringify(this.operateList))
arr = arr.map(item => {
return {
...item,
videoUrl: item.videoList[0]?.videoUrl,
videoTime: this.formateTime(item.videoList[0]?.videoTime)
}
})
let jsonString = JSON.stringify(arr)
console.log('arr',jsonString);
uni.navigateTo({
url: "/pages/questionBank/videoDetail?videoList=" + jsonString + "&subject=" + this.subject +
"&projectId=" + this.projectId + "&type=1&driveType=2"
})
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
},
toOperateDetail(val) {
let arr = JSON.parse(JSON.stringify(this.baseList[0].videoList))
arr = arr.map(item => {
return {
...item,
projectId: item.videoId,
subDesc: this.baseList[0].description,
videoTime: this.formateTime(item.videoTime)
}
})
let jsonString = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/videoDetail?videoList=" + jsonString + "&subject=" + this.subject +
"&projectId=" + val + "&type=2"
})
},
getVideoList() {
queryProjectList({
"carTypeId": storage.get('carType') || '1001',
"driveType": '2',
"subject": String(this.subject),
"type": "1"
}).then(resp => {
if(resp.code==='0000'){
this.operateList = resp.data
this.projectId = this.operateList[0]?.projectId
}
})
},
getDiverType() {
const carTypeId = storage.get('carType') || '1001'
querySysConfigList(carTypeId, 'DriveType').then(resp => {
if (resp.code === '0000') {
this.diverTypeList = resp.data
this.getVideoList()
this.getOperateList()
}
})
},
changeDiverType() {
this.diverTypeIndex = this.diverTypeIndex == 0 ? 1 : 0
this.videoIndex = 0
this.getVideoList()
this.getOperateList()
},
checkVideo(val) {
this.projectId = this.operateList[val]?.projectId
this.videoIndex = val
},
toDetail() {
uni.navigateTo({
url: "/pages/questionBank/baseOperate?subject=" + this.subject+"&type=2"
})
}
} }
} }
}
</script> </script>
<style scoped> <style scoped>
.box-nav{ .box-nav {
width: 100%; width: 100%;
position: relative; position: relative;
} }
.center-box{
position: absolute; .center-box {
width: 100%; position: absolute;
top: 170rpx; width: 100%;
padding: 0 28rpx; top: 170rpx;
} padding: 0 28rpx;
.video_box{ }
width: 100%;
background: #FFFFFF; .video_box {
border-radius: 16rpx; width: 100%;
padding: 14px; background: #FFFFFF;
} border-radius: 16rpx;
.tab_iem{ padding: 14px;
padding: 0 5px; }
height: 56rpx;
line-height: 56rpx; .tab_iem {
text-align: center; padding: 0 5px;
background: #F5F5F5; height: 56rpx;
border-radius: 10rpx; line-height: 56rpx;
color:#333 text-align: center;
background: #F5F5F5;
border-radius: 10rpx;
color: #333
}
.checked_tab {
background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
color: #fff
}
.pic {
width: 300rpx;
height: 169rpx;
background: #00B74F;
border-radius: 10rpx;
}
.play_btn_3 {
width: 65rpx;
height: 65rpx;
position: absolute;
left: 117.5rpx;
top: 52rpx
}
.play_btn_2 {
width: 65rpx;
height: 65rpx;
position: absolute;
left: calc((100% - 65rpx)/2);
top: 148.5rpx
}
/*scroll-view外层*/
.skill-sequence-panel-content-wrapper {
position: relative;
white-space: nowrap;
}
/*scroll-view本身*/
.skill-sequence-panel-content {
min-width: 100%;
}
/*scroll-view内层*/
.skill-sequence-skill-wrapper {
display: inline-block;
margin-right: 15px;
}
.hide {
backface-visibility: hidden;
transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
} }
.checked_tab{
background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
color:#fff
}
.pic{
width: 300rpx;
height: 169rpx;
background: #00B74F;
border-radius: 8rpx;
}
.play_btn_3{
width: 65rpx;
height: 65rpx;
position: absolute;
left:117.5rpx;
top: 52rpx
}
.play_btn_2{
width: 65rpx;
height: 65rpx;
position: absolute;
left: calc((100% - 65rpx)/2);
top: 148.5rpx
}
</style> </style>

View File

@@ -1,20 +1,32 @@
<template> <template>
<view> <view>
<u-sticky bgColor="#fff"> <view v-if="getLoading" class="wp100 relative" style="height: 100vh;">
<u-tabs :list="categoryList" :current="curTab" :scrollable="false" @change="changeCategory"></u-tabs> <image class="wp100" mode="widthFix" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E8%80%83%E8%AF%95%E6%8F%90%E9%86%92_20230906135037.png"></image>
</u-sticky> <view class="wp100 flex ai-c jc-c" style="position: absolute;bottom: 0;left: 0;padding-bottom: 124rpx;">
<view style="height: 100vh;background-color: rgb(245, 245, 245);"> <image style="width: 452rpx;" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E9%87%91%E6%AD%A6%E8%81%94_20230831123333.png" mode="widthFix"></image>
</view>
</view>
<view v-if="!getLoading">
<j-navbar :isBack="false">金武联驾考</j-navbar>
<u-sticky bgColor="#fff">
<u-tabs :list="categoryList" :current="curTab" :scrollable="false" @change="changeCategory"></u-tabs>
</u-sticky>
<view style="background-color: rgb(245, 245, 245);">
<template v-if="subject=='1' || subject=='4'"> <template v-if="subject=='1' || subject=='4'">
<Subject1 :subject="subject" :rightList="rightList" :wrongList="wrongList" /> <Subject1 :subject="subject" :rightList="rightList" :wrongList="wrongList" />
</template> </template>
<template v-else> <template v-else>
<subject2 :subject="subject" ref="subjectRef" /> <Subject2 :subject="subject" ref="subjectRef" />
</template> </template>
</view> </view>
</view> </view>
</view>
</template> </template>
<script> <script>
import { mapState,mapActions } from 'pinia' //引入映射函数 import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store import useQuestionStore from '@/jtools/store/question' //引入store
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
import { import {
@@ -22,70 +34,94 @@
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import Subject1 from "./components/Subject1"; import Subject1 from "./components/Subject1";
import Subject2 from "./components/Subject2"; import Subject2 from "./components/Subject2";
export default { export default {
components: {Subject1,Subject2}, components: {
data() { Subject1,
Subject2
},
data() {
return { return {
subject:storage.get('curSubject') || '1', show:false,
curTab:Number(storage.get('curSubject'))-1, subject: storage.get('curSubject') || '1',
searchValue:'', curTab: 0,
cityName:'', searchValue: '',
categoryList:[], cityName: '',
rightList:storage.get(`rightList_subject${this.subject}`) || [], categoryList: [],
wrongList:storage.get(`wrongList_subject${this.subject}`) || [], rightList: storage.get(`rightList_subject${this.subject}`) || [],
wrongList: storage.get(`wrongList_subject${this.subject}`) || [],
}; };
}, },
onLoad(){ onShow() {
this.show=true
this.getSubjectConfig() this.getSubjectConfig()
if (this.subject == '1' || this.subject == '4') {
this.rightList = storage.get(`rightList_subject${this.subject}`) || []
this.wrongList = storage.get(`wrongList_subject${this.subject}`) || []
}
if(this.subject=='2'||this.subject=='3'){
this.$refs.subjectRef.getDiverType()
}
}, },
onShow() { onHide(){
if(this.subject=='1'||this.subject=='4'){ this.show=false
this.rightList=storage.get(`rightList_subject${this.subject}`) || [] },
this.wrongList=storage.get(`wrongList_subject${this.subject}`) || [] computed: {
} ...mapState(useQuestionStore, ["loading_subject4", "loading_subject1","curSubject","orderQuestion_subject1","orderQuestion_subject4"]), //映射函数取出tagslist
}, getLoading() {
methods:{ return this.loading_subject4 && this.loading_subject1
...mapActions(useQuestionStore,['getOrderQuestion_sub4','getOrderQuestion_sub1','changeSubject']), }
},
watch:{
getLoading(newVal){
if(this.show){
if(newVal){
if(this.loading_subject4 && this.loading_subject1){
uni.hideTabBar();
}
}else{
uni.showTabBar()
}
}
}
},
methods: {
...mapActions(useQuestionStore, ['getOrderQuestion_sub4', 'getOrderQuestion_sub1', 'changeSubject']),
//获取科目配置 //获取科目配置
getSubjectConfig(){ getSubjectConfig() {
const carTypeId=storage.get('carType') || '1001' const carTypeId = storage.get('carType') || '1001'
querySysConfigList(carTypeId,'Subject').then(resp=>{ querySysConfigList(carTypeId, 'Subject').then(resp => {
if(resp.code==='0000'){ if (resp.code === '0000') {
this.categoryList=resp.data.map(item=>{ this.categoryList = resp.data.map(item => {
return{ return {
...item, ...item,
name:item.configItemName name: item.configItemName
} }
}) })
this.subject=storage.get('curSubject') || '1',
this.curTab=this.categoryList.findIndex(item=>item.configItemCode==this.subject)
} }
}) })
}, },
//切换科目 //切换科目
async changeCategory(val){ async changeCategory(val) {
this.subject=val.configItemCode this.subject = val.configItemCode
console.log();
if(this.subject=='1'){
await this.getOrderQuestion_sub1()
}else if(this.subject=='4'){
await this.getOrderQuestion_sub4()
}else{
this.changeSubject(this.subject) this.changeSubject(this.subject)
setTimeout(()=>{ if (this.subject == '1' || this.subject == '4') {
this.$refs.subjectRef.getDiverType() this.rightList = storage.get(`rightList_subject${this.subject}`) || []
},100) this.wrongList = storage.get(`wrongList_subject${this.subject}`) || []
} } else {
if(this.subject=='1'||this.subject=='4'){ setTimeout(() => {
this.rightList=storage.get(`rightList_subject${this.subject}`) || [] this.$refs.subjectRef.getDiverType()
this.wrongList=storage.get(`wrongList_subject${this.subject}`) || [] }, 100)
} }
}, },
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .u-tabs__wrapper__nav__line { ::v-deep .u-tabs__wrapper__nav__line {
background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%) !important; background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%) !important;
bottom: 14rpx !important; bottom: 14rpx !important;
} }
</style> </style>

View File

@@ -0,0 +1,139 @@
<template>
<view>
<u-loading-page :loading="getLoading" loading-text="题库更新中..."></u-loading-page>
<view class="relative" v-if="!getLoading"
style="width: 100%;background-image: url(https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E8%80%83%E5%89%8D%E5%AF%86%E5%8D%B7_20230904212623.png);background-size: 100% 100%;height: 100vh;">
<view style="position: absolute;top: 320px;" class="wp100 p35lr flex jc-sb ai-c">
<view class="paper_item" @tap="toExam({isExam1:'1'})">
<view class="topTitle">
秘卷一
</view>
<view class="bottom">
<text class="wenzi">新规考点提炼</text>
<view class="wp100 p5 mt15">
<view class="btn">
去考试
</view>
</view>
</view>
</view>
<view class="paper_item" @tap="toExam({isExam2:'1'})">
<view class="topTitle">
秘卷二
</view>
<view class="bottom">
<text class="wenzi">精选高频考试</text>
<view class="wp100 p5 mt15">
<view class="btn">
去考试
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import storage from '@/jtools/storage';
import {
queryQuestionId,
getTestQuestionId
} from '@/jtools/api/question';
export default {
data() {
return {
subject:'1'
}
},
onLoad(op){
if(op.subject){
this.subject=op.subject
}
},
computed: {
...mapState(useQuestionStore, ["loading_subject4", "loading_subject1", "curSubject","version"]), //映射函数取出tagslist
getLoading() {
return this.loading_subject4 && this.loading_subject1
}
},
methods: {
...mapActions(useQuestionStore, ['getOrderQuestion_sub4', 'getOrderQuestion_sub1', 'changeSubject']),
toExam(param) {
queryQuestionId({
versionId: this.version,
carTypeId: storage.get('carType') || '1001',
subject: this.subject,
...param
}).then(async (resp) => {
if (resp.code === '0000') {
const arr = resp.data
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/practiceExams?title=考前秘卷&subject=" + this.subject + "&questionIdList=" + listJson
})
}
})
},
}
}
</script>
<style scoped>
.paper_item {
width: 287rpx;
height: 320rpx;
/* border: 4px solid #F8A42C; */
border-radius: 16rpx;
}
.topTitle {
width: 100%;
height: 85rpx;
line-height: 85rpx;
text-align: center;
background: linear-gradient(90deg, #E66501 0%, #F8A42C 100%);
border-radius: 16rpx 16rpx 0rpx 0rpx;
font-size: 48rpx;
font-family: PingFang SC;
font-weight: 600;
color: #FFFFFF;
}
.bottom {
padding-top: 15px;
width: 100%;
height: 235rpx;
border-radius: 0rpx 0rpx 16rpx 16rpx;
border-bottom: 4px solid #F8A42C;
border-left: 4px solid #F8A42C;
border-right: 4px solid #F8A42C;
text-align: center;
}
.wenzi {
font-size: 40rpx;
font-family: PingFang SC;
font-weight: 600;
color: #7D4310;
line-height: 48rpx;
}
.btn {
width: 246rpx;
height: 76rpx;
text-align: center;
line-height: 76rpx;
color: #fff;
background: linear-gradient(0deg, #E66501 0%, #F8A42C 100%);
box-shadow: 0rpx 2rpx 21rpx 0rpx #F7A12A;
border-radius: 38rpx;
}
</style>

View File

@@ -0,0 +1,83 @@
<template>
<view class="bc-fff hp100">
<view class="wp100 p14 flex ai-c jc-c">
<view class="text-center">
<view style="width: 64px;height: 64px;border-radius: 50%;overflow: hidden;margin-bottom: 10px;">
<u-avatar class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar>
</view>
<text class="fs18">{{user.userName}}{{ user.userId }}</text>
</view>
</view>
<view class="p14">
<view class="wp100 p14lr p20tb mb14" style="background-color: rgb(248, 248, 248);border-radius: 20rpx;">
<view class="flex ai-c jc-sb pb10">
<text style="color: rgb(175, 175, 175);">考试类型</text>
<text>{{carName}}</text>
</view>
<view class="flex ai-c jc-sb pb10">
<text style="color: rgb(175, 175, 175);">考试标准</text>
<text>{{subject=='1'?100:50}}/45分钟</text>
</view>
<view class="flex ai-c jc-sb pb10">
<text style="color: rgb(175, 175, 175);">合格标准</text>
<text>90分及格(满分100分)</text>
</view>
<view class="flex ai-c jc-sb">
<text style="color: rgb(175, 175, 175);">出题规则</text>
<text>根据公安部出题规则组卷</text>
</view>
</view>
<text>模拟考试不能修改答案每错1题扣{{subject=='1'?1:2}}错题累计超过{{subject=='1'?10:5}}考试不通过</text>
</view>
<view class="p14lr wp100" style="margin-top: 30px;">
<u-button :customStyle="{width: '100%',borderRadius:'40rpx',backgroundColor:'#05C341',color:'#fff'}" text="开始考试"
@click="submit" />
</view>
<view>
</view>
</view>
</template>
<script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useUserStore from '@/jtools/store/user'
import storage from '@/jtools/storage';
import useQuestionStore from '@/jtools/store/question' //引入store
export default {
data() {
return {
carName:storage.get('carName') ||'小车C1/C2/C3',
questionList: '',
subject:'1',
}
},
onLoad(op) {
if (op.questionIdList) {
this.questionList = op.questionIdList
}
if(op.subject){
this.subject = op.subject
}
},
computed: {
...mapState(useQuestionStore, ["currentCarName"]), //映射函数取出tagslist
user() {
return useUserStore().userInfo
},
},
methods: {
submit(){
uni.navigateTo({
url: "/pages/questionBank/practiceExams?title=模拟考试&subject=" + this.subject + "&questionIdList=" + this.questionList
})
}
}
}
</script>
<style scoped>
</style>

View File

@@ -4,7 +4,7 @@
<view class="left hp100"> <view class="left hp100">
<view class="fl1 flex" style="align-items: stretch;"> <view class="fl1 flex" style="align-items: stretch;">
<view class="info"> <view class="info">
<view class="flex ai-c jc-c mt10 mr10 fs16" style="border: 1px solid #999;height: 32px;"> <view class="flex ai-c jc-c mr10 fs16" style="border: 1px solid #999;height: 32px;">
第01考台 第01考台
</view> </view>
<view class="mt10 p10tb" style="background-color: rgb(177, 222, 255);"> <view class="mt10 p10tb" style="background-color: rgb(177, 222, 255);">
@@ -15,21 +15,15 @@
<view class="p10" style="background-color: rgb(235, 235, 235);"> <view class="p10" style="background-color: rgb(235, 235, 235);">
<view class="flex ai-c"> <view class="flex ai-c">
<text class="fs12 cor-333">姓名</text> <text class="fs12 cor-333">姓名</text>
<view class="fl1 info-box"> <view class="fl1 info-box">{{ user.userName }}{{ user.userId }}</view>
{{ user.userName }}{{ user.userId }}
</view>
</view> </view>
<view class="flex ai-c"> <view class="flex ai-c mt5">
<text class="fs12 cor-333">类型</text> <text class="fs12 cor-333">类型</text>
<view class="fl1 info-box"> <view class="fl1 info-box">小车</view>
小车
</view>
</view> </view>
<view class="flex ai-c"> <view class="flex ai-c mt5">
<text class="fs12 cor-333">科目</text> <text class="fs12 cor-333">科目</text>
<view class="fl1 info-box"> <view class="fl1 info-box">科目一</view>
科目一
</view>
</view> </view>
</view> </view>
</view> </view>
@@ -37,15 +31,18 @@
<view class="fs14 cor-000"> <view class="fs14 cor-000">
{{questionIndex}} {{question.question}} {{questionIndex}} {{question.question}}
</view> </view>
<view v-if="question.type != 1" v-for="item in question.optionList" class="mt5 fs14 cor-000"> <view v-if="question.type != 1" v-for="(item, idx) in question.optionList" :key="idx"
{{item}} class="mt5 fs14 cor-000">
{{item.op}}: {{item.opDesc}}
</view> </view>
</view> </view>
</view> </view>
<view class="ans-box"> <view class="ans-box">
<view class="flex ai-c"> <view class="flex ai-c">
<view class="time"> <view class="time">
<text class="mt7">45:00</text> <!-- <text class="mt7">45:00</text> -->
<u-count-down ref="countDown" :time="timeCount" format="mm:ss" @change="e=>this.time=e"
@finish="timeFinish"></u-count-down>
</view> </view>
<view class="ml20 fs16 cor-333 fwb"> <view class="ml20 fs16 cor-333 fwb">
您的答案 您的答案
@@ -56,16 +53,18 @@
<button class="btn" :class="{ done: question.yourAnswer==2 }" @tap="handleAnswer(2)">×</button> <button class="btn" :class="{ done: question.yourAnswer==2 }" @tap="handleAnswer(2)">×</button>
</view> </view>
<view v-else class="flex"> <view v-else class="flex">
<template v-for="(item,index) in question.optionList"> <template v-for="(item,index) in question.optionList" :key="index">
<button class="btn" :class="{ done: question.yourAnswer.includes(index+1) }" @tap="handleAnswer(index+1)">{{['A','B','C','D','E','F','G'][index]}}</button> <button class="btn" :class="{ done: question.yourAnswer.includes(index+1) }"
@tap="handleAnswer(index+1)">{{['A','B','C','D','E','F','G'][index]}}</button>
</template> </template>
</view> </view>
</view> </view>
</view> </view>
<view class="right" style="border: 1px solid #999;;"> <view class="right" style="border: 1px solid #999;;">
<u-grid border col="10"> <u-grid border :col="subject==1?10:5">
<u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex" style="box-sizing: border-box;"> <u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex" style="box-sizing: border-box;">
<view class="q-item" :class="{ 'current-question': questionIndex==listIndex+1, done: listItem.yourAnswer }" @tap="questionIndex=listIndex+1">{{listIndex+1}}</view> <view class="q-item" :class="{ 'current-question': questionIndex==listIndex+1, done: listItem.yourAnswer }"
@tap="questionIndex=listIndex+1">{{listIndex+1}}</view>
</u-grid-item> </u-grid-item>
</u-grid> </u-grid>
</view> </view>
@@ -82,50 +81,65 @@
<view class="flex"> <view class="flex">
<button :disabled="questionIndex==1" class="btn" @tap="questionIndex--">上一题</button> <button :disabled="questionIndex==1" class="btn" @tap="questionIndex--">上一题</button>
<button :disabled="questionIndex==list.length" class="btn" @tap="questionIndex++">下一题</button> <button :disabled="questionIndex==list.length" class="btn" @tap="questionIndex++">下一题</button>
<button class="btn">交卷</button> <button class="btn" @tap="handleConfirm">交卷</button>
</view> </view>
</view> </view>
<view class="img-box"> <view class="img-box">
<image style="height: 100%;" mode="heightFix" :src="question.imageUrl"></image>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import useUserStore from '@/jtools/store/user' import useUserStore from '@/jtools/store/user'
import {
getTestQuestion,
submitTest
} from '@/jtools/api/question';
import storage from '@/jtools/storage';
export default { export default {
data() { data() {
return { return {
question: {}, subject:'1',
questionIndex: 1, questionIndex: 1,
list: [], list: [],
mutiAns: [] mutiAns: []
} }
}, },
computed: { computed: {
...mapState(useQuestionStore, ["orderQuestion_subject1", "orderQuestion_subject4", "version"]), //映射函数取出tagslis
user() { user() {
return useUserStore().userInfo return useUserStore().userInfo
}, },
question() { question() {
if(this.questionIndex!=0 && this.list.length) { if (this.questionIndex != 0 && this.list.length) {
return this.list[this.questionIndex-1] return this.list[this.questionIndex - 1]
} else { } else {
return {} return {}
} }
},
timeCount() {
return this.subject == 1 ? 60 * 60 * 1000 : 45 * 60 * 1000
} }
}, },
onShow() { onShow() {
this.fz() this.fz()
setTimeout(() => { },
for (var i = 0; i < 100; i++) { onLoad(option) {
this.list.push({ this.subject = option.subject || 1
type: i%3+1, if(option.questionIdList){
question: '这是题目这是题目内容这是题目内容这是题目内容内容这是题目这是题目内容这是题目内容这是题目内容内容', const idList=JSON.parse(option.questionIdList)
optionList: ['A', 'B', 'C', 'D'], let arr = this[`orderQuestion_subject${this.subject}`].filter(qItem=>idList.includes(qItem.questionId))
yourAnswer:'' this.list = arr.map(it => ({
}) ...it,
} yourAnswer: ''
},1000) }))
}
}, },
methods: { methods: {
fz() { fz() {
@@ -133,21 +147,97 @@
orientation: 'landscape' orientation: 'landscape'
}); });
}, },
// _getList() {
// getTestQuestion({
// carTypeId: storage.get('carType') || '1001',
// subject: this.subject
// }).then(resp => {
// if (resp.code === '0000') {
// this.list = resp.data.map(it => ({
// ...it,
// yourAnswer: ''
// }))
// }
// })
// },
handleAnswer(index) { handleAnswer(index) {
// 如果是多选 // 如果是多选
let q = this.list[this.questionIndex-1] let q = this.list[this.questionIndex - 1]
if(q.type == 3) { if (q.type == 3) {
let arr = q.yourAnswer ? q.yourAnswer.split(',') : [] let arr = q.yourAnswer ? q.yourAnswer.split(',') : []
arr.includes(index+'') ? arr = arr.filter(it=>it!=(index+'')) : arr.push(index) arr.includes(index + '') ? arr = arr.filter(it => it != (index + '')) : arr.push(index)
this.list[this.questionIndex-1].yourAnswer = arr.join(',') this.list[this.questionIndex - 1].yourAnswer = arr.join(',')
} else { } else {
this.list[this.questionIndex-1].yourAnswer = index+'' this.list[this.questionIndex - 1].yourAnswer = index + ''
} }
}, },
getDesc(type) { getDesc(type) {
let tt1 = ['','判断题,','单选题,','多选题,'][type] let tt1 = ['', '判断题,', '单选题,', '多选题,'][type]
let tt2 = ['','请判断对错!','请在备选答案中选择你认为正确的答案!','请在备选答案中选择多个你认为正确的答案!'][type] let tt2 = ['', '请判断对错!', '请在备选答案中选择你认为正确的答案!', '请在备选答案中选择多个你认为正确的答案!'][type]
return tt1 + tt2 return tt1 + tt2
},
handleConfirm() {
const wdLength = this.list.filter(it => !it.yourAnswer).length
if (wdLength) {
uni.showModal({
title: '考试确认窗口',
content: `您还有${wdLength}题未答,是否确认交卷?`,
confirmText: '确认交卷',
cancelText: '继续考试',
success: (res) => {
if (res.confirm) {
this.toSubmit()
}
}
})
} else {
uni.showModal({
title: '考试确认窗口',
content: `是否确认交卷?`,
confirmText: '确认交卷',
cancelText: '继续考试',
success: (res) => {
if (res.confirm) {
this.toSubmit()
}
}
})
}
},
timeFinish() {
uni.showToast({
title: "考试结束,将为您自动交卷~",
icon: 'none'
})
setTimeout(() => {
this.toSubmit()
}, 1000)
},
toSubmit() {
const restTime = this.time.hours * 60 * 60 + this.time.minutes * 60 + this.time.seconds
const score = this.list.reduce((pre, cur) => {
const isTrue = cur.trueAnswer == cur.yourAnswer.replace(/,-g/, '')
let s = 0
if (isTrue) {
s = this.subject == 1 ? 1 : 2
}
return pre + s
}, 0)
submitTest({
"carTypeId": storage.get('carType') || '1001',
"score": score,
"testTime": 60 * 60 - restTime,
subject: this.subject
}).then(resp => {
uni.showToast({
title: '考试结束!',
icon: 'none',
complete() {
uni.navigateBack()
}
})
})
} }
}, },
} }
@@ -158,10 +248,12 @@
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.info { .info {
width: 100px; width: 100px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.info-box { .info-box {
margin-left: 5px; margin-left: 5px;
padding-left: 5px; padding-left: 5px;
@@ -172,33 +264,37 @@
color: #333; color: #333;
} }
} }
.question-box { .question-box {
position: relative; position: relative;
padding: 10px; padding: 10px;
border-top: 1px solid #999; border-top: 1px solid #999;
border-left: 1px solid #999; border-left: 1px solid #999;
} }
.ans-box { .ans-box {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
height: 44px; height: 50px;
border-top: 1px solid #999; border-top: 1px solid #999;
.time { .time {
position: relative; position: relative;
display: flex; display: flex;
width: 90px; width: 90px;
height: 28px; height: 32px;
line-height: 16px; line-height: 16px;
justify-content: center; justify-content: center;
align-items: center;
font-size: 14px; font-size: 14px;
color: #333; color: #333;
border: 1px solid #ccc; border: 1px solid #999;
&::before { &::before {
content: '剩余时间'; content: '剩余时间';
position: absolute; position: absolute;
left: 5px; left: 6px;
top: 0; top: 0;
background-color: #f5f5f5; background-color: #f5f5f5;
font-size: 10px; font-size: 10px;
@@ -237,20 +333,25 @@
margin-right: 10px; margin-right: 10px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
background-color: rgb(244, 243, 239); // background-color: rgb(244, 243, 239);
font-size: 14px; font-size: 14px;
box-shadow:
0 0 4px rgba(0, 0, 0, .4),
// -7px -7px 12px rgba(255, 255, 255, .9);
} }
.img-box { .img-box {
height: 120px; height: 120px;
display: flex; display: flex;
justify-content: space-between; justify-content: center;
align-items: center; align-items: center;
border: 1px solid #999; border: 1px solid #999;
} }
.current-question{
.current-question {
background-color: #93F0E4; background-color: #93F0E4;
} }
.done { .done {
background-color: #33FF66; background-color: #33FF66;
} }

View File

@@ -1,38 +1,75 @@
<template> <template>
<view class="relative" style="height: 100vh;"> <view class="relative" style="height: 100vh;">
<image style="width: 100%;height: 600rpx;" src="../../static/image/index/vip_bg.jpg"></image> <view style="height: 100%;overflow: scroll;background-color: #fff;">
<view class="p14"> <image style="width: 100%;height: 600rpx;" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/vip%E9%A2%98%E5%BA%93_20230911211532.png"></image>
<view class="flex jc-fa ai-c wp100"> <view style="margin-bottom: 100px;">
<view class="option_tem relative mr15" :class="checkedId===item.memberId?'checked_item':''" v-for="(item,index) of priceList" :key="index" @click="checkPrice(item.memberId,item.price)"> <view class="flex jc-fa ai-c wp100 p14">
<text class="fw600 fs15 cor-333">{{item.memberName}}</text> <view style="width: 33.3%;" v-for="(item, index) of priceList" :key="index">
<view class="mt5"> <view class="option_tem relative" :class="checkedId === item.memberId ? 'checked_item' : ''" @click="checkPrice(item.memberId, item.price)">
<text class="fs14" style="color: #FF6E02;">¥</text> <text class="fw600 fs12 cor-333">{{ item.memberName }}</text>
<text class="fs30 fw600" style="color: #FF6E02;">{{item.price}}</text> <view class="mt5" v-if="!isIOS">
</view> <text class="fs14" style="color: #FF6E02;">¥</text>
<text class="fs12 cor-999">长期有效</text> <text class="fs30 fw600" style="color: #FF6E02;">{{ item.price }}</text>
<view class="bottom_box fs12 cor-333" :class="checkedId===item.memberId?'checked_bottom':''">赠送vip题库</view> </view>
<view class="tag" v-if="item.all"> <view v-else class="mt5">
<text style="transform:scale(0.83);">合买更优惠</text> <text class="fs14" style="color: #FF6E02;">iOS暂不支持</text>
</view>
<text class="fs12 cor-999">一年有效</text>
<!-- <view class="bottom_box fs12 cor-333" :class="checkedId===item.memberId?'checked_bottom':''">赠送vip题库</view> -->
<view class="tag" v-if="item.all">
<text style="transform:scale(0.83);">合买更优惠</text>
</view>
</view> </view>
</view>
</view>
<view class="mt15 intr_box">
<view class="fw600 fs16 cor-000">免费获赠<text style="color: #FF6E02;">价值68元</text>的VIP题库</view>
<view class="flex ai-c jc-sb mt15">
<view class="flex ai-c">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vip500.png"></image>
<view class="vip_item">含精简500题</view>
</view>
<view class="flex ai-c">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vipmijuan.png"></image>
<view class="vip_item">含考前密卷2套</view>
</view> </view>
</view> </view>
<view class="intr_box p14">
<view class="fw600 fs16 cor-000">尊享以下权益</view>
<view class="flex ai-c jc-sb mt15" v-if="subject == '1' || subject == '4'">
<view class="text-center" style="width: 33%">
<view class="wp100 flex ai-c jc-c mb5">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vip500.png"></image>
</view>
<text>精简{{ titleNum }}</text>
</view>
<view class="text-center" style="width: 33%;">
<view class="wp100 flex ai-c jc-c mb5">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vip_trueRoom.png"></image>
</view>
<text>真实考场模拟</text>
</view>
<view class="text-center" style="width: 33%;">
<view class="wp100 flex ai-c jc-c mb5">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vipmijuan.png"></image>
</view>
<text>考前密卷</text>
</view>
</view>
<view v-else>
<view class="flex ai-c jc-c mt15">
<view class="flex ai-c">
<image style="width: 63rpx;height: 63rpx;margin-right: 5px;" src="../../static/image/index/vip_ksxj.png"></image>
<view class="vip_item">考试项目详解</view>
</view>
</view>
<view class="flex ai-c mt20">
<view class="contain-box relative">
<image class="contain-box" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E5%B0%8F%E8%BD%A6_20230911211545.png"></image>
</view>
<view class="ml15" style="text-align: left;">
<view class="cor-333 fw600">考试项目详解</view>
<view class="fs15 mt10" style="color: #9F826C ;">考试实操技巧讲解事半功倍</view>
</view>
</view>
</view>
</view>
<view class="wp100 mt15" v-if="subject == '1' || subject == '4'">
<image class="wp100" mode="widthFix" :src="picUrl"></image>
</view>
</view> </view>
</view> </view>
<view class="wp100 p14" style="position: absolute;left: 0;bottom:20px" @tap="handlePay()"> <view v-if="!isIOS" class="wp100 p14" style="position: absolute;left: 0;bottom:20px" @tap="handlePay()">
<view class="sub_btn flex ai-c jc-sb"> <view class="sub_btn flex ai-c jc-sb">
<text class="cor-fff fs14">¥<text class="fs24 cor-fff">{{nowPrice}}</text></text> <text class="cor-fff fs14">¥<text class="fs24 cor-fff">{{ nowPrice }}</text></text>
<image style="width: 276rpx;height: 88rpx;margin-top: -5px;" src="../../static/image/index/buy.png"></image> <image style="width: 276rpx;height: 88rpx;margin-top: -5px;" src="../../static/image/index/buy.png"></image>
</view> </view>
</view> </view>
@@ -40,149 +77,197 @@
</template> </template>
<script> <script>
import { import {
mapState, mapState,
mapActions mapActions
} from 'pinia' //引入映射函数 } from 'pinia' //引入映射函数
import { getVipList } from '@/jtools/api/vip' import { getVipList } from '@/jtools/api/vip'
import storage from '@/jtools/storage'; import { querySysConfig } from '@/jtools/api/question';
import Pay from '@/jtools/pay/index.js'; import storage from '@/jtools/storage';
import useUserStore from '@/jtools/store/user' import Pay from '@/jtools/pay/index.js';
export default { import useUserStore from '@/jtools/store/user'
data(){ export default {
return{ data() {
subject:'1', return {
loading:true, picUrl: '',
nowPrice:168, titleNum: 500,
checkedId:0, subject: '1',
priceList:[], loading: true,
order:{ nowPrice: 168,
money:0.01, checkedId: 0,
description:'会员充值' priceList: [],
} order: {
} money: 0,
}, description: '会员充值'
onLoad(op){
if(op.subject){
this.subject=op.subject
}
this.loading=true
this.getVipList()
this.getWXOpenId()
this.$set(this.order, 'userId', this.userInfo.userId);
},
computed: {
...mapState(useUserStore, ["userInfo"])
},
methods:{
handlePay(){
console.log(this.order);
if(this.loading){
this.loading=false
new Pay('wechat', this.order);
}
}, },
getWXOpenId() { isIOS: true
const that = this }
uni.login({ },
success(res) { onLoad(op) {
that.$set(that.order, 'code', res.code); this.isIOS = this.$platform.device().includes('ios')
} if (op.subject) {
}) this.subject = op.subject
}, }
getVipList(){ this.loading = true
getVipList({ this.getVipList()
currentCartype: storage.get('carType') || '1001', this.getWXOpenId()
subject:this.subject this.getTitle()
}).then(resp=>{ this.getPic()
this.priceList=resp.data this.$set(this.order, 'userId', this.userInfo.userId);
this.checkedId=this.priceList[0].memberId },
this.order.outTradeNo=this.priceList[0].memberId computed: {
this.nowPrice=this.priceList[0].price ...mapState(useUserStore, ["userInfo"])
this.priceList.forEach(item=>{ },
if(item.subjects.length>1){ methods: {
item.all=true getPic() {
const currentCartype = storage.get('carType') || '1001'
querySysConfig(currentCartype, 'VipDescImageUrl').then(res => {
this.picUrl = JSON.parse(res.data.configJson).url
})
},
getTitle() {
const carId = storage.get('carType') || '1001'
querySysConfig(carId, 'SimplifyQuestionNum').then(resp => {
if (resp.code === '0000') {
const list = JSON.parse(resp.data.configJson)
this.titleNum = list.find(item => item.subject == this.subject).num
}
})
},
async handlePay() {
if (this.loading) {
this.loading = false
await this.getWXOpenId()
new Pay('wechat', this.order);
this.loading = true
}
},
getWXOpenId() {
const that = this
uni.login({
success(res) {
that.$set(that.order, 'code', res.code);
}
})
},
getVipList() {
getVipList({
carTypeId: storage.get('carType') || '1001',
subject: this.subject
}).then(resp => {
if (resp.code === '0000') {
this.priceList = resp.data
this.checkedId = this.priceList[0].memberId
this.order.outTradeNo = this.priceList[0].memberId
this.order.money = this.priceList[0].price
this.nowPrice = this.priceList[0].price
this.priceList.forEach(item => {
if (item.subjects.length > 1) {
item.all = true
} }
}) })
}) }
}, })
checkPrice(val,price){ },
this.checkedId=val checkPrice(val, price) {
this.order.outTradeNo=val this.checkedId = val
this.nowPrice=price this.order.outTradeNo = val
} this.nowPrice = price
} this.order.money = price
} }
}
}
</script> </script>
<style scoped> <style scoped>
.option_tem{ .option_tem {
width: 220rpx; width: 220rpx;
height: 241rpx; height: 241rpx;
text-align: center; text-align: center;
background: #FFFFFF; background: #FFFFFF;
border: 2px solid #D8D8D8; border: 2px solid #D8D8D8;
border-radius: 16rpx 46rpx 16rpx 16rpx; border-radius: 16rpx 46rpx 16rpx 16rpx;
padding: 14px; padding: 14px;
} }
.checked_item{
width: 228rpx; .checked_item {
background: #FFF0E5; background: #FFF0E5;
border: 4px solid #FF6E02; border: 4px solid #FF6E02;
} }
.bottom_box{
width: 214rpx; .bottom_box {
height: 40rpx; width: 214rpx;
line-height: 40rpx; height: 40rpx;
text-align: center; line-height: 40rpx;
background: rgb(239,239,239); text-align: center;
border-radius: 0 0 16rpx 16rpx; background: rgb(239, 239, 239);
position: absolute; border-radius: 0 0 16rpx 16rpx;
bottom: 0; position: absolute;
left: 0; bottom: 0;
} left: 0;
.checked_bottom{ }
width: 218rpx;
border-radius: 0 0 16rpx 12rpx; .checked_bottom {
background-color: #FF6E02; width: 218rpx;
color:#fff border-radius: 0 0 16rpx 5rpx;
} background-color: #FF6E02;
.tag{ color: #fff
width: 122rpx; }
height: 36rpx;
background: linear-gradient(90deg, #E66501 0%, #F8A42C 100%); .tag {
border-radius: 8rpx 20rpx 8rpx 8rpx; padding: 0 5px;
line-height: 36rpx; height: 36rpx;
text-align: center; background: linear-gradient(90deg, #E66501 0%, #F8A42C 100%);
font-size: 12px; border-radius: 8rpx 20rpx 8rpx 8rpx;
color: #FFFC27; line-height: 36rpx;
position: absolute; text-align: center;
left: 10rpx; font-size: 12px;
top:-18rpx color: #FFFC27;
} position: absolute;
.intr_box{ left: 10rpx;
width: 100%; top: -18rpx
text-align: center; }
padding: 40rpx;
background: #FFF0E5; .intr_box {
border-radius: 16rpx; width: 100%;
} text-align: center;
.vip_item{ padding: 40rpx;
width: 208rpx; background: #FFF0E5;
height: 54rpx; border-radius: 16rpx;
line-height: 54rpx; }
text-align: center;
font-size: 14px; .vip_item {
background: #F3D7C2; width: 208rpx;
border-radius: 0rpx 10rpx 10rpx 10rpx; height: 54rpx;
} line-height: 54rpx;
.sub_btn{ text-align: center;
width:100%; font-size: 14px;
height: 110rpx; background: #F3D7C2;
border: 4px solid #F59B26; border-radius: 0rpx 10rpx 10rpx 10rpx;
background: linear-gradient(0deg, #E66501 0%, #F8A42C 100%); }
box-shadow: 0rpx 16rpx 20rpx 1rpx rgba(245,155,38,0.78);
border-radius: 55rpx; .sub_btn {
padding: 14rpx; width: 100%;
} height: 110rpx;
border: 4px solid #F59B26;
background: linear-gradient(0deg, #E66501 0%, #F8A42C 100%);
box-shadow: 0rpx 16rpx 20rpx 1rpx rgba(245, 155, 38, 0.78);
border-radius: 55rpx;
padding: 14rpx;
}
.contain-box {
width: 344rpx;
height: 196rpx;
background: #00B74F;
border-radius: 16rpx;
}
.play_btn_2 {
width: 65rpx;
height: 65rpx;
position: absolute;
left: 165.5rpx;
top: 78rpx
}
</style> </style>

View File

@@ -1,8 +1,8 @@
<template> <template>
<view class="content"> <view class="content">
<view class="header"> <view class="header">
<image src="/static/image/login/logo.jpg" mode="widthFix"></image> <image src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E9%87%91%E6%AD%A6%E8%81%94_20230831123333.png" mode="widthFix"></image>
<view class="mt21 fs16 cor-333 fwb text-center">欢迎使用金武驾考</view> <view class="mt21 fs16 cor-333 fwb text-center">欢迎使用金武驾考</view>
</view> </view>
<view class="list"> <view class="list">
@@ -13,7 +13,7 @@
<view class="list-call"> <view class="list-call">
<u-input class="sl-input" v-model="login.code" type="text" maxlength="6" border="none" placeholder="输入验证码"> <u-input class="sl-input" v-model="login.code" type="text" maxlength="6" border="none" placeholder="输入验证码">
<template #suffix> <template #suffix>
<text class="fs14 mr10" style="color: #05C341;" @tap="getCode">{{countDown==0?'获取验证码':countDown}}</text> <text class="fs14 mr10" style="color: #05C341;" @tap="getCode">{{ countDown == 0 ? '获取验证码' : countDown }}</text>
</template> </template>
</u-input> </u-input>
</view> </view>
@@ -27,136 +27,142 @@
</template> </template>
<script> <script>
import { import {
isPhone isPhone
} from '@/jtools/utils/validate.js' } from '@/jtools/utils/validate.js'
import { import {
getCode, getCode,
login login
} from '@/jtools/api/login' } from '@/jtools/api/login'
import useUserStore from '@/jtools/store/user' import useUserStore from '@/jtools/store/user'
export default { import storage from '@/jtools/storage';
data() { export default {
return { data() {
login: { return {
phone: '', login: {
code: '' phone: '',
}, code: ''
countDown: 0, },
js: undefined countDown: 0,
}; js: undefined
}, };
onShow() { },
if(useUserStore().isLogin) { onShow() {
this.toHome() if (useUserStore().isLogin) {
} this.toHome()
}, }
methods: { },
getCode() { methods: {
if (isPhone(this.login.phone) && this.countDown == 0) { getCode() {
getCode({ if (isPhone(this.login.phone) && this.countDown == 0) {
phone: this.login.phone getCode({
}).then(resp => { phone: this.login.phone
// if (resp.code == '0000') { }).then(resp => {
uni.showToast({ // if (resp.code == '0000') {
title: '发送成功!', uni.showToast({
icon: 'none' title: '发送成功!',
}) icon: 'none'
this.countDown = 60
this.js = setInterval(() => {
this.countDown--;
if (this.countDown == 0) {
this.clear()
}
}, 1000)
// }
}) })
} this.countDown = 60
}, this.js = setInterval(() => {
clear() { this.countDown--;
clearInterval(js) if (this.countDown == 0) {
this.js = null this.clear()
this.countDown = 0
},
bindLogin() {
if(isPhone(this.login.phone) && this.login.code) {
useUserStore().login(this.login).then(resp => {
if(resp.userId) {
this.toHome()
} }
}) }, 1000)
} // }
},
toHome() {
uni.switchTab({
url: '/pages/index/index'
}) })
} }
},
clear() {
clearInterval(js)
this.js = null
this.countDown = 0
},
bindLogin() {
if (isPhone(this.login.phone) && this.login.code) {
let params = { ...this.login }
if (storage.get('companyId')) {
params.id = storage.get('companyId')
}
useUserStore().login(params).then(resp => {
if (resp.userId) {
useUserStore().getUserInfo()
useUserStore().searchUserVip()
this.toHome()
}
})
}
},
toHome() {
uni.switchTab({
url: '/pages/index/index'
})
} }
} }
}
</script> </script>
<style> <style>
page { page {
background-color: #fff; background-color: #fff;
} }
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
} }
.header { .header {
margin-top: 166rpx; margin-top: 166rpx;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
letter-spacing: 10rpx; letter-spacing: 10rpx;
} }
.header image { .header image {
width: 383rpx; width: 383rpx;
} }
.list { .list {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-top: 120rpx; padding-top: 120rpx;
padding-left: 90rpx; padding-left: 90rpx;
padding-right: 90rpx; padding-right: 90rpx;
} }
.list-call { .list-call {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 100rpx; height: 100rpx;
color: #333333; color: #333333;
border-bottom: 0.5px solid #e2e2e2; border-bottom: 0.5px solid #e2e2e2;
} }
.list-call .sl-input { .list-call .sl-input {
flex: 1; flex: 1;
text-align: left; text-align: left;
font-size: 32rpx; font-size: 32rpx;
margin-left: 16rpx; margin-left: 16rpx;
} }
.button-login {
color: #FFFFFF;
font-size: 34rpx;
width: 560rpx;
height: 100rpx;
background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%);
border-radius: 50rpx;
line-height: 100rpx;
text-align: center;
margin-top: 100rpx;
margin-left: auto;
margin-right: auto;
}
.button-login {
color: #FFFFFF;
font-size: 34rpx;
width: 560rpx;
height: 100rpx;
background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%);
border-radius: 50rpx;
line-height: 100rpx;
text-align: center;
margin-top: 100rpx;
margin-left: auto;
margin-right: auto;
}
</style> </style>

View File

@@ -0,0 +1,99 @@
<template>
<view>
<view class="p14">
<view class="wp100 p14lr p20tb bc-fff br8 mb10 relative" style="box-sizing: border-box;" :class="checkedCar==item.carTypeId?'checked':''" v-for="(item,index) of carTypeList" :key="index" @click="changeType(item)">{{item.carName}}{{item.remark}}
<view class="p5 cor-fff fs12 br4" style="background-color:#05C341;position: absolute;right: -1rpx;top:-1rpx" v-if="checkedCar==item.carTypeId">已选</view>
</view>
<view class="wp100" style="margin-top: 40px;">
<u-button :customStyle="{width: '100%',borderRadius:'40rpx',backgroundColor:'#05C341',color:'#fff'}" text="确定"
@click="submit" />
</view>
<u-modal :show="show" title="提示" content="切换题库后上一个题库练习记录将会全部清空,确定要切换吗" showCancelButton @confirm="confirmSubmit" @cancel="cancel"></u-modal>
</view>
</view>
</template>
<script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import {
getCarTypeList,
} from '@/jtools/api/index';
import storage from '@/jtools/storage';
import useQuestionStore from '@/jtools/store/question' //引入store
export default{
data() {
return{
show:false,
carTypeList:[],
checkedCar: storage.get('carType') ||'1001',
checkedCarName:storage.get('carName') || '小车C1/C2/C3'
}
},
mounted() {
this.getCarTypeList()
},
computed:{
...mapState(useQuestionStore, ["loading_subject4", "loading_subject1","curSubject"]), //映射函数取出tagslist
getLoading() {
return this.loading_subject4 && this.loading_subject1
}
},
watch:{
getLoading(newVal){
console.log(newVal);
if(newVal){
uni.hideLoading()
uni.showToast({
title:'切换成功!'
})
this.cancel()
}
}
},
methods:{
getCarTypeList(){
getCarTypeList().then(resp=>{
if(resp.code==='0000'){
this.carTypeList=resp.data
}
})
},
changeType(item){
this.checkedCar=item.carTypeId
this.checkedCarName=item.carName+item.remark
},
submit(){
const id=storage.get('carType') ||'1001'
if(this.checkedCar==id){
uni.showToast({
title:'当前已是该车型题库!',
icon:'error'
})
}else{
this.show=true
}
},
cancel(){
this.show=false
},
confirmSubmit(){
storage.set('carType',this.checkedCar)
storage.set('carName',this.checkedCarName)
uni.showLoading({
title: '加载中'
});
useQuestionStore().resetStorage()
useQuestionStore().getAllQuestion()
}
}
}
</script>
<style scoped>
.checked{
border: 6rpx solid #05C341;
}
</style>

View File

@@ -2,13 +2,13 @@
<view class="bc-f5"> <view class="bc-f5">
<!-- <view class="wp100" style="background-color: #333;height: 205px;"></view> --> <!-- <view class="wp100" style="background-color: #333;height: 205px;"></view> -->
<view class="relative" style="height: 205px;"> <view class="relative" style="height: 205px;">
<image src="/static/image/mine/mine_bg.png" mode="widthFix" style="width: 100%;"></image> <image src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/vip%E8%83%8C%E6%99%AF%E7%BB%BF_20230831010645.png" mode="widthFix" style="width: 100%;"></image>
<view class="info flex ai-c" v-if="isLogin"> <view class="info flex ai-c" v-if="isLogin">
<u-avatar class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar> <u-avatar class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar>
<view class="ml12"> <view class="ml12">
<view class="flex ai-c fs18 cor-333 fwb"> <view class="flex ai-c fs18 cor-333 fwb">
<text class="mr10">{{ user.userName }}{{ user.userId }}</text> <text class="mr10">{{ user.userName }}{{ user.userId }}</text>
<image v-if="vipOn.length" src="/static/image/mine/vip.png" mode="widthFix" style="width: 18px;"></image> <image v-if="vipOn.length" src="../../static/image/mine/vip.png" mode="widthFix" style="width: 18px;"></image>
</view> </view>
<view class="mt5 fs14 cor-666">陪您学车 {{ user.days }}</view> <view class="mt5 fs14 cor-666">陪您学车 {{ user.days }}</view>
</view> </view>
@@ -25,7 +25,7 @@
</view> </view>
<view class="p15lr" style="transform: translateY(-90px);"> <view class="p15lr" style="transform: translateY(-90px);">
<view class="relative mb10" @tap="handleVip"> <view class="relative mb10" @tap="handleVip">
<image src="/static/image/mine/vip_bg.png" mode="widthFix" style="width: 100%;"></image> <image src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/vip%E8%83%8C%E6%99%AF%E9%BB%841_20230831010645.png" mode="widthFix" style="width: 100%;"></image>
<view class="absolute p15lr p10tb flex ai-c jc-sb" style="left: 0;top: 0;right: 0;height: 40px;"> <view class="absolute p15lr p10tb flex ai-c jc-sb" style="left: 0;top: 0;right: 0;height: 40px;">
<view class="flex ai-c"> <view class="flex ai-c">
<view class="p3 br-p50" style="background-color: #873E1D;"> <view class="p3 br-p50" style="background-color: #873E1D;">
@@ -40,7 +40,7 @@
<view v-if="!isLogin || !vipOn.length" class="text-center"> <view v-if="!isLogin || !vipOn.length" class="text-center">
<view class="fs18 fwb" style="color: #7E4012FF;">开通VIP尊享以下权益</view> <view class="fs18 fwb" style="color: #7E4012FF;">开通VIP尊享以下权益</view>
<view class="fs15" style="color: #7E4012FF;">精选500题 / 真是模考 / 考前密卷</view> <view class="fs15" style="color: #7E4012FF;">精选500题 / 真是模考 / 考前密卷</view>
<view class="study fs16 text-center" style="margin: 25px auto 0;color: #F6E99FFF;">立即开通</view> <view class="study fs16 text-center" style="margin: 25px auto 0;color: #F6E99FFF;">{{ isIOS ? 'iOS暂不可用' : '立即开通' }}</view>
</view> </view>
<view v-else-if="vipOn.length" class="text-center"> <view v-else-if="vipOn.length" class="text-center">
<view class="fs18 fwb" style="color: #7E4012FF;">{{ vipText }}</view> <view class="fs18 fwb" style="color: #7E4012FF;">{{ vipText }}</view>
@@ -81,11 +81,16 @@
<img src="/static/image/mine/wdtj.png" style="width: 24px;height: 24px;"> <img src="/static/image/mine/wdtj.png" style="width: 24px;height: 24px;">
</template> </template>
</u-cell> </u-cell>
<u-cell size="large" title="我的题库" value="小车"> <u-cell size="large" title="我的题库" :value="carName" @tap="toChangeCarType">
<template #icon> <template #icon>
<img src="/static/image/mine/wdtk.png" style="width: 24px;height: 24px;"> <img src="/static/image/mine/wdtk.png" style="width: 24px;height: 24px;">
</template> </template>
</u-cell> </u-cell>
<u-cell size="large" title="联系我们" @tap="callPhoneNumber">
<template #icon>
<img src="/static/image/mine/callme.png" style="width: 24px;height: 24px;">
</template>
</u-cell>
</u-cell-group> </u-cell-group>
</view> </view>
<view v-if="isLogin" class="flex ai-c jc-c mt12 br8 bc-fff" style="height: 50px;" @tap="handleLogout"> <view v-if="isLogin" class="flex ai-c jc-c mt12 br8 bc-fff" style="height: 50px;" @tap="handleLogout">
@@ -96,6 +101,7 @@
</template> </template>
<script> <script>
import useUserStore from '@/jtools/store/user' import useUserStore from '@/jtools/store/user'
import storage from '@/jtools/storage';
export default { export default {
components: {}, components: {},
computed: { computed: {
@@ -136,17 +142,35 @@ export default {
}, },
data() { data() {
return { return {
}; carName: storage.get('carName') || '小车C1/C2/C3',
isIOS: true
}
}, },
onShow() { onShow() {
this.isIOS = this.$platform.device().includes('ios')
this.carName = storage.get('carName') || '小车C1/C2/C3'
}, },
methods: { methods: {
// 拨打电话
callPhoneNumber() {
uni.makePhoneCall({
phoneNumber: '15105693067'
});
},
toChangeCarType() {
uni.navigateTo({
url: "/pages/me/changeCarType"
})
},
handleVip() { handleVip() {
if (this.isIOS) {
return
}
if (this.isLogin) { if (this.isLogin) {
// if (this.vipOn.length) { // if (this.vipOn.length) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/me/vip' url: '/pages/me/vip'
}) })
// } else { // } else {
// uni.navigateTo({ // uni.navigateTo({
// url: '/pages/index/videoVip' // url: '/pages/index/videoVip'
@@ -181,8 +205,12 @@ export default {
}, },
handleTJ() { handleTJ() {
if (this.isLogin) { if (this.isLogin) {
uni.navigateTo({ // uni.navigateTo({
url: '/pages/me/tijian' // url: '/pages/me/tijian'
// })
uni.showToast({
title: '敬请期待',
icon: 'none'
}) })
} else { } else {
this.toLogin() this.toLogin()

View File

@@ -1,29 +1,50 @@
<template> <template>
<view class="p15 bc-f5"> <view class="p15 bc-f5">
<view class="br8 bc-fff p15lr"> <view class="br8 bc-fff p15lr">
<view class="flex ai-c bb1" style="height: 110rpx;"> <view class="flex jc-sb ai-c bb1" style="height: 110rpx;">
<view class="title">联系电话</view> <view class="title">联系电话</view>
<view class="m30lr fs14 cor-333 fl1">15122305568</view> <view class="flex">
<u-icon name="arrow-right" color="#999" /> <view class="m30lr fs14 cor-333">15122305568</view>
<u-icon name="arrow-right" color="#999" />
</view>
</view> </view>
<view class="flex ai-c" style="height: 110rpx;"> <view class="flex jc-sb ai-c bb1" style="height: 110rpx;">
<view class="title">地址</view> <view class="title">地址</view>
<view class="m30lr fs14 cor-333 fl1">安徽省合肥市包河区</view> <view class="flex">
<u-icon name="arrow-right" color="#999" /> <view class="m30lr fs14 cor-333">安徽省合肥市包河区</view>
<u-icon name="arrow-right" color="#999" />
</view>
</view> </view>
<!-- <view class="flex jc-sb ai-c bb1" style="height: 110rpx;">
<view class="title">身份证号</view>
<view class="m30lr fs14 cor-333">{{sfzNum}}</view>
</view>
<view class="flex ai-c" style="height: 110rpx;" @tap="toUploadPic">
<view class="title">证件照</view>
<view class="m30lr fs14 cor-333 fl1"></view>
<u-icon name="arrow-right" color="#999" />
</view> -->
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import storage from '@/jtools/storage';
export default { export default {
data() { data() {
return { return {
sfzNum:storage.get('sfzNum') || ''
} }
}, },
onShow(){
this.sfzNum=storage.get('sfzNum') || ''
},
methods: { methods: {
toUploadPic(){
uni.navigateTo({
url: '/pages/me/uploadPic'
})
}
} }
} }
</script> </script>

View File

@@ -1,42 +1,214 @@
<template> <template>
<view class="p15 bc-f5"> <view class="">
<view class="br8 bc-fff p15lr"> <view class="wp100 bc-fff p14">
<view class="flex ai-c bb1" style="height: 110rpx;"> <view class="title fontColor">第一步 上传学员图像</view>
<view class="title">体检结果</view> <view class="mt15">
<view class="ml30 fs14 cor-333 fl1">通过</view> <!-- <u-upload width="165" height="165" :file-list=" fileList1" multiple :max-count="1" @afterRead="afterRead" @delete="deletePic" /> -->
</view> <!-- <u-upload ref="uUpload" class="mt25" :size-type="['compressed']" :file-list="fileList1" deletable :multiple="false" :max-count="1" width="165rpx" height="165rpx" @afterRead="afterRead" @delete="deletePic" /> -->
<view class="flex ai-c" style="height: 110rpx;"> <view style="width: 320rpx;height:300rpx;background-color: rgb(247, 255, 255);border-radius: 20rpx;">
<view class="title">体检时间</view> <view style="width: 320rpx;height:240rpx;" class="flex jc-c ai-c">
<view class="ml30 fs14 cor-333 fl1">2023-08-10 14:35:23</view> <image v-if="fileList&&fileList.length" style="width: 240rpx;height: 240rpx;" :src="fileList[0].url">
</view> </image>
<view class="flex ai-fs" style="height: 110rpx;"> <u-avatar v-else class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar>
<view class="title">体检时间</view> </view>
<image class="ml30" src="/static/image/mine/tijian.png" style="width: 333rpx;" mode="widthFix"></image> <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" multiple :maxCount="1" width="150"
</view> height="150">
</view> <view
</view> style="width: 320rpx;height:60rpx;line-height:60rpx;background-color: #05C341;border-radius: 0 0 20rpx 20rpx;"
class="text-center cor-fff">
点击
</view>
</u-upload>
</view>
</view>
<view class="mt20">
<view class="title fontColor">第二步 核实后再提交</view>
<u--form labelPosition="left" labelWidth="80" :model="form" :rules="rules" ref="form1">
<u-form-item label="姓名" :required="true" prop="idCardName" borderBottom ref="item1">
<u--input v-model="form.idCardName" border="none"></u--input>
</u-form-item>
<u-form-item label="身份证号" :required="true" prop="sfzmhm" borderBottom ref="item2">
<u--input v-model="form.sfzmhm" border="none"></u--input>
</u-form-item>
</u--form>
</view>
<view style="margin-top: 20px;">
<u-button type="primary" :style="{width: '100%',borderRadius:'40rpx',backgroundColor:'#05C341'}" :disabled="saving" text="提交"
@click="submit" />
</view>
</view>
</view>
</template> </template>
<script> <script>
export default { import storage from '@/jtools/storage';
data() { import {
return { addInfo,
} from '@/jtools/api/index';
} export default {
}, data() {
methods: { const shenfenzhen = (rule, value, callback) => {
/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/.test(value) ? callback() : callback(
} new Error('请输入正确的身份证号'))
} }
return {
form: {
idCardName: '',
sfzmhm: ''
},
driverLicenseImg:'',
fileList:[],
fileList1: [],
uploadList: [],
saving: false,
rules: {
idCardName: [{
required: true,
message: '请输入姓名',
trigger: ['blur', 'change']
}],
sfzmhm: [{
required: true,
message: '请输入身份证号',
trigger: ['blur', 'change']
},{
// 自定义验证函数,见上说明
validator: shenfenzhen,
message: '身份证号码不正确',
// 触发器可以同时用blur和change
trigger: ['change', 'blur'],
}]
}
};
},
onReady() {
this.$refs.form1.setRules(this.rules);
},
methods: {
// 删除图片
deletePic(event) {
this.fileList1.splice(event.index, 1);
this.uploadList.splice(event.index, 1);
},
// 新增图片
async afterRead(event) {
let imageInfoObj = await uni.getImageInfo({src: event.file[0].url})
console.log(imageInfoObj);
if(imageInfoObj.width!=720&&imageInfoObj.height!=720){
uni.showToast({
icon:'error',
title:'证件照尺寸有误'
})
this.fileList=[]
return false
}
this.driverLicenseImg = this.urlTobase64(event.file[0].url)
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
const lists = [].concat(event.file);
this.fileList=lists
this.fileList1 = [];
uni.showToast({
title:'上传成功!'
})
},
uploadFilePromise(url) {
this.saving = true;
return new Promise((resolve, reject) => {
uni.uploadFile({
url: process.env.VUE_APP_BASE_API + 'mongodb/uploadFile', // 仅为示例,非真实的接口地址
filePath: url,
name: 'file',
success: (res) => {
// setTimeout(() => {
resolve(JSON.parse(res.data).data);
// }, 100);
this.saving = false;
},
fail: () => {
resolve(null);
this.saving = false;
}
});
});
},
// 提交
submit() {
this.$refs.form1.validate().then((valid) => {
if (valid) {
const param={
driverLicenseImg:this.driverLicenseImg,
...this.form,
schoolOrgCode:'340103000700',
operater:'1d08daf852cf4ee28f67cb583f538cbf'
}
addInfo(param).then(resp=>{
uni.showToast({
title:"提交成功!",
duration:2000,
})
setTimeout(()=>{
uni.navigateBack()
},1000)
})
} else {
console.log('验证失败');
}
});
},
urlTobase64(url){
let base64=''
console.log(url);
return new Promise((resolve, reject) => {
uni.getFileSystemManager().readFile({
filePath: url, //选择图片返回的相对路径
encoding: 'base64', //编码格式
success: res => { //成功的回调
console.log(res);
base64 = 'data:image/jpeg;base64,' + res.data //不加上这串字符,在页面无法显示的哦
resolve(base64);
},fail: (e) => {
console.log("图片转换失败");
reject(e)
}
})
});
}
}
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.title { .upload-img {
width: 120rpx; width: 165rpx;
font-size: 14px; height: 165rpx;
color: #666; border: 1px dashed #c4c4c4;
} display: flex;
.bb1 { justify-content: center;
border-bottom: 1px solid #eee; align-items: center;
} }
</style>
.fontColor {
color: #383838;
font-weight: 400;
}
::v-deep .u-textarea__count {
background-color: #f9faf9 !important;
}
::v-deep .u-upload__button>.u-icon>.u-icon__icon {
font-size: 90rpx !important;
}
::v-deep .u-button--square {
border-radius: 40rpx !important;
}
::v-deep .u-button--primary{
background-color: #05C341 !important;
border-color: #05C341 !important;
}
</style>

226
src/pages/me/uploadPic.vue Normal file
View File

@@ -0,0 +1,226 @@
<template>
<view class="">
<view class="wp100 bc-fff p14">
<view class="title fontColor">第一步 上传学员图像</view>
<view class="mt15">
<!-- <u-upload width="165" height="165" :file-list=" fileList1" multiple :max-count="1" @afterRead="afterRead" @delete="deletePic" /> -->
<!-- <u-upload ref="uUpload" class="mt25" :size-type="['compressed']" :file-list="fileList1" deletable :multiple="false" :max-count="1" width="165rpx" height="165rpx" @afterRead="afterRead" @delete="deletePic" /> -->
<view style="width: 320rpx;height:300rpx;background-color: rgb(247, 255, 255);border-radius: 20rpx;">
<view style="width: 320rpx;height:240rpx;" class="flex jc-c ai-c">
<image v-if="fileList&&fileList.length" style="width: 240rpx;height: 240rpx;" :src="fileList[0].url">
</image>
<u-avatar v-else class="br-p50 overflow-h" :size="64" mp-avatar shape="circle"></u-avatar>
</view>
<u-upload :fileList="fileList1" :maxSize="500 * 1024" @oversize="oversize" @afterRead="afterRead"
@delete="deletePic" multiple :maxCount="1" width="150" height="150">
<view
style="width: 320rpx;height:60rpx;line-height:60rpx;background-color: #05C341;border-radius: 0 0 20rpx 20rpx;"
class="text-center cor-fff">
点击
</view>
</u-upload>
</view>
</view>
<view class="mt20">
<view class="title fontColor">第二步 核实后再提交</view>
<u--form labelPosition="left" labelWidth="80" :model="form" :rules="rules" ref="form1">
<u-form-item label="姓名" :required="true" prop="idCardName" borderBottom ref="item1">
<u--input v-model="form.idCardName" border="none"></u--input>
</u-form-item>
<u-form-item label="身份证号" :required="true" prop="sfzmhm" borderBottom ref="item2">
<u--input v-model="form.sfzmhm" border="none"></u--input>
</u-form-item>
</u--form>
</view>
<view style="margin-top: 20px;">
<u-button type="primary" :style="{width: '100%',borderRadius:'40rpx',backgroundColor:'#05C341'}"
:disabled="saving" text="提交" @click="submit" />
</view>
</view>
</view>
</template>
<script>
import storage from '@/jtools/storage';
import {
addInfo,
} from '@/jtools/api/index';
export default {
data() {
const shenfenzhen = (rule, value, callback) => {
/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/.test(value) ? callback() : callback(
new Error('请输入正确的身份证号'))
}
return {
form: {
idCardName: '',
sfzmhm: storage.get('sfzNum') || ''
},
driverLicenseImg: '',
fileList: [],
fileList1: [],
uploadList: [],
saving: false,
rules: {
idCardName: [{
required: true,
message: '请输入姓名',
trigger: ['blur', 'change']
}],
sfzmhm: [{
required: true,
message: '请输入身份证号',
trigger: ['blur', 'change']
}, {
// 自定义验证函数,见上说明
validator: shenfenzhen,
message: '身份证号码不正确',
// 触发器可以同时用blur和change
trigger: ['change', 'blur'],
}]
}
};
},
onReady() {
this.$refs.form1.setRules(this.rules);
},
methods: {
// 文件超出大小限制
oversize() {
uni.showToast({
title: "图片最大不能超过500k",
icon: 'none'
})
},
// 删除图片
deletePic(event) {
this.fileList1.splice(event.index, 1);
this.uploadList.splice(event.index, 1);
},
// 新增图片
async afterRead(event) {
let imageInfoObj = await uni.getImageInfo({
src: event.file[0].url
})
console.log(imageInfoObj);
if (imageInfoObj.width != 260 && imageInfoObj.height != 378) {
uni.showToast({
icon: 'error',
title: '证件照尺寸有误'
})
this.fileList = []
return false
}
this.driverLicenseImg = await this.urlTobase64(event.file[0].url)
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
const lists = [].concat(event.file);
this.fileList = lists
this.fileList1 = [];
uni.showToast({
title: '上传成功!'
})
},
// 提交
submit() {
this.$refs.form1.validate().then((valid) => {
if (valid) {
const param = {
driverLicenseImg: this.driverLicenseImg,
...this.form,
schoolOrgCode: '340103000700',
operater: '1d08daf852cf4ee28f67cb583f538cbf'
}
storage.set('sfzNum', this.form.sfzmhm)
uni.request({
url: 'https://www.hfcgs.cn:20223/driver/addInfo',
method: 'POST',
data: param,
success: res => {
console.log(res);
uni.showToast({
title: "提交成功!",
duration: 2000,
})
setTimeout(() => {
uni.navigateBack()
}, 1000)
},
fail: () => {},
});
// addInfo(param).then(resp=>{
// if(resp.code==='0000'){
// uni.showToast({
// title:"提交成功!",
// duration:2000,
// })
// setTimeout(()=>{
// uni.navigateBack()
// },1000)
// }
// })
} else {
console.log('验证失败');
}
});
},
urlTobase64(url) {
let base64 = ''
console.log(url);
return new Promise((resolve, reject) => {
uni.getFileSystemManager().readFile({
filePath: url, //选择图片返回的相对路径
encoding: 'base64', //编码格式
success: res => { //成功的回调
console.log(res);
base64 = 'data:image/jpeg;base64,' + res.data //不加上这串字符,在页面无法显示的哦
resolve(base64);
},
fail: (e) => {
console.log("图片转换失败");
reject(e)
}
})
});
}
}
};
</script>
<style lang="scss" scoped>
.upload-img {
width: 165rpx;
height: 165rpx;
border: 1px dashed #c4c4c4;
display: flex;
justify-content: center;
align-items: center;
}
.fontColor {
color: #383838;
font-weight: 400;
}
::v-deep .u-textarea__count {
background-color: #f9faf9 !important;
}
::v-deep .u-upload__button>.u-icon>.u-icon__icon {
font-size: 90rpx !important;
}
::v-deep .u-button--square {
border-radius: 40rpx !important;
}
::v-deep .u-button--primary {
background-color: #05C341 !important;
border-color: #05C341 !important;
}
</style>

View File

@@ -1,312 +1,398 @@
<template> <template>
<view class="flex fld-c p15"> <view>
<u-sticky> <u-loading-page :loading="getLoading" loading-text="题库更新中..."></u-loading-page>
<view class="flex ai-c"> <view class="flex fld-c p15" v-if="!getLoading">
<view v-for="(item, index) in vipAllList" :key="index" class="km-item" :class="{ actived: index == current }" <u-sticky>
@click="current = index"> <view class="flex ai-c">
{{ getKmTitle(item.subjects) }} <view v-for="(item, index) in vipAllList" :key="index" class="km-item" :class="{ actived: index == current }"
</view> @click="current = index">
</view> {{ getKmTitle(item.subjects) }}
</u-sticky> </view>
<view class="mt15"> </view>
<swiper class="swiper" :current="current" style="height: 120px;" :autoplay="false" :display-multiple-items="1.45" </u-sticky>
:disable-programmatic-animation="true" @change="onChange"> <view class="mt15">
<swiper-item v-for="(item, index) in vipAllList" :key="index"> <swiper class="swiper" :current="current" style="height: 120px;" :autoplay="false"
<view class="relative"> :display-multiple-items="1.45" :disable-programmatic-animation="true" @change="onChange">
<image src="../../static/image/mine/vip_card.png" mode="widthFix" style="width:95%;"></image> <swiper-item v-for="(item, index) in vipAllList" :key="index">
<view class="vip-info"> <view class="relative"
<u-avatar class="br-p50 overflow-h" style="border: 3px solid #873E1D;" :size="35" mp-avatar></u-avatar> style="background-image: url(https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/vip%E8%83%8C%E6%99%AF_20230831010348.png);width: 95%;height: 204rpx;background-size: 100% 100%;">
<view class="ml10"> <!-- <image src="" mode="widthFix" style="width:95%;"></image> -->
<view class="fs16 fwb" style="color: #7E4012;line-height: 16px;"> <view class="vip-info">
{{ item.memberName }} <u-avatar class="br-p50 overflow-h" style="border: 3px solid #873E1D;" :size="35" mp-avatar></u-avatar>
</view> <view class="ml10">
<view class="mt5 fs12" style="color: #7E4012;line-height: 12px;"> <view class="fs16 fwb" style="color: #7E4012;line-height: 16px;">
{{ getExpireText(item) }} {{ item.memberName }}
</view> </view>
</view> <view class="mt5 fs12" style="color: #7E4012;line-height: 12px;">
</view> {{ getExpireText(item) }}
<view v-if="vipHasOpened(item)" class="corner"> </view>
VIP已开通 </view>
</view> </view>
<view v-if="vipHasOpened(item)" class="renew"> <view v-if="vipHasOpened(item)" class="corner">
{{ item.price }}元立即续费 VIP已开通
</view> </view>
<view v-else class="buy"> <view v-if="vipHasOpened(item)" @tap="chargeVip(item)" class="renew">
立即充值 {{ item.price }}元立即续费
</view> </view>
</view> <view v-else class="buy" @tap="chargeVip(item)">
</swiper-item> 立即充值
<swiper-item> </view>
</swiper-item> </view>
</swiper> </swiper-item>
</view> <swiper-item>
<view class="mt20"> </swiper-item>
<swiper class="swiper" :current="current" style="height: 300px;" :autoplay="false" </swiper>
:disable-programmatic-animation="true" @change="onChange"> </view>
<swiper-item v-for="(item, index) in vipAllList" :key="index"> <view class="mt20">
<view v-if="index == 0 || index == 3" class="p15 br8 cor-fff"> <swiper class="swiper" :current="current" style="height: 300px;" :autoplay="false"
<view class="fs18 cor-000 fwb"> :disable-programmatic-animation="true" @change="onChange">
3步轻松学{{ getKmTitle(item.subjects) }} <swiper-item v-for="(item, index) in vipAllList" :key="index">
</view> <view v-if="index == 0 || index == 3" class="p15 br8 cor-fff bc-fff">
<view class="mt25 flex ai-c jc-sb"> <view class="fs18 cor-000 fwb">
<view class="flex ai-c"> 3步轻松学{{ getKmTitle(item.subjects) }}
<image src="../../static/image/mine/1.png" mode="widthFix" style="width:25px;"></image> </view>
<view class="ml7"> <view class="mt25 flex ai-c jc-sb">
<view class="fs16 cor-000 fwb" style="line-height: 16px;"> <view class="flex ai-c">
精简500题 <image src="../../static/image/mine/1.png" mode="widthFix" style="width:25px;"></image>
</view> <view class="ml7">
<view class="mt7 fs12 cor-666" style="line-height: 12px;"> <view class="fs16 cor-000 fwb" style="line-height: 16px;">
题目全部做对视为完成 精简500题
</view> </view>
</view> <view class="mt7 fs12 cor-666" style="line-height: 12px;">
</view> 题目全部做对视为完成
<view class="study" @tap="to500(item)"> </view>
去学习 </view>
</view> </view>
</view> <view class="study" @tap="to500(item)">
<view class="mt45 flex ai-c jc-sb"> 去学习
<view class="flex ai-c"> </view>
<image src="../../static/image/mine/2.png" mode="widthFix" style="width:25px;"></image> </view>
<view class="ml7"> <view class="mt45 flex ai-c jc-sb">
<view class="fs16 cor-000 fwb" style="line-height: 16px;"> <view class="flex ai-c">
真实考场模拟 <image src="../../static/image/mine/2.png" mode="widthFix" style="width:25px;"></image>
</view> <view class="ml7">
<view class="mt7 fs12 cor-666" style="line-height: 12px;"> <view class="fs16 cor-000 fwb" style="line-height: 16px;">
10次95分以上视为完成 真实考场模拟
</view> </view>
</view> <view class="mt7 fs12 cor-666" style="line-height: 12px;">
</view> 10次95分以上视为完成
<view class="study" @tap="toRealExam(item)"> </view>
去学习 </view>
</view> </view>
</view> <view class="study" @tap="toRealExam(item)">
<view class="mt45 flex ai-c jc-sb"> 去学习
<view class="flex ai-c"> </view>
<image src="../../static/image/mine/3.png" mode="widthFix" style="width:25px;"></image> </view>
<view class="ml7"> <view class="mt45 flex ai-c jc-sb">
<view class="fs16 cor-000 fwb" style="line-height: 16px;"> <view class="flex ai-c">
考前密卷 <image src="../../static/image/mine/3.png" mode="widthFix" style="width:25px;"></image>
</view> <view class="ml7">
<view class="mt7 fs12 cor-666" style="line-height: 12px;"> <view class="fs16 cor-000 fwb" style="line-height: 16px;">
2套试卷95分以上视为完成 考前密卷
</view> </view>
</view> <view class="mt7 fs12 cor-666" style="line-height: 12px;">
</view> 2套试卷95分以上视为完成
<view class="study" @tap="toSpecExam(item)"> </view>
去学习 </view>
</view> </view>
</view> <view class="study" @tap="toSpecExam(item)">
</view> 去学习
<view v-else style="margin-top: 30rpx;"> </view>
<view class="video-box"> </view>
<view class="flex jc-sb ai-c wp100"> </view>
<text style="color: #873E1D;font-size: 36rpx;">考场实况</text> <view v-else style="margin-top: 30rpx;">
<text class="cor-666 fs12">全部 ></text> <view class="video-box">
</view> <view class="flex jc-sb ai-c wp100">
<view class="flex ai-c mt20"> <text style="color: #873E1D;font-size: 36rpx;">考场实况</text>
<image src="../../static/image/index/index_bg.png" mode="widthFix" style="flex: 1;border-radius: 33rpx;"></image> <text class="cor-666 fs12">全部 ></text>
<view class="ml18 text-center"> </view>
<u-button :customStyle="{ width: '200rpx', height: '66rpx', borderRadius: '33rpx' }" iconColor="#fff" <view class="flex ai-c mt20">
text="去看视频" color="linear-gradient(90deg, #E66501 0%, #F8A42C 100%)" icon="play-circle" @click="toPlaceLive(item)"> <view class="contain-box relative">
</u-button> <image class="contain-box" src="../../../static/image/index/jpsp.png"></image>
<view class="cor-333 fs15 mt17">真实考场模拟</view> <image class="play_btn_2" src="../../static/image/index/play.png" />
</view> </view>
</view> <view class="ml15 text-center">
</view> <u-button :customStyle="{width:'200rpx',height:'66rpx',borderRadius: '33rpx'}" iconColor="#fff"
</view> text="去看视频" color="linear-gradient(90deg, #E66501 0%, #F8A42C 100%)" icon="play-circle"
</swiper-item> @click="toPlaceLive(item)">
</swiper> </u-button>
</view> <view class="cor-333 fs15 fw600 mt10">真实考场模拟</view>
</view> </view>
</view>
</view>
</view>
</swiper-item>
</swiper>
</view>
</view>
</view>
</template> </template>
<script> <script>
import useUserStore from '@/jtools/store/user' import {
export default { mapState,
computed: { mapActions
vipAllList() { } from 'pinia' //引入映射函数
return useUserStore().vipAllList.filter(it => [1, 2, 3, 4].includes(Number(it.subjects))) import useQuestionStore from '@/jtools/store/question' //引入store
}, import useUserStore from '@/jtools/store/user'
vipOnList() { import {
return useUserStore().vipOnList queryQuestionId,
}, getTestQuestionId
} from '@/jtools/api/question';
import storage from '@/jtools/storage';
export default {
computed: {
...mapState(useQuestionStore, ["loading_subject4", "loading_subject1", "version"]), //映射函数取出tagslist
getLoading() {
return this.loading_subject4 && this.loading_subject1
},
vipAllList() {
return useUserStore().vipAllList.filter(it => [1, 2, 3, 4].includes(Number(it.subjects)))
},
vipOnList() {
return useUserStore().vipOnList
},
}, },
data() { data() {
return { return {
current: 0 current: 0
} }
}, },
methods: { methods: {
onChange(e) { ...mapActions(useQuestionStore, ['getOrderQuestion_sub1', 'getOrderQuestion_sub4', 'getAllQuestion']),
this.current = e.detail.current chargeVip(item) {
}, uni.navigateTo({
getKmTitle(km) { url: "/pages/index/videoVip?subject=" + item.subjects
return { })
'1': '科一', },
'2': '科二', onChange(e) {
'3': '科三', this.current = e.detail.current
'4': '科四', },
}[km] getKmTitle(km) {
}, return {
getExpireText(item) { '1': '科一',
const vipOn = this.vipOnList.find(it => it.memberId == item.memberId) '2': '科二',
if (vipOn) { '3': '科三',
return `${vipOn.endDate.split(' ')[0]}到期` '4': '科四',
} else { } [km]
return '开通vip助您快速拿证' },
} getExpireText(item) {
}, const vipOn = this.vipOnList.find(it => it.memberId == item.memberId)
vipHasOpened(item) { if (vipOn) {
return !!this.vipOnList.find(it => it.memberId == item.memberId) return `${vipOn.endDate.split(' ')[0]}到期`
}, } else {
// 去精选500题 item=> 当前科目vip信息 return '开通vip助您快速拿证'
to500(item) { }
// 当前vip是否已开通 },
if (this.vipHasOpened(item)) { vipHasOpened(item) {
// 跳转 ;
} else { return !!this.vipOnList.some(it => it.subjects.includes(item.subjects))
uni.showToast({ },
title: `请先充值${this.getKmTitle(item.subjects)}vip`, // 去精选500题 item=> 当前科目vip信息
icon: 'none' to500(item) {
}) // 当前vip是否已开通
} if (this.vipHasOpened(item)) {
}, // 跳转
// 去真实考场 item=> 当前科目vip信息 queryQuestionId({
toRealExam(item) { versionId: this.version,
// 当前vip是否已开通 carTypeId: storage.get('carType') || '1001',
if (this.vipHasOpened(item)) { subject: item.subjects,
// 跳转 isVip: '1'
} else { }).then(async (resp) => {
uni.showToast({ if (resp.code === '0000') {
title: `请先充值${this.getKmTitle(item.subjects)}vip`, const arr = resp.data
icon: 'none' if (arr && arr.length) {
}) const listJson = JSON.stringify(arr)
} uni.navigateTo({
}, url: "/pages/questionBank/questionBank?navTitle=精简500题&subject=" + item.subjects +
// 去秘卷 item=> 当前科目vip信息 "&questionIdList=" + listJson
toSpecExam(item) { })
// 当前vip是否已开通 } else {
if (this.vipHasOpened(item)) { uni.showToast({
// 跳转 title: '暂无题目',
} else { icon: 'none'
uni.showToast({ })
title: `请先充值${this.getKmTitle(item.subjects)}vip`, }
icon: 'none' } else if (resp.code === '4001') {
}) uni.showToast({
} title: '当前题库非最新版,请更新~',
}, icon: 'none'
// 去考场实况 item=> 当前科目vip信息 })
toPlaceLive(item) { this.getAllQuestion()
// 当前vip是否已开通 }
if (this.vipHasOpened(item)) { })
// 跳转 } else {
} else { uni.showToast({
uni.showToast({ title: `请先充值${this.getKmTitle(item.subjects)}vip`,
title: `请先充值${this.getKmTitle(item.subjects)}vip`, icon: 'none'
icon: 'none' })
}) }
} },
} // 去真实考场 item=> 当前科目vip信息
} toRealExam(item) {
} // 当前vip是否已开通
if (this.vipHasOpened(item)) {
// 跳转
uni.navigateTo({
url: "/pages/index/trueTest?subject=" + item.subjects
})
} else {
uni.showToast({
title: `请先充值${this.getKmTitle(item.subjects)}vip`,
icon: 'none'
})
}
},
// 去秘卷 item=> 当前科目vip信息
toSpecExam(item) {
// 当前vip是否已开通
if (this.vipHasOpened(item)) {
// 跳转
uni.navigateTo({
url: "/pages/index/secretPapers?subject=" + item.subjects
})
} else {
uni.showToast({
title: `请先充值${this.getKmTitle(item.subjects)}vip`,
icon: 'none'
})
}
},
// 去考场实况 item=> 当前科目vip信息
toPlaceLive(item) {
// 当前vip是否已开通
if (this.vipHasOpened(item)) {
// 跳转
uni.showToast({
title: '敬请期待',
icon: 'none'
})
} else {
uni.showToast({
title: `请先充值${this.getKmTitle(item.subjects)}vip`,
icon: 'none'
})
}
}
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.km-item { .km-item {
margin-right: 8px; margin-right: 8px;
width: 72px; width: 72px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
font-size: 12px; font-size: 12px;
color: #333; color: #333;
text-align: center; text-align: center;
border-radius: 15px; border-radius: 15px;
border: 1px solid #CCCCCC; border: 1px solid #CCCCCC;
} }
.actived { .actived {
background: linear-gradient(90deg, #E66501 0%, #F8A42C 100%); background: linear-gradient(90deg, #E66501 0%, #F8A42C 100%);
color: #fff; color: #fff;
} }
.km-item:last-of-type { .km-item:last-of-type {
margin-right: 0; margin-right: 0;
} }
.vip-info { .vip-info {
position: absolute; position: absolute;
top: 15px; top: 15px;
left: 10px; left: 10px;
display: flex; display: flex;
align-items: center; align-items: center;
} z-index: 1;
}
.corner { .corner {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
width: 77px; width: 77px;
height: 23px; height: 23px;
background: linear-gradient(0deg, #E66501 0%, #F8A42C 100%); background: linear-gradient(0deg, #E66501 0%, #F8A42C 100%);
opacity: 0.86; opacity: 0.86;
border-radius: 0px 8px 0px 8px; border-radius: 0px 8px 0px 8px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 12px; font-size: 12px;
color: #fff; color: #fff;
} z-index: 1;
}
.renew { .renew {
position: absolute; position: absolute;
right: 10%; right: 10%;
bottom: 15px; bottom: 15px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 185rpx; width: 185rpx;
height: 52rpx; height: 52rpx;
background: #873E1D; background: #873E1D;
border-radius: 26rpx; border-radius: 26rpx;
font-size: 12px; font-size: 12px;
color: #F6E99F; color: #F6E99F;
} z-index: 1;
}
.buy { .buy {
position: absolute; position: absolute;
left: 45%; left: 45%;
transform: translateX(-50%); transform: translateX(-50%);
bottom: 15px; bottom: 15px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 200rpx; width: 200rpx;
height: 60rpx; height: 60rpx;
background: #873E1D; background: #873E1D;
border-radius: 30rpx; border-radius: 30rpx;
font-size: 14px; font-size: 14px;
color: #F6E99F; color: #F6E99F;
} z-index: 1;
}
.study { .study {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 161rpx; width: 161rpx;
height: 67rpx; height: 67rpx;
background: #F6E99F; background: #F6E99F;
border-radius: 34rpx; border-radius: 34rpx;
font-size: 12px; font-size: 12px;
color: #873E1D; color: #873E1D;
} }
.video-box { .video-box {
padding: 20rpx; padding: 20rpx;
width: 694rpx; width: 694rpx;
height: 369rpx; height: 369rpx;
background: #F9F3E7; background: #F9F3E7;
border: 2rpx solid #CF8B6D; border: 2rpx solid #CF8B6D;
border-radius: 16rpx; border-radius: 16rpx;
} }
.contain-box {
width: 406rpx;
height: 228rpx;
background: #00B74F;
border-radius: 16rpx;
}
.play_btn_2 {
width: 65rpx;
height: 65rpx;
position: absolute;
left: 165.5rpx;
top: 78rpx
}
</style> </style>

View File

@@ -1,18 +1,22 @@
<template> <template>
<view> <view>
<j-navbar>基本操作</j-navbar> <j-navbar>基本操作</j-navbar>
<u-sticky bgColor="#fff"> <!-- <u-sticky bgColor="#fff">
<u-tabs :list="categoryList" :scrollable="false" @click="changeCategory"></u-tabs> <u-tabs :list="categoryList" :scrollable="false" @click="changeCategory"></u-tabs>
</u-sticky> </u-sticky> -->
<view class="p14"> <view class="p14">
<!-- <view class="flex ai-c"> <!-- <view class="flex ai-c">
<view class="car_item mr10" v-for="(item,index) of carTypeList" :key="index" @tap="chooseCar(item.value)" :class="item.value===tCar?'checked_car':'unchecked_car'">{{item.label}}</view> <view class="car_item mr10" v-for="(item,index) of carTypeList" :key="index" @tap="chooseCar(item.value)" :class="item.value===tCar?'checked_car':'unchecked_car'">{{item.label}}</view>
</view> --> </view> -->
<view class="flex p14 bc-fff mt10" style="border-radius: 16rpx;" v-for="(item,index) of videoList" :key="index" @tap="toDetail"> <view class="flex p14lr p20tb bc-fff mb10" style="border-radius: 10rpx;"
<image class="pic" src="../../static/image/index/index_bg.png"></image> v-for="(item,index) of videoList" :key="index" @tap="toOperateDetail(item.videoId)">
<view class="pic relative hide" style="overflow: hidden;">
<image class="pic" style="position: absolute;left: 0;top:0" mode="widthFix" :src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
<image class="play_btn_2" src="../../static/image/index/play.png" />
</view>
<view class="ml10"> <view class="ml10">
<text class="fs16 cor-000 fw600">上车下车的方法</text> <text class="fs16 cor-000 fw600">{{allVideoList[0]?.description}}</text>
<view class="fs14 mt5 cor-666">上车下车的方法</view> <view class="fs14 mt5 cor-666">{{item.description}}</view>
</view> </view>
</view> </view>
</view> </view>
@@ -20,42 +24,92 @@
</template> </template>
<script> <script>
import {
querySysConfigList,
queryProjectList
} from '@/jtools/api/question';
import storage from '@/jtools/storage';
export default { export default {
data(){ data(){
return{ return{
type:'2',
subject:'1',
tCar:0, tCar:0,
categoryList:[{ categoryList:[{
name:'手动挡C1' name:'手动挡C1'
},{ },{
name:'自动挡C2' name:'自动挡C2'
}], }],
carTypeList:[{ allVideoList:[],
label:'捷达', videoList:[]
value:0
},{
label:'新桑塔纳',
value:1
},{
label:'爱丽舍',
value:2
}],
videoList:[{
label:"111"
},{
label:'222'
},{
label:'333'
},{
label:'444'
}]
} }
}, },
onLoad(op){
if(op.subject){
this.subject=op.subject
}
if(op.type){
this.type=op.type
}
this.getDiverType()
},
methods:{ methods:{
formateTime(time) {
const h = parseInt(time / 3600)
const minute = parseInt(time / 60 % 60)
const second = Math.ceil(time % 60)
const hours = h < 10 ? '0' + h : h
const formatSecond = second > 59 ? 59 : second
return `${hours > 0 ? `${hours}:` : ''}${minute < 10 ? '0' + minute : minute}:${formatSecond < 10 ? '0' + formatSecond : formatSecond}`
},
toOperateDetail(val){
let arr = JSON.parse(JSON.stringify(this.allVideoList[0].videoList))
arr = arr.map(item => {
return {
...item,
subDesc:this.allVideoList[0].description,
projectId:item.videoId,
videoTime:this.formateTime(item.videoTime)
}
})
let jsonString = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/videoDetail?videoList=" + jsonString + "&subject=" + this.subject +
"&projectId=" + val + "&type=2"
})
},
getOperateList() {
queryProjectList({
"carTypeId": storage.get('carType') || '1001',
"subject": String(this.subject),
"type": this.type
}).then(resp => {
if(resp.code==='0000'){
this.videoList=resp.data[0]?resp.data[0].videoList:[]
this.allVideoList=resp.data
}
})
},
getDiverType() {
const carTypeId = storage.get('carType') || '1001'
querySysConfigList(carTypeId, 'DriveType').then(resp => {
if (resp.code === '0000') {
this.categoryList=resp.data.map(item=>{
return {
...item,
name:item.configItemName
}
})
this.getOperateList()
}
})
},
chooseCar(val){ chooseCar(val){
this.tCar=val this.tCar=val
}, },
changeCategory(val){ changeCategory(val){
this.tCar=val.index
this.getOperateList()
}, },
toDetail(){ toDetail(){
uni.navigateTo({ uni.navigateTo({
@@ -91,6 +145,19 @@
width: 300rpx; width: 300rpx;
height: 169rpx; height: 169rpx;
background: #00B74F; background: #00B74F;
border-radius: 8rpx; border-radius: 10rpx;
}
.play_btn_2 {
width: 65rpx;
height: 65rpx;
position: absolute;
left: 117.5rpx;
top: 52rpx
}
.hide {
backface-visibility: hidden;
transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
} }
</style> </style>

View File

@@ -1,28 +1,78 @@
<template> <template>
<view> <view>
<view class="chapter_item p14" v-for="(item,index) of chapterList" :key="index" @tap="toQuestion(item.configItemCode)"> <u-loading-page :loading="getLoading" loading-text="题库更新中..."></u-loading-page>
{{item.configItemName}} <view v-if="!getLoading">
<view class="chapter_item p14" v-for="(item,index) of chapterList" :key="index" @tap="toQuestion(item.configItemCode)">
{{item.configItemName}}
</view>
</view> </view>
</view> </view>
</template> </template>
<script> <script>
import { import {
querySysConfigList querySysConfigList,
queryQuestionId
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
export default { export default {
data() { data() {
return { return {
chapterList:[] chapterList:[],
subject:'1'
} }
}, },
onLoad(){ onLoad(op){
if(op.subject){
this.subject=op.subject
}
this.getChapterList() this.getChapterList()
}, },
computed: {
...mapState(useQuestionStore, ["loading_subject4", "loading_subject1", "version"]), //映射函数取出tagslist
getLoading() {
return this.loading_subject4 && this.loading_subject1
}
},
methods:{ methods:{
...mapActions(useQuestionStore, ['getAllQuestion']),
getQuestion(param,title) {
queryQuestionId({
versionId: this.version,
carTypeId: storage.get('carType') || '1001',
subject: this.subject,
...param,
}).then(async (resp) => {
if (resp.code === '0000') {
if(resp.data&&resp.data.length){
const arr = resp.data
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + title + "&subject=" + this.subject + "&questionIdList=" + listJson
})
}else{
uni.showToast({
title: '暂无题目',
icon: 'none'
})
}
}else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
})
},
getChapterList(){ getChapterList(){
const carTypeId=storage.get('carType') || '1001' const carTypeId=storage.get('carType') || '1001'
const key=this.subject=='1'?'ChapterOfSubjectOne':'ChapterOfSubjectFour'
querySysConfigList(carTypeId,'ChapterOfSubjectOne').then(resp=>{ querySysConfigList(carTypeId,'ChapterOfSubjectOne').then(resp=>{
if(resp.code==='0000'){ if(resp.code==='0000'){
this.chapterList=resp.data this.chapterList=resp.data
@@ -30,9 +80,7 @@
}) })
}, },
toQuestion(code){ toQuestion(code){
uni.navigateTo({ this.getQuestion({chapter:code},'章节技巧')
url:"/pages/questionBank/questionBank?navTitle=章节技巧&chapter="+code
})
} }
} }
} }

File diff suppressed because it is too large Load Diff

View File

@@ -15,7 +15,7 @@
<text>未做题</text> <text>未做题</text>
</view> </view>
<view class="text-center wp33" @tap="toQuestionBank"> <view class="text-center wp33" @tap="toQuestionBank">
<view>{{wrongList.length}}</view> <view>{{wrongList?.length}}</view>
<text>看错题</text> <text>看错题</text>
</view> </view>
<view class="text-center wp33 flex jc-c ai-c" style="flex-direction: column;" @tap="toExams"> <view class="text-center wp33 flex jc-c ai-c" style="flex-direction: column;" @tap="toExams">
@@ -108,6 +108,7 @@
this.doNotNum=op.doNotNum this.doNotNum=op.doNotNum
} }
if(op.wrongList){ if(op.wrongList){
console.log(op.wrongList);
this.wrongList=JSON.parse(op.wrongList) || [] this.wrongList=JSON.parse(op.wrongList) || []
} }
if(op.score){ if(op.score){
@@ -124,6 +125,13 @@
onReady() { onReady() {
this.getServerData(); this.getServerData();
}, },
onUnload() {
//#ifdef MP-WEIXIN
uni.reLaunch({
url:"/pages/index/index"
})
//#endif
},
computed: { computed: {
...mapState(useUserStore, ["vipOnList"]) ...mapState(useUserStore, ["vipOnList"])
}, },
@@ -131,7 +139,7 @@
...mapActions(useUserStore, ['searchUserVip']), ...mapActions(useUserStore, ['searchUserVip']),
async toVip(){ async toVip(){
await this.searchUserVip() await this.searchUserVip()
const res = this.vipOnList.some(item => item.subjects == this.subject) const res = this.vipOnList.some(item => item.subjects.includes(this.subject))
if(res){ if(res){
uni.navigateTo({ uni.navigateTo({
url: '/pages/me/vip' url: '/pages/me/vip'
@@ -166,10 +174,17 @@
}) })
}, },
toQuestionBank(){ toQuestionBank(){
const list =JSON.stringify(this.wrongList) if(this.wrongList.length==0){
uni.navigateTo({ uni.showToast({
url:"/pages/questionBank/questionBank?navTitle=错题&subject="+this.subject+"&questionList="+list title:'当前无错题~',
}) icon:'none'
})
}else{
const list =JSON.stringify(this.wrongList)
uni.navigateTo({
url:"/pages/questionBank/questionBank?navTitle=错题&subject="+this.subject+"&questionList="+list
})
}
}, },
//重新考试 //重新考试
toExams(){ toExams(){

View File

@@ -1,42 +1,48 @@
<template> <template>
<view class="p14"> <view>
<view class="flex jc-sb"> <u-loading-page :loading="getLoading" loading-text="题库更新中..."></u-loading-page>
<view class="relative mr5" @tap="toIconSkill"> <view class="p14" v-if="!getLoading">
<image style="width: 336rpx;height: 152rpx;" src="../../static/image/practice/errorprone_bg.png"> <view class="flex jc-sb">
</image> <view class="relative mr5" @tap="toIconSkill">
<view style="position: absolute;left: 0;top: 0;" class="p10"> <image style="width: 336rpx;height: 152rpx;" src="../../static/image/practice/errorprone_bg.png">
<view style="color: #04B13B;font-size: 18px;">图标技巧</view> </image>
<text style="color: #04B13B;font-size: 14px;">快速记忆</text> <view style="position: absolute;left: 0;top: 0;" class="p10">
</view> <view style="color: #04B13B;font-size: 18px;">图标技巧</view>
</view> <text style="color: #04B13B;font-size: 14px;">快速记忆</text>
<view class="relative ml5" @tap="toChapterSkill"> </view>
<image style="width: 363rpx;height: 170rpx;" src="../../static/image/practice/chapter_bg.png"></image> </view>
<view style="position: absolute;left: 0;top: 0;" class="p10"> <view class="relative ml5" @tap="toChapterSkill">
<view style="color: #FF6E02;font-size: 18px;">章节练习</view> <image style="width: 363rpx;height: 170rpx;" src="../../static/image/practice/chapter_bg.png"></image>
<text style="color: #FF6E02;font-size: 14px;">共5章</text> <view style="position: absolute;left: 0;top: 0;" class="p10">
</view> <view style="color: #FF6E02;font-size: 18px;">章节练习</view>
</view> <text style="color: #FF6E02;font-size: 14px;">{{chapterNum}}</text>
</view> </view>
<view class="bc-fff pt14" style="border-radius: 20rpx;"> </view>
<u-grid :border="false" col="4"> </view>
<u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex" @click="toAnswer(listItem.title,listItem.isError,listItem.isNew)"> <view class="bc-fff pt14" style="border-radius: 20rpx;">
<view style="width: 84rpx;height: 84rpx;"> <u-grid :border="false" col="4">
<image style="width: 84rpx;height: 100rpx;" mode="widthFix" :src="listItem.image"></image> <u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex"
@click="toAnswer(listItem.title,listItem.isError,listItem.isNew)">
<view class="mb5" style="width: 84rpx;height: 84rpx;">
<image style="width: 84rpx;height:84rpx;" mode="heightFix" :src="listItem.image"></image>
</view>
<text class="grid-text fs14 cor-000">{{listItem.title}}</text>
<text class="grid-text mb10 fs12 cor-999">{{listItem.subTitle}}</text>
</u-grid-item>
</u-grid>
</view>
<view class="mt14 p14 bc-fff" style="border-radius: 20rpx;">
<text class="fs18 cor-000 fw600">常见考点</text>
<view class="flex ai-c wp100 mt10" style="flex-wrap: wrap;">
<view class="wp50 flex ai-c p15tb" style="border-bottom: 1rpx solid #DDDCDC;"
v-for="(item,index) of testCenterList" :key="index" @tap="toQuestionBank(item)">
<view class="dot_item">{{index+1}}</view>
<text class="ml5 topic_cont_text" style="width: calc(100% - 65rpx);">{{item.configItemName}}</text>
</view> </view>
<text class="grid-text fs14 cor-000">{{listItem.title}}</text>
<text class="grid-text mb10 fs12 cor-999">{{listItem.subTitle}}</text>
</u-grid-item>
</u-grid>
</view>
<view class="mt14 p14 bc-fff" style="border-radius: 20rpx;">
<text class="fs18 cor-000 fw600">常见考点</text>
<view class="flex ai-c wp100 mt10" style="flex-wrap: wrap;">
<view class="wp50 flex ai-c p15tb" style="border-bottom: 1rpx solid #DDDCDC;" v-for="(item,index) of testCenterList" :key="index" @tap="toQuestionBank(item)">
<view class="dot_item">{{index+1}}</view>
<text class="ml5 topic_cont_text" style="width: calc(100% - 65rpx);">{{item.configItemName}}</text>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</template> </template>
@@ -44,109 +50,260 @@
import errorIcon from "../../static/image/practice/error_icon.png" import errorIcon from "../../static/image/practice/error_icon.png"
import newRulesIcon from "../../static/image/practice/newRules_icon.png" import newRulesIcon from "../../static/image/practice/newRules_icon.png"
import neverWriteIcon from "../../static/image/practice/neverWrite_icon.png" import neverWriteIcon from "../../static/image/practice/neverWrite_icon.png"
import danxuanIcon from "../../static/image/index/danxuan.png"
import panduanIcon from "../../static/image/index/panduan.png"
import tupianIcon from "../../static/image/index/tupian.png"
import { import {
querySysConfigList, querySysConfigList,
querySpecialNum,
queryQuestionId
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
export default { export default {
data() { data() {
return { return {
chapterNum:0,
errorIcon, errorIcon,
newRulesIcon, newRulesIcon,
neverWriteIcon, neverWriteIcon,
list:[{ list: [{
title:'新规题', title: '新规题',
subTitle:'392题', subTitle: '392题',
isNew:1, isNew: 1,
isError:0, isError: 0,
image:newRulesIcon image: newRulesIcon
},{ }, {
title:'易错题', title: '易错题',
isNew:0, isNew: 0,
isError:1, isError: 1,
subTitle:'392题', subTitle: '392题',
image:errorIcon image: errorIcon
},{ }, {
title:'单选题', title: '单选题',
subTitle:'392题', subTitle: '392题',
isNew:0, isNew: 0,
isError:0, isError: 0,
image:newRulesIcon image: danxuanIcon
},{ }, {
title:'判断题', title: '判断题',
subTitle:'392题', subTitle: '392题',
isNew:0, isNew: 0,
isError:0, isError: 0,
image:errorIcon image: panduanIcon
},{ }, {
title:'图片题', title: '图片题',
subTitle:'392题', subTitle: '392题',
isNew:0, isNew: 0,
isError:0, isError: 0,
image:neverWriteIcon image: tupianIcon
}], }],
testCenterList:[], testCenterList: [],
subject:'1' subject: '1'
} }
}, },
onLoad(op){ onLoad(op) {
if(op.subject){ if (op.subject) {
this.subject=op.subject this.subject = op.subject
} }
this.getExamPoint() this.getExamPoint()
this.getQuestionNum()
this.getChapterList()
},
computed: {
...mapState(useQuestionStore, ["loading_subject4", "loading_subject1", "version"]), //映射函数取出tagslist
getLoading() {
return this.loading_subject4 && this.loading_subject1
}
}, },
methods: { methods: {
getExamPoint(){ ...mapActions(useQuestionStore, ['getAllQuestion']),
getChapterList(){
const carTypeId=storage.get('carType') || '1001' const carTypeId=storage.get('carType') || '1001'
const examKey = this.subject=='1'?'ExamKeysOfSubjectOne':'ExamKeysOfSubjectFour' const key=this.subject=='1'?'ChapterOfSubjectOne':'ChapterOfSubjectFour'
querySysConfigList(carTypeId,examKey).then(resp=>{ querySysConfigList(carTypeId,'ChapterOfSubjectOne').then(resp=>{
if(resp.code==='0000'){ if(resp.code==='0000'&&resp.data){
this.testCenterList=resp.data this.chapterNum=resp.data.length
} }
}) })
}, },
toAnswer(title,isError,isNew) { getQuestionNum() {
uni.navigateTo({ querySpecialNum({
url:"/pages/questionBank/questionBank?navTitle="+title+"&isError="+isError+"&isNew="+isNew carTypeId: storage.get('carType') || '1001',
subject: this.subject
}).then(resp => {
if (resp.code === '0000') {
if (this.subject == '1') {
this.list = [{
title: '新规题',
subTitle: resp.data.newQuestionNum + '题',
isNew: 1,
isError: 0,
image: newRulesIcon,
}, {
title: '易错题',
isNew: 0,
isError: 1,
subTitle: resp.data.errorQuestionNum + '题',
image: errorIcon,
}, {
title: '单选题',
subTitle: resp.data.radioQuestionNum + '题',
isNew: 0,
isError: 0,
image: danxuanIcon,
}, {
title: '判断题',
subTitle: resp.data.judgeQuestionNum + '题',
isNew: 0,
isError: 0,
image: panduanIcon,
}, {
title: '图片题',
subTitle: resp.data.imageQuestionNum + '题',
isNew: 0,
isError: 0,
image: tupianIcon,
}]
} else {
this.list = [{
title: '新规题',
subTitle: resp.data.newQuestionNum + '题',
isNew: 1,
isError: 0,
image: newRulesIcon
}, {
title: '易错题',
isNew: 0,
isError: 1,
subTitle: resp.data.errorQuestionNum + '题',
image: errorIcon,
}, {
title: '单选题',
subTitle: resp.data.radioQuestionNum + '题',
isNew: 0,
isError: 0,
image: danxuanIcon,
}, {
title: '多选题',
subTitle: resp.data.multipleChoiceQuestionNum + '题',
isNew: 0,
isError: 0,
image: neverWriteIcon
}, {
title: '判断题',
subTitle: resp.data.judgeQuestionNum + '题',
isNew: 0,
isError: 0,
image: panduanIcon,
}, {
title: '图片题',
subTitle: resp.data.imageQuestionNum + '题',
isNew: 0,
isError: 0,
image: tupianIcon,
}]
}
}
}) })
}, },
toQuestionBank(val){ getExamPoint() {
uni.navigateTo({ const carTypeId = storage.get('carType') || '1001'
url:"/pages/questionBank/questionBank?navTitle="+val.configItemName+"&examKey="+val.configItemCode const examKey = this.subject == '1' ? 'ExamKeysOfSubjectOne' : 'ExamKeysOfSubjectFour'
querySysConfigList(carTypeId, examKey).then(resp => {
if (resp.code === '0000') {
this.testCenterList = resp.data
}
}) })
}, },
toIconSkill(){ getQuestion(param,title) {
uni.navigateTo({ queryQuestionId({
url:"/pages/index/iconSkill" versionId: this.version,
}) carTypeId: storage.get('carType') || '1001',
}, subject: this.subject,
toChapterSkill(){ ...param,
uni.navigateTo({ }).then(async (resp) => {
url:"/pages/questionBank/chapterExercise" if (resp.code === '0000') {
}) if(resp.data&&resp.data.length){
const arr = resp.data
const listJson = JSON.stringify(arr)
uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + title + "&subject=" + this.subject + "&questionIdList=" + listJson
})
}else{
uni.showToast({
title: '暂无题目',
icon: 'none'
})
}
}else if (resp.code === '4001') {
uni.showToast({
title: '当前题库非最新版,请更新~',
icon: 'none'
})
this.getAllQuestion()
}
})
},
toAnswer(title, isError, isNew) {
if (title == '单选题') {
this.getQuestion({type:'2'},title)
} else if (title == '多选题') {
this.getQuestion({type:'3'},title)
} else if (title == '判断题') {
this.getQuestion({type:'1'},title)
} else if (title == '图片题') {
this.getQuestion({isImage:'1'},title)
} else {
this.getQuestion({isNew:isNew,isError:isError},title)
} }
},
toQuestionBank(val) {
this.getQuestion({examKey:val.configItemCode},val.configItemName)
},
toIconSkill() {
uni.navigateTo({
url: "/pages/index/iconSkill"
})
},
toChapterSkill() {
uni.navigateTo({
url: "/pages/questionBank/chapterExercise?subject="+this.subject
})
} }
} }
}
</script> </script>
<style scoped> <style scoped>
.dot_item{ .dot_item {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
line-height: 41rpx; line-height: 41rpx;
color: #fff; color: #fff;
text-align: center; text-align: center;
background: #0BD032; background: #0BD032;
border-radius: 50%; border-radius: 50%;
} }
.topic_cont_text{
height:45rpx; .topic_cont_text {
height: 45rpx;
overflow: hidden; overflow: hidden;
word-break: break-all; /* break-all(允许在单词内换行。) */ word-break: break-all;
text-overflow: ellipsis; /* 超出部分省略号 */ /* break-all(允许在单词内换行。) */
display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/ text-overflow: ellipsis;
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/ /* 超出部分省略号 */
-webkit-line-clamp:1; /** 显示的行数 **/ display: -webkit-box;
/** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical;
/** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 1;
/** 显示的行数 **/
} }
</style> </style>

View File

@@ -2,14 +2,21 @@
<view> <view>
<!-- <u-navbar title="模拟考试" @rightClick="rightClick" :autoBack="true"> <!-- <u-navbar title="模拟考试" @rightClick="rightClick" :autoBack="true">
</u-navbar> --> </u-navbar> -->
<j-navbar :isDefineBack="true" @toBack="toBack">模拟考试</j-navbar> <j-navbar :isDefineBack="true" @toBack="toBack">{{title}}</j-navbar>
<Question ref="question" :tabsList="tabsList" v-model:isSubmit="isSubmit" type="exam" :subject="subject" navTitle="模拟考试" /> <Question ref="question" :tabsList="tabsList" v-model:isSubmit="isSubmit" :type="type" :isShowAll="isShowAll" @changeTab="changeTab" />
</view> </view>
</template> </template>
<script> <script>
import { import {
getTestQuestion mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import useUserStore from '@/jtools/store/user'
import {
getTestQuestion,
queryQuestionId
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
import Question from './components/Question.vue'; import Question from './components/Question.vue';
@@ -19,52 +26,96 @@
}, },
data() { data() {
return { return {
subject:1, type: '',
isSubmit:false, collectList: storage.get(`collectList_subject${this.subject}`) || [],
tabsList:[{ questionArr: [],
label:"模拟考试", isShowAll: true,
value:0 title: "模拟考试",
},{ subject: 1,
label:"考前密卷", isSubmit: false,
value:1 tabsList: [{
label: "模拟考试",
value: 0
}, {
label: "考前秘卷",
value: 1
}] }]
} }
}, },
onLoad(op) { onLoad(op) {
if(op.subject){ if (op.title) {
this.subject=op.subject this.title = op.title
getTestQuestion({ }
carTypeId: storage.get('carType') || '1001', if (op.subject) {
subject: this.subject this.subject = op.subject
}).then(resp=>{ const param = {}
if(resp.code==='0000'){ if (op.isExam1) {
this.$refs.question.getQuestionList(JSON.stringify(resp.data)) param.isExam1 = op.isExam1
} }
if (op.needVip) {
this.isShowAll = op.needVip
}
let arr = []
arr = [...this[`orderQuestion_subject${this.subject}`]]
let questionObj = {}
arr.forEach(item => {
item.isChoose = false
questionObj[item.questionId] = item
}) })
if (op.questionIdList) {
const idList = JSON.parse(op.questionIdList)
if (idList && idList.length > 0) {
idList.forEach(item => {
this.questionArr.push(questionObj[item])
})
}
}
this.type = 'exam'
this.$refs.question.getQuestionList(JSON.stringify(this.questionArr), this.title,this.subject)
} }
}, },
computed: { computed: {
...mapState(useUserStore, ["vipOnList", "token"]),
...mapState(useQuestionStore, ["orderQuestion_subject1", "orderQuestion_subject4", "version"]), //映射函数取出tagslist
}, },
methods: { methods: {
toBack(){ ...mapActions(useUserStore, ['searchUserVip']),
toBack() {
this.$refs.question.submitPaper() this.$refs.question.submitPaper()
},
async changeTab(val) {
if (val == 1) {
await this.searchUserVip()
const result = this.vipOnList.some(item => item.subjects.includes(this.subject))
if (result) {
uni.navigateTo({
url: "/pages/index/secretPapers?subject=" + this.subject
})
} else {
uni.navigateTo({
url: "/pages/index/videoVip?subject=" + this.subject
})
}
}
} }
} }
} }
</script> </script>
<style scoped> <style scoped>
::v-deep .u-count-down{ ::v-deep .u-count-down {
font-size: 28rpx; font-size: 28rpx;
color:#fff !important; color: #fff !important;
display: inline-block !important; display: inline-block !important;
} }
::v-deep .u-count-down__text{
::v-deep .u-count-down__text {
font-size: 28rpx; font-size: 28rpx;
color:#fff !important; color: #fff !important;
} }
::v-deep .balckColor .u-count-down__text{
::v-deep .balckColor .u-count-down__text {
font-size: 28rpx; font-size: 28rpx;
color:#333 !important; color: #333 !important;
} }
</style> </style>

View File

@@ -6,7 +6,7 @@
<GradesChart :titleName="rightPencentDesc" :actualValue="Number(rightPencent)" /> <GradesChart :titleName="rightPencentDesc" :actualValue="Number(rightPencent)" />
<view class="top_box flex jc-c" style="flex-direction: column;"> <view class="top_box flex jc-c" style="flex-direction: column;">
<view class="wp100 text-center" style="margin-top: -80px;"> <view class="wp100 text-center" style="margin-top: -80px;">
<text v-if="Number(rightPencent)>=90">太棒了正确率很高了</text> <text v-if="Number(rightPencent * 100)>=90">太棒了正确率很高了</text>
<text v-else>继续努力吧正确率有点低~</text> <text v-else>继续努力吧正确率有点低~</text>
<view class="flex ai-c jc-c mt10"> <view class="flex ai-c jc-c mt10">
<view class="text-center wp50" @tap="toQuestionBank"> <view class="text-center wp50" @tap="toQuestionBank">
@@ -88,11 +88,18 @@
this.subject=op.subject this.subject=op.subject
this.allRightList=storage.get(`rightList_subject${this.subject}`) || [] this.allRightList=storage.get(`rightList_subject${this.subject}`) || []
this.allWrongList=storage.get(`wrongList_subject${this.subject}`) || [] this.allWrongList=storage.get(`wrongList_subject${this.subject}`) || []
this.percent=(((this.allRightList.length+this.wrongList.length) / this.orderQuestion.length)*100).toFixed(0) this.percent=(((this.allRightList.length+this.wrongList.length) / this[`orderQuestion_subject${this.subject}`].length)*100).toFixed(0)
} }
}, },
onUnload() {
//#ifdef MP-WEIXIN
uni.reLaunch({
url:"/pages/index/index"
})
//#endif
},
computed: { computed: {
...mapState(useQuestionStore, ["orderQuestion_subject1","orderQuestion_subject1"]), //映射函数取出tagslist ...mapState(useQuestionStore, ["orderQuestion_subject1","orderQuestion_subject4"]), //映射函数取出tagslist
getNotDoNum(){ getNotDoNum(){
return this[`orderQuestion_subject${this.subject}`].length-(this.allRightList.length+this.allWrongList.length) return this[`orderQuestion_subject${this.subject}`].length-(this.allRightList.length+this.allWrongList.length)
} }

View File

@@ -1,10 +1,11 @@
<template> <template>
<view> <view>
<!-- <u-navbar :title="navTitle" @rightClick="rightClick" :autoBack="true"> <u-loading-page :loading="loading" :loading-text="loadTxt"></u-loading-page>
</u-navbar> --> <view v-if="!loading">
<j-navbar>{{navTitle}}</j-navbar> <j-navbar>{{navTitle}}</j-navbar>
<Question ref="question" :tabsList="tabsList" :isShowAll="isShowAll" :subject="subject" :navTitle="navTitle" <Question ref="question" :tabsList="tabsList" :isShowAll="isShowAll" :subject="subject" :navTitle="navTitle"
@changeTab="changeTab"></Question> @changeTab="changeTab"></Question>
</view>
</view> </view>
</template> </template>
@@ -17,7 +18,8 @@
import useUserStore from '@/jtools/store/user' import useUserStore from '@/jtools/store/user'
import Question from './components/Question.vue'; import Question from './components/Question.vue';
import { import {
queryQuestion queryQuestion,
queryQuestionId
} from '@/jtools/api/question'; } from '@/jtools/api/question';
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
export default { export default {
@@ -26,6 +28,9 @@
}, },
data() { data() {
return { return {
loadTxt: '加载中...',
collectList: storage.get(`collectList_subject${this.subject}`) || [],
loading: false,
isShowAll: true, isShowAll: true,
needVip: false, needVip: false,
subject: 1, subject: 1,
@@ -41,86 +46,63 @@
} }
}, },
async onLoad(op) { async onLoad(op) {
this.loading = true
if (op.needVip) { if (op.needVip) {
this.needVip = op.needVip this.needVip = op.needVip
} }
if(op.subject){ if (op.subject) {
this.subject=op.subject this.subject = op.subject
} }
if (op && op.navTitle) { if (op && op.navTitle) {
this.navTitle = op.navTitle this.navTitle = op.navTitle
const param = {} let arr = []
if (this.navTitle === '顺序答题' || this.navTitle === '精简500题') { let param = {}
if(this.subject=='1'){ if (op.needVip) {
this.questionArr = [...this.orderQuestion_subject1] this.isShowAll = !Boolean(op.needVip == 'true')
}else if(this.subject=='4'){
this.questionArr = [...this.orderQuestion_subject4]
}
if (this.needVip === 'true') {
if (this.token) {
await this.searchUserVip()
const res = this.vipOnList.some(item => item.subjects == this.subject)
if (!res) {
this.questionArr = this.questionArr.slice(0, 3)
this.isShowAll = false
}
} else {
uni.redirectTo({
url: '/pages/login/login'
});
}
}
this.$refs.question.getQuestionList(JSON.stringify(this.questionArr))
} else {
if (this.navTitle === '错题本') {
param.questionIdList = storage.get(`wrongList_subject${this.subject}`) || []
} else if (this.navTitle === '收藏夹') {
param.questionIdList = storage.get(`collectList_subject${this.subject}`) || []
}
if (op.questionList) {
param.questionIdList = JSON.parse(op.questionList)
}
if (op.chapter) {
param.chapter = op.chapter
}
if (op.examKey) {
param.examKey = op.examKey
}
if(op.isError&&op.isError=='1'){
param.isError=Number(op.isError)
}
if(op.isNew&&op.isNew=='1'){
param.isNew=Number(op.isNew)
}
queryQuestion(param).then(res => {
if (res.code == '0000') {
this.questionArr = res.data
this.$refs.question.getQuestionList(JSON.stringify(this.questionArr))
}
})
} }
arr = [...this[`orderQuestion_subject${this.subject}`]]
let questionObj={}
arr.forEach(item => {
item.isChoose=false
questionObj[item.questionId]=item
})
if(op.navTitle==='顺序答题'){
this.questionArr=arr
}else if (op.questionIdList) {
const idList = JSON.parse(op.questionIdList)
if(idList&&idList.length>0){
idList.forEach(item=>{
this.questionArr.push(questionObj[item])
})
}
}
this.loading = false
this.$refs.question.getQuestionList(JSON.stringify(this.questionArr), this.navTitle , this.subject)
this.$refs.question.getOriginArr(JSON.stringify(this.questionArr))
} }
}, },
computed: { computed: {
...mapState(useQuestionStore, ["orderQuestion_subject1","orderQuestion_subject4"]), //映射函数取出tagslist ...mapState(useQuestionStore, ["orderQuestion_subject1", "orderQuestion_subject4", "version"]), //映射函数取出tagslist
...mapState(useUserStore, ["vipOnList", "token"]) ...mapState(useUserStore, ["vipOnList", "token"]),
}, },
methods: { methods: {
...mapActions(useUserStore, ['searchUserVip']), ...mapActions(useUserStore, ['searchUserVip']),
...mapActions(useQuestionStore, ['getAllQuestion']),
changeTab(val) { changeTab(val) {
if (val == 1) { if (val == 1) {
let list = JSON.parse(JSON.stringify(this.questionArr)) let list = JSON.parse(JSON.stringify(this.questionArr))
list = list.map(item => { list = list.map(item => {
return { return {
...item, ...item,
clickAnswer: item.trueAnswer clickAnswer: item.trueAnswer,
isChoose: true,
} }
}) })
this.$refs.question.isShowBest(true) this.$refs.question.isShowBest(true)
this.$refs.question.getQuestionList(JSON.stringify(list)) this.$refs.question.getQuestionList(JSON.stringify(list), this.navTitle)
} else { } else {
this.$refs.question.isShowBest(false) this.$refs.question.isShowBest(false)
this.$refs.question.getQuestionList(JSON.stringify(this.questionArr)) this.$refs.question.getQuestionList()
} }
}, },
rightClick() { rightClick() {

View File

@@ -1,16 +1,15 @@
<template> <template>
<view> <view>
<sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video" title="测试视频" <sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video" :src="videoList[currentIndex].videoUrl" />
src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" />
<view class="p14tb bc-fff"> <view class="p14tb bc-fff">
<view class="skill-sequence-panel-content-wrapper pr14" v-if="videoType=='test'"> <view class="skill-sequence-panel-content-wrapper pr14" v-if="videoType=='test'">
<scroll-view class="skill-sequence-panel-content" scroll-x> <scroll-view class="skill-sequence-panel-content" scroll-x>
<view class="skill-sequence-skill-wrapper tab_iem" :class="videoIndex===item.value?'checked_tab':''" v-for="(item,index) of testList" <view class="skill-sequence-skill-wrapper tab_iem" :class="videoIndex===item.value?'checked_tab':''"
:key="index" @tap="checkTest(item.value)">{{item.label}}</view> v-for="(item,index) of testList" :key="index" @tap="checkTest(item.value)">{{item.label}}</view>
</scroll-view> </scroll-view>
</view> </view>
<view class="flex ai-c jc-sb mt10 wp100 p14"> <view class="flex ai-c jc-sb mt10 wp100 p14">
<text class="fs18 fw600 cor-000">C1捷达-基础操作视频讲解</text> <text class="fs18 fw600 cor-000">{{title}}</text>
<view class="flex" @tap="popupShow=true" v-if="videoType!='test'"> <view class="flex" @tap="popupShow=true" v-if="videoType!='test'">
<text class="fs14 cor-666">更多</text> <text class="fs14 cor-666">更多</text>
<u-icon color="#666" name="arrow-right" size="18"></u-icon> <u-icon color="#666" name="arrow-right" size="18"></u-icon>
@@ -20,19 +19,22 @@
<view> <view>
</view> </view>
</view> </view>
<view class="bc-fff pl14"> <view class="bc-fff pl14 pb10">
<view class="skill-sequence-panel-content-wrapper"> <view class="skill-sequence-panel-content-wrapper">
<scroll-view class="skill-sequence-panel-content" scroll-x :scroll-left="164*currentIndex"> <scroll-view class="skill-sequence-panel-content" scroll-x :scroll-left="getScrollLeft">
<view class="skill-sequence-skill-wrapper" v-for="(item, index) in videoList" :key="index" <view class="skill-sequence-skill-wrapper" v-for="(item, index) in videoList" :key="index"
@click="checkVideo(item.projectId)"> @tap="checkVideo(item.projectId)">
<view> <view>
<view class="mb10 relative"> <view class="mb10 relative contain-box hide" style="overflow: hidden;">
<image class="contain-box" src="../../static/image/index/jpsp.png"></image> <image class="contain-box" style="position: absolute;left: 0;top: 0;" mode="widthFix"
:src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
<view v-if="projectId==item.projectId" class="playLogo">播放中</view> <view v-if="projectId==item.projectId" class="playLogo">播放中</view>
<image class="play_btn" src="../../static/image/index/play.png" /> <image class="play_btn" src="../../static/image/index/play.png" />
<text style="position: absolute;right: 8rpx;bottom: 8rpx;color:#fff">13:14</text> <text style="position: absolute;right: 8rpx;bottom: 8rpx;color:#fff">{{item.videoTime}}</text>
</view>
<view class="topic_cont_text" :style="{color:projectId==item.projectId?'#FF6E02':'#333'}">
{{item.description}}
</view> </view>
<text :style="{color:projectId==item.projectId?'#FF6E02':'#333'}">{{item.description}}</text>
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
@@ -44,16 +46,16 @@
<text class="fs16 cor-666" @tap="popupShow=false">收起</text> <text class="fs16 cor-666" @tap="popupShow=false">收起</text>
</view> </view>
<view style="max-height: 800rpx;overflow-y: scroll;" class="p14lr"> <view style="max-height: 800rpx;overflow-y: scroll;" class="p14lr">
<view class="flex bc-fff mt10" style="border-radius: 16rpx;" v-for="(item,index) of videoList" :key="index" <view class="flex bc-fff mb15" style="border-radius: 16rpx;" v-for="(item,index) of videoList" :key="index"
@tap="toDetail"> @tap="checkVideo(item.projectId)">
<view class="pic relative"> <view class="pic relative hide" style="overflow: hidden;">
<image class="pic" src="../../static/image/index/jpsp.png"></image> <image class="pic" style="position: absolute;left: 0;top: 0;" mode="widthFix" :src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
<image class="play_btn_2" src="../../static/image/index/play.png" /> <image class="play_btn_2" src="../../static/image/index/play.png" />
<text style="position: absolute;right: 8rpx;bottom: 8rpx;color:#fff">13:14</text> <text style="position: absolute;right: 8rpx;bottom: 8rpx;color:#fff">{{item.videoTime}}</text>
</view> </view>
<view class="ml10"> <view class="ml10">
<text class="fs16 cor-000 fw600">{{item.description}}</text> <text class="fs16 cor-000 fw600">{{item.description}}</text>
<view class="fs14 mt5 cor-666">上车下车的方法</view> <view class="fs14 mt5 cor-666">{{item.subDesc}}</view>
</view> </view>
</view> </view>
</view> </view>
@@ -69,7 +71,8 @@
export default { export default {
data() { data() {
return { return {
currentIndex:0, title: '',
currentIndex: 0,
videoIndex: 0, videoIndex: 0,
testList: [{ testList: [{
label: "八一考场", label: "八一考场",
@@ -93,6 +96,7 @@
label: "庐江考场", label: "庐江考场",
value: 6 value: 6
}], }],
driveType:'',
videoType: '', videoType: '',
popupShow: false, popupShow: false,
videoList: [{ videoList: [{
@@ -120,45 +124,93 @@
time: '13:14', time: '13:14',
id: 5 id: 5
}], }],
projectId:undefined, projectId: undefined,
param:{} param: {}
} }
}, },
onLoad(op) { onLoad(op) {
if(op.driveType){
this.driveType=op.driveType
this.param.driveType=op.driveType
}
if (op.type) { if (op.type) {
this.videoType = op.type this.videoType = op.type
} }
if(op.projectId){ if (op.projectId) {
this.projectId=op.projectId this.projectId = op.projectId
} }
if(op.driveType){ if (op.subject) {
this.param.driveType=op.driveType this.param.subject = op.subject
} }
if(op.subject){ if (op.type) {
this.param.subject=op.subject this.param.type = op.type
this.getVideoList()
} }
if(op.type){ if (op.type == '1') {
this.param.type=op.type if (this.param.subject == '2') {
this.title = '科二基础项目讲解'
} else {
this.title = '科三基础项目讲解'
}
} else {
this.title = '基础操作讲解'
}
},
computed: {
getScrollLeft() {
const index = this.currentIndex - 1 < 0 ? 0 : this.currentIndex - 1
return 164 * index
} }
this.getVieoList()
}, },
methods: { methods: {
getVieoList(){ formateTime(time) {
const h = parseInt(time / 3600)
const minute = parseInt(time / 60 % 60)
const second = Math.ceil(time % 60)
const hours = h < 10 ? '0' + h : h
const formatSecond = second > 59 ? 59 : second
return `${hours > 0 ? `${hours}:` : ''}${minute < 10 ? '0' + minute : minute}:${formatSecond < 10 ? '0' + formatSecond : formatSecond}`
},
getVideoList() {
queryProjectList({ queryProjectList({
"carTypeId": storage.get('carType') || '1001', "carTypeId": storage.get('carType') || '1001',
"driveType": this.param.driveType, ...this.param,
"subject": this.param.subject, }).then(resp => {
"type": this.param.type if(resp.code==='0000'){
}).then(resp=>{ let arr=[]
this.videoList=resp.data if(this.param.type=='1'){
this.currentIndex=this.videoList.findIndex(item=>item.projectId==this.projectId) arr = JSON.parse(JSON.stringify(resp.data))
arr = arr.map(item => {
return {
...item,
videoUrl: item.videoList[0]?.videoUrl,
videoTime: this.formateTime(item.videoList[0]?.videoTime)
}
})
}else{
arr = JSON.parse(JSON.stringify(resp.data[0].videoList))
arr = arr.map(item => {
return {
...item,
projectId: item.videoId,
subDesc: resp.data[0].description,
videoTime: this.formateTime(item.videoTime)
}
})
}
this.videoList = arr
this.currentIndex = this.videoList.findIndex(item => item.projectId == this.projectId)
}
}) })
}, },
checkTest(val) { checkTest(val) {
this.videoIndex = val this.videoIndex = val
}, },
checkVideo(val) { checkVideo(val) {
this.popupShow = false
this.projectId = val this.projectId = val
this.currentIndex = this.videoList.findIndex(item => item.projectId == this.projectId)
} }
} }
} }
@@ -172,6 +224,21 @@
border-radius: 8rpx; border-radius: 8rpx;
} }
.topic_cont_text {
width: 260rpx;
height:45rpx;
overflow: hidden;
word-break: break-all;
/* break-all(允许在单词内换行。) */
text-overflow: ellipsis;
/* 超出部分省略号 */
/* display: -webkit-box; */
white-space: nowrap;
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp:1; /** 显示的行数 **/
}
.playLogo { .playLogo {
width: 90rpx; width: 90rpx;
height: 40rpx; height: 40rpx;
@@ -223,18 +290,27 @@
background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%); background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
color: #fff color: #fff
} }
/*scroll-view外层*/ /*scroll-view外层*/
.skill-sequence-panel-content-wrapper{ .skill-sequence-panel-content-wrapper {
position: relative; position: relative;
white-space:nowrap; white-space: nowrap;
} }
/*scroll-view本身*/ /*scroll-view本身*/
.skill-sequence-panel-content{ .skill-sequence-panel-content {
min-width:100%; min-width: 100%;
} }
/*scroll-view内层*/ /*scroll-view内层*/
.skill-sequence-skill-wrapper{ .skill-sequence-skill-wrapper {
display: inline-block; display: inline-block;
margin-right: 15px; margin-right: 15px;
} }
.hide {
backface-visibility: hidden;
transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
}
</style> </style>

View File

@@ -5,23 +5,22 @@
</u-sticky> </u-sticky>
<view class="p14"> <view class="p14">
<view class="top_box"> <view class="top_box">
<view class="tip_box flex ai-c jc-sb" v-if="tIndex==0"> <view class="tip_box flex ai-c jc-sb" v-if="tIndex==0&&showTip">
<view class="flex ai-c"> <view class="flex ai-c">
<u-icon name="error-circle-fill" color="#FF6E02" size="18"></u-icon> <u-icon name="error-circle-fill" color="#FF6E02" size="18"></u-icon>
<text class="ml10 fs12" style="color: #FF6E02;">{{title}}</text> <text class="ml10 fs12" style="color: #FF6E02;">{{title}}</text>
</view> </view>
<u-icon name="close" color="#FF6E02" size="18"></u-icon> <u-icon name="close" color="#FF6E02" size="18" @tap="showTip=false"></u-icon>
</view> </view>
<view class="p14"> <view class="p14">
<text class="fs18 cor-000 fw600">{{tIndex==0?'错题':'收藏'}}情况</text> <text class="fs18 cor-000 fw600">{{tIndex==0?'错题':'收藏'}}情况</text>
<view class="total_box mt10"> <view class="total_box mt10" @tap="toPractice">
<view class="flex ai-c jc-sb"> <view class="flex ai-c jc-sb">
<view class="text-center"> <view class="text-center">
<view style="width: 111rpx;" class="fs30 cor-000">{{tIndex==0?wrongList.length:collectList.length}} <view style="width: 111rpx;" class="fs30 cor-000">{{tIndex==0?wrongList.length:collectList.length}}
</view> </view>
</view> </view>
<view style="text-align: right;flex-direction: column;justify-content: right" class="flex ai-c" <view style="text-align: right;flex-direction: column;justify-content: right" class="flex ai-c">
@tap="toPractice">
<u-icon name="arrow-right" size="18"></u-icon> <u-icon name="arrow-right" size="18"></u-icon>
</view> </view>
</view> </view>
@@ -47,42 +46,31 @@
</view> --> </view> -->
</view> </view>
</view> </view>
<view class="flex jc-sb ai-c mt10" v-if="tIndex==0"> <!-- <view class="flex jc-sb ai-c mt10" v-if="tIndex==0">
<text>答对后自动移除错题</text> <text>答对后自动移除错题</text>
<u-switch v-model="isMoveWrong" activeColor="#0BD032"></u-switch> <u-switch v-model="isMoveWrong" activeColor="#0BD032"></u-switch>
</view> </view> -->
</view> </view>
<view style="margin-top: 30rpx;" v-if="tIndex==0"> <!-- <view class="ml15 text-center">
<view class="video-box">
<view class="flex jc-sb ai-c wp100">
<text style="color: #05C341;font-size: 36rpx;">{{subject==1?'一':'四'}}精品视频课</text>
<text class="cor-666 fs12">全部10节课 ></text>
</view>
<view class="flex ai-c mt20">
<view class="contain-box relative">
<image class="contain-box" src="../../../static/image/index/jpsp.png"></image>
<image class="play_btn_2" src="../../static/image/index/play.png" />
</view>
<view class="ml15 text-center">
<u-button :customStyle="{width:'200rpx',height:'66rpx',borderRadius: '33rpx'}" iconColor="#fff" <u-button :customStyle="{width:'200rpx',height:'66rpx',borderRadius: '33rpx'}" iconColor="#fff"
text="去看视频" color="linear-gradient(90deg, #11DF20 0%, #00B74F 100%)" icon="play-circle"> text="去看视频" color="linear-gradient(90deg, #11DF20 0%, #00B74F 100%)" icon="play-circle">
</u-button> </u-button>
<view class="cor-333 fs15 fw600 mt10">{{subject==1?'一':'四'}}易错试题</view> <view class="cor-333 fs15 fw600 mt10">{{subject==1?'一':'四'}}易错试题</view>
</view> </view> -->
</view>
</view>
</view>
</view> </view>
<view class="top_box mt15 p14"> <view class="top_box mt15 p14" v-if="typeList&&typeList.length">
<view class="flex jc-sb aic"> <view class="flex jc-sb aic">
<text class="fs18 cor-000 fw600">{{tIndex==0?'错题':'收藏题'}}分类</text> <text class="fs18 cor-000 fw600">{{tIndex==0?'错题':'收藏题'}}分类</text>
<!-- <u-icon name="arrow-right" size="18"></u-icon> --> <!-- <u-icon name="arrow-right" size="18"></u-icon> -->
</view> </view>
<view class="flex ai-c jc-sb" style="flex-wrap: wrap;"> <view class="flex ai-c jc-sb mt10" style="flex-wrap: wrap;">
<view v-for="(item,index) of typeList" :key="index" class="category_item p14 flex jc-sb ai-c mb10"> <!-- 这个点击效果没加 -->
<text class="cor-000">{{item.categoryName}}</text> <view v-for="(item,index) of typeList" :key="index" class="category_item p14 flex jc-sb ai-c mb10" @tap="toCategoryQuestion(item)">
<view class="topic_cont_text" style="max-width: 75%;">
<text class="cor-000">{{item.categoryName}}</text>
</view>
<text class="cor-666">{{item.num}}</text> <text class="cor-666">{{item.num}}</text>
</view> </view>
</view> </view>
@@ -92,6 +80,11 @@
</template> </template>
<script> <script>
import {
mapState,
mapActions
} from 'pinia' //引入映射函数
import useQuestionStore from '@/jtools/store/question' //引入store
import storage from '@/jtools/storage'; import storage from '@/jtools/storage';
import { import {
questionCategory questionCategory
@@ -99,6 +92,7 @@
export default { export default {
data() { data() {
return { return {
showTip: true,
collectList: [], collectList: [],
rightList: storage.get(`rightList_subject${this.subject}`) || [], rightList: storage.get(`rightList_subject${this.subject}`) || [],
wrongList: storage.get(`wrongList_subject${this.subject}`) || [], wrongList: storage.get(`wrongList_subject${this.subject}`) || [],
@@ -124,6 +118,7 @@
} }
}, },
computed: { computed: {
...mapState(useQuestionStore, ["orderQuestion_subject1", "orderQuestion_subject4"]), //映射函数取出tagslist
getPercent() { getPercent() {
return ((this.wrongList.length / (this.wrongList.length + this.rightList.length)) * 100).toFixed(0) return ((this.wrongList.length / (this.wrongList.length + this.rightList.length)) * 100).toFixed(0)
} }
@@ -144,37 +139,50 @@
this.tIndex = val.index this.tIndex = val.index
this.getQuestionCategory() this.getQuestionCategory()
}, },
toCategoryQuestion(item){
const jsonString = JSON.stringify(item.errorQuestionIdList)
console.log(item);
uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + item.categoryName + "&questionIdList=" + jsonString+"&subject="+this.subject
})
},
toPractice() { toPractice() {
const navTitle = this.tIndex == 0 ? '错题本' : '收藏夹' const navTitle = this.tIndex == 0 ? '错题本' : '收藏夹'
let arr=[]
if (navTitle == '错题本') { if (navTitle == '错题本') {
arr = this.wrongList
if (!this.wrongList.length) { if (!this.wrongList.length) {
uni.showModal({ uni.showModal({
title: '提示', title: '提示',
content: '当前无错题,继续保持吧~', content: '当前无错题,继续保持吧~',
showCancel:false, showCancel: false,
success: function (res) { success: function(res) {
if (res.confirm) { if (res.confirm) {
console.log('用户点击确定'); console.log('用户点击确定');
}
} }
} });
});
return return
} }
} else if (navTitle == '收藏夹') { } else if (navTitle == '收藏夹') {
uni.showModal({ arr=this.collectList
title: '提示', if (!this.collectList.length) {
content: '当前无收藏题~', uni.showModal({
showCancel:false, title: '提示',
success: function (res) { content: '当前无收藏题~',
if (res.confirm) { showCancel: false,
console.log('用户点击确定'); success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
}
} }
} });
}); return
return }
} }
const listJson=JSON.stringify(arr)
uni.navigateTo({ uni.navigateTo({
url: "/pages/questionBank/questionBank?navTitle=" + navTitle + "&subject=" + this.subject url: "/pages/questionBank/questionBank?navTitle=" + navTitle + "&subject=" + this.subject+"&questionIdList="+listJson
}) })
} }
} }
@@ -244,7 +252,7 @@
} }
.category_item { .category_item {
width: 312rpx; width: 310rpx;
height: 90rpx; height: 90rpx;
text-align: center; text-align: center;
line-height: 90rpx; line-height: 90rpx;
@@ -259,4 +267,18 @@
left: 165.5rpx; left: 165.5rpx;
top: 78rpx top: 78rpx
} }
.topic_cont_text {
overflow: hidden;
word-break: break-all;
/* break-all(允许在单词内换行。) */
text-overflow: ellipsis;
/* 超出部分省略号 */
display: -webkit-box;
/** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical;
/** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 1;
/** 显示的行数 **/
}
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 100 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 90 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

View File

@@ -0,0 +1,11 @@
## 1.0.42022-12-07
修改判断在APP端不监听document的滚动
## 1.0.32022-12-05
新增:支持视频预览,视频图片混用
新增支持预览单张handlePreviewImg方法直接传入图片或视频地址即可单张预览
## 1.0.22022-12-05
## 1.0.12022-12-05
文档错误修改
## 1.0.02022-11-29
初始化插件

View File

@@ -0,0 +1,235 @@
<template>
<view class="pos">
<uni-transition :mode-class="modeClass" :show="show">
<!-- 多张图片预览 -->
<view class="content" @tap="closedPreview">
<swiper
class="swiper"
circular
:current="curDot"
@change="swiperChange"
:indicator-dots="false"
>
<swiper-item v-for="(item, idx) in selfImgList" :key="idx">
<movable-area scale-area>
<movable-view
:scale="!disabledScale"
direction="all"
scale="true"
scale-min="0.5"
scale-max="5"
:scale-value="1"
damping="150"
friction="15"
>
<image v-if="isImg(item)" :src="item" mode="widthFix"></image>
<view class="video-preview" v-else>
<video
:autoplay="true"
:src="item"
:enable-progress-gesture="false"
:show-fullscreen-btn="false"
></video>
</view>
</movable-view>
</movable-area>
</swiper-item>
</swiper>
</view>
<!-- 指示器 -->
<slot name="indicator" v-if="imgList.length > 1 && !indicatorDotsType">
<view class="current-dot">
<view class="change-buttom" @tap.stop="previousImg">
<uni-icons class="font-white" type="back" size="30"></uni-icons>
</view>
<view class="font-white cur">
{{ curDot + 1 }}/{{ imgList.length }}
</view>
<view class="change-buttom" @tap.stop="nextImg">
<uni-icons class="font-white" type="forward" size="30"></uni-icons>
</view>
</view>
</slot>
</uni-transition>
</view>
</template>
<script>
export default {
props: {
// 过渡效果
modeClass: {
type: Array,
default: ['fade', 'zoom-out'],
},
// 指示器类型 true 圆点 false 数字
indicatorDotsType: {
type: Boolean,
default: true,
},
// 图片列表
imgList: {
type: Array,
default: () => [],
},
// 是否禁止放大缩小 禁止后swiper可以滑动切换
disabledScale: {
type: Boolean,
default: false,
},
},
data() {
return {
show: false,
curDot: 0,
selfImgList: [],
};
},
computed: {
isImg() {
return (src) => {
return src.indexOf('.mp4') === -1 ? true : false;
};
},
},
watch: {
//监听打开时阻止下面元素的滚动事件
/* #ifdef APP-PLUS*/
show(val) {
if (val) {
document
.getElementsByClassName('pos')[0]
.addEventListener('touchmove', function (e) {
e.preventDefault();
});
}
},
/* #endif */
imgList: {
handler(val) {
if (val.length) {
this.selfImgList = val.concat();
}
},
},
},
methods: {
handlePreviewImg(param) {
this.show = !this.show;
if (typeof param === 'string') {
this.selfImgList = [param];
} else {
if (param) {
this.curDot = param;
}
}
this.$emit('preview', this.show);
},
closedPreview() {
this.show = !this.show;
this.curDot = 0;
this.$emit('preview', this.show);
},
swiperChange(e) {
this.curDot = e.detail.current;
this.$emit('changeImg', e.detail.current);
},
previousImg() {
let num = this.imgList.length - 1;
if (this.curDot <= 0) {
this.curDot = num;
} else {
this.curDot--;
}
},
nextImg() {
let num = this.imgList.length - 1;
if (this.curDot >= num) {
this.curDot = 0;
} else {
this.curDot++;
}
},
},
};
</script>
<style lang="scss" scoped>
movable-view {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
movable-area {
height: 100%;
width: 100%;
position: fixed;
overflow: hidden;
}
movable-view image {
width: 100%;
}
.content {
height: 100vh;
width: 100vw;
display: flex;
align-items: center;
background: #00000076;
}
.pos {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
}
.swiper {
height: 100%;
width: 100%;
}
.current-dot {
position: absolute;
bottom: 10%;
left: 25%;
width: 50%;
display: flex;
align-items: center;
justify-content: space-around;
.change-buttom {
padding: 10rpx;
border-radius: 50%;
background: #3f3f3f;
}
.cur {
font-size: 20rpx;
}
}
.font-white {
color: #fff !important;
}
::v-deep {
.uni-swiper-dots-horizontal {
bottom: 12%;
}
.uni-swiper-dot {
width: 10rpx;
height: 10rpx;
}
uni-video {
width: 100vw;
height: 100vh;
}
}
.video-preview {
position: relative;
.video-close {
position: absolute;
right: 50rpx;
top: 50rpx;
}
}
</style>

View File

@@ -0,0 +1,84 @@
{
"id": "g-preview-img",
"displayName": "g-preview-img一款兼容vue2vue3的图片预览插件视频预览支持单张多张左右滑动放大缩小",
"version": "1.0.4",
"description": "g-preview-img一款兼容vue2vue3的图片预览插件视频预览支持单张多张左右滑动放大缩小",
"keywords": [
"vue2",
"vue3",
"图片预览",
"视频预览"
],
"repository": "",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"type": "component-vue",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "y"
},
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "u",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u",
"钉钉": "u",
"快手": "u",
"飞书": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}

View File

@@ -0,0 +1,64 @@
![image](https://deaon-saasvideo.oss-cn-shanghai.aliyuncs.com/11111.gif)
### 一款兼容vue2vue3的图片预览插件视频预览支持图片视频混用支持单张多张左右滑动放大缩小
### 基础使用方法
```javascript
<template>
<image v-for="(item,idx) in imgList" :src="item" :key="idx" @tap="handleClick(idx)"></image>
<g-preview-img :imgList="imgList" ref="preview"><g-preview-img>
</template>
<script setup>
import { ref } from 'vue'
const preview = ref(null)
const imgList = ['图片路径1','图片路径2']
const handleClick = (idx)=>{
// idx为要打开的图片的索引也可以不传默认打开第一张
// handlePreviewImg的参数支持传入单张图片地址或单个视频地址
preview.value.handlePreviewImg(idx)
}
</script>
```
| 属性名/事件 | 类型 | 默认值 | 说明 |
| ----------------- | ------------ | --------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| modeClass | Array/String | \['fade', 'zoom-out'] | uni-transition组件过渡效果可选值见 <https://uniapp.dcloud.net.cn/component/uniui/uni-transition.html#mode-class-%E5%86%85%E7%BD%AE%E8%BF%87%E6%B8%A1%E5%8A%A8%E7%94%BB%E7%B1%BB%E5%9E%8B%E8%AF%B4%E6%98%8E> |
| indicatorDotsType | Boolean | false | 多张图片的指示器ture为圆点false数字当图片列表只有一张图片时默认不展示指示器 |
| imgList | Array | | 图片列表 |
| disabledScale | Boolean | false | 是否禁止双指放大缩小 |
| @preview | 打开关闭事件 | | 接受一个参数ture为开启false为关闭 |
| @changeImg | 图片切换的事件 | | 参数为当前的图片索引 |
#### 插槽,自定义翻页按钮
```js
<g-preview-img :imgList="imgList" ref="preview">
<template>
<!--你的翻页按钮-->
<view @tap.stop="previousImg">上一页</view>
<view @tap.stop="nextImg">下一页</view>
</template>
</g-preview-img>
<script>
const preview = ref(null)
//上一页的方法
const previousImg = ()=>{
preview.value.previousImg()
}
//下一页的方法
const previousImg = ()=>{
preview.value.nextImg()
}
</script>
```
#### 支持uniapp原生swiper的属性
插件内部swiper标签上绑定了$attrs,所以在使用时可以传入一些swiper的属性
注意不要传disable-touch这个属性会有意想不到的错误
**插件bug会及时修复**

View File

@@ -0,0 +1,24 @@
## 1.1.12023-08-01
优化文档
## 1.1.02023-08-01
优化文档
## 1.0.92023-07-10
优化文档
## 1.0.82023-06-25
优化文档
## 1.0.72023-06-25
优化文档
## 1.0.62023-05-26
优化文档
## 1.0.52023-05-22
优化文档
## 1.0.42023-04-30
新增图片放大功能解决原生组件和tabbar导航栏等无法覆盖的问题
## 1.0.32023-04-28
优化文档
## 1.0.22023-04-28
优化文档
## 1.0.12023-04-28
新增长按事件
## 1.0.02023-04-28
插件上线

View File

@@ -0,0 +1,121 @@
<template>
<view class="previewImage" v-if="show" @tap="close">
<view class="page" v-if="urls.length > 0">
<text class="text">{{ current + 1 }} / {{ urls.length }}</text>
</view>
<swiper class="swiper" :current="current" @change="swiperChange" @touchstart="handleTouchStart" @touchend="handleTouchEnd">
<swiper-item v-for="(item, index) in urls" :key="index">
<movable-area class="movable-area" scale-area>
<movable-view class="movable-view" direction="all" :inertia="true" damping="100" scale="true" scale-min="1" scale-max="4" :scale-value="scale">
<scroll-view scroll-y="true" class="uni-scroll-view">
<view class="scroll-view"><image :key="index" class="image" :src="item" mode="widthFix" @longpress="onLongpress(item)" /></view>
</scroll-view>
</movable-view>
</movable-area>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
props: {
urls: {
type: Array,
required: true,
default: () => {
return [];
}
}
},
data() {
return {
show: false,
current: 0, //当前页
scale: 1,
isZooming: false // 是否处于缩放状态
};
},
methods: {
//打开
open(current) {
this.current = this.urls.findIndex(item => item === current);
this.show = true;
this.$emit('open');
},
//关闭
close() {
if (!this.isZooming) {
this.show = false;
this.current = 0;
this.$emit('close');
}
},
//图片改变
swiperChange(e) {
this.current = e.detail.current;
},
//监听长按
onLongpress(e) {
this.$emit('onLongpress', e);
},
handleTouchStart() {
this.isZooming = true;
},
handleTouchEnd() {
this.isZooming = false;
}
}
};
</script>
<style lang="scss" scoped>
.previewImage {
z-index: 9999;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000000;
.swiper {
width: 100%;
height: 100vh;
swiper-item {
.movable-area {
height: 100%;
width: 100%;
.movable-view {
width: 100%;
min-height: 100%;
.scroll-view {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
.image {
width: 100%;
height: auto;
}
}
}
}
}
}
.page {
position: absolute;
z-index: 9999;
width: 100%;
top: 60rpx;
text-align: center;
.text {
color: #fff;
font-size: 32rpx;
background-color: rgba(0, 0, 0, 0.5);
padding: 3rpx 16rpx;
border-radius: 20rpx;
user-select: none;
}
}
}
</style>

View File

@@ -0,0 +1,81 @@
{
"id": "q-previewImage",
"displayName": "图片预览、多图左右滑动、图片放大、支持覆盖原生组件、原生导航栏、tabbar",
"version": "1.1.1",
"description": "最简洁的模拟图片预览,支持长按事件,多图左右滑动,大图上下滑动查看,支持图片放大,支持覆盖原生组件/原生导航栏/tabbar 支持vue2/vue3/app/小程序/h5",
"keywords": [
"图片预览"
],
"repository": "",
"engines": {
"HBuilderX": "^3.4.14"
},
"dcloudext": {
"type": "component-vue",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "y"
},
"App": {
"app-vue": "y",
"app-nvue": "n"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "u",
"微信浏览器(Android)": "u",
"QQ浏览器(Android)": "u"
},
"H5-pc": {
"Chrome": "u",
"IE": "u",
"Edge": "u",
"Firefox": "u",
"Safari": "u"
},
"小程序": {
"微信": "y",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u",
"钉钉": "u",
"快手": "u",
"飞书": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}

View File

@@ -0,0 +1,244 @@
# 最简洁的模拟图片预览,支持长按事件,多图左右滑动,大图上下滑动查看,支持图片放大,支持覆盖原生组件/原生导航栏/tabbar 支持vue2/vue3/app/小程序/h5
- 为了解决项目中因一些特殊原因无法使用uni.previewImage例如App.onShow或者页面的oShow中写了方法。
- 如果用uni.previewImage每次预览图片都会进到onShow的方法里
- 可以基本实现官方的预览图片功能但是体验不如uni.previewImage()
- 如没有特殊原因还是推荐官方的uni.previewImage()
## 安装指引
##1. 在插件市场打开本插件页面,在右侧点击`使用 HBuilderX 导入插件`,选择要导入的项目点击确定
##2. 使用方法 vue2写法
```
<template>
<view>
<video v-if="videoShow" id="myVideo" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" controls></video>
<image v-for="(item, index) in imgs" :key="index" :src="item" @click="preview(item)"></image>
<q-previewImage ref="previewImage" :urls="imgs" @onLongpress="onLongpress" @open="open" @close="close"></q-previewImage>
</view>
</template>
<script>
export default {
data() {
return {
videoShow:true,//video组件是否显示
imgs: [],
};
},
methods: {
preview(url) {
this.imgs = ['https://web-assets.dcloud.net.cn/unidoc/zh/multiport-20210812.png', 'https://web-assets.dcloud.net.cn/unidoc/zh/uni-function-diagram.png'] //设置图片数组
// #ifdef MP-WEIXIN
this.$nextTick(()=>{
this.$refs.previewImage.open(url); // 传入当前选中的图片地址(小程序必须添加$nextTick解决组件首次加载无图)
})
// #endif
// #ifndef MP-WEIXIN
this.$refs.previewImage.open(url); // 传入当前选中的图片地址
// #endif
},
onLongpress(e){ //长按事件
console.log('当前长按的图片是' + e);
uni.showActionSheet({
itemList: ['转发给朋友', '保存到手机'],
success: function (res) {
console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
},
fail: function (res) {
console.log(res.errMsg);
}
});
},
/* open和close方法一般用不到但是在一些特殊场景会用到
* 比如预览图片时你需要覆盖 NavigationBar和 TabBar
* 或者在app中需要预览图片时覆盖住原生组件比如video或者map等
* 你可以根据open和close去做一些操作例如隐藏导航栏或者隐藏一些原生组件等
*/
open(){ //监听组件显示 隐藏TabBar和NavigationBar隐藏video原生组件
// uni.hideTabBar()
// uni.setNavigationBarColor({
// frontColor: '#000000', // 设置前景色为黑色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// this.videoShow = false
},
close(){ //监听组件隐藏 显示TabBar和NavigationBar显示video原生组件
// uni.showTabBar()
// uni.setNavigationBarColor({
// frontColor: '#ffffff', // 设置前景色为白色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// this.videoShow = true
}
}
};
</script>
```
##3. vue3 setup写法
```
<template>
<view>
<video v-if="videoShow" id="myVideo" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" controls></video>
<image v-for="(item, index) in imgs" :key="index" :src="item" @click="preview(item)"></image>
<q-previewImage ref="previewImage" :urls="imgs" @onLongpress="onLongpress" @open="open" @close="close"></q-previewImage>
</view>
</template>
<script setup>
import { reactive, ref, toRefs,nextTick } from 'vue';
const data = reactive({
videoShow:true,//video组件是否显示
imgs: [],
});
const previewImage = ref(null);
const { imgs,videoShow } = toRefs(data)// 解构
const preview = url => {
data.imgs = ['https://web-assets.dcloud.net.cn/unidoc/zh/multiport-20210812.png', 'https://web-assets.dcloud.net.cn/unidoc/zh/uni-function-diagram.png'] //设置图片数组
// #ifdef MP-WEIXIN
nextTick(()=>{
previewImage.value.open(url); // 传入当前选中的图片地址(小程序必须添加nextTick解决组件首次加载无图)
})
// #endif
// #ifndef MP-WEIXIN
previewImage.value.open(url); // 传入当前选中的图片地址
// #endif
};
const onLongpress = e =>{
console.log('当前长按的图片是' + e);
uni.showActionSheet({
itemList: ['转发给朋友', '保存到手机'],
success: function (res) {
console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
},
fail: function (res) {
console.log(res.errMsg);
}
});
}
/* open和close方法一般用不到但是在一些特殊场景会用到
* 比如预览图片时你需要覆盖 NavigationBar和 TabBar
* 或者在app中需要预览图片时覆盖住原生组件比如video或者map等
* 你可以根据open和close去做一些操作例如隐藏导航栏或者隐藏一些原生组件等
*/
const open = () => { //监听组件显示 隐藏TabBar和NavigationBar隐藏video原生组件
// uni.hideTabBar()
// uni.setNavigationBarColor({
// frontColor: '#000000', // 设置前景色为黑色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// data.videoShow = false
}
const close = () => { //监听组件隐藏 显示TabBar和NavigationBar显示video原生组件
// uni.showTabBar()
// uni.setNavigationBarColor({
// frontColor: '#ffffff', // 设置前景色为白色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// data.videoShow = true
}
</script>
```
##4. 项目示例 (一般返回的数据图片是以逗号或特殊字符分割的字符串点击时就需要传两个参数一个是图片数组一个是当前图片的index)
## 注意q-previewImage不要写在循环体中imgs其实就是用来存放当前图片的数组每次点击每次赋值就行
```
<template>
<view>
<video v-if="videoShow" id="myVideo" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" controls></video>
<view v-for="(item, index) in list" :key="index" class="list">
<image :src="i" mode="aspectFill" v-for="(i,imgindex) in item.urls.split(',')" @click.stop="preimg(item.urls.split(','),imgindex)"></image>
<view>
<q-previewImage ref="previewImage" :urls="imgs" @onLongpress="onLongpress" @open="open" @close="close"></q-previewImage>
</view>
</template>
<script>
export default {
data() {
return {
videoShow:true,//是否显示video组件
imgs: [],//imgs其实就是用来存放当前图片的数组每次点击每次赋值就行
};
},
methods: {
preimg(urls,index){
this.imgs = urls //imgs其实就是用来存放当前图片的数组每次点击每次赋值就行
// #ifdef MP-WEIXIN
this.$nextTick(()=>{
this.$refs.previewImage.open(this.imgs[index]); // 传入当前选中的图片地址(小程序必须添加$nextTick解决组件首次加载无图)
})
// #endif
// #ifndef MP-WEIXIN
this.$refs.previewImage.open(this.imgs[index]); // 传入当前选中的图片地址
// #endif
},
onLongpress(e){ //长按事件
console.log('当前长按的图片是' + e);
uni.showActionSheet({
itemList: ['转发给朋友', '保存到手机'],
success: function (res) {
console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
},
fail: function (res) {
console.log(res.errMsg);
}
});
},
/* open和close方法一般用不到但是在一些特殊场景会用到
* 比如预览图片时你需要覆盖 NavigationBar和 TabBar
* 或者在app中需要预览图片时覆盖住原生组件比如video或者map等
* 你可以根据open和close去做一些操作例如隐藏导航栏或者隐藏一些原生组件等
*/
open(){ //监听组件显示 隐藏TabBar和NavigationBar隐藏video原生组件
// uni.hideTabBar()
// uni.setNavigationBarColor({
// frontColor: '#000000', // 设置前景色为黑色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// this.videoShow = false
},
close(){ //监听组件隐藏 显示TabBar和NavigationBar显示video原生组件
// uni.showTabBar()
// uni.setNavigationBarColor({
// frontColor: '#ffffff', // 设置前景色为白色
// backgroundColor: '#000000', // 设置背景色为黑色
// })
// this.videoShow = true
}
}
};
</script>
```
## 如果插件对您有一点帮助,请给个五星好评,感谢支持
## 如有问题请加qq 965969604