<template>
  <div class="app-main app-content">
    <app-swiper
      :list="ad"
      @detail="adDetailFn"
    />
    <div class="shop-wrap">
      <div class="shop-tit">{{ shop.name }}</div>
      <div>{{ shop.introduction }}</div>
    </div>
    <div class="list-content">
      <tui-list-view class="tui-list-view">
        <tui-list-cell
          :lineLeft="false"
          :lineRight="false"
          padding="26rpx 30rpx 26rpx 0"
          class="tui-list"
        >
          <div class="list-wrap">
            <div class="list-label">营业时间</div>
            <div class="list-val">{{ shop.openTime || '暂无' }}</div>
          </div>
        </tui-list-cell>
        <tui-list-cell
          @click="phoneCall"
          :lineLeft="false"
          :lineRight="false"
          padding="26rpx 30rpx 26rpx 0"
          class="tui-list"
        >
          <div class="list-wrap">
            <div class="list-label">联系电话</div>
            <div class="list-val">{{ shop.telephone || '暂无' }}</div>
          </div>
          <div class="list-icon">
            <i
              class="iconfont iconditu"
              style="font-size:36rpx;"
            ></i>
          </div>
        </tui-list-cell>
        <tui-list-cell
          @click="goNavBtn"
          :lineLeft="false"
          :lineRight="false"
          padding="26rpx 30rpx 26rpx 0"
          class="tui-list"
        >
          <div class="list-wrap">
            <div class="list-label">门店地址</div>
            <div class="list-val">{{ shop.fullAddress || '暂无' }}</div>
          </div>
          <div class="list-icon">
            <i
              class="iconfont icondianhua"
              style="font-size:36rpx;"
            ></i>
          </div>
        </tui-list-cell>
      </tui-list-view>
    </div>
    <!-- <app-footer :activeIndex="2" /> -->
    <app-activily-coupon
      :show.sync="activeCoupon"
      :info="newUserGift"
      :introUserId="option.introUserId"
    />
    <tab-bar :current="3" ></tab-bar>
  </div>
</template>

<script>
// import AppFooter from '@/components/app-footer'
import TuiListView from "@/components/plugin/list-view";
import TuiListCell from "@/components/plugin/list-cell";
import AppSwiper from "@/components/app-swiper";
import AppActivilyCoupon from "@/components/module/app-activily-coupon";
import { getShopUser } from "@/utils/auth";
import { getShop } from "@/api/common";
import { share } from "@/mixins";
export default {
  name: "category",
  components: {
    // AppFooter,
    AppSwiper,
    TuiListView,
    TuiListCell,
    AppActivilyCoupon
  },
  mixins: [share],
  data () {
    return {
      data: {},
      ad: [],
      shop: {},
      // 新人领券
      newUserGift: {},
      activeCoupon: false,
      currentTabIndex: 3
    };
  },
  onLoad (option) {
    // this.init()
  },
  onShow () {
    uni.hideTabBar();
  },
  methods: {
    init () {
      this._detail();

      // #ifdef H5
      // 微信二次分享
      let href = window.location.href;
      if (href.indexOf("from=singlemessage") > 0) {
        location.href = `${this.$constant.formal
          }/#/pages/home/shop${this.$util.parse(this.option)}`;
        return false;
      }
      // #endif

      getShopUser().then(res => {
        // 设置分享
        let shareParams = {
          title: `${res.name}`, // 分享标题
          desc: "这家店不错推荐给你", // 分享内容
          imgUrl: "",
          // #ifdef H5
          pagePath: `${window.location.protocol}//mall.${this.$constant.firstHost}.com/#/pages/home/shop?account=${res.sjId}&introUserId=${res.id}`,
          // #endif
          // #ifndef H5
          pagePath: `/pages/home/shop?account=${res.sjId}&introUserId=${res.id}`
          // #endif
        };
        this.jweixinFn(shareParams);
      });
    },
    _detail () {
      let form = {};
      if (this.option.introUserId) {
        form.introUserId = this.option.introUserId;
      }
      getShop(form).then(res => {
        this.data = res.data;
        if (this.$util.isEmpty(res.data)) return false;
        this.ad = res.data.ad.map(e => {
          e.img = e.adImgUrl;
          return e;
        });
        console.log('this.ad', JSON.stringify(this.ad))
        this.shop = res.data.shop;
        if (!this.$util.isEmpty(res.data.newUserGift)) {
          this.newUserGift = res.data.newUserGift;
          this.activeCoupon = true;
        }
      });
    },
    // operate
    adDetailFn (item) {
      // #ifdef H5
      location.href = item.url;
      // #endif
      // #ifndef H5
      // #endif
    },
    phoneCall () {
      uni.makePhoneCall({
        phoneNumber: this.shop.telephone
      });
    },
    goNavBtn () {
      if (!this.shop.shopLat || !this.shop.shopLong) {
        this.$msg("即将开通...");
        return false;
      }
      uni.openLocation({
        latitude: parseFloat(this.shop.shopLat),
        longitude: parseFloat(this.shop.shopLong),
        name: this.shop.shopCity || "",
        address: this.shop.shopFullAddress || ""
      });
    },
    tabClick (index) {
      this.currentTabIndex = index
    }
  }
};
</script>

<style lang="scss" scoped>
.shop-wrap {
  padding: 40px 20px;
  color: $fontColor3;
  background-color: #fff;
  margin-bottom: 20px;
  .shop-tit {
    font-size: 38px;
    color: #333;
    font-weight: 600;
    margin-bottom: 20px;
  }
}
.list-content {
  background-color: #fff;
  .tui-list {
    width: calc(100% - 20px);
    @include disFlex(center, space-between);
    // padding-left: 0 !important;
    margin-left: 20px;
    .list-wrap {
      width: calc(100% - 40px);
      @include disFlex(center, flex-start);
      color: $fontColor3;
      .list-label {
        width: 150px;
        color: #333;
        // margin-right: 40px;
      }
      .list-val {
        width: calc(100% - 150px);
      }
    }
    .list-icon {
      margin-right: 10px;
      .iconfont {
        color: $mainColor;
        font-weight: bold;
      }
    }
  }
}
</style>
