@gx-design-vue/create-gx-cli 0.1.16 → 0.1.18

package/template-mobile-vant-cli/src/design/mixin.less

@@ -1,65 +0,0 @@
-//一些less函数
-
-.scrollbar() {
-  &::-webkit-scrollbar {
-    width: 6px;
-    height: 6px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background-color: rgba(50, 50, 50, 30%);
-    border-radius: 1em;
-  }
-
-  &::-webkit-scrollbar-track {
-    background-color: rgba(50, 50, 50, 10%);
-    border-radius: 1em;
-  }
-}
-
-.textOverflow() {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  word-break: break-all;
-  white-space: nowrap;
-}
-
-.reset() {
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-  font-size: 100%;
-  vertical-align: baseline;
-  border: 0;
-  outline: 0;
-}
-
-.clearfix() {
-  &::before,
-  &::after {
-    display: table;
-    content: '';
-    height: 0;
-    clear: both;
-    font-size: 0;
-    visibility: hidden;
-  }
-}
-
-.centerContent() {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  z-index: 999;
-  transform: translate(-50%, -50%);
-}
-
-.relative() {
-  position: relative;
-}
-
-.overHidden() {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}

package/template-mobile-vant-cli/src/design/reset.less

@@ -1,39 +0,0 @@
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-}
-
-html {
-  font-size: var(--van-font-size-lg);
-  color-scheme: light;
-}
-
-html.dark {
-  background: #222;
-  color-scheme: dark;
-}
-
-#app {
-  height: 100%;
-  position: relative;
-  overflow-x: hidden;
-}
-
-::-webkit-scrollbar {
-  width: 0;
-  background: transparent;
-}
-
-.fl {
-  float: left;
-}
-
-.fr {
-  float: right;
-}
-
-.clearfix {
-  zoom: 1;
-  .clearfix()
-}

package/template-mobile-vant-cli/src/design/root.less

@@ -1,3 +0,0 @@
-:root {
-  --gx-mobile-layout-bg: #ffffff;
-}

package/template-mobile-vant-cli/src/hooks/web/index.ts

@@ -1,5 +0,0 @@
-import usePageLoading from './usePageLoading'
-
-export {
-  usePageLoading
-}

package/template-mobile-vant-cli/src/hooks/web/usePageLoading.ts

@@ -1,56 +0,0 @@
-import type { PageLoadingTpe } from '@/components/PageContainer'
-import type { Ref } from 'vue'
-import { showLoadingToast } from 'vant'
-import { ref, watch } from 'vue'
-
-export interface SetLoadingParams<T> {
-  value: T;
-  type?: PageLoadingTpe;
-  message?: string
-}
-
-type ChangeLoadingFn<T> = ({ value, type, message }: SetLoadingParams<T>) => void
-
-export default function usePageLoading<T, R = Ref<T>>({
-  defaultType,
-  defaultMessage,
-  defaultLoading
-}: {
-  defaultType?: PageLoadingTpe;
-  defaultMessage?: string;
-  defaultLoading?: T | (() => T);
-}): [ R, ChangeLoadingFn<T> ] {
-  const initValue: T = typeof defaultLoading === 'function' ? (defaultLoading as any)() : defaultLoading
-
-  const loadingToast = ref()
-  const pageLoading = ref(initValue) as Ref<T>
-  const loadingMessage = ref(defaultMessage)
-  const loadingType = ref(defaultType)
-
-  watch(() => pageLoading.value, (val) => {
-    if (val) {
-      if (loadingType.value === 'toast') {
-        loadingToast.value = showLoadingToast({
-          duration: 0,
-          forbidClick: true,
-          message: loadingMessage.value || '加载中'
-        })
-        return
-      }
-    }
-
-    loadingToast.value?.close()
-  }, {
-    deep: true,
-    immediate: true
-  })
-
-  const changeLoading = ({ value, type, message }: SetLoadingParams<T>) => {
-    pageLoading.value = value
-    loadingMessage.value = message
-    if (type)
-      loadingType.value = type
-  }
-
-  return [ pageLoading as unknown as R, changeLoading ]
-}

package/template-mobile-vant-cli/src/layout/BasicLayout/index.vue

@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import TabsMenu from '@/components/TabsMenu/index.vue'
-</script>
-
-<template>
-  <div :class="$style['basic-layout']">
-    <RouterView>
-      <template #default="{ Component }">
-        <component :is="Component" />
-      </template>
-    </RouterView>
-    <TabsMenu />
-  </div>
-</template>
-
-<style lang="less" module>
-@import './style';
-</style>

