gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: console的url处理|assetbox保存时vendor闪动等

Browse Source 
1.console的url处理
2.assetbox保存时vendor闪动的问题修复
3.优化侧滑动画
This commit is contained in:
chenjinsong
2020-05-22 15:21:41 +08:00
parent 9892cce975
commit a3ca1f9723
8 changed files with 112 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
nezha-fronted/config/index.js
View File

@@ -48,7 +48,7 @@ module.exports = {
// Paths // Paths
assetsRoot: path.resolve(__dirname, '../dist'), assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static', assetsSubDirectory: 'nezha',
assetsPublicPath: '/', assetsPublicPath: '/',
/** /**

2
nezha-fronted/index.html
View File

@@ -4,7 +4,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="/static/logo14_14.png" type="image/x-icon"/> <link rel="icon" href="./nezha/logo14_14.png" type="image/x-icon"/>
<title>Nezha</title> <title>Nezha</title>
<style> <style>

24
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -816,12 +816,28 @@ li{
to {right: -870px} to {right: -870px}
} }
@keyframes slide-in-from-right { @keyframes slide-in-from-right {
from {right: -550px} /*from {right: -550px}
to {right: 0px} to {right: 0px}*/
from {
transform: scaleX(0);
transform-origin: right;
}
to {
transform: scaleX(1);
transform-origin: right;
}
} }
@keyframes slide-out-to-right { @keyframes slide-out-to-right {
from {right: 0px} /*from {right: 0px}
to {right: -550px} to {right: -550px}*/
from {
transform: scaleX(1);
transform-origin: right;
}
to {
transform: scaleX(0);
transform-origin: right;
}
} }
.right-box-enter-active { .right-box-enter-active {
animation: slide-in-from-right 0.4s; animation: slide-in-from-right 0.4s;

8
nezha-fronted/src/components/cli/console.vue
View File

@@ -190,9 +190,13 @@ export default {
this.term.open(terminalContainer); this.term.open(terminalContainer);
this.term.focus(); this.term.focus();
let token = sessionStorage.getItem('nz-token'); let token = sessionStorage.getItem('nz-token');
let baseUrl = this.$axios.defaults.baseURL.replace('http','ws'); let baseUrl = this.$axios.defaults.baseURL;
if (baseUrl.startsWith("/")) {
baseUrl = "ws://" + window.location.host + ":" + window.location.port + baseUrl;
} else {
baseUrl = baseUrl.replace("http://", "ws://").replace("https://", "ws://");
}
let url = baseUrl+"/terminal.ws?width="+this.terminal.width+"&height="+this.terminal.height+"&cols="+this.terminal.cols+"&rows="+this.terminal.rows+"&token="+token+"&assetId="+this.terminal.assetId+"&accountId="+this.terminal.accountId+"&uuid="+this.terminal.uuid; let url = baseUrl+"/terminal.ws?width="+this.terminal.width+"&height="+this.terminal.height+"&cols="+this.terminal.cols+"&rows="+this.terminal.rows+"&token="+token+"&assetId="+this.terminal.assetId+"&accountId="+this.terminal.accountId+"&uuid="+this.terminal.uuid;
this.terminalSocket = new WebSocket(url); this.terminalSocket = new WebSocket(url);
//连接成功 //连接成功
this.terminalSocket.onopen = () =>{ this.terminalSocket.onopen = () =>{

2
nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<transition name="right-box-840"> <transition name="right-box">
<div class="right-box right-box-add-endpoint" :class="{'right-box-add-endpoint-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-if="rightBox.show" @mousedown="showEditParamBox(false)" v-clickoutside="clickos"> <div class="right-box right-box-add-endpoint" :class="{'right-box-add-endpoint-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-if="rightBox.show" @mousedown="showEditParamBox(false)" v-clickoutside="clickos">
<!-- begin--顶部按钮--> <!-- begin--顶部按钮-->
<div class="right-box-top-btns"> <div class="right-box-top-btns">

93
nezha-fronted/src/components/common/rightBox/assetBox.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<transition name="right-box-580"> <transition name="right-box">
<div class="right-box right-box-add-asset" v-if="editUnitShow" @click="editQuit" id="asset-edit-quit" v-clickoutside="clickos"> <div class="right-box right-box-add-asset" v-if="editUnitShow" @click="editQuit" id="asset-edit-quit" v-clickoutside="clickos">
<!--顶部按钮--> <!--顶部按钮-->
<div class="right-box-top-btns"> <div class="right-box-top-btns">
@@ -142,7 +142,7 @@
<div class="line-100 right-box-line"></div> <div class="line-100 right-box-line"></div>
<!------------------------------------------IDC----------------------------------------------> <!------------------------------------------IDC---------------------------------------------->
<el-form-item :label="$t('asset.createAssetTab.location')" prop="locationInfo" :rules="[{validator:locationValidator,trigger:'blur'}]"> <el-form-item :label="$t('asset.createAssetTab.location')" prop="locationInfo" :rules="[{validator:locationValidator,trigger:'blur'}]">
<location-cascader :disabled="assetData.modelId !=''?false:true" :default-model-u-size="modelSize" @change="setLocationData" :init-data="initLocationData" ref="locationCascader"></location-cascader> <location-cascader :disabled="assetData.modelId !=''?false:true" :default-model-u-size="modelSize" @change="setLocationData" :init-data="initLocationData" ref="locationCascader" :idc-option="IDCOptionData"></location-cascader>
</el-form-item> </el-form-item>
<!--<el-form-item :label="$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId"> <!--<el-form-item :label="$t('asset.createAssetTab.dcName')" class="right-box-form-content" prop="idcId">
<template v-if="!tabView"> <template v-if="!tabView">
@@ -243,7 +243,7 @@
</button> </button>
</div> </div>
<module-box :module="module" @reload="refreshTabData" ref="moduleBox"></module-box> <module-box :module="module" @reload="refreshTabData" ref="moduleBox"></module-box>
<model-box ref="modelBox" :model="model" @reload="getAllModelOptionData"></model-box> <model-box v-if="firstShowModel" ref="modelBox" :model="model" @reload="getAllModelOptionData"></model-box>
</div> </div>
</transition> </transition>
</template> </template>
@@ -262,6 +262,7 @@
}, },
data() { data() {
return { return {
firstShowModel: false,
visible: '', visible: '',
vendorModelData: '', vendorModelData: '',
assetData: { assetData: {
@@ -484,7 +485,7 @@
if (newVal) { if (newVal) {
this.getConnectData(); this.getConnectData();
if (this.pageObj.id != '') { if (this.pageObj.id != '') {
this.assetData.modelId = [this.obj.model.vendor.code, this.obj.model.id] this.assetData.modelId = [this.obj.model.vendor.code, this.obj.model.id];
} }
} }
} }
@@ -598,7 +599,53 @@
this.modelSize=model.usize; this.modelSize=model.usize;
}, },
getAssetData(data) { getAssetData(data) {
if (data) { this.$nextTick(() => {
if (data) {
this.pageObj.id = data.id;
this.obj = JSON.parse(JSON.stringify(data));
this.assetViewData.assetType = this.obj.model.type.value
this.assetViewData.vendor = this.obj.model.vendor.value
this.assetViewData.model = this.obj.model.name
this.modelSize=this.obj.model.usize;
this.assetViewData.idcName = this.obj.idc.name
this.assetViewData.cabinetName = this.obj.cabinet == null ? '' : this.obj.cabinet.name
let initLocationData={
idc:this.obj.idc,
cabinet:this.obj.cabinet,
u:[this.obj.cabinetStart,this.obj.cabinetEnd]
}
this.$refs.locationCascader.initComponet(initLocationData)
this.assetViewData.moduleNum = this.obj.moduleNum
this.assetViewData.alertNum = this.obj.alertNum
this.assetViewData.cabinetName = this.obj.cabinet == null ? '' : this.obj.cabinet.name
this.getCabinetOptionData(this.obj.idc.id)
this.assetType = this.obj.model.type.code
this.assetData.impi=this.obj.impi?this.obj.impi:{host:'',port:''};
this.assetData.sn = this.obj.sn
this.assetData.host = this.obj.host
this.assetData.state = this.obj.state
this.assetData.idcId = this.obj.idc.id
this.assetData.cabinetId = this.obj.cabinet == null ? '' : this.obj.cabinet.id
this.assetData.purchaseDate = this.obj.purchaseDate;
// this.assetData.accounts[0].id = this.obj.accounts[0].id
// this.assetData.accounts[0].authType = this.obj.accounts[0].authType
// this.assetData.accounts[0].user = this.obj.accounts[0].user
// this.assetData.accounts[0].pwd = this.obj.accounts[0].pwd
// this.assetData.accounts[0].port = this.obj.accounts[0].port
// this.assetData.accounts[0].cert = this.obj.accounts[0].privateKey
this.assetData.accounts=this.obj.accounts[0]?this.obj.accounts:[];
this.accountSwitch=this.assetData.accounts.length>0;
this.idcSelectedData.location = this.obj.idc.location
this.idcSelectedData.principal = this.obj.idc.principal
this.idcSelectedData.tel = this.obj.idc.tel
this.cabinetSelectedData.uSize = this.obj.cabinet == null ? '' : this.obj.cabinet.uSize
this.cabinetSelectedData.remark = this.obj.cabinet == null ? '' : this.obj.cabinet.remark
this.getAllModelOptionData(this.assetType);
} else {
this.resetAsset();
}
});
/*if (data) {
this.pageObj.id = data; this.pageObj.id = data;
this.$get('asset', this.pageObj).then(response => { this.$get('asset', this.pageObj).then(response => {
if (response.code === 200) { if (response.code === 200) {
@@ -645,7 +692,7 @@
}) })
} else { } else {
this.resetAsset(); this.resetAsset();
} }*/
}, },
openModuleBox(module) { openModuleBox(module) {
this.module = module; this.module = module;
@@ -664,13 +711,15 @@
} }
}); });
}, },
getIDCOptionData() { getIDCOptionData(isUpdate) {
this.$get('idc').then(response => { this.$get('idc').then(response => {
if (response.code === 200) { if (response.code === 200) {
this.IDCOptionData = response.data.list; this.IDCOptionData = response.data.list;
this.markOptionData(this.IDCOptionData); this.markOptionData(this.IDCOptionData);
this.$store.commit('assetDcListChange'); if (isUpdate) {
this.$emit('refreshData'); this.$store.commit('assetDcListChange');
this.$emit('refreshData');
}
} }
}) })
}, },
@@ -745,7 +794,11 @@
} }
} }
} }
this.$refs.modelBox.show(true, true); this.firstShowModel = true;
this.$nextTick(() => {
this.$refs.modelBox.show(true, true);
});
}, },
resetAsset() { resetAsset() {
this.pageObj.id = ''; this.pageObj.id = '';
@@ -799,11 +852,11 @@
principal: '', principal: '',
tel: '' tel: ''
}; };
let tempModelId = this.assetData.modelId;
if (data === 'asset') { if (data === 'asset') {
if (this.assetData.modelId) { /*if (this.assetData.modelId) {
this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1]; this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1];
} }*/
if(this.locationInfo){ if(this.locationInfo){
if(this.locationInfo.idc){ if(this.locationInfo.idc){
this.assetData.idcId=this.locationInfo.idc.id; this.assetData.idcId=this.locationInfo.idc.id;
@@ -847,12 +900,16 @@
if(this.$refs.accountConfigBox&&this.$refs.accountConfigBox.length>0){ if(this.$refs.accountConfigBox&&this.$refs.accountConfigBox.length>0){
this.$refs.accountConfigBox[0].validateAccount(); this.$refs.accountConfigBox[0].validateAccount();
} }
this.$refs.assetEditForm.validate((valid) => { this.$refs.assetEditForm.validate((valid) => {
if (valid&&this.accountValideResult) { if (valid&&this.accountValideResult) {
if (this.pageObj.id) { if (this.pageObj.id) {
this.assetData.id=this.pageObj.id; this.assetData.id=this.pageObj.id;
//console.log(JSON.stringify(this.assetData)); let reqData = JSON.parse(JSON.stringify(this.assetData));
this.$put('asset', this.assetData).then(res => { if (reqData.modelId) {
reqData.modelId = reqData.modelId.join(',').split(',')[1];
}
this.$put('asset', reqData).then(res => {
const h = this.$createElement; const h = this.$createElement;
if (res.code === 200) { if (res.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")}); this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
@@ -860,7 +917,7 @@
this.$emit('refreshData', 'true'); this.$emit('refreshData', 'true');
this.sendStateData('close'); this.sendStateData('close');
} else { } else {
this.assetData.modelId = tempModelId; //this.assetData.modelId = tempModelId;
this.$message.error(res.msg); this.$message.error(res.msg);
} }
}); });
@@ -967,7 +1024,7 @@
this.$put(data, item).then(res => { this.$put(data, item).then(res => {
if (res.code === 200) { if (res.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")}); this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
this.getIDCOptionData(); this.getIDCOptionData(true);
if (data === 'cabinet') { if (data === 'cabinet') {
this.getCabinetOptionData(item.idcId); this.getCabinetOptionData(item.idcId);
} }
@@ -1076,7 +1133,7 @@
if (response.code === 200) { if (response.code === 200) {
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")}); this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
this.getAssetData(); this.getAssetData();
this.getIDCOptionData(); this.getIDCOptionData(true);
this.getVendorOptionData(); this.getVendorOptionData();
this.getCabinetOptionData(this.assetData.idcId); this.getCabinetOptionData(this.assetData.idcId);
this.getAllModelOptionData(this.assetType); this.getAllModelOptionData(this.assetType);

10
nezha-fronted/src/components/common/rightBox/locationCascader.vue
View File

@@ -59,7 +59,8 @@
props:{ props:{
defaultModelUSize:{default:1}, defaultModelUSize:{default:1},
value:{default:null}, value:{default:null},
disabled:{type:Boolean} disabled:{type:Boolean},
idcOption: {type: Array}
}, },
data(){ data(){
return { return {
@@ -104,14 +105,15 @@
} }
}, },
queryIdcInfos:function(){ queryIdcInfos:function(){
this.idcInfos=[]; this.idcInfos = this.idcOption;
this.$get('idc?pageSize=-1').then(response=>{ /*this.$get('idc?pageSize=-1').then(response=>{
console.info(2)
if(response.code == 200){ if(response.code == 200){
this.idcInfos=response.data.list; this.idcInfos=response.data.list;
}else{ }else{
console.error(response.msg); console.error(response.msg);
} }
}) })*/
}, },
loadCabinetInfos:function(idc){ loadCabinetInfos:function(idc){
if(!idc){ if(!idc){

6
nezha-fronted/src/components/page/asset/asset.vue
View File

@@ -216,7 +216,7 @@
class="el-icon-view"></i> class="el-icon-view"></i>
</span> </span>
&nbsp; &nbsp;
<span :title="$t('overall.edit')" @click.stop="tagShow('showEdit',scope.row.id)" class="content-right-option" :id="'asset-edit-'+scope.row.id"><i <span :title="$t('overall.edit')" @click.stop="tagShow('showEdit',scope.row)" class="content-right-option" :id="'asset-edit-'+scope.row.id"><i
class="nz-icon nz-icon-edit"></i> class="nz-icon nz-icon-edit"></i>
</span> </span>
&nbsp; &nbsp;
@@ -972,9 +972,7 @@
}, },
created() { created() {
this.getUserData(); this.getUserData();
this.getIDCOptionData(); this.flushData();
this.getAssetTypeData();
this.getVendorData();
this.getPingData(); this.getPingData();
}, },
mounted() { mounted() {