<!-- 管理员信息 -->
<template>
    <div class="vue-box submit-box--dialog" style="width: 450px;">
        <!-- ------- 内容部分 ------- -->
        <div class="c-card" v-if="state.tempLoginLink">
            <el-tooltip
                effect="dark"
                content="点击鼠标即可一键复制"
                placement="top"
            >
                <div class="link-box" @click="copy">{{ state.tempLoginLink }}</div>
            </el-tooltip>
            <p style="color: #606266;"> 复制上述链接，然后从新浏览器打开，即可模拟此账号登录 （如果从当前浏览器打开，则会覆盖掉当前登录的账号），</p>
            <p style="color: #606266; margin-top: 10px;">此链接五分钟内有效，过期后无法登录。</p>
        </div>
    </div>
</template>

<script setup name="admin-mock-login">
import {onMounted, reactive} from "vue";
import router from "../../router";

// 获取插值 
const prop = defineProps({
    param: {type: Object}
})

// ------------------ 数据 ------------------
const state = reactive({
    aid: prop.param.id || 0,   // 获取传值id 
    tempLoginLink: ''  // 一键登录的地址 
})

onMounted(function () {
    f5();
})

// ------------------ 函数 ------------------
// 查询 
const f5 = function () {
    sa.ajax('/AccAdmin/getFastLoginTempToken?id=' + state.aid, function (res) {
        let loginViewPath = getLoginViewPath();
        state.tempLoginLink = loginViewPath + '?temp-token=' + res.data;
    })
}

// 获取本系统的登录视图地址 
const getLoginViewPath = function () {
    let currPath = router.currentRoute.value.path;
    if(currPath === '/') {
        currPath = '/admin-list';
    }
    return location.href.replace(currPath, '/login');
}

// 复制链接
const copy = function () {
    sa.copyText(state.tempLoginLink);
    sa.msg('复制成功');
}

defineExpose({
    // 点击弹窗 [确定] 按钮时执行的函数 
    ok: function () {
        copy();
        sa.closeModel();
    }
})

</script>

<style scoped>
.submit-box--dialog .c-card{padding-top: 20px; padding-right: 20px;}
.link-box{background-color: #f5f7fa; padding: 14px; color: #717377; border-radius: 4px; margin-bottom: 14px; cursor: pointer;}
</style>
