<template>
|
<div class="policy-wrapper">
|
<nut-radio-group v-model="innerModelValue">
|
<BlRadio :label="true">
|
<div class="policy-content">
|
{{ props.policyBtnText }}
|
<div class="policy-content-btn" @click.stop="goPolicy">《用户协议和隐私政策》</div>
|
</div>
|
</BlRadio>
|
</nut-radio-group>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { Radio as BlRadio } from '@12333/components';
|
import Taro from '@tarojs/taro';
|
|
defineOptions({
|
name: 'Policy',
|
});
|
|
const props = defineProps<{
|
modelValue: boolean;
|
policyBtnText?: string;
|
}>();
|
|
const emit = defineEmits<{
|
(e: 'update:modelValue', value: boolean): void;
|
}>();
|
|
const innerModelValue = computed({
|
get() {
|
return props.modelValue;
|
},
|
set(val) {
|
emit('update:modelValue', val);
|
},
|
});
|
|
function goPolicy() {
|
Taro.navigateTo({
|
url: RouterPath.userPolicy,
|
});
|
}
|
</script>
|
|
<style lang="scss">
|
@import '@/styles/common.scss';
|
|
.policy-wrapper {
|
text-align: center;
|
padding: 0 64px;
|
|
.nut-radio-group {
|
vertical-align: middle;
|
|
.nutui-iconfont {
|
font-size: 12px;
|
height: 16px !important;
|
width: 16px !important;
|
}
|
|
.bl-radio {
|
align-items: flex-start;
|
}
|
|
.nut-radio__icon--unchecked {
|
color: boleGetCssVar('text-color', 'secondary');
|
}
|
}
|
|
.nut-radio__label {
|
margin-left: 2px;
|
}
|
|
.policy-content {
|
font-size: 24px;
|
color: boleGetCssVar('text-color', 'secondary');
|
line-height: 30px;
|
text-align: left;
|
word-break: break-all;
|
|
.policy-content-btn {
|
color: boleGetCssVar('color', 'primary');
|
display: inline;
|
}
|
}
|
}
|
</style>
|
