<template>
  <view class="latest-content_box">
      <view class="shop-title_box">
          您访问过的供货商
      </view>
      <view class="shop-list_box">
          <template v-if="!$util.isEmpty(list)">
          <view 
            :key="item.shopId"
            @click="pageTo({
              url: '/admin/billing/customerPlace',
              query: {
                shopId: item.shopId,
              }
            })"
            v-for="item in list">
            <app-avatar-module src="https://goss.cfp.cn/creative/vcg/800/new/VCG41N1210205351.jpg" :width="120" />
            <view class="tit">
              {{item.shopName}}
            </view>
          </view>
          </template>
          <div v-else>
            暂无数据
          </div>
      </view>
      <view class="app-footer">
          <view @click="pageTo({
            url:`/pagesClient/official/index?introMerchantId=${this.userInfo.id}&form=2&style=2`
          })" class="des">
              我是供货商，点此 <text>申请开店</text><i class="iconfont iconxiangyou"></i>
          </view>
      </view>
  </view>
</template>

<script>
import { recentShop } from "@/api/official";
import { share } from "@/mixins";
import AppAvatarModule from "@/components/module/app-avatar";
import {mapGetters} from 'vuex'
export default {
  name: "shop-list",
  components: {AppAvatarModule},
  mixins: [share],
  data() {
    return {
      list:[]
    };
  },
  computed: {
		...mapGetters({ userInfo: "getUser" })
	},
  onLoad() {
    
  },
  methods: {
     async init(){
        try {
          const { data } = await recentShop({})
          this.list = data
        } catch(e){

        }
          
      },
      getGhsList(){

      }
  }
};
</script>

<style lang="scss" scoped>
  .shop-title_box {
    color: #333333;
    font-size: 36upx;
    font-weight: 600;
    padding: 48upx 0 80upx 40upx;
  }
  .shop-list_box {
    padding:0 60upx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    & > view {
      width: 120upx;
      margin-bottom: 70upx;
      & .tit {
        text-align: center;
        margin-top: 30upx;
      }
    }
  }
  .app-footer {
     font-size: 28upx;
    & .des {
      &  > text {
        color: #3385FF;
        display: inline-block;
        margin-left: 3upx;
      }
      & .iconfont {
        color: #3385FF;
        font-size: 22upx;
        margin-left: 2upx;
      }
    }
  }
</style>
