free-sun
/
FS-IOT
15
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

头部敬语和摄像头页面设备状态查询添加

release_0.0.2
wenlele 3 years ago
parent
a7d98ddcfc
commit
26aa1c6ae8
8 changed files with 113 additions and 95 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 150
      code/VideoAccess-VCMP/web/client/src/layout/components/header/index.jsx
  2. 26
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx
  3. 5
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx
  4. 3
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/fluoriteCamera.jsx
  5. 3
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/ipcCamera.jsx
  6. 10
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx
  7. 2
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx
  8. 9
      code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx

150
code/VideoAccess-VCMP/web/client/src/layout/components/header/index.jsx
View File

@ -4,84 +4,92 @@ import { connect } from "react-redux";
import { Nav, Avatar, Dropdown } from "@douyinfe/semi-ui"; import { Nav, Avatar, Dropdown } from "@douyinfe/semi-ui";
const Header = (props) => { const Header = (props) => {
const { dispatch, history, user, actions, socket } = props; const { dispatch, history, user, actions, socket } = props;
return ( return (
<> <>
<Nav <Nav
mode={"horizontal"} mode={"horizontal"}
onClick={({ itemKey }) => { onClick={({ itemKey }) => {
if (itemKey == "logout") { if (itemKey == "logout") {
dispatch(actions.auth.logout(user)); dispatch(actions.auth.logout(user));
const iotAuth = document.getElementById('iotAuth').contentWindow; const iotAuth = document.getElementById('iotAuth').contentWindow;
iotAuth.postMessage({ action: 'logout' }, '*'); iotAuth.postMessage({ action: 'logout' }, '*');
if (socket) { if (socket) {
socket.disconnect(); socket.disconnect();
} }
history.push(`/signin`); history.push(`/signin`);
} }
}} }}
style={{ style={{
height: 60, height: 60,
minWidth: 520, minWidth: 520,
background: "url(/assets/images/background/header.png)", background: "url(/assets/images/background/header.png)",
backgroundSize: "100% 100%", backgroundSize: "100% 100%",
color: "white", color: "white",
}} }}
header={{ header={{
logo: ( logo: (
<img
src="/assets/images/background/logo.png"
style={{ display: "inline-block", width: 280, height: 52 }}
/>
),
text: "",
}}
footer={
<Nav.Sub
itemKey={"user"}
text={
<div
style={{
marginLeft: 20,
display: "inline-block",
color: "white",
}}
>
<img <img
src="/assets/images/background/notice.png" src="/assets/images/background/logo.png"
style={{ style={{ display: "inline-block", width: 280, height: 52 }}
display: "inline-block",
width: 18,
height: 18,
position: "relative",
top: 6,
left: -10,
}}
/> />
),
text: "",
}}
footer={
<Nav.Sub
itemKey={"user"}
text={
<div
style={{
marginLeft: 20,
display: "inline-block",
color: "white",
}}
>
<img
src="/assets/images/background/notice.png"
style={{
display: "inline-block",
width: 18,
height: 18,
position: "relative",
top: 6,
left: -10,
}}
/>
<Avatar size="small" color="light-blue" style={{ margin: 4 }}> <Avatar size="small" color="light-blue" style={{marginRight:4}}>
<img src="/assets/images/avatar/6.png" /> <img src="/assets/images/avatar/6.png" />
</Avatar> </Avatar>
{user && user.displayName} <div style={{
</div> display: "inline-block", position: "relative",
} top: 10,
> left: 4,
<Nav.Item itemKey={"logout"} text={"退出"} /> marginRight: 4,
</Nav.Sub> }}>
} <div>你好！</div>
/> <div>{user && user.displayName}</div>
</> </div>
); </div>
}
>
<Nav.Item itemKey={"logout"} text={"退出"} />
</Nav.Sub>
}
/>
</>
);
}; };
function mapStateToProps (state) { function mapStateToProps (state) {
const { global, auth, webSocket } = state; const { global, auth, webSocket } = state;
return { return {
actions: global.actions, actions: global.actions,
user: auth.user, user: auth.user,
socket: webSocket.socket, socket: webSocket.socket,
}; };
} }
export default connect(mapStateToProps)(Header); export default connect(mapStateToProps)(Header);

26
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cameraModal.jsx
View File

