dvcp_v2_webapp/components/layout/AiDvPanel/AiDvPanel.vue

<template>
  <section class="AiDvPanel">
    <component :is="border" :title="title" v-if="border" :theme="theme">
      <template v-if="$slots.title" #title>
        <slot name="title"/>
      </template>
      <slot/>
    </component>
    <slot style="width: 100%; height: 100%;" v-else></slot>
  </section>
</template>

<script>
import Border1 from "./borders/border1";
import Border0 from "./borders/border0";
import Border2 from "./borders/border2";
import Border3 from "./borders/border3";
import Border4 from "./borders/border4";
import Border5 from "./borders/border5";
import border6 from "./borders/border6";
import border7 from "./borders/border7";
import border8 from "./borders/border8";

export default {
  name: "AiDvPanel",
  components: { Border0, Border1, Border2, Border3, Border4, Border5, border6, border7, border8 },
  props: {
    title: {default: "请传入标题"},
    border: {default: "border0"},
    theme: {
      type: String,
      default: '0'
    }
  },
  mounted() {
  },
}
</script>

<style lang="scss" scoped>
.AiDvPanel {
  position: relative;
  height: 100%;

  * {
    box-sizing: border-box;
  }
}
</style>