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

src/api/account/notificationRecord.ts

@@ -1,7 +1,7 @@
 import server from '@/utils/request'
 
 // 获取记录列表
-export const getList_api = (data:object): any =>server.get(`/notifications/_query`,encodeParams(data))
+export const getList_api = (data:object): any =>server.post(`/notifications/_query`,data)
 // 修改记录状态
 export const changeStatus_api = (type:'_read'|'_unread',data:string[]): any =>server.post(`/notifications/${type}`,data)
 

src/api/media/channel.ts

@@ -16,6 +16,9 @@ export default {
     // 删除
     del: (id: string) => server.remove(`/media/channel/${id}`),
 
+    // 查询树形数据
+    queryTree: (id: string, data?: any) => server.post(`/media/device/${id}/catalog/_query/tree`, data),
+
     // ========== 视频播放 ==========
     // 开始直播
     ptzStart: (deviceId: string, channelId: string, type: string) =>

src/components/AIcon/index.tsx

@@ -77,6 +77,7 @@ const iconKeys = [
     'CloudDownloadOutlined',
     'PauseCircleOutlined',,
     'FormOutlined',
+    'EyeInvisibleOutlined',
 ]
 
 const Icon = (props: {type: string}) => {

src/components/FRuleEditor/Debug/index.vue

@@ -15,7 +15,7 @@
       <a-table :columns="columns" :data-source="property" :pagination="false" bordered size="small">
         <template #bodyCell="{ column, record, index }">
           <template v-if="column.key === 'id'">
-            <a-input v-model:value="record.id" size="small"></a-input>
+            <j-auto-complete :options="options" v-model:value="record.id" size="small" width="130px"/>
           </template>
           <template v-if="column.key === 'current'">
             <a-input v-model:value="record.current" size="small"></a-input>
@@ -58,8 +58,8 @@
       </div>
       <div class="log">
         <a-descriptions>
-          <a-descriptions-item v-for="item in ruleEditorStore.state.log" :label="moment(item.time).format('HH:mm:ss')" :key="item.time"
+          <a-descriptions-item v-for="item in ruleEditorStore.state.log" :label="moment(item.time).format('HH:mm:ss')"
-            :span="3">
+            :key="item.time" :span="3">
             <a-tooltip placement="top" :title="item.content">
               {{ item.content }}
             </a-tooltip>
@@ -78,6 +78,7 @@ import { message } from 'ant-design-vue';
 import { useRuleEditorStore } from '@/store/ruleEditor';
 import moment from 'moment';
 import { getWebSocket } from '@/utils/websocket';
+import { PropertyMetadata } from '@/views/device/Product/typings';
 
 
 const props = defineProps({
@@ -135,25 +136,25 @@ const runScript = () => {
   });
 
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
   if (!props.virtualRule?.script) {
     isBeginning.value = true;
     message.warning('请编辑规则');
     return;
   }
-  ws.value = getWebSocket(`virtual-property-debug-${ruleEditorStore.state.property}-${new Date().getTime()}`,
+  ws.value = getWebSocket(`virtual-property-debug-${props.id}-${new Date().getTime()}`,
-  '/virtual-property-debug',
+    '/virtual-property-debug',
-  {
+    {
-    virtualId: `${virtualIdRef.value}-virtual-id`,
+      virtualId: `${virtualIdRef.value}-virtual-id`,
-    property: ruleEditorStore.state.property,
+      property: props.id,
-    virtualRule: {
+      virtualRule: {
-      ...props.virtualRule,
+        ...props.virtualRule,
-    },
+      },
-    properties: _properties || [],
+      properties: _properties || [],
-  })
+    })
   ws.value.subscribe((data: any) => {
-      ruleEditorStore.state.log.push({ time: new Date().getTime(), content: JSON.stringify(data.payload) });
+    ruleEditorStore.state.log.push({ time: new Date().getTime(), content: JSON.stringify(data.payload) });
   })
 }
 const beginAction = () => {
@@ -163,7 +164,7 @@ const beginAction = () => {
 const stopAction = () => {
   isBeginning.value = true;
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
 }
 const clearAction = () => {
@@ -172,9 +173,21 @@ const clearAction = () => {
 
 onUnmounted(() => {
   if (ws.value) {
-    ws.value.unsubscribe();
+    ws.value.unsubscribe?.();
   }
 })
+
+const options = ref<{ label: string, value: string }[]>()
+const getProperty = () => {
+  const metadata = productStore.current.metadata || '{}';
+  const _p: PropertyMetadata[] = JSON.parse(metadata).properties || [];
+  options.value = _p.filter((p) => p.id !== props.id).map((item) => ({
+    label: item.name,
+    value: item.id,
+  }));
+  console.log(options.value)
+}
+getProperty()
 </script>
 <style lang="less" scoped>
 .debug-container {

src/components/FRuleEditor/index.vue

@@ -1,6 +1,5 @@
 <template>
   <Editor key="simple" @change="change" v-model:value="_value" :id="id" />
-  {{ _value }}
   <Advance v-if="ruleEditorStore.state.model === 'advance'" v-model:value="_value" :model="ruleEditorStore.state.model"
     :virtualRule="virtualRule" :id="id" @change="change" />
 </template>

src/components/Layout/components/Notice.vue

@@ -26,7 +26,7 @@ import { notification } from 'ant-design-vue';
 import { changeStatus_api } from '@/api/account/notificationRecord';
 import { useUserInfo } from '@/store/userInfo';
 
-const updateCount = computed(()=>useUserInfo().$state.alarmUpdateCount);
+const updateCount = computed(() => useUserInfo().$state.alarmUpdateCount);
 
 const total = ref(0);
 const list = ref<any[]>([]);
@@ -50,10 +50,20 @@ const subscribeNotice = () => {
 const getList = () => {
     loading.value = true;
     const params = {
-        'terms[0].column': 'state',
-        'terms[0].value': 'unread',
         'sorts[0].name': 'notifyTime',
         'sorts[0].order': 'desc',
+        terms: [
+            {
+                terms: [
+                    {
+                        type: 'or',
+                        value: 'unread',
+                        termType: 'eq',
+                        column: 'state',
+                    },
+                ],
+            },
+        ],
     };
     getList_api(params)
         .then((resp: any) => {

src/components/Metadata/VirtualRuleParam/index.vue

@@ -1,6 +1,6 @@
 <template>
   <j-form-item :name="name.concat(['script'])">
-    <f-rule-editor v-model:value="value.script" :id="id"></f-rule-editor>
+    <f-rule-editor v-model:value="value.script" :id="id" :virtualRule="value"></f-rule-editor>
   </j-form-item>
   <template v-if="showWindow">
     <j-form-item label="规则配置" :name="name.concat(['isVirtualRule'])">

src/views/account/Center/components/EditInfoDialog.vue

@@ -5,6 +5,7 @@
         @ok="handleOk"
         width="770px"
         @cancel="emits('update:visible', false)"
+        :confirmLoading="loading"
     >
         <j-form :model="form" layout="vertical" ref="formRef">
             <j-row :gutter="24">
@@ -12,7 +13,10 @@
                     <j-form-item
                         label="姓名"
                         name="name"
-                        :rules="[{ required: true, message: '姓名必填' }]"
+                        :rules="[
+                            { required: true, message: '姓名必填' },
+                            { max: 64, message: '最多可输入64个字符' },
+                        ]"
                     >
                         <j-input
                             v-model:value="form.name"
@@ -56,7 +60,16 @@
             </j-row>
             <j-row :gutter="24">
                 <j-col :span="12">
-                    <j-form-item label="手机号">
+                    <j-form-item
+                        label="手机号"
+                        name="telephone"
+                        :rules="[
+                            {
+                                pattern: /^1[3456789]\d{9}$/,
+                                message: '请输入正确手机号',
+                            },
+                        ]"
+                    >
                         <j-input
                             v-model:value="form.telephone"
                             placeholder="请输入手机号"
@@ -64,7 +77,11 @@
                     </j-form-item>
                 </j-col>
                 <j-col :span="12">
-                    <j-form-item label="邮箱">
+                    <j-form-item
+                        label="邮箱"
+                        name="email"
+                        :rules="[{ type: 'email',message:'邮箱不是一个有效的email' }]"
+                    >
                         <j-input
                             v-model:value="form.email"
                             placeholder="请输入邮箱"
@@ -87,17 +104,19 @@ const props = defineProps<{
     visible: boolean;
     data: userInfoType;
 }>();
+const loading = ref(false)
 const form = ref(props.data);
 const formRef = ref<FormInstance>();
 const handleOk = () => {
     formRef.value?.validate().then(() => {
+        loading.value = true
         updateMeInfo_api(form.value).then((resp) => {
             if (resp.status === 200) {
                 message.success('保存成功');
                 emits('ok');
                 emits('update:visible', false);
             }
-        });
+        }).finally(()=>loading.value = false)
     });
 };
 </script>

src/views/account/Center/components/EditPasswordDialog.vue

@@ -4,6 +4,7 @@
         title="重置密码"
         @ok="handleOk"
         width="520px"
+        :confirmLoading="loading"
         @cancel="emits('update:visible', false)"
     >
         <j-form :model="form" layout="vertical" ref="formRef">
@@ -11,7 +12,7 @@
                 label="旧密码"
                 name="oldPassword"
                 :rules="[
-                    { required: true },
+                    { required: true, message: '请输入密码' },
                     { validator: checkMothods.old, trigger: 'blur' },
                 ]"
             >
@@ -24,7 +25,7 @@
                 label="密码"
                 name="newPassword"
                 :rules="[
-                    { required: true },
+                    { required: true,message:'请输入密码' },
                     { validator: checkMothods.new, trigger: 'blur' },
                 ]"
             >
@@ -37,7 +38,7 @@
                 label="确认密码"
                 name="confirmPassword"
                 :rules="[
-                    { required: true },
+                    { required: true, message: '请输入确认密码' },
                     { validator: checkMothods.confirm, trigger: 'blur' },
                 ]"
             >
@@ -63,6 +64,7 @@ const emits = defineEmits(['ok', 'update:visible']);
 const props = defineProps<{
     visible: boolean;
 }>();
+const loading = ref(false)
 const formRef = ref<FormInstance>();
 const form = ref<formType>({
     oldPassword: '',
@@ -72,7 +74,7 @@ const form = ref<formType>({
 
 const checkMothods = {
     old: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入密码');
+        if (!value) return Promise.reject();
         try {
             const resp: any = await checkOldPassword_api(value);
             if (resp.status === 200 && !resp.result.passed)
@@ -83,7 +85,7 @@ const checkMothods = {
         }
     },
     new: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入密码');
+        if (!value) return Promise.reject();
         else if (
             form.value.confirmPassword &&
             value !== form.value.confirmPassword
@@ -99,7 +101,7 @@ const checkMothods = {
         }
     },
     confirm: async (_rule: Rule, value: string) => {
-        if (!value) return Promise.reject('请输入确认密码');
+        if (!value) return Promise.reject();
 
         try {
             const resp: any = await validateField_api('password', value);
@@ -114,6 +116,7 @@ const checkMothods = {
 
 const handleOk = () => {
     formRef.value?.validate().then(() => {
+        loading.value = true
         const params = {
             oldPassword: form.value.oldPassword,
             newPassword: form.value.newPassword,
@@ -124,7 +127,7 @@ const handleOk = () => {
                 emits('ok');
                 emits('update:visible', false);
             }
-        });
+        }).finally(()=>loading.value = false)
     });
 };
 console.clear();

src/views/account/Center/index.vue

@@ -8,10 +8,15 @@
                         style="width: 350px; justify-content: center"
                     >
                         <img
+                            v-if="userInfo.avatar"
                             :src="userInfo.avatar"
                             style="width: 140px; border-radius: 70px"
                             alt=""
                         />
+                        <div class="default-avatar" v-else>
+                            <AIcon type="UserOutlined" />
+                        </div>
+
                         <div
                             style="
                                 width: 100%;
@@ -29,6 +34,7 @@
                                 }"
                                 :action="`${BASE_API_PATH}/file/static`"
                                 @change="upload.changeBackUpload"
+                                :beforeUpload="upload.beforeUpload"
                             >
                                 <j-button>
                                     <AIcon type="UploadOutlined" />
@@ -51,11 +57,17 @@
                         </div>
                         <div class="info-card">
                             <p>注册时间</p>
-                            <p>{{ moment(userInfo.createTime).format('YYYY-MM-DD HH:mm:ss') }}</p>
+                            <p>
+                                {{
+                                    moment(userInfo.createTime).format(
+                                        'YYYY-MM-DD HH:mm:ss',
+                                    )
+                                }}
+                            </p>
                         </div>
                         <div class="info-card">
                             <p>电话</p>
-                            <p>{{ userInfo.telephone }}</p>
+                            <p>{{ userInfo.telephone || '-' }}</p>
                         </div>
                         <div class="info-card">
                             <p>姓名</p>
@@ -117,7 +129,7 @@
                             type="link"
                             @click="editPasswordVisible = true"
                         >
-                            <AIcon type="EditOutlined" style="color: #1d39c4;" />
+                            <AIcon type="EditOutlined" style="color: #1d39c4" />
                         </PermissionButton>
                     </span>
                 </div>
@@ -205,7 +217,7 @@
             <EditInfoDialog
                 v-if="editInfoVisible"
                 v-model:visible="editInfoVisible"
-                :data="{...userInfo}"
+                :data="{ ...userInfo }"
                 @ok="getUserInfo"
             />
             <EditPasswordDialog
@@ -277,6 +289,15 @@ const upload = reactive({
             message.error('logo上传失败，请稍后再试');
         }
     },
+    beforeUpload: ({ size, type }: File) => {
+        const imageTypes = ['jpg', 'png', 'jfif', 'pjp', 'pjpeg', 'jpeg'];
+        const typeBool =
+            imageTypes.filter((typeStr) => type.includes(typeStr)).length > 0;
+        const sizeBool = size < 4 * 1024 * 1024;
+
+        (typeBool && sizeBool) || message.error('请上传正确格式的图片');
+        return typeBool && sizeBool;
+    },
 });
 // 首页视图
 const isApiUser = ref<boolean>();
@@ -346,7 +367,7 @@ function getViews() {
     background-color: #f0f2f5;
     min-height: 100vh;
     .card {
-        margin: 24px;
+        margin: 16px 0;
         padding: 24px;
         background-color: #fff;
         position: relative;
@@ -370,6 +391,18 @@ function getViews() {
             flex-wrap: wrap;
             .content-item {
                 margin-right: 24px;
+
+                .default-avatar {
+                    background-color: #ccc;
+                    color: #fff;
+                    border-radius: 50%;
+                    font-size: 70px;
+                    width: 140px;
+                    height: 140px;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                }
                 .info-card {
                     width: 25%;
 

src/views/account/NotificationRecord/index.vue

@@ -1,14 +1,17 @@
 <template>
     <page-container>
         <div class="notification-record-container">
-            <Search :columns="columns" @search="query.search" />
+            <j-advanced-search
+                :columns="columns"
+                @search="(params:any)=>queryParams = {...params}"
+            />
 
             <j-pro-table
                 ref="tableRef"
                 :columns="columns"
                 :request="getList_api"
                 model="TABLE"
-                :params="query.params.value"
+                :params="queryParams"
                 :defaultParams="{
                     'sorts[0].name': 'notifyTime',
                     'sorts[0].order': 'desc',
@@ -52,8 +55,8 @@
                                         ? '标为未读'
                                         : '标为已读',
                             }"
-                        >1
+                            >
-                            <AIcon type="ReadIconOutlined" />
+                            <AIcon type="icon-a-PIZHU1" />
                         </PermissionButton>
                         <PermissionButton
                             type="link"
@@ -158,15 +161,10 @@ const columns = [
         key: 'action',
         ellipsis: true,
         scopedSlots: true,
-        width:'200px'
+        width: '200px',
     },
 ];
-const query = {
+const queryParams = ref({});
-    params: ref({}),
-    search: (params: object) => {
-        query.params.value = { ...params };
-    },
-};
 
 const tableRef = ref();
 const table = {

src/views/account/NotificationSubscription/components/EditDialog.vue

@@ -3,6 +3,7 @@
         visible
         :title="props.data.id ? '编辑' : '新增'"
         width="865px"
+        :confirmLoading="loading"
         @ok="confirm"
         @cancel="emits('update:visible', false)"
     >
@@ -92,6 +93,7 @@ const props = defineProps<{
     data: rowType;
 }>();
 
+const loading = ref(false);
 const initForm = {
     subscribeName: '',
     topicConfig: {},
@@ -106,13 +108,16 @@ const form = ref({
 const confirm = () => {
     formRef.value &&
         formRef.value.validate().then(() => {
-            save_api(form.value).then((resp) => {
+            loading.value = true;
-                if (resp.status === 200) {
+            save_api(form.value)
-                    message.success('操作成功');
+                .then((resp) => {
-                    emits('ok')
+                    if (resp.status === 200) {
-                    emits('update:visible', false);
+                        message.success('操作成功');
-                }
+                        emits('ok');
-            });
+                        emits('update:visible', false);
+                    }
+                })
+                .finally(() => (loading.value = false));
         });
 };
 

src/views/account/NotificationSubscription/index.vue

@@ -1,13 +1,16 @@
 <template>
     <page-container>
         <div class="notification-subscription-container">
-            <Search :columns="columns" @search="query.search" />
+            <j-advanced-search
+                :columns="columns"
+                @search="(params:any)=>queryParams = {...params}"
+            />
             <j-pro-table
                 ref="tableRef"
                 :columns="columns"
                 :request="getNoticeList_api"
                 model="TABLE"
-                :params="query.params.value"
+                :params="queryParams"
                 :defaultParams="{
                     sorts: [{ name: 'notifyTime', order: 'desc' }],
                 }"
@@ -105,7 +108,7 @@ import EditDialog from './components/EditDialog.vue';
 import {
     getNoticeList_api,
     changeStatus_api,
-    remove_api
+    remove_api,
 } from '@/api/account/notificationSubscription';
 import { rowType } from './typing';
 import { message } from 'ant-design-vue';
@@ -147,19 +150,14 @@ const columns = [
         key: 'action',
         ellipsis: true,
         scopedSlots: true,
-        width: '200px'
+        width: '200px',
     },
 ];
-const query = {
+const queryParams = ref({});
-    params: ref({}),
-    search: (params: object) => {
-        query.params.value = {...params};
-    },
-};
 const dialogVisible = ref<boolean>(false);
 const tableRef = ref();
 const table = {
-    seletctRow: ref<rowType>(),
+    seletctRow: ref<any>({}),
     edit: (row?: rowType) => {
         table.seletctRow = {
             ...(row || ({} as any)),
@@ -176,12 +174,12 @@ const table = {
         });
     },
     delete: (row: rowType) => {
-        remove_api(row.id as string).then(resp=>{
+        remove_api(row.id as string).then((resp) => {
-            if(resp.status === 200) {
+            if (resp.status === 200) {
-                message.success('操作成功！')
+                message.success('操作成功！');
-                table.refresh()
+                table.refresh();
-            }else message.warning('操作失败！')
+            } else message.warning('操作失败！');
-        })
+        });
     },
     refresh: () => {
         tableRef.value && tableRef.value.reload();

src/views/device/components/Metadata/Base/Edit/ExpandsForm.vue

@@ -86,7 +86,7 @@ const metadataStore = useMetadataStore()
 
 onMounted(() => {
   if (props.type === 'product' || !props.value?.source) {
-    emit('update:value', { ...props.value, source: 'device' })
+    emit('update:value', { source: 'device', ...props.value })
   }
 })
 

src/views/device/components/Metadata/Base/index.vue

@@ -1,9 +1,9 @@
 <template>
-  <j-pro-table :loading="loading" :data-source="data" size="small" :columns="columns" row-key="id" model="TABLE">
+  <div class="table-header">
-    <template #headerTitle>
+    <div>
       <j-input-search v-model:value="searchValue" placeholder="请输入名称" @search="handleSearch"></j-input-search>
-    </template>
+    </div>
-    <template #rightExtraRender>
+    <div>
       <PermissionButton type="primary" :uhas-permission="`${permission}:update`" key="add" @click="handleAddClick"
         :disabled="operateLimits('add', type)" :tooltip="{
           title: operateLimits('add', type) ? '当前的存储方式不支持新增' : '新增',
@@ -14,45 +14,52 @@
         新增
       </PermissionButton>
       <Edit v-if="metadataStore.model.edit" :type="target" :tabs="type" @refresh="refreshMetadata"></Edit>
+    </div>
+  </div>
+  <a-table :loading="loading" :data-source="data" :columns="columns" row-key="id" model="TABLE" size="small"
+    :pagination="pagination">
+    <template #bodyCell="{ column, record }">
+      <template v-if="column.dataIndex === 'level'">
+        {{ levelMap[record.expands?.level] || '-' }}
+      </template>
+      <template v-if="column.dataIndex === 'async'">
+        {{ record.async ? '是' : '否' }}
+      </template>
+      <template v-if="column.dataIndex === 'valueType'">
+        {{ record.valueType?.type }}
+      </template>
+      <template v-if="column.dataIndex === 'source'">
+        {{ sourceMap[record.expands?.source] }}
+      </template>
+      <template v-if="column.dataIndex === 'type'">
+        <j-tag v-for="item in (record.expands?.type || [])" :key="item">
+          {{ expandsType[item] }}
+        </j-tag>
+      </template>
+      <template v-if="column.dataIndex === 'action'">
+        <j-space>
+          <PermissionButton :uhas-permission="`${permission}:update`" type="link" key="edit" style="padding: 0"
+            :udisabled="operateLimits('updata', type)" @click="handleEditClick(record)" :tooltip="{
+              title: operateLimits('updata', type) ? '当前的存储方式不支持编辑' : '编辑',
+            }">
+            <AIcon type="EditOutlined" />
+          </PermissionButton>
+          <PermissionButton :uhas-permission="`${permission}:delete`" type="link" key="delete" style="padding: 0"
+            :pop-confirm="{
+              title: '确认删除？', onConfirm: async () => {
+                await removeItem(record);
+              },
+            }"
+            :tooltip="{
+              title: '删除',
+            }"
+          >
+            <AIcon type="DeleteOutlined" />
+          </PermissionButton>
+        </j-space>
+      </template>
     </template>
-    <template #level="slotProps">
+  </a-table>
-      {{ levelMap[slotProps.expands?.level] || '-' }}
-    </template>
-    <template #async="slotProps">
-      {{ slotProps.async ? '是' : '否' }}
-    </template>
-    <template #valueType="slotProps">
-      {{ slotProps.valueType?.type }}
-    </template>
-    <template #source="slotProps">
-      {{ sourceMap[slotProps.expands?.source] }}
-    </template>
-    <template #type="slotProps">
-      <j-tag v-for="item in (slotProps.expands?.type || [])" :key="item">
-        {{ expandsType[item] }}
-      </j-tag>
-    </template>
-    <template #action="slotProps">
-      <j-space>
-        <PermissionButton :uhas-permission="`${permission}:update`" type="link" key="edit" style="padding: 0"
-          :udisabled="operateLimits('updata', type)" @click="handleEditClick(slotProps)" :tooltip="{
-            title: operateLimits('updata', type) ? '当前的存储方式不支持编辑' : '编辑',
-          }">
-          <AIcon type="EditOutlined" />
-        </PermissionButton>
-        <PermissionButton :uhas-permission="`${permission}:delete`" type="link" key="delete" style="padding: 0"
-          :pop-confirm="{
-            title: '确认删除？', onConfirm: async () => {
-              await removeItem(slotProps);
-            },
-          }" :tooltip="{
-            title: '删除',
-          }">
-          <Aicon type="DeleteOutlined" />
-        </PermissionButton>
-      </j-space>
-    </template>
-  </j-pro-table>
 </template>
 <script setup lang="ts" name="BaseMetadata">
 import type { MetadataItem, MetadataType } from '@/views/device/Product/typings'
@@ -61,7 +68,7 @@ import { useInstanceStore } from '@/store/instance'
 import { useProductStore } from '@/store/product'
 import { useMetadataStore } from '@/store/metadata'
 import PermissionButton from '@/components/PermissionButton/index.vue'
-import { message } from 'ant-design-vue/es'
+import { TablePaginationConfig, message } from 'ant-design-vue/es'
 import { SystemConst } from '@/utils/consts'
 import { Store } from 'jetlinks-store'
 import { asyncUpdateMetadata, removeMetadata } from '../metadata'
@@ -106,6 +113,15 @@ const actions = [
     scopedSlots: true,
   },
 ];
+const pagination = {
+  showTotal: (num: number, range: number[]) => {
+    return `第 ${range[0]} - ${range[1]} 条/总共 ${num} 条`;
+  },
+  showSizeChanger: true,
+  showQuickJumper: false,
+  defaultPageSize: 10,
+  size: 'small',
+} as TablePaginationConfig
 const columns = computed(() => MetadataMapping.get(type)!.concat(actions))
 const items = computed(() => JSON.parse((target === 'product' ? productStore.current?.metadata : instanceStore.current.metadata) || '{}') as MetadataItem[])
 const searchValue = ref<string>()
@@ -196,4 +212,10 @@ const removeItem = async (record: MetadataItem) => {
   }
 };
 </script>
-<style scoped lang="less"></style>
+<style scoped lang="less">
+.table-header {
+  display: flex;
+  justify-content: space-between;
+  padding: 16px 0;
+}
+</style>

src/views/home/components/BootCardSmall.vue

@@ -28,34 +28,19 @@
 
 <script setup lang="ts">
 import { message } from 'ant-design-vue';
-import { bootConfig } from "../typing";
+import { bootConfig } from '../typing';
+import { useMenuStore } from '@/store/menu';
 
-const router = useRouter();
 const props = defineProps({
     cardData: Array<bootConfig>,
     cardTitle: String,
 });
 const { cardData, cardTitle } = toRefs(props);
+const { jumpPage: _jumpPage } = useMenuStore();
 
-const jumpPage = (row: bootConfig): void => {
+const jumpPage = (item: bootConfig) => {
-    if (row.auth && row.link) {
+    if (item.auth === undefined || item.auth) _jumpPage(item.link, item.params);
-        router.push(`${row.link}${objToParams(row.params || {})}`);
+    else message.warning('暂无权限，请联系管理员');
-    } else {
-        message.warning('暂无权限，请联系管理员');
-    }
-};
-
-const objToParams = (source: object): string => {
-    if (Object.prototype.toString.call(source) === '[object Object]') {
-        const paramsArr = <any>[];
-        // 直接使用for in遍历对象ts会报错
-        Object.entries(source).forEach(([prop, value]) => {
-            if (typeof value === 'object') value = JSON.stringify(value);
-            paramsArr.push(`${prop}=${value}`);
-        });
-        if (paramsArr.length > 0) return '?' + paramsArr.join('&');
-    }
-    return '';
 };
 </script>
 

src/views/home/components/ComprehensiveHome/index.vue

@@ -36,7 +36,7 @@
             <ProductChooseDialog
                 v-if="productDialogVisible"
                 v-model:visible="productDialogVisible"
-                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id })"
+                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id, tab: 'Device'})"
             />
             <DeviceChooseDialog
                 v-if="deviceDialogVisible"
@@ -80,7 +80,7 @@ const deviceBootConfig: bootConfig[] = [
         auth: productPermission('add'),
         image: '/images/home/guide-home1.png',
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -100,7 +100,7 @@ const deviceBootConfig: bootConfig[] = [
         auth: rulePermission('add'),
         image: '/images/home/guide-home3.png',
         params: {
-            type: 'add',
+            save: true,
         },
     },
 ];
@@ -115,7 +115,7 @@ const deviceStepDetails: recommendList[] = [
         linkUrl: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -182,10 +182,7 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP3',
         label: '实时监控',
-        link: 'link/Dashboard',
+        link: 'link/DashBoard',
-        params: {
-            save: true,
-        },
         image: '/images/home/guide-home6.png',
     },
 ];
@@ -230,4 +227,17 @@ const opsStepDetails: recommendList[] = [
 
 const productDialogVisible = ref(false);
 const deviceDialogVisible = ref(false);
+
+
+
+// 设备管理-产品---新增弹窗  {save:true}
+// 设备管理-产品-产品详情---设备接入标签页 {id: 'xxxx', tab:'xxx'}
+// 规则引擎-规则编排---新增弹窗 {save: true}
+
+
+// 设备管理-设备---新增弹窗
+// 设备管理-设备---导入弹窗
+// 设备管理-设备-设备详情---设备诊断标签页
+
+// 运维管理-日志管理---系统日志标签页
 </script>

src/views/home/components/DevOpsHome/index.vue

@@ -32,12 +32,12 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP1',
         label: '设备接入配置',
-        link: 'link/accessConfig',
+        link: 'link/AccessConfig',
     },
     {
         english: 'STEP2',
         label: '日志排查',
-        link: 'link/Log',
+        link: 'Log',
         params: {
             key: 'system',
         },
@@ -45,7 +45,7 @@ const opsBootConfig: bootConfig[] = [
     {
         english: 'STEP3',
         label: '实时监控',
-        link: 'link/dashboard',
+        link: 'link/DashBoard',
         params: {
             type: 'add',
         },

src/views/home/components/DeviceCountCard.vue

@@ -26,13 +26,19 @@ const { jumpPage } = useMenuStore();
 const projectNum = ref(0);
 const deviceNum = ref(0);
 
+const menuPermission = useMenuStore().hasPermission;
 const getData = () => {
-    getDeviceCount_api().then((resp: any) => {
+    // 有产品菜单权限则获取数据
-        deviceNum.value = resp.result;
+    menuPermission('device/Product') &&
-    });
+        getDeviceCount_api().then((resp: any) => {
-    getProductCount_api({}).then((resp: any) => {
+            deviceNum.value = resp.result;
-        projectNum.value = resp.result;
+        });
-    });
+
+    // 有设备菜单权限则获取数据
+    menuPermission('device/Instance') &&
+        getProductCount_api({}).then((resp: any) => {
+            projectNum.value = resp.result;
+        });
 };
 getData();
 </script>

src/views/home/components/DeviceHome/index.vue

@@ -23,7 +23,7 @@
             <ProductChooseDialog
                 v-if="productDialogVisible"
                 v-model:visible="productDialogVisible"
-                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id })"
+                @confirm="(id:string)=>jumpPage('device/Product/Detail', { id, tab: 'Device'})"
             />
             <DeviceChooseDialog
                 v-if="deviceDialogVisible"
@@ -67,7 +67,7 @@ const deviceBootConfig: bootConfig[] = [
         link: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {
@@ -85,7 +85,7 @@ const deviceBootConfig: bootConfig[] = [
         link: 'rule-engine/Instance',
         auth: rulePermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
 ];
@@ -98,7 +98,7 @@ const deviceStepDetails: recommendList[] = [
         linkUrl: 'device/Product',
         auth: productPermission('add'),
         params: {
-            type: 'add',
+            save: true,
         },
     },
     {

src/views/home/index.vue

@@ -17,12 +17,22 @@
                     <div class="card">
                         <h3 style="margin: 0 0 24px 0">基本信息</h3>
                         <p>
-                            <span style="font-weight: bold">clientId: </span>
+                            <span class="label">clientId: </span>
-                            <span>{{ clientId }}</span>
+                            <span class="value">{{ clientId }}</span>
                         </p>
                         <p>
-                            <span style="font-weight: bold">secureKey:</span>
+                            <span class="label">secureKey:</span>
-                            <span>{{ secureKey }}</span>
+                            <span class="value">
+                                {{ showKey ? secureKey : '****************' }}
+                            </span>
+                            <AIcon
+                                :type="
+                                    showKey
+                                        ? 'EyeOutlined'
+                                        : 'EyeInvisibleOutlined'
+                                "
+                                @click="showKey = !showKey"
+                            />
                         </p>
                     </div>
                 </template>
@@ -47,14 +57,15 @@ const currentView = ref<string>('');
 const loading = ref<boolean>(true);
 const clientId = useUserInfo().$state.userInfos.id;
 const secureKey = ref<string>('');
-
+const showKey = ref(false);
 // 获取选择的视图
 const setCurrentView = () => {
     getView_api().then((resp: any) => {
         if (resp.status === 200) {
-            if (resp.result) currentView.value = resp.result?.content;
+            if (resp.result) {
-            else if (resp.result.username === 'admin') {
+                if (resp.result.username === 'admin')
-                currentView.value = 'comprehensive';
+                    currentView.value = 'comprehensive';
+                else currentView.value = resp.result?.content;
             } else currentView.value = 'init';
         }
     });
@@ -90,6 +101,15 @@ if (isNoCommunity) {
         p {
             margin: 0;
             font-size: 16px;
+
+            .label {
+                font-weight: bold;
+                margin-right: 3px;
+            }
+            .value {
+                margin-right: 10px;
+                font-size: 14px;
+            }
         }
     }
 }

src/views/media/Device/Channel/Tree/index.vue

@@ -0,0 +1,96 @@
+<template>
+    <div class="channel-tree">
+        <div class="channel-tree-query">
+            <j-input @change="queryTree" placeholder="请输入目录名称">
+                <template #suffix>
+                    <AIcon type="SearchOutlined" />
+                </template>
+            </j-input>
+        </div>
+        <div class="channel-tree-content">
+            <j-tree
+                :height="500"
+                :selectedKeys="selectedKeys"
+                :treeData="treeData"
+                :onSelect="(keys:any) => {
+                    if (keys.length) {
+                    selectedKeys = keys
+                    if (props.onSelect) {
+                        props.onSelect(keys[0]);
+                    }
+                    }
+                }"
+                :fieldNames="{ key: 'id', title: 'name' }"
+            />
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { debounce } from 'lodash';
+import ChannelApi from '@/api/media/channel';
+import DeviceApi from '@/api/media/device';
+
+interface TreeProps {
+    deviceId: string;
+    onSelect: (id: string) => void;
+    onTreeLoad: (type: boolean) => void;
+}
+
+const props = defineProps<TreeProps>();
+
+const treeData = ref<any[]>([]);
+const selectedKeys = ref<string[]>([]);
+
+const getTreeData = async (id: string, data?: any) => {
+    const { result } = await ChannelApi.queryTree(id, data);
+    treeData.value[0].children = result || [];
+    props.onTreeLoad(treeData.value[0].children.length > 10);
+    treeData.value = treeData.value;
+};
+
+/**
+ * 获取设备详情
+ * @param id
+ */
+const getDeviceDetail = async (id: string) => {
+    const deviceResp = await DeviceApi.detail(id);
+    if (deviceResp.status === 200) {
+        treeData.value = [
+            {
+                id,
+                name: deviceResp.result.name,
+                children: [],
+            },
+        ];
+        selectedKeys.value = [id];
+        getTreeData(props.deviceId, {});
+    }
+};
+
+const queryTree = debounce((e: any) => {
+    getTreeData(props.deviceId, {
+        terms: [
+            { column: 'name', termType: 'like', value: `%${e.target.value}%` },
+        ],
+    });
+}, 300);
+
+watchEffect(() => {
+    getDeviceDetail(props.deviceId);
+});
+</script>
+
+<style lang="less" scoped>
+.channel-tree {
+    height: 100%;
+
+    .channel-tree-query {
+        margin-bottom: 16px;
+    }
+
+    .channel-tree-content {
+        min-height: calc(100% - 50px);
+    }
+}
+</style>

src/views/media/Device/Channel/index.less

@@ -0,0 +1,48 @@
+.device-channel-warp {
+    display: flex;
+
+    .left-warp {
+        position: relative;
+        margin-right: 16px;
+        padding: 20px;
+        background-color: #fff;
+        border-radius: 2px;
+
+        .left-content {
+            width: 0;
+            height: 100%;
+            overflow: hidden;
+
+            &.active {
+                width: 260px;
+            }
+        }
+
+        .left-warp--btn {
+            position: absolute;
+            top: 50%;
+            right: 0;
+            padding: 20px 4px;
+            color: rgba(#000, 0.3);
+            background-color: rgba(#f0f0f0, 6);
+            border-radius: ~'100% 0 0 100% / 50% 0 0 50%';
+            cursor: pointer;
+
+            &:hover {
+                color: rgba(#000, 0.5);
+                background-color: rgba(#f0f0f0, 8);
+            }
+
+            &.active {
+                right: 50%;
+                background-color: transparent;
+                border-radius: 0;
+                transform: translateX(50%) rotate(180deg);
+            }
+        }
+    }
+
+    .right {
+        flex: 1;
+    }
+}

src/views/media/Device/Channel/index.vue

@@ -1,82 +1,102 @@
 <!-- 视频设备-通道列表 -->
 <template>
     <page-container>
-        <j-advanced-search
+        <div class="device-channel-warp">
-            type="simple"
+            <div class="left-warp" v-if="route.query.type === 'gb28181-2016'">
-            :columns="columns"
+                <div class="left-content" :class="{ active: show }">
-            target="product"
+                    <Tree
-            @search="handleSearch"
+                        :deviceId="deviceId"
-        />
+                        :on-tree-load="(e) => (show = e)"
-
+                        :on-select="handleSelect"
-        <JProTable
+                    />
-            ref="listRef"
+                </div>
-            :columns="columns"
+                <div
-            :request="(e:any) => ChannelApi.list(e, route?.query.id as string)"
+                    class="left-warp--btn"
-            :defaultParams="{
+                    :class="{ active: !show }"
-                sorts: [{ name: 'notifyTime', order: 'desc' }],
+                    @click="show = !show"
-            }"
-            :params="params"
-            model="table"
-        >
-            <template #headerTitle>
-                <j-tooltip
-                    v-if="route?.query.type === 'gb28181-2016'"
-                    title="接入方式为GB/T28281时，不支持新增"
                 >
-                    <j-button type="primary" disabled> 新增 </j-button>
+                    <AIcon type="LeftOutlined" />
-                </j-tooltip>
+                </div>
-                <j-button type="primary" @click="handleAdd" v-else>
+            </div>
-                    新增
+            <div class="right">
-                </j-button>
+                <j-advanced-search
-            </template>
+                    type="simple"
-            <template #status="slotProps">
+                    :columns="columns"
-                <j-space>
+                    target="product"
-                    <j-badge
+                    @search="handleSearch"
-                        :status="
+                />
-                            slotProps.status.value === 'online'
+
-                                ? 'success'
+                <JProTable
-                                : 'error'
+                    ref="listRef"
-                        "
+                    :columns="columns"
-                        :text="slotProps.status.text"
+                    :request="(e:any) => ChannelApi.list(e, route?.query.id as string)"
-                    ></j-badge>
+                    :defaultParams="{
-                </j-space>
+                        sorts: [{ name: 'notifyTime', order: 'desc' }],
-            </template>
+                    }"
-            <template #action="slotProps">
+                    :params="params"
-                <j-space :size="16">
+                    model="table"
-                    <j-tooltip
+                >
-                        v-for="i in getActions(slotProps, 'table')"
+                    <template #headerTitle>
-                        :key="i.key"
+                        <j-tooltip
-                        v-bind="i.tooltip"
+                            v-if="route?.query.type === 'gb28181-2016'"
-                    >
+                            title="接入方式为GB/T28281时，不支持新增"
-                        <j-popconfirm
-                            v-if="i.popConfirm"
-                            v-bind="i.popConfirm"
-                            :disabled="i.disabled"
                         >
-                            <j-button
+                            <j-button type="primary" disabled> 新增 </j-button>
-                                :disabled="i.disabled"
+                        </j-tooltip>
-                                style="padding: 0"
+                        <j-button type="primary" @click="handleAdd" v-else>
-                                type="link"
+                            新增
-                                ><AIcon :type="i.icon"
-                            /></j-button>
-                        </j-popconfirm>
-                        <j-button
-                            style="padding: 0"
-                            type="link"
-                            v-else
-                            @click="i.onClick && i.onClick(slotProps)"
-                        >
-                            <j-button
-                                :disabled="i.disabled"
-                                style="padding: 0"
-                                type="link"
-                                ><AIcon :type="i.icon"
-                            /></j-button>
                         </j-button>
-                    </j-tooltip>
+                    </template>
-                </j-space>
+                    <template #status="slotProps">
-            </template>
+                        <j-space>
-        </JProTable>
+                            <j-badge
+                                :status="
+                                    slotProps.status.value === 'online'
+                                        ? 'success'
+                                        : 'error'
+                                "
+                                :text="slotProps.status.text"
+                            ></j-badge>
+                        </j-space>
+                    </template>
+                    <template #action="slotProps">
+                        <j-space :size="16">
+                            <j-tooltip
+                                v-for="i in getActions(slotProps, 'table')"
+                                :key="i.key"
+                                v-bind="i.tooltip"
+                            >
+                                <j-popconfirm
+                                    v-if="i.popConfirm"
+                                    v-bind="i.popConfirm"
+                                    :disabled="i.disabled"
+                                >
+                                    <j-button
+                                        :disabled="i.disabled"
+                                        style="padding: 0"
+                                        type="link"
+                                        ><AIcon :type="i.icon"
+                                    /></j-button>
+                                </j-popconfirm>
+                                <j-button
+                                    style="padding: 0"
+                                    type="link"
+                                    v-else
+                                    @click="i.onClick && i.onClick(slotProps)"
+                                >
+                                    <j-button
+                                        :disabled="i.disabled"
+                                        style="padding: 0"
+                                        type="link"
+                                        ><AIcon :type="i.icon"
+                                    /></j-button>
+                                </j-button>
+                            </j-tooltip>
+                        </j-space>
+                    </template>
+                </JProTable>
+            </div>
+        </div>
 
         <Save
             v-model:visible="saveVis"
@@ -94,7 +114,9 @@ import { useMenuStore } from 'store/menu';
 import { message } from 'ant-design-vue';
 import Save from './Save.vue';
 import Live from './Live/index.vue';
+import Tree from './Tree/index.vue';
 import { cloneDeep } from 'lodash-es';
+import { useElementSize } from '@vueuse/core';
 
 const menuStory = useMenuStore();
 const route = useRoute();
@@ -253,4 +275,25 @@ const getActions = (
         ? actions.filter((f) => f.key !== 'delete')
         : actions;
 };
+
+// 左侧树
+const show = ref(false);
+const deviceId = computed(() => route.query.id as string);
+const handleSelect = (key: string) => {
+    if (key === deviceId.value && listRef.value?.reload) {
+        listRef.value?.reload();
+    } else {
+        params.value = {
+            terms: [
+                {
+                    column: 'parentId',
+                    value: key,
+                },
+            ],
+        };
+    }
+};
 </script>
+<style lang="less" scoped>
+@import './index.less';
+</style>

src/views/media/Device/Save/SaveProduct.vue

@@ -84,14 +84,16 @@
                                                 ?.addresses"
                                             :key="`${i.address}_address${idx}`"
                                         >
-                                            <j-badge
+                                            <Ellipsis>
-                                                :text="i.address"
+                                                <j-badge
-                                                :color="
+                                                    :text="i.address"
-                                                    i.health === -1
+                                                    :color="
-                                                        ? 'red'
+                                                        i.health === -1
-                                                        : 'green'
+                                                            ? 'red'
-                                                "
+                                                            : 'green'
-                                            />
+                                                    "
+                                                />
+                                            </Ellipsis>
                                         </p>
                                     </j-col>
                                 </j-row>
@@ -263,6 +265,7 @@ const handleCancel = () => {
     text-align: center;
     .gateway-item {
         padding: 16px;
+        text-align: left;
         .card-item-content-title,
         .desc,
         .subtitle {

src/views/notice/Config/index.vue

@@ -257,9 +257,7 @@ const columns = [
  * @param params
  */
 const handleSearch = (e: any) => {
-    console.log('handleSearch:', e);
     params.value = e;
-    console.log('params.value: ', params.value);
 };
 
 /**

src/views/rule-engine/Scene/Save/Timer/index.vue

@@ -1,18 +1,35 @@
 <template>
     <div>
-      <Action :thenOptions="data.branches ? data?.branches[0].then : []" :name="0" />
+        <Action
+            :thenOptions="data.branches ? data?.branches[0].then : []"
+            :name="0"
+            @add="onActionAdd"
+            @update="onActionUpdate"
+        />
     </div>
 </template>
 
 <script lang="ts" setup>
-import { useSceneStore } from '@/store/scene'
+import { useSceneStore } from '@/store/scene';
-import Action from '../action/index.vue'
+import Action from '../action/index.vue';
 import { storeToRefs } from 'pinia';
+import { ActionsType } from '@/components/Table';
 
-const sceneStore = useSceneStore()
+const sceneStore = useSceneStore();
-const { data } = storeToRefs(sceneStore)
+const { data } = storeToRefs(sceneStore);
+
+const onActionAdd = (_data: ActionsType) => {
+  console.log(_data)
+    // if (data?.branches && _data) {
+    //     const newThen = [...data?.branches?.[0].then, data];
+    //     data.branches[0].then = newThen;
+    // }
+};
+
+const onActionUpdate = (_data: ActionsType, type: boolean) => {
+  console.log(_data, type)
+};
 </script>
 
 <style scoped>
-
 </style>

src/views/rule-engine/Scene/Save/action/Device/actions/EditTable.vue

@@ -8,12 +8,20 @@
     >
         <template #bodyCell="{ column, text, record }">
             <div>
-                <template v-if="['valueType', 'name'].includes(column.dataIndex)">
+                <template
+                    v-if="['valueType', 'name'].includes(column.dataIndex)"
+                >
                     <span>{{ text }}</span>
                 </template>
                 <template v-else>
-                    <j-input />
+                    <ParamsDropdown
-                    <!-- TODO -->
+                        icon="icon-canshu"
+                        placeholder="请选择"
+                        :options="[]"
+                        :tabsOptions="tabOptions"
+                        :metricOption="upperOptions(record.valueType)"
+                        v-model:value="record.value"
+                    />
                 </template>
             </div>
         </template>
@@ -21,7 +29,8 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType } from "vue";
+import { PropType } from 'vue';
+import ParamsDropdown from '../../../components/ParamsDropdown';
 
 type Emits = {
     (e: 'update:modelValue', data: Record<string, any>[]): void;
@@ -31,9 +40,27 @@ const _emit = defineEmits<Emits>();
 const _props = defineProps({
     modelValue: {
         type: Array as PropType<Record<string, any>[]>,
-        default: '',
+        default: () => undefined,
-    }
+    },
+    builtInList: {
+        type: Array,
+        default: () => [],
+    },
 });
+
+const tabOptions = [
+    {
+        label: '手动输入',
+        component: 'string',
+        key: 'fixed',
+    },
+    {
+        label: '内置参数',
+        component: 'tree',
+        key: 'upper',
+    },
+];
+
 const columns = [
     {
         title: '参数名称',
@@ -54,11 +81,31 @@ const columns = [
 
 const dataSource = computed({
     get: () => {
-        return _props.modelValue || []
+        return _props.modelValue || [];
     },
     set: (val: any) => {
         _emit('update:modelValue', val);
-    }
+    },
-})
+});
 
+const filterParamsData = (type?: string, data?: any[]): any[] => {
+    if (type && data) {
+        return data.filter((item) => {
+            if (item.children) {
+                const _children = filterParamsData(type, item.children);
+                item.children = _children;
+                return _children.length ? true : false;
+            } else if (item.type === type) {
+                //   optionMap.current.set(item.id, item);
+                return true;
+            }
+            return false;
+        });
+    }
+    return data || [];
+};
+
+const upperOptions = (_type: string) => {
+    return filterParamsData(_type, _props?.builtInList) || [];
+};
 </script>

src/views/rule-engine/Scene/Save/action/Device/actions/WriteProperty.vue

@@ -0,0 +1,140 @@
+<template>
+    <div>
+        <a-form :layout="'vertical'" ref="formRef" :model="modelRef">
+            <j-row>
+                <j-col :span="11">
+                    <j-form-item
+                        :name="['message', 'properties']"
+                        label="读取属性"
+                        :rules="[{ required: true, message: '请选择读取属性' }]"
+                    >
+                        <j-select
+                            showSearch
+                            placeholder="请选择属性"
+                            v-model:value="modelRef.properties"
+                        >
+                            <j-select-option
+                                v-for="item in metadata?.properties || []"
+                                :value="item?.id"
+                                :key="item?.id"
+                                >{{ item?.name }}</j-select-option
+                            >
+                        </j-select>
+                    </j-form-item>
+                </j-col>
+                <j-col :span="2"></j-col>
+                <j-col :span="11">
+                    <j-form-item
+                        :name="['message', 'propertiesValue']"
+                        label="属性值"
+                        :rules="[{ required: true, message: '请选择' }]"
+                    >
+                        <ParamsDropdown
+                            icon="icon-canshu"
+                            placeholder="请选择"
+                            :options="[]"
+                            :tabsOptions="tabOptions"
+                            :metricOption="upperOptions(getType)"
+                            v-model:value="modelRef.propertiesValue"
+                        />
+                    </j-form-item>
+                </j-col>
+            </j-row>
+        </a-form>
+    </div>
+</template>
+
+<script lang="ts" setup>
+const props = defineProps({
+    value: {
+        type: Object,
+        default: () => {},
+    },
+    metadata: {
+        type: Object,
+        default: () => {
+            return {
+                properties: [],
+            };
+        },
+    },
+    builtInList: {
+        type: Array,
+        default: () => []
+    },
+});
+
+const formRef = ref();
+
+const modelRef = reactive({
+    properties: '',
+    propertiesValue: '',
+    source: '',
+});
+
+const tabOptions = [
+    {
+        label: '手动输入',
+        component: 'string',
+        key: 'fixed',
+    },
+    {
+        label: '内置参数',
+        component: 'tree',
+        key: 'upper',
+    },
+];
+const getType = computed(() => {
+    return props.metadata.properties.find((item: any) => item.id === modelRef.properties)?.valueType?.type
+})
+
+const filterParamsData = (type?: string, data?: any[]): any[] => {
+    if (type && data) {
+        return data.filter((item) => {
+            if (item.children) {
+                const _children = filterParamsData(type, item.children);
+                item.children = _children;
+                return _children.length ? true : false;
+            } else if (item.type === type) {
+                //   optionMap.current.set(item.id, item);
+                return true;
+            }
+            return false;
+        });
+    }
+    return data || [];
+};
+
+const upperOptions = (type: string) => {
+    return filterParamsData(type, props?.builtInList) || []
+}
+
+watch(
+    () => props.value,
+    (newVal) => {
+        const _keys = Object.keys(newVal)?.[0];
+        if (_keys) {
+            (modelRef.properties = _keys),
+                (modelRef.propertiesValue = newVal[_keys]?.value);
+            modelRef.source = newVal[_keys]?.source;
+        }
+    },
+    { deep: true, immediate: true },
+);
+
+const onFormSave = () => {
+    return new Promise((resolve, reject) => {
+        formRef.value
+            .validate()
+            .then(async (_data: any) => {
+                // 处理回传数据
+                resolve(_data);
+            })
+            .catch((err: any) => {
+                reject(err);
+            });
+    });
+};
+
+defineExpose({ onFormSave });
+</script>

src/views/rule-engine/Scene/Save/action/Device/actions/index.vue

@@ -9,6 +9,7 @@
                 <TopCard
                     :typeList="TypeList"
                     v-model:value="modelRef.message.messageType"
+                    @change="onMessageTypeChange"
                 />
             </j-form-item>
             <template v-if="deviceMessageType === 'INVOKE_FUNCTION'">
@@ -21,7 +22,7 @@
                         showSearch
                         placeholder="请选择功能"
                         v-model:value="modelRef.message.functionId"
-                        @change="onFunctionChange"
+                        @change="(val) => onFunctionChange(val, [])"
                     >
                         <j-select-option
                             v-for="item in metadata?.functions || []"
@@ -36,7 +37,7 @@
                     :name="['message', 'inputs']"
                     :rules="[{ required: true, message: '请输入功能值' }]"
                 >
-                    <EditTable v-model="modelRef.message.inputs" />
+                    <EditTable v-model:modelValue="modelRef.message.inputs" :builtInList="builtInList" />
                 </j-form-item>
             </template>
             <template v-else-if="deviceMessageType === 'READ_PROPERTY'">
@@ -60,44 +61,11 @@
                 </j-form-item>
             </template>
             <template v-else-if="deviceMessageType === 'WRITE_PROPERTY'">
-                <j-row>
+                <WriteProperty
-                    <j-col :span="11">
+                    v-model:value="modelRef.message.properties"
-                        <j-form-item
+                    :metadata="metadata"
-                            :name="['message', 'properties']"
+                    :builtInList="builtInList"
-                            label="读取属性"
+                />
-                            :rules="[
-                                { required: true, message: '请选择读取属性' },
-                            ]"
-                        >
-                            <j-select
-                                showSearch
-                                placeholder="请选择属性"
-                                v-model:value="modelRef.message.properties"
-                            >
-                                <j-select-option
-                                    v-for="item in metadata?.properties || []"
-                                    :value="item?.id"
-                                    :key="item?.id"
-                                    >{{ item?.name }}</j-select-option
-                                >
-                            </j-select>
-                        </j-form-item>
-                    </j-col>
-                    <j-col :span="2"></j-col>
-                    <j-col :span="11">
-                        <j-form-item
-                            :name="['message', 'properties']"
-                            label="读取属性"
-                            :rules="[
-                                { required: true, message: '请选择读取属性' },
-                            ]"
-                        >
-                            <j-select placeholder="请选择">
-                                <!-- TODO -->
-                            </j-select>
-                        </j-form-item>
-                    </j-col>
-                </j-row>
             </template>
         </a-form>
     </div>
@@ -108,6 +76,13 @@ import { getImage } from '@/utils/comm';
 import TopCard from '../device/TopCard.vue';
 import { detail } from '@/api/device/instance';
 import EditTable from './EditTable.vue';
+import WriteProperty from './WriteProperty.vue';
+import { queryBuiltInParams } from '@/api/rule-engine/scene';
+import { useSceneStore } from '@/store/scene';
+import { storeToRefs } from 'pinia'
+
+const sceneStore = useSceneStore();
+const { data } = storeToRefs(sceneStore);
 
 const TypeList = [
     {
@@ -172,44 +147,93 @@ const deviceMessageType = computed(() => {
     return modelRef.message.messageType;
 });
 
-const onFunctionChange = (val: string) => {
+const builtInList = ref<any[]>([]);
+
+const onFunctionChange = (val: string, values?: any[]) => {
     const _item = (metadata.value?.functions || []).find((item: any) => {
         return val === item.id;
     });
     const list = (_item?.inputs || []).map((item: any) => {
+        const _a = values?.find((i) => i.name === item.id);
         return {
             id: item.id,
-            name: item.name,
+            value: _a?.value,
-            value: undefined,
             valueType: item?.valueType?.type,
+            ..._a,
+            name: item.name,
         };
     });
     modelRef.message.inputs = list;
 };
 
-watchEffect(() => {
+const onMessageTypeChange = (val: string) => {
-    // console.log(props.values)
+    if (['WRITE_PROPERTY', 'INVOKE_FUNCTION'].includes(val)) {
-    // console.log(metadata.value)
+        const _params = {
-    // Object.assign()
+            branch: props.thenName,
-});
+            branchGroup: props.branchGroup,
+            action: props.name - 1,
+        };
+        queryBuiltInParams(unref(data), _params).then((res: any) => {
+            if (res.status === 200) {
+                builtInList.value = res.result
+            }
+        });
+    }
+};
 
 watch(
-    () => [props.values?.productDetail, props.values.deviceDetail],
+    () => [
-    ([newVal1, newVal2]) => {
+        props.values?.productDetail,
-        if (newVal1) {
+        props.values.selectorValues,
-            if (props.values?.selector === 'fixed') {
+        props.values?.selector,
-                detail(newVal2.id).then((resp) => {
+    ],
-                    if (resp.status === 200) {
+    ([newVal1, newVal2, newVal3]) => {
-                        metadata.value = JSON.parse(
+        if (newVal1?.id) {
-                            resp.result?.metadata || '{}',
+            if (newVal3?.selector === 'fixed') {
-                        );
+                const id = newVal2?.[0]?.value;
-                    }
+                if (id) {
-                });
+                    detail(id).then((resp) => {
+                        if (resp.status === 200) {
+                            metadata.value = JSON.parse(
+                                resp.result?.metadata || '{}',
+                            );
+                        }
+                    });
+                }
             } else {
                 metadata.value = JSON.parse(newVal1?.metadata || '{}');
             }
         }
     },
+    { immediate: true, deep: true },
+);
+
+watch(
+    () => props.values?.message,
+    (newVal) => {
+        if (newVal?.messageType) {
+            modelRef.message = newVal;
+            if (newVal.messageType === 'INVOKE_FUNCTION' && newVal.functionId) {
+                onFunctionChange(newVal.functionId, newVal?.inputs);
+            }
+            onMessageTypeChange(newVal.messageType)
+        }
+    },
     { deep: true, immediate: true },
 );
+
+const onFormSave = () => {
+    return new Promise((resolve, reject) => {
+        formRef.value
+            .validate()
+            .then(async (_data: any) => {
+                resolve(_data);
+            })
+            .catch((err: any) => {
+                reject(err);
+            });
+    });
+};
+
+defineExpose({ onFormSave });
 </script>

src/views/rule-engine/Scene/Save/action/Device/device/Device.vue

@@ -1,11 +1,11 @@
 <template>
-    <!-- <j-advanced-search
+    <j-advanced-search
         :columns="columns"
         type="simple"
         @search="handleSearch"
         class="search"
         target="scene-trigger-device-device"
-    /> -->
+    />
     <a-divider style="margin: 0" />
     <j-pro-table
         ref="actionRef"

src/views/rule-engine/Scene/Save/action/Device/device/index.vue

@@ -61,6 +61,7 @@
                     v-model:value="modelRef.selectorValues"
                     placeholder="请选择参数"
                     @select="onVariableChange"
+                    :fieldNames="{ label: 'name', value: 'id' }"
                 >
                     <template #title="{ name, description }">
                         <a-space>
@@ -108,6 +109,7 @@ const props = defineProps({
     },
 });
 
+// save保存deviceDetail
 const emits = defineEmits(['save', 'cancel']);
 
 const sceneStore = useSceneStore();
@@ -122,6 +124,7 @@ const modelRef = reactive({
     source: '',
     relationName: '',
     upperKey: '',
+    message: undefined,
 });
 
 const list = ref<any[]>([]);
@@ -160,7 +163,7 @@ const filterTree = (nodes: any[]) => {
     if (!nodes?.length) {
         return nodes;
     }
-    return nodes.filter((it) => {
+    const arr = nodes.filter((it) => {
         if (
             it.children.find(
                 (item: any) =>
@@ -173,43 +176,16 @@ const filterTree = (nodes: any[]) => {
         }
         return false;
     });
-};
+    return arr.map((item) => {
-
+        if (item.children) {
-const treeDataFilter = (arr: any[]) => {
+        }
-    if (Array.isArray(arr) && arr.length) {
+        return {
-        const list: any[] = [];
+            ...item,
-        arr.map((item: any) => {
+            title: item.name,
-            if (item.children) {
+            value: item.id,
-                const children = treeDataFilter(item.children);
+            disabled: !!item.children,
-                if (children.length) {
+        };
-                    list.push({
+    });
-                        ...item,
-                        title: item.name,
-                        value: item.id,
-                        disabled: true,
-                        children,
-                    });
-                }
-            } else {
-                if (
-                    item.children.find(
-                        (item: any) =>
-                            item.id.indexOf(
-                                'deviceId' || 'device_id' || 'device_Id',
-                            ) > -1,
-                    ) &&
-                    !item.children.find(
-                        (item: any) => item.id.indexOf('bolaen') > -1,
-                    )
-                ) {
-                    list.push(item);
-                }
-            }
-        });
-        return list;
-    } else {
-        return [];
-    }
 };
 
 const sourceChangeEvent = async () => {
@@ -220,11 +196,9 @@ const sourceChangeEvent = async () => {
     };
     const resp = await queryBuiltInParams(unref(data), _params);
     if (resp.status === 200) {
-        // const array = filterTree(resp.result as any[]);
+        const array = filterTree(resp.result as any[]);
         //判断相同产品才有按变量
         // if (props.formProductId === DeviceModel.productId)// TODO
-        console.log(array);
-        const arr = treeDataFilter(resp.result as any[]);
         builtInList.value = array;
     }
 };
@@ -293,6 +267,7 @@ const filterType = async () => {
 };
 
 const onSelectorChange = (val: string) => {
+    modelRef.selectorValues = undefined;
     if (val === 'relation') {
         queryRelationList();
     }
@@ -300,7 +275,17 @@ const onSelectorChange = (val: string) => {
 
 const onDeviceChange = (_detail: any) => {
     if (_detail) {
-        emits('save', modelRef, _detail);
+        if (_detail.id) {
+            modelRef.deviceId = _detail.id;
+            modelRef.selectorValues = [
+                { value: _detail.id, name: _detail.name },
+            ] as any;
+            modelRef.message = {} as any;
+        } else {
+            modelRef.deviceId = '';
+            modelRef.selectorValues = [] as any;
+        }
+        emits('save', unref(modelRef), _detail);
     }
 };
 
@@ -310,7 +295,7 @@ const onRelationChange = (val: any, options: any) => {
     modelRef.selectorValues = val;
     modelRef.upperKey = 'scene.deviceId';
     modelRef.relationName = options.label;
-    emits('save', modelRef, {});
+    emits('save', unref(modelRef), {});
 };
 
 const onTagChange = (val: any[], arr: any[]) => {
@@ -321,11 +306,12 @@ const onTagChange = (val: any[], arr: any[]) => {
     if (arr) {
         tagList.value = arr;
     }
+    emits('save', unref(modelRef), {});
 };
 
 const onVariableChange = (val: any, node: any) => {
     modelRef.deviceId = val;
-    // modelRef.deviceDetail = node;
+    emits('save', unref(modelRef), node);
     modelRef.selectorValues = [{ value: val, name: node.description }] as any;
 };
 
@@ -348,6 +334,21 @@ watch(
         deep: true,
     },
 );
+
+const onFormSave = () => {
+    return new Promise((resolve, reject) => {
+        formRef.value
+            .validate()
+            .then(async (_data: any) => {
+                resolve(_data);
+            })
+            .catch((err: any) => {
+                reject(err);
+            });
+    });
+};
+
+defineExpose({ onFormSave });
 </script>
 
 <style scoped lang='less'>

src/views/rule-engine/Scene/Save/action/Device/index.vue

@@ -33,13 +33,16 @@
                 :thenName="thenName"
                 :values="DeviceModel"
                 @save="onDeviceSave"
+                ref="deviceRef"
             />
-            <Action v-else-if="current === 2"
+            <Action
+                v-else-if="current === 2"
                 :name="name"
                 :branchGroup="branchGroup"
                 :thenName="thenName"
                 :values="DeviceModel"
-             />
+                ref="actionRef"
+            />
         </div>
         <template #footer>
             <div class="steps-action">
@@ -62,7 +65,13 @@ import Product from './Product.vue';
 import Device from './device/index.vue';
 import Action from './actions/index.vue';
 import { onlyMessage } from '@/utils/comm';
-import { detail } from '@/api/device/product'
+import { detail } from '@/api/device/product';
+
+import { useSceneStore } from '@/store/scene';
+import { storeToRefs } from 'pinia';
+
+const sceneStore = useSceneStore();
+const { data } = storeToRefs(sceneStore);
 
 type Emit = {
     (e: 'cancel'): void;
@@ -92,6 +101,8 @@ const props = defineProps({
 });
 
 const current = ref<number>(0);
+const deviceRef = ref<any>();
+const actionRef = ref<any>();
 
 const DeviceModel = reactive<DeviceModelType>({
     productId: '',
@@ -119,6 +130,71 @@ const onCancel = () => {
     emit('cancel');
 };
 
+const onSave = (_data: any) => {
+    const item: any = {
+      selector: DeviceModel.selector,
+      source: DeviceModel.source,
+      selectorValues: DeviceModel.selectorValues,
+      productId: DeviceModel.productId,
+      message: _data.message,
+    };
+    //处理按变量
+    if (DeviceModel.selector === 'variable') {
+      item.selector = 'fixed';
+    }
+    if (DeviceModel.selector === 'relation') {
+      item.upperKey = 'scene.deviceId';
+    }
+    const _options: any = {
+        name: '-', //设备名称
+        type: '', //类型
+        properties: '', //属性功能
+        propertiesValue: '', //设置功能
+        selector: DeviceModel.selector, //选择器标识
+        productName: DeviceModel.productDetail.name,
+        relationName: DeviceModel.relationName,
+        triggerName: data.value.options?.trigger?.name || '触发设备',
+        taglist: [],
+        columns: [],
+        otherColumns: [],
+    };
+    _options.name = DeviceModel.deviceDetail?.name;
+    const _type = _data.message.messageType;
+    if (_type === 'INVOKE_FUNCTION') {
+        _options.type = '执行';
+        _options.properties = DeviceModel.propertiesName;
+    }
+    if (_type === 'READ_PROPERTY') {
+        _options.type = '读取';
+        _options.properties = DeviceModel.propertiesName;
+    }
+    if (_type === 'WRITE_PROPERTY') {
+        _options.type = '设置';
+        _options.properties = DeviceModel.propertiesName;
+        _options.propertiesValue =
+            typeof DeviceModel.propertiesValue === 'object'
+                ? JSON.stringify(DeviceModel.propertiesValue)
+                : `${DeviceModel.propertiesValue}`;
+        _options.columns = DeviceModel.columns;
+        _options.otherColumns = DeviceModel.columns;
+        const cur: any = Object.values(_data.message.properties)?.[0];
+        if (cur?.source === 'upper') {
+            _options.propertiesValue = DeviceModel.actionName;
+        }
+    }
+    if (_options.selector === 'tag') {
+        _options.taglist = DeviceModel.tagList.map((it) => ({
+            name: it.column || it.name,
+            type: it.type ? (it.type === 'and' ? '并且' : '或者') : '',
+            value: it.value,
+        }));
+    }
+    if (_options.selector === 'variable') {
+        _options.name = DeviceModel.selectorValues?.[0]?.name;
+    }
+    emit('save', item, _options);
+};
+
 const save = async (step?: number) => {
     let _step = step !== undefined ? step : current.value;
     if (_step === 0) {
@@ -126,10 +202,15 @@ const save = async (step?: number) => {
             ? (current.value = 1)
             : onlyMessage('请选择产品', 'error');
     } else if (_step === 1) {
-        DeviceModel.deviceId
+        if (deviceRef.value) {
-            ? (current.value = 2)
+            await deviceRef.value?.onFormSave();
-            : onlyMessage('请选择设备', 'error');
+            current.value = 2;
+        }
     } else {
+        if (actionRef.value) {
+            const _data = await actionRef.value?.onFormSave();
+            onSave(_data);
+        }
     }
 };
 
@@ -148,24 +229,23 @@ const prev = () => {
 const saveClick = () => save();
 
 const onDeviceSave = (_data: any, _detail: any) => {
-    Object.assign(DeviceModel, _data)
+    Object.assign(DeviceModel, _data);
-    DeviceModel.deviceId = _detail.id
+    DeviceModel.deviceDetail = _detail;
-    DeviceModel.deviceDetail = _detail
+};
-}
 
 watch(
     () => props.value,
     (newValue) => {
         Object.assign(DeviceModel, newValue);
-        if(newValue?.productId){
+        if (newValue?.productId) {
-            detail(newValue.productId).then(resp => {
+            detail(newValue.productId).then((resp) => {
-                if(resp.status === 200){
+                if (resp.status === 200) {
-                    DeviceModel.productDetail = resp.result
+                    DeviceModel.productDetail = resp.result;
                 }
-            })
+            });
         }
     },
-    { immediate: true, deep: true },
+    { immediate: true },
 );
 </script>
 

src/views/rule-engine/Scene/Save/action/Modal/index.vue

@@ -18,12 +18,13 @@
                     },
                 ]"
             >
-                <j-card-select
+                <!-- <j-card-select
                     v-model:value="formModel.type"
                     :options="options"
                     type="horizontal"
                     float="right"
-                />
+                /> -->
+                <a-radio-group v-model:value="formModel.type" :options="options" />
             </a-form-item>
             <ActionTypeComponent
                 v-bind="props"
@@ -43,10 +44,9 @@ import Notify from '../Notify/index.vue';
 import Device from '../Device/index.vue';
 import { PropType } from 'vue';
 import { ActionsType } from '../../../typings';
-import ActionTypeComponent from './ActionTypeComponent.vue'
+import ActionTypeComponent from './ActionTypeComponent.vue';
 import { randomString } from '@/utils/utils';
 
-
 const props = defineProps({
     branchesName: {
         type: Number,
@@ -63,8 +63,8 @@ const props = defineProps({
     data: {
         type: Object as PropType<ActionsType>,
         default: () => ({
-            key: randomString()
+            key: randomString(),
-        })
+        }),
     },
     parallel: {
         type: Boolean,
@@ -117,7 +117,11 @@ watch(
     () => props.data,
     (newVal) => {
         if (newVal?.executor) {
-            formModel.type = (newVal?.executor === 'alarm' ? newVal?.alarm?.mode : newVal?.executor) as string
+            formModel.type = (
+                newVal?.executor === 'alarm'
+                    ? newVal?.alarm?.mode
+                    : newVal?.executor
+            ) as string;
         }
     },
     {
@@ -129,7 +133,15 @@ const onOk = () => {
     actionForm.value.validate().then((values: any) => {
         actionType.value = values?.type;
         if (values?.type === 'relieve' || values?.type === 'trigger') {
-            emit('save', { ...props.data, executor: 'alarm', alarm: { mode: values.type } }, {});
+            emit(
+                'save',
+                {
+                    ...props.data,
+                    executor: 'alarm',
+                    alarm: { mode: values.type },
+                },
+                {},
+            );
         }
     });
 };
@@ -140,10 +152,10 @@ const onCancel = () => {
 
 const onPropsOk = (data: any, options?: any) => {
     emit('save', { ...data, executor: data.type }, options);
-    actionType.value = ''
+    actionType.value = '';
 };
 
 const onPropsCancel = () => {
-    actionType.value = ''
+    actionType.value = '';
-}
+};
 </script>

src/views/rule-engine/Scene/Save/action/Notify/NotifyConfig.vue

@@ -1,5 +1,5 @@
 <template>
-    <Search
+    <j-advanced-search
         :columns="columns"
         type="simple"
         target="action-notice-config"

src/views/rule-engine/Scene/Save/action/Notify/NotifyTemplate.vue

@@ -1,5 +1,5 @@
 <template>
-    <Search
+    <j-advanced-search
         :columns="columns"
         type="simple"
         target="action-notice-template"

src/views/rule-engine/Scene/Save/action/Notify/NotifyWay.vue

@@ -1,10 +1,11 @@
 <template>
     <a-spin :spinning="loading">
-        <j-card-select
+        <!-- <j-card-select
             v-model:value="notifyType"
             :options="options"
             :icon-size="106"
-        />
+        /> -->
+        <a-radio-group v-model:value="notifyType" :options="options" @change="onRadioChange" />
     </a-spin>
 </template>
 
@@ -34,13 +35,17 @@ const notifyType = ref('');
 const options = ref<any[]>([]);
 
 watch(
-    () => notifyType,
+    () => props.value,
     (newVal) => {
-        emit('update:value', newVal)
+        notifyType.value = newVal
     },
     { deep: true, immediate: true },
 );
 
+const onRadioChange = (e: any) => {
+    emit('update:value', e.target.value)
+}
+
 onMounted(() => {
     loading.value = true
     notice.queryMessageType().then((resp) => {

src/views/rule-engine/Scene/Save/action/Notify/index.vue

@@ -122,7 +122,6 @@ const jumpStep = async (val: number) => {
     if (val === 0) {
         current.value = val;
     } else if (val === 1) {
-        console.log(formModel)
         if (formModel.notifyType) {
             current.value = val;
         } else {

src/views/rule-engine/Scene/Save/action/index.vue

@@ -23,7 +23,11 @@
                             type="serial"
                             :branchesName="props.name"
                             :parallel="false"
-                            :actions="serialArray.length ? serialArray[0].actions : []"
+                            :actions="
+                                serialArray.length ? serialArray[0].actions : []
+                            "
+                            @add="onAdd"
+                            @delete="onDelete"
                         />
                     </div>
                 </a-collapse-panel>
@@ -41,7 +45,11 @@
                             type="parallel"
                             :branchesName="props.name"
                             :parallel="true"
-                            :actions="parallelArray.length ? parallelArray[0].actions : []"
+                            :actions="
+                                parallelArray.length
+                                    ? parallelArray[0].actions
+                                    : []
+                            "
                             @add="onAdd"
                             @delete="onDelete"
                         />
@@ -57,6 +65,7 @@ import ShakeLimit from '../components/ShakeLimit/index.vue';
 import { List } from './ListItem';
 import { BranchesThen } from '../../typings';
 import { PropType } from 'vue';
+import { randomString } from '@/utils/utils';
 
 interface ActionsProps {
     name: number;
@@ -73,13 +82,15 @@ const props = defineProps({
     openShakeLimit: Boolean,
 });
 
+const emit = defineEmits(['update', 'add']);
+
 const shakeLimit = ref({
-    enabled: false
+    enabled: false,
 });
 const activeKeys = ref<string[]>(['1']);
 const parallelArray = ref<BranchesThen[]>([]);
 const serialArray = ref<BranchesThen[]>([]);
-const lock = ref<boolean>(false)
+const lock = ref<boolean>(false);
 
 watch(
     () => props.thenOptions,
@@ -96,8 +107,8 @@ watch(
             parallelArray.value.length &&
             (!serialArray.value.length || !isSerialActions)
         ) {
-            activeKeys.value = ['2']
+            activeKeys.value = ['2'];
-            lock.value = true
+            lock.value = true;
         }
 
         //TODO 回传数据
@@ -109,11 +120,37 @@ watch(
 );
 
 const onDelete = (_key: string) => {
-    console.log(_key)
+    const aIndex = unref(serialArray)[0].actions?.findIndex(
-}
+        (aItem) => aItem.key === _key,
-const onAdd = (data: any) => {
+    );
-    console.log(data)
+    if (aIndex !== -1) {
-}
+        serialArray.value[0].actions?.splice(aIndex, 1);
+        emit('update', serialArray[0], false);
+    }
+};
+const onAdd = (actionItem: any) => {
+    const newParallelArray = [...parallelArray.value];
+    if (newParallelArray.length) {
+        const indexOf = newParallelArray[0].actions?.findIndex(
+            (aItem) => aItem.key === actionItem.key,
+        );
+        if (indexOf !== -1) {
+            newParallelArray[0].actions.splice(indexOf, 1, actionItem);
+        } else {
+            newParallelArray[0].actions.push(actionItem);
+        }
+        parallelArray.value = [...newParallelArray];
+        console.log(parallelArray.value);
+        emit('update', newParallelArray[0], true);
+    } else {
+        actionItem.key = randomString();
+        emit('add', {
+            parallel: true,
+            key: randomString(),
+            actions: [actionItem],
+        });
+    }
+};
 </script>
 
 <style lang="less" scoped>

src/views/rule-engine/Scene/Save/components/DropdownButton/DropdownButton.vue

@@ -1,8 +1,17 @@
 <template>
-  <j-dropdown class='scene-select' trigger='click'>
+  <j-dropdown
-    <div :class='dropdownButtonClass'>
+    class='scene-select'
-      <AIcon v-if='!!icon' :type='icon' />
+    trigger='click'
-      {{ label }}
+    v-model:visible='visible'
+    @visibleChange='visibleChange'
+  >
+    <div @click.prevent='visible = true'>
+      <slot :label='label'>
+        <div :class='dropdownButtonClass' >
+            <AIcon v-if='!!icon' :type='icon' />
+            {{ label }}
+        </div>
+      </slot>
     </div>
     <template #overlay>
       <div class='scene-select-content'>
@@ -18,7 +27,7 @@
             :type='component'
             @change='timeSelect'
           />
-          <div v-else>
+          <div style='min-width: 400px' v-else>
             <j-tree
               :selectedKeys='selectValue ? [selectValue] : []'
               :treeData='options'
@@ -89,20 +98,18 @@ const props = defineProps({
   component: {
     type: String,
     default: 'select' // 'select' | 'treeSelect'
-  }
+  },
 })
 
 const emit = defineEmits<Emit>()
 
 const label = ref<LabelType>(props.placeholder)
 const selectValue = ref(props.value)
-const flatMapTree = new Map()
+const visible = ref(false)
 
-const LabelStyle = computed(() => {
+const visibleChange = (v: boolean) => {
-  return {
+  visible.value = v
-    color: selectValue.value ? '#' : '#'
+}
-  }
-})
 
 const dropdownButtonClass = computed(() => ({
   'dropdown-button': true,
@@ -112,24 +119,33 @@ const dropdownButtonClass = computed(() => ({
   'type': props.type === 'type',
 }))
 
-const treeSelect = (v: any) => {
+const treeSelect = (v: any, option: any) => {
-
+  const node = option.node
+  visible.value = false
+  label.value = node.fullname || node.name
+  selectValue.value = v[0]
+  emit('update:value', node[props.valueName])
+  emit('select', node)
 }
 
 const timeSelect = (v: string) => {
+  selectValue.value = v
+  visible.value = false
   emit('update:value', v)
   emit('select', v)
 }
 
-const menuSelect = (v: any) => {
+const menuSelect = (v: string, option: any) => {
-  const option = getOption(props.options, props.value, props.valueName)
+  selectValue.value  = v
-  emit('update:value', v.key)
+  visible.value = false
+  emit('update:value', v)
   emit('select', option)
 }
 
 watchEffect(() => {
   const option = getOption(props.options, props.value, props.valueName)
-  if (option && Object.keys(option).length) {
+  selectValue.value = props.value
+  if (option) {
     label.value = option[props.labelName] || option.name
   } else {
     label.value = props.value || props.placeholder

src/views/rule-engine/Scene/Save/components/DropdownButton/Menus.vue

@@ -7,13 +7,13 @@
 </template>
 
 <script lang='ts' setup name='DropdownMenus'>
-import { isBoolean } from 'lodash-es'
+import { isBoolean, isUndefined } from 'lodash-es'
 import { getOption } from '../DropdownButton/util'
 
 type ValueType = string| number | boolean
 type Emits = {
   (e: 'update:value', value: ValueType): void
-  (e: 'click', data: any): void
+  (e: 'click', value: string, data: any): void
 }
 
 const props = defineProps({
@@ -32,29 +32,39 @@ const emit = defineEmits<Emits>()
 const myOptions = computed(() => {
   return props.options.map((item: any) => {
     let _label = item.label || item.name
-    if (isBoolean(item.value)) {
+    let _value = isUndefined(item.value) ? item.id : item.value
-      _label = item.value === true ? '是' : '否'
+    if (isBoolean(_value)) {
+      _label = _value === true ? '是' : '否'
+      _value = String(_value)
     }
     return {
       ...item,
       label: _label,
-      value: item.value || item.id,
+      value: _value
     }
   })
 })
 
 const myValue = ref(props.value)
 
+const handleBoolean = (key: string) => {
+  return key === 'false' ? false : true
+}
+
 const click = (e: any) => {
-  const option = getOption(myOptions.value, e.key)
+  const _key = ['true', 'false'].includes(e.key) ? handleBoolean(e.key) : e.key
-  myValue.value = e.key
+  const option = getOption(myOptions.value, _key)
-  emit('update:value', e.key)
+  myValue.value = _key
-  emit('click', {
+  emit('update:value', _key)
-    key: e.key,
+  emit('click', _key, {
+    key: _key,
     ...option
   })
 }
 
+watch(() => props.value, () => {
+  myValue.value = props.value
+}, { immediate: true})
 </script>
 
 <style scoped lang='less'>

src/views/rule-engine/Scene/Save/components/DropdownButton/Time.vue

@@ -62,7 +62,7 @@ const change = (e: string) => {
 }
 </script>
 
-<style lang='less'>
+<style lang='less' scoped>
 .dropdown-time-picker {
   >div{
     position: relative !important;
@@ -86,4 +86,8 @@ const change = (e: string) => {
     box-shadow: unset;
   }
 }
+
+.wrapper{
+  display: none;
+}
 </style>

src/views/rule-engine/Scene/Save/components/DropdownButton/util.ts

@@ -26,8 +26,8 @@ export const getComponent = (type: string): string => {
 }
 
 export const getOption = (data: any[], value?: string | number | boolean, key: string = 'name'): DropdownButtonOptions | any => {
-  let option = {}
+  let option
-  if (!value) return option
+  if (value === undefined && value === null) return option
   for (let i = 0; i < data.length; i++) {
     const item = data[i]
     if (item[key] === value) {
@@ -35,7 +35,9 @@ export const getOption = (data: any[], value?: string | number | boolean, key: s
       break
     } else if (item.children && item.children.length){
       option = getOption(item.children, value, key)
-      if (option) break
+      if (option) {
+        break
+      }
     }
   }
   return option

src/views/rule-engine/Scene/Save/components/ParamsDropdown/index.vue

@@ -5,9 +5,13 @@
     v-model:visible='visible'
     @visibleChange='visibleChange'
   >
-    <div class='dropdown-button value' @click.prevent='visible = true'>
+    <div @click.prevent='visible = true'>
-      <AIcon v-if='!!icon' :type='icon' />
+      <slot :label='label'>
-      {{ label }}
+        <div class='dropdown-button value'>
+            <AIcon v-if='!!icon' :type='icon' />
+            {{ label }}
+        </div>
+      </slot>
     </div>
     <template #overlay>
       <div class='scene-select-content'>
@@ -24,32 +28,36 @@
                 @change='timeChange'
               />
               <DropdownMenus
-                v-if='["metric","enum", "boolean"].includes(item.component)'
+                v-if='["select","enum", "boolean"].includes(item.component)'
-                :options='options'
+                :options='["metric", "upper"].includes(item.key) ?  metricOption : options'
-                @change='onSelect'
+                @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>
               <ValueItem
-                v-else-if='valueItemKey.includes(item.component)'
+                v-else
                 v-model:modelValue='myValue'
                 :itemType='getComponent(item.component)'
-                :options='options'
+                :options='item.key === "upper" ?  metricOption : options'
                 @change='valueItemChange'
               />
-              <j-tree
-                v-else
-                :selectedKeys='myValue ? [myValue] : []'
-                :treeData='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>
           </j-tab-pane>
         </j-tabs>
@@ -101,10 +109,9 @@ const updateValue = () => {
 }
 
 const treeSelect = (e: any) => {
-  console.log('treeSelect', e)
   visible.value = false
   label.value = e.fullname || e.name
-  emit('update:value', e.id)
+  emit('update:value', e[props.valueName])
   emit('select', e)
 }
 
@@ -115,7 +122,8 @@ const valueItemChange = (e: string) => {
   emit('select', e)
 }
 
-const sonSelect = (e: string, option: any) => {
+const onSelect = (e: string, option: any) => {
+  console.log(e, option)
   visible.value = false
   label.value = option.label
   emit('update:value', e)
@@ -133,14 +141,16 @@ const visibleChange = (v: boolean) => {
   visible.value = v
 }
 
-watch([props.options, props.value], () => {
+watchEffect(() => {
   const option = getOption(props.options, props.value as string, props.valueName) // 回显label值
-  if (option && Object.keys(option).length) {
+  myValue.value = props.value
+  mySource.value = props.source
+  if (option) {
     label.value = option[props.labelName] || option.name
   } else {
     label.value = props.value || props.placeholder
   }
-}, { immediate: true })
+})
 
 </script>
 

src/views/rule-engine/Scene/Save/components/ParamsDropdown/typings.ts

@@ -12,8 +12,7 @@ export type DropdownButtonOptions = {
 export type TabsOption = {
   label: string;
   key: string;
-  component: string,
+  component: string
-  options: DropdownButtonOptions[]
 }
 type ValueArrayType = [string, number]
 export type ValueType = string | number | undefined | ValueArrayType
@@ -47,6 +46,10 @@ 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: () => []

src/views/rule-engine/Scene/Save/components/Terms/ParamsItem.vue

@@ -40,10 +40,8 @@
         icon='icon-canshu'
         placeholder='参数值'
         :options='valueOptions'
-        :tabsOptions='[
+        :metricOption='metricOption'
-          { label: "手动输入", component: "input", key: "fixed" },
+        :tabsOptions='tabsOptions'
-          { label: "指标值", component: "time", key: "manual" }
-        ]'
         v-model:value='paramsValue.value.value'
         v-model:source='paramsValue.value.source'
       />
@@ -52,10 +50,8 @@
         icon='icon-canshu'
         placeholder='参数值'
         :options='valueOptions'
-        :tabsOptions='[
+        :metricOption='metricOption'
-          { label: "手动输入", component: "time", key: "fixed" },
+        :tabsOptions='tabsOptions'
-          { label: "指标值", component: "input", key: "manual" },
-        ]'
         v-model:value='paramsValue.value.value'
         v-model:source='paramsValue.value.source'
       />
@@ -80,6 +76,16 @@ import ParamsDropdown, { DoubleParamsDropdown } from '../ParamsDropdown'
 import { inject } from 'vue'
 import { ContextKey } from './util'
 
+type Emit = {
+  (e: 'update:value', data: TermsType): void
+}
+
+type TabsOption = {
+  label: string;
+  key: string;
+  component: string
+}
+
 const props = defineProps({
   isFirst: {
     type: Boolean,
@@ -98,7 +104,7 @@ const props = defineProps({
     default: () => ({
       column: '',
       type: '',
-      termType: undefined,
+      termType: 'eq',
       value: {
         source: 'fixed',
         value: undefined
@@ -107,6 +113,8 @@ const props = defineProps({
   }
 })
 
+const emit = defineEmits<Emit>()
+
 const paramsValue = reactive<TermsType>({
   column: props.value.column,
   type: props.value.type,
@@ -115,21 +123,56 @@ const paramsValue = reactive<TermsType>({
 })
 
 const showDelete = ref(false)
-const columnOptions: any = inject(ContextKey)
+const columnOptions: any = inject(ContextKey) //
-const options = ref<any>([])
+const termTypeOptions = ref<Array<{ id: string, name: string}>>([]) // 条件值
+const valueOptions = ref<any[]>([]) // 默认手动输入下拉
+const metricOption = ref<any[]>([])  // 根据termType获取对应指标值
+const tabsOptions = ref<Array<TabsOption>>([{ label: '手动输入', key: 'manual', component: 'string' }])
+let metricsCacheOption: any[] = [] // 缓存指标值
 
-const termTypeOptions = computed(() => {
+const handOptionByColumn = (option: any) => {
+  if (option) {
+    termTypeOptions.value = option.termTypes || []
+    metricsCacheOption = 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 = []
+    metricsCacheOption = []
+    valueOptions.value = []
+  }
+}
+
+watchEffect(() => {
   const option = getOption(columnOptions.value, paramsValue.column, 'column')
-  return option && Object.keys(option).length ? option.termTypes : []
+  handOptionByColumn(option)
-})
-
-const tabsOptions = computed(() => {
-  // 获取当前value对应的option
-  return []
 })
 
 const showDouble = computed(() => {
-  return paramsValue.termType ? ['nbtw', 'btw', 'in', 'nin'].includes(paramsValue.termType) : false
+  const isRange = paramsValue.termType ? ['nbtw', 'btw', 'in', 'nin'].includes(paramsValue.termType) : false
+  if (metricsCacheOption.length) {
+    metricOption.value = metricsCacheOption.filter(item => isRange ? item.range : !item.range)
+  } else {
+    metricOption.value = []
+  }
+  return isRange
 })
 
 const mouseover = () => {
@@ -145,11 +188,20 @@ const mouseout = () => {
 }
 
 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 = () => {
@@ -160,10 +212,6 @@ const onDelete = () => {
 
 }
 
-const valueOptions = computed(() => {
-  return []
-})
-
 nextTick(() => {
   Object.assign(paramsValue, props.value)
 })

src/views/rule-engine/Scene/Save/components/Terms/Terms.vue

@@ -77,11 +77,22 @@ const rules = [{
   }
 }]
 
+const handleParamsData = (data: any[]): any[] => {
+  return data?.map(item => {
+    return {
+      ...item,
+      key: item.column,
+      disabled: !!item.children,
+      children: handleParamsData(item.children)
+    }
+  }) || []
+}
+
 const queryColumn = (dataModel: FormModelType) => {
   const cloneDevice = cloneDeep(dataModel)
   cloneDevice.branches = cloneDevice.branches?.filter(item => !!item)
   getParseTerm(cloneDevice).then(res => {
-      columnOptions.value = res.result
+      columnOptions.value = handleParamsData(res.result as any[])
   })
 }
 

src/views/rule-engine/Scene/index.vue

@@ -121,7 +121,7 @@
     </page-container>
 </template>
 
-<script setup lang='ts'>
+<script setup lang='ts' name='Scene'>
 import SaveModal from './Save/save.vue';
 import type { SceneItem } from './typings';
 import { useMenuStore } from 'store/menu';

src/views/rule-engine/Scene/typings.ts

@@ -187,7 +187,7 @@ export type TriggerType = {
 };
 
 export interface TermsVale {
-  source: keyof typeof Source;
+  source: string;
   /** 手动输入值,source为 manual 时不能为空 */
   value?: Record<string, any> | any[];
   /** 指标值,source为 metric 时不能为空 */

src/views/system/Platforms/Api/index.vue

@@ -3,7 +3,7 @@
         <div class="top">
             <slot name="top" />
         </div>
-        <j-row :gutter="24">
+        <j-row :gutter="24" class="content">
             <j-col
                 :span="24"
                 v-if="props.showTitle"
@@ -151,11 +151,16 @@ function init() {
 
 <style lang="less" scoped>
 .api-page-container {
-    .tree-content {
+    .content {
-        padding-bottom: 30px;
+        background-color: #fff;
-        height: calc(100vh - 230px);
+        padding: 24px;
-        overflow-y: auto;
+        margin: 0 !important;
-        border-right: 1px solid #e9e9e9;
+        .tree-content {
+            padding-bottom: 30px;
+            height: calc(100vh - 230px);
+            overflow-y: auto;
+            border-right: 1px solid #e9e9e9;
+        }
     }
 }
 </style>

yarn.lock

@@ -3695,8 +3695,8 @@ jetlinks-store@^0.0.3:
 
 jetlinks-ui-components@^1.0.4:
   version "1.0.4"
-  resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.4.tgz#34b70f75dcc4ea679f0da6674a3f372dfc4acab4"
+  resolved "https://registry.jetlinks.cn/jetlinks-ui-components/-/jetlinks-ui-components-1.0.4.tgz#41d52892f0f4d38adc6df02a87290a3042eb5645"
-  integrity sha512-ffDi9NyD51hPzu6iRBhibxlI36In5igUciMugm+Lui2LxnYdGbXGvB0i4y6xKaGg4jRDJ/lDX+b6AvuIrlb1lg==
+  integrity sha512-aX+XiGigzxZnrG52xqipxd+WuFwBeZ6+dvLkcvOfLLBqSu8sgfvr/8NJ5hFgv5Eo2QFnUJq3Qf4HXLw9Ogv/yw==
   dependencies:
     "@vueuse/core" "^9.12.0"
     ant-design-vue "^3.2.15"