github/h5-Dooring
1
0
Fork 0
mirror of https://github.com/MrXujiang/h5-Dooring.git synced 2026-01-18 19:48:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #59 from MrXujiang/yehuozhiliwork

Browse Source 
feat; customer draggable
This commit is contained in:
yehuozhili 2020-10-15 23:44:54 +08:00 committed by GitHub
commit 9e88c86710
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 26 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/layouts/index.tsx
View File

@ -3,7 +3,7 @@ import { library, generateRespones, RenderList, useRegister } from 'chatbot-antd
import { IRouteComponentProps } from 'umi'; import { IRouteComponentProps } from 'umi';
import { Button } from 'antd'; import { Button } from 'antd';
import { CustomerServiceOutlined } from '@ant-design/icons'; import { CustomerServiceOutlined } from '@ant-design/icons';
import { stat } from 'fs/promises'; import Draggable, { DraggableData, DraggableEvent } from 'react-draggable';
library.push( library.push(
//语料库，push进去，也可以不用 //语料库，push进去，也可以不用
@ -65,13 +65,17 @@ export default function Layout({ children }: IRouteComponentProps) {
<div> <div>
<div> <div>
&nbsp;&nbsp;1.{' '} &nbsp;&nbsp;1.{' '}
<a href="https://github.com/MrXujiang/h5-Dooring" target="_blank"> <a href="https://github.com/MrXujiang/h5-Dooring" target="_blank" rel="noreferrer">
H5-Dooring源码地址 H5-Dooring源码地址
</a> </a>
</div> </div>
<div> <div>
&nbsp;&nbsp;2.{' '} &nbsp;&nbsp;2.{' '}
<a href="https://github.com/MrXujiang/h5-Dooring/graphs/contributors" target="_blank"> <a
href="https://github.com/MrXujiang/h5-Dooring/graphs/contributors"
target="_blank"
rel="noreferrer"
>
贡献者列表 贡献者列表
</a> </a>
</div> </div>
@ -84,6 +88,7 @@ export default function Layout({ children }: IRouteComponentProps) {
); );
const [state, setState] = useState<dooringContextType>('h5'); const [state, setState] = useState<dooringContextType>('h5');
const [pos, setPos] = useState({ x: 0, y: 0 });
return ( return (
<dooringContext.Provider <dooringContext.Provider
value={{ value={{
@ -92,19 +97,26 @@ export default function Layout({ children }: IRouteComponentProps) {
}} }}
> >
<div style={{ height: '100%', width: '100%', overflow: 'hidden' }}> <div style={{ height: '100%', width: '100%', overflow: 'hidden' }}>
<div <Draggable
style={{ position={pos}
position: 'fixed', onStop={(e: DraggableEvent, data: DraggableData) => {
right: `${modalOpen ? '-100%' : '10px'}`, setPos({ x: data.x, y: data.y });
bottom: '80px',
transition: 'all 0.5s ease-in-out',
zIndex: 2,
}} }}
> >
<Button type="primary" onClick={() => setModalOpen(!modalOpen)}> <div
<CustomerServiceOutlined></CustomerServiceOutlined> style={{
</Button> position: 'fixed',
</div> right: `${modalOpen ? '-100%' : '10px'}`,
bottom: '80px',
transition: 'all 0.5s ease-in-out',
zIndex: 2,
}}
>
<Button type="primary" onClick={() => setModalOpen(!modalOpen)}>
<CustomerServiceOutlined></CustomerServiceOutlined>
</Button>
</div>
</Draggable>
{render} {render}
{children} {children}
</div> </div>