Skip to content

S
szse
Commit 5a71127e by 放生的三文鱼
Options

修改资产草稿

parent 79a8c7f8
Showing with 308 additions and 20 deletions
src/view/Manage/AssetDraft/component/AssetDraft.jsx
import React, { useState, useEffect, useMemo } from "react";
import { Table, Button, Space, Input, Select, Tag, Modal, message } from "antd";
import React, { useCallback } from "react";
import {
Table,
Button,
Space,
Input,
Select,
Tag,
Modal,
Pagination,
} from "antd";
import { useGetAssetDraft } from "../hooks/assetData";
const { Option } = Select;
import { debounce } from "lodash";
import './index.less'
// 主组件
const AssetManagementTable = () => {
const {
......@@ -10,22 +19,44 @@ const AssetManagementTable = () => {
templates,
currentTemplate,
setCurrentTemplate,
columns,
setParams,
pagination,
setPagination,
dataLoading,
draftData,
} = useGetAssetDraft();
console.log("columns", columns);
const changeTemplate = (value) => {
setCurrentTemplate(value);
};
// 防抖更新查询条件
const debouncedChangeParams = useCallback(
debounce((key, value) => {
setParams((prev) => ({
...prev,
[key]: value,
}));
}, 500), // 500ms 防抖时间
[]
);
const changeParams = (key, value) => {
setParams((prev) => ({
debouncedChangeParams(key, value);
};
const handlePageChange = (page, size) => {
setPagination((prev) => ({
...prev,
[key]: value,
pageNum: page,
pageSize: size,
}));
};
return (
<div style={{ background: "#fff" }}>
<div style={{ background: "#fff"}} className="container">
{/* 操作按钮区域 */}
<div
style={{
......@@ -63,25 +94,44 @@ const AssetManagementTable = () => {
changeParams("state", value);
}}
/>
<Select placeholder="请选择搜索属性" style={{ width: 140 }}>
{/* <Select placeholder="请选择搜索属性" style={{ width: 140 }}>
<Option value="id">资产编号</Option>
<Option value="engName">资产英文名</Option>
<Option value="chnName">资产中文名</Option>
<Option value="assetItem">资产项</Option>
</Select>
</Select> */}
<Input placeholder="请输入关键字" style={{ width: 200 }} allowClear />
<Input
placeholder="请输入关键字"
style={{ width: 200 }}
allowClear
onChange={(e) => {
changeParams("keyword", e.target.value);
}}
/>
</Space>
</div>
{/* 表格区域 */}
<Table
// rowSelection={rowSelection}
// columns={}
// dataSource={filteredData}
// loading={loading}
columns={columns ?? []}
dataSource={draftData ?? []}
loading={dataLoading}
pagination={null}
size="middle"
scroll={{ x: true }}
/>
<Pagination
style={{ margin: "12px auto",textAlign: "center"}}
showTotal={(total) => `共 ${total} 条记录`}
showSizeChanger
showQuickJumper
pageSize={pagination.pageSize}
current={pagination.pageNum}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
total={pagination.total}
/>
</div>
);
......
src/view/Manage/AssetDraft/component/index.less 0 → 100644
.container {
height: calc(100vh - 196px) !important;
}
src/view/Manage/AssetDraft/hooks/assetData.jsx
import { useEffect, useState, useMemo } from "react";
import { useEffect, useState } from "react";
import { Tooltip, Typography, Button, Tag } from "antd";
import {
getTemplates,
getDraftDataAsset,
listFilterElementsGroupByType,
} from "../../../../service/dataassetmanager";
import { AssetItem } from "../../AssetManage/Component/AssetTable";
const { Text } = Typography;
// ../standardmanage/hooks/sourceMap
export function useGetAssetDraft() {
const [loading, setLoading] = useState(false);
const [templates, setTemplates] = useState();
const [currentTemplate, setCurrentTemplate] = useState();
const [columns, setColumns] = useState([]);
const [params, setParams] = useState({
state: "",
});
......@@ -36,17 +40,243 @@ export function useGetAssetDraft() {
getTemplatesList();
}, []);
const getColumns = async () => {
try {
const data = await listFilterElementsGroupByType({
templateType: currentTemplate,
isAdmin: true,
});
let _columns = [];
let index = 0,
_metadataIndex = "";
(data || []).forEach((group) => {
(group.names || []).forEach((name, i) => {
index++;
const params = {
title: name,
dataIndex: `element${index}`,
ellipsis: true,
render: (text, record) => {
return (
<Tooltip title={text || ""}>
<Text ellipsis={true}>{text || ""}</Text>
</Tooltip>
);
},
};
// if (name === "编号") {
// params.width = 60;
// // params.fixed = 'left';
// } else if (name === "中文名称") {
// params.width = 160;
// // params.fixed = 'left';
// } else if (name === "英文名称") {
// // params.fixed = 'left';
// // params.render = (text, record) => {
// // return (
// // <Tooltip title={text||''}>
// // <a onClick={()=>{detailAsset(record);}}>
// // {text||''}
// // </a>
// // </Tooltip>
// // );
// // }
if (name === "资产项") {
// params.width = 120;
params.render = (metadata, _) => {
return <AssetItem metadata={metadata} />;
};
_metadataIndex = `element${index}`;
} else if (name === "资产目录路径") {
params.render = (text, record) => {
return (
<Tooltip title={text || ""}>
<Text ellipsis={true}>
<a
onClick={() => {
let event = new Event("storage");
event.key = "assetDirChangeEvent";
event.dirId = record.dirId || "";
window?.dispatchEvent(event);
}}
>
{text || ""}
</a>
</Text>
</Tooltip>
);
};
}
_columns.push(params);
});
});
// 添加草稿操作列
_columns.push({
title: "草稿操作",
dataIndex: "operationType",
key: "operationType",
render: (text, record) => {
let statusText = "";
let color = "";
switch (text) {
case "change":
statusText = "修改";
color = "orange";
break;
case "release":
statusText = "新增";
color = "green";
break;
case "offline":
statusText = "下线";
color = "grey";
break;
case "delete":
statusText = "删除";
color = "red";
break;
default:
statusText = text || "-";
}
return <Tag color={color}>{statusText}</Tag>;
},
});
// 添加草稿状态列
_columns.push({
title: "草稿状态",
dataIndex: "draftState",
key: "draftState",
render: (text, record) => {
let statusText = "";
let color = "";
switch (text) {
case "draft":
statusText = "草稿";
color = "orange";
break;
case "auditing":
statusText = "审核中";
color = "green";
break;
default:
statusText = text || "未设置";
}
return <Tag color={color}>{statusText}</Tag>;
},
});
// 添加操作列
_columns.push({
title: "操作",
key: "action",
width: 160,
render: (text, record) => {
const disabled = record?.draftState !== "draft";
const handlePublish = () => {
// 发布操作逻辑
console.log("发布记录:", record);
};
const handleStop = () => {
// 停用操作逻辑
console.log("停用记录:", record);
};
const handleEdit = () => {
// 编辑操作逻辑
console.log("编辑记录:", record);
};
const handleDelete = () => {
// 删除操作逻辑
console.log("删除记录:", record);
};
return (
<div>
<Button
disabled={disabled}
type="link"
size="small"
onClick={handlePublish}
>
送审
</Button>
<Button
size="small"
waring
disabled={disabled}
type="link"
onClick={handleEdit}
>
编辑
</Button>
<Button
disabled={disabled}
size="small"
type="link"
danger
onClick={handleDelete}
>
删除
</Button>
</div>
);
},
});
setColumns(_columns);
} catch (error) {
console.error("获取列配置失败:", error);
}
};
useEffect(() => {
if (currentTemplate) {
getColumns();
}
}, [currentTemplate]);
const getDraftData = async () => {
try {
// 设置数据加载状态为true，表示开始加载
setDataLoading(true);
const res = await getDraftDataAsset({
const data = await getDraftDataAsset({
...pagination,
...params,
templateType: currentTemplate,
total: undefined,
});
console.log("data", res);
const _assets = [];
(data.data || []).forEach((asset) => {
let _asset = { ...asset },
index = 0;
(asset.elementValues || []).forEach((elementValue) => {
(elementValue.values || []).forEach((value, i) => {
index++;
let metadata = {};
try {
metadata = JSON.parse(value);
_asset["metadata"] = metadata;
_asset[`element${index}`] = metadata;
} catch (error) {
metadata = value;
_asset["metadata"] = metadata;
_asset[`element${index}`] = metadata;
}
});
});
_assets.push(_asset);
});
setDraftData(_assets);
setPagination((pre) => ({
...pre,
total: data?.total,
}));
setDataLoading(false);
} catch (error) {
setDataLoading(false);
......@@ -64,6 +294,11 @@ export function useGetAssetDraft() {
templates,
currentTemplate,
setCurrentTemplate,
columns,
setParams,
pagination,
setPagination,
dataLoading,
draftData,
};
}
src/view/Manage/AssetDraft/index.jsx
......@@ -3,7 +3,9 @@ import { Tabs } from "antd";
import AssetDraft from "./component/AssetDraft";
const { TabPane } = Tabs;
const Index = () => {
const Index = (props) => {
console.log('props',props);
const [tabKey, setTabKey] = useState("1");
const onTabChange = (key) => {
......
src/view/Manage/AssetManage/Component/AssetDetailDrawer.jsx
......@@ -5,7 +5,6 @@ import AssetAction from './AssetAction';
const AssetDetailDrawer = (props) => {
const { onCancel, visible, id, dirId, reference } = props;
const [ form ] = Form.useForm();
return (
......
src/view/Manage/AssetManage/index.jsx
......@@ -15,7 +15,6 @@ import { AssetManageReference } from '../../../util/constant';
import './index.less';
const AssetManage = (props) => {
const [ nodeId, setNodeId ] = useState(null);
const [ nodeType, setNodeType ] = useState('');
const [ nodeLevel, setNodeLevel ] = useState(null);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment