| @@ -13,6 +13,7 @@ | |||
| "element-ui": "^2.13.2", | |||
| "moment": "^2.28.0", | |||
| "vue": "^2.6.11", | |||
| "vue-awesome-swiper": "^4.1.1", | |||
| "vue-router": "^3.2.0", | |||
| "vuex": "^3.4.0" | |||
| }, | |||
| @@ -4,10 +4,10 @@ | |||
| <meta charset="utf-8"> | |||
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <meta name="keywords" content="礼仪培训师资格证,线上礼仪培训班,礼仪培训网课,形象礼仪培训师在线考证" /> | |||
| <meta name="description" content="瑜璟缘国际形象礼仪主营:礼仪培训,礼仪培训师,商务礼仪培训,社交礼仪培训,服务礼仪培训,企业礼仪培训,职场礼仪培训,礼仪培训班,政务礼仪培训的培训团队。电话:13121112777欢迎您来电咨询!" /> | |||
| <!-- <meta name="keywords" content="武汉富茂链客科技有限公司" /> | |||
| <meta name="description" content="武汉富茂链客科技有限公司" /> --> | |||
| <link rel="icon" href="<%= BASE_URL %>favicon.ico"> | |||
| <title>瑜璟缘国际形象礼仪,国际礼仪培训机构,企业培训机构,形象礼仪,形象礼仪培训师</title> | |||
| <title>武汉富茂链客科技有限公司</title> | |||
| <!-- <script> | |||
| var _hmt = _hmt || []; | |||
| (function() { | |||
| @@ -1,14 +1,45 @@ | |||
| <template> | |||
| <div class="Box"> | |||
| <!-- <div class="leftBox"> --> | |||
| <textTitle :text="textTop" /> | |||
| <div> | |||
| <h1 class="title">{{data.title}}</h1> | |||
| <p >{{data.publishDate}}</p> | |||
| <div v-html="data.content"></div> | |||
| <div class="info"> | |||
| <div class="info_img"> | |||
| <img :src="data.mainPicRealPath" alt=""> | |||
| </div> | |||
| <div class="info_list"> | |||
| <p>标题:<span>{{data.title}}</span></p> | |||
| <p>日期:<span>{{data.publishDate}}</span></p> | |||
| <p>姓名:<span>{{data.author}}</span></p> | |||
| <p>电话:<span>{{setPhone(data.phone)}} </span> <el-button type="primary" size="mini" plain @click="dialogVisible = true">获取联系方式</el-button></p> | |||
| <p>地址:<span>{{data.address}}</span></p> | |||
| </div> | |||
| <el-card class="info_right"> | |||
| <p>虚假信息,检举举报. <a href="http://service@iformall.com" target="_blank">service@iformall.com</a></p> | |||
| <p>如有违法违规行为,依法处理</p> | |||
| <p>提防诈骗,本站不提供线上线下交易。</p> | |||
| <p>商务合作,请联系 <a href="http://service@iformall.com" target="_blank">service@iformall.com</a></p> | |||
| </el-card> | |||
| </div> | |||
| <!-- </div> --> | |||
| <!-- <sidebar /> --> | |||
| <div class="detail_info"> | |||
| <h1 class="title">信息详情</h1> | |||
| <div class="detail_img"> | |||
| <el-carousel type="card" > | |||
| <el-carousel-item v-for="(item, index) in data.detailPicture" :key="index"> | |||
| <img :src="item.url" alt=""> | |||
| </el-carousel-item> | |||
| </el-carousel> | |||
| </div> | |||
| <div class="detail_ct" v-html="data.content"></div> | |||
| </div> | |||
| <el-dialog | |||
| title="联系方式" | |||
| :visible.sync="dialogVisible" | |||
| width="30%"> | |||
| <h3>{{data.phone}}</h3> | |||
| <span slot="footer" class="dialog-footer"> | |||
| <el-button @click="dialogVisible = false">取 消</el-button> | |||
| <el-button type="primary" @click="dialogVisible = false">确 定</el-button> | |||
| </span> | |||
| </el-dialog> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| @@ -19,20 +50,27 @@ import { homeService } from "@/api" | |||
| export default { | |||
| components: { | |||
| textTitle, | |||
| sidebar, | |||
| sidebar | |||
| }, | |||
| data() { | |||
| return { | |||
| textTop :"优秀案例", | |||
| ifjournalism: this.$route.params.ifjournalism ,//1 => 优秀案例 2 =>新闻详情 3 =>学员风采, | |||
| id: this.$route.params.id.split('.')[0], // 截取 .html之前数据 | |||
| data: {} | |||
| data: {}, | |||
| dialogVisible: false | |||
| } | |||
| }, | |||
| methods: { | |||
| setPhone(num) { | |||
| if(num) { | |||
| return num.replace(num.substr(3,4), '*'.repeat(4)); | |||
| } | |||
| }, | |||
| getDetail() { | |||
| return homeService.getNewsDetail(this.id).then(res => { | |||
| res.publishDate = moment(res.publishDate).format("YYYY-MM-DD") | |||
| res.detailPicture = JSON.parse(res.detailPicture) | |||
| this.data = res | |||
| }) | |||
| }, | |||
| @@ -67,7 +105,7 @@ export default { | |||
| this.getTitle() | |||
| this.getDetail() | |||
| }, | |||
| } | |||
| }; | |||
| </script> | |||
| <style scoped lang="scss"> | |||
| @@ -78,23 +116,66 @@ export default { | |||
| margin: 0 auto; | |||
| box-shadow: 0 0 10px #f3f3f3; | |||
| background: #fff; | |||
| .title { | |||
| padding: 10px 0; | |||
| font-size: 18px; | |||
| text-align: center; | |||
| .info { | |||
| margin: 20px 40px; | |||
| .info_img{ | |||
| float: left; | |||
| img{ | |||
| width: 300px; | |||
| } | |||
| } | |||
| .info_list{ | |||
| float: left; | |||
| margin-left: 30px; | |||
| p{ | |||
| line-height: 40px; | |||
| color: #444; | |||
| font-size: 14px; | |||
| span{ | |||
| margin-left: 10px; | |||
| } | |||
| } | |||
| } | |||
| .info_right{ | |||
| width: 320px; | |||
| float: right; | |||
| p{ | |||
| line-height: 40px; | |||
| font-size: 14px; | |||
| color: #333; | |||
| a{ | |||
| color: rgb(64, 158, 255); | |||
| } | |||
| } | |||
| } | |||
| } | |||
| p { | |||
| text-align: center; | |||
| padding: 10px; | |||
| .detail_info{ | |||
| clear: both; | |||
| padding-top: 20px; | |||
| .title { | |||
| padding: 10px 0; | |||
| font-size: 18px; | |||
| border-bottom: 1px solid #efefef; | |||
| line-height: 40px; | |||
| padding: 10px; | |||
| } | |||
| .detail_img{ | |||
| width: 80%; | |||
| margin: 10px auto; | |||
| .el-carousel__item{ | |||
| background: none; | |||
| } | |||
| img{ | |||
| width: 100%; | |||
| } | |||
| } | |||
| .detail_ct{ | |||
| padding: 30px; | |||
| } | |||
| } | |||
| } | |||
| .Box >>> img{ | |||
| width: 600px; | |||
| } | |||
| .particularsBox { | |||
| width: 90%; | |||
| margin: 0 5%; | |||
| height: 300px; | |||
| background-color: bisque; | |||
| } | |||
| </style> | |||
| @@ -9,11 +9,11 @@ | |||
| <div class="con_txt fr"> | |||
| <div class="headline" @click="goparticulars(busOneData)"> | |||
| <h6>{{busOneData.title}}</h6> | |||
| <p v-html="busOneData.content"></p> | |||
| <p v-html="removeImg(busOneData.content)"></p> | |||
| <!-- <a href="#">[详细]</a> --> | |||
| </div> | |||
| <ul class="list"> | |||
| <li v-for="(bus, index) in busList" :key="index"> | |||
| <li v-for="(bus, index) in busList.slice(0,5)" :key="index"> | |||
| <a @click="goparticulars(bus)"> {{bus.title}} </a> | |||
| </li> | |||
| </ul> | |||
| @@ -24,7 +24,7 @@ | |||
| <div class="life col"> | |||
| <h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | |||
| <ul class="list"> | |||
| <li v-for="(item, index) in lifeList" :key="index"> | |||
| <li v-for="(item, index) in lifeList.slice(0,8)" :key="index"> | |||
| <a @click="goparticulars(item)"> {{item.title}} </a> | |||
| </li> | |||
| </ul> | |||
| @@ -75,7 +75,7 @@ | |||
| <div class="col" v-for="(item, index) in cateList" :key="index"> | |||
| <h1><span>{{item.title}}</span><a @click="more(item.type)">MORE+</a></h1> | |||
| <ul class="list"> | |||
| <li v-for="(con, idx) in item.list" :key="idx"> | |||
| <li v-for="(con, idx) in item.list.slice(0,6)" :key="idx"> | |||
| <a @click="goparticulars(con)"> {{con.title}} </a> | |||
| </li> | |||
| </ul> | |||
| @@ -86,7 +86,7 @@ | |||
| <div class="col"> | |||
| <h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | |||
| <div class="imgList"> | |||
| <a v-for="(item, index) in lifeList" :key="index" @click="goparticulars(item)"> | |||
| <a v-for="(item, index) in lifeList.slice(0,10)" :key="index" @click="goparticulars(item)"> | |||
| <img :src="item.mainPicRealPath" alt=""> | |||
| <span>{{item.title}}</span> | |||
| </a> | |||
| @@ -112,7 +112,6 @@ export default { | |||
| data() { | |||
| return { | |||
| slideList: [], | |||
| partnersList: [], | |||
| newsList: [], | |||
| busOneData: {}, | |||
| busList: [], | |||
| @@ -162,22 +161,12 @@ export default { | |||
| this.slideList = res.list | |||
| }) | |||
| }, | |||
| /* 左侧合作伙伴 */ | |||
| getPartnersList() { | |||
| let data = { | |||
| pageNum: 1, | |||
| pageSize: 5 | |||
| } | |||
| homeService.getPartnersList(data).then(res => { | |||
| this.partnersList = res.list | |||
| }) | |||
| }, | |||
| /* 新闻列表 */ | |||
| getNewsList() { | |||
| let data = { | |||
| // type: 1, | |||
| pageNum: 1, | |||
| pageSize: 10 | |||
| pageSize: 90 | |||
| } | |||
| homeService.getNewsList(data).then(res => { | |||
| res.list.forEach(ele => { | |||
| @@ -206,11 +195,14 @@ export default { | |||
| go(path) { | |||
| this.$router.push(`/${path}`); | |||
| }, | |||
| removeImg(con) { | |||
| if(con) { | |||
| return con.replace(/<img.*?>/g ,''); | |||
| } | |||
| } | |||
| }, | |||
| created() { | |||
| this.getSlideList() | |||
| this.getPartnersList() | |||
| this.getSlideList() | |||
| this.getNewsList() | |||
| } | |||
| }; | |||
| @@ -288,13 +280,16 @@ export default { | |||
| .con_txt{ | |||
| width: 352px; | |||
| ul{ | |||
| height: 172px; | |||
| height: 158px; | |||
| overflow: hidden; | |||
| padding-top: 6px; | |||
| } | |||
| .headline{ | |||
| border-bottom: 1px dashed #dadada; | |||
| padding-bottom: 10px; | |||
| padding-bottom: 15px; | |||
| cursor: pointer; | |||
| height: 80px; | |||
| overflow: hidden; | |||
| h6{ | |||
| font-size: 16px; | |||
| font-weight: bold; | |||
| @@ -404,6 +399,7 @@ export default { | |||
| display: block; | |||
| color: #333; | |||
| margin-top: 20px; | |||
| max-width: 198px; | |||
| } | |||
| margin: 20px; | |||
| } | |||
| @@ -211,12 +211,12 @@ const router = new VueRouter({ | |||
| router.beforeEach((to, from, next) => { | |||
| document.documentElement.scrollTop = 0 | |||
| let head = document.getElementsByTagName('head'); | |||
| let meta = document.createElement('meta'); | |||
| document.querySelector('meta[name="keywords"]').setAttribute('content', '礼仪培训师资格证,线上礼仪培训班,礼仪培训网课,形象礼仪培训师在线考证') | |||
| document.querySelector('meta[name="description"]').setAttribute('content', '瑜璟缘国际形象礼仪主营:礼仪培训,礼仪培训师,商务礼仪培训,社交礼仪培训,服务礼仪培训,企业礼仪培训,职场礼仪培训,礼仪培训班,政务礼仪培训的培训团队。电话:13121112777欢迎您来电咨询!') | |||
| head[0].appendChild(meta) | |||
| document.title = '瑜璟缘国际形象礼仪,国际礼仪培训机构,企业培训机构,形象礼仪,形象礼仪培训师' | |||
| // let head = document.getElementsByTagName('head'); | |||
| // let meta = document.createElement('meta'); | |||
| // document.querySelector('meta[name="keywords"]').setAttribute('content', '礼仪培训师资格证,线上礼仪培训班,礼仪培训网课,形象礼仪培训师在线考证') | |||
| // document.querySelector('meta[name="description"]').setAttribute('content', '瑜璟缘国际形象礼仪主营:礼仪培训,礼仪培训师,商务礼仪培训,社交礼仪培训,服务礼仪培训,企业礼仪培训,职场礼仪培训,礼仪培训班,政务礼仪培训的培训团队。电话:13121112777欢迎您来电咨询!') | |||
| // head[0].appendChild(meta) | |||
| document.title = '武汉富茂链客科技有限公司' | |||
| next() | |||
| }) | |||
| export default router | |||