bzkf3 2 gadi atpakaļ
vecāks
revīzija
8167899986

+ 1 - 0
package.json

@@ -15,6 +15,7 @@
   "dependencies": {
     "@vueuse/core": "^9.5.0",
     "axios": "^0.27.2",
+    "echarts": "^5.4.0",
     "element-plus": "^2.2.21",
     "md5": "^2.3.0",
     "tinymce": "^6.2.0",

BIN
src/assets/img/home/down.webp


BIN
src/assets/img/home/up.png


BIN
src/assets/img/home/user.webp


+ 44 - 1
src/components/FileUpload/index.vue

@@ -1,10 +1,53 @@
 <script setup lang="ts">
+import type { UploadFile, UploadFiles } from 'element-plus'
 import { user } from '~/store/index'
+const props = defineProps<{
+  part?: string
+  full?: string
+  d?: object
+}>()
+const emits = defineEmits(['update:part', 'update:full'])
+
 const action = `${window.GLOBAL_CONFIG.api}/upload/main/file`
+
+function getFullUrl(str: string) {
+  return /https?:\/\//.test(str) ? str : `${window.GLOBAL_CONFIG.oss}/${str}`
+}
+function handleString(str: string, hasName: boolean) {
+  const arr = str.split(';')
+  if (hasName) {
+    return arr.map((item) => {
+      const [url, name] = item.split('|')
+      return ({
+        name,
+        url: getFullUrl(url),
+        part: url,
+        status: 'success',
+      })
+    })
+  }
+  else {
+    return arr.map(item => ({ url: getFullUrl(item) }))
+  }
+}
+
+const fileList = reactive(props.part ? handleString(props.part, false) : props.full ? handleString(props.full, true) : [])
+
+type _UploadFile = UploadFile & { part?: string }
+type _UploadFiles = _UploadFile[]
+function handleSuccess(response: any, uploadFile: _UploadFile, uploadFiles: _UploadFiles) {
+  uploadFile.part = response.data.url
+  const files = uploadFiles.filter(item => item.status === 'success')
+  emits('update:part', files.map(({ part }) => part).join(';'))
+  emits('update:full', files.map(({ part, name }) => `${part}|${name}`).join(';'))
+}
 </script>
 
 <template>
-  <el-upload :action="action" :data="{ token: user.token }" name="filedata" class="w-full">
+  <el-upload
+    v-model:file-list="fileList" :action="action" :data="{ token: user.token, ...props.d }" name="filedata"
+    class="w-full" :on-success="handleSuccess"
+  >
     <template #default>
       <slot name="default">
         <el-button type="primary" size="default">

+ 323 - 0
src/pages/home.vue

@@ -0,0 +1,323 @@
+<script setup lang="ts">
+import * as echarts from 'echarts'
+import i_up from '~/assets/img/home/up.png'
+import i_down from '~/assets/img/home/down.webp'
+import i_user from '~/assets/img/home/user.webp'
+
+const selectedDate = $ref()
+
+const list_czrz = ref([
+  '2011-12-23 11:12 用户29345612在用户中心/学校与教师/教师管理中设置名师',
+  '2011-12-23 12:12 用户369984在内容管理/文件公告/文件通知中编辑了关于组织山东育知中编辑了关于组织山东育知中编辑了关于组织山东育',
+  '2011-12-23 14:12 用户36988589登录一次',
+])
+
+type IRow = any
+let tableData = $ref<IRow[]>([])
+Promise.resolve([{ name: '山东省蒙阴县实验中学' }, { name: '山东省蒙阴县实验中学' }, { name: '山东省蒙阴县实验中学' }]).then((res: IRow[]) => {
+  tableData = res
+})
+
+type EChartsOption = echarts.EChartsOption
+
+const echartRef = $ref()
+
+const option: EChartsOption = {
+  color: ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00'],
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'cross',
+      label: {
+        backgroundColor: '#6a7985',
+      },
+    },
+  },
+  legend: {
+    data: ['累计在线人数', '总观看人数'],
+  },
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '3%',
+    containLabel: true,
+  },
+  xAxis: [
+    {
+      type: 'category',
+      boundaryGap: false,
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+    },
+  ],
+  yAxis: [
+    {
+      type: 'value',
+    },
+  ],
+  series: [
+    {
+      name: '累计在线人数',
+      type: 'line',
+      stack: 'Total',
+      smooth: true,
+      lineStyle: {
+        width: 0,
+      },
+      showSymbol: false,
+      symbolSize: 9,
+      areaStyle: {
+        opacity: 1,
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: '#3f8cff',
+          },
+          {
+            offset: 0.5,
+            color: '#96caff',
+          },
+          {
+            offset: 0.8,
+            color: '#f6faff',
+          },
+          {
+            offset: 1,
+            color: '#fff',
+          },
+        ]),
+      },
+      emphasis: {
+        focus: 'series',
+      },
+      data: [140, 232, 101, 264, 90, 340, 250],
+    },
+    {
+      name: '总观看人数',
+      type: 'line',
+      stack: 'Total',
+      smooth: true,
+      lineStyle: {
+        width: 0,
+      },
+      showSymbol: false,
+      symbolSize: 9,
+      areaStyle: {
+        opacity: 1,
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: '#ff611f',
+          },
+          {
+            offset: 0.5,
+            color: '#ffb697',
+          },
+          {
+            offset: 0.8,
+            color: '#fcf4f3',
+          },
+          {
+            offset: 1,
+            color: '#fff',
+          },
+        ]),
+      },
+      emphasis: {
+        focus: 'series',
+      },
+      data: [120, 282, 111, 234, 220, 340, 310],
+    },
+  ],
+}
+onMounted(() => {
+  const myChart = echarts.init(echartRef)
+  option && myChart.setOption(option)
+})
+</script>
+
+<template>
+  <div class="text-base flex h-full">
+    <div class="w-15/25 bg-white card py-6 px-8 flex flex-col justify-between">
+      <div class="flex justify-between items-end">
+        <div class="text-hex-333539 font-semibold tracking-wide">
+          操作日志
+        </div>
+        <div
+          class="bg-hex-eff3fb rounded-lg text-hex-4d4d4d text-xs font-normal flex_center px-2.5 py-1 cursor-pointer"
+        >
+          查看更多
+          <i:material-symbols:arrow-forward-ios />
+        </div>
+      </div>
+
+      <div class="bg-hex-ebf3ff rounded-2xl p-4 my-4">
+        <ul class="divide-y divide-dashed text-sm text-hex-61657e font-semibold tracking-wide">
+          <li v-for="item in list_czrz" :key="item" class="truncate py-2">
+            {{ item }}
+          </li>
+        </ul>
+      </div>
+
+      <div class="text-hex-333539 font-semibold tracking-wide mt-7">
+        数据
+      </div>
+
+      <div class="flex justify-between text-white my-4">
+        <div class="card bg-hex-E8523F w-3/10 py-3 px-5 rounded-3xl">
+          <div class="flex justify-between">
+            <div class="flex items-center">
+              <img :src="i_up" alt="" class="w-8 h-8">
+              <span class="text-sm ml-2">上传资源数量</span>
+            </div>
+
+            <div class="flex flex-col items-center">
+              <i:mdi:arrow-down-thin class="text-2xl" />
+              <span class="text-xs">+8%</span>
+            </div>
+          </div>
+
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              今日
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              23
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本周
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              123
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本月
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              2113
+            </div>
+          </div>
+        </div>
+        <div class="card bg-hex-3F8CFF w-3/10 py-3 px-5 rounded-3xl">
+          <div class="flex justify-between">
+            <div class="flex items-center">
+              <img :src="i_down" alt="" class="w-8 h-8">
+              <span class="text-sm ml-2">上传资源数量</span>
+            </div>
+
+            <div class="flex flex-col items-center">
+              <i:mdi:arrow-down-thin class="text-2xl" />
+              <span class="text-xs">+8%</span>
+            </div>
+          </div>
+
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              今日
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              23
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本周
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              123
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本月
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              2113
+            </div>
+          </div>
+        </div>
+        <div class="card bg-hex-F8B849 w-3/10 py-3 px-5 rounded-3xl">
+          <div class="flex justify-between">
+            <div class="flex items-center">
+              <img :src="i_user" alt="" class="w-8 h-8">
+              <span class="text-sm ml-2">上传资源数量</span>
+            </div>
+
+            <div class="flex flex-col items-center">
+              <i:mdi:arrow-up-thin class="text-2xl" />
+              <span class="text-xs">+8%</span>
+            </div>
+          </div>
+
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              今日
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              23
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本周
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              123
+            </div>
+          </div>
+          <div class="flex items-end mt-2">
+            <div class="text-xs leading-none">
+              本月
+            </div>
+            <div class="text-xl ml-2 leading-none">
+              2113
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="flex justify-between items-baseline mt-7 mb-4">
+        <div class="text-hex-333539 font-semibold tracking-wide">
+          高校资源数据
+        </div>
+        <div
+          class="bg-hex-eff3fb rounded-lg text-hex-4d4d4d text-xs font-normal flex_center px-2.5 py-1 cursor-pointer"
+        >
+          查看更多
+          <i:material-symbols:arrow-forward-ios />
+        </div>
+      </div>
+
+      <el-table class="_" :data="tableData" style="width: 100%">
+        <el-table-column prop="name" label="学校名称" show-overflow-tooltip width="auto" />
+        <el-table-column prop="name" label="上传资源数" show-overflow-tooltip width="110" />
+        <el-table-column prop="name" label="资源下载数" show-overflow-tooltip width="110" />
+        <el-table-column prop="name" label="听课教室数" show-overflow-tooltip width="110" />
+        <el-table-column prop="name" label="主讲教室数" show-overflow-tooltip width="110" />
+      </el-table>
+    </div>
+    <div class="w-8/25 min-w-400px ml-1/25 h-full flex flex-col justify-between">
+      <div class="card flex-auto mb-9 flex flex-col justify-between">
+        <div class="text-hex-333539 font-medium tracking-wide">
+          日历
+        </div>
+        <div class="flex_center flex-auto">
+          <el-calendar v-model="selectedDate" class="_" />
+        </div>
+      </div>
+      <div class="card flex flex-col justify-between">
+        <div class="text-hex-333539 font-medium tracking-wide mb-3">
+          课堂在线情况
+        </div>
+        <div ref="echartRef" class="w-full h-300px" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+@use "~/styles/calendar.scss";
+@use "~/styles/table2.scss";
+</style>

