From 0659111c8be777fe336c1911961250b7aeb3f246 Mon Sep 17 00:00:00 2001
From: suyanyan <1321717064@qq.com>
Date: Wed, 4 Sep 2024 14:18:27 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AD=A6=E7=94=9F=E8=A1=8C=E4=B8=BA=E7=94=BB?=
 =?UTF-8?q?=E5=83=8F-=E5=AD=A6=E7=94=9F=E6=A1=A3=E6=A1=88=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3=E8=81=94=E8=B0=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../api/modules/violation/portraitSummary.ts  |  16 +
 .../views/attendance/behaviorTrace/index.vue  |   2 +
 .../roolcall/components/form/index.vue        |   8 +-
 .../src/views/attendance/roolcall/index.vue   |   4 +-
 .../personnel/components/form/form_basic.vue  |   2 +
 .../personnel/components/form/index.vue       |   4 +-
 .../src/views/userManage/personnel/index.vue  |   2 +
 .../src/views/violation/portrait/detail.vue   | 333 ++++++++++--------
 8 files changed, 220 insertions(+), 151 deletions(-)

diff --git a/SafeCampus.WEB/src/api/modules/violation/portraitSummary.ts b/SafeCampus.WEB/src/api/modules/violation/portraitSummary.ts
index 8b9db03..54c24ce 100644
--- a/SafeCampus.WEB/src/api/modules/violation/portraitSummary.ts
+++ b/SafeCampus.WEB/src/api/modules/violation/portraitSummary.ts
@@ -39,6 +39,22 @@ const portraitSummaryApi = {
   /** 获取学生属性标签 */
   getStudentDetail(params: any) {
     return http.get("getStudentDetail", params);
+  },
+  /* 学生-出勤情况 */
+  getStudentAttendance(params: any) {
+    return http.post("attendance", params);
+  },
+  /* 学生-出校 */
+  getStudentOutSchool(params: any) {
+    return http.post("outsideSchool", params);
+  },
+  /* 学生-图书馆 */
+  getStudentLibrary(params: any) {
+    return http.post("library", params);
+  },
+  /* 学生-食堂 */
+  getStudentCanteen(params: any) {
+    return http.post("canteen", params);
   }
 };
 
diff --git a/SafeCampus.WEB/src/views/attendance/behaviorTrace/index.vue b/SafeCampus.WEB/src/views/attendance/behaviorTrace/index.vue
index 56498ab..f259486 100644
--- a/SafeCampus.WEB/src/views/attendance/behaviorTrace/index.vue
+++ b/SafeCampus.WEB/src/views/attendance/behaviorTrace/index.vue
@@ -187,6 +187,8 @@ const detialRef = ref<InstanceType<typeof TraceShow> | null>(null);
 onMounted(async () => {
   // 获取系部下拉数据
   departmentOptions.value = await getDepartmentList()
+  // 获取班级
+  classOptions.value = await getClassList('')
 });
 </script>
 <style scoped lang="scss">
