迁移新仓库

src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <div ref="app" :class="classObj" style="height:100%">
     <van-config-provider theme="dark" :theme-vars="themeVars" style="height: 100%;">
-      <router-view />
+      <router-view/>
     </van-config-provider>
   </div>
 </template>

src/api/instrumentConfiguration/index.js

@@ -1,43 +1,14 @@
+import request from '@/utils/request'
 // 获取仪表算法配置
-export function getDialSet() {
-	return {
-		"upload":true,
-		"broker_host": "121.43.168.223:30001",
-		"topic_name": "device/iBoat/490023008", 
-		"user_name": "13CB0BC046E371FC",
-		"password": "C0E915D1D49E72BC", 
-		"camer_path": "rtsp://10.60.10.88:554/dg6_264.mp4",
-		"num_dials": 2,
-		"info": [{
-			"dialId": 0,
-			"dial": "0",
-			"code": "005", 
-			"unit": "m", 
-			"decimalplaces": 1, 
-			"coefficient": 100,
-			"max": 1500,
-			"min": 0,
-			"codeName":"左主机转速",
-		},{
-			"dialId": 1,
-			"dial": "1",
-			"code": "00C", 
-			"unit": "℃",
-			"decimalplaces": 1,  
-			"coefficient": 100,
-			"max": 300,
-			"min": 0,
-			"codeName":"左主机淡水温度",
-		}]
-	}
-
-	// return request({
-	// 	url: '/database_op/dial.cgi',
-	// 	method: 'post',
-	// 	data:  {
-	// 		"cmdType": "dial"
-	// 	}
-	// })
+export function getDialSet(query) {
+	return request({
+		url: '/database_op/dial.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "dial",
+			"cmdParam": query
+		}
+	})
 }
 
 // 设置仪表算法
@@ -52,40 +23,24 @@ export function setDial(query) {
 	})
 }
 // 获取仪表数据
-export function getDialValue() {
-	return {
-		"num_dials": 4 
-		"data": [{
-			"dial":"0",
-			"code":"005",
-			"codeName":"左主机转速"
-			"value": 1462.4
-		},{
-			"dial":"1",
-			"code":"00C",
-			"codeName":"左主机淡水温度"
-			"value": 65.3
-		}]
-	}
-	// request({
-	// 	url: '/database_op/dial.cgi',
-	// 	method: 'post',
-	// 	data:  {
-	// 		"cmdType": "dial_value"
-	// 	}
-	// })
+export function getDialValue(query) {
+	return request({
+		url: '/database_op/dial.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "dial_value",
+			"cmdParam": query
+		}
+	})
 }
 // 获取仪表图片
-export function getDialImg() {
-	return {
-	   "imagePath": "./a.jpeg",
-	   "calibrationPath":' "./b.jpeg"
-	}
-	// request({
-	// 	url: '/database_op/dial.cgi',
-	// 	method: 'post',
-	// 	data:  {
-	// 		"cmdType": "dial_image"
-	// 	}
-	// })
+export function getDialImg(query) {
+	return request({
+		url: '/database_op/dial.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "dial_image",
+			"cmdParam": query
+		}
+	})
 }

src/api/settConfiguration/index.js

@@ -177,7 +177,49 @@ export function setPictureConfig(query) {
 		}
 	})
 }
-
+// 获取录像/抓拍配置信息  
+export function getVIConfig(query) {
+	return request({
+		url: '/database_op/record.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "record_get"
+		}
+	})
+}
+// 配置录像/抓拍信息 
+export function setVIConfig(query) {
+	return request({
+		url: '/database_op/record.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "record_set",
+			"cmdParam": query
+		}
+	})
+}
+// 下发抓拍命令
+export function distributeImg(query) {
+	return request({
+		url: '/database_op/record.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "record_img",
+			"cmdParam": query
+		}
+	})
+}
+// 下发录像命令
+export function distributeVideo(query) {
+	return request({
+		url: '/database_op/record.cgi',
+		method: 'post',
+		data:  {
+			"cmdType": "record_nvr",
+			"cmdParam": query
+		}
+	})
+}
 
 
 // 设置gps配置

src/layout/components/AppMain.vue

@@ -1,6 +1,6 @@
 <template>
 	<section class="app-main">
-		<router-view v-slot="{ Component, route }">
+		<router-view v-slot="{ Component, route }" v-if="$store.state.data.isRouter">
 			<transition name="fade-transform" mode="out-in">
 				<keep-alive :include="cachedViews">
 					<component :is="Component" :key="route.path" />

src/layout/components/Sidebar/SidebarItem.vue

@@ -1,12 +1,12 @@
 <template>
   <div v-if="!item.hidden">
     <template v-if="hasOneShowingChild(item.children, item) && (!onlyOneChild.children || onlyOneChild.noShowingChildren) && !item.alwaysShow">
-      <app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)">
-        <el-menu-item :index="resolvePath(onlyOneChild.path)" :class="{ 'submenu-title-noDropdown': !isNest }">
+      <!-- <app-link v-if="onlyOneChild.meta" :to="resolvePath(onlyOneChild.path, onlyOneChild.query)"> -->
+        <el-menu-item v-if="onlyOneChild.meta" :index="resolvePath(onlyOneChild.path)" :class="{ 'submenu-title-noDropdown': !isNest }">
           <svg-icon :icon-class="onlyOneChild.meta.icon || (item.meta && item.meta.icon)"/>
           <template #title><span class="menu-title" :title="hasTitle(onlyOneChild.meta.title)">{{ onlyOneChild.meta.title }}</span></template>
         </el-menu-item>
-      </app-link>
+      <!-- </app-link> -->
     </template>
 
     <el-sub-menu v-else ref="subMenu" :index="resolvePath(item.path)" popper-append-to-body>

src/layout/components/Sidebar/index.vue

@@ -15,6 +15,7 @@
         :active-text-color="theme"
         :collapse-transition="false"
         mode="vertical"
+		 @select="handleSelect"
       >
         <sidebar-item
           v-for="(route, index) in sidebarRouters"
@@ -35,7 +36,7 @@ import myRouters from '@/router/routes'
 
 const route = useRoute();
 const store = useStore();
-
+const router = useRouter();
 const sidebarRouters =  myRouters;
 // const sidebarRouters =  computed(() => store.getters.sidebarRouters);
 const showLogo = computed(() => store.state.settings.sidebarLogo);
@@ -51,5 +52,11 @@ const activeMenu = computed(() => {
   }
   return path;
 })
-
+const handleSelect = function(key, keyPath) {
+    router.push(key);
+	store.state.data.isRouter = false;
+	setTimeout(()=>{
+		store.state.data.isRouter = true;
+	},1000)
+}
 </script>

src/store/modules/data.js

@@ -13,6 +13,7 @@ const state = {
   analogList: [],
   analogIntervalTimer: null,
   curAnalogSn: null,
+  isRouter: true
 }
 
 const mutations = {

src/views/desktop/AIMonitoring/realTimeMonitoring.vue

@@ -31,6 +31,7 @@
 </template>
 
 <script setup>
+	import axios from 'axios'
 	import { listCamera, getCamera } from "@/api/camera";
 	import { onMounted,onBeforeUnmount } from 'vue';
 	// const baseUrl = import.meta.env.VITE_APP_BASE_API;
@@ -58,6 +59,25 @@
 			cameraList.value = response.data;
 		});
 	}
