Browse Source

完善个人中心电子票

master
awei 7 months ago
parent
commit
95bc54d191
  1. 1
      package.json
  2. 75
      pnpm-lock.yaml
  3. 2
      src/components.d.ts
  4. 146
      src/typed-router.d.ts
  5. 5
      src/views/signUp/components/FormItem.vue
  6. 56
      src/views/signUp/components/SignForm.vue
  7. 3
      src/views/signUp/index.vue
  8. 115
      src/views/user/index.vue

1
package.json

@ -32,6 +32,7 @@ @@ -32,6 +32,7 @@
"vconsole": "^3.15.1",
"vue": "^3.4.15",
"vue-cookies": "^1.8.3",
"vue-qr": "^4.0.9",
"vue-router": "^4.2.5"
},
"devDependencies": {

75
pnpm-lock.yaml

@ -53,6 +53,9 @@ dependencies: @@ -53,6 +53,9 @@ dependencies:
vue-cookies:
specifier: ^1.8.3
version: 1.8.3
vue-qr:
specifier: ^4.0.9
version: 4.0.9
vue-router:
specifier: ^4.2.5
version: 4.2.5(vue@3.4.15)
@ -3063,7 +3066,6 @@ packages: @@ -3063,7 +3066,6 @@ packages:
/balanced-match@1.0.2:
resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
dev: true
/binary-extensions@2.2.0:
resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==}
@ -3089,7 +3091,6 @@ packages: @@ -3089,7 +3091,6 @@ packages:
resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
dependencies:
balanced-match: 1.0.2
dev: true
/braces@3.0.2:
resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==}
@ -3464,6 +3465,13 @@ packages: @@ -3464,6 +3465,13 @@ packages:
ms: 2.1.2
dev: true
/decompress-response@6.0.0:
resolution: {integrity: sha512-aW35yZM6Bb/4oJlZncMH2LCoZtJXTRxES17vE3hoRiowU2kWHaJKFkSBDnDR+cm9J+9QhXmREyIfv0pji9ejCQ==}
engines: {node: '>=10'}
dependencies:
mimic-response: 3.1.0
dev: false
/deep-eql@4.1.3:
resolution: {integrity: sha512-WaEtAOpRA1MQ0eohqZjpGD8zdI0Ovsm8mmFhaDN8dvDZzyoUMcYDnf5Y6iu7HTXxf8JDS23qWa4a+hKCDyOPzw==}
engines: {node: '>=6'}
@ -4294,7 +4302,6 @@ packages: @@ -4294,7 +4302,6 @@ packages:
/fs.realpath@1.0.0:
resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==}
dev: true
/fsevents@2.3.3:
resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
@ -4388,6 +4395,17 @@ packages: @@ -4388,6 +4395,17 @@ packages:
path-is-absolute: 1.0.1
dev: true
/glob@8.1.0:
resolution: {integrity: sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==}
engines: {node: '>=12'}
dependencies:
fs.realpath: 1.0.0
inflight: 1.0.6
inherits: 2.0.4
minimatch: 5.1.6
once: 1.4.0
dev: false
/globals@11.12.0:
resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==}
engines: {node: '>=4'}
@ -4575,11 +4593,9 @@ packages: @@ -4575,11 +4593,9 @@ packages:
dependencies:
once: 1.4.0
wrappy: 1.0.2
dev: true
/inherits@2.0.4:
resolution: {integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==}
dev: true
/is-alphabetical@1.0.4:
resolution: {integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==}
@ -4710,6 +4726,10 @@ packages: @@ -4710,6 +4726,10 @@ packages:
requiresBuild: true
dev: true
/js-binary-schema-parser@2.0.3:
resolution: {integrity: sha512-xezGJmOb4lk/M1ZZLTR/jaBHQ4gG/lqQnJqdIv4721DMggsa1bDVlHXNeHYogaIEHD9vCRv0fcL4hMA+Coarkg==}
dev: false
/js-tokens@4.0.0:
resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
dev: true
@ -5005,6 +5025,11 @@ packages: @@ -5005,6 +5025,11 @@ packages:
engines: {node: '>=12'}
dev: true
/mimic-response@3.1.0:
resolution: {integrity: sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==}
engines: {node: '>=10'}
dev: false
/min-indent@1.0.1:
resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==}
engines: {node: '>=4'}
@ -5016,6 +5041,13 @@ packages: @@ -5016,6 +5041,13 @@ packages:
brace-expansion: 1.1.11
dev: true
/minimatch@5.1.6:
resolution: {integrity: sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==}
engines: {node: '>=10'}
dependencies:
brace-expansion: 2.0.1
dev: false
/minimatch@9.0.3:
resolution: {integrity: sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==}
engines: {node: '>=16 || 14 >=14.17'}
@ -5202,7 +5234,6 @@ packages: @@ -5202,7 +5234,6 @@ packages:
resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
dependencies:
wrappy: 1.0.2
dev: true
/onetime@5.1.2:
resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==}
@ -5296,6 +5327,10 @@ packages: @@ -5296,6 +5327,10 @@ packages:
callsites: 3.1.0
dev: true
/parenthesis@3.1.8:
resolution: {integrity: sha512-KF/U8tk54BgQewkJPvB4s/US3VQY68BRDpH638+7O/n58TpnwiwnOtGIOsT2/i+M78s61BBpeC83STB88d8sqw==}
dev: false
/parse-entities@2.0.0:
resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==}
dependencies:
@ -5785,6 +5820,18 @@ packages: @@ -5785,6 +5820,18 @@ packages:
engines: {node: '>=14'}
dev: true
/simple-concat@1.0.1:
resolution: {integrity: sha512-cSFtAPtRhljv69IK0hTVZQ+OfE9nePi/rtJmw5UjHeVyVroEqJXP1sFztKUy1qU+xvz3u/sfYJLa947b7nAN2Q==}
dev: false
/simple-get@4.0.1:
resolution: {integrity: sha512-brv7p5WgH0jmQJr1ZDDfKDOSeWWg+OVypG99A/5vYGPqJ6pxiaHLy8nxtFjBA7oMa01ebA9gfh1uMCFqOuXxvA==}
dependencies:
decompress-response: 6.0.0
once: 1.4.0
simple-concat: 1.0.1
dev: false
/sirv@2.0.4:
resolution: {integrity: sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==}
engines: {node: '>= 10'}
@ -5880,6 +5927,12 @@ packages: @@ -5880,6 +5927,12 @@ packages:
engines: {node: '>=0.6.19'}
dev: true
/string-split-by@1.0.0:
resolution: {integrity: sha512-KaJKY+hfpzNyet/emP81PJA9hTVSfxNLS9SFTWxdCnnW1/zOOwiV248+EfoX7IQFcBaOp4G5YE6xTJMF+pLg6A==}
dependencies:
parenthesis: 3.1.8
dev: false
/string-width@4.2.3:
resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
engines: {node: '>=8'}
@ -6639,6 +6692,15 @@ packages: @@ -6639,6 +6692,15 @@ packages:
- supports-color
dev: true
/vue-qr@4.0.9:
resolution: {integrity: sha512-pAISV94T0MNEYA3NGjykUpsXRE2QfaNxlu9ZhEL6CERgqNc21hJYuP3hRVzAWfBQlgO18DPmZTbrFerJC3+Ikw==}
dependencies:
glob: 8.1.0
js-binary-schema-parser: 2.0.3
simple-get: 4.0.1
string-split-by: 1.0.0
dev: false
/vue-router@4.2.5(vue@3.4.15):
resolution: {integrity: sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==}
peerDependencies:
@ -6718,7 +6780,6 @@ packages: @@ -6718,7 +6780,6 @@ packages:
/wrappy@1.0.2:
resolution: {integrity: sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==}
dev: true
/ws@8.16.0:
resolution: {integrity: sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==}

