From 5744fe52b8fa000cefbce9e842c58fad8e822054 Mon Sep 17 00:00:00 2001 From: wenlele Date: Thu, 28 Apr 2022 13:44:17 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E8=A1=A8=E6=A0=BC=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../client/assets/images/background/setup.png | Bin 0 -> 945 bytes .../equipmentWarehouse/components/setup.jsx | 33 +++ .../equipmentWarehouse/containers/nvr.jsx | 204 ++++++++++++------ 3 files changed, 166 insertions(+), 71 deletions(-) create mode 100644 code/VideoAccess-VCMP/web/client/assets/images/background/setup.png create mode 100644 code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/setup.jsx diff --git a/code/VideoAccess-VCMP/web/client/assets/images/background/setup.png b/code/VideoAccess-VCMP/web/client/assets/images/background/setup.png new file mode 100644 index 0000000000000000000000000000000000000000..8e3944ebc78ba79ec87b9310cbcf771b6038d080 GIT binary patch literal 945 zcmV;i15W&jP)Px&Ye_^wR9Hu~m|cj~RTRa4D@jZ#$w)J-hlI$CaEOeu2h%bkB%+5jLiEK5ViYA4 zoQfn1KOT}P5M`K=T;Ia{0`Rt^o?Lq68rYr-98R=*SkkA7*aoabP(7dl9nW5^99)+4}1&Undsy+@PMS>67eHbW_v8~T95!ofIdklZI1y~ z0_%VqQ^_mbMc^%9gQUM~-w&(+?gPG#;*b=WOCw}^JMe7H;g`TQz`dD5>hLo_RNt)H z7keZ%uR!xs+YX1vN-p{p3JvpzBz@kjGTR~SC@^~z$V(^&fG$b@G$LesIq*&i( zOX`*FiNGmf@+gv*P{sYaJp^q9)|4>(4>sFF&{^QtLh^IKe&BoH58yUnCh!J$y-jH*mZ@d8Pko0%m(DnpiHSi)3|EHesLeO2n$G|O#R=)%DCH>F|Z~H;uld6w( zf}a2u4OQ8ss>&YkU}a$5P|xV(p{n3W-$xy=eLz&%#SyQ)?YIkFZH#wIdL~84aE$GP zz=9Tb$0fxx(l~WNgTRb74(CXUJC}8AKMEXZVKgWy3L#t2pTI;(|7NMl1m~peCrNjt z@K;Y!l>JpH_;@UU^TVHxluP}Kq?(emh@{o zob8yW)+caX4)R_I`myS+DI8Bq+SftQGT_}5vddt4LQssCHzX2772X}WZiTPz&vQUD z#h5fxP83Q%@Mg*5x>nMb6fY&1((z-xq}SU-DF(fm%Tps1Rn{-*@RbZ`9{^h=eKlN| z?dZtS1haQOVEK@s_#0bBvxR4bdy}NtMjFTV8`XA_LD7Wn8jT@8Mv&&FVms3H1u!mC zQ54D(^-f)1gCe(wfGJU3EgXyxR7ELz+C7bwO8Gd;6SfCE6+JwC(tOXyB^< z;&F+f%*c#@XI(to*8wp|-8_t?p0e0}H)i&sMwJ0;vjkP?hzanKHiEi=ZG} { + close(); + }} + onCancel={() => { + close(); + }} + > + {}} + /> + + ); +} + +export default Setup; diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx index ae58a53..9796cce 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx @@ -1,11 +1,13 @@ -import React, { useEffect } from "react"; +import React, { useState, useEffect } from "react"; import { connect } from "react-redux"; import { Button, Form, Input, Row, Table } from "@douyinfe/semi-ui"; import "../style.less"; -import NvrModal from "../components/nvrModal" +import NvrModal from "../components/nvrModal"; +import Setup from "../components/setup"; const NvrHeader = (props) => { const { dispatch, actions, user, loading } = props; + const [setup, setSetup] = useState(false); const screen = { width: 193, @@ -16,7 +18,6 @@ const NvrHeader = (props) => { const columns = [ { title: "序号", - align: "center", render: (text, record, index) => { return index + 1; }, @@ -24,8 +25,8 @@ const NvrHeader = (props) => { { title: "设备名称", // dataIndex: "name",/// - align: "center", width: 200, + background: "red", render: (text, record, index) => { return (
@@ -45,34 +46,30 @@ const NvrHeader = (props) => { }, { title: "设备厂家", - align: "center", dataIndex: "size", }, { title: "SIP地址", - align: "center", dataIndex: "owner", }, { title: "端口号", - align: "center", dataIndex: "updateTime", }, { title: "通道数", - align: "center", dataIndex: "nameIconSrc", }, { title: "操作", - align: "center", + width: "20%", dataIndex: "", render: (y) => { return ( <> - - - + + + ); }, @@ -109,45 +106,53 @@ const NvrHeader = (props) => { ]; return ( <> -
-
+
+
{
{ width: 65, height: 30, borderRadius: 3, - marginBottom: "20px", - marginRight: "20px", + marginBottom: 20, + marginRight: 20, }} > 搜素 @@ -243,7 +248,7 @@ const NvrHeader = (props) => { backGround: "#FFFFFF", borderRadius: 3, border: "1px solid #D9D9D9", - marginBottom: "20px", + marginBottom: 20, }} > 重置 @@ -251,8 +256,15 @@ const NvrHeader = (props) => {
- +
{ > 设备列表
- } - columns={columns} - dataSource={data} - pagination={false} - bordered={false} - /> +
+ + +
+
+
+ {setup ? ( + { + setSetup(false); + // setEditData(null) + }} + // reportType={reportType} + // editData={editData} + /> + ) : ( + "" + )} + ); }; -function mapStateToProps (state) { - const { auth, global, members } = state; - return { - loading: members.isRequesting, - user: auth.user, - actions: global.actions, - members: members.data, - }; +function mapStateToProps(state) { + const { auth, global, members } = state; + return { + loading: members.isRequesting, + user: auth.user, + actions: global.actions, + members: members.data, + }; } export default connect(mapStateToProps)(NvrHeader); From 27594bada8ffc1594dbdf36db1d6db9efd4a11f9 Mon Sep 17 00:00:00 2001 From: deartibers <947466799@qq.com> Date: Thu, 28 Apr 2022 13:47:36 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E5=BC=B9=E6=A1=86=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/nvrModal.jsx | 214 +++++++++++------- .../equipmentWarehouse/containers/nvr.jsx | 2 +- 2 files changed, 127 insertions(+), 89 deletions(-) diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx index 214ba5f..1f46205 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/components/nvrModal.jsx @@ -1,110 +1,148 @@ -import React, { useState } from 'react' -import { Modal,Form,Row,Col,Spin } from '@douyinfe/semi-ui'; +import React, { useState ,useRef} from 'react' +import { Modal,Form,Row,Col,Spin,Notification } from '@douyinfe/semi-ui'; import { IconTickCircle } from '@douyinfe/semi-icons'; function nvrModal(props){ + const {modalName}=props + const form = useRef(); const [visible, setVisible] = useState(false);//是否显示弹框 const [isloading,setloading] = useState(false);//是否显示loading const [loadingTip,setloadingTip] = useState('获取中...请稍后...');//loading tip的值 - const [step,setstep] = useState(0) + const [step,setstep] = useState(0)//第几步 + const [okText,setokText] = useState('测试校验')//ok弹框text 右边 + const [cancelText,setcancelText] = useState('取消')//取消弹框text 左边 + const opts ={//添加完成确认后通知 + title:'Hi', + content:'添加成功', + duration:3 + } function showDialog() {//打开弹框 setVisible(true); } - function handleOk() {//点击弹框确定 - // setVisible(false); - setloading(true); - setTimeout(() => { - setloadingTip('...接受成功') - setTimeout(()=>{ - setloadingTip('已完成') + function handleOk() {//点击弹框确定 右边按钮 + if(step==0){ + form.current.validate() + .then(values=>{//表单校验成功 + setloading(true); setTimeout(() => { - setstep(1); - setloading(false); + setloadingTip('...接受成功') + setTimeout(()=>{ + setloadingTip('已完成') + setTimeout(() => { + setstep(1); + setokText('确认'); + setcancelText('上一步'); + setloading(false); + }, 2000); + },2000) }, 2000); - },2000) - }, 2000); + }) + .catch(errors=>{//表单校验失败 + console.log('errors',errors); + }) + + } + else{ + Notification.success(opts) + setVisible(false); + } } function handleAfterClose(){//在关闭之后 - console.log('after'); + setstep(0); + setokText('测试校验'); + setcancelText('取消'); + } + function handleCancel() {//点击弹框取消 左边按钮 + if(step==0){ + setVisible(false); + } + else{ + setstep(0); + setokText('测试校验'); + setcancelText('取消'); + } } - function handleCancel() {//点击弹框取消 - setVisible(false); + function handleLocation(){//高德经纬度 + console.log('handleLocationhandleLocation'); } return ( <> -
{props.modalName}
- =1.16.0 - onCancel={handleCancel} - > - - {step==0?
-
console.log(values)}> - -
- - - - - - - - - - - Semi - 轻颜相机 - 今日头条 +
{modalName}
+ + + {step==0?
+ console.log(values)} + getFormApi={formApi => form.current = formApi}> + +
+ + + + + + + + + + + Semi + 轻颜相机 + 今日头条 - - - + + -
- -
- - - - : -
-
- -
-
- 已完成NVR设备测试和校验,是否确认添加? -
+ { required: true, message: '请输入或拾取高德经纬度坐标' } + ]}/> +
+ +
+ + + +
+ ://下一步 +
+
+ +
+
+ 已完成NVR设备测试和校验,是否确认添加?
- } - - +
+ } + + ); } diff --git a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx index 9796cce..9c66f97 100644 --- a/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx +++ b/code/VideoAccess-VCMP/web/client/src/sections/equipmentWarehouse/containers/nvr.jsx @@ -67,7 +67,7 @@ const NvrHeader = (props) => { render: (y) => { return ( <> - +