重构: 前端提交
|
@ -0,0 +1,2 @@
|
|||
> 1%
|
||||
last 2 versions
|
|
@ -0,0 +1,5 @@
|
|||
[*.{js,jsx,ts,tsx,vue}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
|
@ -0,0 +1,17 @@
|
|||
# 所有环境默认
|
||||
|
||||
# 页面 title 前缀
|
||||
VUE_APP_TITLE=D2Admin
|
||||
|
||||
# 网络请求公用地址
|
||||
VUE_APP_API=/api/
|
||||
|
||||
# 仓库地址
|
||||
VUE_APP_REPO=https://github.com/d2-projects/d2-admin-start-kit
|
||||
|
||||
# 国际化配置
|
||||
VUE_APP_I18N_LOCALE=zh-chs
|
||||
VUE_APP_I18N_FALLBACK_LOCALE=en
|
||||
|
||||
# element 颜色
|
||||
VUE_APP_ELEMENT_COLOR=#409EFF
|
|
@ -0,0 +1,9 @@
|
|||
# 开发环境
|
||||
NODE_ENV=development
|
||||
# 页面 title 前缀
|
||||
VUE_APP_TITLE=DVAdmin
|
||||
# 启用权限管理
|
||||
VUE_APP_PM_ENABLED = true
|
||||
# 后端接口地址及端口(域名)
|
||||
VUE_APP_API = "http://127.0.0.1:8000"
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
# 构建预览页面
|
||||
|
||||
# 指定构建模式
|
||||
NODE_ENV=production
|
||||
|
||||
# 标记当前构建方式
|
||||
VUE_APP_BUILD_MODE=PREVIEW
|
||||
# 页面 title 前缀
|
||||
VUE_APP_TITLE=DVAdmin
|
||||
# 显示源码按钮
|
||||
VUE_APP_SCOURCE_LINK=FALSE
|
||||
|
||||
# 部署路径
|
||||
VUE_APP_PUBLIC_PATH=/
|
||||
# 启用权限管理
|
||||
VUE_APP_PM_ENABLED = true
|
|
@ -0,0 +1,9 @@
|
|||
# 测试环境
|
||||
|
||||
# 页面 title 前缀
|
||||
VUE_APP_TITLE=DVAdmin
|
||||
# 启用权限管理
|
||||
VUE_APP_PM_ENABLED = true
|
||||
# 后端接口地址及端口(域名)
|
||||
VUE_APP_API = "http://117.50.22.212:8000/"
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
# 忽略目录
|
||||
build/
|
||||
tests/
|
||||
node_modules/
|
||||
|
||||
# D2CRUD 演示
|
||||
src/views/demo/d2-crud/
|
||||
|
||||
# node 覆盖率文件
|
||||
coverage/
|
||||
|
||||
# 忽略文件
|
||||
**/*-min.js
|
||||
**/*.min.js
|
|
@ -0,0 +1,28 @@
|
|||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
'extends': [
|
||||
'plugin:vue/essential',
|
||||
'@vue/standard'
|
||||
],
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||
},
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
files: [
|
||||
'**/__tests__/*.{j,t}s?(x)',
|
||||
'**/tests/unit/**/*.spec.{j,t}s?(x)'
|
||||
],
|
||||
env: {
|
||||
jest: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,21 @@
|
|||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
|
@ -0,0 +1,5 @@
|
|||
module.exports = {
|
||||
plugins: {
|
||||
autoprefixer: {}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2018 李杨
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
|
@ -0,0 +1,11 @@
|
|||
# d2-crud-plus与d2-admin集成启动项目
|
||||
|
||||
## 修改之处
|
||||
1. `main.js` import `'./busienss'`
|
||||
2. `business/index.js` 进行`d2-crud-plus`的初始化工作
|
||||
3. 请求返回结果去掉`.data`,将`{code,msg,data}`整体传递到下层
|
||||
4. `views/demo` 为示例页面
|
||||
|
||||
|
||||
## 带权限版本
|
||||
请checkout permission分支
|
|
@ -0,0 +1,26 @@
|
|||
[D2Admin](https://github.com/d2-projects/d2-admin) 是一个完全 **开源免费** 的企业中后台产品前端集成方案,使用最新的前端技术栈,小于 60kb 的本地首屏 js 加载,已经做好大部分项目前期准备工作,并且带有大量示例代码,助力管理系统敏捷开发。
|
||||
|
||||
**中文** | [English](https://github.com/d2-projects/d2-admin-start-kit)
|
||||
|
||||
## 预览
|
||||
|
||||
![Deploy preview](https://github.com/d2-projects/d2-admin-start-kit/workflows/Deploy%20preview/badge.svg)
|
||||
[![Netlify Status](https://api.netlify.com/api/v1/badges/08ff8c93-f0a8-497a-a081-440b31fb3aa4/deploy-status)](https://app.netlify.com/sites/d2-admin-start-kit/deploys)
|
||||
|
||||
下列访问地址均由最新的 master 分支代码同时构建部署,访问效果完全一致,请根据自身网络情况选择合适的访问链接。
|
||||
|
||||
| 位置 | 链接 | 部署位置 |
|
||||
| --- | --- | --- |
|
||||
| d2.pub | [preview](https://d2.pub/d2-admin-start-kit/preview) | 中国服务器 |
|
||||
| cdn.d2.pub | [preview](https://cdn.d2.pub/d2-admin-start-kit/preview) | 七牛云 CDN |
|
||||
| github | [preview](https://d2-projects.github.io/d2-admin-start-kit) | GitHub pages |
|
||||
| netlify | [preview](https://d2-admin-start-kit.netlify.com) | Netlify CDN |
|
||||
|
||||
## 其它同步仓库
|
||||
|
||||
| 位置 | 链接 |
|
||||
| --- | --- |
|
||||
| 码云 | [https://gitee.com/d2-projects/d2-admin-start-kit](https://gitee.com/d2-projects/d2-admin-start-kit) |
|
||||
| coding | [https://d2-projects.coding.net/p/d2-projects/d/d2-admin-start-kit/git](https://d2-projects.coding.net/p/d2-projects/d/d2-admin-start-kit/git) |
|
||||
|
||||
> 如果您在 github 仓库下载很慢,可以尝试使用我们的码云仓库克隆代码
|
|
@ -0,0 +1,7 @@
|
|||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
],
|
||||
// 允许两种编码引入方式共存,也就是 common 规范与 es6 规范的共存处理
|
||||
sourceType: 'unambiguous'
|
||||
}
|
|
@ -0,0 +1,165 @@
|
|||
<babeledit_project version="1.2">
|
||||
<!--
|
||||
|
||||
BabelEdit project file
|
||||
https://www.codeandweb.com/babeledit
|
||||
|
||||
This file contains meta data for all translations, but not the translation texts itself.
|
||||
They are stored in framework-specific message files (.json / .vue / .yaml / .properties)
|
||||
|
||||
-->
|
||||
<preset_collections/>
|
||||
<framework>vue-json</framework>
|
||||
<filename>d2-admin.babel</filename>
|
||||
<source_root_dir></source_root_dir>
|
||||
<folder_node>
|
||||
<name></name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>_element</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>ja-JP</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHS</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHT</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<concept_node>
|
||||
<name>_name</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>ja-JP</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHS</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHT</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
<folder_node>
|
||||
<name>page</name>
|
||||
<children>
|
||||
<folder_node>
|
||||
<name>demo</name>
|
||||
<children>
|
||||
<folder_node>
|
||||
<name>playground</name>
|
||||
<children>
|
||||
<folder_node>
|
||||
<name>locales</name>
|
||||
<children>
|
||||
<concept_node>
|
||||
<name>text</name>
|
||||
<definition_loaded>false</definition_loaded>
|
||||
<description></description>
|
||||
<comment></comment>
|
||||
<default_text></default_text>
|
||||
<translations>
|
||||
<translation>
|
||||
<language>en-US</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>ja-JP</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHS</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
<translation>
|
||||
<language>zh-CHT</language>
|
||||
<approved>false</approved>
|
||||
</translation>
|
||||
</translations>
|
||||
</concept_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
</children>
|
||||
</folder_node>
|
||||
<isTemplateProject>false</isTemplateProject>
|
||||
<languages>
|
||||
<language>
|
||||
<code>en-US</code>
|
||||
<source_id></source_id>
|
||||
<source_file>src/locales/en.json</source_file>
|
||||
</language>
|
||||
<language>
|
||||
<code>ja-JP</code>
|
||||
<source_id></source_id>
|
||||
<source_file>src/locales/ja.json</source_file>
|
||||
</language>
|
||||
<language>
|
||||
<code>zh-CHS</code>
|
||||
<source_id></source_id>
|
||||
<source_file>src/locales/zh-chs.json</source_file>
|
||||
</language>
|
||||
<language>
|
||||
<code>zh-CHT</code>
|
||||
<source_id></source_id>
|
||||
<source_file>src/locales/zh-cht.json</source_file>
|
||||
</language>
|
||||
</languages>
|
||||
<translation_files>
|
||||
<translation_file>
|
||||
<file>src/locales/en.json</file>
|
||||
</translation_file>
|
||||
<translation_file>
|
||||
<file>src/locales/ja.json</file>
|
||||
</translation_file>
|
||||
<translation_file>
|
||||
<file>src/locales/zh-chs.json</file>
|
||||
</translation_file>
|
||||
<translation_file>
|
||||
<file>src/locales/zh-cht.json</file>
|
||||
</translation_file>
|
||||
</translation_files>
|
||||
<editor_configuration>
|
||||
<save_empty_translations>true</save_empty_translations>
|
||||
<copy_templates>
|
||||
<copy_template>$t('%1')</copy_template>
|
||||
<copy_template>{{ $t('%1') }}</copy_template>
|
||||
<copy_template>this.$t('%1')</copy_template>
|
||||
</copy_templates>
|
||||
</editor_configuration>
|
||||
<primary_language>zh-CHS</primary_language>
|
||||
<configuration>
|
||||
<indent>tab</indent>
|
||||
<format>namespaced-json</format>
|
||||
</configuration>
|
||||
</babeledit_project>
|
|
@ -0,0 +1,22 @@
|
|||
module.exports = [
|
||||
{ name: 'vue', library: 'Vue', js: 'https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js', css: '' },
|
||||
{ name: 'vue-i18n', library: 'VueI18n', js: 'https://cdn.jsdelivr.net/npm/vue-i18n@8.15.1/dist/vue-i18n.min.js', css: '' },
|
||||
{ name: 'vue-router', library: 'VueRouter', js: 'https://cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js', css: '' },
|
||||
{ name: 'vuex', library: 'Vuex', js: 'https://cdn.jsdelivr.net/npm/vuex@3.1.2/dist/vuex.min.js', css: '' },
|
||||
{ name: 'axios', library: 'axios', js: 'https://cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js', css: '' },
|
||||
{ name: 'better-scroll', library: 'BScroll', js: 'https://cdn.jsdelivr.net/npm/better-scroll@1.15.2/dist/bscroll.min.js', css: '' },
|
||||
{ name: 'axios-mock-adapter', library: 'AxiosMockAdapter', js: 'https://cdn.jsdelivr.net/npm/axios-mock-adapter@1.18.1/dist/axios-mock-adapter.min.js', css: '' },
|
||||
{ name: 'element-ui', library: 'ELEMENT', js: 'https://cdn.jsdelivr.net/npm/element-ui@2.15.5/lib/index.js', css: 'https://cdn.jsdelivr.net/npm/element-ui@2.15.5/lib/theme-chalk/index.css' },
|
||||
{ name: 'lodash', library: '_', js: 'https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js', css: '' },
|
||||
{ name: 'ua-parser-js', library: 'UAParser', js: 'https://cdn.jsdelivr.net/npm/ua-parser-js@0.7.20/dist/ua-parser.min.js', css: '' },
|
||||
{ name: 'js-cookie', library: 'Cookies', js: 'https://cdn.jsdelivr.net/npm/js-cookie@2.2.1/src/js.cookie.min.js', css: '' },
|
||||
{ name: 'nprogress', library: 'NProgress', js: 'https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js', css: 'https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.css' },
|
||||
{ name: 'dayjs', library: 'dayjs', js: 'https://cdn.jsdelivr.net/npm/dayjs@1.8.17/dayjs.min.js', css: '' },
|
||||
{ name: 'fuse.js', library: 'Fuse', js: 'https://cdn.jsdelivr.net/npm/fuse.js@5.2.3/dist/fuse.min.js', css: '' },
|
||||
{ name: 'hotkeys-js', library: 'hotkeys', js: 'https://cdn.jsdelivr.net/npm/hotkeys-js@3.7.3/dist/hotkeys.min.js', css: '' },
|
||||
{ name: 'qs', library: 'Qs', js: 'https://cdn.jsdelivr.net/npm/qs@6.9.1/dist/qs.js', css: '' },
|
||||
{ name: 'lowdb', library: 'low', js: 'https://cdn.jsdelivr.net/npm/lowdb@1.0.0/dist/low.min.js', css: '' },
|
||||
{ name: 'lowdb/adapters/LocalStorage', library: 'LocalStorage', js: 'https://cdn.jsdelivr.net/npm/lowdb@1.0.0/dist/LocalStorage.min.js', css: '' },
|
||||
{ name: 'screenfull', library: 'screenfull', js: 'https://cdn.jsdelivr.net/npm/screenfull@5.0.2/dist/screenfull.min.js', css: '' },
|
||||
{ name: 'sortablejs', library: 'Sortable', js: 'https://cdn.jsdelivr.net/npm/sortablejs@1.10.1/Sortable.min.js', css: '' }
|
||||
]
|
|
@ -0,0 +1,3 @@
|
|||
module.exports = {
|
||||
preset: '@vue/cli-plugin-unit-jest'
|
||||
}
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "es2017",
|
||||
"allowSyntheticDefaultImports": false,
|
||||
"baseUrl": "./",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"exclude": ["node_modules", "dist"]
|
||||
}
|
|
@ -0,0 +1,89 @@
|
|||
{
|
||||
"name": "django-vue-admin",
|
||||
"version": "2.0.0",
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve --open",
|
||||
"start": "npm run serve",
|
||||
"dev": "npm run serve",
|
||||
"build": "vue-cli-service build",
|
||||
"build:preview": "NODE_OPTIONS=--max_old_space_size=4096 vue-cli-service build --mode preview",
|
||||
"lint": "vue-cli-service lint --fix",
|
||||
"test:unit": "vue-cli-service test:unit",
|
||||
"test": "vue-cli-service build --mode test"
|
||||
},
|
||||
"dependencies": {
|
||||
"@great-dream/template": "^1.0.2",
|
||||
"@vue/composition-api": "^1.0.4",
|
||||
"axios": "^0.19.0",
|
||||
"axios-mock-adapter": "^1.18.1",
|
||||
"better-scroll": "^1.15.2",
|
||||
"china-division": "^2.4.0",
|
||||
"core-js": "^3.4.3",
|
||||
"cropperjs": "^1.5.6",
|
||||
"d2-crud-plus": "^2.13.1",
|
||||
"d2-crud-x": "^2.13.1",
|
||||
"d2p-extends": "^2.13.1",
|
||||
"dayjs": "^1.8.17",
|
||||
"echarts": "^5.1.2",
|
||||
"el-phone-number-input": "^1.1.5",
|
||||
"element-ui": "^2.15.5",
|
||||
"faker": "^4.1.0",
|
||||
"flex.css": "^1.1.7",
|
||||
"fuse.js": "^5.2.3",
|
||||
"hotkeys-js": "^3.7.3",
|
||||
"js-cookie": "^2.2.1",
|
||||
"js-md5": "^0.7.3",
|
||||
"lodash": "^4.17.15",
|
||||
"lowdb": "^1.0.0",
|
||||
"nprogress": "^0.2.0",
|
||||
"screenfull": "^5.0.2",
|
||||
"sortablejs": "^1.10.1",
|
||||
"ua-parser-js": "^0.7.20",
|
||||
"vue": "^2.6.11",
|
||||
"vue-echarts": "^6.0.0-rc.6",
|
||||
"vue-i18n": "^8.15.1",
|
||||
"vue-router": "^3.1.3",
|
||||
"vue-splitpane": "^1.0.6",
|
||||
"vuex": "^3.1.2",
|
||||
"vxe-table": "^3.3.2",
|
||||
"xe-utils": "^3.2.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@d2-projects/vue-filename-injector": "^1.1.0",
|
||||
"@kazupon/vue-i18n-loader": "^0.5.0",
|
||||
"@vue/cli-plugin-babel": "^4.1.0",
|
||||
"@vue/cli-plugin-eslint": "^4.1.0",
|
||||
"@vue/cli-plugin-router": "^4.1.0",
|
||||
"@vue/cli-plugin-unit-jest": "^4.1.0",
|
||||
"@vue/cli-plugin-vuex": "^4.1.0",
|
||||
"@vue/cli-service": "^4.1.0",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"@vue/test-utils": "^1.0.2",
|
||||
"babel-eslint": "^10.0.3",
|
||||
"compression-webpack-plugin": "^3.0.1",
|
||||
"cz-conventional-changelog": "^3.2.0",
|
||||
"eslint": "^6.8.0",
|
||||
"eslint-plugin-import": "^2.20.2",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.1",
|
||||
"eslint-plugin-vue": "^6.2.2",
|
||||
"sass": "^1.23.7",
|
||||
"sass-loader": "^8.0.0",
|
||||
"svg-sprite-loader": "^4.1.6",
|
||||
"text-loader": "^0.0.1",
|
||||
"vue-cli-plugin-i18n": "^1.0.1",
|
||||
"vue-template-compiler": "^2.6.10",
|
||||
"webpack-bundle-analyzer": "^3.6.0",
|
||||
"webpack-theme-color-replacer": "^1.3.3"
|
||||
},
|
||||
"config": {
|
||||
"commitizen": {
|
||||
"path": "./node_modules/cz-conventional-changelog"
|
||||
}
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/d2-projects/d2-admin.git"
|
||||
}
|
||||
}
|
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 6.3 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 74 KiB |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 75 KiB |
After Width: | Height: | Size: 4.7 KiB |
|
@ -0,0 +1,6 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="white">
|
||||
<path opacity=".25" d="M16 0 A16 16 0 0 0 16 32 A16 16 0 0 0 16 0 M16 4 A12 12 0 0 1 16 28 A12 12 0 0 1 16 4"/>
|
||||
<path d="M16 0 A16 16 0 0 1 32 16 L28 16 A12 12 0 0 0 16 4z">
|
||||
<animateTransform attributeName="transform" type="rotate" from="0 16 16" to="360 16 16" dur="0.8s" repeatCount="indefinite" />
|
||||
</path>
|
||||
</svg>
|
After Width: | Height: | Size: 422 B |
After Width: | Height: | Size: 4.2 KiB |
After Width: | Height: | Size: 113 KiB |
After Width: | Height: | Size: 3.3 KiB |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 8.5 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 7.8 KiB |
After Width: | Height: | Size: 4.7 KiB |
After Width: | Height: | Size: 3.3 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 14 KiB |
After Width: | Height: | Size: 86 KiB |
After Width: | Height: | Size: 3.3 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 376 KiB |
After Width: | Height: | Size: 359 KiB |
After Width: | Height: | Size: 3.2 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 1.9 MiB |
After Width: | Height: | Size: 3.6 KiB |
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 9.9 KiB |
After Width: | Height: | Size: 3.2 KiB |
After Width: | Height: | Size: 2.2 KiB |
After Width: | Height: | Size: 45 KiB |
|
@ -0,0 +1,98 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>icon.ico">
|
||||
<!-- 使用 CDN 加速的 CSS 文件,配置在 vue.config.js 下 -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.css) { %>
|
||||
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style">
|
||||
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet">
|
||||
<% } %>
|
||||
<!-- 使用 CDN 加速的 JS 文件,配置在 vue.config.js 下 -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
|
||||
<link href="<%= htmlWebpackPlugin.options.cdn.js[i] %>" rel="preload" as="script">
|
||||
<% } %>
|
||||
<title>
|
||||
<%= VUE_APP_TITLE %>
|
||||
</title>
|
||||
<style>
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.d2-home {
|
||||
background-color: #303133;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.d2-home__main {
|
||||
user-select: none;
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.d2-home__footer {
|
||||
width: 100%;
|
||||
flex-grow: 0;
|
||||
text-align: center;
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
.d2-home__footer>a {
|
||||
font-size: 12px;
|
||||
color: #ABABAB;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.d2-home__loading {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
var hmid = "3824e56a483ef95673d119166354712c";
|
||||
(function () { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?" + hmid; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })();
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>
|
||||
Sorry, D2Admin will not work properly without JavaScript support. Enable JavaScript for browsers and continue.
|
||||
</strong>
|
||||
</noscript>
|
||||
<div id="app">
|
||||
<div class="d2-home">
|
||||
<div class="d2-home__main">
|
||||
<img class="d2-home__loading" src="./image/loading/loading-spin.svg" alt="loading">
|
||||
</div>
|
||||
<div class="d2-home__footer">
|
||||
<a href="https://gitee.com/liqianglog/django-vue-admin-pro" target="_blank">
|
||||
https://gitee.com/liqianglog/django-vue-admin-pro
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 使用 CDN 加速的 JS 文件,配置在 vue.config.js 下 -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
|
||||
<script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
|
||||
<% } %>
|
||||
</body>
|
||||
|
||||
</html>
|
|
@ -0,0 +1,29 @@
|
|||
<template>
|
||||
<div id="app">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import util from '@/libs/util'
|
||||
export default {
|
||||
name: 'app',
|
||||
watch: {
|
||||
'$i18n.locale': 'i18nHandle'
|
||||
},
|
||||
created () {
|
||||
this.i18nHandle(this.$i18n.locale)
|
||||
},
|
||||
methods: {
|
||||
i18nHandle (val, oldVal) {
|
||||
util.cookies.set('lang', val)
|
||||
document.querySelector('html').setAttribute('lang', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "~@/assets/style/public-class.scss";
|
||||
@import "~@/assets/style/yxt-public.scss";
|
||||
</style>
|
|
@ -0,0 +1,17 @@
|
|||
import { assign, map } from 'lodash'
|
||||
import faker from 'faker/locale/zh_CN'
|
||||
import { service, request, serviceForMock, requestForMock, mock } from './service'
|
||||
import * as tools from './tools'
|
||||
|
||||
const files = require.context('./modules', true, /\.api\.js$/)
|
||||
const generators = files.keys().map(key => files(key).default)
|
||||
|
||||
export default assign({}, ...map(generators, generator => generator({
|
||||
service,
|
||||
request,
|
||||
serviceForMock,
|
||||
requestForMock,
|
||||
mock,
|
||||
faker,
|
||||
tools
|
||||
})))
|
|
@ -0,0 +1,31 @@
|
|||
import { find, assign } from 'lodash'
|
||||
|
||||
const users = [
|
||||
{ username: 'admin', password: 'admin', uuid: 'admin-uuid', name: 'Admin' },
|
||||
{ username: 'editor', password: 'editor', uuid: 'editor-uuid', name: 'Editor' },
|
||||
{ username: 'user1', password: 'user1', uuid: 'user1-uuid', name: 'User1' }
|
||||
]
|
||||
|
||||
export default ({ service, request, serviceForMock, requestForMock, mock, faker, tools }) => ({
|
||||
/**
|
||||
* @description 登录
|
||||
* @param {Object} data 登录携带的信息
|
||||
*/
|
||||
SYS_USER_LOGIN (data = {}) {
|
||||
// 模拟数据
|
||||
mock
|
||||
.onAny('/login')
|
||||
.reply(config => {
|
||||
const user = find(users, tools.parse(config.data))
|
||||
return user
|
||||
? tools.responseSuccess(assign({}, user, { token: faker.random.uuid() }))
|
||||
: tools.responseError({}, '账号或密码不正确')
|
||||
})
|
||||
// 接口请求
|
||||
return requestForMock({
|
||||
url: '/login',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
})
|
|
@ -0,0 +1,239 @@
|
|||
import axios from 'axios'
|
||||
import Adapter from 'axios-mock-adapter'
|
||||
import { get } from 'lodash'
|
||||
import util from '@/libs/util'
|
||||
import { dataNotFound, errorCreate, errorLog } from './tools'
|
||||
import router from '@/router'
|
||||
import qs from 'qs'
|
||||
|
||||
/**
|
||||
* @description 创建请求实例
|
||||
*/
|
||||
axios.defaults.retry = 1
|
||||
axios.defaults.retryDelay = 1000
|
||||
|
||||
export function getErrorMessage (msg) {
|
||||
if (typeof msg === 'string') {
|
||||
return msg
|
||||
}
|
||||
if (typeof msg === 'object') {
|
||||
if (msg.code === 'token_not_valid') {
|
||||
util.cookies.remove('token')
|
||||
util.cookies.remove('uuid')
|
||||
router.push({ path: '/login' })
|
||||
router.go(0)
|
||||
return '登录超时,请重新登录!'
|
||||
}
|
||||
if (msg.code === 'user_not_found') {
|
||||
util.cookies.remove('token')
|
||||
util.cookies.remove('uuid')
|
||||
router.push({ path: '/login' })
|
||||
router.go(0)
|
||||
return '用户无效,请重新登录!'
|
||||
}
|
||||
return Object.values(msg)
|
||||
}
|
||||
if (Object.prototype.toString.call(msg).slice(8, -1) === 'Array') {
|
||||
return msg
|
||||
}
|
||||
return msg
|
||||
}
|
||||
|
||||
function createService () {
|
||||
// 创建一个 axios 实例
|
||||
const service = axios.create({
|
||||
baseURL: process.env.VUE_APP_API_URL,
|
||||
timeout: 20000,
|
||||
paramsSerializer: (params) => qs.stringify(params, { indices: false })
|
||||
})
|
||||
// 请求拦截
|
||||
service.interceptors.request.use(
|
||||
config => config,
|
||||
error => {
|
||||
// 发送失败
|
||||
console.log(error)
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
// 响应拦截
|
||||
service.interceptors.response.use(
|
||||
response => {
|
||||
// dataAxios 是 axios 返回数据中的 data
|
||||
let dataAxios = response.data
|
||||
if (response.headers['content-disposition']) {
|
||||
dataAxios = response
|
||||
}
|
||||
// 这个状态码是和后端约定的
|
||||
const { code } = dataAxios
|
||||
// 根据 code 进行判断
|
||||
if (code === undefined) {
|
||||
// 如果没有 code 代表这不是项目后端开发的接口 比如可能是 D2Admin 请求最新版本
|
||||
return dataAxios
|
||||
} else {
|
||||
// 有 code 代表这是一个后端接口 可以进行进一步的判断
|
||||
switch (code) {
|
||||
case 2000:
|
||||
// [ 示例 ] code === 2000 代表没有错误
|
||||
// TODO 可能结果还需要code和msg进行后续处理,所以去掉.data返回全部结果
|
||||
// return dataAxios.data
|
||||
return dataAxios
|
||||
case 401:
|
||||
// TODO 置换token 未完善
|
||||
util.cookies.remove('token')
|
||||
util.cookies.remove('uuid')
|
||||
util.cookies.remove('refresh')
|
||||
router.push({ path: '/login' })
|
||||
errorCreate(`${getErrorMessage(dataAxios.msg)}`)
|
||||
break
|
||||
case 404:
|
||||
dataNotFound(`${dataAxios.msg}`)
|
||||
break
|
||||
case 4000:
|
||||
// 删除cookie
|
||||
errorCreate(`${getErrorMessage(dataAxios.msg)}`)
|
||||
break
|
||||
case 400:
|
||||
errorCreate(`${dataAxios.msg}`)
|
||||
break
|
||||
default:
|
||||
// 不是正确的 code
|
||||
errorCreate(`${dataAxios.msg}: ${response.config.url}`)
|
||||
break
|
||||
}
|
||||
}
|
||||
},
|
||||
error => {
|
||||
const status = get(error, 'response.status')
|
||||
switch (status) {
|
||||
case 400:
|
||||
error.message = '请求错误'
|
||||
break
|
||||
case 401:
|
||||
refreshTken().then(res => {
|
||||
util.cookies.set('token', res.access)
|
||||
}).catch(e => {
|
||||
router.push({ name: 'login' })
|
||||
router.go(0)
|
||||
error.message = '未认证,请登录'
|
||||
})
|
||||
break
|
||||
case 403:
|
||||
error.message = '拒绝访问'
|
||||
break
|
||||
case 404:
|
||||
error.message = `请求地址出错: ${error.response.config.url}`
|
||||
break
|
||||
case 408:
|
||||
error.message = '请求超时'
|
||||
break
|
||||
case 500:
|
||||
error.message = '服务器内部错误'
|
||||
break
|
||||
case 501:
|
||||
error.message = '服务未实现'
|
||||
break
|
||||
case 502:
|
||||
error.message = '网关错误'
|
||||
break
|
||||
case 503:
|
||||
error.message = '服务不可用'
|
||||
break
|
||||
case 504:
|
||||
error.message = '网关超时'
|
||||
break
|
||||
case 505:
|
||||
error.message = 'HTTP版本不受支持'
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
errorLog(error)
|
||||
return Promise.reject(error)
|
||||
}
|
||||
)
|
||||
return service
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 创建请求方法
|
||||
* @param {Object} service axios 实例
|
||||
*/
|
||||
function createRequestFunction (service) {
|
||||
// 校验是否为租户模式。租户模式把域名替换成 域名 加端口
|
||||
return function (config) {
|
||||
const token = util.cookies.get('token')
|
||||
// 进行布尔值兼容
|
||||
var params = get(config, 'params', {})
|
||||
for (const key of Object.keys(params)) {
|
||||
if (String(params[key]) === 'true') {
|
||||
params[key] = 1
|
||||
}
|
||||
if (String(params[key]) === 'false') {
|
||||
params[key] = 0
|
||||
}
|
||||
}
|
||||
const configDefault = {
|
||||
headers: {
|
||||
Authorization: 'JWT ' + token,
|
||||
'Content-Type': get(config, 'headers.Content-Type', 'application/json')
|
||||
},
|
||||
timeout: 60000,
|
||||
baseURL: util.baseURL(),
|
||||
data: {},
|
||||
params: params
|
||||
}
|
||||
return service(Object.assign(configDefault, config))
|
||||
}
|
||||
}
|
||||
|
||||
// 用于真实网络请求的实例和请求方法
|
||||
export const service = createService()
|
||||
export const request = createRequestFunction(service)
|
||||
|
||||
// 用于模拟网络请求的实例和请求方法
|
||||
export const serviceForMock = createService()
|
||||
export const requestForMock = createRequestFunction(serviceForMock)
|
||||
|
||||
// 网络请求数据模拟工具
|
||||
export const mock = new Adapter(serviceForMock)
|
||||
|
||||
// 刷新token
|
||||
const refreshTken = function () {
|
||||
const refresh = util.cookies.get('refresh')
|
||||
return request({
|
||||
url: 'token/refresh/',
|
||||
method: 'post',
|
||||
data: {
|
||||
refresh: refresh
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 下载文件
|
||||
* @param url
|
||||
* @param params
|
||||
* @param filename
|
||||
*/
|
||||
export const downloadFile = function ({ url, data, method, filename }) {
|
||||
request({
|
||||
url: url,
|
||||
method: method,
|
||||
data: data,
|
||||
responseType: 'blob'
|
||||
// headers: {Accept: 'application/vnd.openxmlformats-officedocument'}
|
||||
}).then(res => {
|
||||
const fileName = window.decodeURI(res.headers['content-disposition'].split('=')[1]) || filename + '.xls' || '文件导出.xls'
|
||||
if (res) {
|
||||
const blob = new Blob([res.data], { type: 'charset=utf-8' })
|
||||
const elink = document.createElement('a')
|
||||
elink.download = fileName
|
||||
elink.style.display = 'none'
|
||||
elink.href = URL.createObjectURL(blob)
|
||||
document.body.appendChild(elink)
|
||||
elink.click()
|
||||
URL.revokeObjectURL(elink.href) // 释放URL 对象0
|
||||
document.body.removeChild(elink)
|
||||
}
|
||||
})
|
||||
}
|
|
@ -0,0 +1,119 @@
|
|||
/*
|
||||
* @创建文件时间: 2021-06-01 22:41:19
|
||||
* @Auther: 猿小天
|
||||
* @最后修改人: 猿小天
|
||||
* @最后修改时间: 2021-08-01 02:35:45
|
||||
* 联系Qq:1638245306
|
||||
* @文件介绍:
|
||||
*/
|
||||
import { Message } from 'element-ui'
|
||||
import store from '@/store'
|
||||
import util from '@/libs/util'
|
||||
|
||||
/**
|
||||
* @description 安全地解析 json 字符串
|
||||
* @param {String} jsonString 需要解析的 json 字符串
|
||||
* @param {String} defaultValue 默认值
|
||||
*/
|
||||
export function parse (jsonString = '{}', defaultValue = {}) {
|
||||
let result = defaultValue
|
||||
try {
|
||||
result = JSON.parse(jsonString)
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 接口请求返回
|
||||
* @param {Any} data 返回值
|
||||
* @param {String} msg 状态信息
|
||||
* @param {Number} code 状态码
|
||||
*/
|
||||
export function response (data = {}, msg = '', code = 0) {
|
||||
return [
|
||||
200,
|
||||
{ code, msg, data }
|
||||
]
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 接口请求返回 正确返回
|
||||
* @param {Any} data 返回值
|
||||
* @param {String} msg 状态信息
|
||||
*/
|
||||
export function responseSuccess (data = {}, msg = '成功') {
|
||||
return response(data, msg)
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 接口请求返回 错误返回
|
||||
* @param {Any} data 返回值
|
||||
* @param {String} msg 状态信息
|
||||
* @param {Number} code 状态码
|
||||
*/
|
||||
export function responseError (data = {}, msg = '请求失败', code = 500) {
|
||||
return response(data, msg, code)
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 记录和显示错误
|
||||
* @param {Error} error 错误对象
|
||||
*/
|
||||
export function errorLog (error) {
|
||||
// 添加到日志
|
||||
store.dispatch('d2admin/log/push', {
|
||||
message: '数据请求异常',
|
||||
type: 'danger',
|
||||
meta: {
|
||||
error
|
||||
}
|
||||
})
|
||||
// 打印到控制台
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
util.log.danger('>>>>>> Error >>>>>>')
|
||||
console.log(error)
|
||||
}
|
||||
// 显示提示
|
||||
Message({
|
||||
message: error.message,
|
||||
type: 'error',
|
||||
duration: 5 * 1000
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 创建一个错误
|
||||
* @param {String} msg 错误信息
|
||||
*/
|
||||
export function errorCreate (msg) {
|
||||
const error = new Error(msg)
|
||||
errorLog(error)
|
||||
throw error
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 数据404消息提示
|
||||
* @param {String} msg 错误信息
|
||||
*/
|
||||
export function dataNotFound (msg) {
|
||||
// 显示提示
|
||||
Message({
|
||||
message: msg,
|
||||
type: 'info',
|
||||
duration: 5 * 1000
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @description 数据请求成功
|
||||
* @param {String} msg 成功信息
|
||||
*/
|
||||
export function successMsg (msg) {
|
||||
Message({
|
||||
message: msg,
|
||||
type: 'success',
|
||||
duration: 5 * 1000
|
||||
})
|
||||
}
|
|
@ -0,0 +1,27 @@
|
|||
// 过渡动画 横向渐变
|
||||
.fade-transverse-leave-active,
|
||||
.fade-transverse-enter-active {
|
||||
transition: all .5s;
|
||||
}
|
||||
.fade-transverse-enter {
|
||||
opacity: 0;
|
||||
transform: translateX(-30px);
|
||||
}
|
||||
.fade-transverse-leave-to {
|
||||
opacity: 0;
|
||||
transform: translateX(30px);
|
||||
}
|
||||
|
||||
// 过渡动画 缩放渐变
|
||||
.fade-scale-leave-active,
|
||||
.fade-scale-enter-active {
|
||||
transition: all .3s;
|
||||
}
|
||||
.fade-scale-enter {
|
||||
opacity: 0;
|
||||
transform: scale(1.2);
|
||||
}
|
||||
.fade-scale-leave-to {
|
||||
opacity: 0;
|
||||
transform: scale(0.8);
|
||||
}
|
|
@ -0,0 +1,12 @@
|
|||
// 优化显示
|
||||
html, body {
|
||||
margin: 0px;
|
||||
height: 100%;
|
||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
|
||||
#app {
|
||||
@extend %full;
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,31 @@
|
|||
// element 样式补丁
|
||||
.el-card {
|
||||
&.is-always-shadow {
|
||||
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
|
||||
}
|
||||
&.is-hover-shadow {
|
||||
&:hover {
|
||||
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu--horizontal {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.el-tabs__item:focus.is-active.is-focus:not(:active) {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
// 修复IE宽度不能撑满
|
||||
.el-table__body,
|
||||
.el-table__header {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
// Chrome下表格头部错位修复
|
||||
.el-table th.gutter,
|
||||
.el-table colgroup.gutter {
|
||||
display: table-cell !important;
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
// markdown 样式补丁
|
||||
.markdown-body {
|
||||
ul {
|
||||
list-style: disc;
|
||||
}
|
||||
h1, h2 {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,8 @@
|
|||
#nprogress {
|
||||
.bar {
|
||||
background: $color-primary !important;
|
||||
}
|
||||
.peg {
|
||||
box-shadow: 0 0 10px $color-primary, 0 0 5px $color-primary !important;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
.tree-view-wrapper.tree-view-small {
|
||||
.tree-view-item {
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
// vue-splitpane 样式补丁
|
||||
.vue-grid-item {
|
||||
&.vue-grid-placeholder {
|
||||
border: 1px solid $color-border-1;
|
||||
background-color: rgba(#FFF, .3);
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
// vue-splitpane 样式补丁
|
||||
.splitter-pane-resizer {
|
||||
background-color: $color-border-1 !important;
|
||||
opacity: 1 !important;
|
||||
}
|
|
@ -0,0 +1,67 @@
|
|||
@import 'public';
|
||||
|
||||
// 补丁 base
|
||||
@import '~@/assets/style/fixed/base.scss';
|
||||
// 补丁 element
|
||||
@import '~@/assets/style/fixed/element.scss';
|
||||
// 补丁 markdown
|
||||
@import '~@/assets/style/fixed/markdown.scss';
|
||||
// 补丁 n-progress
|
||||
@import '~@/assets/style/fixed/n-progress.scss';
|
||||
// 补丁 vue-splitpane
|
||||
@import '~@/assets/style/fixed/vue-splitpane.scss';
|
||||
// 补丁 vue-grid-layout
|
||||
@import '~@/assets/style/fixed/vue-grid-layout.scss';
|
||||
// 补丁 tree-view
|
||||
@import '~@/assets/style/fixed/tree-view.scss';
|
||||
|
||||
// 动画
|
||||
@import '~@/assets/style/animate/vue-transition.scss';
|
||||
|
||||
// 在这里写公用的class
|
||||
// 注意 这个文件里只写class
|
||||
// mixin等内容请在 public.scss 里书写
|
||||
|
||||
// 文字相关
|
||||
.#{$prefix}-text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
// 浮动相关
|
||||
.#{$prefix}-fl {
|
||||
float: left;
|
||||
}
|
||||
.#{$prefix}-fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
// 边距相关
|
||||
$sizes: (0, 5, 10, 15, 20);
|
||||
|
||||
@for $index from 1 to 6 {
|
||||
.#{$prefix}-m-#{nth($sizes, $index)} { margin: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-mt-#{nth($sizes, $index)} { margin-top: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-mr-#{nth($sizes, $index)} { margin-right: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-mb-#{nth($sizes, $index)} { margin-bottom: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-ml-#{nth($sizes, $index)} { margin-left: #{nth($sizes, $index)}px !important; }
|
||||
|
||||
.#{$prefix}-p-#{nth($sizes, $index)} { padding: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-pt-#{nth($sizes, $index)} { padding-top: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-pr-#{nth($sizes, $index)} { padding-right: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-pb-#{nth($sizes, $index)} { padding-bottom: #{nth($sizes, $index)}px !important; }
|
||||
.#{$prefix}-pl-#{nth($sizes, $index)} { padding-left: #{nth($sizes, $index)}px !important; }
|
||||
}
|
||||
|
||||
// 快速使用
|
||||
|
||||
.#{$prefix}-m { margin: 20px !important; }
|
||||
.#{$prefix}-mt { margin-top: 20px !important; }
|
||||
.#{$prefix}-mr { margin-right: 20px !important; }
|
||||
.#{$prefix}-mb { margin-bottom: 20px !important; }
|
||||
.#{$prefix}-ml { margin-left: 20px !important; }
|
||||
|
||||
.#{$prefix}-p { padding: 20px !important; }
|
||||
.#{$prefix}-pt { padding-top: 20px !important; }
|
||||
.#{$prefix}-pr { padding-right: 20px !important; }
|
||||
.#{$prefix}-pb { padding-bottom: 20px !important; }
|
||||
.#{$prefix}-pl { padding-left: 20px !important; }
|
|
@ -0,0 +1,44 @@
|
|||
@import '~@/assets/style/unit/color.scss';
|
||||
|
||||
// 工具类名统一前缀
|
||||
$prefix: d2;
|
||||
|
||||
// 禁止用户选中 鼠标变为手形
|
||||
%unable-select {
|
||||
user-select: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// 填满父元素
|
||||
// 组要父元素 position: relative | absolute;
|
||||
%full {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
// flex 垂直水平居中
|
||||
%flex-center-row {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
%flex-center-col {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
// 将元素模拟成卡片外观
|
||||
%card {
|
||||
border: 1px solid #dddee1;
|
||||
border-color: #e9eaec;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'chester';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #2C3643;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: #FFFFFF;
|
||||
$theme-message-info-text-color: #222A34;
|
||||
$theme-message-info-border-color: #222A34;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, 1);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid #CFD7E5;
|
||||
$theme-container-border-outer: 1px solid #2A2D2E;
|
||||
|
||||
$theme-multiple-page-control-color: #CCCCCC;
|
||||
$theme-multiple-page-control-color-active: #242D38;
|
||||
$theme-multiple-page-control-nav-prev-color: #CCCCCC;
|
||||
$theme-multiple-page-control-nav-next-color: #CCCCCC;
|
||||
$theme-multiple-page-control-border-color: #2A2D2E;
|
||||
$theme-multiple-page-control-border-color-active: #FFFFFF;
|
||||
$theme-multiple-page-control-background-color: #242D38;
|
||||
$theme-multiple-page-control-background-color-active: #FFFFFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #CCCCCC;
|
||||
$theme-menu-item-background-color-hover: #2A2D2E;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: #CCCCCC;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #CCCCCC;
|
||||
$theme-header-item-background-color-hover: #2A2D2E;
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #CCCCCC;
|
||||
$theme-header-item-background-color-focus: #222A34;
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #FFFFFF;
|
||||
$theme-header-item-background-color-active: #222A34;
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: #CCCCCC;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #CCCCCC;
|
||||
$theme-aside-item-background-color-hover: #2A2D2E;
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #CCCCCC;
|
||||
$theme-aside-item-background-color-focus: #222A34;
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #FFFFFF;
|
||||
$theme-aside-item-background-color-active: #222A34;
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: #CCCCCC;
|
||||
$theme-aside-menu-empty-text-color: #CCCCCC;
|
||||
$theme-aside-menu-empty-background-color: #242D38;
|
||||
$theme-aside-menu-empty-icon-color-hover: #FFFFFF;
|
||||
$theme-aside-menu-empty-text-color-hover: #FFFFFF;
|
||||
$theme-aside-menu-empty-background-color-hover: #242D38;
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'd2';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #ebf1f6;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: $color-bg;
|
||||
$theme-message-info-text-color: $color-text-normal;
|
||||
$theme-message-info-border-color: $color-border-1;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, 1);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid #cfd7e5;
|
||||
$theme-container-border-outer: 1px solid #cfd7e5;
|
||||
|
||||
$theme-multiple-page-control-color: $color-text-normal;
|
||||
$theme-multiple-page-control-color-active: #2f74ff;
|
||||
$theme-multiple-page-control-nav-prev-color: #cfd7e5;
|
||||
$theme-multiple-page-control-nav-next-color: #cfd7e5;
|
||||
$theme-multiple-page-control-border-color: #cfd7e5;
|
||||
$theme-multiple-page-control-border-color-active: #FFF;
|
||||
$theme-multiple-page-control-background-color: rgba(#000, .03);
|
||||
$theme-multiple-page-control-background-color-active: #FFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #293849;
|
||||
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: $color-text-normal;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #2f74ff;
|
||||
$theme-header-item-background-color-hover: rgba(#FFF, .5);
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #2f74ff;
|
||||
$theme-header-item-background-color-focus: rgba(#FFF, .5);
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #2f74ff;
|
||||
$theme-header-item-background-color-active: rgba(#FFF, .5);
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: $color-text-normal;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #2f74ff;
|
||||
$theme-aside-item-background-color-hover: rgba(#FFF, .5);
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #2f74ff;
|
||||
$theme-aside-item-background-color-focus: rgba(#FFF, .5);
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #2f74ff;
|
||||
$theme-aside-item-background-color-active: rgba(#FFF, .5);
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: $color-text-normal;
|
||||
$theme-aside-menu-empty-text-color: $color-text-normal;
|
||||
$theme-aside-menu-empty-background-color: rgba(#000, .03);
|
||||
$theme-aside-menu-empty-icon-color-hover: $color-text-main;
|
||||
$theme-aside-menu-empty-text-color-hover: $color-text-main;
|
||||
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'element';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #314255;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: #FFFFFF;
|
||||
$theme-message-info-text-color: #202D3D;
|
||||
$theme-message-info-border-color: #202D3D;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, 1);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid #CFD7E5;
|
||||
$theme-container-border-outer: 1px solid #011527;
|
||||
|
||||
$theme-multiple-page-control-color: #BFCBD9;
|
||||
$theme-multiple-page-control-color-active: #46A0FC;
|
||||
$theme-multiple-page-control-nav-prev-color: #BFCBD9;
|
||||
$theme-multiple-page-control-nav-next-color: #BFCBD9;
|
||||
$theme-multiple-page-control-border-color: #011527;
|
||||
$theme-multiple-page-control-border-color-active: #FFFFFF;
|
||||
$theme-multiple-page-control-background-color: #212D3D;
|
||||
$theme-multiple-page-control-background-color-active: #FFFFFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #BFCBD9;
|
||||
$theme-menu-item-background-color-hover: #011527;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: #BFCBD9;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #BFCBD9;
|
||||
$theme-header-item-background-color-hover: #011527;
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #BFCBD9;
|
||||
$theme-header-item-background-color-focus: #202D3D;
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #46A0FC;
|
||||
$theme-header-item-background-color-active: #202D3D;
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: #BFCBD9;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #BFCBD9;
|
||||
$theme-aside-item-background-color-hover: #011527;
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #BFCBD9;
|
||||
$theme-aside-item-background-color-focus: #202D3D;
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #46A0FC;
|
||||
$theme-aside-item-background-color-active: #202D3D;
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: #BFCBD9;
|
||||
$theme-aside-menu-empty-text-color: #BFCBD9;
|
||||
$theme-aside-menu-empty-background-color: #202D3D;
|
||||
$theme-aside-menu-empty-icon-color-hover: #46A0FC;
|
||||
$theme-aside-menu-empty-text-color-hover: #46A0FC;
|
||||
$theme-aside-menu-empty-background-color-hover: #202D3D;
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'line';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #f8f8f9;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: $color-bg;
|
||||
$theme-message-info-text-color: $color-text-normal;
|
||||
$theme-message-info-border-color: $color-border-1;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, .8);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid $color-border-2;
|
||||
$theme-container-border-outer: 1px solid #cfd7e5;
|
||||
|
||||
$theme-multiple-page-control-color: #FFF;
|
||||
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||
$theme-multiple-page-control-nav-prev-color: #cfd7e5;
|
||||
$theme-multiple-page-control-nav-next-color: #cfd7e5;
|
||||
$theme-multiple-page-control-border-color: #cfd7e5;
|
||||
$theme-multiple-page-control-border-color-active: #FFF;
|
||||
$theme-multiple-page-control-background-color: #cfd7e5;
|
||||
$theme-multiple-page-control-background-color-active: #FFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #293849;
|
||||
$theme-menu-item-background-color-hover: #EFEFEF;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: $color-text-normal;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: $color-text-main;
|
||||
$theme-header-item-background-color-hover: rgba(#000, .02);
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: $color-text-main;
|
||||
$theme-header-item-background-color-focus: rgba(#000, .02);
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: $color-text-main;
|
||||
$theme-header-item-background-color-active: rgba(#000, .03);
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: $color-text-normal;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: $color-text-main;
|
||||
$theme-aside-item-background-color-hover: rgba(#000, .02);
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: $color-text-main;
|
||||
$theme-aside-item-background-color-focus: rgba(#000, .02);
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: $color-text-main;
|
||||
$theme-aside-item-background-color-active: rgba(#000, .03);
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: $color-text-normal;
|
||||
$theme-aside-menu-empty-text-color: $color-text-normal;
|
||||
$theme-aside-menu-empty-background-color: rgba(#000, .03);
|
||||
$theme-aside-menu-empty-icon-color-hover: $color-text-main;
|
||||
$theme-aside-menu-empty-text-color-hover: $color-text-main;
|
||||
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
|
|
@ -0,0 +1,9 @@
|
|||
@import '~@/assets/style/theme/theme-base.scss';
|
||||
|
||||
@import '~@/assets/style/theme/d2/index.scss';
|
||||
@import '~@/assets/style/theme/chester/index.scss';
|
||||
@import '~@/assets/style/theme/element/index.scss';
|
||||
@import '~@/assets/style/theme/line/index.scss';
|
||||
@import '~@/assets/style/theme/star/index.scss';
|
||||
@import '~@/assets/style/theme/tomorrow-night-blue/index.scss';
|
||||
@import '~@/assets/style/theme/violet/index.scss';
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'star';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #EFF4F8;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, .3);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: $color-bg;
|
||||
$theme-message-info-text-color: $color-text-normal;
|
||||
$theme-message-info-border-color: $color-border-1;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, .9);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid $color-border-1;
|
||||
$theme-container-border-outer: 1px solid #114450;
|
||||
|
||||
$theme-multiple-page-control-color: #FFF;
|
||||
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||
$theme-multiple-page-control-border-color: #114450;
|
||||
$theme-multiple-page-control-border-color-active: #FFF;
|
||||
$theme-multiple-page-control-background-color: rgba(#FFF, .5);
|
||||
$theme-multiple-page-control-background-color-active: #FFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #293849;
|
||||
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: #FFF;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #FFF;
|
||||
$theme-header-item-background-color-hover: rgba(#000, .2);
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #FFF;
|
||||
$theme-header-item-background-color-focus: rgba(#000, .2);
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #FFF;
|
||||
$theme-header-item-background-color-active: rgba(#000, .3);
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: #FFF;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #FFF;
|
||||
$theme-aside-item-background-color-hover: rgba(#000, .2);
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #FFF;
|
||||
$theme-aside-item-background-color-focus: rgba(#000, .2);
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #FFF;
|
||||
$theme-aside-item-background-color-active: rgba(#000, .3);
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: #FFF;
|
||||
$theme-aside-menu-empty-text-color: #FFF;
|
||||
$theme-aside-menu-empty-background-color: rgba(#FFF, .2);
|
||||
$theme-aside-menu-empty-icon-color-hover: #FFF;
|
||||
$theme-aside-menu-empty-text-color-hover: #FFF;
|
||||
$theme-aside-menu-empty-background-color-hover: rgba(#FFF, .3);
|
|
@ -0,0 +1,454 @@
|
|||
// 减小弹出菜单的项目高度
|
||||
.el-menu--popup {
|
||||
.el-menu-item {
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
}
|
||||
.el-submenu__title {
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
// 整体框架结构
|
||||
.d2-layout-header-aside-group {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
min-width: 900px;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
// 背景上面的半透明遮罩
|
||||
.d2-layout-header-aside-mask {
|
||||
@extend %full;
|
||||
}
|
||||
// 内容层
|
||||
.d2-layout-header-aside-content {
|
||||
@extend %full;
|
||||
.d2-theme-header {
|
||||
height: 60px;
|
||||
.d2-theme-header-menu {
|
||||
overflow: hidden;
|
||||
&.is-scrollable {
|
||||
position: relative;
|
||||
padding: 0 20px;
|
||||
.d2-theme-header-menu__prev, .d2-theme-header-menu__next {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
.d2-theme-header-menu__content {
|
||||
overflow: hidden;
|
||||
.d2-theme-header-menu__scroll {
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
-webkit-transition: -webkit-transform .3s;
|
||||
transition: -webkit-transform .3s;
|
||||
transition: transform .3s;
|
||||
transition: transform .3s, -webkit-transform .3s;
|
||||
transition: transform .3s,-webkit-transform .3s;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
.d2-theme-header-menu__prev, .d2-theme-header-menu__next {
|
||||
height: 60px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
}
|
||||
.d2-theme-header-menu__prev {
|
||||
left: 0;
|
||||
border-top-left-radius: 2px;
|
||||
border-bottom-left-radius: 2px;
|
||||
}
|
||||
.d2-theme-header-menu__next {
|
||||
right: 0;
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.d2-theme-container {
|
||||
.d2-theme-container-aside {
|
||||
position: relative;
|
||||
.d2-layout-header-aside-menu-side {
|
||||
@extend %full;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
.d2-theme-container-transition {
|
||||
transition: width .3s;
|
||||
}
|
||||
.d2-theme-container-main {
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.d2-theme-container-main-layer {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
.d2-theme-container-main-body {
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 主题公用
|
||||
.d2-layout-header-aside-group {
|
||||
&.grayMode {
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
-ms-filter: grayscale(100%);
|
||||
-o-filter: grayscale(100%);
|
||||
filter: grayscale(100%);
|
||||
filter: gray;
|
||||
}
|
||||
// 主体
|
||||
.d2-layout-header-aside-content {
|
||||
// [布局] 顶栏
|
||||
.d2-theme-header {
|
||||
// logo区域
|
||||
.logo-group {
|
||||
float: left;
|
||||
text-align: center;
|
||||
img {
|
||||
height: 60px;
|
||||
}
|
||||
}
|
||||
.logo-transition {
|
||||
transition: width .3s;
|
||||
}
|
||||
// 折叠侧边栏切换按钮
|
||||
.toggle-aside-btn {
|
||||
float: left;
|
||||
height: 60px;
|
||||
width: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@extend %unable-select;
|
||||
i {
|
||||
font-size: 20px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
}
|
||||
// [菜单] 顶栏
|
||||
.el-menu {
|
||||
float: left;
|
||||
border-bottom: none;
|
||||
background-color: transparent;
|
||||
%header-menu-item {
|
||||
@extend %unable-select;
|
||||
i.fa {
|
||||
font-size: 16px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
.el-menu-item {
|
||||
@extend %header-menu-item;
|
||||
border-bottom: none;
|
||||
}
|
||||
.el-submenu {
|
||||
@extend %header-menu-item;
|
||||
.el-submenu__title {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 顶栏右侧的按钮
|
||||
.d2-header-right {
|
||||
float: right;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.btn-text {
|
||||
padding: 14px 12px;
|
||||
border-radius: 4px;
|
||||
margin: 0px !important;
|
||||
&.el-color-picker.el-color-picker--mini {
|
||||
padding: 9px 6px;
|
||||
}
|
||||
}
|
||||
.el-dropdown {
|
||||
@extend %unable-select;
|
||||
}
|
||||
}
|
||||
}
|
||||
// [布局] 顶栏下面
|
||||
.d2-theme-container {
|
||||
// 侧边栏
|
||||
.d2-theme-container-aside {
|
||||
%d2-theme-container-aside-menu-icon {
|
||||
width: 20px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
}
|
||||
// [菜单] 正常状态
|
||||
.el-menu {
|
||||
@extend %unable-select;
|
||||
background-color: transparent;
|
||||
border-right: none;
|
||||
.el-menu-item {
|
||||
i {
|
||||
@extend %d2-theme-container-aside-menu-icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-submenu {
|
||||
@extend %unable-select;
|
||||
.el-submenu__title {
|
||||
i {
|
||||
@extend %d2-theme-container-aside-menu-icon;
|
||||
}
|
||||
.el-submenu__icon-arrow {
|
||||
margin-top: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 菜单为空的时候显示的信息
|
||||
.d2-layout-header-aside-menu-empty {
|
||||
height: 160px;
|
||||
margin: 10px;
|
||||
margin-top: 0px;
|
||||
border-radius: 4px;
|
||||
@extend %unable-select;
|
||||
i {
|
||||
font-size: 30px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
span {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
// [菜单] 折叠状态
|
||||
.el-menu--collapse {
|
||||
background-color: transparent;
|
||||
.el-submenu__title {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 右下 主体
|
||||
.d2-theme-container-main {
|
||||
// 主体部分分为多页面控制器 和主体
|
||||
.d2-theme-container-main-header {
|
||||
height: 41px;
|
||||
// 多页面控制器
|
||||
.d2-multiple-page-control-group {
|
||||
padding-right: 20px;
|
||||
.d2-multiple-page-control-content {
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
.d2-multiple-page-control-content-inner {
|
||||
.d2-multiple-page-control {
|
||||
.el-tabs__header.is-top {
|
||||
margin: 0px;
|
||||
}
|
||||
.el-tabs__nav {
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.d2-multiple-page-control-btn {
|
||||
position: relative;
|
||||
bottom: -1px;
|
||||
.el-dropdown {
|
||||
.el-button-group {
|
||||
.el-button:first-child {
|
||||
border-bottom-left-radius: 0px;
|
||||
}
|
||||
.el-button:last-child {
|
||||
border-bottom-right-radius: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 主体
|
||||
.d2-theme-container-main-body {
|
||||
// 布局组件
|
||||
.container-component {
|
||||
@extend %full;
|
||||
overflow: hidden;
|
||||
// 填充式布局组件
|
||||
.d2-container-full {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-full__header {
|
||||
padding: 20px;
|
||||
}
|
||||
.d2-container-full__body {
|
||||
flex-grow: 1;
|
||||
height: 100%;
|
||||
padding: 20px 20px;
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
}
|
||||
.d2-container-full__footer {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
// 填充式布局组件 - 滚动优化
|
||||
.d2-container-full-bs {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-full-bs__header {
|
||||
padding: 20px;
|
||||
}
|
||||
.d2-container-full-bs__body {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.d2-container-full-bs__body-wrapper-inner {
|
||||
padding: 20px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
.d2-container-full-bs__footer {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
// 隐形布局组件
|
||||
.d2-container-ghost {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-ghost__header {
|
||||
padding: 20px;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.d2-container-ghost__body {
|
||||
flex-grow: 1;
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
}
|
||||
.d2-container-ghost__footer {
|
||||
padding: 20px;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
// 隐形布局组件 - 滚动优化
|
||||
.d2-container-ghost-bs {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-ghost-bs__header {
|
||||
padding: 20px;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.d2-container-ghost-bs__body {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.d2-container-ghost-bs__footer {
|
||||
padding: 20px;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
// 卡片式布局组件
|
||||
.d2-container-card {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-card__header {
|
||||
padding: 20px;
|
||||
}
|
||||
.d2-container-card__body {
|
||||
flex-grow: 1;
|
||||
overflow: auto;
|
||||
.d2-container-card__body-card {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding: 20px;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
.d2-container-card__footer {
|
||||
padding: 20px;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
// 卡片式布局组件 - 滚动优化
|
||||
.d2-container-card-bs {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 20px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
.d2-container-card-bs__header {
|
||||
padding: 20px;
|
||||
}
|
||||
.d2-container-card-bs__body {
|
||||
position: relative;
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
.d2-container-card-bs__body-wrapper-inner {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.d2-container-card-bs__body-card {
|
||||
position: relative;
|
||||
padding: 20px;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
.d2-container-card-bs__footer {
|
||||
padding: 20px;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,421 @@
|
|||
// 每个主题特有的设置
|
||||
.theme-#{$theme-name} {
|
||||
|
||||
.el-message {
|
||||
&.el-message--info {
|
||||
background-color: $theme-message-info-background-color;
|
||||
color: $theme-message-info-text-color;
|
||||
border-color: $theme-message-info-border-color;
|
||||
}
|
||||
}
|
||||
|
||||
.el-card {
|
||||
&.d2-card {
|
||||
border: $theme-container-border-outer;
|
||||
.el-card__header {
|
||||
border-bottom: $theme-container-border-outer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 背景图片和遮罩
|
||||
.d2-layout-header-aside-group {
|
||||
background-color: $theme-bg-color;
|
||||
.d2-layout-header-aside-mask {
|
||||
background: $theme-bg-mask;
|
||||
}
|
||||
}
|
||||
|
||||
// 菜单项目
|
||||
@mixin theme-menu-hover-style {
|
||||
color: $theme-menu-item-color-hover;
|
||||
i.fa {
|
||||
color: $theme-menu-item-color-hover;
|
||||
}
|
||||
background: $theme-menu-item-background-color-hover;
|
||||
}
|
||||
%el-menu-icon {
|
||||
i {
|
||||
display: inline-block;
|
||||
width: 14px;
|
||||
text-align: center;
|
||||
margin-right: 5px;
|
||||
}
|
||||
svg {
|
||||
margin: 0px;
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.el-submenu__title {
|
||||
@extend %unable-select;
|
||||
@extend %el-menu-icon;
|
||||
}
|
||||
.el-menu-item {
|
||||
@extend %unable-select;
|
||||
@extend %el-menu-icon;
|
||||
}
|
||||
.el-submenu__title:hover {
|
||||
@include theme-menu-hover-style;
|
||||
}
|
||||
.el-menu-item:hover {
|
||||
@include theme-menu-hover-style;
|
||||
}
|
||||
.el-menu--horizontal .el-menu-item:not(.is-disabled):hover {
|
||||
@include theme-menu-hover-style;
|
||||
}
|
||||
.el-menu--horizontal .el-menu .el-submenu__title:hover {
|
||||
@include theme-menu-hover-style;
|
||||
}
|
||||
|
||||
// 顶栏
|
||||
.d2-theme-header {
|
||||
// 顶栏菜单空间不足时显示的滚动控件
|
||||
.d2-theme-header-menu {
|
||||
.d2-theme-header-menu__prev, .d2-theme-header-menu__next {
|
||||
color: $theme-header-item-color;
|
||||
background: $theme-header-item-background-color;
|
||||
&:hover {
|
||||
color: $theme-header-item-color-hover;
|
||||
background: $theme-header-item-background-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 切换按钮
|
||||
.toggle-aside-btn {
|
||||
i {
|
||||
color: $theme-header-item-color;
|
||||
background: $theme-header-item-background-color;
|
||||
&:hover {
|
||||
color: $theme-header-item-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 顶栏菜单
|
||||
.el-menu {
|
||||
.el-menu-item {
|
||||
transition: border-top-color 0s;
|
||||
color: $theme-header-item-color;
|
||||
background: $theme-header-item-background-color;
|
||||
i.fa { color: inherit; }
|
||||
&:hover {
|
||||
color: $theme-header-item-color-hover;
|
||||
background: $theme-header-item-background-color-hover;
|
||||
i.fa { color: inherit; }
|
||||
}
|
||||
&:focus {
|
||||
color: $theme-header-item-color-focus;
|
||||
background: $theme-header-item-background-color-focus;
|
||||
i.fa { color: inherit; }
|
||||
}
|
||||
&.is-active {
|
||||
color: $theme-header-item-color-active;
|
||||
background: $theme-header-item-background-color-active;
|
||||
i.fa { color: inherit; }
|
||||
}
|
||||
}
|
||||
.el-submenu {
|
||||
&.is-active {
|
||||
.el-submenu__title {
|
||||
color: $theme-header-item-color-active;
|
||||
background: $theme-header-item-background-color-active;
|
||||
i.fa { color: inherit; }
|
||||
}
|
||||
}
|
||||
.el-submenu__title {
|
||||
transition: border-top-color 0s;
|
||||
color: $theme-header-item-color;
|
||||
background: $theme-header-item-background-color;
|
||||
i.fa { color: inherit; }
|
||||
.el-submenu__icon-arrow {
|
||||
color: $theme-header-item-color;
|
||||
}
|
||||
&:hover {
|
||||
color: $theme-header-item-color-hover;
|
||||
background: $theme-header-item-background-color-hover;
|
||||
i.fa { color: inherit; }
|
||||
.el-submenu__icon-arrow {
|
||||
color: $theme-header-item-color-hover;
|
||||
}
|
||||
}
|
||||
&:focus {
|
||||
color: $theme-header-item-color-focus;
|
||||
background: $theme-header-item-background-color-focus;
|
||||
i.fa { color: inherit; }
|
||||
.el-submenu__icon-arrow {
|
||||
color: $theme-header-item-color-focus;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 顶栏右侧
|
||||
.d2-header-right {
|
||||
.btn-text {
|
||||
color: $theme-header-item-color;
|
||||
&.can-hover {
|
||||
&:hover {
|
||||
color: $theme-header-item-color-hover;
|
||||
background: $theme-header-item-background-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// [布局] 顶栏下面
|
||||
.d2-theme-container {
|
||||
// 侧边栏
|
||||
.d2-theme-container-aside {
|
||||
// 菜单为空的时候显示的信息
|
||||
.d2-layout-header-aside-menu-empty {
|
||||
background: $theme-aside-menu-empty-background-color;
|
||||
i {
|
||||
color: $theme-aside-menu-empty-icon-color;
|
||||
}
|
||||
span {
|
||||
color: $theme-aside-menu-empty-text-color;
|
||||
}
|
||||
&:hover {
|
||||
background: $theme-aside-menu-empty-background-color-hover;
|
||||
i {
|
||||
color: $theme-aside-menu-empty-icon-color-hover;
|
||||
}
|
||||
span {
|
||||
color: $theme-aside-menu-empty-text-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
// [菜单] 正常状态
|
||||
.el-menu {
|
||||
.el-menu-item {
|
||||
color: $theme-aside-item-color;
|
||||
background: $theme-aside-item-background-color;
|
||||
i {
|
||||
color: $theme-aside-item-color;
|
||||
}
|
||||
&:hover {
|
||||
color: $theme-aside-item-color-hover;
|
||||
fill: $theme-aside-item-color-hover;
|
||||
background: $theme-aside-item-background-color-hover;
|
||||
i {
|
||||
color: $theme-aside-item-color-hover;
|
||||
}
|
||||
}
|
||||
&:focus {
|
||||
color: $theme-aside-item-color-focus;
|
||||
fill: $theme-aside-item-color-focus;
|
||||
background: $theme-aside-item-background-color-focus;
|
||||
i {
|
||||
color: $theme-aside-item-color-focus;
|
||||
}
|
||||
}
|
||||
&.is-active {
|
||||
color: $theme-aside-item-color-active;
|
||||
fill: $theme-aside-item-color-active;
|
||||
background: $theme-aside-item-background-color-active;
|
||||
i {
|
||||
color: $theme-aside-item-color-active;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-submenu {
|
||||
.el-submenu__title {
|
||||
color: $theme-aside-item-color;
|
||||
background: $theme-aside-item-background-color;
|
||||
i {
|
||||
color: $theme-aside-item-color;
|
||||
}
|
||||
.el-submenu__icon-arrow {
|
||||
color: $theme-aside-item-color;
|
||||
}
|
||||
&:hover {
|
||||
color: $theme-aside-item-color-hover;
|
||||
background: $theme-aside-item-background-color-hover;
|
||||
i {
|
||||
color: $theme-aside-item-color-hover;
|
||||
}
|
||||
.el-submenu__icon-arrow {
|
||||
color: $theme-aside-item-color-hover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.d2-theme-container-main {
|
||||
// 主体部分分为多页面控制器 和主体
|
||||
.d2-theme-container-main-header {
|
||||
// 多页面控制器
|
||||
.d2-multiple-page-control {
|
||||
.el-tabs__header.is-top {
|
||||
border-bottom-color: $theme-multiple-page-control-border-color;
|
||||
}
|
||||
.el-tabs__nav {
|
||||
border-color: $theme-multiple-page-control-border-color;
|
||||
.el-tabs__item {
|
||||
@extend %unable-select;
|
||||
color: $theme-multiple-page-control-color;
|
||||
background-color: $theme-multiple-page-control-background-color;
|
||||
border-left-color: $theme-multiple-page-control-border-color;
|
||||
&:first-child {
|
||||
border-left: none;
|
||||
&:hover {
|
||||
padding: 0px 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-tabs__item.is-active {
|
||||
color: $theme-multiple-page-control-color-active;
|
||||
background-color: $theme-multiple-page-control-background-color-active;
|
||||
border-bottom-color: $theme-multiple-page-control-border-color-active;
|
||||
}
|
||||
}
|
||||
%el-tabs__nav {
|
||||
font-size: 20px;
|
||||
}
|
||||
.el-tabs__nav-prev {
|
||||
@extend %el-tabs__nav;
|
||||
color: $theme-multiple-page-control-nav-prev-color;
|
||||
}
|
||||
.el-tabs__nav-next {
|
||||
@extend %el-tabs__nav;
|
||||
color: $theme-multiple-page-control-nav-next-color;
|
||||
}
|
||||
}
|
||||
// 多页控制器的关闭控制
|
||||
.d2-multiple-page-control-btn {
|
||||
.el-dropdown {
|
||||
.el-button-group {
|
||||
.el-button {
|
||||
border-color: $theme-multiple-page-control-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 主体
|
||||
.d2-theme-container-main-body {
|
||||
// 布局组件
|
||||
.container-component {
|
||||
// [组件]
|
||||
// d2-container-full 填充型
|
||||
.d2-container-full {
|
||||
border: $theme-container-border-outer;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
.d2-container-full__header {
|
||||
border-bottom: $theme-container-border-inner;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-full__body {
|
||||
background: $theme-container-background-color;
|
||||
}
|
||||
.d2-container-full__footer {
|
||||
border-top: $theme-container-border-inner;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
// [组件]
|
||||
// d2-container-full-bs 填充型 滚动优化
|
||||
.d2-container-full-bs {
|
||||
border: $theme-container-border-outer;
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
.d2-container-full-bs__header {
|
||||
border-bottom: $theme-container-border-inner;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-full-bs__body {
|
||||
background: $theme-container-background-color;
|
||||
}
|
||||
.d2-container-full-bs__footer {
|
||||
border-top: $theme-container-border-inner;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
// [组件]
|
||||
// d2-container-ghost 隐形布局组件
|
||||
.d2-container-ghost {
|
||||
.d2-container-ghost__header {
|
||||
border-bottom: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-ghost__footer {
|
||||
border-top: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
// [组件]
|
||||
// d2-container-ghost-bs 隐形布局组件 滚动优化
|
||||
.d2-container-ghost-bs {
|
||||
.d2-container-ghost-bs__header {
|
||||
border-bottom: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-ghost-bs__footer {
|
||||
border-top: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
// [组件]
|
||||
// d2-container-card 卡片型
|
||||
.d2-container-card {
|
||||
.d2-container-card__header {
|
||||
border-bottom: $theme-container-border-inner;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-card__body {
|
||||
.d2-container-card__body-card {
|
||||
background: $theme-container-background-color;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
border-bottom: $theme-container-border-outer;
|
||||
}
|
||||
}
|
||||
.d2-container-card__footer {
|
||||
border-top: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
// [组件]
|
||||
// d2-container-card-bs 卡片型 滚动优化
|
||||
.d2-container-card-bs {
|
||||
.d2-container-card-bs__header {
|
||||
border-bottom: $theme-container-border-inner;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
.d2-container-card-bs__body {
|
||||
.d2-container-card-bs__body-card {
|
||||
background: $theme-container-background-color;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
border-bottom: $theme-container-border-outer;
|
||||
}
|
||||
}
|
||||
.d2-container-card-bs__footer {
|
||||
border-top: $theme-container-border-outer;
|
||||
border-left: $theme-container-border-outer;
|
||||
border-right: $theme-container-border-outer;
|
||||
background: $theme-container-header-footer-background-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,2 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'tomorrow-night-blue';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #002253;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: $color-bg;
|
||||
$theme-message-info-text-color: $color-text-normal;
|
||||
$theme-message-info-border-color: $color-border-1;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: rgba(#FFF, 1);
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid $color-border-1;
|
||||
$theme-container-border-outer: 1px solid #002253;
|
||||
|
||||
$theme-multiple-page-control-color: #FFF;
|
||||
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||
$theme-multiple-page-control-border-color: #002253;
|
||||
$theme-multiple-page-control-border-color-active: #FFF;
|
||||
$theme-multiple-page-control-background-color: rgba(#FFF, .2);
|
||||
$theme-multiple-page-control-background-color-active: #FFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #293849;
|
||||
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: #FF929A;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #FFEBA4;
|
||||
$theme-header-item-background-color-hover: rgba(#FFF, .05);
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #FFB870;
|
||||
$theme-header-item-background-color-focus: rgba(#FFF, .05);
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #FFB870;
|
||||
$theme-header-item-background-color-active: rgba(#FFF, .05);
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: #FF929A;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #FFEBA4;
|
||||
$theme-aside-item-background-color-hover: rgba(#FFF, .05);
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #FFB870;
|
||||
$theme-aside-item-background-color-focus: rgba(#FFF, .05);
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #FFB870;
|
||||
$theme-aside-item-background-color-active: rgba(#FFF, .05);
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: #FFB870;
|
||||
$theme-aside-menu-empty-text-color: #FFB870;
|
||||
$theme-aside-menu-empty-background-color: rgba(#FFF, .1);
|
||||
$theme-aside-menu-empty-icon-color-hover: #FFEBA4;
|
||||
$theme-aside-menu-empty-text-color-hover: #FFEBA4;
|
||||
$theme-aside-menu-empty-background-color-hover: rgba(#FFF, .2);
|
|
@ -0,0 +1,9 @@
|
|||
@import './setting.scss';
|
||||
@import '../theme.scss';
|
||||
|
||||
.theme-#{$theme-name} {
|
||||
.d2-layout-header-aside-group {
|
||||
background: #bc00e3;
|
||||
background: linear-gradient(120deg, #bc00e3 0%, #4EFFFB 100%);
|
||||
}
|
||||
}
|
|
@ -0,0 +1,64 @@
|
|||
// 主题名称
|
||||
$theme-name: 'violet';
|
||||
// 主题背景颜色
|
||||
$theme-bg-color: #000;
|
||||
// 主题背景图片遮罩
|
||||
$theme-bg-mask: rgba(#000, 0);
|
||||
|
||||
// 消息提示
|
||||
$theme-message-info-background-color: $color-bg;
|
||||
$theme-message-info-text-color: $color-text-normal;
|
||||
$theme-message-info-border-color: $color-border-1;
|
||||
|
||||
// container组件
|
||||
$theme-container-background-color: #FFF;
|
||||
$theme-container-header-footer-background-color: #FFF;
|
||||
$theme-container-border-inner: 1px solid $color-border-2;
|
||||
$theme-container-border-outer: 1px solid #8C40E2;
|
||||
|
||||
$theme-multiple-page-control-color: #FFF;
|
||||
$theme-multiple-page-control-color-active: $color-text-normal;
|
||||
$theme-multiple-page-control-nav-prev-color: #FFF;
|
||||
$theme-multiple-page-control-nav-next-color: #FFF;
|
||||
$theme-multiple-page-control-border-color: #8C40E2;
|
||||
$theme-multiple-page-control-border-color-active: #FFF;
|
||||
$theme-multiple-page-control-background-color: rgba(#FFF, .3);
|
||||
$theme-multiple-page-control-background-color-active: #FFF;
|
||||
|
||||
// 顶栏和侧边栏中展开的菜单 hover 状态下
|
||||
$theme-menu-item-color-hover: #293849;
|
||||
$theme-menu-item-background-color-hover: #ecf5ff;
|
||||
|
||||
// 顶栏上的文字颜色
|
||||
$theme-header-item-color: #FFF;
|
||||
$theme-header-item-background-color: transparent;
|
||||
// 顶栏上的项目在 hover 时
|
||||
$theme-header-item-color-hover: #FFF;
|
||||
$theme-header-item-background-color-hover: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||
// 顶栏上的项目在 focus 时
|
||||
$theme-header-item-color-focus: #FFF;
|
||||
$theme-header-item-background-color-focus: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||
// 顶栏上的项目在 active 时
|
||||
$theme-header-item-color-active: #FFF;
|
||||
$theme-header-item-background-color-active: linear-gradient(-180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.12) 100%);
|
||||
|
||||
// 侧边栏上的文字颜色
|
||||
$theme-aside-item-color: #FFF;
|
||||
$theme-aside-item-background-color: transparent;
|
||||
// 侧边栏上的项目在 hover 时
|
||||
$theme-aside-item-color-hover: #FFF;
|
||||
$theme-aside-item-background-color-hover: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||
// 侧边栏上的项目在 focus 时
|
||||
$theme-aside-item-color-focus: #FFF;
|
||||
$theme-aside-item-background-color-focus: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||
// 侧边栏上的项目在 active 时
|
||||
$theme-aside-item-color-active: #FFF;
|
||||
$theme-aside-item-background-color-active: linear-gradient(90deg, rgba(255,255,255,0.28) 0%, rgba(255,255,255,0.00) 100%);
|
||||
|
||||
// 侧边栏菜单为空的时候显示的元素
|
||||
$theme-aside-menu-empty-icon-color: #FFF;
|
||||
$theme-aside-menu-empty-text-color: #FFF;
|
||||
$theme-aside-menu-empty-background-color: rgba(#000, .1);
|
||||
$theme-aside-menu-empty-icon-color-hover: #FFF;
|
||||
$theme-aside-menu-empty-text-color-hover: #FFF;
|
||||
$theme-aside-menu-empty-background-color-hover: rgba(#000, .15);
|
|
@ -0,0 +1,23 @@
|
|||
// 主色
|
||||
$color-primary: #409EFF;
|
||||
|
||||
// 辅助色
|
||||
$color-info: #909399;
|
||||
$color-success: #67C23A;
|
||||
$color-warning: #E6A23C;
|
||||
$color-danger: #F56C6C;
|
||||
|
||||
// 文字
|
||||
$color-text-main: #303133;
|
||||
$color-text-normal: #606266;
|
||||
$color-text-sub: #909399;
|
||||
$color-text-placehoder: #C0C4CC;
|
||||
|
||||
// 边框
|
||||
$color-border-1: #DCDFE6;
|
||||
$color-border-2: #E4E7ED;
|
||||
$color-border-3: #EBEEF5;
|
||||
$color-border-4: #F2F6FC;
|
||||
|
||||
// 背景
|
||||
$color-bg: #f8f8f9;
|
|
@ -0,0 +1,71 @@
|
|||
/*常用 flex 水平居后*/
|
||||
.yxt-flex-end{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
/*常用 flex 水平居前*/
|
||||
.yxt-flex-start{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
/*用 flex 两边对齐*/
|
||||
.yxt-flex-between{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
/*常用 flex 水平居中*/
|
||||
.yxt-flex-center{
|
||||
display: flex;
|
||||
justify-content:center;
|
||||
}
|
||||
/* 常用 flex 垂直居中*/
|
||||
.yxt-flex-align-center{
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
/* 常用 flex 基于底部对齐*/
|
||||
.yxt-flex-align-end{
|
||||
display:flex;
|
||||
align-items:flex-end;
|
||||
}
|
||||
|
||||
/**常用 flex 纵向排列**/
|
||||
.yxt-flex-column{
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
/**垂直竖线,常用于标题**/
|
||||
.yxt-divider{
|
||||
background: #409EFF;
|
||||
width: 8px;
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
/*滚动条凹槽的颜色,还可以设置边框属性 */
|
||||
*::-webkit-scrollbar-track-piece {
|
||||
background-color: #f8f8f8;
|
||||
-webkit-border-radius: 2em;
|
||||
-moz-border-radius: 2em;
|
||||
border-radius: 2em;
|
||||
}
|
||||
/*滚动条的宽度*/
|
||||
*::-webkit-scrollbar {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
}
|
||||
/*滚动条的设置*/
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background-color: #dddddd;
|
||||
background-clip: padding-box;
|
||||
-webkit-border-radius: 2em;
|
||||
-moz-border-radius: 2em;
|
||||
border-radius: 2em;
|
||||
}
|
||||
/*滚动条鼠标移上去*/
|
||||
*::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #bbb;
|
||||
}
|
After Width: | Height: | Size: 7.8 KiB |
|
@ -0,0 +1,13 @@
|
|||
|
||||
<svg viewBox="0 0 60 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>D2Admin</desc>
|
||||
<defs></defs>
|
||||
<g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="logo-no-shadow" transform="translate(-3.000000, -3.000000)">
|
||||
<path d="M44.2833805,33.4299717 L6.05798302,56.3652102 C4.16366196,57.5018028 1.70662094,56.8875426 0.570028297,54.9932215 C0.197031333,54.3715599 8.87839274e-17,53.6602143 0,52.9352385 L-4.4408921e-16,7.06476152 C-7.1463071e-16,4.85562252 1.790861,3.06476152 4,3.06476152 C4.72497578,3.06476152 5.43632142,3.26179285 6.05798302,3.63478981 L44.2833805,26.5700283 C46.1777016,27.7066209 46.7919618,30.163662 45.6553692,32.057983 C45.3175701,32.6209814 44.8463789,33.0921727 44.2833805,33.4299717 Z" id="Triangle-Copy" fill="#35495E" transform="translate(25.000000, 30.000000) rotate(-180.000000) translate(-25.000000, -30.000000) "></path>
|
||||
<path d="M60.2833805,33.4299717 L22.057983,56.3652102 C20.163662,57.5018028 17.7066209,56.8875426 16.5700283,54.9932215 C16.1970313,54.3715599 16,53.6602143 16,52.9352385 L16,7.06476152 C16,4.85562252 17.790861,3.06476152 20,3.06476152 C20.7249758,3.06476152 21.4363214,3.26179285 22.057983,3.63478981 L60.2833805,26.5700283 C62.1777016,27.7066209 62.7919618,30.163662 61.6553692,32.057983 C61.3175701,32.6209814 60.8463789,33.0921727 60.2833805,33.4299717 Z" id="Triangle" fill="#409EFF"></path>
|
||||
<path d="M42.4688663,31.7973091 L24.0289915,42.8612339 C23.081831,43.4295303 21.8533105,43.1224001 21.2850141,42.1752396 C21.0985157,41.8644088 21,41.508736 21,41.1462481 L21,19.0183984 C21,17.9138289 21.8954305,17.0183984 23,17.0183984 C23.3624879,17.0183984 23.7181607,17.116914 24.0289915,17.3034125 L42.4688663,28.3673374 C43.4160268,28.9356337 43.7231569,30.1641542 43.1548606,31.1113147 C42.9859611,31.3928139 42.7503655,31.6284096 42.4688663,31.7973091 Z" id="Triangle-Copy" fill="#FFFFFF" transform="translate(31.000000, 30.082670) rotate(-180.000000) translate(-31.000000, -30.082670) "></path>
|
||||
<path d="M37.5708451,30.8574929 L30.5144958,35.0913025 C30.0409155,35.3754507 29.4266552,35.2218856 29.1425071,34.7483054 C29.0492578,34.59289 29,34.4150536 29,34.2338096 L29,25.7661904 C29,25.2139056 29.4477153,24.7661904 30,24.7661904 C30.1812439,24.7661904 30.3590804,24.8154482 30.5144958,24.9086975 L37.5708451,29.1425071 C38.0444254,29.4266552 38.1979905,30.0409155 37.9138423,30.5144958 C37.8293925,30.6552454 37.7115947,30.7730432 37.5708451,30.8574929 Z" id="Triangle" fill="#409EFF"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 2.6 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627184893235" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4523" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M512 2.56C231.424 2.56 3.584 229.888 3.584 510.976S231.424 1018.88 512 1018.88s508.416-227.328 508.416-508.416S793.088 2.56 512 2.56z m0 941.568c-239.616 0-433.664-194.048-433.664-433.664C78.336 270.848 272.384 76.8 512 76.8s433.664 194.048 433.664 433.664-194.048 433.664-433.664 433.664z" fill="#F4DCCB" p-id="4524"></path><path d="M698.88 598.528c-11.264 0-22.528 2.56-32.256 7.68l-113.152-196.096c18.944-13.312 31.744-35.328 31.744-60.416 0-40.448-32.768-73.216-73.216-73.216s-73.216 32.768-73.216 73.216c0 25.088 12.8 47.104 31.744 60.416l-113.152 196.096c-9.728-4.608-20.992-7.68-32.256-7.68-40.448 0-73.216 32.768-73.216 73.216s32.768 73.216 73.216 73.216c37.376 0 68.096-28.16 72.704-64.512h228.352c4.096 36.352 35.328 64.512 72.704 64.512 40.448 0 73.216-32.768 73.216-73.216s-33.28-73.216-73.216-73.216zM512 425.984l121.856 210.944H390.656L512 425.984z" fill="#FF9D4D" p-id="4525"></path></svg>
|
After Width: | Height: | Size: 1.7 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627184739559" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2033" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M935.559227 528.121166 511.998465 157.511383 88.43975 528.121166l-23.150256-26.446325L511.998465 110.804618l446.711018 390.870222L935.559227 528.121166zM935.559227 528.121166" p-id="2034"></path><path d="M860.216261 913.195382l-280.222169 0 0-215.968773L440.591135 697.226608l0 215.968773L161.359526 913.195382 161.359526 551.71656l348.856339-311.949778 350.000396 311.862797L860.216261 913.195382 860.216261 913.195382zM615.164103 878.053l209.899544 0L825.063647 567.401798 510.273171 286.890033 196.529537 567.431473l0 310.621527 208.910007 0L405.439544 662.075017l209.686696 0 0 215.977983L615.164103 878.053zM615.164103 878.053" p-id="2035"></path></svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627184963540" class="icon" viewBox="0 0 1152 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6293" width="27" height="24" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M352 185.6h704c38.4 0 64-25.6 64-64s-25.6-64-64-64h-704c-38.4 0-64 25.6-64 64s25.6 64 64 64z" p-id="6294"></path><path d="M96 121.6m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" p-id="6295"></path><path d="M1056 441.6h-704c-38.4 0-64 25.6-64 64s25.6 64 64 64h704c38.4 0 64-25.6 64-64s-25.6-64-64-64z" p-id="6296"></path><path d="M96 505.6m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" p-id="6297"></path><path d="M1056 825.6h-704c-38.4 0-64 25.6-64 64s25.6 64 64 64h704c38.4 0 64-25.6 64-64s-25.6-64-64-64z" p-id="6298"></path><path d="M96 889.6m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" p-id="6299"></path></svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627186168071" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7328" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M128 298.666667h768a42.666667 42.666667 0 0 0 0-85.333334H128a42.666667 42.666667 0 0 0 0 85.333334z m768 170.666666H128a42.666667 42.666667 0 0 0 0 85.333334h768a42.666667 42.666667 0 0 0 0-85.333334z m0 256H128a42.666667 42.666667 0 0 0 0 85.333334h768a42.666667 42.666667 0 0 0 0-85.333334z" p-id="7329"></path></svg>
|
After Width: | Height: | Size: 1.1 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627184930997" class="icon" viewBox="0 0 1170 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5351" xmlns:xlink="http://www.w3.org/1999/xlink" width="27" height="24"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M146.285714 0h877.714286a146.285714 146.285714 0 0 1 146.285714 146.285714v731.428572a146.285714 146.285714 0 0 1-146.285714 146.285714H146.285714a146.285714 146.285714 0 0 1-146.285714-146.285714V146.285714a146.285714 146.285714 0 0 1 146.285714-146.285714z m219.428572 585.142857a146.285714 146.285714 0 1 0 0-292.571428 146.285714 146.285714 0 0 0 0 292.571428z m-206.994286 146.285714h413.988571a219.501714 219.501714 0 0 0-413.988571 0zM731.428571 365.714286v73.142857h292.571429V365.714286h-292.571429z m0 219.428571v73.142857h292.571429V585.142857h-292.571429z" p-id="5352"></path></svg>
|
After Width: | Height: | Size: 1.4 KiB |
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1627184853180" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3687" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff2") format("woff2"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.woff") format("woff"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.ttf") format("truetype"), url("//at.alicdn.com/t/font_1031158_1uhr8ri0pk5.svg#iconfont") format("svg"); }
|
||||
</style></defs><path d="M445.781333 378.311111c-19.456 0-35.271111 15.815111-35.271111 35.271111V450.56c0 19.456 15.815111 35.271111 35.271111 35.271111s35.271111-15.815111 35.271111-35.271111v-36.977778c0-19.456-15.815111-35.271111-35.271111-35.271111zM615.879111 485.831111c19.456 0 35.271111-15.815111 35.271111-35.271111v-36.977778c0-19.456-15.815111-35.271111-35.271111-35.271111s-35.271111 15.815111-35.271111 35.271111V450.56c0 19.456 15.815111 35.271111 35.271111 35.271111z" fill="#592B0C" p-id="3688"></path><path d="M791.665778 841.272889c-0.113778-1.024-0.227556-2.048-0.455111-2.958222-6.144-33.678222-22.983111-65.536-47.445334-89.543111-9.329778-9.216-19.456-16.952889-30.378666-23.210667 16.611556-11.377778 32.199111-24.348444 46.762666-38.798222 61.326222-61.326222 95.118222-142.904889 95.118223-229.717334s-33.792-168.391111-95.118223-229.717333-142.904889-95.118222-229.717333-95.118222c-86.812444 0-168.391111 33.792-229.717333 95.118222-61.326222 61.326222-95.118222 142.904889-95.118223 229.717333s33.792 168.391111 95.118223 229.717334c14.449778 14.449778 30.151111 27.420444 46.762666 38.798222-10.581333 6.257778-20.593778 13.994667-29.582222 23.096889-23.665778 24.007111-40.049778 56.775111-46.08 92.16-0.113778 0.568889-0.227556 1.251556-0.227555 1.820444L265.102222 898.844444c-2.275556 19.342222 11.605333 36.864 30.947556 39.139556 1.365333 0.113778 2.730667 0.227556 4.096 0.227556 17.635556 0 32.881778-13.198222 35.043555-31.175112l6.371556-55.296c8.988444-51.086222 44.942222-74.296889 74.638222-74.296888h1.820445l42.894222-2.275556c0.682667 0 1.251556-0.113778 1.820444-0.113778 21.959111 4.664889 44.600889 7.054222 67.584 7.054222 23.096889 0 45.738667-2.389333 67.811556-7.054222 0.682667 0.113778 1.365333 0.113778 2.161778 0.227556l42.439111 2.275555h1.820444c39.253333 0 69.632 36.522667 76.8 72.362667l5.347556 56.433778c1.706667 18.204444 17.066667 31.971556 35.043555 31.971555 1.137778 0 2.275556 0 3.413334-0.113777 19.342222-1.820444 33.678222-19.000889 31.744-38.456889l-5.233778-58.481778zM472.177778 706.901333c-2.730667-1.137778-5.688889-1.820444-8.760889-2.161777-42.780444-11.491556-82.033778-34.133333-114.232889-66.332445-48.469333-48.469333-75.207111-112.867556-75.207111-181.475555s26.737778-133.006222 75.207111-181.475556S462.051556 200.248889 530.659556 200.248889s133.006222 26.737778 181.475555 75.207111c48.469333 48.469333 75.207111 112.867556 75.207111 181.475556S760.490667 589.937778 712.021333 638.293333c-32.312889 32.312889-71.68 54.954667-114.688 66.446223-2.389333 0.341333-4.778667 0.910222-7.054222 1.820444-19.342222 4.551111-39.367111 6.940444-59.733333 6.940444-19.911111 0-39.480889-2.275556-58.368-6.599111z" fill="#592B0C" p-id="3689"></path></svg>
|
After Width: | Height: | Size: 3.4 KiB |
After Width: | Height: | Size: 50 KiB |
|
@ -0,0 +1,7 @@
|
|||
import Vue from 'vue'
|
||||
|
||||
const requireAll = requireContext => requireContext.keys().map(requireContext)
|
||||
const req = require.context('./icons', false, /\.svg$/)
|
||||
const iconMap = requireAll(req)
|
||||
|
||||
Vue.prototype.$IconSvg = iconMap.map(e => e.default.id.slice(3))
|