From 8ce492cee8995de53446b57c23eda3d3f1c90025 Mon Sep 17 00:00:00 2001
From: Frost-ZX <30585462+Frost-ZX@users.noreply.github.com>
Date: Wed, 10 Feb 2021 01:31:50 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=A0=E5=85=A5=E5=B0=8F=E5=B7=A5=E5=85=B7?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=EF=BC=88=E7=A9=BA=E7=99=BD=EF=BC=89=E3=80=81?=
 =?UTF-8?q?=E8=AE=BE=E7=BD=AE=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/routes.js   | 15 ++++++----
 src/views/Settings.vue | 65 ++++++++++++++++++++++++++++++++++++++++++
 src/views/Tools.vue    | 25 ++++++++++++++++
 3 files changed, 100 insertions(+), 5 deletions(-)
 create mode 100644 src/views/Settings.vue
 create mode 100644 src/views/Tools.vue

diff --git a/src/router/routes.js b/src/router/routes.js
index acb1d6f..d02c26a 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -6,11 +6,16 @@ const routes = [
         name: 'Home',
         component: Home
     },
-    // {
-    //     path: '/about',
-    //     name: 'About',
-    //     component: () => import('@/views/About.vue')
-    // }
+    {
+        path: '/tools',
+        name: 'Tools',
+        component: () => import('@/views/Tools.vue')
+    },
+    {
+        path: '/settings',
+        name: 'Settings',
+        component: () => import('@/views/Settings.vue')
+    }
 ];
 
 export default routes;
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
new file mode 100644
index 0000000..bcf6705
--- /dev/null
+++ b/src/views/Settings.vue
@@ -0,0 +1,65 @@
+<template>
+    <el-container class="settings">
+        <div class="wrapper shadow-2">
+
+            <el-form label-position="left" label-width="7rem">
+
+                <el-form-item label="字体大小">
+                    <el-input-number v-model="config.fontSize"
+                        :min="12" :max="32" label="字体大小" size="small"
+                    ></el-input-number>
+                </el-form-item>
+
+                <el-form-item label="显示网站标题">
+                    <el-switch v-model="config.showSiteTitle"></el-switch>
+                </el-form-item>
+
+                <el-form-item label="折叠侧边菜单">
+                    <el-switch v-model="config.sideMenuCollapse"></el-switch>
+                </el-form-item>
+
+            </el-form>
+
+        </div>
+    </el-container>
+</template>
+
+<script>
+export default {
+    name: 'Settings',
+    data() {
+        return {
+            config: this.$root.config.storage,
+            utils: this.$root.utils
+        }
+    },
+    beforeRouteEnter(to, from, next) {
+        next(vm => {
+            vm.utils.changeTitle('设置');
+        });
+    }
+}
+</script>
+
+<style lang="less" scoped>
+.settings {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 2rem;
+    background-color: @colorWhite;
+
+    .wrapper {
+        padding: 1.5rem 2rem;
+        width: 100%;
+        max-width: 50rem;
+        background-color: #FFF;
+    }
+
+    /deep/ .el-form-item {
+        .el-form-item__label {
+            font-weight: bold;
+        }
+    }
+}
+</style>
diff --git a/src/views/Tools.vue b/src/views/Tools.vue
new file mode 100644
index 0000000..1ca6849
--- /dev/null
+++ b/src/views/Tools.vue
@@ -0,0 +1,25 @@
+<template>
+    <el-container class="tools">
+
+    </el-container>
+</template>
+
+<script>
+export default {
+    name: 'Tools',
+    data() {
+        return {
+            utils: this.$root.utils
+        };
+    },
+    beforeRouteEnter(to, from, next) {
+        next(vm => {
+            vm.utils.changeTitle('小工具');
+        });
+    }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>