skytek_xinliang
82 lines
1.9 KiB
Vue
82 lines
1.9 KiB
Vue
<template>
|
|
<SKAnalysis
|
|
:bar-data="barData"
|
|
:chart1-title="chart1Title"
|
|
:chart2-title="chart2Title"
|
|
:chart3-title="chart3Title"
|
|
:pie1-data="pie1Data"
|
|
:pie2-data="pie2Data"
|
|
:stats="stats"
|
|
:trend-data="trendData"
|
|
:trend-title="trendTitle"
|
|
/>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import SKAnalysis from '@/components/SKAnalysis.vue'
|
|
|
|
// Mock Data
|
|
const stats = ref([
|
|
{
|
|
title: '學生總數',
|
|
value: '2,580',
|
|
icon: 'mdi-account-school',
|
|
color: 'primary',
|
|
label: '總學籍人數',
|
|
total: '120,000',
|
|
},
|
|
{
|
|
title: '平台訪問',
|
|
value: '20,000',
|
|
icon: 'mdi-chart-pie',
|
|
color: 'error',
|
|
label: '今日訪問量',
|
|
total: '500,000',
|
|
},
|
|
{
|
|
title: '教材下載',
|
|
value: '8,000',
|
|
icon: 'mdi-cloud-download',
|
|
color: 'warning',
|
|
label: '本月下載次數',
|
|
total: '120,000',
|
|
},
|
|
{
|
|
title: '圖書館借閱',
|
|
value: '5,000',
|
|
icon: 'mdi-book-open-page-variant',
|
|
color: 'success',
|
|
label: '總借閱量',
|
|
total: '50,000',
|
|
},
|
|
])
|
|
|
|
const trendTitle = ref('數位學習平台流量')
|
|
const trendData = ref([0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0])
|
|
|
|
const chart1Title = ref('學生核心素養指標 (平均)')
|
|
const barData = ref([
|
|
{ label: '道德實踐 (Moral)', value: 85, color: 'info' },
|
|
{ label: '智力發展 (Intellectual)', value: 72, color: 'success' },
|
|
{ label: '體育健康 (Physical)', value: 90, color: 'warning' },
|
|
{ label: '群育合作 (Social)', value: 65, color: 'error' },
|
|
{ label: '美感教育 (Aesthetic)', value: 80, color: 'primary' },
|
|
])
|
|
|
|
const chart2Title = ref('訪問裝置來源')
|
|
const pie1Data = ref({
|
|
value: 75,
|
|
label: '行動裝置',
|
|
color: 'purple-accent-2',
|
|
})
|
|
|
|
const chart3Title = ref('本學期及格率')
|
|
const pie2Data = ref({
|
|
value: 92,
|
|
label: '全校平均',
|
|
color: 'teal-lighten-1',
|
|
icon: 'mdi-check-decagram',
|
|
})
|
|
</script>
|