feat: add clean command history

Author: tiny-craft

backend/services/connection_service.go

@@ -1040,6 +1040,7 @@ func (c *connectionService) RenameKey(connName string, db int, key, newKey strin
 	return
 }
 
+// GetCmdHistory get redis command history
 func (c *connectionService) GetCmdHistory(pageNo, pageSize int) (resp types.JSResp) {
 	resp.Success = true
 	if pageSize <= 0 || pageNo <= 0 {
@@ -1062,6 +1063,13 @@ func (c *connectionService) GetCmdHistory(pageNo, pageSize int) (resp types.JSRe
 	return
 }
 
+// CleanCmdHistory clean redis command history
+func (c *connectionService) CleanCmdHistory() (resp types.JSResp) {
+	c.cmdHistory = []cmdHistoryItem{}
+	resp.Success = true
+	return
+}
+
 // update or insert key info to database
 //func (c *connectionService) updateDBKey(connName string, db int, keys []string, separator string) {
 //	dbStruct := map[string]any{}

frontend/src/components/content/ContentLogPane.vue

@@ -5,6 +5,7 @@ import Refresh from '@/components/icons/Refresh.vue'
 import useConnectionStore from 'stores/connections.js'
 import { map, uniqBy } from 'lodash'
 import { useI18n } from 'vue-i18n'
+import Delete from '@/components/icons/Delete.vue'
 import dayjs from 'dayjs'
 
 const connectionStore = useConnectionStore()
@@ -43,6 +44,20 @@ const loadHistory = () => {
         })
 }
 
+const cleanHistory = async () => {
+    $dialog.warning(i18n.t('confirm_clean_log'), () => {
+        data.loading = true
+        connectionStore.cleanCmdHistory().then((success) => {
+            if (success) {
+                data.history = []
+                data.loading = false
+                tableRef.value?.scrollTo({ top: 0 })
+                $message.success(i18n.t('success'))
+            }
+        })
+    })
+}
+
 defineExpose({
     refresh: () => nextTick().then(loadHistory),
 })
@@ -67,6 +82,9 @@ defineExpose({
             <n-form-item label="&nbsp;">
                 <icon-button :icon="Refresh" border t-tooltip="refresh" @click="loadHistory" />
             </n-form-item>
+            <n-form-item label="&nbsp;">
+                <icon-button :icon="Delete" border t-tooltip="clean_log" @click="cleanHistory" />
+            </n-form-item>
         </n-form>
         <div class="fill-height flex-box-h" style="user-select: text">
             <n-data-table
@@ -81,7 +99,7 @@ defineExpose({
                         align: 'center',
                         titleAlign: 'center',
                         render({ timestamp }, index) {
-                            return dayjs(timestamp).locale('zh-cn').format('YYYY-MM-DD hh:mm:ss')
+                            return dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')
                         },
                     },
                     {

frontend/src/langs/en.json

@@ -159,6 +159,8 @@
   "launch_log": "Launch Log",
   "filter_server": "Filter Server",
   "filter_keyword": "Filter Keyword",
+  "clean_log": "Clean Launch Log",
+  "confirm_clean_log": "Confirm clean launch log",
   "exec_time": "Exec Time",
   "cmd": "Command",
   "cost_time": "Cost"

frontend/src/langs/zh-cn.json

@@ -159,6 +159,8 @@
   "launch_log": "运行日志",
   "filter_server": "筛选服务器",
   "filter_keyword": "筛选关键字",
+  "clean_log": "清空运行日志",
+  "confirm_clean_log": "确定清空运行日志",
   "exec_time": "执行时间",
   "cmd": "命令",
   "cost_time": "耗时"

frontend/src/stores/connections.js

@@ -5,6 +5,7 @@ import {
     AddListItem,
     AddStreamValue,
     AddZSetValue,
+    CleanCmdHistory,
     CloseConnection,
     CreateGroup,
     DeleteConnection,
@@ -1423,6 +1424,19 @@ const useConnectionStore = defineStore('connections', {
             }
         },
 
+        /**
+         * clean cmd history
+         * @return {Promise<boolean>}
+         */
+        async cleanCmdHistory() {
+            try {
+                const { success } = await CleanCmdHistory()
+                return success === true
+            } catch {
+                return false
+            }
+        },
+
         /**
          * get key filter pattern and filter type
          * @param {string} server

frontend/src/utils/discrete.js

@@ -12,8 +12,8 @@ function setupMessage(message) {
         info: (content, option = null) => {
             return message.info(content, option)
         },
-        loading: (content, option = null) => {
-            option.duration = option.duration || 30000
+        loading: (content, option = {}) => {
+            option.duration = option.duration != null ? option.duration : 30000
             option.keepAliveOnHover = option.keepAliveOnHover !== undefined ? option.keepAliveOnHover : true
             return message.loading(content, option)
         },
@@ -28,20 +28,24 @@ function setupMessage(message) {
 
 function setupNotification(notification) {
     return {
-        error: (content, option = null) => {
+        error: (content, option = {}) => {
+            option.content = content
             option.title = option.title || i18nGlobal.t('error')
-            return notification.error(content, option)
+            return notification.error(option)
         },
-        info: (content, option = null) => {
-            return notification.info(content, option)
+        info: (content, option = {}) => {
+            option.content = content
+            return notification.info(option)
         },
-        success: (content, option = null) => {
+        success: (content, option = {}) => {
+            option.content = content
             option.title = option.title || i18nGlobal.t('success')
-            return notification.success(content, option)
+            return notification.success(option)
         },
-        warning: (content, option = null) => {
+        warning: (content, option = {}) => {
+            option.content = content
             option.title = option.title || i18nGlobal.t('warning')
-            return notification.warning(content, option)
+            return notification.warning(option)
         },
     }
 }
@@ -81,6 +85,7 @@ export async function setupDiscreteApi() {
             placement: 'bottom-right',
         },
         notificationProviderProps: {
+            max: 5,
             placement: 'top-right',
             keepAliveOnHover: true,
         },