fix: 🐛 代码规范检测问题修复

Former-commit-id: 6e75bc91ce33ea9e7a17fbcb896f086f768896f4
2023-04-15 23:51:27 +08:00
parent 5b033246bc
commit 0605f89a67
24 changed files with 440 additions and 450 deletions
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,16 +1,16 @@
 <script lang="ts">
-export default { name: 'Dashboard' };
+export default { name: "Dashboard" };
 </script>

 <script setup lang="ts">
-import { useUserStore } from '@/store/modules/user';
-import { useTransition, TransitionPresets } from '@vueuse/core';
+import { useUserStore } from "@/store/modules/user";
+import { useTransition, TransitionPresets } from "@vueuse/core";

-import GithubCorner from '@/components/GithubCorner/index.vue';
-import SvgIcon from '@/components/SvgIcon/index.vue';
-import BarChart from './components/BarChart.vue';
-import PieChart from './components/PieChart.vue';
-import RadarChart from './components/RadarChart.vue';
+import GithubCorner from "@/components/GithubCorner/index.vue";
+import SvgIcon from "@/components/SvgIcon/index.vue";
+import BarChart from "./components/BarChart.vue";
+import PieChart from "./components/PieChart.vue";
+import RadarChart from "./components/RadarChart.vue";

 const userStore = useUserStore();

@@ -18,15 +18,15 @@ const date: Date = new Date();

 const greetings = computed(() => {
  if (date.getHours() >= 6 && date.getHours() < 8) {
-    return '晨起披衣出草堂，轩窗已自喜微凉🌅！';
+    return "晨起披衣出草堂，轩窗已自喜微凉🌅！";
  } else if (date.getHours() >= 8 && date.getHours() < 12) {
-    return '上午好🌞！';
+    return "上午好🌞！";
  } else if (date.getHours() >= 12 && date.getHours() < 18) {
-    return '下午好☕！';
+    return "下午好☕！";
  } else if (date.getHours() >= 18 && date.getHours() < 24) {
-    return '晚上好🌃！';
+    return "晚上好🌃！";
  } else if (date.getHours() >= 0 && date.getHours() < 6) {
-    return '偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！';
+    return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
  }
 });

@@ -36,7 +36,7 @@ const duration = 5000;
 const amount = ref(0);
 const amountOutput = useTransition(amount, {
  duration: duration,
-  transition: TransitionPresets.easeOutExpo
+  transition: TransitionPresets.easeOutExpo,
 });
 amount.value = 2000;

@@ -44,7 +44,7 @@ amount.value = 2000;
 const visitCount = ref(0);
 const visitCountOutput = useTransition(visitCount, {
  duration: duration,
-  transition: TransitionPresets.easeOutExpo
+  transition: TransitionPresets.easeOutExpo,
 });
 visitCount.value = 2000;

@@ -52,7 +52,7 @@ visitCount.value = 2000;
 const messageCount = ref(0);
 const messageCountOutput = useTransition(messageCount, {
  duration: duration,
-  transition: TransitionPresets.easeOutExpo
+  transition: TransitionPresets.easeOutExpo,
 });
 messageCount.value = 2000;

@@ -60,7 +60,7 @@ messageCount.value = 2000;
 const orderCount = ref(0);
 const orderCountOutput = useTransition(orderCount, {
  duration: duration,
-  transition: TransitionPresets.easeOutExpo
+  transition: TransitionPresets.easeOutExpo,
 });
 orderCount.value = 2000;
 </script>
