<!-- 开发时报表预览 -->
<template>
	<el-dialog
		v-model="visible"
		title="请选择数据"
		width="70%"
		:before-close="handleClose"
		destroy-on-close
		center
		:modal-append-to-body="false"
		:close-on-click-modal="false"
	>
		<div>
			<el-form :inline="true" :model="state.queryForm" @keyup.enter="getDataList()">
				<el-form-item v-for="(col, index) in dataForm.reportSearchData">
					<el-input
						v-if="col.searchMode == 10 && !col.dictCode && col.searchHidden!=1"
						v-model="state.queryForm[col.columnJavaName]"
						clearable
						:placeholder="col.columnLabel"
					/>
					<fast-select
						v-if="col.searchMode == 10 && col.dictCode && col.searchHidden!=1"
						v-model="state.queryForm[col.columnJavaName]"
						:dict-type="col.dictCode"
						clearable
						:placeholder="col.columnLabel"
					></fast-select>
					<fast-select
						v-if="col.searchMode == 30 && col.dictCode && col.searchHidden!=1"
						v-model="state.queryForm[col.columnJavaName]"
						:dict-type="col.dictCode"
						clearable
						:multiple="true"
						:placeholder="col.columnLabel"
					></fast-select>
					<el-date-picker
						v-if="col.searchMode == 20 && col.searchHidden!=1"
						v-model="state.queryForm[col.columnJavaName]"
						type="datetimerange"
						align="right"
						unlink-panels
						:title="col.columnLabel"
						range-separator="至"
						:start-placeholder="col.columnLabel + '开始'"
						:end-placeholder="col.columnLabel + '结束'"
						format="YYYY-MM-DD"
						value-format="YYYY-MM-DD"
					>
					</el-date-picker>
				</el-form-item>
				<el-form-item>
					<el-button @click="getDataList()">查询</el-button>
				</el-form-item>
			</el-form>
			<el-table
				ref="dialogTable"
				v-loading="state.dataListLoading"
				show-overflow-tooltip
				:data="state.dataList"
				border
				stripe
				style="width: 100%"
        row-key="id"
				:height="tableHeight"
        :tree-props="treeProps"
				@selection-change="selectionChangeHandle"
      >
				<el-table-column  type="selection" header-align="center" align="center" width="50"></el-table-column>
				<el-table-column
					v-for="col in dataForm.reportColumnData"
					:key="col.columnJavaName"
					:label="col.columnLabel"
					:width="col.columnWidth ? col.columnWidth : 120"
					:prop="col.columnJavaName"
					:sortable="col.isOrder == 1"
				>
					<template v-if="col.dictCode" #default="scope">
						<span v-html="getDictLabelList(col.dictCode, scope.row[col.columnJavaName])"></span>
					</template>
				</el-table-column>
			</el-table>
			<el-row>
				<el-col :span="24" align="right">
					<el-pagination
						:current-page="state.page"
						:page-sizes="state.pageSizes"
						:page-size="state.limit"
						:total="state.total"
						layout="total, sizes, prev, pager, next, jumper"
						@size-change="sizeChangeHandle"
						@current-change="currentChangeHandle"
					>
					</el-pagination>
				</el-col>
			</el-row>

			<form-dev-review-drawer3 ref="formDrawerRef" @refresh-data-list="getDataList"></form-dev-review-drawer3>
		</div>
		<template #footer v-if="dataForm.checkBackBtnShow">
			<el-button type="primary" @click="clearRow()">清除</el-button>
			<el-button type="primary" @click="addRow()">确定</el-button>
			<el-button type="primary" @click="handleClose()">取消</el-button>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
import { onMounted, reactive, ref, watchEffect } from 'vue'
import { useCrud } from '@/hooks'
import { useRouter } from 'vue-router'
import { IHooksOptions } from '@/hooks/interface'
import {getReportConfig, getReportIdByReportCode} from '@/views/ebo/fast/api/report'
import { getDictLabelList } from '@/utils/tool'
import FormDevReviewDrawer3 from '@/views/ebo/fast/form/formDevReviewDrawer3.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { defaultBtnServer, delInfo } from '@/views/ebo/fast/api/formDevReview'

