Commit 31522557 by wufan

feat:员工管理联调

parent 268f5fd7

6.55 KB | W: | H:

6.53 KB | W: | H:

src/common/images/xiaomai-IMG.png
src/common/images/xiaomai-IMG.png
src/common/images/xiaomai-IMG.png
src/common/images/xiaomai-IMG.png
  • 2-up
  • Swipe
  • Onion skin
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-31 09:34:31 * @Date: 2020-08-31 09:34:31
* @LastEditors: zhangleyuan * @LastEditors: wufan
* @LastEditTime: 2020-12-03 10:19:49 * @LastEditTime: 2020-12-04 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=${USER_TYPE}&token=${User.getToken()}&storeUserId=${User.getStoreUserId()}&userId=${User.getUserId()}`; const _url = `${url}?storeId=${User.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({
......
...@@ -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;
......
...@@ -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-01 20:45:54 * @LastEditTime: 2020-12-04 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);
} }
...@@ -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-01 18:13:50 * @LastEditTime: 2020-12-04 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);
} }
......
/*
* @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);
......
...@@ -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-11-30 15:46:10 * @LastEditTime: 2020-12-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; nickName?: 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 [nickName, 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.nickName) {
console.log("props.choosedItem",props.choosedItem); console.log("props.choosedItem", props.choosedItem);
setName(props.choosedItem.name); setName(props.choosedItem.nickName);
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 });
setNameStatus("error"); setPhone(value);
return; return;
}
if(phone.trim().length !== 11){ case "role":
setPhoneErrorMessage("请输入11位手机号"); form.setFieldsValue({ role: value });
setNameStatus("error"); setRole(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.nickName ? "编辑员工" : "添加员工"}`}
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={{ name:"是电放费", phone: phone, role: role }} initialValues={{ nickName: nickName, phone: phone, role: role }}
onFinish={onFinish} onFinish={onFinish}
onFinishFailed={onFinishFailed} onFinishFailed={onFinishFailed}
> >
<Form.Item <Form.Item
label="员工姓名" label="员工姓名"
name="name" name="nickName"
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={nickName}
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 <InputNumber
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) => {
handleChangeRole(e.target.value); handleChangeValues("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>
......
...@@ -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: "",
roleId: [], roleCodes: [],
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.storeUserId); handleDeleteEmployee(record.id);
} },
}) });
} }
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>
......
...@@ -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 10:35:53 * @LastEditTime: 2020-12-03 11: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);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment