inleft
2022-08-24 80476fae71f08bf4408c7509eff254031a4eeac6
路由修正,常量提取
11 files modified
2 files added
1 files deleted
789 ■■■■■ changed files
src/App.vue 21 ●●●●● patch | view | raw | blame | history
src/components/common/BGIcon.vue 42 ●●●●● patch | view | raw | blame | history
src/components/group/platformGroup.vue 32 ●●●●● patch | view | raw | blame | history
src/components/mini/box-new-article.vue 139 ●●●● patch | view | raw | blame | history
src/components/mini/box10-add.vue 8 ●●●● patch | view | raw | blame | history
src/components/mini/box14-video.vue 82 ●●●● patch | view | raw | blame | history
src/components/mini/box14-video3.vue 248 ●●●●● patch | view | raw | blame | history
src/components/mini/box16-videoDetail.vue 12 ●●●●● patch | view | raw | blame | history
src/components/mini/box18-photoShow.vue 90 ●●●●● patch | view | raw | blame | history
src/components/mini/mdDetail.vue 40 ●●●●● patch | view | raw | blame | history
src/components/swichLabel/main1-home.vue 20 ●●●●● patch | view | raw | blame | history
src/config/myConstant.js 30 ●●●● patch | view | raw | blame | history
src/config/router.config.js 1 ●●●● patch | view | raw | blame | history
src/config/v-viewer-Config.js 24 ●●●●● patch | view | raw | blame | history
src/App.vue
@@ -29,6 +29,27 @@
        cursor: move;
    }
    @font-face {
        font-family: 'HYTangMeiRen';
        // font-display: swap;
        src: url("http://t.inleft.com/share/z%E5%AD%97%E4%BD%93%E5%BA%93/hytmr55%E6%B1%89%E4%BB%AA%E5%94%90%E7%BE%8E%E4%BA%BA%E5%AD%97%E4%BD%93.woff") format("truetype");
    }
    span,
    p,
    a,
    body,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    code,
    pre{
        font-family: HYTangMeiRen !important;
    }
    #app {
        // overflow: auto;
        //  border: none; 
