@jx3box/jx3box-common-ui 8.7.1 → 8.7.3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jx3box/jx3box-common-ui",
-    "version": "8.7.1",
+    "version": "8.7.3",
     "description": "JX3BOX UI",
     "main": "index.js",
     "scripts": {
@@ -30,7 +30,7 @@
         "last 2 versions"
     ],
     "dependencies": {
-        "@jx3box/jx3box-comment-ui": "^1.8.8",
+        "@jx3box/jx3box-comment-ui": "^1.9.3",
         "@jx3box/jx3box-common": "^8.2.18",
         "@jx3box/jx3box-data": "^3.5.8",
         "@jx3box/jx3box-editor": "^2.1.9",

package/src/App.vue

@@ -309,7 +309,7 @@ export default {
         },
         loadCommunity: function () {
             // 72
-            getTopicDetails(82).then((res) => {
+            getTopicDetails(120).then((res) => {
                 this.community = res.data.data;
             });
         },

package/src/bread/Admin.vue

@@ -282,7 +282,7 @@ export default {
         // 上传
         uploadSuccess: function (res, file, list) {
             this.banner_preview = URL.createObjectURL(file.raw);
-            this.post_banner = res.data[0];
+            this.post_banner = res.data?.[0] || "";
         },
         uploadFail: function (err, file, fileList) {
             this.$message.error("上传失败");

package/src/bread/CommunityAdmin.vue

@@ -72,6 +72,27 @@
                 </div>
             </div>
 
+            <el-divider content-position="left">封面海报</el-divider>
+            <div class="c-admin-banner">
+                <el-upload
+                    class="c-admin-upload el-upload--picture-card"
+                    :action="uploadurl"
+                    :with-credentials="true"
+                    :show-file-list="false"
+                    :on-success="uploadSuccess"
+                    :on-error="uploadFail"
+                >
+                    <img v-if="post_banner" :src="post_banner" />
+                    <i class="el-icon-plus"></i>
+                </el-upload>
+                <el-input class="u-banner" v-model="post_banner">
+                    <span slot="prepend">海报地址</span>
+                    <span slot="append">
+                        <span class="u-btn" @click="removeBanner"> <i class="el-icon-circle-close"></i> 移除海报 </span>
+                    </span>
+                </el-input>
+            </div>
+
             <el-divider content-position="left">高亮置顶</el-divider>
 
             <p class="c-admin-space">
@@ -141,7 +162,7 @@ import {
     updateTopicItem,
     manageTopicAll
 } from "../../service/community";
-import {cloneDeep} from "lodash";
+import { __cms } from "@jx3box/jx3box-common/data/jx3box.json";
 
 export default {
     name: "CommunityAdmin",
@@ -186,7 +207,12 @@ export default {
                 hight_color: "rgb(255,0,1)",
             },
 
-            finalTags: []
+            finalTags: [],
+
+            // 海报
+            uploadurl: __cms + "api/cms/upload",
+            banner_preview: "",
+            post_banner: "",
         };
     },
     computed: {
@@ -243,6 +269,7 @@ export default {
                 user_id: this.form.user_id,
                 title: this.form.title,
                 category: this.form.category,
+                banner_img: this.post_banner,
             }));
 
             promises.push(manageTopicAll(id, {
@@ -327,6 +354,7 @@ export default {
 
                 this.finalTags = this.post.color_tag;
                 this.topStatus = [];
+                this.post_banner = this.post.banner_img;
                 if (this.post.is_top) {
                     this.topStatus.push("is_top");
                 }
@@ -349,7 +377,19 @@ export default {
                 }
             });
             this.finalTags = tags;
-        }
+        },
+        // 上传
+        uploadSuccess: function (res, file, list) {
+            this.banner_preview = URL.createObjectURL(file.raw);
+            this.post_banner = res.data[0];
+        },
+        uploadFail: function (err, file, fileList) {
+            this.$message.error("上传失败");
+            console.log(err);
+        },
+        removeBanner: function () {
+            this.post_banner = "";
+        },
     },
 };
 </script>

package/src/single/PostTopic.vue

@@ -5,10 +5,10 @@
                 <div class="c-topic-text__year">{{ year }}</div>
                 <div class="c-topic-text__text">{{ topicText }}</div>
             </div>
-            <img class="c-topic-bg" src="../../assets/img/rightsidebar/topic_bg_bps.svg" alt="">
+            <img class="c-topic-bg" src="../../assets/img/rightsidebar/topic_bg_bps.svg" alt="" />
         </div>
         <div class="c-post-topic__img">
-            <img :src="topicImage" alt="">
+            <img :src="topicImage" alt="" />
         </div>
     </div>
 </template>
@@ -35,19 +35,22 @@ export default {
     },
     data() {
         return {
-            topicInfo: null
-        }
+            topicInfo: null,
+        };
     },
     computed: {
         topicText() {
-            return this.topicInfo ? `${dayjs(this.topicInfo.created_at).format('MM月DD日')}荣登头条榜` : ''
+            return this.topicInfo ? `${dayjs(this.topicInfo.created_at).format("MM月DD日")}荣登头条榜` : "";
         },
         year() {
-            return this.topicInfo ? dayjs(this.topicInfo.created_at).format('YYYY年') : ""
+            return this.topicInfo ? dayjs(this.topicInfo.created_at).format("YYYY年") : "";
         },
         topicImage() {
             const img = this.postBanner || this.topicInfo?.img;
-            return getThumbnail(img, [260*2, 78*2])
+            if (img?.indexOf(".gif") > -1) {
+                return img;
+            }
+            return getThumbnail(img, [260 * 2, 78 * 2]);
         },
         client() {
             return location.href.includes("origin") ? "origin" : "std";
@@ -59,21 +62,23 @@ export default {
             handler(val) {
                 if (!val) return;
                 this.loadData();
-            }
-        }
+            },
+        },
     },
     methods: {
         loadData() {
             getSliders(this.type, this.id, this.client).then((res) => {
                 if (res.data.data?.list) {
                     // 取创建时间最新的一条
-                    const list = res.data.data.list.sort((a, b) => dayjs(b.created_at).isAfter(dayjs(a.created_at)) ? 1 : -1);
+                    const list = res.data.data.list.sort((a, b) =>
+                        dayjs(b.created_at).isAfter(dayjs(a.created_at)) ? 1 : -1
+                    );
                     this.topicInfo = list[0];
                 }
             });
         },
-    }
-}
+    },
+};
 </script>
 
 <style lang="less" scoped>
@@ -93,7 +98,7 @@ export default {
         // left: 50%;
         // transform: translate(-50%, -50%);
         z-index: 1;
-        color: #FFD28F;
+        color: #ffd28f;
         letter-spacing: 1px;
         white-space: nowrap;
         margin-right: 8px;
@@ -115,7 +120,7 @@ export default {
     overflow: hidden;
     .r(4px);
     min-height: 71px;
-    img{
+    img {
         .pa;
         left: 50%;
         transform: translateX(-50%);