perf: 【IoT 物联网】场景联动执行器的 UI 风格对齐触发器

src/api/iot/rule/scene/index.ts

@@ -46,28 +46,28 @@ export interface Action {
 export const RuleSceneApi = {
   // 查询场景联动分页
   getRuleScenePage: async (params: any) => {
-    return await request.get({ url: `/iot/rule-scene/page`, params })
+    return await request.get({ url: `/iot/scene-rule/page`, params })
   },
 
   // 查询场景联动详情
   getRuleScene: async (id: number) => {
-    return await request.get({ url: `/iot/rule-scene/get?id=` + id })
+    return await request.get({ url: `/iot/scene-rule/get?id=` + id })
   },
 
   // 新增场景联动
   createRuleScene: async (data: IotSceneRule) => {
-    return await request.post({ url: `/iot/rule-scene/create`, data })
+    return await request.post({ url: `/iot/scene-rule/create`, data })
   },
 
   // 修改场景联动
   updateRuleScene: async (data: IotSceneRule) => {
-    return await request.put({ url: `/iot/rule-scene/update`, data })
+    return await request.put({ url: `/iot/scene-rule/update`, data })
   },
 
   // 修改场景联动
   updateRuleSceneStatus: async (id: number, status: number) => {
     return await request.put({
-      url: `/iot/rule-scene/update-status`,
+      url: `/iot/scene-rule/update-status`,
       data: {
         id,
         status
@@ -77,11 +77,11 @@ export const RuleSceneApi = {
 
   // 删除场景联动
   deleteRuleScene: async (id: number) => {
-    return await request.delete({ url: `/iot/rule-scene/delete?id=` + id })
+    return await request.delete({ url: `/iot/scene-rule/delete?id=` + id })
   },
 
   // 获取场景联动简单列表
   getSimpleRuleSceneList: async () => {
-    return await request.get({ url: `/iot/rule-scene/simple-list` })
+    return await request.get({ url: `/iot/scene-rule/simple-list` })
   }
 }

src/views/iot/device/device/DeviceForm.vue

@@ -98,7 +98,7 @@
                 :isWrite="true"
                 :clickMap="true"
                 :center="formData.location"
-                @locateChange="handleLocationChange"
+                @locate-change="handleLocationChange"
                 ref="mapRef"
                 class="h-full w-full"
               />

src/views/iot/rule/scene/form/sections/ActionSection.vue

@@ -1,5 +1,4 @@
 <!-- 执行器配置组件 -->
-<!-- TODO @puhui999：每个执行器的 UI 风格，应该和【触发器配置】那，有点像 -->
 <template>
   <el-card class="border border-[var(--el-border-color-light)] rounded-8px" shadow="never">
     <template #header>
@@ -35,27 +34,37 @@
       </div>
 
       <!-- 执行器列表 -->
-      <div v-else class="space-y-16px">
+      <div v-else class="space-y-24px">
         <div
           v-for="(action, index) in actions"
           :key="`action-${index}`"
-          class="p-16px border border-[var(--el-border-color-lighter)] rounded-6px bg-[var(--el-fill-color-blank)]"
+          class="border-2 border-blue-200 rounded-8px bg-blue-50 shadow-sm hover:shadow-md transition-shadow"
         >
-          <div class="flex items-center justify-between mb-16px">
+          <!-- 执行器头部 - 蓝色主题 -->
-            <div class="flex items-center gap-8px">
+          <div
-              <Icon icon="ep:setting" class="text-[var(--el-color-success)] text-16px" />
+            class="flex items-center justify-between p-16px bg-gradient-to-r from-blue-50 to-sky-50 border-b border-blue-200 rounded-t-6px"
+          >
+            <div class="flex items-center gap-12px">
+              <div class="flex items-center gap-8px text-16px font-600 text-blue-700">
+                <div
+                  class="w-24px h-24px bg-blue-500 text-white rounded-full flex items-center justify-center text-12px font-bold"
+                >
+                  {{ index + 1 }}
+                </div>
                 <span>执行器 {{ index + 1 }}</span>
-              <el-tag :type="getActionTypeTag(action.type)" size="small">
+              </div>
+              <el-tag :type="getActionTypeTag(action.type)" size="small" class="font-500">
                 {{ getActionTypeLabel(action.type) }}
               </el-tag>
             </div>
-            <div>
+            <div class="flex items-center gap-8px">
               <el-button
+                v-if="actions.length > 1"
                 type="danger"
                 size="small"
                 text
                 @click="removeAction(index)"
-                v-if="actions.length > 1"
+                class="hover:bg-red-50"
               >
                 <Icon icon="ep:delete" />
                 删除
@@ -63,7 +72,8 @@
             </div>
           </div>
 
-          <div class="space-y-16px">
+          <!-- 执行器内容区域 -->
+          <div class="p-16px space-y-16px">
             <!-- 执行类型选择 -->
             <div class="w-full">
               <el-form-item label="执行类型" required>