<template>
	<view class="box">
		<view class="banner">
			<image class="banner_pic" :src="info.photo" mode="" />
		</view>

		<view class="tit">{{info.shop_name}}</view>
		<view class="msg">
			<view class="msg_left">
				<view class="msg_left_1">
					<image src="https://static.hshuishang.com/kitchen/kitchen_time.png" mode="" />
					{{info.opening_time}}-{{info.closing_time}}
					<view>{{info.is_open === 1 ? '营业' :'停业'}}</view>
				</view>
				<view class="msg_left_2">
					<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="" />
					{{info.addr}}
				</view>
			</view>
			<view class="msg_right">
				<view class="msg_right1" @click="call">
					<image src="https://static.hshuishang.com/kitchen/kitchen_phone.png" mode="" />
					电话
				</view>
				<view class="msg_right2" @click="handleOptionClick">
					<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="" />
					导航
				</view>
			</view>
		</view>

		<view class="imgList">
			<image v-for="(item, index) in info.picList" :key="index" :data-pic="item" @click="headerPicClick" :src="item" mode="aspectFill" />
		</view>
		<view class="gray"></view>

		<view class="gray"></view>

		<view class="subtit">公告</view>
		<view class="subCon">{{info.presentation}}</view>
	</view>
</template>

<script>
	import { picUrl, request } from '../../../utils';
	import { apiArr } from '../../../api/communityService';
	export default {
		data() {
			return {
				id: "",
				info: ""
			}
		},
		methods: {
			async init(id) {
				const res = await request(apiArr.getGoodsDesc, 'POST', {
					shop_id: Number(id)
				})
				const newRes = {
					...res,
					photo: picUrl + res.photo
				};
				uni.setNavigationBarTitle({
					title: res.shop_name
				});
				this.info = newRes;
				
			},
			
			// 拨打电话
			call() {
				let that = this
				uni.makePhoneCall({
					phoneNumber: this.info.tel,
					fail(err) {
						console.log('取消拨打', err)
					}
				})
			},
			
			// 导航
			handleOptionClick() {
				uni.openLocation({
					latitude: Number(this.info.lat),
					longitude: Number(this.info.lng),
					name: this.info.shop_name,
				})
			},
		},
		onLoad(options) {
			this.id = options.id;
			this.init(options.id);
		}
	}
</script>

<style>
	@import url("./index.css");
</style>