<template>
	<view class="bg-max bg-gray">
		<van-sticky>
			<view class="justify-center bg-white sh pd-px-20 mg-b-20">
				<van-icon class="top-left" name="arrow-left" @tap="goBack" />
				<view class="top-center">店铺信息</view>
			</view>
		</van-sticky>
		<view class="card" id="capture">
			<van-row gutter="12" class="pd-h-px-10" style="padding-top: 26rpx">
				<van-col span="6" >
					<van-image style="border-radius: 50%;border: 2rpx solid #DDDDDD;width: 140rpx;height: 140rpx"  radius="20rpx" :src="state.useInfo.headImg"
					/>
				</van-col>
				<van-col span="18" style="text-align: left">
					<view style="font-size: 34rpx;font-weight: bold">{{state.useInfo.storeName}}</view>
					<view style="font-size: 26rpx;margin-top: 4px"> <van-icon name="manager-o" color="#707070" size="16px" style="margin-right: 10rpx"/>{{state.useInfo.contacts}} <span style="margin: 0 16rpx;color: #DDDDDD">|</span><van-icon name="phone-o" color="#707070" size="16px" /> {{state.useInfo.contactPhone}} <span style="float: right;border-radius: 8rpx;
border: 1rpx solid #EBA926;color: #EBA926;padding: 2rpx 10rpx" @click="goPhoneBtn(state.useInfo.contactPhone)">拨打</span> </view>
				</van-col>
			</van-row>
			<van-row gutter="12" class="pd-h-px-10" style="padding-top: 26rpx">
				<view style="color: #666666;font-size: 26rpx;letter-spacing: 1rpx;margin-top: 6rpx"><van-icon name="location-o" />{{state.useInfo.areaAddress}}</view>
			</van-row>
			<!--<view  class="pd-h-px-10" style="padding-top: 40rpx;text-align: center">-->
				<!--<van-button style="width: 90%" icon="photo-o" type="primary" @click="goto('/pages/index/userCard')">店铺海报</van-button>-->
			<!--</view>-->
		</view>
	</view>
</template>

<script setup lang="ts">
    import api from "@/api";
    import {  reactive ,onMounted} from 'vue';
    import html2Canvas from "html2canvas"
    import { PageUtils } from '@/utils/utils';
    function goBack() {
        PageUtils.goBack()
    }
    const state = reactive({
        useInfo:{},
    })
    onMounted(()=>{
        getStoreInfo()
    })
    function getStoreInfo() {
        api.storeInfo({ link: uni.getStorageSync("subdomain") }).then(res=>{
            state.useInfo=res
        })
    }
    function goto(url: any) {
        url && uni.navigateTo({ url })
    }
    function goPhoneBtn(val){
        uni.makePhoneCall({
            // 手机号
            phoneNumber: val,
            // 成功回调
            success: (res) => {
            },
            // 失败回调
            fail: (res) => {
            }
        });
    }
</script>

<style lang="scss" scoped>
	.card{
		background: #ffffff;
		height: 400rpx;
		width: 100%;
	}
</style>