upgrade version

fix upload Progress freeze

.babelrc

@@ -1,18 +0,0 @@
-{
-  "presets": [
-    ["env", {
-      "modules": false,
-      "targets": {
-        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
-      }
-    }],
-    "stage-2"
-  ],
-  "plugins": ["transform-runtime"],
-  "env": {
-    "test": {
-      "presets": ["env", "stage-2"],
-      "plugins": ["istanbul"]
-    }
-  }
-}

.editorconfig

@@ -1,9 +0,0 @@
-root = true
-
-[*]
-charset = utf-8
-indent_style = space
-indent_size = 2
-end_of_line = lf
-insert_final_newline = true
-trim_trailing_whitespace = true

.eslintignore

@@ -1,8 +0,0 @@
-/build/
-/config/
-/dist/
-/static/
-/*.js
-
-src/common/fork/*
-

.eslintrc.js

@@ -1,65 +0,0 @@
-// https://eslint.org/docs/user-guide/configuring
-
-module.exports = {
-  root: true,
-  parser: 'babel-eslint',
-  parserOptions: {
-    sourceType: 'module'
-  },
-  env: {
-    browser: true,
-  },
-  // https://github.com/standard/standard/blob/master/docs/RULES-en.md
-  extends: 'standard',
-  // required to lint *.vue files
-  plugins: [
-    'html'
-  ],
-  // add your custom rules here
-  'rules': {
-    // allow paren-less arrow functions
-    'arrow-parens': 0,
-    // allow async-await
-    'generator-star-spacing': 0,
-    // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-
-    //ignore the paren check before function.
-    'space-before-function-paren': [0, 'always'],
-    //ignore the space before block.
-    'space-before-blocks': [0, 'always'],
-    //ignore the empty line check.
-    'no-multiple-empty-lines': [0, {'max': 2}],
-    //semicolon or no semicolon is ok.
-    'semi': [0, 'always'],
-    //ignore the space before or after =>
-    'arrow-spacing': 0,
-    //the type of quotes
-    'quotes': [0, 'single'],
-    //block can be padded by blank lines
-    'padded-blocks': 0,
-    //comma spacing before or after.
-    'comma-spacing': 0,
-    //key spacing.
-    'key-spacing': [0, {'beforeColon': false, 'afterColon': true}],
-    //trailing spaces
-    'no-trailing-spaces': 0,
-    //spaced comment
-    'spaced-comment': 0,
-    //keyword-spacing
-    'keyword-spacing': 0,
-    'space-in-parens': 0,
-    'no-extend-native': 0,
-    'no-useless-escape': 0,
-    'no-unused-vars': 0,
-    'no-undef': 0,
-    'no-tabs': 0,
-    'indent': 0,
-    'no-multi-spaces': 0,
-    'eol-last': 0,
-    'no-template-curly-in-string': 0,
-    'no-mixed-spaces-and-tabs': 0,
-    'handle-callback-err': 0,
-    "import/no-webpack-loader-syntax": "off"
-  }
-}

.gitignore

@@ -1,6 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
 .DS_Store
-node_modules/
-/dist/
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
@@ -12,3 +29,7 @@ yarn-error.log*
 *.ntvs*
 *.njsproj
 *.sln
+draft.html
+
+report.*.json
+draft.txt

.postcssrc.js

@@ -1,8 +0,0 @@
-// https://github.com/michael-ciniawsky/postcss-load-config
-
-module.exports = {
-  "plugins": {
-    // to edit target browsers: use "browserslist" field in package.json
-    "autoprefixer": {}
-  }
-}

CHANGELOG

@@ -1,38 +0,0 @@
-# 蓝眼云盘
-
-## 注意事项
-每次版本升级时需要修改以下内容。
-
-1. build/pack/build.bat
-    set VERSION_NAME=tank-x.x.x
-
-2. build/pack/build.sh
-    VERSION_NAME=tank-x.x.x
-
-3. rest/config.go
-    VERSION = x.x.x
-
-4. tank-front 修改 vuex/index.js
-    versionName: 'x.x.x'
-
-
-2018-01-19
-tank-1.0.2
-1. 修复了下载时无法估算文件大小的bug，header头重添加了Content-Type. [#2](https://github.com/eyebluecn/tank/issues/2)
-2. 修复了移动端样式混乱的问题.[#3](https://github.com/eyebluecn/tank/issues/3)
-3. 修复了文夹层数无上限的bug. [#4](https://github.com/eyebluecn/tank/issues/4)
-4. 修复了文件夹自己移动到自己后就全部消失的bug. [#8](https://github.com/eyebluecn/tank/issues/8)
-5. 统一不能删除用户，但是可以禁用或者启用用户. [#9](https://github.com/eyebluecn/tank/issues/9)
-
-
-2018-01-12
-tank-1.0.1
-1. 修复面包屑回退的bug [#1](https://github.com/eyebluecn/tank/issues/1)
-2. 修复移动文件时，可能移到其他人的文件夹下的bug
-3. 新增404页面
-4. 移除掉一些没用的代码
-
-
-2018-01-01
-tank-1.0.0
-完成基本核心功能

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2017 蓝眼
+Copyright (c) 2017 eyebluecn
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,167 +1,68 @@
-![蓝眼云盘logo](https://raw.githubusercontent.com/eyebluecn/tank/master/build/doc/img/logo.png)
+[![蓝眼云盘logo](./doc/img/logo.png)](https://github.com/eyebluecn/tank)
 
-# 蓝眼云盘前端
+[English Version](https://tank-doc.eyeblue.cn/en)
 
-##### [在线Demo](http://tank.eyeblue.cn) (体验账号： demo@tank.eyeblue.cn 密码：123456)
+# 蓝眼云盘（4.2.0）
+[在线Demo](https://tank.eyeblue.cn) (体验账号：demo 密码：123456)
 
-##### [配套后端tank](https://github.com/eyebluecn/tank)
+[更新文档 CHANGELOG](https://github.com/eyebluecn/tank/blob/master/CHANGELOG)
 
-### 简介
-蓝眼云盘是 [蓝眼系列开源软件](https://github.com/eyebluecn) 中的第一个
+蓝眼云盘是蓝眼开源系列代表作品之一，致力于打造精致，优雅，简约的云盘。核心功能如下：
+1. 文件列表
+2. 文件/文件夹上传 + 拖拽上传 + 分片/断点续传
+3. 文件分享
+4. 文件监控统计
+5. 回收站
+6. 多用户
+7. [WebDav](https://tank-doc.eyeblue.cn/advance/webdav.html)
+8. [扫描磁盘任务](https://tank-doc.eyeblue.cn/advance/scan.html)
+9. [在线预览及自定义配置预览引擎](https://tank-doc.eyeblue.cn/advance/preview.html)
+10. 无需安装数据库，支持文件数据库sqlite.
 
-- 主要用于快速搭建私人云盘，可以简单理解为部署在自己服务器上的[百度云盘](https://pan.baidu.com/)。
-- 蓝眼云盘提供了[编程接口](https://github.com/eyebluecn/tank/blob/master/build/doc/alien_zh.md)，可以使用接口上传文件，作为其他网站、系统、app的资源存储器，可以当作单机版的[七牛云](https://www.qiniu.com)或[阿里云OSS](https://www.aliyun.com/product/oss)使用。在即将发布的[《蓝眼博客》](https://github.com/eyebluecn/blog)软件中将会有详细的使用。
-- 蓝眼云盘还提供了账号管理系统，超级管理员可以管理用户，查看用户文件，普通用户只能查看自己的文件，修改自己的资料。上面提供的体验账号就是一个普通用户的账号。
+[更多内容请移步至文档](https://tank-doc.eyeblue.cn/)
 
-蓝眼云盘可以作为团队内部或个人私有的云盘使用，亦可当作专门处理图片，音频，视频等二进制文件的第三方编程辅助工具。
+前端技术栈：Typescript + React + Ant Design 4.0 + OOP
 
-如果您觉得蓝眼云盘对您有帮助，请不要吝惜您的star :smile:
+### 软件截图
+#### PC端截图
 
-### 技术栈
+![](./doc/img/tank0.png)
 
-vue2.0 + vue-router + vuex + vue-resource + webpack + es6 + less
+![](./doc/img/tank1.png)
 
+![](./doc/img/tank2.png)
 
-### 运行
+#### 手机端截图
 
+![](./doc/img/mobile.png)
+
+## [安装文档](https://tank-doc.eyeblue.cn/basic/install.html)
+
+## 启动本项目
+```shell
+# if not install yarn
+# npm install -g yarn
+
+yarn --registry=https://registry.npmmirror.com
+yarn start
 ```
-npm install
-
-npm run dev
-```
-如果你有自己的tank后端，也可以在`config/index.js`中`proxyTable.target`修改为自己tank所在地址
-
-### 打包
-
-```
-npm run build
-```
- 打包的结果在`dist`文件夹下，将该文件夹下的内容放置在[后端tank](https://github.com/eyebluecn/tank)的`build/html`文件夹下即可。
-
-
-### 配套后端
-此项目有配套后端项目，对golang感兴趣的同学可以猛戳 [配套后端tank](https://github.com/eyebluecn/tank)
-
-### 总结
-1、 蓝眼的宗旨是专注于开源精致而优雅的软件，所以在代码的构建过程中我们不停地思考与迭代，追求最优质的代码。
-
-2、 蓝眼云盘前端代码的构建完全面向对象，可扩展能力强，涉及多用户，多权限功能。
- 
-3、 蓝眼云盘后端采用了更贴近底层golang语言，更加适用于文件传输类的软件，速度更快，用户体验更好。  
 
 ### Contribution
 
-感谢所有蓝眼云盘的贡献者 [@zicla](https://github.com/zicla)，[@seaheart](https://github.com/seaheart)，@heying，[@hxsherry](https://github.com/hxsherry)
+感谢所有蓝眼云盘的贡献者 [@zicla](https://github.com/zicla)，[@seaheart](https://github.com/seaheart)，[@yemuhe](https://github.com/yemuhe)，[@hxsherry](https://github.com/hxsherry)
 
 如果您也想参与进来，请尽情的fork, star, post issue, pull requests
 
-### 部分截图
-![蓝眼云盘登录页面](https://raw.githubusercontent.com/eyebluecn/tank/master/build/doc/img/login.png)
+当然你可以加入钉钉群（一群已满员）一起直接交流，在钉钉群中可以获取最新beta版本。
 
-![蓝眼云盘主要页面](https://raw.githubusercontent.com/eyebluecn/tank/master/build/doc/img/matters.png)
+![](./doc/img/dingding.jpeg)
 
-### 项目布局
+群号：44754005
 
-```
-├── build                                          // webpack配置文件
-├── config                                         // 项目打包路径及反向代理配置
-├── doc                                            // vue-cli创建后配置文档
-├── node_modules                                   // 依赖包存放目录
-├── screenshots                                    // 项目部分截图
-├── node_modules                                   // 依赖包存放目录
-├── static                                         // 打包文件存放目录
-├── src                                            // 源码目录
-│   ├── assets                                     // 静态资源
-│   │   ├── css                                    // css目录
-│   │   │   ├── bootstrap                          // bootstrap全局less
-│   │   │   ├── global                             // 自定义全局less
-│   │   │   ├── inspinia                           // 引用外部插件less
-│   │   │   ├── mixin                              // bootstrap部分样式
-│   │   │   ├── app.less                           // less入口文件
-│   │   ├── img                                    // 静态图片存放目录
-│   ├── backyard                                   // 组件目录
-│   │   ├── layout                                 // 布局  
-│   │   │   ├── BottomNavigation.vue               // 尾部布局
-│   │   │   ├── SideMenu.vue                       // 侧边栏菜单
-│   │   │   ├── SideNavigation.vue                 // 侧边栏布局
-│   │   │   ├── TopNavigation.vue                  // 头部布局
-│   │   ├── matter                                 // 文件
-│   │   │   ├── widget                                                
-│   │   │   │   ├── Director.js                    // 单个文件的导演类      
-│   │   │   │   ├── FolderTree.vue                 // 文件夹递归树组件      
-│   │   │   │   ├── MatterImage.vue                // 图片类型文件上传组件      
-│   │   │   │   ├── MatterPanel.vue                // 单文件或文件夹个体     
-│   │   │   │   ├── MoveBatchPanel.vue             // 批量文件移动组件      
-│   │   │   │   ├── UploadMatterPanel.vue          // 文件上传组件 
-│   │   │   ├── List.vue                           // 文件列表
-│   │   ├── preference                             // 个性化
-│   │   │   ├── Edit.vue                           // 个性化编辑
-│   │   │   ├── Index.vue                          // 个性化显示
-│   │   ├── user                                   // 用户
-│   │   │   ├── widget                               
-│   │   │   │   ├── UserInputSelection.vue         // 异步用户模糊单选组件      
-│   │   │   ├── ChangePassword.vue                 // 用户修改密码
-│   │   │   ├── Create.vue                         // 创建用户
-│   │   │   ├── Detail.vue                         // 用户详情
-│   │   │   ├── List.vue                           // 用户列表
-│   │   │   ├── Login.vue                          // 用户登录
-│   │   ├── widget                                 // 与页面有关的公用组件
-│   │   │   ├── CreateSaveButton.vue               // 保存创建按钮组件
-│   │   │   ├── LoadingFrame.vue                   // 框架加载组件
-│   │   ├── Frame.vue                              // 大框架
-│   ├── common                                     // 公共目录
-│   │   ├── directive                              // 自定义指令
-│   │   │   ├── directive.js                       // 验证规则指令
-│   │   ├── filter                                 // 过滤器
-│   │   │   ├── index.js                           // 过滤器入口文件
-│   │   │   ├── number.js                          // 数字格式过滤器
-│   │   │   ├── str.js                             // 字符串格式过滤器
-│   │   │   ├── time.js                            // 时间格式过滤器
-│   │   │   ├── validate.js                        // 正则表达式
-│   │   ├── fork                                   // 引用外部插件
-│   │   ├── model                                  // 类模型目录
-│   │   │   ├── base                               // 基
-│   │   │   │   ├── Base.js                        // 基类
-│   │   │   │   ├── BaseEntity.js                  // 实体基类
-│   │   │   │   ├── Filter.js                      // 过滤器类
-│   │   │   │   ├── Pager.js                       // 分页类
-│   │   │   ├── feature                            // 权限
-│   │   │   │   ├── FeatureType.js                 // 权限点类
-│   │   │   ├── matter                             // 文件
-│   │   │   │   ├── Matter.js                      // 文件类
-│   │   │   ├── preference                         // 个性化
-│   │   │   │   ├── Preference.js                  // 个性化类
-│   │   │   ├── user                               // 用户
-│   │   │   │   ├── User.js                        // 用户类
-│   │   ├── router                                 // 路由
-│   │   │   ├── index.js                           // 路由入口文件
-│   │   ├── util                                   // 通用
-│   │   │   ├── MimeUtil.js                        // 后缀名判别文件
-│   │   │   ├── Utils.js                           // 客户端判别文件
-│   │   ├── vuex                                   // vuex状态管理
-│   │   │   ├── index.js                           // vuex入口文件
-│   │   ├── widget                                 // 公用轮子文件（里面存放各种通用型轮子）
-│   │   │   ├── filter                             // 筛选
-│   │   │   │   ├── NbFilter.vue                   // 筛选入口组件
-│   │   │   │   ├── NbFilterCheck.vue              // 单/多项选择筛选
-│   │   │   │   ├── NbFilterDateTime.vue           // 时间筛选
-│   │   │   │   ├── NbFilterHttpInputSelection.vue // 异步输入筛选
-│   │   │   │   ├── NbFilterHttpSelection.vue      // 异步下拉筛选
-│   │   │   │   ├── NbFilterMultiSelection.vue     // 多选下拉筛选
-│   │   │   │   ├── NbFilterSelection.vue          // 下拉筛选
-│   │   │   │   ├── NbFilterSort.vue               // 布尔值筛选
-│   │   │   ├── NbBtnDropdown.vue                  // 按钮下拉组件
-│   │   │   ├── NbCheckbox.vue                     // 复选框组件
-│   │   │   ├── NbExpanding.vue                    // 收缩展开组件
-│   │   │   ├── NbPager.vue                        // 分页组件
-│   │   │   ├── NbRadio.vue                        // 单选框组件
-│   │   │   ├── NbSlidePanel.vue                   // 动画组件
-│   │   │   ├── NbSwitcher.vue                     // 开关按钮组件
-│   ├── App.vue                                    // 页面入口文件
-│   ├── main.js                                    // Js入口文件
-├── index.html                                     // 入口Html文件
+### Support
+IDE for this project is supported by [Jetbrains](https://jb.gg/OpenSourceSupport).
 
-```
+[![](./doc/img/jb_beam.png)](https://jb.gg/OpenSourceSupport)
 
 ### License
 

build/build.js

@@ -1,41 +0,0 @@
-'use strict'
-require('./check-versions')()
-
-process.env.NODE_ENV = 'production'
-
-const ora = require('ora')
-const rm = require('rimraf')
-const path = require('path')
-const chalk = require('chalk')
-const webpack = require('webpack')
-const config = require('../config')
-const webpackConfig = require('./webpack.prod.conf')
-
-const spinner = ora('building for production...')
-spinner.start()
-
-rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
-  if (err) throw err
-  webpack(webpackConfig, function (err, stats) {
-    spinner.stop()
-    if (err) throw err
-    process.stdout.write(stats.toString({
-      colors: true,
-      modules: false,
-      children: false,
-      chunks: false,
-      chunkModules: false
-    }) + '\n\n')
-
-    if (stats.hasErrors()) {
-      console.log(chalk.red('  Build failed with errors.\n'))
-      process.exit(1)
-    }
-
-    console.log(chalk.cyan('  Build complete.\n'))
-    console.log(chalk.yellow(
-      '  Tip: built files are meant to be served over an HTTP server.\n' +
-      '  Opening index.html over matter:// won\'t work.\n'
-    ))
-  })
-})

build/check-versions.js

@@ -1,49 +0,0 @@
-'use strict'
-const chalk = require('chalk')
-const semver = require('semver')
-const packageConfig = require('../package.json')
-const shell = require('shelljs')
-function exec (cmd) {
-  return require('child_process').execSync(cmd).toString().trim()
-}
-
-const versionRequirements = [
-  {
-    name: 'node',
-    currentVersion: semver.clean(process.version),
-    versionRequirement: packageConfig.engines.node
-  }
-]
-
-if (shell.which('npm')) {
-  versionRequirements.push({
-    name: 'npm',
-    currentVersion: exec('npm --version'),
-    versionRequirement: packageConfig.engines.npm
-  })
-}
-
-module.exports = function () {
-  const warnings = []
-  for (let i = 0; i < versionRequirements.length; i++) {
-    const mod = versionRequirements[i]
-    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
-      warnings.push(mod.name + ': ' +
-        chalk.red(mod.currentVersion) + ' should be ' +
-        chalk.green(mod.versionRequirement)
-      )
-    }
-  }
-
-  if (warnings.length) {
-    console.log('')
-    console.log(chalk.yellow('To use this template, you must update following to modules:'))
-    console.log()
-    for (let i = 0; i < warnings.length; i++) {
-      const warning = warnings[i]
-      console.log('  ' + warning)
-    }
-    console.log()
-    process.exit(1)
-  }
-}

build/dev-client.js

@@ -1,10 +0,0 @@
-/* eslint-disable */
-'use strict'
-require('eventsource-polyfill')
-var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true')
-
-hotClient.subscribe(function (event) {
-  if (event.action === 'reload') {
-    window.location.reload()
-  }
-})

build/dev-server.js

@@ -1,107 +0,0 @@
-'use strict'
-require('./check-versions')()
-
-const config = require('../config')
-if (!process.env.NODE_ENV) {
-  process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
-}
-
-const opn = require('opn')
-const path = require('path')
-const express = require('express')
-const webpack = require('webpack')
-const proxyMiddleware = require('http-proxy-middleware')
-const webpackConfig = (process.env.NODE_ENV === 'testing' || process.env.NODE_ENV === 'production')
-  ? require('./webpack.prod.conf')
-  : require('./webpack.dev.conf')
-
-// default port where dev server listens for incoming traffic
-const port = process.env.PORT || config.dev.port
-// automatically open browser, if not set will be false
-const autoOpenBrowser = !!config.dev.autoOpenBrowser
-// Define HTTP proxies to your custom API backend
-// https://github.com/chimurai/http-proxy-middleware
-const proxyTable = config.dev.proxyTable
-
-const app = express()
-const compiler = webpack(webpackConfig)
-
-const devMiddleware = require('webpack-dev-middleware')(compiler, {
-  publicPath: webpackConfig.output.publicPath,
-  quiet: true
-})
-
-const hotMiddleware = require('webpack-hot-middleware')(compiler, {
-  log: false,
-  heartbeat: 2000
-})
-// force page reload when html-webpack-plugin template changes
-// currently disabled until this is resolved:
-// https://github.com/jantimon/html-webpack-plugin/issues/680
-// compiler.plugin('compilation', function (compilation) {
-//   compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
-//     hotMiddleware.publish({ action: 'reload' })
-//     cb()
-//   })
-// })
-
-// enable hot-reload and state-preserving
-// compilation error display
-app.use(hotMiddleware)
-
-// proxy api requests
-Object.keys(proxyTable).forEach(function (context) {
-  let options = proxyTable[context]
-  if (typeof options === 'string') {
-    options = { target: options }
-  }
-  app.use(proxyMiddleware(options.filter || context, options))
-})
-
-// handle fallback for HTML5 history API
-app.use(require('connect-history-api-fallback')())
-
-// serve webpack bundle output
-app.use(devMiddleware)
-
-// serve pure static assets
-const staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
-app.use(staticPath, express.static('./static'))
-
-const uri = 'http://localhost:' + port
-
-var _resolve
-var _reject
-var readyPromise = new Promise((resolve, reject) => {
-  _resolve = resolve
-  _reject = reject
-})
-
-var server
-var portfinder = require('portfinder')
-portfinder.basePort = port
-
-console.log('> Starting dev server...')
-devMiddleware.waitUntilValid(() => {
-  portfinder.getPort((err, port) => {
-    if (err) {
-      _reject(err)
-    }
-    process.env.PORT = port
-    var uri = 'http://localhost:' + port
-    console.log('> Listening at ' + uri + '\n')
-    // when env is testing, don't need open it
-    if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
-      opn(uri)
-    }
-    server = app.listen(port)
-    _resolve()
-  })
-})
-
-module.exports = {
-  ready: readyPromise,
-  close: () => {
-    server.close()
-  }
-}

build/utils.js

