Skip to content

P
pdczt_qd
Commit 9da0a538 by jiang'yun
Options

修改

parent 0a22694f
Showing with 954 additions and 673 deletions
src/api/optimization/ljSssjSd.js
......@@ -42,3 +42,12 @@ export function delLjSssjSd(id) {
method: "delete",
});
}
// 查询录井整米数据列表
export function getLjzmsj(query) {
return request({
url: "/system/ljSssjSd/getLjzmsj",
method: "get",
params: query,
});
}
src/views/efficiencyAnalysis/djxx/detail/components/CurveGraph.vue
<template>
<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">
<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>
<!-- <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
class="data-table">
<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="钻头型号" 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="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="钻头型号" 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>
</div>
</template>
<script>
import * as echarts from 'echarts';
import { getdjqxt } from '@/api/optimization/initialization';
import {getdjqxt} from '@/api/optimization/initialization';
export default {
props: {
......@@ -48,19 +47,52 @@ export default {
id: {
type: String,
required: true,
},
kcjs: {
type: String,
required: true,
},
ztccsjs: {
type: String,
required: true,
}
},
data() {
return {
chartData: 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() {
// 不在挂载时自动请求数据，等待父组件触发 loadData()
this.$once('hook:beforeDestroy', this.cleanup);
},
methods: {
// 供父组件调用
loadData() {
......@@ -69,7 +101,9 @@ export default {
getList() {
const params = {
zbid: this.id,
jhs: `${this.jh},${this.jhs}`
jhs: `${this.jh},${this.jhs}`,
kc:this.kc,
ztccs:this.ztccs
};
getdjqxt(params)
.then(res => {
......@@ -107,7 +141,7 @@ export default {
}
this.myChart = echarts.init(chartDom);
// 解析接口数据（确保折线数据格式正确）
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData;
const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序：[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式：[[钻速, 进尺], ...]
......@@ -128,30 +162,30 @@ export default {
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairLines.push({
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairCenter.push({
name: '十字线中心',
type: 'scatter',
data: [[crosshair.y, crosshair.x]],
symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 }
itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
});
}
// 图表配置项（核心：坐标轴触发，确保折线悬浮显示）
const option = {
title: { text: '钻头钻进能效分析', left: 'center' },
title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: {
trigger: 'axis', // 基于坐标轴触发（不依赖数据点）
axisPointer: {
......@@ -199,11 +233,11 @@ export default {
min: axisRange.xAxis.min,
max: axisRange.xAxis.max,
// interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' },
axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center',
nameGap: 50,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
yAxis: {
name: '进尺m',
......@@ -212,8 +246,8 @@ export default {
// interval: axisRange.yAxis.interval,
nameLocation: 'center',
nameGap: 40,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
series: [
{
......@@ -224,24 +258,24 @@ export default {
// 彻底隐藏所有点（包括悬浮时）
symbol: 'none',
showSymbol: false,
emphasis: { showSymbol: false },
lineStyle: { color: 'red', width: 2 }
emphasis: {showSymbol: false},
lineStyle: {color: 'red', width: 2}
},
{
name: '钻速均值',
type: 'line',
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',
tooltip: { show: false }
tooltip: {show: false}
},
{
name: '进尺均值',
type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 },
lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none',
tooltip: { show: false }
tooltip: {show: false}
},
...crosshairLines,
...crosshairCenter,
......
src/views/efficiencyAnalysis/djxx/detail/components/HistogramGraph.vue
......@@ -27,8 +27,8 @@
<script>
import * as echarts from "echarts";
import { getdjZft } from "@/api/optimization/initialization";
import { text } from "d3";
import {getdjZft} from "@/api/optimization/initialization";
import {text} from "d3";
export default {
name: "HistogramGraph",
......@@ -342,10 +342,13 @@ export default {
// 渲染真实数据
async renderRealData(mockData) {
try {
const { wellData } = mockData;
const {wellData} = mockData;
console.log(wellData, 'wellData');
const xAxisLabels = wellData.depthLine.map((point) => point.x);
try { window.__hist_xLabels = xAxisLabels; } catch (e) { }
try {
window.__hist_xLabels = xAxisLabels;
} catch (e) {
}
const option = {
...this.getDefaultChartOption(),
xAxis: this.createXAxis(xAxisLabels),
......@@ -407,20 +410,20 @@ export default {
getDefaultChartOption() {
const colors = this.colorScheme;
return {
title: { text: "", subtext: "" },
aria: { enabled: false },
title: {text: "", subtext: ""},
aria: {enabled: false},
backgroundColor: colors.background,
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
label: { backgroundColor: colors.primary },
crossStyle: { color: colors.border }
label: {backgroundColor: colors.primary, show:false},
crossStyle: {color: colors.border}
},
backgroundColor: 'rgba(255,255,255,0.95)',
borderColor: colors.border,
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;',
formatter: (params) => {
if (!params || params.length === 0) return '';
......@@ -491,11 +494,11 @@ export default {
stackedAreas
.filter(area => area.svg !== null)
.map(async (area) => {
let areaStyle = { opacity: 0.6 };
let areaStyle = {opacity: 0.6};
if (area.svg) {
try {
const svgImage = await this.createSvgImage(area.svg);
areaStyle.color = { image: svgImage, repeat: "repeat" };
areaStyle.color = {image: svgImage, repeat: "repeat"};
} catch (error) {
console.error('SVG转换失败:', error);
}
......@@ -509,7 +512,7 @@ export default {
symbol: "none",
showSymbol: false,
areaStyle: areaStyle,
lineStyle: { width: 0 },
lineStyle: {width: 0},
data: area.points.map((point) => (point && point.y2 != null) ? point.y2 : point.y),
};
})
......@@ -526,7 +529,7 @@ export default {
if (!xToIndices.has(key)) xToIndices.set(key, []);
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');
const results = [];
for (const [jh, layers] of Object.entries(stackedAreas)) {
......@@ -538,7 +541,7 @@ export default {
for (const p of (area?.points || [])) {
const arr = xToIndices.get(String(p?.x)) || [];
if (arr.length === 0) {
missingInXAxis.push({ x: p?.x, jh, areaName: area?.name });
missingInXAxis.push({x: p?.x, jh, areaName: area?.name});
} else {
indicesForJh.push(...arr);
}
......@@ -548,11 +551,11 @@ export default {
const endIdx = Math.max(...indicesForJh);
for (const area of (layers || [])) {
if (area == null) continue;
let areaStyle = { opacity: 0.6 };
let areaStyle = {opacity: 0.6};
if (area.svg) {
try {
const svgImage = await this.createSvgImage(area.svg);
areaStyle.color = { image: svgImage, repeat: "repeat" };
areaStyle.color = {image: svgImage, repeat: "repeat"};
} catch (error) {
console.error('SVG转换失败:', error);
}
......@@ -572,7 +575,7 @@ export default {
}
});
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({
......@@ -584,7 +587,7 @@ export default {
symbol: "none",
showSymbol: false,
areaStyle: areaStyle,
lineStyle: { width: 0 },
lineStyle: {width: 0},
data
});
// 仅在有异常时输出调试信息，方便定位 x 匹配问题
......@@ -596,7 +599,7 @@ export default {
}
if (outOfRangePoints.length > 0) {
console.warn('x 命中但不在井段范围内:', outOfRangePoints);
console.info('井段范围:', { jh, startIdx, endIdx });
console.info('井段范围:', {jh, startIdx, endIdx});
}
console.groupEnd && console.groupEnd();
}
......@@ -627,9 +630,9 @@ export default {
axisTick: {
alignWithLabel: true,
length: 6,
lineStyle: { color: colors.border }
lineStyle: {color: colors.border}
},
splitLine: { show: false },
splitLine: {show: false},
axisLine: {
show: true,
lineStyle: {
......@@ -687,7 +690,7 @@ export default {
},
axisTick: {
show: true,
lineStyle: { color: colors.border }
lineStyle: {color: colors.border}
}
},
{
......@@ -709,7 +712,7 @@ export default {
color: colors.text,
fontWeight: 500
},
splitLine: { show: false },
splitLine: {show: false},
axisLine: {
show: true,
lineStyle: {
......@@ -719,7 +722,7 @@ export default {
},
axisTick: {
show: true,
lineStyle: { color: colors.border }
lineStyle: {color: colors.border}
}
},
];
......@@ -772,7 +775,7 @@ export default {
zlevel: 20,
stack: "total",
silent: true,
barWidth: "8%",
barWidth: "20%",
itemStyle: {
borderColor: "transparent",
color: "transparent"
......@@ -790,7 +793,7 @@ export default {
type: "bar",
zlevel: 20,
stack: "total",
barWidth: "6%",
barWidth: "15%",
label: {
show: true,
position: 'insideTop',
......@@ -817,8 +820,8 @@ export default {
x2: 0,
y2: 1,
colorStops: [
{ offset: 0, color: colors.gradient.start },
{ offset: 1, color: colors.gradient.end }
{offset: 0, color: colors.gradient.start},
{offset: 1, color: colors.gradient.end}
]
},
borderRadius: [4, 4, 0, 0],
......@@ -835,8 +838,8 @@ export default {
x2: 0,
y2: 1,
colorStops: [
{ offset: 0, color: this.adjustColor(colors.gradient.start, 1.2) },
{ offset: 1, color: this.adjustColor(colors.gradient.end, 1.2) }
{offset: 0, color: this.adjustColor(colors.gradient.start, 1.2)},
{offset: 1, color: this.adjustColor(colors.gradient.end, 1.2)}
]
},
shadowBlur: 12,
......@@ -855,12 +858,12 @@ export default {
zlevel: 20,
// 与主柱重叠以便把标签放在柱底部区域内
barGap: '-100%',
barWidth: '6%',
barWidth: '20%',
itemStyle: {
color: 'transparent',
borderColor: 'transparent'
},
emphasis: { itemStyle: { color: 'transparent', borderColor: 'transparent' } },
emphasis: {itemStyle: {color: 'transparent', borderColor: 'transparent'}},
label: {
show: false,
position: 'insideBottom',
......@@ -953,7 +956,7 @@ export default {
// 创建SVG图片
createSvgImage(svgString) {
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 img = new Image();
img.onload = () => {
......@@ -1004,7 +1007,7 @@ export default {
this.currentGraphicElements = elements;
this.$nextTick(() => {
if (this.myChart) {
this.myChart.setOption({ graphic: { elements } }, { replaceMerge: ['graphic'] });
this.myChart.setOption({graphic: {elements}}, {replaceMerge: ['graphic']});
}
});
},
......@@ -1022,7 +1025,7 @@ export default {
for (let i = 0; i < depthIntervals.length; i++) {
// 直接使用在 depthIntervals 中的顺序索引作为 x 轴位置，
// 以避免相同 x 标签造成的覆盖与错位
const { jh } = depthIntervals[i];
const {jh} = depthIntervals[i];
const idx = i;
if (!started) {
currentJh = jh;
......@@ -1034,14 +1037,22 @@ export default {
currentMin = Math.min(currentMin, idx);
currentMax = Math.max(currentMax, idx);
} 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;
currentMin = currentMax = idx;
}
}
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 = [];
......@@ -1052,8 +1063,8 @@ export default {
return;
}
// 垂直范围（像素）——考虑 y 轴 inverse，取像素最小为顶部、最大为底部
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max);
const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) {
console.warn('convertToPixel 返回无效值，跳过绘制井号分隔符');
return;
......@@ -1065,8 +1076,8 @@ export default {
for (let i = 0; i < segments.length - 1; i++) {
const leftEnd = segments[i].endIdx;
const rightStart = segments[i + 1].startIdx;
const pxLeft = this.myChart.convertToPixel({ xAxisIndex: 0 }, leftEnd);
const pxRight = this.myChart.convertToPixel({ xAxisIndex: 0 }, rightStart);
const pxLeft = this.myChart.convertToPixel({xAxisIndex: 0}, leftEnd);
const pxRight = this.myChart.convertToPixel({xAxisIndex: 0}, rightStart);
if (pxLeft === null || pxRight === null) {
console.warn('convertToPixel 返回 null 值，跳过绘制边界虚线');
continue;
......@@ -1074,8 +1085,8 @@ export default {
const midX = (pxLeft + pxRight) / 2;
graphics.push({
type: 'line',
shape: { x1: midX, y1: yTopPx, x2: midX, y2: yBottomPx },
style: { stroke: '#bbb', lineDash: [8, 6], lineWidth: 1.5 },
shape: {x1: midX, y1: yTopPx, x2: midX, y2: yBottomPx},
style: {stroke: '#bbb', lineDash: [8, 6], lineWidth: 1.5},
silent: true,
z: 100,
zlevel: 10
......@@ -1087,8 +1098,8 @@ export default {
let rowShift = 0; // 逐行上移避免覆盖
segments.forEach((seg, idx) => {
if (!seg.jh) return;
const pxStart = this.myChart.convertToPixel({ xAxisIndex: 0 }, seg.startIdx);
const pxEnd = this.myChart.convertToPixel({ xAxisIndex: 0 }, seg.endIdx);
const pxStart = this.myChart.convertToPixel({xAxisIndex: 0}, seg.startIdx);
const pxEnd = this.myChart.convertToPixel({xAxisIndex: 0}, seg.endIdx);
if (pxStart === null || pxEnd === null) {
console.warn('convertToPixel 返回 null 值，跳过绘制井号标签');
return;
......@@ -1123,7 +1134,7 @@ export default {
children: [
{
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: {
fill: '#2563eb',
stroke: '#1e40af',
......@@ -1141,7 +1152,7 @@ export default {
[labelWidth / 2, labelHeight + pointerSize]
]
},
style: { fill: '#2563eb', stroke: '#1e40af' }
style: {fill: '#2563eb', stroke: '#1e40af'}
},
{
type: 'text',
......@@ -1167,7 +1178,7 @@ export default {
this.currentGraphicElements = merged;
this.$nextTick(() => {
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 {
return;
}
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max);
const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx === null || yMaxPx === null || isNaN(yMinPx) || isNaN(yMaxPx)) {
console.warn('convertToPixel 返回无效值，跳过绘制类目边界线');
return;
......@@ -1204,7 +1215,7 @@ export default {
// 计算每个类目的像素中心
const centers = [];
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 (centers.length > 0) {
......@@ -1218,8 +1229,8 @@ export default {
}
graphics.push({
type: 'line',
shape: { x1: firstEdge, y1: yStemStart, x2: firstEdge, y2: yStemEnd },
style: { stroke: '#bbb', lineWidth: 1.5 },
shape: {x1: firstEdge, y1: yStemStart, x2: firstEdge, y2: yStemEnd},
style: {stroke: '#bbb', lineWidth: 1.5},
silent: true,
z: 120,
zlevel: 10
......@@ -1229,8 +1240,8 @@ export default {
const mid = (centers[i] + centers[i + 1]) / 2;
graphics.push({
type: 'line',
shape: { x1: mid, y1: yStemStart, x2: mid, y2: yStemEnd },
style: { stroke: '#bbb', lineWidth: 1.5 },
shape: {x1: mid, y1: yStemStart, x2: mid, y2: yStemEnd},
style: {stroke: '#bbb', lineWidth: 1.5},
silent: true,
z: 120,
zlevel: 10
......@@ -1246,8 +1257,8 @@ export default {
}
graphics.push({
type: 'line',
shape: { x1: lastEdge, y1: yStemStart, x2: lastEdge, y2: yStemEnd },
style: { stroke: '#bbb', lineWidth: 1.5 },
shape: {x1: lastEdge, y1: yStemStart, x2: lastEdge, y2: yStemEnd},
style: {stroke: '#bbb', lineWidth: 1.5},
silent: true,
z: 120,
zlevel: 10
......@@ -1260,7 +1271,7 @@ export default {
this.currentGraphicElements = merged;
this.$nextTick(() => {
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 {
// 计算每个类目的像素中心
const centers = [];
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 (centers.length === 0) return;
......@@ -1297,8 +1308,8 @@ export default {
}
// 图内纵向像素范围：从图内顶部到 y2 所在像素
const yMinPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({ yAxisIndex: 0 }, chartConfig.yAxis.max);
const yMinPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.min);
const yMaxPx = this.myChart.convertToPixel({yAxisIndex: 0}, chartConfig.yAxis.max);
if (yMinPx == null || yMaxPx == null) return;
const yTopPx = Math.min(yMinPx, yMaxPx);
const plotHeight = Math.abs(yMaxPx - yMinPx);
......@@ -1346,9 +1357,12 @@ export default {
const yTopDepth = prevBottom == null ? chartConfig?.yAxis?.min : prevBottom;
const yBottomDepth = y2val;
const yPixTop = this.myChart.convertToPixel({ yAxisIndex: 0 }, yTopDepth);
const yPixBottom = this.myChart.convertToPixel({ yAxisIndex: 0 }, yBottomDepth);
if (yPixTop == null || yPixBottom == null) { prevBottom = y2val; continue; }
const yPixTop = this.myChart.convertToPixel({yAxisIndex: 0}, yTopDepth);
const yPixBottom = this.myChart.convertToPixel({yAxisIndex: 0}, yBottomDepth);
if (yPixTop == null || yPixBottom == null) {
prevBottom = y2val;
continue;
}
const rectTop = Math.min(yPixTop, yPixBottom);
const rectBottom = Math.max(yPixTop, yPixBottom);
......@@ -1360,13 +1374,14 @@ export default {
if (layer?.svg) {
try {
const img = await this.createSvgImage(layer.svg);
fill = { image: img, repeat: 'repeat' };
} catch (e) { /* ignore */ }
fill = {image: img, repeat: 'repeat'};
} catch (e) { /* ignore */
}
}
graphics.push({
type: 'rect',
shape: { x: left, y: y1pix, width, height },
style: { fill, stroke: 'rgba(0,0,0,0.12)', lineWidth: 1 },
shape: {x: left, y: y1pix, width, height},
style: {fill, stroke: 'rgba(0,0,0,0.12)', lineWidth: 1},
silent: true,
z: -10,
zlevel: 1,
......@@ -1384,7 +1399,7 @@ export default {
this.currentGraphicElements = merged;
this.$nextTick(() => {
if (this.myChart) {
this.myChart.setOption({ graphic: { elements: merged } }, { replaceMerge: ['graphic'] });
this.myChart.setOption({graphic: {elements: merged}}, {replaceMerge: ['graphic']});
}
});
},
......
src/views/efficiencyAnalysis/djxx/detail/index.vue
......@@ -2,19 +2,19 @@
<template>
<div class="app-container">
<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"
:jhs="queryParams.jhs" />
:jhs="queryParams.jhs"/>
</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"
:jhs="queryParams.jhs" :id="queryParams.id" />
:jhs="queryParams.jhs" :id="queryParams.id" :kcjs="queryParams.kc" :ztccsjs="queryParams.ztccs" />
</el-tab-pane>
<el-tab-pane label="直方图形" name="histogramGraph">
<el-tab-pane label="钻头能效分析" name="histogramGraph">
<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-tabs>
</div>
......@@ -47,7 +47,9 @@ export default {
jh: '',
famc: '',
qk: '',
jhs: ''
jhs: '',
kc: '',
ztccs: '',
},
// 标记是否是第一次进入页面
isFirstLoad: true
......@@ -56,14 +58,14 @@ export default {
created() {
// 获取路由参数（使用query）
console.log('详情页面created，完整路由对象:', this.$route);
let { id, jh, famc, qk, jhs } = this.$route.query || {};
console.log('路由query参数:', { id, jh, famc, qk, jhs });
let {id, jh, famc, qk, jhs, kc, ztccs} = this.$route.query || {};
console.log('路由query参数:', {id, jh, famc, qk, jhs, kc, ztccs});
// 优先使用query，其次使用sessionStorage
if (!jh || jh === 'undefined' || jh === 'null') {
try {
const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}');
({ id, jh, famc, qk, jhs } = { ...cached, ...this.$route.query });
console.log('使用缓存参数:', { id, jh, famc, qk, jhs });
({id, jh, famc, qk, jhs, kc, ztccs} = {...cached, ...this.$route.query});
console.log('使用缓存参数:', {id, jh, famc, qk, jhs, kc, ztccs});
} catch (e) {
console.warn('读取缓存失败', e);
}
......@@ -74,6 +76,8 @@ export default {
this.queryParams.famc = famc || '';
this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
// 缓存参数，便于刷新后保留
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
console.log('设置并缓存 queryParams:', this.queryParams);
......@@ -87,34 +91,39 @@ export default {
},
activated() {
// 组件被 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') {
this.queryParams.id = id || '';
this.queryParams.jh = jh || '';
this.queryParams.famc = famc || '';
this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
this.$nextTick(() => this.refreshActiveTab());
} else {
try {
const cached = JSON.parse(sessionStorage.getItem('djxxDetailParams') || '{}');
if (cached && cached.jh) {
this.queryParams = { ...this.queryParams, ...cached };
this.queryParams = {...this.queryParams, ...cached};
this.$nextTick(() => this.refreshActiveTab());
}
} catch (e) { }
} catch (e) {
}
}
},
beforeRouteUpdate(to, from, next) {
// 同一路由切换不同 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') {
this.queryParams.id = id || '';
this.queryParams.jh = jh || '';
this.queryParams.famc = famc || '';
this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
this.$nextTick(() => this.refreshActiveTab());
}
......@@ -123,13 +132,15 @@ export default {
watch: {
// 当从列表页连续点击"查看"跳转到同一路由时，组件会复用，这里监听路由变化并刷新当前激活tab
'$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') {
this.queryParams.id = id || '';
this.queryParams.jh = jh || '';
this.queryParams.famc = famc || '';
this.queryParams.qk = qk || '';
this.queryParams.jhs = jhs || '';
this.queryParams.kc = kc || '';
this.queryParams.ztccs = ztccs || '';
sessionStorage.setItem('djxxDetailParams', JSON.stringify(this.queryParams));
// 当前就在某个tab上，路由参数变更后需要立刻刷新该tab的数据
......@@ -174,7 +185,8 @@ export default {
this.$modal.confirm('是否确认移除选中的记录？').then(() => {
// 这里可以调用API进行删除操作
this.$modal.msgSuccess("移除成功");
}).catch(() => { });
}).catch(() => {
});
},
// 多选框选中数据
......@@ -230,7 +242,7 @@ export default {
}
}
::v-deep .el-table__cell>.cell {
::v-deep .el-table__cell > .cell {
font-weight: normal;
}
......
src/views/efficiencyAnalysis/djxx/index.vue
......@@ -5,11 +5,11 @@
<el-form :model="searchForm" ref="searchFormRef" :rules="searchRules" inline>
<el-form-item label="区块名称" prop="qk">
<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-form-item>
<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-button type="primary" @click="getList">搜索</el-button>
......@@ -21,28 +21,31 @@
<!-- 数据表格 -->
<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="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="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="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="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="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="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="jxzszt" label="转速最优" align="center" min-width="160" show-overflow-tooltip sortable/>
<el-table-column label="操作" width="200" align="center" fixed="right">
<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-edit"
@click="handleUpdate(scope.row)">编辑</el-button>
@click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="mini" type="text" icon="el-icon-delete"
@click="handleDelete(scope.row)">删除</el-button>
@click="handleDelete(scope.row)">删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 主表格分页组件 -->
<el-pagination style="margin-top: 10px; text-align: right;" background
layout="total, sizes, prev, pager, next, jumper" :total="mainPagination.total"
:page-sizes="[10, 20, 50, 100]" :page-size="mainPagination.pageSize" :current-page="mainPagination.pageNum"
@size-change="handleMainSizeChange" @current-change="handleMainCurrentChange" />
:page-sizes="[10, 20, 50, 100]" :page-size="mainPagination.pageSize"
:current-page="mainPagination.pageNum"
@size-change="handleMainSizeChange" @current-change="handleMainCurrentChange"/>
<!-- 新增/编辑弹窗 -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" :close-on-click-modal="false"
......@@ -51,7 +54,7 @@
<el-row>
<el-col :span="12">
<el-form-item label="方案名称" prop="famc">
<el-input v-model="formData.famc" placeholder="请输入方案名称" />
<el-input v-model="formData.famc" placeholder="请输入方案名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
......@@ -59,7 +62,7 @@
<el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable
style="width: 100%;">
<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-form-item>
</el-col>
......@@ -68,13 +71,13 @@
<el-col :span="12">
<el-form-item label="井号" prop="jh">
<div style="cursor: pointer;">
<el-input v-model="formData.jh" placeholder="请输入井号" />
<el-input v-model="formData.jh" placeholder="请输入井号"/>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<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-col>
</el-row>
......@@ -82,28 +85,31 @@
<el-col :span="12">
<el-form-item label="完井时间" prop="wjsjks" required>
<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="选择结束日期"
style="width: 50%;" />
style="width: 50%;"/>
</el-form-item>
</el-col>
<el-col :span="12">
<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-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="井眼尺寸" prop="jycc">
<el-input v-model="formData.jycc" placeholder="请输入井眼尺寸" />
<el-input v-model="formData.jycc" placeholder="请输入井眼尺寸"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="选择邻井" prop="jhs">
<div style="cursor: pointer;" @click="handleSelectAdjacentWell">
<el-input v-model="formData.jhs" placeholder="请点击选择邻井" readonly
style="cursor: pointer;" />
style="cursor: pointer;"/>
</div>
</el-form-item>
</el-col>
......@@ -111,23 +117,13 @@
<el-row>
<el-col :span="12">
<el-form-item label="进尺最优比例" prop="jcbl" required>
<el-select v-model="formData.jcbl" placeholder="请选择进尺最优比例" clearable 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-slider v-model="formData.jcbl" :max="1" :min="0" :step="0.1" :format-tooltip="formatTooltip"></el-slider>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="机械钻速最优比例" prop="jxzsbl" required>
<el-select v-model="formData.jxzsbl" placeholder="请选择机械钻速最优比例" clearable
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-slider v-model="formData.jxzsbl" :max="1" :min="0" :step="0.1" :format-tooltip="formatTooltip"></el-slider>
</el-form-item>
</el-col>
</el-row>
......@@ -152,16 +148,16 @@
<el-table :data="wellTableData" border style="width: 100%;height: 400px" max-height="400px"
v-loading="wellLoading" @selection-change="handleWellSelectionChange" ref="wellTable"
:row-key="row => row.jh">
<el-table-column type="selection" width="55" :selectable="checkSelectable" />
<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="wjjs" 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="kc" 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="jkjl" label="井口距离" align="center" show-overflow-tooltip />
<el-table-column type="selection" width="55" :selectable="checkSelectable"/>
<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="wjjs" 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="kc" 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="jkjl" label="井口距离" align="center" show-overflow-tooltip/>
<!-- <el-table-column prop="jdjl" label="井底距离" align="center" show-overflow-tooltip /> -->
</el-table>
......@@ -169,7 +165,7 @@
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="wellPagination.pageNum" :page-sizes="[10, 20, 50, 100]"
: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">
<span class="dialog-footer">
<el-button @click="handleWellCancel">取 消</el-button>
......@@ -181,9 +177,9 @@
</template>
<script>
import { listSj } from '@/api/adjacentWell'
import { getQkxl } from "@/api/system/jsaa";
import { listDjnxfxfa, getDjnxfxfa, delDjnxfxfa, addDjnxfxfa, updateDjnxfxfa } from "@/api/system/djnxfxfa";
import {listSj} from '@/api/adjacentWell'
import {getQkxl} from "@/api/system/jsaa";
import {listDjnxfxfa, getDjnxfxfa, delDjnxfxfa, addDjnxfxfa, updateDjnxfxfa} from "@/api/system/djnxfxfa";
export default {
name: 'DjxxIndex',
......@@ -195,9 +191,7 @@ export default {
searchForm: {
qk: ''
},
searchRules: {
},
searchRules: {},
// 表格数据
tableData: [],
......@@ -214,15 +208,15 @@ export default {
jl: '10000', // 距离默认值10000
wjsjks: null, // 完井时间开始默认五年前的今天
wjsjjs: null, // 完井时间结束默认今天
jcbl: '', // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例
jcbl: 0.2, // 进尺最优比例
jxzsbl: 0.2 // 机械钻速最优比例
},
formRules: {
famc: [{ required: true, message: '请输入方案名称', trigger: 'blur' }],
qk: [{ required: true, message: '请选择区块', trigger: 'change' }],
jhs: [{ required: true, message: '请选择井号', trigger: 'change' }],
jcbl: [{ required: true, message: '请选择进尺最优比例', trigger: 'change' }],
jxzsbl: [{ required: true, message: '请选择机械钻速最优比例', trigger: 'change' }]
famc: [{required: true, message: '请输入方案名称', trigger: 'blur'}],
qk: [{required: true, message: '请选择区块', trigger: 'change'}],
jhs: [{required: true, message: '请选择井号', trigger: 'change'}],
jcbl: [{required: true, message: '请选择进尺最优比例', trigger: 'change'}],
jxzsbl: [{required: true, message: '请选择机械钻速最优比例', trigger: 'change'}]
},
// 井号选择弹窗
......@@ -247,6 +241,24 @@ export default {
pageSize: 10,
total: 0
},
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
}
},
created() {
......@@ -329,8 +341,8 @@ export default {
jl: '10000', // 距离默认值10000
wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天
wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天
jcbl: '', // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例
jcbl: 0.2, // 进尺最优比例
jxzsbl: 0.2 // 机械钻速最优比例
};
},
/** 搜索按钮操作 */
......@@ -343,12 +355,12 @@ export default {
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加多井能效分析方案信息";
},
// /** 新增按钮操作 */
// handleAdd() {
// this.reset();
// this.open = true;
// this.title = "添加多井能效分析方案信息";
// },
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
......@@ -410,7 +422,9 @@ export default {
jh: row.jh || '',
famc: row.famc || '',
qk: row.qk || '',
jhs: row.jhs || ''
jhs: row.jhs || '',
kc: row.kc || '',
ztccs: row.jycc || '',
};
console.log('准备传递的参数:', params);
......@@ -431,7 +445,8 @@ export default {
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
}).catch(() => {
});
},
/** 获取区块下拉选项 */
getBlockOptions() {
......@@ -466,8 +481,8 @@ export default {
jl: '10000', // 距离默认值10000
wjsjks: this.getFiveYearsAgoDate(), // 完井时间开始默认五年前的今天
wjsjjs: this.getCurrentDate(), // 完井时间结束默认今天
jcbl: '', // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例
jcbl: 0.2, // 进尺最优比例
jxzsbl: 0.2 // 机械钻速最优比例
}
// 新增时重置井号选择状态
this.wellSelection = []
......@@ -706,7 +721,6 @@ export default {
},
// 井号选择变化
handleWellSelectionChange(selection) {
console.log('选择变化事件触发，selection长度:', selection.length, 'isUserSelecting:', this.isUserSelecting, 'isSettingSelection:', this.isSettingSelection, 'isInitializing:', this.isInitializing)
......@@ -734,7 +748,6 @@ export default {
}
this.wellSelection = allSelectedWells
console.log('最终选择状态:', this.wellSelection)
},
......@@ -791,6 +804,10 @@ export default {
this.getList();
},
formatTooltip(val) {
return val;
}
}
}
......
src/views/efficiencyAnalysis/djzt/detail/components/CurveGraph.vue
<template>
<div class="drilling-chart-container" v-loading="loading" element-loading-text="加载中..."
element-loading-background="rgba(255, 255, 255, 0.7)">
<div class="chart-wrapper">
<el-button type="primary" icon="el-icon-download" size="small" class="export-btn" @click="exportChart"
<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="mini" @click="exportChart"
:disabled="!myChart">
导出图片
</el-button>
</div>
<div class="chart-wrapper">
<div id="drillingEfficiencyChartdj" class="chart"></div>
</div>
<!-- <div class="optimal-values">
......@@ -26,24 +41,24 @@
<!-- 钻头优选表格 -->
<div class="table-section" v-if="tableData && tableData.length > 0">
<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="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="yxlx" 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="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>
<!-- 分页组件 -->
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="pagination.pageNum" :page-sizes="[10, 20, 50, 100]" :page-size="pagination.pageSize"
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>
</template>
<script>
import * as echarts from 'echarts';
import { getDjztqxt } from '@/api/optimization/initialization';
import {getDjztqxt} from '@/api/optimization/initialization';
export default {
props: {
......@@ -66,6 +81,14 @@ export default {
ztcc: {
type: String,
required: true,
},
kcjs: {
type: String,
required: true,
},
ztccsjs: {
type: String,
required: true,
}
},
data() {
......@@ -80,9 +103,33 @@ export default {
pageNum: 1,
pageSize: 20,
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() {
// 不在挂载时自动请求数据，等待父组件触发 loadData()
this.$once('hook:beforeDestroy', this.cleanup);
......@@ -93,7 +140,7 @@ export default {
this.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.tableLoading = true;
getDjztqxt(params)
......@@ -147,7 +194,7 @@ export default {
}
this.myChart = echarts.init(chartDom);
// 解析接口数据（确保折线数据格式正确）
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData;
const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序：[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式：[[钻速, 进尺], ...]
......@@ -166,30 +213,30 @@ export default {
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairLines.push({
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairCenter.push({
name: '十字线中心',
type: 'scatter',
data: [[crosshair.y, crosshair.x]],
symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 }
itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
});
}
// 图表配置项（核心：坐标轴触发，确保折线悬浮显示）
const option = {
title: { text: '钻头钻进能效分析', left: 'center' },
title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: {
trigger: 'axis', // 基于坐标轴触发（不依赖数据点）
axisPointer: {
......@@ -236,11 +283,11 @@ export default {
min: axisRange.xAxis.min,
max: axisRange.xAxis.max,
// interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' },
axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center',
nameGap: 30,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
yAxis: {
name: '进尺m',
......@@ -249,8 +296,8 @@ export default {
// interval: axisRange.yAxis.interval,
nameLocation: 'center',
nameGap: 40,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
series: [
{
......@@ -261,24 +308,24 @@ export default {
// 彻底隐藏所有点（包括悬浮时）
symbol: 'none',
showSymbol: false,
emphasis: { showSymbol: false },
lineStyle: { color: 'red', width: 2 }
emphasis: {showSymbol: false},
lineStyle: {color: 'red', width: 2}
},
{
name: '钻速均值',
type: 'line',
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',
tooltip: { show: false }
tooltip: {show: false}
},
{
name: '进尺均值',
type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 },
lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none',
tooltip: { show: false }
tooltip: {show: false}
},
...crosshairLines,
...crosshairCenter,
......
src/views/efficiencyAnalysis/djzt/detail/components/DataTable.vue
......@@ -8,7 +8,8 @@
<el-form-item>
<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>
</div>
......@@ -19,57 +20,57 @@
<div class="main-table-wrapper" :class="{ 'with-detail': selectedRow }">
<el-table border v-loading="loading" :data="jshaList" @selection-change="handleSelectionChange"
@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="jh" width="110" show-overflow-tooltip fixed />
<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="开始井深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="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="所钻地层" 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="ztxh" 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="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="cjxd" 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="喷嘴直径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="进尺工作时间合计" align="center" prop="jcsjhj" width="180" show-overflow-tooltip />
<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="ztxlh" width="110" 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="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/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="cj" width="90" 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="下井次数" 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="rjxd" 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="喷嘴直径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="喷嘴直径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="jcsjczj" width="180"
show-overflow-tooltip />
show-overflow-tooltip/>
<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"
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="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="pl" width="90" show-overflow-tooltip />
<el-table-column label="立管泵压" align="center" prop="lgby" width="110" 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="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="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="lgby" width="110" show-overflow-tooltip/>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :page-sizes="[20, 40, 60, 80, 100]" @pagination="getList"
style="padding: 10px 0;" />
style="padding: 10px 0;"/>
</div>
<!-- 详细数据表格区域 -->
<transition name="slide-fade">
<div v-if="selectedRow" class="detail-table-wrapper">
<el-table :data="[selectedRow]" border style="width: 100%">
<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="切削齿尺寸mm" prop="tzxl03" 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="tzxl06" 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="切削齿尺寸mm" prop="tzxl03" 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="tzxl06" align="center" min-width="10%"/>
</el-table>
</div>
</transition>
......@@ -80,9 +81,9 @@
</template>
<script>
import { listDjJsha, listJsha, getJsha, delJsha, addJsha, updateJsha } from "@/api/system/jsha";
import { getBlockName, getQkxl } from "@/api/system/jsaa";
import { listTzsj } from "@/api/system/jsha";
import {listDjJsha, listJsha, getJsha, delJsha, addJsha, updateJsha} from "@/api/system/jsha";
import {getBlockName, getQkxl} from "@/api/system/jsaa";
import {listTzsj} from "@/api/system/jsha";
export default {
name: "Jsha",
......@@ -106,6 +107,14 @@ export default {
cw: {
type: String,
default: ''
},
wjrqjsjs: {
type: String,
default: ''
},
wjrqksjs: {
type: String,
default: ''
}
},
data() {
......@@ -211,25 +220,25 @@ export default {
// 表单校验
rules: {
jh: [
{ required: true, message: "井号不能为空", trigger: "blur" }
{required: true, message: "井号不能为空", trigger: "blur"}
],
xh: [
{ required: true, message: "序号不能为空", trigger: "blur" }
{required: true, message: "序号不能为空", trigger: "blur"}
],
cc: [
{ required: true, message: "尺寸不能为空", trigger: "blur" }
{required: true, message: "尺寸不能为空", trigger: "blur"}
],
qsjs: [
{ required: true, message: "开始井深不能为空", trigger: "blur" }
{required: true, message: "开始井深不能为空", trigger: "blur"}
],
zzjs: [
{ required: true, message: "结束井深不能为空", trigger: "blur" }
{required: true, message: "结束井深不能为空", trigger: "blur"}
],
jc: [
{ required: true, message: "进尺不能为空", trigger: "blur" }
{required: true, message: "进尺不能为空", trigger: "blur"}
],
jxzs: [
{ required: true, message: "机械钻速不能为空", trigger: "blur" }
{required: true, message: "机械钻速不能为空", trigger: "blur"}
]
},
selectedRow: null, // 当前选中的行数据
......@@ -342,12 +351,12 @@ export default {
/** 获取特征数据选项 */
getFeatureOptions() {
const featureTypes = [
{ type: "刀翼总数", target: "t01Options" },
{ type: "布齿密度", target: "t02Options" },
{ type: "切削齿尺寸mm", target: "t03Options" },
{ type: "切削齿后倾角°", target: "t04Options" },
{ type: "冠部轮廓", target: "t05Options" },
{ type: "保径", target: "t06Options" }
{type: "刀翼总数", target: "t01Options"},
{type: "布齿密度", target: "t02Options"},
{type: "切削齿尺寸mm", target: "t03Options"},
{type: "切削齿后倾角°", target: "t04Options"},
{type: "冠部轮廓", target: "t05Options"},
{type: "保径", target: "t06Options"}
];
const promises = featureTypes.map(feature => {
......@@ -398,6 +407,16 @@ export default {
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);
listDjJsha(params).then(response => {
......@@ -565,7 +584,8 @@ export default {
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
......@@ -727,7 +747,7 @@ export default {
overflow-y: auto;
}
::v-deep .el-table__cell>.cell {
::v-deep .el-table__cell > .cell {
font-weight: normal;
}
......
src/views/efficiencyAnalysis/djzt/detail/index.vue
......@@ -2,13 +2,14 @@
<template>
<div class="app-container">
<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"
: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 label="曲线图形" name="curveGraph" lazy>
<el-tab-pane label="钻头优选" name="curveGraph">
<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-tabs>
</div>
......@@ -42,7 +43,9 @@ export default {
jhs: '',
ztcc: '',
zbid: '',
cw: ''
cw: '',
wjrqks: '',
wjrqjs: ''
},
// 标记是否是第一次进入页面
isFirstLoad: true
......@@ -51,8 +54,8 @@ export default {
created() {
// 获取路由参数
console.log('详情页面created，完整路由对象:', this.$route);
const { jh, famc, qk, jhs, ztcc, zbid, cw } = this.$route.params;
console.log('路由参数:', { jh, famc, qk, jhs, ztcc, zbid, cw });
const {jh, famc, qk, jhs, ztcc, zbid, cw, kc, ztccs,wjrqjs,wjrqks} = this.$route.params;
console.log('路由参数:', {jh, famc, qk, jhs, ztcc, zbid, cw, kc, ztccs,wjrqjs,wjrqks});
// 检查参数是否为空或undefined
// if (jh && jh !== 'undefined' && jh !== 'null') {
......@@ -63,6 +66,10 @@ export default {
this.queryParams.ztcc = ztcc || ''
this.queryParams.zbid = zbid || ''
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);
// 强制默认展示“数据表格”Tab
this.activeTab = 'dataTable';
......@@ -102,7 +109,8 @@ export default {
this.$modal.confirm('是否确认移除选中的记录？').then(() => {
// 这里可以调用API进行删除操作
this.$modal.msgSuccess("移除成功");
}).catch(() => { });
}).catch(() => {
});
},
// 多选框选中数据
......@@ -156,7 +164,7 @@ export default {
}
}
::v-deep .el-table__cell>.cell {
::v-deep .el-table__cell > .cell {
font-weight: normal;
}
......
src/views/efficiencyAnalysis/djzt/index.vue
......@@ -6,7 +6,7 @@
<el-form-item label="区块" prop="qk">
<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"
v-if="item && item.qk" />
v-if="item && item.qk"/>
</el-select>
</el-form-item>
<el-form-item label="钻头尺寸">
......@@ -23,14 +23,14 @@
<!-- 表格区域 -->
<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="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"
show-overflow-tooltip></el-table-column>
<el-table-column prop="dc" label="地层" align="center" min-width="120"
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="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="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="jxzszt" label="转速最优" align="center" min-width="155" show-overflow-tooltip sortable/>
<el-table-column prop="bz" label="备注" align="center" min-width="180"
show-overflow-tooltip></el-table-column>
<el-table-column label="操作" width="160" align="center" fixed="right">
......@@ -46,7 +46,7 @@
<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"
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">
......@@ -54,7 +54,7 @@
<el-row>
<el-col :span="12">
<el-form-item label="方案名称" prop="famc">
<el-input v-model="formData.famc" placeholder="请输入方案名称" />
<el-input v-model="formData.famc" placeholder="请输入方案名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
......@@ -62,7 +62,7 @@
<el-select v-model="formData.qk" placeholder="请选择区块名称" clearable filterable
style="width: 100%;">
<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-form-item>
</el-col>
......@@ -71,9 +71,9 @@
<el-col :span="12">
<el-form-item label="完井时间" prop="wjsjks" required>
<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="选择结束日期"
style="width: 50%;" />
style="width: 50%;"/>
</el-form-item>
</el-col>
<el-col :span="12">
......@@ -94,37 +94,44 @@
<el-row>
<el-col :span="12">
<el-form-item label="钻头尺寸mm" prop="ztcc">
<el-select v-model="formData.ztcc" multiple filterable allow-create default-first-option
placeholder="请选择或输入钻头尺寸" style="width: 100%" :loading="ztxxLoading">
<el-option v-for="item in ztxxOptions" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
<el-input v-model="formData.ztcc" placeholder="请输入井眼尺寸"/>
<!-- <el-select v-model="formData.ztcc" multiple filterable allow-create default-first-option-->
<!-- placeholder="请选择或输入钻头尺寸" style="width: 100%" :loading="ztxxLoading">-->
<!-- <el-option v-for="item in ztxxOptions" :key="item.value" :label="item.label"-->
<!-- :value="item.value"/>-->
<!-- </el-select>-->
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="进尺最优比例" prop="jcbl">
<el-select v-model="formData.jcbl" placeholder="请选择进尺最优比例" clearable 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-form-item label="开次" prop="kc">
<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-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="机械钻速最优比例" prop="jxzsbl">
<el-select v-model="formData.jxzsbl" placeholder="请选择机械钻速最优比例" clearable
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 label="进尺最优比例" prop="jcbl">
<el-slider v-model="formData.jcbl" :max="1" :min="0" :step="0.1"
:format-tooltip="formatTooltip"></el-slider>
</el-form-item>
</el-col>
<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-input v-model="formData.bz" type="textarea" :rows="3" placeholder="请输入备注信息"></el-input>
</el-form-item>
......@@ -142,9 +149,10 @@
</template>
<script>
import { getQkxl } from "@/api/system/jsaa";
import { getMdcByQkid } from "@/api/scientificDrill/schemeOptimization";
import { selectZtccList, listDjzt, getDjzt, addDjzt, updateDjzt, delDjzt } from "@/api/system/djzt";
import {getQkxl} from "@/api/system/jsaa";
import {getMdcByQkid} from "@/api/scientificDrill/schemeOptimization";
import {selectZtccList, listDjzt, getDjzt, addDjzt, updateDjzt, delDjzt} from "@/api/system/djzt";
export default {
name: 'DjztIndex',
data() {
......@@ -185,7 +193,8 @@ export default {
formData: {
id: null,
qk: '',
ztcc: [],
kc: '',
ztcc: '',
cw: '', // 层位信息
cwid: null, // 层位ID
mdcid: null, // 目的层ID
......@@ -193,24 +202,42 @@ export default {
wjsjks: this.getFiveYearsAgoDate(), // 完井开始日期默认前五年的今天
wjsjjs: this.getTodayDate(), // 完井结束日期默认今天
bz: '',
jcbl: '', // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例
jcbl: 0.2, // 进尺最优比例
jxzsbl: 0.2 // 机械钻速最优比例
},
// 表单验证规则
formRules: {
famc: [
{ required: true, message: '请输入方案名称', trigger: 'blur' }
{required: true, message: '请输入方案名称', trigger: 'blur'}
],
qk: [
{ required: true, message: '请输入区块', trigger: 'blur' }
{required: true, message: '请输入区块', trigger: 'blur'}
],
jcbl: [{ required: true, message: '请选择进尺最优比例', trigger: 'change' }],
jxzsbl: [{ required: true, message: '请选择机械钻速最优比例', trigger: 'change' }]
jcbl: [{required: true, message: '请选择进尺最优比例', trigger: 'change'}],
jxzsbl: [{required: true, message: '请选择机械钻速最优比例', trigger: 'change'}]
},
// 钻头信息选项
ztxxOptions: [],
// 钻头信息加载状态
ztxxLoading: false,
kcData: [
{
label: '1',
value: '1',
}, {
label: '2',
value: '2',
}, {
label: '3',
value: '3',
}, {
label: '4',
value: '4',
}, {
label: '5',
value: '5',
},
]
}
},
watch: {
......@@ -264,8 +291,13 @@ export default {
qk: res.data.qk || row.qk || '',
zbid: res.data.id || row.id || '',
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({
name: 'DjztDetail',
params: params
......@@ -489,9 +521,9 @@ export default {
},
// 条件满足后再请求钻头尺寸
updateZtccOptionsIfReady() {
const { qk, wjsjks, wjsjjs, cwid, mdcid } = this.formData;
const {qk, wjsjks, wjsjjs, cwid, mdcid} = this.formData;
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);
}
},
......@@ -553,7 +585,8 @@ export default {
this.formData = {
id: null,
qk: '',
ztcc: [],
kc: '',
ztcc: '',
cw: '', // 层位信息
cwid: null, // 层位ID
mdcid: null, // 目的层ID
......@@ -561,8 +594,8 @@ export default {
wjsjks: this.getFiveYearsAgoDate(),
wjsjjs: this.getTodayDate(),
bz: '',
jcbl: '', // 进尺最优比例
jxzsbl: '' // 机械钻速最优比例
jcbl: 0.2, // 进尺最优比例
jxzsbl: 0.2 // 机械钻速最优比例
}
this.dialogVisible = true
// 新增打开时尝试基于默认年份加载（需等区块与层位选择后）
......@@ -575,7 +608,9 @@ export default {
this.formData = {
id: row.id,
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 || '', // 层位信息
cwid: row.cwid || null, // 层位ID
mdcid: row.mdcid || null, // 目的层ID
......@@ -612,7 +647,8 @@ export default {
console.error('删除失败:', error)
this.$message.error('删除失败')
}
}).catch(() => { })
}).catch(() => {
})
},
// 提交表单
......@@ -624,7 +660,8 @@ export default {
// 准备提交数据，将数组转换为字符串，将Date对象转换为字符串
const submitData = {
...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 || '', // 使用层位信息作为地层
cw: this.formData.cw || '', // 保留层位信息
cwid: this.formData.cwid || null,
......@@ -671,6 +708,10 @@ export default {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
formatTooltip(val) {
return val;
}
}
}
......
src/views/efficiencyAnalysis/jcxx/components/CurveGraph.vue
......@@ -3,12 +3,25 @@
<div v-if="jh" class="well-number-display">
<span class="well-label">井号:</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 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>
</div>
......@@ -16,7 +29,7 @@
<script>
import * as echarts from 'echarts';
import { getqxt } from '@/api/optimization/initialization';
import {getqxt} from '@/api/optimization/initialization';
export default {
props: {
......@@ -29,7 +42,27 @@ export default {
return {
chartData: 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() {
......@@ -38,7 +71,7 @@ export default {
},
methods: {
getList() {
const params = { jhe: this.jh };
const params = {jhe: this.jh,kc:this.kc,ztccs:this.ztccs};
getqxt(params)
.then(res => {
console.log('接口返回数据:', res);
......@@ -52,6 +85,7 @@ export default {
});
},
initChart() {
if (!this.chartData) {
const chartDom = document.getElementById('drillingEfficiencyChart');
......@@ -75,7 +109,7 @@ export default {
}
this.myChart = echarts.init(chartDom);
// 解析接口数据（确保折线数据格式正确）
const { axisRange, scatterData, targetLineData, crosshair } = this.chartData;
const {axisRange, scatterData, targetLineData, crosshair} = this.chartData;
// 数据顺序：[speed, depth, drillType, jh, cc]
const scatter = scatterData.map(item => [item.speed, item.depth, item.drillType, item.jh, item.cc]);
// 折线数据必须为数组格式：[[钻速, 进尺], ...]
......@@ -95,29 +129,29 @@ export default {
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairLines.push({
name: '十字线',
type: 'line',
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',
tooltip: { show: false } // 十字线不显示tooltip
tooltip: {show: false} // 十字线不显示tooltip
});
crosshairCenter.push({
name: '十字线中心',
type: 'scatter',
data: [[crosshair.y, crosshair.x]],
symbolSize: 12,
itemStyle: { color: 'orange', borderColor: '#fff', borderWidth: 2 }
itemStyle: {color: 'orange', borderColor: '#fff', borderWidth: 2}
});
}
// 图表配置项（核心：坐标轴触发，确保折线悬浮显示）
const option = {
title: { text: '钻头钻进能效分析', left: 'center' },
title: {text: '钻头钻进能效分析', left: 'center'},
tooltip: {
trigger: 'axis', // 基于坐标轴触发（不依赖数据点）
axisPointer: {
......@@ -164,11 +198,11 @@ export default {
min: axisRange.xAxis.min,
max: axisRange.xAxis.max,
interval: axisRange.xAxis.interval,
axisLabel: { formatter: '{value} m/h' },
axisLabel: {formatter: '{value} m/h'},
nameLocation: 'center',
nameGap: 30,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
yAxis: {
name: '进尺',
......@@ -177,8 +211,8 @@ export default {
interval: axisRange.yAxis.interval,
nameLocation: 'center',
nameGap: 40,
axisTick: { show: true },
axisLine: { show: true }
axisTick: {show: true},
axisLine: {show: true}
},
series: [
{
......@@ -189,24 +223,24 @@ export default {
// 彻底隐藏所有点（包括悬浮时）
symbol: 'none',
showSymbol: false,
emphasis: { showSymbol: false },
lineStyle: { color: 'red', width: 2 }
emphasis: {showSymbol: false},
lineStyle: {color: 'red', width: 2}
},
{
name: '钻速均值',
type: 'line',
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',
tooltip: { show: false }
tooltip: {show: false}
},
{
name: '进尺均值',
type: 'line',
data: [[crosshair.x - 500, crosshair.y], [crosshair.x + 500, crosshair.y]],
lineStyle: { color: '#f2ca6b', width: 2 },
lineStyle: {color: '#f2ca6b', width: 2},
symbol: 'none',
tooltip: { show: false }
tooltip: {show: false}
},
...crosshairLines,
...crosshairCenter,
......
src/views/efficiencyAnalysis/jcxx/components/DrillingData.vue
......@@ -6,16 +6,6 @@
<el-input v-model="queryParams.jh" placeholder="请输入井号" clearable @keyup.enter.native="handleQuery"
disabled />
</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-input v-model="queryParams.beginJs" placeholder="请输入开始井深" clearable
@keyup.enter.native="handleQuery" />
......@@ -24,233 +14,24 @@
<el-input v-model="queryParams.endJs" placeholder="请输入结束井深" clearable
@keyup.enter.native="handleQuery" />
</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-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 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"
v-hasPermi="['system:ljSssjSd:export']">导出</el-button>
>导出</el-button>
<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>
<!-- <el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<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)"
<el-table border :data="ljSssjSdList" @selection-change="handleSelectionChange" :height="TableHeight()"
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="cs" min-width="80" show-overflow-tooltip />
<!-- <el-table-column label="迟到井深" align="center" prop="cdjs" min-width="90" show-overflow-tooltip />
......@@ -317,9 +98,9 @@
fixed="right">
<template slot-scope="scope">
<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)"
v-hasPermi="['system:ljSssjSd:remove']">删除</el-button>
>删除</el-button>
</template>
</el-table-column>
</el-table>
......@@ -897,7 +678,7 @@
</template>
<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";
export default {
......@@ -1278,6 +1059,20 @@ export default {
handleDownloadTemplate() {
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>
......
src/views/efficiencyAnalysis/jcxx/components/DrillingTimeChart.vue
......@@ -3,12 +3,21 @@
<div v-if="jh" class="well-number-display">
<span class="well-label">井号:</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 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>
</div>
......@@ -33,6 +42,8 @@ export default {
myChart: null,
resizeHandler: null,
loading: false,
color1: "#FF0000",
option: null,
};
},
mounted() {
......@@ -54,7 +65,7 @@ export default {
}
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]) => {
this.chartData = this.processData(ljqxRes, ljSssjRes);
this.initChart();
......@@ -71,6 +82,7 @@ export default {
},
processData(ljqxRes, ljSssjRes) {
console.log("RKLL", ljqxRes);
// 处理录井曲线数据
const processArrayData = (dataList, fieldName) => {
if (!dataList || !Array.isArray(dataList) || dataList.length === 0) {
......@@ -95,25 +107,12 @@ export default {
: null;
return { depth, value };
})
.filter(
(item) =>
item.depth !== null &&
item.value !== null &&
item.value !== undefined
);
};
// 处理钻时数据（从录井整米数据中获取）
let drillingTimeData = [];
if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) {
drillingTimeData = ljSssjRes.rows
.filter(
(item) =>
item.js !== null &&
item.js !== undefined &&
item.zs !== null &&
item.zs !== undefined
)
.map((item) => ({
depth: item.js,
value: item.zs,
......@@ -125,24 +124,52 @@ export default {
const standpipePressureData = processArrayData(ljqxRes.lyList, "ly");
const drillingPressureData = processArrayData(ljqxRes.zyList, "zy");
const rpmData = processArrayData(ljqxRes.zs1List, "zs1");
const rkllData = processArrayData(ljqxRes.rkllList, "rkll");
// 处理泵冲数据（总泵冲）
let pumpStrokeData = [];
if (ljSssjRes && ljSssjRes.rows && Array.isArray(ljSssjRes.rows)) {
pumpStrokeData = ljSssjRes.rows
.filter(
(item) =>
item.js !== null &&
item.js !== undefined &&
item.zbc !== null &&
item.zbc !== undefined
)
.map((item) => ({
depth: item.js,
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 {
drillingTime: drillingTimeData,
torque: torqueData,
......@@ -150,6 +177,10 @@ export default {
drillingPressure: drillingPressureData,
rpm: rpmData,
pumpStroke: pumpStrokeData,
rkllData: rkllData,
formationIntervals: formationIntervals,
minDepth: ljqxRes.scale1,
maxDepth: ljqxRes.scale,
};
},
......@@ -221,6 +252,8 @@ export default {
drillingPressure,
rpm,
pumpStroke,
rkllData,
formationIntervals,
} = this.chartData;
// 转换数据格式为 [depth, value] 格式
......@@ -242,12 +275,12 @@ export default {
};
const drillingTimeChartData = convertToChartData(drillingTime);
console.log(drillingTimeChartData, "drillingTimeChartData");
const torqueChartData = convertToChartData(torque);
const standpipePressureChartData = convertToChartData(standpipePressure);
const drillingPressureChartData = convertToChartData(drillingPressure);
const rpmChartData = convertToChartData(rpm);
const pumpStrokeChartData = convertToChartData(pumpStroke);
const rkllChartData = convertToChartData(rkllData);
// 计算深度范围
const allDepths = [
......@@ -257,21 +290,57 @@ export default {
...drillingPressureChartData.map((d) => d[0]),
...rpmChartData.map((d) => d[0]),
...pumpStrokeChartData.map((d) => d[0]),
...rkllChartData.map((d) => d[0]),
].filter((d) => d !== null && d !== undefined);
const minDepth =
allDepths.length > 0 ? Math.floor(Math.min(...allDepths) / 10) * 10 : 0;
const maxDepth =
allDepths.length > 0
? Math.ceil(Math.max(...allDepths) / 10) * 10
: 1000;
const option = {
title: {
text: "录井钻时图",
left: "center",
top: 10,
this.chartData.minDepth - 200 < 0 ? 0 : this.chartData.minDepth - 200;
const maxDepth = this.chartData.maxDepth + 200;
// 定义颜色映射表（方便维护和统一管理）
const seriesColors = {
"钻时 (min/m)": "#FF0000", // 红色（你之前指定的）
"扭矩 (kN•m)": "#1E90FF", // 道奇蓝
"立压 (MPa)": "#32CD32", // limegreen
"钻压 (kN)": "#FFD700", // 金色
"转速 (rpm)": "#FF6347", // 番茄红
"泵冲": "#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: {
trigger: "axis",
axisPointer: {
......@@ -309,14 +378,7 @@ export default {
},
},
legend: {
data: [
"钻时 (min/m)",
"扭矩 (kN•m)",
"立压 (MPa)",
"钻压 (kN)",
"转速 (rpm)",
"泵冲",
],
data: legendData,
top: 40,
right: 50,
icon: "rect",
......@@ -381,6 +443,29 @@ export default {
data: drillingTimeChartData,
smooth: true,
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)",
......@@ -388,8 +473,12 @@ export default {
yAxisIndex: 0,
data: torqueChartData,
smooth: true,
symbol: "none",
lineStyle: {
color: seriesColors["扭矩 (kN•m)"], // 指定颜色
width: 1, // 默认宽度，可根据需要调整
},
},
{
name: "立压 (MPa)",
......@@ -397,8 +486,11 @@ export default {
yAxisIndex: 0,
data: standpipePressureChartData,
smooth: true,
symbol: "none",
lineStyle: {
color: seriesColors["立压 (MPa)"], // 指定颜色
width: 1,
},
},
{
name: "钻压 (kN)",
......@@ -406,8 +498,11 @@ export default {
yAxisIndex: 1,
data: drillingPressureChartData,
smooth: true,
symbol: "none",
lineStyle: {
color: seriesColors["钻压 (kN)"], // 指定颜色
width: 1,
},
},
{
name: "转速 (rpm)",
......@@ -415,8 +510,11 @@ export default {
yAxisIndex: 1,
data: rpmChartData,
smooth: true,
symbol: "none",
lineStyle: {
color: seriesColors["转速 (rpm)"], // 指定颜色
width: 1,
},
},
{
name: "泵冲",
......@@ -424,17 +522,105 @@ export default {
yAxisIndex: 1,
data: pumpStrokeChartData,
smooth: true,
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();
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() {
if (!this.myChart) {
this.$message.warning("图表未初始化，无法导出");
......@@ -471,6 +657,36 @@ export default {
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>
......
src/views/efficiencyAnalysis/jcxx/components/HistogramGraph.vue
<template>
<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-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
class="export-btn"
type="primary"
@click="exportChart"
:disabled="loading || !myChart"
title="导出图表为图片"
icon="el-icon-download"
>
导出
</el-button>
size="mini"
> </el-button>
</div>
<div class="chart-layout">
<div id="mainzft" class="chart" ref="chartRef"></div>
<aside v-if="legendItems && legendItems.length" class="strata-legend">
<div class="legend-header">层位图例</div>
<div class="legend-list">
<div
v-for="(item, index) in legendItems"
......@@ -70,6 +82,26 @@ export default {
lastStackedAreas: null,
lastChartConfig: 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: {
......@@ -295,7 +327,7 @@ export default {
// 获取数据
async getList() {
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 || {};
const legendList = Array.isArray(res?.tlList)
? res.tlList
......@@ -702,7 +734,7 @@ export default {
type: "bar",
stack: "total",
silent: true,
barWidth: "8%",
barWidth: "10%",
itemStyle: {
borderColor: "transparent",
color: "transparent",
......@@ -979,7 +1011,7 @@ export default {
gap: 5px;
align-items: stretch;
justify-content: flex-start;
overflow: hidden;
overflow: auto;
}
.strata-legend {
......@@ -1080,7 +1112,7 @@ export default {
flex: 1;
width: 100%;
max-width: 100%;
height: 100%;
height: 110%;
min-height: 400px;
display: block;
border-radius: 16px;
......
src/views/efficiencyAnalysis/jcxx/detail.vue
<template>
<div class="app-container">
<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}`" />
</el-tab-pane>
<el-tab-pane label="曲线图形" name="curveGraph">
<el-tab-pane label="钻头优选" name="curveGraph">
<CurveGraph v-if="activeTab === 'curveGraph'" :jh="queryParams.jh"
:key="`curveGraph-${queryParams.jh}`" />
</el-tab-pane>
<el-tab-pane label="直方图形" name="histogramGraph">
<el-tab-pane label="钻头能效分析" name="histogramGraph">
<HistogramGraph v-if="activeTab === 'histogramGraph'" :jh="queryParams.jh"
:key="`histogramGraph-${queryParams.jh}`" />
</el-tab-pane>
......@@ -32,7 +36,7 @@
:jh="queryParams.jh" :key="`drillingCurve-${queryParams.jh}`" />
</keep-alive>
</el-tab-pane>
<el-tab-pane label="录井钻时图" name="drillingTimeChart">
<el-tab-pane label="钻时及功能参数" name="drillingTimeChart">
<DrillingTimeChart v-if="activeTab === 'drillingTimeChart'" :jh="queryParams.jh"
:key="`drillingTimeChart-${queryParams.jh}`" />
</el-tab-pane>
......@@ -40,10 +44,7 @@
<WellboreTrajectory v-if="activeTab === 'wellboreTrajectory'" :jh="queryParams.jh"
:key="`wellboreTrajectory-${queryParams.jh}`" />
</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>
</div>
</template>
......@@ -76,7 +77,7 @@ export default {
data() {
return {
// 当前激活的tab
activeTab: 'dataTable',
activeTab: 'wellDepthStructure',
// 显示搜索条件
showSearch: true,
// 遮罩层
......
src/views/xjsj/index.vue
......@@ -778,7 +778,7 @@ export default {
},
handleChangeAr() {
if (this.radio == "3") {
if (this.formAr.radio == "3") {
var item = this.sfcs;
console.log(item, "item");
this.$router.push({
......@@ -789,7 +789,7 @@ export default {
qkmc: item.qkmc,
},
});
} else if (this.radio == "6") {
} else if (this.formAr.radio == "6") {
this.$message({
message: "正在开发中！",
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