feat: 算法场景新增接口联调，表单内容调整， (08ff6f53) · Commits · AI算法平台 / RuoYi-Vue-ui · GitLab

src/api/algorithm/scene.js

+39 −0

Original line number	Diff line number	Diff line
		@@ -42,3 +42,42 @@ export function delBase(id) {
		method: 'delete'
		})
		}

		// 获取算法场景
		export function sceneList(id) {
		return request({
		url: '/system/algorithm/base/list/all',
		method: 'get'
		})
		}

		// 获取分流预警类型
		export function typeList(id) {
		return request({
		url: '/system/algorithm/type/list/' + id,
		method: 'get'
		})
		}

		// 获取摄像头列表
		export function cameraList() {
		return request({
		url: '/system/algorithm/camera/base/list/all',
		method: 'get'
		})
		}

		// 获取算法块名称
		export function pieceList() {
		return request({
		url: '/system/algorithm/piece/base/list/all',
		method: 'get'
		})
		}
		// 获取算法块名称
		export function variableList(id) {
		return request({
		url: '/system/algorithm/piece/variable/list/'+id,
		method: 'get'
		})
		}

src/views/algorithm/scene/index.vue

+80 −43

Original line number	Diff line number	Diff line
		@@ -119,28 +119,50 @@
		<el-input v-model="form.sceneName" placeholder="请输入场景名称" />
		</el-form-item>
		<el-form-item label="场景算法" prop="algorithmId">
		<el-input v-model="form.algorithmId" placeholder="请输入场景算法" />
		<el-select @change="sceneChange" v-model="form.algorithmId" placeholder="请选择分流预警类型">
		<el-option
		v-for="item in sceneOptions"
		:key="item.id"
		:label="item.algorithmName"
		:value="item.id">
		</el-option>
		</el-select>
		</el-form-item>
		<el-form-item label="分流预警类型" prop="alarmTypes">
		<el-input v-model="form.alarmTypes" placeholder="请输入处理的分流预警类型" />
		<el-select multiple v-model="form.alarmTypes" placeholder="请选择分流预警类型">
		<el-option
		v-for="item in typeOptions"
		:key="item.typeKey"
		:label="item.typeName"
		:value="item.typeKey">
		</el-option>
		</el-select>
		</el-form-item>
		<el-form-item label="每秒帧数" prop="frameSecond">
		<el-input v-model="form.frameSecond" placeholder="请输入每秒帧数" />
		</el-form-item>
		<el-form-item label="算法块配置" prop="cameraIdList">
		<el-input v-model="form.cameraIdList" placeholder="请输入算法块配置" />
		<el-form-item label="摄像头配置" prop="cameraIdList">
		<el-select multiple v-model="form.cameraIdList" placeholder="请选择摄像头">
		<el-option

		v-for="item in cameraOptions"
		:key="item.id"
		:label="item.cameraName"
		:value="item.id">
		</el-option>
		</el-select>
		</el-form-item>
		<el-form-item label="算法块" prop="algorithmList">
		<el-table v-loading="loading" :data="algorithmList" >
		<el-form-item label="算法块" prop="pieceDtos">
		<el-table v-loading="loading" :data="form.pieceDtos" >
		<el-table-column label="算法块名称" align="center" prop="sceneName">
		<template slot-scope="scope">
		<div>
		<el-select :disabled="!scope.row.isEdit" v-model="scope.row.sceneName" placeholder="请选择">
		<el-select :disabled="!scope.row.isEdit" @change="pieceChange(scope.row)" v-model="scope.row.sceneName" placeholder="请选择">
		<el-option
		v-for="item in options"
		:key="item.value"
		:label="item.label"
		:value="item.value">
		v-for="item in pieceOptions"
		:key="item.id"
		:label="item.pieceName"
		:value="item.id">
		</el-option>
		</el-select>
		</div>
		@@ -148,18 +170,20 @@
		</el-table-column>
		<el-table-column label="算法块配置" align="center" prop="algConfig" >
		<template slot-scope="scope">
		<div v-if="!scope.row.isEdit">{{ scope.row.algConfig }}</div>
		<div v-if="!scope.row.isEdit">
		<span v-for="item in scope.row.algConfig"> {{ item.variableName+':'+item.variableValue }}</span>
		</div>
		<div v-else>
		<el-popover
		placement="top"
		width="160"
		width="300"
		v-model="visible">
		<div>
		<el-table :show-header="false" :data="scope.row.algConfig">
		<el-table-column label="算法块名称" align="center" prop="variableKey">
		<el-table-column label="算法块名称" align="center" prop="variableKey" witdh="200">
		<template slot-scope="scopes">
		<div>
		{{'每秒'+scopes.row.variableValue+'帧'}} <el-input v-model="scopes.row.variableKey"></el-input>
		<div style="display: flex;" >
		<span style="width:80px;"> {{scopes.row.variableName}}</span> <el-input v-model="scopes.row.variableValue"></el-input>
		</div>
		</template>
		</el-table-column>
		@@ -223,29 +247,17 @@
		</template>

		<script>
		import { listBase, getBase, delBase, addBase, updateBase } from "@/api/algorithm/scene";
		import { listBase, getBase, delBase, addBase, updateBase, pieceList ,cameraList ,typeList ,sceneList , variableList, } from "@/api/algorithm/scene";

		export default {
		name: "Base",
		dicts: ['sys_normal_disable'],
		data() {
		return {
		options: [{
		value: '选项1',
		label: '黄金糕'
		}, {
		value: '选项2',
		label: '双皮奶'
		}, {
		value: '选项3',
		label: '蚵仔煎'
		}, {
		value: '选项4',
		label: '龙须面'
		}, {
		value: '选项5',
		label: '北京烤鸭'
		}],
		pieceOptions: [],
		cameraOptions: [],
		typeOptions: [],
		sceneOptions: [],
		// 遮罩层
		loading: true,
		// 选中数组
		@@ -312,7 +324,8 @@
		algorithmId: null,
		alarmTypes: null,
		frameSecond: null,
		cameraIdList: null
		cameraIdList: null,
		pieceDtos: []
		};
		this.resetForm("form");
		},
		@@ -337,6 +350,7 @@
		handleAdd() {
		this.reset();
		this.open = true;
		this.getOption()
		this.title = "添加算法场景";
		},
		/** 修改按钮操作 */
		@@ -356,26 +370,49 @@
		row.isEdit=false
		},
		handleAlgDelete(index,row) {
		this.algorithmList.splice(index, 1)
		this.form.pieceDtos.splice(index, 1)
		},

		algAdd(){
		this.algorithmList.push({
		this.form.pieceDtos.push({
		sceneName:'',
		algConfig:[
		{
		algorithmPieceBaseId: 1,
		variableKey: "frame",
		variableValue:"5",
		},
		{
		variableKey:"frame",
		variableValue:"4",
		variableName: "连续多少帧报警",
		variableType: "int",
		variableValue: "5"
		},
		],
		sort:'',
		isEdit:true,
		})
		},
		// 获取option
		getOption(){
		pieceList().then(res=>{
		this.pieceOptions=res.data
		})
		cameraList().then(res=>{
		this.cameraOptions=res.data
		})

		sceneList().then(res=>{
		this.sceneOptions=res.data
		})
		},
		sceneChange(e){
		typeList(e).then(res=>{
		this.typeOptions=res.data
		})
		},
		pieceChange(e){
		variableList(e.sceneName).then(res=>{
		console.log('%c [ res ]-411', 'font-size:13px; background:pink; color:#bf2c9f;', res)
		e.algConfig=res.data
		// this.typeOptions=res.data
		})
		},
		/** 提交按钮 */
		submitForm() {
		this.$refs["form"].validate(valid => {