Fixes for Import VM Tasks listing (#11841)

* Fix import VM tasks pagination

* Fix UI for pagination and proper listing

* Fixes and improvements

* Polish UI

* Restore config.json

* Fix state on parameter description

api/src/main/java/org/apache/cloudstack/api/ApiConstants.java

@@ -535,7 +535,6 @@ public class ApiConstants {
     public static final String SHOW_CAPACITIES = "showcapacities";
     public static final String SHOW_REMOVED = "showremoved";
     public static final String SHOW_RESOURCE_ICON = "showicon";
-    public static final String SHOW_COMPLETED = "showcompleted";
     public static final String SHOW_INACTIVE = "showinactive";
     public static final String SHOW_UNIQUE = "showunique";
     public static final String SIGNATURE = "signature";
@@ -585,6 +584,7 @@ public class ApiConstants {
     public static final String SUITABLE_FOR_VM = "suitableforvirtualmachine";
     public static final String SUPPORTS_STORAGE_SNAPSHOT = "supportsstoragesnapshot";
     public static final String TARGET_IQN = "targetiqn";
+    public static final String TASKS_FILTER = "tasksfilter";
     public static final String TEMPLATE_FILTER = "templatefilter";
     public static final String TEMPLATE_ID = "templateid";
     public static final String TEMPLATE_IDS = "templateids";

api/src/main/java/org/apache/cloudstack/api/command/admin/vm/ListImportVMTasksCmd.java

@@ -75,11 +75,8 @@ public class ListImportVMTasksCmd extends BaseListCmd {
             description = "Conversion host of the importing task")
     private Long convertHostId;
 
-    @Parameter(name = ApiConstants.LIST_ALL, type = CommandType.BOOLEAN, description = "Whether to list all import tasks.")
+    @Parameter(name = ApiConstants.TASKS_FILTER, type = CommandType.STRING, description = "Filter tasks by state, valid options are: All, Running, Completed, Failed")
-    private boolean listAll = false;
+    private String tasksFilter;
-
-    @Parameter(name = ApiConstants.SHOW_COMPLETED, type = CommandType.BOOLEAN, description = "Whether to list completed tasks.")
-    private boolean showCompleted = false;
 
     public Long getZoneId() {
         return zoneId;
@@ -97,12 +94,8 @@ public class ListImportVMTasksCmd extends BaseListCmd {
         return convertHostId;
     }
 
-    public boolean isListAll() {
+    public String getTasksFilter() {
-        return listAll;
+        return tasksFilter;
-    }
-
-    public boolean isShowCompleted() {
-        return showCompleted;
     }
 
     @Override

api/src/main/java/org/apache/cloudstack/api/response/ImportVMTaskResponse.java

@@ -55,6 +55,10 @@ public class ImportVMTaskResponse extends BaseResponse {
     @Param(description = "the display name of the importing VM")
     private String displayName;
 
+    @SerializedName(ApiConstants.STATE)
+    @Param(description = "the state of the importing VM task")
+    private String state;
+
     @SerializedName(ApiConstants.VCENTER)
     @Param(description = "the vcenter name of the importing VM task")
     private String vcenter;
@@ -242,4 +246,12 @@ public class ImportVMTaskResponse extends BaseResponse {
     public void setLastUpdated(Date lastUpdated) {
         this.lastUpdated = lastUpdated;
     }
+
+    public String getState() {
+        return state;
+    }
+
+    public void setState(String state) {
+        this.state = state;
+    }
 }

api/src/main/java/org/apache/cloudstack/vm/ImportVmTask.java

@@ -23,6 +23,19 @@ import org.apache.cloudstack.api.InternalIdentity;
 
 public interface ImportVmTask extends Identity, InternalIdentity {
     enum Step {
-        Prepare, CloningInstance, ConvertingInstance, Importing, Cleaning, Completed
+        Prepare, CloningInstance, ConvertingInstance, Importing, Completed
+    }
+
+    enum TaskState {
+        Running, Completed, Failed;
+
+        public static TaskState getValue(String state) {
+            for (TaskState s : TaskState.values()) {
+                if (s.name().equalsIgnoreCase(state)) {
+                    return s;
+                }
+            }
+            throw new IllegalArgumentException("Invalid task state: " + state);
+        }
     }
 }

api/src/main/java/org/apache/cloudstack/vm/ImportVmTasksManager.java

@@ -34,5 +34,5 @@ public interface ImportVmTasksManager {
     void updateImportVMTaskStep(ImportVmTask importVMTaskVO, DataCenter zone, Account owner, Host convertHost,
                                 Host importHost, Long vmId, ImportVmTask.Step step);
 
-    boolean removeImportVMTask(long taskId);
+    void updateImportVMTaskErrorState(ImportVmTask importVMTaskVO, ImportVmTask.TaskState state, String errorMsg);
 }

engine/schema/src/main/java/com/cloud/vm/ImportVMTaskVO.java

@@ -93,6 +93,9 @@ public class ImportVMTaskVO implements ImportVmTask {
     @Column(name = "step")
     private Step step;
 
+    @Column(name = "state")
+    private TaskState state;
+
     @Column(name = "description")
     private String description;
 
@@ -217,6 +220,14 @@ public class ImportVMTaskVO implements ImportVmTask {
         this.step = step;
     }
 
+    public TaskState getState() {
+        return state;
+    }
+
+    public void setState(TaskState state) {
+        this.state = state;
+    }
+
     public String getDescription() {
         return description;
     }

engine/schema/src/main/java/com/cloud/vm/dao/ImportVMTaskDao.java

@@ -18,12 +18,14 @@
 //
 package com.cloud.vm.dao;
 
+import com.cloud.utils.Pair;
 import com.cloud.utils.db.GenericDao;
 import com.cloud.vm.ImportVMTaskVO;
-
+import org.apache.cloudstack.vm.ImportVmTask;
 import java.util.List;
 
 public interface ImportVMTaskDao extends GenericDao<ImportVMTaskVO, Long> {
 
-    List<ImportVMTaskVO> listImportVMTasks(Long zoneId, Long accountId, String vcenter, Long convertHostId, boolean showCompleted);
+    Pair<List<ImportVMTaskVO>, Integer> listImportVMTasks(Long zoneId, Long accountId, String vcenter, Long convertHostId,
+                                                          ImportVmTask.TaskState state, Long startIndex, Long pageSizeVal);
 }

engine/schema/src/main/java/com/cloud/vm/dao/ImportVMTaskDaoImpl.java

@@ -16,10 +16,13 @@
 // under the License.
 package com.cloud.vm.dao;
 
+import com.cloud.utils.Pair;
+import com.cloud.utils.db.Filter;
 import com.cloud.utils.db.GenericDaoBase;
 import com.cloud.utils.db.SearchBuilder;
 import com.cloud.utils.db.SearchCriteria;
 import com.cloud.vm.ImportVMTaskVO;
+import org.apache.cloudstack.vm.ImportVmTask;
 import org.apache.commons.lang3.StringUtils;
 import org.springframework.stereotype.Component;
 
@@ -41,12 +44,14 @@ public class ImportVMTaskDaoImpl extends GenericDaoBase<ImportVMTaskVO, Long> im
         AllFieldsSearch.and("accountId", AllFieldsSearch.entity().getAccountId(), SearchCriteria.Op.EQ);
         AllFieldsSearch.and("vcenter", AllFieldsSearch.entity().getVcenter(), SearchCriteria.Op.EQ);
         AllFieldsSearch.and("convertHostId", AllFieldsSearch.entity().getConvertHostId(), SearchCriteria.Op.EQ);
+        AllFieldsSearch.and("state", AllFieldsSearch.entity().getState(), SearchCriteria.Op.EQ);
         AllFieldsSearch.done();
     }
 
 
     @Override
-    public List<ImportVMTaskVO> listImportVMTasks(Long zoneId, Long accountId, String vcenter, Long convertHostId, boolean showCompleted) {
+    public Pair<List<ImportVMTaskVO>, Integer> listImportVMTasks(Long zoneId, Long accountId, String vcenter, Long convertHostId,
+                                                                 ImportVmTask.TaskState state, Long startIndex, Long pageSizeVal) {
         SearchCriteria<ImportVMTaskVO> sc = AllFieldsSearch.create();
         if (zoneId != null) {
             sc.setParameters("zoneId", zoneId);
@@ -60,6 +65,10 @@ public class ImportVMTaskDaoImpl extends GenericDaoBase<ImportVMTaskVO, Long> im
         if (convertHostId != null) {
             sc.setParameters("convertHostId", convertHostId);
         }
-        return showCompleted ? listIncludingRemovedBy(sc) : listBy(sc);
+        if (state != null) {
+            sc.setParameters("state", state);
+        }
+        Filter filter = new Filter(ImportVMTaskVO.class, "created", false, startIndex, pageSizeVal);
+        return searchAndCount(sc, filter);
     }
 }

engine/schema/src/main/resources/META-INF/db/schema-42100to42200.sql

@@ -65,7 +65,8 @@ CREATE TABLE IF NOT EXISTS `cloud`.`import_vm_task`(
     `source_vm_name` varchar(255) COMMENT 'Source VM name on vCenter',
     `convert_host_id` bigint unsigned COMMENT 'Convert Host ID',
     `import_host_id` bigint unsigned COMMENT 'Import Host ID',
-    `step` varchar(20) NOT NULL COMMENT 'Importing VM Task Step',
+    `step` varchar(20) COMMENT 'Importing VM Task Step',
+    `state` varchar(20) COMMENT 'Importing VM Task State',
     `description` varchar(255) COMMENT 'Importing VM Task Description',
     `duration` bigint unsigned COMMENT 'Duration in milliseconds for the completed tasks',
     `created` datetime NOT NULL COMMENT 'date created',

server/src/main/java/org/apache/cloudstack/vm/ImportVmTasksManagerImpl.java

@@ -25,13 +25,17 @@ import com.cloud.host.dao.HostDao;
 import com.cloud.user.Account;
 import com.cloud.user.AccountService;
 import com.cloud.utils.DateUtil;
+import com.cloud.utils.Pair;
 import com.cloud.vm.ImportVMTaskVO;
 import com.cloud.vm.UserVmVO;
 import com.cloud.vm.dao.ImportVMTaskDao;
 import com.cloud.vm.dao.UserVmDao;
+import org.apache.cloudstack.api.ApiErrorCode;
+import org.apache.cloudstack.api.ServerApiException;
 import org.apache.cloudstack.api.command.admin.vm.ListImportVMTasksCmd;
 import org.apache.cloudstack.api.response.ImportVMTaskResponse;
 import org.apache.cloudstack.api.response.ListResponse;
+import org.apache.commons.lang3.StringUtils;
 import org.apache.logging.log4j.LogManager;
 import org.apache.logging.log4j.Logger;
 
@@ -72,25 +76,33 @@ public class ImportVmTasksManagerImpl implements ImportVmTasksManager {
         Long accountId = cmd.getAccountId();
         String vcenter = cmd.getVcenter();
         Long convertHostId = cmd.getConvertHostId();
-        boolean listAll = cmd.isListAll();
+        Long startIndex = cmd.getStartIndex();
-        boolean showCompleted = cmd.isShowCompleted();
+        Long pageSizeVal = cmd.getPageSizeVal();
 
-        List<ImportVMTaskVO> tasks;
+        ImportVmTask.TaskState state = getStateFromFilter(cmd.getTasksFilter());
-        if (listAll) {
+        Pair<List<ImportVMTaskVO>, Integer> result = importVMTaskDao.listImportVMTasks(zoneId, accountId, vcenter, convertHostId, state, startIndex, pageSizeVal);
-            tasks = importVMTaskDao.listAll();
+        List<ImportVMTaskVO> tasks = result.first();
-        } else {
-            tasks = importVMTaskDao.listImportVMTasks(zoneId, accountId, vcenter, convertHostId, showCompleted);
-        }
 
         List<ImportVMTaskResponse> responses = new ArrayList<>();
         for (ImportVMTaskVO task : tasks) {
             responses.add(createImportVMTaskResponse(task));
         }
         ListResponse<ImportVMTaskResponse> listResponses = new ListResponse<>();
-        listResponses.setResponses(responses, responses.size());
+        listResponses.setResponses(responses, result.second());
         return listResponses;
     }
 
+    private ImportVmTask.TaskState getStateFromFilter(String tasksFilter) {
+        if (StringUtils.isBlank(tasksFilter) || tasksFilter.equalsIgnoreCase("all")) {
+            return null;
+        }
+        try {
+            return ImportVmTask.TaskState.getValue(tasksFilter);
+        } catch (IllegalArgumentException e) {
+            throw new ServerApiException(ApiErrorCode.PARAM_ERROR, String.format("Invalid value for task state: %s", tasksFilter));
+        }
+    }
+
     @Override
     public ImportVmTask createImportVMTaskRecord(DataCenter zone, Account owner, long userId, String displayName, String vcenter, String datacenterName, String sourceVMName, Host convertHost, Host importHost) {
         logger.debug("Creating import VM task entry for VM: {} for account {} on zone {} " +
@@ -98,6 +110,7 @@ public class ImportVmTasksManagerImpl implements ImportVmTasksManager {
                 sourceVMName, owner.getAccountName(), zone.getName(), displayName, vcenter, datacenterName);
         ImportVMTaskVO importVMTaskVO = new ImportVMTaskVO(zone.getId(), owner.getAccountId(), userId, displayName,
                 vcenter, datacenterName, sourceVMName, convertHost.getId(), importHost.getId());
+        importVMTaskVO.setState(ImportVmTask.TaskState.Running);
         return importVMTaskDao.persist(importVMTaskVO);
     }
 
@@ -111,7 +124,6 @@ public class ImportVmTasksManagerImpl implements ImportVmTasksManager {
         if (Completed == step) {
             stringBuilder.append("Completed at ").append(DateUtil.getDateDisplayString(TimeZone.getTimeZone("GMT"), updatedDate));
         } else {
-            stringBuilder.append(String.format("[%s] ", DateUtil.getDateDisplayString(TimeZone.getTimeZone("GMT"), updatedDate)));
             if (CloningInstance == step) {
                 stringBuilder.append(String.format("Cloning source instance: %s on vCenter: %s / datacenter: %s", sourceVMName, vcenter, datacenter));
             } else if (ConvertingInstance == step) {
@@ -142,13 +154,19 @@ public class ImportVmTasksManagerImpl implements ImportVmTasksManager {
             Duration duration = Duration.between(importVMTaskVO.getCreated().toInstant(), updatedDate.toInstant());
             importVMTaskVO.setDuration(duration.toMillis());
             importVMTaskVO.setVmId(vmId);
+            importVMTaskVO.setState(ImportVmTask.TaskState.Completed);
         }
         importVMTaskDao.update(importVMTaskVO.getId(), importVMTaskVO);
     }
 
     @Override
-    public boolean removeImportVMTask(long taskId) {
+    public void updateImportVMTaskErrorState(ImportVmTask importVMTask, ImportVmTask.TaskState state, String errorMsg) {
-        return importVMTaskDao.remove(taskId);
+        ImportVMTaskVO importVMTaskVO = (ImportVMTaskVO) importVMTask;
+        Date updatedDate = DateUtil.now();
+        importVMTaskVO.setUpdated(updatedDate);
+        importVMTaskVO.setState(state);
+        importVMTaskVO.setDescription(errorMsg);
+        importVMTaskDao.update(importVMTaskVO.getId(), importVMTaskVO);
     }
 
     private ImportVMTaskResponse createImportVMTaskResponse(ImportVMTaskVO task) {
@@ -169,19 +187,21 @@ public class ImportVmTasksManagerImpl implements ImportVmTasksManager {
         response.setDisplayName(task.getDisplayName());
         response.setStep(getStepDisplayField(task.getStep()));
         response.setDescription(task.getDescription());
+        response.setState(task.getState().name());
 
         Date updated = task.getUpdated();
         Date currentDate = new Date();
-        if (updated != null && Completed != task.getStep()) {
+
-            Duration stepDuration = Duration.between(updated.toInstant(), currentDate.toInstant());
+        if (updated != null) {
-            response.setStepDuration(getDurationDisplay(stepDuration.toMillis()));
+            if (ImportVmTask.TaskState.Running == task.getState()) {
-        }
+                Duration stepDuration = Duration.between(updated.toInstant(), currentDate.toInstant());
-        if (Completed == task.getStep()) {
+                response.setStepDuration(getDurationDisplay(stepDuration.toMillis()));
-            response.setStepDuration(getDurationDisplay(task.getDuration()));
+            } else {
-        } else {
+                Duration totalDuration = Duration.between(task.getCreated().toInstant(), updated.toInstant());
-            Duration totalDuration = Duration.between(task.getCreated().toInstant(), currentDate.toInstant());
+                response.setDuration(getDurationDisplay(totalDuration.toMillis()));
-            response.setDuration(getDurationDisplay(totalDuration.toMillis()));
+            }
         }
+
         HostVO host = hostDao.findById(task.getConvertHostId());
         if (host != null) {
             response.setConvertInstanceHostId(host.getUuid());

server/src/main/java/org/apache/cloudstack/vm/UnmanagedVMsManagerImpl.java

@@ -1776,10 +1776,10 @@ public class UnmanagedVMsManagerImpl implements UnmanagedVMsManager {
             logger.debug(String.format("VMware VM %s imported successfully to CloudStack instance %s (%s), Time taken: %d secs, OVF files imported from %s, Source VMware VM details - OS: %s, PowerState: %s, Disks: %s, NICs: %s",
                     sourceVMName, displayName, displayName, timeElapsedInSecs, (ovfTemplateOnConvertLocation != null)? "MS" : "KVM Host", sourceVMwareInstance.getOperatingSystem(), sourceVMwareInstance.getPowerState(), sourceVMwareInstance.getDisks(), sourceVMwareInstance.getNics()));
             importVmTasksManager.updateImportVMTaskStep(importVMTask, zone, owner, convertHost, importHost, userVm.getId(), Completed);
-            importVmTasksManager.removeImportVMTask(importVMTask.getId());
             return userVm;
         } catch (CloudRuntimeException e) {
             logger.error(String.format("Error importing VM: %s", e.getMessage()), e);
+            importVmTasksManager.updateImportVMTaskErrorState(importVMTask, ImportVmTask.TaskState.Failed, e.getMessage());
             ActionEventUtils.onCompletedActionEvent(userId, owner.getId(), EventVO.LEVEL_ERROR, EventTypes.EVENT_VM_IMPORT,
                     cmd.getEventDescription(), null, null, 0);
             throw new ServerApiException(ApiErrorCode.INTERNAL_ERROR, e.getMessage());

server/src/test/java/org/apache/cloudstack/vm/UnmanagedVMsManagerImplTest.java

@@ -782,7 +782,6 @@ public class UnmanagedVMsManagerImplTest {
             when(agentManager.send(Mockito.eq(convertHostId), Mockito.any(CheckConvertInstanceCommand.class))).thenReturn(checkConvertInstanceAnswer);
         }
 
-        when(importVMTaskVO.getId()).thenReturn(1L);
         when(importVmTasksManager.createImportVMTaskRecord(any(DataCenter.class), any(Account.class), anyLong(), anyString(),
                 anyString(), anyString(), anyString(), any(Host.class), any(Host.class))).thenReturn(importVMTaskVO);
         when(volumeApiService.doesStoragePoolSupportDiskOffering(any(StoragePool.class), any(DiskOffering.class))).thenReturn(true);

ui/public/locales/en.json

@@ -635,6 +635,7 @@
 "label.continue": "Continue",
 "label.continue.install": "Continue with installation",
 "label.controlnodes": "Control nodes",
+"label.conversionhost": "Conversion Host",
 "label.copied.clipboard": "Copied to clipboard",
 "label.copy": "Copy",
 "label.copy.clipboard": "Copy to clipboard",
@@ -700,6 +701,8 @@
 "label.csienabled": "CSI Enabled",
 "label.currency": "Currency",
 "label.current": "Current",
+"label.currentstep": "Current step",
+"label.currentstep.duration": "Current step duration",
 "label.current.storage": "Current storage",
 "label.currentpassword": "Current password",
 "label.custom": "Custom",
@@ -1246,6 +1249,7 @@
 "label.import.instance": "Import Instance",
 "label.import.offering": "Import Offering",
 "label.import.role": "Import Role",
+"label.import.vm.tasks": "Import VM Tasks",
 "label.import.volume": "Import Volume",
 "label.inactive": "Inactive",
 "label.inbuilt": "Inbuilt",
@@ -2314,6 +2318,7 @@
 "label.sourcenattype": "Supported source NAT type",
 "label.sourceport": "Source port",
 "label.sourcetype": "Source type",
+"label.sourcevmname": "Source VM Name",
 "label.specifyasnumber": "Specify AS Number",
 "label.specifyipranges": "Specify IP ranges",
 "label.specifyvlan": "Specify VLAN",
@@ -2881,6 +2886,7 @@
 "label.leaseexpiryaction": "Lease expiry action",
 "label.remainingdays": "Lease",
 "label.leased": "Leased",
+"label.totalduration": "Total duration",
 "label.usestoragereplication": "Use primary storage replication",
 "message.acquire.ip.failed": "Failed to acquire IP.",
 "message.action.acquire.ip": "Please confirm that you want to acquire new IP.",
@@ -3524,6 +3530,7 @@
 "message.host.dedication.released": "Host dedication released.",
 "message.host.external.datadisk": "Usage of data disks for the selected template is not applicable",
 "message.import.running.instance.warning": "The selected VM is powered-on on the VMware Datacenter. The recommended state to convert a VMware VM into KVM is powered-off after a graceful shutdown of the guest OS.",
+"message.import.vm.tasks": "Import from VMware to KVM tasks",
 "message.import.volume": "Please specify the domain, account or project name. <br>If not set, the volume will be imported for the caller.",
 "message.info.cloudian.console": "Cloudian Management Console should open in another window.",
 "message.installwizard.cloudstack.helptext.website": " * Project website:\t ",

ui/src/views/tools/ImportVmTasks.vue

@@ -16,56 +16,83 @@
 // under the License.
 
 <template>
-  <a-card class="instances-card">
+  <a-row :gutter="12">
-    <template #title>
+    <a-col :md="24" :lg="24">
-      Import VM Tasks
+      <a-card class="instances-card">
-      <a-tooltip :title="'Running Import VM Tasks'">
+        <template #title>
-        <info-circle-outlined />
+          {{ $t('label.import.vm.tasks') }}
-      </a-tooltip>
+          <a-tooltip :title="$t('message.import.vm.tasks')">
-      <a-button
+            <info-circle-outlined />
-        style="margin-left: 12px; margin-top: 4px"
+          </a-tooltip>
-        :loading="loading"
+          <a-button
-        size="small"
+            style="margin-left: 12px; margin-top: 4px"
-        shape="round"
+            :loading="loading"
-        @click="fetchData()">
+            size="small"
-        <template #icon><reload-outlined /></template>
+            shape="round"
-      </a-button>
+            @click="this.$emit('fetch-import-vm-tasks')" >
-      <a-select
+            <template #icon><reload-outlined /></template>
-        :placeholder="$t('label.filterby')"
+          </a-button>
-        :value="importVmTasksFilterValue"
+          <span style="float: right; width: 50%">
-        style="min-width: 100px; margin-left: 10px; margin-bottom: 5px"
+            <a-select
-        size=small
+              :placeholder="$t('label.filterby')"
-        @change="onFilterChange"
+              :value="filter"
-        showSearch
+              style="min-width: 100px; margin-left: 10px; margin-bottom: 5px"
-        optionFilterProp="label"
+              size=small
-        :filterOption="(input, option) => {
+              @change="onFilterChange"
-          return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
+              showSearch
-        }"
+              optionFilterProp="label"
-      >
+              :filterOption="(input, option) => {
-        <template #suffixIcon><filter-outlined class="ant-select-suffix" /></template>
+                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
-          <a-select-option
+              }"
-            v-for="filter in filters"
+            >
-            :key="filter"
+              <template #suffixIcon><filter-outlined class="ant-select-suffix" /></template>
-            :label="$t('label.' + filter)"
+                <a-select-option
-          >
+                  v-for="filter in filters"
-            {{ $t('label.' + filter) }}
+                  :key="filter"
-          </a-select-option>
+                  :label="$t('label.' + filter)"
-        </a-select>
+                >
-    </template>
+                  {{ $t('label.' + filter) }}
-    <a-table
+                </a-select-option>
-      :data-source="tasks"
+              </a-select>
-      :columns="columns">
+          </span>
-        <template #bodyCell="{ column, record }">
-          <template v-if="column.key === 'convertinstancehostid'">
-            <router-link :to="{ path: '/host/' + record.convertinstancehostid }">{{ record.convertinstancehostname }}</router-link>
-          </template>
-          <template v-else-if="column.key === 'displayname'">
-            <router-link v-if="record.virtualmachineid" :to="{ path: '/vm/' + record.virtualmachineid }">{{ record.displayname }}</router-link>
-            <span v-else>{{ record.displayname }}</span>
-          </template>
         </template>
-    </a-table>
+        <a-table
-  </a-card>
+          :data-source="tasks"
+          class="instances-card-table"
+          size="middle"
+          :pagination="false"
+          :columns="columns">
+            <template #bodyCell="{ column, record }">
+              <template v-if="column.key === 'convertinstancehostid'">
+                <router-link :to="{ path: '/host/' + record.convertinstancehostid }">{{ record.convertinstancehostname }}</router-link>
+              </template>
+              <template v-else-if="column.key === 'displayname'">
+                <router-link v-if="record.virtualmachineid" :to="{ path: '/vm/' + record.virtualmachineid }">{{ record.displayname }}</router-link>
+                <span v-else>{{ record.displayname }}</span>
+              </template>
+              <template v-else-if="column.key === 'created'">
+                <span>{{ $toLocaleDate(record.created) }}</span>
+              </template>
+            </template>
+        </a-table>
+        <div class="instances-card-footer">
+          <a-pagination
+            class="row-element"
+            size="small"
+            :current="page"
+            :pageSize="pageSize"
+            :total="total"
+            :showTotal="total => `${$t('label.showing')} ${Math.min(total, 1+((page-1)*pageSize))}-${Math.min(page*pageSize, total)} ${$t('label.of')} ${total} ${$t('label.items')}`"
+            @change="onPaginationChange"
+            showQuickJumper>
+            <template #buildOptionText="props">
+              <span>{{ props.value }} / {{ $t('label.page') }}</span>
+            </template>
+          </a-pagination>
+        </div>
+      </a-card>
+    </a-col>
+  </a-row>
 </template>
 
 <script>
@@ -81,69 +108,97 @@ export default {
     loading: {
       type: Boolean,
       required: false
+    },
+    filter: {
+      type: String,
+      required: false
+    },
+    total: {
+      type: Number,
+      required: true
+    },
+    page: {
+      type: Number,
+      required: true
+    },
+    pageSize: {
+      type: Number,
+      required: true
     }
   },
   data () {
     const columns = [
+      {
+        key: 'created',
+        title: this.$t('label.created'),
+        dataIndex: 'created'
+      },
       {
         key: 'displayname',
-        title: 'VM Display Name',
+        title: this.$t('label.displayname'),
         dataIndex: 'displayname'
       },
       {
         key: 'convertinstancehostid',
-        title: 'Conversion Host',
+        title: this.$t('label.conversionhost'),
         dataIndex: 'convertinstancehostid'
       },
       {
         key: 'step',
-        title: 'Current Step',
+        title: this.$t('label.currentstep'),
         dataIndex: 'step'
       },
       {
         key: 'stepduration',
-        title: 'Current Step Duration',
+        title: this.$t('label.currentstep.duration'),
         dataIndex: 'stepduration'
       },
       {
         key: 'description',
-        title: 'Description',
+        title: this.$t('label.description'),
         dataIndex: 'description'
       },
       {
         key: 'duration',
-        title: 'Total Duration',
+        title: this.$t('label.totalduration'),
         dataIndex: 'duration'
       },
       {
         key: 'sourcevmname',
-        title: 'Source VM Name',
+        title: this.$t('label.sourcevmname'),
         dataIndex: 'sourcevmname'
       },
       {
         key: 'vcenter',
-        title: 'vCenter',
+        title: this.$t('label.vcenter'),
         dataIndex: 'vcenter'
       },
       {
         key: 'datacentername',
-        title: 'Datacenter Name',
+        title: this.$t('label.vcenter.datacenter'),
         dataIndex: 'datacentername'
+      },
+      {
+        key: 'state',
+        title: this.$t('label.state'),
+        dataIndex: 'state'
       }
     ]
     return {
       columns,
-      filters: ['running', 'completed'],
+      filters: ['all', 'running', 'completed', 'failed'],
       filterValue: 'running'
     }
   },
   methods: {
     fetchData () {
-      this.$emit('fetch-import-vm-tasks', this.filterValue)
+      this.$emit('fetch-import-vm-tasks')
     },
     onFilterChange (e) {
-      this.filterValue = e
+      this.$emit('change-filter', e)
-      this.fetchData()
+    },
+    onPaginationChange (page, size) {
+      this.$emit('change-pagination', page, size)
     }
   }
 }

ui/src/views/tools/ManageInstances.vue

@@ -497,11 +497,17 @@
                 </a-col>
               </a-row>
             </a-tab-pane>
-            <a-tab-pane :key=2 tab="Import VM Tasks" v-if="isMigrateFromVmware">
+            <a-tab-pane :key=2 :tab="$t('label.import.vm.tasks')" v-if="isMigrateFromVmware">
               <ImportVmTasks
                 :tasks="importVmTasks"
                 :loading="loadingImportVmTasks"
+                :filter="importVmTasksFilter"
+                :total="itemCount.tasks || 0"
+                :page="page.tasks"
+                :pageSize="pageSize.tasks"
                 @fetch-import-vm-tasks="fetchImportVmTasks"
+                @change-pagination="onChangeImportTasksPagination"
+                @change-filter="onChangeImportTasksFilter"
               />
             </a-tab-pane>
           </a-tabs>
@@ -704,11 +710,13 @@ export default {
       },
       page: {
         unmanaged: 1,
-        managed: 1
+        managed: 1,
+        tasks: 1
       },
       pageSize: {
         unmanaged: 10,
-        managed: 10
+        managed: 10,
+        tasks: 10
       },
       searchFilters: {
         unmanaged: [],
@@ -765,12 +773,14 @@ export default {
       selectedVmwareVcenter: undefined,
       activeTabKey: 1,
       loadingImportVmTasks: false,
-      importVmTasks: []
+      importVmTasks: [],
+      importVmTasksFilter: 'running'
     }
   },
   created () {
     this.page.unmanaged = parseInt(this.$route.query.unmanagedpage || 1)
     this.page.managed = parseInt(this.$route.query.managedpage || 1)
+    this.page.tasks = parseInt(this.$route.query.tasks || 1)
     this.initForm()
     this.fetchData()
   },
@@ -1102,6 +1112,7 @@ export default {
       this.page.managed = 1
       this.managedInstances = []
       this.managedInstancesSelectedRowKeys = []
+      this.page.tasks = 1
       this.activeTabKey = 1
     },
     onSelectHypervisor (value) {
@@ -1178,15 +1189,25 @@ export default {
         this.fetchImportVmTasks()
       }
     },
-    fetchImportVmTasks (filter) {
+    onChangeImportTasksPagination (page, pagesize) {
+      this.page.tasks = page
+      this.pageSize.tasks = pagesize
+      this.fetchImportVmTasks()
+    },
+    onChangeImportTasksFilter (filter) {
+      this.importVmTasksFilter = filter
+      this.fetchImportVmTasks()
+    },
+    fetchImportVmTasks () {
       this.loadingImportVmTasks = true
       const params = {
-        zoneid: this.zoneId
+        zoneid: this.zoneId,
-      }
+        page: this.page.tasks,
-      if (filter && filter === 'completed') {
+        pagesize: this.pageSize.tasks,
-        params.showcompleted = true
+        tasksfilter: this.importVmTasksFilter
       }
       getAPI('listImportVmTasks', params).then(response => {
+        this.itemCount.tasks = response.listimportvmtasksresponse.count
         this.importVmTasks = response.listimportvmtasksresponse.importvmtask || []
       }).catch(error => {
         this.$notifyError(error)