🔀 Merge pull request #89 from AyakaLab/nekomeowww/dev

🐛 Compatible with safari,  fixed user loading error

Author: nekomeowww

src/assets/music/FlowerDance.jpg

@@ -349,6 +349,7 @@ export default {
 .link {
   margin-left: .75rem;
   font-size: 1.2rem;
+  color: white;
   img {
     height: 3rem;
   }

src/assets/music/FlowerDance.mp3

@@ -15,6 +15,7 @@
       text-align: left;
     }
   }
+
   /deep/ .v-autocomplete:not(.v-input--is-disabled).v-select.v-text-field input {
     color: white;
   }

src/components/Header.vue

@@ -44,7 +44,7 @@ export default {
   height: 100%;
   display: flex;
   flex-direction: column;
-  background: #0000;
+  background: #0000 !important;
 }
 .slot-shell {
   margin-top: 73px;

src/components/Layout/AppStyle.less

@@ -38,6 +38,9 @@ export default {
     introduction () {
       return this.user.introduction
     }
+  },
+  created () {
+    console.log(this.user)
   }
 }
 </script>

src/components/Layout/Space.css

@@ -153,7 +153,7 @@ export default {
     border-radius: 100%/100%;
     background: #FF92BC;
     filter: blur(30px);
-    -webkit-filter: blur(200px);
+    -webkit-filter: blur(30px);
     opacity: 0.7;
     top: -10%;
 }

src/components/Layout/Space.vue

@@ -176,8 +176,6 @@
 import spaceLayout from '@/components/Layout/Space'
 import miniAvatar from '@/components/User/MiniAvatar'
 
-import mp3 from '@/assets/music/FlowerDance.mp3'
-import album from '@/assets/music/FlowerDance.jpg'
 import api from '@/api/api'
 import decode from '@/util/decode'
 import { mapState } from 'vuex'
@@ -210,14 +208,6 @@ export default {
       owned: false,
       showDialog: false,
       loading: true,
-      audioList: {
-        flowerdance: {
-          name: 'Flower Dance',
-          artist: 'DJ OKAWARI',
-          url: mp3,
-          cover: album
-        }
-      },
       users: [
         {
           avatar: 'https://picsum.photos/510/300?random'
@@ -375,7 +365,7 @@ export default {
           const reader = new FileReader()
           reader.readAsArrayBuffer(new Blob([music.data], { type: music.type }))
           reader.onload = (event) => {
-            const url = window.webkitURL.createObjectURL(new Blob([event.target.result]))
+            const url = window.webkitURL.createObjectURL(new Blob([event.target.result], { type: music.type }))
             resolve(url)
           }
         } catch (e) {
@@ -640,6 +630,9 @@ export default {
       color: white;
       line-height: 20px;
       margin: 8px 0 0;
+      &:hover {
+        color: #E56D9B;
+      }
     }
   }
 

src/components/User/UserInfo.vue

@@ -147,33 +147,42 @@ export default {
     ...mapState(['wallet', 'isMe', 'username', 'userAvatar', 'userIntroduction', 'userType', 'userPage']),
     user () {
       let introduction = ''
-      if (this.isMe) {
-        if (this.userIntroduction === '') {
-          introduction = 'No Introduction Yet'
-        } else {
-          introduction = this.userIntroduction
-        }
-        return { nickname: this.username, avatar: this.userAvatar, introduction: introduction, type: this.userType }
+      if (this.userPage.introduction === '') {
+        introduction = 'No Introduction Yet'
       } else {
-        if (this.userPage.introduction === '') {
-          introduction = 'No Introduction Yet'
-        } else {
-          introduction = this.userPage.introduction
-        }
-        return { nickname: this.userPage.nickname, avatar: this.userPage.avatar, introduction: introduction, type: this.userPage.type }
+        introduction = this.userPage.introduction
       }
+      return { nickname: this.userPage.nickname, avatar: this.userPage.avatar, introduction: introduction, type: this.userPage.type }
+    }
+  },
+  watch: {
+    async $route (val) {
+      window.location.reload()
+      await this.setUserPage({ wallet: val.params.id })
+      let introduction = ''
+      if (this.userPage.introduction === '') {
+        introduction = 'No Introduction Yet'
+      } else {
+        introduction = this.userPage.introduction
+      }
+      this.user = { nickname: this.userPage.nickname, avatar: this.userPage.avatar, introduction: introduction, type: this.userPage.type }
+    },
+    username (val) {
+      if (this.wallet === this.$route.params.id) {
+        console.log('isMe')
+        this.setIsMe(true)
+        document.title = val + '\'s Profile - ArcLight'
+      } else {
+        document.title = this.userPage.nickname + '\'s Profile - ArcLight'
+      }
+    },
+    userPage (val) {
+      document.title = val.nickname + '\'s Profile - ArcLight'
     }
   },
   mounted () {
     this.setUserPage({ wallet: this.$route.params.id })
-    if (this.wallet === this.$route.params.id) {
-      console.log('isMe')
-      this.setIsMe(true)
-      document.title = this.username + '\'s Profile - ArcLight'
-    } else {
-      document.title = this.userPage.nickname + '\'s Profile - ArcLight'
-    }
-
+    document.title = 'Profile - ArcLight'
     // 假数据 循环 变多
     // const followers = []
     // for (let i = 0; i < 3; i++) {