style: fix building info

src/components/DateCalendar.vue

@@ -277,15 +277,9 @@ limitations under the License. -->
 </template>
 
 <script lang="ts" setup>
-import {
-  defineProps,
-  computed,
-  defineEmits,
-  onMounted,
-  watch,
-  reactive,
-} from "vue";
+import { computed, onMounted, watch, reactive } from "vue";
 import { useI18n } from "vue-i18n";
+/*global defineProps, defineEmits */
 const emit = defineEmits(["input", "setDates", "ok"]);
 const { t } = useI18n();
 const props = defineProps({
@@ -580,11 +574,13 @@ onMounted(() => {
   user-select: none;
   color: #3d444f;
 }
+
 .calendar + .calendar {
   border-left: solid 1px #eaeaea;
   margin-left: 5px;
   padding-left: 5px;
 }
+
 .calendar-head {
   line-height: 34px;
   height: 34px;
@@ -630,10 +626,12 @@ onMounted(() => {
 .calendar-next-month-btn {
   right: 24px;
 }
+
 .calendar-next-month-btn .middle,
 .calendar-prev-month-btn .middle {
   margin-top: 8px;
 }
+
 .calendar-body {
   position: relative;
   width: 196px;

src/components/Graph.vue

@@ -16,20 +16,12 @@ limitations under the License. -->
   <div ref="chartRef" :style="`height:${height};width:${width};`"></div>
 </template>
 <script lang="ts" setup>
-import {
-  watch,
-  ref,
-  defineProps,
-  Ref,
-  onMounted,
-  onBeforeUnmount,
-  unref,
-} from "vue";
+import { watch, ref, Ref, onMounted, onBeforeUnmount, unref } from "vue";
 import type { PropType } from "vue";
 import { useECharts } from "@/hooks/useEcharts";
 import { addResizeListener, removeResizeListener } from "@/utils/event";
 
-/*global Nullable*/
+/*global Nullable, defineProps*/
 const chartRef = ref<Nullable<HTMLDivElement>>(null);
 const { setOptions, resize } = useECharts(chartRef as Ref<HTMLDivElement>);
 const props = defineProps({

src/components/Icon.vue

@@ -28,8 +28,9 @@ limitations under the License. -->
   </svg>
 </template>
 <script lang="ts" setup>
-import { defineProps } from "vue";
 import "@/assets/icons/index";
+
+/*global defineProps */
 defineProps({
   iconName: { type: String, default: "" },
   size: { type: String, default: "sm" },
@@ -42,25 +43,31 @@ defineProps({
   height: 16px;
   vertical-align: middle;
   fill: currentColor;
+
   &.sm {
     width: 14px;
     height: 14px;
   }
+
   &.middle {
     width: 18px;
     height: 18px;
   }
+
   &.lg {
     width: 24px;
     height: 24px;
   }
+
   &.loading {
     animation: loading 1.5s linear infinite;
   }
+
   &.logo {
     height: 30px;
     width: 110px;
   }
+
   &.xl {
     height: 30px;
     width: 30px;

src/components/Selector.vue

@@ -33,7 +33,7 @@ limitations under the License. -->
   </el-select>
 </template>
 <script lang="ts" setup>
-import { ref, defineEmits } from "vue";
+import { ref } from "vue";
 import type { PropType } from "vue";
 import { ElSelect, ElOption } from "element-plus";
 
@@ -42,8 +42,9 @@ interface Option {
   value: string;
 }
 
+/*global  defineProps, defineEmits*/
+
 const emit = defineEmits(["change"]);
-/*global  defineProps*/
 const props = defineProps({
   options: {
     type: Array as PropType<Option[]>,

src/components/TimePicker.vue

@@ -142,17 +142,10 @@ limitations under the License. -->
 </template>
 
 <script lang="ts" setup>
-import {
-  defineProps,
-  ref,
-  computed,
-  defineEmits,
-  onMounted,
-  onBeforeUnmount,
-  watch,
-} from "vue";
+import { ref, computed, onMounted, onBeforeUnmount, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import DateCalendar from "./DateCalendar.vue";
+/*global defineProps, defineEmits */
 const datepicker = ref(null);
 const { t } = useI18n();
 const show = ref<boolean>(false);
@@ -339,6 +332,32 @@ watch(
 </script>
 
 <style lang="scss" scoped>
+
+
+@keyframes datepicker-anim-in {
+  0% {
+    opacity: 0;
+    transform: scaleY(0.8);
+  }
+
+  to {
+    opacity: 1;
+    transform: scaleY(1);
+  }
+}
+
+@keyframes datepicker-anim-out {
+  0% {
+    opacity: 1;
+    transform: scaleY(1);
+  }
+
+  to {
+    opacity: 0;
+    transform: scaleY(0.8);
+  }
+}
+
 .datepicker {
   display: inline-block;
   position: relative;
@@ -373,7 +392,6 @@ watch(
   margin-left: -8px;
   margin-top: -8px;
   text-align: center;
-  background: #ccc;
   color: #fff;
   border-radius: 50%;
   background: #ccc
@@ -384,6 +402,7 @@ watch(
 .datepicker__clearable:hover:before {
   display: none;
 }
+
 .datepicker__clearable:hover .datepicker-close {
   display: block;
 }
@@ -436,25 +455,30 @@ watch(
   padding: 5px;
   overflow: hidden;
   z-index: 999;
+
   &.top {
     bottom: 30px;
     right: 0;
     transform-origin: center bottom;
   }
+
   &.bottom {
     top: 30px;
     right: 0;
     transform-origin: center top;
   }
+
   &.left {
     top: 30px;
     transform-origin: center top;
   }
+
   &.right {
     right: -80px;
     top: 30px;
     transform-origin: center top;
   }
+
   &__sidebar {
     position: absolute;
     top: 0;
@@ -464,6 +488,7 @@ watch(
     padding: 5px;
     border-right: solid 1px #eaeaea;
   }
+
   &__shortcut {
     display: block;
     width: 100%;
@@ -476,10 +501,12 @@ watch(
     outline: none;
     cursor: pointer;
     white-space: nowrap;
+
     &:hover {
       color: #3f97e3;
     }
   }
+
   &__body {
     margin-left: 100px;
     padding-left: 5px;
@@ -513,6 +540,7 @@ watch(
   display: inline-block;
   cursor: pointer;
 }
+
 .datepicker-anim-enter-active {
   transform-origin: 0 0;
   animation: datepicker-anim-in 0.2s cubic-bezier(0.23, 1, 0.32, 1);
@@ -545,26 +573,4 @@ watch(
 .datepicker__buttons .datepicker__button-cancel {
   background: #666;
 }
-
-@keyframes datepicker-anim-in {
-  0% {
-    opacity: 0;
-    transform: scaleY(0.8);
-  }
-  to {
-    opacity: 1;
-    transform: scaleY(1);
-  }
-}
-
-@keyframes datepicker-anim-out {
-  0% {
-    opacity: 1;
-    transform: scaleY(1);
-  }
-  to {
-    opacity: 0;
-    transform: scaleY(0.8);
-  }
-}
 </style>