handleShowDesc(record)}
- style={{
- cursor: "pointer",
- padding: "8px 0",
- // backgroundColor: 'black',
- fontWeight: "bold",
- }}
+ className="cursor-pointer p-2 bg-gray-50 hover:bg-blue-50 rounded border border-gray-200 hover:border-blue-300 transition-colors duration-200"
>
- {text || "未命名故障"}
+
+ {text || "未命名故障"}
+
),
},
@@ -224,30 +225,29 @@ const DeviceTable = forwardRef(
const statusConfig = {
normal: {
text: "已修复",
- color: "success",
+ className: "bg-green-100 text-green-800 border-green-200",
},
maintenance: {
text: "维修中",
- color: "processing",
+ className: "bg-blue-100 text-blue-800 border-blue-200",
},
broken: {
text: "未修复",
- color: "error",
+ className: "bg-red-100 text-red-800 border-red-200",
},
};
const config = statusConfig[status] || {
text: "未知",
- color: "default",
+ className: "bg-gray-100 text-gray-800 border-gray-200",
};
return (
-
+
-
@@ -503,7 +508,7 @@ const DeviceTable = forwardRef(
单位: "单位名称",
故障名称: "示例故障名称",
故障状态: "未修复", // 可选值:已修复, 维修中, 未修复
- 描述: "这是一个示例描述",
+ 描述: "示例描述",
},
];
@@ -530,7 +535,7 @@ const DeviceTable = forwardRef(
const rowSelection = {
selectedRowKeys,
onChange: onSelectChange,
- columnWidth: 70,
+ columnWidth: 60,
columnTitle: (
- 全选
+
+ 全选
+
),
- preserveSelectedRowKeys: true, // 这个属性保证翻页时选中状态不丢失
+ preserveSelectedRowKeys: true,
};
const TableHeader = () => (
-
-
-
+
+
+
+
+
+
+
数据管理
+
+ {devices?.length ? `共 ${devices.length} 条记录` : "暂无数据"}
+
+
+
+
}
- type="primary"
onClick={handleExportTemplate}
+ className="border-gray-300 hover:border-blue-500 hover:text-blue-600"
+ size="small"
>
- 下载模板文件
+ 下载模板
}
- type="primary"
onClick={handleImportClick}
+ className="border-gray-300 hover:border-green-500 hover:text-green-600"
+ size="small"
>
- 导入
+ 导入数据
}
+ type={selectedRowKeys?.length > 0 ? "primary" : "default"}
+ className={
+ selectedRowKeys?.length > 0 ? "bg-blue-600 hover:bg-blue-700" : ""
+ }
+ size="small"
>
{selectedRowKeys?.length > 0
- ? `导出 (${selectedRowKeys.length})项数据`
- : "导出选中数据"}
+ ? `导出 (${selectedRowKeys.length})`
+ : "导出选中"}
);
return (
- <>
+
- index % 2 === 0
- ? "bg-white hover:bg-blue-100"
- : "bg-gray-100 hover:bg-blue-100"
+ `${
+ index % 2 === 0
+ ? "bg-white hover:bg-blue-50"
+ : "bg-gray-50 hover:bg-blue-50"
+ } transition-colors duration-200`
}
- onRow={(record) => {
- return {
- style: { cursor: "pointer" },
- onMouseEnter: () => {},
- };
- }}
- onHeaderRow={() => {
- return {
- style: {
- backgroundColor: "#d6e4ff",
- },
- };
- }}
+ onRow={(record) => ({
+ style: { cursor: "pointer" },
+ })}
+ onHeaderRow={() => ({
+ style: {
+ backgroundColor: "#f8fafc",
+ },
+ })}
scroll={{ x: "max-content" }}
pagination={{
position: ["bottomCenter"],
- className: "flex justify-center mt-4",
+ className: "mt-4",
pageSize: pageSize,
current: currentPage,
showSizeChanger: true,
pageSizeOptions: ["10", "15", "20"],
responsive: true,
- showTotal: (total, range) => `共${total} 条数据`,
+ showTotal: (total, range) => (
+
+ 显示第 {range[0]}-{range[1]} 条，共 {total} 条数据
+
+ ),
showQuickJumper: true,
onChange: handlePageChange,
onShowSizeChange: handlePageSizeChange,
}}
- components={{
- header: {
- cell: (props) => (
- |
- ),
- },
- }}
bordered
- className="device-table-no-wrap"
+ className="bg-white rounded-lg shadow-sm"
/>
+
+ {/* 简化的模态框 */}
+
+
+ {currentDesc.title}
+
+
+ }
open={descModalVisible}
onCancel={() => setDescModalVisible(false)}
footer={[
@@ -664,22 +682,33 @@ const DeviceTable = forwardRef(
关闭
,
]}
+ width={800}
>
-
-
故障详情
-
- {currentDesc.desc}
+
+
+
+ 故障详情
+
+
+
+ {currentDesc.desc}
+
+
- {/* 添加附件展示区域 */}
+
{currentDesc?.id && (
-
-
+
);
}
);
diff --git a/apps/web/src/app/main/devicepage/page.tsx b/apps/web/src/app/main/devicepage/page.tsx
index f475f06..9de2e9c 100755
--- a/apps/web/src/app/main/devicepage/page.tsx
+++ b/apps/web/src/app/main/devicepage/page.tsx
@@ -10,6 +10,10 @@ import {
Tag,
Dropdown,
Space,
+ Card,
+ Row,
+ Col,
+ Typography,
} from "antd";
import { useCallback, useEffect, useState, useRef } from "react";
import _ from "lodash";
@@ -27,6 +31,8 @@ import {
DownOutlined,
HistoryOutlined,
CloseOutlined,
+ FilterOutlined,
+ DatabaseOutlined,
} from "@ant-design/icons";
import DepartmentSelect from "@web/src/components/models/department/department-select";
import SystemTypeSelect from "@web/src/app/main/devicepage/select/System-select";
@@ -36,7 +42,7 @@ import FixTypeSelect from "./select/Fix-select";
import { api } from "@nice/client";
const { RangePicker } = DatePicker;
-
+const { Title } = Typography;
// 添加筛选条件类型
type SearchCondition = {
deletedAt: null;
@@ -378,112 +384,199 @@ export default function DeviceMessage() {
];
return (
-
-
-
故障收录检索
-
-
- } title="搜索历史">
- 历史
-
-
- } onClick={handleNew}>
- 新建
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- setDateRange(dates)}
- format="YYYY-MM-DD"
- allowClear
- />
-
-
} onClick={handleSearch}>
- 查询
-
-
} onClick={handleReset}>
- 重置
-
-
-
- {/* 显示当前搜索历史标签 */}
- {searchHistory.length > 0 && (
-
-
- 最近搜索:
-
-
- {searchHistory.slice(0, 5).map((history) => (
-
applyHistorySearch(history)}
- closable
- onClose={(e) => {
- e.preventDefault();
- removeSearchHistory(history.id, e as any);
- }}
+
+ {/* 页面标题区域 */}
+
+
+
+
+
+
+
+
+
+ 故障收录检索
+
+
+ 设备故障信息管理与查询系统
+
+
+
+
+
-
- {history.label.length > 25
- ? `${history.label.substring(0, 25)}...`
- : history.label}
-
-
- ))}
+ }
+ className="border-gray-300 hover:border-blue-500 hover:text-blue-600"
+ >
+ 历史
+
+
+ }
+ onClick={handleNew}
+ className="bg-blue-600 hover:bg-blue-700 border-blue-600"
+ >
+ 新建故障记录
+
+
- )}
+
+
+ {/* 搜索筛选区域 */}
+
+
+
+
+ 筛选条件
+
+
+
+
+
+
+ {
+ setSelectedSystem(value);
+ setSelectedSystemTypeId(value || ""); // 同步更新
+ setSelectedDeviceType(null); // 清空故障类型选择
+ }}
+ placeholder="选择网系类别"
+ className="w-full"
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ setDateRange(dates)}
+ format="YYYY-MM-DD"
+ allowClear
+ />
+
+
+
+
+
+
+ }
+ onClick={handleSearch}
+ className="bg-blue-600 hover:bg-blue-700 border-blue-600"
+ block
+ >
+ 查询
+
+ }
+ onClick={handleReset}
+ className="border-gray-300 hover:border-gray-400"
+ >
+ 重置
+
+
+
+
+
+
+
+ 最近搜索
+
+
+
+ {searchHistory.slice(0, 5).map((history) => (
+ applyHistorySearch(history)}
+ closable
+ onClose={(e) => {
+ e.preventDefault();
+ removeSearchHistory(history.id, e as any);
+ }}
+ >
+
+ {history.label.length > 25
+ ? `${history.label.substring(0, 25)}...`
+ : history.label}
+
+
+ ))}
+
+
+
+ {/* 表格区域 */}
+
-
);
}
diff --git a/apps/web/src/app/main/devicepage/select/Device-manager.tsx b/apps/web/src/app/main/devicepage/select/Device-manager.tsx
index 67c5c7f..d983b44 100755
--- a/apps/web/src/app/main/devicepage/select/Device-manager.tsx
+++ b/apps/web/src/app/main/devicepage/select/Device-manager.tsx
@@ -87,15 +87,15 @@ export default function DeviceManager({ title }: TermManagerProps) {
orderBy: { order: "asc" },
});
- const handlePageChange = (page: number, size: number) => {
- setCurrentPage(page);
- setPageSize(size);
- };
-
- const handlePageSizeChange = (current: number, size: number) => {
- setCurrentPage(1); // 重置到第一页
- setPageSize(size);
- };
+ const handlePageChange = (page: number, size: number) => {
+ setCurrentPage(page);
+ setPageSize(size);
+ };
+
+ const handlePageSizeChange = (current: number, size: number) => {
+ setCurrentPage(1); // 重置到第一页
+ setPageSize(size);
+ };
// 构建包含两种分类的树形数据
useEffect(() => {
if (systemTypeTerms && deviceTypeTerms) {
@@ -261,14 +261,18 @@ export default function DeviceManager({ title }: TermManagerProps) {
Modal.confirm({
title: "确认删除",
content: `确定要删除"${term.name}"吗？这将同时删除其下所有子项！`,
- onOk: () => softDeleteByIds({ ids: [term.id] },{
- onSuccess: () => {
- message.success("删除成功");
- },
- onError: () => {
- message.error("删除失败");
- },
- }),
+ onOk: () =>
+ softDeleteByIds(
+ { ids: [term.id] },
+ {
+ onSuccess: () => {
+ message.success("删除成功");
+ },
+ onError: () => {
+ message.error("删除失败");
+ },
+ }
+ ),
});
refetchSystemType();
refetchDeviceType();
@@ -277,6 +281,12 @@ export default function DeviceManager({ title }: TermManagerProps) {
const handleSave = () => {
if (!termName.trim() || !taxonomyId) return;
+ // 如果是故障类型，上级分类为必填
+ if (taxonomyId === deviceTypeTaxonomy?.id && !parentId) {
+ message.error("故障类型必须选择上级分类（网系类别）");
+ return;
+ }
+
if (editingTerm) {
updateTerm({
where: { id: editingTerm.id },
@@ -371,7 +381,7 @@ export default function DeviceManager({ title }: TermManagerProps) {
{/* 主要内容卡片 */}
- {/* 统计信息区域 */}
+ {/* 统计信息区域 */}
@@ -395,15 +405,15 @@ export default function DeviceManager({ title }: TermManagerProps) {
{/* */}
- {/* */}
- {/*
+ {/*
*/}
+ {/*
{deviceTypeTerms?.filter(term =>
!systemTypeTerms?.some(sysType => sysType.id === term.parentId) &&
deviceTypeTerms?.some(devType => devType.id === term.parentId)
).length || 0}
具体故障
*/}
- {/*
+ {/*
*/}
-
-
{/* 表格区域 */}
(
+ render: (text, record, index) => (
{/* 根据层级添加不同的图标 */}
{record.taxonomyId === systemTypeTaxonomy?.id ? (
@@ -537,7 +545,7 @@ export default function DeviceManager({ title }: TermManagerProps) {
showSizeChanger: true,
showQuickJumper: true,
showTotal: (total) => `共 ${total} 条记录`,
- pageSizeOptions: [ "10", "15", "20"],
+ pageSizeOptions: ["10", "15", "20"],
onChange: handlePageChange,
onShowSizeChange: handlePageSizeChange,
}}
@@ -546,8 +554,8 @@ export default function DeviceManager({ title }: TermManagerProps) {
record.taxonomyId === systemTypeTaxonomy?.id
? "bg-blue-25"
: record.taxonomyId === deviceTypeTaxonomy?.id
- ? "bg-green-25"
- : "bg-orange-25"
+ ? "bg-green-25"
+ : "bg-orange-25"
}`
}
onHeaderRow={() => ({
@@ -621,11 +629,27 @@ export default function DeviceManager({ title }: TermManagerProps) {
+