refactor login dialog for front page

2025-11-13 04:33:42 +08:00 · 2024-05-18 00:27:32 +08:00
parent dad9254128
commit 45d6579fb6
16 changed files with 277 additions and 279 deletions
--- a/web/src/views/ChatApps.vue
+++ b/web/src/views/ChatApps.vue
@@ -2,15 +2,21 @@
  <div>
    <div class="page-apps custom-scroll">
      <div class="inner" :style="{height: listBoxHeight + 'px'}">
-        <ItemList :items="list" v-if="list.length > 0" :gap="20" :width="250">
+        <ItemList :items="list" v-if="list.length > 0" :gap="15" :width="300">
          <template #default="scope">
-            <div class="app-item" :style="{width: scope.width+'px'}">
-              <el-image :src="scope.item.icon" fit="cover" :style="{height: scope.width+'px'}"/>
-              <div class="title">
-                <span class="name">{{ scope.item.name }}</span>
-                <div class="opt">
+            <div class="item">
+              <div class="image">
+                <el-image :src="scope.item.icon" fit="cover"/>
+              </div>
+
+              <div class="inner">
+                <div class="info">
+                  <div class="info-title">{{ scope.item.name }}</div>
+                  <div class="info-text">{{ scope.item.hello_msg }}</div>
+                </div>
+                <div class="btn">
                  <div v-if="hasRole(scope.item.key)">
-                    <el-button size="small" type="success" @click="useRole(scope.item)">使用</el-button>
+                    <el-button size="small" color="#21aa93" @click="useRole(scope.item)">使用</el-button>
                    <el-button size="small" type="danger" @click="updateRole(scope.item,'remove')">移除</el-button>
                  </div>
                  <el-button v-else size="small"
@@ -23,15 +29,34 @@
                  </el-button>
                </div>
              </div>
-              <div class="hello-msg" ref="elements">{{ scope.item.intro }}</div>
+
+
            </div>
+            <!--            <div class="app-item">-->
+            <!--              <el-image :src="scope.item.icon" fit="cover"/>-->
+            <!--              <div class="title">-->
+            <!--                <span class="name">{{ scope.item.name }}</span>-->
+            <!--                <div class="opt">-->
+            <!--                  <div v-if="hasRole(scope.item.key)">-->
+            <!--                    <el-button size="small" type="success" @click="useRole(scope.item)">使用</el-button>-->
+            <!--                    <el-button size="small" type="danger" @click="updateRole(scope.item,'remove')">移除</el-button>-->
+            <!--                  </div>-->
+            <!--                  <el-button v-else size="small"-->
+            <!--                             style="&#45;&#45;el-color-primary:#009999"-->
+            <!--                             @click="updateRole(scope.item, 'add')">-->
+            <!--                    <el-icon>-->
+            <!--                      <Plus/>-->
+            <!--                    </el-icon>-->
+            <!--                    <span>添加应用</span>-->
+            <!--                  </el-button>-->
+            <!--                </div>-->
+            <!--              </div>-->
+            <!--              <div class="hello-msg" ref="elements">{{ scope.item.intro }}</div>-->
+            <!--            </div>-->
          </template>
        </ItemList>
      </div>
-
-
    </div>
-    <login-dialog :show="showLoginDialog" @hide="getRoles" @success=""/>
  </div>
 </template>

@@ -39,18 +64,18 @@
 import {onMounted, ref} from "vue"
 import {ElMessage} from "element-plus";
 import {httpGet, httpPost} from "@/utils/http";
-import ItemList from "@/components/ItemList.vue";
-import {Plus} from "@element-plus/icons-vue";
-import LoginDialog from "@/components/LoginDialog.vue";
 import {checkSession} from "@/action/session";
 import {arrayContains, removeArrayItem, substr} from "@/utils/libs";
 import {useRouter} from "vue-router";
+import {useSharedStore} from "@/store/sharedata";
+import ItemList from "@/components/ItemList.vue";
+import {Plus} from "@element-plus/icons-vue";

-const listBoxHeight = window.innerHeight - 147
+const listBoxHeight = window.innerHeight - 87
 const list = ref([])
