feat: Add Relay server cmd

src/views/rustdesk/blacklist.vue

@@ -0,0 +1,93 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>BLACK_LIST</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-input type="textarea" :model-value="form.list.join('|')" :rows="5"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList">{{ T('Refresh') }}</el-button>
+        <el-button @click="showForm('add')" type="primary">{{ T('Add') }}</el-button>
+        <el-button @click="showForm('delete')" type="danger">{{ T('Delete') }}</el-button>
+      </el-form-item>
+    </el-form>
+    <el-dialog v-model="form.form_visible" :title="form.form_type">
+      <el-form label-width="100px">
+        <el-form-item label="IP">
+          <el-input v-model="form.form_input"></el-input>
+          <div>多个IP以 | 分割</div>
+          <div v-if="form.form_type==='delete'">, 全部填 <strong>all</strong></div>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="form.form_visible=false">{{ T('Cancel') }}</el-button>
+          <el-button @click="form.form_type === 'add' ? add() : remove()" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+
+  const RELAY_TARGET = '21117'
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    get_cmd: 'blacklist',
+    add_cmd: 'blacklist-add',
+    remove_cmd: 'blacklist-remove',
+    list: [],
+    target: RELAY_TARGET,
+    loading: false,
+    form_visible: false,
+    form_input: '',
+    form_type: '',
+  })
+  const getList = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: form.get_cmd, target: RELAY_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      form.list = res.data.split('\n').filter(i => i)
+    }
+  }
+  const showForm = (type) => {
+    form.form_visible = true
+    form.form_input = ''
+    form.form_type = type
+  }
+  const add = async () => {
+    const res = await sendCmd({ cmd: form.add_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const remove = async () => {
+    const res = await sendCmd({ cmd: form.remove_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      getList()
+    }
+  })
+
+
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/rustdesk/blocklist.vue

@@ -0,0 +1,93 @@
+<template>
+  <el-card class="simple-card" shadow="hover" v-loading="form.loading">
+    <template #header>
+      <div class="card-header">
+        <span>BLOCK_LIST</span>
+      </div>
+    </template>
+    <el-form :disabled="!canSend">
+      <el-form-item>
+        <el-input type="textarea" :model-value="form.list.join('|')" :rows="5"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getList">{{ T('Refresh') }}</el-button>
+        <el-button @click="showForm('add')" type="primary">{{ T('Add') }}</el-button>
+        <el-button @click="showForm('delete')" type="danger">{{ T('Delete') }}</el-button>
+      </el-form-item>
+    </el-form>
+    <el-dialog v-model="form.form_visible" :title="form.form_type">
+      <el-form label-width="100px">
+        <el-form-item label="IP">
+          <el-input v-model="form.form_input"></el-input>
+          <div>多个IP以 | 分割</div>
+          <div v-if="form.form_type==='delete'">, 全部填 <strong>all</strong></div>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="form.form_visible=false">{{ T('Cancel') }}</el-button>
+          <el-button @click="form.form_type === 'add' ? add() : remove()" type="primary">{{ T('Submit') }}</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
+  </el-card>
+</template>
+<script setup>
+
+  import { T } from '@/utils/i18n'
+  import { reactive, watch } from 'vue'
+  import { sendCmd } from '@/api/rustdesk'
+  import { ElMessage } from 'element-plus'
+
+  const RELAY_TARGET = '21117'
+  const props = defineProps({
+    canSend: Boolean,
+  })
+
+  const form = reactive({
+    get_cmd: 'blocklist',
+    add_cmd: 'blocklist-add',
+    remove_cmd: 'blocklist-remove',
+    list: [],
+    target: RELAY_TARGET,
+    loading: false,
+    form_visible: false,
+    form_input: '',
+    form_type: '',
+  })
+  const getList = async () => {
+    form.loading = true
+    const res = await sendCmd({ cmd: form.get_cmd, target: RELAY_TARGET }).catch(_ => false)
+    form.loading = false
+    if (res) {
+      form.list = res.data.split('\n').filter(i => i)
+    }
+  }
+  const showForm = (type) => {
+    form.form_visible = true
+    form.form_input = ''
+    form.form_type = type
+  }
+  const add = async () => {
+    const res = await sendCmd({ cmd: form.add_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  const remove = async () => {
+    const res = await sendCmd({ cmd: form.remove_cmd, option: form.form_input, target: RELAY_TARGET }).catch(_ => false)
+    if (res) {
+      ElMessage.success(T('OperationSuccess'))
+      getList()
+    }
+  }
+  watch(() => props.canSend, (v) => {
+    if (v) {
+      getList()
+    }
+  })
+
+
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/rustdesk/control.vue

@@ -2,10 +2,16 @@
   <div>
     <h4 v-html="T('ServerCmdTips', {wiki: '<a target=\'_blank\' href=\'https://github.com/lejianwen/rustdesk-api/wiki/Rustdesk-Command\'>WIKI</a>'})"></h4>
     <h5>
-      <span>{{ T('Status') }}: </span>
+      <span>ID {{ T('Status') }}: </span>
-      <el-tag v-if="canSendCmd" type="success">{{ T('Available') }}</el-tag>
+      <el-tag v-if="canSendIdServerCmd" type="success">{{ T('Available') }}</el-tag>
       <el-tag v-else type="danger">{{ T('NotAvailable') }}</el-tag>
-      <el-button size="small" type="text" @click="refreshCanSendCmd">{{ T('Refresh') }}</el-button>
+      <el-button size="small" type="text" @click="refreshCanSendIdServerCmd">{{ T('Refresh') }}</el-button>
+    </h5>
+    <h5>
+      <span>RELAY {{ T('Status') }}: </span>
+      <el-tag v-if="canSendRelayServerCmd" type="success">{{ T('Available') }}</el-tag>
+      <el-tag v-else type="danger">{{ T('NotAvailable') }}</el-tag>
+      <el-button size="small" type="text" @click="refreshCanSendRelayServerCmd">{{ T('Refresh') }}</el-button>
     </h5>
     <el-tabs
         v-model="activeName"
@@ -13,13 +19,13 @@
     >
       <el-tab-pane :label="T('Simple')" name="Simple">
         <el-space>
-          <el-card shadow="hover" style="width: 300px" v-loading="rsForm.loading">
+          <el-card class="simple-card" shadow="hover" v-loading="rsForm.loading">
             <template #header>
               <div class="card-header">
                 <span>RELAY_SERVERS</span>
               </div>
             </template>
-            <el-form :disabled="!canSendCmd">
+            <el-form :disabled="!canSendCmd(rsForm.target)">
               <el-form-item>
                 <el-input v-model="rsForm.option"></el-input>
               </el-form-item>
@@ -29,13 +35,13 @@
               </el-form-item>
             </el-form>
           </el-card>
-          <el-card shadow="hover" style="width: 300px">
+          <el-card class="simple-card" shadow="hover" v-loading="aurForm.loading">
             <template #header>
               <div class="card-header">
                 <span>ALWAYS_USE_RELAY</span>
               </div>
             </template>
-            <el-form :disabled="!canSendCmd">
+            <el-form :disabled="!canSendCmd(aurForm.target)">
               <el-form-item>
                 <el-switch v-model="aurForm.option" active-value="Y" inactive-value="N"></el-switch>
               </el-form-item>
@@ -45,6 +51,8 @@
               </el-form-item>
             </el-form>
           </el-card>
+          <blocklist :can-send="canSendCmd(RELAY_TARGET)"></blocklist>
+          <blacklist :can-send="canSendCmd(RELAY_TARGET)"></blacklist>
         </el-space>
 
 
@@ -55,7 +63,7 @@
             <el-form-item>
               <el-button type="primary" @click="handlerQuery">{{ T('Filter') }}</el-button>
               <el-button type="danger" @click="toAdd">{{ T('Add') }}</el-button>
-              <el-button type="success" :disabled="!canSendCmd" @click="showCmd({cmd:'',option:''})">{{ T('Send') }}</el-button>
+              <el-button type="success" :disabled="!canSendIdServerCmd" @click="showCmd({cmd:'',option:''})">{{ T('Send') }}</el-button>
             </el-form-item>
           </el-form>
         </el-card>
@@ -68,7 +76,7 @@
             <el-table-column prop="explain" label="explain" align="center"></el-table-column>
             <el-table-column label="actions" align="center">
               <template #default="{row}">
-                <el-button type="success" :disabled="!canSendCmd" @click="showCmd(row)">{{ T('SendCustom') }}</el-button>
+                <el-button type="success" :disabled="!canSendCmd(row.target)" @click="showCmd(row)">{{ T('Send') }}</el-button>
                 <el-button v-if="row.id" type="primary" @click="toUpdate(row)">{{ T('Edit') }}</el-button>
                 <el-button v-if="row.id" type="danger" @click="del(row)">{{ T('Delete') }}</el-button>
               </template>
@@ -86,6 +94,12 @@
               <el-form-item label="option">
                 <el-input v-model="formData.option"></el-input>
               </el-form-item>
+              <el-form-item label="target">
+                <el-radio-group v-model="formData.target">
+                  <el-radio label="id_server" value="21115"></el-radio>
+                  <el-radio label="relay_server" value="21117"></el-radio>
+                </el-radio-group>
+              </el-form-item>
               <el-form-item label="explain">
                 <el-input v-model="formData.explain"></el-input>
               </el-form-item>
@@ -97,7 +111,7 @@
           </el-dialog>
 
           <el-dialog :title="T('SendCmd')" v-model="showCmdForm">
-            <el-form label-width="150" :disabled="!canSendCmd">
+            <el-form label-width="150" :disabled="!canSendCmd(customCmd.target)">
               <el-form-item label="cmd">
                 <el-input v-model="customCmd.cmd"></el-input>
               </el-form-item>
@@ -107,6 +121,12 @@
                   <el-text type="primary">{{ customCmd.example }}</el-text>
                 </el-text>
               </el-form-item>
+              <!--              <el-form-item label="target">
+                              <el-radio-group v-model="customCmd.target">
+                                <el-radio label="id_server" value="21115"></el-radio>
+                                <el-radio label="relay_server" value="21117"></el-radio>
+                              </el-radio-group>
+                            </el-form-item>-->
               <el-form-item>
                 <el-button type="primary" @click="submitCmd">{{ T('Send') }}</el-button>
               </el-form-item>
@@ -128,32 +148,60 @@
   import { onMounted, reactive, ref } from 'vue'
   import { T } from '@/utils/i18n'
   import { ElMessage, ElMessageBox } from 'element-plus'
+  import blocklist from '@/views/rustdesk/blocklist.vue'
+  import blacklist from '@/views/rustdesk/blacklist.vue'
 
+  const ID_TARGET = '21115'
+  const RELAY_TARGET = '21117'
   const activeName = ref('Simple')
 
-  const canSendCmd = ref(false)
+  const canSendIdServerCmd = ref(false)
-  const checkCanSendCmd = async () => {
+  const checkCanSendIdServerCmd = async () => {
-    const res = await sendCmd({ cmd: 'h' }).catch(_ => false)
+    const res = await sendCmd({ cmd: 'h', target: ID_TARGET }).catch(_ => false)
-    canSendCmd.value = !!res.data
+    canSendIdServerCmd.value = !!res.data
   }
-  const refreshCanSendCmd = () => {
+  const refreshCanSendIdServerCmd = () => {
-    checkCanSendCmd().then(_ => {
+    checkCanSendIdServerCmd().then(_ => {
-      if (canSendCmd.value) {
+      if (canSendIdServerCmd.value) {
         getAUR()
         getRS()
       }
     })
   }
-  onMounted(refreshCanSendCmd)
+  onMounted(refreshCanSendIdServerCmd)
+
+  const canSendRelayServerCmd = ref(false)
+  const checkCanSendRelayServerCmd = async () => {
+    const res = await sendCmd({ cmd: 'h', target: RELAY_TARGET }).catch(_ => false)
+    canSendRelayServerCmd.value = !!res.data
+  }
+  const refreshCanSendRelayServerCmd = () => {
+    checkCanSendRelayServerCmd().then(_ => {
+      if (canSendRelayServerCmd.value) {
+      }
+    })
+  }
+  onMounted(refreshCanSendRelayServerCmd)
+
+  const canSendCmd = (target) => {
+    if (target === ID_TARGET) {
+      return canSendIdServerCmd.value
+    }
+    if (target === RELAY_TARGET) {
+      return canSendRelayServerCmd.value
+    }
+    return false
+  }
 
   const rsForm = reactive({
     cmd: 'rs',
     option: '',
+    target: ID_TARGET,
     loading: false,
   })
   const getRS = async () => {
     rsForm.loading = true
-    const res = await sendCmd({ cmd: 'rs' }).catch(_ => false)
+    const res = await sendCmd({ cmd: 'rs', target: ID_TARGET }).catch(_ => false)
     rsForm.loading = false
     if (res) {
       const data = res.data.split('\n').filter(i => i)
@@ -170,12 +218,13 @@
   const aurForm = reactive({
     cmd: 'aur',
     option: '',
+    target: ID_TARGET,
     value: 0,
     loading: false,
   })
   const getAUR = async () => {
     aurForm.loading = true
-    const res = await sendCmd({ cmd: 'aur' }).catch(_ => false)
+    const res = await sendCmd({ cmd: 'aur', target: ID_TARGET }).catch(_ => false)
     aurForm.loading = false
     if (res) {
       if (res.data === 'ALWAYS_USE_RELAY: true' || res.data === 'ALWAYS_USE_RELAY: true\n') {
@@ -236,6 +285,7 @@
     cmd: '',
     alias: '',
     option: '',
+    target: '',
     explain: '',
   })
   const formVisible = ref(false)
@@ -252,6 +302,7 @@
     formData.cmd = row.cmd
     formData.alias = row.alias
     formData.option = row.option
+    formData.target = row.target
     formData.explain = row.explain
   }
   const submit = async () => {
@@ -275,6 +326,7 @@
   const customCmd = reactive({
     cmd: '',
     option: '',
+    target: '',
     res: '',
     example: '',
   })
@@ -283,17 +335,23 @@
     customCmd.cmd = row.cmd
     customCmd.option = ''
     customCmd.res = ''
+    customCmd.target = row.target
     customCmd.example = `${row.cmd} ${row.option}`
   }
   const submitCmd = async () => {
     sendCmd(customCmd).then(res => {
       console.log(res)
       customCmd.res = res.data
+      ElMessage.success(T('OperationSuccess'))
     })
   }
 
 </script>
 
 <style scoped lang="scss">
-
+.simple-card {
+  width: 300px;
+  margin: 10px;
+  min-height: 300px;
+}
 </style>