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

package/template-design-pro/src/components/GDesign/ProLayout/style.less

@@ -1,272 +0,0 @@
-@import './default.less';
-
-@import './BasicLayout.less';
-@import './components/GlobalHeader/Header.less';
-@import './components/GlobalHeader/style.less';
-@import './components/RightContent/style.less';
-@import './components/SiderMenu/style.less';
-@import './components/PageContainer/style.less';
-@import './components/MultiTab/style.less';
-
-.@{gx-prefix-pro} {
-  &-watermark-wrapper {
-    position: relative;
-  }
-
-  &-basic-layout {
-    .@{gx-prefix-pro} {
-      &-header-search {
-        display: inline-flex;
-        align-items: center;
-
-        &-input {
-          width: 0;
-          min-width: 0;
-          overflow: hidden;
-          background: transparent;
-          border-radius: 0;
-          transition: width 0.3s, margin-left 0.3s;
-
-          :global(.ant-select-selection) {
-            background: transparent;
-          }
-
-          input {
-            box-shadow: none !important;
-          }
-        }
-
-        &-show {
-          width: 210px;
-          margin-left: 8px;
-        }
-      }
-
-      &-right-content-action {
-        &.gx-pro-header-search {
-          padding: 0 12px;
-        }
-      }
-    }
-  }
-
-  &-global-footer {
-    padding: 0 16px;
-    margin: 48px 0 24px;
-    text-align: center;
-  }
-
-  &-global-footer-links {
-    margin-bottom: 8px;
-
-    a {
-      color: rgba(0, 0, 0, 0.45);
-      transition: all 0.3s;
-
-      &:not(:last-child) {
-        margin-right: 40px;
-      }
-    }
-  }
-
-  &-global-footer-copyright {
-    font-size: 14px;
-    color: @text-color-secondary;
-
-    a {
-      color: @text-color-secondary;
-
-      &:hover {
-        color: @text-color-secondary;
-      }
-    }
-  }
-
-  &-setting-drawer {
-    &-handle {
-      position: absolute;
-      top: 240px;
-      right: 300px;
-      z-index: 1;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: 48px;
-      height: 48px;
-      font-size: 16px;
-      text-align: center;
-      pointer-events: auto;
-      cursor: pointer;
-      background: var(--ant-primary-color);
-      border-radius: 4px 0 0 4px;
-    }
-
-    &-content {
-      position: relative;
-      min-height: 100%;
-      padding: 24px;
-    }
-
-    &-title {
-      margin-bottom: 12px;
-      font-size: 14px;
-      line-height: 22px;
-      color: rgba(0, 0, 0, 0.85);
-    }
-
-    &-block-checbox {
-      display: flex;
-
-      &-item {
-        position: relative;
-        width: 44px;
-        height: 36px;
-        margin-right: 16px;
-        overflow: hidden;
-        cursor: pointer;
-        background-color: #f0f2f5;
-        border-radius: 4px;
-        box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 18%);
-
-        &::before {
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 33%;
-          height: 100%;
-          content: '';
-          background-color: @white;
-        }
-
-        &::after {
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 100%;
-          height: 25%;
-          content: '';
-          background-color: @white;
-        }
-
-        &-light {
-          &::before {
-            content: '';
-            background-color: @white;
-          }
-
-          &::after {
-            background-color: @white;
-          }
-        }
-
-        &-dark {
-          &::before {
-            content: '';
-            background-color: #001529;
-          }
-
-          &::after {
-            background-color: #001529;
-          }
-        }
-
-        &-side {
-          &::before {
-            z-index: 1;
-            content: '';
-            background-color: #001529;
-          }
-
-          &::after {
-            background-color: @white;
-          }
-        }
-
-        &-mix {
-          &::before {
-            content: '';
-            background-color: @white;
-          }
-
-          &::after {
-            background-color: #001529;
-          }
-        }
-
-        &-simple {
-          &::before {
-            content: '';
-            background-color: @white;
-          }
-
-          &::after {
-            display: none;
-          }
-        }
-      }
-
-      &-selectIcon {
-        position: absolute;
-        right: 6px;
-        bottom: 4px;
-        font-size: 14px;
-        font-weight: 700;
-        color: var(--ant-primary-color);
-        pointer-events: none;
-      }
-    }
-
-    &-theme-color {
-      &-content {
-        margin-top: 16px;
-        overflow: hidden;
-      }
-
-      .gx-pro-setting-drawer-theme-color-block {
-        float: left;
-        width: 20px;
-        height: 20px;
-        margin-top: 8px;
-        margin-right: 8px;
-        font-weight: 700;
-        color: @white;
-        text-align: center;
-        cursor: pointer;
-        border-radius: 2px;
-      }
-    }
-  }
-
-  &-dropdown-container {
-    & > * {
-      background-color: #fff;
-      border-radius: 4px;
-      box-shadow: 0 6px 16px -8px rgb(0 0 0 / 8%), 0 9px 28px 0 rgb(0 0 0 / 5%),
-        0 12px 48px 16px rgb(0 0 0 / 3%);
-    }
-  }
-}
-
-@media screen and (max-width: @screen-xs) {
-  html {
-    body {
-      .gx-pro-dropdown-container {
-        width: 100% !important;
-      }
-
-      .gx-pro-dropdown-container > * {
-        border-radius: 0 !important;
-      }
-    }
-  }
-}
-
-@media only screen and (max-width: @screen-md) {
-  html {
-    body {
-      .gx-pro-header-search {
-        display: none;
-      }
-    }
-  }
-}

