<template>
	<view class="content">
		<view class="content_top">
			<view class="content_top-one">
				<view class="content_symbol">
					<image :src="listobj.mer_avatar" mode="aspectFit"></image>
				</view>
				<view class="content_title" >
					<view class="title_one">
						{{listobj.mer_name}}

					</view>
					<view class="title_two">
						{{listobj.care_count>0?listobj.care_count:0}}人关注 {{listobj.sales>0?listobj.sales:0}}销量
					</view>
				</view>
				<view class="content_titimg">
					<image src="@/static/images/sym.png" mode="aspectFit"></image>
				</view>
			</view>
			<view view class="content_top-two">
				<view class="price">
					￥{{listobj.total_price}}
					<!-- <input type="text" :value="listobj.total_price" v-model="listobj.total_price" /> -->
				</view>

				<view class="top-two_content">
					<textarea :value="listobj.content" placeholder="" style="height: auto;" />
				</view>
				<view class="top-two_img">

					<view class="" v-for="(item,index) in listobj.image">
						<image :src="item" mode=""></image>
					</view>

				</view>
			</view>
		</view>

		<view class="content_middle">
			<view class="middle-one" v-for="(item,b) in listobj.resale" :key='b'>
				<view class="midding-img">
					<image :src="item.image" mode=""></image>
				</view>
				<view class="middle-one_text">
					<view class="one_text_a">
						{{item.store_name}}
					</view>
					<view class="one_text_b">
						￥{{item.price}}
					</view>
					<view class="one_text_c">

						<!-- <view class="">
							采购价:{{item.price}}
						</view> -->
						<view class="">
							数量: {{item.number}}
						</view>

					</view>
				</view>
			</view>


		</view>
		<view class="content_enter">
			<view class="content_enter-one">
				类型
			</view>
			<view class="content_enter-two" v-if="listobj.resale_type==1">
				调货
			</view>
			<view class="content_enter-two" v-else>
				打折
			</view>


		</view>

		<view class="content_bootm" v-if='listobj.resale'>
			<view class="content_bootm_txt" v-if='listobj.resale.length>0'>
				查看TA提到的宝贝({{listobj.resale.length}})
			</view>

			<view class="content_bootm_one" v-for="(items,i) in listobj.resale" :key='i' @click="Merchbaby(items)">
				<view class="bootm_oneimg">
					<image :src="items.image" mode=""></image>
				</view>
				<view class="" >
					{{items.store_name}}
				</view>
			</view>

		</view>

	
	</view>
</template>

