@gx-design-vue/create-gx-cli 0.0.3 → 0.0.5

package/template-design-pro/src/store/modules/user.ts

@@ -0,0 +1,153 @@
+import { reactive, toRefs } from 'vue'
+import { defineStore } from 'pinia'
+import { message, notification } from 'ant-design-vue'
+import config from '/config/config'
+import { getUserInfo, login, logout } from '@/services/controller/user'
+import { getAccessToken, removeAccessToken, setAccessToken } from '@/utils/accessToken'
+import { timeFix } from '@/utils/util'
+import { useStoreRoutes } from './routes'
+import { useStorePermission } from './permission'
+import { useStoreTabsRouter } from './tabsRouter'
+
+const { tokenName } = config.defaultSettings
+
+interface RolesInfo {
+  roleId: number;
+  roleKey: string;
+  roleName: string;
+  status: string;
+}
+
+export interface UserInfo {
+  admin?: boolean;
+  userId?: number;
+  roles?: RolesInfo[];
+  roleIds?: number[];
+  userName?: string;
+  nickName?: string;
+  avatar?: string;
+  loginDate?: string;
+}
+
+export interface UserState {
+  accessToken: string;
+  userInfo: UserInfo;
+  userName: string;
+  loginName: string;
+  avatar: string;
+}
+
+export const useStoreUser = defineStore('user', () => {
+  const routes = useStoreRoutes()
+  const auth = useStorePermission()
+  const tabsRouter = useStoreTabsRouter()
+
+  const state = reactive({
+    accessToken: getAccessToken(),
+    userInfo: {},
+    userName: '',
+    loginName: '',
+    avatar: ''
+  } as UserState)
+
+  /**
+   * @Author      gx12358
+   * @DateTime    2022/1/11
+   * @lastTime    2022/1/11
+   * @description 登录拦截放行时，设置虚拟角色
+   */
+  const setVirtualRoles = () => {
+    auth.changeValue('admin', true)
+    state.avatar = 'https://i.gtimg.cn/club/item/face/img/2/15922_100.gif'
+    state.userName = 'admin(未开启登录拦截)'
+    return true
+  }
+
+  /**
+   * @Author      gx12358
+   * @DateTime    2022/1/11
+   * @lastTime    2022/1/11
+   * @description 登录
+   */
+  const userLogin = async (params) => {
+    const response: any = await login(params)
+    const accessToken = response?.data?.[tokenName]
+    if (accessToken) {
+      const expires_in = response?.data?.expires_in
+      state.accessToken = accessToken
+      setAccessToken(accessToken, expires_in ? expires_in * 60 * 1000 : 0)
+      return true
+    }
+    return false
+  }
+
+  /**
+   * @Author      gx12358
+   * @DateTime    2022/1/11
+   * @lastTime    2022/1/11
+   * @description 获取用户信息
+   */
+  const queryUserInfo = async () => {
+    const response: any = await getUserInfo()
+    const { roles, user, permissions } = response
+    if (!user || Object.keys(user).length === 0) {
+      message.error(`验证失败，请重新登录...`)
+      return false
+    }
+    const { userName, avatar, nickName } = user as UserInfo
+    if (userName && roles && Array.isArray(roles)) {
+      auth.changeValue('role', roles)
+      auth.changeValue('ability', permissions)
+      state.userName = userName
+      state.loginName = nickName
+      state.avatar = avatar
+      state.userInfo = user
+      notification.success({
+        message: `欢迎登录${userName}`,
+        description: `${timeFix()}！`
+      })
+    } else {
+      message.error('用户信息接口异常')
+      return false
+    }
+    return true
+  }
+
+  const updateUserInfo = (params: UserInfo) => {
+    Object.assign(state.userInfo, { ...params })
+  }
+
+  /**
+   * @Author      gx12358
+   * @DateTime    2022/5/15
+   * @lastTime    2022/5/15
+   * @description 用户退出登录
+   */
+  const userLogut = async () => {
+    await logout({
+      userName: state.userName
+    })
+    resetPermissions()
+  }
+
+  const resetPermissions = () => {
+    state.accessToken = ''
+    setAccessToken('')
+    auth.changeValue('admin', false)
+    auth.changeValue('role', [])
+    auth.changeValue('ability', [])
+    routes.resetRoute()
+    tabsRouter.blankingTabs()
+    removeAccessToken()
+  }
+
+  return {
+    ...toRefs(state),
+    userLogin,
+    userLogut,
+    queryUserInfo,
+    updateUserInfo,
+    setVirtualRoles,
+    resetPermissions
+  }
+})

package/template-design-pro/src/utils/accessToken.ts

