48 lines
920 B
Vue
48 lines
920 B
Vue
<script setup lang="ts">
|
|
import { QrCodePanel } from '@/components'
|
|
import SignSteps from './SignSteps.vue'
|
|
|
|
interface Props {
|
|
expiresIn?: number
|
|
}
|
|
|
|
withDefaults(defineProps<Props>(), { expiresIn: 272 })
|
|
|
|
const emit = defineEmits<{ refresh: [] }>()
|
|
</script>
|
|
|
|
<template>
|
|
<div class="sign-panel">
|
|
<div class="sign-panel__left">
|
|
<QrCodePanel :expires-in="expiresIn" @refresh="emit('refresh')" />
|
|
</div>
|
|
<div class="sign-panel__right">
|
|
<SignSteps />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="less" scoped>
|
|
.sign-panel {
|
|
.flex(row, flex-start, stretch);
|
|
gap: @spacing-lg;
|
|
padding: @spacing-xl;
|
|
border-radius: @radius-lg;
|
|
background: @white;
|
|
box-shadow: @shadow-base;
|
|
|
|
&__left {
|
|
.flex(row, center);
|
|
flex-shrink: 0;
|
|
padding: @spacing-lg;
|
|
border-radius: @radius-base;
|
|
background: @bg-color-light;
|
|
}
|
|
|
|
&__right {
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
}
|
|
</style>
|