api接口授权

dev
lilu 2 years ago
parent ef8406fb19
commit 37830d5721

@ -38,16 +38,39 @@ export function GetApiDetail (parameter) {
export function ResetApi (parameter) {
return axios({
url: '/DjyApiAuth/SecretReset',
method: 'post',
data: parameter
url: `/DjyApiAuth/SecretReset?id=${parameter.id}`,
method: 'post'
})
}
export function DisableApi (parameter) {
return axios({
url: '/DjyApiAuth/SetDisable',
method: 'post',
data: parameter
url: `/DjyApiAuth/SetDisable?id=${parameter.id}&disable=${parameter.disable}`,
method: 'post'
})
}
/**
* 用户查询
* @params Name
*/
export function GetSysUserPage(parameter) {
return axios({
url: '/sysUser/GetTenantUser',
method: 'get',
params: parameter
})
}
/**
* 分页查询租户
*
* @author Myshipping
*/
export function SysTenantPage(parameter) {
return axios({
url: '/sysTenant/page',
method: 'get',
params: parameter
})
}

@ -26,7 +26,7 @@
/> -->
<a-select
class="customer-input"
:default-value="details.issuetype"
v-model="details.issuetype"
@change="handleIssuetypeChange"
show-search
:filter-option="filterOption"
@ -417,6 +417,8 @@ export default {
detail: nval,
type: 'billInfo'
})
console.log(nval.issuetype)
this.$forceUpdate()
},
deep: true
},

