fuse-code/src/views/tagging/sign.vue

<template>
  <ui-group-option class="sign-tagging" :class="{active: selected}" @click="emit('select')">
    <div class="info">
      <img :src="getFileUrl(tagging.images[0])">
      <div>
        <p>{{ tagging.title }}</p>
        <a>放置：{{ tagging.positions.length }}</a>
      </div>
    </div>
    <div class="actions" @click.stop>
      <ui-icon type="pin" ctrl />
      <ui-more 
        :options="menus" 
        style="margin-left: 20px" 
        @click="(action: keyof typeof actions) => actions[action]()" 
      />
    </div>
  </ui-group-option>
</template>

<script setup lang="ts">
import { Tagging } from '@/store'
import { getFileUrl } from '@/utils'


defineProps<{ tagging: Tagging, selected?: boolean }>()

const emit = defineEmits<{ 
  (e: 'delete'): void 
  (e: 'edit'): void
  (e: 'select'): void
}>()

const menus = [
  { label: '编辑', value: 'edit' },
  { label: '删除', value: 'delete' },
]
const actions = {
  edit: () => emit('edit'),
  delete: () => emit('delete')
}

</script>

<style lang="scss" scoped src="./style.scss"></style>