noob-components/packages/base/data/table-action.vue

<template>
    <slot name="left"></slot>
    <el-tooltip effect="dark" :content="t('base.modify')" placement="top">
        <el-button v-if="modify" :size="state.size.size" type="primary" @click="emit('modify')" icon="EditPen" circle />
    </el-tooltip>
    <el-tooltip effect="dark" :content="t('base.delete')" placement="top">
        <el-button v-if="del" :size="state.size.size" type="danger" @click="emit('del')" icon="delete" circle />
    </el-tooltip>
    <el-tooltip effect="dark" :content="t('base.add')" placement="top">
        <el-button v-if="add" :size="state.size.size" type="success" @click="emit('add')" icon="plus" circle />
    </el-tooltip>
    <slot></slot>
</template>

<script lang="ts" setup>
import { useStore } from "vuex";
import { onMounted } from "vue";
import { useI18n } from "vue3-i18n";

const { t } = useI18n();
const { state } = useStore();
const emit = defineEmits(["modify", "del", "add"]);
const prop = defineProps({
    add: {
        type: Boolean,
        default: false,
    },
    modify: {
        type: Boolean,
        default: true,
    },
    del: {
        type: Boolean,
        default: true,
    },
});

onMounted(() => { });
</script>
<style lang="scss" scoped>
//@import url(); 引入公共css类
</style>