36 lines
1.7 KiB
JavaScript
36 lines
1.7 KiB
JavaScript
// my-component.js
|
||
// 引入全局 Vue 对象（因在 HTML 中通过 script 引入，Vue 已挂载到 window）
|
||
const { defineComponent, ref, inject, defineAsyncComponent, onMounted } = Vue;
|
||
|
||
// 定义组件（直接使用模板）
|
||
export const QRCodePop = defineComponent({
|
||
name: "QR-code-pop",
|
||
props: {},
|
||
|
||
setup(props) {
|
||
let isMobile = ref(false);
|
||
|
||
let state = ref(false);
|
||
|
||
let valueUrl = ref("");
|
||
|
||
onMounted(() => {
|
||
isMobile.value = window.isMobile;
|
||
|
||
const valueA = document.querySelector(".valueA");
|
||
valueUrl.value = valueA.innerText;
|
||
});
|
||
|
||
const open = () => (state.value = true);
|
||
const closeGroup = () => (state.value = false);
|
||
|
||
const holdback = () => {};
|
||
|
||
return { valueUrl, state, isMobile, holdback, closeGroup, open };
|
||
},
|
||
|
||
components: {},
|
||
|
||
template: `<div class="QR-code-pop flexflex" v-if="state" @click="closeGroup" @touchmove.stop> <div class="pop-box flexacenter" @click.stop="holdback"> <img class="pop-title" :src="valueUrl + '/img/welcome-icon.png'"> <div class="pop-wechat-name flexcenter"> <img class="pop-wechat-icon" :src="valueUrl + '/img/wechat-name-icon.png'"> 寄托方同学 </div> <div class="pop-code-box flexcenter"> <div class="pop-code flexcenter"> <img class="pop-code-img" src="https://o.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-d_JkpcHnqqsgFptxhcq_cQnrlcaF2WQQQBq_D-81qNDQyOQ~~"> </div> <div class="pop-text">保存识别二维码</div> </div> <img class="pop-bottom1" :src="valueUrl + '/img/bottom2.svg'"> <img class="pop-bottom2" :src="valueUrl + '/img/bottom1.svg'"> </div></div>`,
|
||
});
|