wms client

Предисловие

Отправной точкой этого проекта является настройка фактических потребностей друзей в управлении запасами. Для меня это также первый практический проект для Vue2 , позволяющий лучше практиковать разработку интерфейсной части.

Это также потому, что этот проект настроен на основе реальных потребностей, поэтому этот проект также соответствует серверному проекту (портал проекта будет указан ниже), который также был завершен мной лично. Серверный проект построен на основе. в среде Node Express , а база данных использует Mysql . Для тех, кто только изучает этот фронтенд-проект, в проекте по умолчанию используется удаленный серверный сервер, а портал документов интерфейса расположен ниже (на основе онлайн-документации ApiFox). Партнеры, желающие использовать локальные серверные службы, могут обратиться к серверному проекту.

В этом проекте в основном используются сегменты семейства Vue , Vuex и Vue-router . Пользовательский интерфейс использует Element-Ui , а инструмент сборки — Vue-cli . Конечно, существуют также проекты, созданные на основе Webpack. Если вы хотите узнать больше, вы можете переключиться на ветку Webpack . Для получения конкретной конфигурации см. README в ветке Webpack .

Этот проект будет поддерживаться в течение длительного времени. Если у вас есть какие-либо вопросы, задавайте их непосредственно в разделе «Проблемы». Если вы обнаружите проблему и найдете хорошее решение, пиар приветствуется.

PS: Удаленный сервер обеспечивает только тестирование, а бэкенд не делает слишком много ограничений, фильтрации и проверок. Все играют легко, но сервер выходит из строя, и мне приходится перезапускать его вручную. Это очень хлопотно~.

?Портал

• Демонстрационный адрес проекта в Интернете? Нажмите меня сильно (пароль учетной записи по умолчанию — root, root, доменное имя перерегистрируется, IP-доступ немного заполнен, а отложенная загрузка будет очень медленной~)

• Проект предоставляет адрес документа удаленного интерфейса? Нажмите на меня сильнее?

• Соответствует адрес внутреннего проекта? Нажмите на меня сильнее?

?Стек технологий

технология	иллюстрировать	Версия	Официальный сайт
Вю	Прогрессивная среда JavaScript		?https://vuejs.org/
Vue-роутер	Управление маршрутами		?https://router.vuejs.org/
Вуэкс	Глобальное государственное управление		?https://vuex.vuejs.org/
Элемент-UI	Фреймворк пользовательского интерфейса		?https://element.eleme.io
Аксиос	Библиотека сетевых запросов на основе обещаний		?https://www.axios-http.cn/
Электронные диаграммы	Библиотека визуальных диаграмм		?https://echarts.apache.org/
Меньше	Язык расширения CSS с обратной совместимостью.		?https://less.bootcss.com/

Среда разработки: Windows, Node(v16.18.0), Npm(v8.19.2).

?Введение функции

Технические функции

• ✅Ленивая загрузка маршрутов
• ✅Контроль разрешений (токен)
• ✅Отображение визуализации данных
• ✅На базе запроса Axios контроль перехвата ответов и единое управление запросами
• ✅Унифицированное управление многоразовыми и сложными данными о состоянии на основе Vuex.
• ✅Bagcrumbs, кеш компонентов, глобальный кеш записей
• Динамическое создание маршрутов и панелей навигации в зависимости от разрешений пользователя.
• Адаптивный макет
• ✅Оптимизация упаковки (предоставляется ветка веб-пакета)
• Продолжение следует...

бизнес-функция

• визуализация данных

  • ✅Обзор основной информации
  • ✅Анализ категорий запасов
  • ✅Статистика продаж, затрат и прибыли
  • ✅ Полная статистика заказов

• Склад

  • ✅Добавить в инвентарь
  • ✅Запрос об условиях хранения

• вне склада

  • ✅Добавить исходящую библиотеку
  • ✅Запрос об условиях записи доставки
  • ✅Изменить статус доставки

• Управление клиентами

  • ✅Добавить клиента
  • ✅Редактировать клиента

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

  • Контроль разрешений
  • Изменение информации

Запустить проект

1️⃣Извлеките файлы проекта

git-клон https://github.com/Hyrmm/wms-client

2️⃣Перейдите в каталог проекта

компакт-диск WMS-клиента

3️⃣Установить пакеты зависимостей

установка npm

4️⃣Запустите проект

• Используйте удаленный интерфейс онлайн-серверной службы.

  npm запустить подачу

• Чтобы использовать интерфейс локального серверного сервиса, вам необходимо сотрудничать с порталом серверного проекта.

  npm запускать локально

?Бизнес-шоу

Структура проекта

 ├── src
│   ├── App.vue
│   ├── api
│   ├── assets
│   ├── components
│   │   ├── AgentFail
│   │   ├── Breadcrumb
│   │   ├── PagiNation
│   │   ├── TableFilter
│   │   └── ViewFilter
│   ├── main.js
│   ├── mixin
│   ├── pages
│   │   ├── home
│   │   └── login
│   ├── router
│   ├── store
│   ├── utils
│   └── view
│       ├── Client
│       │   ├── Add
│       │   ├── Modify
│       │   └── index.vue
│       ├── Setting
│       ├── Store
│       ├── StoreIn
│       │   ├── Add
│       │   ├── Recording
│       │   └── index.vue
│       ├── StoreOut
│       │   ├── Add
│       │   ├── Modify
│       │   ├── Recording
│       │   └── index.vue
│       └── index
│       │   ├── Order.vue
│       │   ├── Recording
│       │   └── index.vue
│       ├── StoreOut
│       │   ├── Add
│       │   ├── Modify
│       │   ├── Recording
│       │   └── index.vue
│       └── index
│           ├── Order.vue
│           ├── Sales.vue
│           ├── Store.vue
│           └── index.vue
├── jsconfig.json
├── package-lock.json
├── package.json