date picker

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

@@ -2,7 +2,7 @@
 
     <div class="dialog-footer">
       <el-button @click="cancel">取 消</el-button>
-      <el-button type="primary" @click="confirm">确 定</el-button>
+      <el-button type="primary" @click="confirm" @keydown.enter.native.prevent>确 定</el-button>
     </div>
 
 </template>

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

@@ -2,7 +2,8 @@
   <div v-loading="result.loading">
     <el-tabs type="border-card" :stretch="true">
       <el-tab-pane v-for="(item, key) in logContent" :key="key" :label="key" class="logging-content">
-        {{item}}
+        {{item.substring(0, 2048) }}...
+        <el-link type="primary" @click="downloadLogFile(item)">{{$t('load_test.download_log_file')}}</el-link>
       </el-tab-pane>
     </el-tabs>
   </div>
@@ -23,6 +24,22 @@
         this.result = this.$get("/performance/report/log/" + this.id, res => {
           this.logContent = res.data;
         })
+      },
+      downloadLogFile(content) {
+        const filename = 'jmeter.log'
+        const blob = new Blob([content]);
+        if ("download" in document.createElement("a")) {
+          // 非IE下载
+          //  chrome/firefox
+          let aTag = document.createElement('a');
+          aTag.download = filename;
+          aTag.href = URL.createObjectURL(blob);
+          aTag.click();
+          URL.revokeObjectURL(aTag.href)
+        } else {
+          // IE10+下载
+          navigator.msSaveBlob(blob, filename);
+        }
       }
     },
     watch: {

frontend/src/business/components/performance/test/components/PerformanceAdvancedConfig.vue

 <template>
   <div>
-
     <el-row type="flex" justify="start">
       <el-col :span="8">
         <h3>{{$t('load_test.domain_bind')}}</h3>
-      </el-col>
-      <el-col :span="8">
-        <el-button type="primary" plain size="mini" @click="add('domains')">{{$t('commons.add')}}</el-button>
+        <el-button type="el-icon-circle-plus-outline" plain size="mini" @click="add('domains')">{{$t('commons.add')}}</el-button>
       </el-col>
     </el-row>
     <!-- -->
     <el-row>
-      <el-table :data="domains">
+      <el-col :span="20">
+      <el-table :data="domains" size="mini"  class="tb-edit" align="center" border highlight-current-row>
         <el-table-column
+          align="center"
           :label="$t('load_test.domain')"
           show-overflow-tooltip>
           <template v-slot:default="{row}">
-            <template v-if="row.edit">
-              <el-input v-model="row.domain" class="edit-input" size="mini"/>
-            </template>
-            <span v-else>{{ row.domain }}</span>
+            <el-input
+              size="mini"
+              v-if="readOnly"
+              type="textarea"
+              :rows="1"
+              class="edit-input"
+              v-model="row.domain"
+              :placeholder="$t('load_test.domain')"
+              clearable>
+            </el-input>
+            <span >{{row.domain}}</span>
           </template>
         </el-table-column>
         <el-table-column
+          align="center"
           :label="$t('load_test.enable')"
           show-overflow-tooltip>
           <template v-slot:default="{row}">
@@ -31,46 +38,36 @@
               size="mini"
               v-model="row.enable"
               active-color="#13ce66"
-              inactive-color="#ff4949">
+              inactive-color="#ff4949"
+              @click="confirmEdit(row)"
+            >
             </el-switch>
           </template>
         </el-table-column>
         <el-table-column
+          align="center"
           :label="$t('load_test.ip')"
           show-overflow-tooltip>
           <template v-slot:default="{row}">
-            <template v-if="row.edit">
-              <el-input v-model="row.ip" class="edit-input" size="mini"/>
-            </template>
-            <span v-else>{{ row.ip }}</span>
+            <el-input
+              size="mini"
+              v-if="readOnly"
+              type="textarea"
+              class="edit-input"
+              :rows="1"
+              v-model="row.ip"
+              :placeholder="$t('load_test.ip')"
+              clearable></el-input>
+            <span>{{row.ip}}</span>
           </template>
         </el-table-column>
-        <el-table-column align="center">
+        <el-table-column align="center" :label="$t('load_test.operating')">
           <template v-slot:default="{row, $index}">
-            <template v-if="row.edit">
-              <el-button
-                class="cancel-btn"
-                size="mini"
-                icon="el-icon-refresh"
-                type="warning"
-                circle
-                @click="cancelEdit(row)">
-              </el-button>
-              <el-button
-                type="success"
-                size="mini"
-                icon="el-icon-circle-check"
-                circle
-                @click="confirmEdit(row)">
-              </el-button>
-            </template>
             <el-button
-              v-else
               type="primary"
-              size="mini"
-              icon="el-icon-edit"
-              circle
-              @click="edit(row)">
+              icon="el-icon-plus"
+              circle size="mini"
+              @click="add('domains')">
             </el-button>
             <el-button
               type="danger"
@@ -82,31 +79,39 @@
           </template>
         </el-table-column>
       </el-table>
-
+      </el-col>
     </el-row>
 
     <el-row>
       <el-col :span="8">
         <h3>{{$t('load_test.params')}}</h3>
-      </el-col>
-      <el-col :span="8">
-        <el-button type="primary" plain size="mini" @click="add('params')">{{$t('commons.add')}}</el-button>
+        <el-button type="el-icon-circle-plus-outline" plain size="mini" @click="add('params')">{{$t('commons.add')}}</el-button>
       </el-col>
     </el-row>
     <!-- -->
     <el-row>
-      <el-table :data="params">
+      <el-col :span="20">
+      <el-table :data="params" size="mini"  class="tb-edit" align="center" border highlight-current-row>
         <el-table-column
+          align="center"
           :label="$t('load_test.param_name')"
           show-overflow-tooltip>
           <template v-slot:default="{row}">
-            <template v-if="row.edit">
-              <el-input v-model="row.name" class="edit-input" size="mini"/>
-            </template>
-            <span v-else>{{ row.name }}</span>
+            <el-input
+              size="mini"
+              v-if="readOnly"
+              type="textarea"
+              :rows="1"
+              class="edit-input"
+              v-model="row.name"
+              :placeholder="$t('load_test.param_name')"
+              clearable>
+            </el-input>
+            <span >{{row.name}}</span>
           </template>
         </el-table-column>
         <el-table-column
+          align="center"
           :label="$t('load_test.enable')"
           show-overflow-tooltip>
           <template v-slot:default="{row}">
@@ -121,40 +126,32 @@
         </el-table-column>
         <el-table-column
           :label="$t('load_test.param_value')"
-          show-overflow-tooltip>
+          show-overflow-tooltip align="center">
           <template v-slot:default="{row}">
-            <template v-if="row.edit">
+           <!-- <template v-if="row.edit">
               <el-input v-model="row.value" class="edit-input" size="mini"/>
             </template>
-            <span v-else>{{ row.value }}</span>
+            <span v-else>{{ row.value }}</span>-->
+            <el-input
+              size="mini"
+              v-if="readOnly"
+              type="textarea"
+              class="edit-input"
+              :rows="1"
+              v-model="row.value"
+              :placeholder="$t('load_test.param_value')"
+              clearable></el-input>
+            <span>{{row.value}}</span>
           </template>
         </el-table-column>
-        <el-table-column align="center">
+        <el-table-column align="center" :label="$t('load_test.operating')">
           <template v-slot:default="{row, $index}">
-            <template v-if="row.edit">
-              <el-button
-                class="cancel-btn"
-                size="mini"
-                icon="el-icon-refresh"
-                type="warning"
-                circle
-                @click="cancelEdit(row)">
-              </el-button>
-              <el-button
-                type="success"
-                size="mini"
-                icon="el-icon-circle-check"
-                circle
-                @click="confirmEdit(row)">
-              </el-button>
-            </template>
             <el-button
-              v-else
               type="primary"
               size="mini"
-              icon="el-icon-edit"
+              icon="el-icon-plus"
               circle
-              @click="edit(row)">
+              @click="add(row)">
             </el-button>
             <el-button
               type="danger"
@@ -166,6 +163,7 @@
           </template>
         </el-table-column>
       </el-table>
+      </el-col>
     </el-row>
 
     <el-row>
@@ -211,6 +209,12 @@
         statusCodeStr: '',
       }
     },
