<template>
	<view class="ticket-handle">
		<uni-nav-bar @clickLeft="goBack()" class="nav-bar" height="110rpx" leftWidth="200rpx" :leftText="leftText"
			leftIcon="left" border backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
		<view class="ticket-info">
			<view class="form-item border-bottom" v-if="ticketType === 'add'">
				<view class="form-left">
					<text class="star">*</text>
					<text class="form-left-text">加签给</text>
				</view>
				<view class="form-right" style="position: relative;">
					<!-- <uni-data-select v-model="toadd_user" :localdata="range" label="加签给">
					</uni-data-select> -->
					<ba-tree-picker ref="to_Picker" :multiple='false' @select-change="select_Change" title="加签给"
							:localdata="vuex_userRange" valueKey="id" textKey="name" childrenKey="children"  :selectParent='false'/>
					<text type="text">{{toadd_user_name}}</text>
					<uni-icons style="position: absolute; right: 0;" @click="showPicker" type="arrowright" color="#999999"/>
				</view>
			</view>
			<view class="form-item border-bottom" v-else>
				<view class="form-left">
					<text class="star">*</text>
					<text class="form-left-text">转交给</text>
				</view>
				<view class="form-right"  style="position: relative;">
					<!-- <uni-data-select v-model="target_user" :localdata="range" label="转交给">
					</uni-data-select> -->
					<ba-tree-picker ref="target_Picker" :multiple='false' @select-change="select_target_Change" title="转交给"
							:localdata="vuex_userRange" valueKey="id" textKey="name" childrenKey="children"  :selectParent='false'/>
					<text type="text">{{target_user_name}}</text>
					<uni-icons style="position: absolute; right: 0;" @click="showTargetPicker" type="arrowright" color="#999999"/>
				</view>
			</view>
			<view class="form-item" style="height: 300rpx;">
				<view class="form-left-text">
					<text class="star">*</text>
					<text>{{labelText}}</text>
				</view>
				<textarea class="apply-reason-text" v-model="form.name" maxlength="250" placeholder="请输入" />
			</view>
			<view class="btn" style="display: flex;justify-content: space-between;">
				<button class="handleBtn" type="primary" @click="handleClick">提交</button>
			</view>

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

<script>
		import baTreePicker from "../../comm/ba-tree-picker/ba-tree-picker.vue";
		import nonNullCheck from '../../../utils/nonNullCheck.js';
	export default {
		name: "addNode",
		components: {
			baTreePicker
		},
		data() {
			return {
				ticketId: "",
				ticketType: "",
				labelText: '加签原因',
				leftText:'加签',
				form:{
					suggestion:'',
					toadd_user:'',
					target_user:''
				},
				toadd_user:'',
				target_user_name:'转交给',
				toadd_user_name:'加签给'
			}
		},
		onLoad(params) {
			debugger;
			console.log(params)
			this.ticketId = params.ticketId;
			this.ticketType = params.type;
		},
		onShow() {
			if (this.ticketType === 'add') {
				this.labelText = '加签原因';
				this.leftText = '加签';
			} else {
				this.leftText = '转交';
				this.labelText = '转交原因'
			}
		},
		methods: {
			showPicker() {
				this.$refs.to_Picker._show();
			},
			select_Change(ids, names){
				this.formData.toadd_user = ids[0];
				this.toadd_user_name = names;
			},
			showTargetPicker() {
				this.$refs.target_Picker._show();
			},
			select_target_Change(ids, names){
				this.formData.target_user = ids[0];
				this.target_user_name = names;
			},
			goBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			handleClick(){
				if (this.ticketType === 'add') {
					this.$u.api.getTicketItem(this.form).then((res) => {
						this.ticketDetail = res;
					});
				} else {
					// this.form.target_user = this.target_user;
					this.$u.api.getTicketItem(this.form).then((res) => {
						this.ticketDetail = res;
					});
				}
			},
		}
	}
</script>

<style>
	/* 主体 */
	>>>.uni-navbar__header,
	>>>.uni-status-bar {
		background-image: linear-gradient(90deg, #164cc3 0%, #2c6fd9 100%), linear-gradient(#e60012, #e60012) !important;
	}
	.ticket-handle {
		background-color: #f3fbff;
		padding-bottom: 227rpx;
	}

	.ticket-info {
		width: 720rpx;
		margin: 0 auto;
		background-color: #FFFFFF;
		border-radius: 10rpx;
		padding: 25rpx 32rpx;
		box-sizing: border-box;
		margin-top: 24rpx;
	}
.form-item {
    /* display: flex; */
    font-family: PingFang-SC-Medium;
    font-size: 16px;
    min-height: 160rpx;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.form-left {
		/* min-width: 160rpx; */
		width: 100%;
	}
	.form-left-text {
		color: #212121;
		margin-bottom: 13rpx;
	}
.form-right {
		margin-left: 20rpx;
		flex: 1;
		color: #414141;
	}
.star {
    color: red;
}
	.apply-reason-text {
		width: 653rpx;
		height: 179rpx;
		background-color: #f6f8fc;
		border: solid 1rpx #e5e5e5;
		padding: 14rpx 24rpx;
		font-size: 26rpx;
		box-sizing: border-box;
	}

.border-bottom {
		border-bottom: 1rpx solid #eeeeee;
		margin-bottom: 20rpx;
	}

	.fixed-assets-list .ticket-info {
		padding-top: 0rpx;
	}
</style>
