135 lines
5.1 KiB
HTML
135 lines
5.1 KiB
HTML
|
{{template "header" }}
|
||
|
<div id="app" style="width:100%">
|
||
|
<template>
|
||
|
<el-tabs type="border-card">
|
||
|
<el-tab-pane label="抖音授权">
|
||
|
<el-button type="primary" size="small" @click="addDouyinAccount()">扫码授权</el-button>
|
||
|
<el-table
|
||
|
:data="douyinList"
|
||
|
border
|
||
|
style="width: 100%;margin-top: 10px;">
|
||
|
<el-table-column
|
||
|
prop="id"
|
||
|
label="ID">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="avatar"
|
||
|
label="头像">
|
||
|
<template slot-scope="scope">
|
||
|
<el-avatar :size="50"><img :src="scope.row.avatar"/></el-avatar>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="access_token"
|
||
|
label="access_token">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="refresh_token"
|
||
|
label="refresh_token">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="nickname"
|
||
|
label="昵称">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="expires_in"
|
||
|
label="access_token过期时间">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="refresh_expires_in"
|
||
|
label="refresh_token过期时间">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="created_at"
|
||
|
label="时间">
|
||
|
</el-table-column>
|
||
|
<el-table-column
|
||
|
prop="id"
|
||
|
label="操作">
|
||
|
<template slot-scope="scope">
|
||
|
<el-button @click="deleteDouyin(scope.row.id)" type="primary" size="small" icon="el-icon-delete" circle></el-button>
|
||
|
</template>
|
||
|
</el-table-column>
|
||
|
</el-table>
|
||
|
</el-tab-pane>
|
||
|
</el-tabs>
|
||
|
|
||
|
|
||
|
</template>
|
||
|
|
||
|
</div>
|
||
|
</body>
|
||
|
|
||
|
<script>
|
||
|
var LANG=checkLang();
|
||
|
var DouyinClientKey="{{.clientKey}}";
|
||
|
new Vue({
|
||
|
el: '#app',
|
||
|
delimiters:["<{","}>"],
|
||
|
data: {
|
||
|
window:window,
|
||
|
host:getBaseUrl(),
|
||
|
douyinList:[],
|
||
|
},
|
||
|
methods: {
|
||
|
addDouyinAccount(){
|
||
|
let _this=this;
|
||
|
this.$confirm('是否为认证企业号?', '提示', {
|
||
|
confirmButtonText: '是',
|
||
|
cancelButtonText: '否',
|
||
|
type: 'warning'
|
||
|
}).then(function(){
|
||
|
let callback=_this.host+"/douyin/callback";
|
||
|
let scope="user_info,item.comment,im.direct_message"
|
||
|
let url="https://open.douyin.com/platform/oauth/connect/?client_key="+DouyinClientKey+"&response_type=code&scope="+scope+"&redirect_uri="+callback;
|
||
|
window.open(url);
|
||
|
}).catch(function(){
|
||
|
let callback=_this.host+"/douyin/callback";
|
||
|
let scope="user_info,item.comment"
|
||
|
let url="https://open.douyin.com/platform/oauth/connect/?client_key="+DouyinClientKey+"&response_type=code&scope="+scope+"&redirect_uri="+callback;
|
||
|
window.open(url);
|
||
|
});
|
||
|
|
||
|
},
|
||
|
getDouyinList(){
|
||
|
let _this=this;
|
||
|
sendAjax("/kefu/douyinList","get",{},function(res) {
|
||
|
_this.douyinList=res.result;
|
||
|
});
|
||
|
},
|
||
|
//删除抖音
|
||
|
deleteDouyin(id){
|
||
|
let _this=this;
|
||
|
this.$confirm('此操作将执行删除, 是否继续?', '提示', {
|
||
|
confirmButtonText: '确定',
|
||
|
cancelButtonText: '取消',
|
||
|
type: 'warning'
|
||
|
}).then(function(){
|
||
|
sendAjax("/kefu/deleteDouyin","get",{id:id},function(result){
|
||
|
_this.$message({
|
||
|
type: 'success',
|
||
|
message: result.msg
|
||
|
});
|
||
|
_this.getDouyinList();
|
||
|
});
|
||
|
});
|
||
|
},
|
||
|
},
|
||
|
mounted:function(){
|
||
|
},
|
||
|
created: function () {
|
||
|
let _this=this;
|
||
|
this.getDouyinList();
|
||
|
//监听页面显示隐藏
|
||
|
document.addEventListener('visibilitychange', function(){
|
||
|
var visibility = document.visibilityState;
|
||
|
if(visibility == 'visible'){
|
||
|
_this.getDouyinList();
|
||
|
}else if(visibility == 'hidden'){
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
})
|
||
|
</script>
|
||
|
|