359 lines
9.0 KiB
Vue
359 lines
9.0 KiB
Vue
<template>
|
|
<view class="page">
|
|
<u-navbar title="首页" placeholder @leftClick="leftClick" />
|
|
<view class="search">
|
|
<!-- <uni-icons type="scan" size="24" style="margin-right: 2vw; color: #bababa" @click="toggleScan"></uni-icons> -->
|
|
<uni-easyinput
|
|
suffixIcon="search"
|
|
v-model="keyword"
|
|
placeholder="请输入搜索关键词"
|
|
@iconClick="toggleSearch"
|
|
></uni-easyinput>
|
|
</view>
|
|
<view class="opt-grids">
|
|
<view v-for="(part, index) in opts" :key="index" @click="jumpUrl(part.url)">
|
|
<image :src="part.src" mode="" style="width: 58px; height: 58px;"></image>
|
|
<span>{{ part.name }}</span>
|
|
</view>
|
|
</view>
|
|
<view class="swipe-area">
|
|
<swiper class="swiper-box" autoplay interval="3000" indicator-dots="true">
|
|
<swiper-item v-for="(item, index) in imgList" :key="index">
|
|
<image :src="item.image" alt="" style="width: 100%; height: 100%" />
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<uni-notice-bar
|
|
show-icon
|
|
scrollable
|
|
color="#808080"
|
|
background-color="transparent"
|
|
:text="text"
|
|
@click="handleMsg"
|
|
/>
|
|
<view class="my-task">
|
|
<h3 style="margin-bottom: 1vh">我的任务</h3>
|
|
<div class="task-list">
|
|
<div class="list-item" v-for="(item, index) in taskList" :key="index" @click="toggleDetail(item.id)">
|
|
<div class="item-title">{{ item.name }}</div>
|
|
<div>{{ item.userName }}</div>
|
|
<div>{{ item.validityDate }}</div>
|
|
<div class="item-progress">
|
|
<u-line-progress
|
|
:percentage="Number(item.trainPercentage)"
|
|
:showText="false"
|
|
height="8"
|
|
activeColor="#579AF8"
|
|
/>
|
|
<div>{{ item.trainPercentage || 0 }}%</div>
|
|
</div>
|
|
</div>
|
|
<view class="no-task" v-show="!taskList || taskList.length === 0">
|
|
<view class="no-task-img">
|
|
<image src="/static/eduImg/no-task.png" style="width: 179px; height: 94px;"></image>
|
|
<span>可联系管理员发布</span>
|
|
</view>
|
|
</view>
|
|
</div>
|
|
</view>
|
|
<m-tabbar fixed fill :current="0" :tabbar="tabbar"></m-tabbar>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import TabbarConfig from '@/tabbar.js'
|
|
// import face from '../../../uni_modules/mcc-face/index'
|
|
import { getNoticeAnnoByUserId, getStudentStudyWorkList } from '@/api/eduApp'
|
|
import config from '@/config'
|
|
export default {
|
|
data() {
|
|
return {
|
|
userId: uni.getStorageSync('userId'),
|
|
tabbar: TabbarConfig,
|
|
keyword: '',
|
|
opts: [
|
|
{ name: '学习项目', src: '/static/eduImg/learnProj.png', url: 'learnProj' },
|
|
// { name: '学习', src: '/static/eduImg/learn.png', url: 'learn' },
|
|
{ name: '考试', src: '/static/eduImg/exam.png', url: 'exam' },
|
|
{ name: '练习', src: '/static/eduImg/prac.png', url: 'prac' }
|
|
],
|
|
imgList: [
|
|
{
|
|
image: require('../../../static/images/swiper1.png'),
|
|
title: '1'
|
|
},
|
|
{
|
|
image: require('../../../static/images/swiper2.png'),
|
|
title: '2'
|
|
},
|
|
{
|
|
image: require('../../../static/images/swiper3.png'),
|
|
title: '3'
|
|
},
|
|
{
|
|
image: require('../../../static/images/swiper4.png'),
|
|
title: '4'
|
|
}
|
|
],
|
|
taskList: [],
|
|
text: '暂无公告'
|
|
}
|
|
},
|
|
onLoad() {
|
|
console.log('🚀 ~ mounted ~ mounted-index:')
|
|
this.getList()
|
|
this.getMsgList()
|
|
setTimeout(() => {
|
|
this.$verificationToken()
|
|
}, 1000)
|
|
},
|
|
methods: {
|
|
getList() {
|
|
this.taskList = []
|
|
let params = {
|
|
userId: this.userId,
|
|
status: '0'
|
|
}
|
|
// const res = await getStudentStudyWorkList(params)
|
|
// console.log('🚀 ~ getList ~ res:', res)
|
|
// this.taskList = res.data
|
|
console.log('🚀 ~ toggleSearch ~ params:', params)
|
|
this.$verificationToken()
|
|
uni.request({
|
|
url: config.baseUrl + '/exam-student/personalCenter/getStudentStudyWorkList',
|
|
method: 'post',
|
|
header: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
Authorization: uni.getStorageSync('access_token')
|
|
},
|
|
data: params,
|
|
success: res => {
|
|
console.log('🚀 ~ getList ~ res:', res)
|
|
res = res.data
|
|
this.taskList = res.data
|
|
}
|
|
})
|
|
},
|
|
// 搜索
|
|
async toggleSearch() {
|
|
this.taskList = []
|
|
console.log('开始搜索', this.keyword)
|
|
let params = {
|
|
userId: this.userId,
|
|
status: '0',
|
|
name: this.keyword
|
|
}
|
|
// const res = await getStudentStudyWorkList(params)
|
|
// this.taskList = res.data
|
|
this.$verificationToken()
|
|
uni.request({
|
|
url: config.baseUrl + '/exam-student/personalCenter/getStudentStudyWorkList',
|
|
method: 'post',
|
|
header: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
Authorization: uni.getStorageSync('access_token')
|
|
},
|
|
data: params,
|
|
success: res => {
|
|
console.log('🚀 ~ getList ~ res:', res)
|
|
res = res.data
|
|
this.taskList = res.data
|
|
}
|
|
})
|
|
},
|
|
// 获取消息列表
|
|
getMsgList() {
|
|
this.$verificationToken()
|
|
uni.request({
|
|
url: config.bmwUrl + '/studentUsers/getNoticeList',
|
|
method: 'post',
|
|
data: {},
|
|
header: {
|
|
Authorization: uni.getStorageSync('access_token')
|
|
},
|
|
success: res => {
|
|
console.log('🚀 ~ getMsgList ~ res:', res.data)
|
|
if (res.data.length > 0) {
|
|
this.text = res.data[0].noticeName
|
|
console.log('🚀 ~ getMsgList ~ this.text:', this.text)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 点击消息
|
|
handleMsg() {
|
|
console.log('🚀 ~ handleMsg ~ handleMsg:')
|
|
uni.navigateTo({
|
|
url: '/pages/YNEduApp/index/notices'
|
|
})
|
|
},
|
|
toggleScan() {
|
|
uni.scanCode({
|
|
success: res => {
|
|
console.log(res.result)
|
|
}
|
|
})
|
|
},
|
|
jumpUrl(path) {
|
|
uni.navigateTo({
|
|
url: `/pages/YNEduApp/${path}/${path}`
|
|
})
|
|
},
|
|
openFaceScan() {
|
|
face.open(['a', 'c'], function (e) {
|
|
face.close()
|
|
})
|
|
},
|
|
toggleDetail(id) {
|
|
uni.navigateTo({
|
|
url: `/pages/YNEduApp/learnProj/learnProjDetail?id=${id}`
|
|
})
|
|
},
|
|
// 返回
|
|
leftClick() {
|
|
console.log('返回')
|
|
// 退出登录
|
|
uni.removeStorageSync('access_token')
|
|
uni.removeStorageSync('userId')
|
|
uni.removeStorageSync('userName')
|
|
uni.removeStorageSync('className')
|
|
uni.removeStorageSync('facePath')
|
|
uni.reLaunch({
|
|
url: '/pages/gzt/index'
|
|
})
|
|
}
|
|
},
|
|
onShow() {
|
|
/* getNoticeAnnoByUserId({
|
|
status: 0
|
|
}).then(res => {
|
|
console.log(res)
|
|
}).catch(err => {
|
|
console.log(err)
|
|
}) */
|
|
/*uni.showModal({
|
|
title: '人脸识别',
|
|
content: '开启人脸识别？',
|
|
success:(res) => {
|
|
if(res.confirm) this.openFaceScan()
|
|
}
|
|
})*/
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.page {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: #f8f8f8;
|
|
box-sizing: border-box;
|
|
padding: 0 20px;
|
|
|
|
.search {
|
|
width: 100%;
|
|
margin: 10px auto 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.opt-grids {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin: 3vh auto;
|
|
|
|
view {
|
|
width: 25%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
//margin-bottom: 2vh;
|
|
|
|
image {
|
|
width: 60%;
|
|
height: 7vh;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
span {
|
|
font-size: 26rpx;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
}
|
|
|
|
.swipe-area {
|
|
width: 100%;
|
|
height: 20vh;
|
|
border-radius: 15rpx;
|
|
overflow: hidden;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.my-task {
|
|
width: 100%;
|
|
height: 40vh;
|
|
background-color: #fff;
|
|
border-radius: 15rpx;
|
|
box-shadow: 3px 3px 3px #f4f4f4;
|
|
box-sizing: border-box;
|
|
padding: 15rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.task-list {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
|
|
.list-item {
|
|
margin: 10px 0;
|
|
background-color: #f8f8f8;
|
|
border-radius: 5px;
|
|
padding: 5px;
|
|
font-size: 13px;
|
|
.item-title {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin-bottom: 5px;
|
|
}
|
|
.item-progress {
|
|
display: flex;
|
|
align-items: center;
|
|
.u-line-progress {
|
|
width: 80%;
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.no-task {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
|
|
.no-task-img {
|
|
width: 80%;
|
|
height: 80%;
|
|
margin: auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 90%;
|
|
}
|
|
|
|
span {
|
|
font-size: 14px;
|
|
color: #c2c2c2;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|