<template>
	<view @click="ejectOpen=false" style="height: 100vh;display: flex;flex-direction: column;">
		<topBar height="343rpx" title="分发列表">
			<view slot="coment">
				<view class="header_seach">
					<view class="header_seach_seach">
						<view class="seach_input">
							<uni-easyinput :candidate='candidate' :ejectOpen='ejectOpen' @ejectFn='ejectFn'
								:letfText='letfText' confirmType='search' @confirm='seachFn'
								placeholder-style="color:#bbbbbb;font-weight: 100;" v-model="seachValue"
								:placeholder="letfText=='企业'?'企业名,企业ID':'司机姓名,司机手机号'" @iconClick="onClick">
							</uni-easyinput>
						</view>
						<button @tap='jump(2)' class="header_seach_butten">
							<uni-icons type="plusempty" size="20" color="#bbbbbb"></uni-icons>
							<view>新增</view>
						</button>
					</view>
					<view class="Navigation">
						<view @tap="seleFn(item);seleindex=index"
							:class="seleindex==index?'navigation_seleitem':'navigation_item'"
							v-for="(item,index) in navigation">
							{{item.text}}
							<uni-icons :animation="animationData" class="icoon" v-if="index==0" type="refreshempty"
								style="margin-left: 10rpx;" size="15" color="#bbbbbb"></uni-icons>
						</view>
					</view>
				</view>
			</view>
		</topBar>
		<view style="flex: 1;overflow: hidden;">
			<scroll-view v-if="listData.length!=0" style="height: 100%;" scroll-y="true" @scrolltolower='scrolltolower'>
				<view v-for="(item,index) in listData" class="form_body">
					<view @tap="jump(1,item)" class="form_body_item">
						<view v-if="item.auditMark==0" class="leftTip"></view>
						<view class="form_body_item_body">
							<view class="form_body_item_body_header">
								<view class="samll_txext">
									<image style="width: 28rpx; height: 29rpx; margin-right: 4rpx;"
										src="@/static/fygs.png"></image>
									分油公司
								</view>
								<view class="samll_txext">
									<image v-if="item.disTagType=='SUBCOMPANY'"
										style="width: 28rpx; height: 29rpx;margin-right: 4rpx;" src="@/static/fygs.png">
									</image>
									<image v-if="item.disTagType!='SUBCOMPANY'"
										style="width: 28rpx; height: 29rpx;margin-right: 4rpx;" src="@/static/jsf.png">
									</image>
									接收方
								</view>
							</view>
							<view class="form_body_item_body_content" style="">
								<view class=".form_body_item_body_content_left" style="">
									{{item.disCompanyName}}
								</view>
								<view style="text-align: center;flex: 1;">
									<image v-if="item.disType==1" class="form_body_item_img" style=""
										src="@/static/fy.png"></image>
									<image v-if="item.disType==-1" class="form_body_item_img" style=""
										src="@/static/qh.png"></image>
									<view class="item_price" style="font-size: 24rpx;">{{item.disAmount}}元</view>
								</view>
								<view class="form_body_item_body_content_right" style="">
									<text>{{ item.disTagType=='SUBCOMPANY'?item.companyName?item.companyName:'未设置':item.nickName?item.nickName:'未设置'}}</text>
									<view class="compay_tip">
										{{item.disTagType=='ESELF_SUPPORT'?'自营司机':item.disTagType=='OUTSIDE'?'外请司机':'子公司'}}
									</view>
								</view>
							</view>
						</view>
						<view class="form_body_item_footer">
							<view>{{item.id}}</view>
							<view style="display: flex; align-items: center; ">
								<view
									:style="{background:item.auditMark==0?'#E9CF31':item.auditMark==1?'#17A00E':'#EC4645'}"
									class="yuan"></view>
								{{item.auditMark==0?'待审核':item.auditMark==1?'审核成功':'审核失败'}}
							</view>
						</view>
					</view>
				</view>
			</scroll-view>
			<view v-if="listData.length==0"
				style="width: 100vw; height: 100%; display: flex;align-items: center;justify-content: center;">
				<image src="@/static/qx.png" style="width: 536rpx; height: 399rpx;"></image>
			</view>
		</view>
		<popup :show="showPopup" @confirmFn='confirmFn' @closeFn='closeFn' :butten='butten' v-model="iShow.examine">
			<view slot="coment">
				<view class="examine_popup_body">
					<view class="examine_popup_header">
						<view class="examine_popup_header_top">
							<view class="examine_popup_header_title">分发详情</view>
							<view
								:style="{background:typeBackground(seledata.auditMark),color:typeColor(seledata.auditMark)}"
								class="listCard_header_Type">
								<view :style="{background:typeColor(seledata.auditMark)}" class="garden"></view>
								<text>{{seledata.auditMark|typeText}}</text>
							</view>
						</view>
						<view class="orderNumber">
							{{seledata.id||'--'}}
						</view>
					</view>
					<view class="information_item">
						<view class="information_item_label">分油公司</view>
						<view class="information_item_value">{{seledata.disCompanyName||'--'}}</view>
						<view class="orderNumber">
							{{seledata.disCompanyId||'--'}}
						</view>
					</view>
					<view class="examine_popup_orderType">
						<image style="width: 60rpx;height: 50rpx;" class="form_body_item_img" src="@/static/fy.png">
						</image>
						<view class="examine_popup_orderType_text">{{ Number(seledata.disAmount).toFixed(2)||'--' }}
						</view>
					</view>
					<view class="information_item">
						<view class="information_item_label">子公司</view>
						<view class="information_item_value">{{seledata.companyName||'--'}}</view>
						<view class="orderNumber">
							{{seledata.companyId||'--'}}
						</view>
					</view>
					<view style="margin-top: 20rpx;" class="information_item_other">
						<view class="information_item_other_value">
							{{seledata.createUserName||'暂无'}}({{seledata.createUser||'--'}}) <br />
							{{seledata.createTime||'--'}}
						</view>
						<view class="information_item_other_label">申请信息</view>
					</view>
					<view class="information_item_other">
						<view class="information_item_other_value">
							{{seledata.auditUserName||'暂无'}}({{seledata.auditUser||'暂无'}}) <br />
							{{seledata.auditTime||'--'}}
						</view>
						<view class="information_item_other_label">审核信息</view>
					</view>

					<!--	<view>
						<view class="company_msg">
							<text class="samll_txext">公司名</text>
							<text class="company_msg_content">{{seledata.disCompanyName}}</text>
						</view>
						<view class="company_msg">
							<text class="samll_txext">公司编号</text>
							<text>{{seledata.disCompanyId}}</text>
						</view>
					</view>
					<view style="position: relative; margin-top: 38rpx; margin-bottom: 33rpx;">
						<view
							style=" position: relative; left: calc(50% - 35rpx); display: flex;align-items: center; width: fit-content;">
							<image v-if="seledata.disType==1" style="width: 71rpx; height: 80rpx;" src="@/static/fys.png"></image>
							<image v-if="seledata.disType==-1" style="width: 71rpx; height: 80rpx;" src="@/static/sqb.png"></image>
							<text class="large_text" style="margin-left: 32rpx;">{{seledata.disAmount}}元</text>
						</view>
					</view>
					<view>
						<view class="company_msg">
							<text class="samll_txext">{{seledata.disTagType=='SUBCOMPANY'?'公司名':'司机姓名'}}</text>
							<text
								class="company_msg_content">{{ seledata.disTagType=='SUBCOMPANY'?seledata.companyName?seledata.companyName:'未设置':seledata.nickName?seledata.nickName:'未设置'}}</text>
						</view>
						<view class="company_msg">
							<text class="samll_txext">{{seledata.disTagType=='SUBCOMPANY'?'公司编号':'司机编号'}}</text>
							<text>{{ seledata.disTagType=='SUBCOMPANY'?seledata.companyId:seledata.customerId}}</text>
						</view>
					</view>-->
				</view>
			</view>
		</popup>
	</view>