package/template-design-pro/src/components/GDesign/ProLayout/typings.ts

@@ -1 +0,0 @@
-export type ProProps = Record<never, never>

package/template-design-pro/src/components/GDesign/ProLayout/utils/getMenuData.ts

@@ -1,31 +0,0 @@
-export { clearMenuItem, flatMap, getMenuFirstChildren } from './index'
-
-export type MenuData = {
-  menuData: AppRouteModule[];
-  breadcrumb: RecordType;
-};
-
-const formatRelativePath = (
-  routes: AppRouteModule[],
-  breadcrumb: RecordType
-): AppRouteModule[] => {
-  // 计算路由绝对路径
-  return routes.map(route => {
-    route.path = route.path.replace('//', '/')
-    // format children routes
-    if (route.children && route.children.length > 0) {
-      route.children = formatRelativePath(route.children, breadcrumb)
-    }
-    breadcrumb[`${route.path}`] = route
-    return route
-  })
-}
-
-export const getMenuData = (routes: AppRouteModule[]): MenuData => {
-  const childrenRoute = routes.find(route => route.path === '/')
-  const breadcrumb: RecordType = {}
-  return {
-    menuData: formatRelativePath(childrenRoute?.children || ([] as AppRouteModule[]), breadcrumb),
-    breadcrumb
-  }
-}

package/template-design-pro/src/components/GDesign/ProLayout/utils/index.ts

@@ -1,94 +0,0 @@
-export { default as isUrl } from './isUrl'
-export { default as isImg } from './isImg'
-
-export function clearMenuItem(menusData: AppRouteModule[]): AppRouteModule[] {
-  return menusData
-    .map((item: AppRouteModule) => {
-      const finalItem = { ...item }
-      if (!finalItem.name || finalItem.meta?.hideInMenu) {
-        return null
-      }
-
-      if (finalItem && finalItem?.children) {
-        if (
-          finalItem.children.some(
-            (child: AppRouteModule) => child && child.name && !child.meta?.hideInMenu
-          )
-        ) {
-          return {
-            ...item,
-            children: clearMenuItem(finalItem.children)
-          }
-        }
-        delete finalItem.children
-      }
-      return finalItem
-    })
-    .filter(item => item) as AppRouteModule[]
-}
-
-export function flatMap(menusData: AppRouteModule[]): AppRouteModule[] {
-  return menusData
-    .map(item => {
-      const finalItem = { ...item } as AppRouteModule
-      if (!finalItem.name || finalItem.meta?.hideInMenu) {
-        return null
-      }
-      finalItem.linkPath = getMenuFirstLastChildPath(finalItem.children || [])
-
-      if (finalItem.children) {
-        delete finalItem.children
-      }
-      return finalItem
-    })
-    .filter(item => item) as any[]
-}
-
-export function getMenuFirstChildren(menus: AppRouteModule[], key?: string) {
-  const menuKey = (key || '').split('/').length === 2
-    ? (key || '')
-    : `/${(key || '').split('/')[1]}`
-  return key === undefined
-    ? []
-    : (menus[menus.findIndex(menu => menu.path === menuKey)] || {}).children || []
-}
-
-export function getMenuFirstLastChildPath(data: AppRouteModule[]): string {
-  let newPath = ''
-  const getRoutePath = function (newdata) {
-    let firstPath = ''
-    if (newdata.children && newdata.children.length > 0) {
-      firstPath = getRoutePath(newdata.children[0])
-    } else {
-      firstPath = `${newdata.path}`
-    }
-    return firstPath
-  }
-  if (data.length > 0 && data[0].children && data[0].children.length > 0) {
-    newPath = getRoutePath(data[0].children[0])
-  } else {
-    newPath = data.length > 0 ? data[0].path : ''
-  }
-  return newPath
-}
-
-export interface Attrs {
-  [key: string]: string;
-}
-
-export type StringKeyOf<T> = Extract<keyof T, string>;
-
-export type EventHandlers<E> = {
-  [K in StringKeyOf<E>]?: E[K] extends Function ? E[K] : (payload: E[K]) => void;
-};
-
-/**
- * Creates an object composed of the picked object properties.
- * @param obj The source object
- * @param paths The property paths to pick
- */
-export function pick<T, K extends keyof T>(obj: T, paths: K[]): Pick<T, K> {
-  return {
-    ...paths.reduce((mem, key) => ({ ...mem, [key]: obj[key] }), {}),
-  } as Pick<T, K>
-}