@@ -215,34 +215,36 @@ orderCount.value = 2000;

 <style lang="scss" scoped>
 .dashboard-container {
-  padding: 24px;
  position: relative;
+  padding: 24px;
+
  .user-avatar {
-    height: 40px;
    width: 40px;
+    height: 40px;
    border-radius: 50%;
  }

  .github-corner {
    position: absolute;
-    top: 0px;
-    border: 0;
+    top: 0;
    right: 0;
    z-index: 99;
+    border: 0;
  }

  .data-box {
-    font-weight: bold;
-    padding: 20px;
-    color: var(--el-text-color-regular);
-    background: var(--el-bg-color-overlay);
-    box-shadow: var(--el-box-shadow-dark);
-    border-color: var(--el-border-color);
    display: flex;
    justify-content: space-between;
+    padding: 20px;
+    font-weight: bold;
+    color: var(--el-text-color-regular);
+    background: var(--el-bg-color-overlay);
+    border-color: var(--el-border-color);
+    box-shadow: var(--el-box-shadow-dark);
  }
+
  .svg-icon {
-    fill: currentColor !important;
+    fill: currentcolor !important;
  }
 }
 </style>
--- a/src/views/demo/apidoc.vue
+++ b/src/views/demo/apidoc.vue
@@ -2,7 +2,7 @@
 <template>
  <div class="app-container">
    <iframe
-      id="apidocIframe"
+      id="apidoc-iframe"
      src="https://www.apifox.cn/apidoc/shared-195e783f-4d85-4235-a038-eec696de4ea5"
      width="100%"
      frameborder="0"
@@ -11,12 +11,12 @@
 </template>

 <style lang="scss" scoped>
-#apidocIframe {
+#apidoc-iframe {
  height: calc(100vh - 100px);
 }

 .hasTagsView {
-  #apidocIframe {
+  #apidoc-iframe {
    height: calc(100vh - 140px);
  }
 }
--- a/src/views/error-page/401.vue
+++ b/src/views/error-page/401.vue
@@ -1,20 +1,20 @@
 <!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
 <script lang="ts">
 export default {
-  name: 'Page401'
+  name: "Page401",
 };
 </script>

 <script setup lang="ts">
-import { reactive, toRefs } from 'vue';
-import { useRouter } from 'vue-router';
+import { reactive, toRefs } from "vue";
+import { useRouter } from "vue-router";

 const state = reactive({
  errGif: new URL(`../../assets/401_images/401.gif`, import.meta.url).href,

  ewizardClap:
-    'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
-  dialogVisible: false
+    "https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646",
+  dialogVisible: false,
 });

 const { errGif, ewizardClap, dialogVisible } = toRefs(state);
