<style lang="scss">
	.app-body{
		padding: 20rpx 40rpx;
	}
	.product{
		padding: 25px 0 22px 0;
		background: #fff;
		box-shadow: 0 0 11px 0 rgba(50, 50, 52, .06);
		border-radius: 11px;
		margin: 19px auto 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		.title{
			font-size: 17px;
			font-weight: 600;
			color: #1d2023;
			margin-top: 19px;
		}
		.img{
			image{
				width: 172px;
				height: 172px;
				border-radius: 11px;
			}
		}
	}
	
	.table{
		background: #fff;
		box-shadow: 0 0 11px 0 rgba(50, 50, 52, .06);
		border-radius: 11px;
		margin: 17px auto 0;
		.tr{
			padding: 1px 11px;
			display: flex;
			align-items: center;
			height: 59px;
			border-top: 1px solid #ddd;
			&:first-child{
				margin-top: 0;
			}
			.td{
				width: 50%;
				text-align: center;
				font-size: 18px;
				font-family: PingFang SC;
				font-weight: 700;
				color: #1d2023;
			}
		}
	}

</style>
<template>
	<view class="app-body">
		<view class="product fx-h fx-bc fx-ac">
			<view class="img">
				<image :src="data.pro.image" mode="aspectFill"></image>
			</view>
			
			<view class="title">{{ data.pro.nickname }}</view>
			<view class="title">艺术家:{{ data.pro.nickname }}</view>
			<view class="title">{{ utils.date('Y年m月d日',utils.strtotime(data.pro.create_time))  }}</view>
		</view>
		
		<view class="table">
			<view class="tr fx-r fx-bc fx-ac">
				<view class="td">日期</view>
				<view class="td">归属人</view>
			</view>
			
			<view class="tr  fx-r fx-bc fx-ac" v-for="item in data.data">
				<view class="td">{{ utils.date('Y-m-d',item.create_time) }}</view>
				<view class="td">{{ item.nickname }}</view>
			</view>
			
		</view>
		
	</view>
	
</template>

<script>
	import {mapState,mapMutations } from 'vuex';
	export default {
		computed: mapState(['user']),
		data() {
			return {
				id : 0,//产品ID
				data:{
					data : [],
					pro  : {}
				}
			}
		},
		onLoad(option){  
			this.id = option.proId || 0;
			this.initView();
		},
		methods: {
			/**
			 * 获取配置数据
			 */
			initView: function() {
				var that = this;
				uni.showLoading({title: '获取数据中..'});
				var post = {};
				post.id = this.id;
				this
					.request
					.post("auctionProItemHistory",post)
					.then(res=>{
						uni.hideLoading();
						if(res.code == 200) {
							this.data = res.data;
						} else {
							this.utils.showAlert({title: '系统提示',content: res.msg});
						}
					})
					.catch(err=>{
						console.log(err);
						uni.hideLoading();
						this.utils.showAlert({title: '系统提示',content: "加载失败,重新点击尝试!"});
					});
				
			},
		},
	}	
</script>