feat: 扫描整理支持中止；存放目录始终创建 KMP已整理 层

frontend/src/views/Scan.vue

@@ -13,7 +13,7 @@
                 <p><b>会移动文件，整理前请先备份！</b></p>
                 <ul>
                     <li>程序将<b>递归扫描</b>扫描目录下的全部文件，图片/视频/音频会被探测并按规则归类移动</li>
-                    <li>归类后的文件<b>移动</b>到「存放目录」下的分类子目录（未填写时默认在扫描目录下创建 <b>KMP已整理</b> 文件夹）</li>
+                    <li>归类后的文件<b>移动</b>到「存放目录」下的 <b>KMP已整理</b> 分类子目录（未填写时默认在扫描目录下创建 <b>KMP已整理</b> 文件夹）</li>
                     <li>跨磁盘（移动失败时）自动降级为<b>复制后删除</b>，原文件仍会从源目录移除</li>
                     <li>与库中已有记录 <b>MD5 相同的重复文件</b>会被移动到「重复文件」目录</li>
                     <li>无法读取/不支持的格式会被移动到「读取异常」「已忽略」目录</li>
@@ -67,9 +67,24 @@
                         :percentage="status.progress"
                         :stroke-width="14"
                         :status="status.progress >= 100 ? 'success' : ''"/>
+                <el-button
+                        type="danger"
+                        size="small"
+                        plain
+                        icon="el-icon-switch-button"
+                        :loading="cancelling"
+                        @click="handleCancel">中止扫描</el-button>
             </div>
         </div>
 
+        <el-alert
+                v-if="status.state === 'cancelled'"
+                title="扫描已中止"
+                type="warning"
+                :description="status.message"
+                show-icon
+                :closable="false"
+                class="state-alert"/>
         <el-alert
                 v-if="status.state === 'done'"
                 title="扫描整理完成"
@@ -177,6 +192,7 @@ export default {
         return {
             // ---------- 开始扫描 ----------
             starting: false,                                  // 点完按钮后、等后端回话前的"转圈"
+            cancelling: false,                                // 点完「中止扫描」后等后端确认的"转圈"
             scanDir: localStorage.getItem('scan-dir') || '',  // 要扫描的目录（记住上次填的）
             destDir: localStorage.getItem('scan-dest-dir') || '', // 整理后文件放哪（记住上次填的）
 
@@ -276,9 +292,13 @@ export default {
             if (isRunning && data.lines && data.lines.length !== prevLineCount) {
                 this.scrollBottom()
             }
-            // 从"运行中"变到"结束"（完成或出错）时，弹个提示
+            // 从"运行中"变到"结束"（完成/出错/中止）时，弹个提示
             if (wasRunning && !isRunning) {
-                this.$message.success(data.message || '扫描完成')
+                if (data.state === 'cancelled') {
+                    this.$message.warning(data.message || '扫描已中止')
+                } else {
+                    this.$message.success(data.message || '扫描完成')
+                }
             }
         },
 
@@ -389,6 +409,18 @@ export default {
             }
         },
 
+        // 中止当前扫描：后端取消上下文后，各环节会在最近的检查点停下
+        async handleCancel() {
+            this.cancelling = true
+            try {
+                const res = await request.post('/api/scan/cancel')
+                this.applyStatus(res.data)
+                this.$message.warning('已请求中止，正在停止…')
+            } finally {
+                this.cancelling = false
+            }
+        },
+
         // ==================== 目录选择弹窗 ====================
 
         // 打开弹窗；target 决定这次选的是"扫描目录"还是"存放目录"