From 6ce4437911a36718e08b42caf28e67f69dbc3927 Mon Sep 17 00:00:00 2001
From: jmal <zhushilun084@gmail.com>
Date: Wed, 13 Jan 2021 23:36:54 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=EF=BC=9A=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/select/icon.vue        |  8 +++-----
 src/components/select/iconList.vue    |  2 +-
 src/components/table/TableList.vue    |  3 +++
 src/styles/index.scss                 | 13 ++++++++++++-
 src/views/setting/sys/menuManager.vue |  2 ++
 5 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/components/select/icon.vue b/src/components/select/icon.vue
index 944c729..01834a1 100644
--- a/src/components/select/icon.vue
+++ b/src/components/select/icon.vue
@@ -10,13 +10,10 @@
   >
     <el-tabs v-model="activeName" @tab-click="handleTabClick">
       <el-tab-pane label="本地" name="first" >
-        <icon-list :icon-list="iconList" :select="select"></icon-list>
+        <icon-list ref="local" :icon-list="iconList" @select="select"></icon-list>
       </el-tab-pane>
       <el-tab-pane label="iconfont" name="second">
-        <icon-list :icon-list="iconfontList" :select="select"></icon-list>
-      </el-tab-pane>
-      <el-tab-pane label="其他" name="third">
-
+        <icon-list ref="iconfont" :icon-list="iconfontList" @select="select"></icon-list>
       </el-tab-pane>
     </el-tabs>
     <div slot="reference" :class="{'al-icon-picker': true, 'al-icon-picker-open': pickerOpen}"
@@ -86,6 +83,7 @@ export default {
       this.pickerOpen = false
     },
     select(icon){
+      console.log('6789')
       this.currentValue = icon
       this.$emit('input', icon)
       this.$refs.popover.doClose()
diff --git a/src/components/select/iconList.vue b/src/components/select/iconList.vue
index 41f026a..87c34fb 100644
--- a/src/components/select/iconList.vue
+++ b/src/components/select/iconList.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-scrollbar style="height: 280px">
+  <el-scrollbar style="height: 280px;">
     <el-row>
       <el-col :span="4" v-for="(item, index) in iconList" :key="index">
         <el-card shadow="hover" class="al-card-border" :title="item">
diff --git a/src/components/table/TableList.vue b/src/components/table/TableList.vue
index c7d46dd..46bc05b 100644
--- a/src/components/table/TableList.vue
+++ b/src/components/table/TableList.vue
@@ -51,6 +51,9 @@
               <div v-if="item.tag">
                 <el-tag size="mini" v-for="tagname in item.formatData(scope.row[item.prop])" :key="tagname">{{tagname}}</el-tag>
               </div>
+              <div v-else-if="item.icon">
+                <svg-icon :icon-class="item.formatData(scope.row[item.prop])"></svg-icon>
+              </div>
               <div v-else>
                 <span else>{{ item.formatData(scope.row[item.prop]) || scope.row[item.prop]}}</span>
               </div>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index c3c8b80..a4d9a00 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -15,7 +15,7 @@ body {
 
 /deep/::-webkit-scrollbar {
   /*滚动条整体样式*/
-  width: 12px;
+  width: 10px;
   height: 10px;
 }
 /deep/::-webkit-scrollbar-thumb {
@@ -148,3 +148,14 @@ div:focus {
 .al-card-border {
   border: 1px solid #ededed;
 }
+.al-select {
+  .el-scrollbar__wrap {
+    &::-webkit-scrollbar {
+      width: 0;
+      height: 0;
+    }
+  }
+  .el-scrollbar__bar.is-vertical{
+    width: 6px!important;
+  }
+}
diff --git a/src/views/setting/sys/menuManager.vue b/src/views/setting/sys/menuManager.vue
index 2c6a5e0..febabfa 100644
--- a/src/views/setting/sys/menuManager.vue
+++ b/src/views/setting/sys/menuManager.vue
@@ -33,6 +33,7 @@
           <el-col :sm="12">
             <el-form-item label="权限标识:" prop="authority">
               <el-select
+                class="al-select"
                 v-model="form.authority"
                 placeholder="请选择权限标识"
                 clearable
@@ -157,6 +158,7 @@ export default {
         },
         tableHeader: [
           {prop: 'name', label: '菜单名称', noScope: true, align: 'left'},
+          {prop: 'icon', label: '图标', icon: true, formatData: (icon)=> {return icon}, width: 50},
           {prop: 'path', label: '路由地址'},
           {prop: 'component', label: '组件路径'},
           {prop: 'authority', label: '权限标识'},