Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev

2023-03-15 17:41:45 +08:00 · 2023-03-15 17:41:45 +08:00 · 46df7d35c5
parent 174cf36d09 bebb4b8d45
commit 46df7d35c5
25 changed files with 601 additions and 270 deletions
--- a/src/views/device/DashBoard/index.vue
+++ b/src/views/device/DashBoard/index.vue
@ -22,12 +22,8 @@
                    ><TopCard
                        title="当前在线"
                        :footer="onlineFooter"
-                        :value="onlineToday"
+                        :value="deviceOnline"
                    >
-                        <!-- <BarChart
-                            :chartXData="barChartXData"
-                            :chartYData="barChartYData"
-                        ></BarChart>  -->
                        <Charts :options="onlineOptions"></Charts> </TopCard
                ></j-col>
                <j-col :span="6"
@ -140,6 +136,9 @@ const quickBtnList = [
    { label: '近一月', value: 'month' },
    { label: '近一年', value: 'year' },
 ];
+/**
+ * 获取产品数量
+ */
 const getProductData = () => {
    if (menuStore.hasMenu('device/Product')) {
        productCount().then((res) => {
@ -174,6 +173,9 @@ const getProductData = () => {
    }
 };
 getProductData();
+/**
+ * 获取设备数量
+ */
 const getDeviceData = () => {
    if (menuStore.hasMenu('device/Instance')) {
        deviceCount().then((res) => {
@ -197,6 +199,9 @@ const getDeviceData = () => {
    }
 };
 getDeviceData();
+/**
+ * 获取在线数量
+ */
 const getOnline = () => {
    dashboard([
        {
@ -222,7 +227,8 @@ const getOnline = () => {
            const onlineYdata = y;
            onlineYdata.reverse();
            setOnlineChartOpition(x, onlineYdata);
-            deviceFooter.value[0].value = y?.[1];
+            onlineFooter.value[0].value = y?.[1];
+            console.log(res.result);
        }
    });
 };
--- a/src/views/device/Product/Save/index.vue
+++ b/src/views/device/Product/Save/index.vue
@ -23,7 +23,7 @@
                <j-row type="flex">
                    <j-col flex="180px">
                        <j-form-item name="photoUrl">
-                            <JUpload v-model="form.photoUrl" />
+                            <Upload v-model="form.photoUrl" />
                        </j-form-item>
                        <!-- <j-form-item>
                            <div class="upload-image-warp-logo">
--- a/src/views/media/Cascade/Save/index.vue
+++ b/src/views/media/Cascade/Save/index.vue
@ -566,31 +566,31 @@ const route = useRoute();
 // 表单数据
 const formData = ref({
    id: route.query.id || undefined,
-    // name: '',
-    cascadeName: '',
+    // name: undefined,
+    cascadeName: undefined,
    proxyStream: false,
    // 以下字段, 提交时需提取到sipConfigs[{}]字段当中
-    clusterNodeId: '',
-    name: '',
-    sipId: '',
-    domain: '',
-    remoteAddress: '',
+    clusterNodeId: undefined,
+    name: undefined,
+    sipId: undefined,
+    domain: undefined,
+    remoteAddress: undefined,
    remotePort: undefined,
-    localSipId: '',
-    host: '',
+    localSipId: undefined,
+    host: undefined,
    port: undefined,
    // remotePublic: {
-    //     host: '',
+    //     host: undefined,
    //     port: undefined,
    // },
-    publicHost: '',
+    publicHost: undefined,
    publicPort: undefined,
    transport: 'UDP',
-    user: '',
-    password: '',
-    manufacturer: '',
-    model: '',
-    firmware: '',
+    user: undefined,
+    password: undefined,
+    manufacturer: undefined,
+    model: undefined,
+    firmware: undefined,
    keepaliveInterval: '60',
    registerInterval: '3600',
 });
--- a/src/views/notice/Template/Detail/components/ToOrg.vue
+++ b/src/views/notice/Template/Detail/components/ToOrg.vue
@ -13,19 +13,22 @@
 import templateApi from '@/api/notice/template';

 type Emits = {
-    (e: 'update:toParty', data: string): void;
+    (e: 'update:toParty', data: string | undefined): void;
 };
+
+type Props = {
+    toParty: string | undefined;
+    type: string | undefined;
+    configId: string | undefined;
+}
+
 const emit = defineEmits<Emits>();

-const props = defineProps({
-    toParty: { type: String, default: '' },
-    type: { type: String, default: '' },
-    configId: { type: String, default: '' },
-});
+const props = defineProps<Props>();

 const _value = computed({
    get: () => props.toParty,
-    set: (val: string) => emit('update:toParty', val),
+    set: (val: string | undefined) => emit('update:toParty', val),
 });
 const typeObj = {
    weixin: 'wechat',
--- a/src/views/notice/Template/Detail/components/ToTag.vue
+++ b/src/views/notice/Template/Detail/components/ToTag.vue
@ -13,19 +13,21 @@
 import templateApi from '@/api/notice/template';

 type Emits = {
-    (e: 'update:toTag', data: string): void;
+    (e: 'update:toTag', data: string | undefined): void;
 };
+type Props = {
+    toTag: string | undefined;
+    type: string | undefined;
+    configId: string | undefined;
+}
+
 const emit = defineEmits<Emits>();

-const props = defineProps({
-    toTag: { type: String, default: '' },
-    type: { type: String, default: '' },
-    configId: { type: String, default: '' },
-});
+const props = defineProps<Props>();

 const _value = computed({
    get: () => props.toTag,
-    set: (val: string) => emit('update:toTag', val),
+    set: (val: string | undefined) => emit('update:toTag', val),
 });

 const options = ref([]);
--- a/src/views/notice/Template/Detail/components/ToUser.vue
+++ b/src/views/notice/Template/Detail/components/ToUser.vue
@ -13,19 +13,21 @@
 import templateApi from '@/api/notice/template';

 type Emits = {
-    (e: 'update:toUser', data: string): void;
+    (e: 'update:toUser', data: string | undefined): void;
 };
+type Props = {
+    toUser: string | undefined;
+    type: string | undefined;
+    configId: string | undefined;
+}
+
 const emit = defineEmits<Emits>();

-const props = defineProps({
-    toUser: { type: String, default: '' },
-    type: { type: String, default: '' },
-    configId: { type: String, default: '' },
-});
+const props = defineProps<Props>();

 const _value = computed({
    get: () => props.toUser,
-    set: (val: string) => emit('update:toUser', val),
+    set: (val: string | undefined) => emit('update:toUser', val),
 });

 const typeObj = {
--- a/src/views/notice/Template/Detail/index.vue
+++ b/src/views/notice/Template/Detail/index.vue
@ -820,49 +820,49 @@ const resetPublicFiles = () => {
    formData.value.template = {};
    switch (formData.value.provider) {
        case 'dingTalkMessage':
-            formData.value.template.agentId = '';
-            formData.value.template.message = '';
-            formData.value.template.departmentIdList = '';
-            formData.value.template.userIdList = '';
+            formData.value.template.agentId = undefined;
+            formData.value.template.message = undefined;
+            formData.value.template.departmentIdList = undefined;
+            formData.value.template.userIdList = undefined;
            break;
        case 'dingTalkRobotWebHook':
-            formData.value.template.message = '';
+            formData.value.template.message = undefined;
            formData.value.template.messageType = 'markdown';
-            formData.value.template.markdown = { text: '', title: '' };
+            formData.value.template.markdown = { text: undefined, title: undefined };
            break;
        case 'corpMessage':
-            formData.value.template.agentId = '';
-            formData.value.template.message = '';
-            formData.value.template.toParty = '';
-            formData.value.template.toUser = '';
-            formData.value.template.toTag = '';
+            formData.value.template.agentId = undefined;
+            formData.value.template.message = undefined;
+            formData.value.template.toParty = undefined;
+            formData.value.template.toUser = undefined;
+            formData.value.template.toTag = undefined;
            break;
        case 'embedded':
-            formData.value.template.subject = '';
-            formData.value.template.message = '';
-            formData.value.template.text = '';
+            formData.value.template.subject = undefined;
+            formData.value.template.message = undefined;
+            formData.value.template.text = undefined;
            formData.value.template.sendTo = [];
            formData.value.template.attachments = [];
            break;
        case 'aliyun':
            formData.value.template.templateType = 'tts';
-            formData.value.template.templateCode = '';
-            formData.value.template.ttsCode = '';
-            // formData.value.template.message = '';
-            formData.value.template.ttsmessage = '';
+            formData.value.template.templateCode = undefined;
+            formData.value.template.ttsCode = undefined;
+            // formData.value.template.message = undefined;
+            formData.value.template.ttsmessage = undefined;
            formData.value.template.playTimes = 1;
-            formData.value.template.calledShowNumbers = '';
-            formData.value.template.calledNumber = '';
+            formData.value.template.calledShowNumbers = undefined;
+            formData.value.template.calledNumber = undefined;
            break;
        case 'aliyunSms':
-            formData.value.template.code = '';
-            formData.value.template.message = '';
-            formData.value.template.phoneNumber = '';
-            formData.value.template.signName = '';
+            formData.value.template.code = undefined;
+            formData.value.template.message = undefined;
+            formData.value.template.phoneNumber = undefined;
+            formData.value.template.signName = undefined;
            break;
        case 'http':
            formData.value.template.contextAsBody = true;
-            formData.value.template.body = '';
+            formData.value.template.body = undefined;
            break;
    }

--- a/src/views/notice/const.ts
+++ b/src/views/notice/const.ts
@ -94,42 +94,42 @@ export const MSG_TYPE = {
 export const CONFIG_FIELD_MAP = {
    dingTalk: {
        dingTalkMessage: {
-            appKey: '',
-            appSecret: '',
+            appKey: undefined,
+            appSecret: undefined,
        },
        dingTalkRobotWebHook: {
-            url: '',
+            url: undefined,
        }
    },
    weixin: {
        corpMessage: {
-            corpId: '',
-            corpSecret: '',
+            corpId: undefined,
+            corpSecret: undefined,
        },
        // officialMessage: {},
    },
    email: {
        embedded: {
-            host: '',
+            host: undefined,
            port: 25,
            ssl: false,
-            sender: '',
-            username: '',
-            password: '',
+            sender: undefined,
+            username: undefined,
+            password: undefined,
        }
    },
    voice: {
        aliyun: {
-            regionId: '',
-            accessKeyId: '',
-            secret: '',
+            regionId: undefined,
+            accessKeyId: undefined,
+            secret: undefined,
        }
    },
    sms: {
        aliyunSms: {
-            regionId: '',
-            accessKeyId: '',
-            secret: '',
+            regionId: undefined,
+            accessKeyId: undefined,
+            secret: undefined,
        }
    },
    webhook: {
@ -145,69 +145,69 @@ export const CONFIG_FIELD_MAP = {
 export const TEMPLATE_FIELD_MAP = {
    dingTalk: {
        dingTalkMessage: {
-            agentId: '',
-            message: '',
-            departmentIdList: '',
-            userIdList: ''
+            agentId: undefined,
+            message: undefined,
+            departmentIdList: undefined,
+            userIdList: undefined
        },
        dingTalkRobotWebHook: {
-            message: '',
+            message: undefined,
            messageType: 'markdown',
            markdown: {
-                text: '',
-                title: '',
+                text: undefined,
+                title: undefined,
            },
            link: {
-                title: '',
-                picUrl: '',
-                messageUrl: '',
-                text: '',
+                title: undefined,
+                picUrl: undefined,
+                messageUrl: undefined,
+                text: undefined,
            },
        }
    },
    weixin: {
        corpMessage: {
-            agentId: '',
-            message: '',
-            toParty: '',
-            toUser: '',
-            toTag: '',
+            agentId: undefined,
+            message: undefined,
+            toParty: undefined,
+            toUser: undefined,
+            toTag: undefined,
        },
        officialMessage: {},
    },
    email: {
        embedded: {
-            subject: '',
+            subject: undefined,
            sendTo: [],
            attachments: [],
-            message: '',
-            text: '',
+            message: undefined,
+            text: undefined,
        }
    },
    voice: {
        aliyun: {
            templateType: 'tts',
-            templateCode: '',
-            ttsCode: '',
-            // message: '',
-            ttsmessage: '',
+            templateCode: undefined,
+            ttsCode: undefined,
+            // message: undefined,
+            ttsmessage: undefined,
            playTimes: 1,
-            calledShowNumbers: '',
-            calledNumber: '',
+            calledShowNumbers: undefined,
+            calledNumber: undefined,
        }
    },
    sms: {
        aliyunSms: {
-            code: '',
-            message: '',
-            phoneNumber: '',
-            signName: '',
+            code: undefined,
+            message: undefined,
+            phoneNumber: undefined,
+            signName: undefined,
        }
    },
    webhook: {
        http: {
            contextAsBody: true,
-            body: ''
+            body: undefined
        }
    },
 };
--- a/src/views/rule-engine/Instance/Save/index.vue
+++ b/src/views/rule-engine/Instance/Save/index.vue
@ -53,9 +53,8 @@ const props = defineProps({
 const productList = ref<Record<string, any>[]>([]);
 const loading = ref<boolean>(false);
 const formRef = ref();
-let id = ref<string>();
 const modelRef = ref();
-modelRef.value = props.data
+modelRef.value = {...props.data};
 const rules = {
    name: [
        {
--- a/src/views/rule-engine/Instance/index.vue
+++ b/src/views/rule-engine/Instance/index.vue
@ -245,6 +245,9 @@ const getActions = (
                title: '查看',
            },
            icon: 'EyeOutlined',
+            onClick: () => {
+                openRuleEditor(data);
+            }
        },
        {
            key: 'action',
--- a/src/views/rule-engine/Scene/Save/Device/index.vue
+++ b/src/views/rule-engine/Scene/Save/Device/index.vue
@ -15,7 +15,6 @@
      </AddButton>
    </a-form-item>
    <Terms />
-    <Action />
    <AddModel v-if='visible' @cancel='visible = false' @save='save' :value='data.trigger.device' :options='data.options.trigger' />
  </div>
 </template>
--- a/src/views/rule-engine/Scene/Save/action/ListItem/FilterCondition.vue
+++ b/src/views/rule-engine/Scene/Save/action/ListItem/FilterCondition.vue
@ -0,0 +1,254 @@
+<template>
+  <div class='terms-params-item'>
+    <div v-if='!isFirst' class='term-type-warp'>
+      <DropdownButton
+        :options='[
+            { label: "并且", value: "and" },
+            { label: "或者", value: "or" },
+          ]'
+        type='type'
+        v-model:value='paramsValue.type'
+      />
+    </div>
+    <div
+      class='params-item_button'
+      @mouseover='mouseover'
+      @mouseout='mouseout'
+    >
+      <DropdownButton
+        :options='columnOptions'
+        icon='icon-zhihangdongzuoxie-1'
+        type='column'
+        value-name='column'
+        label-name='fullName'
+        placeholder='请选择参数'
+        v-model:value='paramsValue.column'
+        component='treeSelect'
+        @select='columnSelect'
+      />
+      <DropdownButton
+        :options='termTypeOptions'
+        type="termType"
+        value-name='id'
+        label-name='name'
+        placeholder="操作符"
+        v-model:value='paramsValue.termType'
+        @select='termsTypeSelect'
+      />
+      <DoubleParamsDropdown
+        v-if='showDouble'
+        icon='icon-canshu'
+        placeholder='参数值'
+        :options='valueOptions'
+        :metricOptions='metricOption'
+        :tabsOptions='tabsOptions'
+        v-model:value='paramsValue.value.value'
+        v-model:source='paramsValue.value.source'
+      />
+      <ParamsDropdown
+        v-else
+        icon='icon-canshu'
+        placeholder='参数值'
+        :options='valueOptions'
+        :metricOptions='metricOption'
+        :tabsOptions='tabsOptions'
+        v-model:value='paramsValue.value.value'
+        v-model:source='paramsValue.value.source'
+      />
+      <j-popconfirm title='确认删除？' @confirm='onDelete'>
+        <div v-show='showDelete' class='button-delete'> <AIcon type='CloseOutlined' /></div>
+      </j-popconfirm>
+    </div>
+    <div class='term-add' @click.stop='termAdd' v-if='isLast'>
+      <div class='terms-content'>
+        <AIcon type='PlusOutlined' style='font-size: 12px' />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang='ts' name='FilterCondition'>
+import type { PropType } from 'vue'
+import type { TermsType } from '@/views/rule-engine/Scene/typings'
+import DropdownButton from '../../components/DropdownButton'
+import { getOption } from '../../components/DropdownButton/util'
+import ParamsDropdown, { DoubleParamsDropdown } from '../../components/ParamsDropdown'
+import { inject } from 'vue'
+import { ContextKey } from '../../components/Terms/util'
+import { useSceneStore } from 'store/scene'
+import { storeToRefs } from 'pinia';
+
+const sceneStore = useSceneStore()
+const { data: formModel } = storeToRefs(sceneStore)
+
+type Emit = {
+  (e: 'update:value', data: TermsType): void
+}
+
+type TabsOption = {
+  label: string;
+  key: string;
+  component: string
+}
+
+const props = defineProps({
+  isFirst: {
+    type: Boolean,
+    default: true
+  },
+  isLast: {
+    type: Boolean,
+    default: true
+  },
+  showDeleteBtn: {
+    type: Boolean,
+    default: true
+  },
+  name: {
+    type: Number,
+    default: 0
+  },
+  termsName: {
+    type: Number,
+    default: 0
+  },
+  branchName: {
+    type: Number,
+    default: 0
+  },
+  thenName: {
+    type: Number,
+    default: 0
+  },
+  value: {
+    type: Object as PropType<TermsType>,
+    default: () => ({
+      column: '',
+      type: '',
+      termType: 'eq',
+      value: {
+        source: 'fixed',
+        value: undefined
+      }
+    })
+  }
+})
+
+const emit = defineEmits<Emit>()
+
+const paramsValue = reactive<TermsType>({
+  column: props.value.column,
+  type: props.value.type,
+  termType: props.value.termType,
+  value: props.value.value
+})
+
+const showDelete = ref(false)
+const columnOptions: any = inject(ContextKey) //
+const termTypeOptions = ref<Array<{ id: string, name: string}>>([]) // 条件值
+const valueOptions = ref<any[]>([]) // 默认手动输入下拉
+const metricOption = ref<any[]>([])  //
+const tabsOptions = ref<Array<TabsOption>>([{ label: '内置参数', key: 'upper', component: 'tree' }])
+// { label: '手动输入', key: 'fixed', component: 'string' },
+
+
+const handOptionByColumn = (option: any) => {
+  if (option) {
+    termTypeOptions.value = option.termTypes || []
+    metricOption.value = option.metrics || []
+    tabsOptions.value.length = 1
+    tabsOptions.value[0].component = option.dataType
+
+    if (option.metrics && option.metrics.length) {
+      tabsOptions.value.push(
+        { label: '指标值', key: 'metric', component: 'select' }
+      )
+    }
+
+    if (option.dataType === 'boolean') {
+      valueOptions.value = [
+        { label: '是', value: true },
+        { label: '否', value: false },
+      ]
+    } else if(option.dataType === 'enum') {
+      valueOptions.value = option.options?.map((item: any) => ({ ...item, label: item.name, value: item.id})) || []
+    } else{
+      valueOptions.value = option.options || []
+    }
+  } else {
+    termTypeOptions.value = []
+    metricOption.value = []
+    valueOptions.value = []
+  }
+}
+
+watchEffect(() => {
+  const option = getOption(columnOptions.value, paramsValue.column, 'column')
+  handOptionByColumn(option)
+})
+
+const showDouble = computed(() => {
+  const isRange = paramsValue.termType ? ['nbtw', 'btw', 'in', 'nin'].includes(paramsValue.termType) : false
+  if (metricOption.value.length) {
+    metricOption.value = metricOption.value.filter(item => isRange ? item.range : !item.range)
+  } else {
+    metricOption.value = []
+  }
+  return isRange
+})
+
+const mouseover = () => {
+  if (props.showDeleteBtn){
+    showDelete.value = true
+  }
+}
+
+const mouseout = () => {
+  if (props.showDeleteBtn){
+    showDelete.value = false
+  }
+}
+
+const columnSelect = () => {
+  paramsValue.termType = 'eq'
+  paramsValue.value = {
+    source: tabsOptions.value[0].key,
+    value: undefined
+  }
+  emit('update:value', { ...paramsValue })
+}
+
+const termsTypeSelect = () => {
+  paramsValue.value = {
+    source: tabsOptions.value[0].key,
+    value: undefined
+  }
+  emit('update:value', { ...paramsValue })
+}
+
+const termAdd = () => {
+  const terms = {
+    column: undefined,
+    value: {
+      source: 'fixed',
+      value: undefined
+    },
+    termType: undefined,
+    type: 'and',
+    key: `params_${new Date().getTime()}`
+  }
+  formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.name].terms?.push(terms)
+}
+
+const onDelete = () => {
+  formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.name].terms?.splice(props.name, 1)
+}
+
+nextTick(() => {
+  Object.assign(paramsValue, props.value)
+})
+</script>
+
+<style scoped>
+
+</style>
--- a/src/views/rule-engine/Scene/Save/action/ListItem/FilterGroup.vue
+++ b/src/views/rule-engine/Scene/Save/action/ListItem/FilterGroup.vue
@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script setup lang='ts' name='FilterGroup'>
+export default {
+  name: 'FilterGroup'
+}
+</script>
+
+<style scoped>
+
+</style>
--- a/src/views/rule-engine/Scene/Save/action/ListItem/Item.vue
+++ b/src/views/rule-engine/Scene/Save/action/ListItem/Item.vue
@ -318,16 +318,26 @@
            </j-popconfirm>
        </div>
        <template v-if="!isLast && type === 'serial'">
-            <div class="actions-item-filter-warp">
-                <!-- filter-border -->
-                满足此条件后执行后续动作
+            <div :class='["actions-item-filter-warp", termsOptions.length ? "filter-border" : ""]'>
+              <template v-if='termsOptions.length'>
+                <div class='actions-item-filter-warp-tip'>
+                  满足此条件后执行后续动作
+                </div>
+                <div class='actions-item-filter-overflow'>
+
+                </div>
+              </template>
+              <div v-else class='filter-add-button'>
+                <AIcon type='PlusOutlined' style='padding-right: 4px;' />
+                <span>添加过滤条件</span>
+              </div>
            </div>
        </template>
        <!-- 编辑 -->
        <template v-if="visible">
            <Modal
                :name="name"
-                :branchGroup="branchGroup"
+                :branchGroup="thenName"
                :branchesName="branchesName"
                :data="data"
                @cancel="onClose"
@ -352,7 +362,6 @@
 </template>

 <script lang="ts" setup>
-import { getImage } from '@/utils/comm';
 import { isBoolean } from 'lodash-es';
 import { PropType } from 'vue';
 import { ActionsType, ParallelType } from '../../../typings';
@ -361,6 +370,7 @@ import ActionTypeComponent from '../Modal/ActionTypeComponent.vue';
 import TriggerAlarm from '../TriggerAlarm/index.vue';
 import { useSceneStore } from '@/store/scene';
 import { storeToRefs } from 'pinia';
+import { iconMap, itemNotifyIconMap, typeIconMap } from './util'

 const sceneStore = useSceneStore();
 const { data: _data } = storeToRefs(sceneStore);
@ -370,9 +380,9 @@ const props = defineProps({
        type: Number,
        default: 0,
    },
-    branchGroup: {
-        type: Number,
-        default: 0,
+    thenName: {
+      type: Number,
+      default: 0,
    },
    name: {
        type: Number,
@ -397,37 +407,17 @@ const props = defineProps({

 const emit = defineEmits(['delete', 'update']);

-const iconMap = new Map();
-iconMap.set('trigger', getImage('/scene/action-bind-icon.png'));
-iconMap.set('notify', getImage('/scene/action-notify-icon.png'));
-iconMap.set('device', getImage('/scene/action-device-icon.png'));
-iconMap.set('relieve', getImage('/scene/action-unbind-icon.png'));
-iconMap.set('delay', getImage('/scene/action-delay-icon.png'));
-
-const itemNotifyIconMap = new Map();
-itemNotifyIconMap.set(
-    'dingTalk',
-    getImage('/scene/notify-item-img/dingtalk.png'),
-);
-itemNotifyIconMap.set('weixin', getImage('/scene/notify-item-img/weixin.png'));
-itemNotifyIconMap.set('email', getImage('/scene/notify-item-img/email.png'));
-itemNotifyIconMap.set('voice', getImage('/scene/notify-item-img/voice.png'));
-itemNotifyIconMap.set('sms', getImage('/scene/notify-item-img/sms.png'));
-itemNotifyIconMap.set(
-    'webhook',
-    getImage('/scene/notify-item-img/webhook.png'),
-);
-
-const typeIconMap = {
-    READ_PROPERTY: 'icon-zhihangdongzuodu',
-    INVOKE_FUNCTION: 'icon-zhihangdongzuoxie-1',
-    WRITE_PROPERTY: 'icon-zhihangdongzuoxie',
-};
-
 const visible = ref<boolean>(false);
 const triggerVisible = ref<boolean>(false);
 const actionType = ref('');

+const termsOptions = computed(() => {
+  if (!props.parallel) { // 串行
+    return _data.value.branches![props.branchesName].then?.[props.thenName].actions?.[props.name].terms || []
+  }
+  return []
+})
+
 const onDelete = () => {
    emit('delete');
 };
@ -463,6 +453,7 @@ const onPropsOk = (data: ActionsType, options?: any) => {
 const onPropsCancel = () => {
    actionType.value = '';
 };
+
 </script>

 <style lang="less" scoped>
@ -582,6 +573,19 @@ const onPropsCancel = () => {
        border-radius: 2px;
    }

+    .actions-item-filter-warp-tip {
+      position: absolute;
+      top: 0;
+      left: 16px;
+      z-index: 2;
+      color: rgba(0, 0, 0, 0.55);
+      font-weight: 800;
+      font-size: 14px;
+      line-height: 1;
+      background-color: #fff;
+      transform: translateY(-50%);
+    }
+
    .actions-item-filter-overflow {
        display: flex;
        padding-top: 4px;
@ -590,6 +594,13 @@ const onPropsCancel = () => {
        row-gap: 16px;
    }

+    .filter-add-button{
+      width: 100%;
+      color: rgba(0, 0, 0, 0.3);
+      text-align: center;
+      cursor: pointer;
+    }
+
    .terms-params {
        // display: inline-block;
        display: flex;
--- a/src/views/rule-engine/Scene/Save/action/ListItem/List.vue
+++ b/src/views/rule-engine/Scene/Save/action/ListItem/List.vue
@ -5,7 +5,7 @@
                :parallel="parallel"
                :data="item"
                :branchesName="branchesName"
-                :branchGroup="parallel ? 1 : 0"
+                :thenName="thenName"
                :name="index"
                :type="type"
                :isLast="index === actions.length - 1"
@ -25,7 +25,7 @@
            @cancel="onCancel"
            :parallel="parallel"
            :name="actions.length"
-            :branchGroup="parallel ? 1 : 0"
+            :branchGroup="thenName"
            @save="onSave"
            :branchesName="branchesName"
        />
@ -38,6 +38,11 @@ import { ActionsType, ParallelType } from '../../../typings';
 import Modal from '../Modal/index.vue';
 import Item from './Item.vue';
 import { pick } from 'lodash';
+import { useSceneStore } from '@/store/scene';
+import { storeToRefs } from 'pinia';
+
+const sceneStore = useSceneStore();
+const { data: _data } = storeToRefs(sceneStore);

 interface ListProps {
    branchesName: number;
@ -47,7 +52,10 @@ interface ListProps {
 }

 const props = defineProps({
-    branchesName: Number,
+    branchesName: {
+      type: Number,
+      default: 0
+    },
    type: {
        type: String as PropType<ListProps['type']>,
        default: 'serial',
@ -63,6 +71,10 @@ const emit = defineEmits(['delete', 'add']);

 const visible = ref<boolean>(false);

+const thenName = computed(() => {
+  return _data.value.branches![props.branchesName].then.findIndex(item => item.parallel === props.parallel)
+})
+
 const onAdd = () => {
    visible.value = true;
 };
--- a/src/views/rule-engine/Scene/Save/action/ListItem/util.ts
+++ b/src/views/rule-engine/Scene/Save/action/ListItem/util.ts
@ -0,0 +1,28 @@
+import { getImage } from '@/utils/comm'
+
+export const iconMap = new Map();
+iconMap.set('trigger', getImage('/scene/action-bind-icon.png'));
+iconMap.set('notify', getImage('/scene/action-notify-icon.png'));
+iconMap.set('device', getImage('/scene/action-device-icon.png'));
+iconMap.set('relieve', getImage('/scene/action-unbind-icon.png'));
+iconMap.set('delay', getImage('/scene/action-delay-icon.png'));
+
+export const itemNotifyIconMap = new Map();
+itemNotifyIconMap.set(
+  'dingTalk',
+  getImage('/scene/notify-item-img/dingtalk.png'),
+);
+itemNotifyIconMap.set('weixin', getImage('/scene/notify-item-img/weixin.png'));
+itemNotifyIconMap.set('email', getImage('/scene/notify-item-img/email.png'));
+itemNotifyIconMap.set('voice', getImage('/scene/notify-item-img/voice.png'));
+itemNotifyIconMap.set('sms', getImage('/scene/notify-item-img/sms.png'));
+itemNotifyIconMap.set(
+  'webhook',
+  getImage('/scene/notify-item-img/webhook.png'),
+);
+
+export const typeIconMap = {
+  READ_PROPERTY: 'icon-zhihangdongzuodu',
+  INVOKE_FUNCTION: 'icon-zhihangdongzuoxie-1',
+  WRITE_PROPERTY: 'icon-zhihangdongzuoxie',
+};
--- a/src/views/rule-engine/Scene/Save/action/index.vue
+++ b/src/views/rule-engine/Scene/Save/action/index.vue
@ -4,7 +4,7 @@
            <span>执行</span>
            <ShakeLimit
                v-if="props.openShakeLimit"
-                v-model:value="shakeLimit"
+                v-model:value="FormModel.branches[name].shakeLimit"
            />
        </div>
        <div class="actions-warp">
@ -21,7 +21,7 @@
                    <div class="actions-list">
                        <List
                            type="serial"
-                            :branchesName="props.name"
+                            :branchesName="name"
                            :parallel="false"
                            :actions="
                                serialArray.length ? serialArray[0].actions : []
@ -43,7 +43,7 @@
                    <div class="actions-list">
                        <List
                            type="parallel"
-                            :branchesName="props.name"
+                            :branchesName="name"
                            :parallel="true"
                            :actions="
                                parallelArray.length
@ -63,30 +63,32 @@
 <script lang="ts" setup>
 import ShakeLimit from '../components/ShakeLimit/index.vue';
 import { List } from './ListItem';
-import { BranchesThen } from '../../typings';
+import { BranchesThen } from '../../typings'
 import { PropType } from 'vue';
 import { randomString } from '@/utils/utils';
+import { storeToRefs } from 'pinia';
+import { useSceneStore } from 'store/scene'

-interface ActionsProps {
-    name: number;
-    openShakeLimit?: boolean;
-    thenOptions: BranchesThen[];
-}
+const sceneStore = useSceneStore()
+const { data: FormModel } = storeToRefs(sceneStore)

 const props = defineProps({
-    name: Number,
+    name: {
+      type: Number,
+      default: 0
+    },
    thenOptions: {
-        type: Array as PropType<ActionsProps['thenOptions']>,
+        type: Array as PropType<BranchesThen[]>,
        default: () => [],
    },
-    openShakeLimit: Boolean,
+    openShakeLimit: {
+      type: Boolean,
+      default: false
+    },
 });

 const emit = defineEmits(['update', 'add']);

-const shakeLimit = ref({
-    enabled: false,
-});
 const activeKeys = ref<string[]>(['1']);
 const parallelArray = ref<BranchesThen[]>([]);
 const serialArray = ref<BranchesThen[]>([]);
@ -110,8 +112,6 @@ watch(
            activeKeys.value = ['2'];
            lock.value = true;
        }
-
-        //TODO 回传数据
    },
    {
        deep: true,
@ -120,46 +120,31 @@ watch(
 );

 const onDelete = (_key: string, _parallel: boolean) => {
-    const newArray = _parallel ? [...parallelArray.value] : [...serialArray.value];
-    const aIndex = newArray[0].actions?.findIndex(
-        (aItem) => aItem.key === _key,
-    );
-    if (aIndex !== -1) {
-        if(_parallel){
-            parallelArray.value[0].actions?.splice(aIndex, 1);
-            emit('update', parallelArray.value[0], _parallel);
-        } else {
-            serialArray.value[0].actions?.splice(aIndex, 1);
-            emit('update', serialArray.value[0], _parallel);
-        }
-        
-    }
+  const thenName = props.thenOptions.findIndex(item => item.parallel === _parallel)
+  const actionIndex = FormModel.value.branches?.[props.name].then?.[thenName].actions.findIndex(item => item.key === _key)
+  if (actionIndex !== -1) {
+    FormModel.value.branches?.[props.name].then?.[thenName].actions.splice(actionIndex!, 1)
+  }
 };
+
 const onAdd = (actionItem: any, _parallel: boolean) => {
-    const newArray = _parallel ? [...parallelArray.value] : [...serialArray.value];
-    if (newArray.length) {
-        const indexOf = newArray[0].actions?.findIndex(
-            (aItem) => aItem.key === actionItem.key,
-        );
-        if (indexOf !== -1) {
-            newArray[0].actions.splice(indexOf, 1, actionItem);
-        } else {
-            newArray[0].actions.push(actionItem);
-        }
-        if(_parallel){
-            parallelArray.value = [...newArray];
-        } else {
-            serialArray.value = [...newArray];
-        }
-        emit('update', newArray[0], _parallel);
+  const thenName = props.thenOptions.findIndex(item => item.parallel === _parallel)
+  if (thenName !== -1) { // 编辑
+    const cacheAction =  props.thenOptions[thenName].actions
+    const indexOf = cacheAction?.findIndex(item => item.key === actionItem.key) || -1
+    if (indexOf !== -1) {
+      FormModel.value.branches?.[props.name].then?.[thenName].actions.splice(indexOf, 1, actionItem)
    } else {
-        actionItem.key = randomString();
-        emit('add', {
-            parallel: _parallel,
-            key: randomString(),
-            actions: [actionItem],
-        });
+      FormModel.value.branches?.[props.name].then?.[thenName].actions.push(actionItem)
    }
+  } else { // 新增
+    const newThenItem = {
+      parallel: _parallel,
+      key: randomString(),
+      actions: [actionItem]
+    }
+    FormModel.value.branches?.[props.name].then.push(newThenItem)
+  }
 };
 </script>

--- a/src/views/rule-engine/Scene/Save/components/DropdownButton/DropdownButton.vue
+++ b/src/views/rule-engine/Scene/Save/components/DropdownButton/DropdownButton.vue
@ -15,18 +15,18 @@
    </div>
    <template #overlay>
      <div class='scene-select-content'>
-        <template v-if='options.length'>
+        <DropdownTimePicker
+          v-if='["date","time"].includes(component)'
+          :type='component'
+          @change='timeSelect'
+        />
+        <template v-else-if='options.length'>
          <drop-menus
            v-if='component === "select"'
            :value='selectValue'
            :options='options'
            @click='menuSelect'
          />
-          <DropdownTimePicker
-            v-else-if='["date","time"].includes(component)'
-            :type='component'
-            @change='timeSelect'
-          />
          <div style='min-width: 400px' v-else>
            <j-tree
              :selectedKeys='selectValue ? [selectValue] : []'
--- a/src/views/rule-engine/Scene/Save/components/ParamsDropdown/Double.vue
+++ b/src/views/rule-engine/Scene/Save/components/ParamsDropdown/Double.vue
@ -6,6 +6,7 @@
    :icon='icon'
    :placeholder='placeholder'
    :tabs-options='tabsOptions'
+    :metricOptions='metricOptions'
    @select='onSelect'
  />
  <ParamsDropdown
@ -14,6 +15,7 @@
    :icon='icon'
    :placeholder='placeholder'
    :tabs-options='tabsOptions'
+    :metricOptions='metricOptions'
    :options='options'
    @select='onSelect'
  />
--- a/src/views/rule-engine/Scene/Save/components/ParamsDropdown/index.vue
+++ b/src/views/rule-engine/Scene/Save/components/ParamsDropdown/index.vue
@ -27,35 +27,45 @@
                v-model:value='myValue'
                @change='timeChange'
              />
-              <DropdownMenus
+              <template
                v-else-if='["select","enum", "boolean"].includes(item.component)'
-                :options='["metric", "upper"].includes(item.key) ?  metricOption : options'
-                @click='onSelect'
-              />
-              <div
-                v-else-if='item.component === "tree"'
-                style='min-width: 400px'
              >
-                <j-tree
-                  :selectedKeys='myValue ? [myValue] : []'
-                  :treeData='item.key === "upper" ?  metricOption : options'
-                  @select='treeSelect'
-                  :height='450'
-                  :virtual='true'
-                >
-                  <template #title="{ name, description }">
-                    <j-space>
-                      {{ name }}
-                      <span v-if='description' class='tree-title-description'>{{ description }}</span>
-                    </j-space>
-                  </template>
-                </j-tree>
-              </div>
+                <DropdownMenus
+                  v-if='(["metric", "upper"].includes(item.key) ?  metricOptions : options).length'
+                  :options='["metric", "upper"].includes(item.key) ?  metricOptions : options'
+                  @click='onSelect'
+                />
+                <div class='scene-select-empty' v-else>
+                  <j-empty />
+                </div>
+              </template>
+              <template v-else-if='item.component === "tree"'>
+                <div style='min-width: 400px' v-if='(item.key === "upper" ?  metricOptions : options).length'>
+                  <j-tree
+                    :selectedKeys='myValue ? [myValue] : []'
+                    :treeData='item.key === "upper" ?  metricOptions : options'
+                    @select='treeSelect'
+                    :height='450'
+                    :virtual='true'
+                  >
+                    <template #title="{ name, description }">
+                      <j-space>
+                        {{ name }}
+                        <span v-if='description' class='tree-title-description'>{{ description }}</span>
+                      </j-space>
+                    </template>
+                  </j-tree>
+                </div>
+                <div class='scene-select-empty' v-else>
+                  <j-empty />
+                </div>
+              </template>
+
              <ValueItem
                v-else
                v-model:modelValue='myValue'
                :itemType='item.component'
-                :options='item.key === "upper" ?  metricOption : options'
+                :options='item.key === "upper" ?  metricOptions : options'
                @change='valueItemChange'
              />
            </div>
@ -73,8 +83,6 @@ import { defaultSetting } from './typings'
 import { DropdownMenus, DropdownTimePicker} from '../DropdownButton'
 import { getComponent, getOption } from '../DropdownButton/util'

-const valueItemKey = ['int', 'int','long','float','double','string', 'password']
-
 type Emit = {
  (e: 'update:value', data: ValueType): void
  (e: 'update:source', data: string): void
--- a/src/views/rule-engine/Scene/Save/components/ParamsDropdown/typings.ts
+++ b/src/views/rule-engine/Scene/Save/components/ParamsDropdown/typings.ts
@ -46,10 +46,6 @@ export const defaultSetting = {
    type: Array as PropType<Array<DropdownButtonOptions>>,
    default: () => []
  },
-  metricOption: {
-    type: Array as PropType<Array<DropdownButtonOptions>>,
-    default: () => []
-  },
  metricOptions: { // 指标值
    type: Array as PropType<Array<DropdownButtonOptions>>,
    default: () => []
--- a/src/views/rule-engine/Scene/Save/components/ShakeLimit/index.vue
+++ b/src/views/rule-engine/Scene/Save/components/ShakeLimit/index.vue
@ -7,9 +7,9 @@
            style="margin-right: 12px"
        />
        <template v-if="shakeLimit.enabled">
-            <j-input-number :min="1" :max="100" :precision="0" size="small" v-model:value="shakeLimit.time" style="width: 32px" />
+            <j-input-number :min="1" :max="100" :precision="0" size="small" v-model:value="shakeLimit.time" style="width: 38px" />
            <span>秒内发送</span>
-            <j-input-number :min="1" :max="100" :precision="0" size="small" v-model:value="shakeLimit.threshold" style="width: 32px" />
+            <j-input-number :min="1" :max="100" :precision="0" size="small" v-model:value="shakeLimit.threshold" style="width: 38px" />
            <span>次及以上时，处理</span>
            <j-radio-group :options="alarmFirstOptions" optionType="button" v-model:value="shakeLimit.alarmFirst" size="small" />
        </template>
@ -55,8 +55,7 @@ const shakeLimit = reactive<ShakeLimitType>({
 Object.assign(shakeLimit, props.value)

 watch(() => shakeLimit, () => {
-    const cloneValue = cloneDeep(shakeLimit)
-    emit('update:value', cloneValue)
+    emit('update:value', {...shakeLimit})
 }, {
    deep: true
 })
--- a/src/views/rule-engine/Scene/Save/components/Terms/Branchs.vue
+++ b/src/views/rule-engine/Scene/Save/components/Terms/Branchs.vue
@ -49,9 +49,17 @@
        </div>
      </div>
      <div class='actions-branches'>
-        <j-form-item></j-form-item>
+        <j-form-item
+          :name='["branches", name, "then"]'
+          :rules='rules'
+        >
+          <Action
+            :name='name'
+            :openShakeLimit="true"
+            :thenOptions='FormModel.branches[name].then'
+          />
+        </j-form-item>
      </div>
-
    </div>
  </div>
 </template>
@ -62,6 +70,7 @@ import type { ActionBranchesProps } from '@/views/rule-engine/Scene/typings'
 import TermsItem from './TermsItem.vue'
 import { storeToRefs } from 'pinia';
 import { useSceneStore } from 'store/scene'
+import Action from '../../action/index.vue'

 const sceneStore = useSceneStore()
 const { data: FormModel } = storeToRefs(sceneStore)
@ -149,6 +158,18 @@ const optionsClass = computed(() => {
  }
 })

+const rules = [{
+  validator(_: string, value: any) {
+    if (!value || (value && !value.length)) {
+      return Promise.reject('至少配置一个执行动作')
+    } else {
+      const isActions = value.some((item: any) => item.actions && item.actions.length)
+      return isActions ? Promise.resolve() : Promise.reject('至少配置一个执行动作');
+    }
+    return Promise.resolve();
+  }
+}]
+
 </script>

 <style scoped lang='less'>
--- a/src/views/rule-engine/Scene/Save/components/Terms/ParamsItem.vue
+++ b/src/views/rule-engine/Scene/Save/components/Terms/ParamsItem.vue
@ -40,7 +40,7 @@
        icon='icon-canshu'
        placeholder='参数值'
        :options='valueOptions'
-        :metricOption='metricOption'
+        :metricOptions='metricOption'
        :tabsOptions='tabsOptions'
        v-model:value='paramsValue.value.value'
        v-model:source='paramsValue.value.source'
@ -50,7 +50,7 @@
        icon='icon-canshu'
        placeholder='参数值'
        :options='valueOptions'
-        :metricOption='metricOption'
+        :metricOptions='metricOption'
        :tabsOptions='tabsOptions'
        v-model:value='paramsValue.value.value'
        v-model:source='paramsValue.value.source'
--- a/src/views/rule-engine/Scene/Save/components/Terms/Terms.vue
+++ b/src/views/rule-engine/Scene/Save/components/Terms/Terms.vue
@ -32,13 +32,13 @@
        </div>
      </template>
    </template>
-    <j-form-item
-      v-else
-      :name='["branches", 0, "then"]'
-      :rules='rules'
-    >
-
-    </j-form-item>
+<!--    <j-form-item-->
+<!--      v-else-->
+<!--      :name='["branches", 0, "then"]'-->
+<!--      :rules='rules'-->
+<!--    >-->
+<!--      -->
+<!--    </j-form-item>-->
  </div>
 </template>

@ -65,18 +65,6 @@ const change = (e: boolean) => {
  open.value = e
 }

-const rules = [{
-  validator(_: string, value: any) {
-    if (!value || (value && !value.length)) {
-      return Promise.reject('至少配置一个执行动作')
-    } else {
-      const isActions = value.some((item: any) => item.actions && item.actions.length)
-      return isActions ? Promise.resolve() : Promise.reject('至少配置一个执行动作');
-    }
-    return Promise.resolve();
-  }
-}]
-
 const handleParamsData = (data: any[]): any[] => {
  return data?.map(item => {
    return {