From 9ad048e36bef6d735bf0ef0c12698696e7d5100b Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期二, 23 四月 2024 18:36:35 +0800
Subject: [PATCH] 考勤统计的列表联调+表头动态数据重组的逻辑处理+详情数据的重组问题+更新考勤的接口联调

---
 src/views/employeeSalary/attendanceStatistics/index.vue |  203 +++++++++++++++++++++++++++++++-------------------
 1 files changed, 127 insertions(+), 76 deletions(-)

diff --git a/src/views/employeeSalary/attendanceStatistics/index.vue b/src/views/employeeSalary/attendanceStatistics/index.vue
index 97b3de6..836dfb2 100644
--- a/src/views/employeeSalary/attendanceStatistics/index.vue
+++ b/src/views/employeeSalary/attendanceStatistics/index.vue
@@ -12,11 +12,13 @@
         >
           <template slot="leftButton">
             <div class="margin_right_20px" style="width:200px;">
-              <el-date-picker v-model="object.date" style="width:100%" type="month" placeholder="閫夋嫨鏃ユ湡"
+              <el-date-picker v-model="object.date" style="width:100%"
+              @change="onFilterSearch"
+              :clearable="false" type="month" placeholder="閫夋嫨鏃ユ湡"
+              :picker-options="pickerOptions"
                 value-format="yyyy-MM">
               </el-date-picker>
             </div>
-            <el-button size="small" type="primary" @click="ruleSettingClick">瑙勫垯璁剧疆</el-button>
           </template>
         </CommonSearch>
       </div>
@@ -30,34 +32,25 @@
             v-loading="loading"
             :table-list="tableList"
             @selTableCol="selTableCol"
+            @selCommonClick="(row,prop,item) => selCommonClick(row,prop,item)"
           >
-            <template slot="tableButton">
-              <el-table-column label="鎿嶄綔" width="90" fixed="right">
-                <template slot-scope="scope">
-                  <el-button @click="delClick(scope.row.id)" type="text" size="small">鍒犻櫎</el-button>
-                </template>
-              </el-table-column>
-            </template>
           </TableCommonView>
         </div>
-        <div class="btn-pager">
+        <!-- <div class="btn-pager">
           <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
-        </div>
+        </div> -->
       </div>
     </div>
-    <AttendanceStatisticsDetails ref="attendanceStatisticsDetails" :editRow="editRow"  @shutdown="getData" />
-     <!-- 瑙勫垯璁剧疆 -->
-     <RuleSettingDialog ref="RuleSettingDialog" :editRow="editRow"  @closeClick="getData" />
+    <AttendanceStatisticsDetails ref="attendanceStatisticsDetails" :editRow="editRow"  @shutdown="getData" />  
   </div>
 </template>
 
 <script>
-import { getFollowRecordList, getDeleteFollowRecord } from "@/api/employeeSalary/attendanceStatistics.js"
+import { getAttendanceStatistic } from  "@/api/employeeSalary/attendanceManage.js"
 import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
 import AttendanceStatisticsDetails from  "@/views/employeeSalary/attendanceStatistics/components/AttendanceStatisticsDetails"
