feat: 算法场景 新增接口联调，表单内容调整，

src/api/algorithm/scene.js

@@ -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

@@ -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:[
             {
-            variableKey:"frame",
-            variableValue:"5",
-            },
-            {
-            variableKey:"frame",
-            variableValue:"4",
+              algorithmPieceBaseId: 1, 
+              variableKey: "frame", 
+              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 => {