@jx3box/jx3box-common-ui 5.7.10 → 5.7.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jx3box/jx3box-common-ui",
-  "version": "5.7.10",
+  "version": "5.7.13",
   "description": "JX3BOX UI",
   "main": "index.js",
   "scripts": {

package/src/App.vue

@@ -8,7 +8,7 @@
 
         <LeftSidebar :open="true">
             <LeftSideToggle :mobileOnly="true" />
-            <Author :author="author" :uid="2" />
+            <Author :author="author" :uid="8" />
         </LeftSidebar>
 
         <Main :withoutLeft="false" :withoutRight="false">
@@ -147,7 +147,7 @@ import clientBy from "./filters/clientBy.vue";
 import zlpBy from "./filters/zlpBy.vue";
 
 import uploadImage from './upload/upload_banner.vue'
-import AuthorMedal from './medal/author_medal.vue'
+import AuthorMedal from './medal/medal.vue'
 
 import WikiPanel from "./wiki/WikiPanel.vue";
 import WikiRevisions from "./wiki/WikiRevisions.vue";

package/src/Author.vue

@@ -59,9 +59,10 @@
                 <span>作者荣誉</span>
             </div>
             <div class="u-medals" v-if="medals && medals.length">
-                <span class="u-medal" v-for="(item, i) in medals" :key="i">
+                <!-- <span class="u-medal" v-for="(item, i) in medals" :key="i">
                     <img :src="showMedalIcon(item.medal)" :title="showMedalDesc(item)" />
-                </span>
+                </span> -->
+                <medal :medals="medals" :showIcon="showMedalIcon"></medal>
             </div>
         </div>
         <div class="u-teams" v-if="teams && teams.length">
@@ -88,6 +89,7 @@ import { getUserInfo, getDouyu, getUserMedals, getUserPublicTeams } from "../ser
 import { user as medal_map } from "@jx3box/jx3box-common/data/medals.json";
 import User from "@jx3box/jx3box-common/js/user";
 import { __userLevel } from "@jx3box/jx3box-common/data/jx3box.json";
+import medal from './medal/medal.vue'
 export default {
     name: "Author",
     props: ["uid"],
@@ -213,6 +215,7 @@ export default {
     components: {
         Avatar,
         Authorposts,
+        medal
     },
 };
 </script>

package/src/medal/medal.vue

@@ -0,0 +1,46 @@
+<template>
+    <div class="m-medal">
+        <a :href="medalLink(item)" target="_blank" class="u-medal" v-for="item in medals" :key="item.id" :title="item.medal_desc">
+            <img class="u-medal-img" :src="showIcon(item.medal)" alt="">
+        </a>
+    </div>
+</template>
+
+<script>
+import { getMedalLink } from '@jx3box/jx3box-common/js/utils'
+export default {
+    name: 'author_medal',
+    props: {
+        medals: {
+            type: Array,
+            default: () => [], // [{ rank_id, medal_desc, medal }]
+        },
+        showIcon: {
+            type: Function,
+            default: () => true,
+        }
+    },
+    methods: {
+
+        medalLink({ rank_id, subtype }) {
+            return getMedalLink(rank_id, subtype)
+        }
+    }
+}
+</script>
+
+<style lang="less">
+.m-medal {
+    display: block;
+    margin: 5px 0;
+
+    .u-medal {
+        cursor: pointer;
+        .u-medal-img {
+            width: 20px;
+            height: 20px;
+            margin-right: 5px;
+        }
+    }
+}
+</style>

package/service/next.js

@@ -1,7 +0,0 @@
-import { $next } from "@jx3box/jx3box-common/js/https";
-
-function getMedals(author){
-    return $next({ mute: true }).get(`api/user/${author}/medals`);
-}
-
-export { getMedals };

package/src/medal/author_medal.vue

@@ -1,64 +0,0 @@
-<template>
-    <div class="m-medal">
-        <a :href="medalLink(item)" class="u-medal" v-for="item in medals" :key="item.id" :title="item.medal_desc">
-            <img class="u-medal-img" :src="medalImagePath(item.medal)" alt="">
-        </a>
-    </div>
-</template>
-
-<script>
-import { getMedals } from '../../service/next'
-import { __imgPath } from '@jx3box/jx3box-common/data/jx3box.json'
-import { getMedalLink } from '@jx3box/jx3box-common/js/utils'
-export default {
-    name: 'author_medal',
-    props: {
-        authorId: {
-            type: Number,
-            default: 0
-        },
-    },
-    data() {
-        return {
-            medals: [],
-        }
-    },
-    watch: {
-        authorId: {
-            immediate: true,
-            handler(val) {
-                val && this.loadAuthorMedal()
-            }
-        }
-    },
-    methods: {
-        loadAuthorMedal() {
-            getMedals(this.authorId).then(res => {
-                this.medals = res.data.data
-            })
-        },
-        medalImagePath(medal) {
-            return `${__imgPath}image/medals/user/${medal}.gif`
-        },
-        medalLink({ rank_id, subtype }) {
-            return getMedalLink(rank_id, subtype)
-        }
-    }
-}
-</script>
-
-<style lang="less" scoped>
-.m-medal {
-    display: block;
-    margin: 5px 0;
-
-    .u-medal {
-        cursor: pointer;
-        .u-medal-img {
-            width: 20px;
-            height: 20px;
-            margin-right: 5px;
-        }
-    }
-}
-</style>