first

safekiso_admin/pages/admin/statistics/index_bak.vue

@@ -0,0 +1,121 @@
+<template>
+    <div>
+        <div class="mt-5 sm:px-3 lg:px-5">전체 통계 페이지 대시보드</div>
+
+        <LineChart
+            :chart-data="lineChartData"
+            :chart-options="lineChartOptions"
+        />
+
+        <PieChart :chart-data="pieChartData" :chart-options="pieChartOptions" />
+
+        <div class="mt-5 sm:px-3 lg:px-5">
+            <a
+                href="javascript:void(0)"
+                class="text-base font-medium text-indigo-700 hover:text-indigo-600"
+                @click="navigateTo('/admin/statistics/byterm/usage')"
+                >기간별 사용량 통계 화면으로 &rarr;</a
+            >
+        </div>
+        <div class="mt-5 sm:px-3 lg:px-5">
+            <a
+                href="javascript:void(0)"
+                class="text-base font-medium text-indigo-700 hover:text-indigo-600"
+                @click="navigateTo('/admin/statistics/byterm/word')"
+                >기간별 단어 통계 화면으로 &rarr;</a
+            >
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+    middleware: 'check-auth-admin',
+});
+
+/*
+const route = useRoute();
+let hero: string | string[] = '';
+hero = route.params['hero'];
+*/
+
+const responseJson = await _crossCtl.doComm(
+    'local/select',
+    'admin:dashboard',
+    {}
+);
+
+let rawData1 = [];
+let rawData2 = [];
+
+console.log('responseJson=', responseJson);
+if (responseJson['responseMessage'] == 'ok') {
+    rawData1 = responseJson['result']['adminDashData1'];
+    rawData2 = responseJson['result']['adminDashData2'];
+}
+
+const lineChartData = {
+    labels: rawData1.map((item) => item['date_tag']),
+    datasets: [
+        {
+            label: 'Total',
+            backgroundColor: '#00D8FF',
+            data: rawData1.map((item) => item['total']),
+        },
+        {
+            label: 'Hit',
+            backgroundColor: '#f87979',
+            data: rawData1.map((item) => item['hit']),
+        },
+    ],
+};
+
+const lineChartOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+};
+
+const pieChartData = {
+    labels: rawData2.map((item) => item['key_name']),
+    datasets: [
+        {
+            // backgroundColor: ['#41B883', '#E46651', '#00D8FF', '#DD1B16'],
+            data: rawData2.map((item) => item['total']),
+        },
+    ],
+};
+
+const pieChartOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+};
+
+const chartData = {
+    labels: [
+        'January',
+        'February',
+        'March',
+        'April',
+        'May',
+        'June',
+        'July',
+        'August',
+        'September',
+        'October',
+        'November',
+        'December',
+    ],
+    datasets: [
+        {
+            label: 'Data One',
+            backgroundColor: '#f87979',
+            data: [40, 20, 12, 39, 10, 40, 39, 80, 40, 20, 12, 11],
+        },
+    ],
+};
+
+const chartOptions = {
+    responsive: true,
+    maintainAspectRatio: false,
+};
+</script>