Skip to content

I
intelligent_station_web
Commit 9756de6a authored by 张伯涛's avatar 张伯涛
Browse files
Options

修改

parent a708edfa
Hide whitespace changes
Inline Side-by-side
Showing with 151 additions and 48 deletions
src/api/resContainerInstance.js
View file @ 9756de6a
......@@ -82,3 +82,10 @@ export function listAllResHost() {
method: 'get'
})
}
// 获取跳转地址
export function getUrl(type) {
return request({
url: '/rescontainerinstance/getUrl/' + type,
method: 'get'
})
}
src/views/containerManage/containerManage/index.vue
View file @ 9756de6a
......@@ -202,7 +202,7 @@
<span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" class-name="small-padding fixed-width" width="100px">
<el-table-column label="操作" class-name="small-padding fixed-width" width="170px">
<template slot-scope="scope">
<el-button
:class="commonField.updateClass"
......@@ -216,6 +216,12 @@
:size="commonField.size"
@click="handleDelete(scope.row)"
>关机</el-button>
<el-button
:class="commonField.delClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handlejump(scope.row)"
>跳转</el-button>
</template>
</el-table-column>
</el-table>
......@@ -239,6 +245,7 @@ import {
updateResContainerInstance,
exportResContainerInstance,
getListUser,
getUrl,
listAllResHost } from '@/api/resContainerInstance'
import { ListAllResQuotaTemplate } from '@/api/resQuotaTemplate'
import { listAllResPublicImage } from '@/api/resPublicImage'
......@@ -253,12 +260,12 @@ export default {
total: 6,
// 容器实例表格数据
resContainerInstanceList: [
{dockerName: 'test_nginx',dockerLabel: '1',superiName: '学生1',dockerCpu: '11',dockerMemory: '12',dockerDisk: '32',dockerGpu: '22',hostName: '主机1',imageName: '通义-文本生成图像大模型-中英文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-27 14:21'},
{dockerName: 'test_nginx2',dockerLabel: '3',superiName: '学生2',dockerCpu: '34',dockerMemory: '54',dockerDisk: '65',dockerGpu: '32',hostName: '主机2',imageName: 'BERT文本分割-中文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-07-21 16:13'},
{dockerName: 'test_nginx3',dockerLabel: '8',superiName: '学生4',dockerCpu: '65',dockerMemory: '4',dockerDisk: '52',dockerGpu: '6',hostName: '主机3',imageName: 'RexUniNLU零样本通用自然语言理解-中文-base',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-02 09:43'},
{dockerName: 'test_nginx4',dockerLabel: '1',superiName: '学生5',dockerCpu: '234',dockerMemory: '3',dockerDisk: '18',dockerGpu: '9',hostName: '主机4',imageName: 'mPLUG视觉问答模型-中文-base',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-07 14:16'},
{dockerName: 'test_nginx5',dockerLabel: '9',superiName: '学生6',dockerCpu: '67',dockerMemory: '8',dockerDisk: '48',dockerGpu: '18',hostName: '主机5',imageName: '通义-文本生成图像大模型-中英文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-19 12:20'},
{dockerName: 'test_nginx',dockerLabel: '1',superiName: '学生7',dockerCpu: '4',dockerMemory: '4',dockerDisk: '32',dockerGpu: '22',hostName: '主机6',imageName: 'AnyText多语言视觉文字生成与编辑模型',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-27 14:21'},
{jumpType:'ollama', dockerName: 'test_nginx',dockerLabel: '1',superiName: '学生1',dockerCpu: '11',dockerMemory: '12',dockerDisk: '32',dockerGpu: '22',hostName: '主机1',imageName: '通义-文本生成图像大模型-中英文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-27 14:21'},
{jumpType:'jupyter', dockerName: 'test_nginx2',dockerLabel: '3',superiName: '学生2',dockerCpu: '34',dockerMemory: '54',dockerDisk: '65',dockerGpu: '32',hostName: '主机2',imageName: 'BERT文本分割-中文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-07-21 16:13'},
{jumpType:'ollama', dockerName: 'test_nginx3',dockerLabel: '8',superiName: '学生4',dockerCpu: '65',dockerMemory: '4',dockerDisk: '52',dockerGpu: '6',hostName: '主机3',imageName: 'RexUniNLU零样本通用自然语言理解-中文-base',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-02 09:43'},
{jumpType:'jupyter', dockerName: 'test_nginx4',dockerLabel: '1',superiName: '学生5',dockerCpu: '234',dockerMemory: '3',dockerDisk: '18',dockerGpu: '9',hostName: '主机4',imageName: 'mPLUG视觉问答模型-中文-base',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-07 14:16'},
{jumpType:'ollama', dockerName: 'test_nginx5',dockerLabel: '9',superiName: '学生6',dockerCpu: '67',dockerMemory: '8',dockerDisk: '48',dockerGpu: '18',hostName: '主机5',imageName: '通义-文本生成图像大模型-中英文-通用领域',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-19 12:20'},
{jumpType:'jupyter', dockerName: 'test_nginx',dockerLabel: '1',superiName: '学生7',dockerCpu: '4',dockerMemory: '4',dockerDisk: '32',dockerGpu: '22',hostName: '主机6',imageName: 'AnyText多语言视觉文字生成与编辑模型',dockerStatus: '1',remarks: '-',createName:'管理员',createDate: '2024-08-27 14:21'},
],
// 负责人数据
superintendentList: [],
......@@ -559,6 +566,15 @@ export default {
}
})
},
handlejump(item) {
getUrl(item.jumpType).then(res => {
if (res.code === 200){
window.open(res.data, '_blank');
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.businessId
......
src/views/homePage/index.vue
View file @ 9756de6a
<template>
<div class="homePage_module">
<div class="header">
<el-select v-model="host" size="small" placeholder="请选择">
<el-option
v-for="item in hostOptions"
:key="item.businessId"
:label="item.hostIp"
:value="item.businessId"
/>
</el-select>
<div class="header_title">控制台</div>
<div class="header_time">
<img :src="timePng" class="timePng">
<span>{{currentTime}}</span>
</div>
</div>
<!-- <div class="header">-->
<!-- <el-select v-model="host" size="small" placeholder="请选择">-->
<!-- <el-option-->
<!-- v-for="item in hostOptions"-->
<!-- :key="item.businessId"-->
<!-- :label="item.hostIp"-->
<!-- :value="item.businessId"-->
<!-- />-->
<!-- </el-select>-->
<!-- <div class="header_title">控制台</div>-->
<!-- <div class="header_time">-->
<!-- <img :src="timePng" class="timePng">-->
<!-- <span>{{currentTime}}</span>-->
<!-- </div>-->
<!-- </div>-->
<div class="first_row">
<!-- <div class="timeCard">-->
<!-- <div class="title">系统运行时间</div>-->
......@@ -33,7 +33,7 @@
</div>
<div class="cpuCard">
<div class="top">
<div class="title">CPU核数</div>
<div class="title">CPU</div>
<div class="value">32核</div>
</div>
<div class="bottom">
......@@ -56,10 +56,22 @@
<img :src="GpuImg" class="Img">
<div class="echarts_value">6.6%</div>
</div>
<div class="averageLoad_card">
<div class="title">TPS</div>
<div class="value">15</div>
<img :src="averageLoadImg" class="averageLoadImg">
<div class="tpsCard">
<div>
<el-select v-model="host" size="small" style="width: 100%" placeholder="请选择">
<el-option
v-for="item in hostOptions"
:key="item.businessId"
:label="item.hostIp"
:value="item.businessId"
/>
</el-select>
</div>
<div class="averageLoad_card">
<div class="title">TPS</div>
<div class="value">15</div>
<img :src="averageLoadImg" class="averageLoadImg">
</div>
</div>
</div>
<div class="second_row">
......@@ -941,16 +953,31 @@ export default {
line-height: 28px;
}
}
.tpsCard{
width: 248px;
height: 204px;
display: flex;
flex-direction: column; /* 设置为列方向，使子元素上下排列 */
justify-content: space-between;
}
.topCard{
width: 248px;
height: 30px;
background: #ffffff;
border: 1px solid #ecf0f1;
border-radius: 4px;
box-shadow: 0px 0px 25px 0px rgba(19,101,198,0.15);
}
.averageLoad_card{
text-align: center;
width: 248px;
height: 204px;
height: 160px;
background: #ffffff;
border: 1px solid #ecf0f1;
border-radius: 4px;
box-shadow: 0px 0px 25px 0px rgba(19,101,198,0.15);
.title{
margin: 25px 0 43px;
margin: 15px 0 23px;
height: 18px;
font-size: 14px;
font-family: Microsoft YaHei, Microsoft YaHei-400;
......@@ -959,13 +986,13 @@ export default {
line-height: 18px;
}
.value{
margin-bottom: 32px;
height: 32px;
margin-bottom: 15px;
height: 22px;
font-size: 24px;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
color: #333333;
line-height: 32px;
line-height: 22px;
}
.averageLoadImg{
......
src/views/myStorage/index.vue
View file @ 9756de6a
......@@ -5,25 +5,48 @@
<div class="card_content">
<div class="card_item">
<div class="card_itemName">存储空间名称</div>
<div class="card_itemValue">catarc-res</div>
<img :src="nameImg" class="Img">
<!-- <div class="card_itemValue">catarc-res</div>-->
<div class="card_itemValue">
<el-select v-model="host" size="small" placeholder="请选择">
<el-option
v-for="item in hostOptions"
:key="item.businessId"
:label="item.hostIp"
:value="item.businessId"
/>
</el-select>
</div>
</div>
<div class="card_item">
<div class="card_itemName">读取权限</div>
<img :src="readImg" class="Img">
<div class="card_itemValue">私有</div>
</div>
<div class="card_item">
<div class="card_itemName">总存储量（不含ECS快照）</div>
<div class="card_itemValue">8.12GB</div>
<el-row>
<el-col :span="12">
<div class="card_itemName">总存储量</div>
<img :src="storageImg" class="Img">
<div class="card_itemValue">8.12GB</div>
</el-col>
<el-col :span="12">
<div class="card_itemName">已用存储</div>
<img :src="storageImg" class="Img">
<div class="card_itemValue">3.46GB</div>
</el-col>
</el-row>
</div>
<div class="card_item">
<div class="card_itemName">创建时间</div>
<img :src="timeImg" class="Img">
<div class="card_itemValue">2024年8月9日 13:04</div>
</div>
</div>
</div>
<div class="table_content">
<div class="tableHeader">
<i class="el-icon-d-arrow-left" @click="handleGoBack"></i>
<i v-if="pathName !== '/'" class="el-icon-d-arrow-left" @click="handleGoBack"></i>
<div class="path">当前路径：{{pathName2 ? pathName + '/' + pathName2 :pathName}}</div>
</div>
<el-table
......@@ -33,6 +56,8 @@
<el-table-column type="index" label="序号" width="90" />
<el-table-column label="文件名称" prop="name" :show-overflow-tooltip="true">
<template slot-scope="scope">
<i v-if="scope.row.level === 3" class="el-icon-document"></i>
<i v-else class="el-icon-folder"></i>
<span style="color: #2288ff;cursor: pointer" @click="handleChose(scope.row)">
{{ scope.row.name }}</span>
</template>
......@@ -51,11 +76,19 @@
</template>
<script>
import {listAll} from "@/views/homePage/apis";
export default {
name: "index",
data() {
return{
pathName: '',
host: '',
hostOptions: [],
nameImg: require('@/assets/image/cunchu.png'),
readImg: require('@/assets/image/duqu.png'),
storageImg: require('@/assets/image/zongliang.png'),
timeImg: require('@/assets/image/shijian.png'),
pathName: '/',
pathName2: '',
dataList: [
{name: 'video',updateTime: '2024-08-21 09:31:25',id: 1,level: 1},
......@@ -81,9 +114,16 @@ export default {
created() {
},
mounted() {
this.getHostOptions()
this.showDataList = this.dataList.filter(item => item.level === 1)
},
methods:{
getHostOptions() {
listAll().then(res=> {
this.hostOptions = res.data
this.host = res.data[0].businessId
})
},
getList() {
},
......@@ -103,7 +143,7 @@ export default {
this.pathName2 = ''
this.showDataList = this.dataList.filter(item => item.level === list[0].level - 1 && item.id === list[0].id - 1)
}else if(list[0].level === 2) {
this.pathName = ''
this.pathName = '/'
this.showDataList = this.dataList.filter(item => item.level === 1)
}
}
......@@ -118,6 +158,12 @@ export default {
font-weight: bold;
}
.table_content{
.el-icon-folder{
font-size: 20px;
}
.el-icon-document{
font-size: 20px;
}
.tableHeader{
display: flex;
align-items: center;
......@@ -147,21 +193,28 @@ export default {
align-items: center;
}
.card_item{
width: 270px;
height: 100px;
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: rgb(247, 249, 250);
width: 384px;
height: 204px;
background: #ffffff;
border: 1px solid #ecf0f1;
border-radius: 4px;
padding: 12px;
box-shadow: 0px 0px 25px 0px rgba(19,101,198,0.15);
text-align: center;
.card_itemName{
font-size: 18px;
color: #555555;
padding: 25px 0;
font-size: 14px;
font-weight: 400;
color: #666666;
}
.Img{
width: 56px;
height: 56px;
}
.card_itemValue{
padding: 25px 0;
font-size: 24px;
font-weight: bold;
font-family: Microsoft YaHei, Microsoft YaHei-700;
font-weight: 700;
color: #333333;
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment