From fa11b1bc648c5f95e09be9dc696a0d2fd908cb9a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E4=BC=A0=E9=BE=99?= <zclzone@outlook.com>
Date: Sat, 25 Jun 2022 13:47:30 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dcommon=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E5=A4=B9=E5=A4=A7=E5=B0=8F=E5=86=99=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/AppProvider.vue         |  55 -------
 src/components/common/ScrollX.vue             | 143 ------------------
 .../{Common => commons}/AppProvider.vue       |   0
 .../{Common => commons}/ScrollX.vue           |   0
 4 files changed, 198 deletions(-)
 delete mode 100644 src/components/common/AppProvider.vue
 delete mode 100644 src/components/common/ScrollX.vue
 rename src/components/{Common => commons}/AppProvider.vue (100%)
 rename src/components/{Common => commons}/ScrollX.vue (100%)

diff --git a/src/components/common/AppProvider.vue b/src/components/common/AppProvider.vue
deleted file mode 100644
index 43902f9..0000000
--- a/src/components/common/AppProvider.vue
+++ /dev/null
@@ -1,55 +0,0 @@
-<template>
-  <n-config-provider :theme-overrides="themStore.naiveThemeOverrides">
-    <n-loading-bar-provider>
-      <n-dialog-provider>
-        <n-notification-provider>
-          <n-message-provider>
-            <slot></slot>
-            <NaiveProviderContent />
-          </n-message-provider>
-        </n-notification-provider>
-      </n-dialog-provider>
-    </n-loading-bar-provider>
-  </n-config-provider>
-</template>
-
-<script setup>
-import { defineComponent, h } from 'vue'
-import { useLoadingBar, useDialog, useMessage, useNotification } from 'naive-ui'
-
-import { useCssVar } from '@vueuse/core'
-import { useThemeStore } from '@/store/modules/theme'
-import { setupMessage, setupDialog } from '@/utils/common/naiveTools'
-
-const themStore = useThemeStore()
-watch(
-  () => themStore.naiveThemeOverrides.common,
-  (vars) => {
-    for (const key in vars) {
-      useCssVar(`--${key}`, document.documentElement).value = vars[key]
-      if (key === 'primaryColor') {
-        window.localStorage.setItem('__THEME_COLOR__', vars[key])
-      }
-    }
-  },
-  { immediate: true }
-)
-
-// 挂载naive组件的方法至window, 以便在全局使用
-function setupNaiveTools() {
-  window.$loadingBar = useLoadingBar()
-  window.$notification = useNotification()
-
-  window.$message = setupMessage(useMessage())
-  window.$dialog = setupDialog(useDialog())
-}
-
-const NaiveProviderContent = defineComponent({
-  setup() {
-    setupNaiveTools()
-  },
-  render() {
-    return h('div')
-  },
-})
-</script>
diff --git a/src/components/common/ScrollX.vue b/src/components/common/ScrollX.vue
deleted file mode 100644
index 4956b38..0000000
--- a/src/components/common/ScrollX.vue
+++ /dev/null
@@ -1,143 +0,0 @@
-<template>
-  <div ref="wrapper" class="tags-wrapper" @mousewheel.prevent="handleMouseWheel">
-    <template v-if="showArrow && isOverflow">
-      <div class="left" @click="handleMouseWheel({ wheelDelta: 50 })">
-        <icon-ic:baseline-keyboard-arrow-left />
-      </div>
-      <div class="right" @click="handleMouseWheel({ wheelDelta: -50 })">
-        <icon-ic:baseline-keyboard-arrow-right />
-      </div>
-    </template>
-
-    <div
-      ref="content"
-      class="tags-content"
-      :class="{ overflow: isOverflow && showArrow }"
-      :style="{
-        height: height + 'px',
-        transform: `translateX(${translateX}px)`,
-      }"
-    >
-      <slot />
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { debounce } from '@/utils'
-import { isNullOrUndef } from '@/utils/is'
-
-defineProps({
-  height: {
-    type: Number,
-    default: 50,
-  },
-  showArrow: {
-    type: Boolean,
-    default: true,
-  },
-})
-
-onMounted(() => {
-  refreshIsOverflow()
-})
-
-const translateX = ref(0)
-const content = ref(null)
-const wrapper = ref(null)
-const isOverflow = ref(false)
-
-function refreshIsOverflow(isIncrease) {
-  isOverflow.value = content.value.offsetWidth > wrapper.value.offsetWidth
-  if (isNullOrUndef(isIncrease)) return
-  if (isOverflow.value) {
-    handleMouseWheel({ wheelDelta: isIncrease ? -100 : 100 })
-  } else if (!isIncrease && translateX.value < 0) {
-    handleMouseWheel({ wheelDelta: 100 })
-  }
-}
-function handleMouseWheel(e) {
-  const { wheelDelta } = e
-  const wrapperWidth = wrapper.value.offsetWidth
-  const contentWidth = content.value.offsetWidth
-  /**
-   * @wheelDelta 平行滚动的值 >0： 右移  <0: 左移
-   * @translateX 内容translateX的值
-   * @wrapperWidth 容器的宽度
-   * @contentWidth 内容的宽度
-   */
-  if (wheelDelta < 0 && -translateX.value > contentWidth - wrapperWidth + 10) {
-    return
-  }
-  if (wheelDelta > 0 && translateX.value > 10) {
-    return
-  }
-
-  translateX.value += wheelDelta
-
-  resetTranslateX(wrapperWidth, contentWidth)
-}
-
-const resetTranslateX = debounce(function (wrapperWidth, contentWidth) {
-  if (!isOverflow.value) {
-    translateX.value = 0
-  } else if (-translateX.value > contentWidth - wrapperWidth) {
-    translateX.value = wrapperWidth - contentWidth
-  } else if (translateX.value > 0) {
-    translateX.value = 0
-  }
-}, 200)
-
-defineExpose({
-  refreshIsOverflow,
-})
-</script>
-
-<style lang="scss" scoped>
-.tags-wrapper {
-  display: flex;
-  background-color: #fff;
-  position: sticky;
-  top: 0;
-  z-index: 9;
-  overflow: hidden;
-  .tags-content {
-    padding: 0 10px;
-    display: flex;
-    align-items: center;
-    flex-wrap: nowrap;
-    transition: transform 0.5s;
-    &.overflow {
-      padding-left: 30px;
-      padding-right: 30px;
-    }
-  }
-  .left,
-  .right {
-    background-color: #fff;
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    margin: auto;
-
-    width: 20px;
-    height: 35px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    font-size: 18px;
-    border: 1px solid #e0e0e6;
-    border-radius: 2px;
-
-    z-index: 2;
-    cursor: pointer;
-  }
-  .left {
-    left: 0;
-  }
-  .right {
-    right: 0;
-  }
-}
-</style>
diff --git a/src/components/Common/AppProvider.vue b/src/components/commons/AppProvider.vue
similarity index 100%
rename from src/components/Common/AppProvider.vue
rename to src/components/commons/AppProvider.vue
diff --git a/src/components/Common/ScrollX.vue b/src/components/commons/ScrollX.vue
similarity index 100%
rename from src/components/Common/ScrollX.vue
rename to src/components/commons/ScrollX.vue