<template>
	<!-- 巡检管理 -->
	<view class="inspection-management">
		<uni-nav-bar :fixed="true" background-color="rgba(214, 240, 255, 0.0)" status-bar rightWidth="300">
			<block slot="left">
				<view class="" @click="back">
					<text class="iconfont icon-fanhui"></text>
				</view>
			</block>
			<block slot="right" class="nav-right">
				<view class="header-buttons">
					<view class="button" @click="clickInspection(1)">机房巡检</view>
					<!-- <view class="button" @click="clickInspection(2)">井道巡检</view> -->
				</view>
			</block>
		</uni-nav-bar>
		<!-- 搜索项 -->
		<SearchCom @change="change" />
		<!-- 结果 -->
		<view class="inspection-management-content">
			<view class="count-tatal">
				<text class="num">{{ countNum || 0 }}条</text>
				<text calss="">查询结果</text>
			</view>

			<view class="month-list">
				<!-- 每月记录 -->
				<view class="month-record-item" v-for="(item, index) in list" :key="index">
					<view class="seconed-title">
						{{index}}
					</view>
					<view class="inspect-list">
						<InspectionItem v-for="(its,idx) in item" :details="its" @longpress="onLongPress" />
					</view>
				</view>

				<Empty v-if="list.length == 0" />
			</view>
		</view>

		<!-- 开始巡检 -->
		<!-- <view class="inspection-button" @click="toPage">开始巡检</view> -->
		<view class="inspection-button" @click="openDialog(true)">同步数据</view><!-- 打包弹窗 -->
		<Dialog v-show="isDialog" :list="propList" @close="openDialog(false)"></Dialog>
	</view>
</template>

<script>
	import {
		addLog,
		getLogContent,
		LOG_TYPE_ENUM,
	} from "@/utils/IoReadingAndWriting.js";
	import SearchCom from "@/components/searchCom/index.vue";
	import InspectionItem from "@/components/inspectionItem/index.vue";
	import {
		getDarft
	} from "@/request/index.js";
	import Dialog from "./dialog.vue";
	import {
		getAllInspections
	} from "@/request/index.js";
	import Empty from "@/components/empty/index.vue";
	import moment from "moment";
	import inspectApi from "@/api/inspect";
	export default {
		components: {
			SearchCom,
			InspectionItem,
			Dialog,
			Empty,
		},
		data() {
			return {
				isDialog: false, //
				list: [], // 展示数据
				propList: [],
				all_data: [], // 所有数据
				searchForm: {
					// 搜索条件
				},
				countNum: 0, // 统计查询总数
				currentIndexToDelete: null
			};
		},
		async mounted() {
			this.init(this.searchForm)

		},
		computed: {
			userInfo() {
				return this.$store.state.now_user || {};
			},
		},
		methods: {
			// 返回
			back() {
				uni.navigateTo({
					url: "/pages/home/home",
				});
			},
			clickInspection(type) {
				if (type == 1) {
					uni.navigateTo({
						url: "/pages/inspectionContent/inspectionContentList",
					});
				} else {
					uni.navigateTo({
						url: "/pages/shaftInspection/shaftInspectionList",
					});
				}
			},
			async init() {
				console.log(this.userInfo, '==================')
				let res = await inspectApi.selectDataForTime({
					...this.searchForm,
					userId: this.userInfo.userId
				})
				this.propList = res.filter(e => e.synFlag == 0)
				this.countNum = res.length
				const resultMap = {};
				res.forEach(e => {
					if (e.createTime) {
						const createTime = parseInt(e.createTime, 10);
						const yearMonth = moment(createTime).format('YYYY年M月');
						e.yearMonth = yearMonth
						if (!resultMap[yearMonth]) {
							resultMap[yearMonth] = [];
						}

						// 将当前记录添加到对应的 yearMonth 数组中
						resultMap[yearMonth].push({
							...e
						});
					}
				});
				this.list = resultMap
				return
			},

			openDialog(show) {
				this.isDialog = show;
				if (!show) {
					this.init();
				}
			},
			change(e) {
				this.searchForm = e;
				if (e.inspectionTime && e.inspectionTime.length == 0) {
					delete this.searchForm.inspectionTime
				}
				console.log('搜索', this.searchForm)
				this.init();
			},
			async onLongPress(item) {
				let rs = await inspectApi.batchRemove(item.id)
				if (rs) {
					// 生成日志
					const logContent = getLogContent(
						LOG_TYPE_ENUM.delete,
						`${item.userName}(${item.inspectionCode})`,
						"巡检模块"
					);
					this.$logApi.addlog(logContent)
					const log_list = this.$store.state.log_list;
					log_list.push(logContent);
					this.$store.commit("SET_LOG_LIST", log_list);
					addLog(log_list).then((res) => {});
					await this.init()
				}

			},
			deleteItem() {
				if (this.currentIndexToDelete !== null) {
					this.list.splice(this.currentIndexToDelete, 1);
					this.currentIndexToDelete = null; // 重置索引
				}
			},
			toPage() {
				uni.showLoading();

				getDarft()
					.then((res) => {
						const darf_data = res || {};

						if (darf_data.inspectionType == 1) {
							uni.navigateTo({
								url: `/pages/inspectionContent/inspectionContent?isDarf=1`,
							});
						} else if (darf_data.inspectionType == 2) {
							uni.navigateTo({
								url: `/pages/shaftInspection/shaftInspection?isDarf=1`,
							});
						} else {
							uni.navigateTo({
								url: "/pages/inspection/inspFirst",
							});
						}
						uni.hideLoading();
					})
					.catch((error) => {
						if (error.code == 0) {
							uni.showToast({
								title: error.msg,

								icon: "none",
								duration: 1000,
							});
						}
						uni.navigateTo({
							url: "/pages/inspection/inspFirst",
						});

						uni.hideLoading();
					});
			},
		},
	};