package/template-mobile-vant-cli/src/layout/BasicLayout/style.less

@@ -1,3 +0,0 @@
-.basic-layout {
-  height: 100%;
-}

package/template-mobile-vant-cli/src/layout/UserLayout/index.vue

@@ -1,18 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  <div :class="$style.userLayout">
-    <RouterView>
-      <template #default="{ Component }">
-        <component :is="Component" />
-      </template>
-    </RouterView>
-  </div>
-  <div :class="$style.layouBg" />
-</template>
-
-<style module lang="less">
-@import "./style.module";
-</style>

package/template-mobile-vant-cli/src/layout/UserLayout/style.module.less

@@ -1,36 +0,0 @@
-.userLayout {
-  --at-apply: relative;
-}
-
-.layouBg {
-  z-index: -1;
-  pointer-events: none;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  transform: scale(1.5);
-  opacity: 0.2;
-  filter: blur(69px);
-  will-change: transform;
-  animation-timeline: auto;
-  animation-range-start: normal;
-  animation-range-end: normal;
-  background: linear-gradient(135deg, rgb(114, 46, 209) 0%, rgb(22, 119, 255) 30%, rgb(245, 34, 45) 70%, rgb(19, 194, 194) 100%) 0% 0% / 200% 200%;
-  animation: 10s ease 0s infinite normal none running glow;
-}
-
-@keyframes glow {
-  0% {
-    background-position: 0px -100%;
-  }
-  
-  50% {
-    background-position: 200% 50%;
-  }
-  
-  100% {
-    background-position: 0px -100%;
-  }
-}

package/template-mobile-vant-cli/src/main.ts

@@ -1,34 +0,0 @@
-import { createApp } from 'vue'
-
-import App from './App.vue'
-import { setupGlobCommon } from './core'
-import { router, setupRouter } from './router'
-import { setupRouterGuard } from './router/guard'
-import { setupStore } from './store'
-
-import 'virtual:uno.css'
-import 'vant/es/toast/style'
-import './design/index.less'
-
-// plugins
-import './plugins'
-
-function startApp() {
-  const app = createApp(App)
-
-  // store
-  setupStore(app)
-
-  // global
-  setupGlobCommon(app)
-
-  // route
-  setupRouter(app)
-
-  // guardRoute
-  setupRouterGuard(router)
-
-  app.mount('#app')
-}
-
-startApp()

package/template-mobile-vant-cli/src/pages/Account/details.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-
-</script>
-
-<template>
-  <g-page-container nav>
-    这里是账号详情
-  </g-page-container>
-</template>
-
-<style scoped lang="less">
-
-</style>

package/template-mobile-vant-cli/src/pages/Account/index.vue

@@ -1,102 +0,0 @@
-<script setup lang="ts">
-import multiavatar from '@multiavatar/multiavatar/esm'
-
-const { user } = useStore()
-const router = useRouter()
-
-const svgCode = multiavatar(user.userInfo.userId)
-
-function toDetails() {
-  router.push('/account/detail')
-}
-</script>
-
-<template>
-  <g-page-container wrapperClass="h-full" bg-color="transparent" style="height: calc(100vh - var(--van-tabbar-height));">
-    <div class="bg" />
-    <div class="flex-center pt-15 pb-30">
-      <img src="@/assets/logo.png" class="w-60" alt="">
-    </div>
-    <div class="card flex gap-20 p-20">
-      <div class="w-60 h-60 rd-50% overflow-hidden flex-shrink" v-html="svgCode" @click="toDetails" />
-      <div class="flex-main flex-col flex justify-between">
-        <div class="text-14 font-bold flex items-center gap-10">
-          <span @click="toDetails">{{ user.userInfo.nickName }}</span>
-          <van-tag color="#7232dd" class="!px-8 !text-10">会员</van-tag>
-        </div>
-        <div class="flex flex-col gap-2 text-12 text-hex-999">
-          <div class="text-hidden-1" @click="toDetails">{{ user.userInfo.remark }}</div>
-          <div flex gap-10 items-center>
-            <van-progress class="flex-main relative top-1.5" :percentage="50" stroke-width="4" :show-pivot="false" />
-            <span>5/10</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="card px-20 py-15">
-      <div class="card-item">
-        <span class="font-bold text-13">我的订单</span>
-        <van-icon class="text-hex-999 text-13" name="arrow" />
-      </div>
-      <div class="card-item">
-        <span class="font-bold text-13">我的地址</span>
-        <van-icon class="text-hex-999 text-13" name="arrow" />
-      </div>
-    </div>
-  </g-page-container>
-</template>
-
-<style scoped lang="less">
-.card {
-  --at-apply: bg-hex-fff rd-6 overflow-hidden;
-  
-  & +.card {
-    --at-apply: mt-20;
-  }
-  
-  .card-item {
-    --at-apply: flex items-center justify-between bd-b-main pb-15;
-    
-    & + .card-item {
-      --at-apply: pt-15;
-    }
-    
-    &:last-child {
-      --at-apply: pb-0;
-      border-bottom: 0;
-    }
-  }
-}
-.bg {
-  z-index: -1;
-  pointer-events: none;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  transform: scale(1.5);
-  opacity: 0.2;
-  filter: blur(69px);
-  will-change: transform;
-  animation-timeline: auto;
-  animation-range-start: normal;
-  animation-range-end: normal;
-  background: linear-gradient(135deg, rgb(114, 46, 209) 0%, rgb(22, 119, 255) 30%, rgb(245, 34, 45) 70%, rgb(19, 194, 194) 100%) 0% 0% / 200% 200%;
-  animation: 10s ease 0s infinite normal none running glow;
-}
-
-@keyframes glow {
-  0% {
-    background-position: 0px -100%;
-  }
-  
-  50% {
-    background-position: 200% 50%;
-  }
-  
-  100% {
-    background-position: 0px -100%;
-  }
-}
-</style>

