fix Bug or esLink formatting

src/views/setting/account/account.vue

@@ -4,10 +4,11 @@
       <n-grid-item span="6">
         <n-card :bordered="false" size="small" class="proCard">
           <n-thing
-              class="thing-cell"
-              v-for="item in typeTabList" :key="item.key"
-              :class="{'thing-cell-on':type===item.key}"
-              @click="switchType(item)"
+            class="thing-cell"
+            v-for="item in typeTabList"
+            :key="item.key"
+            :class="{ 'thing-cell-on': type === item.key }"
+            @click="switchType(item)"
           >
             <template #header>{{ item.name }}</template>
             <template #description>{{ item.desc }}</template>
@@ -16,73 +17,72 @@
       </n-grid-item>
       <n-grid-item span="18">
         <n-card :bordered="false" size="small" :title="typeTitle" class="proCard">
-          <BasicSetting v-if="type === 1"></BasicSetting>
-          <SafetySetting v-if="type === 2"></SafetySetting>
+          <BasicSetting v-if="type === 1" />
+          <SafetySetting v-if="type === 2" />
         </n-card>
       </n-grid-item>
     </n-grid>
   </div>
 </template>
 <script lang="ts">
-import { defineComponent, reactive, toRefs } from 'vue'
-import BasicSetting from "./BasicSetting.vue"
-import SafetySetting from "./SafetySetting.vue"
+  import { defineComponent, reactive, toRefs } from 'vue';
+  import BasicSetting from './BasicSetting.vue';
+  import SafetySetting from './SafetySetting.vue';
 
+  const typeTabList = [
+    {
+      name: '基本设置',
+      desc: '个人账户信息设置',
+      key: 1,
+    },
+    {
+      name: '安全设置',
+      desc: '密码，邮箱等设置',
+      key: 2,
+    },
+  ];
+  export default defineComponent({
+    components: { BasicSetting, SafetySetting },
+    setup() {
+      const state = reactive({
+        type: 1,
+        typeTitle: '基本设置',
+      });
 
-const typeTabList = [
-  {
-    name: '基本设置',
-    desc: '个人账户信息设置',
-    key: 1
-  },
-  {
-    name: '安全设置',
-    desc: '密码，邮箱等设置',
-    key: 2
-  }
-]
-export default defineComponent({
-  components: { BasicSetting, SafetySetting },
-  setup() {
-    const state = reactive({
-      type: 1,
-      typeTitle: '基本设置'
-    })
+      function switchType(e) {
+        state.type = e.key;
+        state.typeTitle = e.name;
+      }
 
-    function switchType(e) {
-      state.type = e.key
-      state.typeTitle = e.name
-    }
-
-    return {
-      ...toRefs(state),
-      switchType,
-      typeTabList
-    }
-  }
-})
+      return {
+        ...toRefs(state),
+        switchType,
+        typeTabList,
+      };
+    },
+  });
 </script>
 <style lang="less" scoped>
-.thing-cell {
-  margin: 0 -16px 10px;
-  padding: 5px 16px;
+  .thing-cell {
+    margin: 0 -16px 10px;
+    padding: 5px 16px;
 
-  &:hover {
-    background: #f3f3f3;
-    cursor: pointer
-  }
-}
-
-.thing-cell-on {
-  background: #f0faff;
-  color: #2d8cf0;
-
-  ::v-deep(.n-thing-main .n-thing-header .n-thing-header__title) {
-    color: #2d8cf0
+    &:hover {
+      background: #f3f3f3;
+      cursor: pointer;
+    }
   }
 
-  &:hover {
+  .thing-cell-on {
     background: #f0faff;
+    color: #2d8cf0;
+
+    ::v-deep(.n-thing-main .n-thing-header .n-thing-header__title) {
+      color: #2d8cf0;
+    }
+
+    &:hover {
+      background: #f0faff;
+    }
   }
-}
 </style>