apache/cloudstack
1
0
Fork 0
mirror of https://github.com/apache/cloudstack.git synced 2025-10-26 08:42:29 +01:00
Code Issues Packages Projects Releases Wiki Activity

package: upgrade dependencies and fix buttons issues

Browse Source 
- Upgrades dependencies, esp the antd-vue
- Fix issues in button after upgrade

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
This commit is contained in:
Rohit Yadav 2020-05-28 05:54:05 +05:30
parent 53e26b484b
commit 260f52945e
20 changed files with 5051 additions and 3937 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/README.md
View File

@ -17,9 +17,9 @@ Install node: (CentOS/Fedora/RHEL)
curl -sL https://rpm.nodesource.com/setup_12.x | sudo bash - curl -sL https://rpm.nodesource.com/setup_12.x | sudo bash -
sudo yum install nodejs sudo yum install nodejs
For development, install tools and dependencies system-wide: Optionally, you may also install system-wide dev tools:
sudo npm install -g @vue/cli webpack eslint npm-check-updates sudo npm install -g @vue/cli npm-check-updates
## Development ## Development

8840
ui/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

48
ui/package.json
View File

@ -32,54 +32,54 @@
"test:unit": "vue-cli-service test:unit" "test:unit": "vue-cli-service test:unit"
}, },
"dependencies": { "dependencies": {
"@antv/data-set": "^0.11.1", "@antv/data-set": "^0.11.4",
"@fortawesome/fontawesome-svg-core": "^1.2.27", "@fortawesome/fontawesome-svg-core": "^1.2.28",
"@fortawesome/free-brands-svg-icons": "^5.12.1", "@fortawesome/free-brands-svg-icons": "^5.13.0",
"@fortawesome/free-regular-svg-icons": "^5.12.1", "@fortawesome/free-regular-svg-icons": "^5.13.0",
"@fortawesome/free-solid-svg-icons": "^5.12.1", "@fortawesome/free-solid-svg-icons": "^5.13.0",
"@fortawesome/vue-fontawesome": "^0.1.9", "@fortawesome/vue-fontawesome": "^0.1.9",
"ant-design-vue": "~1.4.12", "ant-design-vue": "~1.6.1",
"axios": "^0.19.2", "axios": "^0.19.2",
"core-js": "^3.6.4", "core-js": "^3.6.5",
"enquire.js": "^2.1.6", "enquire.js": "^2.1.6",
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lodash": "^4.17.15", "lodash": "^4.17.15",
"md5": "^2.2.1", "md5": "^2.2.1",
"moment": "^2.24.0", "moment": "^2.26.0",
"node-emoji": "^1.10.0", "node-emoji": "^1.10.0",
"npm-check-updates": "^4.0.3", "npm-check-updates": "^6.0.1",
"nprogress": "^0.2.0", "nprogress": "^0.2.0",
"viser-vue": "^2.4.8", "viser-vue": "^2.4.8",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-clipboard2": "^0.3.1", "vue-clipboard2": "^0.3.1",
"vue-cropper": "0.5.0", "vue-cropper": "0.5.2",
"vue-i18n": "^8.15.4", "vue-i18n": "^8.18.1",
"vue-ls": "^3.2.1", "vue-ls": "^3.2.1",
"vue-router": "^3.1.6", "vue-router": "^3.3.1",
"vue-svg-component-runtime": "^1.0.1", "vue-svg-component-runtime": "^1.0.1",
"vuedraggable": "^2.23.2", "vuedraggable": "^2.23.2",
"vuex": "^3.1.2" "vuex": "^3.4.0"
}, },
"devDependencies": { "devDependencies": {
"@kazupon/vue-i18n-loader": "^0.5.0", "@kazupon/vue-i18n-loader": "^0.5.0",
"@vue/cli": "^4.2.2", "@vue/cli": "^4.4.1",
"@vue/cli-plugin-babel": "^4.2.2", "@vue/cli-plugin-babel": "^4.4.1",
"@vue/cli-plugin-eslint": "^4.2.2", "@vue/cli-plugin-eslint": "^4.4.1",
"@vue/cli-plugin-unit-jest": "^4.2.2", "@vue/cli-plugin-unit-jest": "^4.4.1",
"@vue/cli-service": "^4.2.2", "@vue/cli-service": "^4.4.1",
"@vue/eslint-config-standard": "^5.1.2", "@vue/eslint-config-standard": "^5.1.2",
"@vue/test-utils": "^1.0.0-beta.31", "@vue/test-utils": "^1.0.3",
"babel-core": "7.0.0-bridge.0", "babel-core": "7.0.0-bridge.0",
"babel-eslint": "^10.0.3", "babel-eslint": "^10.0.3",
"babel-jest": "^25.1.0", "babel-jest": "^25.1.0",
"babel-plugin-import": "^1.13.0", "babel-plugin-import": "^1.13.0",
"eslint": "^6.8.0", "eslint": "^6.8.0",
"eslint-plugin-html": "^6.0.0", "eslint-plugin-html": "^6.0.2",
"eslint-plugin-import": "^2.20.1", "eslint-plugin-import": "^2.20.2",
"eslint-plugin-node": "^11.0.0", "eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1", "eslint-plugin-promise": "^4.2.1",
"eslint-plugin-standard": "^4.0.1", "eslint-plugin-standard": "^4.0.1",
"eslint-plugin-vue": "^6.2.1", "eslint-plugin-vue": "^6.2.2",
"less": "^3.11.1", "less": "^3.11.1",
"less-loader": "^5.0.0", "less-loader": "^5.0.0",
"node-sass": "^4.13.1", "node-sass": "^4.13.1",
@ -87,7 +87,7 @@
"vue-cli-plugin-i18n": "^0.6.1", "vue-cli-plugin-i18n": "^0.6.1",
"vue-svg-icon-loader": "^2.1.1", "vue-svg-icon-loader": "^2.1.1",
"vue-template-compiler": "^2.6.11", "vue-template-compiler": "^2.6.11",
"webpack": "^4.42.0" "webpack": "^4.43.0"
}, },
"eslintConfig": { "eslintConfig": {
"root": true, "root": true,

2
ui/src/components/view/ActionButton.vue
View File

@ -38,7 +38,7 @@
:icon="action.icon" :icon="action.icon"
:type="action.icon === 'delete' ? 'danger' : (action.icon === 'plus' ? 'primary' : 'default')" :type="action.icon === 'delete' ? 'danger' : (action.icon === 'plus' ? 'primary' : 'default')"
shape="circle" shape="circle"
style="margin-right: 5px" style="margin-left: 5px"
@click="execAction(action)" /> @click="execAction(action)" />
</a-badge> </a-badge>
<a-button <a-button

8
ui/src/components/view/DetailSettings.vue
View File

@ -69,9 +69,7 @@
<a-button shape="circle" size="default" @click="hideEditDetail(index)" v-if="item.edit"> <a-button shape="circle" size="default" @click="hideEditDetail(index)" v-if="item.edit">
<a-icon type="close-circle" theme="twoTone" twoToneColor="#f5222d" /> <a-icon type="close-circle" theme="twoTone" twoToneColor="#f5222d" />
</a-button> </a-button>
<a-button shape="circle" @click="showEditDetail(index)" v-if="!item.edit"> <a-button shape="circle" @click="showEditDetail(index)" v-if="!item.edit" icon="edit" />
<a-icon type="edit" />
</a-button>
</div> </div>
<div slot="actions" v-if="!disableSettings"> <div slot="actions" v-if="!disableSettings">
<a-popconfirm <a-popconfirm
@ -81,9 +79,7 @@
cancelText="No" cancelText="No"
placement="left" placement="left"
> >
<a-button shape="circle"> <a-button shape="circle" type="danger" icon="delete" />
<a-icon type="delete" theme="twoTone" twoToneColor="#f5222d" />
</a-button>
</a-popconfirm> </a-popconfirm>
</div> </div>
</a-list-item> </a-list-item>

20
ui/src/components/view/ListView.vue
View File

@ -66,7 +66,7 @@
<a-button type="dashed" size="small" shape="circle" icon="login" @click="changeProject(record)" /> <a-button type="dashed" size="small" shape="circle" icon="login" @click="changeProject(record)" />
</span> </span>
<os-logo v-if="record.ostypename" :osName="record.ostypename" size="1x" style="margin-right: 5px" /> <os-logo v-if="record.ostypename" :osName="record.ostypename" size="1x" style="margin-right: 5px" />
<console :resource="record" size="small" /> <console :resource="record" size="small" style="margin-right: 5px" />
<router-link :to="{ path: $route.path + '/' + record.id }" v-if="record.id">{{ text }}</router-link> <router-link :to="{ path: $route.path + '/' + record.id }" v-if="record.id">{{ text }}</router-link>
<router-link :to="{ path: $route.path + '/' + record.name }" v-else>{{ text }}</router-link> <router-link :to="{ path: $route.path + '/' + record.name }" v-else>{{ text }}</router-link>
</div> </div>
@ -147,25 +147,31 @@
<template slot="title">Move to top</template> <template slot="title">Move to top</template>
<a-button <a-button
shape="round" shape="round"
icon="double-left"
@click="moveItemTop(record)" @click="moveItemTop(record)"
class="shift-btn shift-btn--rotated"></a-button> class="shift-btn">
<a-icon type="double-left" class="shift-btn shift-btn--rotated" />
</a-button>
</a-tooltip> </a-tooltip>
<a-tooltip placement="top"> <a-tooltip placement="top">
<template slot="title">Move to bottom</template> <template slot="title">Move to bottom</template>
<a-button <a-button
shape="round" shape="round"
icon="double-right"
@click="moveItemBottom(record)" @click="moveItemBottom(record)"
class="shift-btn shift-btn--rotated"></a-button> class="shift-btn">
<a-icon type="double-right" class="shift-btn shift-btn--rotated" />
</a-button>
</a-tooltip> </a-tooltip>
<a-tooltip placement="top"> <a-tooltip placement="top">
<template slot="title">Move up one row</template> <template slot="title">Move up one row</template>
<a-button shape="round" icon="caret-up" @click="moveItemUp(record)" class="shift-btn"></a-button> <a-button shape="round" @click="moveItemUp(record)" class="shift-btn">
<a-icon type="caret-up" class="shift-btn" />
</a-button>
</a-tooltip> </a-tooltip>
<a-tooltip placement="top"> <a-tooltip placement="top">
<template slot="title">Move down one row</template> <template slot="title">Move down one row</template>
<a-button shape="round" icon="caret-down" @click="moveItemDown(record)" class="shift-btn"></a-button> <a-button shape="round" @click="moveItemDown(record)" class="shift-btn">
<a-icon type="caret-down" class="shift-btn" />
</a-button>
</a-tooltip> </a-tooltip>
</div> </div>

2
ui/src/components/view/ResourceView.vue
View File

@ -57,6 +57,7 @@ import DetailsTab from '@/components/view/DetailsTab'
import InfoCard from '@/components/view/InfoCard' import InfoCard from '@/components/view/InfoCard'
import ResourceLayout from '@/layouts/ResourceLayout' import ResourceLayout from '@/layouts/ResourceLayout'
import { api } from '@/api' import { api } from '@/api'
import { mixinDevice } from '@/utils/mixin.js'
export default { export default {
name: 'ResourceView', name: 'ResourceView',
@ -64,6 +65,7 @@ export default {
InfoCard, InfoCard,
ResourceLayout ResourceLayout
}, },
mixins: [mixinDevice],
props: { props: {
resource: { resource: {
type: Object, type: Object,

2
ui/src/components/widgets/Console.vue
View File

@ -20,7 +20,7 @@
v-if="['vm', 'systemvm', 'router', 'ilbvm'].includes($route.meta.name)" v-if="['vm', 'systemvm', 'router', 'ilbvm'].includes($route.meta.name)"
:href="'/client/console?cmd=access&vm=' + resource.id" :href="'/client/console?cmd=access&vm=' + resource.id"
target="_blank"> target="_blank">
<a-button style="margin-right: 5px" shape="circle" type="dashed" :size="size" :disabled="['Stopped', 'Error', 'Destroyed'].includes(resource.state)" > <a-button style="margin-left: 5px" shape="circle" type="dashed" :size="size" :disabled="['Stopped', 'Error', 'Destroyed'].includes(resource.state)" >
<a-icon type="code" /> <a-icon type="code" />
</a-button> </a-button>
</a> </a>

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

@ -120,8 +120,7 @@
> >
<a-button <a-button
icon="check-square" icon="check-square"
size="small" shape="circle" />
shape="round" />
</a-popconfirm> </a-popconfirm>
<a-tooltip placement="bottom" v-if="item.type !== 'L2'"> <a-tooltip placement="bottom" v-if="item.type !== 'L2'">
<template slot="title"> <template slot="title">
@ -129,8 +128,7 @@
</template> </template>
<a-button <a-button
icon="swap" icon="swap"
size="small" shape="circle"
shape="round"
@click="editIpAddressNic = item.id; showUpdateIpModal = true" /> @click="editIpAddressNic = item.id; showUpdateIpModal = true" />
</a-tooltip> </a-tooltip>
<a-tooltip placement="bottom" v-if="item.type !== 'L2'"> <a-tooltip placement="bottom" v-if="item.type !== 'L2'">
@ -139,8 +137,7 @@
</template> </template>
<a-button <a-button
icon="environment" icon="environment"
size="small" shape="circle"
shape="round"
@click="fetchSecondaryIPs(item.id)" /> @click="fetchSecondaryIPs(item.id)" />
</a-tooltip> </a-tooltip>
<a-popconfirm <a-popconfirm
@ -153,8 +150,7 @@
<a-button <a-button
type="danger" type="danger"
icon="delete" icon="delete"
size="small" shape="circle" />
shape="round" />
</a-popconfirm> </a-popconfirm>
</div> </div>
<div class="tags"> <div class="tags">
@ -273,7 +269,6 @@
<a-button <a-button
type="danger" type="danger"
shape="circle" shape="circle"
size="small"
icon="delete" /> icon="delete" />
{{ ip.ipaddress }} {{ ip.ipaddress }}
</a-popconfirm> </a-popconfirm>

2
ui/src/views/infra/network/DedicatedVLANTab.vue
View File

@ -34,7 +34,7 @@
cancelText="No" cancelText="No"
placement="top" placement="top"
> >
<a-button icon="delete" type="danger" shape="round"></a-button> <a-button icon="delete" type="danger" shape="circle"></a-button>
</a-popconfirm> </a-popconfirm>
</template> </template>
</a-table> </a-table>

3
ui/src/views/infra/network/IpRangesTabManagement.vue
View File

@ -42,9 +42,8 @@
<template slot="content">{{ $t('label.remove.ip.range') }}</template> <template slot="content">{{ $t('label.remove.ip.range') }}</template>
<a-button <a-button
icon="delete" icon="delete"
shape="round" shape="circle"
type="danger" type="danger"
size="small"
@click="handleDeleteIpRange(record)"></a-button> @click="handleDeleteIpRange(record)"></a-button>
</a-popover> </a-popover>
</div> </div>

7
ui/src/views/infra/network/IpRangesTabPublic.vue
View File

@ -42,8 +42,7 @@
<template slot="content">{{ $t('label.add.account') }}</template> <template slot="content">{{ $t('label.add.account') }}</template>
<a-button <a-button
icon="user-add" icon="user-add"
shape="round" shape="circle"
type="primary"
@click="() => handleOpenAddAccountModal(record)"></a-button> @click="() => handleOpenAddAccountModal(record)"></a-button>
</a-popover> </a-popover>
<a-popover <a-popover
@ -52,13 +51,13 @@
<template slot="content">{{ $t('label.release.account') }}</template> <template slot="content">{{ $t('label.release.account') }}</template>
<a-button <a-button
icon="user-delete" icon="user-delete"
shape="round" shape="circle"
type="danger" type="danger"
@click="() => handleRemoveAccount(record.id)"></a-button> @click="() => handleRemoveAccount(record.id)"></a-button>
</a-popover> </a-popover>
<a-popover placement="bottom"> <a-popover placement="bottom">
<template slot="content">{{ $t('label.remove.ip.range') }}</template> <template slot="content">{{ $t('label.remove.ip.range') }}</template>
<a-button icon="delete" shape="round" type="danger" @click="handleDeleteIpRange(record.id)"></a-button> <a-button icon="delete" shape="circle" type="danger" @click="handleDeleteIpRange(record.id)"></a-button>
</a-popover> </a-popover>
</div> </div>
</template> </template>

2
ui/src/views/infra/network/IpRangesTabStorage.vue
View File

@ -41,7 +41,7 @@
<template slot="content">{{ $t('label.remove.ip.range') }}</template> <template slot="content">{{ $t('label.remove.ip.range') }}</template>
<a-button <a-button
icon="delete" icon="delete"
shape="round" shape="circle"
type="danger" type="danger"
@click="handleDeleteIpRange(record.id)"></a-button> @click="handleDeleteIpRange(record.id)"></a-button>
</a-popover> </a-popover>

6
ui/src/views/network/AclListRulesTab.vue
View File

@ -82,9 +82,9 @@
</div> </div>
</div> </div>
<div class="list__actions"> <div class="list__actions">
<a-button shape="round" icon="tag" @click="() => openTagsModal(acl)"></a-button> <a-button shape="circle" icon="tag" @click="() => openTagsModal(acl)"></a-button>
<a-button shape="round" icon="edit" @click="() => openEditRuleModal(acl)"></a-button> <a-button shape="circle" icon="edit" @click="() => openEditRuleModal(acl)"></a-button>
<a-button shape="round" icon="delete" type="danger" @click="() => handleDeleteRule(acl.id)"></a-button> <a-button shape="circle" icon="delete" type="danger" @click="() => handleDeleteRule(acl.id)"></a-button>
</div> </div>
</div> </div>
</transition-group> </transition-group>

2
ui/src/views/network/EgressRulesTab.vue
View File

@ -78,7 +78,7 @@
{{ record.icmpcode || record.endport >= 0 ? record.icmpcode || record.endport : 'All' }} {{ record.icmpcode || record.endport >= 0 ? record.icmpcode || record.endport : 'All' }}
</template> </template>
<template slot="actions" slot-scope="record"> <template slot="actions" slot-scope="record">
<a-button shape="round" type="danger" icon="delete" @click="deleteRule(record)" /> <a-button shape="circle" type="danger" icon="delete" @click="deleteRule(record)" />
</template> </template>
</a-table> </a-table>
<a-pagination <a-pagination

4
ui/src/views/network/FirewallRules.vue
View File

@ -74,8 +74,8 @@
</template> </template>
<template slot="actions" slot-scope="record"> <template slot="actions" slot-scope="record">
<div class="actions"> <div class="actions">
<a-button shape="round" icon="tag" class="rule-action" @click="() => openTagsModal(record.id)" /> <a-button shape="circle" icon="tag" class="rule-action" @click="() => openTagsModal(record.id)" />
<a-button shape="round" type="danger" icon="delete" class="rule-action" @click="deleteRule(record)" /> <a-button shape="circle" type="danger" icon="delete" class="rule-action" @click="deleteRule(record)" />
</div> </div>
</template> </template>
</a-table> </a-table>

4
ui/src/views/network/IngressEgressRuleConfigure.vue
View File

@ -85,14 +85,14 @@
</div> </div>
</template> </template>
<template slot="actions" slot-scope="record"> <template slot="actions" slot-scope="record">
<a-button shape="round" icon="tag" class="rule-action" @click="() => openTagsModal(record)" /> <a-button shape="circle" icon="tag" class="rule-action" @click="() => openTagsModal(record)" />
<a-popconfirm <a-popconfirm
:title="$t('label.delete') + '?'" :title="$t('label.delete') + '?'"
@confirm="handleDeleteRule(record)" @confirm="handleDeleteRule(record)"
okText="Yes" okText="Yes"
cancelText="No" cancelText="No"
> >
<a-button shape="round" type="danger" icon="delete" class="rule-action" /> <a-button shape="circle" type="danger" icon="delete" class="rule-action" />
</a-popconfirm> </a-popconfirm>
</template> </template>
</a-table> </a-table>

11
ui/src/views/network/LoadBalancing.vue
View File

@ -88,16 +88,15 @@
<div v-for="instance in record.ruleInstances" :key="instance.loadbalancerruleinstance.id"> <div v-for="instance in record.ruleInstances" :key="instance.loadbalancerruleinstance.id">
<div v-for="ip in instance.lbvmipaddresses" :key="ip" class="rule-instance-list__item"> <div v-for="ip in instance.lbvmipaddresses" :key="ip" class="rule-instance-list__item">
<div> <div>
<status :text="instance.loadbalancerruleinstance.state" />
<a-icon type="desktop" /> <a-icon type="desktop" />
<router-link :to="{ path: '/vm/' + record.virtualmachineid }"> <router-link :to="{ path: '/vm/' + record.virtualmachineid }">
{{ instance.loadbalancerruleinstance.displayname }} {{ instance.loadbalancerruleinstance.displayname }}
</router-link> </router-link>
</div> </div>
<div>{{ ip }}</div> <div>{{ ip }}</div>
<div><status :text="instance.loadbalancerruleinstance.state" displayText /></div>
<a-button <a-button
size="small" shape="circle"
shape="round"
type="danger" type="danger"
icon="delete" icon="delete"
@click="() => handleDeleteInstanceFromRule(instance, record, ip)" /> @click="() => handleDeleteInstanceFromRule(instance, record, ip)" />
@ -107,15 +106,15 @@
</template> </template>
<template slot="actions" slot-scope="record"> <template slot="actions" slot-scope="record">
<div class="actions"> <div class="actions">
<a-button size="small" shape="circle" icon="edit" @click="() => openEditRuleModal(record)"></a-button> <a-button shape="circle" icon="edit" @click="() => openEditRuleModal(record)"></a-button>
<a-button size="small" shape="circle" icon="tag" @click="() => openTagsModal(record.id)" /> <a-button shape="circle" icon="tag" @click="() => openTagsModal(record.id)" />
<a-popconfirm <a-popconfirm
:title="$t('label.delete') + '?'" :title="$t('label.delete') + '?'"
@confirm="handleDeleteRule(record)" @confirm="handleDeleteRule(record)"
okText="Yes" okText="Yes"
cancelText="No" cancelText="No"
> >
<a-button size="small" shape="circle" type="danger" icon="delete" /> <a-button shape="circle" type="danger" icon="delete" />
</a-popconfirm> </a-popconfirm>
</div> </div>
</template> </template>

4
ui/src/views/network/PortForwarding.vue
View File

@ -96,8 +96,8 @@
</template> </template>
<template slot="actions" slot-scope="record"> <template slot="actions" slot-scope="record">
<div class="actions"> <div class="actions">
<a-button shape="round" icon="tag" class="rule-action" @click="() => openTagsModal(record.id)" /> <a-button shape="circle" icon="tag" class="rule-action" @click="() => openTagsModal(record.id)" />
<a-button shape="round" type="danger" icon="delete" class="rule-action" @click="deleteRule(record)" /> <a-button shape="circle" type="danger" icon="delete" class="rule-action" @click="deleteRule(record)" />
</div> </div>
</template> </template>
</a-table> </a-table>

4
ui/src/views/network/StaticRoutesTab.vue
View File

@ -29,8 +29,8 @@
<div>{{ route.cidr }}</div> <div>{{ route.cidr }}</div>
</div> </div>
<div class="actions"> <div class="actions">
<a-button shape="round" icon="tag" @click="() => openTagsModal(route)"></a-button> <a-button shape="circle" icon="tag" @click="() => openTagsModal(route)"></a-button>
<a-button shape="round" icon="delete" type="danger" @click="() => handleDelete(route)"></a-button> <a-button shape="circle" icon="delete" type="danger" @click="() => handleDelete(route)"></a-button>
</div> </div>
</div> </div>
</div> </div>