update

pages/attendanceStatus/attendanceStatistics.vue

@@ -32,16 +32,17 @@
                 <view class="dateSelector">
                     <view class="dateBox">
                         <view class="centerDateBox">
-                            <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/leftArrowIcon.png"
+                            <view class="arrowBtn" @tap="handleChangeDate(2)">
-                                @click="handleChangeDate(2)" />
+                                <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/leftArrowIcon.png" />
+                            </view>
                             <view class="center">
                                 <text class="date-text">{{ selectDate ? $util.cutDate(new Date(selectDate), 'YYYY-MM') :
                                     ""
                                     }}</text>
-                                <!-- <text class="date-icon">📅</text> -->
                             </view>
-                            <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png"
+                            <view class="arrowBtn" @tap="handleChangeDate(1)">
-                                @click="handleChangeDate(1)" />
+                                <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png" />
+                            </view>
                         </view>
                     </view>
 
@@ -172,10 +173,12 @@
                 </view>
             </view>
 
-            <!-- 空数据状态 -->
+            <!-- 空数据状态 - 只有在已加载完成且真的没有数据时才显示 -->
-            <view class="emptyState" v-if="attendanceStatisticsData.length === 0 && !loading">
+            <view class="emptyState" v-if="attendanceStatisticsData.length === 0 && !loading && hasLoaded">
+                <view class="emptyIcon">📊</view>
                 <text class="emptyText">暂无考勤数据</text>
                 <text class="emptyDesc">请选择其他时间或服务区查看</text>
+                <!-- <button class="retryBtn" @tap="retryLoad" type="primary" size="mini">重新加载</button> -->
             </view>
         </view>
 
