<template>
  <div class="content-header bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 p-4">
    <div class="flex flex-wrap items-center justify-between">
      <h1 class="page-title text-xl font-semibold">{{ title }}</h1>
      
      <div class="page-actions flex items-center space-x-2 mt-2 sm:mt-0">

      </div>
    </div>
  </div>
</template>

<script setup>
import { defineProps, defineEmits } from 'vue';
import { ElButton } from 'element-plus';

// 定义属性
const props = defineProps({
  title: {
    type: String,
    required: true
  },
  actions: {
    type: Array,
    default: () => []
  }
});

// 定义事件
const emit = defineEmits(['action-click']);
</script>

<style scoped>
.content-header {
  @apply shadow-sm;
}

.page-actions {
  @apply flex-wrap;
}
</style>
    