diff --git a/SafeCampus.WEB/src/views/attendance/roolcall/components/form/index.vue b/SafeCampus.WEB/src/views/attendance/roolcall/components/form/index.vue
index 49a7e25..d3a02ba 100644
--- a/SafeCampus.WEB/src/views/attendance/roolcall/components/form/index.vue
+++ b/SafeCampus.WEB/src/views/attendance/roolcall/components/form/index.vue
@@ -101,9 +101,9 @@ const rules = reactive({
   similarity: [required("请选择相似度")],
   cameraId: [required("请选择摄像头")],
   continueTime: [required("请选择持续时间")],
-  personSetId: [required("请选择所属班级")],
-  depId: [required("请选择系部")],
-  majorId: [required("请选择专业")]
+  personSetId: [required("请选择所属班级")]
+  // depId: [required("请选择系部")],
+  // majorId: [required("请选择专业")]
 });
 
 /**
@@ -112,6 +112,8 @@ const rules = reactive({
  */
 async function onOpen(props: FormProps.Base<any>) {
   departmentOptions.value = await getDepartmentList();
+  // 获取班级
+  classOptions.value = await getClassList("");
   Object.assign(sysUserProps, props); //合并参数
   visible.value = true; //显示表单
   /* 监听系部、专业 */
diff --git a/SafeCampus.WEB/src/views/attendance/roolcall/index.vue b/SafeCampus.WEB/src/views/attendance/roolcall/index.vue
index d344613..c644411 100644
--- a/SafeCampus.WEB/src/views/attendance/roolcall/index.vue
+++ b/SafeCampus.WEB/src/views/attendance/roolcall/index.vue
@@ -181,7 +181,9 @@ const RefreshTable = () => {
 }
 onMounted(async () => {
   // 获取系部下拉数据
-  departmentOptions.value = await getDepartmentList()
+  departmentOptions.value = await getDepartmentList();
+  // 获取班级
+  classOptions.value = await getClassList('')
 });
 </script>
 <style scoped lang="scss">
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue b/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
index 6e7db4c..f742d8c 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
@@ -156,6 +156,8 @@ const genderOptions = ref([
 ]);
 onMounted(async () => {
   departmentOptions.value = await getDepartmentList();
+  // 获取班级
+  classOptions.value = await getClassList("");
   // 初始化
   userInfo.value.gender = userInfo.value.gender ? userInfo.value.gender : genderOptions.value[0].value;
   if (userInfo.value.personId) {
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue b/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
index fc5b54c..a9f94ec 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
@@ -49,8 +49,8 @@ const rules = reactive({
   gender: [required("请选择性别")],
   faces: [required("请上传人脸图片")],
   phone: [required("请输入手机号")],
-  depId: [required("请选择系部")],
-  majorId: [required("请选择专业")],
+  // depId: [required("请选择系部")],
+  // majorId: [required("请选择专业")],
   personSetId: [required("请选择班级")]
 });
 
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/index.vue b/SafeCampus.WEB/src/views/userManage/personnel/index.vue
index 55e1a3d..d7469d3 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/index.vue
@@ -281,6 +281,8 @@ const handleAvatarSuccess: UploadProps["onSuccess"] = (response) => {
 onMounted(async () => {
   // 获取系部下拉数据
   departmentOptions.value = await getDepartmentList()
+  // 获取班级
+  classOptions.value = await getClassList("");
 });
 </script>
 <style scoped lang="scss">
diff --git a/SafeCampus.WEB/src/views/violation/portrait/detail.vue b/SafeCampus.WEB/src/views/violation/portrait/detail.vue
index eeca2d6..d410a25 100644
--- a/SafeCampus.WEB/src/views/violation/portrait/detail.vue
+++ b/SafeCampus.WEB/src/views/violation/portrait/detail.vue
@@ -78,7 +78,7 @@
       <el-row>
         <el-col :span="10" :offset="2">
           <div class="labelAtteribute">
-            <p class="labelAtteribute-item">
+            <!-- <p class="labelAtteribute-item">
               <span class="laberAttrName">
                 <span class="icon"><svg-icon icon="ant-design:like-outlined" class="like-outlined" /></span>总评分</span
               >
@@ -88,7 +88,7 @@
               <span class="laberAttrName">
                 <span class="icon"><svg-icon icon="ant-design:like-outlined" class="like-outlined" /></span>总学分</span
               ><span class="laberAttrValue">93分</span>
-            </p>
+            </p> -->
             <p class="labelAtteribute-item" v-for="(item, index) in state.laberAttrName" :key="index">
               <span class="laberAttrName">{{ item }}：</span><span class="laberAttrValue">{{ state.laberAttrValue[index] }}</span
               >次
@@ -107,11 +107,11 @@
           <div class="situation attendanceStatus">
             <div class="top">
               <span class="title">出勤情况分析</span>
-              <s-select v-model="state.time" :options="state.options" style="width: 100px"></s-select>
+              <s-select v-model="state.attendanceTime" :options="state.options" style="width: 100px" @change="getStuAttendance"></s-select>
             </div>
             <div class="contentBox">
               <div class="tip">
-                <span>60%出勤率，在班级中属于中等水平</span>
+                <span>{{ state.attendance.msg }}</span>
               </div>
               <div class="box">
                 <div ref="chartEl2" style="width: 100%; height: 100%"></div>
@@ -123,14 +123,14 @@
           <div class="situation schoolStatus">
             <div class="top">
               <span class="title">出校访学情况</span>
-              <s-select v-model="state.time" :options="state.options" style="width: 100px"></s-select>
+              <s-select v-model="state.leavesSchTime" :options="state.options" style="width: 100px" @change="getStuLeave"></s-select>
             </div>
             <div class="contentBox">
               <div class="tip">
-                <span>有3次出校访问经历，在班级中属于优秀水平</span>
+                <span>{{ state.outSchool.msg }}</span>
               </div>
               <div class="box">
-                <el-table :data="tableData" style="width: 100%">
+                <el-table height="400" :data="state.outSchool.data" style="width: 100%">
                   <el-table-column width="40">
                     <template #default="{ row }">
                       <div style="display: flex; align-items: center" :row="row">
@@ -138,10 +138,22 @@
                       </div>
                     </template>
                   </el-table-column>
-                  <el-table-column prop="date" label="时间" />
-                  <el-table-column prop="name" label="姓名" />
-                  <el-table-column prop="address" label="班级" />
-                  <el-table-column prop="address" label="图片" />
+                  <el-table-column prop="tick" label="时间" />
+                  <el-table-column prop="personName" label="姓名" />
+                  <el-table-column prop="personSetName" label="班级" />
+                  <el-table-column prop="snapshotUrl" label="图片">
+                    <template #default="{ row }">
+                      <el-image
+                        style="width: 60px; height: 60px"
+                        :src="row.snapshotUrl"
+                        :zoom-rate="1.2"
+                        :max-scale="7"
+                        :min-scale="0.2"
+                        :preview-src-list="[row.snapshotUrl]"
+                        fit="cover"
+                      />
+                    </template>
+                  </el-table-column>
                 </el-table>
               </div>
             </div>
@@ -155,7 +167,7 @@
           <div class="situation attendanceStatus">
             <div class="top">
               <span class="title">图书馆使用情况</span>
-              <s-select v-model="state.time" :options="state.options" style="width: 100px"></s-select>
+              <s-select v-model="state.libraryTime" :options="state.options" style="width: 100px" @change="getStuLibrary"></s-select>
             </div>
             <div class="contentBox">
               <div class="tip">
@@ -175,11 +187,11 @@
           <div class="situation attendanceStatus">
             <div class="top">
               <span class="title">一卡通消费情况</span>
-              <s-select v-model="state.time" :options="state.options" style="width: 100px"></s-select>
+              <s-select v-model="state.oneCardTime" :options="state.options" style="width: 100px" @change="getOneCardSolution"></s-select>
             </div>
             <div class="contentBox">
               <div class="tip">
-                <span>与全校学生消费情况相比较为节俭</span>
+                <span>{{ state.oneCard.msg }}</span>
               </div>
               <div class="box">
                 <div ref="chartEl4" style="width: 100%; height: 100%"></div>
@@ -205,37 +217,30 @@ const chartEl4 = ref(null);
 const state: any = reactive({
   laberAttrName: [],
   laberAttrValue: [],
-  time: "1",
+  attendanceTime: "ThisWeek",
+  leavesSchTime: "ThisWeek",
+  libraryTime: "ThisWeek",
+  oneCardTime: "ThisWeek",
   options: [
     {
       label: "本周",
-      value: "1"
+      value: "ThisWeek"
+    },
+    {
+      label: "上周",
+      value: "LastWeek"
+    },
+    {
+      label: "本月",
+      value: "ThisMonth"
     }
   ],
-  weekDates: []
+  weekDates: [],
+  attendance: {}, //出勤情况
+  outSchool: {}, //出校情况
+  library: {}, //图书馆使用情况
+  oneCard: {} //一卡通消费情况
 });
-const tableData = [
-  {
-    date: "2016-05-03",
-    name: "Tom",
-    address: "No. 189, Grove St, Los Angeles"
-  },
-  {
-    date: "2016-05-02",
-    name: "Tom",
-    address: "No. 189, Grove St, Los Angeles"
-  },
-  {
-    date: "2016-05-04",
-    name: "Tom",
-    address: "No. 189, Grove St, Los Angeles"
-  },
-  {
-    date: "2016-05-01",
-    name: "Tom",
-    address: "No. 189, Grove St, Los Angeles"
-  }
-];
 const genderOptions = ref<any>({
   GENDER_UNKNOWN: "未知",
   GENDER_MALE: "男",
@@ -245,11 +250,52 @@ const getDetail = () => {
   userManagePersonnelApi.detail({ id: route.query.personId }).then((res: any) => {
     formData.value = res.data;
   });
+  /* 标签属性 */
   portraitSummaryApi.getStudentDetail({ id: route.query.personId }).then((res: any) => {
     state.laberAttrName = res.data.label;
     state.laberAttrValue = res.data.value;
     getCharts(res.data.label, res.data.value);
   });
+  /* 出勤情况 */
+  getStuAttendance();
+  /* 出校情况 */
+  getStuLeave();
+  /* 图书馆使用情况 */
+  getStuLibrary();
+  /* 一卡通消费情况 */
+  getOneCardSolution();
+};
+/* 出校情况--请求  */
+const getStuLeave = () => {
+  portraitSummaryApi.getStudentOutSchool({ id: route.query.personId, searchType: state.leavesSchTime }).then((resp: any) => {
+    console.log(resp, "...........出校情况");
+    state.outSchool = resp.data;
+  });
+};
+/* 图书馆使用情况 -- 请求 */
+const getStuLibrary = () => {
+  portraitSummaryApi.getStudentLibrary({ id: route.query.personId, searchType: state.libraryTime }).then((resp: any) => {
+    getCharts3(resp.data.label, resp.data.value);
+  });
+};
+
+/* 一卡通消费情况 -- 请求 */
+const getOneCardSolution = () => {
+  portraitSummaryApi.getStudentCanteen({ id: route.query.personId, searchType: state.oneCardTime }).then((resp: any) => {
+    console.log(resp, "...........");
+    state.oneCard = resp.data;
+    getCharts4(resp.data.label, resp.data.value);
+  });
+};
+const handleDate = (label: any, value: any, key: any = "") => {
+  let data: any = [];
+  label.forEach((item: any, index: number) => {
+    data.push({
+      value: value[index],
+      name: item + key
+    });
+  });
+  return data;
 };
 const getCharts = (nameArr: any, valueArr: any) => {
   let nameObj: any = [];
@@ -349,7 +395,16 @@ const getCharts = (nameArr: any, valueArr: any) => {
     chart.resize();
   });
 };
-const getCharts2 = () => {
+/* 出勤情况分析-请求 */
+const getStuAttendance = () => {
+  portraitSummaryApi.getStudentAttendance({ id: route.query.personId, searchType: state.attendanceTime }).then((resp: any) => {
+    let value = handleDate(resp.data.label, resp.data.value, "");
+    state.attendance = resp.data;
+    getCharts2(resp.data.label, value);
+  });
+};
+/* 出勤情况分析-图表 */
+const getCharts2 = (label: any, value: any) => {
   const chart2 = echarts.init(chartEl2.value);
   var giftImageUrl =
     "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAGJZJREFUeF7tXQuYHFWV/k/1kCyP8OFj2aAuK4oIiPISRQS+pKtJDCzIK4jIivGtCJJ0dXiIy+ADlunqhJco6PJaWEQQBVwxoatnFl1REVgJRKJ86rerJqKLKEFhMl1nc6u7Jz0zPdNVt25XV0+fypcvnalz/nPOf+qfW9V1qy5BNmFAGJiWARJuhAFhYHoGRCBydAgDMzAgApHDQxgQgcgxIAzoMSAjiB5v4tUnDKRKIDmXFzNwJBhHgHAEgHsJGK4CDww79HCf9KQvylxY4v0txjEEZBmwibDWBx4A4aHKClqbFhJSIxDb5QsAfH4GYq7zHPpIWoiTPPQZyLr8UQK+OB0CAbeVHTpNP4I5z1QIxHaZw5bkOZSKnMPmK3YTGei1Xnf9YMu6fDcBx4U9kJhxcaVAg2HtxS49DNguXwvgw2EzSkOvuyqQXInfz4x/DUtYk93pnkO3aviJS5cYWOjywRbwY43wXe11VwViu6zE8f6opBHwb2WH3hvVT+y7x0DO5eUMrIqaQbd73W2BqN8oB0clDcBjnkP7a/iJS5cYsF2+B8CxGuG72utuCyT0xflkYuViXeNQ66JLlIvzNPVaBNLFg6afQotANLrdq6RplNr3Lr3aaxlB+v7QTYYAEYgGz71Kmkapfe/Sq72WEaTvD91kCBCBaPDcq6RplNr3Lr3aaxlB+v7QTYYAEYgGz71Kmkapfe/Sq72WEaTvD91kCBCBaPDcq6RplNr3Lr3aaxlB+v7QTYYAEYgGz71Kmkapfe/Sq72WEaTvD91kCBCBaPDcq6RplNr3Lr3aaxlB+v7QTYYAEcgkntUjlsQ4loD5sDCfGPOZsRsI8wHMSaYtEmWWMTAKxiYibGTCJvjYxMCmAeDOtQV6vBO1Gh1Bsi4vARD8JWDPTiQsmMJASwYIT4Bxt0+oDOfJM8VSbIEsKvKOPuH9DCwDcKCpxARHGIjBwKME3GAxrl9boOdj4EBbIIuKvOuYhWXEwUsX9oqThPgKAx1i4GdMuH7Axw1rC/S0TgwtgeSKfBoThgC8Uieo+AgDCTPwm60vPxisOPSVqHEjCyRX4g8x47qogcReGEgBA0OeQ+dGySOSQLJFHiTCRVECiK0wkDIG7vQcWho2p9ACsV3+DoDFYYHFThhIMQMVzyE7TH6hBGKX+CYw5E2GYRgVm55gIOx7f9sKRE6reqLfkqQGA0Q4uZynr8/kOqNAsqv4BPJxl0ZscREGeoMBH0d6K+m70yU7rUAWXMavymQwAuC1vVGpZCkMaDGwoVpFbuRc+nUr72kFki1ykQiOVkhxEgZ6iAFmuJUCFUILJDvEB1kWHmSZVNhDbZZUdRkgYNT38bbKSnpkMkbLEcQu8k0g+dZKl3Dx60EGGDd7BTqjrUDsVfwO+LjPVIkE3MPAz4mwAcA6y8e6xgQy22Xd9UEe9Bw6zFSOgtN5BmyXbwHwHo1I470+9lre4YVnsW81g32IsA987AvCOzUwW7tYWOKtIHW/b3ybMoLYLt8A4H0Ggv4BhGVenr41HVbUNesaOAysrji0wkCOApEQA7q3C9r1ur6M3+UA5sUtpdVqVq0Eoq7mY01CJOCu7ebgtPvOphdnSjrr8rsJ+PeohTHhlEqe7ojqJ/bdY0D3lkGYXqtHLqrACAhvjlnh7zyH1AN9rUeQXJEXMGE4TpCoa8rZJX4AjCPCxmz3GyUsjtglz4Dt8jcAHB82snqmo+xQ6DUsc0VezYRzwuK3smPg6IpD45cYE0YQu8SXgHG+bgAGnqs4tHMU/wVDPD9jYWNIn996DsUa3ULGEbMOMWC7/EcAu4SBpzHsUj6P/hTGtmET47o2gGDgqopDZzfwJggk6/JPCdg7SkITbAmf8PL0haj+i1fzbmPV4FRrwXS+BHhlh3JRscU+fQxkXb6SgLNmyGxDFTh+xKEno2afW837cBXro/o17Bl4quLQ66YIZMEXeKfMX/GcLjCm+ZosCl79Qk59M7EvGG/YuirqwwB+wsCDOg+7RIkttskyYBf5dCIsYkCtVvwmtXKx+paTGU9VCjQYJxu7xGeDcYUuRnV7zBs5kzYr//ERZPEq3nPMx891QUE41cvT7dr+4igMGGJgkct7V4Gf6sINWHjdmhX01ASB2EN8BCw8oAuKLXitdz79QttfHIUBgwxEudaZErZpAuP4CJIt8VJifE0rR8IvvDzJpEYt8sSpEwzYLv8IwCE62M1fLY8LJOfyWQxcqQMI4HbPoVM1fcVNGDDOQJyH/Ag4u+zQVRNOsXTvdCqQsE9nGWdBAIWBaRgwdTxvO8WK8UIGEYgcp2ljQASSto5IPqliQASSqnZIMmljQASSto5IPqliQASSqnZIMmljQASSto5IPqliQASSqnZIMmljQASSto5IPqliQASSqnZIMmljQASSto5IPqliQASSqnZIMmljIIUCwcUYBC3dF/T79aDndgO95iXBZ+vFnUEv/zPoxR1BozuAdt4M+gvDGpsLGnsBtKP6dw6o+gJo+zmg0edgVbcDzd0O5I+C1Gd/ADTwF1jqXz8DmjMGqg6AeAsoA1jqZ/4YaDv1bwbEVVCVYQ3UP/sWaKAKYrXfAmVGaz5s1Wwz6l8L5G+BFXz2a/8PPldBPmo/932Q+qP2WX7t58o2U/9Z8FnZMaytU3DICqxB6jNTzYeVj/pc/5narz4HWMraB1mNHAhEgIWGfx1L+VA9RoDfhMdVWCqu+lkjhwBXYQAWNT438lF2gNWcDzVyq8eY4KPs/XoNjXzQlIOqg0GBTz0Wqf31OtTPx/NRdfiwghoQ1KqmP9X86j+v1xrsV/uYt9UQ7GvKASpGA2OGJ1RnEnTz1Ckjc7HS9ttD8hEG4jAgAonDnvjOegZEILO+xVJgHAZEIHHYE99Zz4AIZNa3WAqMw4AIJA574jvrGRCBzPoWS4FxGBCBxGFPfGc9AyKQWd9iKTAOAyKQOOyJ76xnQAQy61ssBcZhQAQShz3xnfUMiEBmfYulwDgMiEDisCe+s54B8wIhMLF6A6laoGfKXzVBnIM/zfsYTAS/2YdrP1N2PgVvNJ3qAwt+M1azHQE+N8VS/mp/8EdNnlafG/trP2vkVNunYtZrUT5kwVc5je9r4NVsx+sKam9gKftGjgQOamoRS+XlN8UK4irMeoyg9m21BLEUjr+Noxrn9ViKt2Dftljj9TbnEHBUtwnwrJqP+vnkfBQHlsrJqtURcKJqqtc+no+ajF/rvx/0r55HAy/AbsRpypMy8H2/nrPa79dqsDK1HjdqVXGqVi0XZaM+Bzn7YGughhHkaoGrCs8H8wCO3Do/XmudEeMCkVePzvpfqj1XYLbEF4lAeq5tknBSDIhAkmJa4vQkAyKQnmybJJ0UAyKQpJiWOD3JgAikJ9smSSfFQLoEQhis5OnipIqXOMJAOwbSJRDGxXHXtm5XsOwXBqIwIAKJwpbY9h0DIpC+a7kUHIUBEUgUtsS27xgQgfRdy6XgKAyIQKKwJbZ9x4AIpO9aLgVHYUAEEoUtse07BtIlELlR2HcHYNoLFoGkvUOSX1cZEIF0lX4JnnYG0iUQmWqS9uOl7/ITgfRdy6XgKAyIQKKwJbZ9x4AIpO9aLgVHYUAEEpKthUN8tGXhJAYOI2DvJrcHGfB84NYRh54MCWfcLOfyiWAcBOBAEA5Ur85h4IcW8CgDj3sOfdN40AiAuSIfA8JJzDgMhNc3uX4fQBmEW708/SwCZCKmIpA2NNsuHwJgCCGWAmbgqiM345zBQbUSczLb4lX80jEfJQDvaxNxTbWKD46cS79OJrNalFyJD2XGZQCObBeXCJeX87S8nV2S+1O4TjppvaSrE6TZLr8HwC0RsR+qZnDKyHL6VUS/yOZHldj2GeUojkQ4o5ynm6P46NraLp8B4MaI/j/IEE5Zm6f/jejXEXMRyDS02i6fDOAOTdbX/80OOPw/Pk5/1PRv65Yr8XuZcVNbwxYGFiF3f548Hd+wPnaRT916KnVbWPtJdo/tWMXh95xLz2n6G3MTgbSgMnc5785VrANjZ22mCXd4eTpF238GxwWX8asyGcT6DTtg4WVrVtAzncgvO8SvpQweA2MHXXwCbis7dJquvyk/EUgLJrMuX0/AMgMkn9CJi2Pb5e8AWBwzvxs9h0zUOCWNnMs3M/BPMfMDCMd6efpWbJwYACKQSeQtXs27jVXx2xicNrve5zl0tCGsAMZ2+XgA3zCBScBJZYfuMoHVwFhU4r+vMv7HEOa9nkPHGcLSghGBTKItV+RlTLhei80WTtXtMW/kTNpsCi/n8oUMfNYEHjE+Xy7QhSawGhi2yx8GcK0pzOpmbD8ySC+YwouKIwKZxJhd4ivAODsqkdPZ+z4OH15J/2UKL+vy1wk40QQeMb5dLtAxJrAaGNkiX0OEj5nCZAtvraygH5nCi4ojApnEWNbl2wkwdnHNjBMrBTJySlQ/xVL3MV4ZtdGt7AnYWHboFSawxkeQIt8FwgnGMLt8HSI3CkUgIpAZ1CwjiJxipfsUq4q3Vs7t4imWLKAzUSFykR7v5Egu0rfxZ34JthQ8ky5f88YTyKz7mjdVI0gKBKIOD7lRGE8kcqOwxt+sHEFUYTLVJJ5AZtVUExlBWh8MMlkxnkhksmInRpCUvbRBa7o748fVASyV6e7BtJjen+6eqhEkZQKp35iTB6ZiDCbywFTt+SZqmmowSISLdDhtvqjR8e+kjzxyG49deeS2zp+pO4/x2iHewoAZBkwdz7N+BDFDt6D0GgMikF7rmOSbKAMikETplmC9xoAIpNc6JvkmyoAIJFG6JVivMSAC6bWOSb6JMiACSZRuCdZrDIhAeq1jkm+iDIhAEqVbgvUaAyKQCB3LFvkEIhzKwKuJMBc+/gTgSbIwXM7TDyJAGTddMMTzM8ABbOEAAvYHUCXghz7jiQHg8bUFetp40AiAg4NsfW8nHM8I+PuHgD/Gsww8yYzh4QL9MAJcYqYikBBUZ4v8KSKot46/bDpzdTCCcWm5QHeHgDRqknN5OQOrZgJl4F8qDp1vNHBIMLvEnyaGyvElM7g8CMIl3X6T4uT8RCAzdGxRkfeoEtSb0A8PeSyAgdUVh1aEtY9jt+RK3nl0FF8FsCQkzroMI5fUaLJ4Fe855gf8vS1kfuopPLdSoEJY+07biUCmYbgujjUAXqfRhOs9hz6g4RfaZeFl/HorA60FewYyeMWa5bQxdDANw7o41gLYQ8P9Os+hj2j4GXcRgUxDqV3iB8A4Qptxxj97BTLyitBWOdgu/waA3jutCE94edpPu7YQjrbLauWo0CPHFEjGBV6BLg0RqqMmIpAW9NpFPl+dD8dlPsN449oCPR4Xp8V58XVE+FAcXAI+XXboc3EwpvNV1xxgfCYudhXYp5vL2qn8RSAtupgt8tNE+Nu4Dd76G974qYLt8lEA1KlL7I19LK6sJCNYjWTq31b9oc0Fedjcr/EcOjOscSfsRCCTWF1Y4uMshqlvop71HJrpm5vIPQ3zjVVYUGacVymQWj/Q2KYWE2Xg6yYAmfH7SoF2NYGliyECmcSc7fLnAVygS+hkP59wwHCefmIKz3b5hhALdoYKx8DXKg69K5RxSCPbZbXgqclvod7gObQ+ZHjjZiKQqQJRi3aqxTuNbMw4rlKge42AqQV0irwehH0M4f3cc2gvQ1gBjOm348PHEm8lqRW1urKJQKYKRC3cqRbwNLIR4eRynoyccqiEbJf/DGCemeSw2cuTGax6QnaJvwnGO43kB8AivPP+PN1jCi8qjghkqkC+DOCDUYmc1p5xlFegSEs1zxTbdnk4zJrtIfP/vufQ20PahjKzXVbLPqv3YRnZLAsL7l9B/2kETANEBDJVIHkArgaXLV0yhN1Nrvltl7gEhpE79QR8qeyQsdWg6qdY5xFg7P5F1cduIytpk6l+RMURgUxiLDvEB5GFh6MSOY39Y55DauKgsS3r8gcJUKNc7I2Bj1Uc+lJsoCaAhUV+q0UwNXHzYc+hN5vMLyqWCKQFY7bLakg/MiqZU+wJeS9PM04ijBojV+IDmfFdADtG9Z1k/wwYC70CPRYTZ4p77LvoDUTGJ70CXWk6vyh4IpBWAlnF74CP+6IQOdlWTeOuOGTq26YJ8CZWumXgtIpDt8WpcTpfu8T/CEa8b+4I67w8vakT+UXBFIFMw1bW5UsJOC8Kmc22PiE3nCdP17+dn+3ygwAObWc3zf5bPYdO1/QN5ZYtcpEITijjFka+jwXDK7t3cd5ISQQyQwdtl78A4ONRm9zJ387NudgubwAQ9T7G7zyH5ketScfedlmtl67WTY+0MeGUSp7U1+1d30QgbVpgu7wSQNjpGOuZcValQJWkOmuX+F3g4KK93f2MF4hxdTnhZy0iTfwkrPOrOCsNI4eMIBGOYLvEexFwFnOwfnqruUGPMuPmSoEujwBrzLS+LuAnARwI4CAAu9TBn9n6MJV6lPVxMG7pxAV5mCIWuLx3psbf0paTQBmPbH1u5KZuX5C3qkVGkDAdbrLJreZ9UMXu6plq9vHnzAA2dPrho4gpQh2Qcy2MrVlBT0X17bS97fK+8LG7lcEcEP60ZQwbunmfo129IpB2DMn+vmZABNLX7Zfi2zEgAmnHkOzvawZEIH3dfim+HQMikHYMyf6+ZkAE0tftl+LbMSACaceQ7O9rBkQgfd1+Kb4dAyKQdgzJ/r5mQATS1+2X4tsxIAJpx5Ds72sGRCB93X4pvh0DnRDIJ4hwVbvA0+y/0XNomaavuAkDxhmwXf4GgON1gOuPPlytfKkBkBvik9jCnTqAAB7yHHqLpq+4CQPGGYjzFn3ycXJ5Ze2daOMCsYv8NhDUq+91tuerm7HLyCCN6TiLjzBgkoGjhvgA38Kj2piMw7wCqUejtwlkwaX86sx2+KUuqOl32ermIX7CgO2yelxYPTastVW3YI+R8+lXEwSydJDnPLMTXtRCBNQSXF+uFCjyc8y68cRPGJiOAdtl9U7gxboMvXQz5t4xSKMTBKL+Y7us3tsUel2/KQl04H1SukWKX38yYBf5AyB8Rbd6tahr2aHxt86MX4MEAinxCjBKuuDKb+NmzF1fV18cHPEVBqIyUF8cVS3xrb0xYbCSp4sbABMEEvvipjYmPeLl6WDtDMVRGNBkwHb5RwAO0XQP3HzGoc1rv08QSP00679RW9A+7rZo6xvI748LIv7CQDsGsi6/mwC1QNHcdrYz7if81MvTvs02UwSSK/FqZpwTK1DdmQhXW8CQybekm8hLMGYPA7bL6pVN6tVJ8TfClV6eJmBNEciiIu9Xrb3lO+5LlhsJPwcEb11Xf79XzWBkZDk9G78aQeg3Bo67jOf9dQBv8X28BRYOAUPdnH6lIR6ezzAOnby68RSB1E+zjK7316KAnwF4hBkbKgUaNFSgNkyuxO8FI8e1U8uuv3hZuxBxjMPAJZ5Dn5oM0FIgi4q8a30U2SNOxJC+v1VvPyw7dFdIe2Nm9iX8MszBFwEsNQYqQL3IwC/ro8fToQRSH0XUuVhir+S0LBxy/wr6cVLsLrmS546O4oWk4kmcVDNwztZlv69olWHLEaRhmCvxGmYsSqQ0whNenvZLJFbtpqhaYPLYpOJJnHQyQMA9ZYemXbx0RoHYq/k1qAYTGP8uifIm36TpVMzsKl5EPtZ0Cl9we4MBBp4aYLx9bYGmnFo1KphRIMGpVpFzICR1P6PiOWR3mt5siT9FjM91Oo7gp5uBDOONk7+1Cn0N0mwYd3ZkBJq2PDsPOz78EdoSwSeyaaKnjpGzE4ckGGDg6IpDbZfrazuCjF+PuLycAaMLW7a8KGIsLBdopJMk2S5zJ/EFO90MMOHCSp7UrYy2W2iBKKTsEC8iq6Pn7s97Du3UNuuYBnKBHpPA3nY/03PomrAlRBJIIJISH0Y+bt86pfhVYYOEtWv3jUJYnHZ2uYRGw3Z5yP5EGVDLZ5/pFeirUaJGFogCt4v8JgYuJcLRUYK1syXCGeU83dzOLu7+hS4fbAGJ3XOJm6/4x2OAGd9m4DPNs3TDImoJpAGeLfFS4mA12QVhA85gd4fnkFpLMJFNdyXXRJKTIKYYGGHCNXFW3o0lkHGhDPH7yAqEoj8XfxQv9y6g/zPFTBgcuVgPw1JP2jzEPq6prKQb42ZvRCDjQnF5ydbVWYO/BOwZMrl758zB0vvOJu3n4UPGaWmWdfmjhGA+lmy9zADhCTDu9gmV4Tx5pkoxKpDmpNR5PjGOJWA+LMwnxnxm7AbCfDAeZgtrLMYPyg51/Y72whLvbzGOISDLQMdvVJpqXh/ijIKxiQgbmbAJPjYxsGkAuLPdDT9drjomEN2ExE8YSBMDIpA0dUNySR0DIpDUtUQSShMDIpA0dUNySR0DIpDUtUQSShMDIpA0dUNySR0D/w9O0HmbNxG/pgAAAABJRU5ErkJggg==";
@@ -387,7 +442,7 @@ const getCharts2 = () => {
       icon: "circle",
       top: 20,
       x: "center",
-      data: ["正常出勤", "未出勤", "请假", "其他"]
+      data: label
     },
     color: ["#175BFE", "#F4B91E", "#816AF6", "#13C8CB"],
     series: [
@@ -407,24 +462,7 @@ const getCharts2 = () => {
           show: true,
           formatter: "{d}%"
         },
-        data: [
-          {
-            value: 100,
-            name: "正常出勤"
-          },
-          {
-            value: 100,
-            name: "未出勤"
-          },
-          {
-            value: 100,
-            name: "请假"
-          },
-          {
-            value: 100,
-            name: "其他"
-          }
-        ]
+        data: value
       }
     ]
   };
@@ -433,19 +471,20 @@ const getCharts2 = () => {
     chart2.resize();
   });
 };
-const getCharts3 = () => {
+const getCharts3 = (label: any, value: any) => {
   const chart3 = echarts.init(chartEl3.value);
   let option = {
     xAxis: {
       type: "category",
-      data: state.weekDates
+      // data: state.weekDates
+      data: label
     },
     yAxis: {
       type: "value"
     },
     series: [
       {
-        data: [150, 230, 224, 218, 135, 147, 260],
+        data: value,
         type: "line"
       }
     ]
@@ -455,9 +494,9 @@ const getCharts3 = () => {
     chart3.resize();
   });
 };
-const getCharts4 = () => {
+const getCharts4 = (label: any, value: any) => {
   const chart4 = echarts.init(chartEl4.value);
-  let xAxisData = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
+  // let xAxisData = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
   let data1 = [];
   let data2 = [];
   let data3 = [];
@@ -489,7 +528,7 @@ const getCharts4 = () => {
       data: ["食堂", "生活消费", "交通", "其他"]
     },
     xAxis: {
-      data: xAxisData,
+      data: label,
       name: "时间",
       axisLine: { onZero: true },
       splitLine: { show: false },
@@ -510,47 +549,53 @@ const getCharts4 = () => {
         type: "bar",
         stack: "one",
         emphasis: emphasisStyle,
-        data: data1
-      },
-      {
-        name: "生活消费",
-        barWidth: 20,
-        type: "bar",
-        stack: "one",
-        emphasis: emphasisStyle,
-        data: data2
-      },
-      {
-        name: "交通",
-        barWidth: 20,
-        type: "bar",
-        stack: "one",
-        emphasis: emphasisStyle,
-        data: data3
-      },
-      {
-        name: "其他",
-        barWidth: 20,
-        type: "bar",
-        stack: "one",
-        emphasis: emphasisStyle,
-        data: data4
-      },
-      {
-        name: "总计",
-        type: "bar",
-        stack: "one",
+        data: value,
         label: {
           show: true,
           position: "insideBottom",
           formatter: "{c}",
           textStyle: { color: "#000" }
-        },
-        itemStyle: {
-          color: "rgba(128, 128, 128, 0)"
-        },
-        data: data5
+        }
       }
+      // {
+      //   name: "生活消费",
+      //   barWidth: 20,
+      //   type: "bar",
+      //   stack: "one",
+      //   emphasis: emphasisStyle,
+      //   data: data2
+      // },
+      // {
+      //   name: "交通",
+      //   barWidth: 20,
+      //   type: "bar",
+      //   stack: "one",
+      //   emphasis: emphasisStyle,
+      //   data: data3
+      // },
+      // {
+      //   name: "其他",
+      //   barWidth: 20,
+      //   type: "bar",
+      //   stack: "one",
+      //   emphasis: emphasisStyle,
+      //   data: data4
+      // },
+      // {
+      //   name: "总计",
+      //   type: "bar",
+      //   stack: "one",
+      //   label: {
+      //     show: true,
+      //     position: "insideBottom",
+      //     formatter: "{c}",
+      //     textStyle: { color: "#000" }
+      //   },
+      //   itemStyle: {
+      //     color: "rgba(128, 128, 128, 0)"
+      //   },
+      //   data: data5
+      // }
     ]
   };
   chart4.setOption(option);
@@ -578,9 +623,6 @@ const getWeekDates = () => {
 onMounted(() => {
   getWeekDates();
   getDetail();
-  getCharts2();
-  getCharts3();
-  getCharts4();
 });
 </script>
 <style lang="scss" scoped>
@@ -671,48 +713,49 @@ onMounted(() => {
           margin-right: 5px;
           color: #f27078;
         }
-        &:nth-child(1),
-        &:nth-child(2) {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          padding: 0 40px;
-          .laberAttrName {
-            display: flex;
-            align-items: center;
-            font-size: 14px;
-          }
-          .icon {
-            display: inline-block;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            width: 30px;
-            height: 30px;
-            margin-right: 15px;
-            background: #ffffff;
-            border-radius: 50%;
-          }
-        }
-        &:nth-child(1) {
-          background: rgb(60 126 221 / 10%);
-          .like-outlined,
-          .laberAttrValue {
-            font-weight: 600;
-            color: rgb(60 126 221);
-          }
-        }
-        &:nth-child(2) {
-          background: rgb(243 169 148 / 20%);
-          .like-outlined,
-          .laberAttrValue {
-            font-weight: 600;
-            color: rgb(243 169 148);
-          }
-        }
-        &:nth-child(2n) {
-          margin-right: 0;
-        }
+
+        // &:nth-child(1),
+        // &:nth-child(2) {
+        //   display: flex;
+        //   align-items: center;
+        //   justify-content: space-between;
+        //   padding: 0 40px;
+        //   .laberAttrName {
+        //     display: flex;
+        //     align-items: center;
+        //     font-size: 14px;
+        //   }
+        //   .icon {
+        //     display: inline-block;
+        //     display: flex;
+        //     align-items: center;
+        //     justify-content: center;
+        //     width: 30px;
+        //     height: 30px;
+        //     margin-right: 15px;
+        //     background: #ffffff;
+        //     border-radius: 50%;
+        //   }
+        // }
+        // &:nth-child(1) {
+        //   background: rgb(60 126 221 / 10%);
+        //   .like-outlined,
+        //   .laberAttrValue {
+        //     font-weight: 600;
+        //     color: rgb(60 126 221);
+        //   }
+        // }
+        // &:nth-child(2) {
+        //   background: rgb(243 169 148 / 20%);
+        //   .like-outlined,
+        //   .laberAttrValue {
+        //     font-weight: 600;
+        //     color: rgb(243 169 148);
+        //   }
+        // }
+        // &:nth-child(2n) {
+        //   margin-right: 0;
+        // }
       }
     }
   }