修改页面 域名跳转 更新 ingress创建服务 默认执行 对应的ingress

src/views/docker/envDetail.vue

@@ -12,9 +12,9 @@
               更多操作
             </el-button>
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item>从线上同步DB</el-dropdown-item>
-              <el-dropdown-item>从线上同步MQ</el-dropdown-item>
-              <el-dropdown-item>清理Redis缓存</el-dropdown-item>
+              <el-dropdown-item @click.native="syncDb">从线上同步DB</el-dropdown-item>
+              <el-dropdown-item @click.native="syncMq">从线上同步MQ</el-dropdown-item>
+              <el-dropdown-item @click.native="clearRedis">清理Redis缓存</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
         </div>
@@ -53,7 +53,7 @@
               </el-button>
               <el-dropdown-menu slot="dropdown">
                 <el-dropdown-item @click.native="getServiceDetails(scope.row)">详细信息</el-dropdown-item>
-                <el-dropdown-item>重置服务</el-dropdown-item>
+                <el-dropdown-item @click.native="restartService(scope.row)">重置服务</el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </template>
@@ -65,7 +65,7 @@
         <svg-icon icon-class="service"/>
         {{ item._id }}服务
         <div style="float: right">
-          <el-button type="warning" size="mini" round @click="getRepository(item._id)">新增服务</el-button>
+          <el-button type="warning" size="mini" round @click="getRepository(item._id,item)">新增服务</el-button>
           <el-button type="warning" size="mini" round @click="refresh">刷新状态</el-button>
         </div>
       </div>
@@ -111,12 +111,26 @@
                 点击
               </el-button>
               <el-dropdown-menu slot="dropdown">
-                <el-dropdown-item @click.native="getServiceDetails(scope.row)"><svg-icon icon-class="detail"/>
-                  详细信息</el-dropdown-item>
-                <el-dropdown-item @click.native="updateService(scope.row)"><svg-icon icon-class="f5"/>更新服务</el-dropdown-item>
-                <el-dropdown-item @click.native="updateDomain(scope.row)"><svg-icon icon-class="doamin"/>更新域名</el-dropdown-item>
-                <el-dropdown-item @click.native="restartService(scope.row)"><svg-icon icon-class="restart"/>重置服务</el-dropdown-item>
-                <el-dropdown-item style="color: red" @click.native="deleteService(scope.row) "><svg-icon icon-class="delete"/>删除服务</el-dropdown-item>
+                <el-dropdown-item @click.native="getServiceDetails(scope.row)">
+                  <svg-icon icon-class="detail"/>
+                  详细信息
+                </el-dropdown-item>
+                <el-dropdown-item @click.native="updateService(scope.row)">
+                  <svg-icon icon-class="f5"/>
+                  更新服务
+                </el-dropdown-item>
+                <el-dropdown-item @click.native="updateDomain(scope.row)">
+                  <svg-icon icon-class="doamin"/>
+                  更新域名
+                </el-dropdown-item>
+                <el-dropdown-item @click.native="restartService(scope.row)">
+                  <svg-icon icon-class="restart"/>
+                  重置服务
+                </el-dropdown-item>
+                <el-dropdown-item style="color: red" @click.native="deleteService(scope.row) ">
+                  <svg-icon icon-class="delete"/>
+                  删除服务
+                </el-dropdown-item>
               </el-dropdown-menu>
             </el-dropdown>
           </template>
@@ -217,6 +231,17 @@
         <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
       </span>
     </el-dialog>
+    <el-dialog :visible.sync="dialogHost" title="更新域名">
+      <el-form ref="form" :model="form" :rules="rules">
+        <el-form-item label="域名" prop="host">
+          <el-input v-model="form.host" autocomplete="off"/>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="resetForm('form')">取 消</el-button>
+        <el-button type="primary" @click="submitHost('form')">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -230,7 +255,10 @@ import {
   modifyCluService,
   fetchServiceInstance,
   deleteClusterService,
-  redeployClusterService
+  redeployClusterService,
+  flushRedis,
+  modifyIngressHost,
+  ingressHost
 } from '@/api/docker'
 import JsonEditor from '@/components/JsonEditor'
 
@@ -252,6 +280,7 @@ export default {
       type: '',
       value: null,
       images: null,
+      ingressName: null,
       dialogVisible: false,
       title: '添加服务',
       formInline: {
@@ -259,7 +288,16 @@ export default {
         region: ''
       },
       updateDialog: false,
-      rename: ''
+      rename: '',
+      form: {
+        host: ''
+      },
+      rules: {
+        host: [
+          { required: true, message: '请输入更新的域名信息', trigger: 'blur' }
+        ]
+      },
+      dialogHost: false
     }
   },
   created() {
@@ -283,7 +321,7 @@ export default {
         type: 'success'
       })
     },
-    getRepository(type) {
+    getRepository(type, item) {
       this.type = type
       this.reponame = ''
       this.tagName = ''
@@ -293,6 +331,7 @@ export default {
         this.options = res.data.data.repoInfo
         this.server = res.data.data.server
       })
+      // fetchHost({ system_name: 'xjd-ui', namespace: this.namespace }).then(res => { console.log(res) })
       this.dialogVisible = true
     },
     getTag() {
@@ -329,8 +368,12 @@ export default {
         }
       })
     },
-    handleDetail() {
-      alert('暂未开发')
+    handleDetail(data) {
+      ingressHost({ namespace: data.namespace, serviceName: data.serviceName }).then(res => {
+        // console.log(res.data.data.body.spec.rules[0].host)
+        const url = res.data.data.body.spec.rules[0].host
+        window.open(`http://${url}/`, '_blank')
+      })
     },
     getServiceDetails(value) {
       fetchServiceDetails({ serviceName: value.serviceName, namespace: value.namespace }).then(res => {
@@ -338,6 +381,30 @@ export default {
         this.value = res.data.data.service
       })
     },
+    submitHost(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          modifyIngressHost({
+            namespace: this.namespace,
+            serviceName: this.ingressName,
+            host: this.form.host
+          }).then(res => {
+            this.$message({
+              message: '域名更新成功',
+              type: 'success'
+            })
+            this.dialogHost = false
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields()
+      this.dialogHost = false
+    },
     updateService(value) {
       this.tagName = ''
       this.updateDialog = true
@@ -387,8 +454,31 @@ export default {
         }
       })
     },
-    updateDomain() {
-      alert('更新域名')
+    syncDb() {
+      this.$router.push({
+        path: '/dbsync',
+        query: { namespace: this.namespace }
+      })
+    },
+    syncMq() {
+      alert('同步mq')
+    },
+    clearRedis() {
+      flushRedis({ namespace: this.namespace }).then(res => {
+        this.$message({
+          message: '清理redis缓存成功',
+          type: 'success'
+        })
+      })
+    },
+    updateDomain(data) {
+      this.dialogHost = true
+      this.form.host = ''
+      this.ingressName = data.serviceName
+      ingressHost({ namespace: data.namespace, serviceName: data.serviceName }).then(res => {
+        // console.log(res.data.data.body.spec.rules[0].host)
+        this.form.host = res.data.data.body.spec.rules[0].host
+      })
     },
     deleteService(data) {
       this.$confirm('此操作将永久此服务, 是否继续?', '提示', {