Browse Source

refactor(my_attendance): 重构我的出勤页面

- 根据用户类型动态显示不同内容- 使用 v-for 循环渲染列表项
- 绑定实际数据到模板中
-调整页面布局和样式
master
liutong 12 months ago
parent
commit
63b2b587f6
  1. 223
      pages/common/my_attendance.vue

223
pages/common/my_attendance.vue

@ -12,7 +12,7 @@
<view class="main_section">
<!-- 教练端-->
<view>
<view v-if="userType == 1">
<!--全部-->
<scroll-view
@ -21,39 +21,23 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<image :src="$util.img(v.courses.thumbnail)" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="content">{{v.courses.name}}</view>
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -66,39 +50,23 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<image :src="$util.img(v.courses.thumbnail)" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="content">{{v.courses.name}}</view>
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -111,39 +79,23 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<image :src="$util.img(v.courses.thumbnail)" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="content">{{v.courses.name}}</view>
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">篮球课</view>
<view class="content">考勤正常</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -151,8 +103,7 @@
</view>
<!-- 销售端-->
<view>
<view v-else>
<!--全部-->
<scroll-view
class="section_1"
@ -160,39 +111,22 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">迟到</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<!-- <image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>-->
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">早退</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通记录</view>
<view class="content">本周考勤情况周一到周五均按时打卡未请假综合表现良好
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -206,39 +140,22 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">迟到</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<!-- <image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>-->
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">早退</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通记录</view>
<view class="content">本周考勤情况周一到周五均按时打卡未请假综合表现良好
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -252,39 +169,22 @@
scroll-y="true"
:lower-threshold="lowerThreshold"
@scrolltolower="loadMoreData"
style="height: 100vh;"
style="height: 80vh;"
>
<view class="ul">
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">迟到</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="li"
v-for="(v,k) in tableList"
:key="k"
>
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
<!-- <image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>-->
</view>
<view class="right">
<view class="content">普通考勤</view>
<view class="content">早退</view>
<view class="content">2025-01-01 00:00:00 - 2025-01-01 00:00:00</view>
</view>
</view>
<view class="li">
<view class="left">
<image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>
</view>
<view class="right">
<view class="content">普通记录</view>
<view class="content">本周考勤情况周一到周五均按时打卡未请假综合表现良好
<view class="content">
{{v.status == 1 ? '考勤正常':'请假'}}
</view>
<view class="content">{{v.add_time}} - {{v.end_time}}</view>
</view>
</view>
</view>
@ -316,6 +216,7 @@ export default {
},
data() {
return {
userType: '', //|1=,2=
//tab
optionTable: [
{
@ -363,6 +264,8 @@ export default {
methods: {
//
async init(){
this.userType = uni.getStorageSync('userType')
// this.userType = 2
this.getCurrentDate()//
await this.getList();
},
@ -444,7 +347,7 @@ export default {
this.tableList = this.tableList.concat(res.data.data); // 使 concat
console.log('列表',this.tableList)
this.filteredData.total = res.data.data.total
this.filteredData.total = res.data.total
this.filteredData.page++
},

Loading…
Cancel
Save