update：更新图标组件

public/assets/img/others.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="30" height="30" viewBox="0 0 30 30">
+<g style="mix-blend-mode:passthrough">
+<g style="mix-blend-mode:passthrough">
+<g style="mix-blend-mode:passthrough">
+<g style="mix-blend-mode:passthrough">
+</g>
+<g style="mix-blend-mode:passthrough">
+<path d="M7.5,12.5C6.125,12.5,5,13.625,5,15C5,16.375,6.125,17.5,7.5,17.5C8.875,17.5,10,16.375,10,15C10,13.625,8.875,12.5,7.5,12.5ZM12.5,15C12.5,13.625,13.625,12.5,15,12.5C16.375,12.5,17.5,13.625,17.5,15C17.5,16.375,16.375,17.5,15,17.5C13.625,17.5,12.5,16.375,12.5,15ZM22.5,12.5C21.125,12.5,20,13.625,20,15C20,16.375,21.125,17.5,22.5,17.5C23.875,17.5,25,16.375,25,15C25,13.625,23.875,12.5,22.5,12.5Z" fill-rule="evenodd" fill="#27ACAA" fill-opacity="1"/>
+</g></g></g></g></svg>
\ No newline at end of file

src/app-register.ts

@@ -14,6 +14,7 @@ import { entityServiceRegister } from '@/service/entity-service-register';
 import { counterServiceRegister } from '@/counter/counter-service-register';
 import { codeListRegister } from '@codelist/codelist-register';
 import { messageServiceRegister } from '@/message/message-service-register';
+import AppIcon from './components/app-icon/app-icon.vue'
 import AppCaption from './components/app-caption/app-caption.vue'
 import AppHelp from './components/app-help/app-help.vue'
 import AppButton from './components/app-button/app-button.vue'
@@ -179,6 +180,7 @@ export const AppComponents = {
         v.prototype.$verify = Verify;
         v.prototype.$viewTool = ViewTool;
         v.prototype.$uiActionTool = UIActionTool;
+        v.component('app-icon',AppIcon);
         v.component('app-caption',AppCaption);
         v.component('app-help',AppHelp);
         v.component('app-button',AppButton);

src/components/app-icon/app-icon.scss

+.app-icon {
+    &.app-icon--normal {
+        cursor: pointer;
+        color: var(--app-color-blue-green) !important;
+    }
+    &.app-icon--disabled {
+        cursor: no-drop;
+        color: var(--app-color-gray-200) !important;
+    }
+}
+.app-icon-others {
+    .ivu-poptip-inner {
+        border-radius: 0;
+    }
+    .ivu-poptip-body {
+        padding: 0;
+    }
+    .others-item {
+        height: 30px;
+        display: flex;
+        cursor: pointer;
+        align-items: center;
+        justify-content: center;
+        color: var(--app-color-gray-100);
+        border-bottom: 1px solid var(--app-color-gray-250);
+        &:hover {
+            background: rgba(39, 172, 170, 0.1);
+            color: var(--app-color-black);
+            box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.16);
+        }
+    }
+}
\ No newline at end of file

src/components/app-icon/app-icon.vue

+<template>
+    <tooltip v-if="icons.length > 0" :content="icons.length > 1 ? '其他' : icons[0].text" :class="`app-icon ${disabled ? 'app-icon--disabled' : 'app-icon--normal'}`" placement="top" :disabled="disabled" :transfer="true">
+        <template v-if="icons.length > 1">
+            <poptip v-model="visible" trigger="hover" content="content" placement="bottom" :transfer="true" popper-class="app-icon-others" :disabled="disabled">
+                <img src="/assets/img/others.svg" />
+                <div class="others" slot="content">
+                    <div v-for="(icon, index) in icons" :key="index" class="others-item" @click="($event) => handleClick(icon, $event)">
+                        <span class="icon-text">{{icon.text}}</span>
+                    </div>
+                </div>
+            </poptip>
+        </template>
+        <template v-else-if="icons.length == 1">
+            <img v-if="icons[0].imgPath" :src="icons[0].imgPath" @click="($event) => handleClick(icons[0], $event)"/>
+            <i v-else-if="icons[0].iconClass" :class="icons[0].iconClass" @click="($event) => handleClick(icons[0], $event)"></i>
+        </template>
+    </tooltip>
+</template>
+<script lang='ts'>
+import { Vue, Component, Prop } from 'vue-property-decorator';
+
+@Component({})
+export default class AppIcon extends Vue {
+
+    /**
+     * 禁用
+     *
+     * @type {boolean}
+     * @memberof AppIcon
+     */
+    @Prop({ default: false })
+    public disabled!: boolean;
+
+    /**
+     * 图标集
+     *
+     * @type {any[]}
+     * @memberof AppIcon
+     */
+    @Prop({ default: () => [] })
+    public icons!: any[];
+
+    /**
+     * 显示poptip
+     *
+     * @type {any[]}
+     * @memberof AppIcon
+     */
+    public visible: boolean = false;
+
+    /**
+     * 处理点击
+     *
+     * @memberof AppIcon
+     */
+    public handleClick(icon: any, $event: MouseEvent) {
+        $event.stopPropagation();
+        $event.preventDefault();
+        this.visible = false;
+        if (!this.disabled) {
+            this.$emit('click', icon, $event);
+        }
+    }
+}
+</script>
+
+<style lang="scss">
+@import './app-icon.scss';
+</style>
\ No newline at end of file