src/components/common/BGIcon.vue
New file
@@ -0,0 +1,42 @@
<template>
    <svg viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
        <defs>
            <path id="pid-1-svgo-a" d="M0 0h80v80H0z"></path>
            <path
                d="M52.546 8.014a3.998 3.998 0 014.222 3.077c.104.446.093.808.039 1.138a2.74 2.74 0 01-.312.881c-.073.132-.16.254-.246.376l-.257.366-.521.73c-.7.969-1.415 1.926-2.154 2.866l-.015.02a240.945 240.945 0 015.986.341l1.643.123.822.066.41.034.206.018.103.008.115.012c1.266.116 2.516.45 3.677.975a11.663 11.663 0 013.166 2.114c.931.87 1.719 1.895 2.321 3.022a11.595 11.595 0 011.224 3.613c.03.157.046.316.068.474l.015.119.013.112.022.206.085.822.159 1.646c.1 1.098.19 2.198.27 3.298.315 4.4.463 8.829.36 13.255a166.489 166.489 0 01-.843 13.213c-.012.127-.034.297-.053.454a7.589 7.589 0 01-.072.475l-.04.237-.05.236a11.762 11.762 0 01-.74 2.287 11.755 11.755 0 01-5.118 5.57 11.705 11.705 0 01-3.623 1.263c-.158.024-.316.052-.475.072l-.477.053-.821.071-1.644.134c-1.096.086-2.192.16-3.288.23a260.08 260.08 0 01-6.578.325c-8.772.324-17.546.22-26.313-.302a242.458 242.458 0 01-3.287-.22l-1.643-.129-.822-.069-.41-.035-.206-.018c-.068-.006-.133-.01-.218-.02a11.566 11.566 0 01-3.7-.992 11.732 11.732 0 01-5.497-5.178 11.73 11.73 0 01-1.215-3.627c-.024-.158-.051-.316-.067-.475l-.026-.238-.013-.119-.01-.103-.07-.823-.132-1.648a190.637 190.637 0 01-.22-3.298c-.256-4.399-.358-8.817-.258-13.233.099-4.412.372-8.811.788-13.197a11.65 11.65 0 013.039-6.835 11.585 11.585 0 016.572-3.563c.157-.023.312-.051.47-.07l.47-.05.82-.07 1.643-.13a228.493 228.493 0 016.647-.405l-.041-.05a88.145 88.145 0 01-2.154-2.867l-.52-.73-.258-.366c-.086-.122-.173-.244-.246-.376a2.74 2.74 0 01-.312-.881 2.808 2.808 0 01.04-1.138 3.998 3.998 0 014.22-3.077 2.8 2.8 0 011.093.313c.294.155.538.347.742.568.102.11.19.23.28.35l.27.359.532.72a88.059 88.059 0 012.06 2.936 73.036 73.036 0 011.929 3.03c.187.313.373.628.556.945 2.724-.047 5.447-.056 8.17-.038.748.006 1.496.015 2.244.026.18-.313.364-.624.549-.934a73.281 73.281 0 011.93-3.03 88.737 88.737 0 012.059-2.935l.533-.72.268-.359c.09-.12.179-.24.281-.35a2.8 2.8 0 011.834-.881zM30.13 34.631a4 4 0 00-.418 1.42 91.157 91.157 0 00-.446 9.128c0 2.828.121 5.656.364 8.483l.11 1.212a4 4 0 005.858 3.143c2.82-1.498 5.55-3.033 8.193-4.606a177.41 177.41 0 005.896-3.666l1.434-.942a4 4 0 00.047-6.632 137.703 137.703 0 00-7.377-4.708 146.88 146.88 0 00-6.879-3.849l-1.4-.725a4 4 0 00-5.382 1.742z"
                id="pid-1-svgo-d"></path>
            <filter x="-15.4%" y="-16.3%" width="130.9%" height="132.5%" filterUnits="objectBoundingBox"
                id="pid-1-svgo-c">
                <feOffset dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
                <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1">
                </feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.3 0" in="shadowBlurOuter1"
                    result="shadowMatrixOuter1"></feColorMatrix>
                <feOffset in="SourceAlpha" result="shadowOffsetOuter2"></feOffset>
                <feGaussianBlur stdDeviation="3.5" in="shadowOffsetOuter2" result="shadowBlurOuter2">
                </feGaussianBlur>
                <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0" in="shadowBlurOuter2"
                    result="shadowMatrixOuter2"></feColorMatrix>
                <feMerge>
                    <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
                    <feMergeNode in="shadowMatrixOuter2"></feMergeNode>
                </feMerge>
            </filter>
        </defs>
        <g fill="none" fill-rule="evenodd" opacity=".8">
            <mask id="pid-1-svgo-b" fill="#fff">
                <use xlink:href="#pid-1-svgo-a"></use>
            </mask>
            <g mask="url(#pid-1-svgo-b)">
                <use fill="#000" filter="url(#pid-1-svgo-c)" xlink:href="#pid-1-svgo-d"></use>
                <use fill="#FFF" xlink:href="#pid-1-svgo-d"></use>
            </g>
        </g>
    </svg>
</template>
<script>
</script>
<style>
</style>
src/components/group/platformGroup.vue
@@ -1,13 +1,14 @@
<template>
    <a-tabs :defaultActiveKey="activeKey" :tabBarStyle="{'display': 'flex','justify-content': 'center'}">
        <a-tab-pane key="1" tab="片刻">
    <a-tabs :defaultActiveKey="activeKey" @change="changeKey"
        :tabBarStyle="{'display': 'flex','justify-content': 'center'}">
        <a-tab-pane :key="keyType.type_1" tab="片刻">
            <videoList v-on="$listeners" :activeKey="activeKey"></videoList>
        </a-tab-pane>
        <a-tab-pane key="2" tab="流影">
            <photoShow :activeKey="activeKey"></photoShow>
        <a-tab-pane :key="keyType.type_2" tab="流影">
            <videoList v-on="$listeners" :activeKey="activeKey"></videoList>
        </a-tab-pane>
        <a-tab-pane key="3" tab="谱库">
        <a-tab-pane :key="keyType.type_3" tab="谱库">
            <photoShow :activeKey="activeKey"></photoShow>
        </a-tab-pane>
    </a-tabs>
