Merge pull request #2689 from emqx/dev/1.9.0

Sync code from refs/heads/dev/1.9.0 to enterprise

src/hooks/Rule/connector/useHandleConnectorItem.ts

@@ -1,14 +1,18 @@
 import {
   postConnector,
   putConnector,
+  putConnectorEnable,
   getConnectorDetail as requestConnectorDetail,
   deleteConnector as requestDelConnector,
   reconnectConnector as requestReconnectConnector,
 } from '@/api/connector'
 import useTestConnector from '@/hooks/Rule/connector/useTestConnector'
 import useWebhookUtils from '@/hooks/Webhook/useWebhookUtils'
+import useI18nTl from '@/hooks/useI18nTl'
 import useOperationConfirm from '@/hooks/useOperationConfirm'
 import { BridgeItem, Connector } from '@/types/rule'
+import { ElMessage } from 'element-plus'
+import { isFunction } from 'lodash'
 import { Ref, ref } from 'vue'
 import { useConnectorDataHandler } from '../useDataHandler'
 
@@ -21,6 +25,7 @@ interface ConnectorHandlerResult {
   updateConnector: (data: Connector) => Promise<Connector>
   deleteConnector: (id: string, withDep?: boolean) => Promise<void>
   reconnectConnector: (id: string) => Promise<void>
+  toggleConnectorEnable: (id: string, isEnable: boolean, sucCb?: () => void) => Promise<void>
   handleDataForCopy: (data: Connector) => Connector
   isTesting: Ref<boolean>
   testConnectivity: (data: NowConnector) => Promise<void>
@@ -84,6 +89,27 @@ export default (): ConnectorHandlerResult => {
     return requestReconnectConnector(id)
   }
 
+  const { operationWarning, confirmDel } = useOperationConfirm()
+
+  const { t } = useI18nTl('RuleEngine')
+  const toggleConnectorEnable = async (id: string, isEnable: boolean, sucCb?: () => void) => {
+    const sucMessage = isEnable ? 'Base.enableSuccess' : 'Base.disabledSuccess'
+    try {
+      if (!isEnable) {
+        await operationWarning(t('Base.confirmDisabled'))
+      }
+      await putConnectorEnable(id, isEnable)
+      if (isFunction(sucCb)) {
+        sucCb()
+      }
+      ElMessage.success(t(sucMessage))
+      return Promise.resolve()
+    } catch (error) {
+      console.error(error)
+      return Promise.reject()
+    }
+  }
+
   const { isTesting, testConnectivity: testConnectorConnectivity } = useTestConnector()
   const testConnectivity = async (data: NowConnector): Promise<void> =>
     testConnectorConnectivity(data as Connector)
@@ -92,8 +118,6 @@ export default (): ConnectorHandlerResult => {
   const associatedActionList = ref<Array<string>>([])
   const currentDelType = ref('')
 
-  const { confirmDel } = useOperationConfirm()
-
   const deleteTrueConnector = async (id: string) => {
     return confirmDel(() => deleteConnector(id))
   }
@@ -133,6 +157,7 @@ export default (): ConnectorHandlerResult => {
     updateConnector,
     deleteConnector,
     reconnectConnector,
+    toggleConnectorEnable,
     handleDataForCopy,
     isTesting,
     testConnectivity,

src/i18n/Base.js

@@ -323,6 +323,10 @@ export default {
     zh: '是否确认替换当前内容？',
     en: 'Are you sure you want to replace the current content?',
   },
+  confirmDisabled: {
+    zh: '是否确认停用？',
+    en: 'Are you sure you want to disable?',
+  },
   import: {
     zh: '导入',
     en: 'Import',

src/types/schemas/metrics.schemas.ts

@@ -290,6 +290,7 @@ export interface EmqxDashboardMonitorApiSamplerCurrentNode {
   sent_msg_rate?: number
   validation_failed_rate?: number
   validation_succeeded_rate?: number
+  disconnected_durable_sessions?: number
   durable_subscriptions?: number
   subscriptions?: number
   topics?: number
@@ -308,6 +309,7 @@ export interface EmqxDashboardMonitorApiSamplerCurrent {
   sent_msg_rate?: number
   validation_failed_rate?: number
   validation_succeeded_rate?: number
+  disconnected_durable_sessions?: number
   durable_subscriptions?: number
   subscriptions?: number
   topics?: number
@@ -320,6 +322,7 @@ export interface EmqxDashboardMonitorApiSamplerCurrent {
 
 export interface EmqxDashboardMonitorApiSampler {
   time_stamp?: number
+  disconnected_durable_sessions?: number
   durable_subscriptions?: number
   subscriptions?: number
   topics?: number

src/views/RuleEngine/Connector/Connector.vue

@@ -45,6 +45,22 @@
             <TargetItemStatus type="connector" :target="row" />
           </template>
         </el-table-column>
+        <el-table-column prop="enable" :label="$t('Base.isEnabled')" :min-width="92">
+          <template #default="{ row }">
+            <OperateWebhookAssociatedPopover
+              :disabled="!judgeIsWebhookConnector(row)"
+              :name="row.name"
+              :operation="`${t('Base.enable')}${tl('or')}${t('Base.disable')}`"
+              :targetLabel="tl('action')"
+            >
+              <el-switch
+                :model-value="row.enable"
+                :disabled="judgeIsWebhookConnector(row)"
+                @update:modelValue="enableOrDisableConnector(row)"
+              />
+            </OperateWebhookAssociatedPopover>
+          </template>
+        </el-table-column>
         <!-- <el-table-column :label="tl('associativeDataBridge')">
           <template #default="{ row }"> TODO:{{ row.XXXXXXX }} </template>
         </el-table-column> -->
@@ -74,8 +90,6 @@
                 >
                   {{ $t('Base.setting') }}
                 </el-button>
-                <!-- TODO:disable del -->
-                <!-- :disable-del="row.XXXXXX" -->
                 <OperateWebhookAssociatedPopover
                   :disabled="!judgeIsWebhookConnector(row)"
                   :name="row.name"
@@ -113,8 +127,8 @@
 
 <script setup lang="ts">
 import { useBridgeTypeIcon, useConnectorTypeValue } from '@/hooks/Rule/bridge/useBridgeTypeValue'
-import useHandleConnectorItem from '@/hooks/Rule/connector/useHandleConnectorItem'
 import useConnectorList from '@/hooks/Rule/connector/useConnectorList'
+import useHandleConnectorItem from '@/hooks/Rule/connector/useHandleConnectorItem'
 import useWebhookUtils from '@/hooks/Webhook/useWebhookUtils'
 import useI18nTl from '@/hooks/useI18nTl'
 import { BridgeType, ConnectionStatus } from '@/types/enum'
@@ -162,6 +176,7 @@ const isErrorStatus = ({ status }: Connector) =>
 const {
   handleDeleteConnector,
   reconnectConnector,
+  toggleConnectorEnable,
   showDelTip,
   currentDelName,
   showDeleteWebhookAssociatedTip,
@@ -187,6 +202,14 @@ const getDetailPageRoute = ({ id }: Connector) => ({
   params: { id },
 })
 
+const enableOrDisableConnector = async ({ enable, id }: Connector) => {
+  try {
+    await toggleConnectorEnable(id, !enable, getList)
+  } catch (error) {
+    //
+  }
+}
+
 const showCreateRuleDialog = ref(false)
 const createdConnector = ref<undefined | Connector>(undefined)
 const createRuleWithConnector = async (connector: Connector) => {

src/views/RuleEngine/Connector/ConnectorDetail.vue

@@ -15,6 +15,17 @@
           </div>
         </div>
         <div>
+          <el-tooltip
+            :content="connectorData.enable ? $t('Base.disable') : $t('Base.enable')"
+            placement="top"
+          >
+            <el-switch
+              class="enable-btn"
+              :model-value="connectorData.enable"
+              :disabled="isWebhookConnector"
+              @update:modelValue="enableOrDisableConnector"
+            />
+          </el-tooltip>
           <el-tooltip :content="$t('Base.delete')" placement="top">
             <el-button
               class="icon-button"
@@ -183,6 +194,7 @@ const { getTypeStr } = useConnectorTypeValue()
 const {
   getConnectorDetail,
   updateConnector,
+  toggleConnectorEnable,
   isTesting,
   testConnectivity,
   handleDeleteConnector,
@@ -229,6 +241,17 @@ const handleTest = async () => {
   }
 }
 
+const enableOrDisableConnector = async () => {
+  try {
+    const targetValue = !connectorData.value.enable
+    await toggleConnectorEnable(id.value, targetValue, () => {
+      connectorData.value.enable = targetValue
+    })
+  } catch (error) {
+    //
+  }
+}
+
 const { handleConnectorDataForSaveAsCopy } = useConnectorDataHandler()
 const { pwdErrorWhenCoping, checkLikePwdField } = useCheckBeforeSaveAsCopy()
 const saveAsCopy = async () => {