This commit is contained in:
ann 2024-09-03 16:47:29 +08:00
parent 740cc53180
commit 990fc81b37
6 changed files with 245 additions and 3 deletions

View File

@ -563,6 +563,7 @@
"operation": "Single Operation",
"allOperation": "All Operation",
"selectInstance": "Select Instance",
"selectSubInstance": "Select SubInstance"
"selectSubInstance": "Select SubInstance",
"instanceDes": "Instance Description"
}
}

View File

@ -563,6 +563,7 @@
"operation": "单独操作",
"allOperation": "全部操作",
"selectInstance": "选择主实例",
"selectSubInstance": "选择子实例"
"selectSubInstance": "选择子实例",
"instanceDes": "实例描述"
}
}

View File

@ -67,6 +67,13 @@ export const addDeductiveTextTask = (data) => {
data
})
}
export const createDeployTask = (data) => {
return request({
url: '/pcm/v1/inference/createDeployTask',
method: 'post',
data
})
}
export const chatApi = (data) => {
return request({
@ -85,6 +92,9 @@ export const getModelName = (type) => {
return request({ url: '/pcm/v1/inference/modelNames?type=' + type, method: 'get' })
}
export const getClustersByModel = (params) => {
return request({ url: '/pcm/v1/inference/getAdaptersByModel', method: 'get', params })
}
export const getInstanceListByModelType = (params) => {
return request({ url: '/pcm/v1/inference/getDeployTasksByType', method: 'get', params })
}

View File

@ -15,6 +15,13 @@ const taskManagementRouter = {
meta: { activeMenu: '/taskManagement/taskList' },
hidden: true
},
{
path: 'createInstance',
component: () => import('@/views/taskManagement/aiList/createInstance'),
name: 'createInstance',
meta: { activeMenu: '/taskManagement/taskList' },
hidden: true
},
{
path: 'detail',
component: () => import('@/views/taskManagement/taskList/detail'),

View File

@ -0,0 +1,223 @@
<template>
<el-card v-loading="loading" class="list-detail">
<el-page-header :content="$t('message.create')" @back="goBack" />
<h2>{{ $t('page.instance') + $t('message.create') }}</h2>
<div class="formcontainer">
<div class="taskForm">
<el-form
ref="formData"
class="form-wrap"
label-position="left"
:model="formData"
:rules="formDataRules"
>
<el-form-item :label="$t('page.instanceName')" prop="taskName">
<el-input
v-model="formData.taskName"
:placeholder="$t('page.inputWarn')"
:max-length="30"
/>
</el-form-item>
<el-form-item :label="$t('page.instanceDes')" prop="taskDesc">
<el-input
v-model="formData.taskDesc"
:max-length="100"
/>
</el-form-item>
<el-form-item :label="$t('page.modelType')" prop="modelType">
<el-select v-model="formData.modelType" style="width: 280px;margin-right: 10px;">
<el-option v-for="item in modelTypeList" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<el-form-item :label="$t('page.modelName')" prop="modelName">
<el-select v-model="formData.modelName" style="width: 280px;margin-right: 10px;">
<el-option v-for="item in modelNameList" :key="item" :label="item" :value="item" />
</el-select>
</el-form-item>
<div>
<el-form-item :label="$t('page.selectCluster')" prop="aiClusterIds">
<!-- <el-select v-model="formData.aiClusterIds" style="width: 280px;margin-right: 10px;">
<el-option v-for="item in formData.staticWeightMap" :key="item.id" :label="item.key" :value="item.id" />
</el-select> -->
<table class="tableInput">
<tr v-for="env in clusterList" :key="env.adapterId">
<td>
<el-checkbox v-model="env.selected" size="small" />
{{ env.taskName }}</td>
<td>
<el-select v-model="env.selectedclusters" style="width: 280px;margin-right: 10px;" multiple>
<el-option v-for="item in env.clusters" :key="item.clusterId" :label="item.clusterName" :value="item.clusterId" />
</el-select>
</td>
</tr>
</table>
</el-form-item>
</div>
</el-form>
</div>
</div>
<el-row type="flex" justify="end">
<el-col :span="2.5">
<el-button size="medium" @click="goBack">{{ $t("message.cancel") }}</el-button>
<el-button size="medium" type="primary" @click="saveForm">{{ $t("message.create") }}</el-button>
</el-col>
</el-row>
</el-card>
</template>
<script>
// import List from '@/components/list'
import { getClusterList } from '@/api/container/cluster'
import { mapGetters } from 'vuex'
import { getModelType, getModelName, createDeployTask, getClustersByModel } from '@/api/task/task'
// import jobForm from './components/jobForm.vue'
export default {
// components: { List },
data() {
return {
getClusterList,
tableListData: [],
isEdit: false,
loading: false,
submitLoading: false,
selectCluster: false,
strategySetting: false,
formData: {
taskName: '',
taskDesc: '',
modelName: '',
modelType: '',
adapterClusterMap: []
},
clusterList: {
},
modelTypeList: [],
modelNameList: []
}
},
computed: {
...mapGetters([
'dict'
]),
columns() {
return this.setColumn()
},
formDataRules() {
return {
taskName: [
{ required: true, message: this.$t('check.input') + this.$t('message.name') }
// {
// pattern: /^[a-z]([-a-z0-9]*[a-z0-9])?$/,
// message: this.$t('check.inputInvalid')
// }
// { validator: this.nameValidator }
],
taskDesc: [
{ required: true, message: this.$t('check.input') + this.$t('page.taskDes') }
],
modelType: [{ required: true, message: this.$t('check.requireSelect'), trigger: 'change' }],
modelName: [{ required: true, message: this.$t('check.requireSelect'), trigger: 'change' }]
}
}
},
watch: {
'formData.modelType'(val) {
if (val) {
this.formData.modelName = ''
getModelName(val).then(e => {
this.modelNameList = e.data.models
})
}
},
'formData.modelName'(val) {
if (val && this.formData.modelType) {
this.clusterList = {}
getClustersByModel({ modelType: this.formData.modelType, modelName: val }).then(e => {
this.clusterList = e.data.adapters
})
}
}
},
mounted() {
getModelType().then(e => {
this.modelTypeList = e.data.types
})
},
methods: {
getCluster() {
const query = { 'type': this.taskType === 'application' ? '0' : (this.taskType === 'aiBase' || this.taskType === 'aiCard') ? '1' : this.taskType === 'hpcBase' ? '2' : '0', 'adapterId': this.formData.adapterId, pageNum: 1, pageSize: 1000 }
this.getClusterList(query).then(e => {
this.currentClusterList = e.data.list || []
})
},
goBack() {
this.$router.push({ path: '/taskManagement/aiList' })
},
saveForm() {
this.$refs.formData.validate((valid) => {
if (valid) {
console.log(this.clusterList)
this.formData.adapterClusterMap = {}
this.clusterList.forEach(e => {
if (e.selected) {
this.formData.adapterClusterMap[e.adapterId] = e.selectedclusters
}
})
createDeployTask(this.formData).then(e => {
this.$message.success(this.$t('page.createdSuccess'))
this.$router.push({ path: '/taskManagement/aiList' })
}).catch(e => {
this.submitLoading = false
})
console.log(this.formData)
}
})
}
}
}
</script>
<style lang="scss">
.formcontainer{
margin-bottom: 24px;
}
.taskForm{
border: 1px solid #2B3948;
padding: 20px;
}
.tableInput{
width: 50%;
border: 1px solid gray;
border-collapse: collapse;
.el-form-item{
margin: 0!important;
}
td, th{
padding: 1em;
border-left: 1px solid gray;
}
td:first-child, th:first-child{
border-left: 0;
}
tr{
border-top: 1px solid gray;
}
tr:first-child {
border-top: 0;
}
}
.sliderSet{
.el-slider__marks-text:last-child{
width: 100px!important;
}
.el-slider__marks-text:first-child{
text-align: right;
padding-left: 2rem;
}
}
</style>

View File

@ -263,7 +263,7 @@ export default {
this.$router.push({ path: `detail`, query: { id: row.id }})
},
createItem() {
this.$router.push({ path: `create` })
this.$router.push({ path: `createInstance` })
},
handleClick() {
console.log('switch')