47 lines
1.4 KiB
Vue
47 lines
1.4 KiB
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<img src="@/assets/images/invitation.png" alt="邀请下级" />
|
||
|
|
<div
|
||
|
|
@click="showQRcode = true"
|
||
|
|
class="bg-gradient-to-t from-orange-500 to-orange-300 fixed bottom-0 h-12 w-full bg-orange-400 shadow-xl text-white rounded-t-xl flex items-center justify-center font-bold"
|
||
|
|
>
|
||
|
|
立即邀请好友
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<QRcode
|
||
|
|
v-model:show="showQRcode"
|
||
|
|
mode="invitation"
|
||
|
|
:linkIdentifier="linkIdentifier"
|
||
|
|
/>
|
||
|
|
</template>
|
||
|
|
<script setup>
|
||
|
|
import { storeToRefs } from "pinia";
|
||
|
|
import { aesEncrypt } from "@/utils/crypto";
|
||
|
|
import { useAgentStore } from "@/stores/agentStore";
|
||
|
|
const agentStore = useAgentStore();
|
||
|
|
const { mobile, agentID } = storeToRefs(agentStore); // 响应式解构
|
||
|
|
|
||
|
|
const showQRcode = ref(false);
|
||
|
|
const linkIdentifier = ref("");
|
||
|
|
onBeforeMount(() => {
|
||
|
|
encryptIdentifire(agentID.value, mobile.value);
|
||
|
|
});
|
||
|
|
|
||
|
|
const encryptIdentifire = (agentID, mobile) => {
|
||
|
|
const channelKey = import.meta.env.VITE_INVITE_CHANNEL_KEY;
|
||
|
|
if (!channelKey) throw new Error("缺少环境变量: VITE_INVITE_CHANNEL_KEY");
|
||
|
|
const linkIdentifierJSON = {
|
||
|
|
agentID,
|
||
|
|
mobile,
|
||
|
|
};
|
||
|
|
const linkIdentifierStr = JSON.stringify(linkIdentifierJSON);
|
||
|
|
const encodeData = aesEncrypt(
|
||
|
|
linkIdentifierStr,
|
||
|
|
channelKey
|
||
|
|
);
|
||
|
|
linkIdentifier.value = encodeURIComponent(encodeData);
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped></style>
|