配置引导页完成一部分

core/apps/AppMenuManager/introPage.vue

@@ -0,0 +1,78 @@
+<template>
+  <section class="introPage">
+    <ai-detail list>
+      <ai-title slot="title" title="引导页配置" isShowBottomBorder>
+        <template #rightBtn>
+          <el-row type="flex">
+            <component-lib @select="handleAddComp"/>
+            <el-button type="text" @click="submit">保存</el-button>
+            <el-button type="text" @click="">取消</el-button>
+          </el-row>
+        </template>
+      </ai-title>
+      <template #content>
+        <ai-drag v-for="comp in configs" :key="comp.value" :w="comp.width" :h="comp.height" parent>
+          <comp-render :ops="comp"/>
+        </ai-drag>
+        <div v-if="!hasConfigs" class="empty">编辑区域</div>
+      </template>
+    </ai-detail>
+  </section>
+</template>
+
+<script>
+import AiDrag from "../../components/AiDrag";
+import ComponentLib from "./tools/componentLib";
+import AiEditBtn from "../../components/AiEditBtn";
+import CompRender from "./tools/compRender";
+
+export default {
+  name: "introPage",
+  components: {CompRender, AiEditBtn, ComponentLib, AiDrag},
+  props: {
+    instance: Function,
+    dict: {default: () => ({})}
+  },
+  computed: {
+    hasConfigs: v => v.configs?.length > 0
+  },
+  data() {
+    return {
+      form: {},
+      configs: []
+    }
+  },
+  methods: {
+    handleAddComp(comp) {
+      console.log(comp)
+      this.configs.push({...comp})
+    },
+    submit() {
+
+    }
+  },
+  created() {
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.introPage {
+  height: 100%;
+
+  .empty {
+    width: 100%;
+    min-height: calc(100vh - 180px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 48px;
+    color: #999;
+    border: 1px dashed #ddd;
+  }
+
+  ::v-deep.ai-detail__content--wrapper {
+    min-height: 100%;
+  }
+}
+</style>