From f63df3ab55be48d60fb37767c5c39943f2b38bb1 Mon Sep 17 00:00:00 2001
From: mengxiaolong <meng.xiaolong@ebiz-digits.com>
Date: Mon, 16 Nov 2020 18:29:10 +0800
Subject: [PATCH] =?UTF-8?q?=E7=99=BE=E5=AE=9D=E7=AE=B1=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/ebiz/goodStart/index.js             | 11 +++++
 src/router/ebiz/goodStart.js                | 15 ++++++
 src/views/ebiz/goodStart/Treasure.vue       | 51 +++++++++++++++++++--
 src/views/ebiz/goodStart/TreasureDetail.vue | 25 ++++++++++
 4 files changed, 97 insertions(+), 5 deletions(-)
 create mode 100644 src/api/ebiz/goodStart/index.js
 create mode 100644 src/views/ebiz/goodStart/TreasureDetail.vue

diff --git a/src/api/ebiz/goodStart/index.js b/src/api/ebiz/goodStart/index.js
new file mode 100644
index 000000000..e3ae5a1b5
--- /dev/null
+++ b/src/api/ebiz/goodStart/index.js
@@ -0,0 +1,11 @@
+import request from '@/assets/js/utils/request'
+import getUrl from '@/assets/js/utils/get-url'
+
+// 百宝箱菜单查询
+export function getTreasureMenus(data) {
+  return request({
+    url: getUrl('/app/code/getCodeValue', 1),
+    method: 'post',
+    data
+  })
+}
diff --git a/src/router/ebiz/goodStart.js b/src/router/ebiz/goodStart.js
index 58fe92d5f..d55f85f2f 100644
--- a/src/router/ebiz/goodStart.js
+++ b/src/router/ebiz/goodStart.js
@@ -1,6 +1,15 @@
 // 开门红专区
 const Prefecture = () => import('@/views/ebiz/goodStart/Prefecture')
 const Treasure = () => import('@/views/ebiz/goodStart/Treasure')
+const TreasureDetail = () => import('@/views/ebiz/goodStart/TreasureDetail')
+
+const spreadParams = function(route) {
+  const params = {}
+  for (let key in route.query) {
+    params[key] = route.query[key]
+  }
+  return params
+}
 
 export default [
   {
@@ -18,5 +27,11 @@ export default [
     meta: {
       title: '百宝箱'
     }
+  },
+  {
+    path: '/goodStart/treasureDetail',
+    name: 'TreasureDetail',
+    component: TreasureDetail,
+    props: route => spreadParams(route)
   }
 ]
diff --git a/src/views/ebiz/goodStart/Treasure.vue b/src/views/ebiz/goodStart/Treasure.vue
index 44b460921..e94416963 100644
--- a/src/views/ebiz/goodStart/Treasure.vue
+++ b/src/views/ebiz/goodStart/Treasure.vue
@@ -1,22 +1,63 @@
 <template>
-  <div>
-    <img :src="treasureDetail" />
+  <div class="treasure bg-white">
+    <van-grid :border="false">
+      <van-grid-item v-for="(menu, index) in menus" :key="index" @click="toDetail(menu)">
+        <img :src="$assetsUrl + menu.iconUrl" />
+        <span>{{ menu.name }}</span>
+      </van-grid-item>
+    </van-grid>
   </div>
 </template>
 
 <script>
-import treasureDetail from '@/assets/images/goodStart/treasureDetail.png'
+import { Grid, GridItem } from 'vant'
+import { getTreasureMenus } from '@/api/ebiz/goodStart'
 export default {
+  name: 'Treasure',
+  components: {
+    [Grid.name]: Grid,
+    [GridItem.name]: GridItem
+  },
   data() {
     return {
-      treasureDetail
+      menus: []
     }
+  },
+  methods: {
+    toDetail(menu) {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + `/#/goodStart/treasureDetail?img=${menu.detailImgUrl}`
+        },
+        routerInfo: {
+          path: `/goodStart/treasureDetail?img=${menu.detailImgUrl}`
+        }
+      })
+    },
+    async getMenus() {
+      const param = { operateType: 'treasure_menus' }
+      const result = await getTreasureMenus(param)
+      console.dir(result)
+      if (result.result === '0') {
+        this.menus = result.content
+      } else {
+        this.$toast(result.resultMessage)
+      }
+    }
+  },
+  mounted() {
+    this.getMenus()
   }
 }
 </script>
 
 <style lang="scss" scoped>
+.treasure {
+  min-height: 100vh;
+}
+
 img {
-  max-width: 100%;
+  max-width: 80%;
 }
 </style>
diff --git a/src/views/ebiz/goodStart/TreasureDetail.vue b/src/views/ebiz/goodStart/TreasureDetail.vue
new file mode 100644
index 000000000..02acd11b8
--- /dev/null
+++ b/src/views/ebiz/goodStart/TreasureDetail.vue
@@ -0,0 +1,25 @@
+<template>
+  <div>
+    <img :src="$assetsUrl + img" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TreasureDetail',
+  props: {
+    img: {
+      type: String
+    }
+  },
+  data() {
+    return {}
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+img {
+  max-width: 100%;
+}
+</style>