delete views/devops

src/router/background_backend.js

@@ -7,8 +7,7 @@ const AdminGateway = () => import('views/admin/backend/AdminGateway')
 const AdminDubbo = () => import('views/admin/backend/AdminDubbo')
 const AdminSpringCloud = () => import('views/admin/backend/AdminSpringCloud')
 const AdminBackendLog = () => import('views/admin/backend/AdminBackendLog')
-const AdminAccessLog = () => import('views/admin/backend/AdminAccessLog')
-const NginxLog = () => import('views/devops/srv/NginxLog')
+const NginxLog = () => import('views/admin/backend/AdminAccessLog')
 const AdminRuntimeLog = () => import('views/admin/backend/AdminRuntimeLog')
 
 export default {

src/router/background_devops.js

@@ -1,325 +0,0 @@
-// ********************************************************************************************************************
-const Background = () => import('views/admin/Background')
-
-// user
-const UserProfile = () => import('views/devops/user/UserProfile')
-const UserLogin = () => import('views/devops/user/UserLogin')
-const UserMessage = () => import('views/devops/user/UserMessage')
-// rbac
-const Menu = () => import('views/devops/rbac/Menu')
-const Role = () => import('views/devops/rbac/Role')
-const User = () => import('views/devops/rbac/User')
-// machine
-const MachineHost = () => import('views/devops/machine/MachineHost')
-const AliyunKey = () => import('views/devops/machine/AliyunKey')
-const MachineProc = () => import('views/devops/machine/MachineProc')
-const MachineTask = () => import('views/devops/machine/MachineTask')
-// srv
-const MachineNginx = () => import('views/devops/srv/MachineNginx')
-const NginxLog = () => import('views/devops/srv/NginxLog')
-// build
-const BuildDir = () => import('views/devops/build/BuildDir')
-const RepoAuth = () => import('views/devops/build/RepoAuth')
-const Compiler = () => import('views/devops/build/Compiler')
-const Packer = () => import('views/devops/build/Packer')
-// docker
-const DockerRegistry = () => import('views/devops/docker/DockerRegistry')
-const DockerImage = () => import('views/devops/docker/DockerImage')
-const Docker = () => import('views/devops/docker/Docker')
-// app
-const AppConfig = () => import('views/devops/app/AppConfig')
-const BuildDeploy = () => import('views/devops/app/BuildDeploy')
-const AppStat = () => import('views/devops/app/AppStat')
-// sys
-const SysUpdate = () => import('views/devops/sys/SysUpdate')
-const SiteConfig = () => import('views/devops/sys/SiteConfig')
-const Webhook = () => import('views/devops/sys/Webhook')
-
-export default {
-  path: '/bg',
-  name: 'Background',
-  component: Background,
-  meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] },
-  children: [
-    {
-      path: '/bg/user',
-      name: 'UserProfileIndex',
-      title: '我的',
-      icon: 'el-icon-user',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] },
-      children: [
-        {
-          path: '/bg/user/profile',
-          name: 'UserProfile',
-          title: '我的资料',
-          icon: 'el-icon-user',
-          component: UserProfile,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        },
-        {
-          path: '/bg/user/record',
-          name: 'UserLogin',
-          title: '登入记录',
-          icon: 'el-icon-user',
-          component: UserLogin,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        },
-        {
-          path: '/bg/user/message',
-          name: 'UserMessage',
-          title: '我的消息',
-          icon: 'el-icon-user',
-          component: UserMessage,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/machine',
-      name: 'MachineHostIndex',
-      title: '机器',
-      icon: 'el-icon-s-data',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/machine/host',
-          name: 'MachineHost',
-          title: '机器节点',
-          icon: 'el-icon-s-data',
-          component: MachineHost,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/machine/aliyun_key',
-          name: 'AliyunKey',
-          title: '阿里云帐号',
-          icon: 'el-icon-s-data',
-          component: AliyunKey,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/machine/proc',
-          name: 'MachineProc',
-          title: '服务进程',
-          icon: 'el-icon-s-data',
-          component: MachineProc,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/machine/task',
-          name: 'MachineTask',
-          title: '定时任务',
-          icon: 'el-icon-s-data',
-          component: MachineTask,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/srv',
-      name: 'MachineSrv',
-      title: '服务',
-      icon: 'el-icon-s-data',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/srv/nginx',
-          name: 'MachineNginx',
-          title: 'Nginx',
-          icon: 'el-icon-s-data',
-          component: MachineNginx,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/srv/nginx_log',
-          name: 'NginxLog',
-          title: 'NginxLog',
-          icon: 'el-icon-s-data',
-          component: NginxLog,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/docker',
-      name: 'DockerIndex',
-      title: 'Docker',
-      icon: 'el-icon-user-solid',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/docker/registry',
-          name: 'DockerRegistry',
-          title: '镜像仓库',
-          icon: 'el-icon-user-solid',
-          component: DockerRegistry,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/docker/container',
-          name: 'Docker',
-          title: '容器镜像',
-          icon: 'el-icon-user-solid',
-          component: Docker,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/docker/image',
-          name: 'DockerImage',
-          title: '依赖镜像',
-          icon: 'el-icon-user-solid',
-          component: DockerImage,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/build',
-      name: 'BuildDirIndex',
-      title: '构建配置',
-      icon: 'el-icon-film',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/build/dir',
-          name: 'BuildDir',
-          title: '构建目录',
-          icon: 'el-icon-film',
-          component: BuildDir,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/build/repo_auth',
-          name: 'RepoAuth',
-          title: '仓库认证',
-          icon: 'el-icon-film',
-          component: RepoAuth,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/build/compiler',
-          name: 'Compiler',
-          title: '编译器',
-          icon: 'el-icon-film',
-          component: Compiler,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/build/packer',
-          name: 'Packer',
-          title: '应用打包',
-          icon: 'el-icon-files',
-          component: Packer,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/app',
-      name: 'AppConfigIndex',
-      title: '应用',
-      icon: 'el-icon-files',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] },
-      children: [
-        {
-          path: '/bg/app/config',
-          name: 'AppConfig',
-          title: '应用配置',
-          icon: 'el-icon-files',
-          component: AppConfig,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        },
-        {
-          path: '/bg/app/bd',
-          name: 'BuildDeploy',
-          title: '构建部署',
-          icon: 'el-icon-files',
-          component: BuildDeploy,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        },
-        {
-          path: '/bg/app/stat',
-          name: 'AppStat',
-          title: '运行状态',
-          icon: 'el-icon-files',
-          component: AppStat,
-          meta: { needAuth: true, roles: ['devops_admin', 'devops_java', 'devops_dotnet', 'devops_npm'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/sys',
-      name: 'SiteConfigIndex',
-      title: '系统',
-      icon: 'el-icon-user-solid',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/sys/update',
-          name: 'SysUpdate',
-          title: '系统更新',
-          icon: 'el-icon-user-solid',
-          component: SysUpdate,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/sys/site',
-          name: 'SiteConfig',
-          title: '站点配置',
-          icon: 'el-icon-user-solid',
-          component: SiteConfig,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/sys/webhook',
-          name: 'Webhook',
-          title: 'webhook通知',
-          icon: 'el-icon-user-solid',
-          component: Webhook,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    },
-    {
-      path: '/bg/rbac',
-      name: 'RBACIndex',
-      title: 'RBAC',
-      icon: 'el-icon-loading',
-      component: { render: (e) => e('router-view') },
-      meta: { needAuth: true, roles: ['devops_admin'] },
-      children: [
-        {
-          path: '/bg/rbac/menu',
-          name: 'Menu',
-          title: '资源管理',
-          icon: 'el-icon-loading',
-          component: Menu,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/rbac/role',
-          name: 'Role',
-          title: '角色管理',
-          icon: 'el-icon-loading',
-          component: Role,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        },
-        {
-          path: '/bg/rbac/user',
-          name: 'User',
-          title: '用户管理',
-          icon: 'el-icon-loading',
-          component: User,
-          meta: { needAuth: true, roles: ['devops_admin'] }
-        }
-      ]
-    }
-  ]
-}

src/router/index.js

@@ -6,7 +6,6 @@ import DiskMobileRouter from './diskm'
 import UserRouter from './user'
 import BlogRouter from './blog'
 import AiRouter from './ai'
-import BackgroundDevopsRouter from './background_devops'
 import BackgroundAccountRouter from './background_account'
 import BackgroundMyRouter from './background_my'
 import BackgroundPostRouter from './background_post'
@@ -194,7 +193,6 @@ export const constantRoutes = [
 ]
 
 export const asyncRoutes = [
-  BackgroundDevopsRouter,
   BackgroundAccountRouter,
   BackgroundMyRouter,
   BackgroundPostRouter,

src/views/devops/app/AppConfig.vue

@@ -1,948 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>应用配置列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-select
-          v-model="queryInfo.env"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.appType"
-          placeholder="类型"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in appTypeList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button type="success" icon="el-icon-plus" style="margin-left: 5px" @click="handleAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="appName"
-          label="应用名"
-        />
-        <el-table-column
-          prop="appId"
-          label="应用 ID"
-        />
-        <el-table-column
-          prop="repoBranch"
-          label="分支"
-        />
-        <el-table-column
-          prop="bindPorts"
-          label="监听端口"
-        />
-        <el-table-column
-          prop="totalDeployNodes"
-          label="部署配置"
-          :show-overflow-tooltip="true"
-        >
-          <template slot-scope="scope">
-            <el-tag disable-transitions>
-              <span>{{ scope.row.totalDeployNodes }}</span>
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleDeployConfig(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="totalDomains"
-          label="关联域名"
-        >
-          <template slot-scope="scope">
-            <el-tag disable-transitions>
-              <span>{{ scope.row.totalDomains }}</span>
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleBindDomain(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleCopy(scope.$index, scope.row)"
-            >拷贝</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleDetail(scope.$index, scope.row)"
-            >详情</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
-            >编辑</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="danger"
-              @click="handleDelete(scope.$index, scope.row)"
-            >删除</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleErase(scope.$index, scope.row)"
-            >清空本地仓库</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="关联域名列表"
-      append-to-body
-      :visible.sync="showBindDomainDialog"
-      center
-    >
-      <template>
-        <el-button size="mini" type="text" icon="el-icon-plus" style="margin: 5px" @click="handleAddDomain">添加</el-button>
-        <div>
-          <el-row v-if="showElInput">
-            <el-input v-model="appDomainForm.domain" style="width: 300px; margin: 5px" />
-            <el-button size="mini" type="text" style="margin: 5px" @click="onAddDomain()">确定</el-button>
-            <el-button size="mini" type="text" style="margin: 5px" @click="showElInput = false">取消</el-button>
-          </el-row>
-          <el-row v-for="(domain, index) in domainList" :key="index">
-            <el-input
-              :value="domain"
-              style="width: 300px; margin: 5px"
-              readonly
-            />
-            <el-button size="mini" type="text" icon="el-icon-delete" style="margin: 5px" @click="onDeleteDomain(domain)">删除</el-button>
-          </el-row>
-        </div>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="拷贝应用配置"
-      append-to-body
-      :visible.sync="showCopyDialog"
-      center
-    >
-      <template>
-        <el-form :model="copyForm" label-width="80px">
-          <el-form-item label="新应用 ID">
-            <el-input v-model="copyForm.newAppId" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="新应用环境">
-            <el-select v-model="copyForm.newEnv" placeholder="选择环境">
-              <el-option
-                v-for="(item, index) in envList"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="新应用分支" style="width: 70%; padding-right: 2px">
-            <el-input v-model="copyForm.newRepoBranch" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onCopy">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="编辑应用配置"
-      append-to-body
-      :visible.sync="showEditDialog"
-      center
-    >
-      <template>
-        <el-form :model="editForm" label-width="80px">
-          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.appId" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="应用名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.appName" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="应用仓库" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.appRepo" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="仓库分支" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.repoBranch" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="监听端口" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.bindPorts" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="仓库认证">
-            <el-select v-model="editForm.repoAuthConfig" placeholder="选择仓库认证">
-              <el-option
-                v-for="(item, index) in repoAuthList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="编译工具">
-            <el-select v-model="editForm.compilerConfig" placeholder="选择编译工具">
-              <el-option
-                v-for="(item, index) in compilerList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="打包工具">
-            <el-select v-model="editForm.packerConfig" placeholder="选择打包工具">
-              <el-option
-                v-for="(item, index) in packerList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="Dockerfile" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editForm.dockerfile" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onEdit">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="应用配置详情"
-      append-to-body
-      :visible.sync="showDetailDialog"
-      center
-    >
-      <template>
-        <el-form v-if="appConfigDetail !== null" :model="appConfigDetail" label-width="80px">
-          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.appId" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="应用名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.appName" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="应用仓库" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.appRepo" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="仓库分支" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.repoBranch" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="应用路径" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.appRootPath" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="监听端口" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.bindPorts" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="仓库认证">
-            <el-input v-model="appConfigDetail.repoAuthConfig" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="编译工具">
-            <el-input v-model="appConfigDetail.compilerConfig" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="打包工具">
-            <el-input v-model="appConfigDetail.packerConfig" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="Dockerfile" style="width: 70%; padding-right: 2px">
-            <el-input v-model="appConfigDetail.dockerfile" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="添加应用配置"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <template>
-        <el-form :model="addForm" label-width="80px">
-          <el-form-item label="应用类型">
-            <el-select v-model="addForm.appType" placeholder="选择类型">
-              <el-option
-                v-for="(item, index) in appTypeList"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="所属环境">
-            <el-select v-model="addForm.env" placeholder="选择环境">
-              <el-option
-                v-for="(item, index) in envList"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.appId" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="应用名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.appName" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="应用仓库" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.appRepo" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="仓库分支" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.repoBranch" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="应用路径" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.appRootPath" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="监听端口" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.bindPorts" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="仓库认证">
-            <el-select v-model="addForm.repoAuthConfig" placeholder="选择仓库认证">
-              <el-option
-                v-for="(item, index) in repoAuthList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="编译工具">
-            <el-select v-model="addForm.compilerConfig" placeholder="选择编译工具">
-              <el-option
-                v-for="(item, index) in compilerList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="打包工具">
-            <el-select v-model="addForm.packerConfig" placeholder="选择打包工具">
-              <el-option
-                v-for="(item, index) in packerList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="Dockerfile" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.dockerfile" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAdd">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="deployConfigDialogTitle"
-      append-to-body
-      :visible.sync="showDeployConfigDialog"
-      width="70%"
-      center
-    >
-      <template>
-        <el-button type="success" icon="el-icon-plus" style="margin-bottom: 5px" @click="handleAddDeployConfig">添加</el-button>
-        <el-table
-          :data="appDeployConfigList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="appName"
-            label="应用名"
-          />
-          <el-table-column
-            prop="machineIpv4"
-            label="机器地址"
-          />
-          <el-table-column
-            prop="packType"
-            label="打包类型"
-          />
-          <el-table-column
-            prop="startScript"
-            label="启动脚本"
-          />
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="280"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleEditDeployConfig(scope.$index, scope.row)"
-              >编辑</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="danger"
-                @click="handleDeleteDeployConfig(scope.$index, scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="添加部署配置"
-      append-to-body
-      :visible.sync="showAddDeployConfigDialog"
-      center
-    >
-      <template>
-        <el-form :model="addDeployForm" label-width="80px">
-          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addDeployForm.appId" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="打包类型" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addDeployForm.packType" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="选择机器">
-            <el-select v-model="addDeployForm.machineId" placeholder="选择机器">
-              <el-option
-                v-for="(item, index) in machineList"
-                :key="index"
-                :label="item.value"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="启动脚本" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addDeployForm.startScript" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAddDeploy">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="编辑部署配置"
-      append-to-body
-      :visible.sync="showEditDeployConfigDialog"
-      center
-    >
-      <template>
-        <el-form :model="editDeployForm" label-width="80px">
-          <el-form-item label="应用 ID" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editDeployForm.appId" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="打包类型" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editDeployForm.packType" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="机器地址" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editDeployForm.machineIpv4" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="启动脚本" style="width: 70%; padding-right: 2px">
-            <el-input v-model="editDeployForm.startScript" type="textarea" :rows="10" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onEditDeploy">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  addAppBindDomain,
-  addAppConfig, addAppDeployConfig,
-  copyAppConfig, deleteAppBindDomain,
-  deleteAppConfig, deleteAppDeployConfig,
-  eraseAppRepo, getAppBindDomain,
-  getAppConfig,
-  getAppConfigList,
-  getAppDeployConfigList,
-  getBuildConfig,
-  getDeployMachineList,
-  getEnvList,
-  updateAppConfig, updateAppDeployConfig
-} from '@/api/devops'
-
-export default {
-  name: 'AppConfig',
-  data() {
-    return {
-      envList: [],
-      appTypeList: [],
-      queryInfo: {
-        env: 'test',
-        appType: '',
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showBindDomainDialog: false,
-      domainList: [],
-      showElInput: false,
-      appDomainForm: {
-        appId: '',
-        domain: ''
-      },
-      // **********************************************************************
-      showAddDialog: false,
-      repoAuthList: [],
-      compilerList: [],
-      packerList: [],
-      addForm: {
-        appType: null,
-        env: null,
-        appId: null,
-        appName: null,
-        appRepo: null,
-        repoBranch: null,
-        appRootPath: null,
-        bindPorts: null,
-        repoAuthConfig: null,
-        compilerConfig: null,
-        packerConfig: null,
-        dockerfile: null
-      },
-      // **********************************************************************
-      showCopyDialog: false,
-      copyForm: {
-        appId: null,
-        newAppId: null,
-        newEnv: null,
-        newRepoBranch: null
-      },
-      // **********************************************************************
-      showEditDialog: false,
-      editForm: {
-        appId: null,
-        appName: null,
-        repoBranch: null,
-        repoAuthConfig: null,
-        compilerConfig: null,
-        packerConfig: null,
-        dockerfile: null
-      },
-      // **********************************************************************
-      showDetailDialog: false,
-      appConfigDetail: null,
-      // **********************************************************************
-      deployConfigDialogTitle: '',
-      showDeployConfigDialog: false,
-      appDeployConfigList: [],
-      showAddDeployConfigDialog: false,
-      machineList: [],
-      packTypes: [],
-      addDeployForm: {
-        appId: null,
-        packType: null,
-        machineId: null,
-        machineIpv4: null,
-        startScript: null
-      },
-      showEditDeployConfigDialog: false,
-      editDeployForm: {
-        appId: null,
-        machineId: null,
-        startScript: null
-      }
-    }
-  },
-  created() {
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.queryInfo.env = resp.data.userEnv
-        this.queryInfo.appType = resp.data.userAppType
-        this.envList = resp.data.envList
-        this.appTypeList = resp.data.appTypeList
-
-        const env = this.$route.query.env
-        if (env !== undefined && env !== null) {
-          this.queryInfo.env = env
-        }
-        const appType = this.$route.query.appType
-        if (appType !== undefined && appType !== null) {
-          this.queryInfo.appType = appType
-        }
-        const pageNumber = this.$route.query.pn
-        if (pageNumber !== undefined && pageNumber !== null) {
-          this.currentPage = parseInt(pageNumber)
-          this.queryInfo.pn = parseInt(pageNumber)
-        }
-
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-
-    document.title = '应用配置列表'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.queryInfo.pn = pageNumber
-      this.$router.push({
-        path: '/bg/app/config',
-        query: this.queryInfo
-      })
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getAppConfigList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBindDomain(index, row) {
-      this.appDomainForm.appId = row.appId
-      this.getAppBindDomainWrapper(row.appId)
-    },
-    getAppBindDomainWrapper(appId) {
-      getAppBindDomain(appId).then(resp => {
-        if (resp.code === 0) {
-          this.domainList = resp.data
-          this.showBindDomainDialog = true
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAddDomain() {
-      this.showElInput = true
-    },
-    onAddDomain() {
-      addAppBindDomain(this.appDomainForm).then(resp => {
-        if (resp.code === 0) {
-          this.getAppBindDomainWrapper(this.appDomainForm.appId)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showElInput = false
-        this.appDomainForm.domain = ''
-      })
-    },
-    onDeleteDomain(domain) {
-      this.appDomainForm.domain = domain
-      deleteAppBindDomain(this.appDomainForm).then(resp => {
-        if (resp.code === 0) {
-          this.getAppBindDomainWrapper(this.appDomainForm.appId)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.appDomainForm.domain = ''
-      })
-    },
-    handleCopy(index, row) {
-      this.copyForm.appId = row.appId
-      this.showCopyDialog = true
-    },
-    onCopy() {
-      const formData = new FormData()
-      formData.append('appId', this.copyForm.appId)
-      formData.append('newAppId', this.copyForm.newAppId)
-      formData.append('newEnv', this.copyForm.newEnv)
-      formData.append('newRepoBranch', this.copyForm.newRepoBranch)
-      copyAppConfig(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showCopyDialog = false
-      })
-    },
-    handleEdit(index, row) {
-      getBuildConfig().then(resp => {
-        if (resp.code === 0) {
-          this.repoAuthList = resp.data.repoAuthList
-          this.compilerList = resp.data.compilerList
-          this.packerList = resp.data.packerList
-
-          getAppConfig(row.appId).then(resp => {
-            if (resp.code === 0) {
-              this.editForm = resp.data
-              this.showEditDialog = true
-            } else {
-              this.$message.error(resp.msg)
-            }
-          }).catch(error => {
-            this.$message.error(error.message)
-          })
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onEdit() {
-      const formData = new FormData()
-      formData.append('appId', this.editForm.appId)
-      formData.append('appName', this.editForm.appName)
-      formData.append('repoBranch', this.editForm.repoBranch)
-      formData.append('repoAuthConfig', this.editForm.repoAuthConfig)
-      formData.append('compilerConfig', this.editForm.compilerConfig)
-      formData.append('packerConfig', this.editForm.packerConfig)
-      formData.append('dockerfile', this.editForm.dockerfile)
-      updateAppConfig(formData).then(resp => {
-        if (resp.code === 0) {
-          this.getData()
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showEditDialog = false
-      })
-    },
-    handleDetail(index, row) {
-      getAppConfig(row.appId).then(resp => {
-        if (resp.code === 0) {
-          this.appConfigDetail = resp.data
-          this.showDetailDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAdd() {
-      getBuildConfig().then(resp => {
-        if (resp.code === 0) {
-          this.repoAuthList = resp.data.repoAuthList
-          this.compilerList = resp.data.compilerList
-          this.packerList = resp.data.packerList
-          this.showAddDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAdd() {
-      const formData = new FormData()
-      formData.append('appId', this.addForm.appId)
-      formData.append('appName', this.addForm.appName)
-      formData.append('appType', this.addForm.appType)
-      formData.append('env', this.addForm.env)
-      formData.append('appRepo', this.addForm.appRepo)
-      formData.append('repoBranch', this.addForm.repoBranch)
-      formData.append('appRootPath', this.addForm.appRootPath)
-      formData.append('bindPorts', this.addForm.bindPorts)
-      formData.append('repoAuthConfig', this.addForm.repoAuthConfig)
-      formData.append('compilerConfig', this.addForm.compilerConfig)
-      formData.append('packerConfig', this.addForm.packerConfig)
-      formData.append('dockerfile', this.addForm.dockerfile)
-      addAppConfig(formData).then(resp => {
-        if (resp.code === 0) {
-          this.getData()
-        } else {
-          this.$message.info(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    onSelectChange() {
-      this.currentPage = 1
-      this.queryInfo.pn = 1
-      this.$router.push({
-        path: '/bg/app/config',
-        query: this.queryInfo
-      })
-      this.getData()
-    },
-    handleDelete(index, row) {
-      this.$confirm('确定要删除 ' + row.appName + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('appId', row.appId)
-        deleteAppConfig(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    handleErase(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      eraseAppRepo(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    // ****************************************************************************************************************
-    // 应用部署配置
-    // ****************************************************************************************************************
-    handleDeployConfig(index, row) {
-      this.addDeployForm.appId = row.appId
-      this.addDeployForm.packType = row.packType
-      this.getAppDeployConfigListWrapper(row.appId)
-    },
-    getAppDeployConfigListWrapper(appId) {
-      getAppDeployConfigList(appId).then(resp => {
-        if (resp.code === 0) {
-          this.appDeployConfigList = resp.data
-          this.deployConfigDialogTitle = appId + ' 的部署配置列表'
-          this.showDeployConfigDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAddDeployConfig(index, row) {
-      getDeployMachineList(this.queryInfo.env).then(resp => {
-        if (resp.code === 0) {
-          this.machineList = resp.data
-          this.showAddDeployConfigDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAddDeploy() {
-      const formData = new FormData()
-      formData.append('appId', this.addDeployForm.appId)
-      formData.append('machineId', this.addDeployForm.machineId)
-      formData.append('packType', this.addDeployForm.packType)
-      formData.append('startScript', this.addDeployForm.startScript)
-      addAppDeployConfig(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getAppDeployConfigListWrapper(this.addDeployForm.appId)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDeployConfigDialog = false
-      })
-    },
-    handleEditDeployConfig(index, row) {
-      this.editDeployForm = row
-      this.showEditDeployConfigDialog = true
-    },
-    onEditDeploy() {
-      const formData = new FormData()
-      formData.append('appId', this.editDeployForm.appId)
-      formData.append('machineId', this.editDeployForm.machineId)
-      formData.append('startScript', this.editDeployForm.startScript)
-      updateAppDeployConfig(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getAppDeployConfigListWrapper(this.editDeployForm.appId)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showEditDeployConfigDialog = false
-      })
-    },
-    handleDeleteDeployConfig(index, row) {
-      this.$confirm('确定要删除 ' + row.appName + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('appDeployConfigId', row.appDeployConfigId)
-        deleteAppDeployConfig(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getAppDeployConfigListWrapper(row.appId)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/app/AppStat.vue

@@ -1,351 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>应用运行列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-select
-          v-model="queryInfo.env"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.appType"
-          placeholder="类型"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in appTypeList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="appName"
-          label="应用"
-        />
-        <el-table-column
-          prop="bindPorts"
-          label="监听端口"
-        />
-        <el-table-column
-          prop="packagePath"
-          label="包路径"
-        />
-        <el-table-column
-          prop="totalDeployed"
-          label="部署数量/运行中/未运行"
-        >
-          <template slot-scope="scope">
-            <el-tag disable-transitions style="margin-top: 5px; margin-left: 5px">
-              {{ scope.row.totalDeployed }}
-            </el-tag>
-            <el-tag :type="'success'" disable-transitions style="margin-top: 5px; margin-left: 5px">
-              {{ scope.row.totalRunning }}
-            </el-tag>
-            <el-tag :type="'danger'" disable-transitions style="margin-top: 5px; margin-left: 5px">
-              {{ scope.row.totalStopped }}
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="详情"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="handleDetail(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      :title="statDialogTitle"
-      append-to-body
-      :visible.sync="showStatDialog"
-      width="70%"
-      center
-    >
-      <template>
-        <el-button type="text" style="margin: 5px" @click="onRefresh">刷新</el-button>
-        <el-table
-          :data="appStatList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="machineIpv4"
-            label="机器地址"
-          />
-          <el-table-column
-            prop="packagePath"
-            label="包路径"
-          />
-          <el-table-column
-            prop="status"
-            label="运行状态"
-          >
-            <template slot-scope="scope">
-              <el-button
-                v-if="scope.row.status === '运行中'"
-                type="text"
-              >
-                <span style="color: green">{{ scope.row.status }}</span>
-              </el-button>
-              <el-button
-                v-else
-                type="text"
-              >
-                <span style="color: red">{{ scope.row.status }}</span>
-              </el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="startTime"
-            label="启动时间"
-          />
-          <el-table-column
-            prop="pid"
-            label="PID"
-          />
-          <el-table-column
-            prop="lastCheck"
-            label="上次检查"
-          />
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="280"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="danger"
-                @click="handleRestart(scope.$index, scope.row)"
-              >重启</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="danger"
-                @click="handleStop(scope.$index, scope.row)"
-              >停止</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="success"
-                @click="handleStart(scope.$index, scope.row)"
-              >启动</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleGetStat(scope.$index, scope.row)"
-              >当前状态</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  getAppStat,
-  getAppStatDetail,
-  getAppStatList,
-  getEnvList,
-  restartAppStat,
-  startAppStat, stopAppStat
-} from '@/api/devops'
-
-export default {
-  name: 'AppStat',
-  data() {
-    return {
-      envList: [],
-      appTypeList: [],
-      queryInfo: {
-        env: 'test',
-        appType: '',
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      statDialogTitle: '',
-      showStatDialog: false,
-      appStatList: [],
-      statAppId: ''
-    }
-  },
-  created() {
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.queryInfo.env = resp.data.userEnv
-        this.queryInfo.appType = resp.data.userAppType
-        this.envList = resp.data.envList
-        this.appTypeList = resp.data.appTypeList
-
-        const env = this.$route.query.env
-        if (env !== undefined && env !== null) {
-          this.queryInfo.env = env
-        }
-        const appType = this.$route.query.appType
-        if (appType !== undefined && appType !== null) {
-          this.queryInfo.appType = appType
-        }
-        const pageNumber = this.$route.query.pn
-        if (pageNumber !== undefined && pageNumber !== null) {
-          this.currentPage = parseInt(pageNumber)
-          this.queryInfo.pn = parseInt(pageNumber)
-        }
-
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-
-    document.title = '运行状态'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.queryInfo.pn = pageNumber
-      this.$router.push({
-        path: '/bg/app/stat',
-        query: this.queryInfo
-      })
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getAppStatList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefresh() {
-      this.getAppStatDetailWrapper(this.statAppId)
-    },
-    handleDetail(index, row) {
-      this.statAppId = row.appId
-      this.getAppStatDetailWrapper(this.statAppId)
-    },
-    getAppStatDetailWrapper(appId) {
-      getAppStatDetail(appId).then(resp => {
-        if (resp.code === 0) {
-          this.appStatList = resp.data
-          this.statDialogTitle = appId + ' 的应用状态列表'
-          this.showStatDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleRestart(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      formData.append('machineId', row.machineId)
-      restartAppStat(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleStop(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      formData.append('machineId', row.machineId)
-      stopAppStat(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleStart(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      formData.append('machineId', row.machineId)
-      startAppStat(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleGetStat(index, row) {
-      const queryInfo = {}
-      queryInfo.appId = row.appId
-      queryInfo.machineId = row.machineId
-      getAppStat(queryInfo).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message())
-      })
-    },
-    onSelectChange() {
-      this.currentPage = 1
-      this.queryInfo.pn = 1
-      this.$router.push({
-        path: '/bg/app/stat',
-        query: this.queryInfo
-      })
-      this.getData()
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/app/BuildDeploy.vue

@@ -1,904 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>构建部署列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-select
-          v-model="queryInfo.env"
-          placeholder="环境"
-          style="margin-left: 5px; width: 10%"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.appType"
-          placeholder="类型"
-          style="margin-left: 5px; width: 10%"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in appTypeList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-input
-          v-model="queryInfo.appName"
-          style="margin :5px; width: 20%"
-          clearable
-          placeholder="输入应用名(回车搜索)"
-          @clear="onClear"
-          @keyup.enter.native="onSearch"
-        />
-        <!--        <el-button type="success" icon="el-icon-search" style="margin-left: 5px" @click="onSearch">查询</el-button>-->
-        <el-button type="text" style="margin-left: 5px" @click="onRefresh">刷新</el-button>
-        <el-button type="text" style="margin-left: 5px" @click="handleBuildTask">构建任务</el-button>
-        <el-button type="text" style="margin-left: 5px" @click="handleResetStat">重置状态</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="appName"
-          label="应用名"
-        />
-        <el-table-column
-          prop="appId"
-          label="应用 ID"
-        />
-        <el-table-column
-          prop="repoBranch"
-          label="分支"
-        />
-        <el-table-column
-          prop="bindPorts"
-          label="监听端口"
-        />
-        <el-table-column
-          prop="commitId"
-          label="当前版本"
-        />
-        <el-table-column
-          prop="commitTime"
-          label="提交时间"
-        />
-        <el-table-column
-          prop="buildTime"
-          label="构建时间"
-        />
-        <el-table-column
-          prop="buildResult"
-          label="构建状态"
-        >
-          <template slot-scope="scope">
-            <el-button
-              v-if="scope.row.buildResult === '构建成功'"
-              type="text"
-            >
-              <span style="color: green">{{ scope.row.buildResult }}</span>
-            </el-button>
-            <el-button
-              v-else-if="scope.row.buildResult === '构建失败'"
-              type="text"
-              @click="handleBuildResult(scope.$index, scope.row)"
-            >
-              <span style="color: red">{{ scope.row.buildResult }}</span>
-            </el-button>
-            <el-button
-              v-else-if="scope.row.buildResult === '正在构建'"
-              type="text"
-            >
-              <span style="color: blue">{{ scope.row.buildResult }}</span>
-            </el-button>
-            <el-button
-              v-else
-              type="text"
-            >
-              <span>{{ scope.row.buildResult }}</span>
-            </el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="buildBy"
-          label="用户"
-        />
-        <el-table-column
-          prop="totalNode"
-          label="节点数/已运行"
-        >
-          <template slot-scope="scope">
-            <el-tag style="margin-top: 5px; margin-left: 5px" disable-transitions>
-              <span>{{ scope.row.totalNode }}</span>
-            </el-tag>
-            <el-tag style="margin-top: 5px; margin-left: 5px" disable-transitions>
-              <span>{{ scope.row.totalRunning }}</span>
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleUpdateApp(scope.$index, scope.row)"
-            >更新</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleBuildApp(scope.$index, scope.row)"
-            >构建</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleDeployList(scope.$index, scope.row)"
-            >部署列表</el-button>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleBuildLog(scope.$index, scope.row)"
-            >构建历史</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="构建任务"
-      append-to-body
-      :visible.sync="showTaskDialog"
-      center
-    >
-      <template>
-        <el-table
-          :data="buildTaskList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="appId"
-            label="应用"
-          />
-          <el-table-column
-            prop="appType"
-            label="类型"
-          />
-          <el-table-column
-            prop="env"
-            label="环境"
-          />
-          <el-table-column
-            prop="stat"
-            label="状态"
-          />
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="280"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="cancelTask(scope.$index, scope.row)"
-              >取消</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="deployDialogTitle"
-      append-to-body
-      :visible.sync="showDeployDialog"
-      width="70%"
-      center
-    >
-      <template>
-        <el-table
-          :data="deployList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="machineIpv4"
-            label="机器地址"
-          />
-          <el-table-column
-            prop="machineStatus"
-            label="机器状态"
-          >
-            <template slot-scope="scope">
-              <el-button
-                v-if="scope.row.machineStatus === 'Online'"
-                type="text"
-              >
-                <span style="color: green">{{ scope.row.machineStatus }}</span>
-              </el-button>
-              <el-button
-                v-else
-                type="text"
-              >
-                <span style="color: red">{{ scope.row.machineStatus }}</span>
-              </el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="commitId"
-            label="当前版本"
-          />
-          <el-table-column
-            prop="packagePath"
-            label="包路径"
-          />
-          <el-table-column
-            prop="deployBy"
-            label="部署用户"
-          />
-          <el-table-column
-            prop="deployTime"
-            label="部署时间"
-          />
-          <el-table-column
-            prop="deployResult"
-            label="部署结果"
-          >
-            <template slot-scope="scope">
-              <el-button
-                v-if="scope.row.deployResult === '部署成功'"
-                type="text"
-              >
-                <span style="color: green">{{ scope.row.deployResult }}</span>
-              </el-button>
-              <el-button
-                v-else-if="scope.row.deployResult === '部署失败'"
-                type="text"
-              >
-                <span style="color: red">{{ scope.row.deployResult }}</span>
-              </el-button>
-              <el-button
-                v-else-if="scope.row.deployResult === '正在部署'"
-                type="text"
-              >
-                <span style="color: blue">{{ scope.row.deployResult }}</span>
-              </el-button>
-              <el-button
-                v-else
-                type="text"
-              >
-                <span>{{ scope.row.deployResult }}</span>
-              </el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="280"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleDeployApp(scope.$index, scope.row)"
-              >部署</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="buildLogDialogTitle"
-      append-to-body
-      :visible.sync="showBuildLogDialog"
-      width="100%"
-      center
-    >
-      <template>
-        <el-table
-          :data="dataList1"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="branch"
-            label="分支"
-          />
-          <el-table-column
-            prop="commitId"
-            label="版本 ID"
-          />
-          <el-table-column
-            prop="buildTime"
-            label="构建时间"
-          />
-          <el-table-column
-            prop="buildResult"
-            label="构建结果"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="success"
-                @click="handleBuildResult(scope.$index, scope.row)"
-              >查看</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="buildBy"
-            label="部署用户"
-          />
-          <el-table-column
-            prop="packagePath"
-            label="包路径"
-          />
-          <el-table-column
-            prop="commitId"
-            label="构建配置快照"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="success"
-                @click="handleBuildConfig(scope.$index, scope.row)"
-              >查看</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="commitTime"
-            label="构建耗时"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="success"
-                @click="handleBuildConsumed(scope.$index, scope.row)"
-              >查看</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="280"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleDeployBuild(scope.$index, scope.row)"
-              >部署</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleBuildPackage(scope.$index, scope.row)"
-              >下载</el-button>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                @click="handleDeleteBuildLog(scope.$index, scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-        <el-pagination
-          background
-          :small="screenWidth <= 768"
-          layout="prev, pager, next"
-          :page-size="pageSize1"
-          :current-page="currentPage1"
-          :total="totalSize1"
-          @current-change="handleCurrentChange1"
-          @prev-click="handleCurrentChange1"
-          @next-click="handleCurrentChange1"
-        />
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="构建结果"
-      append-to-body
-      :visible.sync="showResultDialog"
-      width="100%"
-      center
-    >
-      <template>
-        <span v-html="buildResult" />
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="构建配置快照"
-      append-to-body
-      :visible.sync="showSnapshotDialog"
-      center
-    >
-      <template>
-        <div v-if="buildConfigSnapshot !== null">
-          <h3>仓库配置</h3>
-          <el-descriptions direction="vertical" :column="3" border>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-mobile-phone" />
-                仓库认证
-              </template>
-              {{ buildConfigSnapshot.repoType }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-location-outline" />
-                认证名字
-              </template>
-              {{ buildConfigSnapshot.repoName }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-tickets" />
-                认证类型
-              </template>
-              {{ buildConfigSnapshot.repoAuthType }}
-            </el-descriptions-item>
-          </el-descriptions>
-          <h3>编译配置</h3>
-          <el-descriptions direction="vertical" :column="3" border>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-mobile-phone" />
-                编译器类型
-              </template>
-              {{ buildConfigSnapshot.compileType }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-location-outline" />
-                编译名字
-              </template>
-              {{ buildConfigSnapshot.compileName }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-tickets" />
-                编译命令
-              </template>
-              {{ buildConfigSnapshot.compileScript }}
-            </el-descriptions-item>
-          </el-descriptions>
-          <h3>打包配置</h3>
-          <el-descriptions direction="vertical" :column="4" border>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-mobile-phone" />
-                打包类型
-              </template>
-              {{ buildConfigSnapshot.packType }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-location-outline" />
-                打包名字
-              </template>
-              {{ buildConfigSnapshot.packName }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-tickets" />
-                打包路径
-              </template>
-              {{ buildConfigSnapshot.targetPath }}
-            </el-descriptions-item>
-            <el-descriptions-item>
-              <template slot="label">
-                <i class="el-icon-office-building" />
-                Dockerfile
-              </template>
-              {{ buildConfigSnapshot.dockerfile }}
-            </el-descriptions-item>
-          </el-descriptions>
-        </div>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="构建耗时"
-      append-to-body
-      :visible.sync="showConsumedDialog"
-      center
-    >
-      <template>
-        <el-descriptions v-if="buildConsumed !== null" direction="vertical" :column="5" border>
-          <el-descriptions-item>
-            <template slot="label">
-              <i class="el-icon-mobile-phone" />
-              构建总耗时(second)
-            </template>
-            {{ buildConsumed.total }}
-          </el-descriptions-item>
-          <el-descriptions-item>
-            <template slot="label">
-              <i class="el-icon-location-outline" />
-              更新耗时(ms)
-            </template>
-            {{ buildConsumed.pullConsumed }}
-          </el-descriptions-item>
-          <el-descriptions-item>
-            <template slot="label">
-              <i class="el-icon-tickets" />
-              编译耗时(ms)
-            </template>
-            {{ buildConsumed.compileConsumed }}
-          </el-descriptions-item>
-          <el-descriptions-item>
-            <template slot="label">
-              <i class="el-icon-office-building" />
-              打包耗时(ms)
-            </template>
-            {{ buildConsumed.packConsumed }}
-          </el-descriptions-item>
-          <el-descriptions-item>
-            <template slot="label">
-              <i class="el-icon-office-building" />
-              推送耗时(ms)
-            </template>
-            {{ buildConsumed.pushConsumed }}
-          </el-descriptions-item>
-        </el-descriptions>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  buildApp,
-  cancelBuildTask, deleteBuildLog, deployApp, getBuildConfigSnapshot, getBuildConsumed,
-  getBuildDeployList,
-  getBuildLogList, getBuildPackageUrl, getBuildResult,
-  getBuildTaskList,
-  getDeployList,
-  getEnvList,
-  resetBuildStat, updateApp
-} from '@/api/devops'
-
-export default {
-  name: 'BuildDeploy',
-  data() {
-    return {
-      envList: [],
-      appTypeList: [],
-      queryInfo: {
-        env: 'test',
-        appType: '',
-        appName: '',
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showTaskDialog: null,
-      buildTaskList: [],
-      // **********************************************************************
-      buildLogDialogTitle: '',
-      showBuildLogDialog: false,
-      queryInfo1: {
-        appId: '',
-        pn: 1
-      },
-      currentPage1: 1,
-      pageSize1: 10,
-      totalSize1: 0,
-      dataList1: [],
-      showResultDialog: false,
-      buildResult: null,
-      showSnapshotDialog: false,
-      buildConfigSnapshot: null,
-      showConsumedDialog: false,
-      buildConsumed: null,
-      // **********************************************************************
-      deployDialogTitle: '',
-      showDeployDialog: false,
-      deployList: [],
-      deployForm: {
-        appId: null,
-        buildLogId: null,
-        machineId: null
-      }
-    }
-  },
-  created() {
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.queryInfo.env = resp.data.userEnv
-        this.queryInfo.appType = resp.data.userAppType
-        this.envList = resp.data.envList
-        this.appTypeList = resp.data.appTypeList
-
-        const env = this.$route.query.env
-        if (env !== undefined && env !== null) {
-          this.queryInfo.env = env
-        }
-        const appType = this.$route.query.appType
-        if (appType !== undefined && appType !== null) {
-          this.queryInfo.appType = appType
-        }
-        const pageNumber = this.$route.query.pn
-        if (pageNumber !== undefined && pageNumber !== null) {
-          this.currentPage = parseInt(pageNumber)
-          this.queryInfo.pn = parseInt(pageNumber)
-        }
-
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-
-    document.title = '构建部署'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.queryInfo.pn = pageNumber
-      this.$router.push({
-        path: '/bg/app/bd',
-        query: this.queryInfo
-      })
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getBuildDeployList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildTask() {
-      this.showTaskDialog = true
-      getBuildTaskList().then(resp => {
-        if (resp.code === 0) {
-          this.buildTaskList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    cancelTask(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      cancelBuildTask(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleResetStat() {
-      resetBuildStat().then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildLog(index, row) {
-      this.queryInfo1.appId = row.appId
-      this.queryInfo1.pn = 1
-      getBuildLogList(this.queryInfo1).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList1 = respData.list
-          this.totalSize1 = respData.totalSize
-          this.buildLogDialogTitle = row.appId + ' 的构建历史列表'
-          this.showBuildLogDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleCurrentChange1(pageNumber) {
-      this.queryInfo1.pn = pageNumber
-      getBuildLogList(this.queryInfo1).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList1 = respData.list
-          this.totalSize1 = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildResult(index, row) {
-      const queryInfo = {}
-      queryInfo.buildLogId = row.buildLogId
-      getBuildResult(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.buildResult = resp.data
-          this.showResultDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildConfig(index, row) {
-      const queryInfo = {}
-      queryInfo.buildLogId = row.buildLogId
-      getBuildConfigSnapshot(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.buildConfigSnapshot = resp.data
-          this.showSnapshotDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildConsumed(index, row) {
-      const queryInfo = {}
-      queryInfo.buildLogId = row.buildLogId
-      getBuildConsumed(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.buildConsumed = resp.data
-          this.showConsumedDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildPackage(index, row) {
-      const queryInfo = {}
-      queryInfo.buildLogId = row.buildLogId
-      getBuildPackageUrl(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.$message.info(resp.data)
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDeployBuild(index, row) {
-      const formData = new FormData()
-      formData.append('buildLogId', row.buildLogId)
-      formData.append('machineId', '')
-      deployApp(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDeleteBuildLog(index, row) {
-      const formData = new FormData()
-      formData.append('buildLogId', row.buildLogId)
-      deleteBuildLog(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleUpdateApp(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      updateApp(formData).then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleBuildApp(index, row) {
-      const formData = new FormData()
-      formData.append('appId', row.appId)
-      buildApp(formData).then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDeployList(index, row) {
-      const queryInfo = {}
-      queryInfo.appId = row.appId
-      this.deployForm.appId = row.appId
-      this.deployForm.buildLogId = row.buildLogId
-      getDeployList(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.deployList = resp.data
-          this.deployDialogTitle = row.appId + ' 的部署列表'
-          this.showDeployDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDeployApp(index, row) {
-      const formData = new FormData()
-      formData.append('buildLogId', this.deployForm.buildLogId)
-      formData.append('machineId', row.machineId)
-      deployApp(formData).then(resp => {
-        this.$message.info(resp.msg)
-
-        const queryInfo = {}
-        queryInfo.appId = this.deployForm.appId
-        getDeployList(queryInfo).then(resp => {
-          if (resp.code === 0) {
-            this.deployList = resp.data
-          }
-        })
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onClear() {
-      this.getData()
-    },
-    onSearch() {
-      this.getData()
-    },
-    onRefresh() {
-      this.queryInfo.appName = ''
-      this.getData()
-    },
-    onSelectChange() {
-      this.currentPage = 1
-      this.queryInfo.pn = 1
-      this.$router.push({
-        path: '/bg/app/bd',
-        query: this.queryInfo
-      })
-      this.getData()
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/build/BuildDir.vue

@@ -1,90 +0,0 @@
-<template>
-  <el-container>
-    <el-header>
-      <h3>构建数据目录</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="machineIpv4"
-          label="机器地址"
-        />
-        <el-table-column
-          prop="dirPath"
-          label="本地目录"
-        />
-        <el-table-column
-          prop="mountedOn"
-          label="所属分区"
-        />
-        <el-table-column
-          prop="totalStr"
-          label="分区总量"
-        />
-        <el-table-column
-          prop="availStr"
-          label="分区可用"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
-            >清空</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-  </el-container>
-</template>
-
-<script>
-import { eraseBuildDir, getBuildDir } from '@/api/devops'
-
-export default {
-  name: 'BuildDir',
-  data() {
-    return {
-      dataList: []
-    }
-  },
-  created() {
-    document.title = '构建目录'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getBuildDir().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleEdit(index, row) {
-      eraseBuildDir().then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/build/Compiler.vue

@@ -1,395 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>编译配置列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleShowAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="type"
-          label="编译类型"
-        />
-        <el-table-column
-          prop="name"
-          label="编译名字"
-        />
-        <el-table-column
-          prop="homePath"
-          label="编译器主目录"
-        />
-        <el-table-column
-          prop="compilerImage"
-          label="编译器镜像"
-        />
-        <el-table-column
-          prop="compileCmd"
-          label="编译命令"
-        />
-        <el-table-column
-          prop="versionCmd"
-          label="编译器版本命令"
-        >
-          <template slot-scope="scope">
-            <span style="margin: 5px">{{ scope.row.versionCmd }}</span>
-            <el-button
-              style="margin: 5px"
-              size="mini"
-              type="success"
-              @click="handleGetVersion(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="compilerBinds"
-          label="镜像映射"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="success"
-              icon="el-icon-edit"
-              @click="handleShowImage(scope.$index, scope.row)"
-            >编辑</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="120"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <!-- 添加编译器对话框 -->
-    <el-dialog
-      title="添加编译器"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <template>
-        <el-form ref="form" :model="form" label-width="80px">
-          <el-form-item label="编译类型">
-            <el-select v-model="form.type" placeholder="选择编译类型">
-              <el-option
-                v-for="(item, index) in compileTypes"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="编译名字">
-            <el-input v-model="form.name" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="编译主目录" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.homePath" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="编译命令">
-            <el-input v-model="form.compileCmd" type="textarea" autosize style="padding-right: 1px;" />
-          </el-form-item>
-          <el-form-item label="编译器版本命令" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.versionCmd" type="textarea" autosize style="padding-right: 1px;" />
-          </el-form-item>
-          <el-form-item label="编译镜像">
-            <el-input v-model="form.compilerImage" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAddCompiler">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <!-- 查看 docker 目录映射对话框 -->
-    <el-dialog
-      title="docker 目录映射"
-      append-to-body
-      :visible.sync="showImageDialog"
-      center
-    >
-      <template>
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleAddBind">添加</el-button>
-        <el-table
-          :data="dockerBinds"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="hostPath"
-            label="host 路径"
-          />
-          <el-table-column
-            prop="containerPath"
-            label="container 路径"
-          />
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="120"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="danger"
-                @click="onDeleteBind(scope.$index, scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="添加 docker 目录映射"
-      append-to-body
-      :visible.sync="showAddBindDialog"
-      center
-    >
-      <template>
-        <el-form ref="form" :model="dockerBindForm" label-width="80px">
-          <el-form-item label="host 目录" style="width: 70%; padding-right: 2px">
-            <el-input v-model="dockerBindForm.hostPath" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="container 目录" style="width: 70%; padding-right: 2px">
-            <el-input v-model="dockerBindForm.containerPath" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAddBind">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="title"
-      append-to-body
-      :visible.sync="showVersionDialog"
-      center
-    >
-      <template>
-        <span v-html="versionResult" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  addCompiler, addImageBind,
-  deleteCompiler,
-  deleteImageBind,
-  getCompilerList,
-  getCompilerTypes, getCompilerVersion,
-  getImageBindList
-} from '@/api/devops'
-
-export default {
-  name: 'Compiler',
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      form: {
-        type: 'none',
-        name: '',
-        homePath: '',
-        compileCmd: '',
-        versionCmd: '',
-        compilerImage: ''
-      },
-      compileTypes: [],
-      // **********************************************************************
-      showImageDialog: false,
-      showAddBindDialog: false,
-      dockerBinds: [],
-      dockerBindForm: {
-        id: 0,
-        hostPath: '',
-        containerPath: ''
-      },
-      // **********************************************************************
-      showVersionDialog: false,
-      versionResult: '',
-      title: '编译器版本信息'
-    }
-  },
-  created() {
-    document.title = '编译器列表'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getCompilerList(this.currentPage).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowAdd(index, row) {
-      getCompilerTypes().then(resp => {
-        if (resp.code === 0) {
-          this.showAddDialog = true
-          this.compileTypes = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAddCompiler() {
-      const formData = new FormData()
-      formData.append('type', this.form.type)
-      formData.append('name', this.form.name)
-      formData.append('homePath', this.form.homePath)
-      formData.append('compileCmd', this.form.compileCmd)
-      formData.append('versionCmd', this.form.versionCmd)
-      formData.append('compilerImage', this.form.compilerImage)
-      addCompiler(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleGetVersion(index, row) {
-      getCompilerVersion(row.id).then(resp => {
-        if (resp.code === 0) {
-          this.versionResult = resp.data
-          this.title = row.name + ' 版本信息'
-          this.showVersionDialog = true
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowImage(index, row) {
-      this.dockerBindForm.id = row.id
-      this.getImageBindListWrapper(row.id)
-    },
-    getImageBindListWrapper(id) {
-      const queryInfo = {}
-      queryInfo.id = id
-      getImageBindList(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.dockerBinds = resp.data
-          this.showImageDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAddBind() {
-      this.showAddBindDialog = true
-    },
-    onAddBind() {
-      addImageBind(this.dockerBindForm).then(resp => {
-        if (resp.code === 0) {
-          this.getImageBindListWrapper(this.dockerBindForm.id)
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddBindDialog = false
-        this.dockerBindForm.hostPath = ''
-        this.dockerBindForm.containerPath = ''
-      })
-    },
-    onDeleteBind(index, row) {
-      this.dockerBindForm.hostPath = row.hostPath
-      this.dockerBindForm.containerPath = row.containerPath
-      deleteImageBind(this.dockerBindForm).then(resp => {
-        if (resp.code === 0) {
-          this.getImageBindListWrapper(this.dockerBindForm.id)
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.dockerBindForm.hostPath = ''
-        this.dockerBindForm.containerPath = ''
-      })
-    },
-    handleEdit(index, row) {
-      this.$confirm('确定要删除 ' + row.name + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('id', row.id)
-        deleteCompiler(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/build/Packer.vue

@@ -1,219 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>打包配置列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleShowAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="type"
-          label="打包类型"
-        />
-        <el-table-column
-          prop="name"
-          label="打包名字"
-        />
-        <el-table-column
-          prop="binDirname"
-          label="bin 目录路径"
-        />
-        <el-table-column
-          prop="targetPath"
-          label="存放位置"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="120"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="添加打包配置"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <template>
-        <el-form ref="form" :model="form" label-width="80px">
-          <el-form-item label="打包类型">
-            <el-select v-model="form.type" placeholder="选择打包类型">
-              <el-option
-                v-for="(item, index) in packTypes"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="打包名字" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.name" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <div v-if="form.type === 'docker'">
-            <el-form-item label="docker 仓库">
-              <el-select v-model="form.dockerRegistry" placeholder="选择 docker 仓库">
-                <el-option
-                  v-for="(item, index) in registryList"
-                  :key="index"
-                  :label="item.label"
-                  :value="item.value"
-                />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="存放位置" style="width: 70%; padding-right: 2px">
-              <el-input v-model="form.targetPath" style="width: 70%; padding-right: 2px" />
-            </el-form-item>
-          </div>
-          <div v-else>
-            <el-form-item label="bin 目录路径" style="width: 70%; padding-right: 2px">
-              <el-input v-model="form.binDirname" style="width: 70%; padding-right: 2px" />
-            </el-form-item>
-          </div>
-          <el-form-item>
-            <el-button type="primary" @click="onAddPacker">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { addPacker, deletePacker, getPackerList, getPackTypes } from '@/api/devops'
-
-export default {
-  name: 'Packer',
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      form: {
-        type: '',
-        name: '',
-        binDirname: '/',
-        targetPath: '',
-        dockerRegistry: ''
-      },
-      packTypes: [],
-      registryList: []
-    }
-  },
-  created() {
-    document.title = '打包配置列表'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getPackerList(this.currentPage).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowAdd(index, row) {
-      getPackTypes().then(resp => {
-        if (resp.code === 0) {
-          this.showAddDialog = true
-          this.packTypes = resp.data.packTypes
-          this.registryList = resp.data.registryList
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAddPacker() {
-      const formData = new FormData()
-      formData.append('type', this.form.type)
-      formData.append('name', this.form.name)
-      formData.append('binDirname', this.form.binDirname)
-      formData.append('dockerRegistry', this.form.dockerRegistry)
-      formData.append('targetPath', this.form.targetPath)
-      addPacker(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleEdit(index, row) {
-      this.$confirm('确定要删除 ' + row.name + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('id', row.id)
-        deletePacker(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/build/RepoAuth.vue

@@ -1,224 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>仓库认证列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleShowAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="type"
-          label="仓库类型"
-        />
-        <el-table-column
-          prop="name"
-          label="认证名字"
-        />
-        <el-table-column
-          prop="authType"
-          label="认证类型"
-        />
-        <el-table-column
-          prop="username"
-          label="帐号"
-        />
-        <el-table-column
-          prop="password"
-          label="密码"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="120"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <!-- 添加编译器对话框 -->
-    <el-dialog
-      title="添加编译器"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <template>
-        <el-form ref="form" :model="form" label-width="80px">
-          <el-form-item label="仓库类型">
-            <el-select v-model="form.type" placeholder="选择编译类型">
-              <el-option
-                v-for="(item, index) in repoTypes"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="认证类型">
-            <el-select v-model="form.authType" placeholder="选择编译类型">
-              <el-option
-                v-for="(item, index) in authTypes"
-                :key="index"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="认证名字">
-            <el-input v-model="form.name" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="用户名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.username" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="密码">
-            <el-input v-model="form.password" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-<!--          <el-form-item label="私钥" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.rsaPrikey" type="textarea" autosize style="padding-right: 1px;" />
-          </el-form-item>-->
-          <el-form-item>
-            <el-button type="primary" @click="onAddRepoAuth">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { addRepoAuth, deleteRepoAuth, getRepoAuthList, getRepoTypes } from '@/api/devops'
-
-export default {
-  name: 'RepoAuth',
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      form: {
-        type: 'git',
-        name: '',
-        authType: 'http',
-        username: '',
-        password: '',
-        rsaPrikey: ''
-      },
-      repoTypes: [],
-      authTypes: []
-    }
-  },
-  created() {
-    document.title = '仓库认证列表'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getRepoAuthList(this.currentPage).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowAdd(index, row) {
-      getRepoTypes().then(resp => {
-        if (resp.code === 0) {
-          this.showAddDialog = true
-          this.repoTypes = resp.data.repoTypes
-          this.authTypes = resp.data.authTypes
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAddRepoAuth() {
-      const formData = new FormData()
-      formData.append('type', this.form.type)
-      formData.append('name', this.form.name)
-      formData.append('authType', this.form.authType)
-      formData.append('username', this.form.username)
-      formData.append('password', this.form.password)
-      addRepoAuth(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleEdit(index, row) {
-      this.$confirm('确定要删除 ' + row.name + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('id', row.id)
-        deleteRepoAuth(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/docker/Docker.vue

@@ -1,386 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>容器镜像管理</h3>
-      <el-row style="margin-top: 10px">
-        <span>
-          <span v-if="wsConnectStatus" style="color: green; margin: 5px">WebSocket 已连接</span>
-          <span v-if="!wsConnectStatus" style="color: red; margin: 5px">WebSocket 未连接</span>
-        </span>
-        <el-select
-          v-model="env"
-          size="mini"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="machineId"
-          size="mini"
-          placeholder="机器"
-          style="margin-left: 5px"
-          @change="onSelectChange1"
-        >
-          <el-option
-            v-for="(item, index) in machineList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button size="mini" type="warning" icon="el-icon-refresh" style="margin-left: 5px" @click="onRefresh">刷新</el-button>
-        <el-button size="mini" type="warning" icon="el-icon-files" style="margin-left: 5px" @click="onGetImages">镜像列表</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="name"
-          label="容器名"
-        />
-        <el-table-column
-          prop="status"
-          label="状态"
-        />
-        <el-table-column
-          prop="createdAt"
-          label="创建时间"
-        />
-        <el-table-column
-          prop="repoTag"
-          label="依赖镜像"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="210"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleDelete(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-
-    <el-dialog
-      title="镜像列表"
-      append-to-body
-      :visible.sync="showImageDialog"
-      width="70%"
-      center
-    >
-      <template>
-        <el-select
-          v-model="queryInfo.type"
-          size="mini"
-          style="margin-left: 5px"
-        >
-          <el-option label="关键字匹配" value="1" />
-          <el-option label="前缀匹配" value="2" />
-        </el-select>
-        <el-input
-          v-model="queryInfo.keyword"
-          size="mini"
-          style="width: 20%; padding: 3px"
-          clearable
-          placeholder="标题"
-        />
-        <el-button size="mini" type="success" icon="el-icon-search" style="margin-left: 5px" @click="onGetImages">查询</el-button>
-        <el-button size="mini" type="danger" icon="el-icon-search" style="margin-left: 5px" @click="onDeleteImages">删除未用镜像</el-button>
-        <el-table
-          ref="multipleTable"
-          :data="dataList1"
-          border
-          height="480"
-          style="margin-left: 5px; width: 100%"
-          @selection-change="handleSelectionChange"
-        >
-          <el-table-column
-            type="selection"
-          />
-          <el-table-column
-            prop="repoTag"
-            label="镜像标签"
-          />
-          <el-table-column
-            prop="createdAt"
-            label="创建时间"
-          />
-          <el-table-column
-            prop="totalContainers"
-            label="使用的容器数量"
-          />
-        </el-table>
-        <el-button size="mini" type="success" icon="el-icon-minus" style="margin: 5px" @click="toggleSelection()">取消已选择</el-button>
-        <el-button size="mini" type="success" icon="el-icon-delete" style="margin: 5px" @click="deleteSelection()">删除已选择</el-button>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getEnvList, getMachineSessions } from '@/api/devops'
-
-export default {
-  name: 'Docker',
-  data() {
-    return {
-      env: 'test',
-      envList: [],
-      machineId: '',
-      machineList: [],
-      queryInfo: {
-        type: '1',
-        keyword: ''
-      },
-      multipleSelection: [],
-      dataList: [],
-      dockerContainerList: [],
-      showImageDialog: false,
-      dataList1: [],
-      wsClient: null,
-      wsConnectStatus: false,
-      wsReconnectLock: false
-    }
-  },
-  created() {
-    document.title = '容器镜像管理'
-
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.env = resp.data.userEnv
-        this.envList = resp.data.envList
-        this.getMachineList(this.env)
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-    this.initWebSocket()
-  },
-  methods: {
-    getMachineList(env) {
-      getMachineSessions(env).then(resp => {
-        if (resp.code === 0) {
-          this.machineList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleSelectionChange(val) {
-      this.multipleSelection = val
-    },
-    toggleSelection(rows) {
-      if (rows) {
-        rows.forEach(row => {
-          this.$refs.multipleTable.toggleRowSelection(row)
-        })
-      } else {
-        this.$refs.multipleTable.clearSelection()
-      }
-    },
-    deleteSelection() {
-      if (this.multipleSelection.length === 0) {
-        this.$message.warning('请先选择要删除的项')
-        return
-      }
-
-      const imageIds = []
-      for (const item of this.multipleSelection) {
-        imageIds.push(item.imageId)
-      }
-      this.$confirm('确定要删除选择的镜像?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('imageIds', imageIds)
-
-        const jsonPayload = {}
-        jsonPayload.machineId = this.machineId
-        jsonPayload.ops = 'imageRm'
-        jsonPayload.payload = imageIds
-        this.sendMessage(JSON.stringify(jsonPayload))
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    handleDelete(index, row) {
-      this.$confirm('确定要删除选择的容器?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('opsType', 3)
-        formData.append('containerId', row.containerId)
-
-        const containerIds = []
-        containerIds.push(row.containerId)
-        const jsonPayload = {}
-        jsonPayload.machineId = this.machineId
-        jsonPayload.ops = 'containerRm'
-        jsonPayload.payload = containerIds
-        this.sendMessage(JSON.stringify(jsonPayload))
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    onRefresh() {
-      const jsonPayload = {}
-      jsonPayload.machineId = this.machineId
-      jsonPayload.ops = 'containerList'
-      this.sendMessage(JSON.stringify(jsonPayload))
-    },
-    onGetImages() {
-      if (this.machineId === '') {
-        this.$message.warning('请选择机器')
-        return
-      }
-
-      const jsonPayload = {}
-      jsonPayload.machineId = this.machineId
-      jsonPayload.ops = 'imageList'
-      jsonPayload.dockerQuery = this.queryInfo
-      this.sendMessage(JSON.stringify(jsonPayload))
-      this.showImageDialog = true
-    },
-    onDeleteImages() {
-      const jsonPayload = {}
-      jsonPayload.machineId = this.machineId
-      jsonPayload.ops = 'imageRmUnused'
-      jsonPayload.dockerQuery = this.queryInfo
-      this.sendMessage(JSON.stringify(jsonPayload))
-    },
-    onSelectChange() {
-      this.machineId = ''
-      this.getMachineList(this.env)
-    },
-    onSelectChange1() {
-      if (!this.wsConnectStatus) {
-        this.$message.warning('websocket 未连接')
-        return
-      }
-
-      const jsonPayload = {}
-      jsonPayload.machineId = this.machineId
-      jsonPayload.ops = 'containerList'
-      this.sendMessage(JSON.stringify(jsonPayload))
-    },
-    // ****************************************************************************************************************
-    // WebSocket相关
-    // ****************************************************************************************************************
-    getUrl() {
-      const protocol = location.protocol
-      const hostname = location.hostname
-      const port = location.port
-      let prefix
-      if (protocol === 'https:') {
-        if (port === '' || port === 443) {
-          prefix = 'wss://' + hostname
-        } else {
-          prefix = 'wss://' + hostname + ':' + port
-        }
-      } else {
-        if (port === '' || port === 80) {
-          prefix = 'ws://' + hostname
-        } else {
-          prefix = 'ws://' + hostname + ':' + port
-        }
-      }
-
-      var token = '0123456789'
-      var params = 'token=' + token
-      return prefix + '/bgws/frontend?' + params
-    },
-    initWebSocket() {
-      if ('WebSocket' in window) {
-        const wsUrl = this.getUrl()
-        console.log(wsUrl)
-        this.wsClient = new WebSocket(wsUrl)
-        const that = this
-        this.wsClient.onopen = function() {
-          that.setOnline()
-        }
-        this.wsClient.onclose = function() {
-          that.setOffline()
-          that.reconnect()
-        }
-        this.wsClient.onerror = function() {
-          that.setOffline()
-          console.log('websocket connection error...')
-          that.reconnect()
-        }
-        this.wsClient.onmessage = function(evt) {
-          const message = JSON.parse(evt.data)
-          that.processMessage(message)
-        }
-      } else {
-        // 浏览器不支持 WebSocket
-        this.$message.error('您的浏览器不支持 WebSocket!')
-      }
-    },
-    setOnline() {
-      this.wsConnectStatus = true
-    },
-    setOffline() {
-      this.wsConnectStatus = false
-    },
-    reconnect() {
-      if (this.wsReconnectLock) return
-      this.wsReconnectLock = true
-      const that = this
-      setTimeout(function() {
-        console.log('websocket reconnecting...')
-        that.initWebSocket()
-        that.wsReconnectLock = false
-      }, 5000)
-    },
-    sendMessage(message) {
-      this.wsClient.send(message)
-    },
-    processMessage(message) {
-      const ops = message.ops
-      if (ops === 'containerList') {
-        this.dataList = []
-        this.dataList = message.resultList
-      } else if (ops === 'imageList') {
-        this.dataList1 = []
-        this.dataList1 = message.resultList
-      } else {
-        console.log(message)
-      }
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/docker/DockerImage.vue

@@ -1,114 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>构建依赖镜像</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="imageList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="repoTag"
-          label="镜像"
-        />
-        <el-table-column
-          prop="stage"
-          label="依赖阶段"
-        >
-          <template slot-scope="scope">
-            <el-tag v-if="scope.row.stage === '编译阶段'" :type="'warning'">
-              {{ scope.row.stage }}
-            </el-tag>
-            <el-tag v-else-if="scope.row.stage === '打包阶段'" :type="'success'">
-              {{ scope.row.stage }}
-            </el-tag>
-            <el-tag v-else>
-              {{ scope.row.stage }}
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="used"
-          label="使用量"
-        >
-          <template slot-scope="scope">
-            <el-tag
-              style="margin: 5px"
-              size="mini"
-            >
-              <span>{{ scope.row.list.length }}</span>
-            </el-tag>
-            <el-button
-              style="margin: 5px"
-              size="mini"
-              type="success"
-              @click="handleShowApps(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-
-    <el-dialog
-      title="依赖镜像的编译器或应用"
-      append-to-body
-      :visible.sync="showAppDialog"
-      center
-    >
-      <template>
-        <div v-for="(item, index) in appList" :key="index">
-          <el-col :md="4">
-            <el-tag size="mini" style="margin: 5px">{{ item }}</el-tag>
-          </el-col>
-        </div>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getDockerfileImageList } from '@/api/devops'
-
-export default {
-  name: 'DockerImage',
-  data() {
-    return {
-      showImageDialog: false,
-      imageList: [],
-      showAppDialog: false,
-      appList: []
-    }
-  },
-  created() {
-    document.title = '构建依赖镜像'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      getDockerfileImageList().then(resp => {
-        if (resp.code === 0) {
-          this.imageList = resp.data
-          this.showImageDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowAdd() {
-      this.showAddDialog = true
-    },
-    handleShowApps(index, row) {
-      this.appList = row.list
-      this.showAppDialog = true
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/docker/DockerRegistry.vue

@@ -1,175 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>镜像仓库列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleShowAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="registryUrl"
-          label="仓库地址"
-        />
-        <el-table-column
-          prop="username"
-          label="帐号"
-        />
-        <el-table-column
-          prop="password"
-          label="密码"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="120"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="添加 docker 仓库"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <template>
-        <el-form ref="form" :model="form" label-width="80px">
-          <el-form-item label="仓库地址">
-            <el-input v-model="form.registryUrl" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="用户名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.username" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="密码">
-            <el-input v-model="form.password" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAddDockerRegistry">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { addDockerRegistry, deleteDockerRegistry, getDockerRegistryList } from '@/api/devops'
-
-export default {
-  name: 'DockerRegistry',
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      form: {
-        registryUrl: '',
-        username: '',
-        password: ''
-      }
-    }
-  },
-  created() {
-    document.title = '镜像仓库列表'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getDockerRegistryList(this.currentPage).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowAdd() {
-      this.showAddDialog = true
-    },
-    onAddDockerRegistry() {
-      const formData = new FormData()
-      formData.append('registryUrl', this.form.registryUrl)
-      formData.append('username', this.form.username)
-      formData.append('password', this.form.password)
-      addDockerRegistry(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleEdit(index, row) {
-      this.$confirm('确定要删除 ' + row.registryUrl + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('id', row.id)
-        deleteDockerRegistry(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/file/FileList.vue

@@ -1,245 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>我的文件</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="pubDate"
-          label="文件名"
-          width="150"
-        />
-        <el-table-column
-          prop="videoId"
-          label="修改时间"
-          width="120"
-        >
-          <template slot-scope="scope">
-            <router-link target="_blank" :to="`/video/${scope.row.videoId}`">
-              <span>{{ scope.row.videoId }}</span>
-            </router-link>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="description"
-          label="大小"
-          :show-overflow-tooltip="true"
-        >
-          <template slot-scope="scope">
-            <el-tooltip
-              v-if="scope.row.description"
-              :content="scope.row.description"
-              raw-content
-              placement="top-start"
-            >
-              <span v-if="scope.row.description && scope.row.description.length <= 15">
-                {{ scope.row.description }}
-              </span>
-              <span v-if="scope.row.description && scope.row.description.length > 15">
-                {{ scope.row.description.substr(0, 15) + "..." }}
-              </span>
-            </el-tooltip>
-            <span v-else-if="scope.row.description === null">-</span>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="duration"
-          label="文件类型"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="handlePreview(scope.$index, scope.row)"
-            >预览</el-button>
-            <el-button
-              size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
-            >编辑</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改视频可见范围</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateScope">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.scope" placeholder="选择可见范围">
-            <el-option label="本人可见" value="1" />
-            <el-option label="所有人可见" value="2" />
-            <el-option label="VIP 可见" value="3" />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <!-- 视频预览对话框 -->
-    <el-dialog
-      title="预览视频"
-      append-to-body
-      :visible.sync="showPreviewDialog"
-      :before-close="handleDialogClose"
-      width="70%"
-      center
-    >
-      <template>
-        <video-preview-player :video-prop.sync="videoProp" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo } from '@/api/vod'
-import { getVideoList } from '@/api/admin'
-
-export default {
-  name: 'VideoPost',
-  components: { VideoPreviewPlayer },
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      videoProp: null,
-      showVideoResourceDialog: false,
-      showEditScopeDialog: false,
-      showPreviewDialog: false,
-      form: {
-        videoId: null,
-        scope: 1
-      },
-      videoResources: [],
-      publishVideoDiaglog: false
-    }
-  },
-  created() {
-    document.title = 'AdminVideoList'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getVideoList(0).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    handleScope(index, row) {
-      this.form.videoId = row.videoId
-      this.form.scope = '' + row.scope
-      this.showEditScopeDialog = true
-    },
-    handleDialogClose(done) {
-      this.showPreviewDialog = false
-      this.videoProp = {
-        videoId: null,
-        play: false
-      }
-      done()
-    },
-    handlePreview(index, row) {
-      videoInfo(row.videoId).then(res => {
-        if (res.code === 0) {
-          this.showPreviewDialog = true
-          this.videoProp = {
-            videoId: res.data.videoId,
-            play: true
-          }
-        }
-      })
-    },
-    handleEdit(index, row) {
-      const path = '/post/video/edit/' + row.videoId
-      this.$router.push(path)
-    },
-    onUpdateScope() {
-      this.showEditScopeDialog = false
-      updateVideoScope(this.form).then(res => {
-        if (res.code === 0) {
-          this.$notify({
-            title: '提示',
-            message: '视频可见范围已更新',
-            type: 'warning',
-            duration: 3000
-          })
-        }
-      }).catch(error => {
-        this.$notify({
-          title: '提示',
-          message: error.message,
-          type: 'warning',
-          duration: 3000
-        })
-      })
-    },
-    onSelectChange() {
-      this.$message.info(this.queryInfo)
-    },
-    handleClose() {
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/file/ImageFile.vue

@@ -1,164 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>图片列表</h3>
-    </el-header>
-    <el-main>
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改视频可见范围</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateScope">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.scope" placeholder="选择可见范围">
-            <el-option label="本人可见" value="1" />
-            <el-option label="所有人可见" value="2" />
-            <el-option label="VIP 可见" value="3" />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <!-- 视频预览对话框 -->
-    <el-dialog
-      title="预览视频"
-      append-to-body
-      :visible.sync="showPreviewDialog"
-      :before-close="handleDialogClose"
-      width="70%"
-      center
-    >
-      <template>
-        <video-preview-player :video-prop.sync="videoProp" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo } from '@/api/vod'
-import { getVideoList } from '@/api/admin'
-
-export default {
-  name: 'VideoPost',
-  components: { VideoPreviewPlayer },
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      videoProp: null,
-      showVideoResourceDialog: false,
-      showEditScopeDialog: false,
-      showPreviewDialog: false,
-      form: {
-        videoId: null,
-        scope: 1
-      },
-      videoResources: [],
-      publishVideoDiaglog: false
-    }
-  },
-  created() {
-    document.title = 'AdminVideoList'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getVideoList(0).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    handleScope(index, row) {
-      this.form.videoId = row.videoId
-      this.form.scope = '' + row.scope
-      this.showEditScopeDialog = true
-    },
-    handleDialogClose(done) {
-      this.showPreviewDialog = false
-      this.videoProp = {
-        videoId: null,
-        play: false
-      }
-      done()
-    },
-    handlePreview(index, row) {
-      videoInfo(row.videoId).then(res => {
-        if (res.code === 0) {
-          this.showPreviewDialog = true
-          this.videoProp = {
-            videoId: res.data.videoId,
-            play: true
-          }
-        }
-      })
-    },
-    handleEdit(index, row) {
-      const path = '/post/video/edit/' + row.videoId
-      this.$router.push(path)
-    },
-    onUpdateScope() {
-      this.showEditScopeDialog = false
-      updateVideoScope(this.form).then(res => {
-        if (res.code === 0) {
-          this.$notify({
-            title: '提示',
-            message: '视频可见范围已更新',
-            type: 'warning',
-            duration: 3000
-          })
-        }
-      }).catch(error => {
-        this.$notify({
-          title: '提示',
-          message: error.message,
-          type: 'warning',
-          duration: 3000
-        })
-      })
-    },
-    onSelectChange() {
-      this.$message.info(this.queryInfo)
-    },
-    handleClose() {
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/machine/AliyunKey.vue

@@ -1,89 +0,0 @@
-<template>
-  <el-container>
-    <el-header>
-      <h3>阿里云帐号列表</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="type"
-          label="类型"
-        />
-        <el-table-column
-          prop="endpoint"
-          label="Endpoint"
-        />
-        <el-table-column
-          prop="accessKeyId"
-          label="AccessKeyId"
-          :show-overflow-tooltip="true"
-        />
-        <el-table-column
-          prop="accessKeySecret"
-          label="AccessKeySecret"
-          :show-overflow-tooltip="true"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleEdit(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-  </el-container>
-</template>
-
-<script>
-import { getAliyunKeyList } from '@/api/devops'
-
-export default {
-  name: 'AliyunKey',
-  data() {
-    return {
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: []
-    }
-  },
-  created() {
-    document.title = '阿里云帐号列表'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getAliyunKeyList().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleEdit(index, row) {
-      this.$message.info('delete ' + row.endpoint)
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/machine/MachineHost.vue

@@ -1,466 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <el-row style="margin-top: 5px">
-        <h3>机器列表</h3>
-        <el-select
-          v-model="queryInfo.env"
-          placeholder="查询条件"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button type="text" style="margin-left: 5px" @click="handleGetAliyunOss">阿里云OSS</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="machineIpv4"
-          label="机器地址"
-        />
-        <el-table-column
-          prop="bootTime"
-          label="启动时间"
-        />
-        <el-table-column
-          prop="status"
-          label="当前状态"
-        >
-          <template slot-scope="scope">
-            <el-tag v-if="scope.row.status === 'Online'" :type="'success'" disable-transitions>
-              <span>在线</span>
-            </el-tag>
-            <el-tag v-else-if="scope.row.status === 'Offline'" :type="'danger'" disable-transitions>
-              <span>离线</span>
-            </el-tag>
-            <el-tag v-else :type="'warning'" disable-transitions>
-              <span>弃用</span>
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="osArch"
-          label="系统架构"
-        />
-        <el-table-column
-          prop="osName"
-          label="系统名字"
-        />
-        <el-table-column
-          prop="osVersion"
-          label="系统版本"
-        />
-        <el-table-column
-          prop="agentVersion"
-          label="Agent 版本"
-        />
-        <el-table-column
-          prop="used"
-          label="使用量"
-        >
-          <template slot-scope="scope">
-            <el-tag disable-transitions>
-              <span>{{ scope.row.used }}</span>
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleMachineUsage(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="duration"
-          label="所属环境"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="success"
-              @click="handleEditEnv(scope.$index, scope.row)"
-            >设置</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          label="操作"
-          width="180"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="warning"
-              @click="handleDeprecate(scope.$index, scope.row)"
-            >弃用</el-button>
-            <el-button
-              size="mini"
-              type="danger"
-              @click="handleDelete(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <!-- 修改所属环境对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditEnvDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改机器所属环境</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateEnv">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.env" placeholder="设置环境">
-            <el-option
-              v-for="(item, index) in envList"
-              :key="index"
-              :label="item.label"
-              :value="item.value"
-            />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <el-dialog
-      title="机器中部署的应用"
-      append-to-body
-      :visible.sync="showUsageDialog"
-      center
-    >
-      <template>
-        <el-table
-          :data="machineUsedList"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="label"
-            label="应用 ID"
-          />
-          <el-table-column
-            prop="value"
-            label="应用名"
-          />
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="阿里云 OSS bucket 列表"
-      append-to-body
-      :visible.sync="showAliyunOssDialog"
-      width="50%"
-      center
-    >
-      <template>
-        <el-button type="text" style="margin-left: 5px" @click="handleAdd">添加</el-button>
-        <el-table
-          :data="aliyunOssList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="machineId"
-            label="机器 ID"
-          />
-          <el-table-column
-            prop="used"
-            label="使用量"
-          >
-            <template slot-scope="scope">
-              <el-tag disable-transitions>
-                <span>{{ scope.row.used }}</span>
-              </el-tag>
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="success"
-                @click="handleMachineUsage(scope.$index, scope.row)"
-              >查看</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            prop="env"
-            label="所属环境"
-          >
-            <template slot-scope="scope">
-              <el-tag style="margin: 5px">{{ scope.row.env }}</el-tag>
-              <el-button
-                size="mini"
-                type="success"
-                @click="handleEditEnv(scope.$index, scope.row)"
-              >设置</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column
-            label="操作"
-            width="180"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="danger"
-                @click="handleDelete(scope.$index, scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="添加阿里云 OSS bucket"
-      append-to-body
-      :visible.sync="showAddDialog"
-      width="50%"
-      center
-    >
-      <template>
-        <el-form :model="addForm" label-width="80px">
-          <el-form-item label="bucket 名字" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.machineId" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="所属环境">
-            <el-select v-model="addForm.env" placeholder="选择所属环境">
-              <el-option
-                v-for="(item, index) in envList"
-                :key="index"
-                :label="item.label"
-                :value="item.label"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onAdd">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  addAliyunOss,
-  deleteMachine,
-  deprecateMachine, getAliyunOss,
-  getEnvList,
-  getMachineList,
-  getMachineUsedList,
-  updateMachineEnv
-} from '@/api/devops'
-
-export default {
-  name: 'MachineHost',
-  data() {
-    return {
-      queryInfo: {
-        pn: 1,
-        env: null
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      showEditEnvDialog: false,
-      form: {
-        machineId: null,
-        env: null
-      },
-      envList: [],
-      showUsageDialog: false,
-      machineUsedList: [],
-      // **********************************************************************
-      showAliyunOssDialog: false,
-      aliyunOssList: [],
-      showAddDialog: false,
-      addForm: {
-        machineId: null,
-        env: 'prod'
-      }
-    }
-  },
-  created() {
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.queryInfo.env = resp.data.userEnv
-        this.envList = resp.data.envList
-
-        const env = this.$route.query.env
-        if (env !== undefined && env !== null) {
-          this.queryInfo.env = env
-        }
-        const pageNumber = this.$route.query.pn
-        if (pageNumber !== undefined && pageNumber !== null) {
-          this.currentPage = parseInt(pageNumber)
-          this.queryInfo.pn = parseInt(pageNumber)
-        }
-
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-
-    document.title = '机器列表'
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.queryInfo.pn = pageNumber
-      this.$router.push({
-        path: '/bg/machine/host',
-        query: this.queryInfo
-      })
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getMachineList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleEditEnv(index, row) {
-      this.form.machineId = row.machineId
-      this.form.env = this.queryInfo.env
-      this.showEditEnvDialog = true
-    },
-    onUpdateEnv() {
-      this.showEditEnvDialog = false
-      const formData = new FormData()
-      formData.append('machineId', this.form.machineId)
-      formData.append('env', this.form.env)
-      updateMachineEnv(formData).then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleMachineUsage(index, row) {
-      this.form.machineId = row.machineId
-      getMachineUsedList(row.machineId).then(resp => {
-        if (resp.code === 0) {
-          this.showUsageDialog = true
-          this.machineUsedList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onSelectChange() {
-      this.currentPage = 1
-      this.queryInfo.pn = 1
-      this.$router.push({
-        path: '/bg/machine/host',
-        query: this.queryInfo
-      })
-      this.getData()
-    },
-    handleDeprecate(index, row) {
-      const formData = new FormData()
-      formData.append('machineId', row.machineId)
-      deprecateMachine(formData).then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDelete(index, row) {
-      this.$confirm('确定要删除 ' + row.machineIpv4 + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('machineId', row.machineId)
-        deleteMachine(formData).then(resp => {
-          this.$message.info(resp.msg)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    },
-    handleGetAliyunOss() {
-      getAliyunOss().then(resp => {
-        if (resp.code === 0) {
-          this.aliyunOssList = resp.data
-          this.showAliyunOssDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAdd() {
-      this.showAddDialog = true
-    },
-    onAdd() {
-      const formData = new FormData()
-      formData.append('machineId', this.addForm.machineId)
-      formData.append('env', this.addForm.env)
-      addAliyunOss(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.handleGetAliyunOss()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/machine/MachineProc.vue

@@ -1,147 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>机器上的服务进程</h3>
-      <el-row style="margin-top: 10px">
-        <el-select
-          v-model="env"
-          size="mini"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.machineId"
-          size="mini"
-          placeholder="机器"
-          style="margin-left: 5px"
-          @change="onSelectChange1"
-        >
-          <el-option
-            v-for="(item, index) in machineList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button size="mini" type="warning" icon="el-icon-refresh" style="margin-left: 5px" @click="onRefresh">刷新</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="name"
-          label="进程名"
-        />
-        <el-table-column
-          prop="pid"
-          label="进程 ID"
-        />
-        <el-table-column
-          prop="ppid"
-          label="父进程 ID"
-        />
-        <el-table-column
-          prop="cmdLine"
-          label="启动命令行"
-        />
-        <el-table-column
-          prop="bindAddress"
-          label="监听端口"
-        />
-        <el-table-column
-          prop="startTime"
-          label="启动时间"
-        />
-        <el-table-column
-          prop="user"
-          label="用户"
-        />
-      </el-table>
-    </el-main>
-  </el-container>
-</template>
-
-<script>
-import { getEnvList, getMachineProcList, getMachineSessions } from '@/api/devops'
-
-export default {
-  name: 'MachineProc',
-  data() {
-    return {
-      env: 'test',
-      envList: [],
-      machineList: [],
-      queryInfo: {
-        machineId: ''
-      },
-      dataList: []
-    }
-  },
-  created() {
-    document.title = '服务进程列表'
-
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.env = resp.data.userEnv
-        this.envList = resp.data.envList
-        this.getMachineList(this.env)
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-  },
-  methods: {
-    getMachineList(env) {
-      getMachineSessions(env).then(resp => {
-        if (resp.code === 0) {
-          this.machineList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    getData() {
-      getMachineProcList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    onSelectChange() {
-      this.machine = ''
-      this.getMachineList(this.env)
-    },
-    onSelectChange1() {
-      this.getData()
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/machine/MachineTask.vue

@@ -1,151 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>DevopsAgent 定时任务</h3>
-      <el-row style="margin-top: 10px">
-        <el-select
-          v-model="env"
-          size="mini"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.machineId"
-          size="mini"
-          placeholder="机器"
-          style="margin-left: 5px"
-          @change="onSelectChange1"
-        >
-          <el-option
-            v-for="(item, index) in machineList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button size="mini" type="warning" icon="el-icon-refresh" style="margin-left: 5px" @click="onRefresh">刷新</el-button>
-        <el-button size="mini" type="warning" icon="el-icon-delete" style="margin-left: 5px" @click="onErase">清空</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          prop="createTime"
-          label="执行时间"
-        />
-        <el-table-column
-          prop="taskName"
-          label="任务名"
-        />
-      </el-table>
-    </el-main>
-  </el-container>
-</template>
-
-<script>
-import { eraseMachineTask, getEnvList, getMachineSessions, getMachineTaskList } from '@/api/devops'
-
-export default {
-  name: 'MachineTask',
-  data() {
-    return {
-      env: 'test',
-      envList: [],
-      machine: '',
-      machineList: [],
-      queryInfo: {
-        machineId: ''
-      },
-      multipleSelection: [],
-      dataList: []
-    }
-  },
-  created() {
-    document.title = '任务结果列表'
-
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.env = resp.data.userEnv
-        this.envList = resp.data.envList
-        this.getMachineList(this.env)
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-  },
-  methods: {
-    getMachineList(env) {
-      getMachineSessions(env).then(resp => {
-        if (resp.code === 0) {
-          this.machineList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    getData() {
-      getMachineTaskList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onSelectChange() {
-      this.machine = ''
-      this.getMachineList(this.env)
-    },
-    onSelectChange1() {
-      this.getData()
-    },
-    onRefresh() {
-      this.getData()
-    },
-    onErase() {
-      this.$confirm('确定要情况删除 ' + this.queryInfo.machineId + ' 的任务记录?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('machineId', this.queryInfo.machineId)
-        eraseMachineTask(formData).then(resp => {
-          this.$message.info(resp.msg)
-          this.getData()
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-</style>

src/views/devops/rbac/Menu.vue

@@ -1,116 +0,0 @@
-<template>
-  <el-container>
-    <el-header>
-      <h3>资源目录树</h3>
-    </el-header>
-    <el-main>
-      <el-col :md="12">
-        <div style="height: 70vh;">
-          <el-scrollbar ref="myScrollbar" style="width: 100%; height: 100%;">
-            <el-card class="box-card" :body-style="{ paddingTop: '5px' }">
-              <div class="text item">
-                <el-tree
-                  :default-expand-all="true"
-                  :data="treeNode"
-                  :props="defaultProps"
-                  highlight-current
-                  @node-click="handleNodeClick"
-                >
-                  <span slot-scope="{ node, data }">
-                    <span :class="data.icon">
-                      <span style="color: blue">{{ node.label }}({{ data.children.length }}) </span>
-                      <span style="color: green">{{ data.url }} </span>
-                      <span style="color: red">{{ data.type }}</span>
-                    </span>
-                  </span>
-                </el-tree>
-              </div>
-            </el-card>
-          </el-scrollbar>
-        </div>
-      </el-col>
-    </el-main>
-
-    <el-dialog
-      title="编辑资源"
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      center
-    >
-      <el-form :model="menuForm" label-width="80px">
-        <el-input v-model="menuForm.id" type="hidden" style="width: 70%; padding-right: 2px" />
-        <el-form-item label="名字" style="width: 70%; padding-right: 2px">
-          <el-input v-model="menuForm.name" style="width: 70%; padding-right: 2px" readonly />
-        </el-form-item>
-        <el-form-item label="URL" style="width: 70%; padding-right: 2px">
-          <el-input v-model="menuForm.url" style="width: 70%; padding-right: 2px" readonly />
-        </el-form-item>
-        <el-form-item label="类型" style="width: 70%; padding-right: 2px">
-          <el-input v-model="menuForm.type" style="width: 70%; padding-right: 2px" readonly />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="onEdit">确定</el-button>
-        </el-form-item>
-      </el-form>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getMenuList } from '@/api/devops'
-
-export default {
-  name: 'Menu',
-  data() {
-    return {
-      treeNode: [],
-      defaultProps: {
-        children: 'children',
-        label: 'label',
-        value: 'value'
-      },
-      // **********************************************************************
-      showEditScopeDialog: false,
-      menuForm: {
-        id: '',
-        name: ''
-      }
-    }
-  },
-  created() {
-    document.title = '资源目录树'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getMenuList().then(resp => {
-        if (resp.code === 0) {
-          this.treeNode = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleNodeClick(data) {
-      this.menuForm = data
-      this.showEditScopeDialog = true
-    },
-    onEdit() {
-      this.$message.info('on edit')
-      this.showEditScopeDialog = false
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/rbac/Role.vue

@@ -1,218 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>角色列表</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="name"
-          label="角色"
-        />
-        <el-table-column
-          prop="description"
-          label="描述"
-        />
-        <el-table-column
-          prop="createTime"
-          label="创建时间"
-        />
-        <el-table-column
-          prop="total"
-          label="拥有角色的用户"
-        >
-          <template slot-scope="scope">
-            <el-tag>
-              {{ scope.row.totalUsers }}
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleShowUser(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="scope"
-          label="拥有的资源"
-        >
-          <template slot-scope="scope">
-            <el-tag>
-              {{ scope.row.totalMenus }}
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleUpdateResource(scope.$index, scope.row)"
-            >设置</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-
-    <el-dialog
-      title="拥有角色的用户"
-      append-to-body
-      :visible.sync="showUserDialog"
-      center
-    >
-      <template>
-        <el-table
-          :data="roleUsers"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="username"
-            label="登入名"
-          />
-          <el-table-column
-            prop="screenName"
-            label="用户名"
-          />
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="设置角色可访问的资源"
-      append-to-body
-      :visible.sync="showUpdateDialog"
-      center
-    >
-      <template>
-        <div style="height: 70vh;">
-          <el-scrollbar ref="myScrollbar" style="width: 100%; height: 100%;">
-            <el-card class="box-card" :body-style="{ paddingTop: '5px' }">
-              <div class="text item">
-                <el-tree
-                  :default-expand-all="true"
-                  node-key="id"
-                  :data="allMenus"
-                  :props="defaultProps"
-                  :default-checked-keys="roleMenuIds"
-                  show-checkbox
-                  highlight-current
-                  @check-change="handleCheckChange"
-                >
-                  <span slot-scope="{ node, data }">
-                    <span :class="data.icon">{{ node.label }}</span>
-                  </span>
-                </el-tree>
-              </div>
-            </el-card>
-          </el-scrollbar>
-          <el-button type="primary" size="mini" @click="onUpdateMenu">确定</el-button>
-        </div>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getRoleList, getRoleMenu, getRoleUser, updateRoleMenu } from '@/api/devops'
-
-export default {
-  name: 'Role',
-  data() {
-    return {
-      dataList: [],
-      // **********************************************************************
-      showUserDialog: false,
-      roleUsers: [],
-      // **********************************************************************
-      showUpdateDialog: false,
-      // 代表 node
-      defaultProps: {
-        children: 'children',
-        label: 'label',
-        value: 'value'
-      },
-      allMenus: [],
-      roleMenuIds: [],
-      roleId: null
-    }
-  },
-  created() {
-    document.title = '角色列表'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getRoleList().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowUser(index, row) {
-      getRoleUser((row.id)).then(resp => {
-        if (resp.code === 0) {
-          this.roleUsers = resp.data
-          this.showUserDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleUpdateResource(index, row) {
-      this.roleId = row.id
-      getRoleMenu((row.id)).then(resp => {
-        if (resp.code === 0) {
-          this.allMenus = resp.data.allMenus
-          this.roleMenuIds = resp.data.roleMenuIds
-          this.showUpdateDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleCheckChange(data, checked, indeterminate) {
-      const menuId = data.id
-      if (checked) {
-        this.roleMenuIds.push(menuId)
-      } else {
-        const index = this.roleMenuIds.indexOf(menuId)
-        if (index > -1) {
-          this.roleMenuIds.splice(index, 1)
-        }
-      }
-    },
-    onUpdateMenu() {
-      const formData = new FormData()
-      formData.append('id', this.roleId)
-      formData.append('menuIds', this.roleMenuIds)
-      updateRoleMenu(formData).then(resp => {
-        this.$message.info(resp.msg)
-        this.getData()
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showUpdateDialog = false
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/rbac/User.vue

@@ -1,333 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>用户列表</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" size="mini" icon="el-icon-plus" @click="handleAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="username"
-          label="帐号"
-        />
-        <el-table-column
-          prop="createTime"
-          label="创建时间"
-        />
-        <el-table-column
-          prop="sessionCount"
-          label="会话总数"
-        >
-          <template slot-scope="scope">
-            <el-tag>
-              {{ scope.row.sessionCount }}
-            </el-tag>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="lastAccess"
-          label="最近访问"
-          :show-overflow-tooltip="true"
-        />
-        <el-table-column
-          prop="status"
-          label="状态"
-        />
-        <el-table-column
-          prop="roleCount"
-          label="角色总数"
-        >
-          <template slot-scope="scope">
-            <el-tag>
-              {{ scope.row.roleCount }}
-            </el-tag>
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleUpdateRole(scope.$index, scope.row)"
-            >设置</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="scope"
-          label="修改密码"
-        >
-          <template slot-scope="scope">
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              type="success"
-              @click="handleUpdatePasswd(scope.$index, scope.row)"
-            >重置</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="90"
-        >
-          <template slot-scope="scope">
-            <el-button
-              type="danger"
-              size="mini"
-              @click="handleDelete(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="添加用户"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <el-form :model="addForm" label-width="80px">
-        <el-form-item label="帐号" style="width: 70%; padding-right: 2px">
-          <el-input v-model="addForm.username" style="width: 70%; padding-right: 2px" />
-        </el-form-item>
-        <el-form-item label="密码" style="width: 70%; padding-right: 2px">
-          <el-input v-model="addForm.password" style="width: 70%; padding-right: 2px" />
-        </el-form-item>
-        <el-form-item label="角色" style="width: 70%; padding-right: 2px">
-          <el-checkbox-group v-model="addForm.roles">
-            <el-checkbox v-for="(item, index) in addUserRoleList" :key="index" :label="item" />
-          </el-checkbox-group>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" size="mini" @click="onAdd">确定</el-button>
-        </el-form-item>
-      </el-form>
-    </el-dialog>
-    <el-dialog
-      title="设置角色"
-      append-to-body
-      :visible.sync="showUpdateRoleDialog"
-      center
-    >
-      <template>
-        <el-checkbox-group v-model="userRoleList">
-          <el-checkbox v-for="(item, index) in roleList" :key="index" :label="item" />
-        </el-checkbox-group>
-        <el-button type="primary" size="mini" @click="onUpdateRole">确定</el-button>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="重置密码"
-      append-to-body
-      :visible.sync="showUpdatePasswdDialog"
-      center
-    >
-      <template>
-        <el-form :model="updatePasswdForm" label-width="80px">
-          <el-form-item label="帐号" style="width: 70%; padding-right: 2px">
-            <el-input v-model="updatePasswdForm.username" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="密码" style="width: 70%; padding-right: 2px">
-            <el-input v-model="updatePasswdForm.password" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" size="mini" @click="onUpdatePasswd">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  addUser,
-  deleteUser,
-  getAddUserRoleList,
-  getUserList,
-  getUserRole,
-  updateUserPasswd,
-  updateUserRole
-} from '@/api/devops'
-
-export default {
-  name: 'User',
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      addUserRoleList: [],
-      addForm: {
-        username: null,
-        password: null,
-        roles: []
-      },
-      // **********************************************************************
-      showUpdateRoleDialog: false,
-      roleList: [],
-      userRoleList: [],
-      updateRoleForm: {
-        userId: null,
-        roles: null
-      },
-      // **********************************************************************
-      showUpdatePasswdDialog: false,
-      updatePasswdForm: {
-        userId: null,
-        username: null,
-        password: null
-      }
-    }
-  },
-  created() {
-    document.title = '用户列表'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getUserList().then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAdd() {
-      getAddUserRoleList().then(resp => {
-        if (resp.code === 0) {
-          this.addUserRoleList = resp.data
-          this.showAddDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAdd() {
-      const formData = new FormData()
-      formData.append('username', this.addForm.username)
-      formData.append('password', this.addForm.password)
-      formData.append('roles', this.addForm.roles)
-      addUser(formData).then(resp => {
-        this.getData()
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleUpdateRole(index, row) {
-      this.updateRoleForm.userId = row.userId
-      getUserRole(row.userId).then(resp => {
-        if (resp.code === 0) {
-          this.roleList = resp.data.allRoles
-          this.userRoleList = resp.data.userRoles
-          this.showUpdateRoleDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onUpdateRole() {
-      const formData = new FormData()
-      formData.append('userId', this.updateRoleForm.userId)
-      formData.append('roles', this.userRoleList)
-      updateUserRole(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showUpdateRoleDialog = false
-      })
-    },
-    handleUpdatePasswd(index, row) {
-      this.updatePasswdForm.userId = row.userId
-      this.updatePasswdForm.username = row.username
-      this.showUpdatePasswdDialog = true
-    },
-    onUpdatePasswd() {
-      const formData = new FormData()
-      formData.append('userId', this.updatePasswdForm.userId)
-      formData.append('password', this.updatePasswdForm.password)
-      updateUserPasswd(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showUpdatePasswdDialog = false
-      })
-    },
-    handleDelete(index, row) {
-      this.$confirm('确定要删除 ' + row.username + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('userId', row.userId)
-        deleteUser(formData).then(resp => {
-          this.getData()
-          this.$message.info(resp.msg)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/srv/MachineNginx.vue

@@ -1,224 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>Nginx 配置管理</h3>
-      <el-row style="margin-top: 5px">
-        <el-select
-          v-model="env"
-          size="mini"
-          placeholder="环境"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in envList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-select
-          v-model="queryInfo.machineId"
-          size="mini"
-          placeholder="机器"
-          style="margin-left: 5px"
-          @change="onSelectChange1"
-        >
-          <el-option
-            v-for="(item, index) in machineList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button size="mini" type="warning" icon="el-icon-refresh" style="margin-left: 5px" @click="onRefresh">刷新</el-button>
-        <el-row style="margin-top: 5px">
-          <el-input
-            v-model="queryInfo.path"
-            size="mini"
-            style="margin :5px; width: 20%"
-            clearable
-            placeholder="输入路径(回车搜索)"
-            @clear="onClear"
-            @keyup.enter.native="onSearch"
-          />
-        </el-row>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-row>
-        <el-col :md="12" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-          <el-card class="box-card">
-            <div slot="header" class="clearfix">
-              <span>目录树</span>
-              <el-button style="float: right; padding: 3px 0" type="text" @click="getData">刷新</el-button>
-            </div>
-            <div class="text item">
-              <el-tree
-                :accordion="true"
-                :data="treeNode"
-                :props="defaultProps"
-                highlight-current
-                @node-click="handleNodeClick"
-              >
-                <span slot-scope="{ node, data }">
-                  <span style="color: green">{{ data.type }} </span>
-                  <span :class="data.icon">{{ node.label }}</span>
-                </span>
-              </el-tree>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-main>
-
-    <el-dialog
-      :title="editDialogTitle"
-      append-to-body
-      :visible.sync="showEditDialog"
-      width="50%"
-      center
-    >
-      <template>
-        <el-form :model="confForm">
-          <el-form-item prop="textContent">
-            <el-input
-              v-model="confForm.textContent"
-              type="textarea"
-              maxlength="10000"
-              :rows="10"
-              style="padding: 5px"
-            />
-          </el-form-item>
-          <el-form-item>
-            <el-button style="float: right; padding: 3px 0" type="text" @click="onSubmit">更新</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  getEnvList,
-  getFileTree,
-  getMachineSessions,
-  getNginxConf,
-  updateNginxConf
-} from '@/api/devops'
-
-export default {
-  name: 'MachineNginx',
-  data() {
-    return {
-      treeNode: [],
-      defaultProps: {
-        children: 'children',
-        label: 'label',
-        value: 'value'
-      },
-      env: 'test',
-      envList: [],
-      machineList: [],
-      queryInfo: {
-        machineId: '',
-        path: ''
-      },
-      dataList: [],
-      showEditDialog: false,
-      editDialogTitle: '文件内容',
-      confForm: {
-        textContent: ''
-      }
-    }
-  },
-  created() {
-    document.title = 'Nginx 配置'
-    getEnvList().then(resp => {
-      if (resp.code === 0) {
-        this.env = resp.data.userEnv
-        this.envList = resp.data.envList
-        this.getMachineList(this.env)
-        this.getData()
-      } else {
-        this.$message.error(resp.msg)
-      }
-    }).catch(error => {
-      this.$message.error(error.message)
-    })
-  },
-  methods: {
-    getMachineList(env) {
-      getMachineSessions(env).then(resp => {
-        if (resp.code === 0) {
-          this.machineList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onSelectChange() {
-      this.machine = ''
-      this.getMachineList(this.env)
-    },
-    onSelectChange1() {
-      this.getData()
-    },
-    getData() {
-      getFileTree(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.treeNode = resp.data
-          // this.$message.info('数据已刷新')
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleNodeClick(data) {
-      if (data.type !== 'file') {
-        this.$message.warning('not file')
-        return
-      }
-
-      this.queryInfo.path = data.path
-      getNginxConf(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.confForm.textContent = resp.data
-          this.editDialogTitle = data.path + ' 文件内容'
-          this.showEditDialog = true
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    onSubmit() {
-      updateNginxConf(this.confForm).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showEditDialog = false
-      })
-    },
-    onClear() {
-      this.queryInfo.path = ''
-    },
-    onSearch() {
-      this.getData()
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/srv/NginxLog.vue

@@ -1,963 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <el-row style="margin-top: 10px">
-        <!--        <span>
-          <span v-if="wsConnectStatus" style="color: green; margin: 5px">WebSocket 已连接</span>
-          <span v-if="!wsConnectStatus" style="color: red; margin: 5px">WebSocket 未连接</span>
-        </span>-->
-        <span style="color: red">{{ queryInfo.dateStr }} 访问统计</span>
-        <el-select
-          v-model="queryInfo.dateStr"
-          placeholder="日期"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option
-            v-for="(item, index) in logDateList"
-            :key="index"
-            :label="item.label"
-            :value="item.value"
-          />
-        </el-select>
-        <el-button style="margin: 5px" type="success" @click="onRefresh">刷新</el-button>
-        <el-button style="margin: 5px" type="success" @click="onRefreshChart1">最近一周</el-button>
-        <el-button style="margin: 5px" type="success" @click="showDatePicker ? showDatePicker = false : showDatePicker = true">显示</el-button>
-      </el-row>
-      <el-row v-if="showDatePicker" style="margin-top: 10px">
-        <el-date-picker
-          v-model="dateTimeArray"
-          type="datetimerange"
-          range-separator="至"
-          start-placeholder="开始日期时间"
-          end-placeholder="结束日期时间"
-          :picker-options="pickerOptions1"
-        />
-        <el-button style="margin: 5px" size="small" type="success" @click="onSearch1">查询</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-row style="padding: 5px">
-        <el-col :md="16">
-          <el-card style="margin: 5px">
-            <div slot="header" class="clearfix">
-              <span>访问 IP 分布</span>
-              <el-button style="margin: 5px; float: right; padding: 3px 0" type="text" @click="onRefreshChart6">刷新</el-button>
-            </div>
-            <div id="chart6" style="height:600px;" />
-          </el-card>
-        </el-col>
-        <el-col :md="8">
-          <el-card style="margin: 5px">
-            <div slot="header" class="clearfix">
-              <span>访问数量</span>
-            </div>
-            <div>
-              <el-statistic
-                group-separator=","
-                :value="logCount"
-              />
-            </div>
-          </el-card>
-          <el-card style="margin: 5px">
-            <div slot="header" class="clearfix">
-              <span>请求状态码分布</span>
-              <el-button style="margin: 5px; float: right; padding: 3px 0" type="text" @click="onRefreshChart32">UserAgent</el-button>
-            </div>
-            <div id="chart3" style="height:400px;" />
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row style="padding: 5px">
-        <el-card>
-          <div slot="header" class="clearfix">
-            <span>每秒访问数量</span>
-            <el-button style="float: right; padding: 3px 0" type="text" @click="onRefreshChart2">刷新</el-button>
-          </div>
-          <div id="chart2" style="height:400px;" />
-        </el-card>
-      </el-row>
-      <el-row style="padding: 5px">
-        <el-col :md="12">
-          <el-card style="margin: 5px">
-            <div slot="header" class="clearfix">
-              <span>各 URL 访问数量</span>
-              <el-button style="float: right; padding: 3px 0" type="text" @click="onGetUrlChart">刷新</el-button>
-            </div>
-            <el-table
-              :data="urlList"
-              border
-              height="480"
-              style="width: 100%"
-            >
-              <el-table-column
-                label="No"
-                type="index"
-              />
-              <el-table-column
-                prop="name"
-                label="URL"
-              />
-              <el-table-column
-                prop="total"
-                label="访问量"
-              />
-              <el-table-column
-                fixed="right"
-                label="操作"
-                width="240"
-              >
-                <template slot-scope="scope">
-                  <el-button
-                    style="margin-top: 5px; margin-left: 5px"
-                    size="mini"
-                    type="success"
-                    @click="onGetDaily(scope.$index, scope.row)"
-                  >当日分布</el-button>
-                  <el-button
-                    style="margin-top: 5px; margin-left: 5px"
-                    size="mini"
-                    type="success"
-                    @click="onGetWeekly(scope.$index, scope.row)"
-                  >最近分布</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-card>
-        </el-col>
-        <el-col :md="12">
-          <el-card style="margin: 5px">
-            <div slot="header" class="clearfix">
-              <span>耗时请求 Top100</span>
-              <el-button style="float: right; padding: 3px 0" type="text" @click="onGetRequestTime">刷新</el-button>
-            </div>
-            <el-table
-              :data="requestTimeList"
-              border
-              height="480"
-              style="width: 100%"
-            >
-              <el-table-column
-                label="No"
-                type="index"
-              />
-              <el-table-column
-                prop="name"
-                label="URL"
-              />
-              <el-table-column
-                prop="value"
-                label="耗时(秒)"
-              />
-              <el-table-column
-                fixed="right"
-                label="操作"
-                width="120"
-              >
-                <template slot-scope="scope">
-                  <el-button
-                    style="margin-top: 5px; margin-left: 5px"
-                    size="mini"
-                    type="success"
-                    @click="onGetDetail(scope.$index, scope.row)"
-                  >详情</el-button>
-                </template>
-              </el-table-column>
-            </el-table>
-          </el-card>
-        </el-col>
-      </el-row>
-    </el-main>
-
-    <el-dialog
-      :title="chart1DialogTitle"
-      append-to-body
-      :visible.sync="showChart1Dialog"
-      width="70%"
-      center
-      @opened="handleDialogOpened1"
-      @closed="handleDialogClosed1"
-    >
-      <template>
-        <div id="chart1" style="height:400px;" />
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="chart5DialogTitle"
-      append-to-body
-      :visible.sync="showChart5Dialog"
-      width="70%"
-      center
-      @opened="handleDialogOpened5"
-      @closed="handleDialogClosed5"
-    >
-      <template>
-        <div id="chart5" style="height:400px;" />
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="chart4DialogTitle"
-      append-to-body
-      :visible.sync="showChart4Dialog"
-      width="70%"
-      center
-      @opened="handleDialogOpened"
-      @closed="handleDialogClosed"
-    >
-      <template>
-        <div id="chart4" style="height:400px;" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import * as echarts from 'echarts'
-import { getLogDates, getNginxLog2, getNginxLogChart2, getNginxLogChart3, getNginxLogChart4, getNginxLogChart5, getNginxLogChart6, getNginxLogCount } from '@/api/devops'
-
-export default {
-  name: 'NginxLog',
-  data() {
-    return {
-      queryInfo: {
-        dateStr: ''
-      },
-      dateTimeQuery: {
-        start: '',
-        end: '',
-        url: ''
-      },
-      logDateList: [],
-      urlList: [],
-      // **********************************************************************
-      showDatePicker: false,
-      pickerOptions1: {
-        shortcuts: [{
-          text: '最近一天',
-          onClick(picker) {
-            const end = new Date()
-            const start = new Date()
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 1)
-            picker.$emit('pick', [start, end])
-          }
-        }, {
-          text: '最近三天',
-          onClick(picker) {
-            const end = new Date()
-            const start = new Date()
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 3)
-            picker.$emit('pick', [start, end])
-          }
-        }, {
-          text: '最近一周',
-          onClick(picker) {
-            const end = new Date()
-            const start = new Date()
-            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
-            picker.$emit('pick', [start, end])
-          }
-        }]
-      },
-      dateTimeArray: '',
-      // **********************************************************************
-      requestTimeList: [],
-      logCount: 0,
-      // **********************************************************************
-      showChart1Dialog: false,
-      chart1DialogTitle: '',
-      showChart4Dialog: false,
-      chart4DialogTitle: '',
-      showChart5Dialog: false,
-      chart5DialogTitle: '',
-      // **********************************************************************
-      myChart: null,
-      xData: [],
-      yData: [],
-      myChart1: null,
-      xData1: [],
-      yData1: [],
-      myChart2: null,
-      xData2: [],
-      yData2: [],
-      myChart3: null,
-      xData3: [],
-      yData3: [],
-      myChart4: null,
-      xData4: [],
-      yData4: [],
-      myChart5: null,
-      xData5: [],
-      yData5: [],
-      myChart6: null,
-      xData6: [],
-      yData6: [],
-      // **********************************************************************
-      wsClient: null,
-      wsConnectStatus: false,
-      wsReconnectLock: false
-    }
-  },
-  mounted() {
-    this.initChart()
-  },
-  created() {
-    document.title = 'NginxLog'
-    const dateStr = this.$route.query.dateStr
-    if (dateStr !== undefined && dateStr !== null) {
-      this.queryInfo.dateStr = dateStr
-    } else {
-      var current = new Date()
-      this.queryInfo.dateStr = this.formatDate(current)
-    }
-
-    this.getData()
-    // this.initWebSocket()
-  },
-  methods: {
-    formatDate(date) {
-      const year = date.getFullYear()
-      const month = date.getMonth() + 1
-      const day = date.getDate()
-      return `${year}-${this.pad(month)}-${this.pad(day)}`
-    },
-    formatTime(date) {
-      const hour = date.getHours()
-      const minute = date.getMinutes()
-      const second = date.getSeconds()
-      return `${this.pad(hour)}:${this.pad(minute)}:${this.pad(second)}`
-    },
-    formatDateTime(date) {
-      const year = date.getFullYear()
-      const month = date.getMonth() + 1
-      const day = date.getDate()
-      const hour = date.getHours()
-      const minute = date.getMinutes()
-      const second = date.getSeconds()
-      return `${year}-${this.pad(month)}-${this.pad(day)} ${this.pad(hour)}:${this.pad(minute)}:${this.pad(second)}`
-    },
-    pad(num) {
-      return num.toString().padStart(2, '0')
-    },
-    getData() {
-      this.onGetCount()
-      this.onRefreshChart2()
-      this.onRefreshChart3()
-      this.onGetUrlChart()
-      this.onGetRequestTime()
-      // this.onRefreshChart6()
-
-      getLogDates().then(resp => {
-        if (resp.code === 0) {
-          this.logDateList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefresh() {
-      getLogDates().then(resp => {
-        if (resp.code === 0) {
-          this.logDateList = resp.data
-
-          this.onGetCount()
-          this.onRefreshChart2()
-          this.onRefreshChart3()
-          this.onGetUrlChart()
-          this.onGetRequestTime()
-          // this.onRefreshChart6()
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-      this.$message.info('数据正在刷新')
-    },
-    onSelectChange() {
-      this.$router.push({
-        path: '/bg/backend/access_log',
-        query: this.queryInfo
-      })
-      this.onRefresh()
-    },
-    onGetDaily(index, row) {
-      this.dateTimeQuery.url = row.name
-      this.chart4DialogTitle = row.name + ' 接口 ' + this.queryInfo.dateStr + ' 访问时间分布'
-      this.showChart4Dialog = true
-    },
-    onGetWeekly(index, row) {
-      this.dateTimeQuery.url = row.name
-      this.chart5DialogTitle = row.name + ' 接口 ' + this.queryInfo.dateStr + ' 前 7 天访问数量分布'
-      this.showChart5Dialog = true
-    },
-    handleDialogOpened1() {
-      var dateArr = this.queryInfo.dateStr.split('-')
-      var end = new Date(dateArr[0], dateArr[1] - 1, dateArr[2], 23, 59, 59)
-      var start = new Date(dateArr[0], dateArr[1] - 1, dateArr[2])
-      start.setDate(start.getDate() - 7)
-      const dateTimeQuery = {}
-      dateTimeQuery.start = this.formatDateTime(start)
-      dateTimeQuery.end = this.formatDateTime(end)
-      this.$nextTick(() => {
-        getNginxLogChart5(dateTimeQuery).then(resp => {
-          if (resp.code === 0) {
-            const respData = resp.data
-            const xData = respData[0]
-            const yData = respData[1]
-
-            var chartOption1 = {
-              title: {
-                text: '每日请求数量',
-                subtext: '最近一周',
-                x: 'center',
-                y: 'top',
-                textAlign: 'center'
-              },
-              tooltip: {},
-              xAxis: {
-                data: xData
-              },
-              yAxis: {},
-              series: [{
-                name: '访问数量',
-                type: 'bar',
-                data: yData
-              }]
-            }
-            this.myChart1 = this.$echarts.init(document.getElementById('chart1'))
-            this.myChart1.setOption(chartOption1)
-          } else {
-            this.$message.error(resp.msg)
-          }
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      })
-    },
-    handleDialogClosed1() {
-      if (this.myChart1) {
-        this.myChart1.dispose()
-        this.myChart1 = null
-      }
-    },
-    handleDialogOpened() {
-      // 使用$nextTick确保DOM已完全渲染
-      this.$nextTick(() => {
-        const queryInfo = {}
-        queryInfo.dateStr = this.queryInfo.dateStr
-        queryInfo.url = this.dateTimeQuery.url
-        getNginxLogChart2(queryInfo).then(resp => {
-          if (resp.code === 0) {
-            const respData = resp.data
-            const xData = respData[0]
-            const yData = respData[1]
-
-            var option4 = {
-              title: {
-                text: 'Nginx Log'
-              },
-              tooltip: {},
-              legend: {
-                data: ['reqs/s']
-              },
-              xAxis: {
-                type: 'category',
-                data: xData
-              },
-              yAxis: {},
-              series: [{
-                name: 'reqs/s',
-                type: 'line',
-                smooth: true,
-                data: yData
-              }],
-              dataZoom: [{ // 这个是设置滚动条的,可以拉动这个滚动条来改变你的图形的显示比例
-                type: 'slider',
-                show: true, // flase直接隐藏图形
-                xAxisIndex: [0],
-                left: '9%', // 滚动条靠左侧的百分比
-                bottom: -5,
-                start: 0, // 滚动条的起始位置
-                end: 50 // 滚动条的截止位置（按比例分割你的柱状图x轴长度）
-              }]
-            }
-            this.myChart4 = this.$echarts.init(document.getElementById('chart4'))
-            this.myChart4.setOption(option4)
-          } else {
-            this.$message.error(resp.msg)
-          }
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      })
-    },
-    handleDialogClosed() {
-      if (this.myChart4) {
-        this.myChart4.dispose()
-        this.myChart4 = null
-      }
-    },
-    handleDialogOpened5() {
-      var dateArr = this.queryInfo.dateStr.split('-')
-      var end = new Date(dateArr[0], dateArr[1] - 1, dateArr[2], 23, 59, 59)
-      var start = new Date(dateArr[0], dateArr[1] - 1, dateArr[2])
-      start.setDate(start.getDate() - 7)
-      this.dateTimeQuery.start = this.formatDateTime(start)
-      this.dateTimeQuery.end = this.formatDateTime(end)
-      this.$nextTick(() => {
-        getNginxLogChart5(this.dateTimeQuery).then(resp => {
-          if (resp.code === 0) {
-            const respData = resp.data
-            const xData = respData[0]
-            const yData = respData[1]
-
-            var option5 = {
-              tooltip: {},
-              xAxis: {
-                data: xData
-              },
-              yAxis: {},
-              series: [{
-                name: '访问数量',
-                type: 'bar',
-                data: yData
-              }]
-            }
-            this.myChart5 = this.$echarts.init(document.getElementById('chart5'))
-            this.myChart5.setOption(option5)
-          } else {
-            this.$message.error(resp.msg)
-          }
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      })
-    },
-    handleDialogClosed5() {
-      if (this.myChart5) {
-        this.myChart5.dispose()
-        this.myChart5 = null
-      }
-    },
-    onGetUrlChart() {
-      const queryInfo = {}
-      queryInfo.dateStr = this.queryInfo.dateStr
-      queryInfo.aggregateField = 'url'
-      getNginxLogChart3(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.urlList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onGetRequestTime() {
-      getNginxLogChart4(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.requestTimeList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onGetDetail(index, row) {
-      this.$message.info('get request detail')
-    },
-    onGetCount() {
-      getNginxLogCount(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.logCount = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefreshChart1() {
-      this.chart1DialogTitle = this.queryInfo.dateStr + ' 前 7 天访问数量分布'
-      this.showChart1Dialog = true
-    },
-    onRefreshChart2() {
-      getNginxLogChart2(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          const xData = respData[0]
-          const yData = respData[1]
-          this.myChart2.setOption({
-            xAxis: {
-              data: xData
-            },
-            series: [{
-              data: yData
-            }]
-          })
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefreshChart3() {
-      const queryInfo = {}
-      queryInfo.dateStr = this.queryInfo.dateStr
-      queryInfo.aggregateField = 'statusCode'
-      getNginxLogChart3(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          var list = []
-          for (const item of respData) {
-            list.push({
-              name: item.name,
-              value: item.total
-            })
-          }
-
-          this.myChart3.setOption({
-            series: [
-              {
-                data: list
-              }
-            ]
-          })
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefreshChart32() {
-      const queryInfo = {}
-      queryInfo.dateStr = this.queryInfo.dateStr
-      queryInfo.aggregateField = 'userAgent'
-      getNginxLogChart3(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onRefreshChart6() {
-      // 初始化统计图对象
-      this.myChart6 = this.$echarts.init(document.getElementById('chart6'))
-      // 显示 loading 动画
-      this.myChart6.showLoading()
-
-      var areaCode = '10-1'
-      const queryInfo = {}
-      queryInfo.dateStr = this.queryInfo.dateStr
-      queryInfo.aggregateField = 'ip'
-      getNginxLogChart6(queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          var geoJsonStr = respData.geoJson
-          var geoJson = JSON.parse(geoJsonStr)
-          var dataList = respData.list
-
-          var mapName = areaCode
-          var mapData = geoJson
-          var chartOption6 = this.getChartOption1(mapName, dataList)
-          const deep = parseInt(mapName.split('-')[1])
-          var splitList = this.getSplitList(deep)
-          chartOption6.visualMap.splitList = splitList
-
-          // 注册地图(地图数据来自本地或后端的 geojson 格式数据)
-          echarts.registerMap(mapName, mapData)
-          this.myChart6.setOption(chartOption6)
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        // 得到数据并绘制地图后关闭 loading 动画
-        this.myChart6.hideLoading()
-      })
-    },
-    onSearch1() {
-      if (this.dateTimeArray === '') {
-        this.$message.info('先选择日期时间, 间隔不超过 24 小时')
-        return
-      }
-
-      const startTime = this.formatDateTime(this.dateTimeArray[0])
-      const endTime = this.formatDateTime(this.dateTimeArray[1])
-      const payload = {}
-      payload.start = startTime
-      payload.end = endTime
-      getNginxLog2(payload).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    // ****************************************************************************************************************
-    // chart 相关
-    // ****************************************************************************************************************
-    initChart() {
-      var option2 = {
-        title: {
-          text: 'Nginx Log'
-        },
-        tooltip: {},
-        toolbox: {
-          feature: {
-            dataZoom: {
-              yAxisIndex: 'none'
-            },
-            restore: {},
-            saveAsImage: {}
-          }
-        },
-        legend: {
-          data: ['reqs/s']
-        },
-        xAxis: {
-          type: 'category',
-          data: this.xData2
-        },
-        yAxis: {},
-        series: [{
-          name: 'reqs/s',
-          type: 'line',
-          smooth: true,
-          data: this.yData2
-        }],
-        dataZoom: [{ // 这个是设置滚动条的,可以拉动这个滚动条来改变你的图形的显示比例
-          type: 'slider',
-          show: true, // flase直接隐藏图形
-          xAxisIndex: [0],
-          left: '9%', // 滚动条靠左侧的百分比
-          bottom: -5,
-          start: 0, // 滚动条的起始位置
-          end: 50 // 滚动条的截止位置（按比例分割你的柱状图x轴长度）
-        }]
-      }
-      this.myChart2 = this.$echarts.init(document.getElementById('chart2'))
-      this.myChart2.setOption(option2)
-
-      var chartOption3 = {
-        tooltip: {
-          trigger: 'item'
-        },
-        legend: {
-          top: '5%',
-          left: 'center'
-        },
-        series: [
-          {
-            name: 'Access From',
-            type: 'pie',
-            radius: ['40%', '70%'],
-            avoidLabelOverlap: false,
-            padAngle: 5,
-            itemStyle: {
-              borderRadius: 10
-            },
-            label: {
-              show: false,
-              position: 'center'
-            },
-            emphasis: {
-              label: {
-                show: true,
-                fontSize: 40,
-                fontWeight: 'bold'
-              }
-            },
-            labelLine: {
-              show: false
-            },
-            data: []
-          }
-        ]
-      }
-      this.myChart3 = this.$echarts.init(document.getElementById('chart3'))
-      this.myChart3.setOption(chartOption3)
-      this.onRefreshChart6()
-    },
-    getSplitList(deep) {
-      var splitList = []
-      if (deep === 1) {
-        splitList = [
-          { start: 800, end: 1000 },
-          { start: 600, end: 800 },
-          { start: 400, end: 600 },
-          { start: 200, end: 400 },
-          { start: 100, end: 200 },
-          { start: 0, end: 100 }
-        ]
-      } else if (deep === 2) {
-        splitList = [
-          { start: 500, end: 1000 },
-          { start: 100, end: 500 },
-          { start: 50, end: 100 },
-          { start: 20, end: 50 },
-          { start: 10, end: 20 },
-          { start: 0, end: 10 }
-        ]
-      } else if (deep === 3) {
-        splitList = [
-          { start: 20, end: 1000 },
-          { start: 15, end: 20 },
-          { start: 10, end: 15 },
-          { start: 5, end: 10 },
-          { start: 2, end: 5 },
-          { start: 0, end: 2 }
-        ]
-      }
-      return splitList
-    },
-    getChartOption1(mapName, dataList) {
-      return {
-        backgroundColor: '#FFFFFF',
-        tooltip: {
-          trigger: 'item'
-        },
-        // 数据导航栏
-        visualMap: {
-          show: true,
-          x: 'left', // 位于左侧
-          y: 'center',
-          splitList: [
-            { start: 800, end: 1000 },
-            { start: 600, end: 800 },
-            { start: 400, end: 600 },
-            { start: 200, end: 400 },
-            { start: 100, end: 200 },
-            { start: 0, end: 100 }
-          ],
-          // 对应 splitList 的颜色
-          color: [
-            '#5475f5',
-            '#9feaa5',
-            '#85daef',
-            '#74e2ca',
-            '#e6ac53',
-            '#9fb5ea'
-          ]
-        },
-        series: [{
-          name: '访问 IP 数量',
-          type: 'map',
-          map: mapName, // 和 registerMap 时使用的 name 一致
-          roam: true, // 是否可以移动, 放大缩小地图
-          label: {
-            show: false // 地图上显示地区名
-          },
-          data: dataList // 地图上显示的数据
-        }]
-      }
-    },
-    // ****************************************************************************************************************
-    // WebSocket 相关
-    // ****************************************************************************************************************
-    getUrl() {
-      const protocol = location.protocol
-      const hostname = location.hostname
-      const port = location.port
-      let prefix
-      if (protocol === 'https:') {
-        if (port === '' || port === 443) {
-          prefix = 'wss://' + hostname
-        } else {
-          prefix = 'wss://' + hostname + ':' + port
-        }
-      } else {
-        if (port === '' || port === 80) {
-          prefix = 'ws://' + hostname
-        } else {
-          prefix = 'ws://' + hostname + ':' + port
-        }
-      }
-
-      var params = 'app=logstash&host=localhost'
-      return prefix + '/bgws/log/pull?' + params
-    },
-    initWebSocket() {
-      if ('WebSocket' in window) {
-        const wsUrl = this.getUrl()
-        console.log(wsUrl)
-        this.wsClient = new WebSocket(wsUrl)
-        const that = this
-        this.wsClient.onopen = function() {
-          that.setOnline()
-        }
-        this.wsClient.onclose = function() {
-          that.setOffline()
-          that.reconnect()
-        }
-        this.wsClient.onerror = function() {
-          that.setOffline()
-          console.log('websocket connection error...')
-          that.reconnect()
-        }
-        this.wsClient.onmessage = function(evt) {
-          const message = JSON.parse(evt.data)
-          that.processMessage(message)
-        }
-      } else {
-        // 浏览器不支持 WebSocket
-        this.$message.error('您的浏览器不支持 WebSocket!')
-      }
-    },
-    setOnline() {
-      this.wsConnectStatus = true
-    },
-    setOffline() {
-      this.wsConnectStatus = false
-    },
-    reconnect() {
-      if (this.wsReconnectLock) return
-      this.wsReconnectLock = true
-      const that = this
-      setTimeout(function() {
-        console.log('websocket reconnecting...')
-        that.initWebSocket()
-        that.wsReconnectLock = false
-      }, 5000)
-    },
-    sendMessage(message) {
-      this.$message.info('send ws msg')
-      // this.wsClient.send(message)
-    },
-    processMessage(message) {
-      console.log(message)
-      var data = message
-      for (const x of data[0]) {
-        this.xData.push(x)
-      }
-      for (const y of data[1]) {
-        this.yData.push(y)
-      }
-
-      this.myChart.setOption({
-        xAxis: {
-          data: this.xData
-        },
-        series: [{
-          data: this.yData
-        }]
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/AccessLog.vue

@@ -1,164 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>访问日志</h3>
-    </el-header>
-    <el-main>
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改视频可见范围</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateScope">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.scope" placeholder="选择可见范围">
-            <el-option label="本人可见" value="1" />
-            <el-option label="所有人可见" value="2" />
-            <el-option label="VIP 可见" value="3" />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <!-- 视频预览对话框 -->
-    <el-dialog
-      title="预览视频"
-      append-to-body
-      :visible.sync="showPreviewDialog"
-      :before-close="handleDialogClose"
-      width="70%"
-      center
-    >
-      <template>
-        <video-preview-player :video-prop.sync="videoProp" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo } from '@/api/vod'
-import { getVideoList } from '@/api/admin'
-
-export default {
-  name: 'VideoPost',
-  components: { VideoPreviewPlayer },
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      videoProp: null,
-      showVideoResourceDialog: false,
-      showEditScopeDialog: false,
-      showPreviewDialog: false,
-      form: {
-        videoId: null,
-        scope: 1
-      },
-      videoResources: [],
-      publishVideoDiaglog: false
-    }
-  },
-  created() {
-    document.title = 'AdminVideoList'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getVideoList(0).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    handleScope(index, row) {
-      this.form.videoId = row.videoId
-      this.form.scope = '' + row.scope
-      this.showEditScopeDialog = true
-    },
-    handleDialogClose(done) {
-      this.showPreviewDialog = false
-      this.videoProp = {
-        videoId: null,
-        play: false
-      }
-      done()
-    },
-    handlePreview(index, row) {
-      videoInfo(row.videoId).then(res => {
-        if (res.code === 0) {
-          this.showPreviewDialog = true
-          this.videoProp = {
-            videoId: res.data.videoId,
-            play: true
-          }
-        }
-      })
-    },
-    handleEdit(index, row) {
-      const path = '/post/video/edit/' + row.videoId
-      this.$router.push(path)
-    },
-    onUpdateScope() {
-      this.showEditScopeDialog = false
-      updateVideoScope(this.form).then(res => {
-        if (res.code === 0) {
-          this.$notify({
-            title: '提示',
-            message: '视频可见范围已更新',
-            type: 'warning',
-            duration: 3000
-          })
-        }
-      }).catch(error => {
-        this.$notify({
-          title: '提示',
-          message: error.message,
-          type: 'warning',
-          duration: 3000
-        })
-      })
-    },
-    onSelectChange() {
-      this.$message.info(this.queryInfo)
-    },
-    handleClose() {
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/RealtimeLog.vue

@@ -1,164 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>实时日志</h3>
-    </el-header>
-    <el-main>
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改视频可见范围</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateScope">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.scope" placeholder="选择可见范围">
-            <el-option label="本人可见" value="1" />
-            <el-option label="所有人可见" value="2" />
-            <el-option label="VIP 可见" value="3" />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <!-- 视频预览对话框 -->
-    <el-dialog
-      title="预览视频"
-      append-to-body
-      :visible.sync="showPreviewDialog"
-      :before-close="handleDialogClose"
-      width="70%"
-      center
-    >
-      <template>
-        <video-preview-player :video-prop.sync="videoProp" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo } from '@/api/vod'
-import { getVideoList } from '@/api/admin'
-
-export default {
-  name: 'VideoPost',
-  components: { VideoPreviewPlayer },
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      videoProp: null,
-      showVideoResourceDialog: false,
-      showEditScopeDialog: false,
-      showPreviewDialog: false,
-      form: {
-        videoId: null,
-        scope: 1
-      },
-      videoResources: [],
-      publishVideoDiaglog: false
-    }
-  },
-  created() {
-    document.title = 'AdminVideoList'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getVideoList(0).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    handleScope(index, row) {
-      this.form.videoId = row.videoId
-      this.form.scope = '' + row.scope
-      this.showEditScopeDialog = true
-    },
-    handleDialogClose(done) {
-      this.showPreviewDialog = false
-      this.videoProp = {
-        videoId: null,
-        play: false
-      }
-      done()
-    },
-    handlePreview(index, row) {
-      videoInfo(row.videoId).then(res => {
-        if (res.code === 0) {
-          this.showPreviewDialog = true
-          this.videoProp = {
-            videoId: res.data.videoId,
-            play: true
-          }
-        }
-      })
-    },
-    handleEdit(index, row) {
-      const path = '/post/video/edit/' + row.videoId
-      this.$router.push(path)
-    },
-    onUpdateScope() {
-      this.showEditScopeDialog = false
-      updateVideoScope(this.form).then(res => {
-        if (res.code === 0) {
-          this.$notify({
-            title: '提示',
-            message: '视频可见范围已更新',
-            type: 'warning',
-            duration: 3000
-          })
-        }
-      }).catch(error => {
-        this.$notify({
-          title: '提示',
-          message: error.message,
-          type: 'warning',
-          duration: 3000
-        })
-      })
-    },
-    onSelectChange() {
-      this.$message.info(this.queryInfo)
-    },
-    handleClose() {
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/RuntimeLog.vue

@@ -1,164 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>运行访问日志</h3>
-    </el-header>
-    <el-main>
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      append-to-body
-      :visible.sync="showEditScopeDialog"
-      width="30%"
-      center
-    >
-      <el-card class="box-card">
-        <div slot="header" class="clearfix">
-          <span>修改视频可见范围</span>
-          <el-button style="float: right; padding: 3px 0" type="text" @click="onUpdateScope">更新</el-button>
-        </div>
-        <div class="text item">
-          <el-select v-model="form.scope" placeholder="选择可见范围">
-            <el-option label="本人可见" value="1" />
-            <el-option label="所有人可见" value="2" />
-            <el-option label="VIP 可见" value="3" />
-          </el-select>
-        </div>
-      </el-card>
-    </el-dialog>
-    <!-- 视频预览对话框 -->
-    <el-dialog
-      title="预览视频"
-      append-to-body
-      :visible.sync="showPreviewDialog"
-      :before-close="handleDialogClose"
-      width="70%"
-      center
-    >
-      <template>
-        <video-preview-player :video-prop.sync="videoProp" />
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import VideoPreviewPlayer from 'components/VideoPreviewPlayer'
-import { updateVideoScope, videoInfo } from '@/api/vod'
-import { getVideoList } from '@/api/admin'
-
-export default {
-  name: 'VideoPost',
-  components: { VideoPreviewPlayer },
-  data() {
-    return {
-      queryInfo: {
-        scope: null,
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      nextId: 0,
-      // **********************************************************************
-      videoProp: null,
-      showVideoResourceDialog: false,
-      showEditScopeDialog: false,
-      showPreviewDialog: false,
-      form: {
-        videoId: null,
-        scope: 1
-      },
-      videoResources: [],
-      publishVideoDiaglog: false
-    }
-  },
-  created() {
-    document.title = 'AdminVideoList'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getVideoList(0).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      })
-    },
-    onRefresh() {
-      this.getData()
-    },
-    handleScope(index, row) {
-      this.form.videoId = row.videoId
-      this.form.scope = '' + row.scope
-      this.showEditScopeDialog = true
-    },
-    handleDialogClose(done) {
-      this.showPreviewDialog = false
-      this.videoProp = {
-        videoId: null,
-        play: false
-      }
-      done()
-    },
-    handlePreview(index, row) {
-      videoInfo(row.videoId).then(res => {
-        if (res.code === 0) {
-          this.showPreviewDialog = true
-          this.videoProp = {
-            videoId: res.data.videoId,
-            play: true
-          }
-        }
-      })
-    },
-    handleEdit(index, row) {
-      const path = '/post/video/edit/' + row.videoId
-      this.$router.push(path)
-    },
-    onUpdateScope() {
-      this.showEditScopeDialog = false
-      updateVideoScope(this.form).then(res => {
-        if (res.code === 0) {
-          this.$notify({
-            title: '提示',
-            message: '视频可见范围已更新',
-            type: 'warning',
-            duration: 3000
-          })
-        }
-      }).catch(error => {
-        this.$notify({
-          title: '提示',
-          message: error.message,
-          type: 'warning',
-          duration: 3000
-        })
-      })
-    },
-    onSelectChange() {
-      this.$message.info(this.queryInfo)
-    },
-    handleClose() {
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/SiteConfig.vue

@@ -1,133 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>站点配置</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="propKey"
-          label="属性名"
-        />
-        <el-table-column
-          prop="propDesc"
-          label="描述"
-          :show-overflow-tooltip="true"
-        />
-        <el-table-column
-          prop="propValue"
-          label="属性值"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
-            >编辑</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-
-    <el-dialog
-      title="修改站点配置"
-      append-to-body
-      :visible.sync="showEditDialog"
-      center
-    >
-      <template>
-        <el-form :model="form" label-width="80px">
-          <el-form-item label="属性名">
-            <el-input v-model="form.propKey" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="属性描述">
-            <el-input v-model="form.propDesc" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="属性值" style="width: 70%; padding-right: 2px">
-            <el-input v-model="form.propValue" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="onUpdate">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getSiteOptionList, updateSiteOption } from '@/api/devops'
-
-export default {
-  name: 'SiteConfig',
-  data() {
-    return {
-      dataList: [],
-      // **********************************************************************
-      showEditDialog: false,
-      form: {
-        propKey: null,
-        propDesc: null,
-        propValue: null
-      }
-    }
-  },
-  created() {
-    document.title = '站点配置'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.currentPage = pageNumber
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getSiteOptionList().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleEdit(index, row) {
-      this.form = row
-      this.showEditDialog = true
-    },
-    onUpdate() {
-      const formData = new FormData()
-      formData.append('propKey', this.form.propKey)
-      formData.append('propDesc', this.form.propDesc)
-      formData.append('propValue', this.form.propValue)
-      this.showEditDialog = false
-      updateSiteOption(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/SysUpdate.vue

@@ -1,487 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>系统更新</h3>
-      <el-row style="margin-top: 10px">
-        <span>节点类型</span>
-        <el-select
-          v-model="queryInfo.nodeType"
-          size="mini"
-          placeholder="节点类型"
-          style="margin-left: 5px"
-          @change="onSelectChange"
-        >
-          <el-option label="mgr" value="mgr" />
-          <el-option label="agent" value="agent" />
-        </el-select>
-        <el-button size="mini" type="warning" icon="el-icon-files" style="margin-left: 5px" @click="handleAgentConfig">节点配置列表</el-button>
-        <el-button size="mini" type="warning" icon="el-icon-refresh" style="margin-left: 5px" @click="getData">刷新</el-button>
-        <el-button size="mini" type="warning" icon="el-icon-plus" style="margin-left: 5px" @click="handleAdd">添加节点</el-button>
-        <el-button size="mini" type="warning" icon="el-icon-upload" style="margin-left: 5px" @click="handleUpdate">更新</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-row>
-        <el-col style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-          <el-table
-            :data="dataList"
-            border
-            height="480"
-            style="width: 100%"
-          >
-            <el-table-column
-              prop="nodeType"
-              label="节点类型"
-            />
-            <el-table-column
-              prop="host"
-              label="部署的机器地址"
-            />
-            <el-table-column
-              prop="appDir"
-              label="应用目录"
-            />
-            <el-table-column
-              prop="config"
-              label="配置"
-            >
-              <template slot-scope="scope">
-                <el-button
-                  style="margin-top: 5px; margin-left: 5px"
-                  size="mini"
-                  type="success"
-                  @click="handleShowConfig(scope.$index, scope.row)"
-                >查看</el-button>
-              </template>
-            </el-table-column>
-            <el-table-column
-              prop="appVersion"
-              label="应用版本"
-            />
-            <el-table-column
-              prop="updateTime"
-              label="更新时间"
-            />
-            <el-table-column
-              fixed="right"
-              label="操作"
-              width="120"
-            >
-              <template slot-scope="scope">
-                <el-button
-                  style="margin-top: 5px; margin-left: 5px"
-                  size="mini"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </el-col>
-      </el-row>
-    </el-main>
-
-    <el-dialog
-      title="添加节点"
-      append-to-body
-      :visible.sync="showAddDialog"
-      width="50%"
-      center
-    >
-      <div>
-        <el-form :model="addForm" label-width="80px">
-          <el-form-item label="节点类型" style="width: 70%; padding-right: 2px">
-            <el-input v-model="queryInfo.nodeType" style="width: 70%; padding-right: 2px" readonly />
-          </el-form-item>
-          <el-form-item label="部署的机器地址">
-            <el-input v-model="addForm.host" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="SSH 端口">
-            <el-input v-model="addForm.port" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item label="认证方式" style="width: 70%; padding-right: 2px">
-            <el-select v-model="addForm.authType" placeholder="选择认证方式">
-              <el-option label="密码认证" value="password" />
-              <el-option label="私钥认证" value="privateKey" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="用户名" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.username" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item v-if="addForm.authType === 'password'" label="密码" style="width: 70%; padding-right: 2px">
-            <el-input v-model="addForm.password" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <el-form-item v-else label="私钥" style="width: 70%; padding-right: 2px">
-            <el-input
-              v-model="addForm.privateKey"
-              type="textarea"
-              maxlength="10000"
-              :rows="10"
-              style="padding: 5px"
-            />
-          </el-form-item>
-          <el-form-item label="应用目录">
-            <el-input v-model="addForm.appDir" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <div v-if="queryInfo.nodeType === 'agent'">
-            <el-form-item label="连接的 mgr 地址" style="width: 70%; padding-right: 2px">
-              <el-select v-model="addForm.remoteAgentConfig" placeholder="选择 mgr 地址">
-                <el-option
-                  v-for="(item, index) in agentConfigList"
-                  :key="index"
-                  :label="item.mgrHost"
-                  :value="item.id"
-                />
-              </el-select>
-            </el-form-item>
-          </div>
-          <div v-else>
-            <el-form-item label="mgr 配置" style="width: 70%; padding-right: 2px">
-              <el-select v-model="addForm.remoteAgentConfig" placeholder="选择 mgr 配置">
-                <el-option
-                  v-for="(item, index) in agentConfigList"
-                  :key="index"
-                  :label="item.id"
-                  :value="item.id"
-                />
-              </el-select>
-            </el-form-item>
-          </div>
-          <el-form-item>
-            <el-button type="primary" @click="onAdd">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </div>
-    </el-dialog>
-    <el-dialog
-      title="节点配置列表"
-      append-to-body
-      :visible.sync="showAgentConfigDialog"
-      center
-    >
-      <template>
-        <el-button size="mini" type="warning" icon="el-icon-plus" style="margin: 5px" @click="handleAgentConfigAdd">添加</el-button>
-        <el-table
-          :data="agentConfigList"
-          border
-          height="480"
-          style="width: 100%"
-        >
-          <el-table-column
-            prop="id"
-            label="ID"
-          />
-          <el-table-column
-            prop="nodeType"
-            label="节点类型"
-          />
-          <el-table-column
-            prop="mgrProtocol"
-            label="协议"
-          />
-          <el-table-column
-            prop="mgrHost"
-            label="mgr 地址"
-          />
-          <el-table-column
-            prop="mgrPort"
-            label="mgr 端口"
-          />
-          <el-table-column
-            prop="mgrConfig"
-            label="mgr 配置"
-          />
-          <el-table-column
-            fixed="right"
-            label="操作"
-            width="120"
-          >
-            <template slot-scope="scope">
-              <el-button
-                style="margin-top: 5px; margin-left: 5px"
-                size="mini"
-                type="danger"
-                @click="handleAgentConfigDelete(scope.$index, scope.row)"
-              >删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-      </template>
-    </el-dialog>
-    <el-dialog
-      title="添加节点配置"
-      append-to-body
-      :visible.sync="addAgentConfigDialog"
-      center
-    >
-      <template>
-        <el-form :model="configForm" label-width="80px">
-          <el-form-item label="节点类型" style="width: 70%; padding-right: 2px">
-            <el-input v-model="queryInfo.nodeType" style="width: 70%; padding-right: 2px" />
-          </el-form-item>
-          <div v-if="queryInfo.nodeType === 'agent'">
-            <el-form-item label="mgr 协议" style="width: 70%; padding-right: 2px">
-              <el-select v-model="configForm.mgrProtocol" placeholder="选择 websocket 协议">
-                <el-option label="ws" value="ws" />
-                <el-option label="wss" value="wss" />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="mgr 地址" style="width: 70%; padding-right: 2px">
-              <el-input v-model="configForm.mgrHost" style="width: 70%; padding-right: 2px" />
-            </el-form-item>
-            <el-form-item label="mgr 端口" style="width: 70%; padding-right: 2px">
-              <el-input v-model="configForm.mgrPort" style="width: 70%; padding-right: 2px" />
-            </el-form-item>
-          </div>
-          <div v-else>
-            <el-form-item label="mgr 配置" style="width: 70%; padding-right: 2px">
-              <el-input
-                v-model="configForm.mgrConfig"
-                type="textarea"
-                maxlength="10000"
-                :rows="10"
-                style="padding: 5px"
-              />
-            </el-form-item>
-          </div>
-          <el-form-item>
-            <el-button type="primary" @click="onAgentConfigAdd">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-dialog>
-    <el-dialog
-      :title="title"
-      append-to-body
-      :visible.sync="showConfigDialog"
-      center
-    >
-      <template>
-        <span v-if="queryInfo.nodeType === 'agent'">
-          <el-form :model="configForm" label-width="80px">
-            <el-form-item label="mgr 协议" style="width: 70%; padding-right: 2px">
-              <el-input v-model="configForm.mgrProtocol" style="width: 70%; padding-right: 2px" readonly />
-            </el-form-item>
-            <el-form-item label="mgr 地址" style="width: 70%; padding-right: 2px">
-              <el-input v-model="configForm.mgrHost" style="width: 70%; padding-right: 2px" readonly />
-            </el-form-item>
-            <el-form-item label="mgr 端口" style="width: 70%; padding-right: 2px">
-              <el-input v-model="configForm.mgrPort" style="width: 70%; padding-right: 2px" readonly />
-            </el-form-item>
-          </el-form>
-        </span>
-        <span v-else>
-          <el-form>
-            <el-form-item style="width: 70%; padding-right: 2px">
-              <el-input
-                v-model="configForm.mgrConfig"
-                type="textarea"
-                maxlength="10000"
-                :rows="10"
-                style="padding: 5px"
-                readonly
-              />
-            </el-form-item>
-          </el-form>
-        </span>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import {
-  addAgentConfig,
-  addRemoteHost, deleteAgentConfig,
-  deleteRemoteHost,
-  getAgentConfigList,
-  getRemoteHostList,
-  updateRemoteApp
-} from '@/api/devops'
-
-export default {
-  name: 'SysUpdate',
-  data() {
-    return {
-      queryInfo: {
-        nodeType: 'agent'
-      },
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      addForm: {
-        nodeType: 'agent',
-        host: '',
-        port: 22,
-        authType: 'password',
-        username: 'root',
-        password: '',
-        privateKey: '',
-        appDir: '/opt/app/devops',
-        remoteAgentConfig: null
-      },
-      // **********************************************************************
-      showAgentConfigDialog: false,
-      agentConfigList: [],
-      addAgentConfigDialog: false,
-      configForm: {
-        nodeType: '',
-        mgrProtocol: 'ws',
-        mgrHost: '127.0.0.1',
-        mgrPort: 4030,
-        mgrConfig: ''
-      },
-      // **********************************************************************
-      showConfigDialog: false,
-      title: ' 节点配置',
-      mgrConfig: ''
-    }
-  },
-  created() {
-    document.title = '系统更新'
-    const nodeType = this.$route.query.nodeType
-    if (nodeType !== undefined && nodeType !== null) {
-      this.queryInfo.nodeType = nodeType
-    }
-
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getRemoteHostList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onSelectChange() {
-      this.$router.push({
-        path: '/bg/sys/update',
-        query: this.queryInfo
-      })
-
-      this.getData()
-    },
-    handleAdd() {
-      getAgentConfigList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.agentConfigList = resp.data
-          this.showAddDialog = true
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    onAdd() {
-      this.addForm.nodeType = this.queryInfo.nodeType
-      addRemoteHost(this.addForm).then(resp => {
-        if (resp.code === 0) {
-          this.getData()
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleDelete(index, row) {
-      const form = {}
-      form.id = row.id
-      deleteRemoteHost(form).then(resp => {
-        if (resp.code === 0) {
-          this.getData()
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleUpdate() {
-      const hostList = []
-      for (const item of this.dataList) {
-        hostList.push(item.host)
-      }
-      this.$confirm('确定要更新所有机器上的 ' + this.queryInfo.nodeType + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const form = {}
-        form.hostList = hostList
-        updateRemoteApp(form).then(resp => {
-          this.$message.warning(resp.msg)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      }).finally(() => {
-        this.loading = false
-      })
-    },
-    handleAgentConfig() {
-      getAgentConfigList(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          this.agentConfigList = resp.data
-          this.showAgentConfigDialog = true
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAgentConfigAdd() {
-      this.addAgentConfigDialog = true
-    },
-    onAgentConfigAdd() {
-      this.configForm.nodeType = this.queryInfo.nodeType
-      addAgentConfig(this.configForm).then(resp => {
-        if (resp.code === 0) {
-          this.handleAgentConfig()
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.addAgentConfigDialog = false
-      })
-    },
-    handleAgentConfigDelete(index, row) {
-      const form = {}
-      form.id = row.id
-      deleteAgentConfig(form).then(resp => {
-        if (resp.code === 0) {
-          this.handleAgentConfig()
-        } else {
-          this.$message.warning(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleShowConfig(index, row) {
-      this.configForm = row.remoteAgentConfig
-      this.title = this.queryInfo.nodeType + ' 节点配置'
-      this.showConfigDialog = true
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/sys/Webhook.vue

@@ -1,163 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>webhook 通知</h3>
-      <el-row style="margin-top: 10px">
-        <el-button type="success" icon="el-icon-plus" style="margin-left: 5px" @click="handleAdd">添加</el-button>
-      </el-row>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="name"
-          label="发送帐号"
-        />
-        <el-table-column
-          prop="url"
-          label="URL"
-        />
-        <el-table-column
-          prop="sign"
-          label="签名"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              @click="handleTest(scope.$index, scope.row)"
-            >测试</el-button>
-            <el-button
-              size="mini"
-              @click="handleDelete(scope.$index, scope.row)"
-            >删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-
-    <!-- 修改视频可见范围对话框 -->
-    <el-dialog
-      title="添加 webhook"
-      append-to-body
-      :visible.sync="showAddDialog"
-      center
-    >
-      <el-form :model="addForm" label-width="80px">
-        <el-form-item label="名字">
-          <el-input v-model="addForm.name" style="width: 70%; padding-right: 2px" />
-        </el-form-item>
-        <el-form-item label="URL">
-          <el-input v-model="addForm.url" style="width: 70%; padding-right: 2px" />
-        </el-form-item>
-        <el-form-item label="签名" style="width: 70%; padding-right: 2px">
-          <el-input v-model="addForm.sign" style="width: 70%; padding-right: 2px" />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="onAdd">确定</el-button>
-        </el-form-item>
-      </el-form>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { addWebhook, deleteUser, deleteWebhook, getWebhookList, testWebhook } from '@/api/devops'
-
-export default {
-  name: 'Webhook',
-  data() {
-    return {
-      dataList: [],
-      // **********************************************************************
-      showAddDialog: false,
-      addForm: {
-        name: null,
-        url: null,
-        sign: null
-      }
-    }
-  },
-  created() {
-    document.title = 'Webhook通知'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getWebhookList().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleAdd() {
-      this.showAddDialog = true
-    },
-    onAdd() {
-      const formData = new FormData()
-      formData.append('name', this.addForm.name)
-      formData.append('url', this.addForm.url)
-      formData.append('sign', this.addForm.sign)
-      addWebhook(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.showAddDialog = false
-      })
-    },
-    handleTest(index, row) {
-      const formData = new FormData()
-      formData.append('id', row.id)
-      testWebhook(formData).then(resp => {
-        this.showAddDialog = false
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleDelete(index, row) {
-      this.$confirm('确定要删除 ' + row.name + '?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('id', row.id)
-        deleteWebhook(formData).then(resp => {
-          this.getData()
-          this.$message.info(resp.msg)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/user/UserLogin.vue

@@ -1,108 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>登入记录</h3>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="loginAt"
-          label="登入时间"
-        />
-        <el-table-column
-          prop="loginIp"
-          label="登入 IP"
-        />
-        <el-table-column
-          prop="location"
-          label="登入位置"
-        />
-        <el-table-column
-          prop="userAgent"
-          label="登入设备"
-        />
-        <el-table-column
-          prop="status"
-          label="状态"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              type="danger"
-              size="mini"
-              @click="handleLogout(scope.$index, scope.row)"
-            >登出</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-main>
-  </el-container>
-</template>
-
-<script>
-import { getAccountLoginRecord, logoutAccountLogin } from '@/api/devops'
-
-export default {
-  name: 'UserLogin',
-  data() {
-    return {
-      dataList: []
-    }
-  },
-  created() {
-    document.title = '登入记录'
-    this.getData()
-  },
-  methods: {
-    getData() {
-      this.dataList = []
-      getAccountLoginRecord().then(resp => {
-        if (resp.code === 0) {
-          this.dataList = resp.data
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleLogout(index, row) {
-      this.$confirm('确定要登出该设备?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        const formData = new FormData()
-        formData.append('loginId', row.loginId)
-        logoutAccountLogin(formData).then(resp => {
-          this.$message.info(resp.msg)
-        }).catch(error => {
-          this.$message.error(error.message)
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消'
-        })
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/user/UserMessage.vue

@@ -1,143 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>我的消息</h3>
-      <el-button type="success" size="mini" icon="el-icon-delete" style="margin-left: 5px" @click="handleClear">清空消息</el-button>
-    </el-header>
-    <el-main>
-      <el-table
-        :data="dataList"
-        border
-        height="480"
-        style="width: 100%"
-      >
-        <el-table-column
-          fixed="left"
-          label="No"
-          type="index"
-        />
-        <el-table-column
-          prop="createTime"
-          label="时间"
-        />
-        <el-table-column
-          prop="title"
-          label="标题"
-        />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          width="280"
-        >
-          <template slot-scope="scope">
-            <el-button
-              style="margin-top: 5px; margin-left: 5px"
-              size="mini"
-              @click="handleEdit(scope.$index, scope.row)"
-            >查看</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        background
-        :small="screenWidth <= 768"
-        layout="prev, pager, next"
-        :page-size="pageSize"
-        :current-page="currentPage"
-        :total="totalSize"
-        @current-change="handleCurrentChange"
-        @prev-click="handleCurrentChange"
-        @next-click="handleCurrentChange"
-      />
-    </el-main>
-
-    <el-dialog
-      title="消息内容"
-      append-to-body
-      :visible.sync="showContentDialog"
-      center
-    >
-      <template>
-        <span v-if="message !== null">{{ message.content }}</span>
-      </template>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { clearAccountMessage, getAccountMessage } from '@/api/devops'
-
-export default {
-  name: 'UserMessage',
-  data() {
-    return {
-      queryInfo: {
-        pn: 1
-      },
-      // 屏幕宽度, 为了控制分页条的大小
-      screenWidth: document.body.clientWidth,
-      currentPage: 1,
-      pageSize: 10,
-      totalSize: 0,
-      dataList: [],
-      // **********************************************************************
-      showContentDialog: false,
-      message: null
-    }
-  },
-  created() {
-    const pageNumber = this.$route.query.pn
-    if (pageNumber !== undefined && pageNumber !== null) {
-      this.currentPage = parseInt(pageNumber)
-      this.queryInfo.pn = parseInt(pageNumber)
-    }
-
-    document.title = '我的消息'
-    this.getData()
-  },
-  methods: {
-    handleCurrentChange(pageNumber) {
-      this.queryInfo.pn = pageNumber
-      this.$router.push({
-        path: '/bg/user/message',
-        query: this.queryInfo
-      })
-      this.getData()
-      // 回到顶部
-      scrollTo(0, 0)
-    },
-    getData() {
-      this.dataList = []
-      getAccountMessage(this.queryInfo).then(resp => {
-        if (resp.code === 0) {
-          const respData = resp.data
-          this.dataList = respData.list
-          this.totalSize = respData.totalSize
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    },
-    handleEdit(index, row) {
-      this.message = row
-      this.showContentDialog = true
-    },
-    handleClear(index, row) {
-      clearAccountMessage().then(resp => {
-        if (resp.code === 0) {
-          this.getData()
-        } else {
-          this.$message.error(resp.msg)
-        }
-      }).catch(error => {
-        this.$message.error(error.message)
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/views/devops/user/UserProfile.vue

@@ -1,141 +0,0 @@
-<template>
-  <el-container>
-    <el-header height="220">
-      <h3>个人资料</h3>
-    </el-header>
-    <el-main>
-      <el-row>
-        <el-col :md="8" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-          <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-            <el-card class="box-card">
-              <div slot="header" class="clearfix">
-                <span>我的帐号</span>
-              </div>
-              <div class="text item">
-                <el-form v-if="loginUser !== null" ref="form" :model="loginUser" label-width="80px">
-                  <el-form-item label="用户名">
-                    <el-input v-model="loginUser.username" style="width: 70%; padding-right: 10px" readonly />
-                    <el-button size="mini" type="info" @click="showUpdateDialog(1)">修改</el-button>
-                  </el-form-item>
-                  <el-form-item label="用户密码">
-                    <el-input value="**********" style="width: 70%; padding-right: 10px" readonly />
-                    <el-button size="mini" type="info" @click="showUpdateDialog(2)">修改</el-button>
-                  </el-form-item>
-                </el-form>
-              </div>
-            </el-card>
-          </el-row>
-        </el-col>
-      </el-row>
-    </el-main>
-
-    <el-dialog
-      :title="updateTitle"
-      append-to-body
-      :visible.sync="updateUsernameDialog"
-      width="30%"
-      center
-    >
-      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px;">
-        <el-form ref="form" :model="updateUsernameForm" label-width="100px">
-          <el-form-item label="新用户名" label-width="100px">
-            <el-input v-model="updateUsernameForm.newUsername" style="width: 45%; padding-right: 10px" />
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click.native="onUpdateUsername">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </el-row>
-    </el-dialog>
-    <el-dialog
-      :title="updateTitle"
-      append-to-body
-      :visible.sync="updatePasswordDialog"
-      width="30%"
-      center
-    >
-      <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px; text-align: center">
-        <el-form ref="form" :model="updatePasswordForm" label-width="100px">
-          <el-form-item label="当前密码">
-            <el-input v-model="updatePasswordForm.currentPasswd" style="padding-right: 1px"/>
-          </el-form-item>
-          <el-form-item label="新密码">
-            <el-input v-model="updatePasswordForm.newPasswd" style="padding-right: 1px"/>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click.native="onUpdatePassword">确定</el-button>
-          </el-form-item>
-        </el-form>
-      </el-row>
-    </el-dialog>
-  </el-container>
-</template>
-
-<script>
-import { getAuthedUser } from '@/utils/auth'
-import { updateAccountName, updateAccountPasswd } from '@/api/devops'
-
-export default {
-  name: 'UserProfile',
-  data() {
-    return {
-      updateTitle: null,
-      updateUsernameDialog: false,
-      updateUsernameForm: {
-        newUsername: null
-      },
-      updatePasswordDialog: false,
-      updatePasswordForm: {
-        currentPasswd: null,
-        newPasswd: null
-      },
-      loginUser: null
-    }
-  },
-  mounted() {
-    this.loginUser = getAuthedUser()
-  },
-  created() {
-    document.title = '我的'
-  },
-  methods: {
-    showUpdateDialog(type) {
-      if (type === 1) {
-        this.updateType = 1
-        this.updateTitle = '修改用户名'
-        this.updateUsernameDialog = true
-      } else if (type === 2) {
-        this.updateType = 2
-        this.updateTitle = '修改用户密码'
-        this.updatePasswordDialog = true
-      }
-    },
-    onUpdateUsername() {
-      const formData = new FormData()
-      formData.append('newUsername', this.updateUsernameForm.newUsername)
-      updateAccountName(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.updateUsernameDialog = false
-      })
-    },
-    onUpdatePassword() {
-      const formData = new FormData()
-      formData.append('currentPasswd', this.updatePasswordForm.currentPasswd)
-      formData.append('newPasswd', this.updatePasswordForm.newPasswd)
-      updateAccountPasswd(formData).then(resp => {
-        this.$message.info(resp.msg)
-      }).catch(error => {
-        this.$message.error(error.message)
-      }).finally(() => {
-        this.updatePasswordDialog = false
-      })
-    }
-  }
-}
-</script>
-
-<style>
-</style>