Commit 2c48761f authored by zhanglw's avatar zhanglw

行业资讯

parent 594ceae1
......@@ -9,7 +9,7 @@ import { filterAsyncRouter } from '@/store/modules/permission'
NProgress.configure({ showSpinner: false })// NProgress Configuration
const whiteList = ['/login', '/backlogin', '/home', '/product', '/supplier', '/project', '/course', 'information']// 免登录路由白名单
const whiteList = ['/login', '/backlogin', '/home', '/product', '/supplier', '/project', '/course', '/information']// 免登录路由白名单
const backUrlList = ['/dashboard', '/system', '/monitor', '/sys-tools', '/backstage']// 后台路由
router.beforeEach((to, from, next) => {
......
......@@ -21,6 +21,46 @@
<div class="tab-separate" />
<div class="tab-menu touch" :class="tabIndex==='3'?'active':''" @click="changeTabIndex('3')">行业要闻</div>
</div>
<div v-for="(item,index) in topList" v-show="page===1" :key="'tp_'+index" class="block-box">
<el-row :gutter="20">
<el-col :span="8">
<div style="display: flex">
<el-image :src="item.imgSrc?imgSrcStart+'/img'+item.imgSrc:defaultImgProject" style="width:100%;height: 210px;margin: 20px" />
</div>
</el-col>
<el-col :span="16">
<div class="box-title touch" @click="goToDetails(item, 'information')">{{ item.title }}</div>
<div class="content ellipsis">
{{ item.content }}
</div>
<div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
<div style="color:#999999;padding: 10px 40px"><i class="el-icon-time" style="padding: 0 10px" />{{ item.date }}</div>
</div>
</el-col>
</el-row>
</div>
<div v-show="page===1" class="touch" style="width: 100%;margin: 40px 0">
<el-image :src="promotionObj.imgSrc?imgSrcStart+'/img'+promotionObj.imgSrc:defaultImgBanner" style="width:100%;height: 250px" />
</div>
<div v-for="(item,index) in informationList" :key="'inf_'+index" class="inline-box">
<div class="box-title touch" @click="goToDetails(item, 'information')">{{ item.title }}</div>
<div class="content ellipsis">&#12288;&#12288;{{ item.content }}</div>
<div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
<div style="color:#999999;padding: 10px 40px"><i class="el-icon-time" style="padding: 0 10px" />{{ item.date }}</div>
</div>
</div>
<div class="pagination">
<!-- <span style="font-size: 14px; color: #666; margin-right: 8px">{{ total }} 条记录</span>-->
<el-pagination
:hide-on-single-page="true"
:background="true"
:current-page.sync="page"
:page-size="pageSize"
:total="total"
layout=" prev, pager, next"
@current-change="pageChange"
/>
</div>
</div>
</div>
<home-footer ref="homeFooter" />
......@@ -29,29 +69,26 @@
</div>
</template>
<script>
import default_product from '@/assets/home_images/default_product.png'
import default_project from '@/assets/home_images/default_project.png'
import default_system from '@/assets/home_images/default_system.png'
import default_banner from '@/assets/home_images/banner.png'
import titleMenus from '../components/titleMenusV2'
import userLogin from '../components/userLoginV2'
import languageSetting from '../components/languageSettingV2'
import breadcrumb from '../components/breadcrumb'
import homeFooter from '../components/homeFooter'
import inquiryView from '../components/inquiryView'
import NProgress from 'nprogress'
export default {
components: { titleMenus, userLogin, languageSetting, breadcrumb, homeFooter, inquiryView },
dicts: ['product_type', 'area_province'],
dicts: [],
data() {
return {
defaultImgProduct: default_product,
defaultImgProject: default_project,
defaultImgSystem: default_system,
defaultImgBanner: default_banner,
imgSrcStart: process.env.VUE_APP_BASE_API,
page: 1,
pageSize: 16,
total: 0,
total: 55,
tabIndex: '1',
query: {
keyword: '',
......@@ -59,7 +96,46 @@ export default {
type: undefined,
sort: false
},
areaOpts: [],
promotionObj: {
imgSrc: '',
url: ''
},
topList: [
{
title: '葡萄转色期应该如何管理?',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: ''
}, {
title: '葡萄转色期应该如何管理?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业和相关部门在传感器技术、功能材料等全方面开展工作,服务于美国工业制造、智能制造和军',
date: '2023-06-12',
imgSrc: ''
}
],
informationList: [
{
title: '赤峰市人民政府办公室关于促进全市矿业经济高质量发展的实施意见?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。',
date: '2023-06-12'
}, {
title: '赤峰市人民政府办公室关于促进全市矿业经济高质量发展的实施意见?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。',
date: '2023-06-12'
}, {
title: '赤峰市人民政府办公室关于促进全市矿业经济高质量发展的实施意见?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。',
date: '2023-06-12'
}, {
title: '赤峰市人民政府办公室关于促进全市矿业经济高质量发展的实施意见?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。',
date: '2023-06-12'
}, {
title: '赤峰市人民政府办公室关于促进全市矿业经济高质量发展的实施意见?',
content: '德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出,传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。与当前快速发展的互联网一样,传感器的发展为其带来机遇与挑战。未来传感器的先进程度决定了机械制造、汽车、过程控制和制造领域的国际竞争力。美国则在上世纪80年代就成立了国际技术小组(BGT,政府资源、企业德国传感和测量技术协会 AMA)在《传感器技术2022--让创新互联》报告直接指出传感器技术是很多机器、设备和车辆竞争力的核心技术,是提升其价值增值的手段。',
date: '2023-06-12'
}
],
throttle: null, // 节流器
throttleTime: 300
}
......@@ -71,7 +147,7 @@ export default {
},
methods: {
onDictReady(dict) {
this.areaOpts = [{ value: undefined, label: '全部' }, ...dict.area_province]
},
setQuertType(type) {
if (type === this.query.type) {
......@@ -84,6 +160,7 @@ export default {
changeTabIndex(index) {
if (this.tabIndex !== index) {
this.tabIndex = index
this.page = 1
}
},
// 点击询价
......@@ -124,7 +201,7 @@ export default {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-line-clamp: 4;
text-overflow: ellipsis;
}
// 分页 前文字+分页
......@@ -226,6 +303,38 @@ export default {
font-weight: bold;
color: #333333;
}
.block-box {
width: 100%;
margin: 12px 0;
border: 1px solid rgba(0,0,0,0.12);
box-shadow: 1px 2px 8px 0 rgba(0,0,0,0.12);
border-radius: 10px;
.content {
height: 150px;
padding: 14px 30px 20px 0;
font-size: 16px;
line-height: 32px;
color: #666666;
}
}
.box-title {
padding-top: 24px;
font-size: 22px;
}
.box-title:hover {
color: #0457C7
}
.inline-box {
width: 100%;
border-bottom: 1px solid rgba(0,0,0,0.12);
.content {
padding: 10px 0;
height: 110px;
font-size: 16px;
line-height: 26px;
color: #666666;
}
}
.box-card {
display: inline-block;
position: relative;
......
......@@ -132,7 +132,8 @@
</div>
</el-col>
<el-col :span="12">
<div class="content ellipsis"><span style="font-size: 22px;font-weight: bolder">方案概述</span><br>{{ item.content }}</div>
<div class="box-title touch" @click="goToDetails(item, 'project')">{{ item.title }}</div>
<div class="content ellipsis">{{ item.content }}</div>
<div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
<div class="btn-o" style="width: 140px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'project')">咨 询</div>
</div>
......@@ -292,10 +293,12 @@ export default {
],
projectList: [
{
title: '解决方案',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: ''
}, {
title: '解决方案',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: ''
......@@ -403,7 +406,7 @@ export default {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 7;
-webkit-line-clamp: 6;
text-overflow: ellipsis;
}
.head-box {
......@@ -432,12 +435,22 @@ export default {
border: 1px solid rgba(0,0,0,0.12);
box-shadow: 1px 2px 8px 0 rgba(0,0,0,0.12);
border-radius: 10px;
.box-title {
padding-top: 20px;
padding-left: 10px;
font-size: 22px;
font-weight: bold;
}
.box-title:hover {
color: #0457C7
}
.content {
height: 240px;
padding: 20px 30px 20px 10px;
height: 200px;
padding: 4px 30px 20px 10px;
font-size: 16px;
font-weight: 600;
line-height: 32px;
color: #666;
}
}
.box-card {
......
......@@ -23,12 +23,13 @@
</div>
</el-col>
<el-col :span="12">
<div class="content ellipsis"><span style="font-size: 22px;font-weight: bolder">方案概述</span><br>{{ item.content }}</div>
<div class="box-title touch" @click="goToDetails(item, 'project')">{{ item.title }}</div>
<div class="content ellipsis">{{ item.content }}</div>
<div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
<div class="btn-o" style="width: 140px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'project')">咨 询</div>
</div>
<div class="content" style="padding-top: 0">
<span style="font-size: 22px;font-weight: bolder">相关产品</span>
<span style="font-size: 22px;color: black">相关产品</span>
<div style="display: flex;justify-content: space-between;">
<el-image :src="item.imgSrcList[0]?imgSrcStart+'/img'+item.imgSrcList[0]:defaultImgProject" style="width: 230px;height: 140px;" />
<el-image :src="item.imgSrcList[1]?imgSrcStart+'/img'+item.imgSrcList[1]:defaultImgProject" style="width: 230px;height: 140px;" />
......@@ -44,9 +45,9 @@
<div v-for="(item,index) in serveList" :key="'pj_'+index" class="box-block">
<el-row :gutter="20">
<el-col :span="12">
<div class="content ellipsis" style="height: 240px;padding: 20px 10px 20px 30px;-webkit-line-clamp: 7;">
<span style="font-size: 22px;font-weight: bolder">服务</span>
<br>{{ item.content }}
<div class="box-title touch" style="padding-left: 30px" @click="goToDetails(item, 'project')">{{ item.title }}</div>
<div class="content ellipsis" style="height: 200px;padding: 4px 10px 20px 30px;-webkit-line-clamp: 6;">
&#12288;&#12288;{{ item.content }}
</div>
<div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
<div class="btn-o" style="width: 140px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, null)">咨 询</div>
......@@ -102,11 +103,13 @@ export default {
areaOpts: [],
projectList: [
{
title: '解决方案',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: '',
imgSrcList: []
}, {
title: '解决方案',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: '',
......@@ -115,10 +118,12 @@ export default {
],
serveList: [
{
title: '服务',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: ''
}, {
title: '服务',
content: '状态监测已存在多年,如今,随着物耿网(loT) 的发展,它也有了新发展观看此网络研讨会,了解loT如何演化,状态监测',
date: '2023-06-12',
imgSrc: ''
......@@ -183,7 +188,7 @@ export default {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 5;
-webkit-line-clamp: 4;
text-overflow: ellipsis;
}
// 分页 前文字+分页
......@@ -259,15 +264,24 @@ export default {
}
.box-block {
width: 100%;
margin: 12px 0;
margin: 22px 0;
border: 1px solid rgba(0,0,0,0.12);
box-shadow: 1px 2px 8px 0 rgba(0,0,0,0.12);
border-radius: 10px;
.box-title {
padding-top: 20px;
padding-left: 10px;
font-size: 22px;
}
.box-title:hover {
color: #0457C7
}
.content {
height: 180px;
padding: 20px 30px 20px 10px;
height: 140px;
padding: 4px 30px 20px 10px;
font-size: 16px;
line-height: 32px;
color: #666;
}
}
.box-card {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment