<template>
	<div class="app-main app-content">
		<app-swiper />
		<div class="shop-wrap">
			<div class="shop-tit">国兰华尚</div>
			<div>花之都定期培育新物种，专门为婚庆公司提供花束，期待你的订单 为您私人定制，这个是公告！</div>
		</div>
		<div class="list-content">
			<tui-list-view title class="tui-list-view">
				<tui-list-cell @click="detail" :lineLeft="false" :lineRight="false" class="tui-list">
					<div class="list-wrap">
						<div class="list-label">营业时间</div>
						<div class="list-val">周一至周日(18:00-21:00)</div>
					</div>
				</tui-list-cell>
				<tui-list-cell @click="detail" :lineLeft="false" :lineRight="false" class="tui-list">
					<div class="list-wrap">
						<div class="list-label">联系电话</div>
						<div class="list-val">15392387653</div>
					</div>
					<div class="list-icon">
						<i class="iconfont iconditu"></i>
					</div>
				</tui-list-cell>
				<tui-list-cell @click="detail" :lineLeft="false" :lineRight="false" class="tui-list">
					<div class="list-wrap">
						<div class="list-label">门店地址</div>
						<div class="list-val">福建省厦门市湖里区蔡塘广场 -1220号</div>
					</div>
					<div class="list-icon">
						<i class="iconfont icondianhua"></i>
					</div>
				</tui-list-cell>
			</tui-list-view>
		</div>
		<!-- <app-footer :activeIndex="2" /> -->
	</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'
export default {
	name: 'category',
	components: {
		// appFooter,
		AppSwiper,
		tuiListView,
		tuiListCell
	},
	data() {
		return {}
	},
	onLoad(option) {},
	methods: {
		detail() {}
	}
}
</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 {
			@include disFlex(center, space-between);
			padding-left: 0 !important;
			margin-left: 20px;
			.list-wrap {
				width: calc(100% - 90px);
				@include disFlex(center, flex-start);
				color: $fontColor3;
				.list-label {
					width: 150px;
					color: #333;
					// margin-right: 40px;
				}
				.list-val {
					width: calc(100% - 150px);
				}
			}
			.list-icon {
				.iconfont {
					color: $mainColor;
					font-weight: bold;
				}
			}
		}
	}
</style>
