zc

src/api/iotDevice/index.js

@@ -499,6 +499,14 @@ export function iotAlarmTemplateBodyType(query) {
 
 
 /***********网络组件*************/
+//网络组件-下拉列表
+export function iotNetworkInfo(query) {
+  return request({
+    url: '/iot/network/info',
+    method: 'get',
+    params: query
+  })
+}
 //网络组件-列表
 export function iotNetworkList(data) {
   return request({

src/views/iotDevice/intelligenceIot/iotClassification/attributePage.vue

@@ -111,76 +111,90 @@
     <el-dialog class="iotClassification-dialog" :title='dialogTitle' width="540px" append-to-body
                :visible.sync="dialogType" v-if="dialogType" @close="dialogOff()"
                :close-on-click-modal="false" :close-on-press-escape="false">
-      <el-form :model="dialogForm" ref="dialogForm" :inline="true" :rules="dialogRules" class="addCheckPage-min" label-width="80px">
-        <el-form-item label="名称" prop="name">
-          <el-input v-model="dialogForm.name" placeholder="请输入名称" maxLength="10" style="width:320px;"/>
-        </el-form-item>
-        <el-form-item label="标识" prop="code">
-          <el-input v-model="dialogForm.code" placeholder="请输入标识" maxLength="20" style="width:320px;"/>
-        </el-form-item>
-        <el-form-item label="属性" prop="attrName">
-          <el-input v-model="dialogForm.attrName" placeholder="请输入属性" maxLength="20" style="width:320px;"/>
-        </el-form-item>
-        <el-form-item label="单位" prop="unit">
-          <el-input v-model="dialogForm.unit" placeholder="请输入单位" maxLength="20" style="width:320px;"/>
-        </el-form-item>
-        <el-form-item label="排序" prop="sort">
-          <el-input-number v-model="dialogForm.sort" controls-position="right" :min="1" :max="9999" style="width:320px;"></el-input-number>
-        </el-form-item>
-        <el-form-item label="阈值" prop="threshhold">
-          <el-input-number v-model="dialogForm.threshhold" controls-position="right" :precision="2" :step="0.1" :min="-9999999" :max="9999999" style="width:320px;"></el-input-number>
-        </el-form-item>
-        <el-form-item label="是否波动" prop="isFluctuation">
-          <el-radio-group v-model="dialogForm.isFluctuation">
-            <el-radio :label="true">启用</el-radio>
-            <el-radio :label="false">禁用</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="波动方向" prop="fluctuationDirection" v-if="dialogForm.isFluctuation">
-          <el-radio-group v-model="dialogForm.fluctuationDirection">
-            <el-radio :label="-1">负向</el-radio>
-            <el-radio :label="0">正负双向</el-radio>
-            <el-radio :label="1">正向</el-radio>
-          </el-radio-group>
-        </el-form-item>
-        <el-form-item label="波动范围" prop="fluctuationRange" v-if="dialogForm.isFluctuation">
-          <el-input v-model="dialogForm.fluctuationRange" placeholder="请输入波动范围" maxLength="4" style="width:320px;"/>
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input placeholder="请输入备注" maxLength='100' type="textarea" style="width:320px;"
-                    resize="none" v-model="dialogForm.remark" show-word-limit :autosize="{ minRows: 2, maxRows: 2}"></el-input>
-        </el-form-item>
-        <el-form-item label="正常icon" prop="icon">
-          <el-upload
-            style="width:160px;"
-            class="iotClassification-dialog-upload"
-            :action="uploadImgUrl"
-            :show-file-list="false"
-            :on-success="(res)=>handleAvatarSuccess(res,'icon')"
-            :headers="headers"
-            :before-upload="(file)=>beforeAvatarUpload(file)">
-            <div class="center-img" style="margin-left:20px;">
-              <img v-if="dialogForm.icon" :src="dialogForm.icon" style="max-width:40px;max-height:40px;">
-              <p v-if="!dialogForm.icon" class="el-icon-upload" style="text-align: center;line-height:40px;font-size:30px;color:#0183FA;"></p>
-            </div>
-          </el-upload>
-        </el-form-item>
-        <el-form-item label="异常icon" prop="exceptionIcon">
-          <el-upload
-            style="width:160px;"
-            class="iotClassification-dialog-upload"
-            :action="uploadImgUrl"
-            :show-file-list="false"
-            :on-success="(res)=>handleAvatarSuccess(res,'exceptionIcon')"
-            :headers="headers"
-            :before-upload="(file)=>beforeAvatarUpload(file)">
-            <div class="center-img" style="margin-left:20px;">
-              <img v-if="dialogForm.exceptionIcon" :src="dialogForm.exceptionIcon" style="max-width:40px;max-height:40px;">
-              <p v-if="!dialogForm.exceptionIcon" class="el-icon-upload" style="text-align: center;line-height:40px;font-size:30px;color:#E65D6E;"></p>
-            </div>
-          </el-upload>
-        </el-form-item>
-      </el-form>
+      <div class="scrollbar-box" style="height:600px;">
+        <el-form :model="dialogForm" ref="dialogForm" :inline="true" :rules="dialogRules" class="addCheckPage-min" label-width="80px">
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="dialogForm.name" placeholder="请输入名称" maxLength="10" style="width:320px;"/>
+          </el-form-item>
+          <el-form-item label="标识" prop="code">
+            <el-input v-model="dialogForm.code" placeholder="请输入标识" maxLength="20" style="width:320px;"/>
+          </el-form-item>
+          <el-form-item label="属性" prop="attrName">
+            <el-input v-model="dialogForm.attrName" placeholder="请输入属性" maxLength="20" style="width:320px;"/>
+          </el-form-item>
+          <el-form-item label="单位" prop="unit">
+            <el-input v-model="dialogForm.unit" placeholder="请输入单位" maxLength="20" style="width:320px;"/>
+          </el-form-item>
+          <el-form-item label="排序" prop="sort">
+            <el-input-number v-model="dialogForm.sort" controls-position="right" :min="1" :max="9999" style="width:320px;"></el-input-number>
+          </el-form-item>
+          <el-form-item label="网络组件" prop="networkId">
+            <el-select v-model="dialogForm.networkId"
+                       placeholder="请选网络组件"
+                       clearable style="width:320px;">
+              <el-option
+                v-for="dict in networkOptions"
+                :key="dict.id"
+                :label="dict.moduleName"
+                :value="dict.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="阈值" prop="threshhold">
+            <el-input-number v-model="dialogForm.threshhold" controls-position="right" :precision="2" :step="0.1" :min="-9999999" :max="9999999" style="width:320px;"></el-input-number>
+          </el-form-item>
+          <el-form-item label="是否波动" prop="isFluctuation">
+            <el-radio-group v-model="dialogForm.isFluctuation">
+              <el-radio :label="true">启用</el-radio>
+              <el-radio :label="false">禁用</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="波动方向" prop="fluctuationDirection" v-if="dialogForm.isFluctuation">
+            <el-radio-group v-model="dialogForm.fluctuationDirection">
+              <el-radio :label="-1">负向</el-radio>
+              <el-radio :label="0">正负双向</el-radio>
+              <el-radio :label="1">正向</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="波动范围" prop="fluctuationRange" v-if="dialogForm.isFluctuation">
+            <el-input v-model="dialogForm.fluctuationRange" placeholder="请输入波动范围" maxLength="4" style="width:320px;"/>
+          </el-form-item>
+          <el-form-item label="备注" prop="remark">
+            <el-input placeholder="请输入备注" maxLength='100' type="textarea" style="width:320px;"
+                      resize="none" v-model="dialogForm.remark" show-word-limit :autosize="{ minRows: 2, maxRows: 2}"></el-input>
+          </el-form-item>
+          <el-form-item label="正常icon" prop="icon">
+            <el-upload
+              style="width:150px;"
+              class="iotClassification-dialog-upload"
+              :action="uploadImgUrl"
+              :show-file-list="false"
+              :on-success="(res)=>handleAvatarSuccess(res,'icon')"
+              :headers="headers"
+              :before-upload="(file)=>beforeAvatarUpload(file)">
+              <div class="center-img" style="margin-left:20px;">
+                <img v-if="dialogForm.icon" :src="dialogForm.icon" style="max-width:40px;max-height:40px;">
+                <p v-if="!dialogForm.icon" class="el-icon-upload" style="text-align: center;line-height:40px;font-size:30px;color:#0183FA;"></p>
+              </div>
+            </el-upload>
+          </el-form-item>
+          <el-form-item label="异常icon" prop="exceptionIcon">
+            <el-upload
+              style="width:150px;"
+              class="iotClassification-dialog-upload"
+              :action="uploadImgUrl"
+              :show-file-list="false"
+              :on-success="(res)=>handleAvatarSuccess(res,'exceptionIcon')"
+              :headers="headers"
+              :before-upload="(file)=>beforeAvatarUpload(file)">
+              <div class="center-img" style="margin-left:20px;">
+                <img v-if="dialogForm.exceptionIcon" :src="dialogForm.exceptionIcon" style="max-width:40px;max-height:40px;">
+                <p v-if="!dialogForm.exceptionIcon" class="el-icon-upload" style="text-align: center;line-height:40px;font-size:30px;color:#E65D6E;"></p>
+              </div>
+            </el-upload>
+          </el-form-item>
+        </el-form>
+      </div>
       <div slot="footer" class="dialog-footer dialog-footer-box">
         <p class="dialog-footer-button-null"></p>
         <p class="dialog-footer-button-info" @click="dialogOff()">取消</p>
@@ -193,7 +207,7 @@
 
 <script>
   import { getToken } from "@/utils/auth";
-  import { iotAttributeList,iotAttributeAdd,
+  import { iotAttributeList,iotAttributeAdd,iotNetworkInfo,
     iotAttributeUpdate,iotAttributeDelete,iotAttributeDetail,
     iotAttributeMoveUp,iotAttributeMoveDown  } from "@/api/iotDevice/index";
   export default {
@@ -207,6 +221,7 @@
         },
         loading:false,
         options:[{label:'启用',value:true},{label:'停用',value:false}],
+        networkOptions:[],
         queryParams:{
           typeId:this.$parent.propsData.typeId,
           page:1,
@@ -258,8 +273,15 @@
     },
     mounted(){
       this.getList();
+      this.iotNetworkInfo();
     },
     methods:{
+      //获取网络组件列表
+      iotNetworkInfo(){
+        iotNetworkInfo({isList:true}).then(response => {
+          this.$set(this,'networkOptions',response.data);
+        });
+      },
       //属性
       getList(){
         let obj = JSON.parse(JSON.stringify(this.queryParams))
@@ -303,6 +325,7 @@
           icon:"",
           exceptionIcon:"",
           sort:1,
+          networkId:'',
           state:true,
         });
       },
@@ -318,6 +341,7 @@
               attrName:this.dialogForm.attrName,
               unit:this.dialogForm.unit,
               sort:this.dialogForm.sort,
+              networkId:this.dialogForm.networkId,
               threshhold:this.dialogForm.threshhold?this.dialogForm.threshhold:0,
               isFluctuation:this.dialogForm.isFluctuation?this.dialogForm.isFluctuation:false,
               fluctuationDirection:this.dialogForm.fluctuationDirection,
@@ -355,6 +379,7 @@
             attrName:row.attrName,
             unit:row.unit,
             sort:row.sort,
+            networkId:row.networkId,
             threshhold:row.threshhold?row.threshhold:0,
             isFluctuation:row.isFluctuation?row.isFluctuation:false,
             fluctuationDirection:Number(row.fluctuationDirection?row.fluctuationDirection:null),
@@ -397,6 +422,7 @@
               attrName:row.attrName,
               unit:row.unit,
               sort:row.sort,
+              networkId:row.networkId,
               icon:row.icon,
               exceptionIcon:row.exceptionIcon,
               state:!row.state,

src/views/iotDevice/intelligenceIot/iotClassification/functionPage.vue

@@ -1,3 +1,4 @@
+<!--功能 -->
 <template>
   <div class="table-max-box iotClassification-functionPage">
     <div class="table-title-box">

src/views/iotDevice/operationManagement/networkComponent/index.vue

@@ -91,194 +91,226 @@
     <el-dialog class="networkComponent-dialog" :title='dialogTitle' width="540px" append-to-body
                :visible.sync="dialogType" v-if="dialogType" @close="dialogOff()"
                :close-on-click-modal="false" :close-on-press-escape="false">
-      <el-form :model="dialogForm" ref="dialogForm"  label-width="110px"
-               :inline="true" :rules="dialogLookType?rules:dialogRules">
-        <el-form-item label="名称：" prop="moduleName">
-          <el-input
-            :disabled="dialogLookType"
-            v-model="dialogForm.moduleName"
-            maxLength="20"
-            placeholder="请输入名称"
-            style="width:360px;"
-          />
-        </el-form-item>
-        <el-form-item label="类型：" prop="moduleType">
-          <el-select v-model="dialogForm.moduleType"
-                     placeholder="请选类型"
-                     :disabled="dialogLookType"
-                     clearable style="width:360px;">
-            <el-option
-              v-for="dict in options"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <div v-if="dialogForm.moduleType == 1 || dialogForm.moduleType == 2 || dialogForm.moduleType == 3">
-          <el-form-item label="本地地址：" prop="localIp">
+      <div class="networkComponent-dialog-box scrollbar-box">
+        <el-form :model="dialogForm" ref="dialogForm"  label-width="110px"
+                 :inline="true" :rules="dialogLookType?rules:dialogRules">
+          <el-form-item label="名称：" prop="moduleName">
             <el-input
               :disabled="dialogLookType"
-              v-model="dialogForm.localIp"
+              v-model="dialogForm.moduleName"
               maxLength="20"
-              placeholder="请输入地址"
+              placeholder="请输入名称"
               style="width:360px;"
             />
           </el-form-item>
-          <el-form-item label="本地端口：" prop="localPort">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.localPort"
-              maxLength="10"
-              placeholder="请输入端口"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="公网地址：" prop="publicIp">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.publicIp"
-              maxLength="50"
-              placeholder="请输入地址"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="公网端口：" prop="publicPort">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.publicPort"
-              maxLength="10"
-              placeholder="请输入端口"
-              style="width:360px;"
-            />
-          </el-form-item>
-        </div>
-        <div v-if="dialogForm.moduleType == 1">
-          <el-form-item label="认证key：" prop="authKey">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.authKey"
-              maxLength="200"
-              placeholder="请输入认证key"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="密匙：" prop="authPassword">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.authPassword"
-              maxLength="200"
-              placeholder="请输入密匙"
-              style="width:360px;"
-            />
-          </el-form-item>
-        </div>
-        <div v-if="dialogForm.moduleType == 2">
-          <el-form-item label="粘拆包：" prop="dataPacket">
-            <el-select v-model="dialogForm.dataPacket"
+          <el-form-item label="类型：" prop="moduleType">
+            <el-select v-model="dialogForm.moduleType"
+                       placeholder="请选类型"
                        :disabled="dialogLookType"
-                       placeholder="请选择粘拆包类型"
                        clearable style="width:360px;">
-              <el-option label="不处理" :value="0"></el-option>
-              <el-option label="分隔符" :value="1"></el-option>
-              <el-option label="自定义脚本" :value="2"></el-option>
-              <el-option label="固定长度" :value="3"></el-option>
-              <el-option label="长度字段" :value="4"></el-option>
+              <el-option
+                v-for="dict in options"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              ></el-option>
             </el-select>
           </el-form-item>
-          <el-form-item v-if="dialogForm.dataPacket != 0" label="粘拆包字符：" prop="dataPacketContent">
+          <div v-if="dialogForm.moduleType == 1 || dialogForm.moduleType == 2 || dialogForm.moduleType == 3">
+            <el-form-item label="本地地址：" prop="localIp">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.localIp"
+                maxLength="20"
+                placeholder="请输入地址"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="本地端口：" prop="localPort">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.localPort"
+                maxLength="10"
+                placeholder="请输入端口"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="公网地址：" prop="publicIp">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.publicIp"
+                maxLength="50"
+                placeholder="请输入地址"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="公网端口：" prop="publicPort">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.publicPort"
+                maxLength="10"
+                placeholder="请输入端口"
+                style="width:360px;"
+              />
+            </el-form-item>
+          </div>
+          <div v-if="dialogForm.moduleType == 1">
+            <el-form-item label="认证key：" prop="authKey">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.authKey"
+                maxLength="200"
+                placeholder="请输入认证key"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="密匙：" prop="authPassword">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.authPassword"
+                maxLength="200"
+                placeholder="请输入密匙"
+                style="width:360px;"
+              />
+            </el-form-item>
+          </div>
+          <div v-if="dialogForm.moduleType == 2">
+            <el-form-item label="粘拆包：" prop="dataPacket">
+              <el-select v-model="dialogForm.dataPacket"
+                         :disabled="dialogLookType"
+                         placeholder="请选择粘拆包类型"
+                         clearable style="width:360px;">
+                <el-option label="不处理" :value="0"></el-option>
+                <el-option label="分隔符" :value="1"></el-option>
+                <el-option label="自定义脚本" :value="2"></el-option>
+                <el-option label="固定长度" :value="3"></el-option>
+                <el-option label="长度字段" :value="4"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item v-if="dialogForm.dataPacket != 0" label="粘拆包字符：" prop="dataPacketContent">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.dataPacketContent"
+                maxLength="200"
+                placeholder="请输入粘拆包字符"
+                :show-word-limit="true"
+                style="width:360px;"
+                type="textarea"
+                resize="none"
+                :rows="2"
+              />
+            </el-form-item>
+          </div>
+          <div v-if="dialogForm.moduleType == 4">
+            <el-form-item label="远程地址：" prop="publicIp">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.publicIp"
+                maxLength="50"
+                placeholder="请输入地址"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="远程端口：" prop="publicPort">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.publicPort"
+                maxLength="10"
+                placeholder="请输入端口"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="clientId：" prop="clientId">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.clientId"
+                maxLength="30"
+                placeholder="请输入clientId"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="用户名：" prop="username">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.username"
+                maxLength="30"
+                placeholder="请输入用户名"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="密码：" prop="password">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.password"
+                maxLength="20"
+                placeholder="请输入密码"
+                style="width:360px;"
+              />
+            </el-form-item>
+            <el-form-item label="订阅前缀：" prop="prefix">
+              <el-input
+                :disabled="dialogLookType"
+                v-model="dialogForm.prefix"
+                maxLength="30"
+                placeholder="请输入订阅前缀"
+                style="width:360px;"
+              />
+            </el-form-item>
+          </div>
+          <div v-if="dialogForm.moduleType == 3 || dialogForm.moduleType == 4">
+            <el-form-item label="消息长度：" prop="messageLength">
+              <el-input-number v-model="dialogForm.messageLength"
+                               :disabled="dialogLookType"
+                               clearable style="width:360px;"
+                               controls-position="right"
+                               :min="10" :max="1000"></el-input-number>
+            </el-form-item>
+          </div>
+          <!--<el-form-item label="自定义参数：">-->
+            <div class="for-params-max-box">
+              <p class="for-params-title-p">自定义参数：</p>
+              <div class="for-params-big-box">
+                <div class='for-params-box' v-for="(item,index) in dialogForm.params">
+                  <el-form-item label="" :prop="'params.'+index+'.key'" :rules="dialogRules.key">
+                    <el-input
+                      :disabled="dialogLookType"
+                      v-model="item.key"
+                      maxLength="30"
+                      placeholder="请输入键"
+                      style="width:140px;"
+                    />
+                  </el-form-item>
+                  <el-form-item label="" :prop="'params.'+index+'.value'" :rules="dialogRules.value">
+                    <el-input
+                      :disabled="dialogLookType"
+                      v-model="item.value"
+                      maxLength="30"
+                      placeholder="请输入值"
+                      style="width:140px;"
+                    />
+                  </el-form-item>
+                  <span class="el-icon-remove del-span" @click="delItem(index)" v-if="!dialogLookType"></span>
+                </div>
+              </div>
+              <span class="null-span" v-if="!dialogForm.params[0]">未配置</span>
+              <span class="el-icon-circle-plus add-span" @click="addItem" v-if="!dialogLookType && !dialogForm.params[4]"></span>
+            </div>
+          <!--</el-form-item>-->
+          <el-form-item label="说明：" prop="remark">
             <el-input
               :disabled="dialogLookType"
-              v-model="dialogForm.dataPacketContent"
+              v-model="dialogForm.remark"
               maxLength="200"
-              placeholder="请输入粘拆包字符"
+              placeholder="请输入说明"
               :show-word-limit="true"
               style="width:360px;"
               type="textarea"
               resize="none"
-              :rows="2"
-            />
-          </el-form-item>
-        </div>
-        <div v-if="dialogForm.moduleType == 4">
-          <el-form-item label="远程地址：" prop="publicIp">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.publicIp"
-              maxLength="50"
-              placeholder="请输入地址"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="远程端口：" prop="publicPort">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.publicPort"
-              maxLength="10"
-              placeholder="请输入端口"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="clientId：" prop="clientId">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.clientId"
-              maxLength="30"
-              placeholder="请输入clientId"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="用户名：" prop="username">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.username"
-              maxLength="30"
-              placeholder="请输入用户名"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="密码：" prop="password">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.password"
-              maxLength="20"
-              placeholder="请输入密码"
-              style="width:360px;"
-            />
-          </el-form-item>
-          <el-form-item label="订阅前缀：" prop="prefix">
-            <el-input
-              :disabled="dialogLookType"
-              v-model="dialogForm.prefix"
-              maxLength="30"
-              placeholder="请输入订阅前缀"
-              style="width:360px;"
+              :rows="4"
             />
           </el-form-item>
-        </div>
-        <div v-if="dialogForm.moduleType == 3 || dialogForm.moduleType == 4">
-          <el-form-item label="消息长度：" prop="messageLength">
-            <el-input-number v-model="dialogForm.messageLength"
-                             :disabled="dialogLookType"
-                             clearable style="width:360px;"
-                             controls-position="right"
-                             :min="10" :max="1000"></el-input-number>
-          </el-form-item>
-        </div>
-        <el-form-item label="说明：" prop="remark">
-          <el-input
-            :disabled="dialogLookType"
-            v-model="dialogForm.remark"
-            maxLength="200"
-            placeholder="请输入说明"
-            :show-word-limit="true"
-            style="width:360px;"
-            type="textarea"
-            resize="none"
-            :rows="4"
-          />
-        </el-form-item>
-      </el-form>
+        </el-form>
+      </div>
       <div slot="footer" class="dialog-footer dialog-footer-box">
         <p class="dialog-footer-button-null"></p>
         <p class="dialog-footer-button-info" @click="dialogOff()">{{dialogLookType?'关闭':'取消'}}</p>
@@ -369,6 +401,14 @@
             { required: true, message: "请输入消息长度", trigger: "blur" },
             { required: true, message: "请输入消息长度", validator: this.spaceJudgment, trigger: "blur" }
           ],
+          key: [
+            { required: true, message: "请输入键", trigger: "blur" },
+            { required: true, message: "请输入键", validator: this.spaceJudgment, trigger: "blur" }
+          ],
+          value: [
+            { required: true, message: "请输入值", trigger: "blur" },
+            { required: true, message: "请输入值", validator: this.spaceJudgment, trigger: "blur" }
+          ],
         },
         dialogLookType:false,
         rules:{},
@@ -403,6 +443,7 @@
           password:'',
           prefix:'',
           messageLength:'',
+          params:[],
           remark:'',
         });
         this.$set(this,'dialogTitle','新增');
