代码优化

2026-01-09 13:44:29 +08:00
parent 71b25144a4
commit ddf0dafe08
5 changed files with 98 additions and 86 deletions
--- a/src/components/Signin.vue
+++ b/src/components/Signin.vue
@@ -1,6 +1,7 @@
 <script setup>
 import { ref } from "vue";
 import { onShow } from "@dcloudio/uni-app";
+import SModal from "@/components/SModal.vue";
 import Avatar from "@/components/Avatar.vue";
 import SButton from "@/components/SButton.vue";

@@ -18,6 +19,10 @@ const store = useStore();
 const { updateUser, updateDevice, updateOnline } = store;

 const props = defineProps({
+  show: {
+    type: Boolean,
+    default: false,
+  },
  noBg: {
    type: Boolean,
    default: false,
@@ -132,78 +137,90 @@ onShow(() => {
 </script>

 <template>
-  <view class="container" :style="{ background: noBg ? '#fff' : 'none' }">
-    <view class="avatar" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }">
-      <text :style="{ color: noBg ? '#666' : '#fff' }">手机:</text>
-      <button
-        :open-type="!phone ? 'getPhoneNumber' : ''"
-        @getphonenumber="getphonenumber"
-        class="login-btn"
-        hover-class="none"
+  <SModal :show="show" :onClose="onClose" :noBg="noBg">
+    <view class="container" :style="{ background: noBg ? '#fff' : 'none' }">
+      <view class="avatar" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }">
+        <text :style="{ color: noBg ? '#666' : '#fff' }">手机:</text>
+        <button
+          :open-type="!phone ? 'getPhoneNumber' : ''"
+          @getphonenumber="getphonenumber"
+          class="login-btn"
+          hover-class="none"
+        >
+          <text v-if="phone" :style="{ color: noBg ? '#333' : '#fff' }">{{
+            phone
+          }}</text>
+          <text v-else :style="{ color: noBg ? '#666' : '#fff9' }"
+            >点击获取</text
+          >
+          <image src="../static/enter.png" mode="widthFix" />
+        </button>
+      </view>
+      <view class="avatar" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }">
+        <text :style="{ color: noBg ? '#666' : '#fff' }">头像:</text>
+        <button
+          open-type="chooseAvatar"
+          @chooseavatar="onChooseAvatar"
+          class="login-btn"
+          hover-class="none"
+        >
+          <Avatar v-if="avatarUrl" :src="avatarUrl" :size="30" />
+          <text v-else :style="{ color: noBg ? '#666' : '#fff9' }"
+            >点击获取</text
+          >
+          <image src="../static/enter.png" mode="widthFix" />
+        </button>
+      </view>
+      <view
+        class="nickname"
+        :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }"
      >
-        <text v-if="phone" :style="{ color: noBg ? '#333' : '#fff' }">{{
-          phone
-        }}</text>
-        <text v-else :style="{ color: noBg ? '#666' : '#fff9' }">点击获取</text>
-        <image src="../static/enter.png" mode="widthFix" />
-      </button>
-    </view>
-    <view class="avatar" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }">
-      <text :style="{ color: noBg ? '#666' : '#fff' }">头像:</text>
-      <button
-        open-type="chooseAvatar"
-        @chooseavatar="onChooseAvatar"
-        class="login-btn"
-        hover-class="none"
-      >
-        <Avatar v-if="avatarUrl" :src="avatarUrl" :size="30" />
-        <text v-else :style="{ color: noBg ? '#666' : '#fff9' }">点击获取</text>
-        <image src="../static/enter.png" mode="widthFix" />
-      </button>
-    </view>
-    <view class="nickname" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff3' }">
-      <text :style="{ color: noBg ? '#666' : '#fff' }">昵称:</text>
-      <input
-        type="nickname"
-        placeholder="请输入昵称"
-        :placeholder-style="`color: ${noBg ? '#666' : '#fff9'} `"
-        @change="onNicknameChange"
-        @blur="onNicknameBlur"
-        :style="{ color: noBg ? '#333' : '#fff' }"
-      />
-    </view>
-    <SButton :rounded="20" width="80vw" :onClick="handleLogin">
-      <block v-if="!loading">
-        <text :style="{ color: '#000' }">手机号快捷登录</text>
-      </block>
-      <block v-else>
-        <image
-          src="../static/btn-loading.png"
-          mode="widthFix"
-          class="loading"
+        <text :style="{ color: noBg ? '#666' : '#fff' }">昵称:</text>
+        <input
+          type="nickname"
+          placeholder="请输入昵称"
+          :placeholder-style="`color: ${noBg ? '#666' : '#fff9'} `"
+          @change="onNicknameChange"
+          @blur="onNicknameBlur"
+          :style="{ color: noBg ? '#333' : '#fff' }"
        />
-      </block>
-    </SButton>
-    <view class="protocol" @click="handleAgree">
-      <view v-if="!agree" :style="{ borderColor: noBg ? '#E3E3E3' : '#fff' }" />
-      <image v-if="agree" src="../static/checked.png" mode="widthFix" />
-      <view>
-        <text>已同意并阅读</text>
+      </view>
+      <SButton :rounded="20" width="80vw" :onClick="handleLogin">
+        <block v-if="!loading">
+          <text :style="{ color: '#000' }">手机号快捷登录</text>
+        </block>
+        <block v-else>
+          <image
+            src="../static/btn-loading.png"
+            mode="widthFix"
+            class="loading"
+          />
+        </block>
+      </SButton>
+      <view class="protocol" @click="handleAgree">
        <view
