vue2 + vuex + vue-router + webpack + ES6/7 + axios + elementUI + иконки от Iconfont от Alibaba
http://nmgwap.gitee.io/vueproject/#/login
Этот проект предназначен для изучения того, как создается проект панели управления backend с использованием vue2.
Для удобства последующего изменения данных в проекте, данные моделируются внутри страниц, подробнее см. ниже [Упор].
Если вам помогает этот проект, вы можете нажать кнопку "Star" в правом верхнем углу, спасибо! ^_^
Или вы можете подписаться на меня, я буду продолжать открывать больше интересных проектов.
Окружение разработки Windows 7, Google Chrome 61.
Если у вас есть вопросы, пожалуйста, сообщите об этом в разделе Issues, либо если вы нашли проблему и знаете хорошее решение, приветствуем ваш Pull Request 👍
------------------------```bash ├── /build/ # Конфигурация сборки проекта (webpack) ├── /config/ # Конфигурация окружения разработки ├── /src/ # Исходный код │ ├── /api/ # Запросы │ ├── /assets/ # Статические ресурсы компонентов (изображения) │ ├── /components/ # Общие компоненты │ ├── /api/ # Конфигурация запросов API │ ├── /router/ # Конфигурация маршрутов │ ├── /vuex/ # Управление состоянием Vuex │ ├── /views/ # Компоненты маршрутов (страницы) │ ├── /config/ # Конфигурационные файлы (адреса запросов) │ ├── App.vue # Входной компонент │ └── main.js # Входная точка программы ├── /static/ # Нестатические ресурсы ├── .babelrc # Конфигурация компиляции ES6 ├── .editorconfig # Определение формата кода ├── .eslintignore # Файлы, игнорируемые при проверке ES6 ├── .eslintrc.js # Конфигурация нормативов ES6 ├── .gitignore # Файлы, игнорируемые Git ├── index.html # Входная страница ├── package.json # Зависимости проекта └── README.md # Документация проекта
```bash
// Начало тестовых данных
let res = {
code: 0,
msg: null,
count: 12,
data: [
{
addUser: '1',
editUser: '1',
addTime: null,
editTime: 1527411068000,
userId: 1,
systemNo: 'pmd',
userName: 'root',
userPassword: 'e10adc3949ba59abbe56e057f20f883e',
userRealName: 'Суперпользователь',
userSex: 'Ж',
userMobile: '13812345678',
userEmail: '111@qq.com',
isLock: 'Н',
deptId: 1,
deptName: 'xxxx',
roleId: 1
}
]
}
this.loading = false
this.userData = res.data
// Присвоение значений для пагинации
this.pageparm.currentPage = this.formInline.page
this.pageparm.pageSize = this.formInline.limit
this.pageparm.total = res.count
// Конец тестовых данных
/**
* Вызов API, закомментируйте верхнюю часть с тестовыми данными и раскомментируйте нижнюю.
*/
// Получение списка пользователей
// userList(параметры).then((res) => {
// this.loading = false;
// if (!res.success) {
// this.$message({
// type: 'info',
// message: res.msg,
// });
// } else {
// this.userData = res.data;
// // Присвоение значений для пагинации
// this.pageparm.currentPage = this.formInline.page;
// this.pageparm.pageSize = this.formInline.limit;
// this.pageparm.total = res.count;
// }
// });
Пожалуйста, закомментируйте тестовые данные от начала до конца, а затем раскомментируйте нижнюю часть.
Для изменения адреса API в файле config/index.js
используйте следующие команды:```bash
proxyTable: {
'/api': {
target: 'http://ваш_адрес:порт', // Address of your server
changeOrigin: true, // Create a local proxy server to solve the CORS problem
pathRewrite: { // Rewrite the request path
'^/api': '/api' // Replace the request address
},
},
},
- [x] Логин — завершено
- [x] Интерцептор маршрутов — завершено
- [x] Управление продуктами (добавление, редактирование, поиск, удаление) — завершено
- [x] Управление ролями (добавление, редактирование, поиск, удаление, управление правами доступа) — завершено
- [x] Управление заказами (добавление, редактирование, поиск, удаление) — завершено
- [x] Управление пользователями (добавление, редактирование, поиск, удаление, права данных, очистка кэша) — завершено
- [x] Настройка платежа (добавление, редактирование, поиск, удаление) — завершено
- [x] Управление системными переменными окружения (добавление, редактирование, поиск, удаление) — завершено
- [x] Управление правами доступа (добавление, редактирование, поиск, удаление, настройка прав доступа) — завершено
- [x] Управление меню (добавление, редактирование, поиск, удаление) — завершено
- [x] Управление компанией (добавление, редактирование, поиск, удаление) — завершено
### Частичные скриншоты
------------------------
Управление продуктами

Управление ролями

Управление заказами

```markdown

```Управление пользователями

Настройка платежей

Раскрытие и сворачивание

#### Запуск проекта
------------------------
```bash
# установите зависимости
npm install
# запустите с горячими перезагрузками на localhost:8080
npm run dev
# создайте сборку для продакшена с минификацией
npm run build
# создайте сборку для продакшена и просмотрите отчет анализатора пакетов
npm run build --report
# запустите юнит-тесты
npm run unit
# запустите end-to-end тесты
npm run e2e
# запустите все тесты
npm test
GitLab адрес: https://gitee.com/ldhblog/vue-element.git
GitHub адрес: https://github.com/nmgwap/vue-ManagementPlatform.git
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )