feat: 分类更新统一添加，节点设置外层交互完成
parent
49bfe975bc
commit
1eb526d45d
@ -0,0 +1,159 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2024-04-30 10:02:29
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2024-04-30 10:37:48
|
||||||
|
* @FilePath: \general-ai-platform-web\src\pages\Business\DeviceGroup\components\alarmSetForm.tsx
|
||||||
|
* @Description: 告警设置
|
||||||
|
* @交互说明
|
||||||
|
* 1、通知方式选择
|
||||||
|
* 2、通知频次选择
|
||||||
|
*/
|
||||||
|
import {
|
||||||
|
ProForm,
|
||||||
|
ProFormCheckbox,
|
||||||
|
ProFormDependency,
|
||||||
|
ProFormGroup,
|
||||||
|
ProFormList,
|
||||||
|
ProFormRadio,
|
||||||
|
ProFormSelect,
|
||||||
|
} from '@ant-design/pro-components';
|
||||||
|
import { Form } from 'antd';
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
type AlarmSetFormProps = {
|
||||||
|
currentRow: Record<string, any>;
|
||||||
|
};
|
||||||
|
const AlarmSetForm: React.FC<AlarmSetFormProps> = (props) => {
|
||||||
|
const [form] = Form.useForm<API.DeviceCategory>();
|
||||||
|
|
||||||
|
// const [initialValues, setInitialValues] = useState<Record<string, any>>({});
|
||||||
|
|
||||||
|
function fetchInitialValues() {
|
||||||
|
// setInitialValues({
|
||||||
|
// type: '2',
|
||||||
|
// ways: [
|
||||||
|
// {
|
||||||
|
// label: '短信',
|
||||||
|
// value: [],
|
||||||
|
// isChecked: [],
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// label: '邮件',
|
||||||
|
// value: [],
|
||||||
|
// isChecked: [],
|
||||||
|
// },
|
||||||
|
// ]
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
fetchInitialValues();
|
||||||
|
}, []);
|
||||||
|
return (
|
||||||
|
<ProForm
|
||||||
|
style={{ paddingBottom: 70 }}
|
||||||
|
submitter={{
|
||||||
|
searchConfig: {
|
||||||
|
submitText: '保存', // 在这里设置提交按钮文案
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
form={form}
|
||||||
|
initialValues={props.currentRow}
|
||||||
|
onFinish={async (values) => {
|
||||||
|
// TODO 提交告警设置调用api
|
||||||
|
console.log('onFinish_values', values);
|
||||||
|
// postProjectCreateProject(values)
|
||||||
|
// .then(() => {
|
||||||
|
// message.success(intl.formatMessage({ id: 'common.success', defaultMessage: '$$$' }));
|
||||||
|
// props.reload();
|
||||||
|
// })
|
||||||
|
// .catch(() => {
|
||||||
|
// message.error(intl.formatMessage({ id: 'common.failure', defaultMessage: '$$$' }));
|
||||||
|
// });
|
||||||
|
// props.reload();
|
||||||
|
return true;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ProFormGroup>
|
||||||
|
<ProFormGroup title="通知方式" titleStyle={{ margin: '0 0 8px' }}>
|
||||||
|
<ProFormList
|
||||||
|
className="innerFormList_box"
|
||||||
|
name={['ways']}
|
||||||
|
creatorButtonProps={false}
|
||||||
|
copyIconProps={false}
|
||||||
|
deleteIconProps={false}
|
||||||
|
style={{ padding: 0, margin: 0 }}
|
||||||
|
>
|
||||||
|
{(f, index, action) => {
|
||||||
|
console.log('isChecked_value', f, index, action);
|
||||||
|
return (
|
||||||
|
<div className="form_checkBox_wrap">
|
||||||
|
<ProFormGroup key="group">
|
||||||
|
<ProFormCheckbox.Group
|
||||||
|
name="isChecked"
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
label: form.getFieldValue('ways')[index].label,
|
||||||
|
value: '1',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
></ProFormCheckbox.Group>
|
||||||
|
<ProFormDependency name={['isChecked']}>
|
||||||
|
{({ isChecked }) => {
|
||||||
|
console.log(isChecked, 'isChecked');
|
||||||
|
return (
|
||||||
|
<ProFormSelect
|
||||||
|
width={'lg'}
|
||||||
|
mode="multiple"
|
||||||
|
name="value"
|
||||||
|
debounceTime={1000}
|
||||||
|
disabled={!isChecked?.length}
|
||||||
|
request={async () => {
|
||||||
|
// const resp = await postCurrentIP();
|
||||||
|
const resp = ['test001', 'test002', 'test003'];
|
||||||
|
return resp?.map((v: any) => {
|
||||||
|
return {
|
||||||
|
label: v,
|
||||||
|
value: v,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</ProFormDependency>
|
||||||
|
</ProFormGroup>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
</ProFormList>
|
||||||
|
</ProFormGroup>
|
||||||
|
</ProFormGroup>
|
||||||
|
<ProFormGroup title="通知频次" titleStyle={{ margin: '0 0 8px' }}>
|
||||||
|
<ProFormRadio.Group
|
||||||
|
name="type"
|
||||||
|
initialValue={props.values?.type || '0'}
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
label: '每次',
|
||||||
|
value: '0',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '每天',
|
||||||
|
value: '1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '每周',
|
||||||
|
value: '2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '每月',
|
||||||
|
value: '3',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
></ProFormRadio.Group>
|
||||||
|
</ProFormGroup>
|
||||||
|
</ProForm>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default AlarmSetForm;
|
||||||
@ -0,0 +1,158 @@
|
|||||||
|
/*
|
||||||
|
* @Author: donghao donghao@supervision.ltd
|
||||||
|
* @Date: 2024-04-30 10:02:29
|
||||||
|
* @LastEditors: donghao donghao@supervision.ltd
|
||||||
|
* @LastEditTime: 2024-04-30 17:01:59
|
||||||
|
* @FilePath: \general-ai-platform-web\src\pages\Business\DeviceGroup\components\modelSetting.tsx
|
||||||
|
* @Description: 业务模型部署
|
||||||
|
* @交互说明
|
||||||
|
* 1、业务模型部署列表的分页展示
|
||||||
|
* 2、配置参数功能
|
||||||
|
*/
|
||||||
|
import TableActionCard from '@/components/TableActionCard';
|
||||||
|
import { getBusinessModelList } from '@/services/testApi/businessModel';
|
||||||
|
import { ExclamationCircleFilled } from '@ant-design/icons';
|
||||||
|
import type { ActionType, ProColumns } from '@ant-design/pro-components';
|
||||||
|
import { ProTable } from '@ant-design/pro-components';
|
||||||
|
import { FormattedMessage } from '@umijs/max';
|
||||||
|
import { Button } from 'antd';
|
||||||
|
import { useRef, useState } from 'react';
|
||||||
|
import {
|
||||||
|
proTableCommonOptions,
|
||||||
|
proTablePaginationOptions,
|
||||||
|
} from '../../../../../config/defaultTable';
|
||||||
|
// import CreateForm from './components/createForm';
|
||||||
|
|
||||||
|
const ModelSetting: React.FC = () => {
|
||||||
|
// const intl = useIntl();
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
|
||||||
|
// const [createModalOpen, setCreateModalOpen] = useState<boolean>(false);
|
||||||
|
// const [categoryFkIdIds, setCategoryFkIdIds] = useState([]);
|
||||||
|
// 动态设置每页数量
|
||||||
|
const [currentPageSize, setCurrentPageSize] = useState<number>(10);
|
||||||
|
// const [currentRow, setCurrentRow] = useState<Record<string, any>>({});
|
||||||
|
|
||||||
|
/**配置参数 */
|
||||||
|
|
||||||
|
// function reloadList() {
|
||||||
|
// actionRef.current?.reload();
|
||||||
|
// }
|
||||||
|
|
||||||
|
// 业务模型列表信息
|
||||||
|
const columns: ProColumns<Record<string, any>>[] = [
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="business_model.table.list.name" defaultMessage="业务模型名称" />,
|
||||||
|
dataIndex: 'name',
|
||||||
|
hideInSearch: true,
|
||||||
|
key: 'fixedName',
|
||||||
|
fixed: 'left',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="business_model.table.list.status" defaultMessage="部署状态" />,
|
||||||
|
dataIndex: 'status',
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: (
|
||||||
|
<FormattedMessage id="business_model.table.list.createTime" defaultMessage="创建时间" />
|
||||||
|
),
|
||||||
|
dataIndex: 'createTime',
|
||||||
|
hideInSearch: true,
|
||||||
|
valueType: 'dateTime',
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: <FormattedMessage id="pages.searchTable.titleOption" defaultMessage="操作" />,
|
||||||
|
dataIndex: 'option',
|
||||||
|
valueType: 'option',
|
||||||
|
fixed: 'right',
|
||||||
|
key: 'option',
|
||||||
|
render: () => [
|
||||||
|
<TableActionCard
|
||||||
|
key="TableActionCardRef"
|
||||||
|
renderActions={[
|
||||||
|
{
|
||||||
|
key: 'updateDetail',
|
||||||
|
renderDom: (
|
||||||
|
<Button
|
||||||
|
key="updateDetail"
|
||||||
|
type="link"
|
||||||
|
size="small"
|
||||||
|
onClick={() => {
|
||||||
|
// TODO 编辑在新增联调后实现
|
||||||
|
// setCurrentRow(record);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<FormattedMessage id="pages.searchTable.updateDetail" defaultMessage="配置参数" />
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
></TableActionCard>,
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
return (
|
||||||
|
<div className="modelSetting_page">
|
||||||
|
<div
|
||||||
|
className="pb-[12px]"
|
||||||
|
style={{
|
||||||
|
color: '#FAAD14',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ExclamationCircleFilled />
|
||||||
|
<span className="pl-[8px]">配置参数需关联具体设备请先至设备列表添加设备后再进行配置</span>
|
||||||
|
</div>
|
||||||
|
<ProTable
|
||||||
|
className="gn_pro_table"
|
||||||
|
cardProps={{
|
||||||
|
bodyStyle: { padding: 0 },
|
||||||
|
}}
|
||||||
|
// 标题栏
|
||||||
|
search={false}
|
||||||
|
scroll={{ y: proTableCommonOptions.commscrollY }}
|
||||||
|
options={{ fullScreen: false, setting: false, density: false, reload: false }}
|
||||||
|
actionRef={actionRef}
|
||||||
|
rowKey="key"
|
||||||
|
onDataSourceChange={(data) => {
|
||||||
|
console.log(data, 'onDataSourceChange_data');
|
||||||
|
// let CategoryFkIdIds: any = data.map((v) => {
|
||||||
|
// return v.categoryFkId;
|
||||||
|
// });
|
||||||
|
// setCategoryFkIdIds(CategoryFkIdIds);
|
||||||
|
}}
|
||||||
|
pagination={{
|
||||||
|
...proTablePaginationOptions,
|
||||||
|
pageSize: currentPageSize,
|
||||||
|
onChange: (page, pageSize) => setCurrentPageSize(pageSize),
|
||||||
|
}}
|
||||||
|
columnsState={{
|
||||||
|
persistenceKey: 'algorithm_model_list',
|
||||||
|
persistenceType: 'localStorage',
|
||||||
|
}}
|
||||||
|
request={async (params = {}) => {
|
||||||
|
const { current, ...rest } = params;
|
||||||
|
const reqParams = {
|
||||||
|
page: current,
|
||||||
|
...rest,
|
||||||
|
};
|
||||||
|
let resp = await getBusinessModelList({ ...reqParams });
|
||||||
|
console.log(resp, 'getModelVersionList_resp');
|
||||||
|
return {
|
||||||
|
data: resp.data?.results.map((v: Record<string, any>) => {
|
||||||
|
return { ...v, key: v.id };
|
||||||
|
}),
|
||||||
|
success: resp.success,
|
||||||
|
total: resp.data.count,
|
||||||
|
current: current,
|
||||||
|
pageSize: currentPageSize,
|
||||||
|
};
|
||||||
|
}}
|
||||||
|
columns={columns}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ModelSetting;
|
||||||
Loading…
Reference in New Issue