@jx3box/jx3box-common-ui 5.3.9 → 5.4.0

package/assets/data/box.json

@@ -405,4 +405,4 @@
         "hasMark": false,
         "markcls": "ishot"
     }
-]
+]

package/assets/data/clients.json

@@ -2,4 +2,4 @@
     "std": "正式服",
     "origin": "怀旧服",
     "all": "双端"
-}
+}

package/assets/data/nav.json

@@ -287,4 +287,4 @@
         "status": true,
         "parentKey": "bbs"
     }
-]
+]

package/assets/data/zlp.json

@@ -1,5 +1,5 @@
 {
-    "std":["北天药宗","奉天证道"],
-    "origin":["藏剑山庄","物华天宝"],
-    "all":["北天药宗","奉天证道","藏剑山庄","物华天宝"]
-}
+    "std": ["北天药宗", "奉天证道"],
+    "origin": ["藏剑山庄", "物华天宝"],
+    "all": ["北天药宗", "奉天证道", "藏剑山庄", "物华天宝"]
+}

package/package.json

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

package/src/App.vue

@@ -76,11 +76,8 @@
             <hr>
 
             <RightSidebar>
-                <div style="height:1200px;">
-                    <RightSideMsg>Test</RightSideMsg>
-
-                    <Author :author="author" uid="5" />
-                </div>
+                <RightSideMsg>Hello</RightSideMsg >
+                <PostCollection :id="59"/>
             </RightSidebar>
 
             <Footer></Footer>
@@ -106,6 +103,7 @@ import Footer from "./Footer.vue";
 import Bottom from "./Bottom.vue";
 
 import PostHeader from "./single/PostHeader.vue";
+import PostCollection from "./single/PostCollection.vue";
 
 import Thx from "./single/Thx.vue";
 import Collection from "./single/Collection.vue";
@@ -148,6 +146,7 @@ export default {
         RightSidebar,
 
         PostHeader,
+        PostCollection,
 
         Thx,
         Collection,

package/src/single/PostCollection.vue

@@ -0,0 +1,86 @@
+<template>
+    <div class="m-single-collection" v-if="list && list.length">
+        <div class="u-title"><i class="el-icon-connection"></i> 关联</div>
+        <ul class="u-list">
+            <li v-for="(item, i) in list" :key="i">
+                <el-tooltip class="item" effect="dark" :content="item.title" placement="left">
+                    <a :href="item | showLink" target="_blank">
+                        <i class="el-icon-link"></i>
+                        {{ item.title }}
+                    </a>
+                </el-tooltip>
+            </li>
+        </ul>
+    </div>
+</template>
+
+<script>
+import { getLink } from "@jx3box/jx3box-common/js/utils";
+import { getCollection } from "../../service/helper";
+export default {
+    name: "PostCollection",
+    props: ["id", "store"],
+    components: {},
+    data: function() {
+        return {
+            data: {
+                title: "",
+                posts: [],
+            },
+        };
+    },
+    computed: {
+        list: function() {
+            return this.data?.posts || this.store?.posts;
+        },
+    },
+    watch: {
+        id: {
+            immediate: true,
+            handler: function(val) {
+                !!~~val && this.loadData();
+            },
+        },
+    },
+    methods: {
+        loadData: function() {
+            getCollection(this.id).then((res) => {
+                this.data = res.data?.data?.collection;
+            });
+        },
+    },
+    filters: {
+        showLink: function(item) {
+            if (item.type == "custom") {
+                return item.url;
+            } else {
+                return getLink(item.type, item.id);
+            }
+        },
+    },
+};
+</script>
+<style scoped lang="less">
+.m-single-collection {
+    .u-title {
+        font-weight: 300;
+        font-size: 20px;
+    }
+    .u-list {
+        list-style: none;
+        padding: 10px 20px;
+        margin: 0;
+        li {
+            .fz(13px, 36px);
+        }
+        a {
+            .db;
+            transition: 0.15s ease-in-out;
+            .nobreak;
+            &:hover {
+                background-color: #e6f0fb;
+            }
+        }
+    }
+}
+</style>