<template>
	<view class="content">
		<view class="content_item_box">
			<view class="content_item">
				<view class="view">
					<text style="color: red;">*</text>任务名称
				</view>
				<view class="view">
					<radio-group v-if="!isSupervisor" class="radio-group" name="" @change="task($event)">
						<label class="radio" style="margin-right: 20rpx" v-for="(item,key) in data1" :key="item.name">
							<radio color="#317AFF" :value="item.name" />
							<text>{{item.name}}</text>
						</label>
					</radio-group>
					<radio-group v-else class="radio-group" name="" @change="task($event)">
						<label class="radio" style="margin-right: 20rpx" v-for="(item,key) in data2" :key="item.name">
							<radio color="#317AFF" :value="item.name" />
							<text>{{item.name}}</text>
						</label>
					</radio-group>
				</view>
			</view>
			<view class="content_item">
				<view class="view">
					<text style="color: red;">*</text>单位名称
				</view>
				<view class="view"
					style="border: 2rpx solid #E4E7EC; height: 60rpx; flex:1;line-height: 60rpx; display:flex;padding: 0 10rpx; margin: 0 30rpx 0 20rpx;"
					@tap="indexs()">
					<view v-if="!prams.company.name" class=""
						style="flex: 1;color: grey; font-size: 24rpx; margin-left: 10rpx;">
						请选择单位
					</view>
					<view v-else class="" style="flex: 1; margin-left: 10rpx;">
						{{prams.company.name}}
					</view>
					<view class="" style="margin-top: 6rpx;">
						<img src="@/static/task/list.png" alt="">
					</view>
				</view>

			</view>
			<view class="content_item2" v-if="cid!='首页'">
				<view class="view" style="margin-bottom: 20rpx;">
					<text style="color: red;">*</text><text>协助机构</text>
				</view>

				<view class="">
					<view class=""  v-for="(item,index) in supervisorList" style="display: flex; margin-bottom: 20rpx;">
						<uni-data-picker class="view" placeholder="请选择协助机构" popup-title="请选择协助机构" :localdata="dataTree"
							v-model="item.id" @change="onchange" @nodeclick="onnodeclick" @popupopened="onpopupopened"
							@popupclosed="onpopupclosed">
						</uni-data-picker>
						<view style="margin-top: 6rpx;" v-if="index == 0" class="" @tap="add()">
							+
						</view>
						<view v-else class="" @tap="del(index,item)">
							-
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="button">
			<button @tap="apply()">确定</button>
			<!-- <button type="default">取消</button> -->
		</view>
		<view class="taskadd" v-if="index">
			<view class="itembox">
				<view class="item_top">
					<view class="">
						选择单位
					</view>
					<view class="" @tap="index=!index">
						x
					</view>
				</view>
				<view class="item_content" v-if="index">
					<Companies v-on:cdata="Company()"></Companies>
				</view>

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

