mine.vue 2.67 KB
<template>
  <LayoutApp :show-back="true" title="我的" :hideHeader="hideHeader">
    <div class="body" ref="body">
      <div v-for="(value, key) in getMineList" :key="key">
        <tab-item v-if="key === 'board'" :data="value" noLine icon="cubeic-notification" small grey>
          <noticeScroll></noticeScroll>
        </tab-item>
        <template v-else-if="key === 'resource1' || key === 'resource2'">
          <div v-if="value.data.template_name ==='single_image'">
            <singleImage :data="value.data.data[0]"></singleImage>
          </div>
        </template>
        <div v-else-if="key === 'order'" class="bg-bottom">
          <order></order>
        </div>
        <div v-else-if="key === 'sale'" class="bg-top">
          <tab-item :data="value" noLine titleBold titleSmall numStyle='color: #999;'></tab-item>
        </div>
        <bind v-else-if="key === 'bindAccount'" :data="value"></bind>
        <tab-item v-else :data="value"></tab-item>
      </div>
    </div>
  </LayoutApp>
</template>

<script>
import tabItem from './components/tabItem';
import order from './components/order';
import scroll from './components/scroll';
import singleImage from './components/singleImage';
import bind from './components/bind';
import { createNamespacedHelpers } from 'vuex';

const { mapGetters, mapActions } = createNamespacedHelpers('home/mine');
export default {
  props: ['hideHeader'],
  data() {
    return {};
  },
  computed: {
    ...mapGetters(['getMineList'])
  },
  created() {

  },
  activated() {
    this.fetchResource();
    this.fetchFavoriteNum();
    this.fetchOrderSummary();
    this.fetchSellerOrder();
    this.fetchAssets(true);
    // this.fetchUserWalletInfo();
    this.fetchCoupon();
  },
  beforeRouteEnter(to, from, next) {
    // 从我的绑定支付宝后进入交易明细
    next(vm => {
      let isbind = vm.$store.state.home.bindAccount.validStatus === 1;
      if (isbind && from.name === 'bindAccount') {
        vm.$router.push({ name: 'tradeIncome' });
      }
    });
  },
  methods: {
    ...mapActions(['fetchFavoriteNum', 'fetchResource', 'fetchSellerOrder', 'fetchOrderSummary', 'fetchAssets', 'fetchUserWalletInfo', 'fetchCoupon']),
  },
  components: {
    tabItem,
    order,
    noticeScroll: scroll,
    singleImage,
    bind,
  }
};
</script>

<style lang="scss" scoped>
.body {
  height: 100%;
  overflow-y: auto;
  background-color: white;
  padding: 0 40px;
}

.bg-top,
.bg-bottom {
  background-color: #F2F2F2;
}

.bg-top {
  border-top-left-radius: 32px;
  border-top-right-radius: 32px;
  margin-top: 30px;
  padding: 0 30px;
}

.bg-bottom {
  border-bottom-left-radius: 32px;
  border-bottom-right-radius: 32px;
  margin-bottom: 20px;
}
</style>