const router = useRouter()
const visible = ref(false)
const emit = defineEmits(['confirmAddRow', 'close'])

let reportId = ''
debugger
const treeProps = reactive({
  checkStrictly: true,
})
const formDrawerRef = ref()
const dialogTable = ref()
const dataForm = reactive({
	showDrawer: false,
	showDrawerData: {},
	showDialog: false,
	showDialogData: {},
  isTree: 0,
	showEdit: false,
  checkBackBtnShow:true,
	formShowFlag: false,
	showResetPassword: false,
	loading: false,
	editId: null,
  checkMany:false,
	pagination: {
		total: 0,
		size: 20,
		current: 1
	},
	reportCode: '',
	condition: {
		whereMap: {}
	},

	condition2: {},
	tableData: [],
	reportColumnData: [],
	reportSearchData: [],
	reportSearchData2: [],
	fastFormBtnModelList: [],
	fastFormBtnList: [],
	fastFormBtnRowList: [],
	isShowRowCz: false
})

const tableHeight = ref(300)
const getTableHeight = () => {
	let tableH = 47 + 15 + 40 + 190 + 190 //距离页面下方的高度
	let tableHeightDetil = window.innerHeight - tableH
	if (tableHeightDetil <= 300) {
		tableHeight.value = 300
	} else {
		tableHeight.value = window.innerHeight - tableH
	}
}
onMounted(() => {})

watchEffect(() => {
	getTableHeight()
})
const state: IHooksOptions = reactive({
	dataListUrl: '/fast/report/getReportPage',
	deleteUrl: '/fast/report',
	createdIsNeed: false,
	queryMethod: 'post',
	queryForm: {
		fastReportCode: ''
	}
})

const init = (rId?: number, formObj: any, checkMany: any) => {
  state.queryForm = {}
	visible.value = true
	reportId = rId
  dataForm.checkMany = checkMany;
  if(formObj && formObj['checkBackBtnShow']==false){
    dataForm.checkBackBtnShow = false
  }else{
    dataForm.checkBackBtnShow = true
  }
	// id 存在则为修改
	if (rId) {
		getReport(rId, formObj)

	}
}

const initCode = (rCode?: number, formObj: any) => {
  if(formObj && formObj['checkBackBtnShow']==false){
    dataForm.checkBackBtnShow = false
  }else{
    dataForm.checkBackBtnShow = true
  }
  var data = {reportCode:rCode}
  getReportIdByReportCode(data).then(reponse => {
    visible.value = true
    reportId = reponse.data.id
    getReport(reportId, formObj)
  })
}

const showBtnForm = (btnData: any, rowData: any, rowIndex: any) => {
	var id = ''
	if (rowData && rowData.id) {
		id = rowData.id
	}
	if (btnData.serviceType == 30 && id != '') {
		ElMessageBox.confirm('请确定要执行此操作吗？', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning'
		}).then(() => {
			var obj = { devFormCode: btnData.btnLinkForm, btnCode: btnData.btnCode, btnFormData: { id: id } }
			delInfo(obj).then(res => {
				ElMessage.success('删除成功')
				getDataList()
			})
		})
	} else if ((btnData.serviceType == 10 || btnData.serviceType == 20 || btnData.serviceType == 25) && btnData.btnLinkType == 10) {
		//弹框方式
		if (btnData.btnLinkFormShow == 10) {
			dataForm.showDialog = true
			if (rowData && rowData.id > 0) {
				rowData.devFormCode = btnData.btnLinkForm
				dataForm.showDialogData = rowData
			} else {
				dataForm.showDialogData = { devFormCode: btnData.btnLinkForm, id: 0 }
			}
		} else if (btnData.btnLinkFormShow == 20) {
			dataForm.showDrawer = true

			if (rowData && rowData.id) {
				rowData.devFormCode = btnData.btnLinkForm
				dataForm.showDrawerData = rowData
			} else {
				dataForm.showDrawerData = { devFormCode: btnData.btnLinkForm, id: '' }
			}
			let isLook = 0
			if (btnData.serviceType == 25) {
				isLook = 1
			}
			formDrawerRef.value.init(btnData.btnLinkForm, dataForm.showDrawerData, isLook, btnData.btnCode)
		} else {
			router.push({ path: '/ebo/fast/form/formDevReview/' + btnData.btnLinkForm + '/' + id })
		}
	} else if (btnData.serviceType == 55) {
		//无逻辑请求
		var confirmContent = '请确定要执行此操作吗？'
		if (btnData.btnConfirmContent && btnData.btnConfirmContent != '') {
			confirmContent = btnData.btnConfirmContent
		}
		ElMessageBox.confirm(confirmContent, '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning'
		}).then(() => {
			var obj = { devFormCode: btnData.btnLinkForm, btnCode: btnData.btnCode, btnFormData: {} }
			if (btnData.btnShowType == '20') {
				obj.btnFormData.ids = state.dataListSelections
			} else {
				obj.btnFormData.id = id
			}
			defaultBtnServer(obj).then(res => {
				ElMessage.success('操作成功')
				getDataList()
			})
		})
	}
}

