feat(common): 优化考勤页面布局和功能

- 调整考勤记录的显示格式，增加对请假记录的支持
- 添加请假日期和时间选择功能
- 优化校园选择和备注输入界面
- 修复了一些小的显示问题，如空值显示等

pages/common/my_attendance.vue

@@ -28,25 +28,31 @@
                   @click="openInfo(v)"
             >
               <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">
                   {{v.status_name}}
                 </view>
                 <view class="content">
-                  校区：{{v.campus_id_name}}
+                  校区：{{v.campus_id_name || ''}}
                 </view>
                 <view class="content">
                   备注：{{v.remarks || ''}}
                 </view>
                 <view class="content">
-                  <text>{{v.attendance_date}} {{v.check_in_time}}</text>
+                  <view class="item" v-if="v.status != 'leave'">
-                  <text v-if="v.check_out_time" style="padding: 0 20rpx">-</text>
+                    <!--考勤-->
-                  <text v-if="v.check_out_time">{{v.attendance_date}} {{v.check_out_time}}</text>
+                    <text>开始时间：{{ v.attendance_date }} {{ v.check_in_time || '' }}</text>
+                    <text v-if="v.check_out_time">结束时间：{{ v.attendance_date }} {{ v.check_out_time || '' }}</text>
+                  </view>
+
+                  <!--请假-->
+                  <view class="item" v-else>
+                    <text>开始时间：{{ v.attendance_date }} {{v.leave_start_time || ''}}</text>
+                    <text>结束时间：{{ v.attendance_date }} {{v.leave_end_time || ''}}</text>
+                  </view>
                 </view>
               </view>
+              <view class="right"></view>
             </view>
           </view>
 
@@ -67,7 +73,21 @@
                   :key="k"
             >
               <view class="left">
-                <!--                <image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>-->
+                <view class="content">普通考勤</view>
+                <view class="content">
+                  {{v.status_name}}
+                </view>
+                <view class="content">
+                  校区：{{v.campus_id_name}}
+                </view>
+                <view class="content">
+                  备注：{{v.remarks || ''}}
+                </view>
+                <view class="content">
+                  <text>{{v.attendance_date}} {{v.check_in_time}}</text>
+                  <text v-if="v.check_out_time" style="padding: 0 20rpx">-</text>
+                  <text v-if="v.check_out_time">{{v.attendance_date}} {{v.check_out_time}}</text>
+                </view>
               </view>
               <view class="right">
                 <view class="content">普通考勤</view>
@@ -105,7 +125,21 @@
                   :key="k"
             >
               <view class="left">
-                <!--                <image src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png" model="aspectFill"></image>-->
+                <view class="content">普通考勤</view>
+                <view class="content">
+                  {{v.status_name}}
+                </view>
+                <view class="content">
+                  校区：{{v.campus_id_name}}
+                </view>
+                <view class="content">
+                  备注：{{v.remarks || ''}}
+                </view>
+                <view class="content">
+                  <text>{{v.attendance_date}} {{v.check_in_time}}</text>
+                  <text v-if="v.check_out_time" style="padding: 0 20rpx">-</text>
+                  <text v-if="v.check_out_time">{{v.attendance_date}} {{v.check_out_time}}</text>
+                </view>
               </view>
               <view class="right">
                 <view class="content">普通考勤</view>
@@ -150,8 +184,69 @@
       <text class="fui-descr">{{signIn_content}}</text>
       <fui-form class="form-section" ref="form" top="0" :model="formData" :show="false">
         <view class="input-style">
