新增首届面部分功能

src/App.vue

@@ -4,4 +4,3 @@
   </div>
 </template>
 
-<style lang="scss"></style>

src/assets/scss/_variables.scss

@@ -14,7 +14,7 @@ $colors: (
 );
 
 // 字体大小
-$base-font-size: 0.2rem;
+$base-font-size: 16px;
 $font-sizes: (
   xxs: 0.1,
   //8px
@@ -86,7 +86,7 @@ $spacing-directions: (
   b: bottom,
   l: left,
 );
-$spacing-base-size: 0.2rem;
+$spacing-base-size: 16px;
 $spacing-sizes: (
   0: 0,
   1: 0.25,

src/assets/scss/index.scss

@@ -5,7 +5,7 @@
   height: 100%;
 
   .bg {
-    padding: 0.2rem 0.2rem 0 0.2rem;
+    padding: 16px 16px 0 16px;
     background-image: url("../assets/pageBg.png");
     background-size: cover;
     background-position: center center;
@@ -14,13 +14,13 @@
   .host-body {
     .title {
       position: relative;
-      width: 6.25rem;
+      width: 500px;
       text-align: center;
       background-size: cover;
       background-repeat: no-repeat;
 
       .title-text {
-        font-size: 0.3rem;
+        font-size: 24px;
         position: absolute;
         bottom: 0;
         left: 50%;
@@ -29,7 +29,7 @@
 
       .title-bototm {
         position: absolute;
-        bottom: -0.375rem;
+        bottom: -30px;
         left: 50%;
         transform: translate(-50%);
       }
@@ -38,19 +38,18 @@
     // 平行四边形
     .react-left {
       cursor: pointer;
-      font-size: 0.225rem;
-      width: 3.75rem;
-      height: 0.625rem;
-      line-height: 0.625rem;
+      font-size: 18px;
+      width: 300px;
+      line-height: 50px;
       text-align: center;
       transform: skewX(-45deg);
 
       .react-after {
         position: absolute;
-        right: -0.3125rem;
+        right: -25px;
         top: 0;
-        height: 0.625rem;
-        width: 0.625rem;
+        height: 50px;
+        width: 50px;
         background-color: #0f1325;
         transform: skewX(45deg);
       }
@@ -63,19 +62,19 @@
 
     .react-right {
       cursor: pointer;
-      font-size: 0.225rem;
-      width: 3.75rem;
-      height: 0.625rem;
-      line-height: 0.625rem;
+      font-size: 18px;
+      width: 300px;
+      height: 50px;
+      line-height: 50px;
       text-align: center;
       transform: skewX(45deg);
 
       .react-before {
         position: absolute;
-        left: -0.3125rem;
+        left: -25px;
         top: 0;
-        height: 0.625rem;
-        width: 0.625rem;
+        height: 50px;
+        width: 50px;
         background-color: #0f1325;
         transform: skewX(-45deg);
       }
@@ -87,7 +86,7 @@
     }
 
     .body-box {
-      margin-top: 0.2rem;
+      margin-top: 16px;
       display: flex;
       flex-direction: column;
 
@@ -99,7 +98,7 @@
 
       // 底部数据
       .bototm-box {
-        margin-top: 0.125rem;
+        margin-top: 10px;
         display: grid;
         grid-template-columns: repeat(2, 50%);
       }

src/constant/index.ts

@@ -0,0 +1,38 @@
+// 星期
+export const WEEK = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
+
+// 主题名称与副标题名称
+export const title = '大数据可视化平台'
+export const subtitle = ['数据分析1', '数据分析2', 'vue-big-screen']
+
+// 各类标题与图标
+type ModuleInfo = {
+  name: string
+  icon: string
+}[]
+export const moduleInfo: ModuleInfo = [
+  {
+    name: '任务通过率',
+    icon: 'icon-chart-bar',
+  },
+  {
+    name: '地图数据',
+    icon: 'icon-tongji4',
+  },
+  {
+    name: '产品销售渠道分析',
+    icon: 'icon-align-left',
+  },
+  {
+    name: '任务完成排行榜',
+    icon: 'icon-zhibiao2',
+  },
+  {
+    name: '数据统计图',
+    icon: 'icon-vector',
+  },
+  {
+    name: '工单修复以及满意度统计图',
+    icon: 'icon-fenxi7',
+  },
+]

src/router/index.ts

@@ -3,8 +3,8 @@ import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
 const routes: Array<RouteRecordRaw> = [
   {
     path: '/',
-    name: 'Home',
-    component: () => import('../views/Home.vue')
+    name: 'Index',
+    component: () => import('../views/index.vue')
   }
 ]
 

src/utils/index.ts

@@ -0,0 +1,47 @@
+/**
+ * @param {Function} fn 防抖函数
+ * @param {Number} delay 延迟时间
+ */
+export const debounce = (fn: Function, delay: number) => {
+  let timer: number
+  return function (this: any) {
+    let context = this
+    let args = arguments
+    clearTimeout(timer)
+    timer = setTimeout(function () {
+      fn.apply(context, args)
+    }, delay)
+  }
+}
+
+/**
+ * @param {date} time 需要转换的时间
+ * @param {String} fmt 需要转换的格式 如 yyyy-MM-dd、yyyy-MM-dd HH:mm:ss
+ */
+export const formatTime = (time: any , fmt: string): string => {
+  if (!time) return ''
+  const date = new Date(time)
+  const o = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'H+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds(),
+    'q+': Math.floor((date.getMonth() + 3) / 3),
+    'S': date.getMilliseconds(),
+  }
+  if (/(y+)/.test(fmt))
+    fmt = fmt.replace(
+      RegExp.$1,
+      (date.getFullYear() + '').substr(4 - RegExp.$1.length)
+    )
+  for (const k in o) {
+    if (new RegExp('(' + k + ')').test(fmt)) {
+      fmt = fmt.replace(
+        RegExp.$1,
+        RegExp.$1.length === 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length)
+      )
+    }
+  }
+  return fmt
+}

src/utils/resizeMixins.ts

@@ -0,0 +1,32 @@
+// 混入代码 resize-mixins.js
+import { debounce } from '@/utils';
+const resizeChartMethod = '$__resizeChartMethod';
+
+export default {
+  data() { 
+    // 在组件内部将图表 init 的引用映射到 chart 属性上
+    return {
+      chart: null,
+    };
+  },
+  created() {
+    window.addEventListener('resize', this[resizeChartMethod], false);
+  },
+  activated() {
+    // 防止 keep-alive 之后图表变形
+    if (this.chart) {
+      this.chart.resize()
+    }
+  },
+  beforeDestroy() {
+    window.removeEventListener('reisze', this[resizeChartMethod]);
+  },
+  methods: {
+    // 防抖函数来控制 resize 的频率
+    [resizeChartMethod]: debounce(function() {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    }, 300),
+  },
+};

src/utils/useDraw.ts

@@ -0,0 +1,71 @@
+import { ref } from 'vue'
+
+export default function useIndex() {
+  // * 指向最外层容器
+  const appRef = ref()
+  // * 定时函数
+  const timer = ref(0)
+  // * 默认缩放值
+  const scale = {
+    width: '1',
+    height: '1',
+  }
+  // * 设计稿尺寸（px）
+  const baseWidth = 1920
+  const baseHeight = 1080
+
+  // * 需保持的比例（默认1.77778）
+  const baseProportion = (baseWidth / baseHeight).toFixed(5)
+
+  const calcRate = () => {
+    // 当前宽高比
+    const currentRate = (window.innerWidth / window.innerHeight).toFixed(5)
+
+    if (appRef.value) {
+      if (currentRate > baseProportion) {
+        // 表示更宽
+        scale.width = (
+          (window.innerHeight * parseFloat(baseProportion)) /
+          baseWidth
+        ).toFixed(5)
+        scale.height = (window.innerHeight / baseHeight).toFixed(5)
+        appRef.value.style.transform = `scale(${scale.width},${scale.height})`
+      } else {
+        // 表示更高
+        appRef.value.style.transform = `scale(1,1)`
+      }
+      // 设置比例
+      // scale.width = (window.innerHeight / baseHeight).toFixed(5)
+      // scale.height = (window.innerWidth / baseWidth).toFixed(5)
+
+      // appRef.value.style.transform = `scale(${scale.width},${scale.height})`
+      // if (currentRate > baseRate) {
+      //   // 以高为准
+      //   scale.value = (window.innerHeight / baseHeight.value).toFixed(5)
+      //   appRef.value.style.transform = 'scale(' + scale.value + ')'
+      // } else {
+      //   // 以宽为准
+      //   scale.value = (window.innerWidth / baseWidth.value).toFixed(5)
+      //   appRef.value.style.transform = 'scale(' + scale.value + ')'
+      // }
+    }
+  }
+
+  const resize = () => {
+    clearTimeout(timer.value)
+    timer.value = setTimeout(() => {
+      calcRate()
+    }, 100)
+  }
+
+  // 改变窗口大小重新绘制
+  const windowDraw = () => {
+    window.addEventListener('resize', resize)
+  }
+
+  return {
+    appRef,
+    calcRate,
+    windowDraw,
+  }
+}

src/views/Home.vue

@@ -1,19 +0,0 @@
-<template>
-  <div>
-    <dv-full-screen-container>
-      <dv-border-box-12 style="width: 200px; height: 200px">dv-border-box-12</dv-border-box-12>
-    </dv-full-screen-container>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  setup() {
-    return {}
-  }
-})
-</script>
-
-<style scss scoped></style>

src/views/index.vue

@@ -0,0 +1,169 @@
+<template>
+  <div id="index" ref="appRef">
+    <dv-full-screen-container class="bg">
+      <dv-loading v-if="loading">Loading...</dv-loading>
+      <div v-else class="host-body">
+        <div class="d-flex jc-center">
+          <dv-decoration-10 style="width: 33.3%; height: 5px;" />
+          <div class="d-flex jc-center">
+            <dv-decoration-8
+              :color="['#568aea', '#000000']"
+              style="width: 200px; height: 50px;"
+            />
+            <div class="title">
+              <span class="title-text">{{title}}</span>
+              <dv-decoration-6
+                class="title-bototm"
+                :reverse="true"
+                :color="['#50e3c2', '#67a1e5']"
+                style="width: 250px; height: 8px;"
+              />
+            </div>
+            <dv-decoration-8
+              :reverse="true"
+              :color="['#568aea', '#000000']"
+              style="width: 200px; height: 50px;"
+            />
+          </div>
+          <dv-decoration-10
+            style="width: 33.3%; height: 5px; transform: rotateY(180deg);"
+          />
+        </div>
+
+        <!-- 第二行 -->
+        <div class="d-flex jc-between px-2">
+          <div class="d-flex" style="width: 40%;">
+            <div
+              class="react-right ml-4"
+              style="width: 500px; text-align: left; background-color: #0f1325;"
+            >
+              <span class="react-before"></span>
+              <span class="text">数据分析1</span>
+            </div>
+            <div class="react-right ml-3" style="background-color: #0f1325;">
+              <span class="text colorBlue">数据分析2</span>
+            </div>
+          </div>
+          <div style="width: 40%;" class="d-flex">
+            <div class="react-left bg-color-blue mr-3">
+              <span class="text fw-b">vue-big-screen</span>
+            </div>
+            <div
+              class="react-left mr-4"
+              style="
+                width: 500px;
+                background-color: #0f1325;
+                text-align: right;
+              "
+            >
+              <span class="react-after"></span>
+              <span class="text">
+                {{ timeInfo.dateYear }} {{ timeInfo.dateWeek }}
+                {{ timeInfo.dateDay }}
+              </span>
+            </div>
+          </div>
+        </div>
+
+        <div class="body-box">
+          <!-- 第三行数据 -->
+          <div class="content-box">
+            <div>
+              <dv-border-box-12>
+                <!-- <centerLeft1 /> -->
+              </dv-border-box-12>
+            </div>
+            <div>
+              <dv-border-box-12>
+                <!-- <centerLeft2 /> -->
+              </dv-border-box-12>
+            </div>
+            <!-- 中间 -->
+            <div>
+              <!-- <center /> -->
+            </div>
+            <!-- 中间 -->
+            <div>
+              <centerRight2 />
+            </div>
+            <div>
+              <dv-border-box-13>
+                <!-- <centerRight1 /> -->
+              </dv-border-box-13>
+            </div>
+          </div>
+
+          <!-- 第四行数据 -->
+          <div class="bototm-box">
+            <dv-border-box-13>
+              <!-- <bottomLeft /> -->
+            </dv-border-box-13>
+            <dv-border-box-12>
+              <!-- <bottomRight /> -->
+            </dv-border-box-12>
+          </div>
+        </div>
+      </div>
+    </dv-full-screen-container>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref, reactive, onMounted, onBeforeUnmount } from 'vue'
+import { formatTime } from '@/utils/index'
+import { WEEK } from '@/constant/index'
+import useIndex from '@/utils/useDraw'
+import { title, subtitle, moduleInfo } from '@/constant/index'
+
+export default defineComponent({
+  setup() {
+    // * 加载标识
+    const loading = ref<boolean>(true)
+    // * 时间内容
+    const timeInfo = reactive({
+      setInterval: 0,
+      dateDay: '',
+      dateYear: '',
+      dateWeek: '',
+    })
+    // * 适配处理
+    const { appRef, calcRate, windowDraw } = useIndex()
+    // 生命周期
+    onMounted(() => {
+      cancelLoading()
+      handleTime()
+      // todo 屏幕适应
+      windowDraw()
+      calcRate()
+    })
+    onBeforeUnmount(() => {
+      clearInterval(timeInfo.setInterval)
+    })
+
+    // methods
+    // todo 处理 loading 展示
+    const cancelLoading = () => {
+      setTimeout(() => {
+        loading.value = false
+      }, 500)
+    }
+
+    // todo 处理时间监听
+    const handleTime = () => {
+      timeInfo.setInterval = setInterval(() => {
+        const date = new Date()
+        timeInfo.dateDay = formatTime(date, 'HH: mm: ss')
+        timeInfo.dateYear = formatTime(date, 'yyyy-MM-dd')
+        timeInfo.dateWeek = WEEK[date.getDay()]
+      }, 1000)
+    }
+
+    // return
+    return { loading, timeInfo, appRef, title, subtitle, moduleInfo }
+  },
+})
+</script>
+
+<style lang="scss" scoped>
+@import '../assets/scss/index.scss';
+</style>

yarn.lock

@@ -213,6 +213,11 @@
   resolved "http://npm.rongdasoft.com:7001/@babel/helper-validator-identifier/download/@babel/helper-validator-identifier-7.12.11.tgz#c9a1f021917dcb5ccf0d4e453e399022981fc9ed"
   integrity sha1-yaHwIZF9y1zPDU5FPjmQIpgfye0=
 
+"@babel/helper-validator-identifier@^7.14.0":
+  version "7.14.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.0.tgz#d26cad8a47c65286b15df1547319a5d0bcf27288"
+  integrity sha512-V3ts7zMSu5lfiwWDVWzRDGIN+lnCEUdaXgtVHJgLb1rGaA6jMrtB9EmE7L18foXJIE8Un/A/h6NJfGQp/e1J4A==
+
 "@babel/helper-validator-option@^7.12.1", "@babel/helper-validator-option@^7.12.11":
   version "7.12.11"
   resolved "http://npm.rongdasoft.com:7001/@babel/helper-validator-option/download/@babel/helper-validator-option-7.12.11.tgz#d66cb8b7a3e7fe4c6962b32020a131ecf0847f4f"
@@ -246,11 +251,16 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.12.0", "@babel/parser@^7.12.10", "@babel/parser@^7.12.7", "@babel/parser@^7.13.9":
+"@babel/parser@^7.12.0", "@babel/parser@^7.12.10", "@babel/parser@^7.12.7":
   version "7.12.11"
   resolved "http://npm.rongdasoft.com:7001/@babel/parser/download/@babel/parser-7.12.11.tgz#9ce3595bcd74bc5c466905e86c535b8b25011e79"
   integrity sha1-nONZW810vFxGaQXobFNbiyUBHnk=
 
+"@babel/parser@^7.13.9":
+  version "7.14.2"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.14.2.tgz#0c1680aa44ad4605b16cbdcc5c341a61bde9c746"
+  integrity sha512-IoVDIHpsgE/fu7eXBeRWt8zLbDrSvD7H1gpomOkPpBoEN8KCruCqSDdqo8dddwQQrui30KSvQBaMUOJiuFu6QQ==
+
 "@babel/plugin-proposal-async-generator-functions@^7.12.1":
   version "7.12.1"
   resolved "http://npm.rongdasoft.com:7001/@babel/plugin-proposal-async-generator-functions/download/@babel/plugin-proposal-async-generator-functions-7.12.1.tgz#dc6c1170e27d8aca99ff65f4925bd06b1c90550e"
@@ -837,7 +847,7 @@
     globals "^11.1.0"
     lodash "^4.17.19"
 
-"@babel/types@^7.0.0", "@babel/types@^7.10.4", "@babel/types@^7.10.5", "@babel/types@^7.12.0", "@babel/types@^7.12.1", "@babel/types@^7.12.10", "@babel/types@^7.12.11", "@babel/types@^7.12.5", "@babel/types@^7.12.7", "@babel/types@^7.13.0", "@babel/types@^7.4.4":
+"@babel/types@^7.0.0", "@babel/types@^7.10.4", "@babel/types@^7.10.5", "@babel/types@^7.12.0", "@babel/types@^7.12.1", "@babel/types@^7.12.10", "@babel/types@^7.12.11", "@babel/types@^7.12.5", "@babel/types@^7.12.7", "@babel/types@^7.4.4":
   version "7.12.11"
   resolved "http://npm.rongdasoft.com:7001/@babel/types/download/@babel/types-7.12.11.tgz#a86e4d71e30a9b6ee102590446c98662589283ce"
   integrity sha1-qG5NceMKm27hAlkERsmGYliSg84=
@@ -846,6 +856,14 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.13.0":
+  version "7.14.2"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.14.2.tgz#4208ae003107ef8a057ea8333e56eb64d2f6a2c3"
+  integrity sha512-SdjAG/3DikRHpUOjxZgnkbR11xUlyDMUFJdvnIgZEE16mqmY0BINMmc4//JMJglEmn6i7sq6p+mGrFWyZ98EEw==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.14.0"
+    to-fast-properties "^2.0.0"
+
 "@hapi/address@2.x.x":
   version "2.1.4"
   resolved "http://npm.rongdasoft.com:7001/@hapi/address/download/@hapi/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
@@ -1158,73 +1176,73 @@
     source-map "^0.6.0"
 
 "@typescript-eslint/eslint-plugin@^4.18.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/eslint-plugin/download/@typescript-eslint/eslint-plugin-4.10.0.tgz#19ed3baf4bc4232c5a7fcd32eaca75c3a5baf9f3"
-  integrity sha1-Ge07r0vEIyxaf80y6sp1w6W6+fM=
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.23.0.tgz#29d3c9c81f6200b1fd6d8454cfb007ba176cde80"
+  integrity sha512-tGK1y3KIvdsQEEgq6xNn1DjiFJtl+wn8JJQiETtCbdQxw1vzjXyAaIkEmO2l6Nq24iy3uZBMFQjZ6ECf1QdgGw==
   dependencies:
-    "@typescript-eslint/experimental-utils" "4.10.0"
-    "@typescript-eslint/scope-manager" "4.10.0"
+    "@typescript-eslint/experimental-utils" "4.23.0"
+    "@typescript-eslint/scope-manager" "4.23.0"
     debug "^4.1.1"
     functional-red-black-tree "^1.0.1"
+    lodash "^4.17.15"
     regexpp "^3.0.0"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/experimental-utils@4.10.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/experimental-utils/download/@typescript-eslint/experimental-utils-4.10.0.tgz#dbf5d0f89802d5feaf7d11e5b32df29bbc2f3a0e"
-  integrity sha1-2/XQ+JgC1f6vfRHlsy3ym7wvOg4=
+"@typescript-eslint/experimental-utils@4.23.0":
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.23.0.tgz#f2059434cd6e5672bfeab2fb03b7c0a20622266f"
+  integrity sha512-WAFNiTDnQfrF3Z2fQ05nmCgPsO5o790vOhmWKXbbYQTO9erE1/YsFot5/LnOUizLzU2eeuz6+U/81KV5/hFTGA==
   dependencies:
     "@types/json-schema" "^7.0.3"
-    "@typescript-eslint/scope-manager" "4.10.0"
-    "@typescript-eslint/types" "4.10.0"
-    "@typescript-eslint/typescript-estree" "4.10.0"
+    "@typescript-eslint/scope-manager" "4.23.0"
+    "@typescript-eslint/types" "4.23.0"
+    "@typescript-eslint/typescript-estree" "4.23.0"
     eslint-scope "^5.0.0"
     eslint-utils "^2.0.0"
 
 "@typescript-eslint/parser@^4.18.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/parser/download/@typescript-eslint/parser-4.10.0.tgz#1a622b0847b765b2d8f0ede6f0cdd85f03d76031"
-  integrity sha1-GmIrCEe3ZbLY8O3m8M3YXwPXYDE=
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.23.0.tgz#239315d38e42e852bef43a4b0b01bef78f78911c"
+  integrity sha512-wsvjksHBMOqySy/Pi2Q6UuIuHYbgAMwLczRl4YanEPKW5KVxI9ZzDYh3B5DtcZPQTGRWFJrfcbJ6L01Leybwug==
   dependencies:
-    "@typescript-eslint/scope-manager" "4.10.0"
-    "@typescript-eslint/types" "4.10.0"
-    "@typescript-eslint/typescript-estree" "4.10.0"
+    "@typescript-eslint/scope-manager" "4.23.0"
+    "@typescript-eslint/types" "4.23.0"
+    "@typescript-eslint/typescript-estree" "4.23.0"
     debug "^4.1.1"
 
-"@typescript-eslint/scope-manager@4.10.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/scope-manager/download/@typescript-eslint/scope-manager-4.10.0.tgz#dbd7e1fc63d7363e3aaff742a6f2b8afdbac9d27"
-  integrity sha1-29fh/GPXNj46r/dCpvK4r9usnSc=
+"@typescript-eslint/scope-manager@4.23.0":
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.23.0.tgz#8792ef7eacac122e2ec8fa2d30a59b8d9a1f1ce4"
+  integrity sha512-ZZ21PCFxPhI3n0wuqEJK9omkw51wi2bmeKJvlRZPH5YFkcawKOuRMQMnI8mH6Vo0/DoHSeZJnHiIx84LmVQY+w==
   dependencies:
-    "@typescript-eslint/types" "4.10.0"
-    "@typescript-eslint/visitor-keys" "4.10.0"
+    "@typescript-eslint/types" "4.23.0"
+    "@typescript-eslint/visitor-keys" "4.23.0"
 
-"@typescript-eslint/types@4.10.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/types/download/@typescript-eslint/types-4.10.0.tgz#12f983750ebad867f0c806e705c1953cd6415789"
-  integrity sha1-EvmDdQ662GfwyAbnBcGVPNZBV4k=
+"@typescript-eslint/types@4.23.0":
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.23.0.tgz#da1654c8a5332f4d1645b2d9a1c64193cae3aa3b"
+  integrity sha512-oqkNWyG2SLS7uTWLZf6Sr7Dm02gA5yxiz1RP87tvsmDsguVATdpVguHr4HoGOcFOpCvx9vtCSCyQUGfzq28YCw==
 
-"@typescript-eslint/typescript-estree@4.10.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/typescript-estree/download/@typescript-eslint/typescript-estree-4.10.0.tgz#1e62e45fd57866afd42daf5e9fb6bd4e8dbcfa75"
-  integrity sha1-HmLkX9V4Zq/ULa9en7a9To28+nU=
+"@typescript-eslint/typescript-estree@4.23.0":
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.23.0.tgz#0753b292097523852428a6f5a1aa8ccc1aae6cd9"
+  integrity sha512-5Sty6zPEVZF5fbvrZczfmLCOcby3sfrSPu30qKoY1U3mca5/jvU5cwsPb/CO6Q3ByRjixTMIVsDkqwIxCf/dMw==
   dependencies:
-    "@typescript-eslint/types" "4.10.0"
-    "@typescript-eslint/visitor-keys" "4.10.0"
+    "@typescript-eslint/types" "4.23.0"
+    "@typescript-eslint/visitor-keys" "4.23.0"
     debug "^4.1.1"
     globby "^11.0.1"
     is-glob "^4.0.1"
-    lodash "^4.17.15"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/visitor-keys@4.10.0":
-  version "4.10.0"
-  resolved "http://npm.rongdasoft.com:7001/@typescript-eslint/visitor-keys/download/@typescript-eslint/visitor-keys-4.10.0.tgz#9478822329a9bc8ebcc80623d7f79a01da5ee451"
-  integrity sha1-lHiCIympvI68yAYj1/eaAdpe5FE=
+"@typescript-eslint/visitor-keys@4.23.0":
+  version "4.23.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.23.0.tgz#7215cc977bd3b4ef22467b9023594e32f9e4e455"
+  integrity sha512-5PNe5cmX9pSifit0H+nPoQBXdbNzi5tOEec+3riK+ku4e3er37pKxMKDH5Ct5Y4fhWxcD4spnlYjxi9vXbSpwg==
   dependencies:
-    "@typescript-eslint/types" "4.10.0"
+    "@typescript-eslint/types" "4.23.0"
     eslint-visitor-keys "^2.0.0"
 
 "@vue/babel-helper-vue-jsx-merge-props@^1.2.1":
@@ -1490,24 +1508,24 @@
     semver "^6.1.0"
     strip-ansi "^6.0.0"
 
-"@vue/compiler-core@3.0.11", "@vue/compiler-core@3.0.4":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/compiler-core/download/@vue/compiler-core-3.0.4.tgz#0122aca6eada4cb28b39ed930af917444755e330"
-  integrity sha1-ASKspuraTLKLOe2TCvkXREdV4zA=
+"@vue/compiler-core@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.0.11.tgz#5ef579e46d7b336b8735228758d1c2c505aae69a"
+  integrity sha512-6sFj6TBac1y2cWCvYCA8YzHJEbsVkX7zdRs/3yK/n1ilvRqcn983XvpBbnN3v4mZ1UiQycTvOiajJmOgN9EVgw==
   dependencies:
     "@babel/parser" "^7.12.0"
     "@babel/types" "^7.12.0"
-    "@vue/shared" "3.0.4"
+    "@vue/shared" "3.0.11"
     estree-walker "^2.0.1"
     source-map "^0.6.1"
 
 "@vue/compiler-dom@3.0.11":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/compiler-dom/download/@vue/compiler-dom-3.0.4.tgz#834fd4b15c5698cf9f4505c2bfbccca058a843eb"
-  integrity sha1-g0/UsVxWmM+fRQXCv7zMoFioQ+s=
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.0.11.tgz#b15fc1c909371fd671746020ba55b5dab4a730ee"
+  integrity sha512-+3xB50uGeY5Fv9eMKVJs2WSRULfgwaTJsy23OIltKgMrynnIj8hTYY2UL97HCoz78aDw1VDXdrBQ4qepWjnQcw==
   dependencies:
-    "@vue/compiler-core" "3.0.4"
-    "@vue/shared" "3.0.4"
+    "@vue/compiler-core" "3.0.11"
+    "@vue/shared" "3.0.11"
 
 "@vue/compiler-sfc@^3.0.0":
   version "3.0.11"
@@ -1572,34 +1590,34 @@
   resolved "https://registry.yarnpkg.com/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz#ceb924b4ecb3b9c43871c7a429a02f8423e621ab"
   integrity sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ==
 
-"@vue/reactivity@3.0.4":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/reactivity/download/@vue/reactivity-3.0.4.tgz#b6599dd8271a745960a03f05744ccf7991ba5d8d"
-  integrity sha1-tlmd2CcadFlgoD8FdEzPeZG6XY0=
+"@vue/reactivity@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.0.11.tgz#07b588349fd05626b17f3500cbef7d4bdb4dbd0b"
+  integrity sha512-SKM3YKxtXHBPMf7yufXeBhCZ4XZDKP9/iXeQSC8bBO3ivBuzAi4aZi0bNoeE2IF2iGfP/AHEt1OU4ARj4ao/Xw==
   dependencies:
-    "@vue/shared" "3.0.4"
+    "@vue/shared" "3.0.11"
 
-"@vue/runtime-core@3.0.4":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/runtime-core/download/@vue/runtime-core-3.0.4.tgz#a5b9a001560b1fd8c01a43f68b764c555de7836c"
-  integrity sha1-pbmgAVYLH9jAGkP2i3ZMVV3ng2w=
+"@vue/runtime-core@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.0.11.tgz#c52dfc6acf3215493623552c1c2919080c562e44"
+  integrity sha512-87XPNwHfz9JkmOlayBeCCfMh9PT2NBnv795DSbi//C/RaAnc/bGZgECjmkD7oXJ526BZbgk9QZBPdFT8KMxkAg==
   dependencies:
-    "@vue/reactivity" "3.0.4"
-    "@vue/shared" "3.0.4"
+    "@vue/reactivity" "3.0.11"
+    "@vue/shared" "3.0.11"
 
 "@vue/runtime-dom@3.0.11":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/runtime-dom/download/@vue/runtime-dom-3.0.4.tgz#6f81aec545f24511d2c28a315aa3391420b69c68"
-  integrity sha1-b4GuxUXyRRHSwooxWqM5FCC2nGg=
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.0.11.tgz#7a552df21907942721feb6961c418e222a699337"
+  integrity sha512-jm3FVQESY3y2hKZ2wlkcmFDDyqaPyU3p1IdAX92zTNeCH7I8zZ37PtlE1b9NlCtzV53WjB4TZAYh9yDCMIEumA==
   dependencies:
-    "@vue/runtime-core" "3.0.4"
-    "@vue/shared" "3.0.4"
+    "@vue/runtime-core" "3.0.11"
+    "@vue/shared" "3.0.11"
     csstype "^2.6.8"
 
-"@vue/shared@3.0.11", "@vue/shared@3.0.4":
-  version "3.0.4"
-  resolved "http://npm.rongdasoft.com:7001/@vue/shared/download/@vue/shared-3.0.4.tgz#6dc50f593bdfdeaa6183d1dbc15e2d45e7c6b8b3"
-  integrity sha1-bcUPWTvf3qphg9HbwV4tRefGuLM=
+"@vue/shared@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
+  integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==
 
 "@vue/web-component-wrapper@^1.2.0":
   version "1.3.0"