ソースを参照

Merge branch 'master' of http://git.ycjcjy.com/honghe/h5-draw-lots

Baozhangchao 3 年 前
コミット
aceae5bf3b
共有8 個のファイルを変更した121 個の追加12 個の削除を含む
  1. 1
    2
      src/main.js
  2. 19
    1
      src/pages/Honghe.vue
  3. 22
    6
      src/router/index.js
  4. 11
    0
      src/services/person.js
  5. 28
    0
      src/store/createStore.js
  6. 19
    0
      src/store/index.js
  7. 11
    3
      src/utils/request.js
  8. 10
    0
      src/utils/token.js

+ 1
- 2
src/main.js ファイルの表示

@@ -8,8 +8,7 @@ redirect()
8 8
 
9 9
 Vue.config.productionTip = false
10 10
 
11
-new Vue({
11
+const app = new Vue({
12 12
   router,
13
-
14 13
   render: h => h(App),
15 14
 }).$mount('#app')

+ 19
- 1
src/pages/Honghe.vue ファイルの表示

@@ -23,7 +23,7 @@
23 23
 </template>
24 24
 
25 25
 <script>
26
-// const indexJPG = new Array(12).fill(0)
26
+import { useModel } from '@/store'
27 27
 
28 28
 export default {
29 29
   name: 'Honghe',
@@ -36,6 +36,24 @@ export default {
36 36
       showPopup: false
37 37
     }
38 38
   },
39
+  computed: {
40
+    person: {
41
+      get () {
42
+        return useModel('person')[0]
43
+      },
44
+      set (val) {
45
+        useModel('person')[1](val)
46
+      }
47
+    }
48
+  },
49
+  watch: {
50
+    person: {
51
+      handler(val) {
52
+        console.log('-----watch---person----', val)
53
+      },
54
+      immediate: true
55
+    }
56
+  },
39 57
   methods: {
40 58
     //关闭
41 59
     cancelFrom() {

+ 22
- 6
src/router/index.js ファイルの表示

@@ -4,13 +4,14 @@ import Vue from 'vue'
4 4
 import Router from 'vue-router'
5 5
 import Honghe from '../pages/Honghe.vue'
6 6
 import SaveShare from '../pages/SaveShare.vue'
7
-// import Login from '@/Login.vue'
7
+import { useModel } from '../store'
8
+import { getOpenId } from '../utils/wx'
9
+import { login } from '../services/person'
10
+import { setToken } from '../utils/token'
8 11
 
9 12
 Vue.use(Router)
10 13
 
11
-export default new Router({
12
-
13
-
14
+const router = new Router({
14 15
   routes: [
15 16
 
16 17
     //面页
@@ -26,11 +27,26 @@ export default new Router({
26 27
       component: SaveShare,
27 28
 
28 29
     },
30
+  ]
31
+})
29 32
 
33
+router.beforeEach((to, from, next) => {
30 34
 
35
+  const [person, setPerson] = useModel('person')
31 36
 
37
+  // 未登录
38
+  if (!person.personId) {
39
+    getOpenId().then(openid => {
40
+      login(openid).then(res => {
41
+        const { user, token } = res;
42
+        setPerson(user)
43
+        setToken(token)
44
+      })
45
+    })
46
+  }
32 47
 
33
-
34
-  ]
48
+  // 未登录的正常进行页面加载, 不需要进行页面控制
49
+  next()
35 50
 })
36 51
 
52
+export default router;

+ 11
- 0
src/services/person.js ファイルの表示

@@ -2,6 +2,17 @@
2 2
 import request from "../utils/request";
3 3
 import { baseURL } from "../utils/request";
4 4
 
5
+
6
+/**
7
+ * 登录
8
+ * @param {*} person 
9
+ * @returns 
10
+ */
11
+export function login(openid) {
12
+  const url = `${baseURL}/login`
13
+  return request(url, { method: 'POST', body: JSON.stringify({ openid }) })
14
+}
15
+
5 16
 /**
6 17
  * 更新人员信息
7 18
  * @param {*} person 

+ 28
- 0
src/store/createStore.js ファイルの表示

@@ -0,0 +1,28 @@
1
+/**
2
+ * 简易版 store 实现
3
+ */
4
+
5
+import Vue from "vue";
6
+
7
+/**
8
+  * 构建 store, 所有 model 只能通过 initailStates 传递
9
+  * @param {*} initailStates 
10
+  */
11
+export default function createStore(initailStates = {}) {
12
+  const store = new Vue({
13
+    data: { $$state: initailStates }
14
+  })
15
+
16
+  function getState(modelName) {
17
+    return store._data.$$state[modelName]
18
+  }
19
+
20
+  function updateState(modelName, payload) {
21
+    Vue.set(store._data.$$state, modelName, payload)
22
+  }
23
+
24
+  return {
25
+    getState,
26
+    updateState
27
+  }
28
+}

+ 19
- 0
src/store/index.js ファイルの表示

@@ -0,0 +1,19 @@
1
+
2
+import createStore from "./createStore"
3
+
4
+const models = {
5
+  person: {}
6
+}
7
+
8
+const store = createStore(models)
9
+
10
+export default store;
11
+
12
+export function useModel(modelName) {
13
+  const state = store.getState(modelName)
14
+  const update = (value) => {
15
+    store.updateState(modelName, value)
16
+  }
17
+
18
+  return [state, update]
19
+}

+ 11
- 3
src/utils/request.js ファイルの表示

@@ -1,6 +1,14 @@
1 1
 
2
+import { getToken } from './token'
3
+
2 4
 export default function request (url, options) {
3
-  return fetch(url, options)
5
+  const headers = new Headers();
6
+  headers.append('Content-Type', 'application/json;charset=utf8');
7
+  headers.append('X-Authorization-JWT', getToken());
8
+
9
+  Object.keys(options.headers || {}).forEach(key => headers.append(key, options.headers[key]))
10
+
11
+  return fetch(url, {...options, headers })
4 12
     .then(response => response.json())
5 13
     .then(data => {
6 14
       if (data.code === 1000) return data.data
@@ -9,5 +17,5 @@ export default function request (url, options) {
9 17
 }
10 18
 
11 19
 export const baseURL = process.env.NODE_ENV === 'development' ?
12
-  'http://192.168.1.147:8080/wx' :
13
-  '/'
20
+  '/api/wx' :
21
+  '/api/wx'

+ 10
- 0
src/utils/token.js ファイルの表示

@@ -0,0 +1,10 @@
1
+
2
+let token = null;
3
+
4
+export function setToken(t) {
5
+  token = t
6
+}
7
+
8
+export function getToken() {
9
+  return token
10
+}