sl-sfy-safety/src/views/system/user/component/ActionColomns.vue

<template>
  <div class="flex items-center justify-center">
    <el-space :size="space">
      <div v-for="item in props.actionIcons" :key="item.label" @click="item.onClick">
        <div v-if="item.label === '重置密码'" style="font-size: 10px;color: #629bf9;cursor: pointer;">{{item.label}}</div>
        <el-tooltip v-else :content="item.label" effect="light">
          <el-icon v-if="props.style === 'icon'" :color="props.color" :size="props.size">
            <component :is="item.icon" />
          </el-icon>
          <img
            v-if="props.style === 'img'"
            :src="item.icon"
            :style="{ width: `${props.size}px` }"
          />
        </el-tooltip>  
      </div>
    </el-space>
  </div>
</template>

<script setup lang="ts">
  import { ActionItem } from '@/components/Table';

  const props = defineProps<{
    space: number;
    size: number;
    color: string;
    style: 'img' | 'icon';
    actionIcons: ActionItem[];
  }>();
</script>

<style scoped></style>