|
|
@@ -0,0 +1,215 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view class="nav">
|
|
|
+ <view class="navCont">
|
|
|
+ <view class="logo">
|
|
|
+ <!-- <image src="../../static/pcimg/111.png" mode="" class="logoImg euroreparIMg"></image> -->
|
|
|
+ <!-- <image :src="info.logo" mode="" class="logoImg euroreparIMg"></image> --><!-- euroreparIMg -->
|
|
|
+ </view>
|
|
|
+ <view class="navTitle">{{info.title}}</view>
|
|
|
+ <view class="indexNav" :class="{'indexActive':data=='index'}" @click="goIndex">首页</view>
|
|
|
+ <view class="allCategory">
|
|
|
+ <view class="allCategoryLine" :class="{'indexActive':itemName==item.name}" v-for="(item,index) in allCategory" v-if="index<7" @click="goItem(item)">{{item.name}}</view>
|
|
|
+ <view class="allCategoryMore" v-if="allCategory.length>7">
|
|
|
+ <span @click="moreBtn" class="moreBtn">更多</span>
|
|
|
+ <image @click="moreBtn" src="../../static/pcimg/icon_arrow_xia@2x.png" mode="widthFix" class="navmoreImg"></image>
|
|
|
+ <image src="../../static/pcimg/mores.png" mode="widthFix" class="navmoreImg2"></image>
|
|
|
+ <view class="navMoret" >
|
|
|
+ <view class="navMoreTline" v-for="(item,index) in allCategory" v-if="index>4" @click="goItem(item)">{{item.name}}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="navSs" @click="gosearchlist">
|
|
|
+ <image src="../../static/pcimg/icon_search@2x.png" mode="widthFix" class="navSsimg"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ name: "searchBox",
|
|
|
+ props: ['data','itemName'],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ allCategory:[],
|
|
|
+ navMoret:false,
|
|
|
+ info:'',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+
|
|
|
+ },
|
|
|
+ created(){
|
|
|
+ this.getallCategory();
|
|
|
+ this.getInfo()
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ gosearchlist(){
|
|
|
+ /* uni.navigateTo({
|
|
|
+ url:'../../pages/pc/searchlist'
|
|
|
+ }) */
|
|
|
+ this.$emit("gosearchlist",1);
|
|
|
+ },
|
|
|
+ goItem(item){
|
|
|
+ /* var pages = getCurrentPages() ;
|
|
|
+ var currentRoute = pages[pages.length-1].route;
|
|
|
+ console.log(currentRoute)
|
|
|
+ console.log(item) */
|
|
|
+ /* if(currentRoute=='pages/pc/list'){
|
|
|
+ this.$emit("getChildList",item);
|
|
|
+ }else{
|
|
|
+ uni.navigateTo({
|
|
|
+ url:'list?code='+item.code+'&topName='+item.name+'&comment='+item.comment
|
|
|
+ })
|
|
|
+ } */
|
|
|
+ this.$emit("getChildList",item);
|
|
|
+ uni.pageScrollTo({
|
|
|
+ scrollTop: 0, duration: 100
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getInfo(){
|
|
|
+ this.$http('/trainingOpenApi/getInfo', {}, 'GET').then(res => {
|
|
|
+ this.info = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ goIndex(){
|
|
|
+ /* uni.navigateTo({
|
|
|
+ url:'../../pages/pc/index'
|
|
|
+ }) */
|
|
|
+ this.$emit("getIndexList",1);
|
|
|
+ },
|
|
|
+ getallCategory(){
|
|
|
+ this.$http('/trainingOpenApiV3/allCategory', {}, 'GET').then(res => {
|
|
|
+ this.allCategory = res.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ moreBtn(){
|
|
|
+ this.navMoret=!this.navMoret
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .nav{
|
|
|
+ width: 100%;
|
|
|
+ height: 72px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0px 4px 10px 0px rgba(153, 153, 153, 0.12);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 11;
|
|
|
+ }
|
|
|
+ .navCont{
|
|
|
+ width: 1200px;
|
|
|
+ display: flex;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .logoImg{
|
|
|
+ width: 62px;
|
|
|
+ height: 28px;
|
|
|
+ margin-top: 19px;
|
|
|
+ }
|
|
|
+ .navTitle{
|
|
|
+ line-height: 72px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #3C3C3C;
|
|
|
+ font-size: 20px;
|
|
|
+ padding-left: 10px;
|
|
|
+ font-family: PingFangSC-Medium, PingFang SC;
|
|
|
+ }
|
|
|
+ .indexNav{
|
|
|
+ line-height: 72px;
|
|
|
+
|
|
|
+ color: #3C3C3C;
|
|
|
+ font-size: 16px;
|
|
|
+ padding-left: 54px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .indexActive{
|
|
|
+ color: #FF4F00 !important;
|
|
|
+ }
|
|
|
+ .allCategory{
|
|
|
+ display: flex;
|
|
|
+ line-height: 72px;
|
|
|
+ }
|
|
|
+ .allCategoryLine{
|
|
|
+ padding-left: 30px;
|
|
|
+ color: #3C3C3C;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .allCategoryMore{
|
|
|
+ padding-left: 30px;
|
|
|
+ color: #3C3C3C;
|
|
|
+ font-size: 16px;
|
|
|
+ display: flex;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .navMoret{
|
|
|
+ position: absolute;
|
|
|
+ width: 140px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ box-shadow: 0px 4px 10px 0px rgba(153, 153, 153, 0.12);
|
|
|
+ border-radius: 6px;
|
|
|
+ top: 72px;
|
|
|
+ left:0px ;
|
|
|
+ font-size: 16px;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .allCategoryMore:hover .navMoret{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .navMoreTline{
|
|
|
+ width: 140px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 50px;
|
|
|
+ }
|
|
|
+ .allCategoryMore:hover .moreBtn{
|
|
|
+ color: #FF4F00;
|
|
|
+ }
|
|
|
+ .navmoreImg{
|
|
|
+ width: 12px;
|
|
|
+ height: 8px;
|
|
|
+ margin-top: 32px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ .navmoreImg2{
|
|
|
+ width: 12px;
|
|
|
+ height: 8px;
|
|
|
+ margin-top: 32px;
|
|
|
+ margin-left: 10px;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .allCategoryMore:hover .navmoreImg{
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .allCategoryMore:hover .navmoreImg2{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .navSsimg{
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ }
|
|
|
+ .navSs{
|
|
|
+ position: absolute;
|
|
|
+ cursor: pointer;
|
|
|
+ top:24px;
|
|
|
+ right: 0;
|
|
|
+ }
|
|
|
+ .euroreparIMg{
|
|
|
+ width: 132px;
|
|
|
+ height: 29px;
|
|
|
+ margin-top: 21px;
|
|
|
+ }
|
|
|
+</style>
|
