<template>
	<view class="content">

		<view class="content_top">
			<!--选项卡滑动切换-->
			<cxNavTitle :tabs="tabs" :activeItem="activeItem" @tabClick="tabClick" :show='false'></cxNavTitle>
		</view>
		<!-- 审核通过 打折的拒绝、同意功能 ，调货不需要功能 -->
		<view class="content-content" v-for="(item,i) in list" :key="i" @click="nav(item)">

			<view class="content-one">
				<view class="content-one-img">
					<image src="@/static/images/bg2.png" mode="aspectFit"></image>
				</view>
				<view class="content-one-txt">
					<view class="one-txt-a">
						{{item.content}}
					</view>
					<view class="one-txt-b">
						委托周期:{{item.day}}
					</view>
				</view>
			</view>



			<view class="content-two_one" v-if="item.type==1">

				<view class="content-two-edita" @click="soldEdit">
					待处理
				</view>

				<view class="contentgn">
					<view class="contentgn_a">
						处理
					</view>
					<span></span>
					<view class="contentgn_b">
						详情
					</view>
				</view>
			</view>
			<view class="content-two_oneq" v-if="item.type==2">


				<view class="content-two-editb" @click="soldEdit">
					已接受
				</view>

				<view class="contentgn">
					<view class="contentgn_a">
						结束委托
					</view>
					<span></span>
					<view class="contentgn_b">
						详情
					</view>
				</view>
			</view>
			<view class="content-two_one" v-if="item.type==3">


				<view class="content-two-editc" @click="soldEdit">
					已拒绝
				</view>
				<view class="contentgn">
					<view class="contentgn_a">
						删除
					</view>
					<span></span>
					<view class="contentgn_b">
						详情
					</view>
				</view>
			</view>
			<view class="content-two_one" v-if="item.type==4">


				<view class="content-two-editd" @click="soldEdit">
					已完成
				</view>
				<view class="contentgn">
					<view class="contentgn_a">
						删除
					</view>
					<span></span>
					<view class="contentgn_b">
						详情
					</view>
				</view>
			</view>
		</view>

		<view v-if="orderList.length == 0 && this.where.page > 1">
			<emptyPage title="暂无订单~"></emptyPage>
		</view>
		<uni-popup ref="bindmobile" type="center" @click="close">

			<view class="" style="position: relative;">
				<view class="entrust">
					<view class="entrust_close" @click="close">
						<image src="@/static/images/wt_close.png" mode=""></image>
					</view>
					<view class="entrust_bg">
						<view class="entrust_bg-content">
							<view class="bg-content-a">
								委托申请处理
							</view>
							<view class="bg-content-b">
								结算周期: <span>30天</span>


							</view>
							<view class="bg-content-c">
								利息比例: <span>0.05%</span>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import cxNavTitle from '@/components/cx-navTitle.vue'
	import emptyPage from '@/components/emptyPage.vue';
	export default {
		components: {
			cxNavTitle,
			emptyPage
		},
		data() {
			return {
				activeItem: "tabOne",
				tabTitle: "",
				orderList: [],
				where: {
					page: 1,
					limit: 10
				},
				tabs: [{
						name: "tabOne",
						label: '待处理',
						type: '1'
					},
					{
						name: "tabTwo",
						label: '已接受',
						type: '2'
					},
					{
						name: "tabThree",
						label: '已拒绝',
						type: '3'
					},

				],
				list: [{
						content: '张三生产资料供销供应链',
						day: 10,
						type: 1

					},
					{
						content: '张三生产资料供销供应链',
						day: 10,
						type: 2

					},
					{
						content: '张三生产资料供销供应链',
						day: 10,
						type: 3

					},
					{
						content: '张三生产资料供销供应链',
						day: 10,
						type: 4

					}
				]
			}
		},
		onLoad() {
			this.tabTitle = this.tabs[0].name
			//有时进入页面需要获取默认的第一个标签做逻辑判断 -- 如下:
			console.log(this.tabs[0])

		},
		mounted() {
			this.$refs.bindmobile.open()
		},
		methods: {
			nav(item){
			uni.navigateTo({
				url:'/pages/commissionedSales/delegation_details/index'
			})	
			},
			tabClick(e) { //点击获取当前标签数据 
				this.activeItem = e.name; //当前class类名 
				this.tabTitle = e.name; //当前选的标签名
			},
			//管理弹窗
			close() {
				console.log('1111111')
				this.$refs.bindmobile.close()
			},
			// 已售出 编辑
			soldEdit() {
				console.log('111111')
				this.$refs.bindmobile.open()




			},
			//待审核 删除
			pendingDeletion() {

			},
			//待审核 编辑
			editReviewe() {

			},
			// 审核未通过 删除
			auditDelete() {

			},

			// 审核未通过 编辑
			auditEdit() {

			},
			//审核通过 拒绝
			passDelete() {

			},
			//审核通过 同意
			passagree() {

			}
		}
	}