<script>
	import Companies from "./companies.vue"
	export default {
		components: {
			Companies
		},
		props:["cid"],
		data() {
			return {
				classes: '请选择协助机构',
				dataTree: [],

				data1: [{
					name: "熟悉演练",
					value: 1
				}],
				data2: [{
					name: "双随机",
					value: 1,
				}, {
					name: "联络指导",
					value: 0
				}],
				users: [],
				supervisorList: [{
					id: null
				}],
				og: [],
				companies: [],
				curry: 0,

				prams: {
					task: "",
					company: {
						name:"",
						id:""
					},
					supervisor: []
				},
				companyName: "",
				index: false,
				selectedYear: 2022,
				selectedMonth: 0,
				OrganizationId: "",
				isSupervisor: false
			}
		},
		created() {
			
			let roles = uni.getStorageSync("user").roles
			console.log(uni.getStorageSync("user"));
			let isSupervisor = roles.find(item => {
				return item.name.indexOf('检查') != -1
			})
			isSupervisor ? this.isSupervisor = true : this.isSupervisor = false

			this.OrganizationId = uni.getStorageSync("user").organizationId
			// this.getSupervisor()
			this.getOg()
			this.getUsers()
			this.selectedMonth = new Date().getMonth() + 1
			this.selectedYear = new Date().getFullYear()
		},
		methods: {
			getSupervisor() {
				this.$request.get('/api/Users/Inspectors', {}, (data, res) => {

					if (!this.isSupervisor) {
						for (let i = 0; i < this.dataTree[0].children.length; i++) {
							console.log(this.dataTree[0].children[i]);
							for (let k = 0; k < res.length; k++) {

								if (this.dataTree[0].children[i].value == res[k].organizationId) {
									this.dataTree[0].children[i].children.push({
										text: res[k].name,
										value: res[k].id
									})
								}
							}
						}
						for (let i = 0; i < this.dataTree[0].children.length; i++) {
							if (this.dataTree[0].children[i].children.length == 0) {
								this.dataTree[0].children[i].disable = true
							}
						}
						console.log(res);
					}
				})
			},
			getOg() {
				let p = {
					PageNumber: 1,
					PageSize: 9999
				}
				this.$request.get('/api/Organizations', p, (data, res) => {
					this.dataTree = []
					this.og = res.items
					for (let i = 0; i < this.og.length; i++) {
						if (this.og[i].level == "brigade") {
							this.dataTree.push({
								text: this.og[i].name,
								value: this.og[i].id,
								children: []
							})
						}

					}
					for (let i = 0; i < this.og.length; i++) {
						for (let k = i + 1; k < this.og.length; k++) {
							if (this.og[i].id == this.og[k].parentId && this.og[i].level == "brigade") {
								this.dataTree[0].children.push({
									text: this.og[k].name,
									value: this.og[k].id,
									children: [],
									disable: false
								})
							}
						}
					}
					// for(let i=0;i<this.dataTree[0].children.length;i++){
					// 	for (let k=0;i<this.og.length;k++){

					// 	}
					// }
					console.log(this.dataTree);
					this.getSupervisor()

				})
			},
			aaa(e) {
				this.prams.supervisor = e.detail.value
			},
			task(e) {
				this.prams.task = e.detail.value
			},

			getUsers() {

				let p = {
					OrganizationId: this.OrganizationId,
					OrganizationLevel: 'squadron',
					ContainsChildren: true,
					PageNumber: 1,
					PageSize: 9999
				}
				this.$request.get('/api/Users', p, (data, res) => {
					this.users = res.items
				})
			},
			companyname(e) {
				this.companyName = this.companies[e.detail.value].companyName
			},
			bbb(e) {
				this.prams.company = e.id
			},
			add() {
				this.supervisorList.push({
					id: null
				})
			},
			del(index,item) {
				console.log(item);
				this.supervisorList.splice(index, 1)
				
			},
			indexs() {
				this.index = true
			},
			apply() {
				this.prams.supervisor=[]
				if (!this.prams.task || !this.prams.company) {
					return this.$alert.showError("请填写完整")
				}
				for(let i=0;i<this.supervisorList.length;i++){
					this.prams.supervisor.push(this.supervisorList[i].id) 
					for (let k=this.supervisorList.length-1;k>i;k--) {
						if(this.supervisorList[k].id==this.supervisorList[i].id && i!=k){
							
							return this.$alert.showError("协助机构重复")
						}
					}
				}
				
				if(!this.prams.supervisor.length&&this.cid!="首页"){
					return this.$alert.showError("请填写完整")
				}
				console.log(this.prams);
				let selectedMonth = this.selectedMonth < 10 ? "0" + this.selectedMonth : this.selectedMonth;
				let selectedTime = this.selectedYear + '-' + selectedMonth + '-' + '01'
				console.log(this.prams, 444);
				let b={}
				let body = {
					month: selectedTime,
					taskName: this.prams.task,
					taskType: this.prams.task,
					companyId: this.prams.company.id,
					organizationId: this.OrganizationId,
					supervisorIds: this.isSupervisor ? [] : this.prams.supervisor,
					assitantOrganizationIds: this.isSupervisor ? this.prams.supervisor : [],
					creationType: '申领任务',
					approvalStatus: '待处理'
				}
				let body2 = {
					month: selectedTime,
					taskName: this.prams.task,
					taskType: this.prams.task,
					companyId: this.prams.company.id,
					organizationId: this.OrganizationId,
					supervisorIds: this.isSupervisor ? [uni.getStorageSync("user").id] : [],
					assitantOrganizationIds: this.isSupervisor ? [] : [uni.getStorageSync("user").organizationId],
					creationType: '自主任务',
					approvalStatus: '通过'
				}
				if(this.cid=="首页"){
					b=body2
				}else{
					b=body
				}
				// return
				this.$request.post('/api/PlanTasks', b, (data, res) => {
					console.log(res);
					if (res.status == 500) {
						this.$alert.showError("该单位已创建任务")
					} else {
						this.$alert.showError("创建成功")
					}
					this.$parent.apply();
				})
			},
			Company(data) {
				console.log(data);
				if (data) {
					this.index = false
					this.prams.company.name = data.companyName
					this.prams.company.id=data.id
				}
			},
			onnodeclick(e) {
				console.log(e);
			},
			onpopupopened(e) {
				console.log('popupopened');
			},
			onpopupclosed(e) {
				console.log('popupclosed');
			},
			onchange(e) {
				console.log('onchange:', e);
				let a=0
				for (let i=0;i<this.prams.supervisor.length;i++) {
					if(this.prams.supervisor[i]==e.detail.value[2].value){
						a++
					}
				}
				if(!a){
					this.prams.supervisor.push(e.detail.value[2].value)
				}
			}
		}
	}
