dvcp_v2_webapp/ui/dv/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>
      <template v-if="$slots.right" #right>
        <slot name="right"/>
      </template>
      <div :style="{padding}" class="content">
        <slot/>
      </div>
    </component>
    <div v-else :style="{padding}" class="content">
      <slot style="width: 100%; height: 100%;"/>
    </div>
  </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";
import border9 from "./borders/border9";
import border10 from "./borders/border10";
import border11 from "./borders/border11";
import border12 from "./borders/border12";
import border13 from "./borders/border13";
import Border14 from "./borders/border14.vue";
import Border15 from "./borders/border15.vue";

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

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

  * {
    box-sizing: border-box;
  }

  .content {
    height: 100%;
  }
}
</style>