@ -32,7 +32,7 @@ function cameraModal (props) {
const cascadeRef = useRef(); const cascadeRef = useRef();
const nvrRef = useRef(); const nvrRef = useRef();
const [isloading, setloading] = useState(false); //是否显示loading const [isloading, setloading] = useState(false); //是否显示loading
const [loadingTip, setloadingTip] = useState("测试进行中..."); //loading tip的值 const [loadingTip, setloadingTip] = useState("测试中..."); //loading tip的值
const [okText, setokText] = useState("确定"); //ok弹框text 右边 const [okText, setokText] = useState("确定"); //ok弹框text 右边
const [cancelText, setcancelText] = useState("取消"); //取消弹框text 左边 const [cancelText, setcancelText] = useState("取消"); //取消弹框text 左边
@ -239,18 +239,18 @@ function cameraModal (props) {
var duration = moment.duration(after.diff(front))._data.milliseconds; var duration = moment.duration(after.diff(front))._data.milliseconds;
if (res.success) { if (res.success) {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验成功"); setloadingTip("测试完成");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} else { } else {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验失败"); setloadingTip("测试失败");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} }
@ -277,18 +277,18 @@ function cameraModal (props) {
var duration = moment.duration(after.diff(front))._data.milliseconds; var duration = moment.duration(after.diff(front))._data.milliseconds;
if (res.success) { if (res.success) {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验成功"); setloadingTip("测试完成");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} else { } else {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验失败"); setloadingTip("测试失败");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} }
@ -314,18 +314,18 @@ function cameraModal (props) {
var duration = moment.duration(after.diff(front))._data.milliseconds; var duration = moment.duration(after.diff(front))._data.milliseconds;
if (res.success) { if (res.success) {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验成功"); setloadingTip("测试完成");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} else { } else {
setTimeout(() => { setTimeout(() => {
setloadingTip("校验失败"); setloadingTip("测试失败");
setTimeout(() => { setTimeout(() => {
setloading(false); setloading(false);
setloadingTip("测试进行中..."); setloadingTip("测试中...");
}, 800); }, 800);
}, duration > 2000 ? 0 : 2000 - duration) }, duration > 2000 ? 0 : 2000 - duration)
} }

5
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/cascadeCamera.jsx
View File

@ -71,8 +71,9 @@ function cascadeCamera ({ dRef, dispatch, actions, cameraData ,parentCamera}) {
<Form.Input <Form.Input
field="externalDomain" field="externalDomain"
label="外域名称:" label="外域名称:"
initValue={cameraData.externalDomain || ""} v maxLength="36"
placeholder="请输入外域名称" initValue={cameraData.externalDomain || ""}
placeholder="请输入外域 名称，例如“xxx市级平台”"
style={{ width: 307 }} style={{ width: 307 }}
rules={[{ required: true, message: "请输入外域名称" }]} rules={[{ required: true, message: "请输入外域名称" }]}
/> />

3
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/fluoriteCamera.jsx
View File

@ -107,6 +107,7 @@ function fluoriteCamera ({ cRef, CameraKind, CameraAbility, cameraData }) {
<Form.Input <Form.Input
field="name" field="name"
label="设备名称:" label="设备名称:"
maxLength="36"
placeholder="请输入设备名称、常用项目或位置定义" placeholder="请输入设备名称、常用项目或位置定义"
style={{ width: 307 }} style={{ width: 307 }}
rules={[{ required: true, message: "请输入设备名称" }]} rules={[{ required: true, message: "请输入设备名称" }]}
@ -215,6 +216,7 @@ function fluoriteCamera ({ cRef, CameraKind, CameraAbility, cameraData }) {
<Form.Input <Form.Input
field="position" field="position"
label="安装位置:" label="安装位置:"
maxLength="39"
placeholder="请输入或拾取高德经纬度坐标" placeholder="请输入或拾取高德经纬度坐标"
style={{ width: 270 }} style={{ width: 270 }}
validate={positionForm} validate={positionForm}
@ -462,6 +464,7 @@ function fluoriteCamera ({ cRef, CameraKind, CameraAbility, cameraData }) {
style={{ width: 320, height: 90 }} style={{ width: 320, height: 90 }}
field="rtmp" field="rtmp"
label="RTMP地址接入:" label="RTMP地址接入:"
maxLength="100"
placeholder="请输入RTMP地址接入" placeholder="请输入RTMP地址接入"
rules={[{ required: true, message: "请输入RTMP地址接入" }]} rules={[{ required: true, message: "请输入RTMP地址接入" }]}
/> />

3
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/ipcCamera.jsx
View File

@ -110,6 +110,7 @@ function ipcCamera({
<Form.Input <Form.Input
field="name" field="name"
label="设备名称:" label="设备名称:"
maxLength="36"
placeholder="请输入设备名称、常用项目或位置定义" placeholder="请输入设备名称、常用项目或位置定义"
style={{ width: 307 }} style={{ width: 307 }}
rules={[{ required: true, message: "请输入设备名称" }]} rules={[{ required: true, message: "请输入设备名称" }]}
@ -142,6 +143,7 @@ function ipcCamera({
<Form.Input <Form.Input
field="position" field="position"
label="安装位置:" label="安装位置:"
maxLength="39"
placeholder="请输入或拾取高德经纬度坐标" placeholder="请输入或拾取高德经纬度坐标"
style={{ width: 270 }} style={{ width: 270 }}
validate={positionForm} validate={positionForm}
@ -377,6 +379,7 @@ function ipcCamera({
<Form.Input <Form.Input
field="serialNo" field="serialNo"
label="设备编号接入:" label="设备编号接入:"
maxLength="39"
placeholder="请输入设备编号" placeholder="请输入设备编号"
style={{ width: 307 }} style={{ width: 307 }}
/> />

10
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrCamera.jsx
View File

@ -26,7 +26,7 @@ function nvrCamera ({ dispatch, actions, nvrRef, cameraData, addNvr, nvrNumber }
const [isAllChoose, setIsAllChoose] = useState(false); //全选 const [isAllChoose, setIsAllChoose] = useState(false); //全选
const [equipmentNum, setEquipmentNum] = useState(""); //nvr视频编号 const [equipmentNum, setEquipmentNum] = useState(""); //nvr视频编号
const [isloading, setloading] = useState(false); //是否显示loading const [isloading, setloading] = useState(false); //是否显示loading
const [loadingTip, setloadingTip] = useState("正在接入视频流..."); //loading tip的值 const [loadingTip, setloadingTip] = useState("获取中..."); //loading tip的值
const [step, setstep] = useState("none"); const [step, setstep] = useState("none");
const [stepp, setstepp] = useState("none"); const [stepp, setstepp] = useState("none");
@ -79,12 +79,12 @@ function nvrCamera ({ dispatch, actions, nvrRef, cameraData, addNvr, nvrNumber }
setNvrCheckList([data[0].id]); setNvrCheckList([data[0].id]);
if (res.success) { if (res.success) {
setTimeout(() => { setTimeout(() => {
setloadingTip("接入完成"); setloadingTip("获取完成");
setTimeout(() => { setTimeout(() => {
setstep("none"); setstep("none");
setloading(false); setloading(false);
setstepp("block"); setstepp("block");
setloadingTip("正在接入视频流..."); setloadingTip("获取中...");
}, 800); }, 800);
}, 800) }, 800)
} }
@ -176,12 +176,12 @@ function nvrCamera ({ dispatch, actions, nvrRef, cameraData, addNvr, nvrNumber }
setIsAllChoose(true); setIsAllChoose(true);
if (res.success) { if (res.success) {
setTimeout(() => { setTimeout(() => {
setloadingTip("接入完成"); setloadingTip("获取完成");
setTimeout(() => { setTimeout(() => {
setstep("none"); setstep("none");
setloading(false); setloading(false);
setstepp("block"); setstepp("block");
setloadingTip("正在接入视频流..."); setloadingTip("获取中...");
}, 800); }, 800);
}, 800) }, 800)
} }

2
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx
View File

@ -186,7 +186,7 @@ function nvrModal(props) {
field="name" field="name"
label="设备名称:" label="设备名称:"
initValue={nvrData.name || ""} initValue={nvrData.name || ""}
placeholder="请输入设备名称、常用项目或位置定义" placeholder="请输入设备名称"
style={{ width: 421 }} style={{ width: 421 }}
rules={[ rules={[
{ {

9
code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/camera.jsx
View File

@ -524,6 +524,7 @@ const CameraHeader = (props) => {
<Form.Input <Form.Input
label="设备搜索：" label="设备搜索："
field="keyword" field="keyword"
maxLength="36"
placeholder="请输入设备名称" placeholder="请输入设备名称"
labelPosition="left" labelPosition="left"
style={screen} style={screen}
@ -563,13 +564,15 @@ const CameraHeader = (props) => {
<Form.Select <Form.Select
label="状态查询：" label="状态查询："
labelPosition="left" labelPosition="left"
field="type2" field="state"
style={screen} style={screen}
placeholder="全部" placeholder="全部"
showClear showClear
> >
<Form.Select.Option value="yes">在线</Form.Select.Option> <Form.Select.Option value="ON">在线</Form.Select.Option>
<Form.Select.Option value="no">离线</Form.Select.Option> <Form.Select.Option value="OFF">离线</Form.Select.Option>
<Form.Select.Option value="UNKONW">未知</Form.Select.Option>
<Form.Select.Option value="DISABLED">禁用</Form.Select.Option>
</Form.Select> </Form.Select>
{/* <Form.Select {/* <Form.Select
label="关联项目：" label="关联项目："

Write Preview
Loading…
Cancel
Save