<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<title>API开放平台</title>
|
<link rel="stylesheet" href="../static/css/element.css">
|
<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script type="text/javascript" src="../static/js/vue.min.js"></script>
|
<script type="text/javascript" src="../static/js/showdown.min.js"></script>
|
<script type="text/javascript" src="../static/js/common.js"></script>
|
<script type="text/javascript" src="../static/js/element.js"></script>
|
<style>
|
#content {
|
width: 80%;
|
margin-left: 10%;
|
}
|
|
#content table {
|
background: #fff;
|
border: solid 1px #ddd;
|
margin-bottom: 1.25rem;
|
table-layout: auto
|
}
|
|
#content table caption {
|
background: transparent;
|
color: #222;
|
font-size: 1rem;
|
font-weight: bold
|
}
|
|
#content table thead {
|
background: #F5F5F5
|
}
|
|
#content table thead tr th,#content table thead tr td {
|
color: #222;
|
font-size: 0.875rem;
|
font-weight: bold;
|
padding: 0.5rem 0.625rem 0.625rem
|
}
|
|
#content table tfoot {
|
background: #F5F5F5
|
}
|
|
#content table tfoot tr th,#content table tfoot tr td {
|
color: #222;
|
font-size: 0.875rem;
|
font-weight: bold;
|
padding: 0.5rem 0.625rem 0.625rem
|
}
|
|
#content table tr th,#content table tr td {
|
color: #222;
|
font-size: 0.875rem;
|
padding: 0.5625rem 0.625rem;
|
text-align: left
|
}
|
|
#content table tr.even,#content table tr.alt,#content table tr:nth-of-type(even) {
|
background: #F9F9F9
|
}
|
|
#content table thead tr th,#content table tfoot tr th,#content table tfoot tr td,#content table tbody tr th,#content table tbody tr td,#content table tr td {
|
display: table-cell;
|
line-height: 1.125rem
|
}
|
|
#content pre {
|
white-space: pre-wrap; /* css-3 */
|
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
white-space: -o-pre-wrap; /* Opera 7 */
|
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
background-color: #f8f8f8;
|
border: 1px solid #dfdfdf;
|
margin-top: 1.5em;
|
margin-bottom: 1.5em;
|
padding: 0.125rem 0.3125rem 0.0625rem;
|
}
|
|
#content pre code {
|
background-color: transparent;
|
border: 0;
|
padding: 0;
|
}
|
|
.el-dropdown-link {
|
cursor: pointer;
|
color: #409EFF;
|
}
|
.el-icon-arrow-down {
|
font-size: 12px;
|
}
|
</style>
|
</head>
|
<body>
|
<div id="app">
|
<div id="content"></div>
|
<div style="position: fixed;top: 20px;right: 20px;width: 100px;">
|
<el-menu default-active="1">
|
<el-menu-item index="1">
|
<span slot="title" @click="introduceClick()">规范说明</span>
|
</el-menu-item>
|
<el-menu-item index="2">
|
<span slot="title" @click="keyList()">密钥管理</span>
|
</el-menu-item>
|
</el-menu>
|
</div>
|
|
<el-dialog title="密钥管理" :visible.sync="keyTableVisible">
|
<el-table :data="keyTableData" v-loading="loading">
|
<el-table-column property="hostId$" label="仓库"></el-table-column>
|
<el-table-column property="signKey" label="签名密钥" width="150"></el-table-column>
|
<el-table-column property="appKey" label="接口请求密钥" width="250"></el-table-column>
|
<el-table-column property="createTime$" label="时间" width="200"></el-table-column>
|
<el-table-column label="操作" width="400">
|
<template slot-scope="scope">
|
<el-button size="mini" @click="generateSignKey(scope.row.hostId)">签名密钥</el-button>
|
<el-button size="mini" @click="generateAppKey(scope.row.hostId)">接口密钥</el-button>
|
<el-switch
|
v-model="scope.row.signStatus"
|
@change="switchChange(scope.row.hostId,scope.row.signStatus)"
|
active-text="开启签名"
|
inactive-text="关闭签名">
|
</el-switch>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-dialog>
|
</div>
|
|
<script>
|
showdown.setOption('tables', true);
|
var converter = new showdown.Converter()
|
|
var app = new Vue({
|
el: '#app',
|
data: {
|
keyTableVisible: false,
|
keyTableData: [],
|
loading: true
|
},
|
created() {
|
this.init()
|
},
|
methods: {
|
init() {
|
this.introduceClick()
|
},
|
introduceClick() {
|
$.ajax({
|
url: "md/introduce.md",
|
headers: {'token': localStorage.getItem('token')},
|
method: 'GET',
|
success: function (res) {
|
// $("#content").html(marked.parse(res))
|
// console.log(converter.makeHtml(res))
|
$("#content").html(converter.makeHtml(res))
|
}
|
});
|
},
|
keyList() {
|
let that = this
|
this.keyTableVisible = true
|
$.ajax({
|
url: baseUrl + "/hostKey/list/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: {},
|
dataType:'json',
|
contentType:'application/json;charset=UTF-8',
|
method: 'POST',
|
success: function (res) {
|
let tmp = []
|
res.data.forEach((item, index) => {
|
item.signStatus = item.signStatus == 1 ? true : false;
|
tmp.push(item)
|
});
|
that.keyTableData = tmp
|
that.loading = false
|
}
|
});
|
},
|
generateSignKey(hostId) {
|
let that = this
|
this.$confirm('此操作将覆盖原签名密钥, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
$.ajax({
|
url: baseUrl + "/hostKey/generateSignKey/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: {
|
hostId: hostId
|
},
|
dataType: 'json',
|
contentType: 'application/json;charset=UTF-8',
|
method: 'GET',
|
success: function (res) {
|
if (res.code === 200) {
|
that.$message({
|
type: 'success',
|
message: '生成成功'
|
});
|
|
that.keyTableData.forEach((item, index) => {
|
if (item.hostId == hostId) {
|
item.signKey = res.data.signKey
|
}
|
});
|
} else {
|
that.$message({
|
type: 'error',
|
message: res.msg
|
});
|
}
|
}
|
});
|
}).catch(() => {
|
//取消
|
});
|
},
|
generateAppKey(hostId) {
|
let that = this
|
this.$confirm('此操作将覆盖原接口密钥, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
$.ajax({
|
url: baseUrl + "/hostKey/generateAppKey/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: {
|
hostId: hostId
|
},
|
dataType: 'json',
|
contentType: 'application/json;charset=UTF-8',
|
method: 'GET',
|
success: function (res) {
|
if (res.code === 200) {
|
that.$message({
|
type: 'success',
|
message: '生成成功'
|
});
|
|
that.keyTableData.forEach((item, index) => {
|
if (item.hostId == hostId) {
|
item.appKey = res.data.appKey
|
}
|
});
|
} else {
|
that.$message({
|
type: 'error',
|
message: res.msg
|
});
|
}
|
}
|
});
|
}).catch(() => {
|
//取消
|
});
|
},
|
switchChange(hostId, signStatus) {
|
let that = this
|
//签名校验开关
|
$.ajax({
|
url: baseUrl + "/hostKey/switchSign/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: {
|
hostId: hostId,
|
signStatus: signStatus ? 1 : 0,
|
},
|
dataType: 'json',
|
contentType: 'application/json;charset=UTF-8',
|
method: 'GET',
|
success: function (res) {
|
if (res.code === 200) {
|
that.$message({
|
type: 'success',
|
message: '切换成功'
|
});
|
} else {
|
that.$message({
|
type: 'error',
|
message: res.msg
|
});
|
}
|
}
|
});
|
}
|
}
|
})
|
</script>
|
</body>
|
</html>
|
