添加前端

Yi.Vue2.x/src/store/index.js

@@ -0,0 +1,20 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import home from './modules/home'
+import user from './modules/user'
+import theme from './modules/theme'
+import loader from './modules/loader'
+import pan from './modules/pan'
+Vue.use(Vuex);
+
+//实例化
+const store = new Vuex.Store({
+    modules: {
+        home,
+        user,
+        theme,
+        loader,
+        pan
+    }
+})
+export default store

Yi.Vue2.x/src/store/modules/home.js

@@ -0,0 +1,56 @@
+const state = {
+    drawer: null,
+    drawerImage: true,
+    mini: false,
+    items: [{
+            title: 'Dashboard',
+            icon: 'mdi-view-dashboard',
+            to: '/',
+        },
+        {
+            title: 'User Profile',
+            icon: 'mdi-account',
+            to: '/components/profile/',
+        },
+        {
+            title: 'Regular Tables',
+            icon: 'mdi-clipboard-outline',
+            to: '/tables/regular/',
+        },
+        {
+            title: 'Typography',
+            icon: 'mdi-format-font',
+            to: '/components/typography/',
+        },
+        {
+            title: 'Icons',
+            icon: 'mdi-chart-bubble',
+            to: '/components/icons/',
+        },
+        {
+            title: 'Google Maps',
+            icon: 'mdi-map-marker',
+            to: '/maps/google/',
+        },
+        {
+            title: 'Notifications',
+            icon: 'mdi-bell',
+            to: '/components/notifications/',
+        },
+    ],
+}
+
+const mutations = { //变化//载荷
+    SetDrawerImage(state, drawerImage) {
+        state.drawerImage = drawerImage
+    }
+}
+
+//在action中可以配合axios进行权限判断
+const actions = { //动作
+
+}
+const getters = {}
+
+
+export default { state, mutations, actions, getters }

Yi.Vue2.x/src/store/modules/loader.js

@@ -0,0 +1,34 @@
+const state = { //状态
+    load: false
+}
+
+const mutations = { //变化//载荷
+    OPEN(state) {
+        state.load = true;
+    },
+    CLOSE(state) {
+        state.load = false;
+    },
+}
+
+//在action中可以配合axios进行权限判断
+const actions = { //动作
+    openLoad(context) {
+        context.commit('OPEN')
+    },
+    closeLoad(context) {
+        context.commit('CLOSE')
+    }
+}
+
+// const getters = { //类似与计算属性 派生属性
+//     msg(state) {
+//         if (state.count > 80) {
+//             return "成绩优异"
+//         } else {
+//             return "成绩不合格"
+//         }
+//     }
+// }
+
+export default { state, mutations, actions }

Yi.Vue2.x/src/store/modules/pan.js

@@ -0,0 +1,36 @@
+const state = {
+    basePath: "",
+    extendPath:""
+}
+
+const mutations = { //变化//载荷
+    SetExtendPath(state, extendPath) {
+        state.extendPath = extendPath
+    },
+
+    SetBasePath(state, basePath) {
+        state.basePath = basePath
+    }
+}
+
+//在action中可以配合axios进行权限判断
+const actions = { //动作
+    Set_ExtendPath(context,extendPath) {
+        context.commit('SetExtendPath',extendPath)
+    },
+    Set_BasePath(context,basePath) {
+        context.commit('SetBasePath',basePath)
+    },
+   Add_ExtendPath(context,extendPath) {
+        context.commit('SetExtendPath',context.state.extendPath+"/"+extendPath)
+    },
+}
+const getters = {
+    path: state => {
+        return state.basePath+state.extendPath;
+    }
+
+}
+
+
+export default { state, mutations, actions, getters }

Yi.Vue2.x/src/store/modules/theme.js

@@ -0,0 +1,33 @@
+import vuetify from '../../plugins/vuetify';
+const state = { //状态
+    light: {
+        primary: '#1976D2',
+        secondary: '#424242',
+        accent: '#82B1FF',
+        error: '#FF5252',
+        info: '#2196F3',
+        success: '#4CAF50',
+        warning: '#FFC107',
+        cyan: "#FAB2B1",
+        blue: "#2196F3"
+    },
+    dark: {}
+}
+
+const mutations = { //变化//载荷
+    SET_Light(state, n) {
+        state.light = n
+        vuetify.framework.theme.themes.light = n
+    },
+}
+
+//在action中可以配合axios进行权限判断
+const actions = { //动作
+    set_light(context, n) {
+        context.commit('SET_Light', n)
+    },
+
+}
+
+
+export default { state, mutations, actions }

