<template>
  <button
    :class="[
      'w-full bg-blue-500 text-white font-bold py-3 px-4 rounded-lg shadow-lg',
      'hover:bg-blue-600 transition-colors duration-300',
      'disabled:bg-gray-400 disabled:cursor-not-allowed'
    ]"
    :disabled="disabled"
    @click="$emit('click')"
  >
    <slot></slot>
  </button>
</template>

<script setup>
/**
 * PrimaryButton 组件
 * @description 一个通用的主操作按钮，封装了统一样式和交互效果。
 * @props {boolean} disabled - 是否禁用按钮。
 * @emits {void} click - 点击事件。
 */

const props = defineProps({
  disabled: {
    type: Boolean,
    default: false
  }
});

const emit = defineEmits(['click']);
</script>