From cae892f7fa165fadbf0c4e8928846f715cda7a88 Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期三, 23 三月 2022 18:29:30 +0800 Subject: [PATCH] 增加介绍文档 --- src/components/page/introduce.vue | 139 ++++++++++++++++++++++++++++++++++++++------- 1 files changed, 116 insertions(+), 23 deletions(-) diff --git a/src/components/page/introduce.vue b/src/components/page/introduce.vue index 29aa131..41641c1 100644 --- a/src/components/page/introduce.vue +++ b/src/components/page/introduce.vue @@ -1,29 +1,122 @@ <template> - <div> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - <span>姒傚喌</span><br> - </div> + <div> + <el-row> + <globalTitle /> + </el-row> + <el-row class="mart10"> + <!-- 灏忔爣棰� --> + <el-col :span="4" class="marr10"> + <ul> + <li v-for="(item, index) in menuList" :key="index" class="liStylenone liPointer marb10" @click="changeMenu(item)"> + <b :class="cont == item.name ? 'ft-blue' : 'ft-black'">{{item.name}}</b> + </li> + </ul> + </el-col> + <!-- 鏂伴椈鍐呭 --> + <el-card class="box-card"> + <el-col> + <div v-html="this.new.content" class="ql-editor"></div> + </el-col> + </el-card> + </el-row> + </div> </template> -<script> -export default { - name:'introduce' -} +<script> +import globalTitle from '../globalTitle.vue' +import {getMinTitle,getNewsList,getnew} from '../../api/api' +export default { + name: 'introduce', + components: { + globalTitle + }, + data() { + return { + cont: '', + menuList: [], + newsList:[], + new:{} //鏂伴椈瀵硅薄 + } + }, + created() { + }, + mounted() { + this.getTitle(); + }, + watch: { + menuList(n,o){ + this.cont = this.menuList[0].name; + this.getnews(this.menuList[0]); //鏀瑰彉瀵硅薄锛岃彍鍗曟爮鐨勪笢瑗胯鍐欏埌鐩戝惉灞炴�ч噷杈� + } + }, + methods: { + //鑾峰彇灏忔爣棰樼殑id + getTitle(){ + const data = Number(this.$route.query.id); + getMinTitle(data).then(res => { + // console.log(res); + if(res.code == 200){ + this.menuList = res.data + } + }).catch(err => { + console.log(err); + }) + }, + //灏忔爣棰樿彍鍗曠殑鐞冨垏鎹� + changeMenu(val) { + this.cont = val.name; + this.getnews(val) + }, + //鑾峰彇鍒颁簡鏂伴椈鍒楄〃锛岄噷杈瑰彧鏈変竴涓璞� + getnews(item){ + const data = { + current:1, + newsCategoryId:item.id, + size:5 + }; + getNewsList(data).then(res => { + // console.log(res); + if(res.code == 200){ + this.newsList = res.data.records + this.getalone(this.newsList[0].id) + } + }).catch(error => { + console.log(error); + }) + }, + //鑾峰彇鏂伴椈鍐呭,寰楀埌涓�涓柊闂诲璞� + getalone(id){ + const data = id; + getnew(data).then(res => { + // console.log(res); + if(res.code == 200){ + this.new = res.data; + console.log(this.new.content); + } + }).catch(error => { + console.log(error); + }) + } + } +} </script> <style lang="less" scoped> - +ul { + width: 200px; + li { + background-color: rgb(242, 243, 245); + height: 50px; + line-height: 50px; + text-align: center; + } +} +.ft-blue { + color: rgb(9, 143, 252); +} +.ft-black { + color: #000; +} +.ql-editor{ + padding: 12px 0px !important; +} </style> \ No newline at end of file -- Gitblit v1.8.0