From 8a2dbd09b9e7294e18452029fa9e0fcd513d9cd2 Mon Sep 17 00:00:00 2001 From: powersir <1576775122@qq.com> Date: Fri, 20 Oct 2023 00:12:12 +0800 Subject: [PATCH] update:category model --- src/models/category.data.ts | 90 +++++++++++ .../product/sample/components/attr-editor.tsx | 2 + src/pages/goods/main/category/index.tsx | 152 ++++++++++++++++++ src/request/service/category.ts | 4 +- 4 files changed, 246 insertions(+), 2 deletions(-) create mode 100644 src/pages/goods/main/category/index.tsx diff --git a/src/models/category.data.ts b/src/models/category.data.ts index 9c5fc28..ce86fba 100644 --- a/src/models/category.data.ts +++ b/src/models/category.data.ts @@ -37,6 +37,96 @@ export interface CategoryVO { remark?: string; } +/** + * CategoryTreeVO，管理后台 - 类目 Response VO + */ +export interface CategoryTreeVO { + attrVO?: CategoryAdditionalAttrVO; + /** + * 类目名称，最大长度不能超过125 + */ + categoryName: string; + /** + * 类目英文名称，最大长度255 + */ + categoryNameEn: string; + /** + * 子节点 + */ + childrens?: CategoryTreeVO[]; + /** + * 创建时间 + */ + createTime?: Date; + /** + * 主键 + */ + id: number; + /** + * 是否叶子节点，(1: 是, 2:不是) + */ + isLeaf?: string; + /** + * 目录级别 + */ + level?: string; + /** + * 父类目id + */ + parentId?: number; + /** + * 备注，最大长度255 + */ + remark?: string; +} + +/** + * CategoryAdditionalAttrVO，管理后台 - 类目附加属性 Response VO + */ +export interface CategoryAdditionalAttrVO { + /** + * 类目Id + */ + categoryId: number; + /** + * 创建时间 + */ + createTime: Date; + /** + * 海关编码，最大长度100 + */ + customsName?: string; + /** + * 申报名称，最大长度125 + */ + declareName?: string; + /** + * 申报名称_英文，最大长度125 + */ + declareNameEn?: string; + /** + * 申报价格 + */ + declarePrice?: number; + /** + * 申报重量 + */ + declareWeight?: number; + /** + * 主键 + */ + id: number; + /** + * 是否上传尺码表(1:是, 2:否) + */ + isSizeTable: string; + /** + * 包材id + */ + packingId: number; +} + + export interface CategoryPageReqVO extends PageParam { /** diff --git a/src/pages/custom/product/sample/components/attr-editor.tsx b/src/pages/custom/product/sample/components/attr-editor.tsx index b1cdaee..9ea01b4 100644 --- a/src/pages/custom/product/sample/components/attr-editor.tsx +++ b/src/pages/custom/product/sample/components/attr-editor.tsx @@ -51,6 +51,8 @@ const SampleAttrEditor: React.FC = (props) => { const [previewTitle, setPreviewTitle] = useState(''); const [form] = Form.useForm(); + const isEdit = !!editData; + useEffect(() => { if (visible) { setInitValue(); diff --git a/src/pages/goods/main/category/index.tsx b/src/pages/goods/main/category/index.tsx new file mode 100644 index 0000000..451cd12 --- /dev/null +++ b/src/pages/goods/main/category/index.tsx @@ -0,0 +1,152 @@ +import { Space, Table, Button, Input, Select, Divider, Tag, Card, Badge, Form, InputRef } from 'antd'; +import type { TableColumnsType } from 'antd'; +import { t } from '@/utils/i18n'; +import React, { useState, useEffect, useRef } from 'react'; +import { PlusOutlined, ExclamationCircleFilled, SearchOutlined, UndoOutlined } from '@ant-design/icons'; +import type { CategoryPageReqVO, CategoryVO } from '@/models' +import { antdUtils } from '@/utils/antd'; +import { useRequest } from '@/hooks/use-request'; +import platformShopService from '@/request/service/category'; +import { formatDate } from '@/utils/formatTime'; +import { useSetState } from 'ahooks'; + +export default () => { + + const [editorVisable, seEditorVisable] = useState(false); + const [editData, seEditData] = useState(); + const [dataSource, setDataSource] = useState([]); + const [searchFrom] = Form.useForm(); + + const [searchState, setSearchState] = useSetState({ + pageNo: 1, + pageSize: 10 + }); + const [total, setTotal] = useState(0) + const searchInput = useRef(null); + const [onSearching, setOnSearching] = useState(false); + + const { runAsync: getPageApi } = useRequest(platformShopService.getCategoryPageApi, { manual: true }); + const { runAsync: deleteApi } = useRequest(platformShopService.deleteCategoryApi, { manual: true }); + + const load = async () => { + const [error, { data }] = await getPageApi(searchFrom.getFieldsValue()); + if (!error) { + setDataSource(data.list); + } + }; + + const showDeleteConfirm = (data: CategoryVO) => { + antdUtils.modal?.confirm({ + title: '确认要将该分类删除吗？', + icon: , + content: '请注意删除以后不可恢复！', + okText: '删除', + okType: 'danger', + cancelText: '取消', + onOk() { + return new Promise(async (resolve) => { + const [error, { code, msg }] = await deleteApi(data.id); + if (error || code !== 0) { + antdUtils.message?.open({ type: 'error', content: msg ?? '操作失败' }) + } else { + antdUtils.message?.open({ type: 'success', content: '删除成功' }) + } + await load(); + resolve('') + }).catch(() => antdUtils.message?.open({ + type: 'error', + content: '操作失败', + })); + }, + onCancel() { + }, + }); + }; + + const columns: TableColumnsType = [ + { + title: '类目名称(CN)', + dataIndex: 'categoryName', + key: 'categoryName', + align: 'right', + width: 200, + }, + { + title: '类目名称(EN)', + dataIndex: 'categoryNameEn', + key: 'categoryNameEn', + align: 'center', + width: 200, + }, + { + title: '敦煌类目', + dataIndex: '', + key: '', + align: 'center', + width: 200, + }, + { + title: 'sds类目', + dataIndex: '', + key: '', + align: 'center', + width: 200 + }, + { + title: '虾皮类目', + dataIndex: '', + key: '', + align: 'center', + width: 200 + }, + { + title: t("QkOmYwne" /* 操作 */), + key: 'action', + render: (value: CategoryVO, record) => ( + )}> + { + seEditData(value); + seEditorVisable(true); + }}> + 编辑 + + { + showDeleteConfirm(value) + }}> + 删除 + + + ), + }, + ]; + + useEffect(() => { + load(); + }, []); + + const onReset = () => { + searchFrom.resetFields() + load() + } + + return ( + <> +
+ + + + + + ); +}; + diff --git a/src/request/service/category.ts b/src/request/service/category.ts index 6df4a36..e5e73cb 100644 --- a/src/request/service/category.ts +++ b/src/request/service/category.ts @@ -1,5 +1,5 @@ import request from '@/request'; -import { CategoryVO, CategoryPageReqVO, PageData } from '@/models'; +import { CategoryVO, CategoryPageReqVO, CategoryTreeVO, PageData } from '@/models'; const BASE_URL = '/admin-api/main/category'; @@ -23,7 +23,7 @@ export default { // 获得所有类目(树结构) getCategoryTreeApi: (params: CategoryPageReqVO) => { - return request.get(`${BASE_URL}/categoryAllTree`, { params }) + return request.get(`${BASE_URL}/categoryAllTree`, { params }) }, // 查询类目详情