🚸 当允许点击外部关闭时增加关闭按钮

close #201

src/components/func/dialog.vue

@@ -29,6 +29,9 @@
               {{ data.confirmLabel }}
             </button>
           </div>
+          <div v-if="!!data.otcancel" class="dialog-close-btn" title="关闭" @click="handleOuter">
+            x
+          </div>
         </div>
       </transition>
     </div>
@@ -238,6 +241,7 @@ defineExpose({ displayInputBox, displayCheckBox });
 }
 
 .dialog-box {
+  position: relative;
   display: flex;
   width: 520px;
   height: 240px;
@@ -312,6 +316,26 @@ defineExpose({ displayInputBox, displayCheckBox });
   font-size: 20px;
 }
 
+.dialog-close-btn {
+  position: absolute;
+  right: 50%;
+  bottom: -40px;
+  display: flex;
+  width: 24px;
+  height: 24px;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  background: var(--dialog-title);
+  color: var(--tgc-yellow-3);
+  cursor: pointer;
+  font-family: var(--font-title);
+  font-size: 16px;
+  line-height: 24px;
+  transform: translateX(50%);
+  user-select: none;
+}
+
 .no-btn {
   border: 1px solid var(--tgc-yellow-1);
 }

src/pages/common/PageConfig.vue

@@ -228,7 +228,11 @@ onMounted(async () => {
 
 // 备份数据
 async function confirmBackup(): Promise<void> {
-  const bcCheck = await showDialog.check("是否备份到默认路径", "取消则自选路径，点击外部不做处理");
+  const bcCheck = await showDialog.checkF({
+    title: "是否备份到默认路径",
+    text: `${userDir.value}`,
+    cancelLabel: "自选路径",
+  });
   if (bcCheck === undefined) {
     showSnackbar.cancel("已取消备份");
     return;