Tuberrr
/
JCC-RIP
forked from JointCloud/JCC-RIP
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

接口修改

This commit is contained in:
jhnine 2022-11-16 10:47:55 +08:00
parent cdab3398c4
commit cf163bda23
14 changed files with 268 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/api/common/actions.js
View File

@ -2,31 +2,31 @@ import request from '@/utils/request'
export default {
// pod删除 工作负载删除
deleteCurrent(clusterName, namespace, name, classification, label) {
deleteCurrent(clusterName, namespace, name, classification) {
if (classification === 'userProject') { // 用户项目
return request({
url: `/jcc-schedule/api/v1/namespace/delete/${clusterName}/${namespace}${label ? '/jcce' : '/false'}`,
url: `/jcc-schedule/api/v1/namespace/delete/${clusterName}/${namespace}/false`,
method: 'delete'
})
} else if (classification === 'storage') { // 存储卷
return request({
url: `/jcc-schedule/api/v1/storage/pvc/${clusterName}/${namespace}/${name}${label ? '/jcce' : '/false'}`,
url: `/jcc-schedule/api/v1/storage/pvc/${clusterName}/${namespace}/${name}/false`,
method: 'delete'
})
} else if (classification === 'pods') { // 容器节点
return request({
url: `/jcc-schedule/api/v1/pod/delete/${clusterName}/${namespace}/${name}${label ? '/jcce' : '/false'}`,
url: `/jcc-schedule/api/v1/pod/delete/${clusterName}/${namespace}/${name}/false`,
method: 'delete'
})
} else if (classification === 'services') { // 服务
return request({
url: `/jcc-schedule/api/v1/service/delete/${clusterName}/${namespace}/${name}${label ? '/jcce' : '/false'}`,
url: `/jcc-schedule/api/v1/service/delete/${clusterName}/${namespace}/${name}/false`,
method: 'delete'
})
} else {
// 工作负载 部署 有状态副本集 守护进程集
return request({
url: `/jcc-schedule/api/v1/${classification}/delete/${clusterName}/${namespace}/${name}${label ? '/jcce' : '/false'}`,
url: `/jcc-schedule/api/v1/${classification}/delete/${clusterName}/${namespace}/${name}/false`,
method: 'delete'
})
}

BIN
src/assets/images/exhibition/hpc-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

4
src/mixin/deleteCurrent.js
View File

@ -7,7 +7,7 @@ export default {
}
},
methods: {
deleteCurrent(text, name, namespace, classification, from, jcce) {
deleteCurrent(text, name, namespace, classification, from) {
const pattern = newEval('/' + name + '/')
this.$prompt(`请输入${text}名称${name}确保您已了解操作所带来的风险。`, `${text}删除确认?`, {
confirmButtonText: '确定',
@ -16,7 +16,7 @@ export default {
inputErrorMessage: '不匹配'
}).then(({ value }) => {
// 删除接口 成功后
this.$Api.deleteCurrent(this.clusterName, namespace, name, classification, jcce).then(res => {
this.$Api.deleteCurrent(this.clusterName, namespace, name, classification).then(res => {
this.$message.success('删除成功')
if (from === 'list') {
if (text === '项目' || text === '容器节点') {

115
src/views/hpcOverview/index.vue
View File

@ -13,9 +13,17 @@
<div slot="header" class="clearfix">
<span>超算域</span>
</div>
<el-row>
<el-row gutter="24">
<el-col :span="12">
<ComponentStatus />
<List
ref="multipleTable"
class="multipleTable"
:columns="columns1"
:query="{'clusterName': clusterName, 'pageNum':1, 'pageSize':999 }"
height="200"
:get-list-action="getServiceList"
:pagination="false"
/>
</el-col>
<el-col :span="12">
<NodeMessageBar />
@ -30,7 +38,15 @@
<div slot="header" class="clearfix">
<span>作业</span>
</div>
<ComponentStatus />
<List
ref="multipleTable"
class="multipleTable"
:columns="columns2"
:query="{'clusterName': clusterName, 'pageNum':1, 'pageSize':999 }"
height="315"
:get-list-action="getServiceList"
:pagination="false"
/>
</el-card>
</el-col>
<el-col :span="12">
@ -39,6 +55,39 @@
<div slot="header" class="clearfix">
<span>资源</span>
</div>
<el-row class="resource">
<el-col :span="12">
<div>CPU <span>0</span> 核</div>
<div class="money">
<el-row>
<el-col :span="12">0%</el-col>
<el-col :span="12">0%</el-col>
</el-row>
<el-row>
<el-col :span="12">CPU</el-col>
<el-col :span="12">RAM</el-col>
</el-row>
</div>
<p>100%</p>
<span class="tips">过去24小时利用率</span>
</el-col>
<el-col :span="12">
<div>GPU <span>0</span> 卡</div>
<div class="money money1">
<el-row>
<el-col :span="12">0%</el-col>
<el-col :span="12">0%</el-col>
</el-row>
<el-row>
<el-col :span="12">CPU</el-col>
<el-col :span="12">RAM</el-col>
</el-row>
</div>
<p>100%</p>
<span class="tips">过去24小时利用率</span>
</el-col>
</el-row>
</el-card>
</el-col>
</el-col>
@ -47,34 +96,78 @@
</template>
<script>
import ComponentStatus from '@/components/ClusterManagement/componentStatus'
import List from '@/components/list'
import NodeMessageBar from '@/components/ClusterManagement/nodeMessageBar'
import Exhibition from '@/components/Exhibition'
import { getServiceList } from '@/api/container/serviceManagement'
export default {
components: {
ComponentStatus,
Exhibition,
List,
NodeMessageBar
},
data() {
return {
getServiceList,
exhibitionArray: [
{ name: '高性能计算域合计', src: 'blockChainBrowser-1', value: '0' },
{ name: '高性能计算域合计', src: 'hpc-1', value: '0' },
{ name: '运行作业数量', src: 'blockChainBrowser-1', value: '0' },
{ name: '已适配异构软件栈', src: 'blockChainBrowser-1', value: '0' },
{ name: '连接调用接口数量', src: 'blockChainBrowser-1', value: '0' }
{ name: '已适配异构软件栈', src: 'blockChainBrowser-4', value: '0' },
{ name: '连接调用接口数量', src: 'blockChainBrowser-5', value: '0' }
],
activeName: 'first'
columns1: [
{ prop: 'name', label: '名称', formatter: (row) => { return <a onClick={() => this.viewDetail(row)}>{row.metadata.name}</a> } },
{ prop: 'project', label: '项目', formatter: (row) => row.metadata.namespace },
{ prop: 'type', label: '服务类型', formatter: (row) => '自定义创建' },
{ prop: 'internetAccess', label: '外网访问', formatter: (row) => '-' }
],
columns2: [
{ prop: 'name', label: '名称', formatter: (row) => { return <a onClick={() => this.viewDetail(row)}>{row.metadata.name}</a> } },
{ prop: 'project', label: '项目', formatter: (row) => row.metadata.namespace },
{ prop: 'type', label: '服务类型', formatter: (row) => '自定义创建' },
{ prop: 'internetAccess', label: '外网访问', formatter: (row) => '-' }
]
}
},
computed: {
cluster() {
return this.$store.getters.clusterName
clusterName() {
return localStorage.getItem('clusterName')
}
}
}
</script>
<style lang="scss">
.resource{
text-align: center;
.money{
display: inline-block;
width: 220px;
height: 220px;
border: 30px solid #dfebf7;
background: linear-gradient(135deg, #41A0F8 0%, #3182CE 100%);
// box-shadow: 0px 10px 26px 5px rgb(52 72 90 / 20%);
border-radius: 50%;
text-align: center;
font-size: 16px;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
padding-top: 70px;
margin: 0 auto;
margin-top: 14px;
p{
font-family: Impact;
font-size: 36px;
}
}
.money1{
background: linear-gradient(90deg, #21B8AF 0%, #3182CE 100%);
}
}
// .list-btns {
// display: none;
// }
</style>

194
src/views/monitorSelect/index.vue
View File

@ -51,7 +51,20 @@
<div v-else class="monitor-select">
<Navbar />
<el-row>
<template v-for="item in filteredTab">
<div class="div-block">
<div v-for="item in filteredTab" :key="item.id">
<a class="monitorSelectDiv" @click.prevent="selectMonitor(item.path)">
<div class="monitorSelectBtn">
<svg-icon style="margin-top: 40vh;" :icon-class="item.icon" />
<div>
<div class="selectTitle">{{ item.title }}</div>
<span v-if="filteredTab.length <5">{{ item.description }}</span>
</div>
</div>
</a>
</div>
</div>
<!-- <template v-for="item in filteredTab">
<el-col :key="item.id" :span="24/filteredTab.length === 4.8 ? '4-8' : 24/filteredTab.length">
<a class="monitorSelectDiv" @click.prevent="selectMonitor(item.path)">
<div class="monitorSelectBtn">
@ -63,7 +76,7 @@
</div>
</a>
</el-col>
</template>
</template> -->
</el-row>
</div>
</template>
@ -112,13 +125,6 @@ export default {
description: '支持一个服务下对多个函数进行创建、编辑、运行，对函数运行全生命周期进行监控调度。',
path: '/functions/overview'
},
// {
// id: 'hpc',
// title: '超算管理',
// icon: 'fuwu',
// description: '1111111111111',
// path: '/hpc/hpcOverview'
// },
{
id: 'blockChain',
title: '云际记账',
@ -126,6 +132,13 @@ export default {
description: '基于区块链分布记账机制，以去中心化的方式对云际交易数据进行留痕存证。',
path: '/blockChain/blockChainBrowser'
}
// {
// id: 'hpc',
// title: '超算管理',
// icon: 'fuwu',
// description: '1111111111111',
// path: '/hpc/hpcOverview'
// }
]
}
},
@ -180,68 +193,117 @@ export default {
color: #454B53;
}
}
.el-col a{
display: block;
width: 100%;
font-size: 24px;
color: #333333;
height: 100vh;
position: relative;
text-align: center;
.svg-icon {
font-size: 100px;
margin: 30vh auto;
margin-bottom: 51px;
}
.selectTitle {
margin-bottom: 35px;
font-size: 30px;
}
span{
// display：flex 样式
.div-block{
display: flex;
> div{
display: block;
padding: 0 100px;
font-size: 14px;
line-height: 24px;
width: 100%;
font-size: 24px;
color: #333333;
height: 100vh;
position: relative;
text-align: center;
&:hover{
color: #ffffff;
background: #3182CE;
}
&::after{
content: '';
position: absolute;
width: 1px;
height: 100vh;
background: #CCD9E0;
top: 0;
right: 0;
}
&:last-of-type a::after{
width: 0;
}
.svg-icon {
font-size: 100px;
margin: 36vh auto;
margin-bottom: 51px;
}
.selectTitle {
margin-bottom: 35px;
font-size: 30px;
}
span{
display: block;
padding: 0 100px;
font-size: 14px;
line-height: 24px;
}
}
}
.el-col :hover{
color: #ffffff;
background: #3182CE;
}
.el-col a::after{
content: '';
position: absolute;
width: 1px;
height: 100vh;
background: #CCD9E0;
top: 0;
right: 0;
}
.el-col:last-of-type a::after{
width: 0;
}
.el-col-4 a{
.svg-icon{font-size: 120px; margin-top: 40vh;}
// .selectTitle{margin-top: 40px;}
span{display: none;}
}
// // el-col 样式
// .el-col a{
// display: block;
// width: 100%;
// font-size: 24px;
// color: #333333;
// height: 100vh;
// position: relative;
// text-align: center;
// .svg-icon {
// font-size: 100px;
// margin: 30vh auto;
// margin-bottom: 51px;
// }
// .selectTitle {
// margin-bottom: 35px;
// font-size: 30px;
// }
// span{
// display: block;
// padding: 0 100px;
// font-size: 14px;
// line-height: 24px;
// }
// }
// .el-col :hover{
// color: #ffffff;
// background: #3182CE;
// }
// .el-col a::after{
// content: '';
// position: absolute;
// width: 1px;
// height: 100vh;
// background: #CCD9E0;
// top: 0;
// right: 0;
// }
// .el-col:last-of-type a::after{
// width: 0;
// }
.el-col-24{
width: 30vw;
display: block;
margin: 0 auto;
float: none;
}
.el-col-12{
padding: 0 10vw;
}
.el-col-12 a::after{
right: -10vw;
}
.el-col-4-8 {
width: 20%;
}
// .el-col-4 a{
// .svg-icon{font-size: 120px; margin-top: 40vh;}
// // .selectTitle{margin-top: 40px;}
// span{display: none;}
// }
// .el-col-24{
// width: 30vw;
// display: block;
// margin: 0 auto;
// float: none;
// }
// .el-col-12{
// padding: 0 10vw;
// }
// .el-col-12 a::after{
// right: -10vw;
// }
// .el-col-4-8 {
// width: 20%;
// }
//// 旧样式
// .selectDiv{
// width: 100%;
// padding: 0 8% 0 15%;

3
src/views/podManagement/detail.vue
View File

@ -6,7 +6,7 @@
<h2>{{ $route.params.name }} </h2>
<div class="button-group">
<el-button plain round @click="viewSetting">查看配置文件</el-button>
<el-button v-if="formData.namespace !== '-'" type="danger" round @click="deleteCurrent('容器节点',$route.params.name, formData.namespace, 'pods','', formData.jcce )">删除</el-button>
<el-button v-if="formData.namespace !== '-'" type="danger" round @click="deleteCurrent('容器节点',$route.params.name, formData.namespace, 'pods','')">删除</el-button>
</div>
<el-dialog :close-on-click-modal="false" title="查看配置文件" :visible.sync="dialogSettingVisible">
<codemirror v-model="code" class="code-mirror" :options="cmOption" />
@ -122,7 +122,6 @@ export default {
this.formData.restart = res.status.containerStatuses[0].restartCount
this.formData.qos = res.status.qosClass
this.formData.createTime = res.metadata.creationTimestamp
this.formData.jcce = res.metadata.labels['jcce']
})
},
viewSetting() {

2
src/views/podManagement/index.vue
View File

@ -58,7 +58,7 @@ export default {
<el-button size='mini' className='el-dropdown-link' icon='el-icon-more' circle>
</el-button>
<el-dropdown-menu slot='dropdown'>
<span onClick={() => this.deleteCurrent('容器节点', row.metadata.name, row.metadata.namespace, 'pods', 'list', row.metadata.labels['jcce'])}> <el-dropdown-item> 删除</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('容器节点', row.metadata.name, row.metadata.namespace, 'pods', 'list')}> <el-dropdown-item> 删除</el-dropdown-item> </span>
</el-dropdown-menu>
</el-dropdown>
</div>

3
src/views/projectManagement/components/CreateProject.vue
View File

@ -93,9 +93,6 @@ export default {
'kubesphere.io/creator': 'admin',
'kubesphere.io/description': this.editInfoForm.description,
'kubesphere.io/alias-name': this.editInfoForm.aliasName
},
'labels': {
'jcce': 'true'
}
}
}

2
src/views/projectManagement/detail.vue
View File

@ -108,7 +108,7 @@ export default {
break
case 'delete' :
this.deleteCurrent('项目', this.baseInfo.metadata.name, this.baseInfo.metadata.name, 'userProject', '', this.baseInfo.metadata.labels['jcce'])
this.deleteCurrent('项目', this.baseInfo.metadata.name, this.baseInfo.metadata.name, 'userProject', '')
break
}
},

42
src/views/projectManagement/index.vue
View File

@ -11,24 +11,24 @@
<BaseInfoForm v-model="dialogFormVisible" type="project" :data="editInfoForm" @getList="getList" />
<el-row>
<el-card>
<el-tabs v-model="activeName" type="card" @tab-click="switchTab">
<el-tab-pane key="userProject" label="用户项目">
<List
ref="multipleTable1"
class="multipleTable"
:columns="columns[0]"
:filter-map="filterMap"
:query="{'clusterName': clusterName, 'queryType': 'user'}"
func-name="getProjectListFun"
:pagination="true"
page-key="pageNum"
limit-key="pageSize"
>
<template v-slot:filterBtns>
<el-button v-if="activeName ==='0'" size="medium" type="primary" @click="createFormVisible = true">创建</el-button>
</template>
</List>
</el-tab-pane>
<!-- <el-tabs v-model="activeName" type="card" @tab-click="switchTab">
<el-tab-pane key="userProject" label="用户项目"> -->
<List
ref="multipleTable1"
class="multipleTable"
:columns="columns[0]"
:filter-map="filterMap"
:query="{'clusterName': clusterName }"
func-name="getProjectListFun"
:pagination="true"
page-key="pageNum"
limit-key="pageSize"
>
<template v-slot:filterBtns>
<el-button v-if="activeName ==='0'" size="medium" type="primary" @click="createFormVisible = true">创建</el-button>
</template>
</List>
<!-- </el-tab-pane>
<el-tab-pane key="systemProject" label="系统项目">
<List
ref="multipleTable2"
@ -42,7 +42,7 @@
limit-key="pageSize"
/>
</el-tab-pane>
</el-tabs>
</el-tabs> -->
</el-card>
</el-row>
<CreateProject v-model="createFormVisible" @getList="getList" />
@ -94,7 +94,7 @@ export default {
</el-button>
<el-dropdown-menu slot='dropdown'>
<span onClick={() => this.editBaseInfo(row)}> <el-dropdown-item> 编辑</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('项目', row.metadata.name, row.metadata.name, 'userProject', 'list', row.metadata.labels['jcce'])}> <el-dropdown-item> 删除</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('项目', row.metadata.name, row.metadata.name, 'userProject', 'list')}> <el-dropdown-item> 删除</el-dropdown-item> </span>
</el-dropdown-menu>
</el-dropdown>
</div>
@ -146,7 +146,7 @@ export default {
methods: {
getList() {
this.$refs.multipleTable1.getList()
this.$refs.multipleTable2.getList()
// this.$refs.multipleTable2.getList()
},
switchTab(e) {
const tab = this.tabList[e.index]

2
src/views/serviceManagement/index.vue
View File

@ -84,7 +84,7 @@ export default {
<el-button size='mini' className='el-dropdown-link' icon='el-icon-more' circle>
</el-button>
<el-dropdown-menu slot='dropdown'>
<span onClick={() => this.deleteCurrent('服务', row.metadata.name, row.metadata.namespace, 'services', 'list', row.metadata.labels['jcce'])}> <el-dropdown-item> 删除</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('服务', row.metadata.name, row.metadata.namespace, 'services', 'list')}> <el-dropdown-item> 删除</el-dropdown-item> </span>
</el-dropdown-menu>
</el-dropdown>
</div>

2
src/views/storageManagement/index.vue
View File

@ -98,7 +98,7 @@ export default {
<el-dropdown-menu slot='dropdown'>
<span onClick={() => this.editBaseInfo(row)}> <el-dropdown-item> 编辑</el-dropdown-item> </span>
<span onClick={() => this.editStorageSetting(row)}> <el-dropdown-item> 编辑配置文件</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('存储卷', row.metadata.name, row.metadata.namespace, 'storage', 'list', row.metadata.labels?.['jcce'])}> <el-dropdown-item> 删除</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('存储卷', row.metadata.name, row.metadata.namespace, 'storage', 'list')}> <el-dropdown-item> 删除</el-dropdown-item> </span>
</el-dropdown-menu>
</el-dropdown>
</div>

2
src/views/workloadsManagement/detail.vue
View File

@ -354,7 +354,7 @@ export default {
break
case 'deleteDeployment':
this.deleteCurrent('工作负载', this.$route.params.name, this.baseInfo.metadata.namespace, this.activeTab, 'workloads', this.baseInfo.metadata.labels['jcce'])
this.deleteCurrent('工作负载', this.$route.params.name, this.baseInfo.metadata.namespace, this.activeTab, 'workloads')
break
}
}

2
src/views/workloadsManagement/index.vue
View File

@ -144,7 +144,7 @@ export default {
<span onClick={() => this.editBaseInfo(row)}> <el-dropdown-item> 编辑</el-dropdown-item> </span>
<span onClick={() => this.editSetting(row)}> <el-dropdown-item> 编辑配置文件</el-dropdown-item> </span>
<span onClick={() => this.reDeploy(row)}> <el-dropdown-item> 重新创建 </el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('工作负载', row.metadata.name, row.metadata.namespace, this.tabList[this.activeName], 'list', row.metadata.labels['jcce'])}> <el-dropdown-item> 删除</el-dropdown-item> </span>
<span onClick={() => this.deleteCurrent('工作负载', row.metadata.name, row.metadata.namespace, this.tabList[this.activeName], 'list')}> <el-dropdown-item> 删除</el-dropdown-item> </span>
</el-dropdown-menu>
</el-dropdown>
</div>