From 00d96736d93700b6bad11903f73ca446b11d7ac4 Mon Sep 17 00:00:00 2001
From: ww <ww.cn>
Date: Wed, 7 Aug 2024 19:07:51 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E9=83=A8=E5=88=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/user/user.js                          |  12 +-
 src/views/home/components/ConHeader.vue       |   5 +-
 src/views/home/components/Echart/Echarts.vue  |  39 +--
 src/views/home/components/Echarts.vue         |  24 +-
 src/views/home/components/Info keep.vue       | 287 ------------------
 src/views/home/components/Info.vue            | 156 ----------
 src/views/home/components/Lessonlist.vue      |  14 +-
 src/views/home/components/Status.vue          |  42 ++-
 src/views/home/components/Student1.vue        |  32 +-
 src/views/home/components/Student2.vue        |  97 ------
 src/views/home/components/Welcome.vue         |  42 +--
 .../home/components/infoContainer/index.vue   |  47 ---
 src/views/home/components/myDrawer/index.vue  | 120 --------
 src/views/home/index.vue                      | 132 +-------
 src/views/student/index.vue                   | 240 ++++++++++++++-
 15 files changed, 367 insertions(+), 922 deletions(-)
 delete mode 100644 src/views/home/components/Info keep.vue
 delete mode 100644 src/views/home/components/Info.vue
 delete mode 100644 src/views/home/components/Student2.vue
 delete mode 100644 src/views/home/components/infoContainer/index.vue
 delete mode 100644 src/views/home/components/myDrawer/index.vue

diff --git a/src/api/user/user.js b/src/api/user/user.js
index c74ddaf..01f3b52 100644
--- a/src/api/user/user.js
+++ b/src/api/user/user.js
@@ -63,6 +63,14 @@ export const userStudentListService = (id) => {
   return request.post('/api/coursesteacher/studentList?userId=' + id)
 }
 //获取课程列表
-export const userLessonListService = (id) => {
-  return request.post('/api/coursesteacher/studentList?userId=' + id)
+// export const userLessonListService = (id) => {
+//   return request.post('/api/coursesteacher/studentList?userId=' + id)
+// }
+//获取浏览量
+export const userLookService = () => {
+  return request.get('/api/report/receptionBrowse')
+}
+//获取图表
+export const userPicService = () => {
+  return request.get('/api/report/browseStatistics')
 }
diff --git a/src/views/home/components/ConHeader.vue b/src/views/home/components/ConHeader.vue
index f885926..58710e8 100644
--- a/src/views/home/components/ConHeader.vue
+++ b/src/views/home/components/ConHeader.vue
@@ -13,14 +13,14 @@
 </template>
 
 <script lang="ts" setup>
-import { defineProps } from 'vue'
 import ellipsis from '@/assets/images/ellipsis.png'
+import { defineProps } from 'vue'
 const props = defineProps({
   title: String,
   modelValue: Boolean,
   urouter: String,
 })
-console.log(props.urouter, 'router111')
+console.log(props.title, 'router111')
 import { useRouter } from 'vue-router'
 const router = useRouter()
 </script>
@@ -55,5 +55,6 @@ const router = useRouter()
   font-size: small;
   justify-content: center;
   align-items: center;
+  cursor: pointer;
 }
 </style>
diff --git a/src/views/home/components/Echart/Echarts.vue b/src/views/home/components/Echart/Echarts.vue
index c982774..c54a51b 100644
--- a/src/views/home/components/Echart/Echarts.vue
+++ b/src/views/home/components/Echart/Echarts.vue
@@ -1,8 +1,18 @@
 <script setup lang="ts">
+//获取数据
 import * as echarts from 'echarts'
-import { ref, onMounted, Ref } from 'vue'
+import { ref, onMounted, Ref, toRefs, computed } from 'vue'
+import { defineProps } from 'vue'
 const echarsDom: Ref<HTMLElement | any> = ref(null)
