<template>
  <el-card body-class="pro-card" v-bind="$attrs">
    <div class="el-card-top">
      <div class="title">{{ props.title }}</div>
      <slot name="top" />
    </div>
    <slot></slot>
  </el-card>
</template>

<script setup lang="ts">
  export interface Props {
    title?: string
  }
  const props = withDefaults(defineProps<Props>(), {
    title: '5555'
  })
</script>

<style scoped lang="less">
  .title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
  }
  .el-card {
    box-shadow: none;
    border: none;
    padding: 16px;
    &-top {
      display: flex;
      justify-content: space-between;
    }
  }
</style>
