From c6d17e248edd20af3d30b20af2293da4c143ac18 Mon Sep 17 00:00:00 2001 From: SummerColdWind <472959020@qq.com> Date: Mon, 29 Jul 2024 22:42:38 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E4=BA=86=E6=B8=B8=E6=88=8F?= =?UTF-8?q?=E7=99=BB=E9=99=86=E9=A1=B5=E9=9D=A2=E7=9A=84=E6=9C=AC=E5=9C=B0?= =?UTF-8?q?=E5=8E=86=E5=8F=B2=E5=82=A8=E5=AD=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + pnpm-lock.yaml | 12 ++++++++++++ src/main.js | 2 ++ src/stores/counter.js | 12 ------------ src/stores/index.js | 11 +++++++++++ src/stores/modules/login.js | 33 ++++++++++++++++++++++++++++++++ src/views/layout/gameLogin.vue | 35 ++++++++++++++++++++++++++++++++-- 7 files changed, 92 insertions(+), 14 deletions(-) delete mode 100644 src/stores/counter.js create mode 100644 src/stores/index.js create mode 100644 src/stores/modules/login.js diff --git a/package.json b/package.json index cddb2e4..ce163f6 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "axios": "^1.7.2", "element-plus": "^2.7.8", "pinia": "^2.1.7", + "pinia-plugin-persistedstate": "^3.2.1", "vue": "^3.4.29", "vue-router": "^4.3.3" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c8ec733..2d7d8a3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -20,6 +20,9 @@ importers: pinia: specifier: ^2.1.7 version: 2.2.0(vue@3.4.34) + pinia-plugin-persistedstate: + specifier: ^3.2.1 + version: 3.2.1(pinia@2.2.0(vue@3.4.34)) vue: specifier: ^3.4.29 version: 3.4.34 @@ -463,6 +466,11 @@ packages: picocolors@1.0.1: resolution: {integrity: sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew==, tarball: https://registry.npmmirror.com/picocolors/-/picocolors-1.0.1.tgz} + pinia-plugin-persistedstate@3.2.1: + resolution: {integrity: sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==, tarball: https://registry.npmmirror.com/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz} + peerDependencies: + pinia: ^2.0.0 + pinia@2.2.0: resolution: {integrity: sha512-iPrIh26GMqfpUlMOGyxuDowGmYousTecbTHFwT0xZ1zJvh23oQ+Cj99ZoPQA1TnUPhU6AuRPv6/drkTCJ0VHQA==, tarball: https://registry.npmmirror.com/pinia/-/pinia-2.2.0.tgz} peerDependencies: @@ -905,6 +913,10 @@ snapshots: picocolors@1.0.1: {} + pinia-plugin-persistedstate@3.2.1(pinia@2.2.0(vue@3.4.34)): + dependencies: + pinia: 2.2.0(vue@3.4.34) + pinia@2.2.0(vue@3.4.34): dependencies: '@vue/devtools-api': 6.6.3 diff --git a/src/main.js b/src/main.js index ecadf9e..1acd939 100644 --- a/src/main.js +++ b/src/main.js @@ -3,6 +3,7 @@ import { createPinia } from 'pinia' import App from './App.vue' import router from './router' +import pinia from "@/stores/index.js"; import ElementPlus from 'element-plus' import 'element-plus/dist/index.css' @@ -19,5 +20,6 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) { app.use(createPinia()) app.use(router) app.use(ElementPlus) +app.use(pinia) app.mount('#app') diff --git a/src/stores/counter.js b/src/stores/counter.js deleted file mode 100644 index b6757ba..0000000 --- a/src/stores/counter.js +++ /dev/null @@ -1,12 +0,0 @@ -import { ref, computed } from 'vue' -import { defineStore } from 'pinia' - -export const useCounterStore = defineStore('counter', () => { - const count = ref(0) - const doubleCount = computed(() => count.value * 2) - function increment() { - count.value++ - } - - return { count, doubleCount, increment } -}) diff --git a/src/stores/index.js b/src/stores/index.js new file mode 100644 index 0000000..5f4785d --- /dev/null +++ b/src/stores/index.js @@ -0,0 +1,11 @@ +import {createPinia} from 'pinia' + +import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' + +const pinia = createPinia() + +pinia.use(piniaPluginPersistedstate) + +export default pinia + +export * from './modules/login.js' diff --git a/src/stores/modules/login.js b/src/stores/modules/login.js new file mode 100644 index 0000000..3b644b3 --- /dev/null +++ b/src/stores/modules/login.js @@ -0,0 +1,33 @@ +import {defineStore} from "pinia"; +import {ref} from "vue"; + + +export const useAccountStore = defineStore("accountStore", () => { + const accounts = ref([]) + + const addAccount = (username, password) => { + // 如果不存在则新建 + if (!accounts.value.some(account => account.username === username)) { + accounts.value.push({ + username: username, + password: password, + }) + // 如果已经存在则更新密码 + } else { + accounts.value.find(account => account.username === username).password = password + } + } + + const deleteAccount = (username) => { + accounts.value = accounts.value.filter(account => account.username !== username) + } + + return { + accounts, + addAccount, deleteAccount + } + }, + { + persist: true + } +) diff --git a/src/views/layout/gameLogin.vue b/src/views/layout/gameLogin.vue index 24549ba..71682f4 100644 --- a/src/views/layout/gameLogin.vue +++ b/src/views/layout/gameLogin.vue @@ -2,6 +2,10 @@ import {ref} from "vue"; import {gameLoginInterface} from '@/api/login.js' +import {useAccountStore} from "@/stores/index.js"; +import {Delete} from "@element-plus/icons-vue"; + +const accountStore = useAccountStore(); const form = ref({ username: '', @@ -20,8 +24,14 @@ const rules = { const loginForm = ref(null) const gameLogin = async () => { await loginForm.value.validate() - const res = await gameLoginInterface(form.value.context) - console.log(res.data) + // const res = await gameLoginInterface(form.value.username, form.value.password) + // console.log(res.data) + accountStore.addAccount(form.value.username, form.value.password) +} + +const fillAccount = (username, password) => { + form.value.username = username + form.value.password = password } @@ -48,6 +58,20 @@ const gameLogin = async () => { 确认 + +
+ + 账号: {{ + item.username + }} + + + +
+ @@ -64,4 +88,11 @@ const gameLogin = async () => { flex-direction: column; } +.account-group { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 20px; +} +