<template>
  <!-- #ifdef H5 -->
  <zj-page-layout
    :isScroll="true"
    :refresherTriggered="refresherTriggered"
    @refresherrefresh="refresherrefresh"
    @scrolltolower="scrolltolower">
    <view class="list-container">
      <view class="item" v-for="(item,index) in dataList" :key="index">
        <view class="title">网点信息</view>
        <view class="row">
          <view class="label">网点名称</view>
          <view class="value">{{item.name}}</view>
        </view>
        <view class="row">
          <view class="label">联系人</view>
          <view class="value">{{item.linkName}}</view>
        </view>
        <view class="row">
          <view class="label">联系电话</view>
          <view class="value">
		  	{{item.websitPhone}}
		  	<view class="fun" @tap.stop="$callPhone(item.websitPhone)">
		  	  <text class="iconfont icon-call"></text>
		  	  <view class="text">联系Ta</view>
		  	</view>
		  </view>
        </view>
        <view class="row">
          <view class="label">联系地址</view>
          <view class="value">{{item.address}}</view>
        </view>
      </view>
    </view>
	<Loading :loadStatus="dataList.length>0?2:3" :dataList="dataList"/>
  </zj-page-layout>
  <!-- #endif -->

  <!-- #ifndef H5 -->
  <web-view :src="webViewHref(`/packageHome/pages/addvalue/websiteList`, pam, crossPagePam)" @message="crossPage.$listener"></web-view>
  <!-- #endif -->
</template>

<script>
  // #ifdef H5
  export default {
    data() {
      return {
        refresherTriggered: false,
		dataList: []
      }
    },

    onLoad() {
      this.getList();
    },

    methods: {
      getList() {
      	this.$api.get('/user/apply/websit', {
      		isIncre: true,
			isAll: true
      	}).then(res => {
      		this.refresherTriggered = false;
      		this.dataList = res.data
      	})
      },

      // 下拉刷新
      refresherrefresh() {
		this.getList()
      },

      // 触底加载
      scrolltolower() {

      }
    },
  }

  // #endif
  // #ifndef H5
  export default {
    data() {
      return {
        pam: {},
      }
    },
    onLoad(pam) {
      this.pam = pam;
    }
  }
  // #endif
</script>

<style lang="scss" scoped>
.list-container {
  .item {
    background: #ffffff;
    margin-top: 20rpx;
    padding: 30rpx;
    .title {
      font-weight: 500;
    }
    .row {
      display: flex;
      margin-top: 20rpx;
      .label {
        flex-shrink: 0;
        font-size: 28rpx;
        color: $sec-font;
        width: 130rpx;
      }
      .value {
        font-size: 28rpx;
		display: flex;
      }
    }
	.fun {
	  flex-shrink: 0;
	  display: flex;
	  align-items: center;
	  padding: 0 20rpx;
	
	  .iconfont {
	    color: $theme-color;
	    margin-right: 6rpx;
	  }
	
	  .text {
	    font-size: 28rpx;
	    color: $theme-color;
	  }
	}
  }
}
</style>