2
src/components.d.ts vendored

@ -10,11 +10,13 @@ declare module 'vue' { @@ -10,11 +10,13 @@ declare module 'vue' {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
VanButton: typeof import('vant/es')['Button']
VanCell: typeof import('vant/es')['Cell']
VanCheckbox: typeof import('vant/es')['Checkbox']
VanConfigProvider: typeof import('vant/es')['ConfigProvider']
VanField: typeof import('vant/es')['Field']
VanForm: typeof import('vant/es')['Form']
VanIcon: typeof import('vant/es')['Icon']
VanNavBar: typeof import('vant/es')['NavBar']
VanTag: typeof import('vant/es')['Tag']
}
}

146
src/typed-router.d.ts vendored

@ -0,0 +1,146 @@ @@ -0,0 +1,146 @@
/* eslint-disable */
/* prettier-ignore */
// @ts-nocheck
// Generated by unplugin-vue-router. ‼ DO NOT MODIFY THIS FILE ‼
// It's recommended to commit this file.
// Make sure to add this file to your tsconfig.json file as an "includes" or "files" entry.
/// <reference types="unplugin-vue-router/client" />
import type {
// type safe route locations
RouteLocationTypedList,
RouteLocationResolvedTypedList,
RouteLocationNormalizedTypedList,
RouteLocationNormalizedLoadedTypedList,
RouteLocationAsString,
RouteLocationAsRelativeTypedList,
RouteLocationAsPathTypedList,
// helper types
// route definitions
RouteRecordInfo,
ParamValue,
ParamValueOneOrMore,
ParamValueZeroOrMore,
ParamValueZeroOrOne,
// vue-router extensions
_RouterTyped,
RouterLinkTyped,
RouterLinkPropsTyped,
NavigationGuard,
UseLinkFnTyped,
// data fetching
_DataLoader,
_DefineLoaderOptions,
} from 'unplugin-vue-router/types'
declare module 'vue-router/auto/routes' {
export interface RouteNamedMap {
export interface RouteNamedMap {
'//': RouteRecordInfo<'//', '/', Record<never, never>, Record<never, never>>,
} '/signUp/': RouteRecordInfo<'/signUp/', '/signUp', Record<never, never>, Record<never, never>>,
'/signUp/components/FormItem': RouteRecordInfo<'/signUp/components/FormItem', '/signUp/components/FormItem', Record<never, never>, Record<never, never>>,
'/signUp/components/SignForm': RouteRecordInfo<'/signUp/components/SignForm', '/signUp/components/SignForm', Record<never, never>, Record<never, never>>,
'/user/': RouteRecordInfo<'/user/', '/user', Record<never, never>, Record<never, never>>,
}
}
declare module 'vue-router/auto' {
import type { RouteNamedMap } from 'vue-router/auto/routes'
export type RouterTyped = _RouterTyped<RouteNamedMap>
/**
* Type safe version of `RouteLocationNormalized` (the type of `to` and `from` in navigation guards).
* Allows passing the name of the route to be passed as a generic.
*/
export type RouteLocationNormalized<Name extends keyof RouteNamedMap = keyof RouteNamedMap> = RouteLocationNormalizedTypedList<RouteNamedMap>[Name]
/**
* Type safe version of `RouteLocationNormalizedLoaded` (the return type of `useRoute()`).
* Allows passing the name of the route to be passed as a generic.
*/
export type RouteLocationNormalizedLoaded<Name extends keyof RouteNamedMap = keyof RouteNamedMap> = RouteLocationNormalizedLoadedTypedList<RouteNamedMap>[Name]
/**
* Type safe version of `RouteLocationResolved` (the returned route of `router.resolve()`).
* Allows passing the name of the route to be passed as a generic.
*/
export type RouteLocationResolved<Name extends keyof RouteNamedMap = keyof RouteNamedMap> = RouteLocationResolvedTypedList<RouteNamedMap>[Name]
/**
* Type safe version of `RouteLocation` . Allows passing the name of the route to be passed as a generic.
*/
export type RouteLocation<Name extends keyof RouteNamedMap = keyof RouteNamedMap> = RouteLocationTypedList<RouteNamedMap>[Name]
/**
* Type safe version of `RouteLocationRaw` . Allows passing the name of the route to be passed as a generic.
*/
export type RouteLocationRaw<Name extends keyof RouteNamedMap = keyof RouteNamedMap> =
| RouteLocationAsString<RouteNamedMap>
| RouteLocationAsRelativeTypedList<RouteNamedMap>[Name]
| RouteLocationAsPathTypedList<RouteNamedMap>[Name]
/**
* Generate a type safe params for a route location. Requires the name of the route to be passed as a generic.
*/
export type RouteParams<Name extends keyof RouteNamedMap> = RouteNamedMap[Name]['params']
/**
* Generate a type safe raw params for a route location. Requires the name of the route to be passed as a generic.
*/
export type RouteParamsRaw<Name extends keyof RouteNamedMap> = RouteNamedMap[Name]['paramsRaw']
export function useRouter(): RouterTyped
export function useRoute<Name extends keyof RouteNamedMap = keyof RouteNamedMap>(name?: Name): RouteLocationNormalizedLoadedTypedList<RouteNamedMap>[Name]
export const useLink: UseLinkFnTyped<RouteNamedMap>
export function onBeforeRouteLeave(guard: NavigationGuard<RouteNamedMap>): void
export function onBeforeRouteUpdate(guard: NavigationGuard<RouteNamedMap>): void
export const RouterLink: RouterLinkTyped<RouteNamedMap>
export const RouterLinkProps: RouterLinkPropsTyped<RouteNamedMap>
// Experimental Data Fetching
export function defineLoader<
P extends Promise<any>,
Name extends keyof RouteNamedMap = keyof RouteNamedMap,
isLazy extends boolean = false,
>(
name: Name,
loader: (route: RouteLocationNormalizedLoaded<Name>) => P,
options?: _DefineLoaderOptions<isLazy>,
): _DataLoader<Awaited<P>, isLazy>
export function defineLoader<
P extends Promise<any>,
isLazy extends boolean = false,
>(
loader: (route: RouteLocationNormalizedLoaded) => P,
options?: _DefineLoaderOptions<isLazy>,
): _DataLoader<Awaited<P>, isLazy>
export {
_definePage as definePage,
_HasDataLoaderMeta as HasDataLoaderMeta,
_setupDataFetchingGuard as setupDataFetchingGuard,
_stopDataFetchingScope as stopDataFetchingScope,
} from 'unplugin-vue-router/runtime'
}
declare module 'vue-router' {
import type { RouteNamedMap } from 'vue-router/auto/routes'
export interface TypesConfig {
beforeRouteUpdate: NavigationGuard<RouteNamedMap>
beforeRouteLeave: NavigationGuard<RouteNamedMap>
$route: RouteLocationNormalizedLoadedTypedList<RouteNamedMap>[keyof RouteNamedMap]
$router: _RouterTyped<RouteNamedMap>
RouterLink: RouterLinkTyped<RouteNamedMap>
}
}

