tsg-web/src/views/rcgl/jdkh/khmbgl/index.js

121 lines
4.3 KiB
JavaScript

import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image,Switch } from 'antd';
import {FileWordOutlined,FilePdfOutlined,FileZipOutlined,FileExcelOutlined } from '@ant-design/icons';
import { useSelector } from 'react-redux';
import ToolBar from './toolbar';
import ModalForm from './form';
import apiurl from '../../../../service/apiurl';
import usePageTable from '../../../../components/crud/usePageTable2';
import { createCrudService } from '../../../../components/crud/_';
import {CrudOpRender_text} from '../../../../components/crud/CrudOpRender';
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
const Page = () => {
const role = useSelector(state => state.auth.role);
const editBtn = role?.rule?.find(item => item.menuName == "编辑") || true;
const delBtn = role?.rule?.find(item => item.menuName == "删除") || true;
const refModal = useRef();
const columns = [
{ title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
{title: '模板名称', key: 'templateName', dataIndex: 'templateName', width: 200,align: "center"},
{
title: '考核频次', key: 'templateFreq', dataIndex: 'templateFreq', width: 200, align: "center",
render: (value) => <span>{value == 1? '年度' : value == 2 ? "季度": value == 3 ? "月度" : ''}</span>
},
{
title: '标准分数', key: 'standardScore', dataIndex: 'standardScore', width: 200,align: "center" },
{
title: '是否启用', key: 'status', dataIndex: 'status', width: 200,align: "center",
render: (v, r) => <Switch
checkedChildren="启用"
unCheckedChildren="禁用"
checked={v == 0 ? true : false} onChange={(e) => {
onEdit(apiurl.rcgl.jdkh.khmbgl.edit,{...r, status:e ? 0 : 1})
}} />
},
{title: '创建日期', key: 'createTime', dataIndex: 'createTime', width: 200,align: "center"},
{title: '创建人', key: 'indicatorCode', dataIndex: 'createUserName', width: 100,align: "center"},
{
title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center',
render: (value, row, index) => (
<CrudOpRender_text
edit={(editBtn && !row?.isUsed) ? true : false}
del={(delBtn && !row?.isUsed) ? true : false}
view={true}
command={(cmd) => () => command(cmd)(row)} />)
},
];
const [searchVal, setSearchVal] = useState({})
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
const command = (type) => (params) => {
if (type === 'save') {
refModal.current.showSave();
} else if (type === 'edit') {
refModal.current.showEdit({ ...params });
} else if (type === 'view') {
refModal.current.showView(params);
} else if (type === 'del') {
refModal.current.onDeleteGet(apiurl.rcgl.jdkh.khmbgl.delete + `/${params.id}`);
}
}
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.jdkh.khmbgl.page).find_noCode);
const onEdit = (path,values) => {
createCrudService(path).edit(values).then((result) => {
if (result?.code === 200) {
refresh()
}
})
}
useEffect(() => {
if (searchVal) {
let params = {
search: {
...searchVal
}
};
search(params)
}
}, [searchVal]);
return (
<>
<div className='content-box' style={{ backgroundColor: '#fff', height: '100%',padding:'10px' }}>
<div className='lf CrudAdcdTreeTableBox' style={{width:"100%",overflowY:"auto"}}>
<Card className='nonebox'>
<ToolBar
onSave={command('save')}
setSearchVal={setSearchVal}
role={role}
/>
</Card>
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
<Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width , y: "calc( 100vh - 400px )"}}/>
</div>
</div>
<BasicCrudModal
width={1000}
ref={refModal}
title=""
component={ModalForm}
onCrudSuccess={refresh}
/>
</div>
</>
);
}
export default Page;