fix: 转发规则http类型显示问题

src/pages/Iot/rule/forwardRule.vue

@@ -102,6 +102,7 @@
   title="创建规则"
   @cancel="state.visible = false"
   @ok="ok"
+  footer
 >
   <a-card title="设置转发数据" >
     <div style="margin-bottom: 20px;" >针对部分类型数据提供的快速配置，将引导您完成简单的业务设置。您也可以直接编辑过滤语句，实现更复杂的查询要求</div>
@@ -363,8 +364,25 @@
         :columns="detailColumn['HTTP']"
         :data-source="detailHTTPList"
         :pagination="false"
-      />
-
+      >
+        <template #bodyCell="{column, record}" >
+          <template v-if="column.key === 'requestHeaders'" >
+            <a-tooltip color="white" :overlayStyle="{width: '800px'}" >
+              <template #title>
+                <a-textarea
+                  :bordered="false"
+                  style="width: 600px;"
+                  :auto-size="{ minRows: 5, maxRows: 15 }"
+                  :value="JSON.stringify(record.requestHeaders, null, '\t')"
+                  >
+                </a-textarea>
+              </template>
+              {{JSON.stringify(record.requestHeaders)}}
+            </a-tooltip>
+            <!-- {{JSON.stringify(record.requestHeaders)}} -->
+          </template>
+        </template>
+      </a-table>
     </a-form-item>
     <a-form-item label="Kafka"  v-if="detailKAFKAList.length">
       <a-table
