diff --git a/src/App.js b/src/App.js index e4b4c84..487f6a0 100644 --- a/src/App.js +++ b/src/App.js @@ -22,6 +22,8 @@ import DialogContent from "@mui/material/DialogContent"; import DialogTitle from "@mui/material/DialogTitle"; import Checkbox from "@mui/material/Checkbox"; import FormControlLabel from "@mui/material/FormControlLabel"; +import queryString from "query-string"; + class App extends React.Component { constructor() { super(); @@ -36,6 +38,7 @@ class App extends React.Component { loading: false, loginOpen: false, loginErrorMessage: "", + hideLogo: false, loginForm: { account: "", password: "", @@ -46,6 +49,9 @@ class App extends React.Component { componentDidMount() { const loginInfo = getLoginInfo(); var tenant = utils.getTenant(); + const hideLogo = queryString.parseUrl(window.location.href)?.query + ?.hideLogo; + this.setState({ hideLogo: !!hideLogo }); if (loginInfo && loginInfo.permissionPages.includes(tenant)) { this.fetchData(); this.refreshQrCode(); @@ -183,6 +189,7 @@ class App extends React.Component { loading, loginOpen, loginForm, + hideLogo, } = this.state; return ( @@ -246,6 +253,7 @@ class App extends React.Component { projects={projects} device={device} loading={loading} + hideLogo={hideLogo} onProjectSelect={(project) => { this.setSelectedProject(project); }} @@ -256,7 +264,7 @@ class App extends React.Component { display: "flex", flex: 1, alignItems: "center", - backgroundImage: `url('${waterMarkPng}')`, + backgroundImage: hideLogo ? "" : `url(${waterMarkPng})`, backgroundPositionX: "right", backgroundPositionY: "bottom", backgroundRepeat: "no-repeat", diff --git a/src/Components/pane/index.js b/src/Components/pane/index.js index d4129c5..e208294 100644 --- a/src/Components/pane/index.js +++ b/src/Components/pane/index.js @@ -1,64 +1,64 @@ -import './index.css'; -import Select from '@mui/material/Select'; -import MenuItem from '@mui/material/MenuItem' -import { useEffect, useState } from 'react'; -import { CircularProgress, List, ListItem } from '@mui/material'; -import ipadPng from '../../images/ipad.png' -import iphonePng from '../../images/iphone.png' -import androidPng from '../../images/android.png' -import logoPanePng from '../../images/logo-pane.png' -import horizentalChecked from '../../images/horizental-button-checked.png' -import horizentalButton from '../../images/horizental-button.png' -import verticalChecked from '../../images/vertical-button-checked.png' -import verticalButton from '../../images/vertical-button.png' -import modeSelectPng from '../../images/mode-select.png' +import "./index.css"; +import Select from "@mui/material/Select"; +import MenuItem from "@mui/material/MenuItem"; +import { useEffect, useState } from "react"; +import { CircularProgress, List, ListItem } from "@mui/material"; +import ipadPng from "../../images/ipad.png"; +import iphonePng from "../../images/iphone.png"; +import androidPng from "../../images/android.png"; +import logoPanePng from "../../images/logo-pane.png"; +import horizentalChecked from "../../images/horizental-button-checked.png"; +import horizentalButton from "../../images/horizental-button.png"; +import verticalChecked from "../../images/vertical-button-checked.png"; +import verticalButton from "../../images/vertical-button.png"; +import modeSelectPng from "../../images/mode-select.png"; var deviceConfigs = [ { - name: 'iPhone', + name: "iPhone", icon: iphonePng, - vertical: 'iphone-v', - horizental: 'iphone-h' + vertical: "iphone-v", + horizental: "iphone-h", }, { - name: 'Android Phone', + name: "Android Phone", icon: androidPng, - vertical: 'android-v', - horizental: 'android-h' + vertical: "android-v", + horizental: "android-h", }, { - name: 'iPad', + name: "iPad", icon: ipadPng, - vertical: 'ipad-v', - horizental: 'ipad-h' + vertical: "ipad-v", + horizental: "ipad-h", }, ]; function Pane(props) { var [mode, setMode] = useState(props.mode); - var [device, setDevice] = useState(props.device) - var [project, setProject] = useState(props.project) - + var [device, setDevice] = useState(props.device); + var [project, setProject] = useState(props.project); + var modeChange = (e) => { var _mode = e.target.value; setMode(_mode); - props.onModeChange(e.target.value) + props.onModeChange(e.target.value); }; var deviceChange = (_device) => { setDevice(_device); - props.onDeviceChange(_device) + props.onDeviceChange(_device); }; var projectSelect = (e) => { - var projectName = e.target.value - setProject(projectName) - props.onProjectSelect(projectName) - } + var projectName = e.target.value; + setProject(projectName); + props.onProjectSelect(projectName); + }; useEffect(() => { props.projects.length && !project && setProject(props.projects[0]); - }, [props.projects]) + }, [props.projects]); return (
{_device.name}
+{_device.name}
-