<template>
|
<div class="subpage_Box">
|
<My-bread :list="[
|
`${$t('dataManage.dataManage')}`,
|
`${$t('dataManage.resourceManage')}`,
|
]"></My-bread>
|
<el-divider />
|
<div class="mainBox">
|
<div class="content_box " ref="container">
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
<el-form-item>
|
<el-input size="small" :title="$t('dataManage.vmobj.keyword')" v-model="formInline.name"
|
:placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuedataName')"> <i :title="$t('common.iquery')" slot="suffix"
|
@click="getResTableData" class="el-icon-search" style="padding-right: 8px"></i></el-input>
|
</el-form-item>
|
<!-- 服务类别 -->
|
<el-form-item>
|
<el-select size="small" v-model="formInline.category" :placeholder="$t('dataManage.layerObj.prompt18')"
|
@change="getResTableData">
|
<el-option v-for="item in serviceType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 数据类型 -->
|
<el-form-item>
|
<el-select size="small" v-model="formInline.data" :placeholder="$t('dataManage.layerObj.prompt8')"
|
@change="getResTableData">
|
<el-option v-for="item in dataType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 服务类别 -->
|
<el-form-item>
|
<el-select size="small" v-model="formInline.type" :placeholder="$t('dataManage.layerObj.prompt3')"
|
@change="getResTableData">
|
<el-option v-for="item in dataTypes" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 状态 -->
|
<el-form-item>
|
<el-select size="small" v-model="formInline.status" :placeholder="$t('dataManage.layerObj.prompt19')"
|
@change="getResTableData">
|
<el-option v-for="item in statusType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item style="float: right;">
|
<el-button v-if="menuStatus.insert" icon="el-icon-edit" type="success" @click="setInsertTableData"
|
size="small">{{ $t('common.append') }}
|
</el-button>
|
<el-button v-if="menuStatus.delete" icon="el-icon-delete" type="danger" @click="setDelTableData"
|
size="small">{{ $t('common.delete') }}
|
</el-button>
|
<el-button icon="el-icon-refresh" type="info" size="small" @click="setEmptyData">{{ $t('common.empty') }}
|
</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="dividing-line"></div>
|
<div class="table_box" :style="styleVar">
|
<el-table :data="tableData" style="width: 100%" border height="calc(100% - 10px)"
|
@selection-change="handleSelectionChange" @cell-dblclick="copyText">
|
<el-table-column type="selection" width="55" />
|
<el-table-column align="center" type="index" :label="$t('dataManage.styleObj.index')" width="100" />
|
<el-table-column sortable align="center" prop="cnName" :label="$t('dataManage.layerObj.resourceName')" />
|
<!-- <el-table-column
|
align="center"
|
prop="enName"
|
:label="$t('dataManage.layerObj.englishName')"
|
width="170"
|
/> -->
|
<!-- <el-table-column align="center" prop="status" :label="$t('dataManage.layerObj.status')"
|
:formatter="setResStatus" width="150" /> -->
|
<!-- <el-table-column align="center" prop="category" :label="$t('dataManage.layerObj.firm')"
|
:formatter="setResCategory" width="150" /> -->
|
<el-table-column sortable align="center" prop="type" :label="$t('dataManage.layerObj.serviceType')"
|
:formatter="setResType" />
|
<el-table-column sortable align="center" prop="data" :label="$t('dataManage.layerObj.dataType')"
|
:formatter="setResData" />
|
<!-- <el-table-column align="center" prop="tab" :label="$t('dataManage.layerObj.tableName')" width="150" /> -->
|
<el-table-column sortable align="center" prop="url" :label="$t('dataManage.layerObj.serviceAddress')" />
|
<!-- <el-table-column align="center" prop="args" :label="$t('dataManage.layerObj.serviceParameters')" width="220" /> -->
|
<!-- <el-table-column align="center" prop="test" :label="$t('dataManage.layerObj.testAddress')" width="300" /> -->
|
<el-table-column sortable align="center" prop="proxy" :label="$t('dataManage.layerObj.proxyAddress')"
|
:formatter="formatProxy" />
|
<!-- <el-table-column align="center" prop="descr" :label="$t('dataManage.layerObj.descr')" width="200" /> -->
|
<!-- <el-table-column align="center" prop="createName" :label="$t('dataManage.vmobj.createonuser')" width="200" /> -->
|
<el-table-column sortable align="center" prop="createTime" :label="$t('dataManage.vmobj.createontime')"
|
:formatter="formatData" />
|
<!-- <el-table-column align="center" prop="updateName" :label="$t('dataManage.vmobj.updateonuser')" width="200" /> -->
|
<el-table-column sortable align="center" prop="updateTime" :label="$t('dataManage.vmobj.updateontime')"
|
:formatter="formatData" />
|
<!-- <el-table-column align="center" prop="bak" :label="$t('common.bak')" width="200" /> -->
|
<el-table-column :label="$t('common.operate')" width="300">
|
<template slot-scope="scope">
|
<el-button @click="setScopeSee(scope.row)" size="mini" type="primary" plain>{{ $t('common.see')
|
}}</el-button>
|
<el-button @click="setScopeEdit(scope.row)" size="mini" type="warning" plain>{{ $t('common.update')
|
}}</el-button>
|
<el-button size="mini" v-show="scope.row.status != 0" plain @click="setScopePreview(scope.row)">{{
|
$t('common.preview') }}</el-button>
|
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<div class="pagination_box" style="margin-top: 15px">
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
:current-page="listData.pageIndex" :page-sizes="[10, 50, 100, 200]" :page-size="listData.pageSize"
|
layout="total, sizes, prev, pager, next, jumper" :total="listData.count">
|
</el-pagination>
|
</div>
|
</div>
|
</div>
|
<el-dialog :title="$t('common.append')" :visible.sync="insertDialog" width="50%" :show-close="false">
|
<div style="width: 100%;max-height: 63vh;overflow-y: auto;">
|
<el-form :model="insertData" class="demo-form-inline" label-width="120px">
|
<el-form-item :label="$t('dataManage.layerObj.resourceName')">
|
<el-input v-model="insertData.cnName" :placeholder="$t('dataManage.layerObj.prompt13')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
|
<el-form-item :label="$t('dataManage.layerObj.firm')">
|
<el-select class="insertWidth" v-model="insertData.category" :placeholder="$t('dataManage.layerObj.prompt3')">
|
<el-option v-for="item in serviceType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.dataType')">
|
<el-select class="insertWidth" v-model="insertData.data" @change="setCategoryTypeChange"
|
:placeholder="$t('dataManage.layerObj.prompt3')">
|
<el-option v-for="item in dataType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item :label="$t('dataManage.layerObj.serviceType')">
|
<el-select class="insertWidth" v-model="insertData.type" :placeholder="$t('dataManage.layerObj.prompt8')">
|
<el-option v-for="item in categoryType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item v-if="insertData.category == 2" :label="$t('dataManage.layerObj.layerName')">
|
<el-input v-model="insertData.tab" class="insertWidth"
|
:placeholder="$t('dataManage.layerObj.prompt1')"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.serviceAddress')">
|
<el-input v-model="insertData.url" :placeholder="$t('dataManage.layerObj.prompt4')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.testAddress')">
|
<el-input v-model="insertData.test" :placeholder="$t('dataManage.layerObj.prompt9')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.serviceParameters')">
|
<el-input v-model="insertData.args" :placeholder="$t('dataManage.layerObj.prompt15')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.status')">
|
<div class="insertWidth">
|
<el-radio v-model="insertData.status" label="0">{{ $t('dataManage.layerObj.disable') }}</el-radio>
|
<el-radio v-model="insertData.status" label="1">
|
{{ $t('dataManage.layerObj.enableOriginalAddress') }}</el-radio>
|
<el-radio v-model="insertData.status" label="2"> {{ $t('dataManage.layerObj.enableProxy') }}</el-radio>
|
</div>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.descr')">
|
<el-input v-model="insertData.descr" :placeholder="$t('dataManage.layerObj.prompt16')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('common.bak')">
|
<el-input v-model="insertData.bak" :placeholder="$t('dataManage.layerObj.prompt17')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
|
</el-form>
|
<span slot="footer" class="dialog-footer" style="float: right; margin-right: 10%;">
|
<el-button @click="setInsertCannel" size="small">{{ $t('common.cancel') }}</el-button>
|
<el-button type="primary" size="small" @click="setInsertConfirm">{{ $t('common.confirm') }}</el-button>
|
</span>
|
</div>
|
</el-dialog>
|
<el-dialog :title="$t('common.edit')" :visible.sync="editDialog" width="50%" :before-close="handleEditClose">
|
<div style="width: 100%;max-height: 63vh;overflow-y: auto;">
|
<el-form :model="editData" class="demo-form-inline" label-width="120px">
|
<el-form-item :label="$t('dataManage.layerObj.resourceName')">
|
<el-input v-model="editData.cnName" :placeholder="$t('dataManage.layerObj.prompt13')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<!-- <el-form-item :label="$t('dataManage.layerObj.englishName')">
|
<el-input
|
v-model="editData.enName"
|
:placeholder="$t('dataManage.layerObj.prompt14')"
|
class="insertWidth"
|
></el-input>
|
</el-form-item> -->
|
<el-form-item :label="$t('dataManage.layerObj.firm')">
|
<el-select class="insertWidth" v-model="editData.category" :placeholder="$t('dataManage.layerObj.prompt3')">
|
<el-option v-for="item in serviceType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.dataType')">
|
<el-select class="insertWidth" v-model="editData.data" @change="setEdtitTypeChange"
|
:placeholder="$t('dataManage.layerObj.prompt3')">
|
<el-option v-for="item in dataType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.serviceType')">
|
<el-select class="insertWidth" v-model="editData.type" :placeholder="$t('dataManage.layerObj.prompt8')">
|
<el-option v-for="item in categoryType" :key="item.value" :label="item.label" :value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item :label="$t('dataManage.layerObj.tableName')">
|
<el-input v-model="editData.tab" class="insertWidth"
|
:placeholder="$t('dataManage.layerObj.prompt12')"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.serviceAddress')">
|
<el-input v-model="editData.url" :placeholder="$t('dataManage.layerObj.prompt4')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.testAddress')">
|
<el-input v-model="editData.test" :placeholder="$t('dataManage.layerObj.prompt9')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.serviceParameters')">
|
<el-input v-model="editData.args" :placeholder="$t('dataManage.layerObj.prompt15')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.status')">
|
<div class="insertWidth">
|
<el-radio v-model="editData.status" label="0">{{ $t('dataManage.layerObj.disable') }}</el-radio>
|
<el-radio v-model="editData.status" label="1">
|
{{ $t('dataManage.layerObj.enableOriginalAddress') }}</el-radio>
|
<el-radio v-model="editData.status" label="2"> {{ $t('dataManage.layerObj.enableProxy') }}</el-radio>
|
</div>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.layerObj.descr')">
|
<el-input v-model="editData.descr" :placeholder="$t('dataManage.layerObj.prompt16')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('common.bak')">
|
<el-input v-model="editData.bak" :placeholder="$t('dataManage.layerObj.prompt17')"
|
class="insertWidth"></el-input>
|
</el-form-item>
|
|
</el-form>
|
<span slot="footer" class="dialog-footer" style="float: right; margin-right: 10%;">
|
<el-button @click="setEditReset" size="small">{{ $t('common.reset') }}</el-button>
|
<el-button type="primary" size="small" @click="setEditConfirm">{{ $t('common.confirm') }}</el-button>
|
</span>
|
</div>
|
</el-dialog>
|
<div class="infoBox_box" v-show="seeDialog" style="z-index:99999">
|
<div class="infoBox box_div">
|
<div slot="header" class="clearfix">
|
<span>{{ $t("common.details") }}</span>
|
<div style="float: right; cursor: pointer" @click="handleSeeClose">
|
<i class="el-icon-close"></i>
|
</div>
|
</div>
|
<el-divider></el-divider>
|
<div class="contentBox" style="padding:1%">
|
<p>
|
{{ $t("dataManage.layerObj.resourceName") }}:{{
|
seeData.cnName
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.englishName") }}:{{
|
seeData.enName
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.status") }}:{{
|
seeData.status
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.firm") }}:{{
|
seeData.category
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.serviceType") }}:{{
|
seeData.type
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.dataType") }}:{{
|
seeData.data
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.tableName") }}:{{
|
seeData.tab
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.serviceParameters") }}:{{
|
seeData.args
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.testAddress") }}:{{
|
seeData.test
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.proxyAddress") }}:{{
|
seeData.proxy
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.layerObj.descr") }}:{{
|
seeData.descr
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.vmobj.createonuser") }}:{{
|
seeData.createName
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.vmobj.createontime") }}:{{
|
seeData.createTime
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.vmobj.updateonuser") }}:{{
|
seeData.updateName
|
}}
|
</p>
|
<el-divider></el-divider>
|
<p>
|
{{ $t("dataManage.vmobj.updateontime") }}:{{
|
seeData.updateTime
|
}}
|
</p>
|
</div>
|
</div>
|
</div>
|
|
<!-- 地址预览 -->
|
<el-dialog :title="$t('common.preview')" :class="isFullscreen ? '' : 'dialogClass_his'"
|
custom-class="handleDialogClass" width="73.4%" :fullscreen="isFullscreen" v-if="prevDialog"
|
:visible.sync="prevDialog" :show-close="false" :close-on-click-modal="false" :close-on-press-escape="false">
|
<dialog-header slot="title" :dialog-tittle="$t('common.preview')" :fullscreen="isFullscreen"
|
@handle-closed="handleClose" @is-fullscreen="onFullscreen"></dialog-header>
|
<div :class="{ 'fullscreen1': isFullscreen }">
|
<mapview v-if="showMapView"></mapview>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
import MyBread from "../../components/MyBread.vue";
|
import dialogHeader from './dialogHeader.vue'
|
import server from '../../components/js/server.js'
|
import {
|
getPerms,
|
select_Res_ByPageAndCount,
|
res_insert,
|
res_deletes,
|
res_updates,
|
res_update,
|
token_insertNewToken
|
} from "../../api/api";
|
import $ from 'jquery'
|
import { getToken } from '../../utils/auth';
|
import { serve_type, data_type, category_type } from './js/layerManage.js'
|
import { json } from "body-parser";
|
import { flatten } from '@turf/turf';
|
import mapview from '../../components/MapView/moonMap.vue'
|
export default {
|
name: "catalogueManage",
|
components: {
|
MyBread, mapview, 'dialog-header': dialogHeader,
|
},
|
data() {
|
|
return {
|
formInline: {
|
name: null,
|
type: null,
|
data: null,
|
category: null,
|
status: null
|
},
|
menuStatus: {
|
delete: false,
|
insert: false,
|
updaete: false
|
},
|
styleVar: {
|
height: "calc(100% - 109px)",
|
},
|
timer: 0,
|
tableHeight: 0,
|
tableData: [],
|
listData: {
|
pageIndex: 1,
|
pageSize: 10,
|
count: 0
|
},
|
multipleSelection: [],
|
editData: {},
|
copyData: null,
|
insertData: {
|
status: "2",
|
category: null,
|
type: null,
|
data: null
|
},
|
editDialog: false,
|
seeDialog: false,
|
seeData: {},
|
insertDialog: false,
|
dataType: [],
|
dataTypes: [],
|
serviceType: [],
|
categoryType: [],
|
insertDisabled: false,
|
editDisabled: false,
|
isFullscreen: false,
|
prevDialog: false,
|
showMapView: false,
|
statusType: [
|
{
|
label: '禁用', value: 0
|
},
|
{
|
label: '启用原始地址', value: 1
|
}, {
|
label: '启用代理地址', value: 2
|
}
|
], resToken: null,
|
};
|
},
|
watch: {
|
|
},
|
beforeDestroy() {
|
this.timer && clearTimeout(this.timer);
|
window.removeEventListener("resize", this.onResize);
|
},
|
methods: {
|
async getResToken() {
|
if (this.$store.state.resToken) {
|
this.resToken = this.$store.state.resToken
|
} else {
|
const data = await token_insertNewToken({
|
type: 1,
|
min: 43200
|
});
|
if (data.code == 200) {
|
this.$store.state.resToken = data.result.token;
|
this.resToken = data.result.token;
|
}
|
}
|
},
|
|
//是否为全屏函数
|
onFullscreen(fullscreen) {
|
this.isFullscreen = fullscreen;
|
},
|
//预览弹窗关闭
|
handleClose() {
|
this.prevDialog = false
|
this.showMapView = false;
|
|
},
|
async setEditConfirm() {
|
if (this.editData.url.indexOf('?') > -1) {
|
var val = this.editData.url.split("?");
|
this.editData.url = val[0];
|
this.editData.args = this.editData.args + val[1];
|
}
|
const data = await res_update(this.editData);
|
if (data.code == 200) {
|
this.$message({
|
message: '资源更新成功',
|
type: 'success'
|
});
|
this.setEditClose();
|
this.setListDataStart();
|
} else {
|
this.$message.error('资源更新失败');
|
}
|
},
|
setEditReset() {
|
this.editData = JSON.parse(JSON.stringify(this.copyData));
|
this.editData.status = this.editData.status.toString();
|
},
|
setEditClose() {
|
this.editDialog = false;
|
this.editData = {};
|
this.copyData = {};
|
},
|
handleEditClose() {
|
var that = this;
|
this.$confirm('确认关闭?')
|
.then(_ => {
|
that.setEditClose();
|
})
|
.catch(_ => { });
|
},
|
setEmptyData() {
|
this.formInline = {
|
name: null,
|
type: null,
|
data: null,
|
category: null,
|
status: null
|
}
|
this.setListDataStart()
|
},
|
setInsertTableData() {
|
this.insertData.category = this.serviceType[0].value
|
this.insertData.data = this.dataType[0].value
|
this.setServeTypeChange(this.dataType[0].children)
|
this.insertDialog = true;
|
|
},
|
setServeTypeChange(res) {
|
var std = [];
|
for (var i in res) {
|
for (var j in serve_type) {
|
if (serve_type[j].value == res[i]) {
|
std.push({
|
value: serve_type[j].value,
|
label: serve_type[j].name,
|
})
|
}
|
}
|
}
|
this.categoryType = std
|
this.insertData.type = this.categoryType[0].value
|
},
|
|
setCategoryTypeChange(item) {
|
var filter = this.dataType.filter(res => {
|
if (res.value == item) {
|
return res
|
}
|
})
|
this.setServeTypeChange(filter[0].children)
|
},
|
setEdtitTypeChange(item) {
|
var filter = this.dataType.filter(res => {
|
if (res.value == item) {
|
return res
|
}
|
})
|
this.setEditServeTypeChange(filter[0].children)
|
},
|
setEditServeTypeChange(res) {
|
var std = [];
|
for (var i in res) {
|
for (var j in serve_type) {
|
if (serve_type[j].value == res[i]) {
|
std.push({
|
value: serve_type[j].value,
|
label: serve_type[j].name,
|
})
|
}
|
}
|
}
|
this.categoryType = std
|
this.editData.type = this.categoryType[0].value
|
},
|
|
|
|
|
async setDelTableData() {
|
if (this.multipleSelection.length <= 0) {
|
return this.$message('请选择要删除的资源数据');
|
}
|
var std = [];
|
for (var i in this.multipleSelection) {
|
std.push(this.multipleSelection[i].id)
|
}
|
const data = await res_deletes({ ids: std.toString() })
|
if (data.code == 200) {
|
this.$message({
|
message: '资源删除成功',
|
type: 'success'
|
});
|
this.setListDataStart();
|
} else {
|
this.$message.error('资源删除失败');
|
}
|
},
|
closeInsertDialog() {
|
this.insertDialog = false;
|
this.insertData = {
|
status: '2'
|
}
|
},
|
setInsertCannel() {
|
var that = this;
|
this.$confirm('确认关闭?')
|
.then(_ => {
|
that.closeInsertDialog()
|
})
|
.catch(_ => { });
|
},
|
async setInsertConfirm() {
|
if (this.insertData.url.indexOf('?') > -1) {
|
var val = this.insertData.url.split("?");
|
this.insertData.url = val[0];
|
this.insertData.args = val[1] + this.insertData.args;
|
}
|
|
this.insertData.status = parseInt(this.insertData.status)
|
const data = await res_insert(this.insertData);
|
if (data.code == 200) {
|
this.$message({
|
message: '资源新增成功',
|
type: 'success'
|
});
|
this.closeInsertDialog();
|
this.setListDataStart();
|
|
} else {
|
this.$message.error('资源新增失败');
|
}
|
|
},
|
//下拉菜单初始化
|
optionsStart() {
|
var std = [];
|
var ste = [];
|
var str = [];
|
for (var i in category_type) {
|
ste.push({
|
value: category_type[i].value,
|
label: category_type[i].name,
|
})
|
}
|
this.serviceType = ste;
|
|
for (var i in data_type) {
|
str.push({
|
value: data_type[i].value,
|
label: data_type[i].name,
|
children: data_type[i].children
|
})
|
}
|
this.dataType = str;
|
for (var i in serve_type) {
|
std.push({
|
value: serve_type[i].value,
|
label: serve_type[i].name,
|
})
|
}
|
this.dataTypes = std;
|
},
|
handleSeeClose() {
|
this.seeDialog = false
|
this.seeData = {};
|
},
|
|
setScopeSee(row) {
|
this.seeDialog = true;
|
this.seeData = JSON.parse(JSON.stringify(row));
|
this.seeData.status = this.setResStatus(this.seeData)
|
this.seeData.category = this.setResCategory(this.seeData)
|
this.seeData.data = this.setResData(this.seeData)
|
this.seeData.type = this.setResType(this.seeData)
|
this.seeData.proxy = this.formatProxy(this.seeData)
|
this.seeData.createTime = this.seeData.createTime ? this.format(this.seeData.createTime) : null;
|
|
this.seeData.updateTime = this.seeData.updateTime ? this.format(this.seeData.updateTime) : null;
|
},
|
|
setScopeEdit(row) {
|
|
this.copyData = JSON.parse(JSON.stringify(row));
|
this.editData = JSON.parse(JSON.stringify(row));
|
this.editData.status = this.editData.status.toString()
|
this.editData.category = parseInt(this.editData.category)
|
this.editData.type = parseInt(this.editData.type)
|
if (this.editData.data) {
|
this.editData.data = parseInt(this.editData.data)
|
}
|
|
this.setEditDataStart(this.editData.category);
|
|
this.editDialog = true
|
},
|
setEditDataStart(res) {
|
for (var i in data_type) {
|
if (data_type[i].value == res) {
|
this.setServeTypeChange(data_type[i].children)
|
break
|
}
|
}
|
},
|
|
|
|
|
|
setScopePreview(row) {
|
this.prevDialog = true;
|
this.showMapView = true;
|
setTimeout(() => {
|
server.addLayer(row)
|
}, 1000);
|
},
|
formatProxy(row, column) {
|
var token = this.resToken
|
if (row.proxy && row.proxy.indexOf('{token}') > -1) {
|
var val = row.proxy.replaceAll('{token}', token)
|
return BASE_URL + val
|
}
|
},
|
copyText(row, column, cell, event) {
|
// 双击复制
|
let save = function (e) {
|
e.clipboardData.setData('text/plain', event.target.innerText);
|
e.preventDefault(); //阻止默认行为
|
}
|
document.addEventListener('copy', save);//添加一个copy事件
|
document.execCommand("copy");//执行copy方法
|
this.$message({ message: '复制成功', type: 'success' })//提示
|
},
|
|
//格式化列表
|
formatData(row, column) {
|
let data = row[column.property];
|
if (data == null) {
|
return data;
|
}
|
return this.format(data);
|
},
|
//格式化时间
|
format(shijianchuo) {
|
//shijianchuo是整数,否则要parseInt转换
|
var time = new Date(shijianchuo);
|
var y = time.getFullYear();
|
var m = time.getMonth() + 1;
|
var d = time.getDate();
|
var h = time.getHours();
|
var mm = time.getMinutes();
|
var s = time.getSeconds();
|
return (
|
y +
|
'-' +
|
this.add0(m) +
|
'-' +
|
this.add0(d) +
|
' ' +
|
h +
|
':' +
|
mm +
|
':' +
|
s
|
);
|
},
|
//格式化时间
|
add0(m) {
|
return m < 10 ? '0' + m : m;
|
},
|
setResType(row, column) {
|
switch (row.type) {
|
case 0:
|
return "URL"
|
break;
|
case 1:
|
return "TMS"
|
break;
|
case 2:
|
return "WMTS"
|
break;
|
case 3:
|
return "WMS"
|
break;
|
case 4:
|
return "WFS"
|
break;
|
case 5:
|
return "Tileset"
|
break;
|
default:
|
return ""
|
break;
|
}
|
},
|
setResData(row, column) {
|
switch (row.data) {
|
case 1:
|
return "数字正射影像图"
|
break;
|
case 2:
|
return "场景地形数据"
|
break;
|
case 3:
|
return "数字高程模型(晕渲图)"
|
break;
|
case 4:
|
return "单波段栅格数据"
|
break;
|
case 5:
|
return "多光谱栅格数据"
|
break;
|
case 6:
|
return "高光谱栅格数据"
|
break;
|
case 7:
|
return "矢量图层"
|
break;
|
case 8:
|
return "三维模型"
|
break;
|
default:
|
return ""
|
break;
|
}
|
},
|
setResCategory(row, column) {
|
switch (row.category) {
|
case 0:
|
return "其他"
|
break;
|
case 1:
|
return "GisServer"
|
break;
|
case 2:
|
return "GeoServer"
|
break;
|
case 3:
|
return "数简"
|
break;
|
case 4:
|
return "ArcGisServer"
|
break;
|
default:
|
return ""
|
break;
|
}
|
},
|
setResStatus(row, column) {
|
|
switch (row.status) {
|
case 0:
|
return "禁用"
|
break;
|
case 1:
|
return "启用原始地址"
|
break;
|
case 2:
|
return "启用代理地址"
|
break;
|
default:
|
return ""
|
break;
|
}
|
},
|
async getResTableData() {
|
this.listData.name = this.formInline.name;
|
this.listData.data = this.formInline.data;
|
this.listData.type = this.formInline.type;
|
this.listData.category = this.formInline.category;
|
this.listData.status = this.formInline.status;
|
const data = await select_Res_ByPageAndCount(this.listData);
|
if (data.code != 200) {
|
return this.$message({
|
message: "资源列表获取失败",
|
type: "warning",
|
});
|
}
|
|
this.tableData = data.result;
|
this.listData.count = data.count;
|
},
|
setListDataStart() {
|
this.listData = {
|
pageIndex: 1,
|
pageSize: 10,
|
count: 0
|
}
|
this.tableData = []
|
this.getResTableData();
|
},
|
handleSelectionChange(val) {
|
this.multipleSelection = val;
|
},
|
handleSizeChange(val) {
|
this.listData.pageSize = val;
|
this.getResTableData();
|
},
|
handleCurrentChange(val) {
|
this.listData.pageIndex = val;
|
this.getResTableData();
|
},
|
onResize() {
|
this.timer && clearTimeout(this.timer);
|
this.timer = setTimeout(() => {
|
this.calHeight();
|
}, 500);
|
},
|
//高度设置
|
calHeight() {
|
this.$nextTick(() => {
|
const rect = this.$refs.container.getBoundingClientRect();
|
this.tableHeight = `${rect.height + 97}px`;
|
this.styleVar["height"] = `calc(100% - ${rect.height + 28}px)`;
|
});
|
},
|
//获取权限
|
getPerms() {
|
var val = this.$store.state.currentPerms;
|
var permsEntity = this.$store.state.permsEntity;
|
|
if (!permsEntity || !permsEntity.length) {
|
getPerms().then((res) => {
|
if (res.code == 200) {
|
permsEntity = res.result;
|
}
|
});
|
}
|
for (var i = 0; i < permsEntity.length; i++) {
|
if (val === permsEntity[i].perms) {
|
this.showPermsMenu(permsEntity[i]);
|
}
|
}
|
|
},
|
showPermsMenu(res) {
|
switch (res.tag) {
|
case "/delete":
|
this.menuStatus.delete = true;
|
break;
|
case "/insert":
|
this.menuStatus.insert = true;
|
break;
|
case "/update":
|
this.menuStatus.update = true;
|
break;
|
}
|
},
|
},
|
mounted() {
|
window.addEventListener("resize", this.onResize);
|
this.getResToken();
|
this.calHeight();
|
this.getPerms();
|
this.setListDataStart();
|
this.optionsStart();
|
|
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.subpage_Box {
|
//height: 96%;
|
width: 98%;
|
padding: 1%;
|
border-radius: 10px;
|
}
|
|
.mainBox {
|
padding-top: 10px;
|
width: 100%;
|
height: calc(100% - 75px);
|
|
.content_box {
|
width: 100%;
|
// border-bottom: 2px solid #e4e7ed;
|
margin-bottom: 10px;
|
|
.el-form-item {
|
margin: 5px;
|
}
|
}
|
}
|
|
.fullscreen1 {
|
width: 100%;
|
height: 94vh;
|
}
|
|
/deep/ .el-input__suffix {
|
top: 50%;
|
transform: translateY(-50%);
|
}
|
|
.insertWidth {
|
width: calc(100% - 200px);
|
}
|
|
/deep/.el-dialog__body {
|
padding: 10px !important;
|
}
|
|
/deep/.el-dialog__header {
|
padding: 10px !important;
|
}
|
</style>
|
<style >
|
.el-message-box {
|
background: #303030 !important;
|
}
|
|
.el-message-box p {
|
color: #fff !important;
|
}
|
</style>
|