323 lines
10 KiB
JavaScript
323 lines
10 KiB
JavaScript
|
|
|||
|
|
var toolscomponent = {
|
|||
|
|
template: `
|
|||
|
|
<div>
|
|||
|
|
<!-- 搜索区域 -->
|
|||
|
|
<div style="display: flex; margin-top: 10px;">
|
|||
|
|
<el-input v-model="input" placeholder="请输入井名" clearable style="width: 20%;"></el-input>
|
|||
|
|
<el-checkbox style="background-color: #ECF5FF; margin-left: 5px;" v-model="checked" label="预警" border></el-checkbox>
|
|||
|
|
<el-button style="margin-left: 5px;" id="bt_serach" plain type="primary" icon="el-icon-search" @click="getWell(input)">搜索</el-button>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- 表格区域 -->
|
|||
|
|
<div class="span">
|
|||
|
|
<el-table
|
|||
|
|
:data="tableData"
|
|||
|
|
style="width: 100%; font-size: 14px"
|
|||
|
|
:height="tHeight"
|
|||
|
|
:cell-style="{ background: '#304156' }"
|
|||
|
|
border
|
|||
|
|
>
|
|||
|
|
<el-table-column prop="wellNameSource" label="井号" :width="150" :show-overflow-tooltip="true"></el-table-column>
|
|||
|
|
<el-table-column prop="welltime" label="建井时间" :width="170"></el-table-column>
|
|||
|
|
<el-table-column prop="welloperator" label="操作用户" :width="150" :show-overflow-tooltip="true"></el-table-column>
|
|||
|
|
<el-table-column prop="upload_user" label="上传用户" :width="150" :show-overflow-tooltip="true"></el-table-column>
|
|||
|
|
<el-table-column label="操作" width="240">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div style="flex: 1; display: inline-flex;">
|
|||
|
|
<div v-if="!scope.row.tsw">
|
|||
|
|
<svg style="bottom: 5px;" t="1683783351758" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2560" width="8" height="8">
|
|||
|
|
<path d="M512 512m-469.333333 0a469.333333 469.333333 0 1 0 938.666666 0 469.333333 469.333333 0 1 0-938.666666 0Z" fill="#d81e06" p-id="2561"></path>
|
|||
|
|
</svg>
|
|||
|
|
</div>
|
|||
|
|
<el-button @click="show_pdf(scope.row)" type="text" size="medium">报告明细</el-button>
|
|||
|
|
<el-button @click="export_pdf(scope.row)" type="text" size="medium">导出</el-button>
|
|||
|
|
<el-button @click="export_mess_pdf(scope.row)" type="text" size="medium">仪器报告导出</el-button>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- 分页 -->
|
|||
|
|
<div class="block">
|
|||
|
|
<span class="demonstration" style="background-color: #ECF5FF;"></span>
|
|||
|
|
<el-pagination
|
|||
|
|
@size-change="handleSizeChange"
|
|||
|
|
@current-change="handleCurrentChange"
|
|||
|
|
:current-page="currentPage"
|
|||
|
|
:page-sizes="[50, 100, 200, 300]"
|
|||
|
|
:page-size="pagesize"
|
|||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|||
|
|
:total="recordTotal"
|
|||
|
|
style="background-color: #ECF5FF;"
|
|||
|
|
></el-pagination>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!-- 仪器状态弹窗 -->
|
|||
|
|
<el-dialog
|
|||
|
|
title="仪器状态信息"
|
|||
|
|
:visible.sync="pdf_visible"
|
|||
|
|
:lock-scroll="false"
|
|||
|
|
:append-to-body="true"
|
|||
|
|
width="60%"
|
|||
|
|
>
|
|||
|
|
<div style="height: 450px; overflow: auto;">
|
|||
|
|
|
|||
|
|
<div v-if="tool_warning_data.length > 0">
|
|||
|
|
<div>风险预警:</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<div v-for="item in tool_warning_data" :key="item.id">
|
|||
|
|
<div style="display: flex; padding-top: 10px; align-items: center;">
|
|||
|
|
<div
|
|||
|
|
style="width: 100%;"
|
|||
|
|
:style="{ color: item.flag === 1 ? 'red' : 'inherit' }"
|
|||
|
|
>
|
|||
|
|
<span style="font-weight: 500;">
|
|||
|
|
<template v-if="item.flag === 0">
|
|||
|
|
{{ item.series_num }} {{ item.instrument_id }} | 仪器正常
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<template v-else>
|
|||
|
|
{{ item.time }} | {{ item.series_num }} |
|
|||
|
|
</template>
|
|||
|
|
</span>
|
|||
|
|
|
|||
|
|
<template v-if="item.flag === 1">
|
|||
|
|
<span style="margin-left: 6px;">
|
|||
|
|
{{ item.err_level }} | {{ item.context }}
|
|||
|
|
</span>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<el-button
|
|||
|
|
v-if="item.series_num"
|
|||
|
|
@click="openDetail(item)"
|
|||
|
|
type="text"
|
|||
|
|
size="medium"
|
|||
|
|
style="margin-left: 12px; padding: 0 4px;"
|
|||
|
|
>
|
|||
|
|
详情
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div v-if="tool_warning_data.length == 0">
|
|||
|
|
<div>本口井仪器工作正常。</div>
|
|||
|
|
</div>
|
|||
|
|
<el-divider></el-divider>
|
|||
|
|
</div>
|
|||
|
|
</el-dialog>
|
|||
|
|
</div>
|
|||
|
|
`,
|
|||
|
|
data() {
|
|||
|
|
// 获取当前屏幕的分辨率
|
|||
|
|
let screenW = window.screen.width;
|
|||
|
|
let screenH = window.innerHeight;
|
|||
|
|
console.log("screen width:", screenW);
|
|||
|
|
console.log("screen height:", screenH);
|
|||
|
|
return {
|
|||
|
|
tHeight: screenH - 192,
|
|||
|
|
tableData: Array(0),
|
|||
|
|
input: '',
|
|||
|
|
currentPage: 1,
|
|||
|
|
pagesize: 50,
|
|||
|
|
recordTotal: 0,
|
|||
|
|
pdf_visible: false,
|
|||
|
|
tool_warning_data: [],
|
|||
|
|
checked: false,
|
|||
|
|
currentWellName: '' // 新增：存储当前查看的井名
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
var _this = this;
|
|||
|
|
|
|||
|
|
var objs;
|
|||
|
|
axios.post('/deescloud/get_well_tool', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
index: this.$data.currentPage,
|
|||
|
|
count: this.$data.pagesize
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
objs = response.data.data;
|
|||
|
|
rcnt = response.data.total;
|
|||
|
|
_this.$data.tableData = objs;
|
|||
|
|
_this.$data.recordTotal = rcnt;
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
export_pdf(row) {
|
|||
|
|
var _this = this;
|
|||
|
|
|
|||
|
|
axios.post('deescloud/get_tool_warning_pdf', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
wellname: row.wellNameSource
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
var fileid = response.data.fileId;
|
|||
|
|
var downUrl = 'file/' + fileid;
|
|||
|
|
downloadUrl(row.wellNameSource + "-仪器状态报告.pdf", downUrl);
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
export_mess_pdf(row) {
|
|||
|
|
var _this = this;
|
|||
|
|
|
|||
|
|
axios.post('deescloud/get_tool_mess_pdf', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
wellname: row.wellNameSource
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
var fileid = response.data.fileId;
|
|||
|
|
var downUrl = 'file/' + fileid;
|
|||
|
|
// downloadUrl(row.wellNameSource + "-仪器报告.pdf", downUrl);
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
show_pdf(row) {
|
|||
|
|
let _this = this;
|
|||
|
|
// 存储当前井名
|
|||
|
|
this.currentWellName = row.wellNameSource;
|
|||
|
|
|
|||
|
|
axios.post('/deescloud/get_tool_warning', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
wellname: row.wellNameSource
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
_this.$data.tool_warning_data = response.data.data;
|
|||
|
|
_this.$data.pdf_visible = true;
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
getWell(_search_name) {
|
|||
|
|
document.getElementById("bt_serach").blur();
|
|||
|
|
this.$data.currentPage = 1;
|
|||
|
|
|
|||
|
|
var _this = this;
|
|||
|
|
var objs;
|
|||
|
|
axios.post('/deescloud/get_well_tool', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
Wellname: _search_name,
|
|||
|
|
if_warn: this.$data.checked,
|
|||
|
|
index: this.$data.currentPage,
|
|||
|
|
count: this.$data.pagesize
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
objs = response.data.data;
|
|||
|
|
rcnt = response.data.total;
|
|||
|
|
_this.$data.tableData = objs;
|
|||
|
|
_this.$data.recordTotal = rcnt;
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleSizeChange(val) {
|
|||
|
|
this.$data.pagesize = val;
|
|||
|
|
var _this = this;
|
|||
|
|
|
|||
|
|
var objs;
|
|||
|
|
axios.post('/deescloud/get_well_tool', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
Wellname: this.$data.input,
|
|||
|
|
if_warn: this.$data.checked,
|
|||
|
|
index: this.$data.currentPage,
|
|||
|
|
count: this.$data.pagesize
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
objs = response.data.data;
|
|||
|
|
rcnt = response.data.total;
|
|||
|
|
_this.$data.tableData = objs;
|
|||
|
|
_this.$data.recordTotal = rcnt;
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleCurrentChange(val) {
|
|||
|
|
this.$data.currentPage = val;
|
|||
|
|
var _this = this;
|
|||
|
|
|
|||
|
|
var objs;
|
|||
|
|
axios.post('/deescloud/get_well_tool', {
|
|||
|
|
opuser: localStorage.getItem("online_user"),
|
|||
|
|
opuser_uuid: localStorage.getItem("uuid"),
|
|||
|
|
Wellname: this.$data.input,
|
|||
|
|
if_warn: this.$data.checked,
|
|||
|
|
index: this.$data.currentPage,
|
|||
|
|
count: this.$data.pagesize
|
|||
|
|
})
|
|||
|
|
.then(function (response) {
|
|||
|
|
console.log(response.data);
|
|||
|
|
objs = response.data.data;
|
|||
|
|
rcnt = response.data.total;
|
|||
|
|
_this.$data.tableData = objs;
|
|||
|
|
_this.$data.recordTotal = rcnt;
|
|||
|
|
})
|
|||
|
|
.catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 新增：打开详情页方法
|
|||
|
|
// 新增：打开详情页方法
|
|||
|
|
openDetail(item) {
|
|||
|
|
// 使用当前井名和预警项ID构建详情页URL
|
|||
|
|
const wellName = this.currentWellName; // 不要预先编码
|
|||
|
|
// 使用预警ID或时间戳作为唯一标识
|
|||
|
|
|
|||
|
|
// 构建基础URL，参数留待URLSearchParams处理
|
|||
|
|
const detailUrl = 'tool_detail.html';
|
|||
|
|
|
|||
|
|
// 使用URLSearchParams自动处理编码
|
|||
|
|
const params = new URLSearchParams({
|
|||
|
|
well: wellName,
|
|||
|
|
id: item.opuser_uuid,
|
|||
|
|
name : item.name,
|
|||
|
|
series: item.series_num,
|
|||
|
|
instrument: item.instrument_id,
|
|||
|
|
flag:item.flag,
|
|||
|
|
content: item.content || ''
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 完整URL
|
|||
|
|
const fullUrl = `${detailUrl}?${params.toString()}`;
|
|||
|
|
|
|||
|
|
// 在新标签页打开详情页
|
|||
|
|
window.open(fullUrl, '_blank');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
};
|