Browse Source

Merge branch 'master' of http://git.mydig.net/Sagoo-Cloud/sagoo-admin-ui

yukai 3 years ago
parent
commit
0c2594446c

+ 5 - 2
src/api/assess/index.ts

@@ -1,8 +1,11 @@
-import { get, post } from '/@/utils/request_assess';
+import { get, post, del, put } from '/@/utils/request_assess';
 
 export default {
   getList: (params?: object) => get('/setup', params),
   setItem: (params?: object) => post('/setup', params),
+  deleteItem: (params?: object) => del('/setup', params),
   getDataSourceInfo: (params?: object) => get('/datasetup/target', params),
-  
+  testDataSource:  (params?: object) => post('/datasetup/test', params),
+  addDataSourceInfo: (params?: object) => post('/datasetup', params),
+  editataSourceInfo: (params?: object) => put('/datasetup', params),
 }

+ 268 - 55
src/views/assess/totalIndex/component/setTask.vue

@@ -1,11 +1,11 @@
 <template>
 	<div class="system-add-user-container">
-		<el-dialog title="数据源配置接口" v-model="isShowDialog" width="569px">
+		<el-dialog title="数据源配置接口" v-model="isShowDialog" width="650px">
 			<el-form :model="ruleForm" ref="ruleFormRef" :rules="rules" size="default" label-width="90px">
 				<el-row :gutter="35">
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
 						<el-form-item label="指标名称:">
-							{{ruleForm.target}}
+							{{ ruleForm.target }}
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
@@ -19,23 +19,123 @@
 						</el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
-						<el-form-item label="取值周期:" prop="get_time">
+						<el-form-item class="inline-row" label="取值周期:" prop="get_time">
 							<el-input v-model="ruleForm.get_time" placeholder="请输入取值周期" clearable></el-input>
+							<div class="tip"  @click="isShow=!isShow" >
+								<span v-if="!isShow" class="ico_down"></span>
+								<span v-else class="ico_up"></span>
+								帮助
+							</div>
 						</el-form-item>
 					</el-col>
+					<div class="help-wrap" v-if="isShow">
+						<div class="help-item">
+							<div class="help-item-label">CRON表达式</div>
+							<div class="help-item-content">取值周期填写说明 eg:0 0 0 1 * * 每月一号执行一次</div>
+						</div>
+						<div class="help-item">
+							<div class="help-item-label">CRON字段</div>
+							<div class="help-item-content">
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">字段</div>
+									<div class="ant-col ant-col-6">允许值</div>
+									<div class="ant-col ant-col-6">允许特殊字符</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">-------------------</div>
+									<div class="ant-col ant-col-6">-------------------</div>
+									<div class="ant-col ant-col-6">-------------------</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Seconds</div>
+									<div class="ant-col ant-col-6">0-59</div>
+									<div class="ant-col ant-col-6">* / , -</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Minutes</div>
+									<div class="ant-col ant-col-6">0-59</div>
+									<div class="ant-col ant-col-6">* / , -</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Hours</div>
+									<div class="ant-col ant-col-6">0-23</div>
+									<div class="ant-col ant-col-6">* / , -</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Day</div>
+									<div class="ant-col ant-col-6">1-31</div>
+									<div class="ant-col ant-col-6">* / , - ?</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Month</div>
+									<div class="ant-col ant-col-6">1-12 or JAN-DEC</div>
+									<div class="ant-col ant-col-6">* / , -</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-6">Week</div>
+									<div class="ant-col ant-col-6">0-6 or SUN-SAT</div>
+									<div class="ant-col ant-col-6">* / , - ?</div>
+								</div>
+							</div>
+						</div>
+						<div class="help-item">
+							<div class="help-item-label">特殊字符</div>
+							<div class="help-item-content">
+								"*":当前字段所有的值   eg:第二字段*表示每分钟<br />"/":描述范围的增量    eg:第二字段0-59/15表示每15分钟<br />",":分隔列表的项目  &nbsp;
+								eg:第五字段1,3表示每周1,3执行<br />"-":连字符用于定义范围 &nbsp; eg:第三字段1-3表每天1到3点(含3点)<br />"?":设置当前字段为空<br />
+							</div>
+						</div>
+						<div class="help-item">
+							<div class="help-item-label">预定义</div>
+							<div class="help-item-content">
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">字段</div>
+									<div class="ant-col ant-col-16">说明</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">----------------------------</div>
+									<div class="ant-col ant-col-16">---------------------------</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">@yearly or @annually</div>
+									<div class="ant-col ant-col-16">每年1月1日午夜运行一次</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">@monthly</div>
+									<div class="ant-col ant-col-16">每月一次,每月午夜运行一次</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">@weekly</div>
+									<div class="ant-col ant-col-16">每周运行一次,在星期六/星期日之间的午夜</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">@daily or @midnight</div>
+									<div class="ant-col ant-col-16">每天半夜运行</div>
+								</div>
+								<div class="ant-row">
+									<div class="ant-col ant-col-8">@hourly</div>
+									<div class="ant-col ant-col-16">每小时运行一次</div>
+								</div>
+							</div>
+						</div>
+					</div>
+													
+
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
 						<el-form-item label="是否启用:">