@@ -1,72 +0,0 @@
-'use strict'
-const path = require('path')
-const config = require('../config')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-
-exports.assetsPath = function (_path) {
-  const assetsSubDirectory = process.env.NODE_ENV === 'production'
-    ? config.build.assetsSubDirectory
-    : config.dev.assetsSubDirectory
-  return path.posix.join(assetsSubDirectory, _path)
-}
-
-exports.cssLoaders = function (options) {
-  options = options || {}
-
-  const cssLoader = {
-    loader: 'css-loader',
-    options: {
-      minimize: process.env.NODE_ENV === 'production',
-      sourceMap: options.sourceMap
-    }
-  }
-
-  // generate loader string to be used with extract text plugin
-  function generateLoaders (loader, loaderOptions) {
-    const loaders = [cssLoader]
-    if (loader) {
-      loaders.push({
-        loader: loader + '-loader',
-        options: Object.assign({}, loaderOptions, {
-          sourceMap: options.sourceMap
-        })
-      })
-    }
-
-    // Extract CSS when that option is specified
-    // (which is the case during production build)
-    if (options.extract) {
-      return ExtractTextPlugin.extract({
-        use: loaders,
-        fallback: 'vue-style-loader'
-      })
-    } else {
-      return ['vue-style-loader'].concat(loaders)
-    }
-  }
-
-  // https://vue-loader.vuejs.org/en/configurations/extract-css.html
-  return {
-    css: generateLoaders(),
-    postcss: generateLoaders(),
-    less: generateLoaders('less'),
-    sass: generateLoaders('sass', { indentedSyntax: true }),
-    scss: generateLoaders('sass'),
-    stylus: generateLoaders('stylus'),
-    styl: generateLoaders('stylus')
-  }
-}
-
-// Generate loaders for standalone style files (outside of .vue)
-exports.styleLoaders = function (options) {
-  const output = []
-  const loaders = exports.cssLoaders(options)
-  for (const extension in loaders) {
-    const loader = loaders[extension]
-    output.push({
-      test: new RegExp('\\.' + extension + '$'),
-      use: loader
-    })
-  }
-  return output
-}

build/vue-loader.conf.js

@@ -1,19 +0,0 @@
-'use strict'
-const utils = require('./utils')
-const config = require('../config')
-const isProduction = process.env.NODE_ENV === 'production'
-
-module.exports = {
-  loaders: utils.cssLoaders({
-    sourceMap: isProduction
-      ? config.build.productionSourceMap
-      : config.dev.cssSourceMap,
-    extract: isProduction
-  }),
-  transformToRequire: {
-    video: 'src',
-    source: 'src',
-    img: 'src',
-    image: 'xlink:href'
-  }
-}

build/webpack.base.conf.js

@@ -1,76 +0,0 @@
-'use strict'
-const path = require('path')
-const utils = require('./utils')
-const config = require('../config')
-const vueLoaderConfig = require('./vue-loader.conf')
-
-function resolve(dir) {
-  return path.join(__dirname, '..', dir)
-}
-
-module.exports = {
-  entry: {
-    app: './src/main.js'
-  },
-  output: {
-    path: config.build.assetsRoot,
-    filename: '[name].js',
-    publicPath: process.env.NODE_ENV === 'production'
-      ? config.build.assetsPublicPath
-      : config.dev.assetsPublicPath
-  },
-  resolve: {
-    extensions: ['.js', '.vue', '.json'],
-    alias: {
-      'vue$': 'vue/dist/vue.esm.js',
-      '@': resolve('src'),
-    }
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(js|vue)$/,
-        loader: 'eslint-loader',
-        enforce: 'pre',
-        include: [resolve('src'), resolve('test')],
-        options: {
-          formatter: require('eslint-friendly-formatter')
-        }
-      },
-      {
-        test: /\.vue$/,
-        loader: 'vue-loader',
-        options: vueLoaderConfig
-      },
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        include: [resolve('src'), resolve('test')]
-      },
-      {
-        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: utils.assetsPath('img/[name].[hash:7].[ext]')
-        }
-      },
-      {
-        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: utils.assetsPath('media/[name].[hash:7].[ext]')
-        }
-      },
-      {
-        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
-        }
-      }
-    ]
-  }
-}

build/webpack.dev.conf.js

@@ -1,37 +0,0 @@
-'use strict'
-const utils = require('./utils')
-const webpack = require('webpack')
-const config = require('../config')
-const merge = require('webpack-merge')
-const baseWebpackConfig = require('./webpack.base.conf')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
-
-// add hot-reload related code to entry chunks
-Object.keys(baseWebpackConfig.entry).forEach(function (name) {
-  baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name])
-})
-
-module.exports = merge(baseWebpackConfig, {
-  module: {
-    rules: utils.styleLoaders({sourceMap: config.dev.cssSourceMap})
-  },
-  // cheap-module-eval-source-map is faster for development
-  devtool: '#cheap-module-eval-source-map',
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env': config.dev.env
-    }),
-    // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
-    new webpack.HotModuleReplacementPlugin(),
-    new webpack.NoEmitOnErrorsPlugin(),
-    // https://github.com/ampedandwired/html-webpack-plugin
-    new HtmlWebpackPlugin({
-      filename: 'index.html',
-      template: 'index.html',
-      inject: true,
-      favicon: 'src/assets/img/favicon.ico'
-    }),
-    new FriendlyErrorsPlugin()
-  ]
-})

build/webpack.prod.conf.js

@@ -1,134 +0,0 @@
-'use strict'
-const path = require('path')
-const utils = require('./utils')
-const webpack = require('webpack')
-const config = require('../config')
-const merge = require('webpack-merge')
-const baseWebpackConfig = require('./webpack.base.conf')
-const CopyWebpackPlugin = require('copy-webpack-plugin')
-const HtmlWebpackPlugin = require('html-webpack-plugin')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
-
-const env = process.env.NODE_ENV === 'testing'
-  ? require('../config/test.env')
-  : config.build.env
-
-const webpackConfig = merge(baseWebpackConfig, {
-  module: {
-    rules: utils.styleLoaders({
-      sourceMap: config.build.productionSourceMap,
-      extract: true
-    })
-  },
-  devtool: config.build.productionSourceMap ? '#source-map' : false,
-  output: {
-    path: config.build.assetsRoot,
-    filename: utils.assetsPath('js/[name].[chunkhash].js'),
-    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
-  },
-  plugins: [
-    // http://vuejs.github.io/vue-loader/en/workflow/production.html
-    new webpack.DefinePlugin({
-      'process.env': env
-    }),
-    // UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify
-    new webpack.optimize.UglifyJsPlugin({
-      compress: {
-        warnings: false
-      },
-      sourceMap: true,
-      //我们的类名不希望被混淆，否则url获取会成单字母了。
-      mangle: {
-        except: ['$super', '$', 'exports', 'require', 'angular'],
-        keep_fnames: true//it works
-      }
-    }),
-    // extract css into its own matter
-    new ExtractTextPlugin({
-      filename: utils.assetsPath('css/[name].[contenthash].css')
-    }),
-    // Compress extracted CSS. We are using this plugin so that possible
-    // duplicated CSS from different components can be deduped.
-    new OptimizeCSSPlugin({
-      cssProcessorOptions: {
-        safe: true
-      }
-    }),
-    // generate dist index.html with correct asset hash for caching.
-    // you can customize output by editing /index.html
-    // see https://github.com/ampedandwired/html-webpack-plugin
-    new HtmlWebpackPlugin({
-      filename: process.env.NODE_ENV === 'testing'
-        ? 'index.html'
-        : config.build.index,
-      template: 'index.html',
-      inject: true,
-      favicon: 'src/assets/img/favicon.ico',
-      minify: {
-        removeComments: true,
-        collapseWhitespace: true,
-        removeAttributeQuotes: true
-        // more options:
-        // https://github.com/kangax/html-minifier#options-quick-reference
-      },
-      // necessary to consistently work with multiple chunks via CommonsChunkPlugin
-      chunksSortMode: 'dependency'
-    }),
-    // keep module.id stable when vender modules does not change
-    new webpack.HashedModuleIdsPlugin(),
-    // split vendor js into its own matter
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'vendor',
-      minChunks: function (module) {
-        // any required modules inside node_modules are extracted to vendor
-        return (
-          module.resource &&
-          /\.js$/.test(module.resource) &&
-          module.resource.indexOf(
-            path.join(__dirname, '../node_modules')
-          ) === 0
-        )
-      }
-    }),
-    // extract webpack runtime and module manifest to its own matter in order to
-    // prevent vendor hash from being updated whenever app bundle is updated
-    new webpack.optimize.CommonsChunkPlugin({
-      name: 'manifest',
-      chunks: ['vendor']
-    }),
-    // copy custom static assets
-    new CopyWebpackPlugin([
-      {
-        from: path.resolve(__dirname, '../static'),
-        to: config.build.assetsSubDirectory,
-        ignore: ['.*']
-      }
-    ])
-  ]
-})
-
-if (config.build.productionGzip) {
-  const CompressionWebpackPlugin = require('compression-webpack-plugin')
-
-  webpackConfig.plugins.push(
-    new CompressionWebpackPlugin({
-      asset: '[path].gz[query]',
-      algorithm: 'gzip',
-      test: new RegExp(
-        '\\.(' +
-        config.build.productionGzipExtensions.join('|') +
-        ')$'
-      ),
-      threshold: 10240,
-      minRatio: 0.8
-    })
-  )
-}
-
-if (config.build.bundleAnalyzerReport) {
-  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
-  webpackConfig.plugins.push(new BundleAnalyzerPlugin())
-}
-
-module.exports = webpackConfig

build/webpack.test.conf.js

@@ -1,32 +0,0 @@
-'use strict'
-// This is the webpack config used for unit tests.
-
-const utils = require('./utils')
-const webpack = require('webpack')
-const merge = require('webpack-merge')
-const baseWebpackConfig = require('./webpack.base.conf')
-
-const webpackConfig = merge(baseWebpackConfig, {
-  // use inline sourcemap for karma-sourcemap-loader
-  module: {
-    rules: utils.styleLoaders()
-  },
-  devtool: '#inline-source-map',
-  resolveLoader: {
-    alias: {
-      // necessary to to make lang="scss" work in test when using vue-loader's ?inject option
-      // see discussion at https://github.com/vuejs/vue-loader/issues/724
-      'scss-loader': 'sass-loader'
-    }
-  },
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env': require('../config/test.env')
-    })
-  ]
-})
-
-// no need for app entry during tests
-delete webpackConfig.entry
-
-module.exports = webpackConfig

config/dev.env.js

@@ -1,7 +0,0 @@
-'use strict'
-const merge = require('webpack-merge')
-const prodEnv = require('./prod.env')
-
-module.exports = merge(prodEnv, {
-  NODE_ENV: '"development"'
-})

config/index.js

@@ -1,51 +0,0 @@
-
-'use strict'
-// Template version: 1.1.3
-// see http://vuejs-templates.github.io/webpack for documentation.
-
-const path = require('path')
-
-module.exports = {
-  build: {
-    env: require('./prod.env'),
-    index: path.resolve(__dirname, '../dist/index.html'),
-    assetsRoot: path.resolve(__dirname, '../dist'),
-    assetsSubDirectory: 'static',
-    assetsPublicPath: '/',
-    productionSourceMap: true,
-    // Gzip off by default as many popular static hosts such as
-    // Surge or Netlify already gzip all static assets for you.
-    // Before setting to `true`, make sure to:
-    // npm install --save-dev compression-webpack-plugin
-    productionGzip: false,
-    productionGzipExtensions: ['js', 'css'],
-    // Run the build command with an extra argument to
-    // View the bundle analyzer report after build finishes:
-    // `npm run build --report`
-    // Set to `true` or `false` to always turn it on or off
-    bundleAnalyzerReport: process.env.npm_config_report
-  },
-  dev: {
-    env: require('./dev.env'),
-    port: 6015,
-    autoOpenBrowser: true,
-    assetsSubDirectory: 'static',
-    assetsPublicPath: '/',
-    proxyTable: {
-      '/api': {
-        //target: 'http://tank.eyeblue.cn',
-        target: 'http://localhost:6010',
-        changeOrigin: true,
-        pathRewrite: {
-          '^/api': '/api'
-        }
-      }
-    },
-    // CSS Sourcemaps off by default because relative paths are "buggy"
-    // with this option, according to the CSS-Loader README
-    // (https://github.com/webpack/css-loader#sourcemaps)
-    // In our experience, they generally work as expected,
-    // just be aware of this issue when enabling this option.
-    cssSourceMap: false
-  }
-}

config/prod.env.js

@@ -1,4 +0,0 @@
-'use strict'
-module.exports = {
-  NODE_ENV: '"production"'
-}

config/test.env.js

@@ -1,7 +0,0 @@
-'use strict'
-const merge = require('webpack-merge')
-const devEnv = require('./dev.env')
-
-module.exports = merge(devEnv, {
-  NODE_ENV: '"testing"'
-})

craco.config.js

@@ -0,0 +1,38 @@
+const CracoLessPlugin = require('craco-less');
+
+module.exports = {
+  devServer: {
+    port: 6015,
+    // proxy for local development.
+    proxy: {
+      '/api': {
+        target: 'http://localhost:6010',
+        changeOrigin: true,
+        pathRewrite: {
+          '^/api': '/api',
+        },
+      },
+    },
+  },
+  plugins: [
+    {
+      // less loader.
+      plugin: CracoLessPlugin,
+      options: {
+        // resolve-url-loader只对sass生效，craco-less默认使用sass配置，所以这里手动过滤掉resolve-url-loader
+        modifyLessRule: (lessRule) => {
+          lessRule.use = lessRule.use.filter(
+            (i) => !i.loader.includes('resolve-url-loader')
+          );
+          return lessRule;
+        },
+        lessLoaderOptions: {
+          lessOptions: {
+            modifyVars: { '@primary-color': '#215891' },
+            javascriptEnabled: true,
+          },
+        },
+      },
+    },
+  ],
+};

doc/vue-config.md

@@ -1,62 +0,0 @@
-# 使用vue-cli创建项目后配置
-
-### 1.修改默认端口
-
-`config/index.js` 8080变更为6010
-
-### 2.Eslint语法检查太过严格，使用自己的规则。
-
-`.eslintrc.js`修改成自己的规则
-
-
-### 3.添加Less
-
-a.引入less和less-loader库
-    
-```
-cnpm install less less-loader --save-dev
-```
-
-b.不需要做任何操作了，因为只要安装了less，vue-cli就会把less配置到项目中去。
-
-
-### 4.给项目添加favicon.ico
-
-`build/webpack.dev.config.js` 中的`new HtmlWebpackPlugin({`节点内`inject: true`后，添加：
-
-`favicon: 'src/assets/img/favicon.ico'`
-
-文件`build/webpack.dev.config.js` 同样的位置添加。
-
-
-
-### 5.设置http代理
-
-`config/index.js`在dev节点下添加：
-```
-proxyTable: {
-      '/api': {
-        target: 'http://127.0.0.1:6010',
-        changeOrigin: true,
-        pathRewrite: {
-          '^/api': '/api'
-        }
-      }
-    },
-```
-
-### 6.UglifyJsPlugin 不需要压缩类名，因为接口中有直接使用类名。
-```
-new webpack.optimize.UglifyJsPlugin({
-      compress: {
-        warnings: false
-      },
-      sourceMap: true,
-      //我们的类名不希望被混淆，否则url获取会成单字母了。
-      mangle: {
-        except: ['$super', '$', 'exports', 'require', 'angular'],
-        keep_fnames: true//it works
-      }
-    })
-
-```

ide-editor-config.xml

@@ -0,0 +1 @@
+<code_scheme name="Project" version="173" />

index.html

@@ -1,18 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-
-  <title>蓝眼云盘</title>
-  <meta charset="utf-8"/>
-  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-  <meta name="renderer" content="webkit">
-  <meta name="viewport" content="user-scalable=no,width=device-width,initial-scale=1,maximum-scale=1">
-  <meta name="msapplication-tap-highlight" content="no">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-
-</head>
-<body>
-<div id="app"></div>
-<!-- built files will be auto injected -->
-</body>
-</html>

package.json

@@ -1,118 +1,65 @@
 {
-  "name": "blog-front",
-  "version": "1.0.0",
-  "description": "A Vue.js project",
-  "author": "zicla <lish516@126.com>",
+  "name": "tank-front",
+  "version": "4.1.1",
   "private": true,
-  "scripts": {
-    "dev": "node build/dev-server.js",
-    "start": "npm run dev",
-    "build": "node build/build.js",
-    "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
-    "e2e": "node test/e2e/runner.js",
-    "test": "npm run unit && npm run e2e",
-    "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
-  },
   "dependencies": {
-    "animate.css": "^3.5.2",
-    "babel-polyfill": "^6.26.0",
-    "bootstrap": "^3.3.7",
-    "editor.md": "^1.5.0",
-    "element-ui": "^2.0.2",
-    "enquire.js": "^2.1.6",
-    "font-awesome": "^4.7.0",
-    "fs": "0.0.1-security",
-    "icheck": "^1.0.2",
-    "jquery": "^3.2.1",
-    "perfect-scrollbar": "^1.1.0",
-    "scriptjs": "^2.5.8",
-    "swiper": "^4.0.3",
-    "velocity-animate": "^1.5.0",
-    "vue": "^2.5.2",
-    "vue-nprogress": "^0.1.5",
-    "vue-resource": "^1.3.4",
-    "vue-router": "^3.0.1",
-    "vuex": "^3.0.1",
-    "vuex-router-sync": "^5.0.0"
+    "@ant-design/icons": "4.7.0",
+    "@craco/craco": "6.4.3",
+    "@types/echarts": "4.6.1",
+    "@types/node": "16.7.13",
+    "@types/qs": "^6.9.7",
+    "@types/react": "17.0.2",
+    "@types/react-dom": "17.0.2",
+    "@types/react-router-dom": "^5.3.3",
+    "antd": "4.19.2",
+    "axios": "^0.26.1",
+    "comma-separated-values": "^3.6.4",
+    "craco-less": "2.0.0",
+    "echarts": "4.8.0",
+    "echarts-for-react": "2.0.16",
+    "qs": "^6.10.3",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "react-photo-view": "^1.2.3",
+    "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0",
+    "react-scripts": "5.0.0",
+    "spark-md5": "^3.0.2",
+    "typescript": "4.4.2",
+    "velocity-react": "^1.4.3"
+  },
+  "scripts": {
+    "start": "craco start",
+    "build": "craco build"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
   },
   "devDependencies": {
-    "autoprefixer": "^7.1.2",
-    "babel-core": "^6.22.1",
-    "babel-eslint": "^7.1.1",
-    "babel-loader": "^7.1.1",
-    "babel-plugin-istanbul": "^4.1.1",
-    "babel-plugin-transform-runtime": "^6.22.0",
-    "babel-preset-env": "^1.3.2",
-    "babel-preset-stage-2": "^6.22.0",
-    "babel-register": "^6.22.0",
-    "chai": "^4.1.2",
-    "chalk": "^2.0.1",
-    "chromedriver": "^2.27.2",
-    "connect-history-api-fallback": "^1.3.0",
-    "copy-webpack-plugin": "^4.0.1",
-    "cross-env": "^5.0.1",
-    "cross-spawn": "^5.0.1",
-    "css-loader": "^0.28.0",
-    "eslint": "^3.19.0",
-    "eslint-config-standard": "^10.2.1",
-    "eslint-friendly-formatter": "^3.0.0",
-    "eslint-loader": "^1.7.1",
-    "eslint-plugin-html": "^3.0.0",
-    "eslint-plugin-import": "^2.7.0",
-    "eslint-plugin-node": "^5.2.0",
-    "eslint-plugin-promise": "^3.4.0",
-    "eslint-plugin-standard": "^3.0.1",
-    "eventsource-polyfill": "^0.9.6",
-    "express": "^4.14.1",
-    "extract-text-webpack-plugin": "^3.0.0",
-    "file-loader": "^1.1.4",
-    "friendly-errors-webpack-plugin": "^1.6.1",
-    "html-webpack-plugin": "^2.30.1",
-    "http-proxy-middleware": "^0.17.3",
-    "imports-loader": "^0.7.1",
-    "inject-loader": "^3.0.0",
-    "karma": "^1.4.1",
-    "karma-coverage": "^1.1.1",
-    "karma-mocha": "^1.3.0",
-    "karma-phantomjs-launcher": "^1.0.2",
-    "karma-phantomjs-shim": "^1.4.0",
-    "karma-sinon-chai": "^1.3.1",
-    "karma-sourcemap-loader": "^0.3.7",
-    "karma-spec-reporter": "0.0.31",
-    "karma-webpack": "^2.0.2",
-    "less": "^2.7.3",
-    "less-loader": "^4.0.5",
-    "mocha": "^3.2.0",
-    "nightwatch": "^0.9.12",
-    "opn": "^5.1.0",
-    "optimize-css-assets-webpack-plugin": "^3.2.0",
-    "ora": "^1.2.0",
-    "phantomjs-prebuilt": "^2.1.14",
-    "portfinder": "^1.0.13",
-    "rimraf": "^2.6.0",
-    "selenium-server": "^3.0.1",
-    "semver": "^5.3.0",
-    "shelljs": "^0.7.6",
-    "sinon": "^4.0.0",
-    "sinon-chai": "^2.8.0",
-    "url-loader": "^0.5.8",
-    "vue-loader": "^13.3.0",
-    "vue-multiselect": "^2.0.8",
-    "vue-style-loader": "^3.0.1",
-    "vue-template-compiler": "^2.5.2",
-    "webpack": "^3.6.0",
-    "webpack-bundle-analyzer": "^2.9.0",
-    "webpack-dev-middleware": "^1.12.0",
-    "webpack-hot-middleware": "^2.18.2",
-    "webpack-merge": "^4.1.0"
+    "@types/spark-md5": "^3.0.5",
+    "husky": "^8.0.3",
+    "lint-staged": "^13.2.2",
+    "prettier": "^2.8.8"
   },
-  "engines": {
-    "node": ">= 4.0.0",
-    "npm": ">= 3.0.0"
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
   },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not ie <= 8"
-  ]
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "prettier --write",
+      "git add"
+    ]
+  },
+  "packageManager": "yarn@1.22.19+sha1.4ba7fc5c6e704fce2066ecbfb0b0d8976fe62447"
 }

prettier.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  tabWidth: 2,
+  singleQuote: true,
+  endOfLine: 'auto',
+};

public/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="eyeblue tank"
+    />
+    <title>EyeblueTank</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run EyeblueTank.</noscript>
+    <div id="root"></div>
+  </body>
+</html>

src/App.less

@@ -0,0 +1,3 @@
+//import global style.
+@import './assets/css/index.less';
+@import '~antd/dist/antd.less';

src/App.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { BrowserRouter as Router } from 'react-router-dom';
+import { ConfigProvider } from 'antd';
+import Frame from './pages/Frame';
+import en_US from 'antd/es/locale/en_US';
+
+// global less 须放在Frame组件之后，不然会出现按需加载的less文件覆盖样式问题
+import './App.less';
+
+function App() {
+  return (
+    <Router>
+      <ConfigProvider locale={en_US}>
+        <Frame />
+      </ConfigProvider>
+    </Router>
+  );
+}
+
+export default App;

src/App.vue

@@ -1,92 +0,0 @@
-<template>
-	<div class="nb-app">
-
-		<NprogressContainer/>
-		<router-view/>
-
-	</div>
-</template>
-
-<script>
-  import NprogressContainer from 'vue-nprogress/src/NprogressContainer'
-
-  export default {
-    data () {
-      return {
-        preference: this.$store.state.preference
-      }
-    },
-    computed: {},
-    components: {
-      NprogressContainer
-    },
-    mounted () {
-
-      let that = this
-      this.preference.httpFetch()
-
-    }
-  }
-</script>
-
-
-<style lang="less" rel="stylesheet/less">
-
-	@import "~font-awesome/css/font-awesome.css";
-	@import "./assets/css/app.less";
-
-	.nb-app {
-
-		height: 100%;
-
-		.nprogress-container {
-			position: fixed !important;
-			width: 100%;
-			height: 150px;
-			z-index: 2048;
-			pointer-events: none;
-
-			#nprogress {
-				//@color: #48e79a;
-				@color: #1ab394;
-
-				.bar {
-					background: @color;
-				}
-				.peg {
-					box-shadow: 0 0 10px @color, 0 0 5px @color;
-				}
-
-				.spinner-icon {
-					border-top-color: @color;
-					border-left-color: @color;
-				}
-			}
-		}
-
-		//所有的滚动条样式
-		::-webkit-scrollbar {
-			width: 6px;
-			height: 6px;
-		}
-		::-webkit-scrollbar-track-piece {
-			background-color: #eee;
-			margin: -2px;
-		}
-		::-webkit-scrollbar-thumb {
-			background: #aaa;
-			min-height: 150px;
-			min-width: 150px;
-			border-radius: 10px;
-		}
-		::-webkit-scrollbar-thumb:vertical:hover {
-			background: #555555
-		}
-		::-webkit-scrollbar-thumb:horizontal:hover {
-			background: #555555
-		}
-
-	}
-
-
-</style>

