safety-eval-service-frontend/src/pages/Container/Supervision/BasicInfo/OrgAccount/index.js

347 lines
12 KiB
JavaScript
Raw Normal View History

2026-06-26 17:28:06 +08:00
import {
Button, Descriptions, Form, Input, InputNumber, message, Modal, Row, Col, Select, Space, Tag,
} from "antd";
import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { useEffect, useState } from "react";
import Page from "zy-react-library/components/Page";
import Search from "zy-react-library/components/Search";
import Table from "zy-react-library/components/Table";
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
import useTable from "zy-react-library/hooks/useTable";
import { isOrgAccountEnabled } from "~/api/enterpriseInfo/adapter";
import {
CHONGQING_DISTRICTS,
ENTERPRISE_SCALE_OPTIONS,
ENTERPRISE_STATUS_OPTIONS,
ORG_ACCOUNT_STATE_OPTIONS,
} from "~/enumerate/enterpriseOptions";
import { NS_ORG_INFO } from "~/enumerate/namespace";
import { safeListRequest, safeRequest } from "~/utils";
import { formSelectField } from "~/utils/enterpriseForm";
import PageHeader from "../../../EnterpriseInfo/components/PageHeader";
const SEARCH_COL = { xs: 24, sm: 12, md: 8, lg: 6 };
const SEARCH_DEFAULT_VALUES = { state: "" };
function OrgAccountPage(props) {
const [searchForm] = Form.useForm();
const [editForm] = Form.useForm();
const [viewOpen, setViewOpen] = useState(false);
const [editOpen, setEditOpen] = useState(false);
const [currentId, setCurrentId] = useState(null);
const [detail, setDetail] = useState(null);
const [rawDetail, setRawDetail] = useState(null);
const [detailLoading, setDetailLoading] = useState(false);
const [editLoading, setEditLoading] = useState(false);
const { tableProps, getData } = useTable(safeListRequest(props.orgAccountList), { form: searchForm });
useEffect(() => {
getData();
}, []);
const loadDetail = async (id) => {
setDetailLoading(true);
const res = await safeRequest(props.orgAccountGet, { id });
setDetail(res?.data || null);
setRawDetail(res?.raw || null);
setDetailLoading(false);
return res;
};
const openView = async (id) => {
setCurrentId(id);
setViewOpen(true);
await loadDetail(id);
};
const openEdit = async (id) => {
setCurrentId(id);
setEditOpen(true);
const res = await loadDetail(id);
if (res?.data) {
editForm.setFieldsValue(res.data);
}
};
const onToggleStatus = (record) => {
const enabled = isOrgAccountEnabled(record);
Modal.confirm({
title: "确认操作",
content: enabled ? `确认禁用「${record.orgName}」账号?` : `确认启用「${record.orgName}」账号?`,
okText: "确认",
cancelText: "取消",
onOk: async () => {
const nextState = enabled ? 1 : 0;
const res = await props.orgAccountUpdateState({ id: record.id, state: nextState });
if (res?.success !== false) {
message.success("操作成功");
await getData();
}
else {
message.error(res?.message || "操作失败");
}
},
});
};
const onResetPassword = (record) => {
Modal.confirm({
title: "重置密码",
content: (
<div>
<p>
确认将
<strong>{record.orgName}</strong>
的密码重置为初始密码
</p>
<p style={{ color: "rgba(0,0,0,0.45)", fontSize: 12 }}>初始密码Ap@123456</p>
</div>
),
okText: "确认重置",
cancelText: "取消",
onOk: async () => {
const res = await props.orgAccountResetPassword({ id: record.id });
if (res?.success !== false) {
message.success("密码已重置");
}
else {
message.error(res?.message || "重置失败");
}
},
});
};
const onDelete = (record) => {
Modal.confirm({
title: "确认删除",
content: (
<div>
<p>
确认删除
<strong>{record.orgName}</strong>
的账号
</p>
<p style={{ color: "rgba(0,0,0,0.45)", fontSize: 12 }}>此操作不可恢复请谨慎操作</p>
</div>
),
okText: "确认删除",
okButtonProps: { danger: true },
cancelText: "取消",
onOk: async () => {
const res = await props.orgAccountDelete({ id: record.id });
if (res?.success !== false) {
message.success("删除成功");
await getData();
}
else {
message.error(res?.message || "删除失败");
}
},
});
};
const onEditSubmit = async () => {
const values = await editForm.validateFields();
setEditLoading(true);
const res = await props.orgAccountModify({
...values,
id: currentId,
raw: rawDetail,
});
setEditLoading(false);
if (res?.success !== false) {
message.success("保存成功");
setEditOpen(false);
setCurrentId(null);
setRawDetail(null);
editForm.resetFields();
await getData();
}
else {
message.error(res?.message || "保存失败");
}
};
return (
<Page isShowAllAction={false}>
<PageHeader
title="评价机构账号管理"
subTitle="监管端维护评价机构开户账号。"
/>
<Search
form={searchForm}
values={SEARCH_DEFAULT_VALUES}
options={[
{ name: "orgName", label: "机构名称", placeholder: "关键字搜索", colProps: SEARCH_COL },
formSelectField("district", "属地", CHONGQING_DISTRICTS, {
colProps: SEARCH_COL,
placeholder: "请选择属地",
}),
formSelectField("state", "状态", ORG_ACCOUNT_STATE_OPTIONS, {
colProps: SEARCH_COL,
componentProps: { allowClear: false, showSearch: false },
}),
{
name: "openTimeRange",
label: "开户时间",
render: FORM_ITEM_RENDER_ENUM.DATE_RANGE,
colProps: { ...SEARCH_COL, lg: 8 },
},
]}
onFinish={getData}
/>
<Table
{...tableProps}
columns={[
{ title: "机构名称", dataIndex: "orgName", ellipsis: true },
{ title: "属地", dataIndex: "district", width: 100 },
{
title: "状态",
width: 80,
render: (_, record) => (
<Tag color={isOrgAccountEnabled(record) ? "success" : "error"}>
{isOrgAccountEnabled(record) ? "启用" : "禁用"}
</Tag>
),
},
{ title: "开户时间", dataIndex: "createTime", width: 110 },
{
title: "操作",
width: 320,
fixed: "right",
render: (_, record) => (
<Space size={0} wrap>
<Button type="link" size="small" onClick={() => openView(record.id)}>查看</Button>
<Button type="link" size="small" onClick={() => openEdit(record.id)}>编辑</Button>
<Button type="link" size="small" onClick={() => onResetPassword(record)}>重置密码</Button>
<Button type="link" size="small" danger onClick={() => onDelete(record)}>删除</Button>
<Button type="link" size="small" onClick={() => onToggleStatus(record)}>
{isOrgAccountEnabled(record) ? "禁用" : "启用"}
</Button>
</Space>
),
},
]}
/>
<Modal
open={viewOpen}
destroyOnClose
title="机构信息查看"
width={760}
loading={detailLoading}
cancelText="关闭"
okButtonProps={{ style: { display: "none" } }}
onCancel={() => { setViewOpen(false); setDetail(null); setRawDetail(null); }}
>
{detail && (
<Descriptions bordered column={2} size="small">
<Descriptions.Item label="机构名称">{detail.orgName}</Descriptions.Item>
<Descriptions.Item label="统一社会信用代码">{detail.creditCode}</Descriptions.Item>
<Descriptions.Item label="属地">{detail.regionCountyName}</Descriptions.Item>
<Descriptions.Item label="安全生产监管行业类别">{detail.safetyIndustryCategory}</Descriptions.Item>
<Descriptions.Item label="经营地址" span={2}>{detail.businessAddress}</Descriptions.Item>
<Descriptions.Item label="企业状态">{detail.enterpriseStatus}</Descriptions.Item>
<Descriptions.Item label="经度/纬度">{detail.longitude}, {detail.latitude}</Descriptions.Item>
<Descriptions.Item label="主要负责人">{detail.principal}</Descriptions.Item>
<Descriptions.Item label="主要负责人电话">{detail.principalPhone}</Descriptions.Item>
<Descriptions.Item label="法定代表人">{detail.legalRepresentative}</Descriptions.Item>
<Descriptions.Item label="法人电话">{detail.legalRepPhone}</Descriptions.Item>
<Descriptions.Item label="企业规模" span={2}>{detail.enterpriseScale}</Descriptions.Item>
</Descriptions>
)}
</Modal>
<Modal
open={editOpen}
destroyOnClose
title="编辑机构信息"
width={760}
confirmLoading={editLoading}
okText="保存"
cancelText="取消"
onCancel={() => {
setEditOpen(false);
setCurrentId(null);
setRawDetail(null);
editForm.resetFields();
}}
onOk={onEditSubmit}
>
<Form form={editForm} layout="vertical">
<Row gutter={16}>
<Col span={12}>
<Form.Item name="orgName" label="机构名称" rules={[{ required: true, message: "请输入机构名称" }]}>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="creditCode" label="统一社会信用代码" rules={[{ required: true, message: "请输入信用代码" }]}>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="regionCountyName" label="属地">
<Select options={CHONGQING_DISTRICTS} placeholder="请选择属地" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="safetyIndustryCategory" label="安全生产监管行业类别">
<Input />
</Form.Item>
</Col>
<Col span={24}>
<Form.Item name="businessAddress" label="企事业单位经营地址">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="enterpriseStatus" label="企业状态">
<Select options={ENTERPRISE_STATUS_OPTIONS} />
</Form.Item>
</Col>
<Col span={6}>
<Form.Item name="longitude" label="经度">
<InputNumber style={{ width: "100%" }} />
</Form.Item>
</Col>
<Col span={6}>
<Form.Item name="latitude" label="纬度">
<InputNumber style={{ width: "100%" }} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="principal" label="主要负责人">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="principalPhone" label="主要负责人电话">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="legalRepresentative" label="法定代表人">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="legalRepPhone" label="法人电话">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name="enterpriseScale" label="企业规模">
<Select options={ENTERPRISE_SCALE_OPTIONS.map((o) => ({ label: o.label, value: o.label }))} />
</Form.Item>
</Col>
</Row>
</Form>
</Modal>
</Page>
);
}
export default Connect([NS_ORG_INFO], true)(OrgAccountPage);