Commit 9da0a538 by jiang'yun

修改

parent 0a22694f
...@@ -42,3 +42,12 @@ export function delLjSssjSd(id) { ...@@ -42,3 +42,12 @@ export function delLjSssjSd(id) {
method: "delete", method: "delete",
}); });
} }
// 查询录井整米数据列表
export function getLjzmsj(query) {
return request({
url: "/system/ljSssjSd/getLjzmsj",
method: "get",
params: query,
});
}
<template> <template>
<div class="drilling-chart-container"> <div class="drilling-chart-container">
<div>
<span class="well-label" style="margin-left: 10px">开次:</span>
<el-select v-model="kc" style="width: 100px" size="mini" clearable placeholder="请选择">
<el-option
v-for="item in kcData"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<span class="well-label" style="margin-left: 10px">钻头尺寸:</span>
<el-input v-model="ztccs" style="width: 100px" clearable size="mini"></el-input>
<el-button type="primary" style="margin-left: 10px" size="mini" @click="getList">查询</el-button>
<el-button type="primary" icon="el-icon-download" size="small" @click="exportChart"
:disabled="!myChart"></el-button>
</div>
<div class="chart-wrapper"> <div class="chart-wrapper">
<el-button type="primary" icon="el-icon-download" size="small" class="export-btn" @click="exportChart"
:disabled="!myChart">
导出图片
</el-button>
<div id="drillingEfficiencyChartdj" class="chart"></div> <div id="drillingEfficiencyChartdj" class="chart"></div>
</div> </div>
<!-- <div class="optimal-values">
<div class="optimal-item">
<span class="label">机速最优:</span>
<span class="value">{{ (chartData && chartData.jxzszy) || '--' }}</span>
</div>
<div class="optimal-item">
<span class="label">进尺最优:</span>
<span class="value">{{ (chartData && chartData.jczy) || '--' }}</span>
</div>
<div class="optimal-item">
<span class="label">综合最优:</span>
<span class="value">{{ (chartData && chartData.zhzy) || '--' }}</span>
</div>
</div> -->
<el-table v-if="chartData && chartData.zyzt && chartData.zyzt.length > 0" :data="chartData.zyzt" border stripe <el-table v-if="chartData && chartData.zyzt && chartData.zyzt.length > 0" :data="chartData.zyzt" border stripe
class="data-table"> class="data-table">
<el-table-column label="井号" align="center" prop="jh" min-width="120" show-overflow-tooltip /> <el-table-column label="井号" align="center" prop="jh" min-width="120" show-overflow-tooltip/>
<el-table-column label="钻头尺寸mm" align="center" prop="ztcc" min-width="120" show-overflow-tooltip /> <el-table-column label="钻头尺寸mm" align="center" prop="ztcc" min-width="120" show-overflow-tooltip/>
<el-table-column label="钻头型号" align="center" prop="ztxh" min-width="150" show-overflow-tooltip /> <el-table-column label="钻头型号" align="center" prop="ztxh" min-width="150" show-overflow-tooltip/>
<el-table-column label="优选类型" align="center" prop="yxlx" min-width="120" show-overflow-tooltip /> <el-table-column label="优选类型" align="center" prop="yxlx" min-width="120" show-overflow-tooltip/>
</el-table> </el-table>
</div> </div>
</template> </template>
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { getdjqxt } from '@/api/optimization/initialization'; import {getdjqxt} from '@/api/optimization/initialization';
export default { export default {
props: { props: {
...@@ -48,19 +47,52 @@ export default { ...@@ -48,19 +47,52 @@ export default {
id: { id: {
type: String, type: String,
required: true, required: true,
},
kcjs: {
type: String,
required: true,
},
ztccsjs: {
type: String,
required: true,
} }
}, },
data() { data() {
return { return {
chartData: null, chartData: null,
myChart: null, myChart: null,
resizeHandler: null resizeHandler: null,
kc: '',
ztccs: '',
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
}; };
}, },
created() {
this.kc=this.kcjs
this.ztccs=this.ztccsjs
},
mounted() { mounted() {
// 不在挂载时自动请求数据,等待父组件触发 loadData() // 不在挂载时自动请求数据,等待父组件触发 loadData()
this.$once('hook:beforeDestroy', this.cleanup); this.$once('hook:beforeDestroy', this.cleanup);
}, },
methods: { methods: {
// 供父组件调用 // 供父组件调用
loadData() { loadData() {
...@@ -69,7 +101,9 @@ export default { ...@@ -69,7 +101,9 @@ export default {
getList() { getList() {
const params = { const params = {
zbid: this.id, zbid: this.id,
jhs: `${this.jh},${this.jhs}` jhs: `${this.jh},${this.jhs}`,
kc:this.kc,
ztccs:this.ztccs
}; };
getdjqxt(params) getdjqxt(params)
.then(res => { .then(res => {
...@@ -107,7 +141,7 @@ export default { ...@@ -107,7 +141,7 @@ export default {
} }
this.myChart = echarts.init(chartDom); this.myChart = echarts.init(chartDom);
// 解析接口数据(确保折线数据格式正确) // 解析接口数据(确保折线数据格式正确)
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData; const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序:[speed, depth, drillType, jh, cc] // 数据顺序:[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]); const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式:[[钻速, 进尺], ...] // 折线数据必须为数组格式:[[钻速, 进尺], ...]
...@@ -128,30 +162,30 @@ export default { ...@@ -128,30 +162,30 @@ export default {
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]], data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairLines.push({ crosshairLines.push({
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]], data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairCenter.push({ crosshairCenter.push({
name: '十字线中心', name: '十字线中心',
type: 'scatter', type: 'scatter',
data: [[crosshair.y, crosshair.x]], data: [[crosshair.y, crosshair.x]],
symbolSize: 12, symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 } itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
}); });
} }
// 图表配置项(核心:坐标轴触发,确保折线悬浮显示) // 图表配置项(核心:坐标轴触发,确保折线悬浮显示)
const option = { const option = {
title: { text: '钻头钻进能效分析', left: 'center' }, title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: { tooltip: {
trigger: 'axis', // 基于坐标轴触发(不依赖数据点) trigger: 'axis', // 基于坐标轴触发(不依赖数据点)
axisPointer: { axisPointer: {
...@@ -199,11 +233,11 @@ export default { ...@@ -199,11 +233,11 @@ export default {
min: axisRange.xAxis.min, min: axisRange.xAxis.min,
max: axisRange.xAxis.max, max: axisRange.xAxis.max,
// interval: axisRange.xAxis.interval, // interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' }, axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center', nameLocation: 'center',
nameGap: 50, nameGap: 50,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
yAxis: { yAxis: {
name: '进尺m', name: '进尺m',
...@@ -212,8 +246,8 @@ export default { ...@@ -212,8 +246,8 @@ export default {
// interval: axisRange.yAxis.interval, // interval: axisRange.yAxis.interval,
nameLocation: 'center', nameLocation: 'center',
nameGap: 40, nameGap: 40,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
series: [ series: [
{ {
...@@ -224,24 +258,24 @@ export default { ...@@ -224,24 +258,24 @@ export default {
// 彻底隐藏所有点(包括悬浮时) // 彻底隐藏所有点(包括悬浮时)
symbol: 'none', symbol: 'none',
showSymbol: false, showSymbol: false,
emphasis: { showSymbol: false }, emphasis: {showSymbol: false},
lineStyle: { color: 'red', width: 2 } lineStyle: {color: 'red', width: 2}
}, },
{ {
name: '钻速均值', name: '钻速均值',
type: 'line', type: 'line',
data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]], data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]],
lineStyle: { color: '#9eca7f', width: 2, type: 'dashed' }, lineStyle: {color: '#9eca7f', width: 2, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
{ {
name: '进尺均值', name: '进尺均值',
type: 'line', type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]], data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 }, lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
...crosshairLines, ...crosshairLines,
...crosshairCenter, ...crosshairCenter,
......
...@@ -27,8 +27,8 @@ ...@@ -27,8 +27,8 @@
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getdjZft } from "@/api/optimization/initialization"; import {getdjZft} from "@/api/optimization/initialization";
import { text } from "d3"; import {text} from "d3";
export default { export default {
name: "HistogramGraph", name: "HistogramGraph",
...@@ -342,10 +342,13 @@ export default { ...@@ -342,10 +342,13 @@ export default {
// 渲染真实数据 // 渲染真实数据
async renderRealData(mockData) { async renderRealData(mockData) {
try { try {
const { wellData } = mockData; const {wellData} = mockData;
console.log(wellData, 'wellData'); console.log(wellData, 'wellData');
const xAxisLabels = wellData.depthLine.map((point) => point.x); const xAxisLabels = wellData.depthLine.map((point) => point.x);
try { window.__hist_xLabels = xAxisLabels; } catch (e) { } try {
window.__hist_xLabels = xAxisLabels;
} catch (e) {
}
const option = { const option = {
...this.getDefaultChartOption(), ...this.getDefaultChartOption(),
xAxis: this.createXAxis(xAxisLabels), xAxis: this.createXAxis(xAxisLabels),
...@@ -407,20 +410,20 @@ export default { ...@@ -407,20 +410,20 @@ export default {
getDefaultChartOption() { getDefaultChartOption() {
const colors = this.colorScheme; const colors = this.colorScheme;
return { return {
title: { text: "", subtext: "" }, title: {text: "", subtext: ""},
aria: { enabled: false }, aria: {enabled: false},
backgroundColor: colors.background, backgroundColor: colors.background,
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
axisPointer: { axisPointer: {
type: "cross", type: "cross",
label: { backgroundColor: colors.primary }, label: {backgroundColor: colors.primary, show:false},
crossStyle: { color: colors.border } crossStyle: {color: colors.border}
}, },
backgroundColor: 'rgba(255,255,255,0.95)', backgroundColor: 'rgba(255,255,255,0.95)',
borderColor: colors.border, borderColor: colors.border,
borderWidth: 1, borderWidth: 1,
textStyle: { color: colors.text }, textStyle: {color: colors.text},
extraCssText: 'box-shadow: 0 4px 12px rgba(0,0,0,0.15); border-radius: 8px;', extraCssText: 'box-shadow: 0 4px 12px rgba(0,0,0,0.15); border-radius: 8px;',
formatter: (params) => { formatter: (params) => {
if (!params || params.length === 0) return ''; if (!params || params.length === 0) return '';
...@@ -491,11 +494,11 @@ export default { ...@@ -491,11 +494,11 @@ export default {
stackedAreas stackedAreas
.filter(area => area.svg !== null) .filter(area => area.svg !== null)
.map(async (area) => { .map(async (area) => {
let areaStyle = { opacity: 0.6 }; let areaStyle = {opacity: 0.6};
if (area.svg) { if (area.svg) {
try { try {
const svgImage = await this.createSvgImage(area.svg); const svgImage = await this.createSvgImage(area.svg);
areaStyle.color = { image: svgImage, repeat: "repeat" }; areaStyle.color = {image: svgImage, repeat: "repeat"};
} catch (error) { } catch (error) {
console.error('SVG转换失败:', error); console.error('SVG转换失败:', error);
} }
...@@ -509,7 +512,7 @@ export default { ...@@ -509,7 +512,7 @@ export default {
symbol: "none", symbol: "none",
showSymbol: false, showSymbol: false,
areaStyle: areaStyle, areaStyle: areaStyle,
lineStyle: { width: 0 }, lineStyle: {width: 0},
data: area.points.map((point) => (point && point.y2 != null) ? point.y2 : point.y), data: area.points.map((point) => (point && point.y2 != null) ? point.y2 : point.y),
}; };
}) })
...@@ -526,7 +529,7 @@ export default { ...@@ -526,7 +529,7 @@ export default {
if (!xToIndices.has(key)) xToIndices.set(key, []); if (!xToIndices.has(key)) xToIndices.set(key, []);
xToIndices.get(key).push(idx); xToIndices.get(key).push(idx);
}); });
const buildNullArray = (len) => Array.from({ length: len }, () => null); const buildNullArray = (len) => Array.from({length: len}, () => null);
console.log(buildNullArray, 'buildNullArray'); console.log(buildNullArray, 'buildNullArray');
const results = []; const results = [];
for (const [jh, layers] of Object.entries(stackedAreas)) { for (const [jh, layers] of Object.entries(stackedAreas)) {
...@@ -538,7 +541,7 @@ export default { ...@@ -538,7 +541,7 @@ export default {
for (const p of (area?.points || [])) { for (const p of (area?.points || [])) {
const arr = xToIndices.get(String(p?.x)) || []; const arr = xToIndices.get(String(p?.x)) || [];
if (arr.length === 0) { if (arr.length === 0) {
missingInXAxis.push({ x: p?.x, jh, areaName: area?.name }); missingInXAxis.push({x: p?.x, jh, areaName: area?.name});
} else { } else {
indicesForJh.push(...arr); indicesForJh.push(...arr);
} }
...@@ -548,11 +551,11 @@ export default { ...@@ -548,11 +551,11 @@ export default {
const endIdx = Math.max(...indicesForJh); const endIdx = Math.max(...indicesForJh);
for (const area of (layers || [])) { for (const area of (layers || [])) {
if (area == null) continue; if (area == null) continue;
let areaStyle = { opacity: 0.6 }; let areaStyle = {opacity: 0.6};
if (area.svg) { if (area.svg) {
try { try {
const svgImage = await this.createSvgImage(area.svg); const svgImage = await this.createSvgImage(area.svg);
areaStyle.color = { image: svgImage, repeat: "repeat" }; areaStyle.color = {image: svgImage, repeat: "repeat"};
} catch (error) { } catch (error) {
console.error('SVG转换失败:', error); console.error('SVG转换失败:', error);
} }
...@@ -572,7 +575,7 @@ export default { ...@@ -572,7 +575,7 @@ export default {
} }
}); });
if (!placed) { if (!placed) {
outOfRangePoints.push({ x: p?.x, cands, jh, areaName: area?.name, startIdx, endIdx }); outOfRangePoints.push({x: p?.x, cands, jh, areaName: area?.name, startIdx, endIdx});
} }
} }
results.push({ results.push({
...@@ -584,7 +587,7 @@ export default { ...@@ -584,7 +587,7 @@ export default {
symbol: "none", symbol: "none",
showSymbol: false, showSymbol: false,
areaStyle: areaStyle, areaStyle: areaStyle,
lineStyle: { width: 0 }, lineStyle: {width: 0},
data data
}); });
// 仅在有异常时输出调试信息,方便定位 x 匹配问题 // 仅在有异常时输出调试信息,方便定位 x 匹配问题
...@@ -596,7 +599,7 @@ export default { ...@@ -596,7 +599,7 @@ export default {
} }
if (outOfRangePoints.length > 0) { if (outOfRangePoints.length > 0) {
console.warn('x 命中但不在井段范围内:', outOfRangePoints); console.warn('x 命中但不在井段范围内:', outOfRangePoints);
console.info('井段范围:', { jh, startIdx, endIdx }); console.info('井段范围:', {jh, startIdx, endIdx});
} }
console.groupEnd && console.groupEnd(); console.groupEnd && console.groupEnd();
} }
...@@ -627,9 +630,9 @@ export default { ...@@ -627,9 +630,9 @@ export default {
axisTick: { axisTick: {
alignWithLabel: true, alignWithLabel: true,
length: 6, length: 6,
lineStyle: { color: colors.border } lineStyle: {color: colors.border}
}, },
splitLine: { show: false }, splitLine: {show: false},
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
...@@ -687,7 +690,7 @@ export default { ...@@ -687,7 +690,7 @@ export default {
}, },
axisTick: { axisTick: {
show: true, show: true,
lineStyle: { color: colors.border } lineStyle: {color: colors.border}
} }
}, },
{ {
...@@ -709,7 +712,7 @@ export default { ...@@ -709,7 +712,7 @@ export default {
color: colors.text, color: colors.text,
fontWeight: 500 fontWeight: 500
}, },
splitLine: { show: false }, splitLine: {show: false},
axisLine: { axisLine: {
show: true, show: true,
lineStyle: { lineStyle: {
...@@ -719,7 +722,7 @@ export default { ...@@ -719,7 +722,7 @@ export default {
}, },
axisTick: { axisTick: {
show: true, show: true,
lineStyle: { color: colors.border } lineStyle: {color: colors.border}
} }
}, },
]; ];
...@@ -772,7 +775,7 @@ export default { ...@@ -772,7 +775,7 @@ export default {
zlevel: 20, zlevel: 20,
stack: "total", stack: "total",
silent: true, silent: true,
barWidth: "8%", barWidth: "20%",
itemStyle: { itemStyle: {
borderColor: "transparent", borderColor: "transparent",
color: "transparent" color: "transparent"
...@@ -790,7 +793,7 @@ export default { ...@@ -790,7 +793,7 @@ export default {
type: "bar", type: "bar",
zlevel: 20, zlevel: 20,
stack: "total", stack: "total",
barWidth: "6%", barWidth: "15%",
label: { label: {
show: true, show: true,
position: 'insideTop', position: 'insideTop',
...@@ -817,8 +820,8 @@ export default { ...@@ -817,8 +820,8 @@ export default {
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [ colorStops: [
{ offset: 0, color: colors.gradient.start }, {offset: 0, color: colors.gradient.start},
{ offset: 1, color: colors.gradient.end } {offset: 1, color: colors.gradient.end}
] ]
}, },
borderRadius: [4, 4, 0, 0], borderRadius: [4, 4, 0, 0],
...@@ -835,8 +838,8 @@ export default { ...@@ -835,8 +838,8 @@ export default {
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [ colorStops: [
{ offset: 0, color: this.adjustColor(colors.gradient.start, 1.2) }, {offset: 0, color: this.adjustColor(colors.gradient.start, 1.2)},
{ offset: 1, color: this.adjustColor(colors.gradient.end, 1.2) } {offset: 1, color: this.adjustColor(colors.gradient.end, 1.2)}
] ]
}, },
shadowBlur: 12, shadowBlur: 12,
...@@ -855,12 +858,12 @@ export default { ...@@ -855,12 +858,12 @@ export default {
zlevel: 20, zlevel: 20,
// 与主柱重叠以便把标签放在柱底部区域内 // 与主柱重叠以便把标签放在柱底部区域内
barGap: '-100%', barGap: '-100%',
barWidth: '6%', barWidth: '20%',
itemStyle: { itemStyle: {
color: 'transparent', color: 'transparent',
borderColor: 'transparent' borderColor: 'transparent'
}, },
emphasis: { itemStyle: { color: 'transparent', borderColor: 'transparent' } }, emphasis: {itemStyle: {color: 'transparent', borderColor: 'transparent'}},
label: { label: {
show: false, show: false,
position: 'insideBottom', position: 'insideBottom',
...@@ -953,7 +956,7 @@ export default { ...@@ -953,7 +956,7 @@ export default {
// 创建SVG图片 // 创建SVG图片
createSvgImage(svgString) { createSvgImage(svgString) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const svgBlob = new Blob([svgString], { type: 'image/svg+xml;charset=utf-8' }); const svgBlob = new Blob([svgString], {type: 'image/svg+xml;charset=utf-8'});
const svgUrl = URL.createObjectURL(svgBlob); const svgUrl = URL.createObjectURL(svgBlob);
const img = new Image(); const img = new Image();
img.onload = () => { img.onload = () => {
...@@ -1004,7 +1007,7 @@ export default { ...@@ -1004,7 +1007,7 @@ export default {
this.currentGraphicElements = elements; this.currentGraphicElements = elements;
this.$nextTick(() => { this.$nextTick(() => {
if (this.myChart) { if (this.myChart) {
this.myChart.setOption({ graphic: { elements } }, { replaceMerge: ['graphic'] }); this.myChart.setOption({graphic: {elements}}, {replaceMerge: ['graphic']});
} }
}); });
}, },
...@@ -1022,7 +1025,7 @@ export default { ...@@ -1022,7 +1025,7 @@ export default {
for (let i = 0; i < depthIntervals.length; i++) { for (let i = 0; i < depthIntervals.length; i++) {
// 直接使用在 depthIntervals 中的顺序索引作为 x 轴位置, // 直接使用在 depthIntervals 中的顺序索引作为 x 轴位置,
// 以避免相同 x 标签造成的覆盖与错位 // 以避免相同 x 标签造成的覆盖与错位
const { jh } = depthIntervals[i]; const {jh} = depthIntervals[i];
const idx = i; const idx = i;
if (!started) { if (!started) {
currentJh = jh; currentJh = jh;
...@@ -1034,14 +1037,22 @@ export default { ...@@ -1034,14 +1037,22 @@ export default {
currentMin = Math.min(currentMin, idx); currentMin = Math.min(currentMin, idx);
currentMax = Math.max(currentMax, idx); currentMax = Math.max(currentMax, idx);
} else { } else {
segments.push({ jh: currentJh, startIdx: Math.min(currentMin, currentMax), endIdx: Math.max(currentMin, currentMax) }); segments.push({
jh: currentJh,
startIdx: Math.min(currentMin, currentMax),
endIdx: Math.max(currentMin, currentMax)
});
// 开始新段 // 开始新段
currentJh = jh; currentJh = jh;
currentMin = currentMax = idx; currentMin = currentMax = idx;
} }
} }
if (started) { if (started) {
segments.push({ jh: currentJh, startIdx: Math.min(currentMin, currentMax), endIdx: Math.max(currentMin, currentMax) }); segments.push({
jh: currentJh,
startIdx: Math.min(currentMin, currentMax),
endIdx: Math.max(currentMin, currentMax)
});
} }
const graphics = []; const graphics = [];
...@@ -1052,8 +1063,8 @@ export default { ...@@ -1052,8 +1063,8 @@ export default {
return; return;
} }
// 垂直范围(像素)——考虑 y 轴 inverse,取像素最小为顶部、最大为底部 // 垂直范围(像素)——考虑 y 轴 inverse,取像素最小为顶部、最大为底部
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min); const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max); const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) { if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) {
console.warn('convertToPixel 返回无效值,跳过绘制井号分隔符'); console.warn('convertToPixel 返回无效值,跳过绘制井号分隔符');
return; return;
...@@ -1065,8 +1076,8 @@ export default { ...@@ -1065,8 +1076,8 @@ export default {
for (let i = 0; i < segments.length - 1; i++) { for (let i = 0; i < segments.length - 1; i++) {
const leftEnd = segments[i].endIdx; const leftEnd = segments[i].endIdx;
const rightStart = segments[i + 1].startIdx; const rightStart = segments[i + 1].startIdx;
const pxLeft = this.myChart.convertToPixel({ xAxisIndex: 0 }, leftEnd); const pxLeft = this.myChart.convertToPixel({xAxisIndex: 0}, leftEnd);
const pxRight = this.myChart.convertToPixel({ xAxisIndex: 0 }, rightStart); const pxRight = this.myChart.convertToPixel({xAxisIndex: 0}, rightStart);
if (pxLeft === null || pxRight === null) { if (pxLeft === null || pxRight === null) {
console.warn('convertToPixel 返回 null 值,跳过绘制边界虚线'); console.warn('convertToPixel 返回 null 值,跳过绘制边界虚线');
continue; continue;
...@@ -1074,8 +1085,8 @@ export default { ...@@ -1074,8 +1085,8 @@ export default {
const midX = (pxLeft + pxRight) / 2; const midX = (pxLeft + pxRight) / 2;
graphics.push({ graphics.push({
type: 'line', type: 'line',
shape: { x1: midX, y1: yTopPx, x2: midX, y2: yBottomPx }, shape: {x1: midX, y1: yTopPx, x2: midX, y2: yBottomPx},
style: { stroke: '#bbb', lineDash: [8, 6], lineWidth: 1.5 }, style: {stroke: '#bbb', lineDash: [8, 6], lineWidth: 1.5},
silent: true, silent: true,
z: 100, z: 100,
zlevel: 10 zlevel: 10
...@@ -1087,8 +1098,8 @@ export default { ...@@ -1087,8 +1098,8 @@ export default {
let rowShift = 0; // 逐行上移避免覆盖 let rowShift = 0; // 逐行上移避免覆盖
segments.forEach((seg, idx) => { segments.forEach((seg, idx) => {
if (!seg.jh) return; if (!seg.jh) return;
const pxStart = this.myChart.convertToPixel({ xAxisIndex: 0 }, seg.startIdx); const pxStart = this.myChart.convertToPixel({xAxisIndex: 0}, seg.startIdx);
const pxEnd = this.myChart.convertToPixel({ xAxisIndex: 0 }, seg.endIdx); const pxEnd = this.myChart.convertToPixel({xAxisIndex: 0}, seg.endIdx);
if (pxStart === null || pxEnd === null) { if (pxStart === null || pxEnd === null) {
console.warn('convertToPixel 返回 null 值,跳过绘制井号标签'); console.warn('convertToPixel 返回 null 值,跳过绘制井号标签');
return; return;
...@@ -1123,7 +1134,7 @@ export default { ...@@ -1123,7 +1134,7 @@ export default {
children: [ children: [
{ {
type: 'rect', type: 'rect',
shape: { x: 0, y: 0, width: labelWidth, height: labelHeight, r: 8 }, shape: {x: 0, y: 0, width: labelWidth, height: labelHeight, r: 8},
style: { style: {
fill: '#2563eb', fill: '#2563eb',
stroke: '#1e40af', stroke: '#1e40af',
...@@ -1141,7 +1152,7 @@ export default { ...@@ -1141,7 +1152,7 @@ export default {
[labelWidth / 2, labelHeight + pointerSize] [labelWidth / 2, labelHeight + pointerSize]
] ]
}, },
style: { fill: '#2563eb', stroke: '#1e40af' } style: {fill: '#2563eb', stroke: '#1e40af'}
}, },
{ {
type: 'text', type: 'text',
...@@ -1167,7 +1178,7 @@ export default { ...@@ -1167,7 +1178,7 @@ export default {
this.currentGraphicElements = merged; this.currentGraphicElements = merged;
this.$nextTick(() => { this.$nextTick(() => {
if (this.myChart) { if (this.myChart) {
this.myChart.setOption({ graphic: { elements: merged } }, { replaceMerge: ['graphic'] }); this.myChart.setOption({graphic: {elements: merged}}, {replaceMerge: ['graphic']});
} }
}); });
}, },
...@@ -1183,8 +1194,8 @@ export default { ...@@ -1183,8 +1194,8 @@ export default {
return; return;
} }
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min); const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max); const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) { if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) {
console.warn('convertToPixel 返回无效值,跳过绘制类目边界线'); console.warn('convertToPixel 返回无效值,跳过绘制类目边界线');
return; return;
...@@ -1204,7 +1215,7 @@ export default { ...@@ -1204,7 +1215,7 @@ export default {
// 计算每个类目的像素中心 // 计算每个类目的像素中心
const centers = []; const centers = [];
for (let i = 0; i < n; i++) { for (let i = 0; i < n; i++) {
const cx = this.myChart.convertToPixel({ xAxisIndex: 0 }, i); const cx = this.myChart.convertToPixel({xAxisIndex: 0}, i);
if (cx != null) centers.push(cx); if (cx != null) centers.push(cx);
} }
if (centers.length > 0) { if (centers.length > 0) {
...@@ -1218,8 +1229,8 @@ export default { ...@@ -1218,8 +1229,8 @@ export default {
} }
graphics.push({ graphics.push({
type: 'line', type: 'line',
shape: { x1: firstEdge, y1: yStemStart, x2: firstEdge, y2: yStemEnd }, shape: {x1: firstEdge, y1: yStemStart, x2: firstEdge, y2: yStemEnd},
style: { stroke: '#bbb', lineWidth: 1.5 }, style: {stroke: '#bbb', lineWidth: 1.5},
silent: true, silent: true,
z: 120, z: 120,
zlevel: 10 zlevel: 10
...@@ -1229,8 +1240,8 @@ export default { ...@@ -1229,8 +1240,8 @@ export default {
const mid = (centers[i] + centers[i + 1]) / 2; const mid = (centers[i] + centers[i + 1]) / 2;
graphics.push({ graphics.push({
type: 'line', type: 'line',
shape: { x1: mid, y1: yStemStart, x2: mid, y2: yStemEnd }, shape: {x1: mid, y1: yStemStart, x2: mid, y2: yStemEnd},
style: { stroke: '#bbb', lineWidth: 1.5 }, style: {stroke: '#bbb', lineWidth: 1.5},
silent: true, silent: true,
z: 120, z: 120,
zlevel: 10 zlevel: 10
...@@ -1246,8 +1257,8 @@ export default { ...@@ -1246,8 +1257,8 @@ export default {
} }
graphics.push({ graphics.push({
type: 'line', type: 'line',
shape: { x1: lastEdge, y1: yStemStart, x2: lastEdge, y2: yStemEnd }, shape: {x1: lastEdge, y1: yStemStart, x2: lastEdge, y2: yStemEnd},
style: { stroke: '#bbb', lineWidth: 1.5 }, style: {stroke: '#bbb', lineWidth: 1.5},
silent: true, silent: true,
z: 120, z: 120,
zlevel: 10 zlevel: 10
...@@ -1260,7 +1271,7 @@ export default { ...@@ -1260,7 +1271,7 @@ export default {
this.currentGraphicElements = merged; this.currentGraphicElements = merged;
this.$nextTick(() => { this.$nextTick(() => {
if (this.myChart) { if (this.myChart) {
this.myChart.setOption({ graphic: { elements: merged } }, { replaceMerge: ['graphic'] }); this.myChart.setOption({graphic: {elements: merged}}, {replaceMerge: ['graphic']});
} }
}); });
}, },
...@@ -1279,7 +1290,7 @@ export default { ...@@ -1279,7 +1290,7 @@ export default {
// 计算每个类目的像素中心 // 计算每个类目的像素中心
const centers = []; const centers = [];
for (let i = 0; i < xAxisLabels.length; i++) { for (let i = 0; i < xAxisLabels.length; i++) {
const cx = this.myChart.convertToPixel({ xAxisIndex: 0 }, i); const cx = this.myChart.convertToPixel({xAxisIndex: 0}, i);
if (cx != null) centers.push(cx); if (cx != null) centers.push(cx);
} }
if (centers.length === 0) return; if (centers.length === 0) return;
...@@ -1297,8 +1308,8 @@ export default { ...@@ -1297,8 +1308,8 @@ export default {
} }
// 图内纵向像素范围:从图内顶部到 y2 所在像素 // 图内纵向像素范围:从图内顶部到 y2 所在像素
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min); const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max); const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx == null || yMaxPx == null) return; if (yMinPx == null || yMaxPx == null) return;
const yTopPx = Math.min(yMinPx, yMaxPx); const yTopPx = Math.min(yMinPx, yMaxPx);
const plotHeight = Math.abs(yMaxPx - yMinPx); const plotHeight = Math.abs(yMaxPx - yMinPx);
...@@ -1346,9 +1357,12 @@ export default { ...@@ -1346,9 +1357,12 @@ export default {
const yTopDepth = prevBottom == null ? chartConfig?.yAxis?.min : prevBottom; const yTopDepth = prevBottom == null ? chartConfig?.yAxis?.min : prevBottom;
const yBottomDepth = y2val; const yBottomDepth = y2val;
const yPixTop = this.myChart.convertToPixel({ yAxisIndex: 0 }, yTopDepth); const yPixTop = this.myChart.convertToPixel({yAxisIndex: 0}, yTopDepth);
const yPixBottom = this.myChart.convertToPixel({ yAxisIndex: 0 }, yBottomDepth); const yPixBottom = this.myChart.convertToPixel({yAxisIndex: 0}, yBottomDepth);
if (yPixTop == null || yPixBottom == null) { prevBottom = y2val; continue; } if (yPixTop == null || yPixBottom == null) {
prevBottom = y2val;
continue;
}
const rectTop = Math.min(yPixTop, yPixBottom); const rectTop = Math.min(yPixTop, yPixBottom);
const rectBottom = Math.max(yPixTop, yPixBottom); const rectBottom = Math.max(yPixTop, yPixBottom);
...@@ -1360,13 +1374,14 @@ export default { ...@@ -1360,13 +1374,14 @@ export default {
if (layer?.svg) { if (layer?.svg) {
try { try {
const img = await this.createSvgImage(layer.svg); const img = await this.createSvgImage(layer.svg);
fill = { image: img, repeat: 'repeat' }; fill = {image: img, repeat: 'repeat'};
} catch (e) { /* ignore */ } } catch (e) { /* ignore */
}
} }
graphics.push({ graphics.push({
type: 'rect', type: 'rect',
shape: { x: left, y: y1pix, width, height }, shape: {x: left, y: y1pix, width, height},
style: { fill, stroke: 'rgba(0,0,0,0.12)', lineWidth: 1 }, style: {fill, stroke: 'rgba(0,0,0,0.12)', lineWidth: 1},
silent: true, silent: true,
z: -10, z: -10,
zlevel: 1, zlevel: 1,
...@@ -1384,7 +1399,7 @@ export default { ...@@ -1384,7 +1399,7 @@ export default {
this.currentGraphicElements = merged; this.currentGraphicElements = merged;
this.$nextTick(() => { this.$nextTick(() => {
if (this.myChart) { if (this.myChart) {
this.myChart.setOption({ graphic: { elements: merged } }, { replaceMerge: ['graphic'] }); this.myChart.setOption({graphic: {elements: merged}}, {replaceMerge: ['graphic']});
} }
}); });
}, },
......
...@@ -2,19 +2,19 @@ ...@@ -2,19 +2,19 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;"> <el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;">
<el-tab-pane label="数据表格" name="dataTable"> <el-tab-pane label="钻头使用数据" name="dataTable">
<DataTable ref="dataTableRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk" <DataTable ref="dataTableRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk"
:jhs="queryParams.jhs" /> :jhs="queryParams.jhs"/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="曲线图形" name="curveGraph"> <el-tab-pane label="钻头优选" name="curveGraph">
<CurveGraph ref="curveGraphRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk" <CurveGraph ref="curveGraphRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk"
:jhs="queryParams.jhs" :id="queryParams.id" /> :jhs="queryParams.jhs" :id="queryParams.id" :kcjs="queryParams.kc" :ztccsjs="queryParams.ztccs" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="直方图形" name="histogramGraph"> <el-tab-pane label="钻头能效分析" name="histogramGraph">
<HistogramGraph ref="histogramGraphRef" :jh="queryParams.jh" :famc="queryParams.famc" <HistogramGraph ref="histogramGraphRef" :jh="queryParams.jh" :famc="queryParams.famc"
:qk="queryParams.qk" :jhs="queryParams.jhs" /> :qk="queryParams.qk" :jhs="queryParams.jhs"/>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
...@@ -47,7 +47,9 @@ export default { ...@@ -47,7 +47,9 @@ export default {
jh: '', jh: '',
famc: '', famc: '',
qk: '', qk: '',
jhs: '' jhs: '',
kc: '',
ztccs: '',
}, },
// 标记是否是第一次进入页面 // 标记是否是第一次进入页面
isFirstLoad: true isFirstLoad: true
...@@ -56,14 +58,14 @@ export default { ...@@ -56,14 +58,14 @@ export default {
created() { created() {
// 获取路由参数(使用query) // 获取路由参数(使用query)
console.log('详情页面created,完整路由对象:', this.$route); console.log('详情页面created,完整路由对象:', this.$route);
let { id, jh, famc, qk, jhs } = this.$route.query || {}; let {id, jh, famc, qk, jhs, kc, ztccs} = this.$route.query || {};
console.log('路由query参数:', { id, jh, famc, qk, jhs }); console.log('路由query参数:', {id, jh, famc, qk, jhs, kc, ztccs});
// 优先使用query,其次使用sessionStorage // 优先使用query,其次使用sessionStorage
if (!jh || jh === 'undefined' || jh === 'null') { if (!jh || jh === 'undefined' || jh === 'null') {
try { try {
const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}'); const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}');
({ id, jh, famc, qk, jhs } = { ...cached, ...this.$route.query }); ({id, jh, famc, qk, jhs, kc, ztccs} = {...cached, ...this.$route.query});
console.log('使用缓存参数:', { id, jh, famc, qk, jhs }); console.log('使用缓存参数:', {id, jh, famc, qk, jhs, kc, ztccs});
} catch (e) { } catch (e) {
console.warn('读取缓存失败', e); console.warn('读取缓存失败', e);
} }
...@@ -74,6 +76,8 @@ export default { ...@@ -74,6 +76,8 @@ export default {
this.queryParams.famc = famc || ''; this.queryParams.famc = famc || '';
this.queryParams.qk = qk || ''; this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || ''; this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
// 缓存参数,便于刷新后保留 // 缓存参数,便于刷新后保留
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams)); sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
console.log('设置并缓存 queryParams:', this.queryParams); console.log('设置并缓存 queryParams:', this.queryParams);
...@@ -87,34 +91,39 @@ export default { ...@@ -87,34 +91,39 @@ export default {
}, },
activated() { activated() {
// 组件被 keep-alive 缓存时,返回本页会触发此钩子 // 组件被 keep-alive 缓存时,返回本页会触发此钩子
const { id, jh, famc, qk, jhs } = this.$route.query || {}; const {id, jh, famc, qk, jhs,kc,ztccs} = this.$route.query || {};
if (jh && jh !== 'undefined' && jh !== 'null') { if (jh && jh !== 'undefined' && jh !== 'null') {
this.queryParams.id = id || ''; this.queryParams.id = id || '';
this.queryParams.jh = jh || ''; this.queryParams.jh = jh || '';
this.queryParams.famc = famc || ''; this.queryParams.famc = famc || '';
this.queryParams.qk = qk || ''; this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || ''; this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams)); sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
this.$nextTick(() => this.refreshActiveTab()); this.$nextTick(() => this.refreshActiveTab());
} else { } else {
try { try {
const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}'); const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}');
if (cached && cached.jh) { if (cached && cached.jh) {
this.queryParams = { ...this.queryParams, ...cached }; this.queryParams = {...this.queryParams, ...cached};
this.$nextTick(() => this.refreshActiveTab()); this.$nextTick(() => this.refreshActiveTab());
} }
} catch (e) { } } catch (e) {
}
} }
}, },
beforeRouteUpdate(to, from, next) { beforeRouteUpdate(to, from, next) {
// 同一路由切换不同 query 时触发 // 同一路由切换不同 query 时触发
const { id, jh, famc, qk, jhs } = to.query || {}; const {id, jh, famc, qk, jhs,kc,ztccs} = to.query || {};
if (jh && jh !== 'undefined' && jh !== 'null') { if (jh && jh !== 'undefined' && jh !== 'null') {
this.queryParams.id = id || ''; this.queryParams.id = id || '';
this.queryParams.jh = jh || ''; this.queryParams.jh = jh || '';
this.queryParams.famc = famc || ''; this.queryParams.famc = famc || '';
this.queryParams.qk = qk || ''; this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || ''; this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams)); sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
this.$nextTick(() => this.refreshActiveTab()); this.$nextTick(() => this.refreshActiveTab());
} }
...@@ -123,13 +132,15 @@ export default { ...@@ -123,13 +132,15 @@ export default {
watch: { watch: {
// 当从列表页连续点击"查看"跳转到同一路由时,组件会复用,这里监听路由变化并刷新当前激活tab // 当从列表页连续点击"查看"跳转到同一路由时,组件会复用,这里监听路由变化并刷新当前激活tab
'$route.query'(to) { '$route.query'(to) {
const { id, jh, famc, qk, jhs } = to || {}; const {id, jh, famc, qk, jhs,kc,ztccs} = to || {};
if (jh && jh !== 'undefined' && jh !== 'null') { if (jh && jh !== 'undefined' && jh !== 'null') {
this.queryParams.id = id || ''; this.queryParams.id = id || '';
this.queryParams.jh = jh || ''; this.queryParams.jh = jh || '';
this.queryParams.famc = famc || ''; this.queryParams.famc = famc || '';
this.queryParams.qk = qk || ''; this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || ''; this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams)); sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
// 当前就在某个tab上,路由参数变更后需要立刻刷新该tab的数据 // 当前就在某个tab上,路由参数变更后需要立刻刷新该tab的数据
...@@ -174,7 +185,8 @@ export default { ...@@ -174,7 +185,8 @@ export default {
this.$modal.confirm('是否确认移除选中的记录?').then(() => { this.$modal.confirm('是否确认移除选中的记录?').then(() => {
// 这里可以调用API进行删除操作 // 这里可以调用API进行删除操作
this.$modal.msgSuccess("移除成功"); this.$modal.msgSuccess("移除成功");
}).catch(() => { }); }).catch(() => {
});
}, },
// 多选框选中数据 // 多选框选中数据
...@@ -230,7 +242,7 @@ export default { ...@@ -230,7 +242,7 @@ export default {
} }
} }
::v-deep .el-table__cell>.cell { ::v-deep .el-table__cell > .cell {
font-weight: normal; font-weight: normal;
} }
......
...@@ -5,11 +5,11 @@ ...@@ -5,11 +5,11 @@
<el-form :model="searchForm" ref="searchFormRef" :rules="searchRules" inline> <el-form :model="searchForm" ref="searchFormRef" :rules="searchRules" inline>
<el-form-item label="区块名称" prop="qk"> <el-form-item label="区块名称" prop="qk">
<el-select v-model="searchForm.qk" placeholder="请选择区块名称" clearable filterable style="width: 150px;"> <el-select v-model="searchForm.qk" placeholder="请选择区块名称" clearable filterable style="width: 150px;">
<el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk" /> <el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="井号" prop="jh"> <el-form-item label="井号" prop="jh">
<el-input v-model="searchForm.jh" placeholder="请输入" style="width: 150px;" /> <el-input v-model="searchForm.jh" placeholder="请输入" style="width: 150px;"/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="getList">搜索</el-button> <el-button type="primary" @click="getList">搜索</el-button>
...@@ -21,28 +21,31 @@ ...@@ -21,28 +21,31 @@
<!-- 数据表格 --> <!-- 数据表格 -->
<el-table :data="tableData" border style="width: 100%; height: calc(100vh - 230px)"> <el-table :data="tableData" border style="width: 100%; height: calc(100vh - 230px)">
<el-table-column prop="famc" label="方案名称" min-width="180" align="center" show-overflow-tooltip sortable /> <el-table-column prop="famc" label="方案名称" min-width="180" align="center" show-overflow-tooltip sortable/>
<el-table-column prop="qk" label="区块" min-width="110" align="center" show-overflow-tooltip sortable /> <el-table-column prop="qk" label="区块" min-width="110" align="center" show-overflow-tooltip sortable/>
<el-table-column prop="jh" label="井号" min-width="110" align="center" show-overflow-tooltip sortable /> <el-table-column prop="jh" label="井号" min-width="110" align="center" show-overflow-tooltip sortable/>
<el-table-column prop="jhs" label="邻井井号" min-width="160" align="center" show-overflow-tooltip sortable /> <el-table-column prop="jhs" label="邻井井号" min-width="160" align="center" show-overflow-tooltip sortable/>
<el-table-column prop="yxzt" label="综合最优" align="center" min-width="160" show-overflow-tooltip sortable /> <el-table-column prop="yxzt" label="综合最优" align="center" min-width="160" show-overflow-tooltip sortable/>
<el-table-column prop="jczt" label="进尺最优" align="center" min-width="160" show-overflow-tooltip sortable /> <el-table-column prop="jczt" label="进尺最优" align="center" min-width="160" show-overflow-tooltip sortable/>
<el-table-column prop="jxzszt" label="转速最优" align="center" min-width="160" show-overflow-tooltip sortable /> <el-table-column prop="jxzszt" label="转速最优" align="center" min-width="160" show-overflow-tooltip sortable/>
<el-table-column label="操作" width="200" align="center" fixed="right"> <el-table-column label="操作" width="200" align="center" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button> <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button>
<el-button size="mini" type="text" icon="el-icon-edit" <el-button size="mini" type="text" icon="el-icon-edit"
@click="handleUpdate(scope.row)">编辑</el-button> @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" <el-button size="mini" type="text" icon="el-icon-delete"
@click="handleDelete(scope.row)">删除</el-button> @click="handleDelete(scope.row)">删除
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 主表格分页组件 --> <!-- 主表格分页组件 -->
<el-pagination style="margin-top: 10px; text-align: right;" background <el-pagination style="margin-top: 10px; text-align: right;" background
layout="total, sizes, prev, pager, next, jumper" :total="mainPagination.total" layout="total, sizes, prev, pager, next, jumper" :total="mainPagination.total"
:page-sizes="[10, 20, 50, 100]" :page-size="mainPagination.pageSize" :current-page="mainPagination.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="mainPagination.pageSize"
@size-change="handleMainSizeChange" @current-change="handleMainCurrentChange" /> :current-page="mainPagination.pageNum"
@size-change="handleMainSizeChange" @current-change="handleMainCurrentChange"/>
<!-- 新增/编辑弹窗 --> <!-- 新增/编辑弹窗 -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" :close-on-click-modal="false" <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" :close-on-click-modal="false"
...@@ -51,7 +54,7 @@ ...@@ -51,7 +54,7 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="方案名称" prop="famc"> <el-form-item label="方案名称" prop="famc">
<el-input v-model="formData.famc" placeholder="请输入方案名称" /> <el-input v-model="formData.famc" placeholder="请输入方案名称"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -59,7 +62,7 @@ ...@@ -59,7 +62,7 @@
<el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable <el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable
style="width: 100%;"> style="width: 100%;">
<el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk" <el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk"
style="width: 100%;" /> style="width: 100%;"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -68,13 +71,13 @@ ...@@ -68,13 +71,13 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="井号" prop="jh"> <el-form-item label="井号" prop="jh">
<div style="cursor: pointer;"> <div style="cursor: pointer;">
<el-input v-model="formData.jh" placeholder="请输入井号" /> <el-input v-model="formData.jh" placeholder="请输入井号"/>
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="井口距离" prop="jl"> <el-form-item label="井口距离" prop="jl">
<el-input v-model="formData.jl" placeholder="请输入" style="width: 100%;" /> <el-input v-model="formData.jl" placeholder="请输入" style="width: 100%;"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -82,28 +85,31 @@ ...@@ -82,28 +85,31 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="完井时间" prop="wjsjks" required> <el-form-item label="完井时间" prop="wjsjks" required>
<el-date-picker v-model="formData.wjsjks" type="date" placeholder="选择开始日期" <el-date-picker v-model="formData.wjsjks" type="date" placeholder="选择开始日期"
style="width: 50%;" /> style="width: 50%;"/>
<el-date-picker v-model="formData.wjsjjs" type="date" placeholder="选择结束日期" <el-date-picker v-model="formData.wjsjjs" type="date" placeholder="选择结束日期"
style="width: 50%;" /> style="width: 50%;"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="开次" prop="kc"> <el-form-item label="开次" prop="kc">
<el-input v-model="formData.kc" placeholder="请输入开次" /> <el-select v-model="formData.kc" filterable placeholder="请选择或输入钻头尺寸" style="width: 100%">
<el-option v-for="item in kcData" :key="item.value" :label="item.label"
:value="item.value"/>
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="井眼尺寸" prop="jycc"> <el-form-item label="井眼尺寸" prop="jycc">
<el-input v-model="formData.jycc" placeholder="请输入井眼尺寸" /> <el-input v-model="formData.jycc" placeholder="请输入井眼尺寸"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="选择邻井" prop="jhs"> <el-form-item label="选择邻井" prop="jhs">
<div style="cursor: pointer;" @click="handleSelectAdjacentWell"> <div style="cursor: pointer;" @click="handleSelectAdjacentWell">
<el-input v-model="formData.jhs" placeholder="请点击选择邻井" readonly <el-input v-model="formData.jhs" placeholder="请点击选择邻井" readonly
style="cursor: pointer;" /> style="cursor: pointer;"/>
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -111,23 +117,13 @@ ...@@ -111,23 +117,13 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="进尺最优比例" prop="jcbl" required> <el-form-item label="进尺最优比例" prop="jcbl" required>
<el-select v-model="formData.jcbl" placeholder="请选择进尺最优比例" clearable style="width: 100%;"> <el-slider v-model="formData.jcbl" :max="1" :min="0" :step="0.1" :format-tooltip="formatTooltip"></el-slider>
<el-option label="0.2" value="0.2" />
<el-option label="0.3" value="0.3" />
<el-option label="0.4" value="0.4" />
<el-option label="0.5" value="0.5" />
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="机械钻速最优比例" prop="jxzsbl" required> <el-form-item label="机械钻速最优比例" prop="jxzsbl" required>
<el-select v-model="formData.jxzsbl" placeholder="请选择机械钻速最优比例" clearable <el-slider v-model="formData.jxzsbl" :max="1" :min="0" :step="0.1" :format-tooltip="formatTooltip"></el-slider>
style="width: 100%;">
<el-option label="0.2" value="0.2" />
<el-option label="0.3" value="0.3" />
<el-option label="0.4" value="0.4" />
<el-option label="0.5" value="0.5" />
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -152,16 +148,16 @@ ...@@ -152,16 +148,16 @@
<el-table :data="wellTableData" border style="width: 100%;height: 400px" max-height="400px" <el-table :data="wellTableData" border style="width: 100%;height: 400px" max-height="400px"
v-loading="wellLoading" @selection-change="handleWellSelectionChange" ref="wellTable" v-loading="wellLoading" @selection-change="handleWellSelectionChange" ref="wellTable"
:row-key="row => row.jh"> :row-key="row => row.jh">
<el-table-column type="selection" width="55" :selectable="checkSelectable" /> <el-table-column type="selection" width="55" :selectable="checkSelectable"/>
<el-table-column prop="jh" label="井号" align="center" show-overflow-tooltip /> <el-table-column prop="jh" label="井号" align="center" show-overflow-tooltip/>
<el-table-column prop="jx" label="井型" align="center" show-overflow-tooltip /> <el-table-column prop="jx" label="井型" align="center" show-overflow-tooltip/>
<el-table-column prop="wjjs" label="斜深" align="center" show-overflow-tooltip /> <el-table-column prop="wjjs" label="斜深" align="center" show-overflow-tooltip/>
<el-table-column prop="wjczjs" label="垂深" align="center" show-overflow-tooltip /> <el-table-column prop="wjczjs" label="垂深" align="center" show-overflow-tooltip/>
<el-table-column prop="wzcw" label="完钻层位" align="center" show-overflow-tooltip /> <el-table-column prop="wzcw" label="完钻层位" align="center" show-overflow-tooltip/>
<el-table-column prop="kc" label="总开次" align="center" show-overflow-tooltip /> <el-table-column prop="kc" label="总开次" align="center" show-overflow-tooltip/>
<el-table-column prop="zjzq" label="钻井周期(天)" align="center" show-overflow-tooltip /> <el-table-column prop="zjzq" label="钻井周期(天)" align="center" show-overflow-tooltip/>
<el-table-column prop="wjzq" label="钻完周期(天)" align="center" show-overflow-tooltip /> <el-table-column prop="wjzq" label="钻完周期(天)" align="center" show-overflow-tooltip/>
<el-table-column prop="jkjl" label="井口距离" align="center" show-overflow-tooltip /> <el-table-column prop="jkjl" label="井口距离" align="center" show-overflow-tooltip/>
<!-- <el-table-column prop="jdjl" label="井底距离" align="center" show-overflow-tooltip /> --> <!-- <el-table-column prop="jdjl" label="井底距离" align="center" show-overflow-tooltip /> -->
</el-table> </el-table>
...@@ -169,7 +165,7 @@ ...@@ -169,7 +165,7 @@
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="wellPagination.pageNum" :page-sizes="[10, 20, 50, 100]" :current-page="wellPagination.pageNum" :page-sizes="[10, 20, 50, 100]"
:page-size="wellPagination.pageSize" layout="total, sizes, prev, pager, next, jumper" :page-size="wellPagination.pageSize" layout="total, sizes, prev, pager, next, jumper"
:total="wellPagination.total" style="margin-top: 10px; text-align: right;" /> :total="wellPagination.total" style="margin-top: 10px; text-align: right;"/>
<template slot="footer"> <template slot="footer">
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="handleWellCancel">取 消</el-button> <el-button @click="handleWellCancel">取 消</el-button>
...@@ -181,9 +177,9 @@ ...@@ -181,9 +177,9 @@
</template> </template>
<script> <script>
import { listSj } from '@/api/adjacentWell' import {listSj} from '@/api/adjacentWell'
import { getQkxl } from "@/api/system/jsaa"; import {getQkxl} from "@/api/system/jsaa";
import { listDjnxfxfa, getDjnxfxfa, delDjnxfxfa, addDjnxfxfa, updateDjnxfxfa } from "@/api/system/djnxfxfa"; import {listDjnxfxfa, getDjnxfxfa, delDjnxfxfa, addDjnxfxfa, updateDjnxfxfa} from "@/api/system/djnxfxfa";
export default { export default {
name: 'DjxxIndex', name: 'DjxxIndex',
...@@ -195,9 +191,7 @@ export default { ...@@ -195,9 +191,7 @@ export default {
searchForm: { searchForm: {
qk: '' qk: ''
}, },
searchRules: { searchRules: {},
},
// 表格数据 // 表格数据
tableData: [], tableData: [],
...@@ -214,15 +208,15 @@ export default { ...@@ -214,15 +208,15 @@ export default {
jl: '10000', // 距离默认值10000 jl: '10000', // 距离默认值10000
wjsjks: null, // 完井时间开始默认五年前的今天 wjsjks: null, // 完井时间开始默认五年前的今天
wjsjjs: null, // 完井时间结束默认今天 wjsjjs: null, // 完井时间结束默认今天
jcbl: '', // 进尺最优比例 jcbl: 0.2, // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例 jxzsbl: 0.2 // 机械钻速最优比例
}, },
formRules: { formRules: {
famc: [{ required: true, message: '请输入方案名称', trigger: 'blur' }], famc: [{required: true, message: '请输入方案名称', trigger: 'blur'}],
qk: [{ required: true, message: '请选择区块', trigger: 'change' }], qk: [{required: true, message: '请选择区块', trigger: 'change'}],
jhs: [{ required: true, message: '请选择井号', trigger: 'change' }], jhs: [{required: true, message: '请选择井号', trigger: 'change'}],
jcbl: [{ required: true, message: '请选择进尺最优比例', trigger: 'change' }], jcbl: [{required: true, message: '请选择进尺最优比例', trigger: 'change'}],
jxzsbl: [{ required: true, message: '请选择机械钻速最优比例', trigger: 'change' }] jxzsbl: [{required: true, message: '请选择机械钻速最优比例', trigger: 'change'}]
}, },
// 井号选择弹窗 // 井号选择弹窗
...@@ -247,6 +241,24 @@ export default { ...@@ -247,6 +241,24 @@ export default {
pageSize: 10, pageSize: 10,
total: 0 total: 0
}, },
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
} }
}, },
created() { created() {
...@@ -329,8 +341,8 @@ export default { ...@@ -329,8 +341,8 @@ export default {
jl: '10000', // 距离默认值10000 jl: '10000', // 距离默认值10000
wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天 wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天
wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天 wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天
jcbl: '', // 进尺最优比例 jcbl: 0.2, // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例 jxzsbl: 0.2 // 机械钻速最优比例
}; };
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
...@@ -343,12 +355,12 @@ export default { ...@@ -343,12 +355,12 @@ export default {
this.resetForm("queryForm"); this.resetForm("queryForm");
this.handleQuery(); this.handleQuery();
}, },
/** 新增按钮操作 */ // /** 新增按钮操作 */
handleAdd() { // handleAdd() {
this.reset(); // this.reset();
this.open = true; // this.open = true;
this.title = "添加多井能效分析方案信息"; // this.title = "添加多井能效分析方案信息";
}, // },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
this.reset(); this.reset();
...@@ -410,7 +422,9 @@ export default { ...@@ -410,7 +422,9 @@ export default {
jh: row.jh || '', jh: row.jh || '',
famc: row.famc || '', famc: row.famc || '',
qk: row.qk || '', qk: row.qk || '',
jhs: row.jhs || '' jhs: row.jhs || '',
kc: row.kc || '',
ztccs: row.jycc || '',
}; };
console.log('准备传递的参数:', params); console.log('准备传递的参数:', params);
...@@ -431,7 +445,8 @@ export default { ...@@ -431,7 +445,8 @@ export default {
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => { }); }).catch(() => {
});
}, },
/** 获取区块下拉选项 */ /** 获取区块下拉选项 */
getBlockOptions() { getBlockOptions() {
...@@ -466,8 +481,8 @@ export default { ...@@ -466,8 +481,8 @@ export default {
jl: '10000', // 距离默认值10000 jl: '10000', // 距离默认值10000
wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天 wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天
wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天 wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天
jcbl: '', // 进尺最优比例 jcbl: 0.2, // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例 jxzsbl: 0.2 // 机械钻速最优比例
} }
// 新增时重置井号选择状态 // 新增时重置井号选择状态
this.wellSelection = [] this.wellSelection = []
...@@ -706,7 +721,6 @@ export default { ...@@ -706,7 +721,6 @@ export default {
}, },
// 井号选择变化 // 井号选择变化
handleWellSelectionChange(selection) { handleWellSelectionChange(selection) {
console.log('选择变化事件触发,selection长度:', selection.length, 'isUserSelecting:', this.isUserSelecting, 'isSettingSelection:', this.isSettingSelection, 'isInitializing:', this.isInitializing) console.log('选择变化事件触发,selection长度:', selection.length, 'isUserSelecting:', this.isUserSelecting, 'isSettingSelection:', this.isSettingSelection, 'isInitializing:', this.isInitializing)
...@@ -734,7 +748,6 @@ export default { ...@@ -734,7 +748,6 @@ export default {
} }
this.wellSelection = allSelectedWells this.wellSelection = allSelectedWells
console.log('最终选择状态:', this.wellSelection) console.log('最终选择状态:', this.wellSelection)
}, },
...@@ -791,6 +804,10 @@ export default { ...@@ -791,6 +804,10 @@ export default {
this.getList(); this.getList();
}, },
formatTooltip(val) {
return val;
}
} }
} }
......
<template> <template>
<div class="drilling-chart-container" v-loading="loading" element-loading-text="加载中..." <div class="drilling-chart-container" v-loading="loading" element-loading-text="加载中..."
element-loading-background="rgba(255, 255, 255, 0.7)"> element-loading-background="rgba(255, 255, 255, 0.7)">
<div class="chart-wrapper"> <div>
<el-button type="primary" icon="el-icon-download" size="small" class="export-btn" @click="exportChart" <span class="well-label" style="margin-left: 10px">开次:</span>
<el-select v-model="kc" style="width: 100px" size="mini" clearable placeholder="请选择">
<el-option
v-for="item in kcData"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<span class="well-label" style="margin-left: 10px">钻头尺寸:</span>
<el-input v-model="ztccs" style="width: 100px" clearable size="mini"></el-input>
<el-button type="primary" style="margin-left: 10px" size="mini" @click="getList">查询</el-button>
<el-button type="primary" icon="el-icon-download" size="mini" @click="exportChart"
:disabled="!myChart"> :disabled="!myChart">
导出图片
</el-button> </el-button>
</div>
<div class="chart-wrapper">
<div id="drillingEfficiencyChartdj" class="chart"></div> <div id="drillingEfficiencyChartdj" class="chart"></div>
</div> </div>
<!-- <div class="optimal-values"> <!-- <div class="optimal-values">
...@@ -26,24 +41,24 @@ ...@@ -26,24 +41,24 @@
<!-- 钻头优选表格 --> <!-- 钻头优选表格 -->
<div class="table-section" v-if="tableData && tableData.length > 0"> <div class="table-section" v-if="tableData && tableData.length > 0">
<el-table :data="paginatedTableData" border stripe style="width: 100%" v-loading="tableLoading"> <el-table :data="paginatedTableData" border stripe style="width: 100%" v-loading="tableLoading">
<el-table-column prop="jh" label="井号" align="center" min-width="120" show-overflow-tooltip /> <el-table-column prop="jh" label="井号" align="center" min-width="120" show-overflow-tooltip/>
<el-table-column prop="ztcc" label="钻头尺寸mm" align="center" min-width="120" show-overflow-tooltip /> <el-table-column prop="ztcc" label="钻头尺寸mm" align="center" min-width="120" show-overflow-tooltip/>
<el-table-column prop="ztxh" label="钻头型号" align="center" min-width="150" show-overflow-tooltip /> <el-table-column prop="ztxh" label="钻头型号" align="center" min-width="150" show-overflow-tooltip/>
<el-table-column prop="yxlx" label="优选类型" align="center" min-width="120" show-overflow-tooltip /> <el-table-column prop="yxlx" label="优选类型" align="center" min-width="120" show-overflow-tooltip/>
</el-table> </el-table>
<!-- 分页组件 --> <!-- 分页组件 -->
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="pagination.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="pagination.pageSize" :current-page="pagination.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="pagination.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="pagination.total" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total"
style="margin-top: 10px; text-align: right;" /> style="margin-top: 10px; text-align: right;"/>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { getDjztqxt } from '@/api/optimization/initialization'; import {getDjztqxt} from '@/api/optimization/initialization';
export default { export default {
props: { props: {
...@@ -66,6 +81,14 @@ export default { ...@@ -66,6 +81,14 @@ export default {
ztcc: { ztcc: {
type: String, type: String,
required: true, required: true,
},
kcjs: {
type: String,
required: true,
},
ztccsjs: {
type: String,
required: true,
} }
}, },
data() { data() {
...@@ -80,9 +103,33 @@ export default { ...@@ -80,9 +103,33 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 20, pageSize: 20,
total: 0 total: 0
} },
kc: '',
ztccs: '',
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
}; };
}, },
created() {
this.kc=this.kcjs
this.ztccs=this.ztccsjs
},
mounted() { mounted() {
// 不在挂载时自动请求数据,等待父组件触发 loadData() // 不在挂载时自动请求数据,等待父组件触发 loadData()
this.$once('hook:beforeDestroy', this.cleanup); this.$once('hook:beforeDestroy', this.cleanup);
...@@ -93,7 +140,7 @@ export default { ...@@ -93,7 +140,7 @@ export default {
this.getList(); this.getList();
}, },
getList() { getList() {
const params = { zbid: this.zbid, ztccs: this.ztcc, qk: this.qk }; const params = {zbid: this.zbid, ztccs: this.ztcc, qk: this.qk,kc:this.kc}
this.loading = true; this.loading = true;
this.tableLoading = true; this.tableLoading = true;
getDjztqxt(params) getDjztqxt(params)
...@@ -147,7 +194,7 @@ export default { ...@@ -147,7 +194,7 @@ export default {
} }
this.myChart = echarts.init(chartDom); this.myChart = echarts.init(chartDom);
// 解析接口数据(确保折线数据格式正确) // 解析接口数据(确保折线数据格式正确)
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData; const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序:[speed, depth, drillType, jh, cc] // 数据顺序:[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]); const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式:[[钻速, 进尺], ...] // 折线数据必须为数组格式:[[钻速, 进尺], ...]
...@@ -166,30 +213,30 @@ export default { ...@@ -166,30 +213,30 @@ export default {
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]], data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairLines.push({ crosshairLines.push({
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]], data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairCenter.push({ crosshairCenter.push({
name: '十字线中心', name: '十字线中心',
type: 'scatter', type: 'scatter',
data: [[crosshair.y, crosshair.x]], data: [[crosshair.y, crosshair.x]],
symbolSize: 12, symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 } itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
}); });
} }
// 图表配置项(核心:坐标轴触发,确保折线悬浮显示) // 图表配置项(核心:坐标轴触发,确保折线悬浮显示)
const option = { const option = {
title: { text: '钻头钻进能效分析', left: 'center' }, title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: { tooltip: {
trigger: 'axis', // 基于坐标轴触发(不依赖数据点) trigger: 'axis', // 基于坐标轴触发(不依赖数据点)
axisPointer: { axisPointer: {
...@@ -236,11 +283,11 @@ export default { ...@@ -236,11 +283,11 @@ export default {
min: axisRange.xAxis.min, min: axisRange.xAxis.min,
max: axisRange.xAxis.max, max: axisRange.xAxis.max,
// interval: axisRange.xAxis.interval, // interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' }, axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center', nameLocation: 'center',
nameGap: 30, nameGap: 30,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
yAxis: { yAxis: {
name: '进尺m', name: '进尺m',
...@@ -249,8 +296,8 @@ export default { ...@@ -249,8 +296,8 @@ export default {
// interval: axisRange.yAxis.interval, // interval: axisRange.yAxis.interval,
nameLocation: 'center', nameLocation: 'center',
nameGap: 40, nameGap: 40,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
series: [ series: [
{ {
...@@ -261,24 +308,24 @@ export default { ...@@ -261,24 +308,24 @@ export default {
// 彻底隐藏所有点(包括悬浮时) // 彻底隐藏所有点(包括悬浮时)
symbol: 'none', symbol: 'none',
showSymbol: false, showSymbol: false,
emphasis: { showSymbol: false }, emphasis: {showSymbol: false},
lineStyle: { color: 'red', width: 2 } lineStyle: {color: 'red', width: 2}
}, },
{ {
name: '钻速均值', name: '钻速均值',
type: 'line', type: 'line',
data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]], data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]],
lineStyle: { color: '#9eca7f', width: 2, type: 'dashed' }, lineStyle: {color: '#9eca7f', width: 2, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
{ {
name: '进尺均值', name: '进尺均值',
type: 'line', type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]], data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 }, lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
...crosshairLines, ...crosshairLines,
...crosshairCenter, ...crosshairCenter,
......
...@@ -8,7 +8,8 @@ ...@@ -8,7 +8,8 @@
<el-form-item> <el-form-item>
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:jsha:export']">导出</el-button> v-hasPermi="['system:jsha:export']">导出
</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -19,57 +20,57 @@ ...@@ -19,57 +20,57 @@
<div class="main-table-wrapper" :class="{ 'with-detail': selectedRow }"> <div class="main-table-wrapper" :class="{ 'with-detail': selectedRow }">
<el-table border v-loading="loading" :data="jshaList" @selection-change="handleSelectionChange" <el-table border v-loading="loading" :data="jshaList" @selection-change="handleSelectionChange"
@row-click="handleRowClick" height="tableHeight" style="width: 100%"> @row-click="handleRowClick" height="tableHeight" style="width: 100%">
<el-table-column label="序号" align="center" prop="xh" width="90" show-overflow-tooltip fixed /> <el-table-column label="序号" align="center" prop="xh" width="90" show-overflow-tooltip fixed/>
<el-table-column label="井号" align="center" prop="jh" width="110" show-overflow-tooltip fixed /> <el-table-column label="井号" align="center" prop="jh" width="110" show-overflow-tooltip fixed/>
<el-table-column label="钻头序列号" align="center" prop="ztxlh" width="110" show-overflow-tooltip /> <el-table-column label="钻头序列号" align="center" prop="ztxlh" width="110" show-overflow-tooltip/>
<el-table-column label="尺寸mm" align="center" prop="cc" width="90" show-overflow-tooltip /> <el-table-column label="尺寸mm" align="center" prop="cc" width="90" show-overflow-tooltip/>
<el-table-column label="开始井深m" align="center" prop="qsjs" width="110" show-overflow-tooltip /> <el-table-column label="开始井深m" align="center" prop="qsjs" width="110" show-overflow-tooltip/>
<el-table-column label="结束井深m" align="center" prop="zzjs" width="110" show-overflow-tooltip /> <el-table-column label="结束井深m" align="center" prop="zzjs" width="110" show-overflow-tooltip/>
<el-table-column label="进尺m" align="center" prop="jc" width="90" show-overflow-tooltip /> <el-table-column label="进尺m" align="center" prop="jc" width="90" show-overflow-tooltip/>
<el-table-column label="机械钻速m/h" align="center" prop="jxzs" width="110" show-overflow-tooltip /> <el-table-column label="机械钻速m/h" align="center" prop="jxzs" width="110" show-overflow-tooltip/>
<el-table-column label="所钻地层" align="center" prop="szdc" width="110" show-overflow-tooltip /> <el-table-column label="所钻地层" align="center" prop="szdc" width="110" show-overflow-tooltip/>
<el-table-column label="厂家" align="center" prop="cj" width="90" show-overflow-tooltip /> <el-table-column label="厂家" align="center" prop="cj" width="90" show-overflow-tooltip/>
<el-table-column label="钻头型号" align="center" prop="ztxh" width="110" show-overflow-tooltip /> <el-table-column label="钻头型号" align="center" prop="ztxh" width="110" show-overflow-tooltip/>
<el-table-column label="IADC号" align="center" prop="iadc" width="110" show-overflow-tooltip /> <el-table-column label="IADC号" align="center" prop="iadc" width="110" show-overflow-tooltip/>
<el-table-column label="下井次数" align="center" prop="xjcs" width="110" show-overflow-tooltip /> <el-table-column label="下井次数" align="center" prop="xjcs" width="110" show-overflow-tooltip/>
<el-table-column label="类型" align="center" prop="lx" width="90" show-overflow-tooltip /> <el-table-column label="类型" align="center" prop="lx" width="90" show-overflow-tooltip/>
<el-table-column label="入井新度" align="center" prop="rjxd" width="110" show-overflow-tooltip /> <el-table-column label="入井新度" align="center" prop="rjxd" width="110" show-overflow-tooltip/>
<el-table-column label="出井新度" align="center" prop="cjxd" width="110" show-overflow-tooltip /> <el-table-column label="出井新度" align="center" prop="cjxd" width="110" show-overflow-tooltip/>
<el-table-column label="喷嘴直径1号" align="center" prop="pz1" width="110" show-overflow-tooltip /> <el-table-column label="喷嘴直径1号" align="center" prop="pz1" width="110" show-overflow-tooltip/>
<el-table-column label="喷嘴直径2号" align="center" prop="pz2" width="110" show-overflow-tooltip /> <el-table-column label="喷嘴直径2号" align="center" prop="pz2" width="110" show-overflow-tooltip/>
<el-table-column label="喷嘴直径3号" align="center" prop="pz3" width="110" show-overflow-tooltip /> <el-table-column label="喷嘴直径3号" align="center" prop="pz3" width="110" show-overflow-tooltip/>
<el-table-column label="喷嘴直径10号" align="center" prop="pz10" width="110" show-overflow-tooltip /> <el-table-column label="喷嘴直径10号" align="center" prop="pz10" width="110" show-overflow-tooltip/>
<el-table-column label="进尺工作时间合计" align="center" prop="jcsjhj" width="180" show-overflow-tooltip /> <el-table-column label="进尺工作时间合计" align="center" prop="jcsjhj" width="180" show-overflow-tooltip/>
<el-table-column label="进尺工作时间纯钻进" align="center" prop="jcsjczj" width="180" <el-table-column label="进尺工作时间纯钻进" align="center" prop="jcsjczj" width="180"
show-overflow-tooltip /> show-overflow-tooltip/>
<el-table-column label="进尺工作时间起下钻" align="center" prop="jcsjqxz" width="180" <el-table-column label="进尺工作时间起下钻" align="center" prop="jcsjqxz" width="180"
show-overflow-tooltip /> show-overflow-tooltip/>
<el-table-column label="进尺工作时间扩划眼" align="center" prop="jcsjkhy" width="180" <el-table-column label="进尺工作时间扩划眼" align="center" prop="jcsjkhy" width="180"
show-overflow-tooltip /> show-overflow-tooltip/>
<el-table-column label="钻压" align="center" prop="zy" width="90" show-overflow-tooltip /> <el-table-column label="钻压" align="center" prop="zy" width="90" show-overflow-tooltip/>
<el-table-column label="转速" align="center" prop="zs" width="90" show-overflow-tooltip /> <el-table-column label="转速" align="center" prop="zs" width="90" show-overflow-tooltip/>
<el-table-column label="缸径" align="center" prop="gj" width="90" show-overflow-tooltip /> <el-table-column label="缸径" align="center" prop="gj" width="90" show-overflow-tooltip/>
<el-table-column label="泵速" align="center" prop="bs" width="90" show-overflow-tooltip /> <el-table-column label="泵速" align="center" prop="bs" width="90" show-overflow-tooltip/>
<el-table-column label="排量" align="center" prop="pl" width="90" show-overflow-tooltip /> <el-table-column label="排量" align="center" prop="pl" width="90" show-overflow-tooltip/>
<el-table-column label="立管泵压" align="center" prop="lgby" width="110" show-overflow-tooltip /> <el-table-column label="立管泵压" align="center" prop="lgby" width="110" show-overflow-tooltip/>
</el-table> </el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :page-sizes="[20, 40, 60, 80, 100]" @pagination="getList" :limit.sync="queryParams.pageSize" :page-sizes="[20, 40, 60, 80, 100]" @pagination="getList"
style="padding: 10px 0;" /> style="padding: 10px 0;"/>
</div> </div>
<!-- 详细数据表格区域 --> <!-- 详细数据表格区域 -->
<transition name="slide-fade"> <transition name="slide-fade">
<div v-if="selectedRow" class="detail-table-wrapper"> <div v-if="selectedRow" class="detail-table-wrapper">
<el-table :data="[selectedRow]" border style="width: 100%"> <el-table :data="[selectedRow]" border style="width: 100%">
<el-table-column label="刀翼总数" prop="tzxl01" align="center" min-width="10%" /> <el-table-column label="刀翼总数" prop="tzxl01" align="center" min-width="10%"/>
<el-table-column label="布齿密度" prop="tzxl02" align="center" min-width="10%" /> <el-table-column label="布齿密度" prop="tzxl02" align="center" min-width="10%"/>
<el-table-column label="切削齿尺寸mm" prop="tzxl03" align="center" min-width="10%" /> <el-table-column label="切削齿尺寸mm" prop="tzxl03" align="center" min-width="10%"/>
<el-table-column label="切削齿后倾角°" prop="tzxl04" align="center" min-width="10%" /> <el-table-column label="切削齿后倾角°" prop="tzxl04" align="center" min-width="10%"/>
<el-table-column label="冠部轮廓" prop="tzxl05" align="center" min-width="10%" /> <el-table-column label="冠部轮廓" prop="tzxl05" align="center" min-width="10%"/>
<el-table-column label="保径" prop="tzxl06" align="center" min-width="10%" /> <el-table-column label="保径" prop="tzxl06" align="center" min-width="10%"/>
</el-table> </el-table>
</div> </div>
</transition> </transition>
...@@ -80,9 +81,9 @@ ...@@ -80,9 +81,9 @@
</template> </template>
<script> <script>
import { listDjJsha, listJsha, getJsha, delJsha, addJsha, updateJsha } from "@/api/system/jsha"; import {listDjJsha, listJsha, getJsha, delJsha, addJsha, updateJsha} from "@/api/system/jsha";
import { getBlockName, getQkxl } from "@/api/system/jsaa"; import {getBlockName, getQkxl} from "@/api/system/jsaa";
import { listTzsj } from "@/api/system/jsha"; import {listTzsj} from "@/api/system/jsha";
export default { export default {
name: "Jsha", name: "Jsha",
...@@ -106,6 +107,14 @@ export default { ...@@ -106,6 +107,14 @@ export default {
cw: { cw: {
type: String, type: String,
default: '' default: ''
},
wjrqjsjs: {
type: String,
default: ''
},
wjrqksjs: {
type: String,
default: ''
} }
}, },
data() { data() {
...@@ -211,25 +220,25 @@ export default { ...@@ -211,25 +220,25 @@ export default {
// 表单校验 // 表单校验
rules: { rules: {
jh: [ jh: [
{ required: true, message: "井号不能为空", trigger: "blur" } {required: true, message: "井号不能为空", trigger: "blur"}
], ],
xh: [ xh: [
{ required: true, message: "序号不能为空", trigger: "blur" } {required: true, message: "序号不能为空", trigger: "blur"}
], ],
cc: [ cc: [
{ required: true, message: "尺寸不能为空", trigger: "blur" } {required: true, message: "尺寸不能为空", trigger: "blur"}
], ],
qsjs: [ qsjs: [
{ required: true, message: "开始井深不能为空", trigger: "blur" } {required: true, message: "开始井深不能为空", trigger: "blur"}
], ],
zzjs: [ zzjs: [
{ required: true, message: "结束井深不能为空", trigger: "blur" } {required: true, message: "结束井深不能为空", trigger: "blur"}
], ],
jc: [ jc: [
{ required: true, message: "进尺不能为空", trigger: "blur" } {required: true, message: "进尺不能为空", trigger: "blur"}
], ],
jxzs: [ jxzs: [
{ required: true, message: "机械钻速不能为空", trigger: "blur" } {required: true, message: "机械钻速不能为空", trigger: "blur"}
] ]
}, },
selectedRow: null, // 当前选中的行数据 selectedRow: null, // 当前选中的行数据
...@@ -342,12 +351,12 @@ export default { ...@@ -342,12 +351,12 @@ export default {
/** 获取特征数据选项 */ /** 获取特征数据选项 */
getFeatureOptions() { getFeatureOptions() {
const featureTypes = [ const featureTypes = [
{ type: "刀翼总数", target: "t01Options" }, {type: "刀翼总数", target: "t01Options"},
{ type: "布齿密度", target: "t02Options" }, {type: "布齿密度", target: "t02Options"},
{ type: "切削齿尺寸mm", target: "t03Options" }, {type: "切削齿尺寸mm", target: "t03Options"},
{ type: "切削齿后倾角°", target: "t04Options" }, {type: "切削齿后倾角°", target: "t04Options"},
{ type: "冠部轮廓", target: "t05Options" }, {type: "冠部轮廓", target: "t05Options"},
{ type: "保径", target: "t06Options" } {type: "保径", target: "t06Options"}
]; ];
const promises = featureTypes.map(feature => { const promises = featureTypes.map(feature => {
...@@ -398,6 +407,16 @@ export default { ...@@ -398,6 +407,16 @@ export default {
params.cw = String(this.cw).trim(); params.cw = String(this.cw).trim();
} }
if(this.wjrqksjs){
params.wjrqks = String(this.wjrqksjs).trim();
}
if(this.wjrqjsjs){
params.wjrqjs = String(this.wjrqjsjs).trim();
}
console.log('API参数:', params); console.log('API参数:', params);
listDjJsha(params).then(response => { listDjJsha(params).then(response => {
...@@ -565,7 +584,8 @@ export default { ...@@ -565,7 +584,8 @@ export default {
}).then(() => { }).then(() => {
this.getList(); this.getList();
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => { }); }).catch(() => {
});
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
...@@ -727,7 +747,7 @@ export default { ...@@ -727,7 +747,7 @@ export default {
overflow-y: auto; overflow-y: auto;
} }
::v-deep .el-table__cell>.cell { ::v-deep .el-table__cell > .cell {
font-weight: normal; font-weight: normal;
} }
......
...@@ -2,13 +2,14 @@ ...@@ -2,13 +2,14 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;"> <el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;">
<el-tab-pane label="数据表格" name="dataTable"> <el-tab-pane label="钻头使用数据" name="dataTable">
<DataTable ref="dataTableRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk" <DataTable ref="dataTableRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk"
:ztcc="queryParams.ztcc" :jhs="queryParams.jhs" :cw="queryParams.cw" /> :ztcc="queryParams.ztcc" :jhs="queryParams.jhs" :cw="queryParams.cw" :wjrqjsjs="queryParams.wjrqjs" :wjrqksjs="queryParams.wjrqks"/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="曲线图形" name="curveGraph" lazy> <el-tab-pane label="钻头优选" name="curveGraph">
<CurveGraph ref="curveGraphRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk" <CurveGraph ref="curveGraphRef" :jh="queryParams.jh" :famc="queryParams.famc" :qk="queryParams.qk"
:jhs="queryParams.jhs" :zbid="queryParams.zbid" :ztcc="queryParams.ztcc" /> :jhs="queryParams.jhs" :zbid="queryParams.zbid" :ztcc="queryParams.ztcc" :kcjs="queryParams.kc"
:ztccsjs="queryParams.ztccs"/>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
...@@ -42,7 +43,9 @@ export default { ...@@ -42,7 +43,9 @@ export default {
jhs: '', jhs: '',
ztcc: '', ztcc: '',
zbid: '', zbid: '',
cw: '' cw: '',
wjrqks: '',
wjrqjs: ''
}, },
// 标记是否是第一次进入页面 // 标记是否是第一次进入页面
isFirstLoad: true isFirstLoad: true
...@@ -51,8 +54,8 @@ export default { ...@@ -51,8 +54,8 @@ export default {
created() { created() {
// 获取路由参数 // 获取路由参数
console.log('详情页面created,完整路由对象:', this.$route); console.log('详情页面created,完整路由对象:', this.$route);
const { jh, famc, qk, jhs, ztcc, zbid, cw } = this.$route.params; const {jh, famc, qk, jhs, ztcc, zbid, cw, kc, ztccs,wjrqjs,wjrqks} = this.$route.params;
console.log('路由参数:', { jh, famc, qk, jhs, ztcc, zbid, cw }); console.log('路由参数:', {jh, famc, qk, jhs, ztcc, zbid, cw, kc, ztccs,wjrqjs,wjrqks});
// 检查参数是否为空或undefined // 检查参数是否为空或undefined
// if (jh && jh !== 'undefined' && jh !== 'null') { // if (jh && jh !== 'undefined' && jh !== 'null') {
...@@ -63,6 +66,10 @@ export default { ...@@ -63,6 +66,10 @@ export default {
this.queryParams.ztcc = ztcc || '' this.queryParams.ztcc = ztcc || ''
this.queryParams.zbid = zbid || '' this.queryParams.zbid = zbid || ''
this.queryParams.cw = cw || '' this.queryParams.cw = cw || ''
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
this.queryParams.wjrqks = wjrqks || '';
this.queryParams.wjrqjs = wjrqjs || '';
console.log('设置 queryParams:', this.queryParams); console.log('设置 queryParams:', this.queryParams);
// 强制默认展示“数据表格”Tab // 强制默认展示“数据表格”Tab
this.activeTab = 'dataTable'; this.activeTab = 'dataTable';
...@@ -102,7 +109,8 @@ export default { ...@@ -102,7 +109,8 @@ export default {
this.$modal.confirm('是否确认移除选中的记录?').then(() => { this.$modal.confirm('是否确认移除选中的记录?').then(() => {
// 这里可以调用API进行删除操作 // 这里可以调用API进行删除操作
this.$modal.msgSuccess("移除成功"); this.$modal.msgSuccess("移除成功");
}).catch(() => { }); }).catch(() => {
});
}, },
// 多选框选中数据 // 多选框选中数据
...@@ -156,7 +164,7 @@ export default { ...@@ -156,7 +164,7 @@ export default {
} }
} }
::v-deep .el-table__cell>.cell { ::v-deep .el-table__cell > .cell {
font-weight: normal; font-weight: normal;
} }
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<el-form-item label="区块" prop="qk"> <el-form-item label="区块" prop="qk">
<el-select v-model="searchForm.qk" placeholder="请选择区块" clearable filterable style="width: 150px;"> <el-select v-model="searchForm.qk" placeholder="请选择区块" clearable filterable style="width: 150px;">
<el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk" <el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk"
v-if="item && item.qk" /> v-if="item && item.qk"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="钻头尺寸"> <el-form-item label="钻头尺寸">
...@@ -23,14 +23,14 @@ ...@@ -23,14 +23,14 @@
<!-- 表格区域 --> <!-- 表格区域 -->
<el-table :data="tableData" border stripe v-loading="loading" style="width: 100%; height: calc(100vh - 230px)"> <el-table :data="tableData" border stripe v-loading="loading" style="width: 100%; height: calc(100vh - 230px)">
<el-table-column prop="qk" label="区块" align="center" min-width="70" show-overflow-tooltip></el-table-column> <el-table-column prop="qk" label="区块" align="center" min-width="70" show-overflow-tooltip></el-table-column>
<el-table-column prop="famc" label="方案名称" align="center" min-width="100" show-overflow-tooltip sortable /> <el-table-column prop="famc" label="方案名称" align="center" min-width="100" show-overflow-tooltip sortable/>
<el-table-column prop="ztcc" label="钻头尺寸mm" align="center" min-width="160" <el-table-column prop="ztcc" label="钻头尺寸mm" align="center" min-width="160"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="dc" label="地层" align="center" min-width="120" <el-table-column prop="dc" label="地层" align="center" min-width="120"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column prop="yxzt" label="综合最优" align="center" min-width="155" show-overflow-tooltip sortable /> <el-table-column prop="yxzt" label="综合最优" align="center" min-width="155" show-overflow-tooltip sortable/>
<el-table-column prop="jczt" label="进尺最优" align="center" min-width="155" show-overflow-tooltip sortable /> <el-table-column prop="jczt" label="进尺最优" align="center" min-width="155" show-overflow-tooltip sortable/>
<el-table-column prop="jxzszt" label="转速最优" align="center" min-width="155" show-overflow-tooltip sortable /> <el-table-column prop="jxzszt" label="转速最优" align="center" min-width="155" show-overflow-tooltip sortable/>
<el-table-column prop="bz" label="备注" align="center" min-width="180" <el-table-column prop="bz" label="备注" align="center" min-width="180"
show-overflow-tooltip></el-table-column> show-overflow-tooltip></el-table-column>
<el-table-column label="操作" width="160" align="center" fixed="right"> <el-table-column label="操作" width="160" align="center" fixed="right">
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<el-pagination style="margin-top: 10px; text-align: right;" v-model:current-page="pagination.currentPage" <el-pagination style="margin-top: 10px; text-align: right;" v-model:current-page="pagination.currentPage"
v-model:page-size="pagination.pageSize" :page-sizes="[10, 20, 50, 100]" :total="pagination.total" v-model:page-size="pagination.pageSize" :page-sizes="[10, 20, 50, 100]" :total="pagination.total"
layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
@current-change="handleCurrentChange" background /> @current-change="handleCurrentChange" background/>
<!-- 新增/编辑对话框 --> <!-- 新增/编辑对话框 -->
<el-dialog :title="dialogTitle" width="900px" :close-on-click-modal="false" :visible.sync="dialogVisible"> <el-dialog :title="dialogTitle" width="900px" :close-on-click-modal="false" :visible.sync="dialogVisible">
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="方案名称" prop="famc"> <el-form-item label="方案名称" prop="famc">
<el-input v-model="formData.famc" placeholder="请输入方案名称" /> <el-input v-model="formData.famc" placeholder="请输入方案名称"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
<el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable <el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable
style="width: 100%;"> style="width: 100%;">
<el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk" <el-option v-for="item in blockOptions" :key="item.qk" :label="item.qk" :value="item.qk"
v-if="item && item.qk" style="width: 100%;" /> v-if="item && item.qk" style="width: 100%;"/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -71,9 +71,9 @@ ...@@ -71,9 +71,9 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="完井时间" prop="wjsjks" required> <el-form-item label="完井时间" prop="wjsjks" required>
<el-date-picker v-model="formData.wjsjks" type="date" placeholder="选择开始日期" <el-date-picker v-model="formData.wjsjks" type="date" placeholder="选择开始日期"
style="width: 50%;" /> style="width: 50%;"/>
<el-date-picker v-model="formData.wjsjjs" type="date" placeholder="选择结束日期" <el-date-picker v-model="formData.wjsjjs" type="date" placeholder="选择结束日期"
style="width: 50%;" /> style="width: 50%;"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -94,37 +94,44 @@ ...@@ -94,37 +94,44 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="钻头尺寸mm" prop="ztcc"> <el-form-item label="钻头尺寸mm" prop="ztcc">
<el-select v-model="formData.ztcc" multiple filterable allow-create default-first-option <el-input v-model="formData.ztcc" placeholder="请输入井眼尺寸"/>
placeholder="请选择或输入钻头尺寸" style="width: 100%" :loading="ztxxLoading">
<el-option v-for="item in ztxxOptions" :key="item.value" :label="item.label" <!-- <el-select v-model="formData.ztcc" multiple filterable allow-create default-first-option-->
:value="item.value" /> <!-- placeholder="请选择或输入钻头尺寸" style="width: 100%" :loading="ztxxLoading">-->
</el-select> <!-- <el-option v-for="item in ztxxOptions" :key="item.value" :label="item.label"-->
<!-- :value="item.value"/>-->
<!-- </el-select>-->
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="进尺最优比例" prop="jcbl"> <el-form-item label="开次" prop="kc">
<el-select v-model="formData.jcbl" placeholder="请选择进尺最优比例" clearable style="width: 100%;"> <el-select v-model="formData.kc" filterable placeholder="请选择或输入钻头尺寸" style="width: 100%">
<el-option label="0.2" value="0.2" /> <el-option v-for="item in kcData" :key="item.value" :label="item.label"
<el-option label="0.3" value="0.3" /> :value="item.value"/>
<el-option label="0.4" value="0.4" />
<el-option label="0.5" value="0.5" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="机械钻速最优比例" prop="jxzsbl"> <el-form-item label="进尺最优比例" prop="jcbl">
<el-select v-model="formData.jxzsbl" placeholder="请选择机械钻速最优比例" clearable <el-slider v-model="formData.jcbl" :max="1" :min="0" :step="0.1"
style="width: 100%;"> :format-tooltip="formatTooltip"></el-slider>
<el-option label="0.2" value="0.2" />
<el-option label="0.3" value="0.3" />
<el-option label="0.4" value="0.4" />
<el-option label="0.5" value="0.5" />
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="机械钻速最优比例" prop="jxzsbl">
<el-slider v-model="formData.jxzsbl" :max="1" :min="0" :step="0.1"
:format-tooltip="formatTooltip"></el-slider>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="bz"> <el-form-item label="备注" prop="bz">
<el-input v-model="formData.bz" type="textarea" :rows="3" placeholder="请输入备注信息"></el-input> <el-input v-model="formData.bz" type="textarea" :rows="3" placeholder="请输入备注信息"></el-input>
</el-form-item> </el-form-item>
...@@ -142,9 +149,10 @@ ...@@ -142,9 +149,10 @@
</template> </template>
<script> <script>
import { getQkxl } from "@/api/system/jsaa"; import {getQkxl} from "@/api/system/jsaa";
import { getMdcByQkid } from "@/api/scientificDrill/schemeOptimization"; import {getMdcByQkid} from "@/api/scientificDrill/schemeOptimization";
import { selectZtccList, listDjzt, getDjzt, addDjzt, updateDjzt, delDjzt } from "@/api/system/djzt"; import {selectZtccList, listDjzt, getDjzt, addDjzt, updateDjzt, delDjzt} from "@/api/system/djzt";
export default { export default {
name: 'DjztIndex', name: 'DjztIndex',
data() { data() {
...@@ -185,7 +193,8 @@ export default { ...@@ -185,7 +193,8 @@ export default {
formData: { formData: {
id: null, id: null,
qk: '', qk: '',
ztcc: [], kc: '',
ztcc: '',
cw: '', // 层位信息 cw: '', // 层位信息
cwid: null, // 层位ID cwid: null, // 层位ID
mdcid: null, // 目的层ID mdcid: null, // 目的层ID
...@@ -193,24 +202,42 @@ export default { ...@@ -193,24 +202,42 @@ export default {
wjsjks: this.getFiveYearsAgoDate(), // 完井开始日期默认前五年的今天 wjsjks: this.getFiveYearsAgoDate(), // 完井开始日期默认前五年的今天
wjsjjs: this.getTodayDate(), // 完井结束日期默认今天 wjsjjs: this.getTodayDate(), // 完井结束日期默认今天
bz: '', bz: '',
jcbl: '', // 进尺最优比例 jcbl: 0.2, // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例 jxzsbl: 0.2 // 机械钻速最优比例
}, },
// 表单验证规则 // 表单验证规则
formRules: { formRules: {
famc: [ famc: [
{ required: true, message: '请输入方案名称', trigger: 'blur' } {required: true, message: '请输入方案名称', trigger: 'blur'}
], ],
qk: [ qk: [
{ required: true, message: '请输入区块', trigger: 'blur' } {required: true, message: '请输入区块', trigger: 'blur'}
], ],
jcbl: [{ required: true, message: '请选择进尺最优比例', trigger: 'change' }], jcbl: [{required: true, message: '请选择进尺最优比例', trigger: 'change'}],
jxzsbl: [{ required: true, message: '请选择机械钻速最优比例', trigger: 'change' }] jxzsbl: [{required: true, message: '请选择机械钻速最优比例', trigger: 'change'}]
}, },
// 钻头信息选项 // 钻头信息选项
ztxxOptions: [], ztxxOptions: [],
// 钻头信息加载状态 // 钻头信息加载状态
ztxxLoading: false, ztxxLoading: false,
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
} }
}, },
watch: { watch: {
...@@ -264,8 +291,13 @@ export default { ...@@ -264,8 +291,13 @@ export default {
qk: res.data.qk || row.qk || '', qk: res.data.qk || row.qk || '',
zbid: res.data.id || row.id || '', zbid: res.data.id || row.id || '',
cw: row.cw || row.dc || '', cw: row.cw || row.dc || '',
kc: res.data.kc || row.kc || '',
ztccs: res.data.ztcc || row.ztcc || '',
wjrqks: res.data.wjsjks || row.wjsjks || '',
wjrqjs: res.data.wjsjjs || row.wjsjjs || '',
}; };
console.log('params',params)
this.$router.push({ this.$router.push({
name: 'DjztDetail', name: 'DjztDetail',
params: params params: params
...@@ -489,9 +521,9 @@ export default { ...@@ -489,9 +521,9 @@ export default {
}, },
// 条件满足后再请求钻头尺寸 // 条件满足后再请求钻头尺寸
updateZtccOptionsIfReady() { updateZtccOptionsIfReady() {
const { qk, wjsjks, wjsjjs, cwid, mdcid } = this.formData; const {qk, wjsjks, wjsjjs, cwid, mdcid} = this.formData;
if (qk && wjsjks && wjsjjs && (cwid || mdcid)) { if (qk && wjsjks && wjsjjs && (cwid || mdcid)) {
const params = { qk, wjsjks, wjsjjs, cwid: cwid || undefined, mdcid: mdcid || undefined }; const params = {qk, wjsjks, wjsjjs, cwid: cwid || undefined, mdcid: mdcid || undefined};
this.getZtxxOptions(params); this.getZtxxOptions(params);
} }
}, },
...@@ -553,7 +585,8 @@ export default { ...@@ -553,7 +585,8 @@ export default {
this.formData = { this.formData = {
id: null, id: null,
qk: '', qk: '',
ztcc: [], kc: '',
ztcc: '',
cw: '', // 层位信息 cw: '', // 层位信息
cwid: null, // 层位ID cwid: null, // 层位ID
mdcid: null, // 目的层ID mdcid: null, // 目的层ID
...@@ -561,8 +594,8 @@ export default { ...@@ -561,8 +594,8 @@ export default {
wjsjks: this.getFiveYearsAgoDate(), wjsjks: this.getFiveYearsAgoDate(),
wjsjjs: this.getTodayDate(), wjsjjs: this.getTodayDate(),
bz: '', bz: '',
jcbl: '', // 进尺最优比例 jcbl: 0.2, // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例 jxzsbl: 0.2 // 机械钻速最优比例
} }
this.dialogVisible = true this.dialogVisible = true
// 新增打开时尝试基于默认年份加载(需等区块与层位选择后) // 新增打开时尝试基于默认年份加载(需等区块与层位选择后)
...@@ -575,7 +608,9 @@ export default { ...@@ -575,7 +608,9 @@ export default {
this.formData = { this.formData = {
id: row.id, id: row.id,
qk: row.qk, qk: row.qk,
ztcc: Array.isArray(row.ztcc) ? row.ztcc : (row.ztcc ? row.ztcc.split(',') : []), kc: row.kc,
// ztcc: Array.isArray(row.ztcc) ? row.ztcc : (row.ztcc ? row.ztcc.split(',') : []),
ztcc: row.ztcc,
cw: row.cw || row.dc || '', // 层位信息 cw: row.cw || row.dc || '', // 层位信息
cwid: row.cwid || null, // 层位ID cwid: row.cwid || null, // 层位ID
mdcid: row.mdcid || null, // 目的层ID mdcid: row.mdcid || null, // 目的层ID
...@@ -612,7 +647,8 @@ export default { ...@@ -612,7 +647,8 @@ export default {
console.error('删除失败:', error) console.error('删除失败:', error)
this.$message.error('删除失败') this.$message.error('删除失败')
} }
}).catch(() => { }) }).catch(() => {
})
}, },
// 提交表单 // 提交表单
...@@ -624,7 +660,8 @@ export default { ...@@ -624,7 +660,8 @@ export default {
// 准备提交数据,将数组转换为字符串,将Date对象转换为字符串 // 准备提交数据,将数组转换为字符串,将Date对象转换为字符串
const submitData = { const submitData = {
...this.formData, ...this.formData,
ztcc: Array.isArray(this.formData.ztcc) ? this.formData.ztcc.join(',') : this.formData.ztcc, // ztcc: Array.isArray(this.formData.ztcc) ? this.formData.ztcc.join(',') : this.formData.ztcc,
ztcc: this.formData.ztcc,
dc: this.formData.cw || '', // 使用层位信息作为地层 dc: this.formData.cw || '', // 使用层位信息作为地层
cw: this.formData.cw || '', // 保留层位信息 cw: this.formData.cw || '', // 保留层位信息
cwid: this.formData.cwid || null, cwid: this.formData.cwid || null,
...@@ -671,6 +708,10 @@ export default { ...@@ -671,6 +708,10 @@ export default {
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields(); this.$refs[refName].resetFields();
} }
},
formatTooltip(val) {
return val;
} }
} }
} }
......
...@@ -3,12 +3,25 @@ ...@@ -3,12 +3,25 @@
<div v-if="jh" class="well-number-display"> <div v-if="jh" class="well-number-display">
<span class="well-label">井号:</span> <span class="well-label">井号:</span>
<span class="well-number">{{ jh }}</span> <span class="well-number">{{ jh }}</span>
<span class="well-label" style="margin-left: 10px">开次:</span>
<el-select v-model="kc" style="width: 100px" size="mini" clearable placeholder="请选择">
<el-option
v-for="item in kcData"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<span class="well-label" style="margin-left: 10px">钻头尺寸:</span>
<el-input v-model="ztccs" style="width: 100px" clearable size="mini"></el-input>
<el-button type="primary" size="mini" @click="getList">查询</el-button>
<el-button type="primary" icon="el-icon-download" size="mini" @click="exportChart"
:disabled="!myChart"></el-button>
</div> </div>
<div class="chart-wrapper"> <div class="chart-wrapper">
<el-button type="primary" icon="el-icon-download" size="small" class="export-btn" @click="exportChart"
:disabled="!myChart">
导出图片
</el-button>
<div id="drillingEfficiencyChart" class="chart"></div> <div id="drillingEfficiencyChart" class="chart"></div>
</div> </div>
</div> </div>
...@@ -16,7 +29,7 @@ ...@@ -16,7 +29,7 @@
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts';
import { getqxt } from '@/api/optimization/initialization'; import {getqxt} from '@/api/optimization/initialization';
export default { export default {
props: { props: {
...@@ -29,7 +42,27 @@ export default { ...@@ -29,7 +42,27 @@ export default {
return { return {
chartData: null, chartData: null,
myChart: null, myChart: null,
resizeHandler: null resizeHandler: null,
kc:'',
ztccs:'',
kcData:[
{
label:'1',
value:'1',
},{
label:'2',
value:'2',
},{
label:'3',
value:'3',
},{
label:'4',
value:'4',
},{
label:'5',
value:'5',
},
]
}; };
}, },
mounted() { mounted() {
...@@ -38,7 +71,7 @@ export default { ...@@ -38,7 +71,7 @@ export default {
}, },
methods: { methods: {
getList() { getList() {
const params = { jhe: this.jh }; const params = {jhe: this.jh,kc:this.kc,ztccs:this.ztccs};
getqxt(params) getqxt(params)
.then(res => { .then(res => {
console.log('接口返回数据:', res); console.log('接口返回数据:', res);
...@@ -52,6 +85,7 @@ export default { ...@@ -52,6 +85,7 @@ export default {
}); });
}, },
initChart() { initChart() {
if (!this.chartData) { if (!this.chartData) {
const chartDom = document.getElementById('drillingEfficiencyChart'); const chartDom = document.getElementById('drillingEfficiencyChart');
...@@ -75,7 +109,7 @@ export default { ...@@ -75,7 +109,7 @@ export default {
} }
this.myChart = echarts.init(chartDom); this.myChart = echarts.init(chartDom);
// 解析接口数据(确保折线数据格式正确) // 解析接口数据(确保折线数据格式正确)
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData; const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序:[speed, depth, drillType, jh, cc] // 数据顺序:[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]); const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式:[[钻速, 进尺], ...] // 折线数据必须为数组格式:[[钻速, 进尺], ...]
...@@ -95,29 +129,29 @@ export default { ...@@ -95,29 +129,29 @@ export default {
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]], data: [[crosshair.y - 10, crosshair.x], [crosshair.y + 10, crosshair.x]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairLines.push({ crosshairLines.push({
name: '十字线', name: '十字线',
type: 'line', type: 'line',
data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]], data: [[crosshair.y, crosshair.x - 500], [crosshair.y, crosshair.x + 500]],
lineStyle: { color: 'black', width: 1, type: 'dashed' }, lineStyle: {color: 'black', width: 1, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } // 十字线不显示tooltip tooltip: {show: false} // 十字线不显示tooltip
}); });
crosshairCenter.push({ crosshairCenter.push({
name: '十字线中心', name: '十字线中心',
type: 'scatter', type: 'scatter',
data: [[crosshair.y, crosshair.x]], data: [[crosshair.y, crosshair.x]],
symbolSize: 12, symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 } itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
}); });
} }
// 图表配置项(核心:坐标轴触发,确保折线悬浮显示) // 图表配置项(核心:坐标轴触发,确保折线悬浮显示)
const option = { const option = {
title: { text: '钻头钻进能效分析', left: 'center' }, title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: { tooltip: {
trigger: 'axis', // 基于坐标轴触发(不依赖数据点) trigger: 'axis', // 基于坐标轴触发(不依赖数据点)
axisPointer: { axisPointer: {
...@@ -164,11 +198,11 @@ export default { ...@@ -164,11 +198,11 @@ export default {
min: axisRange.xAxis.min, min: axisRange.xAxis.min,
max: axisRange.xAxis.max, max: axisRange.xAxis.max,
interval: axisRange.xAxis.interval, interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' }, axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center', nameLocation: 'center',
nameGap: 30, nameGap: 30,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
yAxis: { yAxis: {
name: '进尺', name: '进尺',
...@@ -177,8 +211,8 @@ export default { ...@@ -177,8 +211,8 @@ export default {
interval: axisRange.yAxis.interval, interval: axisRange.yAxis.interval,
nameLocation: 'center', nameLocation: 'center',
nameGap: 40, nameGap: 40,
axisTick: { show: true }, axisTick: {show: true},
axisLine: { show: true } axisLine: {show: true}
}, },
series: [ series: [
{ {
...@@ -189,24 +223,24 @@ export default { ...@@ -189,24 +223,24 @@ export default {
// 彻底隐藏所有点(包括悬浮时) // 彻底隐藏所有点(包括悬浮时)
symbol: 'none', symbol: 'none',
showSymbol: false, showSymbol: false,
emphasis: { showSymbol: false }, emphasis: {showSymbol: false},
lineStyle: { color: 'red', width: 2 } lineStyle: {color: 'red', width: 2}
}, },
{ {
name: '钻速均值', name: '钻速均值',
type: 'line', type: 'line',
data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]], data: [[crosshair.x, axisRange.yAxis.min], [crosshair.x, axisRange.yAxis.max]],
lineStyle: { color: '#9eca7f', width: 2, type: 'dashed' }, lineStyle: {color: '#9eca7f', width: 2, type: 'dashed'},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
{ {
name: '进尺均值', name: '进尺均值',
type: 'line', type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]], data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 }, lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none', symbol: 'none',
tooltip: { show: false } tooltip: {show: false}
}, },
...crosshairLines, ...crosshairLines,
...crosshairCenter, ...crosshairCenter,
......
...@@ -6,16 +6,6 @@ ...@@ -6,16 +6,6 @@
<el-input v-model="queryParams.jh" placeholder="请输入井号" clearable @keyup.enter.native="handleQuery" <el-input v-model="queryParams.jh" placeholder="请输入井号" clearable @keyup.enter.native="handleQuery"
disabled /> disabled />
</el-form-item> </el-form-item>
<!-- <el-form-item label="井号" prop="jh">
<el-input v-model="queryParams.jh" placeholder="请输入井号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="井眼编号" prop="jybh">
<el-input v-model="queryParams.jybh" placeholder="请输入井眼编号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="日期" prop="rq">
<el-date-picker clearable v-model="queryParams.rq" type="date" value-format="yyyy-MM-dd" placeholder="请选择日期">
</el-date-picker>
</el-form-item> -->
<el-form-item label="开始井深m" prop="beginJs"> <el-form-item label="开始井深m" prop="beginJs">
<el-input v-model="queryParams.beginJs" placeholder="请输入开始井深" clearable <el-input v-model="queryParams.beginJs" placeholder="请输入开始井深" clearable
@keyup.enter.native="handleQuery" /> @keyup.enter.native="handleQuery" />
...@@ -24,233 +14,24 @@ ...@@ -24,233 +14,24 @@
<el-input v-model="queryParams.endJs" placeholder="请输入结束井深" clearable <el-input v-model="queryParams.endJs" placeholder="请输入结束井深" clearable
@keyup.enter.native="handleQuery" /> @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
<!-- <el-form-item label="垂深" prop="cs">
<el-input v-model="queryParams.cs" placeholder="请输入垂深" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="迟到井深" prop="cdjs">
<el-input v-model="queryParams.cdjs" placeholder="请输入迟到井深" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="钻头型号" prop="ztxh">
<el-input v-model="queryParams.ztxh" placeholder="请输入钻头型号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="钻头直径" prop="ztzj">
<el-input v-model="queryParams.ztzj" placeholder="请输入钻头直径" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="进尺" prop="jc">
<el-input v-model="queryParams.jc" placeholder="请输入进尺" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="大钩负荷" prop="dgfh">
<el-input v-model="queryParams.dgfh" placeholder="请输入大钩负荷" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="钻压" prop="zy">
<el-input v-model="queryParams.zy" placeholder="请输入钻压" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="转速" prop="zs1">
<el-input v-model="queryParams.zs1" placeholder="请输入转速" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="扭矩" prop="nj">
<el-input v-model="queryParams.nj" placeholder="请输入扭矩" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="顶驱扭矩" prop="dqnj">
<el-input v-model="queryParams.dqnj" placeholder="请输入顶驱扭矩" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="成本" prop="cb">
<el-input v-model="queryParams.cb" placeholder="请输入成本" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="纯钻进时间" prop="zzsj">
<el-input v-model="queryParams.zzsj" placeholder="请输入纯钻进时间" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="运行时间" prop="yxsj">
<el-input v-model="queryParams.yxsj" placeholder="请输入运行时间" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="钻井天数" prop="zjts">
<el-input v-model="queryParams.zjts" placeholder="请输入钻井天数" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积1" prop="ctj1">
<el-input v-model="queryParams.ctj1" placeholder="请输入池体积1" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积2" prop="ctj2">
<el-input v-model="queryParams.ctj2" placeholder="请输入池体积2" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积3" prop="ctj3">
<el-input v-model="queryParams.ctj3" placeholder="请输入池体积3" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积4" prop="ctj4">
<el-input v-model="queryParams.ctj4" placeholder="请输入池体积4" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积5" prop="ctj5">
<el-input v-model="queryParams.ctj5" placeholder="请输入池体积5" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积6" prop="ctj6">
<el-input v-model="queryParams.ctj6" placeholder="请输入池体积6" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积7" prop="ctj7">
<el-input v-model="queryParams.ctj7" placeholder="请输入池体积7" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="池体积8" prop="ctj8">
<el-input v-model="queryParams.ctj8" placeholder="请输入池体积8" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="DC指数" prop="dczs">
<el-input v-model="queryParams.dczs" placeholder="请输入DC指数" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="地层压力梯度" prop="dcyltd">
<el-input v-model="queryParams.dcyltd" placeholder="请输入地层压力梯度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="破裂压力梯度" prop="plyltd">
<el-input v-model="queryParams.plyltd" placeholder="请输入破裂压力梯度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="设计地层压力" prop="sjdcyl">
<el-input v-model="queryParams.sjdcyl" placeholder="请输入设计地层压力" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="1号泵冲" prop="yhbc">
<el-input v-model="queryParams.yhbc" placeholder="请输入1号泵冲" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="2号泵冲" prop="ehbc">
<el-input v-model="queryParams.ehbc" placeholder="请输入2号泵冲" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="3号泵冲" prop="shbc">
<el-input v-model="queryParams.shbc" placeholder="请输入3号泵冲" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="总泵冲" prop="zbc">
<el-input v-model="queryParams.zbc" placeholder="请输入总泵冲" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="入口流量" prop="rkll">
<el-input v-model="queryParams.rkll" placeholder="请输入入口流量" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="出口温度" prop="ckll">
<el-input v-model="queryParams.ckll" placeholder="请输入出口温度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="入口密度" prop="rkmd">
<el-input v-model="queryParams.rkmd" placeholder="请输入入口密度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="出口密度" prop="ckmd">
<el-input v-model="queryParams.ckmd" placeholder="请输入出口密度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="入口电导" prop="rkdd">
<el-input v-model="queryParams.rkdd" placeholder="请输入入口电导" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="入口温度" prop="rkwd">
<el-input v-model="queryParams.rkwd" placeholder="请输入入口温度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="出口温度" prop="ckwd">
<el-input v-model="queryParams.ckwd" placeholder="请输入出口温度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="总池体积" prop="zctj">
<el-input v-model="queryParams.zctj" placeholder="请输入总池体积" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="泥浆溢漏" prop="njyl">
<el-input v-model="queryParams.njyl" placeholder="请输入泥浆溢漏" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="钻时" prop="zs">
<el-input v-model="queryParams.zs" placeholder="请输入钻时" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="立压" prop="ly">
<el-input v-model="queryParams.ly" placeholder="请输入立压" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="套压" prop="ty">
<el-input v-model="queryParams.ty" placeholder="请输入套压" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="返出时间" prop="fcsj">
<el-input v-model="queryParams.fcsj" placeholder="请输入返出时间" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="DC趋势线" prop="dcqsx">
<el-input v-model="queryParams.dcqsx" placeholder="请输入DC趋势线" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="当量密度" prop="dlmd">
<el-input v-model="queryParams.dlmd" placeholder="请输入当量密度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="大钩高度" prop="dggd">
<el-input v-model="queryParams.dggd" placeholder="请输入大钩高度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="瞬时钻时" prop="sszs">
<el-input v-model="queryParams.sszs" placeholder="请输入瞬时钻时" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="顶驱转速" prop="dqzs">
<el-input v-model="queryParams.dqzs" placeholder="请输入顶驱转速" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="DCS孔隙度" prop="dcskxd">
<el-input v-model="queryParams.dcskxd" placeholder="请输入DCS孔隙度" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="SIGMA" prop="sigma">
<el-input v-model="queryParams.sigma" placeholder="请输入SIGMA" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="SIGMA趋向" prop="sigman">
<el-input v-model="queryParams.sigman" placeholder="请输入SIGMA趋向" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="SIGMA地压梯度" prop="sigmadytd">
<el-input v-model="queryParams.sigmadytd" placeholder="请输入SIGMA地压梯度" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="SIGMA破压梯度" prop="sigmapytd">
<el-input v-model="queryParams.sigmapytd" placeholder="请输入SIGMA破压梯度" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="SIGMA孔隙度" prop="sigmakxd">
<el-input v-model="queryParams.sigmakxd" placeholder="请输入SIGMA孔隙度" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="地层提示" prop="dcts">
<el-input v-model="queryParams.dcts" placeholder="请输入地层提示" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="作业类别1" prop="zylb1">
<el-input v-model="queryParams.zylb1" placeholder="请输入作业类别1" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="作业类别2" prop="zylb2">
<el-input v-model="queryParams.zylb2" placeholder="请输入作业类别2" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="录入时间" prop="lrsj">
<el-input v-model="queryParams.lrsj" placeholder="请输入录入时间" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="井眼名称" prop="jymc">
<el-input v-model="queryParams.jymc" placeholder="请输入井眼名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="迟到时间" prop="cdsj">
<el-input v-model="queryParams.cdsj" placeholder="请输入迟到时间" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="出口电导" prop="ckdd">
<el-input v-model="queryParams.ckdd" placeholder="请输入出口电导" clearable @keyup.enter.native="handleQuery" />
</el-form-item> -->
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:ljSssjSd:add']">新增</el-button> >新增</el-button>
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:ljSssjSd:export']">导出</el-button> >导出</el-button>
<el-button type="success" plain icon="el-icon-upload" size="mini" @click="handleImport" <el-button type="success" plain icon="el-icon-upload" size="mini" @click="handleImport"
v-hasPermi="['system:ljSssjSd:import']">导入</el-button> >导入</el-button>
<el-button type="success" plain size="mini" @click="handleSjtb"
>录井数据同步</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-table border :data="ljSssjSdList" @selection-change="handleSelectionChange" :height="TableHeight()"
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
v-hasPermi="['system:ljSssjSd:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
v-hasPermi="['system:ljSssjSd:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
v-hasPermi="['system:ljSssjSd:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:ljSssjSd:export']">导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> -->
<el-table border :data="ljSssjSdList" @selection-change="handleSelectionChange" height="calc(100vh - 190px)"
style="width: 100%"> style="width: 100%">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<!-- <el-table-column label="id" align="center" prop="id" /> -->
<!-- <el-table-column label="井号" align="center" prop="jh" min-width="100" show-overflow-tooltip fixed />
<el-table-column label="井眼编号" align="center" prop="jybh" min-width="80" show-overflow-tooltip />
<el-table-column label="日期" align="center" prop="rq" min-width="100" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ parseTime(scope.row.rq, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column> -->
<el-table-column label="井深" align="center" prop="js" min-width="80" show-overflow-tooltip /> <el-table-column label="井深" align="center" prop="js" min-width="80" show-overflow-tooltip />
<el-table-column label="垂深" align="center" prop="cs" min-width="80" show-overflow-tooltip /> <el-table-column label="垂深" align="center" prop="cs" min-width="80" show-overflow-tooltip />
<!-- <el-table-column label="迟到井深" align="center" prop="cdjs" min-width="90" show-overflow-tooltip /> <!-- <el-table-column label="迟到井深" align="center" prop="cdjs" min-width="90" show-overflow-tooltip />
...@@ -317,9 +98,9 @@ ...@@ -317,9 +98,9 @@
fixed="right"> fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['system:ljSssjSd:edit']">修改</el-button> >修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['system:ljSssjSd:remove']">删除</el-button> >删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -897,7 +678,7 @@ ...@@ -897,7 +678,7 @@
</template> </template>
<script> <script>
import { listLjSssjSd, getLjSssjSd, delLjSssjSd, addLjSssjSd, updateLjSssjSd } from "@/api/optimization/ljSssjSd"; import { listLjSssjSd, getLjSssjSd, delLjSssjSd, addLjSssjSd, updateLjSssjSd,getLjzmsj } from "@/api/optimization/ljSssjSd";
import { getToken } from "@/utils/auth"; import { getToken } from "@/utils/auth";
export default { export default {
...@@ -1278,6 +1059,20 @@ export default { ...@@ -1278,6 +1059,20 @@ export default {
handleDownloadTemplate() { handleDownloadTemplate() {
this.download('system/ljSssjSd/exportMb', {}, '录井整米数据导入模板.xlsx'); this.download('system/ljSssjSd/exportMb', {}, '录井整米数据导入模板.xlsx');
}, },
handleSjtb(){
this.queryParams.jh
getLjzmsj({jh:this.queryParams.jh}).then(res=>{
console.log(res)
})
},
TableHeight() {
const windowHeight = window.innerHeight;
const topBarHeight = 130;
const componentMargin = 160;
const tableHeight = windowHeight - topBarHeight - componentMargin;
return tableHeight;
},
} }
}; };
</script> </script>
......
...@@ -3,12 +3,21 @@ ...@@ -3,12 +3,21 @@
<div v-if="jh" class="well-number-display"> <div v-if="jh" class="well-number-display">
<span class="well-label">井号:</span> <span class="well-label">井号:</span>
<span class="well-number">{{ jh }}</span> <span class="well-number">{{ jh }}</span>
<span class="well-label" style="margin-left: 10px">钻时颜色</span>
<el-color-picker
v-model="color1"
size="mini"
@change="handleColor"
></el-color-picker>
<el-button
type="primary"
icon="el-icon-download"
size="mini"
@click="exportChart"
:disabled="!myChart"
></el-button>
</div> </div>
<div class="chart-wrapper"> <div class="chart-wrapper">
<!-- <el-button type="primary" icon="el-icon-download" size="small" class="export-btn" @click="exportChart"
:disabled="!myChart">
导出图片
</el-button> -->
<div id="drillingTimeChart" class="chart"></div> <div id="drillingTimeChart" class="chart"></div>
</div> </div>
</div> </div>
...@@ -33,6 +42,8 @@ export default { ...@@ -33,6 +42,8 @@ export default {
myChart: null, myChart: null,
resizeHandler: null, resizeHandler: null,
loading: false, loading: false,
color1: "#FF0000",
option: null,
}; };
}, },
mounted() { mounted() {
...@@ -54,7 +65,7 @@ export default { ...@@ -54,7 +65,7 @@ export default {
} }
this.loading = true; this.loading = true;
// 获取录井曲线数据和录井整米数据 // 获取录井曲线数据和录井整米数据
Promise.all([getljqxData({ jh: this.jh }), listLjSssjSd({ jh: this.jh })]) Promise.all([getljqxData({ jh: this.jh }), listLjSssjSd({ jh: this.jh,pageNum: 1,pageSize:999999 })])
.then(([ljqxRes, ljSssjRes]) => { .then(([ljqxRes, ljSssjRes]) => {
this.chartData = this.processData(ljqxRes, ljSssjRes); this.chartData = this.processData(ljqxRes, ljSssjRes);
this.initChart(); this.initChart();
...@@ -71,6 +82,7 @@ export default { ...@@ -71,6 +82,7 @@ export default {
}, },
processData(ljqxRes, ljSssjRes) { processData(ljqxRes, ljSssjRes) {
console.log("RKLL", ljqxRes);
// 处理录井曲线数据 // 处理录井曲线数据
const processArrayData = (dataList, fieldName) => { const processArrayData = (dataList, fieldName) => {
if (!dataList || !Array.isArray(dataList) || dataList.length === 0) { if (!dataList || !Array.isArray(dataList) || dataList.length === 0) {
...@@ -95,25 +107,12 @@ export default { ...@@ -95,25 +107,12 @@ export default {
: null; : null;
return { depth, value }; return { depth, value };
}) })
.filter(
(item) =>
item.depth !== null &&
item.value !== null &&
item.value !== undefined
);
}; };
// 处理钻时数据(从录井整米数据中获取) // 处理钻时数据(从录井整米数据中获取)
let drillingTimeData = []; let drillingTimeData = [];
if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) { if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) {
drillingTimeData = ljSssjRes.rows drillingTimeData = ljSssjRes.rows
.filter(
(item) =>
item.js !== null &&
item.js !== undefined &&
item.zs !== null &&
item.zs !== undefined
)
.map((item) => ({ .map((item) => ({
depth: item.js, depth: item.js,
value: item.zs, value: item.zs,
...@@ -125,24 +124,52 @@ export default { ...@@ -125,24 +124,52 @@ export default {
const standpipePressureData = processArrayData(ljqxRes.lyList, "ly"); const standpipePressureData = processArrayData(ljqxRes.lyList, "ly");
const drillingPressureData = processArrayData(ljqxRes.zyList, "zy"); const drillingPressureData = processArrayData(ljqxRes.zyList, "zy");
const rpmData = processArrayData(ljqxRes.zs1List, "zs1"); const rpmData = processArrayData(ljqxRes.zs1List, "zs1");
const rkllData = processArrayData(ljqxRes.rkllList, "rkll");
// 处理泵冲数据(总泵冲) // 处理泵冲数据(总泵冲)
let pumpStrokeData = []; let pumpStrokeData = [];
if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) { if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) {
pumpStrokeData = ljSssjRes.rows pumpStrokeData = ljSssjRes.rows
.filter(
(item) =>
item.js !== null &&
item.js !== undefined &&
item.zbc !== null &&
item.zbc !== undefined
)
.map((item) => ({ .map((item) => ({
depth: item.js, depth: item.js,
value: item.zbc, value: item.zbc,
})); }));
} }
// 处理层位数据,生成层位区间
let formationIntervals = [];
if (ljqxRes.list && Array.isArray(ljqxRes.list)) {
// 按深度排序
const sortedRows = [...ljqxRes.list];
if (sortedRows.length > 0) {
let currentFormation = sortedRows[0].cw;
let currentStartDepth = sortedRows[0].js;
for (let i = 1; i < sortedRows.length; i++) {
const item = sortedRows[i];
if (item.cw !== currentFormation) {
// 记录当前层位区间
formationIntervals.push({
formation: currentFormation,
startDepth: currentStartDepth,
endDepth: sortedRows[i - 1].js,
});
// 开始新的层位区间
currentFormation = item.cw;
currentStartDepth = item.js;
}
}
// 记录最后一个层位区间
formationIntervals.push({
formation: currentFormation,
startDepth: currentStartDepth,
endDepth: sortedRows[sortedRows.length - 1].js,
});
}
}
return { return {
drillingTime: drillingTimeData, drillingTime: drillingTimeData,
torque: torqueData, torque: torqueData,
...@@ -150,6 +177,10 @@ export default { ...@@ -150,6 +177,10 @@ export default {
drillingPressure: drillingPressureData, drillingPressure: drillingPressureData,
rpm: rpmData, rpm: rpmData,
pumpStroke: pumpStrokeData, pumpStroke: pumpStrokeData,
rkllData: rkllData,
formationIntervals: formationIntervals,
minDepth: ljqxRes.scale1,
maxDepth: ljqxRes.scale,
}; };
}, },
...@@ -221,6 +252,8 @@ export default { ...@@ -221,6 +252,8 @@ export default {
drillingPressure, drillingPressure,
rpm, rpm,
pumpStroke, pumpStroke,
rkllData,
formationIntervals,
} = this.chartData; } = this.chartData;
// 转换数据格式为 [depth, value] 格式 // 转换数据格式为 [depth, value] 格式
...@@ -242,12 +275,12 @@ export default { ...@@ -242,12 +275,12 @@ export default {
}; };
const drillingTimeChartData = convertToChartData(drillingTime); const drillingTimeChartData = convertToChartData(drillingTime);
console.log(drillingTimeChartData, "drillingTimeChartData");
const torqueChartData = convertToChartData(torque); const torqueChartData = convertToChartData(torque);
const standpipePressureChartData = convertToChartData(standpipePressure); const standpipePressureChartData = convertToChartData(standpipePressure);
const drillingPressureChartData = convertToChartData(drillingPressure); const drillingPressureChartData = convertToChartData(drillingPressure);
const rpmChartData = convertToChartData(rpm); const rpmChartData = convertToChartData(rpm);
const pumpStrokeChartData = convertToChartData(pumpStroke); const pumpStrokeChartData = convertToChartData(pumpStroke);
const rkllChartData = convertToChartData(rkllData);
// 计算深度范围 // 计算深度范围
const allDepths = [ const allDepths = [
...@@ -257,21 +290,57 @@ export default { ...@@ -257,21 +290,57 @@ export default {
...drillingPressureChartData.map((d) => d[0]), ...drillingPressureChartData.map((d) => d[0]),
...rpmChartData.map((d) => d[0]), ...rpmChartData.map((d) => d[0]),
...pumpStrokeChartData.map((d) => d[0]), ...pumpStrokeChartData.map((d) => d[0]),
...rkllChartData.map((d) => d[0]),
].filter((d) => d !== null && d !== undefined); ].filter((d) => d !== null && d !== undefined);
const minDepth = const minDepth =
allDepths.length > 0 ? Math.floor(Math.min(...allDepths) / 10) * 10 : 0; this.chartData.minDepth - 200 < 0 ? 0 : this.chartData.minDepth - 200;
const maxDepth = const maxDepth = this.chartData.maxDepth + 200;
allDepths.length > 0
? Math.ceil(Math.max(...allDepths) / 10) * 10 // 定义颜色映射表(方便维护和统一管理)
: 1000; const seriesColors = {
"钻时 (min/m)": "#FF0000", // 红色(你之前指定的)
const option = { "扭矩 (kN•m)": "#1E90FF", // 道奇蓝
title: { "立压 (MPa)": "#32CD32", // limegreen
text: "录井钻时图", "钻压 (kN)": "#FFD700", // 金色
left: "center", "转速 (rpm)": "#FF6347", // 番茄红
top: 10, "泵冲": "#9370DB", // 中紫色
"入口流量": "#20B2AA", // 浅钢蓝色
};
// 构建图例数据(带颜色)
const legendData = Object.keys(seriesColors).map((name) => ({
name: name,
itemStyle: {
color: seriesColors[name], // 图例文字颜色与对应折线一致
}, },
}));
// 生成层位背景区域配置
const formationMarkAreas = [];
if (formationIntervals && formationIntervals.length > 0) {
// 定义层位颜色映射表,使用中性颜色
const formationColors = this.generateDistinctColors(formationIntervals.length);
formationIntervals.forEach((interval,index) => {
const color =formationColors[index];
formationMarkAreas.push([
{
xAxis: interval.startDepth,
name: interval.formation,
itemStyle: {
color: color,
opacity: 0.7,
},
},
{
xAxis: interval.endDepth,
},
]);
});
}
this.option = {
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
axisPointer: { axisPointer: {
...@@ -309,14 +378,7 @@ export default { ...@@ -309,14 +378,7 @@ export default {
}, },
}, },
legend: { legend: {
data: [ data: legendData,
"钻时 (min/m)",
"扭矩 (kN•m)",
"立压 (MPa)",
"钻压 (kN)",
"转速 (rpm)",
"泵冲",
],
top: 40, top: 40,
right: 50, right: 50,
icon: "rect", icon: "rect",
...@@ -381,6 +443,29 @@ export default { ...@@ -381,6 +443,29 @@ export default {
data: drillingTimeChartData, data: drillingTimeChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["钻时 (min/m)"], // 使用颜色映射表
width: 3,
type: "solid",
},
},
// 新增独立的markArea专用系列(核心修改)
{
name: "formationMarkArea", // 命名不影响legend(可隐藏)
type: "line",
yAxisIndex: 0,
data: [], // 空数据,不绘制任何线条
silent: true, // 完全关闭交互,不响应鼠标事件
lineStyle: {
show: false, // 隐藏数据线
},
markArea: {
silent: true, // 关闭交互
data: formationMarkAreas, // 原markArea数据
},
// 可选:隐藏该系列在legend中的显示(如果不需要)
legendHoverLink: false,
}, },
{ {
name: "扭矩 (kN•m)", name: "扭矩 (kN•m)",
...@@ -388,8 +473,12 @@ export default { ...@@ -388,8 +473,12 @@ export default {
yAxisIndex: 0, yAxisIndex: 0,
data: torqueChartData, data: torqueChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["扭矩 (kN•m)"], // 指定颜色
width: 1, // 默认宽度,可根据需要调整
},
}, },
{ {
name: "立压 (MPa)", name: "立压 (MPa)",
...@@ -397,8 +486,11 @@ export default { ...@@ -397,8 +486,11 @@ export default {
yAxisIndex: 0, yAxisIndex: 0,
data: standpipePressureChartData, data: standpipePressureChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["立压 (MPa)"], // 指定颜色
width: 1,
},
}, },
{ {
name: "钻压 (kN)", name: "钻压 (kN)",
...@@ -406,8 +498,11 @@ export default { ...@@ -406,8 +498,11 @@ export default {
yAxisIndex: 1, yAxisIndex: 1,
data: drillingPressureChartData, data: drillingPressureChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["钻压 (kN)"], // 指定颜色
width: 1,
},
}, },
{ {
name: "转速 (rpm)", name: "转速 (rpm)",
...@@ -415,8 +510,11 @@ export default { ...@@ -415,8 +510,11 @@ export default {
yAxisIndex: 1, yAxisIndex: 1,
data: rpmChartData, data: rpmChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["转速 (rpm)"], // 指定颜色
width: 1,
},
}, },
{ {
name: "泵冲", name: "泵冲",
...@@ -424,17 +522,105 @@ export default { ...@@ -424,17 +522,105 @@ export default {
yAxisIndex: 1, yAxisIndex: 1,
data: pumpStrokeChartData, data: pumpStrokeChartData,
smooth: true, smooth: true,
symbol: "none", symbol: "none",
lineStyle: {
color: seriesColors["泵冲"], // 指定颜色
width: 1,
},
},
{
name: "入口流量",
type: "line",
yAxisIndex: 1,
data: rkllChartData,
smooth: true,
symbol: "none",
lineStyle: {
color: seriesColors["入口流量"], // 指定颜色
width: 1,
},
}, },
], ],
}; };
this.myChart.setOption(option); this.myChart.setOption(this.option);
this.resizeHandler = () => this.myChart.resize(); this.resizeHandler = () => this.myChart.resize();
window.addEventListener("resize", this.resizeHandler); window.addEventListener("resize", this.resizeHandler);
}, },
/**
* 生成指定数量的高区分度、亮度适中的十六进制颜色
* @param {Number} count - 需要生成的颜色数量
* @returns {Array} 颜色数组,格式如 ['#F5F5F5', '#E18728', ...]
*/
generateDistinctColors(count) {
// 校验参数:确保count是正整数
if (!Number.isInteger(count) || count < 1) {
console.error('颜色数量必须是正整数');
return [];
}
const colors = [];
// 色相步长:均匀分配0-360°的色相,保证区分度
const hueStep = 360 / count;
// 固定饱和度(55%)和亮度(75%),确保颜色不暗、不亮、不浅
const saturation = 55; // 饱和度范围50-70%最佳
const lightness = 75; // 亮度范围60-85%最佳
for (let i = 0; i < count; i++) {
// 计算当前色相(循环分配,避免重复)
const hue = (i * hueStep) % 360;
// 将HSL转换为十六进制颜色
const hexColor = this.hslToHex(hue, saturation, lightness);
colors.push(hexColor);
}
return colors;
},
/**
* HSL转十六进制颜色(核心工具方法)
* @param {Number} h - 色相(0-360)
* @param {Number} s - 饱和度(0-100)
* @param {Number} l - 亮度(0-100)
* @returns {String} 十六进制颜色,如 #F5F5F5
*/
hslToHex(h, s, l) {
// 转换饱和度/亮度为0-1的小数
s = s / 100;
l = l / 100;
// HSL转RGB核心公式
const c = (1 - Math.abs(2 * l - 1)) * s;
const x = c * (1 - Math.abs(((h / 60) % 2) - 1));
const m = l - c / 2;
let r, g, b;
if (h >= 0 && h < 60) {
r = c; g = x; b = 0;
} else if (h >= 60 && h < 120) {
r = x; g = c; b = 0;
} else if (h >= 120 && h < 180) {
r = 0; g = c; b = x;
} else if (h >= 180 && h < 240) {
r = 0; g = x; b = c;
} else if (h >= 240 && h < 300) {
r = x; g = 0; b = c;
} else {
r = c; g = 0; b = x;
}
// 转换为0-255的整数,并加上亮度偏移量m
r = Math.round((r + m) * 255);
g = Math.round((g + m) * 255);
b = Math.round((b + m) * 255);
// 转换为两位十六进制字符串(补零)
const toHex = (num) => num.toString(16).padStart(2, '0');
return `#${toHex(r)}${toHex(g)}${toHex(b)}`.toUpperCase();
},
exportChart() { exportChart() {
if (!this.myChart) { if (!this.myChart) {
this.$message.warning("图表未初始化,无法导出"); this.$message.warning("图表未初始化,无法导出");
...@@ -471,6 +657,36 @@ export default { ...@@ -471,6 +657,36 @@ export default {
this.resizeHandler = null; this.resizeHandler = null;
} }
}, },
handleColor() {
if (!this.myChart || !this.option) {
return;
}
// 统一颜色格式:确保色值带 # 前缀
const targetColor = this.color1.startsWith("#")
? this.color1
: `#${this.color1}`;
// 1. 更新钻时系列的折线颜色
const drillingTimeSeriesIndex = this.option.series.findIndex(
(item) => item.name === "钻时 (min/m)"
);
if (drillingTimeSeriesIndex !== -1) {
this.option.series[drillingTimeSeriesIndex].lineStyle.color =
targetColor;
}
// 2. 更新图例中钻时项的颜色
const drillingTimeLegendIndex = this.option.legend.data.findIndex(
(item) => item.name === "钻时 (min/m)"
);
if (drillingTimeLegendIndex !== -1) {
this.option.legend.data[drillingTimeLegendIndex].itemStyle.color =
targetColor;
}
// 3. 重新设置 ECharts 配置,生效样式
this.myChart.setOption(this.option);
},
}, },
}; };
</script> </script>
......
<template> <template>
<div class="chart-container"> <div class="chart-container">
<div v-if="jh" class="well-number-display"> <div v-if="jh" style="margin: 0px 10px">
<span class="well-label">井号:</span> <span class="well-label">井号:</span>
<span class="well-number">{{ jh }}</span> <span class="well-number">{{ jh }}</span>
</div>
<div class="export-button-container"> <span class="well-label" style="margin-left: 10px">开次:</span>
<el-select v-model="kc" style="width: 100px" size="mini" clearable placeholder="请选择">
<el-option
v-for="item in kcData"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<span class="well-label" style="margin-left: 10px">钻头尺寸:</span>
<el-input v-model="ztccs" style="width: 100px" clearable size="mini"></el-input>
<el-button type="primary" style="margin-left: 10px" size="mini" @click="getList">查询</el-button>
<el-button <el-button
class="export-btn" type="primary"
@click="exportChart" @click="exportChart"
:disabled="loading || !myChart" :disabled="loading || !myChart"
title="导出图表为图片" title="导出图表为图片"
icon="el-icon-download" icon="el-icon-download"
> size="mini"
导出 > </el-button>
</el-button>
</div> </div>
<div class="chart-layout"> <div class="chart-layout">
<div id="mainzft" class="chart" ref="chartRef"></div> <div id="mainzft" class="chart" ref="chartRef"></div>
<aside v-if="legendItems && legendItems.length" class="strata-legend"> <aside v-if="legendItems && legendItems.length" class="strata-legend">
<div class="legend-header">层位图例</div> <div class="legend-header">层位图例</div>
<div class="legend-list"> <div class="legend-list">
<div <div
v-for="(item, index) in legendItems" v-for="(item, index) in legendItems"
...@@ -70,6 +82,26 @@ export default { ...@@ -70,6 +82,26 @@ export default {
lastStackedAreas: null, lastStackedAreas: null,
lastChartConfig: null, lastChartConfig: null,
lastXAxisLabels: null, lastXAxisLabels: null,
kc:'',
ztccs:'',
kcData:[
{
label:'1',
value:'1',
},{
label:'2',
value:'2',
},{
label:'3',
value:'3',
},{
label:'4',
value:'4',
},{
label:'5',
value:'5',
},
]
}; };
}, },
computed: { computed: {
...@@ -295,7 +327,7 @@ export default { ...@@ -295,7 +327,7 @@ export default {
// 获取数据 // 获取数据
async getList() { async getList() {
try { try {
const res = await getZft({ jhe: this.jh }); const res = await getZft({ jhe: this.jh,kc:this.kc,ztccs:this.ztccs });
this.mockData = res?.mockData || {}; this.mockData = res?.mockData || {};
const legendList = Array.isArray(res?.tlList) const legendList = Array.isArray(res?.tlList)
? res.tlList ? res.tlList
...@@ -702,7 +734,7 @@ export default { ...@@ -702,7 +734,7 @@ export default {
type: "bar", type: "bar",
stack: "total", stack: "total",
silent: true, silent: true,
barWidth: "8%", barWidth: "10%",
itemStyle: { itemStyle: {
borderColor: "transparent", borderColor: "transparent",
color: "transparent", color: "transparent",
...@@ -979,7 +1011,7 @@ export default { ...@@ -979,7 +1011,7 @@ export default {
gap: 5px; gap: 5px;
align-items: stretch; align-items: stretch;
justify-content: flex-start; justify-content: flex-start;
overflow: hidden; overflow: auto;
} }
.strata-legend { .strata-legend {
...@@ -1080,7 +1112,7 @@ export default { ...@@ -1080,7 +1112,7 @@ export default {
flex: 1; flex: 1;
width: 100%; width: 100%;
max-width: 100%; max-width: 100%;
height: 100%; height: 110%;
min-height: 400px; min-height: 400px;
display: block; display: block;
border-radius: 16px; border-radius: 16px;
......
<template> <template>
<div class="app-container"> <div class="app-container">
<el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;"> <el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick" style="margin-top: -10px;">
<el-tab-pane label="数据表格" name="dataTable"> <el-tab-pane label="井身结构" name="wellDepthStructure">
<WellDepthStructure v-if="activeTab === 'wellDepthStructure'" :jh="queryParams.jh"
:key="`wellDepthStructure-${queryParams.jh}`" />
</el-tab-pane>
<el-tab-pane label="钻头使用数据" name="dataTable">
<DataTable v-if="activeTab === 'dataTable'" :jh="queryParams.jh" :key="`dataTable-${queryParams.jh}`" /> <DataTable v-if="activeTab === 'dataTable'" :jh="queryParams.jh" :key="`dataTable-${queryParams.jh}`" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="曲线图形" name="curveGraph"> <el-tab-pane label="钻头优选" name="curveGraph">
<CurveGraph v-if="activeTab === 'curveGraph'" :jh="queryParams.jh" <CurveGraph v-if="activeTab === 'curveGraph'" :jh="queryParams.jh"
:key="`curveGraph-${queryParams.jh}`" /> :key="`curveGraph-${queryParams.jh}`" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="直方图形" name="histogramGraph"> <el-tab-pane label="钻头能效分析" name="histogramGraph">
<HistogramGraph v-if="activeTab === 'histogramGraph'" :jh="queryParams.jh" <HistogramGraph v-if="activeTab === 'histogramGraph'" :jh="queryParams.jh"
:key="`histogramGraph-${queryParams.jh}`" /> :key="`histogramGraph-${queryParams.jh}`" />
</el-tab-pane> </el-tab-pane>
...@@ -32,7 +36,7 @@ ...@@ -32,7 +36,7 @@
:jh="queryParams.jh" :key="`drillingCurve-${queryParams.jh}`" /> :jh="queryParams.jh" :key="`drillingCurve-${queryParams.jh}`" />
</keep-alive> </keep-alive>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="录井钻时图" name="drillingTimeChart"> <el-tab-pane label="钻时及功能参数" name="drillingTimeChart">
<DrillingTimeChart v-if="activeTab === 'drillingTimeChart'" :jh="queryParams.jh" <DrillingTimeChart v-if="activeTab === 'drillingTimeChart'" :jh="queryParams.jh"
:key="`drillingTimeChart-${queryParams.jh}`" /> :key="`drillingTimeChart-${queryParams.jh}`" />
</el-tab-pane> </el-tab-pane>
...@@ -40,10 +44,7 @@ ...@@ -40,10 +44,7 @@
<WellboreTrajectory v-if="activeTab === 'wellboreTrajectory'" :jh="queryParams.jh" <WellboreTrajectory v-if="activeTab === 'wellboreTrajectory'" :jh="queryParams.jh"
:key="`wellboreTrajectory-${queryParams.jh}`" /> :key="`wellboreTrajectory-${queryParams.jh}`" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="井身结构" name="wellDepthStructure">
<WellDepthStructure v-if="activeTab === 'wellDepthStructure'" :jh="queryParams.jh"
:key="`wellDepthStructure-${queryParams.jh}`" />
</el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
</template> </template>
...@@ -76,7 +77,7 @@ export default { ...@@ -76,7 +77,7 @@ export default {
data() { data() {
return { return {
// 当前激活的tab // 当前激活的tab
activeTab: 'dataTable', activeTab: 'wellDepthStructure',
// 显示搜索条件 // 显示搜索条件
showSearch: true, showSearch: true,
// 遮罩层 // 遮罩层
......
...@@ -778,7 +778,7 @@ export default { ...@@ -778,7 +778,7 @@ export default {
}, },
handleChangeAr() { handleChangeAr() {
if (this.radio == "3") { if (this.formAr.radio == "3") {
var item = this.sfcs; var item = this.sfcs;
console.log(item, "item"); console.log(item, "item");
this.$router.push({ this.$router.push({
...@@ -789,7 +789,7 @@ export default { ...@@ -789,7 +789,7 @@ export default {
qkmc: item.qkmc, qkmc: item.qkmc,
}, },
}); });
} else if (this.radio == "6") { } else if (this.formAr.radio == "6") {
this.$message({ this.$message({
message: "正在开发中!", message: "正在开发中!",
type: "warning", type: "warning",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment