dai
3 years ago
3 changed files with 952 additions and 0 deletions
@ -0,0 +1,277 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<el-form :model="peoForm" |
||||
|
label-width="120px" |
||||
|
ref="editPeoForm" |
||||
|
:rules="rulesPeo"> |
||||
|
<el-form-item label="应用名称" |
||||
|
prop="name"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.name"></el-input> |
||||
|
<span v-else> {{detailsList.name||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="应用介绍" |
||||
|
prop="remark"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.remark"></el-input> |
||||
|
<span v-else> {{detailsList.remark||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="应用链接" |
||||
|
prop="link"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.link"></el-input> |
||||
|
<span v-else> {{detailsList.link||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="测试账号" |
||||
|
prop="account"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.account"></el-input> |
||||
|
<span v-else> {{detailsList.account||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="测试密码" |
||||
|
prop="password"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.password"></el-input> |
||||
|
<span v-else> {{detailsList.password||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="第三方公司名称" |
||||
|
prop="companyName"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.companyName"></el-input> |
||||
|
<span v-else> {{detailsList.companyName||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="联系人" |
||||
|
prop="contacts"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.contacts"></el-input> |
||||
|
<span v-else> {{detailsList.contacts||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="联系电话" |
||||
|
prop="mobile"> |
||||
|
<el-input v-if="btnType=='add'" |
||||
|
v-model="peoForm.mobile"></el-input> |
||||
|
<span v-else> {{detailsList.mobile||'--'}}</span> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="状态" |
||||
|
prop="mobile" |
||||
|
v-if="btnType=='edit'"> |
||||
|
<span> {{statusStr(detailsList.status)}}</span> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div class="div-btn"> |
||||
|
<el-button size="small" |
||||
|
@click="handleClose">取 消</el-button> |
||||
|
<el-button size="small" |
||||
|
type="primary" |
||||
|
v-if="btnType!='check'" |
||||
|
@click="handleConfirm">确 定</el-button> |
||||
|
<el-button size="small" |
||||
|
v-if="btnType=='check'" |
||||
|
@click="editPeo('1')">审核不通过</el-button> |
||||
|
<el-button size="small" |
||||
|
v-if="btnType=='check'" |
||||
|
@click="editPeo('2')">审核通过</el-button> |
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
// import ConfigItem from './ConfigItem' |
||||
|
// import FootbarList from '../../productConfig/footbar/FootbarList' |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
import { Loading } from 'element-ui' // 引入Loading服务 |
||||
|
|
||||
|
let loading // 加载动画 |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
customerId: '', |
||||
|
agencyId: '', |
||||
|
casOptions: [], |
||||
|
iscascaderShow: 0, |
||||
|
|
||||
|
optionProps: { |
||||
|
multiple: false, |
||||
|
value: 'agencyId', |
||||
|
label: 'agencyName', |
||||
|
children: 'subAgencyList', |
||||
|
checkStrictly: true |
||||
|
}, |
||||
|
|
||||
|
peoForm: { |
||||
|
name: "", |
||||
|
link: "", |
||||
|
account: "", |
||||
|
password: '', |
||||
|
remark: "", |
||||
|
companyName: "", |
||||
|
contacts: "", |
||||
|
mobile: "", |
||||
|
}, |
||||
|
|
||||
|
detailsList: [], |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
|
||||
|
}, |
||||
|
props: { |
||||
|
btnType: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
detailsId: { |
||||
|
type: String, |
||||
|
default: {} |
||||
|
} |
||||
|
}, |
||||
|
async mounted () { |
||||
|
|
||||
|
|
||||
|
}, |
||||
|
created () { |
||||
|
this.initForm(this.btnType) |
||||
|
}, |
||||
|
methods: { |
||||
|
async initForm (btnType) { |
||||
|
this.btnType = btnType |
||||
|
if (btnType === 'edit' || btnType === 'check') { |
||||
|
await this.getDetailsList() |
||||
|
} |
||||
|
}, |
||||
|
async getDetailsList () { |
||||
|
const url = `/gov/access/thirdAppManage/detail/${this.detailsId}`; |
||||
|
// let params = { |
||||
|
// customerId: this.customerId, |
||||
|
// ...this.peoForm |
||||
|
// }; |
||||
|
const { data, code, msg } = await requestPost(url); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.detailsList = data |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleConfirm () { |
||||
|
if (this.btnType === 'add') { |
||||
|
this.submitPeoDo() |
||||
|
} else if (this.btnType === 'edit') { |
||||
|
this.dialogOk() |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async submitPeoDo () { |
||||
|
|
||||
|
this.$refs['editPeoForm'].validate((valid, messageObj) => { |
||||
|
|
||||
|
if (!valid) { |
||||
|
app.util.validateRule(messageObj) |
||||
|
} else { |
||||
|
|
||||
|
this.addPeo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
async addPeo () { |
||||
|
const url = "/gov/access/thirdAppManage/save"; |
||||
|
let params = { |
||||
|
customerId: this.customerId, |
||||
|
...this.peoForm |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("操作成功"); |
||||
|
|
||||
|
this.peoForm = []; |
||||
|
|
||||
|
this.dialogOk() |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
async editPeo (status) { |
||||
|
const url = "/gov/access/thirdAppManage/audit"; |
||||
|
let params = { |
||||
|
id: this.detailsId, |
||||
|
status: status |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.$message.success("操作成功"); |
||||
|
this.dialogOk() |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
handleClose () { |
||||
|
this.$emit("dialogCancle") |
||||
|
}, |
||||
|
dialogOk () { |
||||
|
this.$emit("dialogOk") |
||||
|
}, |
||||
|
|
||||
|
// 开启加载动画 |
||||
|
startLoading () { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: '正在加载……', // 加载中需要显示的文字 |
||||
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
||||
|
}) |
||||
|
}, |
||||
|
// 结束加载动画 |
||||
|
endLoading () { |
||||
|
// clearTimeout(timer); |
||||
|
if (loading) { |
||||
|
loading.close() |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
computed: { |
||||
|
rulesPeo () { |
||||
|
return { |
||||
|
name: [{ required: true, message: "应用名称必填", trigger: "change" }], |
||||
|
link: [{ required: true, message: "应用链接必填", trigger: "change" }], |
||||
|
account: [{ required: true, message: "测试账号必填", trigger: "change" }], |
||||
|
password: [{ required: true, message: "测试密码必填", trigger: "change" }], |
||||
|
contacts: [{ required: true, message: "联系人必填", trigger: "change" }], |
||||
|
mobile: [{ required: true, message: "联系电话必填", trigger: "change" }] |
||||
|
} |
||||
|
}, |
||||
|
statusStr: () => { |
||||
|
return (status) => (status == 0 ? '未审核' : status == 1 ? '审核不通过' : status == 2 ? '审核通过' : '已发布'); |
||||
|
}, |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.item-width-1 { |
||||
|
width: 200px; |
||||
|
} |
||||
|
.item-width-2 { |
||||
|
width: 400px; |
||||
|
} |
||||
|
.div-btn { |
||||
|
margin-top: 20px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
::v-deep .el-input { |
||||
|
width: 60%; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,380 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<el-form :model="dataForm" |
||||
|
:rules="dataRule" |
||||
|
ref="dataForm" |
||||
|
@keyup.enter.native="dataFormSubmitHandle()" |
||||
|
label-width="120px"> |
||||
|
<el-form-item prop="type" |
||||
|
:label="$t('menu.type')" |
||||
|
size="mini"> |
||||
|
<el-radio-group v-model="dataForm.type" |
||||
|
:disabled="!!dataForm.id"> |
||||
|
<el-radio :label="0">{{ $t('menu.type0') }}</el-radio> |
||||
|
<el-radio :label="1">{{ $t('menu.type1') }}</el-radio> |
||||
|
</el-radio-group> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="name" |
||||
|
:label="$t('menu.name')"> |
||||
|
<el-input v-model="dataForm.name" |
||||
|
:placeholder="$t('menu.name')"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="parentName" |
||||
|
:label="$t('menu.parentName')" |
||||
|
class="menu-list"> |
||||
|
<el-popover v-model="menuListVisible" |
||||
|
ref="menuListPopover" |
||||
|
placement="bottom-start" |
||||
|
trigger="click"> |
||||
|
<el-tree :data="menuList" |
||||
|
:props="{ label: 'name', children: 'children' }" |
||||
|
node-key="id" |
||||
|
ref="menuListTree" |
||||
|
:highlight-current="true" |
||||
|
:expand-on-click-node="false" |
||||
|
accordion |
||||
|
@current-change="menuListTreeCurrentChangeHandle"> |
||||
|
</el-tree> |
||||
|
</el-popover> |
||||
|
<el-input v-model="dataForm.parentName" |
||||
|
v-popover:menuListPopover |
||||
|
:readonly="true" |
||||
|
:placeholder="$t('menu.parentName')"> |
||||
|
<i v-if="dataForm.pid !== '0'" |
||||
|
slot="suffix" |
||||
|
@click.stop="deptListTreeSetDefaultHandle()" |
||||
|
class="el-icon-circle-close el-input__icon"></i> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="dataForm.type === 0" |
||||
|
prop="url" |
||||
|
:label="$t('menu.url')"> |
||||
|
<el-input v-model="dataForm.url" |
||||
|
:placeholder="$t('menu.url')"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="showFlag" |
||||
|
:label="$t('menu.showFlag')" |
||||
|
size="mini"> |
||||
|
<el-radio-group v-model="dataForm.showFlag"> |
||||
|
<el-radio :label="1">{{ $t('menu.show1') }}</el-radio> |
||||
|
<el-radio :label="0">{{ $t('menu.show2') }}</el-radio> |
||||
|
</el-radio-group> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="sort" |
||||
|
:label="$t('menu.sort')"> |
||||
|
<el-input-number v-model="dataForm.sort" |
||||
|
controls-position="right" |
||||
|
:min="0" |
||||
|
:label="$t('menu.sort')"></el-input-number> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="dataForm.type === 0" |
||||
|
prop="icon" |
||||
|
:label="$t('menu.icon')" |
||||
|
class="icon-list"> |
||||
|
<el-popover v-model="iconListVisible" |
||||
|
ref="iconListPopover" |
||||
|
placement="bottom-start" |
||||
|
trigger="click" |
||||
|
popper-class="mod-sys__menu-icon-popover"> |
||||
|
<div class="mod-sys__menu-icon-inner"> |
||||
|
<div class="mod-sys__menu-icon-list"> |
||||
|
<el-button v-for="(item, index) in iconList" |
||||
|
:key="index" |
||||
|
@click="iconListCurrentChangeHandle(item)" |
||||
|
:class="{ 'is-active': dataForm.icon === item }"> |
||||
|
<svg class="icon-svg" |
||||
|
aria-hidden="true"> |
||||
|
<use :xlink:href="`#${item}`"></use> |
||||
|
</svg> |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-popover> |
||||
|
<el-input v-model="dataForm.icon" |
||||
|
v-popover:iconListPopover |
||||
|
:readonly="true" |
||||
|
:placeholder="$t('menu.icon')"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-if="dataForm.type === 1" |
||||
|
prop="permissions" |
||||
|
:label="$t('menu.permissions')"> |
||||
|
<el-input v-model="dataForm.permissions" |
||||
|
:placeholder="$t('menu.permissionsTips')"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item v-for="(item, index) in dataForm.resourceList" |
||||
|
:key="item.key" |
||||
|
:prop="`resourceList.${index}.resourceUrl`" |
||||
|
:rules="{ required: true, message: $t('validate.required'), trigger: 'blur' }" |
||||
|
:label="index === 0 ? $t('menu.resource') : ''" |
||||
|
class="resource-list"> |
||||
|
<el-row> |
||||
|
<el-col :span="22"> |
||||
|
<el-input v-model="item.resourceUrl" |
||||
|
:placeholder="$t('menu.resourceUrl')"> |
||||
|
<el-select v-model="item.resourceMethod" |
||||
|
slot="prepend" |
||||
|
:placeholder="$t('menu.resourceMethod')"> |
||||
|
<el-option label="GET" |
||||
|
value="GET"></el-option> |
||||
|
<el-option label="POST" |
||||
|
value="POST"></el-option> |
||||
|
<el-option label="PUT" |
||||
|
value="PUT"></el-option> |
||||
|
<el-option label="DELETE" |
||||
|
value="DELETE"></el-option> |
||||
|
</el-select> |
||||
|
</el-input> |
||||
|
</el-col> |
||||
|
<el-col :span="2" |
||||
|
class="text-center"> |
||||
|
<el-button @click="resourceDeleteHandle(item)" |
||||
|
size="small" |
||||
|
type="text">{{ $t('delete') }}</el-button> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-form-item> |
||||
|
<el-form-item :label="dataForm.resourceList==null || dataForm.resourceList.length <= 0 ? $t('menu.resource') : ''"> |
||||
|
<el-button @click="resourceAddHandle()" |
||||
|
class="aui-button--dashed w-percent-100">{{ $t('menu.resourceAddItem') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div class="div-btn "> |
||||
|
<el-button @click="dialogCancle">{{ $t('cancel') }}</el-button> |
||||
|
<el-button type="primary" |
||||
|
@click="thirdAppManage()">{{ $t('confirm') }}</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
import { getIconList } from '@/utils' |
||||
|
import { requestPost } from "@/js/dai/request"; |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
menuList: [], |
||||
|
menuListVisible: false, |
||||
|
iconList: [], |
||||
|
iconListVisible: false, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
type: 0, |
||||
|
name: '', |
||||
|
pid: '0', |
||||
|
parentName: '', |
||||
|
url: '', |
||||
|
showFlag: 1, |
||||
|
resourceList: [], |
||||
|
permissions: '', |
||||
|
sort: 0, |
||||
|
icon: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
name: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
parentName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'change' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
'dataForm.type' (val) { |
||||
|
this.$refs['dataForm'].clearValidate() |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
this.iconList = getIconList() |
||||
|
this.dataForm.parentName = this.$t('menu.parentNameDefault') |
||||
|
this.dataForm.name = this.appName |
||||
|
this.dataForm.url = this.appUrl |
||||
|
this.dataForm.resourceList = [] |
||||
|
this.getMenuList().then(() => { |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
// 获取菜单列表 |
||||
|
getMenuList () { |
||||
|
return this.$http.get('/oper/access/menu/list?type=0').then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.menuList = res.data |
||||
|
}).catch(() => { }) |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/oper/access/menu/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
if (!this.dataForm.resourceList) { |
||||
|
this.dataForm.resourceList = [] |
||||
|
} |
||||
|
if (this.dataForm.pid === '0') { |
||||
|
return this.deptListTreeSetDefaultHandle() |
||||
|
} |
||||
|
this.$refs.menuListTree.setCurrentKey(this.dataForm.pid) |
||||
|
}).catch(() => { }) |
||||
|
}, |
||||
|
dialogCancle () { |
||||
|
this.$emit("dialogCancle") |
||||
|
|
||||
|
}, |
||||
|
// 上级菜单树, 设置默认值 |
||||
|
deptListTreeSetDefaultHandle () { |
||||
|
this.dataForm.pid = '0' |
||||
|
this.dataForm.parentName = this.$t('menu.parentNameDefault') |
||||
|
}, |
||||
|
// 上级菜单树, 选中 |
||||
|
menuListTreeCurrentChangeHandle (data) { |
||||
|
this.dataForm.pid = data.id |
||||
|
this.dataForm.parentName = data.name |
||||
|
this.menuListVisible = false |
||||
|
}, |
||||
|
// 图标, 选中 |
||||
|
iconListCurrentChangeHandle (icon) { |
||||
|
this.dataForm.icon = icon |
||||
|
this.iconListVisible = false |
||||
|
}, |
||||
|
// 菜单资源, 添加 |
||||
|
resourceAddHandle () { |
||||
|
this.dataForm.resourceList.push({ |
||||
|
key: new Date().getTime(), |
||||
|
resourceMethod: 'GET', |
||||
|
resourceUrl: '' |
||||
|
}) |
||||
|
}, |
||||
|
// 菜单资源, 删除 |
||||
|
resourceDeleteHandle (resource) { |
||||
|
this.dataForm.resourceList = this.dataForm.resourceList.filter(item => item.key !== resource.key) |
||||
|
}, |
||||
|
//发布事件 |
||||
|
async thirdAppManage () { |
||||
|
const url = `/gov/access/thirdAppManage/release`; |
||||
|
let params = { |
||||
|
id: this.id, |
||||
|
}; |
||||
|
|
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
requestPost(url, params).then(res => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataFormSubmitHandle() |
||||
|
}) |
||||
|
|
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/gov/access/menu', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
this.dialogCancle() |
||||
|
}).catch(() => { }) |
||||
|
}) |
||||
|
|
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
}, |
||||
|
props: { |
||||
|
id: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
appUrl: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
appName: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.mod-sys__menu { |
||||
|
.resource-list { |
||||
|
.el-select .el-input__inner { |
||||
|
min-width: 110px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
} |
||||
|
.menu-list, |
||||
|
.icon-list { |
||||
|
.el-input__inner, |
||||
|
.el-input__suffix { |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
} |
||||
|
&-icon-popover { |
||||
|
width: 458px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
&-icon-inner { |
||||
|
width: 478px; |
||||
|
max-height: 258px; |
||||
|
overflow-x: hidden; |
||||
|
overflow-y: auto; |
||||
|
} |
||||
|
&-icon-list { |
||||
|
width: 458px; |
||||
|
padding: 0; |
||||
|
margin: -8px 0 0 -8px; |
||||
|
> .el-button { |
||||
|
padding: 8px; |
||||
|
margin: 8px 0 0 8px; |
||||
|
> span { |
||||
|
display: inline-block; |
||||
|
vertical-align: middle; |
||||
|
width: 18px; |
||||
|
height: 18px; |
||||
|
font-size: 18px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.div-btn { |
||||
|
margin-top: 20px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,295 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<el-card shadow="never" |
||||
|
class="aui-card--fill"> |
||||
|
<div class="mod-/oper/customize__homecomponent}"> |
||||
|
<div class="btn_box"> |
||||
|
<el-button style="margin-right:20px" |
||||
|
size="small" |
||||
|
type="primary" |
||||
|
@click="handleAdd('add')">认证</el-button> |
||||
|
<el-button style="margin-left:20px" |
||||
|
type="primary" |
||||
|
size="small" |
||||
|
@click="handleDownDoc">下载接口文档</el-button> |
||||
|
</div> |
||||
|
|
||||
|
<el-table :data="tableData" |
||||
|
ref="ref_customertable" |
||||
|
border |
||||
|
style="width: 100%;"> |
||||
|
<el-table-column label="序号" |
||||
|
type="index" |
||||
|
header-align="left" |
||||
|
align="left" |
||||
|
width="50"></el-table-column> |
||||
|
<el-table-column label="应用名称" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
width="180" |
||||
|
prop="name"></el-table-column> |
||||
|
<el-table-column label="应用介绍" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
prop="remark"></el-table-column> |
||||
|
<el-table-column label="第三方公司名称" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
width="160" |
||||
|
prop="companyName"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="联系人" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
width="100" |
||||
|
prop="contacts"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="联系电话" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
prop="mobile" |
||||
|
width="150"></el-table-column> |
||||
|
|
||||
|
<el-table-column :label="$t('handle')" |
||||
|
fixed="right" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
width="200"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" |
||||
|
size="small" |
||||
|
@click="handleEdit('edit',scope.row)">查看</el-button> |
||||
|
<el-button type="text" |
||||
|
v-if="scope.row.status!=3&&scope.row.status!=2" |
||||
|
size="small" |
||||
|
@click="handleEdit('check',scope.row)">审核</el-button> |
||||
|
<el-button type="text" |
||||
|
size="small" |
||||
|
@click="handlePublish(scope.row)" |
||||
|
v-if="scope.row.status==2">发布</el-button> |
||||
|
|
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination :current-page="pageNo" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="pageSize" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
:total="total" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"></el-pagination> |
||||
|
</div> |
||||
|
|
||||
|
</el-card> |
||||
|
|
||||
|
<el-dialog v-if="showAdd" |
||||
|
:visible.sync="showAdd" |
||||
|
width="850" |
||||
|
:before-close="dialogCancle"> |
||||
|
<add-form ref="ref_edit" |
||||
|
:btnType="btnType" |
||||
|
:detailsId="detailsId" |
||||
|
@dialogOk="dialogOk" |
||||
|
@dialogCancle="dialogCancle"></add-form> |
||||
|
</el-dialog> |
||||
|
<el-dialog v-if="showDetail" |
||||
|
title="详情" |
||||
|
:visible.sync="showDetail" |
||||
|
width="850" |
||||
|
:before-close="dialogCancle"> |
||||
|
<add-form ref="ref_edit" |
||||
|
:btnType="btnType" |
||||
|
:detailsId="detailsId" |
||||
|
@dialogOk="dialogOk" |
||||
|
@dialogCancle="dialogCancle"></add-form> |
||||
|
</el-dialog> |
||||
|
<el-dialog :title=" $t('add')" |
||||
|
:visible.sync="showPublish" |
||||
|
width="850" |
||||
|
:before-close="dialogCancle"> |
||||
|
<publish-form ref="ref_publish" |
||||
|
@dialogCancle="dialogCancle" |
||||
|
:id='detailsId' |
||||
|
:appUrl="appUrl" |
||||
|
:appName="appName"></publish-form> |
||||
|
</el-dialog> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import addForm from './addForm' |
||||
|
// import detailForm from './detailForm' |
||||
|
// import FootbarList from '../../productConfig/footbar/FootbarList' |
||||
|
import publishForm from "./publishForm.vue" |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
import debounce from 'lodash/debounce' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
appUrl: "", |
||||
|
appName: "", |
||||
|
statusList: [ |
||||
|
{ |
||||
|
value: '0', |
||||
|
label: '未创建' |
||||
|
}, |
||||
|
{ |
||||
|
value: '1', |
||||
|
label: '已创建' |
||||
|
} |
||||
|
], |
||||
|
selOrgId: '', |
||||
|
casOptions: [], |
||||
|
agencyIdArray: [], |
||||
|
iscascaderShow: 0, |
||||
|
optionProps: { |
||||
|
multiple: false, |
||||
|
// value: 'orgId', |
||||
|
// label: 'orgName', |
||||
|
// children: 'subAgencyList', |
||||
|
checkStrictly: true, |
||||
|
|
||||
|
lazy: true, |
||||
|
lazyLoad: this.lzayLoadAgency |
||||
|
}, |
||||
|
|
||||
|
pageNo: 1, |
||||
|
pageSize: 10, |
||||
|
total: 0, |
||||
|
showAdd: false, |
||||
|
showDetail: false, |
||||
|
showPublish: false, |
||||
|
detailsId: "" |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
addForm, |
||||
|
publishForm |
||||
|
// detailForm |
||||
|
}, |
||||
|
activated () { |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['ref_customertable'].doLayout() // 解决表格错位 |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
async mounted () { |
||||
|
|
||||
|
await this.loadTable() |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
lzayLoadAgency (node, resolve) { |
||||
|
this.getAgency(node, resolve) |
||||
|
// setTimeout(() => { |
||||
|
// this.getAgency(node, resolve) |
||||
|
// }, 200) |
||||
|
}, |
||||
|
|
||||
|
handleDownDoc: debounce(function () { |
||||
|
window.open('http://172.20.46.177/oss/20230209/637e6347f1aa484aa3d8c2778e8fee9a.docx') |
||||
|
}, 2000, { 'leading': true, 'trailing': false }), |
||||
|
async getAgency (node, resolve) { |
||||
|
|
||||
|
const url = '/third/dataSync/ytorglist' |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/102/third/dataSync/ytorglist' |
||||
|
|
||||
|
let params = { |
||||
|
orgId: node.data ? node.data.value : '0', |
||||
|
|
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
const nodes = data.map(item => ({ |
||||
|
value: item.orgId, // |
||||
|
label: item.orgName, |
||||
|
// leaf: node.level >= 2 // 5层级 |
||||
|
leaf: !item.haveChild // 5层级 |
||||
|
})) |
||||
|
resolve(nodes) |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
async loadTable () { |
||||
|
|
||||
|
const url = "/gov/access/thirdAppManage/page" |
||||
|
// const url = "http://yapi.elinkservice.cn/mock/102/third/dataSync/page-user" |
||||
|
const params = { |
||||
|
pageNo: this.pageNo, |
||||
|
pageSize: this.pageSize, |
||||
|
} |
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
if (code === 0) { |
||||
|
this.tableData = data.list |
||||
|
this.total = data.total |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
handleAdd (add) { |
||||
|
this.showAdd = true |
||||
|
this.btnType = add |
||||
|
}, |
||||
|
dialogCancle () { |
||||
|
this.showAdd = false |
||||
|
this.showDetail = false |
||||
|
this.showPublish = false |
||||
|
}, |
||||
|
dialogOk () { |
||||
|
this.showAdd = false |
||||
|
this.showDetail = false |
||||
|
this.loadTable() |
||||
|
}, |
||||
|
|
||||
|
// 发布按钮 |
||||
|
handlePublish (row) { |
||||
|
this.showPublish = true |
||||
|
this.detailsId = row.id |
||||
|
this.appUrl = row.link |
||||
|
this.appName = row.name |
||||
|
console.log(row); |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.ref_publish.init() |
||||
|
}) |
||||
|
}, |
||||
|
handleEdit (add, row) { |
||||
|
this.showDetail = true |
||||
|
this.btnType = add |
||||
|
this.detailsId = row.id |
||||
|
}, |
||||
|
pageCurrentChangeHandle (val) { |
||||
|
this.pageNo = val |
||||
|
this.loadTable() |
||||
|
}, |
||||
|
pageSizeChangeHandle (val) { |
||||
|
this.pageSize = val |
||||
|
this.loadTable() |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
computed: { |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.item-width-1 { |
||||
|
width: 200px; |
||||
|
} |
||||
|
.item-width-2 { |
||||
|
width: 400px; |
||||
|
} |
||||
|
.btn_box { |
||||
|
margin-bottom: 16px; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue