vue antd admin
1.0.0
Изучите документацию по этому проекту »
Предварительный просмотр онлайн · Сообщать об ошибках · Вносить предложения
vue3-basic-admin Выполнено: vue3-basic-admin — это готовая к использованию система управления промежуточным и серверным компонентом с открытым исходным кодом. Разработанный на основе основных технологий, таких как Vue3 , Vite , Element-Plus , TypeScript , Pinia и т. д., он имеет множество встроенных компонентов, которые можно использовать «из коробки», что позволяет быстро построить промежуточную и серверную систему управления. На данный момент решено, что этот проект будет полностью открытым для вас, вы можете нажать звездочку, а если у вас есть определенные финансовые возможности, вы можете угостить автора чашечкой кофе. ! Добро пожаловать для предварительного просмотра и использования: vue3-basic-admin
1.优化之前版本的权限控制，菜单通过角色控制，可以给用户对应的角色和多角色 2.优化mock数据部分，建立用户常量和角色常量 3.添加tag标签页鼠标滚动功能 4.添加真正的整体换肤功能 5.添加外链 6.添加可视化图，饼图，柱状图等拖拽
vue-antd-admin — это серверная система управления, разработанная на основе vue+ant-design-vue. Она включает в себя динамическую маршрутизацию и управление разрешениями для решения проблем с разрешениями пользователей, а также предоставляет базовые фиксированные разрешения: администратора, тестирования, редактирования и настраиваемые права пользователя. которое можно настроить. Определите и измените меню, соответствующее роли. Вы можете определить несколько ролей для пользователя. Макет предоставляет два макета: левый и правый макет, а также верхний и нижний макет, которые можно свободно переключать. в смешанных темах, светлых темах и темных темах, которые можно переключать по желанию, также присутствуют некоторые часто используемые функции системы управления, такие как формы, таблицы и т. д.;
过一段时间后才发现忘记放测试账号和密码了，哈哈哈 1. 用户名：admin 密码 任意6位数 （如果你喜欢，可以用123456） 拥有admin的权限可以查看所有页面 2. 用户名：test 密码 任意6位数 （如果你喜欢，可以用123456） 拥有test的页面权限，可以查看部分页面 3. 用户名：editor 密码 任意6位数 （如果你喜欢，可以用123456） 拥有editor的页面权限，可以查看富文本等页面 4. 使用手机号验证码登录 ，默认拥有admin的权限
Реализована базовая версия бэкэнда node+express+mysql, адрес: vue-antd-server.
версия реакции, адрес: reacct-antd-admin
Этот проект разработан с использованием vue+vue-cli4+vuex+ant-design-vue и axios. Данные моделируются с использованием методаock.js. Позже мы планируем использовать node для написания бэкэнда.
Webpack был значительно оптимизирован, и первый экран загружается быстрее;
Система имеет встроенные графические дисплеи и карты ArcGIS, обычно используемые в электронных картах;
Использовал jest unit test, текущий охват все еще относительно низкий, напишу, когда будет время;
Для форматирования используется ESlint+prettier.
- 登录 用户名密码/手机号验证码 - 权限 - 动态路由 - echarts各种图表 - arcgis地图 - 克里金插值分析图 - 全景图 - 富文本 - Markdown - 错误页面 403 404 500 - 个人设置 - 系统设置 - 更换主题 - 两种布局方式 - 面包屑 - 标签页 - webSocket - svg图标 - 全屏 - 返回顶部 - webpack优化 - 抽奖页 - table表 - form表单 - 上传Excel - 上传头像和裁剪 - htmlcanvas2截屏 - 封装自定义loading
- 关闭生产环境sourceMap; - 关闭预加载(vue会预加载后面的页面，会导致首屏加载比较慢) - g-zip压缩(需要nginx配置); - 生产环境CDN加载部分插件 - 去除生产环境console和debugger; - 公共代码抽离 - 打包大小分析 - 打包缓存 - 部分依赖使用异步cdn加载
- 拥有 admin、test和editor三种权限，每个权限对应的路由和左侧菜单不同； - 点击个人设置个性化或者右边设置，可以更改页面的设置，如果标签页是否开启，布局方式,主题颜色等； - 系统管理员拥有所有权限，可以更改用户对应的菜单路由和角色对应的权限。 ......
├── mock ---mock模拟数据 ├── public ---静态资源文件 ├── src │ ├── api ---接口 │ ├── assets ---图片 │ ├── components ---可复用的vue组件 │ ├── layouts ---布局方式 │ ├── router ---路由 │ ├── store ---vuex │ ├── styles ---sass样式 │ ├── utils ---方法函数 │ ├── vendor ---导出excel │ ├── views ---页面 │ ├── App.vue │ ├── main.js │ ├── permission.js ---路由拦截 ├── tests ---单元测试文件 ├── .browserslistrc ├── .env ├── .eslintrc.js ├── babel.config.js ├── .jest.config.js ---jest的配置 ├── package.json ├── package-lock.json ├── README.md └── vue.config.js ---webpack的配置
# 克隆项目 git clone https://github.com/biubiubiu01/vue-antd-admin.git # 进入项目目录 cd vue-antd-admin # 安装依赖 npm install # 本地开发 启动项目 npm run serve
# 打包项目 npm run build # 单元测试 npm run test:unit
Онлайн-демо
Этот проект ссылался на vue-element-admin и ant-design-pro и нашел много полезных методов и методов написания кода. Если вы действительно хотите улучшить свой уровень кодирования, рекомендуется посмотреть код больших ребят. Открытый исходный код — это непросто. Если вы считаете, что этот проект вам полезен, вы можете нажать звездочку. Предложения и ошибки приветствуются.
