创建 matching 匹配页面及完成到 playing 页面的跳转

web/src/store/index.js

@@ -1,6 +1,7 @@
 import { createStore } from "vuex";
 import ModuleUser from "./user";
 import ModuleBot from './bot';
+import ModulePk from './pk';
 
 export default createStore({
   state: {},
@@ -10,5 +11,6 @@ export default createStore({
   modules: {
     user: ModuleUser,
     bot: ModuleBot,
+    pk: ModulePk,
   },
 });

web/src/store/pk.js

@@ -0,0 +1,29 @@
+export default {
+  state: {
+    // 当前状态:用于判断时匹配中还是已经匹配完成: matching 表示匹配中(匹配界面), playing 表示匹配完成(对战界面)
+    status: "matching",
+    // socket 信息
+    socket: null,
+    // 对手信息
+    opponent_username: "",
+    opponent_photo: "",
+  },
+  getters: {},
+  mutations: {
+    // 更新 socket 信息
+    updateSocket(state, socket) {
+      state.socket = socket;
+    },
+    // 更新对手信息
+    updateOpponent(state, opponent) {
+      state.opponent_username = opponent.username;
+      state.opponent_photo = opponent.photo;
+    },
+    // 更新匹配状态信息
+    updateStatus(state, status) {
+      state.status = status;
+    },
+  },
+  actions: {},
+  module: {},
+};