+<!--          请假日期选择-->
+          <fui-form-item
+              v-if="formData.status == 'leave'"
+              label="选择日期"
+              asterisk
+              asteriskPosition="right"
+              labelSize='26'
+              prop=""
+              background='#fff'
+              labelColor='#000'
+              :bottomBorder='true'
+          >
+            <view class="input-title" style="margin-right:14rpx;">
+              <view
+                  class="input-title"
+                  style="margin-right:14rpx;"
+                  @click="openLeaveData()">
+                {{ (formData.attendance_date) ? formData.attendance_date : '点击选择' }}
+              </view>
+              <fui-date-picker
+                  :show="showLeaveData"
+                  type="3"
+                  :minDate="leaveMinDate"
+                  :maxDate="leaveMaxDate"
+                  @change="changeLeaveData"
+                  @cancel="cancelLeaveData"
+              ></fui-date-picker>
+            </view>
+          </fui-form-item>
+
+<!--          请假时间选择-->
+          <fui-form-item
+              v-if="formData.status == 'leave'"
+              label="选择时间范围"
+              asterisk
+              asteriskPosition="right"
+              labelSize='26'
+              prop=""
+              background='#fff'
+              labelColor='#000'
+              :bottomBorder='true'
+          >
+            <view class="input-title" style="margin-right:14rpx;">
+              <view
+                  class="input-title"
+                  style="margin-right:14rpx;"
+                  @click="openLeaveStartTime()">
+                {{ (formData.leave_time) ? formData.leave_time : '点击选择' }}
+              </view>
+              <fui-date-picker
+                  :show="showLeaveStartTime"
+                  range
+                  type="6"
+                  @change="changeLeaveStartTime"
+                  @cancel="cancelLeaveStartTime"
+              ></fui-date-picker>
+
+            </view>
+          </fui-form-item>
+
           <!--校区选择-->
           <fui-form-item
+              v-if="picker_options.length"
               label="选择校区"
               asterisk
               asteriskPosition="right"
@@ -172,7 +267,6 @@
           </fui-form-item>
           <!--备注-->
           <fui-form-item
-              v-if="formData.status == 'leave'"
               label="备注"
               labelSize='26'
               prop=""
@@ -256,7 +350,7 @@
 
 
 
-    <!-- 选择器 -->
+    <!-- 校区下拉选择器 -->
     <fui-picker
         :linkage='picker_linkage'
         :options="picker_options"
@@ -266,6 +360,10 @@
         @cancel="cancelCicker">
     </fui-picker>
 
+<!--    请假日期选择器-->
+
+<!--    请假时间范围选择器-->
+
   </view>
 </template>
 
@@ -324,6 +422,9 @@ export default {
         status:'',//考勤状态: present-出勤, absent-缺勤, late-迟到, leave_early-早退,leave-请假,sign_out-签退
         remarks:'',//备注
         attendance_date:'',//请假/打卡日期
+        leave_time:'',//请假时间范围
+        leave_start_time:'',//请假开始时间
+        leave_end_time:'',//请假结束时间
         longitude:'',//经度
         latitude:'',//纬度
       },
@@ -349,6 +450,16 @@ export default {
         // },
       ],//选择器可选值列表
 
+      //请假日期选择器相关
+      showLeaveData:false,
+      leaveMinDate:'',//请假日期选择器的最小可选日期
+      leaveMaxDate:'',//请假日期选择器的最大可选日期
+
+      //请假开始时间选择器相关
+      showLeaveStartTime:false,
+
+
+
       //详情模态窗
       info_show:false,//是否展示|true=是,false=否
       info_data:{},//详情数据
@@ -399,11 +510,20 @@ export default {
       this.userInfo = res.data
       this.picker_options = []
       res.data.cameus_dept_arr.forEach((v,k)=>{
+        if(v.campus_id){
           this.picker_options.push({
             text: v.campus_id_name,
             value: v.campus_id
           })
+        }
       })
+
+      //当前用户没校区时
+      if(!this.picker_options.length){
+        this.formData.campus_id = 0
+        this.formData.campus_id_name = ''
+      }
+
       console.log(123123,this.picker_options)
     },
 
