upp

miniProgram/pages/index/index.less

@@ -1,41 +1,36 @@
 /**index.wxss**/
-.home{
+.home {
   width: 100%;
   height: 100%;
   position: relative;
-  background-size: cover;
+  background-size: 100% 100%;
   background-position: right bottom;
-  .left{
+
+  .left {
     position: absolute;
-    width: 36%;
-    left: 10%;
-    top: 50%;
-    transform: translateY(-50%);
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    >image{
-      width: 100%;
-      &:last-of-type{
-        width: 72%;
-      }
+    left: 11%;
+    bottom: 14%;
+
+    &>image {
+      width: 200px;
     }
   }
 }
 
-.video{
+.video {
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: 999;
-  >video{
+
+  >video {
     width: 100%;
     height: 100%;
   }
-  .jump{
+
+  .jump {
     position: absolute;
     top: 10rpx;
     right: 20rpx;
@@ -44,7 +39,7 @@
   }
 }
 
-.auth{
+.auth {
   position: fixed;
   left: 0;
   top: 110%;
@@ -57,8 +52,8 @@
   opacity: 0;
 }
 
-.auth_show{
+.auth_show {
   pointer-events: auto;
   opacity: 1;
   top: 0;
-}
+}

miniProgram/pages/index/index.wxml

@@ -1,7 +1,6 @@
 <!--index.wxml-->
-<view class="home" style="background-image:url({{CDN_URL}}images/bg.jpg)">
+<view class="home" style="background-image:url({{CDN_URL}}images/weixinBac.jpg)">
   <view class="left">
-    <image src="{{CDN_URL}}images/title.png" mode="widthFix" />
     <image bindtap="onStart" src="{{CDN_URL}}images/btn_start.png" mode="widthFix" />
   </view>
 </view>

miniProgram/pages/index/index.wxss

@@ -3,26 +3,20 @@
   width: 100%;
   height: 100%;
   position: relative;
-  background-size: cover;
+  background-size: 100% 100%;
   background-position: right bottom;
 }
+
 .home .left {
   position: absolute;
-  width: 36%;
-  left: 10%;
-  top: 50%;
-  transform: translateY(-50%);
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
+  left: 11%;
+  bottom: 14%;
 }
-.home .left > image {
-  width: 100%;
-}
-.home .left > image:last-of-type {
-  width: 72%;
+
+.home .left>image {
+  width: 200px;
 }
+
 .video {
   position: fixed;
   left: 0;
@@ -31,10 +25,12 @@
   height: 100%;
   z-index: 999;
 }
-.video > video {
+
+.video>video {
   width: 100%;
   height: 100%;
 }
+
 .video .jump {
   position: absolute;
   top: 10rpx;
@@ -42,6 +38,7 @@
   z-index: 1000;
   color: #fff;
 }
+
 .auth {
   position: fixed;
   left: 0;
@@ -54,8 +51,9 @@
   pointer-events: none;
   opacity: 0;
 }
+
 .auth_show {
   pointer-events: auto;
   opacity: 1;
   top: 0;
-}
+}

web/public/program/index copy.html

@@ -202,7 +202,7 @@
 
         // 到处逛逛
         else if (res.data.source === "ShowUserData") {
-          console.log('到处逛逛，用户id:', data);
+          console.log('到处逛逛，用户id:', data, '不知道为啥报错？？');
           unityInstance.SendMessage('Main', 'ShowUserData', data);
         }
 

web/src/App.vue

@@ -28,6 +28,8 @@
     </Transition>
     <Transition>
       <IntegralDetail
+        :point="point"
+        :userInfo="userInfo"
         v-if="isShowIntegralDetail"
         @close="isShowIntegralDetail = false"
       />
@@ -110,7 +112,7 @@ onMounted(async () => {
   left: 15px;
   height: 18px;
   pointer-events: none;
-  &>img{
+  & > img {
     height: 100%;
     pointer-events: none;
   }

web/src/components/Integral-detail.vue

@@ -1,10 +1,48 @@
 <template>
   <div class="integral-detail">
-    <div class="id-header">
-      <img class="hot" :src="`${config.cdn_url}images/icon_copper.png`" alt="">
+    <div class="id-header" v-if="props.point || props.point === 0">
+      <img
+        class="hot"
+        :src="`${config.cdn_url}images/icon_copper.png`"
+        v-if="props.point <= 2000"
+        alt=""
+      />
+      <img
+        class="hot"
+        :src="`${config.cdn_url}images/icon_sliver.png`"
+        v-else-if="props.point <= 5000"
+        alt=""
+      />
+      <img
+        class="hot"
+        :src="`${config.cdn_url}images/icon_golden.png`"
+        v-else-if="props.point <= 10000"
+        alt=""
+      />
+      <img
+        class="hot"
+        :src="`${config.cdn_url}images/icon_diamond.png`"
+        v-else
+        alt=""
+      />
       <div>
-        <p>恭喜您，获得青铜勋章</p>
-        <p>您当前的积分：142</p>
+        <p v-if="props.point <= 2000">恭喜您，获得青铜勋章</p>
+        <p v-else-if="props.point <= 5000">恭喜您，获得白银勋章</p>
+        <p v-else-if="props.point <= 10000">恭喜您，获得黄金勋章</p>
+        <p v-else>恭喜您，获得砖石勋章</p>
+        <p>您当前的积分：{{ props.point }}</p>
+      </div>
+    </div>
+
+    <!-- 用户信息 -->
+    <div class="userInfoBox" v-if="props.userInfo">
+      <div class="userRow">
+        <div class="rowOne">用户昵称：</div>
+        <div class="rowTxt">{{ props.userInfo.nickName }}</div>
+      </div>
+      <div class="userRow">
+        <div class="rowOne">手机号：</div>
+        <div class="rowTxt">{{ props.userInfo.phone }}</div>
       </div>
     </div>
 
@@ -23,51 +61,62 @@
     </div>
 
     <div class="id-btm" @click="$emit('close')">
-        <img :src="`${config.cdn_url}images/btn_back.png`" alt="">
+      <img :src="`${config.cdn_url}images/btn_back.png`" alt="" />
     </div>
   </div>
 </template>
 
 <script setup>
-import { ref } from "vue"
+//子组件接收
+const props = defineProps(["point", "userInfo"]);
+
+console.log("pppppppppp", props.point, props.userInfo);
+
+import { ref } from "vue";
 
 const table = [
   {
-    action: '首次登陆',
-    integral: '+500',
-    limit: '/',
-  }, {
-    action: '每日登录',
-    integral: '+100',
-    limit: '/',
-  }, {
-    action: '点赞',
-    integral: '+100',
-    limit: '500',
-  }, {
-    action: '分享',
-    integral: '+300',
-    limit: '900',
-  }, {
-    action: '青铜勋章',
-    integral: '0-2000',
-    limit: '/',
-  }, {
-    action: '白银勋章',
-    integral: '2001-5000',
-    limit: '/',
-  }, {
-    action: '黄金勋章',
-    integral: '5001-10000',
-    limit: '/',
-  }, {
-    action: '钻石勋章',
-    integral: '10001以上',
-    limit: '/',
+    action: "首次登陆",
+    integral: "+500",
+    limit: "/",
   },
-]
-const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`)
-
+  {
+    action: "每日登录",
+    integral: "+100",
+    limit: "/",
+  },
+  {
+    action: "点赞",
+    integral: "+100",
+    limit: "500",
+  },
+  {
+    action: "分享",
+    integral: "+300",
+    limit: "900",
+  },
+  {
+    action: "青铜勋章",
+    integral: "0-2000",
+    limit: "/",
+  },
+  {
+    action: "白银勋章",
+    integral: "2001-5000",
+    limit: "/",
+  },
+  {
+    action: "黄金勋章",
+    integral: "5001-10000",
+    limit: "/",
+  },
+  {
+    action: "钻石勋章",
+    integral: "10001以上",
+    limit: "/",
+  },
+];
+const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`);
 </script>
 
 <style lang="scss" scoped>
@@ -85,27 +134,30 @@ const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`)
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center bottom;
-  z-index: 999;
+  z-index: 98;
   .id-header {
     display: flex;
     justify-content: center;
     align-items: center;
 
-    >img {
+    > img {
       width: 150px;
       height: auto;
       transform: translate(30px, -10px);
     }
 
-    >div {
+    > div {
       text-align: center;
 
-      >p {
+      > p {
         font-size: 14px;
-        color: #63543D;
+        color: #706764;
+        opacity: 0.6;
 
         &:first-of-type {
-          color: $font-active-color;
+          opacity: 1;
+          color: black;
+          font-weight: 700;
           font-size: 18px;
           margin-bottom: 10px;
         }
@@ -113,9 +165,26 @@ const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`)
     }
   }
 
+  .userInfoBox {
+    display: flex;
+    width: 100%;
+    justify-content: center;
+    position: relative;
+    top: -36px;
+    color: #706764;
+    .userRow {
+      display: flex;
+      margin: 0 20px;
+      .rowTxt {
+        border-bottom: 1px solid #706764;
+        padding: 0 20px 8px 8px;
+      }
+    }
+  }
+
   .id-con {
-    background: #FEF8F1;
-    color: #63543D;
+    background: #fef8f1;
+    color: #63543d;
     display: flex;
     padding: 4px 10px;
     transform: translateY(-20px);
@@ -126,7 +195,7 @@ const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`)
       align-items: center;
       justify-content: center;
 
-      >li {
+      > li {
         width: 100%;
         padding: 6px;
         box-sizing: border-box;
@@ -143,19 +212,18 @@ const bgImage = ref(`url(${config.cdn_url}images/background.jpg)`)
       }
 
       &:last-of-type {
-        >li {
+        > li {
           border-right: none;
         }
       }
-
     }
   }
 
-  .id-btm{
+  .id-btm {
     margin: 10px auto 0;
     width: 15%;
     text-align: center;
-    >img{
+    > img {
       width: 100%;
     }
   }