vue admin spa
2.1正式版
حزمة التكنولوجيا المستخدمة: vue + vue-resource + vue-router + vuex (ضروري للمنتجع الصحي) + element-ui + ES6 + webpack + npm
عنوان الاختبار (إذا تعذر فتحه، حاول تغيير DNS إلى 114.114.114.114)
تم بناء هذا المشروع بالاعتماد على سقالات vue وثلاثة مشاريع (التعلم من نقاط قوة بعضنا البعض)، ويتم تحسينه باستمرار. والغرض من ذلك هو أن يكون أقرب إلى احتياجات المشروع للجميع ومناسبًا لها، وأكثر ملاءمة للتطوير الثانوي تم إعادة كتابتها:
تسجيل الدخول والتسجيل (بما في ذلك تشفير MD5)
التحكم في الأذونات، يتم عرض القائمة وإخفائها بناءً على بيانات الأذونات التي يتم إرجاعها من واجهة المستخدم. إذا قمت بالنقر فوق شريط العناوين يدويًا، فسوف ينتقل إلى 404 (شريط عنوان خاطئ) أو 401 (شريط العناوين الصحيح ولكن بدون إذن)، ويمكن تعديل الأذونات ديناميكيًا في إعدادات النظام.
قم بتبديل السمات، ودعم المستخدمين بشكل كامل لتبديل السمات يدويًا وتذكر السمات
تتم محاكاة جميع البيانات محليًا في json. يحتاج المطورون الثانويون فقط إلى استبدال مسار json بمسار الواجهة الفعلي. حتى المبتدئين يمكنهم التعامل بسهولة مع نظام إدارة الواجهة الخلفية.
لقد قامت جميع عناصر النقر على الزر التي يتم تشغيلها ديناميكيًا بطباعة المعلمات ذات الصلة على وحدة التحكم أثناء التطوير الفعلي، ويمكن إرسال هذه المعلمات إلى الواجهة الخلفية حسب الحاجة.
تمت إضافة وحدة طلابية جديدة باستخدام واجهة API الحقيقية المحلية.
تمت إضافة وحدة جديدة لإدارة المؤسسة، باستخدام واجهة mockjs وإرفاق منطق js الحقيقي المطور (بما في ذلك واجهة التحقق والإرسال، وما إلى ذلك) أثناء التطوير الفعلي، ما عليك سوى استعادة الكود المنطقي الحقيقي.
**إذا كان لديك أي أسئلة يمكنك طرحها للإصدار أو الانضمام إلى المجموعة للمناقشة.
إذا كنت تعتقد أن هذا المشروع مفيد لك، فتذكر النقر على النجمة في الجزء العلوي الأيمن ^_^
# 克隆代码
git clone https://github.com/lss5270/vue-admin-spa.git
# 安装依赖
npm install
# or 直接解压node_modules.7z到当前位置 （比较适合新手）。
# 本地开发 开启服务
npm run dev
# or 直接双击start.bat（比较适合新手） الوصول إلى المتصفح http://localhost:2018
# 构建生产环境
npm run build:prod
# or 直接双击build.bat（比较适合新手） # nginx环境下运行
1.准备nginx环境，自行到nginx官网（https://nginx.org/）下载，并解压
2.双击build.bat后根目录生成一个dist包，把dist整个文件夹拷贝到nginx解压后的html下
3.启动nginx服务：双击nginx.exe
4.访问入口：http://localhost/dist/index.html
………
8.关闭nginx服务：直接删进程
# tomcat环境下运行
参照nginx步骤即可 本项目使用了两套图标系统，具体使用方法参照以下官方链接:
1.http://element.eleme.io/#/zh-CN/component/icon
2.http://fontawesome.io/icons/
使用方法：
a.在index.html中引入<link href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
b.在使用图标的地方放置图标<i class="fa fa-home" aria-hidden="true"></i>
由于bootstrap不支持mvvm已弃用，本项目使用了全新的elementUI系统，具体使用方法参照以下官方链接:
1.http://element.eleme.io/#/zh-CN/component/installation
具体修复方法，参照Issues中的 #6问题
1.学生模块功能使用了本地api接口，若想正常运行，请下载另外一个node项目（https://github.com/lss5270/vue-admin-spa-api），并且在本地启动该node 项目。
2.该node项目源码，相当于其他后端语言（例如java）提供增删查改接口的源代码。
3.不懂如何使用node项目的同学，可进群讨论
├── build // 构建相关
├── config // 配置相关
├── src // 源代码
│ ├── assets // 主题 字体等静态资源
│ ├── components // 全局公用组件。不直接显示
│ ├── global // 全局指令
│ ├── filtres // 全局filter
│ ├── router // 路由
│ ├── store // 全局store管理
│ ├── utils // 全局公用方法
│ ├── view // view视图层
│ ├── App.vue // 入口页面
│ └── main.js // 入口 加载组件 初始化等
├── static // 第三方不打包资源
│ ├── jquery
│ ├── Tinymce // 富文本
│ ├── dataJson // 模拟接口json
│ └── theme // 主题文件
├── .babelrc // babel-loader 配置
├── eslintrc.js // eslint 配置项
├── .gitignore // git 忽略项
├── favicon.ico // favicon图标
├── index.html // html模板
└── package.json // package.json
حاليًا، يتم تخزين معلومات المستخدم وأذونات القائمة والحالة المتعلقة بتكوين التطبيق فقط عالميًا باستخدام vuex، وتتم إدارة البيانات الأخرى بواسطة كل مكون عمل.
معهد ماساتشوستس للتكنولوجيا
حقوق الطبع والنشر (ج) 2017 إلى الوقت الحاضر، LSS