+	// 扒图片
+	function downloadFile() {
+		let _obj = []
+		for(let i=4;i<_obj.length;i++){
+			let fileUrl = _obj[i].replace("https://imgs-ali.51miz.com","/download");
+			let fileName = fileUrl.split("without_watermark/")[1];
+			fetch(fileUrl).then(res => res.blob().then(blob => {
+				let newUrl = window.URL.createObjectURL(blob);
+				let a = document.createElement("a");
+				a.href = newUrl;
+				a.download = fileName;
+				a.click();
+				a.remove();
+				// //在资源下载完成后 可以人工清除createObjectURL 占用的缓存资源
+				window.URL.revokeObjectURL(newUrl);
+			}))
+		}
+	}
+	// downloadFile()
 	getCamList();
 	onMounted(() => {
 		webRtcServer = new WebRtcStreamer("video","http://127.0.0.1:8000");

src/views/desktop/DeploymentInstructions/index.vue

@@ -8,19 +8,19 @@
 			<el-step title="告警上报配置" description=""></el-step>
 		</el-steps>
 		<div class="padding-tb-sm" v-if="activeTab == 1">
-			<img style="height:80vh;" src="@/assets/cvv/newwork.jpg" alt="">
+			<img style="height:70vh;" :src="baseUrl+'alarm_folder/html_images/newwork.jpg'" alt="">
 		</div>
 		<div class="padding-tb-sm" v-if="activeTab == 2">
-			<img style="height:80vh;" src="@/assets/cvv/camera.jpg" alt="">
+			<img style="height:70vh;" :src="baseUrl+'alarm_folder/html_images/camera.jpg'" alt="">
 		</div>
 		<div class="padding-tb-sm" v-if="activeTab == 3">
-			<img style="height:80vh;" src="@/assets/cvv/algorithm.png" alt="">
+			<img style="height:70vh;" :src="baseUrl+'alarm_folder/html_images/algorithm.png'" alt="">
 		</div>
 		<div class="padding-tb-sm" v-if="activeTab == 4">
-			<img style="height:80vh;" src="@/assets/cvv/alramList.jpg" alt="">
+			<img style="height:70vh;" :src="baseUrl+'alarm_folder/html_images/alramList.jpg'" alt="">
 		</div>
 		<div class="padding-tb-sm" v-if="activeTab == 5">
-			<img style="height:80vh;" src="@/assets/cvv/escalation.png" alt="">
+			<img style="height:70vh;" :src="baseUrl+'alarm_folder/html_images/escalation.png'" alt="">
 		</div>
 		<div class="text-right margin-top">
 			<el-button type="success" @click="handleRouter">前往配置</el-button>
@@ -30,6 +30,8 @@
 </template>
 
 <script setup name="Role">
+// const baseUrl = import.meta.env.VITE_APP_BASE_API;
+const baseUrl = location.protocol+"//"+window.location.host+"/";
 const router = useRouter();
 const { proxy } = getCurrentInstance();
 const activeTab = ref(1);

src/views/desktop/algorithmSetUp/alarmWareConfiguration.vue

@@ -6,15 +6,15 @@
 				<el-form-item label="串口" prop="comValue">
 					<el-select v-model="form.comValue" placeholder="选择串口">
 						<el-option label="485" :value="0" />
-						<el-option label="482" :value="1" />
+						<el-option label="232" :value="1" />
 					</el-select>
 				</el-form-item>
-				<el-form-item label="语音编号" prop="voice">
-					<el-input style="width: 214px;" v-model="form.voice" type="number" min="0" placeholder="请输入音量大小"/>
+				<el-form-item label="语音编号" prop="song">
+					<el-input style="width: 214px;" v-model="form.song" type="number" min="0" placeholder="请输入音量大小"/>
 					<el-button type="success" class="margin-left-sm" @click="setPlay">下发测试</el-button>
 				</el-form-item>
 				<el-form-item label="音量大小" prop="volume">
-					<el-input style="width: 214px;" v-model="form.volume" type="number" min="1" max="10" placeholder="请输入音量大小"/>
+					<el-input style="width: 214px;" v-model="form.volume" type="number" min="1" max="30" placeholder="请输入音量大小"/>
 					<el-button type="primary" class="margin-left-sm" @click="setWare">保存配置</el-button>
 				</el-form-item>
 			</div>
@@ -30,7 +30,7 @@
 		form: {
 			"volume" : 6,
 			"comValue": 0,
-			"voice" : 0
+			"song" : 0
 		},
 		rules: {
 			comValue: [{
@@ -38,7 +38,7 @@
 				message: "请选择串口",
 				trigger: "blur",
 			}],
-			voice: [{
+			song: [{
 				required: true,
 				message: "请填写语音编号",
 				trigger: "blur",
@@ -53,13 +53,14 @@
 	const { form, rules } = toRefs(data);
 	
 	const setPlay = () => {
-		if((form.value.voice+"").length){
+		if((form.value.song+"").length){
 			loading.value = true;
 			let _query = {
-				"com": (form.value.comValue == 0?"/dev/ttyS0":"/dev/ttyS1"),
-				"voive": form.value.voice
+				"com": (form.value.comValue == 0?"/dev/ttyS2":"/dev/ttyS1"),
+				"song": form.value.song
 			};
 			setAlarmPlay(_query).then((response) => {
+				console.log(response)
 				proxy.$modal.msgSuccess("下发成功");
 				loading.value = false;
 			});
@@ -69,10 +70,11 @@
 		if((form.value.volume+"").length){
 			loading.value = true;
 			let _query = {
-				"com": (form.value.comValue == 0?"/dev/ttyS0":"/dev/ttyS1"),
+				"com": (form.value.comValue == 0?"/dev/ttyS2":"/dev/ttyS1"),
 				"volume": form.value.volume
 			};
 			setAlarmWare(_query).then((response) => {
+				console.log(response)
 				proxy.$modal.msgSuccess("设置成功");
 				loading.value = false;
 			});

src/views/desktop/algorithmSetUp/algorithmConfiguration.vue

@@ -64,15 +64,14 @@
 				<el-form-item label="置信度阈值" prop="algorithm_confidence">
 				  <el-input
 				    v-model="form.algorithm_confidence"
-				    type="number"
-				    min="0"
-				    @input="isBiggerThanZero('algorithm_confidence')"
-				    @change="isBiggerThanZero('algorithm_confidence')"
+					min="0"
 				  >
+				   <!-- @input="isBiggerThanZero('algorithm_confidence')"
+				    @change="isBiggerThanZero('algorithm_confidence')" -->
 					</el-input>
 				</el-form-item>
 				<el-form-item label="检测间隔" prop="algorithm_alarm_gap">
-				  <el-input type="number" v-model="form.algorithm_alarm_gap" placeholder="检测间隔">
+				  <el-input v-model="form.algorithm_alarm_gap" placeholder="检测间隔">
 				    <template #append>秒</template>
 				  </el-input>
 				</el-form-item>
@@ -82,15 +81,14 @@
 				<el-form-item label="实体阈值" prop="algorithm_object">
 				  <el-input
 				    v-model="form.algorithm_object"
-				    type="number"
-				    min="0"
-				    @input="isBiggerThanZero('algorithm_object')"
-				    @change="isBiggerThanZero('algorithm_object')"
+					min="0"
 				  >
+				   <!-- @input="isBiggerThanZero('algorithm_object')"
+				    @change="isBiggerThanZero('algorithm_object')" -->
 				  </el-input>
 				</el-form-item>
 				<el-form-item label="检测周期" prop="algorithm_alarm_cycle">
-				  <el-input type="number" v-model="form.algorithm_alarm_cycle" placeholder="检测周期">
+				  <el-input v-model="form.algorithm_alarm_cycle" placeholder="检测周期">
 				    <template #append>秒</template>
 				  </el-input>
 				</el-form-item>
@@ -100,15 +98,14 @@
 				<el-form-item label="遮盖比例阈值" prop="algorithm_IOU">
 				  <el-input
 				    v-model="form.algorithm_IOU"
-				    type="number"
-				    min="0"
-				    @input="isBiggerThanZero('algorithm_IOU')"
-				    @change="isBiggerThanZero('algorithm_IOU')"
+					min="0"
 				  >
+				   <!-- @input="isBiggerThanZero('algorithm_IOU')"
+				    @change="isBiggerThanZero('algorithm_IOU')" -->
 				  </el-input>
 				</el-form-item>
 				<el-form-item label="检测航速" prop="algorithm_alarm_speed">
-				  <el-input type="number" v-model="form.algorithm_alarm_speed" placeholder="检测航速">
+				  <el-input v-model="form.algorithm_alarm_speed" placeholder="检测航速">
 				    <template #append>海里/时</template>
 				  </el-input>
 				</el-form-item>
@@ -243,16 +240,28 @@ const data = reactive({
         required: true,
         message: "置信度阈值不能为空",
         trigger: "blur",
+    },{
+		pattern: /^[0-9]+\.{0,1}[0-9]{0,2}$/,
+        message: "请输入0-1之间的数值",
+        trigger: "blur",
     }],
     algorithm_object: [{
         required: true,
         message: "实体阈值不能为空",
         trigger: "blur",
+    },{
+		pattern: /^[0-9]+\.{0,1}[0-9]{0,2}$/,
+        message: "请输入0-1之间的数值",
+        trigger: "blur",
     }],
     algorithm_IOU: [{
         required: true,
         message: "遮盖比例阈值不能为空",
         trigger: "blur",
+    },{
+		pattern: /^[0-9]+\.{0,1}[0-9]{0,2}$/,
+        message: "请输入0-1之间的数值",
+        trigger: "blur",
     }],
 	algorithm_alarm_gap: [{
         required: true,
@@ -405,9 +414,13 @@ function isBiggerThanZero(key) {
   // console.log(form.value[key]);
   // console.log(form.value[key] == null);
   // console.log(typeof form.value[key]);
-  form.value[key] = Number(form.value[key]);
-  if (form.value[key] < 0) {
-    form.value[key] = 0;
+  if((form.value[key]+"").length){
+	  form.value[key] = parseFloat(form.value[key]);
+	  if (form.value[key] < 0) {
+		form.value[key] = 0;
+	  }
+  }else{
+	  form.value[key] = 0;
   }
 }
 
@@ -463,15 +476,25 @@ const getPhoto = function(key){
 		let _obj = cameraList.value, imgPict = {}, rtspStr = "";
 		_obj.forEach((item,idnex) => {
 			let _thor = 0;
-			if(item.camera_brand == 20){
-				_thor = item.camera_rtsp.split("channel=")[1].split("&")[0];
-			}else if(item.camera_brand == 10){
-				_thor = item.camera_rtsp.split("h264/ch")[1].split("/")[0];
-			}else if(item.camera_brand == 30){
-				_thor = item.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
+			if(item.camera_rtsp.indexOf(".mp4") == -1){
+				if(item.camera_rtsp.indexOf("channel=") != -1){
+					_thor = item.camera_rtsp.split("channel=")[1].split("&")[0];
+				}else if(item.camera_rtsp.indexOf("Streaming/Channels") != -1){
+					_thor = item.camera_rtsp.split("Streaming/Channels/")[1];
+				}else if(item.camera_rtsp.indexOf("h264/ch") != -1){
+					_thor = item.camera_rtsp.split("h264/ch")[1].split("/")[0];
+				}else if (item.camera_rtsp.indexOf("LiveMedia/ch") != -1) {
+					_thor = item.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
+				}
+				imgPict[item.camera_id] = baseUrl + "alarm_folder/display_image/" + (item.camera_ip + "_" +
+					_thor) + "_small.jpg";
+			}else{ 
+				let _mhlk = item.camera_rtsp.split("/");
+				_thor = _mhlk[_mhlk.length - 1];
+				imgPict[item.camera_id] = baseUrl + "alarm_folder/display_image/" + _thor + ".jpg";
 			}
 			rtspStr += item.camera_rtsp + ",";
-			imgPict[item.camera_id] = baseUrl+"alarm_folder/display_image/"+(item.camera_ip+"_"+_thor)+"_small.jpg";
+			// imgPict[item.camera_id] = baseUrl+"alarm_folder/display_image/"+(item.camera_ip+"_"+_thor)+"_small.jpg";
 		});
 		cameraPict.value= imgPict;
 		cycleCamera(rtspStr, imgPict);

src/views/desktop/algorithmSetUp/instrumentConfiguration.vue

@@ -1,13 +1,24 @@
 <template>
-	<div class="padding-lr">
+	<div class="padding-lr" v-loading="loading">
 		<el-tabs v-model="activeName" @tab-click="handleClick">
 		    <el-tab-pane label="基本配置" name="first">
 				<el-form ref="dialRef" :model="dialForm" :rules="rules" label-width="120px">
-					<el-row v-loading="loading" :gutter="20">
-						<el-col :span="8">
+					<el-row :gutter="20">
+						<el-col :span="8" :xs="24">
+							<el-form-item label="摄像头" prop="camera">
+								<el-select v-model="dialForm.camera" placeholder="请选择摄像头" 
+									class="flex-sub" @change="changeCamera">
+									<el-option label="摄像头1" value="1" />
+									<el-option label="摄像头2" value="2" />
+									<el-option label="摄像头3" value="3" />
+								</el-select>
+							</el-form-item>
 							<el-form-item label="服务器" prop="broker_host">
 								<el-input v-model="dialForm.broker_host" placeholder="请输入服务器"/>
 							</el-form-item>
+							<el-form-item label="客户端ID" prop="client_id">
+								<el-input v-model="dialForm.client_id" placeholder="请输入客户端ID"/>
+							</el-form-item>
 							<el-form-item label="主题" prop="topic_name">
 								<el-input v-model="dialForm.topic_name" placeholder="请输入主题"/>
 							</el-form-item>
@@ -17,8 +28,8 @@
 							<el-form-item label="密码" prop="password">
 								<el-input v-model="dialForm.password" placeholder="请输入密码"/>
 							</el-form-item>
-							<el-form-item label="摄像头地址" prop="camer_path">
-								<el-input type="textarea" v-model="dialForm.camer_path" placeholder="请输入摄像头地址"/>
+							<el-form-item label="摄像头地址" prop="camera_path">
+								<el-input type="textarea" v-model="dialForm.camera_path" placeholder="请输入摄像头地址"/>
 							</el-form-item>
 							<el-form-item label="仪表数量" prop="num_dials">
 								<el-input v-model="dialForm.num_dials" type="number" min="0" placeholder="请输入仪表数量"/>
@@ -31,27 +42,29 @@
 								<el-button type="danger" @click="reSet">重置</el-button>
 							</el-form-item>
 						</el-col>
-						<el-col :span="16">
+						<el-col :span="16" :xs="24">
 							<div class="flex text-center text-sm margin-bottom-sm">
 								<span style="width: 6%;">表号</span>
-								<span style="width: 19%;margin: 0 2%;">名称</span>
+								<span style="width: 19%;margin: 0 10px;">名称</span>
 								<span style="width: 10%;">code值</span>
-								<span style="width: 8%;margin: 0 2%;">最小值</span>
-								<span style="width: 10%;">最大值</span>
-								<span style="width: 9%;margin: 0 2%;">小数位数</span>
-								<span style="width: 9%;">系数</span>
-								<span style="width: 8%;margin: 0 2%;">单位</span>
+								<span style="width: calc(10% - 10px);margin: 0 10px;">初始值</span>
+								<span style="width: 10%;">最小值</span>
+								<span style="width: calc(10% - 10px);margin: 0 10px;">最大值</span>
+								<span style="width: calc(10% - 20px);">小数位</span>
+								<span style="width: calc(10% - 30px);margin: 0 10px;">系数</span>
+								<span style="width: calc(10% - 10px);margin-right:10px;">单位</span>
 								<el-button link type="primary" icon="CirclePlus" style="font-size: 20px;" @click="addCode"></el-button>
 							</div>
 							<div v-for="(item,index) in dialForm.info" :key="index" class="margin-bottom-sm">
 								<el-input style="width: 6%;" v-model="item.dial"/>
-								<el-input style="width: 19%;margin: 0 2%;" v-model="item.codeName" placeholder="名称"/>
+								<el-input style="width: 19%;margin: 0 10px;" v-model="item.codeName" placeholder="名称"/>
 								<el-input style="width: 10%;" v-model="item.code" placeholder="code值"/>
-								<el-input style="width: 8%;margin: 0 2%;" v-model="item.min" type="number" placeholder="最小值"/>
-								<el-input style="width: 10%;" v-model="item.max" type="number" placeholder="最大值"/>
-								<el-input style="width: 9%;margin: 0 2%;" v-model="item.decimalplaces" type="number" placeholder="小数位数"/>
-								<el-input style="width: 9%;" v-model="item.coefficient" type="number" placeholder="系数"/>
-								<el-input style="width: 8%;margin: 0 2%;" v-model="item.unit" placeholder="单位"/>
+								<el-input style="width: calc(10% - 10px);margin: 0 10px;" type="number" v-model="item.start_value" placeholder="初始值"/>
+								<el-input style="width: 10%;" type="number" v-model="item.min" placeholder="最小值"/>
+								<el-input style="width: calc(10% - 10px);margin: 0 10px;" type="number" v-model="item.max" placeholder="最大值"/>
+								<el-input style="width: calc(10% - 20px);" type="number" v-model="item.decimalplace" placeholder="小数位数"/>
+								<el-input style="width: calc(10% - 30px);margin: 0 10px;" v-model="item.coefficient" placeholder="系数"/>
+								<el-input style="width: calc(10% - 10px);margin-right:10px;" v-model="item.unit" placeholder="单位"/>
 								<el-button link type="danger" icon="Delete" style="font-size: 20px;" @click="delCode(item)"></el-button>
 							</div>
 						</el-col>
@@ -59,7 +72,28 @@
 				</el-form>
 			</el-tab-pane>
 		    <el-tab-pane label="实时数据" name="second">
-				
+				<el-row :gutter="20">
+					<el-col :span="10" :xs="24">
+						<div class="padding-bottom-sm text-bold flex justify-between" style="margin-right: 10%;">
+							<span>图1：</span>
+							<el-button size="small" type="primary" @click="getImg">刷新</el-button>
+						</div>
+						<el-image style="width: 90%" :src="baseUrl+imgInfo.result_path" :preview-src-list="srcList"></el-image>
+						<div class="padding-tb-sm text-bold">图2：</div>
+						<el-image style="width: 90%" :src="baseUrl+imgInfo.start_path" :preview-src-list="srcList"></el-image>
+					</el-col>
+					<el-col :span="14" :xs="24">
+						<el-table :data="tableData" style="width: 100%;height: calc(100vh - 160px);" stripe>
+						    <el-table-column prop="dial" label="表号" width="80"></el-table-column>
+						    <el-table-column prop="codeName" label="名称"></el-table-column>
+						    <el-table-column prop="code" label="code值" width="100"></el-table-column>
+							<el-table-column prop="crorrection_value" width="100" label="初始修正值"></el-table-column>
+							<el-table-column prop="value" label="表值"></el-table-column>
+							<el-table-column prop="dial_time" label="标记时间" width="160"></el-table-column>
+							
+						</el-table>
+					</el-col>
+				</el-row>
 			</el-tab-pane>
 		</el-tabs>
 	</div>
@@ -67,11 +101,19 @@
 
 <script setup>
 	import { getDialSet, setDial, getDialValue, getDialImg } from "@/api/instrumentConfiguration";
+	import { deviceSystem } from "@/api/settConfiguration"
+	const baseUrl = location.protocol + "//" + window.location.host + "/";
+	// const baseUrl = import.meta.env.VITE_APP_BASE_API;
 	const { proxy } = getCurrentInstance();
 	const loading = ref(false);
-	const activeName = ref('second');
+	const activeName = ref('first');
+	const imgInfo = ref({});
+	const tableData = ref([]);
+	const srcList = ref([]);
+	
 	const data = reactive({
 		dialForm: {
+			"camera": "1", //摄像头ID
 			"upload": true,  // 是上报
 			"broker_host": "",      //服务器
 			"topic_name": "",   //主题
@@ -79,6 +121,7 @@
 			"password": "",     //密码
 			"camer_path":"", // 摄像头地址
 			"num_dials": 0,  //仪表数量
+			"client_id": "", //客户端id
 			"info": []
 		},
 		rules: {
@@ -87,6 +130,11 @@
 				message: "请选择上报服务器",
 				trigger: "blur",
 			}],
+			client_id: [{
+				required: true,
+				message: "请选择客户端id",
+				trigger: "blur",
+			}],
 			topic_name: [{
 				required: true,
 				message: "请填写主题",
@@ -120,27 +168,7 @@
 		
 	}
 	function reSet() {
-		dialForm.value = {
-			"upload": true,  // 是上报
-			"broker_host": "",      //服务器
-			"topic_name": "",   //主题
-			"user_name": "",    //用户名
-			"password": "",     //密码
-			"camer_path":"", // 摄像头地址
-			"num_dials": 0,  //仪表数量
-			"info": [{
-				"dial":"0",
-				"code":"", 
-				"unit":"", 
-				"decimalplaces":1, 
-				"coefficient": 100 ,
-				"codeName":"",
-				"max": 100,
-				"min": 0,
-				"decimalplaces": 1,
-				"coefficient": 100
-			}]
-		};
+		getDialList();
 		proxy.resetForm("dialRef");
 	}
 	const submitForm = function(){
@@ -150,7 +178,7 @@
 				setDial(dialForm.value).then((response) => {
 					proxy.$modal.msgSuccess("新增成功");
 					loading.value = false;
-					getDialList();
+					handleDevice();
 				});
 			}
 		})
@@ -162,31 +190,93 @@
 			max = _obj.reduce((prev, current) => (prev.dial > current.dial ? prev : current)).dial;
 		}
 		dialForm.value.info.push({
-			"dialId": parseInt(max) + 1,
 			"dial": parseInt(max) + 1,
 			"code": "", 
 			"unit": "", 
-			"decimalplaces": 1, 
+			"decimalplace": 1, 
 			"coefficient": 100,
 			"codeName": "",
 			"max": 100,
 			"min": 0,
-			"decimalplaces": 1,
-			"coefficient": 100
+			"start_value": 0
 		});
 	}
 	const delCode = function(row){
 		let _obj = dialForm.value.info;
 		dialForm.value.info = _obj.filter((item) => {
-		      return item.dialId != row.dialId
+		      return item.dial != row.dial
 		});
 	}
+	const handleDevice = function(type){
+		proxy.$modal.confirm('配置完成，需要重启系统方能生效！')
+		.then(function () {
+			deviceSystem('sys_start').then((response) => {
+				proxy.$modal.msgSuccess("操作成功！");
+				setTimeout(()=>{
+					changeCamera();
+				},180*1000);//5分钟后重新请求数据
+			})
+		}).catch(() => { 
+			
+		});
+	};
 	function getDialList() {
-		// getDialSet().then((response) => {
-			dialForm.value = getDialSet();
-		// });
+		loading.value = true;
+		getDialSet({ "camera": dialForm.value.camera })
+		.then((response) => {
+			loading.value = false;
+			if(response.data[1].camera){
+				dialForm.value = response.data[1];
+			}else{
+				let _carmes = dialForm.value.camera;
+				dialForm.value = {
+					camera: _carmes
+				}
+			}
+		})
+		.catch((res)=>{
+			loading.value = false;
+			let _carmes = dialForm.value.camera;
+			dialForm.value = {
+				camera: _carmes
+			}
+		});
+	}
+	function getValue() {
+		getDialValue({ "camera": dialForm.value.camera }).then((response) => {
+			if(response.data[1].data.length){
+				tableData.value = response.data[1].data;
+			}else{
+				tableData.value = [];
+			}
+		});
+	}
+	function getImg() {
+		imgInfo.value = {};
+		srcList.value = [];
+		getDialImg({ "camera": dialForm.value.camera }).then((response) => {
+			imgInfo.value = response.data[1];
+			imgInfo.value.start_path = imgInfo.value.start_path + "?t=" + (new Date().getTime());
+			imgInfo.value.result_path = imgInfo.value.result_path + "?t=" + (new Date().getTime());
+			if(response.data[1].start_path){
+				srcList.value = [
+					baseUrl + imgInfo.value.start_path,
+					baseUrl + imgInfo.value.result_path
+				];
+			}else{
+				srcList.value = [];
+			}
+			
+		});
+	}
+	function changeCamera(){
+		getDialList();
+		getValue();
+		getImg();
 	}
-	getDialList()
+	getDialList();
+	getValue();
+	getImg();
 </script>
 
 <style>

src/views/desktop/areaAlarmManagement/regionManager/index.vue

@@ -4,6 +4,8 @@
 			<el-tree class="impa-tree"
 			 :data="regionData"
 			 node-key="id"
+			 :highlight-current="true"
+			 :draggable="true"
 			 :expand-on-click-node="false">
 				<template #default="{ node, data }">
 					<span class="impa-tree-node">

src/views/desktop/systemConfiguration/cameraConfiguration.vue

@@ -1,515 +1,588 @@
 <template>
-  <div class="app-container">
-    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">
-      <el-form-item label="摄像机名称" prop="camera_name">
-        <el-input v-model="queryParams.camera_name" placeholder="请输入摄像机名称" clearable @keyup.enter="handleQuery" />
-      </el-form-item>
-      <el-form-item label="状态">
-        <el-select v-model="queryParams.status" placeholder="选择摄像机状态">
-          <el-option label="所有" :value="0" />
-          <el-option label="在线" :value="10" />
-          <el-option label="离线" :value="20" />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="Plus" @click="handleAdd">
-          新增
-        </el-button>
-      </el-col>
-      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+	<div class="app-container">
+		<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="100px">
+			<el-form-item label="摄像机名称" prop="camera_name">
+				<el-input v-model="queryParams.camera_name" placeholder="请输入摄像机名称" clearable
+					@keyup.enter="handleQuery" />
+			</el-form-item>
+			<el-form-item label="状态">
+				<el-select v-model="queryParams.status" placeholder="选择摄像机状态">
+					<el-option label="所有" :value="0" />
+					<el-option label="在线" :value="10" />
+					<el-option label="离线" :value="20" />
+				</el-select>
+			</el-form-item>
+			<el-form-item>
+				<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+				<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+			</el-form-item>
+		</el-form>
+		<el-row :gutter="10" class="mb8">
+			<el-col :span="1.5">
+				<el-button type="primary" plain icon="Plus" @click="handleAdd">
+					新增
+				</el-button>
+			</el-col>
+			<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+		</el-row>
 
-    <div v-loading="loading">
-      <div class="grid col-5">
-        <div class="padding-xs" v-for="(item, i) in cameraList" :key="i">
-          <el-card :body-style="{ padding: '0px' }" shadow="hover">
-			  <img :src="cameraPict[item.camera_id]" @click.stop="seeImg(item.camera_id)" style="height: 130px; width: 100%" />
-            <!-- <img :src="baseUrl+'/alarm_folder/html_images/asd.png'" style="height: 130px; width: 100%" /> -->
-            <div class="padding-sm">
-              <div class="flex justify-between align-center">
-                <div>{{ item.camera_name }}</div>
-                <!-- <el-checkbox label="camera_id" name="type">{{ item.camera_name }}</el-checkbox> -->
-                <div>
-                  <el-button text link icon="Edit" type="text" @click="handleUpdate(item)"></el-button>
-                  <el-button text link icon="Delete" type="text" @click="handleDelete(item)"></el-button>
-                </div>
-              </div>
-              <div>
-                <!-- <el-button text bg>绘制监控区域</el-button> -->
-              </div>
-            </div>
-          </el-card>
-        </div>
-      </div>
-    </div>
-    <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize" @pagination="getList" />
+		<div v-loading="loading">
+			<div class="grid col-5">
+				<div class="padding-xs" v-for="(item, i) in cameraList" :key="i">
+					<el-card :body-style="{ padding: '0px' }" shadow="hover">
+						<img :src="cameraPict[item.camera_id]" @click.stop="seeImg(item.camera_id)"
+							style="height: 130px; width: 100%" />
+						<!-- <img :src="baseUrl+'/alarm_folder/html_images/asd.png'" style="height: 130px; width: 100%" /> -->
+						<div class="padding-sm">
+							<div class="flex justify-between align-center">
+								<div class="text-sm">
+									<div>{{ item.camera_name }}</div>
+									<div>{{ item.camera_ip }}</div>
+								</div>
+								<!-- <el-checkbox label="camera_id" name="type">{{ item.camera_name }}</el-checkbox> -->
+								<div>
+									<el-tooltip class="item" effect="dark" content="修改" placement="top">
+										<el-button link style="color: var(--green);" icon="Edit" type="text" @click="handleUpdate(item)"></el-button>
+									</el-tooltip>
+									<el-tooltip class="item" effect="dark" content="删除" placement="top">
+										<el-button link icon="Delete" type="text" style="color: var(--red);" @click="handleDelete(item)"></el-button>
+									</el-tooltip>
+									<br>
+									<el-tooltip class="item" effect="dark" content="抓拍" placement="top">
+										<el-button link icon="Picture" style="color: var(--blue);" type="text" @click="handleSnap(item)"></el-button>
+									</el-tooltip>
+									<el-tooltip class="item" effect="dark" content="录像" placement="top">
+										<el-button link icon="VideoCamera" style="color: var(--blue);" type="text" @click="handleRecord(item)"></el-button>
+									</el-tooltip>
+								</div>
+							</div>
+							<div>
+								<!-- <el-button text bg>绘制监控区域</el-button> -->
+							</div>
+						</div>
+					</el-card>
+				</div>
+			</div>
+		</div>
+		<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
+			v-model:limit="queryParams.pageSize" @pagination="getList" />
 
-    <!-- 添加或修改摄像机列对话框 -->
-    <el-dialog :title="title" v-model="open" width="800px">
-      <!-- {{ form }} -->
-      <el-form ref="cameraRef" :model="form" :rules="rules" label-width="120px">
-        <el-form-item>
-			<el-button type="primary" v-if="form.camera_id != null" @click="copyForm">复制</el-button>
-			<el-button @click="pastForm" v-if="copyFormVal.camera_type != undefined">粘贴</el-button>
-        </el-form-item>
-		<div class="grid col-2">
-          <el-form-item label="摄像机名称" prop="camera_name">
-            <el-input v-model="form.camera_name" placeholder="请输入摄像机名称" />
-          </el-form-item>
-          <el-form-item label="摄像头类型" prop="camera_type" class="flex">
-            <el-select class="flex-sub" v-model="form.camera_type" placeholder="请选择摄像头类型">
-              <el-option label="其他" :value="0" />
-              <el-option label="鱼眼" :value="10" />
-              <el-option label="半球" :value="20" />
-              <el-option label="球机" :value="30" />
-              <el-option label="枪机" :value="40" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="设备类型" prop="camera_equipment_type" class="flex">
-            <el-select class="flex-sub" v-model="form.camera_equipment_type" placeholder="请选择设备类型">
-              <el-option label="摄像头" :value="0" />
-              <el-option label="人脸抓拍机" :value="10" />
-              <el-option label="RTSP" :value="20" />
-              <el-option label="NVR" :value="30" />
-              <el-option label="国标平台" :value="40" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="用户账号" prop="camera_user_name">
-            <el-input v-model="form.camera_user_name" placeholder="请输入用户账号" />
-          </el-form-item>
-          <el-form-item label="密码" prop="camera_password">
-            <el-input v-model="form.camera_password" placeholder="请输入密码" type="password" show-password />
-          </el-form-item>
-          <el-form-item label="IP" prop="camera_ip">
-            <el-input v-model="form.camera_ip" placeholder="请输入IP" />
-          </el-form-item>
-          <el-form-item label="端口" prop="camera_port">
-            <el-input v-model="form.camera_port" placeholder="请输入端口" type="number" />
-          </el-form-item>
-          <el-form-item label="品牌" prop="camera_brand" class="flex">
-            <el-select v-model="form.camera_brand" @change="changeCarm" placeholder="请选择品牌" class="flex-sub">
-              <el-option label="其他" :value="0" />
-              <el-option label="海康" :value="10" />
-              <el-option label="大华" :value="20" />
-              <el-option label="华为" :value="30" />
-              <el-option label="宇视" :value="40" />
-              <el-option label="天地伟业" :value="50" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="型号">
-            <el-input v-model="form.camera_model" placeholder="请输入型号" />
-          </el-form-item>
-          <el-form-item label="出入检测类型" prop="camera_access_detection_type" class="flex">
-            <el-select v-model="form.camera_access_detection_type" placeholder="请选择出入检测类型" class="flex-sub">
-              <el-option label="无" :value="0" />
-              <el-option label="离开" :value="10" />
-              <el-option label="进入" :value="20" />
-            </el-select>
-          </el-form-item>
-          <el-form-item prop="camera_rtsp" style="width:100%">
-			  <template #label>
-			     <span>
-			        <el-tooltip content="请修改rtsp路径模板正确的账号/密码/ip" placement="top">
-			           <el-icon>
-			              <question-filled />
-			           </el-icon>
-			        </el-tooltip>rtsp地址
-			     </span>
-			  </template>
-            <el-input v-model="form.camera_rtsp" placeholder="请输入rtsp地址" style="width:calc(100% - 82px);"/>
-			<el-button class="margin-left-sm" size="small" type="primary" :disabled="rtspDis" @click="conFirmRtsp">地址诊断</el-button>
-          </el-form-item>
-          <el-form-item label="国标id">
-            <el-input v-model="form.camera_national_id" placeholder="请输入国标id" />
-          </el-form-item>
-          <el-form-item label="帐号状态" prop="status" style="width:100%">
-            <el-radio-group v-model="form.status">
-              <el-radio label="0">启用</el-radio>
-              <el-radio label="1">停用</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </div>
-        <el-form-item label="封面" prop="cover">
-          <image-upload v-model="form.cover" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" placeholder="请输入备注" type="textarea" :rows="4" />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
-	<el-dialog
-	  title="图片预览"
-	  top="20px"
-	  v-model="imgVisible"
-	  width="80%">
-		<img :src="imgSrc" style="width:100%;" alt="">
-	</el-dialog>
-  </div>
+		<!-- 添加或修改摄像机列对话框 -->
+		<el-dialog :title="title" v-model="open" width="800px">
+			<!-- {{ form }} -->
+			<el-form ref="cameraRef" :model="form" :rules="rules" label-width="120px">
+				<el-form-item>
+					<el-button type="primary" v-if="form.camera_id != null" @click="copyForm">复制</el-button>
+					<el-button @click="pastForm" v-if="copyFormVal.camera_type != undefined">粘贴</el-button>
+				</el-form-item>
+				<div class="grid col-2">
+					<el-form-item label="摄像机名称" prop="camera_name">
+						<el-input v-model="form.camera_name" placeholder="请输入摄像机名称" />
+					</el-form-item>
+					<el-form-item label="摄像头类型" prop="camera_type" class="flex">
+						<el-select class="flex-sub" v-model="form.camera_type" placeholder="请选择摄像头类型">
+							<el-option label="其他" :value="0" />
+							<el-option label="鱼眼" :value="10" />
+							<el-option label="半球" :value="20" />
+							<el-option label="球机" :value="30" />
+							<el-option label="枪机" :value="40" />
+						</el-select>
+					</el-form-item>
+					<el-form-item label="设备类型" prop="camera_equipment_type" class="flex">
+						<el-select class="flex-sub" v-model="form.camera_equipment_type" placeholder="请选择设备类型">
+							<el-option label="摄像头" :value="0" />
+							<el-option label="人脸抓拍机" :value="10" />
+							<el-option label="RTSP" :value="20" />
+							<el-option label="NVR" :value="30" />
+							<el-option label="国标平台" :value="40" />
+						</el-select>
+					</el-form-item>
+					<el-form-item label="用户账号" prop="camera_user_name">
+						<el-input v-model="form.camera_user_name" placeholder="请输入用户账号" />
+					</el-form-item>
+					<el-form-item label="密码" prop="camera_password">
+						<el-input v-model="form.camera_password" placeholder="请输入密码" type="password" show-password />
+					</el-form-item>
+					<el-form-item label="IP" prop="camera_ip">
+						<el-input v-model="form.camera_ip" placeholder="请输入IP" />
+					</el-form-item>
+					<el-form-item label="端口" prop="camera_port">
+						<el-input v-model="form.camera_port" placeholder="请输入端口" type="number" />
+					</el-form-item>
+					<el-form-item label="品牌" prop="camera_brand" class="flex">
+						<el-select v-model="form.camera_brand" @change="changeCarm" placeholder="请选择品牌"
+							class="flex-sub">
+							<el-option label="其他" :value="0" />
+							<el-option label="海康" :value="10" />
+							<el-option label="大华" :value="20" />
+							<el-option label="华为" :value="30" />
+							<el-option label="宇视" :value="40" />
+							<el-option label="天地伟业" :value="50" />
+						</el-select>
+					</el-form-item>
+					<el-form-item label="型号">
+						<el-input v-model="form.camera_model" placeholder="请输入型号" />
+					</el-form-item>
+					<el-form-item label="出入检测类型" prop="camera_access_detection_type" class="flex">
+						<el-select v-model="form.camera_access_detection_type" placeholder="请选择出入检测类型" class="flex-sub">
+							<el-option label="无" :value="0" />
+							<el-option label="离开" :value="10" />
+							<el-option label="进入" :value="20" />
+						</el-select>
+					</el-form-item>
+					<el-form-item prop="camera_rtsp" style="width:100%">
+						<template #label>
+							<span>
+								<el-tooltip content="请修改rtsp路径模板正确的账号/密码/ip" placement="top">
+									<el-icon>
+										<question-filled />
+									</el-icon>
+								</el-tooltip>rtsp地址
+							</span>
+						</template>
+						<el-input v-model="form.camera_rtsp" placeholder="请输入rtsp地址" style="width:calc(100% - 82px);" />
+						<el-button class="margin-left-sm" size="small" type="primary" :disabled="rtspDis"
+							@click="conFirmRtsp">地址诊断</el-button>
+					</el-form-item>
+					<el-form-item label="国标id">
+						<el-input v-model="form.camera_national_id" placeholder="请输入国标id" />
+					</el-form-item>
+					<el-form-item label="帐号状态" prop="status" style="width:100%">
+						<el-radio-group v-model="form.status">
+							<el-radio label="0">启用</el-radio>
+							<el-radio label="1">停用</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</div>
+				<el-form-item label="封面" prop="cover">
+					<image-upload v-model="form.cover" />
+				</el-form-item>
+				<el-form-item label="备注" prop="remark">
+					<el-input v-model="form.remark" placeholder="请输入备注" type="textarea" :rows="4" />
+				</el-form-item>
+			</el-form>
+			<template #footer>
+				<div class="dialog-footer">
+					<el-button type="primary" @click="submitForm">确 定</el-button>
+					<el-button @click="cancel">取 消</el-button>
+				</div>
+			</template>
+		</el-dialog>
+		<el-dialog title="图片预览" top="20px" v-model="imgVisible" width="80%">
+			<img :src="imgSrc" style="width:100%;" alt="">
+		</el-dialog>
+	</div>
 </template>
 
 <script setup>
-import {
-  listCamera,
-  getCamera,
-  delCamera,
-  addCamera,
-  updateCamera,
-  downloadCamera,
-  getCameraPhoto
-} from "@/api/camera";
-import { pingRTSP } from "@/api/settConfiguration"
-import { deviceSystem } from "@/api/settConfiguration"
-const baseUrl = location.protocol+"//"+window.location.host+"/";
-// const baseUrl = import.meta.env.VITE_APP_BASE_API;
-const { proxy } = getCurrentInstance();
-const showSearch = ref(true);
-const total = ref(0);
-const loading = ref(true);
-const open = ref(false);
-const rtspDis = ref(false);
-const title = ref("");
-const ids = ref([]);
+	import {
+		listCamera,
+		getCamera,
+		delCamera,
+		addCamera,
+		updateCamera,
+		downloadCamera,
+		getCameraPhoto
+	} from "@/api/camera";
+	import {
+		pingRTSP
+	} from "@/api/settConfiguration"
+	import {
+		deviceSystem,
+		distributeImg,
+		distributeVideo,
+		getVIConfig
+	} from "@/api/settConfiguration"
+	const baseUrl = location.protocol + "//" + window.location.host + "/";
+	// const baseUrl = import.meta.env.VITE_APP_BASE_API;
+	const {
+		proxy
+	} = getCurrentInstance();
+	const showSearch = ref(true);
+	const total = ref(0);
+	const loading = ref(true);
+	const open = ref(false);
+	const rtspDis = ref(false);
+	const title = ref("");
+	const ids = ref([]);
 
-const cameraList = ref([]);
-const cameraPict = ref({});
-const cameraTotalList = ref([]);
-const imgVisible = ref(false);
-const imgSrc = ref("");
-var copyFormVal = ref({});
+	const cameraList = ref([]);
+	const cameraPict = ref({});
+	const cameraTotalList = ref([]);
+	const imgVisible = ref(false);
+	const imgSrc = ref("");
+	var copyFormVal = ref({});
+	var videoSend = 0;
+	const data = reactive({
+		form: {
+			camera_id: null,
+			status: 0,
+			camera_type: 0,
+			camera_brand: 0,
+			camera_access_detection_type: 0,
+			camera_equipment_type: 0,
+			camera_rtsp: ""
+		},
+		queryParams: {
+			pageNum: 1,
+			pageSize: 10,
+			// camera_name: null,
+		},
+		rules: {
+			camera_name: [{
+				required: true,
+				message: "摄像机名称不能为空",
+				trigger: "blur",
+			}, ],
+			camera_type: [{
+				required: true,
+				message: "摄像头类型不能为空",
+				trigger: "blur",
+			}, ],
+			camera_equipment_type: [{
+				required: true,
+				message: "设备类型不能为空",
+				trigger: "blur",
+			}, ],
+			camera_user_name: [{
+				required: true,
+				message: "用户账号不能为空",
+				trigger: "blur",
+			}, ],
+			camera_password: [{
+				required: true,
+				message: "密码不能为空",
+				trigger: "blur",
+			}, ],
+			camera_ip: [{
+				required: true,
+				message: "IP不能为空",
+				trigger: "blur",
+			}, ],
+			camera_port: [{
+				required: true,
+				message: "端口不能为空",
+				trigger: "blur",
+			}, ],
+			camera_brand: [{
+				required: true,
+				message: "品牌不能为空",
+				trigger: "blur",
+			}, ],
+			camera_access_detection_type: [{
+				required: true,
+				message: "出入检测类型不能为空",
+				trigger: "blur",
+			}, ],
+			camera_rtsp: [{
+				required: true,
+				message: "rtsp地址不能为空",
+				trigger: "blur",
+			}, ],
+			status: [{
+				required: true,
+				message: "帐号状态不能为空",
+				trigger: "blur",
+			}, ],
+		},
+		brandRtsp: {
+			"0": "",
+			"10": "rtsp://admin:12345@192.0.0.64:554/h264/ch1/main/av_stream",
+			"20": "rtsp://admin:123456@192.0.0.68:554/cam/realmonitor?channel=1&subtype=0",
+			"30": "rtsp://admin:admin123@192.168.1.110/LiveMedia/ch1/Media2",
+			"40": "rtsp://admin:admin123@192.168.1.107/media/video2",
+			"50": ""
+		}
+	});
 
-const data = reactive({
-  form: {
-	  camera_id: null,
-    status: 0,
-    camera_type: 0,
-    camera_brand: 0,
-    camera_access_detection_type: 0,
-    camera_equipment_type: 0,
-	camera_rtsp: ""
-  },
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    // camera_name: null,
-  },
-  rules: {
-    camera_name: [
-      {
-        required: true,
-        message: "摄像机名称不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_type: [
-      {
-        required: true,
-        message: "摄像头类型不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_equipment_type: [
-      {
-        required: true,
-        message: "设备类型不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_user_name: [
-      {
-        required: true,
-        message: "用户账号不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_password: [
-      {
-        required: true,
-        message: "密码不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_ip: [
-      {
-        required: true,
-        message: "IP不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_port: [
-      {
-        required: true,
-        message: "端口不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_brand: [
-      {
-        required: true,
-        message: "品牌不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_access_detection_type: [
-      {
-        required: true,
-        message: "出入检测类型不能为空",
-        trigger: "blur",
-      },
-    ],
-    camera_rtsp: [
-      {
-        required: true,
-        message: "rtsp地址不能为空",
-        trigger: "blur",
-      },
-    ],
-    status: [
-      {
-        required: true,
-        message: "帐号状态不能为空",
-        trigger: "blur",
-      },
-    ],
-  },
-	brandRtsp:{
-		"0":"",
-		"10":"rtsp://admin:12345@192.0.0.64:554/h264/ch1/main/av_stream",
-		"20":"rtsp://admin:123456@192.0.0.68:554/cam/realmonitor?channel=1&subtype=0",
-		"30":"rtsp://admin:admin123@192.168.1.110/LiveMedia/ch1/Media2",
-		"40":"rtsp://admin:admin123@192.168.1.107/media/video2",
-		"50":""
-	}
-});
+	const {
+		queryParams,
+		form,
+		rules,
+		brandRtsp
+	} = toRefs(data);
 
-const { queryParams, form, rules, brandRtsp } = toRefs(data);
+	/** 查询摄像机列列表 */
+	function getList() {
+		loading.value = true;
+		listCamera(queryParams.value).then((response) => {
+			cameraList.value = response.data;
+			// console.log((queryParams.value.pageNum - 1) * queryParams.value.pageSize, (queryParams.value.pageNum - 1) * queryParams.value.pageSize + queryParams.value.pageSize)
+			// cameraList.value = response.data.slice((queryParams.value.pageNum - 1) * queryParams.value.pageSize, (queryParams.value.pageNum - 1) * queryParams.value.pageSize + queryParams.value.pageSize)
+			total.value = response.total;
+			loading.value = false;
+			getPhoto();
+		});
+	}
 
-/** 查询摄像机列列表 */
-function getList() {
-  loading.value = true;
-  listCamera(queryParams.value).then((response) => {
-    cameraList.value = response.data;
-    // console.log((queryParams.value.pageNum - 1) * queryParams.value.pageSize, (queryParams.value.pageNum - 1) * queryParams.value.pageSize + queryParams.value.pageSize)
-    // cameraList.value = response.data.slice((queryParams.value.pageNum - 1) * queryParams.value.pageSize, (queryParams.value.pageNum - 1) * queryParams.value.pageSize + queryParams.value.pageSize)
-    total.value = response.total;
-    loading.value = false;
-	getPhoto();
-  });
-}
-function changeCarm(val){
-	form.value.camera_rtsp = brandRtsp.value[val]
-}
-/** 搜索按钮操作 */
-function handleQuery() {
-  queryParams.value.pageNum = 1;
-  getList();
-}
+	function changeCarm(val) {
+		form.value.camera_rtsp = brandRtsp.value[val]
+	}
+	/** 搜索按钮操作 */
+	function handleQuery() {
+		queryParams.value.pageNum = 1;
+		getList();
+	}
 
-/** 重置按钮操作 */
-function resetQuery() {
-  proxy.resetForm("queryRef");
-  handleQuery();
-}
+	/** 重置按钮操作 */
+	function resetQuery() {
+		proxy.resetForm("queryRef");
+		handleQuery();
+	}
 
-/** 新增按钮操作 */
-function handleAdd() {
-  reset();
-  open.value = true;
-  title.value = "添加摄像机";
-}
+	/** 新增按钮操作 */
+	function handleAdd() {
+		reset();
+		open.value = true;
+		title.value = "添加摄像机";
+	}
 
-// 取消按钮
-function cancel() {
-  open.value = false;
-  reset();
-}
-// 复制按钮
-function copyForm(){
-	let _obj = JSON.parse(JSON.stringify(form.value));
-	_obj["camera_id"] = null;
-	copyFormVal.value = _obj;
-	proxy.$modal.msgSuccess("复制成功");
-}
-// 粘贴按钮
-function pastForm(){
-	if(copyFormVal.value["camera_type"] != undefined){
-		if(form.value["camera_id"] == null){
-			form.value = JSON.parse(JSON.stringify(copyFormVal.value));
-		}else{
-			copyFormVal.value["camera_id"] = form.value["camera_id"];
-			form.value = JSON.parse(JSON.stringify(copyFormVal.value));
+	// 取消按钮
+	function cancel() {
+		open.value = false;
+		reset();
+	}
+	// 复制按钮
+	function copyForm() {
+		let _obj = JSON.parse(JSON.stringify(form.value));
+		_obj["camera_id"] = null;
+		copyFormVal.value = _obj;
+		proxy.$modal.msgSuccess("复制成功");
+	}
+	// 粘贴按钮
+	function pastForm() {
+		if (copyFormVal.value["camera_type"] != undefined) {
+			if (form.value["camera_id"] == null) {
+				form.value = JSON.parse(JSON.stringify(copyFormVal.value));
+			} else {
+				copyFormVal.value["camera_id"] = form.value["camera_id"];
+				form.value = JSON.parse(JSON.stringify(copyFormVal.value));
+			}
 		}
 	}
-}
-// 表单重置
-function reset() {
-  form.value = {
-	camera_id: null,
-    status: 0,
-    camera_type: 0,
-    camera_brand: 0,
-    camera_access_detection_type: 0,
-    camera_equipment_type: 0,
-	camera_rtsp: ""
-  };
-  proxy.resetForm("cameraRef");
-}
+	// 表单重置
+	function reset() {
+		form.value = {
+			camera_id: null,
+			status: 0,
+			camera_type: 0,
+			camera_brand: 0,
+			camera_access_detection_type: 0,
+			camera_equipment_type: 0,
+			camera_rtsp: ""
+		};
+		proxy.resetForm("cameraRef");
+	}
 
-/** 提交按钮 */
-function submitForm() {
-  proxy.$refs["cameraRef"].validate((valid) => {
-    if (valid) {
-      if (form.value.camera_id != null) {
-        updateCamera(form.value).then((response) => {
-          proxy.$modal.msgSuccess("修改成功");
-          open.value = false;
-          getList();
-		  reStart();
-        });
-      } else {
-        addCamera(form.value).then((response) => {
-          proxy.$modal.msgSuccess("新增成功");
-          open.value = false;
-          getList();
-		  reStart();
-        });
-      }
-    }
-  });
-}
-function reStart(){
-	proxy.$modal.confirm('算法设置完成，需要重启设备方可生效，是否现在重启！').then(function () {
-		deviceSystem('shutdown').then((response) => {
-			setTimeout(()=>{
-				deviceSystem('start').then((response) => {})
-			},3000)
-		})
-	}).then(() => {
-		
-	}).catch(() => { });
-}
-function handleUpdate(row) {
-  reset();
-  const camera_id =
-    row.camera_id || ids.value
-  getCamera(camera_id).then(response => {
-    // proxy.$modal.msg(JSON.stringify(response.data));
-    form.value = response.data[0];
-    open.value = true;
-    title.value = "修改摄像头配置信息";
-  });
+	/** 提交按钮 */
+	function submitForm() {
+		proxy.$refs["cameraRef"].validate((valid) => {
+			if (valid) {
+				if (form.value.camera_id != null) {
+					updateCamera(form.value).then((response) => {
+						proxy.$modal.msgSuccess("修改成功");
+						open.value = false;
+						getList();
+						reStart();
+					});
+				} else {
+					addCamera(form.value).then((response) => {
+						proxy.$modal.msgSuccess("新增成功");
+						open.value = false;
+						getList();
+						reStart();
+					});
+				}
+			}
+		});
+	}
 
-  // form.value = cameraList.value.filter(item => item.camera_id == camera_id)[0]
-  // open.value = true;
-  // title.value = "修改摄像头配置信息";
-}
+	function reStart() {
+		proxy.$modal.confirm('算法设置完成，需要重启设备方可生效，是否现在重启！').then(function() {
+			deviceSystem('shutdown').then((response) => {
+				setTimeout(() => {
+					deviceSystem('start').then((response) => {})
+				}, 3000)
+			})
+		}).then(() => {
 
-function handleDelete(row) {
-  proxy.$modal.confirm('是否确认摄像头名称为"' + row.camera_name + '"的数据项？').then(function () {
-    return delCamera(row.camera_id);
-  }).then(() => {
-    getList();
-    proxy.$modal.msgSuccess("删除成功");
-  }).catch(() => { });
-}
+		}).catch(() => {});
+	}
 
-getList();
-var _len = 0;
-const getPhoto = function(key){
-	if(cameraList.value.length){
-		let _obj = cameraList.value, imgPict = {}, rtspStr = "";
-		_obj.forEach((item,idnex) => {
-			let _thor = 0;
-			if(item.camera_brand == 20){
-				_thor = item.camera_rtsp.split("channel=")[1].split("&")[0];
-			}else if(item.camera_brand == 10){
-				_thor = item.camera_rtsp.split("h264/ch")[1].split("/")[0];
-			}else if(item.camera_brand == 30){
-				_thor = item.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
-			}
-			rtspStr += item.camera_rtsp + ",";
-			imgPict[item.camera_id] = baseUrl+"alarm_folder/display_image/"+(item.camera_ip+"_"+_thor)+"_small.jpg";
+	function handleUpdate(row) {
+		reset();
+		const camera_id =
+			row.camera_id || ids.value
+		getCamera(camera_id).then(response => {
+			// proxy.$modal.msg(JSON.stringify(response.data));
+			form.value = response.data[0];
+			open.value = true;
+			title.value = "修改摄像头配置信息";
 		});
-		cameraPict.value= imgPict;
-		cycleCamera(rtspStr, imgPict);
+
+		// form.value = cameraList.value.filter(item => item.camera_id == camera_id)[0]
+		// open.value = true;
+		// title.value = "修改摄像头配置信息";
+	}
+
+	function handleDelete(row) {
+		proxy.$modal.confirm('是否确认摄像头名称为"' + row.camera_name + '"的数据项？').then(function() {
+			return delCamera(row.camera_id);
+		}).then(() => {
+			getList();
+			proxy.$modal.msgSuccess("删除成功");
+		}).catch(() => {});
 	}
-}
-const cycleCamera = function(key, xju){
-	getCameraPhoto(key.slice(0, -1)).then((response)=>{
-		setTimeout(()=>{
-			cameraPict.value = {};
-			cameraPict.value = xju;
-		},3000)
-	})
-}
-function seeImg(_src){
-	imgVisible.value = true;
-	imgSrc.value = cameraPict.value[_src].replace('_small','');
-};
-// const getPhoto = function(key){
-// 	_len = 0;
-// 	if(cameraList.value.length){
-// 		cycleCamera();
-// 	}
-// }
-// const cycleCamera = function(key){
-// 	let _obj = cameraList.value;
-// 	let _acb = _obj[_len];
-// 	let _thor = 0;
-// 	if(_acb.camera_brand == 20){
-// 		_thor = _acb.camera_rtsp.split("channel=")[1].split("&")[0];
-// 	}else if(_acb.camera_brand == 10){
-// 		_thor = _acb.camera_rtsp.split("h264/ch")[1].split("/")[0];
-// 	}else if(_acb.camera_brand == 30){
-// 		_thor = _acb.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
-// 	}
-// 	// cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip.split(".")[2]+"."+_acb.camera_ip.split(".")[3])+".jpg";
-// 	cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip+"_"+_thor)+"_small.jpg";
-// 	getCameraPhoto(_acb.camera_rtsp).then((response)=>{
-// 		 _len += 1;
-// 		setTimeout(()=>{
-// 			cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip+"_"+_thor)+"_small.jpg";
-// 		},4000)
-// 		if(_len<_obj.length){
-// 			cycleCamera();
-// 		}
-// 	})
-// }
-const conFirmRtsp = function(){
-	if(form.value.camera_rtsp != ""){
-		rtspDis.value = true;
-		pingRTSP(form.value.camera_rtsp ).then((response) => {
+	var timeOutImg = null;
+	function handleSnap(row) {
+		distributeImg({"rtsp": row.camera_rtsp}).then((response) => {
 			if(response.code == 200){
-				proxy.$modal.alert((response.data[1].success == 'true'?"连接成功":"连接失败"), {
-					confirmButtonText: '确定',
-					callback: action => {
-					}
+				proxy.$notify({
+					title: '消息',
+					message: "抓拍成功",
+					type: 'success'
 				});
-				rtspDis.value = false;
+				clearTimeout(timeOutImg);
+				timeOutImg = setTimeout(()=>{
+					window.open(baseUrl + response.data[1].path);
+				},3000)
 			}
 		})
-	}else{
-		proxy.$modal.alert("请先填写正确的视频rtsp地址", {
-			confirmButtonText: '确定',
-			callback: action => {
+	}
+	var timeOut = null;
+	function handleRecord(row) {
+		if(videoSend == 0){
+			proxy.$modal.msgWarning("请先配置需要录像的时长！！！");
+			return;
+		}
+		distributeVideo({"rtsp": row.camera_rtsp}).then((response) => {
+			if(response.code == 200){
+				proxy.$notify.info({
+					title: '消息',
+					message: `预计需要${(videoSend/1000)>59?(parseInt(videoSend/1000/60)+"分钟"):((videoSend/1000)+"秒钟")}，视频录像中....`,
+					duration: videoSend
+				});
+				clearTimeout(timeOut);
+				timeOut = setTimeout(()=>{
+					window.open(baseUrl + response.data[1].path);
+					// let a = document.createElement('a');
+					// a.setAttribute("target", "_blank");
+					// a.href = "http://10.60.11.234/cap/file_out.mp4";
+					// a.click();
+				},videoSend)
 			}
-		});
+		})
+	}
+	var _len = 0;
+	const getPhoto = function(key) {
+		if (cameraList.value.length) {
+			let _obj = cameraList.value,
+				imgPict = {},
+				rtspStr = "";
+			_obj.forEach((item, idnex) => {
+				let _thor = 0;
+				if(item.camera_rtsp.indexOf(".mp4") == -1){
+					if(item.camera_rtsp.indexOf("channel=") != -1){
+						_thor = item.camera_rtsp.split("channel=")[1].split("&")[0];
+					}else if(item.camera_rtsp.indexOf("Streaming/Channels") != -1){
+						_thor = item.camera_rtsp.split("Streaming/Channels/")[1];
+					}else if(item.camera_rtsp.indexOf("h264/ch") != -1){
+						_thor = item.camera_rtsp.split("h264/ch")[1].split("/")[0];
+					}else if (item.camera_rtsp.indexOf("LiveMedia/ch") != -1) {
+						_thor = item.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
+					}
+					imgPict[item.camera_id] = baseUrl + "alarm_folder/display_image/" + (item.camera_ip + "_" +
+						_thor) + "_small.jpg";
+				}else{ 
+					let _mhlk = item.camera_rtsp.split("/");
+					_thor = _mhlk[_mhlk.length - 1];
+					imgPict[item.camera_id] = baseUrl + "alarm_folder/display_image/" + _thor + ".jpg";
+				}
+				rtspStr += item.camera_rtsp + ",";
+				
+			});
+			cameraPict.value = imgPict;
+			cycleCamera(rtspStr, imgPict);
+		}
+	}
+	const cycleCamera = function(key, xju) {
+		getCameraPhoto(key.slice(0, -1)).then((response) => {
+			setTimeout(() => {
+				cameraPict.value = {};
+				cameraPict.value = xju;
+			}, 3000)
+		})
+	}
+
+	function seeImg(_src) {
+		imgVisible.value = true;
+		imgSrc.value = cameraPict.value[_src].replace('_small', '');
+	};
+	// const getPhoto = function(key){
+	// 	_len = 0;
+	// 	if(cameraList.value.length){
+	// 		cycleCamera();
+	// 	}
+	// }
+	// const cycleCamera = function(key){
+	// 	let _obj = cameraList.value;
+	// 	let _acb = _obj[_len];
+	// 	let _thor = 0;
+	// 	if(_acb.camera_brand == 20){
+	// 		_thor = _acb.camera_rtsp.split("channel=")[1].split("&")[0];
+	// 	}else if(_acb.camera_brand == 10){
+	// 		_thor = _acb.camera_rtsp.split("h264/ch")[1].split("/")[0];
+	// 	}else if(_acb.camera_brand == 30){
+	// 		_thor = _acb.camera_rtsp.split("LiveMedia/ch")[1].split("/")[0];
+	// 	}
+	// 	// cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip.split(".")[2]+"."+_acb.camera_ip.split(".")[3])+".jpg";
+	// 	cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip+"_"+_thor)+"_small.jpg";
+	// 	getCameraPhoto(_acb.camera_rtsp).then((response)=>{
+	// 		 _len += 1;
+	// 		setTimeout(()=>{
+	// 			cameraPict.value[_acb.camera_id] = baseUrl+"alarm_folder/display_image/"+(_acb.camera_ip+"_"+_thor)+"_small.jpg";
+	// 		},4000)
+	// 		if(_len<_obj.length){
+	// 			cycleCamera();
+	// 		}
+	// 	})
+	// }
+	const conFirmRtsp = function() {
+		if (form.value.camera_rtsp != "") {
+			rtspDis.value = true;
+			pingRTSP(form.value.camera_rtsp).then((response) => {
+				if (response.code == 200) {
+					proxy.$modal.alert((response.data[1].success == 'true' ? "连接成功" : "连接失败"), {
+						confirmButtonText: '确定',
+						callback: action => {}
+					});
+					rtspDis.value = false;
+				}
+			})
+		} else {
+			proxy.$modal.alert("请先填写正确的视频rtsp地址", {
+				confirmButtonText: '确定',
+				callback: action => {}
+			});
+		}
+	}
+	total.value = cameraList.value.length;
+	loading.value = false;
+	const getVIInfo = function(){
+		getVIConfig().then((response) => {
+			if(response.code == 200){
+				let _obj = response.data[1];
+				let _long = (_obj.nvr_time + "").split(":");
+				let send = 0;
+				if(_long.length > 2){
+					send = (parseInt(_long[0])*3600 + parseInt(_long[1])*60 + parseInt(_long[2]))*1000 + 5000;
+				}
+				videoSend = send;
+			}
+		})
 	}
-}
-total.value = cameraList.value.length;
-loading.value = false;
+	getList();
+	getVIInfo();
 </script>
 
 <style>

src/views/desktop/systemConfiguration/networkConfiguration.vue

@@ -68,6 +68,22 @@
 				"gateway": getIp(gateWay.value),
 				"dns_nameservers": getIp(dnsServers.value),
 			};
+			if(getCharCount(_ibj.address)){
+				proxy.$modal.msgError("IP地址不正确！");
+				return;
+			}
+			if(getCharCount(_ibj.netmask)){
+				proxy.$modal.msgError("子网掩码不正确！");
+				return;
+			}
+			if(getCharCount(_ibj.gateway)){
+				proxy.$modal.msgError("默认网关不正确！");
+				return;
+			}
+			if(getCharCount(_ibj.dns_nameservers)){
+				proxy.$modal.msgError("DNS服务器不正确！");
+				return;
+			}
 			setNetWork(_ibj).then((response) => {
 				if(response.code == 200){
 					getNetWorkInfo();
@@ -78,6 +94,11 @@
 			
 		});
 	}
+	const getCharCount = function(str, char){
+	    var result = str.match(/\./g);
+	    var count = !result ? 0 : result.length;
+	    return parseInt(count) > 3;
+	}
 	const getIp = function(_obj){
 		return _obj.oneInp + "." + _obj.twoInp + "." + _obj.thrInp + "." + _obj.fouInp;
 	}

src/views/desktop/systemConfiguration/pictureConfiguration.vue

@@ -9,8 +9,73 @@
 						:label="item.label"
 						:value="item.value">
 				    </el-option>
-				  </el-select>
-				  <el-button class="margin-left" type="primary" @click="conFirm">确定</el-button>
+				</el-select>
+				<el-button class="margin-left" type="primary" @click="conFirm">确定</el-button>
+			</el-form-item>
+			<div class="text-bold padding-top-xl margin-bottom">
+				录像/抓拍配置：
+			</div>
+			<el-form-item label="录像编码：">
+				<el-select v-model="videoImgInfo.nvr_code" placeholder="请选择">
+				    <el-option
+						v-for="(item,index) in videoCode"
+						:key="item.value"
+						:label="item.label"
+						:value="item.value">
+				    </el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="录像分辨率：">
+				<el-select v-model="videoImgInfo.nvr_size" placeholder="请选择">
+				    <el-option
+						v-for="(item,index) in resolutionRatio"
+						:key="item.value"
+						:label="item.label"
+						:value="item.value">
+				    </el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="录像时长：">
+				<el-time-picker v-model="videoImgInfo.nvr_time" 
+					:picker-options="{
+						selectableRange: '00:00:00 - 23:59:59'
+					}"
+					:clearable="false"
+				  placeholder="选择时间"></el-time-picker>
+			</el-form-item>
+			<el-form-item label="录像文件：">
+				<el-select v-model="videoImgInfo.nvr_type" placeholder="请选择">
+				    <el-option
+						v-for="(item,index) in videoType"
+						:key="item.value"
+						:label="item.label"
+						:value="item.value">
+				    </el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="图片类型：">
+				<el-select v-model="videoImgInfo.img_type" placeholder="请选择">
+				    <el-option
+						v-for="(item,index) in imageType"
+						:key="item.value"
+						:label="item.label"
+						:value="item.value">
+				    </el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="图片大小：">
+				<el-select v-model="videoImgInfo.img_size" placeholder="请选择">
+				    <el-option
+						v-for="(item,index) in resolutionRatio"
+						:key="item.value"
+						:label="item.label"
+						:value="item.value">
+				    </el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item label="">
+				<el-button icon="Refresh" @click="getVIInfo">重置</el-button>
+				<el-button class="margin-left" type="primary" @click="conVIFirm">确定</el-button>
 			</el-form-item>
 		</el-form>
 	</div>
@@ -18,12 +83,13 @@
 
 <script setup>
 	import IpInput from "@/views/components/IpInput/index";
-	import { getPictureConfig, setPictureConfig } from "@/api/settConfiguration"
+	import { getPictureConfig, setPictureConfig, getVIConfig, setVIConfig } from "@/api/settConfiguration"
 	const { proxy } = getCurrentInstance();
 	const baseUrl = location.protocol+"//"+window.location.host+"/";
 	// const baseUrl = import.meta.env.VITE_APP_BASE_API;
+	const videoImgInfo = ref({});
+	const pictureInfo = ref({});
 	const data = reactive({
-		pictureInfo: {},
 		pictureOptions: [{
 		    value: '0',
 		    label: '默认'
@@ -36,16 +102,66 @@
 		}, {
 		    value: '1080',
 		    label: '1080P (高级)'
-		}]
+		}],
+		videoCode: [{
+		    value: 'h264',
+		    label: 'h264'
+		}, {
+		    value: 'h265',
+		    label: 'h265'
+		}],
+		resolutionRatio: [{
+		    value: '720:480',
+		    label: '720*480'
+		}, {
+		    value: '1024:600',
+		    label: '1024*600'
+		}, {
+		    value: '1280:720',
+		    label: '1280*720'
+		}, {
+		    value: '1920:1080',
+		    label: '1920*1080'
+		}, {
+		    value: '2560:1440',
+		    label: '2560*1440'
+		}],
+		videoType: [{
+		    value: 'mp4',
+		    label: 'mp4'
+		}, {
+		    value: 'mkv',
+		    label: 'mkv'
+		}],
+		imageType: [{
+		    value: 'jpeg',
+		    label: 'jpeg'
+		}, {
+		    value: 'webp',
+		    label: 'webp'
+		}],
 	});
-	const { pictureInfo, pictureOptions } = toRefs(data);
+	const { pictureOptions, videoCode, resolutionRatio, videoType, imageType } = toRefs(data);
 	const conFirm = function(){
 		proxy.$modal.confirm('确认是否修改图片质量配置？')
 		.then(function () {
 			setPictureConfig(pictureInfo.value).then((response) => {
 				if(response.code == 200){
 					getPictureInfo();
-					editFirm.value = false;
+					proxy.$modal.msgSuccess("操作成功！");
+				}
+			})
+		}).catch(() => { 
+			
+		});
+	}
+	const conVIFirm = function(){
+		proxy.$modal.confirm('确认是否修改录像/抓拍配置？')
+		.then(function () {
+			videoImgInfo.value.nvr_time = proxy.parseTime(videoImgInfo.value.nvr_time,'{h}:{i}:{s}');
+			setVIConfig(videoImgInfo.value).then((response) => {
+				if(response.code == 200){
+					getVIInfo();
 					proxy.$modal.msgSuccess("操作成功！");
 				}
 			})
@@ -60,8 +176,18 @@
 			}
 		})
 	}
+	const getVIInfo = function(){
+		getVIConfig().then((response) => {
+			if(response.code == 200){
+				let _obj = response.data[1];
+				let _long = (_obj.nvr_time + "").split(":");
+				_obj.nvr_time = new Date(2016, 9, 10, (_long.length>2?_long[0]:'00'), (_long.length>2?_long[1]:'00'), (_long.length>2?_long[2]:'00'))
+				videoImgInfo.value = _obj;
+			}
+		})
+	}
 	getPictureInfo();
-	
+	getVIInfo();
 </script>
 
 <style>  

src/views/desktop/systemConfiguration/settConfiguration.vue

@@ -179,20 +179,20 @@
 		})
 	}
 	const getsbInfo = function(){
-		// deviceInfos.value = {
-		// 	autostart: "disable",
-		// 	boxTime: "2023-02-01 16:51:21",
-		// 	dataServer: "https://www.enstation.vip:9443-2023/zhaf_alarms?sn=yzkj_czp&url=alarm_folder/display_image/",
-		// 	id: "10",
-		// 	model: "ai-2",
-		// 	name: "广州货船897-1",
-		// 	status:"stop",
-		// 	taskNumber: "26",
-		// 	ver: "1.0.0.1"
-		// };
-		deviceInfo().then((response) => {
-			deviceInfos.value = response.data[1];
-		})
+		deviceInfos.value = {
+			autostart: "disable",
+			boxTime: "2023-02-01 16:51:21",
+			dataServer: "https://www.enstation.vip:9443-2023/zhaf_alarms?sn=yzkj_czp&url=alarm_folder/display_image/",
+			id: "10",
+			model: "ai-2",
+			name: "广州货船897-1",
+			status:"stop",
+			taskNumber: "26",
+			ver: "1.0.0.1"
+		};
+		// deviceInfo().then((response) => {
+		// 	deviceInfos.value = response.data[1];
+		// })
 	}
 	getsbInfo()
 </script>

vite.config.js

@@ -31,11 +31,16 @@ export default defineConfig(({ mode, command }) => {
       proxy: {
         // https://cn.vitejs.dev/config/#server-proxy
         '/dev-api': {
-		  // target: 'http://121.37.6.200:10051',
-		  target: 'http://10.60.11.234',
-          changeOrigin: true,
+		  // target: 'http://121.37.6.200:10011',
+		  target: 'http://121.37.6.200:10051',
+          changeOrigin: true,  
           rewrite: (p) => p.replace(/^\/dev-api/, '')
-        }
+        },
+		'/download': {
+			target: 'https://imgs-ali.51miz.com',
+			changeOrigin: true,
+			rewrite: (p) => p.replace(/^\/download/, '')
+		}
       }
     },
     //fix:error:stdin>:7356:1: warning: "@charset" must be the first rule in the file