feat(steady): 实现稳态校验任务功能重构
- 添加influxdb配置支持和资源文件打包 - 实现校验任务表格组件和相关工具函数 - 重构校验工作台为任务创建对话框模式 - 实现校验详情面板支持多种异常类型展示 - 更新校验概览表格显示任务基本信息 - 优化校验查询参数和API接口定义 - 实现搜索表单组件化和过滤功能增强
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
@echo off
|
||||
cd /d "%~dp0"
|
||||
influxd.exe -config "%~dp0influxdb.conf"
|
||||
pause
|
||||
set "CONFIG_FILE=%~1"
|
||||
if "%CONFIG_FILE%"=="" set "CONFIG_FILE=%~dp0influxdb.conf"
|
||||
influxd.exe -config "%CONFIG_FILE%"
|
||||
|
||||
@@ -95,6 +95,13 @@ qr:
|
||||
db:
|
||||
type: mysql
|
||||
|
||||
steady:
|
||||
influxdb:
|
||||
url: http://127.0.0.1:{{INFLUXDB_PORT}}
|
||||
database: pqsbase
|
||||
username:
|
||||
password:
|
||||
|
||||
|
||||
# 比对录波需要的配置,晚点再做优化
|
||||
# 系统配置
|
||||
|
||||
@@ -48,6 +48,11 @@
|
||||
"to": "mysql",
|
||||
"filter": ["**/*"]
|
||||
},
|
||||
{
|
||||
"from": "build/extraResources/influxdb-1.7.0",
|
||||
"to": "influxdb-1.7.0",
|
||||
"filter": ["**/*"]
|
||||
},
|
||||
{
|
||||
"from": "build/extraResources/jre",
|
||||
"to": "jre",
|
||||
|
||||
@@ -11,23 +11,19 @@ const { app } = require('electron');
|
||||
function getScriptsPath(scriptName) {
|
||||
const fs = require('fs');
|
||||
|
||||
// 判断是否是打包后的环境
|
||||
// 只要 process.resourcesPath 存在,就是打包后的环境(无论在哪个目录)
|
||||
const isProd = !!process.resourcesPath;
|
||||
|
||||
if (isProd) {
|
||||
// 生产环境(打包后):从 resources 目录
|
||||
if (process.resourcesPath) {
|
||||
const prodPath = path.join(process.resourcesPath, 'scripts', scriptName);
|
||||
const prodFile = `${prodPath}.js`;
|
||||
if (fs.existsSync(prodFile)) {
|
||||
console.log(`[getScriptsPath] Production mode, using: ${prodPath}`);
|
||||
return prodPath;
|
||||
} else {
|
||||
// 开发环境:从项目根目录
|
||||
// __dirname 是 electron/preload 或 public/electron/preload
|
||||
// 需要找到项目根目录
|
||||
}
|
||||
}
|
||||
|
||||
// 开发环境:从项目根目录向上查找 scripts 目录,避免误用 Electron 安装目录 resources。
|
||||
let currentDir = __dirname;
|
||||
let scriptsPath = null;
|
||||
|
||||
// 向上查找,直到找到 scripts 目录
|
||||
for (let i = 0; i < 5; i++) {
|
||||
currentDir = path.join(currentDir, '..');
|
||||
const testPath = path.join(currentDir, 'scripts', scriptName + '.js');
|
||||
@@ -38,18 +34,17 @@ function getScriptsPath(scriptName) {
|
||||
}
|
||||
}
|
||||
|
||||
// 如果找不到,返回一个默认路径
|
||||
console.warn(`[getScriptsPath] Cannot find ${scriptName}, returning default path`);
|
||||
return path.join(__dirname, '../../../scripts', scriptName);
|
||||
}
|
||||
}
|
||||
|
||||
// 延迟加载 scripts
|
||||
let MySQLProcessManager, JavaRunner, ConfigGenerator, PortChecker, StartupManager, LogWindowManager;
|
||||
let MySQLProcessManager, InfluxDBProcessManager, JavaRunner, ConfigGenerator, PortChecker, StartupManager, LogWindowManager;
|
||||
|
||||
function loadScripts() {
|
||||
if (!MySQLProcessManager) {
|
||||
MySQLProcessManager = require(getScriptsPath('mysql-process-manager'));
|
||||
InfluxDBProcessManager = require(getScriptsPath('influxdb-process-manager'));
|
||||
JavaRunner = require(getScriptsPath('java-runner'));
|
||||
ConfigGenerator = require(getScriptsPath('config-generator'));
|
||||
PortChecker = require(getScriptsPath('port-checker'));
|
||||
@@ -61,10 +56,12 @@ function loadScripts() {
|
||||
class Lifecycle {
|
||||
constructor() {
|
||||
this.mysqlProcessManager = null;
|
||||
this.influxdbProcessManager = null;
|
||||
this.javaRunner = null;
|
||||
this.startupManager = null;
|
||||
this.logWindowManager = null;
|
||||
this.mysqlPort = null;
|
||||
this.influxdbPort = null;
|
||||
this.javaPort = null;
|
||||
this.autoRefreshTimer = null;
|
||||
}
|
||||
@@ -124,9 +121,38 @@ class Lifecycle {
|
||||
}
|
||||
}
|
||||
|
||||
// InfluxDB 用于稳态趋势、补数等时序数据能力,必须早于后端服务启动。
|
||||
this.logWindowManager.addLog('system', '▶ 步骤7: 启动 InfluxDB 进程管理器...');
|
||||
this.startupManager.updateProgress('check-influxdb-port', { mysqlPort: this.mysqlPort });
|
||||
|
||||
this.influxdbProcessManager = new InfluxDBProcessManager(this.logWindowManager);
|
||||
this.logWindowManager.addLog('system', '正在检查 InfluxDB 进程状态...');
|
||||
|
||||
try {
|
||||
this.influxdbPort = await this.influxdbProcessManager.ensureServiceRunning(
|
||||
PortChecker.findAvailablePort.bind(PortChecker),
|
||||
PortChecker.waitForPort.bind(PortChecker)
|
||||
);
|
||||
|
||||
logger.info(`[lifecycle] InfluxDB process running on port: ${this.influxdbPort}`);
|
||||
this.logWindowManager.addLog('success', `✅ InfluxDB 服务已就绪,端口: ${this.influxdbPort}`);
|
||||
this.startupManager.updateProgress('wait-influxdb', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort
|
||||
});
|
||||
await this.sleep(500);
|
||||
} catch (error) {
|
||||
logger.error('[lifecycle] InfluxDB error:', error);
|
||||
this.logWindowManager.addLog('error', `InfluxDB 错误: ${error.message}`);
|
||||
throw error;
|
||||
}
|
||||
|
||||
// 步骤5: 检测 Java 端口
|
||||
this.logWindowManager.addLog('system', '▶ 步骤7: 检测可用的 Java 端口(从18093开始)...');
|
||||
this.startupManager.updateProgress('check-java-port', { mysqlPort: this.mysqlPort });
|
||||
this.logWindowManager.addLog('system', '▶ 步骤8: 检测可用的 Java 端口(从18093开始)...');
|
||||
this.startupManager.updateProgress('check-java-port', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort
|
||||
});
|
||||
|
||||
this.javaPort = await PortChecker.findAvailablePort(18093, 100);
|
||||
|
||||
@@ -136,7 +162,7 @@ class Lifecycle {
|
||||
}
|
||||
|
||||
// 步骤5.5: 检测 WebSocket 端口
|
||||
this.logWindowManager.addLog('system', '▶ 步骤8: 检测可用的 WebSocket 端口(从7778开始)...');
|
||||
this.logWindowManager.addLog('system', '▶ 步骤9: 检测可用的 WebSocket 端口(从7778开始)...');
|
||||
|
||||
this.websocketPort = await PortChecker.findAvailablePort(7778, 100);
|
||||
|
||||
@@ -161,14 +187,16 @@ class Lifecycle {
|
||||
logger.info(`[lifecycle] WebSocket will use port: ${this.websocketPort}`);
|
||||
this.startupManager.updateProgress('check-java-port', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort
|
||||
});
|
||||
await this.sleep(500);
|
||||
|
||||
// 步骤6: 生成配置文件
|
||||
this.logWindowManager.addLog('system', '▶ 步骤9: 生成 Spring Boot 配置文件...');
|
||||
this.logWindowManager.addLog('system', '▶ 步骤10: 生成 Spring Boot 配置文件...');
|
||||
this.startupManager.updateProgress('generate-config', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort,
|
||||
websocketPort: this.websocketPort
|
||||
});
|
||||
@@ -176,6 +204,7 @@ class Lifecycle {
|
||||
const configGenerator = new ConfigGenerator();
|
||||
const { configPath, dataPath } = await configGenerator.generateConfig({
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort,
|
||||
websocketPort: this.websocketPort,
|
||||
mysqlPassword: 'njcnpqs'
|
||||
@@ -194,9 +223,10 @@ class Lifecycle {
|
||||
await this.sleep(500);
|
||||
|
||||
// 步骤7: 启动 Spring Boot
|
||||
this.logWindowManager.addLog('system', '▶ 步骤10: 启动 Spring Boot 应用...');
|
||||
this.logWindowManager.addLog('system', '▶ 步骤11: 启动 Spring Boot 应用...');
|
||||
this.startupManager.updateProgress('start-java', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort,
|
||||
dataPath: dataPath
|
||||
});
|
||||
@@ -204,9 +234,10 @@ class Lifecycle {
|
||||
await this.startSpringBoot(configPath, dataPath);
|
||||
|
||||
// 步骤8: 等待 Spring Boot 就绪
|
||||
this.logWindowManager.addLog('system', '▶ 步骤11: 等待 Spring Boot 就绪(最多60秒)...');
|
||||
this.logWindowManager.addLog('system', '▶ 步骤12: 等待 Spring Boot 就绪(最多60秒)...');
|
||||
this.startupManager.updateProgress('wait-java', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort,
|
||||
dataPath: dataPath
|
||||
});
|
||||
@@ -224,9 +255,10 @@ class Lifecycle {
|
||||
await this.sleep(1000);
|
||||
|
||||
// 步骤9: 完成
|
||||
this.logWindowManager.addLog('system', '▶ 步骤12: 启动完成,准备显示主窗口...');
|
||||
this.logWindowManager.addLog('system', '▶ 步骤13: 启动完成,准备显示主窗口...');
|
||||
this.startupManager.updateProgress('done', {
|
||||
mysqlPort: this.mysqlPort,
|
||||
influxdbPort: this.influxdbPort,
|
||||
javaPort: this.javaPort,
|
||||
dataPath: dataPath
|
||||
});
|
||||
@@ -235,6 +267,7 @@ class Lifecycle {
|
||||
this.logWindowManager.addLog('system', '='.repeat(60));
|
||||
this.logWindowManager.addLog('success', '✓ 电能质量运维工具 启动完成!所有服务正常运行');
|
||||
this.logWindowManager.addLog('system', `✓ MySQL 端口: ${this.mysqlPort}`);
|
||||
this.logWindowManager.addLog('system', `✓ InfluxDB 端口: ${this.influxdbPort}`);
|
||||
this.logWindowManager.addLog('system', `✓ Java 端口: ${this.javaPort}`);
|
||||
this.logWindowManager.addLog('system', `✓ WebSocket 端口: ${this.websocketPort}`);
|
||||
this.logWindowManager.addLog('system', `✓ 数据目录: ${dataPath}`);
|
||||
@@ -375,7 +408,26 @@ class Lifecycle {
|
||||
}
|
||||
}
|
||||
|
||||
// 停止 MySQL 进程(进程模式)
|
||||
// 停止数据库进程(进程模式)
|
||||
// InfluxDB 只清理当前应用记录的 PID,避免影响用户本机其他 InfluxDB 实例。
|
||||
if (this.influxdbProcessManager) {
|
||||
try {
|
||||
logger.info('[lifecycle] Stopping InfluxDB process...');
|
||||
if (this.logWindowManager && this.logWindowManager.logWindow && !this.logWindowManager.logWindow.isDestroyed()) {
|
||||
this.logWindowManager.addLog('system', '正在停止 InfluxDB...');
|
||||
}
|
||||
|
||||
await this.influxdbProcessManager.stopInfluxDBProcess();
|
||||
|
||||
logger.info('[lifecycle] InfluxDB process stopped');
|
||||
if (this.logWindowManager && this.logWindowManager.logWindow && !this.logWindowManager.logWindow.isDestroyed()) {
|
||||
this.logWindowManager.addLog('success', 'InfluxDB 已停止');
|
||||
}
|
||||
} catch (error) {
|
||||
logger.error('[lifecycle] Failed to stop InfluxDB:', error);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.mysqlProcessManager) {
|
||||
try {
|
||||
logger.info('[lifecycle] Stopping MySQL process...');
|
||||
@@ -427,12 +479,11 @@ class Lifecycle {
|
||||
// 启动Java应用
|
||||
this.javaRunner = new JavaRunner();
|
||||
|
||||
// 开发环境:build/extraResources/java/entrance.jar
|
||||
// 打包后:resources/extraResources/java/entrance.jar
|
||||
const isDev = !process.resourcesPath;
|
||||
const jarPath = isDev
|
||||
? path.join(__dirname, '..', 'build', 'extraResources', 'java', 'entrance.jar')
|
||||
: path.join(process.resourcesPath, 'extraResources', 'java', 'entrance.jar');
|
||||
const { resolvePackagedRuntime } = require(getScriptsPath('path-utils'));
|
||||
const runtime = resolvePackagedRuntime();
|
||||
const jarPath = runtime.isPackaged
|
||||
? path.join(runtime.resourcesPath, 'extraResources', 'java', 'entrance.jar')
|
||||
: path.join(runtime.baseDir, 'build', 'extraResources', 'java', 'entrance.jar');
|
||||
|
||||
const logPath = path.join(dataPath, 'logs');
|
||||
|
||||
|
||||
@@ -17,8 +17,24 @@ export const querySteadyTrendDay = (params: SteadyDataView.SteadyTrendQueryParam
|
||||
return http.post<SteadyDataView.SteadyTrendQueryResult>('/steady/data-view/trend/day', params, { loading: false })
|
||||
}
|
||||
|
||||
export const querySteadyChecksquare = (params: SteadyDataView.SteadyChecksquareQueryParams) => {
|
||||
return http.post<SteadyDataView.SteadyChecksquareQueryResult>('/steady/data-view/checksquare/query', params, {
|
||||
export const querySteadyChecksquareTasks = (params: SteadyDataView.SteadyChecksquareTaskQueryParams) => {
|
||||
return http.post<SteadyDataView.PageResult<SteadyDataView.SteadyChecksquareTask>>('/steady/data-view/checksquare/query', params, {
|
||||
loading: false
|
||||
})
|
||||
}
|
||||
|
||||
export const createSteadyChecksquareTask = (params: SteadyDataView.SteadyChecksquareCreateParams) => {
|
||||
return http.post<SteadyDataView.SteadyChecksquareCreateResult>('/steady/data-view/checksquare/create', params, {
|
||||
loading: false
|
||||
})
|
||||
}
|
||||
|
||||
export const getSteadyChecksquareDetail = (taskId: string) => {
|
||||
return http.get<SteadyDataView.SteadyChecksquareQueryResult>('/steady/data-view/checksquare/detail', { taskId }, { loading: false })
|
||||
}
|
||||
|
||||
export const getSteadyChecksquareItemDetail = (params: SteadyDataView.SteadyChecksquareItemDetailParams) => {
|
||||
return http.get<SteadyDataView.SteadyChecksquareItemDetail>('/steady/data-view/checksquare/item-detail', params, {
|
||||
loading: false
|
||||
})
|
||||
}
|
||||
|
||||
@@ -1,4 +1,12 @@
|
||||
export namespace SteadyDataView {
|
||||
export interface PageResult<T> {
|
||||
records: T[]
|
||||
current: number
|
||||
size: number
|
||||
total: number
|
||||
pages?: number
|
||||
}
|
||||
|
||||
export interface SteadyLedgerNode {
|
||||
id: string
|
||||
parentId?: string
|
||||
@@ -77,18 +85,56 @@ export namespace SteadyDataView {
|
||||
series: SteadyTrendSeries[]
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareQueryParams {
|
||||
export interface SteadyChecksquareTaskQueryParams {
|
||||
pageNum?: number
|
||||
pageSize?: number
|
||||
lineId?: string
|
||||
lineName?: string
|
||||
indicatorCode?: string
|
||||
timeStart?: string
|
||||
timeEnd?: string
|
||||
hasAbnormal?: boolean
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareCreateParams {
|
||||
lineId: string
|
||||
indicatorCodes: string[]
|
||||
timeStart: string
|
||||
timeEnd: string
|
||||
harmonicOrders?: number[]
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareTask {
|
||||
taskId: string
|
||||
taskNo?: string
|
||||
lineId?: string
|
||||
lineName?: string
|
||||
timeStart?: string
|
||||
timeEnd?: string
|
||||
intervalMinutes?: number
|
||||
taskStatus?: 'SUCCESS' | string
|
||||
itemCount?: number
|
||||
abnormalItemCount?: number
|
||||
maxMissingRate?: number | null
|
||||
createTime?: string
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareCreateResult {
|
||||
taskId: string
|
||||
taskNo?: string
|
||||
lineId?: string
|
||||
lineName?: string
|
||||
timeStart?: string
|
||||
timeEnd?: string
|
||||
intervalMinutes?: number
|
||||
itemCount?: number
|
||||
abnormalItemCount?: number
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareSegment {
|
||||
startTime: string
|
||||
endTime: string
|
||||
status: 'NORMAL' | 'MISSING' | string
|
||||
harmonicOrder?: number | null
|
||||
missingPointCount?: number
|
||||
durationMinutes?: number
|
||||
}
|
||||
@@ -112,6 +158,7 @@ export namespace SteadyDataView {
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareItem {
|
||||
itemId?: string
|
||||
itemKey: string
|
||||
indicatorCode: string
|
||||
indicatorName?: string
|
||||
@@ -123,12 +170,18 @@ export namespace SteadyDataView {
|
||||
missingRate?: number | null
|
||||
missingRateText?: string | null
|
||||
maxContinuousMissingMinutes?: number
|
||||
abnormal?: boolean
|
||||
abnormalPointCount?: number
|
||||
harmonicParityAbnormal?: boolean
|
||||
harmonicParityAbnormalPointCount?: number
|
||||
statSummaries: SteadyChecksquareStatSummary[]
|
||||
statDetails: SteadyChecksquareStatDetail[]
|
||||
children?: SteadyChecksquareItem[]
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareQueryResult {
|
||||
taskId?: string
|
||||
taskNo?: string
|
||||
lineId: string
|
||||
lineName?: string
|
||||
timeStart: string
|
||||
@@ -136,4 +189,48 @@ export namespace SteadyDataView {
|
||||
intervalMinutes?: number
|
||||
items: SteadyChecksquareItem[]
|
||||
}
|
||||
|
||||
export type SteadyChecksquareDetailType = 'SEGMENT' | 'VALUE_ORDER' | 'HARMONIC_PARITY'
|
||||
|
||||
export interface SteadyChecksquareItemDetailParams {
|
||||
itemId: string
|
||||
detailType: SteadyChecksquareDetailType
|
||||
statType?: SteadyTrendStatType
|
||||
pageNum?: number
|
||||
pageSize?: number
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareValueOrderDetail {
|
||||
time: string
|
||||
phase?: string
|
||||
harmonicOrder?: number | null
|
||||
maxValue?: number | null
|
||||
minValue?: number | null
|
||||
avgValue?: number | null
|
||||
cp95Value?: number | null
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareHarmonicParityDetail {
|
||||
time: string
|
||||
phase?: string
|
||||
statType?: SteadyTrendStatType
|
||||
evenHarmonicOrder?: number
|
||||
evenValue?: number | null
|
||||
oddHarmonicOrders?: number[]
|
||||
oddValues?: number[]
|
||||
oddMedianValue?: number | null
|
||||
thresholdMultiplier?: number | null
|
||||
}
|
||||
|
||||
export interface SteadyChecksquareItemDetail {
|
||||
itemId: string
|
||||
detailType: SteadyChecksquareDetailType
|
||||
statType?: SteadyTrendStatType | null
|
||||
pageNum?: number | null
|
||||
pageSize?: number | null
|
||||
total?: number | null
|
||||
segments: SteadyChecksquareSegment[]
|
||||
valueOrderDetails: SteadyChecksquareValueOrderDetail[]
|
||||
harmonicParityDetails: SteadyChecksquareHarmonicParityDetail[]
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang='ts' name='Grid'>
|
||||
import type { VNode, VNodeArrayChildren } from 'vue'
|
||||
import type { BreakPoint } from './interface/index'
|
||||
|
||||
type Props = {
|
||||
@@ -99,11 +100,12 @@ const findIndex = () => {
|
||||
}
|
||||
try {
|
||||
let find = false
|
||||
fields.reduce((prev = 0, current, index) => {
|
||||
fields.reduce((prev: number, current: unknown, index: number) => {
|
||||
prev +=
|
||||
((current as VNode)!.props![breakPoint.value]?.span ?? (current as VNode)!.props?.span ?? 1) +
|
||||
((current as VNode)!.props![breakPoint.value]?.offset ?? (current as VNode)!.props?.offset ?? 0)
|
||||
if (Number(prev) >= props.collapsedRows * gridCols.value - suffixCols) {
|
||||
// 刚好填满首行时仍应显示当前项,只有超过可用列数才进入折叠。
|
||||
if (Number(prev) > props.collapsedRows * gridCols.value - suffixCols) {
|
||||
hiddenIndex.value = index
|
||||
find = true
|
||||
throw 'find it'
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<component
|
||||
v-if="!column.search?.render"
|
||||
:is="column.search?.render ?? `el-${column.search?.el}`"
|
||||
v-bind="{ ...handleSearchProps, ...placeholder, searchParam: _searchParam, clearable }"
|
||||
v-model.trim="_searchParam[column.search?.key ?? handleProp(column.prop!)]"
|
||||
@@ -20,12 +21,19 @@
|
||||
</template>
|
||||
<slot v-else></slot>
|
||||
</component>
|
||||
<component
|
||||
v-else
|
||||
:is="column.search.render"
|
||||
v-bind="{ ...handleSearchProps, ...placeholder, searchParam: _searchParam, clearable }"
|
||||
:data="column.search?.el === 'tree-select' ? columnEnum : []"
|
||||
:options="['cascader', 'select-v2'].includes(column.search?.el!) ? columnEnum : []"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="SearchFormItem">
|
||||
import { computed, inject, ref } from "vue";
|
||||
import { handleProp } from "@/utils";
|
||||
import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import type { ColumnProps } from "@/components/ProTable/interface";
|
||||
|
||||
interface SearchFormItem {
|
||||
column: ColumnProps;
|
||||
|
||||
@@ -33,8 +33,8 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts' name='SearchForm'>
|
||||
import { ColumnProps } from '@/components/ProTable/interface'
|
||||
import { BreakPoint } from '@/components/Grid/interface'
|
||||
import type { ColumnProps } from '@/components/ProTable/interface'
|
||||
import type { BreakPoint } from '@/components/Grid/interface'
|
||||
import { Delete, Search, ArrowDown, ArrowUp } from '@element-plus/icons-vue'
|
||||
import SearchFormItem from './components/SearchFormItem.vue'
|
||||
import Grid from '@/components/Grid/index.vue'
|
||||
@@ -85,9 +85,9 @@ const showCollapse = computed(() => {
|
||||
(current.search![breakPoint.value]?.span ?? current.search?.span ?? 1) +
|
||||
(current.search![breakPoint.value]?.offset ?? current.search?.offset ?? 0)
|
||||
if (typeof props.searchCol !== 'number') {
|
||||
if (prev >= props.searchCol[breakPoint.value]) show = true
|
||||
if (prev > props.searchCol[breakPoint.value]) show = true
|
||||
} else {
|
||||
if (prev >= props.searchCol) show = true
|
||||
if (prev > props.searchCol) show = true
|
||||
}
|
||||
return prev
|
||||
}, 0)
|
||||
|
||||
@@ -2,14 +2,14 @@
|
||||
<section class="card checksquare-detail">
|
||||
<div class="detail-header">
|
||||
<div>
|
||||
<div class="section-title">连续性详情</div>
|
||||
<div class="section-title">检测项明细</div>
|
||||
<div class="section-description">
|
||||
{{ selectedItem ? resolveChecksquareRowName(selectedItem) : '请选择总览表中的指标' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-empty v-if="!selectedItem" description="请选择指标查看缺失区间" />
|
||||
<el-empty v-if="!selectedItem" description="请选择指标查看明细" />
|
||||
|
||||
<template v-else>
|
||||
<div class="stat-grid">
|
||||
@@ -19,12 +19,42 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-table class="segment-table" :data="segments" size="small" max-height="220" empty-text="暂无缺失区间">
|
||||
<div class="detail-toolbar">
|
||||
<el-radio-group v-model="detailType" @change="handleDetailTypeChange">
|
||||
<el-radio-button label="SEGMENT">缺数区间</el-radio-button>
|
||||
<el-radio-button label="VALUE_ORDER">值关系异常</el-radio-button>
|
||||
<el-radio-button label="HARMONIC_PARITY">谐波奇偶异常</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-select
|
||||
v-if="detailType === 'SEGMENT'"
|
||||
v-model="segmentStatType"
|
||||
class="stat-select"
|
||||
@change="handleSegmentStatTypeChange"
|
||||
>
|
||||
<el-option v-for="statType in CHECKSQUARE_STAT_TYPES" :key="statType" :label="formatChecksquareStatType(statType)" :value="statType" />
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-if="detailType === 'SEGMENT'"
|
||||
v-loading="loading"
|
||||
class="segment-table"
|
||||
:data="segments"
|
||||
size="small"
|
||||
max-height="300"
|
||||
empty-text="暂无缺数区间"
|
||||
>
|
||||
<el-table-column prop="statType" label="统计类型" width="96">
|
||||
<template #default="{ row }">{{ formatChecksquareStatType(row.statType) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="状态" width="90">
|
||||
<template #default="{ row }">{{ formatSegmentStatus(row.status) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="startTime" label="开始时间" min-width="160" />
|
||||
<el-table-column prop="endTime" label="结束时间" min-width="160" />
|
||||
<el-table-column prop="harmonicOrder" label="谐波次数" width="96" align="right">
|
||||
<template #default="{ row }">{{ row.harmonicOrder ?? '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="missingPointCount" label="缺失点数" width="100" align="right">
|
||||
<template #default="{ row }">{{ row.missingPointCount ?? '-' }}</template>
|
||||
</el-table-column>
|
||||
@@ -32,12 +62,68 @@
|
||||
<template #default="{ row }">{{ row.durationMinutes ?? '-' }}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-table
|
||||
v-else-if="detailType === 'VALUE_ORDER'"
|
||||
v-loading="loading"
|
||||
:data="itemDetail?.valueOrderDetails || []"
|
||||
size="small"
|
||||
max-height="300"
|
||||
empty-text="暂无值关系异常"
|
||||
>
|
||||
<el-table-column prop="time" label="时间" min-width="160" />
|
||||
<el-table-column prop="phase" label="相别" width="80" />
|
||||
<el-table-column prop="harmonicOrder" label="谐波次数" width="96" align="right">
|
||||
<template #default="{ row }">{{ row.harmonicOrder ?? '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="maxValue" label="最大值" min-width="100" align="right" />
|
||||
<el-table-column prop="cp95Value" label="CP95" min-width="100" align="right" />
|
||||
<el-table-column prop="avgValue" label="平均值" min-width="100" align="right" />
|
||||
<el-table-column prop="minValue" label="最小值" min-width="100" align="right" />
|
||||
</el-table>
|
||||
|
||||
<el-table
|
||||
v-else
|
||||
v-loading="loading"
|
||||
:data="itemDetail?.harmonicParityDetails || []"
|
||||
size="small"
|
||||
max-height="300"
|
||||
empty-text="暂无谐波奇偶异常"
|
||||
>
|
||||
<el-table-column prop="time" label="时间" min-width="160" />
|
||||
<el-table-column prop="phase" label="相别" width="80" />
|
||||
<el-table-column prop="statType" label="统计类型" width="100">
|
||||
<template #default="{ row }">{{ row.statType ? formatChecksquareStatType(row.statType) : '-' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="evenHarmonicOrder" label="偶次" width="80" align="right" />
|
||||
<el-table-column prop="evenValue" label="偶次值" min-width="100" align="right" />
|
||||
<el-table-column prop="oddHarmonicOrders" label="奇次" min-width="110">
|
||||
<template #default="{ row }">{{ formatDetailArray(row.oddHarmonicOrders) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="oddValues" label="奇次值" min-width="130">
|
||||
<template #default="{ row }">{{ formatDetailArray(row.oddValues) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="oddMedianValue" label="奇次中位值" min-width="120" align="right" />
|
||||
<el-table-column prop="thresholdMultiplier" label="阈值倍数" min-width="100" align="right" />
|
||||
</el-table>
|
||||
|
||||
<div v-if="showDetailPagination" class="detail-pagination">
|
||||
<el-pagination
|
||||
background
|
||||
layout="total, prev, pager, next"
|
||||
:current-page="detailPageNum"
|
||||
:page-size="DETAIL_PAGE_SIZE"
|
||||
:total="detailTotal"
|
||||
@current-change="handleDetailPageChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue'
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { getSteadyChecksquareItemDetail } from '@/api/steady/steadyDataView'
|
||||
import type { SteadyDataView } from '@/api/steady/steadyDataView/interface'
|
||||
import {
|
||||
CHECKSQUARE_STAT_TYPES,
|
||||
@@ -55,7 +141,104 @@ const props = defineProps<{
|
||||
selectedItem: SteadyDataView.SteadyChecksquareItem | null
|
||||
}>()
|
||||
|
||||
const segments = computed(() => collectMissingSegments(props.selectedItem))
|
||||
const DETAIL_PAGE_SIZE = 20
|
||||
const detailType = ref<SteadyDataView.SteadyChecksquareDetailType>('SEGMENT')
|
||||
const segmentStatType = ref<SteadyDataView.SteadyTrendStatType>('AVG')
|
||||
const itemDetail = ref<SteadyDataView.SteadyChecksquareItemDetail | null>(null)
|
||||
const detailPageNum = ref(1)
|
||||
const loading = ref(false)
|
||||
|
||||
const unwrapData = <T,>(response: { data: T } | T): T => {
|
||||
if (response && typeof response === 'object' && 'data' in response) {
|
||||
return (response as { data: T }).data
|
||||
}
|
||||
|
||||
return response as T
|
||||
}
|
||||
|
||||
const segments = computed(() => {
|
||||
if (itemDetail.value?.segments?.length) {
|
||||
return itemDetail.value.segments.map(segment => ({
|
||||
...segment,
|
||||
statType: itemDetail.value?.statType || segmentStatType.value
|
||||
}))
|
||||
}
|
||||
|
||||
return collectMissingSegments(props.selectedItem)
|
||||
})
|
||||
|
||||
const detailTotal = computed(() => {
|
||||
if (typeof itemDetail.value?.total === 'number') return itemDetail.value.total
|
||||
if (detailType.value === 'VALUE_ORDER') return itemDetail.value?.valueOrderDetails?.length || 0
|
||||
if (detailType.value === 'HARMONIC_PARITY') return itemDetail.value?.harmonicParityDetails?.length || 0
|
||||
|
||||
return 0
|
||||
})
|
||||
|
||||
const showDetailPagination = computed(() => {
|
||||
return detailType.value !== 'SEGMENT' && detailTotal.value > DETAIL_PAGE_SIZE
|
||||
})
|
||||
|
||||
const formatSegmentStatus = (status?: string) => {
|
||||
if (status === 'NORMAL') return '正常'
|
||||
if (status === 'MISSING') return '缺失'
|
||||
|
||||
return status || '-'
|
||||
}
|
||||
|
||||
const formatDetailArray = (value?: Array<string | number> | null) => {
|
||||
return value?.length ? value.join('、') : '-'
|
||||
}
|
||||
|
||||
const loadCurrentDetail = async () => {
|
||||
if (!props.selectedItem?.itemId) {
|
||||
itemDetail.value = null
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
const response = await getSteadyChecksquareItemDetail({
|
||||
itemId: props.selectedItem.itemId,
|
||||
detailType: detailType.value,
|
||||
statType: detailType.value === 'SEGMENT' ? segmentStatType.value : undefined,
|
||||
pageNum: detailType.value === 'SEGMENT' ? undefined : detailPageNum.value,
|
||||
pageSize: detailType.value === 'SEGMENT' ? undefined : DETAIL_PAGE_SIZE
|
||||
})
|
||||
itemDetail.value = unwrapData(response)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const handleDetailTypeChange = () => {
|
||||
detailPageNum.value = 1
|
||||
itemDetail.value = null
|
||||
loadCurrentDetail()
|
||||
}
|
||||
|
||||
const handleSegmentStatTypeChange = () => {
|
||||
detailPageNum.value = 1
|
||||
itemDetail.value = null
|
||||
loadCurrentDetail()
|
||||
}
|
||||
|
||||
const handleDetailPageChange = (pageNum: number) => {
|
||||
detailPageNum.value = pageNum
|
||||
loadCurrentDetail()
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.selectedItem?.itemId,
|
||||
() => {
|
||||
detailType.value = 'SEGMENT'
|
||||
segmentStatType.value = 'AVG'
|
||||
detailPageNum.value = 1
|
||||
itemDetail.value = null
|
||||
loadCurrentDetail()
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@@ -113,6 +296,22 @@ const segments = computed(() => collectMissingSegments(props.selectedItem))
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
.detail-toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.stat-select {
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.detail-pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.stat-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
|
||||
@@ -4,7 +4,11 @@
|
||||
<div class="header-button-lf">
|
||||
<span class="section-title">指标校验结果</span>
|
||||
<span v-if="result" class="summary-meta">
|
||||
<el-tag v-if="result.taskNo" size="small" effect="plain">任务编号:{{ result.taskNo }}</el-tag>
|
||||
<el-tag size="small" effect="plain">{{ result.lineName || result.lineId || '未返回监测点' }}</el-tag>
|
||||
<el-tag size="small" effect="plain">
|
||||
检测时间:{{ result.timeStart || '-' }} 至 {{ result.timeEnd || '-' }}
|
||||
</el-tag>
|
||||
<el-tag v-if="result.intervalMinutes" size="small" effect="plain">
|
||||
{{ result.intervalMinutes }} 分钟间隔
|
||||
</el-tag>
|
||||
@@ -64,6 +68,16 @@
|
||||
{{ row.maxContinuousMissingMinutes ?? '-' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="abnormalPointCount" label="值关系异常点" min-width="130" align="center">
|
||||
<template #default="{ row }">
|
||||
{{ row.abnormalPointCount ?? '-' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="harmonicParityAbnormalPointCount" label="谐波奇偶异常点" min-width="150" align="center">
|
||||
<template #default="{ row }">
|
||||
{{ row.harmonicParityAbnormalPointCount ?? '-' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="96" align="center" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-button type="primary" link :disabled="!hasChecksquareDetail(row)" @click="emit('detail', row)">
|
||||
|
||||
@@ -0,0 +1,312 @@
|
||||
<template>
|
||||
<ProTable
|
||||
ref="proTable"
|
||||
row-key="taskId"
|
||||
:columns="columns"
|
||||
:request-api="getTableList"
|
||||
:search-col="{ xs: 1, sm: 2, md: 2, lg: 4, xl: 4 }"
|
||||
>
|
||||
<template #tableHeader>
|
||||
<el-button type="primary" :icon="Plus" @click="emit('createTask')">新增校验任务</el-button>
|
||||
</template>
|
||||
|
||||
<template #operation="{ row }">
|
||||
<el-button type="primary" link :icon="View" @click="emit('detail', row)">详情</el-button>
|
||||
</template>
|
||||
</ProTable>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, h, reactive, ref } from 'vue'
|
||||
import { ElDatePicker, ElTag, ElTreeSelect } from 'element-plus'
|
||||
import { Plus, View } from '@element-plus/icons-vue'
|
||||
import ProTable from '@/components/ProTable/index.vue'
|
||||
import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
|
||||
import type { SteadyDataView } from '@/api/steady/steadyDataView/interface'
|
||||
import {
|
||||
buildChecksquareTaskQueryParams,
|
||||
formatChecksquarePercent,
|
||||
formatChecksquareTaskStatus,
|
||||
resolveChecksquareTaskStatusType,
|
||||
resolveChecksquareText,
|
||||
type ChecksquareTaskSearchParams
|
||||
} from '../utils/checksquareTaskTable'
|
||||
|
||||
defineOptions({
|
||||
name: 'ChecksquareTaskTable'
|
||||
})
|
||||
|
||||
const props = defineProps<{
|
||||
ledgerTree: SteadyDataView.SteadyLedgerNode[]
|
||||
indicatorTree: SteadyDataView.SteadyIndicatorNode[]
|
||||
requestApi: (params: SteadyDataView.SteadyChecksquareTaskQueryParams) => Promise<any>
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
createTask: []
|
||||
detail: [row: SteadyDataView.SteadyChecksquareTask]
|
||||
}>()
|
||||
|
||||
const proTable = ref<ProTableInstance>()
|
||||
|
||||
interface ChecksquareFilterTreeNode {
|
||||
label: string
|
||||
value: string
|
||||
disabled?: boolean
|
||||
children?: ChecksquareFilterTreeNode[]
|
||||
}
|
||||
|
||||
const normalizeLineFilterTree = (nodes: SteadyDataView.SteadyLedgerNode[]): ChecksquareFilterTreeNode[] => {
|
||||
return nodes.map(node => ({
|
||||
label: node.name,
|
||||
value: node.id,
|
||||
disabled: node.level !== 3 || node.selectable === false,
|
||||
children: node.children?.length ? normalizeLineFilterTree(node.children) : undefined
|
||||
}))
|
||||
}
|
||||
|
||||
const normalizeIndicatorFilterTree = (
|
||||
nodes: SteadyDataView.SteadyIndicatorNode[],
|
||||
parentKey = ''
|
||||
): ChecksquareFilterTreeNode[] => {
|
||||
return nodes.map((node, index) => {
|
||||
const isLeaf = !node.children?.length
|
||||
const value =
|
||||
isLeaf && node.indicatorCode
|
||||
? node.indicatorCode
|
||||
: node.id || `${parentKey}${node.groupCode || node.name || 'node'}-${index}`
|
||||
|
||||
return {
|
||||
label: node.unit ? `${node.name}(${node.unit})` : node.name,
|
||||
value,
|
||||
disabled: !isLeaf || !node.indicatorCode,
|
||||
children: node.children?.length ? normalizeIndicatorFilterTree(node.children, `${value}-`) : undefined
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const lineFilterTree = computed(() => normalizeLineFilterTree(props.ledgerTree))
|
||||
const indicatorFilterTree = computed(() => normalizeIndicatorFilterTree(props.indicatorTree))
|
||||
|
||||
const splitTreeSelectValues = (value?: string) => {
|
||||
return (value || '')
|
||||
.split(',')
|
||||
.map(item => item.trim())
|
||||
.filter(Boolean)
|
||||
}
|
||||
|
||||
const normalizeTreeSelectValues = (value: unknown) => {
|
||||
const rawValues = Array.isArray(value) ? value : value === undefined || value === null || value === '' ? [] : [value]
|
||||
|
||||
return Array.from(
|
||||
new Set(
|
||||
rawValues
|
||||
.filter((item): item is string | number => typeof item === 'string' || typeof item === 'number')
|
||||
.map(item => String(item).trim())
|
||||
.filter(Boolean)
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
const renderTimeRangeSearch = ({ searchParam }: { searchParam: ChecksquareTaskSearchParams }) =>
|
||||
h(ElDatePicker, {
|
||||
modelValue: searchParam.taskTimeRange,
|
||||
type: 'datetimerange',
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
||||
startPlaceholder: '开始时间',
|
||||
endPlaceholder: '结束时间',
|
||||
clearable: true,
|
||||
'onUpdate:modelValue': (value: string[] | null) => {
|
||||
searchParam.taskTimeRange = value || undefined
|
||||
}
|
||||
})
|
||||
|
||||
const renderLineSearch = ({ searchParam }: { searchParam: ChecksquareTaskSearchParams }) =>
|
||||
h(ElTreeSelect, {
|
||||
class: 'checksquare-search-tree-select',
|
||||
style: { width: '100%' },
|
||||
modelValue: splitTreeSelectValues(searchParam.lineId),
|
||||
data: lineFilterTree.value,
|
||||
nodeKey: 'value',
|
||||
multiple: true,
|
||||
showCheckbox: true,
|
||||
collapseTags: true,
|
||||
collapseTagsTooltip: true,
|
||||
maxCollapseTags: 1,
|
||||
filterable: true,
|
||||
clearable: true,
|
||||
defaultExpandAll: true,
|
||||
checkStrictly: true,
|
||||
props: { label: 'label', children: 'children', disabled: 'disabled' },
|
||||
placeholder: '请选择监测点',
|
||||
'onUpdate:modelValue': (value: unknown) => {
|
||||
const selectedValues = normalizeTreeSelectValues(value)
|
||||
searchParam.lineId = selectedValues.length ? selectedValues.join(',') : undefined
|
||||
}
|
||||
})
|
||||
|
||||
const renderIndicatorSearch = ({ searchParam }: { searchParam: ChecksquareTaskSearchParams }) =>
|
||||
h(ElTreeSelect, {
|
||||
class: 'checksquare-search-tree-select',
|
||||
style: { width: '100%' },
|
||||
modelValue: splitTreeSelectValues(searchParam.indicatorCode),
|
||||
data: indicatorFilterTree.value,
|
||||
nodeKey: 'value',
|
||||
multiple: true,
|
||||
showCheckbox: true,
|
||||
collapseTags: true,
|
||||
collapseTagsTooltip: true,
|
||||
maxCollapseTags: 1,
|
||||
filterable: true,
|
||||
clearable: true,
|
||||
defaultExpandAll: true,
|
||||
checkStrictly: true,
|
||||
props: { label: 'label', children: 'children', disabled: 'disabled' },
|
||||
placeholder: '请选择稳态指标',
|
||||
'onUpdate:modelValue': (value: unknown) => {
|
||||
const selectedValues = normalizeTreeSelectValues(value)
|
||||
searchParam.indicatorCode = selectedValues.length ? selectedValues.join(',') : undefined
|
||||
}
|
||||
})
|
||||
|
||||
const columns = reactive<ColumnProps<SteadyDataView.SteadyChecksquareTask>[]>([
|
||||
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
|
||||
{
|
||||
prop: 'taskNo',
|
||||
label: '任务编号',
|
||||
minWidth: 180,
|
||||
render: ({ row }) => resolveChecksquareText(row.taskNo)
|
||||
},
|
||||
{
|
||||
prop: 'lineId',
|
||||
label: '监测点ID',
|
||||
isShow: false,
|
||||
isSetting: false,
|
||||
search: {
|
||||
label: '监测点',
|
||||
order: 2,
|
||||
render: renderLineSearch
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'lineName',
|
||||
label: '监测点名称',
|
||||
minWidth: 160,
|
||||
render: ({ row }) => resolveChecksquareText(row.lineName || row.lineId)
|
||||
},
|
||||
{
|
||||
prop: 'indicatorCode',
|
||||
label: '稳态指标',
|
||||
isShow: false,
|
||||
isSetting: false,
|
||||
search: {
|
||||
label: '稳态指标',
|
||||
order: 3,
|
||||
render: renderIndicatorSearch
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'timeStart',
|
||||
label: '开始时间',
|
||||
minWidth: 170,
|
||||
render: ({ row }) => resolveChecksquareText(row.timeStart),
|
||||
search: {
|
||||
label: '检测时间',
|
||||
key: 'taskTimeRange',
|
||||
order: 1,
|
||||
render: renderTimeRangeSearch
|
||||
}
|
||||
},
|
||||
{
|
||||
prop: 'timeEnd',
|
||||
label: '结束时间',
|
||||
minWidth: 170,
|
||||
render: ({ row }) => resolveChecksquareText(row.timeEnd)
|
||||
},
|
||||
{
|
||||
prop: 'taskStatus',
|
||||
label: '任务状态',
|
||||
minWidth: 110,
|
||||
render: ({ row }) =>
|
||||
h(
|
||||
ElTag,
|
||||
{ type: resolveChecksquareTaskStatusType(row.taskStatus), effect: 'plain' },
|
||||
() => formatChecksquareTaskStatus(row.taskStatus)
|
||||
)
|
||||
},
|
||||
{
|
||||
prop: 'itemCount',
|
||||
label: '检测项数',
|
||||
minWidth: 100,
|
||||
align: 'center',
|
||||
render: ({ row }) => resolveChecksquareText(row.itemCount)
|
||||
},
|
||||
{
|
||||
prop: 'abnormalItemCount',
|
||||
label: '异常项数',
|
||||
minWidth: 100,
|
||||
align: 'center',
|
||||
render: ({ row }) => resolveChecksquareText(row.abnormalItemCount),
|
||||
search: {
|
||||
label: '异常状态',
|
||||
key: 'hasAbnormal',
|
||||
order: 4,
|
||||
el: 'select'
|
||||
},
|
||||
enum: [
|
||||
{ label: '存在异常', value: true },
|
||||
{ label: '全部', value: false }
|
||||
],
|
||||
isFilterEnum: false
|
||||
},
|
||||
{
|
||||
prop: 'maxMissingRate',
|
||||
label: '最大缺失率',
|
||||
minWidth: 120,
|
||||
align: 'center',
|
||||
render: ({ row }) => formatChecksquarePercent(row.maxMissingRate)
|
||||
},
|
||||
{
|
||||
prop: 'createTime',
|
||||
label: '创建时间',
|
||||
minWidth: 170,
|
||||
render: ({ row }) => resolveChecksquareText(row.createTime)
|
||||
},
|
||||
{ prop: 'operation', label: '操作', fixed: 'right', width: 96 }
|
||||
])
|
||||
|
||||
const getTableList = (params: ChecksquareTaskSearchParams) => {
|
||||
return props.requestApi(buildChecksquareTaskQueryParams(params))
|
||||
}
|
||||
|
||||
const refresh = () => {
|
||||
proTable.value?.getTableList()
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
refresh
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.checksquare-search-tree-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.checksquare-search-tree-select .el-select__wrapper) {
|
||||
min-height: 32px;
|
||||
}
|
||||
|
||||
:deep(.checksquare-search-tree-select .el-select__selection) {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.checksquare-search-tree-select .el-select__tags-text) {
|
||||
display: inline-block;
|
||||
max-width: 120px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
vertical-align: bottom;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
@@ -63,42 +63,25 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="query-actions">
|
||||
<el-button type="primary" :icon="Search" :loading="loading.query" @click="emit('query')">
|
||||
查询
|
||||
<el-button type="primary" :icon="Plus" :loading="loading.query" @click="emit('create')">
|
||||
新增校验任务
|
||||
</el-button>
|
||||
<el-button type="primary" plain :icon="RefreshLeft" @click="emit('reset')">重置</el-button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="checksquare-content">
|
||||
<ChecksquareSummaryTable
|
||||
class="content-summary"
|
||||
:result="result"
|
||||
:items="result?.items || []"
|
||||
:loading="loading.query"
|
||||
@refresh="emit('query')"
|
||||
@detail="openDetailDialog"
|
||||
/>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<el-dialog v-model="detailDialogVisible" title="连续性详情" width="760px" append-to-body>
|
||||
<ChecksquareDetailPanel :selected-item="selectedItem" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { RefreshLeft, Search } from '@element-plus/icons-vue'
|
||||
import { Plus, RefreshLeft } from '@element-plus/icons-vue'
|
||||
import type { SteadyDataView } from '@/api/steady/steadyDataView/interface'
|
||||
import TimePeriodSearch from '@/views/components/TimePeriodSearch/index.vue'
|
||||
import { buildTimePeriodRange, type TimePeriodUnit } from '@/views/components/TimePeriodSearch/timePeriod'
|
||||
import SteadyLedgerTree from '@/views/steady/steadyDataView/components/SteadyLedgerTree.vue'
|
||||
import { collectLeafIndicators } from '@/views/steady/steadyDataView/utils/selectionRules'
|
||||
import type { ChecksquareFormState } from '../utils/checksquarePayload'
|
||||
import ChecksquareDetailPanel from './ChecksquareDetailPanel.vue'
|
||||
import ChecksquareSummaryTable from './ChecksquareSummaryTable.vue'
|
||||
|
||||
defineOptions({
|
||||
name: 'ChecksquareWorkbench'
|
||||
@@ -108,8 +91,6 @@ const props = defineProps<{
|
||||
form: ChecksquareFormState
|
||||
ledgerTree: SteadyDataView.SteadyLedgerNode[]
|
||||
indicatorTree: SteadyDataView.SteadyIndicatorNode[]
|
||||
result: SteadyDataView.SteadyChecksquareQueryResult | null
|
||||
selectedItem: SteadyDataView.SteadyChecksquareItem | null
|
||||
loading: {
|
||||
ledger: boolean
|
||||
indicator: boolean
|
||||
@@ -129,13 +110,11 @@ const emit = defineEmits<{
|
||||
ledgerSearch: [value: string]
|
||||
ledgerChange: [nodes: SteadyDataView.SteadyLedgerNode[]]
|
||||
indicatorChange: [nodes: SteadyDataView.SteadyIndicatorNode[]]
|
||||
query: []
|
||||
create: []
|
||||
reset: []
|
||||
selectItem: [item: SteadyDataView.SteadyChecksquareItem]
|
||||
}>()
|
||||
|
||||
const selectedIndicatorKeys = ref<string[]>([])
|
||||
const detailDialogVisible = ref(false)
|
||||
const CHECKSQUARE_TIME_PERIOD_UNITS: TimePeriodUnit[] = ['day', 'week', 'month', 'year', 'custom']
|
||||
|
||||
const normalizeIndicatorSelectTree = (
|
||||
@@ -191,11 +170,6 @@ const handleSelectAllIndicators = () => {
|
||||
emitSelectedIndicators()
|
||||
}
|
||||
|
||||
const openDetailDialog = (item: SteadyDataView.SteadyChecksquareItem) => {
|
||||
emit('selectItem', item)
|
||||
detailDialogVisible.value = true
|
||||
}
|
||||
|
||||
const updateTimeRange = (unit: TimePeriodUnit, baseDate: Date) => {
|
||||
const timeRange = unit === 'custom' ? props.form.timeRange : buildTimePeriodRange(unit, baseDate)
|
||||
|
||||
@@ -275,9 +249,7 @@ watch(
|
||||
}
|
||||
|
||||
.checksquare-main {
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
gap: 12px;
|
||||
display: block;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
@@ -285,9 +257,9 @@ watch(
|
||||
|
||||
.query-card {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(430px, 1.35fr) minmax(0, 1fr) auto;
|
||||
grid-template-columns: minmax(360px, 1.2fr) minmax(280px, 1fr);
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
align-items: stretch;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
@@ -330,6 +302,7 @@ watch(
|
||||
|
||||
.indicator-select-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
gap: 8px;
|
||||
@@ -357,23 +330,11 @@ watch(
|
||||
|
||||
.query-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
grid-column: 1 / -1;
|
||||
justify-content: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.checksquare-content {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.content-summary {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@media (max-width: 1360px) {
|
||||
.checksquare-layout:not(.is-ledger-collapsed) {
|
||||
grid-template-columns: 280px minmax(0, 1fr);
|
||||
@@ -382,11 +343,7 @@ watch(
|
||||
|
||||
@media (max-width: 1280px) {
|
||||
.query-card {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.query-actions {
|
||||
justify-content: flex-start;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -11,265 +11,227 @@ const files = {
|
||||
apiTypes: path.resolve(rootDir, 'api/steady/steadyDataView/interface/index.ts'),
|
||||
page: path.resolve(rootDir, 'views/steady/checksquare/index.vue'),
|
||||
workbench: path.resolve(rootDir, 'views/steady/checksquare/components/ChecksquareWorkbench.vue'),
|
||||
taskTable: path.resolve(rootDir, 'views/steady/checksquare/components/ChecksquareTaskTable.vue'),
|
||||
summaryTable: path.resolve(rootDir, 'views/steady/checksquare/components/ChecksquareSummaryTable.vue'),
|
||||
detailPanel: path.resolve(rootDir, 'views/steady/checksquare/components/ChecksquareDetailPanel.vue'),
|
||||
payload: path.resolve(rootDir, 'views/steady/checksquare/utils/checksquarePayload.ts'),
|
||||
table: path.resolve(rootDir, 'views/steady/checksquare/utils/checksquareTable.ts')
|
||||
taskTableUtils: path.resolve(rootDir, 'views/steady/checksquare/utils/checksquareTaskTable.ts'),
|
||||
table: path.resolve(rootDir, 'views/steady/checksquare/utils/checksquareTable.ts'),
|
||||
grid: path.resolve(rootDir, 'components/Grid/index.vue'),
|
||||
searchForm: path.resolve(rootDir, 'components/SearchForm/index.vue'),
|
||||
searchFormItem: path.resolve(rootDir, 'components/SearchForm/components/SearchFormItem.vue')
|
||||
}
|
||||
|
||||
const read = file => (exists(file) ? fs.readFileSync(file, 'utf8') : '')
|
||||
const exists = file => fs.existsSync(file)
|
||||
|
||||
const checks = [
|
||||
['checksquare query api exists', () => /querySteadyChecksquare/.test(read(files.api))],
|
||||
['checksquare task query api exists', () => /querySteadyChecksquareTasks/.test(read(files.api))],
|
||||
[
|
||||
'checksquare api posts to expected endpoint',
|
||||
() => /\/steady\/data-view\/checksquare\/query/.test(read(files.api))
|
||||
'checksquare api exposes all documented endpoints',
|
||||
() => {
|
||||
const api = read(files.api)
|
||||
return (
|
||||
/\/steady\/data-view\/checksquare\/query/.test(api) &&
|
||||
/\/steady\/data-view\/checksquare\/create/.test(api) &&
|
||||
/\/steady\/data-view\/checksquare\/detail/.test(api) &&
|
||||
/\/steady\/data-view\/checksquare\/item-detail/.test(api)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'checksquare request type uses single lineId',
|
||||
() => /interface SteadyChecksquareQueryParams[\s\S]*lineId: string/.test(read(files.apiTypes))
|
||||
'checksquare task query params support page and filters',
|
||||
() =>
|
||||
/interface SteadyChecksquareTaskQueryParams[\s\S]*pageNum\?: number[\s\S]*pageSize\?: number[\s\S]*lineId\?: string[\s\S]*indicatorCode\?: string[\s\S]*hasAbnormal\?: boolean/.test(
|
||||
read(files.apiTypes)
|
||||
)
|
||||
],
|
||||
[
|
||||
'checksquare request type supports per-order harmonic query only',
|
||||
'checksquare create params match backend create body',
|
||||
() => {
|
||||
const typeBlock =
|
||||
read(files.apiTypes).match(/interface SteadyChecksquareQueryParams\s*\{[\s\S]*?\n {4}\}/)?.[0] || ''
|
||||
return /harmonicOrders\?: number\[\]/.test(typeBlock) && !/qualityFlag|statTypes|phases|lineIds/.test(typeBlock)
|
||||
read(files.apiTypes).match(/interface SteadyChecksquareCreateParams\s*\{[\s\S]*?\n {4}\}/)?.[0] || ''
|
||||
return (
|
||||
/lineId: string/.test(typeBlock) &&
|
||||
/indicatorCodes: string\[\]/.test(typeBlock) &&
|
||||
/timeStart: string/.test(typeBlock) &&
|
||||
/timeEnd: string/.test(typeBlock) &&
|
||||
!/harmonicOrders/.test(typeBlock)
|
||||
)
|
||||
}
|
||||
],
|
||||
['workbench component exists', () => exists(files.workbench)],
|
||||
['summary table component exists', () => exists(files.summaryTable)],
|
||||
['detail panel component exists', () => exists(files.detailPanel)],
|
||||
['payload utility exists', () => exists(files.payload)],
|
||||
['table utility exists', () => exists(files.table)],
|
||||
['page reuses steady ledger tree', () => /SteadyLedgerTree/.test(read(files.workbench))],
|
||||
['page reuses shared time period search', () => /TimePeriodSearch/.test(read(files.workbench))],
|
||||
['payload keeps shared time period unit state', () => /timeUnit:\s*TimePeriodUnit/.test(read(files.payload))],
|
||||
['task table component exists', () => exists(files.taskTable)],
|
||||
['task table uses ProTable like event list', () => /<ProTable[\s\S]*row-key="taskId"[\s\S]*:columns="columns"/.test(read(files.taskTable))],
|
||||
[
|
||||
'checksquare time search exposes day week month year custom units',
|
||||
'task table exposes create task header action',
|
||||
() => /<template #tableHeader>/.test(read(files.taskTable)) && /新增校验任务/.test(read(files.taskTable)) && /emit\('createTask'\)/.test(read(files.taskTable))
|
||||
],
|
||||
[
|
||||
'task table has documented task columns',
|
||||
() => {
|
||||
const source = read(files.taskTable)
|
||||
return ['taskNo', 'lineName', 'timeStart', 'timeEnd', 'taskStatus', 'itemCount', 'abnormalItemCount', 'maxMissingRate', 'createTime'].every(
|
||||
prop => new RegExp(`prop:\\s*'${prop}'`).test(source)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'task table query params convert time range and abnormal filter',
|
||||
() =>
|
||||
/CHECKSQUARE_TIME_PERIOD_UNITS\s*:\s*TimePeriodUnit\[\]\s*=\s*\['day',\s*'week',\s*'month',\s*'year',\s*'custom'\]/.test(
|
||||
/buildChecksquareTaskQueryParams/.test(read(files.taskTable)) &&
|
||||
/taskTimeRange/.test(read(files.taskTableUtils)) &&
|
||||
/hasAbnormal/.test(read(files.taskTable))
|
||||
],
|
||||
['workbench remains create dialog selector body', () => /SteadyLedgerTree/.test(read(files.workbench)) && /TimePeriodSearch/.test(read(files.workbench))],
|
||||
['workbench emits create instead of old query action', () => /create: \[\]/.test(read(files.workbench)) && !/query: \[\]/.test(read(files.workbench))],
|
||||
['workbench no longer renders result table', () => !/ChecksquareSummaryTable/.test(read(files.workbench))],
|
||||
[
|
||||
'create dialog workbench keeps time and indicator on one row without compressing actions',
|
||||
() =>
|
||||
/\.query-card\s*\{[\s\S]*grid-template-columns:\s*minmax\(360px,\s*1\.2fr\)\s+minmax\(280px,\s*1fr\)/.test(
|
||||
read(files.workbench)
|
||||
) && /:visible-units="CHECKSQUARE_TIME_PERIOD_UNITS"/.test(read(files.workbench))
|
||||
) &&
|
||||
/\.query-actions\s*\{[\s\S]*grid-column:\s*1\s*\/\s*-1/.test(read(files.workbench)) &&
|
||||
/\.indicator-select-row\s*\{[\s\S]*align-items:\s*center/.test(read(files.workbench)) &&
|
||||
/\.query-actions\s*\{[\s\S]*justify-content:\s*flex-start/.test(read(files.workbench))
|
||||
],
|
||||
[
|
||||
'checksquare defaults to day range',
|
||||
'payload builds create params without harmonic orders',
|
||||
() => /buildSteadyChecksquareCreatePayload/.test(read(files.payload)) && !/harmonicOrder/.test(read(files.payload))
|
||||
],
|
||||
[
|
||||
'page renders task table as first screen',
|
||||
() => /<ChecksquareTaskTable[\s\S]*@create-task="openCreateDialog"[\s\S]*@detail="openTaskDetail"/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'page passes steady ledger and indicator trees to task table filters',
|
||||
() =>
|
||||
/timeRange:\s*buildTimePeriodRange\('day',\s*baseDate\)/.test(read(files.payload)) &&
|
||||
/timeUnit:\s*'day'/.test(read(files.payload))
|
||||
/<ChecksquareTaskTable[\s\S]*:ledger-tree="ledgerTree"[\s\S]*:indicator-tree="indicatorTree"/.test(
|
||||
read(files.page)
|
||||
)
|
||||
],
|
||||
['page no longer tracks floating indicator panel state', () => !/indicatorPanelCollapsed|indicator-panel-collapsed/.test(read(files.page))],
|
||||
[
|
||||
'query form uses tree select for steady indicators',
|
||||
'task table receives steady ledger and indicator tree filter data',
|
||||
() =>
|
||||
/<el-tree-select/.test(read(files.workbench)) &&
|
||||
/v-model="selectedIndicatorKeys"/.test(read(files.workbench)) &&
|
||||
/multiple/.test(read(files.workbench)) &&
|
||||
/show-checkbox/.test(read(files.workbench))
|
||||
/ledgerTree:\s*SteadyDataView\.SteadyLedgerNode\[\]/.test(read(files.taskTable)) &&
|
||||
/indicatorTree:\s*SteadyDataView\.SteadyIndicatorNode\[\]/.test(read(files.taskTable))
|
||||
],
|
||||
[
|
||||
'query form keeps steady indicator immediately after time selector',
|
||||
() => /class="toolbar-field toolbar-field--time"[\s\S]*class="toolbar-field indicator-form-item"/.test(read(files.workbench))
|
||||
],
|
||||
[
|
||||
'query form supports selecting all steady indicators',
|
||||
'task table monitor point filter uses dropdown tree instead of lineId input',
|
||||
() =>
|
||||
/@click="handleSelectAllIndicators"/.test(read(files.workbench)) &&
|
||||
/collectAllIndicatorKeys/.test(read(files.workbench))
|
||||
/renderLineSearch/.test(read(files.taskTable)) &&
|
||||
/ElTreeSelect/.test(read(files.taskTable)) &&
|
||||
/multiple:\s*true/.test(read(files.taskTable)) &&
|
||||
/normalizeTreeSelectValues/.test(read(files.taskTable)) &&
|
||||
/checkStrictly:\s*true/.test(read(files.taskTable)) &&
|
||||
!/lineId[\s\S]*?el:\s*'input'/.test(read(files.taskTable))
|
||||
],
|
||||
[
|
||||
'checksquare no longer renders floating indicator panel',
|
||||
() => !/SteadyIndicatorFloatingPanel|indicatorPanelCollapsedProxy|is-indicator-expanded/.test(read(files.workbench))
|
||||
],
|
||||
['summary table renders unsupported stats as dash', () => /formatStatMissingRate[\s\S]*'-'/.test(read(files.table))],
|
||||
[
|
||||
'summary table has localized AVG MAX MIN CP95 columns',
|
||||
() => /平均值缺失率[\s\S]*最大值缺失率[\s\S]*最小值缺失率[\s\S]*CP95缺失率/.test(read(files.summaryTable))
|
||||
'task table indicator code filter uses steady indicator tree selection',
|
||||
() =>
|
||||
/renderIndicatorSearch/.test(read(files.taskTable)) &&
|
||||
/indicatorFilterTree/.test(read(files.taskTable)) &&
|
||||
/multiple:\s*true/.test(read(files.taskTable)) &&
|
||||
/normalizeTreeSelectValues/.test(read(files.taskTable)) &&
|
||||
/indicatorCode/.test(read(files.taskTable)) &&
|
||||
/style:\s*\{\s*width:\s*'100%'\s*\}/.test(read(files.taskTable)) &&
|
||||
!/indicatorCode[\s\S]*?el:\s*'input'/.test(read(files.taskTable))
|
||||
],
|
||||
[
|
||||
'table utility localizes checksquare stat type names',
|
||||
() => /AVG:\s*'平均值'[\s\S]*MAX:\s*'最大值'[\s\S]*MIN:\s*'最小值'/.test(read(files.table))
|
||||
],
|
||||
['detail panel renders missing segments', () => /segments/.test(read(files.detailPanel))]
|
||||
,
|
||||
[
|
||||
'summary table title changed to check result',
|
||||
() => /指标校验结果/.test(read(files.summaryTable)) && !/指标校验总览/.test(read(files.summaryTable))
|
||||
'task table displays indicator code filter as steady indicator',
|
||||
() =>
|
||||
/label:\s*'稳态指标'/.test(read(files.taskTable)) &&
|
||||
/placeholder:\s*'请选择稳态指标'/.test(read(files.taskTable)) &&
|
||||
!/label:\s*'指标编码'/.test(read(files.taskTable)) &&
|
||||
!/placeholder:\s*'请选择指标编码'/.test(read(files.taskTable))
|
||||
],
|
||||
[
|
||||
'summary table shows monitor fallback and keeps meta 15px from title',
|
||||
'task table tree select filters keep selected tags visible',
|
||||
() => {
|
||||
const taskTable = read(files.taskTable)
|
||||
return (
|
||||
/class:\s*'checksquare-search-tree-select'/.test(taskTable) &&
|
||||
/maxCollapseTags:\s*1/.test(taskTable) &&
|
||||
/\.checksquare-search-tree-select\s*\{[\s\S]*width:\s*100%/.test(taskTable) &&
|
||||
/:deep\(\.checksquare-search-tree-select \.el-select__tags-text\)[\s\S]*max-width/.test(taskTable)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'search grid keeps third filter visible when operation column exactly fills first row',
|
||||
() => /Number\(prev\)\s*>\s*props\.collapsedRows \* gridCols\.value - suffixCols/.test(read(files.grid))
|
||||
],
|
||||
[
|
||||
'search collapse toggle only appears when filters exceed available first row columns',
|
||||
() => /prev\s*>\s*props\.searchCol\[breakPoint\.value\]/.test(read(files.searchForm))
|
||||
],
|
||||
[
|
||||
'custom search render does not receive generic form item v-model',
|
||||
() =>
|
||||
/v-if=['"]!column\.search\?\.render['"]/.test(read(files.searchFormItem)) &&
|
||||
/v-else[\s\S]*:is="column\.search\.render"/.test(read(files.searchFormItem))
|
||||
],
|
||||
[
|
||||
'page wraps old workbench in create dialog',
|
||||
() => /<el-dialog[\s\S]*新增校验任务[\s\S]*<ChecksquareWorkbench/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'page create flow calls create api and refreshes task table',
|
||||
() =>
|
||||
/createSteadyChecksquareTask/.test(read(files.page)) &&
|
||||
/taskTableRef\.value\?\.refresh\(\)/.test(read(files.page)) &&
|
||||
/createDialogVisible\.value = false/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'page detail flow calls detail api',
|
||||
() => /getSteadyChecksquareDetail/.test(read(files.page)) && /detailDialogVisible\.value = true/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'summary table supports persisted abnormal fields',
|
||||
() => /abnormalPointCount/.test(read(files.summaryTable)) && /harmonicParityAbnormalPointCount/.test(read(files.summaryTable))
|
||||
],
|
||||
[
|
||||
'detail panel loads item details on demand',
|
||||
() => /getSteadyChecksquareItemDetail/.test(read(files.detailPanel)) && /detailType/.test(read(files.detailPanel))
|
||||
],
|
||||
[
|
||||
'item detail api types support documented pagination fields',
|
||||
() => {
|
||||
const types = read(files.apiTypes)
|
||||
return (
|
||||
/interface SteadyChecksquareItemDetailParams[\s\S]*pageNum\?: number[\s\S]*pageSize\?: number/.test(types) &&
|
||||
/interface SteadyChecksquareItemDetail[\s\S]*pageNum\?: number \| null[\s\S]*pageSize\?: number \| null[\s\S]*total\?: number \| null/.test(
|
||||
types
|
||||
)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'summary table displays documented task base fields',
|
||||
() => {
|
||||
const summaryTable = read(files.summaryTable)
|
||||
return (
|
||||
/class="summary-meta"/.test(summaryTable) &&
|
||||
/result\.lineName\s*\|\|\s*result\.lineId\s*\|\|\s*'未返回监测点'/.test(summaryTable) &&
|
||||
/\.summary-meta\s*\{[\s\S]*margin-left:\s*15px/.test(summaryTable)
|
||||
)
|
||||
return /任务编号/.test(summaryTable) && /检测时间/.test(summaryTable) && /result\.taskNo/.test(summaryTable)
|
||||
}
|
||||
],
|
||||
[
|
||||
'summary table uses tree rows for harmonic results',
|
||||
() =>
|
||||
/row-key="itemKey"/.test(read(files.summaryTable)) &&
|
||||
/tree-props/.test(read(files.summaryTable)) &&
|
||||
/children/.test(read(files.summaryTable))
|
||||
],
|
||||
[
|
||||
'summary table keeps harmonic tree rows collapsed by default',
|
||||
() => !/default-expand-all/.test(read(files.summaryTable))
|
||||
],
|
||||
[
|
||||
'summary table removes harmonic order column',
|
||||
() => !/<el-table-column[^>]*prop="harmonicOrder"/.test(read(files.summaryTable))
|
||||
],
|
||||
[
|
||||
'summary table uses balanced column widths for check result',
|
||||
'detail panel paginates abnormal item details with documented page size',
|
||||
() => {
|
||||
const summaryTable = read(files.summaryTable)
|
||||
const indicatorColumn = summaryTable.match(/<el-table-column[^>]*prop="indicatorName"[^>]*>/)?.[0] || ''
|
||||
const hasDataColumn = summaryTable.match(/<el-table-column[^>]*prop="hasData"[^>]*>/)?.[0] || ''
|
||||
const missingRateColumn = summaryTable.match(/<el-table-column[^>]*prop="missingRate"[^>]*>/)?.[0] || ''
|
||||
const avgColumn = summaryTable.match(/<el-table-column[^>]*label="平均值缺失率"[^>]*>/)?.[0] || ''
|
||||
const maxColumn = summaryTable.match(/<el-table-column[^>]*label="最大值缺失率"[^>]*>/)?.[0] || ''
|
||||
const minColumn = summaryTable.match(/<el-table-column[^>]*label="最小值缺失率"[^>]*>/)?.[0] || ''
|
||||
const cp95Column = summaryTable.match(/<el-table-column[^>]*label="CP95缺失率"[^>]*>/)?.[0] || ''
|
||||
const maxMissingColumn =
|
||||
summaryTable.match(/<el-table-column[^>]*prop="maxContinuousMissingMinutes"[^>]*>/)?.[0] || ''
|
||||
const operationColumn = summaryTable.match(/<el-table-column[^>]*label="操作"[^>]*>/)?.[0] || ''
|
||||
const stretchColumns = [
|
||||
hasDataColumn,
|
||||
missingRateColumn,
|
||||
avgColumn,
|
||||
maxColumn,
|
||||
minColumn,
|
||||
cp95Column,
|
||||
maxMissingColumn
|
||||
]
|
||||
|
||||
const detailPanel = read(files.detailPanel)
|
||||
return (
|
||||
/min-width="208"/.test(indicatorColumn) &&
|
||||
/min-width="120"/.test(hasDataColumn) &&
|
||||
/min-width="130"/.test(missingRateColumn) &&
|
||||
/min-width="130"/.test(avgColumn) &&
|
||||
/min-width="130"/.test(maxColumn) &&
|
||||
/min-width="130"/.test(minColumn) &&
|
||||
/min-width="140"/.test(cp95Column) &&
|
||||
/min-width="150"/.test(maxMissingColumn) &&
|
||||
/width="96"/.test(operationColumn) &&
|
||||
stretchColumns.every(column => /min-width=/.test(column) && !/\swidth=/.test(column)) &&
|
||||
stretchColumns.every(column => /align="center"/.test(column)) &&
|
||||
/align="center"/.test(operationColumn) &&
|
||||
!/align=/.test(indicatorColumn)
|
||||
/DETAIL_PAGE_SIZE\s*=\s*20/.test(detailPanel) &&
|
||||
/detailPageNum/.test(detailPanel) &&
|
||||
/pageNum:[\s\S]*detailPageNum\.value/.test(detailPanel) &&
|
||||
/pageSize:[\s\S]*DETAIL_PAGE_SIZE/.test(detailPanel) &&
|
||||
/<el-pagination/.test(detailPanel)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'workbench query card follows steady data view toolbar sizing',
|
||||
'detail panel renders documented detail fields',
|
||||
() => {
|
||||
const workbench = read(files.workbench)
|
||||
return (
|
||||
/\.query-card\s*\{[\s\S]*display:\s*grid[\s\S]*grid-template-columns:\s*minmax\(430px,\s*1\.35fr\)\s+minmax\(0,\s*1fr\)\s+auto[\s\S]*gap:\s*10px[\s\S]*align-items:\s*center[\s\S]*padding:\s*12px/.test(
|
||||
workbench
|
||||
) &&
|
||||
/\.checksquare-time\s*\{[\s\S]*flex:\s*1\s+1\s+0[\s\S]*min-width:\s*0/.test(workbench) &&
|
||||
/\.checksquare-time\s*:deep\(\.time-period-search__unit\)\s*\{[\s\S]*width:\s*88px[\s\S]*flex:\s*0\s+0\s+88px/.test(
|
||||
workbench
|
||||
) &&
|
||||
/\.checksquare-time\s*:deep\(\.time-period-search__picker\)\s*\{[\s\S]*width:\s*136px[\s\S]*flex:\s*0\s+0\s+136px/.test(
|
||||
workbench
|
||||
) &&
|
||||
/\.query-actions\s*\{[\s\S]*display:\s*flex[\s\S]*justify-content:\s*flex-end[\s\S]*gap:\s*8px/.test(workbench)
|
||||
)
|
||||
const detailPanel = read(files.detailPanel)
|
||||
return /prop="status"[\s\S]*状态/.test(detailPanel) && /oddHarmonicOrders/.test(detailPanel) && /oddValues/.test(detailPanel)
|
||||
}
|
||||
],
|
||||
[
|
||||
'summary table exposes detail action',
|
||||
() => /详情/.test(read(files.summaryTable)) && /emit\('detail'/.test(read(files.summaryTable))
|
||||
],
|
||||
[
|
||||
'workbench shows detail in dialog instead of inline panel',
|
||||
() =>
|
||||
/<el-dialog/.test(read(files.workbench)) &&
|
||||
/ChecksquareDetailPanel/.test(read(files.workbench)) &&
|
||||
!/class="content-detail"/.test(read(files.workbench))
|
||||
],
|
||||
[
|
||||
'page builds pending rows from selected indicators',
|
||||
() => /buildPendingChecksquareResult/.test(read(files.page)) && /refreshPendingResult/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'page queries indicators sequentially',
|
||||
() => /for \(const indicator of queryIndicators\)/.test(read(files.page)) && /mergeChecksquareIndicatorResult/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'page queries harmonic orders with controlled concurrency',
|
||||
() =>
|
||||
/CHECKSQUARE_HARMONIC_QUERY_CONCURRENCY\s*=\s*6/.test(read(files.page)) &&
|
||||
/runChecksquareHarmonicQuery/.test(read(files.page)) &&
|
||||
/workers = Array\.from\(\{[\s\S]*length: Math\.min\(CHECKSQUARE_HARMONIC_QUERY_CONCURRENCY/.test(read(files.page)) &&
|
||||
/await Promise\.all\(workers\)/.test(read(files.page)) &&
|
||||
/const harmonicOrders = \[\.\.\.CHECKSQUARE_HARMONIC_ORDERS\]/.test(read(files.page)) &&
|
||||
/if \(orderIndex >= harmonicOrders\.length\) return/.test(read(files.page))
|
||||
],
|
||||
[
|
||||
'table pre-creates harmonic rows from second to fiftieth order',
|
||||
() =>
|
||||
/CHECKSQUARE_HARMONIC_ORDER_MIN\s*=\s*2/.test(read(files.table)) &&
|
||||
/CHECKSQUARE_HARMONIC_ORDER_MAX\s*=\s*50/.test(read(files.table)) &&
|
||||
/CHECKSQUARE_HARMONIC_ORDER_MAX - CHECKSQUARE_HARMONIC_ORDER_MIN \+ 1/.test(read(files.table)) &&
|
||||
/children: isChecksquareHarmonicIndicator\(indicator\)\s*\?\s*buildPendingChecksquareHarmonicItems/.test(
|
||||
read(files.table)
|
||||
)
|
||||
],
|
||||
[
|
||||
'table only merges indicators whose harmonic order range intersects second to fiftieth order',
|
||||
() => {
|
||||
const table = read(files.table)
|
||||
return (
|
||||
/CHECKSQUARE_HARMONIC_ORDER_MIN/.test(table) &&
|
||||
/CHECKSQUARE_HARMONIC_ORDER_MAX/.test(table) &&
|
||||
/hasChecksquareHarmonicOrderRange/.test(table) &&
|
||||
/isChecksquareHarmonicIndicator[\s\S]*hasChecksquareHarmonicOrderRange\(indicator\)/.test(table) &&
|
||||
/const shouldMergeHarmonicItems\s*=\s*isChecksquareHarmonicIndicator\(indicator\)/.test(table) &&
|
||||
/const normalItems\s*=\s*shouldMergeHarmonicItems[\s\S]*resultItems/.test(table) &&
|
||||
/const harmonicItems\s*=\s*shouldMergeHarmonicItems[\s\S]*\[\]/.test(table)
|
||||
)
|
||||
}
|
||||
],
|
||||
[
|
||||
'table summarizes harmonic parent after all orders finish',
|
||||
() =>
|
||||
/buildHarmonicParentSummary/.test(read(files.table)) &&
|
||||
/every\(item => isResolvedChecksquareItem\(item\)\)/.test(read(files.table)) &&
|
||||
/missingPointCount \/ expectedPointCount/.test(read(files.table))
|
||||
],
|
||||
[
|
||||
'table marks harmonic parent valid when every order child has data',
|
||||
() =>
|
||||
/hasData:\s*children\.every\(item => item\.hasData === true\),/.test(read(files.table)) &&
|
||||
!/children\.every\(item => \(item\.missingPointCount \|\| 0\) === 0\)/.test(read(files.table))
|
||||
],
|
||||
[
|
||||
'table keeps harmonic row keys stable while merging returned order results',
|
||||
() =>
|
||||
/normalizeChecksquareResultItemKey/.test(read(files.table)) &&
|
||||
/normalizeChecksquareResultItemKey\([\s\S]*child\.itemKey/.test(read(files.table)) &&
|
||||
/resolveChecksquareHarmonicOrder/.test(read(files.table)) &&
|
||||
/resolveChecksquareHarmonicOrder\(item\) === child\.harmonicOrder/.test(read(files.table))
|
||||
],
|
||||
[
|
||||
'table formats harmonic parent progress before final summary is ready',
|
||||
() =>
|
||||
/resolveChecksquareRowName[\s\S]*getHarmonicProgressText/.test(read(files.table)) &&
|
||||
/已完成 \$\{resolvedCount\}\/\$\{totalCount\}/.test(read(files.table))
|
||||
],
|
||||
[
|
||||
'page keeps selected checksquare detail synced after async row replacement',
|
||||
() =>
|
||||
/syncSelectedItemWithLatestResult/.test(read(files.page)) &&
|
||||
/selectedItem\.value\.itemKey/.test(read(files.page)) &&
|
||||
/mergeChecksquareIndicatorResult\(queryResult\.value/.test(read(files.page))
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
@@ -1,12 +1,21 @@
|
||||
<template>
|
||||
<div class="table-box checksquare-page">
|
||||
<ChecksquareTaskTable
|
||||
ref="taskTableRef"
|
||||
:ledger-tree="ledgerTree"
|
||||
:indicator-tree="indicatorTree"
|
||||
:request-api="querySteadyChecksquareTasks"
|
||||
@create-task="openCreateDialog"
|
||||
@detail="openTaskDetail"
|
||||
/>
|
||||
|
||||
<el-dialog v-model="createDialogVisible" title="新增校验任务" width="1120px" append-to-body destroy-on-close>
|
||||
<div class="checksquare-create-dialog">
|
||||
<ChecksquareWorkbench
|
||||
v-model:form="formState"
|
||||
v-model:ledger-panel-collapsed="ledgerPanelCollapsed"
|
||||
:ledger-tree="ledgerTree"
|
||||
:indicator-tree="indicatorTree"
|
||||
:result="queryResult"
|
||||
:selected-item="selectedItem"
|
||||
:loading="loading"
|
||||
:ledger-keyword="ledgerKeyword"
|
||||
:default-ledger-checked-keys="defaultLedgerCheckedKeys"
|
||||
@@ -16,20 +25,39 @@
|
||||
@ledger-search="handleLedgerSearch"
|
||||
@ledger-change="handleLedgerChange"
|
||||
@indicator-change="handleIndicatorChange"
|
||||
@query="handleQuery"
|
||||
@create="handleCreateTask"
|
||||
@reset="handleReset"
|
||||
@select-item="handleSelectItem"
|
||||
/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="detailDialogVisible" title="校验任务详情" width="1080px" append-to-body destroy-on-close>
|
||||
<div v-loading="loading.detail" class="checksquare-detail-dialog">
|
||||
<ChecksquareSummaryTable
|
||||
:result="taskDetail"
|
||||
:items="taskDetail?.items || []"
|
||||
:loading="loading.detail"
|
||||
@refresh="refreshTaskDetail"
|
||||
@detail="openItemDetail"
|
||||
/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog v-model="itemDetailDialogVisible" title="检测项明细" width="900px" append-to-body destroy-on-close>
|
||||
<ChecksquareDetailPanel :selected-item="selectedItem" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import {
|
||||
createSteadyChecksquareTask,
|
||||
getSteadyChecksquareDetail,
|
||||
getSteadyTrendIndicatorTree,
|
||||
getSteadyTrendLedgerTree,
|
||||
querySteadyChecksquare
|
||||
querySteadyChecksquareTasks
|
||||
} from '@/api/steady/steadyDataView'
|
||||
import type { SteadyDataView } from '@/api/steady/steadyDataView/interface'
|
||||
import {
|
||||
@@ -40,18 +68,15 @@ import {
|
||||
sortSteadyIndicatorTree
|
||||
} from '@/views/steady/steadyDataView/utils/selectionRules'
|
||||
import { normalizeSteadyLedgerTree } from '@/views/steady/steadyDataView/utils/ledgerTree'
|
||||
import ChecksquareDetailPanel from './components/ChecksquareDetailPanel.vue'
|
||||
import ChecksquareSummaryTable from './components/ChecksquareSummaryTable.vue'
|
||||
import ChecksquareTaskTable from './components/ChecksquareTaskTable.vue'
|
||||
import ChecksquareWorkbench from './components/ChecksquareWorkbench.vue'
|
||||
import {
|
||||
buildSteadyChecksquarePayload,
|
||||
buildSteadyChecksquareCreatePayload,
|
||||
defaultChecksquareFormState,
|
||||
validateChecksquareSelection
|
||||
} from './utils/checksquarePayload'
|
||||
import {
|
||||
CHECKSQUARE_HARMONIC_ORDERS,
|
||||
buildPendingChecksquareResult,
|
||||
isChecksquareHarmonicIndicator,
|
||||
mergeChecksquareIndicatorResult
|
||||
} from './utils/checksquareTable'
|
||||
|
||||
defineOptions({
|
||||
name: 'ChecksquareView'
|
||||
@@ -61,7 +86,8 @@ const ledgerTree = ref<SteadyDataView.SteadyLedgerNode[]>([])
|
||||
const indicatorTree = ref<SteadyDataView.SteadyIndicatorNode[]>([])
|
||||
const selectedLedgerNodes = ref<SteadyDataView.SteadyLedgerNode[]>([])
|
||||
const selectedIndicators = ref<SteadyDataView.SteadyIndicatorNode[]>([])
|
||||
const queryResult = ref<SteadyDataView.SteadyChecksquareQueryResult | null>(null)
|
||||
const taskDetail = ref<SteadyDataView.SteadyChecksquareQueryResult | null>(null)
|
||||
const selectedTask = ref<SteadyDataView.SteadyChecksquareTask | null>(null)
|
||||
const selectedItem = ref<SteadyDataView.SteadyChecksquareItem | null>(null)
|
||||
const formState = ref(defaultChecksquareFormState())
|
||||
const ledgerKeyword = ref('')
|
||||
@@ -69,22 +95,20 @@ const ledgerPanelCollapsed = ref(false)
|
||||
const selectorResetKey = ref(0)
|
||||
const defaultLedgerCheckedKeys = ref<string[]>([])
|
||||
const defaultIndicatorCheckedKeys = ref<string[]>([])
|
||||
const createDialogVisible = ref(false)
|
||||
const detailDialogVisible = ref(false)
|
||||
const itemDetailDialogVisible = ref(false)
|
||||
const taskTableRef = ref<InstanceType<typeof ChecksquareTaskTable>>()
|
||||
const loading = reactive({
|
||||
ledger: false,
|
||||
indicator: false,
|
||||
query: false
|
||||
query: false,
|
||||
detail: false
|
||||
})
|
||||
let querySerial = 0
|
||||
let ledgerSearchTimer: ReturnType<typeof setTimeout> | null = null
|
||||
const CHECKSQUARE_HARMONIC_QUERY_CONCURRENCY = 6
|
||||
|
||||
const lineIds = computed(() => collectSelectedLineIds(selectedLedgerNodes.value))
|
||||
|
||||
const refreshPendingResult = () => {
|
||||
queryResult.value = buildPendingChecksquareResult(selectedIndicators.value, formState.value)
|
||||
selectedItem.value = null
|
||||
}
|
||||
|
||||
const unwrapData = <T,>(response: { data: T } | T): T => {
|
||||
if (response && typeof response === 'object' && 'data' in response) {
|
||||
return (response as { data: T }).data
|
||||
@@ -93,11 +117,6 @@ const unwrapData = <T,>(response: { data: T } | T): T => {
|
||||
return response as T
|
||||
}
|
||||
|
||||
const cancelCurrentQuery = () => {
|
||||
querySerial += 1
|
||||
loading.query = false
|
||||
}
|
||||
|
||||
const loadLedgerTree = async (keyword = ledgerKeyword.value) => {
|
||||
loading.ledger = true
|
||||
try {
|
||||
@@ -126,6 +145,10 @@ const loadIndicatorTree = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
const openCreateDialog = () => {
|
||||
createDialogVisible.value = true
|
||||
}
|
||||
|
||||
const handleLedgerSearch = (value: string) => {
|
||||
ledgerKeyword.value = value
|
||||
if (ledgerSearchTimer) clearTimeout(ledgerSearchTimer)
|
||||
@@ -133,81 +156,23 @@ const handleLedgerSearch = (value: string) => {
|
||||
}
|
||||
|
||||
const handleLedgerChange = (nodes: SteadyDataView.SteadyLedgerNode[]) => {
|
||||
cancelCurrentQuery()
|
||||
selectedLedgerNodes.value = nodes
|
||||
}
|
||||
|
||||
const handleIndicatorChange = (nodes: SteadyDataView.SteadyIndicatorNode[]) => {
|
||||
cancelCurrentQuery()
|
||||
selectedIndicators.value = collectLeafIndicators(nodes)
|
||||
refreshPendingResult()
|
||||
}
|
||||
|
||||
const handleSelectItem = (item: SteadyDataView.SteadyChecksquareItem) => {
|
||||
selectedItem.value = item
|
||||
}
|
||||
|
||||
const findChecksquareItemByKey = (
|
||||
items: SteadyDataView.SteadyChecksquareItem[],
|
||||
itemKey: string
|
||||
): SteadyDataView.SteadyChecksquareItem | null => {
|
||||
for (const item of items) {
|
||||
if (item.itemKey === itemKey) return item
|
||||
const childItem = findChecksquareItemByKey(item.children || [], itemKey)
|
||||
if (childItem) return childItem
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
const syncSelectedItemWithLatestResult = () => {
|
||||
if (!selectedItem.value?.itemKey || !queryResult.value) return
|
||||
|
||||
selectedItem.value = findChecksquareItemByKey(queryResult.value.items || [], selectedItem.value.itemKey)
|
||||
}
|
||||
|
||||
const handleReset = () => {
|
||||
cancelCurrentQuery()
|
||||
formState.value = defaultChecksquareFormState()
|
||||
selectedLedgerNodes.value = []
|
||||
selectedIndicators.value = []
|
||||
defaultLedgerCheckedKeys.value = []
|
||||
defaultIndicatorCheckedKeys.value = []
|
||||
queryResult.value = null
|
||||
selectedItem.value = null
|
||||
selectorResetKey.value += 1
|
||||
}
|
||||
|
||||
const runChecksquareHarmonicQuery = async (
|
||||
indicator: SteadyDataView.SteadyIndicatorNode,
|
||||
currentQuerySerial: number
|
||||
) => {
|
||||
const harmonicOrders = [...CHECKSQUARE_HARMONIC_ORDERS]
|
||||
let nextOrderIndex = 0
|
||||
const workers = Array.from({
|
||||
length: Math.min(CHECKSQUARE_HARMONIC_QUERY_CONCURRENCY, harmonicOrders.length)
|
||||
}).map(async () => {
|
||||
while (currentQuerySerial === querySerial) {
|
||||
const orderIndex = nextOrderIndex
|
||||
nextOrderIndex += 1
|
||||
if (orderIndex >= harmonicOrders.length) return
|
||||
|
||||
const harmonicOrder = harmonicOrders[orderIndex]
|
||||
|
||||
const payload = buildSteadyChecksquarePayload(lineIds.value[0], [indicator], formState.value, harmonicOrder)
|
||||
const response = await querySteadyChecksquare(payload)
|
||||
if (currentQuerySerial !== querySerial) return
|
||||
|
||||
// 谐波 2-50 次请求耗时差异较大,单次返回后立即合并,避免等待全部次数完成才刷新表格。
|
||||
queryResult.value = mergeChecksquareIndicatorResult(queryResult.value, indicator, unwrapData(response))
|
||||
syncSelectedItemWithLatestResult()
|
||||
}
|
||||
})
|
||||
|
||||
await Promise.all(workers)
|
||||
}
|
||||
|
||||
const handleQuery = async () => {
|
||||
const handleCreateTask = async () => {
|
||||
const selectionError = validateChecksquareSelection({
|
||||
lineIds: lineIds.value,
|
||||
indicators: selectedIndicators.value,
|
||||
@@ -218,36 +183,44 @@ const handleQuery = async () => {
|
||||
return
|
||||
}
|
||||
|
||||
const currentQuerySerial = ++querySerial
|
||||
const queryIndicators = [...selectedIndicators.value]
|
||||
loading.query = true
|
||||
refreshPendingResult()
|
||||
selectedItem.value = null
|
||||
|
||||
try {
|
||||
// 按指标串行校验,保证结果列表能随单个指标完成逐步回填。
|
||||
for (const indicator of queryIndicators) {
|
||||
if (currentQuerySerial !== querySerial) return
|
||||
|
||||
if (isChecksquareHarmonicIndicator(indicator)) {
|
||||
await runChecksquareHarmonicQuery(indicator, currentQuerySerial)
|
||||
continue
|
||||
}
|
||||
|
||||
const payload = buildSteadyChecksquarePayload(lineIds.value[0], [indicator], formState.value)
|
||||
const response = await querySteadyChecksquare(payload)
|
||||
if (currentQuerySerial !== querySerial) return
|
||||
|
||||
queryResult.value = mergeChecksquareIndicatorResult(queryResult.value, indicator, unwrapData(response))
|
||||
syncSelectedItemWithLatestResult()
|
||||
}
|
||||
// 新增校验任务会写入结果表,成功后刷新历史任务列表展示落库记录。
|
||||
await createSteadyChecksquareTask(
|
||||
buildSteadyChecksquareCreatePayload(lineIds.value[0], selectedIndicators.value, formState.value)
|
||||
)
|
||||
ElMessage.success('新增校验任务成功')
|
||||
createDialogVisible.value = false
|
||||
taskTableRef.value?.refresh()
|
||||
} finally {
|
||||
if (currentQuerySerial === querySerial) {
|
||||
loading.query = false
|
||||
}
|
||||
}
|
||||
|
||||
const refreshTaskDetail = async () => {
|
||||
if (!selectedTask.value?.taskId) return
|
||||
|
||||
loading.detail = true
|
||||
try {
|
||||
const response = await getSteadyChecksquareDetail(selectedTask.value.taskId)
|
||||
taskDetail.value = unwrapData(response)
|
||||
} finally {
|
||||
loading.detail = false
|
||||
}
|
||||
}
|
||||
|
||||
const openTaskDetail = async (row: SteadyDataView.SteadyChecksquareTask) => {
|
||||
selectedTask.value = row
|
||||
taskDetail.value = null
|
||||
detailDialogVisible.value = true
|
||||
await refreshTaskDetail()
|
||||
}
|
||||
|
||||
const openItemDetail = (item: SteadyDataView.SteadyChecksquareItem) => {
|
||||
selectedItem.value = item
|
||||
itemDetailDialogVisible.value = true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadLedgerTree()
|
||||
loadIndicatorTree()
|
||||
@@ -256,8 +229,18 @@ onMounted(() => {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.checksquare-page {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.checksquare-create-dialog {
|
||||
height: 560px;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.checksquare-detail-dialog {
|
||||
height: 560px;
|
||||
min-height: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -29,24 +29,17 @@ export const collectChecksquareIndicatorCodes = (indicators: SteadyDataView.Stea
|
||||
return Array.from(new Set(indicators.map(item => item.indicatorCode).filter(Boolean))) as string[]
|
||||
}
|
||||
|
||||
export const buildSteadyChecksquarePayload = (
|
||||
export const buildSteadyChecksquareCreatePayload = (
|
||||
lineId: string,
|
||||
indicators: SteadyDataView.SteadyIndicatorNode[],
|
||||
formState: ChecksquareFormState,
|
||||
harmonicOrder?: number
|
||||
): SteadyDataView.SteadyChecksquareQueryParams => {
|
||||
const payload: SteadyDataView.SteadyChecksquareQueryParams = {
|
||||
formState: ChecksquareFormState
|
||||
): SteadyDataView.SteadyChecksquareCreateParams => {
|
||||
return {
|
||||
lineId,
|
||||
indicatorCodes: collectChecksquareIndicatorCodes(indicators),
|
||||
timeStart: (formState.timeRange[0] || '').replace(/\.[^.]+$/, ''),
|
||||
timeEnd: (formState.timeRange[1] || '').replace(/\.[^.]+$/, '')
|
||||
}
|
||||
|
||||
if (harmonicOrder) {
|
||||
payload.harmonicOrders = [harmonicOrder]
|
||||
}
|
||||
|
||||
return payload
|
||||
}
|
||||
|
||||
export const validateChecksquareSelection = (params: {
|
||||
|
||||
@@ -81,7 +81,13 @@ export const collectMissingSegments = (item: SteadyDataView.SteadyChecksquareIte
|
||||
}
|
||||
|
||||
export const hasChecksquareDetail = (item: SteadyDataView.SteadyChecksquareItem) => {
|
||||
return (item.statDetails || []).some(detail => (detail.segments || []).length)
|
||||
return (
|
||||
Boolean(item.itemId) ||
|
||||
Boolean(item.abnormalPointCount) ||
|
||||
Boolean(item.harmonicParityAbnormalPointCount) ||
|
||||
Boolean(item.missingPointCount) ||
|
||||
(item.statDetails || []).some(detail => (detail.segments || []).length)
|
||||
)
|
||||
}
|
||||
|
||||
const hasChecksquareHarmonicOrderRange = (indicator: SteadyDataView.SteadyIndicatorNode) => {
|
||||
|
||||
@@ -0,0 +1,46 @@
|
||||
import type { SteadyDataView } from '@/api/steady/steadyDataView/interface'
|
||||
|
||||
export interface ChecksquareTaskSearchParams extends SteadyDataView.SteadyChecksquareTaskQueryParams {
|
||||
taskTimeRange?: string[]
|
||||
}
|
||||
|
||||
export const buildChecksquareTaskQueryParams = (
|
||||
params: ChecksquareTaskSearchParams
|
||||
): SteadyDataView.SteadyChecksquareTaskQueryParams => {
|
||||
const { taskTimeRange, ...rest } = params
|
||||
const queryParams: SteadyDataView.SteadyChecksquareTaskQueryParams = { ...rest }
|
||||
|
||||
if (taskTimeRange?.[0]) queryParams.timeStart = taskTimeRange[0]
|
||||
if (taskTimeRange?.[1]) queryParams.timeEnd = taskTimeRange[1]
|
||||
|
||||
return queryParams
|
||||
}
|
||||
|
||||
export const formatChecksquareTaskStatus = (status?: string) => {
|
||||
if (!status) return '--'
|
||||
if (status === 'SUCCESS') return '成功'
|
||||
if (status === 'FAILED') return '失败'
|
||||
if (status === 'RUNNING') return '执行中'
|
||||
|
||||
return status
|
||||
}
|
||||
|
||||
export const resolveChecksquareTaskStatusType = (status?: string) => {
|
||||
if (status === 'SUCCESS') return 'success'
|
||||
if (status === 'FAILED') return 'danger'
|
||||
if (status === 'RUNNING') return 'warning'
|
||||
|
||||
return 'info'
|
||||
}
|
||||
|
||||
export const formatChecksquarePercent = (value?: number | null) => {
|
||||
if (value === null || value === undefined || !Number.isFinite(Number(value))) return '--'
|
||||
|
||||
return `${(Number(value) * 100).toFixed(2)}%`
|
||||
}
|
||||
|
||||
export const resolveChecksquareText = (value: unknown) => {
|
||||
if (value === null || value === undefined || value === '') return '--'
|
||||
|
||||
return String(value)
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
const { resolveRuntimeStrategy } = require('./path-utils');
|
||||
const { resolvePackagedRuntime, resolveRuntimeStrategy } = require('./path-utils');
|
||||
|
||||
/**
|
||||
* 配置文件生成器
|
||||
@@ -10,17 +10,15 @@ class ConfigGenerator {
|
||||
constructor() {
|
||||
// 开发环境:项目根目录
|
||||
// 打包后:应用根目录(最终交付目录)
|
||||
const isDev = !process.resourcesPath;
|
||||
const baseDir = isDev
|
||||
? path.join(__dirname, '..')
|
||||
: path.dirname(process.resourcesPath);
|
||||
const runtime = resolvePackagedRuntime();
|
||||
const baseDir = runtime.baseDir;
|
||||
const pathStrategy = resolveRuntimeStrategy(baseDir);
|
||||
|
||||
// 开发环境:build/extraResources/java
|
||||
// 打包后:resources/extraResources/java
|
||||
this.javaPath = isDev
|
||||
this.javaPath = !runtime.isPackaged
|
||||
? path.join(baseDir, 'build', 'extraResources', 'java')
|
||||
: path.join(process.resourcesPath, 'extraResources', 'java');
|
||||
: path.join(runtime.resourcesPath, 'extraResources', 'java');
|
||||
this.templatePath = path.join(this.javaPath, 'application.yml.template');
|
||||
this.configPath = path.join(this.javaPath, 'application.yml');
|
||||
this.pathStrategy = pathStrategy;
|
||||
@@ -48,6 +46,7 @@ class ConfigGenerator {
|
||||
* 生成配置文件
|
||||
* @param {object} options - 配置选项
|
||||
* @param {number} options.mysqlPort - MySQL 端口
|
||||
* @param {number} options.influxdbPort - InfluxDB 端口
|
||||
* @param {number} options.javaPort - Java 应用端口
|
||||
* @param {number} options.websocketPort - WebSocket 端口
|
||||
* @param {string} options.mysqlPassword - MySQL 密码
|
||||
@@ -77,6 +76,11 @@ class ConfigGenerator {
|
||||
template = template.replace(/\{\{MYSQL_PORT\}\}/g, options.mysqlPort);
|
||||
template = template.replace(/localhost:3306/g, `localhost:${options.mysqlPort}`);
|
||||
}
|
||||
if (options.influxdbPort) {
|
||||
template = template.replace(/\{\{INFLUXDB_PORT\}\}/g, options.influxdbPort);
|
||||
template = template.replace(/127\.0\.0\.1:18086/g, `127.0.0.1:${options.influxdbPort}`);
|
||||
template = template.replace(/localhost:18086/g, `localhost:${options.influxdbPort}`);
|
||||
}
|
||||
if (options.javaPort) {
|
||||
template = template.replace(/port:\s*18092/g, `port: ${options.javaPort}`);
|
||||
}
|
||||
@@ -96,6 +100,7 @@ class ConfigGenerator {
|
||||
console.log('[ConfigGenerator] Path mode:', this.pathStrategy.usesSafePaths ? 'safe-data-root' : 'app-local-data');
|
||||
console.log('[ConfigGenerator] Data path:', this.dataPath);
|
||||
console.log('[ConfigGenerator] MySQL port:', options.mysqlPort || 3306);
|
||||
console.log('[ConfigGenerator] InfluxDB port:', options.influxdbPort || 18086);
|
||||
console.log('[ConfigGenerator] MySQL password:', options.mysqlPassword || 'njcnpqs');
|
||||
console.log('[ConfigGenerator] Java port:', options.javaPort || 18093);
|
||||
console.log('[ConfigGenerator] WebSocket port:', options.websocketPort || 7778);
|
||||
@@ -104,6 +109,7 @@ class ConfigGenerator {
|
||||
configPath: this.configPath,
|
||||
dataPath: this.dataPath,
|
||||
mysqlPort: options.mysqlPort || 3306,
|
||||
influxdbPort: options.influxdbPort || 18086,
|
||||
javaPort: options.javaPort || 18093,
|
||||
websocketPort: options.websocketPort || 7778
|
||||
});
|
||||
@@ -142,15 +148,13 @@ class ConfigGenerator {
|
||||
*/
|
||||
copyBuiltInTemplates() {
|
||||
try {
|
||||
const isDev = !process.resourcesPath;
|
||||
const baseDir = isDev
|
||||
? path.join(__dirname, '..')
|
||||
: path.dirname(process.resourcesPath);
|
||||
const runtime = resolvePackagedRuntime();
|
||||
const baseDir = runtime.baseDir;
|
||||
|
||||
// 内置模板源路径
|
||||
const templateSource = isDev
|
||||
const templateSource = !runtime.isPackaged
|
||||
? path.join(baseDir, 'build', 'extraResources', 'templates')
|
||||
: path.join(process.resourcesPath, 'extraResources', 'templates');
|
||||
: path.join(runtime.resourcesPath, 'extraResources', 'templates');
|
||||
|
||||
// 目标路径:用户数据目录/template/
|
||||
const templateDest = path.join(this.dataPath, 'template');
|
||||
|
||||
94
scripts/contracts/check-influxdb-startup-contract.mjs
Normal file
94
scripts/contracts/check-influxdb-startup-contract.mjs
Normal file
@@ -0,0 +1,94 @@
|
||||
import fs from 'node:fs'
|
||||
import path from 'node:path'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
const __dirname = path.dirname(fileURLToPath(import.meta.url))
|
||||
const rootDir = path.resolve(__dirname, '..', '..')
|
||||
|
||||
const read = relativePath => fs.readFileSync(path.join(rootDir, relativePath), 'utf-8')
|
||||
|
||||
const files = {
|
||||
manager: 'scripts/influxdb-process-manager.js',
|
||||
mysqlManager: 'scripts/mysql-process-manager.js',
|
||||
javaRunner: 'scripts/java-runner.js',
|
||||
lifecycle: 'electron/preload/lifecycle.js',
|
||||
configGenerator: 'scripts/config-generator.js',
|
||||
javaTemplate: 'build/extraResources/java/application.yml.template',
|
||||
influxdbBat: 'build/extraResources/influxdb-1.7.0/start-influxdb.bat',
|
||||
startup: 'scripts/startup-manager.js',
|
||||
builder: 'cmd/builder.json'
|
||||
}
|
||||
|
||||
const failures = []
|
||||
|
||||
if (!fs.existsSync(path.join(rootDir, files.manager))) {
|
||||
failures.push('scripts/influxdb-process-manager.js should exist')
|
||||
} else {
|
||||
const source = read(files.manager)
|
||||
const checks = [
|
||||
['manager exports InfluxDBProcessManager', /module\.exports\s*=\s*InfluxDBProcessManager/.test(source)],
|
||||
['manager starts InfluxDB through cmd.exe and start-influxdb.bat', /cmd\.exe/.test(source) && /start-influxdb\.bat/.test(source) && /spawn\(/.test(source)],
|
||||
['manager records process ownership', /\.running-process\.json/.test(source)],
|
||||
['manager can stop tracked process', /stopInfluxDBProcess/.test(source) && /terminateTrackedProcess/.test(source)]
|
||||
]
|
||||
checks.forEach(([message, pass]) => {
|
||||
if (!pass) failures.push(message)
|
||||
})
|
||||
}
|
||||
|
||||
const lifecycleSource = read(files.lifecycle)
|
||||
const configGeneratorSource = read(files.configGenerator)
|
||||
const runtimePathSources = [
|
||||
['InfluxDB process manager', read(files.manager)],
|
||||
['MySQL process manager', read(files.mysqlManager)],
|
||||
['Java runner', read(files.javaRunner)],
|
||||
['config generator', configGeneratorSource]
|
||||
]
|
||||
const javaTemplateSource = read(files.javaTemplate)
|
||||
const startupSource = read(files.startup)
|
||||
const builderSource = read(files.builder)
|
||||
const influxdbBatSource = read(files.influxdbBat)
|
||||
|
||||
const lifecycleChecks = [
|
||||
['lifecycle loads InfluxDBProcessManager', /InfluxDBProcessManager/.test(lifecycleSource)],
|
||||
['lifecycle stores influxdbProcessManager', /this\.influxdbProcessManager/.test(lifecycleSource)],
|
||||
[
|
||||
'lifecycle starts InfluxDB after MySQL before Java port detection',
|
||||
/ensureServiceRunning\([\s\S]*?this\.influxdbPort\s*=\s*await\s*this\.influxdbProcessManager\.ensureServiceRunning[\s\S]*?findAvailablePort\(18093/.test(
|
||||
lifecycleSource
|
||||
)
|
||||
],
|
||||
['lifecycle passes influxdbPort to config generator', /influxdbPort:\s*this\.influxdbPort/.test(lifecycleSource)],
|
||||
['lifecycle stops InfluxDB during cleanup', /stopInfluxDBProcess/.test(lifecycleSource)]
|
||||
]
|
||||
|
||||
const startupChecks = [
|
||||
['startup has InfluxDB port step', /check-influxdb-port/.test(startupSource)],
|
||||
['startup has InfluxDB wait step', /wait-influxdb/.test(startupSource)]
|
||||
]
|
||||
|
||||
const packageChecks = [
|
||||
['windows package includes InfluxDB resources', /build\/extraResources\/influxdb-1\.7\.0/.test(builderSource)]
|
||||
]
|
||||
|
||||
const configChecks = [
|
||||
['config generator replaces InfluxDB port placeholder', /INFLUXDB_PORT/.test(configGeneratorSource)],
|
||||
['java template defines steady InfluxDB url placeholder', /steady:[\s\S]*influxdb:[\s\S]*url:\s*http:\/\/127\.0\.0\.1:\{\{INFLUXDB_PORT\}\}/.test(javaTemplateSource)],
|
||||
['InfluxDB bat accepts runtime config path argument', /%~1/.test(influxdbBatSource) && /influxd\.exe\s+-config\s+/.test(influxdbBatSource)]
|
||||
]
|
||||
|
||||
const runtimePathChecks = runtimePathSources.map(([name, source]) => [
|
||||
`${name} should not treat any process.resourcesPath as packaged runtime`,
|
||||
!/!\s*process\.resourcesPath/.test(source)
|
||||
])
|
||||
|
||||
;[...lifecycleChecks, ...startupChecks, ...configChecks, ...runtimePathChecks, ...packageChecks].forEach(([message, pass]) => {
|
||||
if (!pass) failures.push(message)
|
||||
})
|
||||
|
||||
if (failures.length > 0) {
|
||||
console.error(`InfluxDB startup contract failed:\n- ${failures.join('\n- ')}`)
|
||||
process.exit(1)
|
||||
}
|
||||
|
||||
console.log('InfluxDB startup contract passed')
|
||||
410
scripts/influxdb-process-manager.js
Normal file
410
scripts/influxdb-process-manager.js
Normal file
@@ -0,0 +1,410 @@
|
||||
const { spawn, execFile } = require('child_process');
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
const { resolvePackagedRuntime, resolveRuntimeStrategy } = require('./path-utils');
|
||||
|
||||
/**
|
||||
* InfluxDB 进程管理器。
|
||||
* 参照 MySQL 绿色包模式,随应用启动本地 InfluxDB,退出时只清理本应用记录的进程。
|
||||
*/
|
||||
class InfluxDBProcessManager {
|
||||
constructor(logWindowManager = null) {
|
||||
const runtime = resolvePackagedRuntime();
|
||||
const baseDir = runtime.baseDir;
|
||||
const sourceInfluxdbPath = !runtime.isPackaged
|
||||
? path.join(baseDir, 'build', 'extraResources', 'influxdb-1.7.0')
|
||||
: path.join(baseDir, 'influxdb-1.7.0');
|
||||
const pathStrategy = resolveRuntimeStrategy(baseDir);
|
||||
|
||||
this.baseDir = baseDir;
|
||||
this.pathStrategy = pathStrategy;
|
||||
this.sourceInfluxdbPath = sourceInfluxdbPath;
|
||||
this.influxdbPath = pathStrategy.usesSafePaths
|
||||
? path.join(pathStrategy.safeRuntimeRoot, 'influxdb-1.7.0')
|
||||
: sourceInfluxdbPath;
|
||||
this.dataPath = path.join(this.influxdbPath, 'data');
|
||||
this.metaPath = path.join(this.influxdbPath, 'meta');
|
||||
this.walPath = path.join(this.influxdbPath, 'wal');
|
||||
this.configFile = path.join(this.influxdbPath, 'influxdb.runtime.conf');
|
||||
this.processRecordFile = path.join(this.influxdbPath, '.running-process.json');
|
||||
this.logWindowManager = logWindowManager;
|
||||
this.influxdbProcess = null;
|
||||
this.currentPort = null;
|
||||
}
|
||||
|
||||
sleep(ms) {
|
||||
return new Promise(resolve => setTimeout(resolve, ms));
|
||||
}
|
||||
|
||||
log(type, message) {
|
||||
console.log(`[InfluxDB] ${message}`);
|
||||
if (this.logWindowManager) {
|
||||
this.logWindowManager.addLog(type, `[InfluxDB] ${message}`);
|
||||
}
|
||||
}
|
||||
|
||||
normalizeComparablePath(target = '') {
|
||||
return String(target).replace(/"/g, '').replace(/\//g, '\\').toLowerCase();
|
||||
}
|
||||
|
||||
copyDirectorySync(sourceDir, targetDir) {
|
||||
if (!fs.existsSync(sourceDir)) {
|
||||
return;
|
||||
}
|
||||
|
||||
fs.mkdirSync(targetDir, { recursive: true });
|
||||
|
||||
const entries = fs.readdirSync(sourceDir, { withFileTypes: true });
|
||||
entries.forEach((entry) => {
|
||||
const sourcePath = path.join(sourceDir, entry.name);
|
||||
const targetPath = path.join(targetDir, entry.name);
|
||||
|
||||
if (entry.isDirectory()) {
|
||||
this.copyDirectorySync(sourcePath, targetPath);
|
||||
return;
|
||||
}
|
||||
|
||||
let shouldCopy = !fs.existsSync(targetPath);
|
||||
if (!shouldCopy) {
|
||||
const sourceStat = fs.statSync(sourcePath);
|
||||
const targetStat = fs.statSync(targetPath);
|
||||
shouldCopy = sourceStat.size !== targetStat.size || sourceStat.mtimeMs > targetStat.mtimeMs;
|
||||
}
|
||||
|
||||
if (shouldCopy) {
|
||||
fs.copyFileSync(sourcePath, targetPath);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ensureRuntimeEnvironment() {
|
||||
if (!fs.existsSync(this.sourceInfluxdbPath)) {
|
||||
throw new Error(`InfluxDB 目录不存在: ${this.sourceInfluxdbPath}`);
|
||||
}
|
||||
|
||||
if (this.pathStrategy.usesSafePaths) {
|
||||
this.log('system', '检测到应用路径包含非 ASCII 字符,启用 InfluxDB 英文安全运行目录');
|
||||
this.log('system', `InfluxDB 源目录: ${this.sourceInfluxdbPath}`);
|
||||
this.log('system', `InfluxDB 运行目录: ${this.influxdbPath}`);
|
||||
this.copyDirectorySync(this.sourceInfluxdbPath, this.influxdbPath);
|
||||
}
|
||||
|
||||
fs.mkdirSync(this.dataPath, { recursive: true });
|
||||
fs.mkdirSync(this.metaPath, { recursive: true });
|
||||
fs.mkdirSync(this.walPath, { recursive: true });
|
||||
}
|
||||
|
||||
saveProcessRecord(record = {}) {
|
||||
try {
|
||||
fs.mkdirSync(path.dirname(this.processRecordFile), { recursive: true });
|
||||
fs.writeFileSync(this.processRecordFile, JSON.stringify(record, null, 2), 'utf-8');
|
||||
} catch (error) {
|
||||
this.log('warn', `写入 InfluxDB 进程标记失败: ${error.message}`);
|
||||
}
|
||||
}
|
||||
|
||||
getProcessRecord() {
|
||||
try {
|
||||
if (!fs.existsSync(this.processRecordFile)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return JSON.parse(fs.readFileSync(this.processRecordFile, 'utf-8'));
|
||||
} catch (error) {
|
||||
this.log('warn', `读取 InfluxDB 进程标记失败: ${error.message}`);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
clearProcessRecord() {
|
||||
try {
|
||||
if (fs.existsSync(this.processRecordFile)) {
|
||||
fs.unlinkSync(this.processRecordFile);
|
||||
}
|
||||
} catch (error) {
|
||||
this.log('warn', `清理 InfluxDB 进程标记失败: ${error.message}`);
|
||||
}
|
||||
}
|
||||
|
||||
execFileCommand(command, args = []) {
|
||||
return new Promise((resolve, reject) => {
|
||||
execFile(command, args, { encoding: 'utf8', windowsHide: true }, (error, stdout, stderr) => {
|
||||
if (error) {
|
||||
const err = new Error(error.message || stderr || stdout || 'Command execution failed');
|
||||
err.code = error.code;
|
||||
err.stdout = stdout;
|
||||
err.stderr = stderr;
|
||||
reject(err);
|
||||
} else {
|
||||
resolve({ stdout, stderr });
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async getProcessInfoByPid(pid) {
|
||||
if (!pid) {
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const script = `$proc = Get-CimInstance Win32_Process -Filter "ProcessId = ${pid}"; if ($proc) { [PSCustomObject]@{ executablePath = $proc.ExecutablePath; commandLine = $proc.CommandLine; name = $proc.Name } | ConvertTo-Json -Compress }`;
|
||||
const { stdout } = await this.execFileCommand('powershell.exe', ['-NoProfile', '-Command', script]);
|
||||
const raw = (stdout || '').trim();
|
||||
return raw ? JSON.parse(raw) : null;
|
||||
} catch (error) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
async isOwnInfluxDBProcess(pid, record = this.getProcessRecord()) {
|
||||
const processInfo = await this.getProcessInfoByPid(pid);
|
||||
if (!processInfo) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const expectedExe = this.normalizeComparablePath(path.join(this.influxdbPath, 'influxd.exe'));
|
||||
const expectedBat = this.normalizeComparablePath(path.join(this.influxdbPath, 'start-influxdb.bat'));
|
||||
const expectedConfig = this.normalizeComparablePath((record && record.configFile) || this.configFile);
|
||||
const executablePath = this.normalizeComparablePath(processInfo.executablePath);
|
||||
const commandLine = this.normalizeComparablePath(processInfo.commandLine);
|
||||
|
||||
return (
|
||||
(executablePath === expectedExe || commandLine.includes(expectedBat)) &&
|
||||
(!expectedConfig || commandLine.includes(expectedConfig))
|
||||
);
|
||||
}
|
||||
|
||||
async waitForProcessExit(pid, timeoutMs = 3000) {
|
||||
const deadline = Date.now() + timeoutMs;
|
||||
|
||||
while (Date.now() < deadline) {
|
||||
const processInfo = await this.getProcessInfoByPid(pid);
|
||||
if (!processInfo) {
|
||||
return true;
|
||||
}
|
||||
await this.sleep(200);
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
async terminateTrackedProcess(record = this.getProcessRecord(), reason = '正在停止 InfluxDB 进程...') {
|
||||
const pid = this.influxdbProcess?.pid || record?.pid;
|
||||
const port = this.currentPort || record?.port;
|
||||
|
||||
if (!pid) {
|
||||
this.log('system', '未找到可清理的 InfluxDB 进程标记');
|
||||
this.clearProcessRecord();
|
||||
return false;
|
||||
}
|
||||
|
||||
const isOwnProcess = await this.isOwnInfluxDBProcess(pid, record);
|
||||
if (!isOwnProcess) {
|
||||
this.log('warn', `PID ${pid} 不是当前应用的 InfluxDB 进程,跳过清理`);
|
||||
this.clearProcessRecord();
|
||||
if (this.influxdbProcess && this.influxdbProcess.pid === pid) {
|
||||
this.influxdbProcess = null;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
this.log('system', `${reason} PID=${pid}${port ? `, 端口=${port}` : ''}`);
|
||||
try {
|
||||
await this.execFileCommand('taskkill.exe', ['/F', '/T', '/PID', String(pid)]);
|
||||
await this.waitForProcessExit(pid, 3000);
|
||||
this.log('success', 'InfluxDB 进程已停止');
|
||||
} finally {
|
||||
this.clearProcessRecord();
|
||||
if (this.influxdbProcess && this.influxdbProcess.pid === pid) {
|
||||
this.influxdbProcess = null;
|
||||
}
|
||||
this.currentPort = null;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
async checkAndKillOrphanProcess() {
|
||||
const record = this.getProcessRecord();
|
||||
if (!record || !record.pid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const isOwnProcess = await this.isOwnInfluxDBProcess(record.pid, record);
|
||||
if (!isOwnProcess) {
|
||||
this.log('warn', `检测到失效的 InfluxDB 进程标记 PID=${record.pid},已跳过清理并移除标记`);
|
||||
this.clearProcessRecord();
|
||||
return;
|
||||
}
|
||||
|
||||
this.log('warn', `检测到当前应用上次遗留的 InfluxDB 进程 PID=${record.pid},开始定向清理...`);
|
||||
await this.terminateTrackedProcess(record, '正在清理当前应用遗留的 InfluxDB 进程...');
|
||||
}
|
||||
|
||||
generateConfig(port) {
|
||||
const normalizePath = target => target.replace(/\\/g, '/');
|
||||
const config = `reporting-disabled = true
|
||||
bind-address = "127.0.0.1:8088"
|
||||
|
||||
[meta]
|
||||
dir = "${normalizePath(this.metaPath)}"
|
||||
|
||||
[data]
|
||||
dir = "${normalizePath(this.dataPath)}"
|
||||
wal-dir = "${normalizePath(this.walPath)}"
|
||||
|
||||
[http]
|
||||
enabled = true
|
||||
bind-address = "127.0.0.1:${port}"
|
||||
auth-enabled = false
|
||||
log-enabled = true
|
||||
`;
|
||||
|
||||
fs.writeFileSync(this.configFile, config, 'utf-8');
|
||||
this.log('system', `生成 InfluxDB 配置文件,端口: ${port}`);
|
||||
}
|
||||
|
||||
async startInfluxDBProcess(port) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const influxd = path.join(this.influxdbPath, 'influxd.exe');
|
||||
const startBat = path.join(this.influxdbPath, 'start-influxdb.bat');
|
||||
|
||||
this.log('system', '正在启动 InfluxDB 进程...');
|
||||
this.log('system', `可执行文件: ${influxd}`);
|
||||
this.log('system', `启动脚本: ${startBat}`);
|
||||
this.log('system', `配置文件: ${this.configFile}`);
|
||||
|
||||
if (!fs.existsSync(influxd)) {
|
||||
return reject(new Error(`influxd.exe 不存在: ${influxd}`));
|
||||
}
|
||||
if (!fs.existsSync(startBat)) {
|
||||
return reject(new Error(`start-influxdb.bat 不存在: ${startBat}`));
|
||||
}
|
||||
if (!fs.existsSync(this.configFile)) {
|
||||
return reject(new Error(`配置文件不存在: ${this.configFile}`));
|
||||
}
|
||||
|
||||
const influxdbProcess = spawn('cmd.exe', ['/d', '/s', '/c', 'call', startBat, this.configFile], {
|
||||
cwd: this.influxdbPath,
|
||||
stdio: ['ignore', 'pipe', 'pipe'],
|
||||
windowsHide: true
|
||||
});
|
||||
this.influxdbProcess = influxdbProcess;
|
||||
this.currentPort = port;
|
||||
|
||||
this.saveProcessRecord({
|
||||
pid: influxdbProcess.pid,
|
||||
port,
|
||||
executablePath: influxd,
|
||||
configFile: this.configFile,
|
||||
influxdbPath: this.influxdbPath,
|
||||
createdAt: new Date().toISOString()
|
||||
});
|
||||
|
||||
let startupComplete = false;
|
||||
let startupTimeout = null;
|
||||
|
||||
const completeStartup = () => {
|
||||
if (!startupComplete) {
|
||||
startupComplete = true;
|
||||
if (startupTimeout) clearTimeout(startupTimeout);
|
||||
this.log('success', 'InfluxDB 进程已就绪');
|
||||
resolve(true);
|
||||
}
|
||||
};
|
||||
|
||||
const handleOutput = (data) => {
|
||||
const msg = data.toString().trim();
|
||||
if (!msg) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (msg.includes('Listening on HTTP') || msg.includes('Listening for signals')) {
|
||||
completeStartup();
|
||||
}
|
||||
|
||||
if (!msg.includes('[I]') || msg.includes('Listening') || msg.includes('error')) {
|
||||
this.log('system', `[influxd] ${msg}`);
|
||||
}
|
||||
};
|
||||
|
||||
influxdbProcess.stdout.on('data', handleOutput);
|
||||
influxdbProcess.stderr.on('data', handleOutput);
|
||||
|
||||
influxdbProcess.on('error', (err) => {
|
||||
this.log('error', `InfluxDB 进程启动失败: ${err.message}`);
|
||||
this.clearProcessRecord();
|
||||
this.influxdbProcess = null;
|
||||
reject(err);
|
||||
});
|
||||
|
||||
influxdbProcess.on('exit', (code, signal) => {
|
||||
this.log('system', `InfluxDB 进程退出,代码: ${code}, 信号: ${signal}`);
|
||||
const record = this.getProcessRecord();
|
||||
if (record && record.pid === influxdbProcess.pid) {
|
||||
this.clearProcessRecord();
|
||||
}
|
||||
this.influxdbProcess = null;
|
||||
this.currentPort = null;
|
||||
|
||||
if (!startupComplete) {
|
||||
reject(new Error(`InfluxDB 进程异常退出,代码: ${code}`));
|
||||
}
|
||||
});
|
||||
|
||||
startupTimeout = setTimeout(completeStartup, 15000);
|
||||
});
|
||||
}
|
||||
|
||||
async stopInfluxDBProcess() {
|
||||
const record = this.getProcessRecord();
|
||||
if (!this.influxdbProcess && !record) {
|
||||
this.log('system', 'InfluxDB 进程未运行');
|
||||
return;
|
||||
}
|
||||
|
||||
await this.terminateTrackedProcess(record, '正在停止当前应用自己的 InfluxDB 进程...');
|
||||
}
|
||||
|
||||
isInfluxDBRunning() {
|
||||
return this.influxdbProcess !== null && !this.influxdbProcess.killed;
|
||||
}
|
||||
|
||||
async ensureServiceRunning(findAvailablePort, waitForPort) {
|
||||
this.ensureRuntimeEnvironment();
|
||||
|
||||
this.log('system', '开始 InfluxDB 进程检查流程(进程模式)');
|
||||
this.log('system', `路径策略: ${this.pathStrategy.usesSafePaths ? '英文安全路径模式' : '应用目录直启模式'}`);
|
||||
this.log('system', `InfluxDB 路径: ${this.influxdbPath}`);
|
||||
this.log('system', `配置文件: ${this.configFile}`);
|
||||
|
||||
if (this.isInfluxDBRunning()) {
|
||||
const port = this.currentPort || 18086;
|
||||
this.log('success', `InfluxDB 进程已在运行,端口: ${port}`);
|
||||
return port;
|
||||
}
|
||||
|
||||
await this.checkAndKillOrphanProcess();
|
||||
|
||||
const port = await findAvailablePort(18086, 100);
|
||||
if (port === -1) {
|
||||
throw new Error('无法找到可用的 InfluxDB 端口(18086-18185 全部被占用)');
|
||||
}
|
||||
this.log('system', `找到可用端口: ${port}`);
|
||||
|
||||
this.generateConfig(port);
|
||||
await this.startInfluxDBProcess(port);
|
||||
|
||||
this.log('system', `等待端口 ${port} 就绪...`);
|
||||
const portReady = await waitForPort(port, 30000);
|
||||
if (!portReady) {
|
||||
throw new Error(`InfluxDB 端口 ${port} 未能在 30 秒内就绪`);
|
||||
}
|
||||
|
||||
this.log('success', `InfluxDB 进程启动成功,端口: ${port}`);
|
||||
return port;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = InfluxDBProcessManager;
|
||||
@@ -1,6 +1,7 @@
|
||||
const { spawn, exec, execFile } = require('child_process');
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
const { resolvePackagedRuntime } = require('./path-utils');
|
||||
|
||||
/**
|
||||
* Java 运行器 - 用于调用便携式 JRE 运行 Java 程序
|
||||
@@ -10,10 +11,7 @@ class JavaRunner {
|
||||
// 在开发与打包后均可解析到应用根目录下的 jre 目录
|
||||
// 开发环境:项目根目录
|
||||
// 打包后:应用根目录(最终交付目录)
|
||||
const isDev = !process.resourcesPath;
|
||||
const baseDir = isDev
|
||||
? path.join(__dirname, '..')
|
||||
: path.dirname(process.resourcesPath);
|
||||
const { baseDir } = resolvePackagedRuntime();
|
||||
this.baseDir = baseDir;
|
||||
this.jrePath = path.join(baseDir, 'jre');
|
||||
this.binPath = path.join(this.jrePath, 'bin');
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
const { spawn, exec, execFile } = require('child_process');
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
const { resolveRuntimeStrategy } = require('./path-utils');
|
||||
const { resolvePackagedRuntime, resolveRuntimeStrategy } = require('./path-utils');
|
||||
|
||||
/**
|
||||
* MySQL 进程管理器
|
||||
@@ -9,10 +9,7 @@ const { resolveRuntimeStrategy } = require('./path-utils');
|
||||
*/
|
||||
class MySQLProcessManager {
|
||||
constructor(logWindowManager = null) {
|
||||
const isDev = !process.resourcesPath;
|
||||
const baseDir = isDev
|
||||
? path.join(__dirname, '..')
|
||||
: path.dirname(process.resourcesPath);
|
||||
const { baseDir } = resolvePackagedRuntime();
|
||||
const pathStrategy = resolveRuntimeStrategy(baseDir);
|
||||
|
||||
this.baseDir = baseDir;
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
|
||||
/**
|
||||
* 判断路径中是否包含非 ASCII 字符。
|
||||
@@ -16,6 +17,29 @@ function getDriveRoot(targetPath = '') {
|
||||
return path.parse(resolvedPath).root;
|
||||
}
|
||||
|
||||
function resolvePackagedRuntime() {
|
||||
const resourcesPath = process.resourcesPath;
|
||||
const packagedBaseDir = resourcesPath ? path.dirname(resourcesPath) : '';
|
||||
const hasPackagedResources = resourcesPath
|
||||
&& fs.existsSync(path.join(resourcesPath, 'extraResources'))
|
||||
&& fs.existsSync(path.join(packagedBaseDir, 'mysql'));
|
||||
|
||||
if (hasPackagedResources) {
|
||||
return {
|
||||
isPackaged: true,
|
||||
baseDir: packagedBaseDir,
|
||||
resourcesPath
|
||||
};
|
||||
}
|
||||
|
||||
const baseDir = path.join(__dirname, '..');
|
||||
return {
|
||||
isPackaged: false,
|
||||
baseDir,
|
||||
resourcesPath: path.join(baseDir, 'build', 'extraResources')
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析运行期路径策略。
|
||||
* - 安全路径:继续直接使用应用目录
|
||||
@@ -38,5 +62,6 @@ function resolveRuntimeStrategy(baseDir) {
|
||||
module.exports = {
|
||||
hasNonAscii,
|
||||
getDriveRoot,
|
||||
resolvePackagedRuntime,
|
||||
resolveRuntimeStrategy
|
||||
};
|
||||
|
||||
@@ -10,12 +10,14 @@ class StartupManager {
|
||||
this.loadingWindow = null;
|
||||
this.steps = [
|
||||
{ id: 'init', label: '正在初始化应用...', progress: 0 },
|
||||
{ id: 'check-mysql-port', label: '正在检查MySQL服务...', progress: 20 },
|
||||
{ id: 'wait-mysql', label: '确保MySQL服务运行...', progress: 40 },
|
||||
{ id: 'check-java-port', label: '正在检测后端服务端口...', progress: 60 },
|
||||
{ id: 'generate-config', label: '正在生成配置文件...', progress: 70 },
|
||||
{ id: 'start-java', label: '正在启动后端服务...', progress: 80 },
|
||||
{ id: 'wait-java', label: '等待后端服务就绪...', progress: 90 },
|
||||
{ id: 'check-mysql-port', label: '正在检查MySQL服务...', progress: 15 },
|
||||
{ id: 'wait-mysql', label: '确保MySQL服务运行...', progress: 30 },
|
||||
{ id: 'check-influxdb-port', label: '正在检查InfluxDB服务...', progress: 45 },
|
||||
{ id: 'wait-influxdb', label: '确保InfluxDB服务运行...', progress: 55 },
|
||||
{ id: 'check-java-port', label: '正在检测后端服务端口...', progress: 65 },
|
||||
{ id: 'generate-config', label: '正在生成配置文件...', progress: 75 },
|
||||
{ id: 'start-java', label: '正在启动后端服务...', progress: 85 },
|
||||
{ id: 'wait-java', label: '等待后端服务就绪...', progress: 95 },
|
||||
{ id: 'done', label: '启动完成!', progress: 100 }
|
||||
];
|
||||
this.currentStep = 0;
|
||||
|
||||
Reference in New Issue
Block a user