7 changed files with 1009 additions and 706 deletions
@ -1,379 +1,303 @@ |
|||
<!--我的-首页--> |
|||
<template> |
|||
<view style="background-color: #00be8c;width: 100%;height: 100%;"> |
|||
<view style="width: 100%;height: 160rpx;"> |
|||
<view class="middles_top" v-if="list.headimg"> |
|||
<image class="middles_top_1" :src="list.headimg"></image> |
|||
<view class="main_box"> |
|||
<view style="background:#29D3B4;"> |
|||
<!--用户信息--> |
|||
<view class="user_section"> |
|||
<view class="box"> |
|||
<view class="left"> |
|||
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
<view class="name">包子皮</view> |
|||
</view> |
|||
<view class="middles_top" v-else> |
|||
<image class="middles_top_1" src="/static/images/home/tixing.png"></image> |
|||
<view class="right"> |
|||
<image src="@/static/images/index/setup.png" style="width: 50rpx;height: 50rpx;"></image> |
|||
</view> |
|||
<view class="middles_top1" @click="showActionSheet(1)"> |
|||
<view class="middles_top1_1"> |
|||
昵称:{{username}} |
|||
</view> |
|||
</view> |
|||
<fui-actionsheet :show="show" :tips="tips" :itemList="itemList" :isCancel="isCancel" :theme="theme" |
|||
@click="itemClick" @cancel="cancel"></fui-actionsheet> |
|||
</view> |
|||
<view class="Topping" v-if="drug" @click="editreminder"> |
|||
<view class="Topping_1">置顶提醒:{{drug}}</view> |
|||
<view class="Topping_2" style="position: relative;left: 85%;top: -95%;"> |
|||
<fui-icon name="arrowright" :size="60"></fui-icon> |
|||
</view> |
|||
</view> |
|||
<view class="Topping" v-else> |
|||
<view class="Topping_1">置顶提醒:{{drug}}</view> |
|||
<view class="Topping_2" style="position: relative;left: 85%;top: -95%;"> |
|||
<fui-icon name="arrowright" :size="60"></fui-icon> |
|||
</view> |
|||
</view> |
|||
<view class="Medication"> |
|||
<fui-row margin-bottom="24rpx"> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
用药数量 <br> {{pharmacy}} |
|||
</view> |
|||
</view> |
|||
|
|||
<!--统计信息--> |
|||
<view class="count_section"> |
|||
<view class="main"> |
|||
<view class="course_box"> |
|||
<view class="top"> |
|||
<view class="item"> |
|||
<view class="num">1234</view> |
|||
<view class="intro">总授课数/节</view> |
|||
</view> |
|||
</fui-col> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
提醒 <br> {{remind}} |
|||
<view class="item"> |
|||
<view class="num">4</view> |
|||
<view class="intro">总授班级/个</view> |
|||
</view> |
|||
<view class="item"> |
|||
<view class="num">1234</view> |
|||
<view class="intro">总负责学员/名 |
|||
</view> |
|||
</view> |
|||
</fui-col> |
|||
<!-- <fui-col :span="6"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
参与活动 <br> {{activity}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</fui-col> --> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
作品数量 <br> {{works}} |
|||
<view class="bottom"></view> |
|||
<view class="bg_box bg_top"></view> |
|||
<view class="bg_box bg_bottom"></view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<view class="main_section"> |
|||
<view class="section_box"> |
|||
<view class="item" style="border-radius: 16rpx 16rpx 0 0;"> |
|||
<view>课时消耗</view> |
|||
</view> |
|||
</fui-col> |
|||
</fui-row> |
|||
|
|||
<view class="item"> |
|||
<view>我的成员</view> |
|||
<view></view> |
|||
</view> |
|||
<view class="below"> |
|||
<view style="height: 17rpx;width: 100%;"></view> |
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="collect"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="home"></fui-icon> |
|||
<text class="below_text">我的收藏</text> |
|||
|
|||
<view class="item"> |
|||
<view>我的合同</view> |
|||
<view></view> |
|||
</view> |
|||
</fui-list-cell> |
|||
<!-- <fui-list-cell :bottomBorder="false" arrow :highlight="false"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="message"></fui-icon> |
|||
<text class="below_text">参与的活动</text> |
|||
</view> |
|||
</fui-list-cell> --> |
|||
|
|||
<button open-type="share" style="padding: 0rpx;"> |
|||
<fui-list-cell :bottomBorder="false" arrow :padding="['-45rpx', '30rpx']"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="principal"></fui-icon> |
|||
<text class="below_text">邀请好友</text> |
|||
<view class="section_box"> |
|||
<view class="item"> |
|||
<view>我的教练</view> |
|||
<view></view> |
|||
</view> |
|||
</fui-list-cell> |
|||
</button> |
|||
|
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="help"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="link"></fui-icon> |
|||
<text class="below_text">帮助中心</text> |
|||
<view class="item"> |
|||
<view>负责人</view> |
|||
<view></view> |
|||
</view> |
|||
<view class="item"> |
|||
<view>意见反馈</view> |
|||
<view></view> |
|||
</view> |
|||
</fui-list-cell> |
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="personal"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="setup"></fui-icon> |
|||
<text class="below_text">设置</text> |
|||
</view> |
|||
</fui-list-cell> |
|||
<view style="height: 27rpx;width: 100%;"></view> |
|||
</view> |
|||
|
|||
<AQTabber/> |
|||
<!-- 底部导航--> |
|||
<AQTabber /> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import AQTabber from "@/components/AQ/AQTabber.vue" |
|||
|
|||
import user1 from '@/api/user.js'; |
|||
import medication from '@/api/medication.js'; |
|||
import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue" |
|||
import fuiRow from "@/components/firstui/fui-row/fui-row.vue" |
|||
import fuiCol from "@/components/firstui/fui-col/fui-col.vue" |
|||
import fuiList from "@/components/firstui/fui-list/fui-list.vue" |
|||
import fuiListCell from "@/components/firstui/fui-list-cell/fui-list-cell.vue" |
|||
import fuiActionsheet from "@/components/firstui/fui-actionsheet/fui-actionsheet.vue" |
|||
import user from '@/api/user.js'; |
|||
import AQTabber from "@/components/AQ/AQTabber.vue" |
|||
|
|||
|
|||
export default { |
|||
components: { |
|||
fuiIcon, |
|||
fuiRow, |
|||
fuiCol, |
|||
fuiList, |
|||
fuiListCell, |
|||
fuiActionsheet, |
|||
AQTabber, |
|||
}, |
|||
data() { |
|||
return { |
|||
username: '', |
|||
show: false, |
|||
tips: '', |
|||
itemList: [], |
|||
isCancel: true, |
|||
theme: 'light', |
|||
drug: '', |
|||
uptodatedata: [], |
|||
pharmacy: 0, |
|||
remind: 0, |
|||
activity: 0, |
|||
works: 0, |
|||
list:[], |
|||
shareimage: '', |
|||
sharename: '' |
|||
} |
|||
}, |
|||
onLoad() { |
|||
const um_id = uni.getStorageSync('um_id'); |
|||
this.um_id = um_id |
|||
if (um_id == '') { |
|||
uni.navigateTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
} |
|||
const user = uni.getStorageSync('user'); |
|||
this.username = user.user |
|||
this.fetchData(this.um_id) |
|||
|
|||
medication.shareimage().then(res => { |
|||
if(res.status == "200"){ |
|||
console.log(res) |
|||
this.shareimage = res.data |
|||
this.sharename = res.token |
|||
} |
|||
}); |
|||
}, |
|||
onShareAppMessage(e) { |
|||
medication.shareimage().then(res => { |
|||
if(res.status == "200"){ |
|||
console.log(res) |
|||
this.shareimage = res.data |
|||
this.sharename = res.token |
|||
} |
|||
}); |
|||
return { |
|||
title: this.sharename, |
|||
path: '/page/my/my', |
|||
imageUrl: this.shareimage |
|||
formData: {}, |
|||
tabType: '1', //1=班级成员,2=作业任务 |
|||
Atype: 1, //1=作业完成,2=作业未提交 |
|||
} |
|||
}, |
|||
onLoad() {}, |
|||
methods: { |
|||
fetchData(um_id) { |
|||
medication.getuptodate({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.drug = res.data.drug |
|||
this.uptodatedata = res.data |
|||
} else { |
|||
uni.showToast({ |
|||
title: res.msg, |
|||
icon: 'none' |
|||
}) |
|||
} |
|||
}); |
|||
user1.getuserinfo({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.list = res.data |
|||
} else { |
|||
uni.showToast({ |
|||
title: res.msg, |
|||
icon: 'none' |
|||
}) |
|||
} |
|||
}); |
|||
user1.mycount({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.pharmacy = res.data.pharmacy |
|||
this.remind = res.data.remind |
|||
this.activity = res.data.activity |
|||
this.works = res.data.works |
|||
} |
|||
}); |
|||
}, |
|||
onPullDownRefresh(){ |
|||
this.fetchData(this.um_id) |
|||
//切换tab |
|||
tabChange(tabType) { |
|||
this.tabType = tabType |
|||
}, |
|||
showActionSheet(type) { |
|||
this.tips = ''; |
|||
this.isCancel = true; |
|||
this.theme = 'light'; |
|||
switch (type) { |
|||
case 1: |
|||
this.tips = '退出后不会删除任何历史数据,下次登录依然可以使用本账号。'; |
|||
this.itemList = [{ |
|||
|
|||
text: '退出登录', |
|||
color: '#FF2B2B' |
|||
}] |
|||
break; |
|||
default: |
|||
break; |
|||
} |
|||
setTimeout(() => { |
|||
this.show = true |
|||
}, 50) |
|||
}, |
|||
itemClick(e) { |
|||
// this.fui.toast(e.text) |
|||
uni.removeStorageSync('user'); |
|||
uni.removeStorageSync('um_id'); |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
this.cancel() |
|||
}, |
|||
cancel() { |
|||
this.show = false |
|||
}, |
|||
editreminder() { |
|||
uni.setStorageSync('uptodatedata', this.uptodatedata); |
|||
|
|||
//打开课程详情 |
|||
openViewCourseInfo(item) { |
|||
uni.navigateTo({ |
|||
url: '/pages/remind/edit' |
|||
url: '/pages/coach/course/info' |
|||
}) |
|||
}, |
|||
collect() { |
|||
//打开学员详情页 |
|||
openViewStudentInfo(item) { |
|||
uni.navigateTo({ |
|||
url: '/pages/my/collect' |
|||
url: '/pages/coach/student/info' |
|||
}) |
|||
}, |
|||
help() { |
|||
|
|||
//打开体测报告 |
|||
openViewPhysicalExamination(item) { |
|||
uni.navigateTo({ |
|||
url: '/pages/my/help' |
|||
url: '/pages/coach/student/physical_examination' |
|||
}) |
|||
}, |
|||
personal(){ |
|||
|
|||
//打开作业任务 |
|||
opebViewWorkDetails(item) { |
|||
uni.navigateTo({ |
|||
url: '/pages/my/personal' |
|||
url: '/pages/coach/student/work_details' |
|||
}) |
|||
} |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.fui-list__cell-background{ |
|||
height: 80rpx !important; |
|||
<style lang="less" scoped> |
|||
.main_box { |
|||
background: #292929; |
|||
min-height: 28vh; |
|||
} |
|||
|
|||
.below_text { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
margin-left: 30rpx; |
|||
color: #333333; |
|||
//自定义导航栏 |
|||
.navbar_section { |
|||
border: 1px solid #29D3B4; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
background: #29D3B4; |
|||
|
|||
.title { |
|||
padding: 20rpx 0; |
|||
font-size: 30rpx; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.below { |
|||
width: 95%; |
|||
// height: 780rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin: auto; |
|||
//用户信息 |
|||
.user_section { |
|||
background-color: #29D3B4; |
|||
padding-top: 58rpx; |
|||
padding-bottom: 42rpx; |
|||
color: #fff; |
|||
font-size: 28rpx; |
|||
|
|||
.box { |
|||
padding-left: 19rpx; |
|||
padding-right: 29rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
gap: 15rpx; |
|||
|
|||
.left { |
|||
display: flex; |
|||
align-items: center; |
|||
gap: 20rpx; |
|||
|
|||
.pic { |
|||
width: 144rpx; |
|||
height: 144rpx; |
|||
border-radius: 50%; |
|||
} |
|||
|
|||
.fui-section__title { |
|||
margin-left: 32rpx; |
|||
.name { |
|||
font-size: 28rpx; |
|||
} |
|||
} |
|||
|
|||
.fui-col__item { |
|||
// height: 230rpx; |
|||
border-radius: 16rpx; |
|||
.right { |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 20rpx; |
|||
|
|||
.btn { |
|||
min-height: 28rpx; |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
// line-height: 230rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
//统计信息 |
|||
.count_section { |
|||
position: relative; |
|||
|
|||
.main { |
|||
position: relative; |
|||
z-index: 2; |
|||
padding: 0rpx 24rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
|
|||
.course_box { |
|||
padding: 42rpx 28rpx; |
|||
width: 692rpx; |
|||
border-radius: 20rpx; |
|||
background-color: #fff; |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 32rpx; |
|||
|
|||
.top { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
|
|||
.fui-color__black { |
|||
background-color: #333333; |
|||
.item { |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
gap: 12rpx; |
|||
|
|||
.num { |
|||
color: #29D3B4; |
|||
font-size: 56rpx; |
|||
} |
|||
|
|||
.fui-color__yellow { |
|||
background-color: #FFB703; |
|||
.intro { |
|||
color: #AAAAAA; |
|||
font-size: 24rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.Medication { |
|||
width: 95%; |
|||
height: 200rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin: 0 auto 20rpx; |
|||
.bg_box { |
|||
z-index: 1; |
|||
width: 100%; |
|||
height: 150rpx; |
|||
} |
|||
|
|||
.middles_top { |
|||
display: inline-block; |
|||
.bg_top { |
|||
position: absolute; |
|||
top: 0; |
|||
background-color: #29D3B4; |
|||
} |
|||
|
|||
.middles_top1 { |
|||
display: inline-block; |
|||
width: 70%; |
|||
height: 100rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin-left: 30rpx; |
|||
position: relative; |
|||
top: -22%; |
|||
font-size: 35rpx; |
|||
text-align: center; |
|||
line-height: 100rpx; |
|||
.bg_bottom { |
|||
top: 50%; |
|||
position: absolute; |
|||
background-color: #292929; |
|||
} |
|||
} |
|||
|
|||
.middles_top_1 { |
|||
width: 120rpx; |
|||
height: 120rpx; |
|||
border-radius: 100rpx; |
|||
margin: 30rpx 0 0 30rpx; |
|||
.main_section { |
|||
margin-top: 20rpx; |
|||
background: #292929 100%; |
|||
padding: 0 24rpx; |
|||
padding-top: 40rpx; |
|||
padding-bottom: 150rpx; |
|||
font-size: 24rpx; |
|||
color: #333333; |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 22rpx; |
|||
|
|||
.section_box { |
|||
margin-bottom: 10rpx; |
|||
background: #fff; |
|||
border-radius: 16rpx; |
|||
padding: 6rpx 24rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
.item { |
|||
padding: 35rpx 78rpx; |
|||
border-top: 1px solid #F2F2F2; |
|||
font-size: 28rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.Topping { |
|||
margin: 20rpx auto; |
|||
width: 95%; |
|||
height: 130rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
font-size: 35rpx; |
|||
text-align: left; |
|||
padding-left: 30rpx; |
|||
line-height: 130rpx; |
|||
.item:nth-child(1) { |
|||
border-top: 0; |
|||
} |
|||
|
|||
.fui-list__icon { |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
margin-right: 24rpx; |
|||
|
|||
} |
|||
|
|||
.fui-section__title1 { |
|||
margin-left: 32rpx; |
|||
} |
|||
</style> |
|||
@ -1,374 +0,0 @@ |
|||
<template> |
|||
<view style="background-color: #00be8c;width: 100%;height: 100%;"> |
|||
<view style="width: 100%;height: 160rpx;"> |
|||
<view class="middles_top" v-if="list.headimg"> |
|||
<image class="middles_top_1" :src="list.headimg"></image> |
|||
</view> |
|||
<view class="middles_top" v-else> |
|||
<image class="middles_top_1" src="/static/images/home/tixing.png"></image> |
|||
</view> |
|||
<view class="middles_top1" @click="showActionSheet(1)"> |
|||
<view class="middles_top1_1"> |
|||
昵称:{{username}} |
|||
</view> |
|||
</view> |
|||
<fui-actionsheet :show="show" :tips="tips" :itemList="itemList" :isCancel="isCancel" :theme="theme" |
|||
@click="itemClick" @cancel="cancel"></fui-actionsheet> |
|||
</view> |
|||
<view class="Topping" v-if="drug" @click="editreminder"> |
|||
<view class="Topping_1">置顶提醒:{{drug}}</view> |
|||
<view class="Topping_2" style="position: relative;left: 85%;top: -95%;"> |
|||
<fui-icon name="arrowright" :size="60"></fui-icon> |
|||
</view> |
|||
</view> |
|||
<view class="Topping" v-else> |
|||
<view class="Topping_1">置顶提醒:{{drug}}</view> |
|||
<view class="Topping_2" style="position: relative;left: 85%;top: -95%;"> |
|||
<fui-icon name="arrowright" :size="60"></fui-icon> |
|||
</view> |
|||
</view> |
|||
<view class="Medication"> |
|||
<fui-row margin-bottom="24rpx"> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
用药数量 <br> {{pharmacy}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</fui-col> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
提醒 <br> {{remind}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</fui-col> |
|||
<!-- <fui-col :span="6"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;border-right: 1px #d4d4d4 solid;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
参与活动 <br> {{activity}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</fui-col> --> |
|||
<fui-col :span="8"> |
|||
<view class="fui-col__item"> |
|||
<view style="margin-top: 40rpx;height: 120rpx;"> |
|||
<view style="padding-top: 20rpx;"> |
|||
作品数量 <br> {{works}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</fui-col> |
|||
</fui-row> |
|||
</view> |
|||
<view class="below"> |
|||
<view style="height: 17rpx;width: 100%;"></view> |
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="collect"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="home"></fui-icon> |
|||
<text class="below_text">我的收藏</text> |
|||
</view> |
|||
</fui-list-cell> |
|||
<!-- <fui-list-cell :bottomBorder="false" arrow :highlight="false"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="message"></fui-icon> |
|||
<text class="below_text">参与的活动</text> |
|||
</view> |
|||
</fui-list-cell> --> |
|||
|
|||
<button open-type="share" style="padding: 0rpx;"> |
|||
<fui-list-cell :bottomBorder="false" arrow :padding="['-45rpx', '30rpx']"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="principal"></fui-icon> |
|||
<text class="below_text">邀请好友</text> |
|||
</view> |
|||
</fui-list-cell> |
|||
</button> |
|||
|
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="help"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="link"></fui-icon> |
|||
<text class="below_text">帮助中心</text> |
|||
</view> |
|||
</fui-list-cell> |
|||
<fui-list-cell :bottomBorder="false" arrow :highlight="false" @click="personal"> |
|||
<view class="fui-align__center"> |
|||
<fui-icon name="setup"></fui-icon> |
|||
<text class="below_text">设置</text> |
|||
</view> |
|||
</fui-list-cell> |
|||
<view style="height: 27rpx;width: 100%;"></view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import user1 from '@/api/user.js'; |
|||
import medication from '@/api/medication.js'; |
|||
import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue" |
|||
import fuiRow from "@/components/firstui/fui-row/fui-row.vue" |
|||
import fuiCol from "@/components/firstui/fui-col/fui-col.vue" |
|||
import fuiList from "@/components/firstui/fui-list/fui-list.vue" |
|||
import fuiListCell from "@/components/firstui/fui-list-cell/fui-list-cell.vue" |
|||
import fuiActionsheet from "@/components/firstui/fui-actionsheet/fui-actionsheet.vue" |
|||
export default { |
|||
components: { |
|||
fuiIcon, |
|||
fuiRow, |
|||
fuiCol, |
|||
fuiList, |
|||
fuiListCell, |
|||
fuiActionsheet |
|||
}, |
|||
data() { |
|||
return { |
|||
username: '', |
|||
show: false, |
|||
tips: '', |
|||
itemList: [], |
|||
isCancel: true, |
|||
theme: 'light', |
|||
drug: '', |
|||
uptodatedata: [], |
|||
pharmacy: 0, |
|||
remind: 0, |
|||
activity: 0, |
|||
works: 0, |
|||
list:[], |
|||
shareimage: '', |
|||
sharename: '' |
|||
} |
|||
}, |
|||
onLoad() { |
|||
const um_id = uni.getStorageSync('um_id'); |
|||
this.um_id = um_id |
|||
if (um_id == '') { |
|||
uni.navigateTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
} |
|||
const user = uni.getStorageSync('user'); |
|||
this.username = user.user |
|||
this.fetchData(this.um_id) |
|||
|
|||
medication.shareimage().then(res => { |
|||
if(res.status == "200"){ |
|||
console.log(res) |
|||
this.shareimage = res.data |
|||
this.sharename = res.token |
|||
} |
|||
}); |
|||
}, |
|||
onShareAppMessage(e) { |
|||
medication.shareimage().then(res => { |
|||
if(res.status == "200"){ |
|||
console.log(res) |
|||
this.shareimage = res.data |
|||
this.sharename = res.token |
|||
} |
|||
}); |
|||
return { |
|||
title: this.sharename, |
|||
path: '/page/my/my', |
|||
imageUrl: this.shareimage |
|||
} |
|||
}, |
|||
methods: { |
|||
fetchData(um_id) { |
|||
medication.getuptodate({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.drug = res.data.drug |
|||
this.uptodatedata = res.data |
|||
} else { |
|||
uni.showToast({ |
|||
title: res.msg, |
|||
icon: 'none' |
|||
}) |
|||
} |
|||
}); |
|||
user1.getuserinfo({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.list = res.data |
|||
} else { |
|||
uni.showToast({ |
|||
title: res.msg, |
|||
icon: 'none' |
|||
}) |
|||
} |
|||
}); |
|||
user1.mycount({ |
|||
um_id: um_id |
|||
}).then(res => { |
|||
if (res.status == 200) { |
|||
this.pharmacy = res.data.pharmacy |
|||
this.remind = res.data.remind |
|||
this.activity = res.data.activity |
|||
this.works = res.data.works |
|||
} |
|||
}); |
|||
}, |
|||
onPullDownRefresh(){ |
|||
this.fetchData(this.um_id) |
|||
}, |
|||
showActionSheet(type) { |
|||
this.tips = ''; |
|||
this.isCancel = true; |
|||
this.theme = 'light'; |
|||
switch (type) { |
|||
case 1: |
|||
this.tips = '退出后不会删除任何历史数据,下次登录依然可以使用本账号。'; |
|||
this.itemList = [{ |
|||
|
|||
text: '退出登录', |
|||
color: '#FF2B2B' |
|||
}] |
|||
break; |
|||
default: |
|||
break; |
|||
} |
|||
setTimeout(() => { |
|||
this.show = true |
|||
}, 50) |
|||
}, |
|||
itemClick(e) { |
|||
// this.fui.toast(e.text) |
|||
uni.removeStorageSync('user'); |
|||
uni.removeStorageSync('um_id'); |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
this.cancel() |
|||
}, |
|||
cancel() { |
|||
this.show = false |
|||
}, |
|||
editreminder() { |
|||
uni.setStorageSync('uptodatedata', this.uptodatedata); |
|||
uni.navigateTo({ |
|||
url: '/pages/remind/edit' |
|||
}) |
|||
}, |
|||
collect() { |
|||
uni.navigateTo({ |
|||
url: '/pages/my/collect' |
|||
}) |
|||
}, |
|||
help() { |
|||
uni.navigateTo({ |
|||
url: '/pages/my/help' |
|||
}) |
|||
}, |
|||
personal(){ |
|||
uni.navigateTo({ |
|||
url: '/pages/my/personal' |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.fui-list__cell-background{ |
|||
height: 80rpx !important; |
|||
} |
|||
|
|||
.below_text { |
|||
font-size: 35rpx; |
|||
font-weight: bold; |
|||
margin-left: 30rpx; |
|||
color: #333333; |
|||
} |
|||
|
|||
.below { |
|||
width: 95%; |
|||
// height: 780rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin: auto; |
|||
} |
|||
|
|||
.fui-section__title { |
|||
margin-left: 32rpx; |
|||
} |
|||
|
|||
.fui-col__item { |
|||
// height: 230rpx; |
|||
border-radius: 16rpx; |
|||
font-size: 28rpx; |
|||
text-align: center; |
|||
// line-height: 230rpx; |
|||
} |
|||
|
|||
.fui-color__black { |
|||
background-color: #333333; |
|||
} |
|||
|
|||
.fui-color__yellow { |
|||
background-color: #FFB703; |
|||
} |
|||
|
|||
.Medication { |
|||
width: 95%; |
|||
height: 200rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin: 0 auto 20rpx; |
|||
} |
|||
|
|||
.middles_top { |
|||
display: inline-block; |
|||
} |
|||
|
|||
.middles_top1 { |
|||
display: inline-block; |
|||
width: 70%; |
|||
height: 100rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
margin-left: 30rpx; |
|||
position: relative; |
|||
top: -22%; |
|||
font-size: 35rpx; |
|||
text-align: center; |
|||
line-height: 100rpx; |
|||
} |
|||
|
|||
.middles_top_1 { |
|||
width: 120rpx; |
|||
height: 120rpx; |
|||
border-radius: 100rpx; |
|||
margin: 30rpx 0 0 30rpx; |
|||
} |
|||
|
|||
.Topping { |
|||
margin: 20rpx auto; |
|||
width: 95%; |
|||
height: 130rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
font-size: 35rpx; |
|||
text-align: left; |
|||
padding-left: 30rpx; |
|||
line-height: 130rpx; |
|||
} |
|||
|
|||
.fui-list__icon { |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
margin-right: 24rpx; |
|||
} |
|||
|
|||
.fui-section__title1 { |
|||
margin-left: 32rpx; |
|||
} |
|||
</style> |
|||
@ -1,22 +1,413 @@ |
|||
<!--课程-列表--> |
|||
<template> |
|||
<view> |
|||
<view class="main_box"> |
|||
<!--自定义导航栏--> |
|||
<view class="navbar_section"> |
|||
<view class="title">课表</view> |
|||
</view> |
|||
|
|||
<view class="main_section"> |
|||
<view class="section_1"> |
|||
<view class="ul"> |
|||
<view class="li"> |
|||
<text>周日</text> |
|||
<text>14</text> |
|||
<text></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周一</text> |
|||
<text>14</text> |
|||
<text></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周二</text> |
|||
<text>14</text> |
|||
<text></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周日</text> |
|||
<text class="today">今</text> |
|||
<text class=""></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周一</text> |
|||
<text>14</text> |
|||
<text class="select_plan"></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周二</text> |
|||
<text>14</text> |
|||
<text></text> |
|||
</view> |
|||
<view class="li"> |
|||
<text>周二</text> |
|||
<text>14</text> |
|||
<text></text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="section_2"> |
|||
<view class="item_box"> |
|||
XXX体育场馆 |
|||
</view> |
|||
<view class="item_box" style="text-align: right;color: #F59A23;" @click="more"> |
|||
更多 |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="section_3"> |
|||
<view class="ul"> |
|||
<view class="li" @click="openViewCourseInfo({id:1})"> |
|||
<view class="top_box"> |
|||
<view class="center_box"> |
|||
<view>班级:少年班</view> |
|||
<view>时间:2020-05-25 15:30 - 17:30</view> |
|||
<view>课室:302室 |
|||
</view> |
|||
<view>课程:篮球少儿课 |
|||
</view> |
|||
</view> |
|||
<view class="right_box"> |
|||
<view class="tag" style="background:#fad24e;">上课中</view> |
|||
<!-- <view class="tag" style="background:#1cd188;">待上课</view>--> |
|||
</view> |
|||
</view> |
|||
<view class="bottom_box"> |
|||
<view class="hint"> |
|||
已签到学生 (15/34) |
|||
</view> |
|||
<view class="list_box"> |
|||
<view class="list"> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
</view> |
|||
<view class="btn"> |
|||
详情 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="li" @click="openViewCourseInfo({id:2})"> |
|||
<view class="top_box"> |
|||
<view class="center_box"> |
|||
<view>班级:少年班</view> |
|||
<view>时间:2020-05-25 15:30 - 17:30</view> |
|||
<view>课室:302室 |
|||
</view> |
|||
<view>课程:篮球少儿课 |
|||
</view> |
|||
</view> |
|||
<view class="right_box"> |
|||
<view class="tag" style="background:#fad24e;">上课中</view> |
|||
<!-- <view class="tag" style="background:#1cd188;">待上课</view>--> |
|||
</view> |
|||
</view> |
|||
<view class="bottom_box"> |
|||
<view class="hint"> |
|||
已签到学生 (15/34) |
|||
</view> |
|||
<view class="list_box"> |
|||
<view class="list"> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
<view class="itme"> |
|||
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
|||
</view> |
|||
</view> |
|||
<view class="btn"> |
|||
详情 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 底部导航--> |
|||
<AQTabber/> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
import user from '@/api/user.js'; |
|||
import AQTabber from "@/components/AQ/AQTabber.vue" |
|||
|
|||
|
|||
export default { |
|||
components: { |
|||
AQTabber, |
|||
}, |
|||
data() { |
|||
return { |
|||
formData:{}, |
|||
|
|||
//课程下拉菜单相关 |
|||
show_course:false,//是否显示下拉菜单 |
|||
//课程下拉菜单 |
|||
course_name:'课程',//选中的下拉菜单名称 |
|||
options_course: [ |
|||
{ |
|||
text: '请选择课程', |
|||
value: '', |
|||
checked: true |
|||
}, { |
|||
text: '羽毛球课程1', |
|||
value: '1' |
|||
}, { |
|||
text: '篮球课程2', |
|||
value: '2' |
|||
} |
|||
], |
|||
|
|||
//课室下拉菜单相关 |
|||
show_classroom:false,//是否显示下拉菜单 |
|||
//课程下拉菜单 |
|||
classroom_name:'课室',//选中的下拉菜单名称 |
|||
options_classroom: [ |
|||
{ |
|||
text: '请选择课室', |
|||
value: '', |
|||
checked: true |
|||
}, { |
|||
text: '羽毛球201', |
|||
value: '1' |
|||
}, { |
|||
text: '篮球室101', |
|||
value: '2' |
|||
} |
|||
], |
|||
} |
|||
}, |
|||
onLoad() { |
|||
}, |
|||
methods: { |
|||
//选中课程下拉菜单点击事件 |
|||
clickCourse(e){ |
|||
console.log(e) |
|||
this.course_name = e.text |
|||
this.show_course = true |
|||
}, |
|||
//显示下拉菜单 |
|||
filterTapCourse() { |
|||
//显示下拉框 |
|||
this.$refs.ref_course.show() |
|||
this.show_course = true; |
|||
}, |
|||
|
|||
|
|||
|
|||
//选中课室 |
|||
clickClassroom(e){ |
|||
console.log(e) |
|||
this.classroom_name = e.text |
|||
this.show_classroom = true |
|||
}, |
|||
//显示课室下拉菜单 |
|||
filterTapClassroom() { |
|||
//显示下拉框 |
|||
this.$refs.ref_classroom.show() |
|||
this.show_classroom = true; |
|||
}, |
|||
|
|||
//打开课时详情页 |
|||
openViewCourseInfo(item){ |
|||
uni.navigateTo({ |
|||
url: '/pages/student/timetable/info' |
|||
}) |
|||
}, |
|||
//体育馆列表 |
|||
more(){ |
|||
uni.navigateTo({ |
|||
url: '/pages/student/timetable/list' |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
<style lang="less" scoped> |
|||
|
|||
.main_box{ |
|||
background: #292929 ; |
|||
} |
|||
|
|||
//自定义导航栏 |
|||
.navbar_section{ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
background: #292929; |
|||
.title{ |
|||
padding: 20rpx 0; |
|||
font-size: 30rpx; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.main_section{ |
|||
min-height: 100vh; |
|||
background: #292929 100%; |
|||
padding-top: 40rpx; |
|||
padding-bottom: 150rpx; |
|||
font-size: 24rpx; |
|||
color: #FFFFFF; |
|||
|
|||
.section_1{ |
|||
background: #333333 100%; |
|||
width: 100%; |
|||
padding: 30rpx 28rpx; |
|||
.ul{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
.li{ |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
gap: 10rpx; |
|||
text{ |
|||
font-size: 24rpx; |
|||
color: #FFFFFF; |
|||
text-align: center; |
|||
} |
|||
text:nth-child(2){ |
|||
width: 44rpx; |
|||
height: 44rpx; |
|||
} |
|||
text:nth-child(3){ |
|||
width: 8rpx; |
|||
height: 8rpx; |
|||
} |
|||
.today{ |
|||
border-radius: 50%; |
|||
background: #29D3B4; |
|||
text-align: center; |
|||
line-height: 42rpx; |
|||
} |
|||
.select_plan{ |
|||
background: #F59A23; |
|||
border-radius: 50%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.section_2{ |
|||
margin-top: 30rpx; |
|||
padding: 0 20rpx ; |
|||
color: #fff; |
|||
display: flex; |
|||
align-items: center; |
|||
gap: 20rpx; |
|||
.item_box { |
|||
width: 45%; |
|||
.fui-filter__item { |
|||
display: flex; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.section_3{ |
|||
margin-top: 36rpx; |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
.ul{ |
|||
padding: 0 26rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 30rpx; |
|||
.li{ |
|||
position: relative; |
|||
border-radius: 22rpx; |
|||
background: #434544 100%; |
|||
padding: 14rpx 0; |
|||
display: flex; |
|||
flex-direction: column; |
|||
.top_box{ |
|||
padding: 20rpx 30rpx; |
|||
.center_box{ |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 10rpx; |
|||
view{} |
|||
} |
|||
.right_box{ |
|||
.tag{ |
|||
position:absolute; |
|||
top: 0rpx; |
|||
right: 0rpx; |
|||
padding: 10rpx; |
|||
width: 102rpx; |
|||
text-align: center; |
|||
font-size: 24rpx; |
|||
border-bottom-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
} |
|||
} |
|||
} |
|||
.bottom_box{ |
|||
border-top: 1px dashed #F2F2F2; |
|||
padding: 26rpx 16rpx 0 26rpx; |
|||
.hint{ |
|||
color:#D7D7D7; |
|||
} |
|||
.list_box{ |
|||
margin-top: 22rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
.list{ |
|||
display: flex; |
|||
align-items: center; |
|||
gap: 14rpx; |
|||
.itme{ |
|||
image{ |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
border-radius: 50%; |
|||
} |
|||
} |
|||
} |
|||
.btn{ |
|||
border: 1px solid #FAD04D; |
|||
border-radius: 10rpx; |
|||
background: #434544; |
|||
color: #FAD04D; |
|||
width: 110rpx; |
|||
height: 60rpx; |
|||
line-height: 55rpx; |
|||
text-align: center; |
|||
font-size: 24rpx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
</style> |
|||
@ -0,0 +1,228 @@ |
|||
<!--课程-详情--> |
|||
<template> |
|||
<view class="main_box"> |
|||
<view class="main_section"> |
|||
<view class="section_1"> |
|||
<view class="title_box">青少儿篮球课</view> |
|||
<view class="ul"> |
|||
<view class="li"> |
|||
<view class="title">课程名称</view> |
|||
<view class="content">青少年篮球课</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">班级</view> |
|||
<view class="content">班级名称</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">上课时间</view> |
|||
<view class="content">2020.03.25 15:30-17:00</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">上课地址</view> |
|||
<view class="content">xxxx体育馆302室</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">课程名称</view> |
|||
<view class="content">青少年篮球课</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">教练</view> |
|||
<view class="content">包子皮</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">教练号码</view> |
|||
<view class="content">18888888888</view> |
|||
</view> |
|||
|
|||
<view class="li"> |
|||
<view class="title">扣除课时</view> |
|||
<view class="content">2个课时</view> |
|||
</view> |
|||
|
|||
<view class="state_box"> |
|||
<view>已上</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import user from '@/api/user.js'; |
|||
import AQTabber from "@/components/AQ/AQTabber.vue" |
|||
|
|||
|
|||
export default { |
|||
components: { |
|||
AQTabber, |
|||
}, |
|||
data() { |
|||
return { |
|||
formData:{}, |
|||
|
|||
//课程下拉菜单相关 |
|||
show_course:false,//是否显示下拉菜单 |
|||
//课程下拉菜单 |
|||
course_name:'课程',//选中的下拉菜单名称 |
|||
options_course: [ |
|||
{ |
|||
text: '请选择课程', |
|||
value: '', |
|||
checked: true |
|||
}, { |
|||
text: '羽毛球课程1', |
|||
value: '1' |
|||
}, { |
|||
text: '篮球课程2', |
|||
value: '2' |
|||
} |
|||
], |
|||
|
|||
//课室下拉菜单相关 |
|||
show_classroom:false,//是否显示下拉菜单 |
|||
//课程下拉菜单 |
|||
classroom_name:'课室',//选中的下拉菜单名称 |
|||
options_classroom: [ |
|||
{ |
|||
text: '请选择课室', |
|||
value: '', |
|||
checked: true |
|||
}, { |
|||
text: '羽毛球201', |
|||
value: '1' |
|||
}, { |
|||
text: '篮球室101', |
|||
value: '2' |
|||
} |
|||
], |
|||
} |
|||
}, |
|||
onLoad() { |
|||
}, |
|||
methods: { |
|||
//选中课程下拉菜单点击事件 |
|||
clickCourse(e){ |
|||
console.log(e) |
|||
this.course_name = e.text |
|||
this.show_course = true |
|||
}, |
|||
//显示下拉菜单 |
|||
filterTapCourse() { |
|||
//显示下拉框 |
|||
this.$refs.ref_course.show() |
|||
this.show_course = true; |
|||
}, |
|||
|
|||
|
|||
|
|||
//选中课室 |
|||
clickClassroom(e){ |
|||
console.log(e) |
|||
this.classroom_name = e.text |
|||
this.show_classroom = true |
|||
}, |
|||
//显示课室下拉菜单 |
|||
filterTapClassroom() { |
|||
//显示下拉框 |
|||
this.$refs.ref_classroom.show() |
|||
this.show_classroom = true; |
|||
}, |
|||
|
|||
//打开课时详情页 |
|||
openViewCourseInfo(item){ |
|||
uni.navigateTo({ |
|||
url: '/pages/coach/course/info' |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="less" > |
|||
|
|||
.main_box{ |
|||
background: #292929 ; |
|||
} |
|||
|
|||
//自定义导航栏 |
|||
.navbar_section{ |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
background: #292929; |
|||
.title{ |
|||
padding: 20rpx 0; |
|||
font-size: 30rpx; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.main_section{ |
|||
min-height: 100vh; |
|||
background: #292929 100%; |
|||
padding: 30rpx 24rpx; |
|||
padding-top: 40rpx; |
|||
padding-bottom: 150rpx; |
|||
font-size: 24rpx; |
|||
color: #FFFFFF; |
|||
|
|||
.section_1{ |
|||
border-radius: 22rpx; |
|||
padding: 20rpx 40rpx; |
|||
background: #333333 100%; |
|||
width: 100%; |
|||
.title_box{ |
|||
padding: 10rpx; |
|||
padding-left: 30rpx; |
|||
font-size: 32rpx; |
|||
} |
|||
.ul{ |
|||
padding: 40rpx 10rpx; |
|||
padding-bottom: 350rpx; |
|||
margin-top: 10rpx; |
|||
border-top: 1px solid #555555; |
|||
display: flex; |
|||
flex-direction: column; |
|||
gap: 40rpx; |
|||
|
|||
position: relative; |
|||
|
|||
.li{ |
|||
display: flex; |
|||
gap: 72rpx; |
|||
.title{ |
|||
width: 120rpx; |
|||
text-align: right; |
|||
} |
|||
.content{} |
|||
} |
|||
.state_box{ |
|||
position: absolute; |
|||
bottom: 50rpx; |
|||
right: 10rpx; |
|||
view{ |
|||
width: 154rpx; |
|||
height: 154rpx; |
|||
border-radius: 50%; |
|||
background-color: rgba(41,211,180,0.17); |
|||
color: rgba(41,211,180,1); |
|||
font-size: 26rpx; |
|||
text-align: center; |
|||
line-height: 150rpx; |
|||
transform: rotate(-35deg); /* 旋转 */ |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
|
|||
</style> |
|||
@ -0,0 +1,116 @@ |
|||
<!--课程-详情--> |
|||
<template> |
|||
<view class="main_box"> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
<view class="current-venue" v-if="true"> |
|||
当前场馆 |
|||
</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
<view class="main_section"> |
|||
<view class="title">XXX体育馆</view> |
|||
<view class="con">南山区科苑路15号科兴科学园</view> |
|||
<view class="con">距您1km</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import user from '@/api/user.js'; |
|||
import AQTabber from "@/components/AQ/AQTabber.vue" |
|||
|
|||
|
|||
export default { |
|||
components: { |
|||
AQTabber, |
|||
}, |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
}, |
|||
onLoad() {}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="less" scoped> |
|||
.main_box { |
|||
width: 100%; |
|||
height: 100vh; |
|||
overflow: auto; |
|||
background: #292929; |
|||
} |
|||
.main_section{ |
|||
width: 92%; |
|||
border-radius: 15rpx; |
|||
background-color: #404045; |
|||
margin: 20rpx auto; |
|||
padding: 40rpx 0 40rpx 80rpx; |
|||
color: #fff; |
|||
position: relative; |
|||
} |
|||
.title{ |
|||
font-size: 32rpx; |
|||
} |
|||
.con{ |
|||
color: #D7D7D7; |
|||
font-size: 26rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
.current-venue{ |
|||
border-radius: 8rpx; |
|||
border: 2rpx #F59A23 solid; |
|||
width: 120rpx; |
|||
text-align: center; |
|||
color: #F59A23; |
|||
position: absolute; |
|||
top: 10%; |
|||
right: 3%; |
|||
} |
|||
</style> |
|||
|
After Width: | Height: | Size: 546 B |
Loading…
Reference in new issue