refactor: 优化tcp，dubbo sql设置关注人

2021-12-04 20:47:55 +08:00 · 2021-12-04 20:47:55 +08:00 · 9ba2d455ea
parent 8d4c78fe16
commit 9ba2d455ea
5 changed files with 273 additions and 157 deletions
--- a/frontend/src/business/components/api/definition/components/complete/BasisApi.vue
+++ b/frontend/src/business/components/api/definition/components/complete/BasisApi.vue
@ -45,28 +45,13 @@
            <ms-input-tag :currentScenario="basicForm" ref="tag"/>
          </el-form-item>
        </el-col>
-        <el-col :span="8">
-          <el-form-item :label="$t('api_test.automation.follow_people')" prop="followPeople">
-            <el-select v-model="basicForm.follows"
-                       clearable multiple
-                       :placeholder="$t('api_test.automation.follow_people')" filterable size="small"
-                       class="ms-http-textarea">
-              <el-option
-                v-for="item in maintainerOptions"
-                :key="item.id"
-                :label="item.id + ' (' + item.name + ')'"
-                :value="item.id">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('commons.description')" prop="description">
            <el-input class="ms-http-textarea"
                      v-model="basicForm.description"
                      type="textarea"
-                      :autosize="{ minRows: 2, maxRows: 10}"
-                      :rows="2" size="small"/>
+                      :autosize="{ minRows: 1, maxRows: 10}"
+                      :rows="1" size="small"/>
          </el-form-item>
        </el-col>
      </el-row>
--- a/frontend/src/business/components/api/definition/components/complete/EditCompleteDubboApi.vue
+++ b/frontend/src/business/components/api/definition/components/complete/EditCompleteDubboApi.vue
@ -6,6 +6,14 @@
      <el-col>
        <!--操作按钮-->
        <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
+          <el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
+            <i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
+          <el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
+            <i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
          <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
            {{ $t('operating_log.change_history') }}
          </el-link>
@ -37,6 +45,7 @@
 import MsBasisParameters from "../request/dubbo/BasisParameters";
 import MsChangeHistory from "../../../../history/ChangeHistory";
 import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";
+import {getCurrentUser} from "@/common/js/utils";

 export default {
  name: "MsApiDubboRequestForm",
@ -74,9 +83,22 @@
      }
    }
  },
-
+  created() {
+    this.$get('/api/definition/follow/' + this.basisData.id, response => {
+      this.basisData.follows = response.data;
+      for (let i = 0; i < response.data.length; i++) {
+        if (response.data[i] === getCurrentUser().id) {
+          this.showFollow = true;
+          break;
+        }
+      }
+    });
+  },
  data() {
-      return {validated: false}
+    return {
+      validated: false,
+      showFollow: false
+    }
  },
  methods: {
    openHis() {
@ -113,6 +135,33 @@
    createRootModelInTree() {
      this.$emit("createRootModelInTree");
    },
+    saveFollow() {
+      if (this.showFollow) {
+        this.showFollow = false;
+        for (let i = 0; i < this.basisData.follows.length; i++) {
+          if (this.basisData.follows[i] === getCurrentUser().id) {
+            this.basisData.follows.splice(i, 1)
+            break;
+          }
+        }
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.cancel_follow_success'));
+          });
+        }
+      } else {
+        this.showFollow = true;
+        if (!this.basisData.follows) {
+          this.basisData.follows = [];
+        }
+        this.basisData.follows.push(getCurrentUser().id)
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.follow_success'));
+          });
+        }
+      }
+    }
  },

  computed: {}
--- a/frontend/src/business/components/api/definition/components/complete/EditCompleteSQLApi.vue
+++ b/frontend/src/business/components/api/definition/components/complete/EditCompleteSQLApi.vue
@ -5,6 +5,14 @@
      <el-col>
        <!--操作按钮-->
        <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
+          <el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
+            <i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
+          <el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
+            <i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
          <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
            {{ $t('operating_log.change_history') }}
          </el-link>
@ -38,6 +46,7 @@ import MsBasisApi from "./BasisApi";
 import MsBasisParameters from "../request/database/BasisParameters";
 import MsChangeHistory from "../../../../history/ChangeHistory";
 import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";
+import {getCurrentUser} from "@/common/js/utils";

 export default {
  name: "MsApiSqlRequestForm",
@ -76,7 +85,21 @@ export default {
    }
  },
  data() {
-    return {validated: false}
+    return {
+      validated: false,
+      showFollow: false
+    }
+  },
+  created() {
+    this.$get('/api/definition/follow/' + this.basisData.id, response => {
+      this.basisData.follows = response.data;
+      for (let i = 0; i < response.data.length; i++) {
+        if (response.data[i] === getCurrentUser().id) {
+          this.showFollow = true;
+          break;
+        }
+      }
+    });
  },
  methods: {
    openHis() {
@ -113,6 +136,33 @@ export default {
    createRootModelInTree() {
      this.$emit("createRootModelInTree");
    },
+    saveFollow() {
+      if (this.showFollow) {
+        this.showFollow = false;
+        for (let i = 0; i < this.basisData.follows.length; i++) {
+          if (this.basisData.follows[i] === getCurrentUser().id) {
+            this.basisData.follows.splice(i, 1)
+            break;
+          }
+        }
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.cancel_follow_success'));
+          });
+        }
+      } else {
+        this.showFollow = true;
+        if (!this.basisData.follows) {
+          this.basisData.follows = [];
+        }
+        this.basisData.follows.push(getCurrentUser().id)
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.follow_success'));
+          });
+        }
+      }
+    }
  },
 }
 </script>
