Merge remote-tracking branch 'origin/master'

backend/src/main/java/io/metersphere/xpack

@@ -1 +1 @@
-Subproject commit cf6b06526324326a563d933e07118fac014a63b4
+Subproject commit 141ee64787b4a28ef108c5fa4dde90446de01887

frontend/src/business/components/api/report/ApiReportExport.vue

@@ -1,30 +1,35 @@
 <template>
   <el-card>
-    <div class="report-title title">接口测试报告</div>
+    <ms-report-title :title="$t('report.api_test_report')"/>
     <ms-metric-chart :content="content" :totalTime="totalTime"/>
     <div class="scenario-result" v-for="(scenario, index) in content.scenarios" :key="index" :scenario="scenario">
         <div>
-          <el-card >
+          <el-card>
             <template v-slot:header>
               {{$t('api_report.scenario_name')}}：{{scenario.name}}
             </template>
-            <div class="ms-border" v-for="(request, index) in scenario.requestResults" :key="index" :request="request">
+            <div class="ms-border clearfix" v-for="(request, index) in scenario.requestResults" :key="index" :request="request">
 
-              <div class="request-left">
+              <div class="request-top">
-                <api-report-reqest-header-item :title="request.name">
+                <div>
-                  <span class="url"> {{request.url}}</span>
+                  {{request.name}}
-                </api-report-reqest-header-item>
+                </div>
+                <div class="url">
+                  {{request.url}}
+                </div>
               </div>
 
+              <el-divider/>
 
-              <div class="request-right">
+
+              <div class="request-bottom">
 
                 <api-report-reqest-header-item :title="$t('api_test.request.method')">
                   <span class="method"> {{request.method}}</span>
                 </api-report-reqest-header-item>
 
                 <api-report-reqest-header-item :title="$t('api_report.response_time')">
-                  {{request.responseResult.responseTime}}
+                  {{request.responseResult.responseTime}} ms
                 </api-report-reqest-header-item>
 
                 <api-report-reqest-header-item :title="$t('api_report.latency')">
@@ -36,11 +41,11 @@
                 </api-report-reqest-header-item>
 
                 <api-report-reqest-header-item :title="$t('api_report.response_size')">
-                  {{request.responseResult.latency}} ms
+                  {{request.responseResult.responseSize}} bytes
                 </api-report-reqest-header-item>
 
                 <api-report-reqest-header-item :title="$t('api_report.error')">
-                  {{request.responseResult.responseSize}} bytes
+                  {{request.error}}
                 </api-report-reqest-header-item>
 
                 <api-report-reqest-header-item :title="$t('api_report.assertions')">
@@ -72,9 +77,10 @@
     import MsRequestResultTail from "./components/RequestResultTail";
     import ApiReportReqestHeaderItem from "./ApiReportReqestHeaderItem";
     import MsMetricChart from "./components/MetricChart";
+    import MsReportTitle from "../../common/components/MsReportTitle";
     export default {
       name: "MsApiReportExport",
-      components: {MsMetricChart, ApiReportReqestHeaderItem, MsRequestResultTail, MsScenarioResult},
+      components: {MsReportTitle, MsMetricChart, ApiReportReqestHeaderItem, MsRequestResultTail, MsScenarioResult},
       props: {
         content: Object,
         totalTime: Number
@@ -99,27 +105,10 @@
     font-weight: 500;
   }
 
-  .request-right {
+  .request-top,.request-bottom {
-    float: right;
-  }
-
-  .request-left {
-    float: left;
     margin-left: 20px;
   }
 
-  .ms-border {
-    height: 60px;
-  }
-
-  .report-title {
-    font-size: 30px;
-    font-weight: bold;
-    height: 50px;
-    text-align: center;
-    margin-bottom: 20px;
-  }
-
   .url {
     color: #409EFF;
     font-size: 14px;
@@ -133,4 +122,8 @@
     border-style: none;
   }
 
+  .request-top div {
+    margin-top: 10px;
+  }
+
 </style>

frontend/src/business/components/api/test/components/request/condition/IfController.vue

@@ -6,12 +6,13 @@
         <el-input size="small" v-model="controller.variable" :placeholder="$t('api_test.request.condition_variable')"/>
       </el-col>
       <el-col :span="5">
-        <el-select v-model="controller.operator" :placeholder="$t('commons.please_select')" size="small">
+        <el-select v-model="controller.operator" :placeholder="$t('commons.please_select')" size="small"
+                   @change="change">
           <el-option v-for="o in operators" :key="o.value" :label="$t(o.label)" :value="o.value"/>
         </el-select>
       </el-col>
       <el-col :span="6">
-        <el-input size="small" v-model="controller.value" :placeholder="$t('api_test.value')"/>
+        <el-input size="small" v-model="controller.value" :placeholder="$t('api_test.value')" v-if="!hasNullOperator"/>
       </el-col>
       <el-col :span="4">
         <el-switch v-model="controller.enable" :inactive-text="$t('api_test.scenario.enable_disable')"/>
@@ -58,6 +59,14 @@ export default {
         LT: {
           label: "commons.adv_search.operators.lt",
           value: "<"
+        },
+        IS_NULL: {
+          label: "commons.adv_search.operators.is_null",
+          value: "is null"
+        },
+        IS_NOT_NULL: {
+          label: "commons.adv_search.operators.is_not_null",
+          value: "is not null"
         }
       }
     }
@@ -78,6 +87,16 @@ export default {
     remove() {
       this.controller = new IfController();
       this.visible = false;
+    },
+    change(value) {
+      if (value.indexOf("null") > 0) {
+        this.controller.value = "";
+      }
+    }
+  },
+  computed: {
+    hasNullOperator() {
+      return !!this.controller.operator && this.controller.operator.indexOf("null") > 0;
     }
   }
 }