+ 0 - 7
src/pages/index.vue

@@ -1,7 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  <h1>hello</h1>
-</template>

+ 2 - 2
src/pages/ptsz/xxsz/components/dia.vue

@@ -15,7 +15,7 @@ const rules: FormRules = {}
 const formRef = $ref<FormInstance>()
 
 function handleClickCancel() {
-  emits('emitClose')
+  emits('emitClose', form)
 }
 
 function handleClickSubmit() {
@@ -44,7 +44,7 @@ function handleClickSubmit() {
     </p>
     <!-- <el-form ref="formRef" label-position="top" :model="form" :rules="rules"> -->
     <el-form-item label="学校logo" prop="" class="w-full px-2">
-      <file-upload v-model="form.sm_logo" :limit="1" list-type="picture" />
+      <file-upload v-model:part="form.sm_logo" :limit="1" list-type="picture" />
     </el-form-item>
 
     <el-form-item class="w-1/2 px-2" label="学校名称" prop="">

+ 13 - 2
src/pages/ptsz/xxsz/jd.vue

@@ -36,8 +36,19 @@ function handleClickDelete(row: IRow) {
     })
 }
 let dialog_visible_detail = $ref(false)
+let dialog_data_detail = $ref<IRow>({})
 function handleClickDetail(row: IRow) {
-  dialog_visible_detail = true
+  request({
+    url: '/school/main/detail',
+    data: {
+      sm_id: row.sm_id,
+    },
+  }).then((res) => {
+    if (res.code === '1') {
+      dialog_data_detail = res.data
+      dialog_visible_detail = true
+    }
+  })
 }
 
 let dialog_visible_add = $ref(false)