</template>

<script>
	import oilDistribution from '@/api/oilDistribution'
	import topBar from '@/components/topbar'
	import popup from '@/components/customPopup'
	export default {
		components: {
			topBar,
			popup
		},
		data() {
			return {
				showPopup: {
					img: false,
					footer: false
				},
				animationData: null,
				seledata: {},
				seachValue: '',
				butten: {
					colse: '不通过',
					confirm: '通过',
					coloseBg: '#EC4645',
					coloseColor: '#FFFFFF',
					confirmBg: '',
					confirmColor: ''
				},
				iShow: {
					examine: false
				},
				companyName: '',
				ejectOpen: false,
				letfText: '企业',
				candidate: ['企业', '个人'],
				getData: {
					pageSize: 15,
					currentPage: 1,
					params: {
						disType: '',
						companyName: '',
						nickName: '',
						auditMark: 2,
					},
					sorted: {
						createTime: "desc"
					},
					columns: [],
					totalCount: 1,
					totalPage: 1
				},
				styles: {},
				seleindex: 0,
				navigation: [{
						text: '全部',
						index: ''
					},
					{
						text: '分油',
						index: 1
					},
					{
						text: '圈回',
						index: -1
					}
				],
				listData: []
			}
		},
		onPullDownRefresh() {
			//下拉的生命周期
			this.getData.currentPage = 1
			this.getList()
			console.log('下拉的生命周期')
		},
		onLoad() {
			let that = this
			this.styles = uni.getMenuButtonBoundingClientRect()
			uni.$on('company', function(e) {
				let routes = getCurrentPages();
				let routerIndex = routes[(routes.length - 2)].$page.fullPath.indexOf('?') != -1 ?
					routes[(routes.length - 2)].$page.fullPath.split('?')[0].split('/')[routes[(routes.length - 2)]
						.$page.fullPath.split('?')[0].split('/').length - 1] :
					routes[(routes.length - 2)].$page.fullPath.split('/')[routes[(routes.length - 2)].$page
						.fullPath.split('/').length - 1]
				console.log(routes, routerIndex, '获取当前打开过的页面路由数组')
				// if (routerIndex !== 'index') return
				// if (e) {
				// 	({
				// 		id: that.getData.params.companyId,
				// 		name: that.companyName
				// 	} = e);
				// 	console.log(that.getData)
				// } else {
				// 	that.getData.params.companyId = ''
				// 	that.companyName = ''
				// }
			})
		},
		onShow() {
			this.getList();
		},
		filters: {
			typeText: function(e) {
				switch (Number(e)) {
					case 0:
						return '等待审核'
					case 1:
						return '审核通过'
					case -1:
						return '审核失败'
					default:
						return '---'
				}
			},
		},
		methods: {
			typeColor: function(e) {
				console.log(e, '-----')
				switch (Number(e)) {
					case 0:
						return '#E8CD30'
					case 1:
						return '#17A00E'
					case -1:
						return '#EC4545'
					default:
						return ''
				}
			},
			typeBackground: function(e) {
				switch (Number(e)) {
					case 0:
						return '#E8CD3026'
					case 1:
						return '#17A00E26'
					case -1:
						return '#EC454526'
					default:
						return ''
				}
			},
			animationFns() {
				console.log('恢复动画')
				var animation = uni.createAnimation({
					duration: 0,
					timingFunction: 'ease',
				})
				this.animation = animation
				this.animation.rotate(0).step()
				this.animationData = this.animation.export()
			},
			rotateFn() {
				var animation = uni.createAnimation({
					duration: 1000,
					timingFunction: 'ease',
				})
				this.animation = animation
				this.animation.rotate(360).step()
				this.animationData = this.animation.export()
				setTimeout(() => {
					this.animationFns()
				}, 1000)
			},
			confirmFn() {
				let data = {
					id: this.seledata.id,
					auditMark: 1,
					auditSource: 'OMS-MINIAPP'
				}
				oilDistribution.auditOms(data).then(res => {
					if (res.code !== 20000) return
					uni.showToast({
						title: '审核成功',
						icon: 'none'
					})
					this.iShow.examine = false
					this.seledata.auditMark = 1
				})
				console.log('确定回掉')
			},
			closeFn() {
				let data = {
					id: this.seledata.id,
					auditMark: -1,
					auditSource: 'OMS-MINIAPP'
				}
				oilDistribution.auditOms(data).then(res => {
					if (res.code !== 20000) return
					uni.showToast({
						title: '审核成功',
						icon: 'none'
					})
					this.iShow.examine = false
					this.seledata.auditMark = -1
				})
				console.log('失败回调')
			},
			ejectFn(e) {
				this.letfText = e
				console.log(e)
			},
			scrolltolower() {
				this.getData.currentPage += 1
				console.log('触底了')
				this.getList()
			},
			seachFn() {
				if (this.letfText == '企业') {
					this.getData.params.nickName = ''
					this.getData.params.companyName = this.seachValue
				} else {
					this.getData.params.nickName = this.seachValue
					this.getData.params.companyName = ''
				}
				this.getData.currentPage = 1
				this.getList()
			},
			getList() {
				oilDistribution.getByPageOms(this.getData).then(res => {
					if (res.code !== 20000) return
					if (res.data.list.length == 0) {
						uni.showToast({
							title: '没有数据了哦',
							icon: 'none'
						})
					}
					if (this.getData.currentPage !== 1) {
						this.listData = this.listData.concat(res.data.list);
						return
					}
					this.listData = res.data.list
				})
			},
			jump(e, item) {
				switch (e) {
					case -1:
						uni.navigateBack()
						break;
					case 0:
						uni.navigateTo({
							url: "../company/company?jsData=" + JSON.stringify(this.companyName)
						})
						break;
					case 1:
						this.seledata = item
						this.iShow.examine = true
						if (item.auditMark == 0) {
							this.showPopup.footer = true
						} else {
							this.showPopup.footer = false
						}
						break;
					case 2:
						if (uni.getStorageSync('user').authList.includes('distributeReverse:info:add')) {
							uni.redirectTo({
								url: "../distribute/distribute",
								fail(E) {
									console.log(e)
								}
							})
						} else {
							uni.showToast({
								title: '暂无权限请联系管理员',
								icon: 'none'
							})
						}

						break;
				}
			},
			seleFn(e) {
				this.getData.currentPage = 1
				if (e.index == '') {
					switch (this.getData.params.auditMark) {
						case 2:
							this.getData.params.auditMark = 0
							this.navigation[0].text = '等待'
							break;
						case 0:
							this.getData.params.auditMark = 1
							this.navigation[0].text = '成功'
							break;
						case 1:
							this.getData.params.auditMark = -1
							this.navigation[0].text = '失败'
							break
						case -1:
							this.getData.params.auditMark = 2
							this.navigation[0].text = '全部'
							break;
					}
					if (this.getData.params.disType !== '') {
						this.getData.params.disType = ''
						this.getData.params.auditMark = 2
						this.navigation[0].text = '全部'
					}
					this.rotateFn()
				} else {
					this.getData.params.auditMark = 2
					this.navigation[0].text = '全部'
					this.getData.params.disType = e.index
				}
				this.getList()
			},
			onClick() {
				this.ejectOpen = !this.ejectOpen
				console.log('点击图标事件')
			}
		}
	}
