Commit 259fd4a3 authored by maple's avatar maple

[new]保安详情接口

parent 81689003
......@@ -89,8 +89,13 @@ export default defineConfig({
name: 'serviceproviders',
routes: [
{ path: './', component: './UserManagement/ServiceProviderManagement/ServiceProviderManagement' },
{ path: './Detail', component: './UserManagement/ServiceProviderManagement/Detail' },
{ path: './Edit', component: './UserManagement/ServiceProviderManagement/Edit' },
{
path: './Detail',
routes: [
{ path: './', component: './UserManagement/ServiceProviderManagement/Detail'},
{ path: './Guard', component: './UserManagement/ServiceProviderManagement/Guard'}
]},
{ path: './Edit', component: './UserManagement/ServiceProviderManagement/Edit' },
{path:'./Services',component:'./UserManagement/ServiceProviderManagement/Services'},
]
},
......
import React from 'react';
import styles from './index.less';
import {Button } from 'antd';
const BackButton = () => {
const goToReturn = () => {
history.back()
}
return (
<>
<Button onClick={goToReturn}>Back</Button>
</>
);
};
export default BackButton;
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
}
\ No newline at end of file
......@@ -49,7 +49,7 @@ class ShowOptions extends React.Component {
selectoptionsAll:'所有',
selectoptionsSearchCell :'搜索小区',
selectoptionsAllCell:'全部小区',
componetVisible:'展开',
componetVisible:'收起',
})
}else{
this.setState({
......@@ -61,13 +61,13 @@ class ShowOptions extends React.Component {
selectoptionsAll:'All',
selectoptionsSearchCell :'Search cell',
selectoptionsAllCell:'All Cell',
componetVisible:'Open',
componetVisible:'Put It Away',
})
}
};
constructor(props) {
super(props);
const {list, dispatch } = this.props;
const {list, dispatch,defaultValue } = this.props;
if(list==null){
//console.error("组件错误:没有数据导入")
......@@ -142,7 +142,7 @@ class ShowOptions extends React.Component {
render() {
return (
<div style={{minWidth:800}}>
<div style={{minWidth:800,marginBottom:16}}>
{
this.state.componetVisible==this.state.selectoptionsOpen?
<div style={{width:"100%",height:48, position:"relative"}}>
......@@ -174,12 +174,14 @@ class ShowOptions extends React.Component {
<div style={{width:"100%",backgroundColor:"#ffffff",border:"1px solid #cfcfcf",padding:5}}>
<Input.Search placeholder={this.state.selectoptionsSearchCell} onSearch={this.getSearchValue.bind(this)} style={{width:200,margin:16}} />
<div><h1> </h1></div>
<div><h1> </h1></div>
<div style={{margin:16}}>
{(this.state.checkedList).map((tag, index) => {
return (
<Tag color="blue" key={"Tag_"+index}>{tag}</Tag>
);
})}
</div>
<div><h1> </h1></div>
</div>
</div>
......
import { Tag, Input, Tooltip } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import styles from './index.less';
class TagSelect extends React.Component {
state = {
tags: ['Unremovable', 'Tag 2', 'Tag 3'],
inputVisible: false,
inputValue: '',
editInputIndex: -1,
editInputValue: '',
};
handleClose = removedTag => {
const tags = this.state.tags.filter(tag => tag !== removedTag);
console.log(tags);
this.setState({ tags });
};
showInput = () => {
this.setState({ inputVisible: true }, () => this.input.focus());
};
handleInputChange = e => {
this.setState({ inputValue: e.target.value });
};
handleInputConfirm = () => {
const { inputValue } = this.state;
let { tags } = this.state;
if (inputValue && tags.indexOf(inputValue) === -1) {
tags = [...tags, inputValue];
}
console.log(tags);
this.setState({
tags,
inputVisible: false,
inputValue: '',
});
};
handleEditInputChange = e => {
this.setState({ editInputValue: e.target.value });
};
handleEditInputConfirm = () => {
this.setState(({ tags, editInputIndex, editInputValue }) => {
const newTags = [...tags];
newTags[editInputIndex] = editInputValue;
return {
tags: newTags,
editInputIndex: -1,
editInputValue: '',
};
});
};
saveInputRef = input => {
this.input = input;
};
saveEditInputRef = input => {
this.editInput = input;
};
render() {
const { tags, inputVisible, inputValue, editInputIndex, editInputValue } = this.state;
return (
<>
{tags.map((tag, index) => {
if (editInputIndex === index) {
return (
<Input
ref={this.saveEditInputRef}
key={tag}
size="small"
className={styles.tagInput}
value={editInputValue}
onChange={this.handleEditInputChange}
onBlur={this.handleEditInputConfirm}
onPressEnter={this.handleEditInputConfirm}
/>
);
}
const isLongTag = tag.length > 20;
const tagElem = (
<Tag
className="editTag"
key={tag}
closable={index !== 0}
onClose={() => this.handleClose(tag)}
>
<span
onDoubleClick={e => {
if (index !== 0) {
this.setState({ editInputIndex: index, editInputValue: tag }, () => {
this.editInput.focus();
});
e.preventDefault();
}
}}
>
{isLongTag ? `${tag.slice(0, 20)}...` : tag}
</span>
</Tag>
);
return isLongTag ? (
<Tooltip title={tag} key={tag}>
{tagElem}
</Tooltip>
) : (
tagElem
);
})}
{inputVisible && (
<Input
ref={this.saveInputRef}
type="text"
size="small"
className={styles.tagInput}
value={inputValue}
onChange={this.handleInputChange}
onBlur={this.handleInputConfirm}
onPressEnter={this.handleInputConfirm}
/>
)}
{!inputVisible && (
<Tag className={styles.siteTagPlus} onClick={this.showInput}>
<PlusOutlined /> New Services
</Tag>
)}
</>
);
}
}
export default TagSelect;
\ No newline at end of file
.siteTagPlus {
background: #fff;
border-style: dashed;
}
.editTag {
user-select: none;
}
.tagInput {
width: 78px;
margin-right: 8px;
// vertical-align: top;
}
\ No newline at end of file
import React from 'react';
import styles from './index.less';
import BackButton from '../BackButton/BackButton';
import TitleGet from '../TitleGet/TitleGet';
const TitleBack = (props:any) => {
return (
<>
<div className={styles.item0}><TitleGet title={props.title}/></div>
<div className={styles.item2}><BackButton/></div>
<div className={styles.clear0}></div>
</>
);
};
export default TitleBack;
//头部组件
.item0{
float: left;
}
.item2{
float: right;
}
.clear{
clear: both;
}
.clear0{
.clear();
margin-bottom: 35px;
}
import React from 'react';
import styles from './index.less';
const TitleGet = (props:any) => {
return (
<>
<div className={styles.item}>{props.title}</div>
</>
);
};
export default TitleGet;
// 线栏
.font{
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item{
.font();
text-indent: 15px;
}
\ No newline at end of file
......@@ -21,6 +21,9 @@ export default {
returnCurDataFollow(state, { CurDataFollow }) {
return { ...state, CurDataFollow };
},
returnCurDataFollowDetail(state, { CurDataFollowDetail }) {
return { ...state, CurDataFollowDetail };
},
},
effects: {
......@@ -71,7 +74,11 @@ export default {
let CurDataFollow = resp.data.rows;
yield put({ type: 'returnCurDataFollow', CurDataFollow, });
},
//获取服务商保安详情根据服务商名
*getSecurityGuarderById({ playload }, { call, put }) {
let CurDataFollowDetail = playload;
yield put({ type: 'returnCurDataFollowDetail', CurDataFollowDetail, });
},
},
};
......@@ -2,18 +2,21 @@ import React, { useState, useEffect } from 'react';
import styles from './Detail.less';
import { Input ,Button,Table,Space,Pagination,Tooltip, Checkbox } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import { Link, useIntl, connect, Dispatch,history } from 'umi';
import ShowOptions from '../../../components/ShowOptions/index';
import TitleBack from '../../../components/TitleBack/TitleBack';
const Detail = (props:any) => {
const { dispatch, Data, CurData,CurDataFollow,location } = props;
const getByProviderName = (values: any) => { dispatch({ type: 'ServiceProvider/getByProviderName', playload: values }) };
const getSecurityGuarder = (values: any) => { dispatch({ type: 'ServiceProvider/getSecurityGuarder', playload: values }) };
const getSecurityGuarderById = (values: any) => { dispatch({ type: 'ServiceProvider/getSecurityGuarderById', playload: values }) };
useEffect(() => {
getByProviderName(location.query)
......@@ -25,8 +28,10 @@ const Detail = (props:any) => {
console.log(CurDataFollow)
}, [CurData,CurDataFollow]);
const goToReturn = () => {
history.back()
const goToGuard = (values: any, e: any) => {
getSecurityGuarderById(values)
history.push(location.pathname +'/Guard?saferName='+values.saferName)
}
const pagination={defaultCurrent:1,total: 16}
......@@ -46,7 +51,7 @@ const Detail = (props:any) => {
{
title: "actions",
render: (text: any, record: any) => (
<Space size="middle"> <a>Detail</a></Space>
<Space size="middle"> <a onClick={goToGuard.bind(this,record)}>Detail</a></Space>
),
},
];
......@@ -54,11 +59,8 @@ const Detail = (props:any) => {
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Service Provider Details</div>
<button className={styles.item3} onClick={goToReturn}>返回</button>
</div>
<TitleBack title="Service Provider Details" />
<div className={styles.bigbox}>
<div className={styles.box0}>
......@@ -92,14 +94,13 @@ const Detail = (props:any) => {
<div className={styles.box6}>
<div className={styles.box1item1}>Service Community</div>
</div>
</div>
<ShowOptions list={['小区']} defaultValue={"Put It Away"} onSubmit={printContent} />
<div className={styles.box7}>
<div className={styles.box1item1}>Security Guard Account</div>
</div>
</div>
<ShowOptions list={['小区']} onSubmit={printContent} />
<Table rowKey={"id"} style={{ marginTop: 16 }} dataSource={CurDataFollow} columns={columns} pagination={pagination} />
<Button >Cancellation</Button>
......
......@@ -78,7 +78,7 @@ const Edit= (props:any) => {
<div className={styles.line}></div>
<Form.Item>
<Button type="primary" size="large" htmlType="submit">提交</Button>
<Button type="primary" htmlType="submit">Submit</Button>
</Form.Item>
</Form>
......
@import '~antd/lib/style/themes/default.less';
//基石
.base {
width: 100%;
background-color: #ffffff;
padding: 34px;
min-width: 1020px;
}
//头部组件
.item0{
float: left;
}
.item0_1{
float: left;
line-height: 32px;
margin-left: 38px;
}
.item1{
float: left;
width: 120px;
}
.item1_1{
float: left;
margin-left: 16px;
}
.item2{
float: right;
}
.clear{
clear: both;
}
.clear0{
.clear();
margin-bottom: 35px;
}
.clear1{
.clear();
margin-bottom: 16px;
}
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import styles from './Guard.less';
import { Input ,Menu,Table,Space,Pagination,Tooltip, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import Line from '../../../components/Line/Line';
import BackButton from '../../../components/BackButton/BackButton';
import TitleGet from '../../../components/TitleGet/TitleGet';
const Guard = (props:any) => {
const {CurDataFollowDetail} = props;
return (
<div className={styles.base}>
<div className={styles.item0}><TitleGet title={"Edit Security Guard Account"}/></div>
<div className={styles.item0_1}>Status:Normal</div>
<div className={styles.item0_1}>Registration Date:23-03-2020</div>
<div className={styles.item2}><BackButton/></div>
<div className={styles.clear0}></div>
<div className={styles.item1}>Company Name</div>
<div className={styles.item1_1} >{CurDataFollowDetail.companyName}</div>
<div className={styles.clear1}></div>
<div className={styles.item1} >Full Name</div>
<div className={styles.item1_1} >{CurDataFollowDetail.saferName}</div>
<div className={styles.clear1} ></div>
<div className={styles.item1} >Contact Details</div>
<div className={styles.item1_1} >{CurDataFollowDetail.saferPhone}</div>
<div className={styles.item1} style={{ marginLeft: 32,width:40}} >Email</div>
<div className={styles.item1_1} >{CurDataFollowDetail.saferEmail}</div>
<div className={styles.clear1}></div>
<Line />
<Button>Cancellation</Button>
</div>
);
};
function mapStateToProps(state:any) {
const {CurDataFollowDetail } = state.ServiceProvider;
return {
CurDataFollowDetail,
};
}
export default connect(mapStateToProps)(Guard);
......@@ -8,97 +8,34 @@
min-width: 1020px;
}
//头部组件
.box{
width: 100%;
height: 64px;
position: relative;
}
.item1{
position: absolute;
width: 400px;
text-align: center;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item3{
width:80px;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
}
.box1{
width: 780px;
position: relative;
margin-bottom: 28px;
}
.box1item1{
position: absolute;
line-height: 48px;
}
.box1item2{
padding-left: 167px;
}
.item2x0{
width: 120px;
height: 34px;
background-color: rgba(238,238,238,1);
border: 1px solid rgba(217,217,217,1);
.item0{
float: left;
text-align: center;
line-height: 34px;
margin: 10px;
}
.item2x1{
width: 120px;
height: 34px;
border: 1px solid rgba(217,217,217,1);
.item0_1{
float: left;
text-align: center;
line-height: 34px;
margin: 10px;
cursor: pointer;
line-height: 32px;
margin-left: 38px;
}
.item2x1:hover{
width: 120px;
height: 34px;
border: 1px solid rgba(24,144,255,1);
.item1{
float: left;
text-align: center;
line-height: 34px;
margin: 10px;
cursor: pointer;
}
.item2x3{
width: 120px;
height: 34px;
}
.item1_1{
float: left;
text-align: center;
line-height: 34px;
margin: 10px;
margin-left: 16px;
}
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
.item2{
float: right;
}
.clear{
clear: both;
}
.clear0{
.clear();
margin-bottom: 35px;
}
.clear1{
.clear();
margin-bottom: 16px;
}
\ No newline at end of file
......@@ -5,96 +5,30 @@ import { Input ,Button,Modal,Space,Pagination,Tooltip, Checkbox } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import {
PlusCircleOutlined,
} from '@ant-design/icons';
import {PlusCircleOutlined} from '@ant-design/icons';
import Line from '../../../components/Line/Line';
import BackButton from '../../../components/BackButton/BackButton';
import TitleGet from '../../../components/TitleGet/TitleGet';
import TagSelect from '../../../components/TagSelect/index';
const Services = () => {
const goToReturn = () => {
history.back()
}
const [state, setState] = useState(false)
const [state2,setState2] = useState(false)
const [currentvalue, setCurrentvalue] = useState('')
const [service,setServices]=useState(['Cleaning','Maintenance','Security Guard'])
const showModal = (value,e) => {
setState(true)
setCurrentvalue(value)
};
const handleOk = (e) => {
setState(false)
let serviceNew = service
Array.prototype.remove = function(val) {
var index = this.indexOf(val);
if (index > -1) {
this.splice(index, 1);
}
};
serviceNew.remove(currentvalue)
setServices(serviceNew)
};
const handleCancel = (e) => {
setState(false)
};
const addModal = (e) => {
setState2(true)
};
const handleOk2 =(e) => {
setState2(false);
let serviceNew = service
serviceNew.push(currentvalue)
setServices(serviceNew)
};
const handleCancel2 = (e) => {
setState2(false)
};
const changeCurentvalue = (e) => {
setCurrentvalue(e.target.value)
}
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Services Available Management</div>
<button className={styles.item3} onClick={goToReturn}>返回</button>
</div>
<div className={styles.box1}>
<div className={styles.box1item1}>Services Available</div>
<div className={styles.box1item2}>
{
service.map((item, index) => {
return (<div key={"service_"+index} className={styles.item2x1} onClick={showModal.bind(this,item)} >{item}</div>)
})
}
<div className={styles.item2x3}><PlusCircleOutlined style={{cursor: "pointer",fontSize:30}} onClick={addModal} /></div>
</div>
</div>
<div style={{ clear:"both"}}></div>
<div className={styles.line}></div>
<Button type="primary" size="large">提交</Button>
<div>
<Modal title="删除该选项" visible={state} onOk={handleOk} onCancel={handleCancel} cancelText="取消" okType="danger" okText="Yes">
<p>is delete service?</p>
</Modal>
<Modal title="新增该选项" visible={state2} onOk={handleOk2} onCancel={handleCancel2} cancelText="取消" okType="primary" okText="创建">
<Input style={{width:300}} onChange={changeCurentvalue} />
</Modal>
</div>
<div className={styles.item0}><TitleGet title={"Services Available Management"}/></div>
<div className={styles.item2}><BackButton/></div>
<div className={styles.clear0}></div>
<div className={styles.item1}>Available Services</div>
<div className={styles.item1_1} ><TagSelect /></div>
<div className={styles.clear1}></div>
<Line />
<Button type="primary" >Submit</Button>
</div>
);
};
......
CompanyName Sunshine Stab
FullName
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,Table,Space,Pagination,Tooltip, Button } from 'antd';
import { Link, useIntl, connect } from 'umi';
import { Link, useIntl, connect, Dispatch } from 'umi';
import { Button, } from 'antd';
import Line from '../../components/Line/Line';
import BackButton from '../../components/BackButton/BackButton';
import TitleGet from '../../components/TitleGet/TitleGet';
const Bom = (props: any) => {
const { dispatch, Data } = props;
const test = () => {
dispatch({
type: 'Bom/query',
});
}
const Guard = () => {
return (
<>
<Button onClick={test}>TEST</Button>
</>
<div className={styles.base}>
<div className={styles.item0}><TitleGet title={"Edit Security Guard Account"}/></div>
<div className={styles.item0_1}>Status:Normal</div>
<div className={styles.item0_1}>Registration Date:23-03-2020</div>
<div className={styles.item2}><BackButton/></div>
<div className={styles.clear0}></div>
<div className={styles.item1}>Company Name</div>
<div className={styles.item1_1} >123</div>
<div className={styles.clear1}></div>
<div className={styles.item1} >Full Name</div>
<div className={styles.item1_1} >123</div>
<div className={styles.clear1} ></div>
<div className={styles.item1} >Contact Details</div>
<div className={styles.item1_1} >12312</div>
<div className={styles.item1} style={{ marginLeft: 32,width:40}} >Email</div>
<div className={styles.item1_1} >123123213</div>
<div className={styles.clear1}></div>
<Line />
<Button>Cancellation</Button>
</div>
);
};
function mapStateToProps(state:any) {
const { Data } = state.Bom;
return {
Data
};
}
export default connect(mapStateToProps)(Bom);
export default Guard;
......@@ -9,269 +9,34 @@
}
//头部组件
.box{
width: 100%;
height: 64px;
position: relative;
}
.item1{
position: absolute;
width: 180px;
text-align: center;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item3{
width:80px;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
}
.box1{
width: 100%;
height: 34px;
position: relative;
margin-bottom: 28px;
}
.box1item1{
position: absolute;
}
.box1item2{
position: absolute;
left: 139px;
}
.box2{
width: 100%;
height: 34px;
position: relative;
margin-bottom: 28px;
}
.box2item1{
position: absolute;
}
.box2item2{
position: absolute;
left: 139px;
}
.box2item3{
position: absolute;
left: 407px;
}
.box2item4{
position: absolute;
left: 565px;
}
.box2item5{
position: absolute;
left: 713px;
}
.box2item6{
position: absolute;
left: 778px;
}
.box3{
position: relative;
margin-bottom: 28px;
}
.box3item1{
position: absolute;
}
.box3item2{
padding-left: 160px;
}
.box3group1{
width: 266px;
height: 100px;
}
.box4{
position: relative;
}
.box4item1{
position: absolute;
}
.box4item2{
padding-left: 160px;
}
.ulist{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
.llist{
display:inline;
}
.alist{
float:left;
width: 160px;
}
.alist1{
position: relative;
width: 100px;
height: 100px;
}
.alist2{
.item0{
float: left;
width: 326px;
margin-bottom: 20px;
z-index: 1;
}
.alist2box{
width: 100%;
height: 100%;
position: relative;
}
.alist2boxitem1{
position: absolute;
top: -100px;
left: 127px;
}
.alist2boxitem2{
position: absolute;
top: -100px;
left: 180px;
}
.alist2boxitem3{
position: absolute;
top: -40px;
left: 216px;
}
.alist2boxNone{
color: #ffffff;
moz-user-select: -moz-none;
-moz-user-select: none;
-o-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}
.alist3{
z-index: 10;
cursor: pointer;
.item0_1{
float: left;
width: 100px;
height: 100px;
background-color: rgba(244,244,244,1);
}
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
}
.box5{
position: relative;
width: 100%;
height: 34px;
margin-bottom: 28px;
}
.box5item1{
position: absolute;
}
.box5item2{
position: absolute;
left: 186px;
line-height: 32px;
margin-left: 38px;
}
.box6{
position: relative;
line-height: 34px;
width: 100%;
height: 34px;
margin-bottom: 32px;
}
.box6item1{
position: absolute;
}
.box6item2{
position: absolute;
left: 186px;
}
.box6item3{
position: absolute;
left: 276px;
}
.box6item4{
position: absolute;
left: 478px;
}
.box6item5{
position: absolute;
left: 569px;
}
.box6item6{
position: absolute;
left: 794px;
}
.box6item7{
position: absolute;
left: 885px;
}
.box7{
position: relative;
width: 100%;
height: 34px;
margin-bottom: 28px;
.item1{
float: left;
width: 120px;
}
.box7item1{
position: absolute;
left: 186px;
.item1_1{
float: left;
margin-left: 16px;
}
.box7item2{
position: absolute;
left: 323px;
.item2{
float: right;
}
.box8{
position: relative;
width: 100%;
height: 34px;
}
.box8item1{
position: absolute;
}
.box8item2{
position: absolute;
left: 346px;
.clear{
clear: both;
}
.box8item3{
position: absolute;
left: 462px;
color: rgba(217,217,217,1);
.clear0{
.clear();
margin-bottom: 35px;
}
.box8item4{
position: absolute;
left: 502px;
.clear1{
.clear();
margin-bottom: 16px;
}
\ No newline at end of file
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