Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
A
admin-ci-test
概览
概览
详情
活动
周期分析
版本库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
问题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程表
图表
维基
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
test-ci
admin-ci-test
Commits
23f61049
提交
23f61049
authored
6月 08, 2023
作者:
翁进城
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
分类管理开发
上级
185fd540
显示空白字符变更
内嵌
并排
正在显示
16 个修改的文件
包含
642 行增加
和
379 行删除
+642
-379
categoryManage.ts
src/api/interface/categoryManage.ts
+14
-9
categoryManage.ts
src/api/modules/categoryManage.ts
+22
-12
request.ts
src/api/request.ts
+3
-3
index.tsx
...categoryManage/category/components/EditableCell/index.tsx
+0
-0
index.scss
...ategoryManage/category/components/addCgyDailog/index.scss
+0
-0
index.tsx
...categoryManage/category/components/addCgyDailog/index.tsx
+4
-4
index.tsx
...oryManage/category/components/addOrEditDec copy/index.tsx
+1
-1
index.tsx
...egoryManage/category/components/deleteCgyDailog/index.tsx
+1
-1
index.scss
src/pages/categoryManage/category/detail/index.scss
+0
-0
index.tsx
src/pages/categoryManage/category/detail/index.tsx
+22
-17
index.scss
src/pages/categoryManage/category/index.scss
+0
-0
index.tsx
src/pages/categoryManage/category/index.tsx
+138
-167
index.tsx
src/pages/categoryManage/components/addOrEditDec/index.tsx
+0
-146
index.tsx
...yManage/directoryManage/components/addOrEditDec/index.tsx
+149
-0
index.tsx
src/pages/categoryManage/directoryManage/index.tsx
+227
-0
router.tsx
src/router/router.tsx
+61
-19
没有找到文件。
src/api/interface/categoryManage.ts
浏览文件 @
23f61049
...
...
@@ -9,20 +9,25 @@ export interface GoodsInfo {
// 分类列表
export
interface
categoryEntity
{
goodsMasterType
:
string
;
id
:
number
;
directoryId
:
number
;
classifyName
:
string
;
pid
:
number
;
description
?:
any
;
icon
:
string
;
remark
:
string
;
desc
:
string
;
remark
?:
any
;
type
:
number
;
createTime
:
string
;
goodsMasterTypeId
:
number
|
string
;
goodsSlaveTypeDTO
:
Partial
<
categoryEntity
>
[];
pid
:
number
|
string
;
children
:
any
[];
isADD
?:
boolean
;
level
?:
number
;
}
// 分类目录
export
interface
categoryDec
{
defaultType
:
number
;
id
:
number
;
sortName
:
string
;
"id"
:
number
,
"directoryName"
:
string
,
"pid"
:
null
,
"type"
:
number
,
directoryType
:
string
}
src/api/modules/categoryManage.ts
浏览文件 @
23f61049
...
...
@@ -4,28 +4,38 @@ import { PaginationEntity } from '~/common/interface/PaginationEntity';
export
class
CategoryManageAPI
{
// 分类管理
// 分类目录
static
directoryList
=
()
=>
{
return
axios
.
get
(
'uavgoods/directory/directoryList'
);
static
directoryList
=
(
params
)
=>
{
return
axios
.
get
(
"pms/classify/directoryList"
,
{
params
});
};
//目录列表不含分页
static
getDirectoryList
=
(
params
)
=>
{
return
axios
.
get
(
"pms/classify/getDirectoryList"
,
{
params
});
};
// 新增或编辑目录
static
addOrEditDirectory
=
(
data
:
{
id
?:
number
;
directoryName
:
string
}[])
=>
{
return
axios
.
post
(
'
uavgoods/director
y/addOrEditDirectory'
,
data
);
static
addOrEditDirectory
=
(
data
:
{
id
?:
number
;
directoryName
:
string
,
type
:
number
,
relevance
:
number
}[])
=>
{
return
axios
.
post
(
'
/pms/classif
y/addOrEditDirectory'
,
data
);
};
// 删除目录
static
removeDirectory
=
(
id
:
number
)
=>
{
return
axios
.
get
(
'
uavgoods/director
y/removeDirectory'
,
{
params
:
{
id
}
});
return
axios
.
get
(
'
/pms/classif
y/removeDirectory'
,
{
params
:
{
id
}
});
};
// 分类新增
static
addClassification
=
(
data
:
object
):
any
=>
{
return
axios
.
post
(
'
uavgoods/mgoods
/addClassification'
,
data
);
return
axios
.
post
(
'
/pms/classify
/addClassification'
,
data
);
};
// 分类列表
static
get
ListGoodsTypeList
=
(
type
:
number
):
any
=>
{
return
axios
.
get
(
`uavgoods/mgoods/getGoodsTypeInfoList/
${
type
}
`
);
static
get
ClassificationList
=
(
data
:
object
):
any
=>
{
return
axios
.
post
(
`/pms/classify/getClassificationList`
,
data
);
};
// PC端-根据分类信息新增自定义规格-下拉选项 (只查产品类型)
...
...
@@ -40,7 +50,7 @@ export class CategoryManageAPI {
// 分类修改
static
updateClassification
=
(
data
:
object
):
any
=>
{
return
axios
.
post
(
'
uavgoods/mgoods
/updateClassification'
,
data
);
return
axios
.
post
(
'
/pms/classify
/updateClassification'
,
data
);
};
// 删除分类
...
...
@@ -65,14 +75,14 @@ export class CategoryManageAPI {
// 分类上下移动
static
exchangeSortType
=
(
params
:
object
):
any
=>
{
return
axios
.
get
(
'
uavgoods/mgoods
/exchangeSortType'
,
{
params
});
return
axios
.
get
(
'
/pms/classify
/exchangeSortType'
,
{
params
});
};
// 分类详情
static
getGoodsTypeDetail
=
(
obj
:
{
id
:
number
}
&
Pick
<
PaginationEntity
,
'pageNo'
|
'pageSize'
>
,
obj
:
{
id
:
number
},
)
=>
{
return
axios
.
get
(
'
uavgoods/mgoods/getGoodsTypeDetail
'
,
{
params
:
obj
});
return
axios
.
get
(
'
/pms/classify/getClassifyDetails
'
,
{
params
:
obj
});
};
// 分类详情-安全编码开发修改
...
...
src/api/request.ts
浏览文件 @
23f61049
...
...
@@ -4,9 +4,9 @@ import Cookies from 'js-cookie';
import
{
Base64
}
from
'js-base64'
;
const
{
VITE_REQUEST_BASE_URL
}
=
import
.
meta
.
env
;
export
const
uploadImgURL
=
`
${
VITE_REQUEST_BASE_URL
}
ossservlet/upload/imgOs
s`
;
export
const
uploadVideoURL
=
`
${
VITE_REQUEST_BASE_URL
}
ossservlet/upload/videoOss`
;
export
const
uploadFileURL
=
`
${
VITE_REQUEST_BASE_URL
}
ossservlet/upload/oss`
;
export
const
uploadImgURL
=
`
${
VITE_REQUEST_BASE_URL
}
/pms/upload/imgOsse
s`
;
export
const
uploadVideoURL
=
`
${
VITE_REQUEST_BASE_URL
}
/
ossservlet/upload/videoOss`
;
export
const
uploadFileURL
=
`
${
VITE_REQUEST_BASE_URL
}
/
ossservlet/upload/oss`
;
const
service
=
axios
.
create
({
baseURL
:
VITE_REQUEST_BASE_URL
,
timeout
:
6000
,
...
...
src/pages/categoryManage/components/EditableCell/index.tsx
→
src/pages/categoryManage/c
ategory/c
omponents/EditableCell/index.tsx
浏览文件 @
23f61049
File moved
src/pages/categoryManage/components/addCgyDailog/index.scss
→
src/pages/categoryManage/c
ategory/c
omponents/addCgyDailog/index.scss
浏览文件 @
23f61049
File moved
src/pages/categoryManage/components/addCgyDailog/index.tsx
→
src/pages/categoryManage/c
ategory/c
omponents/addCgyDailog/index.tsx
浏览文件 @
23f61049
...
...
@@ -62,9 +62,9 @@ function Index(props: any) {
setFileList
([]);
form
.
setFieldsValue
({
icon
:
''
});
}
else
if
(
val
.
file
.
status
===
'done'
)
{
setImageUrl
(
val
.
file
.
response
.
result
[
0
]
);
setImageUrl
(
val
.
file
.
response
.
result
?.
filePath
);
setFileList
(
val
.
fileList
);
form
.
setFieldsValue
({
icon
:
val
.
file
.
response
.
result
[
0
]
});
form
.
setFieldsValue
({
icon
:
val
.
file
.
response
.
result
?.
filePath
});
}
else
{
setFileList
(
val
.
fileList
);
}
...
...
@@ -85,7 +85,7 @@ function Index(props: any) {
return
(
<
Modal
title=
{
props
.
title
}
visible
=
{
props
.
isVisable
}
open
=
{
props
.
isVisable
}
onOk=
{
()
=>
props
.
handleOk
()
}
onCancel=
{
()
=>
props
.
handleCancel
()
}
>
...
...
@@ -101,7 +101,7 @@ function Index(props: any) {
>
<
Form
.
Item
label=
'分类名称'
name=
'
group
Name'
name=
'
classify
Name'
rules=
{
[{
required
:
true
,
message
:
'请输入分类名称'
}]
}
>
<
Input
placeholder=
'请输入分类名称'
maxLength=
{
15
}
allowClear
/>
...
...
src/pages/categoryManage/components/addOrEditDec copy/index.tsx
→
src/pages/categoryManage/c
ategory/c
omponents/addOrEditDec copy/index.tsx
浏览文件 @
23f61049
...
...
@@ -106,7 +106,7 @@ const AddOrEditDec: React.FC<PropsType & selfPropsType> = ({
return
(
<
Modal
title=
'目录管理'
visible
=
{
isModalVisible
}
open
=
{
isModalVisible
}
onOk=
{
directorySureEvent
}
onCancel=
{
directoryCancel
}
>
...
...
src/pages/categoryManage/components/deleteCgyDailog/index.tsx
→
src/pages/categoryManage/c
ategory/c
omponents/deleteCgyDailog/index.tsx
浏览文件 @
23f61049
...
...
@@ -4,7 +4,7 @@ function Index(props: any) {
return
(
<
Modal
title=
'分类删除'
visible
=
{
props
.
isDeleteVisable
}
open
=
{
props
.
isDeleteVisable
}
onOk=
{
()
=>
props
.
deleteHandleOk
()
}
onCancel=
{
()
=>
props
.
deleteHandleCancel
()
}
>
...
...
src/pages/categoryManage/detail/index.scss
→
src/pages/categoryManage/
category/
detail/index.scss
浏览文件 @
23f61049
File moved
src/pages/categoryManage/detail/index.tsx
→
src/pages/categoryManage/
category/
detail/index.tsx
浏览文件 @
23f61049
...
...
@@ -21,6 +21,7 @@ import { categoryDetailEntity, GoodsInfo } from '~/api/modules/goods';
import
{
CategoryManageAPI
}
from
'~/api'
;
import
useOption
from
'~/common/hook/optionHook'
;
import
'./index.scss'
;
import
{
useLocation
,
useParams
,
useNavigate
}
from
'react-router-dom'
;
const
CategoryDetail
:
FC
=
(
props
:
any
)
=>
{
const
[
selectedRowKeys
,
setSelectedRowKeys
]
=
useState
<
React
.
Key
[]
>
([]);
...
...
@@ -32,7 +33,7 @@ const CategoryDetail: FC = (props: any) => {
const
[
categoryId
,
setCategoryId
]
=
useState
<
number
>
(
0
);
const
[
isEdit
,
setIsEdit
]
=
useState
<
boolean
>
(
false
);
const
[
detailForm
]
=
Form
.
useForm
<
Pick
<
categoryDetailEntity
,
'description'
|
'
group
Name'
|
'icon'
>>
();
Form
.
useForm
<
Pick
<
categoryDetailEntity
,
'description'
|
'
classify
Name'
|
'icon'
>>
();
const
[
fileList
,
setFileList
]
=
useState
<
any
>
([]);
const
[
goodsInfo
,
setGoodsInfo
]
=
useState
<
GoodsInfo
[]
>
([]);
const
[
viewerVisible
,
setViewerVisible
]
=
useState
<
boolean
>
(
false
);
...
...
@@ -45,6 +46,12 @@ const CategoryDetail: FC = (props: any) => {
const
[
currentImgList
,
setcurrentImgList
]:
any
=
useState
([]);
const
[
sortTypeId
,
setSortTypeId
]
=
useState
<
number
>
(
-
1
);
const
[
pid
,
setPid
]
=
useState
<
number
>
(
-
1
);
const
{
id
}
=
useParams
();
const
_id
=
Number
(
id
);
const
location
=
useLocation
();
const
searchParams
:
any
=
new
URLSearchParams
(
location
.
search
);
const
navigate
=
useNavigate
();
const
columns
:
ColumnsType
<
GoodsInfo
>
=
[
{
title
:
'序号'
,
...
...
@@ -111,19 +118,19 @@ const CategoryDetail: FC = (props: any) => {
const
btnCode
=
useOption
(
22111
);
useEffect
(()
=>
{
// 分页数据
getGoodsTypeDetail
(
props
.
match
.
params
.
id
);
getGoodsTypeDetail
(
_
id
);
},
[
pagination
]);
useEffect
(()
=>
{
// 全部数据
getAllGoodsTypeDetail
(
props
.
match
.
params
.
id
);
setSortTypeId
(
Number
(
qs
.
parse
(
props
.
location
.
search
).
sortType
Id
));
setPid
(
Number
(
qs
.
parse
(
props
.
location
.
search
)
.
pid
));
setCategoryId
(
props
.
match
.
params
.
id
);
getAllGoodsTypeDetail
(
_
id
);
setSortTypeId
(
Number
(
searchParams
.
directory
Id
));
setPid
(
Number
(
searchParams
.
pid
));
setCategoryId
(
_
id
);
},
[]);
const
backRoute
=
()
=>
{
props
.
history
.
go
(
-
1
);
navigate
(
-
1
);
};
// 关联商品新增
const
addModalShowEvent
=
()
=>
{
...
...
@@ -139,7 +146,7 @@ const CategoryDetail: FC = (props: any) => {
const
getGoodsTypeDetail
=
async
(
id
:
number
)
=>
{
const
res
:
any
=
await
CategoryManageAPI
.
getGoodsTypeDetail
({
id
,
...
pagination
});
detailForm
.
setFieldsValue
({
groupName
:
res
.
result
.
groupName
?
res
.
result
.
group
Name
:
undefined
,
classifyName
:
res
.
result
.
classifyName
?
res
.
result
.
classify
Name
:
undefined
,
description
:
res
.
result
.
description
?
res
.
result
.
description
:
undefined
,
icon
:
res
.
result
.
icon
?
res
.
result
.
icon
:
''
,
});
...
...
@@ -160,10 +167,8 @@ const CategoryDetail: FC = (props: any) => {
const
getAllGoodsTypeDetail
=
async
(
id
:
number
)
=>
{
const
res
:
any
=
await
CategoryManageAPI
.
getGoodsTypeDetail
({
id
,
pageNo
:
1
,
pageSize
:
99999
,
});
setAllGoodsInfo
(
res
.
result
.
goodsInfo
||
[]);
setAllGoodsInfo
(
res
.
result
||
[]);
};
// 自定义上传
const
selfUploadRequest
=
async
(
val
:
any
)
=>
{
...
...
@@ -232,7 +237,7 @@ const CategoryDetail: FC = (props: any) => {
});
if
(
res
.
code
===
'200'
)
{
message
.
success
(
'修改成功'
);
getGoodsTypeDetail
(
props
.
match
.
params
.
id
);
getGoodsTypeDetail
(
_
id
);
}
};
...
...
@@ -246,11 +251,11 @@ const CategoryDetail: FC = (props: any) => {
const
sureChangeDetailInfo
=
()
=>
{
detailForm
.
validateFields
()
.
then
(
async
(
value
:
Pick
<
categoryDetailEntity
,
'description'
|
'
group
Name'
|
'icon'
>
)
=>
{
.
then
(
async
(
value
:
Pick
<
categoryDetailEntity
,
'description'
|
'
classify
Name'
|
'icon'
>
)
=>
{
// console.log("数据--->", value);
const
res
=
await
CategoryManageAPI
.
updateClassification
({
// description:value.description,
//
groupName:value.group
Name,
//
classifyName:value.classify
Name,
// icon:fileList.length?fileList[0].url:'',
...
value
,
sortTypeId
,
...
...
@@ -378,13 +383,13 @@ const CategoryDetail: FC = (props: any) => {
<
Form
form=
{
detailForm
}
labelCol=
{
{
span
:
2
}
}
wrapperCol=
{
{
span
:
5
}
}
>
<
Form
.
Item
label=
'行业名称'
name=
'
group
Name'
name=
'
classify
Name'
rules=
{
[{
required
:
true
,
message
:
'请输入行业名称'
}]
}
>
{
isEdit
?
(
<
Input
placeholder=
'请输入行业名称'
disabled=
{
!
isEdit
}
maxLength=
{
15
}
/>
)
:
(
<
span
>
{
detailData
?.
group
Name
}
</
span
>
<
span
>
{
detailData
?.
classify
Name
}
</
span
>
)
}
</
Form
.
Item
>
<
Form
.
Item
label=
'分类描述'
name=
'description'
>
...
...
@@ -452,7 +457,7 @@ const CategoryDetail: FC = (props: any) => {
<
Table
size=
'small'
columns=
{
Number
(
qs
.
parse
(
props
.
location
.
search
).
sortType
Id
)
===
1
Number
(
searchParams
.
directory
Id
)
===
1
?
columns
.
filter
((
item
:
ColumnType
<
GoodsInfo
>
)
=>
item
.
title
!=
'安全编码开关'
)
:
columns
}
...
...
src/pages/categoryManage/index.scss
→
src/pages/categoryManage/
category/
index.scss
浏览文件 @
23f61049
File moved
src/pages/categoryManage/index.tsx
→
src/pages/categoryManage/
category/
index.tsx
浏览文件 @
23f61049
import
{
FC
,
useEffect
,
useState
,
useRef
}
from
'react'
;
import
{
Button
,
Table
,
Form
,
message
,
Tooltip
,
Checkbox
,
Card
,
Modal
}
from
'antd'
;
import
{
CardTabListType
}
from
'antd/lib/card/Card'
;
import
{
Router
}
from
'react-router-dom'
;
import
{
Router
,
useNavigate
,
useLocation
}
from
'react-router-dom'
;
import
FileSaver
from
'file-saver'
;
import
qs
from
'query-string'
;
import
{
...
...
@@ -19,20 +19,19 @@ import {
import
AddCgyDailog
from
'./components/addCgyDailog'
;
import
DeleteCgyDailog
from
'./components/deleteCgyDailog'
;
import
EditableCell
from
'./components/EditableCell'
;
import
AddOrEditDec
from
'./components/addOrEditDec'
;
import
{
CategoryManageAPI
}
from
'~/api'
;
import
{
categoryEntity
,
categoryDec
}
from
'~/api/interface/categoryManage'
;
import
Viewer
from
'~/components/viewer'
;
import
useOption
from
'~/common/hook/optionHook'
;
import
'./index.scss'
;
import
events
from
'~/events'
;
const
Category
:
FC
=
(
props
:
any
)
=>
{
let
location
=
useLocation
();
console
.
log
(
'location'
,
location
);
const
navigate
=
useNavigate
();
const
baseRef
:
any
=
useRef
();
// 分类目录
const
[
tabList
,
setTabList
]
=
useState
<
CardTabListType
[]
>
([]);
const
[
directoryList
,
setDirectoryList
]
=
useState
<
categoryDec
[]
>
([]);
const
[
isAddOrEditDecModal
,
setIsAddOrEditDecModal
]
=
useState
<
boolean
>
(
false
);
// 分类列表
const
[
categoryList
,
setCategoryList
]
=
useState
<
categoryEntity
[]
>
([]);
const
[
isLoading
,
setIsLoading
]
=
useState
<
boolean
>
(
false
);
...
...
@@ -43,33 +42,32 @@ const Category: FC = (props: any) => {
// 编辑的行
const
[
editingKey
,
setEditingKey
]:
any
=
useState
([]);
const
isEditing
=
(
record
:
categoryEntity
)
=>
{
const
index
:
number
=
editingKey
.
findIndex
((
item
:
any
)
=>
item
==
record
.
goodsMasterTypeI
d
);
const
index
:
number
=
editingKey
.
findIndex
((
item
:
any
)
=>
item
==
record
.
i
d
);
if
(
index
!=
-
1
)
{
return
true
;
}
return
false
;
};
let
pathArr
=
window
.
location
.
pathname
.
split
(
'/'
);
let
type
=
pathArr
.
pop
();
//分类所属模块id(0:通用分类 1:作业服务分类 2:设备租赁分类 3:飞手培训分类 4:产品商城分类)
const
columns
=
[
{
title
:
'分类名称'
,
dataIndex
:
'
goodsMasterTyp
e'
,
key
:
'
goodsMasterTyp
e'
,
dataIndex
:
'
classifyNam
e'
,
key
:
'
classifyNam
e'
,
// align: "center",
width
:
'12%'
,
editable
:
true
,
ellipsis
:
true
,
render
:
(
text
:
string
,
record
:
categoryEntity
,
index
:
number
)
=>
{
return
(
<
Tooltip
placement=
'top'
title=
{
<
span
>
{
record
.
goodsMasterTyp
e
}
</
span
>
}
>
<
Tooltip
placement=
'top'
title=
{
<
span
>
{
record
.
classifyNam
e
}
</
span
>
}
>
<
span
style=
{
{
marginLeft
:
record
.
goodsSlaveTypeDTO
&&
record
.
goodsSlaveTypeDTO
.
length
!=
0
?
'10px'
:
'24px'
,
marginLeft
:
record
.
children
&&
record
.
children
.
length
!=
0
?
'10px'
:
'24px'
,
}
}
>
{
record
.
goodsMasterTyp
e
}
{
record
.
classifyNam
e
}
</
span
>
</
Tooltip
>
);
...
...
@@ -102,16 +100,16 @@ const Category: FC = (props: any) => {
},
{
title
:
'描述'
,
key
:
'desc'
,
dataIndex
:
'desc'
,
key
:
'desc
ription
'
,
dataIndex
:
'desc
ription
'
,
width
:
'20%'
,
align
:
'center'
,
editable
:
true
,
ellipsis
:
true
,
render
:
(
text
:
string
,
record
:
categoryEntity
,
index
:
number
)
=>
{
return
(
<
Tooltip
placement=
'right'
title=
{
<
span
>
{
record
.
desc
}
</
span
>
}
>
<
span
>
{
record
.
desc
}
</
span
>
<
Tooltip
placement=
'right'
title=
{
<
span
>
{
record
.
desc
ription
}
</
span
>
}
>
<
span
>
{
record
.
desc
ription
}
</
span
>
</
Tooltip
>
);
},
...
...
@@ -131,7 +129,7 @@ const Category: FC = (props: any) => {
render
:
(
text
:
string
,
record
:
categoryEntity
,
index
:
number
)
=>
{
return
(
<
div
className=
'table-option-wrap'
>
{
record
.
goodsSlaveTypeDTO
?
(
{
record
.
children
?.
length
>
0
?
(
<>
{
btnAddChildCgy
?
(
<
Button
...
...
@@ -148,7 +146,7 @@ const Category: FC = (props: any) => {
''
)
}
{
activeTabKey
===
2
&&
btnShareCode
?
(
{
/* {
activeTabKey === 2 && btnShareCode ? (
<Button
type='link'
icon={<ShareAltOutlined />}
...
...
@@ -158,7 +156,7 @@ const Category: FC = (props: any) => {
</Button>
) : (
''
)
}
)}
*/
}
</>
)
:
(
''
...
...
@@ -247,50 +245,83 @@ const Category: FC = (props: any) => {
// 是否编辑
const
[
isEdit
,
setIsEdit
]
=
useState
<
boolean
>
(
false
);
const
[
selectedRowKeys
,
setSelectedRowKeys
]
=
useState
<
any
>
([]);
const
[
activeTabKey
,
setActiveTabKey
]
=
useState
<
number
>
(
2
);
const
[
activeTabKey
,
setActiveTabKey
]
=
useState
<
number
>
(
-
1
);
// 分享码弹窗显示/隐藏
const
[
isShareCodeVble
,
setShareCodeVble
]
=
useState
<
boolean
>
(
false
);
const
[
shareCodeUrl
,
setShareCodeUrl
]
=
useState
<
string
>
(
''
);
// 按钮权限
const
btnAdd
=
useOption
(
22101
);
const
btnUpperDown
=
useOption
(
22102
);
const
btnDir
=
useOption
(
22103
);
const
btnAddChildCgy
=
useOption
(
22104
);
const
btnShareCode
=
useOption
(
22105
);
const
btnEdit
=
useOption
(
22106
);
const
btnDelete
=
useOption
(
22107
);
const
btnDetail
=
useOption
(
22108
);
const
btnAdd
=
true
;
//useOption(22101);
const
btnUpperDown
=
true
;
//useOption(22102);
const
btnDir
=
true
;
//useOption(22103);
const
btnAddChildCgy
=
true
;
//useOption(22104);
const
btnShareCode
=
true
;
//useOption(22105);
const
btnEdit
=
true
;
//useOption(22106);
const
btnDelete
=
true
;
//useOption(22107);
const
btnDetail
=
true
;
//useOption(22108);
const
searchParams
:
any
=
new
URLSearchParams
(
location
.
search
);
// 获取请求数据
useEffect
(()
=>
{
if
(
qs
.
parse
(
props
.
location
?.
search
).
activeTabKey
)
{
// console.log("当前数据--->", qs.parse(props.location?.search).activeTabKey);
setActiveTabKey
(
Number
(
qs
.
parse
(
props
.
location
?.
search
).
activeTabKey
));
}
getCategoryList
(
Number
(
qs
.
parse
(
props
.
location
?.
search
).
activeTabKey
)
||
Number
(
activeTabKey
));
setTabList
([]);
setCategoryList
([]);
getDirectoryList
();
},
[]);
setActiveTabKey
(
-
1
);
},
[
location
.
pathname
]);
//url改变时,重新获取数据
//目录列表取到后设置第一个目录为激活状态
useEffect
(()
=>
{
if
(
activeTabKey
==
-
1
&&
tabList
.
length
>
0
)
{
let
key
=
Number
(
searchParams
.
get
(
'activeTabKey'
)
||
tabList
[
0
]?.
key
||
-
1
);
setActiveTabKey
(
key
);
handleTabChange
(
String
(
key
));
}
},
[
tabList
,
searchParams
,
activeTabKey
]);
// tab变更后触发更新列表
/* useEffect(() => {
if (activeTabKey !== -1) {
getCategoryList(activeTabKey);
} else {
setCategoryList([]);
}
}, [activeTabKey]); */
// 获取分类目录
const
getDirectoryList
=
async
()
=>
{
const
res
:
any
=
await
CategoryManageAPI
.
directoryList
();
const
tabList
:
CardTabListType
[]
=
res
.
result
.
map
((
item
:
categoryDec
)
=>
{
const
res
:
any
=
await
CategoryManageAPI
.
directoryList
({
pageNo
:
1
,
pageSize
:
999
,
type
,
});
const
tabList
:
CardTabListType
[]
=
res
.
result
?.
list
?.
map
((
item
:
categoryDec
)
=>
{
return
{
key
:
item
.
id
.
toString
(),
tab
:
item
.
sort
Name
,
tab
:
item
.
directory
Name
,
};
});
setTabList
([...
tabList
]);
setDirectoryList
([...
res
.
result
]);
};
// 分类列表
const
getCategoryList
=
async
(
type
:
number
)
=>
{
const
getCategoryList
=
async
(
directoryId
:
number
)
=>
{
setIsLoading
(
true
);
const
res
=
await
CategoryManageAPI
.
get
ListGoodsTypeList
(
type
);
setIsLoading
(
false
);
setCategoryList
(
res
.
result
||
[]);
const
arr
:
number
[]
=
res
.
result
.
map
((
item
:
any
)
=>
{
return
item
.
goodsMasterTypeId
;
const
res
=
await
CategoryManageAPI
.
get
ClassificationList
({
type
,
pageSize
:
999
,
pageNo
:
1
,
directoryId
:
directoryId
,
});
setIsLoading
(
false
);
setCategoryList
(
res
.
result
.
list
?.
map
((
item
:
categoryEntity
)
=>
{
item
.
level
=
1
;
return
item
;
})
||
[],
);
const
arr
:
number
[]
=
res
.
result
.
list
?.
map
((
item
:
any
)
=>
{
return
item
.
id
;
})
||
[];
setExpandedRowKeys
([...
arr
]);
};
// 新增分类弹窗
...
...
@@ -307,7 +338,8 @@ const Category: FC = (props: any) => {
const
res
=
await
CategoryManageAPI
.
addClassification
({
...
values
,
pid
:
0
,
sortTypeId
:
activeTabKey
,
directoryId
:
activeTabKey
,
type
,
});
if
(
res
.
code
==
200
)
{
events
.
emit
(
'removeFileList'
);
...
...
@@ -324,7 +356,7 @@ const Category: FC = (props: any) => {
.
then
(
async
(
values
:
any
)
=>
{
const
res
=
await
CategoryManageAPI
.
updateClassification
({
...
values
,
id
:
currentRecord
.
goodsMasterTypeI
d
,
id
:
currentRecord
.
i
d
,
pid
:
currentRecord
.
pid
,
sortTypeId
:
activeTabKey
,
});
...
...
@@ -350,37 +382,37 @@ const Category: FC = (props: any) => {
const
addChildrenCgy
=
(
record
:
categoryEntity
)
=>
{
if
(
editingKey
.
length
===
0
)
{
const
item
:
categoryEntity
|
undefined
=
categoryList
.
find
(
(
item
:
categoryEntity
)
=>
item
.
goodsMasterTypeId
===
record
.
goodsMasterTypeI
d
,
(
item
:
categoryEntity
)
=>
item
.
id
===
record
.
i
d
,
);
item
?.
goodsSlaveTypeDTO
.
push
({
goodsMasterTypeId
:
`
${
record
.
goodsMasterTypeI
d
}
self`
,
goodsMasterTyp
e
:
''
,
desc
:
''
,
item
?.
children
.
push
({
id
:
`
${
record
.
i
d
}
self`
,
classifyNam
e
:
''
,
desc
ription
:
''
,
isADD
:
true
,
pid
:
record
.
goodsMasterTypeI
d
,
pid
:
record
.
i
d
,
});
setCategoryList
([...
categoryList
]);
form
.
setFieldsValue
({
goodsMasterType
:
''
,
desc
:
''
});
editingKey
.
push
(
`
${
record
.
goodsMasterTypeI
d
}
self`
);
form
.
setFieldsValue
({
classifyName
:
''
,
description
:
''
});
editingKey
.
push
(
`
${
record
.
i
d
}
self`
);
setEditingKey
(
editingKey
);
setIsEdit
(
false
);
}
const
bol
=
expandedRowKeys
.
some
((
item
:
any
)
=>
item
==
record
.
goodsMasterTypeI
d
);
const
bol
=
expandedRowKeys
.
some
((
item
:
any
)
=>
item
==
record
.
i
d
);
if
(
!
bol
)
{
const
arr
:
any
=
[];
expandedRowKeys
.
push
(
record
.
goodsMasterTypeI
d
);
expandedRowKeys
.
push
(
record
.
i
d
);
arr
.
push
(...
expandedRowKeys
);
setExpandedRowKeys
(
arr
);
}
};
// 展开监听
const
onExpand
=
(
expanded
:
boolean
,
record
:
categoryEntity
)
=>
{
const
index
=
expandedRowKeys
.
findIndex
((
item
:
any
)
=>
item
===
record
.
goodsMasterTypeI
d
);
const
index
=
expandedRowKeys
.
findIndex
((
item
:
any
)
=>
item
===
record
.
i
d
);
if
(
index
!=
-
1
)
{
expandedRowKeys
.
splice
(
index
,
1
);
setExpandedRowKeys
(
expandedRowKeys
);
}
else
{
expandedRowKeys
.
push
(
record
.
goodsMasterTypeI
d
);
expandedRowKeys
.
push
(
record
.
i
d
);
setExpandedRowKeys
(
expandedRowKeys
);
}
};
...
...
@@ -388,26 +420,27 @@ const Category: FC = (props: any) => {
const
sureAddChildrenCgy
=
(
record
:
categoryEntity
)
=>
{
let
pid
:
string
|
number
=
-
1
;
categoryList
.
map
((
item
:
categoryEntity
)
=>
{
if
(
item
.
goodsSlaveTypeDTO
&&
item
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
const
bol
:
boolean
=
item
.
goodsSlaveTypeDTO
.
some
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
goodsMasterTypeId
===
record
.
goodsMasterTypeI
d
,
if
(
item
.
children
&&
item
.
children
.
length
!=
0
)
{
const
bol
:
boolean
=
item
.
children
.
some
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
id
===
record
.
i
d
,
);
if
(
bol
)
{
pid
=
item
.
goodsMasterTypeI
d
;
pid
=
item
.
i
d
;
}
}
});
form
.
validateFields
().
then
(
async
(
val
:
any
)
=>
{
const
obj
:
any
=
{
pid
,
groupName
:
val
.
goodsMasterType
,
description
:
val
.
desc
,
sortTypeId
:
activeTabKey
,
classifyName
:
val
.
classifyName
,
description
:
val
.
description
,
directoryId
:
activeTabKey
,
type
,
};
if
(
isEdit
)
{
const
res
=
await
CategoryManageAPI
.
updateClassification
({
...
obj
,
id
:
record
.
goodsMasterTypeI
d
,
id
:
record
.
i
d
,
});
if
(
res
.
code
===
'200'
)
{
message
.
success
(
'修改成功'
);
...
...
@@ -433,16 +466,16 @@ const Category: FC = (props: any) => {
// 取消新增子分类
const
cancelAddCldCgy
=
(
record
:
categoryEntity
,
index
:
number
)
=>
{
categoryList
.
map
((
item
:
categoryEntity
)
=>
{
if
(
item
.
goodsSlaveTypeDTO
&&
item
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
const
index
:
number
=
item
.
goodsSlaveTypeDTO
.
findIndex
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
goodsMasterTypeId
===
record
.
goodsMasterTypeI
d
,
if
(
item
.
children
&&
item
.
children
.
length
!=
0
)
{
const
index
:
number
=
item
.
children
.
findIndex
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
id
===
record
.
i
d
,
);
if
(
index
!=
-
1
)
{
if
(
isEdit
)
{
item
.
goodsSlaveTypeDTO
[
index
].
isADD
=
false
;
item
.
children
[
index
].
isADD
=
false
;
setIsEdit
(
false
);
}
else
{
item
.
goodsSlaveTypeDTO
.
splice
(
index
,
1
);
item
.
children
.
splice
(
index
,
1
);
}
}
}
...
...
@@ -452,12 +485,12 @@ const Category: FC = (props: any) => {
};
// 删除分类
const
deleteCgy
=
(
record
:
categoryEntity
)
=>
{
setCgyId
(
Number
(
record
.
goodsMasterTypeI
d
));
setCgyId
(
Number
(
record
.
i
d
));
setIsDeleteVisible
(
true
);
};
// 删除弹窗确认
const
deleteHandleOk
=
async
()
=>
{
const
bol
=
categoryList
.
some
((
item
:
categoryEntity
)
=>
item
.
goodsMasterTypeI
d
===
cgyId
);
const
bol
=
categoryList
.
some
((
item
:
categoryEntity
)
=>
item
.
i
d
===
cgyId
);
if
(
bol
)
{
const
res
=
await
CategoryManageAPI
.
deleteGoodsTypeByOneLevel
({
id
:
cgyId
,
...
...
@@ -490,15 +523,13 @@ const Category: FC = (props: any) => {
// 编辑分类
const
editCgy
=
(
record
:
categoryEntity
)
=>
{
setCurrentRecord
(
record
);
const
bol
=
categoryList
.
some
(
(
item
:
categoryEntity
)
=>
item
.
goodsMasterTypeId
===
record
.
goodsMasterTypeId
,
);
const
bol
=
categoryList
.
some
((
item
:
categoryEntity
)
=>
item
.
id
===
record
.
id
);
if
(
bol
)
{
setTitle
(
'修改分类'
);
const
addForm
=
baseRef
.
current
.
getForm
();
addForm
.
setFieldsValue
({
groupName
:
record
.
goodsMasterTyp
e
,
description
:
record
.
desc
,
directoryName
:
record
.
classifyNam
e
,
description
:
record
.
desc
ription
,
remark
:
record
.
remark
,
});
events
.
emit
(
'setImgFile'
,
record
.
icon
);
...
...
@@ -507,18 +538,17 @@ const Category: FC = (props: any) => {
// 编辑状态
setIsEdit
(
true
);
categoryList
.
map
((
item
:
categoryEntity
)
=>
{
if
(
item
.
goodsSlaveTypeDTO
&&
item
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
const
index
:
number
=
item
.
goodsSlaveTypeDTO
.
findIndex
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
goodsMasterTypeId
===
record
.
goodsMasterTypeId
,
if
(
item
.
children
&&
item
.
children
.
length
!=
0
)
{
const
index
:
number
=
item
.
children
.
findIndex
(
(
item1
:
Partial
<
categoryEntity
>
)
=>
item1
.
id
===
record
.
id
,
);
if
(
index
!=
-
1
)
{
item
.
goodsSlaveTypeDTO
[
index
].
isADD
=
true
;
item
.
children
[
index
].
isADD
=
true
;
}
}
});
setCategoryList
([...
categoryList
]);
setEditingKey
([
record
.
goodsMasterTypeI
d
]);
setEditingKey
([
record
.
i
d
]);
form
.
setFieldsValue
(
record
);
}
};
...
...
@@ -531,14 +561,12 @@ const Category: FC = (props: any) => {
};
// 排序选择
const
onSelectChange
=
(
record
:
categoryEntity
)
=>
{
const
index
:
number
=
selectedRowKeys
.
findIndex
(
(
item
:
any
)
=>
item
===
record
.
goodsMasterTypeId
,
);
const
index
:
number
=
selectedRowKeys
.
findIndex
((
item
:
any
)
=>
item
===
record
.
id
);
if
(
index
!=
-
1
)
{
selectedRowKeys
.
splice
(
index
,
1
);
setSelectedRowKeys
([...
selectedRowKeys
]);
}
else
{
setSelectedRowKeys
([...
selectedRowKeys
,
record
.
goodsMasterTypeI
d
]);
setSelectedRowKeys
([...
selectedRowKeys
,
record
.
i
d
]);
}
};
// 上移
...
...
@@ -549,15 +577,14 @@ const Category: FC = (props: any) => {
message
.
error
(
'分类只能选择一个'
);
}
else
{
const
index
:
number
=
categoryList
.
findIndex
(
(
item
:
categoryEntity
)
=>
item
.
goodsMasterTypeI
d
===
selectedRowKeys
[
0
],
(
item
:
categoryEntity
)
=>
item
.
i
d
===
selectedRowKeys
[
0
],
);
if
(
index
===
0
)
{
message
.
error
(
'已经是最上面了'
);
}
else
{
const
res
=
await
CategoryManageAPI
.
exchangeSortType
({
firstId
:
selectedRowKeys
[
0
],
secondId
:
categoryList
[
index
-
1
].
goodsMasterTypeId
,
sortTypeId
:
activeTabKey
,
secondId
:
categoryList
[
index
-
1
].
id
,
});
if
(
res
.
code
===
'200'
)
{
getCategoryList
(
Number
(
activeTabKey
));
...
...
@@ -574,15 +601,14 @@ const Category: FC = (props: any) => {
message
.
error
(
'分类只能选择一个'
);
}
else
{
const
index
=
categoryList
.
findIndex
(
(
item
:
categoryEntity
)
=>
item
.
goodsMasterTypeI
d
===
selectedRowKeys
[
0
],
(
item
:
categoryEntity
)
=>
item
.
i
d
===
selectedRowKeys
[
0
],
);
if
(
index
===
categoryList
.
length
-
1
)
{
message
.
error
(
'已经是最下面了'
);
}
else
{
const
res
=
await
CategoryManageAPI
.
exchangeSortType
({
firstId
:
selectedRowKeys
[
0
],
secondId
:
categoryList
[
index
+
1
].
goodsMasterTypeId
,
sortTypeId
:
activeTabKey
,
secondId
:
categoryList
[
index
+
1
].
id
,
});
if
(
res
.
code
===
'200'
)
{
getCategoryList
(
Number
(
activeTabKey
));
...
...
@@ -596,21 +622,13 @@ const Category: FC = (props: any) => {
onChange
:
onSelectChange
,
hideSelectAll
:
true
,
renderCell
:
(
checked
:
boolean
,
record
:
categoryEntity
)
=>
{
return
(
<>
{
record
.
goodsSlaveTypeDTO
!=
null
?
(
<
Checkbox
onChange=
{
()
=>
onSelectChange
(
record
)
}
/>
)
:
(
''
)
}
</>
);
return
<>
{
record
.
level
===
1
?
<
Checkbox
onChange=
{
()
=>
onSelectChange
(
record
)
}
/>
:
''
}
</>;
},
};
// 页签改变监听
const
handleTabChange
=
(
key
:
string
)
=>
{
Router
.
push
({
pathname
:
'
/goodsManage/category
'
,
navigate
({
pathname
:
''
,
search
:
qs
.
stringify
({
activeTabKey
:
key
}),
});
setSelectedRowKeys
([]);
...
...
@@ -619,16 +637,16 @@ const Category: FC = (props: any) => {
};
// 分类详情
const
toCategoryDetail
=
(
record
:
categoryEntity
)
=>
{
Router
.
push
({
pathname
:
`/
goodsManage/category/detail/
${
record
.
goodsMasterTypeI
d
}
`
,
search
:
qs
.
stringify
({
sortType
Id
:
activeTabKey
,
pid
:
record
.
pid
}),
navigate
({
pathname
:
`/
categoryManage/detail/
${
record
.
i
d
}
`
,
search
:
qs
.
stringify
({
directory
Id
:
activeTabKey
,
pid
:
record
.
pid
}),
});
};
// 分享码弹窗显示
const
showShareCode
=
async
(
record
:
any
)
=>
{
const
res
:
any
=
await
CategoryManageAPI
.
getAppletQRCode
({
page
:
'page-sort/sortDetail/index'
,
scene
:
`?id=
${
record
.
goodsMasterTypeI
d
}
&backTip=1`
,
scene
:
`?id=
${
record
.
i
d
}
&backTip=1`
,
});
setShareCodeUrl
(
`data:image/png;base64,
${
res
.
result
}
`
);
setShareCodeVble
(
true
);
...
...
@@ -640,33 +658,7 @@ const Category: FC = (props: any) => {
const
downLoadCode
=
()
=>
{
FileSaver
.
saveAs
(
shareCodeUrl
,
'无人机城行业分享码'
);
};
// 目录弹窗
const
showDecModal
=
()
=>
{
setDirectoryList
([...
directoryList
]);
setIsAddOrEditDecModal
(
true
);
};
const
addOrEditDecHandleOk
=
()
=>
{
getDirectoryList
();
setIsAddOrEditDecModal
(
false
);
};
const
addOrEditDecHandleCancel
=
()
=>
{
setIsAddOrEditDecModal
(
false
);
};
const
refreshDec
=
(
id
:
number
)
=>
{
const
index
:
number
=
directoryList
.
findIndex
((
item
:
categoryDec
)
=>
item
.
id
===
activeTabKey
);
if
(
id
===
directoryList
[
index
].
id
)
{
setActiveTabKey
(
directoryList
[
index
-
1
].
id
);
Router
.
push
({
pathname
:
'/goodsManage/category'
,
search
:
qs
.
stringify
({
activeTabKey
:
directoryList
[
index
-
1
].
id
}),
});
getCategoryList
(
directoryList
[
index
-
1
].
id
);
}
getDirectoryList
();
// if (qs.parse(props.location?.search).activeTabKey) {
// setActiveTabKey(Number(qs.parse(props.location?.search).activeTabKey));
// }
};
return
(
<
div
className=
'category-wrap'
>
<
div
className=
'option-wrap'
>
...
...
@@ -709,15 +701,6 @@ const Category: FC = (props: any) => {
tabList=
{
tabList
}
activeTabKey=
{
String
(
activeTabKey
)
}
onTabChange=
{
(
key
)
=>
handleTabChange
(
key
)
}
tabBarExtraContent=
{
btnDir
?
(
<
Button
type=
'link'
onClick=
{
showDecModal
}
>
目录管理
</
Button
>
)
:
(
''
)
}
>
<
Form
form=
{
form
}
component=
{
false
}
>
<
Table
...
...
@@ -725,11 +708,11 @@ const Category: FC = (props: any) => {
columns=
{
mergedColumns
}
dataSource=
{
categoryList
}
rowSelection=
{
rowSelection
}
rowKey=
'
goodsMasterTypeI
d'
rowKey=
'
i
d'
bordered
loading=
{
isLoading
}
rowClassName=
{
(
record
:
any
,
index
:
number
)
=>
{
if
(
record
.
goodsSlaveTypeDTO
)
{
if
(
record
.
children
)
{
return
''
;
}
return
'row-bg'
;
...
...
@@ -741,16 +724,16 @@ const Category: FC = (props: any) => {
cell
:
EditableCell
,
},
}
}
childrenColumnName=
'
goodsSlaveTypeDTO
'
childrenColumnName=
'
children
'
expandable=
{
{
rowExpandable
:
(
record
)
=>
{
if
(
record
.
goodsSlaveTypeDTO
&&
record
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
if
(
record
.
children
&&
record
.
children
.
length
!=
0
)
{
return
true
;
}
return
false
;
},
expandIcon
:
({
expanded
,
onExpand
,
record
})
=>
{
if
(
expanded
&&
record
.
goodsSlaveTypeDTO
&&
record
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
if
(
expanded
&&
record
.
children
&&
record
.
children
.
length
!=
0
)
{
return
(
<
DownOutlined
onClick=
{
(
e
)
=>
onExpand
(
record
,
e
)
}
...
...
@@ -758,7 +741,7 @@ const Category: FC = (props: any) => {
/>
);
}
if
(
record
.
goodsSlaveTypeDTO
&&
record
.
goodsSlaveTypeDTO
.
length
!=
0
)
{
if
(
record
.
children
&&
record
.
children
.
length
!=
0
)
{
return
(
<
RightOutlined
onClick=
{
(
e
)
=>
onExpand
(
record
,
e
)
}
...
...
@@ -793,21 +776,9 @@ const Category: FC = (props: any) => {
activeViewerIndex=
{
activeViewerIndex
}
setVisible=
{
setVisibleEvent
}
/>
{
/* 目录管理 */
}
<
AddOrEditDec
isModalVisible=
{
isAddOrEditDecModal
}
handleOk=
{
addOrEditDecHandleOk
}
handleCancel=
{
addOrEditDecHandleCancel
}
directoryList=
{
directoryList
}
refreshDec=
{
refreshDec
}
/>
{
/* 分享码弹窗 */
}
<
Modal
visible=
{
isShareCodeVble
}
title=
'分享码'
footer=
{
null
}
onCancel=
{
shareCodeHandleCancel
}
>
<
Modal
open=
{
isShareCodeVble
}
title=
'分享码'
footer=
{
null
}
onCancel=
{
shareCodeHandleCancel
}
>
<
div
className=
'share-code'
>
<
img
src=
{
shareCodeUrl
}
alt=
''
onClick=
{
()
=>
imgClick
(
shareCodeUrl
)
}
/>
<
div
>
...
...
src/pages/categoryManage/components/addOrEditDec/index.tsx
deleted
100644 → 0
浏览文件 @
185fd540
import
{
Modal
,
Form
,
Input
,
Button
,
Row
,
Col
,
message
}
from
'antd'
;
import
React
,
{
useEffect
,
useState
}
from
'react'
;
import
{
PlusOutlined
,
MinusOutlined
}
from
'@ant-design/icons'
;
import
{
PropsType
}
from
'~/common/interface/modal'
;
import
{
categoryDec
}
from
'~/api/modules/goods'
;
import
{
CategoryManageAPI
}
from
'~/api'
;
interface
selfPropsType
{
directoryList
:
categoryDec
[];
refreshDec
:
Function
;
}
const
AddOrEditDec
:
React
.
FC
<
PropsType
&
selfPropsType
>
=
({
isModalVisible
,
handleOk
,
handleCancel
,
directoryList
,
refreshDec
,
})
=>
{
const
[
form
]
=
Form
.
useForm
<
any
>
();
// 表单目录标题列表
const
[
addOrEditDirectoryList
,
setAddOrEditDirectoryList
]
=
useState
<
categoryDec
[]
>
([]);
// 是否点击删除按钮
const
[
isClickDle
,
setIsClickDle
]
=
useState
<
boolean
>
(
false
);
useEffect
(()
=>
{
if
(
directoryList
.
length
!=
0
&&
!
isClickDle
)
{
setAddOrEditDirectoryList
(
directoryList
);
const
defaultFormValue
=
directoryList
.
reduce
((
pre
:
any
,
cur
:
categoryDec
)
=>
{
Object
.
keys
(
cur
).
map
((
item
:
string
)
=>
{
if
(
item
===
'id'
)
{
pre
[
cur
[
item
]]
=
cur
.
sortName
;
}
});
return
pre
;
},
{});
form
.
setFieldsValue
(
defaultFormValue
);
}
},
[
directoryList
]);
// 新增或修改目录
const
addDirectoryTitle
=
()
=>
{
const
decList
:
categoryDec
[]
=
[...
addOrEditDirectoryList
].
sort
(
(
a
:
categoryDec
,
b
:
categoryDec
)
=>
a
.
id
-
b
.
id
,
);
setAddOrEditDirectoryList
([
...
addOrEditDirectoryList
,
{
id
:
decList
[
decList
.
length
-
1
].
id
+
1
,
defaultType
:
1
,
sortName
:
''
,
},
]);
};
// 删除目录
const
deleteDirectory
=
async
(
id
:
number
)
=>
{
const
bol
:
boolean
=
directoryList
.
some
((
item
:
categoryDec
)
=>
item
.
id
===
id
);
const
index
=
addOrEditDirectoryList
.
findIndex
((
item
:
categoryDec
)
=>
item
.
id
===
id
);
if
(
bol
)
{
const
res
:
any
=
await
CategoryManageAPI
.
removeDirectory
(
id
);
if
(
res
.
code
===
'200'
)
{
message
.
success
(
'删除成功'
);
setIsClickDle
(
true
);
refreshDec
(
id
);
}
else
{
return
message
.
warning
(
res
.
message
);
}
}
const
obj
:
any
=
{};
obj
[
id
]
=
undefined
;
form
.
setFieldsValue
(
obj
);
addOrEditDirectoryList
.
splice
(
index
,
1
);
setAddOrEditDirectoryList
([...
addOrEditDirectoryList
]);
};
const
directorySureEvent
=
()
=>
{
form
.
validateFields
().
then
(
async
(
value
:
any
)
=>
{
const
requestList
=
Object
.
keys
(
value
).
reduce
((
pre
:
any
,
cur
:
string
)
=>
{
const
bol
:
boolean
=
directoryList
.
some
((
item
:
any
)
=>
item
.
id
===
Number
(
cur
));
if
(
bol
)
{
pre
.
push
({
id
:
Number
(
cur
),
directoryName
:
value
[
cur
],
});
}
else
{
pre
.
push
({
directoryName
:
value
[
cur
],
});
}
return
pre
;
},
[]);
const
res
:
any
=
await
CategoryManageAPI
.
addOrEditDirectory
(
requestList
);
if
(
res
.
code
===
'200'
)
{
message
.
success
(
'操作成功'
);
form
.
resetFields
();
setIsClickDle
(
false
);
handleOk
();
}
else
{
message
.
warning
(
res
.
message
);
}
});
};
const
directoryCancel
=
()
=>
{
form
.
resetFields
();
setIsClickDle
(
false
);
handleCancel
();
};
return
(
<
Modal
title=
'目录管理'
visible=
{
isModalVisible
}
onOk=
{
directorySureEvent
}
onCancel=
{
directoryCancel
}
>
<
Form
form=
{
form
}
labelCol=
{
{
span
:
6
}
}
wrapperCol=
{
{
span
:
16
}
}
>
<
Form
.
Item
label=
'添加目录'
labelCol=
{
{
span
:
4
}
}
wrapperCol=
{
{
span
:
16
}
}
>
<
Button
icon=
{
<
PlusOutlined
/>
}
onClick=
{
addDirectoryTitle
}
/>
</
Form
.
Item
>
{
addOrEditDirectoryList
.
map
((
item
:
categoryDec
)
=>
(
<
Row
key=
{
item
.
id
}
gutter=
{
{
xs
:
8
,
sm
:
16
,
md
:
24
}
}
>
<
Col
span=
{
16
}
>
<
Form
.
Item
label=
'目录名称'
name=
{
item
.
id
}
rules=
{
[{
required
:
true
,
message
:
'请输入目录名称'
}]
}
>
<
Input
placeholder=
'请输入目录名称'
maxLength=
{
30
}
/>
</
Form
.
Item
>
</
Col
>
<
Col
>
{
item
.
defaultType
?
(
<
Button
icon=
{
<
MinusOutlined
/>
}
type=
'primary'
onClick=
{
()
=>
deleteDirectory
(
item
.
id
)
}
/>
)
:
(
''
)
}
</
Col
>
</
Row
>
))
}
</
Form
>
</
Modal
>
);
};
export
default
AddOrEditDec
;
src/pages/categoryManage/directoryManage/components/addOrEditDec/index.tsx
0 → 100644
浏览文件 @
23f61049
import
{
Modal
,
Form
,
Input
,
Button
,
Row
,
Col
,
message
,
Select
,
RadioChangeEvent
,
Radio
,
Space
,
}
from
'antd'
;
import
React
,
{
useEffect
,
useState
}
from
'react'
;
import
{
PropsType
}
from
'~/common/interface/modal'
;
import
{
categoryDec
}
from
'~/api/modules/goods'
;
import
{
CategoryManageAPI
}
from
'~/api'
;
const
typeOptions
=
[
{
value
:
0
,
label
:
'通用分类'
,
},
{
value
:
1
,
label
:
'作业服务分类'
,
},
{
value
:
2
,
label
:
'设备分类'
,
},
{
value
:
3
,
label
:
'飞手分类'
,
},
{
value
:
4
,
label
:
'商城分类'
,
},
];
interface
selfPropsType
{
isModalVisible
:
boolean
;
handleOk
?:
()
=>
void
;
handleCancel
?:
()
=>
void
;
editData
?:
categoryDec
;
//编辑数据
}
const
AddOrEditDec
:
React
.
FC
<
PropsType
&
selfPropsType
>
=
({
isModalVisible
,
handleOk
,
handleCancel
,
editData
,
})
=>
{
const
[
form
]
=
Form
.
useForm
<
any
>
();
const
[
hasPid
,
setHasPid
]
=
useState
(
false
);
//是否有上级目录
const
[
submitLoading
,
setSubmitLoading
]
=
useState
(
false
);
//提交按钮的loading
const
[
directoryOptions
,
setDirectoryOptions
]
=
useState
([]);
//目录options
const
id
=
editData
?.
id
;
useEffect
(()
=>
{
if
(
isModalVisible
)
{
form
.
setFieldValue
(
'type'
,
editData
.
type
);
form
.
setFieldValue
(
'pid'
,
editData
.
pid
);
form
.
setFieldValue
(
'directoryName'
,
editData
.
directoryName
);
onChangeType
(
editData
.
type
);
if
(
editData
.
pid
)
{
setHasPid
(
true
);
}
else
{
setHasPid
(
false
);
}
}
},
[
isModalVisible
]);
const
onChangeType
=
(
value
)
=>
{
console
.
log
(
'value'
,
value
);
form
.
resetFields
([
'pid'
]);
CategoryManageAPI
.
directoryList
({
pageNo
:
1
,
pageSize
:
999
,
type
:
value
}).
then
((
res
)
=>
{
setDirectoryOptions
(
res
.
result
?.
list
||
[]);
});
};
//提交
const
onFinish
=
async
()
=>
{
const
values
=
await
form
.
validateFields
();
console
.
log
(
'values'
,
values
);
setSubmitLoading
(
true
);
try
{
const
res
=
await
CategoryManageAPI
.
addOrEditDirectory
({
...
values
,
id
,
pid
:
hasPid
?
values
.
pid
:
null
,
});
res
.
code
==
'200'
&&
message
.
success
(
'新增成功'
);
handleOk
();
setTimeout
(()
=>
{
form
.
resetFields
();
},
500
);
}
catch
(
e
)
{}
setSubmitLoading
(
false
);
};
return
(
<
Modal
title=
'新增目录'
open=
{
isModalVisible
}
onOk=
{
onFinish
}
onCancel=
{
()
=>
{
form
.
resetFields
();
handleCancel
();
}
}
okButtonProps=
{
{
loading
:
submitLoading
}
}
>
<
Form
form=
{
form
}
labelCol=
{
{
span
:
6
}
}
wrapperCol=
{
{
span
:
16
}
}
style=
{
{
marginBottom
:
40
}
}
>
<
Form
.
Item
label=
'分类模块'
name=
'type'
rules=
{
[{
required
:
true
}]
}
>
<
Select
options=
{
typeOptions
}
allowClear=
{
true
}
onChange=
{
onChangeType
}
></
Select
>
</
Form
.
Item
>
<
Form
.
Item
label=
'目录类型'
>
<
Radio
.
Group
onChange=
{
(
e
:
RadioChangeEvent
)
=>
setHasPid
(
e
.
target
.
value
)
}
value=
{
hasPid
}
>
<
Radio
value=
{
false
}
>
无关联目录
</
Radio
>
<
Radio
value=
{
true
}
>
有关联目录
</
Radio
>
</
Radio
.
Group
>
</
Form
.
Item
>
{
hasPid
&&
(
<
Form
.
Item
label=
'上级目录'
name=
'pid'
rules=
{
[{
required
:
true
}]
}
>
<
Select
options=
{
directoryOptions
}
fieldNames=
{
{
label
:
'directoryName'
,
value
:
'id'
}
}
allowClear=
{
true
}
></
Select
>
</
Form
.
Item
>
)
}
<
Form
.
Item
label=
'目录名称'
name=
'directoryName'
rules=
{
[{
required
:
true
}]
}
>
<
Input
placeholder=
'请输入目录名称'
allowClear=
{
true
}
></
Input
>
</
Form
.
Item
>
</
Form
>
</
Modal
>
);
};
export
default
AddOrEditDec
;
src/pages/categoryManage/directoryManage/index.tsx
0 → 100644
浏览文件 @
23f61049
import
{
DeleteOutlined
,
EditOutlined
,
PlusOutlined
}
from
'@ant-design/icons'
;
import
{
Tag
,
Space
,
Button
,
Table
,
Pagination
,
message
,
Modal
}
from
'antd'
;
import
{
ColumnsType
,
TablePaginationConfig
}
from
'antd/es/table'
;
import
type
{
FilterValue
,
SorterResult
}
from
'antd/es/table/interface'
;
import
{
FC
,
useEffect
,
useState
}
from
'react'
;
import
{
CategoryManageAPI
}
from
'~/api'
;
import
{
categoryEntity
,
categoryDec
}
from
'~/api/interface/categoryManage'
;
import
AddOrEditDec
from
'./components/addOrEditDec'
;
interface
DataType
{
title
:
string
;
dataIndex
:
string
;
key
:
string
;
align
:
string
;
}
const
typeOptions
=
[
{
value
:
0
,
label
:
'通用分类'
,
},
{
value
:
1
,
label
:
'作业服务分类'
,
},
{
value
:
2
,
label
:
'设备分类'
,
},
{
value
:
3
,
label
:
'飞手分类'
,
},
{
value
:
4
,
label
:
'商城分类'
,
},
];
const
DirectoryManage
:
FC
=
(
props
:
any
)
=>
{
const
[
data
,
setData
]
=
useState
<
categoryDec
[]
>
();
//table数据
const
[
loading
,
setLoading
]
=
useState
(
false
);
//table获取数据的loading
const
[
pagination
,
setPagination
]
=
useState
<
TablePaginationConfig
>
({
current
:
1
,
pageSize
:
10
,
total
:
0
,
showSizeChanger
:
true
,
showQuickJumper
:
true
,
showTotal
:
(
total
,
range
)
=>
`当前
${
range
[
0
]}
-
${
range
[
1
]}
条记录 / 共
${
total
}
条数据`
,
});
//目录modal
const
[
isAddOrEditDecModal
,
setIsAddOrEditDecModal
]
=
useState
<
boolean
>
(
false
);
const
[
reload
,
setReload
]
=
useState
(
false
);
const
[
editData
,
setEditData
]
=
useState
<
categoryDec
|
null
>
(
null
);
const
columns
:
ColumnsType
<
DataType
>
=
[
{
title
:
'目录名称'
,
dataIndex
:
'directoryName'
,
key
:
'directoryName'
,
align
:
'center'
,
},
{
title
:
'分类模块'
,
dataIndex
:
'type'
,
key
:
'type'
,
align
:
'center'
,
render
:
(
value
)
=>
{
let
find
=
typeOptions
.
find
((
item
)
=>
{
return
item
.
value
==
value
;
});
return
<
div
>
{
find
?.
label
}
</
div
>;
},
},
{
title
:
'目录类型'
,
dataIndex
:
'directoryType'
,
key
:
'directoryType'
,
align
:
'center'
,
},
{
title
:
'上级目录'
,
dataIndex
:
'relevanceName'
,
key
:
'relevanceName'
,
align
:
'center'
,
},
{
title
:
'操作'
,
key
:
'action'
,
render
:
(
_
,
record
)
=>
(
<
Space
size=
'middle'
>
<
Button
type=
'link'
icon=
{
<
EditOutlined
/>
}
onClick=
{
()
=>
{
console
.
log
(
'record'
,
record
);
setEditData
(
record
);
setIsAddOrEditDecModal
(
true
);
}
}
>
编辑
</
Button
>
<
Button
type=
'link'
danger
icon=
{
<
DeleteOutlined
/>
}
onClick=
{
()
=>
onDel
(
record
.
id
)
}
>
删除
</
Button
>
</
Space
>
),
align
:
'center'
,
},
];
// 目录弹窗
const
showDecModal
=
()
=>
{
setEditData
(
null
);
setIsAddOrEditDecModal
(
true
);
};
const
addOrEditDecHandleOk
=
()
=>
{
getDirectoryList
();
setIsAddOrEditDecModal
(
false
);
};
const
addOrEditDecHandleCancel
=
()
=>
{
setIsAddOrEditDecModal
(
false
);
};
//获取所有目录列表
const
getDirectoryList
=
()
=>
{
setLoading
(
true
);
CategoryManageAPI
.
directoryList
({
pageNo
:
pagination
!
.
current
!
,
pageSize
:
pagination
!
.
pageSize
!
,
})
.
then
((
res
)
=>
{
setData
(
res
.
result
?.
list
.
map
((
item
:
categoryDec
)
=>
{
if
(
item
.
pid
)
{
item
.
directoryType
=
'有关联用户'
;
}
else
{
item
.
directoryType
=
'无关联用户'
;
}
return
item
;
})
||
[],
);
setLoading
(
false
);
setPagination
({
...
pagination
,
current
:
res
.
result
.
pageNo
,
pageSize
:
res
.
result
.
pageSize
,
total
:
res
.
result
.
totalCount
,
});
})
.
catch
((
err
)
=>
{
setData
([]);
setLoading
(
false
);
});
};
// 删除
const
onDel
=
(
id
:
number
)
=>
{
Modal
.
confirm
({
title
:
'目录删除'
,
content
:
'确认删除该目录?'
,
onOk
()
{
CategoryManageAPI
.
removeDirectory
(
id
).
then
((
res
)
=>
{
if
(
res
.
code
==
200
)
{
message
.
success
(
'删除成功'
);
setReload
(
!
reload
);
}
else
{
message
.
error
(
res
.
message
);
}
});
},
});
};
useEffect
(()
=>
{
getDirectoryList
();
},
[
JSON
.
stringify
(
pagination
),
reload
]);
const
handleTableChange
=
(
pagination
:
TablePaginationConfig
,
filters
:
Record
<
string
,
FilterValue
>
,
sorter
:
SorterResult
<
DataType
>
,
)
=>
{
setPagination
(
pagination
);
// `dataSource` is useless since `pageSize` changed
if
(
pagination
.
pageSize
!==
pagination
?.
pageSize
)
{
setData
([]);
}
};
return
(
<>
<
div
>
<
Button
type=
'primary'
onClick=
{
()
=>
showDecModal
()
}
icon=
{
<
PlusOutlined
/>
}
style=
{
{
margin
:
'10px 0 15px 10px'
,
}
}
>
新增目录
</
Button
>
<
Table
rowKey=
'id'
columns=
{
columns
}
dataSource=
{
data
}
bordered
onChange=
{
handleTableChange
}
pagination=
{
pagination
}
loading=
{
loading
}
/>
;
</
div
>
{
/* 目录管理 */
}
<
AddOrEditDec
isModalVisible=
{
isAddOrEditDecModal
}
handleOk=
{
addOrEditDecHandleOk
}
handleCancel=
{
addOrEditDecHandleCancel
}
editData=
{
editData
}
/>
</>
);
};
export
default
DirectoryManage
;
src/router/router.tsx
浏览文件 @
23f61049
...
...
@@ -19,6 +19,12 @@ import {
SettingOutlined
,
UserOutlined
,
SisternodeOutlined
,
SendOutlined
,
RocketOutlined
,
AppstoreAddOutlined
,
AppstoreOutlined
,
CoffeeOutlined
,
UnorderedListOutlined
,
}
from
'@ant-design/icons'
;
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
...
...
@@ -85,8 +91,10 @@ const SplitCouponOperate = React.lazy(
const
CouponDetailed
=
React
.
lazy
(()
=>
import
(
'src/pages/couponManage/couponDetailed'
));
//优惠券明细
// 分类管理
const
CategoryList
=
React
.
lazy
(()
=>
import
(
'src/pages/categoryManage/index'
));
// 路由列表类型
const
CategoryManage
=
React
.
lazy
(()
=>
import
(
'~/pages/categoryManage/category'
));
const
CategoryDetail
=
React
.
lazy
(()
=>
import
(
'~/pages/categoryManage/category/detail'
));
// 目录管理
const
DirectoryManage
=
React
.
lazy
(()
=>
import
(
'~/pages/categoryManage/directoryManage'
));
export
interface
RouteObjectType
{
path
:
AgnosticIndexRouteObject
[
'path'
];
element
:
any
;
...
...
@@ -542,33 +550,67 @@ export const routerList: Array<RouteObjectType> = [
},
children
:
[
{
path
:
'/categoryManage/
categoryList
'
,
element
:
withLoadingComponent
(<
Category
List
/>),
path
:
'/categoryManage/
jobServicesCategory/1
'
,
element
:
withLoadingComponent
(<
Category
Manage
/>),
meta
:
{
id
:
18100
,
title
:
'
分类列表
'
,
icon
:
<
S
isternode
Outlined
/>,
title
:
'
作业服务分类
'
,
icon
:
<
S
end
Outlined
/>,
},
},
],
{
path
:
'/categoryManage/jobServicesCategory/2'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
meta
:
{
id
:
18200
,
title
:
'设备租赁分类'
,
icon
:
<
RocketOutlined
/>,
},
},
{
path
:
'/systemManage'
,
element
:
<
LayoutView
/>,
errorElement
:
<
ErrorPage
/>,
path
:
'/categoryManage/jobServicesCategory/3'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
meta
:
{
id
:
28000
,
icon
:
<
SettingOutlined
/>,
title
:
'系统管理'
,
id
:
18300
,
title
:
'飞手培训分类'
,
icon
:
<
AppstoreAddOutlined
/>,
},
},
{
path
:
'/categoryManage/jobServicesCategory/4'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
meta
:
{
id
:
18400
,
title
:
'产品商城分类'
,
icon
:
<
AppstoreOutlined
/>,
},
},
{
path
:
'/categoryManage/jobServicesCategory/0'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
meta
:
{
id
:
18500
,
title
:
'通用分类'
,
icon
:
<
CoffeeOutlined
/>,
},
},
{
path
:
'/categoryManage/detail/:id'
,
element
:
withLoadingComponent
(<
CategoryDetail
/>),
meta
:
{
id
:
18600
,
title
:
'分类详情'
,
icon
:
''
,
hidden
:
true
,
},
},
children
:
[
{
path
:
'/
systemManage/account
Manage'
,
element
:
withLoadingComponent
(<
AccountManageView
/>),
path
:
'/
categoryManage/Directory
Manage'
,
element
:
withLoadingComponent
(<
DirectoryManage
/>),
meta
:
{
id
:
281
00
,
title
:
'
账号
管理'
,
icon
:
<
U
ser
Outlined
/>,
id
:
187
00
,
title
:
'
目录
管理'
,
icon
:
<
U
norderedList
Outlined
/>,
},
},
],
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论