<template>
	<view class="content">
		<u-sticky bgColor="#fff" v-if="$Route.query.type != 'synthesis'">
			<view class="header-sticky">
				<u-tabs
					:list="tabs"
					:scrollable="tabScroll"
					:lineWidth="20"
					:lineHeight="4"
					:lineColor="`url(${tabsBg}) 100% 100%`"
					@click="onTab"
				></u-tabs>
			</view>
		</u-sticky>
		<!-- 列表 -->
		<view class="list" v-if="orderArr.length > 0">
			<block v-for="(item, index) in orderArr" :key="index">
				<!-- 年费单 -->
				<services-block
					v-if="$Route.query.type === 'service'"
					:no="item.order_no"
					:status="item.status"
					:user="item.user"
					:time="item.created_at"
					:service="item.service"
					:price="item.total"
					:lawyer="item.lawyer || {name: ''}"
					:isSelf="item.is_self"
					:payStatus="item.pay_status"
					:can="item.can"
					@cancel="onCancel"
					@info="onInfo"
					@pay="onPay"
					@sing="onSing"
					@diff="onDiff"
					@callPhone="onCallPhone"
				/>
				<!-- 咨询单 -->
				<synthesis-block
					v-if="$Route.query.type === 'synthesis'"
					:no="item.order_no"
					:user="item.user"
					:time="item.created_at"
					:synthesis="item.synthesis"
					:lawyer="item.lawyer || {name: ''}"
					:isSelf="item.is_self"
					:payStatus="item.pay_status"
					@info="onInfo"
					@pay="onPay"
					@cancel="onCancel"
				/>
				<!-- 委托单 -->
				<entrust-block
					v-if="$Route.query.type === 'entrust'"
					:no="item.order_no"
					:entrust="item.entrust"
					:user="item.user"
					:time="item.created_at"
					:status="item.status"
					:price="item.total"
					:diff="item.need_pay_diff_prices"
					:lawyer="item.lawyer || {name: ''}"
					:isSelf="item.is_self"
					:payStatus="item.pay_status"
					:can="item.can"
					@info="onInfo"
					@pay="onPay"
					@sing="onSing"
					@diff="onDiff"
					@callPhone="onCallPhone"
					@cancel="onCancel"
					@payTurn="onPayTurn"
				/>
				<!-- 拓展单 -->
				<expand-block
					v-if="$Route.query.type === 'expand'"
					:no="item.order_no"
					:user="item.user"
					:time="item.created_at"
					:expand="item.expand"
					:price="item.total"
					:status="item.status"
					:diff="item.need_pay_diff_prices"
					:lawyer="item.lawyer || {name: ''}"
					:isSelf="item.is_self"
					:payStatus="item.pay_status"
					:can="item.can"
					@info="onInfo"
					@pay="onPay"
					@diff="onDiff"
					@callPhone="onCallPhone"
					@cancel="onCancel"
				/>
			</block>
			<!-- 分页 -->
			<u-loadmore v-if="pagesShow" :status="status" />
		</view>
		<view class="null-pages" v-else>
			<u-empty
				mode="order"
				icon="http://cdn.uviewui.com/uview/empty/order.png"
				text="暂无相关订单"
			>
			</u-empty>
		</view>
	</view>
</template>