-import RuleSettingDialog from  "@/views/employeeSalary/attendanceStatistics/components/RuleSettingDialog"
-import Date from "@/api/date";
-const { getCurrentMonth } = Date;
+import NewDate from "@/api/date";
+const { getCurrentMonth } = NewDate;
 export default {
   name: "attendanceStatistics",
   props: {
@@ -65,12 +58,16 @@
   mixins: [pageMixin],
   components: {
     AttendanceStatisticsDetails,
-    RuleSettingDialog
   },
   data() {
     return {
       tableList: {},
       loading: false,
+      pickerOptions: {
+        disabledDate(time) {
+          return time.getTime() > new Date().getTime() - 86400000;
+        },
+      },
       object:{
         date:getCurrentMonth()
       },
@@ -83,21 +80,18 @@
         title: "鏂板缓",
         infomation: {}
       },
-      search_map: {},
+      keyword: "",
       tableColumn: [
-        { label: "濮撳悕", prop: "topic", min: 120, default: true }, 
-        { label: "浜哄憳ID", prop: "client_name", min: 190,default: true}, 
-        { label: "宸ョ", prop: "contact_name", min: 100, },
-        { label: "鏈堜唤", prop: "client_status", min: 100 },
-        { label: "1/鍛ㄤ竴", prop: "client_status", min: 100 },
-        { label: "宸ヤ綔鏃ュ姞鐝椂闀�(灏忔椂)", prop: "contact_information_name", min: 180 }, 
-        { label: "浼戞伅鏃ュ姞鐝椂闀�(灏忔椂)", prop: "follow_time", min: 180 },
-        { label: "搴斿嚭鍕ゅぉ鏁�", prop: "next_follow_time", min: 110 },
-        { label: "瀹為檯鍑哄嫟澶╂暟", prop: "member_name", min: 110 }, 
+        { label: "濮撳悕", prop: "workerName", min: 120, default: true }, 
+        { label: "浜哄憳ID", prop: "workerId", min: 190,default: true}, 
+        { label: "宸ョ", prop: "workType", min: 100, },
+        { label: "鏈堜唤", prop: "month", min: 100 },
+        { label: "宸ヤ綔鏃ュ姞鐝椂闀�(灏忔椂)", prop: "weekdayOverTime", min: 180 }, 
+        { label: "浼戞伅鏃ュ姞鐝椂闀�(灏忔椂)", prop: "restDayOverTime", min: 180 },
+        { label: "搴斿嚭鍕ゅぉ鏁�", prop: "requiredAttendanceDays", min: 110 },
+        { label: "瀹為檯鍑哄嫟澶╂暟", prop: "actualAttendanceDays", min: 110 }, 
       ],
       showCol: [
-        "濮撳悕",
-        "浜哄憳ID",
         "宸ョ",
         "鏈堜唤",
         "宸ヤ綔鏃ュ姞鐝椂闀�(灏忔椂)",
@@ -109,7 +103,7 @@
   },
   created() {
     this.setTable()
-    this.getData(this.search_map)
+    this.getData(this.keyword)
   },
   computed: {
   },
@@ -117,6 +111,7 @@
     setTable() {
       this.tableList = {
         selectIndex: true,
+        isFixed:true,
         tableInfomation: [],
         allcol: [],
         showcol: this.showCol,
@@ -134,39 +129,74 @@
       return this.tableColumn.map((ele) => {
         return {
           ...ele,
-          isShowColumn: showCol.includes(ele.label)
+          isShowColumn:ele.default?true:showCol.includes(ele.label)
         }
       })
     },
     selTableCol(val) {
-      this.showcol = val
-      this.tableList.tableColumn = this.setColumnVisible(val)
+      this.showcol = val;
+      this.tableList.tableColumn = this.setColumnVisible(val);
     },
     // 璇锋眰鏁版嵁
     async getData() {
       this.loading = true
-      await getFollowRecordList({
-        search_map: this.search_map,
-        page: this.pagerOptions.currPage,
-        pageSize: this.pagerOptions.pageSize
+      await getAttendanceStatistic({
+        keyword: this.keyword,
+        month:this.object.date,
+        // page: this.pagerOptions.currPage,
+        // pageSize: this.pagerOptions.pageSize
       })
         .then((res) => {
           console.log(res)
           if (res.code === 200) {
             if (res.data.list && res.data.list.length > 0) {
+              let tableColumn1= [
+                { label: "濮撳悕", prop: "workerName", min: 120,default: true,fixed:'left' }, 
+                { label: "浜哄憳ID", prop: "workerId", min: 120,default: true,fixed:'left'}, 
+                { label: "宸ョ", prop: "workType", min: 100,fixed:'left' },
+                { label: "鏈堜唤", prop: "month", min: 90 ,fixed:'left'},
+              ];
+              let tableColumn3=[
+                { label: "宸ヤ綔鏃ュ姞鐝椂闀�(灏忔椂)", prop: "weekdayOverTime", min: 140,fixed:'right'}, 
+                { label: "浼戞伅鏃ュ姞鐝椂闀�(灏忔椂)", prop: "restDayOverTime", min: 140,fixed:'right' },
+                { label: "搴斿嚭鍕ゅぉ鏁�", prop: "requiredAttendanceDays", min: 110 ,fixed:'right'},
+                { label: "瀹為檯鍑哄嫟澶╂暟", prop: "actualAttendanceDays", min: 110,fixed:'right'}, 
+              ]
+              let tableColumn2=[]
+              let headerList=res.data.list.length>0?res.data.list[0]:[]
+                if(headerList.details&&headerList.details.length>0){
+                  for(let i in headerList.details){
+                    tableColumn2.push({
+                      label:headerList.details[i].date+'',
+                      prop:'headerDate'+headerList.details[i].date,
+                      min:100,
+                      default:true,
+                      isCallMethod:true,
+                      isClass: true,
+                      getClassName:this.getHeaderClass,
+                      getCallMethod: this.getHeaderDate,
+                      isCommonClick:true,
+                      isIcon:true,
+                    })
+                  }
+                }
+               
+              let tableColumn=tableColumn1.concat(tableColumn2).concat(tableColumn3)
+              this.tableColumn=tableColumn;
+              this.setTable()
               const list = res.data.list.map((item) => {
+                let headerItem={}
+                let details=item.details?item.details:[]
+                for(let i in details){
+                  headerItem['headerDate'+details[i].date]=details[i].status
+                }
                 return {
                   ...item,
-                  client_name: item.client.name,
-                  contact_name: item.contact.name,
-                  client_status: item.client_status.name,
-                  phone: item.contact.phone,
-                  member_name: item.member.username,
-                  contact_information_name: item.contact_information.name
+                  ...headerItem,
                 }
               })
               this.tableList.tableInfomation = list || []
-              this.pagerOptions.totalCount = res.data.count
+              this.pagerOptions.totalCount = res.total
             } else {
               this.tableList.tableInfomation = []
             }
@@ -181,41 +211,62 @@
           this.loading = false
         })
     },
+    getHeaderDate(val){
+      let string=''
+       // 1==姝e父 2===鍔犵彮 3==浼戝亣 4===寮傚父
+      if(val==1){
+        string="<i class='el-icon-circle-check'></i>"
+      }else if(val==2){
+        string='鐝�'
+      }else if(val==3){
+        string='浼�'
+      }else if(val==4){
+        string='寮�'
+      }
+      return string
+    },
+    getHeaderClass(val){
+      let classname=''
+       // 1==姝e父 2===鍔犵彮 3==浼戝亣 4===寮傚父
+      if(val==1){
+        classname = "color_67c23a font_weight_700 font_size_20";
+      }else if(val==2){
+        classname = "color_FF9900  font_weight_700";
+      }else if(val==3){
+        classname = "color_333  font_weight_700";
+      }else if(val==4){
+        classname = "color_red  font_weight_700";
+      }
+      return classname
+    },
     // 鎼滅储
     onFilterSearch(searchText) {
-      this.search_map.client_name = searchText ?? ""
+      this.keyword = searchText ?? ""
       this.pagerOptions.currPage = 1
       this.getData()
     },
-    // 璇︽儏
-    detailsClick(row) {
+    selCommonClick(row,prop,item){
+      
       let config=JSON.parse(JSON.stringify(row));
-      this.editRow = { ...config, title:'缂栬緫',type:'add' }
-      this.$refs.addWorkKind.islook = true;
-    },
-     // 鎵撳嵃
-     ruleSettingClick(){
-      this.$refs.RuleSettingDialog.islook = true;
-    },
-    
-    // 鍒犻櫎
-    delClick(id) {
-      this.$confirm("鏄惁纭鍒犻櫎?", "璀﹀憡", {
-        confirmButtonText: "纭畾",
-        cancelButtonText: "鍙栨秷",
-        type: "warning"
-      })
-        .then(() => {
-          getDeleteFollowRecord({ ids: [id] }).then((response) => {
-            if (response.code === 200) {
-              this.$message.success("鍒犻櫎鎴愬姛")
-              this.getData()
-            } else {
-              this.$message.warning("鍒犻櫎澶辫触")
-            }
-          })
-        })
-        .catch(() => {})
+      let details=config.details
+      let headerItem={}
+      for(let i in details){
+        if(details[i].date==item.label){
+          headerItem.classes=details[i].classes
+          headerItem.classesEndTime=details[i].classesEndTime
+          headerItem.classesStartTime=details[i].classesStartTime
+          headerItem.endWorkTime=details[i].endWorkTime
+          headerItem.startWorkTime=details[i].startWorkTime
+          headerItem.status=details[i].status
+          headerItem.dateDay=details[i].date
+          break;
+        }
+      }
+      this.editRow = { 
+        ...config, 
+        ...headerItem,
+      }
+      this.$refs.attendanceStatisticsDetails.islook = true;
     },
   }
 }
@@ -254,7 +305,7 @@
       overflow: hidden;
     }
     .list-view {
-      height: calc(100% - 60px);
+      height: calc(100% - 10px);
       overflow: hidden;
     }
     .btn-pager {

--
Gitblit v1.8.0