package/template-design-pro/src/components/GDesign/ProLayout/utils/isImg/index.ts

@@ -1,6 +0,0 @@
-/** 判断是否是图片链接 */
-function isImg(path: string): boolean {
-  return /\w.(png|jpg|jpeg|svg|webp|gif|bmp)$/i.test(path)
-}
-
-export default isImg

package/template-design-pro/src/components/GDesign/ProLayout/utils/isUrl/index.ts

@@ -1,5 +0,0 @@
-const reg = /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/
-
-const isUrl = (path: string): boolean => reg.test(path)
-
-export default isUrl

package/template-design-pro/src/components/GDesign/Result/index.tsx

@@ -1,142 +0,0 @@
-import { defineComponent, onMounted, reactive, watch, onBeforeUnmount, computed } from 'vue'
-import { Row, Col } from 'ant-design-vue'
-import { useStore } from '@gx-vuex'
-import { useRouter } from 'vue-router'
-import Result403 from '@/assets/error_images/403.png'
-import Result404 from '@/assets/error_images/404.png'
-import ResultCloud from '@/assets/error_images/cloud.png'
-import './style.less'
-
-export interface subInfo {
-  headline: string
-  info: string
-  exceptionImage: string
-}
-
-interface resultSubInfo {
-  404: subInfo
-  403: subInfo
-}
-
-interface resultState {
-  jumpTime: number
-  oops: string
-  headline: string
-  info: string
-  btn: string
-  timer: number | any
-  exceptionImage: any
-}
-
-const resultSubInfo: resultSubInfo = {
-  '404': {
-    headline: '当前页面不存在...',
-    info: '请检查您输入的网址是否正确，或点击下面的按钮返回首页。',
-    exceptionImage: Result404
-  },
-  '403': {
-    headline: '您没有操作角色...',
-    info: '当前帐号没有操作角色,请联系管理员。',
-    exceptionImage: Result403
-  }
-}
-
-export default defineComponent({
-  props: {
-    status: {
-      type: String,
-      required: true,
-      default: '404'
-    }
-  },
-  setup(props) {
-    const store = useStore()
-    const router = useRouter()
-
-    const routers = computed(() => store.routes.routes)
-
-    const backRouter = computed(() => (routers.value?.length ? '/' : '/user/login'))
-
-    const state = reactive<resultState>({
-      jumpTime: 5,
-      oops: '抱歉!',
-      headline: '您没有操作角色...',
-      info: '当前帐号没有操作角色,请联系管理员。',
-      btn: `${routers.value?.length ? '返回首页' : '返回登录页'}`,
-      timer: 0,
-      exceptionImage: Result404
-    })
-
-    onMounted(() => {
-      timeChange()
-    })
-
-    onBeforeUnmount(() => {
-      clearInterval(state.timer)
-    })
-
-    watch(
-      () => props.status,
-      (val: string) => {
-        Object.keys(resultSubInfo).map((item: string) => {
-          if (item === val) {
-            Object.keys(resultSubInfo[item]).map((el: any) => {
-              state[el] = resultSubInfo[item][el]
-              return el
-            })
-          }
-          return item
-        })
-      },
-      {
-        deep: true,
-        immediate: true
-      }
-    )
-
-    const timeChange = () => {
-      state.timer = setInterval(() => {
-        if (state.jumpTime) {
-          state.jumpTime--
-        } else {
-          handleBackRouter()
-        }
-      }, 1000)
-    }
-
-    const handleBackRouter = () => {
-      router.push({ path: backRouter.value })
-      if (routers.value?.length) {
-        store.tabsRouter.delOthersVisitedRoutes({ path: '/' })
-      } else {
-        store.user.resetPermissions()
-      }
-      clearInterval(state.timer)
-    }
-
-    return () => (
-      <div class="error-container">
-        <div class="error-content">
-          <Row gutter={20}>
-            <Col lg={12} md={12} sm={24} xl={12} xs={24}>
-              <div class="pic-error">
-                <img class="pic-error-parent" src={state.exceptionImage} />
-                <img class={['pic-error-child', 'left']} src={ResultCloud} />
-              </div>
-            </Col>
-            <Col lg={12} md={12} sm={24} xl={12} xs={24}>
-              <div class="bullshit">
-                <div class="bullshit-oops">{state.oops}</div>
-                <div class="bullshit-headline">{state.headline}</div>
-                <div class="bullshit-info">{state.info}</div>
-                <a class="bullshit-return-home" onClick={() => handleBackRouter()}>
-                  {state.jumpTime}s&nbsp;{state.btn}
-                </a>
-              </div>
-            </Col>
-          </Row>
-        </div>
-      </div>
-    )
-  }
-})

