shaogen1995 2 лет назад
Родитель
Сommit
4313d9077a

+ 1 - 1
miniProgram/components/authorize/index.js

@@ -80,7 +80,7 @@ Component({
 
           let respon = JSON.parse(res.data)
           this.setData({
-            avatarUrl: API_BASE_URL + (API_BASE_URL.length > 10 ? 'api' : '') + respon.data.filePath
+            avatarUrl: API_BASE_URL + (API_BASE_URL.length > 10 ? '' : '') + respon.data.filePath
           })
 
         },

+ 2 - 2
web/public/program/index.html

@@ -202,8 +202,8 @@
 
         // 到处逛逛
         else if (res.data.source === "ShowUserData") {
-          console.log('到处逛逛,用户id:', id);
-          unityInstance.SendMessage('Main', 'ShowUserData', id);
+          console.log('到处逛逛,用户id:', data);
+          unityInstance.SendMessage('Main', 'ShowUserData', data);
         }
 
         // 点击编辑

+ 24 - 2
web/src/App.vue

@@ -1,5 +1,10 @@
 
 <template>
+  <!-- 左上方标题 -->
+  <div class="appLeftTiele">
+    <img :src="`${config.cdn_url}images/appLeftTiele.png`" alt="" />
+  </div>
+
   <iframe
     class="ifr"
     id="ifr"
@@ -67,7 +72,9 @@ const onLoadIfr = () => {
 
       //禁用ui
       dom1.style.opacity = "0.4";
+      dom1.style.pointerEvents = "none";
       dom2.style.opacity = "0.4";
+      dom2.style.pointerEvents = "none";
     }
     if (e.data.source === "enableUIInteract") {
       window.noClickUi = false;
@@ -76,7 +83,9 @@ const onLoadIfr = () => {
 
       //禁用ui
       dom1.style.opacity = "1";
+      dom1.style.pointerEvents = "auto";
       dom2.style.opacity = "1";
+      dom2.style.pointerEvents = "auto";
     }
   });
 };