@@ -420,7 +540,17 @@ export default {
 
 
       this.formData.attendance_date = res
-    },
+
+      //最小可选的请假日期
+      this.leaveMinDate = res
+
+      //最大可选的请假日期
+      const minDate = new Date(this.leaveMinDate);
+      minDate.setMonth(minDate.getMonth() + 6);
+      const max_year = minDate.getFullYear();
+      const max_month = String(minDate.getMonth() + 1).padStart(2, '0');
+      const max_day = String(minDate.getDate()).padStart(2, '0');
+      this.leaveMaxDate = `${max_year}-${max_month}-${max_day}`;    },
 
     //切换tag列表
     async segmented(e) {
@@ -773,6 +903,43 @@ export default {
       return [data];
     },
 
+    //请假日期相关
+    //监听-请假日期选择
+    changeLeaveData(e){
+      console.log('请假日期选择',e)
+      this.formData.attendance_date = e.result
+      this.cancelLeaveData()
+    },
+    //打开请假日期选择器
+    openLeaveData(){
+      this.showLeaveData = true
+    },
+    //关闭请假日期选择器
+    cancelLeaveData(){
+      this.showLeaveData = false
+    },
+
+    //监听-请假开始时间选择
+    changeLeaveStartTime(e){
+      console.log('请假开始时间选择',e)
+      let leave_start_time = e.startDate.result
+      let leave_end_time = e.endDate.result
+
+      this.formData.leave_time = `${leave_start_time}-${leave_end_time}`
+
+      this.formData.leave_start_time = leave_start_time
+      this.formData.leave_end_time = leave_end_time
+      this.cancelLeaveStartTime()
+    },
+    //打开请假日期选择器
+    openLeaveStartTime(){
+      this.showLeaveStartTime = true
+    },
+    //关闭请假日期选择器
+    cancelLeaveStartTime(){
+      this.showLeaveStartTime = false
+    },
+
   }
 }
 </script>
@@ -825,24 +992,24 @@ export default {
         align-items: center;
         gap: 43rpx;
         .left{
-          image{
+          border: 1px solid red;
-            width: 174rpx;
-            height: 174rpx;
-            border-radius: 24rpx;
-            background-color: #333333;
-          }
-        }
-        .right{
           display: flex;
           flex-direction: column;
           gap: 18rpx;
           .content{
             font-size: 24rpx;
+            .item{
+              display: flex;
+              flex-direction: column;
+            }
           }
           .content:nth-child(1){
             font-size: 28rpx;
           }
         }
+        .right{
+          border: 1px solid red;
+        }
       }
     }
     .title_box{
@@ -856,6 +1023,7 @@ export default {
   }
 
   .section_btn{
+    margin-top: 20rpx;
     display: flex;
     justify-content: center;
     display: flex;
@@ -901,6 +1069,9 @@ export default {
 
   .input-style {
     text-align: right !important;
+    .input-title{
+      border: 1px solid red;
+    }
   }
   .button_box{
     margin-top: 30rpx;

pages/market/my/index.vue

@@ -23,12 +23,12 @@
         <view class="bottom" v-for="(v,k) in userInfo.cameus_dept_arr">
           <view class="left">
             <view class="title">校区：</view>
-            <view class="title">{{v.campus_id_name}}</view>
+            <view class="title">{{v.campus_id_name || ''}}</view>
           </view>
           <view class="division"></view>
           <view class="right">
             <view class="title">部门：</view>
-            <view class="title dept">{{v.dept_name_str}}</view>
+            <view class="title dept">{{v.dept_name_str || ''}}</view>
           </view>
         </view>
       </view>
@@ -279,7 +279,8 @@ export default {
 
     /* 小程序端样式 */
     // #ifdef MP-WEIXIN
-    padding: 80rpx 0rpx;
+    padding-top: 110rpx;
+    padding-bottom: 40rpx;
     // #endif
 
     font-size: 30rpx;

pages/student/my/my.vue

@@ -174,7 +174,7 @@
 <style lang="less" scoped>
 	.main_box {
 		background: #292929;
-		min-height: 28vh;
+    height: 100%;
 	}
 
 	//自定义导航栏