</script>

<style lang="scss">
	.content {
		height: 100%;
		display: flex;
		flex-direction: column;
		padding: 0 20rpx;

		.content_item_box {
			flex: 1;
			overflow: auto;
		}

		.taskadd {
			width: 100vw;
			height: 100vh;
			position: fixed;
			left: 0;
			top: 0;
			bottom: 0;
			background: rgba(49, 49, 51, 0.2);
			z-index: 11;

			.itembox {
				// background: #fff;
				position: absolute;
				top: 40%;
				bottom: 180rpx;
				left: 0;
				width: 100%;
				// height: 500rpx;

				.item_top {
					height: 60rpx;
					background: #F5F7FA;
					border-radius: 40rpx 40rpx 0 0;
					padding: 10rpx 40rpx 0 40rpx;
					display: flex;

					view:nth-child(1) {
						flex: 1;
					}
				}

				.item_content {
					background-color: #fff;
					height: 100%;
				}
			}

			.itembox2 {
				// background: #fff;
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 400rpx;

				.item_top {
					height: 60rpx;
					background: #F5F7FA;
					border-radius: 40rpx 40rpx 0 0;
					padding: 10rpx 40rpx 0 40rpx;
					display: flex;

					view:nth-child(1) {
						flex: 1;
					}
				}

				.item_content {
					background-color: #fff;
					height: 100%;
				}
			}
		}

		.content_item {
			display: flex;
			align-items: center;
			padding: 20rpx 0;

			.view {
				margin: 0 20rpx;

				img {
					width: 40rpx;
					height: 40rpx;
				}
			}

			.input {
				flex: 1;
				height: 60rpx;
				border: 2rpx solid #E4E7EC;
			}
		}
		.content_item2 {
			display: flex;
			align-items: center;
			padding: 20rpx 0;
		
			.view {
				margin: 0 20rpx;
		
				img {
					width: 40rpx;
					height: 40rpx;
				}
			}
		
			.input {
				flex: 1;
				height: 60rpx;
				border: 2rpx solid #E4E7EC;
			}
		}
		.button {
			display: flex;
			height: 150rpx;
		}

		.checkbox-group,
		.radio-group {
			flex: 1;

			overflow: auto;

			.checkbox,
			.radio {
				margin-bottom: 10rpx;
				margin-right: 10rpx;

				radio {
					transform: scale(0.7);
				}
			}
		}
	}
</style>
