update code

main
haha 2024-07-18 00:13:00 +08:00
parent 624b6b1575
commit 0bb7e4401c
4 changed files with 439 additions and 231 deletions

View File

@ -0,0 +1,22 @@
import request from "@/utils/request";
const doCompile=(data)=>{
return request({
url:'/inference/compile',
method:'post',
data:data
})
}
const doDeploy=(data)=>{
return request({
url:'/inference/deploy',
method:'post',
data:data
})
}
export default{
doCompile,
doDeploy
}

View File

@ -12,7 +12,17 @@ const userOperationNotice=()=>{
method: "get"
});
}
//获取用户操作详情
const userOperation=(operation_id)=>{
return request({
url: `/logs/user_operation/${operation_id}`,
method: "get"
});
}
export default {
serverState,
userOperationNotice
userOperationNotice,
userOperation
}

View File

@ -8,7 +8,9 @@
</el-col>
<el-col :span="8">
<span>模型类型:</span>
<span>{{ modelInfo.modl_main_type_name+"/"+modelInfo.modl_sub_type_name }}</span>
<span>{{
modelInfo.modl_main_type_name + "/" + modelInfo.modl_sub_type_name
}}</span>
</el-col>
<el-col :span="8">
<span>互联名称:</span>
@ -16,117 +18,183 @@
</el-col>
</el-row>
</el-card>
<el-card style="margin-top:12px;position: relative;" class="simulation-add-add-step32">
<el-card style="margin-top: 12px; position: relative" class="simulation-add-add-step32">
<template #header>
<span>设备选择</span>
<el-form ref="queryFormRef" :inline="true"
style="flex-grow: 1;text-align: right;position: absolute;top:4px;right:0px;">
<el-form ref="queryFormRef" :inline="true" style="
flex-grow: 1;
text-align: right;
position: absolute;
top: 4px;
right: 0px;
">
<el-form-item>
<el-button type="primary" @click="handleQuery"><i-ep-refresh />刷新</el-button>
<el-button type="primary" @click="handleQuery">
<i-ep-refresh />刷新</el-button>
</el-form-item>
</el-form>
</template>
<el-table v-loading="loading" ref="dataTb" :data="info.tableData" stripe @row-click="doRowClick">
<el-table-column type="selection" width="55" />
<el-table-column width="55">
<template #default="scope">
<el-checkbox v-model="scope.row.checked" :disabled="!scope.row.available" />
</template>
</el-table-column>
<el-table-column label="设备名称" align="left" prop="device_name" />
<el-table-column label="AI芯片信息" align="left" prop="hardware_chip" />
<el-table-column label="已部署模型名称" align="left" prop="deployed_model_name" width="120" />
<el-table-column label="已部署模型网络类型" align="left" prop="deployed_model_net_type" />
<el-table-column label="互联名称" align="left" prop="connection_name" width="120" />
<el-table-column label="部署时间" align="left" prop="deployed_time" width="160" />
<el-table-column label="量化和编译参数" align="left" prop="tool_params_name" width="160">
<template #default="scope">
<span class="args-state state-2">{{ scope.row.tool_params_name ? scope.row.tool_params_name : '请选择'
<span class="args-state state-2">{{
scope.row.tool_params_name ? scope.row.tool_params_name : "请选择"
}}</span>
</template>
</el-table-column>
<el-table-column label="设备状态" align="center" width="100">
<template #default="scope">
<span :class="'device-state state-'">{{
scope.row.available? '可用' : '不可用' }}</span>
scope.row.available ? "可用" : "不可用"
}}</span>
</template>
</el-table-column>
</el-table>
<div v-if="info.state > 0" class="remark"></div>
</el-card>
<div style="margin-top:12px;font-size:12px;font-weight: bold;margin-left:8px;">编译结果</div>
<div style="margin-top: 12px;font-size: 12px;font-weight: bold;margin-left: 8px;">
编译结果
</div>
<el-card style="" class="simulation-add-add-step33">
<div class="scroll log-content">
<div v-for="(it, idx) in info.logs" :key="idx" class="log-item" :class="it.type">
{{ it.msg }}
</div>
</div>
</el-card>
</template>
<script setup>
import taskApi from '@/api/task'
let dataTb = ref()
const loading = ref(false); //
const doRowClick = (row) => {
dataTb.value.toggleRowSelection(row)
}
const info=reactive({
tableData:[]
})
import taskApi from "@/api/task";
const props = defineProps({
modelInfo: {
type: Object,
require: true,
default: null
default: null,
},
});
let dataTb = ref();
const loading = ref(false); //
const doRowClick = (row, a, b) => {
if (b.target.classList.contains("el-checkbox__inner")) {
return;
}
})
if (row.available) {
row.checked = !row.checked;
}
};
const info = reactive({
tableData: [],
state: 0,
logs: [],
});
/** 查询 */
function handleQuery() {
loading.value = true;
let m = props.modelInfo;
taskApi.availableDevices({
taskApi
.availableDevices({
connection_id: m.connection_id,
model_id:m.model_id
}).then(d=>{
model_id: m.model_id,
})
.then((d) => {
loading.value = false;
info.tableData=(d.data.data.available_device_list||[]).map(it=>{
info.tableData = (d.data.data.available_device_list || []).map((it) => {
it.id = it.device_id;
it.checked = false;
return it;
});
});
}
const checkForm = () => {
let rows = info.dataTb.getSelectionRows();
let rows = info.tableData.filter((d) => d.checked);
return rows.length == 0 ? null : rows;
};
const updateState = (s) => {
info.state = s;
};
const updateLogs = (logs) => {
info.logs = logs;
};
onMounted(() => {
handleQuery();
});
defineExpose({
checkForm
})
checkForm,
updateState,
updateLogs,
});
</script>
<style lang="scss" scoped>
.model-info {
font-size: 12px;
color: #666;
}
.remark {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #00000033;
z-index: 99;
}
.log-content {
max-height: 200px;
overflow-y: auto;
.log-item {
font-size: 12px;
color: #666;
border-bottom: dotted 1px #ccc;
line-height: 24px;
&.info {
color: var(--el-color-primary);
}
&.success {
color: var(--el-color-success);
}
}
}
</style>
<style lang='scss'>
<style lang="scss">
.simulation-add-add-step32 {
.device-state {
&.state-1 {
color: var(--el-color-primary);
}
&.state-2 {
color: var(--el-color-success);
}
}
.args-state {
&.state-2 {
color: var(--el-color-primary);
}
}
.result-state {
color: var(--el-color-danger);
}

View File

@ -15,15 +15,26 @@
<addStep4 ref="step4" v-if="active == 4" />
</div>
<el-card class="card-footer">
<el-button type="primary" v-if="active == 3" @click="doCompile"></el-button>
<el-button type="primary" v-if="active == 3 && state == 0" @click="doCompile"></el-button>
<el-button type="primary" v-if="active == 3 && state == 1" loading disabled>编译中...</el-button>
<el-button type="primary" v-if="active == 3 && state == 2" loading disabled>部署中...</el-button>
<el-button type="primary" v-if="active == 4" @click="doStart"></el-button>
<el-button type="primary" v-if="active > 0 && active <= 4" @click="doPrev"></el-button>
<el-button @click="doNext" v-if="active < 4"></el-button>
<el-button type="primary" v-if="active > 0 && active <= 4 && active != 3" @click="doPrev"></el-button>
<template v-if="active == 3 && (state == 0 || state == 3)">
<el-button type="primary" @click="doPrev"></el-button>
</template>
<template v-if="active == 3 && state == 3">
<el-button @click="doNext"></el-button>
</template>
<el-button @click="doNext" v-if="active < 3"></el-button>
</el-card>
</div>
</template>
<script setup>
import inferenceApi from '@/api/inference'
import logsApi from '@/api/log'
import request from 'axios'
import addStep1 from './addStep1.vue'
import addStep2 from './addStep2.vue'
import addStep3 from './addStep3.vue'
@ -34,11 +45,15 @@ const step1=ref()
const step2 = ref()
const step3 = ref()
const step4 = ref()
let taskInfo=reactive({});
let modelInfo = reactive({});
let devices=reactive([]);
let datas=reactive({});
let state = ref(0);
let info = reactive({
devices: [],
taskInfo: null,
optIds: [],
logs: [],
})
const doStart = () => {
let tmp = step4.value.checkForm();
if (tmp) {
@ -54,20 +69,114 @@ const doStart = () => {
const doCompile = () => {
let tmp = step3.value.checkForm();
if (tmp) {
devices=tmp;
ElMessage.success("开始编译部署!");
info.devices = tmp;
state.value = 1;
step3.value.updateState(state.value);
startComplie();//
//ElMessage.success("!");
} else {
ElMessage.error("请选择设备!");
}
}
//
const startComplie = () => {
let ajaxs = info.devices.map(d => {
return inferenceApi.doCompile({
model_id: modelInfo.model_id,
modl_net_type: modelInfo.modl_net_type,
tool_params_id: d.tool_params_id,
device_id: d.device_id
});
})
addLogs({ msg: "开始编译....", type: "info" })
request.all(ajaxs).then(d => {
info.optIds = d.map(it => {
return {
id: it.data.data.operation_id, //op_id
state: 0 // 1
}
});
doGetComplieLogs();//
});
};
const addLogs = msg => {
info.logs = [msg, ...info.logs];
step3.value.updateLogs(info.logs);
}
//
const doGetComplieLogs = () => {
let ajaxs = info.optIds.filter(d => d.state == 0).map(o => {
return logsApi.userOperation(o.id);
})
request.all(ajaxs).then(d => {
d.forEach((it, idx) => {
let msg = it.data.data;
addLogs({ msg: msg.operation_result });
info.optIds[idx].state = msg.operation_finished ? 1 : 0;
});
if (info.optIds.filter(d => d.state == 0).length > 0) {
setTimeout(doGetComplieLogs, 2000);
} else {
doDeploy();
}
});
}
const doDeploy = () => {
state.value = 2;
step3.value.updateState(state.value);
addLogs({ msg: "开始部署....", type: 'info' })
let ajaxs = info.devices.map(d => {
return inferenceApi.doDeploy({
model_id: modelInfo.model_id,
modl_net_type: modelInfo.modl_net_type,
device_id: d.device_id
});
});
request.all(ajaxs).then(d => {
info.optIds = d.map(it => {
return {
id: it.data.data.operation_id, //op_id
state: 0 // 1
}
});
doGetDeployLogs();//
})
};
const doGetDeployLogs = () => {
let ajaxs = info.optIds.filter(d => d.state == 0).map(o => {
return logsApi.userOperation(o.id);
})
request.all(ajaxs).then(d => {
d.forEach((it, idx) => {
let msg = it.data.data;
addLogs({ msg: msg.operation_result });
info.optIds[idx].state = msg.operation_finished ? 1 : 0;
});
if (info.optIds.filter(d => d.state == 0).length > 0) {
setTimeout(doGetDeployLogs, 2000);
} else {
addLogs({ msg: "编译部署完成", type: 'success' })
state.value = 3;
step3.value.updateState(state.value);
}
});
};
const doPrev = () => {
active.value--;
if (active.value == 3) {
state.value = 0;
info.logs = [];
info.optIds = [];
}
}
const doNext = () => {
if (active.value == 1) {
step1.value.checkForm().then(d => {
if (d) {
taskInfo=step1.value.getFormData();
info.taskInfo = step1.value.getFormData();
active.value++;
}
});
@ -75,18 +184,15 @@ const doNext = () => {
let tmp = step2.value.checkForm();
if (tmp) {
modelInfo = tmp;
state.value = 0;
info.logs = [];
info.optIds = [];
active.value++;
} else {
ElMessage.error("请选择模型!");
}
} else if (active.value == 3) {
let tmp=step3.value.checkForm();
if(tmp){
devices=tmp;
active.value++;
}else{
ElMessage.error("请选择设备!");
}
} else if (active.value == 4) {
} else {
@ -136,6 +242,8 @@ const doNext = () => {
}
.card-content {
position: relative;
.el-card__header {
padding: 8px 12px;
display: flex;