<template>
	<view class="form_warp">
		<view class="form_intro">
			<view>如有填报问题，请咨询公共服务中心</view>
			<view>中心值班电话：<text @click="call(mobile)" class="tel">{{mobile}}</text></view>
		</view>
		<view class="form_item_box">
			<view class="form_item_title">基本信息</view>
			<view class="form_item">
				<view class="form_item_label">所属单位：</view>
				<view class="form_item_input picker">
					<!-- <picker v-if="pageType == 'add' && deptNameList.length > 1" :value="form.organizationNameIndex"
						:range="deptNameList" range-key="deptName" @change="bindDeptChange">
						<text class="picker_select"
							:style="form.organizationName?'color:#333;':''">{{form.organizationName?form.organizationName:'请选择'}}</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</picker>
					<text v-else>{{form.organizationName}}</text> -->
					<!-- <view class="pick_pop" @click="showPop" v-if="pageType == 'add' && (treeData.length > 1 || (treeData.length == 1 && treeData[0].children.length > 0))">
						<text>{{form.organizationName}}</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</view>
					<text v-else>{{form.organizationName}}</text> -->
					{{form.organizationName}}
				</view>
			</view>
			<view class="form_item">
				<view class="form_item_label">统计日期：</view>
				<view class="form_item_input picker">
					<picker mode="date" :value="form.statDate" @change="bindDateChange" :end="currentDate">
						<text class="picker_select"
							:style="form.statDate?'color:#333;':''">{{form.statDate?form.statDate:'请选择'}}</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</picker>
				</view>
			</view>
			<view class="form_item">
				<view class="form_item_label">统计时段：</view>
				<view class="form_item_input picker">
					<picker :value="index" :range="array" range-key="dictLabel" @change="changeStatPeriod">
						<text class="picker_select"
							:style="index>-1?'color:#333;':''">{{index>-1?array[index].dictLabel:'请选择'}}</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</picker>
				</view>
			</view>
		</view>
		<view class="form_item_box" style="margin-top: 30rpx;">
			<!-- tab 切换 -->
			<view class="tab_box">
				<view class="tab_nav" :class="tabType == 1 ? 'active' : ''" @click="tabType = 1">客班轮</view>
				<view class="tab_nav" :class="tabType == 2 ? 'active' : ''" @click="tabType = 2">国际邮轮</view>
			</view>
			<!-- 客班轮 -->
			<view class="form_item_li" v-show="tabType == 1" v-for="(item,index) in form.passengerShipDTOList" :key="index">
				<view class="form_item"
					style="display:flex; justify-content: space-between; font-size: 30rpx;color:#333;font-weight: bold;margin-top: 30rpx;">
					客班轮-{{ index+1 }}
					<uni-icons type="trash" color="red" @click="deleteRow(index)" size="18"></uni-icons>
				</view>
				<view class="form_item">
					<view class="form_item_label">航线：</view>
					<view class="form_item_input picker">
						<picker :value="item.routeIndex" :range="shipRouteList" range-key="route"
							@change="e => changeRoute(e, index)">
							<text class="picker_select" :style="item.route?'color:#333;':''">{{item.route?item.route:'请选择'}}</text>
							<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
						</picker>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">航次：</view>
					<!-- <view class="form_item_input picker" v-if="item.routeIndex !== ''">
						<picker :value="item.voyageIndex"
							:range="item.routeIndex > -1 ? shipRouteList[item.routeIndex].voyageInfoVOList : []"
							range-key="voyageCode" @change="e => changeVoyage(e, index)">
							<text class="picker_select" :style="item.voyage?'color:#333;':''">{{item.voyage?item.voyage:'请选择'}}</text>
							<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
						</picker>
					</view>
					<view class="form_item_input picker disabled" v-else @click="clickVoyage">
						<text>请选择</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</view> -->
					<view class="form_item_input form_input">
						<uni-easyinput  v-model="item.voyage" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">方向：</view>
					<view class="form_item_input form_input">
						<uni-easyinput  v-model="item.direction" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" 
						maxlength="20" disabled>
						</uni-easyinput>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">航次数：</view>
					<view class="form_item_input form_input">
						<uni-easyinput @blur="calcYoyMom(1,index)" @clear="calcYoyMom(1,index)" v-model="item.voyageNumber"
							type="number" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<!-- 同比环比 -->
				<!-- <view class="form_item_rate"
					:class="item.passengerDod === 0 ? 'danger' : '' ">
					<view class="rate_item">
						<view class="rate_item_label"
							:style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							航次数环比</view>
						<view class="rate_item_input"
							:style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							{{formatDigit(form.passengerDod)}}%
						</view>
					</view>
					<view class="line"></view>
					<view class="rate_item">
						<view class="rate_item_label">航次数同比</view>
						<view class="rate_item_input">
							{{formatDigit(item.passengerYoy)}}%
						</view>
					</view>
				</view> -->
				<view class="form_item">
					<view class="form_item_label">{{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}}旅客人数：</view>
					<view class="form_item_input form_input">
						<uni-easyinput @blur="calcYoyMom(1,index)" @clear="calcYoyMom(1,index)" v-model="item.passengerCount"
							type="number" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<!-- 同比环比 -->
				<view class="form_item_rate" :class="item.passengerDod === 0 ? 'danger' : '' ">
					<view class="rate_item">
						<view class="rate_item_label" :style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							{{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}}旅客人数环比
						</view>
						<view class="rate_item_input" :style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							{{formatDigit(form.passengerDod)}}%
						</view>
					</view>
					<view class="line"></view>
					<view class="rate_item">
						<view class="rate_item_label">{{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}}旅客人数同比
						</view>
						<view class="rate_item_input">
							{{formatDigit(item.passengerYoy)}}%
						</view>
					</view>
				</view>
				<view class="form_item_remark">
					<view class="form_item_label">备注：</view>
					<view class="form_item_input">
						<uni-easyinput v-model="item.remarks" placeholderStyle="color: #D4D4D4;font-size:28rpx;"
							placeholder="请输入备注信息" type="textarea" maxlength="200" autoHeight></uni-easyinput>
					</view>
				</view>
				<view class="line" v-if="form.passengerShipDTOList.length > 1"></view>
			</view>

			<!-- 国际邮轮 -->
			<view class="form_item_li" v-show="tabType == 2" v-for="(item,index) in form.internationalCruiseDTOList"
				:key="index">
				<view class="form_item"
					style="display:flex; justify-content: space-between; font-size: 30rpx;color:#333;font-weight: bold;margin-top: 30rpx;">
					国际邮轮-{{ index+1 }}
					<uni-icons type="trash" color="red" @click="deleteRow(index)" size="18"></uni-icons>
				</view>
				<view class="form_item">
					<view class="form_item_label">航线：</view>
					<!-- <view class="form_item_input picker">
						<picker :value="item.routeIndex" :range="internationalRouteList" range-key="route"
							@change="e => changeRoute(e, index)">
							<text class="picker_select" :style="item.route?'color:#333;':''">{{item.route?item.route:'请选择'}}</text>
							<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
						</picker>
					</view> -->
					<view class="form_item_input form_input">
						<uni-easyinput  v-model="item.route" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">航次：</view>
					<!-- <view class="form_item_input picker" v-if="item.routeIndex !== ''">
						<picker :value="item.voyageIndex"
							:range="item.routeIndex > -1 ? internationalRouteList[item.routeIndex].voyageInfoVOList : []"
							range-key="voyageCode" @change="e => changeVoyage(e, index)">
							<text class="picker_select" :style="item.voyage?'color:#333;':''">{{item.voyage?item.voyage:'请选择'}}</text>
							<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
						</picker>
					</view>
					<view class="form_item_input picker disabled" v-else @click="clickVoyage">
						<text>请选择</text>
						<uni-icons type="right" size="16" color="#D4D4D4"></uni-icons>
					</view> -->
					<view class="form_item_input form_input">
						<uni-easyinput  v-model="item.voyage" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">方向：</view>
					<view class="form_item_input form_input">
						<uni-easyinput  v-model="item.direction" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" 
						maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<view class="form_item">
					<view class="form_item_label">航次数：</view>
					<view class="form_item_input form_input">
						<uni-easyinput @blur="calcYoyMom(1,index)" @clear="calcYoyMom(1,index)" v-model="item.voyageNumber"
							type="number" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<!-- 同比环比 -->
				<!-- <view class="form_item_rate"
					:class="item.passengerDod === 0 ? 'danger' : '' ">
					<view class="rate_item">
						<view class="rate_item_label"
							:style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							航次数环比</view>
						<view class="rate_item_input"
							:style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							{{formatDigit(form.passengerDod)}}%
						</view>
					</view>
					<view class="line"></view>
					<view class="rate_item">
						<view class="rate_item_label">航次数同比</view>
						<view class="rate_item_input">
							{{formatDigit(item.passengerYoy)}}%
						</view>
					</view>
				</view> -->
				<view class="form_item">
					<!-- {{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}} -->
					<view class="form_item_label">旅客人数：</view>
					<view class="form_item_input form_input">
						<uni-easyinput @blur="calcYoyMom(2,index)" @clear="calcYoyMom(2,index)" v-model="item.passengerCount"
							type="number" placeholderStyle="color: #D4D4D4;font-size:28rpx;" placeholder="请输入" maxlength="20">
						</uni-easyinput>
					</view>
				</view>
				<!-- 同比环比 -->
				<view class="form_item_rate" :class="item.passengerDod === 0 ? 'danger' : '' ">
					<view class="rate_item">
						<!-- {{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}} -->
						<view class="rate_item_label" :style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							旅客人数环比
						</view>
						<view class="rate_item_input" :style="item.passengerDod === 0 ? 'color: #EB4747' : ''">
							{{formatDigit(form.passengerDod)}}%
						</view>
					</view>
					<view class="line"></view>
					<view class="rate_item">
						<!-- {{item.direction == '1' ? '入青' : item.direction == '2' ? '出青' : ''}} -->
						<view class="rate_item_label">旅客人数同比
						</view>
						<view class="rate_item_input">
							{{formatDigit(item.passengerYoy)}}%
						</view>
					</view>
				</view>
				<view class="form_item_remark">
					<view class="form_item_label">备注：</view>
					<view class="form_item_input">
						<uni-easyinput v-model="item.remarks" placeholderStyle="color: #D4D4D4;font-size:28rpx;"
							placeholder="请输入备注信息" type="textarea" maxlength="200" autoHeight></uni-easyinput>
					</view>
				</view>
				<view class="line" v-if="form.internationalCruiseDTOList.length > 1"></view>
			</view>
			<view class="add_btn" @click="addRow">增行</view>
		</view>
		<!-- 底部按钮 -->
		<view class="foot_btn">
			<view class="act_btn blue" @click="doSubmit">{{btnText}}</view>
		</view>
		<!-- 层级单位 -->
		<view class="pop_conbox">
			<uni-popup ref="unitPopup" style="width: 100%;">
				<view class="pop_box">
					<view class="pop_title">
						<view class="pop_title">
							填报单位
							<uni-icons @click="this.$refs.unitPopup.close()" type="closeempty" size="18" color="#666"
								class="pop_close"></uni-icons>
						</view>
					</view>
					<view class="popup-content">
						<view class="tree_item" v-for="(item,index) in treeData" :key="index">
							<view class="item">
								<view class="first_item">
									<view class="first_item_top" :class="item.deptId == selectId ? 'check' : ''">
										<view class="left_item">
											<uni-icons v-show="item.children.length != 0 && !item.isExpand" @click="expandItem(item)"
												type="right" size="15"></uni-icons>
											<uni-icons v-show="item.children.length != 0 && item.isExpand" @click="expandItem(item)"
												type="bottom" size="15"></uni-icons>
										</view>
										<view class="right_item" @click="clickItem(item)">
											{{item.deptName}}
										</view>
									</view>
									<view v-if="item.children.length != 0 && item.isExpand">
										<view class="second_item" v-for="(item1,index1) in treeData[index].children" :key="item1.deptId">
											<view class="seco_top_item" :class="item1.deptId == selectId ? 'check' : ''">
												<view class="left_item">
													<uni-icons v-show="item1.children.length != 0 && !item1.isExpand" @click="expandItem(item1)"
														type="right" size="15"></uni-icons>
													<uni-icons v-show="item1.children.length != 0 && item1.isExpand" @click="expandItem(item1)"
														type="bottom" size="15"></uni-icons>
												</view>
												<view class="right_item" @click="clickItem(item1)">
													{{item1.deptName}}
												</view>
											</view>
											<view v-if="item1.children.length != 0 && item1.isExpand">
												<view class="third_item" v-for="(item2,index2) in treeData[index].children[index1].children"
													:key="item2.deptId">
													<view class="third_top_item" :class="item2.deptId == selectId ? 'check' : ''">
														<view class="left_item">
															<uni-icons @click.stop="expandItem(item2)"
																v-if="item2.children.length != 0  && !item2.isExpand" type="right"
																size="15"></uni-icons>
															<uni-icons @click.stop="expandItem(item2)"
																v-if="item2.children.length != 0  && item2.isExpand" type="bottom"
																size="15"></uni-icons>
														</view>
														<view class="right_item" @click="clickItem(item2)">
															{{item2.deptName}}
														</view>
													</view>
													<view v-if="item2.children.length != 0 && item2.isExpand">
														<view class="four_item"
															v-for="(item3,index3) in treeData[index].children[index1].children[index2].children"
															:key="item3.deptId">
															<view class="four_item_item" :class="item3.deptId == selectId ? 'check' : ''">
																<view class="left_item">
																	<uni-icons @click="expandItem(item3)"
																		v-if="item3.children.length != 0 && !item3.isExpand" type="right"
																		size="15"></uni-icons>
																	<uni-icons @click="expandItem(item3)"
																		v-if="item3.children.length != 0 && item3.isExpand" type="bottom"
																		size="15"></uni-icons>
																</view>
																<view class="right_item" @click="clickItem(item3)">
																	{{item3.deptName}} 123
																</view>
															</view>
														</view>
													</view>

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

									</view>
								</view>


							</view>
						</view>
					</view>
					<view class="btn_box">
						<p class="btn" @click="searchReset">取消</p>
						<p class="btn" @click="searchList">确认</p>
					</view>
				</view>
			</uni-popup>
		</view>
	</view>