src/assets/css/app.less

@@ -1,127 +0,0 @@
-//global css.
-//Include font-awesome
-//Include what we need in bootstrap.
-@import "bootstrap/bootstrap.less";
-@import "inspinia/style.less";
-//Animated
-@import "~animate.css/animate.min.css";
-//element-ui
-@import "~element-ui/lib/theme-chalk/index.css";
-//使用自定义的主题
-@import "global/border.less";
-@import "global/button.less";
-@import "global/color.less";
-@import "global/font.less";
-@import "global/layout.less";
-@import "global/miscellaneous.less";
-@import "global/responsive.less";
-
-//h2被污染了
-.el-notification__title {
-  margin-top: 0;
-}
-
-//手机端的弹出框太大了
-@media (max-width: 768px) {
-  .el-message-box__wrapper {
-    .el-message-box {
-      width: 90%;
-    }
-  }
-}
-
-html, body {
-  font-family: "微软雅黑", Microsoft YaHei, "Helvetica Neue", Helvetica, Arial, sans-serif, "open sans";
-  font-size: 13px;
-  color: @text-color;
-  background-color: white;
-
-  img {
-    max-width: 100%;
-  }
-
-}
-
-//列表单元格的样式。
-.nb-app {
-
-  //media-body下的p字体大小
-  .media-body {
-    p {
-      font-size: 13px;
-    }
-  }
-
-  .cell-title {
-    font-size: 17px;
-    color: @app-color-title;
-    .one-line;
-
-    a {
-      font-size: 17px;
-      color: @app-color-title;
-      &:hover {
-        color: @brand-primary;
-      }
-    }
-  }
-
-  .cell-content {
-    font-size: 12px;
-    color: @app-color-title;
-    letter-spacing: 0;
-    line-height: 18px;
-  }
-  .cell-description {
-    font-size: 12px;
-    color: @app-color-content;
-    letter-spacing: 0;
-    line-height: 24px;
-  }
-
-}
-
-//超链接颜色.
-a {
-  color: @brand-primary;
-
-  &:hover, &:focus {
-    color: @brand-info;
-  }
-}
-
-//段落统一样式
-p {
-  color: #333;
-  font-size: 15px;
-  padding: 0;
-}
-
-//每个页面导航处样式
-.pedia-navigation {
-  margin-bottom: 10px;
-  border-bottom: 1px solid #E6E6E6;
-
-  .item, a {
-    font-size: 16px;
-    color: #778195;
-    margin-top: 15px;
-    margin-right: 20px;
-    display: inline-block;
-    box-sizing: content-box;
-    line-height: 30px;
-
-    &:hover, &.is-link-active, &.active {
-      color: @brand-primary;
-
-      border-bottom: 2px solid @brand-primary;
-    }
-  }
-}
-
-//markdown中默认图片剧中
-p {
-  > img {
-    text-align: center;
-  }
-}

src/assets/css/bootstrap/bootstrap.less

@@ -1,54 +0,0 @@
-/*!
- * Bootstrap v3.3.7 (http://getbootstrap.com)
- * Copyright 2011-2016 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
- */
-// Core variables and mixins
-@import "../inspinia/variables.less";
-
-
-
-@import "~bootstrap/less/mixins.less";
-// Reset and dependencies
-@import "~bootstrap/less/normalize.less";
-@import "~bootstrap/less/print.less";
-//We DO NOT use bootstrap's icon. We use font-awesome
-//@import "~bootstrap/less/glyphicons.less";
-// Core CSS
-@import "~bootstrap/less/scaffolding.less";
-@import "~bootstrap/less/type.less";
-@import "~bootstrap/less/code.less";
-@import "~bootstrap/less/grid.less";
-@import "~bootstrap/less/tables.less";
-@import "~bootstrap/less/forms.less";
-@import "~bootstrap/less/buttons.less";
-// Components
-@import "~bootstrap/less/component-animations.less";
-@import "~bootstrap/less/dropdowns.less";
-@import "~bootstrap/less/button-groups.less";
-@import "~bootstrap/less/input-groups.less";
-@import "~bootstrap/less/navs.less";
-@import "~bootstrap/less/navbar.less";
-@import "~bootstrap/less/breadcrumbs.less";
-@import "~bootstrap/less/pagination.less";
-@import "~bootstrap/less/pager.less";
-@import "~bootstrap/less/labels.less";
-@import "~bootstrap/less/badges.less";
-@import "~bootstrap/less/jumbotron.less";
-@import "~bootstrap/less/thumbnails.less";
-@import "~bootstrap/less/alerts.less";
-@import "~bootstrap/less/progress-bars.less";
-@import "~bootstrap/less/media.less";
-@import "~bootstrap/less/list-group.less";
-@import "~bootstrap/less/panels.less";
-@import "~bootstrap/less/responsive-embed.less";
-@import "~bootstrap/less/wells.less";
-@import "~bootstrap/less/close.less";
-// Components w/ JavaScript
-@import "~bootstrap/less/modals.less";
-@import "~bootstrap/less/tooltip.less";
-@import "~bootstrap/less/popovers.less";
-@import "~bootstrap/less/carousel.less";
-// Utility classes
-@import "~bootstrap/less/utilities.less";
-@import "~bootstrap/less/responsive-utilities.less";

src/assets/css/global/border.less

@@ -36,6 +36,6 @@
 }
 
 .border-bottom {
-  border-bottom: 1px solid #eee;
+  border-bottom: 1px solid #F9F9F9;
 }
 

src/assets/css/global/button.less

