Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
A
admin-ci-test
概览
概览
详情
活动
周期分析
版本库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
问题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
日程表
图表
维基
Wiki
代码片段
代码片段
成员
成员
折叠边栏
关闭边栏
活动
图像
聊天
创建新问题
作业
提交
问题看板
Open sidebar
test-ci
admin-ci-test
Commits
a2746629
提交
a2746629
authored
8月 12, 2023
作者:
龚洪江
浏览文件
操作
浏览文件
下载
差异文件
功能:租赁页面
上级
fd241a6f
a2d16a64
全部展开
隐藏空白字符变更
内嵌
并排
正在显示
18 个修改的文件
包含
590 行增加
和
68 行删除
+590
-68
rentManageType.ts
src/api/interface/rentManageType.ts
+5
-2
old-index.tsx
src/pages/mallManage/rentGoods/rentList/old-index.tsx
+0
-0
index.scss
...e/rentGoods/rentAddOrEdit/components/goodsInfo/index.scss
+7
-0
index.tsx
...ge/rentGoods/rentAddOrEdit/components/goodsInfo/index.tsx
+57
-0
index.scss
...ge/rentGoods/rentAddOrEdit/components/rentAttr/index.scss
+7
-0
index.tsx
...age/rentGoods/rentAddOrEdit/components/rentAttr/index.tsx
+152
-0
index.scss
...ge/rentGoods/rentAddOrEdit/components/rentInfo/index.scss
+7
-0
index.tsx
...age/rentGoods/rentAddOrEdit/components/rentInfo/index.tsx
+23
-0
index.scss
...age/rentGoods/rentAddOrEdit/components/skuInfo/index.scss
+7
-0
index.tsx
...nage/rentGoods/rentAddOrEdit/components/skuInfo/index.tsx
+37
-0
index.scss
src/pages/rentManage/rentGoods/rentAddOrEdit/index.scss
+0
-0
index.tsx
src/pages/rentManage/rentGoods/rentAddOrEdit/index.tsx
+19
-0
index.tsx
...ages/rentManage/rentGoods/rentAddOrEditOrDetail/index.tsx
+0
-0
index.tsx
src/pages/rentManage/rentGoods/rentList/index.tsx
+0
-0
index.tsx
src/pages/rentManage/rentMake/index.tsx
+14
-1
index.tsx
...nage/rentMode/components/addOrEditRentModeModal/index.tsx
+107
-15
index.tsx
src/pages/rentManage/rentMode/index.tsx
+119
-20
router.tsx
src/router/router.tsx
+29
-30
没有找到文件。
src/api/interface/rentManageType.ts
浏览文件 @
a2746629
...
...
@@ -31,9 +31,12 @@ export type listBrandInfoType = InterItemFunction<
>
;
//租赁-型号-新增
export
type
addRentModeType
=
InterFunction
<
{
modeName
:
string
;
productTypeId
:
number
},
any
>
;
export
type
addRentModeType
=
InterFunction
<
{
modeName
:
string
;
productTypeId
:
number
;
brandInfoId
:
number
;
tag
?:
string
},
any
>
;
//租赁-型号-列表
export
type
rentModeListType
=
InterItemFunction
<
{
brandInfoId
?:
number
;
productTypeId
?:
number
},
any
{
modeName
:
string
;
id
:
number
;
brandInfoId
:
number
;
productTypeId
:
number
;
tag
:
string
}[]
>
;
src/pages/mallManage/rentGoods/rentList/old-index.tsx
0 → 100644
浏览文件 @
a2746629
差异被折叠。
点击展开。
src/pages/rentManage/rentGoods/rentAddOrEdit/components/goodsInfo/index.scss
0 → 100644
浏览文件 @
a2746629
.goods-info
{
&
-title
{
font-size
:
15px
;
font-weight
:
bold
;
line-height
:
40px
;
}
}
src/pages/rentManage/rentGoods/rentAddOrEdit/components/goodsInfo/index.tsx
0 → 100644
浏览文件 @
a2746629
import
{
Form
,
Input
,
Radio
}
from
'antd'
;
import
'./index.scss'
;
const
GoodsInfo
=
()
=>
{
const
qualityList
=
[
{
label
:
'全新'
,
value
:
0
,
},
{
label
:
'99新'
,
value
:
1
,
},
{
label
:
'95新'
,
value
:
2
,
},
{
label
:
'90新'
,
value
:
3
,
},
{
label
:
'80新'
,
value
:
4
,
},
];
return
(
<
div
className=
'goods-info'
>
<
div
className=
'goods-info-title'
>
商品信息
</
div
>
<
Form
labelCol=
{
{
span
:
2
}
}
wrapperCol=
{
{
span
:
10
}
}
>
<
Form
.
Item
label=
'商品标题'
>
<
Input
placeholder=
'请输入商品标题'
/>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品卖点'
>
<
Input
placeholder=
'请输入商品卖点'
/>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品成新'
>
<
Radio
.
Group
>
{
qualityList
.
map
((
v
,
index
)
=>
(
<
Radio
value=
{
v
.
value
}
key=
{
index
}
>
{
v
.
label
}
</
Radio
>
))
}
</
Radio
.
Group
>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品状态'
>
<
Radio
.
Group
>
<
Radio
value=
{
1
}
>
上架
</
Radio
>
<
Radio
value=
{
0
}
>
下架
</
Radio
>
</
Radio
.
Group
>
</
Form
.
Item
>
</
Form
>
</
div
>
);
};
export
default
GoodsInfo
;
src/pages/rentManage/rentGoods/rentAddOrEdit/components/rentAttr/index.scss
0 → 100644
浏览文件 @
a2746629
.rent-attr
{
&
-title
{
font-size
:
15px
;
font-weight
:
bold
;
line-height
:
40px
;
}
}
src/pages/rentManage/rentGoods/rentAddOrEdit/components/rentAttr/index.tsx
0 → 100644
浏览文件 @
a2746629
import
'./index.scss'
;
import
{
Button
,
Cascader
,
Form
,
Radio
,
Table
}
from
'antd'
;
import
EditableCell
from
'~/components/EditableCell'
;
import
{
useState
}
from
'react'
;
import
{
MinusOutlined
,
PlusOutlined
,
UploadOutlined
}
from
'@ant-design/icons'
;
import
{
Uploader
}
from
'~/components/uploader'
;
import
RichText
from
'~/components/richText'
;
type
EditableTableProps
=
Parameters
<
typeof
Table
>
[
0
];
type
ColumnTypes
=
Exclude
<
EditableTableProps
[
'columns'
],
undefined
>
;
const
RentAttr
=
()
=>
{
const
typeList
=
[
{
label
:
'航拍无人机'
,
value
:
1
,
},
{
label
:
'行业无人机'
,
value
:
2
,
},
{
label
:
'挂载'
,
value
:
3
,
},
{
label
:
'配件'
,
value
:
4
,
},
];
const
attrTableColumns
:
(
ColumnTypes
[
number
]
&
{
editable
?:
boolean
;
dataIndex
?:
string
;
inputType
?:
string
;
rules
?:
any
;
maxLength
?:
number
;
})[]
=
[
{
title
:
'参数名称'
,
dataIndex
:
''
,
editable
:
true
,
align
:
'center'
,
},
{
title
:
'参数值'
,
dataIndex
:
''
,
editable
:
true
,
align
:
'center'
,
},
{
title
:
'操作'
,
dataIndex
:
''
,
render
:
(
_text
:
string
,
_record
:
any
,
index
:
number
)
=>
(
<>
{
index
===
parameterTableData
.
length
-
1
?
(
<
Button
icon=
{
<
PlusOutlined
/>
}
type=
'primary'
onClick=
{
addParameterDataEvent
}
style=
{
{
marginRight
:
'10px'
}
}
></
Button
>
)
:
(
''
)
}
{
index
?
(
<
Button
type=
'primary'
icon=
{
<
MinusOutlined
/>
}
onClick=
{
deleteParameterDataEvent
}
></
Button
>
)
:
(
''
)
}
</>
),
},
];
const
columns
=
attrTableColumns
.
map
((
col
)
=>
{
if
(
!
col
.
editable
)
{
return
col
;
}
return
{
...
col
,
onCell
:
(
record
:
any
)
=>
({
record
,
dataIndex
:
col
.
dataIndex
,
title
:
col
.
title
,
editing
:
col
.
editable
,
inputType
:
col
.
inputType
,
rules
:
col
.
rules
,
}),
};
});
const
[
parameterTableData
,
setParameterTableData
]
=
useState
<
any
>
([{
id
:
1
}]);
//商品参数新增
const
addParameterDataEvent
=
()
=>
{
setParameterTableData
([...
parameterTableData
,
{
id
:
parameterTableData
.
length
+
1
}]);
};
//商品参数删除
const
deleteParameterDataEvent
=
()
=>
{};
return
(
<
div
className=
'rent-attr'
>
<
div
className=
'rent-attr-title'
>
商品属性
</
div
>
<
Form
labelCol=
{
{
span
:
2
}
}
wrapperCol=
{
{
span
:
10
}
}
>
<
Form
.
Item
label=
'商品类型'
>
<
Radio
.
Group
>
{
typeList
.
map
((
v
)
=>
(
<
Radio
key=
{
v
.
value
}
value=
{
v
.
value
}
>
{
v
.
label
}
</
Radio
>
))
}
</
Radio
.
Group
>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品型号'
>
<
Cascader
placeholder=
'请选择商品型号'
/>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品参数'
>
<
Form
>
<
Table
columns=
{
columns
as
ColumnTypes
}
components=
{
{
body
:
{
cell
:
EditableCell
,
},
}
}
dataSource=
{
parameterTableData
}
bordered
rowKey=
'id'
pagination=
{
false
}
></
Table
>
</
Form
>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品图片'
>
<
Uploader
fileUpload
listType=
'picture-card'
>
<
UploadOutlined
/>
</
Uploader
>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品视频'
>
<
Uploader
fileUpload
listType=
'picture-card'
>
<
UploadOutlined
/>
</
Uploader
>
</
Form
.
Item
>
<
Form
.
Item
label=
'商品详情页'
>
<
RichText
richTextContent=
''
/>
</
Form
.
Item
>
</
Form
>
</
div
>
);
};
export
default
RentAttr
;
src/pages/rentManage/rentGoods/rentAddOrEdit/components/rentInfo/index.scss
0 → 100644
浏览文件 @
a2746629
.rent-info
{
&
-title
{
font-size
:
15px
;
font-weight
:
bold
;
line-height
:
40px
;
}
}
src/pages/rentManage/rentGoods/rentAddOrEdit/components/rentInfo/index.tsx
0 → 100644
浏览文件 @
a2746629
import
{
Form
,
Select
}
from
'antd'
;
import
'./index.scss'
;
const
RentInfo
=
()
=>
{
return
(
<
div
className=
'rent-info'
>
<
div
className=
'rent-info-title'
>
租赁信息
</
div
>
<
Form
labelCol=
{
{
span
:
2
}
}
wrapperCol=
{
{
span
:
10
}
}
>
<
Form
.
Item
label=
'最低租期'
>
<
Select
placeholder=
'请选择租期'
>
<
Select
.
Option
>
11
</
Select
.
Option
>
</
Select
>
</
Form
.
Item
>
<
Form
.
Item
label=
'最高租期'
>
<
Select
placeholder=
'请选择租期'
>
<
Select
.
Option
>
11
</
Select
.
Option
>
</
Select
>
</
Form
.
Item
>
</
Form
>
</
div
>
);
};
export
default
RentInfo
;
src/pages/rentManage/rentGoods/rentAddOrEdit/components/skuInfo/index.scss
0 → 100644
浏览文件 @
a2746629
.sku-info
{
&
-title
{
font-size
:
15px
;
font-weight
:
bold
;
line-height
:
40px
;
}
}
src/pages/rentManage/rentGoods/rentAddOrEdit/components/skuInfo/index.tsx
0 → 100644
浏览文件 @
a2746629
import
'./index.scss'
;
import
{
Button
,
Col
,
Row
,
Table
}
from
'antd'
;
import
{
PlusOutlined
}
from
'@ant-design/icons'
;
import
{
ColumnsType
}
from
'antd/es/table/InternalTable'
;
const
SkuInfo
=
()
=>
{
const
skuTableColumns
:
ColumnsType
<
any
>
=
[
{
title
:
'版本'
,
align
:
'center'
,
},
{
title
:
'是否缺货'
,
align
:
'center'
,
},
{
title
:
'押金'
,
align
:
'center'
,
},
];
return
(
<
div
className=
'sku-info'
>
<
div
className=
'sku-info-title'
>
价格库存信息
</
div
>
<
Row
>
<
Col
span=
{
1
}
></
Col
>
<
Col
span=
{
22
}
>
<
div
>
<
Button
type=
'primary'
icon=
{
<
PlusOutlined
/>
}
style=
{
{
marginBottom
:
'10px'
}
}
>
新增规格
</
Button
>
<
Table
bordered
columns=
{
skuTableColumns
}
/>
</
div
>
</
Col
>
</
Row
>
</
div
>
);
};
export
default
SkuInfo
;
src/pages/rentManage/rentGoods/rentAddOrEdit
OrDetail
/index.scss
→
src/pages/rentManage/rentGoods/rentAddOrEdit/index.scss
浏览文件 @
a2746629
File moved
src/pages/rentManage/rentGoods/rentAddOrEdit/index.tsx
0 → 100644
浏览文件 @
a2746629
import
GoodsInfo
from
'./components/goodsInfo'
;
import
RentAttr
from
'./components/rentAttr'
;
import
RentInfo
from
'./components/rentInfo'
;
import
SkuInfo
from
'./components/skuInfo'
;
const
RentAddOrEdit
=
()
=>
{
return
(
<
div
className=
'rent-create-edit'
>
{
/*商品信息*/
}
<
GoodsInfo
/>
{
/*商品属性*/
}
<
RentAttr
/>
{
/*租赁信息*/
}
<
RentInfo
/>
{
/*价格库存信息*/
}
<
SkuInfo
/>
</
div
>
);
};
export
default
RentAddOrEdit
;
src/pages/rentManage/rentGoods/rentAddOrEditOrDetail/index.tsx
deleted
100644 → 0
浏览文件 @
fd241a6f
差异被折叠。
点击展开。
src/pages/rentManage/rentGoods/rentList/index.tsx
浏览文件 @
a2746629
差异被折叠。
点击展开。
src/pages/rentManage/rentMake/index.tsx
浏览文件 @
a2746629
...
...
@@ -6,11 +6,14 @@ import { useEffect, useState } from 'react';
import
{
RentManageAPI
}
from
'~/api'
;
import
{
InterDataType
,
PaginationProps
}
from
'~/api/interface'
;
import
{
listBrandInfoType
}
from
'~/api/interface/rentManageType'
;
import
{
useNavigate
}
from
'react-router-dom'
;
//品牌列表返回类型
type
makeListType
=
InterDataType
<
listBrandInfoType
>
[
'list'
];
const
RentMake
=
()
=>
{
const
navigate
=
useNavigate
();
const
tableColumns
:
ColumnsType
<
makeListType
[
0
]
>
=
[
{
title
:
'品牌名称'
,
...
...
@@ -30,7 +33,9 @@ const RentMake = () => {
width
:
'15%'
,
render
:
(
_
:
any
,
record
)
=>
(
<>
<
Button
type=
'link'
>
绑定型号
</
Button
>
<
Button
type=
'link'
onClick=
{
()
=>
addRentModeClick
(
record
)
}
>
新增型号
</
Button
>
<
Button
type=
'link'
onClick=
{
()
=>
addOrEditRentMakeModalClick
(
record
)
}
>
编辑
</
Button
>
...
...
@@ -71,6 +76,14 @@ const RentMake = () => {
getListBrandInfo
();
setAddOrEditRentMakeModalShow
(
false
);
};
//品牌新增型号
const
addRentModeClick
=
(
record
:
makeListType
[
0
])
=>
{
navigate
({
pathname
:
'/rentManage/rentModel'
,
search
:
`brandInfoId=
${
record
.
id
}
&brandName=
${
record
.
brandName
}
`
,
});
};
//分页
const
paginationChange
=
(
pageNo
:
number
,
pageSize
:
number
)
=>
{
pagination
.
pageNo
=
pageNo
;
...
...
src/pages/rentManage/rentMode/components/addOrEditRentModeModal/index.tsx
浏览文件 @
a2746629
import
{
Form
,
Input
,
Modal
,
ModalProps
,
Select
}
from
'antd'
;
import
{
Button
,
Col
,
Form
,
Input
,
message
,
Modal
,
ModalProps
,
Row
,
Select
}
from
'antd'
;
import
{
FC
,
useEffect
,
useState
}
from
'react'
;
import
{
InterDataType
,
InterReqType
}
from
'~/api/interface'
;
import
{
addRentModeType
,
getTypeListType
}
from
'~/api/interface/rentManageType'
;
import
{
addRentModeType
,
getTypeListType
,
rentModeListType
}
from
'~/api/interface/rentManageType'
;
import
{
RentManageAPI
}
from
'~/api'
;
import
{
MinusOutlined
,
PlusOutlined
}
from
'@ant-design/icons'
;
interface
selfProps
{
onOk
:
()
=>
void
;
onCancel
:
()
=>
void
;
brandInfoId
:
number
;
rentTypeList
:
rentTypeListType
;
currentRentMode
:
modeListType
[
0
]
|
undefined
;
}
//型号新增参数类型
type
addRentParameterType
=
Exclude
<
InterReqType
<
addRentModeType
>
,
undefined
>
;
//类型类别返回类型
type
rentTypeListType
=
InterDataType
<
getTypeListType
>
[
'list'
];
//型号返回类型
type
modeListType
=
InterDataType
<
rentModeListType
>
[
'list'
];
const
AddOrEditRentModeModal
:
FC
<
ModalProps
&
selfProps
>
=
({
open
,
onOk
,
onCancel
})
=>
{
const
AddOrEditRentModeModal
:
FC
<
ModalProps
&
selfProps
>
=
({
open
,
onOk
,
onCancel
,
brandInfoId
,
rentTypeList
,
currentRentMode
,
})
=>
{
const
[
form
]
=
Form
.
useForm
<
addRentParameterType
>
();
const
[
rentTypeList
,
setRentTypeList
]
=
useState
<
rentTypeListType
>
([]);
//标签数组
const
[
tagList
,
setTagList
]
=
useState
<
{
id
:
number
;
tagName
:
string
}[]
>
([
{
id
:
Math
.
random
(),
tagName
:
'tag1'
},
]);
const
handleOk
=
()
=>
{
form
.
validateFields
().
then
((
values
)
=>
{
RentManageAPI
.
addRentMode
({
...
values
}).
then
(({
code
})
=>
{
form
.
validateFields
().
then
((
values
:
any
)
=>
{
const
covertTagList
=
tagList
.
reduce
((
pre
:
string
[],
cur
)
=>
{
const
tagKeyItem
:
string
|
undefined
=
Object
.
keys
(
values
).
find
(
(
key
:
string
)
=>
key
===
cur
.
tagName
,
);
if
(
tagKeyItem
&&
values
[
tagKeyItem
])
{
pre
.
push
(
values
[
tagKeyItem
]);
}
return
pre
;
},
[]);
RentManageAPI
.
addRentMode
({
productTypeId
:
values
.
productTypeId
,
modeName
:
values
.
modeName
,
tag
:
covertTagList
.
length
?
covertTagList
.
join
(
','
)
:
undefined
,
brandInfoId
,
}).
then
(({
code
})
=>
{
if
(
code
===
'200'
)
{
message
.
success
(
'新增成功'
);
form
.
resetFields
();
onOk
();
}
...
...
@@ -32,20 +64,44 @@ const AddOrEditRentModeModal: FC<ModalProps & selfProps> = ({ open, onOk, onCanc
form
.
resetFields
();
onCancel
();
};
//获取类型列表
const
getRentTypeList
=
()
=>
{
RentManageAPI
.
getTypeList
({
pageNo
:
1
,
pageSize
:
99999
}).
then
(({
result
})
=>
{
setRentTypeList
(
result
.
list
||
[]);
});
//新增标签
const
addTagClick
=
()
=>
{
setTagList
([...
tagList
,
{
id
:
Math
.
random
(),
tagName
:
`tag
${
tagList
.
length
+
1
}
`
}]);
};
//删除标签
const
deleteTagClick
=
(
index
:
number
)
=>
{
form
.
setFieldValue
(
tagList
[
index
].
tagName
,
undefined
);
tagList
.
splice
(
index
,
1
);
setTagList
([...
tagList
]);
};
useEffect
(()
=>
{
getRentTypeList
();
},
[]);
if
(
currentRentMode
)
{
form
.
setFieldsValue
({
productTypeId
:
currentRentMode
.
productTypeId
,
modeName
:
currentRentMode
.
modeName
,
...
currentRentMode
.
tag
?.
split
(
','
).
reduce
((
pre
:
any
,
cur
,
currentIndex
)
=>
{
pre
[
'tag'
+
(
currentIndex
+
1
)]
=
cur
;
return
pre
;
},
{}),
});
setTagList
(
currentRentMode
.
tag
?.
split
(
','
)
.
map
((
_v
,
index
)
=>
({
id
:
Math
.
random
(),
tagName
:
`tag
${
index
+
1
}
`
}))
||
[],
);
}
},
[
currentRentMode
]);
return
(
<
Modal
open=
{
open
}
onOk=
{
handleOk
}
onCancel=
{
handleCancel
}
title=
'新增型号'
>
<
Form
form=
{
form
}
>
<
Modal
open=
{
open
}
onOk=
{
handleOk
}
onCancel=
{
handleCancel
}
title=
{
currentRentMode
?
'编辑型号'
:
'新增型号'
}
>
<
Form
form=
{
form
}
labelCol=
{
{
span
:
4
}
}
wrapperCol=
{
{
span
:
20
}
}
>
<
Form
.
Item
label=
'所属类别'
name=
'productTypeId'
...
...
@@ -66,6 +122,42 @@ const AddOrEditRentModeModal: FC<ModalProps & selfProps> = ({ open, onOk, onCanc
>
<
Input
placeholder=
'请输入型号名称'
maxLength=
{
30
}
/>
</
Form
.
Item
>
{
tagList
.
map
((
v
,
index
)
=>
(
<
Row
key=
{
v
.
id
}
>
<
Col
span=
{
20
}
>
<
Form
.
Item
label=
{
index
?
''
:
'标签'
}
labelCol=
{
{
span
:
5
}
}
wrapperCol=
{
{
span
:
19
,
offset
:
index
?
5
:
0
}
}
name=
{
v
.
tagName
}
>
<
Input
placeholder=
'请输入标签名称'
/>
</
Form
.
Item
>
</
Col
>
<
Col
span=
{
3
}
offset=
{
1
}
>
{
index
===
tagList
.
length
-
1
?
(
<
Button
type=
'primary'
icon=
{
<
PlusOutlined
/>
}
style=
{
{
marginRight
:
'5px'
}
}
onClick=
{
addTagClick
}
></
Button
>
)
:
(
''
)
}
{
index
?
(
<
Button
type=
'primary'
icon=
{
<
MinusOutlined
/>
}
onClick=
{
()
=>
deleteTagClick
(
index
)
}
></
Button
>
)
:
(
''
)
}
</
Col
>
</
Row
>
))
}
</
Form
>
</
Modal
>
);
...
...
src/pages/rentManage/rentMode/index.tsx
浏览文件 @
a2746629
import
SearchBox
,
{
searchColumns
as
searchColumnsType
}
from
'~/components/search-box'
;
import
{
Button
,
Table
}
from
'antd'
;
import
{
Button
,
Modal
,
Table
,
Tag
}
from
'antd'
;
import
{
PlusOutlined
}
from
'@ant-design/icons'
;
import
{
ColumnsType
}
from
'antd/es/table/InternalTable'
;
import
AddOrEditRentModeModal
from
'~/pages/rentManage/rentMode/components/addOrEditRentModeModal'
;
import
{
useEffect
,
useState
}
from
'react'
;
import
{
RentManageAPI
}
from
'~/api'
;
import
{
PaginationProps
}
from
'~/api/interface'
;
import
{
InterDataType
,
InterReqListType
,
PaginationProps
}
from
'~/api/interface'
;
import
{
useSearchParams
,
useNavigate
}
from
'react-router-dom'
;
import
{
getTypeListType
,
rentModeListType
}
from
'~/api/interface/rentManageType'
;
//类型类别返回类型
type
rentTypeListType
=
InterDataType
<
getTypeListType
>
[
'list'
];
//型号返回类型
type
modeListType
=
InterDataType
<
rentModeListType
>
[
'list'
];
//型号列表参数类型
type
modeListParametersType
=
InterReqListType
<
rentModeListType
>
;
const
RentMode
=
()
=>
{
const
tableColumns
:
ColumnsType
<
any
>
=
[
const
[
searchParams
]
=
useSearchParams
();
const
navigate
=
useNavigate
();
const
[
rentTypeList
,
setRentTypeList
]
=
useState
<
rentTypeListType
>
([]);
const
tableColumns
:
ColumnsType
<
modeListType
[
0
]
>
=
[
{
title
:
'型号名称'
,
align
:
'center'
,
dataIndex
:
'modeName'
,
},
{
title
:
'所属类型'
,
align
:
'center'
,
},
{
title
:
'所属品牌'
,
align
:
'center'
,
dataIndex
:
'productTypeId'
,
render
:
(
text
:
number
)
=>
rentTypeList
.
find
((
v
)
=>
v
.
id
===
text
)?.
name
||
''
,
},
{
title
:
'标签'
,
align
:
'center'
,
dataIndex
:
'tag'
,
render
:
(
text
:
string
)
=>
text
?.
split
(
','
).
map
((
v
,
index
)
=>
<
Tag
key=
{
index
}
>
{
v
}
</
Tag
>),
},
{
title
:
'操作'
,
align
:
'center'
,
width
:
'10%'
,
render
:
(
_
:
any
,
record
)
=>
(
<>
<
Button
type=
'link'
onClick=
{
()
=>
addOrEditRentModelClick
(
record
)
}
>
编辑
</
Button
>
<
Button
type=
'link'
onClick=
{
()
=>
deleteRentModelClick
(
record
)
}
>
删除
</
Button
>
</>
),
},
];
const
searchColumns
:
searchColumnsType
[]
=
[
{
name
:
''
,
label
:
'
设备
类型'
,
placeholder
:
'请选择
设备
类型'
,
name
:
'
productTypeId
'
,
label
:
'
所属
类型'
,
placeholder
:
'请选择
所属
类型'
,
type
:
'select'
,
options
:
[]
,
options
:
rentTypeList
.
map
((
v
)
=>
({
id
:
v
.
id
,
name
:
v
.
name
}))
,
},
];
const
[
brandInfoId
,
setBrandInfoId
]
=
useState
<
number
>
(
-
1
);
const
[
addOrEditRentModelModalShow
,
setAddOrEditRentModelModalShow
]
=
useState
<
boolean
>
(
false
);
const
[
pagination
,
setPagination
]
=
useState
<
PaginationProps
&
{
totalCount
:
number
}
>
({
pageNo
:
1
,
pageSize
:
10
,
totalCount
:
0
,
});
const
[
tableData
,
setTableData
]
=
useState
<
modeListType
>
([]);
const
[
query
,
setQuery
]
=
useState
<
modeListParametersType
>
();
const
[
currentRentMode
,
setCurrentRentMode
]
=
useState
<
modeListType
[
0
]
>
();
//新增,编辑型号弹窗
const
addOrEditRentModelClick
=
()
=>
{
const
addOrEditRentModelClick
=
(
record
?:
modeListType
[
0
])
=>
{
setCurrentRentMode
(
record
?
{
...
record
}
:
undefined
);
setAddOrEditRentModelModalShow
(
true
);
};
const
addOrEditRentModelModalCancel
=
()
=>
{
setAddOrEditRentModelModalShow
(
false
);
};
const
addOrEditRentModelModalOk
=
()
=>
{
setAddOrEditRentModelModalShow
(
true
);
setAddOrEditRentModelModalShow
(
false
);
getModeList
(
brandInfoId
,
query
);
};
//类型列表
const
getModeList
=
()
=>
{
//删除型号
const
deleteRentModelClick
=
(
record
:
modeListType
[
0
])
=>
{
Modal
.
confirm
({
title
:
'提示'
,
content
:
'确认删除该型号?'
,
onOk
:
()
=>
{},
});
};
//型号列表
const
getModeList
=
(
brandInfoId
:
number
,
query
?:
modeListParametersType
)
=>
{
RentManageAPI
.
getRentModeList
({
pageNo
:
pagination
.
pageNo
,
pageSize
:
pagination
.
pageSize
,
brandInfoId
,
...
query
,
}).
then
(({
result
})
=>
{
pagination
.
totalCount
=
result
.
totalCount
;
setTableData
(
result
.
list
||
[]);
setPagination
({
...
pagination
});
});
};
//获取类型列表
const
getRentTypeList
=
()
=>
{
RentManageAPI
.
getTypeList
({
pageNo
:
1
,
pageSize
:
99999
}).
then
(({
result
})
=>
{
setRentTypeList
(
result
.
list
||
[]);
searchColumns
[
0
].
options
=
(
result
.
list
||
[]).
map
((
v
)
=>
({
id
:
v
.
id
,
name
:
v
.
name
}));
});
};
//返回
const
backRoute
=
()
=>
{
navigate
(
-
1
);
};
//分页
const
paginationChange
=
(
pageNo
:
number
,
pageSize
:
number
)
=>
{
pagination
.
pageNo
=
pageNo
;
pagination
.
pageSize
=
pageSize
;
getModeList
(
brandInfoId
,
query
);
};
//筛选
const
searchSuccess
=
(
value
:
modeListParametersType
)
=>
{
pagination
.
pageSize
=
10
;
pagination
.
pageNo
=
1
;
setQuery
(
value
);
getModeList
(
brandInfoId
,
value
);
};
useEffect
(()
=>
{
getModeList
();
getRentTypeList
();
setBrandInfoId
(
Number
(
searchParams
.
get
(
'brandInfoId'
)));
getModeList
(
Number
(
searchParams
.
get
(
'brandInfoId'
)));
},
[]);
return
(
<
div
className=
'rent-model'
>
<
SearchBox
search=
{
searchColumns
}
child=
{
<
Button
type=
'primary'
icon=
{
<
PlusOutlined
/>
}
onClick=
{
addOrEditRentModelClick
}
>
新增型号
<>
<
span
style=
{
{
marginRight
:
'10px'
,
color
:
'#1677ff'
}
}
>
当前品牌:
{
searchParams
.
get
(
'brandName'
)
}
</
span
>
<
Button
type=
'primary'
icon=
{
<
PlusOutlined
/>
}
onClick=
{
()
=>
addOrEditRentModelClick
()
}
>
新增型号
</
Button
>
</>
}
otherChild=
{
<
Button
type=
'primary'
onClick=
{
backRoute
}
>
返回
</
Button
>
}
searchData=
{
searchSuccess
}
/>
<
Table
bordered
columns=
{
tableColumns
}
dataSource=
{
tableData
}
rowKey=
'id'
pagination=
{
{
total
:
pagination
.
totalCount
,
pageSize
:
pagination
.
pageSize
,
current
:
pagination
.
pageNo
,
showSizeChanger
:
true
,
showQuickJumper
:
true
,
onChange
:
(
page
:
number
,
pageSize
:
number
)
=>
paginationChange
(
page
,
pageSize
),
showTotal
:
(
total
,
range
)
=>
`当前 ${range[0]}-${range[1]} 条记录 / 共 ${total} 条数据`
,
}
}
/>
<
Table
bordered
columns=
{
tableColumns
}
/>
<
AddOrEditRentModeModal
open=
{
addOrEditRentModelModalShow
}
onCancel=
{
addOrEditRentModelModalCancel
}
onOk=
{
addOrEditRentModelModalOk
}
brandInfoId=
{
brandInfoId
}
rentTypeList=
{
rentTypeList
}
currentRentMode=
{
currentRentMode
}
/>
</
div
>
);
...
...
src/router/router.tsx
浏览文件 @
a2746629
...
...
@@ -98,9 +98,7 @@ const ServiceIntroduceView = React.lazy(
);
//服务介绍
const
RentListView
=
React
.
lazy
(()
=>
import
(
'~/pages/rentManage/rentGoods/rentList'
));
//租赁列表
const
RentAddOrEditOrDetailView
=
React
.
lazy
(
()
=>
import
(
'~/pages/rentManage/rentGoods/rentAddOrEditOrDetail'
),
);
//租赁新增、编辑、详情
const
RentAddOrEditView
=
React
.
lazy
(()
=>
import
(
'~/pages/rentManage/rentGoods/rentAddOrEdit'
));
//租赁新增、编辑、详情
const
RentTypeView
=
React
.
lazy
(()
=>
import
(
'~/pages/rentManage/rentType'
));
//租赁-类型管理
const
RentMakeView
=
React
.
lazy
(()
=>
import
(
'~/pages/rentManage/rentMake'
));
//租赁-品牌管理
const
RentModeView
=
React
.
lazy
(()
=>
import
(
'~/pages/rentManage/rentMode'
));
//租赁-型号管理
...
...
@@ -716,7 +714,7 @@ export const routerList: Array<RouteObjectType> = [
},
{
path
:
'/rentManage/rentGoods/add'
,
element
:
withLoadingComponent
(<
RentAddOrEdit
OrDetail
View
/>),
element
:
withLoadingComponent
(<
RentAddOrEditView
/>),
errorElement
:
<
ErrorPage
/>,
meta
:
{
id
:
10135
,
...
...
@@ -727,7 +725,7 @@ export const routerList: Array<RouteObjectType> = [
},
{
path
:
'/rentManage/rentGoods/edit'
,
element
:
withLoadingComponent
(<
RentAddOrEdit
OrDetail
View
/>),
element
:
withLoadingComponent
(<
RentAddOrEditView
/>),
errorElement
:
<
ErrorPage
/>,
meta
:
{
id
:
10136
,
...
...
@@ -736,17 +734,17 @@ export const routerList: Array<RouteObjectType> = [
hidden
:
true
,
},
},
{
path
:
'/rentManage/rentGoods/detail'
,
element
:
withLoadingComponent
(<
RentAddOrEditOrDetail
View
/>),
errorElement
:
<
ErrorPage
/>,
meta
:
{
id
:
10136
,
icon
:
<
SmileOutlined
/>,
title
:
'租赁商品详情'
,
hidden
:
true
,
},
},
//
{
//
path: '/rentManage/rentGoods/detail',
// element: withLoadingComponent(<RentAddOrEdit
View />),
//
errorElement: <ErrorPage />,
//
meta: {
//
id: 10136,
//
icon: <SmileOutlined />,
//
title: '租赁商品详情',
//
hidden: true,
//
},
//
},
{
path
:
'/rentManage/rentType'
,
element
:
withLoadingComponent
(<
RentTypeView
/>),
...
...
@@ -776,8 +774,9 @@ export const routerList: Array<RouteObjectType> = [
meta
:
{
id
:
10139
,
icon
:
<
SmileOutlined
/>,
title
:
'
型号管理
'
,
title
:
'
品牌管理/型号
'
,
develop
:
true
,
hidden
:
true
,
},
},
],
...
...
@@ -792,20 +791,9 @@ export const routerList: Array<RouteObjectType> = [
title
:
'分类管理'
,
},
children
:
[
{
path
:
'/categoryManage/jobServicesCategory/1'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
errorElement
:
<
ErrorPage
/>,
meta
:
{
id
:
1210
,
title
:
'作业服务分类'
,
icon
:
<
SendOutlined
/>,
},
},
// 作业服务分类(新)
// {
// path: '/categoryManage/
serviceCategoryList
',
// element: withLoadingComponent(<
ServiceCategoryListView
/>),
// path: '/categoryManage/
jobServicesCategory/1
',
// element: withLoadingComponent(<
CategoryManage
/>),
// errorElement: <ErrorPage />,
// meta: {
// id: 1210,
...
...
@@ -813,6 +801,17 @@ export const routerList: Array<RouteObjectType> = [
// icon: <SendOutlined />,
// },
// },
// 作业服务分类(新)
{
path
:
'/categoryManage/serviceCategoryList'
,
element
:
withLoadingComponent
(<
ServiceCategoryListView
/>),
errorElement
:
<
ErrorPage
/>,
meta
:
{
id
:
1210
,
title
:
'作业服务分类'
,
icon
:
<
SendOutlined
/>,
},
},
{
path
:
'/categoryManage/jobServicesCategory/2'
,
element
:
withLoadingComponent
(<
CategoryManage
/>),
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论