球星卡微信小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

446 lines
10 KiB

<template>
<view class="flex-col page">
<view class="flex-col group_4">
<view class="flex-col section_2" v-if="imageList.length > 0">
<view class="flex-row equal-division">
<image :src="item" class="equal-division-item" v-for="(item, index) in imageList" :key="index" />
</view>
</view>
<view class="flex-col section_3">
<view class="flex-row">
<text class="text_2">编号</text>
<text class="text_3">{{ details.sub_order.order_num }}</text>
</view>
<view class="flex-row group_6">
<text class="text_4">系列</text>
<text class="text_5">{{ details.sub_order.card_series }}</text>
</view>
<view class="flex-row group_7">
<text class="text_6">子系列</text>
<text class="text_7">{{ details.sub_order.sub_card_series }}</text>
</view>
<view class="flex-row group_8">
<text class="text_8">发行商</text>
<text class="text_9">{{ details.sub_order.publisher }}</text>
</view>
</view>
<view class="justify-between section_4">
<view class="flex-col">
<view class="flex-col items-center">
<view class="group_11">
<text class="text_10">居中分:</text>
<text class="text_11">{{ details.sub_order.center_s }}</text>
</view>
<view class="group_12">
<text class="text_12">边框分:</text>
<text class="text_13">{{ details.sub_order.border_s }}</text>
</view>
</view>
<view class="group_13">
<text class="text_14">表面分:</text>
<text class="text_15">{{ details.sub_order.front_s }}</text>
</view>
<view class="group_14">
<text class="text_16">签字分:</text>
<text class="text_17">{{ details.sub_order.sign_s }}</text>
</view>
<view class="group_15">
<text class="text_18">卡角分:</text>
<text class="text_19">{{ details.sub_order.corner_s }}</text>
</view>
</view>
<view class="flex-col items-center section_5">
<text class="text_20">{{ details.sub_order.total_s }}</text>
<text class="text_21">总评分</text>
</view>
</view>
<view class="flex-col section_6" v-if="$isRight(details.history)">
<view class="flex-col group_16">
<lf-table :Header="header" :Content="details.history" height="auto" width="686" :showNumber="false"></lf-table>
<!-- <view class="flex-col items-center button" @click="setClipboardData">
<text>复制拍卖链接</text>
</view> -->
</view>
</view>
</view>
</view>
</template>
<script>
import lfTable from '@/components/lf-table.vue';
export default {
components: {
lfTable
},
data() {
return {
header: [{
text: '评级',
width: 343,
key: 'title'
},{
text: '数量',
width: 343,
key: 'num'
}],
details: {},
};
},
computed: {
imageList(){
let list = [];
if(this.details.images){
list = String(this.details.images).split(',').splice(0, 2);
}
return list;
}
},
onLoad(options){
if(this.$valueType(options.data) !== 'undefined'){
this.details = JSON.parse(decodeURIComponent(options.data));
}
},
methods: {
// 复制拍卖链接 todo 暂时不用
setClipboardData(){
uni.setClipboardData({
data: '测试'
})
}
}
};
</script>
<style scoped lang="scss">
.equal-division-item {
flex: 1 1 330rpx;
border-radius: 10rpx;
width: 330rpx;
height: 396rpx;
&:nth-child(2n){
margin-left: 25rpx;
}
}
.left-text-wrapper {
width: 82rpx;
}
.page {
background-color: #f6f6f6;
width: 100%;
overflow-y: auto;
height: 100%;
}
.group_4 {
padding-top: 2rpx;
flex: 1 1 auto;
overflow-y: auto;
}
.section_2 {
padding: 40rpx 0;
background-color: rgb(255, 255, 255);
}
.section_3 {
margin-top: 30rpx;
padding: 40rpx 32rpx;
background-color: rgb(255, 255, 255);
}
.section_4 {
margin-top: 30rpx;
padding: 40rpx 34rpx;
background-color: rgb(255, 255, 255);
}
.section_6 {
margin-top: 30rpx;
padding: 0 32rpx 16rpx;
background-color: rgb(255, 255, 255);
}
.equal-division {
margin-left: 32rpx;
margin-right: 33rpx;
}
.group_6 {
margin-top: 50rpx;
}
.group_7 {
margin-top: 50rpx;
}
.group_8 {
margin-top: 50rpx;
}
.section_5 {
margin-right: 78rpx;
margin-top: 6rpx;
padding: 80rpx 0;
background-image: url('https://qxk-img.leadfyy.com/qxk_app_images/pingfenkuang.png');
background-position: 0px 0px;
background-size: 100% 100%;
background-repeat: no-repeat;
width: 306rpx;
height: 404rpx;
}
.group_16 {
padding: 40rpx 0;
}
.image_7 {
margin-left: 25rpx;
}
.text_2 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_3 {
margin-left: 92rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_4 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_5 {
margin-left: 92rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_6 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_7 {
margin-left: 60rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_8 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.text_9 {
margin-left: 60rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
white-space: nowrap;
}
.group_13 {
margin-top: 50rpx;
white-space: nowrap;
}
.group_14 {
margin-top: 50rpx;
white-space: nowrap;
}
.group_15 {
margin-top: 50rpx;
white-space: nowrap;
}
.text_20 {
color: rgb(34, 34, 34);
font-size: 120rpx;
line-height: 168rpx;
white-space: nowrap;
}
.text_21 {
margin-top: 36rpx;
color: rgb(34, 34, 34);
font-size: 28rpx;
font-weight: 500;
line-height: 40rpx;
white-space: nowrap;
}
.section_7 {
border-radius: 10rpx;
border: solid 2rpx rgb(246, 246, 246);
}
.button {
margin-top: 40rpx;
padding: 26rpx 0;
color: rgb(255, 255, 255);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
background-color: rgb(231, 162, 63);
border-radius: 10rpx;
}
.group_11 {
white-space: nowrap;
}
.group_12 {
margin-top: 40rpx;
white-space: nowrap;
}
.text_14 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
}
.text_15 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 700;
line-height: 44rpx;
}
.text_16 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
}
.text_17 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 700;
line-height: 44rpx;
}
.text_18 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
}
.text_19 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 700;
line-height: 44rpx;
}
.section_8 {
padding: 20rpx 130rpx;
color: rgb(85, 85, 85);
font-size: 28rpx;
font-weight: 500;
line-height: 40rpx;
white-space: nowrap;
background-color: rgb(246, 246, 246);
border-radius: 10rpx 10rpx 0px 0px;
}
.group_17 {
padding: 16rpx 158rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
border-bottom: solid 2rpx rgb(246, 246, 246);
}
.group_18 {
padding: 16rpx 150rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
border-bottom: solid 2rpx rgb(246, 246, 246);
}
.group_19 {
padding: 16rpx 154rpx 0 162rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
position: relative;
}
.group_20 {
margin-top: 14rpx;
padding: 18rpx 150rpx 14rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
border-top: solid 2rpx rgb(246, 246, 246);
border-bottom: solid 2rpx rgb(246, 246, 246);
}
.group_21 {
padding: 16rpx 152rpx 16rpx 164rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
border-bottom: solid 2rpx rgb(246, 246, 246);
}
.group_22 {
padding: 16rpx 134rpx 20rpx;
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 600;
line-height: 44rpx;
white-space: nowrap;
}
.text_10 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
}
.text_11 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 700;
line-height: 44rpx;
}
.text_12 {
color: rgb(119, 119, 119);
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
}
.text_13 {
color: rgb(51, 51, 51);
font-size: 32rpx;
font-weight: 700;
line-height: 44rpx;
}
.section_9 {
align-self: center;
background-color: rgb(255, 255, 255);
width: 82rpx;
height: 2rpx;
}
.text_25 {
margin-right: 6rpx;
}
.text_27 {
margin-right: 12rpx;
}
.text_35 {
margin-right: 18rpx;
}
.image_8 {
align-self: center;
width: 20rpx;
height: 22rpx;
}
.text_34 {
margin-left: 8rpx;
}
</style>