<template>
|
<div class="mod-config">
|
<basic-container>
|
<el-form :inline="true" :model="dataForm">
|
<el-form-item>
|
<el-button v-if="permissions.resource_connector_add" icon="el-icon-plus" type="primary" @click="addOrUpdateHandle()">新增</el-button>
|
</el-form-item>
|
</el-form>
|
|
<div class="avue-crud">
|
<el-col style="width: 49.5%">
|
<el-table
|
:data="fromList"
|
border
|
highlight-current-row
|
@current-change="handleCurrentChange"
|
v-loading="dataListLoading">
|
<el-table-column label="从资源">
|
<template v-for="(col,index) in this.cols">
|
<el-table-column
|
:prop="col.prop"
|
:label="col.label"
|
header-align="center"
|
align="center">
|
</el-table-column>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="avue-crud__pagination">
|
<el-pagination
|
@size-change="sizeChangeHandle1"
|
@current-change="currentChangeHandle1"
|
:current-page="pageIndex1"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageSize1"
|
:total="totalPage2"
|
background
|
layout="total, sizes, prev, pager, next, jumper">
|
</el-pagination>
|
</div>
|
</el-col>
|
<el-col style="width: 49.5%;float: right" >
|
<el-table
|
:data="toList"
|
border
|
v-loading="dataListLoading">
|
<el-table-column label="到资源">
|
<template v-for="(col,index) in this.cols">
|
<el-table-column
|
:prop="col.prop"
|
:label="col.label"
|
header-align="center"
|
align="center">
|
</el-table-column>
|
</template>
|
<el-table-column
|
header-align="center"
|
align="center"
|
label="操作">
|
<template slot-scope="scope">
|
<el-button v-if="permissions.resource_connector_del" type="text" size="small" icon="el-icon-delete" @click="deleteHandle(scope.row.id)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table-column>
|
</el-table>
|
<div class="avue-crud__pagination">
|
<el-pagination
|
@size-change="sizeChangeHandle2"
|
@current-change="currentChangeHandle2"
|
:current-page="pageIndex2"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="pageSize2"
|
:total="totalPage2"
|
background
|
layout="total, sizes, prev, pager, next, jumper">
|
</el-pagination>
|
</div>
|
</el-col>
|
<!-- 弹窗, 新增 / 修改 -->
|
<table-form v-if="addOrUpdateVisible" @refreshDataList="getDataList2" ref="addOrUpdate"></table-form>
|
</div>
|
</basic-container>
|
</div>
|
</template>
|
|
<script>
|
import {getSqlRes, delObj,getRes} from '@/api/aps/connector'
|
import TableForm from './connector-form'
|
import {mapGetters} from 'vuex'
|
export default {
|
data () {
|
return {
|
cols:[
|
{label:"资源编号",prop:"resourceNo"},
|
{label:"资源名称",prop:"resourceName"},
|
{label:"备注",prop:"remark"},
|
],
|
dataForm: {
|
key: ''
|
},
|
fromList: [],
|
toList: [],
|
pageIndex1: 1,
|
pageSize1: 10,
|
pageIndex2: 1,
|
pageSize2: 10,
|
totalPage1: 0,
|
totalPage2: 0,
|
currentRow:[],
|
dataListLoading: false,
|
addOrUpdateVisible: false
|
}
|
},
|
components: {
|
TableForm
|
},
|
created () {
|
this.getDataList1()
|
},
|
computed: {
|
...mapGetters(['permissions'])
|
},
|
methods: {
|
handleCurrentChange(val) {
|
this.currentRow = val;
|
this.getDataList2();
|
},
|
// 获取数据列表
|
getDataList1 () {
|
this.dataListLoading = true
|
getRes(Object.assign({
|
current: this.pageIndex1,
|
size: this.pageSize1
|
})).then(response => {
|
this.fromList = response.data.data.records
|
this.totalPage1 = response.data.data.total
|
})
|
this.dataListLoading = false
|
},
|
getDataList2 () {
|
this.dataListLoading = true
|
getSqlRes(Object.assign({
|
current: this.pageIndex2,
|
size: this.pageSize2
|
}),this.currentRow.id).then(response => {
|
this.toList = response.data.data.records
|
this.totalPage2 = response.data.data.total
|
})
|
this.dataListLoading = false
|
},
|
// 每页数
|
sizeChangeHandle1 (val) {
|
this.pageSize1 = val
|
this.pageIndex1 = 1
|
this.getDataList1()
|
},
|
// 当前页
|
currentChangeHandle1 (val) {
|
this.pageIndex1 = val
|
this.getDataList1()
|
},
|
sizeChangeHandle2 (val) {
|
this.pageSize2 = val
|
this.pageIndex2 = 1
|
this.getDataList2()
|
},
|
// 当前页
|
currentChangeHandle2 (val) {
|
this.pageIndex2 = val
|
this.getDataList2()
|
},
|
// 新增
|
addOrUpdateHandle () {
|
this.addOrUpdateVisible = true
|
try{
|
if(this.currentRow.id == ''||this.currentRow.id == undefined){
|
throw new Error("require from_resource")
|
}
|
this.$nextTick(() => {
|
this.$refs.addOrUpdate.init(this.currentRow.id)
|
})
|
}catch(e){
|
this.$message.error('请选择从资源');
|
}
|
|
},
|
// 删除
|
deleteHandle (id) {
|
delObj(this.currentRow.id, id)
|
this.$message.success('删除成功')
|
this.getDataList2()
|
},
|
},
|
}
|
</script>
|