@@ -159,7 +170,7 @@ handleQuery()
   </el-dialog>
 
   <el-dialog v-model="dialog_visible_detail" class="_" width="1125" title="学校详情" align-center>
-    <info class="px-6" />
+    <info class="px-6" :info="dialog_data_detail" />
   </el-dialog>
 </template>
 

+ 25 - 0
src/router/routes/home.ts

@@ -0,0 +1,25 @@
+// import type { RouteRecordRaw } from 'vue-router'
+import type { RouteRecordRawWithMeta } from '../routes'
+
+export default <RouteRecordRawWithMeta>{
+  path: '/home',
+  component: () => import('~/layout/app/index.vue'),
+  name: 'HOME',
+  meta: {
+    hidden: true,
+    sort: 0,
+    title: '首页',
+  },
+  redirect: { name: 'HOME_INDEX' },
+  children: [{
+    path: '',
+    component: () => import('@/pages/home.vue'),
+    name: 'HOME_INDEX',
+    meta: {
+      hidden: false,
+      sort: 0,
+      title: '首页',
+      breadcrumb: true,
+    },
+  }],
+}

+ 48 - 0
src/styles/calendar.scss

@@ -0,0 +1,48 @@
+:deep(._.el-calendar) {
+  --el-calendar-border: none;
+  --el-calendar-selected-bg-color: transparent;
+
+  .el-calendar__body {
+    padding: 12px;
+
+    .el-calendar-table tbody .el-calendar-table__row {
+
+      td {
+        // border-radius: 8px;
+        // padding: 5px;
+
+        .el-calendar-day {
+          height: auto;
+          display: flex;
+          justify-content: center;
+
+          span {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-size: 12px;
+            height: 36px;
+            width: 36px;
+            border-radius: 8px;
+          }
+
+          &:hover {
+            span {
+              color: white;
+              background: #3F8CFF90;
+            }
+          }
+        }
+
+        &.is-selected {
+          .el-calendar-day {
+            span {
+              color: white;
+              background: #3F8CFF;
+            }
+          }
+        }
+      }
+    }
+  }
+}

