chutingting пре 4 година
родитељ
комит
855bb647a5
3 измењених фајлова са 312 додато и 19 уклоњено
  1. BIN
      src/assets/img/author.png
  2. +311
    -18
      src/page/cultivate/particulars.vue
  3. +1
    -1
      src/page/home/home.vue

BIN
src/assets/img/author.png Прегледај датотеку

Before After
Width: 200  |  Height: 200  |  Size: 7.6 KiB

+ 311
- 18
src/page/cultivate/particulars.vue Прегледај датотеку

@@ -1,7 +1,34 @@
<template>
<div class="Box">
<textTitle :text="textTop" />
<div class="info">
<div class="box_left">
<!-- <textTitle :text="textTop" /> -->
<div class="breadcrumb">
<span class="loc"><i class="el-icon-s-home"></i>当前位置:</span>
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item>武汉富茂链客科技有限公司</el-breadcrumb-item>
<el-breadcrumb-item>{{textTop}}</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="top_title">
<h6>{{data.title}}</h6>
<div class="des">
<div class="fl">
<span>{{data.publishDate}} 发布</span>
</div>
<div class="fr">
<span @click="goLogin">举报</span>
<el-divider direction="vertical"></el-divider>
<span @click="goLogin">修改</span>
<el-divider direction="vertical"></el-divider>
<span @click="goLogin">删除</span>
<el-divider direction="vertical"></el-divider>
<span @click="goLogin">收藏</span>
<el-divider direction="vertical"></el-divider>
<span @click="goLogin">置顶</span>
</div>
</div>
</div>
<div class="info">
<el-card class="info_img">
<img :src="data.mainPicRealPath" alt="">
</el-card>
@@ -10,14 +37,21 @@
<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>
<p>地址:<span>{{data.address}}</span></p>
<el-divider></el-divider>
<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 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>
<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 class="detail_info">
<h1 class="title">信息详情</h1>
@@ -30,6 +64,37 @@
</div>
<div class="detail_ct" v-html="data.content"></div>
</div>
<div class="detail_list">
<h1 class="title">您可能感兴趣</h1>
<div class="detailBox" v-for="(item, index) in list.slice(0,5)" :key="index" @click="goTop(item)">
<div class="imgBox">
<img class="img" :src="item.mainPicRealPath" />
<div class="text">
<h3>{{item.title}}</h3>
<p v-html="item.content"></p>
</div>
</div>
</div>
</div>
</div>
<el-card class="box_right">
<div class="author">
<img :src="authorImg" alt="">
<p>{{data.author}}</p>
</div>
<el-tabs v-model="activeName">
<el-tab-pane label="相关分类" name="first">
<ul>
<li v-for="(item, index) in cateList" :key="index" @click="goCateDetail(item.type)">{{item.title}}</li>
</ul>
</el-tab-pane>
<el-divider></el-divider>
<div class="detailBox" v-for="(item, index) in list" :key="index" @click="goTop(item)">
<h3>{{item.title}}</h3>
</div>
</el-tabs>
</el-card>
<el-dialog
title="联系方式"
:visible.sync="dialogVisible"
@@ -46,6 +111,7 @@
import textTitle from "@/components/headTail/textTitle";
import sidebar from "@/components/sidebar/sidebar";
import moment from "moment"
import authorImg from "@/assets/img/author.png"
import { homeService } from "@/api"
export default {
components: {
@@ -58,8 +124,50 @@ export default {
ifjournalism: this.$route.params.ifjournalism ,//1 => 优秀案例 2 =>新闻详情 3 =>学员风采,
id: this.$route.params.id.split('.')[0], // 截取 .html之前数据
data: {},
dialogVisible: false
dialogVisible: false,
activeName: 'first',
cateList: [
{
title: '生活服务',
type: 4
},
{
title: '房屋租赁',
type: 5
},
{
title: '宠物市场',
type: 6
},
{
title: '餐饮美食',
type: 7
},
{
title: '票务卡券',
type: 8
},
{
title: '教育培训',
type: 9
},
{
title: '企业招聘',
type: 10
},
{
title: '商务服务',
type: 11
}
],
list: [],
authorImg
}
},
watch: {
$route() {
this.getDetail()
}
},
methods: {
setPhone(num) {
@@ -70,10 +178,26 @@ export default {
getDetail() {
return homeService.getNewsDetail(this.id).then(res => {
res.publishDate = moment(res.publishDate).format("YYYY-MM-DD")
res.detailPicture = JSON.parse(res.detailPicture)
res.detailPicture = res.detailPicture ? JSON.parse(res.detailPicture) : []
this.data = res
})
},
/* 底部列表 */
getList() {
let d = {
type: this.ifjournalism ? this.ifjournalism : 1,
pageNum: 1,
pageSize: 8
}
homeService.getNewsList(d).then(res => {
res.list.forEach(ele => {
ele.publishDate = moment(ele.publishDate).format("YYYY-MM-DD")
ele.content = ele.content.replace(/<img\b[^>]*>/, "");
});
this.list = res.list
})
},
getTitle() {
switch(Number(this.ifjournalism)) {
case 1: this.textTop = '行业新闻'
@@ -99,12 +223,24 @@ export default {
case 11: this.textTop = '商务服务'
break;
}
},
goCateDetail (type) {
this.$router.push({path: "/journalism",query:{tag: type}});
},
goLogin() {
this.$router.push({path: "/login"});
},
goTop(item) {
document.documentElement.scrollTop = 0
let detailId= item.id + ".html"
this.id = item.id
this.$router.push({name: "particulars",params:{ id: detailId, ifjournalism: this.ifjournalism}})
}
},
async created() {
this.getTitle()
this.getDetail()
this.getList()
}
};
</script>
@@ -112,14 +248,56 @@ export default {
.Box {
width: 1100px;
padding: 50px 40px;
padding: 36px 40px;
margin: 0 auto;
box-shadow: 0 0 10px #f3f3f3;
background: #fff;
position: relative;
.breadcrumb{
margin-bottom: 10px;
height: 20px;
.loc{
float: left;
}
span{
i{
font-size: 18px;
margin-right: 10px;;
color: #606266;
}
font-size: 16px;
color: #606266;
}
}
.top_title {
border-bottom: 1px #e6e6e6 solid;
padding: 10px;
h6{
font-size: 20px;
}
.des{
height: 20px;
margin-top: 20px;
.fl{
float: left;
span{
color: #999;
}
}
.fr{
float: right;
span{
color: #999;
cursor: pointer;
}
}
}
}
.info {
margin: 20px 40px;
.info_img{
float: left;
margin-bottom: 30px;
img{
width: 300px;
}
@@ -128,19 +306,22 @@ export default {
float: left;
margin-left: 40px;
p{
line-height: 40px;
line-height: 26px;
color: #444;
font-size: 14px;
span{
margin-left: 10px;
}
a{
color: rgb(64, 158, 255);
}
}
}
.info_right{
width: 320px;
float: right;
width: 322px;
margin-top: 10px;
p{
line-height: 40px;
line-height: 28px;
font-size: 14px;
color: #333;
a{
@@ -173,9 +354,121 @@ export default {
padding: 30px;
}
}
.detail_list{
h1{
font-size: 18px;
border-bottom: 1px solid #efefef;
line-height: 40px;
padding: 10px;
}
.detailBox {
margin-top: 30px;
margin-left: 20px;
cursor: pointer;
border-bottom: 1px #ddd dashed;
padding-bottom: 20px;
h3 {
font-size: 14px;
padding-bottom: 4px;
}
.imgBox {
overflow: hidden;
.img {
float: left;
width: 150px;
height: 100px;
}
.text {
float: left;
width: 598px;
height: 100px;
margin-left: 20px;
position: relative;
p {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
line-height: 20px;
overflow: hidden;
color: #999;
font-size: 14px;
}
.time {
display: block;
margin-top: 20px;
position: absolute;
bottom: 0;
width: 100%;
span{
float: right;
}
}
}
}
}
}
.box_left{
float: left;
width: 795px;
}
.box_right{
float: right;
width: 300px;
// height: 300px;
position:absolute;
top: 0;
bottom: 0;
right: 0;
.author{
text-align: center;
margin: 20px;
img{
width: 80px;
}
p{
margin-top: 10px;
}
}
ul {
li{
display: inline-block;
width: 130px;
line-height: 40px;
cursor: pointer;
}
li:before {
content: "";
width: 4px;
height: 4px;
display: inline-block;
border-radius: 50%;
background: #4F8EFF;
vertical-align: middle;
margin-right: 10px;
}
}
.detailBox{
cursor: pointer;
border-bottom: 1px #ddd dashed;
padding: 10px;
h3 {
font-size: 12px;
line-height: 20px;
color: #333;
}
}
}
}
.Box >>> img{
width: 600px;
}
</style>
<style scoped>
.Box .breadcrumb .el-breadcrumb{
float: left;
margin-top: 2px;
}
.Box .breadcrumb >>> .el-breadcrumb__inner{
font-size: 16px;
}
</style>

+ 1
- 1
src/page/home/home.vue Прегледај датотеку

@@ -168,7 +168,7 @@ export default {
pageNum: 1,
pageSize: 100
}
homeService.getData(data).then(res => {
homeService.getNewsList(data).then(res => {
res.list.forEach(ele => {
if (ele.type == 4) { // 生活服务
this.lifeList.push(ele)


Loading…
Откажи
Сачувај