package/template-design-pro/src/components/GDesign/Result/style.less

@@ -1,140 +0,0 @@
-.error-container {
-  position: relative;
-  height: 100vh;
-
-  .error-content {
-    position: absolute;
-    top: 55%;
-    left: 50%;
-    width: 40vw;
-    height: 400px;
-    transform: translate(-50%, -50%);
-
-    .pic-error {
-      position: relative;
-      float: left;
-      width: 100%;
-      overflow: hidden;
-
-      .pic-error-parent {
-        width: 100%;
-      }
-
-      .pic-error-child {
-        position: absolute;
-
-        &.left {
-          top: 17px;
-          left: 220px;
-          width: 80px;
-          opacity: 0;
-          animation-name: cloudLeft;
-          animation-duration: 2s;
-          animation-timing-function: linear;
-          animation-delay: 1s;
-          animation-fill-mode: forwards;
-        }
-
-        @keyframes cloudLeft {
-          0% {
-            top: 17px;
-            left: 220px;
-            opacity: 0;
-          }
-
-          20% {
-            top: 33px;
-            left: 188px;
-            opacity: 1;
-          }
-
-          80% {
-            top: 81px;
-            left: 92px;
-            opacity: 1;
-          }
-
-          100% {
-            top: 97px;
-            left: 60px;
-            opacity: 0;
-          }
-        }
-      }
-    }
-
-    .bullshit {
-      position: relative;
-      float: left;
-      width: 300px;
-      padding: 30px 0;
-      overflow: hidden;
-
-      .bullshit-oops {
-        margin-bottom: 20px;
-        font-size: 32px;
-        font-weight: bold;
-        line-height: 40px;
-        opacity: 0;
-        animation-name: slideUp;
-        animation-duration: 0.5s;
-        animation-fill-mode: forwards;
-      }
-
-      .bullshit-headline {
-        margin-bottom: 10px;
-        font-size: 20px;
-        font-weight: bold;
-        line-height: 24px;
-        color: #222;
-        opacity: 0;
-        animation-name: slideUp;
-        animation-duration: 0.5s;
-        animation-delay: 0.1s;
-        animation-fill-mode: forwards;
-      }
-
-      .bullshit-info {
-        margin-bottom: 30px;
-        font-size: 13px;
-        line-height: 21px;
-        opacity: 0;
-        animation-name: slideUp;
-        animation-duration: 0.5s;
-        animation-delay: 0.2s;
-        animation-fill-mode: forwards;
-      }
-
-      .bullshit-return-home {
-        display: block;
-        float: left;
-        width: 110px;
-        height: 36px;
-        font-size: 14px;
-        line-height: 36px;
-        color: #fff;
-        text-align: center;
-        cursor: pointer;
-        background: var(--ant-primary-color);
-        border-radius: 100px;
-        opacity: 0;
-        animation-name: slideUp;
-        animation-duration: 0.5s;
-        animation-delay: 0.3s;
-        animation-fill-mode: forwards;
-      }
-    }
-  }
-}
-
-@keyframes slideUp {
-  0% {
-    opacity: 0;
-    transform: translateY(60px);
-  }
-
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}