<template>
  <div class="page-content">
    <v-nav :navpath="navpath"></v-nav>
    <photo-album :member-id="memberId" :folder-id="folderId"/>
    <vue-gic-footer style="padding-bottom:80px"></vue-gic-footer>
  </div>
</template>

<script>
import vNav from '@/common/navbar/navbar.vue';
import photoAlbum from './photo-album.vue';
import request from '@/api/request.js';
export default {
  name: 'img-list',
  components: {
    vNav,
    photoAlbum
  },
  data() {
    return {
      api: {
        // 获取用户所有相册
        getOneMemberAlbum: '/api-member/getOneMemberAlbum'
      },
      navpath: [
        {
          name: '首页',
          path: ''
        },
        {
          name: '会员详情',
          path: ''
        },
        {
          name: "相册",
          path: ''
        }
      ],
      from: '',
      memberId: '',
      folderId: ''
    }
  },
  async created() {
    let from = this.$route.query.from;
    let memberId = this.$route.query.memberId;
    let folderId = this.$route.query.folderId;
    this.from = from;
    this.memberId = memberId;
    this.folderId = folderId;
    await this.getImgList()
    let folder = this.folderData.filter(item => item.id === folderId);
    this.navpath[2] = {
      name: "相册",
      path: `/photo-album?memberId=${memberId}&from=${from}`
    }
    if (folder.length > 0) {
      this.navpath.push({
        name: folder[0].name,
        path: ''
      })
    }
    switch (from) {
      case '0':
        // 微信会员
        this.navpath[1] = {
          name: '会员详情',
          path: `/wechatmemberDetail?memberId=${memberId}`
        }
        break;
      case '1':
        // 微信总量
        this.navpath[1] = {
          name: '会员详情',
          path: `/wechatTotalDetail?memberId=${memberId}`
        }
        break
      default:
        this.navpath.splice(1, 1);
    }
  },
  methods: {
    getImgList() {
      return request.get(`${this.api.getOneMemberAlbum}/${this.memberId}`).then(res => {
        let { code, message, data } = res.data;
        data = data || [];
        if (code !== 200) {
          this.$message.error(message);
          return;
        }
        this.folderData = data.slice();
      });
    }
  }
}
</script>

<style lang="scss" scoped>
.page-content {
  min-width: 1400px;
}
.mall-section-container {
  position: relative;
  padding: 22px 24px 24px;
  margin: 24px;
  min-height: calc(100vh - 427px);
  background: #fff;
}
</style>
