inleft
2022-08-04 00e46dcc41d259b33e6c6c9771b7e2fe2ab95401
更新消息盒子
8 files modified
1 files added
229 ■■■■ changed files
src/api/blogArticleComment.js 8 ●●●●● patch | view | raw | blame | history
src/components/group/MyMessage.vue 140 ●●●●● patch | view | raw | blame | history
src/components/group/MyPreviewModal.vue 9 ●●●● patch | view | raw | blame | history
src/components/group/tool.vue 18 ●●●● patch | view | raw | blame | history
src/components/mini/box10-add.vue 16 ●●●●● patch | view | raw | blame | history
src/components/mini/box12-comment.vue 2 ●●● patch | view | raw | blame | history
src/components/mini/mdDetail.vue 8 ●●●● patch | view | raw | blame | history
src/components/mini/tagInfo.vue 16 ●●●●● patch | view | raw | blame | history
src/components/swichLabel/main1-home.vue 12 ●●●● patch | view | raw | blame | history
src/api/blogArticleComment.js
@@ -34,3 +34,11 @@
        params: parameter
    })
}
export function history(parameter) {
    return axios({
        url: '/outside/blogComment/history',
        method: 'get',
        params: parameter
    })
}
src/components/group/MyMessage.vue
New file
@@ -0,0 +1,140 @@
<template>
    <div class="myModal">
        <a-modal v-model="visible" title="天涯共此时.." :footer="null"
            :bodyStyle="{'overflow':'overlay','maxHeight': '550px'}">
            <!-- <template #actions>
                <a-button>
                    未读
                    <a-icon type="bell" />
                </a-button>
            </template> -->
            <a-list item-layout="horizontal" :data-source="dataList">
                <template slot="renderItem" slot-scope="item">
                    <a-list-item>
                        <a-list-item-meta :description="item.commentContent">
                            <template #avatar>
                                <a :href="item.visitorHomePage" target="_blank" v-if="item.visitorHomePage!=''">
                                    <a-tooltip placement="bottomLeft" :title="item.visitorNickName">
                                        <span class="myTip">{{item.visitorNickName}} :</span>
                                    </a-tooltip>
                                </a>
                                <a-tooltip placement="bottomLeft" :title="item.visitorNickName" v-else>
                                    <span class="myTip">{{item.visitorNickName}} :</span>
                                </a-tooltip>
                            </template>
                            <template #title>
                                在
                                <router-link to="/comment" v-if="item.commentType==1" @click.native="handleCancel()">碎碎念
                                </router-link>
                                <router-link :to="{path:'/mdDetail',query:{id:item.articleId}}"
                                    :title="item.articleTitle" @click.native="handleCancel()" v-else>
                                    {{item.articleTitle}}
                                </router-link>
                                中留言
                            </template>
                        </a-list-item-meta>
                        <!-- <template #extra>
                            {{item.createDate}}
                        </template> -->
                    </a-list-item>
                </template>
                <template #loadMore>
                    <div :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
                        <a-button @click="loadMore" :disabled="refresh" v-if="showButton">
                            加载更多
                        </a-button>
                        <a-button disabled v-else>
                            更多记录就不展示啦..
                        </a-button>
                    </div>
                </template>
            </a-list>
        </a-modal>
    </div>
</template>
<script>
    import {
        history
    } from '../../api/blogArticleComment.js'
    export default {
        data() {
            return {
                dataList: [],
                visible: false,
                loading: false,
                pageNo: 1,
                pageSize: 5,
                showButton: true,
                refresh: false,
            }
        },
        beforeMount() {},
        mounted() {
            this.loadData()
        },
        methods: {
            loadMore() {
                this.$message.info("拉取信息中..")
                this.loadData()
            },
            loadData() {
                this.refresh = true;
                setTimeout(() => {
                    this.refresh = false;
                }, 1000);
                history({
                    pageNo: this.pageNo++,
                    pageSize: this.pageSize
                }).then((res) => {
                    if (res.code == 200) {
                        this.dataList = this.dataList.concat(res.data.records);
                        if (res.data.pages <= this.pageNo - 1) {
                            this.showButton = false
                        }
                    } else {
                        this.$notification.error({
                            message: '好像哪里不对劲..',
                            description: res.message,
                            placement: 'bottomRight'
                        });
                    }
                })
            },
            showModal() {
                this.visible = true;
            },
            handleCancel(e) {
                this.visible = false;
            },
        },
    }
