<template>
	<div>
		<SearchBox ref="SearchBoxRef" formName="query" :formData="query" @PopupNo="PopupNo" @reset="reset">
		</SearchBox>

		<ButtonBar @search="handleSearch" @add="handleAdd" @upload="handleUpload"></ButtonBar>

		<el-card :body-style="cardBodyStyle">
			<el-table :data="tableData" border highlight-current-row @selection-change="handleSelectionChange"
				height="63vh">
				<el-table-column type="selection" fixed></el-table-column>
				<el-table-column type="index" label="序号" align="center" width="60" fixed>
					<template #default="scope">
						<span>{{ scope.$index + (currentPage - 1) * pageSize + 1 }}</span>
					</template>
				</el-table-column>
				<el-table-column v-if="true" prop="contrNo" label="合同编号" width="150" header-align="center"
					align="center" show-overflow-tooltip fixed>
				</el-table-column>
				<el-table-column v-if="true" prop="contrNm" label="合同名称" width="180" header-align="center"
					align="center" show-overflow-tooltip fixed>
				</el-table-column>
				<el-table-column v-if="true" prop="supplierNm" label="交易方名称" width="250" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="contrTy" label="合同类型" width="100" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="conSts" label="合同状态" width="120" header-align="center" align="center"
					show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="khContrNo" label="对方合同编号" width="150" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="approveDt" label="审批结束时间" width="150" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="delvDate" label="预计交货日期" width="120" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="invMth" label="结算方式" width="100" header-align="center" align="center"
					show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="analyDataAccord" label="化验结算依据" width="120" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="weightDataAccord" label="计量结算依据" width="120" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="priceDcnMth" label="定价方式" width="100" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="delvMth" label="交货方式" width="100" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="delvPlace" label="交货地点" width="120" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="ifAnnual" label="是否长协" width="100" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="ifBid" label="是否招投标" width="100" header-align="center" align="center"
					show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="false" prop="salMth" label="销售方式" width="100" header-align="center" align="center"
					show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="signReqNo" label="签约请示" width="120" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="totalAmt" label="合同金额" width="100" header-align="center"
					align="right" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="qty" label="重量" width="120" header-align="center" align="right"
					show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="contrReq" label="合同要求" width="100" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="contrDt" label="合同日期" width="120" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="checkYn" label="争议所在地法院" width="150" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="riskInfo" label="风险提示" width="100" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="tempNm" label="合同模板名称" width="120" header-align="center"
					align="center" show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="addTime" label="录入日期" width="120" header-align="center"
					align="center" show-overflow-tooltip :formatter="formatter">
				</el-table-column>
				<el-table-column v-if="true" prop="addName" label="录入人" width="100" header-align="center" align="center"
					show-overflow-tooltip>
				</el-table-column>
				<el-table-column v-if="true" prop="archiveFlag" label="是否归档" width="100" header-align="center"
					align="center" show-overflow-tooltip fixed="right" :formatter="formatter">
				</el-table-column>
				<el-table-column label="操作" header-align="center" align="center" width="200px" fixed="right">
					<template #default="{ row }">
						<el-button plain type="warning" @click="handleArchive(row)"
							v-if="row.workId !== '' && row.conSts === 'B' && row.archiveFlag !== '1'">归档</el-button>
						<el-button plain type="danger" @click="handleArchiveCancel(row)"
							v-if="row.workId !== '' && row.conSts === 'B' && row.archiveFlag === '1'">取消归档</el-button>
						<el-button plain type="primary" @click="handleDetail(row)"
							v-if="row.workId !== ''">详情</el-button>
					</template>
				</el-table-column>
			</el-table>
		</el-card>

		<el-card :body-style="cardBodyStyle">
			<el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="pageSizes" :total="totalRows"
				background="background" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
				@current-change="handleCurrentChange">
			</el-pagination>
		</el-card>

		<el-dialog :close-on-click-modal="false" draggable title="附件" v-model="dialogVisibleAttachment" width="1200px"
			top="5vh" @open="openDialog">
			<Attachment ref="AttachmentRefManual" :fId="fId"></Attachment>
		</el-dialog>
	</div>
