nyzy_vue/src/views/gateway/common/header.vue

436 lines
16 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div :class="banClass">
<div class="header">
<div class="h_down clearfloat">
<div class="logo left"><img src="img/logo.png" ></div>
<div class="h_home right" style="padding: 30px 0 0 10px;">
<a href="javascript:void(0)" @click="addShow">设为首页</a>
<a href="javascript:void(0)"> | </a>
<a href="javascript:void(0)" @click="addFavo">加入收藏</a>
</div>
<div class="sch_downbox right">
<input v-model="searchText" placeholder="请输入要搜索的内容" @keyup.enter="() => {searchText?$to('listPageSearch',{findStr:searchText}):''}"/>
<span class="sch_img right" @click="() => {searchText?$to('listPageSearch',{findStr:searchText}):''}"><img src="img/search.png" ></span>
</div>
</div>
</div>
<div id="MutiNav">
<ul class="multiUl">
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" href="javascript:void(0);" title="首页" @click="$to('home',{pid:'home'})">
<span class="mulgochie">首页</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:301})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe672;</i></span>
<span>工作动态</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:302})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe67e;</i></span>
<span>行业要闻</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:401})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe854;</i></span>
<span>数据中心</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:304})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe627;</i></span>
<span>科研成果</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:305})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe748;</i></span>
<span>政策文件</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:306})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe7c2;</i></span>
<span>最新动态</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:303})" class="fjsjkih2 left">
<span><i class="iconfont">&#xe777;</i></span>
<span>合作交流</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage3',{pid:1,id:501})" class="fjsjkih2 left" style="border: 0;">
<span><i class="iconfont">&#xe71e;</i></span>
<span>专题专栏</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli" >
<a class="mulgo" href="javascript:void(0);" title="关于本所" @click="$to('gybs',{pid:'gybs'})">
<span class="mulgochie">关于本所</span>
</a>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" href="javascript:void(0);" title="区域农业资源" @click="$to('listPage2',{pid:101,id:10101})">
<span class="mulgochie">区域农业资源</span>
</a>
<blockquote>
<div class="ChildNavIn">
<ul>
<li class="clearfloat">
<a href="javascript:void(0);" class="xbzlzd left" @click="$to('listPage2',{pid:101,id:10101})">
<span><i class="iconfont">&#xe855;</i></span>
<span>西部杂粮杂豆</span>
</a>
<div class="xbcot right">
<template v-for="(col,colIndex) in xbzlzdList" >
<a href="javascript:void(0);" :key="colIndex" @click="$to('listPage2',{id:col.id})">{{col.name}}</a>
</template>
</div>
</li>
<li class="clearfloat">
<a href="javascript:void(0);" class="xbzlzd left" @click="$to('listPage2',{pid:101,id:10102})">
<span><i class="iconfont">&#xe611;</i></span>
<span>东部经济资源</span>
</a>
<div class="xbcot right">
<template v-for="(col,colIndex) in dbjjzyList" >
<a href="javascript:void(0);" :key="colIndex" @click="$to('listPage2',{id:col.id})">{{col.name}}</a>
</template>
</div>
</li>
<li class="clearfloat">
<a href="javascript:void(0);" class="xbzlzd left" @click="$to('listPage2',{pid:101,id:10103})">
<span><i class="iconfont">&#xe622;</i></span>
<span>中部粮食资源</span>
</a>
<div class="xbcot right">
<template v-for="(col,colIndex) in zblszyList" >
<a href="javascript:void(0);" :key="colIndex" @click="$to('listPage2',{id:col.id})">{{col.name}}</a>
</template>
</div>
</li>
<li class="clearfloat">
<a href="javascript:void(0);" class="xbzlzd left" @click="$to('listPage2',{pid:101,id:10104})">
<span><i class="iconfont">&#xe607;</i></span>
<span>适宜吉林省<br>种质资源</span>
</a>
<div class="xbcot right">
<template v-for="(col,colIndex) in syjlsList" >
<a href="javascript:void(0);" :key="colIndex" @click="$to('listPage2',{id:col.id})">{{col.name}}</a>
</template>
</div>
</li>
<li class="clearfloat">
<a href="javascript:void(0)" class="xbzlzd" style="width: 100%;" @click="$to('listPage2',{pid:101,id:10105})">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</li>
</ul>
</div>
</blockquote>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" href="javascript:void(0);" title="农业产业化" @click="$to('listPage',{pid:102,id:10201})">
<span class="mulgochie">农业产业化</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage',{pid:102,id:10201})" class="fjsjkih left">
<span><i class="iconfont">&#xe601;</i></span>
<span>特色农业产业化</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:102,id:10202})" class="fjsjkih left">
<span><i class="iconfont">&#xe632;</i></span>
<span>粮食产业化</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:102,id:10203})" class="fjsjkih left">
<span><i class="iconfont">&#xe841;</i></span>
<span>畜牧业产业化</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:102,id:10204})" class="fjsjkih left" style="border: 0;">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" title="布局规划" href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10301})">
<span class="mulgochie">布局规划</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10301})" class="fjsjkih left">
<span><i class="iconfont">&#xe7e4;</i></span>
<span>吉林省农业资源规划</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10302})" class="fjsjkih left">
<span><i class="iconfont">&#xe856;</i></span>
<span>西部特色经济作物区域布局</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10306})" class="fjsjkih left">
<span><i class="iconfont">&#xe8f9;</i></span>
<span>东部特色资源区域布局</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10303})" class="fjsjkih left">
<span><i class="iconfont">&#xe615;</i></span>
<span>中部粮食加工业区域布局</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10304})" class="fjsjkih left">
<span><i class="iconfont">&#xe61b;</i></span>
<span>历史区划数据</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:103,id:10305})" class="fjsjkih left" style="border: 0;">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" title="绿色农业" href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10401})">
<span class="mulgochie">绿色农业</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10401})" class="fjsjkih left">
<span><i class="iconfont">&#xe63a;</i></span>
<span>保护性耕作</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10402})" class="fjsjkih left">
<span><i class="iconfont">&#xe636;</i></span>
<span>农业资源循环利用</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10403})" class="fjsjkih left">
<span><i class="iconfont">&#xec4d;</i></span>
<span>农产品安全</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10404})" class="fjsjkih left">
<span><i class="iconfont">&#xe9e7;</i></span>
<span>棚膜经济</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:104,id:10405})" class="fjsjkih left" style="border: 0;">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu">
<a class="mulgo" title="科研动态" href="javascript:void(0);" @click="$to('listPage',{pid:105,id:10501})">
<span class="mulgochie">科研动态</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage',{pid:105,id:10501})" class="fjsjkih left">
<span><i class="iconfont">&#xe60e;</i></span>
<span>资源区划</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:105,id:10502})" class="fjsjkih left">
<span><i class="iconfont">&#xe604;</i></span>
<span>农业产业化</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:105,id:10503})" class="fjsjkih left" style="border: 0;">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli" @mouseenter="openMenu" @mouseleave="closeMenu" >
<a class="mulgo" title="助力乡村振兴" href="javascript:void(0);" @click="$to('listPage',{pid:106,id:10601})">
<span class="mulgochie">助力乡村振兴</span>
</a>
<blockquote>
<div class="ChildNavIn">
<div class="gersawd clearfloat">
<div class="vdas">
<a href="javascript:void(0);" @click="$to('listPage',{pid:106,id:10601})" class="fjsjkih left">
<span><i class="iconfont">&#xe6a1;</i></span>
<span>助力乡村振兴</span>
</a>
<a href="javascript:void(0);" @click="$to('listPage',{pid:106,id:10602})" class="fjsjkih left" style="border: 0;">
<span><i class="iconfont">&#xe646;</i></span>
<span>其他</span>
</a>
</div>
</div>
</div>
</blockquote>
</li>
<li class="multiUlli">
<a class="mulgo" title="其他" href="javascript:void(0);" @click="$to('listPage',{pid:107})">
<span class="mulgochie">其他</span>
</a>
</li>
</ul>
</div>
</div>
</template>
<script>
import { getwayMixin } from '@/views/gateway/mixins/getwayMixin'
import { getAction } from '@/api/manage'
let mst;
export default {
mixins:[getwayMixin],
props:{
},
computed:{
},
data(){
return {
window,
searchText: '',
columnList: [],
xbzlzdList:[],
dbjjzyList:[],
zblszyList:[],
syjlsList:[],
}
},
mounted(){
this.loadData();
},
computed:{
banClass(){
let r = 'detailHtml';
var pid = this.$route.query.pid
var fullPath = this.$route.fullPath
console.log('fullPath--->',fullPath,pid);
// if(!pid){
// r = 'ban';
// }
switch (pid) {
case 101: r = 'baner8'; break;
case 102: r = 'baner4'; break;
case 103: r = 'baner'; break;
case 104: r = 'baner5'; break;
case 105: r = 'baner3'; break;
case 106: r = 'baner7'; break;
case 107: r = 'baner6'; break;
case 'gybs': r = 'baner2'; break;
case 'home': r = 'ban'; break;
case 501: r = 'detailHtml'; break;
case 306: r = 'detailHtml'; break;
case 305: r = 'detailHtml'; break;
case 304: r = 'detailHtml'; break;
case 303: r = 'detailHtml'; break;
case 302: r = 'detailHtml'; break;
case 301: r = 'baner9'; break;
case 1: r = 'baner9'; break;
default:
break;
}
if(fullPath.indexOf('detailedPage')>-1){
r = "detailHtml";
}else if(fullPath.indexOf('home')>-1){
r = "ban";
}
return r;
}
},
updated(){
},
methods:{
addFavo() {
alert("您的浏览器不支持加入收藏功能请使用Ctrl+D进行添加")
},
addShow() {
alert("您的浏览器不支持设为首页请按照下面步骤进行操作1.打开浏览器设置。2.点击设置网页。3.复制本网址,然后进行粘贴点击确定!")
},
loadData(){
if(this.$route.query.findStr){
this.searchText = this.$route.query.findStr;
}
//查询区域农业资源--西部杂粮杂豆 内容列表
getAction('/gateway/gatewayColumn/list',{pageSize:-1,isRelease:'Y',parent:10101}).then((res)=>{
if(res.success){
let list = res.result.records||res.result;
this.xbzlzdList = list;
}
});
//查询区域农业资源--东部经济资源 内容列表
getAction('/gateway/gatewayColumn/list',{pageSize:-1,isRelease:'Y',parent:10102}).then((res)=>{
if(res.success){
let list = res.result.records||res.result;
this.dbjjzyList = list;
}
});
//查询区域农业资源--中部粮食资源 内容列表
getAction('/gateway/gatewayColumn/list',{pageSize:-1,isRelease:'Y',parent:10103}).then((res)=>{
if(res.success){
let list = res.result.records||res.result;
this.zblszyList = list;
}
});
//查询区域农业资源--适宜吉林省 内容列表
getAction('/gateway/gatewayColumn/list',{pageSize:-1,isRelease:'Y',parent:10104}).then((res)=>{
if(res.success){
let list = res.result.records||res.result;
this.syjlsList = list;
}
});
//查询栏目
// getAction('/gateway/gatewayColumn/list',{pageSize:-1,isEnable:'Y',type:'!!BLANK'}).then((res)=>{
// if(res.success){
// let list = res.result.records||res.result;
// let map = {};
// //转成map
// let parentList = list.filter(x => {
// if(x.parent){
// return false;
// }else{
// map[x.id] = x;
// return true;
// }
// });
// //孩子找父亲
// list.forEach(x => {
// let parent = map[x.parent] || {};
// if(!parent.list) parent.list = [];
// parent.list.push(x);
// });
// this.columnList = parentList;
// }
// });
},
//鼠标移入菜单上,显示其下菜单
openMenu(e){
var curItem = jQuery(e.target);
mst = setTimeout(function(){//延时触发
curItem.find("blockquote").slideDown('fast');
mst = null;
});
},
//鼠标移出菜单时,隐藏其下菜单
closeMenu(e){
if(mst)clearTimeout(mst);
jQuery(e.target).find("blockquote").slideUp('fast');
}
},
}
</script>
<style lang="less" scoped>
#MutiNav .multiUl .multiUlli a.mulgo{
line-height: 50px;
}
</style>