添加首页

src/views/home/index.vue

@@ -3,14 +3,16 @@
     <van-nav-bar class="navBar" title="首页" />
     <div class="content">
       <!-- 拜访（实时） -->
-      <van-collapse-item :name="visitCollapse.name">
-        <van-collapse v-model="activeNames">
-          <!-- 拜访（实时） -->
-          <van-collapse-item name="1">
-            <visitCollapse></visitCollapse>
-          </van-collapse-item>
-        </van-collapse>
-      </van-collapse-item>
+      <van-collapse v-model="activeNames">
+        <van-collapse-item name="1">
+          <template #title>
+            <div class="itemHeader">
+              <span class="itemTitle">拜访（实时）</span>
+            </div>
+          </template>
+          <visitCollapse v-if="visitCollapse" :visitCollapse="visitCollapse"></visitCollapse>
+        </van-collapse-item>
+      </van-collapse>
     </div>
     <tab-bar tabBarActive="home"></tab-bar>
   </div>
@@ -18,15 +20,29 @@
 <script>
 import visitCollapse from './visitCollapse.vue';
 import tabBar from '@/components/tabBar';
+import { chainTargetList } from '@/api/home';
 export default {
   name: 'homePage',
   components: { visitCollapse, tabBar },
   data() {
     return {
-      visitCollapse: {},
+      visitCollapse: [],
       activeNames: ['1'],
     };
   },
+  created() {
+    // 获取实时拜访
+    this.getVisitCollapse();
+  },
+  methods: {
+    getVisitCollapse() {
+      chainTargetList().then((res) => {
+        if (res.code == 200) {
+          this.visitCollapse = res.data;
+        }
+      });
+    },
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -36,5 +52,10 @@ export default {
   display: flex;
   flex-direction: column;
   overflow: hidden;
+  padding-bottom: 55px;
+  .content {
+    flex: 1;
+    overflow-y: auto;
+  }
 }
 </style>

src/views/home/visitCollapse.vue

@@ -1,63 +1,62 @@
 <template>
   <div class="visitCollapse">
-    <!-- <template>
-      <span class="updateTime" v-if="visitCollapse.latestUpdateTime != ''">
-        更新时间：
-        {{ visitCollapse.latestUpdateTime }}
-      </span>
-      <template #title>
-        <div class="itemHeader">
-          <span class="itemTitle" v-if="visitCollapse.title">{{ visitCollapse.title }}</span>
-          <span @click.stop v-if="visitCollapse.tipsPopoverlabel">
-            <el-popover placement="right" trigger="click" popper-class="hintPopover">
-              <div
-                class="popoverConten"
-                v-for="(item, index) in visitCollapse.tipsPopoverlabel"
-                :key="index">
-                {{ item }}
+    <div class="visitCollapse-box" v-for="(item, index) in visitCollapse" :key="index">
+      <div class="targetName" v-if="item.targetName">{{ item.targetName }}</div>
+      <div class="child" v-if="item.children">
+        <div
+          :class="['children-item', item1.targetLevel !== 2 ? 'targetLevel' : '']"
+          v-for="(item1, index1) in item.children"
+          :key="index1">
+          <template v-if="item1.targetLevel == 2">
+            <div class="child-targetName" v-if="item1.targetName">
+              {{ item1.targetName }}
+            </div>
+            <template v-if="item1.children">
+              <div class="value-box">
+                <div class="value" v-for="(item2, index2) in item1.children" :key="index2">
+                  {{ item2.targetName }}
+                </div>
               </div>
-              <div slot="reference" class="hintIconBox">
-                <img class="hintIcon" :src="hintIcon" />
-              </div>
-            </el-popover>
-          </span>
-        </div> </template
-    ></template> -->
-    <!-- <visitPage
-          v-if="visitCollapse.resData"
-          fromType="noVisit"
-          :empLevel="empLevel"
-          :contentData="visitCollapse.contentData"
-          :maskShow="visitCollapse.collapseLosding"
-          :resData="visitCollapse.resData"></visitPage> -->
+            </template>
+          </template>
+          <template v-else>
+            <div class="value" v-if="item1.targetName">
+              {{ item1.targetName }}
+            </div>
+          </template>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 <script>
-import { chainTargetList } from '@/api/home';
 export default {
   name: 'visitCollapse',
-  data() {
-    return {
-      visitCollapse: {},
-    };
-  },
-  created() {
-    this.getVisitCollapse();
-  },
-  methods: {
-    getVisitCollapse() {
-      chainTargetList().then((res) => {
-        if (res.code == 200) {
-          this.visitCollapse = res.data;
-        }
-      });
+  props: {
+    visitCollapse: {
+      type: Array,
+      default: () => [],
     },
   },
+  data() {
+    return {};
+  },
+  created() {},
+  methods: {},
 };
 </script>
 <style lang="scss" scoped>
 .visitCollapse {
-  flex: 1;
-  overflow-y: auto;
+  .visitCollapse-box {
+    .value-box {
+      // display: flex;
+      .value {
+        float: left;
+      }
+    }
+    .targetLevel {
+      float: left;
+    }
+  }
 }
 </style>