update
This commit is contained in:
ylj20011123
parent
fb799f5313
commit
1871dcfd0b
@ -6,7 +6,7 @@ import { Card, Col, Form, Row, Tree, message, Switch, Button, TreeSelect, Radio,
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { history } from "umi";
|
||||
|
||||
import type { ProFormInstance } from "@ant-design/pro-form";
|
||||
import type { FormInstance, ProFormInstance } from "@ant-design/pro-form";
|
||||
import type { UserModel } from "../data";
|
||||
import type { CurrentUser } from '@/models/user';
|
||||
|
||||
@ -16,6 +16,9 @@ import { getRoleList, getSystemMenuTree, handleAnalysisPermission, handleSupplie
|
||||
import BusinessManDrawer from "@/pages/basicManage/businessMan/components/businessManDrawer";
|
||||
import session from "@/utils/session";
|
||||
import moment from 'moment'
|
||||
import close from '@/assets/ai/close.png'
|
||||
import searchIcon from '@/assets/ai/searchIcon.png'
|
||||
import './style.less'
|
||||
|
||||
// 提交账号数据
|
||||
const handleAddUpdate = async (item: UserModel, type: boolean) => {
|
||||
@ -57,6 +60,7 @@ const handelResetPassWord = async (item: any) => {
|
||||
*/
|
||||
const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab, pageType, BUSINESSMAN_ID, onShow }: { onShow?: boolean, BUSINESSMAN_ID?: any, pageType?: string, selectTab?: any, tableTab?: any, openType?: string, detail?: UserModel, reloadTable: any, currentUser: CurrentUser | undefined }) => {
|
||||
const detailForm = useRef<ProFormInstance>() // 表单对象
|
||||
const searchTreeRef = useRef<FormInstance>();
|
||||
const [checkedRole, setCheckedRole] = useState<React.Key[]>(); // 当前选中的行 角色 id
|
||||
const [checkedServerpart, setCheckedServerpart] = useState<React.Key[]>(); // 当前选中的行 服务区id
|
||||
const [checkedShop, setCheckedShop] = useState<React.Key[]>(); // 当前选中的行 服务区门店id
|
||||
@ -80,6 +84,12 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
const [checkManageerCenterList, setCheckManageerCenterList] = useState<any>()
|
||||
// 当前这个用户实际的管理中心权限
|
||||
const [currentUserInfoManager, setCurrentUserInfoManager] = useState<any>()
|
||||
// 显示服务区树搜索框
|
||||
const [showServiceSearchBox, setShowServiceSearchBox] = useState<boolean>(false)
|
||||
// 显示的管理中心数据
|
||||
const [wareHouseList, setWareHouseList] = useState<any>()
|
||||
// 全部的管理中心数据
|
||||
const [allWareHouseList, setAllWareHouseList] = useState<any>()
|
||||
|
||||
// const { data: roleTree } = useRequest(async () => {
|
||||
// if (currentUser?.UserPattern===9000){
|
||||
@ -132,10 +142,10 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
return data.map(n => n.children ? n : { ...n, children: [] })
|
||||
})
|
||||
// 查询可配置的管理中心
|
||||
const { data: wareHouseList } = useRequest(async () => {
|
||||
const { data: wareHouseListData } = useRequest(async () => {
|
||||
let req: any = {
|
||||
SearchParameter: {
|
||||
// PROVINCE_CODE: detail?.USER_PROVINCE || "",
|
||||
PROVINCE_CODES: detail?.USER_PROVINCE || "",
|
||||
WAREHOUSE_STATE: 1
|
||||
},
|
||||
SortStr: "SELLER_ID,WAREHOUSE_TYPE,WAREHOUSE_ID",
|
||||
@ -143,7 +153,8 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
PageSize: 999999
|
||||
}
|
||||
const data = await handleGetWareHouseList(req)
|
||||
console.log('wareHouseListwareHouseList', data);
|
||||
setWareHouseList(data)
|
||||
setAllWareHouseList(data)
|
||||
return data
|
||||
})
|
||||
|
||||
@ -156,8 +167,6 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
// 查询可选商家
|
||||
const { run: handleGetMerchantTree, data: merchantTree } = useRequest(async () => {
|
||||
const data = await getMerchantTreeNosessoin()
|
||||
console.log('3213123123213123213123', data);
|
||||
|
||||
return data
|
||||
}, { manual: true })
|
||||
|
||||
@ -320,9 +329,27 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
WAREHOUSE_ID: checkManageerCenterList.toString()
|
||||
}
|
||||
const data = await handleSynchroRTSELLERPASSPORT(req)
|
||||
console.log('data321wfDSFSDFSFS', data);
|
||||
}
|
||||
|
||||
// 管理中心权限
|
||||
const handleFilterManagerList = (values: any) => {
|
||||
console.log('values', values);
|
||||
console.log('allWareHouseListallWareHouseList', allWareHouseList);
|
||||
let list: any = JSON.parse(JSON.stringify(allWareHouseList))
|
||||
if (list && list.length > 0) {
|
||||
if (values) {
|
||||
let res: any = []
|
||||
list.forEach((item: any) => {
|
||||
if (item.WAREHOUSE_NAME.includes(values)) {
|
||||
res.push(item)
|
||||
}
|
||||
})
|
||||
setWareHouseList(res)
|
||||
} else {
|
||||
setWareHouseList(allWareHouseList)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 判断账号的正则
|
||||
// 1表示全数字 0 表示 默认
|
||||
@ -441,6 +468,8 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
console.log('list', list);
|
||||
|
||||
setCheckManageerCenterList(list)
|
||||
} else {
|
||||
setCheckManageerCenterList([])
|
||||
}
|
||||
|
||||
// 请求获取该账户绑定的角色拥有的模块权限
|
||||
@ -1258,7 +1287,7 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
|
||||
{
|
||||
initialDetail.USER_PATTERN === 1000 || initialDetail.USER_PATTERN === 4000 ?
|
||||
<Card title="授权管理中心" style={{ marginTop: 24 }} bordered={false} size="default">
|
||||
<Card className="managerCardBox" title="授权管理中心" style={{ marginTop: 24 }} bordered={false} size="default">
|
||||
<Row gutter={24}>
|
||||
<Col span={8}>
|
||||
{
|
||||
@ -1267,10 +1296,51 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
style={{ borderColor: "#97D6FE", height: 424 }}
|
||||
size="small"
|
||||
title="管理中心权限" headStyle={{ backgroundColor: '#E7F7FF' }}
|
||||
extra={<a onClick={() => {
|
||||
setCheckManageerCenterList([])
|
||||
extra={<div className="managerCardTopBox">
|
||||
<img style={{ width: '20px', height: '20px', cursor: 'pointer', marginLeft: '5px' }} src={searchIcon} onClick={() => {
|
||||
setShowServiceSearchBox(true)
|
||||
}} />
|
||||
<div className="fixedBox" style={{ display: showServiceSearchBox ? 'flex' : 'none' }}>
|
||||
<ProForm
|
||||
formRef={searchTreeRef}
|
||||
layout={'horizontal'}
|
||||
submitter={{
|
||||
render: () => {
|
||||
return []
|
||||
}
|
||||
}}
|
||||
isKeyPressSubmit
|
||||
onFinish={(values: any) => {
|
||||
return handleFilterManagerList(values?.searchValue || '')
|
||||
}}
|
||||
>
|
||||
<Row>
|
||||
<Col span={15} className={'noBottom'}>
|
||||
<ProFormText
|
||||
name={'searchValue'}
|
||||
fieldProps={{
|
||||
placeholder: '请输入管理中心名称'
|
||||
}}
|
||||
allowClear
|
||||
/>
|
||||
</Col>
|
||||
<Col span={2}></Col>
|
||||
<Col span={5}>
|
||||
<Button type={'primary'} onClick={() => {
|
||||
searchTreeRef.current?.submit()
|
||||
}}>查询</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
}}>取消选择</a>}>
|
||||
</ProForm>
|
||||
<img style={{ width: '20px', height: '20px', cursor: 'pointer', marginLeft: '5px' }} src={close} onClick={() => {
|
||||
setShowServiceSearchBox(false)
|
||||
}} />
|
||||
</div>
|
||||
<a onClick={() => {
|
||||
setCheckManageerCenterList([])
|
||||
}}>取消选择</a>
|
||||
</div>}>
|
||||
<Form.Item name="ServerpartList" style={{ marginBottom: 0 }}>
|
||||
<Tree
|
||||
checkedKeys={checkManageerCenterList}
|
||||
@ -1283,7 +1353,21 @@ const Edit = ({ tableTab, openType, detail, reloadTable, currentUser, selectTab,
|
||||
key: 'WAREHOUSE_ID'
|
||||
}}
|
||||
onCheck={(checkedKeys: React.Key[] | any) => {
|
||||
// 若showServiceSearchBox 是true 那么就是搜索模式 就是加入新选的内容
|
||||
// 若 为false 那么就是正常的 就是根据 选择的
|
||||
if (showServiceSearchBox) {
|
||||
let list: any = JSON.parse(JSON.stringify(checkManageerCenterList))
|
||||
if (checkedKeys && checkedKeys.length > 0) {
|
||||
checkedKeys.forEach((item: any) => {
|
||||
if (list.indexOf(item) === -1) {
|
||||
list.push(item)
|
||||
}
|
||||
})
|
||||
}
|
||||
setCheckManageerCenterList(list)
|
||||
} else {
|
||||
setCheckManageerCenterList(checkedKeys)
|
||||
}
|
||||
return checkedKeys
|
||||
}}
|
||||
></Tree>
|
||||
|
||||
32
src/pages/Setting/Users/components/style.less
Normal file
32
src/pages/Setting/Users/components/style.less
Normal file
@ -0,0 +1,32 @@
|
||||
.managerCardBox {
|
||||
.managerCardTopBox {
|
||||
position: relative;
|
||||
|
||||
.searchIcon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.fixedBox {
|
||||
position: absolute;
|
||||
width: 300px;
|
||||
background: #fff;
|
||||
right: -10px;
|
||||
box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
box-sizing: border-box;
|
||||
padding: 12px;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.noBottom {
|
||||
.ant-form-item {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -13,7 +13,7 @@ import ProTable from "@ant-design/pro-table";
|
||||
import useRequest from "@ahooksjs/use-request";
|
||||
import { getFieldEnum, getFieldEnumTree, getServerpartOption, getServerpartTree } from "@/services/options";
|
||||
import { MenuFoldOutlined, PlusOutlined } from "@ant-design/icons";
|
||||
import { ModalForm, ProFormDatePicker, ProFormSelect, ProFormText } from "@ant-design/pro-form";
|
||||
import ProForm, { ModalForm, ProFormDatePicker, ProFormSelect, ProFormText } from "@ant-design/pro-form";
|
||||
import { PageContainer } from "@ant-design/pro-layout";
|
||||
import { Button, Tree, Col, Row, Drawer, message, Popconfirm, Space, Menu, Avatar, Form, TreeSelect, Modal } from "antd";
|
||||
import type { ProDescriptionsItemProps } from "@ant-design/pro-descriptions";
|
||||
@ -36,12 +36,14 @@ import LogTable from "./component/logTable";
|
||||
import Draggable from "react-draggable";
|
||||
import React from "react";
|
||||
import BusinessInforForm from "./component/businessInforForm";
|
||||
import LeftSelectTree from "@/pages/reports/settlementAccount/component/leftSelectTree";
|
||||
|
||||
|
||||
// 服务区门店组件主体
|
||||
const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUser }) => {
|
||||
const actionRef = useRef<ActionType>()
|
||||
const formRef = useRef<FormInstance>()
|
||||
const updateShopStateModalFormRef = useRef<FormInstance>()
|
||||
const BusinessInforFormRef = useRef<any>()
|
||||
const ShopOperateRef = useRef<any>()
|
||||
const formDetailRef = useRef<any>()
|
||||
@ -49,14 +51,21 @@ const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUs
|
||||
const [showDetail, setShowDetail] = useState<boolean>()
|
||||
const [currenMenu, setCurrenMenu] = useState<any>(); // 当前选中的左侧菜单
|
||||
const [modalVisible, handleModalVisible] = useState<boolean>()
|
||||
const [serverpartId, setServerpartId] = useState<string>()
|
||||
// const [serverpartId, setServerpartId] = useState<[]>([])
|
||||
const [serverpartId, setServerpartId] = useState<any>()
|
||||
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||||
// 同步门店状态的悬浮框
|
||||
const [updateShopStateModal, setUpdateShopStateModal] = useState<boolean>(false)
|
||||
// 添加经营信息的悬浮框
|
||||
const [showAddBusinessModal, setShowAddBusinessModal] = useState<boolean>(false)
|
||||
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
|
||||
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
||||
const draggleRef = React.createRef<any>()
|
||||
// 选择的服务区
|
||||
const [selectServerPartList, setSelectServerPartList] = useState<any>()
|
||||
// 门店更新状态的loading
|
||||
const [updateShopStateLoading, setUpdateShopStateLoading] = useState<boolean>()
|
||||
|
||||
const businessStateList = session.get('businessStateList')
|
||||
const onDraggaleStart = (event, uiData) => {
|
||||
const { clientWidth, clientHeight } = window.document.documentElement;
|
||||
const targetRect = draggleRef.current?.getBoundingClientRect();
|
||||
@ -83,6 +92,7 @@ const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUs
|
||||
})
|
||||
const ServerpartIdsList = session.get('ServerpartIdsList')
|
||||
|
||||
|
||||
const columns: ProColumns<ServerpartShopModel>[] = [
|
||||
{
|
||||
dataIndex: 'SHOPNAME',
|
||||
@ -268,57 +278,52 @@ const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUs
|
||||
})
|
||||
}
|
||||
|
||||
// 同步门店经营状态
|
||||
const handleUpdateShopState = async (value: any) => {
|
||||
setUpdateShopStateLoading(true)
|
||||
setUpdateShopStateLoading(false)
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<PageContainer header={{
|
||||
title: '',
|
||||
breadcrumb: {},
|
||||
<div>
|
||||
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||||
<LeftSelectTree setSelectedId={setServerpartId} setCollapsible={setCollapsible} collapsible={collapsible} />
|
||||
<div style={{
|
||||
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||||
paddingTop: 0,
|
||||
paddingBottom: 0,
|
||||
paddingRight: 0
|
||||
}}>
|
||||
<ProCard split="vertical" style={{ height: 'calc(100vh - 127px)', overflowY: 'scroll', backgroundColor: '#fff' }}>
|
||||
<ProCard
|
||||
className="pageTable-leftnav"
|
||||
bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20 }}
|
||||
extra={<MenuFoldOutlined onClick={() => { setCollapsible(!collapsible) }} />}
|
||||
colSpan={!collapsible ? "240px" : "60px"}
|
||||
title={!collapsible ? "请选择服务区" : ""}
|
||||
headerBordered
|
||||
collapsed={collapsible}
|
||||
>
|
||||
<Tree
|
||||
checkable
|
||||
treeData={!severpartLoading ? severpartTree : []}
|
||||
fieldNames={{
|
||||
title: "label",
|
||||
// value: "value",
|
||||
key: "key"
|
||||
}}
|
||||
blockNode
|
||||
// onSelect={onSelect}
|
||||
onCheck={(checkedKeys: React.Key[] | any, info) => {
|
||||
const serverparts = info.checkedNodes.filter(n => n?.type === 1)
|
||||
setServerpartId(serverparts.map(n => n?.value)?.toString() || '')
|
||||
actionRef?.current?.reload()
|
||||
}}
|
||||
// switcherIcon={<PlusOutlined />}
|
||||
>
|
||||
</Tree>
|
||||
</ProCard>
|
||||
<ProCard bodyStyle={{ paddingTop: 0, paddingBottom: 0, paddingRight: 0 }}>
|
||||
<ProTable<ServerpartShopModel>
|
||||
<ProTable
|
||||
rowKey="SERVERPARTSHOP_ID"
|
||||
headerTitle="门店列表"
|
||||
request={async (params) => {
|
||||
if (serverpartId && serverpartId.length > 0) {
|
||||
const data = await getList({ ...params, SERVERPART_IDS: serverpartId })
|
||||
const data = await getList({
|
||||
...params,
|
||||
SERVERPART_IDS: serverpartId,
|
||||
current: 1,
|
||||
pageSize: 999999
|
||||
})
|
||||
return data
|
||||
}
|
||||
return { data: [], success: true }
|
||||
}}
|
||||
scroll={{ x: "100%", y: "calc(100vh - 450px)" }}
|
||||
actionRef={actionRef}
|
||||
search={{ span: 6 }}
|
||||
columns={columns}
|
||||
bordered
|
||||
toolbar={{
|
||||
actions: [
|
||||
<Button type="primary" onClick={() => {
|
||||
if (selectServerPartList && selectServerPartList.length > 0) {
|
||||
setUpdateShopStateModal(true)
|
||||
} else {
|
||||
message.error('请先选择门店！')
|
||||
}
|
||||
}}>批量更新</Button>,
|
||||
<Button
|
||||
key="new"
|
||||
icon={<PlusOutlined />}
|
||||
@ -326,14 +331,72 @@ const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUs
|
||||
onClick={() => {
|
||||
handleModalVisible(true)
|
||||
}}
|
||||
>门店</Button>,
|
||||
>门店</Button>
|
||||
]
|
||||
}}
|
||||
options={false}
|
||||
pagination={{ defaultPageSize: 10, showSizeChanger: false }}
|
||||
rowSelection={{
|
||||
type: 'checkbox',
|
||||
selectedRowKeys: selectServerPartList,
|
||||
preserveSelectedRowKeys: true,
|
||||
onChange: (selectedRowKeys: any, selectedRows: any) => {
|
||||
console.log('selectedRowKeys', selectedRowKeys);
|
||||
setSelectServerPartList(selectedRowKeys)
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</ProCard>
|
||||
</ProCard>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 同步门店状态的悬浮框 */}
|
||||
<Modal
|
||||
title="批量同步门店状态"
|
||||
width={800}
|
||||
bodyStyle={{ padding: 16 }}
|
||||
open={updateShopStateModal}
|
||||
destroyOnClose={true}
|
||||
onCancel={() => {
|
||||
setUpdateShopStateModal(false)
|
||||
}}
|
||||
confirmLoading={updateShopStateLoading}
|
||||
onOk={() => {
|
||||
updateShopStateModalFormRef.current?.validateFields().then((res: any) => {
|
||||
handleUpdateShopState(res)
|
||||
})
|
||||
}}
|
||||
modalRender={(modal) => {
|
||||
return <Draggable
|
||||
disabled={disabled}
|
||||
bounds={bounds}
|
||||
onStart={(event, uiData) => onDraggaleStart(event, uiData)}
|
||||
>
|
||||
<div ref={draggleRef}>{modal}</div>
|
||||
</Draggable>
|
||||
}}
|
||||
>
|
||||
<ProForm
|
||||
formRef={updateShopStateModalFormRef}
|
||||
submitter={false}
|
||||
>
|
||||
<Row gutter={8}>
|
||||
<Col span={8}>
|
||||
<ProFormSelect
|
||||
label={"经营状态"}
|
||||
name={"BUSINESS_STATE"}
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: '请选择经营状态'
|
||||
}
|
||||
]}
|
||||
fieldProps={{
|
||||
options: businessStateList
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
</ProForm>
|
||||
</Modal>
|
||||
|
||||
<Drawer
|
||||
width={'80%'}
|
||||
@ -410,7 +473,7 @@ const ServerpartShopTable: React.FC<{ currentUser: CurrentUser }> = ({ currentUs
|
||||
>
|
||||
<BusinessInforForm onRef={BusinessInforFormRef} currentRow={currentRow} />
|
||||
</Modal>
|
||||
</PageContainer >
|
||||
</div >
|
||||
);
|
||||
}
|
||||
export default connect(({ user }: ConnectState) => ({
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user