feat: merge

src/components/ProTableCard/CardItems/Scene/index.tsx

@@ -45,148 +45,134 @@ enum UnitEnum {
   hours = '小时',
 }
 
-const selectorRender = (obj: any) => {
-  switch (obj?.selector) {
-    case 'all':
-      return (
-        <span>
-          所有的<span className={styles['trigger-device']}>{obj?.productId}</span>
-        </span>
-      );
-    case 'fixed':
-      return (
-        <span>
-          设备
-          <span className={styles['trigger-device']}>
-            {(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}
-          </span>
-        </span>
-      );
-    case 'org':
-      return (
-        <span>
-          部门
-          <span className={styles['trigger-device']}>
-            {(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}
-          </span>
-        </span>
-      );
-    default:
-      return '';
-  }
-};
+// const selectorRender = (obj: any) => {
+//   switch (obj?.selector) {
+//     case 'all':
+//       return (
+//         <span>
+//           所有的<span className={styles['trigger-device']}>{obj?.productId}</span>
+//         </span>
+//       );
+//     case 'fixed':
+//       return (
+//         <span>
+//           设备
+//           <span className={styles['trigger-device']}>
+//             {(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}
+//           </span>
+//         </span>
+//       );
+//     case 'org':
+//       return (
+//         <span>
+//           部门
+//           <span className={styles['trigger-device']}>
+//             {(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}
+//           </span>
+//         </span>
+//       );
+//     default:
+//       return '';
+//   }
+// };
 
-const selectorContextRender = (obj: any) => {
-  switch (obj?.selector) {
-    case 'all':
-      return `所有的${obj?.productId}`;
-    case 'fixed':
-      return `设备${(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}`;
-    case 'org':
-      return `部门${(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}`;
-    default:
-      return '';
-  }
-};
+// const selectorContextRender = (obj: any) => {
+//   switch (obj?.selector) {
+//     case 'all':
+//       return `所有的${obj?.productId}`;
+//     case 'fixed':
+//       return `设备${(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}`;
+//     case 'org':
+//       return `部门${(obj?.selectorValues || '').map((item: any) => item?.name).join(',')}`;
+//     default:
+//       return '';
+//   }
+// };
 
-const timerRender = (timer: any) => {
-  if (timer?.trigger && timer?.mod) {
-    const trigger = timer?.trigger;
-    const mod = timer?.mod;
-    const str: string = trigger === 'week' ? '星期' : trigger === 'month' ? '月' : timer?.cron;
-    if (mod === 'once') {
-      return `，每${str}${timer.when.join('/')}，${timer?.once.time}执行一次`;
-    } else {
-      return `每${str}${timer.when.join('/')}，${timer?.period?.from}-${timer?.period.to}，每${
-        timer?.period.every
-      }${UnitEnum[timer?.period?.unit]}执行一次`;
-    }
-  }
-  return '';
-};
+// const timerRender = (timer: any) => {
+//   if (timer?.trigger && timer?.mod) {
+//     const trigger = timer?.trigger;
+//     const mod = timer?.mod;
+//     const str: string = trigger === 'week' ? '星期' : trigger === 'month' ? '月' : timer?.cron;
+//     if (mod === 'once') {
+//       return `，每${str}${timer.when.join('/')}，${timer?.once.time}执行一次`;
+//     } else {
+//       return `每${str}${timer.when.join('/')}，${timer?.period?.from}-${timer?.period.to}，每${
+//         timer?.period.every
+//       }${UnitEnum[timer?.period?.unit]}执行一次`;
+//     }
+//   }
+//   return '';
+// };
 
-const operatorRender = (operation: any) => {
-  switch (operation?.operator) {
-    case 'online':
-      return '上线';
-    case 'offline':
-      return '离线';
-    case 'reportEvent':
-      return `上报事件${operation?.options?.eventName}`;
-    case 'reportProperty':
-      return `上报属性${(operation?.options?.propertiesName || []).join(',')}`;
-    case 'readProperty':
-      return `读取属性${(operation?.options?.propertiesName || []).join(',')}`;
-    case 'writeProperty':
-      return `修改属性${(operation?.options?.propertiesName || []).join(',')}`;
-    case 'invokeFunction':
-      return `调用功能${operation?.options?.functionName}`;
-    default:
-      return '';
-  }
-};
+// const operatorRender = (operation: any) => {
+//   switch (operation?.operator) {
+//     case 'online':
+//       return '上线';
+//     case 'offline':
+//       return '离线';
+//     case 'reportEvent':
+//       return `上报事件${operation?.options?.eventName}`;
+//     case 'reportProperty':
+//       return `上报属性${(operation?.options?.propertiesName || []).join(',')}`;
+//     case 'readProperty':
+//       return `读取属性${(operation?.options?.propertiesName || []).join(',')}`;
+//     case 'writeProperty':
+//       return `修改属性${(operation?.options?.propertiesName || []).join(',')}`;
+//     case 'invokeFunction':
+//       return `调用功能${operation?.options?.functionName}`;
+//     default:
+//       return '';
+//   }
+// };
 
 const notifyRender = (data: ActionsType | undefined) => {
   switch (data?.notify?.notifyType) {
     case 'dingTalk':
       return (
-        <div>
+        <div className={styles['notify-img-highlight']}>
           向<span>{data?.options?.notifierName || data?.notify?.notifierId}</span>
-          通过<span className={styles['notify-img-highlight']}>钉钉</span>发送
-          <span className={styles['notify-text-highlight']}>
-            {data?.options?.templateName || data?.notify?.templateId}
-          </span>
+          通过<span>钉钉</span>发送
+          <span>{data?.options?.templateName || data?.notify?.templateId}</span>
         </div>
       );
     case 'weixin':
       return (
-        <div>
-          向<span className={styles['notify-text-highlight']}>{data?.options?.sendTo || ''}</span>
-          <span className={styles['notify-text-highlight']}>{data?.options?.orgName || ''}</span>
-          <span className={styles['notify-text-highlight']}>{data?.options?.tagName || ''}</span>
-          通过<span className={styles['notify-img-highlight']}>微信</span>发送
-          <span className={styles['notify-text-highlight']}>
-            {data?.options?.templateName || data?.notify?.templateId}
-          </span>
+        <div className={styles['notify-img-highlight']}>
+          向<span>{data?.options?.sendTo || ''}</span>
+          <span>{data?.options?.orgName || ''}</span>
+          <span>{data?.options?.tagName || ''}</span>
+          通过<span>微信</span>发送
+          <span>{data?.options?.templateName || data?.notify?.templateId}</span>
         </div>
       );
     case 'email':
       return (
-        <div>
-          向<span className={styles['notify-text-highlight']}>{data?.options?.sendTo || ''}</span>
-          通过<span className={styles['notify-img-highlight']}>邮件</span>发送
-          <span className={styles['notify-text-highlight']}>
-            {data?.options?.templateName || data?.notify?.templateId}
-          </span>
+        <div className={styles['notify-img-highlight']}>
+          向<span>{data?.options?.sendTo || ''}</span>
+          通过<span>邮件</span>发送
+          <span>{data?.options?.templateName || data?.notify?.templateId}</span>
         </div>
       );
     case 'voice':
       return (
-        <div>
-          向
-          <span className={styles['notify-text-highlight']}>
-            {data?.options?.calledNumber || ''}
-          </span>
-          通过<span className={styles['notify-img-highlight']}>语音</span>发送
-          <span className={styles['notify-text-highlight']}>
-            {data?.options?.templateName || data?.notify?.templateId}
-          </span>
+        <div className={styles['notify-img-highlight']}>
+          向<span>{data?.options?.calledNumber || ''}</span>
+          通过<span>语音</span>发送
+          <span>{data?.options?.templateName || data?.notify?.templateId}</span>
         </div>
       );
     case 'sms':
       return (
-        <div>
-          向<span className={'notify-text-highlight'}>{data?.options?.sendTo || ''}</span>
-          通过<span className={'notify-img-highlight'}>短信</span>发送
-          <span className={'notify-text-highlight'}>
-            {data?.options?.templateName || data?.notify?.templateId}
-          </span>
+        <div className={styles['notify-img-highlight']}>
+          向{data?.options?.sendTo || ''}通过短信发送
+          {data?.options?.templateName || data?.notify?.templateId}
         </div>
       );
     case 'webhook':
       return (
-        <div>
-          通过<span className={'notify-img-highlight'}>webhook</span>发送
+        <div className={styles['notify-img-highlight']}>
+          通过<span>webhook</span>发送
           <span>{data?.options?.templateName || data?.notify?.templateId}</span>
         </div>
       );
@@ -199,18 +185,18 @@ const deviceRender = (data: ActionsType | undefined) => {
   switch (data?.device?.selector) {
     case 'fixed':
       return (
-        <div>
+        <div className={styles['notify-text-highlight']}>
           {data?.options?.type}
-          <span className={styles['notify-text-highlight']}>{data?.options?.name}</span>
+          <span className={styles['trigger-device']}>{data?.options?.name}</span>
           {data?.options?.properties}
         </div>
       );
     case 'tag':
       return (
-        <div>
+        <div className={styles['notify-text-highlight']}>
           {data?.options?.type}
           {data.options?.taglist.map((item: any) => (
-            <span className={styles['notify-text-highlight']}>
+            <span className={styles['trigger-device']}>
               {item.type}
               {item.name}
               {item.value}
@@ -222,9 +208,9 @@ const deviceRender = (data: ActionsType | undefined) => {
       );
     case 'relation':
       return (
-        <div>
+        <div className={styles['notify-text-highlight']}>
           {data?.options?.type}与
-          <span className={styles['notify-text-highlight']}>{data?.options?.name}</span>具有相同
+          <span className={styles['trigger-device']}>{data?.options?.name}</span>具有相同
           {data?.options?.relationName}的{data?.options?.productName}设备的
           {data?.options?.properties}
         </div>
@@ -324,31 +310,25 @@ const branchesActionRender = (actions: any[]) => {
 const ContentRender = (data: SceneCardProps) => {
   const [visible, setVisible] = useState<boolean>(false);
   const type = data.triggerType;
-  if (
-    type === 'device' &&
-    (data.branches || [])?.length &&
-    Object.keys(data?.trigger?.device || {}).length
-  ) {
-    const obj = data.trigger.device;
-    const operation: any = data.trigger.device?.operation;
+  if (!!type && (data.branches || [])?.length) {
+    const trigger = data?.options?.trigger;
+    const text =
+      (trigger?.name || '') +
+      (trigger?.productName || '') +
+      (trigger?.when || '') +
+      (trigger?.time || '') +
+      (trigger?.extraTime || '') +
+      (trigger?.type || '');
     return (
       <div className={styles['card-item-content-box']}>
-        <MyTooltip
-          placement="topLeft"
-          title={`${
-            selectorContextRender(obj) + timerRender(operation?.timer) + operatorRender(operation)
-          }`}
-        >
+        <MyTooltip placement="topLeft" title={text}>
           <div className={classNames(styles['card-item-content-trigger'], 'ellipsis')}>
-            {selectorRender(obj)}
-            {operation ? (
-              <span>
-                {timerRender(operation?.timer)}
-                {operatorRender(operation)}
-              </span>
-            ) : (
-              ''
-            )}
+            {trigger?.name || ''}
+            <span className={styles['trigger-device']}>{trigger?.productName || ''}</span>
+            {(trigger?.when || '') +
+              (trigger?.time || '') +
+              (trigger?.extraTime || '') +
+              (trigger?.type || '')}
           </div>
         </MyTooltip>
         <div className={styles['card-item-content-action']}>
@@ -357,28 +337,30 @@ const ContentRender = (data: SceneCardProps) => {
               return (
                 <div className={styles['card-item-content-action-item']} key={item?.key || index}>
                   <div className={styles['card-item-content-action-item-left']}>
-                    {index === 0 ? '当' : '否则'}
+                    {type === 'device' ? (index === 0 ? '当' : '否则') : '执行'}
                   </div>
                   <div className={styles['card-item-content-action-item-right']}>
                     <div className={styles['card-item-content-action-item-right-item']}>
-                      <div className={styles['right-item-left']}>
-                        <MyTooltip title={conditionsRender(data.options?.terms || [], index)}>
-                          <div className={classNames(styles['trigger-conditions'], 'ellipsis')}>
-                            {conditionsRender(data.options?.terms || [], index)}
-                          </div>
-                        </MyTooltip>
-                        {item.shakeLimit?.enabled && (
-                          <MyTooltip
-                            title={`(${item.shakeLimit?.time}秒内发生${item.shakeLimit?.threshold}
-                            次以上时执行一次)`}
-                          >
-                            <div className={classNames(styles['trigger-shake'], 'ellipsis')}>
-                              ({item.shakeLimit?.time}秒内发生{item.shakeLimit?.threshold}
-                              次以上时执行一次)
+                      {type === 'device' && (
+                        <div className={styles['right-item-left']}>
+                          <MyTooltip title={conditionsRender(data.options?.terms || [], index)}>
+                            <div className={classNames(styles['trigger-conditions'], 'ellipsis')}>
+                              {conditionsRender(data.options?.terms || [], index)}
                             </div>
                           </MyTooltip>
-                        )}
-                      </div>
+                          {item.shakeLimit?.enabled && (
+                            <MyTooltip
+                              title={`(${item.shakeLimit?.time}秒内发生${item.shakeLimit?.threshold}
+                            次以上时执行一次)`}
+                            >
+                              <div className={classNames(styles['trigger-shake'], 'ellipsis')}>
+                                ({item.shakeLimit?.time}秒内发生{item.shakeLimit?.threshold}
+                                次以上时执行一次)
+                              </div>
+                            </MyTooltip>
+                          )}
+                        </div>
+                      )}
                       <div className={styles['right-item-right']}>
                         {(item?.then || []).map((i: BranchesThen, _index: number) => (
                           <div key={i?.key || _index} className={styles['right-item-right-item']}>
@@ -411,39 +393,6 @@ const ContentRender = (data: SceneCardProps) => {
         </div>
       </div>
     );
-  } else if (type !== 'device' && data.branches?.length) {
-    return (
-      <div className={styles['card-item-content-box']}>
-        <div className={styles['card-item-content-action']}>
-          {data.branches?.length &&
-            (data?.branches || []).map((item: any, index) => {
-              return (
-                <div className={styles['card-item-content-action-item']} key={item?.key || index}>
-                  <div className={styles['card-item-content-action-item-left']}>执行</div>
-                  <div className={styles['card-item-content-action-item-right']}>
-                    <div className={styles['card-item-content-action-item-right-item']}>
-                      <div className={styles['right-item-right']}>
-                        {(item?.then || []).map((i: BranchesThen, _index: number) => {
-                          return (
-                            <div key={i?.key || _index} className={styles['right-item-right-item']}>
-                              <div className={styles['trigger-ways']}>
-                                {i.parallel ? '并行执行' : '串行执行'}
-                              </div>
-                              <div className={classNames(styles['right-item-right-item-contents'])}>
-                                {branchesActionRender(Array.isArray(i?.actions) ? i?.actions : [])}
-                              </div>
-                            </div>
-                          );
-                        })}
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              );
-            })}
-        </div>
-      </div>
-    );
   } else {
     return <div className={styles['card-item-content-box-empty']}>未配置规则</div>;
   }

src/pages/rule-engine/Scene/Save/action/DeviceOutput/device/index.tsx

@@ -46,13 +46,13 @@ export default observer((props: Props) => {
     {
       label: '按关系',
       value: 'relation',
-      image: require('/public/images/scene/device-custom.png'),
+      image: require('/public/images/scene/device-relation.png'),
       tip: '选择与触发设备具有相同关系的设备',
     },
     {
       label: '按标签',
       value: 'tag',
-      image: require('/public/images/scene/device-custom.png'),
+      image: require('/public/images/scene/device-tag.png'),
       tip: '按标签选择产品下具有特定标签的设备',
     },
     {
@@ -292,7 +292,7 @@ export default observer((props: Props) => {
     });
   };
   const filterType = async () => {
-    console.log(FormModel);
+    // console.log('',FormModel);
     if (FormModel.trigger?.type === 'device') {
       const res = await getRelations();
       if (res.status === 200 && res.result.length === 0) {

src/pages/rule-engine/Scene/index.tsx

@@ -149,8 +149,7 @@ const Scene = () => {
           },
         }}
         tooltip={{
-          title:
-            record.state.value === 'started' ? <span>请先禁用该场景,再删除</span> : <span></span>,
+          title: record.state.value === 'started' ? <span>请先禁用该场景,再删除</span> : '',
         }}
       >
         <DeleteOutlined />