+ 57 - 0
src/styles/table2.scss

@@ -0,0 +1,57 @@
+:deep(.el-table) {
+  --el-table-header-bg-color: #3f8cff11;
+  --el-table-row-hover-bg-color: #3F8CFF;
+  --el-table-current-row-bg-color: #3F8CFF;
+  --el-table-header-text-color: black;
+  --el-table-tr-bg-color: #f7f7f7;
+  --el-table-border: 8px solid white;
+  // .el-checkbox__inner {
+  //   width: 20px;
+  //   height: 20px;
+
+  //   &::after {
+  //     border-width: 2px;
+  //     left: 7px;
+  //     top: 4px;
+  //   }
+  // }
+
+  .el-table__header {
+    border-radius: 13px 13px 13px 13px;
+    overflow: hidden;
+
+    thead {
+
+
+      tr {
+        // background-color: #3f8cff11;
+        height: 64px;
+
+
+        th.el-table__cell {
+          // color: black;
+          font-weight: 600;
+          // background-color: transparent;
+        }
+      }
+    }
+  }
+
+  .el-table__body {
+    tbody tr.el-table__row {
+      border-radius: 13px 13px 13px 13px;
+      overflow: hidden;
+
+      // background: #f7f7f7;
+      &:hover {
+        // background: #3F8CFF;
+        color: white;
+      }
+    }
+
+    .el-table__cell {
+      padding: 16px 0;
+    }
+  }
+
+}

+ 1 - 1
src/utils/request.ts

@@ -6,7 +6,7 @@ const token = user.value?.token
 
 export interface Response {
   code: string
-  data: unknown
+  data: any
   msg: string
 }
 

+ 20 - 0
yarn.lock

@@ -942,6 +942,14 @@ domutils@^3.0.1:
     domelementtype "^2.3.0"
     domhandler "^5.0.1"
 
+echarts@^5.4.0:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/echarts/-/echarts-5.4.0.tgz#a9a8e5367293a397408d3bf3e2638b869249ce04"
+  integrity sha512-uPsO9VRUIKAdFOoH3B0aNg7NRVdN7aM39/OjovjO9MwmWsAkfGyeXJhK+dbRi51iDrQWliXV60/XwLA7kg3z0w==
+  dependencies:
+    tslib "2.3.0"
+    zrender "5.4.0"
+
 element-plus@^2.2.21:
   version "2.2.21"
   resolved "https://registry.npmjs.org/element-plus/-/element-plus-2.2.21.tgz"
@@ -2748,6 +2756,11 @@ tsconfig-paths@^3.14.1:
     minimist "^1.2.6"
     strip-bom "^3.0.0"
 
+tslib@2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.0.tgz#803b8cdab3e12ba581a4ca41c8839bbb0dacb09e"
+  integrity sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==
+
 tslib@^1.8.1:
   version "1.14.1"
   resolved "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz"
@@ -3052,3 +3065,10 @@ yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
+
+zrender@5.4.0:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/zrender/-/zrender-5.4.0.tgz#d4f76e527b2e3bbd7add2bdaf27a16af85785576"
+  integrity sha512-rOS09Z2HSVGFs2dn/TuYk5BlCaZcVe8UDLLjj1ySYF828LATKKdxuakSZMvrDz54yiKPDYVfjdKqcX8Jky3BIA==
+  dependencies:
+    tslib "2.3.0"