67 lines
2.4 KiB
Vue
67 lines
2.4 KiB
Vue
<template>
|
|
<ModalTransition :show="show">
|
|
<div class="agreement">
|
|
<div class="agreement-wrapper">
|
|
<div class="agreement-content" v-html="agreeHtml"></div>
|
|
</div>
|
|
<div class="agreement-close" @click="$emit('close')"></div>
|
|
</div>
|
|
</ModalTransition>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue"
|
|
import ModalTransition from "./ModalTransition.vue";
|
|
|
|
const show = ref(false)
|
|
const agreeHtml = ref("")
|
|
const loading = weui.loading("加载中……")
|
|
|
|
fetch(`./agreement.html`, {
|
|
method: "GET",
|
|
headers: new Headers({
|
|
"Content-Type": "text/html"
|
|
})
|
|
}).then(res => res.text())
|
|
.catch(error => {
|
|
loading.hide()
|
|
console.log(error)
|
|
})
|
|
.then(res => {
|
|
loading.hide()
|
|
agreeHtml.value = res
|
|
show.value = true
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.agreement {
|
|
background-color: #fff;
|
|
border-radius: 2vw 2vw 0 0;
|
|
}
|
|
|
|
.agreement-wrapper {
|
|
width: 100%;
|
|
height: 90vh;
|
|
overflow: auto;
|
|
}
|
|
|
|
.agreement-content {
|
|
padding: 6vw;
|
|
}
|
|
|
|
.agreement-close {
|
|
z-index: 1;
|
|
position: absolute;
|
|
top: 25vw;
|
|
right: 3vw;
|
|
border-radius: 50%;
|
|
width: 8.425926vw;
|
|
height: 8.703704vw;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
background-color: rgba(255,255,255,.5);
|
|
background-size: 80% auto;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3MiA3MiIgd2lkdGg9IjEyOHB4IiBoZWlnaHQ9IjEyOHB4Ij48cGF0aCBkPSJNIDE5IDE1IEMgMTcuOTc3IDE1IDE2Ljk1MTg3NSAxNS4zOTA4NzUgMTYuMTcxODc1IDE2LjE3MTg3NSBDIDE0LjYwOTg3NSAxNy43MzM4NzUgMTQuNjA5ODc1IDIwLjI2NjEyNSAxNi4xNzE4NzUgMjEuODI4MTI1IEwgMzAuMzQzNzUgMzYgTCAxNi4xNzE4NzUgNTAuMTcxODc1IEMgMTQuNjA5ODc1IDUxLjczMzg3NSAxNC42MDk4NzUgNTQuMjY2MTI1IDE2LjE3MTg3NSA1NS44MjgxMjUgQyAxNi45NTE4NzUgNTYuNjA4MTI1IDE3Ljk3NyA1NyAxOSA1NyBDIDIwLjAyMyA1NyAyMS4wNDgxMjUgNTYuNjA5MTI1IDIxLjgyODEyNSA1NS44MjgxMjUgTCAzNiA0MS42NTYyNSBMIDUwLjE3MTg3NSA1NS44MjgxMjUgQyA1MS43MzE4NzUgNTcuMzkwMTI1IDU0LjI2NzEyNSA1Ny4zOTAxMjUgNTUuODI4MTI1IDU1LjgyODEyNSBDIDU3LjM5MTEyNSA1NC4yNjUxMjUgNTcuMzkxMTI1IDUxLjczNDg3NSA1NS44MjgxMjUgNTAuMTcxODc1IEwgNDEuNjU2MjUgMzYgTCA1NS44MjgxMjUgMjEuODI4MTI1IEMgNTcuMzkwMTI1IDIwLjI2NjEyNSA1Ny4zOTAxMjUgMTcuNzMzODc1IDU1LjgyODEyNSAxNi4xNzE4NzUgQyA1NC4yNjgxMjUgMTQuNjEwODc1IDUxLjczMTg3NSAxNC42MDk4NzUgNTAuMTcxODc1IDE2LjE3MTg3NSBMIDM2IDMwLjM0Mzc1IEwgMjEuODI4MTI1IDE2LjE3MTg3NSBDIDIxLjA0ODEyNSAxNS4zOTE4NzUgMjAuMDIzIDE1IDE5IDE1IHoiLz48L3N2Zz4=);
|
|
}
|
|
</style> |