const getReport = (id: string, formObj: any) => {
	var data = { id: id }
	dataForm.reportSearchData = []
	dataForm.reportSearchData2 = []
	dataForm.reportColumnData = []
	dataForm.fastFormBtnList = []
	dataForm.fastFormBtnRowList = []
	getReportConfig(data).then(reponse => {
		document.title = reponse.data.reportName
    dataForm.isTree = reponse.data.isTree
    if (dataForm.isTree == 1) {
      state.limit = 10000
    }
		state.queryForm.fastReportCode = reponse.data.reportCode
		var data = reponse.data.fastReportItemList
		if (reponse.data.fastFormBtnModelList) {
			dataForm.fastFormBtnModelList = reponse.data.fastFormBtnModelList
			dataForm.fastFormBtnModelList.forEach(item => {
				if (item.btnShowType == 10) {
					dataForm.isShowRowCz = true
					dataForm.fastFormBtnRowList.push(item)
				} else {
					dataForm.fastFormBtnList.push(item)
				}
			})
		}
		for (var i = 0; i < data.length; i++) {
			if (data[i].isShow == 1) {
				dataForm.reportColumnData.push(data[i])
			}
			if (data[i].isSearch == 1) {
				dataForm.reportSearchData.push(data[i])
				if (data[i].searchDefaultValue && data[i].searchDefaultValue != '') {
					state.queryForm[data[i].columnJavaName] = data[i].searchDefaultValue
				}
				dataForm.reportSearchData2.push(data[i].columnJavaName)
			}
		}
		var data2 = reponse.data.fastReportSeachList
		for (var i = 0; i < data2.length; i++) {
			if (data2[i].isSearch == 1) {
				dataForm.reportSearchData.push(data2[i])
				if (data2[i].searchDefaultValue && data2[i].searchDefaultValue != '') {
					state.queryForm[data2[i].columnJavaName] = data2[i].searchDefaultValue
				}
				dataForm.reportSearchData2.push(data2[i].columnJavaName)
			}
		}
		if (id == '4092cf55db054b7c67d0a45a3eda737d') {
			state.queryForm['orderNo'] = formObj.orderNo
		}
    if(formObj){
      Object.assign(state.queryForm,formObj)
    }
		//商品列表有排序设置大些
		if (id == '4a31a9d85f9227038061f714217c489b') {
			state.limit = 20
		}
		if (reponse.data.isUrl == '1') {
			state.dataListUrl = reponse.data.reportUrl
		} else {
			state.dataListUrl = '/fast/report/getReportPage'
		}
		getDataList()
	})
}

const clearRow = () => {
	const selectData = []
	visible.value = false
	emit('confirmAddRow', selectData)
}
const addRow = () => {
	//const selectData = state.dataListSelections
	const selectData = dialogTable.value.getSelectionRows()
	if (selectData.length == 0) {
		return ElMessage.warning('请选择数据')
	}
  if(!dataForm.checkMany){
    if (selectData.length >1) {
      return ElMessage.warning('只能选择一条数据')
    }
  }
	visible.value = false
	emit('confirmAddRow', selectData)
}
const handleClose = () => {
	visible.value = false
	emit('close')
}
defineExpose({
	init,initCode
})
const { getDataList, selectionChangeHandle, sizeChangeHandle, currentChangeHandle, deleteBatchHandle } = useCrud(state)
</script>

<style scoped></style>
