tashow/tashow-manager
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 样本管理样式更改

Browse Source
This commit is contained in:
wuxichen
2026-03-02 14:55:24 +08:00
parent 95338a3ddf
commit f842dcaf14
6 changed files with 220 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/EnhancedProTable/index.tsx
View File

@@ -35,7 +35,6 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
type={action.type} type={action.type}
danger={action.danger} danger={action.danger}
disabled={action.disabled} disabled={action.disabled}
// icon={action.icon ?? <PlusOutlined />}
onClick={() => action.onClick()} onClick={() => action.onClick()}
> >
{action.label} {action.label}
@@ -55,7 +54,6 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
toolBarRender={toolBarRender} toolBarRender={toolBarRender}
manualRequest={false} manualRequest={false}
showSorterTooltip showSorterTooltip
// scroll={{ x: "max-content" }}
scroll={scroll ? scroll : { x: 1200 }} scroll={scroll ? scroll : { x: 1200 }}
components={components} components={components}
search={ search={
@@ -84,6 +82,7 @@ function EnhancedProTable<T extends BaseRecord, U extends ParamsType = any>(
showSizeChanger: true, showSizeChanger: true,
showQuickJumper: true, showQuickJumper: true,
// pageSize: 10, // pageSize: 10,
defaultPageSize: 10,
showTotal: formatPaginationTotal, showTotal: formatPaginationTotal,
} }
: false : false

1
src/components/Upload/UploadCard/index.module.less
View File

@@ -1,5 +1,6 @@
.uploader-card { .uploader-card {
background-color: #fff; background-color: #fff;
padding: 10px;
:global { :global {
.ant-upload-drag { .ant-upload-drag {
background-color: #fff; background-color: #fff;

10
src/pages/ai/model/config.tsx
View File

@@ -5,7 +5,11 @@ import type {
} from '@ant-design/pro-components'; } from '@ant-design/pro-components';
import { Modal, message, Switch } from 'antd'; import { Modal, message, Switch } from 'antd';
import dayjs from 'dayjs'; 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>[] = [ export const baseDeptColumns: ProColumns<AiModelRespVO>[] = [
{ {
@@ -47,9 +51,9 @@ export const baseDeptColumns: ProColumns<AiModelRespVO>[] = [
}"类目吗?`, }"类目吗?`,
onOk: async () => { onOk: async () => {
console.log(checked); console.log(checked);
await updateModelStatus({ await updateModel({
...record,
status: checked ? 1 : 0, status: checked ? 1 : 0,
id: record.id,
}); });
message.success('修改成功'); message.success('修改成功');
action?.reload(); action?.reload();

324
src/pages/ai/sample-tag/detail.tsx
View File

@@ -175,166 +175,180 @@ const SampleTagDetail = <T extends Record<string, any>>(
}; };
return ( return (
<> <>
<ProForm name="validate_other" formRef={formRef} submitter={false}> {data!.length > 0 ? (
{type === 'radio' && ( <>
<ProFormGroup title="预览"> <ProForm name="validate_other" formRef={formRef} submitter={false}>
{data?.[0].sampleFilePath && ( {type === 'radio' && (
<audio <ProFormGroup title="预览">
controls {data?.[0].sampleFilePath && (
preload="true" <audio
crossOrigin="anonymous" controls
style={{ marginBottom: 24 }} preload="true"
> crossOrigin="anonymous"
<source src={data[0].sampleFilePath} /> style={{ marginBottom: 24 }}
<track kind="captions" /> >
</audio> <source src={data[0].sampleFilePath} />
<track kind="captions" />
</audio>
)}
</ProFormGroup>
)} )}
</ProFormGroup> <ProFormGroup title="基本信息">
)} {type === 'radio' && (
<ProFormGroup title="基本信息"> <ProFormText
{type === 'radio' && ( width="md"
<ProFormText name="sampleName"
width="md" placeholder="请输入样本名称"
name="sampleName" fieldProps={{
placeholder="请输入样本名称" onBlur: async (e) => {
fieldProps={{ if (e.target.value) {
onBlur: async (e) => { const newData =
if (e.target.value) { data?.map((sample) => {
const newData = return {
data?.map((sample) => { id: sample.id,
return { sampleName: e.target.value,
id: sample.id, };
sampleName: e.target.value, }) || [];
}; await updateSamples(newData);
}) || []; props?.onRefresh?.();
await updateSamples(newData); message.success('更新样本名称成功');
props?.onRefresh?.(); }
message.success('更新样本名称成功'); },
} }}
}, rules={[{ required: true, message: '样本名称不能为空' }]}
}} />
rules={[{ required: true, message: '样本名称不能为空' }]} )}
/> <ProFormText
)} width="md"
<ProFormText fieldProps={{
width="md" onBlur: async (e) => {
fieldProps={{ if (e.target.value) {
onBlur: async (e) => { const newData =
if (e.target.value) { data?.map((sample) => {
const newData = return {
data?.map((sample) => { id: sample.id,
return { remark: e.target.value,
id: sample.id, };
remark: e.target.value, }) || [];
}; await updateSamples(newData);
}) || []; props?.onRefresh?.();
await updateSamples(newData); message.success('更新注释成功');
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" title="管理技术标签"
placeholder="请输入注释" width={800}
height={500}
/> />
</ProFormGroup> <TagManager
visible={tagManagerVisible}
<ProFormGroup title="标签"> files={tagNames}
{/* <Form.Item name="tag"> */} onOk={onRename}
{forMap(value.tags || [])} onCancel={() => setTagManagerVisible(false)}
</ProFormGroup> ></TagManager>
<Button {type === 'radio' && (
type="dashed" <Space
block style={{ width: '100%', justifyContent: 'center', padding: 12 }}
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 color="danger" onClick={onDownload}>
</Button> 下载
<Button </Button>
block <Button color="danger" variant="solid" onClick={handleDeleteAll}>
style={{ marginBottom: 24 }} 删除
onClick={handleDownloadAll} </Button>
> </Space>
下载到本地 )}
</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>
</> </>
); );
}; };

16
src/pages/ai/sample-tag/index.module.less
View File

@@ -1,18 +1,28 @@
.tag-content { .tag-content {
display: flex;
background: #fff; background: #fff;
width: 100%; width: 100%;
overflow: auto; overflow: auto;
:global { :global {
.ant-pro-table { .left {
flex: 1 auto; padding-right: 385px;
} }
.uploader-card {
padding-right: 400px;
}
.detail { .detail {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-left: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8;
border-top: 1px solid #e8e8e8;
width: 400px; width: 400px;
padding: 16px; padding: 16px;
top: 74px;
height: calc(100vh - 80px);
overflow: auto;
background: #fff;
position: fixed;
right: 0;
form { form {
flex: 1; flex: 1;
} }

56
src/pages/ai/sample-tag/index.tsx
View File

@@ -77,35 +77,37 @@ const SampleTag: React.FC = () => {
}; };
return ( return (
<> <>
<UploadCard onChange={onChangeVideo} />
<div className={styles['tag-content']}> <div className={styles['tag-content']}>
<EnhancedProTable<AiSampleRespVO> <div className="left">
ref={tableRef} <UploadCard onChange={onChangeVideo} />
columns={baseTenantColumns} <EnhancedProTable<AiSampleRespVO>
request={onFetch} ref={tableRef}
toolbarActions={toolbarActions} columns={baseTenantColumns}
headerTitle="样本列表" request={onFetch}
showIndex={false} toolbarActions={toolbarActions}
enableRowClick={true} headerTitle="样本列表"
scroll={{ x: 400 }} showIndex={false}
rowSelection={{ enableRowClick={true}
type: selectTableType, scroll={{ x: 400 }}
selectedRowKeys: selectedRows.map((item) => item.id) as React.Key[], rowSelection={{
onChange: (_, selectedRows) => { type: selectTableType,
setSelectedRows(selectedRows); selectedRowKeys: selectedRows.map(
}, (item) => item.id,
}} ) as React.Key[],
/> onChange: (_, selectedRows) => {
setSelectedRows(selectedRows);
},
}}
/>
</div>
{selectedRows.length > 0 && ( <div className="detail">
<div className="detail"> <SampleTagDetail<AiSampleRespVO>
<SampleTagDetail<AiSampleRespVO> type={selectTableType}
type={selectTableType} data={selectedRows}
data={selectedRows} onRefresh={onRefresh}
onRefresh={onRefresh} />
/> </div>
</div>
)}
</div> </div>
<GroupTagModal <GroupTagModal
visible={modalVisible} visible={modalVisible}