@@ -17,11 +18,12 @@
<script>
    import videoList from "../mini/box14-video.vue"
    import photoShow from "../mini/box18-photoShow.vue"
    import myConstant from "../../config/myConstant.js"
    export default {
        components: {
            videoList,
            photoShow
            photoShow,
        },
        created() {
            this.getActiveKey()
@@ -35,17 +37,25 @@
        },
        methods: {
            getActiveKey() {
                if (this.$route.query.activeKey == "" || this.$route.query.activeKey == undefined) {
                    this.activeKey = this.defaultActiveKey;
                } else {
                if (this.$route.query.activeKey != "" && this.$route.query.activeKey != undefined) {
                    this.activeKey = this.$route.query.activeKey;
                } else {
                    //随机三选一
                    var random = Math.floor(Math.random() * 10);
                    this.activeKey = random >= 8 ?
                        this.keyType.type_3 : (random <= 3 ? this.keyType.type_2 : this.keyType.type_1)
                }
                this.$router.replace({query:{activeKey:this.activeKey}})
            },
            changeKey(key) {
                this.activeKey = key
                this.$router.replace({query:{activeKey:this.activeKey}})
            }
        },
        data() {
            return {
                activeKey: "1",
                defaultActiveKey: "1",
                activeKey: "moment",
                keyType: myConstant.activeKeyType
            }
        },
src/components/mini/box-new-article.vue
@@ -3,97 +3,65 @@
        <div class="recent-post-item">
            <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,typeId:typeId}}" :title="title"
                    v-if="articleFileType==myConstant.fileTypeVideo">
                <a @click="routerJump(id,articleFileType,typeId)" :title="title" class="article-title">
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
                </router-link>
                <!-- <a :href="jumpURL" target="_blank" class="no-underline"
                    v-else-if="articleFileType==myConstant.fileTypeShort" @click="showMsg(articleFileType,jumpURL)">
                    <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,typeId:typeId}}" :title="title"
                    v-else>
                    <div class="block left_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
                </router-link>
                </a>
            </div>
            <div class="post_cover right_radius" v-else>
                <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">
                </router-link>
                <!-- <a :href="jumpURL" target="_blank" class="no-underline"
                    v-else-if="articleFileType==myConstant.fileTypeShort" @click="showMsg(articleFileType,jumpURL)">
                    <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,typeId:typeId}}" :title="title"
                    v-else>
                <a @click="routerJump(id,articleFileType,typeId)" :title="title" class="article-title">
                    <div class="block right_radius"></div>
                    <img class="post_bg" :src="coverFileURL" :onerror="img404" :alt="title">
                </router-link>
                </a>
            </div>
            <div class="recent-post-info">
                <router-link :to="{path:'/videoDetail',query:{id:id,articleFileType:articleFileType,typeId:typeId}}"
                    class="article-title" v-if="articleFileType==myConstant.fileTypeVideo">
                <a @click="routerJump(id,articleFileType,typeId)" :title="title" class="article-title">
                    <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" />
                    {{title}}
                    <a-badge :count="1" dot v-if="isAnyUpdate==1" title="最近有更新"></a-badge>
                </router-link>
                </a>
                <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" />
                    {{title}}
                    <a-badge :count="1" dot v-if="isAnyUpdate==1" title="最近有更新"></a-badge>
                </router-link>
                <!-- <a class="article-title" href="/mdDetail" :title="title"> {{title}}</a> -->
                <div class="article-meta-wrap" style="display: flex;">
                    <span class="post-meta-date">
                        <a-icon type="calendar" />
                        <span class="article-meta-label"></span>
                        <time> {{publishDate}} </time>
                        <span class="article-meta__categories"> {{publishDate}} </span>
                    </span>
                    <span class="article-meta__separator" style="margin: 0px 3px ;"> | </span>
                    <span class="article-meta__separator" style="margin: 0px 5px ;">|</span>
                    <span class="article-meta">
                        <a-icon type="book" />
                        <router-link :to="{path:'/articleList',query:{typeId:articleTypeId}}"
                            class="article-meta__categories"> {{articleTypeName}}</router-link>
                        <span v-if="articleFileType==myConstant.fileTypeShort">
                            <span v-if="jumpURL !=null && jumpURL!=''">
                                <span class="article-meta__separator" style="margin: 0px 3px ;"> | </span>
                                <span class="post-meta-date">
                                    <a-icon type="share-alt" />
                                    <a :href="jumpURL" target="_blank" class="no-underline"> 外链 </a>
                                </span>
                            </span>
                        <a @click="routerToTypeList(articleTypeId)" class="article-meta__categories">
                            {{articleTypeName}}
                        </a>
                            <span v-else>
                                <span class="article-meta__separator" style="margin: 0px 3px ;"> | </span>
                        <span v-if="jumpURL !=null && jumpURL!=''">
                            <span class="article-meta__separator" style="margin: 0px 3px 5px 0px ;">|</span>
                            <span class="post-meta-date">
                                <a-icon type="share-alt" />
                                <a :href="jumpURL" target="_blank" class="no-underline"> 外链 </a>
                            </span>
                        </span>
                        <span v-else-if="articleFileType==fileType.fileTypeTalking_9">
                            <span>
                                <span class="article-meta__separator" style="margin: 0px 3px 5px 0px ;">|</span>
                                <span class="post-meta-date">
                                    <a-icon type="thunderbolt" />碎碎念
                                </span>
                            </span>
                        </span>
                        <span v-if="articleFileType==myConstant.fileTypeVideo">
                        <span v-if="articleFileType==fileType.fileTypeVideo_3">
                            <span class="article-meta__separator" style="margin: 0px 3px ;"> | </span>
                            <span class="post-meta-date">
                                <a-icon type="video-camera" />
                                <router-link :to="{path:'/videoDetail',query:{id:id}}">
                                <a @click="routerToPlatform()">
                                    视频
                                </router-link>
                                </a>
                            </span>
                        </span>
                        <!-- <a class="article-meta__categories" href="#"> {{tag}}</a> -->