package/template-mobile-vant-cli/src/pages/Home/index.vue

@@ -1,71 +0,0 @@
-<script setup lang="ts">
-import { isBoolean } from '@gx-design-vue/pro-utils'
-
-const loading = ref(false)
-const pageContainer = ref()
-const loadingMsg = ref('加载中')
-const hiddenSlot = ref(true)
-
-const init = (val?: boolean) => {
-  loadingMsg.value = '加载中'
-  loading.value = true
-  
-  if (isBoolean(val))
-    hiddenSlot.value = val
-  
-  setTimeout(() => {
-    loading.value = false
-  }, 200)
-}
-
-onMounted(() => {
-  init()
-})
-
-const changeLoading = (message: string) => {
-  loadingMsg.value = message
-  loading.value = true
-  hiddenSlot.value = false
-  
-  setTimeout(() => {
-    loading.value = false
-  }, 1000)
-}
-
-const toggleLoading = (hiddenSlot: boolean, message?: string) => {
-  pageContainer.value?.toggleLoading({
-    value: true,
-    hiddenSlot,
-    message
-  })
-  
-  setTimeout(() => {
-    pageContainer.value?.toggleLoading({
-      value: false,
-      hiddenSlot
-    })
-  }, 1000)
-}
-</script>
-
-<template>
-  <g-page-container
-    ref="pageContainer"
-    v-model:loading="loading"
-    :loadingMsg="loadingMsg"
-    :hiddenSlot="hiddenSlot"
-  >
-    <div style="display: flex;flex-direction: column;gap: 20px;">
-      <p>以下刷新只针对toast</p>
-      <van-button @click="init(true)">刷新（隐藏子组件）</van-button>
-      <van-button @click="init(false)">刷新（不隐藏子组件）</van-button>
-      <van-button @click="changeLoading('切换中')">切换loading提示语</van-button>
-      <van-button @click="toggleLoading(true)">刷新-调用方法-隐藏</van-button>
-      <van-button @click="toggleLoading(false)">刷新-调用方法-不隐藏</van-button>
-      <van-button @click="toggleLoading(false, '切换中')">刷新-调用方法-不隐藏-切换提示语</van-button>
-    </div>
-  </g-page-container>
-</template>
-
-<style lang="less" scoped>
-</style>

package/template-mobile-vant-cli/src/pages/user/login/index.vue

