feat: add pinUpdatesOnTop option to always show plugin updates at top

Author: Test User

dashboard/src/i18n/locales/en-US/features/extension.json

@@ -144,7 +144,8 @@
     "updated": "Last Updated",
     "updateStatus": "Update Status",
     "ascending": "Ascending",
-    "descending": "Descending"
+    "descending": "Descending",
+    "pinUpdatesOnTop": "Pin Updates on Top"
   },
   "tags": {
     "danger": "Danger"

dashboard/src/i18n/locales/ru-RU/features/extension.json

@@ -1,4 +1,4 @@
-{
+{
     "title": "Плагины",
     "subtitle": "Управление и настройка расширений системы",
     "tabs": {
@@ -143,7 +143,8 @@
         "updated": "Дате обновления",
         "updateStatus": "Статусу обновления",
         "ascending": "По возрастанию",
-        "descending": "По убыванию"
+        "descending": "По убыванию",
+        "pinUpdatesOnTop": "Обновления сверху"
     },
     "tags": {
         "danger": "Опасно"

dashboard/src/i18n/locales/zh-CN/features/extension.json

@@ -147,7 +147,8 @@
     "updated": "更新时间",
     "updateStatus": "更新状态",
     "ascending": "升序",
-    "descending": "降序"
+    "descending": "降序",
+    "pinUpdatesOnTop": "有更新置顶"
   },
   "tags": {
     "danger": "危险"

dashboard/src/views/extension/InstalledPluginsTab.vue

@@ -354,6 +354,15 @@ const pinnedPlugins = computed(() => {
                       :show-order="installedSortUsesOrder"
                       @update:order="installedSortOrder = $event"
                     />
+                    <v-switch
+                      v-model="pinUpdatesOnTop"
+                      :label="tm('sort.pinUpdatesOnTop')"
+                      color="primary"
+                      density="compact"
+                      hide-details
+                      class="ml-4"
+                      style="max-width: 160px"
+                    />
                   </div>
                 </div>
               </v-col>

dashboard/src/views/extension/useExtensionPage.js

@@ -188,6 +188,7 @@ export const useExtensionPage = () => {
   const installedStatusFilter = ref("all");
   const installedSortBy = ref("default");
   const installedSortOrder = ref("desc");
+  const pinUpdatesOnTop = ref(true);
   const loading_ = ref(false);
 
   // 分页相关
@@ -441,6 +442,17 @@ export const useExtensionPage = () => {
         const fallbackResult =
           fallbackNameCompare !== 0 ? fallbackNameCompare : left.index - right.index;
 
+        if (
+          pinUpdatesOnTop.value &&
+          installedSortBy.value !== "update_status"
+        ) {
+          const leftHasUpdate = left.plugin?.has_update ? 1 : 0;
+          const rightHasUpdate = right.plugin?.has_update ? 1 : 0;
+          if (leftHasUpdate !== rightHasUpdate) {
+            return rightHasUpdate - leftHasUpdate;
+          }
+        }
+
         if (installedSortBy.value === "install_time") {
           const leftTimestamp = left.installedAtTimestamp;
           const rightTimestamp = right.installedAtTimestamp;
@@ -1695,6 +1707,7 @@ export const useExtensionPage = () => {
     installedStatusFilter,
     installedSortBy,
     installedSortOrder,
+    pinUpdatesOnTop,
     loading_,
     currentPage,
     marketCategoryFilter,