From 82e7fe4a87424d377f21c251c75018e1ac6078ca Mon Sep 17 00:00:00 2001
From: qiin2333 <414382190@qq.com>
Date: Tue, 15 Oct 2024 17:51:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=BA=94=E7=94=A8=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E5=8F=AF=E6=8B=96=E5=8A=A8=E6=8E=92=E5=BA=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                           | 11 ++++++----
 src_assets/common/assets/web/apps.html | 30 +++++++++++++++-----------
 2 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/package.json b/package.json
index 297c6b27398..a982e25e261 100644
--- a/package.json
+++ b/package.json
@@ -7,12 +7,15 @@
   "dependencies": {
     "@fortawesome/fontawesome-free": "6.6.0",
     "@popperjs/core": "2.11.8",
-    "@vitejs/plugin-vue": "4.6.2",
     "bootstrap": "5.3.3",
-    "vite": "4.5.2",
-    "vite-plugin-ejs": "1.6.4",
+    "nanoid": "^5.0.7",
     "vue": "3.4.38",
     "vue-i18n": "9.14.0",
-    "nanoid": "^5.0.7"
+    "vuedraggable": "^4.1.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "4.6.2",
+    "vite": "4.5.2",
+    "vite-plugin-ejs": "1.6.4"
   }
 }
diff --git a/src_assets/common/assets/web/apps.html b/src_assets/common/assets/web/apps.html
index 53c24c8f2b0..569480b8b4c 100644
--- a/src_assets/common/assets/web/apps.html
+++ b/src_assets/common/assets/web/apps.html
@@ -86,17 +86,21 @@ <h1>{{ $t('apps.applications_title') }}</h1>
           </tr>
         </thead>
         <tbody>
-          <tr v-for="(app,i) in apps" :key="i">
-            <td>{{app.name}}</td>
-            <td>
-              <button class="btn btn-primary mx-1" @click="editApp(i)">
-                <i class="fas fa-edit"></i> {{ $t('apps.edit') }}
-              </button>
-              <button class="btn btn-danger mx-1" @click="showDeleteForm(i)">
-                <i class="fas fa-trash"></i> {{ $t('apps.delete') }}
-              </button>
-            </td>
-          </tr>
+          <draggable v-model="apps">
+            <template #item="{app, i}">
+              <tr style="cursor: move;">
+                <td>{{app.name}}</td>
+                <td>
+                  <button class="btn btn-primary mx-1" @click="editApp(i)">
+                    <i class="fas fa-edit"></i> {{ $t('apps.edit') }}
+                  </button>
+                  <button class="btn btn-danger mx-1" @click="showDeleteForm(i)">
+                    <i class="fas fa-trash"></i> {{ $t('apps.delete') }}
+                  </button>
+                </td>
+              </tr>
+            </template>
+          </draggable>
         </tbody>
       </table>
     </div>
@@ -420,11 +424,13 @@ <h4>{{ $t('apps.env_vars_about') }}</h4>
   import {initApp} from './init'
   import Navbar from './Navbar.vue'
   import {Dropdown} from 'bootstrap/dist/js/bootstrap'
+  import draggable from 'vuedraggable'
   import {nanoid} from 'nanoid'
 
   const app = createApp({
     components: {
-      Navbar
+      Navbar,
+      draggable,
     },
     data() {
       return {