+    props: {
+      readOnly: {
+        type: Boolean,
+        default: true
+      },
+    },
     mounted() {
       let testId = this.$route.path.split('/')[4];
       if (testId) {
@@ -253,6 +257,7 @@
             this.statusCodeStr = this.statusCode.join(',');
             this.domains = data.domains || [];
             this.params = data.params || [];
+            this.add('domains');
             this.domains.forEach(d => d.edit = false);
             this.params.forEach(d => d.edit = false);
           }
@@ -262,7 +267,7 @@
         if (dataName === 'domains') {
           this[dataName].push({
             domain: 'fit2cloud.com',
-            enable: true,
+            enable: false,
             ip: '127.0.0.1',
             edit: true,
           });
@@ -290,6 +295,7 @@
       },
       confirmEdit(row) {
         row.edit = false;
+        row.enable=true,
         this.saveOriginObject(row);
       },
       groupBy(data, key) {
@@ -360,7 +366,22 @@
   }
 
   .edit-input {
-    padding-right: 100px;
+    padding-right: 0px;
+  }
+  .tb-edit .el-textarea {
+    display: none;
+  }
+  .tb-edit .current-row .el-textarea {
+    display: block;
+  }
+  .tb-edit .current-row .el-textarea+span {
+    display: none;
+  }
+  .el-col{
+    text-align: left;
+  }
+  .el-col .el-table{
+    align:center;
   }
 
 </style>

frontend/src/business/components/performance/test/components/PerformancePressureConfig.vue

@@ -90,6 +90,7 @@
         </el-form>
       </el-col>
       <el-col :span="14">
+        <div class="title">{{$t('load_test.pressure_prediction_chart')}}</div>
         <chart class="chart-container" ref="chart1" :options="orgOptions" :autoresize="true"></chart>
       </el-col>
     </el-row>
@@ -306,9 +307,11 @@
   }
 </script>
 