<script>
	import {
		getResaleid
	} from '@/api/release.js'
	export default {


		data() {
			return {
				detail: {},
				listobj: {},
			}
		},
		onLoad(e) {
			if (e) {
				this.detail = e.key;
				this.shopdetil(this.detail)
			}


		},
		methods: {
			//商品详情
			shopdetil(id) {

				getResaleid(id).then(res => {
					if (res.data.status = 200) {
						this.listobj = res.data
					}
				})
			},

			//商品宝贝详情
			Merchbaby(item) {
				uni.navigateTo({
					url: `/pages/goods_details/index?id=${item.product_id}`
				})

			},
			prouctOrder() {
				getCommunityaddCart(this.listobj).then(res => {
					if (res.status == 200) {
						uni.navigateTo({
							url: '/pages/users/order_confirm/index?cartId=' + res.data.cart_id.toString()
						})
					}
				}).catch((err) => {
					console.log(err)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {}

	.content_top {
		padding: 21rpx 28rpx;
		background: #FFFFFF;

		.content_top-one {
			display: flex;
			border-bottom: 1rpx solid #CCCCCC;

			.content_symbol {
				width: 81rpx;
				height: 81rpx;

				image {
					width: 81rpx;
					height: 81rpx;
				}

				margin-bottom: 21rpx;
			}

			.content_title {
				margin-left: 21rpx;

				.title_one {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				.title_two {
					font-size: 25rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #999999;
				}
			}

			.content_titimg {
				width: 116rpx;
				height: 64rpx;
				margin-top: -10rpx;
				margin-left: 10rpx;

				image {
					width: 136rpx;
					height: 64rpx;
				}
			}
		}

		.content_top-two {
			.price {
				display: flex;
				margin-top: 21rpx;
				font-size: 46rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #F84221;

				input {
					font-size: 46rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #F84221
				}
			}

			.top-two_content {
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #333333;
				margin-top: 21rpx;
				margin-bottom: 21rpx;
			}

			.top-two_img {
				display: flex;
				

				view {
					width: 217rpx;
					height: 217rpx;
					border-radius: 14rpx 14rpx 14rpx 14rpx;
					margin-right: 15rpx;
				}

				image {
					width: 217rpx;
					height: 217rpx;
					border-radius: 14rpx 14rpx 14rpx 14rpx;
				}
			}
		}
	}

	.content_middle {

		.middle-one {
			background-color: #FFFFFF;
			display: flex;
			margin-top: 28rpx;
			padding: 21rpx 0;

			.midding-img {
				width: 176rpx;
				height: 176rpx;
				margin-left: 24rpx;
				margin-right: 21rpx;

				image {
					width: 176rpx;
					height: 176rpx;
				}
			}

			.middle-one_text {
				.one_text_a {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				.one_text_b {
					font-size: 35rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #F84221;
					margin-top: 11rpx;
				}

				.one_text_c {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #999999;
					margin-top: 12rpx;
					display: flex;
					justify-content: space-between;
					margin-right: 50rpx;
				}
			}

		}
	}

	.content_enter {
		height: 89rpx;
		line-height: 89rpx;
		background: #FFFFFF;
		opacity: 1;
		margin-top: 28rpx;
		display: flex;
		justify-content: space-between;
		padding: 0 20rpx;

		.content_enter-one {
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #333333;
		}

		.content_enter-two {
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #F84221;
		}
	}

	.content_bootm {

		margin-bottom: 150rpx;

		.content_bootm_txt {
			margin-top: 42rpx;
			padding-left: 28rpx;

		}

		.content_bootm_one {
			height: 112rpx;
			line-height: 112rpx;
			padding-right: 28rpx;
			background: #FFFFFF;
			display: flex;
			margin-top: 21rpx;

			.bootm_oneimg {
				width: 80rpx;
				height: 80rpx;
				margin: auto 0;
				margin-left: 28rpx;
				margin-right: 21rpx;

				image {
					width: 80rpx;
					height: 80rpx;
				}
			}

		}
	}

	.pay {
		width: 100%;
		height: 121rpx;
		line-height: 121rpx;
		background: #FFFFFF;
		position: absolute;
		bottom: 0;
		position: fixed;
		display: flex;
		justify-content: space-between;
		padding: 0 28rpx;

		.pay_tilte-a {
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;

			span {
				font-size: 42rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #F84221;
			}
		}

		.pay_tilte-b {
			width: 238rpx;
			height: 74rpx;
			line-height: 74rpx;
			text-align: center;
			background: linear-gradient(90deg, #F98649 0%, #F34E45 100%);
			border-radius: 37rpx 37rpx 37rpx 37rpx;
			opacity: 1;
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			margin: auto 0;
		}
	}

	.domain {
		width: 100%;
		height: 121rpx;
		line-height: 121rpx;
		background: #FFFFFF;
		position: absolute;
		bottom: 0;
		position: fixed;
		display: flex;
		justify-content: space-between;
		padding: 0 28rpx;

		.domain_tilte-a {
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;

			span {
				font-size: 42rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #F84221;
			}
		}

		.domain_tilte-b {
			font-size: 32rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #666666;
		}

		.domain_tilte-c {
			width: 238rpx;
			height: 74rpx;
			line-height: 74rpx;
			text-align: center;
			background: linear-gradient(90deg, #F98649 0%, #F34E45 100%);
			border-radius: 37rpx 37rpx 37rpx 37rpx;
			opacity: 1;

			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			margin: auto 0;
		}
	}
</style>