panbaolin/SourceTermAnalysisSystem_vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

输运模拟、天气预报、源项重建运行日志，以及输运模拟生成GIF日志统一样式

Browse Source
This commit is contained in:
冯少康 2026-07-31 17:53:47 +08:00
parent b1444157ac
commit af3ac25fef
11 changed files with 1229 additions and 771 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/assets/css/content.css
View File

@ -8,7 +8,7 @@
z-index: 1;
color: #fff;
pointer-events: none;
user-select: none;
/* user-select: none; */
* {
pointer-events: auto;

2
src/assets/css/ele.css
View File

@ -154,7 +154,7 @@
background: red !important;
}
:deep(.el-popper.is-dark > :first-child) {
user-select: none !important;
/* user-select: none !important; */
}
.my-loading {

105
src/layout/Container/mapRightMenu.vue
View File

@ -7,8 +7,13 @@ import { mapRightMenuEvent } from "@/gis/ol/olRightMenu";
import { getGif } from "@/utils/axios/symn";
import { useI18n } from "vue-i18n";
import { ElMessage } from "element-plus";
import log from '@/pages/symn/log/index.vue';
import { getrwssGifFileData, downGifSsFile,getRwscGifFileGcrz } from "@/utils/axios/fskjk";
import {
getrwssGifFileData,
downGifSsFile,
getRwscGifFileGcrz,
} from "@/utils/axios/fskjk";
const { t } = useI18n();
@ -231,12 +236,12 @@ function handleIconClick(item: MapControlItem) {
// 处理gif
else if (item.name === "gif") {
let taskId = JSON.parse(sessionStorage.getItem("ssmnDataItem")).id;
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId"))||"";
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId")) || "";
getGif(
{
taskId,
genGifType: "global",
speciesId
speciesId,
},
(res: any) => {
gifSrc.value = window.FSXConfig.VUE_APP_SERVER_IP + res;
@ -289,7 +294,7 @@ function switchIconActive(key: string, falg: boolean) {
// 查询任务所属GIF文件地址
const generateGif = () => {
let taskId = JSON.parse(sessionStorage.getItem("ssmnDataItem")).id;
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId"))||"";
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId")) || "";
getrwssGifFileData(
{
taskId,
@ -308,7 +313,7 @@ const generateGif = () => {
// 下载任务所属GIF文件
const downGifFile = () => {
let taskId = JSON.parse(sessionStorage.getItem("ssmnDataItem")).id;
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId"))||"";
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId")) || "";
downGifSsFile(
{
taskId,
@ -333,22 +338,22 @@ const downGifFile = () => {
};
// 查看日志
const viewLogs = ()=>{
const viewLogs = () => {
viewLogsDialog.value = true;
let taskId = JSON.parse(sessionStorage.getItem("ssmnDataItem")).id;
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId"))||"";
let speciesId = JSON.parse(sessionStorage.getItem("symnZxHsId")) || "";
getRwscGifFileGcrz(
{
taskId,
speciesId,
},
(res: any) => {
console.log(res,222222222);
console.log(res, 222222222);
gifRzGroupValue.value = res.result;
}
);
}
};
onMounted(() => {
// 判断当前是否处于全屏状态
svgList.value[0].isActive = domFullscreenStatus();
@ -489,60 +494,44 @@ onMounted(() => {
<el-input v-model="gifFormData.maxLat" />
</el-form-item>
</el-col>
<el-col :span="2"
>
<el-button @click="generateGif" type="primary" class="custom-btn" >生成GIF</el-button></el-col
<el-col :span="2">
<el-button @click="generateGif" type="primary" class="custom-btn"
>生成GIF</el-button
></el-col
>
<el-col :span="2"
><el-button @click="viewLogs" type="primary" class="custom-btn"
>查看日志</el-button
></el-col
>
<el-col :span="2"><el-button @click="viewLogs" type="primary" class="custom-btn" >查看日志</el-button></el-col>
</el-row>
</el-form>
<img
v-if="isShowGif"
:src="gifSrc"
alt="GIF"
style="width: 100%"
/>
<el-row
:gutter="12"
style="margin-top: 10px; display: flex; justify-content: flex-end"
>
<el-col :span="16"></el-col>
<el-col :span="4" style="display: flex; align-items: center">
<span style="width: 35px; margin-right: 5px; color: #ade6ee">类型</span>
<img v-if="isShowGif" :src="gifSrc" alt="GIF" style="width: 100%" />
<div style="width: 100%; display: flex; justify-content: flex-end;margin-top: 15px;">
<div style="width: 25%;display: flex;padding-right: 10px;">
<el-select
v-model="downTypeValue"
:options="downTypeOptions"
:props="props"
placeholder="选择类型"
/>
</el-col>
<el-col :span="2">
<el-button :disabled="!downTypeValue" @click="downGifFile"
type="primary" class="custom-btn" >下载</el-button
<el-button
:disabled="!downTypeValue"
@click="downGifFile"
type="primary"
class="custom-btn"
style="margin-left: 10px;"
>下载</el-button
>
</el-col>
</el-row>
<!-- <a v-if="gifSrc" :href="gifSrc" download="gif" class="download-icon">
<el-icon size="20"><Download /></el-icon>
</a> -->
</Dialog>
<Dialog
v-model="viewLogsDialog"
title="GIF日志"
width="1340"
class="config-dialog"
style="min-height: 120px"
@close="viewLogsDialog = false"
>
<div class="gif-rztext">
<li v-for="(item,index) in gifRzGroupValue" :key="index">{{item.createTime}}&nbsp;&nbsp;&nbsp;&nbsp;{{item.logContent}}</li>
<li v-for="(item,index) in gifRzGroupValue" :key="index">{{item.createTime}}&nbsp;&nbsp;&nbsp;&nbsp;{{item.logContent}}</li>
<li v-for="(item,index) in gifRzGroupValue" :key="index">{{item.createTime}}&nbsp;&nbsp;&nbsp;&nbsp;{{item.logContent}}</li>
</div>
</div>
</Dialog>
<!-- 运行日志弹窗 -->
<Dialog v-model="viewLogsDialog" :title="t('operationLog')" width="56vw">
<log :data="gifRzGroupValue" />
</Dialog>
</template>
<style lang="less" scoped>
@ -614,18 +603,18 @@ onMounted(() => {
}
}
.gif-rztext{
.gif-rztext {
max-height: 400px;
overflow: auto;
}
.custom-btn {
background-color: #1397a3;
border-color: #1397a3;
color: #fff;
background-color: #1397a3;
border-color: #1397a3;
color: #fff;
&:hover {
background-color: #185c5c;
border-color: #4ac1c1;
}
&:hover {
background-color: #185c5c;
border-color: #4ac1c1;
}
}
</style>

3
src/locales/language/zh.json
View File

@ -275,6 +275,7 @@
"ImportMonitoringData": "导入监测数据",
"pinToTop": "置顶",
"unpin": "取消置顶",
"executeAssociation":"执行关联"
"executeAssociation":"执行关联",
"sampleLevel":"样品级别"
}

2
src/pages/largeScreen1/dataAnalysis.vue
View File

@ -205,7 +205,7 @@ defineExpose({
z-index: 10;
background: rgb(7, 39, 43);
border: 1px solid #0b8c82;
user-select: none;
/* user-select: none; */
}
.tab-bar span {

2
src/pages/largeScreen1/stackChart.vue
View File

@ -231,7 +231,7 @@ defineExpose({
z-index: 10;
background: rgb(7, 39, 43);
border: 1px solid #0b8c82;
user-select: none;
/* user-select: none; */
}
.tab-bar span {

2
src/pages/sjfx/one/index.vue
View File

@ -662,7 +662,7 @@ onUnmounted(() => {
display: flex;
justify-content: center;
align-items: center;
user-select: none;
// user-select: none;
}
.runBtn {

51
src/pages/sjfx/two/index.vue
View File

@ -36,7 +36,6 @@ function getStation() {
value: item.stationId,
};
});
console.log(res, 'res');
});
}
const barData = ref<any>({
@ -72,7 +71,6 @@ const rules = {
function setTime(val: any[]) {
form.value.startDate = val[0];
form.value.endDate = val[1];
console.log(val);
}
function handleSearch() {
getList();
@ -83,9 +81,8 @@ function getList() {
return;
formEl.validate((valid, fields) => {
if (valid) {
form.value.stationIds = [form.value.station]
form.value.stationIds = [...form.value.station]
getSampleGrade(form.value, (res) => {
console.log(res, 'res');
const list = res.result?.sampleDataList;
if (!list || list.length === 0) {
barData.value = {
@ -106,7 +103,8 @@ function getList() {
default: '#c2c2c2',
};
// 1. 提取所有唯一的时间点（包含 category 为 null 的时间）
// 确保 X 轴的时间顺序是完整的
// 确保 X 轴的时间顺序是完整的,将时间去重后按从小到大排列
// Array.from作用，将类数组转化为数组
const allTimes = Array.from(new Set(list.map((item: { collectStop: any }) => item.collectStop)))
.sort((a, b) => new Date(a) - new Date(b));
@ -116,11 +114,15 @@ function getList() {
.map((item: { category: any }) => item.category),
)).sort((a, b) => a - b);
// 3. 按时间对数据进行分组
// 3. 按时间对数据进行分组，创建新的Map
const groupMap = new Map();
// 遍历原数组list
list.forEach((item: { collectStop: any }) => {
// 判断Map中是否不存在当前时间key
if (!groupMap.has(item.collectStop))
// 如果不存在就新建key，值为空数组
groupMap.set(item.collectStop, []);
// 根据key去除数组，将当前的值推入数组中
groupMap.get(item.collectStop).push(item);
});
@ -161,19 +163,16 @@ function getList() {
barData.value.xAxisData = allTimes;
barData.value.seriesData = seriesList;
barData.value.legendData = validCategories.map(cat => `等级 ${cat}`);
console.log('处理后的数据:', barData.value);
renderChart();
});
}
// else {
// console.log('表单验证失败:', fields);
// ElMessage.error('搜索信息未填写');
// }
});
}
function renderChart() {
if (!barData.value || !barData.value.seriesData || barData.value.seriesData.length === 0) {
console.warn('数据异常');
return;
}
const option = {
@ -384,18 +383,18 @@ onMounted(async () => {
<div class="sjfx-two-content">
<div class="head">
<el-form ref="formRef" :model="form" label-width="80px" class="queryForm" :rules="rules">
<el-row :gutter="10">
<el-col :span="4">
<el-form-item :label="t('dataSource')" prop="dataSource">
<!-- <el-row :gutter="10"> -->
<!-- <el-col :span="5"> -->
<el-form-item :label="t('dataSource')" prop="dataSource" style="width: 270px;">
<el-select v-model="form.dataSource" :placeholder="t('pleaseSelect')" style="width: 300px;">
<el-option v-for="item in dataSourceList" :key="item.value"
style="background-color: transparent; height: 30px;color: #fff;" :label="item.label"
:value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="t('sampleType')" prop="sampleType">
<!-- </el-col> -->
<!-- <el-col :span="4"> -->
<el-form-item :label="t('sampleType')" prop="sampleType" style="width: 250px;">
<el-select v-model="form.sampleType" :placeholder="t('pleaseSelect')" style="width: 100%;"
popper-style="background-color: transparent;border: solid 1px #0da397;width:100px;overflow: hidden;border-radius: 0;"
@change="handleSampleTypeChange">
@ -404,13 +403,13 @@ onMounted(async () => {
:value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="t('stationName')" prop="station">
<el-select-v2 v-model="form.station" :placeholder="t('pleaseSelect')" style="width: 160px;" filterable
<!-- </el-col> -->
<!-- <el-col :span="5"> -->
<el-form-item :label="t('stationName')" prop="station" style="width: 250px;">
<el-select-v2 v-model="form.station" :placeholder="t('pleaseSelect')" filterable multiple collapse-tags collapse-tags-tooltip
:options="stationList" clearable />
</el-form-item>
</el-col>
<!-- </el-col> -->
<!-- <el-col :span="3">
<el-form-item :label="t('nuclideName')">
<el-input v-model="form.nuclideName" style="width: 100%;" />
@ -418,21 +417,21 @@ onMounted(async () => {
</el-col> -->
<el-col :span="7">
<!-- <el-col :span="6"> -->
<el-form-item :label="t('createTime')" prop="createTime">
<el-date-picker v-model="form.createTime" type="daterange" :default-time="new Date()" style="width: 100%;"
range-separator="--" :start-placeholder="t('startDate')" :end-placeholder="t('endDate')"
value-format="YYYY-MM-DD" @change="setTime" />
</el-form-item>
</el-col>
<el-col :span="2">
<!-- </el-col> -->
<!-- <el-col :span="2"> -->
<el-form-item>
<el-button :icon="Search" @click="handleSearch">
{{ t('refresh') }}
</el-button>
</el-form-item>
</el-col>
</el-row>
<!-- </el-col> -->
<!-- </el-row> -->
</el-form>
</div>
<div class="echars">
@ -556,7 +555,7 @@ onMounted(async () => {
.chart-container {
width: 100%;
height: 800px;
height: 780px;
}
}
</style>

1822
src/pages/symn/index.vue
View File

File diff suppressed because it is too large Load Diff

7
src/pages/tqybjs/tab-1/index.vue
View File

@ -6,8 +6,7 @@ import SparkMD5 from 'spark-md5';
import { set } from 'vue'; // 引入 Vue 的 set 方法
import { useI18n } from 'vue-i18n';
import { add, deleteData, edit, getData, getTaskLog, resume, pinToTopOrUnpin } from '@/utils/axios/tqyb/task';
import log from '../log/index.vue';
import log from '@/pages/symn/log/index.vue';
const emit = defineEmits(['playback']);
const { t } = useI18n();
const upload = ref<UploadInstance>();
@ -278,9 +277,7 @@ function refresh() {
}
function showLog(task: any) {
console.log('显示运行日志');
getTaskLog({ taskId: task.id }, (res) => {
console.log('res', res);
logData.value = res;
logVisible.value = true;
});
@ -406,7 +403,7 @@ getList();
<template>
<div class="ycrw">
<Dialog v-model="logVisible" :title="t('operationLog')" width="56vw" class="child-custom" style="top:230px;left:22vw">
<Dialog v-model="logVisible" :title="t('operationLog')" width="56vw" class="child-custom" style="top:50%;left:50%;transform: translate(-50%, -50%);">
<log :data="logData" />
</Dialog>

2
src/pages/yxcj/index.vue
View File

@ -9,7 +9,7 @@ import { createTask, deleteTask as deleteData, exportAcTimeSeriesTxt, exportBaye
import { transformLogData } from '@/utils/index';
import { exportCharts } from '@/utils/index'; // 下载图表图片
import scatter from './dbvarScatter/index.vue';
import log from './log/index.vue';
import log from '@/pages/symn/log/index.vue';
import monOrAna from './monitOrAnalog/index.vue';
import varBan from './univarBan/index.vue';