|
@ -22,7 +22,9 @@ export default function Header() { |
|
|
// const deviceState = useAppSelector(store => store.context.device);
|
|
|
// const deviceState = useAppSelector(store => store.context.device);
|
|
|
const userInfo = useAppSelector(store => store.context.user.loginUser); |
|
|
const userInfo = useAppSelector(store => store.context.user.loginUser); |
|
|
const [power, setPower] = useState(deviceInfo.power.toFixed())//deviceInfo.power.toFixed()
|
|
|
const [power, setPower] = useState(deviceInfo.power.toFixed())//deviceInfo.power.toFixed()
|
|
|
const [powerColor, setPowerColor] = useState('bluetooth-battery') |
|
|
|
|
|
|
|
|
const [powerStyle, setPowerStyle] = useState('bluetooth-battery') |
|
|
|
|
|
const [powerColor, setPowerColor] = useState('#ffffff') |
|
|
|
|
|
const [powerBackColor, setPowerBackColor] = useState('#ffffff') |
|
|
//获取当前websocet的状态
|
|
|
//获取当前websocet的状态
|
|
|
|
|
|
|
|
|
const showBlueImg = () => { |
|
|
const showBlueImg = () => { |
|
@ -64,17 +66,26 @@ export default function Header() { |
|
|
}, [userInfo.nickname, userInfo.account]); |
|
|
}, [userInfo.nickname, userInfo.account]); |
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
if(deviceInfo.power > 20){ |
|
|
|
|
|
setPowerColor('bluetooth-battery') |
|
|
|
|
|
|
|
|
let power = deviceInfo.power |
|
|
|
|
|
let flag = deviceInfo.flag |
|
|
|
|
|
if(power > 20){ |
|
|
|
|
|
setPowerStyle('bluetooth-battery') |
|
|
|
|
|
setPowerColor('#ffffff') |
|
|
|
|
|
setPowerBackColor('#3e63cb') |
|
|
} |
|
|
} |
|
|
if(deviceInfo.power <= 20){ |
|
|
|
|
|
setPowerColor('bluetooth-battery-red') |
|
|
|
|
|
|
|
|
if(power <= 20){ |
|
|
|
|
|
setPowerStyle('bluetooth-battery-red') |
|
|
|
|
|
setPowerColor('#red') |
|
|
|
|
|
setPowerBackColor('red') |
|
|
} |
|
|
} |
|
|
if(deviceInfo.flag === 1){ |
|
|
|
|
|
setPowerColor('bluetooth-battery-green') |
|
|
|
|
|
|
|
|
if(flag === 1){ |
|
|
|
|
|
setPowerStyle('bluetooth-battery-green') |
|
|
|
|
|
setPowerColor('#ffffff') |
|
|
|
|
|
setPowerBackColor('#52c41a') |
|
|
|
|
|
|
|
|
} |
|
|
} |
|
|
setPower(deviceInfo.power.toFixed()) |
|
|
|
|
|
}, [deviceInfo.power]) |
|
|
|
|
|
|
|
|
setPower(power.toFixed()) |
|
|
|
|
|
}, [deviceInfo.power, deviceInfo.flag]) |
|
|
|
|
|
|
|
|
//同步科天健基础数据
|
|
|
//同步科天健基础数据
|
|
|
const onSyncKTJData = () => { |
|
|
const onSyncKTJData = () => { |
|
@ -158,9 +169,9 @@ export default function Header() { |
|
|
<span className="w-[120px]">Y轴倾斜:{deviceInfo.inclinatorY}</span> |
|
|
<span className="w-[120px]">Y轴倾斜:{deviceInfo.inclinatorY}</span> |
|
|
</section> |
|
|
</section> |
|
|
<section className="bg-white rounded-md h-9 w-12 relative mr-3 flex justify-center items-center"> |
|
|
<section className="bg-white rounded-md h-9 w-12 relative mr-3 flex justify-center items-center"> |
|
|
<div className={`${powerColor} flex justify-center items-center`}> |
|
|
|
|
|
<div className="power-process text-center" style={{width: `${power}%`}}> |
|
|
|
|
|
<div style={{"position": "relative","top": "-1.6rem"}}>{power}</div> |
|
|
|
|
|
|
|
|
<div className={`${powerStyle} flex justify-center items-center`}> |
|
|
|
|
|
<div className="power-process text-center" style={{width: `${power}%`, background: powerBackColor }}> |
|
|
|
|
|
<div style={{"position": "relative","top": "-1.6rem", color: powerColor}}>{power}</div> |
|
|
</div> |
|
|
</div> |
|
|
{(deviceInfo.flag === 0 && Number(power) < 100) && |
|
|
{(deviceInfo.flag === 0 && Number(power) < 100) && |
|
|
<div className="power-charging"> |
|
|
<div className="power-charging"> |
|
|