<template>
	<HeaderNav title="2023.5.3订单" :is-back="true"></HeaderNav>
	<view class="body-background" :style="{
		backgroundImage:'url('+staticImage.wallpaperBgImage+')'
		}"></view>
	<view class="app-wallpaper">
		<view class="detail-container" :style="{height:windowHeihgt-40+'px'}">
			<view class="detail-content-container">
				<view class="detail-content">
					<view class="chat-item other-chat row">
						<view class="chat-item-content  row">
							<view class="chat-avator ">
								<image mode="aspectFill" class="img" :src="user.avatar" />
							</view>
							<view class="chat-content-container ">
								<view class="chat-time">2023/06/16 13:24</view>
								<view class="chat-content">是按您预约时间上门服务吗</view>
							</view>

						</view>
					</view>

					<view class="chat-item my-chat row">
						<view class="chat-item-content  row">
							<view class="chat-content-container ">
								<view class="chat-time">2023/06/16 13:24</view>
								<view class="chat-content">是的，您按预约时间上门就可以了</view>
							</view>
							<view class="chat-avator ">
								<image mode="aspectFill" class="img" :src="user.avatar" />
							</view>
						</view>
					</view>
					<view class="chat-item other-chat row">
						<view class="chat-item-content  row">
							<view class="chat-avator  ">
								<image mode="aspectFill" class="img" :src="user.avatar" />
							</view>
							<view class="chat-content-container ">
								<view class="chat-time">2023/06/16 13:24</view>
								<view class="chat-content">好的，您家狗狗脾气如何呀</view>
							</view>
						</view>
					</view>

					<view class="chat-item my-chat row">
						<view class="chat-item-content  row">
							<view class="chat-content-container ">
								<view class="chat-time">2023/06/16 13:24</view>
								<view class="chat-content">狗狗脾气很好，不用担心</view>
							</view>
							<view class="chat-avator ">
								<image mode="aspectFill" class="img" :src="user.avatar" />
							</view>
						</view>
					</view>
				</view>
				
				<view class="detail-input-group-container">
					<view class="detail-input-group row">
						<input class="detail-input" type="text"/>
						<MzButton
							 title="发送"
							 font-color="#fff"
							 button-color="#4DC3B8"
							 button-width="auto"
							 class="detail-input-button">
						</MzButton>
					</view>
				</view>
			</view>
			<view class="detail-background-container">
				<view class="detail-background"></view>
			</view>
		</view>
	</view>
	
</template>

<script>
	import {
		imghost
	} from '../../config/host.js'
	import api from '../../utils/functions.js';
	import HeaderNav from '../../components/HeaderNav/Index.vue';
	import MzButton from '../../components/MzButton/Index.vue';
	export default {
		components: {
			HeaderNav,
			MzButton
		},
		data: {
			windowHeihgt: 1000,
			staticImage: {
				wallpaperBgImage: imghost + '/static/image/background.png',
			},
			user: {
				avatar: imghost + '/static/image/banner.png',
				nickname: '清晨的风',
				background: imghost + '/static/image/banner.png',
				sex: '女',
				phone: '15012345678',
				coupons: 221,
				id: 88685,
				birthday: '2002-05-11',
			},
		},
		onLoad() {

		},
		methods: {

		},
		onPageScroll(res) {

		},
		created() {
			this.windowHeihgt = api.navHeight().windowHeihgt;
		}
	}
</script>

<style lang="scss">
	@import './components/index.scss';
</style>