From b527c0f6b789a6897acf51508addb61b4aca2de6 Mon Sep 17 00:00:00 2001
From: fanluyan <754122931@qq.com>
Date: Tue, 29 Oct 2024 11:45:23 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=9F=E8=83=BD=E6=B7=BB=E5=8A=A0=EF=BC=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Sidebar.vue                    |   2 +-
 src/router/index.js                           |   2 +-
 src/utils/api/index.js                        |  92 ++++-
 src/views/clientDownFile/index.vue            |   4 +-
 .../server/components/addserverDialog.vue     |   8 +-
 .../server/components/addserverDialog.vue     |   4 +-
 src/views/icdConfig/index.vue                 |   2 +-
 src/views/iceserver/index.vue                 |  38 +-
 .../components/addMappDialog.vue              | 375 ++++++++++++++++++
 src/views/mappingConfig/index.vue             | 163 +++++++-
 src/views/rptparam/index.vue                  |  41 +-
 11 files changed, 674 insertions(+), 57 deletions(-)
 create mode 100644 src/views/mappingConfig/components/addMappDialog.vue

diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index 42cf422c..a19d5f20 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -68,7 +68,7 @@ export default {
             },
             {
               path: "/rptparam",
-              name: "客户端RptParam绑定",
+              name: "客户端rptparamindex绑定",
             },
 
             {
diff --git a/src/router/index.js b/src/router/index.js
index c2ef394d..d5165f12 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -135,7 +135,7 @@ const routes = [
         component: () => import("../views/rptparam/index.vue"),
         name: "rptparam",
         meta: {
-          title: "客户端RptParam绑定",
+          title: "客户端rptparamindex绑定",
         },
       },
       {
diff --git a/src/utils/api/index.js b/src/utils/api/index.js
index b89c5a09..a70650de 100644
--- a/src/utils/api/index.js
+++ b/src/utils/api/index.js
@@ -131,7 +131,7 @@ export function icdFileApi(data) {
   });
 }
 //查询客户端icd文件的IED列表
-export function listIedApi(data) {
+export function listIedConfigApi(data) {
   return request({
     url: "/icdconfig/listIed",
     method: "get",
@@ -192,18 +192,6 @@ export function generateRptApi(data) {
   });
 }
 
-// /icdconfig/listled 查询客户端icd文件的IED列表
-export function listIedConfigApi(data) {
-  return request({
-    url: "/icdconfig/listIed",
-    method: "get",
-    params: data,
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
-    },
-  });
-}
-
 //开始实时采集转发
 
 export function startCollectApi(data) {
@@ -229,6 +217,18 @@ export function stopCollectApi(data) {
   });
 }
 
+// 查询该IED下的paramindex数据 /icdconfig/listParamindex
+export function icdlistParamindexApi(data) {
+  return request({
+    url: "/icdconfig/listParamindex",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
 //设备台账管理列表api
 //变电站相关接口
 //新增
@@ -893,6 +893,14 @@ export function updateRptApi(data) {
     data,
   });
 }
+//清空rptparamindex表数据 /rptparam/clearParamindex
+export function clearParamsApi(data) {
+  return request({
+    url: "/rptparam/clearParamindex",
+    method: "post",
+    data,
+  });
+}
 
 //查询I2状态
 export function i2statusApi(data) {
@@ -999,7 +1007,32 @@ export function serverstopApi(data) {
   });
 }
 