+
 <style scoped>
   .pressure-config-container .el-input {
     width: 130px;
+
   }
 
   .pressure-config-container .config-form-label {
@@ -323,4 +326,15 @@
   .chart-container {
     width: 100%;
   }
+  .el-col .el-form{
+    margin-top: 15px;
+    text-align: left;
+  }
+  .el-col {
+    margin-top: 15px;
+    text-align: left;
+  }
+  .title {
+    margin-left: 60px;
+  }
 </style>

frontend/src/business/components/project/MsProject.vue

@@ -31,9 +31,9 @@
         </el-form>
         <template v-slot:footer>
           <div class="dialog-footer">
-            <el-button type="primary" @keydown.enter.native.prevent @click="submit('form')" size="medium">
-              {{$t('commons.save')}}
-            </el-button>
+            <ms-dialog-footer
+              @cancel="createVisible = false"
+              @confirm="submit('form')"/>
           </div>
         </template>
       </el-dialog>
@@ -48,10 +48,11 @@
   import MsTablePagination from "../common/pagination/TablePagination";
   import MsTableHeader from "../common/components/MsTableHeader";
   import MsTableOperator from "../common/components/MsTableOperator";
+  import MsDialogFooter from "../common/components/MsDialogFooter";
 
   export default {
     name: "MsProject",
-    components: {MsTableOperator, MsCreateBox, MsTablePagination, MsTableHeader},
+    components: {MsTableOperator, MsCreateBox, MsTablePagination, MsTableHeader, MsDialogFooter},
     data() {
       return {
         createVisible: false,

frontend/src/business/components/settings/organization/OrganizationMember.vue

@@ -25,7 +25,7 @@
     </el-card>
 
     <el-dialog :title="$t('member.create')" :visible.sync="createVisible" width="30%" :destroy-on-close="true"
-               @close="closeFunc">
+               @close="handleClose">
       <el-form :model="form" ref="form" :rules="rules" label-position="right" label-width="100px" size="small">
         <el-form-item :label="$t('commons.member')" prop="userIds">
           <el-select v-model="form.userIds" multiple :placeholder="$t('member.please_choose_member')"
@@ -52,16 +52,14 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="submitForm('form')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="createVisible = false"
+          @confirm="submitForm('form')"/>
       </template>
     </el-dialog>
 
     <el-dialog :title="$t('member.modify')" :visible.sync="updateVisible" width="30%" :destroy-on-close="true"
-               @close="closeFunc">
+               @close="handleClose">
       <el-form :model="form" label-position="right" label-width="100px" size="small" ref="updateUserForm">
         <el-form-item label="ID" prop="id">
           <el-input v-model="form.id" autocomplete="off" :disabled="true"/>
@@ -87,11 +85,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateOrgMember('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="updateVisible = false"
+          @confirm="updateOrgMember('updateUserForm')"/>
       </template>
     </el-dialog>
   </div>
@@ -104,10 +100,11 @@
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsRolesTag from "../../common/components/MsRolesTag";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsOrganizationMember",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator, MsDialogFooter},
     created() {
       this.initTableData();
     },
@@ -161,9 +158,8 @@
       buildPagePath(path) {
         return path + "/" + this.currentPage + "/" + this.pageSize;
       },
-      closeFunc() {
+      handleClose() {
         this.form = {};
-        this.initTableData();
       },
       edit(row) {
         this.updateVisible = true;

frontend/src/business/components/settings/organization/OrganizationWorkspace.vue

@@ -34,11 +34,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="submit('form')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsAddVisible = false"
+          @confirm="submit('form')"/>
       </template>
     </el-dialog>
 
@@ -99,11 +97,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="submitForm('form')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsMemberAddVisible = false"
+          @confirm="submitForm('form')"/>
       </template>
     </el-dialog>
 
@@ -137,11 +133,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateOrgMember('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsMemberUpdateVisible = false"
+          @confirm="updateOrgMember('updateUserForm')"/>
       </template>
     </el-dialog>
 
@@ -156,10 +150,11 @@
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsRolesTag from "../../common/components/MsRolesTag";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsOrganizationWorkspace",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator, MsDialogFooter},
     mounted() {
       this.list();
     },

frontend/src/business/components/settings/personal/PersonSetting.vue

@@ -28,7 +28,7 @@
       </el-table>
 
       <el-dialog :title="$t('member.modify_personal_info')" :visible.sync="updateVisible" width="30%"
-                 :destroy-on-close="true" @close="closeFunc">
+                 :destroy-on-close="true" @close="handleClose">
         <el-form :model="form" label-position="right" label-width="100px" size="small" :rules="rule"
                  ref="updateUserForm">
           <el-form-item label="ID" prop="id">
@@ -45,11 +45,9 @@
           </el-form-item>
         </el-form>
         <template v-slot:footer>
-          <span class="dialog-footer">
-            <el-button @click="updateUser('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                       size="medium">{{$t('commons.save')}}
-            </el-button>
-          </span>
+          <ms-dialog-footer
+            @cancel="updateVisible = false"
+            @confirm="updateUser('updateUserForm')"/>
         </template>
       </el-dialog>
 
@@ -59,6 +57,7 @@
 
 <script>
   import {TokenKey} from "../../../../common/js/constants";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     data() {
@@ -100,6 +99,7 @@
       }
     },
     name: "MsPersonSetting",
+    components: {MsDialogFooter},
     created() {
       this.initTableData();
     },
@@ -135,7 +135,7 @@
           this.tableData = dataList;
         })
       },
-      closeFunc() {
+      handleClose() {
         this.form = {};
       }
     }

frontend/src/business/components/settings/system/Organization.vue

@@ -65,11 +65,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="createOrganization('createOrganization')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogOrgAddVisible = false"
+          @confirm="createOrganization('createOrganization')"/>
       </template>
     </el-dialog>
 
@@ -87,11 +85,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateOrganization('updateOrganizationForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('organization.modify')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogOrgUpdateVisible = false"
+          @confirm="updateOrganization('updateOrganizationForm')"/>
       </template>
     </el-dialog>
 
@@ -127,11 +123,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="submitForm('form')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogOrgMemberAddVisible = false"
+          @confirm="submitForm('form')"/>
       </template>
     </el-dialog>
 
@@ -165,11 +159,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateOrgMember('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogOrgMemberUpdateVisible = false"
+          @confirm="updateOrgMember('updateUserForm')"/>
       </template>
     </el-dialog>
 
@@ -182,10 +174,11 @@
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsRolesTag from "../../common/components/MsRolesTag";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsOrganization",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator, MsDialogFooter},
     data() {
       return {
         queryPath: '/organization/list',

frontend/src/business/components/settings/system/SystemWorkspace.vue

@@ -49,9 +49,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button type="primary" @keydown.enter.native.prevent @click="submit('form')" size="medium">{{$t('commons.save')}}</el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsAddVisible = false"
+          @confirm="submit('form')"/>
       </template>
     </el-dialog>
 
@@ -77,10 +77,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button type="primary" @click="updateWorkspace('updateForm')" @keydown.enter.native.prevent
-                     size="medium">{{$t('commons.save')}}</el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsUpdateVisible = false"
+          @confirm="updateWorkspace('updateForm')"/>
       </template>
 
     </el-dialog>
@@ -142,11 +141,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button type="primary" @keydown.enter.native.prevent @click="submitForm('form')" size="medium">
-            {{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsMemberAddVisible = false"
+          @confirm="submitForm('form')"/>
       </template>
     </el-dialog>
 
@@ -180,11 +177,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button type="primary" @click="updateWorkspaceMember('updateUserForm')" @keydown.enter.native.prevent
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="dialogWsMemberUpdateVisible = false"
+          @confirm="updateWorkspaceMember('updateUserForm')"/>
       </template>
 
     </el-dialog>
@@ -199,10 +194,11 @@
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsRolesTag from "../../common/components/MsRolesTag";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsSystemWorkspace",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator, MsDialogFooter},
     mounted() {
       this.list();
     },

frontend/src/business/components/settings/system/TestResourcePool.vue

@@ -68,64 +68,64 @@
         </el-form-item>
         <div v-for="(item,index) in infoList " :key="index">
           <div class="node-line" v-if="form.type === 'K8S'">
-            <div class="k8s-master">
-              <el-col :span="11">
-
+            <el-row>
+              <el-col :span="9">
+                <el-form-item prop="masterUrl" label="Master URL">
+                  <el-input v-model="item.masterUrl" autocomplete="off"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="9">
+                <el-form-item prop="password" label="Token" style="padding-left: 20px">
+                  <el-input v-model="item.token" show-password autocomplete="off"/>
+                </el-form-item>
               </el-col>
-              <el-form-item prop="masterUrl" label="Master URL">
-                <el-input v-model="item.masterUrl" autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div class="k8s-token">
-              <el-form-item prop="token" label="Token">
-                <el-input v-model="item.token" show-password autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')">
-                <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
+              <el-col :span="6">
+                <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
+                              style="padding-left: 20px">
+                  <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+            </el-row>
           </div>
           <div class="node-line" v-if="form.type === 'NODE'">
-            <div style="width: 30%;float: left">
-              <el-form-item prop="ip" label="IP">
-                <el-input v-model="item.ip" autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="port" label="Port">
-                <el-input-number v-model="item.port" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')">
-                <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
-            <div class="op">
+            <el-row>
+              <el-col :span="8">
+                <el-form-item prop="ip" label="IP">
+                  <el-input v-model="item.ip" autocomplete="off"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item prop="port" label="Port" style="padding-left: 20px">
+                  <el-input-number v-model="item.port" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
+                              style="padding-left: 20px">
+                  <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+              <el-col :span="4">
                 <span class="box">
                     <el-button @click="addResourceInfo()" type="primary" size="mini" circle>
                         <font-awesome-icon :icon="['fas', 'plus']"/>
                     </el-button>
                 </span>
-              <span class="box">
+                <span class="box">
                     <el-button @click="removeResourceInfo(index)" type="primary" size="mini" circle>
                         <font-awesome-icon :icon="['fas', 'minus']"/>
                     </el-button>
                 </span>
-            </div>
+              </el-col>
+            </el-row>
           </div>
         </div>
 
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="createTestResourcePool('createTestResourcePoolForm')" @keydown.enter.native.prevent
-                     type="primary"
-                     size="medium">{{$t('commons.create')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="createVisible = false"
+          @confirm="createTestResourcePool('createTestResourcePoolForm')"/>
       </template>
     </el-dialog>
 
@@ -151,62 +151,63 @@
         </el-form-item>
         <div v-for="(item,index) in infoList " :key="index">
           <div class="node-line" v-if="form.type === 'K8S'">
-            <div class="k8s-master">
-              <el-form-item prop="masterUrl" label="Master URL">
-                <el-input v-model="item.masterUrl" autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div class="k8s-token">
-              <el-form-item prop="password" label="Token" style="padding-left: 20px">
-                <el-input v-model="item.token" show-password autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
-                            style="padding-left: 20px">
-                <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
+            <el-row>
+              <el-col :span="9">
+                <el-form-item prop="masterUrl" label="Master URL">
+                  <el-input v-model="item.masterUrl" autocomplete="off"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="9">
+                <el-form-item prop="password" label="Token" style="padding-left: 20px">
+                  <el-input v-model="item.token" show-password autocomplete="off"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
+                              style="padding-left: 20px">
+                  <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+            </el-row>
           </div>
           <div class="node-line" v-if="form.type === 'NODE'">
-            <div style="width: 30%;float: left">
-              <el-form-item prop="ip" label="IP">
-                <el-input v-model="item.ip" autocomplete="off"/>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="port" label="Port" style="padding-left: 20px">
-                <el-input-number v-model="item.port" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
-            <div style="width: 30%;float: left">
-              <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
-                            style="padding-left: 20px">
-                <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
-              </el-form-item>
-            </div>
-            <div class="op">
+            <el-row>
+              <el-col :span="8">
+                <el-form-item prop="ip" label="IP">
+                  <el-input v-model="item.ip" autocomplete="off"/>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item prop="port" label="Port" style="padding-left: 20px">
+                  <el-input-number v-model="item.port" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+              <el-col :span="6">
+                <el-form-item prop="maxConcurrency" :label="$t('test_resource_pool.max_threads')"
+                              style="padding-left: 20px">
+                  <el-input-number v-model="item.maxConcurrency" :min="1" :max="9999"></el-input-number>
+                </el-form-item>
+              </el-col>
+              <el-col :span="4">
                 <span class="box">
                     <el-button @click="addResourceInfo()" type="primary" size="mini" circle>
                         <font-awesome-icon :icon="['fas', 'plus']"/>
                     </el-button>
                 </span>
-              <span class="box">
+                <span class="box">
                     <el-button @click="removeResourceInfo(index)" type="primary" size="mini" circle>
                         <font-awesome-icon :icon="['fas', 'minus']"/>
                     </el-button>
                 </span>
-            </div>
+              </el-col>
+            </el-row>
           </div>
         </div>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateTestResourcePool('updateTestResourcePoolForm')" @keydown.enter.native.prevent
-                     type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="updateVisible = false"
+          @confirm="updateTestResourcePool('updateTestResourcePoolForm')"/>
       </template>
     </el-dialog>
 
@@ -218,10 +219,11 @@
   import MsTablePagination from "../../common/pagination/TablePagination";
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsTestResourcePool",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator, MsDialogFooter},
     data() {
       return {
         result: {},
@@ -429,30 +431,8 @@
 
 <style scoped>
 
-  .op {
-    float: left;
-    width: 10%;
-  }
-
   .box {
     padding-left: 5px;
   }
 
-  .k8s-master {
-    width: 34%;
-    float: left
-  }
-
-  .k8s-token {
-    width: 36%;
-    float: left
-  }
-
-  .k8s-token .el-form-item__label {
-    padding-left: 20px;
-  }
-
-  .node-line {
-    clear: both;
-  }
 </style>

frontend/src/business/components/settings/system/User.vue

@@ -40,7 +40,7 @@
 
     </el-card>
 
-    <el-dialog :title="$t('user.create')" :visible.sync="createVisible" width="30%" @closed="closeFunc"
+    <el-dialog :title="$t('user.create')" :visible.sync="createVisible" width="30%" @closed="handleClose"
                :destroy-on-close="true">
       <el-form :model="form" label-position="right" label-width="100px" size="small" :rules="rule" ref="createUserForm">
         <el-form-item label="ID" prop="id">
@@ -57,15 +57,14 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="createUser('createUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}</el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="createVisible = false"
+          @confirm="createUser('createUserForm')"/>
       </template>
     </el-dialog>
 
     <el-dialog :title="$t('user.modify')" :visible.sync="updateVisible" width="30%" :destroy-on-close="true"
-               @close="closeFunc">
+               @close="handleClose">
       <el-form :model="form" label-position="right" label-width="100px" size="small" :rules="rule" ref="updateUserForm">
         <el-form-item label="ID" prop="id">
           <el-input v-model="form.id" autocomplete="off" :disabled="true"/>
@@ -81,11 +80,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateUser('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="updateVisible = false"
+          @confirm="updateUser('updateUserForm')"/>
       </template>
     </el-dialog>
 
@@ -97,10 +94,11 @@
   import MsTablePagination from "../../common/pagination/TablePagination";
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsUser",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsTableOperator, MsDialogFooter},
     data() {
       return {
         queryPath: '/user/special/list',
@@ -211,7 +209,7 @@
           this.tableData = data.listObject;
         })
       },
-      closeFunc() {
+      handleClose() {
         this.form = {};
       },
       changeSwitch(row) {

frontend/src/business/components/settings/workspace/WorkspaceMember.vue

@@ -16,7 +16,8 @@
         </el-table-column>
         <el-table-column>
           <template v-slot:default="scope">
-            <ms-table-operator @editClick="edit(scope.row)" @deleteClick="del(scope.row)" v-permission="['test_manager']"/>
+            <ms-table-operator @editClick="edit(scope.row)" @deleteClick="del(scope.row)"
+                               v-permission="['test_manager']"/>
           </template>
         </el-table-column>
       </el-table>
@@ -25,7 +26,7 @@
     </el-card>
 
     <el-dialog :title="$t('member.create')" :visible.sync="createVisible" width="30%" :destroy-on-close="true"
-               @close="closeFunc">
+               @close="handleClose">
       <el-form :model="form" ref="form" :rules="rules" label-position="right" label-width="100px" size="small">
         <el-form-item :label="$t('commons.member')" prop="userIds">
           <el-select v-model="form.userIds" multiple :placeholder="$t('member.please_choose_member')"
@@ -52,16 +53,14 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="submitForm('form')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="createVisible = false"
+          @confirm="submitForm('form')"/>
       </template>
     </el-dialog>
 
     <el-dialog :title="$t('member.modify')" :visible.sync="updateVisible" width="30%" :destroy-on-close="true"
-               @close="closeFunc">
+               @close="handleClose">
       <el-form :model="form" label-position="right" label-width="100px" size="small" ref="updateUserForm">
         <el-form-item label="ID" prop="id">
           <el-input v-model="form.id" autocomplete="off" :disabled="true"/>
@@ -87,11 +86,9 @@
         </el-form-item>
       </el-form>
       <template v-slot:footer>
-        <span class="dialog-footer">
-          <el-button @click="updateWorkspaceMember('updateUserForm')" @keydown.enter.native.prevent type="primary"
-                     size="medium">{{$t('commons.save')}}
-          </el-button>
-        </span>
+        <ms-dialog-footer
+          @cancel="updateVisible = false"
+          @confirm="updateWorkspaceMember('updateUserForm')"/>
       </template>
     </el-dialog>
 
@@ -105,10 +102,11 @@
   import MsTableHeader from "../../common/components/MsTableHeader";
   import MsRolesTag from "../../common/components/MsRolesTag";
   import MsTableOperator from "../../common/components/MsTableOperator";
+  import MsDialogFooter from "../../common/components/MsDialogFooter";
 
   export default {
     name: "MsMember",
-    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator},
+    components: {MsCreateBox, MsTablePagination, MsTableHeader, MsRolesTag, MsTableOperator, MsDialogFooter},
     data() {
       return {
         result: {},
@@ -168,9 +166,8 @@
       buildPagePath(path) {
         return path + "/" + this.currentPage + "/" + this.pageSize;
       },
-      closeFunc() {
+      handleClose() {
         this.form = {};
-        this.initTableData();
       },
       del(row) {
         this.$confirm(this.$t('member.delete_confirm'), '', {

frontend/src/business/components/settings/workspace/components/TemplateComponent/BaseInfoComponent.vue

 <template>
 
-
   <common-component :title="'基础信息'">
 
     <template>
@@ -16,14 +15,14 @@
         </el-col>
       </el-row>
 
-      <el-row type="flex" justify="space-between">
+      <el-row type="flex" justify="space-between" class="select-time">
         <el-col :span="12">
           <span>开始时间：</span>
-          <span class="item-value">{{reportInfo.startTime}}</span>
+          <el-date-picker size="mini" type="date" placeholder="选择日期" v-model="reportInfo.startTime"/>
         </el-col>
         <el-col :span="12">
           <span>结束时间：</span>
-          <span class="item-value">{{reportInfo.endTime}}</span>
+          <el-date-picker size="mini" type="date" placeholder="选择日期" v-model="reportInfo.endTime"/>
         </el-col>
       </el-row>
 
@@ -82,4 +81,12 @@
     height: 60px;
   }
 
+  .select-time span {
+    display: inline-block;
+  }
+
+  .el-date-editor {
+    width: 150px;
+  }
+
 </style>

frontend/src/business/components/settings/workspace/components/TemplateComponent/TemplateComponent.vue

@@ -32,6 +32,10 @@
         },
         metric: {
           type: Object
+        },
+        isReport: {
+          type: Boolean,
+          default: true
         }
       }
     }

frontend/src/business/components/settings/workspace/components/TestCaseReportTemplateEdit.vue

@@ -36,7 +36,7 @@
                 group="component">
             <transition-group>
               <div class="preview" v-for="item in previews" :key="item.id">
-                <template-component :metric="metric" :preview="item"/>
+                <template-component :is-report="isReport" :metric="metric" :preview="item"/>
                 <i class="el-icon-error" @click="handleDelete(item)"/>
               </div>
             </transition-group>
@@ -194,6 +194,12 @@
             this.template.content = JSON.parse(response.data.content);
             if (this.template.content.customComponent) {
               this.template.content.customComponent = jsonToMap(this.template.content.customComponent);
+              if (this.template.startTime) {
+                this.metric.startTime = new Date(this.template.startTime);
+              }
+              if (this.template.endTime) {
+                this.metric.endTime = new Date(this.template.endTime);
+              }
             }
             this.initComponents();
           });
@@ -238,6 +244,12 @@
           if (this.template.workspaceId) {
             param.workspaceId = localStorage.getItem(WORKSPACE_ID);
           }
+          if (this.metric.startTime) {
+            param.startTime = this.metric.startTime.getTime();
+          }
+          if (this.metric.endTime) {
+            param.endTime = this.metric.endTime.getTime();
+          }
         }
       }
     }

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

@@ -19,6 +19,7 @@
             </div>
           </el-col>
           <el-col :span="12" class="head-right">
+            <el-button plain size="mini" @click="handleSave">保存</el-button>
             <el-button plain size="mini" @click="handleEdit">编辑组件</el-button>
           </el-col>
         </el-row>
@@ -39,7 +40,7 @@
 </template>
 
 <script>
-    import {jsonToMap} from "../../../../../../common/js/utils";
+  import {jsonToMap, mapToJson} from "../../../../../../common/js/utils";
     import BaseInfoComponent from "../../../../settings/workspace/components/TemplateComponent/BaseInfoComponent";
     import TestResultChartComponent from "../../../../settings/workspace/components/TemplateComponent/TestResultChartComponent";
     import TestResultComponent from "../../../../settings/workspace/components/TemplateComponent/TestResultComponent";
@@ -117,11 +118,45 @@
         handleEdit() {
           this.$refs.templateEdit.open(this.reportId, true);
         },
+        handleSave() {
+          let param = {};
+          this.buildParam(param);
+          this.result = this.$post('/case/report/edit', param, () =>{
+            this.$success('保存成功');
+          });
+        },
+        buildParam(param) {
+          let content = {};
+          content.components = [];
+          this.previews.forEach(item => {
+            content.components.push(item.id);
+            if (!this.componentMap.get(item.id)) {
+              content.customComponent = new Map();
+              content.customComponent.set(item.id, {title: item.title, content: item.content})
+            }
+          });
+          param.name = this.report.name;
+          if (content.customComponent) {
+            content.customComponent = mapToJson(content.customComponent);
+          }
+          param.content = JSON.stringify(content);
+          param.id = this.report.id;
+          if (this.metric.startTime) {
+            param.startTime = this.metric.startTime.getTime();
+          }
+          if (this.metric.endTime) {
+            param.endTime = this.metric.endTime.getTime();
+          }
+        },
         getMetric() {
           this.result = this.$get('/case/report/get/metric/' + this.planId, response => {
             this.metric = response.data;
-            this.metric.startTime = this.report.startTime;
-            this.metric.endTime = this.report.endTime;
+            if (this.report.startTime) {
+              this.metric.startTime = new Date(this.report.startTime);
+            }
+            if (this.report.endTime) {
+              this.metric.endTime = new Date(this.report.endTime);
+            }
           });
         }
       }

frontend/src/i18n/en-US.js

@@ -129,6 +129,8 @@ export default {
     'being_generated': 'Report is being generated...',
   },
   load_test: {
+    'operating':'Operating',
+    'pressure_prediction_chart':'Pressure Prediction Chart',
     'recent': 'Recent Tests',
     'search_by_name': 'Search by name',
     'project_name': 'Project',
@@ -181,6 +183,7 @@ export default {
     'create': 'Create Test',
     'select_resource_pool': 'Please Select Resource Pool',
     'resource_pool_is_null': 'Resource Pool is empty',
+    'download_log_file': 'Download',
   },
   api_test: {
     'select_resource_pool': 'Please select resource pool'

frontend/src/i18n/zh-CN.js

@@ -131,6 +131,7 @@ export default {
     'being_generated': '报告正在生成中...',
   },
   load_test: {
+    'operating':'操作',
     'recent': '最近的测试',
     'search_by_name': '根据名称搜索',
     'project_name': '所属项目',
@@ -183,6 +184,8 @@ export default {
     'create': '创建测试',
     'select_resource_pool': '请选择资源池',
     'resource_pool_is_null': '资源池为空',
+    'download_log_file': '下载完整日志文件',
+    'pressure_prediction_chart':'压力预估图',
 
   },
   api_test: {