</template>
<script>
	import {
		getDateStr,
		checkNotEmpty
	} from "../../../common/util.js"
	export default {
		data() {
			return {
				currentDate:getDateStr(new Date(), 0),
				form: {
					"internationalCruiseDTOList": [], //客班轮
					"passengerShipDTOList": [{
						"route": "",
						"routeIndex": "",
						"voyage": "",
						"voyageIndex": "",
						"direction": "",
						"passengerCount": "",
						"passengerDod": "", //环比
						"passengerYoy": "", //同比
					}], //国际邮轮
					"organizationName": "",
					"statDate": "",
					"statPeriod": ""
				}, //登录form
				stationList: [], //车站列表
				railwayNameIndex: '',
				shipRouteList: [], //客班轮航线
				internationalRouteList: [], //国际邮轮航线
				array: [], //时段选择列表
				index: 2, //时段选择,默认0-24
				userInfo: {},
				pageType: '',
				btnText: '保存',
				tabType: 1,
				deptNameList: [], //当前登录人所在单位
				mobile: getApp().globalData.mobile,
				//层级单位
				treeData: [],
				treeIndex: '',
				selectId: '',
				selectName: '',
				selectId1: '',
			}
		},
		onLoad(options) {
			this.userInfo = uni.getStorageSync('userInfo');
			let arr = uni.getStorageSync('deptName');
			this.deptNameList = checkNotEmpty(arr) ? arr : [];
			if (options.type == 'add') {
				// this.form.organizationName = this.deptNameList.length > 0 ? this.deptNameList[0].deptName : '';
				// this.form.organizationNameIndex = this.deptNameList.length > 0 ? 0 : '';
				this.pageType = 'add';
				let now = new Date();
				this.form.statDate = getDateStr(now, -1); //默认前一天
				this.queryTime(); //统计时段
				this.queryRoute();
				this.getDept();
			} else if (options.id) {
				this.btnText = '修改并保存';
				// this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransport/selectById/' + options
				this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransport/selectByIdV2/' + options
				.id, {}, "GET").then(
					res => {
						this.form = res.data;
						this.form.passengerShipDTOList = this.form.passengerShipVOList;
						this.form.internationalCruiseDTOList = this.form.internationalCruiseVOList;
						if (checkNotEmpty(this.deptNameList)) {
							if(!checkNotEmpty(this.form.organizationName)) {
								this.form.organizationName = this.deptNameList.length > 0 ? this.deptNameList[0].deptName : '';
							}
							// let idx = this.deptNameList.findIndex(item => item.deptName == this.form.organizationName);
							// this.form.organizationNameIndex = idx > -1 ? idx : '';
							// if(!checkNotEmpty(this.form.organizationName)) {
							// 	this.form.organizationName = this.deptNameList.length > 0 ? this.deptNameList[0].deptName : '';
							// 	this.form.organizationNameIndex = this.deptNameList.length > 0 ? 0 : '';
							// }
						}
						this.getDept();
						this.queryTime(); //统计时段
						this.queryRoute();
					});
			}
		},
		methods: {
			//航线查询
			queryRoute() {
				this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransportPermissions/findList', {},
					"GET").then(res => {
					this.shipRouteList = res.data['客班轮'];
					
					this.internationalRouteList = res.data['国际邮轮'];
					this.form.passengerShipDTOList.map(item => {
						let idx = this.shipRouteList.findIndex(item2 => item2.route == item.route);
						item.routeIndex = idx > -1 ? idx : '';
						// console.log('routeIndex ===>',typeof item.routeIndex)
						// if (idx > -1) {
						// 	let _idx = this.shipRouteList[idx].voyageInfoVOList.findIndex(item2 => item2.voyageCode == item
						// 		.voyage);
						// 	item.voyageIndex = _idx > -1 ? _idx : '';
						// }
					})
					this.form.internationalCruiseDTOList.map(item => {
						let idx = this.internationalRouteList.findIndex(item2 => item2.route == item.route);
						item.routeIndex = idx > -1 ? idx : '';
						// if (idx > -1) {
						// 	let _idx = this.internationalRouteList[idx].voyageInfoVOList.findIndex(item2 => item2.voyageCode ==
						// 		item.voyage);
						// 	item.voyageIndex = _idx > -1 ? _idx : '';
						// }
					})
					console.log(this.form)
				})
			},
			//切换管理单位
			bindDeptChange(e) {
				this.form.organizationNameIndex = e.detail.value;
				this.form.organizationName = this.deptNameList[e.detail.value].deptName;
			},
			//层级单位
			getDept() {
				// this.$request(getApp().globalData.baseUrl + '/api/dict/dictList?dictType=industry',{},"GET").then(res =>{
				// 	console.log('行业code===>',res)
				// })
				this.$request(getApp().globalData.baseUrl + '/api/dept/getCurrentAndSubordinateDept?tradeCode=02&deptName=', {},
					"GET").then(res => {
					// console.log('单位===>',res)
					this.treeData = res.data;
					if (this.pageType == 'add') {
						this.form.organizationName = this.deptNameList.length > 0 ? this.deptNameList[0].deptName : '';
						this.form.organizationNameIndex = this.deptNameList.length > 0 ? 0 : '';
						this.selectId1 = this.form.organizationName;
					} else if (this.pageType == 'edit') {
						this.selectId1 = this.form.organizationName;
					}
				})
			},
			//层级单位treee
			showPop() {
				this.selectId = this.selectId1;
				this.$refs.unitPopup.open('bottom')
				this.newArr = []
				this.traversalTree(this.treeData, this.newArr);
				this.treeData = this.newArr
			},
			traversalTree(arrs, that) {
				arrs.map((item, index) => {
					that.push({
						deptId: item.deptId,
						deptName: item.deptName,
						isExpand: item.isExpand,
						isCheckd: false,
						children: []
					})

					if (item.children.length !== 0) {
						this.traversalTree(item.children, that[index].children)
					}
				})
			},
			clickItem(item1) {
				this.selectId = item1.deptName
				this.selectName = item1.deptName
			},
			expandItem(item) {
				this.treeIndex = this.treeData.findIndex(val => val.id == item.id)
				item.isExpand = !item.isExpand
			},
			searchReset() {
				this.$refs.unitPopup.close()
			},
			searchList() {
				this.form.organizationName = this.selectName;
				this.selectId1 = this.selectId;
				this.$refs.unitPopup.close()
			},
			call(tel) {
				uni.makePhoneCall({
					phoneNumber: tel
				});
			},
			//增行
			addRow() {
				let obj = {
					route: "",
					routeIndex: "",
					voyage: "",
					voyageIndex: "",
					voyageNumber: "",
					direction: "",
					passengerCount: "",
					passengerDod: "", //环比
					passengerYoy: "", //同比
				};
				if (this.tabType == 1) {
					//客班轮
					this.form.passengerShipDTOList.push(obj);
				} else {
					//国际邮轮
					this.form.internationalCruiseDTOList.push(obj);
				}
			},
			//删除
			deleteRow(index) {
				if (this.tabType == 1) {
					//客班轮
					this.form.passengerShipDTOList.splice(index, 1);
				} else {
					//国际邮轮
					this.form.internationalCruiseDTOList.splice(index, 1);
				}
			},
			//只保留两位小数
			formatDigit(data) {
				return !checkNotEmpty(data) ? '--' : (data + '').indexOf('.') > -1 && (data + '').substring((data + '').indexOf(
					'.')).length > 2 ? data.toFixed(2) : data;
			},
			//环比同比
			queryYoyMom() {
				if (this.form.statDate == '' || this.form.statPeriod == '') {
					return;
				}
				//客班轮
				this.form.passengerShipDTOList.map((item, index) => {
					if (checkNotEmpty(item.voyage)) {
						this.calcYoyMom(1, index);
					}
				})
				//国际邮轮
				this.form.internationalCruiseDTOList.map((item, index) => {
					if (checkNotEmpty(item.voyage)) {
						this.calcYoyMom(2, index);
					}
				})
				// let _date = getDateStr(new Date(this.form.statDate), -1);
				// this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransport/getYoYAndMoM?statDate=' + this.form
				// 		.statDate + '&statPeriod=' + this.form.statPeriod + '&voyage=' + '&_t=' + Date.parse(new Date()), {}, 'GET')
				// 	.then(res => {
				// 		this.yoyMom = res.data;
				// 		this.calcYoyMom(); //同步更新环比同比
				// 	})
			},
			//环比同比计算
			calcYoyMom(type, index) {
				let _voyage = type == 1 ? this.form.passengerShipDTOList[index].voyage : this.form.internationalCruiseDTOList[
					index].voyage;
				this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransport/getYoYAndMoM?statDate=' +
						this.form
						.statDate + '&statPeriod=' + this.form.statPeriod + '&voyage=' + _voyage + '&_t=' + Date.parse(
					new Date()), {}, 'GET')
					.then(res => {
						let dayData = res.data.minusDays ? res.data.minusDays : {};
						let yearData = res.data.minusYears ? res.data.minusYears : {};
						if (type == 1) {
							//客班轮
							// this.form.passengerShipDTOList[index].voyageNumberDod = this.$calcMom(this.form.passengerShipDTOList[index].voyageNumber,dayData.voyageNumber);
							// this.form.passengerShipDTOList[index].voyageNumberYoy = this.$calcYoy(this.form.passengerShipDTOList[index].voyageNumber,yearData.voyageNumber);
							this.form.passengerShipDTOList[index].passengerDod = this.$calcMom(this.form.passengerShipDTOList[index]
								.passengerCount, dayData.passengerCount);
							this.form.passengerShipDTOList[index].passengerYoy = this.$calcYoy(this.form.passengerShipDTOList[index]
								.passengerCount, yearData.passengerCount);
						} else {
							//国际邮轮
							// this.form.internationalCruiseDTOList[index].voyageNumberDod = this.$calcMom(this.form.internationalCruiseDTOList[index].voyageNumber,dayData.voyageNumber);
							// this.form.internationalCruiseDTOList[index].voyageNumberYoy = this.$calcYoy(this.form.internationalCruiseDTOList[index].voyageNumber,yearData.voyageNumber);
							this.form.internationalCruiseDTOList[index].passengerDod = this.$calcMom(this.form
								.internationalCruiseDTOList[index].passengerCount, dayData.passengerCount);
							this.form.internationalCruiseDTOList[index].passengerYoy = this.$calcYoy(this.form
								.internationalCruiseDTOList[index].passengerCount, yearData.passengerCount);
						}
					})
			},
			//航线选择
			changeRoute(e, index) {
				if (this.tabType == 1) {
					//客班轮
					this.form.passengerShipDTOList[index].voyageIndex = this.form.passengerShipDTOList[index].routeIndex != e
						.detail.value ? '' : this.form.passengerShipDTOList[index].voyageIndex;
					this.form.passengerShipDTOList[index].voyage = this.form.passengerShipDTOList[index].routeIndex != e.detail
						.value ? '' : this.form.passengerShipDTOList[index].voyage;
					this.form.passengerShipDTOList[index].routeIndex = e.detail.value;
					this.form.passengerShipDTOList[index].route = this.shipRouteList[e.detail.value].route;
					this.form.passengerShipDTOList[index].direction = this.shipRouteList[e.detail.value].direction == 1 ? '入青' : this.shipRouteList[e.detail.value].direction == 2 ? '出青' : '';
				} else {
					//国际邮轮
					this.form.internationalCruiseDTOList[index].voyageIndex = this.form.internationalCruiseDTOList[index]
						.routeIndex != e.detail.value ? '' : this.form.internationalCruiseDTOList[index].voyageIndex;
					this.form.internationalCruiseDTOList[index].voyage = this.form.internationalCruiseDTOList[index].routeIndex !=
						e.detail.value ? '' : this.form.internationalCruiseDTOList[index].voyage;
					this.form.internationalCruiseDTOList[index].routeIndex = e.detail.value;
					this.form.internationalCruiseDTOList[index].route = this.internationalRouteList[e.detail.value].route;
					this.form.internationalCruiseDTOList[index].direction = this.internationalRouteList[e.detail.value].direction;
				}
			},
			clickVoyage(){
				if (this.tabType == 1) {
					uni.showToast({
						title:"请先选择航线",
						icon:"none"
					})
				}else{
					uni.showToast({
						title:"请先选择国际邮轮",
						icon:"none"
					})
				}
				
			},
			//航次选择
			changeVoyage(e, index) {
				if (this.tabType == 1) {
					//客班轮
					//判断是否重复选择
					let routeIndex = this.form.passengerShipDTOList[index].routeIndex;
					let idx = this.form.passengerShipDTOList.findIndex(item => item.voyageIndex == e.detail.value);
					if (idx > -1 && this.form.passengerShipDTOList[index].voyageIndex != idx + '') {
						uni.showToast({
							title: '客班轮航次不能重复选择',
							icon: 'none'
						});
					} else {
						this.form.passengerShipDTOList[index].voyageIndex = e.detail.value;
						this.form.passengerShipDTOList[index].voyage = this.shipRouteList[routeIndex].voyageInfoVOList[e.detail
							.value].voyageCode;
					}
				} else {
					//国际邮轮
					//判断是否重复选择
					let routeIndex = this.form.internationalCruiseDTOList[index].routeIndex;
					let idx = this.form.internationalCruiseDTOList.findIndex(item => item.voyageIndex == e.detail.value);
					if (idx > -1 && this.form.internationalCruiseDTOList[index].voyageIndex != idx + '') {
						uni.showToast({
							title: '国际邮轮航次不能重复选择',
							icon: 'none'
						});
					} else {
						this.form.internationalCruiseDTOList[index].voyageIndex = e.detail.value;
						this.form.internationalCruiseDTOList[index].voyage = this.internationalRouteList[routeIndex]
							.voyageInfoVOList[e.detail.value].voyageCode;
					}
				}
			},
			//统计时段切换选择
			changeStatPeriod(e) {
				this.index = e.detail.value;
				this.form.statPeriod = this.array[e.detail.value].dictValue;
				console.log('change 时段', this.form);
				this.queryYoyMom();
			},
			//选择统计日期
			bindDateChange(e) {
				this.form.statDate = e.detail.value;
				this.queryYoyMom();
			},
			//时段
			queryTime() {
				this.$request(getApp().globalData.baseUrl + '/api/dict/dictList?dictType=port_time' + '&_t=' + Date
					.parse(
						new Date()), {}, 'GET').then(res => {
					this.array = res.data;
					if (this.pageType == 'add') {
						let now = new Date();
						//11:00-13:30 默认选择0-12
						let dateStr = getDateStr(now, 0).replaceAll('-', '/');
						// if (new Date(dateStr + ' 11:00').getTime() < new Date().getTime() && new Date().getTime() <
						// 	new Date(dateStr +
						// 		' 13:30').getTime()) {
						// 	this.form.statPeriod = '0012';
						// 	let idx = this.array.findIndex(item => item.dictValue == '0012');
						// 	this.index = idx > -1 ? idx : '';
						// } else {
							this.form.statPeriod = '03'; //默认0-24
							let idx = this.array.findIndex(item => item.dictValue == '03');
							this.index = idx > -1 ? idx : '';
						// }
					} else {
						let idx = this.array.findIndex(item => item.dictValue == this.form.statPeriod);
						this.index = idx > -1 ? idx : '';
					}
					this.queryYoyMom(); //同比环比
				})
			},
			//确认提交
			doSubmit() {
				if (this.btnText = '修改并保存' && new Date(this.form.statDate).getTime() < new Date(getDateStr(new Date(), -1))
					.getTime()) {
					return uni.showToast({
						title: '不能修改昨日以前的历史数据',
						icon: "none"
					})
				}
				
				if (!checkNotEmpty(this.form.statDate) || !checkNotEmpty(this.form.statPeriod)) {
					uni.showToast({
						title: '报送日期和时段不能为空',
						icon: 'none'
					})
					return;
				}
				let checkList = true;
				if (this.form.passengerShipDTOList.length > 0) {
					checkList = this.form.passengerShipDTOList.every(item => {
						return checkNotEmpty(item.route) && checkNotEmpty(item.voyage) && checkNotEmpty(item.voyageNumber) &&
							checkNotEmpty(item.passengerCount)
					})
				}
				if (!checkList) {
					uni.showToast({
						title: '客班轮信息请填写完整',
						icon: 'none'
					})
					return;
				}
				let checkList2 = true;
				if (this.form.internationalCruiseDTOList.length > 0) {
					checkList2 = this.form.internationalCruiseDTOList.every(item => {
						return checkNotEmpty(item.route) && checkNotEmpty(item.voyage) && checkNotEmpty(item.voyageNumber) &&
							checkNotEmpty(item.passengerCount)
					})
				}
				if (!checkList2) {
					uni.showToast({
						title: '国际邮轮信息请填写完整',
						icon: 'none'
					})
					return;
				}
				uni.showModal({
					title: '提示',
					content: this.form.id == undefined ? '您确认提交该条报送数据?' : '您确认将该条数据进行修改?',
					success: (res) => {
						if (res.confirm) {
							console.log('form =====>',this.form)
							this.submitForm();
						}
					}
				})
			},
			submitForm() {
				uni.showLoading({
					title: '提交中...',
					mask: true
				})
				// console.log('form ===>',this.form)
				this.$request(getApp().globalData.baseUrl + '/api/biz/internationalPassengerTransport/saveOrUpdate', this.form,
					'POST').then(res => {
					uni.hideLoading();
					if (res.code == 200) {
						uni.showToast({
							title: '报送提交成功',
							icon: 'none',
							success: () => {
								if (this.form.id == undefined) {
									setTimeout(() => {
										uni.redirectTo({
											url: '/pages/portShipping/waterInternational/list'
										})
									}, 300)
								} else {
									uni.navigateBack();
								}
							}
						})
					}
				}).catch(() => {
					uni.hideLoading();
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.form_warp {
		padding: 30rpx 30rpx 195rpx;

		.form_intro {
			color: #666;
			font-size: 26rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			line-height: 48rpx;
			text-align: center;
			margin-bottom: 20rpx;

			.tel {
				color: #2D8CF0;
				font-weight: bold;
			}
		}

		.form_item_box {
			padding: 30rpx 20rpx 30rpx 30rpx;
			background-color: #fff;
			border-radius: 30rpx;

			//环比同比
			.form_item_rate {
				background: #F6F6F6;
				border: 1px solid #F6F6F6;
				padding: 30rpx;
				margin-bottom: 30rpx;
				border-radius: 30rpx;

				.line {
					height: 1px;
					background-color: #dfdfdf;
					margin: 30rpx 0;
				}

				.rate_item {
					display: flex;
					justify-content: space-between;
					font-size: 24rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;

					.rate_item_label {
						color: #666;
						font-size: 24rpx;
					}

					.rate_item_input {
						color: #333;
						font-size: 28rpx;
					}
				}

				&.danger {
					background-color: #FEF6F3;
					border-color: #F0622D;
				}
			}

			.form_item_title {
				color: #333;
				line-height: 42rpx;
				font-size: 30rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				margin-bottom: 30rpx;
			}

			.form_item_remark {
				margin-bottom: 30rpx;

				.form_item_label {
					color: #333333;
					line-height: 42rpx;
					font-size: 30rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					margin-bottom: 30rpx;
				}

				/deep/ .is-input-border {
					border-radius: 20rpx !important;
					border: 1px solid #c1c1c1 !important;
				}
			}

			.form_item {
				display: flex;
				align-items: center;
				justify-content: space-between;
				line-height: 37rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				margin-bottom: 30rpx;

				.form_item_label {
					width: 260rpx;
					color: #666666;
					font-size: 26rpx;
					word-break: break-all;
				}

				.form_item_input {
					color: #333;
					text-align: right;
					word-break: break-all;

					&.picker {
						flex: 1;
						// display: flex;
						// justify-content: space-between;

						// /deep/ picker {
						// 	flex: 1;
						// }

						.picker_select {
							color: #D4D4D4;
							font-size: 28rpx;
							font-family: PingFang SC-Regular, PingFang SC;
							font-weight: 400;
							text-align: right;
						}
					}
					
					&.disabled{
						color: #D4D4D4;
					}

					//纯展示
					&.text {
						color: #333333;
						line-height: 40rpx;
						font-size: 28rpx;
						font-family: PingFang SC-Regular, PingFang SC;
						font-weight: 400;
					}

					//输入框
					&.form_input {
						/deep/ .is-input-border {
							border: 0 !important;

							.uni-easyinput__content-input {
								height: 35rpx !important;
								text-align: right;
							}
						}

						/deep/ .uni-date-x--border {
							border: 0 !important;

							.uni-date__x-input {
								// height: 35rpx !important;
								text-align: right;
							}
						}
						/deep/.is-disabled{
							background: transparent !important;
							color:#333;
						}
					}
				}
			}
		}
	}

	//收费站
	.station_box {
		display: flex;
		flex-wrap: wrap;
		margin-top: 40rpx;

		.station_item {
			height: 60rpx;
			color: #666666;
			line-height: 60rpx;
			font-size: 26rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			border-radius: 20rpx;
			border: 1rpx solid #C1C1C1;
			padding: 0 20rpx;
			margin-bottom: 40rpx;
			margin-right: 20rpx;

			&.active {
				position: relative;
				color: #1ECE5F;
				border-color: #1ECE5F;
				background: #EBFAF2;

				.tag {
					position: absolute;
					top: 0;
					right: 0;
					width: 34rpx;
					height: 23rpx;
					background: #1ECE5F;
					border-radius: 0rpx 20rpx 0rpx 5rpx;
					text-align: center;
				}
			}
		}
	}

	.foot_btn {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		justify-content: space-between;
		padding: 40rpx 30rpx;
		background-color: #f5f5f5;
		z-index: 11;

		.act_btn {
			width: 690rpx;
			height: 90rpx;
			color: #666666;
			font-size: 28rpx;
			line-height: 90rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			text-align: center;
			background: #F6F6F6;
			border-radius: 100rpx;
			border: 1rpx solid #C1C1C1;

			&.blue {
				color: #fff;
				background: #2D8CF0;
				border-color: #2D8CF0;
			}
		}
	}

	//增行
	.line {
		height: 1px;
		background-color: #E1E1E1;
	}

	.add_btn {
		height: 90rpx;
		line-height: 90rpx;
		color: #2D8CF0;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		text-align: center;
		background: #ECF5FF;
		border-radius: 30rpx;
		border: 2rpx solid #2D8CF0;
		margin-top: 30rpx;
	}

	.tab_box {
		display: flex;
		justify-content: space-around;

		.tab_nav {
			color: #999999;
			line-height: 42rpx;
			font-size: 30rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			padding-bottom: 25rpx;

			&.active {
				position: relative;
				color: #2D8CF0;
				font-weight: bold;

				&::after {
					position: absolute;
					content: '';
					left: 50%;
					bottom: 0;
					width: 74rpx;
					height: 6rpx;
					background: #2D8CF0;
					border-radius: 100rpx;
					margin-left: -37rpx;
				}
			}
		}
	}

	button {
		background-color: #007aff;
		color: #ffffff;
	}

	.pop_conbox {
		.pop_box {
			border-radius: 30rpx 30rpx 0 0;
			background-color: #fff;
			padding: 30rpx;

			.pop_title {
				color: #333333;
				font-size: 32rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				line-height: 45rpx;
				text-align: center;
				margin: 20rpx 0;

				.pop_close {
					float: right;
				}
			}

			.popup-content {
				max-height: 600rpx;
				margin: 30rpx 0;
				overflow-x: hidden;
				overflow-y: auto;

				.tree_item {
					width: 100%;
					display: flex;
					padding: 10rpx 0;

					.item {
						width: 100%;

						// display: flex;
						.first_item {
							width: 100%;

							.first_item_top {
								width: 100%;
								display: flex;
								padding: 10rpx 0;

								&.check {
									background: rgba(45, 140, 240, 0.2);
								}

								.left_item {
									width: 40rpx;
									height: 40rpx;
									display: flex;
									align-items: center;
									justify-content: center;
									margin-right: 10rpx;
								}
							}

						}

						.second_item {
							width: 100%;

							.seco_top_item {
								width: 100%;
								display: flex;
								padding: 10rpx 0 10rpx 40rpx;

								&.check {
									background: rgba(45, 140, 240, 0.2);
								}

								.left_item {
									width: 40rpx;
									height: 40rpx;
									display: flex;
									align-items: center;
									justify-content: center;
									margin-right: 10rpx;
								}
							}

							.third_item {
								width: 100%;

								.third_top_item {
									width: 100%;
									display: flex;
									padding: 10rpx 0 10rpx 80rpx;

									&.check {
										background: rgba(45, 140, 240, 0.2);
									}

									.left_item {
										width: 40rpx;
										height: 40rpx;
										display: flex;
										align-items: center;
										justify-content: center;
										margin-right: 10rpx;
									}
								}

								.four_item {
									width: 100%;

									.four_item_item {
										width: 100%;
										display: flex;
										padding: 10rpx 0 10rpx 120rpx;

										&.check {
											background: rgba(45, 140, 240, 0.2);
										}

										.left_item {
											width: 40rpx;
											height: 40rpx;
											display: flex;
											align-items: center;
											justify-content: center;
											margin-right: 10rpx;
										}
									}
								}
							}
						}

					}
				}
			}

			.btn_box {
				width: 100%;
				height: 120rpx;
				display: flex;
				margin-top: 20px;
				align-items: center;
				justify-content: space-between;

				.btn {
					width: 290rpx;
					height: 90rpx;
					background: #FFFFFF;
					border-radius: 100rpx;
					border: 1rpx solid #C1C1C1;
					color: #666;
					font-size: 28rpx;
					line-height: 88rpx;
					text-align: center;

					&:last-child {
						background: #2D8CF0;
						color: #FFFFFF;
						border-color: #2D8CF0;
					}
				}
			}
		}
	}
</style>