Browse Source

refactor(coach/home): 重构教练首页

- 移除了大部分原有代码,包括模板、脚本和样式
- 添加了新的模板结构,分为三个部分
-优化了样式,使用了less和scoped属性
master
liutong 1 year ago
parent
commit
67d6b41b65
  1. 2
      pages.json
  2. 413
      pages/coach/home/index.vue
  3. 7
      pages/student/index/index.vue

2
pages.json

@ -57,7 +57,7 @@
"navigationBarBackgroundColor": "#fff", "navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle": "black" "navigationBarTextStyle": "black"
} }
}, }
], ],
"globalStyle": { "globalStyle": {

413
pages/coach/home/index.vue

@ -1,281 +1,148 @@
<template> <template>
<view> <view>
<view class="top"> <view class="section_1">
<view class="top_1">发现</view> <view class="text_box">
<view class="top_2" @click="publishing"><fui-icon name="plussign" size="80" fontWeight="Number"></fui-icon></view> <text>月授课数</text>
</view> <text>12</text>
<view style="position: relative;" class="middle" v-for="(item, index) in list" :key="index" v-if="list.length > 0"> <text>月负责学员</text>
<view class="middles"> <text>188</text>
<view class="middles_1" v-if="item.headimg"> <text></text>
<image class="middles_1_img" :src="item.headimg"></image> </view>
</view> </view>
<view class="middles_1" v-else> <view class="section_2"></view>
<image class="middles_1_img" src="/static/images/home/tixing.png"></image> <view class="section_3"></view>
</view> <view class="section_3"></view>
<view class="middles_2"> </view>
<view class="middles_info1">{{item.user}}</view>
<view class="middles_info2">{{item.timedifference}}</view>
</view>
</view>
<view class="shoucang" style="border: 5rpx #f8627f solid;color: #f8627f;" v-if="item.collections == 1" @click="collection(item.id,um_id)">收藏</view>
<view class="shoucang" style="border: 5rpx #ccc solid;" v-else @click="collection(item.id,um_id)">收藏</view>
<view @click="coninfo(item)" style="height: 300rpx;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;">
<view class="middles_con">
{{item.activity}}
</view>
<view class="middles_con" v-if="item.imagesnum!=0">
<view>
<view style="width: 32%;height: 200rpx;display: inline-block;margin:2rpx;" v-for="(item1, index) in item.images" :key="index">
<image :src="item1" style="width: 100%;height: 100%;"></image>
</view>
</view>
</view>
<view class="middles_con">
{{item.content}}
</view>
</view>
<view class="middles_con" style="font-size: 20rpx;color: #ccc;" @click="coninfo(item)">
点击内容查看详情
</view>
<view class="middles_bom">
<view class="middles_bom_1 middles_boms" v-if="item.area">{{item.area}}</view>
<view class="middles_bom_2 middles_boms">
<fui-icon name="fabulous-fill" color="#f8627f" size="45" @click="like(item.id,item.um_id)"></fui-icon>
{{item.likes}}
</view>
<view class="middles_bom_3 middles_boms" @click="Comment(item.id)">
<fui-icon name="comment-fill" color="#6281a6" size="45"></fui-icon>
{{item.comment}}
</view>
</view>
<view style="width: 100%;height: 20rpx;"></view>
</view>
<view class="empty" v-if="!list.length">
<view style="width: 200rpx;">
<img src="@/static/icon-img/kkry.png" alt="" style="width: 180rpx;height: 180rpx;">
<view style="font-size: 28rpx;font-weight: 800;color: #00be8c;">
还没有任何提醒
</view>
</view>
</view>
<view style="width: 100%;height: 20rpx;"></view>
</view>
</template> </template>
<script> <script>
import user from '@/api/user.js'; import user from '@/api/user.js';
import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue" import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue"
export default {
components:{ export default {
fuiIcon components: {
}, fuiIcon
data() { },
return { data() {
list:[], return {
likes:0, list: [],
type:1, likes: 0,
type1:1, type: 1,
activity_id:0, type1: 1,
um_id:0, activity_id: 0,
urls:'http://medication.zeyan.wang/' um_id: 0,
} urls: 'http://medication.zeyan.wang/'
}, }
onLoad() { },
const um_id = uni.getStorageSync('um_id'); onLoad() {
this.um_id = um_id const um_id = uni.getStorageSync('um_id');
if (um_id == '') { this.um_id = um_id
uni.navigateTo({ if (um_id == '') {
url: '/pages/login/login' uni.navigateTo({
}) url: '/pages/login/login'
} })
this.fetchData(this.um_id) }
}, this.fetchData(this.um_id)
methods: { },
fetchData(um_id) { methods: {
user.activity_index({ fetchData(um_id) {
um_id: um_id user.activity_index({
}).then(res => { um_id: um_id
console.log(res) }).then(res => {
if(res.status == 200){ console.log(res)
if(res.data == null){ if (res.status == 200) {
this.list = [] if (res.data == null) {
}else{ this.list = []
this.list = res.data } else {
} this.list = res.data
}else{ }
uni.showToast({ } else {
title: res.msg, uni.showToast({
icon: 'none' title: res.msg,
}) icon: 'none'
} })
}); }
}, });
onPullDownRefresh(){ },
this.fetchData(this.um_id) onPullDownRefresh() {
}, this.fetchData(this.um_id)
publishing(){ },
uni.navigateTo({ publishing() {
url: '/pages/index/publishing' uni.navigateTo({
}) url: '/pages/index/publishing'
}, })
like(id,um_id){ },
user.activity_like({um_id:um_id,activity_id:id,type:1}).then(res => { like(id, um_id) {
if(res.status == 200){ user.activity_like({um_id: um_id, activity_id: id, type: 1}).then(res => {
user.activity_index({ if (res.status == 200) {
um_id: um_id user.activity_index({
}).then(res => { um_id: um_id
console.log(res) }).then(res => {
if(res.status == 200){ console.log(res)
this.list = res.data if (res.status == 200) {
} this.list = res.data
}); }
this.type = res.data.type });
this.activity_id = res.data.activity_id this.type = res.data.type
}else{ this.activity_id = res.data.activity_id
uni.showToast({ } else {
title: res.msg, uni.showToast({
icon: 'none' title: res.msg,
}) icon: 'none'
} })
}); }
}, });
collection(id,um_id){ },
user.activity_like({um_id:um_id,activity_id:id,type:2}).then(res => { collection(id, um_id) {
if(res.status == 200){ user.activity_like({um_id: um_id, activity_id: id, type: 2}).then(res => {
console.log(res) if (res.status == 200) {
this.fetchData(this.um_id) console.log(res)
this.type1 = res.data.type this.fetchData(this.um_id)
this.activity_id = res.data.activity_id this.type1 = res.data.type
}else{ this.activity_id = res.data.activity_id
uni.showToast({ } else {
title: res.msg, uni.showToast({
icon: 'none' title: res.msg,
}) icon: 'none'
} })
}); }
}, });
coninfo(item){ },
// user.coninfo({id:id}).then(res => { coninfo(item) {
// if(res.status == 200){ // user.coninfo({id:id}).then(res => {
uni.setStorageSync('coninfo', item); // if(res.status == 200){
uni.navigateTo({ uni.setStorageSync('coninfo', item);
url: '/pages/index/coninfo' uni.navigateTo({
}) url: '/pages/index/coninfo'
// }else{ })
// uni.showToast({ // }else{
// title: res.msg, // uni.showToast({
// icon: 'none' // title: res.msg,
// }) // icon: 'none'
// } // })
// }); // }
}, // });
Comment(id){ },
uni.setStorageSync('actid', id); Comment(id) {
uni.navigateTo({ uni.setStorageSync('actid', id);
url: '/pages/index/Comment' uni.navigateTo({
}) url: '/pages/index/Comment'
} })
} }
} }
}
</script> </script>
<style> <style lang="less" scoped>
.empty {
width: 100%; .section_1{
display: flex; border: 1px solid red;
flex-wrap: wrap; width: 700rpx;
justify-content: center; height: 264rpx;
height: 85vh; border-radius: 14rpx;
align-items: center; .text_box{
}
.top{ }
background-color: #fff; }
height: 100rpx;
width: 100%;
}
.top_1{
display: inline-block;
font-size: 55rpx;
font-weight: bold;
margin-left: 30rpx;
line-height: 100rpx;
}
.top_2{
margin-left: 600rpx;
position: absolute;
top: 15rpx;
}
.middle{
width: 95%;
background-color: #fff;
margin: auto;
margin-top: 20rpx;
border-radius: 10rpx;
}
.middles{
height: 150rpx;
/* background-color: aqua; */
margin-top: 20rpx;
}
.middles_1{
height: 100%;
width: 24%;
/* background-color: red; */
display: inline-block;
}
.middles_2{
width: 70%;
/* background-color: green; */
display: inline-block;
position: relative;
top: -15%;
left: 2%;
}
.middles_1_img{
width: 130rpx;
height: 130rpx;
margin-left: 12%;
border-radius: 100rpx;
margin-top: 6%;
}
.middles_info1{
font-size: 40rpx;
font-weight: bold;
}
.middles_info2{
color: #5e5e5e;
}
.middles_con{
width: 92%;
margin: 20rpx auto;
font-size: 30rpx;
}
.middles_bom{
padding: 30rpx 0 40rpx 25rpx;
position: relative;
}
.middles_boms{
display: inline-block;
color: #9297b2;
}
.middles_bom_2{
position: absolute;
right: 30%;
}
.middles_bom_3{
position: absolute;
right: 10%;
}
.shoucang{
position: absolute;
right: 10%;
top: 10%;
height: 60rpx;
width: 140rpx;
border-radius: 10rpx;
line-height: 54rpx;
text-align: center;
}
</style> </style>

7
pages/student/index/index.vue

@ -1,8 +1,5 @@
<template> <template>
<view> <view>
<<<<<<< HEAD
<AQTabber></AQTabber>
=======
<view class="top"> <view class="top">
<view class="top_1">发现</view> <view class="top_1">发现</view>
<view class="top_2" @click="publishing"><fui-icon name="plussign" size="80" fontWeight="Number"></fui-icon></view> <view class="top_2" @click="publishing"><fui-icon name="plussign" size="80" fontWeight="Number"></fui-icon></view>
@ -65,7 +62,6 @@
<view style="width: 100%;height: 20rpx;"></view> <view style="width: 100%;height: 20rpx;"></view>
<AQTabber/> <AQTabber/>
>>>>>>> d89f93ea456d0a15a017b476c9df62a3b4c831ed
</view> </view>
</template> </template>
@ -84,8 +80,6 @@
} }
}, },
onLoad() { onLoad() {
<<<<<<< HEAD
=======
const um_id = uni.getStorageSync('um_id'); const um_id = uni.getStorageSync('um_id');
this.um_id = um_id this.um_id = um_id
if (um_id == '') { if (um_id == '') {
@ -94,7 +88,6 @@
}) })
} }
this.fetchData(this.um_id) this.fetchData(this.um_id)
>>>>>>> d89f93ea456d0a15a017b476c9df62a3b4c831ed
}, },
methods: { methods: {
// fetchData(um_id) { // fetchData(um_id) {

Loading…
Cancel
Save