inleft
2022-08-23 93768186ca58acd0fc0b6963d0e017979c087631
上下篇日志提示加入
5 files modified
217 ■■■■■ changed files
src/components/common/OwO.vue 10 ●●●● patch | view | raw | blame | history
src/components/group/MyMessage.vue 3 ●●●● patch | view | raw | blame | history
src/components/group/articleListScorll.vue 2 ●●● patch | view | raw | blame | history
src/components/mini/box-new-article.vue 15 ●●●●● patch | view | raw | blame | history
src/components/mini/mdDetail.vue 187 ●●●●● patch | view | raw | blame | history
src/components/common/OwO.vue
@@ -5,7 +5,7 @@
                class="OwO-textarea" />
        </a-form-item>
        <span class="myTip fadeIn" v-if="showTip">现在你可以发送表情啦</span>
        <div ref="container" class="OwO fadeIn" v-show="init || visitorContent.length>0"></div>
        <div ref="container" class="OwO fadeIn" v-show="init"></div>
    </div>
</template>
@@ -28,20 +28,20 @@
        watch: {
            visitorContent: function(newValue, oldValue) {
                if (newValue.length > 0) {
                    this.init = true;
                    this.initOwO();
                    if (!this.showTip) {
                    if (!this.init) {
                        this.showTip = true;
                        setTimeout(() => {
                            this.showTip = false;
                        }, 5000);
                    }
                    this.init = true;
                    this.initOwO();
                }
                this.$emit("update:content", newValue)
            },
        },
        methods: {
            initOwO() {
                var OwO_demo = new OwO({
                    logo: 'OωO表情',
src/components/group/MyMessage.vue
@@ -169,8 +169,7 @@
        img {
            margin-bottom: 0.2rem;
            min-height: 5rem;
            height: 2em;
            height: 2rem;
        }
    }
</style>
src/components/group/articleListScorll.vue
@@ -6,7 +6,7 @@
            </div>
            <div v-for="(temp,index) in data">
                <newArticle v-bind="temp" :index="index"></newArticle>
                <newArticle v-bind="temp" :index="index" :typeId="typeId"></newArticle>
                <!-- <box5 v-bind="temp"></box5> -->
            </div>
src/components/mini/box-new-article.vue
@@ -4,7 +4,7 @@
            <div class="miniTag" v-if="isTop==1">置顶</div>
            <div class="post_cover left_radius" v-if="index%2==0">
                <router-link :to="{path:'videoDetail',query:{id:id,articleFileType:articleFileType}}" :title="title"
                <router-link :to="{path:'videoDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}" :title="title"
                    v-if="articleFileType==myConstant.fileTypeVideo">
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
@@ -14,7 +14,7 @@
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
                </a> -->
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType}}" :title="title"
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}" :title="title"
                    v-else>
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
@@ -22,7 +22,7 @@
            </div>
            <div class="post_cover right_radius" v-else>
                <router-link :to="{path:'videoDetail',query:{id:id,articleFileType:articleFileType}}" :title="title"
                <router-link :to="{path:'videoDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}" :title="title"
                    v-if="articleFileType==myConstant.fileTypeVideo">
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
@@ -32,7 +32,7 @@
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
                </a> -->
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType}}" :title="title"
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}" :title="title"
                    v-else>
                    <div class="block right_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
@@ -41,7 +41,7 @@
            <div class="recent-post-info">
                <router-link :to="{path:'/videoDetail',query:{id:id,articleFileType:articleFileType}}"
                <router-link :to="{path:'/videoDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}"
                    class="article-title" v-if="articleFileType==myConstant.fileTypeVideo">
                    <a-icon type="lock" style="color:rgba(0,0,0,.25)" v-if="authStatus==3" />
                    <a-icon type="stop" style="color:rgba(0,0,0,.25)" v-if="authStatus==2" />
@@ -49,7 +49,7 @@
                    <a-badge :count="1" dot v-if="isAnyUpdate==1" title="最近有更新"></a-badge>
                </router-link>
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType}}"
                <router-link :to="{path:'/mdDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}"
                    class="article-title" v-else>
                    <a-icon type="lock" style="color:rgba(0,0,0,.25)" v-if="authStatus==3" />
                    <a-icon type="stop" style="color:rgba(0,0,0,.25)" v-if="authStatus==2" />
@@ -131,6 +131,9 @@
            "index": {
                default: 0,
            },
            "typeId": {
                default: "",
            },
            "id": {
                default: 0,
            },
src/components/mini/mdDetail.vue
@@ -76,6 +76,35 @@
                <a-icon type="folder-open" class="samllPadding" />
        </div> -->
        <div class="articleInfoMiniData">
            <div class="myTitleDeal">
                <a-icon type="left" />
                <a-tooltip placement="bottomLeft" :title="'上一篇: '+articelMeta.previousRecord.title"
                    v-if="articelMeta.previousRecord !=null">
                    <router-link
                        :to="{path:'/mdDetail',query:{id:articelMeta.previousRecord.id,articleFileType:articleFileType,typeId:typeId}}"
                        class="article-title">
                        {{articelMeta.previousRecord.title}}
                    </router-link>
                </a-tooltip>
                <span v-else class="myTip">到顶啦..</span>
            </div>
            <div style="display: -webkit-box;">
                <div class="myTitleDeal">
                    <a-tooltip placement="bottomLeft" :title="'下一篇: '+articelMeta.nextRecord.title"
                        v-if="articelMeta.nextRecord !=null">
                        <router-link
                            :to="{path:'/mdDetail',query:{id:articelMeta.nextRecord.id,articleFileType:articleFileType,typeId:typeId}}"
                            class="article-title">
                            {{articelMeta.nextRecord.title}}
                        </router-link>
                    </a-tooltip>
                    <span v-else class="myTip">到底啦..</span>
                </div>
                <a-icon type="right" />
            </div>
        </div>
        <div class="articleComment">
            <comment ref="myComment" :articleId="articleId" :isAllowedComment="isAllowedComment" />
        </div>