</script>
<style scoped lang="less">
	.uni-nav-bar-text {
		height: 28.8px;
		width: 28.8px;
		background: #ffffff;
		border: 0.32px solid rgba(224, 224, 224, 1);
		border-radius: 14.4px;
		color: #333;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		z-index: 999;

		.iconfont {
			font-size: 16px;
			line-height: 28.8px;
		}
	}

	.nav-right {
		width: 192px;
	}

	.header-buttons {
		display: flex;
		align-items: center;
		margin-left: auto;

		.button {
			width: 89.6px;
			height: 28.8px;
			background: #ffffff;
			border-radius: 14.4px;
			margin-left: 12.8px;
			font-family: PingFangSC-Regular;
			font-size: 12.8px;
			color: #000000;
			line-height: 28.8px;
			font-weight: 400;
			text-align: center;
		}
	}

	.inspection-management {
		background-image: linear-gradient(115deg, #e8f0fb 0%, #e1ebfa 100%);
		padding: 0 25.6px;

		.inspection-management-content {
			.count-tatal {
				font-family: PingFangSC-Medium;
				margin: 12.8px 0px 19.2px;
				font-size: 11.2px;
				color: #4a4a4a;
				font-weight: 400;
				height: 22.4px;
				line-height: 22.4px;

				.num {
					font-size: 16px;
					color: #3774f6;
					line-height: 22.4px;
					font-weight: 500;
					margin-right: 1.6px;
				}
			}

			.month-list {
				height: calc(100vh - 20.8px - 12.8px - 6.4px - 28.8px - 49.6px - 25px);
				overflow: auto;

				// padding-bottom: 112px;
				.seconed-title {
					font-size: 16px;
					color: #000000;
					line-height: 22.4px;
					font-weight: 500;
					margin-bottom: 9.6px;
				}

				.month-record-item {
					margin-bottom: 19.2px;

					&:last-of-type {
						margin: 0;
					}

					.inspect-list {
						display: flex;
						flex-wrap: wrap;
						justify-content: space-between;
					}
				}
			}
		}

		.inspection-button {
			display: flex;
			align-items: center;
			justify-content: center;
			position: fixed;
			bottom: 48px;
			width: 192px;
			height: 38.4px;
			left: 50%;
			color: #fff;
			transform: translateX(-50%);
			background-image: linear-gradient(180deg, #3773f6 0%, #2c57f6 99%);
			box-shadow: 0px 8px 19.2px 0px rgba(51, 104, 246, 0.24);
			border-radius: 21.6px;
		}
	}
</style>