@@ -200,7 +203,9 @@ export default {
             attendanceStatisticsData: [],
             isFirst: true,
             seatInfo: {},
-            loading: false
+            loading: false,
+            hasLoaded: false, // 是否已经完成过初始加载
+            retryCount: 0
         }
     },
     onLoad() {
@@ -224,6 +229,19 @@ export default {
             return name ? name.charAt(0).toUpperCase() : '?'
         },
 
+        // 重试加载
+        retryLoad() {
+            if (this.retryCount < 3) {
+                this.retryCount++
+                this.handleGetData(this.serviceInfo.SERVERPART_NAME)
+            } else {
+                uni.showToast({
+                    title: '多次重试失败，请检查网络连接',
+                    icon: 'none'
+                })
+            }
+        },
+
         // 格式化时长（分钟转小时分钟）
         formatDuration(minutes) {
             if (!minutes || minutes <= 0) return ''
@@ -286,7 +304,11 @@ export default {
                             "content-type": "application/x-www-form-urlencoded",
                         },
                         success(res) {
+                            if (res.data && res.data.data) {
                                 resolve(res.data.data)
+                            } else {
+                                reject(new Error('数据格式错误'))
+                            }
                         },
                         fail(err) {
                             reject(err)
@@ -303,7 +325,7 @@ export default {
                     })
                 }
                 this.attendanceStatisticsData = list
-                console.log('最终数据:', this.attendanceStatisticsData)
+                this.hasLoaded = true // 标记已完成加载
             } catch (error) {
                 console.error('获取考勤数据失败:', error)
                 uni.showToast({
@@ -359,7 +381,7 @@ export default {
         },
         // 修改日期
         async handleChangeDate(type) {
-            this.attendanceStatisticsData = []
+            // 月份切换时不清空数据，保持当前显示直到新数据加载完成
             //  type  1 加一天  2 减一天
             // 兼容 iOS，把 2025-08-15 转成 2025/08/15
             const cur = new Date((this.selectDate || '').replace(/-/g, '/'));
@@ -376,6 +398,7 @@ export default {
             const d = String(last.getDate()).padStart(2, '0');
 
             this.selectDate = `${y}-${m}-${d}`;
+            this.retryCount = 0 // 重置重试次数
             await this.handleGetData(this.serviceInfo.SERVERPART_NAME)
         },
     }
@@ -509,10 +532,20 @@ export default {
                         // border: 2rpx solid #27B35F;
                         // background: rgba(255, 255, 255, .15);
 
+                        .arrowBtn {
+                            display: flex;
+                            align-items: center;
+                            justify-content: center;
+                            width: 60rpx;
+                            height: 60rpx;
+                            border-radius: 50%;
+                            // background: rgba(39, 178, 95, 0.1);
+
                             .arrowIcon {
                                 width: 40rpx;
                                 height: 40rpx;
                             }
+                        }
 
                         .center {
                             .date-text {
@@ -740,7 +773,6 @@ export default {
                     display: flex;
                     justify-content: space-between;
                     flex-wrap: wrap;
-                    // gap: 24rpx 16rpx;
 
                     .statItem {
                         display: flex;
@@ -870,26 +902,45 @@ export default {
             flex-direction: column;
             align-items: center;
             justify-content: center;
-            padding: 120rpx 40rpx;
+            padding: 80rpx 40rpx;
+            text-align: center;
+            background: #fff;
+            border-radius: 16rpx;
+            margin-bottom: 32rpx;
+            box-shadow: @shadow;
 
             .emptyIcon {
-                width: 120rpx;
+                font-size: 80rpx;
-                height: 120rpx;
+                margin-bottom: 24rpx;
-                margin-bottom: 32rpx;
                 opacity: 0.6;
             }
 
             .emptyText {
                 font-size: 32rpx;
-                color: @muted;
+                color: #2c3e50;
+                font-weight: 600;
                 margin-bottom: 16rpx;
             }
 
             .emptyDesc {
                 font-size: 24rpx;
-                color: #bbb;
+                color: #666;
-                text-align: center;
                 line-height: 1.5;
+                margin-bottom: 32rpx;
+            }
+
+            .retryBtn {
+                background: @primary;
+                color: #fff;
+                border: none;
+                border-radius: 24rpx;
+                padding: 16rpx 32rpx;
+                font-size: 24rpx;
+                font-weight: 600;
+
+                &::after {
+                    border: none;
+                }
             }
         }
     }

pages/attendanceStatus/roster.vue

@@ -27,16 +27,17 @@
             <view class="selectorRow">
                 <view class="dateBox">
                     <view class="centerDateBox">
-                        <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/leftArrowIcon.png"
+                        <view class="arrowBtn" @tap="handleChangeDate(2)">
-                            @click="handleChangeDate(2)" />
+                            <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/leftArrowIcon.png" />
+                        </view>
                         <view class="center">
                             <text class="date-text">{{ selectDate ? $util.cutDate(new Date(selectDate), 'YYYY-MM') :
                                 ""
                                 }}</text>
-                            <!-- <text class="date-icon">📅</text> -->
                         </view>
-                        <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png"
+                        <view class="arrowBtn" @tap="handleChangeDate(1)">
-                            @click="handleChangeDate(1)" />
+                            <image class="arrowIcon" src="https://eshangtech.com/cyy_DIB/rightArrowIcon.png" />
+                        </view>
                     </view>
                 </view>
 
@@ -61,12 +62,39 @@
             <view v-if="selectedEmployee" class="employeeDetail">
                 <view class="employeeCard">
                     <view class="employeeInfo">
-                        <view class="employeeName">{{ selectedEmployee.userName }}</view>
+                        <view class="avatar">{{ getFirstChar(selectedEmployee.userName) }}</view>
-                        <view class="employeeJob">{{ selectedEmployee.psnJob }}</view>
+                        <view class="basicInfo">
-                        <image class="phoneIcon" src="https://eshangtech.com/cyy_DIB/phoneIcon.png" />
+                            <view class="nameRow">
-                        <view class="employeePhone">{{ selectedEmployee.phone }}</view>
+                                <image class="personIcon" src="https://eshangtech.com/cyy_DIB/personIcon.png"></image>
+                                <view class="employeeName">{{ selectedEmployee.userName || '-' }}</view>
+                            </view>
+                            <view class="phoneRow">
+                                <image class="phoneIcon" src="https://eshangtech.com/cyy_DIB/phoneLabelIcon.png">
+                                </image>
+                                <view class="employeePhone">{{ selectedEmployee.phone || '-' }}</view>
                             </view>
                         </view>
+                        <view class="jobInfo">
+                            <view class="employeeJob" v-if="selectedEmployee.psnJob">{{ selectedEmployee.psnJob }}
+                            </view>
+                        </view>
+                    </view>
+                </view>
+            </view>
+
+            <!-- 空状态提示 - 只有在已加载完成且真的没有数据时才显示 -->
+            <view v-if="!loading && hasLoaded && userList.length === 0" class="emptyState">
+                <view class="emptyIcon">📋</view>
+                <view class="emptyText">暂无员工数据</view>
+                <view class="emptyDesc">请检查服务区设置或联系管理员</view>
+                <button class="retryBtn" @tap="retryLoad" type="primary" size="mini">重新加载</button>
+            </view>
+
+            <!-- 员工无排班数据提示 - 只有在已加载完成且真的没有数据时才显示 -->
+            <view v-if="!loading && hasLoaded && userList.length > 0 && !selectedEmployee" class="emptySchedule">
+                <view class="emptyIcon">📅</view>
+                <view class="emptyText">暂无排班数据</view>
+                <view class="emptyDesc">该员工在当前月份暂无排班安排</view>
             </view>
 
             <!-- 日历格式排班表 -->
@@ -126,7 +154,10 @@ export default {
             selectUser: "",//当前选择的员工
             isFirst: true,
             monthDays: [],
-            firstDayOfWeek: ""
+            firstDayOfWeek: "",
+            loading: false,
+            retryCount: 0,
+            hasLoaded: false, // 是否已经完成过初始加载
         }
     },
     computed: {
@@ -171,14 +202,28 @@ export default {
         }
     },
     methods: {
+        // 获取姓名首字符
+        getFirstChar(name) {
+            return name ? name.charAt(0).toUpperCase() : '?'
+        },
+
+        // 重试加载
+        retryLoad() {
+            if (this.retryCount < 3) {
+                this.retryCount++
+                this.loadRosterData(this.serviceInfo.SERVERPART_NAME)
+            } else {
+                uni.showToast({
+                    title: '多次重试失败，请检查网络连接',
+                    icon: 'none'
+                })
+            }
+        },
+
         handleGetNewMonthData() {
             const year = this.currentYear
             const month = this.currentMonth
 
-            console.log('yearyearyear', year);
-            console.log('monthmonthmonthmonth', month);
-
-
             const daysInMonth = new Date(year, month + 1, 0).getDate()
             const today = new Date()
             const todayStr = `${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, '0')}-${String(today.getDate()).padStart(2, '0')}`
@@ -233,8 +278,10 @@ export default {
             this.currentMonth = last.getMonth() // 使用数字类型的月份索引
 
             this.handleGetNewMonthData()
+            this.retryCount = 0 // 重置重试次数
 
-            this.handleGetCurrentUserScheduleInfo()
+            // 月份切换时，不清空selectedEmployee，保持显示直到新数据加载完成
+            await this.handleGetCurrentUserScheduleInfo()
         },
         // 返回上一页
         handleBack() {
@@ -242,27 +289,38 @@ export default {
         },
         // 员工选择变化
         handleEmployeeChange(e) {
-            console.log('eee', e);
+            const selectedIndex = Number(e.detail.value)
-
+            if (selectedIndex >= 0 && selectedIndex < this.userList.length) {
-            this.selectedEmployeeIndex = Number(e.detail.value)
+                this.selectedEmployeeIndex = selectedIndex
-            this.selectUser = this.userList && this.userList.length > 0 ? this.userList[this.selectedEmployeeIndex] : ""
+                this.selectUser = this.userList[selectedIndex]
-
+                // 切换员工时，暂时保持当前状态，直到新数据加载完成
                 this.handleGetCurrentUserScheduleInfo()
+            }
         },
 
         // 加载排班数据
         async loadRosterData(SERVERPART_NAME) {
-            // 先拿到人员列表
+            if (!SERVERPART_NAME) {
+                uni.showToast({
+                    title: '请先选择服务区',
+                    icon: 'none'
+                })
+                return
+            }
+
+            this.loading = true
             let req = {
                 bsessionKey: "0B30475A94674D608022885F7763959B",
                 workTime: new Date(this.selectDate).getTime(),
-                saName: SERVERPART_NAME || "",// 服务区名称
+                saName: SERVERPART_NAME,
-                phone: "",// 手机号码
+                phone: "",
             }
+
             uni.showLoading({
                 title: "加载中..."
             })
 
+            try {
                 const data = await new Promise((resolve, reject) => {
                     uni.request({
                         url: "https://fwqznxj.yciccloud.com:9081/ynjt/pushManage/queryUserSchedule",
@@ -272,29 +330,64 @@ export default {
                             "content-type": "application/x-www-form-urlencoded",
                         },
                         success(res) {
+                            if (res.data && res.data.data) {
                                 resolve(res.data.data)
+                            } else {
+                                reject(new Error('数据格式错误'))
+                            }
                         },
+                        fail(err) {
+                            reject(err)
+                        }
                     });
                 });
-            uni.hideLoading()
 
-            console.log('人员列表', data);
+                const userList = Array.isArray(data) ? data : []
-
+                this.userList = userList
-            this.userList = data
                 this.selectedEmployeeIndex = 0
-            this.selectUser = data && data.length > 0 ? data[0] : ""
+                this.selectUser = userList.length > 0 ? userList[0] : null
-            console.log('this.selectUserthis.selectUserthis.selectUser', this.selectUser);
 
+                if (userList.length > 0) {
                     await this.handleGetCurrentUserScheduleInfo()
+                } else {
+                    this.selectedEmployee = null
+                    uni.showToast({
+                        title: '当前服务区暂无员工',
+                        icon: 'none'
+                    })
+                }
+
+                // 标记已完成初始加载
+                this.hasLoaded = true
+            } catch (error) {
+                console.error('加载排班数据失败:', error)
+                this.userList = []
+                this.selectedEmployee = null
+                uni.showToast({
+                    title: error.message || '加载失败，请重试',
+                    icon: 'none'
+                })
+            } finally {
+                this.loading = false
+                uni.hideLoading()
+            }
         },
         // 拿到当前用户的排班信息
         async handleGetCurrentUserScheduleInfo() {
+            if (!this.selectUser || !this.selectUser.phone) {
+                // 只有在已经完成过初始加载后才显示空状态
+                if (this.hasLoaded) {
                     this.selectedEmployee = null
+                }
+                return
+            }
             let req = {
                 bsessionKey: "20ED2B50179D4877853C4DED45D8179E",
                 date: new Date(this.selectDate).getTime(),
                 phone: this.selectUser.phone
             }
+
+            try {
                 const data = await new Promise((resolve, reject) => {
                     uni.request({
                         url: "https://fwqznxj.yciccloud.com:9081/ynjt/pushManage/queryWorkDetails",
@@ -304,13 +397,41 @@ export default {
                             "content-type": "application/x-www-form-urlencoded",
                         },
                         success(res) {
+                            if (res.data && res.data.data && Array.isArray(res.data.data) && res.data.data.length > 0) {
                                 resolve(res.data.data)
+                            } else {
+                                resolve(null)
+                            }
                         },
+                        fail(err) {
+                            reject(err)
+                        }
                     });
                 });
 
-            console.log('datadatadatadatadata', data);
+                if (data && data.length > 0) {
                     this.selectedEmployee = data[0]
+                } else {
+                    this.selectedEmployee = null
+                    // 只有在已经加载过的情况下才显示提示
+                    if (this.hasLoaded) {
+                        uni.showToast({
+                            title: '该员工暂无排班信息',
+                            icon: 'none'
+                        })
+                    }
+                }
+
+                // 标记已完成加载
+                this.hasLoaded = true
+            } catch (error) {
+                console.error('获取排班信息失败:', error)
+                this.selectedEmployee = null
+                uni.showToast({
+                    title: '获取排班信息失败',
+                    icon: 'none'
+                })
+            }
         }
     }
 }
@@ -443,10 +564,20 @@ export default {
                 // border: 2rpx solid #27B35F;
                 // background: rgba(255, 255, 255, .15);
 
+                .arrowBtn {
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    width: 60rpx;
+                    height: 60rpx;
+                    border-radius: 50%;
+                    // background: rgba(39, 178, 95, 0.1);
+
                     .arrowIcon {
                         width: 40rpx;
                         height: 40rpx;
                     }
+                }
 
                 .center {
                     .date-text {
@@ -489,29 +620,59 @@ export default {
 
             .employeeCard {
                 background: #fff;
-                border-radius: 12rpx;
+                border-radius: 16rpx;
-                padding: 16rpx 24rpx;
+                padding: 24rpx;
                 box-shadow: @shadow;
+                border: 1px solid rgba(39, 178, 95, 0.08);
 
                 .employeeInfo {
+                    display: flex;
+                    align-items: flex-start;
+                    justify-content: space-between;
+
+                    .avatar {
+                        width: 72rpx;
+                        height: 72rpx;
+                        border-radius: 50%;
+                        background: @primary;
+                        color: #fff;
+                        font-size: 24rpx;
+                        font-weight: 700;
                         display: flex;
                         align-items: center;
+                        justify-content: center;
+                        margin-right: 24rpx;
+                        flex-shrink: 0;
+                    }
+
+                    .basicInfo {
+                        flex: 1;
+                        display: flex;
+                        flex-direction: column;
+                        gap: 12rpx;
+                        margin-top: 4rpx;
+
+                        .nameRow {
+                            display: flex;
+                            align-items: center;
+
+                            .personIcon {
+                                width: 24rpx;
+                                height: 24rpx;
+                                margin-right: 8rpx;
+                            }
 
                             .employeeName {
                                 font-size: 28rpx;
                                 font-weight: 600;
-                        color: #333;
+                                color: #2c3e50;
-                        margin-right: 24rpx;
+                                line-height: 1.3;
+                            }
                         }
 
-                    .employeeJob {
+                        .phoneRow {
-                        font-size: 24rpx;
+                            display: flex;
-                        color: @primary;
+                            align-items: center;
-                        background: rgba(39, 178, 95, 0.1);
-                        padding: 0 16rpx;
-                        border-radius: 20rpx;
-                        margin-right: 24rpx;
-                    }
 
                             .phoneIcon {
                                 width: 24rpx;
@@ -522,6 +683,24 @@ export default {
                             .employeePhone {
                                 font-size: 24rpx;
                                 color: #666;
+                                line-height: 1.3;
+                            }
+                        }
+                    }
+
+                    .jobInfo {
+                        display: flex;
+                        align-items: flex-start;
+                        margin-top: 4rpx;
+
+                        .employeeJob {
+                            font-size: 22rpx;
+                            color: @primary;
+                            background: rgba(39, 178, 95, 0.1);
+                            padding: 6rpx 12rpx;
+                            border-radius: 16rpx;
+                            font-weight: 500;
+                        }
                     }
                 }
             }
@@ -577,7 +756,7 @@ export default {
                     }
 
                     &.today {
-                        background-color: rgba(39, 178, 95, 0.1);
+                        background-color: rgba(39, 178, 95, 0.15);
                         border: 2rpx solid @primary;
                     }
 
@@ -621,6 +800,55 @@ export default {
             }
         }
 
+        /* 空状态样式 */
+        .emptyState,
+        .emptySchedule {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            padding: 80rpx 40rpx;
+            text-align: center;
+            background: #fff;
+            border-radius: 16rpx;
+            margin-bottom: 32rpx;
+            box-shadow: @shadow;
+
+            .emptyIcon {
+                font-size: 80rpx;
+                margin-bottom: 24rpx;
+                opacity: 0.6;
+            }
+
+            .emptyText {
+                font-size: 32rpx;
+                color: #2c3e50;
+                font-weight: 600;
+                margin-bottom: 16rpx;
+            }
+
+            .emptyDesc {
+                font-size: 24rpx;
+                color: #666;
+                line-height: 1.5;
+                margin-bottom: 32rpx;
+            }
+
+            .retryBtn {
+                background: @primary;
+                color: #fff;
+                border: none;
+                border-radius: 24rpx;
+                padding: 16rpx 32rpx;
+                font-size: 24rpx;
+                font-weight: 600;
+
+                &::after {
+                    border: none;
+                }
+            }
+        }
+
     }
 }
 </style>