<template>
    <view class="GoodsAuthentication">
    	<view class="authenticationTop">区块链溯源码：{{info.token}}</view>
    	<!-- 商品认证 商品和服务 -->
    	<view class="authenticationItem">
    		<view class="authenticationItemTitle">商品认证</view>
    		<view class="authenticationItemcontent" v-if="info.goods">
    			<view class="authenticationItemcontentItem">
    				<view class="title">{{info.goods.type ===1?'商品名称':'项目名称'}}: </view>
    				<view class="content">{{info.goods.name || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===1">
    				<view class="title">生产批次：</view>
    				<view class="content">{{info.goods.batch || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===2" >
    				<view class="title">项目分类：</view>
    				<view class="content">{{info.goods.category || '暂无数据'}}</view>
    			</view>
    		
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===1">
    				<view class="title">规格：</view>
    				<view class="content">{{info.goods.skus[0].unit || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">数量：</view>
    				<view class="content">{{info.goods.skus[0].stock || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">售价：</view>
    				<view class="content">{{info.goods.skus[0].price || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===1">
    				<view class="title">生产日期：</view>
    				<view class="content">{{info.goods.producted_at || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" >
    				<view class="title">{{info.goods.type ===1?'保质期':'有效期'}}：</view>
    				<view class="content">{{info.goods.expiried_at || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===1">
    				<view class="title">生产厂家：</view>
    				<view class="content">{{info.goods.product_name || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" v-if="info.goods.type ===1">
    				<view class="title">生产地：</view>
    				<view class="content">{{info.goods.product_address || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" >
    				<view class="title">供应商：</view>
    				<view class="content">{{info.goods.skus[0].price || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem" >
    				<view class="title">经营许可证：</view>
    				<view class="content">{{info.goods.lisence || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem"  >
    				<view class="title">实物照片：</view>
    				<image class="img" v-if="info.goods.cover"  :src="info.goods.cover" @click="priveImg(info.goods.cover)" mode="aspectFill" />
    				<view class="content" v-else>暂无数据</view>
    			</view>
    		</view>
    	</view>
    	
    	<!-- 企业认证 （商品和服务通用） -->
    	<view class="authenticationItem">
    		<view class="authenticationItemTitle">企业认证</view>
    		<view class="authenticationItemcontent" v-if="info.certification">
    			<view class="authenticationItemcontentItem" >
    				<view class="title">企业名称：</view>
    				<view class="content">{{info.certification.name || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">企业地址：</view>
    				<view class="content">{{info.certification.address || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">统一信用代码：</view>
    				<view class="content">{{info.certification.certification.code || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">行业：</view>
    				<view class="content">{{info.certification.industry.title || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">经营范围：</view>
    				<view class="content">{{info.certification.range || '暂无数据'}}</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">联系电话：</view>
    				<u-icon name="phone-fill" v-if='info.certification.contack' @click="call(info.certification.contact)" 
    				color="#2979ff" label-color="#2979ff" label-size="26" :label='info.certification.contact' />
    				<view class="content" v-else>		 暂无数据			</view>
    			</view>
    			<view class="authenticationItemcontentItem">
    				<view class="title">营业执照：</view>
    				<image class="img"  v-if='info.certification.certification.license' :src="info.certification.certification.license"  @click="priveImg(info.certification.certification.license)" mode="aspectFill" />
    				<view class="content" v-else>暂无数据</view>
    			</view>
    		</view>
    	</view>
    	
    	<!-- 弹窗提示喽 -->
    	<u-toast ref="uToast" />
    </view>
</template>

<script>
    import { managesAttestation } from '@/apis/interfaces/goods'
    export default {
    	data() {
    		return {
    			info: ''
    		}
    	},
        created() {
            managesAttestation(this.$Route.query.id).then(res=>{
                console.log(res)
                this.info = res
            })
        },
    	methods: {}
    }
</script>

<style lang="scss" scoped>
	page {
		background-color: #F7F7F7;
	}

	.GoodsAuthentication {
		padding: 30rpx;

		.authenticationTop {
			width: 100%;
			padding: 20rpx 50rpx;
			background-color: #c82626;
			font-size: 26rpx;
			color: #fff;
			border-radius: 60rpx;
			word-break: break-all;
			text-align: center;
		}
		// 商品认证
		.authenticationItem{
			width: 100%;
			min-height: 300rpx;
			margin-top: 20rpx;
			.authenticationItemTitle{
				font-size: 30rpx;
				color: #333333;
				font-weight: 600;
				padding: 30rpx 20rpx;
			}
			.authenticationItemcontent{
				width: 100%;
				min-height: 500rpx;
				background-color: #fff;
				border-radius: 20rpx;
				border: solid rgba(200,38,0,.05) 6rpx;
				box-shadow:2rpx 2rpx 20rpx 0rpx rgba(200,38,0,.051);
				padding:10rpx 20rpx;
				.authenticationItemcontentItem{
					display: flex;
					flex-direction: row;
					align-items: flex-start;
					justify-content: flex-start;
					box-sizing: border-box;
					padding: 20rpx 0;
					font-size: 24rpx;
					.title{
						width: 180rpx;
					}
					.content{
						text-overflow: ellipsis;
						width: calc( 100% - 180rpx);
					}
					.img{
						width: 340rpx;
						height: 200rpx;
					}
				}
			}
		}
	}
</style>