@@ -0,0 +1,93 @@
+import config from '/config/config'
+import {
+  setStorage,
+  getStorage,
+  removeStorage,
+  getCookie,
+  setCookie,
+  delCookie
+} from '@/utils/storage'
+
+const { storage, tokenTableName } = config.defaultSettings
+
+/**
+ * @Author      gx12358
+ * @DateTime    2021/12/27
+ * @lastTime    2021/12/27
+ * @description 获取accessToken
+ */
+export function getAccessToken() {
+  if (storage) {
+    if ('localStorage' === storage) {
+      return getStorage({ key: tokenTableName })
+    } else if ('sessionStorage' === storage) {
+      return getStorage({ key: tokenTableName, type: 'session' })
+    } else if ('cookie' === storage) {
+      return getCookie(tokenTableName)
+    } else {
+      return getStorage({ key: tokenTableName })
+    }
+  } else {
+    return getStorage({ key: tokenTableName })
+  }
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 存储accessToken
+ * @param accessToken
+ * @returns {void|*}
+ */
+export function setAccessToken(accessToken: string, expired?: number) {
+  if (storage) {
+    if ('localStorage' === storage) {
+      return setStorage({
+        key: tokenTableName,
+        value: accessToken,
+        expired
+      })
+    } else if ('sessionStorage' === storage) {
+      return setStorage({
+        key: tokenTableName,
+        value: accessToken,
+        expired,
+        type: 'session'
+      })
+    } else if ('cookie' === storage) {
+      return setCookie(tokenTableName, accessToken, expired)
+    } else {
+      return setStorage({
+        key: tokenTableName,
+        value: accessToken,
+        expired
+      })
+    }
+  } else {
+    return setStorage({
+      key: tokenTableName,
+      value: accessToken,
+      expired
+    })
+  }
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 移除accessToken
+ * @returns {void|Promise<void>}
+ */
+export function removeAccessToken() {
+  if (storage) {
+    if ('localStorage' === storage) {
+      return removeStorage(tokenTableName)
+    } else if ('sessionStorage' === storage) {
+      return removeStorage(tokenTableName, 'session')
+    } else if ('cookie' === storage) {
+      return delCookie(tokenTableName)
+    } else {
+      return removeStorage(tokenTableName)
+    }
+  } else {
+    return removeStorage(tokenTableName)
+  }
+}

package/template-design-pro/src/utils/fetchFile.ts

@@ -0,0 +1,79 @@
+import type { Method } from 'axios'
+import { message } from 'ant-design-vue'
+import config from '/config/config'
+import { useStoreUser } from '@gx-vuex'
+import { tansParams } from '@/utils/util'
+
+const { tokenName } = config.defaultSettings
+
+export type DownLoadRequestConfig<D = any> = {
+  url: string;
+  method?: Method | string;
+  headers?: HeadersInit;
+  data?: D;
+  params?: any;
+  name?: string; // 下载的名称
+  direct?: boolean; // 是否直接使用url进行请求
+  read?: boolean; // 返回下载地址，不下载
+  showTip?: boolean; // 展示下载中字样
+}
+
+export default async function fetchFile(options: DownLoadRequestConfig): Promise<boolean | string> {
+  const user = useStoreUser()
+  if (options.showTip) {
+    message.loading({
+      content: `下载中，请耐心等待。。。。`,
+      key: 'updatable',
+      duration: 0
+    })
+  }
+  const opations: RequestInit = {
+    method: options.method,
+    headers: {
+      'Content-Type': 'application/json',
+      ...options.headers
+    }
+  }
+  if (!options.direct) options.url = `${import.meta.env.VITE_BASE_URL}${options.url}`
+  if (user.accessToken && !options.direct)
+    opations.headers[tokenName] = `${user.accessToken}`
+  if (options.params) {
+    let url = options.url + '?' + tansParams(options.params)
+    url = url.slice(0, -1)
+    options.url = url
+  }
+  if (options.method === 'post' && options.data) {
+    opations.body = JSON.stringify(options.data)
+  }
+  const response = await fetch(options.url, opations)
+  const fileName = options.name
+    ? options.name
+    : response.headers.get('content-disposition')
+      ? response.headers.get('content-disposition').split(';')[1].split('=')[1]
+      : ''
+  const blobResponse = await response.blob()
+  if (blobResponse) {
+    const a = window.document.createElement('a')
+    const downUrl = window.URL.createObjectURL(blobResponse)
+    if (options.read) return downUrl
+    a.href = downUrl
+    a.download = `${decodeURI(fileName)}`
+    a.click()
+    if (options.showTip) {
+      message.success({
+        content: `下载成功`,
+        key: 'updatable'
+      })
+    }
+    window.URL.revokeObjectURL(downUrl)
+    return true
+  } else {
+    if (options.showTip) {
+      message.success({
+        content: `下载失败`,
+        key: 'updatable'
+      })
+    }
+    return false
+  }
+}

package/template-design-pro/src/utils/index.ts

@@ -0,0 +1,127 @@
+import PropTypes from 'ant-design-vue/es/_util/vue-types'
+
+export { PropTypes }
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 将url请求参数转为json格式
+ * @param url
+ * @returns {{}|any}
+ */
+export function paramObj(url) {
+  const search = url.split('?')[1]
+  if (!search) {
+    return {}
+  }
+  return JSON.parse(
+    '{"' +
+    decodeURIComponent(search)
+      .replace(/"/g, '\\"')
+      .replace(/&/g, '","')
+      .replace(/=/g, '":"')
+      .replace(/\+/g, ' ') +
+    '"}'
+  )
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 父子关系的数组转换成树形结构数据
+ * @param data
+ * @returns {*}
+ */
+export function translateDataToTree(data) {
+  const parent = data.filter(
+    (value) => value.parentId === 'undefined' || value.parentId == null
+  )
+  const children = data.filter(
+    (value) => value.parentId !== 'undefined' && value.parentId != null
+  )
+  const translator = (parent, children) => {
+    parent.forEach((parent) => {
+      children.forEach((current, index) => {
+        if (current.parentId === parent.id) {
+          const temp = JSON.parse(JSON.stringify(children))
+          temp.splice(index, 1)
+          translator([ current ], temp)
+          typeof parent.children !== 'undefined'
+            ? parent.children.push(current)
+            : (parent.children = [ current ])
+        }
+      })
+    })
+  }
+  translator(parent, children)
+  return parent
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 树形结构数据转换成父子关系的数组
+ * @param data
+ * @returns {[]}
+ */
+export function translateTreeToData(data) {
+  const result: any[] = []
+  data.forEach((item) => {
+    const loop = (data) => {
+      result.push({
+        id: data.id,
+        name: data.name,
+        parentId: data.parentId
+      })
+      const child = data.children
+      if (child) {
+        for (let i = 0; i < child.length; i++) {
+          loop(child[i])
+        }
+      }
+    }
+    loop(item)
+  })
+  return result
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 10位时间戳转换
+ * @param time
+ * @returns {string}
+ */
+export function tenBitTimestamp(time) {
+  const date = new Date(time * 1000)
+  const y = date.getFullYear()
+  let m: any = date.getMonth() + 1
+  m = m < 10 ? '' + m : m
+  let d: any = date.getDate()
+  d = d < 10 ? '' + d : d
+  let h: any = date.getHours()
+  h = h < 10 ? '0' + h : h
+  let minute: any = date.getMinutes()
+  let second: any = date.getSeconds()
+  minute = minute < 10 ? '0' + minute : minute
+  second = second < 10 ? '0' + second : second
+  return y + '年' + m + '月' + d + '日 ' + h + ':' + minute + ':' + second //组合
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 13位时间戳转换
+ * @param time
+ * @returns {string}
+ */
+export function thirteenBitTimestamp(time) {
+  const date = new Date(time / 1)
+  const y = date.getFullYear()
+  let m: any = date.getMonth() + 1
+  m = m < 10 ? '' + m : m
+  let d: any = date.getDate()
+  d = d < 10 ? '' + d : d
+  let h: any = date.getHours()
+  h = h < 10 ? '0' + h : h
+  let minute: any = date.getMinutes()
+  let second: any = date.getSeconds()
+  minute = minute < 10 ? '0' + minute : minute
+  second = second < 10 ? '0' + second : second
+  return y + '年' + m + '月' + d + '日 ' + h + ':' + minute + ':' + second //组合
+}

package/template-design-pro/src/utils/pageTitle.ts

@@ -0,0 +1,17 @@
+import config from '/config/config'
+
+const { title, titleReverse, titleSeparator } = config.defaultSettings
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 设置标题
+ * @param pageTitle
+ * @returns {string}
+ */
+export default function getPageTitle(pageTitle: string) {
+  let newTitles: any = []
+  if (pageTitle) newTitles.push(pageTitle)
+  if (title) newTitles.push(title)
+  if (titleReverse) newTitles = newTitles.reverse()
+  return newTitles.join(titleSeparator)
+}

package/template-design-pro/src/utils/request/XHR.ts

@@ -0,0 +1,131 @@
+import type { AxiosResponse, AxiosError } from 'axios'
+import axios from 'axios'
+import { cloneDeep } from 'lodash-unified'
+import qs from 'qs'
+import { isFunction } from '@gx-design-vue/pro-utils'
+import type { GAxiosInstance, GAxiosOptions } from './typings'
+import { ContentTypeEnum, RequestEnum } from './typings'
+import { AxiosCanceler } from './axiosCancel'
+
+/**
+ * @Author      gx12358
+ * @DateTime    2023/1/6
+ * @lastTime    2023/1/6
+ * @description 重新定义axios
+ */
+export class GAxios {
+  private axiosInstance: GAxiosInstance
+  private readonly options: GAxiosOptions
+
+  constructor(options: GAxiosOptions) {
+    this.options = options
+    this.axiosInstance = axios.create(options)
+    this.setupInterceptors()
+  }
+
+  /**
+   * @description: Interceptor configuration 拦截器配置
+   */
+  private setupInterceptors() {
+    const {
+      requestInterceptors,
+      requestInterceptorsCatch,
+      responseInterceptors,
+      responseInterceptorsCatch
+    } = this.options
+
+    const axiosCanceler = new AxiosCanceler()
+
+    this.axiosInstance.interceptors.request.use((config: GAxiosOptions) => {
+      const { ignoreCancelToken } = config
+      const ignoreCancel =
+        ignoreCancelToken !== undefined
+          ? ignoreCancelToken
+          : this.options?.ignoreCancelToken
+
+      !ignoreCancel && axiosCanceler.addPending(config)
+      if (requestInterceptors && isFunction(requestInterceptors)) {
+        config = requestInterceptors(config)
+      }
+      return config
+    }, undefined)
+
+    // Request interceptor error capture
+    requestInterceptorsCatch &&
+    isFunction(requestInterceptorsCatch) &&
+    this.axiosInstance.interceptors.request.use(undefined, requestInterceptorsCatch)
+
+    // Response result interceptor processing
+    this.axiosInstance.interceptors.response.use((res: AxiosResponse) => {
+      res && axiosCanceler.removePending(res.config)
+      if (responseInterceptors && isFunction(responseInterceptors)) {
+        return responseInterceptors(res)
+      }
+      return res
+    }, undefined)
+
+    // Response result interceptor error capture
+    responseInterceptorsCatch &&
+    isFunction(responseInterceptorsCatch) &&
+    this.axiosInstance.interceptors.response.use(undefined, (error) => {
+      return responseInterceptorsCatch(this.axiosInstance, error)
+    })
+  }
+
+  // support form-data
+  supportFormData(config: GAxiosOptions) {
+    const headers = config.headers || this.options.headers
+    const contentType = headers?.['Content-Type'] || headers?.['content-type']
+
+    if (
+      contentType !== ContentTypeEnum.FORM_URLENCODED ||
+      !Reflect.has(config, 'data') ||
+      config.method?.toUpperCase() === RequestEnum.GET
+    ) {
+      return config
+    }
+
+    return {
+      ...config,
+      data: qs.stringify(config.data, { arrayFormat: 'brackets' })
+    }
+  }
+
+  request<T = ResponseResult | boolean>(config: GAxiosOptions): Promise<T> {
+    let conf: GAxiosOptions = cloneDeep(config)
+
+    const opt: GAxiosOptions = Object.assign({}, this.options, conf)
+
+    const { beforeRequestHook, requestCatchHook, transformResponseHook } = opt
+    if (beforeRequestHook && isFunction(beforeRequestHook)) {
+      conf = beforeRequestHook(opt)
+    }
+
+    conf = this.supportFormData(opt)
+
+    return new Promise((resolve) => {
+      this.axiosInstance
+        .request<any, AxiosResponse>(conf)
+        .then((res: AxiosResponse) => {
+          if (transformResponseHook && isFunction(transformResponseHook)) {
+            try {
+              const ret = transformResponseHook(res, config)
+              resolve(ret)
+            } catch (err) {
+              resolve(false as any)
+              return
+            }
+            return
+          }
+          resolve(res as unknown as Promise<T>)
+        })
+        .catch((e: Error | AxiosError) => {
+          if (requestCatchHook && isFunction(requestCatchHook)) {
+            resolve(requestCatchHook(e) as any)
+            return
+          }
+          resolve(false as any)
+        })
+    })
+  }
+}

package/template-design-pro/src/utils/request/checkStatus.ts

@@ -0,0 +1,26 @@
+import { useStoreUser } from '@/store'
+import { message } from 'ant-design-vue'
+import { router } from '@/router'
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 处理code异常
+ * @param {*} code
+ * @param {*} msg
+ */
+export const handleCode = (code: number, msg: string) => {
+  const user = useStoreUser()
+  switch (code) {
+    case 401:
+      message.error(msg || '登录失效')
+      user.resetPermissions()
+      router.push({ path: '/user/login' })
+      break
+    case 403:
+      router.push({ path: '/exception/403' })
+      break
+    default:
+      message.error(msg || `后端接口${code}异常`)
+      break
+  }
+}