@@ -103,11 +132,12 @@
        data() {
            return {
                myConstant: myConstant,
                articelMeta: "",
                articelMeta: '',
                isAllowedComment: 1,
                introduce: "",
                articleId: "",
                articleFileType: myConstant.fileTypeMarkDown,
                typeId: null,
                source: "",
                showMsg: false,
                myLock: false,
@@ -126,12 +156,14 @@
        created() {
            this.articleId = this.$route.query.id;
            this.articleFileType = this.$route.query.articleFileType;
            this.typeId = this.$route.query.typeId;
        },
        watch: {
            '$route'(to, from) {
                if ("mdDetail" === to.name) {
                    this.articleId = this.$route.query.id;
                    this.articleFileType = this.$route.query.articleFileType;
                    this.typeId = this.$route.query.typeId;
                }
            },
            articleId: function(newValue, oldValue) {
@@ -159,7 +191,9 @@
                queryBlogArticleDetail({
                    id: this.articleId,
                    authWord: this.secret == "" ? null : md5(this.secret)
                    authWord: this.secret == "" ? null : md5(this.secret),
                    typeId: this.typeId,
                    fileType: this.articleFileType
                }).then((res) => {
                    this.showMsg = true;
                    this.myLock = false;
@@ -199,14 +233,15 @@
                    if (res.data.articleFileType == myConstant.fileTypeMarkDown ||
                        res.data.articleFileType == myConstant.fileTypeHtml) {
                        this.$axios
                            .get(res.data.articleFileURL)
                            .then((res) => {
                                this.source = res.data;
                            }).catch(()=>[
                                this.$message.error("获取文件好像失败了..",3)
                            ])
                        if (res.data.articleFileURL != null && res.data.articleFileURL != '') {
                            this.$axios
                                .get(res.data.articleFileURL)
                                .then((res) => {
                                    this.source = res.data;
                                }).catch(() => [
                                    this.$message.error("获取文件好像失败了..", 3)
                                ])
                        }
                    }
                    //获取日志资源文件
@@ -235,6 +270,7 @@
<style lang="less">
    @import '../../assets/md.less';
    .headertop {
        position: relative;
@@ -307,9 +343,25 @@
        user-select: none;
        box-shadow: 8px 8px 18px rgba(0, 0, 0, 0.1), -8px -8px 18px #ffffff;
        padding: 10px 23px;
        margin: 20px 0px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        a {
            color: black;
        }
        .myTitleDeal {
            max-width: 300px;
            -webkit-line-clamp: 1;
            text-overflow: ellipsis;
            overflow: hidden;
            word-wrap: break-word;
            white-space: nowrap;
            word-break: break-all;
        }
    }
    .mySecret {
@@ -340,113 +392,12 @@
            -8px -8px 18px #ffffff;
    }
    /* #test{
        padding-left: 25%;
        padding-right: 25%;
    } */
    /* h3 {
        margin: 40px 0 0;
    @media screen and (max-width:768px) {
        .articleInfoMiniData {
            .myTitleDeal {
                max-width: 120px;
            }
        }
    }
    ul {
        list-style-type: none;
        padding: 0;
    }
    li {
        display: inline-block;
        margin: 0 10px;
    }
    a {
        color: #42b983;
    }
     */
    /* 自己也可以再调整调整 (贡献一版 我们调整的一版样式) */
    /* .markdown-body {
        padding: 20px;
        min-width: 200px;
        max-width: 900px;
        font-size: 12px;
        h2 {
            font-size: 18px;
            margin: 1em 0 15px;
            padding-top: 0.8em;
            padding-bottom: 0.8em;
        }
        h3 {
            font-size: 14px;
            margin: 22px 0 16px;
        }
        h4 {
            font-size: 13px;
            margin: 20px 0 16px;
        }
        h5 {
            font-size: 12px;
            margin: 16px 0 16px;
            font-weight: 700;
        }
        p {
            font-size: 12px;
            line-height: 24px;
            color: #666666;
            margin-top: 0px;
            margin: 8px 0;
            margin: 14px 0 14px;
        }
        pre {
            background-color: #eee;
            margin-bottom: 8px;
            margin-top: 8px;
            margin: 12px 0 12px;
        }
        blockquote {
            margin-bottom: 8px;
            margin-top: 8px;
            margin: 14px 0 14px;
            background-color: #eee;
            padding: 16px 16px;
        }
        tr {
            background-color: #f5f5f5;
        }
        code {
            background-color: #eee;
        }
        ul,
        ol,
        li {
            list-style: unset;
            font-size: 12px;
            line-height: 20px;
            color: #666666;
            margin-top: 0px;
            margin: 8px 0;
        }
        blockquote {
            border-color: #48b6e2;
        }
        table {
            display: table;
            width: 100%;
            max-width: 100%;
            margin-bottom: 20px;
        }
    } */
</style>