Просмотр исходного кода

增加采集周期动态设置界面

chenwen 1 год назад
Родитель
Сommit
212d644f6f
2 измененных файлов с 89 добавлено и 0 удалено
  1. 23 0
      src/api/gatherConfig.js
  2. 66 0
      src/pages/sys/GatherConfig.vue

+ 23 - 0
src/api/gatherConfig.js

@@ -0,0 +1,23 @@
+import gatherRequest from '../utils/gatherRequest';
+
+const api={}
+
+api.loadCycle = ()=>{
+	return gatherRequest({
+	    url: '/api/cycle/load',
+		method: 'get'
+	});
+}
+
+api.setCycle = ({single,diagram,liquid})=>{
+	return gatherRequest({
+	    url: '/api/cycle/setting',
+		method: 'post',
+	    data:  {single,diagram,liquid}
+	});
+}
+
+
+
+
+export  default api

+ 66 - 0
src/pages/sys/GatherConfig.vue

@@ -0,0 +1,66 @@
+<template>
+	<div class="edit-page">
+		<el-form :model="formModel" ref="editForm"  label-width="auto">
+			<el-form-item label="单值采集周期(s)" prop="single">
+				<el-input-number v-model="formModel.single" :precision="0" :min="30"  :max="3600"/>
+			</el-form-item>
+			<el-form-item label="多值采集周期(s)" prop="diagram">
+				<el-input-number v-model="formModel.diagram" :precision="0" :min="300"  :max="7200"/>
+			</el-form-item>
+			<el-form-item label="动液面采集周期(s)" prop="liquid">
+				<el-input-number v-model="formModel.liquid" :precision="0" :min="600"  :max="14400"/>
+			</el-form-item>
+			
+			<el-button type="primary" style="width:280px;" @click="save">保存并应用</el-button>
+		</el-form>
+	</div>
+</template>
+
+<script setup>
+	import {reactive,ref,onMounted,toRaw} from 'vue'
+	import {ElMessageBox,ElMessage} from 'element-plus'
+	import api from '@/api/gatherConfig.js'
+	
+	const formModel = reactive({
+		single: 30,
+		diagram: 300,
+		liquid: 600
+	})
+	
+	onMounted(()=>{
+		load()
+	})
+	
+	const load=()=>{
+		api.loadCycle().then(resp=>{
+			if(resp.code!=0){
+				ElMessage.error(resp.msg || '加载初始数据失败')
+				return
+			}
+			let {single,diagram,liquid}=resp.data
+			Object.assign(formModel,{single,diagram,liquid})
+		}).catch(err=>{
+			console.log(err)
+			ElMessage.error('加载初始数据出错')
+		})
+	}
+	
+	const save=()=>{
+		api.setCycle(toRaw(formModel)).then(resp=>{
+			if(resp.code!=0){
+				ElMessage.error(resp.msg || '保存失败')
+				return
+			}
+			ElMessage.success('保存成功')
+		}).catch(err=>{
+			console.log(err)
+			ElMessage.error('保存数据出错')
+		})
+	}
+</script>
+
+<style scoped>
+	.edit-page{
+		padding:30px 100px;
+	}
+</style>