[UI] Use GET request method for list API calls (#11354)

* [UI] Use GET request method for list API calls

* Updated UI unit tests

ui/src/api/index.js

@@ -23,6 +23,19 @@ import {
   ACCESS_TOKEN
 } from '@/store/mutation-types'
 
+const getAPICommandsRegex = /^(get|list|query|find)\w+$/i
+const additionalGetAPICommandsList = [
+  'isaccountallowedtocreateofferingswithtags',
+  'readyforshutdown',
+  'cloudianisenabled',
+  'quotabalance',
+  'quotasummary',
+  'quotatarifflist',
+  'quotaisenabled',
+  'quotastatement',
+  'verifyoauthcodeandgetuser'
+]
+
 export function getAPI (command, args = {}) {
   args.command = command
   args.response = 'json'
@@ -64,6 +77,12 @@ export function postAPI (command, data = {}) {
   })
 }
 
+export function callAPI (command, args = {}) {
+  const isGetAPICommand = getAPICommandsRegex.test(command) || additionalGetAPICommandsList.includes(command.toLowerCase())
+  const call = isGetAPICommand ? getAPI : postAPI
+  return call(command, args)
+}
+
 export function login (arg) {
   if (!sourceToken.checkExistSource()) {
     sourceToken.init()

ui/src/components/view/ListView.vue

@@ -1230,45 +1230,45 @@ export default {
       this.editableValue = record.value
     },
     getUpdateApi () {
-      let apiString = ''
+      let apiCommand = ''
       switch (this.$route.name) {
         case 'template':
-          apiString = 'updateTemplate'
+          apiCommand = 'updateTemplate'
           break
         case 'iso':
-          apiString = 'updateIso'
+          apiCommand = 'updateIso'
           break
         case 'zone':
-          apiString = 'updateZone'
+          apiCommand = 'updateZone'
           break
         case 'computeoffering':
         case 'systemoffering':
-          apiString = 'updateServiceOffering'
+          apiCommand = 'updateServiceOffering'
           break
         case 'diskoffering':
-          apiString = 'updateDiskOffering'
+          apiCommand = 'updateDiskOffering'
           break
         case 'networkoffering':
-          apiString = 'updateNetworkOffering'
+          apiCommand = 'updateNetworkOffering'
           break
         case 'vpcoffering':
-          apiString = 'updateVPCOffering'
+          apiCommand = 'updateVPCOffering'
           break
         case 'guestoscategory':
-          apiString = 'updateOsCategory'
+          apiCommand = 'updateOsCategory'
           break
       }
-      return apiString
+      return apiCommand
     },
     isOrderUpdatable () {
       return this.getUpdateApi() in this.$store.getters.apis
     },
     handleUpdateOrder (id, index) {
       this.parentToggleLoading()
-      const apiString = this.getUpdateApi()
+      const apiCommand = this.getUpdateApi()
 
       return new Promise((resolve, reject) => {
-        postAPI(apiString, {
+        postAPI(apiCommand, {
           id,
           sortKey: index
         }).then((response) => {

ui/src/components/view/TreeView.vue

@@ -92,7 +92,7 @@
 
 <script>
 import store from '@/store'
-import { postAPI } from '@/api'
+import { callAPI } from '@/api'
 import DetailsTab from '@/components/view/DetailsTab'
 import ResourceView from '@/components/view/ResourceView'
 import ResourceLayout from '@/layouts/ResourceLayout'
@@ -268,7 +268,7 @@ export default {
       }
 
       return new Promise(resolve => {
-        postAPI(this.apiChildren, params).then(json => {
+        callAPI(this.apiChildren, params).then(json => {
           const dataResponse = this.getResponseJsonData(json)
           const dataGenerate = this.generateTreeData(dataResponse)
           treeNode.dataRef.children = dataGenerate
@@ -390,7 +390,7 @@ export default {
       this.treeViewData = []
       this.loadingSearch = true
       this.$emit('change-tree-store', {})
-      postAPI(this.apiList, params).then(json => {
+      callAPI(this.apiList, params).then(json => {
         const listDomains = this.getResponseJsonData(json)
         this.treeVerticalData = this.treeVerticalData.concat(listDomains)
 
@@ -454,7 +454,7 @@ export default {
         params.pageSize = 1
 
         this.detailLoading = true
-        postAPI(apiName, params).then(json => {
+        callAPI(apiName, params).then(json => {
           const jsonResponse = this.getResponseJsonData(json)
           resolve(jsonResponse[0])
         }).catch(() => {

ui/src/components/widgets/InfiniteScrollSelect.vue

@@ -88,7 +88,7 @@
 </template>
 
 <script>
-import { postAPI } from '@/api'
+import { getAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
 export default {
@@ -191,7 +191,7 @@ export default {
       if (this.showIcon) {
         params.showicon = true
       }
-      postAPI(this.api, params).then(json => {
+      getAPI(this.api, params).then(json => {
         const response = json[this.api.toLowerCase() + 'response'] || {}
         if (this.totalCount === null) {
           this.totalCount = response.count || 0

ui/src/views/AutogenView.vue

@@ -587,7 +587,7 @@
 <script>
 import { ref, reactive, toRaw, h } from 'vue'
 import { Button } from 'ant-design-vue'
-import { getAPI, postAPI } from '@/api'
+import { getAPI, postAPI, callAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import { genericCompare } from '@/utils/sort.js'
 import { sourceToken } from '@/utils/request'
@@ -1119,7 +1119,7 @@ export default {
         delete params.listall
       }
 
-      postAPI(this.apiName, params).then(json => {
+      callAPI(this.apiName, params).then(json => {
         var responseName
         var objectName
         for (const key in json) {
@@ -1449,7 +1449,7 @@ export default {
       if (showIcon) {
         params.showicon = true
       }
-      postAPI(possibleApi, params).then(json => {
+      callAPI(possibleApi, params).then(json => {
         param.loading = false
         for (const obj in json) {
           if (obj.includes('response')) {

ui/src/views/compute/CreateAutoScaleVmGroup.vue

@@ -2897,7 +2897,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        postAPI(param.list, args).then(json => {
+        getAPI(param.list, args).then(json => {
           const zoneResponse = (json.listzonesresponse.zone || []).filter(item => item.securitygroupsenabled === false)
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2929,7 +2929,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'dynamicScalingVmConfig', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        postAPI(param.list, options).then((response) => {
+        getAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {

ui/src/views/compute/DeployVM.vue

@@ -1813,7 +1813,7 @@ export default {
         }
         if (!apiName) return resolve(zones)
 
-        postAPI(apiName, params).then(json => {
+        getAPI(apiName, params).then(json => {
           let objectName
           const responseName = [apiName.toLowerCase(), 'response'].join('')
           for (const key in json[responseName]) {
@@ -2505,7 +2505,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        postAPI(param.list, args).then(json => {
+        getAPI(param.list, args).then(json => {
           const zoneResponse = json.listzonesresponse.zone || []
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2537,7 +2537,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        postAPI(param.list, options).then((response) => {
+        getAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {

ui/src/views/compute/DeployVnfAppliance.vue

@@ -1721,7 +1721,7 @@ export default {
         }
         if (!apiName) return resolve(zones)
 
-        postAPI(apiName, params).then(json => {
+        getAPI(apiName, params).then(json => {
           let objectName
           const responseName = [apiName.toLowerCase(), 'response'].join('')
           for (const key in json[responseName]) {
@@ -2447,7 +2447,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        postAPI(param.list, args).then(json => {
+        getAPI(param.list, args).then(json => {
           const zoneResponse = json.listzonesresponse.zone || []
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2479,7 +2479,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        postAPI(param.list, options).then((response) => {
+        getAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {

ui/src/views/iam/DomainView.vue

@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import { getAPI, postAPI } from '@/api'
+import { getAPI, callAPI } from '@/api'
 import store from '@/store'
 import { mixinDevice } from '@/utils/mixin.js'
 
@@ -274,7 +274,7 @@ export default {
       }
       param.loading = true
       param.opts = []
-      postAPI(possibleApi, params)
+      callAPI(possibleApi, params)
         .then(json => {
           param.loading = false
           const responseObj = Object.values(json).find(obj => obj.includes('response'))

ui/src/views/infra/network/providers/ProviderItem.vue

@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import { postAPI } from '@/api'
+import { getAPI } from '@/api'
 import ActionButton from '@/components/view/ActionButton'
 import ProviderDetail from '@/views/infra/network/providers/ProviderDetail'
 import ProviderListView from '@/views/infra/network/providers/ProviderListView'
@@ -199,7 +199,7 @@ export default {
     },
     executeApi (apiName, params) {
       return new Promise((resolve, reject) => {
-        postAPI(apiName, params).then(json => {
+        getAPI(apiName, params).then(json => {
           let responseName
           let objectName
           let itemCount = 0

ui/src/views/network/tungsten/TungstenFabricTableView.vue

@@ -122,7 +122,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { postAPI } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TungstenNetworkAction from '@/views/network/tungsten/TungstenNetworkAction'
 import TungstenNetworkTable from '@/views/network/tungsten/TungstenNetworkTable'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -233,7 +233,7 @@ export default {
       this.dataSource = []
       this.fetchLoading = true
 
-      postAPI(this.apiName, params).then(json => {
+      getAPI(this.apiName, params).then(json => {
         let responseName
         let objectName
         for (const key in json) {
@@ -274,7 +274,7 @@ export default {
           const fieldIndex = this.currentAction.fields.findIndex(item => item.name === field.name)
           this.currentAction.fields[fieldIndex].loading = true
 
-          postAPI(field.api, params).then(json => {
+          getAPI(field.api, params).then(json => {
             let responseName
             let objectName
             for (const key in json) {

ui/src/views/tools/ManageInstances.vue

@@ -1001,7 +1001,7 @@ export default {
       if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'pools'].includes(name)) {
         options.listall = true
       }
-      postAPI(param.list, options).then((response) => {
+      getAPI(param.list, options).then((response) => {
         param.loading = false
         _.map(response, (responseItem, responseKey) => {
           if (Object.keys(responseItem).length === 0) {
@@ -1200,7 +1200,7 @@ export default {
         }
       }
 
-      postAPI(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const response = this.isMigrateFromVmware ? json.listvmwaredcvmsresponse : json.listunmanagedinstancesresponse
         const listUnmanagedInstances = response.unmanagedinstance
         if (this.arrayHasItems(listUnmanagedInstances)) {

ui/src/views/tools/ManageVolumes.vue

@@ -818,7 +818,7 @@ export default {
       if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'pools'].includes(name)) {
         options.listall = true
       }
-      postAPI(param.list, options).then((response) => {
+      getAPI(param.list, options).then((response) => {
         param.loading = false
         _.map(response, (responseItem, responseKey) => {
           if (Object.keys(responseItem).length === 0) {

ui/tests/unit/views/AutogenView.spec.js

@@ -1293,12 +1293,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'POST',
+          method: 'GET',
-          data: common.createDataParams({
+          params: {
             command: 'listTestApiNames',
             response: 'json',
             listall: true
-          })
+          }
         })
         expect(param).toEqual({
           name: 'testapiname',
@@ -1390,13 +1390,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'POST',
+          method: 'GET',
-          data: common.createDataParams({
+          params: {
             command: 'listTemplates',
             response: 'json',
             listall: true,
             templatefilter: 'executable'
-          })
+          }
         })
         expect(param).toEqual({
           name: 'id',
@@ -1429,13 +1429,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'POST',
+          method: 'GET',
-          data: common.createDataParams({
+          params: {
             command: 'listIsos',
             response: 'json',
             listall: true,
             isofilter: 'executable'
-          })
+          }
         })
         expect(param).toEqual({
           name: 'id',
@@ -1468,13 +1468,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'POST',
+          method: 'GET',
-          data: common.createDataParams({
+          params: {
             command: 'listHosts',
             response: 'json',
             listall: true,
             type: 'routing'
-          })
+          }
         })
         expect(param).toEqual({
           name: 'id',