-//上传服务端icd文件 /iecserver/upload
+//iec采集转换映射配置 /iecserver/listTransform
+export function iecListTransformApi(data) {
+  return request({
+    url: "/iecserver/listTransform",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//删除映射配置 /iecserver/delTransform
+
+export function delTransFormApi(data) {
+  return request({
+    url: "/iecserver/delTransform",
+    method: "post",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//上传服务端iec文件 /iecserver/upload
 
 //​/iecserver​/listFile查询服务端icd文件列表
 export function ieclistFileApi(data) {
@@ -1013,6 +1046,37 @@ export function ieclistFileApi(data) {
   });
 }
 
+// ​/iecserver​/listParamindex 查询该IED下的paramindex数据
+export function serverlistParamindexApi(data) {
+  return request({
+    url: "/iecserver/listParamindex",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+// 添加  /iecserver​/addTransform  addTransform
+export function addTransformApi(data) {
+  return request({
+    url: "/iecserver/addTransform",
+    method: "post",
+    data,
+  });
+}
+
+// 清空 /iecserver/clearTransform
+
+export function clearTransformApi(data) {
+  return request({
+    url: "/iecserver/clearTransform",
+    method: "post",
+    data,
+  });
+}
+
 //61850下载文件相关接口 Ied Dl Controller
 //获取所有列表
 export function ieddlServerApi(data) {
diff --git a/src/views/clientDownFile/index.vue b/src/views/clientDownFile/index.vue
index c758f413..a0fd98d1 100644
--- a/src/views/clientDownFile/index.vue
+++ b/src/views/clientDownFile/index.vue
@@ -28,12 +28,12 @@ export default {
       activeIndex: 0,
       navlist: [
         {
-          name: "下载文件配置",
+          name: "采集文件配置",
           path: "/clientDownFile/server",
         },
 
         {
-          name: "下载记录",
+          name: "采集记录",
           path: "/clientDownFile/downrecord",
         },
       ],
diff --git a/src/views/clientDownFile/server/components/addserverDialog.vue b/src/views/clientDownFile/server/components/addserverDialog.vue
index 4a4e9548..dfb7502c 100644
--- a/src/views/clientDownFile/server/components/addserverDialog.vue
+++ b/src/views/clientDownFile/server/components/addserverDialog.vue
@@ -82,7 +82,7 @@
 import {
   ieddlAddApi,
   ieddlUpdateApi,
-  listIedApi,
+  listIedConfigApi,
   monitoringListAllApi,
 } from "@/utils/api/index";
 export default {
@@ -98,8 +98,8 @@ export default {
       pathObjects: [], // 用于存储转换后的对象数组
       suffixOptions: [
         {
-          value: "全部",
-          label: "",
+          value: "",
+          label: "全部",
         },
         {
           value: "dat",
@@ -206,7 +206,7 @@ export default {
     },
     //获取查询客户端icd文件的IED列表
     getlistIed() {
-      listIedApi()
+      listIedConfigApi()
         .then((res) => {
           console.log(res);
           this.iedOptions = res.data;
diff --git a/src/views/dataTransfer/server/components/addserverDialog.vue b/src/views/dataTransfer/server/components/addserverDialog.vue
index ba09d93e..512ee4e5 100644
--- a/src/views/dataTransfer/server/components/addserverDialog.vue
+++ b/src/views/dataTransfer/server/components/addserverDialog.vue
@@ -85,8 +85,8 @@ export default {
       pathObjects: [], // 用于存储转换后的对象数组
       suffixOptions: [
         {
-          value: "全部",
-          label: "",
+          value: "",
+          label: "全部",
         },
         {
           value: "dat",
diff --git a/src/views/icdConfig/index.vue b/src/views/icdConfig/index.vue
index 3f2339be..79e88112 100644
--- a/src/views/icdConfig/index.vue
+++ b/src/views/icdConfig/index.vue
@@ -354,7 +354,7 @@ export default {
     },
     clearAllicd() {
       this.$confirm(
-        "此操作将清除所有icd文件、相关配置、rptparamindex, 是否继续?",
+        "此操作将清除所有客户端和服务端的icd文件和icd绑定配置, 是否继续?",
         "提示",
         {
           confirmButtonText: "确定",
diff --git a/src/views/iceserver/index.vue b/src/views/iceserver/index.vue
index b8fd9d75..9eb04032 100644
--- a/src/views/iceserver/index.vue
+++ b/src/views/iceserver/index.vue
@@ -7,30 +7,16 @@
         element-loading-text="请稍等"
         element-loading-spinner="el-icon-loading"
         element-loading-background="rgba(0, 0, 0, 0.7)"
+        v-for="item in icdFileOptions"
+        :key="item.id"
       >
         <el-card class="box-card">
           <div slot="header" class="clearfix">
             <span> IEC服务器状态</span>
           </div>
           <div class="concard">
-            <p>端口：{{ port }}</p>
-            <p>filename：{{ filename }}</p>
-            <div class="flieSet">
-              <h5>选择文件：</h5>
-              <el-select
-                v-model="fileNameVal"
-                placeholder="请选择"
-                :disabled="serverStatus"
-              >
-                <el-option
-                  v-for="item in icdFileOptions"
-                  :key="item.id"
-                  :label="item.filename"
-                  :value="item.id"
-                >
-                </el-option>
-              </el-select>
-            </div>
+            <p>filename：{{ item.filename }}</p>
+            <p>端口：{{ item.port }}</p>
             <p>
               服务器状态：
               <el-tag type="success" v-if="serverStatus">开启</el-tag>
@@ -73,6 +59,8 @@
               </el-table-column>
               <el-table-column prop="ip" label="ip" width="100px">
               </el-table-column>
+              <el-table-column prop="port" label="port" width="80px">
+              </el-table-column>
 
               <el-table-column fixed="right" label="操作" width="200px">
                 <template slot-scope="scope">
@@ -314,10 +302,18 @@ export default {
   .el-divider--vertical {
     height: 100%;
   }
+  .left {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    align-content: flex-start; //加这个属性就能解决
+    height: 100%;
+    overflow: auto;
+  }
   .cardBox {
-    width: 360px;
+    width: 280px;
     margin-top: 20px;
-    height: 240px;
+    height: 184px;
     .el-card__header {
       padding: 12px;
     }
@@ -347,7 +343,7 @@ export default {
     }
   }
   .cardBox2 {
-    width: 480px;
+    width: 560px;
     margin-top: 20px;
     margin-left: 12px;
     //height: 472px;
diff --git a/src/views/mappingConfig/components/addMappDialog.vue b/src/views/mappingConfig/components/addMappDialog.vue
new file mode 100644
index 00000000..2cd58656
--- /dev/null
+++ b/src/views/mappingConfig/components/addMappDialog.vue
@@ -0,0 +1,375 @@
+<template>
+  <div class="filedAddBoxMapp">
+    <el-dialog
+      class="AddDialogBox"
+      title="新增映射配置"
+      :visible.sync="mappDialogShow"
+      @close="hide"
+      width="620px"
+      :close-on-click-modal="false"
+    >
+      <div class="mappSeting">
+        <div class="mappInput">
+          <h3>输入</h3>
+          <div class="iedClass">
+            <b>ied名称：</b>
+            <el-select
+              v-model="iedValue"
+              placeholder="请选择"
+              @change="changeIed"
+            >
+              <el-option
+                v-for="item in iedOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <div class="iedClass">
+            <b>逻辑设备：</b>
+            <el-select
+              v-model="deviceValue"
+              placeholder="请选择"
+              @change="changeDevice"
+            >
+              <el-option
+                v-for="item in deviceOptions"
+                :key="item.id"
+                :label="item.paramIndex"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <div class="deviceList">
+            <p
+              v-for="(item, index) in deviceList"
+              :key="index"
+              :class="{ errorRed: leftIndex === item }"
+            >
+              {{ item }}
+            </p>
+          </div>
+        </div>
+        <el-divider direction="vertical"></el-divider>
+        <div class="mappOutput">
+          <h3>输出</h3>
+          <div class="iedClass">
+            <b>server名称：</b>
+            <el-select
+              v-model="serverValue"
+              placeholder="请选择"
+              @change="changeServer"
+            >
+              <el-option
+                v-for="item in serverOptions"
+                :key="item.id"
+                :label="item.filename"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <div class="iedClass">
+            <b>逻辑设备：</b>
+            <el-select
+              v-model="serveIecValue"
+              placeholder="请选择"
+              @change="changeServerDevice"
+            >
+              <el-option
+                v-for="item in serveIecOptions"
+                :key="item.inst"
+                :label="item.paramIndex"
+                :value="item.inst"
+              >
+              </el-option>
+            </el-select>
+          </div>
+          <div class="deviceList serverList">
+            <p
+              v-for="(item, index) in deviceList"
+              :key="index"
+              :class="{ errorRed: rightIndex === outputValues[item] }"
+            >
+              <el-select
+                v-model="outputValues[item]"
+                placeholder="请选择"
+                clearable
+              >
+                <el-option
+                  v-for="outItem in serverdeviceList"
+                  :key="outItem"
+                  :label="outItem"
+                  :value="outItem"
+                ></el-option>
+              </el-select>
+            </p>
+          </div>
+        </div>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="hide">取 消</el-button>
+        <el-button type="primary" @click="submitForm()">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import {
+  listIedConfigApi,
+  icdlistParamindexApi,
+  ieclistFileApi,
+  serverlistParamindexApi,
+  addTransformApi,
+} from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      mappDialogShow: false,
+      //左侧
+      iedValue: "",
+      iedOptions: [],
+      deviceValue: "",
+      deviceOptions: [],
+      deviceList: [],
+      //右侧
+      serverValue: "",
+      serverOptions: [],
+      serveIecValue: "",
+      serveIecOptions: [],
+      serverdeviceList: [],
+      //输出
+      outputValues: {}, // 用于存储每个设备列表项的选择值
+      leftIndex: -1,
+      rightIndex: -1,
+    };
+  },
+  created() {},
+  mounted() {
+    // 初始化时，给每个对象添加 selected 和 value 属性
+  },
+  watch: {},
+  methods: {
+    //左侧输入
+    //获取led列表
+    getLedList() {
+      listIedConfigApi()
+        .then((res) => {
+          console.log(res);
+          this.iedOptions = res.data;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //切换ied选项
+    changeIed(val) {
+      console.log(val);
+      let selectOption = this.iedOptions.find((item) => {
+        return item.id === val;
+      });
+      this.deviceValue = "";
+      this.deviceList = [];
+      this.getDeviceList(selectOption);
+    },
+    //获取逻辑设备
+    getDeviceList(val) {
+      icdlistParamindexApi({
+        iedName: val.name,
+      })
+        .then((res) => {
+          console.log(res);
+          this.deviceOptions = res.data;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //切换逻辑设备
+    changeDevice(val) {
+      console.log(val);
+      let selectdevice = this.deviceOptions.find((item) => {
+        return item.id === val;
+      });
+      console.log(selectdevice);
+      this.deviceList = selectdevice.attList;
+    },
+    //右侧serve输出
+    //获取serve文件列表
+    getSeverList() {
+      ieclistFileApi()
+        .then((res) => {
+          console.log(res);
+          this.serverOptions = res.data;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //切换server
+    changeServer(val) {
+      console.log(val);
+      let serverSelectOption = this.serverOptions.find((item) => {
+        return item.id === val;
+      });
+      this.serveIecValue = "";
+      this.serverdeviceList = [];
+      this.getserverDeviceList(serverSelectOption);
+    },
+    //获取serer服务设备
+    getserverDeviceList(val) {
+      serverlistParamindexApi({
+        fileId: val.id,
+      })
+        .then((res) => {
+          console.log(res);
+          this.serveIecOptions = res.data;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //切换逻辑设备
+    changeServerDevice(val) {
+      console.log(val);
+      let selectserver = this.serveIecOptions.find((item) => {
+        return item.inst == val;
+      });
+      console.log(selectserver);
+      this.serverdeviceList = selectserver.attList;
+    },
+    submitForm() {
+      let params = [];
+      this.deviceList.forEach((item) => {
+        console.log(`设备项: ${item}, 选择的值: ${this.outputValues[item]}`);
+        if (
+          this.outputValues[item] !== undefined &&
+          this.outputValues[item] !== ""
+        ) {
+          params.push({
+            rptFrom: item,
+            rptTo: this.outputValues[item],
+          });
+        }
+      });
+      console.log(params);
+      this.callApiWithParams(params);
+    },
+    async callApiWithParams(params) {
+      for (let index = 0; index < params.length; index++) {
+        // 使用 index 变量来追踪当前索引
+        try {
+          const param = params[index]; // 通过索引获取当前参数
+          const res = await addTransformApi(param);
+          if (res.success === false) {
+            console.log(`在索引 ${index} 处发生错误: ${res.errorMsg}`);
+            this.$message({
+              showClose: true,
+              message: res.errorMsg,
+              type: "error",
+            });
+            if (res.errorMsg && res.errorMsg.includes("From")) {
+              this.leftIndex = param.rptFrom;
+              this.rightIndex = "";
+            }
+            if (res.errorMsg && res.errorMsg.includes("To")) {
+              this.rightIndex = param.rptTo;
+              this.leftIndex = "";
+            }
+            return; // 停止循环
+          }
+          this.$set(this.outputValues, param.rptTo, "");
+          console.log(`调用成功（索引 ${index}）:`, res);
+        } catch (err) {
+          console.error(`调用接口时发生错误（索引 ${index}）:`, err);
+          //alert(`在索引 ${index} 处调用接口时发生错误，已停止后续调用。`);
+          return; // 停止循环
+        }
+      }
+      this.$message({
+        showClose: true,
+        message: `所有映射配置均已成功`,
+        type: "success",
+      });
+      this.mappDialogShow = false;
+      this.$parent.getiecListForm(); //刷新
+    },
+    //获取监测设备类型
+
+    display() {
+      this.mappDialogShow = true;
+      this.getLedList();
+      this.getSeverList();
+    },
+    hide() {
+      this.mappDialogShow = false;
+      console.log("我关闭了");
+      this.outputValues = {};
+      // this.formInfo = {};
+      // this.$refs.formInforef.resetFields(); // 重置表单字段值
+      // console.log(this.formInfo);
+    },
+  },
+};
+</script>
+<style lang="less">
+.filedAddBoxMapp {
+  .AddDialogBox {
+    .el-dialog__body {
+      padding: 10px 20px;
+    }
+
+    .mappSeting {
+      display: flex;
+      justify-content: space-around;
+      height: 400px;
+      .el-divider--vertical {
+        height: 100%;
+        margin: 0 1%;
+      }
+      .mappInput,
+      .mappOutput {
+        width: 49%;
+        height: 400px;
+        h3 {
+          //font-weight: normal;
+          line-height: 32px;
+        }
+        .iedClass {
+          display: flex;
+          align-items: center;
+          margin-bottom: 12px;
+          b {
+            width: 84px;
+            font-weight: normal;
+          }
+        }
+        .el-select {
+          width: 200px;
+        }
+      }
+      .deviceList {
+        p {
+          height: 40px;
+          line-height: 40px;
+        }
+        .errorRed {
+          color: #f00;
+          .el-input__inner {
+            border: 1px solid #f00;
+          }
+        }
+      }
+      .serverList {
+        width: 100%;
+        .el-select {
+          width: 300px;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/mappingConfig/index.vue b/src/views/mappingConfig/index.vue
index 4ebd4ccb..26b75e23 100644
--- a/src/views/mappingConfig/index.vue
+++ b/src/views/mappingConfig/index.vue
@@ -1,20 +1,145 @@
 <template>
-  <div class="iceConfig">采集转换映射配置</div>
+  <div class="mappingConfig">
+    <div class="configHead">
+      <el-button size="small" type="primary" @click="addMpping"
+        >新增映射</el-button
+      >
+      <el-button size="small" type="danger" @click="clearMapp"
+        >清空全部</el-button
+      >
+    </div>
+    <div class="mappContain">
+      <el-table
+        v-loading="mappLoading"
+        :data="mappTableData"
+        stripe
+        border
+        style="width: 100%"
+        height="calc(100% - 40px)"
+      >
+        <el-table-column prop="rptFrom" label="From"> </el-table-column>
+        <el-table-column label="指向" width="80px" class-name="rowClass">
+          <template slot-scope="scope">
+            <el-tag
+              type="success"
+              v-if="scope.row.fromActive && scope.row.toActive"
+            >
+              <i class="el-icon-right"></i
+            ></el-tag>
+            <el-tag type="danger" v-else> <i class="el-icon-right"></i></el-tag>
+          </template>
+        </el-table-column>
+
+        <el-table-column prop="rptFrom" label="T0"> </el-table-column>
+
+        <el-table-column label="操作" class-name="editClass">
+          <template slot-scope="scope">
+            <el-link
+              type="danger"
+              @click="deleteMapp(scope.row)"
+              size="small"
+              icon="el-icon-delete"
+              >删除</el-link
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <addMappDialog ref="mappAddRef"></addMappDialog>
+  </div>
 </template>
 <script>
-import {} from "@/utils/api/index";
-
+import {
+  iecListTransformApi,
+  delTransFormApi,
+  clearTransformApi,
+} from "@/utils/api/index";
+import addMappDialog from "./components/addMappDialog";
 export default {
-  components: {},
+  components: {
+    addMappDialog,
+  },
   data() {
-    return {};
+    return {
+      mappLoading: false,
+      mappTableData: [],
+    };
+  },
+  mounted() {
+    this.getiecListForm();
+  },
+  methods: {
+    //新增映射关系
+    addMpping() {
+      //新增
+      this.$refs.mappAddRef.display();
+    },
+    //清除映射关系
+    clearMapp() {
+      clearTransformApi()
+        .then((res) => {
+          if (res.success) {
+            console.log(res);
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              type: "success",
+              message: "已清空全部映射配置",
+            });
+            this.getiecListForm();
+          } else {
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              type: "error",
+              message: res.errorMsg,
+            });
+          }
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //删除映射关系
+    deleteMapp(row) {
+      delTransFormApi({ id: row.id })
+        .then((res) => {
+          if (res.success) {
+            console.log(res);
+            this.getiecListForm();
+          } else {
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              type: "error",
+              message: res.errorMsg,
+            });
+          }
+
+          // this.mappTableData = res.data;
+          // this.mappLoading = false;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    getiecListForm() {
+      this.mappLoading = true;
+      iecListTransformApi()
+        .then((res) => {
+          console.log(res);
+          this.mappTableData = res.data;
+          this.mappLoading = false;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
   },
-  mounted() {},
-  methods: {},
 };
 </script>
 <style lang="less">
-.iceConfig {
+.mappingConfig {
   width: calc(100% - 24px);
   overflow-x: hidden;
   background: rgba(8, 9, 36, 0.28);
@@ -22,5 +147,27 @@ export default {
   box-shadow: inset 0 4px 44px 0 #106cde;
   padding: 0px 12px;
   height: 100%;
+  .configHead {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    height: 40px;
+    line-height: 40px;
+  }
+  .mappContain {
+    width: 100%;
+
+    background: #fff;
+    margin-top: 10px;
+    height: calc(100% - 60px);
+    display: flex;
+    .rowClass {
+      text-align: center;
+      .el-icon-right {
+        font-size: 16px;
+      }
+    }
+  }
 }
 </style>
diff --git a/src/views/rptparam/index.vue b/src/views/rptparam/index.vue
index 67475ff3..d73aa129 100644
--- a/src/views/rptparam/index.vue
+++ b/src/views/rptparam/index.vue
@@ -45,8 +45,10 @@
     </div>
     <div class="paramTable">
       <div class="paramHead">
-        <h3>rptparam配置</h3>
-        <!-- <el-button @click="clearAllBind" type="primary"> 全部解绑 </el-button> -->
+        <h3>rptparamindex配置</h3>
+        <el-button @click="clearAllBind" type="primary">
+          清空rptparamindex配置
+        </el-button>
       </div>
       <div class="paramContain">
         <div class="headSelect">
@@ -141,6 +143,7 @@ import {
   getRptApi,
   listRptApi,
   updateRptApi,
+  clearParamsApi,
 } from "@/utils/api/index";
 export default {
   name: "paramBinding",
@@ -388,7 +391,7 @@ export default {
           if (res.success) {
             this.$message({
               showClose: true,
-              message: "rptparam配置成功",
+              message: "rptparamindex配置成功",
               type: "success",
             });
           } else {
@@ -403,6 +406,38 @@ export default {
           console.log(err); //代码错误、请求失败捕获
         });
     },
+    //清空rpt配置
+    clearAllBind() {
+      this.$confirm("此操作将清除所有rpt配置, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          clearParamsApi()
+            .then((res) => {
+              console.log(res);
+              if (res.success) {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "rpt配置已全部清除",
+                  type: "success",
+                });
+                this.getinstList();
+              } else {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  type: "error",
+                  message: res.errorMsg,
+                });
+              }
+            })
+            .catch((err) => {});
+        })
+        .catch(() => {});
+    },
   },
 };
 </script>