前端内容

This commit is contained in:
wanxiaoli 2026-01-21 09:57:53 +08:00
parent 5b6f806739
commit b32a8699ab
15 changed files with 173 additions and 119 deletions

View File

@ -33,7 +33,7 @@ export function searchAlgorithmsModelPage(queryParams:any){
//单个删除项目
export function deleteAlgorithms (queryParams:any){
export function deleteAlgorithmModels (queryParams:any){
return request({
url:'/algorithm-models/'+queryParams.id ,
method: 'delete'
@ -41,7 +41,7 @@ export function deleteAlgorithms (queryParams:any){
});
}
//多选删除项目
export function deleteBatchAlgorithms (queryParams:any){
export function deleteBatchAlgorithmModels (queryParams:any){
return request({
url:'/algorithm-models',
method: 'delete',

View File

@ -83,3 +83,14 @@ export function simulationRun(projectId:string,scenarioId:string, data:any){
data: data
});
}
//新增项目
export function exportAllExports(){
return request({
url:'/projects/exportAllExports' ,
method: 'get'
});
}

View File

Before

Width:  |  Height:  |  Size: 510 B

After

Width:  |  Height:  |  Size: 510 B

View File

@ -1,6 +1,10 @@
<!-- 线 + 柱混合图 -->
<template>
<div class="echarts-model">
<!-- <el-button type="primary" @click="handleExport">导出图片</el-button> -->
<div id="chartContainer" :class="className" style="height: calc(100vh - 200px); width: 100%;" />
</div>
</template>
<script setup lang="ts">
@ -189,8 +193,25 @@ function getScenarioResults(){
initChart(option.value);
})
}
let barChart:any = null
const handleExport = () => {
if (!barChart) return
debugger
// EChartsAPI
barChart.exportToPNG({
pixelRatio: 2,
name: "图片",
}).then((dataUrl:any) => {
// a
const link = document.createElement('a')
link.download = `图片.png`
link.href = dataUrl
link.click()
})
}
function initChart(option:any) {
const barChart = init(document.getElementById('chartContainer') as HTMLDivElement);
barChart = init(document.getElementById('chartContainer') as HTMLDivElement);
barChart.setOption(option);
chart.value = barChart;

View File

@ -792,6 +792,7 @@ function preWork() {
#graph-container {
width: calc(100% - 180px);
height: 100%;
background-color: #f1f3fe;
}
.x6-widget-stencil {
background-color: #fff;
@ -1191,7 +1192,8 @@ function saveDesign() { // 保存设计
<img src="@/assets/x6/del.png" alt="图标" title="删除" style="cursor: pointer;"
@click="deleteNode">
</div>
<div class="line-style-box">
<!-- <div class="line-style-box">
<div class="DisplaySettingsButton">显示设置</div>
<div class="expansionandcontraction-box" v-if="isExpansionandcontraction == false" @click="isExpansionandcontraction = true">
<img src="@/assets/x6/expansionandcontraction-left.png">
</div>
@ -1204,7 +1206,7 @@ function saveDesign() { // 保存设计
</div>
</div>
</div>
</div> -->
</div>
<Createscenario v-if="dialogVisible" :projectInfo="projectInfo" @closeCreatescenario ="closeCreatescenario"/>
<el-dialog v-model="isScenario" :close-on-click-modal="false"
@ -1368,6 +1370,7 @@ function saveDesign() { // 保存设计
overflow: hidden;
width: 100%;
height: 100%;
}
/* Drag and drop visual feedback */
@ -1515,4 +1518,25 @@ function saveDesign() { // 保存设计
border-bottom:1px solid rgba(238, 238, 238, 1);
padding-left: 15px;
}
.DisplaySettingsButton{
position: absolute;
left: -100px;
top: 20px;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 14px;
font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #282828;
background-color: rgba(255, 255, 255, 1);
border: none;
border-radius: 4px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
cursor: pointer;
}
</style>

View File

@ -72,46 +72,49 @@ function getScenarioResults(){
})
}
function addAttrText(item:any){
// item.attrs.text = item.deviceInfo.name
graph.addNode({
shape: 'rect-text',
x: item.position.x ,
y: item.position.y + 150,
width: 100,
height: 40,
label: item.deviceInfo.name,
attrs: {
body: {
stroke: 'transparent',
fill: 'transparent',
strokeWidth: 1,
},
text: {
text: '',
label: {
textAnchor: 'left',
refX: 0,
text: item.deviceInfo.name,
fill: '#363636',
fontSize: 16,
},
}
},
})
graph.addNode({
shape: 'rect-text',
x: item.position.x ,
y: item.position.y + 180,
width: 100,
height: 30,
label: 'keff' + item.scenarioResults[item.scenarioResults.length - 1].keffValue,
attrs: {
body: {
stroke: 'transparent',
fill: 'transparent',
strokeWidth: 1,
},
text: {
text: '',
label: {
textAnchor: 'left',
refX: 0,
text: 'keff' + item.scenarioResults[item.scenarioResults.length - 1].keffValue,
fill: item.scenarioResults[item.scenarioResults.length - 1].keffValue > 0.98 ? '#ff4d4f' : '#363636',
fontSize: 14,
},
}
},
})
graph.addNode({
shape: 'image-node',
x: item.position.x + 135 ,
@ -230,6 +233,7 @@ function appendAttrText(item:any,data:any){
for(let i = 0;i<data.length;i++){
graph.addNode({
shape: 'rect-text',
x: item.position.x,
y: item.position.y + 203 + i * 25,
width: 260,
@ -528,54 +532,56 @@ onMounted(() => {
},
true,
)
// Graph.registerNode(
// 'image-echarts',
// {
// inherit: 'rect',
// width: 120,
// height: 60,
// markup: [
// {
// tagName: 'rect',
// selector: 'body',
// },
// {
// tagName: 'image',
// selector: 'img',
// },
// {
// tagName: 'text',
// selector: 'label',
// },
// ],
// attrs: {
// body: {
// stroke: 'transparent',
// strokeWidth: 1,
// fill: 'transparent',
// rx: 6,
// ry: 6,
// },
// img: {
// 'xlink:href': 'https://gw.alipayobjects.com/zos/antfincdn/FLrTNDvlna/antv.png',
// width: 24,
// height: 24,
// x: 0,
// y: 0,
// },
// label: {
// text: 'Image Node',
// fill: '#333',
// fontSize: 12,
// refX: 0.5,
// refY: 0.5,
// textAnchor: 'middle',
// dy: 10,
// },
// },
// },
// true,
// )
Graph.registerNode(
'rect-text',
{
inherit: 'rect',
width: 120,
height: 60,
markup: [
{
tagName: 'rect',
selector: 'body',
},
{
tagName: 'image',
selector: 'img',
},
{
tagName: 'text',
selector: 'label',
},
],
attrs: {
body: {
stroke: 'transparent',
strokeWidth: 1,
fill: 'transparent',
rx: 6,
ry: 6,
},
label: {
text: '',
fill: '#333',
fontSize: 12,
refX: 0.5,
refY: 0.5,
textAnchor: 'middle',
dy: 10,
},
'.': {
class: 'custom-image-node',
},
},
},
true,
)
projectsById({projectId:route.query.projectId}).then((res:any) => {
if(res.topology != null && res.topology != ''){
projectInfo.value = res
@ -590,6 +596,7 @@ onMounted(() => {
customImageData.value.push(topology.designData[i])
}
}
console.log(topology.designData)
graph.fromJSON(topology.designData);
getScenarioResults()
}
@ -647,7 +654,8 @@ function isDisplayClick(){
isDisplay.value = false
let tempGraph:any = graph.toJSON().cells
for(let i = 0;i<tempGraph.length;i++){
if(tempGraph[i].shape == 'rect' || tempGraph[i].shape == 'image-node'){
console.log(tempGraph[i])
if(tempGraph[i].shape == 'rect-text' || tempGraph[i].shape == 'image-node'){
graph.removeCell(tempGraph[i].id)
}
}

View File

@ -168,7 +168,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择算法数据吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",

View File

@ -7,13 +7,14 @@ export default {
<script setup lang="ts">
import { onMounted, ref, nextTick } from "vue";
import { ElForm, ElMessage, ElMessageBox } from "element-plus";
import { searchAlgorithmsPage,addAlgorithms,updateAlgorithms,deleteAlgorithms,deleteBatchAlgorithms} from "@/api/business/algorithm";
import { searchAlgorithmsPage,addAlgorithms,updateAlgorithms} from "@/api/business/algorithm";
import { searchAlgorithmsModelPage} from "@/api/business/algorithmModel";
import { searchAlgorithmsModelPage, deleteAlgorithmModels,deleteBatchAlgorithmModels } from "@/api/business/algorithmModel";
import Page from '@/components/Pagination/page.vue'
import { getDictItemById } from '@/api/dict';
const apiUrl = import.meta.env.VITE_APP_BASE_API; //
const menuData:any = ref([]);
const algorithmData:any = ref([]);
//
@ -193,9 +194,9 @@ function delAloneClick(row: any) {
})
.then(() => {
let params = {
id: row.algorithmId,
id: row.algorithmModelId,
};
deleteAlgorithms(params).then(() => {
deleteAlgorithmModels(params).then(() => {
gettableData();
ElMessage({
type: "success",
@ -208,19 +209,19 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择算法数据吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
let id = [] as any[];
multipleSelection.value.forEach((item: any) => {
id.push(item.algorithmId)
id.push(item.algorithmModelId)
})
let params = {
ids: id,
};
deleteBatchAlgorithms(params.ids).then(() => {
deleteBatchAlgorithmModels(params.ids).then(() => {
gettableData();
ElMessage({
message: "删除成功",
@ -341,7 +342,7 @@ function changeShowResult(isShow:boolean){ // 切换显示结果模型
</div>
<el-dialog v-model="dialogVisible" :close-on-click-modal="false"
:modal="false" draggable :before-close="handleClose" :title="title"
:modal="false" draggable :before-close="handleClose" :title="'模型详情'"
append-to-body width="1145px" height="600px">
<div style=" width: calc(100%); height: calc(100vh - 200px);">
<div style="display: flex; margin-bottom: 20px; border-bottom: 1px solid #e5e5e5;padding-bottom: 5px;">
@ -379,7 +380,7 @@ function changeShowResult(isShow:boolean){ // 切换显示结果模型
</el-form-item>
</el-form>
<div v-else style="width: 100%; height: calc(100% - 50px);">
<img src="file:///E:/python_coding/keffCenter/models/GPR/CylindricalTank/V1/error.jpg" alt="" style="width: 100%; height: 100%;object-fit:contain;">
<img :src="apiUrl +'/models/'+ info.metricsImagePath" alt="" style="width: 100%; height: 100%;object-fit:contain;">
</div>
</div>

View File

@ -196,7 +196,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择设备吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",

View File

@ -256,7 +256,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择设备吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",

View File

@ -219,7 +219,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择物料数据吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",

View File

@ -11,6 +11,7 @@ import { searchProjectsLsit,addProjects,updateProjects,deleteProjects,deleteBatc
import Page from '@/components/Pagination/page.vue'
import ScenarioModel from '@/views/component/scenario/index.vue'
import Antvx6 from '@/components/antvx6/index.vue'
const apiUrl = import.meta.env.VITE_APP_BASE_API; //
const isShowAntvx6 = ref(false); //
const isScenario = ref(false) //
//
@ -150,7 +151,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择项目吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
@ -209,10 +210,13 @@ function closeAntvx6() {
<el-button type="primary" style="margin-left: 10px" @click="gettableData">搜索</el-button>
</div>
<div>
<el-button type="primary" @click="addClick">
<el-button type="primary" @click="addClick" style="margin-right: 10px">
新增</el-button>
<el-button :type="multipleSelection.length > 0 ? 'primary' : ''"
:disabled="multipleSelection.length <= 0" @click="delClick">删除</el-button>
<a :href=" apiUrl + '/projects/exportAllExports'" target="_blank" rel="noopener noreferrer">
<el-button type="primary">导出</el-button> </a>
<el-button type="primary"
:disabled="multipleSelection.length <= 0" @click="delClick" style="margin-left: 10px">删除</el-button>
</div>
</div>
<el-table v-loading="loading" :data="tableData" style="width: 100%; height: calc(100vh - 260px);margin-bottom: 10px;" border
@ -240,8 +244,11 @@ function closeAntvx6() {
<img src="@/assets/table/simulation.png" alt="" title="模拟分析"
@click="simulationClick(scope.row)"
style="cursor: pointer; ">
<a :href=" apiUrl + '/projects/' + scope.row.projectId + '/exportProject'" target="_blank" rel="noopener noreferrer">
<img src="@/assets/table/export.png" alt="" title="导出项目工程"
style="cursor: pointer; ">
</a>
<img src="@/assets/table/del.png" alt="" title="删除"
@click="delAloneClick(scope.row)" style="cursor: pointer; ">
</span>

View File

@ -109,8 +109,13 @@ function addSegmentation() { // 添加分段
end:null,
timeline:[]
})
}
}
function removeSegmentation(index:any){ //
menuList.value[menuIndex.value].segments.splice(index, 1);
segmentationIndex.value = 0
getTimelineList()
}
function removeAttr(index:any){ //
menuList.value[menuIndex.value].segments[segmentationIndex.value].timeline.splice(index, 1);
@ -129,7 +134,7 @@ function menuClick(index:any){ // 点击菜单切换
getTimelineList()
}
function addMenu(){ //
menuList.value.push({
menuList.value.unshift({
label: '条件' + (menuList.value.length + 1),
target:{
entityType: '',
@ -144,6 +149,7 @@ function addMenu(){ //添加导菜单
timeline:[]
}]
})
menuIndex.value = 0
}
@ -212,26 +218,6 @@ function changeMaterial(e:any){ // 设备属性改变时,清空变化物料
getDeviceInfo(e)
}
//
// async function DicInit() {
// let params = {
// dictId: 'dc7419e5f8a655966e6bb90b0cb5c0c2',
// size:99,
// current:1
// }
// const attributeResult = await getDictItemById(params)
// attributeData.value = attributeResult.data.records;
// let paramss = {
// dictId: '9d87f873bc80e79c6d399131cbe01016',
// size:99,
// current:1
// }
// const materialResult = await getDictItemById(paramss)
// materialData.value = materialResult.data.records;
// initConditionData()
// }
const devicename = ref('') //
const deviceMaterial = ref('') //
@ -239,14 +225,6 @@ const timelineList:any = ref([]) // 时间线数据
function getTimelineList(){
timelineList.value = []
// menuList.value.forEach((item:any) => {
// item.segments.forEach((segment:any) => {
// segment.timeline.forEach((timeline:any) => {
// console.log(timeline)
// timelineList.value.push(timeline)
// })
// })
// })
let item = menuList.value[menuIndex.value]
item.segments.forEach((segment:any) => {
segment.timeline.forEach((timeline:any) => {
@ -293,7 +271,7 @@ function getDeviceInfo(e:any){ // 获取设备信息
:class="{'condition-item-active': index == menuIndex}" @click="menuClick(index)">
{{ item.label }}
</div>
<img src="@/assets/add.png" v-if="isEdit == true" alt="" class="condition-img" @click="addMenu">
<img src="@/assets/add.png" v-if="isEdit == true" alt="" class="condition-img" style="cursor: pointer;" @click="addMenu">
</div>
<el-form ref="infoForm" label-width="120px">
@ -312,7 +290,7 @@ function getDeviceInfo(e:any){ // 获取设备信息
</el-form-item>
<el-form-item label="变化物料" style="width: 49%;">
<el-select v-model="menuList[menuIndex].material" placeholder="请选择" style="width:100%;" clearable
:disabled="(menuList[menuIndex].attribute!='' && menuList[menuIndex].attribute!=null)|| isEdit == true" @change="changeMaterial">
:disabled="(menuList[menuIndex].attribute!='' && menuList[menuIndex].attribute!=null)|| isEdit == false" @change="changeMaterial">
<el-option v-for="item in materialData" :key="item.itemCode" :label="item.dictName" :value="item.itemCode" />
</el-select>
</el-form-item>
@ -321,7 +299,9 @@ function getDeviceInfo(e:any){ // 获取设备信息
<div v-for="(item, index) in menuList[menuIndex].segments" :key="index" class="segmentation-item"
:class="{'segmentation-item-active': index == segmentationIndex}" @click="segmentationIndex = index">
<span>{{ item.segmentId }}</span>
<svg v-if="isEdit == true" t="1766969938271" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4998" width="14" height="14"><path d="M571.01312 523.776l311.3472-311.35232c15.7184-15.71328 15.7184-41.6256 0-57.344l-1.69472-1.69984c-15.7184-15.71328-41.6256-15.71328-57.34912 0l-311.3472 311.77728-311.35232-311.77728c-15.7184-15.71328-41.63072-15.71328-57.344 0l-1.69984 1.69984a40.0128 40.0128 0 0 0 0 57.344L452.92544 523.776l-311.35232 311.35744c-15.71328 15.71328-15.71328 41.63072 0 57.33888l1.69984 1.69984c15.71328 15.7184 41.6256 15.7184 57.344 0l311.35232-311.35232 311.3472 311.35232c15.72352 15.7184 41.63072 15.7184 57.34912 0l1.69472-1.69984c15.7184-15.70816 15.7184-41.6256 0-57.33888l-311.3472-311.35744z" p-id="4999" fill="currentColor"></path></svg>
<svg v-if="isEdit == true && menuList[menuIndex].segments.length > 1"
@click.top="removeSegmentation(index)"
t="1766969938271" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4998" width="14" height="14"><path d="M571.01312 523.776l311.3472-311.35232c15.7184-15.71328 15.7184-41.6256 0-57.344l-1.69472-1.69984c-15.7184-15.71328-41.6256-15.71328-57.34912 0l-311.3472 311.77728-311.35232-311.77728c-15.7184-15.71328-41.63072-15.71328-57.344 0l-1.69984 1.69984a40.0128 40.0128 0 0 0 0 57.344L452.92544 523.776l-311.35232 311.35744c-15.71328 15.71328-15.71328 41.63072 0 57.33888l1.69984 1.69984c15.71328 15.7184 41.6256 15.7184 57.344 0l311.35232-311.35232 311.3472 311.35232c15.72352 15.7184 41.63072 15.7184 57.34912 0l1.69472-1.69984c15.7184-15.70816 15.7184-41.6256 0-57.33888l-311.3472-311.35744z" p-id="4999" fill="currentColor"></path></svg>
</div>
<div class="segmentation-item-add" @click="addSegmentation" v-if="isEdit == true">
+ 新增分段

View File

@ -9,7 +9,7 @@ import { onMounted, ref, nextTick } from "vue";
import { ElForm, ElMessage, ElMessageBox } from "element-plus";
import { getDictItemById } from '@/api/dict';
import { eventsBatchSave } from '@/api/business/event';
import ConditionModel from '@/views/component/scenario/condition.vue'
import ConditionModels from '@/views/component/scenario/condition.vue'
import { addScenarios,updateScenarios,getActiveAlgorithms } from "@/api/business/scenario";
const emit = defineEmits([ 'closeCreatescenario']);
@ -152,7 +152,7 @@ onMounted(() => {
<el-input type="textarea" v-model="info.description" :rows="6" style="width: 100%" placeholder="请输入事故情景描述"></el-input>
</el-form-item>
</el-form>
<ConditionModel v-if="stepsActive == 1" ref="conditionModel" :projectInfo="projectInfo" :scenarioId="scenarioId" />
<ConditionModels v-if="stepsActive == 1" ref="conditionModel" :projectInfo="projectInfo" :scenarioId="scenarioId" :isEdit="true"/>
</div>
<div style="text-align: center;">
<el-button v-if="stepsActive == 0" type="primary" @click="confirmClick(infoForm)">下一步</el-button>

View File

@ -143,7 +143,7 @@ function delAloneClick(row: any) {
//
function delClick() {
ElMessageBox.confirm("确定删除已选择角色吗?", "删除提示", {
ElMessageBox.confirm("确定删除已选择事故情景吗?", "删除提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
@ -406,8 +406,10 @@ function changeShowResult(isShow:boolean){ // 切换显示结果模型
@click="resultClick(scope.row)" style="cursor: pointer; ">
<img src="@/assets/table/result_disabled.png" alt="" title="计算结果" v-if="scope.row.status != 2">
<img src="@/assets/table/del.png" alt="" title="删除"
<img src="@/assets/table/del.png" alt="" title="删除" v-if="scope.row.status == 0"
@click="delAloneClick(scope.row)" style="cursor: pointer; ">
<img v-else src="@/assets/table/del_disabled.png" alt="" title="删除"
>
</span>
</template>
</el-table-column>