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

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

@@ -0,0 +1,278 @@
+import dayjs from 'dayjs'
+import config from '/config/config'
+import { deepCopy, scrollTo, getBlobUrl } from '@gx-design-vue/pro-utils'
+
+const { viewScrollRoot } = config.defaultSettings
+
+export function timeFix() {
+  const time = new Date()
+  const hour = time.getHours()
+  return hour < 9 ? '早上好' : hour <= 11 ? '上午好' : hour <= 13 ? '中午好' : hour < 20 ? '下午好' : '晚上好'
+}
+
+/**
+ * @Author      gaoxiang
+ * @DateTime    2020/7/23
+ * @lastTime    2020/7/23
+ * @description 去除空格
+ */
+export function trim(str: string, isGlobal?: boolean) {
+  if (typeof str === 'undefined' || str.length === 0) return ''
+  let result
+  result = str.replace(/(^\s+)|(\s+$)/g, '')
+  if (isGlobal) {
+    result = result.replace(/\s/g, '')
+  }
+  return result
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2021/11/3
+ * @lastTime    2021/11/3
+ * @description get参数处理
+ */
+export function tansParams(params) {
+  let result = ''
+  for (const propName of Object.keys(params)) {
+    const value = params[propName]
+    const part = encodeURIComponent(propName) + '='
+    if (value !== null && typeof (value) !== 'undefined' && value !== '') {
+      if (typeof value === 'object') {
+        for (const key of Object.keys(value)) {
+          if (value[key] !== null && typeof (value[key]) !== 'undefined') {
+            const params = propName + '[' + key + ']'
+            const subPart = encodeURIComponent(params) + '='
+            result += subPart + encodeURIComponent(value[key]) + '&'
+          }
+        }
+      } else {
+        result += part + encodeURIComponent(value) + '&'
+      }
+    }
+  }
+  return result
+}
+
+/**
+ * @Author      gaoxiang
+ * @DateTime    2020/11/1
+ * @lastTime    2020/11/1
+ * @description 处理table多选翻页 selectItems 丢失问题
+ */
+export function handleSelectPage(config: {
+  rowKey?: string;
+  tableData: any[];
+  selectItems: any[];
+  oldSelectItems: any[];
+}) {
+  const {
+    tableData,
+    oldSelectItems,
+    selectItems,
+    rowKey = 'id'
+  } = config
+  const currentSelectItems = oldSelectItems.filter((item: any) => tableData.some(el =>
+    el[rowKey] === item[rowKey])
+  )
+  let newSelectItems = deepCopy(oldSelectItems)
+  if (currentSelectItems.length < selectItems.length) {
+    const pushItems = selectItems.filter((item: any) => !currentSelectItems.find(el =>
+      el[rowKey] === item[rowKey])
+    )
+    pushItems.map((item: any) => {
+      newSelectItems.push(item)
+      return item
+    })
+  } else {
+    const filterItems = currentSelectItems.filter((item: any) =>
+      !selectItems.find((el: any) => el[rowKey] === item[rowKey])
+    )
+    newSelectItems = newSelectItems.filter((item: any) =>
+      !filterItems.find((el: any) => el[rowKey] === item[rowKey])
+    )
+  }
+  return newSelectItems
+}
+
+/**
+ * @Author      gaoxiang
+ * @DateTime    2019/11/29
+ * @lastTime    2019/11/29
+ * @description 排序（从大到小）
+ */
+export function compareToMin(obj1: any, obj2: any, key: string) {
+  const val1 = obj1[key]
+  const val2 = obj2[key]
+  let result = 0
+  if (val1 < val2) {
+    result = 0
+  } else if (val1 > val2) {
+    result = -1
+  }
+  return result
+}
+
+/**
+ * @Author      gaoxiang
+ * @DateTime    2019/11/29
+ * @lastTime    2019/11/29
+ * @description 排序（从小到大）
+ */
+export function compareToMax(obj1: any, obj2: any, key: string) {
+  const val1 = obj1[key]
+  const val2 = obj2[key]
+  let result = 0
+  if (val1 < val2) {
+    result = -1
+  } else if (val1 > val2) {
+    result = 0
+  }
+  return result
+}
+
+function mGetDate() {
+  const date = new Date()
+  const year = date.getFullYear()
+  const month = date.getMonth() + 1
+  const d = new Date(year, month, 0)
+  return d.getDate()
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2022/8/4
+ * @lastTime    2022/8/4
+ * @description 处理时间展示（dayjs）
+ */
+export function momentFromNow(time) {
+  return dayjs(time).fromNow()
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2022/8/4
+ * @lastTime    2022/8/4
+ * @description 处理时间展示
+ */
+export function handleTimeShow(date: string) {
+  const date3 = new Date().getTime() - new Date(date.replace(/\-/g, '/')).getTime() // 时间差的毫秒数
+  const days = Math.floor(date3 / (24 * 3600 * 1000))
+  // 计算出小时数
+  const leave1 = date3 % (24 * 3600 * 1000) // 计算天数后剩余的毫秒数
+  const hours = Math.floor(leave1 / (3600 * 1000))
+  // 计算相差分钟数
+  const leave2 = leave1 % (3600 * 1000) // 计算小时数后剩余的毫秒数
+  const minutes = Math.floor(leave2 / (60 * 1000))
+  // 计算相差秒数
+  const leave3 = leave2 % (60 * 1000) // 计算分钟数后剩余的毫秒数
+  const seconds = Math.round(leave3 / 1000)
+  if (
+    days === 0 &&
+    hours === 0 &&
+    minutes === 0 &&
+    seconds < 60
+  ) {
+    return '刚刚'
+  } else if (
+    days === 0 &&
+    hours === 0 &&
+    minutes < 60
+  ) {
+    return `${minutes}分钟前`
+  } else if (
+    days === 0 &&
+    hours < 24
+  ) {
+    return `${hours}小时前`
+  } else if (
+    days < mGetDate()
+  ) {
+    return dayjs(date.replace(/\-/g, '/')).format('MM-dd hh:mm')
+  } else {
+    return dayjs(date.replace(/\-/g, '/')).format('yyyy-MM-dd')
+  }
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2021/1/11
+ * @lastTime    2021/1/11
+ * @description 图片ur地址转file对象
+ */
+export function getImageFileFromUrl(url = '', imageName: string) {
+  return new Promise((resolve) => {
+    let blob: any = null
+    const xhr = new XMLHttpRequest()
+    xhr.open('GET', url, true)
+    xhr.responseType = 'blob'
+    xhr.onload = () => {
+      blob = xhr.response
+      const imgFile = new File([ blob ], imageName, { type: 'image/png' })
+      resolve(imgFile)
+    }
+    xhr.send()
+  })
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2021/1/11
+ * @lastTime    2021/1/11
+ * @description 本地资源获取blob地址
+ */
+export function getLocalBlob(url = '') {
+  return new Promise((resolve) => {
+    let blob: any = null
+    const xhr = new XMLHttpRequest()
+    xhr.open('GET', url, true)
+    xhr.responseType = 'blob'
+    xhr.onload = () => {
+      blob = xhr.response
+      resolve(getBlobUrl(blob))
+    }
+    xhr.send()
+  })
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2022/10/11
+ * @lastTime    2022/10/11
+ * @description 判断元素到上一个元素的距离
+ */
+export function handleOffsetTop(targetNode: HTMLInputElement) {
+  let totalLeft = 0
+  let totalTop = 0
+  if (!targetNode) return { left: totalLeft, top: totalTop }
+  let parentNode = <HTMLElement>targetNode.offsetParent
+  //首先把自己本身的相加
+  totalLeft += targetNode.offsetLeft
+  totalTop += targetNode.offsetTop
+  //现在开始一级一级往上查找，只要没有遇到body，我们就把父级参照物的边框和偏移相加
+  while (parentNode) {
+    if (navigator.userAgent.indexOf('MSIE 8.0') === -1) {
+      //不是IE8我们才进行累加父级参照物的边框
+      totalTop += parentNode.clientTop
+      totalLeft += parentNode.clientLeft
+    }
+    //把父级参照物的偏移相加
+    totalTop += parentNode.offsetTop
+    totalLeft += parentNode.offsetLeft
+    parentNode = <HTMLElement>parentNode.offsetParent
+  }
+  return { left: totalLeft, top: totalTop }
+}
+
+/**
+ * @Author      gx12358
+ * @DateTime    2022/10/11
+ * @lastTime    2022/10/11
+ * @description 滚动到固定位置
+ */
+export function scrollToContainer(count: number, root?: string) {
+  scrollTo(count || 0, {
+    getContainer: () => document.querySelector(viewScrollRoot || root) as HTMLInputElement,
+    duration: 200
+  })
+}

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

@@ -0,0 +1,221 @@
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判读是否为外链
+ * @param path
+ * @returns {boolean}
+ */
+export function isExternal(path) {
+  return /^(https?:|mailto:|tel:)/.test(path)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是名称
+ * @param value
+ * @returns {boolean}
+ */
+export function isName(value) {
+  const reg = /^[\u4e00-\u9fa5a-zA-Z0-9]+$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否为IP
+ * @param ip
+ * @returns {boolean}
+ */
+export function isIP(ip) {
+  const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
+  return reg.test(ip)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是传统网站
+ * @param url
+ * @returns {boolean}
+ */
+export function isUrl(url) {
+  const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
+  return reg.test(url)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是小写字母
+ * @param value
+ * @returns {boolean}
+ */
+export function isLowerCase(value) {
+  const reg = /^[a-z]+$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是大写字母
+ * @param value
+ * @returns {boolean}
+ */
+export function isUpperCase(value) {
+  const reg = /^[A-Z]+$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是大写字母开头
+ * @param value
+ * @returns {boolean}
+ */
+export function isAlphabets(value) {
+  const reg = /^[A-Za-z]+$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是端口号
+ * @param value
+ * @returns {boolean}
+ */
+export function isPort(value) {
+  const reg = /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是手机号
+ * @param value
+ * @returns {boolean}
+ */
+export function isPhone(value) {
+  const reg = /^1\d{10}$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是身份证号(第二代)
+ * @param value
+ * @returns {boolean}
+ */
+export function isIdCard(value) {
+  const reg = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否是邮箱
+ * @param value
+ * @returns {boolean}
+ */
+export function isEmail(value) {
+  const reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否中文
+ * @param value
+ * @returns {boolean}
+ */
+export function isChina(value) {
+  const reg = /^[\u4E00-\u9FA5]{2,4}$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否为空
+ * @param value
+ * @returns {boolean}
+ */
+export function isBlank(value) {
+  return (
+    value == null ||
+    false ||
+    value === '' ||
+    value.trim() === '' ||
+    value.toLocaleLowerCase().trim() === 'null'
+  )
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断是否为固话
+ * @param value
+ * @returns {boolean}
+ */
+export function isTel(value) {
+  const reg = /^(400|800)([0-9\\-]{7,10})|(([0-9]{4}|[0-9]{3})([- ])?)?([0-9]{7,8})(([- 转])*([0-9]{1,4}))?$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断经度 -180.0～+180.0（整数部分为0～180，必须输入1到5位小数）
+ * @param value
+ * @returns {boolean}
+ */
+export function isLongitude(value) {
+  const reg = /^[-|+]?(0?\d{1,2}\.\d{1,5}|1[0-7]?\d{1}\.\d{1,5}|180\.0{1,5})$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description 判断纬度 -90.0～+90.0（整数部分为0～90，必须输入1到5位小数）
+ * @param value
+ * @returns {boolean}
+ */
+export function isLatitude(value) {
+  const reg = /^[-|+]?([0-8]?\d{1}\.\d{1,5}|90\.0{1,5})$/
+  return reg.test(value)
+}
+
+/**
+ * @author gx12358 2539306317@qq.com
+ * @description rtsp校验，只要有rtsp://
+ * @param value
+ * @returns {boolean}
+ */
+export function isRTSP(value) {
+  const reg = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
+  const reg1 = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]):[0-9]{1,5}/
+  const reg2 = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\//
+  return reg.test(value) || reg1.test(value) || reg2.test(value)
+}
+
+/**
+ * @Author      gaoxiang
+ * @DateTime    2020/11/4
+ * @lastTime    2020/11/4
+ * @description 判断是否是JSON字符串
+ */
+export function isJSONStr(str: any) {
+  if (typeof str === 'string') {
+    try {
+      const obj = JSON.parse(str)
+      if (typeof obj === 'object' && obj) {
+        return true
+      } else {
+        return false
+      }
+    } catch (e) {
+      return false
+    }
+  }
+  return false
+}
+
+export function checkURL(URL) {
+  const str = URL,
+    Expression = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/,
+    objExp = new RegExp(Expression)
+  return objExp.test(str)
+}

package/template-design-pro/src/views/Iframe/index.vue

@@ -0,0 +1,76 @@
+<template>
+  <g-pro-page-container>
+    <div :class="prefixCls" :style="frameStyle">
+      <a-spin :spinning="loading" size="large" :style="frameStyle">
+        <iframe
+          :src="frameSrc"
+          :class="[`${prefixCls}-main`]"
+          :style="frameStyle"
+          ref="frameRef"
+          allowfullscreen
+          frameBorder="0"
+          @load="hideLoading"
+        />
+      </a-spin>
+    </div>
+  </g-pro-page-container>
+</template>
+
+<script setup lang="ts">
+import { ref, computed, onMounted, onUnmounted, watch } from 'vue'
+import { useStore } from '@gx-vuex'
+import { getPrefixCls } from '@gx-design-vue/pro-utils'
+import { PropTypes } from '@/utils'
+
+const props = defineProps({
+  frameSrc: PropTypes.string.def('')
+})
+
+const store = useStore()
+
+const prefixCls = getPrefixCls({
+  suffixCls: 'iframe-page',
+  isPor: true
+})
+
+const frameRef = ref<HTMLIFrameElement>()
+const loading = ref(true)
+
+const publicHeight = computed(
+  () =>
+    store.settings.headerHeight +
+    24 * 2 +
+    (store.settings.showTabsBar ? (store.settings.fixedMultiTab ? 62 : 40) : 0)
+)
+
+const frameStyle = reactive({
+  width: '100%',
+  height: `${window.innerHeight - publicHeight.value}px`
+})
+
+watch(
+  () => props.frameSrc,
+  (_) => {
+    console.log(_)
+    loading.value = true
+  },
+  {
+    deep: true,
+    immediate: true
+  }
+)
+
+onMounted(() => {
+  window.addEventListener('resize', calcHeight)
+})
+
+onUnmounted(() => {
+  window.removeEventListener('resize', calcHeight)
+})
+
+const calcHeight = () => (frameStyle.height = `${window.innerHeight - publicHeight.value}px`)
+
+const hideLoading = () => {
+  loading.value = false
+}
+</script>

package/template-design-pro/src/views/MenuOne/index.vue

@@ -0,0 +1,15 @@
+<template>
+  <g-pro-page-container>
+    <div>123</div>
+  </g-pro-page-container>
+</template>
+
+<script setup lang='ts'>
+onMounted(() => {
+  console.log(123)
+})
+</script>
+
+<style lang='less' module>
+
+</style>

package/template-design-pro/src/views/MenuTwo/index.vue

@@ -0,0 +1,13 @@
+<template>
+  <g-pro-page-container>
+    <div>123</div>
+  </g-pro-page-container>
+</template>
+
+<script setup lang='ts'>
+
+</script>
+
+<style lang='less' module>
+
+</style>

package/template-design-pro/src/views/exception/403/index.vue

@@ -0,0 +1,9 @@
+<template>
+  <g-result status="403" />
+</template>
+
+<script setup lang="ts">
+import GResult from '@/components/GDesign/Result'
+</script>
+
+<style lang="less" scoped></style>

package/template-design-pro/src/views/exception/404/index.vue

@@ -0,0 +1,9 @@
+<template>
+  <g-result status="404" />
+</template>
+
+<script setup lang="ts">
+import GResult from '@/components/GDesign/Result'
+</script>
+
+<style lang="less" scoped></style>