@@ -72,20 +72,20 @@ function back() {
  margin: 100px auto;

  .pan-back-btn {
-    background: #008489;
    color: #fff;
+    background: #008489;
    border: none !important;
  }

  .pan-gif {
-    margin: 0 auto;
    display: block;
+    margin: 0 auto;
  }

  .pan-img {
    display: block;
-    margin: 0 auto;
    width: 100%;
+    margin: 0 auto;
  }

  .text-jumbo {
--- a/src/views/error-page/404.vue
+++ b/src/views/error-page/404.vue
@@ -1,13 +1,13 @@
 <!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
 <script lang="ts">
 export default {
-  name: 'Page404'
+  name: "Page404",
 };
 </script>

 <script setup lang="ts">
 function message() {
-  return 'The webmaster said that you can not enter this page...';
+  return "The webmaster said that you can not enter this page...";
 }
 </script>

@@ -60,10 +60,10 @@ function message() {

 <style lang="scss" scoped>
 .wscn-http404-container {
-  transform: translate(-50%, -50%);
  position: absolute;
  top: 40%;
  left: 50%;
+  transform: translate(-50%, -50%);
 }

 .wscn-http404 {
@@ -86,39 +86,39 @@ function message() {
      position: absolute;

      &.left {
-        width: 80px;
        top: 17px;
        left: 220px;
+        width: 80px;
        opacity: 0;
        animation-name: cloudLeft;
        animation-duration: 2s;
        animation-timing-function: linear;
-        animation-fill-mode: forwards;
        animation-delay: 1s;
+        animation-fill-mode: forwards;
      }

      &.mid {
-        width: 46px;
        top: 10px;
        left: 420px;
+        width: 46px;
        opacity: 0;
        animation-name: cloudMid;
        animation-duration: 2s;
        animation-timing-function: linear;
-        animation-fill-mode: forwards;
        animation-delay: 1.2s;
+        animation-fill-mode: forwards;
      }

      &.right {
-        width: 62px;
        top: 100px;
        left: 500px;
+        width: 62px;
        opacity: 0;
        animation-name: cloudRight;
        animation-duration: 2s;
        animation-timing-function: linear;
-        animation-fill-mode: forwards;
        animation-delay: 1s;
+        animation-fill-mode: forwards;
      }

      @keyframes cloudLeft {
@@ -209,24 +209,24 @@ function message() {
    overflow: hidden;

    &__oops {
+      margin-bottom: 20px;
      font-size: 32px;
      font-weight: bold;
      line-height: 40px;
      color: #1482f0;
      opacity: 0;
-      margin-bottom: 20px;
      animation-name: slideUp;
      animation-duration: 0.5s;
      animation-fill-mode: forwards;
    }

    &__headline {
+      margin-bottom: 10px;
      font-size: 20px;
+      font-weight: bold;
      line-height: 24px;
      color: #222;
-      font-weight: bold;
      opacity: 0;
-      margin-bottom: 10px;
      animation-name: slideUp;
      animation-duration: 0.5s;
      animation-delay: 0.1s;
@@ -234,11 +234,11 @@ function message() {
    }

    &__info {
+      margin-bottom: 30px;
      font-size: 13px;
      line-height: 21px;
      color: grey;
      opacity: 0;
-      margin-bottom: 30px;
      animation-name: slideUp;
      animation-duration: 0.5s;
      animation-delay: 0.2s;
@@ -250,14 +250,14 @@ function message() {
      float: left;
      width: 110px;
      height: 36px;
-      background: #1482f0;
-      border-radius: 100px;
-      text-align: center;
-      color: #ffffff;
-      opacity: 0;
      font-size: 14px;
      line-height: 36px;
+      color: #fff;
+      text-align: center;
      cursor: pointer;
+      background: #1482f0;
+      border-radius: 100px;
+      opacity: 0;
      animation-name: slideUp;
      animation-duration: 0.5s;
      animation-delay: 0.3s;
@@ -266,13 +266,13 @@ function message() {

    @keyframes slideUp {
      0% {
-        transform: translateY(60px);
        opacity: 0;
+        transform: translateY(60px);
      }

      100% {
-        transform: translateY(0);
        opacity: 1;
+        transform: translateY(0);
      }
    }
  }
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -7,7 +7,7 @@
      class="login-form"
    >
      <div class="flex text-white items-center py-4">
-        <span class="text-2xl flex-1 text-center">{{ $t('login.title') }}</span>
+        <span class="text-2xl flex-1 text-center">{{ $t("login.title") }}</span>
        <lang-select style="color: #fff" />
      </div>

@@ -77,30 +77,30 @@
        type="primary"
        class="w-full"
        @click.prevent="handleLogin"
-        >{{ $t('login.login') }}
+        >{{ $t("login.login") }}
      </el-button>

      <!-- 账号密码提示 -->
      <div class="mt-4 text-white text-sm">
-        <span>{{ $t('login.username') }}: admin</span>
-        <span class="ml-4"> {{ $t('login.password') }}: 123456</span>
+        <span>{{ $t("login.username") }}: admin</span>
+        <span class="ml-4"> {{ $t("login.password") }}: 123456</span>
      </div>
    </el-form>
  </div>
 </template>

 <script setup lang="ts">
-import router from '@/router';
-import LangSelect from '@/components/LangSelect/index.vue';
-import SvgIcon from '@/components/SvgIcon/index.vue';
+import router from "@/router";
+import LangSelect from "@/components/LangSelect/index.vue";
+import SvgIcon from "@/components/SvgIcon/index.vue";

 // 状态管理依赖
-import { useUserStore } from '@/store/modules/user';
+import { useUserStore } from "@/store/modules/user";

 // API依赖
-import { LocationQuery, LocationQueryValue, useRoute } from 'vue-router';
-import { getCaptchaApi } from '@/api/auth';
-import { LoginData } from '@/api/auth/types';
+import { LocationQuery, LocationQueryValue, useRoute } from "vue-router";
+import { getCaptchaApi } from "@/api/auth";
+import { LoginData } from "@/api/auth/types";

 const userStore = useUserStore();
 const route = useRoute();
@@ -128,14 +128,14 @@ const captchaBase64 = ref();
 const loginFormRef = ref(ElForm);

 const loginData = ref<LoginData>({
-  username: 'admin',
-  password: '123456'
+  username: "admin",
+  password: "123456",
 });

 const loginRules = {
-  username: [{ required: true, trigger: 'blur' }],
-  password: [{ required: true, trigger: 'blur', validator: passwordValidator }],
-  verifyCode: [{ required: true, trigger: 'blur' }]
+  username: [{ required: true, trigger: "blur" }],
+  password: [{ required: true, trigger: "blur", validator: passwordValidator }],
+  verifyCode: [{ required: true, trigger: "blur" }],
 };

 /**
@@ -143,7 +143,7 @@ const loginRules = {
 */
 function passwordValidator(rule: any, value: any, callback: any) {
  if (value.length < 6) {
-    callback(new Error('The password can not be less than 6 digits'));
+    callback(new Error("The password can not be less than 6 digits"));
  } else {
    callback();
  }
@@ -154,7 +154,7 @@ function passwordValidator(rule: any, value: any, callback: any) {
 */
 function checkCapslock(e: any) {
  const { key } = e;
-  isCapslock.value = key && key.length === 1 && key >= 'A' && key <= 'Z';
+  isCapslock.value = key && key.length === 1 && key >= "A" && key <= "Z";
 }

 /**
@@ -180,11 +180,11 @@ function handleLogin() {
        .then(() => {
          const query: LocationQuery = route.query;

-          const redirect = (query.redirect as LocationQueryValue) ?? '/';
+          const redirect = (query.redirect as LocationQueryValue) ?? "/";

          const otherQueryParams = Object.keys(query).reduce(
            (acc: any, cur: string) => {
-              if (cur !== 'redirect') {
+              if (cur !== "redirect") {
                acc[cur] = query[cur];
              }
              return acc;
@@ -212,10 +212,10 @@ onMounted(() => {

 <style lang="scss" scoped>
 .login-container {
-  min-height: 100%;
  width: 100%;
-  background-color: #2d3a4b;
+  min-height: 100%;
  overflow: hidden;
+  background-color: #2d3a4b;

  .login-form {
    width: 520px;
@@ -226,12 +226,12 @@ onMounted(() => {

    .captcha {
      position: absolute;
-      right: 0;
      top: 0;
+      right: 0;

      img {
-        height: 48px;
        width: 120px;
+        height: 48px;
        cursor: pointer;
      }
    }
@@ -239,8 +239,8 @@ onMounted(() => {
 }

 .el-form-item {
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  background: rgba(0, 0, 0, 0.1);
+  background: rgb(0 0 0 / 10%);
+  border: 1px solid rgb(255 255 255 / 10%);
  border-radius: 5px;
 }

@@ -254,10 +254,10 @@ onMounted(() => {
    box-shadow: none;

    .el-input__inner {
-      background: transparent;
-      border: 0px;
-      border-radius: 0px;
      color: #fff;
+      background: transparent;
+      border: 0;
+      border-radius: 0;
      caret-color: #fff;

      &:-webkit-autofill {
@@ -270,9 +270,8 @@ onMounted(() => {
      &:-webkit-autofill:hover,
      &:-webkit-autofill:focus,
      &:-webkit-autofill:active {
-        -webkit-transition-delay: 99999s;
-        -webkit-transition: color 99999s ease-out,
-          background-color 99999s ease-out;
+        transition: color 99999s ease-out, background-color 99999s ease-out;
+        transition-delay: 99999s;
      }
    }
  }