187 lines
6.9 KiB
Vue
187 lines
6.9 KiB
Vue
<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>
|