@@ -116,16 +84,49 @@
    export default {
        methods: {
            showMsg(articleFileType, jumpURL) {
                if (articleFileType == myConstant.fileTypeShort && (jumpURL == null || jumpURL == "")) {
                    this.$message.info('这只是一句碎碎念,没有更多内容啦', 3);
                    return
                }
            }
        },
        components: {
            NotificationOutlined
        },
        data() {
            return {
                fileType: myConstant.fileType,
                img404: "this.onerror='';this.src=\"http://t.inleft.com/share/media_photo/1.jpg\"",
            }
        },
        methods: {
            routerJump(id, articleFileType, typeId) {
                let routerName = "mdDetail";
                if (articleFileType == this.fileType.fileTypeVideo_3) {
                    routerName = "videoDetail";
                }
                this.$router.push({
                    name: routerName,
                    query: {
                        id: id,
                        articleFileType: articleFileType,
                        typeId: typeId
                    },
                    params: {
                        id: id,
                        articleFileType: articleFileType,
                        typeId: typeId
                    }
                })
            },
            routerToPlatform() {
                this.$router.push({
                    name: "platformGroup"
                })
            },
            routerToTypeList(typeId) {
                this.$router.push({
                    name: "articleList",
                    query: {
                        typeId: typeId,
                    }
                })
            }
        },
        props: {
            "index": {
@@ -173,12 +174,6 @@
            "jumpURL": {
                default: "",
            }
        },
        data() {
            return {
                myConstant: myConstant,
                img404: "this.onerror='';this.src=\"http://t.inleft.com/share/media_photo/1.jpg\"",
            }
        }
    }
</script>
@@ -199,6 +194,10 @@
        a {
            position: initial;
        }
        img {
            user-select: none;
        }
    }
    .miniTag {
src/components/mini/box10-add.vue
@@ -24,7 +24,7 @@
            <a-form-model-item label="日志文件" v-show="!form.online">
                <a-upload ref="blogFileUpload" :customRequest="customRequest" name="file" :showUploadList="true"
                    @change="handleChange" :default-file-list="form.blogFileList" :beforeUpload="beforeUpload"
                    :data="{'fileType':myConstant.fileTypeMarkDown}" accept=".md,.html,.htm,.txt">
                    :data="{'bucketName':bucketName.bucket_article}" accept=".md,.html,.htm,.txt">
                    <a-button>
                        <a-icon type="upload" />限 markdown/html
                    </a-button>
@@ -102,7 +102,7 @@
                <a-form-model-item label="封面">
                    <a-upload :customRequest="customRequest" name="file" :showUploadList="true" list-type="picture"
                        :data="{'fileType':myConstant.fileTypeCover}" @change="handleChangeCoverFile"
                        :data="{'bucketName':bucketName.bucket_cover}" @change="handleChangeCoverFile"
                        :default-file-list="form.coverFileList" :beforeUpload="beforeUploadCover"
                        accept=".jpg,.png,.jpeg">
                        <!-- :disabled="form.coverFileList.length>=1" -->
@@ -213,7 +213,7 @@
            };
            return {
                myConstant: myConstant,
                bucketName: myConstant.bucketName,
                blogArticleType: [],
                tags: [],
                inputVisible: false,
@@ -369,7 +369,7 @@
            customRequest(option) {
                const formData = new FormData()
                formData.append('file', option.file)
                formData.append('fileType', option.data.fileType)
                formData.append('bucketName', option.data.bucketName)
                formData.append('authCode', this.form.secret == "" ? "" : md5(this.form.secret))
                myFileInfoUpload(formData).then((res) => {
                    if (res.success) {
src/components/mini/box14-video.vue
@@ -5,50 +5,50 @@
                <a-icon type="delete" /> 空空如也..
            </p>
        </div>
        <div class="gridClass">
            <div class="entry-preview" v-for="item in data">
                <div class="thumbnail_box" @click="showMyVideo(item)">
                    <div class="thumbnail">
                        <img :src="item.coverFileURL" alt="" loading="lazy" :onerror="img404">
                    </div>
                </div>
                <div class="entry-post">
                    <div class="entry-header">
                        <h5 class="entry-title">
                            <router-link :to="{path:'videoDetail',query:{id:item.id}}" :title="item.title">
                                {{item.title}}
                            </router-link>
                            <!-- {{item.title}} -->
                        </h5>
                        <div class="post_content">
                            {{item.introduce}}
        <div style="min-height: 600px;">
            <div class="gridClass">
                <div class="entry-preview" v-for="item in data">
                    <div class="thumbnail_box" @click="showMyVideo(item)">
                        <div class="thumbnail">
                            <img :src="item.coverFileURL" alt="" loading="lazy" :onerror="img404">
                        </div>
                    </div>
                    <div class="entry-meta">
                        <div class="post-categories">
                            <span class="tag vcard">
                                <a-icon type="customer-service" />
                                <a href="#" rel="category tag"> {{item.articleTypeName}}</a>
                            </span>
                            <!-- <span class="tag-list">
                    <div class="entry-post">
                        <div class="entry-header">
                            <h5 class="entry-title">
                                <router-link :to="{path:'videoDetail',query:{id:item.id}}" :title="item.title">
                                    {{item.title}}
                                </router-link>
                                <!-- {{item.title}} -->
                            </h5>
                            <div class="post_content">
                                {{item.introduce}}
                            </div>
                        </div>
                        <div class="entry-meta">
                            <div class="post-categories">
                                <span class="tag vcard">
                                    <a-icon type="customer-service" />
                                    <a href="#" rel="category tag"> {{item.articleTypeName}}</a>
                                </span>
                                <!-- <span class="tag-list">
                                <a href="#" rel="tag">影评</a>
                                <a href="#" rel="tag">电影</a>
                                <a href="#" rel="tag">蜘蛛侠</a>
                            </span> -->
                        </div>
                        <div class="post-on">
                            <span class="entry-date">
                                <a-icon type="calendar" />
                                <a href="#" rel="bookmark">
                                    {{item.publishDate}}
                                </a>
                            </span>
                            </div>
                            <div class="post-on">
                                <span class="entry-date">
                                    <a-icon type="calendar" />
                                    <a href="#" rel="bookmark">
                                        {{item.publishDate}}
                                    </a>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <a-row type="flex" justify="center">
            <div>
@@ -60,7 +60,7 @@
</template>
<script>
    import {
        queryBlogArticleList
        platform
    } from '../../api/blogArticle.js'
    import myConstant from "../../config/myConstant.js"
@@ -76,7 +76,7 @@
                    defaultPageSize: 6
                },
                data: [],
                img404: "this.onerror='';this.src=\"http://t.inleft.com/share/media_photo/idea_beijing.jpg\"",
                img404: myConstant.img404,
            }
        },
        mounted() {
@@ -85,10 +85,10 @@
        methods: {
            onChange(current) {
                this.page.current = current;
                queryBlogArticleList({
                platform({
                    pageNo: current,
                    pageSize: this.page.pageSize,
                    fileType: myConstant.fileTypeVideo
                    activeKey: this.$attrs.activeKey
                }).then((res) => {
                    this.page.total = Number(res.data.total)
                    this.page.pageSize = Number(res.data.size);
@@ -275,17 +275,17 @@
            grid-template-columns: repeat(2, 1fr);
        }
    }
    @media screen and (max-width:767px) {
        .gridClass {
            grid-row-gap: 2rem;
            grid-column-gap: 0rem;
            grid-template-columns: repeat(1, 1fr);
            .entry-preview {
                display: block;
            }
            .thumbnail_box {
                min-width: 100%;
            }
src/components/mini/box14-video3.vue
File was deleted
src/components/mini/box16-videoDetail.vue
@@ -86,6 +86,7 @@
        },
        data() {
            return {
                loadFinish: false,
                showBackButton: false,
                articleId: "",
                lastArticleId: "",
@@ -162,11 +163,20 @@
                        this.myLock = !this.myLock;
                        return
                    }
                    console.log(3333);
                    if (res.data.videoUrlList == null || res.data.videoUrlList.length < 1) {
                        this.$notification.error({
                            message: '该日志还没有上传视频资源..',
                            placement: 'bottomRight'
                        });
                        return
                    }
                    this.isAllowedComment = res.data.isAllowedComment;
                    this.introduce = res.data.introduce;
                    this.videoData.url = res.data.articleFileURL;
                    this.videoData.url = res.data.videoUrlList[0];
                    this.videoData.img = res.data.coverFileURL;
                    this.videoData.title = res.data.title;
                    this.videoData.introduce = res.data.introduce;
src/components/mini/box18-photoShow.vue
@@ -1,37 +1,39 @@
<template>
    <div>
        <div class="gridClass">
            <div class="entry-preview" v-for="item in data">
                <div class="thumbnail_box">
                    <div class="thumbnail" @click="show(item.pictureUrlList)">
                        <img :src="item.coverFileURL" :key="item.id" alt="" loading="lazy" :onerror="img404">
                    </div>
                </div>
                <div class="entry-post">
                    <div class="entry-header">
                        <h5 class="entry-title">
                            <router-link :to="{path:'videoDetail',query:{id:item.id}}" :title="item.title">
                                {{item.title}}
                            </router-link>
                        </h5>
                        <div class="post_content">
                            {{item.introduce}}
        <div style="min-height: 500px;">
            <div class="gridClass">
                <div class="entry-preview" v-for="item in data">
                    <div class="thumbnail_box">
                        <div class="thumbnail" @click="show(item.pictureUrlList)">
                            <img :src="item.coverFileURL" :key="item.id" alt="" loading="lazy" :onerror="img404">
                        </div>
                    </div>
                    <div class="entry-meta">
                        <div class="post-categories">
                            <span class="tag vcard">
                                <a-icon type="customer-service" />
                                <a href="#" rel="category tag"> {{item.articleTypeName}}</a>
                            </span>
                    <div class="entry-post">
                        <div class="entry-header">
                            <h5 class="entry-title">
                                <router-link :to="{name:'mdDetail',query:{id:item.id,typeId:item.articleTypeId}}" :title="item.title">
                                    {{item.title}}
                                </router-link>
                            </h5>
                            <div class="post_content">
                                {{item.introduce}}
                            </div>
                        </div>
                        <div class="post-on">
                            <span class="entry-date">
                                <a-icon type="calendar" />
                                <a href="#" rel="bookmark">
                                    {{item.publishDate}}
                                </a>
                            </span>
                        <div class="entry-meta">
                            <div class="post-categories">
                                <span class="tag vcard">
                                    <a-icon type="customer-service" />
                                    <a href="#" rel="category tag"> {{item.articleTypeName}}</a>
                                </span>
                            </div>
                            <div class="post-on">
                                <span class="entry-date">
                                    <a-icon type="calendar" />
                                    <a href="#" rel="bookmark">
                                        {{item.publishDate}}
                                    </a>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
@@ -56,32 +58,12 @@
    } from '../../api/blogArticle.js'
    import myConstant from "../../config/myConstant.js"
    import optionsConfig from "../../config/v-viewer-Config.js"
    export default {
        data() {
            return {
                options: {
                    'inline': false, // 是否启用inline模式
                    'button': true, // 是否显示右上角关闭按钮
                    'navbar': true, // 是否显示缩略图底部导航栏
                    'title': false, // 是否显示当前图片标题,默认显示alt属性内容和尺寸
                    'toolbar': false, // 是否显示工具栏
                    'tooltip': true, // 放大或缩小图片时,是否显示缩放百分比,默认true
                    'fullscreen': true, // 播放时是否全屏,默认true
                    'loading': true, // 加载图片时是否显示loading图标,默认true
                    'loop': true, // 是否可以循环查看图片,默认true
                    'movable': true, // 是否可以拖得图片,默认true
                    'zoomable': true, // 是否可以缩放图片,默认true
                    'rotatable': true, // 是否可以旋转图片,默认true
                    'scalable': true, // 是否可以翻转图片,默认true
                    'toggleOnDblclick': true, // 放大或缩小图片时,是否可以双击还原,默认true
                    'transition': true, // 使用 CSS3 过度,默认true
                    'keyboard': true, // 是否支持键盘,默认true
                    'zoomRatio': 0.1, // 鼠标滚动时的缩放比例,默认0.1
                    'minZoomRatio': 0.3, // 最小缩放比例,默认0.01
                    'maxZoomRatio': 2.0, // 最大缩放比例,默认100
                    // 'url': 'data-source' // 设置大图片的 url
                },
                options: optionsConfig,
                page: {
                    size: "small",
                    total: 1,
@@ -90,7 +72,7 @@
                    defaultPageSize: 6
                },
                data: [],
                img404: "this.onerror='';this.src=\"http://t.inleft.com/share/media_photo/idea_beijing.jpg\"",
                img404: myConstant.img404,
            }
        },
        mounted() {
@@ -102,9 +84,7 @@
                platform({
                    pageNo: current,
                    pageSize: this.page.pageSize,
                    fileType: 9,
                    typeId: 99,
                    activeKey:this.$attrs.activeKey
                    activeKey: this.$attrs.activeKey
                }).then((res) => {
                    this.page.total = Number(res.data.total)
                    this.page.pageSize = Number(res.data.size);
src/components/mini/mdDetail.vue
@@ -1,10 +1,5 @@
<template>
    <div class="article-meta">
        <!-- <div>
            <a-button @click="()=>this.$router.back(-1)" style="position: absolute;">
                <a-icon type="left" />
            </a-button>
        </div> -->
        <div class="headertop filter-dot headertop-bar " v-if="coverURL.length>0">
            <figure class="centerbg" v-bind:style="{'background-image':'url('+this.coverURL+')'}">
@@ -12,7 +7,7 @@
        </div>
        <div v-if="showMsg && !myLock">
            <div class="mySecretSamll" v-if="articleFileType==myConstant.fileTypeShort">
            <div class="mySecretSamll" v-if="articleFileType==fileType.fileTypeTalking_9">
                <p>碎碎念只有那么一点了</p>
                <p>但是下面依旧可以碎碎念</p>
            </div>
@@ -37,16 +32,16 @@
                <span class="myTip">{{errorMsg}}</span>
            </div>
            <div class="mySecret" v-else-if="articleFileType==myConstant.fileTypeVideo
                || articleFileType==myConstant.fileTypeMp3
                || articleFileType==myConstant.fileTypeShort">
            <div class="mySecret" v-else-if="articleFileType==fileType.fileTypeVideo_3
                || articleFileType==fileType.fileTypeVideo_3
                || articleFileType==fileType.fileTypeTalking_9">
                <div class="mySecretSamll" v-if="introduce.length==0">
                    <p>碎碎念只有那么一点了</p>
                    <p>碎碎念只有那么一点了22</p>
                    <p>但是下面依旧可以碎碎念</p>
                </div>
                <pre style="white-space: pre-line;">
                {{introduce}}
                <pre style="white-space: pre-line;padding: 10px;max-width: 100%;">
                    {{introduce}}
                </pre>
            </div>
            <div v-viewer.static class="markdown-body article-detail" v-else>
@@ -122,6 +117,7 @@
    import {
        queryBlogArticleDetail
    } from '../../api/blogArticle.js'
    import comment from "../mini/box12-comment.vue"
    import axios from 'axios'
@@ -134,12 +130,12 @@
        },
        data() {
            return {
                myConstant: myConstant,
                fileType: myConstant.fileType,
                articelMeta: '',
                isAllowedComment: 1,
                introduce: "",
                articleId: "",
                articleFileType: myConstant.fileTypeMarkDown,
                articleFileType: myConstant.fileType.fileTypeMarkDown_1,
                typeId: null,
                source: "",
                showMsg: false,
@@ -157,6 +153,8 @@
            }
        },
        created() {
            console.log(111);
            console.log(this.$route.params);
            this.articleId = this.$route.query.id;
            this.articleFileType = this.$route.query.articleFileType;
            this.typeId = this.$route.query.typeId;
@@ -186,11 +184,6 @@
            queryDetail() {
                this.showMsg = true;
                this.errorMsg = "加载中..";
                // if (this.articleFileType == myConstant.fileTypeShort) {
                //     this.errorMsg = "该类型日志在这里没有更多啦..";
                //     return
                // }
                queryBlogArticleDetail({
                    id: this.articleId,
@@ -234,8 +227,8 @@
                    this.articelMeta = res.data;
                    if (res.data.articleFileType == myConstant.fileTypeMarkDown ||
                        res.data.articleFileType == myConstant.fileTypeHtml) {
                    if (res.data.articleFileType == this.fileType.fileTypeMarkDown_1 ||
                        res.data.articleFileType == this.fileType.fileTypeHtml_2) {
                        if (res.data.articleFileURL != null && res.data.articleFileURL != '') {
                            this.$axios
                                .get(res.data.articleFileURL)
@@ -275,13 +268,14 @@
    @import '../../assets/md.less';
    .articleTitle {
        h4{
        h4 {
            margin: 0px 0px 20px 0px;
            -webkit-line-clamp: 1;
        }
        text-align: center;
        width: 100%;
    }
    .headertop {
src/components/swichLabel/main1-home.vue
@@ -129,25 +129,7 @@
</script>
<style lang="less">
    @font-face {
        font-family: 'HYTangMeiRen';
        // font-display: swap;
        src: url("http://t.inleft.com/share/z%E5%AD%97%E4%BD%93%E5%BA%93/hytmr55%E6%B1%89%E4%BB%AA%E5%94%90%E7%BE%8E%E4%BA%BA%E5%AD%97%E4%BD%93.woff") format("truetype");
    }
    span,
    p,
    a,
    body,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    code {
        font-family: HYTangMeiRen !important;
    }
    .swichTag {
        min-height: 750px;
src/config/myConstant.js
@@ -1,14 +1,30 @@
//常量
const myConstant = {
    fileTypeMarkDown: 1,
    fileTypeHtml: 2,
    fileTypeVideo: 3,
    fileTypeMp3: 4,
    fileTypeShort: 5,
    fileTypeCover: 9,
    uploadFileSizeLimit: 2 * 1024 * 1024,
    visitorDataKey: "visitorData.inleft.com",
    userName:"inleft"
    userName: "inleft",
    img404: "this.onerror='';this.src=\"http://t.inleft.com/share/media_photo/idea_beijing.jpg\"",
    fileType: {
        fileTypeMarkDown_1: 1,
        fileTypeHtml_2: 2,
        fileTypeVideo_3: 3,
        fileTypeMp3_4: 4,
        fileTypePictures_5: 5,
        fileTypeTalking_9: 9,
    },
    activeKeyType: {
        type_1: "moment",
        type_2: "flash",
        type_3: "store",
    },
    bucketName: {
        bucket_article: "article",
        bucket_video: "mp4",
        bucket_mp3: "mp3",
        bucket_cover: "cover",
        bucket_picture: "picture",
    }
}
src/config/router.config.js
@@ -80,6 +80,7 @@
                }]
            },
            {
                name: "platform",
                path: '/platform',
                component: platform,
                children: [
src/config/v-viewer-Config.js
New file
@@ -0,0 +1,24 @@
//v-viewer 配置项
const options = {
    'inline': false, // 是否启用inline模式
    'button': true, // 是否显示右上角关闭按钮
    'navbar': true, // 是否显示缩略图底部导航栏
    'title': false, // 是否显示当前图片标题,默认显示alt属性内容和尺寸
    'toolbar': false, // 是否显示工具栏
    'tooltip': true, // 放大或缩小图片时,是否显示缩放百分比,默认true
    'fullscreen': true, // 播放时是否全屏,默认true
    'loading': true, // 加载图片时是否显示loading图标,默认true
    'loop': true, // 是否可以循环查看图片,默认true
    'movable': true, // 是否可以拖得图片,默认true
    'zoomable': true, // 是否可以缩放图片,默认true
    'rotatable': true, // 是否可以旋转图片,默认true
    'scalable': true, // 是否可以翻转图片,默认true
    'toggleOnDblclick': true, // 放大或缩小图片时,是否可以双击还原,默认true
    'transition': true, // 使用 CSS3 过度,默认true
    'keyboard': true, // 是否支持键盘,默认true
    'zoomRatio': 0.1, // 鼠标滚动时的缩放比例,默认0.1
    'minZoomRatio': 0.3, // 最小缩放比例,默认0.01
    'maxZoomRatio': 2.0, // 最大缩放比例,默认100
    // 'url': 'data-source' // 设置大图片的 url
}
export default options;