الصفحة الرئيسية>PHP كود المصدر>فئات أخرى
تنزيل

مقدمة

نقطة البداية لهذا المشروع هي تخصيص الاحتياجات الفعلية لإدارة المخزون للأصدقاء، وهو أيضًا أول مشروع تدريبي لـ Vue2 لممارسة هندسة تطوير الواجهة الأمامية بشكل أفضل.

ويرجع ذلك أيضًا إلى أن هذا المشروع تم تخصيصه بناءً على الاحتياجات الحقيقية، لذا فإن هذا المشروع يتوافق أيضًا مع مشروع خلفي (سيتم إدراج بوابة المشروع أدناه)، والذي أكملته شخصيًا في إطار عمل Node Express ، وتستخدم قاعدة البيانات Mysql . بالنسبة لأولئك الذين يدرسون مشروع الواجهة الأمامية هذا فقط، يستخدم المشروع خادمًا خلفيًا بعيدًا بشكل افتراضي، ويتم وضع بوابة مستند الواجهة أدناه (استنادًا إلى وثائق ApiFox عبر الإنترنت). بالنسبة للشركاء الذين يرغبون في استخدام خدمات الواجهة الخلفية المحلية، يمكنك الرجوع إلى مشروع الواجهة الخلفية.

يستخدم هذا المشروع بشكل أساسي مجموعات Vue و Vuex و Vue-router . تستخدم واجهة المستخدم Element-Ui ، وتستخدم أداة الإنشاء Vue-cli . بالطبع، هناك أيضًا مشاريع مبنية على webpack. إذا كنت تريد معرفة المزيد، يمكنك التبديل إلى فرع Webpack للحصول على التكوين المحدد، يرجى الاطلاع على README الموجود ضمن فرع Webpack .

سيتم الحفاظ على هذا المشروع لفترة طويلة. إذا كانت لديك أي أسئلة، فيرجى طرحها مباشرة في قسم "القضايا". إذا وجدت مشكلة وكان لديك حل جيد، فنحن نرحب بالعلاقات العامة.

ملاحظة: يوفر الخادم البعيد الاختبار فقط، ولا تفرض الواجهة الخلفية الكثير من القيود والتصفية والفحص

؟منفذ

  • عنوان العرض التوضيحي للمشروع عبر الإنترنت؟ انقر فوقي بقوة (كلمة مرور الحساب الافتراضية هي الجذر، الجذر، يتم إعادة تسجيل اسم المجال، الوصول إلى IP ممتلئ قليلاً، وسيكون التحميل البطيء بطيئًا جدًا ~)

  • هل يوفر المشروع عنوان مستند الواجهة البعيدة؟

  • هل تريد مطابقة عنوان مشروع الواجهة الخلفية؟

?كومة التكنولوجيا

تكنولوجيا يوضح إصدار الموقع الرسمي
فيو إطار جافا سكريبت التقدمي https://vuejs.org/
جهاز التوجيه إدارة الطريق https://router.vuejs.org/
فويكس إدارة الدولة العالمية https://vuex.vuejs.org/
عنصر واجهة المستخدم إطار واجهة المستخدم 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، ذاكرة التخزين المؤقت للمكونات، ذاكرة التخزين المؤقت للسجل العالمي
  • قم بإنشاء المسارات وأشرطة التنقل ديناميكيًا اعتمادًا على أذونات المستخدم
  • تخطيط سريع الاستجابة
  • ✅ تحسين التغليف (يتوفر فرع webpack)
  • يتبع...

وظيفة العمل

  • تصور البيانات

    • ✅نظرة عامة على المعلومات الأساسية
    • ✅تحليل فئة المخزون
    • ✅ إحصائيات المبيعات والتكاليف والأرباح
    • ✅ إحصائيات الطلب كاملة

  • مستودع

    • ✅إضافة إلى المخزون
    • ✅الاستعلام عن شروط سجل التخزين

  • خارج المستودع

    • ✅إضافة مكتبة خارجية
    • ✅الاستعلام عن شروط سجل التسليم
    • ✅تغيير حالة التسليم

  • إدارة العملاء

    • ✅إضافة عميل
    • ✅تعديل العميل

  • إدارة المستخدم

    • التحكم في الأذونات
    • تعديل المعلومات

تشغيل المشروع

1️⃣سحب ملفات المشروع

استنساخ بوابة 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
يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل