├── .gitignore ├── README.md ├── babel.config.js ├── package-lock.json ├── package.json ├── public ├── favicon.ico └── index.html ├── src ├── App.vue ├── assets │ ├── logo.png │ ├── weapon1.png │ └── weapon2.png ├── components │ └── HelloWorld.vue ├── main.js ├── plugins │ ├── axios.js │ └── element.js ├── router │ └── index.js ├── store │ └── index.js └── views │ ├── About.vue │ ├── ErrorPage.vue │ ├── Help.vue │ ├── Home.vue │ ├── Index.vue │ ├── Jewelry.vue │ └── Weapon.vue └── vue.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | # local env files 6 | .env.local 7 | .env.*.local 8 | 9 | # Log files 10 | npm-debug.log* 11 | yarn-debug.log* 12 | yarn-error.log* 13 | pnpm-debug.log* 14 | 15 | # Editor directories and files 16 | .idea 17 | .vscode 18 | *.suo 19 | *.ntvs* 20 | *.njsproj 21 | *.sln 22 | *.sw? 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # 冒险岛卷轴组合计算网站前端 2 | 3 | ##使用到的技术 4 | ### 前端 5 | 1. Vue; 6 | 2. Element UI。 7 | ### 后端 8 | 1. Spring Boot； 9 | 2. Redis做集群部署； 10 | 3. RabbitMQ将卷轴全选时的长时间操作同步转异步处理； 11 | 4. MyBatis数据持久化； 12 | 5. MySQL数据库； 13 | 6. Dubbo + Zookeeper实现RPC调度和服务拆分； 14 | 7. 基于Docker容器部署； 15 | 8. Nginx负载均衡。 16 | 17 | ##网站 18 | http://175.24.121.53:8080/mxd/ 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | '@vue/cli-plugin-babel/preset' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "scroll-vue", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "serve": "vue-cli-service serve", 7 | "build": "vue-cli-service build" 8 | }, 9 | "dependencies": { 10 | "core-js": "^3.6.5", 11 | "element-ui": "^2.4.5", 12 | "vue": "^2.6.11", 13 | "vue-router": "^3.2.0", 14 | "vuex": "^3.4.0" 15 | }, 16 | "devDependencies": { 17 | "@vue/cli-plugin-babel": "~4.4.0", 18 | "@vue/cli-plugin-router": "~4.4.0", 19 | "@vue/cli-plugin-vuex": "~4.4.0", 20 | "@vue/cli-service": "~4.4.0", 21 | "axios": "^0.18.0", 22 | "vue-cli-plugin-axios": "0.0.4", 23 | "vue-cli-plugin-element": "^1.0.1", 24 | "vue-template-compiler": "^2.6.11" 25 | }, 26 | "browserslist": [ 27 | "> 1%", 28 | "last 2 versions", 29 | "not dead" 30 | ] 31 | } 32 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fubicheng208/mxd-scroll-V2-vue/939804ebefb3c412e46fae29cd5630e551b3a50e/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <%= htmlWebpackPlugin.options.title %> 9 | 10 | 11 | 14 |
15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 21 | 22 | 33 | 34 | 37 | 38 | -------------------------------------------------------------------------------- /src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fubicheng208/mxd-scroll-V2-vue/939804ebefb3c412e46fae29cd5630e551b3a50e/src/assets/logo.png -------------------------------------------------------------------------------- /src/assets/weapon1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fubicheng208/mxd-scroll-V2-vue/939804ebefb3c412e46fae29cd5630e551b3a50e/src/assets/weapon1.png -------------------------------------------------------------------------------- /src/assets/weapon2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/fubicheng208/mxd-scroll-V2-vue/939804ebefb3c412e46fae29cd5630e551b3a50e/src/assets/weapon2.png -------------------------------------------------------------------------------- /src/components/HelloWorld.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 42 | 43 | 44 | 60 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import './plugins/axios' 3 | import App from './App.vue' 4 | import router from './router' 5 | import store from './store' 6 | import './plugins/element.js' 7 | 8 | Vue.config.productionTip = false 9 | 10 | new Vue({ 11 | router, 12 | store, 13 | render: h => h(App) 14 | }).$mount('#app') 15 | -------------------------------------------------------------------------------- /src/plugins/axios.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | 3 | import Vue from 'vue'; 4 | import axios from "axios"; 5 | 6 | // Full config: https://github.com/axios/axios#request-config 7 | // axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || ''; 8 | // axios.defaults.headers.common['Authorization'] = AUTH_TOKEN; 9 | // axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 10 | 11 | let config = { 12 | // baseURL: process.env.baseURL || process.env.apiUrl || "" 13 | // timeout: 60 * 1000, // Timeout 14 | // withCredentials: true, // Check cross-site Access-Control 15 | }; 16 | 17 | const _axios = axios.create(config); 18 | 19 | _axios.interceptors.request.use( 20 | function(config) { 21 | // Do something before request is sent 22 | return config; 23 | }, 24 | function(error) { 25 | // Do something with request error 26 | return Promise.reject(error); 27 | } 28 | ); 29 | 30 | // Add a response interceptor 31 | _axios.interceptors.response.use( 32 | function(response) { 33 | // Do something with response data 34 | return response; 35 | }, 36 | function(error) { 37 | // Do something with response error 38 | return Promise.reject(error); 39 | } 40 | ); 41 | 42 | Plugin.install = function(Vue, options) { 43 | Vue.axios = _axios; 44 | window.axios = _axios; 45 | Object.defineProperties(Vue.prototype, { 46 | axios: { 47 | get() { 48 | return _axios; 49 | } 50 | }, 51 | $axios: { 52 | get() { 53 | return _axios; 54 | } 55 | }, 56 | }); 57 | }; 58 | 59 | Vue.use(Plugin) 60 | 61 | export default Plugin; 62 | -------------------------------------------------------------------------------- /src/plugins/element.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Element from 'element-ui' 3 | import 'element-ui/lib/theme-chalk/index.css' 4 | 5 | Vue.use(Element) 6 | -------------------------------------------------------------------------------- /src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import VueRouter from 'vue-router' 3 | import Home from '../views/Home.vue' 4 | import Weapon from "../views/Weapon"; 5 | import Jewelry from "../views/Jewelry"; 6 | import ErrorPage from "../views/ErrorPage"; 7 | import Index from "../views/Index"; 8 | import Help from "../views/Help" 9 | 10 | Vue.use(VueRouter) 11 | 12 | const routes = [ 13 | { 14 | show: true, 15 | path: '/', 16 | name: '卷轴计算', 17 | component: Index, 18 | redirect: "/weapon", 19 | children: [ 20 | { 21 | path: "/weapon", 22 | name: "武器卷轴计算", 23 | component: Weapon 24 | }, 25 | { 26 | path: "/jewelry", 27 | name: "饰品卷轴计算", 28 | component: Jewelry 29 | } 30 | ] 31 | }, 32 | { 33 | show: true, 34 | path: '/other', 35 | name: '其他', 36 | component: Index, 37 | redirect: "/help", 38 | children: [ 39 | { 40 | path: "/help", 41 | name: "帮助及示例", 42 | component: Help 43 | } 44 | ] 45 | } 46 | ] 47 | 48 | const router = new VueRouter({ 49 | mode: 'history', 50 | base: process.env.BASE_URL, 51 | routes 52 | }) 53 | 54 | export default router 55 | -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | export default new Vuex.Store({ 7 | state: { 8 | }, 9 | mutations: { 10 | }, 11 | actions: { 12 | }, 13 | modules: { 14 | } 15 | }) 16 | -------------------------------------------------------------------------------- /src/views/About.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /src/views/ErrorPage.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 10 | 11 | -------------------------------------------------------------------------------- /src/views/Help.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 28 | 29 | -------------------------------------------------------------------------------- /src/views/Home.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 19 | -------------------------------------------------------------------------------- /src/views/Index.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 10 | 11 | -------------------------------------------------------------------------------- /src/views/Jewelry.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 10 | 11 | -------------------------------------------------------------------------------- /src/views/Weapon.vue: -------------------------------------------------------------------------------- 1 | 59 | -------------------------------------------------------------------------------- /vue.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | publicPath: process.env.NODE_ENV === 'production' 3 | ? '/mxd/' 4 | : '/' 5 | } --------------------------------------------------------------------------------