已增加整轮播图和地图连线

ui/packages/layout/AiFold.vue

@@ -0,0 +1,66 @@
+<template>
+  <section class="AiFold">
+    <div class="flex">
+      <div class="expand mar-r8" :class="arrow" @click="collapse=!collapse"/>
+      <div class="flex title fill">
+        <div v-if="!$slots.title" v-text="title"/>
+        <slot name="title" v-else/>
+      </div>
+    </div>
+    <div class="content" :class="{collapse}">
+      <slot/>
+    </div>
+  </section>
+</template>
+<script>
+export default {
+  name: "AiFold",
+  props: {
+    title: String,
+    expand: Boolean
+  },
+  data() {
+    return {
+      collapse: true
+    }
+  },
+  computed: {
+    arrow: v => v.collapse ? 'el-icon-arrow-right' : 'el-icon-arrow-down'
+  },
+  methods: {},
+  created() {
+    if (this.expand) this.collapse = false
+  }
+}
+</script>
+<style scoped lang="scss">
+.AiFold {
+  padding: 10px;
+  border-bottom: 1px solid #000;
+
+  .title {
+    width: 100%;
+  }
+
+  .content {
+    box-sizing: border-box;
+    height: initial;
+    overflow: hidden;
+    padding-top: 8px;
+
+    &.collapse {
+      height: 0;
+      padding-top: 0;
+    }
+  }
+
+  .expand {
+    text-align: center;
+    cursor: pointer;
+
+    &:hover {
+      opacity: .8;
+    }
+  }
+}
+</style>