菜单图标

admin/src/views/permission/menu/edit.vue

@@ -70,7 +70,7 @@
                                     </template>
                                 </el-input> -->
 
-                                <select-icon></select-icon>
+                                <select-icon :icon="formData.menuIcon"></select-icon>
                             </div>
                         </el-form-item>
                     </div>
@@ -228,7 +228,6 @@ const getMenuDetail = async (id: number) => {
 const getFatherMenu = async () => {
     const menus = (await apiConfigGetMenu()) || []
     menuList.value = [{ id: 0, menuName: '顶级' }, ...menus]
-    console.log(menuList.value, '---------------menuaList.value')
 }
 
 // 添加菜单

admin/src/views/permission/menu/select-icon/index.vue

@@ -2,7 +2,7 @@
     <div class="select-icon">
         <div class="flex">
             <div class="show-icon">
-                <i class="iconfont"></i>
+                <i class="iconfont" :class="iconItemValue"></i>
             </div>
 
             <el-popover placement="bottom" :width="400" trigger="click">
@@ -117,9 +117,33 @@ const selectIcon = ref<any>([
     'icon_gongyingshang'
 ])
 
+const iconItemValue = ref<any>([])
+
 const selectIconItem = (item: string) => {
-    console.log(item, 'item')
+    console.log(item, 'item____')
+    iconItemValue.value = item
 }
+
+const emit = defineEmits(['update:icon'])
+
+const props = withDefaults(
+    defineProps<{
+        icon: any
+    }>(),
+    {
+        icon: ''
+    }
+)
+
+const iconValue = computed({
+    get: () => {
+        return [props.icon]
+    },
+    set: (value: any) => {
+        emit('update:icon', selectIconItem)
+        console.log(selectIconItem, 'selectIconItem______')
+    }
+})
 </script>
 
 <style lang="scss" scoped>
@@ -128,6 +152,12 @@ const selectIconItem = (item: string) => {
     height: 32px;
     border: 1px solid #dcdfe6;
     border-radius: 3px;
+    display: flex;
+    justify-content: center;
+
+    .iconfont {
+        font-size: 30px;
+    }
 }
 .select-icon-item {
     display: flex;