add client group

frontend/src/layouts/modals/Client.vue

@@ -21,6 +21,9 @@
                 <v-col cols="12" sm="6" md="4">
                   <v-switch color="primary" v-model="client.enable" :label="$t('enable')" hide-details></v-switch>
                 </v-col>
+                <v-col cols="12" sm="6" md="4">
+                  <v-combobox v-model="client.group" :items="groups" :label="$t('client.group')" hide-details></v-combobox>
+                </v-col>
               </v-row>
               <v-row>
                 <v-col cols="12" sm="6" md="4">
@@ -186,7 +189,7 @@ import DatePick from '@/components/DateTime.vue'
 import { HumanReadable } from '@/plugins/utils'
 
 export default {
-  props: ['visible', 'data', 'index', 'inboundTags', 'stats'],
+  props: ['visible', 'data', 'index', 'inboundTags', 'groups', 'stats'],
   emits: ['close', 'save'],
   data() {
     return {

frontend/src/locales/en.ts

@@ -157,6 +157,7 @@ export default {
   client: {
     name: "Name",
     desc: "Description",
+    group: "Group",
     inboundTags: "Inbound Tags",
     basics: "Basics",
     config: "Config",

frontend/src/locales/fa.ts

@@ -156,6 +156,7 @@ export default {
   client: {
     name: "نام",
     desc: "شرح",
+    group: "گروه",
     inboundTags: "برچسب‌های ورودی",
     basics: "پایه",
     config: "تنظیم",

frontend/src/locales/vi.ts

@@ -157,6 +157,7 @@ export default {
   client: {
     name: "Tên",
     desc: "Mô tả",
+    group: "Nhóm",
     inboundTags: "Thẻ đầu vào",
     basics: "Cơ bản",
     config: "Cấu hình",

frontend/src/locales/zhcn.ts

@@ -157,6 +157,7 @@ export default {
   client: {
     name: "名称",
     desc: "描述",
+    group: "组",
     inboundTags: "入站标签",
     basics: "基础",
     config: "配置",

frontend/src/locales/zhtw.ts

@@ -158,6 +158,7 @@ export default {
   client: {
     name: "名稱",
     desc: "描述",
+    group: "組",
     inboundTags: "入站標簽",
     basics: "基礎",
     config: "配置",

frontend/src/types/clients.ts

@@ -13,6 +13,7 @@ export interface Client {
   up: number
   down: number
   desc: string
+  group: string
 }
 
 const defaultClient: Client = {
@@ -26,6 +27,7 @@ const defaultClient: Client = {
   up: 0,
   down: 0,
   desc: "",
+  group: "",
 }
 
 type Config = {

frontend/src/views/Clients.vue

@@ -5,6 +5,7 @@
     :visible="modal.visible"
     :index="modal.index"
     :data="modal.data"
+    :groups="groups"
     :stats="modal.stats"
     :inboundTags="inboundTags"
     @close="closeModal"
@@ -181,6 +182,10 @@ const inboundTags = computed((): string[] => {
   return inbounds.value?.filter(i => i.tag != "" && Object.hasOwn(i,'users')).map(i => i.tag)
 })
 
+const groups = computed((): string[] => {
+  if (!clients.value) return []
+  return Array.from(new Set(clients.value?.map(c => c.group)))
+})
 const filter = ref("")
 
 const filterItems = [