|
|
|
|
@ -0,0 +1,101 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="main">
|
|
|
|
|
<el-card class="box-card">
|
|
|
|
|
<template #header>
|
|
|
|
|
<div class="card-header">
|
|
|
|
|
<span>KEY 管理</span>
|
|
|
|
|
<div><el-button type="success" style="margin-right: 10px;" @click="handleAdd()">添加一个</el-button></div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<div style="margin-top: 10px; margin-bottom: 10px;" v-for="(obj,index) in keyList" :obj="obj" :index="index" :key="obj.id">
|
|
|
|
|
<el-input :value="'AK-'+ obj.id" size="large" readonly @click.stop="handleCopy('AK-'+obj.id)">
|
|
|
|
|
<template #prepend>Api KEY{{ index + 1 }}:</template>
|
|
|
|
|
<template #append>
|
|
|
|
|
<el-button @click="handleDel(obj.id)">删除</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-input>
|
|
|
|
|
</div>
|
|
|
|
|
</el-card>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup name="key">
|
|
|
|
|
import { ref } from 'vue';
|
|
|
|
|
import { delKey,getKeyList,generateKey } from "@/api/cert/apiToken";
|
|
|
|
|
|
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
|
|
const keyList = ref([]);
|
|
|
|
|
|
|
|
|
|
function Init(){
|
|
|
|
|
getKeyList().then(response => {
|
|
|
|
|
keyList.value = response.data
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function handleAdd(){
|
|
|
|
|
generateKey().then(response => {
|
|
|
|
|
proxy.$modal.msgSuccess("添加成功");
|
|
|
|
|
Init();
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function handleDel(key){
|
|
|
|
|
console.log(keyList.value.length);
|
|
|
|
|
if(keyList.value.length < 2){
|
|
|
|
|
proxy.$modal.msgError("请至少保留一个KEY");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
proxy.$modal.confirm('是否确认删除KEY:AK-'+key+'?').then(function() {
|
|
|
|
|
return delKey(key);
|
|
|
|
|
}).then(() => {
|
|
|
|
|
Init();
|
|
|
|
|
proxy.$modal.msgSuccess("删除成功");
|
|
|
|
|
}).catch(() => {});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function handleCopy(id){
|
|
|
|
|
// 获取需要复制的元素以及元素内的文本内容
|
|
|
|
|
const text = id;
|
|
|
|
|
// 添加一个input元素放置需要的文本内容
|
|
|
|
|
const input = document.createElement("input");
|
|
|
|
|
input.value = text;
|
|
|
|
|
document.body.appendChild(input);
|
|
|
|
|
// 选中并复制文本到剪切板
|
|
|
|
|
input.select();
|
|
|
|
|
document.execCommand("copy");
|
|
|
|
|
// 移除input元素
|
|
|
|
|
document.body.removeChild(input);
|
|
|
|
|
proxy.$modal.msgSuccess("复制成功");
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Init();
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.main {
|
|
|
|
|
padding: 20px;
|
|
|
|
|
}
|
|
|
|
|
.card-header {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.text {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
margin-bottom: 18px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.info {
|
|
|
|
|
font-size: 15px;
|
|
|
|
|
color: #606266;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|