diff --git a/package-lock.json b/package-lock.json
index 25b3c42..23a8eaf 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
"axios": "^1.10.0",
"element-plus": "^2.10.3",
"pinia": "^3.0.3",
+ "pinia-plugin-persistedstate": "^4.4.1",
"three": "^0.178.0",
"vite": "^4.5.3",
"vue": "^3.5.17",
@@ -881,6 +882,18 @@
}
}
},
+ "node_modules/deep-pick-omit": {
+ "version": "1.2.1",
+ "resolved": "https://registry.npmjs.org/deep-pick-omit/-/deep-pick-omit-1.2.1.tgz",
+ "integrity": "sha512-2J6Kc/m3irCeqVG42T+SaUMesaK7oGWaedGnQQK/+O0gYc+2SP5bKh/KKTE7d7SJ+GCA9UUE1GRzh6oDe0EnGw==",
+ "license": "MIT"
+ },
+ "node_modules/defu": {
+ "version": "6.1.4",
+ "resolved": "https://registry.npmjs.org/defu/-/defu-6.1.4.tgz",
+ "integrity": "sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==",
+ "license": "MIT"
+ },
"node_modules/delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -889,6 +902,12 @@
"node": ">=0.4.0"
}
},
+ "node_modules/destr": {
+ "version": "2.0.5",
+ "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.5.tgz",
+ "integrity": "sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==",
+ "license": "MIT"
+ },
"node_modules/dunder-proto": {
"version": "1.0.1",
"resolved": "https://registry.npmmirror.com/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -1500,6 +1519,33 @@
}
}
},
+ "node_modules/pinia-plugin-persistedstate": {
+ "version": "4.4.1",
+ "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-4.4.1.tgz",
+ "integrity": "sha512-lmuMPpXla2zJKjxEq34e1E9P9jxkWEhcVwwioCCE0izG45kkTOvQfCzvwhW3i38cvnaWC7T1eRdkd15Re59ldw==",
+ "license": "MIT",
+ "dependencies": {
+ "deep-pick-omit": "^1.2.1",
+ "defu": "^6.1.4",
+ "destr": "^2.0.5"
+ },
+ "peerDependencies": {
+ "@nuxt/kit": ">=3.0.0",
+ "@pinia/nuxt": ">=0.10.0",
+ "pinia": ">=3.0.0"
+ },
+ "peerDependenciesMeta": {
+ "@nuxt/kit": {
+ "optional": true
+ },
+ "@pinia/nuxt": {
+ "optional": true
+ },
+ "pinia": {
+ "optional": true
+ }
+ }
+ },
"node_modules/pinia/node_modules/@vue/devtools-api": {
"version": "7.7.7",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/@vue/devtools-api/-/devtools-api-7.7.7.tgz",
@@ -2465,11 +2511,26 @@
"ms": "^2.1.3"
}
},
+ "deep-pick-omit": {
+ "version": "1.2.1",
+ "resolved": "https://registry.npmjs.org/deep-pick-omit/-/deep-pick-omit-1.2.1.tgz",
+ "integrity": "sha512-2J6Kc/m3irCeqVG42T+SaUMesaK7oGWaedGnQQK/+O0gYc+2SP5bKh/KKTE7d7SJ+GCA9UUE1GRzh6oDe0EnGw=="
+ },
+ "defu": {
+ "version": "6.1.4",
+ "resolved": "https://registry.npmjs.org/defu/-/defu-6.1.4.tgz",
+ "integrity": "sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg=="
+ },
"delayed-stream": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="
},
+ "destr": {
+ "version": "2.0.5",
+ "resolved": "https://registry.npmjs.org/destr/-/destr-2.0.5.tgz",
+ "integrity": "sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA=="
+ },
"dunder-proto": {
"version": "1.0.1",
"resolved": "https://registry.npmmirror.com/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -2894,6 +2955,16 @@
}
}
},
+ "pinia-plugin-persistedstate": {
+ "version": "4.4.1",
+ "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-4.4.1.tgz",
+ "integrity": "sha512-lmuMPpXla2zJKjxEq34e1E9P9jxkWEhcVwwioCCE0izG45kkTOvQfCzvwhW3i38cvnaWC7T1eRdkd15Re59ldw==",
+ "requires": {
+ "deep-pick-omit": "^1.2.1",
+ "defu": "^6.1.4",
+ "destr": "^2.0.5"
+ }
+ },
"pkg-types": {
"version": "2.2.0",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/pkg-types/-/pkg-types-2.2.0.tgz",
diff --git a/package.json b/package.json
index bb552a9..29689e7 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
"axios": "^1.10.0",
"element-plus": "^2.10.3",
"pinia": "^3.0.3",
+ "pinia-plugin-persistedstate": "^4.4.1",
"three": "^0.178.0",
"vite": "^4.5.3",
"vue": "^3.5.17",
diff --git a/src/main.js b/src/main.js
index 5c1c652..b1978e8 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,11 +1,13 @@
import { createApp } from "vue";
import { createPinia } from "pinia";
+import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
import "./style.css";
import App from "./App.vue";
import router from "./router";
import ElementPlus from "element-plus";
const pinia = createPinia();
+pinia.use(piniaPluginPersistedstate);
const app = createApp(App);
diff --git a/src/stores/auth.js b/src/stores/auth.js
index 4e4fae8..49e3045 100644
--- a/src/stores/auth.js
+++ b/src/stores/auth.js
@@ -16,5 +16,10 @@ export const useAuthStore = defineStore('auth', () => {
login,
logout
};
-},{persist : false});
+},{
+ persist: {
+ storage: sessionStorage, // 使用会话存储替代默认的localStorage
+ paths: ['isLoggedIn'] // 可选：指定需要持久化的状态字段
+ }
+});
//开启持久化)
\ No newline at end of file
diff --git a/src/views/choujiang/Login.vue b/src/views/choujiang/Login.vue
index 0d7223c..0b01860 100644
--- a/src/views/choujiang/Login.vue
+++ b/src/views/choujiang/Login.vue
@@ -31,8 +31,7 @@ const handleLogin = () => {
return;
}
if (password.value === CORRECT_PASSWORD) {
- alert('登录成功，即将跳转到抽奖页面');
- // 添加登录状态存储
+ // 添加登录状态存储
authStore.login(); // 使用Pinia登录方法
router.push('/choujiang');
} else {
diff --git a/src/views/choujiang/lottery/PrizePanel.vue b/src/views/choujiang/lottery/PrizePanel.vue
index f156c55..7190c58 100644
--- a/src/views/choujiang/lottery/PrizePanel.vue
+++ b/src/views/choujiang/lottery/PrizePanel.vue
@@ -64,30 +64,7 @@
>
获奖名单
-
-
-
+
@@ -95,7 +72,7 @@
-
-
+
+
+
+
+
+
@@ -272,6 +241,7 @@ function canRevealPrize(idx) {
// 卡片点击事件
function handleReveal(idx) {
// 检查是否可以揭秘这个奖品
+ if (idx !== nextRevealIdx.value ) {alert("请按顺序揭秘奖品!"); return;}
if (idx === nextRevealIdx.value && canRevealPrize(idx)) {
revealedCount.value++;
lastRevealedIdx.value = idx; // 记录最新揭秘的索引
@@ -331,15 +301,6 @@ async function openWinnerList() {
if (lastRevealedIdx.value >= 0) {
showOne.value = false;
}
- // 设置弹窗位置
- // nextTick(() => {
- // const btn = winnerBtnRef.value;
- // if (btn) {
- // const rect = btn.getBoundingClientRect();
- // modalLeft.value = rect.left - 23;
- // modalTop.value = rect.bottom + 18; // 4px间距
- // }
- // });
}
function closeWinnerList() {
showWinnerList.value = false;
@@ -378,15 +339,6 @@ async function toggleWinnerList() {
showOne.value = false;
console.log("设置 showOne 为 false");
}
- // 设置弹窗位置
- // nextTick(() => {
- // const btn = winnerBtnRef.value;
- // if (btn) {
- // const rect = btn.getBoundingClientRect();
- // modalLeft.value = rect.left - 23;
- // modalTop.value = rect.bottom + 18; // 4px间距
- // }
- // });
} else {
// 当关闭获奖名单且showOne为false时，将其切换回true
if (!showOne.value) {
@@ -423,6 +375,36 @@ function getProgressPercent(prize) {
display: flex;
flex-direction: column;
gap: 18px;
+ height: 400px;
+ overflow-x: hidden !important;
+ overflow-y: auto;
+ padding-right: 10px;
+ scrollbar-width: thin;
+ scrollbar-color: #ffd283 rgba(255, 210, 131, 0.3); /* Firefox */
+}
+.prize-panel-list1 {
+ position: absolute;
+ top: 20px;
+ left: 20px;
+ background: none;
+ z-index: 10;
+ min-width: 320px;
+ max-width: 342px;
+ text-align: left;
+ display: flex;}
+
+.prize-panel-list::-webkit-scrollbar {
+ width: 6px;
+}
+
+.prize-panel-list::-webkit-scrollbar-track {
+ background: rgba(255, 210, 131, 0.3);
+ border-radius: 3px;
+}
+
+.prize-panel-list::-webkit-scrollbar-thumb {
+ background-color: #ffd283;
+ border-radius: 3px;
}
.prize-panel-item {
background: #ffd283;
@@ -521,20 +503,21 @@ function getProgressPercent(prize) {
font-weight: bold;
}
.prize-panel-footer {
- position: absolute;
- left: 0;
- bottom: -26px;
+ position: fixed;
+ right: 750px;
+ bottom: 435px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
z-index: 20;
- /* 移除 move-up 相关 */
+ padding: 10px 0;
+ border-radius: 0 0 6px 6px;
}
.arrow-up {
position: relative;
- width: 36px;
- height: 24px;
+ width: 50px;
+ height: 30px;
margin-bottom: 4px;
cursor: pointer;
background-image: url("../../../assets/展开.png");
@@ -544,10 +527,10 @@ function getProgressPercent(prize) {
}
.arrow-down {
position: fixed;
- top: 120px;
- left: 181px;
- width: 36px;
- height: 38px;
+ top: 100px;
+ left: 150px;
+ width: 47px;
+ height: 28px;
margin-bottom: 4px;
cursor: pointer;
background-image: url("../../../assets/展开.png");
@@ -568,8 +551,8 @@ function getProgressPercent(prize) {
}
.winner-modal-mask {
position: fixed;
- top: 155px;
- left:33px;
+ top: 142px;
+ left:-4px;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.01);