</template>

<script setup>
import ButtonBar from '@/components/ButtonBar.vue'

import {
	ref,
	reactive,
	onMounted,
	getCurrentInstance
} from 'vue'

const {
	proxy
} = getCurrentInstance()

import tools from '@/tools'

const cardBodyStyle = ref(tools.style.card)
const inputStyle = ref(tools.style.input)


import Attachment from '@/components/Attachment.vue'
import { ElMessage } from 'element-plus';

onMounted(() => {
	// getMenuTable()
	getDictList()
	handleSearch()
})

/**
 * 查询表格字段
 */
// const column = ref([])
// const getMenuTable = () => {
// 	var url = 'framework/MenuTable/queryMenuTable'
// 	var param = {
// 		menuId: localStorage.getItem('menuId'),
// 		tName: 'tableDate'
// 	}
// 	proxy.$axios.post(url, param).then(response => {
// 		if (response.data.code == '0') {
// 			column.value = response.data.data
// 		} else {
// 			ElMessage({
// 				type: 'error',
// 				message: '操作失败' + response.data.msg,
// 			});
// 		}
// 	});
// }
/**
 * 查询表格
 */


/**
 *  查询字典
 */
const dicList = ref({
	CONTRACT_TYPE: [],
	contrSts: [],
	SAL_INV_MTH: [],
	PRICE_DCN_MTH: [],
	DELV_MTH: [],
	TMS_FTRANTYPE: [],
	WEIGHT_DATA_ACCORD: [],
	ANALY_DATA_ACCORD: [],
	SAL_SAL_MTH: [],
	COM_YN: [],
	CHECK_YN: []
})
const getDictList = () => {
	var url = 'framework/Common/querySelectorList'
	var param = {
		type: JSON.stringify(['CONTRACT_TYPE', 'contrSts', 'SAL_INV_MTH', 'PRICE_DCN_MTH', 'DELV_MTH', 'TMS_FTRANTYPE', 'WEIGHT_DATA_ACCORD', 'ANALY_DATA_ACCORD', 'SAL_SAL_MTH', 'COM_YN', 'CHECK_YN'])
	}
	proxy.$axios.get(url, param).then(response => {
		if (response.data.code == '0') {
			dicList.value = response.data.data
		} else {
			ElMessage.error('操作失败！' + response.data.msg)
		}
	})
}
const formatter = (row, column, cellValue, index) => {
	if (!cellValue || cellValue == null || cellValue == '') {
		return cellValue
	}
	switch (column.property) {
		case 'contrTy':
			cellValue = dicList.value.CONTRACT_TYPE.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'conSts':
			cellValue = dicList.value.contrSts.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'invMth':
			cellValue = dicList.value.SAL_INV_MTH.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'priceDcnMth':
			cellValue = dicList.value.PRICE_DCN_MTH.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'delvMth':
			cellValue = dicList.value.DELV_MTH.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'weightDataAccord':
			cellValue = dicList.value.WEIGHT_DATA_ACCORD.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'analyDataAccord':
			cellValue = dicList.value.ANALY_DATA_ACCORD.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'salMth':
			cellValue = dicList.value.SAL_SAL_MTH.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'ifAnnual':
			cellValue = dicList.value.COM_YN.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'ifBid':
			cellValue = dicList.value.COM_YN.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'checkYn':
			cellValue = dicList.value.CHECK_YN.find(item => item.dicCode == cellValue)?.dicName
			break
		case 'addTime':
			cellValue = cellValue.split(' ')[0]
			break
		case 'archiveFlag':
			cellValue = cellValue === '1' ? '是' : '否'
			break
	}

	return cellValue
}
/**
 *  查询字典
 */


const query = ref({
	contrTy: '',
	contrNo: '',
	contrNm: '',
	khContrNo: '',
	supplierNm: '',
	contrDt: '',
	conSts: ['B']
})
const tableData = ref([])
const handleSearch = () => {
	currentPage.value = 1
	getTableData()
}