--- a/frontend/src/business/components/api/definition/components/complete/EditCompleteTCPApi.vue
+++ b/frontend/src/business/components/api/definition/components/complete/EditCompleteTCPApi.vue
@ -5,6 +5,14 @@
      <el-col>
        <!--操作按钮-->
        <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
+          <el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
+            <i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
+          <el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
+            <i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
+               @click="saveFollow"/>
+          </el-tooltip>
          <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
            {{ $t('operating_log.change_history') }}
          </el-link>
@ -17,7 +25,8 @@
    <br/>
    <el-row>
      <el-col>
-        <ms-tcp-basic-api :method-types="methodTypes" @createRootModelInTree="createRootModelInTree" :moduleOptions="moduleOptions" :basisData="basisData" ref="basicForm"
+        <ms-tcp-basic-api :method-types="methodTypes" @createRootModelInTree="createRootModelInTree" :moduleOptions="moduleOptions"
+                          :basisData="basisData" ref="basicForm"
                          @changeApiProtocol="changeApiProtocol" @callback="callback"/>
      </el-col>
    </el-row>
@ -64,7 +73,7 @@
 import MsTcpBasicApi from "./TCPBasicApi";
 import MsTcpFormatParameters from "../request/tcp/TcpFormatParameters";
 import MsChangeHistory from "../../../../history/ChangeHistory";
-import {hasLicense, getCurrentProjectID, getUUID} from "@/common/js/utils";
+import {hasLicense, getCurrentProjectID, getUUID, getCurrentUser} from "@/common/js/utils";
 import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";

 const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/);
@ -75,7 +84,8 @@ export default {
  components: {
    ApiOtherInfo, MsTcpBasicApi, MsTcpFormatParameters, MsChangeHistory,
    "esbDefinition": esbDefinition.default,
-    "esbDefinitionResponse": esbDefinitionResponse.default},
+    "esbDefinitionResponse": esbDefinitionResponse.default
+  },
  props: {
    request: {},
    basisData: {},
@ -91,6 +101,7 @@ export default {
      validated: false,
      apiProtocol: "TCP",
      mockInfo: "",
+      showFollow: false,
      methodTypes: [
        {
          'key': "TCP",
@ -119,6 +130,15 @@ export default {
        }
      }
    }
+    this.$get('/api/definition/follow/' + this.basisData.id, response => {
+      this.basisData.follows = response.data;
+      for (let i = 0; i < response.data.length; i++) {
+        if (response.data[i] === getCurrentUser().id) {
+          this.showFollow = true;
+          break;
+        }
+      }
+    });
    this.getMockInfo();
  },
  watch: {
@ -231,6 +251,33 @@ export default {
        this.$alert(this.$t('api_test.mock.create_error'));
      }
    },
+    saveFollow() {
+      if (this.showFollow) {
+        this.showFollow = false;
+        for (let i = 0; i < this.basisData.follows.length; i++) {
+          if (this.basisData.follows[i] === getCurrentUser().id) {
+            this.basisData.follows.splice(i, 1)
+            break;
+          }
+        }
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.cancel_follow_success'));
+          });
+        }
+      } else {
+        this.showFollow = true;
+        if (!this.basisData.follows) {
+          this.basisData.follows = [];
+        }
+        this.basisData.follows.push(getCurrentUser().id)
+        if (this.basisData.id) {
+          this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
+            this.$success(this.$t('commons.follow_success'));
+          });
+        }
+      }
+    }
  },
 }
 </script>
@ -239,6 +286,7 @@ export default {
 .mock-info {
  margin: 20px 45px;
 }
+
 .ms-opt-btn {
  position: fixed;
  right: 50px;
--- a/frontend/src/business/components/api/definition/components/complete/TCPBasicApi.vue
+++ b/frontend/src/business/components/api/definition/components/complete/TCPBasicApi.vue
@ -52,29 +52,13 @@
            <ms-input-tag :currentScenario="basicForm" ref="tag"/>
          </el-form-item>
        </el-col>
-        <el-col :span="8">
-          <el-form-item :label="$t('api_test.automation.follow_people')" prop="followPeople">
-            <el-select v-model="basicForm.follows"
-                       clearable
-                       multiple
-                       :placeholder="$t('api_test.automation.follow_people')" filterable size="small"
-                       class="ms-http-textarea">
-              <el-option
-                  v-for="item in maintainerOptions"
-                  :key="item.id"
-                  :label="item.id + ' (' + item.name + ')'"
-                  :value="item.id">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
        <el-col :span="8">
          <el-form-item :label="$t('commons.description')" prop="description">
            <el-input class="ms-http-textarea"
                      v-model="basicForm.description"
                      type="textarea"
-                      :autosize="{ minRows: 2, maxRows: 10}"
-                      :rows="2" size="small"/>
+                      :autosize="{ minRows: 1, maxRows: 10}"
+                      :rows="1" size="small"/>
          </el-form-item>
        </el-col>
      </el-row>