fix drag handle

src/components/misc/DashboardElement.vue

@@ -33,7 +33,12 @@ const props = defineProps({
   <!-- 插件仪表板 -->
   <VCard v-else-if="!isNullOrEmptyObject(props.config)">
     <VCardItem>
-      <VCardTitle class="cursor-move">{{ props.config?.name }}</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>
+        {{ props.config?.name }}
+      </VCardTitle>
     </VCardItem>
     <VCardItem>
       <DashboardRender v-for="(item, index) in props.config?.elements" :key="index" :config="item" />

src/pages/dashboard.vue

@@ -221,6 +221,12 @@ function dragOrderEnd() {
   saveDashboardConfig()
 }
 
+// 拖动排序开始
+function dragOrderBegin() {
+  // 如果是移动端则取消
+  if (!display.mdAndUp.value) return false
+}
+
 onBeforeMount(async () => {
   await loadDashboardConfig()
   getDashboardPlugins()
@@ -232,6 +238,8 @@ onBeforeMount(async () => {
   <draggable
     v-model="dashboardConfigs"
     @end="dragOrderEnd"
+    :move="dragOrderBegin"
+    handle=".cursor-move"
     item-key="id"
     tag="VRow"
     :component-data="{ 'class': 'match-height' }"

src/views/dashboard/AnalyticsCpu.vue

@@ -125,7 +125,10 @@ onUnmounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">CPU</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>CPU</VCardTitle>
     </VCardItem>
     <VCardText>
       <VueApexCharts type="line" :options="chartOptions" :series="series" :height="150" />

src/views/dashboard/AnalyticsMediaStatistic.vue

@@ -55,7 +55,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">媒体统计</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>媒体统计</VCardTitle>
     </VCardItem>
 
     <VCardText>

src/views/dashboard/AnalyticsMemory.vue

@@ -131,7 +131,10 @@ onUnmounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">内存</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>内存</VCardTitle>
     </VCardItem>
     <VCardText>
       <VueApexCharts type="area" :options="chartOptions" :series="series" :height="150" />

src/views/dashboard/AnalyticsProcesses.vue

@@ -44,7 +44,10 @@ onUnmounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">系统进程</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>系统进程</VCardTitle>
     </VCardItem>
     <VTable item-key="fullName" class="table-rounded" hide-default-footer disable-sort>
       <thead>

src/views/dashboard/AnalyticsScheduler.vue

@@ -40,7 +40,10 @@ onUnmounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">后台任务</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>后台任务</VCardTitle>
     </VCardItem>
 
     <VCardText>

src/views/dashboard/AnalyticsSpeed.vue

@@ -82,7 +82,10 @@ onUnmounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">实时速率</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>实时速率</VCardTitle>
     </VCardItem>
 
     <VCardText class="pt-4">

src/views/dashboard/AnalyticsStorage.vue

@@ -41,7 +41,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">存储空间</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>存储空间</VCardTitle>
     </VCardItem>
     <VCardText>
       <h5 class="text-2xl font-weight-medium text-primary">

src/views/dashboard/AnalyticsWeeklyOverview.vue

@@ -112,7 +112,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">最近入库</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>最近入库</VCardTitle>
     </VCardItem>
 
     <VCardText>

src/views/dashboard/MediaServerLatest.vue

@@ -23,7 +23,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">最近添加</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle >最近添加</VCardTitle>
     </VCardItem>
 
     <div v-if="latestList.length > 0" class="grid gap-4 grid-media-card mx-3 mb-3" tabindex="0">

src/views/dashboard/MediaServerLibrary.vue

@@ -23,7 +23,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">我的媒体库</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle >我的媒体库</VCardTitle>
     </VCardItem>
 
     <div v-if="libraryList.length > 0" class="grid gap-4 grid-backdrop-card mx-3" tabindex="0">

src/views/dashboard/MediaServerPlaying.vue

@@ -23,7 +23,10 @@ onMounted(() => {
 <template>
   <VCard>
     <VCardItem>
-      <VCardTitle class="cursor-move">继续观看</VCardTitle>
+      <template #append>
+        <VIcon class="cursor-move">mdi-drag</VIcon>
+      </template>
+      <VCardTitle>继续观看</VCardTitle>
     </VCardItem>
 
     <div v-if="playingList.length > 0" class="grid gap-4 grid-backdrop-card mx-3" tabindex="0">