import React, { useEffect, useState, useMemo, useRef } from 'react';
import { Card, message, Table, Space, Button } from 'antd';
import ToolBar from './toolbar.js';
import usePageTable from '../../../components/Crud/usePageTable.js'
import apiurl from '../../../models/apiurl'
import { createCrudService } from '../../../components/Crud/_';
import {xyt_httpget2} from "../../../utils/request"
export default function Czrz() {
	const refModal = useRef();
	const businessType = {
		// 0: "其它",
		1: "新增",
		2: "修改",
		3: "删除",
		4: "授权",
		5: "导出",
		6: "导入",
		7: "强退",
		8: "生成代码",
		9: "清空数据",
	}
	const operatorStatus = {
		0: '正常',
		1: '异常'
	}
	const columns = [
		{
			title: '日志编号',
			dataIndex: 'operId',
			key: 'operId',
			width: 100,
			align: "center",
		},
		{
			title: '系统模块',
			dataIndex: 'title',
			key: 'title',
			width: 120,
			align: "center",
		},
		{
			title: '操作类型',
			dataIndex: 'businessType',
			key: 'businessType',
			width: 100,
			align: "center",
			render: (text, record) => (
				<span>
					{businessType[text]}
				</span>
			)
		},
		{
			title: '请求方式',
			dataIndex: 'requestMethod',
			key: 'requestMethod',
			width: 100,
			align: "center",
		},
		{
			title: '操作人员',
			dataIndex: 'operName',
			key: 'operName',
			width: 180,
			align: "center",
		},
		{
			title: '主机',
			dataIndex: 'operIp',
			key: 'operIp',
			width: 180,
			align: "center",
		},
		{
			title: '操作地点',
			dataIndex: 'operAddress',
			key: 'operAddress',
			width: 180,
			align: "center",
		},
		{
			title: '操作状态',
			dataIndex: 'status',
			key: 'status',
			width: 100,
			align: "center",
			render: (text, record) => (
				<span>
					{operatorStatus[text]}
				</span>
			)
		},
		{
			title: '操作日期',
			dataIndex: 'operTime',
			key: 'operTime',
			width: 150,
			align: "center",
		},
		{
			title: '操作', key: 'action', dataIndex: 'action', width: 150, align: "center",
			render: (v, r) => (
				<Space size="middle">
					<a onClick={() => command("view")(r)}>查看</a>
				</Space>
			)
		},
	]
	const [searchVal, setSearchVal] = useState(false)
	const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);

	const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.ptjs.czdbl).xyt_find_noCode);
	
	const getData = async (params) => {
		try {
			const res = await xyt_httpget2(apiurl.ptjs.czdbl,params)
			// debugger
		} catch (error) {
			console.log(error);
		}
	}
	const command = (type) => (row) => {
		refModal.current.showView(row)
	}
	useEffect(() => {
		if (searchVal) {
			const params = {
				...searchVal
			};
			getData(params)
		}
	}, [searchVal])

	return (
		<div className='page'>
			<div style={{width:'100%'}}>
			<Card style={{ display: 'flex', flexDirection: 'column' }}>
				<ToolBar
					setToolVal={setSearchVal}
					/>
				<Table
					columns={columns}
					{...tableProps}
					scroll={{ x: width, y: "calc( 100vh - 400px )"  }}
					rowKey="inx"
				/>
				</Card>
				</div>
		</div>
	)
}