refactor(accident): 重构事故管理页面组件

- 替换 div 包装器为 Page 组件以统一页面布局
- 移除 HeaderBack 组件并集成到 Page 组件中
- 调整搜索表单项顺序,将日期范围和地点字段位置优化
- 更新导出按钮样式,添加 ghost 属性并修改文本为全部导出
- 为批量删除按钮添加 ghost 属性并优化提示信息
- 修复表单字段间距和组件属性配置
- 移除事故性质字段并添加填报人字段
- 更新模态框确认按钮的 loading 属性为 confirmLoading
- 在表单构建器中添加 loading 属性
- 调整详情页面字段显示顺序并添加填报人信息
- 修复附件标签文本格式
- 在监管事故列表中使用 Page 组件替代
master
fangjiakai 2026-01-08 10:03:35 +08:00
parent 2b9b7dee4e
commit 917145833b
3 changed files with 48 additions and 43 deletions

View File

@ -6,7 +6,7 @@ import "dayjs/locale/zh-cn";
import "../blessed_by_buddha";
require("antd/dist/reset.css");
require("zy-react-library/css/common.less");
dayjs.locale("zh-cn");
setJJBCommonAntdMessage(message);

View File

@ -16,13 +16,13 @@ import { NS_ACCIDENT } from "~/enumerate/namespace";
import AddIcon from "zy-react-library/components/Icon/AddIcon";
import DeleteIcon from "zy-react-library/components/Icon/DeleteIcon";
import ExportIcon from "zy-react-library/components/Icon/ExportIcon";
import HeaderBack from "zy-react-library/components/HeaderBack";
import DictionarySelect from "zy-react-library/components/Select/Dictionary";
import useDownloadBlob from "zy-react-library/hooks/useDownloadBlob";
import useUrlQueryCriteria from "zy-react-library/hooks/useUrlQueryCriteria";
import PreviewImg from "zy-react-library/components/PreviewImg";
import useDownloadFile from "zy-react-library/hooks/useDownloadFile";
import { Permission } from "@cqsjjb/jjb-common-decorator/permission";
import Page from "zy-react-library/components/Page";
function Accident(props) {
@ -47,17 +47,19 @@ function Accident(props) {
});
const typeName = props.type === 1 ? "事件" : "事故";
return (
<div style={{ padding: 10 }}>
{props.isSupervise && <HeaderBack title={`${typeName}管理`} />}
<Page
isShowAllAction={!!props.isSupervise}
headerTitle={`${typeName}管理`}
>
<Search
form={form}
onFinish={getData}
options={[
{ name: "likeIncidentName", label: `${typeName}名称` },
{ name: "incidentDate", label: `${typeName}发生时间`, render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
{ name: "likeLocation", label: `${typeName}发生地点` },
{ name: "eqIncidentType", label: `${typeName}类型`, render: <DictionarySelect dictValue="accidentType" /> },
{ name: "eqIncidentLevel", label: `${typeName}等级`, render: <DictionarySelect dictValue="accidentLevel" /> },
{ name: "likeLocation", label: `${typeName}发生地点` },
{ name: "incidentDate", label: `${typeName}发生时间`, render: FORM_ITEM_RENDER_ENUM.DATE_RANGE },
]}
/>
<Table
@ -69,26 +71,27 @@ function Accident(props) {
toolBarRender={() => (
<Space>
{props.permission(props.exportPermission) &&
<Button loading={loading} icon={<ExportIcon />} onClick={async () => {
<Button type="primary" loading={loading} icon={<ExportIcon />} ghost onClick={async () => {
const exportParams = getUrlCriteriaQuery("searchFormKeys", "searchFormValues");
await downloadBlob("/accident/accident/export", { params: {...exportParams, eqType: props.type} })
}}>导出</Button>
await downloadBlob("/accident/accident/export", { params: { ...exportParams, eqType: props.type } })
}}>全部导出</Button>
}
{!props.isSupervise && props.permission(props.addPermission) &&
<Button type="primary" icon={<AddIcon />} onClick={() => setAddModalVisible(true)}>新增</Button>
}
{!props.isSupervise && props.permission(props.deleteBatchPermission) &&
<Button icon={<DeleteIcon />}
ghost
type="primary"
danger
onClick={() => {
if (!selectedRowKeys.length)
return message.warning("请选择要删除的");
return message.warning("请选择要删除的");
Modal.confirm({
title: "确定删除吗?",
onOk: async () => {
await props["accidentBatchDelete"]({ids: selectedRowKeys});
await props["accidentBatchDelete"]({ ids: selectedRowKeys });
message.success("删除成功");
getData();
},
@ -105,8 +108,8 @@ function Accident(props) {
{ dataIndex: "corpinfoName", title: `所属公司` },
{ dataIndex: "incidentDate", title: `${typeName}发生时间` },
{ dataIndex: "location", title: `${typeName}发生地点` },
{ dataIndex: "incidentTypeName", title: `${typeName}类型`},
{ dataIndex: "incidentLevelName", title: `${typeName}等级`},
{ dataIndex: "incidentTypeName", title: `${typeName}类型` },
{ dataIndex: "incidentLevelName", title: `${typeName}等级` },
{
title: "操作",
align: "center",
@ -183,7 +186,7 @@ function Accident(props) {
typeName={typeName}
getData={getData}
/>}
</div>
</Page>
);
}
@ -300,7 +303,7 @@ function AddModalComponent(props) {
onCancel={onCancel}
onOk={form.submit}
title={props.currentId ? "编辑" : "新增"}
loading={props.accident.accidentLoading || uploadLoading || deleteLoading}
confirmLoading={props.accident.accidentLoading || uploadLoading || deleteLoading}
width={800}
>
<FormBuilder
@ -309,23 +312,24 @@ function AddModalComponent(props) {
span={24}
onFinish={submit}
showActionButtons={false}
loading={props.accident.accidentLoading || uploadLoading || deleteLoading}
options={[
{ name: "incidentNumber", label: `${typeName}案号` },
{ name: "incidentName", label: `${typeName}名称` },
{ name: "incidentType", label: `${typeName}类型`, render: <DictionarySelect dictValue="accidentType" onGetLabel={(label) => setDicNames({ ...dicNames, incidentTypeName: label })} /> },
{ name: "incidentLevel", label: `${typeName}等级`, render: <DictionarySelect dictValue="accidentLevel" onGetLabel={(label) => setDicNames({ ...dicNames, incidentLevelName: label })} /> },
{ name: "incidentNature", label: `${typeName}性质` },
{ name: "location", label: `${typeName}发生地点` },
{ name: "incidentDate", label: `${typeName}发生时间`, render: FORM_ITEM_RENDER_ENUM.DATETIME },
{ name: "directLoss", label: "直接经济损失(万元)", render: FORM_ITEM_RENDER_ENUM.NUMBER,componentProps: { precision: 2,min: 0 }, required: false },
{ name: "injured", label: "受伤人数", render: FORM_ITEM_RENDER_ENUM.NUMBER,componentProps: { precision: 0,min: 0 }, required: false },
{ name: "fatalities", label: "死亡人数", render: FORM_ITEM_RENDER_ENUM.NUMBER,componentProps: { precision: 0,min: 0 }, required: false },
{ name: "seriouslyInjured", label: "重伤人数", render: FORM_ITEM_RENDER_ENUM.NUMBER,componentProps: { precision: 0,min: 0 }, required: false },
{ name: "directLoss", label: "直接经济损失(万元)", render: FORM_ITEM_RENDER_ENUM.NUMBER, componentProps: { precision: 2, min: 0 }, required: false },
{ name: "injured", label: "受伤人数", render: FORM_ITEM_RENDER_ENUM.NUMBER, componentProps: { precision: 0, min: 0 }, required: false },
{ name: "fatalities", label: "死亡人数", render: FORM_ITEM_RENDER_ENUM.NUMBER, componentProps: { precision: 0, min: 0 }, required: false },
{ name: "seriouslyInjured", label: "重伤人数", render: FORM_ITEM_RENDER_ENUM.NUMBER, componentProps: { precision: 0, min: 0 }, required: false },
{ name: "cause", label: `${typeName}起因`, render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
{ name: "summary", label: `${typeName}概述`, render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
{ name: "analysis", label: "原因分析及责任认定", render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
{ name: "suggestions", label: "考核建议", render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
{ name: "measures", label: "整改措施", render: FORM_ITEM_RENDER_ENUM.TEXTAREA },
{ name: "reportUser", label: `填报人` },
{ name: "reportDate", label: "报出日期", render: FORM_ITEM_RENDER_ENUM.DATETIME },
// 添加图片上传
{
@ -407,7 +411,6 @@ function InfoModalComponent(props) {
{ children: info.incidentName, label: `${typeName}名称` },
{ children: info.incidentTypeName, label: `${typeName}类型` },
{ children: info.incidentLevelName, label: `${typeName}等级` },
{ children: info.incidentNature, label: `${typeName}性质` },
{ children: info.location, label: `${typeName}发生地点` },
{ children: info.incidentDate, label: `${typeName}发生时间` },
{ children: info.directLoss || 0, label: "直接经济损失(万元)" },
@ -419,6 +422,7 @@ function InfoModalComponent(props) {
{ children: info.analysis, label: "原因分析及责任认定" },
{ children: info.suggestions, label: "考核建议" },
{ children: info.measures, label: "整改措施" },
{ children: info.reportUser, label: "填表人" },
{ children: info.reportDate, label: "报出日期" },
// 显示图片
{

View File

@ -8,6 +8,7 @@ import {NS_ACCIDENT} from "~/enumerate/namespace";
import useDictionary from "zy-react-library/hooks/useDictionary";
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
import useUrlQueryCriteria from "zy-react-library/hooks/useUrlQueryCriteria";
import Page from "zy-react-library/components/Page";
const TYPE = [
@ -36,7 +37,7 @@ function SuperviseAccident(props) {
const {tableProps, getData} = useTable(props["getCorpInfoList"], {
form,
params: {
inType: "0,1",
inType: [0,1],
},
onSuccess: ({data}) => {
getAccidentCountByCorpinfoAndType(data.map(item => item.id),form.getFieldValue("eqAccidentType"))
@ -48,7 +49,7 @@ function SuperviseAccident(props) {
const searchType = getUrlCriteriaQuery("searchFormKeys","searchFormValues").eqAccidentType;
return (
<div style={{padding: 10}}>
<Page isShowAllAction={false}>
<Search
form={form}
values={{
@ -66,7 +67,7 @@ function SuperviseAccident(props) {
onChange: selectedRowKeys => setSelectedRowKeys(selectedRowKeys),
}}
columns={[
{dataIndex: "corpName", title: `所属公司`},
{dataIndex: "corpName", title: `公司名称`},
...accidentType.map(item => ({
dataIndex: `countByCorpinfoAndType_${item.dictValue}`,
title: `${item.dictLabel}`,
@ -94,7 +95,7 @@ function SuperviseAccident(props) {
]}
{...tableProps}
/>
</div>
</Page>
);
}