@@ -13,6 +13,7 @@ | |||||
"element-ui": "^2.13.2", | "element-ui": "^2.13.2", | ||||
"moment": "^2.28.0", | "moment": "^2.28.0", | ||||
"vue": "^2.6.11", | "vue": "^2.6.11", | ||||
"vue-awesome-swiper": "^4.1.1", | |||||
"vue-router": "^3.2.0", | "vue-router": "^3.2.0", | ||||
"vuex": "^3.4.0" | "vuex": "^3.4.0" | ||||
}, | }, | ||||
@@ -4,10 +4,10 @@ | |||||
<meta charset="utf-8"> | <meta charset="utf-8"> | ||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||||
<meta name="viewport" content="width=device-width,initial-scale=1.0"> | <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"> | <link rel="icon" href="<%= BASE_URL %>favicon.ico"> | ||||
<title>瑜璟缘国际形象礼仪,国际礼仪培训机构,企业培训机构,形象礼仪,形象礼仪培训师</title> | |||||
<title>武汉富茂链客科技有限公司</title> | |||||
<!-- <script> | <!-- <script> | ||||
var _hmt = _hmt || []; | var _hmt = _hmt || []; | ||||
(function() { | (function() { | ||||
@@ -1,14 +1,45 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<!-- <div class="leftBox"> --> | |||||
<textTitle :text="textTop" /> | <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> | ||||
<!-- </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> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
@@ -19,20 +50,27 @@ import { homeService } from "@/api" | |||||
export default { | export default { | ||||
components: { | components: { | ||||
textTitle, | textTitle, | ||||
sidebar, | |||||
sidebar | |||||
}, | }, | ||||
data() { | data() { | ||||
return { | return { | ||||
textTop :"优秀案例", | textTop :"优秀案例", | ||||
ifjournalism: this.$route.params.ifjournalism ,//1 => 优秀案例 2 =>新闻详情 3 =>学员风采, | ifjournalism: this.$route.params.ifjournalism ,//1 => 优秀案例 2 =>新闻详情 3 =>学员风采, | ||||
id: this.$route.params.id.split('.')[0], // 截取 .html之前数据 | id: this.$route.params.id.split('.')[0], // 截取 .html之前数据 | ||||
data: {} | |||||
data: {}, | |||||
dialogVisible: false | |||||
} | } | ||||
}, | }, | ||||
methods: { | methods: { | ||||
setPhone(num) { | |||||
if(num) { | |||||
return num.replace(num.substr(3,4), '*'.repeat(4)); | |||||
} | |||||
}, | |||||
getDetail() { | getDetail() { | ||||
return homeService.getNewsDetail(this.id).then(res => { | return homeService.getNewsDetail(this.id).then(res => { | ||||
res.publishDate = moment(res.publishDate).format("YYYY-MM-DD") | res.publishDate = moment(res.publishDate).format("YYYY-MM-DD") | ||||
res.detailPicture = JSON.parse(res.detailPicture) | |||||
this.data = res | this.data = res | ||||
}) | }) | ||||
}, | }, | ||||
@@ -67,7 +105,7 @@ export default { | |||||
this.getTitle() | this.getTitle() | ||||
this.getDetail() | this.getDetail() | ||||
}, | |||||
} | |||||
}; | }; | ||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
@@ -78,23 +116,66 @@ export default { | |||||
margin: 0 auto; | margin: 0 auto; | ||||
box-shadow: 0 0 10px #f3f3f3; | box-shadow: 0 0 10px #f3f3f3; | ||||
background: #fff; | 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{ | .Box >>> img{ | ||||
width: 600px; | width: 600px; | ||||
} | } | ||||
.particularsBox { | |||||
width: 90%; | |||||
margin: 0 5%; | |||||
height: 300px; | |||||
background-color: bisque; | |||||
} | |||||
</style> | </style> |
@@ -9,11 +9,11 @@ | |||||
<div class="con_txt fr"> | <div class="con_txt fr"> | ||||
<div class="headline" @click="goparticulars(busOneData)"> | <div class="headline" @click="goparticulars(busOneData)"> | ||||
<h6>{{busOneData.title}}</h6> | <h6>{{busOneData.title}}</h6> | ||||
<p v-html="busOneData.content"></p> | |||||
<p v-html="removeImg(busOneData.content)"></p> | |||||
<!-- <a href="#">[详细]</a> --> | <!-- <a href="#">[详细]</a> --> | ||||
</div> | </div> | ||||
<ul class="list"> | <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> | <a @click="goparticulars(bus)"> {{bus.title}} </a> | ||||
</li> | </li> | ||||
</ul> | </ul> | ||||
@@ -24,7 +24,7 @@ | |||||
<div class="life col"> | <div class="life col"> | ||||
<h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | <h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | ||||
<ul class="list"> | <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> | <a @click="goparticulars(item)"> {{item.title}} </a> | ||||
</li> | </li> | ||||
</ul> | </ul> | ||||
@@ -75,7 +75,7 @@ | |||||
<div class="col" v-for="(item, index) in cateList" :key="index"> | <div class="col" v-for="(item, index) in cateList" :key="index"> | ||||
<h1><span>{{item.title}}</span><a @click="more(item.type)">MORE+</a></h1> | <h1><span>{{item.title}}</span><a @click="more(item.type)">MORE+</a></h1> | ||||
<ul class="list"> | <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> | <a @click="goparticulars(con)"> {{con.title}} </a> | ||||
</li> | </li> | ||||
</ul> | </ul> | ||||
@@ -86,7 +86,7 @@ | |||||
<div class="col"> | <div class="col"> | ||||
<h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | <h1><span>生活服务</span><a @click="more(4)">MORE+</a></h1> | ||||
<div class="imgList"> | <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=""> | <img :src="item.mainPicRealPath" alt=""> | ||||
<span>{{item.title}}</span> | <span>{{item.title}}</span> | ||||
</a> | </a> | ||||
@@ -112,7 +112,6 @@ export default { | |||||
data() { | data() { | ||||
return { | return { | ||||
slideList: [], | slideList: [], | ||||
partnersList: [], | |||||
newsList: [], | newsList: [], | ||||
busOneData: {}, | busOneData: {}, | ||||
busList: [], | busList: [], | ||||
@@ -162,22 +161,12 @@ export default { | |||||
this.slideList = res.list | this.slideList = res.list | ||||
}) | }) | ||||
}, | }, | ||||
/* 左侧合作伙伴 */ | |||||
getPartnersList() { | |||||
let data = { | |||||
pageNum: 1, | |||||
pageSize: 5 | |||||
} | |||||
homeService.getPartnersList(data).then(res => { | |||||
this.partnersList = res.list | |||||
}) | |||||
}, | |||||
/* 新闻列表 */ | /* 新闻列表 */ | ||||
getNewsList() { | getNewsList() { | ||||
let data = { | let data = { | ||||
// type: 1, | // type: 1, | ||||
pageNum: 1, | pageNum: 1, | ||||
pageSize: 10 | |||||
pageSize: 90 | |||||
} | } | ||||
homeService.getNewsList(data).then(res => { | homeService.getNewsList(data).then(res => { | ||||
res.list.forEach(ele => { | res.list.forEach(ele => { | ||||
@@ -206,11 +195,14 @@ export default { | |||||
go(path) { | go(path) { | ||||
this.$router.push(`/${path}`); | this.$router.push(`/${path}`); | ||||
}, | }, | ||||
removeImg(con) { | |||||
if(con) { | |||||
return con.replace(/<img.*?>/g ,''); | |||||
} | |||||
} | |||||
}, | }, | ||||
created() { | created() { | ||||
this.getSlideList() | |||||
this.getPartnersList() | |||||
this.getSlideList() | |||||
this.getNewsList() | this.getNewsList() | ||||
} | } | ||||
}; | }; | ||||
@@ -288,13 +280,16 @@ export default { | |||||
.con_txt{ | .con_txt{ | ||||
width: 352px; | width: 352px; | ||||
ul{ | ul{ | ||||
height: 172px; | |||||
height: 158px; | |||||
overflow: hidden; | overflow: hidden; | ||||
padding-top: 6px; | |||||
} | } | ||||
.headline{ | .headline{ | ||||
border-bottom: 1px dashed #dadada; | border-bottom: 1px dashed #dadada; | ||||
padding-bottom: 10px; | |||||
padding-bottom: 15px; | |||||
cursor: pointer; | cursor: pointer; | ||||
height: 80px; | |||||
overflow: hidden; | |||||
h6{ | h6{ | ||||
font-size: 16px; | font-size: 16px; | ||||
font-weight: bold; | font-weight: bold; | ||||
@@ -404,6 +399,7 @@ export default { | |||||
display: block; | display: block; | ||||
color: #333; | color: #333; | ||||
margin-top: 20px; | margin-top: 20px; | ||||
max-width: 198px; | |||||
} | } | ||||
margin: 20px; | margin: 20px; | ||||
} | } | ||||
@@ -211,12 +211,12 @@ const router = new VueRouter({ | |||||
router.beforeEach((to, from, next) => { | router.beforeEach((to, from, next) => { | ||||
document.documentElement.scrollTop = 0 | 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() | next() | ||||
}) | }) | ||||
export default router | export default router |