+const props = defineProps({
+  // lastMonthBrowseList: String,
+  // dataList: String,
+  // thisMonthBrowseList: String,
+  count: Object,
+})
+
 onMounted(() => {
+  console.log(props.count.dateList, 'count')
   const myChart = echarts.init(echarsDom.value)
   // 绘制图表
   myChart.setOption({
@@ -30,16 +40,7 @@ onMounted(() => {
     xAxis: [
       {
         type: 'category',
-        data: [
-          '09-01',
-          '09-03',
-          '09-05',
-          '09-07',
-          '09-09',
-          '09-11',
-          '09-13',
-          '09-15',
-        ],
+        data: props.count.dateList.split(','),
         axisPointer: {
           type: 'shadow',
         },
@@ -50,8 +51,8 @@ onMounted(() => {
         type: 'value',
         name: '浏览次数',
         min: 0,
-        max: 200,
-        interval: 40,
+        max: 600,
+        interval: 100,
         axisLabel: {
           formatter: '{value}',
         },
@@ -60,8 +61,8 @@ onMounted(() => {
         type: 'value',
         name: '',
         min: 0,
-        max: 100,
-        interval: 20,
+        max: 600,
+        interval: 100,
         axisLabel: {
           formatter: '{value}',
         },
@@ -76,7 +77,7 @@ onMounted(() => {
             return (value as number) + ' 次'
           },
         },
-        data: [2, 4, 7, 23, 25, 76, 35, 62, 32, 20, 6, 3],
+        data: props.count.thisMonthBrowseList.split(','),
       },
       {
         name: '上月',
@@ -86,17 +87,17 @@ onMounted(() => {
             return (value as number) + ' 次'
           },
         },
-        data: [2, 5, 9, 26, 28, 70, 75, 82, 48, 18, 6, 2],
+        data: props.count.lastMonthBrowseList.split(','),
       },
       {
         type: 'line',
         yAxisIndex: 1,
-        data: [2, 4, 7, 23, 25, 76, 35, 62, 32, 20, 6, 3],
+        data: props.count.thisMonthBrowseList.split(','),
       },
       {
         type: 'line',
         yAxisIndex: 1,
-        data: [2, 5, 9, 26, 28, 70, 75, 82, 48, 18, 6, 2],
+        data: props.count.lastMonthBrowseList.split(','),
       },
     ],
   })
diff --git a/src/views/home/components/Echarts.vue b/src/views/home/components/Echarts.vue
index 5a9493d..d08a437 100644
--- a/src/views/home/components/Echarts.vue
+++ b/src/views/home/components/Echarts.vue
@@ -1,19 +1,37 @@
 <script setup>
 import echarts from '@/views/home/components/Echart/Echarts.vue'
 import conheader from '@/views/home/components/ConHeader.vue'
-defineProps(['sum'])
+import { userPicService } from '@/api/user/user'
+import { ref, onMounted } from 'vue'
+// const dataList = ref()
+// const lastMonthBrowseList = ref()
+// const thisMonthBrowseList = ref()
+const flag = ref(false)
+
+const count = ref()
+onMounted(() => {
+  userPicService().then((res) => {
+    flag.value = true
+    // dataList.value = res.data.dateList
+    // lastMonthBrowseList.value = res.data.lastMonthBrowseList
+    // thisMonthBrowseList.value = res.data.thisMonthBrowseList
+    count.value = res.data
+    console.log(res.data, 'echart11')
+    console.log(count.value, 'echart')
+  })
+})
 </script>
 <template>
   <div
     class="info_container"
     style="width: 95%; height: 85%; background: #fff; align-items: center"
   >
-    <conheader :title="`主页访问数据(${sum}次)`"></conheader>
+    <conheader :title="`主页访问数据`"></conheader>
     <div
       class="info_content"
       style="width: 95%; margin-top: 10px; height: 90%; margin-left: -30px"
     >
-      <echarts></echarts>
+      <echarts :count="count" v-if="flag"></echarts>
     </div>
   </div>
 </template>
diff --git a/src/views/home/components/Info keep.vue b/src/views/home/components/Info keep.vue
deleted file mode 100644
index d0c638b..0000000
--- a/src/views/home/components/Info keep.vue	
+++ /dev/null
@@ -1,287 +0,0 @@
-<script setup>
-import conheader from '@/views/home/components/ConHeader.vue'
-import { onMounted, ref, computed } from 'vue'
-import { userIdenChangeService } from '@/api/user/user.js'
-import { Edit } from '@element-plus/icons-vue'
-import { ElMessage } from 'element-plus'
-const props = defineProps({
-  data: {
-    type: Object,
-  },
-})
-const formModel = ref()
-const newFormModel = ref()
-const loading = ref()
-//抽屉true
-const editDialogVisible = ref(false)
-const editForm = ref({
-  name: '',
-  content: '',
-})
-const readonlyField = computed(() => editForm.value.name)
-const editRowIndex = ref()
-const openEditDialog = (row) => {
-  editForm.value = { ...row }
-  editRowIndex.value = formModel.value.indexOf(row)
-  editDialogVisible.value = true
-}
-//确认时将表单数据回显
-const saveEdit = () => {
-  const index = editRowIndex.value
-  if (index !== -1) {
-    formModel.value[index] = { ...editForm.value }
-  }
-  // console.log(editRowIndex.value, 'edit')
-  editDialogVisible.value = false
-}
-//取消
-const cancelEdit = () => {
-  editDialogVisible.value = false
-  //重置表单
-  editForm.value = {
-    name: '',
-    content: '',
-  }
-}
-const formValue = []
-onMounted(() => {
-  if (props.data.roleId[0] === '1') {
-    formModel.value = [
-      { par: 'name', name: '姓名', content: props.data.name },
-      { par: 'sex', name: '性别', content: props.data.sex },
-      { par: 'nationality', name: '民族', content: props.data.nationality },
-      { par: 'profession', name: '专业', content: props.data.profession },
-      { par: 'education', name: '学历', content: props.data.education },
-      {
-        par: 'academicDegree',
-        name: '学位',
-        content: props.data.academicDegree,
-      },
-      {
-        par: 'professionalTitle',
-        name: '职称',
-        content: props.data.professionalTitle,
-      },
-      {
-        par: 'emergencyContact',
-        name: '手机号',
-        content: props.data.emergencyContact,
-      },
-      {
-        par: 'joinWorkTime',
-        name: '参加工作时间',
-        content: props.data.joinWorkTime,
-      },
-      {
-        par: 'politicalStatus',
-        name: '政治面貌',
-        content: props.data.politicalStatus,
-      },
-    ]
-    newFormModel.value = { ...formModel.value }
-    formValue.value = formModel.value
-  } else if (props.data.roleId[0] === '2') {
-    formModel.value = [
-      { par: 'name', name: '姓名', content: props.data.name },
-      { par: 'sex', name: '性别', content: props.data.sex },
-      { par: 'nationality', name: '民族', content: props.data.nationality },
-      { par: 'number', name: '学号', content: props.data.number },
-      { par: 'birthday', name: '生日', content: props.data.birthday },
-      { par: 'phone', name: '手机号', content: props.data.phone },
-      { par: 'faculty', name: '院系', content: props.data.faculty },
-      { par: 'major', name: '专业', content: props.data.major },
-      { par: 'yearAge', name: '入学年份', content: props.data.yearAge },
-      { par: 'className', name: '班级', content: props.data.className },
-    ]
-    newFormModel.value = { ...formModel.value }
-    formValue.value = formModel.value
-  }
-  // else {
-  //   formModel.value = [
-  //     { name: '姓名', content: res.data.name },
-  //     { name: '性别', content: res.data.id },
-  //     { name: '学号', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //     { name: '小米电脑', content: 9.9 },
-  //   ]
-  // }
-})
-// 编辑1
-const drawer2 = ref(false)
-const direction = ref('rtl')
-const data1 = ref([])
-
-const confirmClick = () => {
-  drawer2.value = false
-  data1.value = formModel.value
-  const values = {}
-  data1.value.map((item) => (values[item.par] = item.content))
-  const dataToSend = {
-    ...values,
-    roleId: props.data.roleId,
-    id: props.data.id,
-    userId: props.data.userId,
-  }
-  userIdenChangeService(dataToSend)
-    .then(() => {
-      ElMessage.success('修改成功')
-    })
-    .catch((error) => {
-      console.log(error)
-    })
-}
-function cancelClick() {
-  drawer2.value = false
-}
-</script>
-<template>
-  <div class="info_container" style="width: 95%; height: 306px">
-    <conheader title="个人信息" v-model="drawer2">
-      <template #drawer>
-        <el-drawer v-model="drawer2" :direction="direction" class="table">
-          <template #header>
-            <h4>个人信息</h4>
-          </template>
-          <template #default>
-            <div>
-              <el-table :data="formModel" style="width: 100%">
-                <el-table-column prop="name" label="标题"></el-table-column>
-                <el-table-column prop="content" label="内容"></el-table-column>
-                <el-table-column label="操作">
-                  <template #default="{ row }">
-                    <el-button
-                      type="primary"
-                      class="el-icon-edit"
-                      :icon="Edit"
-                      plain
-                      circle
-                      @click="openEditDialog(row)"
-                    ></el-button>
-                  </template>
-                </el-table-column>
-              </el-table>
-            </div>
-          </template>
-          <template #footer>
-            <div style="flex: auto">
-              <el-button @click="cancelClick" size="medium">取消</el-button>
-              <el-button type="primary" @click="confirmClick">确认</el-button>
-            </div>
-          </template>
-        </el-drawer>
-        <el-dialog
-          v-model="editDialogVisible"
-          title="详细信息"
-          style="width: 800px; text-align: center"
-          :readonly-field="readonlyField"
-        >
-          <el-form :model="editForm" label-width="80px">
-            <el-form-item label="名称" prop="name">
-              <el-input v-model="editForm.name"></el-input>
-            </el-form-item>
-            <el-form-item label="内容" prop="content">
-              <template v-if="editForm.name !== '性别'">
-                <el-input v-model="editForm.content"></el-input>
-              </template>
-              <template v-else>
-                <el-select
-                  v-model="editForm.content"
-                  filterable
-                  placeholder="Select"
-                >
-                  <el-option
-                    v-for="item in [
-                      {
-                        value: '男',
-                        label: '男',
-                      },
-                      {
-                        value: '女',
-                        label: '女',
-                      },
-                    ]"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </el-select>
-              </template>
-            </el-form-item>
-          </el-form>
-          <template #footer>
-            <div>
-              <el-button @click="cancelEdit">取消</el-button>
-              <el-button type="primary" @click="saveEdit">保存</el-button>
-            </div>
-          </template>
-        </el-dialog>
-      </template>
-    </conheader>
-    <div
-      class="info_content"
-      style="width: 60%; height: 244px"
-      v-loading="loading"
-    >
-      <div class="item" :key="item.name" v-for="item in newFormModel">
-        <div class="name">{{ item.name }}</div>
-        <div class="content">{{ item.content }}</div>
-      </div>
-    </div>
-  </div>
-</template>
-<style scoped>
-.info_container {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.info_content {
-  display: grid;
-  display: wrap;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 10px; /* 设置元素之间的间隔 */
-}
-.item {
-  width: 100%;
-  height: 60px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.name {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.4);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-.content {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.9);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-.table {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.custom-input {
-  margin-bottom: 20px;
-  height: 40px; /* 自定义输入框高度 */
-  padding: 0 10px; /* 自定义输入框内边距 */
-  font-size: 16px; /* 自定义输入框字体大小 */
-  /* 其他样式自定义 */
-}
-</style>
diff --git a/src/views/home/components/Info.vue b/src/views/home/components/Info.vue
deleted file mode 100644
index a96b9cd..0000000
--- a/src/views/home/components/Info.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<script setup>
-// import ellipsis from '@/assets/images/ellipsis.png'
-// import conheader from '@/views/home/components/ConHeader.vue'
-// import { ref, computed } from 'vue'
-// import { userIdenChangeService } from '@/api/user/user.js'
-// import { ElMessage } from 'element-plus'
-// import InfoContainer from './infoContainer/index.vue'
-// import myDrawer from './myDrawer/index.vue'
-// const props = defineProps({
-//   data: {
-//     type: Object,
-//   },
-// })
-// // ============== formModel
-// const formModel = ref()
-// switch (+props.data.roleId[0]) {
-//   case 1:
-//     formModel.value = [
-//       { par: 'name', name: '姓名', content: props.data.name },
-//       { par: 'sex', name: '性别', content: props.data.sex },
-//       { par: 'nationality', name: '民族', content: props.data.nationality },
-//       { par: 'profession', name: '专业', content: props.data.profession },
-//       { par: 'education', name: '学历', content: props.data.education },
-//       {
-//         par: 'academicDegree',
-//         name: '学位',
-//         content: props.data.academicDegree,
-//       },
-//       {
-//         par: 'professionalTitle',
-//         name: '职称',
-//         content: props.data.professionalTitle,
-//       },
-//       {
-//         par: 'emergencyContact',
-//         name: '手机号',
-//         content: props.data.emergencyContact,
-//       },
-//       {
-//         par: 'joinWorkTime',
-//         name: '参加工作时间',
-//         content: props.data.joinWorkTime,
-//       },
-//       {
-//         par: 'politicalStatus',
-//         name: '政治面貌',
-//         content: props.data.politicalStatus,
-//       },
-//     ]
-//     break
-//   case 2:
-//     formModel.value = [
-//       { par: 'name', name: '姓名', content: props.data.name },
-//       { par: 'sex', name: '性别', content: props.data.sex },
-//       { par: 'nationality', name: '民族', content: props.data.nationality },
-//       { par: 'number', name: '学号', content: props.data.number },
-//       { par: 'birthday', name: '生日', content: props.data.birthday },
-//       { par: 'phone', name: '手机号', content: props.data.phone },
-//       { par: 'faculty', name: '院系', content: props.data.faculty },
-//       { par: 'major', name: '专业', content: props.data.major },
-//       { par: 'yearAge', name: '入学年份', content: props.data.yearAge },
-//       { par: 'className', name: '班级', content: props.data.className },
-//     ]
-//     break
-// }
-// // ==============
-
-// // 编辑1
-// const drawer2 = ref(false)
-</script>
-<template>
-  <div class="info_container" style="width: 95%; height: 306px">
-    <div class="info_title">
-      <div class="title_name">个人信息</div>
-      <div class="icon">
-        <img :src="ellipsis" @click="drawer2 = true" />
-      </div>
-    </div>
-    <!-- <InfoContainer :data="formModel"></InfoContainer>
-    <myDrawer v-model:drawer="drawer2" :data="formModel"></myDrawer> -->
-  </div>
-</template>
-<style scoped>
-.info_container {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.info_content {
-  display: grid;
-  display: wrap;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 10px; /* 设置元素之间的间隔 */
-}
-.item {
-  width: 100%;
-  height: 60px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.name {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.4);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-.content {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.9);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-
-.custom-input {
-  margin-bottom: 20px;
-  height: 40px; /* 自定义输入框高度 */
-  padding: 0 10px; /* 自定义输入框内边距 */
-  font-size: 16px; /* 自定义输入框字体大小 */
-  /* 其他样式自定义 */
-}
-
-/* ======= */
-.info_title {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  .title_name {
-    font-family: Inter, Inter;
-    font-weight: 400;
-    font-size: 20px;
-    color: rgba(0, 0, 0, 0.9);
-    line-height: 30px;
-    text-align: left;
-    font-style: normal;
-    text-transform: none;
-  }
-}
-
-.icon {
-  width: 32px;
-  height: 32px;
-  border-radius: 3px 3px 3px 3px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-</style>
diff --git a/src/views/home/components/Lessonlist.vue b/src/views/home/components/Lessonlist.vue
index 0b3769a..215956f 100644
--- a/src/views/home/components/Lessonlist.vue
+++ b/src/views/home/components/Lessonlist.vue
@@ -1,12 +1,12 @@
 <script setup>
 import conheader from '@/views/home/components/ConHeader.vue'
 import fe from '@/assets/images/fe.jpg'
-import { userLessonListService } from '@/api/user/user.js'
-const getLesList = async () => {
-  const res = await userLessonListService()
-  console.log(res)
-}
-getLesList()
+// import { userLessonListService } from '@/api/user/user.js'
+// const getLesList = async () => {
+//   const res = await userLessonListService()
+//   console.log(res)
+// }
+// getLesList()
 </script>
 <template>
   <div class="lesson_container" style="width: 95%; height: 90%">
@@ -18,7 +18,7 @@ getLesList()
       <div class="lessonlist-item" v-for="item in 4" :key="item">
         <div class="lessonlist-item-img">
           <img
-            src="https://wenyu132.oss-cn-beijing.aliyuncs.com/wenyu/UyiQwGiIAHT_3D6dBcGhf.png"
+            src=""
             alt=""
             style="width: 100%; height: 125px; border-radius: 10px 10px 0px 0px"
           />
diff --git a/src/views/home/components/Status.vue b/src/views/home/components/Status.vue
index 50e5e5e..bdeea9b 100644
--- a/src/views/home/components/Status.vue
+++ b/src/views/home/components/Status.vue
@@ -1,9 +1,11 @@
 <script setup>
 import add from '@/assets/images/add.png'
-import tool from '@/utils/oss.js'
+// import tool from '@/utils/oss.js'
 import { userChangeService } from '@/api/user/user.js'
 import { ref, defineEmits, onMounted } from 'vue'
 import { ElMessage } from 'element-plus'
+import { Edit } from '@element-plus/icons-vue'
+import { tool, client } from '@/utils/alioss.js'
 // import { error } from 'echarts/types/src/util/log.js'
 const props = defineProps({
   data: {
@@ -14,30 +16,34 @@ const props = defineProps({
   },
 })
 
-// console.log(props.userData.professionalTitle, 'props.infoData')
 const imageUrl = ref()
 //设置头像显示
 imageUrl.value = props.data.icon
-console.log(imageUrl.value, 'img')
+// console.log(props.data.username, 'img')
 //设置头像更换
 const upload = async (option) => {
   const res = await tool.oss.upload(option.file)
-  const url = 'https://wenyu132.oss-cn-beijing.aliyuncs.com/' + res.name
-  imageUrl.value = url
+  imageUrl.value = res.url
+  changeInfo()
+  // console.log(imageUrl.value, 'img')
 }
 //修改用户头像
 const emit = defineEmits(['get-avater'])
 let isUploading = ref(false)
 const changeInfo = async () => {
+  // console.log('向后端服务器发起请求，修改用户头像信息', imageUrl.value)
   if (!isUploading.value) {
     isUploading.value = true
     const userInfo = {
       id: props.data.id,
       icon: imageUrl.value,
+      username: props.data.username,
     }
     const jsonData = JSON.stringify(userInfo)
+
     await userChangeService(jsonData).then(() => {
       ElMessage.success('修改成功')
+      // console.log(imageUrl.value, 'fs')
       emit('get-avater', imageUrl.value)
     })
     isUploading.value = false
@@ -76,15 +82,19 @@ const loading = ref(false)
       <el-upload
         class="click"
         :http-request="upload"
-        @change="changeInfo"
         :show-file-list="false"
         auto-upload="false"
       >
         <img :src="add" />
       </el-upload>
-      <div class="info_content" style="height: 58px" @click="openInfo">
+      <div class="info_content" style="height: 58px">
         <div class="name">{{ props.data.username }}</div>
-        <div class="na">{{ props.userData.professionalTitle }}</div>
+        <div class="na">
+          {{ props.userData.professionalTitle }}
+          <el-icon class="icon" @click="openInfo">
+            <Edit />
+          </el-icon>
+        </div>
       </div>
     </div>
   </div>
@@ -156,6 +166,22 @@ const loading = ref(false)
   text-align: left;
   font-style: normal;
   text-transform: none;
+  align-items: center;
+  display: flex;
+  /* justify-content: space-between; */
+  .icon {
+    font-size: 20px;
+    margin-left: 5px;
+  }
+  .icon:hover {
+    color: #cddefa;
+  }
+}
+.footer {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  margin-top: 20px;
 }
 .iden {
   width: 126px;
diff --git a/src/views/home/components/Student1.vue b/src/views/home/components/Student1.vue
index d20a1e4..a462e06 100644
--- a/src/views/home/components/Student1.vue
+++ b/src/views/home/components/Student1.vue
@@ -6,16 +6,14 @@ import { userStudentListService } from '@/api/user/user'
 import useUserStore from '@/store/modules/user'
 const userStore = useUserStore()
 const router = useRouter()
-// const router1 = '/studentManagement/student'
 const loading = ref(false)
 const stuList = ref([])
-const img = ref()
 const getStuList = async () => {
   loading.value = true
   const res = await userStudentListService(userStore.data.id)
-  // console.log(res, 'userRes')
+  // console.log(res.data, 'userRes')
   stuList.value = res.data
-  console.log(stuList.value[0].icon, 'rrr')
+  // console.log(stuList.value[1].icon, 'rrr')
   loading.value = false
 }
 getStuList()
@@ -29,34 +27,13 @@ getStuList()
       :title="`学生`"
       :urouter="'/studentManagement/student'"
     ></conheader>
-
-    <!-- <div>编辑</div>
-      <template #drawer>
-        <el-drawer v-model="drawer2" :direction="direction">
-          <template #header>
-            <h4>78</h4>
-          </template>
-          <template #default>
-            <div></div>
-          </template>
-          <template #footer>
-            <div style="flex: auto">
-              <el-button @click="cancelClick">cancel</el-button>
-              <el-button type="primary" @click="confirmClick">
-                confirm
-              </el-button>
-            </div>
-          </template>
-        </el-drawer>
-      </template> -->
-
     <div class="stu_content" v-loading="loading">
       <ul>
         <li class="stu-item" v-for="(item, index) in stuList" :key="index">
           <img :src="item.icon" class="stu-item-img" />
           <div class="stu-item-info">
             <h4>{{ item.name }}</h4>
-            <h4 style="color: #a7a9aa">{{ item.number }}</h4>
+            <h4 style="color: #666">{{ item.number }}</h4>
           </div>
         </li>
       </ul>
@@ -118,6 +95,9 @@ h4 {
   margin-left: 15px;
   font-weight: bold;
   font-size: 14px;
+  font-family: Inter, Inter;
+  /* font-weight: 400; */
+  /* font-size: 20px; */
   /* font-family: 'soft'; */
   /* color: #000000 */
 }
diff --git a/src/views/home/components/Student2.vue b/src/views/home/components/Student2.vue
deleted file mode 100644
index ae268d4..0000000
--- a/src/views/home/components/Student2.vue
+++ /dev/null
@@ -1,97 +0,0 @@
-<script setup>
-import conheader from '@/views/home/components/ConHeader.vue'
-import { ref } from 'vue'
-const name = ['Aa', 'Bb', 'Cc', 'Dd']
-const getRandomColor = () => {
-  // 生成随机的颜色值
-  return '#' + Math.floor(Math.random() * 16777215).toString(16)
-}
-const drawer2 = ref(false)
-const direction = ref('rtl')
-function cancelClick() {
-  drawer2.value = false
-}
-function confirmClick() {
-  drawer2.value = false
-}
-</script>
-<template>
-  <div class="info_container" style="width: 90%; height: 174px">
-    <conheader title="已分组别" v-model="drawer2">
-      <div>编辑</div>
-      <template #drawer>
-        <el-drawer v-model="drawer2" :direction="direction">
-          <template #header>
-            <h4>78</h4>
-          </template>
-          <template #default>
-            <div></div>
-          </template>
-          <template #footer>
-            <div style="flex: auto">
-              <el-button @click="cancelClick">cancel</el-button>
-              <el-button type="primary" @click="confirmClick">
-                confirm
-              </el-button>
-            </div>
-          </template>
-        </el-drawer>
-      </template>
-    </conheader>
-    <div class="info_content" style="width: 194px; height: 112px">
-      <div
-        v-for="(item, index) in name"
-        :key="index"
-        class="stu_color"
-        :style="{ backgroundColor: getRandomColor() }"
-      >
-        {{ item }}
-      </div>
-    </div>
-  </div>
-</template>
-<style scoped>
-.stu {
-  background: #ffffff;
-  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
-  border-radius: 6px 6px 6px 6px;
-  display: flex;
-
-  justify-content: center;
-  align-items: center;
-}
-.info_container {
-  display: flex;
-  justify-content: space-between;
-}
-.info_content {
-  width: 194px;
-  height: 112px;
-  flex-wrap: wrap;
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 24px; /* 设置元素之间的间隔 */
-  grid-row-gap: 16px;
-}
-.stu_color {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 49px;
-  height: 48px;
-  border-radius: 40px 40px 40px 40px;
-  font-family: Inter, Inter;
-  font-weight: normal;
-  font-size: 14px;
-  color: rgba(255, 255, 255, 0.9);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-  transition: background-color 0.3s;
-}
-.stu_color:hover {
-  background-color: #f2f2f2; /* 鼠标移入时的背景色变化 */
-  filter: brightness(1.1);
-}
-</style>
diff --git a/src/views/home/components/Welcome.vue b/src/views/home/components/Welcome.vue
index bfbcd11..afe7c54 100644
--- a/src/views/home/components/Welcome.vue
+++ b/src/views/home/components/Welcome.vue
@@ -64,6 +64,23 @@ const infoRules = {
     },
   ],
 }
+// ---
+//校验规则
+const checkOldSame = (rule, value, callback) => {
+  if (value === props.userData.password) {
+    callback(new Error('新密码不能与旧密码相同'))
+  } else {
+    callback()
+  }
+}
+const checkNewSame = (rule, value, cb) => {
+  if (value !== pwdForm.value.new_pwd) {
+    cb(new Error('新密码和确认再次输入的新密码不一样!'))
+  } else {
+    cb()
+  }
+}
+// ---
 //密码校验
 const rules = {
   // 原密码
@@ -83,7 +100,7 @@ const rules = {
       message: '密码长度必须是6-15位的非空字符串',
       trigger: 'blur',
     },
-    // { validator: checkOldSame, trigger: 'blur' },
+    { validator: checkOldSame, trigger: 'blur' },
   ],
   // 确认新密码
   re_pwd: [
@@ -93,7 +110,7 @@ const rules = {
       message: '密码长度必须是6-15位的非空字符串',
       trigger: 'blur',
     },
-    // { validator: checkNewSame, trigger: 'blur' },
+    { validator: checkNewSame, trigger: 'blur' },
   ],
 }
 
@@ -108,7 +125,6 @@ const changeInfo = async () => {
   }
   const jsonData = JSON.stringify(userInfo)
   // const valid = await infoRef.value.validate()
-
   await userChangeService(jsonData).then(() => {
     ElMessage.success('修改成功')
     emit('get-message', form.value.nickName)
@@ -142,21 +158,7 @@ const onSubmit = async () => {
 const onReset = () => {
   pwdForm.value = {}
 }
-//校验规则
-const checkOldSame = (rule, value, callback) => {
-  if (value === props.userData.password) {
-    callback(new Error('新密码不能与旧密码相同'))
-  } else {
-    callback()
-  }
-}
-const checkNewSame = (rule, value, cb) => {
-  if (value !== pwdForm.value.new_pwd) {
-    cb(new Error('新密码和确认再次输入的新密码不一样!'))
-  } else {
-    cb()
-  }
-}
+//展示名称
 const username = computed(() => {
   if (props.userData.nickName) {
     return props.userData.nickName
@@ -218,10 +220,10 @@ onMounted(() => {
       >
         <el-input :disabled="true" v-model="form.username" autocomplete="off" />
       </el-form-item>
-      <el-form-item label="昵称" :label-width="formLabelWidth" porp="nickName">
+      <el-form-item label="昵称" :label-width="formLabelWidth" prop="nickName">
         <el-input v-model="form.nickName" autocomplete="off" />
       </el-form-item>
-      <el-form-item label="手机" :label-width="formLabelWidth" porp="phone">
+      <el-form-item label="手机" :label-width="formLabelWidth" prop="phone">
         <el-input v-model="form.phone" autocomplete="off" />
       </el-form-item>
     </el-form>
diff --git a/src/views/home/components/infoContainer/index.vue b/src/views/home/components/infoContainer/index.vue
deleted file mode 100644
index 0d1725d..0000000
--- a/src/views/home/components/infoContainer/index.vue
+++ /dev/null
@@ -1,47 +0,0 @@
-<template>
-  <div class="info_content" style="width: 60%; height: 244px">
-    <div class="item" :key="item.name" v-for="item in data">
-      <div class="name">{{ item.name }}</div>
-      <div class="content">{{ item.content }}</div>
-    </div>
-  </div>
-</template>
-<script setup lang="ts">
-defineProps(['data'])
-</script>
-
-<style scoped>
-.info_content {
-  display: grid;
-  display: wrap;
-  grid-template-columns: repeat(4, 1fr);
-  gap: 10px; /* 设置元素之间的间隔 */
-}
-.item {
-  width: 100%;
-  height: 60px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.name {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.4);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-.content {
-  font-family: Inter, Inter;
-  font-weight: 400;
-  font-size: 14px;
-  color: rgba(0, 0, 0, 0.9);
-  line-height: 22px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-</style>
diff --git a/src/views/home/components/myDrawer/index.vue b/src/views/home/components/myDrawer/index.vue
deleted file mode 100644
index 4f8cae9..0000000
--- a/src/views/home/components/myDrawer/index.vue
+++ /dev/null
@@ -1,120 +0,0 @@
-<template>
-  <el-drawer v-model="drawer2" class="table">
-    <template #header>
-      <h4>个人信息</h4>
-    </template>
-    <template #default>
-      <div>
-        <el-table :data="parData" style="width: 100%">
-          <el-table-column prop="name" label="标题"></el-table-column>
-          <el-table-column prop="content" label="内容"></el-table-column>
-          <el-table-column label="操作">
-            <template #default="{ row }">
-              <el-button
-                type="primary"
-                class="el-icon-edit"
-                :icon="Edit"
-                plain
-                circle
-                @click="hanEdit(row)"
-              ></el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-    </template>
-    <template #footer>
-      <div style="flex: auto">
-        <el-button @click="() => {}" size="medium">取消</el-button>
-        <el-button type="primary" @click="() => {}">确认</el-button>
-      </div>
-    </template>
-  </el-drawer>
-  <el-dialog
-    v-model="isDialog"
-    title="详细信息"
-    style="width: 800px; text-align: center"
-  >
-    <el-form :model="activeItem" label-width="80px">
-      <el-form-item label="名称" prop="name">
-        <el-input v-model="activeItem.name"></el-input>
-      </el-form-item>
-      <el-form-item label="内容" prop="content">
-        <template v-if="activeItem.name !== '性别'">
-          <el-input v-model="activeItem.content"></el-input>
-        </template>
-        <template v-else>
-          <el-select
-            v-model="activeItem.content"
-            filterable
-            placeholder="Select"
-          >
-            <el-option
-              v-for="item in arr"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </template>
-      </el-form-item>
-    </el-form>
-    <template #footer>
-      <div>
-        <el-button @click="isDialog = false">取消</el-button>
-        <el-button type="primary" @click="saveEdit">保存</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup lang="ts">
-import { Edit } from '@element-plus/icons-vue'
-import { ref, reactive, watch } from 'vue'
-const props = defineProps(['drawer', 'data'])
-const emits = defineEmits(['update:drawer'])
-const arr = ref([
-  {
-    value: '男',
-    label: '男',
-  },
-  {
-    value: '女',
-    label: '女',
-  },
-])
-// ================同步
-const drawer2 = ref(props.drawer)
-watch(
-  () => drawer2.value,
-  (newVal) => emits('update:drawer', newVal),
-)
-watch(
-  () => props.drawer,
-  (newVal) => (drawer2.value = newVal),
-)
-const parData = ref(props.data.map((item: any) => ({ ...item })))
-// ==========
-
-const isDialog = ref(false)
-const activeItem = reactive({})
-const activeRow = ref()
-// 打开弹窗开始编辑
-function hanEdit(row: any) {
-  Object.assign(activeItem, row)
-  activeRow.value = row
-  isDialog.value = true
-}
-// 保存编辑
-function saveEdit() {
-  Object.assign(activeRow.value, activeItem)
-  console.log(parData.value, 'value')
-}
-</script>
-
-<style scoped>
-.table {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-</style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 012e44c..ffe8f0f 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -9,7 +9,7 @@ import lessonlist from './components/Lessonlist.vue'
 import Student1 from './components/Student1.vue'
 // import Class2 from './components/Class2.vue'
 // import Student2 from './components/Student2.vue'
-import { userNewLikeService } from '@/api/user/user'
+import { userNewLikeService, userLookService } from '@/api/user/user'
 import useUserStore from '@/store/modules/user'
 import fe from '@/assets/images/fe.jpg'
 import { ref, onMounted } from 'vue'
@@ -26,11 +26,9 @@ const rightVisible = ref(false)
 userStore.getUserInfo().catch((error) => {
   console.log(error)
 })
-let sum: any = localStorage.getItem('sum') || '0'
 const name = ref()
 const getMessage = (msg) => {
   name.value = msg
-  // console.log(msg, 'msg')
 }
 const getAvater = (avater) => {
   // console.log(msg, 'msg')
@@ -43,15 +41,12 @@ const courseName = ref()
 const courseTea = ref()
 onMounted(() => {
   // getData()
-  sum = parseInt(sum) + 1
-  localStorage.setItem('sum', sum.toString())
-  // console.log(sum, 'sum')
   username.value = userStore.userName
   data.value = userStore.data
   infoData.value = userStore.userInfo
   // console.log(data.value, '11111')
   // console.log(userStore.userInfo, '22222') //个人信息
-  console.log(userStore.data, 'icon') //用户信息
+  // console.log(userStore.data, 'icon') //用户信息
   username.value = data.value.username
   flag.value = true
   role.value = data.value.roles[0]
@@ -73,6 +68,8 @@ onMounted(() => {
     courseName.value = res.data.name
     courseTea.value = res.data.teacher
   })
+  //echart图表
+  userLookService()
 })
 </script>
 <template>
@@ -154,7 +151,7 @@ onMounted(() => {
         <div class="con">
           <ul>
             <li class="lessonlist-item" v-for="item in 4" :key="item">
-              <img :src="img" class="lessonlist-item-img" />
+              <img :src="fe" class="lessonlist-item-img" />
               <div class="lessonlist-item-info">
                 <h5>{{ courseName }}</h5>
                 <p>{{ courseTea }}</p>
@@ -189,7 +186,7 @@ onMounted(() => {
   <el-row :gutter="15">
     <el-col :span="18">
       <div class="some">
-        <echarts :sum="sum"></echarts>
+        <echarts></echarts>
       </div>
     </el-col>
     <el-col :span="6">
@@ -327,125 +324,8 @@ ul {
     font-weight: bold;
   }
   p {
-    // display: flex;
-    // justify-content: end;
     font-size: small;
     color: #a0a5ab;
   }
 }
-
-// .lesson_container {
-//   display: flex;
-//   flex-direction: column;
-//   justify-content: space-between;
-//   margin: 0 auto;
-//   padding: 5px 0;
-//
-
-// .lesson_container {
-//   display: flex;
-//   flex-direction: column;
-//   justify-content: space-between;
-//   margin: 0 auto;
-//   padding: 5px 0;
-// }
-
-// .lessonlist-item-info {
-//   padding: 10px;
-//   display: flex;
-//   flex-direction: column;
-//   justify-content: space-between;
-// }
-// .lessonlist-item-info h3 {
-//   font-size: 16px;
-//   font-weight: bold;
-//   margin-bottom: 5px;
-// }
-// .lessonlist-item-info .p {
-//   width: 100%;
-//   display: flex;
-//   justify-content: end;
-// }
-// .lessonlist-item-info p {
-//   font-size: 12px;
-//   color: #a7c4f7;
-//   line-height: 1.5;
-//   box-sizing: border-box;
-//   border: 2px solid #a7c4f7;
-//   border-radius: 10px;
-//   margin-bottom: 5px;
-//   width: 50px;
-//   margin: 5px;
-//   text-align: center;
-//   cursor: pointer;
-// }
-
-// .container {
-//   display: flex;
-//   width: 100%;
-//   .left {
-//     width: 80%;
-//     height: 936px;
-//     margin-right: 16px;
-//     display: grid;
-//     grid-template-rows: 1fr 1fr 1fr; /* 使用fr单位来平均分布 */
-//     height: 300px; /* 设置容器高度 */
-
-//     .info,
-//     .echarts {
-//       background: #ffffff;
-//       box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
-//       border-radius: 6px 6px 6px 6px;
-//       margin-bottom: 16px;
-//       display: flex;
-//       // flex-direction: column; //开启纵向布局
-//       justify-content: center;
-//       align-items: center;
-//       .info_container {
-//         display: flex;
-//         flex-direction: column; //开启纵向布局
-//         justify-content: space-between;
-//       }
-//     }
-//     .class {
-//       width: 80%;
-//       height: 444px;
-//       background: #c57676;
-//       box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
-//       border-radius: 6px 6px 6px 6px;
-//       display: flex;
-//       // flex-direction: column; //开启纵向布局
-//       justify-content: center;
-//       align-items: center;
-//     }
-//   }
-//   .right {
-//     width: 20%;
-//     height: 930px;
-//     display: flex;
-//     flex-direction: column; //开启纵向布局
-//     justify-content: space-between;
-//     .ident,
-//     .class,
-//     .stu {
-//       background: #ffffff;
-//       box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
-//       border-radius: 6px 6px 6px 6px;
-//       display: flex;
-//       // flex-direction: column; //开启纵向布局
-//       justify-content: center;
-//       align-items: center;
-//       .info_container {
-//         display: flex;
-//         flex-direction: column; //开启纵向布局
-//         justify-content: space-between;
-//         .info_content {
-//           display: flex;
-//           flex-direction: column; //开启纵向布局
-//           justify-content: space-between;
-//         }
-//       }
-//     }
-//   }
-// }
 </style>
diff --git a/src/views/student/index.vue b/src/views/student/index.vue
index e1cb97d..431a09d 100644
--- a/src/views/student/index.vue
+++ b/src/views/student/index.vue
@@ -1,5 +1,241 @@
+<script setup>
+import { Search, Edit, Delete } from '@element-plus/icons-vue'
+import { ref } from 'vue'
+const tableData = [
+  {
+    date: '2016-05-03',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Home',
+  },
+  {
+    date: '2016-05-02',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Office',
+  },
+  {
+    date: '2016-05-04',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Home',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Office',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Office',
+  },
+  {
+    date: '2016-05-01',
+    name: 'Tom',
+    state: 'California',
+    city: 'Los Angeles',
+    address: 'No. 189, Grove St, Los Angeles',
+    zip: 'CA 90036',
+    tag: 'Office',
+  },
+]
+const loading = ref(false)
+</script>
 <template>
-  <div>学生</div>
+  <page-container title="文章分类">
+    <el-card class="page-container">
+      <template #header>
+        <div class="card-header">
+          <span>学生信息</span>
+          <el-button type="primary">重置密码</el-button>
+        </div>
+      </template>
+      <div class="content">
+        <el-form style="display: flex">
+          <el-form-item style="width: 250px">
+            <el-input class="input_search"></el-input>
+            <el-icon><Search /></el-icon>
+          </el-form-item>
+          <el-button class="btn_search">搜索</el-button>
+        </el-form>
+        <el-table
+          class="tableBox"
+          :data="tableData"
+          v-loading="loading"
+          :header-cell-style="{
+            background: '#FAFAFA',
+            color: '#666',
+            fontSize: '14px',
+            fontWeight: 'bold',
+            height: '45px',
+            lineHeight: '45px',
+            borderTop: '1px solid #ebeef5',
+            textAlign: 'center',
+          }"
+          :cell-style="{
+            color: '#666',
+            fontSize: '14px',
+            height: '40px',
+            lineHeight: '40px',
+            textAlign: 'center',
+          }"
+          :row-style="{
+            height: '40px',
+          }"
+          style="width: 100%"
+        >
+          <el-table-column type="selection" width="55" height="100" />
+          <el-table-column prop="date" label="日期" />
+          <el-table-column prop="name" label="姓名" />
+          <el-table-column prop="state" label="状态" />
+          <el-table-column prop="city" label="City" width="300" />
+          <el-table-column prop="address" label="Address" />
+          <el-table-column prop="zip" label="Zip" />
+          <el-table-column fixed="right" label="操作" min-width="125">
+            <template #default>
+              <el-button
+                type="primary"
+                size="small"
+                :icon="Edit"
+                circle
+                plain
+                @click="handleClick"
+              ></el-button>
+              <el-button
+                :icon="Delete"
+                type="danger"
+                size="small"
+                circle
+                plain
+              ></el-button>
+            </template>
+          </el-table-column>
+          <template #empty>
+            <el-empty description="没有数据" />
+          </template>
+        </el-table>
+
+        <!-- <el-table :data="tableData" style="width: 100%">
+          <el-table-column type="selection" width="65" />
+          <el-table-column prop="cate_name" label="分类名称" />
+          <el-table-column prop="cate_alias" label="分类别名" />
+          <el-table-column prop="address" label="操作">
+            <template #default="{ row, $index }">
+              <el-button
+                @click="onEditChannel(row, $index)"
+                :icon="Edit"
+                type="primary"
+                circle
+                plain
+              ></el-button>
+              <el-button
+                @click="onDelChannel(row)"
+                :icon="Delete"
+                type="danger"
+                circle
+                plain
+              ></el-button>
+            </template>
+          </el-table-column>
+          <template #empty>
+            <el-empty description="没有数据" />
+          </template>
+        </el-table> -->
+        <el-pagination
+          v-model:current-page="currentPage4"
+          v-model:page-size="pageSize4"
+          :page-sizes="[10, 20, 30, 40]"
+          :size="small"
+          :disabled="disabled"
+          :background="background"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="40"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </div>
+    </el-card>
+  </page-container>
 </template>
 
-<style lang="scss"></style>
+<style lang="scss" scoped>
+.page-container {
+  min-height: 100%;
+  box-sizing: border-box;
+  background: #ffffff;
+  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
+  flex: 1;
+}
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.content {
+  min-height: 440px;
+}
+
+.input_search {
+  position: relative;
+  // border-radius: 8px;
+}
+.el-icon {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+}
+.btn_search {
+  margin-left: 15px;
+  border-radius: 8px;
+  font-size: 13px;
+  background-color: #377be5;
+  color: #fff;
+}
+.el-table {
+  font-family: Arial, sans-serif;
+  font-size: 14px;
+  font-weight: normal;
+  color: #666;
+  // height: 10px;
+}
+.el-table .el-table-column {
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-size: 16px;
+  font-weight: bold;
+  color: #af4141;
+}
+::v-deep.el-table td.el-table__cell div {
+  // margin-left: -6px;
+  // width: 170px;
+  height: 40px;
+  line-height: 40px;
+}
+::v-deep .el-scrollbar__wrap {
+  padding: 0px 0px;
+}
+.el-pagination {
+  margin-top: 30px;
+  text-align: center;
+  justify-content: end;
+  font-size: 12px;
+}
+</style>