fix
This commit is contained in:
ann
parent
567c7cb001
commit
87654f1ace
|
|
@ -564,6 +564,7 @@
|
|||
"allOperation": "All Operation",
|
||||
"selectInstance": "Select Instance",
|
||||
"selectSubInstance": "Select SubInstance",
|
||||
"instanceDes": "Instance Description"
|
||||
"instanceDes": "Instance Description",
|
||||
"application": "Application"
|
||||
}
|
||||
}
|
||||
|
|
@ -564,6 +564,7 @@
|
|||
"allOperation": "全部操作",
|
||||
"selectInstance": "选择主实例",
|
||||
"selectSubInstance": "选择子实例",
|
||||
"instanceDes": "实例描述"
|
||||
"instanceDes": "实例描述",
|
||||
"application": "应用"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,229 @@
|
|||
<template>
|
||||
<el-card v-loading="loading" class="list-detail">
|
||||
<el-page-header :content="$t('message.create')" @back="goBack" />
|
||||
<h2>{{ $t('message.create') + $t('page.application') }}</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.adapterName }}</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" :disabled="submitLoading" @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) {
|
||||
this.submitLoading = true
|
||||
this.formData.adapterClusterMap = {}
|
||||
this.clusterList.forEach(e => {
|
||||
if (e.selected) {
|
||||
this.formData.adapterClusterMap[e.adapterId] = e.selectedclusters
|
||||
}
|
||||
})
|
||||
const form = new FormData()
|
||||
form.set('taskName', this.formData.taskName)
|
||||
form.set('taskDesc', this.formData.taskDesc)
|
||||
form.set('modelName', this.formData.modelName)
|
||||
form.set('modelType', this.formData.modelType)
|
||||
form.set('adapterClusterMap', JSON.stringify(this.formData.adapterClusterMap))
|
||||
|
||||
createDeployTask(form).then(e => {
|
||||
this.$message.success(this.$t('page.createdSuccess'))
|
||||
this.$router.push({ path: '/taskManagement/aiList' })
|
||||
}).catch(e => {
|
||||
this.submitLoading = false
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
|
||||
|
|
@ -171,7 +171,7 @@ export default {
|
|||
getTrainingTaskStat().then(e => {
|
||||
this.trainingTask = e.data
|
||||
})
|
||||
// this.freshList = setInterval(() => this.freshAllList(), 5000)
|
||||
this.freshList = setInterval(() => this.freshAllList(), 5000)
|
||||
},
|
||||
destroyed() {
|
||||
clearInterval(this.freshList)
|
||||
|
|
|
|||
Loading…
Reference in New Issue