frontend/src/business/components/api/test/model/ScenarioModel.js

@@ -873,14 +873,17 @@ export class IfController extends Controller {
   }
 
   isValid() {
+    if (!!this.operator && this.operator.indexOf("null") > 0) {
+      return !!this.variable && !!this.operator;
+    }
     return !!this.variable && !!this.operator && !!this.value;
   }
 
   label() {
     if (this.isValid()) {
       let label = this.variable;
-      label += " " + this.operator;
+      if (this.operator) label += " " + this.operator;
-      label += " " + this.value;
+      if (this.value) label += " " + this.value;
       return label;
     }
     return "";
@@ -1234,6 +1237,18 @@ class JMXGenerator {
           value = "\".*" + value + ".*\"";
         }
 
+        if (operator === "is null") {
+          variable = "empty(\"" + variable + "\")";
+          operator = "";
+          value = "";
+        }
+
+        if (operator === "is not null") {
+          variable = "!empty(\"" + variable + "\")";
+          operator = "";
+          value = "";
+        }
+
         let condition = "${__jexl3(" + variable + operator + value + ")}";
         let controller = new JMXIfController(name, {condition: condition});
         controller.put(sampler);

frontend/src/business/components/common/components/MsReportTitle.vue

@@ -0,0 +1,22 @@
+<template>
+  <div class="report-title title">{{title}}</div>
+</template>
+
+<script>
+    export default {
+      name: "MsReportTitle",
+      props: {title: String}
+    }
+</script>
+
+<style scoped>
+
+  .report-title {
+    font-size: 30px;
+    font-weight: bold;
+    height: 50px;
+    text-align: center;
+    margin-bottom: 20px;
+  }
+
+</style>

frontend/src/business/components/common/components/MsScheduleEdit.vue

@@ -12,11 +12,11 @@
                 <el-input :disabled="isReadOnly" v-model="form.cronValue" class="inp"
                           :placeholder="$t('schedule.please_input_cron_expression')"/>
                 <!--          <el-button type="primary" @click="showCronDialog">{{$t('schedule.generate_expression')}}</el-button>-->
-                <el-button :disabled="isReadOnly" type="primary" @click="saveCron">{{$t('commons.save')}}</el-button>
+                <el-button :disabled="isReadOnly" type="primary" @click="saveCron">{{ $t('commons.save') }}</el-button>
               </el-form-item>
               <el-form-item>
                 <el-link :disabled="isReadOnly" type="primary" @click="showCronDialog">
-                  {{$t('schedule.generate_expression')}}
+                  {{ $t('schedule.generate_expression') }}
                 </el-link>
               </el-form-item>
               <crontab-result :ex="form.cronValue" ref="crontabResult"/>
@@ -71,7 +71,9 @@
                   </template>
                 </el-table-column>
               </el-table>
-              <el-button  type="primary" @click="saveNotice">{{$t('commons.save')}}</el-button>
+              <div style="padding-top: 20px;">
+                <el-button type="primary" @click="saveNotice">{{ $t('commons.save') }}</el-button>
+              </div>
             </template>
           </el-tab-pane>
         </el-tabs>
@@ -82,177 +84,177 @@
 
 <script>
 
-  import Crontab from "../cron/Crontab";
+import Crontab from "../cron/Crontab";
-  import CrontabResult from "../cron/CrontabResult";
+import CrontabResult from "../cron/CrontabResult";
-  import {cronValidate} from "@/common/js/cron";
+import {cronValidate} from "@/common/js/cron";
-  import {listenGoBack, removeGoBackListener} from "@/common/js/utils";
+import {listenGoBack, removeGoBackListener} from "@/common/js/utils";
 
-  function defaultCustomValidate() {
+function defaultCustomValidate() {
-    return {pass: true};
+  return {pass: true};
-  }
+}
 
-  export default {
+export default {
-    name: "MsScheduleEdit",
+  name: "MsScheduleEdit",
-    components: {CrontabResult, Crontab},
+  components: {CrontabResult, Crontab},
-    props: {
+  props: {
-      testId: String,
+    testId: String,
-      save: Function,
+    save: Function,
-      schedule: {},
+    schedule: {},
-      customValidate: {
+    customValidate: {
-        type: Function,
+      type: Function,
-        default: defaultCustomValidate
+      default: defaultCustomValidate
-      },
-      isReadOnly: {
-        type: Boolean,
-        default: false
-      },
     },
+    isReadOnly: {
+      type: Boolean,
+      default: false
+    },
+  },
 
 
-    watch: {
+  watch: {
-      'schedule.value'() {
+    'schedule.value'() {
-        this.form.cronValue = this.schedule.value;
+      this.form.cronValue = this.schedule.value;
+    }
+  },
+  data() {
+    const validateCron = (rule, cronValue, callback) => {
+      let customValidate = this.customValidate(this.getIntervalTime());
+      if (!cronValue) {
+        callback(new Error(this.$t('commons.input_content')));
+      } else if (!cronValidate(cronValue)) {
+        callback(new Error(this.$t('schedule.cron_expression_format_error')));
       }
-    },
+        // else if(!this.intervalShortValidate()) {
-    data() {
+        //   callback(new Error(this.$t('schedule.cron_expression_interval_short_error')));
-      const validateCron = (rule, cronValue, callback) => {
+      // }
-        let customValidate = this.customValidate(this.getIntervalTime());
+      else if (!customValidate.pass) {
-        if (!cronValue) {
+        callback(new Error(customValidate.info));
-          callback(new Error(this.$t('commons.input_content')));
+      } else {
-        } else if (!cronValidate(cronValue)) {
+        callback();
-          callback(new Error(this.$t('schedule.cron_expression_format_error')));
+      }
-        }
+    };
-          // else if(!this.intervalShortValidate()) {
+    return {
-          //   callback(new Error(this.$t('schedule.cron_expression_interval_short_error')));
+      operation: true,
-        // }
+      dialogVisible: false,
-        else if (!customValidate.pass) {
+      showCron: false,
-          callback(new Error(customValidate.info));
+      form: {
-        } else {
+        cronValue: ""
-          callback();
+      },
-        }
+      tableData: [
-      };
+        {
-      return {
+          event: "执行成功",
-        operation: true,
+          names: [],
-        dialogVisible: false,
+          email: "邮箱",
-        showCron: false,
+          enable: false
-        form: {
-          cronValue: ""
         },
-        tableData: [
+        {
-          {
+          event: "执行失败",
-            event: "执行成功",
+          names: [],
-            names: [],
+          email: "邮箱",
-            email: "邮箱",
+          enable: false
-            enable: false
-          },
-          {
-            event: "执行失败",
-            names: [],
-            email: "邮箱",
-            enable: false
-          }
-        ],
-        options: [{}],
-        enable: true,
-        email: "",
-        activeName: 'first',
-        rules: {
-          cronValue: [{required: true, validator: validateCron, trigger: 'blur'}],
         }
-      }
+      ],
-    },
+      options: [{}],
-    methods: {
+      enable: true,
-      userList() {
+      email: "",
-        this.result = this.$get('user/list', response => {
+      activeName: 'first',
-          this.options = response.data
+      rules: {
-        })
+        cronValue: [{required: true, validator: validateCron, trigger: 'blur'}],
-      },
-      handleClick() {
-        if (this.activeName == "second") {
-          this.result = this.$get('notice/query/' + this.testId, response => {
-            if (response.data.length > 0) {
-              this.tableData = response.data
-            }
-          })
-        }
-      },
-      buildParam() {
-        let param = {};
-        param.notices = this.tableData
-        param.testId = this.testId
-        return param;
-      },
-      open() {
-        this.dialogVisible = true;
-        this.form.cronValue = this.schedule.value;
-        listenGoBack(this.close);
-        this.handleClick()
-        this.activeName = 'first'
-      },
-      crontabFill(value, resultList) {
-        //确定后回传的值
-        this.form.cronValue = value;
-        this.$refs.crontabResult.resultList = resultList;
-        this.$refs['from'].validate();
-      },
-      showCronDialog() {
-        this.showCron = true;
-      },
-      saveCron() {
-        this.$refs['from'].validate((valid) => {
-          if (valid) {
-            this.intervalShortValidate();
-            this.save(this.form.cronValue);
-            this.dialogVisible = false;
-          } else {
-            return false;
-          }
-        });
-      },
-      saveNotice(){
-        let param = this.buildParam();
-        this.result = this.$post("notice/save", param, () => {
-          this.$success(this.$t('commons.save_success'));
-        })
-      },
-      close() {
-        this.dialogVisible = false;
-        this.form.cronValue = '';
-        this.$refs['from'].resetFields();
-        if (!this.schedule.value) {
-          this.$refs.crontabResult.resultList = [];
-        }
-        removeGoBackListener(this.close);
-      },
-      intervalShortValidate() {
-        if (this.getIntervalTime() < 3 * 60 * 1000) {
-          // return false;
-          this.$info(this.$t('schedule.cron_expression_interval_short_error'));
-        }
-        return true;
-      },
-      resultListChange() {
-        this.$refs['from'].validate();
-      },
-      getIntervalTime() {
-        let resultList = this.$refs.crontabResult.resultList;
-        let time1 = new Date(resultList[0]);
-        let time2 = new Date(resultList[1]);
-        return time2 - time1;
       }
     }
+  },
+  methods: {
+    userList() {
+      this.result = this.$get('user/list', response => {
+        this.options = response.data
+      })
+    },
+    handleClick() {
+      if (this.activeName == "second") {
+        this.result = this.$get('notice/query/' + this.testId, response => {
+          if (response.data.length > 0) {
+            this.tableData = response.data
+          }
+        })
+      }
+    },
+    buildParam() {
+      let param = {};
+      param.notices = this.tableData
+      param.testId = this.testId
+      return param;
+    },
+    open() {
+      this.dialogVisible = true;
+      this.form.cronValue = this.schedule.value;
+      listenGoBack(this.close);
+      this.handleClick()
+      this.activeName = 'first'
+    },
+    crontabFill(value, resultList) {
+      //确定后回传的值
+      this.form.cronValue = value;
+      this.$refs.crontabResult.resultList = resultList;
+      this.$refs['from'].validate();
+    },
+    showCronDialog() {
+      this.showCron = true;
+    },
+    saveCron() {
+      this.$refs['from'].validate((valid) => {
+        if (valid) {
+          this.intervalShortValidate();
+          this.save(this.form.cronValue);
+          this.dialogVisible = false;
+        } else {
+          return false;
+        }
+      });
+    },
+    saveNotice() {
+      let param = this.buildParam();
+      this.result = this.$post("notice/save", param, () => {
+        this.$success(this.$t('commons.save_success'));
+      })
+    },
+    close() {
+      this.dialogVisible = false;
+      this.form.cronValue = '';
+      this.$refs['from'].resetFields();
+      if (!this.schedule.value) {
+        this.$refs.crontabResult.resultList = [];
+      }
+      removeGoBackListener(this.close);
+    },
+    intervalShortValidate() {
+      if (this.getIntervalTime() < 3 * 60 * 1000) {
+        // return false;
+        this.$info(this.$t('schedule.cron_expression_interval_short_error'));
+      }
+      return true;
+    },
+    resultListChange() {
+      this.$refs['from'].validate();
+    },
+    getIntervalTime() {
+      let resultList = this.$refs.crontabResult.resultList;
+      let time1 = new Date(resultList[0]);
+      let time2 = new Date(resultList[1]);
+      return time2 - time1;
+    }
   }
+}
 </script>
 
 <style scoped>
 
-  .inp {
+.inp {
-    width: 50%;
+  width: 50%;
-    margin-right: 20px;
+  margin-right: 20px;
-  }
+}
 
-  .el-form-item {
+.el-form-item {
-    margin-bottom: 10px;
+  margin-bottom: 10px;
-  }
+}
 
 </style>

frontend/src/business/components/common/router/router.js

@@ -26,6 +26,9 @@ const router = new VueRouter({
 });
 
 router.beforeEach((to, from, next) => {
+
+  redirectLoginPath(to.fullPath);
+
   //解决localStorage清空，cookie没失效导致的卡死问题
   if (!localStorage.getItem('Admin-Token')) {
     axios.get("/signout");
@@ -38,4 +41,17 @@ router.beforeEach((to, from, next) => {
   }
 });
 
+// 登入后跳转至原路径
+function redirectLoginPath(originPath) {
+  let redirectUrl = sessionStorage.getItem('redirectUrl');
+  let loginSuccess = sessionStorage.getItem('loginSuccess');
+  sessionStorage.setItem('redirectUrl', originPath);
+  if (redirectUrl && loginSuccess) {
+    sessionStorage.removeItem('loginSuccess');
+    router.push(redirectUrl);
+  }
+  sessionStorage.removeItem('loginSuccess');
+}
+
+
 export default router

frontend/src/business/components/performance/report/PerformanceReportExport.vue

@@ -0,0 +1,54 @@
+<template>
+  <el-card class="report-export">
+    <ms-report-title :title="$t('report.load_test_report')"/>
+    <el-card id="testOverview">
+      <template v-slot:header >
+        <span class="title">{{$t('report.test_overview')}}</span>
+      </template>
+      <ms-report-test-overview :report="report" ref="testOverview"/>
+    </el-card>
+    <el-card id="requestStatistics" title="'requestStatistics'">
+      <template v-slot:header >
+        <span class="title">{{$t('report.test_request_statistics')}}</span>
+      </template>
+      <ms-report-request-statistics :report="report" ref="requestStatistics"/>
+    </el-card>
+    <el-card id="errorLog" title="'errorLog'">
+      <template v-slot:header >
+        <span class="title">{{$t('report.test_error_log')}}</span>
+      </template>
+      <ms-report-error-log :report="report" ref="errorLog"/>
+    </el-card>
+  </el-card>
+</template>
+
+<script>
+
+  import MsReportErrorLog from './components/ErrorLog';
+  import MsReportRequestStatistics from './components/RequestStatistics';
+  import MsReportTestOverview from './components/TestOverview';
+
+  import {checkoutTestManagerOrTestUser} from "@/common/js/utils";
+  import MsPerformanceReportExport from "./PerformanceReportExport";
+  import MsReportTitle from "../../common/components/MsReportTitle";
+
+
+  export default {
+    name: "MsPerformanceReportExport",
+    components: {
+      MsReportTitle,
+      MsReportErrorLog,
+      MsReportRequestStatistics,
+      MsReportTestOverview,
+    },
+    props: ['report']
+  }
+</script>
+
+<style scoped>
+
+  .report-export .el-card {
+    margin-top: 20px;
+  }
+
+</style>

frontend/src/business/components/performance/report/PerformanceReportView.vue

@@ -22,8 +22,8 @@
                          @click="rerun(testId)">
                 {{ $t('report.test_execute_again') }}
               </el-button>
-              <el-button :disabled="isReadOnly" type="info" plain size="mini" @click="exportReport(reportName)">
+              <el-button :disabled="isReadOnly" type="info" plain size="mini" @click="handleExport(reportName)">
-                 {{$t('report.export')}}
+                 {{$t('test_track.plan_view.export_report')}}
               </el-button>
 
               <!--<el-button :disabled="isReadOnly" type="warning" plain size="mini">-->
@@ -65,26 +65,7 @@
           </el-tabs>
         </div>
 
-        <div class="report-export" v-show="reportExportVisible">
+        <ms-performance-report-export id="performanceReportExport" v-show="reportExportVisible" :report="report"/>
-          <el-card id="testOverview">
-            <template v-slot:header >
-              <span class="title">{{$t('report.test_overview')}}</span>
-            </template>
-            <ms-report-test-overview :report="report" ref="testOverview"/>
-          </el-card>
-          <el-card id="requestStatistics" title="'requestStatistics'">
-            <template v-slot:header >
-              <span class="title">{{$t('report.test_request_statistics')}}</span>
-            </template>
-            <ms-report-request-statistics :report="report" ref="requestStatistics"/>
-          </el-card>
-          <el-card id="errorLog" title="'errorLog'">
-            <template v-slot:header >
-              <span class="title">{{$t('report.test_error_log')}}</span>
-            </template>
-            <ms-report-error-log :report="report" ref="errorLog"/>
-          </el-card>
-        </div>
 
       </el-card>
       <el-dialog :title="$t('report.test_stop_now_confirm')" :visible.sync="dialogFormVisible" width="30%">
@@ -113,11 +94,13 @@ import MsMainContainer from "../../common/components/MsMainContainer";
 import {checkoutTestManagerOrTestUser} from "@/common/js/utils";
 import {exportPdf} from "../../../../common/js/utils";
 import html2canvas from 'html2canvas';
+import MsPerformanceReportExport from "./PerformanceReportExport";
 
 
 export default {
   name: "PerformanceReportView",
   components: {
+    MsPerformanceReportExport,
     MsReportErrorLog,
     MsReportLogDetails,
     MsReportRequestStatistics,
@@ -147,7 +130,6 @@ export default {
       websocket: null,
       dialogFormVisible: false,
       reportExportVisible: false,
-      isShow: true,
       testPlan: {testResourcePoolId: null}
     }
   },
@@ -273,41 +255,25 @@ export default {
       this.initReportTimeInfo();
       window.console.log("socket closed.");
     },
-    exportReport(name) {
+    handleExport(name) {
-      this.result = {loading: true};
+      this.result.loading = true;
-      let result = this.result;
-      result.loading = true;
       this.reportExportVisible = true;
-      let promises = [];
-      let canvasList = new Array(3);
       let reset = this.exportReportReset;
+
       this.$nextTick(function () {
         setTimeout(() => {
-          promises.push(this.getCanvasPromise('testOverview', 0, canvasList));
+          html2canvas(document.getElementById('performanceReportExport'), {
-          promises.push(this.getCanvasPromise('requestStatistics', 1, canvasList));
+            scale: 2
-          promises.push(this.getCanvasPromise('errorLog', 2, canvasList));
+          }).then(function(canvas) {
-
+            exportPdf(name, [canvas]);
-          Promise.all(promises).then(function (info) {
-            exportPdf(name, canvasList);
-            result.loading = false;
             reset();
           });
         }, 1000);
-      })
+      });
     },
     exportReportReset() {
       this.reportExportVisible = false;
-      this.isShow = true;
+      this.result.loading = false;
-    },
-    getCanvasPromise(id, index, canvasList) {
-      return new Promise(function(resolve, reject) {
-        html2canvas(document.getElementById(id), {
-          scale: 2
-        }).then(function(canvas) {
-          canvasList[index] = canvas;
-          resolve('success');
-        });
-      });
     },
   },
   created() {

frontend/src/business/components/settings/SettingMenuBackup.vue

@@ -1,96 +0,0 @@
-<template>
-  <el-menu menu-trigger="click" :default-active="$route.path" router>
-    <el-submenu index="1" v-permission="['admin']">
-      <template v-slot:title>
-        <font-awesome-icon class="icon account" :icon="['far', 'address-card']" size="lg"/>
-        <span>{{$t('commons.system')}}</span>
-      </template>
-      <el-menu-item index="/setting/user">{{$t('commons.user')}}</el-menu-item>
-      <el-menu-item index="/setting/organization">{{$t('commons.organization')}}</el-menu-item>
-      <el-menu-item index="/setting/systemworkspace">{{$t('commons.workspace')}}</el-menu-item>
-      <el-menu-item index="/setting/testresourcepool">{{$t('commons.test_resource_pool')}}</el-menu-item>
-      <el-menu-item index="/setting/systemparametersetting">{{$t('commons.system_parameter_setting')}}</el-menu-item>
-    </el-submenu>
-
-    <el-submenu index="2" v-permission="['org_admin']" v-if="isCurrentOrganizationAdmin">
-      <template v-slot:title>
-        <font-awesome-icon class="icon organization" :icon="['far', 'building']" size="lg"/>
-        <span>{{$t('commons.organization')}}</span>
-      </template>
-      <el-menu-item index="/setting/organizationmember" v-permission="['org_admin']">{{$t('commons.member')}}
-      </el-menu-item>
-      <el-menu-item index="/setting/organizationworkspace" v-permission="['org_admin']">{{$t('commons.workspace')}}
-      </el-menu-item>
-      <el-menu-item index="/setting/serviceintegration" v-permission="['org_admin']">{{$t('organization.service_integration')}}
-      </el-menu-item>
-    </el-submenu>
-
-    <el-submenu index="3" v-permission="['test_manager']" v-if="isCurrentWorkspaceUser">
-      <template v-slot:title>
-        <font-awesome-icon class="icon workspace" :icon="['far', 'list-alt']" size="lg"/>
-        <span>{{$t('commons.workspace')}}</span>
-      </template>
-      <el-menu-item index="/setting/member">{{$t('commons.member')}}</el-menu-item>
-      <el-menu-item index="/setting/testcase/report/template">{{$t('test_track.plan_view.report_template')}}
-      </el-menu-item>
-    </el-submenu>
-
-    <el-submenu index="4">
-      <template v-slot:title>
-        <font-awesome-icon class="icon" :icon="['far', 'user']" size="lg"/>
-        <span>{{$t('commons.personal_info')}}</span>
-      </template>
-      <el-menu-item index="/setting/personsetting">{{$t('commons.personal_setting')}}</el-menu-item>
-      <el-menu-item v-permission="['admin', 'org_admin', 'test_manager', 'test_user', 'test_viewer']"
-                    index="/setting/apikeys">API Keys
-      </el-menu-item>
-    </el-submenu>
-
-  </el-menu>
-</template>
-
-<script>
-  import {checkoutCurrentOrganization, checkoutCurrentWorkspace} from "../../../common/js/utils";
-
-  export default {
-    name: "MsSettingMenuBackup",
-    data() {
-      return {
-        isCurrentOrganizationAdmin: false,
-        isCurrentWorkspaceUser: false,
-      }
-    },
-    mounted() {
-      this.isCurrentOrganizationAdmin = checkoutCurrentOrganization();
-      this.isCurrentWorkspaceUser = checkoutCurrentWorkspace();
-    },
-  }
-</script>
-
-<style scoped>
-  .el-menu {
-    border-right: 0;
-  }
-
-  .el-menu-item {
-    height: 40px;
-    line-height: 40px;
-  }
-
-  .icon {
-    width: 24px;
-    margin-right: 10px;
-  }
-
-  .account {
-    color: #5a78f0;
-  }
-
-  .organization {
-    color: #b33a5b;
-  }
-
-  .workspace {
-    color: #44b349;
-  }
-</style>

frontend/src/business/components/track/case/components/TestCaseImport.vue

@@ -113,6 +113,7 @@
   import MsTableButton from '../../../../components/common/components/MsTableButton';
   import {listenGoBack, removeGoBackListener} from "../../../../../common/js/utils";
   import {TokenKey, WORKSPACE_ID} from '../../../../../common/js/constants';
+  import axios from "axios";
 
   export default {
     name: "TestCaseImport",
@@ -188,7 +189,14 @@
         this.$fileDownload('/test/case/export/template');
       },
       downloadXmindTemplate() {
-        this.$fileDownload('/test/case/export/xmindTemplate');
+        axios.get('/test/case/export/xmindTemplate', {responseType: 'blob'})
+          .then(response => {
+            let fileName = window.decodeURI(response.headers['content-disposition'].split('=')[1]);
+            let link = document.createElement("a");
+            link.href = window.URL.createObjectURL(new Blob([response.data]));
+            link.download = fileName;
+            link.click();
+          });
       },
       upload(file) {
         this.isLoading = false;

frontend/src/business/components/track/plan/view/comonents/report/TestCaseReportView.vue

@@ -33,8 +33,11 @@
 
         <div class="container" ref="resume" id="app">
           <el-main>
-            <div v-for="(item, index) in previews" :key="item.id" id="reportViewpp">
+            <div id="reportViewpp" :class="{'report-export' : reportExportVisible}">
-              <template-component :isReportView="true" :metric="metric" :preview="item" :index="index" ref="templateComponent"/>
+              <ms-report-title v-if="reportExportVisible" :title="$t('report.test_plan_report')"/>
+              <div v-for="(item, index) in previews" :key="item.id">
+                <template-component :isReportView="true" :metric="metric" :preview="item" :index="index" ref="templateComponent"/>
+              </div>
             </div>
           </el-main>
         </div>
@@ -52,10 +55,13 @@
   import RichTextComponent from "./TemplateComponent/RichTextComponent";
   import TestCaseReportTemplateEdit from "./TestCaseReportTemplateEdit";
   import TemplateComponent from "./TemplateComponent/TemplateComponent";
+  import html2canvas from "html2canvas";
+  import MsReportTitle from "../../../../../common/components/MsReportTitle";
 
   export default {
     name: "TestCaseReportView",
     components: {
+      MsReportTitle,
       TemplateComponent,
       TestCaseReportTemplateEdit,
       RichTextComponent, TestResultComponent, TestResultChartComponent, BaseInfoComponent
@@ -70,6 +76,7 @@
         reportId: '',
         metric: {},
         planId: '',
+        reportExportVisible: false,
         componentMap: new Map(
           [
             [1, {name: this.$t('test_track.plan_view.base_info'), id: 1, type: 'system'}],
@@ -198,23 +205,26 @@
           }
         });
       },
-      /*导出报告*/
       handleExport(name) {
+        this.result.loading = true;
+        this.reportExportVisible = true;
+        let reset = this.exportReportReset;
 
-        let result = this.result;
+        this.$nextTick(function () {
-        result.loading = true;
+          setTimeout(() => {
-
+            html2canvas(document.getElementById('reportViewpp'), {
-        let promises = [];
+              scale: 2
-        let canvasList = new Array(this.previews.length);
+            }).then(function(canvas) {
-
+              exportPdf(name, [canvas]);
-        for (let item of this.$refs.templateComponent) {
+              reset();
-          promises.push(item.getCanvas(canvasList));
+            });
-        }
+          }, 1000);
-
-        Promise.all(promises).then(function (info) {
-          exportPdf(name, canvasList);
-          result.loading = false;
         });
+
+      },
+      exportReportReset() {
+        this.reportExportVisible = false;
+        this.result.loading = false;
       },
     }
   }
@@ -250,4 +260,14 @@
     text-align: right;
   }
 
+  .report-export {
+    padding: 20px 30px;
+    background: white;
+  }
+
+  .report-export >>> .template-component {
+    width: 100%;
+    margin-top: 20px;
+  }
+
 </style>

frontend/src/business/components/track/review/view/components/TestReviewTestCaseEdit.vue

@@ -29,17 +29,6 @@
 
                     <el-col :span="12" class="head-right">
 
-                <span class="head-right-tip" v-if="index + 1 === testCases.length">
-                  {{ $t('test_track.plan_view.pre_case') }} : {{
-                    testCases[index - 1] ? testCases[index - 1].name : ''
-                  }}
-                </span>
-                      <span class="head-right-tip" v-if="index + 1 !== testCases.length">
-                  {{ $t('test_track.plan_view.next_case') }} : {{
-                          testCases[index + 1] ? testCases[index + 1].name : ''
-                        }}
-                </span>
-
                       <el-button plain size="mini" icon="el-icon-arrow-up"
                                  :disabled="index + 1 <= 1"
                                  @click="handlePre()"/>

frontend/src/common/js/ajax.js

@@ -136,7 +136,7 @@ export default {
         .then(response => {
           let fileName = window.decodeURI(response.headers['content-disposition'].split('=')[1]);
           let link = document.createElement("a");
-          link.href = window.URL.createObjectURL(new Blob([response.data]));
+          link.href = window.URL.createObjectURL(new Blob([response.data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"}));
           link.download = fileName;
           link.click();
         });

frontend/src/i18n/en-US.js

@@ -142,6 +142,8 @@ export default {
       and: 'All',
       or: 'any one',
       operators: {
+        is_null: "Is null",
+        is_not_null: "Is not null",
         like: "Contains",
         not_like: "Not included",
         in: "Belong to",
@@ -292,6 +294,9 @@ export default {
     add: 'Add Role',
   },
   report: {
+    api_test_report: 'Api Test Report',
+    load_test_report: 'Load Test Report',
+    test_plan_report: 'Test Plan Report',
     recent: 'Recent Report',
     search_by_name: 'Search by Name',
     test_name: 'Test',

frontend/src/i18n/zh-CN.js

@@ -142,6 +142,8 @@ export default {
       and: '所有',
       or: '任意一个',
       operators: {
+        is_null: "空",
+        is_not_null: "非空",
         like: "包含",
         not_like: "不包含",
         in: "属于",
@@ -292,6 +294,9 @@ export default {
     add: '添加角色',
   },
   report: {
+    api_test_report: '接口测试报告',
+    load_test_report: '性能测试报告',
+    test_plan_report: '测试计划报告',
     recent: '最近的报告',
     search_by_name: '根据名称搜索',
     test_name: '所属测试',

frontend/src/i18n/zh-TW.js

@@ -142,6 +142,8 @@ export default {
       and: '所有',
       or: '任意壹個',
       operators: {
+        is_null: "空",
+        is_not_null: "非空",
         like: "包含",
         not_like: "不包含",
         in: "屬於",
@@ -292,6 +294,9 @@ export default {
     add: '添加角色',
   },
   report: {
+    api_test_report: '接口測試報告',
+    load_test_report: '性能測試報告',
+    test_plan_report: '測試計劃報告',
     recent: '最近的報告',
     search_by_name: '根據名稱搜索',
     test_name: '所屬測試',