orbit-ch-web/src/pages/1-main/06-XQJY/xqjy.vue

<template>
	<div class="xqjy-page">
		<div v-if="commonFunction.getUserConfig($store.state.userOwnMenus,300).available" class="xqjy-task_panel">
			<xqjyTaskList ref="xqjyTk" @select="isShow"></xqjyTaskList>
			<div class="xqjy-page_btn">
				<el-button v-if="commonFunction.getUserConfig($store.state.userOwnMenus,3001).available" size="small" type="primary"
									 @click="addPlan">筹划
				</el-button>
			</div>
		</div>
		<div v-if="commonFunction.getUserConfig($store.state.userOwnMenus,301).available" v-show="windowShow"
				 class="xqjy-analysisResult_panel">
			<i class="el-icon-close" @click="closeWindow"></i>
			<xqjyAnalysisResult ref="xqjyAr" @add="addStrip" @delete="deleteStrip"></xqjyAnalysisResult>
			<div class="xqjy-page_btn">
				<el-button v-if="commonFunction.getUserConfig($store.state.userOwnMenus,3002).available" size="small" type="primary"
									 @click="showWindowList">确认
				</el-button>
			</div>
		</div>
	</div>
</template>

<script>
import xqjyTaskList from './xqjyTaskList';
import xqjyAnalysisResult from './xqjyAnalysisResult';
import {confirmWindowInfo, addPlanList} from "@/api/xqjyApi";
import cesiumEntityUtils from "@/utils/cesiumEntityUtils";

export default {
	name: "xqjyPage",
	components: {xqjyTaskList, xqjyAnalysisResult},
	data() {
		return {
			windowShow: false,
			windowList: [],
			windowSelParentIds: [],
			windowSelParentId: '',
			windowRate: null,
			loading: null,
		}
	},
	methods: {
		isShow(data) {
			this.windowRate = data.rate
			this.windowSelParentId = data.parentId;
			this.windowShow = true;
			let targetData = null;
			let type = 'point'
			if (data.pointDTOList.length === 1) {
				targetData = {
					id: data.id,
					name: data.targetName,
					size: 20,
					outlineColor: Cesium.Color.fromCssColorString('#f10808'),
					outlineWidth: 2,
					color: Cesium.Color.fromCssColorString('#edf50b'),

					lon: data.pointDTOList[0].lng,
					lat: data.pointDTOList[0].lat,
					zIndex: 2
				};
			} else {
				type = 'polygon'
				let polygon = [];
				data.pointDTOList.forEach(py => {
					polygon.push(py.lng)
					polygon.push(py.lat)
				})
				targetData = {
					id: data.id,
					name: data.targetName,
					isRhumb: true,
					polygon: polygon,
					material: Cesium.Color.fromCssColorString('rgba(255,0,0,0.5)')
				}
			}
			this.$events.$emit("xqjy-target", {
				data: targetData,
				type: type
			});
		},
		closeWindow() {
			this.windowShow = false;
			this.$events.$emit("xqjy-target", {
				data: null,
				type: null
			});
			this.$refs.xqjyTk.selectId = null;
		},
		showWindowList() {
			if (typeof this.windowRate !== 'number') {
				this.$message.error('条带频次出错')
				return
			}
			let datas = this.$refs.xqjyAr.tableDatas
			let stripList = [];
			datas.forEach((item) => {
				if (item.select) {
					item.params.some(sub => {
						if (sub.select) {
							stripList.push({
								stripId: sub.id,
								isSelected: 2
							});
						}
					})
				}
				// else {
				//   if (item.params.length > 0) {
				//     stripList.push({
				//       stripId: item.params[0].id,
				//       isSelected: 2
				//     });
				//   }
				// }
			})
			if (this.windowRate !== stripList.length) {
				this.$message.warning(`条带频次为：${this.windowRate}，请选择${this.windowRate}个条带`)
				return
			}
			confirmWindowInfo(stripList).then(response => {
				if (response.code === 200) {
					this.$message.success("确认成功！");
					// 所有确认成功的parentId
					if (!this.windowSelParentIds.includes(this.windowSelParentId)) {
						this.windowSelParentIds.push(this.windowSelParentId);
					}
				} else {
					console.log(response.data)
				}
			})
		},
		addPlan() {
			let datas = this.$refs.xqjyTk.selections
			let param = {
				demandType: 0,
			}
			let parentIds = [];
			if (datas.length < 1) {
				param.demandType = 1
				parentIds.push(this.$refs.xqjyTk.tableDatas[0])
			} else {
				datas.forEach(item => {
					parentIds.push(item.parentId)
				})
			}

			param.parentIds = parentIds;

			// const isEqual = this.strArrAllEqual(param.parentIds, this.windowSelParentIds);
			// if (!isEqual) {
			// 	this.$message.error("选择的筹划任务存在未分析的任务。")
			// 	return
			// }
			this.loading = this.$loading({
				lock: true,
				text: "筹划计算中",
				spinner: 'el-icon-loading',
				background: 'rgba(0,0,0,0.8)'
			});
			addPlanList(param).then(response => {
				console.log(response)
				if (response.code === 200) {
					this.loading.close();
					this.$message.success("提交筹划成功")
					this.$router.push({name: "xqchPage"});
				}
			})
		},
		strArrAllEqual(arr1, arr2) {
			if (arr1.length != arr2.length) {
				return false;
			}
			if (arr1.length === 0) {
				return false;
			}
			const tempArr = arr1.filter(i => arr2.includes(i));
			return tempArr.length === arr1.length;
		},
		addStrip(strips) {
			let lines = []
			if (strips.length > 0) {
				strips.forEach(item => {
					if (item.pointDTOList && item.pointDTOList.length > 0) {
						let polygon = [];
						item.pointDTOList.forEach(py => {
							polygon.push(py.longitude)
							polygon.push(py.latitude)
						})
						lines.push({
							id: item.id,
							material: Cesium.Color.fromCssColorString('rgba(237,245,11,0.5)'),
							isRhumb: false,
							polygon: polygon
						})
					}
				})
			}
			this.$events.$emit("xqjy-addwindow", lines);
		},
		deleteStrip(data) {
			this.$events.$emit("xqjy-deletewindow", data);
		}
	},
	mounted() {
	},
};
</script>

<style lang='scss' scoped>
.xqjy-page {
	color: #fff;
	height: calc(100% - 64px);

	.xqjy-task_panel, .xqjy-analysisResult_panel {
		position: absolute;
	}

	.xqjy-task_panel {
		height: 680px;
		top: 44px;
		left: -30px;
		width: 580px;
		background: url("@/assets/ClipImage/biaoti/xqrwlb.png") no-repeat;
	}

	.xqjy-analysisResult_panel {
		height: 660px;
		right: 0;
		width: 580px;
		background: url("@/assets/ClipImage/biaoti/fxjg.png") no-repeat;

		.el-icon-close {
			float: right;
			margin: 6px 21px;
			cursor: pointer;
		}
	}


	.xqjy-page_btn {
		width: 24px;
		margin: 22px auto 5px;

		.el-button {
			padding: 5px 10px;
			font-family: 'SourceHanSansCN-Regular';
			font-size: 16px;
		}
	}
}

</style>