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

ui/lib/js/utils.js

@@ -220,5 +220,17 @@ export default {
   $load,
   $reg,
   Area,
-  ID
+  ID,
+  $arrDepth: (arr) => {
+    if (Array.isArray(arr)) {
+      let max = 1
+      for (let i = 0; i < arr.length; i++) {
+        const depth = this.$arrDepth(arr[i])
+        if (depth > max) {
+          max = depth
+        }
+      }
+      return max
+    } else return 0
+  }
 }

ui/lib/styles/common.scss

@@ -295,7 +295,7 @@ input::-ms-input-placeholder {
 /**
 自定义弹性盒子快速用
  */
-div[flex] {
+div[flex], .flex {
   display: flex;
   align-items: center;
 
@@ -717,3 +717,8 @@ h1, h2, h3, p {
     pointer-events: all;
   }
 }
+
+.m-center {
+  margin-left: 50%;
+  transform: translateX(-50%);
+}

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>