<template>
    <el-table :data="authUserList" style="width: 100%" max-height="250" :show-header=false empty-text="当前未绑定其他登录方式" >
        <el-table-column fixed prop="nickName" >
          <template #default="scope">
              <!--   绑定账户为空显示昵称  -->
            <span v-if="isEmptyStr(scope.row.userName)">{{ scope.row.nickName }}</span>
            <span v-else>{{ scope.row.userName }}</span>
            <span></span>
          </template>
        </el-table-column>
        <el-table-column prop="source" >
            <template #default="scope">
                <dict-tag :options="just_auth_user" :value="scope.row.source" />
            </template>
        </el-table-column>
        <el-table-column fixed="right" width="120">
            <template #default="scope">
                <el-button link type="primary" size="small" @click="unbindAccount(scope.row.authId, scope.row.source)">
                    解绑
                </el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script setup>
import { selectAuthUser, deleteAuthUser } from "@/api/system/user";

const { proxy } = getCurrentInstance();
const { just_auth_user } = proxy.useDict("just_auth_user");
import { ElMessageBox, ElMessage } from "element-plus";
import { isEmptyStr } from '@/utils/validate'

const authUserList = ref([]);

/** 查询用户列表 */
function getList() {
    selectAuthUser().then(res => {
        authUserList.value = res.data
    });
};
/** 查询用户列表 */
function unbindAccount(authId, source) {
    const label = proxy.selectDictLabel(just_auth_user.value, source)
    ElMessageBox.alert("确认进行解绑《" + label + "》吗？", "提示", {
        showCancelButton: true,
        type: "warning",
    }).then(() => {
        deleteAuthUser(authId).then(res => {
            ElMessage({
                message: label + '解绑成功',
                type: 'success',
            })
            getList()
        })
    }).catch(() => { });
};

getList()
</script>
