搜索菜单

src/assets/scss/_base.scss

@@ -284,7 +284,7 @@ img {
   &__inner {
     position: relative;
     z-index: 1;
-    width: 230px;    // 放出侧边滚动条
+    width: 250px;   // 放出侧边滚动条
     height: 100%;
     padding-bottom: 15px;
     overflow-y: scroll;

src/utils/httpRequest.js

@@ -113,6 +113,7 @@ instance.interceptors.response.use(response => {
 
 
 
+
 export const createAPI = (url, method, data) => {
   let config = {}
   if (method === 'get') {

src/views/main-navbar.vue

@@ -25,6 +25,8 @@
       <el-menu
         class="site-navbar__menu site-navbar__menu--right"
         mode="horizontal">
+
+
         <el-submenu index="2">
           <template slot="title">设置</template>
           <el-submenu index="2-1" >
@@ -98,6 +100,7 @@
     <!-- 弹窗, 修改密码 -->
     <update-password v-if="updatePassowrdVisible" ref="updatePassowrd"></update-password>
     <update-language v-if="updateLanguageVisible" ref="updateLanguage"></update-language>
+
   </nav>
 </template>
 

src/views/main-sidebar.vue

@@ -6,24 +6,29 @@
         :collapse="sidebarFold"
         :collapseTransition="false"
         class="site-sidebar__menu">
+        <el-menu-item style=" padding-left: 15px;" class="menu">
+          <span slot="title"> <el-input v-model="search" placeholder="搜索"
+                                        @keyup.enter.native="searchMenu"></el-input></span>
+          <i type="primary" class="el-icon-search" @click="searchMenu()"></i>
+        </el-menu-item>
         <el-menu-item index="home" @click="$router.push({ name: 'home' })">
           <icon-svg name="shouye" class="site-sidebar__menu-icon"></icon-svg>
-          <span slot="title">{{$t('commonhomePage')}}</span>
+          <span slot="title">{{ $t('commonhomePage') }}</span>
         </el-menu-item>
-<!--        <el-submenu index="demo">-->
-<!--          <template slot="title">-->
-<!--            <icon-svg name="shoucang" class="site-sidebar__menu-icon"></icon-svg>-->
-<!--            <span>demo</span>-->
-<!--          </template>-->
-<!--          <el-menu-item index="demo-echarts" @click="$router.push({ name: 'demo-echarts' })">-->
-<!--            <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>-->
-<!--            <span slot="title">echarts</span>-->
-<!--          </el-menu-item>-->
-<!--          <el-menu-item index="demo-ueditor" @click="$router.push({ name: 'demo-ueditor' })">-->
-<!--            <icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg>-->
-<!--            <span slot="title">ueditor</span>-->
-<!--          </el-menu-item>-->
-<!--        </el-submenu>-->
+        <!--        <el-submenu index="demo">-->
+        <!--          <template slot="title">-->
+        <!--            <icon-svg name="shoucang" class="site-sidebar__menu-icon"></icon-svg>-->
+        <!--            <span>demo</span>-->
+        <!--          </template>-->
+        <!--          <el-menu-item index="demo-echarts" @click="$router.push({ name: 'demo-echarts' })">-->
+        <!--            <icon-svg name="tubiao" class="site-sidebar__menu-icon"></icon-svg>-->
+        <!--            <span slot="title">echarts</span>-->
+        <!--          </el-menu-item>-->
+        <!--          <el-menu-item index="demo-ueditor" @click="$router.push({ name: 'demo-ueditor' })">-->
+        <!--            <icon-svg name="editor" class="site-sidebar__menu-icon"></icon-svg>-->
+        <!--            <span slot="title">ueditor</span>-->
+        <!--          </el-menu-item>-->
+        <!--        </el-submenu>-->
         <sub-menu
           v-for="menu in menuList"
           :key="menu.menuId"
@@ -36,77 +41,167 @@
 </template>
 
 <script>
-  import SubMenu from './main-sidebar-sub-menu'
-  import { isURL } from '@/utils/validate'
-  export default {
-    data () {
-      return {
-        dynamicMenuRoutes: []
+import SubMenu from './main-sidebar-sub-menu'
+import {isURL} from '@/utils/validate'
+
+export default {
+  data() {
+    return {
+      dynamicMenuRoutes: [],
+      search: '',
+      categoryList: []
+    }
+  },
+  components: {
+    SubMenu
+  },
+  computed: {
+    sidebarLayoutSkin: {
+      get() {
+        return this.$store.state.common.sidebarLayoutSkin
       }
     },
-    components: {
-      SubMenu
+    sidebarFold: {
+      get() {
+        return this.$store.state.common.sidebarFold
+      }
     },
-    computed: {
-      sidebarLayoutSkin: {
-        get () { return this.$store.state.common.sidebarLayoutSkin }
-      },
-      sidebarFold: {
-        get () { return this.$store.state.common.sidebarFold }
+    menuList:
+      {
+        get() {
+          return this.$store.state.common.menuList
+        },
+        set(val) {
+          this.$store.commit('common/updateMenuList', val)
+        }
       },
-      menuList: {
-        get () { return this.$store.state.common.menuList },
-        set (val) { this.$store.commit('common/updateMenuList', val) }
+    menuActiveName: {
+      get() {
+        return this.$store.state.common.menuActiveName
       },
-      menuActiveName: {
-        get () { return this.$store.state.common.menuActiveName },
-        set (val) { this.$store.commit('common/updateMenuActiveName', val) }
+      set(val) {
+        this.$store.commit('common/updateMenuActiveName', val)
+      }
+    },
+    mainTabs: {
+      get() {
+        return this.$store.state.common.mainTabs
       },
-      mainTabs: {
-        get () { return this.$store.state.common.mainTabs },
-        set (val) { this.$store.commit('common/updateMainTabs', val) }
+      set(val) {
+        this.$store.commit('common/updateMainTabs', val)
+      }
+    },
+    mainTabsActiveName: {
+      get() {
+        return this.$store.state.common.mainTabsActiveName
       },
-      mainTabsActiveName: {
-        get () { return this.$store.state.common.mainTabsActiveName },
-        set (val) { this.$store.commit('common/updateMainTabsActiveName', val) }
+      set(val) {
+        this.$store.commit('common/updateMainTabsActiveName', val)
+      }
+    }
+  },
+  watch: {
+    $route: 'routeHandle'
+  },
+  created() {
+    this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
+    this.dynamicMenuRoutes = JSON.parse(sessionStorage.getItem('dynamicMenuRoutes') || '[]')
+    this.routeHandle(this.$route)
+  },
+  methods: {
+    // 搜索菜单方式1 start
+    searchMenu1() {
+
+      if (this.search == "") {
+        this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
+      } else {
+        this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
+        // this.menuList = this.treeFindPath(this.menuList).filter(this.search)
+        let list = this.treeFindPath(this.menuList)
+        list = this.distinct(list, list);
+        this.menuList = list.filter(item => item.name.indexOf(this.search) != -1)
       }
     },
-    watch: {
-      $route: 'routeHandle'
+    // 树结构菜单转换list
+    treeFindPath(tree, path = []) {
+      if (!tree) return []
+      for (const data of tree) {
+        path.push(data)
+        if (data.list != null) {
+          path.push(...data.list)
+          delete data.list
+        }
+        this.treeFindPath(data.list, path)
+      }
+
+      return path
     },
-    created () {
-      this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
-      this.dynamicMenuRoutes = JSON.parse(sessionStorage.getItem('dynamicMenuRoutes') || '[]')
-      this.routeHandle(this.$route)
+    // 搜索菜单方式1 去重 end
+    distinct(a, b) {
+      return Array.from(new Set([...a, ...b]))
     },
-    methods: {
-      // 路由操作
-      routeHandle (route) {
-        if (route.meta.isTab) {
-          // tab选中, 不存在先添加
-          var tab = this.mainTabs.filter(item => item.name === route.name)[0]
-          if (!tab) {
-            if (route.meta.isDynamic) {
-              route = this.dynamicMenuRoutes.filter(item => item.name === route.name)[0]
-              if (!route) {
-                return console.error('未能找到可用标签页!')
-              }
-            }
-            tab = {
-              menuId: route.meta.menuId || route.name,
-              name: route.name,
-              title: route.meta.title,
-              type: isURL(route.meta.iframeUrl) ? 'iframe' : 'module',
-              iframeUrl: route.meta.iframeUrl || '',
-              params: route.params,
-              query: route.query
+    // 搜索菜单方式2 start
+    searchMenu() {
+      if (this.search == "") {
+        this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
+      } else {
+        this.menuList = JSON.parse(sessionStorage.getItem('menuList') || '[]')
+        this.menuList = this.filterTree(this.menuList,this.search)
+        console.log(this.menuList)
+      }
+    },
+    filterTree (tree = [], map , arr = []) {
+      if (!tree.length)
+        return []
+      for (let item of tree) {
+        if (map.indexOf(item.name)>-1){
+
+        }
+        continue
+        let node = {...item, list: []}
+        arr.push(node)
+        if (item.list && item.list.length)
+          this.filterTree(item.list, map, node.list) }
+      return arr
+    },
+    // 路由操作
+    routeHandle(route) {
+      if (route.meta.isTab) {
+        // tab选中, 不存在先添加
+        var tab = this.mainTabs.filter(item => item.name === route.name)[0]
+        if (!tab) {
+          if (route.meta.isDynamic) {
+            route = this.dynamicMenuRoutes.filter(item => item.name === route.name)[0]
+            if (!route) {
+              return console.error('未能找到可用标签页!')
             }
-            this.mainTabs = this.mainTabs.concat(tab)
           }
-          this.menuActiveName = tab.menuId + ''
-          this.mainTabsActiveName = tab.name
+          tab = {
+            menuId: route.meta.menuId || route.name,
+            name: route.name,
+            title: route.meta.title,
+            type: isURL(route.meta.iframeUrl) ? 'iframe' : 'module',
+            iframeUrl: route.meta.iframeUrl || '',
+            params: route.params,
+            query: route.query
+          }
+          this.mainTabs = this.mainTabs.concat(tab)
         }
+        this.menuActiveName = tab.menuId + ''
+        this.mainTabsActiveName = tab.name
       }
     }
   }
+}
 </script>
+<style>
+.menu .el-input__inner {
+  background: transparent;
+  width: 100px;
+  font-size: 12px;
+  color: #FFFFFF;
+  border: #0BB2D4;
+}
+
+
+</style>

src/views/modules/knifemold/receive.vue

@@ -10,10 +10,10 @@
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button @click="getDataList()" type="primary">{{buttons.search}}</el-button>
-        <el-button @click="saveColumnList()" type="primary" v-show="showDefault">{{buttons.defaultTable}}
+        <el-button @click="getDataList()" type="primary">{{ buttons.search }}</el-button>
+        <el-button @click="saveColumnList()" type="primary" v-show="showDefault">{{ buttons.defaultTable }}
         </el-button>
-        <el-button @click="userSetting" type="primary">{{ buttons.settingTable}}</el-button>
+        <el-button @click="userSetting" type="primary">{{ buttons.settingTable }}</el-button>
         <download-excel
           :fields="exportDataStandard"
           :data="exportData"
@@ -27,12 +27,14 @@
           :before-finish="finishDownload"
           worksheet="导出信息"
           class="el-button el-button--primary el-button--medium">
-          {{buttons.download}}
+          {{ buttons.download }}
         </download-excel>
 
         <el-button v-if="isAuth(':prd:delete')" type="danger" @click="deleteHandle()"
-                   :disabled="dataListSelections.length <= 0">{{ buttons.deleteList}}
+                   :disabled="dataListSelections.length <= 0">{{ buttons.deleteList }}
         </el-button>
+
+
       </el-form-item>
 
       <el-form-item>
@@ -42,9 +44,12 @@
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" @click="addLanguageFun()">{{buttons.add}}
+        <el-button type="primary" @click="addLanguageFun()">{{ buttons.add }}
         </el-button>
       </el-form-item>
+      <el-form-item>
+        <el-button  @click="favorites()" type="primary">收藏</el-button>
+      </el-form-item>
     </el-form>
     <el-table
 
@@ -70,7 +75,7 @@
         :width="item.columnWidth"
         :label="item.columnLabel">
         <template slot-scope="scope">
-          <span v-if="!item.columnHidden"> {{scope.row[item.columnProp]}}</span>
+          <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
           <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
                                              style="width: 100px; height: 80px"/></span>
         </template>
@@ -191,7 +196,7 @@
           :width="item.columnWidth"
           :label="item.columnLabel">
           <template slot-scope="scope">
-            <span v-if="item.columnProp!='languageValue'"> {{scope.row[item.columnProp]}}</span>
+            <span v-if="item.columnProp!='languageValue'"> {{ scope.row[item.columnProp] }}</span>
             <span v-if="item.columnProp=='languageValue'"><input
               class="sl-input"
               v-model="scope.row[item.columnProp]" type="text"
@@ -542,6 +547,10 @@ export default {
     this.getLanguageList()
   },
   methods: {
+    // 收藏
+    favorites() {
+
+    },
     // 保存语言编辑
     saveLanguageList(val) {
       saveSysLanguageOne(val).then(({data}) => {
@@ -627,6 +636,7 @@ export default {
     },
     // 修改 table 列
     updateColumnList() {
+
       let userColumns = []
       for (let column of this.userColumnList) {
         let userColumn = {
@@ -769,7 +779,7 @@ export default {
     createExportData() {
       // 点击导出按钮之后,开始导出数据之前的执行函数,返回值为需要下载的数据
       // TODO:构造需要下载的数据返回
-      if(this.dataListSelections.length>0){
+      if (this.dataListSelections.length > 0) {
         return this.dataListSelections;
       }
       return this.dataList;

src/views/modules/sys/language/common.vue

@@ -4,10 +4,8 @@
 
       <el-form-item>
 
-        <el-select filterable v-model="querySysLanguagePack.objectType" clearable>
-          <el-option label="列表" value="table"></el-option>
-          <el-option label="按钮" value="button"></el-option>
-        </el-select>
+        <el-input filterable v-model="querySysLanguagePack.functionId" clearable>
+        </el-input>
       </el-form-item>
       <el-form-item>
         <el-button @click="getDataList()" type="primary">{{buttons.search}}</el-button>
@@ -214,7 +212,7 @@
   </div>
 </template>
 
-<script>  
+<script>
 
   import {
     searchSysLanguagePackList,
@@ -584,7 +582,7 @@
       getFunctionButtonList() {
         searchFunctionButtonList(this.queryButton).then(({data}) => {
           console.log(data.data)
-          if (data.data) {
+          if (data.data.length > 0) {
             this.buttons = data.data
           } else {
             saveButtonList(this.buttonList).then(({data}) => {