fix:router
This commit is contained in:
parent
96b4812e47
commit
d0e78ef2b7
@ -1,6 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<div :class="`custom-rank-list rank-${type}`" :style="`color: ${textColor}`">
|
<div :class="`custom-rank-list rank-${type}`" :style="`color: ${textColor}`">
|
||||||
<div v-for="(item, i) in status.rows" :key="item.toString() + item.scroll" class="row-item" :style="`height: ${status.heights[i]}px;`">
|
<div
|
||||||
|
v-for="(item, i) in status.rows"
|
||||||
|
:key="item.toString() + item.scroll"
|
||||||
|
:class="`row-item row-item-${item.ranking}`"
|
||||||
|
:style="`height: ${status.heights[i]}px;`"
|
||||||
|
>
|
||||||
<div class="ranking-info">
|
<div class="ranking-info">
|
||||||
<div class="rank" :style="`color: ${color};font-size: ${indexFontSize}px`">{{ indexPrefix }}{{ item.ranking }}</div>
|
<div class="rank" :style="`color: ${color};font-size: ${indexFontSize}px`">{{ indexPrefix }}{{ item.ranking }}</div>
|
||||||
<div class="info-name" :style="`font-size: ${leftFontSize}px`" v-html="item.name" />
|
<div class="info-name" :style="`font-size: ${leftFontSize}px`" v-html="item.name" />
|
||||||
@ -223,7 +228,7 @@ onUnmounted(() => {
|
|||||||
height: 2px;
|
height: 2px;
|
||||||
background: radial-gradient(rgb(40 248 255) 5%, transparent 80%);
|
background: radial-gradient(rgb(40 248 255) 5%, transparent 80%);
|
||||||
transform: translateX(-100%);
|
transform: translateX(-100%);
|
||||||
animation: shine 3s ease-in-out infinite alternate;
|
// animation: shine 3s ease-in-out infinite alternate;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -2,7 +2,6 @@ import { createRouter, createWebHistory } from 'vue-router';
|
|||||||
import Layout from '@/layouts/index.vue';
|
import Layout from '@/layouts/index.vue';
|
||||||
|
|
||||||
import demoRouters from './modules/demo';
|
import demoRouters from './modules/demo';
|
||||||
import path from 'path-browserify';
|
|
||||||
import v2 from './modules/v2';
|
import v2 from './modules/v2';
|
||||||
|
|
||||||
export const constantRoutes = [
|
export const constantRoutes = [
|
||||||
@ -22,67 +21,17 @@ export const constantRoutes = [
|
|||||||
path: '/',
|
path: '/',
|
||||||
name: 'layout',
|
name: 'layout',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: '/home',
|
redirect: '/v2/land',
|
||||||
meta: { title: '首页', icon: 'House' },
|
meta: { title: '首页', icon: 'House' },
|
||||||
// children: [
|
|
||||||
// {
|
|
||||||
// path: '/home',
|
|
||||||
// component: () => import('@/views/home/index.vue'),
|
|
||||||
// name: 'home',
|
|
||||||
// meta: { title: '首页', icon: 'House' },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/land',
|
|
||||||
// component: () => import('@/views/land/index.vue'),
|
|
||||||
// name: 'land',
|
|
||||||
// meta: { title: '土地资源', icon: 'House' },
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/inputs',
|
|
||||||
// name: 'inputs',
|
|
||||||
// component: () => import('@/views/inputs/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/entities',
|
|
||||||
// name: 'entities',
|
|
||||||
// component: () => import('@/views/entities/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/breed',
|
|
||||||
// name: 'breed',
|
|
||||||
// component: () => import('@/views/breed/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/plant',
|
|
||||||
// name: 'plant',
|
|
||||||
// component: () => import('@/views/plant/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/trace',
|
|
||||||
// name: 'trace',
|
|
||||||
// component: () => import('@/views/trace/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// path: '/early',
|
|
||||||
// name: 'early',
|
|
||||||
// component: () => import('@/views/early/index.vue'),
|
|
||||||
// hidden: true,
|
|
||||||
// },
|
|
||||||
// ],
|
|
||||||
},
|
},
|
||||||
...demoRouters,
|
// ...demoRouters,
|
||||||
v2,
|
v2,
|
||||||
{
|
// {
|
||||||
path: '/test',
|
// path: '/test',
|
||||||
name: 'test',
|
// name: 'test',
|
||||||
component: () => import('@/views/test/index.vue'),
|
// component: () => import('@/views/test/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
];
|
];
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -3,9 +3,9 @@ import Layout from '@/layouts/index.vue';
|
|||||||
export default [
|
export default [
|
||||||
{
|
{
|
||||||
path: '/demo',
|
path: '/demo',
|
||||||
name: 'layout',
|
name: 'demo',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: '/demo/scrollBoard',
|
redirect: '/scrollBoard',
|
||||||
meta: { title: '案例', icon: 'document' },
|
meta: { title: '案例', icon: 'document' },
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
@ -21,10 +21,10 @@ export default [
|
|||||||
meta: { title: '滚动排名列表', icon: 'document' },
|
meta: { title: '滚动排名列表', icon: 'document' },
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/demo/test',
|
path: '/page',
|
||||||
component: () => import('@/views/land/index.vue'),
|
component: () => import('@/views/demo/test.vue'),
|
||||||
name: 'demo-land',
|
name: 'page',
|
||||||
meta: { title: '土地资源', icon: 'document' },
|
meta: { title: '测试', icon: 'document' },
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
@ -2,58 +2,58 @@ import Layout from '@/layouts/index.vue';
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
path: '/v2',
|
path: '/v2',
|
||||||
name: 'layout',
|
name: 'v2',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: '/v2/home',
|
redirect: '/v2/home',
|
||||||
meta: { title: '首页', icon: 'House' },
|
meta: { title: '首页', icon: 'House' },
|
||||||
children: [
|
children: [
|
||||||
|
// {
|
||||||
|
// path: '/v2/home',
|
||||||
|
// component: () => import('@/views/home/index.vue'),
|
||||||
|
// name: 'home',
|
||||||
|
// meta: { title: '首页', icon: 'House' },
|
||||||
|
// },
|
||||||
{
|
{
|
||||||
path: 'home',
|
path: '/v2/land',
|
||||||
component: () => import('@/views/home/index.vue'),
|
|
||||||
name: 'home',
|
|
||||||
meta: { title: '首页', icon: 'House' },
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'land',
|
|
||||||
component: () => import('@/views/land/index.vue'),
|
component: () => import('@/views/land/index.vue'),
|
||||||
name: 'land',
|
name: 'land',
|
||||||
meta: { title: '土地资源', icon: 'House' },
|
meta: { title: '土地资源', icon: 'House' },
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
path: 'inputs',
|
// path: 'inputs',
|
||||||
name: 'inputs',
|
// name: 'inputs',
|
||||||
component: () => import('@/views/inputs/index.vue'),
|
// component: () => import('@/views/inputs/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'entities',
|
// path: 'entities',
|
||||||
name: 'entities',
|
// name: 'entities',
|
||||||
component: () => import('@/views/entities/index.vue'),
|
// component: () => import('@/views/entities/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'breed',
|
// path: 'breed',
|
||||||
name: 'breed',
|
// name: 'breed',
|
||||||
component: () => import('@/views/breed/index.vue'),
|
// component: () => import('@/views/breed/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'plant',
|
// path: 'plant',
|
||||||
name: 'plant',
|
// name: 'plant',
|
||||||
component: () => import('@/views/plant/index.vue'),
|
// component: () => import('@/views/plant/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'trace',
|
// path: 'trace',
|
||||||
name: 'trace',
|
// name: 'trace',
|
||||||
component: () => import('@/views/trace/index.vue'),
|
// component: () => import('@/views/trace/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'early',
|
// path: 'early',
|
||||||
name: 'early',
|
// name: 'early',
|
||||||
component: () => import('@/views/early/index.vue'),
|
// component: () => import('@/views/early/index.vue'),
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
},
|
// },
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
@ -55,39 +55,41 @@ const options = ref({
|
|||||||
font-family: 'DingTalk JinBuTi, DingTalk JinBuTi-Regular';
|
font-family: 'DingTalk JinBuTi, DingTalk JinBuTi-Regular';
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&:nth-child(1) {
|
&:deep(.row-item-1) {
|
||||||
.ranking-info {
|
.ranking-info {
|
||||||
color: #fe7f03 !important;
|
color: #fe7f03 !important;
|
||||||
}
|
|
||||||
.ranking-value {
|
|
||||||
color: #fe7f03 !important;
|
|
||||||
}
|
|
||||||
.inside-column {
|
|
||||||
background: linear-gradient(90deg, rgba(254, 127, 3, 0), #fe7f03) !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&:nth-child(2) {
|
.ranking-value {
|
||||||
.ranking-info {
|
color: #fe7f03 !important;
|
||||||
color: #fef906 !important;
|
|
||||||
}
|
|
||||||
.ranking-value {
|
|
||||||
color: #fef906 !important;
|
|
||||||
}
|
|
||||||
.inside-column {
|
|
||||||
background: linear-gradient(90deg, rgba(254, 249, 6, 0), #fef906) !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
&:nth-child(3) {
|
.inside-column {
|
||||||
.ranking-info {
|
background: linear-gradient(90deg, rgba(254, 127, 3, 0), #fe7f03) !important;
|
||||||
color: #02fd94 !important;
|
}
|
||||||
}
|
}
|
||||||
.ranking-value {
|
|
||||||
color: #02fd94 !important;
|
&:deep(.row-item-2) {
|
||||||
}
|
.ranking-info {
|
||||||
.inside-column {
|
color: #fef906 !important;
|
||||||
background: linear-gradient(90deg, rgba(2, 253, 148, 0), #02fd94) !important;
|
}
|
||||||
}
|
.ranking-value {
|
||||||
|
color: #fef906 !important;
|
||||||
|
}
|
||||||
|
.inside-column {
|
||||||
|
background: linear-gradient(90deg, rgba(254, 249, 6, 0), #fef906) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:deep(.row-item-3) {
|
||||||
|
.ranking-info {
|
||||||
|
color: #02fd94 !important;
|
||||||
|
}
|
||||||
|
.ranking-value {
|
||||||
|
color: #02fd94 !important;
|
||||||
|
}
|
||||||
|
.inside-column {
|
||||||
|
background: linear-gradient(90deg, rgba(2, 253, 148, 0), #02fd94) !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user