Yi.Vue2.x/src/store/modules/user.js

@@ -0,0 +1,153 @@
+import { getToken, setToken, getUser, setUser, removeToken } from '../../util/usertoken'
+import accountApi from "@/api/accountApi"
+
+//再导入axion请求
+const state = { //状态
+    token: getToken(),
+    user: getUser(),
+    dark: false,
+    drawer: {
+        image: 0,
+        gradient: 1,
+        mini: false,
+    },
+    gradients: [
+        'rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)',
+        'rgba(228, 226, 226, 1), rgba(255, 255, 255, 0.7)',
+        'rgba(244, 67, 54, .8), rgba(244, 67, 54, .8)',
+    ],
+    images: [
+        'https://s1.ax1x.com/2022/03/26/qdNnbD.jpg',
+        'https://s1.ax1x.com/2022/03/26/qdNMUH.jpg',
+        'https://s1.ax1x.com/2022/03/26/qdNKVe.jpg',
+      'https://s1.ax1x.com/2022/03/26/qdNmDO.jpg'
+    ],
+    notifications: [],
+    rtl: false
+}
+
+const mutations = { //变化//载荷
+    SET_TOKEN(state, token) {
+        state.token = token
+        setToken(token)
+    },
+    SET_USER(state, user) {
+        state.user = user
+        setUser(user)
+    },
+    SetGradient(state, gradient) {
+        state.drawer.gradient = gradient
+    },
+    SetImage(state, image) {
+        state.drawer.image = image
+    }
+}
+
+//在action中可以配合axios进行权限判断
+const actions = { //动作
+    setIcon({ commit, state }, icon) {
+        state.user.icon = icon
+        commit('SET_USER', state.user)
+    },
+    // qqUpdate({ state }, openid) {
+    //     return new Promise((resolv, reject) => {
+    //         qqApi.qqupdate(openid, state.user.id).then(resp => {
+    //             resolv(resp)
+    //         }).catch(error => {
+    //             reject(error)
+    //         })
+    //     })
+    // },
+
+    // qqLogin({ commit }, openid) {
+    //     return new Promise((resolv, reject) => {
+    //         qqApi.qqlogin(openid).then(resp => {
+    //             if (resp.status) {
+    //                 commit('SET_TOKEN', resp.data.token)
+    //                 commit('SET_USER', resp.data.user)
+    //             }
+    //             resolv(resp)
+    //         }).catch(error => {
+    //             reject(error)
+    //         })
+    //     })
+    // },
+
+    Login({ commit }, form) {
+        return new Promise((resolv, reject) => {
+            accountApi.login(form.username.trim(), form.password.trim()).then(resp => {
+                if (resp.status) {
+                    commit('SET_TOKEN', resp.data.token)
+                    commit('SET_USER', resp.data.user)
+                }
+                resolv(resp)
+            }).catch(error => {
+                reject(error)
+            })
+        })
+    },
+
+
+
+    Register({ commit }, form) {
+        return new Promise((resolv, reject) => {
+            accountApi.register(form.username.trim(), form.password.trim(), form.email.trim(), form.code.trim()).then(resp => {
+                resolv(resp)
+            }).catch(error => {
+                reject(error)
+            })
+        })
+    },
+    Logged({ commit }) {
+        return new Promise((resolv, reject) => {
+            accountApi.logged().then(resp => {
+                resolv(resp)
+            }).catch(error => {
+                reject(error)
+            })
+        })
+    },
+
+    // GetUserInfo({ commit, state }) {
+    //     return new Promise((resolv, reject) => {
+    //         // getUserInfo(state.token).then(response => {
+    //         //     commit('SET_USER', response.data)
+    //         // resolve(response)
+    //         // }).catch(error=>{
+    //         //     reject(error)
+    //         // })
+    //     })
+    // },
+    Logout({ commit, state }) {
+        return new Promise((resolv, reject) => {
+            accountApi.logout().then(response => {
+                commit('SET_TOKEN', '')
+                commit('SET_USER', null)
+                removeToken()
+                resolv(response)
+            }).catch(error => {
+                reject(error)
+            })
+        })
+    }
+
+}
+
+const getters = { //类似与计算属性 派生属性
+    dark: (state, getters) => {
+        return (
+            state.dark ||
+            getters.gradient.indexOf('255, 255, 255') === -1
+        )
+    },
+    gradient: state => {
+        return state.gradients[state.drawer.gradient]
+    },
+    image: state => {
+        return state.drawer.image === '' ? state.drawer.image : state.images[state.drawer.image]
+    }
+}
+
+
+
+export default { state, mutations, actions, getters }