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

fix：解决 terminal 首次建立连接刷新的问题

Browse Source
This commit is contained in:
zhangyu
2021-04-26 21:39:58 +08:00
parent 4cd2ae65bb
commit 79192a889d
2 changed files with 295 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -195,7 +195,7 @@ export default {
this.term.open(terminalContainer) this.term.open(terminalContainer)
this.term.focus() this.term.focus()
const token = sessionStorage.getItem('nz-token') const token = sessionStorage.getItem('nz-token')
let baseUrl = this.$axios.defaults.baseURL let baseUrl = JSON.parse(JSON.stringify(this.$axios.defaults.baseURL))
if (baseUrl.startsWith('/')) { if (baseUrl.startsWith('/')) {
baseUrl = 'ws://' + window.location.host + baseUrl baseUrl = 'ws://' + window.location.host + baseUrl
} else { } else {

542
nezha-fronted/src/components/cli/webSSH.vue
View File

@@ -2,253 +2,274 @@
@import './webSSH.scss'; @import './webSSH.scss';
</style> </style>
<template> <template>
<!-- <div id="shell-service" data-yunlog-scope="popup" :class="{'shell-service-max': isFullScreen,'shell-service':true}" v-show="consoleShow"> <!-- <div id="shell-service" data-yunlog-scope="popup" :class="{'shell-service-max': isFullScreen,'shell-service':true}" v-show="consoleShow">
<div class="resize-modal">
<div class="sub-list-resize-copy">一</div>
</div>
<div id="shell-split" class="shell-split shell-iconfont" @mousedown="dragEagle" v-show="!isFullScreen">一</div>-->
<div :class="{'shell-service-max': isFullScreen,'shell-service':true}" class="sub-box ani-webSHH-height" data-yunlog-scope="popup" id="shell-service" ref="webSShBox" style="height: 0;background: #000">
<div class="resize-modal"> <div class="resize-modal">
<div class="sub-list-resize-copy" style="width: 100%">一</div> <div class="sub-list-resize-copy">一</div>
</div> </div>
<div @mousedown="dragEagle" class="sub-list-resize" id="shell-split" v-show="!isFullScreen">一</div> <div id="shell-split" class="shell-split shell-iconfont" @mousedown="dragEagle" v-show="!isFullScreen">一</div>-->
<div class="sub-list-resize" v-show="isFullScreen"></div> <div :class="{'shell-service-max': isFullScreen,'shell-service':true}" class="sub-box ani-webSHH-height" data-yunlog-scope="popup" id="shell-service" ref="webSShBox" style="height: 0;background: #000">
<div class="sub-list" style='position: relative;'> <div class="resize-modal">
<!--el-drawer 打开后会对第一个未隐藏的元素聚焦 所以添加一隐藏的input 防止聚焦--> <div class="sub-list-resize-copy" style="width: 100%">一</div>
<input style='width: 0;height: 0;opacity: 0;display: inherit;' /> </div>
<el-menu @select="handleSelect" mode="horizontal" style='position: absolute;left:0px;top:0px;border-top: 1px solid #DCDFE6;'> <div @mousedown="dragEagle" class="sub-list-resize" id="shell-split" v-show="!isFullScreen">一</div>
<el-submenu index="1" popper-class="fontSizeBox" style="width:40px;"> <div class="sub-list-resize" v-show="isFullScreen"></div>
<template slot="title" ><i class="nz-icon nz-icon-728bianjiqi_zitidaxiao" style="position: absolute;left: 10px;top: 4px;"></i></template> <div class="sub-list" style='position: relative;'>
<!--<el-submenu index="1-1">--> <!--el-drawer 打开后会对第一个未隐藏的元素聚焦 所以添加一隐藏的input 防止聚焦-->
<!--<template slot="title">文字大小</template>--> <input style='width: 0;height: 0;opacity: 0;display: inherit;' />
<el-menu-item @click="changeFontSize(12)" :class="{fontSet:true,menuActive:fontSize==12, smallFont:true}" index="1-1">A</el-menu-item> <el-menu @select="handleSelect" mode="horizontal" style='position: absolute;left:0px;top:0px;border-top: 1px solid #DCDFE6;'>
<el-menu-item @click="changeFontSize(15)" :class="{fontSet:true,menuActive:fontSize==15, middleFont:true}" index="1-2">A</el-menu-item> <el-submenu index="1" popper-class="fontSizeBox" style="width:40px;">
<el-menu-item @click="changeFontSize(20)" :class="{fontSet:true,menuActive:fontSize==20, bigFont:true}" index="1-3">A</el-menu-item> <template slot="title" ><i class="nz-icon nz-icon-728bianjiqi_zitidaxiao" style="position: absolute;left: 10px;top: 4px;"></i></template>
<!--<el-menu-item class="fontSet" index="1-4">大</el-menu-item>--> <!--<el-submenu index="1-1">-->
<!--</el-submenu>--> <!--<template slot="title">文字大小</template>-->
<!--<el-submenu index="1-2" >--> <el-menu-item @click="changeFontSize(12)" :class="{fontSet:true,menuActive:fontSize==12, smallFont:true}" index="1-1">A</el-menu-item>
<!--<template slot="title">字体</template>--> <el-menu-item @click="changeFontSize(15)" :class="{fontSet:true,menuActive:fontSize==15, middleFont:true}" index="1-2">A</el-menu-item>
<!--<el-menu-item index="1-2-1">Monosapace</el-menu-item>--> <el-menu-item @click="changeFontSize(20)" :class="{fontSet:true,menuActive:fontSize==20, bigFont:true}" index="1-3">A</el-menu-item>
<!--<el-menu-item index="1-2-2">Courier New</el-menu-item>--> <!--<el-menu-item class="fontSet" index="1-4">大</el-menu-item>-->
<!--</el-submenu>--> <!--</el-submenu>-->
</el-submenu> <!--<el-submenu index="1-2" >-->
<el-submenu index="2" style="width:50px;"> <!--<template slot="title">字体</template>-->
<template slot="title" ><i class="nz-icon nz-icon-upload console-title-icon" style="position: absolute;left: 10px;top: 4px;"></i></template> <!--<el-menu-item index="1-2-1">Monosapace</el-menu-item>-->
<el-menu-item @click="showUploadBox" index="2-1"> <!--<el-menu-item index="1-2-2">Courier New</el-menu-item>-->
<div>{{$t('webshell.upload')}}</div> <!--</el-submenu>-->
</el-menu-item> </el-submenu>
<el-menu-item @click="showDownloadBox" index="2-2"> <el-submenu index="2" style="width:50px;">
<div>{{$t('webshell.download')}}</div> <template slot="title" ><i class="nz-icon nz-icon-upload console-title-icon" style="position: absolute;left: 10px;top: 4px;"></i></template>
</el-menu-item> <el-menu-item @click="showUploadBox" index="2-1">
</el-submenu> <div>{{$t('webshell.upload')}}</div>
</el-menu> </el-menu-item>
<el-menu-item @click="showDownloadBox" index="2-2">
<div>{{$t('webshell.download')}}</div>
</el-menu-item>
</el-submenu>
</el-menu>
<el-tabs :before-leave="beforeLeave" <el-tabs :before-leave="beforeLeave"
@tab-click="handleClick" @tab-click="handleClick"
@tab-remove="removeTab" @tab-remove="removeTab"
style='width:100%; margin-left:0px;border-left:solid 1px black;border-bottom: 1px solid black;margin-top: -4px' style='width:100%; margin-left:0px;border-left:solid 1px black;border-bottom: 1px solid black;margin-top: -4px'
type="border-card" type="border-card"
v-model="editableTabsValue" > v-model="editableTabsValue" >
<el-tab-pane :key="item.name" <el-tab-pane :key="item.name"
:label="item.title" :label="item.title"
:name="item.name" :name="item.name"
closable closable
v-for="(item, index) in editableTabs" v-for="(item, index) in editableTabs"
> >
<!-- tab显示的内容 1 grey,2 green, 3 red--> <!-- tab显示的内容 1 grey,2 green, 3 red-->
<span slot="label" style=""> <span slot="label" style="">
<div :class="{'active-icon grey':item.circleColor == 1,'active-icon green':item.circleColor == 2,'active-icon red':item.circleColor == 3}" <div :class="{'active-icon grey':item.circleColor == 1,'active-icon green':item.circleColor == 2,'active-icon red':item.circleColor == 3}"
style="margin-top: 0px;"></div>{{item.title}} style="margin-top: 0px;"></div>{{item.title}}
</span> </span>
<my-console :fontSize="fontSize" :idIndex="index" :isFullScreen="isFullScreen" :ref="'console'+index" :terminal="item.terminal" @closeConsole="removeTab" @refreshConsoleTitle="refreshTabTitle"></my-console> <my-console :fontSize="fontSize" :idIndex="index" :isFullScreen="isFullScreen" :ref="'console'+index" :terminal="item.terminal" @closeConsole="removeTab" @refreshConsoleTitle="refreshTabTitle"></my-console>
</el-tab-pane> </el-tab-pane>
<el-tab-pane key="add" name="addConsole" style="width: 20px"> <el-tab-pane key="add" name="addConsole" style="width: 20px">
<el-popover <el-popover
slot="label" slot="label"
placement="bottom" placement="bottom-start"
width="200" width="150"
trigger="hover" trigger="hover"
> :popper-class="'popover-webshell'"
<div> >
<div @click="assetShowChange">Asset</div> <div>
<div @click="customShow=true">Custom</div> <div class="popover-webshell-item" @click="assetShowChange"><i class="nz-icon nz-icon-menu-assets" />Select asset</div>
</div> <div class="popover-webshell-item" @click="customShow=true"><i class="nz-icon nz-icon-edit" />Custom connect</div>
<span slot="reference" style="padding:8px;font-size:20px;font-weight:bold;">+</span>
</el-popover>
</el-tab-pane>
</el-tabs>
<i @click="minScreen" class="nz-icon nz-icon-minus console-title-icon" style='right:70px;'></i>
<i @click="fullScreen" class="el-icon-full-screen console-title-icon" style='right:38px;' v-if="!isFullScreen"></i>
<i @click="exitFullScreen" class="nz-icon nz-icon-exit-full-screen console-title-icon" style='right:38px;' v-else></i>
<i @click="closeConsole" class="nz-icon nz-icon-close console-title-icon" style='right:8px;'></i>
<!--
<i style='right:103px;' @click="minScreen" class="nz-icon nz-icon-minus console-title-icon"></i>
<i style='right:70px;;' @click="fullScreen" class="el-icon-full-screen console-title-icon"></i>
<i style='right:38px;' class="el-icon-copy-document console-title-icon" ></i>
<i style='right:8px;' @click="closeConsole" class="nz-icon nz-icon-close console-title-icon"></i>
-->
<!--nz-icon-setting nz-icon nz-icon-minus el-icon-full-screen el-icon-copy-document-->
</div>
<div >
<el-dialog :modal-append-to-body='false' :show-close="true" :title="uploadBox.title" :visible.sync="uploadBox.showUpload" @close="closeDialog" class="nz-dialog" width="500px" >
<div >
<div class="upload-body">
<el-row >
<el-col :span="24">
<el-upload :auto-upload="false" :file-list="uploadFileList"
:on-change="handleChange" action=""
class="upload-demo"
drag
ref="uploadFile" >
<i class="nz-icon nz-icon-upload"></i>
<div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
<!--<button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
<span class="top-tool-btn-txt" >{{$t('webshell.fileSelect')}}</span>
</button>-->
</el-upload>
</el-col>
</el-row>
<el-row style="margin-top: 20px;">
<el-col :span="3" style="text-align:center;line-height: 24px;">
<label>{{$t('webshell.filePath')}}</label>
</el-col>
<el-col :span="21">
<el-input size="mini" v-model="uploadFile.path"></el-input>
</el-col>
</el-row>
</div> </div>
<div class="footer" slot="footer"> <span slot="reference" style="padding:8px;font-size:20px;font-weight:bold;">+</span>
<div class="el-message-box__btns" style="text-align: right;margin-top: 20px;"> </el-popover>
<button @click="upload" class="el-button el-button--default el-button--small"> </el-tab-pane>
<span>{{$t('webshell.uploadButtonTitle')}}</span> </el-tabs>
</button> <i @click="minScreen" class="nz-icon nz-icon-minus console-title-icon" style='right:70px;'></i>
<button @click="closeDialog" class="el-button el-button--default el-button--small" > <i @click="fullScreen" class="el-icon-full-screen console-title-icon" style='right:38px;' v-if="!isFullScreen"></i>
<span>{{$t('overall.cancel')}}</span> <i @click="exitFullScreen" class="nz-icon nz-icon-exit-full-screen console-title-icon" style='right:38px;' v-else></i>
</button> <i @click="closeConsole" class="nz-icon nz-icon-close console-title-icon" style='right:8px;'></i>
</div> <!--
</div> <i style='right:103px;' @click="minScreen" class="nz-icon nz-icon-minus console-title-icon"></i>
</div> <i style='right:70px;;' @click="fullScreen" class="el-icon-full-screen console-title-icon"></i>
</el-dialog> <i style='right:38px;' class="el-icon-copy-document console-title-icon" ></i>
<el-dialog :modal-append-to-body='false' :show-close="true" :title="downloadBox.title" :visible.sync="downloadBox.showDownload" @close="closeDownloadDialog" class="nz-dialog" width="500px" > <i style='right:8px;' @click="closeConsole" class="nz-icon nz-icon-close console-title-icon"></i>
<div> -->
<div class="upload-body"> <!--nz-icon-setting nz-icon nz-icon-minus el-icon-full-screen el-icon-copy-document-->
<el-row style="margin-top: 20px;">
<el-col :span="3" style="text-align:center;line-height: 24px;">
<label>{{$t('webshell.filePath')}}</label>
</el-col>
<el-col :span="21">
<el-input size="mini" v-model="downloadFile.path"></el-input>
</el-col>
</el-row>
</div>
<div class="footer" slot="footer">
<div class="el-message-box__btns" style="text-align: right;margin-top: 20px;">
<button @click="download" class="el-button el-button--default el-button--small">
<span>{{$t('webshell.downloadButtonTitle')}}</span>
</button>
<button @click="closeDownloadDialog" class="el-button el-button--default el-button--small">
<span>{{$t('overall.cancel')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="closeConfirmShow" @close="cancleConfirm" class="nz-dialog" width="500px" >
<div >
<div class="el-message-box__content">
<div class="el-message-box__container">
<div class="el-message-box__status el-icon-warning">
</div>
<div class="el-message-box__message">
<p>{{$t('webshell.closeTip')}}</p>
</div>
</div>
</div>
<div class="footer" slot="footer">
<div class="el-message-box__btns" style="text-align: unset; padding-left: 50px;">
<el-checkbox v-model="closeRemember">{{$t('webshell.remember')}}</el-checkbox>
<button @click="closeShellWindow" class="el-button el-button--default el-button--small el-button--primary float-right" type="button">
<span>{{$t('tip.yes')}}</span>
</button>
<button @click="cancleConfirm" class="el-button el-button--default el-button--small float-right" type="button">
<span>{{$t('tip.no')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="assetShow" @close="assetShow=false" class="nz-dialog" width="620px" >
<div >
<el-form label-width="120px" size="small" :model="assetContent" label-position = "top" :rules="rules" ref="assetConnect" v-loading="assetLoading" >
<el-form-item :label='$t("overall.asset")' prop="assetId" class="flex">
<v-selectpage
style="flex: 1"
:data="assetData"
:tb-columns="columns"
key-field="id"
show-field="manageIp"
search-field="manageIp"
v-model="assetContent.assetId"
size="small"
:placeholder="$t('dashboard.panel.chartForm.selectAsset')"
id="box-input-asset-id"
:result-format="resultFormat"></v-selectpage>
<button @click="connect" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new">Connect</button>
</el-form-item>
</el-form>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="customShow" @close="customShow=false" class="nz-dialog" width="620px" >
<div >
<el-form label-width="120px" size="small" :model="customConnect" label-position = "top" :rules="rulesCustom" ref="customConnect" v-loading="assetLoading" class="custom">
<el-form-item :label='$t("webshell.protocol")' prop="authProtocol">
<el-select value-key="id" popper-class="config-dropdown" v-model="customConnect.authProtocol" placeholder="" size="small" id="webshell-box-input-protocol">
<el-option v-for="item in authProtocol" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("webshell.authType")' prop="authType">
<el-select value-key="id" popper-class="config-dropdown" v-model="customConnect.authType" placeholder="" size="small" id="webshell-box-input-protocol">
<el-option v-for="item in authType" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("webshell.host")' prop="host">
<el-input v-model="customConnect.host" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.port")' prop="host">
<el-input v-model="customConnect.port" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authUsername")' prop="authUsername">
<el-input v-model="customConnect.authUsername" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authPin")' prop="authPin">
<el-input v-model="customConnect.authPin" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authUserTip")' prop="authUserTip">
<el-input v-model="customConnect.authUserTip" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authPinTip")' prop="authPinTip">
<el-input v-model="customConnect.authPinTip" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authPriKey")' prop="authPriKey">
<el-input v-model="customConnect.authPriKey" size="small"/>
</el-form-item>
<div class="right-box__footer">
<button id="asset-edit-cancel" @click="customShow=false" class="footer__btn footer__btn--light">
<span>{{$t('overall.cancel')}}</span>
</button>
<button id="asset-edit-save" :disabled="prevent_opt.save" class="footer__btn" @click="connect">
<span>Connect</span>
</button>
</div>
</el-form>
</div>
</el-dialog>
</div>
</div> </div>
<div >
<el-dialog :modal-append-to-body='false' :show-close="true" :title="uploadBox.title" :visible.sync="uploadBox.showUpload" @close="closeDialog" class="nz-dialog" width="500px" >
<div >
<div class="upload-body">
<el-row >
<el-col :span="24">
<el-upload :auto-upload="false" :file-list="uploadFileList"
:on-change="handleChange" action=""
class="upload-demo"
drag
ref="uploadFile" >
<i class="nz-icon nz-icon-upload"></i>
<div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
<!--<button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
<span class="top-tool-btn-txt" >{{$t('webshell.fileSelect')}}</span>
</button>-->
</el-upload>
</el-col>
</el-row>
<el-row style="margin-top: 20px;">
<el-col :span="3" style="text-align:center;line-height: 24px;">
<label>{{$t('webshell.filePath')}}</label>
</el-col>
<el-col :span="21">
<el-input size="mini" v-model="uploadFile.path"></el-input>
</el-col>
</el-row>
</div>
<div class="footer" slot="footer">
<div class="el-message-box__btns" style="text-align: right;margin-top: 20px;">
<button @click="upload" class="el-button el-button--default el-button--small">
<span>{{$t('webshell.uploadButtonTitle')}}</span>
</button>
<button @click="closeDialog" class="el-button el-button--default el-button--small" >
<span>{{$t('overall.cancel')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :title="downloadBox.title" :visible.sync="downloadBox.showDownload" @close="closeDownloadDialog" class="nz-dialog" width="500px" >
<div>
<div class="upload-body">
<el-row style="margin-top: 20px;">
<el-col :span="3" style="text-align:center;line-height: 24px;">
<label>{{$t('webshell.filePath')}}</label>
</el-col>
<el-col :span="21">
<el-input size="mini" v-model="downloadFile.path"></el-input>
</el-col>
</el-row>
</div>
<div class="footer" slot="footer">
<div class="el-message-box__btns" style="text-align: right;margin-top: 20px;">
<button @click="download" class="el-button el-button--default el-button--small">
<span>{{$t('webshell.downloadButtonTitle')}}</span>
</button>
<button @click="closeDownloadDialog" class="el-button el-button--default el-button--small">
<span>{{$t('overall.cancel')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="closeConfirmShow" @close="cancleConfirm" class="nz-dialog" width="500px" >
<div >
<div class="el-message-box__content">
<div class="el-message-box__container">
<div class="el-message-box__status el-icon-warning">
</div>
<div class="el-message-box__message">
<p>{{$t('webshell.closeTip')}}</p>
</div>
</div>
</div>
<div class="footer" slot="footer">
<div class="el-message-box__btns" style="text-align: unset; padding-left: 50px;">
<el-checkbox v-model="closeRemember">{{$t('webshell.remember')}}</el-checkbox>
<button @click="closeShellWindow" class="el-button el-button--default el-button--small el-button--primary float-right" type="button">
<span>{{$t('tip.yes')}}</span>
</button>
<button @click="cancleConfirm" class="el-button el-button--default el-button--small float-right" type="button">
<span>{{$t('tip.no')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="assetShow" @close="assetShow=false" class="nz-dialog" width="620px" >
<div >
<el-form label-width="120px" size="small" :model="assetContent" label-position = "top" :rules="rules" ref="assetConnect" v-loading="assetLoading" >
<el-form-item :label='$t("overall.asset")' prop="assetId" class="flex">
<v-selectpage
style="flex: 1"
:data="assetData"
:tb-columns="columns"
key-field="id"
show-field="manageIp"
search-field="manageIp"
v-model="assetContent.assetId"
size="small"
:placeholder="$t('dashboard.panel.chartForm.selectAsset')"
id="box-input-asset-id"
:result-format="resultFormat"></v-selectpage>
<button @click.prevent="connect" type="button" :disabled="prevent_opt.save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new">Connect</button>
</el-form-item>
</el-form>
</div>
</el-dialog>
<el-dialog :modal-append-to-body='false' :show-close="true" :visible.sync="customShow" @close="customShow=false" class="nz-dialog" width="620px" >
<div >
<el-form label-width="120px" size="small" :model="customConnect" label-position = "top" :rules="rulesCustom" ref="customConnect" v-loading="assetLoading" class="custom">
<el-form-item :label='$t("webshell.protocol")' prop="authProtocol" @change="protocolChange">
<el-select value-key="id" popper-class="config-dropdown" v-model="customConnect.authProtocol" placeholder="" size="small" id="webshell-box-input-protocol">
<el-option v-for="item in authProtocol" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("webshell.authType")' prop="authType" @change="authTypeChange">
<el-select value-key="id" popper-class="config-dropdown" v-model="customConnect.authType" placeholder="" size="small" id="webshell-box-input-protocol">
<el-option v-for="item in authType" :id="'dc-principal-op-'+item.value" :key="item.value" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("webshell.host")' prop="host">
<el-input v-model="customConnect.host" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.port")' prop="host">
<el-input v-model="customConnect.port" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authUsername")' prop="authUsername">
<el-input v-model="customConnect.authUsername" size="small"/>
</el-form-item>
<el-form-item :label='$t("webshell.authPin")' prop="authPin">
<el-input v-model="customConnect.authPin" size="small"/>
</el-form-item>
<el-form-item
v-if="customConnect.authProtocol === 2"
:label='$t("webshell.authUserTip")'
prop="authUserTip"
:rules="[
{ required: customConnect.authProtocol ===2, message:$t('validate.required'), trigger: 'change'},
]">
<el-input v-model="customConnect.authUserTip" size="small"/>
</el-form-item>
<el-form-item
v-if="customConnect.authProtocol === 2"
:label='$t("webshell.authPinTip")'
prop="authPinTip"
:rules="[
{ required: customConnect.authProtocol ===2, message:$t('validate.required'), trigger: 'change'},
]"
>
<el-input v-model="customConnect.authPinTip" size="small"/>
</el-form-item>
<el-form-item
v-if="customConnect.authType === 2"
:label='$t("webshell.authPriKey")'
prop="authPriKey"
:rules="[
{ required: customConnect.authType ===2, message:$t('validate.required'), trigger: 'change'},
]"
>
<el-input v-model="customConnect.authPriKey" size="small"/>
</el-form-item>
<div class="right-box__footer">
<button id="asset-edit-cancel" @click="customShow=false" class="footer__btn footer__btn--light" type="button">
<span>{{$t('overall.cancel')}}</span>
</button>
<button id="asset-edit-save" :disabled="prevent_opt.save" class="footer__btn" @click.prevent="connect" type="button">
<span>Connect</span>
</button>
</div>
</el-form>
</div>
</el-dialog>
</div>
</div>
</template> </template>
<script> <script>
@@ -378,7 +399,7 @@ export default {
], ],
authPin: [ authPin: [
{ required: true, message: this.$t('validate.required'), trigger: 'change' } { required: true, message: this.$t('validate.required'), trigger: 'change' }
], ]
// authUserTip: [ // authUserTip: [
// { validator: this.authUserTipValid, trigger: 'change' } // { validator: this.authUserTipValid, trigger: 'change' }
// ], // ],
@@ -794,7 +815,6 @@ export default {
}) })
}, },
resultFormat (resp) { resultFormat (resp) {
console.log(resp)
if (resp && resp.data) return resp.data.values.gridResult if (resp && resp.data) return resp.data.values.gridResult
}, },
assetShowChange () { assetShowChange () {
@@ -811,12 +831,10 @@ export default {
connect () { connect () {
this.prevent_opt.save = true this.prevent_opt.save = true
if (this.assetShow) { if (this.assetShow) {
console.log(this.assetContent)
this.$refs.assetConnect.validate((valid) => { this.$refs.assetConnect.validate((valid) => {
if (valid) { if (valid) {
// this.show(id, host, accountId, port) // this.show(id, host, accountId, port)
const asset = this.assetData.find(item => item.id == this.assetContent.assetId) const asset = this.assetData.find(item => item.id == this.assetContent.assetId)
console.log(asset)
this.addConsole(asset.id, asset.manageIp, '', '', 'asset') this.addConsole(asset.id, asset.manageIp, '', '', 'asset')
this.assetShow = false this.assetShow = false
this.prevent_opt.save = false this.prevent_opt.save = false
@@ -832,14 +850,16 @@ export default {
}) })
} }
}, },
authUserTipValid () { protocolChange () {
if (this.customConnect.authProtocol === 1) {
this.customConnect.authUserTip = ''
this.customConnect.authPinTip = ''
}
}, },
authPinTipValid () { authTypeChange () {
if (this.customConnect.authType === 1) {
}, this.customConnect.authPriKey = ''
authPriKeyValid () { }
} }
}, },
watch: { watch: {
@@ -909,3 +929,29 @@ export default {
width: 100%; width: 100%;
} }
</style> </style>
<style lang="scss">
.popover-webshell{
margin-top: 0 !important;
.popover-webshell-item{
padding: 5px;
font-family: Roboto-Regular;
font-size: 14px;
color: #666666;
font-weight: 400;
.nz-icon{
margin-right: 5px;
font-size: 16px;
}
}
.popover-webshell-item:hover{
background: #F6F6F6;
font-family: Roboto-Regular;
font-size: 14px;
color: #FA901C;
font-weight: 400;
}
.popper__arrow{
display: none;
}
}
</style>