fix: img bg prohibit drag
parent
133e6ca036
commit
a6196e8f7d
|
@ -12,18 +12,21 @@ import React, { useEffect, useState } from "react";
|
||||||
import { BaseUrl } from "../../constants";
|
import { BaseUrl } from "../../constants";
|
||||||
import { Alert, Snackbar } from "@mui/material";
|
import { Alert, Snackbar } from "@mui/material";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
|
import zIndex from "@mui/material/styles/zIndex";
|
||||||
|
|
||||||
var configMap = {
|
var configMap = {
|
||||||
"android-h": {
|
"android-h": {
|
||||||
bkg: androidVPng,
|
bkg: androidVPng,
|
||||||
rotate: true,
|
rotate: true,
|
||||||
width: "666px",
|
width: "666px",
|
||||||
height: "321px"
|
height: "321px",
|
||||||
|
offsetv: "4px",
|
||||||
},
|
},
|
||||||
"android-v": {
|
"android-v": {
|
||||||
bkg: androidVPng,
|
bkg: androidVPng,
|
||||||
width: "323px",
|
width: "321px",
|
||||||
height: "666px",
|
height: "666px",
|
||||||
|
offsetv: "5px",
|
||||||
},
|
},
|
||||||
"iphone-h": {
|
"iphone-h": {
|
||||||
bkg: iphoneVPng,
|
bkg: iphoneVPng,
|
||||||
|
@ -37,15 +40,16 @@ var configMap = {
|
||||||
height: "693px",
|
height: "693px",
|
||||||
},
|
},
|
||||||
"ipad-h": {
|
"ipad-h": {
|
||||||
bkg: ipadVPng,
|
bkg: ipadHPng,
|
||||||
rotate: true,
|
width: "433px",
|
||||||
width: "460px",
|
height: "326px",
|
||||||
height: "320px",
|
offsetv: "5px",
|
||||||
},
|
},
|
||||||
"ipad-v": {
|
"ipad-v": {
|
||||||
bkg: ipadVPng,
|
bkg: ipadVPng,
|
||||||
width: "320px",
|
width: "324px",
|
||||||
height: "460px",
|
height: "433px",
|
||||||
|
offsetv: "5px",
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -74,14 +78,14 @@ function DeviceFrame(props) {
|
||||||
<img src={refreshButtonPng} alt="refresh" onClick={() => refresh()} className="refreshButton" />
|
<img src={refreshButtonPng} alt="refresh" onClick={() => refresh()} className="refreshButton" />
|
||||||
{props.qrDataUrl && (
|
{props.qrDataUrl && (
|
||||||
<div className="qrCode">
|
<div className="qrCode">
|
||||||
<img src={props.qrDataUrl} alt="qr code" style={{marginBottom: '6px'}} />
|
<img src={props.qrDataUrl} alt="qr code" />
|
||||||
<p style={{ margin: "0", }}>
|
<p style={{ margin: "0", }}>
|
||||||
{t("scan")}
|
{t("scan")}
|
||||||
<CopyToClipboard text={absoluteUrl} onCopy={() => setOpenPopup(true)}>
|
<CopyToClipboard text={absoluteUrl} onCopy={() => setOpenPopup(true)}>
|
||||||
<img style={{ cursor: "pointer", width: "20px", height: "20px", marginLeft: "9px" }} src={copyPng} alt="复制链接" />
|
<img style={{ cursor: "pointer", width: "20px", height: "20px" }} src={copyPng} alt="复制链接" />
|
||||||
</CopyToClipboard>
|
</CopyToClipboard>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<Snackbar
|
<Snackbar
|
||||||
|
@ -97,7 +101,7 @@ function DeviceFrame(props) {
|
||||||
</Alert>
|
</Alert>
|
||||||
</Snackbar>
|
</Snackbar>
|
||||||
<div>
|
<div>
|
||||||
<img src={config.bkg} alt="background" style={{position: "relative" , zIndex: 100, transform: config.rotate ? "rotate(-90deg)" : "" }} />
|
<img src={config.bkg} alt="background" style={{ position: "relative", zIndex: 100, transform: config.rotate ? "rotate(-90deg)" : "", pointerEvents: 'none' }} />
|
||||||
{props.htmlUrl && (
|
{props.htmlUrl && (
|
||||||
<iframe
|
<iframe
|
||||||
id="deviceFrame"
|
id="deviceFrame"
|
||||||
|
|
Loading…
Reference in New Issue