Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
X
xiaomai-cloud-class-web
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
xiaomai-cloud-class
xiaomai-cloud-class-web
Commits
31522557
Commit
31522557
authored
Dec 04, 2020
by
wufan
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat:员工管理联调
parent
268f5fd7
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
358 additions
and
150 deletions
+358
-150
src/common/images/xiaomai-IMG.png
+0
-0
src/common/js/axios.ts
+3
-3
src/core/antd.less
+4
-4
src/data-source/store/request-apis.ts
+14
-2
src/domains/store-domain/storeService.ts
+17
-7
src/modules/root/App.tsx
+2
-13
src/modules/store-manege/EmployeeAddOrEditModal.tsx
+137
-42
src/modules/store-manege/EmployeesManagePage.tsx
+175
-74
src/modules/store-manege/UserManagePage.tsx
+6
-5
No files found.
src/common/images/xiaomai-IMG.png
View file @
31522557
6.55 KB
|
W:
|
H:
6.53 KB
|
W:
|
H:
2-up
Swipe
Onion skin
src/common/js/axios.ts
View file @
31522557
/*
/*
* @Author: 吴文洁
* @Author: 吴文洁
* @Date: 2020-08-31 09:34:31
* @Date: 2020-08-31 09:34:31
* @LastEditors:
zhangleyu
an
* @LastEditors:
wuf
an
* @LastEditTime: 2020-12-0
3 10:19:49
* @LastEditTime: 2020-12-0
4 15:07:46
* @Description:
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
*/
...
@@ -32,7 +32,7 @@ class Axios {
...
@@ -32,7 +32,7 @@ class Axios {
params
:
any
,
params
:
any
,
options
:
FetchOptions
=
{
requestType
:
'json'
}
options
:
FetchOptions
=
{
requestType
:
'json'
}
):
Promise
<
any
>
{
):
Promise
<
any
>
{
const
_url
=
`
${
url
}
?storeId=
${
U
SER_TYPE
}
&token=
${
User
.
getToken
()}
&storeUserId=
${
User
.
getStoreUserId
()}
&userId=
${
User
.
getUserId
()}
`
;
const
_url
=
`
${
url
}
?storeId=
${
U
ser
.
getStoreId
()
}
&token=
${
User
.
getToken
()}
&storeUserId=
${
User
.
getStoreUserId
()}
&userId=
${
User
.
getUserId
()}
`
;
return
new
Promise
((
resolve
,
reject
)
=>
{
return
new
Promise
((
resolve
,
reject
)
=>
{
const
instance
:
AxiosInstance
=
axios
.
create
({
const
instance
:
AxiosInstance
=
axios
.
create
({
...
...
src/core/antd.less
View file @
31522557
...
@@ -83,10 +83,10 @@
...
@@ -83,10 +83,10 @@
}
}
.ant-radio {
.ant-radio {
.ant-radio-inner {
//
.ant-radio-inner {
width: 14px !important;
//
width: 14px !important;
height: 14px !important;
//
height: 14px !important;
}
//
}
.ant-radio-inner:after {
.ant-radio-inner:after {
height: 8px !important;
height: 8px !important;
...
...
src/data-source/store/request-apis.ts
View file @
31522557
...
@@ -2,7 +2,7 @@
...
@@ -2,7 +2,7 @@
* @Author: wufan
* @Author: wufan
* @Date: 2020-11-25 18:25:02
* @Date: 2020-11-25 18:25:02
* @LastEditors: wufan
* @LastEditors: wufan
* @LastEditTime: 2020-12-0
1 20:45:54
* @LastEditTime: 2020-12-0
4 10:52:49
* @Description: Description
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
*/
...
@@ -21,5 +21,17 @@ export function getUserList(params: object) {
...
@@ -21,5 +21,17 @@ export function getUserList(params: object) {
}
}
export
function
getStoreDecorationList
(
params
:
object
)
{
export
function
getStoreDecorationList
(
params
:
object
)
{
return
Service
.
Apollo
(
"public/store/getStoreBannerList"
,
params
);
return
Service
.
Hades
(
"public/store/getStoreBannerList"
,
params
);
}
export
function
addEmployee
(
params
:
object
)
{
return
Service
.
Hades
(
"public/store/addStoreUser"
,
params
);
}
export
function
editEmployee
(
params
:
object
)
{
return
Service
.
Hades
(
"public/store/editStoreUser"
,
params
);
}
export
function
deleteEmployee
(
params
:
object
)
{
return
Service
.
Hades
(
"public/store/delStoreUser"
,
params
);
}
}
src/domains/store-domain/storeService.ts
View file @
31522557
...
@@ -2,34 +2,44 @@
...
@@ -2,34 +2,44 @@
* @Author: wufan
* @Author: wufan
* @Date: 2020-11-25 18:25:02
* @Date: 2020-11-25 18:25:02
* @LastEditors: wufan
* @LastEditors: wufan
* @LastEditTime: 2020-12-0
1 18:13:50
* @LastEditTime: 2020-12-0
4 10:52:26
* @Description: Description
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
*/
import
{
getEmployeeList
,
getUserList
,
getStoreDecorationList
,
getStoreRole
}
from
'@/data-source/store/request-apis'
;
import
{
getEmployeeList
,
getUserList
,
getStoreDecorationList
,
getStoreRole
,
addEmployee
,
editEmployee
,
deleteEmployee
}
from
'@/data-source/store/request-apis'
;
export
default
class
StoreService
{
export
default
class
StoreService
{
// 获取员工列表
// 获取员工列表
static
getEmployeeList
(
params
:
any
)
{
static
getEmployeeList
(
params
:
any
)
{
return
getEmployeeList
(
params
);
return
getEmployeeList
(
params
);
}
}
// 获取店铺角色
// 获取店铺角色
static
getStoreRole
(
params
:
any
)
{
static
getStoreRole
(
params
:
any
)
{
return
getStoreRole
(
params
);
return
getStoreRole
(
params
);
}
}
// 删除员工
// 删除员工
static
deleteEmployee
(
params
:
any
)
{
static
deleteEmployee
(
params
:
any
)
{
return
getUserList
(
params
);
return
deleteEmployee
(
params
);
}
// 添加员工
static
addEmployee
(
params
:
any
)
{
return
addEmployee
(
params
);
}
// 编辑员工
static
editEmployee
(
params
:
any
)
{
return
editEmployee
(
params
);
}
}
// 获取用户列表
// 获取用户列表
static
getUserList
(
params
:
any
)
{
static
getUserList
(
params
:
any
)
{
return
getUserList
(
params
);
return
getUserList
(
params
);
}
}
// 获取用户列表
// 获取用户列表
static
getStoreDecorationList
(
params
:
any
)
{
static
getStoreDecorationList
(
params
:
any
)
{
return
getStoreDecorationList
(
params
);
return
getStoreDecorationList
(
params
);
}
}
...
...
src/modules/root/App.tsx
View file @
31522557
/*
* @Author: 吴文洁
* @Date: 2019-07-10 10:30:49
<<<<<<< Updated upstream
* @LastEditors: wufan
* @LastEditTime: 2020-12-02 18:02:14
=======
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-02 19:47:15
>>>>>>> Stashed changes
* @Description:
*/
import
React
,
{
useContext
,
useEffect
}
from
'react'
;
import
React
,
{
useContext
,
useEffect
}
from
'react'
;
import
{
withRouter
}
from
'react-router-dom'
;
import
{
withRouter
}
from
'react-router-dom'
;
import
{
ConfigProvider
}
from
'antd'
;
import
{
ConfigProvider
}
from
'antd'
;
...
@@ -43,7 +32,7 @@ const App: React.FC = (props: any) => {
...
@@ -43,7 +32,7 @@ const App: React.FC = (props: any) => {
function
getStoreGroupAndStoreList
()
{
function
getStoreGroupAndStoreList
()
{
BaseService
.
getUserStore
({
userId
}).
then
((
res
)
=>
{
BaseService
.
getUserStore
({
userId
}).
then
((
res
)
=>
{
const
{
storeGroupVOS
=
[],
storeVOS
}
=
res
.
result
;
const
{
storeGroupVOS
=
[],
storeVOS
=
[]
}
=
res
.
result
;
const
{
id
,
storeUserId
}
=
storeVOS
[
0
];
const
{
id
,
storeUserId
}
=
storeVOS
[
0
];
User
.
setStoreId
(
id
);
User
.
setStoreId
(
id
);
...
...
src/modules/store-manege/EmployeeAddOrEditModal.tsx
View file @
31522557
...
@@ -2,53 +2,81 @@
...
@@ -2,53 +2,81 @@
* @Author: wufan
* @Author: wufan
* @Date: 2020-11-27 16:21:49
* @Date: 2020-11-27 16:21:49
* @LastEditors: wufan
* @LastEditors: wufan
* @LastEditTime: 2020-1
1-30 15:46:10
* @LastEditTime: 2020-1
2-04 15:02:22
* @Description: Description
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
*/
import
React
,
{
useState
,
useEffect
}
from
"react"
;
import
React
,
{
useState
,
useEffect
}
from
"react"
;
import
{
Modal
,
Form
,
Button
,
Input
,
Radio
,
Row
,
Col
,
message
}
from
"antd"
;
import
{
import
_
from
"underscore"
;
Modal
,
Form
,
Button
,
Input
,
InputNumber
,
Radio
,
Row
,
Col
,
message
,
}
from
"antd"
;
import
_
,
{
values
}
from
"underscore"
;
import
"./EmployeeAddOrEditModal.less"
;
import
"./EmployeeAddOrEditModal.less"
;
import
baseImg
from
"@/common/images/xiaomai-IMG.png"
;
import
baseImg
from
"@/common/images/xiaomai-IMG.png"
;
import
{
CropperModal
}
from
"@/components/"
;
import
{
CropperModal
}
from
"@/components/"
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
UpLoad
from
"../common/UpLoad"
;
import
UpLoad
from
"../common/UpLoad"
;
import
$
from
'jquery'
;
import
$
from
"jquery"
;
import
User
from
"@/common/js/user"
;
const
RadioGroup
=
Radio
.
Group
;
const
RadioGroup
=
Radio
.
Group
;
declare
let
window
:
any
;
declare
let
window
:
any
;
interface
AddEmployeeModalProps
{
interface
AddEmployeeModalProps
{
isOpen
:
boolean
;
isOpen
:
boolean
;
choosedItem
:
{
choosedItem
:
{
name
?:
string
;
n
ickN
ame
?:
string
;
phone
?:
string
;
phone
?:
string
;
role
?:
string
;
role
:
Array
<
string
>
;
avatar
?:
string
;
avatar
?:
string
;
storeUserId
?:
string
;
};
};
onClose
:
(
e
:
any
)
=>
void
;
onClose
:
()
=>
void
;
}
}
function
AddEmployeeModal
(
props
:
AddEmployeeModalProps
)
{
function
AddEmployeeModal
(
props
:
AddEmployeeModalProps
)
{
const
[
name
,
setName
]
=
useState
(
""
);
const
[
n
ickN
ame
,
setName
]
=
useState
(
""
);
const
[
phone
,
setPhone
]
=
useState
(
""
);
const
[
phone
,
setPhone
]
=
useState
(
""
);
const
[
role
,
setRole
]
=
useState
(
'1'
);
const
[
role
,
setRole
]
=
useState
(
"CloudLecturer"
);
const
[
avatar
,
setAvatar
]
=
useState
(
baseImg
);
const
[
avatar
,
setAvatar
]
=
useState
(
baseImg
);
const
storeUserId
=
props
.
choosedItem
.
storeUserId
;
const
[
imgUrl
,
setImgUrl
]
=
useState
(
avatar
);
const
[
imgUrl
,
setImgUrl
]
=
useState
(
avatar
);
const
[
nameErrorMsg
,
setNameErrorMsg
]
=
useState
(
""
);
const
[
nameErrorMsg
,
setNameErrorMsg
]
=
useState
(
""
);
const
[
nameStatus
,
setNameStatus
]
=
useState
(
""
);
const
[
nameStatus
,
setNameStatus
]
=
useState
<
""
|
"error"
|
"success"
|
"warning"
|
"validating"
|
undefined
>
();
const
[
phoneErrorMessage
,
setPhoneErrorMessage
]
=
useState
(
""
);
const
[
phoneErrorMessage
,
setPhoneErrorMessage
]
=
useState
(
""
);
const
[
phoneStatus
,
setPhoneStatus
]
=
useState
(
""
);
const
[
phoneStatus
,
setPhoneStatus
]
=
useState
<
""
|
"error"
|
"success"
|
"warning"
|
"validating"
|
undefined
>
();
const
[
cropperModalVisible
,
setCropperModalVisible
]
=
useState
(
false
);
const
[
cropperModalVisible
,
setCropperModalVisible
]
=
useState
(
false
);
const
[
form
]
=
Form
.
useForm
();
useEffect
(()
=>
{
useEffect
(()
=>
{
if
(
props
.
choosedItem
.
name
)
{
if
(
props
.
choosedItem
.
n
ickN
ame
)
{
console
.
log
(
"props.choosedItem"
,
props
.
choosedItem
);
console
.
log
(
"props.choosedItem"
,
props
.
choosedItem
);
setName
(
props
.
choosedItem
.
name
);
setName
(
props
.
choosedItem
.
n
ickN
ame
);
props
.
choosedItem
.
phone
&&
setPhone
(
props
.
choosedItem
.
phone
);
props
.
choosedItem
.
phone
&&
setPhone
(
props
.
choosedItem
.
phone
);
props
.
choosedItem
.
role
&&
setRole
(
props
.
choosedItem
.
role
);
props
.
choosedItem
.
role
&&
setRole
(
props
.
choosedItem
.
role
[
0
]
);
props
.
choosedItem
.
avatar
&&
setAvatar
(
avatar
||
baseImg
);
props
.
choosedItem
.
avatar
&&
setAvatar
(
avatar
||
baseImg
);
const
_role
=
props
.
choosedItem
.
role
[
0
]
===
"讲师"
?
"CloudLecturer"
:
"CloudManager"
;
form
.
setFieldsValue
({
nickName
:
props
.
choosedItem
.
nickName
,
role
:
_role
,
phone
:
props
.
choosedItem
.
phone
,
avatar
:
props
.
choosedItem
.
avatar
});
}
}
},
[
props
.
choosedItem
]);
},
[
props
.
choosedItem
.
nickName
]);
const
layout
=
{
const
layout
=
{
labelCol
:
{
span
:
5
},
labelCol
:
{
span
:
5
},
...
@@ -89,30 +117,95 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
...
@@ -89,30 +117,95 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
}
}
function
handleOk
():
void
{
function
handleOk
():
void
{
if
(
!
name
.
trim
()){
const
values
=
form
.
getFieldsValue
();
setNameErrorMsg
(
"请输入讲师姓名"
);
console
.
log
(
"values"
,
values
);
setNameStatus
(
"error"
);
if
(
!
values
.
nickName
.
trim
())
{
setNameErrorMsg
(
"请输入员工姓名"
);
setNameStatus
(
"error"
);
return
;
}
setNameErrorMsg
(
""
);
setNameStatus
(
""
);
if
(
!
String
(
values
.
phone
))
{
setPhoneErrorMessage
(
"请输入手机号码"
);
setPhoneStatus
(
"error"
);
return
;
}
setPhoneErrorMessage
(
""
);
setPhoneStatus
(
""
);
if
(
String
(
values
.
phone
).
length
!==
11
)
{
setPhoneErrorMessage
(
"请输入11位手机号"
);
setPhoneStatus
(
"error"
);
return
;
}
setPhoneErrorMessage
(
""
);
setPhoneStatus
(
""
);
props
.
choosedItem
.
nickName
?
handleEditEmployee
()
:
handleAddEmployee
();
}
function
handleChangeValues
(
name
:
string
,
value
:
any
)
{
switch
(
name
)
{
case
"nickName"
:
form
.
setFieldsValue
({
nickName
:
value
});
setName
(
value
);
return
;
return
;
}
if
(
!
phone
.
trim
()){
case
"phone"
:
setPhoneErrorMessage
(
"请输入手机号码"
);
form
.
setFieldsValue
({
phone
:
value
}
);
set
NameStatus
(
"error"
);
set
Phone
(
value
);
return
;
return
;
}
if
(
phone
.
trim
().
length
!==
11
){
case
"role"
:
setPhoneErrorMessage
(
"请输入11位手机号"
);
form
.
setFieldsValue
({
role
:
value
}
);
set
NameStatus
(
"error"
);
set
Role
(
value
);
return
;
return
;
}
default
:
break
;
}
}
function
handleAddEmployee
()
{
const
params
=
{
nickName
,
phone
:
String
(
phone
),
roleCodes
:[
role
],
// avatar,
storeId
:
User
.
getStoreId
()
};
console
.
log
(
"params"
,
params
);
StoreService
.
addEmployee
(
params
).
then
((
res
)
=>
{
message
.
success
(
"保存成功"
);
props
.
onClose
();
});
}
}
console
.
log
(
"role"
,
name
,
phone
,
role
);
const
[
form
]
=
Form
.
useForm
();
function
handleEditEmployee
()
{
const
params
=
{
nickName
,
phone
:
String
(
phone
),
roleCodes
:[
role
],
// avatar,
storeUserId
:
storeUserId
};
console
.
log
(
"params"
,
params
);
StoreService
.
editEmployee
(
params
).
then
((
res
)
=>
{
message
.
success
(
"编辑成功"
);
props
.
onClose
();
});
}
console
.
log
(
"values"
,
form
,
form
.
getFieldsValue
())
return
(
return
(
<
Modal
<
Modal
visible=
{
props
.
isOpen
}
visible=
{
props
.
isOpen
}
title=
{
`${props.choosedItem.name ? "编辑员工" : "添加员工"}`
}
title=
{
`${props.choosedItem.n
ickN
ame ? "编辑员工" : "添加员工"}`
}
className=
"employee-add-modal"
className=
"employee-add-modal"
width=
{
680
}
width=
{
680
}
onCancel=
{
props
.
onClose
}
onCancel=
{
props
.
onClose
}
...
@@ -124,22 +217,23 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
...
@@ -124,22 +217,23 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
{
...
layout
}
{
...
layout
}
form=
{
form
}
form=
{
form
}
name=
"basic"
name=
"basic"
initialValues=
{
{
n
ame
:
"是电放费"
,
phone
:
phone
,
role
:
role
}
}
initialValues=
{
{
n
ickName
:
nickName
,
phone
:
phone
,
role
:
role
}
}
onFinish=
{
onFinish
}
onFinish=
{
onFinish
}
onFinishFailed=
{
onFinishFailed
}
onFinishFailed=
{
onFinishFailed
}
>
>
<
Form
.
Item
<
Form
.
Item
label=
"员工姓名"
label=
"员工姓名"
name=
"name"
name=
"n
ickN
ame"
rules=
{
[{
required
:
true
}]
}
rules=
{
[{
required
:
true
}]
}
//
validateStatus={nameStatus}
validateStatus=
{
nameStatus
}
help=
{
nameErrorMsg
}
help=
{
nameErrorMsg
}
>
>
<
Input
<
Input
style=
{
{
width
:
200
}
}
style=
{
{
width
:
200
}
}
// value={name}
// value={n
ickN
ame}
placeholder=
"请输入员工名称"
placeholder=
"请输入员工名称"
maxLength=
{
15
}
maxLength=
{
15
}
onChange=
{
(
e
)
=>
handleChangeValues
(
"nickName"
,
e
.
target
.
value
)
}
/>
/>
</
Form
.
Item
>
</
Form
.
Item
>
...
@@ -147,15 +241,16 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
...
@@ -147,15 +241,16 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
label=
"手机号码"
label=
"手机号码"
name=
"phone"
name=
"phone"
rules=
{
[{
required
:
true
}]
}
rules=
{
[{
required
:
true
}]
}
//
validateStatus={phoneStatus}
validateStatus=
{
phoneStatus
}
help=
{
phoneErrorMessage
}
help=
{
phoneErrorMessage
}
>
>
<
Input
<
Input
Number
style=
{
{
width
:
200
}
}
style=
{
{
width
:
200
}
}
// value={phone}
// value={phone}
placeholder=
"请输入手机号"
placeholder=
"请输入手机号"
maxLength=
{
11
}
maxLength=
{
11
}
disabled=
{
!!
props
.
choosedItem
.
name
}
disabled=
{
!!
props
.
choosedItem
.
nickName
}
onChange=
{
(
value
)
=>
handleChangeValues
(
"phone"
,
value
)
}
/>
/>
</
Form
.
Item
>
</
Form
.
Item
>
...
@@ -167,16 +262,16 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
...
@@ -167,16 +262,16 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
<
RadioGroup
<
RadioGroup
// value={role}
// value={role}
onChange=
{
(
e
)
=>
{
onChange=
{
(
e
)
=>
{
handleChange
Role
(
e
.
target
.
value
);
handleChange
Values
(
"role"
,
e
.
target
.
value
);
}
}
}
}
>
>
<
Radio
value=
{
"
1
"
}
>
<
Radio
value=
{
"
CloudLecturer
"
}
>
<
span
style=
{
{
color
:
"#333"
}
}
>
普通讲师
</
span
>
<
span
style=
{
{
color
:
"#333"
}
}
>
普通讲师
</
span
>
<
p
className=
"radio-tip"
>
<
p
className=
"radio-tip"
>
仅可查看/使用与自己相关的文件和课表,并进行上课
仅可查看/使用与自己相关的文件和课表,并进行上课
</
p
>
</
p
>
</
Radio
>
</
Radio
>
<
Radio
value=
{
"
0
"
}
>
<
Radio
value=
{
"
CloudManager
"
}
>
<
span
style=
{
{
color
:
"#333"
}
}
>
管理员
</
span
>
<
span
style=
{
{
color
:
"#333"
}
}
>
管理员
</
span
>
<
p
className=
"radio-tip"
>
可执行店铺中所有的操作
</
p
>
<
p
className=
"radio-tip"
>
可执行店铺中所有的操作
</
p
>
</
Radio
>
</
Radio
>
...
...
src/modules/store-manege/EmployeesManagePage.tsx
View file @
31522557
...
@@ -9,61 +9,97 @@ import React, { useEffect, useState } from "react";
...
@@ -9,61 +9,97 @@ import React, { useEffect, useState } from "react";
import
{
withRouter
}
from
"react-router-dom"
;
import
{
withRouter
}
from
"react-router-dom"
;
import
_
from
"underscore"
;
import
_
from
"underscore"
;
import
PageControl
from
"@/components/PageControl"
;
import
PageControl
from
"@/components/PageControl"
;
import
{
CheckBox
}
from
"@/components"
;
import
{
CheckBox
,
SearchBar
}
from
"@/components"
;
import
{
Button
,
Table
,
Tooltip
,
Modal
,
message
,
Row
,
Col
,
Input
}
from
"antd"
;
import
{
Button
,
Table
,
Tooltip
,
Modal
,
message
,
Row
,
Col
,
Input
}
from
"antd"
;
import
{
QuestionCircleOutlined
}
from
'@ant-design/icons'
;
import
{
QuestionCircleOutlined
}
from
"@ant-design/icons"
;
import
{
storeRoleEnum
}
from
"@/domains/store-domain/constants"
;
import
{
storeRoleEnum
}
from
"@/domains/store-domain/constants"
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
EmployeeAddOrEditModal
from
'./EmployeeAddOrEditModal'
;
import
EmployeeAddOrEditModal
from
"./EmployeeAddOrEditModal"
;
import
User
from
'@/common/js/user'
;
import
User
from
"@/common/js/user"
;
import
"./EmployeesManagePage.less"
;
import
"./EmployeesManagePage.less"
;
import
{
string
}
from
"prop-types"
;
const
{
confirm
}
=
Modal
;
const
{
confirm
}
=
Modal
;
const
{
Search
}
=
Input
;
const
{
Search
}
=
Input
;
declare
var
window
:
any
;
declare
var
window
:
any
;
interface
RecordTypes
{
interface
RecordTypes
{
storeUserId
:
string
,
id
:
string
;
role
:
string
role
:
string
;
roleCodes
:
Array
<
string
>
;
userId
:
string
;
nickName
:
string
;
phone
:
string
;
avatar
?:
string
;
}
interface
RoleItemType
{
isChecked
:
boolean
;
roleCode
:
string
;
name
:
string
;
id
:
string
;
}
interface
QueryType
{
current
:
number
;
size
:
number
;
nickName
?:
string
;
phone
?:
string
;
roleCodes
:
Array
<
string
>
;
storeId
:
string
|
undefined
|
null
;
}
interface
ChoosedItemType
{
nickName
?:
string
;
phone
?:
string
;
role
:
Array
<
string
>
;
avatar
?:
string
;
storeUserId
?:
string
;
}
}
function
EmployeesManagePage
()
{
function
EmployeesManagePage
()
{
const
[
employeeList
,
setEmployeeList
]
=
useState
([
const
[
employeeList
,
setEmployeeList
]
=
useState
([]);
{
const
[
query
,
setQuery
]
=
useState
<
QueryType
>
({
nickName
:
"赵云"
,
phone
:
"18767118672"
,
role
:
"0"
,
storeUserId
:
"0"
},
{
nickName
:
"吕布"
,
phone
:
"18767118672"
,
role
:
"0"
,
storeUserId
:
"2"
}
]);
const
[
query
,
setQuery
]
=
useState
({
current
:
0
,
current
:
0
,
size
:
10
,
size
:
10
,
nickName
:
""
,
nickName
:
""
,
phone
:
""
,
phone
:
""
,
role
Id
:
[],
role
Codes
:
[],
storeId
:
User
.
getStoreId
(),
storeId
:
User
.
getStoreId
(),
});
});
const
[
valueLike
,
setValueLike
]
=
useState
();
const
[
total
,
setTotal
]
=
useState
(
0
);
const
[
total
,
setTotal
]
=
useState
(
0
);
const
[
model
,
setModel
]
=
useState
(
null
);
const
[
model
,
setModel
]
=
useState
<
React
.
ReactNode
>
(
null
);
const
[
isModalOpen
,
setIsModalOpen
]
=
useState
(
false
);
const
[
isModalOpen
,
setIsModalOpen
]
=
useState
(
false
);
const
[
isManager
,
setIsManager
]
=
useState
(
true
);
const
[
isManager
,
setIsManager
]
=
useState
(
true
);
const
[
isNormal
,
setIsNormal
]
=
useState
(
true
);
const
[
isNormal
,
setIsNormal
]
=
useState
(
true
);
const
[
choosedItem
,
setChooseItem
]
=
useState
({});
const
[
choosedItem
,
setChooseItem
]
=
useState
<
ChoosedItemType
>
({
const
[
roleIds
,
setRoleIds
]
=
useState
([]);
nickName
:
""
,
phone
:
""
,
role
:
[],
avatar
:
""
,
});
const
[
roleIds
,
setRoleIds
]
=
useState
<
Array
<
RoleItemType
>>
([]);
const
roleMap
=
{
CloudManager
:
"管理员"
,
CloudLecturer
:
"讲师"
,
};
const
storeId
=
User
.
getStoreId
();
useEffect
(()
=>
{
useEffect
(()
=>
{
getEmployeeList
();
getEmployeeList
();
getStoreRole
();
},
[
query
]);
},
[
query
]);
useEffect
(()
=>
{
getListInfo
();
},
[
storeId
]);
async
function
getListInfo
()
{
await
getStoreRole
();
await
getEmployeeList
();
}
function
getEmployeeList
()
{
function
getEmployeeList
()
{
let
_query
=
_
.
clone
(
query
);
let
_query
=
_
.
clone
(
query
);
_query
.
current
=
query
.
current
+
1
;
_query
.
current
=
query
.
current
+
1
;
...
@@ -75,10 +111,17 @@ function EmployeesManagePage() {
...
@@ -75,10 +111,17 @@ function EmployeesManagePage() {
}
}
function
getStoreRole
()
{
function
getStoreRole
()
{
const
storeId
=
User
.
getStoreId
();
StoreService
.
getStoreRole
({
storeId
}).
then
((
res
:
any
)
=>
{
const
data
=
[...
res
.
result
];
const
_query
=
{
...
query
};
const
_data
=
data
.
map
((
item
:
any
)
=>
{
item
.
isChecked
=
true
;
_query
.
roleCodes
.
push
(
item
.
roleCode
);
return
item
;
});
StoreService
.
getStoreRole
({
storeId
}).
then
((
res
:
any
)
=>
{
setQuery
(
_query
);
setRoleIds
(
res
.
result
);
setRoleIds
(
_data
);
});
});
}
}
...
@@ -107,22 +150,20 @@ function EmployeesManagePage() {
...
@@ -107,22 +150,20 @@ function EmployeesManagePage() {
title
:
"身份"
,
title
:
"身份"
,
dataIndex
:
"role"
,
dataIndex
:
"role"
,
key
:
"role"
,
key
:
"role"
,
render
:
(
val
:
string
,
record
:
RecordTypes
)
=>
{
render
:
(
val
:
string
)
=>
{
return
<
div
>
{
/* {storeRoleEnum[val]} */
}
</
div
>;
return
<
div
>
{
val
.
split
(
","
).
join
(
"、"
)
}
</
div
>;
},
},
},
},
{
{
title
:
"操作"
,
title
:
"操作"
,
dataIndex
:
"operation"
,
dataIndex
:
"operation"
,
render
:
(
val
:
string
,
record
:
RecordTypes
)
=>
{
render
:
(
val
:
string
,
record
:
RecordTypes
)
=>
{
return
record
.
role
===
""
||
record
.
role
===
"1"
?
(
return
record
.
role
===
"店铺管理员"
||
record
.
userId
===
User
.
getUserId
()
?
(
<
div
className=
"no-operate"
>
-
</
div
>
<
div
className=
"no-operate"
>
-
</
div
>
)
:
(
)
:
(
<
div
className=
"operation"
>
<
div
className=
"operation"
>
<
span
<
span
className=
"edit"
onClick=
{
()
=>
handleEditEmployee
(
record
)
}
>
className=
"edit"
onClick=
{
()
=>
handleEditEmployee
(
record
)
}
>
编辑
编辑
</
span
>
</
span
>
<
span
className=
"divider-line"
>
{
" | "
}
</
span
>
<
span
className=
"divider-line"
>
{
" | "
}
</
span
>
...
@@ -139,33 +180,48 @@ function EmployeesManagePage() {
...
@@ -139,33 +180,48 @@ function EmployeesManagePage() {
];
];
}
}
function
handleEditEmployee
(
record
:
object
)
{
function
handleEditEmployee
(
record
:
RecordTypes
)
{
setChooseItem
(
record
);
const
{
nickName
,
phone
,
roleCodes
,
avatar
}
=
record
;
setIsModalOpen
(
true
);
const
_choosesItem
=
{
nickName
:
nickName
,
phone
:
phone
,
role
:
roleCodes
,
avatar
:
avatar
,
};
setChooseItem
(
_choosesItem
);
const
model
:
React
.
ReactNode
=
<
EmployeeAddOrEditModal
isOpen=
{
true
}
choosedItem=
{
_choosesItem
}
onClose=
{
()
=>
{
setModel
(
null
);
getEmployeeList
();
}
}
/>
setModel
(
model
);
}
}
function
handleDeleteEmployeeConfirm
(
record
:
RecordTypes
)
{
function
handleDeleteEmployeeConfirm
(
record
:
RecordTypes
)
{
return
confirm
({
return
confirm
({
title
:
'你确定要删除此讲师吗?'
,
title
:
"你确定要删除此讲师吗?"
,
content
:
'删除后,讲师将不能登录系统,此操作不能被撤销'
,
content
:
"删除后,讲师将不能登录系统,此操作不能被撤销"
,
icon
:
<
QuestionCircleOutlined
/>,
icon
:
<
QuestionCircleOutlined
/>,
okText
:
'删除'
,
okText
:
"删除"
,
okType
:
'danger'
,
okType
:
"danger"
,
cancelText
:
'取消'
,
cancelText
:
"取消"
,
onOk
:
()
=>
{
onOk
:
()
=>
{
handleDeleteEmployee
(
record
.
storeUserI
d
);
handleDeleteEmployee
(
record
.
i
d
);
}
}
,
})
})
;
}
}
function
handleToAddEmployee
()
{
function
handleToAddEmployee
()
{
setIsModalOpen
(
true
);
setIsModalOpen
(
true
);
}
}
function
handleDeleteEmployee
(
storeUserId
:
string
)
{
function
handleDeleteEmployee
(
storeUserId
:
string
)
{
StoreService
.
deleteEmployee
(
storeUserId
).
then
((
res
:
any
)
=>
{
StoreService
.
deleteEmployee
(
{
storeUserId
}).
then
((
res
:
any
)
=>
{
message
.
success
(
"讲师已删除"
);
message
.
success
(
"讲师已删除"
);
getEmployeeList
();
});
});
}
}
...
@@ -190,7 +246,7 @@ function EmployeesManagePage() {
...
@@ -190,7 +246,7 @@ function EmployeesManagePage() {
}
}
}
}
>
>
<
div
style=
{
{
flex
:
1
}
}
>
<
div
style=
{
{
flex
:
1
}
}
>
搜索员工:
{
/*
搜索员工:
<Search
<Search
style={{
style={{
width: 300,
width: 300,
...
@@ -204,30 +260,68 @@ function EmployeesManagePage() {
...
@@ -204,30 +260,68 @@ function EmployeesManagePage() {
setQuery(_query);
setQuery(_query);
}}
}}
onSearch={() => getEmployeeList()}
onSearch={() => getEmployeeList()}
/> */
}
<
SearchBar
label=
"搜索用户"
placeholder=
"搜索用户姓名/手机号"
style=
{
{
width
:
300
,
marginRight
:
40
,
}
}
value=
{
valueLike
}
onSearch=
{
(
value
:
any
)
=>
{
const
_query
=
{
...
query
};
if
(
value
)
{
console
.
log
(
"value"
,
value
);
const
isPhone
=
(
value
||
""
).
match
(
/^
\d
+$/
);
const
nameLike
=
isPhone
?
"phone"
:
"nickName"
;
setValueLike
(
value
);
_query
[
nameLike
]
=
value
;
}
else
{
_query
.
nickName
=
""
;
_query
.
phone
=
""
;
}
setQuery
(
_query
);
}
}
/>
/>
</
div
>
</
div
>
<
div
style=
{
{
flex
:
1
}
}
>
<
div
style=
{
{
flex
:
1
}
}
>
身份:
身份:
{
_
.
map
(
roleIds
,((
item
:
any
)
=>
{
{
_
.
map
(
roleIds
,
(
item
:
any
)
=>
{
return
<
CheckBox
return
(
text=
{
item
.
name
}
<
CheckBox
name=
{
item
.
roleCode
}
text=
{
item
.
name
}
onChange=
{
(
e
:
any
)
=>
{
name=
{
item
.
roleCode
}
// const
{
checked
}
=
e
.
target
;
onChange=
{
(
e
:
any
)
=>
{
// setIsNormal(checked);
const
{
checked
,
name
}
=
e
.
target
;
// const _query =
{
...
query
};
const
_query
=
{
...
query
};
// if(checked)
{
_query
.
roleCodes
=
[];
// _query.roleId.push();
//
}
else
{
const
_roleIds
:
Array
<
RoleItemType
>
=
roleIds
.
map
(
// const index = _query.roleId.indexOf();
(
_item
:
RoleItemType
)
=>
{
// _query.roleId.slice(index,1);
if
(
name
===
_item
.
roleCode
)
{
//
}
if
(
checked
)
{
// setQuery(_query);
_item
.
isChecked
=
true
;
}
}
}
else
{
defaultChecked=
{
isNormal
}
_item
.
isChecked
=
false
;
/>
}
}))
}
}
if
(
_item
.
isChecked
)
{
_query
.
roleCodes
.
push
(
_item
.
roleCode
);
}
return
_item
;
}
);
setRoleIds
(
_roleIds
);
setQuery
(
_query
);
}
}
defaultChecked=
{
item
.
isChecked
}
/>
);
})
}
</
div
>
</
div
>
</
div
>
</
div
>
<
Button
<
Button
...
@@ -255,7 +349,7 @@ function EmployeesManagePage() {
...
@@ -255,7 +349,7 @@ function EmployeesManagePage() {
current=
{
query
.
current
}
current=
{
query
.
current
}
pageSize=
{
query
.
size
}
pageSize=
{
query
.
size
}
total=
{
total
}
total=
{
total
}
toPage=
{
(
page
)
=>
{
toPage=
{
(
page
:
any
)
=>
{
const
queryStates
=
_
.
clone
(
query
);
const
queryStates
=
_
.
clone
(
query
);
queryStates
.
current
=
page
;
queryStates
.
current
=
page
;
setQuery
(
queryStates
);
setQuery
(
queryStates
);
...
@@ -263,9 +357,16 @@ function EmployeesManagePage() {
...
@@ -263,9 +357,16 @@ function EmployeesManagePage() {
/>
/>
</
div
>
</
div
>
</
div
>
</
div
>
{
{
isModalOpen
&&
(
isModalOpen
&&
<
EmployeeAddOrEditModal
isOpen=
{
isModalOpen
}
choosedItem=
{
choosedItem
}
onClose=
{
()
=>
{
setIsModalOpen
(
false
)}
}
/>
<
EmployeeAddOrEditModal
}
isOpen=
{
isModalOpen
}
choosedItem=
{
choosedItem
}
onClose=
{
()
=>
{
setIsModalOpen
(
false
);
getEmployeeList
();
}
}
/>
)
}
{
model
}
{
model
}
</
div
>
</
div
>
</
div
>
</
div
>
...
...
src/modules/store-manege/UserManagePage.tsx
View file @
31522557
...
@@ -2,7 +2,7 @@
...
@@ -2,7 +2,7 @@
* @Author: wufan
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditors: wufan
* @LastEditTime: 2020-12-03 1
0:35:53
* @LastEditTime: 2020-12-03 1
1:37:42
* @Description: 用户管理页面
* @Description: 用户管理页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
*/
...
@@ -10,7 +10,7 @@
...
@@ -10,7 +10,7 @@
import
React
,
{
useEffect
,
useState
}
from
"react"
;
import
React
,
{
useEffect
,
useState
}
from
"react"
;
import
{
withRouter
}
from
"react-router-dom"
;
import
{
withRouter
}
from
"react-router-dom"
;
import
_
from
"underscore"
;
import
_
from
"underscore"
;
import
PageControl
from
"@/components/PageControl
"
;
import
{
PageControl
}
from
"@/components
"
;
import
{
Table
,
Modal
,
message
,
Row
,
Col
,
Input
,
DatePicker
}
from
"antd"
;
import
{
Table
,
Modal
,
message
,
Row
,
Col
,
Input
,
DatePicker
}
from
"antd"
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
StoreService
from
"@/domains/store-domain/storeService"
;
import
User
from
"@/common/js/user"
;
import
User
from
"@/common/js/user"
;
...
@@ -46,9 +46,9 @@ function UserManagePage() {
...
@@ -46,9 +46,9 @@ function UserManagePage() {
getUserList
();
getUserList
();
},
[
query
]);
},
[
query
]);
function
getUserList
(
current
=
0
)
{
function
getUserList
()
{
let
_query
=
_
.
clone
(
query
);
let
_query
=
_
.
clone
(
query
);
_query
.
current
=
current
+
1
;
_query
.
current
=
query
.
current
+
1
;
StoreService
.
getUserList
(
_query
).
then
((
res
:
any
)
=>
{
StoreService
.
getUserList
(
_query
).
then
((
res
:
any
)
=>
{
setUserList
(
res
.
result
.
records
);
setUserList
(
res
.
result
.
records
);
setTotal
(
res
.
result
.
total
);
setTotal
(
res
.
result
.
total
);
...
@@ -133,6 +133,7 @@ function UserManagePage() {
...
@@ -133,6 +133,7 @@ function UserManagePage() {
setQuery
(
_query
);
setQuery
(
_query
);
}
}
}
}
/>
/>
</
div
>
</
div
>
<
div
style=
{
{
flex
:
1
}
}
>
<
div
style=
{
{
flex
:
1
}
}
>
...
@@ -180,7 +181,7 @@ function UserManagePage() {
...
@@ -180,7 +181,7 @@ function UserManagePage() {
current=
{
query
.
current
}
current=
{
query
.
current
}
pageSize=
{
query
.
size
}
pageSize=
{
query
.
size
}
total=
{
total
}
total=
{
total
}
toPage=
{
(
page
)
=>
{
toPage=
{
(
page
:
any
)
=>
{
const
queryStates
=
_
.
clone
(
query
);
const
queryStates
=
_
.
clone
(
query
);
queryStates
.
current
=
page
;
queryStates
.
current
=
page
;
setQuery
(
queryStates
);
setQuery
(
queryStates
);
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment