diff --git a/web-fe/src/constants/constants.ts b/web-fe/src/constants/constants.ts index ea477d2..658e7e8 100644 --- a/web-fe/src/constants/constants.ts +++ b/web-fe/src/constants/constants.ts @@ -53,3 +53,6 @@ export const PRIOPRITY_OPTIONS = [ { value: 2, label: '二级' }, { value: 3, label: '三级' }, ]; + +export const DEFAULT_PASSWORD="a123456" +export const DEFAULT_BLICK_TAB="黑名单" diff --git a/web-fe/src/pages/terminal/index.tsx b/web-fe/src/pages/terminal/index.tsx index bafb058..49a3b34 100644 --- a/web-fe/src/pages/terminal/index.tsx +++ b/web-fe/src/pages/terminal/index.tsx @@ -1,5 +1,9 @@ /* eslint-disable @typescript-eslint/no-use-before-define */ -import { DEVICE_TYPE_MAP, ERROR_CODE } from '@/constants/constants'; +import { + DEFAULT_BLICK_TAB, + DEVICE_TYPE_MAP, + ERROR_CODE, +} from '@/constants/constants'; import CustomTree from '@/pages/components/customTree'; import CreatGroup from '@/pages/userList/mod/group'; import { deleteDevice, getTerminalList } from '@/services/terminal'; @@ -31,6 +35,7 @@ import EditModal from './mod/eidtDevice'; const UserListPage: React.FC = () => { const [orgTreeData, setOrgTreeData] = useState([]); const [selectedOrg, setSelectedOrg] = useState(); + const [selectedOrgNode, setSelectedOrgNode] = useState(); const [dataSource, setDataSource] = useState([]); const [loading, setLoading] = useState(false); const [searchText, setSearchText] = useState(''); @@ -307,12 +312,30 @@ const UserListPage: React.FC = () => { title: '操作', key: 'actions', align: 'center', - width: 150, + width: 230, fixed: 'right', render: (_, record) => (
- + {
- -
-
-
@@ -364,10 +369,12 @@ const UserListPage: React.FC = () => { }, ]; - const onOrgSelect = (selectedKeys: React.Key[]) => { + const onOrgSelect = (selectedKeys: React.Key[], e: any) => { + const { node } = e || {}; if (selectedKeys.length > 0) { setSelectedOrg(selectedKeys[0] as number); setCurrentPage(1); + setSelectedOrgNode(node); } }; @@ -382,7 +389,6 @@ const UserListPage: React.FC = () => { }; const onSelectChange = (newSelectedRowKeys: React.Key[]) => { - console.log('selectedRowKeys changed: ', newSelectedRowKeys); setSelectedRowKeys(newSelectedRowKeys as any); }; const onDeleteGroup = async () => { @@ -399,7 +405,7 @@ const UserListPage: React.FC = () => { const { data } = result || {}; const { total = 0 } = data || {}; if (total > 0) { - message.info("该分组下有终端,请先删除该分组下的所有终端"); + message.info('该分组下有终端,请先删除该分组下的所有终端'); } else { onDeleteGroupSave(); } @@ -470,6 +476,9 @@ const UserListPage: React.FC = () => { type="text" style={{ marginRight: '8px', fontSize: '16px' }} icon={} + disabled={ + selectedOrgNode && selectedOrgNode.name === DEFAULT_BLICK_TAB + } onClick={() => setVisible(true)} /> { // onCancel={cancel} okText="删除" cancelText="取消" - disabled={!selectedOrg} + disabled={ + !selectedOrg || + (selectedOrgNode && selectedOrgNode.is_deleted === 0) + } > + ), }, @@ -201,6 +211,7 @@ const SelectedTable: React.FC = (props) => { = ({ { title: '镜像名称', dataIndex: 'image_name', + ellipsis: true, render: (text) => { - return {text || '--'}; + return {text || '--'}; + }, + }, + { + title: '源文件名', + ellipsis: true, + width: 300, + dataIndex: 'image_file_name', + render: (text) => { + return {text || '--'}; }, }, ]; @@ -104,7 +114,7 @@ const TablePage: React.FC = ({ rowKey="id" loading={loading} rowSelection={{ - selectedRowKeys:selectedRowKeys, + selectedRowKeys: selectedRowKeys, preserveSelectedRowKeys: true, onChange: onUserTableSelect, }} diff --git a/web-fe/src/pages/terminal/mod/bindImage/index.tsx b/web-fe/src/pages/terminal/mod/bindImage/index.tsx index 47804d9..0dbc306 100644 --- a/web-fe/src/pages/terminal/mod/bindImage/index.tsx +++ b/web-fe/src/pages/terminal/mod/bindImage/index.tsx @@ -1,8 +1,10 @@ // index.tsx import { ERROR_CODE } from '@/constants/constants'; import { getBindImageAdd, getBindImageList } from '@/services/terminal'; +import { ExclamationCircleOutlined } from '@ant-design/icons'; import { Button, Form, message, Modal } from 'antd'; import React, { useEffect, useState } from 'react'; +import { v4 as uuidv4 } from 'uuid'; import SelectedTable from '../ImageSelectedTable/index'; import styles from './index.less'; @@ -22,36 +24,46 @@ const BindUserModal: React.FC = ({ const { recordData, visible } = dataDetial || {}; const { device_id } = recordData || {}; const [form] = Form.useForm(); + const [loading, setLoading] = useState(false); const [dataSource, setDataSource] = useState([]); + const [currentId, setCurrentId] = useState(uuidv4()); useEffect(() => { + if (!device_id) return; + setLoading(true); const params = { device_id: device_id }; - getBindImageList(params).then((res: any) => { - const { code, data = [] } = res || {}; - if (code === ERROR_CODE) { - if (data && data.length) { - const imageList: any[] = []; - data.forEach((item: any) => { - imageList.push({ - id: item.image_id, - image_name: item.image_name, - // current_id: item.id, + getBindImageList(params) + .then((res: any) => { + const { code, data = [] } = res || {}; + if (code === ERROR_CODE) { + if (data && data.length) { + const imageList: any[] = []; + data.forEach((item: any) => { + imageList.push({ + id: item.image_id, + image_name: item.image_name, + image_file_name: item.image_file_name, + // current_id: item.id, + }); }); - }); - setDataSource(data); - const initialValues = { image_list: imageList }; - form.setFieldsValue(initialValues); + setDataSource(data); + const initialValues = { image_list: imageList }; + form.setFieldsValue(initialValues); + } } - } - }); - }, [visible, form, recordData]); + }) + .finally(() => { + setLoading(false); + }); + }, [visible, form, recordData, currentId]); const onBind = (payload: any) => { getBindImageAdd(payload).then((res: any) => { const { code } = res || {}; if (code === ERROR_CODE) { message.success('绑定成功'); - if (onOk) onOk(); + setCurrentId(uuidv4()); + // if (onOk) onOk(); } else { message.error('绑定失败'); } @@ -79,7 +91,7 @@ const BindUserModal: React.FC = ({ }); const payload: any = { data: list, - device_id:device_id, + device_id: device_id, }; onBind(payload); } catch (error) { @@ -87,6 +99,25 @@ const BindUserModal: React.FC = ({ } }; + // const onCancelHandle = async () => { + // const values = await form.validateFields(); + // const { image_list = [] } = values || {}; + // if (dataSource.length === image_list.length) { + // onCancel(); + // } else { + // Modal.confirm({ + // title: '镜像绑定信息有更新未保存,请确认是关闭弹窗', + // icon: , + // content: '', + // onOk() { + // onCancel(); + // }, + // okText: '确认', + // cancelText: '取消', + // }); + // } + // }; + return ( = ({ label="选择镜像" rules={[{ required: false, message: '请输入终端型号' }]} > - + {/* = ({ }) => { const { recordData, visible } = dataDetial || {}; const { device_id, device_group_id } = recordData || {}; + const [loading, setLoading] = useState(false); const [orgTreeData, setOrgTreeData] = useState([]); const [userDataSource, setUserDataSource] = useState([]); + const [currentId,setCurrentId] = useState(uuidv4()); // const [groupDataSource, setGroupDataSource] = useState([]); const [form] = Form.useForm(); @@ -57,6 +60,7 @@ const BindUserModal: React.FC = ({ useEffect(() => { if (!device_id) return; + setLoading(true); const payload = { device_id: device_id }; getBindUserList(payload).then((res: any) => { const { code, data = [] } = res || {}; @@ -90,8 +94,10 @@ const BindUserModal: React.FC = ({ form.setFieldsValue(initialValues); } } + }).finally(() => { + setLoading(false); }); - }, [visible, form, recordData]); + }, [visible, form, recordData,currentId]); const onBind = (payload: any) => { bindUserAdd(payload) @@ -99,7 +105,8 @@ const BindUserModal: React.FC = ({ const { code } = res || {}; if (code === ERROR_CODE) { message.success('绑定成功'); - onOk(); + // onOk(); + setCurrentId(uuidv4()) } else { message.error('绑定失败'); } @@ -199,7 +206,7 @@ const BindUserModal: React.FC = ({ label="选择用户" rules={[{ required: false, message: '请选择绑定用户' }]} > - + {/* = ({ label="终端标识" rules={[{ required: true, message: '请输入终端标识' }]} > - + void; @@ -22,6 +23,7 @@ const SelectedTable: React.FC = (props) => { const { placement = 'bottomLeft', orgTreeData, + loading, value: formValue, onChange: onBindUserChange, } = props; @@ -141,8 +143,9 @@ const SelectedTable: React.FC = (props) => { dataIndex: 'name', key: 'name', align: 'center', + ellipsis: true, render: (text) => { - return {text || '--'}; + return {text || '--'}; }, }, { @@ -150,7 +153,7 @@ const SelectedTable: React.FC = (props) => { dataIndex: 'type', key: 'type', align: 'center', - width: 220, + width: 220, render: (text) => ( {text == 1 ? '用户' : text == 2 ? '用户组' : ''} ), @@ -256,6 +259,7 @@ const SelectedTable: React.FC = (props) => { = (props) => { const { + loading, dataSource, onDelete, isSerial = true, diff --git a/web-fe/src/pages/userList/index.tsx b/web-fe/src/pages/userList/index.tsx index 13b6da5..ce9d8eb 100644 --- a/web-fe/src/pages/userList/index.tsx +++ b/web-fe/src/pages/userList/index.tsx @@ -1,5 +1,6 @@ /* eslint-disable @typescript-eslint/no-use-before-define */ import { + DEFAULT_BLICK_TAB, ERROR_CODE, GENDER_MAP, PRIORITY_MAP, @@ -30,6 +31,7 @@ import PasswordResetModal from './mod/passwordEdit'; const UserListPage: React.FC = () => { const [orgTreeData, setOrgTreeData] = useState([]); const [selectedOrg, setSelectedOrg] = useState(); + const [selectedOrgNode, setSelectedOrgNode] = useState(); // 用户列表 const [dataSource, setDataSource] = useState([]); @@ -333,16 +335,24 @@ const UserListPage: React.FC = () => { title: '操作', key: 'actions', align: 'center', - width: 160, + width: 200, fixed: 'right', render: (_, record) => (
- {/* */} - + { okText="删除" cancelText="取消" > - +
), }, ]; - const onOrgSelect = (selectedKeys: React.Key[]) => { + const onOrgSelect = (selectedKeys: React.Key[], e: any) => { + const { node } = e || {}; if (selectedKeys.length > 0) { setSelectedOrg(selectedKeys[0]); setCurrentPage(1); + setSelectedOrgNode(node); } }; @@ -462,6 +476,9 @@ const UserListPage: React.FC = () => { style={{ marginRight: '8px', fontSize: '16px' }} icon={} onClick={() => setVisible(true)} + disabled={ + selectedOrgNode && selectedOrgNode.name === DEFAULT_BLICK_TAB + } title="新增" /> { // onCancel={cancel} okText="删除" cancelText="取消" - disabled={!selectedOrg} + disabled={ + !selectedOrg || + (selectedOrgNode && selectedOrgNode.is_deleted === 0) + } >