</script>
<style scoped>
    .loadmore-list {
        min-height: 350px;
    }
    .ant-list-item-meta-avatar {
        width: 65px;
    }
    .myhiden {
        display: -webkit-container;
        -webkit-line-clamp: 3;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    a {
        color: black;
    }
</style>
src/components/group/MyPreviewModal.vue
@@ -16,7 +16,12 @@
<script>
    import VueMarkdown from 'vue-markdown'
    const exp1 =
        "### &ensp;&ensp;十里平湖 \r> ##### (卢照邻·唐)  \r> 化自《长安古意》 \r* 十里平湖霜满天 \r* 寸寸青丝愁华年 \r* 对月形单望相护 \r* 只羡鸳鸯不羡仙 \r![](http://blog.inleft.com/photo/example.jpg)\n\n";
    const exp2 = "### &ensp;&ensp;杂曲歌辞·春江曲 \r> ##### (郭元振·唐) \r* 江水春沉沉 \r* 上有双竹林 \r* 竹叶坏水色 \r* 郎亦坏人心 \r\n";
    const exp3 = "\r> 「探清水河」\r引用化作 「上有竹林深 」 "
    //import md5 from 'js-md5';
    export default {
@@ -26,7 +31,7 @@
        data() {
            return {
                visible: false,
                text: "### &ensp;&ensp;十里平湖 \r> ##### (卢照邻)  \r> 化自《长安古意》 \r* 十里平湖霜满天 \r* 寸寸青丝愁华年 \r* 对月形单望相护 \r* 只羡鸳鸯不羡仙 \r![](http://blog.inleft.com/photo/example.jpg)",
                text: exp1 + exp2 + exp3,
            }
        },
        methods: {
src/components/group/tool.vue
@@ -1,13 +1,19 @@
<template>
    <a-affix :offset-top="600">
        <div style="padding-left:5px;">
        <div style="padding-left:5px;" class="myButton">
            <!-- <a-button @click="showDrawer1">
                抽屉1
            </a-button> -->
            <!-- <a-button @click="showDrawer2">
                抽屉2
            </a-button> -->
            <a-button @click="showMessage">
                <a-badge status="success">
                    消息
                </a-badge>
                <a-icon type="message" />
            </a-button>
            <a-button @click="showPreview">
                预览
                <a-icon type="youtube" />
@@ -22,6 +28,7 @@
                    <a-icon :type="iconType" />
                </transition>
            </a-button>
            <!-- <a-button>
                工具
@@ -41,6 +48,9 @@
            }
        },
        methods: {
            showMessage() {
                this.$emit('showMessage')
            },
            showModal() {
                this.$emit('showModal')
            },
@@ -63,5 +73,9 @@
</script>
<style lang="less">
    .myButton {
        button {
            min-width: 90px;
        }
    }
</style>
src/components/mini/box10-add.vue
@@ -67,14 +67,18 @@
                </a-form-model-item>
                <a-form-model-item label=" 日志类型">
                    <a-radio-group v-model="form.blogType">
                        <a-radio value="1">
                    <a-select v-model="form.blogType" mode="default" placeholder=""
                        :getPopupContainer="getCalendarContainer()">
                        <a-select-option   value="1">
                            markdown
                        </a-radio>
                        <a-radio value="2">
                        </a-select-option>
                        <a-select-option   value="2">
                            html
                        </a-radio>
                    </a-radio-group>
                        </a-select-option>
                        <a-select-option   value="5">
                            fast(闪念)
                        </a-select-option>
                    </a-select>
                </a-form-model-item>
src/components/mini/box12-comment.vue
@@ -6,7 +6,7 @@
            <replyBox ref="replyBoxId" v-bind="$attrs" @sendMsg="sendMsg()"></replyBox>
        </a-modal>
        <div class="mySecret" style="max-height:350px ;" v-if="commentListData.length==0">
        <div class="mySecret" style="max-height:250px ;" v-if="commentListData.length==0">
            <p>空空如也..</p>
        </div>
        <div v-for="temp in commentListData" class="commentList">
src/components/mini/mdDetail.vue
@@ -6,15 +6,15 @@
            </a-button>
        </div>
        <div class="mySecretSamll" v-if="showMsg && !myLock">
            <div v-if="articleFileType==5">
        <div v-if="showMsg && !myLock">
            <div class="mySecretSamll" v-if="articleFileType==5">
            </div>
            <div class="mySecret" v-else>
                <h1>怎样才能让你看到我呢</h1>
                <h1>只要你要,只要我有...</h1>
                <span class="myTip">{{errorMsg}}</span>
            </div>
            <span class="myTip">{{errorMsg}}</span>
        </div>
        <div v-else>
@@ -239,7 +239,7 @@
        padding-left: auto;
        align-items: center;
    }
    .mySecretSamll {
        height: 115px;
        display: flex;
src/components/mini/tagInfo.vue
@@ -43,8 +43,8 @@
                </ul>
            </a-timeline-item>
 -->
 <!--
            <!--
  它叫 faye's theme 出自高瞰/的独立游戏(寻找天堂)
  
  时间:2020.02某个不眠的深夜
@@ -58,12 +58,12 @@
  因而<<to the moon>> 这首曲子也在我的曲库里
  但对我而言,寻找天堂这部作品更引起了我的共鸣
  2018-2020发生了很多事情,为此放弃了很多东西,不得不说那是一段不愿意回忆起的日子
  2019年8月 我的挚友搭了个梯子给我找来了这个谱子
  2019年8月 我的挚友找了个梯子给我找来了这个谱子
  它更像一副良药,缓慢而温和治愈我
  以上.送给那些孤独的朋友..
  
  -->
            <!-- 
 这首曲子叫卡农/canon(也是一种调式,不过大家都这么称呼它) 
 或者矫情一点,我一般叫它 Canon In D Arranged By George Winston
@@ -89,8 +89,14 @@
                <h3 class="layui-timeline-title">2022-07-29</h3>
                <span>
                    <router-link to="/comment">优化更新:记住到访的朋友</router-link>
                    <p class="myTip">你的名字.</p>
                </span>
                <p class="myTip">你的名字.</p>
                <p>更新:近期更新日志添加小红点提示</p>
                <p>更新:碎碎念类型日志优化提示</p>
                <p>新增:拉取最近几条互动记录</p>
                <p>新增:外链类型日志 for
                    <span class="myTip">浅浅子</span>
                </p>
            </a-timeline-item>
            <a-timeline-item color="">
                <a-icon slot="dot" type="clock-circle-o" style="font-size: 18px;" />
src/components/swichLabel/main1-home.vue
@@ -1,7 +1,8 @@
<template>
    <div>
        <MyModal ref="myModal"></MyModal>
        <MyPreviewModal ref="MyPreviewModal"></MyPreviewModal>
        <MyModal ref="myModal" />
        <MyPreviewModal ref="MyPreviewModal" />
        <MyMessage ref="MyMessage" />
        <div class="blog-drawer">
            <a-drawer placement="left" :closable="false" :visible="visibleDrawer" :getContainer="'body'"
@@ -39,7 +40,7 @@
                </a-col>
                <a-col v-bind="colApiRight">
                    <tool @showModal="showModal" @showPreview="showPreview" @showScreen="showScreen" />
                    <tool @showModal="showModal" @showPreview="showPreview" @showScreen="showScreen" @showMessage="showMessage" />
                </a-col>
            </a-row>
        </div>
@@ -53,6 +54,7 @@
    import tool from "../group/tool.vue"
    import MyModal from "../group/MyModal.vue"
    import MyPreviewModal from "../group/MyPreviewModal.vue"
    import MyMessage from "../group/MyMessage.vue"
    import screenConfig from "../../config/screenConfig.js"
@@ -64,6 +66,7 @@
            tool,
            MyModal,
            MyPreviewModal,
            MyMessage,
        },
        methods: {
            showScreen() {
@@ -84,6 +87,9 @@
            showPreview() {
                this.$refs.MyPreviewModal.showModal();
            },
            showMessage() {
                this.$refs.MyMessage.showModal();
            },
            afterVisibleChange(val) {},
            showDrawer() {
                this.visibleDrawer = true;