fix(任务中心): 修复ui测试任务没有分页问题

--bug=1019395 --user=赵勇 【任务中心】UI测试任务问题汇总 https://www.tapd.cn/55049933/s/1289899

framework/sdk-parent/frontend/src/components/task/TaskCenter.vue

@@ -22,7 +22,8 @@
       :title="$t('commons.task_center')"
       :size="size.toString()"
       custom-class="ms-drawer-task">
-      <el-card style="float: left;margin-top: 0px" :style="{'width': (size - 600)+'px'}" v-if="size > 600 ">
+      <el-card style="float: left;margin-top: 0px" :style="{'width': (size - 600)+'px'}" v-if="size > 600 "
+               class="ms-task-container">
         <div class="ms-task-opt-btn" @click="packUp">{{ $t('commons.task_close') }}</div>
         <!-- 接口用例结果 -->
         <micro-app :to="`/definition/report/view/${reportId}`" service="api"
@@ -253,7 +254,8 @@ export default {
         })
     },
     initWebSocket() {
-      this.websocket = getTaskSocket(hasLicense());
+      let isLicense = hasLicense();
+      this.websocket = getTaskSocket(isLicense ? isLicense : false);
       this.websocket.onmessage = this.onMessage;
       this.websocket.onopen = this.onOpen;
       this.websocket.onerror = this.onError;
@@ -266,25 +268,28 @@ export default {
     onMessage(e) {
       this.loading = false;
       this.runningData = JSON.parse(e.data);
-      if (this.runningData) {
+      if (this.runningData && this.runningData.total > 0) {
         this.setActiveName();
       }
       this.runningTotal = this.runningData.total;
-      if (this.runningTotal > 0) {
-        this.init(false);
-      }
+      this.init(false);
+
     },
     onClose(e) {
     },
+    listenScreenChange() {
+      this.size = document.body.clientWidth;
+    },
     showTaskCenter() {
       this.getTaskRunning();
       this.getMaintainerOptions();
-      this.init(true);
+      window.addEventListener("resize", this.listenScreenChange, false);
       this.taskVisible = true;
     },
     close() {
       this.visible = false;
       this.size = 600;
+      window.removeEventListener("resize", this.listenScreenChange);
       this.showType = "";
       if (this.websocket && this.websocket.close instanceof Function) {
         this.websocket.close();
@@ -417,6 +422,7 @@ export default {
         })
     },
     openHistory(id) {
+      window.addEventListener("resize", this.listenScreenChange, false);
       this.activeName = 'API';
       this.initCaseHistory(id);
       this.taskVisible = true;
@@ -425,6 +431,7 @@ export default {
       this.showType = "CASE";
     },
     openScenarioHistory(id) {
+      window.addEventListener("resize", this.listenScreenChange, false);
       this.activeName = 'SCENARIO';
       getScenarioData(id)
         .then(response => {
@@ -462,11 +469,6 @@ export default {
 
 
 <style scoped>
-.ms-body-container {
-  height: calc(100vh - 270px);
-  overflow-y: auto;
-}
-
 .align-right {
   float: right;
 }
@@ -485,20 +487,11 @@ export default {
   padding-bottom: 6px;
 }
 
-.ms-card-task :deep(.el-card__body) {
-  padding: 10px;
-}
-
 .global {
   color: rgb(96, 98, 102);
   font-size: 14px
 }
 
-.ms-card-task:hover {
-  cursor: pointer;
-  border-color: #783887;
-}
-
 .ms-header-menu {
   padding-top: 12px;
   width: 24px;
@@ -528,16 +521,6 @@ export default {
   color: #909399;
 }
 
-.ms-task-name-width {
-  display: inline-block;
-  overflow-x: hidden;
-  padding-bottom: 0;
-  text-overflow: ellipsis;
-  vertical-align: middle;
-  white-space: nowrap;
-  width: 300px;
-}
-
 .ms-el-form-item :deep(.el-form-item) {
   margin-bottom: 0px;
 }
@@ -575,16 +558,16 @@ export default {
   color: white;
 }
 
-.report-bottom {
-  margin-top: 10px;
-}
-
 :deep(.report-container) {
   height: calc(100vh - 155px) !important;
   min-height: 600px;
   overflow-y: auto;
 }
 
+.ms-task-container :deep(.el-container) {
+  height: calc(100vh - 100px) !important;
+}
+
 .ms-badge-item {
   margin-top: 0px;
   margin-right: 0px;

framework/sdk-parent/frontend/src/components/task/TaskCenterItem.vue

@@ -156,23 +156,25 @@ export default {
       this.$emit("showReport", row)
     },
     getMode(mode) {
-      if (mode === 'MANUAL') {
-        return this.$t('commons.trigger_mode.manual');
-      }
-      if (mode === 'SCHEDULE') {
-        return this.$t('commons.trigger_mode.schedule');
-      }
-      if (mode === 'TEST_PLAN_SCHEDULE') {
-        return this.$t('commons.trigger_mode.schedule');
-      }
-      if (mode === 'API') {
-        return this.$t('commons.trigger_mode.api');
-      }
-      if (mode === 'BATCH') {
-        return this.$t('api_test.automation.batch_execute');
-      }
-      if (mode.startsWith('JENKINS')) {
-        return this.$t('commons.trigger_mode.api');
+      if (mode) {
+        if (mode === 'MANUAL') {
+          return this.$t('commons.trigger_mode.manual');
+        }
+        if (mode === 'SCHEDULE') {
+          return this.$t('commons.trigger_mode.schedule');
+        }
+        if (mode === 'TEST_PLAN_SCHEDULE') {
+          return this.$t('commons.trigger_mode.schedule');
+        }
+        if (mode === 'API') {
+          return this.$t('commons.trigger_mode.api');
+        }
+        if (mode === 'BATCH') {
+          return this.$t('api_test.automation.batch_execute');
+        }
+        if (mode.startsWith('JENKINS')) {
+          return this.$t('commons.trigger_mode.api');
+        }
       }
       return mode;
     },
@@ -193,46 +195,19 @@ export default {
   overflow-y: auto;
 }
 
-.align-right {
-  float: right;
-}
-
-.icon {
-  width: 24px;
-}
-
 .ms-card-task :deep(.el-card__body) {
   padding: 10px;
 }
 
-.global {
-  color: rgb(96, 98, 102);
-  font-size: 14px
-}
-
 .ms-card-task:hover {
   cursor: pointer;
   border-color: #783887;
 }
 
-.ms-header-menu {
-  padding-top: 12px;
-  width: 24px;
-}
-
-.ms-header-menu:hover {
-  cursor: pointer;
-  border-color: var(--color);
-}
-
 :deep(.el-progress-bar) {
   padding-right: 20px;
 }
 
-.item {
-  margin-right: 10px;
-}
-
 .ms-task-stop {
   color: #F56C6C;
   float: right;
@@ -258,34 +233,10 @@ export default {
   margin-bottom: 6px;
 }
 
-.ms-task-opt-btn {
-  position: fixed;
-  right: calc(98% - var(--asideWidth));
-  top: 50%;
-  z-index: 5;
-  width: 20px;
-  height: 60px;
-  padding: 3px;
-  line-height: 30px;
-  border-radius: 0 15px 15px 0;
-  background-color: #783887;
-  color: white;
-  display: inline-block;
-  cursor: pointer;
-  opacity: 0.5;
-  font-size: 10px;
-  font-weight: bold;
-  margin-left: 1px;
-}
-
 .ms-task-opt-btn i {
   margin-left: -2px;
 }
 
-.ms-task-opt-btn:hover {
-  opacity: 0.8;
-}
-
 .ms-task-opt-btn:hover i {
   margin-left: 0;
   color: white;
@@ -294,10 +245,4 @@ export default {
 .report-bottom {
   margin-top: 10px;
 }
-
-:deep(.report-container) {
-  height: calc(100vh - 155px) !important;
-  min-height: 600px;
-  overflow-y: auto;
-}
 </style>

framework/sdk-parent/sdk/src/main/java/io/metersphere/base/mapper/ext/BaseTaskMapper.java

@@ -12,7 +12,7 @@ public interface BaseTaskMapper {
     List<TaskCenterDTO> getApiTasks(@Param("request") TaskCenterRequest request);
     List<TaskCenterDTO> getScenarioTasks(@Param("request") TaskCenterRequest request);
     List<TaskCenterDTO> getPerfTasks(@Param("request") TaskCenterRequest request);
-    List<TaskCenterDTO> getUiTasks(@Param("request") TaskCenterRequest request, @Param("uiPermission") Boolean uiPermission);
+    List<TaskCenterDTO> getUiTasks(@Param("request") TaskCenterRequest request);
 
     TaskStatisticsDTO getRunningTasks(@Param("request") TaskCenterRequest request);
 

framework/sdk-parent/sdk/src/main/java/io/metersphere/base/mapper/ext/BaseTaskMapper.xml

@@ -92,7 +92,6 @@
     </select>
 
     <select id="getUiTasks" resultType="io.metersphere.task.dto.TaskCenterDTO" parameterType="java.lang.String">
-        <if test="uiPermission">
         SELECT t.id,t.name AS name ,'UI_SCENARIO' AS
             executionModule,t.report_type, ifnull(t2.name,'LOCAL') AS actuator, t1.`name` AS executor,t.create_time AS
             executionTime, t.trigger_mode AS triggerMode ,t.status AS executionStatus
@@ -113,7 +112,6 @@
                 AND t.user_id = #{request.executor}
             </if>
             ORDER BY t.create_time DESC
-        </if>
     </select>
 
     <select id="getCases" resultType="io.metersphere.task.dto.TaskCenterDTO" parameterType="java.lang.String">
@@ -167,7 +165,7 @@
         </if>
         AND t.status IN ("running","starting")
         ) as scenarioTotal ,
-        <if test="request.hasLicense">
+        <if test="request.hasLicense == true">
             (SELECT
             count( t.id )
             FROM
@@ -200,7 +198,7 @@
                 AND t.user_id = #{request.executor}
             </if>
             AND t.status IN ("running","starting")
-            ),
+            ) as uiTotal,
         </if>
         (SELECT
             count( t.id )

framework/sdk-parent/sdk/src/main/java/io/metersphere/task/service/TaskService.java

@@ -87,7 +87,7 @@ public class TaskService {
         if (CollectionUtils.isEmpty(request.getProjects())) {
             return new ArrayList<>();
         }
-        return baseTaskMapper.getUiTasks(request, checkUiPermission());
+        return baseTaskMapper.getUiTasks(request);
     }
 
     public List<TaskCenterDTO> getPerfTasks(TaskCenterRequest request) {

framework/sdk-parent/sdk/src/main/java/io/metersphere/websocket/TaskCenterWebSocket.java

@@ -102,6 +102,7 @@ public class TaskCenterWebSocket {
                 }
                 session.getBasicRemote().sendText(JSON.toJSONString(task));
                 if (task.getTotal() == 0) {
+                    session.getBasicRemote().sendText(JSON.toJSONString(task));
                     session.close();
                 }
             } catch (Exception e) {