const getTableData = () => {
	var url = 'cot/Head/query'
	var param = {
		page: currentPage.value,
		rows: pageSize.value,
		params: JSON.stringify(query.value)
	}
	proxy.$axios.get(url, param).then(response => {
		if (response.data.code == '0') {
			tableData.value = response.data.data.records
			totalRows.value = response.data.data.total
		} else {
			ElMessage.error('操作失败！' + response.data.msg)
		}
	})
}
/**
 *   查询
 */

/**
 * 分页
 */
const currentPage = ref(1)
const totalRows = ref(0)
const pageSizes = ref([5, 10, 20, 30, 40])
const pageSize = ref(10)
const handleSizeChange = (val) => {
	pageSize.value = val
	getTableData()
}
const handleCurrentChange = (val) => {
	currentPage.value = val
	getTableData()
}
/**
 * 分页
 */

const handleArchive = (row) => {

	ElMessageBox.confirm(
		'合同是否归档?',
		'提示', {
		confirmButtonText: '确认',
		cancelButtonText: '取消',
		type: 'warning',
		draggable: true,
	}).then(() => {
		var url = 'cot/Head/archive'
		var param = {
			archiveFlag: '1',
			json: JSON.stringify(row)
		}

		proxy.$axios.post(url, param).then(response => {
			if (response.data.code == '0') {
				ElMessage({
					type: 'success',
					message: '操作成功!',
				});
				getTableData()
			} else {
				ElMessage({
					type: 'error',
					message: '操作失败!' + response.data.msg
				});
			}
		})
	}).catch(() => {
		ElMessage({
			type: 'info',
			message: '已取消',
		})
	})
}
const handleArchiveCancel = (row) => {

	ElMessageBox.confirm(
		'合同是否取消归档?',
		'提示', {
		confirmButtonText: '确认',
		cancelButtonText: '取消',
		type: 'warning',
		draggable: true,
	}).then(() => {
		var url = 'cot/Head/archiveCancel'
		var param = {
			archiveFlag: '0',
			json: JSON.stringify(row)
		}

		proxy.$axios.post(url, param).then(response => {
			if (response.data.code == '0') {
				ElMessage({
					type: 'success',
					message: '操作成功!',
				});
				getTableData()
			} else {
				ElMessage({
					type: 'error',
					message: '操作失败!' + response.data.msg
				});
			}
		})
	}).catch(() => {
		ElMessage({
			type: 'info',
			message: '已取消',
		})
	})
}


const multipleSelection = ref([])
const handleSelectionChange = (val) => {
	multipleSelection.value = val
}


const fId = ref('')
const AttachmentRefManual = ref(null)
const dialogVisibleAttachment = ref(false)
const handleUpload = () => {
	if (multipleSelection.value.length != 1) {
		ElMessage({
			type: 'warning',
			message: '请选择一条数据上传文件!'
		})
		return
	}

	// if(multipleSelection.value[0].archiveFlag === '1') {
	// 	ElMessage({
	// 		type: 'warning',
	// 		message: '本合同已归档，不能再上传文件!'
	// 	})
	// 	return
	// }
	fId.value = multipleSelection.value[0].id
	dialogVisibleAttachment.value = true
	AttachmentRefManual.value.upload()
}


/**
 * 工作流相关
 */
const flowId = ref('')
const handleDetail = (row) => {
	switch (row.contrTy) {
		case '10':
			flowId.value = 'salContract'
			break
		case '20':
			flowId.value = 'purContract'
			break
		case '30':
			flowId.value = 'serviceContract'
			break
	}

	if (row.workId === null) {
		ElMessage({
			type: 'info',
			message: '无法查看',
		})
	} else {

		sessionStorage.setItem('workflowQuery', JSON.stringify({
			flowId: flowId.value,
			workId: row.workId,
			trackId: row.trackId,
			date: new Date().getTime()
		}))

		proxy.$router.push({
			path: '/workflow/detail',
		})
	}
}
</script>


<style scoped>
::v-deep .dicSelect .el-select__wrapper .el-select__selected-item {
	color: #a8abb2;
}
</style>