From 18d4b9abbed9761e642dc51d6c98c62a33b7c958 Mon Sep 17 00:00:00 2001
From: lSun <15893999301@qq.com>
Date: Wed, 18 Dec 2024 16:55:46 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=BA=E5=91=98=E4=BF=A1=E6=81=AF=E3=80=81?=
 =?UTF-8?q?=E5=87=BA=E5=B7=AE=E6=8A=A5=E5=A4=87=E5=8A=9F=E8=83=BD=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/report/dayReport.js           |   15 +-
 src/views/components/commonDialog.vue | 1021 +++++++++++++------------
 src/views/dashboard/topOne.vue        |  659 ++++++++--------
 src/views/report/attReport/index.vue  |    3 +-
 src/views/system/user/index.vue       |    2 +-
 src/views/system/userInfo/index.vue   |   15 +-
 6 files changed, 906 insertions(+), 809 deletions(-)

diff --git a/src/api/report/dayReport.js b/src/api/report/dayReport.js
index 6448094..87f328d 100644
--- a/src/api/report/dayReport.js
+++ b/src/api/report/dayReport.js
@@ -9,7 +9,7 @@ export function getdayAttReport(query) {
     params: query
   })
 }
- 
+
 // 查询列表
 export function getAttDayReportDetailsList(query) {
   return request({
@@ -18,7 +18,7 @@ export function getAttDayReportDetailsList(query) {
     params: query
   })
 }
- 
+
 // 导出
 export function exportDayReport(query) {
   return request({
@@ -27,4 +27,13 @@ export function exportDayReport(query) {
     responseType: 'blob',
     params: query
   })
-}
\ No newline at end of file
+}
+
+// 查询列表
+export function getAttDayList(query) {
+  return request({
+    url: '/system/attDetails/getAttDayList',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/src/views/components/commonDialog.vue b/src/views/components/commonDialog.vue
index 88ab588..848d017 100644
--- a/src/views/components/commonDialog.vue
+++ b/src/views/components/commonDialog.vue
@@ -1,516 +1,545 @@
 <template>
-    <div class="wrapper">
-        <el-dialog
-            style="margin-top: 5vh"
-            :title="title"
-            :visible.sync="open"
-            width="80%"
-            append-to-body
-            :close-on-click-modal="false"
-            @close="closeDialog"
+  <div class="wrapper">
+    <el-dialog
+      style="margin-top: 5vh"
+      :title="title"
+      :visible.sync="open"
+      width="80%"
+      append-to-body
+      :close-on-click-modal="false"
+      @close="closeDialog"
+    >
+      <div class="content">
+        <el-form
+          :model="queryParams"
+          ref="queryFormRef"
+          size="medium"
+          :inline="true"
+          label-width="80px"
+          style="margin-bottom: 20px"
         >
-            <div class="content">
-                <el-form
-                    :model="queryParams"
-                    ref="queryFormRef"
-                    size="medium"
-                    :inline="true"
-                    label-width="80px"
-                    style="margin-bottom: 20px"
-                >
-                    <el-form-item label="选择月份" v-if="status == 12">
-                      <el-date-picker
-                        v-model="queryParams.month"
-                        type="month" value-format="yyyy-MM"
-                        placeholder="选择月">
-                      </el-date-picker>
-                    </el-form-item>
-                    <el-form-item
-                        label="姓名"
-                        prop="userName"
-                    >
-                        <el-input
-                            v-model="queryParams.userName"
-                            placeholder="请输入姓名"
-                            clearable
-                            style="width: 240px"
-                        />
-                    </el-form-item>
-                    <el-form-item label="部门" prop="orgId" v-if="status == 12">
-                        <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" placeholder="选择部门" style="width: 240px"/>
-                    </el-form-item>
-                    <el-form-item label="状态" prop="attStatus" v-if="status == 12">
-                      <el-select
-                        v-model="queryParams.attStatus"
-                        placeholder="状态"
-                        clearable
-                        style="width: 240px"
-                      >
-                        <el-option
-                          v-for="dict in dict.type.att_status"
-                          :key="dict.value"
-                          :label="dict.label"
-                          :value="dict.value"
-                        />
-                      </el-select>
-                    </el-form-item>
-                    <!-- <el-form-item
-                        label="设备编号"
-                        prop="devCode"
-                        v-if="status <= 8"
-                    >
-                        <el-input
-                            v-model="queryParams.devCode"
-                            placeholder="请输入设备编号"
-                            clearable
-                            style="width: 240px"
-                        />
-                    </el-form-item>
-                    <el-form-item
-                        label="工程名称"
-                        prop="proName"
-                        v-if="status > 8"
-                    >
-                        <el-input
-                            v-model="queryParams.proName"
-                            placeholder="请输入工程名称"
-                            clearable
-                            style="width: 240px"
-                        />
-                    </el-form-item>
-                    <el-form-item
-                        label="工程类型"
-                        prop="proType"
-                        v-if="status === 9"
-                    >
-                      <el-select
-                        v-model="queryParams.proType"
-                        clearable
-                        filterable
-                        placeholder="请选择"
-                      >
-                        <el-option
-                          v-for="item in proTypeRange"
-                          :key="item.value"
-                          :label="item.label"
-                          :value="item.value"
-                        />
-                      </el-select>
-                    </el-form-item>
-                    <el-form-item label="日期" prop="date" v-if="status > 11">
-                        <el-date-picker
-                            v-model="queryParams.date"
-                            style="width: 240px"
-                            type="daterange"
-                            value-format="yyyy-MM-dd"
-                            range-separator="-"
-                            start-placeholder="开始日期"
-                            end-placeholder="结束日期"
-                        />
-                    </el-form-item> -->
-                    <el-button
-                        style="margin-top: 3px"
-                        type="primary"
-                        icon="el-icon-search"
-                        size="mini"
-                        @click="getTableList(currentFunc)"
-                        >搜索</el-button
-                    >
-                </el-form>
+          <el-form-item label="选择月份" v-if="status == 12">
+            <el-date-picker
+              v-model="queryParams.month"
+              type="month" value-format="yyyy-MM"
+              placeholder="选择月">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item
+            label="姓名"
+            prop="userName"
+          >
+            <el-input
+              v-model="queryParams.userName"
+              placeholder="请输入姓名"
+              clearable
+              style="width: 240px"
+            />
+          </el-form-item>
 
-                <el-table
-                    :data="tableList"
-                    border
-                    ref="tableRef"
-                    width="100%" height="500px"
-                    v-loading="loading"
-                   
-                >
-                    <el-table-column type="index" label="序号" align="center" width="80">
-                      <!-- 使用 `index` 方法自定义索引，传入当前行数据和行索引 -->
-                      <template slot-scope="scope">
-                        {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
-                      </template>
-                    </el-table-column>
-                    <el-table-column
-                        v-for="(item, v) in columnList"
-                        :key="v"
-                        :label="item.t_label"
-                        :prop="item.t_props"
-                        :width="item.t_width"
-                        align="center"
-                        show-overflow-tooltip
-                    >
-                        <template slot-scope="scope">
-                          <template v-if="item.t_slot === 'attStatus'">
-                            <dict-tag :options="dict.type.att_status" :value="scope.row[item.t_props]"/>
-                          </template>
+          <el-form-item label="状态" prop="attStatusToday" v-if="status == 1">
+            <el-select
+              v-model="queryParams.attStatusToday"
+              placeholder="状态"
+              clearable
+              style="width: 240px"
+            >
+              <el-option
+                v-for="dict in dict.type.att_status"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
 
-                          <template v-else-if="item.t_slot === 'attCurrentDay'">
-                            <span>{{ formatWeekday(scope.row[item.t_props]) }}</span>
-                          </template>
+          <el-form-item label="部门" prop="orgId" v-if="status == 12">
+            <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer"
+                        placeholder="选择部门" style="width: 240px"/>
+          </el-form-item>
+          <el-form-item label="状态" prop="attStatus" v-if="status == 12">
+            <el-select
+              v-model="queryParams.attStatus"
+              placeholder="状态"
+              clearable
+              style="width: 240px"
+            >
+              <el-option
+                v-for="dict in dict.type.att_status"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+          <!-- <el-form-item
+              label="设备编号"
+              prop="devCode"
+              v-if="status <= 8"
+          >
+              <el-input
+                  v-model="queryParams.devCode"
+                  placeholder="请输入设备编号"
+                  clearable
+                  style="width: 240px"
+              />
+          </el-form-item>
+          <el-form-item
+              label="工程名称"
+              prop="proName"
+              v-if="status > 8"
+          >
+              <el-input
+                  v-model="queryParams.proName"
+                  placeholder="请输入工程名称"
+                  clearable
+                  style="width: 240px"
+              />
+          </el-form-item>
+          <el-form-item
+              label="工程类型"
+              prop="proType"
+              v-if="status === 9"
+          >
+            <el-select
+              v-model="queryParams.proType"
+              clearable
+              filterable
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in proTypeRange"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="日期" prop="date" v-if="status > 11">
+              <el-date-picker
+                  v-model="queryParams.date"
+                  style="width: 240px"
+                  type="daterange"
+                  value-format="yyyy-MM-dd"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+              />
+          </el-form-item> -->
+          <el-button
+            style="margin-top: 3px"
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="getTableList(currentFunc)"
+          >搜索
+          </el-button
+          >
+        </el-form>
 
-                          <template v-else-if="item.t_slot === 'examineStatus'">
-                            <span v-if="scope.row[item.t_props]==0">{{ '待审核' }}</span>
-                            <span v-if="scope.row[item.t_props]==1">{{ '通过' }}</span>
-                            <span v-if="scope.row[item.t_props]==2">{{ '不通过' }}</span>
-                            <span v-if="scope.row[item.t_props]==3">{{ '已撤回' }}</span>
-                            <span v-else>{{  }}</span>
-                          </template>
-                        
-                          <template v-else>
-                            {{ scope.row[item.t_props] || '-' }}
-                          </template>
-                        </template>
-                    </el-table-column>
-                </el-table>
+        <el-table
+          :data="tableList"
+          border
+          ref="tableRef"
+          width="100%" height="500px"
+          v-loading="loading"
 
-                <pagination
-                    :total="total"
-                    :page.sync="queryParams.pageNum"
-                    :limit.sync="queryParams.pageSize"
-                    @pagination="getTableList(currentFunc, currentParam)"
-                />
-            </div>
-        </el-dialog>
+        >
+          <el-table-column type="index" label="序号" align="center" width="80">
+            <!-- 使用 `index` 方法自定义索引，传入当前行数据和行索引 -->
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            v-for="(item, v) in columnList"
+            :key="v"
+            :label="item.t_label"
+            :prop="item.t_props"
+            :width="item.t_width"
+            align="center"
+            show-overflow-tooltip
+          >
+            <template slot-scope="scope">
+              <template v-if="item.t_slot === 'attStatus'">
+                <dict-tag :options="dict.type.att_status" :value="scope.row[item.t_props]"/>
+              </template>
 
-       
-         
-       
-    </div>
+              <template v-else-if="item.t_slot === 'attCurrentDay'">
+                <span>{{ formatWeekday(scope.row[item.t_props]) }}</span>
+              </template>
+
+              <template v-else-if="item.t_slot === 'examineStatus'">
+                <span v-if="scope.row[item.t_props]==0">{{ '待审核' }}</span>
+                <span v-if="scope.row[item.t_props]==1">{{ '通过' }}</span>
+                <span v-if="scope.row[item.t_props]==2">{{ '不通过' }}</span>
+                <span v-if="scope.row[item.t_props]==3">{{ '已撤回' }}</span>
+                <span v-else>{{  }}</span>
+              </template>
+
+              <template v-else>
+                {{ scope.row[item.t_props] || '-' }}
+              </template>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <pagination
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getTableList(currentFunc, currentParam)"
+        />
+      </div>
+    </el-dialog>
+
+
+  </div>
 </template>
 
 <script>
- import { listDept } from "@/api/system/dept";
+import {listDept} from "@/api/system/dept";
 import Treeselect from "@riophae/vue-treeselect";
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";   
-import { getDetailsList } from "@/api/report/attReport";
-import { getAttDayReportDetailsList } from "@/api/report/dayReport";
-import { getDetailExceptionAll } from "@/api/dashboard";
-export default {
-    name: 'commonDialog',
-    dicts: ['att_status'],
-    components: {
-      Treeselect
-    },
-    data() {
-        return {
-            total: 0,
-            loading: false,
-            status: undefined,
-            queryParams: {
-                month:undefined,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            title:"",
-            open: false,
-            deptOptions: [],
-            tableList: [],
-            columnList: [],
-            additionalList: [],
-            currentFunc: undefined,
-            currentParam: undefined,
-            
-            proTypeRange: [
-              { label: '变电工程', value: '1' },
-              { label: '线路工程', value: '2' },
-              { label: '电缆工程', value: '3' },
-            ]
-        }
-    },
-    mounted() {  
-      
-      this.getDeptList();
-    },
-    methods: {
-        getMonth(){
-          // 默认当月
-          var nowDate = new Date();
-          var date = {
-            year: nowDate.getFullYear(),
-            month: nowDate.getMonth() + 1,
-            day: nowDate.getDate()
-          };
-          const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
-          this.$set(this.queryParams, "month", dayDate.toString());
-        },
-        getMonthDate() {
-          const str=this.queryParams.month+'-01'; 
-          // 获取当前日期
-          var currentDate = new Date(str);
-          // 获取当前月份的第一天
-          var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
-          let firstDay = this.formatDate(firstDayOfMonth) 
-          // 获取当前月份的最后一天
-          var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
-          let lastDay = this.formatDate(lastDayOfMonth) 
-          return [firstDay,lastDay]
-        },
-        formatDate(dateString){
-          const date = new Date(dateString); // 创建日期对象
-          const year = date.getFullYear(); // 获取年份
-          const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始）
-          const day = String(date.getDate()).padStart(2, '0'); // 获取日期
-          return `${year}-${month}-${day}`; // 组合成所需格式
-        },
-        formatWeekday(dateString){
-          const date = new Date(dateString); // 创建日期对象
-          const year = date.getFullYear(); // 获取年份
-          const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始）
-          const day = String(date.getDate()).padStart(2, '0'); // 获取日期
-          const weekdays = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']; // 星期几数组
-          const weekday = weekdays[date.getDay()]; // 获取星期几
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import {getDetailsList} from "@/api/report/attReport";
+import {getAttDayReportDetailsList,getAttDayList} from "@/api/report/dayReport";
+import {getDetailExceptionAll} from "@/api/dashboard";
 
-          return `${year}-${month}-${day} ${weekday}`; // 组合成所需格式
-        },
-        //部门选择
-        getDeptList(){
-          listDept().then(response => {
-              this.deptOptions = this.handleTree(response.data, "id");
-          });
-        },
-        /** 转换部门数据结构 */
-        normalizer(node) {
-            if (node.children && !node.children.length) {
-                delete node.children;
-            }
-            return {
-                id: node.id,
-                label: node.orgName,
-                children: node.children
-            };
-        },
-        //当日考勤统计
-        async getAttDayReportDetailsList(data) {
-          let res= await getAttDayReportDetailsList(data).then(response => {
-            return response
-          });
-          return res
-        },
-        //未处理已处理数据
-        async getDetailExceptionAll(data) {
-          var nowDate = new Date();
-          var date = {
-            year: nowDate.getFullYear(),
-            month: nowDate.getMonth() + 1,
-            day: nowDate.getDate()
-          };
-          const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
-          data.month=dayDate.toString()
-          data.name=data.userName;
-          data.attCurrentMonth=data.month;
-          let res= await getDetailExceptionAll(data).then(response => {
-            return response
-          });
-          return res
-        },
-        //当月异常数据
-        async getDetailsList(data) {
-          let dateRange=this.getMonthDate()
-          console.log(dateRange)
-          if(dateRange&&dateRange.length>0){
-              data.startDate=dateRange[0]
-              data.endDate=dateRange[1]
-            }else{
-                data.startDate=undefined
-                data.endDate=undefined
-            }
-          let res= await getDetailsList(data).then(response => {
-            return response
-          });
-          return res
-        },
-        
-        setOpen(v) {
-            console.log(v)
-            this.queryParams = {
-              pageNum: 1,
-              pageSize: 10,
-            }
-            this.open = v.open
-            this.status = v.param.order
-            switch (v.param.order) {
-                case 1:
-                    this.title="打卡记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 2:
-                    this.title="迟到记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 3:
-                    this.title="旷工记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 4:
-                    this.title="早退记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 6:
-                    this.title="请假记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 8:
-                    this.title="出入异常记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 9:
-                    this.title="打卡地异常记录"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.currentFunc = this.getAttDayReportDetailsList
-                    this.getTableList(this.getAttDayReportDetailsList,v.param)
-                    break;
-                case 10:
-                    this.title="已处理异常数据"
-                    this.columnList = [
-                        { t_props: 'name', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'leaveType', t_label: '请假类型' },
-                        { t_props: 'leaveStartDate', t_label: '请假开始时间' },
-                        { t_props: 'leaveEndDate', t_label: '请假结束时间'},
-                        { t_props: 'leaveDuration', t_label: '请假时长(天)' },
-                        { t_props: 'examineStatus', t_label: '审批状态',t_slot: 'examineStatus' },
-                    ]
-                    this.currentFunc = this.getDetailExceptionAll
-                    this.getTableList(this.getDetailExceptionAll,v.param)
-                    break;
-                case 11:
-                    this.title="未处理异常数据"
-                    this.columnList = [
-                            { t_props: 'name', t_label: '姓名' },
-                            { t_props: 'orgName', t_label: '所属部门' },
-                            { t_props: 'leaveType', t_label: '请假类型' },
-                            { t_props: 'leaveStartDate', t_label: '请假开始时间' },
-                            { t_props: 'leaveEndDate', t_label: '请假结束时间'},
-                            { t_props: 'leaveDuration', t_label: '请假时长(天)' },
-                            { t_props: 'examineStatus', t_label: '审批状态',t_slot: 'examineStatus' },
-                    ]
-                    this.currentFunc = this.getDetailExceptionAll
-                    this.getTableList(this.getDetailExceptionAll,v.param)
-                break;
-                case 12:
-                    this.title="当月异常统计"
-                    this.columnList = [
-                        { t_props: 'userName', t_label: '姓名' },
-                        { t_props: 'orgName', t_label: '所属部门' },
-                        { t_props: 'attCurrentDay', t_label: '考勤日期', t_slot: 'attCurrentDay'},
-                        { t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间' },
-                        { t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
-                        { t_props: 'toWorkAttAddress', t_label: '打卡地址' },
-                        { t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间' },
-                        { t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
-                        { t_props: 'offWorkAttAddress', t_label: '打卡地址' },
-                    ]
-                    this.getMonth();
-                    this.currentFunc = this.getDetailsList
-                    this.getTableList(this.getDetailsList,v.param)
-                    break;
-                
-            }
-        },
-        async getTableList(func, param) {
-            if(param) {
-              Object.assign(this.queryParams, param)
-            }
-            let res = await func(this.queryParams)
-            console.log(res)
-            if(res.data) {
-              this.tableList = res.data.rows
-              this.total = res.data.total
-            } else {
-              this.total = res.total
-              this.tableList = res.rows
-            } 
-        },
-        closeDialog() {
-            this.queryParams = {
-                pageNum: 1,
-                pageSize: 10,
-            }
-        },
+export default {
+  name: 'commonDialog',
+  dicts: ['att_status'],
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      total: 0,
+      loading: false,
+      status: undefined,
+      queryParams: {
+        month: undefined,
+        pageNum: 1,
+        pageSize: 10,
+      },
+      title: "",
+      open: false,
+      deptOptions: [],
+      tableList: [],
+      columnList: [],
+      additionalList: [],
+      currentFunc: undefined,
+      currentParam: undefined,
+
+      proTypeRange: [
+        {label: '变电工程', value: '1'},
+        {label: '线路工程', value: '2'},
+        {label: '电缆工程', value: '3'},
+      ]
+    }
+  },
+  mounted() {
+
+    this.getDeptList();
+  },
+  methods: {
+    getMonth() {
+      // 默认当月
+      var nowDate = new Date();
+      var date = {
+        year: nowDate.getFullYear(),
+        month: nowDate.getMonth() + 1,
+        day: nowDate.getDate()
+      };
+      const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
+      this.$set(this.queryParams, "month", dayDate.toString());
     },
+    getMonthDate() {
+      const str = this.queryParams.month + '-01';
+      // 获取当前日期
+      var currentDate = new Date(str);
+      // 获取当前月份的第一天
+      var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
+      let firstDay = this.formatDate(firstDayOfMonth)
+      // 获取当前月份的最后一天
+      var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
+      let lastDay = this.formatDate(lastDayOfMonth)
+      return [firstDay, lastDay]
+    },
+    formatDate(dateString) {
+      const date = new Date(dateString); // 创建日期对象
+      const year = date.getFullYear(); // 获取年份
+      const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始）
+      const day = String(date.getDate()).padStart(2, '0'); // 获取日期
+      return `${year}-${month}-${day}`; // 组合成所需格式
+    },
+    formatWeekday(dateString) {
+      const date = new Date(dateString); // 创建日期对象
+      const year = date.getFullYear(); // 获取年份
+      const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始）
+      const day = String(date.getDate()).padStart(2, '0'); // 获取日期
+      const weekdays = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']; // 星期几数组
+      const weekday = weekdays[date.getDay()]; // 获取星期几
+
+      return `${year}-${month}-${day} ${weekday}`; // 组合成所需格式
+    },
+    //部门选择
+    getDeptList() {
+      listDept().then(response => {
+        this.deptOptions = this.handleTree(response.data, "id");
+      });
+    },
+    /** 转换部门数据结构 */
+    normalizer(node) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.id,
+        label: node.orgName,
+        children: node.children
+      };
+    },
+    //当日考勤统计
+    async getAttDayReportDetailsList(data) {
+      let res = await getAttDayReportDetailsList(data).then(response => {
+        return response
+      });
+      return res
+    },
+    //未处理已处理数据
+    async getDetailExceptionAll(data) {
+      var nowDate = new Date();
+      var date = {
+        year: nowDate.getFullYear(),
+        month: nowDate.getMonth() + 1,
+        day: nowDate.getDate()
+      };
+      const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
+      data.month = dayDate.toString()
+      data.name = data.userName;
+      data.attCurrentMonth = data.month;
+      let res = await getDetailExceptionAll(data).then(response => {
+        return response
+      });
+      return res
+    },
+    //当月异常数据
+    async getDetailsList(data) {
+      console.log("当月异常数据",data)
+      let dateRange = this.getMonthDate()
+      console.log(dateRange)
+      if (dateRange && dateRange.length > 0) {
+        data.startDate = dateRange[0]
+        data.endDate = dateRange[1]
+      } else {
+        data.startDate = undefined
+        data.endDate = undefined
+      }
+      let res = await getDetailsList(data).then(response => {
+        return response
+      });
+      return res
+    },
+
+    //今日出勤状态
+    async getAttDayList(data) {
+      console.log("今日出勤状态",data)
+      let res = await getAttDayList(data).then(response => {
+        return response
+      });
+      return res
+    },
+
+    setOpen(v) {
+      console.log(v)
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 10,
+      }
+      this.open = v.open
+      this.status = v.param.order
+      switch (v.param.order) {
+        case 1:
+          this.title = "打卡记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayList
+          // this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayList, v.param)
+          break;
+        case 2:
+          this.title = "迟到记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 3:
+          this.title = "旷工记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 4:
+          this.title = "早退记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 6:
+          this.title = "请假记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 8:
+          this.title = "出入异常记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 9:
+          this.title = "打卡地异常记录"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.currentFunc = this.getAttDayReportDetailsList
+          this.getTableList(this.getAttDayReportDetailsList, v.param)
+          break;
+        case 10:
+          this.title = "已处理异常数据"
+          this.columnList = [
+            {t_props: 'name', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'leaveType', t_label: '请假类型'},
+            {t_props: 'leaveStartDate', t_label: '请假开始时间'},
+            {t_props: 'leaveEndDate', t_label: '请假结束时间'},
+            {t_props: 'leaveDuration', t_label: '请假时长(天)'},
+            {t_props: 'examineStatus', t_label: '审批状态', t_slot: 'examineStatus'},
+          ]
+          this.currentFunc = this.getDetailExceptionAll
+          this.getTableList(this.getDetailExceptionAll, v.param)
+          break;
+        case 11:
+          this.title = "未处理异常数据"
+          this.columnList = [
+            {t_props: 'name', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'leaveType', t_label: '请假类型'},
+            {t_props: 'leaveStartDate', t_label: '请假开始时间'},
+            {t_props: 'leaveEndDate', t_label: '请假结束时间'},
+            {t_props: 'leaveDuration', t_label: '请假时长(天)'},
+            {t_props: 'examineStatus', t_label: '审批状态', t_slot: 'examineStatus'},
+          ]
+          this.currentFunc = this.getDetailExceptionAll
+          this.getTableList(this.getDetailExceptionAll, v.param)
+          break;
+        case 12:
+          this.title = "当月异常统计"
+          this.columnList = [
+            {t_props: 'userName', t_label: '姓名'},
+            {t_props: 'orgName', t_label: '所属部门'},
+            {t_props: 'attCurrentDay', t_label: '考勤日期', t_slot: 'attCurrentDay'},
+            {t_props: 'toWorkAttCurrentTime', t_label: '上班打卡时间'},
+            {t_props: 'toWorkAttStatus', t_label: '上班状态', t_slot: 'attStatus'},
+            {t_props: 'toWorkAttAddress', t_label: '打卡地址'},
+            {t_props: 'offWorkAttCurrentTime', t_label: '下班打卡时间'},
+            {t_props: 'offWorkAttStatus', t_label: '下班状态', t_slot: 'attStatus'},
+            {t_props: 'offWorkAttAddress', t_label: '打卡地址'},
+          ]
+          this.getMonth();
+          this.currentFunc = this.getDetailsList
+          this.getTableList(this.getDetailsList, v.param)
+          break;
+
+      }
+    },
+    async getTableList(func, param) {
+      if (param) {
+        Object.assign(this.queryParams, param)
+      }
+      let res = await func(this.queryParams)
+      console.log(res)
+      if (res.data) {
+        this.tableList = res.data.rows
+        this.total = res.data.total
+      } else {
+        this.total = res.total
+        this.tableList = res.rows
+      }
+    },
+    closeDialog() {
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 10,
+      }
+    },
+  },
 }
 </script>
 
 <style lang="scss" scoped>
 .content {
-    box-sizing: border-box;
-    padding: 20px;
+  box-sizing: border-box;
+  padding: 20px;
 }
 </style>
diff --git a/src/views/dashboard/topOne.vue b/src/views/dashboard/topOne.vue
index 25a0d7d..9a72991 100644
--- a/src/views/dashboard/topOne.vue
+++ b/src/views/dashboard/topOne.vue
@@ -1,333 +1,380 @@
 <template>
-    <div class="content">
-        <div class="left-box">
-            <div class="title-box">
-                <div style="margin-left: 10px;font-size: 22px;font-weight: bold;">今日出勤状态</div>
-                <div>
-                    <el-date-picker
-                        v-model="date" @change="handleDateChange" :clearable="false"
-                        type="date" value-format="yyyy-MM-dd" :picker-options="pickerOptions"
-                        placeholder="选择日期">
-                    </el-date-picker>
-                </div>
-            </div>
-            <div @click="toggleDialog(1)">
-                <div id="pieBox" style="width: 100%;height: 260px;" ></div>
-            </div>
-            
+  <div class="content">
+    <div class="left-box">
+      <div class="title-box">
+        <div style="margin-left: 10px;font-size: 22px;font-weight: bold;">今日出勤状态</div>
+        <div>
+          <el-date-picker
+            v-model="date" @change="handleDateChange" :clearable="false"
+            type="date" value-format="yyyy-MM-dd" :picker-options="pickerOptions"
+            placeholder="选择日期">
+          </el-date-picker>
         </div>
-
-        <div class="right-box">
-            <div class="title-box">
-                <div style="margin-left: 10px;font-size: 22px;font-weight: bold;">今日异常统计</div>
-            </div>
-            <div class="right-list">
-                <div class="listItem" style="background-color: #FFF7F1;" @click="toggleDialog(2)">
-                    <div>迟到人数</div>
-                    <h2>{{todayAbnormalBean.lateNum}}</h2>
-                </div>
-                <div class="listItem" style="background-color: #F7F8FA;" @click="toggleDialog(4)">
-                    <div>早退人数</div>
-                    <h2>{{todayAbnormalBean.earlyNum}}</h2>
-                </div>
-                <div class="listItem" style="background-color: #FFF2F2;" @click="toggleDialog(3)">
-                    <div>旷工人数</div>
-                    <h2>{{todayAbnormalBean.skippingNum}}</h2>
-                </div>
-            </div>
-            <div class="right-list">
-                <div class="listItem" style="background-color: #F0F8FF;" @click="toggleDialog(6)">
-                    <div>请假人数</div>
-                    <h2>{{todayAbnormalBean.leaveNum}}</h2>
-                </div>
-                <div class="listItem" style="background-color: #FBFFE3;" @click="toggleDialog(9)"> 
-                    <div>打卡地异常</div>
-                    <h2>{{todayAbnormalBean.addressErrorNum}}</h2>
-                </div>
-                <div class="listItem" style="background-color: #FFF0FB;" @click="toggleDialog(8)"> 
-                    <div>出入异常</div>
-                    <h2>{{todayAbnormalBean.einErrorNum}}</h2>
-                </div>
-            </div>
+      </div>
+      <div >
+        <div id="pieBox" style="width: 100%;height: 260px;"></div>
+        <!-- 点击区域 -->
+        <div class="clickable-texts">
+          <div class="clickable-text expected" @click="handleClick('0')">应出勤人数</div>
+          <div class="clickable-text actual" @click="handleClick('1')">实际出勤人数</div>
+          <div class="clickable-text absent" @click="handleClick('2')">未出勤人数</div>
         </div>
+      </div>
 
-        
-       
     </div>
+
+    <div class="right-box">
+      <div class="title-box">
+        <div style="margin-left: 10px;font-size: 22px;font-weight: bold;">今日异常统计</div>
+      </div>
+      <div class="right-list">
+        <div class="listItem" style="background-color: #FFF7F1;" @click="toggleDialog(2)">
+          <div>迟到人数</div>
+          <h2>{{ todayAbnormalBean.lateNum }}</h2>
+        </div>
+        <div class="listItem" style="background-color: #F7F8FA;" @click="toggleDialog(4)">
+          <div>早退人数</div>
+          <h2>{{ todayAbnormalBean.earlyNum }}</h2>
+        </div>
+        <div class="listItem" style="background-color: #FFF2F2;" @click="toggleDialog(3)">
+          <div>旷工人数</div>
+          <h2>{{ todayAbnormalBean.skippingNum }}</h2>
+        </div>
+      </div>
+      <div class="right-list">
+        <div class="listItem" style="background-color: #F0F8FF;" @click="toggleDialog(6)">
+          <div>请假人数</div>
+          <h2>{{ todayAbnormalBean.leaveNum }}</h2>
+        </div>
+        <div class="listItem" style="background-color: #FBFFE3;" @click="toggleDialog(9)">
+          <div>打卡地异常</div>
+          <h2>{{ todayAbnormalBean.addressErrorNum }}</h2>
+        </div>
+        <div class="listItem" style="background-color: #FFF0FB;" @click="toggleDialog(8)">
+          <div>出入异常</div>
+          <h2>{{ todayAbnormalBean.einErrorNum }}</h2>
+        </div>
+      </div>
+    </div>
+
+
+  </div>
 </template>
 
 <script>
 import * as echarts from 'echarts';
-import { getHomePageData } from '@/api/dashboard'
-export default {
-    components: {
-        
-    },
-    name: 'topOne',
-    data() {
-        return {
-            pieCharts: null,
-            date:new Date().toISOString().substring(0, 10),
-            pickerOptions: {
-                disabledDate: this.disabledDate,
-            },
-            pageData:{},
-            todayAbnormalBean:{    
-                lateNum:'0',
-                earlyNum:'0',
-                skippingNum:'0',
-                leaveNum:'0',
-                addressErrorNum:'0',
-                einErrorNum:'0',
-            }
-        }
-    },
-    created() {
+import {getHomePageData} from '@/api/dashboard'
 
+export default {
+  components: {},
+  name: 'topOne',
+  data() {
+    return {
+      pieCharts: null,
+      date: new Date().toISOString().substring(0, 10),
+      pickerOptions: {
+        disabledDate: this.disabledDate,
+      },
+      pageData: {},
+      todayAbnormalBean: {
+        lateNum: '0',
+        earlyNum: '0',
+        skippingNum: '0',
+        leaveNum: '0',
+        addressErrorNum: '0',
+        einErrorNum: '0',
+      }
+    }
+  },
+  created() {
+
+  },
+  mounted() {
+    this.getInitData()
+  },
+  methods: {
+    handleClick(type){
+      this.toggleDialog(1,type)
     },
-    mounted() { 
-        this.getInitData()
-       
+    disabledDate(time) {
+      let str = this.date;
+      // 获取当前日期
+      var currentDate = new Date(str);
+      // 获取当前月份的第一天
+      var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
+      // 获取当前月份的最后一天
+      var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
+      return time < firstDayOfMonth || time > lastDayOfMonth;
     },
-    methods: {
-        disabledDate(time) {
-          let str=this.date;
-          // 获取当前日期
-          var currentDate = new Date(str);
-          // 获取当前月份的第一天
-          var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
-          // 获取当前月份的最后一天
-          var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
-          return time < firstDayOfMonth || time > lastDayOfMonth;
-        },
-        handleDateChange(val){
-            this.getInitData() 
-        },
-        getInitData(){
-            let param={
-                date:this.date
-            }
-            getHomePageData(param).then(response => {
-                this.pageData = response.data;
-                this.$emit('getHomeData', this.pageData)
-                this.todayAbnormalBean=this.pageData.todayAbnormalBean
-                this.$nextTick(() => {
-                    this.initChart()    
-                })
-            });
-        },
-        initChart(){
-            this.pieCharts = echarts.init(document.getElementById('pieBox'))
-            var data={
-                title:'今日出勤状态',
-                percentage:this.pageData.todayAttBean.attRate+'%',
-                data:[
-                    {value:Number(this.pageData.todayAttBean.shouldAttNum)||0,name:'应出勤人数'}, 
-                    {value:Number(this.pageData.todayAttBean.actualAttNum)||0,name:'实际出勤人数'} 
-                ],
-            }
-            var option = {
-                title: [
-                    {
-                        // 第一个圆环标题
-                        text: data.percentage, // 主标题
-                        textStyle: {
-                            // 主标题样式
-                            color: "#0f0f0f",
-                            lineHeight:50,
-                            fontSize: 24,
-                            fontWeight:"400",
-                        },
-                        left: "50%", // 定位到适合的位置
-                        top: "40%", // 定位到适合的位置 
-                        textAlign: "center", // 主、副标题水平居中显示
-                    },
-                ],
-                tooltip: {
-                    trigger: "item",
-                    formatter: function (params) {
-                    let tip = "";
-                    if (params.seriesIndex === 0) {
-                        tip =
-                        params.seriesName + ":" +"<br>"+
-                        params.marker +
-                        params.name +
-                        ": " +
-                        params.value 
-                        // " " +
-                        // "(" +
-                        // params.percent +
-                        // "%)";
-                    } else if (params.seriesIndex === 1) {
-                        tip = "";
-                    }
-                    return tip;
-                    },
-                }, //提示框，鼠标悬浮交互时的信息提示
-                legend: {
-                    left: "center",
-                    orient: 'horizontal',
-                    bottom: "5%",
-                    itemGap: 80,
-                    icon: 'circle',
-                    itemWidth: 8,
-                    itemHeight: 8,
-                    itemStyle: {
-                        borderColor: '#fff', // 设置边框颜色
-                        borderWidth: 0 // 设置边框宽度为0，即无边框
-                    },
-                    textStyle: {
-                        color: "#333",
-                        rich: {
-                            a: {
-                                verticalAlign: "right",
-                                align: "left",
-                                width: 90,
-                                fontSize: 14,
-                            },
-                            b: {
-                                align: "left",
-                                fontSize: 14,
-                                color: "#ff5722",
-                            },
-                            df: {
-                                align: "left",
-                                fontSize: 16,
-                                fontWeight: "600",
-                                color: "#f7c122",
-                            },
-                            yjf: {
-                                align: "left",
-                                fontSize: 16,
-                                fontWeight: "600",
-                                color: "#6395fa",
-                            }, 
-                        },
-                    },
-                    formatter: (name) => {
-                        let total = 0;
-                        let target;
-                        let className = "b";
-                        for (let i = 0, l = data.data.length; i < l; i++) {
-                            total += Number(data.data[i].value);
-                            if (data.data[i].name == name) {
-                                target = data.data[i].value;
-                            }
-                            if (name == "应出勤人数") {
-                                className = "yjf";
-                            }
-                            if (name == "实际出勤人数") {
-                                className = "df";
-                            }
-                        }
-                        let str = "{a|" + name + "}{" + className + "|" + target +"}";
-                        return str;
-                    },
+    handleDateChange(val) {
+      this.getInitData()
+    },
+    getInitData() {
+      let param = {
+        date: this.date
+      }
+      getHomePageData(param).then(response => {
+        this.pageData = response.data;
+        this.$emit('getHomeData', this.pageData)
+        this.todayAbnormalBean = this.pageData.todayAbnormalBean
+        this.$nextTick(() => {
+          this.initChart()
+        })
+      });
+    },
+    initChart() {
+      this.pieCharts = echarts.init(document.getElementById('pieBox'))
+      var data = {
+        title: '今日出勤状态',
+        percentage: this.pageData.todayAttBean.shouldAttNum,
+        data: [
+          {value: Number(this.pageData.todayAttBean.actualAttNum) || 0, name: '实际出勤人数'},
+          {value: Number(this.pageData.todayAttBean.noActualAttNum) || 0, name: '未出勤人数'}
+        ],
+      }
+      var option = {
+        title: [
+          {
+            // 第一个圆环标题
+            text: '{a|' + data.percentage + '}\n{b|' + "应出勤人数" + '}',
+            textStyle: {
+              rich: {
+                a: {
+                  fontSize: 22,
+                  color: '#0f0f0f',
+                  fontWeight: '600',
                 },
-                series: [
-                    {
-                        name: data.title, //tooltip提示框中显示内容
-                        type: "pie", //图形类型，如饼状图，柱状图等
-                        roseType: 'radius',
-                        radius: ["45%", "65%"], //第一项是内半径，第二项是外半径。
-                        // center: ["50%", "50%"],
-                        color: ["#6CB0F8", "#F4B07A"],
-                        label: {
-                            position: "center",
-                            normal: {
-                                show: false,
-                            },
-                        },
-                        
-                        data: [
-                            { value: data.data[0].value, name: data.data[0].name },
-                            { value: data.data[1].value, name: data.data[1].name },
-                        ], //数据，数据中其他属性，查阅文档
-                    },
-                    {
-                        type: "pie",
-                        // roseType: 'radius',
-                        radius: ["0%", "35%"], //第一项是内半径，第二项是外半径。
-                        center: ["50%", "50%"],
-                        hoverAnimation: false,
-                        color: "#fff",
-                        label: {
-                            position: "center",
-                            normal: {
-                                show: false,
-                            },
-                        },
-                        data: [
-                            {
-                            value: 0,
-                            itemStyle: {
-                                normal: {
-                                shadowColor: "#e3e3e3",
-                                shadowBlur: 20,
-                                },
-                            },
-                            },
-                        ],
-                    },
-                ],
-            };
-            this.pieCharts.setOption(option)
-        },
-        toggleDialog(v) { 
-            this.$emit('openDialog', { order: v, attStatus:v,attCurrentDay:this.date})
+                b: {
+                  fontSize: 14,
+                  color: '#0f0f0f',
+                  padding: [6, 0, 14, 0]
+                }
+              }
+            },
+            left: "50%", // 定位到适合的位置
+            top: "40%", // 定位到适合的位置
+            textAlign: "center", // 主、副标题水平居中显示
+          },
+        ],
+        tooltip: {
+          trigger: "item",
+          formatter: function (params) {
+            let tip = "";
+            if (params.seriesIndex === 0) {
+              tip =
+                params.seriesName + ":" + "<br>" +
+                params.marker +
+                params.name +
+                ": " +
+                params.value
+              // " " +
+              // "(" +
+              // params.percent +
+              // "%)";
+            } else if (params.seriesIndex === 1) {
+              tip = "";
+            }
+            return tip;
+          },
+        }, //提示框，鼠标悬浮交互时的信息提示
+        legend: {
+          left: "center",
+          orient: 'horizontal',
+          bottom: "5%",
+          itemGap: 80,
+          icon: 'circle',
+          itemWidth: 8,
+          itemHeight: 8,
+          itemStyle: {
+            borderColor: '#fff', // 设置边框颜色
+            borderWidth: 0 // 设置边框宽度为0，即无边框
+          },
+          textStyle: {
+            color: "#333",
+            rich: {
+              a: {
+                verticalAlign: "right",
+                align: "left",
+                width: 90,
+                fontSize: 14,
+              },
+              b: {
+                align: "left",
+                fontSize: 14,
+                color: "#ff5722",
+              },
+              df: {
+                align: "left",
+                fontSize: 16,
+                fontWeight: "600",
+                color: "#f7c122",
+              },
+              yjf: {
+                align: "left",
+                fontSize: 16,
+                fontWeight: "600",
+                color: "#6395fa",
+              },
+            },
+          },
+          formatter: (name) => {
+            let total = 0;
+            let target;
+            let className = "b";
+            for (let i = 0, l = data.data.length; i < l; i++) {
+              total += Number(data.data[i].value);
+              if (data.data[i].name == name) {
+                target = data.data[i].value;
+              }
+              if (name == "应出勤人数") {
+                className = "yjf";
+              }
+              if (name == "实际出勤人数") {
+                className = "df";
+              }
+            }
+            let str = "{a|" + name + "}{" + className + "|" + target + "}";
+            return str;
+          },
         },
+        series: [
+          {
+            name: data.title, //tooltip提示框中显示内容
+            type: "pie", //图形类型，如饼状图，柱状图等
+            roseType: 'radius',
+            radius: ["45%", "65%"], //第一项是内半径，第二项是外半径。
+            // center: ["50%", "50%"],
+            color: ["#6CB0F8", "#F4B07A"],
+            label: {
+              position: "center",
+              normal: {
+                show: false,
+              },
+            },
+
+            data: [
+              {value: data.data[0].value, name: data.data[0].name},
+              {value: data.data[1].value, name: data.data[1].name},
+            ], //数据，数据中其他属性，查阅文档
+          },
+          {
+            type: "pie",
+            // roseType: 'radius',
+            radius: ["0%", "35%"], //第一项是内半径，第二项是外半径。
+            center: ["50%", "50%"],
+            hoverAnimation: false,
+            color: "#fff",
+            label: {
+              position: "center",
+              normal: {
+                show: false,
+              },
+            },
+            data: [
+              {
+                value: 0,
+                itemStyle: {
+                  normal: {
+                    shadowColor: "#e3e3e3",
+                    shadowBlur: 20,
+                  },
+                },
+              },
+            ],
+          },
+        ],
+      };
+      this.pieCharts.setOption(option)
     },
+    toggleDialog(v,type) {
+      this.$emit('openDialog', {order: v, attStatus: v, attCurrentDay: this.date,attendType:type})
+    },
+  },
 }
 </script>
 
 <style lang="scss" scoped>
-.content{
+.content {
+  width: 100%;
+  height: 100%;
+  padding-top: 20px;
+  display: flex;
+
+  .left-box {
+    width: 35%;
+    height: 100%;
+    background-color: #FFF;
+    border-radius: 10px;
+    padding: 10px;
+  }
+
+  .right-box {
+    width: 63%;
+    height: 100%;
+    margin: 0px 20px;
+    background-color: #FFF;
+    border-radius: 10px;
+    padding: 10px;
+  }
+
+  .right-list {
+    width: 100%;
+    height: 100px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    .listItem {
+      width: 30%;
+      height: 70px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-radius: 10px;
+      padding: 10px;
+      cursor: pointer;
+    }
+  }
+
+  .title-box {
+    width: 100%;
+    height: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .clickable-texts {
+    position: absolute;
+    top: 0;
+    left: 0;
     width: 100%;
     height: 100%;
-    padding-top: 20px;
-    display: flex;
+    background: transparent;
+    color: transparent;
+  }
 
-    .left-box{
-        width: 35%;
-        height: 100%;
-        background-color: #FFF;
-        border-radius: 10px;
-        padding: 10px;
-    }
-    .right-box{
-        width: 63%;
-        height: 100%;
-        margin: 0px 20px;
-        background-color: #FFF;
-        border-radius: 10px;
-        padding: 10px;
-    }
-    .right-list{
-        width: 100%;
-        height: 100px;
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        .listItem{
-            width: 30%;
-            height: 70px;
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            border-radius: 10px;
-            padding: 10px;
-            cursor: pointer;
-        }
-    }
+  .actual{
+    top: 35.5%;
+    left: 5%;
+    cursor: pointer;
+  }
+  .expected{
+    top: 24%;
+    left: 12%;
+    cursor: pointer;
+  }
+  .absent{
+    top: 35.5%;
+    left: 17%;
+    cursor: pointer;
+  }
 
-    .title-box{
-        width: 100%;
-        height: 30px;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
+  .clickable-text {
+    position: absolute;
+    /* 默认样式，将在 mounted 钩子中根据需要进行调整 */
+  }
 
-    }
 }
 
 </style>
diff --git a/src/views/report/attReport/index.vue b/src/views/report/attReport/index.vue
index 3b317d3..ed00839 100644
--- a/src/views/report/attReport/index.vue
+++ b/src/views/report/attReport/index.vue
@@ -183,8 +183,7 @@
   </template>
 
   <script>
-  import { getDetailsList,updateAttDetails,exportAttRecord,synchronous } from "@/api/report/attReport";
-  import { listDept } from "@/api/system/dept";
+  import { getDetailsList,updateAttDetails,exportAttRecord,synchronous,listDept } from "@/api/report/attReport";
   import Treeselect from "@riophae/vue-treeselect";
   import "@riophae/vue-treeselect/dist/vue-treeselect.css";
   import {checkPersonAssignment} from "@/api/system/userInfo";
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 2204c14..4eadafa 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -696,4 +696,4 @@ export default {
     }
   }
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/system/userInfo/index.vue b/src/views/system/userInfo/index.vue
index 097f79d..135e8b9 100644
--- a/src/views/system/userInfo/index.vue
+++ b/src/views/system/userInfo/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="app-container">
-      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
         <el-form-item label="姓名" prop="userName">
           <el-input
             v-model="queryParams.userName"
@@ -13,6 +13,14 @@
         <el-form-item label="部门名称" prop="orgId">
           <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" placeholder="选择部门" style="width: 240px"/>
         </el-form-item>
+
+        <el-form-item label="是否参加考勤" prop="isAttend">
+          <el-select v-model="queryParams.isAttend" placeholder="是否参加考勤" clearable style="width: 240px">
+            <el-option v-for="dict in dictList" :key="dict.value" :label="dict.label"
+                       :value="dict.value" />
+          </el-select>
+        </el-form-item>
+
         <el-form-item>
           <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
           <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -300,7 +308,12 @@
           pageSize: 10,
           userName: undefined,
           orgId: undefined,
+          isAttend: undefined,
         },
+        dictList:[
+          {"value":"1","label":"是"},
+          {"value":"0","label":"否"}
+        ],
         roleList:[],
         // 表单参数
         form: {},