first commit
This commit is contained in:
Vendored
+2
File diff suppressed because one or more lines are too long
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Vendored
+2
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
+448
@@ -0,0 +1,448 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!-- import CSS -->
|
||||
<link rel="stylesheet" href="import/element-ui@2.15.14_lib_theme-chalk_index.css">
|
||||
<script src="import/axios.min.js"></script>
|
||||
<script src="import/jsencrypt.min.js"></script>
|
||||
<style>
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<el-container>
|
||||
<el-header></el-header>
|
||||
<el-container>
|
||||
<el-aside width="400px">
|
||||
<div>
|
||||
<el-button type="primary" plain @click="dialogFormVisible1 = true">添加接口</el-button>
|
||||
</div>
|
||||
<div style="margin-top: 10px;">
|
||||
<span>roleId:</span>
|
||||
<el-select v-model="roleId" placeholder="请选择" @change="roleChange">
|
||||
<el-option v-for="item in roleIdOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="margin-top: 10px;">
|
||||
<span>baseUrl:</span>
|
||||
<el-select v-model="baseUrlValue" placeholder="请选择" @change="baseUrlChange">
|
||||
<el-option v-for="item in baseUrlOptions" :key="item.value" :label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="margin-top: 10px;">
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form-item label="账号">
|
||||
<el-input v-model="loginForm.userName" style="width: 200px;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码">
|
||||
<el-input v-model="loginForm.passWord" style="width: 200px;"></el-input>
|
||||
</el-form-item>
|
||||
<el-button type="primary" @click="login">登录</el-button>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
</el-aside>
|
||||
<el-main>
|
||||
<el-autocomplete :fetch-suggestions="querySearch" placeholder="请输入内容" v-model="searchValue"
|
||||
clearable class="input-with-select">
|
||||
<el-button slot="append" icon="el-icon-search" @click="selectSearch"></el-button>
|
||||
</el-autocomplete>
|
||||
|
||||
<template>
|
||||
<el-table :data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)"
|
||||
style="width: 100%">
|
||||
<el-table-column label="url" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">{{ scope.row.url }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="描述" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px">
|
||||
{{ scope.row.description }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="权限信息" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span style="margin-left: 10px" v-for='role in scope.row.roleIds'>
|
||||
<el-tag v-if="role === -1">超级管理员</el-tag>
|
||||
<el-tag v-else-if="role === 0">校级管理员</el-tag>
|
||||
<el-tag v-else-if="role === 1">教师</el-tag>
|
||||
<el-tag v-else-if="role === 3">学生</el-tag>
|
||||
<el-tag v-else>暂未设置</el-tag>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
|
||||
<el-button size="mini" type="danger"
|
||||
@click="handleDelete(scope.$index, scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="block">
|
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page.sync="currentPage" :page-size="pageSize" layout="total, prev, pager, next"
|
||||
:total="totalSize">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
|
||||
<el-dialog title="编辑接口权限" :visible.sync="dialogFormVisible2" :before-close="cancel">
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form-item label="url">
|
||||
<el-input v-model="form.url"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input v-model="form.description"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="可访问角色">
|
||||
<el-checkbox-group v-model="form.roleIds">
|
||||
<el-checkbox :label="-1" name="type">超级管理员</el-checkbox>
|
||||
<el-checkbox :label="0" name="type">校级管理员</el-checkbox>
|
||||
<el-checkbox :label="1" name="type">教师</el-checkbox>
|
||||
<el-checkbox :label="3" name="type">学生</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="submitEdit">保存</el-button>
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
<el-dialog title="添加接口权限" :visible.sync="dialogFormVisible1" :before-close="cancel">
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form ref="form" :model="form" label-width="80px">
|
||||
<el-form-item label="url">
|
||||
<el-input v-model="form.url"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input v-model="form.description"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="可访问角色">
|
||||
<el-checkbox-group v-model="form.roleIds">
|
||||
<el-checkbox :label="-1" name="type">超级管理员</el-checkbox>
|
||||
<el-checkbox :label="0" name="type">校级管理员</el-checkbox>
|
||||
<el-checkbox :label="1" name="type">教师</el-checkbox>
|
||||
<el-checkbox :label="3" name="type">学生</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="submitInsert">添加</el-button>
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</body>
|
||||
<!-- import Vue before Element -->
|
||||
<script src="import/vue@2.7.14_dist_vue.js"></script>
|
||||
<!-- import JavaScript -->
|
||||
<script src="import/element-ui@2.15.14_lib_index.js"></script>
|
||||
<script>
|
||||
let _this = null;
|
||||
new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
currentPage: 1, // 当前页码
|
||||
totalSize: 20, // 总条数
|
||||
pageSize: 10, // 每页的数据条数
|
||||
loginForm: {
|
||||
userName: '',
|
||||
passWord: ''
|
||||
},
|
||||
form: {
|
||||
url: '',
|
||||
description: '',
|
||||
roleIds: [],
|
||||
},
|
||||
tableData: [],
|
||||
roleIdOptions: [{
|
||||
value: null,
|
||||
label: 'ALL'
|
||||
}, {
|
||||
value: '-1',
|
||||
label: '超级管理员'
|
||||
}, {
|
||||
value: '0',
|
||||
label: '校级管理员'
|
||||
}, {
|
||||
value: '1',
|
||||
label: '教师'
|
||||
}, {
|
||||
value: '3',
|
||||
label: '学生'
|
||||
}],
|
||||
baseUrlOptions: [{
|
||||
value: 0,
|
||||
baseUrl: 'https://anyview.gdut.edu.cn/api/user-service',
|
||||
label: 'anyview.gdut.edu.cn'
|
||||
}, {
|
||||
value: 1,
|
||||
baseUrl: 'https://dsvision.net/api/user-service',
|
||||
label: 'dsvision.net'
|
||||
}, {
|
||||
value: 2,
|
||||
baseUrl: 'https://res.dsvision.net/api/user-service',
|
||||
label: 'res.dsvision.net'
|
||||
}, {
|
||||
value: 3,
|
||||
baseUrl: 'http://localhost:9001/',
|
||||
label: 'localhost'
|
||||
}],
|
||||
roleId: null,
|
||||
baseUrlValue: 2,
|
||||
dialogFormVisible2: false,
|
||||
dialogFormVisible1: false,
|
||||
searchValue: '',
|
||||
allToken: [null, null, null, null],
|
||||
token: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
_this = this
|
||||
},
|
||||
mounted() {
|
||||
_this.baseUrlChange(3)
|
||||
},
|
||||
methods: {
|
||||
roleChange: function (val) {
|
||||
_this.selectSearch()
|
||||
console.log(val)
|
||||
},
|
||||
baseUrlChange: function (val) {
|
||||
delete axios.defaults.headers.common['token']
|
||||
_this.baseUrlValue = val
|
||||
axios.defaults.baseURL = _this.baseUrlOptions[val].baseUrl
|
||||
if (_this.allToken[val] != null) {
|
||||
axios.defaults.headers.common['token'] = _this.allToken[val]
|
||||
}
|
||||
_this.selectSearch()
|
||||
console.log(val)
|
||||
},
|
||||
handleEdit(index, row) {
|
||||
console.log(_this.form);
|
||||
_this.dialogFormVisible2 = true
|
||||
_this.form['accessId'] = row.accessId
|
||||
_this.form.url = row.url
|
||||
_this.form.description = row.description
|
||||
_this.form.roleIds = [...row.roleIds]
|
||||
//强制更新数组-视图
|
||||
_this.form.roleIds.splice()
|
||||
},
|
||||
submitEdit() {
|
||||
axios.post('/access/update', _this.form)
|
||||
.then(function (response) {
|
||||
_this.$notify({
|
||||
title: '成功',
|
||||
message: '编辑成功',
|
||||
type: 'success'
|
||||
});
|
||||
_this.selectSearch()
|
||||
}).catch(error => {
|
||||
_this.$notify.error({
|
||||
title: '错误',
|
||||
message: '编辑失败'
|
||||
});
|
||||
console.log(error);
|
||||
})
|
||||
_this.cancel()
|
||||
console.log(_this.form);
|
||||
},
|
||||
handleDelete(index, row) {
|
||||
_this.$confirm('此操作将删除该url以及角色权限, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
console.log(row.accessId)
|
||||
axios.get('/access/deleteAccess', { params: { accessId: row.accessId } })
|
||||
.then(function (response) {
|
||||
_this.$notify({
|
||||
title: '成功',
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
});
|
||||
_this.selectSearch()
|
||||
}).catch(error => {
|
||||
_this.$notify.error({
|
||||
title: '错误',
|
||||
message: '删除失败'
|
||||
});
|
||||
console.log(error);
|
||||
})
|
||||
}).catch(() => {
|
||||
_this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
console.log(index, row);
|
||||
},
|
||||
submitInsert() {
|
||||
console.log(_this.form);
|
||||
axios.post('/access/addAccessToRoles', _this.form)
|
||||
.then(function (response) {
|
||||
_this.$notify({
|
||||
title: '成功',
|
||||
message: '添加成功',
|
||||
type: 'success'
|
||||
});
|
||||
_this.selectSearch()
|
||||
}).catch(error => {
|
||||
_this.$notify.error({
|
||||
title: '错误',
|
||||
message: '添加失败'
|
||||
});
|
||||
console.log(error);
|
||||
})
|
||||
_this.cancel()
|
||||
},
|
||||
cancel() {
|
||||
_this.dialogFormVisible1 = false
|
||||
_this.dialogFormVisible2 = false
|
||||
_this.form = _this.$options.data().form
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
_this.currentPage = 1;
|
||||
_this.pageSize = val;
|
||||
console.log(`每页 ${val} 条`);
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`);
|
||||
_this.currentPage = val;
|
||||
},
|
||||
|
||||
//搜索
|
||||
selectSearch() {
|
||||
if (typeof axios.defaults.headers.common['token'] == "undefined") {
|
||||
_this.tableData = []
|
||||
return
|
||||
}
|
||||
const params = new URLSearchParams
|
||||
if (_this.searchValue != null && _this.searchValue != '') params.append("url", _this.searchValue)
|
||||
if (_this.roleId != null) params.append("roleId", _this.roleId)
|
||||
axios.get('/access/list', {
|
||||
params: params
|
||||
}).then(function (response) {
|
||||
_this.tableData = response.data.data
|
||||
_this.totalSize = response.data.data.length
|
||||
//强制更新数组-视图
|
||||
_this.tableData.splice()
|
||||
})
|
||||
},
|
||||
//搜索联想
|
||||
querySearch(queryString, cb) {
|
||||
let programs = _this.tableData;
|
||||
let programList = [];
|
||||
//从数据中拿出要联想的字段，并给它的名改成指定的{value：值}的格式才能正常显示
|
||||
for (let i = 0; i < _this.tableData.length; i++) {
|
||||
programList.push({ 'value': programs[i].url })
|
||||
}
|
||||
let results = queryString ? programList.filter(_this.createStateFilter(queryString)) : programList;
|
||||
cb(results);//最后给到显示
|
||||
},
|
||||
//联想内容根据输入的搜索内容过滤
|
||||
createStateFilter(queryString) {
|
||||
return (program) => {
|
||||
return (program.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1);
|
||||
};
|
||||
},
|
||||
passwordEncryption(userPassword) {
|
||||
// RSA加密
|
||||
const publicKey = 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCjmeQkUc/sljVd1ea2Z+PiFqab5zclbXWlE3ytvYx5ULPkeeMTmD0MiUZoU1MmulGoI0c8ogoSVV17qjbH8OFk8wr+BMhPa0XYrNKObqvxR1PtzabbVxBFp7Q8lULp14MeSOSFifdrj+zmiATHKBw2E1g3uDvZE9NzSOa9iFEv1QIDAQAB'; // 从后台获取公钥
|
||||
const encryptor = new JSEncrypt(); // 新建JSEncrypt对象
|
||||
encryptor.setPublicKey(publicKey); // 设置公钥
|
||||
const passwordEncryp = encryptor.encrypt(userPassword); // 对密码进行加密
|
||||
return passwordEncryp;
|
||||
},
|
||||
login() {
|
||||
axios({
|
||||
method: 'post',
|
||||
url: '/login',
|
||||
data: {
|
||||
roleId: -1,
|
||||
username: _this.loginForm.userName,
|
||||
password: _this.loginForm.passWord,
|
||||
debug: 1
|
||||
},
|
||||
transformRequest: [
|
||||
function (data) {
|
||||
// 将请求数据转换成功 formdata 接收格式
|
||||
return _this.stringify(data)
|
||||
}
|
||||
],
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}).then(function (response) {
|
||||
console.log(response);
|
||||
_this.allToken[_this.baseUrlValue] = response.data.data.token
|
||||
axios.defaults.headers.common['token'] = _this.allToken[_this.baseUrlValue]
|
||||
_this.selectSearch()
|
||||
}).catch(error => {
|
||||
_this.$notify.error({
|
||||
title: '错误',
|
||||
message: '登录失败'
|
||||
});
|
||||
console.log(error);
|
||||
})
|
||||
},
|
||||
stringify(data) {
|
||||
const formData = new FormData()
|
||||
for (const key in data) {
|
||||
// eslint-disable-next-line no-prototype-builtins
|
||||
if (data.hasOwnProperty(key)) {
|
||||
if (data[key]) {
|
||||
if (data[key].constructor === Array) {
|
||||
if (data[key][0]) {
|
||||
if (data[key][0].constructor === Object) {
|
||||
formData.append(key, JSON.stringify(data[key]))
|
||||
} else {
|
||||
data[key].forEach((item, index) => {
|
||||
formData.append(key + `[${index}]`, item)
|
||||
})
|
||||
}
|
||||
} else {
|
||||
formData.append(key + '[]', '')
|
||||
}
|
||||
} else if (data[key].constructor === Object) {
|
||||
formData.append(key, JSON.stringify(data[key]))
|
||||
} else {
|
||||
formData.append(key, data[key])
|
||||
}
|
||||
} else {
|
||||
if (data[key] === 0) {
|
||||
formData.append(key, 0)
|
||||
} else {
|
||||
formData.append(key, '')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return formData
|
||||
},
|
||||
log() {
|
||||
console.log(this.tableData)
|
||||
}
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user