</script>

<style lang="scss" scoped>
	.content_top {
		background-color: #FFFFFF;
	}


	.content_top {

		width: 100%;
	}

	.content-content {

		margin-top: 21rpx;
		background: #FFFFFF;
		padding: 0 28rpx;
		padding-top: 28rpx;
		background: #FFFFFF;
		position: relative;
		display: flex;
		justify-content: space-between;


		.content-one {
			display: flex;

			padding-bottom: 23rpx;

			.content-one-img {
				width: 148rpx;
				height: 148rpx;
				margin-right: 28rpx;
				border: 1px solid;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.content-one-txt {


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

				.one-txt-b {
					display: flex;
					margin-top: 30rpx;

					.txt-b-a {
						font-size: 32rpx;
						font-family: SF Pro Display-Medium, SF Pro Display;
						font-weight: 500;
						color: #F84221;
						margin-right: 74rpx;
					}

					.txt-b-b {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #333333
					}
				}

			}

		}

		.content-two_oneq {
			position: absolute;
			right: 20rpx;
			text-align: right;

			.content-two-edita {

				font-size: 32rpx;
				font-weight: 500;
				color: #F84221;

			}

			.content-two-editb {

				font-size: 32rpx;
				font-weight: 500;
				color: #FE9A10;

			}

			.content-two-editc {

				font-size: 32rpx;
				font-weight: 500;
				color: #20A162;

			}

			.content-two-editd {

				font-size: 32rpx;
				font-weight: 500;
				color: #999999;

			}

			.contentgn {

				display: flex;
				justify-content: space-between;
				margin-top: 47rpx;

				.contentgn_a {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #F84221;
					margin-right: 10rpx;
				}

				span {
					width: 0px;
					height: 30rpx;
					opacity: 1;

					margin-top: 10rpx;
					border: 2rpx solid #CCCCCC;

				}

				.contentgn_b {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #999999;
					margin-left: 10rpx;
				}
			}


		}

		.content-two_one {



			text-align: right;

			.content-two-edita {

				font-size: 32rpx;
				font-weight: 500;
				color: #F84221;

			}

			.content-two-editb {

				font-size: 32rpx;
				font-weight: 500;
				color: #FE9A10;

			}

			.content-two-editc {

				font-size: 32rpx;
				font-weight: 500;
				color: #20A162;

			}

			.content-two-editd {

				font-size: 32rpx;
				font-weight: 500;
				color: #999999;

			}

			.contentgn {

				display: flex;
				justify-content: space-between;
				margin-top: 47rpx;

				.contentgn_a {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #F84221;
					margin-right: 10rpx;
				}

				span {
					width: 0px;
					height: 30rpx;
					opacity: 1;

					margin-top: 10rpx;
					border: 2rpx solid #CCCCCC;

				}

				.contentgn_b {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #999999;
					margin-left: 10rpx;
				}
			}
		}


	}

	.entrust {

		width: 694rpx;
		height: 676rpx;

		.entrust_close {
			width: 44rpx;
			height: 44rpx;

			image {
				width: 100%;
				height: 100%;
			}
			z-index: 99999;
			position: absolute;
			right: 0;
		}

		.entrust_bg {
			width: 694rpx;
			height: 676rpx;
			background: url('@/static/images/wtbg3.png') no-repeat;
			background-size: 100% 100%;
			position: relative;

			.entrust_bg-content {
				position: absolute;

				top: 284rpx;

				.bg-content-a {
					margin-left: 242rpx;
					font-size: 35rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				.bg-content-b {
					margin-left: 35rpx;
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
					margin-top: 32rpx;

					span {
						font-size: 32rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #F84221;
						margin-left: 18rpx;
					}
				}

				.bg-content-c {
					margin-left: 35rpx;
					font-size: 35rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
					margin-top: 32rpx;

					span {
						font-size: 32rpx;
						font-family: PingFang SC-Medium, PingFang SC;
						font-weight: 500;
						color: #F84221;
						margin-left: 18rpx;
					}
				}
			}

		}
	}
</style>