admin下支持创建多个mysql服务

src/views/docker/envDetail.vue

@@ -218,7 +218,14 @@
           </el-select>
         </el-col>
       </el-row>
-
+      <div v-permission="['admin']" v-show="is_show">
+        <p class="title-sub">服务名称<span style="font-size: 12px">(创建多个mysql时需要填写此字段)</span></p>
+        <el-row :gutter="20">
+          <el-col :span="14">
+            <el-input v-model="mysqlName" placeholder="请输入服务名称" clearable/>
+          </el-col>
+        </el-row>
+      </div>
       <p class="title-sub">选择镜像</p>
       <el-row :gutter="20">
         <el-col :span="14">
@@ -328,11 +335,11 @@ import {
   ingressHost
 } from '@/api/docker'
 import JsonEditor from '@/components/JsonEditor'
-
+import permission from '@/directive/permission/index.js' // 权限判断指令
 import { getHostName } from '@/api/proconfig'
-
 export default {
   components: { JsonEditor },
+  directives: { permission },
   data() {
     return {
       debugOptions: [
@@ -347,6 +354,8 @@ export default {
       tagOptions: [],
       FormatTabledata: {},
       reponame: '',
+      is_show: false,
+      mysqlName: '',
       typeList: [],
       tagName: '',
       server: '',
@@ -431,6 +440,7 @@ export default {
       this.dialogVisible = true
     },
     getTag() {
+      this.is_show = this.reponame.split('/')[1] === 'mysql'
       getHostName({ project_name: this.reponame.split('/')[1] }).then(res => {
         if (res.data) {
           this.domain = res.data.host_name
@@ -445,8 +455,14 @@ export default {
     createClusterService() {
       const self = this
       this.type = this.label === 'base' ? this.reponame.split('/')[1] : this.label
+      let serviceName = ''
+      if (this.is_show && this.mysqlName !== '') {
+        serviceName = this.reponame.split('/')[1] + '-' + this.mysqlName
+      } else {
+        serviceName = this.reponame.split('/')[1]
+      }
       CreateCluService({
-        serviceName: this.reponame.split('/')[1],
+        serviceName: serviceName,
         namespace: this.namespace,
         image: this.tagName,
         label: this.label,
@@ -479,7 +495,8 @@ export default {
       window.open(`http://${data.lanIp}:${port}/`, '_blank')
     },
     getServiceDetails(value) {
-      fetchServiceDetails({ serviceName: value.serviceName, namespace: this.namespace }).then(res => {
+      console.log(value)
+      fetchServiceDetails({ serviceName: value.serviceName, namespace: this.namespace, type: value.labels.type }).then(res => {
         this.centerDialogVisible = true
         this.value = res.data
       })