|
|
|
@ -9,12 +9,9 @@ |
|
|
|
<view class="main_section"> |
|
|
|
<view class="section_1"> |
|
|
|
<view class="ul"> |
|
|
|
<view class="li" v-for="(v,k) in dateList" :key="k" @click="selectDate(v.date)"> |
|
|
|
<text>{{v.week}}</text> |
|
|
|
|
|
|
|
<text :class="[filteredData.schedule_date == v.date ? 'today':'']">{{today == v.date ? '今':v.today}}</text> |
|
|
|
|
|
|
|
<text :class="[v.status == 2 ?'select_plan':'']"></text> |
|
|
|
<view class="li" v-for="(v,k) in dates" :key="k" @click="selectDate(v.date)"> |
|
|
|
<text>{{v.weekday}}</text> |
|
|
|
<text :class="[filteredData.schedule_date == v.date ? 'today':'']">{{today == v.date ? '今':v.dayOfMonth}}</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="btn" @click="show_calendar=true"> |
|
|
|
@ -22,70 +19,61 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <view class="section_2">--> |
|
|
|
<!-- <view class="item_box">--> |
|
|
|
<!-- <fui-dropdown-menu :size="28" selectedColor="#465CFF" :options="options_course" @click="clickCourse" @close="show_course=false" ref="ref_course">--> |
|
|
|
<!-- <view class="fui-filter__item" @tap="filterTapCourse">--> |
|
|
|
<!-- <text>{{course_name}}</text>--> |
|
|
|
<!-- <view class="fui-filter__icon" :class="{'fui-icon__ani':show_course}">--> |
|
|
|
<!-- <fui-icon name="turningdown" :size="32" color="#FFF"></fui-icon>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </fui-dropdown-menu>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- <view class="item_box">--> |
|
|
|
<!-- <fui-dropdown-menu :size="28" selectedColor="#465CFF" :options="options_classroom" @click="clickClassroom" @close="show_classroom=false" ref="ref_classroom">--> |
|
|
|
<!-- <view class="fui-filter__item" @tap="filterTapClassroom">--> |
|
|
|
<!-- <text>{{classroom_name}}</text>--> |
|
|
|
<!-- <view class="fui-filter__icon" :class="{'fui-icon__ani':show_classroom}">--> |
|
|
|
<!-- <fui-icon name="turningdown" :size="32" color="#FFF"></fui-icon>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </fui-dropdown-menu>--> |
|
|
|
<!-- </view>--> |
|
|
|
|
|
|
|
<!-- </view>--> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<scroll-view |
|
|
|
class="section_3" |
|
|
|
scroll-y="true" |
|
|
|
:lower-threshold="lowerThreshold" |
|
|
|
@scrolltolower="loadMoreData" |
|
|
|
style="height: 100vh;" |
|
|
|
> |
|
|
|
<!-- <view class="section_2">--> |
|
|
|
<!-- <view class="item_box">--> |
|
|
|
<!-- <fui-dropdown-menu :size="28" selectedColor="#465CFF" :options="options_course" @click="clickCourse" @close="show_course=false" ref="ref_course">--> |
|
|
|
<!-- <view class="fui-filter__item" @tap="filterTapCourse">--> |
|
|
|
<!-- <text>{{course_name}}</text>--> |
|
|
|
<!-- <view class="fui-filter__icon" :class="{'fui-icon__ani':show_course}">--> |
|
|
|
<!-- <fui-icon name="turningdown" :size="32" color="#FFF"></fui-icon>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </fui-dropdown-menu>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- <view class="item_box">--> |
|
|
|
<!-- <fui-dropdown-menu :size="28" selectedColor="#465CFF" :options="options_classroom" @click="clickClassroom" @close="show_classroom=false" ref="ref_classroom">--> |
|
|
|
<!-- <view class="fui-filter__item" @tap="filterTapClassroom">--> |
|
|
|
<!-- <text>{{classroom_name}}</text>--> |
|
|
|
<!-- <view class="fui-filter__icon" :class="{'fui-icon__ani':show_classroom}">--> |
|
|
|
<!-- <fui-icon name="turningdown" :size="32" color="#FFF"></fui-icon>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </view>--> |
|
|
|
<!-- </fui-dropdown-menu>--> |
|
|
|
<!-- </view>--> |
|
|
|
|
|
|
|
<!-- </view>--> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<scroll-view class="section_3" scroll-y="true" :lower-threshold="lowerThreshold" |
|
|
|
@scrolltolower="loadMoreData" style="height: 100vh;"> |
|
|
|
<view class="ul"> |
|
|
|
<view |
|
|
|
class="li" |
|
|
|
v-for="(v,k) in tableList" |
|
|
|
:key="k" |
|
|
|
@click="openViewCourseInfoList(v)" |
|
|
|
> |
|
|
|
<view class="li" v-for="(v,k) in tableList" :key="k" @click="openViewCourseInfoList(v)"> |
|
|
|
<view class="top_box"> |
|
|
|
<view class="center_box"> |
|
|
|
<view>班级：{{v.classes_name}}</view> |
|
|
|
<view>时间：{{v.date}}</view> |
|
|
|
<view>课室：{{v.address}} |
|
|
|
</view> |
|
|
|
<view>课程：{{v.courses_name}} |
|
|
|
</view> |
|
|
|
<view>时间：{{v.course_date}}</view> |
|
|
|
<view>课室：{{v.venue.venue_name}}</view> |
|
|
|
<view>课程：{{v.course.course_name}}</view> |
|
|
|
<view>人数：{{v.venue.capacity}}</view> |
|
|
|
</view> |
|
|
|
<view class="right_box"> |
|
|
|
<!-- v.status|1=未开始,2=进行中,3=已结束--> |
|
|
|
<view class="tag" :style="{background: v.status == 1 ? '#1cd188' : v.status == 2 ? '#fad24e' : '#ff4d4f'}"> |
|
|
|
{{ v.status === 1 ? '未开始' : v.status === 2 ? '上课中' : '已结束' }}</view> |
|
|
|
<view class="tag" |
|
|
|
:style="{background: v.status == 'pending' ? '#1cd188' : v.status == 'ongoing' ? '#fad24e' : '#ff4d4f'}"> |
|
|
|
{{ v.status === 'pending' ? '未开始' : v.status === 'ongoing' ? '上课中' : '已结束' }} |
|
|
|
</view> |
|
|
|
<!-- <view class="tag" style="background:#1cd188;">待上课</view>--> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="bottom_box" v-if="v.status !== 'pending'"> --> |
|
|
|
<view class="bottom_box"> |
|
|
|
<view class="hint"> |
|
|
|
已签到学生 ({{v.sign_list.length }}/{{v.max_students.split(',').length }}) |
|
|
|
已签到学生 ({{v.student.length }}/{{v.venue.capacity}}) |
|
|
|
</view> |
|
|
|
<view class="list_box"> |
|
|
|
<view class="list"> |
|
|
|
<view class="itme" v-for="(item,index) in v.sign_list || 0" :key="index"> |
|
|
|
<image :src="$util.img(item.header)"></image> |
|
|
|
<view class="itme" v-for="(item,index) in v.student || 0" :key="index"> |
|
|
|
<image :src="$util.img(item.avatar)"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="btn"> |
|
|
|
@ -93,67 +81,63 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="isbtn" v-if="v.status === 'pending'"> |
|
|
|
详情 |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 日历选择--> |
|
|
|
<!-- 日历选择--> |
|
|
|
<fui-bottom-popup :show="show_calendar" @close="show_calendar=false"> |
|
|
|
<view class="fui-custom__wrap"> |
|
|
|
<uni-calendar |
|
|
|
:insert="true" |
|
|
|
:lunar="false" |
|
|
|
:selected="calendarSelected" |
|
|
|
:startDate="startDate" |
|
|
|
:endDate="endDate" |
|
|
|
@change="changeCalendar" |
|
|
|
/> |
|
|
|
<uni-calendar :insert="true" :lunar="false" :selected="calendarSelected" :startDate="startDate" |
|
|
|
:endDate="endDate" @change="changeCalendar" /> |
|
|
|
</view> |
|
|
|
</fui-bottom-popup> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 底部导航--> |
|
|
|
<AQTabber/> |
|
|
|
<!-- 底部导航--> |
|
|
|
<AQTabber /> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
// import user from '@/api/user.js'; |
|
|
|
import memberApi from '@/api/member.js'; |
|
|
|
import commonApi from '@/api/common.js'; |
|
|
|
import AQTabber from "@/components/AQ/AQTabber.vue" |
|
|
|
|
|
|
|
// import user from '@/api/user.js'; |
|
|
|
import memberApi from '@/api/member.js'; |
|
|
|
import commonApi from '@/api/common.js'; |
|
|
|
import AQTabber from "@/components/AQ/AQTabber.vue" |
|
|
|
import apiRoute from '@/api/apiRoute.js'; |
|
|
|
|
|
|
|
export default { |
|
|
|
export default { |
|
|
|
components: { |
|
|
|
AQTabber, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
loading: false,//加载状态 |
|
|
|
lowerThreshold: 100,//距离底部多远触发 |
|
|
|
isReachedBottom: false,//防止重复加载|true=不可加载|false=可加载 |
|
|
|
loading: false, //加载状态 |
|
|
|
lowerThreshold: 100, //距离底部多远触发 |
|
|
|
isReachedBottom: false, //防止重复加载|true=不可加载|false=可加载 |
|
|
|
|
|
|
|
//筛选条件 |
|
|
|
filteredData: { |
|
|
|
page: 1,//当前页码 |
|
|
|
limit: 10,//每页返回数据条数 |
|
|
|
total: 10,//数据总条数 |
|
|
|
schedule_date: '',//日期 |
|
|
|
venue_id: '',//场地id |
|
|
|
page: 1, //当前页码 |
|
|
|
limit: 10, //每页返回数据条数 |
|
|
|
total: 10, //数据总条数 |
|
|
|
schedule_date: '', //日期 |
|
|
|
venue_id: '', //场地id |
|
|
|
}, |
|
|
|
tableList: [],//表格数据 |
|
|
|
venuesInfo: {},//场地信息 |
|
|
|
tableList: [], //表格数据 |
|
|
|
venuesInfo: {}, //场地信息 |
|
|
|
|
|
|
|
formData:{}, |
|
|
|
formData: {}, |
|
|
|
|
|
|
|
//课程下拉菜单相关 |
|
|
|
show_course:false,//是否显示下拉菜单 |
|
|
|
show_course: false, //是否显示下拉菜单 |
|
|
|
//课程下拉菜单 |
|
|
|
course_name:'课程',//选中的下拉菜单名称 |
|
|
|
options_course: [ |
|
|
|
{ |
|
|
|
course_name: '课程', //选中的下拉菜单名称 |
|
|
|
options_course: [{ |
|
|
|
text: '请选择课程', |
|
|
|
value: '', |
|
|
|
checked: true |
|
|
|
@ -163,15 +147,13 @@ export default { |
|
|
|
}, { |
|
|
|
text: '篮球课程2', |
|
|
|
value: '2' |
|
|
|
} |
|
|
|
], |
|
|
|
}], |
|
|
|
|
|
|
|
//课室下拉菜单相关 |
|
|
|
show_classroom:false,//是否显示下拉菜单 |
|
|
|
show_classroom: false, //是否显示下拉菜单 |
|
|
|
//课程下拉菜单 |
|
|
|
classroom_name:'课室',//选中的下拉菜单名称 |
|
|
|
options_classroom: [ |
|
|
|
{ |
|
|
|
classroom_name: '课室', //选中的下拉菜单名称 |
|
|
|
options_classroom: [{ |
|
|
|
text: '请选择课室', |
|
|
|
value: '', |
|
|
|
checked: true |
|
|
|
@ -181,29 +163,29 @@ export default { |
|
|
|
}, { |
|
|
|
text: '篮球室101', |
|
|
|
value: '2' |
|
|
|
} |
|
|
|
], |
|
|
|
}], |
|
|
|
|
|
|
|
//今日日期 |
|
|
|
today: '', |
|
|
|
dateList: [],//日期列表 |
|
|
|
dateList: [], //日期列表 |
|
|
|
|
|
|
|
//日历选择相关 |
|
|
|
show_calendar:false,//是否展示日期 |
|
|
|
startDate:'',//开始日期 |
|
|
|
endDate:'',//结束日期 |
|
|
|
calendarSelected: [],//日历打点 |
|
|
|
show_calendar: false, //是否展示日期 |
|
|
|
startDate: '', //开始日期 |
|
|
|
endDate: '', //结束日期 |
|
|
|
calendarSelected: [], //日历打点 |
|
|
|
dates: {} |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
onLoad() { |
|
|
|
}, |
|
|
|
onShow(){ |
|
|
|
//this.init()//初始化 |
|
|
|
onLoad() {}, |
|
|
|
onShow() { |
|
|
|
this.init() //初始化 |
|
|
|
}, |
|
|
|
//下拉刷新 |
|
|
|
async onPullDownRefresh() { |
|
|
|
//重置为第一页 |
|
|
|
this.getThisDate() |
|
|
|
let schedule_date = this.filteredData.schedule_date |
|
|
|
await this.loadData() |
|
|
|
this.filteredData.schedule_date = schedule_date |
|
|
|
@ -211,16 +193,17 @@ export default { |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
//初始化 |
|
|
|
async init(){ |
|
|
|
async init() { |
|
|
|
|
|
|
|
await this.getThisDate() |
|
|
|
await this.getHeadDate() |
|
|
|
await this.getList() |
|
|
|
this.getDateRange() |
|
|
|
this.setCalendarSelected() |
|
|
|
// this.getDateRange() |
|
|
|
// this.setCalendarSelected() |
|
|
|
}, |
|
|
|
|
|
|
|
//选中课程下拉菜单点击事件 |
|
|
|
clickCourse(e){ |
|
|
|
clickCourse(e) { |
|
|
|
console.log(e) |
|
|
|
this.course_name = e.text |
|
|
|
this.show_course = true |
|
|
|
@ -235,7 +218,7 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
//选中课室 |
|
|
|
clickClassroom(e){ |
|
|
|
clickClassroom(e) { |
|
|
|
console.log(e) |
|
|
|
this.classroom_name = e.text |
|
|
|
this.show_classroom = true |
|
|
|
@ -248,39 +231,57 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
//打开课时详情页 |
|
|
|
openViewCourseInfoList(item){ |
|
|
|
openViewCourseInfoList(item) { |
|
|
|
let id = item.id |
|
|
|
uni.navigateTo({ |
|
|
|
url: `/pages/coach/course/info_list?id=${id}` |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
//获取课程头日期 |
|
|
|
async getHeadDate() { |
|
|
|
let res = await commonApi.getDate() |
|
|
|
if (res.code != 1) { |
|
|
|
//提示 |
|
|
|
uni.showToast({ |
|
|
|
title: res.msg, |
|
|
|
icon: 'none', |
|
|
|
}) |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
this.dateList = [] |
|
|
|
res.data.forEach((v, k) => { |
|
|
|
let today = v.date.split("-")[2]; // "09" |
|
|
|
this.dateList.push({ |
|
|
|
date: v.date, |
|
|
|
status: v.status,//1是正常 2请假 |
|
|
|
week: v.week, |
|
|
|
today: today, |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
getDatesAroundToday(offsetDays = 0) { |
|
|
|
const date = new Date(); |
|
|
|
date.setDate(date.getDate() + offsetDays); |
|
|
|
const year = date.getFullYear(); |
|
|
|
const month = String(date.getMonth() + 1).padStart(2, '0'); |
|
|
|
const day = String(date.getDate()).padStart(2, '0'); |
|
|
|
const weekDay = ['日', '一', '二', '三', '四', '五', '六'][date.getDay()]; |
|
|
|
return { |
|
|
|
date: `${year}-${month}-${day}`, |
|
|
|
weekday: `星期${weekDay}`, |
|
|
|
dayOfMonth: day // 👈 新增字段：几号 |
|
|
|
}; |
|
|
|
}, |
|
|
|
|
|
|
|
console.log('xxx', res) |
|
|
|
//获取课程头日期 |
|
|
|
async getHeadDate() { |
|
|
|
// let res = await commonApi.getDate() |
|
|
|
// if (res.code != 1) { |
|
|
|
// //提示 |
|
|
|
// uni.showToast({ |
|
|
|
// title: res.msg, |
|
|
|
// icon: 'none', |
|
|
|
// }) |
|
|
|
// return |
|
|
|
// } |
|
|
|
|
|
|
|
// this.dateList = [] |
|
|
|
// res.data.forEach((v, k) => { |
|
|
|
// let today = v.date.split("-")[2]; // "09" |
|
|
|
// this.dateList.push({ |
|
|
|
// date: v.date, |
|
|
|
// status: v.status, //1是正常 2请假 |
|
|
|
// week: v.week, |
|
|
|
// today: today, |
|
|
|
// }) |
|
|
|
// }) |
|
|
|
|
|
|
|
this.dates = {}; |
|
|
|
for (let i = -3; i <= 3; i++) { |
|
|
|
const key = i === 0 ? '今天' : `${Math.abs(i)}天${i < 0 ? '前' : '后'}`; |
|
|
|
this.dates[key] = this.getDatesAroundToday(i); |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
//获取当前日期 |
|
|
|
@ -300,32 +301,34 @@ export default { |
|
|
|
|
|
|
|
//选择日期 |
|
|
|
async selectDate(date) { |
|
|
|
//this.loadData() |
|
|
|
this.loadData() |
|
|
|
this.filteredData.schedule_date = date |
|
|
|
//this.getList() |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
|
|
|
|
//加载更过(下一页) |
|
|
|
loadMoreData() { |
|
|
|
//判断是否加载 |
|
|
|
if (!this.isReachedBottom) { |
|
|
|
this.isReachedBottom = true;//设置为不可请求状态 |
|
|
|
this.isReachedBottom = true; //设置为不可请求状态 |
|
|
|
this.getList(); |
|
|
|
} |
|
|
|
}, |
|
|
|
//重置为第一页 |
|
|
|
async loadData() { |
|
|
|
this.isReachedBottom = false; // 重置状态，以便下次触发加载更多 |
|
|
|
|
|
|
|
this.filteredData.page = 1//当前页码 |
|
|
|
this.filteredData.limit = 10//每页返回数据条数 |
|
|
|
this.filteredData.total = 10//数据总条数 |
|
|
|
this.filteredData.page = 1 //当前页码 |
|
|
|
this.filteredData.limit = 10 //每页返回数据条数 |
|
|
|
this.filteredData.total = 10 //数据总条数 |
|
|
|
this.filteredData.schedule_date = '' |
|
|
|
}, |
|
|
|
//获取列表 |
|
|
|
async getList() { |
|
|
|
this.loading = true |
|
|
|
|
|
|
|
let data = {...this.filteredData} |
|
|
|
let data = { |
|
|
|
...this.filteredData |
|
|
|
} |
|
|
|
|
|
|
|
//判断是否还有数据 |
|
|
|
if (this.filteredData.page * this.filteredData.limit > this.filteredData.total || this.filteredData.limit > this.filteredData.total) { |
|
|
|
@ -337,7 +340,7 @@ export default { |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
let res = await memberApi.courseList(data) |
|
|
|
let res = await apiRoute.courseList(data) |
|
|
|
this.loading = false |
|
|
|
this.isReachedBottom = false; |
|
|
|
if (res.code != 1) { |
|
|
|
@ -348,11 +351,11 @@ export default { |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
this.tableList = res.data.list.data |
|
|
|
this.tableList = res.data.data |
|
|
|
//场地信息 |
|
|
|
this.venuesInfo = res.data.venues_info |
|
|
|
|
|
|
|
this.filteredData.total = res.data.list.total |
|
|
|
this.filteredData.total = res.data.total |
|
|
|
|
|
|
|
this.filteredData.page++ |
|
|
|
}, |
|
|
|
@ -381,15 +384,17 @@ export default { |
|
|
|
// 更新 data 中的 startDate 和 endDate |
|
|
|
this.startDate = formatDate(startDate); |
|
|
|
this.endDate = formatDate(endDate); |
|
|
|
console.log([this.startDate,this.endDate]) |
|
|
|
console.log([this.startDate, this.endDate]) |
|
|
|
}, |
|
|
|
//设置日期打点 |
|
|
|
async setCalendarSelected(){ |
|
|
|
async setCalendarSelected() { |
|
|
|
//获取当前月份 |
|
|
|
let month = new Date().getMonth() + 1; |
|
|
|
|
|
|
|
let res = await commonApi.getMonthDate({month:month}) |
|
|
|
if (res.code != 1){ |
|
|
|
let res = await commonApi.getMonthDate({ |
|
|
|
month: month |
|
|
|
}) |
|
|
|
if (res.code != 1) { |
|
|
|
//提示 |
|
|
|
uni.showToast({ |
|
|
|
title: res.msg, |
|
|
|
@ -399,7 +404,7 @@ export default { |
|
|
|
return |
|
|
|
} |
|
|
|
this.calendarSelected = [] |
|
|
|
res.data.forEach((v,k)=>{ |
|
|
|
res.data.forEach((v, k) => { |
|
|
|
this.calendarSelected.push({ |
|
|
|
date: v.date, |
|
|
|
}) |
|
|
|
@ -418,31 +423,31 @@ export default { |
|
|
|
// ] |
|
|
|
}, |
|
|
|
//日历选择 |
|
|
|
changeCalendar(e){ |
|
|
|
console.log('日历',e) |
|
|
|
changeCalendar(e) { |
|
|
|
console.log('日历', e) |
|
|
|
this.show_calendar = false |
|
|
|
//this.loadData() |
|
|
|
this.loadData() |
|
|
|
this.filteredData.schedule_date = e.fulldate |
|
|
|
//this.getList() |
|
|
|
this.getList() |
|
|
|
}, |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="less" scoped> |
|
|
|
.main_box { |
|
|
|
background: #292929; |
|
|
|
} |
|
|
|
|
|
|
|
.main_box{ |
|
|
|
background: #292929 ; |
|
|
|
} |
|
|
|
|
|
|
|
//自定义导航栏 |
|
|
|
.navbar_section{ |
|
|
|
//自定义导航栏 |
|
|
|
.navbar_section { |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
background: #292929; |
|
|
|
.title{ |
|
|
|
|
|
|
|
.title { |
|
|
|
padding: 40rpx 0rpx; |
|
|
|
|
|
|
|
/* 小程序端样式 */ |
|
|
|
@ -453,9 +458,9 @@ export default { |
|
|
|
font-size: 30rpx; |
|
|
|
color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.main_section{ |
|
|
|
.main_section { |
|
|
|
min-height: 100vh; |
|
|
|
background: #292929 100%; |
|
|
|
padding-top: 40rpx; |
|
|
|
@ -463,47 +468,55 @@ export default { |
|
|
|
font-size: 24rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
|
|
|
|
.section_1{ |
|
|
|
.section_1 { |
|
|
|
background: #333333 100%; |
|
|
|
width: 100%; |
|
|
|
padding: 30rpx 28rpx; |
|
|
|
padding-bottom: 15rpx; |
|
|
|
.ul{ |
|
|
|
|
|
|
|
.ul { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
.li{ |
|
|
|
|
|
|
|
.li { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
gap: 10rpx; |
|
|
|
text{ |
|
|
|
|
|
|
|
text { |
|
|
|
font-size: 24rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
text:nth-child(2){ |
|
|
|
|
|
|
|
text:nth-child(2) { |
|
|
|
width: 44rpx; |
|
|
|
height: 44rpx; |
|
|
|
} |
|
|
|
text:nth-child(3){ |
|
|
|
|
|
|
|
text:nth-child(3) { |
|
|
|
width: 8rpx; |
|
|
|
height: 8rpx; |
|
|
|
} |
|
|
|
.today{ |
|
|
|
|
|
|
|
.today { |
|
|
|
border-radius: 50%; |
|
|
|
background: #29D3B4; |
|
|
|
text-align: center; |
|
|
|
line-height: 42rpx; |
|
|
|
} |
|
|
|
.select_plan{ |
|
|
|
|
|
|
|
.select_plan { |
|
|
|
background: #F59A23; |
|
|
|
border-radius: 50%; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.btn{ |
|
|
|
|
|
|
|
.btn { |
|
|
|
margin-top: 20rpx; |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
@ -512,31 +525,35 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.section_2{ |
|
|
|
.section_2 { |
|
|
|
margin-top: 30rpx; |
|
|
|
padding: 0 20rpx ; |
|
|
|
padding: 0 20rpx; |
|
|
|
color: #fff; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
gap: 20rpx; |
|
|
|
|
|
|
|
.item_box { |
|
|
|
width: 45%; |
|
|
|
|
|
|
|
.fui-filter__item { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.section_3{ |
|
|
|
.section_3 { |
|
|
|
margin-top: 36rpx; |
|
|
|
color: #fff; |
|
|
|
font-size: 24rpx; |
|
|
|
.ul{ |
|
|
|
|
|
|
|
.ul { |
|
|
|
padding: 0 26rpx; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 30rpx; |
|
|
|
.li{ |
|
|
|
|
|
|
|
.li { |
|
|
|
position: relative; |
|
|
|
border-radius: 22rpx; |
|
|
|
background: #434544 100%; |
|
|
|
@ -544,17 +561,21 @@ export default { |
|
|
|
padding-bottom: 30rpx; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
.top_box{ |
|
|
|
|
|
|
|
.top_box { |
|
|
|
padding: 20rpx 30rpx; |
|
|
|
.center_box{ |
|
|
|
|
|
|
|
.center_box { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 10rpx; |
|
|
|
view{} |
|
|
|
|
|
|
|
view {} |
|
|
|
} |
|
|
|
.right_box{ |
|
|
|
.tag{ |
|
|
|
position:absolute; |
|
|
|
|
|
|
|
.right_box { |
|
|
|
.tag { |
|
|
|
position: absolute; |
|
|
|
top: 0rpx; |
|
|
|
right: 0rpx; |
|
|
|
padding: 10rpx; |
|
|
|
@ -566,30 +587,36 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.bottom_box{ |
|
|
|
|
|
|
|
.bottom_box { |
|
|
|
border-top: 1px dashed #F2F2F2; |
|
|
|
padding: 26rpx 16rpx 0 26rpx; |
|
|
|
.hint{ |
|
|
|
color:#D7D7D7; |
|
|
|
|
|
|
|
.hint { |
|
|
|
color: #D7D7D7; |
|
|
|
} |
|
|
|
.list_box{ |
|
|
|
|
|
|
|
.list_box { |
|
|
|
margin-top: 22rpx; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
.list{ |
|
|
|
|
|
|
|
.list { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
gap: 14rpx; |
|
|
|
.itme{ |
|
|
|
image{ |
|
|
|
|
|
|
|
.itme { |
|
|
|
image { |
|
|
|
width: 48rpx; |
|
|
|
height: 48rpx; |
|
|
|
border-radius: 50%; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.btn{ |
|
|
|
|
|
|
|
.btn { |
|
|
|
border: 1px solid #FAD04D; |
|
|
|
border-radius: 10rpx; |
|
|
|
background: #434544; |
|
|
|
@ -607,7 +634,20 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.isbtn { |
|
|
|
border: 1px solid #FAD04D; |
|
|
|
border-radius: 10rpx; |
|
|
|
background: #434544; |
|
|
|
color: #FAD04D; |
|
|
|
width: 110rpx; |
|
|
|
height: 60rpx; |
|
|
|
line-height: 55rpx; |
|
|
|
text-align: center; |
|
|
|
font-size: 24rpx; |
|
|
|
position: absolute; |
|
|
|
bottom: 20rpx; |
|
|
|
right: 15rpx; |
|
|
|
} |
|
|
|
</style> |
