etan39
/
cloudstack
mirror of https://github.com/apache/cloudstack.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Move actions buttons to title bar 

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
This commit is contained in:
Ritchie Vincent 2020-01-14 09:36:39 +00:00 committed by Rohit Yadav
parent 7155435987
commit 5a43d49fac
1 changed files with 72 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
ui/src/views/compute/InstanceHardware.vue
View File

@ -110,19 +110,67 @@
</div>
<div slot="title" class="title">
<router-link :to="{ path: '/guestnetwork/' + item.networkid }">{{ item.networkname }} </router-link>
<div class="tags">
<a-tag v-if="item.isdefault">
{{ $t('default') }}
</a-tag>
<a-tag v-if="item.type">
{{ item.type }}
</a-tag>
<a-tag v-if="item.broadcasturi">
{{ item.broadcasturi }}
</a-tag>
<a-tag v-if="item.isolationuri">
{{ item.isolationuri }}
</a-tag>
<div class="title__details">
<div class="actions">
<a-popconfirm
title="Please confirm that you would like to make this NIC the default for this VM."
@confirm="setAsDefault(item)"
okText="Yes"
cancelText="No"
>
<a-button
icon="arrow-right"
size="small"
shape="round" />
</a-popconfirm>
<a-tooltip placement="right" v-if="item.type !== 'L2'">
<template slot="title">
{{ "Change IP Address" }}
</template>
<a-button
icon="swap"
size="small"
shape="round"
@click="editIpAddressNic = item.id; showUpdateIpModal = true" />
</a-tooltip>
<a-tooltip placement="right" v-if="item.type !== 'L2'">
<template slot="title">
{{ "Manage Secondary IP Addresses" }}
</template>
<a-button
icon="environment"
size="small"
shape="round"
@click="fetchSecondaryIPs(item.id)" />
</a-tooltip>
<a-popconfirm
:title="$t('message.network.removeNIC')"
@confirm="removeNIC(item)"
okText="Yes"
cancelText="No"
v-if="!item.isdefault"
>
<a-button
type="danger"
icon="delete"
size="small"
shape="round" />
</a-popconfirm>
</div>
<div class="tags">
<a-tag v-if="item.isdefault">
{{ $t('default') }}
</a-tag>
<a-tag v-if="item.type">
{{ item.type }}
</a-tag>
<a-tag v-if="item.broadcasturi">
{{ item.broadcasturi }}
</a-tag>
<a-tag v-if="item.isolationuri">
{{ item.isolationuri }}
</a-tag>
</div>
</div>
</div>
</a-list-item-meta>
@ -153,52 +201,6 @@
<div><a-icon type="barcode"/> {{ item.id }}</div>
</div>
</div>
<div slot="actions" class="actions">
<a-popconfirm
title="Please confirm that you would like to make this NIC the default for this VM."
@confirm="setAsDefault(item)"
okText="Yes"
cancelText="No"
>
<a-button
icon="arrow-right"
size="small"
shape="round" />
</a-popconfirm>
<a-tooltip placement="right" v-if="item.type !== 'L2'">
<template slot="title">
{{ "Change IP Address" }}
</template>
<a-button
icon="swap"
size="small"
shape="round"
@click="editIpAddressNic = item.id; showUpdateIpModal = true" />
</a-tooltip>
<a-tooltip placement="right" v-if="item.type !== 'L2'">
<template slot="title">
{{ "Manage Secondary IP Addresses" }}
</template>
<a-button
icon="environment"
size="small"
shape="round"
@click="fetchSecondaryIPs(item.id)" />
</a-tooltip>
<a-popconfirm
:title="$t('message.network.removeNIC')"
@confirm="removeNIC(item)"
okText="Yes"
cancelText="No"
v-if="!item.isdefault"
>
<a-button
type="danger"
icon="delete"
size="small"
shape="round" />
</a-popconfirm>
</div>
</a-list-item>
</a-list>
</a-collapse-panel>
@ -662,10 +664,13 @@ export default {
.actions {
display: flex;
flex-wrap: wrap;
button {
padding: 5px;
height: auto;
margin-bottom: 10px;
align-self: flex-start;
&:not(:last-child) {
margin-right: 10px;
@ -703,6 +708,14 @@ export default {
margin-bottom: 10px;
}
&__details {
display: flex;
}
.tags {
margin-left: 10px;
}
}
.ant-list-item-meta-title {