From cd6722665d20ed6a9221a44d381b5e0901fc918d Mon Sep 17 00:00:00 2001 From: Surpriseplus <845948745@qq.com> Date: 星期五, 15 九月 2023 17:12:09 +0800 Subject: [PATCH] 颜色别表更新 --- src/views/datamanage/layerManagement.vue | 971 +++++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 699 insertions(+), 272 deletions(-) diff --git a/src/views/datamanage/layerManagement.vue b/src/views/datamanage/layerManagement.vue index f7f636d..1cca2bd 100644 --- a/src/views/datamanage/layerManagement.vue +++ b/src/views/datamanage/layerManagement.vue @@ -1,9 +1,9 @@ <template> <div class="subpage_Box"> <My-bread :list="[ - `${$t('dataManage.dataManage')}`, - `${$t('dataManage.layerManage')}`, - ]"></My-bread> + `${$t('dataManage.dataManage')}`, + `${$t('dataManage.layerManage')}`, + ]"></My-bread> <el-divider /> <div class="mainBox"> @@ -35,15 +35,15 @@ <div class="inquire" style=" - align-items: center; - display: flex; - justify-content: space-between; - " + align-items: center; + display: flex; + justify-content: space-between; + " > <el-breadcrumb separator="/"> <el-breadcrumb-item :to="{ path: '/' }">{{ - - }}</el-breadcrumb-item> + + }}</el-breadcrumb-item> </el-breadcrumb> <div style="margin-right: -5px"> <div class="menuTop"> @@ -58,7 +58,7 @@ >{{ $t("shuJuGuanLi.butten.NewPeer") }}</el-button> </el-form-item> <!-- 瀛愮骇鑺傜偣娣诲姞 --> - <el-form-item v-show="menuStatus.insert && formInline.type == 1"> + <el-form-item v-show="menuStatus.insert && formInline.isLayer == 0"> <el-button type="success" size="small" @@ -99,63 +99,72 @@ </div> <div class="dividing-line"></div> - <div style="padding: 10px;"> + <div style="padding: 10px;height: 70vh;margin-top: 10px; overflow: auto;"> <el-form :model="formInline" class="demo-form-inline" label-width="150px" > - <!-- 鑿滃崟鍚嶇О --> - <el-form-item :label="$t('dataManage.layerObj.layerName')"> - <el-input - style="width: 80%;" - v-model="formInline.cnName" - :placeholder="$t('dataManage.layerObj.prompt1')" - ></el-input> - </el-form-item> - <!-- 鑻辨枃鍚嶇О --> - <el-form-item :label="$t('dataManage.layerObj.englishName')"> - <el-input - style="width: 80%;" - v-model="formInline.enName" - :placeholder="$t('dataManage.layerObj.prompt6')" - ></el-input> - </el-form-item> + <!-- 鑿滃崟绫诲瀷 --> <el-form-item :label="$t('dataManage.layerObj.layerType')"> <el-select - clearable - style="width: 80%;" - v-model="formInline.type" :placeholder="$t('dataManage.layerObj.prompt2')" + style="width: 60%;" + v-model="formInline.isLayer" > <el-option label="鍥惧眰缁�" - :value='1' + value='0' ></el-option> <el-option - label="鏅�氬浘灞�" - :value='2' - ></el-option> - <el-option - label="浠g悊鍥惧眰" - :value='3' + label="鍥惧眰" + value='1' ></el-option> </el-select> </el-form-item> - <!-- 鏁版嵁绫诲瀷 --> + <!-- 鏈嶅姟璧勬簮--> <el-form-item - v-show="formInline.type === 2 || formInline.type === 3 " + v-show="formInline.isLayer == 1" + :label="$t('dataManage.layerObj.serviceResources')" + > + <el-button + size="small" + class="serviceButton" + @click="setServiceChange('0')" + key="0" + :class="{serviceActive: !serviceActive }" + >{{$t('dataManage.layerObj.isfalse')}}</el-button> + <el-button + size="small" + class="serviceButton" + @click="setServiceChange('1')" + key="1" + :class="{serviceActive: serviceActive}" + >{{$t('dataManage.layerObj.istrue')}}</el-button> + + </el-form-item> + <!-- 鑿滃崟鍚嶇О --> + <el-form-item :label="$t('dataManage.layerObj.layerName')"> + <el-input + :placeholder="$t('dataManage.layerObj.prompt1')" + style="width: 60%;" + v-model="formInline.cnName" + ></el-input> + </el-form-item> + <!-- 璧勬簮绫诲埆 --> + <el-form-item + v-show="formInline.isLayer == 1" :label="$t('dataManage.layerObj.firm')" > <el-select - clearable - style="width: 80%;" - v-model="formInline.firm" - :placeholder="$t('dataManage.layerObj.prompt8')" + style="width: 60%;" + v-model="formInline.category" + :disabled="serviceActive" + :placeholder="$t('dataManage.layerObj.prompt3')" > <el-option - v-for="item in dataType" + v-for="item in serviceType" :key="item.value" :label="item.label" :value="item.value" @@ -163,16 +172,17 @@ </el-option> </el-select> </el-form-item> - <!-- 鏈嶅姟绫诲瀷 --> + <!-- 鏁版嵁绫诲瀷 --> <el-form-item - v-show="formInline.type === 2 || formInline.type === 3 " - :label="$t('dataManage.layerObj.serviceType')" + v-show="formInline.isLayer == 1" + :label="$t('dataManage.layerObj.dataType')" > <el-select - clearable - style="width: 80%;" - v-model="formInline.category" + style="width: 60%;" + v-model="formInline.data" :placeholder="$t('dataManage.layerObj.prompt3')" + :disabled="serviceActive" + @change="setFromDataTypeClick" > <el-option v-for="item in serveType" @@ -183,85 +193,86 @@ </el-option> </el-select> </el-form-item> + <!-- 鏁版嵁绫诲瀷 --> + <el-form-item + v-show="formInline.isLayer == 1" + :label="$t('dataManage.layerObj.serviceType')" + > + <el-select + style="width: 60%;" + v-model="formInline.type" + :placeholder="$t('dataManage.layerObj.prompt3')" + :disabled="serviceActive" + > + <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 - v-show="formInline.type === 2 || formInline.type === 3 " + v-show="formInline.isLayer == 1" :label="$t('dataManage.layerObj.serviceAddress')" > <el-input :placeholder="$t('dataManage.layerObj.prompt4')" - style="width: 80%;" - v-model="formInline.url" + style="width: 60%;" + v-model="formInline.serviceUrl" + :disabled="serviceActive" ></el-input> </el-form-item> - <!-- 娴嬭瘯鍦板潃 --> + <!-- 鑻辨枃鍚嶇О --> <el-form-item - v-show="formInline.type === 2 || formInline.type === 3 " - :label="$t('dataManage.layerObj.testAddress')" + v-show="formInline.isLayer == 1 && formInline.category == 2" + :label="$t('dataManage.layerObj.englishName')" > <el-input - :placeholder="$t('dataManage.layerObj.prompt9')" - style="width: 80%;" - v-model="formInline.test" + :disabled="serviceActive" + :placeholder="$t('dataManage.layerObj.prompt6')" + style="width: 60%;" + v-model="formInline.tab" ></el-input> </el-form-item> - <!-- 浠g悊鍦板潃 --> - <el-form-item - v-show="formInline.type === 2 || formInline.type === 3 " - :label="$t('dataManage.layerObj.proxyAddress')" - > - <el-input - :disabled="!formInline.proxy" - :placeholder="$t('dataManage.layerObj.prompt11')" - style="width: 80%;" - :value="formInline.proxy" - ></el-input> - </el-form-item> - <!-- 鑻辨枃琛ㄥ悕 --> - <!-- <el-form-item :label="$t('dataManage.layerObj.enTableName')"> - <el-input - :placeholder="$t('dataManage.layerObj.prompt6')" - style="width: 80%;" - v-model="insertData.enName" - ></el-input> - </el-form-item> --> - <!-- 鏄惁鏄剧ず --> <el-form-item - v-show="formInline.type === 2 || formInline.type === 3 " - :label="$t('dataManage.layerObj.status')" + v-show="formInline.isLayer == 1" + :label="$t('dataManage.layerObj.enableOrNot')" + > + + <el-radio + v-model="formInline.status" + label="0" + >{{$t('dataManage.layerObj.isStop')}}</el-radio> + <el-radio + v-model="formInline.status" + label="1" + > {{$t('dataManage.layerObj.isEnable')}}</el-radio> + </el-form-item> + <!-- 鏄惁鏄剧ず --> + <el-form-item + v-show="formInline.isLayer == 1" + :label="$t('dataManage.layerObj.displayOrNot')" > <el-radio - v-model="formInline.status" - :label="0" - > {{$t('dataManage.layerObj.isStop')}}</el-radio> + v-model="formInline.isShow" + label="0" + >{{$t('dataManage.layerObj.isfalse')}}</el-radio> <el-radio - v-model="formInline.status" - :label="1" - >{{$t('dataManage.layerObj.isEnable')}}</el-radio> - <el-radio - v-model="formInline.status" - :label="-1" - >{{$t('dataManage.layerObj.isDisuse')}}</el-radio> + v-model="formInline.isShow" + label="1" + > {{$t('dataManage.layerObj.istrue')}}</el-radio> </el-form-item> - <!-- 鏄惁涓洪」鐩暟鎹� --> - <!-- <el-form-item :label="$t('dataManage.layerObj.isItProjectData')"> - <el-radio - v-model="insertData.isProject" - label="0" - > {{$t('dataManage.layerObj.isfalse')}}</el-radio> - <el-radio - v-model="insertData.isProject" - label="1" - >{{$t('dataManage.layerObj.istrue')}}</el-radio> - </el-form-item> --> <!-- 鎻忚堪 --> - <el-form-item :label="$t('dataManage.layerObj.descr')"> + <el-form-item :label="$t('common.bak')"> <el-input - :placeholder="$t('dataManage.layerObj.prompt10')" - style="width: 80%;" - v-model="formInline.descr" - type="textarea" + style="width: 60%;" + v-model="formInline.bak" + :placeholder="$t('dataManage.layerObj.prompt7')" ></el-input> </el-form-item> <el-form-item v-show="menuStatus.update"> @@ -286,62 +297,86 @@ width="50%" > <div style="width: 100%;max-height: 63vh;overflow-y: auto; "> + <!-- <el-form + :model="insertData" + class="demo-form-inline" + label-width="150px" + > --> <el-form :model="insertData" class="demo-form-inline" label-width="150px" > - <!-- 鑿滃崟鍚嶇О --> - <el-form-item :label="$t('dataManage.layerObj.layerName')"> - <el-input - style="width: 80%;" - v-model="insertData.cnName" - :placeholder="$t('dataManage.layerObj.prompt1')" - ></el-input> - </el-form-item> - <!-- 鑻辨枃鍚嶇О --> - <el-form-item :label="$t('dataManage.layerObj.englishName')"> - <el-input - style="width: 80%;" - v-model="insertData.enName" - :placeholder="$t('dataManage.layerObj.prompt6')" - ></el-input> - </el-form-item> <!-- 鑿滃崟绫诲瀷 --> <el-form-item :label="$t('dataManage.layerObj.layerType')"> <el-select - clearable - style="width: 80%;" - v-model="insertData.type" :placeholder="$t('dataManage.layerObj.prompt2')" + style="width: 60%;" + v-model="insertData.isLayer" > <el-option label="鍥惧眰缁�" - :value='1' + value='0' ></el-option> <el-option - label="鏅�氬浘灞�" - :value='2' - ></el-option> - <el-option - label="浠g悊鍥惧眰" - :value='3' + label="鍥惧眰" + value='1' ></el-option> </el-select> </el-form-item> - <!-- 鏁版嵁绫诲瀷 --> <el-form-item - v-show="insertData.type === 2 || insertData.type === 3" + v-show="insertData.isLayer == 1" + :label="$t('dataManage.layerObj.serviceResources')" + > + <!-- <el-button + size="small" + class="serviceButton" + @click="setServiceChange('0')" + :class="{serviceActive: insertData.service === '0'}" + >{{$t('dataManage.layerObj.isfalse')}}</el-button> + <el-button + size="small" + class="serviceButton" + @click="setServiceChange('1')" + :class="{serviceActive: insertData.service === '1'}" + >{{$t('dataManage.layerObj.istrue')}}</el-button> --> + <el-button + size="small" + class="serviceButton" + @click="setInsertServiceChange('0')" + key="0" + :class="{serviceActive: !insertServiceActive }" + >{{$t('dataManage.layerObj.isfalse')}}</el-button> + <el-button + size="small" + class="serviceButton" + @click="setInsertServiceChange('1')" + key="1" + :class="{serviceActive: insertServiceActive}" + >{{$t('dataManage.layerObj.istrue')}}</el-button> + + </el-form-item> + <!-- 鑿滃崟鍚嶇О --> + <el-form-item :label="$t('dataManage.layerObj.layerName')"> + <el-input + :placeholder="$t('dataManage.layerObj.prompt1')" + style="width: 60%;" + v-model="insertData.cnName" + ></el-input> + </el-form-item> + <!-- 璧勬簮绫诲埆 --> + <el-form-item + v-show="insertData.isLayer == 1" :label="$t('dataManage.layerObj.firm')" > <el-select - clearable - style="width: 80%;" - v-model="insertData.firm" - :placeholder="$t('dataManage.layerObj.prompt8')" + style="width: 60%;" + v-model="insertData.category" + :disabled="insertServiceActive" + :placeholder="$t('dataManage.layerObj.prompt3')" > <el-option - v-for="item in dataType" + v-for="item in serviceType" :key="item.value" :label="item.label" :value="item.value" @@ -349,16 +384,17 @@ </el-option> </el-select> </el-form-item> - <!-- 鏈嶅姟绫诲瀷 --> + <!-- 鏁版嵁绫诲瀷 --> <el-form-item - v-show="insertData.type === 2 || insertData.type === 3" - :label="$t('dataManage.layerObj.serviceType')" + v-show="insertData.isLayer == 1" + :label="$t('dataManage.layerObj.dataType')" > <el-select - clearable - style="width: 80%;" - v-model="insertData.category" + style="width: 60%;" + v-model="insertData.data" :placeholder="$t('dataManage.layerObj.prompt3')" + :disabled="insertServiceActive" + @change="setInsertDataTypeClick" > <el-option v-for="item in serveType" @@ -369,105 +405,206 @@ </el-option> </el-select> </el-form-item> + <!-- 鏈嶅姟绫荤被鍨� --> + <el-form-item + v-show="insertData.isLayer == 1" + :label="$t('dataManage.layerObj.serviceType')" + > + <el-select + :disabled="insertServiceActive" + style="width: 60%;" + v-model="insertData.type" + :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 - v-show="insertData.type === 2 || insertData.type === 3" + v-show="insertData.isLayer == 1" :label="$t('dataManage.layerObj.serviceAddress')" > <el-input + :disabled="insertServiceActive" :placeholder="$t('dataManage.layerObj.prompt4')" - style="width: 80%;" - v-model="insertData.url" + style="width: 60%;" + v-model="insertData.serviceUrl" ></el-input> </el-form-item> + <!-- 鑻辨枃鍚嶇О --> <el-form-item - v-show="insertData.type === 2 || insertData.type === 3" - :label="$t('dataManage.layerObj.testAddress')" + v-show="insertData.isLayer == 1 && insertData.category == 2" + :label="$t('dataManage.layerObj.englishName')" > <el-input - :placeholder="$t('dataManage.layerObj.prompt9')" - style="width: 80%;" - v-model="insertData.test" + :disabled="insertServiceActive" + :placeholder="$t('dataManage.layerObj.prompt6')" + style="width: 60%;" + v-model="insertData.tab" ></el-input> </el-form-item> - <!-- 鑻辨枃琛ㄥ悕 --> - <!-- <el-form-item :label="$t('dataManage.layerObj.enTableName')"> - <el-input - :placeholder="$t('dataManage.layerObj.prompt6')" - style="width: 80%;" - v-model="insertData.enName" - ></el-input> - </el-form-item> --> - + <!-- 鏄惁鍚敤 --> + <el-form-item + v-show="insertData.isLayer == 1" + :label="$t('dataManage.layerObj.enableOrNot')" + > + <el-radio + v-model="insertData.status" + label="0" + >{{$t('dataManage.layerObj.isStop')}}</el-radio> + <el-radio + v-model="insertData.status" + label="1" + > {{$t('dataManage.layerObj.isEnable')}}</el-radio> + </el-form-item> <!-- 鏄惁鏄剧ず --> <el-form-item - v-show="insertData.type === 2 || insertData.type === 3" - :label="$t('dataManage.layerObj.status')" + v-show="insertData.isLayer == 1" + :label="$t('dataManage.layerObj.displayOrNot')" > <el-radio - v-model="insertData.status" - :label="0" - > {{$t('dataManage.layerObj.isStop')}}</el-radio> - <el-radio - v-model="insertData.status" - :label="1" - >{{$t('dataManage.layerObj.isEnable')}}</el-radio> - <el-radio - v-model="insertData.status" - :label="-1" - >{{$t('dataManage.layerObj.isDisuse')}}</el-radio> - </el-form-item> - <!-- 鏄惁涓洪」鐩暟鎹� --> - <!-- <el-form-item :label="$t('dataManage.layerObj.isItProjectData')"> - <el-radio - v-model="insertData.isProject" + v-model="insertData.isShow" label="0" - > {{$t('dataManage.layerObj.isfalse')}}</el-radio> + >{{$t('dataManage.layerObj.isfalse')}}</el-radio> <el-radio - v-model="insertData.isProject" + v-model="insertData.isShow" label="1" - >{{$t('dataManage.layerObj.istrue')}}</el-radio> - </el-form-item> --> + > {{$t('dataManage.layerObj.istrue')}}</el-radio> + </el-form-item> <!-- 鎻忚堪 --> - <el-form-item :label="$t('dataManage.layerObj.descr')"> + <el-form-item :label="$t('common.bak')"> <el-input - :placeholder="$t('dataManage.layerObj.prompt10')" - style="width: 80%;" - v-model="insertData.descr" - type="textarea" + style="width: 60%;" + v-model="insertData.bak" + :placeholder="$t('dataManage.layerObj.prompt7')" ></el-input> </el-form-item> <el-form-item v-show="menuStatus.update"> <el-button type="primary" size="small" - @click="submitForm( )" + @click="submitForm()" >{{$t('common.confirm')}}</el-button> <el-button type="info" size="small" - @click="cannelForm( )" + @click="submitCancel()" >{{$t('common.cancel')}}</el-button> </el-form-item> </el-form> </div> </el-dialog> + <el-dialog + :visible.sync="dialogService" + width="50%" + :show-close="false" + > + <div style="width: 100%;max-height: 63vh;overflow-y: auto; "> + <div style=" display: flex; justify-content: space-between;"> + <div> <el-input + size="small" + v-model="listData.name" + > <i + slot="suffix" + class="el-input__icon el-icon-search" + @click="setServiceQuery" + ></i></el-input></div> + <div> + <el-button + type="info" + size="small" + @click="setServiceRest" + >{{$t('common.reset')}}</el-button> + + <el-button + type="primary" + size="small" + @click="setServiceConfirm" + >{{$t('common.confirm')}}</el-button> + <el-button + type="info" + size="small" + @click="setServiceCanel" + >{{$t('common.cancel')}}</el-button> + + </div> + </div> + <el-table + ref="multipleTable" + :data="tableData" + @select="selectChange" + > + <el-table-column + type="selection" + width="55" + > + </el-table-column> + <el-table-column + align="center" + type="index" + :label="$t('common.index')" + width="70px" + /> + <el-table-column + align="center" + prop="cnName" + :label="$t('dataManage.layerObj.resourceName')" + /> + + <el-table-column + align="center" + prop="category" + :label="$t('dataManage.layerObj.serviceType')" + :formatter="setResCategory" + /> + <el-table-column + align="center" + prop="type" + :label="$t('dataManage.layerObj.dataType')" + :formatter="setResType" + /> + </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> + </el-dialog> </div> </template> -<script> + <script> import MyBread from "../../components/MyBread.vue"; import { getPerms, - res_selectAll, - res_insert, - res_delete, - res_updates, - res_update, + layer_selectAll, + layer_update, + layer_updates, + layer_insert, + layer_delete, + res_selectByPageAndCount, } from "../../api/api"; import $ from 'jquery' import { getToken } from '../../utils/auth'; -import { serve_type, data_type } from './js/layerManage.js' +import { serve_type, data_type, category_type } from './js/layerManage.js' import { json } from "body-parser"; export default { @@ -476,19 +613,23 @@ MyBread, }, data() { - return { filterText: null, formInline: { cnName: null, type: null, serveType: null, - serveType: null, url: null, dataType: null, bak: null, isShow: '0', - isProject: '0' + isProject: '0', + enName: '', + isLayer: null, + category: null, + status: null, + service: '0', + serviceUrl: null }, serveType: null, dataType: null, @@ -506,11 +647,26 @@ checkData: null, backUpData: null, dialogVisible: false, - insertData: {}, + insertData: { + type: null, + data: null, + }, currentData: null, newNode: null, newData: [], oriData: [], + dialogService: false, + listData: { + pageIndex: 1, + pageSize: 10, + count: 0, + name: '' + }, + tableData: [], + multipleSelection: [], + serviceActive: true, + insertServiceActive: false, + serviceType: null }; }, watch: { @@ -519,6 +675,193 @@ }, }, methods: { + setFromDataTypeClick(res) { + this.setInsertDataTypeChange(res) + this.formInline.type = this.dataType[0].value + }, + setInsertDataTypeClick(res) { + this.setInsertDataTypeChange(res) + this.insertData.type = this.dataType[0].value + }, + setInsertDataTypeChange(res) { + var filter = this.serveType.filter(rs => { + if (rs.value == res) { + return rs + } + }) + if (filter.length <= 0) return + var std = []; + var data = filter[0].children; + for (var i in data) { + for (var j in serve_type) { + if (serve_type[j].value == data[i]) { + std.push({ + value: serve_type[j].value, + label: serve_type[j].name, + }) + } + } + } + this.dataType = std + }, + setServiceConfirm() { + if (this.multipleSelection.length <= 0) { + return this.$message("鏈�夋嫨璧勬簮鏁版嵁"); + } + var url, serviceUrl; + if (this.multipleSelection.status == 1) { + serviceUrl = this.multipleSelection.url; + url = this.multipleSelection.url; + } else if (this.multipleSelection.status == 2) { + var token = getToken() + if (this.multipleSelection.proxy && this.multipleSelection.proxy.indexOf('{token}') > -1) { + serviceUrl = BASE_URL + this.multipleSelection.proxy.replaceAll('{token}', token); + } else { + serviceUrl = this.multipleSelection.url + } + + url = this.multipleSelection.proxy; + } + if (this.dialogVisible) { + this.setInsertDataTypeChange(this.multipleSelection.data); + this.insertData.cnName = this.multipleSelection.cnName; + this.insertData.enName = this.multipleSelection.enName; + this.insertData.type = this.multipleSelection.type; + this.insertData.resid = this.multipleSelection.id + this.insertData.serviceUrl = serviceUrl; + this.insertData.url = url; + this.insertData.data = this.multipleSelection.data; + this.insertData.tab = this.multipleSelection.tab; + this.insertData.category = this.multipleSelection.category; + this.insertServiceActive = true + } else { + this.formInline.cnName = this.multipleSelection.cnName; + this.formInline.enName = this.multipleSelection.enName; + this.formInline.type = this.multipleSelection.type; + this.formInline.resid = this.multipleSelection.id + this.formInline.serviceUrl = serviceUrl; + this.formInline.data = this.multipleSelection.data; + this.formInline.tab = this.multipleSelection.tab; + this.formInline.category = this.multipleSelection.category; + this.formInline.url = url; + this.serviceActive = true + // this.formInline.status = '1'; + + } + this.dialogService = false + }, + + + setServiceRest() { + this.listData = { + pageIndex: 1, + pageSize: 10, + count: 0, + name: '' + } + this.getServiceData(); + }, + setServiceQuery() { + this.listData.pageIndex = 1; + this.listData.pageSize = 10; + this.listData.count = 0; + this.getServiceData(); + }, + setServiceCanel() { + this.dialogService = false; + this.multipleSelection = []; + this.tableData == []; + this.listData = { + pageIndex: 1, + pageSize: 10, + count: 0, + name: '' + } + }, + selectChange(selection, row) { + this.multipleSelection = row + if (selection.length > 1) { + let del_row = selection.shift() + this.$refs.multipleTable.toggleRowSelection(del_row, false) + } + }, + 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; + } + }, + setResCategory(row, column) { + switch (row.category) { + case 0: + return "鍏朵粬" + break; + case 1: + return "GisServer" + break; + case 2: + return "GeoServer" + break; + case 3: + return "鏁扮畝" + break; + default: + return "" + break; + } + }, + handleSizeChange(val) { + this.listData.pageSize = val; + this.getServiceData(); + }, + handleCurrentChange(val) { + this.listData.pageIndex = val; + this.getServiceData(); + }, + setServiceChange(res) { + if (res == '1') { + this.setServiceRest() + } else { + this.serviceActive = false + this.formInline.resid = 0 + } + }, + setInsertServiceChange(res) { + if (res == '1') { + this.setServiceRest() + } else { + this.insertServiceActive = false + this.insertData.resid = 0 + } + }, + async getServiceData() { + const data = await res_selectByPageAndCount(this.listData); + if (data.code != 200) { + return this.$message.error("璧勬簮鏁版嵁鑾峰彇澶辫触"); + } + this.tableData = data.result; + this.listData.count = data.count; + this.dialogService = true + }, //鍚戜笂鍚戜笅绉诲姩 setEditNode(res) { let node = this.$refs.tree.getCurrentNode(); @@ -547,18 +890,11 @@ arr.push(res); } }); - var token = getToken(); - if (arr[1].proxy && arr[1].proxy.indexOf(token) > -1) { - arr[1].proxy.replace(token, "{token}") - } - if (arr[0].proxy && arr[0].proxy.indexOf(token) > -1) { - arr[0].proxy.replace(token, "{token}") - } + const orderNum = arr[1].orderNum + arr[1].orderNum = arr[0].orderNum + arr[0].orderNum = orderNum - const orderNum = arr[1].sort - arr[1].sort = arr[0].sort - arr[0].sort = orderNum this.newData = arr; this.sendChange(); } else { @@ -585,18 +921,9 @@ arr.push(res); } }); - var token = getToken(); - if (arr[1].proxy && arr[1].proxy.indexOf(token) > -1) { - arr[1].proxy.replace(token, "{token}") - } - - if (arr[0].proxy && arr[0].proxy.indexOf(token) > -1) { - arr[0].proxy.replace(token, "{token}") - } - - const orderNum = arr[1].sort - arr[1].sort = arr[0].sort - arr[0].sort = orderNum + const orderNum = arr[1].orderNum + arr[1].orderNum = arr[0].orderNum + arr[0].orderNum = orderNum this.newData = arr; this.sendChange(); } else { @@ -609,7 +936,7 @@ } }, async sendChange() { - const data = await res_updates(this.newData) + const data = await layer_updates(this.newData) if (data.code != 200) { return this.$message.error("绉诲姩澶辫触"); } @@ -617,7 +944,7 @@ }, async setDeleteNode() { - const data = await res_delete({ id: this.formInline.id }); + const data = await layer_delete({ id: this.formInline.id }); if (data.code != 200) { return this.$message.error("鍒犻櫎澶辫触"); } @@ -635,11 +962,21 @@ this.getLayerTree(); }, + submitCancel() { + this.dialogVisible = false; + this.insertStart(); + }, async submitForm() { - var val = this.insertData; - val.isShow = parseInt(val.isShow); - val.isProject = parseInt(val.isProject); - const data = await res_insert(val); + var val = JSON.parse(JSON.stringify(this.insertData)); + val.status = parseInt(val.status); + var token = getToken(); + if (val.serviceUrl && val.serviceUrl.indexOf(BASE_URL) > -1) { + val.serviceUrl = val.serviceUrl.replaceAll(BASE_URL, ''); + val.serviceUrl = val.serviceUrl.replaceAll(token, '{token}') + } + val.isShow = parseInt(val.isShow) + val.url = val.serviceUrl + const data = await layer_insert(val); if (data.code != 200) { return this.$message.error("鏂板澶辫触"); } @@ -657,11 +994,17 @@ this.newNode = node; var id, lever, orderNum; if (res == 1) { - //鏂板鍚岀骇 - id = this.formInline.pid; - let pchildNodes = this.$refs.tree.getNode(this.newNode.id).parent.childNodes - orderNum = this.getMaxOrderNum(pchildNodes); - lever = this.formInline.level; + if (this.formInline.pid) { + id = this.formInline.pid; + let pchildNodes = this.$refs.tree.getNode(this.newNode.id).parent.childNodes + orderNum = this.getMaxOrderNum(pchildNodes); + lever = this.formInline.level; + } else { + let pchildNodes = this.$refs.tree.getNode(this.newNode.id).parent.childNodes + orderNum = this.getMaxOrderNum(pchildNodes); + lever = this.formInline.level; + id = this.formInline.pid; + } } else if (res == 2) { //鏂板瀛愮骇 id = this.formInline.id; @@ -671,36 +1014,55 @@ } this.insertData.pid = id; this.insertData.level = lever; - this.insertData.sort = orderNum; + this.insertData.orderNum = orderNum; + this.dialogVisible = true; - }, - cannelForm() { - this.dialogVisible = false; - this.insertData = {} }, getMaxOrderNum(res) { var val = 1; for (var i in res) { - if (res[i].data.sort > val) { - val = res[i].data.sort; + if (res[i].data.orderNum > val) { + val = res[i].data.orderNum; } } val = val + 1; return val; }, insertStart() { + var data = this.serveType[0].value; + this.setInsertDataTypeChange(this.serveType[0].value) + var type = this.dataType[0].value + var category = this.serviceType[0].value this.insertData = { - + cnName: null, + type: null, + serveType: null, + url: null, + dataType: null, + bak: null, + isShow: '0', + isProject: '0', + enName: '', + isLayer: null, + category: category, + status: null, + service: '0', + status: '1', + type: type, + data: data, } }, //淇敼鏁版嵁 async updateSend() { var val = JSON.parse(JSON.stringify(this.formInline)); - var token = getToken() - if (val.proxy && val.proxy.indexOf(token) > -1) { - val.proxy = val.proxy.replace(token, "{token}"); + var token = getToken(); + if (val.serviceUrl && val.serviceUrl.indexOf(BASE_URL) > -1) { + val.serviceUrl = val.serviceUrl.replaceAll(BASE_URL, ''); + val.serviceUrl = val.serviceUrl.replaceAll(token, '{token}') } - const data = await res_update(val); + val.isShow = parseInt(val.isShow) + val.url = val.serviceUrl + const data = await layer_update(val); this.currentData = JSON.stringify(this.formInline) if (data.code != 200) { return this.$message.error("淇敼澶辫触"); @@ -714,18 +1076,15 @@ //淇敼閲嶇疆 updateRest() { var res = JSON.parse(this.backUpData); - var token = getToken() - if (res.proxy && res.proxy.indexOf('{token}') > -1) { - res.proxy = res.proxy.replace("{token}", token); - } this.formInline = res; - // this.formInline.type = res.type.toString(); - // this.formInline.isShow = res.isShow.toString(); + this.formInline.isLayer = res.isLayer.toString(); + + this.formInline.status = res.status.toString(); // this.formInline.isProject = res.isProject.toString(); }, //鑾峰彇鍥惧眰鍒楄〃 async getLayerTree() { - const data = await res_selectAll(); + const data = await layer_selectAll({ flag: 0 }); if (data.code != 200) { return this.$message.error("鍥惧眰鍒楄〃鏌ヨ澶辫触"); } @@ -733,8 +1092,9 @@ this.newData = data.result; var val = this.setTreeData(data.result); val.sort(function (a, b) { - return a.sort - b.sort + return a.orderNum - b.orderNum }) + this.treeData = val; var cdata; if (this.currentData) { @@ -749,22 +1109,40 @@ }); }, layerFormInline(res) { - var token = getToken(); + var val = JSON.parse(JSON.stringify(res)) + var data = this.$refs.tree.getNode(val.id).data; var result = JSON.parse(JSON.stringify(data)) this.backUpData = JSON.stringify(result) this.currentData = JSON.stringify(result) this.formInline = result; + this.formInline.isLayer = res.isLayer.toString(); + this.formInline.status = result.status.toString(); - if (result.proxy && result.proxy.indexOf('{token}') > -1) { - this.formInline.proxy = result.proxy.replace("{token}", token); + this.formInline.isShow = res.isShow.toString(); + + + if (res.resid && res.resid > 0) { + this.serviceActive = true } else { - this.formInline.proxy = result.proxy + this.serviceActive = false } - // this.formInline.type = result.type.toString(); - // this.formInline.isShow = result.isShow.toString(); + var url; + if (!this.serviceActive) { + url = result.url; + } else if (this.serviceActive) { + var token = getToken() + if (result.url.indexOf('{token}') > -1) { + url = BASE_URL + result.url.replaceAll('{token}', token); + } else { + url = result.url; + } + + } + this.formInline.serviceUrl = url; + this.setInsertDataTypeChange(this.formInline.data) // this.formInline.isProject = result.isProject.toString(); }, //鍥惧眰鍒楄〃鐐瑰嚮浜嬩欢 @@ -780,10 +1158,9 @@ branchArr.sort(function (a, b) { - return a.sort - b.sort + return a.orderNum - b.orderNum }) } - branchArr.length > 0 ? (father.children = branchArr) : ""; // 缁欑埗绾ф坊鍔犱竴涓猚hildren灞炴�э紝骞惰祴鍊� // 灞炰簬鍚屼竴瀵硅薄闂锛屼緥濡傦細浠� a=b銆乧=1 锛岀劧鍚庡啀浠� b.c=c 锛� 閭d箞 a.c=b.c=c=1 锛涘悓鐞嗭紝鍚庣画浠� c.d=2 ,閭d箞 a.c.d 涔熸槸=2锛� // 鐢辨寰幆澶氭鍚庯紝灏辫兘褰㈡垚鐩稿簲鐨勬爲褰㈡暟鎹粨鏋� @@ -799,20 +1176,32 @@ optionsStart() { var std = []; var ste = []; + var str = []; for (var i in serve_type) { - std.push({ + ste.push({ value: serve_type[i].value, label: serve_type[i].name, }) } this.serveType = std; for (var i in data_type) { - ste.push({ + std.push({ value: data_type[i].value, label: data_type[i].name, + children: data_type[i].children }) } this.dataType = ste; + + for (var i in category_type) { + str.push({ + value: category_type[i].value, + label: category_type[i].name, + }) + } + this.serviceType = str; + + }, //鏁版嵁鍒濆鍖� formInlineStart() { @@ -820,12 +1209,15 @@ cnName: null, type: null, serveType: null, - serveType: null, url: null, dataType: null, bak: null, isShow: '0', - isProject: '0' + isProject: '0', + enName: '', + isLayer: null, + category: null, + serviceUrl: null } }, //鑾峰彇鏉冮檺 @@ -868,9 +1260,9 @@ this.getLayerTree(); }, }; -</script> - -<style lang="less" scoped> + </script> + + <style lang="less" scoped> .subpage_Box { //height: 96%; width: 98%; @@ -906,8 +1298,43 @@ } } } +.serviceButton { + background: transparent !important; + color: #dcdfe6; +} +.serviceActive { + background: transparent !important; + color: #46a6ff; + border: 1px solid #46a6ff; +} /deep/ .el-input__suffix { top: 50%; transform: translateY(-50%); } +/deep/.el-radio { + color: white; +} </style> + <style> +.el-select-dropdown { + background: #303030 !important; + + border: 1px solid gray; +} + +.el-select-dropdown__item { + background-color: transparent !important; + color: #fff; +} + +.el-select-dropdown__item.hover, +.el-select-dropdown__item:hover { + color: #ffff !important; + background: rgba(7, 8, 14, 0.3) !important; +} + +.el-popper .popper__arrow, +.el-popper .popper__arrow::after { + display: none !important; +} +</style> \ No newline at end of file -- Gitblit v1.9.3