|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="index-container">
|
|
|
- <el-row :gutter="20">
|
|
|
+<!-- <el-row :gutter="20">
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
<el-alert v-if="noticeList[0]" :closable="noticeList[0].closable">
|
|
|
<div
|
|
@@ -199,395 +199,29 @@
|
|
|
<plan></plan>
|
|
|
<version-information></version-information>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
+ </el-row>-->
|
|
|
+
|
|
|
+ <vab-snow></vab-snow>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import VabChart from '@/plugins/echarts'
|
|
|
- import { dependencies, devDependencies } from '../../../package.json'
|
|
|
- import { getList } from '@/api/changeLog'
|
|
|
- import { getNoticeList } from '@/api/notice'
|
|
|
- import Plan from './components/Plan'
|
|
|
- import VersionInformation from './components/VersionInformation'
|
|
|
-
|
|
|
- export default {
|
|
|
- name: 'Index',
|
|
|
- components: {
|
|
|
- VabChart,
|
|
|
- Plan,
|
|
|
- VersionInformation,
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- timer: 0,
|
|
|
- updateTime: process.env.VUE_APP_UPDATE_TIME,
|
|
|
- nodeEnv: process.env.NODE_ENV,
|
|
|
- dependencies: dependencies,
|
|
|
- devDependencies: devDependencies,
|
|
|
- config1: {
|
|
|
- startVal: 0,
|
|
|
- endVal: this.$baseLodash.random(20000, 60000),
|
|
|
- decimals: 0,
|
|
|
- prefix: '',
|
|
|
- suffix: '',
|
|
|
- separator: ',',
|
|
|
- duration: 8000,
|
|
|
- },
|
|
|
- config2: {
|
|
|
- startVal: 0,
|
|
|
- endVal: this.$baseLodash.random(1000, 20000),
|
|
|
- decimals: 0,
|
|
|
- prefix: '',
|
|
|
- suffix: '',
|
|
|
- separator: ',',
|
|
|
- duration: 8000,
|
|
|
- },
|
|
|
- config3: {
|
|
|
- startVal: 0,
|
|
|
- endVal: this.$baseLodash.random(1000, 20000),
|
|
|
- decimals: 0,
|
|
|
- prefix: '',
|
|
|
- suffix: '',
|
|
|
- separator: ',',
|
|
|
- duration: 8000,
|
|
|
- },
|
|
|
-
|
|
|
- //访问量
|
|
|
- fwl: {
|
|
|
- grid: {
|
|
|
- top: '4%',
|
|
|
- left: '2%',
|
|
|
- right: '4%',
|
|
|
- bottom: '0%',
|
|
|
- containLabel: true,
|
|
|
- },
|
|
|
- xAxis: [
|
|
|
- {
|
|
|
- type: 'category',
|
|
|
- boundaryGap: false,
|
|
|
- data: [],
|
|
|
- axisTick: {
|
|
|
- alignWithLabel: true,
|
|
|
- },
|
|
|
- },
|
|
|
- ],
|
|
|
- yAxis: [
|
|
|
- {
|
|
|
- type: 'value',
|
|
|
- },
|
|
|
- ],
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: '访问量',
|
|
|
- type: 'line',
|
|
|
- data: [],
|
|
|
- smooth: true,
|
|
|
- areaStyle: {},
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- //授权数
|
|
|
- sqs: {
|
|
|
- grid: {
|
|
|
- top: '4%',
|
|
|
- left: '2%',
|
|
|
- right: '4%',
|
|
|
- bottom: '0%',
|
|
|
- containLabel: true,
|
|
|
- },
|
|
|
- xAxis: [
|
|
|
- {
|
|
|
- type: 'category',
|
|
|
- /*boundaryGap: false,*/
|
|
|
- data: ['0时', '4时', '8时', '12时', '16时', '20时', '24时'],
|
|
|
- axisTick: {
|
|
|
- alignWithLabel: true,
|
|
|
- },
|
|
|
- },
|
|
|
- ],
|
|
|
- yAxis: [
|
|
|
- {
|
|
|
- type: 'value',
|
|
|
- },
|
|
|
- ],
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: '授权数',
|
|
|
- type: 'bar',
|
|
|
- barWidth: '60%',
|
|
|
- data: [10, 52, 20, 33, 39, 33, 22],
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- //词云
|
|
|
- cy: {
|
|
|
- grid: {
|
|
|
- top: '4%',
|
|
|
- left: '2%',
|
|
|
- right: '4%',
|
|
|
- bottom: '0%',
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- type: 'wordCloud',
|
|
|
- gridSize: 15,
|
|
|
- sizeRange: [12, 40],
|
|
|
- rotationRange: [0, 0],
|
|
|
- width: '100%',
|
|
|
- height: '100%',
|
|
|
- textStyle: {
|
|
|
- normal: {
|
|
|
- color() {
|
|
|
- const arr = [
|
|
|
- '#5470c6',
|
|
|
- '#91cc75',
|
|
|
- '#fac858',
|
|
|
- '#ee6666',
|
|
|
- '#73c0de',
|
|
|
- '#975FE5',
|
|
|
- ]
|
|
|
- let index = Math.floor(Math.random() * arr.length)
|
|
|
- return arr[index]
|
|
|
- },
|
|
|
- },
|
|
|
- },
|
|
|
- data: [
|
|
|
- {
|
|
|
- name: 'vue-admin-better',
|
|
|
- value: 15000,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'element',
|
|
|
- value: 10081,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'beautiful',
|
|
|
- value: 9386,
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
- name: 'vue',
|
|
|
- value: 6500,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'chuzhixin',
|
|
|
- value: 6000,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'good',
|
|
|
- value: 4500,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'success',
|
|
|
- value: 3800,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'never',
|
|
|
- value: 3000,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'boy',
|
|
|
- value: 2500,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'girl',
|
|
|
- value: 2300,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'github',
|
|
|
- value: 2000,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'hbuilder',
|
|
|
- value: 1900,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'dcloud',
|
|
|
- value: 1800,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'china',
|
|
|
- value: 1700,
|
|
|
- },
|
|
|
- {
|
|
|
- name: '1204505056',
|
|
|
- value: 1600,
|
|
|
- },
|
|
|
- {
|
|
|
- name: '972435319',
|
|
|
- value: 1500,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'young',
|
|
|
- value: 1200,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'old',
|
|
|
- value: 1100,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'vuex',
|
|
|
- value: 900,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'router',
|
|
|
- value: 800,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'money',
|
|
|
- value: 700,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'qingdao',
|
|
|
- value: 800,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'yantai',
|
|
|
- value: 9000,
|
|
|
- },
|
|
|
- {
|
|
|
- name: 'author is very cool',
|
|
|
- value: 9200,
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
-
|
|
|
- //更新日志
|
|
|
- reverse: true,
|
|
|
- activities: [],
|
|
|
- noticeList: [],
|
|
|
- //其他信息
|
|
|
- userAgent: navigator.userAgent,
|
|
|
- //卡片图标
|
|
|
- iconList: [
|
|
|
- {
|
|
|
- icon: 'video',
|
|
|
- title: '视频播放器',
|
|
|
- link: '/vab/player',
|
|
|
- color: '#ffc069',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'table',
|
|
|
- title: '表格',
|
|
|
- link: '/vab/station/station',
|
|
|
- color: '#5cdbd3',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'laptop-code',
|
|
|
- title: '源码',
|
|
|
- link: 'https://github.com/chuzhixin/vue-admin-better',
|
|
|
- color: '#b37feb',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'book',
|
|
|
- title: '书籍',
|
|
|
- link: '',
|
|
|
- color: '#69c0ff',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'bullhorn',
|
|
|
- title: '公告',
|
|
|
- link: '',
|
|
|
- color: '#ff85c0',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'gift',
|
|
|
- title: '礼物',
|
|
|
- link: '',
|
|
|
- color: '#ffd666',
|
|
|
- },
|
|
|
-
|
|
|
- {
|
|
|
- icon: 'balance-scale-left',
|
|
|
- title: '公平的世界',
|
|
|
- link: '',
|
|
|
- color: '#ff9c6e',
|
|
|
- },
|
|
|
- {
|
|
|
- icon: 'coffee',
|
|
|
- title: '休息一下',
|
|
|
- link: '',
|
|
|
- color: '#95de64',
|
|
|
- },
|
|
|
- ],
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.fetchData()
|
|
|
- },
|
|
|
- beforeDestroy() {
|
|
|
- clearInterval(this.timer)
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- let base = +new Date(2020, 1, 1)
|
|
|
- let oneDay = 24 * 3600 * 1000
|
|
|
- let date = []
|
|
|
-
|
|
|
- let data = [Math.random() * 1500]
|
|
|
- let now = new Date(base)
|
|
|
|
|
|
- const addData = (shift) => {
|
|
|
- now = [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/')
|
|
|
- date.push(now)
|
|
|
- data.push(this.$baseLodash.random(20000, 60000))
|
|
|
+import VabSnow from '@/components/VabSnow'
|
|
|
+export default {
|
|
|
+ name: 'index',
|
|
|
+ components: {
|
|
|
+ VabSnow,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
|
|
|
- if (shift) {
|
|
|
- date.shift()
|
|
|
- data.shift()
|
|
|
- }
|
|
|
-
|
|
|
- now = new Date(+new Date(now) + oneDay)
|
|
|
- }
|
|
|
-
|
|
|
- for (let i = 1; i < 6; i++) {
|
|
|
- addData()
|
|
|
- }
|
|
|
- addData(true)
|
|
|
- this.fwl.xAxis[0].data = date
|
|
|
- this.fwl.series[0].data = data
|
|
|
- this.timer = setInterval(() => {
|
|
|
- addData(true)
|
|
|
- this.fwl.xAxis[0].data = date
|
|
|
- this.fwl.series[0].data = data
|
|
|
- }, 3000)
|
|
|
- },
|
|
|
- methods: {
|
|
|
- handleClick(e) {
|
|
|
- this.$baseMessage(`点击了${e.name},这里可以写跳转`)
|
|
|
- },
|
|
|
- handleZrClick(e) {},
|
|
|
- handleChangeTheme() {
|
|
|
- this.$baseEventBus.$emit('theme')
|
|
|
- },
|
|
|
- async fetchData() {
|
|
|
- const { data } = await getList()
|
|
|
- data.map((item, index) => {
|
|
|
- if (index === data.length - 1) {
|
|
|
- item.color = '#0bbd87'
|
|
|
- }
|
|
|
- })
|
|
|
- this.activities = data
|
|
|
- const res = await getNoticeList()
|
|
|
- this.noticeList = res.data
|
|
|
- /* getRepos({
|
|
|
- token: "1061286824f978ea3cf98b7b8ea26fe27ba7cea1",
|
|
|
- }).then((res) => {
|
|
|
- const per_page = Math.ceil(res.data.stargazers_count / 100);
|
|
|
- alert(per_page);
|
|
|
- getStargazers({
|
|
|
- token: "1061286824f978ea3cf98b7b8ea26fe27ba7cea1",
|
|
|
- page: 1,
|
|
|
- per_page: res.per_page,
|
|
|
- }).then((res) => {
|
|
|
- alert(JSON.stringify(res));
|
|
|
- });
|
|
|
- }); */
|
|
|
- },
|
|
|
- },
|
|
|
- }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ mounted() {},
|
|
|
+ methods: {},
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.index-container {
|