@@ -499,9 +517,9 @@ const statusList = [
 const detailColumn = reactive({
   HTTP: [
     { title: 'http地址', dataIndex: 'endpointUrl' },
-    { title: 'requestMethod', dataIndex: '请求方法' },
-    { title: 'defaultTimeout', dataIndex: '超时时间' },
-    { title: 'requestHeaders', dataIndex: '请求头' }
+    { title: '请求方法', dataIndex: 'requestMethod' },
+    { title: '超时时间', dataIndex: 'defaultTimeout' },
+    { title: '请求头', dataIndex: 'requestHeaders', key: 'requestHeaders' }
   ],
   Kafka: [
     { title: '主题', dataIndex: 'topic' },
@@ -794,7 +812,9 @@ const ok = async () => {
         resetFields(JSON.parse(JSON.stringify(initForwardState)))
       }
       state.targetVisible = false
-    }).catch(e => e)
+    }).catch(e => {
+      console.log(e)
+    })
   } else {
     validateStep1().then(async (r) => {
       const _otherProperties: Record<string, string> = {}

src/pages/Iot/rule/linkRules.vue

@@ -115,6 +115,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'conditionType'" >
+                  {{conditionTypeList.toMap('key', 'name').get(record.conditionType)}}
+                </template>
                 <template v-if="column.key === 'action'" >
                   <a @click="delCondiTionsAndActions(record.id, 'conditions')" >
                     删除
@@ -132,6 +135,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'conditionType'" >
+                  {{conditionTypeList.toMap('key', 'name').get(record.conditionType)}}
+                </template>
                 <template v-if="column.key === 'sessionEventType'" >
                 {{record.sessionEventType === 'CONNECT' ? '连接' : '断开连接'  }}
                 </template>
@@ -152,6 +158,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'conditionType'" >
+                  {{conditionTypeList.toMap('key', 'name').get(record.conditionType)}}
+                </template>
                 <template v-if="column.key === 'dayOfWeek'" >
                 {{record.dayOfWeek.map(item => '周' + item).join(',') }}
                 </template>
@@ -190,6 +199,9 @@
             >
 
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'actionType'" >
+                  {{actionTypeList.toMap('key', 'name').get(record.actionType) }}
+                </template>
                 <template v-if="column.key === 'cmdParameters'" >
                   <a-tooltip color="white" :overlayStyle="{width: '800px'}" >
                   <template #title>
@@ -222,6 +234,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'actionType'" >
+                  {{actionTypeList.toMap('key', 'name').get(record.actionType) }}
+                </template>
                 <template v-if="column.key === 'action'" >
                   <a @click="delCondiTionsAndActions(record.id, 'actions')" >
                     删除
@@ -239,6 +254,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'actionType'" >
+                  {{actionTypeList.toMap('key', 'name').get(record.actionType) }}
+                </template>
                 <template v-if="column.key === 'action'" >
                   <a @click="delCondiTionsAndActions(record.id, 'actions')" >
                     删除
@@ -256,6 +274,9 @@
               :pagination="false"
             >
               <template #bodyCell="{column, record}" >
+                <template v-if="column.key === 'actionType'" >
+                  {{actionTypeList.toMap('key', 'name').get(record.actionType) }}
+                </template>
                 <template v-if="column.key === 'action'" >
                   <a @click="delCondiTionsAndActions(record.id, 'actions')" >
                     删除
@@ -287,14 +308,14 @@
     <div  style="width: 100%;" v-if="state.opraModel === 'conditions'" >
       <a-row :gutter="[8, 8]" style="width: 100%;" >
         <a-form
-           style="width: 100%;"
+          style="width: 100%;"
           :label-col="{ span: 3 }"
           :wrapper-col="{ span: 16 }"
         >
           <a-col>
             <a-form-item label="触发条件" >
               <a-select
-              allowClear
+                allowClear
                 style="width: 170px"
                 v-model:value="initConditionsData.conditionType"
               >
@@ -781,38 +802,38 @@ const selectDeviceList = [
 
 const conditionColumns = reactive({
   DEVICE_DATA: [
-    { title: '触发条件', dataIndex: 'conditionType' }, { title: '产品ID', dataIndex: 'modelId' },
+    { title: '触发条件', dataIndex: 'conditionType', key: 'conditionType' }, { title: '产品ID', dataIndex: 'modelId' },
     { title: '属性key', dataIndex: 'attributeKey' }, { title: '操作符', dataIndex: 'operator' },
-    { title: '触发值', dataIndex: 'value' }, { title: '操作符', dataIndex: 'operator' }, { title: '操作', key: 'action' }
+    { title: '触发值', dataIndex: 'value' }, { title: '操作', key: 'action' }
   ],
   DEVICE_SESSION: [
-    { title: '触发条件', dataIndex: 'conditionType' }, { title: '产品ID', dataIndex: 'modelId' },
+    { title: '触发条件', dataIndex: 'conditionType', key: 'conditionType' }, { title: '产品ID', dataIndex: 'modelId' },
     { title: '设备类型', dataIndex: 'deviceType' }, { title: '设备名称', dataIndex: 'deviceLabel' },
     { title: 'sessionEventType', dataIndex: 'attributeKey', key: 'sessionEventType' }, { title: '操作', key: 'action' }
   ],
   DAILY_TIMER: [
-    { title: '触发条件', dataIndex: 'conditionType' }, { title: '时间', dataIndex: 'time', key: 'time' },
+    { title: '触发条件', dataIndex: 'conditionType', key: 'conditionType' }, { title: '时间', dataIndex: 'time', key: 'time' },
     { title: '日期', dataIndex: 'dayOfWeek', key: 'dayOfWeek' }, { title: '操作', key: 'action' }
   ]
 })
 
 const actionsColumns = reactive({
   DEVICE_CMD: [
-    { title: '触发动作', dataIndex: 'actionType' }, { title: '产品ID', dataIndex: 'modelId' },
+    { title: '触发动作', dataIndex: 'actionType', key: 'actionType' }, { title: '产品ID', dataIndex: 'modelId' },
     { title: '设备id', dataIndex: 'deviceId' }, { title: '命令名称', dataIndex: 'cmdLabel' },
     { title: '命令参数', key: 'cmdParameters', dataIndex: 'cmdParameters', ellipsis: true, width: 120 }, { title: '操作', dataIndex: 'action', key: 'action' }
   ],
   REPORT_WARN: [
-    { title: '触发动作', dataIndex: 'actionType' }, { title: '设备id', dataIndex: 'deviceId' },
+    { title: '触发动作', dataIndex: 'actionType', key: 'actionType' }, { title: '设备id', dataIndex: 'deviceId' },
     { title: '告警名称', dataIndex: 'warnLabel' }, { title: '告警描述', dataIndex: 'warnDescription' },
     { title: '告警级别', dataIndex: 'warnSeverity' }, { title: '操作', dataIndex: 'action', key: 'action' }
   ],
   RESUME_WARN: [
-    { title: '触发动作', dataIndex: 'actionType' }, { title: '告警名称', dataIndex: 'warnLabel' },
+    { title: '触发动作', dataIndex: 'actionType', key: 'actionType' }, { title: '告警名称', dataIndex: 'warnLabel' },
     { title: '告警级别', dataIndex: 'warnSeverity' }, { title: '操作', dataIndex: 'action', key: 'action' }
   ],
   NOTICE: [
-    { title: '触发动作', dataIndex: 'actionType' }, { title: '提示名称', dataIndex: 'noticeLabel' },
+    { title: '触发动作', dataIndex: 'actionType', key: 'actionType' }, { title: '提示名称', dataIndex: 'noticeLabel' },
     { title: '提示描述', dataIndex: 'noticeDescription' }, { title: '提示用户', dataIndex: 'userId' },
     { title: '操作', dataIndex: 'action', key: 'action' }
   ]
@@ -1132,15 +1153,13 @@ const delCondiTionsAndActions = (id: string, key: 'conditions' | 'actions') => {
 
 function selectConditionAndAction () {
   if (state.opraModel === 'conditions') {
-    bodyParamsState.conditions.push({
-      ...JSON.parse(JSON.stringify({
-        ...initConditionsData,
-        conditionName: ''
-      })),
-      id: useId()
-    })
+    const _params = { ...JSON.parse(JSON.stringify({ ...initConditionsData })), id: useId() }
+    console.log('_params:', _params)
+    bodyParamsState.conditions.push(_params)
   } else {
-    bodyParamsState.actions.push({ ...initActionsData, id: useId() })
+    const _params = { ...JSON.parse(JSON.stringify({ ...initActionsData })), id: useId() }
+
+    bodyParamsState.actions.push(_params)
   }
   console.log('bodyParamsState.conditions:', bodyParamsState.conditions)