5
src/views/signUp/components/FormItem.vue

@ -6,6 +6,10 @@ defineProps({ @@ -6,6 +6,10 @@ defineProps({
type: Object as PropType<any>,
required: true,
},
disabled: {
type: Boolean,
default: false,
},
})
const form = defineModel({
@ -22,6 +26,7 @@ const form = defineModel({ @@ -22,6 +26,7 @@ const form = defineModel({
v-model="form[item.paramsName]"
:name="item.name"
:label="item.name"
:disabled="disabled"
:placeholder="`请输入${item.name}`"
:rules="[{ required: true, message: `请输入${item.name}` }]"
/>

56
src/views/signUp/components/SignForm.vue

@ -5,10 +5,18 @@ import FormItem from './FormItem.vue' @@ -5,10 +5,18 @@ import FormItem from './FormItem.vue'
import { getSignUpFormConfig, signUp, smsSend } from '@/api/mice'
import useUserStore from '@/stores/modules/user'
defineProps({
disabled: {
type: Boolean,
default: false,
},
})
const form = defineModel({
type: Object as PropType<any>,
required: true,
})
const userStore = useUserStore()
const miceLink = getUrlMiceLink()
@ -42,35 +50,31 @@ async function sendSmsHandler() { @@ -42,35 +50,31 @@ async function sendSmsHandler() {
<template>
<van-form :required="true" class="bg-white py-4" @submit="onSubmit">
<FormItem v-for="(item, index) in formConfigs" :key="index" v-model="form" :item="item" />
<FormItem v-for="(item, index) in formConfigs" :key="index" v-model="form" :disabled="disabled" :item="item" />
<!-- 验证码 -->
<van-field
v-model="form.verifyCode"
center
clearable
label="短信验证码"
placeholder="请输入短信验证码"
>
<template #button>
<van-button size="small" type="primary" @click="sendSmsHandler">
发送验证码
</van-button>
</template>
</van-field>
<div v-if="!disabled">
<!-- 验证码 -->
<van-field v-model="form.verifyCode" center clearable label="短信验证码" placeholder="请输入短信验证码">
<template #button>
<van-button size="small" type="primary" @click="sendSmsHandler">
发送验证码
</van-button>
</template>
</van-field>
<!-- 协议 -->
<div class="flex items-center justify-end p-6">
<van-checkbox v-model="form.agree" icon-size="16px" shape="square" class="text-5xl">
我已阅读并同意 <span class="color-[#1890ff]">注册服务协议</span>
</van-checkbox>
</div>
<!-- 协议 -->
<div class="flex items-center justify-end p-6">
<van-checkbox v-model="form.agree" icon-size="16px" shape="square" class="text-5xl">
我已阅读并同意 <span class="color-[#1890ff]">注册服务协议</span>
</van-checkbox>
</div>
<!-- 提交 -->
<div class="p-10">
<van-button round block type="primary" :disabled="!form.agree" native-type="submit">
提交
</van-button>
<!-- 提交 -->
<div class="p-10">
<van-button round block type="primary" :disabled="!form.agree" native-type="submit">
提交
</van-button>
</div>
</div>
</van-form>
</template>

3
src/views/signUp/index.vue

@ -7,7 +7,6 @@ const userStore = useUserStore() @@ -7,7 +7,6 @@ const userStore = useUserStore()
const router = useRouter()
const formConfigs = ref<any[]>([])
const form = ref({})
const userIsApply = ref(false)
@ -39,6 +38,6 @@ onMounted(() => { @@ -39,6 +38,6 @@ onMounted(() => {
src="https://sn202108-1305501521.cos.ap-shanghai.myqcloud.com/202401162355044675902.jpg"
alt=""
>
<SignForm v-model="form" :form-configs="formConfigs" />
<SignForm v-model="form" />
</div>
</template>

115
src/views/user/index.vue

@ -1,7 +1,11 @@ @@ -1,7 +1,11 @@
<script setup lang="ts">
import vueQr from 'vue-qr/src/packages/vue-qr.vue'
import useMiceStore from '@/stores/modules/mice'
import useUserStore from '@/stores/modules/user'
import SignForm from '@/views/signUp/components/SignForm.vue'
const userStore = useUserStore()
const miceStore = useMiceStore()
const userApplyInfo = ref<any>({})
@ -14,7 +18,114 @@ onMounted(() => { @@ -14,7 +18,114 @@ onMounted(() => {
<template>
<div>
个人中心
{{ userApplyInfo }}
<van-nav-bar
title="个人中心" left-text="返回"
left-arrow
@click-left="$router.back()"
/>
<van-cell v-if="userApplyInfo.auditStatus !== 1" title="报名状态" :value="userApplyInfo.auditStatus === 2 ? '审核不通过' : '审核中'" />
<!-- 电子票 -->
<!-- 报名字段信息 -->
<div class="card">
<SignForm v-if="userApplyInfo.auditStatus === 2" v-model="userApplyInfo" :disabled="true" />
<SignForm v-else-if="userApplyInfo.auditStatus === 3" v-model="userApplyInfo" :disabled="true" />
<div v-else class="ticket-wrapper">
<div class="ticket-header van-hairline--bottom">
{{ miceStore.miceInfo.miceName }}
</div>
<!-- 展示字段 -->
<div class="ticket-field">
<div class="field-item">
<div class="field-label">
姓名
</div>
<div class="field-value">
{{ userApplyInfo.name }}
</div>
</div>
<div class="field-item">
<div class="field-label">
手机号
</div>
<div class="field-value">
{{ userApplyInfo.phone }}
</div>
</div>
</div>
<!-- 电子票 -->
<div class="ticket-qrcode">
<span>签到二维码</span>
<vue-qr :text="userApplyInfo.code" />
<div class="tips">
出示二维码签到更方便
</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="less">
.card {
margin-top: 10px;
background-color: #fff;
border-radius: 10px;
width: 96%;
margin-left: 2%;
}
.ticket-wrapper {
border-radius: 10px;
overflow: hidden;
.ticket-header {
height: 75px;
// background-color: #1989FA;
// color: white;
text-align: center;
line-height: 75px;
font-weight: 700;
font-size: 18px;
}
.ticket-field {
padding: 20px;
.field-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2px 0;
.field-label {
font-size: 13px;
color: #333;
}
.field-value {
font-size: 13px;
color: #666;
}
}
}
.ticket-qrcode {
display: flex;
flex-direction: column;
align-items: center;
padding: 20px;
.qrcode {
width: 100px;
height: 100px;
margin-bottom: 10px;
}
span {
font-size: 12px;
color: #666;
}
.tips {
font-size: 12px;
color: #666;
}
}
}
</style>

Loading…
Cancel
Save