<!-- pages/snapshot/snapshotManage.vue -->
<template>
	<view class="mainBox">
		<uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="随手拍管理" @clickLeft="back" />

		<view class="top-wrapper">
			<uni-forms :modelValue="where" label-width="100px" class="search-form">
	
				<uni-forms-item label="处理结果">
					<uni-data-select v-model="where.handleResult" :localdata="resultOptions" placeholder="全部"
						clearable />
				</uni-forms-item>
	
			</uni-forms>
			<button class="search_btn" @click="handleSearch">搜索</button>
		</view>

		<view class="wrapper">
			<u-list @scrolltolower="scrolltolower" class="listContent">
				<view v-for="(item, idx) in tableList" :key="item.id" style="position: relative">
					<myCard :item="item" :index="idx + 1" :btnList="manageBtnList" :columns="columns"
						:title="item.description" :status="statusMap[item.handleResult]" @goDetail="goDetail"
						@handleProcess="handleProcess" />
				</view>
				<view style="width: 100%; height: 40rpx"></view>
				<view style="margin-top: 20vh" v-if="tableList.length == 0">
					<u-empty iconSize="150" textSize="32" text="暂无数据" />
				</view>
			</u-list>
		</view>

		<snapshot-dialog ref="snapshotDialog" @rectify="onRectify" @discard="onDiscard" />
		<discard-dialog ref="discardDialogRef" @confirm="doDiscard" />
		<!-- <hazardDialog ref="hazardDialogRef" @reload="doRectify" /> -->
	</view>
</template>

<script>
	import myCard from "@/components/myCard.vue";
	import snapshotDialog from './components/snapshotDialog.vue';
	import discardDialog from './components/discardDialog.vue';
	// import hazardDialog from '@/views/hazardManagement/hazardDialog.vue';
	import {
		getList,
		discard,
		handle
	} from '@/api/snapshot/index.js';

	export default {
		components: {
			myCard,
			snapshotDialog,
			discardDialog,
			// hazardDialog
		},
		data() {
			return {
				where: {
					reporterName: '',
					handleResult: '',
					createTime: ''
				},
				resultOptions: [{
						value: 0,
						text: '待处理'
					},
					{
						value: 1,
						text: '下发整改'
					},
					{
						value: 2,
						text: '废弃'
					}
				],
				statusMap: {
					0: '待处理',
					1: '已整改',
					2: '已废弃'
				},
				columns: [
					[{
						prop: 'location',
						label: '位置',
						className: 'perce100'
					}],
					[{
						prop: 'problemDeptName',
						label: '所属部门',
						className: 'perce100'
					}],
					[{
						prop: 'reporterName',
						label: '上报人',
						className: 'perce100'
					}],
					[{
						prop: 'createTime',
						label: '上报时间',
						className: 'perce100'
					}],
					[{
						prop: 'handleResult',
						label: '处理结果',
						className: 'perce100',
						formatter: (row) => this.statusMap[row.handleResult]
					}]
				],
				tableList: [],
				page: 1,
				size: 10,
				isEnd: false,
				currentId: null
			};
		},
		computed: {
			manageBtnList() {
				return [{
					name: '处理',
					apiName: 'handleProcess',
					btnType: 'primary',
					judge: [{
						fn: (item) => item.handleResult === 0
					}]
				}];
			}
		},
		onLoad() {
			this.getList();
		},
		methods: {
			back() {
				uni.navigateBack();
			},
			goDetail(item, type) {
				this.$refs.snapshotDialog.open(type, item);
			},
			handleProcess(row) {
				this.$refs.snapshotDialog.open('handle', row);
			},
			onRectify(data) {
				this.currentId = data.id;
				this.$refs.hazardDialogRef.open('add', '', 'report', {
					sourceType: 4,
					sourceId: data.id,
					sourceName: '随手拍',
					foundUserName: data.reporterName,
					foundUserId: data.reporterId,
					foundTime: data.createTime,
					description: data.location + data.description,
					reportAttachments: data.attachment
				});
			},
			doRectify(opinion) {
				handle({
					id: this.currentId,
					handleOpinion: opinion,
					invHazardId: '下发整改'
				}).then(() => {
					uni.showToast({
						title: '下发整改成功',
						icon: 'success'
					});
					this.reloadList();
				});
			},
			onDiscard(data) {
				this.$refs.discardDialogRef.open(data);
			},
			doDiscard({
				id,
				handleOpinion
			}) {
				discard({
					id,
					handleOpinion
				}).then(() => {
					uni.showToast({
						title: '废弃成功',
						icon: 'success'
					});
					this.reloadList();
				});
			},
			reloadList() {
				this.page = 1;
				this.isEnd = false;
				this.getList();
			},
			handleSearch() {
				this.page = 1;
				this.isEnd = false;
				this.getList();
			},
			async getList() {
				if (this.isEnd) return;
				uni.showLoading({
					title: '加载中'
				});
				try {
					const data = {
						pageNum: this.page,
						size: this.size,
						reporterName: this.where.reporterName || undefined,
						handleResult: this.where.handleResult !== '' ? this.where.handleResult : undefined,
						createTime: this.where.createTime || undefined
					};
					const res = await getList(data);
					const newList = res.rows || [];
					if (this.page === 1) this.tableList = newList;
					else this.tableList.push(...newList);
					this.isEnd = newList.length < this.size;
					this.page += 1;
				} catch (e) {
					console.error(e);
				} finally {
					uni.hideLoading();
				}
			},
			scrolltolower() {
				if (!this.isEnd) this.getList();
			}
		}
	};
</script>

<style lang="scss" scoped>
	@import './common-style.scss';
</style>