feat: 条码查询页面

src/components/layout/header/HeaderDropdown.vue

@@ -65,12 +65,12 @@ export default {
       return (<div class="gs-dropdown-rect">
         <div class="rect-title"
              vOn:click_stop_prevent={() => {
-               this.$emit('itemClick', {...nav})
+               this.$emit('itemClick', {...nav, root: {...this.nav}})
              }}
         >
           <span class="pointer">{nav.nameInHeaderNav ? nav.nameInHeaderNav : nav.name}</span>
         </div>
-        <div className="rect-body">
+        <div class="rect-body">
           {children}
         </div>
       </div>)
@@ -83,7 +83,7 @@ export default {
         {items.map(item => {
           return (<div class="gs-dropdown-item">
             <span vOn:click_stop_prevent={() => {
-              this.$emit('itemClick', {...item})
+              this.$emit('itemClick', {...item, root: {...this.nav}})
             }}
                   class="pointer gs-hover"
             >{item.name}
@@ -150,7 +150,6 @@ export default {
 
   .rect-body {
     display: flex;
-    flex-direction: column;
   }
 }
 

src/components/layout/header/index.vue

@@ -28,7 +28,7 @@
                    aria-expanded="false">{{ nav.name }}</a>
 
                 <!-- Dropdown Menu -->
-                <HeaderDropdown :nav="nav" @itemClick="handleItemClick"/>
+                <HeaderDropdown v-if="nav.children.length>0" :nav="nav" @itemClick="handleItemClick"/>
                 <!-- End Dropdown Menu -->
               </li>
               <!-- Nav items End-->
@@ -62,19 +62,29 @@ export default {
   },
   methods: {
     handleNavClick(nav) {
+      if (!!nav.children || nav.children.length === 0){
         this.currentNav = nav.id;
+      }
     },
-    handleItemClick(item){
+    handleItemClick(item) {
       console.log(item);
+      if (item.link.startsWith('http')) {
+        window.open(item.link);
+      } else {
+        this.currentNav = item.root.id;
+        item.breadcrumb && this.$store.commit('system/SET_BREADCRUMB', item.breadcrumb)
+        this.$router.push({path: item.link})
+      }
     },
   },
 };
 </script>
 
 <style lang="scss">
-.navbar{
+.navbar {
   background: #fff;
-  }
+}
+
 .gs-header-nav {
 
   .navbar-nav-wrap {
@@ -106,7 +116,6 @@ export default {
   }
 
 
-
   .navbar-toggler {
     padding: .5rem .5rem
   }

src/components/layout/header/mock.js

@@ -23,32 +23,57 @@ export const nav = [
         id: '3',
         name: '条码查询',
         index: 3,
-        link: '/code',
+        link: '/search',
+        breadcrumb: [
+            {name: '服务中心', path: '/service'},
+            {name: '查询服务', path: '/search'},
+            {name: '条码信息查询'},
+        ],
         children: [
             {
                 id: uuid('gs_nav'),
                 name: '条码信息查询',
                 nameInHeaderNav: '条码查询',
                 index: 0,
-                link: '/tool',
+                link: '/search',
+                breadcrumb: [
+                    {name: '服务中心', path: '/service'},
+                    {name: '查询服务', path: '/search'},
+                    {name: '条码信息查询'},
+                ],
                 children: [
                     {
                         id: uuid('gs_nav'),
-                        name: '国内条码信息查询',
+                        name: '境内条码信息查询',
                         index: 0,
-                        link: '/tool/internal',
+                        link: '/search/internal',
+                        breadcrumb: [
+                            {name: '服务中心', path: '/service'},
+                            {name: '查询服务', path: '/search'},
+                            {name: '境内条码信息查询'},
+                        ],
                     },
                     {
                         id: uuid('gs_nav'),
-                        name: '国外条码信息查询',
+                        name: '境外条码信息查询',
                         index: 1,
-                        link: '/tool/external',
+                        link: '/search/external',
+                        breadcrumb: [
+                            {name: '服务中心', path: '/service'},
+                            {name: '查询服务', path: '/search'},
+                            {name: '境外条码信息查询'},
+                        ],
                     },
                     {
                         id: uuid('gs_nav'),
                         name: '缩短码查询',
                         index: 2,
-                        link: '/tool/shortcode',
+                        link: '/search/shortcode',
+                        breadcrumb: [
+                            {name: '服务中心', path: '/service'},
+                            {name: '查询服务', path: '/search'},
+                            {name: '缩短码查询'},
+                        ],
                     },
                     {
                         id: uuid('gs_nav'),
@@ -62,33 +87,32 @@ export const nav = [
                 id: uuid('gs_nav'),
                 name: 'GLN查询',
                 index: 1,
-                link: '/tool/gln',
+                link: '/search/gln',
             },
             {
                 id: uuid('gs_nav'),
                 name: '自行车企业代码公告查询',
                 index: 2,
-                link: '/tool/bike',
+                link: '/search/bike',
             },
             {
                 id: uuid('gs_nav'),
                 name: '条码术语查询',
                 index: 3,
-                link: '/tool/glossary',
+                link: '/search/glossary',
             },
             {
                 id: uuid('gs_nav'),
                 name: '校验码计算工具',
                 index: 4,
-                link: '/tool/check',
+                link: '/search/check',
             },
             {
                 id: uuid('gs_nav'),
                 name: '国家及地区前缀码查询',
                 index: 5,
-                link: '/tool/country',
+                link: '/search/country',
             },
-
         ]
     }, {
         id: '4',

src/router/index.js

@@ -82,6 +82,21 @@ const routes = [
         ]
     },
     {
+        // 查询中心
+        path: "/search",
+        name: "search",
+        component: main,
+        meta: {
+            name: "首页"
+        },
+        children: [
+            {
+                path: "/",
+                component: () => import("@/views/Search/index")
+            },
+        ]
+    },
+    {
         path: "/login",
         name: "login",
         component: () => import("@/views/User/index"),

src/views/Business/index.vue

 <template>
   <div class="org container">
-    <breadcrumb :value="bread"/>
+    <breadcrumb/>
     <div class="row">
       <div class="col-lg-3">
         <left2/>

src/views/Search/index.vue

 <template>
   <div class="container">
-    <breadcrumb :value="bread"/>
+    <breadcrumb/>
     <div class="row">
       <div class="col-lg-3">
         <left2/>
@@ -9,13 +9,22 @@
         <router-view class="marginTopLg20"></router-view>
       </div>
     </div>
-    <div class="marginTop20">
-      <zxcxgj/>
-    </div>
   </div>
 </template>
 
 <script>
+import left2 from '../comps/left2.vue'
+import breadcrumb from '../comps/breadcrumb.vue'
+export default {
+  components:{
+    left2,
+    breadcrumb,
+  },
+  data() {
+    return {
+    }
+  },
+}
 </script>
 
 <style lang="scss">