企微应用配置

src/apps/AppPageHome.vue/AppPageHome.vue

@@ -1,14 +1,15 @@
 <template>
   <section class="AppPageHome">
-    <div class="header" :style="`backgroundImage: url(${headerBg});`">
-      <p>{{label}}</p>
+    <div class="header" :style="`backgroundImage: url(${appInfo.banner});`">
+      <p>{{appInfo.title}}</p>
     </div>
-    <div class="content">
-      <div class="title">{{label}}</div>
+    <div class="content" v-if="appInfo.wxApplicationList && appInfo.wxApplicationList.length">
+      <div class="title">{{appInfo.title}}</div>
       <div class="app-list">
-        <div class="item" v-for="(item, index) in appList" :key="index" @click="linkTo(item.url)" :style="item.isBottom ? 'border-bottom: 1px solid #eee;' : ''">
-          <div class="icon" :style="`backgroundImage: url(${item.icon});`"></div>
-          <p>{{item.name}}</p>
+        <div class="item" v-for="(item, index) in appInfo.wxApplicationList" :key="index" @click="linkTo(item.accessPath)">
+          <img :src="item.icon" alt="" class="icon">
+          <!-- <div class="icon" :style="`backgroundImage: url(${item.icon});`"></div> -->
+          <p>{{item.title}}</p>
         </div>
       </div>
     </div>  
@@ -26,21 +27,23 @@ export default {
       label: '',
       appList: [],
       headerBg: '',
-      cropId: ''
+
+      id: '',
+      appInfo: {},
     }
   },
   onLoad(options) {
-    this.cropId = options.id
+    // this.id = options.id
+    this.id = '7a4701d5641543cca4419488db368d3e'
     this.getAppInfo()
   },
   methods: {
     getAppInfo() {
-      // this.$http.post(`/app/apppartyquestion/checkAnswer`, this.list).then((res) => {
-      //   if (res.code == 0) {
-      //     this.resultInfo = res.data
-      //     this.showAnwser = true
-      //   }
-      // });
+      this.$http.post(`/app/appwxapplication/queryDetailById?id=${this.id}`).then((res) => {
+        if (res.code == 0) {
+          this.appInfo = res.data
+        }
+      });
     },
     linkTo(url) {
       console.log(url)
@@ -95,8 +98,6 @@ export default {
           width: 58px;
           height: 58px;
           margin: 40px 0 18px 0;
-          background-size: 100% 100%;
-          text-align: center;
         }
         p{
           font-size: 28px;
@@ -109,6 +110,9 @@ export default {
       .item:nth-of-type(3n) {
         border-right: 0;
       }
+      .item:nth-of-type(n+4) {
+        border-top: 1px solid #eee;
+      }
     }
   }
 }