@@ -413,7 +454,7 @@
       dialogSubmit(){
         this.$refs["dialogForm"].validate(valid => {
           if (valid) {
-            let obj = this.dataProcessing(this.dialogForm);
+            let obj = this.dataProcessing(this.dialogForm,'set');
             if(obj.id){
               iotNetworkUpdate(obj).then(response => {
                 this.$set(this,'dialogType',false);
@@ -455,12 +496,12 @@
       tableButton(type,row){
         let self = this;
         if(type == 2){
-          this.$set(this,'dialogForm',this.dataProcessing(row));
+          this.$set(this,'dialogForm',this.dataProcessing(row,'get'));
           this.$set(this,'dialogTitle','详情');
           this.$set(this,'dialogLookType',true);
           this.$set(this,'dialogType',true);
         }else if(type == 3){
-          this.$set(this,'dialogForm',this.dataProcessing(row));
+          this.$set(this,'dialogForm',this.dataProcessing(row,'get'));
           this.$set(this,'dialogTitle','编辑');
           this.$set(this,'dialogLookType',false);
           this.$set(this,'dialogType',true);
@@ -480,7 +521,7 @@
         }
       },
       //数据处理
-      dataProcessing(data){
+      dataProcessing(data,type){
         let newData = {
           moduleName:data.moduleName,
           moduleType:data.moduleType,
@@ -499,11 +540,24 @@
           prefix:data.moduleType == 4 ?data.prefix:'',
           messageLength:data.moduleType == 3 || data.moduleType == 4 ?data.messageLength:'',
         }
+        if(type == 'get'){
+          newData.params = data.params?JSON.parse(data.params):[];
+        }else if(type == 'set'){
+          newData.params = data.params[0]?JSON.stringify(data.params):'';
+        }
         if(data.id){
           newData.id = data.id;
         }
         return JSON.parse(JSON.stringify(newData))
       },
+      //添加自定义项
+      addItem(){
+        this.dialogForm.params.push({key:'',value:''})
+      },
+      //删除自定义项
+      delItem(index){
+        this.dialogForm.params.splice(index,1);
+      },
     },
   }
 </script>
@@ -517,9 +571,49 @@
 </style>
 <style lang="scss">
   .networkComponent-dialog{
-    .el-input__inner,.el-textarea__inner{
-      cursor: default!important;
-      color:#666!important;
+    .networkComponent-dialog-box{
+      height:660px;
+      .for-params-max-box{
+        display: flex;
+        .for-params-title-p{
+          line-height:40px;
+          text-align: right;
+          font-size:14px;
+          color:#333;
+          width:100px;
+          margin:0 12px 20px 0;
+        }
+        .for-params-big-box{
+          .for-params-box{
+            .del-span{
+              font-size:18px;
+              color:#FF6666;
+              line-height:40px;
+              width:30px;
+              text-align: center;
+              cursor: pointer;
+            }
+          }
+        }
+        .add-span{
+          font-size:18px;
+          color:#0183FA;
+          line-height:40px;
+          height:40px;
+          width:30px;
+          text-align: center;
+          cursor: pointer;
+        }
+        .null-span{
+          font-size:14px;
+          line-height:40px;
+          height:40px;
+        }
+      }
+      .el-input__inner,.el-textarea__inner{
+        cursor: default!important;
+        color:#666!important;
+      }
     }
   }
 </style>