</script>

<style>
	@import url("./popup.css");

	.icoon :active {
		color: #007AFF;
	}

	.yuan {
		width: 13rpx;
		height: 13rpx;
		background: #E9CF31;
		border-radius: 50%;
		margin-right: 5rpx;
	}

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

	.company_msg_content {
		max-width: 330rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		text-align: end;
	}

	.examine_popup_body {
		padding: 0 47rpx;
		margin: 33rpx 0;
	}

	.company_msg {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
	}

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

	.form_body_item_body_content_right {
		/* max-width: 215rpx; */
		text-align: -webkit-right;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		flex: 1;
	}

	.form_body_item_body_content_left {
		/* max-width: 215rpx; */
		text-align: left;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		flex: 1;
	}

	.form_body_item_img {
		width: 80rpx;
		height: 70rpx;
	}

	.form_body_item_body_content {
		display: flex;
		justify-content: space-between;
		width: 100%;
		margin-top: 15rpx;
		padding-bottom: 14rpx;
	}

	.form_body_item_body_header {
		display: flex;
		justify-content: space-between;
		width: 100%;
	}

	.samll_txext {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #999999;
		display: flex;
		align-items: center;

	}

	.leftTip {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		background-color: #E9CF31;
		width: 10rpx;
	}

	.compay_tip {
		/* width: 94rpx; */
		/* height: 36rpx; */
		background: #F1F1F1;
		margin-top: 18rpx;
		color: #BBBBBB;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		/* margin-bottom: 14rpx; */
		width: 130rpx;
		padding: 10rpx;

	}

	.seach_input {
		background-color: #FFFFFF;
		border-radius: 12rpx;
		flex: 1;
	}

	.typeyuan {
		background-color: #17A00E;
		width: 14rpx;
		height: 14rpx;
		border-radius: 50px;
		margin-right: 6rpx;
	}

	.seletypeyuan {
		background-color: red;
		width: 14rpx;
		height: 14rpx;
		border-radius: 50px;
		margin-right: 6rpx;
	}

	.is-input-border {
		border: 0px !important;
	}

	page {
		background-color: #F0F2FF;
	}

	.form_body_item_footer {
		display: flex;
		color: #BBBBBB;
		font-size: 22rpx;
		justify-content: space-between;
		/* margin-top: 15rpx; */
		align-items: center;
		flex: 1;
		padding: 26rpx 0;
	}

	.form_body_item_body {
		display: flex;
		border-bottom: 1rpx solid #F0F0F0;
		/* padding-bottom: 14rpx; */
		flex-wrap: wrap;
	}

	.form_body_item {
		min-height: 267rpx;
		background: #FFFFFF;
		box-shadow: 0px 3px 9px 0px rgba(88, 88, 88, 0.2);
		border-radius: 12rpx;
		font-size: 28rpx;
		padding: 20rpx;
		display: flex;
		flex-direction: column;
		padding-bottom: 0;
		position: relative;
		overflow: hidden;
	}

	.form_body {
		width: 100vw;
		padding: 0 10px;
		margin-top: 40rpx;
		box-sizing: border-box;
	}

	.navigation_seleitem {
		width: 150rpx;
		height: 59rpx;
		background: #F0F2FF;
		border-top-left-radius: 11rpx;
		border-top-right-radius: 11rpx;
		font-size: 26rpx;
		color: #333333;
		display: flex;
		justify-content: center;
		align-items: center;
		transition: all 0.3s;
		position: relative;
		bottom: -2px;
	}

	.navigation_item {
		width: 150rpx;
		height: 59rpx;
		border-top-left-radius: 11rpx;
		border-top-right-radius: 11rpx;
		font-size: 26rpx;
		color: #F0F2FF;
		display: flex;
		justify-content: center;
		align-items: center;
		transition: all 0.3s;
		bottom: -2px;
	}

	.Navigation {
		display: flex;
		position: absolute;
		bottom: 0px;
		transition: all .5s;
	}

	.header_seach_butten {
		font-size: 24rpx !important;
		display: flex !important;
		align-items: center !important;
		margin: 0 !important;
		flex-shrink: 1;
		margin-left: 9rpx !important;
		background: #FFFFFF !important;
		justify-content: center;
	}

	.uni-easyinput__content {
		height: 80rpx;
	}

	.uni-easyinput {
		height: 80rpx;
	}

	.header_seach_seach {
		display: flex;
		height: 80rpx;
		margin-top: 23rpx;
	}

	.header_seach_title {
		display: flex;
		align-items: center;
	}

	.header_seach {
		font-size: 26rpx;
		padding: 0 10px;
	}

	.uni-navbar--border {
		border: 0px !important;
	}

	.header {
		/* background-color: #007AFF; */
		color: white;
		min-height: 403rpx;
		background: url('https://xoi-support.oss-cn-hangzhou.aliyuncs.com/星油admin小程序/sjbj.png') 100%/100%;
		/* background-size: 100% 100%; */
		position: relative;
	}

	.uni-navbar__header-btns-right {
		padding-right: 0 !important;
		width: 120rpx !important;
	}

	.top {
		height: var(--status-bar-height);
	}
</style>