细节调整

src/components/ImageShare.vue

@@ -1,168 +0,0 @@
-<script setup>
-import useStore from "@/store";
-import Avatar from "@/components/Avatar.vue";
-
-import { storeToRefs } from "pinia";
-const store = useStore();
-const { user } = storeToRefs(store);
-
-const props = defineProps({
-  show: {
-    type: Boolean,
-    default: false,
-  },
-  type: {
-    type: String,
-    default: "",
-  },
-  onClose: {
-    type: Function,
-    default: () => {},
-  },
-});
-
-const saveImage = () => {
-  // 获取当前页面的节点
-  const query = uni.createSelectorQuery();
-  query
-    .select(".content")
-    .fields({ node: true, size: true })
-    .exec((res) => {
-      // 创建canvas上下文
-      const canvas = uni.createCanvasContext("shareCanvas");
-
-      // 将页面内容绘制到canvas上
-      // 这里需要根据实际内容进行绘制
-      canvas.draw(false, () => {
-        // 将画布内容保存为图片
-        uni.canvasToTempFilePath({
-          canvasId: "shareCanvas",
-          success: (res) => {
-            const tempFilePath = res.tempFilePath;
-
-            // 保存图片到相册
-            uni.saveImageToPhotosAlbum({
-              filePath: tempFilePath,
-              success: () => {
-                uni.showToast({ title: "保存成功" });
-              },
-              fail: () => {
-                uni.showToast({ title: "保存失败", icon: "error" });
-              },
-            });
-          },
-        });
-      });
-    });
-};
-</script>
-
-<template>
-  <view class="container" :style="{ display: show ? 'flex' : 'none' }">
-    <view class="header">
-      <view @click="onClose">
-        <image src="../static/close-white.png" mode="widthFix" />
-      </view>
-    </view>
-    <view class="content">
-      <image src="../static/share-bg.png" mode="widthFix" />
-      <view>
-        <Avatar :src="user.avatar" :size="40" frame />
-        <view>
-          <text>{{ user.nickName }}</text>
-          <text>{{ user.lvlName }}</text>
-        </view>
-      </view>
-    </view>
-    <view class="footer">
-      <view>
-        <image src="../static/wechat-outline.png" mode="widthFix" />
-        <text>微信好友</text>
-      </view>
-      <view>
-        <image src="../static/wechat-moment.png" mode="widthFix" />
-        <text>朋友圈</text>
-      </view>
-      <view @click="saveImage">
-        <image src="../static/download.png" mode="widthFix" />
-        <text>保存到相册</text>
-      </view>
-    </view>
-  </view>
-</template>
-
-<style scoped>
-.container {
-  width: 100vw;
-  height: 100vh;
-  position: fixed;
-  top: 0;
-  left: 0;
-  background-color: rgba(0, 0, 0, 0.6);
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  z-index: 10;
-}
-.header {
-  width: 100%;
-  display: flex;
-  justify-content: flex-start;
-  margin-bottom: 20px;
-}
-.header > view > image {
-  width: 40px;
-  padding: 10px;
-}
-.content {
-  width: 75vw;
-  height: 130vw;
-  position: relative;
-}
-.content > image:first-child {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  border-radius: 15px;
-  z-index: -1;
-}
-.content > view:nth-child(2) {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  padding: 20px 15px;
-}
-.content > view:nth-child(2) > view:last-child {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  color: #fff;
-  font-size: 14px;
-  margin-left: 10px;
-}
-.content > view:nth-child(2) > view:last-child > text:last-child {
-  font-size: 10px;
-  padding: 2px 5px;
-  background-color: #5f51ff;
-  border-radius: 10px;
-  color: #fff9;
-  margin-top: 5px;
-}
-.footer {
-  width: 100%;
-  display: flex;
-  justify-content: space-around;
-  margin-top: 50px;
-}
-.footer > view {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  color: #fff;
-  font-size: 12px;
-}
-.footer > view > image {
-  width: 45px;
-  margin-bottom: 10px;
-}
-</style>

src/components/ShootProgress.vue

@@ -142,5 +142,6 @@ onUnmounted(() => {
 }
 .container > view:last-child > text {
   z-index: 1;
+  color: #000;
 }
 </style>

src/components/Signin.vue

@@ -86,7 +86,7 @@ const handleLogin = () => {
         class="login-btn"
         hover-class="none"
       >
-        <Avatar v-if="avatarUrl" :src="avatarUrl" />
+        <Avatar v-if="avatarUrl" :src="avatarUrl" :size="30" />
         <text v-else>点击获取</text>
       </button>
     </view>
@@ -94,7 +94,6 @@ const handleLogin = () => {
       <text>昵称:</text>
       <input
         type="nickname"
-        class="nickname-input"
         placeholder="请输入昵称"
         placeholder-style="color: #fff9"
         @change="onNicknameChange"
@@ -156,7 +155,7 @@ const handleLogin = () => {
 .nickname > input {
   flex: 1;
   font-size: 14px;
-  color: #000;
+  color: #fff;
 }
 .wechat-icon {
   width: 24px;