cjy-Web
/
cjy_web
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(solution): 优化解决方案页面并添加新功能

Browse Source 
- 更新页面结构和样式，增加更多视觉元素- 添加全域旅游和智慧景区解决方案的详细信息
- 增加经典案例和新闻资讯的展示- 优化导航栏和底部栏，增加交互功能
- 重构部分代码以提高可维护性
main
Tuzki 9 months ago
parent f3d2323bc3
commit af5986dddd
5 changed files with 614 additions and 238 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 376
      src/views/components/v-bottom/index.vue
  2. 253
      src/views/components/v-header/index.vue
  3. 178
      src/views/pages/case-detail.vue
  4. 5
      src/views/pages/case-list.vue
  5. 38
      src/views/pages/index.vue

376
src/views/components/v-bottom/index.vue
Unescape View File

@ -10,16 +10,28 @@
<div class="left-content">{{ company_data.url }}</div>
</div>
<div class="cjy-bottom-nav row">
<div class="nav-item" v-for="(item,index) in nav_list" :key="index" @click="gotoPages(item.url)">
<div class="item-title">{{ item.title }}</div>
<div class="item-children" v-for="(cell,i) in item.child" :key="i">
<div class="nav-item">
<div class="item-title">全域旅游</div>
<div class="item-children" v-for="(cell, i) in solvePlan" :key="i" @click="gotoPages(cell.id,1)">
<div class="children-title">{{ cell.title }}</div>
</div>
</div>
<div class="nav-item">
<div class="item-title">智慧景区</div>
<div class="item-children" v-for="(cell, i) in scensePlan" :key="i" @click="gotoPages(cell.id,1)">
<div class="children-title">{{ cell.title }}</div>
</div>
</div>
<div class="nav-item">
<div class="item-title">经典案例</div>
<div class="item-children" v-for="(cell, i) in classicCase" :key="i" @click="gotoPages(cell.id,2)">
<div class="children-title">{{ cell.title }}</div>
</div>
</div>
</div>
<div class="cjy-bottom-right">
<img :src="company_data.qrCode">
<div class="text">关注公众号<br/>
<div class="text">关注公众号<br />
了解更多最新动态
</div>
</div>
@ -32,201 +44,237 @@
</template>
<script>
import * as Api from '@/api/cjy/company';
export default {
name: "index",
data() {
return {
copy_date:null,
nav_list: [],
company_data: [],//企业信息
}
},
mounted() {
this.copy_date=new Date().getFullYear()
this.getCompany()
this.getNavList()
},
methods: {
/** 提交按钮 */
async getCompany(){
let res=await Api.getColumnInfo();
this.company_data=res.data
import * as Api from '@/api/cjy/company';
import * as Apis from "@/api/cjy/columninfo"
export default {
name: "index",
data() {
return {
copy_date: null,
nav_list: [],
company_data: [],//企业信息
solvePlan:[],
scensePlan:[],
classicCase:[]
}
},
getNavList() {
this.nav_list = [
{
title: "全域旅游", child: [
{title: "文旅大数据中心",url:""},
{title: "文旅产业监测平台",url:""},
{title: "大数据分析平台",url:""},
{title: "一部手机游平台",url:""},
{title: "智慧导游导览系统",url:""},
]
},
{
title: "智慧景区", child: [
{title: "景区综合管控平台",url:""},
{title: "景区票务系统",url:""},
{title: "衡水老白干智慧景区",url:""},
{title: "一部手机游平台",url:""},
{title: "智慧导游导览系统",url:""},
]
},
{
title: "经典案例", child: [
{title: "文旅厅全域旅游"},
{title: "老白干智慧景区"},
{title: "沽源全域旅游"},
{title: "沙河市农厕监管平台"},
{title: "一部手机游平台"},
]
}
]
mounted() {
this.copy_date = new Date().getFullYear()
this.getCompany()
this.getNavList()
this.getCompanyAllArea()
this.getCompanySolvePlan()
this.getClassicCase()
},
// 跳转页面 函数
gotoPages(val) {
this.$router.push(val)
methods: {
/** 提交按钮 */
async getCompany() {
let res = await Api.getColumnInfo();
this.company_data = res.data
},
//全域旅游解决方案
async getCompanyAllArea() {
const params = {
type: 3,
infoType: 1
}
let res = await Apis.getColumnInfoList(params)
this.solvePlan = res.data.list.slice(0, 6);
console.log(res)
},
//智慧景区解决方案
async getCompanySolvePlan() {
const params = {
type: 3,
infoType: 2
}
let res = await Apis.getColumnInfoList(params)
this.scensePlan = res.data.list.slice(0, 6);
console.log(res)
},
//经典案例
async getClassicCase() {
const params = {
type: 5,
}
let res = await Apis.getColumnInfoList(params)
this.classicCase = res.data.list.slice(0, 6);
console.log(res)
},
getNavList() {
this.nav_list = [
{
title: "全域旅游", child: [
{ title: "文旅大数据中心", url: "" },
{ title: "文旅产业监测平台", url: "" },
{ title: "大数据分析平台", url: "" },
{ title: "一部手机游平台", url: "" },
{ title: "智慧导游导览系统", url: "" },
]
},
{
title: "智慧景区", child: [
{ title: "景区综合管控平台", url: "" },
{ title: "景区票务系统", url: "" },
{ title: "衡水老白干智慧景区", url: "" },
{ title: "一部手机游平台", url: "" },
{ title: "智慧导游导览系统", url: "" },
]
},
{
title: "经典案例", child: [
{ title: "文旅厅全域旅游" },
{ title: "老白干智慧景区" },
{ title: "沽源全域旅游" },
{ title: "沙河市农厕监管平台" },
{ title: "一部手机游平台" },
]
}
]
},
// 跳转页面 函数
gotoPages(val,type) {
this.$router.push("/case-detail?id=" + val + "&type=" + type)
}
}
}
}
</script>
<style scoped lang="scss">
.cjy-bottom {
height: 480px;
padding-top: 80px;
background: url("~@/assets/images/v-bottom-bg.jpg");
.cjy-bottom-left {
position: relative;
width: 300px;
padding-right: 30px;
margin-right: 80px;
&:after {
content: "";
position: absolute;
right: 0;
top: 0px;
width: 1px;
height: 250px;
background-color: rgb(30, 56, 93)
}
.tel-number {
font-weight: 600;
font-size: 32px;
line-height: 150%;
color: #fff;
}
.cjy-bottom {
height: 480px;
padding-top: 80px;
background: url("~@/assets/images/v-bottom-bg.jpg");
.tel-text {
color: #fff;
}
.cjy-bottom-left {
position: relative;
width: 300px;
padding-right: 30px;
margin-right: 80px;
.left-title {
color: #fff;
font-weight: 700;
font-size: 16px;
}
.left-content {
color: #fff;
}
}
&:after {
content: "";
position: absolute;
right: 0;
top: 0px;
width: 1px;
height: 250px;
background-color: rgb(30, 56, 93)
}
.cjy-bottom-nav {
.nav-item {
width: 200px;
.tel-number {
font-weight: 600;
font-size: 32px;
line-height: 150%;
color: #fff;
}
.tel-text {
color: #fff;
}
.item-title {
position: relative;
margin-bottom: 30px;
.left-title {
color: #fff;
font-weight: 700;
font-size: 16px;
&:after {
content: "";
position: absolute;
left: 0;
bottom: -10px;
width: 30px;
height: 2px;
border-radius: 2px;
background-color: #fff
}
}
.children-title {
margin-top: 15px;
color: rgba(255, 255, 255, .8);
cursor: pointer;
.left-content {
color: #fff;
}
}
}
.cjy-bottom-right {
margin-left: 60px;
.cjy-bottom-nav {
.nav-item {
width: 200px;
.text {
margin-top: 20px;
color: #fff;
}
}
.cjy-bottom-copy {
position: relative;
margin-top: 30px;
padding-top: 30px;
&:after {
content: "";
position: absolute;
left: 0;
top: 0px;
width: 100%;
height: 1px;
background-color: rgb(30, 56, 93)
.item-title {
position: relative;
margin-bottom: 30px;
color: #fff;
font-weight: 700;
font-size: 16px;
&:after {
content: "";
position: absolute;
left: 0;
bottom: -10px;
width: 30px;
height: 2px;
border-radius: 2px;
background-color: #fff
}
}
.children-title {
margin-top: 15px;
color: rgba(255, 255, 255, .8);
cursor: pointer;
}
}
}
.copy-text {
color: #fff;
.cjy-bottom-right {
margin-left: 60px;
.text {
margin-top: 20px;
color: #fff;
}
}
.copy-text:first-child {
margin-right: 80px;
.cjy-bottom-copy {
position: relative;
margin-top: 30px;
padding-top: 30px;
&:after {
content: "";
position: absolute;
left: 0;
top: 0px;
width: 100%;
height: 1px;
background-color: rgb(30, 56, 93)
}
.copy-text {
color: #fff;
}
.copy-text:first-child {
margin-right: 80px;
}
}
}
}
@media (max-width: 768px) {
.cjy-bottom {
padding: 20px 0;
height: auto;
@media (max-width: 768px) {
.cjy-bottom {
padding: 20px 0;
height: auto;
.cjy-bottom-left {
width: auto;
margin-right: 0;
padding-right: 0;
text-align: center;
.cjy-bottom-left {
width: auto;
margin-right: 0;
padding-right: 0;
text-align: center;
&:after {
display: none
&:after {
display: none
}
}
}
.cjy-bottom-nav {
display: none
}
.cjy-bottom-nav {
display: none
}
.cjy-bottom-right {
display: none
.cjy-bottom-right {
display: none
}
}
}
}
</style>

253
src/views/components/v-header/index.vue
Unescape View File

@ -3,12 +3,15 @@
<div class="v-container cjy-header-box row flex-align-center">
<div class="cjy-header-logo">
<img
:src="theme == 'header-light' ? require('@/assets/images/logo_red.svg') : theme == '' ?require('@/assets/images/logo_red.svg'): require('@/assets/images/logo_white.svg')"
:src="theme == 'header-light' ? require('@/assets/images/logo_red.svg') : theme == '' ? require('@/assets/images/logo_red.svg') : require('@/assets/images/logo_white.svg')"
class="img" />
</div>
<div class="cjy-header-nav row">
<div class="nav-item" v-for="(item, index) in nav_list" :key="index" @click="gotoPages(item.url)">{{
item.title}}</div>
<div class="nav-item" :class="{ 'active': activeIndex == index }" v-for="(item, index) in nav_list" :key="index"
@click="gotoPages(item.url)" @mouseover="hoverItem(index)">
{{ item.title || '--' }}
<span class="rote-icon" v-if="index == 1 || index == 2"><i class="el-icon-arrow-down"></i></span>
</div>
</div>
<div class="call-box">
<div class="call-icon-box">
@ -19,10 +22,43 @@
</div>
</div>
</div>
<div class="content-list" v-show="showContent" @mouseleave="closeContent">
<div class="list-box is-flex" v-if="activeIndex == 1">
<div class="list-box-left">
<div class="min-title">全域旅游</div>
<div class="nav-item-text-box">
<div class="nav-item-text" v-for="(item, index) in solvePlan" :key='index' @click="gotoPages1(item.id,1)">
{{ item.title }}
</div>
</div>
</div>
<div class="list-box-right">
<div class="min-title">智慧景区</div>
<div class="nav-item-text-box">
<div class="nav-item-text" v-for="(item, index) in scensePlan" :key='index' @click="gotoPages1(item.id,1)">
{{ item.title }}
</div>
</div>
</div>
</div>
<div class="list-box" v-if="activeIndex == 2">
<div class="min-title">热门案例</div>
<div class="list-item-pic">
<div class="list-item-i" v-for="(item, index) in case_list" :key="index" @click="gotoPages1(item.id,2)">
<div class="img-boox">
<el-image class="img" :src="item.logo"></el-image>
</div>
<div class="image-title">{{ item.title }}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as Api from "@/api/cjy/columninfo"
export default {
name: "index",
props: {
@ -32,17 +68,99 @@
},
data() {
return {
nav_list: []
nav_list: [],
showContent: false,
activeIndex: null,
queryParams: {
pageNo: 1,
pageSize: 10,
},
case_list: [],
solvePlan: [],
scensePlan: [],
}
},
mounted() {
this.getNavList()
this.infoPages()
this.getCompanyAllArea()
this.getCompanySolvePlan()
},
methods: {
closeContent() {
this.$nextTick(() => {
if (document.querySelector('.content-list')) {
document.querySelector('.content-list').style.opacity = 0
}
setTimeout(() => {
this.showContent = false
this.activeIndex = null
}, 100)
})
},
//全域旅游解决方案
async getCompanyAllArea() {
const params = {
type: 3,
infoType: 1
}
let res = await Api.getColumnInfoList(params)
this.solvePlan = res.data.list.slice(0, 5);
this.solvePlan.push({
title: '更多方案',
id: this.solvePlan[0].id
})
console.log(res)
},
//智慧景区解决方案
async getCompanySolvePlan() {
const params = {
type: 3,
infoType: 2
}
let res = await Api.getColumnInfoList(params)
this.scensePlan = res.data.list.slice(0, 5);
this.scensePlan.push({
title: '更多方案',
id: this.scensePlan[0].id
})
console.log(res)
},
//案例
async infoPages() {
this.queryParams.type = 5
let res = await Api.getColumnInfoList(this.queryParams)
this.case_list = res.data.list.filter(item => item.recommend == 1)
},
hoverItem(val) {
this.activeIndex = val
console.log(val)
if (val == 1 || val == 2) {
this.$nextTick(() => {
this.showContent = true
setTimeout(() => {
if (document.querySelector('.content-list')) {
document.querySelector('.content-list').style.opacity = 1
}
}, 100)
})
} else {
this.$nextTick(() => {
if (document.querySelector('.content-list')) {
console.log(document.querySelector('.content-list'))
document.querySelector('.content-list').style.opacity = 0
}
setTimeout(() => {
this.showContent = false
}, 100)
})
}
},
getNavList() {
this.nav_list = [
{ title: "首页", url: "/home" },
{ title: "解决方案", url: "" },
{ title: "解决方案"},
{ title: "经典案例", url: "/case-list" },
{ title: "新闻资讯", url: "/news-list" },
{ title: "关于我们 ", url: "/about-us" }
@ -51,6 +169,9 @@
// 跳转页面 函数
gotoPages(val) {
this.$router.push(val)
},
gotoPages1(val, type) {
this.$router.push("/case-detail?id=" + val + "&type=" + type)
}
}
}
@ -58,12 +179,12 @@
<style scoped lang="scss">
.cjy-header {
height: 100px;
height: fit-content;
background-color: #fff;
transition: all 0.3s ease-in-out;
.cjy-header-box {
height: 100%
height: 100px
}
.cjy-header-logo {
@ -80,6 +201,11 @@
color: #2A333D;
font-size: 16px;
cursor: pointer;
.rote-icon {
transition: all 0.3s ease-in-out;
display: inline-block;
}
}
.nav-item {
@ -139,7 +265,8 @@
backdrop-filter: blur(5px);
box-shadow: rgba(0, 0, 0, 0.1) 2px 8px 8px;
.nav-item,.info-box{
.nav-item,
.info-box {
color: #2A333D !important;
}
@ -148,4 +275,114 @@
}
}
.content-list {
position: fixed;
top: 100px;
z-index: 999;
width: 100%;
background-color: #fff;
transition: all 0.3s ease-in-out;
opacity: 0;
.list-box {
max-width: 1220px;
margin: 0 auto;
padding: 20px;
.min-title {
color: #333;
font-size: 20px;
font-weight: bold;
margin-bottom: 10px;
cursor: pointer;
transition: all ease-in-out 0.3s;
&:hover {
color: #0B59B3
}
}
.list-item-pic {
width: 100%;
display: flex;
align-items: center;
flex-wrap: nowrap;
overflow-x: scroll;
scrollbar-width: none;
.list-item-i {
width: 300px;
height: fit-content;
height: 250px;
cursor: pointer;
flex: none;
transition: all ease-in-out 0.3s;
scale: 0.98;
&:not(:first-child) {
margin-left: 15px;
}
&:hover {
scale: 1;
}
.img-boox {
width: 100%;
height: 200px;
.img {
width: 100%;
}
}
.image-title {
font-size: 16px;
font-weight: bold;
}
}
}
}
.is-flex {
display: flex;
align-items: center;
justify-content: space-between;
.list-box-left,
.list-box-right {
width: 50%;
.nav-item-text-box {
.nav-item-text {
line-height: 35px;
color: #333;
width: 45%;
margin-left: 5%;
margin-top: 14px;
padding-left: 15px;
border-radius: 5px;
cursor: pointer;
transition: all ease-in-out 0.3s;
background: linear-gradient(to right, #33333328, #f6f6f600);
&:hover {
color: #0B59B3;
padding-left: 18px;
background: linear-gradient(to right, #0066be37, #f6f6f600);
}
}
}
}
}
}
.active {
.rote-icon {
transform: rotate(180deg);
}
}
</style>

178
src/views/pages/case-detail.vue
Unescape View File

@ -5,32 +5,45 @@
<!-- 页面 广告条 -->
<div class="cjy-banner">
<div class="cjy-banner-text">
<div class="title">{{ banner_data.title }}</div>
<div class="subtitle">{{ banner_data.subtitle }}</div>
<div class="title">{{ banner_data.title || '--' }}</div>
<div class="subtitle">{{ banner_data.subtitle || '--' }}</div>
</div>
<img :src="banner_data.logo" class="img"/>
<img :src="banner_data.logo" class="img" />
</div>
<!-- 页面 面包屑 -->
<div class="v-container">
<el-breadcrumb class="m-t-normal" separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>经典案例</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>{{ type == 2 ? '经典案例' : '解决方案' }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
<!-- 案例 详情 -->
<div class="v-container">
<div class="cjy-case-detail row">
<div class="detail-left">
<div class="detail-left" v-if="type == 1">
<div class="title tourism">全域旅游</div>
<div class="menu-list">
<div class="list-item" v-for="(item,index) in menu_list" :class="active_menu=='type-1-'+index?'active':''" :key="index" @click="getCaseData(item.id,'type-1-'+index)">
{{item.title}}
<div class="list-item" v-for="(item, index) in solvePlan" @click="infoPages(item.id, 1)"
:class="active_menu == 'type-1-' + item.id ? 'active' : ''" :key="index">
{{ item.title }}
</div>
</div>
<div class="title scenic">智慧园区</div>
<div class="menu-list">
<div class="list-item" v-for="(item,index) in menu_list" :class="active_menu=='type-2-'+index?'active':''" :key="index" @click="getCaseData(item.id,'type-2-'+index)">
{{item.title}}
<div class="list-item" v-for="(item, index) in scensePlan" @click="infoPages(item.id, 1)"
:class="active_menu == 'type-1-' + item.id ? 'active' : ''" :key="index">
{{ item.title }}
</div>
</div>
</div>
<div class="detail-left" v-if="type == 2">
<div class="title tourism">相关推荐</div>
<div class="list-item" v-for="(item, index) in case_list" :key="index" @click="gotoPages(item.id, 2)">
<div class="item-box row">
<div class="item-image"><img :src="item.logo" class="img"></div>
<div class="item-content">
<div class="title">{{ item.title }}</div>
</div>
</div>
</div>
</div>
@ -45,54 +58,115 @@
</div>
</template>
<script>
import * as Api from "@/api/cjy/columninfo"
import { DICT_TYPE, getDictDatas } from "@/utils/dict";
export default {
name: "case-list",
data() {
return {
banner_data: null,//广告图
case_id: null,
case_data: {},//案例数据
menu_list: [],// 菜单数据
active_menu:'type-1-0',
}
},
mounted() {
this.case_id = this.$route.query.id;
// 获取 左侧菜单
this.getMenuData()
// 获取 案例详情
this.infoPages()
// 获取 轮播图
this.getBanner()
},
methods: {
// 轮播图 函数
async getBanner() {
let res = await Api.getColumnInfoList({type: 13});
this.banner_data = res.data.list[0]
import * as Api from "@/api/cjy/columninfo"
import { DICT_TYPE, getDictDatas } from "@/utils/dict";
export default {
name: "case-list",
data() {
return {
banner_data: {
title: null,
subtitle: null
},//广告图
case_id: null,
case_data: {},//案例数据
active_menu: 'type-1-0',
type: 2,
case_list: [],
solvePlan: [],
scensePlan: [],
}
},
// 左侧菜单 函数
getMenuData(){
this.menu_list=this.getDictDatas(DICT_TYPE.COLUMN_TYPE)
mounted() {
this.case_id = this.$route.query.id;
this.type = this.$route.query.type ? this.$route.query.type : 2;
if (this.type == 1) {
this.getCompanyAllArea();
this.getCompanySolvePlan();
this.getBanner1();
this.infoPages(this.case_id, this.type);
} else {
this.getBanner();
this.getPlanList();
this.infoPages(this.case_id, this.type);
}
},
// 案例详情 函数
async infoPages(id,active) {
if(active){
this.active_menu = active
watch: {
'$route'(to, from) {
console.log(to, from);
// 当路由变化时调用 infoPages 方法
this.infoPages(to.query.id, to.query.type ? to.query.type : 2);
this.case_id = to.query.id;
this.type = to.query.type ? to.query.type : 2;
if (to.query.type && to.query.type == 2) {
this.getBanner();
this.getPlanList()
} else {
this.getBanner1()
this.getCompanyAllArea();
this.getCompanySolvePlan();
}
}
let res = await Api.getDetail(this.case_id)
this.case_data = res.data
},
// 跳转页面 函数
gotoPages(val) {
this.$router.push("/case-detail?id" + val)
methods: {
async getPlanList() {
const params = {
type: 5,
}
let res = await Api.getColumnInfoList(params)
this.case_list = res.data.list.filter(item => item.recommend == 1)
},
//全域旅游解决方案
async getCompanyAllArea() {
const params = {
type: 3,
infoType: 1
}
let res = await Api.getColumnInfoList(params)
this.solvePlan = res.data.list.slice(0, 6);
console.log(res)
},
//智慧景区解决方案
async getCompanySolvePlan() {
const params = {
type: 3,
infoType: 2
}
let res = await Api.getColumnInfoList(params)
this.scensePlan = res.data.list.slice(0, 6);
console.log(res)
},
// 轮播图 函数
async getBanner() {
let res = await Api.getColumnInfoList({ type: 13 });
this.banner_data = res.data.list[0]
},
async getBanner1() {
let res = await Api.getColumnInfoList({ type: 15 });
this.banner_data = res.data.list[0]
},
// 左侧菜单 函数
// 案例详情 函数
async infoPages(id, active) {
if (active == 1) {
this.active_menu = 'type-1-' + id;
}
let res = await Api.getDetail(id);
console.log(res.data); // 检查返回的数据结构
this.case_data = res.data; // 确保数据赋值正确
},
// 跳转页面 函数
gotoPages(val, type) {
this.$router.push("/case-detail?id=" + val + "&type=" + type)
}
}
}
}
</script>
<style scoped>
<style scoped lang="scss">
.list-item {
cursor: pointer;
}
</style>

5
src/views/pages/case-list.vue
Unescape View File

@ -44,7 +44,10 @@ export default {
name: "case-list",
data() {
return {
banner_data: null,//广告图
banner_data: {
title:null,
subtitle:null,
},//广告图
queryParams: {
pageNo: 1,
pageSize: 10,

38
src/views/pages/index.vue
Unescape View File

@ -32,19 +32,19 @@
<div class="content-title solve-plan-title">
<span>全域旅游解决方案</span>
<div class="saw-more-box">
<div class="saw-more">全部产品</div>
<div class="saw-more" @click="gotoDetail(solvePlan[0].id,1)">全部产品</div>
</div>
</div>
<div class="ciontent-text solve-plan-text">
<el-tabs class="pc-el-tabs" stretch v-model="activeName">
<el-tab-pane v-for="(product, index) in solvePlan" :key="index" :label="product.title"
:name="'第' + index + '个'">
:name="'第' + index + '个'" >
<div class="solve-plan-tabs-content">
<div class="solve-plan-tabs-content-left">
<div class="solve-plan-tabs-content-left-html"
v-html="product.introduction ? product.introduction : ''">
</div>
<div class="saw-detail">查看详情&rarr;</div>
<div class="saw-detail" @click="gotoDetail(product.id,1)">查看详情&rarr;</div>
</div>
<div class="solve-plan-tabs-content-right">
<img :src="product.logo ? product.logo : ''" alt="">
@ -61,7 +61,7 @@
<div class="content-title scence-plan-title">
<span>智慧景区解决方案</span>
<div class="saw-more-box">
<div class="saw-more">全部产品</div>
<div class="saw-more" @click="gotoDetail(scensePlan[0].id,1)">全部产品</div>
</div>
</div>
<div class="ciontent-text solve-plan-text scence-plan-text">
@ -76,7 +76,7 @@
<div class="solve-plan-tabs-content-left-html"
v-html="product.introduction ? product.introduction : ''">
</div>
<div class="saw-detail">查看详情&rarr;</div>
<div class="saw-detail" @click="gotoDetail(product.id,1)">查看详情&rarr;</div>
</div>
</div>
</el-tab-pane>
@ -89,7 +89,7 @@
<div class="content-title scence-plan-title classic-case-title">
<span>经典案例</span>
<div class="saw-more-box">
<div class="saw-more">全部案例</div>
<div class="saw-more" @click="gotoClassicCaseList">全部案例</div>
</div>
</div>
<div class="ciontent-text classic-case-text">
@ -109,7 +109,7 @@
</div>
</div>
<div class="classic-case-text-right-bottom">
<div class="saw-detail">
<div class="saw-detail" @click="gotoDetail(formattedClassicAse[ativeindex].id,2)">
查看详情<i class="el-icon-arrow-right"></i>
</div>
</div>
@ -152,14 +152,14 @@
<div class="content-title scence-plan-title classic-case-title news-title">
<span>动态与资讯</span>
<div class="saw-more-box">
<div class="saw-more">查看更多</div>
<div class="saw-more" @click="gotoNewsList">查看更多</div>
</div>
</div>
<div class="ciontent-text news-text">
<el-tabs class="pc-el-tabs-dark short-tabs" stretch v-model="activeName2" @tab-click="handleClick">
<el-tab-pane label="公司动态" name="first">
<el-row class="news-row" :gutter="40">
<el-col v-for="(item, index) in newsList" class="news-col" :span="12">
<el-col v-for="(item, index) in newsList" class="news-col" :span="12" @click.native="gotoNews(item.id)">
<div class="news-img-box">
<el-image class="news-img" :src="item.logo" />
</div>
@ -180,7 +180,7 @@
</el-tab-pane>
<el-tab-pane label="行业资讯" name="second">
<el-row class="news-row" :gutter="40">
<el-col v-for="(item, index) in newsList" class="news-col" :span="12">
<el-col v-for="(item, index) in newsList" class="news-col" :span="12" @click.native="gotoNews(item.id)">
<div class="news-img-box">
<el-image class="news-img" :src="item.logo" />
</div>
@ -384,7 +384,7 @@
type: 5,
}
let res = await Api.getColumnInfoList(params)
this.classicCase = res.data.list.slice(0, 7);
this.classicCase = res.data.list.slice(0, 6);
console.log(res)
},
//合作伙伴
@ -505,6 +505,20 @@
learnMoreElement.classList.remove('animate__animated', 'animate__fadeInDown');
}
},
gotoNewsList(){
this.$router.push("/news-list")
},
//资讯详情
gotoNews(val) {
this.$router.push("/news-detail?id=" + val)
},
gotoClassicCaseList(){
this.$router.push("/case-list")
},
//方案案例详情
gotoDetail(val,type){
this.$router.push("/case-detail?id=" + val + "&type=" + type)
}
}
}
@ -525,7 +539,7 @@
background-color: #fff !important;
}
.info-box{
.info-box {
color: #fff !important;
}
}

Write Preview
Loading…
Cancel
Save