@@ -94,6 +103,19 @@ onMounted(async () => {
 @import "@/assets/style/reset.css";
 @import "@/assets/style/my-reset.css";
 
+.appLeftTiele {
+  position: fixed;
+  z-index: 99;
+  top: 18px;
+  left: 15px;
+  height: 18px;
+  pointer-events: none;
+  &>img{
+    height: 100%;
+    pointer-events: none;
+  }
+}
+
 html,
 body {
   height: 100%;
@@ -119,8 +141,8 @@ body {
     bottom: 40px;
     background: linear-gradient(
       270deg,
-      #c1a97a 0%,
-      rgba(193, 169, 122, 0) 100%
+      rgba(171, 164, 142, 1),
+      rgba(171, 164, 142, 0)
     );
     display: flex;
     align-items: center;

+ 3 - 1
web/src/config.js

@@ -1,3 +1,5 @@
 export default {
-  cdn_url: 'https://culture.4dage.com/hn_museum_game/', // 部署在国内
+  // cdn_url: 'https://culture.4dage.com/hn_museum_game/', // 部署在国内
+  
+  cdn_url: 'http://192.168.20.48:8080/',// 开发环境
 }

+ 44 - 54
web/src/views/Editing.vue

@@ -10,7 +10,6 @@
     </ul>
 
     <div class="left-area">
-      <img class="wuding" :src="`${config.cdn_url}images/wuding.png`" alt="" />
       <ul>
         <li
           @click="onClickLeft(item)"
@@ -132,6 +131,26 @@ let colorsList = reactive([
     id: 2,
     color: "#9F7F6A",
   },
+  {
+    id: 3,
+    color: "#D3C9C3",
+  },
+  {
+    id: 4,
+    color: "#484F55",
+  },
+  {
+    id: 5,
+    color: "#6F8C8E",
+  },
+  {
+    id: 6,
+    color: "#6584A1",
+  },
+  {
+    id: 7,
+    color: "#80AC92",
+  },
 ]);
 
 const currentActive = ref({ id: -1 });
@@ -252,13 +271,6 @@ const cutThreeTab = (id, num) => {
   }
 };
 
-// 拼接模型成功,接受 unity的消息 取消 模型的选中ui效果
-// window.onmessage=(e)=>{
-//       if (e.data.source === "disableUIInteract") {
-//         console.log('pppppppppppppp--------------');
-//     }
-// }
-
 onMounted(() => {
   window.addEventListener("message", (e) => {
     if (e.data.source === "modelSuccItem") {
@@ -297,28 +309,26 @@ onMounted(() => {
   .left-area {
     width: 20%;
     height: 100%;
-    background: rgba(193, 169, 122, 0.5);
     position: absolute;
     left: 0;
-    top: 0;
-    backdrop-filter: blur(8px);
-    display: flex;
-    flex-direction: column;
-
-    .wuding {
-      width: 120%;
-    }
+    top: 50px;
+    height: calc(100% - 50px);
+    background-image: linear-gradient(
+      rgba(193, 169, 122, 0),
+      rgba(193, 169, 122, 1)
+    );
 
     > ul {
       display: flex;
       flex-direction: column;
       justify-content: space-around;
       align-items: center;
-      height: 92%;
+      height: 100%;
 
       > li {
-        color: #fff;
-        font-size: 18px;
+        opacity: .8;
+        color: #706764;
+        font-size: 16px;
         font-weight: bold;
         width: 50%;
         display: inline-block;
@@ -358,18 +368,8 @@ onMounted(() => {
         }
 
         &.active {
-          position: relative;
-          color: $font-active-color;
-
-          > img {
-            left: 50%;
-            top: 50%;
-            transform: translate(-50%, -50%);
-            width: 110%;
-            position: absolute;
-            opacity: 1;
-            display: inline-block;
-          }
+          color: #3d4a51;
+          opacity: 1;
         }
       }
     }
@@ -381,12 +381,7 @@ onMounted(() => {
     right: 0;
     width: 80%;
     height: 40px;
-    background: linear-gradient(
-      270deg,
-      rgba(193, 169, 122, 0.8) 0%,
-      rgba(193, 169, 122, 0.3) 100%
-    );
-    backdrop-filter: blur(4px);
+    background-color: rgba(193, 169, 122, 0.8);
     display: flex;
     align-items: center;
     color: #fff;
@@ -417,28 +412,22 @@ onMounted(() => {
     bottom: 0;
     right: 0;
     width: 80%;
-    background: linear-gradient(
-      270deg,
-      rgba(193, 169, 122, 0.8) 0%,
-      rgba(193, 169, 122, 0.3) 100%
-    );
-    backdrop-filter: blur(4px);
+    background-color: rgba(193, 169, 122, 0.8);
     display: flex;
     align-items: center;
     color: #fff;
     justify-content: space-around;
     font-size: 12px;
     font-weight: bold;
-    padding: 10px 0;
-    height: 74px;
 
     .typecon {
       display: flex;
-      width: 20%;
+      width: 40%;
       justify-content: flex-end;
 
       > img {
-        margin: 0 10px;
+        width: 50%;
+        height: 100%;
       }
     }
 
@@ -455,7 +444,7 @@ onMounted(() => {
     }
 
     .b-list {
-      width: 80%;
+      width: 60%;
       white-space: nowrap;
       overflow-x: auto;
       overflow-y: hidden;
@@ -469,11 +458,12 @@ onMounted(() => {
 
         > li {
           display: inline-block;
-          width: 50px;
-          height: 50px;
+          width: 46px;
+          height: 46px;
           margin: 0 20px;
           background: #e8deca;
           border-radius: 2px;
+          border: 2px solid transparent;
 
           > img {
             width: 100%;
@@ -482,18 +472,18 @@ onMounted(() => {
           }
 
           &.active {
-            border: 2px solid #fff;
+            border: 2px solid #3D4A51;
           }
 
           &.colorActive {
-            border: 2px solid #961014;
+            border: 2px solid #fff;
           }
         }
       }
       .txtTit {
         padding-left: 30px;
         font-size: 16px;
-        color: #961014;
+        color: #3d4a51;
       }
     }
   }

+ 51 - 62
web/src/views/Integral.vue

@@ -1,7 +1,14 @@
 <template>
   <div class="integral">
     <div class="left-area">
-      <img class="wuding" :src="`${config.cdn_url}images/wuding2.png`" alt="" />
+      <div class="leftTopBox">
+        <div @click="type = 'hot'" :class="{ activeTop: type == 'hot' }">
+          热度榜
+        </div>
+        <div @click="type = 'plaza'" :class="{ activeTop: type == 'plaza' }">
+          广场
+        </div>
+      </div>
       <ul>
         <li
           @click="onClickItem(item)"
@@ -26,26 +33,6 @@
           <div class="b-line"></div>
         </li>
       </ul>
-      <div class="menu">
-        <div @click="type = 'hot'">
-          <img
-            class="hot"
-            :src="`${config.cdn_url}images/btn_hot_${
-              type == 'hot' ? 'active' : 'normal'
-            }.png`"
-            alt=""
-          />
-        </div>
-        <div @click="type = 'plaza'">
-          <img
-            class="plaza"
-            :src="`${config.cdn_url}images/btn_square_${
-              type == 'plaza' ? 'active' : 'normal'
-            }.png`"
-            alt=""
-          />
-        </div>
-      </div>
     </div>
 
     <div class="center-area" @click="toggleLike">
@@ -139,22 +126,53 @@ watch(
 <style lang="scss" scoped>
 .integral {
   .left-area {
-    width: 28%;
+    width: 234px;
     height: 100%;
-    background: rgba(193, 169, 122, 0.5);
     position: absolute;
     left: 0;
     top: 0;
-    backdrop-filter: blur(8px);
-    display: flex;
-    flex-direction: column;
+    background-image: linear-gradient(
+      rgba(193, 169, 122, 0),
+      rgba(193, 169, 122, 1)
+    );
+    padding-top: 50px;
+
+    .leftTopBox {
+      height: 40px;
+      display: flex;
 
-    .wuding {
-      width: 120%;
+      > div {
+        width: 50%;
+        height: 100%;
+        padding: 2px 4px;
+        color: #3d4a51;
+        position: relative;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        &::before {
+          content: "";
+          position: absolute;
+          width: 90%;
+          height: 34px;
+          top: 50%;
+          left: 50%;
+          transform: translate(-50%, -50%);
+          border: 1px solid #3d4a51;
+        }
+      }
+      .activeTop {
+        background-color: #404c53;
+        color: #e2d4b8;
+        &::before {
+          border: 1px solid #e2d4b8;
+        }
+      }
     }
 
     > ul {
-      height: calc(100% - 8px);
+      margin-top: 10px;
+      height: calc(100% - 50px);
       overflow-y: auto;
       overflow-x: hidden;
 
@@ -234,45 +252,16 @@ watch(
           position: relative;
           background: linear-gradient(
             90deg,
-            #961014 0%,
-            rgba(150, 16, 20, 0) 100%
+            #404C53 0%,
+            rgba(64, 76, 83, 0) 100%
           );
 
           .like {
-            color: $font-active-color;
+            color: #3D4A51;
           }
         }
       }
     }
-
-    .menu {
-      position: absolute;
-      right: -20%;
-      width: 18%;
-      z-index: -1;
-
-      > div {
-        width: 100%;
-        margin-top: 20px;
-        position: relative;
-
-        &::before {
-          width: 1px;
-          height: 24px;
-          content: "";
-          display: inline-block;
-          position: absolute;
-          left: 50%;
-          transform: translateX(-50%);
-          top: -22px;
-          background: $font-active-color;
-        }
-
-        > img {
-          width: 100%;
-        }
-      }
-    }
   }
 
   .center-area {
@@ -298,7 +287,7 @@ watch(
       border-radius: 50%;
       overflow: hidden;
       display: inline-block;
-      background: #c1a97a;
+      background: #3D4A51;
       color: #fff;
       box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
     }