refactor: 移除调试日志并优化代码结构

feat(components): 新增设备管理相关组件和仪表盘组件 feat(hooks): 添加自定义hooks用于API调用和数据管理 style: 优化滚动条样式和模态框布局 chore: 清理无用脚本和调试文件 docs: 更新组件导出文件
2026-03-10 14:34:39 +08:00
parent 98f705de8b
commit 196dc4ae41
43 changed files with 3082 additions and 3736 deletions
@@ -0,0 +1,110 @@
+import React from 'react';
+import { Modal, Form, Select, Button } from 'antd';
+import { ReloadOutlined } from '@ant-design/icons';
+import { designTokens } from '../../config/theme';
+
+const { Option } = Select;
+
+const modalHeaderStyle = {
+  display: 'flex',
+  alignItems: 'center',
+  gap: '8px',
+  fontSize: '18px',
+  fontWeight: 600,
+};
+
+const secondaryActionStyle = {
+  height: '40px',
+  borderRadius: designTokens.borderRadius.small,
+  border: `1px solid ${designTokens.colors.border.light}`,
+  fontWeight: '500',
+};
+
+const BatchStatusModal = ({
+  visible,
+  selectedCount,
+  loading,
+  onSubmit,
+  onCancel,
+}) => {
+  const [form] = Form.useForm();
+
+  const handleSubmit = async () => {
+    try {
+      const values = await form.validateFields();
+      await onSubmit(values.status);
+    } catch (error) {
+      if (!error.errorFields) {
+        console.error('批量状态变更失败:', error);
+      }
+    }
+  };
+
+  return (
+    <Modal
+      title={
+        <div style={{ ...modalHeaderStyle, paddingRight: '32px' }}>
+          <ReloadOutlined style={{ color: '#52c41a' }} />
+          批量状态变更
+        </div>
+      }
+      open={visible}
+      onCancel={onCancel}
+      footer={[
+        <Button key="cancel" onClick={onCancel} style={secondaryActionStyle}>
+          取消
+        </Button>,
+        <Button
+          key="submit"
+          type="primary"
+          loading={loading}
+          onClick={handleSubmit}
+          style={{
+            height: '40px',
+            borderRadius: designTokens.borderRadius.small,
+            background: designTokens.colors.primary.gradient,
+            border: 'none',
+            color: '#ffffff',
+            boxShadow: designTokens.shadows.small,
+            fontWeight: '500',
+            display: 'inline-flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+          }}
+        >
+          确定
+        </Button>,
+      ]}
+      destroyOnHidden
+      styles={{
+        header: {
+          borderBottom: '1px solid #f0f0f0',
+          padding: '16px 24px',
+          position: 'relative',
+        },
+        body: { padding: '24px' },
+      }}
+    >
+      <Form form={form} layout="vertical">
+        <Form.Item
+          name="status"
+          label="选择新状态"
+          rules={[{ required: true, message: '请选择设备状态' }]}
+        >
+          <Select placeholder="请选择设备状态" style={{ width: '100%' }}>
+            <Option value="running">运行中</Option>
+            <Option value="maintenance">维护中</Option>
+            <Option value="offline">离线</Option>
+            <Option value="fault">故障</Option>
+          </Select>
+        </Form.Item>
+        <div style={{ color: '#666', fontSize: '13px' }}>
+          已选择{' '}
+          <span style={{ color: '#1890ff', fontWeight: 600 }}>{selectedCount}</span> 个设备
+        </div>
+      </Form>
+    </Modal>
+  );
+};
+
+export default React.memo(BatchStatusModal);