基础组件页优化，我的代办和通知公告修改。

src/assets/scss/smp.scss

@@ -1831,7 +1831,7 @@ html,body{
   background-color: $smp--color-white;
   @include normal-shadow();
   &.onLight{
-    box-shadow: 0 0 5px rgba(255,0,0,0.5) ;
+    box-shadow: 0 0 5px rgba(255,0,0,1) ;
   }
   .co-hd{
     position:relative;
@@ -1898,7 +1898,7 @@ html,body{
     padding:0;
   }
   .csm-item{
-    background-color: #f6f6f6;
+    background-color: #f2f2f2;
     // background-color: #ff0;
     @include smp-radius-normal();
     height:68px;
@@ -1906,6 +1906,9 @@ html,body{
     align-items: center;
     cursor: pointer;
     position:relative;
+    &.onLight{
+      box-shadow: 0 0 5px rgba(255,0,0,1) ;
+    }
     a{
       text-decoration: none;
       padding:0 0 0 15px;

src/utils/tool.js

@@ -22,7 +22,25 @@ function construct (nodes, config) {
   })
   return jsonTree
 }
+function getQueryVariable (url, variable) {
+  let query = url.split('?')
+  let queryArr = []
+  let value = ''
+  if (query[1]) {
+    queryArr = query[1].split('&')
+    queryArr.forEach((e) => {
+      let pair = e.split('=')
+      if (pair[0] === variable) {
+        value = pair[1]
+      }
+    })
+    return value || false
+  } else {
+    return false
+  }
+}
 let tool = {
-  construct
+  construct,
+  getQueryVariable
 }
 export default tool

src/views/main/main-navbar-menu.vue

@@ -114,6 +114,12 @@ export default {
     // this.setIndexPage()
   },
   methods: {
+    gotoPageByUUID (UUID) {
+      let item = this.menuList.filter((e) => {
+        return e.UUID === UUID
+      })[0]
+      this.gotoPage(item)
+    },
     clickOutSide () {
       this.menuOpen = false
     },

src/views/main/main-navbar-news.vue

@@ -2,12 +2,12 @@
   <div class="navbar-news">
     <!-- 权限写法 -->
     <!-- <div class="nn-item" v-if="$hasPermission2('sys_test_add')" > -->
-    <div class="nn-item" @click="showTask">
+    <div class="nn-item" @click="showTask" title="我的代办">
       <i class="smp-nav-icon smp-ni-news shansuo">
       </i>
       <span>5</span>
     </div>
-    <div class="nn-item" @click="showNotice">
+    <div class="nn-item" @click="showNotice" title="通知公告">
       <i class="smp-nav-icon smp-ni-notice">
       </i>
       <span>7</span>
@@ -31,10 +31,14 @@ export default {
   methods: {
     showNews () {},
     showNotice () {
-      this.$parent.$parent.showNotice()
+      // this.$parent.$parent.showNotice()
+      this.$parent.$refs.navbarmenu.gotoPageByUUID('fe9b5adf20975c1bd13fd38cee3b09a68VfGsVRBgJ3')
+      this.$router.push({ path: '/868d8c7a976fef5061445869bfe1977bpttjDGgxV5Q' })
     },
     showTask () {
-      this.$parent.$parent.showTask()
+      // this.$parent.$parent.showTask()
+      this.$parent.$refs.navbarmenu.gotoPageByUUID('fe9b5adf20975c1bd13fd38cee3b09a68VfGsVRBgJ3')
+      this.$router.push({ path: '/7f66c3390e920c5a72a2252ce1dded62kj1sQpUXu8Q' })
     }
   }
 }

src/views/main/main-navbar.vue

@@ -6,7 +6,7 @@
       </h1>
     </div>
     <div class="navbar-bd">
-      <navbar-menu></navbar-menu>
+      <navbar-menu ref="navbarmenu"></navbar-menu>
       <navbar-news></navbar-news>
       <navbar-user></navbar-user>
     </div>

src/views/main/main-sidebar.vue

@@ -188,6 +188,10 @@ export default {
       this.currentMenuName = this.currentMenuItem.name
       this.initMenu()
       console.log(this.currentMenuList)
+    },
+    '$route.meta.UUID': function (val) {
+      // console.log(val)
+      this.activeIndex = val
     }
   },
   mounted () {
@@ -219,6 +223,7 @@ export default {
       console.log(this.slideMenu)
     },
     setActiveOne () {
+      console.log(this.$route.meta.UUID)
       this.activeIndex = this.$route.meta.UUID
     },
     addMenu (arr, lv) {

src/views/main/main.vue

@@ -118,9 +118,13 @@ export default {
     },
     // 路由, 监听
     routeHandle (route) {
-      !this.isNormalSidebar && this.gotoNormalSidebar()
       if (route.name === 'JCZJ') {
-        this.gotoWaterfallSidebar()
+        this.isNormalSidebar = true
+        this.$nextTick(() => {
+          this.gotoWaterfallSidebar()
+        })
+      } else {
+        !this.isNormalSidebar && this.gotoNormalSidebar()
       }
       // !this.isNormalSidebar && this.gotoNormalSidebar()
       if (!route.meta.isTab) {

src/views/modules/demo/basicComponent/basic-com.vue

@@ -30,6 +30,8 @@
 <script>
 // import cloneDeep from 'lodash/cloneDeep'
 import pubuliu from './pubuliu'
+import tool from '@/utils/tool.js'
+import Cookies from 'js-cookie'
 export default {
   components: {
     pubuliu
@@ -60,6 +62,7 @@ export default {
         this.isShowSeaClose = true
       } else {
         this.isShowSeaClose = false
+        this.clearLightClass()
       }
     }
   },
@@ -89,7 +92,7 @@ export default {
       if (this.isSidebar) {
         this.sidebarMenuItem = this.$store.state.sidebarMenuItem
         this.formatSidebarToList()
-        console.log(this.list)
+        // console.log(this.list)
       } else {
         this.getBasicComList()
       }
@@ -197,7 +200,7 @@ export default {
             pid: pid,
             lv: 1,
             icon: 'jczj-icon-' + icon[i],
-            url: 'https://www.baidu.com'
+            bcUrl: 'https://www.baidu.com'
           }
           arr.push(obj)
         })
@@ -245,16 +248,20 @@ export default {
       let iconArr = this.iconArr
       arr.forEach((e) => {
         if (!e.noMenu) {
-          let url = e.path ? ('/' + e.path) : ''
+          let bcUrl = ''
           if (!e.url && lv === 0) {
-            url = ''
+            bcUrl = ''
           }
+          if (e.url) {
+            bcUrl = this.getIframeUrl(e) || (e.path ? ('/' + e.path) : '')
+          }
+          // console.log(bcUrl, e)
           let obj = {
             ...e,
             lv: lv,
             id: e.UUID,
             pid: e.parentUUID,
-            url: url,
+            bcUrl: bcUrl,
             style: {},
             icon: iconArr[this.iconIndex++]
           }
@@ -269,42 +276,76 @@ export default {
       })
       return list
     },
+    getIframeUrl (item) {
+      let isNew = tool.getQueryVariable(item.url, 'new')
+      if (isNew === 'yes') {
+        return this.addParams(item.url)
+      } else {
+        return ''
+      }
+    },
+    addParams (url) {
+      let prevWord = '?'
+      if (url.indexOf(prevWord) > -1) {
+        prevWord = '&'
+      }
+      let _url = url + prevWord + 'sessionToken=' + Cookies.get('token') + '&menu=' + this.$route.name
+      return _url
+    },
     FindMenu (str, cb) {
       let itemArr = this.treeArr.filter((e) => {
         return e.name.indexOf(str) > -1
       })
-      console.log(itemArr)
       this.currentSearchItems = itemArr
+      console.log(itemArr)
       cb(itemArr)
     },
     clearSea () {
       // console.log(this.$refs.autocomplete)
+      // this.removeSearchBread()
       this.keyValue = ''
-      this.currentSearchItems.forEach((e) => {
-        let root = this.findParent(e)
-        window.$('#root' + root.id).removeClass('onLight')
-      })
+      // this.currentSearchItems.forEach((e) => {
+      //   let list = this.findParentChain(e)
+      //   window.$('#root' + list[0].id).removeClass('onLight')
+      //   list[1] && window.$('#lv1' + list[1].id).removeClass('onLight')
+      // })
       this.currentSearchItems = []
-      this.$refs.autocomplete.getData()
+      // this.$refs.autocomplete.getData()
+    },
+    clearLightClass () {
+      // this.currentSearchItems.forEach((e) => {
+      //   let list = this.findParentChain(e)
+      //   window.$('#root' + list[0].id).removeClass('onLight')
+      //   list[1] && window.$('#lv1' + list[1].id).removeClass('onLight')
+      // })
+      window.$('.com-one[id^="root"]').removeClass('onLight')
+      window.$('.csm-item[id^="lv1"]').removeClass('onLight')
     },
     searchItemsLight () {
+      this.clearLightClass()
       this.currentSearchItems.forEach((e) => {
-        let root = this.findParent(e)
-        window.$('#root' + root.id).addClass('onLight')
+        let list = this.findParentChain(e)
+        console.log(list)
+        window.$('#root' + list[0].id).addClass('onLight')
+        list[1] && window.$('#lv1' + list[1].id).addClass('onLight')
       })
     },
     setSearchBreadLight () {
       let root = this.searchBreadList[0]
-      let jqRoot = window.$('#root' + root.id)
-      jqRoot.addClass('onLight')
+      window.$('#root' + root.id).addClass('onLight')
+      this.searchBreadList[1] && window.$('#lv1' + this.searchBreadList[1].id).addClass('onLight')
     },
     removeSearchBreadLight () {
+      if (!this.searchBreadList.length) {
+        return
+      }
       let root = this.searchBreadList[0]
-      let jqRoot = window.$('#root' + root.id)
-      jqRoot.removeClass('onLight')
+      window.$('#root' + root.id).removeClass('onLight')
+      this.searchBreadList[1] && window.$('#lv1' + this.searchBreadList[1].id).removeClass('onLight')
     },
     gotoMenuTop (item) {
       let rootParent = this.findParent(item)
+      this.removeSearchBread()
       this.searchBreadList = this.findParentChain(item)
       this.setSearchBreadLight()
       // let rootItem = document.querySelector('#root' + rootParent.id)

src/views/modules/demo/basicComponent/com-menu.vue

@@ -1,5 +1,5 @@
 <template>
-  <comOne class="com-menu" :title="menuItem.name" :url="menuItem.url">
+  <comOne class="com-menu" :title="menuItem.name" :menuItem="menuItem">
     <div class="cm-subwraper" v-if="hasChild">
       <comSubmenu v-for="(item,index) in menuItem.children" :menuItem="item" :key="index"></comSubmenu>
     </div>

src/views/modules/demo/basicComponent/com-one.vue

@@ -2,7 +2,7 @@
   <div class="com-one" :class="{onSearchStatus:onSearchStatus}">
     <div class="co-hd">
       <i class="icon-title-bg"></i>
-      <a v-if="isUrl" class="title-box isurl" :href="getHref(url)" target="_blank">{{title}} >></a>
+      <a v-if="isUrl" class="title-box isurl" :href="getHref(menuItem)" target="_blank">{{title}} >></a>
       <span class="title-box" v-else>{{title}}</span>
     </div>
     <div class="co-bd">
@@ -11,10 +11,11 @@
   </div>
 </template>
 <script>
+import tool from '@/utils/tool.js'
 export default {
   props: {
     title: '',
-    url: '',
+    menuItem: '',
     onSearchStatus: ''
   },
   data () {
@@ -24,7 +25,7 @@ export default {
   },
   computed: {
     isUrl () {
-      if (this.url) {
+      if (this.menuItem.bcUrl) {
         return true
       } else {
         return false
@@ -38,14 +39,30 @@ export default {
 
   },
   methods: {
-    getHref (url) {
+    getHref (item) {
       // console.log(item.url, window.location)
       let host = window.location.host
       let href = window.location.href
-      if (url.indexOf('http') > -1) {
-        return url
+      // if (item.iframeUrl) {
+      //   let iframeUrl = this.getIframeUrl(item)
+      //   if (iframeUrl) {
+      //     return iframeUrl
+      //   }
+      // }
+      if (!item.bcUrl) {
+        return 'javascript:void(0);'
+      } else if (item.bcUrl.indexOf('http') > -1) {
+        return item.bcUrl
       } else if (href.indexOf(host + '/#') > -1) {
-        return '/#' + url
+        return '/#' + item.bcUrl
+      }
+    },
+    getIframeUrl (item) {
+      let isNew = tool.getQueryVariable(item.iframeUrl, 'new')
+      if (isNew === 'yes') {
+        return item.iframeUrl
+      } else {
+        return ''
       }
     }
   }

src/views/modules/demo/basicComponent/com-third-menu.vue

@@ -2,7 +2,7 @@
   <el-submenu v-if="menuItem.children && menuItem.children.length >= 1" :index="menuItem.id+'sub'" :popper-append-to-body="false" :class="{'csm-sub-lv2':menuItem.lv>=2}">
     <template slot="title">
       <template v-if="menuItem.lv===1" class="cs">
-        <div class="csm-item">
+        <div class="csm-item" :id="'lv1'+menuItem.id">
           <i class="csm-icon" :class="menuItem.icon"></i>
           <div class="csm-name" :title="menuItem.name">{{menuItem.name}}</div>
           <i class="el-icon-arrow-right"></i>
@@ -19,7 +19,7 @@
   </el-submenu>
   <el-menu-item v-else :index="menuItem.id+'sub'">
     <template v-if="menuItem.lv===1">
-      <div class="csm-item">
+      <div class="csm-item" :id="'lv1'+menuItem.id">
         <a class="menuItemA" :href="getHref(menuItem)" :target="getTarget(menuItem)">
           <i class="csm-icon" :class="menuItem.icon"></i>
           <div class="csm-name" :title="menuItem.name">{{menuItem.name}}</div>
@@ -39,6 +39,7 @@
 
 <script>
 import comThirdmenu from './com-third-menu'
+import tool from '@/utils/tool.js'
 export default {
   name: 'com-thirdmenu',
   data () {
@@ -63,16 +64,30 @@ export default {
       // console.log(item.url, window.location)
       let host = window.location.host
       let href = window.location.href
-      if (!item.url) {
+      // if (item.url) {
+      //   let url = this.getIframeUrl(item)
+      //   if (url) {
+      //     return url
+      //   }
+      // }
+      if (!item.bcUrl) {
         return 'javascript:void(0);'
-      } else if (item.url.indexOf('http') > -1) {
-        return item.url
+      } else if (item.bcUrl.indexOf('http') > -1) {
+        return item.bcUrl
       } else if (href.indexOf(host + '/#') > -1) {
-        return '/#' + item.url
+        return '/#' + item.bcUrl
+      }
+    },
+    getIframeUrl (item) {
+      let isNew = tool.getQueryVariable(item.url, 'new')
+      if (isNew === 'yes') {
+        return item.url
+      } else {
+        return ''
       }
     },
     getTarget (item) {
-      if (!item.url) {
+      if (!item.bcUrl) {
         return '_self'
       } else {
         return '_blank'
@@ -80,7 +95,7 @@ export default {
     },
     gotoRouteHandle (item) {
       console.log(item)
-      if (item.url) {
+      if (item.bcUrl) {
         // this.$router.push({ path: item.url })
         // window.open("http://www.jb51.net")
       }