feature: asset修复
idc弹窗修复 cli功能添加 bug处理修复
This commit is contained in:
wanghaoyu
@@ -35,18 +35,83 @@
|
||||
<el-menu-item :index="'2-' + index">
|
||||
<div @click="jumpToProject(item)">
|
||||
<span>{{item.name}}</span>
|
||||
<div @click.stop="toEditProject(item)" class="menu-edit"><i class="el-icon-edit-outline"></i></div>
|
||||
<div @click.stop="toEditProject(item)" class="menu-edit"><i
|
||||
class="el-icon-edit-outline"></i></div>
|
||||
</div>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
<el-submenu index="3">
|
||||
<template slot="title">
|
||||
<div @click="jumpToAsset('asset')">{{$t('overall.asset')}}</div>
|
||||
<div @click="jumpTo('asset')">{{$t('overall.asset')}}</div>
|
||||
</template>
|
||||
<template v-for="(item, index) in assetData">
|
||||
<el-menu-item :index="'3-' + index">
|
||||
<div @click="jumpToAsset('asset',item.id)">{{item.name}}</div>
|
||||
<div @click="jumpToAsset('asset',item.id)">
|
||||
<span>{{item.name}}</span>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
v-model="item[item.name]"
|
||||
trigger="click"
|
||||
>
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@click="item[item.name] = false">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<div style="padding-top: 10px;padding-left: 20px">
|
||||
<div>
|
||||
<label style="font-size: 12px">DN name</label>
|
||||
<input class='sidebar-pop-input' v-model="addIdcData.name"/>
|
||||
</div>
|
||||
<div style="padding-top: 40px">
|
||||
<label style="font-size: 12px">Loaction</label>
|
||||
<input class='sidebar-pop-input' v-model="addIdcData.location"/>
|
||||
</div>
|
||||
<div style="padding-top: 40px">
|
||||
<label style="font-size: 12px;padding-right: 20px">负责人</label>
|
||||
<select class='sidebar-pop-input-select'
|
||||
style="margin-left:-40px "
|
||||
v-model="addIdcData.principal"
|
||||
clearable>
|
||||
<option
|
||||
v-for="item in idcUserData"
|
||||
:key="item.key"
|
||||
:label="item.username"
|
||||
:value="item.userId"
|
||||
>
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="padding-top: 40px">
|
||||
<label style="font-size: 12px">Tel</label>
|
||||
<input class='sidebar-pop-input' v-model="addIdcData.tel"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-bottom-btns">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel"
|
||||
@click.stop="item[item.name]= false">
|
||||
{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="editData('idc',item.id)">
|
||||
{{$t('overall.save')}}
|
||||
</div>
|
||||
</div>
|
||||
<div @click.stop="getIDCOptionData(item.id)" slot="reference" class="menu-edit">
|
||||
<i class="el-icon-edit-outline"></i>
|
||||
</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
@@ -73,7 +138,6 @@
|
||||
</el-menu-item>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
|
||||
</div>
|
||||
<div class="header-right">
|
||||
<div class="header-user-con">
|
||||
@@ -106,11 +170,9 @@
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<project-box :project="editProject" @reload="projectReload" ref="projectBox"></project-box>
|
||||
<!-- <project-box :project="editProject" @reload="projectReload" ref="projectBox"></project-box>-->
|
||||
<module-box :currentProject="currentProject" :module="editModule" @reload="" ref="moduleBox"></module-box>
|
||||
<!--<add-endpoint-box :currentProject="currentProject" :currentModule="currentModule" @reload="" ref="addEndpointBox"></add-endpoint-box>-->
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -119,6 +181,15 @@ export default {
|
||||
name: "Header",
|
||||
data() {
|
||||
return {
|
||||
addIdcData: {
|
||||
id: '',
|
||||
name: '',
|
||||
location: '',
|
||||
principal: '',
|
||||
tel: ''
|
||||
},
|
||||
idcUserData: '',
|
||||
IDCOptionData: [],
|
||||
language: localStorage.getItem("language"),
|
||||
assetData: [],
|
||||
projectData: [], //顶部菜单project列表中的数据
|
||||
@@ -168,6 +239,52 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getUserData() {
|
||||
this.$get('sys/user/list').then(response => {
|
||||
if (response.code === 200) {
|
||||
this.idcUserData = response.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
getIDCOptionData(data) {
|
||||
this.$get('idc?id=' + data).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.addIdcData = response.data.list[0];
|
||||
this.clickFlush(this.addIdcData)
|
||||
}
|
||||
})
|
||||
},
|
||||
editData(data, Id) {
|
||||
let idcData = {
|
||||
id: '',
|
||||
name: '',
|
||||
location: '',
|
||||
principal: '',
|
||||
tel: ''
|
||||
}
|
||||
if (data === 'idc') {
|
||||
idcData.id = Id
|
||||
idcData.name = this.addIdcData.name
|
||||
idcData.location = this.addIdcData.location
|
||||
idcData.principal = this.addIdcData.principal
|
||||
idcData.tel = this.addIdcData.tel
|
||||
}
|
||||
this.$put(data, idcData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
})
|
||||
this.$store.state.flushDataSign = true
|
||||
}else{
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
jumpTo(data) {
|
||||
this.$router.push({
|
||||
path: "/" + data,
|
||||
@@ -176,13 +293,43 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
clickFlush(itemData) {
|
||||
for (let i = 0; i < this.assetData.length; i++) {
|
||||
const element = this.assetData[i];
|
||||
if (element.id === itemData.id) {
|
||||
setTimeout(() => {
|
||||
element[element.name] = true;
|
||||
}, 100)
|
||||
} else {
|
||||
element[element.name] = false
|
||||
}
|
||||
}
|
||||
},
|
||||
getAssetData() {
|
||||
this.$get('idc', this.pageObj).then(response => {
|
||||
if (response.code == 200) {
|
||||
this.assetData = response.data.list
|
||||
this.assetData.forEach(item => {
|
||||
this.$set(item, item.name, false)
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
createBox(item) {
|
||||
if (item.type == 1) {
|
||||
this.$refs.projectBox.show(true);
|
||||
this.editProject = {id: '', name: '', remark: ''};
|
||||
} else if (item.type == 2) {
|
||||
this.$refs.moduleBox.show(true);
|
||||
this.editModule = {id: '', name: '', project: this.$store.state.currentProject, port: '', path: '', param: '', paramObj: []};
|
||||
this.editModule = {
|
||||
id: '',
|
||||
name: '',
|
||||
project: this.$store.state.currentProject,
|
||||
port: '',
|
||||
path: '',
|
||||
param: '',
|
||||
paramObj: []
|
||||
};
|
||||
} else if (item.type == 3) {
|
||||
this.$refs.addEndpointBox.show(true);
|
||||
}
|
||||
@@ -200,13 +347,6 @@ export default {
|
||||
localStorage.setItem("language", lang);
|
||||
window.location.reload();
|
||||
},
|
||||
getAssetData() {
|
||||
this.$get('idc', this.pageObj).then(response => {
|
||||
if (response.code == 200) {
|
||||
this.assetData = response.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
getProjectList() {
|
||||
this.$get('project', {}).then(response => {
|
||||
if (response.code == 200) {
|
||||
@@ -223,15 +363,27 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getUserData();
|
||||
this.getAssetData();
|
||||
this.getProjectList();
|
||||
},
|
||||
}
|
||||
,
|
||||
computed: {
|
||||
projectListReloadWatch() {
|
||||
return this.$store.state.projectListReload;
|
||||
}
|
||||
},
|
||||
getIdcData() {
|
||||
return this.$store.state.assetData.idcData
|
||||
}
|
||||
}
|
||||
,
|
||||
watch: {
|
||||
getIdcData:{
|
||||
handler(newVal, oldVal) {
|
||||
this.getAssetData()
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
projectListReloadWatch(n, o) {
|
||||
if (n) {
|
||||
this.getProjectList();
|
||||
@@ -243,17 +395,20 @@ export default {
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-menu.el-menu--horizontal{
|
||||
border-bottom:0px
|
||||
.el-menu.el-menu--horizontal {
|
||||
border-bottom: 0px
|
||||
}
|
||||
|
||||
.el-submenu__title .el-submenu__icon-arrow {
|
||||
display: none;
|
||||
}
|
||||
.el-menu--horizontal>.el-menu-item.is-active{
|
||||
border-bottom:0px
|
||||
|
||||
.el-menu--horizontal > .el-menu-item.is-active {
|
||||
border-bottom: 0px
|
||||
}
|
||||
.el-menu--horizontal>.el-submenu.is-active .el-submenu__title{
|
||||
border-bottom:0px
|
||||
|
||||
.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
|
||||
border-bottom: 0px
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -342,22 +497,103 @@ export default {
|
||||
.header-name-jiantou {
|
||||
position: static !important;
|
||||
}
|
||||
.el-menu-demo>li:first-of-type {
|
||||
|
||||
.el-menu-demo > li:first-of-type {
|
||||
position: fixed;
|
||||
left: 40%;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.menu-create {
|
||||
line-height: 15px;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.menu-create .el-icon-plus {
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
.menu-edit {
|
||||
line-height: 36px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pop-window-assetType-content {
|
||||
padding: 1px 15px 15px 20px;
|
||||
}
|
||||
|
||||
.pop-window {
|
||||
height: 370px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.right-box-top-btns {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar-pop-input {
|
||||
position: absolute;
|
||||
right: 50px;
|
||||
width: 200px;
|
||||
height: 26px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #DCDFE6;
|
||||
color: #606266;
|
||||
display: inline-block;
|
||||
padding: 0px 15px;
|
||||
}
|
||||
|
||||
.sidebar-pop-input-select {
|
||||
position: absolute;
|
||||
right: 83px;
|
||||
width: 200px;
|
||||
height: 26px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #DCDFE6;
|
||||
color: #606266;
|
||||
display: inline-block;
|
||||
padding: 0px 15px;
|
||||
}
|
||||
|
||||
.right-box-top-btn {
|
||||
border-radius: 0 0 9px 9px;
|
||||
float: right;
|
||||
color: #656565;
|
||||
height: 30px;
|
||||
font-size: 12px;
|
||||
padding: 3px 8px 1px 8px;
|
||||
border: 1px solid #aaaaaa;
|
||||
border-top: none;
|
||||
cursor: pointer;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.right-box-bottom-btns {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.right-box-bottom-btn-cancel {
|
||||
background-color: #DADADA;
|
||||
color: #656565;
|
||||
width: 50%;
|
||||
border-bottom-left-radius: 8px;
|
||||
}
|
||||
|
||||
.right-box-top-btn-full {
|
||||
background-color: #656565;
|
||||
border: 1px solid #656565;
|
||||
border-top: none;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.right-box-bottom-btn-50 {
|
||||
width: 50%;
|
||||
float: right;
|
||||
border-bottom-right-radius: 8px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -33,6 +33,73 @@ const en = {
|
||||
asset:{
|
||||
createAsset: "Create Asset",
|
||||
asset: 'Asset',
|
||||
createAssetTab:{
|
||||
title:'Create Asset',
|
||||
host:'host',
|
||||
state:'state',
|
||||
selectTip:'please select',
|
||||
assetInfo:'资产信息',
|
||||
assetType:'资产类型',
|
||||
assetTypeTab:{
|
||||
assetType:'资产类型',
|
||||
addAssetType:'新增资产类型',
|
||||
existAssetType:'已有资产类型'
|
||||
},
|
||||
vendor:'厂商/型号',
|
||||
vendorTab:{
|
||||
vendor:'厂商/型号',
|
||||
vendorName:'新厂商名称',
|
||||
existVendor:'已有厂商',
|
||||
modelName:'新型号名称',
|
||||
existModel:'已有型号'
|
||||
},
|
||||
purchaseDate:'购买日期',
|
||||
dataSelectTip:'please select data',
|
||||
dc:'DC',
|
||||
dcName:'DC Name',
|
||||
AddIdcTab:{
|
||||
title:'+Add IDC',
|
||||
dcName:'DC Name',
|
||||
location:'Location',
|
||||
principal:'负责人',
|
||||
tel:'Tel'
|
||||
},
|
||||
editIdcTab:{
|
||||
title:'Edit IDC',
|
||||
dcName:'DC Name',
|
||||
location:'Location',
|
||||
principal:'负责人',
|
||||
tel:'Tel'
|
||||
},
|
||||
location:'Location',
|
||||
principal:'负责人',
|
||||
tel:'Tel',
|
||||
cabinet: '机柜',
|
||||
AddCabinetTab:{
|
||||
title:'+Add机柜',
|
||||
name:'Name',
|
||||
uSize:'U Size',
|
||||
remark:'Desc',
|
||||
DC:'DC',
|
||||
},
|
||||
editCabinetTab:{
|
||||
title:'Edit 机柜',
|
||||
name:'Name',
|
||||
uSize:'U Size',
|
||||
remark:'Desc',
|
||||
DC:'DC',
|
||||
},
|
||||
uSize:'U Size',
|
||||
remark:'Desc',
|
||||
cli:'CLI Account',
|
||||
loginType:'登录方式',
|
||||
password:'password',
|
||||
ssh:'SSH私钥',
|
||||
account:'Account',
|
||||
port:'Port',
|
||||
upload:'Upload',
|
||||
clickToUpload:'点击上传'
|
||||
},
|
||||
tableTitle: {
|
||||
id: 'ID',
|
||||
assetType: '资产类型',
|
||||
@@ -56,6 +123,7 @@ const en = {
|
||||
endPoint: 'EndPoint',
|
||||
alert: 'alert',
|
||||
},
|
||||
|
||||
},
|
||||
config: {
|
||||
config: "Config",
|
||||
|
||||
63
nezha-fronted/src/components/page/asset/Console.vue
Normal file
63
nezha-fronted/src/components/page/asset/Console.vue
Normal file
@@ -0,0 +1,63 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="console" id="terminal"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
import Terminal from '../../common/js/Xterm'
|
||||
export default {
|
||||
name: 'Console',
|
||||
props:['terminal','token'],
|
||||
data () {
|
||||
return {
|
||||
term: null,
|
||||
terminalSocket: null,
|
||||
obj:{
|
||||
id:2
|
||||
},
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
token: {
|
||||
immediate:true,
|
||||
handler(val){
|
||||
if(val){
|
||||
this.create()
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
create(){
|
||||
let terminalContainer = document.getElementById('terminal')
|
||||
this.term = new Terminal()
|
||||
this.term.open(terminalContainer)
|
||||
this.terminalSocket = new WebSocket("ws://192.168.40.247:8080/nz-admin/terminal.ws?width=1&height=1&cols=225&rows=200&token="+this.token);
|
||||
// this.terminalSocket = new WebSocket("ws://192.168.41.101:8088/nz-admin/terminal.ws?width=1600&height=1005&cols=225&rows=58&token="+this.token);
|
||||
this.term.attach(this.terminalSocket)
|
||||
this.term._initialized = true
|
||||
},
|
||||
},
|
||||
mounted () {
|
||||
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.terminalSocket.close()
|
||||
this.term.destroy()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.header {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
font-size: 22px;
|
||||
background-color: #ffffff;
|
||||
z-index: 510;
|
||||
box-shadow: 0px 20px 13px -19px #5E5E5E;
|
||||
}
|
||||
</style>
|
||||
254
nezha-fronted/src/components/page/asset/WebSSH.vue
Normal file
254
nezha-fronted/src/components/page/asset/WebSSH.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<div class="submenu">
|
||||
<el-menu class="el-menu-demo" mode="horizontal">
|
||||
<el-submenu index="1">
|
||||
<template slot="title">操作</template>
|
||||
<el-menu-item index="1-1">
|
||||
<template>
|
||||
<span @click.once="cloneChat">克隆会话</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="1-2">
|
||||
<template>
|
||||
<span @click="dialogVisible = true">上传文件</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</el-submenu>
|
||||
<el-submenu index="2">
|
||||
<template slot="title">打开</template>
|
||||
<template v-for="(item, index) in enableAsset">
|
||||
<el-menu-item :index="'2-' + index" @click="createCli(item)">{{item.host}}</el-menu-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="title-input">
|
||||
<input style="height: 20px;width: 250px" v-model="order"></input>
|
||||
<button @click="sendOrder">发送</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
width="30%"
|
||||
:modal="true">
|
||||
<label>文件路径</label>
|
||||
<el-input v-model="uploadFile.path"></el-input>
|
||||
<div style="padding-top: 20px">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action=""
|
||||
:on-change="handleChange"
|
||||
:auto-upload="false"
|
||||
>
|
||||
<el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
|
||||
</el-upload>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="upload">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<my-terminal :terminal="terminal" :token="token"></my-terminal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Console from './Console'
|
||||
|
||||
export default {
|
||||
name: 'WebSSH',
|
||||
components: {
|
||||
'my-terminal': Console
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
flag:false,
|
||||
assetData: '',
|
||||
terminal: {
|
||||
pid: 1,
|
||||
name: 'terminal',
|
||||
cols: 400,
|
||||
rows: 400
|
||||
},
|
||||
dialogVisible: false,
|
||||
obj: {
|
||||
id: ''
|
||||
},
|
||||
uploadFile: {
|
||||
file: '',
|
||||
path: '',
|
||||
token: ''
|
||||
},
|
||||
pageObj: {
|
||||
pageNo: 1,
|
||||
pageSize: 100,
|
||||
},
|
||||
order:'',
|
||||
enableAsset: '',
|
||||
accountId: '',
|
||||
routeData: this.$route.query,
|
||||
token: '',
|
||||
width: '',
|
||||
height: `${document.documentElement.clientHeight}`,
|
||||
witdh: `${document.documentElement.clientWidth}`,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
routeData(newVal) {
|
||||
if (newVal) {
|
||||
this.getIDCOptionData(this.routeData)
|
||||
}
|
||||
},
|
||||
accountId(newVal) {
|
||||
if (newVal) {
|
||||
this.getToken(newVal)
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
createCli(item) {
|
||||
let routeData = this.$router.resolve({
|
||||
name: "newChat",
|
||||
query: {
|
||||
host: item.host,
|
||||
accountId: item.accounts[0].id
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
cloneChat() {
|
||||
let routeData = this.$router.resolve({
|
||||
name: "cloneChat",
|
||||
query: {
|
||||
accountId: this.accountId,
|
||||
host: this.routeData.host
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
getIDCOptionData(data) {
|
||||
this.$get('account?assetId=' + data.id).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.accountId = response.data.list[0].id
|
||||
}
|
||||
})
|
||||
},
|
||||
getSize(height, width) {
|
||||
const _this = this
|
||||
setTimeout(function () {
|
||||
_this.setSize(height, width)
|
||||
}, 1000);
|
||||
},
|
||||
getToken(data) {
|
||||
this.obj.id = data
|
||||
this.$post('account/ssh.do', this.obj).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.token = res.data.token
|
||||
sessionStorage.setItem('cliToken', this.token)
|
||||
}
|
||||
})
|
||||
},
|
||||
sendOrder(){
|
||||
let form = new FormData();
|
||||
form.append("token", this.token);
|
||||
form.append("cmd", this.order);
|
||||
this.$post('account/sendAll.do', form).then(res => {
|
||||
})
|
||||
},
|
||||
setSize(height, width) {
|
||||
let form = new FormData();
|
||||
form.append("token", this.token);
|
||||
form.append("cols", parseInt(20));
|
||||
form.append("rows", parseInt(20));
|
||||
form.append("height", parseInt(height));
|
||||
form.append("width", parseInt(width));
|
||||
this.$post('account/resize.do', form).then(res => {
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
getAssetData() {
|
||||
this.$get('asset', this.pageObj).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.assetData = response.data.list;
|
||||
this.enableAsset = this.assetData.filter(item => {
|
||||
return item.accounts.length > 0
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
upload() {
|
||||
this.uploadFile.token = this.token
|
||||
let form = new FormData();
|
||||
form.append("token", this.token);
|
||||
form.append("file", this.uploadFile.file);
|
||||
form.append("path", this.uploadFile.path);
|
||||
this.$post('account/upload.do', form).then(res => {
|
||||
if (res.code === 200) {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(file) {
|
||||
this.uploadFile.file = file.raw
|
||||
},
|
||||
beforeunloadFn(e) {
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
window.addEventListener('beforeunload', e => this.beforeunloadFn(e))
|
||||
},
|
||||
mounted() {
|
||||
this.getAssetData()
|
||||
if (this.routeData) {
|
||||
this.getIDCOptionData(this.routeData)
|
||||
this.host = this.routeData.host
|
||||
document.title = this.host
|
||||
}
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
let height = `${document.documentElement.clientHeight}`;
|
||||
let width = `${document.documentElement.clientWidth}`;
|
||||
this.getSize(height, width)
|
||||
})();
|
||||
};
|
||||
|
||||
// let _this = this
|
||||
// window.onbeforeunload = function (e) {
|
||||
// if (_this.$route.name === "terminal") {
|
||||
// e = e || window.event;
|
||||
// // 兼容IE8和Firefox 4之前的版本
|
||||
// if (e) {
|
||||
// console.log(e)
|
||||
// e.returnValue = "提示：/“退出系统/”请点系统的/“安全退出/”!"; ;
|
||||
// }
|
||||
// } else {
|
||||
// window.onbeforeunload = null
|
||||
// }
|
||||
// };
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.title {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.submenu {
|
||||
float: left;
|
||||
width: 500px;
|
||||
font-size: 22px;
|
||||
|
||||
}
|
||||
|
||||
.title-input {
|
||||
position: absolute;
|
||||
left: 300px;
|
||||
top: 19px
|
||||
}
|
||||
</style>
|
||||
@@ -62,7 +62,7 @@
|
||||
{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="addNewData('IDC')">
|
||||
@click="editData('idc',item)">
|
||||
{{$t('overall.save')}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -86,7 +86,6 @@
|
||||
:placeholder="$t('overall.search')"
|
||||
size="small"
|
||||
style="width: 200px;float: right;padding-top: 10px"
|
||||
|
||||
>
|
||||
</el-input>
|
||||
</div>
|
||||
@@ -179,7 +178,7 @@
|
||||
</p>
|
||||
</div>
|
||||
<div v-if="item.prop == 'option'">
|
||||
<span @click="ssss(scope.row.id)" class="account-list-option"><i
|
||||
<span @click="ssss(scope.row.id ,scope.row.host)" class="account-list-option"><i
|
||||
class="el-icon-monitor"></i></span>
|
||||
<span @click.stop="deleteData('asset',scope.row.id)" class="account-list-option"><i
|
||||
class="el-icon-delete"></i></span>
|
||||
@@ -192,8 +191,10 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
|
||||
<asset-add-unit :add-unit-show='addUnitShow' @refreshData="flushData" @sendStateData="tabControl"></asset-add-unit>
|
||||
<asset-edit-unit :edit-unit-show='editUnitShow' @refreshData="flushData" @sendStateData="tabControl" ref="assetEditUnit"></asset-edit-unit>
|
||||
<asset-add-unit :add-unit-show='addUnitShow' @refreshData="flushData"
|
||||
@sendStateData="tabControl"></asset-add-unit>
|
||||
<asset-edit-unit :edit-unit-show='editUnitShow' @refreshData="flushData" @sendStateData="tabControl"
|
||||
ref="assetEditUnit"></asset-edit-unit>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -204,8 +205,6 @@ export default {
|
||||
name: "asset",
|
||||
data() {
|
||||
return {
|
||||
vendorModelData: '',
|
||||
cabinetModelData: '',
|
||||
checkList: [],
|
||||
tableTitle: [
|
||||
{
|
||||
@@ -271,12 +270,6 @@ export default {
|
||||
}],
|
||||
tableData: [],
|
||||
checkListData: [],
|
||||
assetTypeOptionData: [],
|
||||
vendorTypeData: '',
|
||||
vendorTypeOptionData: [],
|
||||
vendorUlData: '',
|
||||
modelUlData: '',
|
||||
vendorCode: '',
|
||||
IDCData: '',
|
||||
IDCOptionData: [],
|
||||
cabinetData: '',
|
||||
@@ -303,20 +296,6 @@ export default {
|
||||
title: ''
|
||||
},
|
||||
assetType: '',
|
||||
assetTypeData: {
|
||||
type: 'assetType',
|
||||
value: '',
|
||||
},
|
||||
addVendorData: {
|
||||
type: 'vendor',
|
||||
value: '',
|
||||
},
|
||||
addNewModelData: {
|
||||
name: '',
|
||||
vendorCode: '',
|
||||
typeCode: ''
|
||||
},
|
||||
accountType: '',
|
||||
idcSelectedData: {
|
||||
id: '',
|
||||
name: '',
|
||||
@@ -333,125 +312,65 @@ export default {
|
||||
tel: ''
|
||||
},
|
||||
idcUserData: '',
|
||||
cabinetSelectedData: {
|
||||
name: '',
|
||||
uSize: 0,
|
||||
remark: '',
|
||||
idcId: '',
|
||||
},
|
||||
addCabinetData: {
|
||||
name: '',
|
||||
popName: '',
|
||||
uSize: 0,
|
||||
remark: '',
|
||||
idcId: '',
|
||||
},
|
||||
popTypeVisible: false,
|
||||
popCompVisible: false,
|
||||
popIDCVisible: false,
|
||||
popCabinetVisible: false,
|
||||
|
||||
editPopTypeVisible: false,
|
||||
editPopVendorVisible: false,
|
||||
editPopIDCVisible: false,
|
||||
editPopCabinetVisible: false,
|
||||
vendorCount: '',
|
||||
modelCount: '',
|
||||
allModelUlData: '',
|
||||
addForm: {
|
||||
sn: '',
|
||||
host: '',
|
||||
state: '',
|
||||
},
|
||||
tempData: '',
|
||||
tempModelData: [],
|
||||
isResourceShow: 0,
|
||||
unitDisable: '',
|
||||
modelClickData: '',
|
||||
popState: true,
|
||||
obj: null,
|
||||
addUnitShow: false,
|
||||
editUnitShow: false,
|
||||
flag: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getData() {
|
||||
return this.$store.state.assetData
|
||||
},
|
||||
getFlushData() {
|
||||
return this.$store.state.flushDataSign
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
getData: {
|
||||
handler(oldVal,newVal) {
|
||||
console.log(oldVal,newVal)
|
||||
this.checkList.splice(0, 1, newVal.selectedData)
|
||||
this.pageObj.idcIds = newVal.selectedData
|
||||
handler(oldVal, newVal) {
|
||||
this.checkList.splice(0, 1, newVal.selectedData);
|
||||
this.pageObj.idcIds = newVal.selectedData;
|
||||
this.getAssetData()
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
allModelUlData(newVal) {
|
||||
if (newVal) {
|
||||
this.getConnectData()
|
||||
if (this.pageObj.id != '') {
|
||||
this.assetData.modelId = [this.obj.model.vendor.code, this.obj.model.id]
|
||||
getFlushData: {
|
||||
handler(newVal, oldVal) {
|
||||
if (newVal === true) {
|
||||
this.getIDCOptionData();
|
||||
this.getAssetData()
|
||||
}
|
||||
}
|
||||
},
|
||||
assetType(newVal) {
|
||||
if (newVal == '') {
|
||||
this.popState = true
|
||||
} else {
|
||||
this.popState = false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.checkList.push(this.$store.state.assetData.selectedData)
|
||||
this.getSingleAsset(this.checkList)
|
||||
|
||||
},
|
||||
methods: {
|
||||
ssss(data) {
|
||||
ssss(id, sn) {
|
||||
let routeData = this.$router.resolve({
|
||||
name: "terminal",
|
||||
query: {id: data}
|
||||
query: {
|
||||
id: id,
|
||||
host: sn
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
getAssetData(data) {
|
||||
if (data !== undefined) {
|
||||
this.pageObj.id = data
|
||||
this.$get('asset', this.pageObj).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.obj = response.data.list[0];
|
||||
this.assetViewData.assetType = response.data.list[0].model.type.value
|
||||
this.assetViewData.vendor = response.data.list[0].model.vendor.value
|
||||
this.assetViewData.model = response.data.list[0].model.name
|
||||
this.assetViewData.idcName = response.data.list[0].idc.name
|
||||
this.assetViewData.cabinetName = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.name
|
||||
this.assetViewData.moduleNum = response.data.list[0].moduleNum
|
||||
this.assetViewData.alertNum = response.data.list[0].alertNum
|
||||
this.assetViewData.cabinetName = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.name
|
||||
this.getCabinetOptionData(response.data.list[0].idc.id)
|
||||
this.assetType = response.data.list[0].model.type.code
|
||||
this.assetData.sn = response.data.list[0].sn
|
||||
this.assetData.host = response.data.list[0].host
|
||||
this.assetData.state = response.data.list[0].state
|
||||
this.assetData.idcId = response.data.list[0].idc.id
|
||||
this.assetData.cabinetId = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.id
|
||||
this.assetData.purchaseDate = response.data.list[0].purchaseDate
|
||||
this.idcSelectedData.location = response.data.list[0].idc.location
|
||||
this.idcSelectedData.principal = this.getPrincipalName(response.data.list[0].idc.principal)
|
||||
this.idcSelectedData.tel = response.data.list[0].idc.tel
|
||||
this.cabinetSelectedData.uSize = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.uSize
|
||||
this.cabinetSelectedData.remark = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.remark
|
||||
this.getAllModelOptionData(this.assetType)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.pageObj.id = ''
|
||||
this.$get('asset', this.pageObj).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.tableData = response.data.list;
|
||||
this.pageObj.total = response.data.total
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
getIDCOptionData() {
|
||||
this.$get('idc').then(response => {
|
||||
@@ -468,102 +387,30 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
getCabinetOptionData(data) {
|
||||
this.$get('cabinet?idcId=' + data).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.cabinetOptionData = response.data.list;
|
||||
this.markOptionData(this.cabinetOptionData)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAssetTypeOptionData() {
|
||||
this.$get('sys/dict/all?type=assetType').then(response => {
|
||||
if (response.code === 200) {
|
||||
this.assetTypeOptionData = response.data
|
||||
this.markOptionData(this.assetTypeOptionData)
|
||||
}
|
||||
})
|
||||
},
|
||||
getVendorOptionData() {
|
||||
this.$get('sys/dict/all?type=vendor').then(response => {
|
||||
if (response.code === 200) {
|
||||
this.vendorUlData = response.data
|
||||
this.markOptionData(this.vendorUlData)
|
||||
}
|
||||
})
|
||||
},
|
||||
getModelOptionData(assetType, vendorCode) {
|
||||
this.$get('model?typeCode=' + assetType + '&vendorCode=' + vendorCode).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.modelUlData = response.data.list
|
||||
this.markOptionData(this.modelUlData)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAllModelOptionData(data) {
|
||||
this.$get('model?typeCode=' + this.assetType).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.allModelUlData = response.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
editData(data, item) {
|
||||
let obj = {
|
||||
id: '',
|
||||
type: '',
|
||||
value: '',
|
||||
code: ''
|
||||
if (data === 'idc') {
|
||||
item.name = this.addIdcData.popName
|
||||
}
|
||||
if (data === 'asset') {
|
||||
this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1]
|
||||
this.$put('asset', this.assetData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$put(data, item).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.pageObj.id = ''
|
||||
this.getAssetData();
|
||||
}
|
||||
})
|
||||
} else {
|
||||
if (data === 'model') {
|
||||
item.vendorCode = this.vendorCode
|
||||
item.typeCode = this.assetType
|
||||
}
|
||||
if (data === 'vendor') {
|
||||
obj.id = item.id
|
||||
obj.code = item.code
|
||||
obj.type = item.type
|
||||
obj.value = item.label
|
||||
data = 'sys/dict/update'
|
||||
item = obj
|
||||
}
|
||||
if (data === 'cabinet') {
|
||||
item.name = this.addCabinetData.popName
|
||||
}
|
||||
if (data === 'idc') {
|
||||
console.log(item)
|
||||
item.name = this.addIdcData.popName
|
||||
}
|
||||
this.$put(data, item).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
})
|
||||
this.getAssetData();
|
||||
this.getAllModelOptionData();
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
addNewData(type) {
|
||||
if (type === 'IDC') {
|
||||
console.log(this.addIdcData)
|
||||
this.$post('idc', this.addIdcData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
@@ -572,82 +419,9 @@ export default {
|
||||
});
|
||||
this.getIDCOptionData()
|
||||
this.getAssetData()
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'assetType') {
|
||||
this.$post('sys/dict/save', this.assetTypeData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getAssetTypeOptionData()
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'asset') {
|
||||
console.log(this.assetData)
|
||||
this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1]
|
||||
this.$post('asset', this.assetData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getAssetData();
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'vendor') {
|
||||
this.$post('sys/dict/save', this.addVendorData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getVendorOptionData()
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'model') {
|
||||
this.addNewModelData.typeCode = this.assetType
|
||||
this.addNewModelData.vendorCode = this.vendorCode
|
||||
this.$post('model', this.addNewModelData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getAllModelOptionData(this.assetType)
|
||||
} else {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'cabinet') {
|
||||
this.addCabinetData.idcId = this.assetData.idcId
|
||||
this.$post('cabinet', this.addCabinetData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getCabinetOptionData(this.addCabinetData.idcId)
|
||||
this.popoverClose('cabinet')
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
@@ -664,10 +438,6 @@ export default {
|
||||
});
|
||||
this.getAssetData()
|
||||
this.getIDCOptionData()
|
||||
this.getVendorOptionData()
|
||||
this.getCabinetOptionData(this.assetData.idcId)
|
||||
this.getAllModelOptionData(this.assetType)
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, response.msg),
|
||||
@@ -685,39 +455,6 @@ export default {
|
||||
this.$set(item, item.id + item.name, false)
|
||||
})
|
||||
},
|
||||
getConnectData() {
|
||||
this.isResourceShow += 1
|
||||
let resultData = []
|
||||
let modelData = this.allModelUlData
|
||||
for (let i = 0; i < modelData.length; i++) {
|
||||
let obj = {}
|
||||
obj.id = modelData[i].vendor.id
|
||||
obj.code = modelData[i].vendor.code
|
||||
obj.value = modelData[i].vendor.code
|
||||
obj.label = modelData[i].vendor.value
|
||||
obj.children = []
|
||||
resultData.push(obj)
|
||||
}
|
||||
var result = [];
|
||||
var obj1 = {};
|
||||
for (let i = 0; i < resultData.length; i++) {
|
||||
if (!obj1[resultData[i].id]) {
|
||||
result.push(resultData[i]);
|
||||
obj1[resultData[i].id] = true;
|
||||
}
|
||||
}
|
||||
for (let x = 0; x < result.length; x++) {
|
||||
for (let y = 0; y < modelData.length; y++) {
|
||||
if (result[x].code === modelData[y].vendor.code) {
|
||||
let obj2 = {}
|
||||
obj2.value = modelData[y].id
|
||||
obj2.label = modelData[y].name
|
||||
result[x].children.push(obj2)
|
||||
}
|
||||
}
|
||||
}
|
||||
this.vendorTypeOptionData = result
|
||||
},
|
||||
editOptionData(item) {
|
||||
if (!item.isEdit) {
|
||||
item.isEdit = true;
|
||||
@@ -738,16 +475,17 @@ export default {
|
||||
}
|
||||
},
|
||||
tagShow(data, id, type) {
|
||||
if(data === 'showAdd'){
|
||||
if (data === 'showAdd') {
|
||||
this.addUnitShow = true
|
||||
}
|
||||
if(data === 'showEdit'){
|
||||
if (data === 'showEdit') {
|
||||
this.editUnitShow = true
|
||||
this.$refs['assetEditUnit'].getAssetData(id)
|
||||
}
|
||||
if(data === 'showView'){
|
||||
if (data === 'showView') {
|
||||
this.editUnitShow = true
|
||||
this.$refs['assetEditUnit'].tabView=true
|
||||
this.$refs['assetEditUnit'].getAssetData(id)
|
||||
this.$refs['assetEditUnit'].tabView = true
|
||||
}
|
||||
},
|
||||
editing() {
|
||||
@@ -761,10 +499,6 @@ export default {
|
||||
this.idcSelectedData = item
|
||||
}
|
||||
});
|
||||
this.getCabinetOptionData(this.assetData.idcId);
|
||||
this.assetData.cabinetId = ''
|
||||
this.cabinetSelectedData.uSize = ''
|
||||
this.cabinetSelectedData.remark = null
|
||||
} else {
|
||||
this.IDCOptionData.forEach(item => {
|
||||
if (item.id === data) {
|
||||
@@ -778,21 +512,15 @@ export default {
|
||||
}
|
||||
,
|
||||
getSingleAsset(data) {
|
||||
console.log(data)
|
||||
// let regPos = /^\d+(\.\d+)?$/;
|
||||
// if(!regPos.test(data)){
|
||||
// this.pageObj.idcIds = data
|
||||
// }else{
|
||||
let result = []
|
||||
if (data[0] === '') {
|
||||
result = data.slice(1);
|
||||
this.pageObj.idcIds = result.join(',')
|
||||
} else {
|
||||
this.pageObj.idcIds = data.join(',')
|
||||
// }
|
||||
}
|
||||
this.getAssetData()
|
||||
},
|
||||
getLidata(index, item) {
|
||||
this.vendorCount = index;
|
||||
this.vendorCode = item.code;
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
}
|
||||
,
|
||||
pageNo(val) {
|
||||
this.pageObj.pageNo = val;
|
||||
this.getAssetData()
|
||||
@@ -802,23 +530,6 @@ export default {
|
||||
this.pageObj.pageSize = val;
|
||||
this.getAssetData()
|
||||
},
|
||||
popoverClose(data) {
|
||||
if (data === 'type') {
|
||||
this.modelCount = ''
|
||||
this.popTypeVisible = false
|
||||
}
|
||||
if (data === 'vendor') {
|
||||
this.popCompVisible = false;
|
||||
this.modelUlData = '';
|
||||
this.vendorCount = ''
|
||||
}
|
||||
if (data === 'idc') {
|
||||
this.popIDCVisible = false
|
||||
}
|
||||
if (data === 'cabinet') {
|
||||
this.popCabinetVisible = false
|
||||
}
|
||||
},
|
||||
getPrincipalName(data) {
|
||||
for (let item in this.idcUserData) {
|
||||
if (this.idcUserData[item].userId === data) {
|
||||
@@ -841,18 +552,9 @@ export default {
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getCabinetOptionData('')
|
||||
this.getUserData()
|
||||
this.getUserData();
|
||||
this.getAssetData();
|
||||
this.getIDCOptionData();
|
||||
this.getVendorOptionData();
|
||||
this.getAssetTypeOptionData();
|
||||
window.onresize = () => {
|
||||
this.tableHeight = document.documentElement.clientHeight - 200;
|
||||
}
|
||||
// let terminalContainer = document.getElementById('terminal-container')
|
||||
// let term = new Terminal()
|
||||
// term.open(terminalContainer)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -862,12 +564,12 @@ export default {
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
padding: 0px;
|
||||
padding: 0;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.el-form-style .el-form-item {
|
||||
margin-bottom: 0px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.el-form-style .el-form-item .el-form-item__content {
|
||||
@@ -876,7 +578,7 @@ export default {
|
||||
}
|
||||
|
||||
.el-checkbox.is-bordered + .el-checkbox.is-bordered {
|
||||
margin-left: 0px;
|
||||
margin-left: 0;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
@@ -922,7 +624,7 @@ export default {
|
||||
border: 1px solid #DCDFE6;
|
||||
color: #606266;
|
||||
display: inline-block;
|
||||
padding: 0px 15px;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.content-left {
|
||||
@@ -970,24 +672,6 @@ export default {
|
||||
left: 230px;
|
||||
}
|
||||
|
||||
.el-form-style {
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
.right-menu {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
right: 0;
|
||||
z-index: 500;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 15px #ccc;
|
||||
background-color: white;
|
||||
padding: 0 20px;
|
||||
width: 580px;
|
||||
height: calc(90% - 60px);
|
||||
overflow-y: auto
|
||||
}
|
||||
|
||||
.tab-input-square {
|
||||
border: 1px solid #aaaaaa;
|
||||
height: 25px;
|
||||
@@ -1029,59 +713,16 @@ export default {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.right-box-title {
|
||||
height: 30px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.el-select-add-btn {
|
||||
display: inline-block;
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
float: right;
|
||||
margin-top: 7px;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #DCDFE6;
|
||||
box-sizing: border-box;
|
||||
color: #C7C9CE;
|
||||
line-height: 22px;
|
||||
transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
|
||||
}
|
||||
|
||||
.el-select-add-btn:hover {
|
||||
border: 1px solid #C0C4CC;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pop-window {
|
||||
height: 370px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.pop-window-assetType {
|
||||
height: 550px;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
.pop-window-assetType-content {
|
||||
padding: 1px 15px 15px 20px;
|
||||
}
|
||||
|
||||
.li-list {
|
||||
width: 97%;
|
||||
height: 300px;
|
||||
border: 1px solid #cfcfcf;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.li-list-part {
|
||||
width: 90%;
|
||||
height: 130px;
|
||||
border: 1px solid #cfcfcf;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.rm-c-list span:hover {
|
||||
background-color: #888;
|
||||
color: #fff;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<transition name="right-box">
|
||||
<div class="right-menu" v-if="addUnitShow">
|
||||
<div class="right-menu" v-if="addUnitShow" @click="editQuit">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click.stop="sendStateData('close')">
|
||||
<div class="right-box-btn-icon">
|
||||
@@ -8,31 +8,25 @@
|
||||
</div>
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn right-box-top-btn-full">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click.stop="addNewData('asset')">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-edit-outline"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.save')}}</span>
|
||||
</div>
|
||||
<div class="right-box-top-btn">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-delete"></i>
|
||||
</div>
|
||||
<span>{{$t('overall.delete')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-title">Create Asset</div>
|
||||
<div class="right-box-title">{{$t('asset.createAssetTab.title')}}</div>
|
||||
<el-form :model="assetData" label-width="120px">
|
||||
<div class="el-form-style">
|
||||
<el-form-item label="SN" prop="sn">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.title')" prop="sn">
|
||||
<el-input v-model="assetData.sn"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Host" prop="host">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.host')" prop="host">
|
||||
<el-input v-model="assetData.host"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="State" prop="state">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.state')" prop="state">
|
||||
<div class="select-style">
|
||||
<el-select v-model="assetData.state" placeholder="请选择">
|
||||
<el-select v-model="assetData.state" :placeholder="this.$t('asset.createAssetTab.selectTip')">
|
||||
<el-option
|
||||
v-for="item in assetStateOption"
|
||||
:key="item.value"
|
||||
@@ -42,33 +36,27 @@
|
||||
</el-select>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="font-size: 10px">资产信息</div>
|
||||
<div style="font-size: 10px">{{$t('asset.createAssetTab.assetInfo')}}</div>
|
||||
<el-divider></el-divider>
|
||||
<!------------------------------------------资产类型---------------------------------------------->
|
||||
<el-form-item label="资产类型" prop="assetType">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.assetType')" prop="assetType">
|
||||
<div class="select-style">
|
||||
<el-select v-model="assetType" clearable @change="getAllModelOptionData">
|
||||
<el-select v-model="assetType" clearable @change="getAllModelOptionData" @visible-change="cancelEdit">
|
||||
<el-option
|
||||
v-for="item in assetTypeOptionData"
|
||||
v-for="(item) in assetTypeOptionData"
|
||||
:key="item.id"
|
||||
:value="item.code"
|
||||
:label="item.value"
|
||||
>
|
||||
<span v-if="!item.isEdit">{{ item.value }}</span>
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit"
|
||||
@click.stop="editing">
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
|
||||
<el-input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'type')">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
><i
|
||||
class="el-icon-delete"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit" @click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"><i class="el-icon-delete"></i></span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="el-select-add-btn">
|
||||
@@ -77,7 +65,7 @@
|
||||
trigger="click"
|
||||
v-model="popTypeVisible"
|
||||
>
|
||||
<div class="pop-window-assetType">
|
||||
<div class="pop-window-assetType" @click="editQuit()">
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@@ -88,35 +76,29 @@
|
||||
<span>{{$t('overall.esc')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<span style="display: block;padding-bottom: 20px">资产类型</span>
|
||||
<span style="display: block;padding-bottom: 20px">新增资产类型</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.assetTypeTab.assetType')}}</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.assetTypeTab.addAssetType')}}</span>
|
||||
<input v-model="assetTypeData.value"/>
|
||||
<input type="button" value="+Add"
|
||||
@click="addNewData('assetType')"></input>
|
||||
<span style="display: block;padding-bottom: 20px">已有资产类型</span>
|
||||
<input type="button" value="+Add" @click="addNewData('assetType')"></input>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.assetTypeTab.existAssetType')}}</span>
|
||||
<div class="li-list">
|
||||
<ul style="list-style: none">
|
||||
<li style="cursor: pointer;"
|
||||
v-for="(item,index) in assetTypeOptionData"
|
||||
@click="clickState(index,item,'type',clickoutside)"
|
||||
@click="clickState(index,item,'type')"
|
||||
:class="{activeColor:modelCount === index}"
|
||||
:key="index">
|
||||
<div>
|
||||
<span v-if="!item.isEdit">{{ item.value }}</span>
|
||||
<span class="config-dropdown-label-input"
|
||||
v-if="item.isEdit"
|
||||
@click.stop="editing">
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
|
||||
<input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'type',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit" @click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('/sys/dict/delete',item.id)"><i
|
||||
class="el-icon-delete"></i>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="deleteData('/sys/dict/delete',item.id)">
|
||||
<i class="el-icon-delete"></i>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
@@ -125,23 +107,20 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-box-bottom-btns">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel"
|
||||
@click="popoverClose('type')">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel" @click="popoverClose('type')">
|
||||
{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="transferData('type')">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50" @click="transferData('type')">
|
||||
{{$t('overall.save')}}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div slot="reference" style="font-size: 18px">+</div>-->
|
||||
<div slot="reference" style="font-size: 18px">+</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!------------------------------------------厂商/型号---------------------------------------------->
|
||||
<el-form-item label="厂商/型号">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.vendor')">
|
||||
<div class="select-style">
|
||||
<el-cascader
|
||||
:options="vendorTypeOptionData"
|
||||
@@ -157,8 +136,9 @@
|
||||
trigger="click"
|
||||
v-model="popCompVisible"
|
||||
:disabled=popState
|
||||
v-clickoutside="clickOutSide"
|
||||
>
|
||||
<div class="pop-window-assetType">
|
||||
<div class="pop-window-assetType" @click="editQuit()">
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@@ -170,12 +150,12 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window-assetType">
|
||||
<span style="display: block;padding-bottom: 15px">商场/型号</span>
|
||||
<span style="display: block;padding-bottom: 20px">新厂商名称</span>
|
||||
<span style="display: block;padding-bottom: 15px">{{$t('asset.createAssetTab.vendorTab.vendor')}}</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.vendorTab.vendorName')}}</span>
|
||||
<input v-model="addVendorData.value"/>
|
||||
<input type="button" value="+Add"
|
||||
@click="addNewData('vendor')"></input>
|
||||
<span style="display: block;padding-bottom: 20px">已有厂商</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.vendorTab.existVendor')}}</span>
|
||||
<div class="li-list-part">
|
||||
<ul style="list-style: none">
|
||||
<li style="cursor: pointer;"
|
||||
@@ -185,58 +165,41 @@
|
||||
:key="index">
|
||||
<div>
|
||||
<span v-if="!item.isEdit">{{ item.value }}</span>
|
||||
<span class="config-dropdown-label-input"
|
||||
v-if="item.isEdit"
|
||||
@click.stop="editing">
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
|
||||
<input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
<span class="config-dropdown-btn" @click.stop="editVendorOptionData(item,'vendor',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('/sys/dict/delete',item.id)"><i
|
||||
class="el-icon-delete"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit" @click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="deleteData('/sys/dict/delete',item.id)"><i class="el-icon-delete"></i></span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<span style="display: block;padding-bottom: 15px">新型号名称</span>
|
||||
<span style="display: block;padding-bottom: 15px">{{$t('asset.createAssetTab.vendorTab.modelName')}}</span>
|
||||
<input v-model="addNewModelData.name"/>
|
||||
<input type="button" value="+Add"
|
||||
@click="addNewData('model')"></input>
|
||||
<span style="display: block;padding-bottom: 20px">已有型号</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.vendorTab.existModel')}}</span>
|
||||
<div class="li-list-part">
|
||||
<ul style="list-style: none">
|
||||
<li style="cursor: pointer;"
|
||||
v-for="(item,index) in modelUlData"
|
||||
@click=" clickState(index,item,'model') "
|
||||
@click="clickState(index,item,'model') "
|
||||
:class="{activeColor:modelCount === index}"
|
||||
:key="index">
|
||||
<div>
|
||||
<div>
|
||||
<span v-if="!item.isEdit">{{ item.name }}</span>
|
||||
<span class="config-dropdown-label-input"
|
||||
v-if="item.isEdit"
|
||||
@click.stop="editing">
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
|
||||
<input type="text" v-model="item.name" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'model',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('model',item)"></i>
|
||||
<!-- <i class="el-icon-check" v-if="item.isEdit"></i>-->
|
||||
<i class="el-icon-check" v-if="item.isEdit" @click="editData('model',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('model',item.id)"><i
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="deleteData('model',item.id)"><i
|
||||
class="el-icon-delete"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -258,20 +221,20 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="购买日期" prop="purchaseDate">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.purchaseDate')" prop="purchaseDate">
|
||||
<div class="select-style">
|
||||
<el-date-picker
|
||||
v-model="assetData.purchaseDate"
|
||||
value-format="yyyy-MM-dd"
|
||||
type="date"
|
||||
placeholder="选择日期">
|
||||
:placeholder="this.$t('asset.createAssetTab.dataSelectTip')">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="font-size: 10px">IDC</div>
|
||||
<div style="font-size: 10px">{{$t('asset.createAssetTab.dc')}}</div>
|
||||
<el-divider></el-divider>
|
||||
<!------------------------------------------IDC---------------------------------------------->
|
||||
<el-form-item label="DC Name" prop="idcSelect">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.dcName')" prop="idcSelect">
|
||||
<div class="select-style">
|
||||
<el-select v-model="assetData.idcId" clearable @change="getSingleIDCData">
|
||||
<el-option
|
||||
@@ -296,14 +259,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<el-form-item label="DC Name">
|
||||
<span style="display: block;padding-bottom: 20px">{{vm.$t('asset.createAssetTab.editIdcTab.title')}}</span>
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.dcName')">
|
||||
<el-input v-model="popIdcData.name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Location">
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.location')">
|
||||
<el-input v-model="popIdcData.location"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人">
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.principal')">
|
||||
<el-select v-model="popIdcData.principal" clearable>
|
||||
<el-option
|
||||
v-for="item in idcUserData"
|
||||
@@ -314,7 +277,7 @@
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Tel">
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.editIdcTab.tel')">
|
||||
<el-input v-model="popIdcData.tel"/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@@ -330,7 +293,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click.stop="getSingleIDCData(item.id,'edit')"><i
|
||||
@click.stop="getSingleIDCData(item.id,'edit',item)"><i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@@ -355,14 +318,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<el-form-item label="DC Name">
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.AddIdcTab.title')}}</span>
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddIdcTab.dcName')">
|
||||
<el-input v-model="addIdcData.name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Location">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddIdcTab.location')">
|
||||
<el-input v-model="addIdcData.location"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddIdcTab.principal')">
|
||||
<el-select v-model="addIdcData.principal" clearable>
|
||||
<el-option
|
||||
v-for="item in idcUserData"
|
||||
@@ -373,7 +336,7 @@
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="Tel">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddIdcTab.tel')">
|
||||
<el-input v-model="addIdcData.tel"/>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@@ -393,20 +356,21 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="Location">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.location')">
|
||||
<span>{{idcSelectedData.location}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.principal')">
|
||||
<span>{{this.getPrincipalName(idcSelectedData.principal)}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="Tel">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.tel')">
|
||||
<span>{{idcSelectedData.tel}}</span>
|
||||
</el-form-item>
|
||||
<el-divider></el-divider>
|
||||
<!------------------------------------------cabinet---------------------------------------------->
|
||||
<el-form-item label="机柜">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.cabinet')">
|
||||
<div class="select-style">
|
||||
<el-select v-model="assetData.cabinetId" clearable
|
||||
:disabled="assetData.idcId==''?true:false"
|
||||
@change="getSingleCabinetData">
|
||||
<el-option
|
||||
v-for="item in cabinetOptionData"
|
||||
@@ -431,22 +395,22 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<el-form-item label="Name">
|
||||
<span style="display: block;padding-bottom: 20px">{{vm.$t('asset.createAssetTab.editCabinetTab.title')}}</span>
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.editCabinetTab.title')">
|
||||
<el-input v-model="popCabinetData.name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="U Size">
|
||||
<div>{{addCabinetData.uSize}}</div>
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.editCabinetTab.uSize')">
|
||||
<div>{{popCabinetData.uSize}}</div>
|
||||
<el-slider v-model="popCabinetData.uSize"
|
||||
:max="47"></el-slider>
|
||||
</el-form-item>
|
||||
<el-form-item label="Desc">
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.editCabinetTab.remark')">
|
||||
<el-input v-model="popCabinetData.remark"
|
||||
type="textarea"
|
||||
:rows="2"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="IDC">
|
||||
<el-select v-model="addCabinetData.idcId" clearable>
|
||||
<el-form-item :label="vm.$t('asset.createAssetTab.editCabinetTab.DC')">
|
||||
<el-select v-model="popCabinetData.idcId" clearable>
|
||||
<el-option
|
||||
v-for="item in IDCOptionData"
|
||||
:key="item.key"
|
||||
@@ -507,9 +471,9 @@
|
||||
<!-- @click="getSingleIDCData(item.id,'edit')"><i-->
|
||||
<!-- class="el-icon-edit-outline"></i></span>-->
|
||||
<!-- </el-popover>-->
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('idc',item.id)"><i
|
||||
class="el-icon-delete"></i></span>
|
||||
<!-- <span class="config-dropdown-btn config-dropdown-btn-delete"-->
|
||||
<!-- @click.stop="deleteData('idc',item.id)"><i-->
|
||||
<!-- class="el-icon-delete"></i></span>-->
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -526,7 +490,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click.stop=" getSingleCabinetData(item.id,'edit',item)">
|
||||
@click.stop="getSingleCabinetData(item.id,'edit',item)">
|
||||
<i class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
|
||||
@@ -553,21 +517,21 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<el-form-item label="Name">
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.AddCabinetTab.title')}}</span>
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddCabinetTab.name')">
|
||||
<el-input v-model="addCabinetData.name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="U Size">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddCabinetTab.uSize')">
|
||||
<div>{{addCabinetData.uSize}}</div>
|
||||
<el-slider v-model="addCabinetData.uSize"
|
||||
:max="47"></el-slider>
|
||||
</el-form-item>
|
||||
<el-form-item label="Desc">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddCabinetTab.remark')">
|
||||
<el-input v-model="addCabinetData.remark"
|
||||
type="textarea"
|
||||
:rows="2"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="IDC">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.AddCabinetTab.DC')">
|
||||
<el-select v-model="addCabinetData.idcId" clearable>
|
||||
<el-option
|
||||
v-for="item in IDCOptionData"
|
||||
@@ -591,7 +555,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="pop-window">
|
||||
<span style="display: block;padding-bottom: 20px">标题</span>
|
||||
<span style="display: block;padding-bottom: 20px">{{$t('asset.createAssetTab.editIdcTab.title')}}</span>
|
||||
<el-form-item label="DC Name">
|
||||
<el-input v-model="addCabIDCData.name"/>
|
||||
</el-form-item>
|
||||
@@ -626,7 +590,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click="getSingleIDCData(item.id,'edit')"><i
|
||||
@click="getSingleIDCData(item.id,'edit',item)"><i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@@ -652,29 +616,40 @@
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="U Size">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.uSize')">
|
||||
<span>{{cabinetSelectedData.uSize}}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="Desc">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.remark')">
|
||||
<span>{{cabinetSelectedData.remark}}</span>
|
||||
</el-form-item>
|
||||
<div style="font-size: 10px">CLI Account</div>
|
||||
<div style="font-size: 10px">{{$t('asset.createAssetTab.cli')}}</div>
|
||||
<el-divider></el-divider>
|
||||
<el-form-item label="登录方式">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.loginType')">
|
||||
<el-radio-group size="mini" v-model="assetData.accounts[0].authType">
|
||||
<el-radio-button label='1'>Password</el-radio-button>
|
||||
<el-radio-button label='2'>SSH私钥</el-radio-button>
|
||||
<el-radio-button label='1'>{{$t('asset.createAssetTab.password')}}</el-radio-button>
|
||||
<el-radio-button label='2'>{{$t('asset.createAssetTab.ssh')}}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="Account">
|
||||
</el-form-item >
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.account')" label-position="top">
|
||||
<el-input v-model="assetData.accounts[0].user"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Password">
|
||||
<el-input v-model="assetData.accounts[0].pwd"/>
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.password')" v-if="assetData.accounts[0].authType==1">
|
||||
<el-input type="password" v-model="assetData.accounts[0].pwd"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Port">
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.port')">
|
||||
<el-input v-model="assetData.accounts[0].port"/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('asset.createAssetTab.ssh')" v-if="assetData.accounts[0].authType==2">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action=""
|
||||
:on-change="handleChange"
|
||||
:auto-upload="false"
|
||||
>
|
||||
<el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<div class="">
|
||||
@@ -698,7 +673,9 @@ export default {
|
||||
addUnitShow: Boolean
|
||||
},
|
||||
data() {
|
||||
const vm = window.vm;
|
||||
return {
|
||||
vm:vm,
|
||||
assetData: {
|
||||
id: '',
|
||||
sn: '',
|
||||
@@ -709,7 +686,7 @@ export default {
|
||||
cabinetId: '',
|
||||
modelId: '',
|
||||
accounts: [{
|
||||
authType: '',
|
||||
authType: 1,
|
||||
user: '',
|
||||
pwd: '',
|
||||
cert: '',
|
||||
@@ -791,14 +768,14 @@ export default {
|
||||
remark: '',
|
||||
idcId: '',
|
||||
},
|
||||
addCabIDCData:{
|
||||
addCabIDCData: {
|
||||
id: '',
|
||||
name: '',
|
||||
location: '',
|
||||
principal: '',
|
||||
tel: ''
|
||||
},
|
||||
editCabIDCData:{
|
||||
editCabIDCData: {
|
||||
id: '',
|
||||
name: '',
|
||||
location: '',
|
||||
@@ -847,11 +824,48 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
cancelEdit(data){
|
||||
if(data===false){
|
||||
this.getAssetTypeOptionData()
|
||||
}
|
||||
},
|
||||
clickOutSide(data) {
|
||||
if (data) {
|
||||
this.editQuit()
|
||||
this.modelCount = ''
|
||||
this.assetTypeData.value = ''
|
||||
this.addVendorData.value = ''
|
||||
this.addNewModelData.value = ''
|
||||
this.vendorCount = ''
|
||||
this.modelCount = ''
|
||||
}
|
||||
},
|
||||
editQuit() {
|
||||
for (let i of this.assetTypeOptionData) {
|
||||
if (i.isEdit === true) {
|
||||
i.isEdit = false
|
||||
this.getAssetTypeOptionData()
|
||||
}
|
||||
}
|
||||
for (let i of this.vendorUlData) {
|
||||
if (i.isEdit === true) {
|
||||
i.isEdit = false
|
||||
this.getVendorOptionData()
|
||||
}
|
||||
}
|
||||
for (let i of this.modelUlData) {
|
||||
if (i.isEdit === true) {
|
||||
i.isEdit = false
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
}
|
||||
}
|
||||
},
|
||||
getIDCOptionData() {
|
||||
this.$get('idc').then(response => {
|
||||
if (response.code === 200) {
|
||||
this.IDCOptionData = response.data.list;
|
||||
this.markOptionData(this.IDCOptionData)
|
||||
this.$store.state.assetData.idcData = this.IDCOptionData
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -908,26 +922,13 @@ export default {
|
||||
value: '',
|
||||
code: ''
|
||||
}
|
||||
let idcData={
|
||||
let idcData = {
|
||||
id: '',
|
||||
name: '',
|
||||
location: '',
|
||||
principal: '',
|
||||
tel: ''
|
||||
}
|
||||
if (data === 'asset') {
|
||||
this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1]
|
||||
this.$put('asset', this.assetData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.$emit('refreshData', 'true')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
if (data === 'model') {
|
||||
item.vendorCode = this.vendorCode
|
||||
item.typeCode = this.assetType
|
||||
@@ -947,7 +948,6 @@ export default {
|
||||
item.idcId = this.popCabinetData.idcId
|
||||
}
|
||||
if (data === 'idc') {
|
||||
console.log(this.popIdcData)
|
||||
idcData.id = item.id
|
||||
idcData.name = this.popIdcData.name
|
||||
idcData.location = this.popIdcData.location
|
||||
@@ -964,8 +964,8 @@ export default {
|
||||
item = idcData
|
||||
}
|
||||
this.$put(data, item).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
@@ -974,39 +974,64 @@ export default {
|
||||
this.getAllModelOptionData();
|
||||
this.getCabinetOptionData('')
|
||||
this.$emit('refreshData', 'true')
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
addNewData(type) {
|
||||
console.log(type)
|
||||
if (type === 'IDC') {
|
||||
this.$post('idc', this.addIdcData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getIDCOptionData()
|
||||
this.getAssetData()
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'assetType') {
|
||||
this.$post('sys/dict/save', this.assetTypeData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.getAssetTypeOptionData()
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'asset') {
|
||||
this.assetData.modelId = this.assetData.modelId.join(',').split(',')[1]
|
||||
let modelId = ''
|
||||
let authType = ''
|
||||
console.log(this.assetData.modelId)
|
||||
if(this.assetData.modelId !== ''){
|
||||
modelId = this.assetData.modelId.join(',').split(',')[1]
|
||||
}else{
|
||||
this.assetData.modelId=''
|
||||
}
|
||||
if(this.assetData.accounts[0].user === ''){
|
||||
authType = ''
|
||||
}else{
|
||||
authType = this.assetData.accounts[0].authType
|
||||
}
|
||||
let form = new FormData();
|
||||
form.append("sn", this.assetData.sn);
|
||||
form.append("host", this.assetData.host);
|
||||
@@ -1014,31 +1039,42 @@ export default {
|
||||
form.append("purchaseDate", this.assetData.purchaseDate);
|
||||
form.append("idcId", this.assetData.idcId);
|
||||
form.append("cabinetId", this.assetData.cabinetId);
|
||||
form.append("modelId", this.assetData.modelId);
|
||||
form.append("accounts[0].authType", this.assetData.accounts[0].authType);
|
||||
form.append("modelId", modelId);
|
||||
form.append("accounts[0].authType", authType);
|
||||
form.append("accounts[0].user", this.assetData.accounts[0].user);
|
||||
form.append("accounts[0].pwd", this.assetData.accounts[0].pwd);
|
||||
form.append("accounts[0].port", this.assetData.accounts[0].port);
|
||||
this.$post('asset', form).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.$emit('refreshData', 'true')
|
||||
this.sendStateData('close')
|
||||
}else{
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
this.$emit('refreshData', 'true')
|
||||
}
|
||||
if (type === 'vendor') {
|
||||
const h = this.$createElement;
|
||||
this.$post('sys/dict/save', this.addVendorData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getVendorOptionData()
|
||||
}else{
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -1064,7 +1100,7 @@ export default {
|
||||
})
|
||||
}
|
||||
if (type === 'cabinet') {
|
||||
if(this.assetData.idcId!=''){
|
||||
if (this.assetData.idcId != '') {
|
||||
this.addCabinetData.idcId = this.assetData.idcId
|
||||
}
|
||||
this.$post('cabinet', this.addCabinetData).then(res => {
|
||||
@@ -1111,6 +1147,7 @@ export default {
|
||||
data.forEach(item => {
|
||||
this.$set(item, 'isEdit', false);
|
||||
this.$set(item, 'oldName', item.value);
|
||||
this.$set(item, 'modelOldName', item.name);
|
||||
this.$set(item, item.name, false)
|
||||
this.$set(item, item.id, false)
|
||||
this.$set(item, item.id + item.name, false)
|
||||
@@ -1150,7 +1187,8 @@ export default {
|
||||
}
|
||||
this.vendorTypeOptionData = result
|
||||
},
|
||||
editOptionData(item) {
|
||||
editVendorOptionData(item,data,index){
|
||||
this.vendorCount = index
|
||||
if (!item.isEdit) {
|
||||
item.isEdit = true;
|
||||
} else {
|
||||
@@ -1160,12 +1198,54 @@ export default {
|
||||
item.isEdit = false;
|
||||
}
|
||||
}
|
||||
if(data==='vendor') {
|
||||
for (let i = 0; i < this.vendorUlData.length; i++) {
|
||||
const element = this.vendorUlData[i];
|
||||
if (item.id !== element.id) {
|
||||
element.isEdit = false
|
||||
element.value = element.oldName
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
editOptionData(item,data,index) {
|
||||
this.modelCount = index;
|
||||
if (!item.isEdit) {
|
||||
item.isEdit = true;
|
||||
} else {
|
||||
if (item.name !== item.oldName) {
|
||||
item.isEdit = false;
|
||||
} else {
|
||||
item.isEdit = false;
|
||||
}
|
||||
}
|
||||
if(data==='type') {
|
||||
for (let i = 0; i < this.assetTypeOptionData.length; i++) {
|
||||
const element = this.assetTypeOptionData[i];
|
||||
if (item.id !== element.id) {
|
||||
element.isEdit = false
|
||||
element.value = element.oldName
|
||||
}
|
||||
}
|
||||
}
|
||||
if(data==='model') {
|
||||
for (let i = 0; i < this.modelUlData.length; i++) {
|
||||
const element2 = this.modelUlData[i];
|
||||
if (item.id !== element2.id) {
|
||||
element2.isEdit = false
|
||||
element2.name = element2.modelOldName
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
handleChange(file) {
|
||||
this.assetData.accounts[0].file = file.raw
|
||||
},
|
||||
delOptionData(data) {
|
||||
},
|
||||
|
||||
sendStateData(data) {
|
||||
this.$emit('sendStateData', 'close')
|
||||
this.initAdd()
|
||||
},
|
||||
initAdd() {
|
||||
this.assetType = ''
|
||||
@@ -1176,15 +1256,21 @@ export default {
|
||||
this.assetData.idcId = ''
|
||||
this.assetData.cabinetId = ''
|
||||
this.assetData.modelId = ''
|
||||
this.assetData.accounts[0].authType =1
|
||||
this.assetData.accounts[0].user = ''
|
||||
this.assetData.accounts[0].pwd = ''
|
||||
this.assetData.accounts[0].port = ''
|
||||
this.assetData.accounts[0].file = ''
|
||||
this.idcSelectedData.location = ''
|
||||
this.idcSelectedData.principal = ''
|
||||
this.idcSelectedData.tel = ''
|
||||
this.cabinetSelectedData.uSize = 0
|
||||
this.cabinetSelectedData.remark = ''
|
||||
},
|
||||
editing() {
|
||||
editing(item) {
|
||||
console.log(item)
|
||||
},
|
||||
getSingleIDCData(data, item) {
|
||||
getSingleIDCData(data, item, itemData) {
|
||||
if (item !== 'edit') {
|
||||
this.idcSelectedData = '';
|
||||
this.IDCOptionData.forEach(item => {
|
||||
@@ -1197,6 +1283,7 @@ export default {
|
||||
this.cabinetSelectedData.uSize = ''
|
||||
this.cabinetSelectedData.remark = null
|
||||
} else {
|
||||
this.clickFlush('idc', itemData)
|
||||
this.IDCOptionData.forEach(item => {
|
||||
if (item.id === data) {
|
||||
this.popIdcData.name = item.name
|
||||
@@ -1222,12 +1309,15 @@ export default {
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.clickFlush('cabinet', item)
|
||||
item[item.name] = !item[item.name]
|
||||
this.cabinetOptionData.forEach(items => {
|
||||
if (items.id === data) {
|
||||
console.log(items)
|
||||
this.popCabinetData.name = items.name
|
||||
this.popCabinetData.uSize = items.uSize
|
||||
this.popCabinetData.remark = items.remark
|
||||
this.popCabinetData.idcId = items.idcId
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -1237,7 +1327,7 @@ export default {
|
||||
this.vendorCode = item.code;
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
},
|
||||
clickState(index, item, data,list) {
|
||||
clickState(index, item, data) {
|
||||
if (data === 'type') {
|
||||
this.modelCount = index;
|
||||
this.tempData = item;
|
||||
@@ -1271,9 +1361,17 @@ export default {
|
||||
}
|
||||
if (data === 'idc') {
|
||||
this.popIDCVisible = false
|
||||
this.addIdcData.name= '',
|
||||
this.addIdcData.location= '',
|
||||
this.addIdcData.principal= '',
|
||||
this.addIdcData.tel= ''
|
||||
}
|
||||
if (data === 'cabinet') {
|
||||
this.popCabinetVisible = false
|
||||
this.addCabinetData.name = ''
|
||||
this.addCabinetData.uSize = 0
|
||||
this.addCabinetData.remark = ''
|
||||
this.addCabinetData.idcId = ''
|
||||
}
|
||||
},
|
||||
editPopoverClose(data) {
|
||||
@@ -1308,7 +1406,33 @@ export default {
|
||||
} else {
|
||||
return "-";
|
||||
}
|
||||
},
|
||||
clickFlush(type, itemData) {
|
||||
if (type === 'idc') {
|
||||
for (let i = 0; i < this.IDCOptionData.length; i++) {
|
||||
const element = this.IDCOptionData[i];
|
||||
if (element.id === itemData.id) {
|
||||
setTimeout(() => {
|
||||
element[element.name] = true;
|
||||
}, 100)
|
||||
} else {
|
||||
element[element.name] = false
|
||||
}
|
||||
}
|
||||
}
|
||||
if (type === 'cabinet') {
|
||||
for (let i = 0; i < this.cabinetOptionData.length; i++) {
|
||||
const element = this.cabinetOptionData[i];
|
||||
if (element.id === itemData.id) {
|
||||
setTimeout(() => {
|
||||
element[element.name] = true;
|
||||
}, 100)
|
||||
} else {
|
||||
element[element.name] = false
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getUserData()
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<transition name="right-box">
|
||||
<div class="right-menu" v-if="editUnitShow">
|
||||
<div class="right-menu" v-if="editUnitShow" @click="editQuit">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full" @click.stop="sendStateData('close')">
|
||||
<div class="right-box-btn-icon">
|
||||
@@ -64,7 +64,7 @@
|
||||
<!------------------------------------------资产类型---------------------------------------------->
|
||||
<el-form-item label="资产类型">
|
||||
<div class="select-style">
|
||||
<el-select v-if="!tabView" v-model="assetType" clearable
|
||||
<el-select v-if="!tabView" v-model="assetType" clearable @visible-change="cancelEdit"
|
||||
@change="getAllModelOptionData()">
|
||||
<el-option
|
||||
v-for="item in assetTypeOptionData"
|
||||
@@ -78,7 +78,7 @@
|
||||
<el-input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
@click.stop="editOptionData(item,'type')">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
@@ -122,20 +122,14 @@
|
||||
:key="index">
|
||||
<div>
|
||||
<span v-if="!item.isEdit">{{ item.value }}</span>
|
||||
<span class="config-dropdown-label-input"
|
||||
v-if="item.isEdit"
|
||||
@click.stop="editing">
|
||||
<span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="editing">
|
||||
<input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item,index)">
|
||||
<span class="config-dropdown-btn" @click.stop="editOptionData(item,'type',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit" @click="editData('sys/dict/update',item)"></i>
|
||||
</span>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('/sys/dict/delete',item.id)"><i
|
||||
class="el-icon-delete"></i>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="deleteData('/sys/dict/delete',item.id)"><i class="el-icon-delete"></i>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
@@ -210,7 +204,7 @@
|
||||
<input type="text" v-model="item.value" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
@click.stop="editVendorOptionData(item,'vendor',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('sys/dict/update',item)"></i>
|
||||
@@ -243,7 +237,7 @@
|
||||
<input type="text" v-model="item.name" size="mini"/>
|
||||
</span>
|
||||
<span class="config-dropdown-btn"
|
||||
@click.stop="editOptionData(item)">
|
||||
@click.stop="editOptionData(item,'model',index)">
|
||||
<i class="el-icon-edit-outline" v-if="!item.isEdit"></i>
|
||||
<i class="el-icon-check" v-if="item.isEdit"
|
||||
@click="editData('model',item)"></i>
|
||||
@@ -286,7 +280,7 @@
|
||||
</div>
|
||||
<span v-if="tabView">{{assetData.purchaseDate}}</span>
|
||||
</el-form-item>
|
||||
<div style="font-size: 10px">IDC</div>
|
||||
<div style="font-size: 10px">DC</div>
|
||||
<el-divider></el-divider>
|
||||
<!------------------------------------------IDC---------------------------------------------->
|
||||
<el-form-item label="DC Name">
|
||||
@@ -302,6 +296,7 @@
|
||||
<el-popover
|
||||
placement="left"
|
||||
v-model="item[item.name]"
|
||||
trigger="manual"
|
||||
>
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
@@ -348,7 +343,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click.stop="getSingleIDCData(item.id,'edit')"><i
|
||||
@click.stop="getSingleIDCData(item.id,'edit',item)"><i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@@ -359,7 +354,6 @@
|
||||
<div class="el-select-add-btn">
|
||||
<el-popover
|
||||
placement="left"
|
||||
trigger="click"
|
||||
v-model="editPopIDCVisible"
|
||||
>
|
||||
<div class="pop-window-assetType-content">
|
||||
@@ -428,10 +422,11 @@
|
||||
<el-form-item label="机柜">
|
||||
<div class="select-style" v-if="!tabView">
|
||||
<el-select clearable v-model="assetData.cabinetId" clearable
|
||||
:disabled="assetData.idcId==''?true:false"
|
||||
@change="getSingleCabinetData">
|
||||
<el-option
|
||||
v-for="item in cabinetOptionData"
|
||||
:key="item.key"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
>
|
||||
@@ -466,23 +461,23 @@
|
||||
type="textarea"
|
||||
:rows="2"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="IDC">
|
||||
<el-form-item label="DC">
|
||||
<el-select v-model="popCabinetData.idcId" clearable>
|
||||
<el-option
|
||||
v-for="item in IDCOptionData"
|
||||
:key="item.key"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
v-for="ite in item.children"
|
||||
:key="ite.id"
|
||||
:label="ite.name"
|
||||
:value="ite.id"
|
||||
>
|
||||
<span>{{ item.name }}</span>
|
||||
<span>{{ ite.name }}</span>
|
||||
<el-popover
|
||||
placement="top"
|
||||
v-model="item[item.name+item.id]"
|
||||
placement="left"
|
||||
v-model="ite[ite.name+ite.id]"
|
||||
>
|
||||
<div class="pop-window-assetType-content">
|
||||
<div class="right-box-top-btns">
|
||||
<div class="right-box-top-btn right-box-top-btn-full"
|
||||
@click="item[item.name+item.id] = false">
|
||||
@click="ite[ite.name+ite.id] = false">
|
||||
<div class="right-box-btn-icon">
|
||||
<i class="el-icon-close"></i>
|
||||
</div>
|
||||
@@ -516,20 +511,20 @@
|
||||
</div>
|
||||
<div class="right-box-bottom-btns">
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-cancel"
|
||||
@click.stop="item[item.name+item.id]= false">
|
||||
@click="ite[ite.name+ite.id]= false">
|
||||
{{$t('overall.cancel')}}
|
||||
</div>
|
||||
<div class="right-box-bottom-btn right-box-bottom-btn-50"
|
||||
@click="editData('idc',item,'CabIDC')">
|
||||
@click="editData('idc',ite,'CabIDC')">
|
||||
{{$t('overall.save')}}
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click="getSingleIDCData(item.id,'edit')"><i
|
||||
@click="getSingleIDCData(ite.id,'edit',ite)">11<i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@click.stop="deleteData('idc',item.id)"><i
|
||||
@click.stop="deleteData('idc',ite.id)"><i
|
||||
class="el-icon-delete"></i></span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
@@ -547,7 +542,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click.stop=" getSingleCabinetData(item.id,'edit',item)">
|
||||
@click.stop="getSingleCabinetData(item.id,'edit',item)">
|
||||
<i class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
|
||||
@@ -646,7 +641,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<span class="config-dropdown-btn" slot="reference"
|
||||
@click="getSingleIDCData(item.id,'edit')"><i
|
||||
@click="getSingleIDCData(item.id,'edit',item)"><i
|
||||
class="el-icon-edit-outline"></i></span>
|
||||
</el-popover>
|
||||
<span class="config-dropdown-btn config-dropdown-btn-delete"
|
||||
@@ -690,12 +685,23 @@
|
||||
<el-form-item label="Account">
|
||||
<el-input v-model="assetData.accounts[0].user"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Password">
|
||||
<el-input v-model="assetData.accounts[0].pwd"/>
|
||||
<el-form-item label="pwd" v-if="assetData.accounts[0].authType==1">
|
||||
<el-input type="password" v-model="assetData.accounts[0].pwd"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="Port">
|
||||
<el-input v-model="assetData.accounts[0].port"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="ssh秘钥" v-if="assetData.accounts[0].authType==2">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action=""
|
||||
:on-change="handleChange"
|
||||
:auto-upload="false"
|
||||
>
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<div class="">
|
||||
@@ -730,11 +736,13 @@ export default {
|
||||
cabinetId: '',
|
||||
modelId: '',
|
||||
accounts: [{
|
||||
id: '',
|
||||
authType: '',
|
||||
user: '',
|
||||
pwd: '',
|
||||
cert: '',
|
||||
port: '',
|
||||
file: ''
|
||||
}]
|
||||
},
|
||||
accountData: '',
|
||||
@@ -887,6 +895,11 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
cancelEdit(data){
|
||||
if(data===false){
|
||||
this.getAssetTypeOptionData()
|
||||
}
|
||||
},
|
||||
clickOutSide(data) {
|
||||
if (data) {
|
||||
this.editQuit()
|
||||
@@ -935,14 +948,17 @@ export default {
|
||||
this.assetData.idcId = response.data.list[0].idc.id
|
||||
this.assetData.cabinetId = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.id
|
||||
this.assetData.purchaseDate = response.data.list[0].purchaseDate
|
||||
this.assetData.accounts[0].id = response.data.list[0].accounts[0].id
|
||||
this.assetData.accounts[0].authType = response.data.list[0].accounts[0].authType
|
||||
this.assetData.accounts[0].user = response.data.list[0].accounts[0].user
|
||||
this.assetData.accounts[0].pwd = response.data.list[0].accounts[0].pwd
|
||||
this.assetData.accounts[0].port = response.data.list[0].accounts[0].port
|
||||
this.idcSelectedData.location = response.data.list[0].idc.location
|
||||
this.idcSelectedData.principal = response.data.list[0].idc.principal
|
||||
this.idcSelectedData.tel = response.data.list[0].idc.tel
|
||||
this.cabinetSelectedData.uSize = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.uSize
|
||||
this.cabinetSelectedData.remark = response.data.list[0].cabinet == null ? '' : response.data.list[0].cabinet.remark
|
||||
this.getAllModelOptionData(this.assetType)
|
||||
console.log(this.pageObj.id)
|
||||
this.getAccountData(this.pageObj.id)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -952,6 +968,7 @@ export default {
|
||||
if (response.code === 200) {
|
||||
this.checkListData = this.IDCOptionData = response.data.list;
|
||||
this.markOptionData(this.IDCOptionData)
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -967,6 +984,10 @@ export default {
|
||||
if (response.code === 200) {
|
||||
this.cabinetOptionData = response.data.list;
|
||||
this.markOptionData(this.cabinetOptionData)
|
||||
for (let i = 0; i < this.cabinetOptionData.length; i++) {
|
||||
this.$set(this.cabinetOptionData[i], 'children', this.IDCOptionData)
|
||||
}
|
||||
console.log(this.cabinetOptionData)
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -1001,14 +1022,6 @@ export default {
|
||||
}
|
||||
})
|
||||
},
|
||||
getAccountData(data) {
|
||||
this.$get('account?assetId=' + data).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.accountData = response.data.list
|
||||
console.log(this.accountData)
|
||||
}
|
||||
})
|
||||
},
|
||||
editData(data, item, mark) {
|
||||
let obj = {
|
||||
id: '',
|
||||
@@ -1034,19 +1047,26 @@ export default {
|
||||
form.append("idcId", this.assetData.idcId);
|
||||
form.append("cabinetId", this.assetData.cabinetId);
|
||||
form.append("modelId", this.assetData.modelId);
|
||||
form.append("accounts[0].id", this.assetData.accounts[0].id);
|
||||
form.append("accounts[0].authType", this.assetData.accounts[0].authType);
|
||||
form.append("accounts[0].user", this.assetData.accounts[0].user);
|
||||
form.append("accounts[0].pwd", this.assetData.accounts[0].pwd);
|
||||
form.append("accounts[0].port", this.assetData.accounts[0].port);
|
||||
form.append("cert", this.assetData.accounts[0].file);
|
||||
this.$put('asset', form).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.pageObj.id = ''
|
||||
this.$emit('refreshData', 'true')
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
} else {
|
||||
@@ -1087,8 +1107,8 @@ export default {
|
||||
item = idcData
|
||||
}
|
||||
this.$put(data, item).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '修改成功'),
|
||||
duration: 2000
|
||||
@@ -1097,13 +1117,18 @@ export default {
|
||||
this.getCabinetOptionData('')
|
||||
this.getAllModelOptionData();
|
||||
this.$emit('refreshData', 'true')
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
addNewData(type) {
|
||||
if (type === 'IDC') {
|
||||
console.log(this.addIdcData)
|
||||
const h = this.$createElement;
|
||||
this.$post('idc', this.addIdcData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
@@ -1113,30 +1138,45 @@ export default {
|
||||
});
|
||||
this.getIDCOptionData()
|
||||
this.getAssetData()
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'assetType') {
|
||||
this.$post('sys/dict/save', this.assetTypeData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.getAssetTypeOptionData()
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
if (type === 'vendor') {
|
||||
const h = this.$createElement;
|
||||
this.$post('sys/dict/save', this.addVendorData).then(res => {
|
||||
if (res.code === 200) {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getVendorOptionData()
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -1144,16 +1184,15 @@ export default {
|
||||
this.addNewModelData.typeCode = this.assetType
|
||||
this.addNewModelData.vendorCode = this.vendorCode
|
||||
this.$post('model', this.addNewModelData).then(res => {
|
||||
const h = this.$createElement;
|
||||
if (res.code === 200) {
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, '添加成功'),
|
||||
duration: 2000
|
||||
});
|
||||
this.getAllModelOptionData(this.assetType)
|
||||
} else {
|
||||
const h = this.$createElement;
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
duration: 2000
|
||||
@@ -1171,7 +1210,6 @@ export default {
|
||||
duration: 2000
|
||||
});
|
||||
this.getCabinetOptionData(this.addCabinetData.idcId)
|
||||
this.popoverClose('cabinet')
|
||||
} else {
|
||||
this.$notify({
|
||||
message: h('i', {style: 'color: teal'}, res.msg),
|
||||
@@ -1207,6 +1245,7 @@ export default {
|
||||
data.forEach(item => {
|
||||
this.$set(item, 'isEdit', false);
|
||||
this.$set(item, 'oldName', item.value);
|
||||
this.$set(item, 'modelOldName', item.name);
|
||||
this.$set(item, item.name, false)
|
||||
this.$set(item, item.id, false)
|
||||
this.$set(item, item.id + item.name, false)
|
||||
@@ -1246,8 +1285,28 @@ export default {
|
||||
}
|
||||
this.vendorTypeOptionData = result
|
||||
},
|
||||
editOptionData(item, index) {
|
||||
console.log(index)
|
||||
editVendorOptionData(item,data,index){
|
||||
this.vendorCount = index
|
||||
if (!item.isEdit) {
|
||||
item.isEdit = true;
|
||||
} else {
|
||||
if (item.name !== item.oldName) {
|
||||
item.isEdit = false;
|
||||
} else {
|
||||
item.isEdit = false;
|
||||
}
|
||||
}
|
||||
if(data==='vendor') {
|
||||
for (let i = 0; i < this.vendorUlData.length; i++) {
|
||||
const element = this.vendorUlData[i];
|
||||
if (item.id !== element.id) {
|
||||
element.isEdit = false
|
||||
element.value = element.oldName
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
editOptionData(item,data,index) {
|
||||
this.modelCount = index;
|
||||
if (!item.isEdit) {
|
||||
item.isEdit = true;
|
||||
@@ -1258,6 +1317,24 @@ export default {
|
||||
item.isEdit = false;
|
||||
}
|
||||
}
|
||||
if(data==='type') {
|
||||
for (let i = 0; i < this.assetTypeOptionData.length; i++) {
|
||||
let element = this.assetTypeOptionData[i];
|
||||
if (item.id !== element.id) {
|
||||
element.isEdit = false
|
||||
element.value = element.oldName
|
||||
}
|
||||
}
|
||||
}
|
||||
if(data==='model') {
|
||||
for (let i = 0; i < this.modelUlData.length; i++) {
|
||||
let element = this.modelUlData[i];
|
||||
if (item.id !== element.id) {
|
||||
element.isEdit = false
|
||||
element.value = element.modelOldName
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
delOptionData(data) {
|
||||
},
|
||||
@@ -1268,7 +1345,7 @@ export default {
|
||||
},
|
||||
editing() {
|
||||
},
|
||||
getSingleIDCData(data, item) {
|
||||
getSingleIDCData(data, item, itemData) {
|
||||
if (item !== 'edit') {
|
||||
this.idcSelectedData = '';
|
||||
this.IDCOptionData.forEach(item => {
|
||||
@@ -1281,6 +1358,7 @@ export default {
|
||||
this.cabinetSelectedData.uSize = ''
|
||||
this.cabinetSelectedData.remark = null
|
||||
} else {
|
||||
this.clickFlush('idc', itemData)
|
||||
this.IDCOptionData.forEach(item => {
|
||||
if (item.id === data) {
|
||||
this.popIdcData.name = item.name
|
||||
@@ -1306,14 +1384,17 @@ export default {
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.clickFlush('cabinet', item)
|
||||
item[item.name] = !item[item.name]
|
||||
this.cabinetOptionData.forEach(items => {
|
||||
if (items.id === data) {
|
||||
this.popCabinetData.name = items.name
|
||||
this.popCabinetData.uSize = items.uSize
|
||||
this.popCabinetData.remark = items.remark
|
||||
|
||||
}
|
||||
})
|
||||
console.log(this.cabinetOptionData)
|
||||
}
|
||||
},
|
||||
getSingleAsset(data) {
|
||||
@@ -1324,19 +1405,16 @@ export default {
|
||||
this.vendorCount = index;
|
||||
this.vendorCode = item.code;
|
||||
this.getModelOptionData(this.assetType, this.vendorCode)
|
||||
}
|
||||
,
|
||||
},
|
||||
pageNo(val) {
|
||||
this.pageObj.pageNo = val;
|
||||
this.getAssetData()
|
||||
}
|
||||
,
|
||||
},
|
||||
pageSize(val) {
|
||||
this.pageObj.pageSize = val;
|
||||
this.getAssetData()
|
||||
},
|
||||
clickState(index, item, data) {
|
||||
console.log(index, item)
|
||||
if (data === 'type') {
|
||||
this.modelCount = index;
|
||||
this.tempData = item;
|
||||
@@ -1358,22 +1436,8 @@ export default {
|
||||
this.tempData = ''
|
||||
}
|
||||
},
|
||||
popoverClose(data) {
|
||||
if (data === 'type') {
|
||||
this.modelCount = ''
|
||||
this.popTypeVisible = false
|
||||
}
|
||||
if (data === 'vendor') {
|
||||
this.popCompVisible = false;
|
||||
this.modelUlData = '';
|
||||
this.vendorCount = ''
|
||||
}
|
||||
if (data === 'idc') {
|
||||
this.popIDCVisible = false
|
||||
}
|
||||
if (data === 'cabinet') {
|
||||
this.popCabinetVisible = false
|
||||
}
|
||||
handleChange(file) {
|
||||
this.assetData.accounts[0].file = file.raw
|
||||
},
|
||||
editPopoverClose(data) {
|
||||
if (data === 'type') {
|
||||
@@ -1414,9 +1478,34 @@ export default {
|
||||
flushData() {
|
||||
this.getAssetData();
|
||||
},
|
||||
clickFlush(type, itemData) {
|
||||
if (type === 'idc') {
|
||||
for (let i = 0; i < this.IDCOptionData.length; i++) {
|
||||
const element = this.IDCOptionData[i];
|
||||
if (element.id === itemData.id) {
|
||||
setTimeout(() => {
|
||||
element[element.name] = true;
|
||||
}, 100)
|
||||
} else {
|
||||
element[element.name] = false
|
||||
}
|
||||
}
|
||||
}
|
||||
if (type === 'cabinet') {
|
||||
for (let i = 0; i < this.cabinetOptionData.length; i++) {
|
||||
const element = this.cabinetOptionData[i];
|
||||
if (element.id === itemData.id) {
|
||||
setTimeout(() => {
|
||||
element[element.name] = true;
|
||||
}, 100)
|
||||
} else {
|
||||
element[element.name] = false
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getCabinetOptionData('')
|
||||
this.getUserData()
|
||||
this.getIDCOptionData();
|
||||
this.getVendorOptionData();
|
||||
|
||||
180
nezha-fronted/src/components/page/asset/cloneChat.vue
Normal file
180
nezha-fronted/src/components/page/asset/cloneChat.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<div class="submenu">
|
||||
<el-menu class="el-menu-demo" mode="horizontal">
|
||||
<el-submenu index="1">
|
||||
<template slot="title">操作</template>
|
||||
<el-menu-item index="1-1">
|
||||
<template>
|
||||
<span @click="cloneChat">克隆会话</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="1-2">
|
||||
<template>
|
||||
<span @click="dialogVisible = true">上传文件</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</el-submenu>
|
||||
<el-submenu index="2">
|
||||
<template slot="title">打开</template>
|
||||
<template v-for="(item, index) in enableAsset">
|
||||
<el-menu-item :index="'2-' + index" @click="createCli(item)">{{item.host}}</el-menu-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="title-input">
|
||||
<input style="height: 20px;width: 250px"></input>
|
||||
<button>发送</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
width="30%"
|
||||
:modal="true">
|
||||
<label>文件路径</label>
|
||||
<el-input v-model="uploadFile.path"></el-input>
|
||||
<div style="padding-top: 20px">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action=""
|
||||
:on-change="handleChange"
|
||||
:auto-upload="false"
|
||||
>
|
||||
<el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
|
||||
</el-upload>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="upload">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<my-terminal :terminal="terminal" :token="token"></my-terminal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Console from './Console'
|
||||
export default {
|
||||
name: 'cloneChat',
|
||||
components: {
|
||||
'my-terminal': Console
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
terminal: {
|
||||
pid: 1,
|
||||
name: 'terminal',
|
||||
cols: 400,
|
||||
rows: 400
|
||||
},
|
||||
obj:{
|
||||
id:''
|
||||
},
|
||||
uploadFile: {
|
||||
file: '',
|
||||
path: '',
|
||||
token: ''
|
||||
},
|
||||
pageObj: {
|
||||
pageNo: 1,
|
||||
pageSize: 100,
|
||||
},
|
||||
enableAsset:'',
|
||||
host:'',
|
||||
token:'',
|
||||
routeData: this.$route.query,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
methods: {
|
||||
createCli(item){
|
||||
let routeData = this.$router.resolve({
|
||||
name: "newChat",
|
||||
query: {
|
||||
host: item.host,
|
||||
accountId:item.accounts[0].id
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
cloneChat(){
|
||||
let routeData = this.$router.resolve({
|
||||
name: "cloneChat",
|
||||
query: {
|
||||
host:this.routeData.host,
|
||||
accountId:this.routeData.accountId
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
getConnect(id,token) {
|
||||
this.$get('account/reopen.do?id='+id+"&token="+token).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.token = res.data.token
|
||||
console.log(this.token)
|
||||
sessionStorage.setItem("cliToken", this.token);
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(file) {
|
||||
this.uploadFile.file = file.raw
|
||||
},
|
||||
upload() {
|
||||
this.uploadFile.token = this.token
|
||||
let form = new FormData();
|
||||
form.append("token", this.token);
|
||||
form.append("file", this.uploadFile.file);
|
||||
form.append("path", this.uploadFile.path);
|
||||
this.$post('account/upload.do', form).then(res => {
|
||||
if (res.code === 200) {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAssetData() {
|
||||
this.$get('asset', this.pageObj).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.assetData = response.data.list;
|
||||
this.enableAsset = this.assetData.filter(item => {
|
||||
return item.accounts.length > 0
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (this.routeData) {
|
||||
this.host = this.routeData.host
|
||||
document.title = this.host
|
||||
}
|
||||
this.getAssetData()
|
||||
if(sessionStorage.getItem('cliToken')){
|
||||
console.log(this.routeData.accountId,sessionStorage.getItem('cliToken'))
|
||||
this.getConnect(this.routeData.accountId,sessionStorage.getItem('cliToken'))
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.title{
|
||||
display: inline-block;
|
||||
}
|
||||
.submenu {
|
||||
float: left;
|
||||
width: 500px;
|
||||
font-size: 22px;
|
||||
|
||||
}
|
||||
.title-input{
|
||||
position: absolute;
|
||||
left: 300px;
|
||||
top:19px
|
||||
}
|
||||
</style>
|
||||
177
nezha-fronted/src/components/page/asset/newChat.vue
Normal file
177
nezha-fronted/src/components/page/asset/newChat.vue
Normal file
@@ -0,0 +1,177 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="title">
|
||||
<div class="submenu">
|
||||
<el-menu class="el-menu-demo" mode="horizontal">
|
||||
<el-submenu index="1">
|
||||
<template slot="title">操作</template>
|
||||
<el-menu-item index="1-1">
|
||||
<template>
|
||||
<span @click="cloneChat">克隆会话</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="1-2">
|
||||
<template>
|
||||
<span @click="dialogVisible = true">上传文件</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</el-submenu>
|
||||
<el-submenu index="2">
|
||||
<template slot="title">打开</template>
|
||||
<template v-for="(item, index) in enableAsset">
|
||||
<el-menu-item :index="'2-' + index" @click="createCli(item)">{{item.host}}</el-menu-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="title-input">
|
||||
<input style="height: 20px;width: 250px"></input>
|
||||
<button>发送</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
:visible="dialogVisible"
|
||||
width="30%"
|
||||
:modal="true">
|
||||
<label>文件路径</label>
|
||||
<el-input v-model="uploadFile.path"></el-input>
|
||||
<div style="padding-top: 20px">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action=""
|
||||
:on-change="handleChange"
|
||||
:auto-upload="false"
|
||||
>
|
||||
<el-button size="small" type="primary">{{$t('asset.createAssetTab.clickToUpload')}}</el-button>
|
||||
</el-upload>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="upload">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<my-terminal :terminal="terminal" :token="token"></my-terminal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Console from './Console'
|
||||
export default {
|
||||
name: 'cloneChat',
|
||||
components: {
|
||||
'my-terminal': Console
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
terminal: {
|
||||
pid: 1,
|
||||
name: 'terminal',
|
||||
cols: 400,
|
||||
rows: 400
|
||||
},
|
||||
obj:{
|
||||
id:''
|
||||
},
|
||||
uploadFile: {
|
||||
file: '',
|
||||
path: '',
|
||||
token: ''
|
||||
},
|
||||
pageObj: {
|
||||
pageNo: 1,
|
||||
pageSize: 100,
|
||||
},
|
||||
enableAsset:'',
|
||||
host:'',
|
||||
token:'',
|
||||
routeData: this.$route.query,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
methods: {
|
||||
createCli(item){
|
||||
let routeData = this.$router.resolve({
|
||||
name: "newChat",
|
||||
query: {
|
||||
host: item.host,
|
||||
accountId:item.accounts[0].id
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
cloneChat(){
|
||||
let routeData = this.$router.resolve({
|
||||
name: "cloneChat",
|
||||
query: {
|
||||
host:this.routeData.host,
|
||||
accountId:this.routeData.accountId
|
||||
}
|
||||
});
|
||||
window.open(routeData.href);
|
||||
},
|
||||
getToken(data) {
|
||||
this.obj.id = data
|
||||
this.$post('account/ssh.do', this.obj).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.token = res.data.token
|
||||
sessionStorage.setItem('cliToken', this.token)
|
||||
}
|
||||
})
|
||||
},
|
||||
getAssetData() {
|
||||
this.$get('asset', this.pageObj).then(response => {
|
||||
if (response.code === 200) {
|
||||
this.assetData = response.data.list;
|
||||
this.enableAsset = this.assetData.filter(item=>{
|
||||
return item.accounts.length>0
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
upload() {
|
||||
this.uploadFile.token = this.token
|
||||
let form = new FormData();
|
||||
form.append("token", this.token);
|
||||
form.append("file", this.uploadFile.file);
|
||||
form.append("path", this.uploadFile.path);
|
||||
this.$post('account/upload.do', form).then(res => {
|
||||
if (res.code === 200) {
|
||||
console.log(res)
|
||||
}
|
||||
})
|
||||
},
|
||||
handleChange(file) {
|
||||
this.uploadFile.file = file.raw
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (this.routeData) {
|
||||
this.host = this.routeData.host
|
||||
document.title = this.host
|
||||
this.getToken(this.routeData.accountId)
|
||||
}
|
||||
this.getAssetData()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.title{
|
||||
display: inline-block;
|
||||
}
|
||||
.submenu {
|
||||
float: left;
|
||||
width: 500px;
|
||||
font-size: 22px;
|
||||
|
||||
}
|
||||
.title-input{
|
||||
position: absolute;
|
||||
left: 300px;
|
||||
top:19px
|
||||
}
|
||||
</style>
|
||||
@@ -1,7 +1,7 @@
|
||||
import "./assets/css/main.css";
|
||||
import 'element-ui/lib/theme-chalk/index.css';
|
||||
import ElementUI from 'element-ui';
|
||||
|
||||
import 'xterm/dist/xterm.css'
|
||||
import i18n from './components/common/i18n'
|
||||
|
||||
import Vue from 'vue'
|
||||
@@ -79,7 +79,7 @@ Vue.directive('clickoutside',
|
||||
)
|
||||
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
window.vm = new Vue({
|
||||
el: '#app',
|
||||
router,
|
||||
i18n,
|
||||
@@ -88,7 +88,7 @@ new Vue({
|
||||
template: '<App/>'
|
||||
})
|
||||
|
||||
|
||||
export default vm
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (to.path === '/login') {
|
||||
next()
|
||||
|
||||
@@ -13,6 +13,21 @@ export default new Router({
|
||||
path: '/login',
|
||||
component: resolve => require(['../components/common/login.vue'], resolve),
|
||||
},
|
||||
{
|
||||
path: '/terminal',
|
||||
name: "terminal",
|
||||
component: resolve => require(['../components/page/asset/WebSSH.vue'], resolve),
|
||||
},
|
||||
{
|
||||
path: '/cloneChat',
|
||||
name: "cloneChat",
|
||||
component: resolve => require(['../components/page/asset/cloneChat.vue'], resolve),
|
||||
},
|
||||
{
|
||||
path: '/newChat',
|
||||
name: "newChat",
|
||||
component: resolve => require(['../components/page/asset/newChat.vue'], resolve),
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
component: resolve => require(['../components/common/home.vue'], resolve),
|
||||
|
||||
@@ -7,6 +7,7 @@ const store = new Vuex.Store({
|
||||
assetData:{
|
||||
selectedData:'',
|
||||
moduleData:'',
|
||||
idcData:''
|
||||
},
|
||||
currentProject: {
|
||||
id: '',
|
||||
@@ -18,6 +19,7 @@ const store = new Vuex.Store({
|
||||
createModule: false,
|
||||
createEndpoint: false,
|
||||
createAlertConfig: false,
|
||||
flushDataSign:false
|
||||
},
|
||||
getters: {
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user