<script>
	import { certified } from '@/apis/interfaces/user.js'
	import { servicesOrder, synthesisOrder, entrustOrder, expandOrder, orderRead, cancelOrder } from '@/apis/interfaces/synthesisOrder.js'
	import { esignUrl } from '@/apis/interfaces/synthesis.js'
	import entrustBlock from '@/components/entrustOrder.vue'
	import expandBlock from '@/components/expandOrder.vue'
	import servicesBlock from '@/components/servicesOrder.vue'
	import synthesisBlock from '@/components/synthesisOrder.vue'
	import permision from "@/js_sdk/wa-permission/permission.js"
	export default {
		components: { entrustBlock, expandBlock, servicesBlock, synthesisBlock },
		data() {
			return {
				tabsBg		: require('@/static/icons/synthesize_icon.png'),
				tabType		: null,
				tabs		: [
					{ name: '全部', type: null }
				],
				tabScroll	: false,
				orderArr	: [],
				funName		: '',
				isRefresh	: false, // 更新页面数据
				// 分页
				page		: {
					current	: 1
				},
				pagesShow	: false,
				status   	: ''
			};
		},
		created() {
			let funName  = ''
			let tabsArr  = []
			let tabName  = ''
			let isScroll = false
			// 订单类型
			switch(this.$Route.query.type){
				case 'service':
					funName  = servicesOrder
					tabName  = '年费订单'
					tabsArr  = [
						{ name: '待支付', type: 0 },
						{ name: '待签约', type: 1 },
						{ name: '已签约', type: 2 },
						{ name: '已退款', type: 3 },
					]
					break;
				case 'synthesis':
					funName  = synthesisOrder
					tabName  = '咨询订单'
					break;
				case 'entrust':
					isScroll = true
					funName  = entrustOrder
					tabName  = '委托订单'
					tabsArr  = [
						{ name: '待支付', type: 0 },
						{ name: '待审核', type: 1 },
						{ name: '待签约', type: 2 },
						{ name: '已签约', type: 3 },
						{ name: '已完成', type: 4 },
						{ name: '已驳回', type: 5 },
					]
					break;
				case 'expand':
					funName  = expandOrder
					tabName  = '拓展订单'
					tabsArr  = [
						{ name: '待支付', type: 0 },
						{ name: '已支付', type: 1 },
						{ name: '已退款', type: 2 },
					]
					break;
			}
			
			this.tabs = [
				...this.tabs,
				...tabsArr
			]
			this.tabScroll = isScroll
			this.funName   = funName
			uni.setNavigationBarTitle({
				title: tabName
			})
			this.getList()
		},
		onShow() {
			if(this.isRefresh){
				this.page = { current: 1 }
				this.getList()
			}
		},
		methods: {
			// 切换tab
			onTab(e) {
				let { type } = e;
				if(this.tabType != type){
					this.tabType 	  = type
					this.page.current = 1
					this.getList()
				}
			},
			// 委托单线上支付被驳回
			onPayTurn(no){
				let orderArr   = this.orderArr
				let orderObj   = orderArr.find(val => val.order_no === no)
				uni.showModal({
					title		: '提示',
					content		: '支付驳回原因：' + orderObj.remark,
					showCancel	: false
				})
			},
			// 取消订单
			onCancel(no){
				let orderArr   = this.orderArr
				let orderObj   = orderArr.find(val => val.order_no === no)
				let orderIndex = orderArr.findIndex(val => val.order_no === no)
				
				uni.showModal({
					title	: '提示',
					content	: '确认取消当前订单嘛？',
					success : modalRes => {
						if(modalRes.confirm){
							uni.showLoading({
								title: '加载中...',
								mask : true
							})
							cancelOrder(this.$Route.query.type, orderObj.order_id).then(res => {
								this.orderArr.splice(orderIndex, 1)
								uni.showToast({
									title: '订单已取消',
									icon : 'none'
								})
							}).catch(err => {
								uni.showToast({
									title: err.message,
									icon : 'none'
								})
							})
						}
					}
				})
			},
			// 签约
			onSing(no){
				let orderArr  = this.orderArr
				let orderObj  = orderArr.find(val => val.order_no === no)
				uni.showLoading({
					title: '加载中...',
					mask : true
				})
				certified().then(res => {
					let { e_sign } = res
					if(!e_sign){
						uni.hideLoading()
						uni.showModal({
							title		: '提示',
							content		: '暂未实名认证，请实名后在完成签约',
							cancelText	: '稍后认证',
							confirmText	: '去认证',
							success		: modalRes => {
								if(modalRes.confirm){
									this.$Router.push({name: 'UserCertification'})
								}
							}
						})
						return
					}
					
					esignUrl({
						order_type	: orderObj.order_type,
						order_id  	: orderObj.order_id,
						app_scheme	: "doufire://",
						redirect_url: getApp().globalData.signUrl,
						channel		: "app"
					}).then(signRes => {
						this.$Router.push({
							name: 'ESign',
							params: {
								url: signRes.sign_url
							}
						})
						uni.hideLoading()
					}).catch(signErr => {
						uni.showToast({
							title: err.message,
							icon : 'none'
						})
					})
					uni.hideLoading()
				}).catch(err => {
					uni.showToast({
						title: err.message,
						icon : 'none'
					})
				})
				
			},
			// 支付
			onPay(no){
				let orderArr  = this.orderArr
				let orderObj  = orderArr.find(val => val.order_no === no)
				let { can, price, order_id, order_type } = orderObj
				
				switch(can.pay_status){
					case 1:
						this.expressSheet(order_id, order_type, can, price)
						break;
					case 2:
						uni.showToast({
							title: '打款凭证审核中，请耐心等待',
							icon : 'none'
						})
						break;
					case 3:
						uni.showModal({
							title		: '审核被驳回',
							content		: '驳回原因：' + orderObj.offline_pays.remark,
							showCancel	: false,
							success		: modalRes => {
								if(modalRes.confirm){
									this.$Router.push({
										name	: 'BankPay',
										params	: {
											payId	 	: orderObj.offline_pays.offline_pay_id,
											type	 	: 'edit',
											orderId		: orderObj.order_id,
											orderType	: orderObj.order_type.replace(/\\/g, '-'),
											price		: orderObj.price
										}
									})
								}
							}
						})
						break;
				}
			},
			// 选择支付方式
			expressSheet(id, type, can, price) {
				this.price 	   = price
				this.orderId   = id
				this.orderType = type
				// 仅支持线下打款
				if(!can.online){
					this.onToBankPay()
					return
				}
				// 选择线上、下支付方式
				uni.showActionSheet({
				    itemList: ['线上支付', '线下支付'],
				    success: sheetRes => {
						if(sheetRes.tapIndex == 0){
							this.$Router.push({
								name: 'Pay',
								params: {
									paytype		: 'synthesize',
									orderId		: id,
									orderType	: type.replace(/\\/g, '-')
								},
							})
							return
						}
						this.onToBankPay()
				    }
				})
			},
			// 去线下打款
			onToBankPay(){
				this.$Router.push({
					name: 'BankPay',
					params: {
						orderId		: this.orderId,
						orderType	: this.orderType.replace(/\\/g, '-'),
						price		: this.price
					},
				})
			},
			// 打开详情
			onInfo(no){
				let orderArr  = this.orderArr
				let orderObj  = orderArr.find(val => val.order_no === no)
				let orderId	  = orderObj.order_id
				let orderType = this.$Route.query.type
				let pagesName = ''
				
				switch(this.$Route.query.type){
					case 'service':
						pagesName = 'OrderServicesInfo'
						break;
					case 'synthesis':
						pagesName = 'OrderSynthesisInfo'
						break;
					case 'entrust':
						pagesName = 'OrderEntrustInfo'
						break;
					case 'expand':
						pagesName = 'OrderExpandInfo'
						break;
				}
				
				this.$Router.push({
					name	: pagesName,
					params	: {
						id: orderId
					}
				})
			},
			// 补差价
			onDiff(no){
				let orderArr  = this.orderArr
				let orderObj  = orderArr.find(val => val.order_no === no)
				this.$Router.push({
					name	: 'Difference',
					params	: {
						orderId		: orderObj.order_id,
						ordertype	: orderObj.order_type.replace(/\\/g, '-')
					}
				})
			},
			// 联系电话
			async onCallPhone(number){
				let result = await permision.requestAndroidPermission('android.permission.CALL_PHONE')
				// 检查用户权限
				if(result == 1){
					uni.makePhoneCall({
						phoneNumber: number
					})
					return
				}
				// 引导用户设置联系电话
				uni.showModal({
					title		: '提示',
					content		: '请授权应用获得[拨打电话]权限',
					showCancel	: false,
					confirmText	: '设置',
					success		: modalRes => {
						permision.gotoAppPermissionSetting()
					}
				})
			},
			// 获取列表信息
			getList(){
				uni.showLoading({
					title: '加载中...',
					mask : true
				})
				this.funName({
					status: this.tabType,
					page  : this.page.current
				}).then(res => {
					let { data, page } = res
					this.orderArr  = page.current == 1 ? data: this.orderArr.concat(data)
					this.page	   = page
					this.pagesShow = !page.has_more
					this.status	   = page.has_more ? 'loading' : 'nomore'
					uni.hideLoading()
				}).catch(err => {
					uni.showToast({
						title: err.message,
						icon : 'none'
					})
				})
			}
		},
		onReachBottom() {
			this.pagesShow = true;
			if(this.page.has_more){
				this.page.current++
				this.getList()
				return
			}
		},
		onHide() {
			this.isRefresh = true
		}
	}
</script>

<style lang="scss">
	.content{ padding-bottom: 10rpx; box-sizing: border-box; }
	// 滑块
	.header-sticky{ padding-bottom: 12rpx; }
	// 列表
	.list{ overflow: hidden; padding-top: 30rpx; }
	// 内容为空
	.null-pages{ height: 70vh; display: flex; align-items: center; justify-content: center; }
</style>
