初始化本地仓库
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
<?php
|
||||
/**
|
||||
*+------------------
|
||||
* madong
|
||||
*+------------------
|
||||
* Copyright (c) https://gitee.com/motion-code All rights reserved.
|
||||
*+------------------
|
||||
* Author: Mr. April (405784684@qq.com)
|
||||
*+------------------
|
||||
* Official Website: https://madong.tech
|
||||
*/
|
||||
|
||||
return [
|
||||
];
|
||||
@@ -0,0 +1,10 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* 前端菜单配置
|
||||
* 安装时会自动加载
|
||||
*/
|
||||
|
||||
return [
|
||||
|
||||
];
|
||||
@@ -0,0 +1,12 @@
|
||||
<?php
|
||||
/**
|
||||
*+------------------
|
||||
* madong
|
||||
*+------------------
|
||||
* Copyright (c) https://gitee.com/motion-code All rights reserved.
|
||||
*+------------------
|
||||
* Official Website: http://www.madong.tech
|
||||
*/
|
||||
|
||||
return [
|
||||
];
|
||||
@@ -0,0 +1,29 @@
|
||||
import request from "@/utils/http";
|
||||
|
||||
/**
|
||||
* 登录
|
||||
* @param params 登录参数
|
||||
* @returns 登录响应
|
||||
*/
|
||||
export function fetchLogin(params: Api.Auth.LoginParams) {
|
||||
return request.post<Api.Auth.LoginResponse>({
|
||||
url: "/api/auth/login",
|
||||
params,
|
||||
// showSuccessMessage: true // 显示成功消息
|
||||
// showErrorMessage: false // 不显示错误消息
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取用户信息
|
||||
* @returns 用户信息
|
||||
*/
|
||||
export function fetchGetUserInfo() {
|
||||
return request.get<Api.Auth.UserInfo>({
|
||||
url: "/api/user/info",
|
||||
// 自定义请求头
|
||||
// headers: {
|
||||
// 'X-Custom-Header': 'your-custom-value'
|
||||
// }
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import request from '@/utils/http'
|
||||
|
||||
export class DictService {
|
||||
// 获取所有字典
|
||||
static getAllDict() {
|
||||
return request.post<any>({
|
||||
url: '/sys/dict/enumDictList',
|
||||
showErrorMessage: false // 不显示错误消息
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import BaseService from '@/api/core/base';
|
||||
|
||||
|
||||
|
||||
import request from '@/utils/http';
|
||||
|
||||
const baseUrl = '/test';
|
||||
|
||||
export const TestService = {
|
||||
...BaseService<any>({ baseUrl }),
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
import request from '@/utils/http'
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
// 获取用户列表
|
||||
export function fetchGetUserList(params: Api.SystemManage.UserSearchParams) {
|
||||
return request.get<Api.SystemManage.UserList>({
|
||||
url: '/api/user/list',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
// 获取角色列表
|
||||
export function fetchGetRoleList(params: Api.SystemManage.RoleSearchParams) {
|
||||
return request.get<Api.SystemManage.RoleList>({
|
||||
url: '/api/role/list',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
// 获取菜单列表
|
||||
export function fetchGetMenuList() {
|
||||
return request.get<AppRouteRecord[]>({
|
||||
url: '/system/auth/user-menus',
|
||||
params: {
|
||||
format: 'art'
|
||||
}
|
||||
})
|
||||
}
|
||||
|
After Width: | Height: | Size: 9.8 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 5.7 KiB |
|
After Width: | Height: | Size: 5.6 KiB |
|
After Width: | Height: | Size: 7.7 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
|
After Width: | Height: | Size: 954 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 726 B |
|
After Width: | Height: | Size: 944 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 810 B |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 9.6 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 8.5 KiB |
|
After Width: | Height: | Size: 9.4 KiB |
|
After Width: | Height: | Size: 9.0 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 514 B |
|
After Width: | Height: | Size: 409 B |
|
After Width: | Height: | Size: 431 B |
|
After Width: | Height: | Size: 439 B |
|
After Width: | Height: | Size: 292 B |
|
After Width: | Height: | Size: 286 B |
|
After Width: | Height: | Size: 293 B |
|
After Width: | Height: | Size: 448 B |
|
After Width: | Height: | Size: 416 B |
|
After Width: | Height: | Size: 509 B |
@@ -0,0 +1 @@
|
||||
<svg viewBox="0 0 400 300" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="a" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="94" y="34" width="212" height="233"><path d="M306 34H94v233h212V34Z" fill="#fff"/></mask><g mask="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M234.427 155.64h38.36V69.6h-38.36v86.04ZM113.326 155.64h121.1V69.6h-121.1v86.04Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M130.126 155.354h104.2v-72.95h-104.2v72.95ZM236.369 71.05s0 3.3 1.65 5.05c2.33 2.52 7.38-.2 7.38-.2s-1.75 5.15-1.55 10.19c.29 8.24 6.99 9.51 10 4.75 4.56 4.85 8.94-.29 9.52-2.62 4.27 4.76 9.32-.87 9.32-.87v-6.3l-23.99-12.13-12.33 2.13Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M234.429 155.641h-121.1l-15.93 32.11h121.1l15.93-32.11Z" fill="#fff"/><path d="M234.427 69.6h38.46v86.04M113.326 146.52V69.6h121.1M234.429 155.641l-15.93 32.11h-121.1l15.93-32.11h111.39" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M226.37 159.715H116.82l-12.04 23.86H215l11.37-23.86Z" fill="#006EFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="m288.807 187.751-15.92-32.11h-38.46l16.02 32.11h38.36Z" fill="#fff"/><path d="m238.607 163.981 11.84 23.77h38.36l-15.92-32.11h-38.46" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M207.336 223.734c-3.69-13.77-15.44-23.86-29.33-23.86h-8.65s-27.09 14.94-27.09 33.27c0 18.34 25.44 33.18 25.44 33.18h10.4c13.79-.1 25.44-10.19 29.13-23.87 1.75-12.51 0-18.62.1-18.72Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M243.459 240.421c3.98 0 7.28-3.3 7.28-7.27 0-3.98-3.3-7.28-7.28-7.28h-31.08c-3.98 0-7.28 3.3-7.28 7.28 0 3.97 3.3 7.27 7.28 7.27h31.08Z" fill="#C7DEFF"/><path d="M210.342 223.737c-4.08-13.87-16.9-23.96-32.05-23.96H168.972s-29.62 14.94-29.62 33.37 27.87 33.37 27.87 33.37h11.27c15.05-.1 27.77-10.19 31.75-23.96" stroke="#071F4D"/><path d="M212.379 240.421c-3.98 0-7.28-3.3-7.28-7.27m0 0c0-3.98 3.3-7.28 7.28-7.28" stroke="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M168.781 199.777c-18.45 0-33.41 14.94-33.41 33.37s14.96 33.37 33.41 33.37c18.45 0 33.4-14.94 33.4-33.37s-14.95-33.37-33.4-33.37Z" fill="#006EFF"/><path d="M168.781 199.777c-18.45 0-33.41 14.94-33.41 33.37s14.96 33.37 33.41 33.37c18.45 0 33.4-14.94 33.4-33.37s-14.95-33.37-33.4-33.37Z" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M168.775 209.38c-13.14 0-23.79 10.64-23.79 23.77 0 13.12 10.65 23.76 23.79 23.76 13.14 0 23.8-10.64 23.8-23.76 0-13.13-10.66-23.77-23.8-23.77Z" fill="#00E4E5"/><path d="M162.174 223.736a17.48 17.48 0 0 1 14.76-8.05M159.455 231.982c.1-1.36.29-2.62.68-3.88" stroke="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M173.535 209.87c-1.55-.3-3.11-.49-4.76-.49-13.11 0-23.79 10.67-23.79 23.77 0 13.09 10.68 23.76 23.79 23.76 1.65 0 3.21-.19 4.76-.48-10.88-2.23-19.03-11.84-19.03-23.28 0-11.45 8.15-21.05 19.03-23.28Z" fill="#071F4D"/><path d="M219.957 225.774h23.6c4.08 0 7.38 3.3 7.38 7.37m0 0c0 4.08-3.3 7.37-7.38 7.37h-20.1M212.091 225.774h3.3" stroke="#071F4D"/><path d="m248.894 34.485-.19 18.24c0 4.07-.39 5.23-2.14 6.79-8.15 6.88-10.97 9.02-9.22 12.9 1.45 3.2 6.79 2.23 9.61-1.55-.39 4.56-5.24 15.32-.58 18.04 4.37 2.52 6.89-3.49 6.89-3.49s.49 3.49 4.47 3.49c3.69 0 5.24-4.75 5.24-4.75s2.14 3.49 6.22 1.35c3.11-1.55 5.44-7.08 5.44-26.67v-24.35" fill="#fff"/><path d="m248.894 34.485-.19 18.24c0 4.07-.39 5.23-2.14 6.79-8.15 6.88-10.97 9.02-9.22 12.9 1.45 3.2 6.79 2.23 9.61-1.55-.39 4.56-5.24 15.32-.58 18.04 4.37 2.52 6.89-3.49 6.89-3.49s.49 3.49 4.47 3.49c3.69 0 5.24-4.75 5.24-4.75s2.14 3.49 6.22 1.35c3.11-1.55 5.44-7.08 5.44-26.67v-24.35" stroke="#071F4D"/><path d="M255.307 75.71s-.39 5.43-2.04 9.6l2.04-9.6Z" fill="#fff"/><path d="M255.307 75.71s-.39 5.43-2.04 9.6" stroke="#071F4D"/><path d="M264.921 75.323s-.68 5.24-2.04 8.63l2.04-8.63Z" fill="#fff"/><path d="M264.921 75.323s-.68 5.24-2.04 8.63M147.801 34.485v34.92M121.775 34.485v34.92M102.546 204.724v13.97M102.546 222.379v.87M102.546 197.934v3.49M115.268 206.955v26.29M115.268 239.451v5.34M244.43 197.643v11.93M244.43 213.939v3.49M270.359 201.232v33.76M115.369 47.774h-13.6M94.486 47.774h3.4M241.516 47.774h-84.1M280.168 47.774h25.35" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="m282.497 183.575-12.04-23.86h-27.29l11.36 23.86h27.97Z" fill="#00E4E5"/><path d="M234.427 134.88V69.6M234.427 140.412v7.66" stroke="#071F4D"/><path d="M220.831 228.684h16.99M240.934 228.684h2.43" stroke="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="m223.842 187.462 21.46-.2-10.97-20.66-10.49 20.86Z" fill="#071F4D"/></g></svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
@@ -0,0 +1,5 @@
|
||||
<svg
|
||||
viewBox="0 0 400 300"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><mask id="a" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="47" y="38" width="307" height="224"><path d="M353.3 38H47.5v223.8h305.8V38Z" fill="#fff"/></mask><g mask="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M299.2 200.6H61.6v5.1h240.3l-2.7-5.1Z" fill="#C7DEFF"/><path d="m308.9 185.8-6.5 20H183.7M332.3 127.6h10.6l-5 16.7-14.8-.1-7.2 21.1M328.8 127.4l13.6-39.6M307.6 166 337 84.7H180.6l-9.8 26.9h-10.5M296.6 196l4.3-11.8M157.2 149.2l6.4-17.7" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M324.8 93.1H188.5l-34.8 95.8h136.4l34.7-95.8ZM169.9 166.2l5-13.6-5 13.6Z" fill="#fff"/><path d="m169.9 166.2 5-13.6" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M324.8 93.1H188.5l-4 11.7h135.8l4.5-11.7Z" fill="#006EFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M102.6 159.5h38.3l2.7 36.6h-38.4c-10.1 0-20.9-8.2-20.9-18.3 0-10.1 8.2-18.3 18.3-18.3Z" fill="#DEEBFC"/><path fill-rule="evenodd" clip-rule="evenodd" d="M84.3 174.102c2.5 3.4 10 5 17.9 2.8 16.6-6.5 23.8-3.9 23.8-3.9s.5-3.4 1.3-5c-5.8-3-15.4.3-26.1 3.1-10.7 2.8-15.8-2.5-15.8-2.5-.4 0-1.1 2.8-1.1 5.5Z" fill="#fff"/><path d="M96.5 194.2c-7.2-3.3-12.2-10.5-12.2-19m0 0c0-11.5 9.3-20.8 20.8-20.8h29.4" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M140.3 195.1c-8.4-2.7-14.5-10.6-14.5-19.8l14.5 19.8Zm-14.5-19.8c0-11.5 9.3-20.8 20.8-20.8l-20.8 20.8Zm20.8-20.8c11.5 0 20.8 9.3 20.8 20.8l-20.8-20.8Zm20.8 20.8c0 8.4-5 15.6-12.1 18.9l12.1-18.9Z" fill="#fff"/><path d="M140.3 195.1c-8.4-2.7-14.5-10.6-14.5-19.8m0 0c0-11.5 9.3-20.8 20.8-20.8m0 0c11.5 0 20.8 9.3 20.8 20.8m0 0c0 8.4-5 15.6-12.1 18.9" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M161.5 177.2c0-7.7-6.3-14-14-14s-14 6.3-14 14c0 5.8 3.5 10.8 8.6 12.9.1 0 5.8 1.6 10.7 0 5.3-1.7 8.7-7.1 8.7-12.9Z" fill="#00E4E5"/><path d="M140.5 190.1c-5.8-2.4-9.9-8.2-9.9-14.9 0-8.9 7.2-16.1 16.1-16.1 8.9 0 16.1 7.2 16.1 16.1 0 6.8-4.2 12.5-10.1 14.9M88.4 170.604c2.9 1.3 7.7 2.6 13.6.3 14.7-5.7 22.3-4.3 24.6-3.5M84.5 174.599s5.9 6.5 19 1.7c9.2-3.4 15.3-3.9 18.8-3.8" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M340.6 112.3h-55.2l-2.7 6.2H338l2.6-6.2Z" fill="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M236.8 117.9c-16.13 0-29.2 13.07-29.2 29.2s13.07 29.2 29.2 29.2 29.2-13.07 29.2-29.2-13.07-29.2-29.2-29.2Z" fill="#00E4E5"/><path d="M265 123.3c13.1 13.1 13.1 34.4 0 47.6M306 205.9h19.2M61.7 205.9h32.9M181.2 196.2h115.2M47.5 205.9h10v-9.7h73.8" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M146.7 179.2c-2.49 0-4.5 2.01-4.5 4.5s2.01 4.5 4.5 4.5 4.5-2.01 4.5-4.5-2.01-4.5-4.5-4.5Z" fill="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M169.5 196.2c3.9 0 7.1 3.2 7.1 7.1 0 3.9-3.2 7.1-7.1 7.1H144c-2.1 0-3.9 1.7-3.9 3.9v1c0 2.1 1.7 3.9 3.9 3.9h48c5.1 0 9.2 4.1 9.2 9.2s-4.1 9.3-9.2 9.2h-33.8c-2.3 0-4.1 1.8-4.1 4.1s1.8 4.1 4.1 4.1h4.2c4.4 0 8 3.6 8 8s-3.6 8-8 8H111c-3.7 0-6.8-3-6.8-6.8 0-3.7 3-6.8 6.8-6.8h.3c2.3 0 4.1-1.8 4.1-4.1s-1.8-4.1-4.1-4.1H79c-4.5 0-8.1-3.6-8.1-8.1s3.6-8.1 8.1-8.1h37.7c2.1 0 3.9-1.7 3.9-3.9 0-2.1-1.7-3.9-3.9-3.9h-7.9c-4.4 0-7.9-3.5-7.9-7.9s3.5-7.9 7.9-7.9h30.4c2.2 0 3.9-1.8 3.9-3.9V187c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5v5.3c0 2.2 1.8 3.9 3.9 3.9h15.5Z" fill="#006EFF"/><path d="m227.8 138.5 18.7 18.7M227.8 157.2l18.7-18.7" stroke="#fff" stroke-width="6"/><path fill-rule="evenodd" clip-rule="evenodd" d="M194.8 96.9c-.99 0-1.8.81-1.8 1.8s.81 1.8 1.8 1.8 1.8-.81 1.8-1.8-.81-1.8-1.8-1.8ZM202.9 96.9c-.99 0-1.8.81-1.8 1.8s.81 1.8 1.8 1.8 1.8-.81 1.8-1.8-.81-1.8-1.8-1.8Z" fill="#fff"/><path d="m291.7 184.3-1.6 4.6h-121M298.1 166.7l22.5-61.9" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="m193 134.1 2.2-5.1h-19.4l-2.3 5.1H193ZM313.2 123.5l2.2-5.1h-24.5l-2.3 5.1h24.6Z" fill="#DEEBFC"/><path d="m164.5 159.2 19.8-54.6" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M199.6 119.8h-53.2l-4.4 9.3h53.2l4.4-9.3Z" fill="#00E4E5"/><path d="M151.3 129.1H142l4.4-9.3h16.9" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M353.3 169.4h-67.4l-4.8 12.2h67.3l4.9-12.2Z" fill="#006EFF"/><path d="M332.4 169.4h20.9l-4.9 12.2h-39.7M242.7 235.5v-4.8c0-3.8 3.1-7 7-7h20.2c3.8 0 7 3.1 7 7" stroke="#071F4D"/><path d="M261.1 235.5v-4.8c0-3.8 3.1-7 7-7h13.7c3.8 0 7 3.1 7 7v4.8M242.6 230.7h13.7M235.2 237.7h63.3M224 237.7h6.7" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M324.1 141.3H335l3.3-10.7h-10.2l-4 10.7Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M288.3 230.4c0-3.6-2.9-6.5-6.5-6.5h-14.2c-3.6 0-6.5 2.9-6.5 6.5v5.3h27.2v-5.3Z" fill="#071F4D"/><path d="M80.4 228.5H83M87.7 228.5h19.2M146.3 195.8v2c0 3.6-2.9 6.6-6.6 6.6H138M133.4 204.3h1.5M154 249.9h9.4" stroke="#DEEBFC"/><path d="m299.4 141.9 5.1-13.9" stroke="#071F4D"/></g></svg>
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
@@ -0,0 +1 @@
|
||||
<svg viewBox="0 0 400 300" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="a" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="44" y="42" width="312" height="217"><path d="M355.3 42H44v216.9h311.3V42Z" fill="#fff"/></mask><g mask="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M288.2 248.4h25.1v-30h-25.1v30Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M304.498 238.199c-1.5-3.9-5.9-15.4-4-21.6-2.9.8-3.3.1-5-.1-1.7-.1 0 10.7 2.2 16.4 1.7 4.5 2.1 11.1 2.1 13.6h5.4c.2-1.9.3-5.5-.7-8.3Z" fill="#fff"/><path d="M311.5 214.7v-1.6c0-.7-.6-1.3-1.3-1.3h-22.8c-.7 0-1.3.6-1.3 1.3v1.6" fill="#fff"/><path d="M311.5 214.7v-1.6c0-.7-.6-1.3-1.3-1.3h-22.8c-.7 0-1.3.6-1.3 1.3v1.6M290.2 214.7h21.4c1 0 1.8.8 1.8 1.8v29" stroke="#071F4D" stroke-width="1.096"/><path d="M284.3 245.6v-29c0-1 .8-1.8 1.8-1.8h1.6" fill="#fff"/><path d="M284.3 245.6v-29c0-1 .8-1.8 1.8-1.8h1.6" stroke="#071F4D" stroke-width="1.096"/><path d="M295.402 216.5c-.9 4.2-.4 9.7 2.8 17.5 2.4 5.9 1.9 10.2 1.8 12.3M300.502 216.5c-.9 4.2-.4 9.7 2.8 17.5 2.4 5.9 1.9 10.2 1.8 12.3" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="m331 258.4-.3-5.2H88.5l-1.2 5.2H331Z" fill="#C7DEFF"/><path d="M252.9 248.7H331M216.6 258.4H331M47.1 139.3l-2.6 1.5 42.7 117.6h129.2v-6.6" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="m247.2 248.6-40.4-111.3H50.5l40.3 111.3h156.4Z" fill="#fff"/><path d="m247.2 248.6-40.4-111.3H50.5l40.3 111.3h156.4Z" stroke="#071F4D"/><path d="m203.2 153.2 32.2 88.7H97.8l-32.3-88.7" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M72.2 146.9c-.77 0-1.4.63-1.4 1.4 0 .77.63 1.4 1.4 1.4.77 0 1.4-.63 1.4-1.4 0-.77-.63-1.4-1.4-1.4ZM79.3 146.9c-.77 0-1.4.63-1.4 1.4 0 .77.63 1.4 1.4 1.4.77 0 1.4-.63 1.4-1.4 0-.77-.63-1.4-1.4-1.4Z" fill="#fff"/><path fill-rule="evenodd" clip-rule="evenodd" d="M263.5 171.2h80.3v-63.7h-80.3v63.7Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M290 143.9h-45.6l12.5 51.3H290v-51.3Z" fill="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M286 117.4h-29.3v77.8h92.9v-67.6l-55.9.6-7.7-10.8Z" fill="#00E4E5"/><path d="m332.6 127.6-38.9.6-7.7-10.8h-11.7M308.9 195.2h45.9M250.3 195.2h28.5M287.3 195.2h12.3" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M130.5 211.4H186v-44h-55.5v44Z" fill="#C7DEFF"/><path fill-rule="evenodd" clip-rule="evenodd" d="M148.7 192.5h-31.6l8.7 35.5h22.9v-35.5Z" fill="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M145.9 174.2h-20.2V228h64.1v-46.7l-38.6.4-5.3-7.5Z" fill="#006EFF"/><path d="m179 181.3-27.8.4-5.3-7.5h-7.7M176.2 201.7h19.2M163.2 210.7H195M172.1 228h-54.2M184.8 228h8.1M174.9 228h5.4" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="m293.2 155.7-6.4 6.3 15.3 15.3 22.7-22.6-6.4-6.4-16.3 16.3-8.9-8.9Z" fill="#fff"/><path d="M57.2 258.4h283.6M345.9 258.4h8.1M55.4 258.4h220.5M160.1 118.8l-1.2 2.7M156.7 127c-.3.8-.7 1.8-1.1 2.8M222 68.5c-1 .2-1.9.5-2.9.8M214.1 70.7c-5.8 1.9-11.3 4.4-16.5 7.4M195.4 79.5c-.9.5-1.7 1.1-2.5 1.6M314.2 98.5c-.6-.8-1.3-1.5-2-2.3M308.9 92.8c-4-4-8.3-7.6-13-10.8M293.9 80.7c-.8-.5-1.7-1.1-2.5-1.6" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M251.296 71.203c-3.6-1.5-18.5-2.9-21.8-1.9-1 5.8 4.9 13.5 4.9 13.5s6-9.9 16.9-11.6Z" fill="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M251.3 42.704c-6.5 6.7-7.8 13-8.8 19.3 24.4-1.1 36.3 13 42.8 20 3.2-9.1 7.8-23 7.2-29-7.1-6.4-20-11.7-41.2-10.3Z" fill="#C7DEFF"/><path d="M230 69.3c36.2-3.8 52 21.1 52 21.1s11.4-28.2 10.5-37.4c-7.3-6.5-23.3-12-45.6-10.1-9 6.3-15.6 18.7-16.9 26.4Z" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M161.604 70.7c-6 8.4-9.9 21.9-8.8 33.8 8.4 5.3 32.3 10.5 43.6 11.5 6.1-7.9 15.9-26 15.9-26s-32-4.8-50.7-19.3Z" fill="#C7DEFF"/><path d="M193.103 119.5c4.8-2.7 19.2-29.5 19.2-29.5s-35.8-5.4-53.7-21.8c-9.3 6.1-16.4 24.3-15 40.1 10.6 6.7 45.8 13.3 49.5 11.2Z" stroke="#071F4D"/><path fill-rule="evenodd" clip-rule="evenodd" d="M189.5 111.6c-3 5.2-5.7 7.2-9.8 6.6 12.2 2.6 13.5 1.2 15.6-1.1 2.2-2.4 4.2-6.6 4.2-6.6s-3.1 2.5-10 1.1Z" fill="#071F4D"/><path d="M331 251.8v6.6M77 165.4l-2.7-6.7h7.8M222.8 228.9l2.8 6.6h-7.9" stroke="#071F4D"/></g></svg>
|
||||
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 12 KiB |
@@ -0,0 +1,292 @@
|
||||
// 全局样式
|
||||
// 顶部进度条颜色
|
||||
#nprogress .bar {
|
||||
z-index: 2400;
|
||||
background-color: color-mix(in srgb, var(--theme-color) 70%, white);
|
||||
}
|
||||
|
||||
#nprogress .peg {
|
||||
box-shadow:
|
||||
0 0 10px var(--theme-color),
|
||||
0 0 5px var(--theme-color) !important;
|
||||
}
|
||||
|
||||
#nprogress .spinner-icon {
|
||||
border-top-color: var(--theme-color) !important;
|
||||
border-left-color: var(--theme-color) !important;
|
||||
}
|
||||
|
||||
// 处理移动端组件兼容性
|
||||
@media screen and (max-width: 640px) {
|
||||
* {
|
||||
cursor: default !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 背景滤镜
|
||||
*,
|
||||
::before,
|
||||
::after {
|
||||
--tw-backdrop-blur: ;
|
||||
--tw-backdrop-brightness: ;
|
||||
--tw-backdrop-contrast: ;
|
||||
--tw-backdrop-grayscale: ;
|
||||
--tw-backdrop-hue-rotate: ;
|
||||
--tw-backdrop-invert: ;
|
||||
--tw-backdrop-opacity: ;
|
||||
--tw-backdrop-saturate: ;
|
||||
--tw-backdrop-sepia: ;
|
||||
}
|
||||
|
||||
// 色弱模式
|
||||
.color-weak {
|
||||
filter: invert(80%);
|
||||
-webkit-filter: invert(80%);
|
||||
}
|
||||
|
||||
#noop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// 语言切换选中样式
|
||||
.langDropDownStyle {
|
||||
// 选中项背景颜色
|
||||
.is-selected {
|
||||
background-color: var(--art-el-active-color) !important;
|
||||
}
|
||||
|
||||
// 语言切换按钮菜单样式优化
|
||||
.lang-btn-item {
|
||||
.el-dropdown-menu__item {
|
||||
padding-left: 13px !important;
|
||||
padding-right: 6px !important;
|
||||
margin-bottom: 3px !important;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.el-dropdown-menu__item {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-txt {
|
||||
min-width: 60px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
i {
|
||||
font-size: 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 盒子默认边框
|
||||
.page-content {
|
||||
border: 1px solid var(--art-card-border) !important;
|
||||
}
|
||||
|
||||
@mixin art-card-base($border-color, $shadow: none, $radius-diff: 4px) {
|
||||
background: var(--default-box-color);
|
||||
border: 1px solid #{$border-color} !important;
|
||||
border-radius: calc(var(--custom-radius) + #{$radius-diff}) !important;
|
||||
box-shadow: #{$shadow} !important;
|
||||
|
||||
--el-card-border-color: var(--default-border) !important;
|
||||
}
|
||||
|
||||
.art-card,
|
||||
.art-card-sm,
|
||||
.art-card-xs {
|
||||
border: 1px solid var(--art-card-border);
|
||||
}
|
||||
|
||||
// 盒子边框
|
||||
[data-box-mode='border-mode'] {
|
||||
.page-content,
|
||||
.art-table-card {
|
||||
border: 1px solid var(--art-card-border) !important;
|
||||
}
|
||||
|
||||
.art-card {
|
||||
@include art-card-base(var(--art-card-border), none, 4px);
|
||||
}
|
||||
|
||||
.art-card-sm {
|
||||
@include art-card-base(var(--art-card-border), none, 0px);
|
||||
}
|
||||
|
||||
.art-card-xs {
|
||||
@include art-card-base(var(--art-card-border), none, -4px);
|
||||
}
|
||||
}
|
||||
|
||||
// 盒子阴影
|
||||
[data-box-mode='shadow-mode'] {
|
||||
.page-content,
|
||||
.art-table-card {
|
||||
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.04) !important;
|
||||
border: 1px solid var(--art-gray-200) !important;
|
||||
}
|
||||
|
||||
.layout-sidebar {
|
||||
border-right: 1px solid var(--art-card-border) !important;
|
||||
}
|
||||
|
||||
.art-card {
|
||||
@include art-card-base(
|
||||
var(--art-gray-200),
|
||||
(0 1px 3px 0 rgba(0, 0, 0, 0.03), 0 1px 2px -1px rgba(0, 0, 0, 0.08)),
|
||||
4px
|
||||
);
|
||||
}
|
||||
|
||||
.art-card-sm {
|
||||
@include art-card-base(
|
||||
var(--art-gray-200),
|
||||
(0 1px 3px 0 rgba(0, 0, 0, 0.03), 0 1px 2px -1px rgba(0, 0, 0, 0.08)),
|
||||
2px
|
||||
);
|
||||
}
|
||||
|
||||
.art-card-xs {
|
||||
@include art-card-base(
|
||||
var(--art-gray-200),
|
||||
(0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 1px -1px rgba(0, 0, 0, 0.08)),
|
||||
-4px
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// 元素全屏
|
||||
.el-full-screen {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100vw !important;
|
||||
height: 100% !important;
|
||||
z-index: 2300;
|
||||
margin-top: 0;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
background-color: var(--default-box-color);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
// 表格卡片
|
||||
.art-table-card {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 12px;
|
||||
border-radius: calc(var(--custom-radius) / 2 + 2px) !important;
|
||||
|
||||
.el-card__body {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
// 容器全高
|
||||
.art-full-height {
|
||||
height: var(--art-full-height);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
// 徽章样式
|
||||
.art-badge {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 20px;
|
||||
bottom: 0;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
margin: auto;
|
||||
background: #ff3860;
|
||||
border-radius: 50%;
|
||||
animation: breathe 1.5s ease-in-out infinite;
|
||||
|
||||
&.art-badge-horizontal {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&.art-badge-mixed {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
&.art-badge-dual {
|
||||
right: 5px;
|
||||
top: 5px;
|
||||
bottom: auto;
|
||||
}
|
||||
}
|
||||
|
||||
// 文字徽章样式
|
||||
.art-text-badge {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 12px;
|
||||
bottom: 0;
|
||||
min-width: 20px;
|
||||
height: 18px;
|
||||
line-height: 17px;
|
||||
padding: 0 5px;
|
||||
margin: auto;
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: #fd4e4e;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@keyframes breathe {
|
||||
0% {
|
||||
opacity: 0.7;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 1;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0.7;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
// 修复老机型 loading 定位问题
|
||||
.art-loading-fix {
|
||||
position: fixed !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
bottom: 0 !important;
|
||||
width: 100vw !important;
|
||||
height: 100vh !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
}
|
||||
|
||||
.art-loading-fix .el-loading-spinner {
|
||||
position: static !important;
|
||||
top: auto !important;
|
||||
left: auto !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
// 去除移动端点击背景色
|
||||
@media screen and (max-width: 1180px) {
|
||||
* {
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
/*
|
||||
* 深色主题
|
||||
* 单页面移除深色主题 document.getElementsByTagName("html")[0].removeAttribute('class')
|
||||
*/
|
||||
|
||||
$font-color: rgba(#ffffff, 0.85);
|
||||
|
||||
/* 覆盖element-plus默认深色背景色 */
|
||||
html.dark {
|
||||
// element-plus
|
||||
--el-bg-color: var(--default-box-color);
|
||||
--el-text-color-regular: #{$font-color};
|
||||
|
||||
// 富文本编辑器
|
||||
// 工具栏背景颜色
|
||||
--w-e-toolbar-bg-color: #18191c;
|
||||
// 输入区域背景颜色
|
||||
--w-e-textarea-bg-color: #090909;
|
||||
// 工具栏文字颜色
|
||||
--w-e-toolbar-color: var(--art-gray-600);
|
||||
// 选中菜单颜色
|
||||
--w-e-toolbar-active-bg-color: #25262b;
|
||||
// 弹窗边框颜色
|
||||
--w-e-toolbar-border-color: var(--default-border-dashed);
|
||||
// 分割线颜色
|
||||
--w-e-textarea-border-color: var(--default-border-dashed);
|
||||
// 链接输入框边框颜色
|
||||
--w-e-modal-button-border-color: var(--default-border-dashed);
|
||||
// 表格头颜色
|
||||
--w-e-textarea-slight-bg-color: #090909;
|
||||
// 按钮背景颜色
|
||||
--w-e-modal-button-bg-color: #090909;
|
||||
// hover toolbar 背景颜色
|
||||
--w-e-toolbar-active-color: var(--art-gray-800);
|
||||
}
|
||||
|
||||
.dark {
|
||||
.page-content .article-list .item .left .outer > div {
|
||||
border-right-color: var(--dark-border-color) !important;
|
||||
}
|
||||
|
||||
// 富文本编辑器
|
||||
.editor-wrapper {
|
||||
*:not(pre code *) {
|
||||
color: inherit !important;
|
||||
}
|
||||
}
|
||||
// 分隔线
|
||||
.w-e-bar-divider {
|
||||
background-color: var(--art-gray-300) !important;
|
||||
}
|
||||
|
||||
.w-e-select-list,
|
||||
.w-e-drop-panel,
|
||||
.w-e-bar-item-group .w-e-bar-item-menus-container,
|
||||
.w-e-text-container [data-slate-editor] pre > code {
|
||||
border: 1px solid var(--default-border) !important;
|
||||
}
|
||||
|
||||
// 下拉选择框
|
||||
.w-e-select-list {
|
||||
background-color: var(--default-box-color) !important;
|
||||
}
|
||||
|
||||
/* 下拉选择框 hover 样式调整 */
|
||||
.w-e-select-list ul li:hover,
|
||||
/* 工具栏 hover 按钮背景颜色 */
|
||||
.w-e-bar-item button:hover {
|
||||
background-color: #090909 !important;
|
||||
}
|
||||
|
||||
/* 代码块 */
|
||||
.w-e-text-container [data-slate-editor] pre > code {
|
||||
background-color: #25262b !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
/* 引用 */
|
||||
.w-e-text-container [data-slate-editor] blockquote {
|
||||
border-left: 4px solid var(--default-border-dashed) !important;
|
||||
background-color: var(--art-color);
|
||||
}
|
||||
|
||||
.editor-wrapper {
|
||||
.w-e-text-container [data-slate-editor] .table-container th:last-of-type {
|
||||
border-right: 1px solid var(--default-border-dashed) !important;
|
||||
}
|
||||
|
||||
.w-e-modal {
|
||||
background-color: var(--art-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
// 导入暗黑主题
|
||||
@use 'element-plus/theme-chalk/src/dark/css-vars.scss' as *;
|
||||
@@ -0,0 +1,34 @@
|
||||
// https://github.com/element-plus/element-plus/blob/dev/packages/theme-chalk/src/common/var.scss
|
||||
// 自定义Element 亮色主题
|
||||
|
||||
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
|
||||
$colors: (
|
||||
'white': #ffffff,
|
||||
'black': #000000,
|
||||
'success': (
|
||||
'base': #13deb9
|
||||
),
|
||||
'warning': (
|
||||
'base': #ffae1f
|
||||
),
|
||||
'danger': (
|
||||
'base': #ff4d4f
|
||||
),
|
||||
'error': (
|
||||
'base': #fa896b
|
||||
)
|
||||
),
|
||||
$button: (
|
||||
'hover-bg-color': var(--el-color-primary-light-9),
|
||||
'hover-border-color': var(--el-color-primary),
|
||||
'border-color': var(--el-color-primary),
|
||||
'text-color': var(--el-color-primary)
|
||||
),
|
||||
$messagebox: (
|
||||
'border-radius': '12px'
|
||||
),
|
||||
$popover: (
|
||||
'padding': '14px',
|
||||
'border-radius': '10px'
|
||||
)
|
||||
);
|
||||
@@ -0,0 +1,524 @@
|
||||
// 优化 Element Plus 组件库默认样式
|
||||
|
||||
:root {
|
||||
// 系统主色
|
||||
--main-color: var(--el-color-primary);
|
||||
--el-color-white: white !important;
|
||||
--el-color-black: white !important;
|
||||
// 输入框边框颜色
|
||||
// --el-border-color: #E4E4E7 !important; // DCDFE6
|
||||
// 按钮粗度
|
||||
--el-font-weight-primary: 400 !important;
|
||||
|
||||
--el-component-custom-height: 36px !important;
|
||||
|
||||
--el-component-size: var(--el-component-custom-height) !important;
|
||||
|
||||
// 边框、按钮圆角...
|
||||
--el-border-radius-base: calc(var(--custom-radius) / 3 + 2px) !important;
|
||||
|
||||
--el-border-radius-small: calc(var(--custom-radius) / 3 + 4px) !important;
|
||||
--el-messagebox-border-radius: calc(var(--custom-radius) / 3 + 4px) !important;
|
||||
--el-popover-border-radius: calc(var(--custom-radius) / 3 + 4px) !important;
|
||||
|
||||
.region .el-radio-button__original-radio:checked + .el-radio-button__inner {
|
||||
color: var(--theme-color);
|
||||
}
|
||||
}
|
||||
|
||||
// 优化 el-form-item 标签高度
|
||||
.el-form-item__label {
|
||||
height: var(--el-component-custom-height) !important;
|
||||
line-height: var(--el-component-custom-height) !important;
|
||||
}
|
||||
|
||||
// 日期选择器
|
||||
.el-date-range-picker {
|
||||
--el-datepicker-inrange-bg-color: var(--art-gray-200) !important;
|
||||
}
|
||||
|
||||
// el-card 背景色跟系统背景色保持一致
|
||||
html.dark .el-card {
|
||||
--el-card-bg-color: var(--default-box-color) !important;
|
||||
}
|
||||
|
||||
// 修改 el-pagination 大小
|
||||
.el-pagination--default {
|
||||
& {
|
||||
--el-pagination-button-width: 32px !important;
|
||||
--el-pagination-button-height: var(--el-pagination-button-width) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1180px) {
|
||||
& {
|
||||
--el-pagination-button-width: 28px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select--default .el-select__wrapper {
|
||||
min-height: var(--el-pagination-button-width) !important;
|
||||
}
|
||||
|
||||
.el-pagination__jump .el-input {
|
||||
height: var(--el-pagination-button-width) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-pager li {
|
||||
padding: 0 10px !important;
|
||||
// border: 1px solid red !important;
|
||||
}
|
||||
|
||||
// 优化菜单折叠展开动画(提升动画流畅度)
|
||||
.el-menu.el-menu--inline {
|
||||
transition: max-height 0.26s cubic-bezier(0.4, 0, 0.2, 1) !important;
|
||||
}
|
||||
|
||||
// 优化菜单 item hover 动画(提升鼠标跟手感)
|
||||
.el-sub-menu__title,
|
||||
.el-menu-item {
|
||||
transition: background-color 0s !important;
|
||||
}
|
||||
|
||||
// -------------------------------- 修改 el-size=default 组件默认高度 start --------------------------------
|
||||
// 修改 el-button 高度
|
||||
.el-button--default {
|
||||
height: var(--el-component-custom-height) !important;
|
||||
}
|
||||
|
||||
// circle 按钮宽度优化
|
||||
.el-button--default.is-circle {
|
||||
width: var(--el-component-custom-height) !important;
|
||||
}
|
||||
|
||||
// 修改 el-select 高度
|
||||
.el-select--default {
|
||||
.el-select__wrapper {
|
||||
min-height: var(--el-component-custom-height) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 修改 el-checkbox-button 高度
|
||||
.el-checkbox-button--default .el-checkbox-button__inner,
|
||||
// 修改 el-radio-button 高度
|
||||
.el-radio-button--default .el-radio-button__inner {
|
||||
padding: 10px 15px !important;
|
||||
}
|
||||
// -------------------------------- 修改 el-size=default 组件默认高度 end --------------------------------
|
||||
|
||||
.el-pagination.is-background .btn-next,
|
||||
.el-pagination.is-background .btn-prev,
|
||||
.el-pagination.is-background .el-pager li {
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
min-width: 80px;
|
||||
border-radius: var(--el-border-radius-small) !important;
|
||||
}
|
||||
|
||||
.el-dialog {
|
||||
border-radius: 100px !important;
|
||||
border-radius: calc(var(--custom-radius) / 1.2 + 2px) !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
.el-dialog__title {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 25px 0;
|
||||
position: relative; // 为了兼容 el-pagination 样式,需要设置 relative,不然会影响 el-pagination 的样式,比如 el-pagination__jump--small 会被影响,导致 el-pagination__jump--small 按钮无法点击,详见 URL_ADDRESS.com/element-plus/element-plus/issues/5684#issuecomment-1176299275;
|
||||
}
|
||||
|
||||
.el-dialog.el-dialog-border {
|
||||
.el-dialog__body {
|
||||
// 上边框
|
||||
&::before,
|
||||
// 下边框
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -16px;
|
||||
width: calc(100% + 32px);
|
||||
height: 1px;
|
||||
background-color: var(--art-gray-300);
|
||||
}
|
||||
|
||||
&::before {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&::after {
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// el-message 样式优化
|
||||
.el-message {
|
||||
background-color: var(--default-box-color) !important;
|
||||
border: 0 !important;
|
||||
box-shadow:
|
||||
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
||||
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
||||
0 9px 28px 8px rgba(0, 0, 0, 0.05) !important;
|
||||
|
||||
p {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
// 修改 el-dropdown 样式
|
||||
.el-dropdown-menu {
|
||||
padding: 6px !important;
|
||||
border-radius: 10px !important;
|
||||
border: none !important;
|
||||
|
||||
.el-dropdown-menu__item {
|
||||
padding: 6px 16px !important;
|
||||
border-radius: 6px !important;
|
||||
|
||||
&:hover:not(.is-disabled) {
|
||||
color: var(--art-gray-900) !important;
|
||||
background-color: var(--art-el-active-color) !important;
|
||||
}
|
||||
|
||||
&:focus:not(.is-disabled) {
|
||||
color: var(--art-gray-900) !important;
|
||||
background-color: var(--art-gray-200) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏 select、dropdown 的三角
|
||||
.el-select__popper,
|
||||
.el-dropdown__popper {
|
||||
margin-top: -6px !important;
|
||||
|
||||
.el-popper__arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-dropdown-selfdefine:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
// 处理移动端组件兼容性
|
||||
@media screen and (max-width: 640px) {
|
||||
.el-message-box,
|
||||
.el-message,
|
||||
.el-dialog {
|
||||
width: calc(100% - 24px) !important;
|
||||
}
|
||||
|
||||
.el-date-picker.has-sidebar.has-time {
|
||||
width: calc(100% - 24px);
|
||||
left: 12px !important;
|
||||
}
|
||||
|
||||
.el-picker-panel *[slot='sidebar'],
|
||||
.el-picker-panel__sidebar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.el-picker-panel *[slot='sidebar'] + .el-picker-panel__body,
|
||||
.el-picker-panel__sidebar + .el-picker-panel__body {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 修改el-button样式
|
||||
.el-button {
|
||||
&.el-button--text {
|
||||
background-color: transparent !important;
|
||||
padding: 0 !important;
|
||||
|
||||
span {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 修改el-tag样式
|
||||
.el-tag {
|
||||
font-weight: 500;
|
||||
transition: all 0s !important;
|
||||
|
||||
&.el-tag--default {
|
||||
height: 26px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-checkbox-group {
|
||||
&.el-table-filter__checkbox-group label.el-checkbox {
|
||||
height: 17px !important;
|
||||
|
||||
.el-checkbox__label {
|
||||
font-weight: 400 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-radio--default {
|
||||
// 优化单选按钮大小
|
||||
.el-radio__input {
|
||||
.el-radio__inner {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-checkbox {
|
||||
.el-checkbox__inner {
|
||||
border-radius: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 优化复选框样式
|
||||
.el-checkbox--default {
|
||||
.el-checkbox__inner {
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
border-radius: 4px !important;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
height: 4px !important;
|
||||
top: 5px !important;
|
||||
background-color: #fff !important;
|
||||
transform: scale(0.6) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.is-checked {
|
||||
.el-checkbox__inner {
|
||||
&::after {
|
||||
width: 3px;
|
||||
height: 8px;
|
||||
margin: auto;
|
||||
border: 2px solid var(--el-checkbox-checked-icon-color);
|
||||
border-left: 0;
|
||||
border-top: 0;
|
||||
transform: translate(-45%, -60%) rotate(45deg) scale(0.86) !important;
|
||||
transform-origin: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-notification .el-notification__icon {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
|
||||
// 修改 el-message-box 样式
|
||||
.el-message-box__headerbtn .el-message-box__close,
|
||||
.el-dialog__headerbtn .el-dialog__close {
|
||||
top: 7px;
|
||||
right: 7px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 5px;
|
||||
transition: all 0.3s;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--art-hover-color) !important;
|
||||
color: var(--art-gray-900) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-message-box {
|
||||
padding: 25px 20px !important;
|
||||
}
|
||||
|
||||
.el-message-box__title {
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.el-table__column-filter-trigger i {
|
||||
color: var(--theme-color) !important;
|
||||
margin: -3px 0 0 2px;
|
||||
}
|
||||
|
||||
// 去除 el-dropdown 鼠标放上去出现的边框
|
||||
.el-tooltip__trigger:focus-visible {
|
||||
outline: unset;
|
||||
}
|
||||
|
||||
// ipad 表单右侧按钮优化
|
||||
@media screen and (max-width: 1180px) {
|
||||
.el-table-fixed-column--right {
|
||||
padding-right: 0 !important;
|
||||
|
||||
.el-button {
|
||||
margin: 5px 10px 5px 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-out-dialog {
|
||||
padding: 30px 20px !important;
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
|
||||
// 修改 dialog 动画
|
||||
.dialog-fade-enter-active {
|
||||
.el-dialog:not(.is-draggable) {
|
||||
animation: dialog-open 0.3s cubic-bezier(0.32, 0.14, 0.15, 0.86);
|
||||
|
||||
// 修复 el-dialog 动画后宽度不自适应问题
|
||||
.el-select__selected-item {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-fade-leave-active {
|
||||
animation: fade-out 0.2s linear;
|
||||
|
||||
.el-dialog:not(.is-draggable) {
|
||||
animation: dialog-close 0.5s;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dialog-open {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0.2);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes dialog-close {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale(0.2);
|
||||
}
|
||||
}
|
||||
|
||||
// 遮罩层动画
|
||||
@keyframes fade-out {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// 修改 el-select 样式
|
||||
.el-select__popper:not(.el-tree-select__popper) {
|
||||
.el-select-dropdown__list {
|
||||
padding: 5px !important;
|
||||
|
||||
.el-select-dropdown__item {
|
||||
height: 34px !important;
|
||||
line-height: 34px !important;
|
||||
border-radius: 6px !important;
|
||||
|
||||
&.is-selected {
|
||||
color: var(--art-gray-900) !important;
|
||||
font-weight: 400 !important;
|
||||
background-color: var(--art-el-active-color) !important;
|
||||
margin-bottom: 4px !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--art-hover-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select-dropdown__item:hover ~ .is-selected,
|
||||
.el-select-dropdown__item.is-selected:has(~ .el-select-dropdown__item:hover) {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 修改 el-tree-select 样式
|
||||
.el-tree-select__popper {
|
||||
.el-select-dropdown__list {
|
||||
padding: 5px !important;
|
||||
|
||||
.el-tree-node {
|
||||
.el-tree-node__content {
|
||||
height: 36px !important;
|
||||
border-radius: 6px !important;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--art-gray-200) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 实现水波纹在文字下面效果
|
||||
.el-button > span {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
// 优化颜色选择器圆角
|
||||
.el-color-picker__color {
|
||||
border-radius: 2px !important;
|
||||
}
|
||||
|
||||
// 优化日期时间选择器底部圆角
|
||||
.el-picker-panel {
|
||||
.el-picker-panel__footer {
|
||||
border-radius: 0 0 var(--el-border-radius-base) var(--el-border-radius-base);
|
||||
}
|
||||
}
|
||||
|
||||
// 优化树型菜单样式
|
||||
.el-tree-node__content {
|
||||
border-radius: 4px;
|
||||
margin-bottom: 4px;
|
||||
padding: 1px 0;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--art-hover-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.dark {
|
||||
.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
|
||||
background-color: var(--art-gray-300) !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏折叠菜单弹窗 hover 出现的边框
|
||||
.menu-left-popper:focus-within,
|
||||
.horizontal-menu-popper:focus-within {
|
||||
box-shadow: none !important;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
// 数字输入组件右侧按钮高度跟随自定义组件高度
|
||||
.el-input-number--default.is-controls-right {
|
||||
.el-input-number__decrease,
|
||||
.el-input-number__increase {
|
||||
height: calc((var(--el-component-size) / 2)) !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,157 @@
|
||||
// sass 混合宏(函数)
|
||||
|
||||
/**
|
||||
* 溢出省略号
|
||||
* @param {Number} 行数
|
||||
*/
|
||||
@mixin ellipsis($rowCount: 1) {
|
||||
@if $rowCount <=1 {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
} @else {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: $rowCount;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 控制用户能否选中文本
|
||||
* @param {String} 类型
|
||||
*/
|
||||
@mixin userSelect($value: none) {
|
||||
user-select: $value;
|
||||
-moz-user-select: $value;
|
||||
-ms-user-select: $value;
|
||||
-webkit-user-select: $value;
|
||||
}
|
||||
|
||||
// 绝对定位居中
|
||||
@mixin absoluteCenter() {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* css3动画
|
||||
*
|
||||
*/
|
||||
@mixin animation(
|
||||
$from: (
|
||||
width: 0px
|
||||
),
|
||||
$to: (
|
||||
width: 100px
|
||||
),
|
||||
$name: mymove,
|
||||
$animate: mymove 2s 1 linear infinite
|
||||
) {
|
||||
-webkit-animation: $animate;
|
||||
-o-animation: $animate;
|
||||
animation: $animate;
|
||||
|
||||
@keyframes #{$name} {
|
||||
from {
|
||||
@each $key, $value in $from {
|
||||
#{$key}: #{$value};
|
||||
}
|
||||
}
|
||||
|
||||
to {
|
||||
@each $key, $value in $to {
|
||||
#{$key}: #{$value};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes #{$name} {
|
||||
from {
|
||||
@each $key, $value in $from {
|
||||
$key: $value;
|
||||
}
|
||||
}
|
||||
|
||||
to {
|
||||
@each $key, $value in $to {
|
||||
$key: $value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 圆形盒子
|
||||
@mixin circle($size: 11px, $bg: #fff) {
|
||||
border-radius: 50%;
|
||||
width: $size;
|
||||
height: $size;
|
||||
line-height: $size;
|
||||
text-align: center;
|
||||
background: $bg;
|
||||
}
|
||||
|
||||
// placeholder
|
||||
@mixin placeholder($color: #bbb) {
|
||||
// Firefox
|
||||
&::-moz-placeholder {
|
||||
color: $color;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
// Internet Explorer 10+
|
||||
&:-ms-input-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
// Safari and Chrome
|
||||
&::-webkit-input-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
&:placeholder-shown {
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
//背景透明,文字不透明。兼容IE8
|
||||
@mixin betterTransparentize($color, $alpha) {
|
||||
$c: rgba($color, $alpha);
|
||||
$ie_c: ie_hex_str($c);
|
||||
background: rgba($color, 1);
|
||||
background: $c;
|
||||
background: transparent \9;
|
||||
zoom: 1;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie_c}, endColorstr=#{$ie_c});
|
||||
-ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr=#{$ie_c}, endColorstr=#{$ie_c})';
|
||||
}
|
||||
|
||||
//添加浏览器前缀
|
||||
@mixin browserPrefix($propertyName, $value) {
|
||||
@each $prefix in -webkit-, -moz-, -ms-, -o-, '' {
|
||||
#{$prefix}#{$propertyName}: $value;
|
||||
}
|
||||
}
|
||||
|
||||
// 边框
|
||||
@mixin border($color: red) {
|
||||
border: 1px solid $color;
|
||||
}
|
||||
|
||||
// 背景滤镜
|
||||
@mixin backdropBlur() {
|
||||
--tw-backdrop-blur: blur(30px);
|
||||
-webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
|
||||
var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
|
||||
var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
|
||||
var(--tw-backdrop-sepia);
|
||||
backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
|
||||
var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
|
||||
var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*滚动条*/
|
||||
/*滚动条整体部分,必须要设置*/
|
||||
::-webkit-scrollbar {
|
||||
width: 8px !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
|
||||
/*滚动条的轨道*/
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: var(--art-gray-200);
|
||||
}
|
||||
|
||||
/*滚动条的滑块按钮*/
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 5px;
|
||||
background-color: #cccccc !important;
|
||||
transition: all 0.2s;
|
||||
-webkit-transition: all 0.2s;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #b0abab !important;
|
||||
}
|
||||
|
||||
/*滚动条的上下两端的按钮*/
|
||||
::-webkit-scrollbar-button {
|
||||
height: 0px;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.dark {
|
||||
::-webkit-scrollbar-track {
|
||||
background-color: var(--default-bg-color);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: var(--art-gray-300) !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,104 @@
|
||||
@use 'sass:map';
|
||||
|
||||
// === 变量区域 ===
|
||||
$transition: (
|
||||
// 动画持续时间
|
||||
duration: 0.25s,
|
||||
// 滑动动画的移动距离
|
||||
distance: 15px,
|
||||
// 默认缓动函数
|
||||
easing: cubic-bezier(0.25, 0.1, 0.25, 1),
|
||||
// 淡入淡出专用的缓动函数
|
||||
fade-easing: cubic-bezier(0.4, 0, 0.6, 1)
|
||||
);
|
||||
|
||||
// 抽取配置值函数,提高可复用性
|
||||
@function transition-config($key) {
|
||||
@return map.get($transition, $key);
|
||||
}
|
||||
|
||||
// 变量简写
|
||||
$duration: transition-config('duration');
|
||||
$distance: transition-config('distance');
|
||||
$easing: transition-config('easing');
|
||||
$fade-easing: transition-config('fade-easing');
|
||||
|
||||
// === 动画类 ===
|
||||
|
||||
// 淡入淡出动画
|
||||
.fade {
|
||||
&-enter-active,
|
||||
&-leave-active {
|
||||
transition: opacity $duration $fade-easing;
|
||||
will-change: opacity;
|
||||
}
|
||||
|
||||
&-enter-from,
|
||||
&-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&-enter-to,
|
||||
&-leave-from {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// 滑动动画通用样式
|
||||
@mixin slide-transition($direction) {
|
||||
$distance-x: 0;
|
||||
$distance-y: 0;
|
||||
|
||||
@if $direction == 'left' {
|
||||
$distance-x: -$distance;
|
||||
} @else if $direction == 'right' {
|
||||
$distance-x: $distance;
|
||||
} @else if $direction == 'top' {
|
||||
$distance-y: -$distance;
|
||||
} @else if $direction == 'bottom' {
|
||||
$distance-y: $distance;
|
||||
}
|
||||
|
||||
&-enter-active {
|
||||
transition:
|
||||
opacity $duration $easing,
|
||||
transform $duration $easing;
|
||||
will-change: opacity, transform;
|
||||
}
|
||||
|
||||
&-leave-active {
|
||||
transition:
|
||||
opacity calc($duration * 0.7) $easing,
|
||||
transform calc($duration * 0.7) $easing;
|
||||
will-change: opacity, transform;
|
||||
}
|
||||
|
||||
&-enter-from {
|
||||
opacity: 0;
|
||||
transform: translate3d($distance-x, $distance-y, 0);
|
||||
}
|
||||
|
||||
&-enter-to {
|
||||
opacity: 1;
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
&-leave-to {
|
||||
opacity: 0;
|
||||
transform: translate3d(-$distance-x, -$distance-y, 0);
|
||||
}
|
||||
}
|
||||
|
||||
// 滑动动画方向类
|
||||
.slide-left {
|
||||
@include slide-transition('left');
|
||||
}
|
||||
.slide-right {
|
||||
@include slide-transition('right');
|
||||
}
|
||||
.slide-top {
|
||||
@include slide-transition('top');
|
||||
}
|
||||
.slide-bottom {
|
||||
@include slide-transition('bottom');
|
||||
}
|
||||
@@ -0,0 +1,208 @@
|
||||
@import 'tailwindcss';
|
||||
@custom-variant dark (&:where(.dark, .dark *));
|
||||
|
||||
/* ==================== Light Mode Variables ==================== */
|
||||
:root {
|
||||
/* Base Colors */
|
||||
--art-color: #ffffff;
|
||||
--theme-color: var(--main-color);
|
||||
|
||||
/* Theme Colors - OKLCH Format */
|
||||
--art-primary: oklch(0.7 0.23 260);
|
||||
--art-secondary: oklch(0.72 0.19 231.6);
|
||||
--art-error: oklch(0.73 0.15 25.3);
|
||||
--art-info: oklch(0.58 0.03 254.1);
|
||||
--art-success: oklch(0.78 0.17 166.1);
|
||||
--art-warning: oklch(0.78 0.14 75.5);
|
||||
--art-danger: oklch(0.68 0.22 25.3);
|
||||
|
||||
/* Gray Scale - Light Mode */
|
||||
--art-gray-100: #f9fafb;
|
||||
--art-gray-200: #f2f4f5;
|
||||
--art-gray-300: #e6eaeb;
|
||||
--art-gray-400: #dbdfe1;
|
||||
--art-gray-500: #949eb7;
|
||||
--art-gray-600: #7987a1;
|
||||
--art-gray-700: #4d5875;
|
||||
--art-gray-800: #383853;
|
||||
--art-gray-900: #323251;
|
||||
|
||||
/* Border Colors */
|
||||
--art-card-border: rgba(0, 0, 0, 0.08);
|
||||
|
||||
--default-border: #e2e8ee;
|
||||
--default-border-dashed: #dbdfe9;
|
||||
|
||||
/* Background Colors */
|
||||
--default-bg-color: #fafbfc;
|
||||
--default-box-color: #ffffff;
|
||||
|
||||
/* Hover Color */
|
||||
--art-hover-color: #edeff0;
|
||||
|
||||
/* Active Color */
|
||||
--art-active-color: #f2f4f5;
|
||||
|
||||
/* Element Component Active Color */
|
||||
--art-el-active-color: #f2f4f5;
|
||||
}
|
||||
|
||||
/* ==================== Dark Mode Variables ==================== */
|
||||
.dark {
|
||||
/* Base Colors */
|
||||
--art-color: #000000;
|
||||
|
||||
/* Gray Scale - Dark Mode */
|
||||
--art-gray-100: #110f0f;
|
||||
--art-gray-200: #17171c;
|
||||
--art-gray-300: #393946;
|
||||
--art-gray-400: #505062;
|
||||
--art-gray-500: #73738c;
|
||||
--art-gray-600: #8f8fa3;
|
||||
--art-gray-700: #ababba;
|
||||
--art-gray-800: #c7c7d1;
|
||||
--art-gray-900: #e3e3e8;
|
||||
|
||||
/* Border Colors */
|
||||
--art-card-border: rgba(255, 255, 255, 0.08);
|
||||
|
||||
--default-border: rgba(255, 255, 255, 0.1);
|
||||
--default-border-dashed: #363843;
|
||||
|
||||
/* Background Colors */
|
||||
--default-bg-color: #070707;
|
||||
--default-box-color: #161618;
|
||||
|
||||
/* Hover Color */
|
||||
--art-hover-color: #252530;
|
||||
|
||||
/* Active Color */
|
||||
--art-active-color: #202226;
|
||||
|
||||
/* Element Component Active Color */
|
||||
--art-el-active-color: #2e2e38;
|
||||
}
|
||||
|
||||
/* ==================== Tailwind Theme Configuration ==================== */
|
||||
@theme {
|
||||
/* Box Color (Light: white / Dark: black) */
|
||||
--color-box: var(--default-box-color);
|
||||
|
||||
/* System Theme Color */
|
||||
--color-theme: var(--theme-color);
|
||||
|
||||
/* Hover Color */
|
||||
--color-hover-color: var(--art-hover-color);
|
||||
|
||||
/* Active Color */
|
||||
--color-active-color: var(--art-active-color);
|
||||
|
||||
/* Active Color */
|
||||
--color-el-active-color: var(--art-active-color);
|
||||
|
||||
/* ElementPlus Theme Colors */
|
||||
--color-primary: var(--art-primary);
|
||||
--color-secondary: var(--art-secondary);
|
||||
--color-error: var(--art-error);
|
||||
--color-info: var(--art-info);
|
||||
--color-success: var(--art-success);
|
||||
--color-warning: var(--art-warning);
|
||||
--color-danger: var(--art-danger);
|
||||
|
||||
/* Gray Scale Colors (Auto-adapts to dark mode) */
|
||||
--color-g-100: var(--art-gray-100);
|
||||
--color-g-200: var(--art-gray-200);
|
||||
--color-g-300: var(--art-gray-300);
|
||||
--color-g-400: var(--art-gray-400);
|
||||
--color-g-500: var(--art-gray-500);
|
||||
--color-g-600: var(--art-gray-600);
|
||||
--color-g-700: var(--art-gray-700);
|
||||
--color-g-800: var(--art-gray-800);
|
||||
--color-g-900: var(--art-gray-900);
|
||||
}
|
||||
|
||||
/* ==================== Custom Border Radius Utilities ==================== */
|
||||
@utility rounded-custom-xs {
|
||||
border-radius: calc(var(--custom-radius) / 2);
|
||||
}
|
||||
|
||||
@utility rounded-custom-sm {
|
||||
border-radius: calc(var(--custom-radius) / 2 + 2px);
|
||||
}
|
||||
|
||||
/* ==================== Custom Utility Classes ==================== */
|
||||
@layer utilities {
|
||||
/* Flexbox Layout Utilities */
|
||||
.flex-c {
|
||||
@apply flex items-center;
|
||||
}
|
||||
|
||||
.flex-b {
|
||||
@apply flex justify-between;
|
||||
}
|
||||
|
||||
.flex-cc {
|
||||
@apply flex items-center justify-center;
|
||||
}
|
||||
|
||||
.flex-cb {
|
||||
@apply flex items-center justify-between;
|
||||
}
|
||||
|
||||
/* Transition Utilities */
|
||||
.tad-200 {
|
||||
@apply transition-all duration-200;
|
||||
}
|
||||
|
||||
.tad-300 {
|
||||
@apply transition-all duration-300;
|
||||
}
|
||||
|
||||
/* Border Utilities */
|
||||
.border-full-d {
|
||||
@apply border border-[var(--default-border)];
|
||||
}
|
||||
|
||||
.border-b-d {
|
||||
@apply border-b border-[var(--default-border)];
|
||||
}
|
||||
|
||||
.border-t-d {
|
||||
@apply border-t border-[var(--default-border)];
|
||||
}
|
||||
|
||||
.border-l-d {
|
||||
@apply border-l border-[var(--default-border)];
|
||||
}
|
||||
|
||||
.border-r-d {
|
||||
@apply border-r border-[var(--default-border)];
|
||||
}
|
||||
|
||||
/* Cursor Utilities */
|
||||
.c-p {
|
||||
@apply cursor-pointer;
|
||||
}
|
||||
}
|
||||
|
||||
/* ==================== Custom Component Classes ==================== */
|
||||
@layer components {
|
||||
/* Art Card Header Component */
|
||||
.art-card-header {
|
||||
@apply flex justify-between pr-6 pb-1;
|
||||
|
||||
.title {
|
||||
h4 {
|
||||
@apply text-lg font-medium text-g-900;
|
||||
}
|
||||
|
||||
p {
|
||||
@apply mt-1 text-sm text-g-600;
|
||||
|
||||
span {
|
||||
@apply ml-2 font-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,63 @@
|
||||
// 定义基础变量
|
||||
$bg-animation-color-light: #000;
|
||||
$bg-animation-color-dark: #fff;
|
||||
$bg-animation-duration: 0.5s;
|
||||
|
||||
html {
|
||||
--bg-animation-color: $bg-animation-color-light;
|
||||
|
||||
&.dark {
|
||||
--bg-animation-color: $bg-animation-color-dark;
|
||||
}
|
||||
|
||||
// View transition styles
|
||||
&::view-transition-old(*) {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
&::view-transition-new(*) {
|
||||
animation: clip $bg-animation-duration ease-in both;
|
||||
}
|
||||
|
||||
&::view-transition-old(root) {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&::view-transition-new(root) {
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
&.dark {
|
||||
&::view-transition-old(*) {
|
||||
animation: clip $bg-animation-duration ease-in reverse both;
|
||||
}
|
||||
|
||||
&::view-transition-new(*) {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
&::view-transition-old(root) {
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
&::view-transition-new(root) {
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 定义动画
|
||||
@keyframes clip {
|
||||
from {
|
||||
clip-path: circle(0% at var(--x) var(--y));
|
||||
}
|
||||
|
||||
to {
|
||||
clip-path: circle(var(--r) at var(--x) var(--y));
|
||||
}
|
||||
}
|
||||
|
||||
// body 相关样式
|
||||
body {
|
||||
background-color: var(--bg-animation-color);
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
// 主题切换过渡优化,优化除视觉上的不适感
|
||||
.theme-change {
|
||||
* {
|
||||
transition: 0s !important;
|
||||
}
|
||||
|
||||
.el-switch__core,
|
||||
.el-switch__action {
|
||||
transition: all 0.3s !important;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
.hljs {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
padding: 0.5em;
|
||||
|
||||
color: #a6accd;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-section,
|
||||
.hljs-selector-class,
|
||||
.hljs-template-variable,
|
||||
.hljs-deletion {
|
||||
color: #aed07e !important;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-quote {
|
||||
color: #6f747d;
|
||||
}
|
||||
|
||||
.hljs-doctag,
|
||||
.hljs-keyword,
|
||||
.hljs-formula {
|
||||
color: #c792ea;
|
||||
}
|
||||
|
||||
.hljs-section,
|
||||
.hljs-name,
|
||||
.hljs-selector-tag,
|
||||
.hljs-deletion,
|
||||
.hljs-subst {
|
||||
color: #c86068;
|
||||
}
|
||||
|
||||
.hljs-literal {
|
||||
color: #56b6c2;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-regexp,
|
||||
.hljs-addition,
|
||||
.hljs-attribute,
|
||||
.hljs-meta-string {
|
||||
color: #abb2bf;
|
||||
}
|
||||
|
||||
.hljs-attribute {
|
||||
color: #c792ea;
|
||||
}
|
||||
|
||||
.hljs-function {
|
||||
color: #c792ea;
|
||||
}
|
||||
|
||||
.hljs-type {
|
||||
color: #f07178;
|
||||
}
|
||||
|
||||
.hljs-title {
|
||||
color: #82aaff !important;
|
||||
}
|
||||
|
||||
.hljs-built_in,
|
||||
.hljs-class {
|
||||
color: #82aaff;
|
||||
}
|
||||
|
||||
// 括号
|
||||
.hljs-params {
|
||||
color: #a6accd;
|
||||
}
|
||||
|
||||
.hljs-attr,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-pseudo,
|
||||
.hljs-number {
|
||||
color: #de7e61;
|
||||
}
|
||||
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-link,
|
||||
.hljs-meta,
|
||||
.hljs-selector-id {
|
||||
color: #61aeee;
|
||||
}
|
||||
|
||||
.hljs-strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
// 重置默认样式
|
||||
@use './core/reset.scss';
|
||||
|
||||
// 应用全局样式
|
||||
@use './core/app.scss';
|
||||
|
||||
// Element Plus 样式优化
|
||||
@use './core/el-ui.scss';
|
||||
|
||||
// Element Plus 暗黑主题
|
||||
@use './core/el-dark.scss';
|
||||
|
||||
// 暗黑主题样式优化
|
||||
@use './core/dark.scss';
|
||||
|
||||
// 路由切换动画
|
||||
@use './core/router-transition';
|
||||
|
||||
// 主题切换过渡优化
|
||||
@use './core/theme-change.scss';
|
||||
|
||||
// 主题切换圆形扩散动画
|
||||
@use './core/theme-animation.scss';
|
||||
@@ -0,0 +1,32 @@
|
||||
// 自定义四点旋转SVG
|
||||
export const fourDotsSpinnerSvg = `
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
|
||||
<style>
|
||||
.spinner {
|
||||
transform-origin: 20px 20px;
|
||||
animation: rotate 1.6s linear infinite;
|
||||
}
|
||||
.dot {
|
||||
fill: var(--theme-color);
|
||||
animation: fade 1.6s infinite;
|
||||
}
|
||||
.dot:nth-child(1) { animation-delay: 0s; }
|
||||
.dot:nth-child(2) { animation-delay: 0.5s; }
|
||||
.dot:nth-child(3) { animation-delay: 1s; }
|
||||
.dot:nth-child(4) { animation-delay: 1.5s; }
|
||||
@keyframes rotate {
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
@keyframes fade {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.5; }
|
||||
}
|
||||
</style>
|
||||
<g class="spinner">
|
||||
<circle class="dot" cx="20" cy="8" r="4"/>
|
||||
<circle class="dot" cx="32" cy="20" r="4"/>
|
||||
<circle class="dot" cx="20" cy="32" r="4"/>
|
||||
<circle class="dot" cx="8" cy="20" r="4"/>
|
||||
</g>
|
||||
</svg>
|
||||
`
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"playground": {
|
||||
"title": "Demo Playground"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"playground": {
|
||||
"title": "示例模块"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,193 @@
|
||||
import cover1 from '@/apps/demo/assets/images/cover/img1.webp'
|
||||
import cover2 from '@/apps/demo/assets/images/cover/img2.webp'
|
||||
import cover3 from '@/apps/demo/assets/images/cover/img3.webp'
|
||||
import cover4 from '@/apps/demo/assets/images/cover/img4.webp'
|
||||
import cover5 from '@/apps/demo/assets/images/cover/img5.webp'
|
||||
import cover6 from '@/apps/demo/assets/images/cover/img6.webp'
|
||||
import cover7 from '@/apps/demo/assets/images/cover/img7.webp'
|
||||
import cover8 from '@/apps/demo/assets/images/cover/img8.webp'
|
||||
import cover9 from '@/apps/demo/assets/images/cover/img9.webp'
|
||||
import cover10 from '@/apps/demo/assets/images/cover/img10.webp'
|
||||
|
||||
export const ArticleList = [
|
||||
{
|
||||
id: 452,
|
||||
blog_class: '42',
|
||||
title: 'Node.js + Docker自动化部署',
|
||||
count: 56,
|
||||
create_time: '2024-08-26T00:00:00.000Z',
|
||||
home_img: cover1,
|
||||
brief:
|
||||
'本章将介绍 Node.js 使用 Docker 、Webhook 自动化部署、蓝绿部署、项目到服务器。1、Mac os 安装 Docker 客户端 OrbStack我这里使用的是第三方客户端,相比于官方的,较轻量,启动速度快OrbStack 是一种快速、轻便且简单的运行 Docker 容器和 Linux 的方法。使用我们的 Docker Desktop 替代方案以光速进行开发。下载地址: http',
|
||||
type_name: 'Node.js',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 451,
|
||||
blog_class: '36',
|
||||
title: 'HTTP 协议',
|
||||
count: 109,
|
||||
create_time: '2024-02-22T00:00:00.000Z',
|
||||
home_img: cover2,
|
||||
brief:
|
||||
'概念HTTP(hypertext transport protocol)协议;中文叫超文本传输协议是一种基于TCP/IP的应用层通信协议这个协议详细规定了 浏览器 和万维网 服务器 之间互相通信的规则。协议中主要规定了两个方面的内容客户端:用来向服务器发送数据,可以被称之为请求报文服务端:向客户端返回数据,可以被称之为响应报文报文:可以简单理解为就是一堆字符串请求报文的组成请求行请求头空行请求体H',
|
||||
type_name: '浏览器',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 450,
|
||||
blog_class: '40',
|
||||
title: 'MongoDB 数据库基本操作',
|
||||
count: 66,
|
||||
create_time: '2023-11-30T00:00:00.000Z',
|
||||
home_img: cover3,
|
||||
brief:
|
||||
'简介Mongodb 是什么MongoDB 是一个基于分布式文件存储的数据库,官方地址 https://www.mongodb.com/ 数据库是什么数据库(DataBase)是按照数据结构来组织、存储和管理数据的 应用程序数据库的作用数据库的主要作用就是 管理数据 ,对数据进行 增(c)、删(d)、改(u)、查(r)数据库管理数据的特点相比于纯文件管理数据,数据库管理数据有如下特点:1. 速度更快',
|
||||
type_name: 'MongoDB',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 449,
|
||||
blog_class: '40',
|
||||
title: 'Mac os 安装 MongoDB',
|
||||
count: 59,
|
||||
create_time: '2023-11-15T00:00:00.000Z',
|
||||
home_img: cover4,
|
||||
brief:
|
||||
'下载MongoDB安装包官网下载地址:https://www.mongodb.com/try/download/community?tck=docs_server安装MongoDB# 将压缩包解压到 /usr/local/目录下\nsudo tar -zxvf mongodb-macos-x86_64-5.0.24.tgz -C /usr/local\n\n# 重命名\nsudo mv mongodb-o',
|
||||
type_name: 'MongoDB',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 448,
|
||||
blog_class: '42',
|
||||
title: 'npm、yarn、nrm 常用命令',
|
||||
count: 91,
|
||||
create_time: '2023-11-07T00:00:00.000Z',
|
||||
home_img: cover5,
|
||||
brief:
|
||||
'设置镜像源#1,淘宝镜像源\nnpm config set registry https://registry.npmmirror.com\nnpm config set registry https://registry.npm.taobao.org\n\n#2,腾讯云镜像源\nnpm config set registry http://mirrors.cloud.tencent.com/npm/\n\n#',
|
||||
type_name: 'Node.js',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 447,
|
||||
blog_class: '42',
|
||||
title: 'Node.js 包管理工具',
|
||||
count: 53,
|
||||
create_time: '2023-10-31T00:00:00.000Z',
|
||||
home_img: cover6,
|
||||
brief:
|
||||
'介绍包是什么『包』英文单词是 package ,代表了一组特定功能的源码集合包管理工具管理『包』的应用软件,可以对「包」进行 下载安装 , 更新 , 删除 , 上传 等操作借助包管理工具,可以快速开发项目,提升开发效率包管理工具是一个通用的概念,很多编程语言都有包管理工具,所以 掌握好包管理工具非常重要常用的包管理工具下面列举了前端常用的包管理工具npmyarncnpmnpmnpm 全称 Node',
|
||||
type_name: 'Node.js',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 446,
|
||||
blog_class: '42',
|
||||
title: 'Node.js 模块化',
|
||||
count: 40,
|
||||
create_time: '2023-10-25T00:00:00.000Z',
|
||||
home_img: cover7,
|
||||
brief:
|
||||
'介绍什么是模块化与模块 ?将一个复杂的程序文件依据一定规则(规范)拆分成多个文件的过程称之为其中拆分出的 每个文件就是一个模块 ,模块的内部数据是私有的,不过模块可以暴露内部数据以便其他模块使用什么是模块化项目 ?编码时是按照模块一个一个编码的, 整个项目就是一个模块化的项目模块化好处下面是模块化的一些好处:1.防止命名冲突2.高复用性3.高维护性模块暴露数据模块初体验可以通过下面的操作步骤,快速',
|
||||
type_name: 'Node.js',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 445,
|
||||
blog_class: '42',
|
||||
title: 'Node.js学习笔记',
|
||||
count: 198,
|
||||
create_time: '2023-10-15T00:00:00.000Z',
|
||||
home_img: cover8,
|
||||
brief:
|
||||
'fs 模块fs 全称为 file system ,称之为 文件系统 ,是 Node.js 中的 内置模块 ,可以对计算机中的磁盘进行操作。例如文件的创建、删除、修改移动,文件内容的写入、读取,以及文件夹的相关操作// 1 ------------------------------------------------------\n/**\n * 需求\n * 新建一个文件,写入内容\n */\n\n// 1',
|
||||
type_name: 'Node.js',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 444,
|
||||
blog_class: '41',
|
||||
title: '最好用的ChatGPT应用',
|
||||
count: 78,
|
||||
create_time: '2023-05-22T00:00:00.000Z',
|
||||
home_img: cover9,
|
||||
brief:
|
||||
'目前为止最好用的ChatGPT网站,支持6种AI模型和每日一次GPT4的使用机会,有网页版和ios应用程序,可以使用邮箱和手机号等方式注册,中国大陆可放心使用(需要科学上网),下面就介绍一下如何使用吧。网站地址:https://poe.com/进去之后可以选择邮箱或手机号等其他方式注册。除了网页版,你还可以到AppStore搜索poe下载ios客户端',
|
||||
type_name: 'GPT',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 443,
|
||||
blog_class: '35',
|
||||
title: 'Nuxt 百度收录 robots 和 sitemap',
|
||||
count: 109,
|
||||
create_time: '2023-04-07T00:00:00.000Z',
|
||||
home_img: cover10,
|
||||
brief:
|
||||
'前言robots 和 sitemap 文件,前者的作用是减少百度蜘蛛在站内的无谓爬取,后者增加百度蜘蛛在站内的有效爬取,对百度收录和自己网站的SEO推广都十分重要。robots只有一个:robot.txt,这是一个文本文件,主要利用Allow(允许)和DisAllow(禁止)两个命令,(这两个重要的是禁止),禁止百度蜘蛛爬取一些无谓的文件和文件夹,增加百度搜录速度。具体原理和写法网上去搜,制作简单',
|
||||
type_name: 'Nuxt',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 442,
|
||||
blog_class: '12',
|
||||
title: 'Vue3+TS+Vite 项目搭建笔记(更新中)',
|
||||
count: 516,
|
||||
create_time: '2023-04-03T00:00:00.000Z',
|
||||
home_img: cover4,
|
||||
brief:
|
||||
'介绍本章会教你在真实项目中如何搭建 VueRouter、Vuex、pinia、axios、主题切换等,你会见证一个后台管理系统的详细搭建过程。效果图:功能:后台管理系统常用模块登录加密多标签页全局面包屑国际化异常处理Utils工具包可配置的菜单栏徽标亮色 / 暗色 侧边栏浅色主题 / 暗黑主题丰富的个性化配置可折叠侧边栏支持内嵌页面重载当前页面动态路由支持自动重载支持多级路由嵌套及菜单栏嵌套分离路',
|
||||
type_name: 'Vue',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 441,
|
||||
blog_class: '9',
|
||||
title: 'CSS 根据系统自动切换主题方案',
|
||||
count: 184,
|
||||
create_time: '2023-04-01T00:00:00.000Z',
|
||||
home_img: cover8,
|
||||
brief:
|
||||
'原理是改变 css 变量 + window.matchMedia 来监听系统主题变,从而实现点击改变主题和监听系统主题变化1、首先定义 css 全局变量创建 variables.scss 文件light color(浅色模式)定义浅色模式下 css 主题变量dark color(深色模式)定义深色模式下 css 主题变量// css全局变量\n:root {\n // 文字大小\n --art-fo',
|
||||
type_name: 'CSS',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 440,
|
||||
blog_class: '36',
|
||||
title: '浏览器-安全',
|
||||
count: 116,
|
||||
create_time: '2023-03-28T00:00:00.000Z',
|
||||
home_img: cover2,
|
||||
brief:
|
||||
'通过这篇文章你可以了解到同源策略、跨站脚本攻击(xss)、跨域请求伪造(CSRF)以及安全沙箱相关知识;以下是本文的思维导图:(手机端可能看不清)获取高清 PDF,请在微信公众号【小狮子前端】回复【浏览器安全】同源策略什么是同源策略如果两个 URL 的协议、域名和端口都相同,我们就称这两个 URL 同源。两个不同的源之间若想要相互访问资源或者操作 DOM,那么会有一套基础的安全策略的制约,我们把这',
|
||||
type_name: '浏览器',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 439,
|
||||
blog_class: '12',
|
||||
title: 'Vue-Router4',
|
||||
count: 135,
|
||||
create_time: '2023-02-08T00:00:00.000Z',
|
||||
home_img: cover3,
|
||||
brief:
|
||||
"路由模式构建 router.tsimport { createRouter, createWebHistory, createWebHashHistory, createMemoryHistory, createRouterMatcher } from 'vue-router'\nimport Home from '../views/home/index.vue'\nimport Login from",
|
||||
type_name: 'Vue',
|
||||
html_content: ''
|
||||
},
|
||||
{
|
||||
id: 438,
|
||||
blog_class: '10',
|
||||
title: 'Event Loop(事件循环)',
|
||||
count: 161,
|
||||
create_time: '2023-01-03T00:00:00.000Z',
|
||||
home_img: cover1,
|
||||
brief:
|
||||
'js是单线程的,一次只能执行一段代码。单线程会导致很多任务需要排队,一个个去执行,如果此时某个任务执行时间太长,就会出现阻塞,为了解决这个问题,js引入了事件循环机制。为什么要区分宏任务和微任务?js是单线程的,但是分同步异步微任务和宏任务皆为异步任务,它们都属于一个队列宏任务:script(整体代码)、setTimeout、setInterval、I/O、UI、 renderingsetImme',
|
||||
type_name: 'JavaScript',
|
||||
html_content: ''
|
||||
}
|
||||
]
|
||||
@@ -0,0 +1,79 @@
|
||||
export interface Comment {
|
||||
id: number
|
||||
author: string
|
||||
content: string
|
||||
timestamp: string
|
||||
replies: Comment[]
|
||||
}
|
||||
|
||||
export const commentList = ref<Comment[]>([
|
||||
{
|
||||
id: 1,
|
||||
author: '白夜',
|
||||
content: '黑神话悟空的打斗场面真的燃爆了!期待上线!',
|
||||
timestamp: '2024-09-04 09:00',
|
||||
replies: [
|
||||
{
|
||||
id: 101,
|
||||
author: '星河',
|
||||
content: '是啊,特别是那些技能特效,简直帅炸!',
|
||||
timestamp: '2024-09-04 09:15',
|
||||
replies: [
|
||||
{
|
||||
id: 201,
|
||||
author: '光芒',
|
||||
content: '希望优化能跟上,不然这么好的画面如果卡顿就可惜了。',
|
||||
timestamp: '2024-09-04 09:30',
|
||||
replies: []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
author: '浮生',
|
||||
content: '据说黑神话悟空需要很高的配置,不知道我的电脑能不能跑起来。',
|
||||
timestamp: '2024-09-04 10:00',
|
||||
replies: [
|
||||
{
|
||||
id: 102,
|
||||
author: '晨曦',
|
||||
content: '同担心啊,听说需要至少RTX 3070才能高效运行。',
|
||||
timestamp: '2024-09-04 10:20',
|
||||
replies: [
|
||||
{
|
||||
id: 202,
|
||||
author: '流光',
|
||||
content: '我是打算升级配置,等这款游戏就是了。',
|
||||
timestamp: '2024-09-04 10:40',
|
||||
replies: []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
author: '风铃',
|
||||
content: '130GB的存储要求有点夸张啊,不过画质这么好,也情有可原。',
|
||||
timestamp: '2024-09-04 11:00',
|
||||
replies: [
|
||||
{
|
||||
id: 103,
|
||||
author: '云端',
|
||||
content: '确实有点高,不过为了这种品质的游戏,值得。',
|
||||
timestamp: '2024-09-04 11:15',
|
||||
replies: [
|
||||
{
|
||||
id: 203,
|
||||
author: '梦境',
|
||||
content: '希望发售后能优化一下安装包体积。',
|
||||
timestamp: '2024-09-04 11:30',
|
||||
replies: []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
])
|
||||
@@ -0,0 +1,242 @@
|
||||
export const commentList = reactive([
|
||||
{
|
||||
id: 1,
|
||||
date: '2024-9-3',
|
||||
content: '发现了一个超级好用的工具,开心',
|
||||
collection: 5,
|
||||
comment: 8,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
date: '2024-9-3',
|
||||
content: '今天的代码写得很顺利!',
|
||||
collection: 3,
|
||||
comment: 2,
|
||||
userName: 'Coder123'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
date: '2024-9-4',
|
||||
content: '遇到个bug,调试了一整天',
|
||||
collection: 7,
|
||||
comment: 10,
|
||||
userName: 'DebugMaster'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
date: '2024-9-4',
|
||||
content: '学Node真的是一件很有趣的事',
|
||||
collection: 9,
|
||||
comment: 4,
|
||||
userName: 'NodeLover'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
date: '2024-9-5',
|
||||
content: '今天的进度有点慢,需要加把劲了',
|
||||
collection: 2,
|
||||
comment: 3,
|
||||
userName: '努力中的小白'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
date: '2024-9-5',
|
||||
content: '太好了,终于解决了一个难题!',
|
||||
collection: 11,
|
||||
comment: 5,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
date: '2024-9-6',
|
||||
content: '学会了新的Node技巧,开心!',
|
||||
collection: 4,
|
||||
comment: 7,
|
||||
userName: '开心每一天'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
date: '2024-9-6',
|
||||
content: '代码优化真的是一个细致活',
|
||||
collection: 6,
|
||||
comment: 4,
|
||||
userName: '精益求精'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
date: '2024-9-7',
|
||||
content: '今天的工作太顺利了,完美!',
|
||||
collection: 10,
|
||||
comment: 9,
|
||||
userName: '完美主义者'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
date: '2024-9-7',
|
||||
content: '需要多练习,才能掌握更多技能',
|
||||
collection: 5,
|
||||
comment: 6,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
date: '2024-9-8',
|
||||
content: '每天进步一点点,终会成功',
|
||||
collection: 8,
|
||||
comment: 7,
|
||||
userName: '逐梦者'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
date: '2024-9-8',
|
||||
content: '与其抱怨,不如努力改变',
|
||||
collection: 12,
|
||||
comment: 10,
|
||||
userName: '改变命运'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
date: '2024-9-9',
|
||||
content: '今天尝试了新的库,感觉不错',
|
||||
collection: 9,
|
||||
comment: 8,
|
||||
userName: '新手尝试'
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
date: '2024-9-9',
|
||||
content: '写代码也需要灵感,今天灵感不错',
|
||||
collection: 6,
|
||||
comment: 5,
|
||||
userName: '灵感源泉'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
date: '2024-9-10',
|
||||
content: '感谢社区的帮助,让我解决了问题',
|
||||
collection: 7,
|
||||
comment: 4,
|
||||
userName: '受益匪浅'
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
date: '2024-9-10',
|
||||
content: '学习的路上要保持耐心和恒心',
|
||||
collection: 3,
|
||||
comment: 2,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 17,
|
||||
date: '2024-9-11',
|
||||
content: '今天学习了异步编程的知识,受益匪浅',
|
||||
collection: 10,
|
||||
comment: 9,
|
||||
userName: '异步学习者'
|
||||
},
|
||||
{
|
||||
id: 18,
|
||||
date: '2024-9-11',
|
||||
content: '今天的代码质量提升了不少',
|
||||
collection: 11,
|
||||
comment: 6,
|
||||
userName: '代码匠人'
|
||||
},
|
||||
{
|
||||
id: 19,
|
||||
date: '2024-9-12',
|
||||
content: '感觉学习编程真的很有成就感',
|
||||
collection: 8,
|
||||
comment: 7,
|
||||
userName: '成就感满满'
|
||||
},
|
||||
{
|
||||
id: 20,
|
||||
date: '2024-9-12',
|
||||
content: '要加倍努力,才能超越昨天的自己',
|
||||
collection: 5,
|
||||
comment: 4,
|
||||
userName: '努力超越'
|
||||
},
|
||||
{
|
||||
id: 21,
|
||||
date: '2024-9-13',
|
||||
content: '今天的代码写得很顺手,继续保持',
|
||||
collection: 9,
|
||||
comment: 8,
|
||||
userName: '顺风顺水'
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
date: '2024-9-13',
|
||||
content: '写代码也需要创意,今天很有创意',
|
||||
collection: 7,
|
||||
comment: 5,
|
||||
userName: '创意无限'
|
||||
},
|
||||
{
|
||||
id: 23,
|
||||
date: '2024-9-14',
|
||||
content: '遇到的难题解决了,感觉很有成就感',
|
||||
collection: 10,
|
||||
comment: 9,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 24,
|
||||
date: '2024-9-14',
|
||||
content: '今天的编程练习很有收获',
|
||||
collection: 8,
|
||||
comment: 7,
|
||||
userName: '收获满满'
|
||||
},
|
||||
{
|
||||
id: 25,
|
||||
date: '2024-9-15',
|
||||
content: '学习编程的路上,有苦有甜',
|
||||
collection: 6,
|
||||
comment: 4,
|
||||
userName: '苦乐编程'
|
||||
},
|
||||
{
|
||||
id: 26,
|
||||
date: '2024-9-15',
|
||||
content: '今天的代码写得特别流畅,开心!',
|
||||
collection: 11,
|
||||
comment: 6,
|
||||
userName: '流畅编程'
|
||||
},
|
||||
{
|
||||
id: 27,
|
||||
date: '2024-9-16',
|
||||
content: '今天的编程练习让我更有信心',
|
||||
collection: 9,
|
||||
comment: 8,
|
||||
userName: '信心满满'
|
||||
},
|
||||
{
|
||||
id: 28,
|
||||
date: '2024-9-16',
|
||||
content: '今天的编程学习让我收获很多',
|
||||
collection: 7,
|
||||
comment: 5,
|
||||
userName: '匿名'
|
||||
},
|
||||
{
|
||||
id: 29,
|
||||
date: '2024-9-17',
|
||||
content: '编程是一门艺术,今天体会到了',
|
||||
collection: 12,
|
||||
comment: 10,
|
||||
userName: '编程艺术家'
|
||||
},
|
||||
{
|
||||
id: 30,
|
||||
date: '2024-9-17',
|
||||
content: '今天的代码写得很顺利,继续加油!',
|
||||
collection: 10,
|
||||
comment: 9,
|
||||
userName: '匿名'
|
||||
}
|
||||
])
|
||||
@@ -0,0 +1,273 @@
|
||||
import avatar1 from '@/apps/demo/assets/images/avatar/avatar1.webp'
|
||||
import avatar2 from '@/apps/demo/assets/images/avatar/avatar2.webp'
|
||||
import avatar3 from '@/apps/demo/assets/images/avatar/avatar3.webp'
|
||||
import avatar4 from '@/apps/demo/assets/images/avatar/avatar4.webp'
|
||||
import avatar5 from '@/apps/demo/assets/images/avatar/avatar5.webp'
|
||||
import avatar6 from '@/apps/demo/assets/images/avatar/avatar6.webp'
|
||||
import avatar7 from '@/apps/demo/assets/images/avatar/avatar7.webp'
|
||||
import avatar8 from '@/apps/demo/assets/images/avatar/avatar8.webp'
|
||||
import avatar9 from '@/apps/demo/assets/images/avatar/avatar9.webp'
|
||||
import avatar10 from '@/apps/demo/assets/images/avatar/avatar10.webp'
|
||||
|
||||
export interface User {
|
||||
id: number
|
||||
username: string
|
||||
gender: 1 | 0
|
||||
mobile: string
|
||||
email: string
|
||||
dep: string
|
||||
status: string
|
||||
create_time: string
|
||||
avatar: string
|
||||
}
|
||||
|
||||
// 用户列表
|
||||
export const ACCOUNT_TABLE_DATA: User[] = [
|
||||
{
|
||||
id: 1,
|
||||
username: 'alexmorgan',
|
||||
gender: 1,
|
||||
mobile: '18670001591',
|
||||
email: 'alexmorgan@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-09-09 10:01:10',
|
||||
avatar: avatar1
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
username: 'sophiabaker',
|
||||
gender: 1,
|
||||
mobile: '17766664444',
|
||||
email: 'sophiabaker@company.com',
|
||||
dep: '电商部',
|
||||
status: '1',
|
||||
create_time: '2020-10-10 13:01:12',
|
||||
avatar: avatar2
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
username: 'liampark',
|
||||
gender: 1,
|
||||
mobile: '18670001597',
|
||||
email: 'liampark@company.com',
|
||||
dep: '人事部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:45',
|
||||
avatar: avatar3
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
username: 'oliviagrant',
|
||||
gender: 0,
|
||||
mobile: '18670001596',
|
||||
email: 'oliviagrant@company.com',
|
||||
dep: '产品部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 09:01:20',
|
||||
avatar: avatar4
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
username: 'emmawilson',
|
||||
gender: 0,
|
||||
mobile: '18670001595',
|
||||
email: 'emmawilson@company.com',
|
||||
dep: '财务部',
|
||||
status: '1',
|
||||
create_time: '2020-11-13 11:01:05',
|
||||
avatar: avatar5
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
username: 'noahevan',
|
||||
gender: 1,
|
||||
mobile: '18670001594',
|
||||
email: 'noahevan@company.com',
|
||||
dep: '运营部',
|
||||
status: '1',
|
||||
create_time: '2020-10-11 13:10:26',
|
||||
avatar: avatar6
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
username: 'avamartin',
|
||||
gender: 1,
|
||||
mobile: '18123820191',
|
||||
email: 'avamartin@company.com',
|
||||
dep: '客服部',
|
||||
status: '2',
|
||||
create_time: '2020-05-14 12:05:10',
|
||||
avatar: avatar7
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
username: 'jacoblee',
|
||||
gender: 1,
|
||||
mobile: '18670001592',
|
||||
email: 'jacoblee@company.com',
|
||||
dep: '总经办',
|
||||
status: '3',
|
||||
create_time: '2020-11-12 07:22:25',
|
||||
avatar: avatar8
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
username: 'miaclark',
|
||||
gender: 0,
|
||||
mobile: '18670001581',
|
||||
email: 'miaclark@company.com',
|
||||
dep: '研发部',
|
||||
status: '4',
|
||||
create_time: '2020-06-12 05:04:20',
|
||||
avatar: avatar9
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
username: 'ethanharris',
|
||||
gender: 1,
|
||||
mobile: '13755554444',
|
||||
email: 'ethanharris@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-12 16:01:10',
|
||||
avatar: avatar10
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
username: 'isabellamoore',
|
||||
gender: 1,
|
||||
mobile: '13766660000',
|
||||
email: 'isabellamoore@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:20',
|
||||
avatar: avatar6
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
username: 'masonwhite',
|
||||
gender: 1,
|
||||
mobile: '18670001502',
|
||||
email: 'masonwhite@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:20',
|
||||
avatar: avatar7
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
username: 'charlottehall',
|
||||
gender: 1,
|
||||
mobile: '13006644977',
|
||||
email: 'charlottehall@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:20',
|
||||
avatar: avatar8
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
username: 'benjaminscott',
|
||||
gender: 0,
|
||||
mobile: '13599998888',
|
||||
email: 'benjaminscott@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:20',
|
||||
avatar: avatar9
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
username: 'ameliaking',
|
||||
gender: 1,
|
||||
mobile: '13799998888',
|
||||
email: 'ameliaking@company.com',
|
||||
dep: '研发部',
|
||||
status: '1',
|
||||
create_time: '2020-11-14 12:01:20',
|
||||
avatar: avatar10
|
||||
}
|
||||
]
|
||||
|
||||
export interface Role {
|
||||
roleName: string
|
||||
roleCode: string
|
||||
des: string
|
||||
date: string
|
||||
enable: boolean
|
||||
}
|
||||
|
||||
// 角色列表
|
||||
export const ROLE_LIST_DATA: Role[] = [
|
||||
{
|
||||
roleName: '超级管理员',
|
||||
roleCode: 'R_SUPER',
|
||||
des: '拥有系统全部权限',
|
||||
date: '2025-05-15 12:30:45',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '管理员',
|
||||
roleCode: 'R_ADMIN',
|
||||
des: '拥有系统管理权限',
|
||||
date: '2025-05-15 12:30:45',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '普通用户',
|
||||
roleCode: 'R_USER',
|
||||
des: '拥有系统普通权限',
|
||||
date: '2025-05-15 12:30:45',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '财务管理员',
|
||||
roleCode: 'R_FINANCE',
|
||||
des: '管理财务相关权限',
|
||||
date: '2025-05-16 09:15:30',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '数据分析师',
|
||||
roleCode: 'R_ANALYST',
|
||||
des: '拥有数据分析权限',
|
||||
date: '2025-05-16 11:45:00',
|
||||
enable: false
|
||||
},
|
||||
{
|
||||
roleName: '客服专员',
|
||||
roleCode: 'R_SUPPORT',
|
||||
des: '处理客户支持请求',
|
||||
date: '2025-05-17 14:30:22',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '营销经理',
|
||||
roleCode: 'R_MARKETING',
|
||||
des: '管理营销活动权限',
|
||||
date: '2025-05-17 15:10:50',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '访客用户',
|
||||
roleCode: 'R_GUEST',
|
||||
des: '仅限浏览权限',
|
||||
date: '2025-05-18 08:25:40',
|
||||
enable: false
|
||||
},
|
||||
{
|
||||
roleName: '系统维护员',
|
||||
roleCode: 'R_MAINTAINER',
|
||||
des: '负责系统维护和更新',
|
||||
date: '2025-05-18 09:50:12',
|
||||
enable: true
|
||||
},
|
||||
{
|
||||
roleName: '项目经理',
|
||||
roleCode: 'R_PM',
|
||||
des: '管理项目相关权限',
|
||||
date: '2025-05-19 13:40:35',
|
||||
enable: true
|
||||
}
|
||||
]
|
||||
@@ -0,0 +1,431 @@
|
||||
interface UpgradeLog {
|
||||
version: string // 版本号
|
||||
title: string // 更新标题
|
||||
date: string // 更新日期
|
||||
detail?: string[] // 更新内容
|
||||
requireReLogin?: boolean // 是否需要重新登录
|
||||
remark?: string // 备注
|
||||
}
|
||||
|
||||
export const upgradeLogList = ref<UpgradeLog[]>([
|
||||
{
|
||||
version: 'v3.0.1',
|
||||
title: 'bug修复、新增功能',
|
||||
date: '2025-11-15',
|
||||
detail: [
|
||||
'修复:路由注册时不存在接口的重复请求问题',
|
||||
'修复:一键精简脚本打包失败的问题',
|
||||
'优化:完善路由配置验证机制,自动检测并提示非一级菜单的路径配置错误',
|
||||
'优化:顶部进度条残影',
|
||||
'优化:vite 预构建优化',
|
||||
'优化:圆角、边框统一',
|
||||
'优化:锁屏页面重新设计',
|
||||
'优化:退出登录菜单提前消失造成的视觉体验不好问题',
|
||||
'新增:ArtForm 和 ArtSearchBar 组件的 label 支持自定义渲染函数,可实现带 tooltip 等复杂标签',
|
||||
'新增:菜单管理表单关键字段新增 Tooltip 提示,降低用户配置门槛',
|
||||
'新增:iconify 新增离线图标加载模式',
|
||||
'新增:退出登录新增 redirect 属性,用于重新登录后跳转到对应页面',
|
||||
'新增:退出登录重新进入系统保留用户标签页,根据 userId 进行身份识别',
|
||||
'新增:双列菜单新增折叠按钮',
|
||||
'新增:菜单图标完善',
|
||||
'新增:多标签页增加图标',
|
||||
'新增:WebSocket 连接'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v3.0.0',
|
||||
title: 'Sass 重构为 Tailwind CSS,Iconfont 替换为 Iconify,性能,目录结构,文件注释全方位优化',
|
||||
date: '2025-11-9',
|
||||
requireReLogin: true,
|
||||
detail: [
|
||||
'样式系统重构:Sass 全面迁移至 Tailwind CSS,提升开发效率与样式一致性',
|
||||
'图标方案升级:Iconfont 替换为 Iconify,支持更丰富的图标库与按需加载',
|
||||
'构建优化:完整包体积减少 1.3 MB,显著提升加载性能',
|
||||
'路由注册重构:全面重构路由注册系统,引入面向对象设计,提高代码的可维护性、可测试性和扩展能力',
|
||||
'架构优化:优化目录结构,职责划分更清晰,降低用户学习成本与上手难度',
|
||||
'注释优化:统一模块注释规范,完善每一个组件介绍、功能说明与使用示例,降低用户理解成本与上手难度',
|
||||
'性能提升:优化核心代码逻辑,提升系统运行效率',
|
||||
'设计系统:重构颜色体系,统一 UI 视觉规范,提升界面一致性',
|
||||
'菜单优化:细化菜单样式,优化交互体验与视觉呈现',
|
||||
'组件重构:重构 ArtTextScroll 组件,提升性能与可维护性',
|
||||
'问题修复:修复 ArtForm、ArtSearchBar 自定义组件渲染异常',
|
||||
'功能增强:ArtForm、ArtSearchBar 新增 render 属性,支持自定义组件渲染',
|
||||
'功能增强:useTable hooks 新增 visible 属性,用于控制列默认是否显示',
|
||||
'响应式优化:优化 ArtForm、ArtSearchBar 栅格布局,适配多种屏幕尺寸',
|
||||
'节日功能增强:礼花配置支持跨日期范围设置与自定义播放次数',
|
||||
'依赖更新:升级核心依赖至最新稳定版本',
|
||||
'配置管理优化:新增 setting.ts 配置文件,支持一键复制与重置系统默认设置'
|
||||
],
|
||||
remark:
|
||||
'重要提示:本次升级涉及样式系统(Sass → Tailwind CSS)与图标库(Iconfont → Iconify)的底层重构,属于破坏性更新。建议新项目直接使用 v3.0,旧版本项目不建议升级。'
|
||||
},
|
||||
{
|
||||
version: 'v2.6.1',
|
||||
title: 'bug修复、授权页增加主题色切换功能',
|
||||
date: '2025-10-19',
|
||||
detail: [
|
||||
'修复获取用户信息、获取菜单接口访问无效地址重复调用问题',
|
||||
'升级部分依赖兼容 tailwindcss',
|
||||
'修复 ElButton circle 模式样式',
|
||||
'修复 ElSlect 无法通过键盘选择问题',
|
||||
'修复带参数静态路由跳转登录页面问题',
|
||||
'优化外部链接菜单点击选中状态',
|
||||
'授权页增加主题色切换功能'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.6.0',
|
||||
title: '代码优化、bug修复',
|
||||
date: '2025-10-16',
|
||||
detail: [
|
||||
'优化精简版本菜单数据结构,提升数据一致性',
|
||||
'优化本地开发环境网络请求代理配置',
|
||||
'优化 ElTree 组件默认样式',
|
||||
'新增 VsCode 推荐插件相关配置',
|
||||
'优化 ElDropdown 组件点击触发模式下的交互样式',
|
||||
'扩展注册、密码重置页面顶部组件支持',
|
||||
'优化菜单过滤逻辑',
|
||||
'优化页面切换动画,提升加载速度',
|
||||
'优化暗黑模式文字颜色',
|
||||
'修复静态路由自定义首页路径首次访问跳转登录页问题',
|
||||
'修复退出登录时短暂跳转至 500 页的问题',
|
||||
'修复 v2.5.9 版本首页路由跳转配置失效问题',
|
||||
'修复 v2.5.9 自动导包机制导致的构建异常'
|
||||
],
|
||||
requireReLogin: true
|
||||
},
|
||||
{
|
||||
version: 'v2.5.9',
|
||||
title: '代码优化',
|
||||
date: '2025-10-12',
|
||||
detail: [
|
||||
'views 文件目录、文件名、代码优化',
|
||||
'useTable 分页请求字段增加全局配置 tableConfig.ts',
|
||||
'优化路由配置为模块化结构',
|
||||
'获取菜单接口使用 apifox mock 数据(需在 .env 中 将 VITE_ACCESS_MODE 设为 backend 模式)'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.8',
|
||||
title: '依赖升级、bug修复',
|
||||
date: '2025-09-29',
|
||||
detail: [
|
||||
'vue、vite、element-plus 等核心库升级',
|
||||
'修复富文本编辑器全屏顶栏层级问题',
|
||||
'修复表格列排序组件文字益处问题',
|
||||
'修复统计卡片条件判断',
|
||||
'优化 el-tag 样式',
|
||||
'优化顶部进度条颜色',
|
||||
'优化自定义主题配置',
|
||||
'优化 ElementPlus 自定义主题问题',
|
||||
'修复根路径 / 与 HOME_PAGE_PATH 同为 / 时出现的无限重定向'
|
||||
],
|
||||
remark: '由于项目依赖升级,node 版本需要升级到 v20.19.0 或以上'
|
||||
},
|
||||
{
|
||||
version: 'v2.5.7',
|
||||
title: '新增表单组件',
|
||||
date: '2025-09-14',
|
||||
detail: [
|
||||
'新增 ArtForm 组件',
|
||||
'修复新版本谷歌浏览器切换主题闪烁问题',
|
||||
'优化表单 label 高度没有对齐问题',
|
||||
'首屏启动性能优化'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.6',
|
||||
title: '优化用户体验、bug修复',
|
||||
date: '2025-09-06',
|
||||
detail: [
|
||||
'useTable 类型推导优化,不需要手动传递类型即可实现类型提示',
|
||||
'useTable removeColumn 支持多数据删除',
|
||||
'useTable 自动识别响应体支持自定义配置 (src/utils/table/tableConfig.ts)',
|
||||
'useTable 空数据浏览器警告优化',
|
||||
'api 接口请求代码优化、api.d.ts 类型优化',
|
||||
'优化 ArtTable 顶部按钮换行无法自适应问题(示例:功能示例 / 左右布局表格)',
|
||||
'ArtTable 分页组件选中样式优化',
|
||||
'ArtTable 空状态高度默认撑满',
|
||||
'ArtButtonMore 组件新增图标、颜色配置',
|
||||
'ArtTableHeader 新增搜索按钮,用于控制顶部搜索栏的显示与隐藏',
|
||||
'ArtSearchBar label 为空时不占空间',
|
||||
'表格操作栏拖拽禁止固定列拖拽',
|
||||
'角色管理页面接口对接、代码优化',
|
||||
'菜单管理页面优化',
|
||||
'优化设置中心滚动页面跟随滚动问题',
|
||||
'一级路由是外链时,component 校验逻辑优化',
|
||||
'优化地图右下角拖动问题',
|
||||
'优化暗黑模式刷新页面白色背景问题',
|
||||
'优化左侧菜单折叠按钮间距问题',
|
||||
'移动端显示左侧菜单 logo',
|
||||
'网络请求新增 showSuccessMessage,用于配置是否显示成功消息',
|
||||
'添加全局错误处理基础框架',
|
||||
'修复批量删除整页数据没有返回上一页的bug',
|
||||
'修复动态路由参数导致的问题',
|
||||
'修复动态路由配置 一级路由是 iframe 页面时,全屏问题',
|
||||
'新增权限演示示例',
|
||||
'全局组件采用异步加载策略,提升首屏加载性能'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.5',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-08-17',
|
||||
detail: [
|
||||
'重构 ArtSearchBar 组件,支持更多组件、表单校验等能力',
|
||||
'useTable 列配置:支持动态更新能力',
|
||||
'修复多个富文本编辑器图标不统一问题',
|
||||
'优化颜色选择器圆角',
|
||||
'el-radio、el-checkbox 统一大小',
|
||||
'art-stats-card 新增小数位、分隔符配置',
|
||||
'路由配置示例优化',
|
||||
'高级表格新增自定义获取数据示例(等待其他请求完成后执行 useTable 数据获取)',
|
||||
'useTable 新增 excludeParams,用于排除某些参数不参与请求',
|
||||
'优化路径别名类型问题',
|
||||
'本地开发跨域配置优化',
|
||||
'修复 useTable 删除最后一整页数据没有返回上一页的问题',
|
||||
'修复 echarts 图表数据初始化、更新数据浏览器报错',
|
||||
'删除 art-chart-empty 组件',
|
||||
'新增 ArtSearchBar 组件示例',
|
||||
'网络请求支持 http 状态码为 401 时退出登录',
|
||||
'优化网络请求退出登录多次提示问题',
|
||||
'useTable 属性、方法命名优化',
|
||||
'登录页UI升级',
|
||||
'403、404、500 页面UI升级'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.4',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-07-27',
|
||||
detail: [
|
||||
'修复获取用户信息接口时序问题导致路由注册菜单渲染错误bug',
|
||||
'修复动态路由校验问题导致的 iframe 不显示bug',
|
||||
'修复 reset 文件语法错误',
|
||||
'修复 ArtTable 数据类型错误',
|
||||
'路由注册新增 component 校验',
|
||||
'修复地图滚轮滚动放大问题',
|
||||
'网络请求 headers 支持自定义配置',
|
||||
'展开行支持 formatter 渲染'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.3',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-07-20',
|
||||
detail: [
|
||||
'ArtTable 组件重构',
|
||||
'Element Plus 升级到 v2.10.2',
|
||||
'优化 useTable 分页参数问题',
|
||||
'修复 ArtTable 切换分页大小时执行两次请求bug',
|
||||
'优化网络请求示例:初始化参数、分页携带参数问题',
|
||||
'优化搜索日期范围参数处理',
|
||||
'优化 el-date-picker 组件圆角问题',
|
||||
'优化 el-select 组件 hover 样式',
|
||||
'新增表格左右布局示例',
|
||||
'搜索组件、分页组件高度降低',
|
||||
'优化登录页面滑块动画间隔时长',
|
||||
'优化菜单没有子菜单显示的问题'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.2',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-07-13',
|
||||
detail: [
|
||||
'新增一键精简脚本,快速准备开发环境',
|
||||
'优化表格无数据时表头不显示问题',
|
||||
'useTable hooks 支持分页字段名自定义映射',
|
||||
'修复 v2.5.0 顶部进度条不显示问题',
|
||||
'修复左侧菜单遮罩异常显示问题',
|
||||
'修复隐藏所有子菜单时仍显示父级菜单的问题',
|
||||
'水平菜单、混合菜单、双列菜单支持徽章显示',
|
||||
'修复 stylelint 导致的登录页滑块样式异常',
|
||||
'修复老旧移动端设备 loading 定位问题',
|
||||
'快速入口支持配置文件模式',
|
||||
'顶栏功能支持配置文件模式',
|
||||
'全局事件总线 mittBus 类型安全优化',
|
||||
'支持自定义首页路径',
|
||||
'优化移动端设置中容器宽度样式',
|
||||
'优化登录页验证滑块文字居中效果',
|
||||
'路由支持配置 redirect 等属性'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.1',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-07-08',
|
||||
detail: [
|
||||
'修复首次登录系统时 loading 提前关闭bug',
|
||||
'el-card、el-table 背景色跟系统保持一致',
|
||||
'修复 v2.5.0 版本引起的全屏页样式层级过低bug',
|
||||
'修复 v2.5.0 版本引起的表格展开行折叠bug'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.5.0',
|
||||
title: '新增 useTable hooks 表格封装、组件重构',
|
||||
date: '2025-07-06',
|
||||
remark: '建议升级,带来更高效、更智能的表格开发体验',
|
||||
detail: [
|
||||
'重构 ArtTable、ArtTableHeader、ArtNotification 组件',
|
||||
'新增 useTable hooks 表格封装,支持数据获取、转换、响应适配、智能缓存(基于 LRU 算法)、错误处理、列配置与插槽、分页控制、刷新策略等核心功能,全面提升开发效率与用户体验',
|
||||
'修复菜单管理搜索直接修改 pinia 数据的问题',
|
||||
'移除 CountTo 插件,替换为 ArtCountTo 组件',
|
||||
'Echarts 版本升级到 5.6.0',
|
||||
'修复路由守卫 loading 闪烁问题'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.9',
|
||||
title: '代码重构、修复bug、优化用户体验',
|
||||
date: '2025-07-02',
|
||||
detail: [
|
||||
'菜单布局、顶部导航代码重构',
|
||||
'修复移动端锁屏页部分浏览器无法解锁bug',
|
||||
'优化移动端菜单滚动用户体验',
|
||||
'优化顶部菜单样式问题',
|
||||
'顶部菜单宽度自适应,可显示更多内容,混合菜单支持鼠标滚动',
|
||||
'asyncRoutes 路由配置 auth_mark 字段改为 authMark',
|
||||
'去除重复的 components.d.ts 文件,components.d.ts、auto-imports.d.ts 忽略提交',
|
||||
'优化国际化语言文件加载方式,异步改成同步模式',
|
||||
'优化 el-pagination 大小不一致问题'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.8',
|
||||
title: '修复 v2.4.2.7 版本访问 / 路径时显示 404 的问题',
|
||||
date: '2025-06-26'
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.7',
|
||||
title: 'bug修复、优化用户体验',
|
||||
date: '2025-06-25',
|
||||
detail: [
|
||||
'路由支持配置全屏模式',
|
||||
'路由支持自动跳转到菜单的第一个有效路由',
|
||||
'动态路由新增 removeAllDynamicRoutes 方法,可用于彻底清除所有动态路由',
|
||||
'权限自定义指令优化、新增角色权限指令 v-roles、可用于控制元素的显示与隐藏',
|
||||
'修复登录页面拖拽组件 ArtDragVerify 宽度、颜色异常bug',
|
||||
'修复 iframe 页面混合模式、双列模式异常bug',
|
||||
'优化锁屏页面被 el-loading 穿透bug',
|
||||
'跨域请求携带 cookie 配置从环境变量中获取,默认关闭',
|
||||
'针对SEO、可访问性做一些优化',
|
||||
'新增标签页操作示例'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.6',
|
||||
title: '组件重构与性能优化',
|
||||
date: '2025-06-23',
|
||||
detail: [
|
||||
'重构 components/core/forms 文件夹下的表单相关组件,提升可维护性与一致性',
|
||||
'重构 ArtBreadcrumb 面包屑导航组件,优化逻辑结构与样式',
|
||||
'优化 ArtChatWindow 与 ArtFastEnter 组件代码,提升可读性与性能',
|
||||
'重构 ArtFireworksEffect 烟花效果组件,显著提升渲染性能与动画流畅度',
|
||||
'README 文档新增官方网站链接,便于用户查看项目文档'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.5',
|
||||
title: '图表组件重构',
|
||||
date: '2025-06-22',
|
||||
detail: [
|
||||
'重构图表组件,优化代码结构与可维护性',
|
||||
'精细调整图表动画与主题配色方案,提升视觉一致性'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.4',
|
||||
title: '组件重构、代码优化',
|
||||
date: '2025-06-18',
|
||||
detail: [
|
||||
'ArtMenuRight 组件重构',
|
||||
'ArtWatermark 增加类型注释',
|
||||
'components/core/cards 下面的组件重构,代码优化'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.3',
|
||||
title: '组件重构、代码优化',
|
||||
date: '2025-06-18',
|
||||
detail: [
|
||||
'ArtResultPage 组件重构',
|
||||
'ArtTextScroll 组件代码优化',
|
||||
'ArtException 组件增加类型提示',
|
||||
'ArtCutterImg 组件样式优化、增加类型定义',
|
||||
'ArtVideoPlayer 组件增加类型定义'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.2',
|
||||
title: '组件重构',
|
||||
date: '2025-06-16',
|
||||
detail: ['返回顶部组件重构', '图标选择器组件重构', '系统Logo组件属性变更']
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2.1',
|
||||
title: '横幅组件重构、Bug修复',
|
||||
date: '2025-06-16',
|
||||
detail: ['横幅组件重构以及优化', '修复混合菜单下第一个菜单是嵌套菜单跳转bug']
|
||||
},
|
||||
{
|
||||
version: 'v2.4.2',
|
||||
title: 'Bug修复与体验优化',
|
||||
date: '2025-06-14',
|
||||
detail: [
|
||||
'重构网络请求模块,增强错误处理、类型安全与多语言支持',
|
||||
'修复移动端搜索栏无法滚动、iPad端页面滚动异常问题',
|
||||
'修复 el-dialog 启用 draggable 属性后,自定义动画失效的问题',
|
||||
'修复 2.3.0 版本本地存储重构后,导致登录、注册等页面多语言设置无法持久化的问题',
|
||||
'引导、列设置多语言完善',
|
||||
'修复表格固定列不起作用bug',
|
||||
'路由配置新增 activePath 激活菜单路径属性',
|
||||
'去除用户列表、菜单管理页面无效代码',
|
||||
'更新技术支持链接'
|
||||
],
|
||||
requireReLogin: true
|
||||
},
|
||||
{
|
||||
version: 'v2.4.1.1',
|
||||
title: 'Bug修复与体验优化',
|
||||
date: '2025-06-07',
|
||||
detail: [
|
||||
'修复菜单管理折叠 bug',
|
||||
'优化角色管理页面代码',
|
||||
'修复表格数据为空高度无限变大bug',
|
||||
'el-dialog视觉效果优化,支持配置线条',
|
||||
'系统主题模式从Light改成跟随系统模式'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.1',
|
||||
title: '优化菜单交互体验、Echarts 图表性能优化',
|
||||
date: '2025-06-07',
|
||||
detail: [
|
||||
'提升菜单操作跟手感',
|
||||
'页面入场动画时间减少0.04s',
|
||||
'修复 Echarts 图表组件在弹窗中不显示的 bug',
|
||||
'Echarts 图表性能优化,新增可视区域初始化、内存泄漏防护、防抖处理',
|
||||
'锁屏状下禁止使用开发者工具破解锁屏'
|
||||
]
|
||||
},
|
||||
{
|
||||
version: 'v2.4.0',
|
||||
title: '代码重构与资源优化',
|
||||
date: '2025-06-06',
|
||||
detail: [
|
||||
'全局 TypeScript 类型体系重构,提升类型准确性与可维护性',
|
||||
'重构 utils 工具包,统一工具方法结构,增强可读性与复用性',
|
||||
'utils 新增表单验证与 Cookie 操作相关工具函数',
|
||||
'删除未使用的工具模块与无效资源,精简项目体积',
|
||||
'优化 views 页面结构,移除冗余页面文件',
|
||||
'页面组件增加 defineOptions,明确组件命名',
|
||||
'异常页面多语言支持, 提升国际化体验',
|
||||
'图片资源统一转换为 webp 格式,整体资源体积减少约 50%',
|
||||
'打包产物减少约 1MB,提高加载效率',
|
||||
'HTTP 请求增加 token 过期自动处理逻辑,提升安全性与用户体验'
|
||||
],
|
||||
requireReLogin: true
|
||||
}
|
||||
])
|
||||
@@ -0,0 +1,58 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const articleRoutes: AppRouteRecord = {
|
||||
name: 'DemoArticle',
|
||||
path: '/demo-article',
|
||||
meta: {
|
||||
title: 'menus.article.title',
|
||||
icon: 'ri:article-line',
|
||||
roles: ['R_SUPER', 'R_ADMIN'],
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: 'DemoArticleList',
|
||||
component: '/article/list',
|
||||
meta: {
|
||||
title: 'menus.article.list',
|
||||
icon: 'ri:list-unordered',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'detail',
|
||||
name: 'DemoArticleDetail',
|
||||
component: '/article/detail',
|
||||
meta: {
|
||||
title: 'menus.article.detail',
|
||||
icon: 'ri:file-text-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'publish',
|
||||
name: 'DemoArticlePublish',
|
||||
component: '/article/publish',
|
||||
meta: {
|
||||
title: 'menus.article.publish',
|
||||
icon: 'ri:edit-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'comment',
|
||||
name: 'DemoArticleComment',
|
||||
component: '/article/comment',
|
||||
meta: {
|
||||
title: 'menus.article.comment',
|
||||
icon: 'ri:message-3-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const dashboardRoutes: AppRouteRecord = {
|
||||
name: 'DemoDashboard',
|
||||
path: '/demo-dashboard',
|
||||
meta: {
|
||||
title: 'menus.dashboard.title',
|
||||
icon: 'ri:pie-chart-line',
|
||||
roles: ['R_SUPER', 'R_ADMIN'],
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'console',
|
||||
name: 'DemoConsole',
|
||||
component: '/dashboard/console',
|
||||
meta: {
|
||||
title: 'menus.dashboard.console',
|
||||
icon: 'ri:home-smile-2-line',
|
||||
keepAlive: false,
|
||||
fixedTab: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'analysis',
|
||||
name: 'DemoAnalysis',
|
||||
component: '/dashboard/analysis',
|
||||
meta: {
|
||||
title: 'menus.dashboard.analysis',
|
||||
icon: 'ri:align-item-bottom-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'ecommerce',
|
||||
name: 'DemoEcommerce',
|
||||
component: '/dashboard/ecommerce',
|
||||
meta: {
|
||||
title: 'menus.dashboard.ecommerce',
|
||||
icon: 'ri:bar-chart-box-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,100 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const examplesRoutes: AppRouteRecord = {
|
||||
name: 'DemoExamples',
|
||||
path: '/demo-examples',
|
||||
meta: {
|
||||
title: 'menus.examples.title',
|
||||
icon: 'ri:sparkling-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'forms',
|
||||
name: 'DemoForms',
|
||||
component: '/examples/forms',
|
||||
meta: {
|
||||
title: 'menus.examples.forms.title',
|
||||
icon: 'ri:form-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'tables',
|
||||
name: 'DemoTables',
|
||||
component: '/examples/tables',
|
||||
meta: {
|
||||
title: 'menus.examples.tables.title',
|
||||
icon: 'ri:table-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'tabs',
|
||||
name: 'DemoTabs',
|
||||
component: '/examples/tabs',
|
||||
meta: {
|
||||
title: 'menus.examples.tabs.title',
|
||||
icon: 'ri:folder-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'socket-chat',
|
||||
name: 'DemoSocketChat',
|
||||
component: '/examples/socket-chat',
|
||||
meta: {
|
||||
title: 'menus.examples.socketChat.title',
|
||||
icon: 'ri:chat-3-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'permission',
|
||||
name: 'DemoPermission',
|
||||
meta: {
|
||||
title: 'menus.examples.permission.title',
|
||||
icon: 'ri:fingerprint-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'switch-role',
|
||||
name: 'DemoPermissionSwitchRole',
|
||||
component: '/examples/permission/switch-role',
|
||||
meta: {
|
||||
title: 'menus.examples.permission.switchRole',
|
||||
icon: 'ri:contacts-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'button-auth',
|
||||
name: 'DemoPermissionButtonAuth',
|
||||
component: '/examples/permission/button-auth',
|
||||
meta: {
|
||||
title: 'menus.examples.permission.buttonAuth',
|
||||
icon: 'ri:mouse-line',
|
||||
keepAlive: true,
|
||||
module: 'demo',
|
||||
authList: [
|
||||
{ title: '新增', authMark: 'add' },
|
||||
{ title: '编辑', authMark: 'edit' },
|
||||
{ title: '删除', authMark: 'delete' },
|
||||
{ title: '导出', authMark: 'export' },
|
||||
{ title: '查看', authMark: 'view' },
|
||||
{ title: '发布', authMark: 'publish' },
|
||||
{ title: '配置', authMark: 'config' },
|
||||
{ title: '管理', authMark: 'manage' }
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const exceptionRoutes: AppRouteRecord = {
|
||||
name: 'DemoException',
|
||||
path: '/demo-exception',
|
||||
meta: {
|
||||
title: 'menus.exception.title',
|
||||
icon: 'ri:error-warning-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: '403',
|
||||
name: 'Demo403',
|
||||
component: '/exception/403',
|
||||
meta: {
|
||||
isFullPage: true,
|
||||
title: 'menus.exception.403',
|
||||
icon: 'ri:forbid-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '404',
|
||||
name: 'Demo404',
|
||||
component: '/exception/404',
|
||||
meta: {
|
||||
isFullPage: true,
|
||||
title: 'menus.exception.404',
|
||||
icon: 'ri:file-search-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '500',
|
||||
name: 'Demo500',
|
||||
component: '/exception/500',
|
||||
meta: {
|
||||
isFullPage: true,
|
||||
title: 'menus.exception.500',
|
||||
icon: 'ri:server-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const helpRoutes: AppRouteRecord = {
|
||||
name: 'DemoHelp',
|
||||
path: '/demo-help',
|
||||
meta: {
|
||||
title: 'menus.help.title',
|
||||
icon: 'ri:question-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'change-log',
|
||||
name: 'DemoChangeLog',
|
||||
component: '/change/log',
|
||||
meta: {
|
||||
title: 'menus.help.changeLog',
|
||||
icon: 'ri:file-list-3-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
import { dashboardRoutes } from './dashboard'
|
||||
import { templateRoutes } from './template'
|
||||
import { articleRoutes } from './article'
|
||||
import { examplesRoutes } from './examples'
|
||||
import { systemRoutes } from './system'
|
||||
import { widgetsRoutes } from './widgets'
|
||||
import { exceptionRoutes } from './exception'
|
||||
import { resultRoutes } from './result'
|
||||
import { safeguardRoutes } from './safeguard'
|
||||
import { helpRoutes } from './help'
|
||||
import { RoutesAlias } from '@/router/routesAlias'
|
||||
import { $t } from '@/locales'
|
||||
|
||||
export default {
|
||||
path: '/demo-playground',
|
||||
name: 'DemoPlayground',
|
||||
component: RoutesAlias.Layout,
|
||||
meta: {
|
||||
title: $t('demo.demo.playground.title'),
|
||||
icon: 'ri:play-circle-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
dashboardRoutes,
|
||||
templateRoutes,
|
||||
articleRoutes,
|
||||
examplesRoutes,
|
||||
systemRoutes,
|
||||
widgetsRoutes,
|
||||
exceptionRoutes,
|
||||
resultRoutes,
|
||||
safeguardRoutes,
|
||||
helpRoutes
|
||||
]
|
||||
} as AppRouteRecord
|
||||
@@ -0,0 +1,35 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const resultRoutes: AppRouteRecord = {
|
||||
name: 'DemoResult',
|
||||
path: '/demo-result',
|
||||
meta: {
|
||||
title: 'menus.result.title',
|
||||
icon: 'ri:checkbox-circle-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'success',
|
||||
name: 'DemoSuccess',
|
||||
component: '/result/success',
|
||||
meta: {
|
||||
title: 'menus.result.success',
|
||||
icon: 'ri:checkbox-circle-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'fail',
|
||||
name: 'DemoFail',
|
||||
component: '/result/fail',
|
||||
meta: {
|
||||
title: 'menus.result.fail',
|
||||
icon: 'ri:close-circle-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const safeguardRoutes: AppRouteRecord = {
|
||||
name: 'DemoSafeguard',
|
||||
path: '/demo-safeguard',
|
||||
meta: {
|
||||
title: 'menus.safeguard.title',
|
||||
icon: 'ri:shield-keyhole-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'server',
|
||||
name: 'DemoServer',
|
||||
component: '/safeguard/server',
|
||||
meta: {
|
||||
title: 'menus.safeguard.server',
|
||||
icon: 'ri:server-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,113 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const systemRoutes: AppRouteRecord = {
|
||||
name: 'DemoSystem',
|
||||
path: '/demo-system',
|
||||
meta: {
|
||||
title: 'menus.system.title',
|
||||
icon: 'ri:settings-3-line',
|
||||
roles: ['R_SUPER', 'R_ADMIN'],
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'user',
|
||||
name: 'DemoUser',
|
||||
component: '/system/user',
|
||||
meta: {
|
||||
title: 'menus.system.user',
|
||||
icon: 'ri:user-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'role',
|
||||
name: 'DemoRole',
|
||||
component: '/system/role',
|
||||
meta: {
|
||||
title: 'menus.system.role',
|
||||
icon: 'ri:admin-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'menu',
|
||||
name: 'DemoMenu',
|
||||
component: '/system/menu',
|
||||
meta: {
|
||||
title: 'menus.system.menu',
|
||||
icon: 'ri:menu-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'nested',
|
||||
name: 'DemoNested',
|
||||
meta: {
|
||||
title: 'menus.system.nested',
|
||||
icon: 'ri:node-tree',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'menu1',
|
||||
name: 'DemoMenu1',
|
||||
component: '/system/nested/menu1',
|
||||
meta: {
|
||||
title: 'menus.system.nested.menu1',
|
||||
icon: 'ri:menu-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'menu2',
|
||||
name: 'DemoMenu2',
|
||||
component: '/system/nested/menu2',
|
||||
meta: {
|
||||
title: 'menus.system.nested.menu2',
|
||||
icon: 'ri:menu-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'menu3',
|
||||
name: 'DemoMenu3',
|
||||
meta: {
|
||||
title: 'menus.system.nested.menu3',
|
||||
icon: 'ri:menu-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'menu3-2',
|
||||
name: 'DemoMenu3-2',
|
||||
component: '/system/nested/menu3/menu3-2',
|
||||
meta: {
|
||||
title: 'menus.system.nested.menu3-2',
|
||||
icon: 'ri:menu-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'user-center',
|
||||
name: 'DemoUserCenter',
|
||||
component: '/system/user-center',
|
||||
meta: {
|
||||
title: 'menus.system.userCenter',
|
||||
icon: 'ri:user-settings-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,91 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const templateRoutes: AppRouteRecord = {
|
||||
name: 'DemoTemplate',
|
||||
path: '/demo-template',
|
||||
meta: {
|
||||
title: 'menus.template.title',
|
||||
icon: 'ri:layout-3-line',
|
||||
roles: ['R_SUPER', 'R_ADMIN'],
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'banners',
|
||||
name: 'DemoBanners',
|
||||
component: '/template/banners',
|
||||
meta: {
|
||||
title: 'menus.template.banners',
|
||||
icon: 'ri:image-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'calendar',
|
||||
name: 'DemoCalendar',
|
||||
component: '/template/calendar',
|
||||
meta: {
|
||||
title: 'menus.template.calendar',
|
||||
icon: 'ri:calendar-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'cards',
|
||||
name: 'DemoCards',
|
||||
component: '/template/cards',
|
||||
meta: {
|
||||
title: 'menus.template.cards',
|
||||
icon: 'ri:card-view',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'charts',
|
||||
name: 'DemoCharts',
|
||||
component: '/template/charts',
|
||||
meta: {
|
||||
title: 'menus.template.charts',
|
||||
icon: 'ri:bar-chart-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'chat',
|
||||
name: 'DemoChat',
|
||||
component: '/template/chat',
|
||||
meta: {
|
||||
title: 'menus.template.chat',
|
||||
icon: 'ri:chat-1-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'map',
|
||||
name: 'DemoMap',
|
||||
component: '/template/map',
|
||||
meta: {
|
||||
title: 'menus.template.map',
|
||||
icon: 'ri:map-pin-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'pricing',
|
||||
name: 'DemoPricing',
|
||||
component: '/template/pricing',
|
||||
meta: {
|
||||
title: 'menus.template.pricing',
|
||||
icon: 'ri:price-tag-3-line',
|
||||
keepAlive: false,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1,156 @@
|
||||
import { AppRouteRecord } from '@/types/router'
|
||||
|
||||
export const widgetsRoutes: AppRouteRecord = {
|
||||
name: 'DemoWidgets',
|
||||
path: '/demo-widgets',
|
||||
meta: {
|
||||
title: 'menus.widgets.title',
|
||||
icon: 'ri:apps-2-line',
|
||||
module: 'demo'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'context-menu',
|
||||
name: 'DemoContextMenu',
|
||||
component: '/widgets/context-menu',
|
||||
meta: {
|
||||
title: 'menus.widgets.contextMenu',
|
||||
icon: 'ri:menu-2-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'count-to',
|
||||
name: 'DemoCountTo',
|
||||
component: '/widgets/count-to',
|
||||
meta: {
|
||||
title: 'menus.widgets.countTo',
|
||||
icon: 'ri:number-1',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'drag',
|
||||
name: 'DemoDrag',
|
||||
component: '/widgets/drag',
|
||||
meta: {
|
||||
title: 'menus.widgets.drag',
|
||||
icon: 'ri:drag-move-2-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'excel',
|
||||
name: 'DemoExcel',
|
||||
component: '/widgets/excel',
|
||||
meta: {
|
||||
title: 'menus.widgets.excel',
|
||||
icon: 'ri:file-excel-2-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'demo-fireworks',
|
||||
name: 'DemoFireworks',
|
||||
component: '/widgets/fireworks',
|
||||
meta: {
|
||||
title: 'menus.widgets.fireworks',
|
||||
icon: 'ri:fire-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'icon',
|
||||
name: 'DemoIcon',
|
||||
component: '/widgets/icon',
|
||||
meta: {
|
||||
title: 'menus.widgets.icon',
|
||||
icon: 'ri:emotion-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'image-crop',
|
||||
name: 'DemoImageCrop',
|
||||
component: '/widgets/image-crop',
|
||||
meta: {
|
||||
title: 'menus.widgets.imageCrop',
|
||||
icon: 'ri:crop-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'qrcode',
|
||||
name: 'DemoQrcode',
|
||||
component: '/widgets/qrcode',
|
||||
meta: {
|
||||
title: 'menus.widgets.qrcode',
|
||||
icon: 'ri:qr-code-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'text-scroll',
|
||||
name: 'DemoTextScroll',
|
||||
component: '/widgets/text-scroll',
|
||||
meta: {
|
||||
title: 'menus.widgets.textScroll',
|
||||
icon: 'ri:text-wrap',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'video',
|
||||
name: 'DemoVideo',
|
||||
component: '/widgets/video',
|
||||
meta: {
|
||||
title: 'menus.widgets.video',
|
||||
icon: 'ri:video-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'wang-editor',
|
||||
name: 'DemoWangEditor',
|
||||
component: '/widgets/wang-editor',
|
||||
meta: {
|
||||
title: 'menus.widgets.wangEditor',
|
||||
icon: 'ri:edit-box-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'watermark',
|
||||
name: 'DemoWatermark',
|
||||
component: '/widgets/watermark',
|
||||
meta: {
|
||||
title: 'menus.widgets.watermark',
|
||||
icon: 'ri:water-percent-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'image-selector',
|
||||
name: 'DemoImageSelector',
|
||||
component: '/widgets/image-selector',
|
||||
meta: {
|
||||
title: '图片选择器',
|
||||
icon: 'ri:image-line',
|
||||
keepAlive: true,
|
||||
module: 'demo'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||