276 lines
9.5 KiB
Vue
276 lines
9.5 KiB
Vue
|
|
<template>
|
|||
|
|
<div class="content">
|
|||
|
|
<div class="search-box">
|
|||
|
|
<div class="search-item">
|
|||
|
|
<!-- 设备名称 -->
|
|||
|
|
<span>{{$t('message.unload.devName')}}:</span>
|
|||
|
|
<el-select style="margin-right: 20px" v-model="devSn" size="medium" :placeholder="$t('message.unload.placeholderText3')">
|
|||
|
|
<el-option
|
|||
|
|
:label="$t('message.unload.all')"
|
|||
|
|
value="">
|
|||
|
|
</el-option>
|
|||
|
|
<el-option
|
|||
|
|
v-for="item in devList"
|
|||
|
|
:key="item.id"
|
|||
|
|
:label="item.devName"
|
|||
|
|
:value="item.devSn">
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
<el-date-picker
|
|||
|
|
class="serarch_picker"
|
|||
|
|
size="medium"
|
|||
|
|
v-model="valueTime"
|
|||
|
|
type="daterange"
|
|||
|
|
range-separator="-"
|
|||
|
|
:start-placeholder="$t('message.unload.startTime')"
|
|||
|
|
:end-placeholder="$t('message.unload.endTime')">
|
|||
|
|
</el-date-picker>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div class="search-item">
|
|||
|
|
<el-date-picker
|
|||
|
|
size="medium"
|
|||
|
|
v-model="timeList"
|
|||
|
|
type="daterange"
|
|||
|
|
range-separator="至"
|
|||
|
|
start-placeholder="开始日期"
|
|||
|
|
end-placeholder="结束日期">
|
|||
|
|
</el-date-picker>
|
|||
|
|
</div> -->
|
|||
|
|
<!-- 查询 -->
|
|||
|
|
<el-button size="medium" @click="quertData">{{$t('message.unload.search')}}</el-button>
|
|||
|
|
<!-- 刷新 -->
|
|||
|
|
<el-button size="medium" @click="refresh">{{$t('message.unload.refresh')}}</el-button>
|
|||
|
|
<!-- <el-button size="medium" @click="exportExcel">导出</el-button> -->
|
|||
|
|
</div>
|
|||
|
|
<div class="table-box">
|
|||
|
|
<el-table
|
|||
|
|
:data="tableData"
|
|||
|
|
class="tables"
|
|||
|
|
height="700"
|
|||
|
|
style="width: 100%">
|
|||
|
|
<!-- 设备名称 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.devName')"
|
|||
|
|
prop="devName"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column>
|
|||
|
|
|
|||
|
|
<!-- <el-table-column
|
|||
|
|
label="设备编号"
|
|||
|
|
prop="devSn"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column> -->
|
|||
|
|
<!-- 位移 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.displacement')+'(m)'"
|
|||
|
|
prop="displacement"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- 载重 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.load')+'(t)'"
|
|||
|
|
prop="loading"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- X倾角 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.XDip')+'(°)'"
|
|||
|
|
prop="xDipAngle"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- "Y倾角 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.YDip')+'(°)'"
|
|||
|
|
prop="yDipAngle"
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- 上传时间 -->
|
|||
|
|
<el-table-column
|
|||
|
|
:label="$t('message.unload.upLoadTime')"
|
|||
|
|
>
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
{{moment(scope.row.reciveTime).format('YYYY-MM-DD HH:mm:ss')}}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
<el-pagination
|
|||
|
|
class="pagerBox"
|
|||
|
|
@size-change="handleSizeChange"
|
|||
|
|
@current-change="handleCurrentChange"
|
|||
|
|
:current-page="pageNo"
|
|||
|
|
:page-sizes="$store.state.PAGESIZRS"
|
|||
|
|
:page-size="pageSize"
|
|||
|
|
layout="total, sizes, prev, pager, next"
|
|||
|
|
:total="total"
|
|||
|
|
background
|
|||
|
|
></el-pagination>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import moment from "moment";
|
|||
|
|
import {
|
|||
|
|
getUnloadListApi,
|
|||
|
|
getUnloadCurrentListApi
|
|||
|
|
} from "@/assets/js/api/unloadManage";
|
|||
|
|
export default {
|
|||
|
|
data(){
|
|||
|
|
return{
|
|||
|
|
devSn: "",
|
|||
|
|
projectSn: "",
|
|||
|
|
devList:[],
|
|||
|
|
tableData:[],
|
|||
|
|
pageNo: 1,
|
|||
|
|
pageSize: 10,
|
|||
|
|
total: 0,
|
|||
|
|
timeList: "",
|
|||
|
|
startTime: "",
|
|||
|
|
endTime: "",
|
|||
|
|
valueTime:'',
|
|||
|
|
moment: ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created(){
|
|||
|
|
this.moment = moment
|
|||
|
|
this.projectSn = this.$store.state.projectSn;
|
|||
|
|
this.startTime = this.endTime = moment(new Date()).format('YYYY-MM-DD')
|
|||
|
|
console.log(this.startTime, this.endTime)
|
|||
|
|
this.getDevice()
|
|||
|
|
this.selectNowDate()
|
|||
|
|
this.getUnloadCurrentList()
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods:{
|
|||
|
|
getDevice() {
|
|||
|
|
getUnloadListApi({ projectSn: this.$store.state.projectSn }).then(
|
|||
|
|
(result) => {
|
|||
|
|
if (result.success) {
|
|||
|
|
this.devList = result.result;
|
|||
|
|
// if(this.devList.length>0){
|
|||
|
|
// this.devSn = this.devList[0].ammeterNo
|
|||
|
|
// }
|
|||
|
|
console.log("get设备列表", this.devList);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
);
|
|||
|
|
},
|
|||
|
|
// 获取当前时间 返回YYYY-MM-DD HH:mm:ss
|
|||
|
|
selectNowDate(){
|
|||
|
|
var date = new Date(),
|
|||
|
|
year = date.getFullYear(),
|
|||
|
|
month = date.getMonth() + 1,
|
|||
|
|
day = date.getDate(),
|
|||
|
|
hours = date.getHours(), //获取当前小时数(0-23)
|
|||
|
|
minutes = date.getMinutes(),//获取当前分钟数(0-59)
|
|||
|
|
seconds = date.getSeconds()
|
|||
|
|
month >= 1 && month <= 9 ? (month = "0" + month) : "";
|
|||
|
|
day >= 0 && day <= 9 ? (day = "0" + day) : "";
|
|||
|
|
hours >= 0 && hours <= 9 ? (hours = "0" + hours) : "";
|
|||
|
|
minutes >= 0 && minutes <= 9 ? (minutes = "0" + minutes) : "";
|
|||
|
|
seconds >= 0 && seconds <= 9 ? (seconds = "0" + seconds) : "";
|
|||
|
|
// var timer = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes+ ':' + seconds;
|
|||
|
|
var timer = year + '-' + month + '-' + day
|
|||
|
|
this.valueTime = [timer,timer]
|
|||
|
|
console.log(timer)
|
|||
|
|
// return timer;
|
|||
|
|
},
|
|||
|
|
getUnloadCurrentList(){
|
|||
|
|
let data = {
|
|||
|
|
devSn: this.devSn,
|
|||
|
|
projectSn: this.$store.state.projectSn,
|
|||
|
|
pageNo: this.pageNo,
|
|||
|
|
pageSize: this.pageSize,
|
|||
|
|
startTime: this.valueTime ? this.valueTime[0]:'',
|
|||
|
|
endTime: this.valueTime ? this.valueTime[1]:''
|
|||
|
|
}
|
|||
|
|
getUnloadCurrentListApi(data).then(res=>{
|
|||
|
|
console.log(res)
|
|||
|
|
if(res.success){
|
|||
|
|
this.tableData = res.result.records
|
|||
|
|
this.total = res.result.total
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//刷新
|
|||
|
|
refresh(){
|
|||
|
|
this.pageNo = 1
|
|||
|
|
this.pageSize = 10
|
|||
|
|
this.selectNowDate()
|
|||
|
|
this.getUnloadCurrentList()
|
|||
|
|
},
|
|||
|
|
quertData(){
|
|||
|
|
this.pageNo = 1
|
|||
|
|
this.pageSize = 10
|
|||
|
|
console.log(this.devSn)
|
|||
|
|
this.getUnloadCurrentList()
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
handleSizeChange(value){
|
|||
|
|
this.pageSize=value;
|
|||
|
|
this.getUnloadCurrentList()
|
|||
|
|
},
|
|||
|
|
handleCurrentChange(value){
|
|||
|
|
this.pageNo=value;
|
|||
|
|
this.getUnloadCurrentList()
|
|||
|
|
},
|
|||
|
|
exportExcel(){
|
|||
|
|
if(this.valueTime){
|
|||
|
|
window.location.href =
|
|||
|
|
this.$http.defaults.baseURL +
|
|||
|
|
"xmgl/download/exporExcelTowerAlarm?projectSn=" + this.projectSn +
|
|||
|
|
"&devSn=" + this.devSn + "&startTime=" + this.transformTimestamp2(this.valueTime[0]) + "&endTime=" + this.transformTimestamp2(this.valueTime[1]);
|
|||
|
|
}else {
|
|||
|
|
window.location.href =
|
|||
|
|
this.$http.defaults.baseURL +
|
|||
|
|
"xmgl/download/exporExcelTowerAlarm?projectSn=" + this.projectSn +
|
|||
|
|
"&devSn=" + this.devSn;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.content{
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
height: 100%;
|
|||
|
|
.search-box{
|
|||
|
|
background: #fff;
|
|||
|
|
padding: 25px;
|
|||
|
|
margin-bottom: 14px;
|
|||
|
|
.search-item{
|
|||
|
|
display: inline-block;
|
|||
|
|
margin-right: 26px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.table-box{
|
|||
|
|
flex: 1;
|
|||
|
|
background: #fff;
|
|||
|
|
/deep/.el-table{
|
|||
|
|
td{
|
|||
|
|
vertical-align: top;
|
|||
|
|
}
|
|||
|
|
.cell{
|
|||
|
|
padding-left: 30px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.f-2{
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
.table-item{
|
|||
|
|
width: 50%
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|