fix: 样本管理样式更改
This commit is contained in:
@@ -35,7 +35,6 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
|
||||
type={action.type}
|
||||
danger={action.danger}
|
||||
disabled={action.disabled}
|
||||
// icon={action.icon ?? <PlusOutlined />}
|
||||
onClick={() => action.onClick()}
|
||||
>
|
||||
{action.label}
|
||||
@@ -55,7 +54,6 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
|
||||
toolBarRender={toolBarRender}
|
||||
manualRequest={false}
|
||||
showSorterTooltip
|
||||
// scroll={{ x: "max-content" }}
|
||||
scroll={scroll ? scroll : { x: 1200 }}
|
||||
components={components}
|
||||
search={
|
||||
@@ -84,6 +82,7 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
// pageSize: 10,
|
||||
defaultPageSize: 10,
|
||||
showTotal: formatPaginationTotal,
|
||||
}
|
||||
: false
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
.uploader-card {
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
:global {
|
||||
.ant-upload-drag {
|
||||
background-color: #fff;
|
||||
|
||||
@@ -5,7 +5,11 @@ import type {
|
||||
} from '@ant-design/pro-components';
|
||||
import { Modal, message, Switch } from 'antd';
|
||||
import dayjs from 'dayjs';
|
||||
import { type AiModelRespVO, updateModelStatus } from '@/services/ai/model';
|
||||
import {
|
||||
type AiModelRespVO,
|
||||
updateModel,
|
||||
updateModelStatus,
|
||||
} from '@/services/ai/model';
|
||||
|
||||
export const baseDeptColumns: ProColumns<AiModelRespVO>[] = [
|
||||
{
|
||||
@@ -47,9 +51,9 @@ export const baseDeptColumns: ProColumns<AiModelRespVO>[] = [
|
||||
}"类目吗?`,
|
||||
onOk: async () => {
|
||||
console.log(checked);
|
||||
await updateModelStatus({
|
||||
await updateModel({
|
||||
...record,
|
||||
status: checked ? 1 : 0,
|
||||
id: record.id,
|
||||
});
|
||||
message.success('修改成功');
|
||||
action?.reload();
|
||||
|
||||
@@ -175,166 +175,180 @@ const SampleTagDetail = <T extends Record<string, any>>(
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<ProForm name="validate_other" formRef={formRef} submitter={false}>
|
||||
{type === 'radio' && (
|
||||
<ProFormGroup title="预览">
|
||||
{data?.[0].sampleFilePath && (
|
||||
<audio
|
||||
controls
|
||||
preload="true"
|
||||
crossOrigin="anonymous"
|
||||
style={{ marginBottom: 24 }}
|
||||
>
|
||||
<source src={data[0].sampleFilePath} />
|
||||
<track kind="captions" />
|
||||
</audio>
|
||||
{data!.length > 0 ? (
|
||||
<>
|
||||
<ProForm name="validate_other" formRef={formRef} submitter={false}>
|
||||
{type === 'radio' && (
|
||||
<ProFormGroup title="预览">
|
||||
{data?.[0].sampleFilePath && (
|
||||
<audio
|
||||
controls
|
||||
preload="true"
|
||||
crossOrigin="anonymous"
|
||||
style={{ marginBottom: 24 }}
|
||||
>
|
||||
<source src={data[0].sampleFilePath} />
|
||||
<track kind="captions" />
|
||||
</audio>
|
||||
)}
|
||||
</ProFormGroup>
|
||||
)}
|
||||
</ProFormGroup>
|
||||
)}
|
||||
<ProFormGroup title="基本信息">
|
||||
{type === 'radio' && (
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="sampleName"
|
||||
placeholder="请输入样本名称"
|
||||
fieldProps={{
|
||||
onBlur: async (e) => {
|
||||
if (e.target.value) {
|
||||
const newData =
|
||||
data?.map((sample) => {
|
||||
return {
|
||||
id: sample.id,
|
||||
sampleName: e.target.value,
|
||||
};
|
||||
}) || [];
|
||||
await updateSamples(newData);
|
||||
props?.onRefresh?.();
|
||||
message.success('更新样本名称成功');
|
||||
}
|
||||
},
|
||||
}}
|
||||
rules={[{ required: true, message: '样本名称不能为空' }]}
|
||||
/>
|
||||
)}
|
||||
<ProFormText
|
||||
width="md"
|
||||
fieldProps={{
|
||||
onBlur: async (e) => {
|
||||
if (e.target.value) {
|
||||
const newData =
|
||||
data?.map((sample) => {
|
||||
return {
|
||||
id: sample.id,
|
||||
remark: e.target.value,
|
||||
};
|
||||
}) || [];
|
||||
await updateSamples(newData);
|
||||
props?.onRefresh?.();
|
||||
message.success('更新注释成功');
|
||||
}
|
||||
<ProFormGroup title="基本信息">
|
||||
{type === 'radio' && (
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="sampleName"
|
||||
placeholder="请输入样本名称"
|
||||
fieldProps={{
|
||||
onBlur: async (e) => {
|
||||
if (e.target.value) {
|
||||
const newData =
|
||||
data?.map((sample) => {
|
||||
return {
|
||||
id: sample.id,
|
||||
sampleName: e.target.value,
|
||||
};
|
||||
}) || [];
|
||||
await updateSamples(newData);
|
||||
props?.onRefresh?.();
|
||||
message.success('更新样本名称成功');
|
||||
}
|
||||
},
|
||||
}}
|
||||
rules={[{ required: true, message: '样本名称不能为空' }]}
|
||||
/>
|
||||
)}
|
||||
<ProFormText
|
||||
width="md"
|
||||
fieldProps={{
|
||||
onBlur: async (e) => {
|
||||
if (e.target.value) {
|
||||
const newData =
|
||||
data?.map((sample) => {
|
||||
return {
|
||||
id: sample.id,
|
||||
remark: e.target.value,
|
||||
};
|
||||
}) || [];
|
||||
await updateSamples(newData);
|
||||
props?.onRefresh?.();
|
||||
message.success('更新注释成功');
|
||||
}
|
||||
},
|
||||
}}
|
||||
name="remark"
|
||||
placeholder="请输入注释"
|
||||
/>
|
||||
</ProFormGroup>
|
||||
|
||||
<ProFormGroup title="标签">
|
||||
{/* <Form.Item name="tag"> */}
|
||||
{forMap(value.tags || [])}
|
||||
</ProFormGroup>
|
||||
<Button
|
||||
type="dashed"
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleAddTag}
|
||||
>
|
||||
添加标签
|
||||
</Button>
|
||||
<ProFormGroup title="文本信息" block></ProFormGroup>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>添加日期: </span>
|
||||
<span>
|
||||
{dayjs(value.createTime).format('YYYY-MM-DD HH:mm:ss')}
|
||||
</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>修改日期</span>
|
||||
<span>
|
||||
{dayjs(value.updateTime).format('YYYY-MM-DD HH:mm:ss')}
|
||||
</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>文件大小: </span>
|
||||
<span>{value.sampleSize}</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>格式: </span>
|
||||
<span>{value.sampleMineType}</span>
|
||||
</Space>
|
||||
|
||||
{type === 'checkbox' && (
|
||||
<>
|
||||
<ProFormGroup title="其他"></ProFormGroup>
|
||||
<Button
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleTagManager}
|
||||
>
|
||||
批量重命名
|
||||
</Button>
|
||||
<Button
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleDownloadAll}
|
||||
>
|
||||
下载到本地
|
||||
</Button>
|
||||
<Button
|
||||
block
|
||||
color="danger"
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleDeleteAll}
|
||||
>
|
||||
删除样本
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</ProForm>
|
||||
<GroupTagModal
|
||||
visible={modalVisible}
|
||||
onCancel={() => setModalVisible(false)}
|
||||
onChange={onListAddTag}
|
||||
editable={false}
|
||||
value={value?.tags}
|
||||
request={{
|
||||
groupsApi: {
|
||||
get: getSampleTagGroup,
|
||||
create: createSampleTagGroup,
|
||||
delete: deleteSampleTagGroup,
|
||||
update: updateSampleTagGroup,
|
||||
},
|
||||
tagsApi: {
|
||||
get: getSampleTagPage,
|
||||
create: createSampleTag,
|
||||
delete: deleteSampleTag,
|
||||
update: updateSampleTag,
|
||||
},
|
||||
}}
|
||||
name="remark"
|
||||
placeholder="请输入注释"
|
||||
title="管理技术标签"
|
||||
width={800}
|
||||
height={500}
|
||||
/>
|
||||
</ProFormGroup>
|
||||
|
||||
<ProFormGroup title="标签">
|
||||
{/* <Form.Item name="tag"> */}
|
||||
{forMap(value.tags || [])}
|
||||
</ProFormGroup>
|
||||
<Button
|
||||
type="dashed"
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleAddTag}
|
||||
>
|
||||
添加标签
|
||||
</Button>
|
||||
<ProFormGroup title="文本信息" block></ProFormGroup>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>添加日期: </span>
|
||||
<span>{dayjs(value.createTime).format('YYYY-MM-DD HH:mm:ss')}</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>修改日期</span>
|
||||
<span>{dayjs(value.updateTime).format('YYYY-MM-DD HH:mm:ss')}</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>文件大小: </span>
|
||||
<span>{value.sampleSize}</span>
|
||||
</Space>
|
||||
<Space size={10} style={{ width: '100%', marginBottom: 12 }}>
|
||||
<span>格式: </span>
|
||||
<span>{value.sampleMineType}</span>
|
||||
</Space>
|
||||
|
||||
{type === 'checkbox' && (
|
||||
<>
|
||||
<ProFormGroup title="其他"></ProFormGroup>
|
||||
<Button
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleTagManager}
|
||||
<TagManager
|
||||
visible={tagManagerVisible}
|
||||
files={tagNames}
|
||||
onOk={onRename}
|
||||
onCancel={() => setTagManagerVisible(false)}
|
||||
></TagManager>
|
||||
{type === 'radio' && (
|
||||
<Space
|
||||
style={{ width: '100%', justifyContent: 'center', padding: 12 }}
|
||||
>
|
||||
批量重命名
|
||||
</Button>
|
||||
<Button
|
||||
block
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleDownloadAll}
|
||||
>
|
||||
下载到本地
|
||||
</Button>
|
||||
<Button
|
||||
block
|
||||
color="danger"
|
||||
style={{ marginBottom: 24 }}
|
||||
onClick={handleDeleteAll}
|
||||
>
|
||||
删除样本
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</ProForm>
|
||||
<GroupTagModal
|
||||
visible={modalVisible}
|
||||
onCancel={() => setModalVisible(false)}
|
||||
onChange={onListAddTag}
|
||||
editable={false}
|
||||
value={value?.tags}
|
||||
request={{
|
||||
groupsApi: {
|
||||
get: getSampleTagGroup,
|
||||
create: createSampleTagGroup,
|
||||
delete: deleteSampleTagGroup,
|
||||
update: updateSampleTagGroup,
|
||||
},
|
||||
tagsApi: {
|
||||
get: getSampleTagPage,
|
||||
create: createSampleTag,
|
||||
delete: deleteSampleTag,
|
||||
update: updateSampleTag,
|
||||
},
|
||||
}}
|
||||
title="管理技术标签"
|
||||
width={800}
|
||||
height={500}
|
||||
/>
|
||||
<TagManager
|
||||
visible={tagManagerVisible}
|
||||
files={tagNames}
|
||||
onOk={onRename}
|
||||
onCancel={() => setTagManagerVisible(false)}
|
||||
></TagManager>
|
||||
<Space style={{ width: '100%', justifyContent: 'center', padding: 12 }}>
|
||||
<Button color="danger" onClick={onDownload}>
|
||||
下载
|
||||
</Button>
|
||||
<Button color="danger" variant="solid" onClick={handleDeleteAll}>
|
||||
删除
|
||||
</Button>
|
||||
</Space>
|
||||
<Button color="danger" onClick={onDownload}>
|
||||
下载
|
||||
</Button>
|
||||
<Button color="danger" variant="solid" onClick={handleDeleteAll}>
|
||||
删除
|
||||
</Button>
|
||||
</Space>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
'暂无数据-请选择样本'
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,18 +1,28 @@
|
||||
.tag-content {
|
||||
display: flex;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
:global {
|
||||
.ant-pro-table {
|
||||
flex: 1 auto;
|
||||
.left {
|
||||
padding-right: 385px;
|
||||
}
|
||||
.uploader-card {
|
||||
padding-right: 400px;
|
||||
}
|
||||
|
||||
.detail {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-left: 1px solid #e8e8e8;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
width: 400px;
|
||||
padding: 16px;
|
||||
top: 74px;
|
||||
height: calc(100vh - 80px);
|
||||
overflow: auto;
|
||||
background: #fff;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
form {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@@ -77,35 +77,37 @@ const SampleTag: React.FC = () => {
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<UploadCard onChange={onChangeVideo} />
|
||||
<div className={styles['tag-content']}>
|
||||
<EnhancedProTable<AiSampleRespVO>
|
||||
ref={tableRef}
|
||||
columns={baseTenantColumns}
|
||||
request={onFetch}
|
||||
toolbarActions={toolbarActions}
|
||||
headerTitle="样本列表"
|
||||
showIndex={false}
|
||||
enableRowClick={true}
|
||||
scroll={{ x: 400 }}
|
||||
rowSelection={{
|
||||
type: selectTableType,
|
||||
selectedRowKeys: selectedRows.map((item) => item.id) as React.Key[],
|
||||
onChange: (_, selectedRows) => {
|
||||
setSelectedRows(selectedRows);
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<div className="left">
|
||||
<UploadCard onChange={onChangeVideo} />
|
||||
<EnhancedProTable<AiSampleRespVO>
|
||||
ref={tableRef}
|
||||
columns={baseTenantColumns}
|
||||
request={onFetch}
|
||||
toolbarActions={toolbarActions}
|
||||
headerTitle="样本列表"
|
||||
showIndex={false}
|
||||
enableRowClick={true}
|
||||
scroll={{ x: 400 }}
|
||||
rowSelection={{
|
||||
type: selectTableType,
|
||||
selectedRowKeys: selectedRows.map(
|
||||
(item) => item.id,
|
||||
) as React.Key[],
|
||||
onChange: (_, selectedRows) => {
|
||||
setSelectedRows(selectedRows);
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{selectedRows.length > 0 && (
|
||||
<div className="detail">
|
||||
<SampleTagDetail<AiSampleRespVO>
|
||||
type={selectTableType}
|
||||
data={selectedRows}
|
||||
onRefresh={onRefresh}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<div className="detail">
|
||||
<SampleTagDetail<AiSampleRespVO>
|
||||
type={selectTableType}
|
||||
data={selectedRows}
|
||||
onRefresh={onRefresh}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<GroupTagModal
|
||||
visible={modalVisible}
|
||||
|
||||
Reference in New Issue
Block a user