init

src/App.vue

@@ -0,0 +1,51 @@
+<script setup>
+import uploadFileMiao from "./components/uploadFileMiao.vue";
+import downloadFileMiao from "./components/downloadFileMiao.vue";
+import settingMiao from "./components/setting.vue";
+
+
+</script>
+
+<template>
+    <div id="windows">
+        <n-notification-provider placement="bottom-right" :max="3">
+            <n-message-provider>
+                <n-card content-style="padding: 0; margin:0;" id="theCard">
+                    <n-tabs type="line" size="large" :tabs-padding="20" pane-style="padding: 20px;">
+                        <n-tab-pane name="上传文件">
+                            <uploadFileMiao style />
+                        </n-tab-pane>
+                        <n-tab-pane name="下载文件">
+                            <downloadFileMiao style/>
+                        </n-tab-pane>
+                        <n-tab-pane name="设置">
+                            <settingMiao style="max-width:100%" />
+                        </n-tab-pane>
+                    </n-tabs>
+                </n-card>
+            </n-message-provider>
+        </n-notification-provider>
+    </div>
+</template>
+
+<style scoped>
+#windows {
+    width: 100%;
+    height: 100%;
+    padding: 0%;
+    display: flex;
+    position: relative;
+    justify-content: center;
+    align-items: center;
+}
+#theCard {
+    width: 50%;
+    height: 80%;
+}
+@media screen and (max-width:768px) {
+    #theCard {
+        width: 100vw;
+        height: 100%;
+    }
+}
+</style>