forked from community/device-mgt-core
parent
1e1d2acd01
commit
276414aa24
After Width: | Height: | Size: 2.7 MiB |
After Width: | Height: | Size: 17 KiB |
After Width: | Height: | Size: 804 KiB |
After Width: | Height: | Size: 798 KiB |
After Width: | Height: | Size: 794 KiB |
@ -1,74 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
|
|
||||||
*
|
|
||||||
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
|
|
||||||
* Version 2.0 (the "License"); you may not use this file except
|
|
||||||
* in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React from 'react';
|
|
||||||
import { Form, Row, Col, Card, Steps } from 'antd';
|
|
||||||
import { withConfigContext } from '../../context/ConfigContext';
|
|
||||||
import DeviceType from './DeviceType';
|
|
||||||
import EnrollAgent from './EnrollAgent';
|
|
||||||
const { Step } = Steps;
|
|
||||||
|
|
||||||
class AddDevice extends React.Component {
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.config = this.props.context;
|
|
||||||
this.state = {
|
|
||||||
isAddDeviceModalVisible: false,
|
|
||||||
current: 0,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
onClickType = () => {
|
|
||||||
this.setState({
|
|
||||||
current: 1,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { current } = this.state;
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<Row>
|
|
||||||
<Col span={16} offset={4}>
|
|
||||||
<Steps style={{ minHeight: 32 }} current={current}>
|
|
||||||
<Step key="DeviceType" title="Device Type" />
|
|
||||||
<Step key="EnrollAgent" title="Enroll Agent" />
|
|
||||||
<Step key="Result" title="Result" />
|
|
||||||
</Steps>
|
|
||||||
</Col>
|
|
||||||
<Col span={16} offset={4}>
|
|
||||||
<Card style={{ marginTop: 24 }}>
|
|
||||||
<div style={{ display: current === 0 ? 'unset' : 'none' }}>
|
|
||||||
<DeviceType onClickType={this.onClickType} />
|
|
||||||
</div>
|
|
||||||
<div style={{ display: current === 1 ? 'unset' : 'none' }}>
|
|
||||||
<EnrollAgent />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style={{ display: current === 2 ? 'unset' : 'none' }}></div>
|
|
||||||
</Card>
|
|
||||||
</Col>
|
|
||||||
</Row>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default withConfigContext(
|
|
||||||
Form.create({ name: 'add-device' })(AddDevice),
|
|
||||||
);
|
|
@ -0,0 +1,128 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
import { Form, Row, Col, Card, Steps } from 'antd';
|
||||||
|
import { withConfigContext } from '../../../context/ConfigContext';
|
||||||
|
import DeviceType from '../DeviceType';
|
||||||
|
import SelectEnrollmentType from './SelectEnrollmentType';
|
||||||
|
import EnrollDevice from './EnrollDevice';
|
||||||
|
import DownloadAgent from './DownloadAgent';
|
||||||
|
const { Step } = Steps;
|
||||||
|
|
||||||
|
class AddDevice extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.config = this.props.context;
|
||||||
|
this.state = {
|
||||||
|
isAddDeviceModalVisible: false,
|
||||||
|
current: 0,
|
||||||
|
deviceType: 'android',
|
||||||
|
enrollmentType: 'qr',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
getDeviceType = deviceType => {
|
||||||
|
this.setState({
|
||||||
|
current: 1,
|
||||||
|
deviceType: deviceType,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
goNext = () => {
|
||||||
|
this.setState({
|
||||||
|
current: 2,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
goBackToDeviceType = () => {
|
||||||
|
this.setState({
|
||||||
|
current: 0,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
goBackToDownloadAgent = () => {
|
||||||
|
this.setState({
|
||||||
|
current: 1,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
goBackToEnrollmentType = () => {
|
||||||
|
this.setState({
|
||||||
|
current: 2,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
getEnrollmentData = enrollmentType => {
|
||||||
|
this.setState({
|
||||||
|
current: 3,
|
||||||
|
enrollmentType: enrollmentType,
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { current, deviceType, enrollmentType } = this.state;
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Row>
|
||||||
|
<Col span={16} offset={4}>
|
||||||
|
<Steps style={{ minHeight: 32 }} current={current}>
|
||||||
|
<Step key="DeviceType" title="Select Device Type" />
|
||||||
|
<Step key="DownloadAgent" title="Download Agent" />
|
||||||
|
<Step key="EnrollmentType" title="Enrollment Type" />
|
||||||
|
<Step key="EnrollDevice" title="Enroll Device" />
|
||||||
|
</Steps>
|
||||||
|
</Col>
|
||||||
|
<Col span={16} offset={4}>
|
||||||
|
<Card style={{ marginTop: 24 }}>
|
||||||
|
<div style={{ display: current === 0 ? 'unset' : 'none' }}>
|
||||||
|
<DeviceType getDeviceType={this.getDeviceType} />
|
||||||
|
</div>
|
||||||
|
<div style={{ display: current === 1 ? 'unset' : 'none' }}>
|
||||||
|
<DownloadAgent
|
||||||
|
deviceType={deviceType}
|
||||||
|
goNext={this.goNext}
|
||||||
|
goBack={this.goBackToDeviceType}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div style={{ display: current === 2 ? 'unset' : 'none' }}>
|
||||||
|
<SelectEnrollmentType
|
||||||
|
deviceType={deviceType}
|
||||||
|
getEnrollmentData={this.getEnrollmentData}
|
||||||
|
goBack={this.goBackToDownloadAgent}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{ display: current === 3 ? 'unset' : 'none' }}>
|
||||||
|
<EnrollDevice
|
||||||
|
deviceType={deviceType}
|
||||||
|
enrollmentType={enrollmentType}
|
||||||
|
goBack={this.goBackToEnrollmentType}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withConfigContext(
|
||||||
|
Form.create({ name: 'add-device' })(AddDevice),
|
||||||
|
);
|
@ -0,0 +1,173 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
import { Button, Card, Divider, message, notification } from 'antd';
|
||||||
|
import TimeAgo from 'javascript-time-ago/modules/JavascriptTimeAgo';
|
||||||
|
import en from 'javascript-time-ago/locale/en';
|
||||||
|
import axios from 'axios';
|
||||||
|
import { withConfigContext } from '../../../context/ConfigContext';
|
||||||
|
import QRCode from 'qrcode.react';
|
||||||
|
|
||||||
|
class SelectEnrollmentType extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.config = this.props.context;
|
||||||
|
TimeAgo.addLocale(en);
|
||||||
|
this.state = {
|
||||||
|
pagination: {},
|
||||||
|
loading: false,
|
||||||
|
selectedRows: [],
|
||||||
|
buttonTitle: 'Download Agent',
|
||||||
|
skipButtonTitle: 'Skip',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
onClickSkip = () => {
|
||||||
|
this.props.goNext();
|
||||||
|
};
|
||||||
|
|
||||||
|
onClickGoBack = () => {
|
||||||
|
this.props.goBack();
|
||||||
|
};
|
||||||
|
|
||||||
|
onClickDownloadAgent = () => {
|
||||||
|
this.downloadAgent();
|
||||||
|
};
|
||||||
|
|
||||||
|
// fetch data from api
|
||||||
|
downloadAgent = () => {
|
||||||
|
const { deviceType } = this.props;
|
||||||
|
this.setState({ loading: true, buttonTitle: 'Downloading..' });
|
||||||
|
|
||||||
|
const apiUrl =
|
||||||
|
window.location.origin +
|
||||||
|
'/api/application-mgt/v1.0/artifact/' +
|
||||||
|
deviceType +
|
||||||
|
'/agent/-1234';
|
||||||
|
|
||||||
|
// send request to the invokerss
|
||||||
|
axios
|
||||||
|
.get(apiUrl)
|
||||||
|
.then(res => {
|
||||||
|
if (res.status === 200) {
|
||||||
|
// Download file in same window
|
||||||
|
const url = window.URL.createObjectURL(new Blob([res.data]));
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = url;
|
||||||
|
link.setAttribute('download', 'android-agent.apk'); // or any other extension
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
this.setState({
|
||||||
|
loading: false,
|
||||||
|
buttonTitle: 'Download Agent',
|
||||||
|
skipButtonTitle: 'Next',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
if (error.hasOwnProperty('response') && error.response.status === 401) {
|
||||||
|
// todo display a popop with error
|
||||||
|
message.error('You are not logged in');
|
||||||
|
window.location.href = window.location.origin + '/entgra/login';
|
||||||
|
} else {
|
||||||
|
notification.error({
|
||||||
|
message: 'There was a problem',
|
||||||
|
duration: 0,
|
||||||
|
description:
|
||||||
|
'Error occurred while trying to download Entgra Android Agent',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setState({ loading: false });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { loading, buttonTitle, skipButtonTitle } = this.state;
|
||||||
|
const { deviceType } = this.props;
|
||||||
|
|
||||||
|
const apiUrl =
|
||||||
|
window.location.origin +
|
||||||
|
'/api/application-mgt/v1.0/artifact/' +
|
||||||
|
deviceType +
|
||||||
|
'/agent/-1234';
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Divider orientation="left">Step 01 - Get your Android Agent.</Divider>
|
||||||
|
<div>
|
||||||
|
<p>
|
||||||
|
The Android agent can be downloaded by using following QR. The
|
||||||
|
generated QR code can be scanned, and the agent APK downloaded from
|
||||||
|
the link, and transferred to the device and then installed.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div style={{ margin: '30px', textAlign: 'center' }}>
|
||||||
|
<Divider>Scan to get the Android Agent.</Divider>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
marginBottm: 10,
|
||||||
|
display: 'inline-block',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Card hoverable>
|
||||||
|
<QRCode size={200} value={apiUrl} />
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
<Divider>OR</Divider>
|
||||||
|
<div style={{ textAlign: 'center', marginTop: 10, marginBottom: 10 }}>
|
||||||
|
<Button
|
||||||
|
type="primary"
|
||||||
|
size={'default'}
|
||||||
|
onClick={this.onClickDownloadAgent}
|
||||||
|
loading={loading}
|
||||||
|
>
|
||||||
|
{buttonTitle}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
<p>
|
||||||
|
Need help? Read
|
||||||
|
<a
|
||||||
|
href={
|
||||||
|
'https://entgra-documentation.gitlab.io/v3.8.0/docs/guide-to-work-with-the-product/' +
|
||||||
|
'enrollment-guide/enroll-android/'
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Entgra IoT Server documentation.
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div style={{ textAlign: 'right' }}>
|
||||||
|
<Button type="primary" size={'default'} onClick={this.onClickSkip}>
|
||||||
|
{skipButtonTitle}
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
style={{ marginLeft: 10 }}
|
||||||
|
type="default"
|
||||||
|
size={'default'}
|
||||||
|
onClick={this.onClickGoBack}
|
||||||
|
>
|
||||||
|
Back
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withConfigContext(SelectEnrollmentType);
|
@ -0,0 +1,217 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
import {
|
||||||
|
Divider,
|
||||||
|
message,
|
||||||
|
notification,
|
||||||
|
Select,
|
||||||
|
Card,
|
||||||
|
Spin,
|
||||||
|
Button,
|
||||||
|
Row,
|
||||||
|
Col,
|
||||||
|
} from 'antd';
|
||||||
|
import TimeAgo from 'javascript-time-ago/modules/JavascriptTimeAgo';
|
||||||
|
import en from 'javascript-time-ago/locale/en';
|
||||||
|
import { withConfigContext } from '../../../context/ConfigContext';
|
||||||
|
import axios from 'axios';
|
||||||
|
import QRCode from 'qrcode.react';
|
||||||
|
import QRPlaceholder from '../../../../public/images/qr-code.png';
|
||||||
|
import installAgent from '../../../../public/images/install_agent.png';
|
||||||
|
import register from '../../../../public/images/register.png';
|
||||||
|
import registration from '../../../../public/images/registration.png';
|
||||||
|
import setProfile from '../../../../public/images/set_profile.png';
|
||||||
|
|
||||||
|
const { Option } = Select;
|
||||||
|
|
||||||
|
class EnrollDevice extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.config = this.props.context;
|
||||||
|
TimeAgo.addLocale(en);
|
||||||
|
this.state = {
|
||||||
|
isSelected: false,
|
||||||
|
loading: false,
|
||||||
|
payload: {},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// fetch data from api
|
||||||
|
generateQRCode = ownershipType => {
|
||||||
|
const { deviceType } = this.props;
|
||||||
|
this.setState({ loading: true });
|
||||||
|
|
||||||
|
let apiUrl =
|
||||||
|
window.location.origin +
|
||||||
|
this.config.serverConfig.invoker.uri +
|
||||||
|
'/device-mgt/' +
|
||||||
|
deviceType +
|
||||||
|
'/v1.0/configuration/enrollment-qr-config/' +
|
||||||
|
ownershipType;
|
||||||
|
|
||||||
|
// send request to the invokerss
|
||||||
|
axios
|
||||||
|
.get(apiUrl)
|
||||||
|
.then(res => {
|
||||||
|
if (res.status === 200) {
|
||||||
|
this.setState({
|
||||||
|
loading: false,
|
||||||
|
payload: res.data.data,
|
||||||
|
isSelected: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
if (error.hasOwnProperty('response') && error.response.status === 401) {
|
||||||
|
// todo display a popop with error
|
||||||
|
message.error('You are not logged in');
|
||||||
|
window.location.href = window.location.origin + '/entgra/login';
|
||||||
|
} else {
|
||||||
|
notification.error({
|
||||||
|
message: 'There was a problem',
|
||||||
|
duration: 0,
|
||||||
|
description: 'Error occurred while trying to get QR code payload.',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setState({ loading: false });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
onChange = value => {
|
||||||
|
this.generateQRCode(value);
|
||||||
|
};
|
||||||
|
|
||||||
|
onClick = () => {
|
||||||
|
this.props.goBack();
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { payload, isSelected, loading } = this.state;
|
||||||
|
const { enrollmentType } = this.props;
|
||||||
|
return (
|
||||||
|
<div style={{ textAlign: 'center', fontSize: 12 }}>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: enrollmentType === 'manual' ? 'inline-block' : 'none',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Row gutter={[16, 16]}>
|
||||||
|
<Col span={6}>
|
||||||
|
<h1>Step 1</h1>
|
||||||
|
<p>
|
||||||
|
{/* eslint-disable-next-line react/no-unescaped-entities */}
|
||||||
|
Let's start by installing the Android agent on your device. Open
|
||||||
|
the downloaded file, and tap INSTALL.
|
||||||
|
</p>
|
||||||
|
<img src={installAgent} />
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<h1>Step 2</h1>
|
||||||
|
<p>Tap Skip to proceed with the default enrollment process.</p>
|
||||||
|
<img src={setProfile} />
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<h1>Step 3</h1>
|
||||||
|
<p>
|
||||||
|
Enter the server address based on your environment, in the text
|
||||||
|
box provided.
|
||||||
|
</p>
|
||||||
|
<img src={registration} />
|
||||||
|
</Col>
|
||||||
|
<Col span={6}>
|
||||||
|
<h1>Step 4</h1>
|
||||||
|
<p>Enter your:</p>
|
||||||
|
<div>
|
||||||
|
<p>Organization: carbon.super</p>
|
||||||
|
<p>Username: admin</p>
|
||||||
|
<p>Password: Your password</p>
|
||||||
|
</div>
|
||||||
|
<img src={register} />
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: enrollmentType === 'qr' ? 'inline-block' : 'none',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Divider>Generate QR code to QR based Provisioning.</Divider>
|
||||||
|
<div style={{ textAlign: 'center' }}>
|
||||||
|
<div style={{ marginBottom: 10 }}>
|
||||||
|
<Select
|
||||||
|
showSearch
|
||||||
|
style={{ width: 200, textAlign: 'center' }}
|
||||||
|
placeholder="Select device ownership"
|
||||||
|
optionFilterProp="children"
|
||||||
|
onChange={this.onChange}
|
||||||
|
filterOption={(input, option) =>
|
||||||
|
option.props.children
|
||||||
|
.toLowerCase()
|
||||||
|
.indexOf(input.toLowerCase()) >= 0
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Option key={'byod'} value={'BYOD'}>
|
||||||
|
{'BYOD'}
|
||||||
|
</Option>
|
||||||
|
<Option key={'cope'} value={'COPE'}>
|
||||||
|
{'COPE'}
|
||||||
|
</Option>
|
||||||
|
<Option key={'COSU'} value={'COSU'}>
|
||||||
|
{'COSU (KIOSK)'}
|
||||||
|
</Option>
|
||||||
|
<Option key={'WORK PROFILE'} value={'WORK_PROFILE'}>
|
||||||
|
{'WORK PROFILE'}
|
||||||
|
</Option>
|
||||||
|
<Option key={'GOOGLE_ENTERPRISE'} value={'GOOGLE_ENTERPRISE'}>
|
||||||
|
{'GOOGLE_WORK_PROFILE'}
|
||||||
|
</Option>
|
||||||
|
</Select>
|
||||||
|
</div>
|
||||||
|
<Spin spinning={loading}>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: isSelected ? 'inline-block' : 'none',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Card hoverable>
|
||||||
|
<QRCode size={300} value={JSON.stringify(payload)} />
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
<div style={{ display: !isSelected ? 'inline-block' : 'none' }}>
|
||||||
|
<Card hoverable>
|
||||||
|
<img src={QRPlaceholder} />
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
</Spin>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style={{ textAlign: 'right', marginTop: 10 }}>
|
||||||
|
<Button type="default" size={'default'} onClick={this.onClick}>
|
||||||
|
Back
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withConfigContext(EnrollDevice);
|
Loading…
Reference in new issue