-const showLoginDialog = ref(false)
 const roles = ref([])
-const elements = ref(null)
+const store = useSharedStore();
+
 onMounted(() => {
  httpGet("/api/role/list?all=true").then((res) => {
    const items = res.data
@@ -67,7 +92,6 @@ onMounted(() => {
 })

 const getRoles = () => {
-  showLoginDialog.value = false
  checkSession().then(user => {
    roles.value = user.chat_roles
  }).catch(() => {
@@ -98,7 +122,7 @@ const updateRole = (row, opt) => {
      ElMessage.error(title.value + "失败：" + e.message)
    })
  }).catch(() => {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
  })
 }

--- a/web/src/views/ChatPlus.vue
+++ b/web/src/views/ChatPlus.vue
@@ -99,7 +99,7 @@

                        <template #default>
                          <div class="chat-config">
-                            <el-select v-model="roleId" filterable placeholder="角色" @change="newChat"
+                            <el-select v-model="roleId" filterable placeholder="角色" @change="_newChat"
                                       class="role-select"
                                       style="width:150px">
                              <el-option
@@ -115,7 +115,7 @@
                              </el-option>
                            </el-select>

-                            <el-select v-model="modelID" filterable placeholder="模型" @change="newChat"
+                            <el-select v-model="modelID" filterable placeholder="模型" @change="_newChat"
                                       :disabled="disableModel"
                                       style="width:150px">
                              <el-option
@@ -144,7 +144,7 @@
                    </el-tooltip>
                  </span>

-                  <span class="tool-item">
+                  <span class="tool-item" v-if="isLogin">
                    <el-tooltip class="box-item" effect="dark" content="上传附件">
                      <file-select v-if="isLogin" :user-id="loginUser.id" @selected="insertURL"/>
                    </el-tooltip>
@@ -378,6 +378,11 @@ const resizeElement = function () {
  leftBoxHeight.value = window.innerHeight - 90 - 45 - 82;
 };

+const _newChat = () => {
+  if (isLogin.value) {
+    newChat()
+  }
+}
 const disableModel = ref(false)
 // 新建会话
 const newChat = () => {
--- a/web/src/views/Dalle.vue
+++ b/web/src/views/Dalle.vue
@@ -221,7 +221,6 @@

    </div>

-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog =  false" @success="initData"/>
    <el-image-viewer @close="() => { previewURL = '' }" v-if="previewURL !== ''" :url-list="[previewURL]"/>
  </div>
 </template>
@@ -233,16 +232,16 @@ import {httpGet, httpPost} from "@/utils/http";
 import {ElMessage, ElMessageBox, ElNotification} from "element-plus";
 import Clipboard from "clipboard";
 import {checkSession} from "@/action/session";
-import LoginDialog from "@/components/LoginDialog.vue";
+import {useSharedStore} from "@/store/sharedata";

 const listBoxHeight = ref(0)
 const paramBoxHeight = ref(0)
-const showLoginDialog = ref(false)
 const isLogin = ref(false)
 const loading = ref(true)
-const colWidth = ref(240)
+const colWidth = ref(220)
 const isOver = ref(false)
 const previewURL = ref("")
+const store = useSharedStore();

 const resizeElement = function () {
  listBoxHeight.value = window.innerHeight - 90
@@ -438,7 +437,7 @@ const generate = () => {
  }

  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }
  httpPost("/api/dall/image", params.value).then(() => {
--- a/web/src/views/Home.vue
+++ b/web/src/views/Home.vue
@@ -14,7 +14,7 @@

        <el-tooltip
            class="box-item"
-            effect="dark"
+            effect="light"
            content="部署文档"
            placement="bottom">
          <a href="https://ai.r9it.com/docs/install/" class="link-button" target="_blank">
@@ -24,7 +24,7 @@

        <el-tooltip
            class="box-item"
-            effect="dark"
+            effect="light"
            content="项目源码"
            placement="bottom">
          <a href="https://github.com/yangjian102621/chatgpt-plus" class="link-button" target="_blank">
@@ -68,7 +68,7 @@
        </el-dropdown>

        <div v-else>
-          <el-button size="small" color="#21aa93" @click="show = true" round>登录</el-button>
+          <el-button size="small" color="#21aa93" @click="store.setShowLoginDialog(true)" round>登录</el-button>
          <el-button size="small" @click="router.push('/register')" round>注册</el-button>
        </div>
      </div>
@@ -113,7 +113,7 @@
        </ul>
      </div>

-      <div class="content" :style="{height: mainWinHeight+'px'}">
+      <div class="content custom-scroll" :style="{height: mainWinHeight+'px'}">
        <router-view :key="routerViewKey" v-slot="{ Component }">
          <transition name="move" mode="out-in">
            <component :is="Component"></component>
@@ -220,5 +220,6 @@ const loginCallback = () => {
 </script>

 <style lang="stylus" scoped>
+@import "@/assets/css/custom-scroll.styl"
@import "@/assets/css/home.styl"
 </style>
--- a/web/src/views/ImageMj.vue
+++ b/web/src/views/ImageMj.vue
@@ -600,8 +600,6 @@
    </div>

    <el-image-viewer @close="() => { previewURL = '' }" v-if="previewURL !== ''" :url-list="[previewURL]"/>
-
-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog =  false" @success="initData"/>
  </div>
 </template>

@@ -616,14 +614,14 @@ import {checkSession} from "@/action/session";
 import {useRouter} from "vue-router";
 import {getSessionId} from "@/store/session";
 import {copyObj, removeArrayItem} from "@/utils/libs";
-import LoginDialog from "@/components/LoginDialog.vue";
+import {useSharedStore} from "@/store/sharedata";

 const listBoxHeight = ref(0)
 const paramBoxHeight = ref(0)
-const showLoginDialog = ref(false)
 const loading = ref(true)
-const colWidth = ref(240)
+const colWidth = ref(220)
 const previewURL = ref("")
+const store = useSharedStore();

 const resizeElement = function () {
  listBoxHeight.value = window.innerHeight - 80
@@ -903,7 +901,7 @@ const beforeUpload = (key) => {
 // 图片上传
 const uploadImg = (file) => {
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

@@ -936,7 +934,7 @@ const uploadImg = (file) => {
 const promptRef = ref(null)
 const generate = () => {
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

--- a/web/src/views/ImageSd.vue
+++ b/web/src/views/ImageSd.vue
@@ -497,8 +497,6 @@

      </el-dialog>
    </div>
-
-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog =  false" @success="initData"/>
  </div>
 </template>

@@ -511,17 +509,17 @@ import Clipboard from "clipboard";
 import {checkSession} from "@/action/session";
 import {useRouter} from "vue-router";
 import {getSessionId} from "@/store/session";
-import LoginDialog from "@/components/LoginDialog.vue";
+import {useSharedStore} from "@/store/sharedata";

 const listBoxHeight = ref(0)
 const paramBoxHeight = ref(0)
 const fullImgHeight = ref(window.innerHeight - 60)
 const showTaskDialog = ref(false)
 const item = ref({})
-const showLoginDialog = ref(false)
 const isLogin = ref(false)
 const loading = ref(true)
-const colWidth = ref(240)
+const colWidth = ref(220)
+const store = useSharedStore();

 const resizeElement = function () {
  listBoxHeight.value = window.innerHeight - 80
@@ -730,7 +728,7 @@ const generate = () => {
  }

  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

--- a/web/src/views/ImagesWall.vue
+++ b/web/src/views/ImagesWall.vue
@@ -311,7 +311,7 @@ const loading = ref(true)
 const isOver = ref(false)
 const imgType = ref("mj") // 图片类别
 const listBoxHeight = window.innerHeight - 124
-const colWidth = ref(240)
+const colWidth = ref(220)
 const fullImgHeight = ref(window.innerHeight - 60)
 const showTaskDialog = ref(false)
 const item = ref({})
--- a/web/src/views/Invitation.vue
+++ b/web/src/views/Invitation.vue
@@ -84,8 +84,6 @@
        </div>
      </div>
    </div>
-
-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog =  false" @success="initData"/>
  </div>
 </template>

@@ -97,17 +95,17 @@ import {ElMessage} from "element-plus";
 import Clipboard from "clipboard";
 import InviteList from "@/components/InviteList.vue";
 import {checkSession} from "@/action/session";
-import LoginDialog from "@/components/LoginDialog.vue";
+import {useSharedStore} from "@/store/sharedata";

 const inviteURL = ref("")
-const qrImg = ref("")
+const qrImg = ref("/images/wx.png")
 const inviteChatCalls = ref(0)
 const inviteImgCalls = ref(0)
 const hits = ref(0)
 const regNum = ref(0)
 const rate = ref(0)
 const isLogin = ref(false)
-const showLoginDialog = ref(false)
+const store = useSharedStore()

 onMounted(() => {
  initData()
@@ -152,7 +150,7 @@ const initData = () => {
      ElMessage.error("获取系统配置失败：" + e.message)
    })
  }).catch(() => {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
  });
 }
 </script>
--- a/web/src/views/MarkMap.vue
+++ b/web/src/views/MarkMap.vue
@@ -90,13 +90,10 @@
      </div>

    </div>
-
-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog =  false" @success="initData"/>
  </div>
 </template>

 <script setup>
-import LoginDialog from "@/components/LoginDialog.vue";
 import {nextTick, onMounted, onUnmounted, ref} from 'vue';
 import {Markmap} from 'markmap-view';
 import {Transformer} from 'markmap-lib';
@@ -105,6 +102,7 @@ import {httpGet} from "@/utils/http";
 import {ElMessage} from "element-plus";
 import {Download} from "@element-plus/icons-vue";
 import {Toolbar} from 'markmap-toolbar';
+import {useSharedStore} from "@/store/sharedata";

 const leftBoxHeight = ref(window.innerHeight - 105)
 const rightBoxHeight = ref(window.innerHeight - 115)
@@ -125,10 +123,10 @@ const md = require('markdown-it')({breaks: true});
 const content = ref(text.value)
 const html = ref("")

-const showLoginDialog = ref(false)
 const isLogin = ref(false)
 const loginUser = ref({power: 0})
 const transformer = new Transformer();
+const store = useSharedStore();


 const svgRef = ref(null)
@@ -150,21 +148,21 @@ onMounted(() => {
 });

 const initData = () => {
+  httpGet("/api/model/list").then(res => {
+    for (let v of res.data) {
+      if (v.platform === "OpenAI" && v.value.indexOf("gpt-4-gizmo") === -1) {
+        models.value.push(v)
+      }
+    }
+    modelID.value = models.value[0].id
+  }).catch(e => {
+    ElMessage.error("获取模型失败：" + e.message)
+  })
+  
  checkSession().then(user => {
    loginUser.value = user
    isLogin.value = true
-
-    httpGet("/api/model/list").then(res => {
-      for (let v of res.data) {
-        if (v.platform === "OpenAI" && v.value.indexOf("gpt-4-gizmo") === -1) {
-          models.value.push(v)
-        }
-      }
-      modelID.value = models.value[0].id
-      connect(user.id)
-    }).catch(e => {
-      ElMessage.error("获取模型失败：" + e.message)
-    })
+    connect(user.id)
  }).catch(() => {
  });
 }
@@ -205,7 +203,7 @@ window.onresize = () => {
 }

 const socket = ref(null)
-const heartbeatHandle = ref(null)
+const heartbeatHandle = ref(0)
 const connect = (userId) => {
  if (socket.value !== null) {
    socket.value.close()
@@ -292,7 +290,7 @@ const generateAI = () => {
    return ElMessage.error("请输入你的需求")
  }
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }
  loading.value = true
--- a/web/src/views/Member.vue
+++ b/web/src/views/Member.vue
@@ -2,98 +2,92 @@
  <div>
    <div class="member custom-scroll">
      <div class="inner" :style="{height: listBoxHeight + 'px'}">
-        <el-row :gutter="20">
-          <el-col :span="7">
-            <div class="user-profile">
-              <user-profile/>
+        <div class="user-profile">
+          <user-profile/>

-              <el-row class="user-opt" :gutter="20">
-                <el-col :span="12">
-                  <el-button type="primary" @click="showPasswordDialog = true">修改密码</el-button>
-                </el-col>
-                <el-col :span="12">
-                  <el-button type="primary" @click="showBindMobileDialog = true">更改账号</el-button>
-                </el-col>
-                <el-col :span="12">
-                  <el-button type="primary" v-if="enableReward" @click="showRewardDialog = true">加入众筹</el-button>
-                </el-col>
-                <el-col :span="12">
-                  <el-button type="primary" v-if="enableReward" @click="showRewardVerifyDialog = true">众筹核销
-                  </el-button>
-                </el-col>
+          <el-row class="user-opt" :gutter="20">
+            <el-col :span="12">
+              <el-button type="primary" @click="showPasswordDialog = true">修改密码</el-button>
+            </el-col>
+            <el-col :span="12">
+              <el-button type="primary" @click="showBindMobileDialog = true">更改账号</el-button>
+            </el-col>
+            <el-col :span="12">
+              <el-button type="primary" v-if="enableReward" @click="showRewardDialog = true">加入众筹</el-button>
+            </el-col>
+            <el-col :span="12">
+              <el-button type="primary" v-if="enableReward" @click="showRewardVerifyDialog = true">众筹核销
+              </el-button>
+            </el-col>

-                <el-col :span="24" style="padding-top: 30px" v-if="isLogin">
-                  <el-button type="danger" round @click="logout">退出登录</el-button>
-                </el-col>
-              </el-row>
-            </div>
-          </el-col>
+            <el-col :span="24" style="padding-top: 30px" v-if="isLogin">
+              <el-button type="danger" round @click="logout">退出登录</el-button>
+            </el-col>
+          </el-row>
+        </div>

-          <el-col :span="17">
-            <div class="product-box">
-              <div class="info" v-if="orderPayInfoText !== ''">
-                <el-alert type="success" show-icon :closable="false" effect="dark">
-                  <strong>说明:</strong> {{ vipInfoText }}
-                </el-alert>
-              </div>
+        <div class="product-box">
+          <div class="info" v-if="orderPayInfoText !== ''">
+            <el-alert type="success" show-icon :closable="false" effect="dark">
+              <strong>说明:</strong> {{ vipInfoText }}
+            </el-alert>
+          </div>

-              <ItemList :items="list" v-if="list.length > 0" :gap="30" :width="240">
-                <template #default="scope">
-                  <div class="product-item" :style="{width: scope.width+'px'}">
-                    <div class="image-container">
-                      <el-image :src="vipImg" fit="cover"/>
-                    </div>
-                    <div class="product-title">
-                      <span class="name">{{ scope.item.name }}</span>
-                    </div>
-                    <div class="product-info">
-                      <div class="info-line">
-                        <span class="label">商品原价：</span>
-                        <span class="price">￥{{ scope.item.price }}</span>
-                      </div>
-                      <div class="info-line">
-                        <span class="label">促销立减：</span>
-                        <span class="price">￥{{ scope.item.discount }}</span>
-                      </div>
-                      <div class="info-line">
-                        <span class="label">有效期：</span>
-                        <span class="expire" v-if="scope.item.days > 0">{{ scope.item.days }}天</span>
-                        <span class="expire" v-else>长期有效</span>
-                      </div>
-
-                      <div class="info-line">
-                        <span class="label">算力值：</span>
-                        <span class="power" v-if="scope.item.power > 0">{{ scope.item.power }}</span>
-                        <span class="power" v-else>{{ vipMonthPower }}</span>
-                      </div>
-
-                      <div class="pay-way">
-                        <el-button type="primary" @click="alipay(scope.item)" size="small" v-if="payWays['alipay']">
-                          <i class="iconfont icon-alipay"></i> 支付宝
-                        </el-button>
-                        <el-button type="success" @click="huPiPay(scope.item)" size="small" v-if="payWays['hupi']">
-                          <span v-if="payWays['hupi']['name'] === 'wechat'"><i class="iconfont icon-wechat-pay"></i> 微信</span>
-                          <span v-else><i class="iconfont icon-alipay"></i> 支付宝</span>
-                        </el-button>
-
-                        <el-button type="success" @click="PayJs(scope.item)" size="small" v-if="payWays['payjs']">
-                          <span><i class="iconfont icon-wechat-pay"></i> 微信</span>
-                        </el-button>
-                      </div>
-                    </div>
+          <ItemList :items="list" v-if="list.length > 0" :gap="15" :width="240">
+            <template #default="scope">
+              <div class="product-item">
+                <div class="image-container">
+                  <el-image :src="vipImg" fit="cover"/>
+                </div>
+                <div class="product-title">
+                  <span class="name">{{ scope.item.name }}</span>
+                </div>
+                <div class="product-info">
+                  <div class="info-line">
+                    <span class="label">商品原价：</span>
+                    <span class="price">￥{{ scope.item.price }}</span>
+                  </div>
+                  <div class="info-line">
+                    <span class="label">促销立减：</span>
+                    <span class="price">￥{{ scope.item.discount }}</span>
+                  </div>
+                  <div class="info-line">
+                    <span class="label">有效期：</span>
+                    <span class="expire" v-if="scope.item.days > 0">{{ scope.item.days }}天</span>
+                    <span class="expire" v-else>长期有效</span>
                  </div>
-                </template>
-              </ItemList>

-              <h2 class="headline">消费账单</h2>
+                  <div class="info-line">
+                    <span class="label">算力值：</span>
+                    <span class="power" v-if="scope.item.power > 0">{{ scope.item.power }}</span>
+                    <span class="power" v-else>{{ vipMonthPower }}</span>
+                  </div>

-              <div class="user-order">
-                <user-order v-if="isLogin"/>
+                  <div class="pay-way">
+                    <el-button type="primary" @click="alipay(scope.item)" size="small" v-if="payWays['alipay']">
+                      <i class="iconfont icon-alipay"></i> 支付宝
+                    </el-button>
+                    <el-button type="success" @click="huPiPay(scope.item)" size="small" v-if="payWays['hupi']">
+                      <span v-if="payWays['hupi']['name'] === 'wechat'"><i
+                          class="iconfont icon-wechat-pay"></i> 微信</span>
+                      <span v-else><i class="iconfont icon-alipay"></i> 支付宝</span>
+                    </el-button>
+
+                    <el-button type="success" @click="PayJs(scope.item)" size="small" v-if="payWays['payjs']">
+                      <span><i class="iconfont icon-wechat-pay"></i> 微信</span>
+                    </el-button>
+                  </div>
+                </div>
              </div>
-            </div>
-          </el-col>
-        </el-row>
+            </template>
+          </ItemList>

+          <h2 class="headline">消费账单</h2>
+
+          <div class="user-order">
+            <user-order v-if="isLogin"/>
+          </div>
+        </div>
      </div>

      <password-dialog v-if="isLogin" :show="showPasswordDialog" @hide="showPasswordDialog = false"
@@ -154,7 +148,6 @@
      </el-dialog>
    </div>

-    <login-dialog :show="showLoginDialog" @hide="showLoginDialog = false" @success="loginSuccess"/>
  </div>
 </template>

@@ -164,7 +157,6 @@ import {ElMessage} from "element-plus";
 import {httpGet, httpPost} from "@/utils/http";
 import ItemList from "@/components/ItemList.vue";
 import {InfoFilled, SuccessFilled} from "@element-plus/icons-vue";
-import LoginDialog from "@/components/LoginDialog.vue";
 import {checkSession} from "@/action/session";
 import UserProfile from "@/components/UserProfile.vue";
 import PasswordDialog from "@/components/PasswordDialog.vue";
@@ -174,10 +166,10 @@ import {useRouter} from "vue-router";
 import {removeUserToken} from "@/store/session";
 import UserOrder from "@/components/UserOrder.vue";
 import CountDown from "@/components/CountDown.vue";
+import {useSharedStore} from "@/store/sharedata";

 const listBoxHeight = window.innerHeight - 97
 const list = ref([])
-const showLoginDialog = ref(false)
 const showPayDialog = ref(false)
 const vipImg = ref("/images/vip.png")
 const enableReward = ref(false) // 是否启用众筹功能
@@ -205,6 +197,7 @@ const amount = ref(0)
 const payName = ref("支付宝")
 const curPay = ref("alipay") // 当前支付方式
 const vipInfoText = ref("")
+const store = useSharedStore()


 onMounted(() => {
@@ -212,7 +205,7 @@ onMounted(() => {
    user.value = _user
    isLogin.value = true
  }).catch(() => {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
  })

  httpGet("/api/product/list").then((res) => {
@@ -278,7 +271,7 @@ const alipay = (row) => {
  curPay.value = "alipay"
  amount.value = (row.price - row.discount).toFixed(2)
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

@@ -294,7 +287,7 @@ const huPiPay = (row) => {
  curPay.value = "hupi"
  amount.value = (row.price - row.discount).toFixed(2)
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

@@ -310,7 +303,7 @@ const PayJs = (row) => {
  curPay.value = "payjs"
  amount.value = (row.price - row.discount).toFixed(2)
  if (!isLogin.value) {
-    showLoginDialog.value = true
+    store.setShowLoginDialog(true)
    return
  }

--- a/web/src/views/PowerLog.vue
+++ b/web/src/views/PowerLog.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="power-log" v-loading="loading">
-    <div class="inner">
-      <div class="list-box" :style="{height: listBoxHeight + 'px'}">
+  <div class="power-log custom-scroll" v-loading="loading">
+    <div class="inner" :style="{height: listBoxHeight + 'px'}">
+      <div class="list-box">
        <div class="handle-box">
          <el-input v-model="query.model" placeholder="模型" class="handle-input mr10" clearable></el-input>
          <el-date-picker
@@ -11,9 +11,9 @@
              end-placeholder="结束日期"
              format="YYYY-MM-DD"
              value-format="YYYY-MM-DD"
-              style="margin: 0 10px;width: 200px; position: relative;top:3px;"
+              style="margin: 0 10px;width: 200px;"
          />
-          <el-button type="primary" :icon="Search" @click="fetchData">搜索</el-button>
+          <el-button color="#21aa93" :icon="Search" @click="fetchData">搜索</el-button>
        </div>

        <el-row v-if="items.length > 0">
@@ -71,21 +71,25 @@ import {Search} from "@element-plus/icons-vue";
 import Clipboard from "clipboard";
 import {ElMessage} from "element-plus";
 import {httpPost} from "@/utils/http";
+import {checkSession} from "@/action/session";

 const items = ref([])
 const total = ref(0)
 const page = ref(1)
 const pageSize = ref(20)
 const loading = ref(false)
-const listBoxHeight = window.innerHeight - 117
+const listBoxHeight = window.innerHeight - 87
 const query = ref({
  model: "",
  date: []
 })
-const tagColors = ref(["", "success", "", "danger", "info", "warning"])
+const tagColors = ref(["primary", "success", "primary", "danger", "info", "warning"])

 onMounted(() => {
-  fetchData()
+  checkSession().then(() => {
+    fetchData()
+  }).catch(() => {
+  })
  const clipboard = new Clipboard('.copy-order-no');
  clipboard.on('success', () => {
    ElMessage.success("复制成功！");
@@ -121,33 +125,12 @@ const fetchData = () => {
 </script>

 <style lang="stylus" scoped>
+@import "@/assets/css/custom-scroll.styl"
 .power-log {
  color #ffffff
  .inner {
    padding 0 20px 20px 20px
-
-    ::-webkit-scrollbar {
-      width: 8px; /* 滚动条宽度 */
-    }
-
-    /* 修改滚动条轨道的背景颜色 */
-
-    ::-webkit-scrollbar-track {
-      background-color: #ffffff;
-    }
-
-    /* 修改滚动条的滑块颜色 */
-
-    ::-webkit-scrollbar-thumb {
-      background-color: #cccccc;
-      border-radius 8px
-    }
-
-    /* 修改滚动条的滑块的悬停颜色 */
-
-    ::-webkit-scrollbar-thumb:hover {
-      background-color: #999999;
-    }
+    overflow auto

    .list-box {
      overflow-x hidden