diff --git a/.browserslistrc b/.browserslistrc
index d6471a3..214388f 100644
--- a/.browserslistrc
+++ b/.browserslistrc
@@ -1,2 +1,3 @@
> 1%
last 2 versions
+not dead
diff --git a/.dockerignore b/.dockerignore
deleted file mode 100644
index 27ef30a..0000000
--- a/.dockerignore
+++ /dev/null
@@ -1,21 +0,0 @@
-.DS_Store
-node_modules
-/dist
-
-# local env files
-.env.local
-.env.*.local
-
-# Log files
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-yarn.lock
-
-# Editor directories and files
-.idea
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
diff --git a/.eslintignore b/.eslintignore
index 5384192..af2f677 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,6 +1,3 @@
-/public/
-/dist/
-/node_modules/
-/src/icons/svg/
-/mock/
vue.config.js
+/src/crud
+/src/core
\ No newline at end of file
diff --git a/.eslintrc.js b/.eslintrc.js
index 39bd413..a2c2908 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -3,12 +3,19 @@ module.exports = {
env: {
node: true
},
- extends: ["plugin:vue/essential", "@vue/prettier"],
- rules: {
- "no-console": "off",
- "comma-dangle": [2, "never"]
- },
+ extends: [
+ "plugin:vue/vue3-essential",
+ "eslint:recommended",
+ "@vue/typescript/recommended",
+ "@vue/prettier",
+ "@vue/prettier/@typescript-eslint"
+ ],
parserOptions: {
- parser: "@typescript-eslint/parser"
+ ecmaVersion: 2020
+ },
+ rules: {
+ "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
+ "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+ "@typescript-eslint/no-explicit-any": ["off"]
}
};
diff --git a/.gitignore b/.gitignore
index 27ef30a..403adbc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,6 +2,7 @@
node_modules
/dist
+
# local env files
.env.local
.env.*.local
@@ -10,10 +11,11 @@ node_modules
npm-debug.log*
yarn-debug.log*
yarn-error.log*
-yarn.lock
+pnpm-debug.log*
# Editor directories and files
.idea
+.vscode
*.suo
*.ntvs*
*.njsproj
diff --git a/Dockerfile b/Dockerfile
deleted file mode 100644
index dad46df..0000000
--- a/Dockerfile
+++ /dev/null
@@ -1,14 +0,0 @@
-FROM node:lts-alpine
-WORKDIR /build
-RUN npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass
-RUN npm set registry https://registry.npm.taobao.org
-COPY package.json /build/package.json
-RUN npm install
-COPY ./ /build
-RUN npm run build
-
-FROM nginx
-RUN mkdir /app
-COPY --from=0 /build/dist /app
-COPY --from=0 /build/nginx.conf /etc/nginx/nginx.conf
-EXPOSE 80
\ No newline at end of file
diff --git a/LICENSE b/LICENSE
deleted file mode 100644
index 83140ce..0000000
--- a/LICENSE
+++ /dev/null
@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2021 cool-team-official
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
diff --git a/README.md b/README.md
index 76604df..747e143 100644
--- a/README.md
+++ b/README.md
@@ -1,290 +1,24 @@
-
-
+# front-next-vue3
-cool-admin 一个很酷的后台权限管理系统，开源免费，模块化、插件化、极速开发 CRUD，方便快速构建迭代后台管理系统， 到论坛 进一步了解
-
-
-
-
-## 演示
-
-[https://show.cool-admin.com](https://show.cool-admin.com)
-
-- 账户：admin
-- 密码：123456
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+### Compiles and minifies for production
+```
+yarn build
```
-2. 编辑数据表格 `cl-table`：
-
-```js
-{
- table: {
- // 参数与 el-table-column 一致，并支持许多骚操作
- columns: [
- // 多选列
- {
- type: "selection",
- width: 60
- },
- // 自定义列
- {
- label: "昵称",
- prop: "name"
- },
- {
- label: "账户",
- prop: "price",
- sortable: "custom" // 是否添加排序
- },
- {
- label: "状态",
- prop: "status",
- // 字典匹配，使用 el-tag 展示
- dict: [
- {
- label: "启用",
- value: 1,
- type: "primary"
- },
- {
- label: "禁用",
- value: 0,
- type: "danger"
- }
- ]
- },
- {
- label: "创建时间",
- prop: "createTime"
- },
- // 操作按钮列，默认包含：编辑、删除
- {
- type: "op"
- }
- ];
- }
-}
+### Lints and fixes files
+```
+yarn lint
```
-3. 编辑新增、编辑表单 `cl-upsert`：
-
-```js
-{
- upsert: {
- items: [
- {
- label: "昵称",
- prop: "name",
- // 参数与 el-form-item 一致
- props: {},
- value: "神仙都没用", // 昵称默认值
- // 渲染参数，支持 slot, 组件实例，jsx
- component: {
- name: "el-input", // 可以是任意已注册的组件名
- props: {}, // 组件的参数
- on: {} // 组件的回调事件
- },
- // 验证规则，与 el-form 一致
- rules: {
- required: true,
- message: "昵称不呢为空"
- }
- },
- {
- label: "存款",
- prop: "price",
- component: {
- name: "el-input-number",
- props: {
- min: 0,
- max: 10000
- }
- }
- },
- {
- label: "状态",
- prop: "status",
- value: 1,
- component: {
- name: "el-radio-group",
- options: [
- {
- label: "启用",
- value: 1
- },
- {
- label: "禁用",
- value: 0
- }
- ]
- }
- }
- ];
- }
-}
-```
-
-4. 绑定 `service`。在 `src/service/` 下新建文件 `test.js`，并编辑：
-
-```js
-// src/service/test.js
-import { BaseService, Service, Permission } from "cl-admin";
-
-// 请求接口的路径
-@Service("test")
-class Test extends BaseService {
- // 继承 BaseService 后，拥有 page, list, add, delete, update, info 6个基本接口
-
- // 自定义其他接口
- @Permission("product") // 权限装饰器，可选
- product(id) {
- // this.request() 参数与 axios 一致
- return this.request({
- url: "/product",
- method: "POST",
- data: {
- id
- }
- });
- }
-}
-
-export default Test;
-```
-
-在 `src/service/` 下的文件，框架会自动根据 `目录结构` 和 `文件名称` 格式化成对应的 `$service` 对象。你现在可以这么使用它：
-
-```js
-this.$service.test.page({ page: 1 });
-this.$service.test.product(1);
-```
-
-`service` 编写好后，我们把它绑定在 `crud` 上：
-
-```js
-export default {
- methods: {
- onLoad({ ctx, app }) {
- // 绑定 service，这边指定到 test 即可
- ctx.service(this.$service.test).done();
-
- // 发起 page 请求
- app.refresh({
- // 请求默认参数
- });
- }
- }
-};
-```
-
-5. 效果预览
-
-
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).
diff --git a/babel.config.js b/babel.config.js
index 32df09b..140ed64 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,13 +1,3 @@
module.exports = {
- presets: ["@vue/app"],
- plugins: [
- ["jsx-v-model"],
- [
- "component",
- {
- libraryName: "element-ui",
- styleLibraryName: "theme-chalk"
- }
- ]
- ]
+ presets: ["@vue/cli-plugin-babel/preset"]
};
diff --git a/nginx.conf b/nginx.conf
deleted file mode 100644
index 2a09a53..0000000
--- a/nginx.conf
+++ /dev/null
@@ -1,84 +0,0 @@
-user nginx;
-worker_processes 1;
-error_log /var/log/nginx/error.log warn;
-pid /var/run/nginx.pid;
-events {
- worker_connections 1024;
-}
-http {
- include /etc/nginx/mime.types;
- default_type application/octet-stream;
- log_format main '$remote_addr - $remote_user [$time_local] "$request" '
- '$status $body_bytes_sent "$http_referer" '
- '"$http_user_agent" "$http_x_forwarded_for"';
- access_log /var/log/nginx/access.log main;
- sendfile on;
- keepalive_timeout 65;
-
- server {
- listen 80;
- server_name localhost;
- location / {
- root /app;
- index index.html;
- try_files $uri $uri/ /index.html;
- }
- location /api/
- {
- proxy_pass http://midway:7001/;
- proxy_set_header Host $host;
- proxy_set_header X-Real-IP $remote_addr;
- proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
- proxy_set_header REMOTE-HOST $remote_addr;
-
- #缓存相关配置
- #proxy_cache cache_one;
- #proxy_cache_key $host$request_uri$is_args$args;
- #proxy_cache_valid 200 304 301 302 1h;
-
- #持久化连接相关配置
- proxy_connect_timeout 3000s;
- proxy_read_timeout 86400s;
- proxy_send_timeout 3000s;
- #proxy_http_version 1.1;
- #proxy_set_header Upgrade $http_upgrade;
- #proxy_set_header Connection "upgrade";
-
- add_header X-Cache $upstream_cache_status;
-
- #expires 12h;
- }
-
- location /adminer/
- {
- proxy_pass http://adminer:8080/;
- proxy_set_header Host $host;
- proxy_set_header X-Real-IP $remote_addr;
- proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
- proxy_set_header REMOTE-HOST $remote_addr;
-
- #缓存相关配置
- #proxy_cache cache_one;
- #proxy_cache_key $host$request_uri$is_args$args;
- #proxy_cache_valid 200 304 301 302 1h;
-
- #持久化连接相关配置
- proxy_connect_timeout 3000s;
- proxy_read_timeout 86400s;
- proxy_send_timeout 3000s;
- #proxy_http_version 1.1;
- #proxy_set_header Upgrade $http_upgrade;
- #proxy_set_header Connection "upgrade";
-
- add_header X-Cache $upstream_cache_status;
-
- #expires 12h;
- }
-
- error_page 500 502 503 504 /50x.html;
- location = /50x.html {
- root /usr/share/nginx/html;
- }
-
- }
-}
\ No newline at end of file
diff --git a/package.json b/package.json
index bf06fb4..1880f7b 100644
--- a/package.json
+++ b/package.json
@@ -1,65 +1,60 @@
{
- "name": "cool-admin-vue",
- "version": "3.2.0",
+ "name": "front-next-vue3",
+ "version": "0.1.0",
+ "private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
- "report": "vue-cli-service build --report",
- "lint": "vue-cli-service lint",
- "inspect": "vue inspect --mode=production > output.js"
+ "lint": "vue-cli-service lint"
},
"dependencies": {
- "@vue/composition-api": "^1.0.0-rc.5",
+ "array.prototype.flat": "^1.2.4",
"axios": "^0.21.1",
- "cl-admin": "^1.5.3",
- "cl-admin-crud": "^1.6.8",
- "cl-admin-theme": "^0.0.5",
- "clipboard": "^2.0.7",
- "codemirror": "^5.59.4",
+ "cl-admin": "^1.5.1",
+ "clipboard": "^2.0.8",
+ "clone-deep": "^4.0.1",
+ "codemirror": "^5.60.0",
"core-js": "^3.6.5",
- "dayjs": "^1.10.4",
"echarts": "^5.0.2",
- "element-ui": "^2.15.1",
+ "element-plus": "1.0.2-beta.35",
"js-beautify": "^1.13.5",
+ "lodash": "^4.17.21",
+ "merge": "^2.1.1",
+ "mitt": "^2.1.0",
"mockjs": "^1.1.0",
"nprogress": "^0.2.0",
- "qs": "^6.9.1",
"quill": "^1.3.7",
- "socket.io-client": "2.3.1",
+ "socket.io-client": "^4.0.0",
"store": "^2.0.12",
- "uuid": "^8.3.2",
- "vue": "^2.6.11",
- "vue-codemirror": "^4.0.6",
- "vue-cron": "^1.0.9",
+ "vue": "^3.0.9",
"vue-echarts": "^6.0.0-rc.3",
- "vue-router": "^3.2.0",
- "vuedraggable": "^2.24.3",
- "vuex": "^3.4.0"
+ "vue-router": "^4.0.5",
+ "vuedraggable": "^4.0.1",
+ "vuex": "^4.0.0-0"
},
"devDependencies": {
- "@typescript-eslint/parser": "^3.0.0",
- "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
- "@vue/babel-preset-jsx": "^1.1.2",
+ "@types/lodash": "^4.14.168",
+ "@typescript-eslint/eslint-plugin": "^2.33.0",
+ "@typescript-eslint/parser": "^2.33.0",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-plugin-router": "~4.5.0",
+ "@vue/cli-plugin-typescript": "~4.5.0",
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
+ "@vue/compiler-sfc": "^3.0.0",
"@vue/eslint-config-prettier": "^6.0.0",
- "babel-eslint": "^10.1.0",
- "babel-plugin-component": "^1.1.1",
- "babel-plugin-jsx-v-model": "^2.0.3",
- "clean-webpack-plugin": "^3.0.0",
+ "@vue/eslint-config-typescript": "^5.0.2",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "^3.1.3",
- "eslint-plugin-vue": "^6.2.2",
+ "eslint-plugin-vue": "^7.0.0-0",
"hard-source-webpack-plugin": "^0.13.1",
+ "lint-staged": "^9.5.0",
"node-sass": "^4.12.0",
"prettier": "^1.19.1",
"sass-loader": "^8.0.2",
- "svg-sprite-loader": "^5.0.0",
- "typescript": "^3.9.3",
- "vue-template-compiler": "^2.6.11",
- "webpack-cli": "^3.3.12"
- }
+ "svg-sprite-loader": "^6.0.2",
+ "typescript": "~3.9.3"
+ },
+ "typings": "types/index.d.ts"
}
diff --git a/postcss.config.js b/postcss.config.js
deleted file mode 100644
index 3080304..0000000
--- a/postcss.config.js
+++ /dev/null
@@ -1,5 +0,0 @@
-module.exports = {
- plugins: {
- autoprefixer: {}
- }
-};
diff --git a/public/favicon.ico b/public/favicon.ico
index 0b823a3..df36fcf 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/public/index.html b/public/index.html
index 340e6c7..3e5a139 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,99 +1,17 @@
-
-
- COOL-ADMIN
- <% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
-
- We're sorry but cool-admin doesn't work properly without JavaScript enabled. Please
- enable it to continue.
-
-
-
-
-
COOL-ADMIN
-
正在加载资源...
-
初次加载资源可能需要较多时间 请耐心等待
-
-
-
-
-
<%= htmlWebpackPlugin.options.title %>
+
+
+
+ We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.
+
+
+
+
diff --git a/src/assets/css/element-variables.scss b/src/assets/css/element-variables.scss
index 6b287e4..a4ee298 100644
--- a/src/assets/css/element-variables.scss
+++ b/src/assets/css/element-variables.scss
@@ -4,6 +4,6 @@ $--color-danger: $color-danger;
$--color-warning: $color-warning;
$--color-info: $color-info;
-$--font-path: "~element-ui/lib/theme-chalk/fonts";
+$--font-path: "~element-plus/lib/theme-chalk/fonts";
-@import "~element-ui/packages/theme-chalk/src/index";
+@import "~element-plus/packages/theme-chalk/src/index";
diff --git a/src/assets/css/index.scss b/src/assets/css/index.scss
index 58b6f4b..1619837 100644
--- a/src/assets/css/index.scss
+++ b/src/assets/css/index.scss
@@ -1,7 +1,6 @@
* {
padding: 0;
margin: 0;
- outline: none;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
"微软雅黑", Arial, sans-serif;
}
diff --git a/src/assets/logo.png b/src/assets/logo.png
new file mode 100644
index 0000000..f3d2503
Binary files /dev/null and b/src/assets/logo.png differ
diff --git a/src/config/env.js b/src/config/env.ts
similarity index 56%
rename from src/config/env.js
rename to src/config/env.ts
index 43423da..006d8f0 100644
--- a/src/config/env.js
+++ b/src/config/env.ts
@@ -1,20 +1,18 @@
import store from "store";
-import { getUrlParam } from "cl-admin/utils";
+import { getUrlParam } from "@/core/utils";
+import { MenuItem } from "@/cool/modules/base/types";
// 路由模式
-export const routerMode = "history";
+const routerMode = "history";
// 开发模式
-export const isDev = process.env.NODE_ENV == "development";
+const isDev: boolean = process.env.NODE_ENV == "development";
// Host
-export const host = "https://show.cool-admin.com";
+const host = "https://show.cool-admin.com";
-// Socket
-export const socketUrl = (isDev ? `${host}` : "") + "/socket";
-
-// 请求地址，本地会使用代理请求
-export const baseUrl = (function() {
+// 请求地址
+const baseUrl: string = (function() {
let proxy = getUrlParam("proxy");
if (proxy) {
@@ -26,11 +24,14 @@ export const baseUrl = (function() {
return isDev ? `/${proxy}/admin` : `/api/admin`;
})();
+// Socket
+const socketUrl: string = (isDev ? `${host}` : "") + "/socket";
+
// 阿里字体图标库 https://at.alicdn.com/t/**.css
-export const iconfontUrl = ``;
+const iconfontUrl = ``;
// 程序配置参数
-export const app = store.get("__app__") || {
+const app: any = store.get("__app__") || {
name: "COOL-ADMIN",
conf: {
@@ -47,4 +48,6 @@ export const app = store.get("__app__") || {
};
// 自定义菜单列表
-export const menuList = [];
+const menuList: MenuItem[] = [];
+
+export { routerMode, baseUrl, socketUrl, iconfontUrl, app, isDev, menuList };
diff --git a/src/cool/index.js b/src/cool/index.js
deleted file mode 100644
index 5f05b88..0000000
--- a/src/cool/index.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import Crud from "cl-admin-crud";
-import Theme from "cl-admin-theme";
-
-export default {
- modules: [
- // 基础模块
- "base",
- // 文件上传
- {
- name: "upload",
- options: {
- icon: "el-icon-picture",
- text: "选择图片"
- }
- },
- {
- name: "crud",
- value: Crud,
- options: {
- crud: {
- dict: {
- sort: {
- prop: "order",
- order: "sort"
- }
- }
- }
- }
- },
- // 客服聊天
- "chat",
- // 任务管理
- "task",
- // 复制指令
- "copy",
- // 省市区选择
- "distpicker",
- // 示例页
- "demo",
- // 主题切换
- {
- name: "theme",
- value: Theme
- }
- ]
-};
diff --git a/src/cool/index.ts b/src/cool/index.ts
new file mode 100644
index 0000000..e2ee64f
--- /dev/null
+++ b/src/cool/index.ts
@@ -0,0 +1,3 @@
+export default {
+ modules: ["base", "demo", "copy", "upload", "task", "theme", "chat"]
+};
diff --git a/src/cool/modules/base/common/index.js b/src/cool/modules/base/common/index.ts
similarity index 100%
rename from src/cool/modules/base/common/index.js
rename to src/cool/modules/base/common/index.ts
diff --git a/src/cool/modules/base/common/resize.js b/src/cool/modules/base/common/resize.ts
similarity index 98%
rename from src/cool/modules/base/common/resize.js
rename to src/cool/modules/base/common/resize.ts
index fd891ad..c36a6cd 100644
--- a/src/cool/modules/base/common/resize.js
+++ b/src/cool/modules/base/common/resize.ts
@@ -1,6 +1,6 @@
import store from "@/store";
-const lock = {
+const lock: any = {
menuCollapse: null,
showAMenu: null
};
diff --git a/src/cool/modules/base/common/theme.js b/src/cool/modules/base/common/theme.ts
similarity index 95%
rename from src/cool/modules/base/common/theme.js
rename to src/cool/modules/base/common/theme.ts
index 9cdf38d..0c9196c 100644
--- a/src/cool/modules/base/common/theme.js
+++ b/src/cool/modules/base/common/theme.ts
@@ -32,7 +32,7 @@ function iconList() {
return req
.keys()
.map(req)
- .map(e => e.default.id)
+ .map((e: any) => e.default.id)
.filter(e => e.includes("icon"))
.sort();
}
diff --git a/src/cool/modules/base/components/avatar/index.vue b/src/cool/modules/base/components/avatar/index.vue
index 1d8a7df..8486b48 100644
--- a/src/cool/modules/base/components/avatar/index.vue
+++ b/src/cool/modules/base/components/avatar/index.vue
@@ -1,17 +1,20 @@
-
diff --git a/src/cool/modules/base/components/menu/slider/index.js b/src/cool/modules/base/components/menu/slider/index.js
deleted file mode 100644
index 8fd7881..0000000
--- a/src/cool/modules/base/components/menu/slider/index.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import { mapGetters } from "vuex";
-import "./index.scss";
-
-export default {
- name: "cl-menu-slider",
-
- data() {
- return {
- visible: true
- };
- },
-
- computed: {
- ...mapGetters(["menuList", "menuCollapse", "browser", "app"])
- },
-
- watch: {
- menuList() {
- this.refresh();
- },
- "app.conf.showAMenu"() {
- this.$store.commit("SET_MENU_LIST");
- }
- },
-
- methods: {
- toView(url) {
- if (url != this.$route.path) {
- this.$router.push(url);
- }
- },
-
- refresh() {
- this.visible = false;
-
- setTimeout(() => {
- this.visible = true;
- }, 0);
- }
- },
-
- render() {
- const fn = list => {
- return list
- .filter(e => e.isShow)
- .map(e => {
- let html = null;
-
- if (e.type == 0) {
- html = (
-
-
- {e.name}
-
- {fn(e.children)}
-
- );
- } else {
- html = (
-
- {e.name}
-
- );
- }
-
- return html;
- });
- };
-
- let el = fn(this.menuList);
-
- return (
- this.visible && (
-
- )
- );
- }
-};
diff --git a/src/cool/modules/base/components/menu/slider/index.scss b/src/cool/modules/base/components/menu/slider/index.scss
index 47004b2..fb46bc4 100644
--- a/src/cool/modules/base/components/menu/slider/index.scss
+++ b/src/cool/modules/base/components/menu/slider/index.scss
@@ -30,6 +30,8 @@
.icon-svg {
font-size: 16px;
margin: 0 15px 0 5px;
+ position: relative;
+ top: 1px;
}
span {
diff --git a/src/cool/modules/base/components/menu/slider/index.tsx b/src/cool/modules/base/components/menu/slider/index.tsx
new file mode 100644
index 0000000..7d3ade7
--- /dev/null
+++ b/src/cool/modules/base/components/menu/slider/index.tsx
@@ -0,0 +1,122 @@
+import { useStore } from "vuex";
+import { computed, defineComponent, h, ref, watch } from "vue";
+import "./index.scss";
+import { useRoute, useRouter } from "vue-router";
+
+export default defineComponent({
+ name: "cl-menu-slider",
+
+ setup() {
+ const router = useRouter();
+ const route = useRoute();
+ const store = useStore();
+
+ // 是否可见
+ const visible = ref(true);
+ // 菜单列表
+ const menuList = computed(() => store.getters.menuList);
+ // 菜单是否折叠
+ const menuCollapse = computed(() => store.getters.menuCollapse);
+ // 浏览器信息
+ const browser: any = computed(() => store.getters.browser);
+
+ // 页面跳转
+ function toView(url: string) {
+ if (url != route.path) {
+ router.push(url);
+ }
+ }
+
+ // 刷新菜单
+ function refresh() {
+ visible.value = false;
+
+ setTimeout(() => {
+ visible.value = true;
+ }, 0);
+ }
+
+ // 监听菜单变化
+ watch(menuList, refresh);
+
+ return {
+ route,
+ visible,
+ menuList,
+ menuCollapse,
+ browser,
+ toView,
+ refresh
+ };
+ },
+
+ render(ctx: any) {
+ function deepMenu(list: any) {
+ return list
+ .filter((e: any) => e.isShow)
+ .map((e: any) => {
+ let html = null;
+
+ if (e.type == 0) {
+ html = h(
+
+ {e.name}
+
+ ) : (
+ {e.name} ;
+ },
+ default() {
+ return
- 
-
-
-## 项目后端
-
-[https://github.com/cool-team-official/cool-admin-midway](https://github.com/cool-team-official/cool-admin-midway)
-
-## 微信群
-
-
-
-## 微信公众号
-
-
-
-## 在线社区
-
-[https://bbs.cool-js.com/](https://bbs.cool-js.com/)
-
-## 使用条件
-
-请确保您的操作系统上安装了 Node.js（> = 8.9.0）、@vue/cli （> 3.0.0）。
-
-## 安装项目依赖
-
-推荐使用 `yarn`：
-
-```shell
-yarn
+## Project setup
+```
+yarn install
```
-解决 `node-sass` 网络慢的方法：
-
-```shell
-yarn config set sass-binary-site http://npm.taobao.org/mirrors/node-sass
+### Compiles and hot-reloads for development
```
-
-## 运行应用程序
-
-安装过程完成后，运行以下命令启动服务。您可以在浏览器中预览网站 [http://localhost:9000](http://localhost:9000)
-
-```shell
yarn serve
```
-## 极速 CRUD
-
-1. `vscode` 编辑器下输入关键字 `cl-crud`，会生成对应的模板代码：
-
-```html
-
-