@@ -1,74 +0,0 @@
-<script setup lang="ts">
-import { reactive } from 'vue'
-
-interface UserState {
-  userName: string
-  password: string
-}
-
-const { user } = useStore()
-const router = useRouter()
-
-const loading = ref(false)
-
-const userForm = reactive<UserState>({
-  userName: 'admin',
-  password: 'gx.design'
-})
-
-const userRules = reactive({
-  userName: [ { required: true, message: '用户名是必填项！' } ],
-  password: [ { required: true, message: '密码是必填项！' } ]
-})
-
-const handleSubmit = async () => {
-  const response = await user.userLogin(toRaw(userForm))
-  if (response) {
-    router.push({ path: '/' })
-  }
-}
-</script>
-
-<template>
-  <div class="h-100vh w-full flex flex-col items-center pt-150">
-    <img class="h-40" src="@/assets/logo.png" alt="logo">
-    <div class="mt-50 w-75%">
-      <van-form validate-trigger="onSubmit">
-        <div class="overflow-hidden rounded-3xl">
-          <van-field
-            v-model="userForm.userName"
-            :rules="userRules.userName"
-            name="userName"
-            placeholder="用户名: admin"
-          />
-        </div>
-        
-        <div class="mt-24 overflow-hidden rounded-3xl">
-          <van-field
-            v-model="userForm.password"
-            type="password"
-            :rules="userRules.password"
-            name="password"
-            placeholder="密码: gx.design"
-          />
-        </div>
-        
-        <div class="mt-24">
-          <van-button
-            :loading="loading"
-            type="primary"
-            native-type="submit"
-            round
-            block
-            @click="handleSubmit"
-          >
-            登录
-          </van-button>
-        </div>
-      </van-form>
-    </div>
-  </div>
-</template>
-
-<style scoped lang="less">
-</style>

package/template-mobile-vant-cli/src/plugins/dayjs/index.ts

@@ -1,3 +0,0 @@
-import dayjs from 'dayjs'
-
-dayjs.locale('zh-cn')

package/template-mobile-vant-cli/src/plugins/index.ts

@@ -1,2 +0,0 @@
-// 加载插件
-import.meta.glob('./**/*.ts', { eager: true })

package/template-mobile-vant-cli/src/router/guard/index.ts

@@ -1,18 +0,0 @@
-import type { MenuDataItem } from '@gx-design-vue/pro-layout'
-import type { Router } from 'vue-router'
-import getPageTitle from '@/utils/pageTitle'
-import { createPermissionGuard } from './permissions'
-import { createStateGuard } from './stateGuard'
-
-export function setupRouterGuard(router: Router) {
-  createPageGuard(router)
-  createPermissionGuard(router)
-  createStateGuard(router)
-}
-
-export function createPageGuard(router: Router) {
-  router.afterEach((to) => {
-    const { meta } = to as MenuDataItem
-    document.title = getPageTitle(meta?.title || '')
-  })
-}

package/template-mobile-vant-cli/src/router/guard/permissions.ts

@@ -1,41 +0,0 @@
-import type { Router } from 'vue-router'
-import { defaultSettings } from '@gx-config'
-
-const { loginInterception, routesWhiteList } = defaultSettings.system
-
-export function createPermissionGuard(router: Router) {
-  const userStore = useStoreUser()
-
-  router.beforeEach(async (to, _, next) => {
-    if (loginInterception) {
-      const token = userStore.accessToken
-      if (routesWhiteList.includes(to.path)) {
-        if (token) {
-          next({ path: '/', replace: true })
-        }
-        next()
-        return
-      }
-      if (!token) {
-        userStore.resetPermissions()
-        next({ path: '/user/login', replace: true })
-        return
-      }
-
-      const hasUserId = userStore.userInfo.userId
-
-      if (hasUserId) {
-        next()
-        return
-      }
-
-      const status = await userStore.checkUserPremission()
-      if (status !== 1) {
-        userStore.resetPermissions()
-        next({ path: '/user/login', replace: true })
-        return
-      }
-    }
-    next()
-  })
-}

package/template-mobile-vant-cli/src/router/guard/stateGuard.ts

@@ -1,10 +0,0 @@
-import type { Router } from 'vue-router'
-
-export function createStateGuard(router: Router) {
-  router.afterEach((to) => {
-    const user = useStoreUser()
-    if (to.path === '/user/login') {
-      user.resetPermissions()
-    }
-  })
-}

package/template-mobile-vant-cli/src/router/index.ts

@@ -1,31 +0,0 @@
-import type { App } from 'vue'
-import type { RouteRecordRaw } from 'vue-router'
-import { defaultSettings } from '@gx-config'
-import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
-import { routerList } from './routes'
-
-const { routerMode } = defaultSettings.system
-
-function handleRouterMode() {
-  switch (routerMode) {
-    case 'hash':
-      return createWebHashHistory()
-      break
-    case 'browser':
-      return createWebHistory()
-      break
-    default:
-      return createWebHashHistory()
-      break
-  }
-}
-
-export const router = createRouter({
-  history: handleRouterMode(),
-  routes: routerList as unknown as RouteRecordRaw[]
-})
-
-// 配置路由器
-export function setupRouter(app: App<Element>) {
-  app.use(router)
-}