-          @click.stop="openServiceLink"
-          :style="{ color: noBg ? '#333' : '#ffffff99' }"
-          >《用户协议》</view
-        >
-        <text>及</text>
-        <view
-          @click.stop="openPrivacyLink"
-          :style="{ color: noBg ? '#333' : '#ffffff99' }"
-          >《隐私协议》</view
-        >
-        <text>内容</text>
+          v-if="!agree"
+          :style="{ borderColor: noBg ? '#E3E3E3' : '#fff' }"
+        />
+        <image v-if="agree" src="../static/checked.png" mode="widthFix" />
+        <view>
+          <text>已同意并阅读</text>
+          <view
+            @click.stop="openServiceLink"
+            :style="{ color: noBg ? '#333' : '#ffffff99' }"
+            >《用户协议》</view
+          >
+          <text>及</text>
+          <view
+            @click.stop="openPrivacyLink"
+            :style="{ color: noBg ? '#333' : '#ffffff99' }"
+            >《隐私协议》</view
+          >
+          <text>内容</text>
+        </view>
      </view>
    </view>
-  </view>
+  </SModal>
 </template>

 <style scoped>
--- a/src/pages/be-vip.vue
+++ b/src/pages/be-vip.vue
@@ -3,7 +3,6 @@ import { ref, onMounted, onBeforeUnmount } from "vue";
 import Container from "@/components/Container.vue";
 import Avatar from "@/components/Avatar.vue";
 import SButton from "@/components/SButton.vue";
-import SModal from "@/components/SModal.vue";
 import Signin from "@/components/Signin.vue";
 import UserHeader from "@/components/UserHeader.vue";
 import { createOrderAPI, getHomeData, getVIPDescAPI } from "@/apis";
@@ -151,15 +150,13 @@ onBeforeUnmount(() => {
          </view>
        </view>
        <SButton :onClick="onPay">支付</SButton>
-        <SModal :show="showModal" :onClose="() => (showModal = false)">
-          <Signin :onClose="() => (showModal = false)" />
-        </SModal>
        <view class="my-orders" v-if="user.id">
          <view @click="toOrderPage">
            <text>我的订单</text>
            <image src="../static/enter-arrow-blue.png" mode="widthFix" />
          </view>
        </view>
+        <Signin :show="showModal" :onClose="() => (showModal = false)" />
      </view>
    </view>
  </Container>
--- a/src/pages/friend-battle.vue
+++ b/src/pages/friend-battle.vue
@@ -62,16 +62,18 @@ const onCreateRoom = async () => {
  showModal.value = true;
 };
 const onSignin = () => {
+  if (roomID.value && user.value.id) enterRoom(roomID.value);
  showSignin.value = false;
-  if (roomID.value) enterRoom(roomID.value);
 };
 onShow(async () => {
-  const result = await getBattleDataAPI();
-  data.value = result;
+  if (user.value.id) {
+    const result = await getBattleDataAPI();
+    data.value = result;
+  }
 });
 onLoad(async (options) => {
-  roomID.value = options.roomID || "";
  if (options.roomID) {
+    roomID.value = options.roomID;
    if (user.value.id) enterRoom(options.roomID);
    else showSignin.value = true;
  }
@@ -167,9 +169,7 @@ onLoad(async (options) => {
        </view>
        <CreateRoom v-if="!warnning" :onConfirm="() => (showModal = false)" />
      </SModal>
-      <SModal :show="showSignin" :onClose="() => (showSignin = false)">
-        <Signin :onClose="onSignin" />
-      </SModal>
+      <Signin :show="showSignin" :onClose="onSignin" />
    </view>
  </Container>
 </template>
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -5,7 +5,6 @@ import Container from "@/components/Container.vue";
 import AppFooter from "@/components/AppFooter.vue";
 import AppBackground from "@/components/AppBackground.vue";
 import UserHeader from "@/components/UserHeader.vue";
-import SModal from "@/components/SModal.vue";
 import Signin from "@/components/Signin.vue";
 import BubbleTip from "@/components/BubbleTip.vue";

@@ -244,9 +243,7 @@ onShareTimeline(() => {
          </view>
        </view>
      </view>
-      <SModal :show="showModal" :onClose="() => (showModal = false)">
-        <Signin :onClose="() => (showModal = false)" />
-      </SModal>
+      <Signin :show="showModal" :onClose="() => (showModal = false)" />
    </view>
    <AppFooter />
  </Container>
--- a/src/pages/point-book.vue
+++ b/src/pages/point-book.vue
@@ -4,7 +4,6 @@ import { onShow, onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
 import Container from "@/components/Container.vue";
 import PointRecord from "@/components/PointRecord.vue";
 import RingBarChart from "@/components/RingBarChart.vue";
-import SModal from "@/components/SModal.vue";
 import Signin from "@/components/Signin.vue";
 import ScreenHint2 from "@/components/ScreenHint2.vue";
 import RewardUs from "@/components/RewardUs.vue";
@@ -400,9 +399,11 @@ onShareTimeline(() => {
        <image src="../static/enter-arrow-blue.png" mode="widthFix" />
      </view>
    </view>
-    <SModal :show="showModal" :onClose="() => (showModal = false)" :noBg="true">
-      <Signin :onClose="() => (showModal = false)" :noBg="true" />
-    </SModal>
+    <Signin
+      :show="showModal"
+      :onClose="() => (showModal = false)"
+      :noBg="true"
+    />
    <ScreenHint2 :show="showTip || showTip2" :onClose="closeHint">
      <RewardUs
        v-if="showTip"