refactor: folders

src/api/index.js

@@ -1,4 +1,4 @@
-import request from '@/utils/http'
+import { request } from '@/utils'
 
 export default {
   getUser: () => request.get('/user'),

src/components/common/AppProvider.vue

@@ -18,7 +18,7 @@ import { defineComponent, h } from 'vue'
 import { useLoadingBar, useDialog, useMessage, useNotification } from 'naive-ui'
 import { useCssVar } from '@vueuse/core'
 import { kebabCase } from 'lodash-es'
-import { setupMessage, setupDialog } from '@/utils/common/naiveTools'
+import { setupMessage, setupDialog } from '@/utils'
 import { naiveThemeOverrides } from '~/settings'
 
 function setupCssVar() {

src/components/icon/TheIcon.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { renderIcon, renderCustomIcon } from '@/utils/icon'
+import { renderIcon, renderCustomIcon } from '@/utils'
 
 const props = defineProps({
   icon: {

src/components/query-bar/QueryBarItem.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script setup>
-import { isNullOrWhitespace } from '@/utils/is'
+import { isNullOrWhitespace } from '@/utils'
 
 defineProps({
   label: {

src/composables/useCRUD.js

@@ -1,4 +1,4 @@
-import { isNullOrWhitespace } from '@/utils/is'
+import { isNullOrWhitespace } from '@/utils'
 
 const ACTIONS = {
   view: '查看',

src/layout/components/AppMain.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script setup>
-import { useAppStore } from '@/store/modules/app'
+import { useAppStore } from '@/store'
 import { useRouter } from 'vue-router'
 const appStore = useAppStore()
 const router = useRouter()

src/layout/components/header/components/BreadCrumb.vue

@@ -12,7 +12,7 @@
 </template>
 
 <script setup>
-import { renderCustomIcon, renderIcon } from '@/utils/icon'
+import { renderCustomIcon, renderIcon } from '@/utils'
 
 const router = useRouter()
 const route = useRoute()

src/layout/components/header/components/MenuCollapse.vue

@@ -6,7 +6,7 @@
 </template>
 
 <script setup>
-import { useAppStore } from '@/store/modules/app'
+import { useAppStore } from '@/store'
 
 const appStore = useAppStore()
 </script>

src/layout/components/header/components/UserAvatar.vue

@@ -8,8 +8,8 @@
 </template>
 
 <script setup>
-import { useUserStore } from '@/store/modules/user'
-import { renderIcon } from '@/utils/icon'
+import { useUserStore } from '@/store'
+import { renderIcon } from '@/utils'
 
 const userStore = useUserStore()
 

src/layout/components/sidebar/components/SideLogo.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script setup>
-import { useAppStore } from '@/store/modules/app'
+import { useAppStore } from '@/store'
 const title = import.meta.env.VITE_TITLE
 
 const appStore = useAppStore()

src/layout/components/sidebar/components/SideMenu.vue

@@ -12,11 +12,8 @@
 </template>
 
 <script setup>
-import { usePermissionStore } from '@/store/modules/permission'
-
-import { isExternal } from '@/utils/is'
-import { useAppStore } from '@/store/modules/app'
-import { renderCustomIcon, renderIcon } from '@/utils/icon'
+import { usePermissionStore, useAppStore } from '@/store'
+import { renderCustomIcon, renderIcon, isExternal } from '@/utils'
 
 const router = useRouter()
 const curRoute = useRoute()

src/layout/components/tags/ContextMenu.vue

@@ -11,9 +11,8 @@
 </template>
 
 <script setup>
-import { useTagsStore } from '@/store/modules/tags'
-import { renderIcon } from '@/utils/icon'
-import { useAppStore } from '@/store/modules/app'
+import { useTagsStore, useAppStore } from '@/store'
+import { renderIcon } from '@/utils'
 
 const props = defineProps({
   show: {

src/layout/components/tags/index.vue

@@ -24,7 +24,7 @@
 
 <script setup>
 import ContextMenu from './ContextMenu.vue'
-import { useTagsStore } from '@/store/modules/tags'
+import { useTagsStore } from '@/store'
 import ScrollX from '@/components/common/ScrollX.vue'
 
 const route = useRoute()

src/layout/index.vue

@@ -30,7 +30,7 @@ import AppHeader from './components/header/index.vue'
 import SideBar from './components/sidebar/index.vue'
 import AppMain from './components/AppMain.vue'
 import AppTags from './components/tags/index.vue'
-import { useAppStore } from '@/store/modules/app'
+import { useAppStore } from '@/store'
 import { header, tags } from '~/settings'
 
 const appStore = useAppStore()

src/main.js

@@ -1,6 +1,7 @@
+/** 重置样式 */
 import '@/styles/reset.css'
-import '@/styles/index.scss'
 import 'uno.css'
+import '@/styles/global.scss'
 import 'virtual:svg-icons-register'
 
 import { createApp } from 'vue'

src/router/guard/permission-guard.js

@@ -1,5 +1,4 @@
-import { getToken, refreshAccessToken } from '@/utils/token'
-import { isNullOrWhitespace } from '@/utils/is'
+import { getToken, refreshAccessToken, isNullOrWhitespace } from '@/utils'
 
 const WHITE_LIST = ['/login', '/404']
 export function createPermissionGuard(router) {

src/router/index.js

@@ -1,10 +1,8 @@
 import { createRouter, createWebHistory, createWebHashHistory } from 'vue-router'
 import { setupRouterGuard } from './guard'
 import { basicRoutes as routes, EMPTY_ROUTE, NOT_FOUND_ROUTE } from './routes'
-import { getToken } from '@/utils/token'
-import { isNullOrWhitespace } from '@/utils/is'
-import { useUserStore } from '@/store/modules/user'
-import { usePermissionStore } from '@/store/modules/permission'
+import { getToken, isNullOrWhitespace } from '@/utils'
+import { useUserStore, usePermissionStore } from '@/store'
 
 const isHash = import.meta.env.VITE_USE_HASH === 'true'
 export const router = createRouter({

src/store/index.js

@@ -3,3 +3,5 @@ import { createPinia } from 'pinia'
 export function setupStore(app) {
   app.use(createPinia())
 }
+
+export * from './modules'

src/store/modules/index.js

@@ -0,0 +1,4 @@
+export * from './app'
+export * from './permission'
+export * from './tags'
+export * from './user'

src/store/modules/tags/helpers.js

@@ -1,4 +1,4 @@
-import { sStorage } from '@/utils/cache'
+import { sStorage } from '@/utils'
 
 export const activeTag = sStorage.get('activeTag')
 export const tags = sStorage.get('tags')

src/store/modules/tags/index.js

@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia'
 import { activeTag, tags, WITHOUT_TAG_PATHS } from './helpers'
 import { router } from '@/router'
-import { sStorage } from '@/utils/cache'
+import { sStorage } from '@/utils'
 
 export const useTagsStore = defineStore('tag', {
   state() {

src/store/modules/user/index.js

@@ -1,6 +1,5 @@
 import { defineStore } from 'pinia'
-import { removeToken } from '@/utils/token'
-import { toLogin } from '@/utils/auth'
+import { removeToken, toLogin } from '@/utils'
 import api from '@/api'
 
 export const useUserStore = defineStore('user', {

src/styles/global.scss

@@ -1,14 +1,16 @@
-html {
-  font-size: 4px; // * 1rem = 4px  方便unocss计算：在unocss中 1字体单位 = 0.25rem，相当于 1等份 = 1px
-}
-
 html,
 body {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  background-color: #f2f2f2;
-  font-family: 'Encode Sans Condensed', sans-serif;
+}
+
+html {
+  font-size: 4px; // * 1rem = 4px  方便unocss计算：在unocss中 1字体单位 = 0.25rem，相当于 1等份 = 1px
+}
+
+body {
+  font-size: 16px;
 }
 
 #app {
@@ -16,7 +18,7 @@ body {
   height: 100%;
 }
 
-/* router view transition fade-slide */
+/* transition fade-slide */
 .fade-slide-leave-active,
 .fade-slide-enter-active {
   transition: all 0.3s;
@@ -32,7 +34,6 @@ body {
   transform: translateX(30px);
 }
 
-/* 自定义滚动条样式 */
 /* 自定义滚动条样式 */
 .cus-scroll {
   overflow: auto;

src/styles/reset.css

@@ -33,8 +33,3 @@ textarea {
   border: none;
   resize: none;
 }
-
-body {
-  font-size: 14px;
-  font-weight: 400;
-}

src/utils/auth/index.js

@@ -0,0 +1,2 @@
+export * from './auth'
+export * from './token'

src/utils/auth/token.js

@@ -1,4 +1,4 @@
-import { lStorage } from './cache'
+import { lStorage } from '@/utils'
 import api from '@/api'
 
 const TOKEN_CODE = 'access_token'

src/utils/common/common.js

@@ -0,0 +1,76 @@
+import dayjs from 'dayjs'
+
+/**
+ * @desc  格式化时间
+ * @param {(Object|string|number)} time
+ * @param {string} format
+ * @returns {string | null}
+ */
+export function formatDateTime(time = undefined, format = 'YYYY-MM-DD HH:mm:ss') {
+  return dayjs(time).format(format)
+}
+
+export function formatDate(date = undefined, format = 'YYYY-MM-DD') {
+  return formatDateTime(date, format)
+}
+
+/**
+ * @desc  函数节流
+ * @param {Function} fn
+ * @param {Number} wait
+ * @returns {Function}
+ */
+export function throttle(fn, wait) {
+  var context, args
+  var previous = 0
+
+  return function () {
+    var now = +new Date()
+    context = this
+    args = arguments
+    if (now - previous > wait) {
+      fn.apply(context, args)
+      previous = now
+    }
+  }
+}
+
+/**
+ * @desc  函数防抖
+ * @param {Function} func
+ * @param {number} wait
+ * @param {boolean} immediate
+ * @return {*}
+ */
+export function debounce(method, wait, immediate) {
+  let timeout
+  return function (...args) {
+    let context = this
+    if (timeout) {
+      clearTimeout(timeout)
+    }
+    // 立即执行需要两个条件，一是immediate为true，二是timeout未被赋值或被置为null
+    if (immediate) {
+      /**
+       * 如果定时器不存在，则立即执行，并设置一个定时器，wait毫秒后将定时器置为null
+       * 这样确保立即执行后wait毫秒内不会被再次触发
+       */
+      let callNow = !timeout
+      timeout = setTimeout(() => {
+        timeout = null
+      }, wait)
+      if (callNow) {
+        method.apply(context, args)
+      }
+    } else {
+      // 如果immediate为false，则函数wait毫秒后执行
+      timeout = setTimeout(() => {
+        /**
+         * args是一个类数组对象，所以使用fn.apply
+         * 也可写作method.call(context, ...args)
+         */
+        method.apply(context, args)
+      }, wait)
+    }
+  }
+}

src/utils/common/index.js

@@ -0,0 +1,4 @@
+export * from './common'
+export * from './is'
+export * from './icon'
+export * from './naiveTools'

src/utils/common/naiveTools.js

@@ -1,4 +1,4 @@
-import { isNullOrUndef } from '@/utils/is'
+import { isNullOrUndef } from '@/utils'
 
 export function setupMessage(NMessage) {
   let loadingMessage = null

src/utils/http/helpers.js

@@ -1,7 +1,5 @@
-import { useUserStore } from '@/store/modules/user'
-import { isNullOrUndef } from '@/utils/is'
-import { removeToken } from '@/utils/token'
-import { toLogin } from '@/utils/auth'
+import { useUserStore } from '@/store'
+import { isNullOrUndef, removeToken, toLogin } from '@/utils'
 
 export function addBaseParams(params) {
   if (!params.userId) {

src/utils/http/index.js

@@ -14,6 +14,6 @@ export function createAxios(options = {}) {
   return service
 }
 
-export default createAxios({
+export const request = createAxios({
   baseURL: import.meta.env.VITE_BASE_API,
 })

src/utils/http/interceptors.js

@@ -1,5 +1,4 @@
-import { getToken } from '@/utils/token'
-import { toLogin } from '@/utils/auth'
+import { getToken, toLogin } from '@/utils'
 import { resolveResError } from './helpers'
 
 export function reqResolve(config) {

src/utils/index.js

@@ -1,76 +1,4 @@
-import dayjs from 'dayjs'
-
-/**
- * @desc  格式化时间
- * @param {(Object|string|number)} time
- * @param {string} format
- * @returns {string | null}
- */
-export function formatDateTime(time = undefined, format = 'YYYY-MM-DD HH:mm:ss') {
-  return dayjs(time).format(format)
-}
-
-export function formatDate(date = undefined, format = 'YYYY-MM-DD') {
-  return formatDateTime(date, format)
-}
-
-/**
- * @desc  函数节流
- * @param {Function} fn
- * @param {Number} wait
- * @returns {Function}
- */
-export function throttle(fn, wait) {
-  var context, args
-  var previous = 0
-
-  return function () {
-    var now = +new Date()
-    context = this
-    args = arguments
-    if (now - previous > wait) {
-      fn.apply(context, args)
-      previous = now
-    }
-  }
-}
-
-/**
- * @desc  函数防抖
- * @param {Function} func
- * @param {number} wait
- * @param {boolean} immediate
- * @return {*}
- */
-export function debounce(method, wait, immediate) {
-  let timeout
-  return function (...args) {
-    let context = this
-    if (timeout) {
-      clearTimeout(timeout)
-    }
-    // 立即执行需要两个条件，一是immediate为true，二是timeout未被赋值或被置为null
-    if (immediate) {
-      /**
-       * 如果定时器不存在，则立即执行，并设置一个定时器，wait毫秒后将定时器置为null
-       * 这样确保立即执行后wait毫秒内不会被再次触发
-       */
-      let callNow = !timeout
-      timeout = setTimeout(() => {
-        timeout = null
-      }, wait)
-      if (callNow) {
-        method.apply(context, args)
-      }
-    } else {
-      // 如果immediate为false，则函数wait毫秒后执行
-      timeout = setTimeout(() => {
-        /**
-         * args是一个类数组对象，所以使用fn.apply
-         * 也可写作method.call(context, ...args)
-         */
-        method.apply(context, args)
-      }, wait)
-    }
-  }
-}
+export * from './common'
+export * from './storage'
+export * from './http'
+export * from './auth'

src/utils/storage/storage.js

@@ -1,4 +1,4 @@
-import { isNullOrUndef } from '@/utils/is'
+import { isNullOrUndef } from '@/utils'
 
 class Storage {
   constructor(option) {

src/views/demo/table/api.js

@@ -1,4 +1,4 @@
-import request from '@/utils/http'
+import { request } from '@/utils'
 
 export default {
   getPosts: (params = {}) => request.get('posts', { params }),

src/views/demo/table/index.vue

@@ -82,11 +82,9 @@
 
 <script setup>
 import { NButton, NSwitch } from 'naive-ui'
-import { formatDateTime } from '@/utils'
-import { renderIcon } from '@/utils/icon'
+import { formatDateTime, renderIcon, isNullOrUndef } from '@/utils'
 import { useCRUD } from '@/composables'
 import api from './api'
-import { isNullOrUndef } from '@/utils/is'
 
 defineOptions({ name: 'CrudTable' })
 

src/views/login/api.js

@@ -1,4 +1,4 @@
-import request from '@/utils/http'
+import { request } from '@/utils'
 
 export default {
   login: (data) => request.post('/auth/login', data, { noNeedToken: true }),

src/views/login/index.vue

@@ -46,8 +46,7 @@
 </template>
 
 <script setup>
-import { lStorage } from '@/utils/cache'
-import { setToken } from '@/utils/token'
+import { lStorage, setToken } from '@/utils'
 import { useStorage } from '@vueuse/core'
 import bgImg from '@/assets/images/login_bg.webp'
 import api from './api'

src/views/workbench/index.vue

@@ -52,7 +52,7 @@
 </template>
 
 <script setup>
-import { useUserStore } from '@/store/modules/user'
+import { useUserStore } from '@/store'
 
 const userStore = useUserStore()
 </script>