Merge branch 'wuxichen' of http://gitea.tashowz.com/tashow/tashow-manager into qianpw
Some checks failed
coverage CI / build (push) Has been cancelled
Some checks failed
coverage CI / build (push) Has been cancelled
This commit is contained in:
136
src/pages/ai/sample-tag/config.tsx
Normal file
136
src/pages/ai/sample-tag/config.tsx
Normal file
@@ -0,0 +1,136 @@
|
||||
import type {
|
||||
ProColumns,
|
||||
ProFormColumnsType,
|
||||
} from '@ant-design/pro-components';
|
||||
import dayjs from 'dayjs';
|
||||
import TagEditor from '@/components/TagEditor';
|
||||
import TinyMCEEditor from '@/components/Tinymce';
|
||||
export const baseTenantColumns: ProColumns<API.CategoryDO>[] = [
|
||||
{
|
||||
title: '样本名称',
|
||||
dataIndex: 'sample_name',
|
||||
},
|
||||
{
|
||||
title: '注释',
|
||||
dataIndex: 'remark',
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '标签',
|
||||
hideInTable: true,
|
||||
dataIndex: 'tag_name',
|
||||
},
|
||||
{
|
||||
title: '样本格式',
|
||||
hideInTable: true,
|
||||
dataIndex: 'sample_mine_type',
|
||||
},
|
||||
];
|
||||
|
||||
export const formColumns = (data: {
|
||||
type: string;
|
||||
grade: number;
|
||||
}): ProFormColumnsType[] => [
|
||||
{
|
||||
title: '类目',
|
||||
dataIndex: 'grade',
|
||||
valueType: 'radio',
|
||||
fieldProps: {
|
||||
value: data.grade || 1,
|
||||
options: [
|
||||
{ label: '一级类目', value: 1 },
|
||||
{ label: '二级类目', value: 2 },
|
||||
{ label: '三级类目', value: 3 },
|
||||
],
|
||||
disabled: data.type === 'create',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '类目名称',
|
||||
dataIndex: 'username',
|
||||
formItemProps: {
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入用户名',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '排序权重',
|
||||
dataIndex: 'sort',
|
||||
valueType: 'digit',
|
||||
},
|
||||
{
|
||||
title: '类目描述',
|
||||
dataIndex: 'description',
|
||||
valueType: 'textarea',
|
||||
renderFormItem: () => {
|
||||
return <TinyMCEEditor />;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '关联父级',
|
||||
dataIndex: 'parentId',
|
||||
valueType: 'select',
|
||||
hideInForm: data.grade - 1 === 0,
|
||||
},
|
||||
{
|
||||
title: '类目icon',
|
||||
dataIndex: 'icon',
|
||||
},
|
||||
{
|
||||
title: '类目标签',
|
||||
dataIndex: 'tages',
|
||||
renderFormItem: () => {
|
||||
return (
|
||||
<TagEditor
|
||||
placeholder="输入标签名称"
|
||||
maxCount={10}
|
||||
tagProps={{
|
||||
color: 'blue',
|
||||
}}
|
||||
/>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '类目状态',
|
||||
dataIndex: 'status',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
{
|
||||
title: '类目ID',
|
||||
dataIndex: 'categoryId',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
valueType: 'dateTime',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'creator',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updateTime',
|
||||
valueType: 'dateTime',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
{
|
||||
title: '更新人',
|
||||
dataIndex: 'updator',
|
||||
hideInForm: data.type === 'create',
|
||||
},
|
||||
];
|
||||
|
||||
// {
|
||||
// title: "模板内容",
|
||||
// dataIndex: "content",
|
||||
// valueType: "textarea",
|
||||
// },
|
||||
81
src/pages/ai/sample-tag/detail.tsx
Normal file
81
src/pages/ai/sample-tag/detail.tsx
Normal file
@@ -0,0 +1,81 @@
|
||||
import {
|
||||
ProForm,
|
||||
ProFormCascader,
|
||||
ProFormCheckbox,
|
||||
ProFormColorPicker,
|
||||
ProFormDigit,
|
||||
ProFormDigitRange,
|
||||
ProFormGroup,
|
||||
ProFormRadio,
|
||||
ProFormSelect,
|
||||
ProFormSlider,
|
||||
ProFormSwitch,
|
||||
ProFormText,
|
||||
} from '@ant-design/pro-components';
|
||||
import { Switch } from 'antd';
|
||||
import type { FormInstance } from 'antd/lib';
|
||||
import Mock from 'mockjs';
|
||||
import { useRef, useState } from 'react';
|
||||
import TagEditor from '@/components/TagEditor';
|
||||
|
||||
export const waitTime = (time: number = 100) => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve(true);
|
||||
}, time);
|
||||
});
|
||||
};
|
||||
|
||||
const SampleTagDetail = () => {
|
||||
const [readonly, setReadonly] = useState(false);
|
||||
const formRef = useRef<FormInstance>(null);
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* <Switch
|
||||
style={{
|
||||
marginBlockEnd: 16,
|
||||
}}
|
||||
checked={readonly}
|
||||
checkedChildren="编辑"
|
||||
unCheckedChildren="只读"
|
||||
onChange={setReadonly}
|
||||
/> */}
|
||||
<ProForm
|
||||
readonly={readonly}
|
||||
name="validate_other"
|
||||
formRef={formRef}
|
||||
initialValues={{
|
||||
sample_name: '1111',
|
||||
}}
|
||||
onValuesChange={(_, values) => {
|
||||
console.log(values);
|
||||
}}
|
||||
onFinish={async (value) => console.log(value)}
|
||||
>
|
||||
<ProFormGroup title="预览">{/* <audio></audio> */}</ProFormGroup>
|
||||
<ProFormGroup title="基本信息">
|
||||
<ProFormText
|
||||
width="md"
|
||||
name="sample_name"
|
||||
placeholder="请输入样本名称"
|
||||
rules={[{ required: true, message: '样本名称不能为空' }]}
|
||||
/>
|
||||
<ProFormText width="md" name="remark" placeholder="请输入注释" />
|
||||
</ProFormGroup>
|
||||
<ProFormGroup
|
||||
title="标签"
|
||||
style={{
|
||||
gap: '0 32px',
|
||||
}}
|
||||
>
|
||||
<ProForm.Item name="tags">
|
||||
<TagEditor placeholder="输入标签名称" maxCount={10} />
|
||||
</ProForm.Item>
|
||||
</ProFormGroup>
|
||||
</ProForm>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default SampleTagDetail;
|
||||
15
src/pages/ai/sample-tag/index.module.less
Normal file
15
src/pages/ai/sample-tag/index.module.less
Normal file
@@ -0,0 +1,15 @@
|
||||
.tag-content {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
:global {
|
||||
.ant-pro-table {
|
||||
flex: 1 auto;
|
||||
}
|
||||
.detail {
|
||||
border-left: 1px solid #e8e8e8;
|
||||
width: 400px;
|
||||
padding: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
61
src/pages/ai/sample-tag/index.tsx
Normal file
61
src/pages/ai/sample-tag/index.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import type { ActionType } from '@ant-design/pro-components';
|
||||
import React, { useRef, useState } from 'react';
|
||||
import EnhancedProTable from '@/components/EnhancedProTable';
|
||||
import type { ToolbarAction } from '@/components/EnhancedProTable/types';
|
||||
import UploadCard from '@/components/Upload/UploadCard';
|
||||
import { baseTenantColumns } from './config';
|
||||
import SampleTagDetail from './detail';
|
||||
import styles from './index.module.less';
|
||||
|
||||
const SampleTag: React.FC = () => {
|
||||
const tableRef = useRef<ActionType>(null);
|
||||
// const [detail, setDetail] = useState<any>(null);
|
||||
// const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||
const handleAll = () => {
|
||||
// console.log(tableRef.current.getSelectedRowKeys());
|
||||
};
|
||||
const toolbarActions: ToolbarAction[] = [
|
||||
{
|
||||
key: 'add',
|
||||
label: '批量编辑',
|
||||
type: 'primary',
|
||||
|
||||
onClick: handleAll,
|
||||
},
|
||||
];
|
||||
const onFetch = async (_params: API.getProductCategoryCategoryListParams) => {
|
||||
// const data = await getCategoryList({
|
||||
// ...params,
|
||||
// });
|
||||
const data: any = [
|
||||
{ sample_name: 111, id: 1, remark: 222 },
|
||||
{ sample_name: 22, id: 2, remark: 33 },
|
||||
];
|
||||
return {
|
||||
data: data,
|
||||
success: true,
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<UploadCard />
|
||||
<div className={styles['tag-content']}>
|
||||
<EnhancedProTable<API.CategoryDO>
|
||||
ref={tableRef}
|
||||
columns={baseTenantColumns}
|
||||
request={onFetch}
|
||||
toolbarActions={toolbarActions}
|
||||
headerTitle="样本列表"
|
||||
showIndex={false}
|
||||
showSelection={true}
|
||||
/>
|
||||
<div className="detail">
|
||||
<SampleTagDetail />
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default SampleTag;
|
||||
Reference in New Issue
Block a user