deesCloud-web/scripts/srr_en.js

307 lines
8.7 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

//组件
var srrcomponent_en = {
template:`
<div>
<div style="display: flex;margin-top: 10px;">
<el-input v-model="input" placeholder="input wellname" clearable style="width: 30%;"></el-input>
<el-button style="margin-left: 5px;" id ="bt_serach" plain type="primary" icon="el-icon-search" @click="getWell(input)">Search</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="Well Name"
:width="150"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
prop="welltime"
label="Upload Time"
:width="170">
</el-table-column>
<el-table-column
prop="welloperator"
label="User"
:width="150"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
prop="upload_user"
label="Upload User"
:width="150"
:show-overflow-tooltip="true">
</el-table-column>
<el-table-column
label="Operation"
width="330">
<template slot-scope="scope">
<el-button @click="show_pdf(scope.row)" type="text" size="medium">Report Detail</el-button>
<el-button @click="export_pdf(scope.row)" type="text" size="medium">Export</el-button>
<el-checkbox
style="margin-left: 10px"
v-model="scope.row.pumpExport"
@change="(value) => handlePumpExportChange(value, scope.row)">
<span style="color: green">Export pump</span>
</el-checkbox>
</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="Record information of on-site personnel"
:visible.sync="pdf_visible"
:lock-scroll ="false"
:append-to-body="true"
width="60%">
<div style="height: 450px;overflow: auto;">
<div style="display: flex;">
<div style="width: 100%;">Well name: {{base_data.wellname}}</div>
</div>
<div style="display: flex;padding-top: 10px;">
<div style="width: 100%;">Upload user: {{base_data.upload_name}}</div>
</div>
<el-divider></el-divider>
<div>Construction personnel filling in information</div>
<div v-for="item in srr_state_data">
<div style="display: flex;padding-top: 10px;">
<div style="width: 100%;">
Start Time: {{item.bt}}
&nbsp;&nbsp;End Time: {{item.et}}
&nbsp;&nbsp;Service staff: {{item.servicer}}
&nbsp;&nbsp;State: {{item.state}}
&nbsp;&nbsp;RIH Times{{item.drilling_time}}
</div>
</div>
</div>
<el-divider></el-divider>
<div>Reference Information</div>
<div style="display: flex;padding-top: 10px;">
<div style="width: 50%;">IP+Port: {{base_data.ip}}</div>
<div style="width: 50%;">area: {{base_data.location}}</div>
</div>
<div v-for="item in srr_event_data">
<div style="display: flex;padding-top: 10px;">
<div style="width: 100%;">
Start Time: {{item.bt}}
&nbsp;&nbsp;End Time: {{item.et}}
&nbsp;&nbsp;Event: {{item.ename}}
</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,
base_data:{},
srr_state_data:{},
srr_event_data:{},
}
},
mounted() {
var _this = this;
var objs;
axios.post('/deescloud/get_well_cmp_en', {
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;
// 如果开泵信息被启用则添加flag参数
const requestParams = {
opuser: localStorage.getItem("online_user"),
opuser_uuid: localStorage.getItem("uuid"),
wellname: row.wellNameSource,
flag: row.pumpExport || false // 直接使用当前行的泵导出状态
};
axios.post('/deescloud/get_srr_pdf_en', requestParams)
.then(function(response) {
console.log(response.data);
var fileid = response.data.fileId;
var downUrl = 'file/' + fileid;
downloadUrl(row.wellNameSource + "-On site personnel record report.pdf", downUrl);
})
.catch(function(error) {
console.log(error);
});
},
show_pdf(row){
let _this= this;
axios.post('/deescloud/get_srr_base', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
wellname: row.wellNameSource,
})
.then(function (response) {
console.log(response.data);
_this.$data.base_data = response.data;
})
.catch(function (error) {
console.log(error);
});
axios.post('/deescloud/get_srr_event_en', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
wellname: row.wellNameSource,
})
.then(function (response) {
console.log(response.data);
_this.$data.srr_event_data = response.data.data;
})
.catch(function (error) {
console.log(error);
});
axios.post('/deescloud/get_srr_state', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
wellname: row.wellNameSource,
})
.then(function (response) {
console.log(response.data);
_this.$data.srr_state_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_cmp_en', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
Wellname: _search_name,
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) {
//console.log(`每页 ${val} 条`);
this.$data.pagesize = val;
var _this = this;
var objs;
axios.post('/deescloud/get_well_cmp_en', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
Wellname: this.$data.input,
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) {
//console.log(`当前页: ${val}`);
this.$data.currentPage = val;
var _this = this;
var objs;
axios.post('/deescloud/get_well_cmp_en', {
opuser:localStorage.getItem("online_user"),
opuser_uuid:localStorage.getItem("uuid"),
Wellname: this.$data.input,
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);
});
},
}
}