@@ -1,31 +1,85 @@
+@import "variables";
+
+.btn {
+  display: inline-block;
+  margin-bottom: 0;
+  font-weight: normal;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  -ms-touch-action: manipulation;
+  touch-action: manipulation;
+  cursor: pointer;
+  background-image: none;
+  border: 1px solid transparent;
+  padding: 6px 12px;
+  font-size: 14px;
+  line-height: 1.42857143;
+  border-radius: 4px;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
 
 .btn-action {
-	margin: 0 3px;
-	display: inline-block;
-	opacity: 0.85;
-	-webkit-transition: all 0.1s;
-	-o-transition: all 0.1s;
-	transition: all 0.1s;
-	cursor: pointer;
+  margin: 0 3px;
+  display: inline-block;
+  opacity: 0.85;
+  -webkit-transition: all 0.1s;
+  -o-transition: all 0.1s;
+  transition: all 0.1s;
+  cursor: pointer;
+  outline: none;
 
-	&:hover {
-		text-decoration: none;
-		opacity: 1;
-		-moz-transform: scale(1.2);
-		-webkit-transform: scale(1.2);
-		-o-transform: scale(1.2);
-		-ms-transform: scale(1.2);
-		transform: scale(1.2);
-	}
+  &:hover {
+    text-decoration: none;
+    opacity: 1;
+    -moz-transform: scale(1.2);
+    -webkit-transform: scale(1.2);
+    -o-transform: scale(1.2);
+    -ms-transform: scale(1.2);
+    transform: scale(1.2);
+  }
+
+  &:focus {
+    outline: none;
+  }
+}
+
+.btn-primary {
+  color: #fff;
+  background-color: #337ab7;
+  border-color: #2e6da4;
+}
+
+.btn-primary:focus,
+.btn-primary.focus {
+  color: #fff;
+  background-color: #286090;
+  border-color: #122b40;
+}
+
+.btn-primary:hover {
+  color: #fff;
+  background-color: #286090;
+  border-color: #204d74;
+}
+
+.btn-sm {
+  padding: 5px 10px;
+  font-size: 12px;
+  line-height: 1.5;
+  border-radius: 3px;
 }
 
 //编辑区域按钮，鼠标一上去按钮变大
 .action-buttons {
-	a {
-		.btn-action;
-	}
+  a {
+    .btn-action;
+  }
 }
 
 .cursor {
-	cursor: pointer;
+  cursor: pointer;
 }

src/assets/css/global/color.less

@@ -1,359 +1,391 @@
-@import "../inspinia/variables.less";
 @import "./variables.less";
 
 .bg-primary {
-	background-color: @brand-primary;
-	color: white;
+  background-color: @brand-primary;
+  color: white;
 }
 
 .bg-success {
-	background-color: @brand-success;
-	color: white;
+  background-color: @brand-success;
+  color: white;
 }
 
 .bg-info {
-	background-color: @brand-info;
-	color: white;
+  background-color: @brand-info;
+  color: white;
 }
 
 .bg-warning {
-	background-color: @brand-warning;
-	color: white;
+  background-color: @brand-warning;
+  color: white;
 }
 
 .bg-danger {
-	background-color: @brand-danger;
-	color: white;
+  background-color: @brand-danger;
+  color: white;
 }
 
 .bg-gray {
-	background-color: @brand-gray;
-	color: white;
+  background-color: @brand-gray;
+  color: white;
 }
 
 .bg-laxative {
-	background-color: @brand-laxative;
-	color: white;
+  background-color: @brand-laxative;
+  color: white;
 }
 
+
 .text-primary {
-	color: @brand-primary;
+  color: @brand-primary;
+}
+
+.text-success {
+  color: @brand-success;
+}
+
+.text-info {
+  color: @brand-info;
+}
+
+.text-warning {
+  color: @brand-warning;
+}
+
+.text-danger {
+  color: @brand-danger;
+}
+
+.text-gray {
+  color: @brand-gray;
+}
+
+.text-laxative {
+  color: @brand-laxative;
+}
+
+.text-theme {
+  color: @primary-color;
 }
 
 .bg-navy {
-	background-color: #001F3F;
+  background-color: #001F3F;
 }
 
 .bg-blue {
-	background-color: #0074D9;
+  background-color: #0074D9;
 }
 
 .bg-aqua {
-	background-color: #7FDBFF;
+  background-color: #7FDBFF;
 }
 
 .bg-aliceblue {
-	background-color: aliceblue;
+  background-color: aliceblue;
 }
 
 .bg-pink {
-	background-color: pink;
+  background-color: pink;
 }
 
 .bg-azure {
-	background-color: azure;
+  background-color: azure;
 }
 
 .bg-teal {
-	background-color: #39CCCC;
+  background-color: #39CCCC;
 }
 
 .bg-olive {
-	background-color: #3D9970;
+  background-color: #3D9970;
 }
 
 .bg-green {
-	background-color: #2ECC40;
+  background-color: #2ECC40;
 }
 
 .bg-lime {
-	background-color: #01FF70;
+  background-color: #01FF70;
 }
 
 .bg-yellow {
-	background-color: #FFDC00;
+  background-color: #FFDC00;
 }
 
 .bg-pink {
-	color: pink;
+  color: pink;
 }
 
 .bg-orange {
-	background-color: #FF851B;
+  background-color: #FF851B;
 }
 
 .bg-red {
-	background-color: #FF4136;
+  background-color: #FF4136;
 }
 
 .bg-fuchsia {
-	background-color: #F012BE;
+  background-color: #F012BE;
 }
 
 .bg-purple {
-	background-color: #B10DC9;
+  background-color: #B10DC9;
 }
 
 .bg-maroon {
-	background-color: #85144B;
+  background-color: #85144B;
 }
 
 .bg-white {
-	background-color: #FFFFFF;
+  background-color: #FFFFFF;
 }
 
 .bg-gray {
-	background-color: #AAAAAA;
+  background-color: #AAAAAA;
 }
 
 .bg-silver {
-	background-color: #DDDDDD;
+  background-color: #DDDDDD;
 }
 
 .bg-silver-white {
-	background-color: #EEEEEE;
+  background-color: #EEEEEE;
 }
 
 .bg-black {
-	background-color: #111111;
+  background-color: #111111;
 }
 
 .bg-111 {
-	background-color: #111
+  background-color: #111
 }
 
 .bg-222 {
-	background-color: #222
+  background-color: #222
 }
 
 .bg-333 {
-	background-color: #333
+  background-color: #333
 }
 
 .bg-444 {
-	background-color: #444
+  background-color: #444
 }
 
 .bg-555 {
-	background-color: #555
+  background-color: #555
 }
 
 .bg-666 {
-	background-color: #666
+  background-color: #666
 }
 
 .bg-777 {
-	background-color: #777
+  background-color: #777
 }
 
 .bg-888 {
-	background-color: #888
+  background-color: #888
 }
 
 .bg-999 {
-	background-color: #999
+  background-color: #999
 }
 
 .bg-aaa {
-	background-color: #aaa
+  background-color: #aaa
 }
 
 .bg-bbb {
-	background-color: #bbb
+  background-color: #bbb
 }
 
 .bg-ccc {
-	background-color: #ccc
+  background-color: #ccc
 }
 
 .bg-ddd {
-	background-color: #ddd
+  background-color: #ddd
 }
 
 .bg-eee {
-	background-color: #eee
+  background-color: #eee
 }
 
+
 /* Colors */
 .navy {
-	color: #001F3F;
+  color: #001F3F;
 }
 
 .blue {
-	color: #0074D9;
+  color: #0074D9;
 }
 
 .aqua {
-	color: #7FDBFF;
+  color: #7FDBFF;
 }
 
 .teal {
-	color: #39CCCC;
+  color: #39CCCC;
 }
 
 .olive {
-	color: #3D9970;
+  color: #3D9970;
 }
 
 .green {
-	color: #2ECC40;
+  color: #2ECC40;
 }
 
 .lime {
-	color: #01FF70;
+  color: #01FF70;
 }
 
 .yellow {
-	color: #FFDC00;
+  color: #FFDC00;
 }
 
 .pink {
-	color: pink;
+  color: pink;
 }
 
 .orange {
-	color: #FF851B;
+  color: #FF851B;
 }
 
 .red {
-	color: #FF4136;
+  color: #FF4136;
 }
 
 .fuchsia {
-	color: #F012BE;
+  color: #F012BE;
 }
 
 .purple {
-	color: #B10DC9;
+  color: #B10DC9;
 }
 
 .maroon {
-	color: #85144B;
+  color: #85144B;
 }
 
 .white {
-	color: #FFFFFF;
+  color: #FFFFFF;
 }
 
 .silver {
-	color: #DDDDDD;
+  color: #DDDDDD;
 }
 
 .gray {
-	color: #AAAAAA;
+  color: #AAAAAA;
 }
 
 .black {
-	color: #111111;
+  color: #111111;
 }
 
+
 .color-111 {
-	color: #111
+  color: #111
 }
 
 .color-222 {
-	color: #222
+  color: #222
 }
 
 .color-333 {
-	color: #333
+  color: #333
 }
 
 .color-444 {
-	color: #444
+  color: #444
 }
 
 .color-555 {
-	color: #555
+  color: #555
 }
 
 .color-666 {
-	color: #666
+  color: #666
 }
 
 .color-777 {
-	color: #777
+  color: #777
 }
 
 .color-888 {
-	color: #888
+  color: #888
 }
 
 .color-999 {
-	color: #999
+  color: #999
 }
 
 .color-aaa {
-	color: #aaa
+  color: #aaa
 }
 
 .color-bbb {
-	color: #bbb
+  color: #bbb
 }
 
 .color-ccc {
-	color: #ccc
+  color: #ccc
 }
 
 .color-ddd {
-	color: #ddd
+  color: #ddd
 }
 
 .color-eee {
-	color: #eee
+  color: #eee
 }
 
+
 .color-text {
-	color: #660E7A;
+  color: #660E7A;
 }
 
 .color-doc {
-	color: #295496;
+  color: #295496;
 }
 
 .color-xls {
-	color: #1E6C41;
+  color: #1E6C41;
 }
 
 .color-ppt {
-	color: #D04324;
+  color: #D04324;
 }
 
 .color-pdf {
-	color: #E40B0B;
+  color: #E40B0B;
 }
 
 .color-audio {
-	color: #5bc0de;
+  color: #5bc0de;
 }
 
 .color-video {
-	color: #5cb85c;
+  color: #5cb85c;
 }
 
 .color-image {
-	color: #0074D9;
+  color: #0074D9;
 }
 
 .color-archive {
-	color: #4437f2;
+  color: #4437f2;
 }
 
 .color-light-active {
-	color: #ffc60c;
+  color: #ffc60c;
 }
 
 .color-light-inactive {
-	color: #ccc;
+  color: #ccc;
 }
 
+

src/assets/css/global/font.less

@@ -1,38 +1,38 @@
-#font{
-  .f(@from,@end,@step){
-    .mX(@f,@e,@s) when (@e >= @f){
-      .f@{e}{
-        font-size:@e*1px!important;
+#font {
+  .f(@from,@end,@step) {
+    .mX(@f,@e,@s) when (@e >= @f) {
+      .f@{e} {
+        font-size: @e*1px !important;
       }
-      .mX(@f,@e - @s,@s);
+      .mX(@f, @e - @s, @s);
     }
-    .mX(@from,@end,@step);
+    .mX(@from, @end, @step);
   }
 
 }
 
-#font > .f(10,80,1);
+#font > .f(10, 80, 1);
 
-#font{
-  .ln(@from,@end,@step){
-    .mX(@f,@e,@s) when (@e >= @f){
-      .ln@{e}{
-        line-height:@e*1px!important;
+#font {
+  .ln(@from,@end,@step) {
+    .mX(@f,@e,@s) when (@e >= @f) {
+      .ln@{e} {
+        line-height: @e*1px !important;
       }
-      .mX(@f,@e - @s,@s);
+      .mX(@f, @e - @s, @s);
     }
-    .mX(@from,@end,@step);
+    .mX(@from, @end, @step);
   }
 
 }
 
-#font > .ln(10,100,1);
+#font > .ln(10, 100, 1);
 
 
-
-.bold{
-  font-weight:bold;
+.bold {
+  font-weight: bold;
 }
-.italic{
-  font-style:italic;
+
+.italic {
+  font-style: italic;
 }

src/assets/css/global/layout.less

@@ -1,132 +1,143 @@
-#layout{
-  .margin(@from,@end,@step){
-    .mX(@f,@e,@s) when (@e >= @f){
-      .m@{e}{
-        margin:@e*1px;
+/**
+全局常用样式定义
+使用ml、pt等缩写表示常用的布局方式，数字表示像素值
+比如ml10表示margin-left:10px;
+ */
+#layout {
+  .margin(@from,@end,@step) {
+    .mX(@f,@e,@s) when (@e >= @f) {
+      .m@{e} {
+        margin: @e*1px;
       }
-      .mt@{e}{
-        margin-top:@e*1px;
+      .mt@{e} {
+        margin-top: @e*1px;
       }
-      .mr@{e}{
-        margin-right:@e*1px;
+      .mr@{e} {
+        margin-right: @e*1px;
       }
-      .mb@{e}{
+      .mb@{e} {
         margin-bottom: @e*1px;
       }
-      .ml@{e}{
+      .ml@{e} {
         margin-left: @e*1px;
       }
-      .mv@{e}{
+      .mv@{e} {
         margin-top: @e*1px;
         margin-bottom: @e*1px;
       }
-      .mh@{e}{
+      .mh@{e} {
         margin-left: @e*1px;
         margin-right: @e*1px*1px;
       }
-      .mX(@f,@e - @s,@s);
+      .mX(@f, @e - @s, @s);
     }
-    .mX(@from,@end,@step);
+    .mX(@from, @end, @step);
   }
-  .padding(@from,@end,@step){
-    .pX(@f,@e,@s) when (@e >= @f){
-      .p@{e}{
-        padding:@e*1px;
+  .padding(@from,@end,@step) {
+    .pX(@f,@e,@s) when (@e >= @f) {
+      .p@{e} {
+        padding: @e*1px;
       }
-      .pt@{e}{
-        padding-top:@e*1px;
+      .pt@{e} {
+        padding-top: @e*1px;
       }
-      .pr@{e}{
-        padding-right:@e*1px;
+      .pr@{e} {
+        padding-right: @e*1px;
       }
-      .pb@{e}{
+      .pb@{e} {
         padding-bottom: @e*1px;
       }
-      .pl@{e}{
+      .pl@{e} {
         padding-left: @e*1px;
       }
-      .pv@{e}{
+      .pv@{e} {
         padding-top: @e*1px;
         padding-bottom: @e*1px;
       }
-      .ph@{e}{
+      .ph@{e} {
         padding-left: @e*1px;
         padding-right: @e*1px;
       }
-      .pX(@f,@e - @s,@s);
+      .pX(@f, @e - @s, @s);
     }
-    .pX(@from,@end,@step);
+    .pX(@from, @end, @step);
   }
-  .width(@from,@end,@step){
-    .wX(@f,@e,@s) when (@e >= @f){
-      .w@{e}{
-        width:@e*1px;
+  .width(@from,@end,@step) {
+    .wX(@f,@e,@s) when (@e >= @f) {
+      .w@{e} {
+        width: @e*1px;
       }
-      .w@{e}m{
-        max-width:@e*1px;
+      .w@{e}m {
+        max-width: @e*1px;
       }
-      .w@{e}n{
-        min-width:@e*1px;
+      .w@{e}n {
+        min-width: @e*1px;
       }
-      .w@{e}i{
-        width:@e*1px!important;
+      .w@{e}i {
+        width: @e*1px !important;
       }
-      .wX(@f,@e - @s,@s);
+      .wX(@f, @e - @s, @s);
     }
-    .wX(@from,@end,@step);
+    .wX(@from, @end, @step);
   }
-  .height(@from,@end,@step){
-    .hX(@f,@e,@s) when (@e >= @f){
-      .h@{e}{
-        height:@e*1px;
+  .height(@from,@end,@step) {
+    .hX(@f,@e,@s) when (@e >= @f) {
+      .h@{e} {
+        height: @e*1px;
       }
-      .lh@{e}{
-        line-height:@e*1px;
+      .lh@{e} {
+        line-height: @e*1px;
       }
-      .h@{e}m{
-        max-height:@e*1px;
+      .h@{e}m {
+        max-height: @e*1px;
       }
-      .h@{e}n{
-        min-height:@e*1px;
+      .h@{e}n {
+        min-height: @e*1px;
       }
-      .h@{e}i{
-        height:@e*1px!important;
+      .h@{e}i {
+        height: @e*1px !important;
       }
-      .hX(@f,@e - @s,@s);
+      .hX(@f, @e - @s, @s);
     }
-    .hX(@from,@end,@step);
+    .hX(@from, @end, @step);
   }
 }
 
-.wp20{
-  width:20%;
+.wp20 {
+  width: 20%;
 }
-.wp25{
-  width:25%;
+
+.wp25 {
+  width: 25%;
 }
-.wp33{
-  width:33%;
+
+.wp33 {
+  width: 33%;
 }
-.wp100{
-  width:100%;
+
+.wp100 {
+  width: 100%;
 }
-.wp50{
-  width:50%;
+
+.wp50 {
+  width: 50%;
 }
-.hp100{
-  height:100%;
+
+.hp100 {
+  height: 100%;
 }
-.hp50{
+
+.hp50 {
   height: 50%;
 }
 
-#layout > .margin(20,200,5);
-#layout > .margin(0,19,1);
-#layout > .padding(20,200,5);
-#layout > .padding(0,19,1);
-#layout > .width(20,400,10);
-#layout > .width(0,19,1);
-#layout > .height(20,400,10);
-#layout > .height(0,19,1);
+#layout > .margin(20, 200, 5);
+#layout > .margin(0, 19, 1);
+#layout > .padding(20, 200, 5);
+#layout > .padding(0, 19, 1);
+#layout > .width(20, 400, 5);
+#layout > .width(0, 19, 1);
+#layout > .height(20, 400, 5);
+#layout > .height(0, 19, 1);
 
 

src/assets/css/global/miscellaneous.less

@@ -1,66 +1,157 @@
+@import "variables";
+
 .compulsory {
-	&:before {
-		content: "*";
-		color: red;
-	}
+  &:before {
+    content: "*";
+    color: red;
+  }
 }
 
 .limit-hints {
-	font-size: 10px;
-	color: #aaaaaa;
-	float: right;
+  font-size: 10px;
+  color: #aaaaaa;
+  float: right;
 }
 
 .hover-underline {
 
-	cursor: pointer;
-	&:hover {
-		text-decoration: underline;
-	}
+  cursor: pointer;
+
+  &:hover {
+    text-decoration: underline;
+  }
 
 }
 
-.btn-file {
-	overflow: hidden;
-	position: relative;
-	vertical-align: middle;
-	cursor: pointer;
-	> input {
-		position: absolute;
-		top: 0;
-		right: 0;
-		margin: 0;
-		opacity: 0;
-		filter: alpha(opacity=0);
-		font-size: 23px;
-		height: 100%;
-		width: 100%;
-		direction: ltr;
-		cursor: pointer;
-	}
-}
 
+//超出三行使用点点点
 .list-text-restriction {
-	display: -webkit-box;
-	-webkit-box-orient: vertical;
-	overflow: hidden;
-	position: relative;
-	line-height: 17px;
-	max-height: 51px;
-	-webkit-line-clamp: 3;
-	text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  position: relative;
+  line-height: 17px;
+  max-height: 51px;
+  -webkit-line-clamp: 3;
+  text-overflow: ellipsis;
 }
 
 .one-line {
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .inline-block {
-	display: inline-block;
+  display: inline-block;
 }
 
 .overflow-hidden {
-	overflow: hidden;
+  overflow: hidden;
+}
+
+//讨厌的outline
+a {
+  outline: none;
+
+  &:focus, &:hover, &:active {
+    outline: none;
+  }
+}
+
+//制造一个手机容器
+.mobile-container {
+  max-width: 400px;
+  border: 1px solid #eee;
+  padding: 10px;
+  margin: 10px auto;
+  display: block;
+  background-color: white;
+}
+
+
+//按照字母来wrap，不然有些老长老长
+.wrap-word {
+  word-wrap: break-word;
+}
+
+.text-left {
+  text-align: left;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.text-right {
+  text-align: right;
+}
+
+.display-none {
+  display: none !important;
+}
+
+.pull-right {
+  float: right !important;
+}
+
+.pull-left {
+  float: left !important;
+}
+
+//超链接导航样式
+.link {
+  color: #1890ff;
+  text-decoration: none;
+  background-color: transparent;
+  outline: none;
+  cursor: pointer;
+  transition: color 0.3s;
+  text-decoration-skip: objects;
+}
+
+
+//头像
+.avatar-large {
+  border-radius: 50%;
+  width: 120px;
+  height: 120px;
+  cursor: pointer;
+}
+
+.avatar-middle {
+  border-radius: 50%;
+  width: 80px;
+  height: 80px;
+  cursor: pointer;
+}
+
+.avatar-small {
+  border-radius: 50%;
+  width: 60px;
+  height: 60px;
+  cursor: pointer;
+}
+
+.relative {
+  position: relative;
+}
+
+.hot-area {
+  position: relative;
+
+  &:after {
+    position: absolute;
+    top: -10px;
+    right: -10px;
+    bottom: -10px;
+    left: -10px;
+    content: '';
+  }
+}
+
+.custom-handle-modal {
+  .ant-modal-confirm-btns {
+    display: none;
+  }
 }

src/assets/css/global/mixin.less

@@ -0,0 +1,11 @@
+//超出三行使用点点点
+.line-ellipsis(@rows,@line-height) {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  position: relative;
+  line-height: @line-height;
+  max-height: @line-height * @rows;
+  -webkit-line-clamp: @rows;
+  text-overflow: ellipsis;
+}

src/assets/css/global/responsive.less

@@ -19,18 +19,25 @@
 }
 
 //浏览器滚动条样式
-.thin-scrollbar {
-  ::-webkit-scrollbar {
-    width: 3px;
-    height: 3px;
-  }
-
-  ::-webkit-scrollbar-track {
-    background: transparent;
-  }
-
-  ::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.3);
-  }
 
+//滚动条样式
+::-webkit-scrollbar {
+  width: 10px;
+  height: 10px
+}
+
+::-webkit-scrollbar-thumb {
+  transition: all .3s ease;
+  border-color: transparent;
+  background-color: rgba(0, 0, 0, .1);
+  z-index: 40
+}
+
+::-webkit-scrollbar-thumb:hover {
+  transition: all .3s ease;
+  background-color: rgba(0, 0, 0, .15)
+}
+
+::-webkit-scrollbar-corner {
+  background-color: #eaeaeb
 }

src/assets/css/global/variables.less

@@ -1,13 +1,22 @@
-@import "../inspinia/variables.less";
+@import "../bootstrap/variables.less";
+//custom basic color
+@brand-primary: #215891;
+@brand-success: #67C23A;
+@brand-info: #2DB7F5;
+@brand-warning: #E6A23C;
+@brand-danger: #FF756F;
+@brand-gray: #c2c2c2;
+@brand-laxative: #B3EE3A;
 
+//主题默认颜色
+@primary-color: @brand-primary;
+
+//左侧菜单宽度
+@sidebar-width: 200px;
+
+//顶部导航栏宽度
 @top-navigation-height: 45px;
 
-@app-color-title: #474747;
-@app-color-content: #8A8A8A;
-
-//上方导航栏高度
-@frame-header-height: 80px;
-
 //下方蓝眼云盘高度
 @power-footer-height: 40px;
 

src/assets/css/index.less

@@ -0,0 +1,17 @@
+//使用自定义的主题
+@import "global/animation";
+@import "global/border";
+@import "global/button";
+@import "global/color";
+@import "global/font";
+@import "global/layout";
+@import "global/miscellaneous";
+@import "global/responsive";
+
+html, body {
+  font-family: "微软雅黑", Microsoft YaHei, "Helvetica Neue", Helvetica, Arial, sans-serif, "open sans";
+  font-size: 13px;
+  color: @text-color;
+
+
+}

src/assets/css/inspinia/badgets_labels.less

@@ -1,72 +0,0 @@
-
-.label {
-  background-color: @light-gray;
-  color: @label-badget-color;
-  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 10px;
-  font-weight: 600;
-  padding: 3px 8px;
-  text-shadow: none;
-}
-
-.badge {
-  background-color: @light-gray;
-  color: @label-badget-color;
-  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-  font-size: 11px;
-  font-weight: 600;
-  padding-bottom: 4px;
-  padding-left: 6px;
-  padding-right: 6px;
-  text-shadow: none;
-}
-
-.label-primary, .badge-primary {
-  background-color: @navy;
-  color: #FFFFFF;
-}
-
-.label-success, .badge-success {
-  background-color: @blue;
-  color: #FFFFFF;
-}
-
-.label-warning, .badge-warning {
-  background-color: @yellow;
-  color: #FFFFFF;
-}
-
-.label-warning-light, .badge-warning-light {
-  background-color: @yellow;
-  color: #ffffff;
-}
-
-.label-danger, .badge-danger {
-  background-color: @red;
-  color: #FFFFFF;
-}
-
-.label-info, .badge-info {
-  background-color: @lazur;
-  color: #FFFFFF;
-}
-
-.label-inverse, .badge-inverse {
-  background-color: #262626;
-  color: #FFFFFF;
-}
-
-.label-laxative, .badge-laxative {
-  background-color: @green;
-  color: #FFFFFF;
-}
-
-.label-white, .badge-white {
-  background-color: #FFFFFF;
-  color: #5E5E5E;
-}
-
-.label-white, .badge-disable {
-  background-color: #2A2E36;
-  color: #8B91A0;
-}

src/assets/css/inspinia/buttons.less

@@ -1,309 +0,0 @@
-
-.btn {
-  border-radius: @btn-border-radius;
-}
-
-.float-e-margins .btn {
-  margin-bottom: 5px;
-}
-
-.btn-w-m {
-  min-width: 120px;
-}
-
-.btn-primary.btn-outline {
-  color: @navy;
-}
-
-.btn-success.btn-outline {
-  color: @blue;
-}
-
-.btn-info.btn-outline {
-  color: @lazur;
-}
-
-.btn-warning.btn-outline {
-  color: @yellow;
-}
-
-.btn-danger.btn-outline {
-  color: @red;
-}
-
-.btn-primary.btn-outline:hover,
-.btn-success.btn-outline:hover,
-.btn-info.btn-outline:hover,
-.btn-warning.btn-outline:hover,
-.btn-danger.btn-outline:hover {
-  color: #fff;
-}
-
-.btn-primary {
-  background-color: @navy;
-  border-color: @navy;
-  color: #FFFFFF;
-}
-
-.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary, .btn-primary:active:focus, .btn-primary:active:hover, .btn-primary.active:hover, .btn-primary.active:focus {
-  background-color: darken(@navy, 3%);
-  border-color: darken(@navy, 3%);
-  color: #FFFFFF;
-}
-
-.btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
-  background-image: none;
-}
-
-.btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled:active, .btn-primary.disabled.active, .btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled]:active, .btn-primary.active[disabled], fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary.active {
-  background-color: lighten(@navy, 4%);
-  border-color: lighten(@navy, 4%);
-}
-
-.btn-success {
-  background-color: @blue;
-  border-color: @blue;
-  color: #FFFFFF;
-}
-
-.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success, .btn-success:active:focus, .btn-success:active:hover, .btn-success.active:hover, .btn-success.active:focus {
-  background-color: darken(@blue, 3%);
-  border-color: darken(@blue, 3%);
-  color: #FFFFFF;
-}
-
-.btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success {
-  background-image: none;
-}
-
-.btn-success.disabled, .btn-success.disabled:hover, .btn-success.disabled:focus, .btn-success.disabled:active, .btn-success.disabled.active, .btn-success[disabled], .btn-success[disabled]:hover, .btn-success[disabled]:focus, .btn-success[disabled]:active, .btn-success.active[disabled], fieldset[disabled] .btn-success, fieldset[disabled] .btn-success:hover, fieldset[disabled] .btn-success:focus, fieldset[disabled] .btn-success:active, fieldset[disabled] .btn-success.active {
-  background-color: lighten(@blue, 4%);
-  border-color: lighten(@blue, 4%);
-}
-
-.btn-info {
-  background-color: @lazur;
-  border-color: @lazur;
-  color: #FFFFFF;
-}
-
-.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info, .btn-info:active:focus, .btn-info:active:hover, .btn-info.active:hover, .btn-info.active:focus {
-  background-color: darken(@lazur, 3%);
-  border-color: darken(@lazur, 3%);
-  color: #FFFFFF;
-}
-
-.btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info {
-  background-image: none;
-}
-
-.btn-info.disabled, .btn-info.disabled:hover, .btn-info.disabled:focus, .btn-info.disabled:active, .btn-info.disabled.active, .btn-info[disabled], .btn-info[disabled]:hover, .btn-info[disabled]:focus, .btn-info[disabled]:active, .btn-info.active[disabled], fieldset[disabled] .btn-info, fieldset[disabled] .btn-info:hover, fieldset[disabled] .btn-info:focus, fieldset[disabled] .btn-info:active, fieldset[disabled] .btn-info.active {
-  background-color: lighten(@lazur, 4%);
-  border-color: lighten(@lazur, 4%);
-}
-
-.btn-default {
-  color: inherit;
-  background: white;
-  border: 1px solid @border-color;
-}
-
-.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default, .btn-default:active:focus, .btn-default:active:hover, .btn-default.active:hover, .btn-default.active:focus {
-  color: inherit;
-  border: 1px solid #d2d2d2;
-}
-
-.btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
-}
-
-.btn-default.disabled, .btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled:active, .btn-default.disabled.active, .btn-default[disabled], .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled]:active, .btn-default.active[disabled], fieldset[disabled] .btn-default, fieldset[disabled] .btn-default:hover, fieldset[disabled] .btn-default:focus, fieldset[disabled] .btn-default:active, fieldset[disabled] .btn-default.active {
-  color: #cacaca;
-}
-
-.btn-warning {
-  background-color: @yellow;
-  border-color: @yellow;
-  color: #FFFFFF;
-}
-
-.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning, .btn-warning:active:focus, .btn-warning:active:hover, .btn-warning.active:hover, .btn-warning.active:focus {
-  background-color: darken(@yellow, 3%);
-  border-color: darken(@yellow, 3%);
-  color: #FFFFFF;
-}
-
-.btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning {
-  background-image: none;
-}
-
-.btn-warning.disabled, .btn-warning.disabled:hover, .btn-warning.disabled:focus, .btn-warning.disabled:active, .btn-warning.disabled.active, .btn-warning[disabled], .btn-warning[disabled]:hover, .btn-warning[disabled]:focus, .btn-warning[disabled]:active, .btn-warning.active[disabled], fieldset[disabled] .btn-warning, fieldset[disabled] .btn-warning:hover, fieldset[disabled] .btn-warning:focus, fieldset[disabled] .btn-warning:active, fieldset[disabled] .btn-warning.active {
-  background-color: lighten(@yellow, 4%);
-  border-color: lighten(@yellow, 4%);
-}
-
-.btn-danger {
-  background-color: @red;
-  border-color: @red;
-  color: #FFFFFF;
-}
-
-.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger, .btn-danger:active:focus, .btn-danger:active:hover, .btn-danger.active:hover, .btn-danger.active:focus {
-  background-color: darken(@red, 3%);
-  border-color: darken(@red, 3%);
-  color: #FFFFFF;
-}
-
-.btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger {
-  background-image: none;
-}
-
-.btn-danger.disabled, .btn-danger.disabled:hover, .btn-danger.disabled:focus, .btn-danger.disabled:active, .btn-danger.disabled.active, .btn-danger[disabled], .btn-danger[disabled]:hover, .btn-danger[disabled]:focus, .btn-danger[disabled]:active, .btn-danger.active[disabled], fieldset[disabled] .btn-danger, fieldset[disabled] .btn-danger:hover, fieldset[disabled] .btn-danger:focus, fieldset[disabled] .btn-danger:active, fieldset[disabled] .btn-danger.active {
-  background-color: lighten(@red, 4%);
-  border-color: lighten(@red, 4%);
-}
-
-.btn-link {
-  color: inherit;
-}
-
-.btn-link:hover, .btn-link:focus, .btn-link:active, .btn-link.active, .open .dropdown-toggle.btn-link {
-  color: @navy;
-  text-decoration: none;
-}
-
-.btn-link:active, .btn-link.active, .open .dropdown-toggle.btn-link {
-  background-image: none;
-}
-
-.btn-link.disabled, .btn-link.disabled:hover, .btn-link.disabled:focus, .btn-link.disabled:active, .btn-link.disabled.active, .btn-link[disabled], .btn-link[disabled]:hover, .btn-link[disabled]:focus, .btn-link[disabled]:active, .btn-link.active[disabled], fieldset[disabled] .btn-link, fieldset[disabled] .btn-link:hover, fieldset[disabled] .btn-link:focus, fieldset[disabled] .btn-link:active, fieldset[disabled] .btn-link.active {
-  color: #cacaca;
-}
-
-.btn-white {
-  color: inherit;
-  background: white;
-  border: 1px solid @border-color;
-}
-
-.btn-white:hover, .btn-white:focus, .btn-white:active, .btn-white.active, .open .dropdown-toggle.btn-white, .btn-white:active:focus, .btn-white:active:hover, .btn-white.active:hover, .btn-white.active:focus {
-  color: inherit;
-  border: 1px solid #d2d2d2;
-}
-
-.btn-white:active, .btn-white.active {
-  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
-}
-
-.btn-white:active, .btn-white.active, .open .dropdown-toggle.btn-white {
-  background-image: none;
-}
-
-.btn-white.disabled, .btn-white.disabled:hover, .btn-white.disabled:focus, .btn-white.disabled:active, .btn-white.disabled.active, .btn-white[disabled], .btn-white[disabled]:hover, .btn-white[disabled]:focus, .btn-white[disabled]:active, .btn-white.active[disabled], fieldset[disabled] .btn-white, fieldset[disabled] .btn-white:hover, fieldset[disabled] .btn-white:focus, fieldset[disabled] .btn-white:active, fieldset[disabled] .btn-white.active {
-  color: #cacaca;
-}
-
-.form-control, .form-control:focus, .has-error .form-control:focus, .has-success .form-control:focus, .has-warning .form-control:focus, .navbar-collapse, .navbar-form, .navbar-form-custom .form-control:focus, .navbar-form-custom .form-control:hover, .open .btn.dropdown-toggle, .panel, .popover, .progress, .progress-bar {
-  box-shadow: none;
-}
-
-.btn-outline {
-  color: inherit;
-  background-color: transparent;
-  transition: all .5s;
-}
-
-.btn-rounded {
-  border-radius: 50px;
-}
-
-.btn-large-dim {
-  width: 90px;
-  height: 90px;
-  font-size: 42px;
-}
-
-button.dim {
-  display: inline-block;
-  text-decoration: none;
-  text-transform: uppercase;
-  text-align: center;
-  padding-top: 6px;
-  margin-right: 10px;
-  position: relative;
-  cursor: pointer;
-  border-radius: 5px;
-  font-weight: 600;
-  margin-bottom: 20px !important;
-}
-
-button.dim:active {
-  top: 3px;
-}
-
-button.btn-primary.dim {
-  box-shadow: inset 0 0 0 darken(@navy, 6%), 0 5px 0 0 darken(@navy, 6%), 0 10px 5px #999;
-}
-
-button.btn-primary.dim:active {
-  box-shadow: inset 0 0 0 darken(@navy, 6%), 0 2px 0 0 darken(@navy, 6%), 0 5px 3px #999;
-}
-
-button.btn-default.dim {
-  box-shadow: inset 0 0 0 darken(@dark-gray, 6%), 0 5px 0 0 darken(@dark-gray, 6%), 0 10px 5px #999;
-}
-
-button.btn-default.dim:active {
-  box-shadow: inset 0 0 0 darken(@dark-gray, 6%), 0 2px 0 0 darken(@dark-gray, 6%), 0 5px 3px #999;
-}
-
-button.btn-warning.dim {
-  box-shadow: inset 0 0 0 darken(@yellow, 6%), 0 5px 0 0 darken(@yellow, 6%), 0 10px 5px #999;
-}
-
-button.btn-warning.dim:active {
-  box-shadow: inset 0 0 0 darken(@yellow, 6%), 0 2px 0 0 darken(@yellow, 6%), 0 5px 3px #999;
-}
-
-button.btn-info.dim {
-  box-shadow: inset 0 0 0 darken(@lazur, 6%), 0 5px 0 0 darken(@lazur, 6%), 0 10px 5px #999;
-}
-
-button.btn-info.dim:active {
-  box-shadow: inset 0 0 0 darken(@lazur, 6%), 0 2px 0 0 darken(@lazur, 6%), 0 5px 3px #999;
-}
-
-button.btn-success.dim {
-  box-shadow: inset 0 0 0 darken(@blue, 6%), 0 5px 0 0 darken(@blue, 6%), 0 10px 5px #999;
-}
-
-button.btn-success.dim:active {
-  box-shadow: inset 0 0 0 darken(@blue, 6%), 0 2px 0 0 darken(@blue, 6%), 0 5px 3px #999;
-}
-
-button.btn-danger.dim {
-  box-shadow: inset 0 0 0 darken(@red, 6%), 0 5px 0 0 darken(@red, 6%), 0 10px 5px #999;
-}
-
-button.btn-danger.dim:active {
-  box-shadow: inset 0 0 0 darken(@red, 6%), 0 2px 0 0 darken(@red, 6%), 0 5px 3px #999;
-}
-
-button.dim:before {
-  font-size: 50px;
-  line-height: 1em;
-  font-weight: normal;
-  color: #fff;
-  display: block;
-  padding-top: 10px;
-
-}
-
-button.dim:active:before {
-  top: 7px;
-  font-size: 50px;
-}
-
-.btn:focus {
-  outline: none !important;
-}

src/assets/css/inspinia/chat.less

@@ -1,119 +0,0 @@
-#small-chat {
-  position: fixed;
-  bottom: 20px;
-  right: 20px;
-  z-index: 100;
-}
-
-#small-chat .badge {
-  position: absolute;
-  top: -3px;
-  right: -4px;
-}
-
-.open-small-chat {
-  height: 38px;
-  width: 38px;
-  display: block;
-  background: #1ab394;
-  padding: 9px 8px;
-  text-align: center;
-  color: #fff;
-  border-radius: 50%;
-}
-
-.open-small-chat:hover {
-  color: white;
-  background: #1ab394;
-}
-
-.small-chat-box {
-  display: none;
-  position: fixed;
-  bottom: 20px;
-  right: 75px;
-  background: #fff;
-  border: 1px solid @border-color;
-  width: 230px;
-  height: 320px;
-  border-radius: 4px;
-}
-
-.small-chat-box.ng-small-chat {
-  display: block;
-}
-
-
-.small-chat-box.active {
-  display: block;
-}
-
-.small-chat-box {
-
-  .heading {
-    background: @nav-bg;
-    padding: 8px 15px;
-    font-weight: bold;
-    color: #fff;
-  }
-
-  .chat-date {
-    opacity: 0.6;
-    font-size: 10px;
-    font-weight: normal;
-  }
-
-  .content {
-    padding: 15px 15px;
-
-    .author-name {
-      font-weight: bold;
-      margin-bottom: 3px;
-      font-size: 11px;
-    }
-
-    > div {
-      padding-bottom: 20px;
-    }
-
-    .chat-message {
-      padding: 5px 10px;
-      border-radius: 6px;
-      font-size: 11px;
-      line-height: 14px;
-      max-width: 80%;
-      background: #f3f3f4;
-      margin-bottom: 10px;
-    }
-
-    .chat-message.active {
-      background: #1ab394;
-      color: #fff;
-    }
-
-    .left {
-      text-align: left;
-      clear: both;
-
-      .chat-message {
-        float: left;
-      }
-    }
-
-    .right {
-      text-align: right;
-      clear: both;
-
-      .chat-message {
-        float: right;
-      }
-
-    }
-
-  }
-
-  .form-chat {
-    padding: 10px 10px;
-  }
-
-}

src/assets/css/inspinia/mixins.less

@@ -1,15 +0,0 @@
-.border-radius (@radius: 3px) {
-  -webkit-border-radius: @radius;
-  -moz-border-radius: @radius;
-  border-radius: @radius;
-
-  -moz-background-clip: padding;
-  -webkit-background-clip: padding-box;
-  background-clip: padding-box;
-}
-
-.opacity (@opacity: 0.5) {
-  -webkit-opacity: @opacity;
-  -moz-opacity: @opacity;
-  opacity: @opacity;
-}

src/assets/css/inspinia/sidebar.less

@@ -1,191 +0,0 @@
-.sidebard-panel {
-  width: 220px;
-  background: darken(@gray, 3%);
-  padding: 10px 20px;
-  position: absolute;
-  right: 0;
-}
-
-.sidebard-panel .feed-element img.img-circle {
-  width: 32px;
-  height: 32px;
-}
-
-.sidebard-panel .feed-element, .media-body, .sidebard-panel p {
-  font-size: 12px;
-}
-
-.sidebard-panel .feed-element {
-  margin-top: 20px;
-  padding-bottom: 0;
-}
-
-.sidebard-panel .list-group {
-  margin-bottom: 10px;
-}
-
-.sidebard-panel .list-group .list-group-item {
-  padding: 5px 0;
-  font-size: 12px;
-  border: 0;
-}
-
-.sidebar-content .wrapper, .wrapper.sidebar-content {
-  padding-right: 230px !important;
-}
-
-// Right sidebar
-
-#right-sidebar {
-  background-color: #fff;
-  border-left: 1px solid #e7eaec;
-  border-top: 1px solid #e7eaec;
-  overflow: hidden;
-  position: fixed;
-  top: 60px;
-  width: 260px !important;
-  z-index: 1009;
-  bottom: 0;
-  right: -260px;
-}
-
-#right-sidebar.sidebar-open {
-  right: 0;
-}
-
-#right-sidebar.sidebar-open.sidebar-top {
-  top: 0;
-  border-top: none;
-}
-
-.sidebar-container {
-
-  ul.nav-tabs {
-    border: none;
-  }
-
-  ul.nav-tabs.navs-4 li {
-    width: 25%;
-  }
-  ul.nav-tabs.navs-3 li {
-    width: 33.3333%;
-  }
-  ul.nav-tabs.navs-2 li {
-    width: 50%;
-  }
-
-  ul.nav-tabs li {
-    border: none;
-  }
-
-  ul.nav-tabs li a {
-    border: none;
-    padding: 12px 10px;
-    margin: 0;
-    border-radius: 0;
-    background: @nav-bg;
-    color: #fff;
-    text-align: center;
-
-    border-right: 1px solid lighten(@nav-bg, 2%);
-  }
-
-  ul.nav-tabs li.active a {
-    border: none;
-    background: #f9f9f9;
-    color: @text-color;
-    font-weight: bold;
-
-  }
-
-  .nav-tabs > li.active > a:hover,
-  .nav-tabs > li.active > a:focus {
-
-    border: none;
-
-  }
-
-  ul.sidebar-list {
-    margin: 0;
-    padding: 0;
-  }
-
-  ul.sidebar-list li {
-    border-bottom: 1px solid @border-color;
-    padding: 15px 20px;
-    list-style: none;
-
-    font-size: 12px;
-  }
-
-  ul.sidebar-list li:nth-child(2n+2) {
-    //    background: #f9f9f9;
-  }
-
-  .sidebar-message:nth-child(2n+2) {
-    background: #f9f9f9;
-  }
-
-  ul.sidebar-list li a {
-    text-decoration: none;
-    color: inherit;
-  }
-
-  .sidebar-content {
-    padding: 15px 20px;
-    font-size: 12px;
-  }
-
-  .date-item {
-
-  }
-
-  .sidebar-title {
-    background: #f9f9f9;
-    padding: 20px;
-    border-bottom: 1px solid @border-color;
-
-    h3 {
-      margin-bottom: 3px;
-      padding-left: 2px;
-    }
-  }
-
-  .tab-content {
-
-    h4 {
-      margin-bottom: 5px;
-    }
-
-  }
-
-  .sidebar-message > a > .pull-left {
-    margin-right: 10px;
-  }
-
-  .sidebar-message > a {
-    text-decoration: none;
-    color: inherit;
-  }
-
-  .sidebar-message {
-    padding: 15px 20px;
-  }
-
-  .sidebar-message:hover {
-    //    background: #f9f9f9;
-  }
-
-  .sidebar-message .message-avatar {
-    height: 38px;
-    width: 38px;
-    border-radius: 50%;
-  }
-
-  .setings-item {
-    padding: 15px 20px;
-    border-bottom: 1px solid @border-color;
-  }
-
-}
-

src/assets/css/inspinia/spinners.less

@@ -1,997 +0,0 @@
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-rotating-plane"></div>
- *
- */
-
-.sk-spinner-rotating-plane.sk-spinner {
-  width: 30px;
-  height: 30px;
-  background-color: @spin-color;
-  margin: @spin-margin;
-  -webkit-animation: sk-rotatePlane 1.2s infinite ease-in-out;
-  animation: sk-rotatePlane 1.2s infinite ease-in-out;
-}
-
-@-webkit-keyframes sk-rotatePlane {
-  0% {
-    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-  }
-
-  50% {
-    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-  }
-
-  100% {
-    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-  }
-}
-
-@keyframes sk-rotatePlane {
-  0% {
-    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-  }
-
-  50% {
-    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-  }
-
-  100% {
-    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-double-bounce">
- *      <div class="sk-double-bounce1"></div>
- *      <div class="sk-double-bounce2"></div>
- *    </div>
- *
- */
-.sk-spinner-double-bounce.sk-spinner {
-  width: 40px;
-  height: 40px;
-  position: relative;
-  margin: @spin-margin;
-}
-
-.sk-spinner-double-bounce .sk-double-bounce1, .sk-spinner-double-bounce .sk-double-bounce2 {
-  width: 100%;
-  height: 100%;
-  border-radius: 50%;
-  background-color: @spin-color;
-  opacity: 0.6;
-  position: absolute;
-  top: 0;
-  left: 0;
-  -webkit-animation: sk-doubleBounce 2s infinite ease-in-out;
-  animation: sk-doubleBounce 2s infinite ease-in-out;
-}
-
-.sk-spinner-double-bounce .sk-double-bounce2 {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-@-webkit-keyframes sk-doubleBounce {
-  0%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  50% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes sk-doubleBounce {
-  0%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  50% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-wave">
- *      <div class="sk-rect1"></div>
- *      <div class="sk-rect2"></div>
- *      <div class="sk-rect3"></div>
- *      <div class="sk-rect4"></div>
- *      <div class="sk-rect5"></div>
- *    </div>
- *
- */
-.sk-spinner-wave.sk-spinner {
-  margin: @spin-margin;
-  width: 50px;
-  height: 30px;
-  text-align: center;
-  font-size: 10px;
-}
-
-.sk-spinner-wave div {
-  background-color: @spin-color;
-  height: 100%;
-  width: 6px;
-  display: inline-block;
-  -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
-  animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
-}
-
-.sk-spinner-wave .sk-rect2 {
-  -webkit-animation-delay: -1.1s;
-  animation-delay: -1.1s;
-}
-
-.sk-spinner-wave .sk-rect3 {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-.sk-spinner-wave .sk-rect4 {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
-
-.sk-spinner-wave .sk-rect5 {
-  -webkit-animation-delay: -0.8s;
-  animation-delay: -0.8s;
-}
-
-@-webkit-keyframes sk-waveStretchDelay {
-  0%, 40%, 100% {
-    -webkit-transform: scaleY(0.4);
-    transform: scaleY(0.4);
-  }
-
-  20% {
-    -webkit-transform: scaleY(1);
-    transform: scaleY(1);
-  }
-}
-
-@keyframes sk-waveStretchDelay {
-  0%, 40%, 100% {
-    -webkit-transform: scaleY(0.4);
-    transform: scaleY(0.4);
-  }
-
-  20% {
-    -webkit-transform: scaleY(1);
-    transform: scaleY(1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-wandering-cubes">
- *      <div class="sk-cube1"></div>
- *      <div class="sk-cube2"></div>
- *    </div>
- *
- */
-.sk-spinner-wandering-cubes.sk-spinner {
-  margin: @spin-margin;
-  width: 32px;
-  height: 32px;
-  position: relative;
-}
-
-.sk-spinner-wandering-cubes .sk-cube1, .sk-spinner-wandering-cubes .sk-cube2 {
-  background-color: @spin-color;
-  width: 10px;
-  height: 10px;
-  position: absolute;
-  top: 0;
-  left: 0;
-  -webkit-animation: sk-wanderingCubeMove 1.8s infinite ease-in-out;
-  animation: sk-wanderingCubeMove 1.8s infinite ease-in-out;
-}
-
-.sk-spinner-wandering-cubes .sk-cube2 {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
-
-@-webkit-keyframes sk-wanderingCubeMove {
-  25% {
-    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
-    transform: translateX(42px) rotate(-90deg) scale(0.5);
-  }
-
-  50% {
-    /* Hack to make FF rotate in the right direction */
-    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
-    transform: translateX(42px) translateY(42px) rotate(-179deg);
-  }
-
-  50.1% {
-    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
-    transform: translateX(42px) translateY(42px) rotate(-180deg);
-  }
-
-  75% {
-    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
-    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
-  }
-
-  100% {
-    -webkit-transform: rotate(-360deg);
-    transform: rotate(-360deg);
-  }
-}
-
-@keyframes sk-wanderingCubeMove {
-  25% {
-    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
-    transform: translateX(42px) rotate(-90deg) scale(0.5);
-  }
-
-  50% {
-    /* Hack to make FF rotate in the right direction */
-    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
-    transform: translateX(42px) translateY(42px) rotate(-179deg);
-  }
-
-  50.1% {
-    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
-    transform: translateX(42px) translateY(42px) rotate(-180deg);
-  }
-
-  75% {
-    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
-    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
-  }
-
-  100% {
-    -webkit-transform: rotate(-360deg);
-    transform: rotate(-360deg);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-pulse"></div>
- *
- */
-.sk-spinner-pulse.sk-spinner {
-  width: 40px;
-  height: 40px;
-  margin: @spin-margin;
-  background-color: @spin-color;
-  border-radius: 100%;
-  -webkit-animation: sk-pulseScaleOut 1s infinite ease-in-out;
-  animation: sk-pulseScaleOut 1s infinite ease-in-out;
-}
-
-@-webkit-keyframes sk-pulseScaleOut {
-  0% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  100% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-    opacity: 0;
-  }
-}
-
-@keyframes sk-pulseScaleOut {
-  0% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  100% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-    opacity: 0;
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-chasing-dots">
- *      <div class="sk-dot1"></div>
- *      <div class="sk-dot2"></div>
- *    </div>
- *
- */
-.sk-spinner-chasing-dots.sk-spinner {
-  margin: @spin-margin;
-  width: 40px;
-  height: 40px;
-  position: relative;
-  text-align: center;
-  -webkit-animation: sk-chasingDotsRotate 2s infinite linear;
-  animation: sk-chasingDotsRotate 2s infinite linear;
-}
-
-.sk-spinner-chasing-dots .sk-dot1, .sk-spinner-chasing-dots .sk-dot2 {
-  width: 60%;
-  height: 60%;
-  display: inline-block;
-  position: absolute;
-  top: 0;
-  background-color: @spin-color;
-  border-radius: 100%;
-  -webkit-animation: sk-chasingDotsBounce 2s infinite ease-in-out;
-  animation: sk-chasingDotsBounce 2s infinite ease-in-out;
-}
-
-.sk-spinner-chasing-dots .sk-dot2 {
-  top: auto;
-  bottom: 0;
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-@-webkit-keyframes sk-chasingDotsRotate {
-  100% {
-    -webkit-transform: rotate(360deg);
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes sk-chasingDotsRotate {
-  100% {
-    -webkit-transform: rotate(360deg);
-    transform: rotate(360deg);
-  }
-}
-
-@-webkit-keyframes sk-chasingDotsBounce {
-  0%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  50% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes sk-chasingDotsBounce {
-  0%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  50% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-three-bounce">
- *      <div class="sk-bounce1"></div>
- *      <div class="sk-bounce2"></div>
- *      <div class="sk-bounce3"></div>
- *    </div>
- *
- */
-.sk-spinner-three-bounce.sk-spinner {
-  margin: @spin-margin;
-  width: 70px;
-  text-align: center;
-}
-
-.sk-spinner-three-bounce div {
-  width: 18px;
-  height: 18px;
-  background-color: @spin-color;
-  border-radius: 100%;
-  display: inline-block;
-  -webkit-animation: sk-threeBounceDelay 1.4s infinite ease-in-out;
-  animation: sk-threeBounceDelay 1.4s infinite ease-in-out;
-  /* Prevent first frame from flickering when animation starts */
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-}
-
-.sk-spinner-three-bounce .sk-bounce1 {
-  -webkit-animation-delay: -0.32s;
-  animation-delay: -0.32s;
-}
-
-.sk-spinner-three-bounce .sk-bounce2 {
-  -webkit-animation-delay: -0.16s;
-  animation-delay: -0.16s;
-}
-
-@-webkit-keyframes sk-threeBounceDelay {
-  0%, 80%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  40% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes sk-threeBounceDelay {
-  0%, 80%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  40% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-circle">
- *      <div class="sk-circle1 sk-circle"></div>
- *      <div class="sk-circle2 sk-circle"></div>
- *      <div class="sk-circle3 sk-circle"></div>
- *      <div class="sk-circle4 sk-circle"></div>
- *      <div class="sk-circle5 sk-circle"></div>
- *      <div class="sk-circle6 sk-circle"></div>
- *      <div class="sk-circle7 sk-circle"></div>
- *      <div class="sk-circle8 sk-circle"></div>
- *      <div class="sk-circle9 sk-circle"></div>
- *      <div class="sk-circle10 sk-circle"></div>
- *      <div class="sk-circle11 sk-circle"></div>
- *      <div class="sk-circle12 sk-circle"></div>
- *    </div>
- *
- */
-.sk-spinner-circle.sk-spinner {
-  margin: @spin-margin;
-  width: 22px;
-  height: 22px;
-  position: relative;
-}
-
-.sk-spinner-circle .sk-circle {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  left: 0;
-  top: 0;
-}
-
-.sk-spinner-circle .sk-circle:before {
-  content: '';
-  display: block;
-  margin: @spin-margin;
-  width: 20%;
-  height: 20%;
-  background-color: @spin-color;
-  border-radius: 100%;
-  -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out;
-  animation: sk-circleBounceDelay 1.2s infinite ease-in-out;
-  /* Prevent first frame from flickering when animation starts */
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-}
-
-.sk-spinner-circle .sk-circle2 {
-  -webkit-transform: rotate(30deg);
-  -ms-transform: rotate(30deg);
-  transform: rotate(30deg);
-}
-
-.sk-spinner-circle .sk-circle3 {
-  -webkit-transform: rotate(60deg);
-  -ms-transform: rotate(60deg);
-  transform: rotate(60deg);
-}
-
-.sk-spinner-circle .sk-circle4 {
-  -webkit-transform: rotate(90deg);
-  -ms-transform: rotate(90deg);
-  transform: rotate(90deg);
-}
-
-.sk-spinner-circle .sk-circle5 {
-  -webkit-transform: rotate(120deg);
-  -ms-transform: rotate(120deg);
-  transform: rotate(120deg);
-}
-
-.sk-spinner-circle .sk-circle6 {
-  -webkit-transform: rotate(150deg);
-  -ms-transform: rotate(150deg);
-  transform: rotate(150deg);
-}
-
-.sk-spinner-circle .sk-circle7 {
-  -webkit-transform: rotate(180deg);
-  -ms-transform: rotate(180deg);
-  transform: rotate(180deg);
-}
-
-.sk-spinner-circle .sk-circle8 {
-  -webkit-transform: rotate(210deg);
-  -ms-transform: rotate(210deg);
-  transform: rotate(210deg);
-}
-
-.sk-spinner-circle .sk-circle9 {
-  -webkit-transform: rotate(240deg);
-  -ms-transform: rotate(240deg);
-  transform: rotate(240deg);
-}
-
-.sk-spinner-circle .sk-circle10 {
-  -webkit-transform: rotate(270deg);
-  -ms-transform: rotate(270deg);
-  transform: rotate(270deg);
-}
-
-.sk-spinner-circle .sk-circle11 {
-  -webkit-transform: rotate(300deg);
-  -ms-transform: rotate(300deg);
-  transform: rotate(300deg);
-}
-
-.sk-spinner-circle .sk-circle12 {
-  -webkit-transform: rotate(330deg);
-  -ms-transform: rotate(330deg);
-  transform: rotate(330deg);
-}
-
-.sk-spinner-circle .sk-circle2:before {
-  -webkit-animation-delay: -1.1s;
-  animation-delay: -1.1s;
-}
-
-.sk-spinner-circle .sk-circle3:before {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-.sk-spinner-circle .sk-circle4:before {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
-
-.sk-spinner-circle .sk-circle5:before {
-  -webkit-animation-delay: -0.8s;
-  animation-delay: -0.8s;
-}
-
-.sk-spinner-circle .sk-circle6:before {
-  -webkit-animation-delay: -0.7s;
-  animation-delay: -0.7s;
-}
-
-.sk-spinner-circle .sk-circle7:before {
-  -webkit-animation-delay: -0.6s;
-  animation-delay: -0.6s;
-}
-
-.sk-spinner-circle .sk-circle8:before {
-  -webkit-animation-delay: -0.5s;
-  animation-delay: -0.5s;
-}
-
-.sk-spinner-circle .sk-circle9:before {
-  -webkit-animation-delay: -0.4s;
-  animation-delay: -0.4s;
-}
-
-.sk-spinner-circle .sk-circle10:before {
-  -webkit-animation-delay: -0.3s;
-  animation-delay: -0.3s;
-}
-
-.sk-spinner-circle .sk-circle11:before {
-  -webkit-animation-delay: -0.2s;
-  animation-delay: -0.2s;
-}
-
-.sk-spinner-circle .sk-circle12:before {
-  -webkit-animation-delay: -0.1s;
-  animation-delay: -0.1s;
-}
-
-@-webkit-keyframes sk-circleBounceDelay {
-  0%, 80%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  40% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-@keyframes sk-circleBounceDelay {
-  0%, 80%, 100% {
-    -webkit-transform: scale(0);
-    transform: scale(0);
-  }
-
-  40% {
-    -webkit-transform: scale(1);
-    transform: scale(1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-cube-grid">
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *      <div class="sk-cube"></div>
- *    </div>
- *
- */
-.sk-spinner-cube-grid {
-  /*
-   * Spinner positions
-   * 1 2 3
-   * 4 5 6
-   * 7 8 9
-   */
-}
-
-.sk-spinner-cube-grid.sk-spinner {
-  width: 30px;
-  height: 30px;
-  margin: @spin-margin;
-}
-
-.sk-spinner-cube-grid .sk-cube {
-  width: 33%;
-  height: 33%;
-  background-color: @spin-color;
-  float: left;
-  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
-  animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(1) {
-  -webkit-animation-delay: 0.2s;
-  animation-delay: 0.2s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(2) {
-  -webkit-animation-delay: 0.3s;
-  animation-delay: 0.3s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(3) {
-  -webkit-animation-delay: 0.4s;
-  animation-delay: 0.4s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(4) {
-  -webkit-animation-delay: 0.1s;
-  animation-delay: 0.1s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(5) {
-  -webkit-animation-delay: 0.2s;
-  animation-delay: 0.2s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(6) {
-  -webkit-animation-delay: 0.3s;
-  animation-delay: 0.3s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(7) {
-  -webkit-animation-delay: 0s;
-  animation-delay: 0s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(8) {
-  -webkit-animation-delay: 0.1s;
-  animation-delay: 0.1s;
-}
-
-.sk-spinner-cube-grid .sk-cube:nth-child(9) {
-  -webkit-animation-delay: 0.2s;
-  animation-delay: 0.2s;
-}
-
-@-webkit-keyframes sk-cubeGridScaleDelay {
-  0%, 70%, 100% {
-    -webkit-transform: scale3D(1, 1, 1);
-    transform: scale3D(1, 1, 1);
-  }
-
-  35% {
-    -webkit-transform: scale3D(0, 0, 1);
-    transform: scale3D(0, 0, 1);
-  }
-}
-
-@keyframes sk-cubeGridScaleDelay {
-  0%, 70%, 100% {
-    -webkit-transform: scale3D(1, 1, 1);
-    transform: scale3D(1, 1, 1);
-  }
-
-  35% {
-    -webkit-transform: scale3D(0, 0, 1);
-    transform: scale3D(0, 0, 1);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-wordpress">
- *      <span class="sk-inner-circle"></span>
- *    </div>
- *
- */
-.sk-spinner-wordpress.sk-spinner {
-  background-color: @spin-color;
-  width: 30px;
-  height: 30px;
-  border-radius: 30px;
-  position: relative;
-  margin: @spin-margin;
-  -webkit-animation: sk-innerCircle 1s linear infinite;
-  animation: sk-innerCircle 1s linear infinite;
-}
-
-.sk-spinner-wordpress .sk-inner-circle {
-  display: block;
-  background-color: #fff;
-  width: 8px;
-  height: 8px;
-  position: absolute;
-  border-radius: 8px;
-  top: 5px;
-  left: 5px;
-}
-
-@-webkit-keyframes sk-innerCircle {
-  0% {
-    -webkit-transform: rotate(0);
-    transform: rotate(0);
-  }
-
-  100% {
-    -webkit-transform: rotate(360deg);
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes sk-innerCircle {
-  0% {
-    -webkit-transform: rotate(0);
-    transform: rotate(0);
-  }
-
-  100% {
-    -webkit-transform: rotate(360deg);
-    transform: rotate(360deg);
-  }
-}
-
-/*
- *  Usage:
- *
- *    <div class="sk-spinner sk-spinner-fading-circle">
- *      <div class="sk-circle1 sk-circle"></div>
- *      <div class="sk-circle2 sk-circle"></div>
- *      <div class="sk-circle3 sk-circle"></div>
- *      <div class="sk-circle4 sk-circle"></div>
- *      <div class="sk-circle5 sk-circle"></div>
- *      <div class="sk-circle6 sk-circle"></div>
- *      <div class="sk-circle7 sk-circle"></div>
- *      <div class="sk-circle8 sk-circle"></div>
- *      <div class="sk-circle9 sk-circle"></div>
- *      <div class="sk-circle10 sk-circle"></div>
- *      <div class="sk-circle11 sk-circle"></div>
- *      <div class="sk-circle12 sk-circle"></div>
- *    </div>
- *
- */
-.sk-spinner-fading-circle.sk-spinner {
-  margin: @spin-margin;
-  width: 22px;
-  height: 22px;
-  position: relative;
-}
-
-.sk-spinner-fading-circle .sk-circle {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  left: 0;
-  top: 0;
-}
-
-.sk-spinner-fading-circle .sk-circle:before {
-  content: '';
-  display: block;
-  margin: @spin-margin;
-  width: 18%;
-  height: 18%;
-  background-color: @spin-color;
-  border-radius: 100%;
-  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out;
-  animation: sk-circleFadeDelay 1.2s infinite ease-in-out;
-  /* Prevent first frame from flickering when animation starts */
-  -webkit-animation-fill-mode: both;
-  animation-fill-mode: both;
-}
-
-.sk-spinner-fading-circle .sk-circle2 {
-  -webkit-transform: rotate(30deg);
-  -ms-transform: rotate(30deg);
-  transform: rotate(30deg);
-}
-
-.sk-spinner-fading-circle .sk-circle3 {
-  -webkit-transform: rotate(60deg);
-  -ms-transform: rotate(60deg);
-  transform: rotate(60deg);
-}
-
-.sk-spinner-fading-circle .sk-circle4 {
-  -webkit-transform: rotate(90deg);
-  -ms-transform: rotate(90deg);
-  transform: rotate(90deg);
-}
-
-.sk-spinner-fading-circle .sk-circle5 {
-  -webkit-transform: rotate(120deg);
-  -ms-transform: rotate(120deg);
-  transform: rotate(120deg);
-}
-
-.sk-spinner-fading-circle .sk-circle6 {
-  -webkit-transform: rotate(150deg);
-  -ms-transform: rotate(150deg);
-  transform: rotate(150deg);
-}
-
-.sk-spinner-fading-circle .sk-circle7 {
-  -webkit-transform: rotate(180deg);
-  -ms-transform: rotate(180deg);
-  transform: rotate(180deg);
-}
-
-.sk-spinner-fading-circle .sk-circle8 {
-  -webkit-transform: rotate(210deg);
-  -ms-transform: rotate(210deg);
-  transform: rotate(210deg);
-}
-
-.sk-spinner-fading-circle .sk-circle9 {
-  -webkit-transform: rotate(240deg);
-  -ms-transform: rotate(240deg);
-  transform: rotate(240deg);
-}
-
-.sk-spinner-fading-circle .sk-circle10 {
-  -webkit-transform: rotate(270deg);
-  -ms-transform: rotate(270deg);
-  transform: rotate(270deg);
-}
-
-.sk-spinner-fading-circle .sk-circle11 {
-  -webkit-transform: rotate(300deg);
-  -ms-transform: rotate(300deg);
-  transform: rotate(300deg);
-}
-
-.sk-spinner-fading-circle .sk-circle12 {
-  -webkit-transform: rotate(330deg);
-  -ms-transform: rotate(330deg);
-  transform: rotate(330deg);
-}
-
-.sk-spinner-fading-circle .sk-circle2:before {
-  -webkit-animation-delay: -1.1s;
-  animation-delay: -1.1s;
-}
-
-.sk-spinner-fading-circle .sk-circle3:before {
-  -webkit-animation-delay: -1s;
-  animation-delay: -1s;
-}
-
-.sk-spinner-fading-circle .sk-circle4:before {
-  -webkit-animation-delay: -0.9s;
-  animation-delay: -0.9s;
-}
-
-.sk-spinner-fading-circle .sk-circle5:before {
-  -webkit-animation-delay: -0.8s;
-  animation-delay: -0.8s;
-}
-
-.sk-spinner-fading-circle .sk-circle6:before {
-  -webkit-animation-delay: -0.7s;
-  animation-delay: -0.7s;
-}
-
-.sk-spinner-fading-circle .sk-circle7:before {
-  -webkit-animation-delay: -0.6s;
-  animation-delay: -0.6s;
-}
-
-.sk-spinner-fading-circle .sk-circle8:before {
-  -webkit-animation-delay: -0.5s;
-  animation-delay: -0.5s;
-}
-
-.sk-spinner-fading-circle .sk-circle9:before {
-  -webkit-animation-delay: -0.4s;
-  animation-delay: -0.4s;
-}
-
-.sk-spinner-fading-circle .sk-circle10:before {
-  -webkit-animation-delay: -0.3s;
-  animation-delay: -0.3s;
-}
-
-.sk-spinner-fading-circle .sk-circle11:before {
-  -webkit-animation-delay: -0.2s;
-  animation-delay: -0.2s;
-}
-
-.sk-spinner-fading-circle .sk-circle12:before {
-  -webkit-animation-delay: -0.1s;
-  animation-delay: -0.1s;
-}
-
-@-webkit-keyframes sk-circleFadeDelay {
-  0%, 39%, 100% {
-    opacity: 0;
-  }
-
-  40% {
-    opacity: 1;
-  }
-}
-
-@keyframes sk-circleFadeDelay {
-  0%, 39%, 100% {
-    opacity: 0;
-  }
-
-  40% {
-    opacity: 1;
-  }
-}
-

src/assets/css/inspinia/style.less

@@ -1,31 +0,0 @@
-/*
- *
- *   INSPINIA - Responsive Admin Theme
- *   version 2.6.2
- *
-*/
-// Variables, Mixins
-@import "variables.less";
-@import "mixins.less";
-// INSPINIA Theme Elements
-@import "typography.less";
-@import "buttons.less";
-@import "badgets_labels.less";
-@import "elements.less";
-@import "sidebar.less";
-@import "base.less";
-@import "pages.less";
-@import "chat.less";
-@import "spinners.less";
-
-
-
-
-
-
-
-
-
-
-
-

src/assets/css/inspinia/typography.less

@@ -1,32 +0,0 @@
-h1, h2, h3, h4, h5, h6 {
-  font-weight: 100;
-}
-
-h1 {
-  font-size: 30px;
-}
-
-h2 {
-  font-size: 24px;
-}
-
-h3 {
-  font-size: 16px;
-}
-
-h4 {
-  font-size: 14px;
-}
-
-h5 {
-  font-size: 12px;
-}
-
-h6 {
-  font-size: 10px;
-}
-
-h3, h4, h5 {
-  margin-top: 5px;
-  font-weight: 600;
-}

src/assets/css/inspinia/variables.less

@@ -1,76 +0,0 @@
-@import "../bootstrap/variables.less";
-//Bootstrap Theme.
-//@brand-primary:         darken(#428bca, 6.5%); // #337ab7
-//@brand-success:         #5cb85c;
-//@brand-info:            #5bc0de;
-//@brand-warning:         #f0ad4e;
-//@brand-danger:          #d9534f;
-//@brand-gray: #c2c2c2;
-
-//Angulr Theme.
-//@brand-primary:         #7266ba;
-//@brand-info:            #23b7e5;
-//@brand-success:         #27c24c;
-//@brand-warning:         #fad733;
-//@brand-danger:          #f05050;
-//@brand-light:           #edf1f2;
-//@brand-dark:            #3a3f51;
-//@brand-black:           #1c2b36;
-//@brand-gray:            #c2c2c2;
-//@brand-laxative:        #B3EE3A;
-
-//Inspina Theme.
-//@brand-primary: #1ab394;
-//@brand-success: #1c84c6;
-//@brand-info: #23c6c8;
-//@brand-warning: #f8ac59;
-//@brand-danger: #ED5565;
-//@brand-gray: #c2c2c2;
-//@brand-laxative: #B3EE3A;
-
-
-
-
-@navy: @brand-primary; // Primary color
-@dark-gray: @brand-gray; // Default color
-@blue: @brand-success; // Success color
-@lazur: @brand-info; // Info color
-@yellow: @brand-warning; // Warrning color
-@red: @brand-danger; // Danger color
-@green: @brand-laxative; // Danger color
-
-@gray-base: #000;
-@gray-darker: lighten(@gray-base, 13.5%); // #222
-@gray-dark: lighten(@gray-base, 20%); // #333
-@gray: lighten(@gray-base, 33.5%); // #555
-@gray-light: lighten(@gray-base, 46.7%); // #777
-@gray-lighter: lighten(@gray-base, 93.5%); // #eee
-
-// Various colors
-@text-color: #676a6c; // Body text
-@gray: #f3f3f4; // Background wrapper color
-@light-gray: #D1DADE; // Default label, badget
-@label-badget-color: #5E5E5E;
-@light-blue: #f3f6fb;
-
-// Spiner color and margin
-@spin-color: @navy;
-@spin-margin: 0 auto;
-
-// IBOX colors ( default panel colors)
-@border-color: #e7eaec; // IBox border
-@ibox-title-bg: #ffffff; // IBox Background header
-@ibox-content-bg: #ffffff; // IBox Background content
-
-//Sidebar width
-@sidebar-width: 170px;
-
-// Boxed layout width
-@boxed-width: 1200px;
-
-//Border radius for buttons
-@btn-border-radius: 3px;
-
-//Navigation
-@nav-bg: #2F4050;
-@nav-text-color: #a7b1c2;

src/assets/css/mixin/bootstrap-variables.less

@@ -1 +0,0 @@
-@import "~bootstrap/less/variables.less";

src/assets/image/empty.svg

@@ -0,0 +1,20 @@
+<?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="1582644951614" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3842"
+     width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M692.906667 385.024c-11.605333-2.730667-23.210667-6.144-34.816-11.605333l-63.488 25.258666-5.461334 2.048h-5.461333c-8.874667 0-17.749333-4.096-23.210667-11.605333-5.461333-7.509333-6.826667-17.066667-4.778666-25.258667l8.874666-30.72-97.621333-19.797333v400.725333L901.12 402.090667l-105.130667-21.162667c-18.432 5.461333-38.229333 8.874667-59.392 8.874667-13.653333 0-28.672-1.365333-43.690666-4.778667z"
+          fill="#A6DAFC" p-id="3843"></path>
+    <path d="M512 502.442667v467.626666l389.802667-100.352V402.090667zM111.274667 413.696l356.352-100.352V580.266667z"
+          fill="#568EC8" p-id="3844"></path>
+    <path d="M111.274667 413.696v456.021333L512 970.069333V502.442667z" fill="#A6DAFC" p-id="3845"></path>
+    <path d="M512 502.442667l389.802667-100.352L1024 546.816 645.802667 658.090667z" fill="#78C5FD" p-id="3846"></path>
+    <path d="M111.274667 413.696l400.725333 88.746667-122.197333 167.253333L0 569.344z" fill="#CFF0FF"
+          p-id="3847"></path>
+    <path d="M886.784 160.426667c-2.730667-6.826667-6.144-13.653333-9.557333-20.48-1.365333-2.048-2.730667-4.096-4.096-6.826667-4.096-6.144-8.192-12.970667-13.653334-18.432s-10.24-11.605333-16.384-16.384c-2.048-2.048-4.096-3.413333-6.144-4.778667-8.192-6.826667-17.066667-12.288-25.941333-17.749333-2.048-1.365333-4.778667-2.730667-6.826667-3.413333-4.778667-2.048-9.557333-4.778667-15.018666-6.144-7.509333-2.730667-15.701333-5.461333-23.893334-6.826667-2.730667-0.682667-6.144-1.365333-8.874666-2.048-0.682667 0-2.048 0-2.730667-0.682667-2.048 0-4.096-0.682667-6.144-0.682666-1.365333 0-2.048 0-3.413333-0.682667-2.048 0-3.413333 0-5.461334-0.682667H727.04c-4.096 0-8.192 0-11.605333 0.682667h-2.048c-4.096 0.682667-8.192 0.682667-12.288 1.365333h-0.682667c-4.096 0.682667-7.509333 1.365333-11.605333 2.048-0.682667 0-1.365333 0-1.365334 0.682667-4.096 0.682667-7.509333 2.048-10.922666 3.413333-0.682667 0-1.365333 0.682667-2.048 0.682667-3.413333 1.365333-7.509333 2.730667-10.922667 4.096-0.682667 0-0.682667 0.682667-1.365333 0.682667-3.413333 1.365333-6.826667 3.413333-10.24 4.778666 0 0-0.682667 0-0.682667 0.682667-3.413333 2.048-6.826667 3.413333-10.24 5.461333-0.682667 0.682667-1.365333 0.682667-2.048 1.365334-3.413333 2.048-6.144 4.096-9.557333 6.144-0.682667 0.682667-1.365333 0.682667-1.365334 1.365333-3.413333 2.048-6.144 4.778667-8.874666 7.509333l-8.192 8.192-1.365334 1.365334c-2.730667 2.730667-4.778667 5.461333-7.509333 8.192-0.682667 0.682667-0.682667 1.365333-1.365333 1.365333-2.048 2.730667-4.778667 6.144-6.826667 8.874667 0 0.682667-0.682667 0.682667-0.682667 1.365333-2.048 3.413333-4.096 6.144-5.461333 9.557333 0 0.682667-0.682667 0.682667-0.682667 1.365334-2.048 3.413333-3.413333 6.826667-4.778666 10.24 0 0.682667-0.682667 1.365333-0.682667 2.048-1.365333 3.413333-2.730667 6.826667-4.096 10.922666 0 0.682667-0.682667 1.365333-0.682667 2.048-1.365333 4.096-2.048 7.509333-3.413333 11.605334-10.24 46.421333 2.730667 92.16 32.085333 127.658666L593.92 339.968l-9.557333 32.768v0.682667h0.682666l58.709334-23.210667 16.384-6.826667c6.144 3.413333 12.970667 6.144 19.797333 8.192s13.653333 4.778667 21.162667 6.144c2.730667 0.682667 6.144 1.365333 8.874666 2.048 0.682667 0 2.048 0 2.730667 0.682667 2.048 0 4.096 0.682667 6.144 0.682667 1.365333 0 2.048 0 3.413333 0.682666 2.048 0 3.413333 0 5.461334 0.682667H739.328c4.096 0 8.192 0 11.605333-0.682667h2.048c4.096-0.682667 8.192-0.682667 12.288-1.365333h0.682667c4.096-0.682667 7.509333-1.365333 11.605333-2.048 0.682667 0 1.365333 0 2.048-0.682667 4.096-0.682667 7.509333-2.048 10.922667-3.413333 0.682667 0 1.365333-0.682667 2.048-0.682667 3.413333-1.365333 7.509333-2.730667 10.922667-4.096 0.682667 0 0.682667-0.682667 1.365333-0.682666 3.413333-1.365333 6.826667-3.413333 10.24-4.778667 0 0 0.682667 0 0.682667-0.682667 3.413333-2.048 6.826667-3.413333 10.24-5.461333 0.682667-0.682667 1.365333-0.682667 2.048-1.365333 3.413333-2.048 6.144-4.096 9.557333-6.144 0.682667-0.682667 1.365333-0.682667 1.365333-1.365334 3.413333-2.048 6.144-4.778667 8.874667-7.509333l8.192-8.192 1.365333-1.365333c2.730667-2.730667 4.778667-5.461333 7.509334-8.192 0.682667-0.682667 0.682667-1.365333 1.365333-2.048 2.048-2.730667 4.778667-6.144 6.826667-8.874667 0-0.682667 0.682667-0.682667 0.682666-1.365333 2.048-3.413333 4.096-6.144 5.461334-9.557334 0-0.682667 0.682667-0.682667 0.682666-1.365333 2.048-3.413333 3.413333-6.826667 4.778667-10.24 0-0.682667 0.682667-1.365333 0.682667-2.048 1.365333-3.413333 2.730667-6.826667 4.096-10.922667 0-0.682667 0.682667-1.365333 0.682666-2.048 1.365333-4.096 2.048-7.509333 3.413334-11.605333 5.461333-28.672 2.730667-57.344-6.826667-83.285333z"
+          fill="#F9DA3E" p-id="3848"></path>
+    <path d="M739.328 167.936h48.469333v27.989333h-13.653333v-15.701333h-83.968v15.701333h-13.653333v-27.989333h48.469333c-1.365333-3.413333-3.413333-6.826667-4.778667-10.24l14.336-2.048c2.048 3.413333 3.413333 7.509333 4.778667 12.288z m37.546667 52.565333v12.288h-37.546667v25.258667h48.469333v12.970667H677.205333v-12.970667h48.469334v-25.258667h-37.546667v-12.288h88.746667z m-51.882667-24.576c-10.24 8.874667-22.528 16.384-37.546667 22.528l-5.461333-12.288c14.336-5.461333 25.941333-11.605333 34.816-19.797333l8.192 9.557333z m56.661333 10.922667l-7.509333 11.605333c-11.605333-9.557333-23.210667-17.066667-35.498667-22.528l6.826667-10.24c13.653333 6.144 25.258667 12.970667 36.181333 21.162667z"
+          fill="#FFFFFF" p-id="3849"></path>
+</svg>

src/assets/image/file/alien.svg

@@ -0,0 +1,10 @@
+<?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="1514189634329" class="icon" style="" viewBox="0 0 1219 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="10648" width="238.0859375" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M1197.787429 327.192381a19.504762 19.504762 0 0 1 19.553523 19.407238v614.156191c0 34.913524-28.574476 63.24419-63.878095 63.24419H63.878095C28.623238 1024 0 995.718095 0 960.75581V346.599619a19.504762 19.504762 0 0 1 19.602286-19.358476h1178.185143z m-66.80381-213.089524C1179.550476 114.102857 1219.047619 153.209905 1219.047619 201.386667v80.213333H1.657905V88.259048C1.657905 39.497143 41.593905 0 90.794667 0h290.864762c17.408 0 33.987048 7.655619 45.104761 20.967619l78.214096 93.135238h626.005333z"
+          fill="#1ab394" p-id="10649"></path>
+</svg>

src/assets/image/file/archive.svg

@@ -0,0 +1,14 @@
+<?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="1514189353878" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="1197" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M9.367 0h992.97v341.333H9.366z" fill="#55C7F7" p-id="1198"></path>
+    <path d="M9.367 341.333h992.97v341.334H9.366z" fill="#F95F5D" p-id="1199"></path>
+    <path d="M9.367 682.667h992.97V1024H9.366z" fill="#7ECF3B" p-id="1200"></path>
+    <path d="M350.7 0h310.303v1024H350.7z" fill="#FDAF42" p-id="1201"></path>
+    <path d="M304.154 386.638V646.05h403.394V386.638H304.154z m356.849 215.97H350.7V429.46h310.303v173.15z"
+          fill="#FFFFFF" p-id="1202"></path>
+</svg>

src/assets/image/file/audio.svg

@@ -0,0 +1,14 @@
+<?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="1543321997742" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="3887" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M160 32c-12 0-24.8 4.8-33.6 14.4S112 68 112 80v864c0 12 4.8 24.8 14.4 33.6C136 987.2 148 992 160 992h704c12 0 24.8-4.8 33.6-14.4C907.2 968 912 956 912 944V304L640 32H160z"
+          fill="#FF5562" p-id="3888"></path>
+    <path d="M912 304H688c-12 0-24.8-4.8-33.6-14.4-9.6-8.8-14.4-21.6-14.4-33.6V32l272 272z" fill="#FFBBC0"
+          p-id="3889"></path>
+    <path d="M669.6 491.2c0-1.6 0.8-4 0-6.4V369.6c0-4.8-2.4-8.8-5.6-12-4-3.2-8-4-12.8-3.2l-250.4 70.4c-7.2 1.6-12 7.2-12 14.4v275.2c-9.6-4-20.8-6.4-32.8-6.4-8.8 0-17.6 0.8-26.4 3.2-40.8 11.2-66.4 43.2-58.4 72.8 6.4 23.2 30.4 37.6 60.8 37.6 8.8 0 17.6-1.6 26.4-3.2 36.8-10.4 60.8-36.8 60-63.2 0.8-1.6 0.8-3.2 0.8-5.6V570.4l220-61.6v136c-9.6-4-20.8-6.4-32.8-6.4-8.8 0-17.6 0.8-26.4 3.2-40.8 11.2-66.4 43.2-58.4 72.8C528 737.6 552 752 582.4 752c8.8 0 17.6-0.8 26.4-3.2 36-9.6 60-36 60-62.4 0.8-1.6 0.8-3.2 0.8-5.6V491.2z m-250.4 48v-53.6l220-61.6v53.6l-220 61.6z"
+          fill="#FFFFFF" p-id="3890"></path>
+</svg>

src/assets/image/file/doc.svg

@@ -0,0 +1,12 @@
+<?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="1543300132402" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="2107" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M533.947184 38.36489h65.880106v88.119185c117.859409 0.660894 235.60867-1.211639 353.35793 0.660894 25.102953-2.533427 44.81962 16.962943 42.506492 42.07691 1.872533 216.993492-0.440596 434.097133 1.112505 651.090626-1.112505 22.250094 2.191965 46.923466-10.695466 66.640133-16.081751 11.455494-36.899909 10.023557-55.625236 10.904749-110.25913-0.550745-220.408111-0.330447-330.656225-0.330447v88.119185h-68.843113c-167.657764-30.621417-335.745108-58.709407-503.722304-88.119185-0.110149-256.977572 0-513.955144 0-770.822567 168.858388-29.519927 337.826924-58.268811 506.685311-88.339483z"
+          fill="#2A5699" p-id="2108"></path>
+    <path d="M599.816275 159.528769h363.491637v704.953477h-363.491637v-88.119185h286.38735v-44.059592h-286.38735v-55.07449h286.38735v-44.059593h-286.38735v-55.07449h286.38735v-44.059592h-286.38735v-55.074491h286.38735v-44.059592h-286.38735v-55.074491h286.38735v-44.059592h-286.38735v-55.07449h286.38735v-44.059593h-286.38735v-77.104286zM254.829667 354.162018c20.928306-1.211639 41.856613-2.092831 62.784919-3.19432 14.649814 74.350562 29.619061 148.590975 45.491529 222.61109 12.446835-76.443393 26.215457-152.666487 39.543484-228.999731 22.029796-0.771043 44.059592-1.982682 65.97924-3.30447-24.89367 106.734362-46.703168 214.349917-73.909966 320.423385-18.39488 9.582961-45.932125-0.440596-67.741623 1.10149-14.649814-72.90761-31.722906-145.38564-44.819621-218.645727-12.898446 71.156242-29.641091 141.651589-44.390039 212.367235a4187.754101 4187.754101 0 0 1-63.666111-3.866229c-18.284731-96.931103-39.763782-193.190297-56.836874-290.341698 18.835476-0.881192 37.792115-1.652235 56.627591-2.313129 11.33433 70.164901 24.221761 139.999355 34.146184 210.274404 15.508976-72.037433 31.37043-144.074867 46.791287-216.1123z"
+          fill="#FFFFFF" p-id="2109"></path>
+</svg>

src/assets/image/file/file.svg

@@ -0,0 +1,19 @@
+<?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="1514189511483" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="6709" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M676.297143 0H145.609143C130.834286 0 118.857143 11.977143 118.857143 35.218286V1005.714286c0 6.308571 11.977143 18.285714 26.752 18.285714h732.781714c14.774857 0 26.752-11.977143 26.752-18.285714V237.312c0-12.726857-1.700571-16.822857-4.699428-19.84L687.670857 4.699429A16.164571 16.164571 0 0 0 676.297143 0z"
+          fill="#E9E9E0" p-id="6710"></path>
+    <path d="M685.714286 2.761143V219.428571h216.667428z" fill="#D9D7CA" p-id="6711"></path>
+    <path d="M878.390857 1024H145.609143A26.752 26.752 0 0 1 118.857143 997.248V713.142857h786.285714v284.105143c0 14.774857-11.977143 26.752-26.752 26.752z"
+          fill="#C8BDB8" p-id="6712"></path>
+    <path d="M338.285714 859.428571m-54.857143 0a54.857143 54.857143 0 1 0 109.714286 0 54.857143 54.857143 0 1 0-109.714286 0Z"
+          fill="#FFFFFF" p-id="6713"></path>
+    <path d="M521.142857 859.428571m-54.857143 0a54.857143 54.857143 0 1 0 109.714286 0 54.857143 54.857143 0 1 0-109.714286 0Z"
+          fill="#FFFFFF" p-id="6714"></path>
+    <path d="M704 859.428571m-54.857143 0a54.857143 54.857143 0 1 0 109.714286 0 54.857143 54.857143 0 1 0-109.714286 0Z"
+          fill="#FFFFFF" p-id="6715"></path>
+</svg>

src/assets/image/file/folder.svg

@@ -0,0 +1,10 @@
+<?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="1514189634329" class="icon" style="" viewBox="0 0 1219 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="10648" width="238.0859375" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M1197.787429 327.192381a19.504762 19.504762 0 0 1 19.553523 19.407238v614.156191c0 34.913524-28.574476 63.24419-63.878095 63.24419H63.878095C28.623238 1024 0 995.718095 0 960.75581V346.599619a19.504762 19.504762 0 0 1 19.602286-19.358476h1178.185143z m-66.80381-213.089524C1179.550476 114.102857 1219.047619 153.209905 1219.047619 201.386667v80.213333H1.657905V88.259048C1.657905 39.497143 41.593905 0 90.794667 0h290.864762c17.408 0 33.987048 7.655619 45.104761 20.967619l78.214096 93.135238h626.005333z"
+          fill="#23B7E5" p-id="10649"></path>
+</svg>

src/assets/image/file/image.svg

@@ -0,0 +1,16 @@
+<?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="1514190539077" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="14917" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M128 0h597.3l227.6 227.9v739.2c0 31.4-25.5 56.9-56.9 56.9H128c-31.4 0-56.9-25.5-56.9-56.9V56.9C71.1 25.5 96.6 0 128 0z"
+          fill="#13BE93" p-id="14918"></path>
+    <path d="M630.5 1024H128c-25.7 0-47.4-17-54.4-40.4l218.1-218.1c22.2-22.2 58.2-22.2 80.5 0L630.5 1024z"
+          fill="#6BD8BD" p-id="14919"></path>
+    <path d="M952.9 858v109.1c0 31.4-25.5 56.9-56.9 56.9H322.4l-4.7-4.7 358-358c22.2-22.2 58.2-22.2 80.5 0L952.9 858z"
+          fill="#9CF9E2" p-id="14920"></path>
+    <path d="M725.3 0l227.6 227.6H782.2c-31.4 0-56.9-25.5-56.9-56.9V0z" fill="#69DCC0" p-id="14921"></path>
+    <path d="M327.1 483.6m-85.3 0a85.3 85.3 0 1 0 170.6 0 85.3 85.3 0 1 0-170.6 0Z" fill="#E9FFFA" p-id="14922"></path>
+</svg>

src/assets/image/file/pdf.svg

@@ -0,0 +1,13 @@
+<?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="1514284130163" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="1551" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M915.114667 1024H108.885333V0h587.776v218.112H914.773333V1024z m-785.066667-20.821333h763.904V238.933333H675.84V20.821333H129.706667v982.357334z"
+          fill="#F90E09" p-id="1552"></path>
+    <path d="M708.266667 10.581333L904.533333 206.848h-196.266666z" fill="#F90E09" p-id="1553"></path>
+    <path d="M282.965333 792.576c33.450667-23.210667 55.637333-57.344 76.8-91.136-30.378667 25.941333-59.050667 54.954667-76.8 91.136z m396.629334-169.642667c31.402667 15.018667 65.877333 31.061333 101.376 21.504-24.576-29.696-67.584-21.504-101.376-21.504z m-246.101334 23.210667c45.397333-16.725333 91.818667-29.696 138.922667-39.594667-30.378667-26.965333-55.978667-58.368-76.458667-93.525333-16.725333 46.08-38.912 90.112-62.464 133.12z m67.925334-243.370667c14.677333-37.546667 19.114667-83.285333-5.802667-117.418666-7.168 38.912-4.096 79.189333 5.802667 117.418666z m-45.397334-105.130666c4.096-24.917333 35.84-29.696 55.637334-22.186667 12.288 7.850667 18.432 22.869333 18.773333 37.205333 1.365333 44.032-6.485333 87.381333-12.629333 130.730667-3.413333 20.138667 8.874667 38.229333 17.749333 55.296 21.845333 40.277333 52.224 76.458667 92.16 99.669333 48.128-5.802667 98.645333-12.970667 145.749333 2.389334 35.157333 11.946667 26.965333 77.141333-11.264 77.824-53.589333 2.730667-102.058667-23.893333-150.186666-43.349334-66.218667 4.778667-130.730667 24.917333-194.218667 44.032-28.672 46.762667-54.613333 98.986667-101.034667 130.730667-23.210667 18.090667-76.458667 3.072-64.512-32.085333 20.138667-49.152 70.314667-76.117333 114.346667-100.693334 12.629333-6.485333 19.797333-18.773333 26.282667-31.061333 30.037333-57.685333 60.074667-115.370667 84.309333-175.786667-12.629333-56.661333-31.061333-114.688-21.162667-172.714666z"
+          fill="#F90E09" p-id="1554"></path>
+</svg>

src/assets/image/file/ppt.svg

@@ -0,0 +1,18 @@
+<?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="1543300178225" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="5733" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M537.372818 38.36489h62.454472v99.134083c117.738246 0.660894 235.60867-1.211639 353.236766 0.550745 25.334266-2.423278 45.172097 17.29339 42.627656 42.627655 1.872533 205.758296-0.440596 411.626741 1.10149 617.506201-1.10149 22.250094 2.20298 46.923466-10.574302 66.640134-16.081751 11.664777-36.999043 10.133706-55.834519 11.014898-110.148981-0.550745-220.297962-0.330447-330.557091-0.330447v110.148981h-68.523681c-167.856032-30.621417-336.06454-58.599258-504.041736-88.119185-0.110149-256.977572 0-513.955144 0-770.822567 169.970892-29.420793 339.93077-59.381316 510.110945-88.350498z"
+          fill="#D24625" p-id="5734"></path>
+    <path d="M599.82729 170.543667h363.491636v671.908783h-363.491636v-88.119185h264.357554v-44.059592h-264.357554v-55.074491h264.357554v-44.059592h-264.247405c-0.110149-21.5892-0.110149-43.1784-0.231313-64.767601 43.630011 13.53731 93.307202 13.217878 132.299941-13.008594 42.18706-25.003819 64.216856-72.698327 67.851772-120.271672-48.366417-0.330447-96.710805-0.220298-144.956059-0.220298-0.121164-47.914807 0.550745-95.829613-0.991341-143.634271-18.075448 3.524767-36.128866 7.269833-54.083149 11.125047v-109.818534z"
+          fill="#FFFFFF" p-id="5735"></path>
+    <path d="M677.041725 246.216017c76.553542 3.524767 140.880546 67.961921 144.956059 144.295165-48.366417 0.550745-96.710805 0.330447-145.066208 0.330447 0-48.245254-0.121164-96.490507 0.110149-144.625612z"
+          fill="#D24625" p-id="5736"></path>
+    <path d="M203.940838 329.378497c59.810897 2.863874 132.288926-23.682031 181.855967 21.148605 47.485226 57.607917 34.917227 163.571236-35.467972 198.047867-25.003819 12.777282-53.642554 11.014898-80.849351 10.133706-0.110149 43.068251-0.220298 86.136503-0.110149 129.19374-21.820513-1.872533-43.74016-3.745065-65.538644-5.507449-0.980326-117.628097-1.211639-235.377357 0.110149-353.016469z"
+          fill="#FFFFFF" p-id="5737"></path>
+    <path d="M269.380347 388.969096c21.699349-0.991341 48.575701-4.956704 63.214501 15.420857 12.567999 21.5892 11.89609 50.007637 1.442951 72.257732-12.567999 22.69069-40.986436 20.48771-62.895068 23.131286-2.313129-36.899909-2.092831-73.799817-1.762384-110.809875z"
+          fill="#D24625" p-id="5738"></path>
+</svg>

src/assets/image/file/psd.svg

@@ -0,0 +1,16 @@
+<?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="1545064197737" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="14227" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M759.725253 0H134.464646v1024h817.131314V191.870707z" fill="#02007A" p-id="14228"></path>
+    <path d="M72.40404 708.525253h687.838384v258.585858H72.40404z" fill="#230091" p-id="14229"></path>
+    <path d="M82.747475 718.868687h667.151515v237.89899H82.747475zM755.070707 5.171717l191.353535 191.353536h-191.353535z"
+          fill="#FFFFFF" p-id="14230"></path>
+    <path d="M506.828283 791.272727v93.090909h25.858586c28.444444 0 41.373737-12.929293 41.373737-45.511111s-12.929293-47.579798-41.373737-47.579798h-25.858586z m-25.858586-25.858586h51.717172c42.408081 0 67.232323 29.99596 67.232323 74.989899S575.612121 910.222222 532.686869 910.222222H480.969697v-144.808081z m-132.39596 104.468687c1.034343 26.375758 22.755556 42.408081 55.337374 42.408081 34.650505 0 55.854545-17.066667 55.854546-43.959596 0-21.20404-12.412121-33.09899-40.856566-39.822222l-16.549495-3.620202c-17.583838-4.137374-24.824242-9.826263-24.824242-19.135354 0-11.894949 10.860606-19.652525 26.892929-19.652525s27.410101 7.757576 28.444444 21.204041h24.307071c-0.517172-24.824242-21.20404-41.890909-52.751515-41.89091S351.676768 782.480808 351.676768 807.822222c0 20.169697 12.412121 33.09899 38.787878 38.787879l18.618182 4.137374c18.10101 4.137374 25.341414 10.343434 25.341414 20.169697 0 11.894949-11.894949 20.169697-28.961616 20.169697s-30.513131-8.791919-32.064646-21.721212l-24.824243 0.517171zM258.585859 788.686869v53.785858h20.686868c18.10101 0 31.030303-9.826263 31.030303-26.892929s-12.412121-26.892929-31.030303-26.892929h-20.686868z m-25.858586-23.272728h56.888889c28.444444 0 46.545455 20.686869 46.545454 49.131314s-17.583838 49.131313-46.545454 49.131313h-31.030303v46.545454h-25.858586v-144.808081z"
+          fill="#230091" p-id="14231"></path>
+    <path d="M415.806061 443.216162h-31.030303v137.567676H321.163636V196.525253h93.090909c91.022222 0 140.670707 35.684848 140.670708 122.052525 0.517172 103.434343-92.573737 124.638384-139.119192 124.638384z m-5.688889-192.905051c-6.206061 0-14.99798 0.517172-26.89293 1.551515V387.878788h36.202021C461.834343 387.878788 491.313131 366.157576 491.313131 312.888889c0-40.856566-32.064646-62.577778-81.195959-62.577778z m258.068687 337.19596c70.852525 0 96.711111-50.165657 96.711111-84.816162 0-54.820202-35.684848-67.749495-66.19798-87.40202-25.858586-17.066667-49.648485-23.272727-49.648485-40.856566 0-22.755556 15.515152-27.410101 36.20202-27.410101 25.858586 0 54.820202 2.068687 67.232323 16.032323V306.682828c-12.929293-10.343434-37.236364-13.446465-68.783838-13.446464-67.749495 0-93.608081 44.993939-93.608081 84.29899 0 50.682828 33.616162 65.680808 66.19798 83.781818 21.20404 11.894949 46.545455 20.686869 46.545455 44.476767 0 13.963636-8.791919 27.927273-37.753536 27.927273-26.892929 0-59.991919-10.343434-74.989899-23.789899v59.991919c13.446465 10.343434 40.339394 17.583838 78.09293 17.583839z"
+          fill="#7AB7FF" p-id="14232"></path>
+</svg>

src/assets/image/file/text.svg

@@ -0,0 +1,10 @@
+<?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="1514189544355" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="8186" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M176 1024l672 0c26.464 0 48-21.536 48-48l0-672c0-0.544-0.256-0.992-0.288-1.504-0.064-0.736-0.256-1.376-0.416-2.08-0.544-2.272-1.472-4.32-2.88-6.112-0.224-0.288-0.192-0.64-0.416-0.928l-256-288c-0.096-0.096-0.224-0.096-0.32-0.192-1.92-2.048-4.352-3.456-7.136-4.288-0.608-0.192-1.152-0.256-1.792-0.352-0.928-0.16-1.792-0.544-2.752-0.544l-448 0c-26.464 0-48 21.536-48 48l0 928c0 26.464 21.536 48 48 48zM640 58.08l204.384 229.92-188.384 0c-7.04 0-16-13.44-16-24l0-205.92zM160 48c0-8.832 7.2-16 16-16l432 0 0 232c0 25.888 20.96 56 48 56l208 0 0 656c0 8.832-7.2 16-16 16l-672 0c-8.96 0-16-7.04-16-16l0-928zM304 448l416 0c8.832 0 16-7.168 16-16s-7.168-16-16-16l-416 0c-8.832 0-16 7.168-16 16s7.168 16 16 16zM304 576l416 0c8.832 0 16-7.168 16-16s-7.168-16-16-16l-416 0c-8.832 0-16 7.168-16 16s7.168 16 16 16zM304 320l192 0c8.832 0 16-7.168 16-16s-7.168-16-16-16l-192 0c-8.832 0-16 7.168-16 16s7.168 16 16 16zM304 704l416 0c8.832 0 16-7.168 16-16s-7.168-16-16-16l-416 0c-8.832 0-16 7.168-16 16s7.168 16 16 16zM304 832l416 0c8.832 0 16-7.168 16-16s-7.168-16-16-16l-416 0c-8.832 0-16 7.168-16 16s7.168 16 16 16z"
+          p-id="8187"></path>
+</svg>

src/assets/image/file/video.svg

@@ -0,0 +1,23 @@
+<?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="1514189554639" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="8871" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M80 34.4h864v960H80z" fill="#8095FF" p-id="8872"></path>
+    <path d="M176 112m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8873"></path>
+    <path d="M176 272m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8874"></path>
+    <path d="M176 432m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8875"></path>
+    <path d="M176 592m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8876"></path>
+    <path d="M176 752m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8877"></path>
+    <path d="M176 912m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8878"></path>
+    <path d="M864 112m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8879"></path>
+    <path d="M864 272m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8880"></path>
+    <path d="M864 432m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8881"></path>
+    <path d="M864 592m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8882"></path>
+    <path d="M864 752m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8883"></path>
+    <path d="M864 912m-40 0a40 40 0 1 0 80 0 40 40 0 1 0-80 0Z" fill="#FFFFFF" p-id="8884"></path>
+    <path d="M648 508L436 362.4c-4.8-3.2-11.2-4-16.8-0.8-5.6 3.2-8.8 8.8-8.8 14.4v290.4c0 5.6 3.2 11.2 8.8 14.4 5.6 3.2 12 2.4 16.8-0.8L648 533.6c4.8-2.4 7.2-8 7.2-12.8 0-4.8-3.2-9.6-7.2-12.8z"
+          fill="#FFFFFF" p-id="8885"></path>
+</svg>

src/assets/image/file/xls.svg

@@ -0,0 +1,17 @@
+<?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="1543300142282" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="2233" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M534.310676 38.36489h65.428495v88.119185c110.25913 0 220.507245 0.220298 330.766374-0.330447 18.615178 0.771043 39.113903-0.550745 55.305803 10.574302 11.345345 16.302049 10.023557 37.010058 10.783586 55.746399-0.550745 191.218631-0.319432 382.327112-0.220298 573.435594-0.550745 32.053353 2.974022 64.767601-3.745066 96.380358-4.405959 22.910988-31.943204 23.461733-50.338084 24.232776-114.114344 0.330447-228.338837-0.220298-342.56333 0v99.134083h-68.402517c-167.867047-30.511268-336.075555-58.709407-504.151885-88.119185v-770.932716c169.0897-29.420793 338.168386-58.389975 507.136922-88.240349z"
+          fill="#207245" p-id="2234"></path>
+    <path d="M599.739171 159.528769h363.491636v693.938579h-363.491636v-66.089389h88.119184v-77.104286h-88.119184v-44.059592h88.119184v-77.104287h-88.119184v-44.059592h88.119184v-77.104287h-88.119184v-44.059592h88.119184v-77.104287h-88.119184v-44.059592h88.119184v-77.104287h-88.119184v-66.089388z"
+          fill="#FFFFFF" p-id="2235"></path>
+    <path d="M731.917948 225.618157h154.208573v77.104287h-154.208573v-77.104287z" fill="#207245" p-id="2236"></path>
+    <path d="M353.44605 328.827752c24.89367-1.762384 49.897488-3.304469 74.901307-4.516108-29.409778 60.251492-58.929705 120.502985-88.879213 180.53418 30.29097 61.683429 61.242833 122.926263 91.632937 184.609692-26.545904-1.553101-52.98166-3.19432-79.527564-5.066854-18.725327-45.932125-41.526166-90.322164-54.964342-138.358134-14.969246 44.731501-36.349164 86.918561-53.521389 130.74684-24.122627-0.330447-48.256268-1.321788-72.367881-2.313129 28.308288-55.404937 55.625235-111.250471 84.814716-166.324961-24.783521-56.726725-52.001334-112.35196-77.544883-168.748238 24.232776-1.431937 48.454537-2.863874 72.698327-4.185662 16.412198 43.068251 34.366482 85.585758 47.925822 129.7555 14.506621-46.802302 36.216985-90.861894 54.832163-136.133126z"
+          fill="#FFFFFF" p-id="2237"></path>
+    <path d="M731.917948 346.782036h154.208573v77.104287h-154.208573v-77.104287zM731.917948 467.945915h154.208573v77.104287h-154.208573v-77.104287zM731.917948 589.109794h154.208573v77.104287h-154.208573v-77.104287zM731.917948 710.273673h154.208573v77.104286h-154.208573v-77.104286z"
+          fill="#207245" p-id="2238"></path>
+</svg>

src/assets/image/success.svg

@@ -0,0 +1,11 @@
+<?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="1544085034574" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+     p-id="1828" width="200" height="200">
+    <defs>
+        <style type="text/css"></style>
+    </defs>
+    <path d="M0 512A512 512 0 1 0 512 0 512 512 0 0 0 0 512" fill="#36D49F" p-id="1829"></path>
+    <path d="M450.37037 552.580741l-115.105185-87.798519-50.820741 39.822222L483.365926 701.62963C517.499259 616.296296 625.777778 449.232593 758.518519 330.714074L746.382222 303.407407a1264.071111 1264.071111 0 0 0-296.011852 249.173334"
+          fill="#FFFFFF" p-id="1830"></path>
+</svg>

src/assets/img/folder.svg

@@ -1 +0,0 @@
-<?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="1510209707527" class="icon" style="" viewBox="0 0 1219 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1016" xmlns:xlink="http://www.w3.org/1999/xlink" width="238.0859375" height="200"><defs><style type="text/css"></style></defs><path d="M1197.787429 327.192381a19.504762 19.504762 0 0 1 19.553523 19.407238v614.156191c0 34.913524-28.574476 63.24419-63.878095 63.24419H63.878095C28.623238 1024 0 995.718095 0 960.75581V346.599619a19.504762 19.504762 0 0 1 19.602286-19.358476h1178.185143z m-66.80381-213.089524C1179.550476 114.102857 1219.047619 153.209905 1219.047619 201.386667v80.213333H1.657905V88.259048C1.657905 39.497143 41.593905 0 90.794667 0h290.864762c17.408 0 33.987048 7.655619 45.104761 20.967619l78.214096 93.135238h626.005333z" fill="#23B7E5" p-id="1017"></path></svg>

src/backyard/Frame.vue

@@ -1,146 +0,0 @@
-<template>
-
-  <div id="body">
-
-    <div>
-      <SideNavigation/>
-      <div id="page-wrapper" :class="{'show-drawer':$store.state.config.showDrawer}" @click="blankClick">
-
-        <div>
-
-          <div class="mb10">
-
-            <router-link to="/" v-if="$store.state.breadcrumbs && $store.state.breadcrumbs.length">
-              <i class="fa fa-home f16"></i>
-            </router-link>
-
-            <span v-for="b in $store.state.breadcrumbs">
-              <span>/</span>
-							<router-link v-if="(b.name || b.path) && b.name !== $store.state.route.name" :to="b">
-                {{b.title}}
-              </router-link>
-							<span v-else>
-								{{b.title}}
-							</span>
-
-            </span>
-
-          </div>
-          <router-view></router-view>
-
-        </div>
-
-
-      </div>
-      <TopNavigation/>
-
-      <!--手机上不显示bottomNavigation，而采用弹出的形式-->
-      <BottomNavigation />
-    </div>
-  </div>
-
-
-</template>
-
-<script>
-  import SideNavigation from './layout/SideNavigation.vue'
-  import TopNavigation from './layout/TopNavigation.vue'
-  import BottomNavigation from './layout/BottomNavigation.vue'
-  import enquire from 'enquire.js/dist/enquire'
-
-  export default {
-    data() {
-      return {
-        member: this.$store.state.member
-      }
-    },
-    computed: {
-      config() {
-        return this.$store.state.config
-      }
-    },
-    components: {
-      SideNavigation,
-      TopNavigation,
-      BottomNavigation
-    },
-    methods: {
-      blankClick() {
-        if (this.config.mobile) {
-          if (this.config.showDrawer) {
-            this.$store.state.config.showDrawer = false
-          }
-        }
-      },
-      listenResponsiveEvent() {
-        let that = this
-        enquire.register('(max-width: 768px)', {
-          match: function () {
-            that.$store.state.config.mobile = true
-          },
-          unmatch: function () {
-            that.$store.state.config.showDrawer = true
-            that.$store.state.config.mobile = false
-          }
-        })
-      }
-    },
-    created() {
-
-    },
-    mounted() {
-      let that = this
-      this.$store.state.environment = 'backyard'
-      this.listenResponsiveEvent()
-    }
-  }
-</script>
-
-<style lang="less" rel="stylesheet/less">
-  @import "../assets/css/global/variables";
-
-  #page-wrapper {
-
-    position: fixed;
-    left: @sidebar-width;
-    top: @top-navigation-height;
-    right: 0;
-    bottom: @power-footer-height;
-    overflow-y: auto;
-    overflow-x: hidden;
-    z-index: 10;
-
-    padding: 10px;
-
-    -webkit-transition: all 0.4s;
-    -moz-transition: all 0.4s;
-    -o-transition: all 0.4s;
-    transition: all 0.4s;
-
-    background-color: #f3f3f4;
-
-    //大屏幕
-    @media (min-width: @screen-sm-min) {
-      left: @sidebar-width;
-    }
-    //小屏幕
-    @media (max-width: @screen-xs-max) {
-      left: 0;
-      bottom: 0;
-    }
-
-    &.show-drawer {
-      //大屏幕
-      @media (min-width: @screen-sm-min) {
-        left: @sidebar-width;
-      }
-
-      //小屏幕
-      @media (max-width: @screen-xs-max) {
-        left: 0;
-        bottom: 0;
-      }
-    }
-  }
-
-</style>

src/backyard/layout/BottomNavigation.vue

@@ -1,63 +0,0 @@
-<template>
-	<div class="bottom-navigation text-center">
-		<span class="mr10">
-			<span v-html="preference.footerLine1"></span>
-		</span>
-		<span class="mr10">
-			<span v-html="preference.footerLine2"></span>
-		</span>
-		<!-- 版本号：cn.eyeblue.tank:1.0.0 -->
-		<!-- 开源不易，请不要移除掉这里的代码，蓝眼云盘谢谢您 ^_^ -->
-		<span>
-			Powered by <a target="_blank" href="https://github.com/eyebluecn/tank"><img class="w30" src="../../assets/img/logo.png"/> 蓝眼云盘</a>
-		</span>
-	</div>
-</template>
-
-<script>
-  export default {
-	  data(){
-      return{
-        preference: this.$store.state.preference
-      }
-	  }
-  }
-</script>
-
-<style lang="less" rel="stylesheet/less">
-	@import "../../assets/css/global/variables";
-
-	.bottom-navigation{
-		position: fixed;
-		height: @power-footer-height;
-		line-height: @power-footer-height;
-    background-color: white;
-		bottom: 0;
-		right: 0;
-		left: @sidebar-width;
-		padding: 0 20px;
-		border-top: 1px solid #eee;
-		//大屏幕
-		@media (min-width: @screen-sm-min) {
-			left: @sidebar-width;
-		}
-		//小屏幕
-		@media (max-width: @screen-xs-max) {
-			left: 0;
-      display: none;
-		}
-
-		&.show-drawer {
-			//大屏幕
-			@media (min-width: @screen-sm-min) {
-				left: @sidebar-width;
-			}
-
-			//小屏幕
-			@media (max-width: @screen-xs-max) {
-				left: 0;
-        display: none;
-			}
-		}
-	}
-</style>

src/backyard/layout/NotFound.vue

@@ -1,28 +0,0 @@
-<template>
-  <div class="not-found">
-    404 页面找不到
-  </div>
-</template>
-<script>
-
-  export default {
-    data() {
-      return {}
-    },
-    computed: {},
-    watch: {},
-    components: {},
-    methods: {}
-  }
-</script>
-
-
-<style lang="less" rel="stylesheet/less">
-
-  @import "../../assets/css/global/variables";
-
-  .not-found {
-    font-size: 32px;
-  }
-
-</style>

src/backyard/layout/SideNavigation.vue

@@ -1,259 +0,0 @@
-<template>
-  <nav ref="menuNav" class="side-navigation" :class="{'show-drawer':showDrawer}" @click.stop.prevent="eatClick">
-    <div class="sidebar-collapse">
-
-
-      <div class="menu-header" @click="goToProfile">
-        <div class="logo-area">
-          <img alt="image" class="img-circle w80"
-               :src="user.getAvatarUrl()"/>
-        </div>
-        <div class="text-area">
-          <div class="nickname">
-            {{user.role === 'GUEST' ? '请登录' : user.username}}
-          </div>
-        </div>
-      </div>
-
-      <ul class="nav mt20">
-
-        <li v-if="user.role === 'GUEST'">
-          <router-link to="/user/login">
-            <i class="w14 fa fa-user-circle-o"></i>
-            <span>登录</span>
-          </router-link>
-        </li>
-
-        <li v-if="user.role !== 'GUEST'">
-          <router-link to="/">
-            <i class="w14 fa fa fa-th"></i>
-            <span>全部文件</span>
-          </router-link>
-        </li>
-
-        <li v-if="user.role === 'ADMINISTRATOR'">
-          <router-link to="/preference">
-            <i class="w14 fa fa-dashboard"></i>
-            <span>网站偏好</span>
-          </router-link>
-        </li>
-
-        <li v-if="user.role === 'ADMINISTRATOR'">
-          <router-link to="/user/list">
-            <i class="w14 fa fa-user"></i>
-            <span>用户列表</span>
-          </router-link>
-        </li>
-
-        <li v-if="user.role !== 'GUEST'">
-          <router-link to="/user/login">
-            <i class="w14 fa fa-power-off"></i>
-            <span>退出登录</span>
-          </router-link>
-        </li>
-
-        <li class="about-menu">
-          <a href="javascript:void(0)" @click.stop.prevent="showAbout">
-            <i class="w14 fa fa-info-circle"></i>
-            <span>关于</span>
-          </a>
-        </li>
-
-
-      </ul>
-
-    </div>
-  </nav>
-</template>
-<script>
-  import {Message, MessageBox, Notification} from 'element-ui'
-
-  export default {
-
-    data() {
-      return {
-        user: this.$store.state.user,
-        preference: this.$store.state.preference
-      }
-    },
-    computed: {
-      showDrawer() {
-        return this.$store.state.config.showDrawer;
-      },
-      mobile() {
-        return this.$store.state.config.mobile;
-      }
-
-    },
-
-    components: {},
-    methods: {
-      goToProfile() {
-
-        if (this.user.role === 'GUEST') {
-          this.$router.push("/user/login");
-        } else {
-          this.$router.push("/user/detail/" + this.user.uuid);
-        }
-
-      },
-      eatClick() {
-
-      },
-      showAbout() {
-
-        let html = '<div class="text-center">' + this.preference.footerLine1 + "<br/>" + this.preference.footerLine2 + "<br/>" + 'Powered by <a target="_blank" href="https://github.com/eyebluecn/tank"><img class="w30" src="../../assets/img/logo.png"/> 蓝眼云盘</a>' + '</div>'
-        MessageBox({
-          title: '关于',
-          message: html,
-          dangerouslyUseHTMLString: true,
-          confirmButtonText: '确定',
-          showCancelButton: false,
-          cancelButtonText: '关闭',
-          callback: (action, instance) => {
-            if (action === 'confirm') {
-
-            }
-          }
-        })
-
-      }
-    },
-    watch: {},
-    mounted() {
-      let that = this;
-    }
-  }
-</script>
-
-<style lang="less" rel="stylesheet/less">
-
-  @import "../../assets/css/global/variables";
-
-  @nav-bg: #3A3F51;
-  @nav-text-color: white;
-  @font-highlight-color: #ddd;
-  @left-border-color: @brand-primary;
-
-  //手机屏幕
-  @media (max-width: @screen-xs-max) {
-
-  }
-
-  //左侧菜单block.
-  .side-navigation {
-
-    overflow: auto;
-
-    -webkit-transition: all 0.4s;
-    -moz-transition: all 0.4s;
-    -o-transition: all 0.4s;
-    transition: all 0.4s;
-
-    position: fixed;
-    width: @sidebar-width;
-
-    left: -@sidebar-width;
-    top: 0;
-    bottom: 0;
-    z-index: 1000;
-
-    background: darken(@nav-bg, 3%);
-
-    &.show-drawer {
-      left: 0;
-    }
-
-    .sidebar-collapse {
-      padding-bottom: 40px;
-    }
-
-    .app-name-box {
-      text-align: center;
-      vertical-align: middle;
-      display: table-cell;
-      width: @sidebar-width;
-      background-color: @brand-primary;
-      height: @top-navigation-height;
-      a {
-        font-size: 16px;
-        color: white;
-      }
-    }
-
-    //放头像和昵称的地方。
-    .menu-header {
-      cursor: pointer;
-      .logo-area {
-
-        text-align: center;
-        padding: 20px 0;
-      }
-
-      .text-area {
-        .nickname {
-          text-align: center;
-          color: @nav-text-color;
-          font-weight: bold;
-        }
-        .role {
-          text-align: center;
-          color: @nav-text-color;
-        }
-      }
-
-    }
-
-    //分割线
-    .separate-line {
-      margin-top: 20px;
-      padding-bottom: 5px;
-      border-bottom: 1px solid #666666;
-
-      span {
-        margin-left: 20px;
-        color: #777;
-      }
-    }
-
-    .nav {
-      li {
-
-        a {
-
-          color: @nav-text-color;
-
-          padding: 12px 20px;
-          &:hover, &:focus {
-            color: @font-highlight-color;
-            background-color: transparent;
-            outline: none;
-          }
-
-          i {
-            margin-right: 6px;
-          }
-
-          &.router-link-exact-active {
-            background-color: black;
-          }
-        }
-      }
-
-    }
-
-    .about-menu {
-      //大屏幕
-      @media (min-width: @screen-sm-min) {
-        display: none;
-      }
-      //手机屏幕
-      @media (max-width: @screen-xs-max) {
-
-      }
-
-    }
-  }
-
-
-</style>

src/backyard/layout/TopNavigation.vue

@@ -1,171 +0,0 @@
-<template>
-  <div class="top-navigation-bar">
-    <nav class="navbar">
-
-
-      <div class="navbar-title">
-
-        <router-link to="/">
-          <img class="logo" :src="logoUrl"/>
-          <span class="title">{{preference.name}}</span>
-        </router-link>
-
-      </div>
-
-      <button class="drawer-trigger btn btn-primary btn-sm"
-              @click.stop.prevent="$store.state.config.showDrawer=!$store.state.config.showDrawer">
-        <i class="fa fa-bars"></i>
-      </button>
-
-
-    </nav>
-  </div>
-</template>
-<script>
-
-  let defaultLogoPath = require("../../assets/img/logo.png");
-
-  export default {
-    data() {
-      return {
-        preference: this.$store.state.preference,
-        user: this.$store.state.user
-      }
-    },
-    computed: {
-      //logo可以使用自定义的。
-      logoUrl() {
-        if (this.preference.logoUrl) {
-          return this.preference.logoUrl + '?imageProcess=resize&imageResizeM=fill&imageResizeW=100&imageResizeH=100'
-        } else {
-          return defaultLogoPath
-        }
-      }
-    },
-    components: {},
-    methods: {}
-  }
-</script>
-
-
-<style lang="less" rel="stylesheet/less">
-
-  @import "../../assets/css/global/variables";
-
-  //上方的导航栏
-  .top-navigation-bar {
-
-    height: @top-navigation-height;
-    background-color: white;
-    border-bottom: 1px solid #eeeeee;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    z-index: 100;
-    padding-left: @sidebar-width;
-
-    .navbar {
-      border: none;
-    }
-
-    //手机屏幕
-    @media (max-width: @screen-xs-max) {
-      padding-left: 0;
-    }
-
-    .navbar-title {
-      float: left;
-      cursor: pointer;
-      margin-left: 10px;
-      .logo {
-        height: @top-navigation-height;
-
-      }
-      .title {
-        margin-left: 10px;
-        font-size: 18px;
-        color: black;
-        font-weight: bold;
-        display: inline-block;
-        line-height: @top-navigation-height;
-        vertical-align: middle;
-      }
-
-    }
-
-    .login-trigger {
-      float: right;
-      margin-right: 10px;
-      .login-span, .register-span {
-        color: #888;
-        cursor: pointer;
-        font-size: 14px;
-        line-height: 40px;
-
-        &:hover {
-          color: black;
-          text-decoration: underline;
-        }
-      }
-    }
-
-    .drawer-trigger {
-      float: right;
-      margin-top: 5px;
-      margin-right: 5px;
-    }
-
-    .navbar-right {
-
-      > li {
-        display: inline-block;
-        &:last-child {
-          margin-right: 5px;
-        }
-        a {
-          color: #999c9e;
-          font-size: 14px;
-          padding: 6px 12px;
-        }
-
-      }
-
-      @media (min-width: 768px) {
-        float: right !important;
-        margin-right: 0;
-      }
-
-      .message-info {
-        position: relative;
-
-        .label {
-
-          line-height: 12px;
-          padding: 2px 5px;
-          position: absolute;
-          left: 10%;
-          bottom: 50%;
-
-        }
-      }
-    }
-
-    //小屏幕
-    @media (min-width: @screen-sm-min) {
-      .drawer-trigger {
-        display: none;
-      }
-    }
-    //手机屏幕
-    @media (max-width: @screen-xs-max) {
-
-      .navbar-right {
-        display: none;
-      }
-    }
-
-  }
-
-
-</style>

src/backyard/matter/List.vue

@@ -1,408 +0,0 @@
-<template>
-  <div class="backyard-matter-list">
-    <div class="row">
-
-      <div class="col-md-12">
-
-        <div>
-          <NbFilter :pager="pager" :callback="search">
-
-            <button class="btn btn-primary btn-sm mb10" v-if="selectedMatters.length !== pager.data.length"
-                    @click.stop.prevent="checkAll">
-              <i class="fa fa-check-square"></i>
-              全选
-            </button>
-            <button class="btn btn-primary btn-sm mb10"
-                    v-if="pager.data.length && selectedMatters.length === pager.data.length"
-                    @click.stop.prevent="checkNone">
-              <i class="fa fa-square-o"></i>
-              取消全选
-            </button>
-            <button class="btn btn-primary btn-sm mb10" v-if="selectedMatters.length" @click.stop.prevent="deleteBatch">
-              <i class="fa fa-trash"></i>
-              删除
-            </button>
-            <button class="btn btn-primary btn-sm mb10" v-if="selectedMatters.length"
-                    @click.stop.prevent="moveBatch($createElement)">
-              <i class="fa fa-arrows"></i>
-              移动
-            </button>
-
-            <span class="btn btn-primary btn-sm btn-file mb10">
-              <slot name="button">
-                <i class="fa fa-cloud-upload"></i>
-                <span>上传文件</span>
-              </slot>
-              <input ref="refFile" type="file" @change.prevent.stop="triggerUpload"/>
-				    </span>
-
-            <button class="btn btn-sm btn-primary mb10" @click.stop.prevent="createDirectory">
-              <i class="fa fa-plus"></i>
-              创建文件夹
-            </button>
-          </NbFilter>
-
-        </div>
-
-        <div v-for="m in uploadMatters">
-          <UploadMatterPanel :matter="m"/>
-        </div>
-
-        <div v-if="director.createMode">
-          <MatterPanel ref="newMatterPanel" @createDirectorySuccess="refresh()" :matter="newMatter"
-                       :director="director"/>
-        </div>
-        <div v-for="matter in pager.data">
-          <MatterPanel @goToDirectory="goToDirectory" @deleteSuccess="refresh()" :matter="matter" :director="director"
-                       @checkMatter="checkMatter"/>
-        </div>
-
-        <div>
-          <NbPager :pager="pager" :callback="refresh" emptyHint="该目录下暂无任何内容"/>
-        </div>
-      </div>
-
-
-    </div>
-
-  </div>
-</template>
-<script>
-  import MatterPanel from './widget/MatterPanel'
-  import UploadMatterPanel from './widget/UploadMatterPanel'
-  import MoveBatchPanel from './widget/MoveBatchPanel'
-  import NbSlidePanel from '../../common/widget/NbSlidePanel.vue'
-  import NbExpanding from '../../common/widget/NbExpanding.vue'
-  import NbCheckbox from '../../common/widget/NbCheckbox.vue'
-  import NbFilter from '../../common/widget/filter/NbFilter'
-  import NbPager from '../../common/widget/NbPager'
-  import Matter from '../../common/model/matter/Matter'
-  import Pager from '../../common/model/base/Pager'
-  import Director from './widget/Director'
-  import {Message, MessageBox} from 'element-ui'
-
-  export default {
-    data() {
-      return {
-        //当前文件夹信息。
-        matter: new Matter(),
-        //准备新建的文件。
-        newMatter: new Matter(),
-        //准备上传的一系列文件
-        uploadMatters: [],
-        //当前选中的文件
-        selectedMatters: [],
-        pager: new Pager(Matter, 50),
-        user: this.$store.state.user,
-        breadcrumbs: this.$store.state.breadcrumbs,
-        director: new Director()
-
-      }
-    },
-    components: {
-      MatterPanel,
-      UploadMatterPanel,
-      MoveBatchPanel,
-      NbCheckbox,
-      NbFilter,
-      NbPager,
-      NbSlidePanel,
-      NbExpanding
-    },
-    methods: {
-      reset() {
-        this.pager.page = 0
-        this.pager.resetFilter()
-        this.pager.enableHistory()
-      },
-      search() {
-        this.pager.page = 0
-        this.refresh()
-      },
-      refresh() {
-
-        //刷新面包屑
-        this.refreshBreadcrumbs()
-
-        this.pager.httpFastPage()
-      },
-      goToDirectory(uuid) {
-        this.pager.setFilterValue('puuid', uuid)
-        this.pager.page = 0
-        let query = this.pager.getParams()
-
-
-        //采用router去管理路由，否则浏览器的回退按钮出现意想不到的问题。
-        this.$router.push({
-          path: '/',
-          query: query
-        })
-
-      },
-      refreshBreadcrumbs() {
-
-        let that = this
-
-        //清空暂存区
-        this.selectedMatters.splice(0, this.selectedMatters.length)
-
-        let uuid = that.pager.getFilterValue('puuid')
-
-        //根目录简单处理即可。
-        if (!uuid || uuid === 'root') {
-
-          this.matter.uuid = 'root'
-          that.breadcrumbs.splice(0, that.breadcrumbs.length)
-          that.breadcrumbs.push({
-            title: '全部文件'
-          })
-
-        } else {
-
-          this.matter.uuid = uuid
-          this.matter.httpDetail(function () {
-
-            let arr = []
-            let cur = that.matter.parent
-            while (cur) {
-              arr.push(cur)
-              cur = cur.parent
-            }
-
-            that.breadcrumbs.splice(0, that.breadcrumbs.length)
-            let query = that.pager.getParams()
-            query['puuid'] = 'root'
-            //添加一个随机数，防止watch $route失败
-            query['_t'] = new Date().getTime()
-            that.breadcrumbs.push({
-              title: '全部文件',
-              path: '/',
-              query: query
-            })
-
-            for (let i = arr.length - 1; i >= 0; i--) {
-              let m = arr[i]
-              let query = that.pager.getParams()
-              query['puuid'] = m.uuid
-              query['_t'] = new Date().getTime()
-              that.breadcrumbs.push({
-                title: m.name,
-                path: '/',
-                query: query
-              })
-            }
-            //第一个文件
-            that.breadcrumbs.push({
-              title: that.matter.name
-            })
-          })
-        }
-      },
-      createDirectory() {
-        let that = this
-        that.newMatter.name = '新建文件夹'
-        that.newMatter.dir = true
-        that.newMatter.editMode = true
-        that.newMatter.puuid = that.matter.uuid
-        if (!that.newMatter.puuid) {
-          that.newMatter.puuid = 'root'
-        }
-
-
-        //指定为当前选择的用户。
-        //如果没有设置用户的话，那么默认显示当前登录用户的资料
-        if (!that.pager.getFilterValue('userUuid')) {
-          that.newMatter.userUuid = that.user.uuid
-        } else {
-          that.newMatter.userUuid = that.pager.getFilterValue('userUuid')
-        }
-
-        that.director.createMode = true
-
-        setTimeout(function () {
-          that.$refs.newMatterPanel.highLight()
-        }, 100)
-      },
-      triggerUpload() {
-        let that = this
-
-        let m = new Matter()
-        m.dir = false
-        m.puuid = that.matter.uuid
-
-
-        //指定为当前选择的用户。
-        //如果没有设置用户的话，那么默认显示当前登录用户的资料
-        if (!that.pager.getFilterValue('userUuid')) {
-          m.userUuid = that.user.uuid
-        } else {
-          m.userUuid = that.pager.getFilterValue('userUuid')
-        }
-
-
-        let value = that.$refs['refFile'].value
-        if (!value) {
-          return
-        }
-        m.file = that.$refs['refFile'].files[0]
-
-        m.httpUpload(function () {
-          that.refresh()
-        })
-
-        that.uploadMatters.push(m)
-
-      },
-
-      //全选
-      checkAll() {
-        this.pager.data.forEach(function (i, index) {
-          i.check = true
-        })
-      },
-      //取消全选
-      checkNone() {
-        this.pager.data.forEach(function (i, index) {
-          i.check = false
-        })
-      },
-      //选择文件时放入暂存区等待操作
-      checkMatter(matter) {
-        if (matter.check && this.selectedMatters.indexOf(matter) === -1) {
-          this.selectedMatters.push(matter)
-        } else if (!matter.check && this.selectedMatters.indexOf(matter) !== -1) {
-          let index = this.selectedMatters.indexOf(matter)
-          this.selectedMatters.splice(index, 1)
-        }
-        return true
-      },
-      //批量删除
-      deleteBatch() {
-        let that = this
-        MessageBox.confirm('此操作将永久删除这些文件, 是否继续?', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning',
-          callback: function (action, instance) {
-            if (action === 'confirm') {
-              let uuids = ""
-              that.selectedMatters.forEach(function (item, index) {
-                if (index === 0) {
-                  uuids = item.uuid
-                } else {
-                  uuids = uuids + "," + item.uuid
-                }
-              })
-              that.matter.httpDeleteBatch(uuids, function (response) {
-                Message.success('删除成功！')
-                that.refresh()
-              })
-            }
-
-          }
-        })
-      },
-      //批量移动
-      moveBatch(createElement) {
-        let that = this
-
-        let targetMatterUuid = null
-        let dom = createElement(MoveBatchPanel, {
-          props: {
-            version: (new Date()).getTime(),
-            userUuid: that.selectedMatters[0].userUuid,
-            callback: function (matter) {
-              if (matter.uuid) {
-                targetMatterUuid = matter.uuid
-              } else {
-                targetMatterUuid = "root"
-              }
-            }
-          }
-        })
-
-        MessageBox({
-          title: '移动到',
-          message: dom,
-          customClass: 'wp50',
-          confirmButtonText: '确定',
-          showCancelButton: true,
-          cancelButtonText: '关闭',
-          callback: (action, instance) => {
-            if (action === 'confirm') {
-              let uuids = ""
-              that.selectedMatters.forEach(function (item, index) {
-                if (index === 0) {
-                  uuids = item.uuid
-                } else {
-                  uuids = uuids + "," + item.uuid
-                }
-              })
-
-              that.matter.httpMove(uuids, targetMatterUuid, function (response) {
-                Message.success('移动成功！')
-                that.refresh()
-              })
-            }
-          }
-        })
-      }
-    },
-    watch: {
-      '$route'(newVal, oldVal) {
-
-        let puuid = this.$route.query.puuid
-        if (puuid) {
-          this.pager.setFilterValue('puuid', puuid)
-        } else {
-          this.pager.setFilterValue('puuid', 'root')
-        }
-
-        this.refresh()
-
-      }
-
-    },
-    created() {
-      /*初始化inputSelection*/
-      if (this.user.role === 'ADMINISTRATOR') {
-        this.pager.getFilter('userUuid').visible = true
-      } else {
-        this.pager.setFilterValue('userUuid', this.user.uuid)
-      }
-    },
-    mounted() {
-
-      let that = this
-      this.pager.enableHistory()
-
-      let puuid = this.$route.query.puuid
-      if (puuid) {
-        this.pager.setFilterValue('puuid', puuid)
-      } else {
-        this.pager.setFilterValue('puuid', 'root')
-      }
-
-
-      //如果所有的排序都没有设置，那么默认以时间降序。
-      if (!this.pager.getFilterValue('orderDir') && !this.pager.getFilterValue('orderCreateTime') && !this.pager.getFilterValue('orderSize') && !this.pager.getFilterValue('orderName')) {
-        this.pager.setFilterValue('orderCreateTime', 'DESC')
-      }
-
-      //如果没有设置用户的话，那么默认显示当前登录用户的资料
-      if (!this.pager.getFilterValue('userUuid')) {
-        this.pager.setFilterValue('userUuid', this.user.uuid)
-      }
-
-      this.refresh()
-
-    }
-  }
-</script>
-<style lang="less" rel="stylesheet/less">
-  @import "../../assets/css/global/variables";
-
-  .backyard-matter-list {
-
-  }
-</style>

src/backyard/matter/widget/Director.js

@@ -1,16 +0,0 @@
-//导演类，用户来让整个工作有序进行
-export default class Director {
-  constructor(args) {
-    //正在重命名
-    this.renameMode = false
-    //正在创建新文件夹
-    this.createMode = false
-    //正在移动文件
-    this.moveMode = false
-  }
-
-  isEditing() {
-    return this.renameMode || this.createMode || this.moveMode
-  }
-
-}