<template>
  <div>
    <a-card :title="`参数名称：${item.id}`" style="width: 540px; margin-top: -5px">
      <template #extra>
        <div style="display: flex; align-items: center">
          <span style="color: #0170cc; cursor: pointer" @click="handleEdit">编辑</span>
          <a-divider type="vertical" style="height: 12px; background-color: #d8d8d8" />
          <span style="color: #0170cc; cursor: pointer" class="ml-1" @click="handleDelete"
            >删除</span
          >
        </div>
      </template>
    </a-card>
  </div>
</template>
<script lang="ts" setup>
  import { FunctionJson } from '/@/api/device/model/modelOfMatterModel';

  const emit = defineEmits(['delete', 'edit']);

  type ItemRecrod = FunctionJson & { id: string };

  const props = defineProps({
    item: {
      type: Object as PropType<ItemRecrod>,
      required: true,
      default: () => {},
    },
  });

  const handleDelete = () => {
    emit('delete', props.item);
  };

  const handleEdit = () => {
    emit('edit', props.item);
  };

  const getFormData = () => {
    return props.item;
  };

  defineExpose({
    getFormData,
  });
</script>
<style lang="less" scoped>
  :deep(.ant-card-body) {
    display: none !important;
  }
</style>