@ -6,16 +6,24 @@
<div slot="content" class="table-page-search-wrapper">
<a-form layout="inline" :form="form">
<a-row :gutter="48">
<a-col :md="4" :sm="24">
<a-form-item label="接口代码">
<a-col :md="6" :sm="24" :style="{ paddingRight: 0 }">
<a-form-item
label="接口代码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-input
placeholder="请输入接口代码"
v-decorator="['ApiCode', { rules: [{ required: false, message: '请输入接口代码' }] }]"
/>
</a-form-item>
</a-col>
<a-col :md="4" :sm="24">
<a-form-item label="接口名称">
<a-col :md="6" :sm="24" :style="{ paddingRight: 0 }">
<a-form-item
label="接口名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-input
placeholder="请输入接口名称"
v-decorator="[
@ -25,13 +33,12 @@
/>
</a-form-item>
</a-col>
<a-col :md="4" :sm="24">
<a-form-item label="是否禁用">
<a-switch v-decorator="['IsDisable']"/>
</a-form-item>
</a-col>
<a-col :md="4" :sm="24">
<a-form-item label="租户名称">
<a-col :md="6" :sm="24" :style="{ paddingRight: 0 }">
<a-form-item
label="租户名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-input
placeholder="请输入租户名称"
v-decorator="[
@ -41,8 +48,12 @@
/>
</a-form-item>
</a-col>
<a-col :md="4" :sm="24">
<a-form-item label="用户姓名">
<a-col :md="6" :sm="24">
<a-form-item
label="用户姓名"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-input
placeholder="请输入用户姓名"
v-decorator="[
@ -52,18 +63,26 @@
/>
</a-form-item>
</a-col>
<!-- <a-col :md="6" :sm="24">
<a-form-item label="搜索值">
<a-input
placeholder="请输入搜索值"
v-decorator="[
'SearchValue',
{ rules: [{ required: false, message: '请输入搜索值' }] },
]"
/>
<a-col :md="12" :sm="24" :style="{ paddingRight: 0 }">
<a-form-item
label="是否禁用"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
>
<a-radio-group class="disable-radio" v-decorator="['IsDisable']">
<a-radio :value="0">
启用
</a-radio>
<a-radio :value="1">
禁用
</a-radio>
<a-radio :value="2">
全部
</a-radio>
</a-radio-group>
</a-form-item>
</a-col> -->
<a-col :md="4" :sm="24" :labelCol="{ span: 2, offset: 12 }">
</a-col>
<a-col :md="12" :sm="24" :labelCol="{ span: 2, offset: 12 }">
<span class="table-page-search-submitButtons" style="text-align: right">
<a-button type="primary" @click="tableRefresh"></a-button>
<a-button style="margin-left: 8px" @click="tableReset"></a-button>
@ -75,9 +94,9 @@
</x-card>
<x-card class="content-table">
<div slot="content" class="table-page-search-wrapper" :style="{ marginTop: '-8px' }">
<!-- <vxe-toolbar>
<vxe-toolbar>
<template #buttons>
<a-button type="primary" icon="edit" @click="addProject"></a-button>
<a-button type="primary" icon="edit" @click="addProject"></a-button>
</template>
<template #tools>
<div class="right">
@ -86,7 +105,7 @@
</span>
</div>
</template>
</vxe-toolbar> -->
</vxe-toolbar>
<vxe-grid
ref="xGrid"
v-bind="gridOptions"
@ -94,28 +113,39 @@
@page-change="handlePageChange"
style="margin-top: 6px"
>
<template #isDisable="{ row }">
<span v-if="row.isDisable"></span>
<span v-else></span>
</template>
<template #operate="{ row }">
<vxe-button type="text" icon="vxe-icon-edit" @click="editColumns(row)"></vxe-button>
<vxe-button type="text" icon="vxe-icon-delete" @click="removeColumns(row)"></vxe-button>
<vxe-button type="text" class="disable-btn" @click="editColumns(row)"></vxe-button>
<vxe-button type="text" class="disable-btn active" @click="removeColumns(row)"></vxe-button>
<span v-if="row.isDisable" class="disable-btn" @click="setDisableFun(row)"></span>
<span v-else class="disable-btn active" @click="setDisableFun(row)"></span>
<a-popconfirm title="确认删除?" ok-text="" cancel-text="" @confirm="secretResetFun(row)" @cancel="cancel">
<vxe-button class="disable-btn active" type="text">重置秘钥</vxe-button>
</a-popconfirm>
</template>
</vxe-grid>
</div>
</x-card>
</a-col>
</a-row>
<add-form ref="addForm" :fromData="addFromData" :type="addFromType" @ok="handleOk" />
<add-form ref="addForm" :formData="addFormData" :type="addFormType" @ok="handleOk" />
</div>
</template>
<script>
import { XCard } from '@/components'
import initData from './modules/initData'
import columnSetting from '@/components/tableColumnSetting'
import addForm from './modules/addFrom'
import addForm from './modules/addForm'
import {
GetApiPage,
SaveApi,
DeleteApi,
GetApiDetail,
DisableApi,
ResetApi
} from '@/api/modular/main/DjyApiAuth'
export default {
@ -130,6 +160,16 @@ export default {
form: this.$form.createForm(this),
setVisible: false,
// showColumns: null,
labelCol: {
xs: { span: 24 },
sm: { span: 8 },
md: { span: 9 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
md: { span: 15 }
},
gridOptions: {
border: false,
resizable: true,
@ -150,12 +190,11 @@ export default {
columns: JSON.parse(JSON.stringify(initData.columns)),
data: [],
},
addFromData: {},
addFromType: 'add',
addFormData: {},
addFormType: 'add'
}
},
created() {
// this.showColumns = JSON.parse(JSON.stringify(initData.columns))
this.getList()
},
mounted() {},
@ -177,22 +216,6 @@ export default {
} = this
validateFields((err, values) => {
if (!err) {
if (values.createdTime) {
const time = values.createdTime.map((item, index) => {
const str = this.dateFtt('YYYY-MM-DD', item._d)
return str
})
console.log(time)
values.createdTime = time
}
if (values.updataTime) {
const _time = values.updataTime.map((item, index) => {
const str = this.dateFtt('YYYY-MM-DD', item._d)
return str
})
console.log(_time)
values.updataTime = _time
}
this.gridOptions.pagerConfig.currentPage = currentPage
this.gridOptions.pagerConfig.pageSize = pageSize
this.getList(values)
@ -200,19 +223,23 @@ export default {
})
},
getList(queryParam = {}) {
debugger
const { currentPage, pageSize } = this.gridOptions.pagerConfig
console.log('查询内容', queryParam)
let IsDisable = null
if (Object.keys(queryParam).length > 0 && queryParam.IsDisable !== 2) {
IsDisable = Boolean(queryParam.IsDisable)
}
console.log('IsDisable = ', IsDisable)
GetApiPage({
ApiCode: queryParam.ApiCode,
ApiName: queryParam.ApiName,
IsDisable: queryParam.IsDisable,
IsDisable: IsDisable,
TenantName: queryParam.TenantName,
UserName: queryParam.UserName,
pageNo: currentPage,
pageSize: pageSize
})
.then((res) => {
debugger
const _data = res.data.rows.map((item, index) => {
item.row_id = (currentPage - 1) * pageSize + index
return item
@ -227,14 +254,14 @@ export default {
})
},
editColumns(data) {
this.addFromType = 'edit'
this.addFromId = data.id
this.addFormType = 'edit'
this.addFormId = data.id
GetApiDetail({
id: this.addFromId,
id: this.addFormId,
}).then((res) => {
if (res.success) {
this.addFromData = res.data
console.log(this.addFromData)
this.addFormData = res.data
console.log(this.addFormData)
this.$refs.addForm.add()
} else {
this.$message.error(res.message)
@ -242,7 +269,9 @@ export default {
})
},
removeColumns(data) {
DeleteApi(data.id).then((res) => {
DeleteApi({
id: data.id
}).then((res) => {
if (res.success) {
this.$message.success('删除成功')
const {
@ -259,9 +288,9 @@ export default {
})
},
addProject() {
this.addFromData = {}
this.addFromType = 'add'
this.addFromId = ''
this.addFormData = {}
this.addFormType = 'add'
this.addFormId = ''
this.$refs.addForm.add()
},
columnChange(data) {
@ -305,20 +334,8 @@ export default {
console.log(e)
this.$message.error('取消操作')
},
handleOk() {
const form = this.$refs.addForm.form
form.validateFields((errors, values) => {
if (!errors) {
console.log('values', values)
SaveApi({
id: this.addFromId,
goodsCode: values.goodsCode,
goodsNameCN: values.goodsNameCN,
goodsNameEN: values.goodsNameEN,
goodsDesp: values.goodsDesp,
goodsCategory: values.goodsCategory,
goodsCategoryName: values.goodsCategoryName,
})
handleOk(data) {
SaveApi(data)
.then((res) => {
this.$refs.addForm.$data.confirmLoading = false
if (res.success) {
@ -332,8 +349,6 @@ export default {
.catch((err) => {
console.log(err)
})
}
})
},
tableRefresh() {
const {
@ -350,7 +365,59 @@ export default {
this.init()
},
tableHeaderEdit() {},
setDisableFun(data) {
console.log('是否禁用: ', data.id, data.isDisable, data)
DisableApi({
id: data.id,
disable: !data.isDisable
})
.then((res) => {
if (res.success) {
const tip = !data.isDisable ? '已禁用' : '已启用'
this.$message.success(tip)
this.gridOptions.data[data.row_id].isDisable = !data.isDisable
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch((err) => {
console.log(err)
})
},
secretResetFun (data) {
ResetApi({
id: data.id
})
.then((res) => {
if (res.success) {
this.$message.success('秘钥已重置')
this.$forceUpdate()
} else {
this.$message.error(res.message)
}
})
.catch((err) => {
console.log(err)
})
},
cancel() {}
}
}
</script>
<style lang="less" scoped>
.disable-btn{
font-size: 12px;
color: @primary-color;
margin-left: 10px;
cursor: pointer;
&.active{
color: #999;
}
}
.disable-radio{
display:flex;
width: 100%;
margin-top: 7px;
}
</style>

@ -0,0 +1,296 @@
<template>
<a-modal
:title="`接口授权服务编辑(${type=='edit' ? '修改' : '新增'}`"
:width="900"
:visible="visible"
:confirmLoading="confirmLoading"
:maskClosable="false"
cancelText="关闭"
okText="保存"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-spin :spinning="formLoading">
<a-form-model ref="addFrom" :rules="rules" :model="formData">
<a-row :gutter="16">
<a-col :span="12">
<a-form-model-item
label="接口代码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="apiCode"
>
<a-input placeholder="请输入接口代码" v-model="formData.apiCode" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="接口名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
prop="apiName"
>
<a-input placeholder="请输入接口名称" v-model="formData.apiName" />
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="有效截止日期"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-date-picker v-model="formData.expireDate" format="YYYY-MM-DD" style="width:100%;" @change="changeExpireDate"/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="租户"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-select
show-search
v-model="formData.tenantName"
placeholder="请选择租户"
:default-active-first-option="false"
:show-arrow="false"
:filter-option="false"
:not-found-content="null"
@select="tenantSelect"
>
<a-select-option v-for="(item, index) in TenantData" :key="item.id" :value="index">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="用户"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<auto-complete
:allowClear="true"
class="customer-input"
v-model="formData.userName"
:data-source="userListArr"
:dropdown-match-select-width="false"
:dropdown-style="{ width: '200px' }"
@select="saleSelect"
@change="saleChange"
@focus="saleChange"
/>
</a-form-model-item>
</a-col>
<a-col :span="12">
<a-form-model-item
label="用户代码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入用户代码" v-model="formData.userCode" />
</a-form-model-item>
</a-col>
<a-col :span="24" v-if="formData.apiSecret">
<a-form-model-item
label="接口秘钥"
:labelCol="labelCol2"
:wrapperCol="wrapperCol2"
has-feedback
style="margin-bottom:0;"
>
{{ formData.apiSecret }}
</a-form-model-item>
</a-col>
<a-col :span="24" v-if="formData.apiKey">
<a-form-model-item
label="接口KEY"
:labelCol="labelCol2"
:wrapperCol="wrapperCol2"
has-feedback
style="margin-bottom:0;"
>
{{ formData.apiKey }}
</a-form-model-item>
</a-col>
<a-col :span="24" v-if="formData.apiKey">
<a-form-model-item
label="是否禁用"
:labelCol="labelCol2"
:wrapperCol="wrapperCol2"
has-feedback
style="margin-bottom:0;"
>
<a-switch v-model="formData.isDisable" @change="setDisableFun"/>
<span class="is-disable-btn" v-if="formData.isDisable"></span>
<span class="is-disable-btn" v-else></span>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
</a-spin>
</a-modal>
</template>
<script>
import { AutoComplete } from 'ant-design-vue'
import {
GetSysUserPage,
SysTenantPage
} from '@/api/modular/main/DjyApiAuth'
export default {
components: {
AutoComplete
},
props: {
type: {
type: String,
default: 'add'
},
formData: {
type: Object,
default: null
}
},
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
labelCol2: {
xs: { span: 24 },
sm: { span: 3 }
},
wrapperCol2: {
xs: { span: 24 },
sm: { span: 20 }
},
visible: false,
confirmLoading: false,
formLoading: true,
form: this.$form.createForm(this),
TenantData: [],
userList: [],
// formData: {},
rules: {
apiCode: [{ required: true, message: '请输入接口代码!', trigger: 'change' }],
apiName: [{ required: true, message: '请输入接口名称!', trigger: 'change' }]
}
}
},
computed: {
userListArr() {
if (this.userList) {
const arr = []
this.userList.map((item, index) => {
if (!arr.includes(item.name)) {
arr.push(item.name)
}
})
return arr
} else {
return []
}
}
},
mounted () {
SysTenantPage({ pageNo: 1, pageSize: 9999, name: '' }).then(res => {
this.TenantData = res.data.rows
})
},
methods: {
add () {
this.visible = true
this.formLoading = false
},
handleSubmit () {
this.confirmLoading = true
this.$refs.addFrom.validate(valid => {
if (valid) {
this.$emit('ok', this.formData)
} else {
this.confirmLoading = false
}
})
},
handleCancel () {
this.$refs.addFrom.clearValidate()
this.visible = false
},
tenantIdSearch(value) {
if (value) {
SysTenantPage({ pageNo: 1, pageSize: 9999, name: value }).then(res => {
this.TenantData = res.data.rows
})
}
},
getUserList(name = '', type) {
GetSysUserPage({
name: name
})
.then(res => {
if (res.success) {
this.userList = res.data
}
})
.catch(err => {
console.log(err)
})
},
//
saleSelect(value) {
const index = this.userListArr.indexOf(value)
this.formData.userId = this.userList[index].id || ''
this.formData.userName = this.userList[index].name || ''
},
saleChange(value) {
this.getUserList(value, 'sale')
},
changeExpireDate (date, dateString) {
console.log(dateString)
this.formData.expireDate = dateString || ''
},
tenantSelect (value, option) {
this.formData.tenantId = this.TenantData[value].id || ''
this.formData.tenantName = this.TenantData[value].name || ''
},
setDisableFun () {
debugger
this.$parent.setDisableFun(this.formData)
// this.$parent.init()
}
}
}
</script>
<style lang="less" scoped>
.line{
height: 30px;
line-height:30px;
text-align: right;
font-size: 14px;
span{
margin-left: 20px;
}
span:nth-of-type(2){
width: 120px;
display: inline-block;
text-align: left;
}
}
.is-disable-btn{
margin-left: 10px;
font-size: 12px;
}
</style>

@ -1,170 +0,0 @@
<template>
<a-modal
:title="`品名分类编辑(${type=='edit' ? '修改' : '新增'}`"
:width="900"
:visible="visible"
:confirmLoading="confirmLoading"
:maskClosable="false"
cancelText="关闭"
okText="保存"
@ok="handleSubmit"
@cancel="handleCancel"
>
<a-spin :spinning="formLoading">
<a-form :form="form">
<a-row :gutter="16">
<a-col :span="12">
<a-form-item
label="品名分类"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入品名分类" v-decorator="['goodsCategory', {rules: [{required: true, message: ''}]}]" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item
label="品名分类名称"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
<a-input placeholder="请输入品名分类名称" v-decorator="['goodsCategoryName']" />
</a-form-item>
</a-col>
</a-col>
</a-row>
</a-form>
</a-spin>
</a-modal>
</template>
<script>
import { AutoComplete } from 'ant-design-vue'
import {
QueryParaGoodsCategoryInfo
} from '@/api/modular/main/ProductNameList'
export default {
props: {
type: {
type: String,
default: 'add'
},
fromData: {
type: Object,
default: null
}
},
components: {
AutoComplete
},
data () {
return {
labelCol: {
xs: { span: 24 },
sm: { span: 6 }
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 }
},
labelCol2: {
xs: { span: 24 },
sm: { span: 3 }
},
wrapperCol2: {
xs: { span: 24 },
sm: { span: 20 }
},
visible: false,
confirmLoading: false,
formLoading: true,
form: this.$form.createForm(this),
goodsCategory: []
}
},
computed: {
goodsCategoryArr () {
if (this.goodsCategory) {
const arr = []
this.goodsCategory.map((item, index) => {
if (!arr.includes(item.goodsCategory)) {
arr.push(item.goodsCategory)
}
})
return arr
} else {
return []
}
}
},
watch: {
fromData: {
handler (nval, oval) {
if (!this.formLoading) {
this.$nextTick(() => {
this.form.setFieldsValue(nval)
})
}
},
deep: true
}
},
methods: {
add () {
this.visible = true
this.formLoading = false
},
handleSubmit () {
const { form: { validateFields } } = this
this.confirmLoading = true
validateFields((errors, values) => {
if (!errors) {
this.$emit('ok', values)
} else {
this.confirmLoading = false
}
})
},
handleCancel () {
this.form.resetFields()
this.visible = false
},
getGoodsCategory(name = '') {
// console.log('', name, this.goodsCategory, this.goodsCategoryArr)
QueryParaGoodsCategoryInfo({
queryItem: name,
top: 50
}).then((res) => {
this.goodsCategory = res.data
})
},
goodsCategorySelect(value) {
const index = this.goodsCategoryArr.indexOf(value)
this.form.setFieldsValue({
goodsCategory: this.goodsCategory[index].goodsCategory || '',
goodsCategoryName: this.goodsCategory[index].goodsCategoryName || ''
})
},
goodsCategoryChange(value) {
this.getGoodsCategory(value)
}
}
}
</script>
<style lang="less" scoped>
.line{
height: 30px;
line-height:30px;
text-align: right;
font-size: 14px;
span{
margin-left: 20px;
}
span:nth-of-type(2){
width: 120px;
display: inline-block;
text-align: left;
}
}
</style>

@ -3,11 +3,11 @@ export default {
{ type: 'seq', width: 60, noDraggable: true },
{ field: 'apiCode', title: '接口代码', showHeaderOverflow: true, sortable: true },
{ field: 'apiName', title: '接口名称', showHeaderOverflow: true, sortable: true },
{ field: 'isDisable', title: '是否禁用', showHeaderOverflow: true, sortable: true },
{ field: 'isDisable', title: '是否禁用', showHeaderOverflow: true, sortable: true, slots: { default: 'isDisable' } },
{ field: 'tenantName', title: '租户名称', showHeaderOverflow: true, sortable: true },
{ field: 'userCode', title: '用户代码', showHeaderOverflow: true, sortable: true },
{ field: 'userName', title: '用户名', showHeaderOverflow: true, sortable: true },
{ field: 'createdTime', title: '创建时间', showHeaderOverflow: true, sortable: true },
{ field: 'operate', title: '操作', width: 150, noDraggable: true, slots: { default: 'operate' }, fixed: 'right', resizable: false }
{ field: 'operate', title: '操作', width: 230, noDraggable: true, slots: { default: 'operate' }, fixed: 'right', resizable: false }
]
}

Loading…
Cancel
Save