-							  <el-radio-group v-model="ruleForm.state" class="ml-4">
+							<el-radio-group v-model="ruleForm.state" class="ml-4">
 								<el-radio size="large" :label="1">启用</el-radio>
 								<el-radio size="large" :label="2">禁用</el-radio>
 							</el-radio-group>
-							 <el-button style="margin-left: 20px;" size="small" type="primary">检测</el-button>
+							<el-button v-if="ruleForm.uri&&ruleForm.object" @click="test" style="margin-left: 20px" size="small" type="primary">检测</el-button>
+						</el-form-item>
+					</el-col>
+					<el-col v-if="testRes || testRes.toString()" :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
+						<el-form-item label="测试结果:">
+							<span>数据源返回数据值:{{testRes}}</span>
 						</el-form-item>
 					</el-col>
 				</el-row>
-
-
-
 			</el-form>
 			<template #footer>
 				<span class="dialog-footer">
@@ -49,13 +149,11 @@
 
 <script lang="ts">
 import { reactive, toRefs, onMounted, defineComponent, ref } from 'vue';
-import type { FormInstance, FormRules } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus';
 import { ElMessage } from 'element-plus';
 
 import api from '/@/api/assess';
 
-
-
 // 定义接口来定义对象的类型
 interface RuleFormRow {
 	target: string;
@@ -63,10 +161,15 @@ interface RuleFormRow {
 	state: number;
 	object: string;
 	get_time: string;
+	
 }
 interface ItemState {
 	isShowDialog: boolean;
 	ruleForm: RuleFormRow;
+	status: number;
+	item_code: string;
+	isShow: boolean;
+	testRes: string;
 }
 
 export default defineComponent({
@@ -75,70 +178,103 @@ export default defineComponent({
 		const state = reactive<ItemState>({
 			isShowDialog: false,
 			ruleForm: {
-				target: '',// 指标名称
+				target: '', // 指标名称
 				uri: '', // URL
 				state: 1, // 是否启用
 				object: '', // 取值项
 				get_time: '', // 取值周期
 			},
+			status: 0,
+			item_code: '',
+			isShow: false,
+			testRes: ''
 		});
-		const formSize = ref('default')
-		const ruleFormRef = ref<FormInstance>()
+		const formSize = ref('default');
+		const ruleFormRef = ref<FormInstance>();
 		const rules = reactive<FormRules>({
-			uri: [
-				{ required: true, message: '请输入URL', trigger: 'blur' },
-			],
-			object: [
-				{ required: true, message: '请输入取值项', trigger: 'blur' },
-			],
-			get_time: [
-				{ required: true, message: '请输入取值周期', trigger: 'blur' },
-			]
-		})
+			uri: [{ required: true, message: '请输入URL', trigger: 'blur' }],
+			object: [{ required: true, message: '请输入取值项', trigger: 'blur' }],
+			get_time: [{ required: true, message: '请输入取值周期', trigger: 'blur' }],
+		});
 		const onSubmit = async (formEl: FormInstance | undefined) => {
-			if (!formEl) return
+			if (!formEl) return;
 			await formEl.validate((valid, fields) => {
-				console.log(valid)
 				if (valid) {
-				console.log('submit!')
+					if (state.status === 1) {
+						// 编辑
+						editataSourceInfo(state.ruleForm);
+					} else {
+						// 新增
+						let params = {
+							...state.ruleForm,
+							item_code: state.item_code,
+						};
+						addDataSourceInfo(params);
+					}
 				} else {
-				console.log('error submit!', fields)
+					console.log('error submit!', fields);
 				}
-			})
-		}
+			});
+		};
+		// 新增数据
+		const addDataSourceInfo = (params: any) => {
+			api.addDataSourceInfo(params).then((res: any) => {
+				ElMessage.success('数据提交成功');
+				closeDialog();
+				state.isShow = false
+			});
+		};
+		// 编辑数据
+		const editataSourceInfo = (params: any) => {
+			api.editataSourceInfo(params).then((res: any) => {
+				ElMessage.success('数据提交成功');
+				closeDialog();
+				state.isShow = false
+			});
+		};
 		// 打开弹窗
 		const openDialog = (row: RuleFormRow, item_code: string) => {
 			// state.ruleForm = row;
 			state.isShowDialog = true;
-			getDataSourceInfo(row, item_code)
+			state.testRes = ''
+			getDataSourceInfo(row, item_code);
+		};
+		// 检测
+		const test = () => {
+			let params = {
+				uri: state.ruleForm.uri,
+				object: state.ruleForm.object
+			}
+			api.testDataSource(params).then((res: any) => {
+				console.log(res)
+				state.testRes = res
+				// ElMessage.success('数据提交成功');
+				// closeDialog();
+				// state.isShow = false
+			});
 		};
 		// 获取数据源配置数据
 		const getDataSourceInfo = (row: any, item_code: string) => {
 			let params = {
 				item_code: item_code,
-				target_name: row.name
-			}
-			api.getDataSourceInfo(params).then((res:any) => {
-				console.log(res)
-				if(res) {
+				target_name: row.name,
+			};
+			state.item_code = item_code;
+			api.getDataSourceInfo(params).then((res: any) => {
+				if (res) {
 					// 编辑
-					state.ruleForm = res
-					// data_code: "17216f21isrc5lpgppsjr8o100z8jlwv"
-					// get_time: "*/30 * * * * *"
-					// item_code: "17216f2f0k0c5jee0vdn08g100u6rfhd"
-					// object: "Data.0.TemperatureHigh"
-					// state: 1
-					// target: "device"
-					// uri: "https://api.gugudata.com/weather/weatherinfo/demo"
-				}else {
+					state.ruleForm = res;
+					state.status = 1;
+				} else {
 					// 新增
 					state.ruleForm = {
-						target: row.name,// 指标名称
+						target: row.name, // 指标名称
 						uri: '', // URL
 						state: 1, // 是否启用
 						object: '', // 取值项
 						get_time: '', // 取值周期
-					}
+					};
+					state.status = 2;
 				}
 			});
 		};
@@ -150,14 +286,8 @@ export default defineComponent({
 		const onCancel = () => {
 			closeDialog();
 		};
-		// 新增
-		// const onSubmit = () => {
-		// 	closeDialog();
-		// };
 		// 初始化部门数据
-		const initTableData = () => {
-			
-		};
+		const initTableData = () => {};
 		// 页面加载时
 		onMounted(() => {
 			initTableData();
@@ -169,13 +299,96 @@ export default defineComponent({
 			onCancel,
 			onSubmit,
 			getDataSourceInfo,
+			addDataSourceInfo,
+			editataSourceInfo,
+			test,
 			...toRefs(state),
 			formSize,
-			ruleFormRef
+			ruleFormRef,
 		};
 	},
 });
 </script>
 
 <style lang="scss" scoped>
+.inline-row {
+	::v-deep .el-form-item__content {
+		display: flex;
+		.el-input {
+			width: calc(100% - 100px);
+		}
+		.tip {
+			width: 100px;
+			// background-color: pink;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			color: var(--el-color-primary);
+			font-size: 12px;
+			cursor: pointer;
+			.ico_up {
+				width: 0;
+				height: 0;
+				border: 5px solid transparent;
+				border-bottom-color: var(--el-color-primary);
+				margin-right: 8px;
+				margin-top: -7px;
+			}
+			.ico_down{
+				width:0;
+				height:0;
+				border:5px solid transparent ;
+				border-top-color:var(--el-color-primary);
+				margin-right: 8px;
+				margin-top: 7px;
+			}
+		}
+	}
+}
+.help-wrap {
+	width: 540px;
+	margin: 0 auto;
+	// background-color: pink;
+	.help-item:nth-child(1) {
+		border-top: 1px var(--el-border-color) var(--el-border-style);
+	}
+	.help-item {
+		display: flex;
+		
+		border-bottom: 1px var(--el-border-color) var(--el-border-style);
+		border-left: 1px var(--el-border-color) var(--el-border-style);
+		border-right: 1px var(--el-border-color) var(--el-border-style);
+		.help-item-label,
+		.help-item-content {
+			padding: 12px;
+			
+		}
+		.help-item-label {
+			background-color: #f3f3f3;
+			width: 110px;
+		}
+		.help-item-content {
+			width: 430px;
+			font-size: 12px;
+
+			.ant-row {
+				display: flex;
+				width: 100%;
+				// justify-content: space-between;
+				.ant-col-6 {
+					width: 33%;
+				}
+				.ant-col-6:not(:nth-child(1)) {
+					text-align: center;
+				}
+				.ant-col-8 {
+					width: 40%;
+				}
+				.ant-col-16 {
+					width: 60%;
+				}
+			}
+		}
+	}
+}
 </style>

+ 10 - 6
src/views/assess/totalIndex/index.vue

@@ -80,10 +80,11 @@ import api from '/@/api/assess';
 
 // 定义接口来定义对象的类型
 interface TableDataRow {
-	userName: string;
-	description: string;
-	// userNickname: string;
-	// roleSign: string;
+	title: string;
+	explain: string;
+	config: string;
+	item_code: string;
+	targets: Array<any>
 	// department: string[];
 	// phone: string;
 	// email: string;
@@ -92,7 +93,7 @@ interface TableDataRow {
 	// overdueTime: Date;
 	// status: boolean;
 	// describe: string;
-	createTime: string;
+	// createTime: string;
 }
 interface TableDataState {
 	tableData: {
@@ -169,7 +170,10 @@ export default defineComponent({
 				type: 'warning',
 			})
 				.then(() => {
-					ElMessage.success('删除成功');
+					api.deleteItem({itemcode: row.item_code}).then((res: any) => {
+						fetchList()
+						ElMessage.success('删除成功');
+					});
 				})
 				.catch(() => {});
 		};