add instance center
This commit is contained in:
parent
71bde012cf
commit
fb1a74c8bb
|
@ -566,6 +566,8 @@
|
|||
"selectSubInstance": "Select SubInstance",
|
||||
"instanceDes": "Instance Description",
|
||||
"application": "Application",
|
||||
"deployment": "Deployment"
|
||||
"deployment": "Deployment",
|
||||
"instanceCenter": "Instance Center",
|
||||
"instanceType": "Instance Type"
|
||||
}
|
||||
}
|
|
@ -566,6 +566,8 @@
|
|||
"selectSubInstance": "选择子实例",
|
||||
"instanceDes": "实例描述",
|
||||
"application": "应用",
|
||||
"deployment": "部署"
|
||||
"deployment": "部署",
|
||||
"instanceCenter": "实例中心",
|
||||
"instanceType": "实例类型"
|
||||
}
|
||||
}
|
|
@ -34,6 +34,10 @@ export const getTrainingTaskStat = () => {
|
|||
return request({ url: '/pcm/v1/ai/trainingTaskStat', method: 'get' })
|
||||
}
|
||||
|
||||
export const getInstanceList = (params) => {
|
||||
return request({ url: '/pcm/v1/inference/instanceCenter', method: 'get', params })
|
||||
}
|
||||
|
||||
export const getAppPodsByAppName = (name, params) => {
|
||||
return request({ url: '/pcm/v1/apps/pods/' + name, method: 'get', params })
|
||||
}
|
||||
|
|
|
@ -1,12 +1,51 @@
|
|||
<template>
|
||||
<div class="instanceList">
|
||||
<el-card>
|
||||
<h2>{{ $t('page.instanceCenter') }}</h2>
|
||||
<div class="list-btns">
|
||||
<el-form :inline="true" class="demo-form-inline">
|
||||
<el-form-item :label="$t('page.instanceType')">
|
||||
<el-select
|
||||
v-model="filterData.instance_type"
|
||||
size="medium"
|
||||
>
|
||||
<el-option label="全部" :value="0" />
|
||||
<el-option label="应用实例" :value="1" />
|
||||
<el-option label="模型实例" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('page.instanceName')"
|
||||
>
|
||||
<el-input
|
||||
v-model="filterData.instance_name"
|
||||
size="medium"
|
||||
@enter="onSearchClick"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
size="medium"
|
||||
type="info"
|
||||
@click="onSearchClick"
|
||||
>
|
||||
{{ $t('message.search') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
size="medium"
|
||||
@click="resetSearch"
|
||||
>
|
||||
{{ $t('message.reset') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<el-col v-for="(item,index) in instanceList" :key="index" :span="6">
|
||||
<el-card class="instanceCard">
|
||||
<img src="#" alt="">
|
||||
<p class="title">{{ item.instanceName }}</p>
|
||||
<el-tag v-for="it in item.tags" :key="it">{{ it }}</el-tag>
|
||||
<img :src="item.logo_path" alt="">
|
||||
<p class="title">{{ item.instance_name }}</p>
|
||||
<el-tag>{{ item.instance_class_chinese }}</el-tag>
|
||||
<p>描述: </p>
|
||||
<div class="desc">{{ item.description }}</div>
|
||||
<p>版本: {{ item.version }}</p>
|
||||
|
@ -30,27 +69,15 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import { getInstanceList } from '@/api/task/task'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
active: 1,
|
||||
interval: '',
|
||||
jsonObject: '{}',
|
||||
result: '',
|
||||
filterData: {
|
||||
instance_type: 0,
|
||||
instance_name: ''
|
||||
},
|
||||
instanceList: [
|
||||
{
|
||||
instanceName: '流体仿真应用',
|
||||
description: '家辰通用流体仿真软件支持全速域全流域模拟,支持动态自适应加密的笛卡尔网格与非结构网格,以云服务方式提供仿真分析所需的CAE工具软件,通过在云端运行大量并行任务和分时使用,快速处理复杂模型的高级仿真',
|
||||
version: 'V20.12 V20.20 V21.33',
|
||||
tags: ['应用实例', '海洋气象']
|
||||
},
|
||||
{
|
||||
instanceName: 'Vasp-5.4.4(不含license)',
|
||||
description: 'VASP是,款由奥地利维也纳理工大学开发的先进量子力学计算软件,是一款强大、灵活且广泛应用于材料科学研究的量子力学计算软件,仅供学习参考和测试使用,',
|
||||
version: '5.4.4-intelmpi2017_optcell(学习版) 5.4.4-intelmpi2017_z',
|
||||
tags: ['应用实例', '材料计算']
|
||||
}
|
||||
],
|
||||
fileList: [],
|
||||
page: 1,
|
||||
|
@ -67,6 +94,20 @@ export default {
|
|||
this.getList()
|
||||
},
|
||||
getList() {
|
||||
getInstanceList(this.filterData).then(e => {
|
||||
this.instanceList = e.instanceCenterList
|
||||
this.total = e.totalCount
|
||||
})
|
||||
},
|
||||
onSearchClick() {
|
||||
this.getList()
|
||||
},
|
||||
resetSearch() {
|
||||
this.filterData = {
|
||||
instance_type: 0,
|
||||
instance_name: ''
|
||||
}
|
||||
this.getList()
|
||||
},
|
||||
handleClick() {
|
||||
if (this.activeName === '1') {
|
||||
|
@ -88,91 +129,15 @@ export default {
|
|||
|
||||
<style lang="scss">
|
||||
.instanceList{
|
||||
margin: 30px 20px;
|
||||
.opr-btn{
|
||||
font-size: 16px;
|
||||
padding: 10px 36px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
// margin: 30px 20px;
|
||||
// .opr-btn{
|
||||
// font-size: 16px;
|
||||
// padding: 10px 36px;
|
||||
// margin-bottom: 30px;
|
||||
// }
|
||||
.el-button--primary{
|
||||
background-color: #468EFC;
|
||||
}
|
||||
.el-card{
|
||||
// border: 1px solid #EEEEEE;
|
||||
border-radius: 5px;
|
||||
margin-top:0;
|
||||
.btn-group{
|
||||
width: 100%;
|
||||
padding: 10px 30px;
|
||||
}
|
||||
.el-button{
|
||||
width: 45%;
|
||||
margin:0
|
||||
}
|
||||
.el-popover__reference{
|
||||
margin-right: 10%;
|
||||
}
|
||||
}
|
||||
.el-steps{
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
.el-step__icon.is-text{
|
||||
background: #BCBCBC;
|
||||
color: #ffffff;
|
||||
border-color:#BCBCBC;
|
||||
}
|
||||
.el-step__head.is-finish .is-text{
|
||||
border-color:#468EFC;
|
||||
background: #468EFC;
|
||||
}
|
||||
.el-step.is-horizontal .el-step__line {
|
||||
top: 11px;
|
||||
height: 1px;
|
||||
background: #DFDFDF;
|
||||
left: 10%;
|
||||
right: 0;
|
||||
width: 85%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.instanceList{
|
||||
.el-tabs__header{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.bg-gray{
|
||||
padding: 20px;
|
||||
}
|
||||
.codemirror {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
.funcTable{
|
||||
margin-bottom: 30px;
|
||||
border-spacing: 0;
|
||||
tr{
|
||||
border-top: 1px solid var(--tableTdBorderColor);
|
||||
}
|
||||
tr:last-child(){
|
||||
border-bottom: 1px solid var(--tableTdBorderColor);
|
||||
}
|
||||
td{
|
||||
width: 16.6%;
|
||||
padding-left:10px;
|
||||
border-left: 1px solid var(--tableTdBorderColor);
|
||||
}
|
||||
td:last-child(){
|
||||
border-right: 1px solid var(--tableTdBorderColor);
|
||||
}
|
||||
}
|
||||
.progress{
|
||||
width: 300px;
|
||||
margin: 30px auto;
|
||||
}
|
||||
.invokeBtn{
|
||||
margin: 60px auto;
|
||||
}
|
||||
}
|
||||
.instanceCard{
|
||||
img{
|
||||
|
@ -185,6 +150,7 @@ export default {
|
|||
margin-right: 0rem;
|
||||
}
|
||||
margin: 30px auto;
|
||||
margin-top: 0;
|
||||
.el-tag{
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
@ -194,6 +160,10 @@ export default {
|
|||
border: 1px solid #b1b0b0;
|
||||
text-indent: 1rem;
|
||||
text-align: left;
|
||||
height: 12vh;
|
||||
/* white-space: nowrap; */
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.el-card__body{
|
||||
padding:0;
|
||||
|
@ -223,6 +193,9 @@ export default {
|
|||
font-size: 18px;
|
||||
text-indent: 1rem;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
.title:before{
|
||||
width: 0;
|
||||
|
|
Loading…
Reference in New Issue