|
|
@@ -0,0 +1,515 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<div class="toptab"> |
|
|
|
<div |
|
|
|
@click="tapclickyab(0)" |
|
|
|
:class="{ activecllasscet: activeTotal == 0 }" |
|
|
|
:style="{ background: activeTotal == 0 ? '#2671E2' : '#ffffff' }" |
|
|
|
> |
|
|
|
设备在线记录 |
|
|
|
</div> |
|
|
|
<div |
|
|
|
@click="tapclickyab(1)" |
|
|
|
:class="{ activecllasscet: activeTotal == 1 }" |
|
|
|
:style="{ background: activeTotal == 1 ? '#2671E2' : '#ffffff' }" |
|
|
|
> |
|
|
|
设备指派记录 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="titlebox" v-if="activeTotal == 0"> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<span style="line-height: 40px" class="demonstration">在线时间:</span> |
|
|
|
<el-date-picker |
|
|
|
@change="confirmtime()" |
|
|
|
v-model="customtime" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
:default-time="['00:00:00', '23:59:59']" |
|
|
|
value-format="yyyy-MM-dd" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
<span class="demonstration" style="margin-left: 18px; line-height: 40px" |
|
|
|
>楼盘名称:</span |
|
|
|
> |
|
|
|
<div style="width: 200px"> |
|
|
|
<!-- <el-input v-model="page.houseName"></el-input>--> |
|
|
|
<el-select v-model="page.houseName" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in houseList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.propertyName" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<span style="line-height: 40px" class="demonstration">领用人:</span> |
|
|
|
<div style="width: 200px"> |
|
|
|
<el-input v-model="page.accountName"></el-input> |
|
|
|
</div> |
|
|
|
<span class="demonstration" style="margin-left: 18px; line-height: 40px" |
|
|
|
>设备编号:</span |
|
|
|
> |
|
|
|
<div style="width: 200px"> |
|
|
|
<el-input v-model="page.imei"></el-input> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button |
|
|
|
@click="screening()" |
|
|
|
style="background: #2671e2; color: #ffffff" |
|
|
|
>筛选</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button @click="empty()">清空筛选条件</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="tablebox" v-if="activeTotal == 0"> |
|
|
|
<template> |
|
|
|
<el-table :data="tableData" style="width: 100%"> |
|
|
|
<el-table-column prop="index" label="序号" width="100" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="imei" label="设备编号" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="accountName" label="领用人" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="openTime" label="在线时间" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="closeTime" label="离线时间" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="offStatusName" label="离线原因" align="center"> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</template> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:current-page="currentPage4" |
|
|
|
:page-sizes="[6, 10, 14, 20]" |
|
|
|
:page-size="6" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="page.total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="titlebox" v-if="activeTotal == 1"> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<span style="line-height: 40px" class="demonstration">指派时间:</span> |
|
|
|
<el-date-picker |
|
|
|
@change="confirmtime()" |
|
|
|
v-model="customtime" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
:default-time="['00:00:00', '23:59:59']" |
|
|
|
value-format="yyyy-MM-dd" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
<span class="demonstration" style="margin-left: 18px; line-height: 40px" |
|
|
|
>楼盘名称:</span |
|
|
|
> |
|
|
|
<div style="width: 200px"> |
|
|
|
<!-- <el-input v-model="page.houseName"></el-input>--> |
|
|
|
<el-select v-model="page.houseName" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in houseList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.propertyName" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<span style="line-height: 40px" class="demonstration">领用人:</span> |
|
|
|
<div style="width: 200px"> |
|
|
|
<el-input v-model="page.accountName"></el-input> |
|
|
|
</div> |
|
|
|
<span class="demonstration" style="margin-left: 18px; line-height: 40px" |
|
|
|
>设备编号:</span |
|
|
|
> |
|
|
|
<div style="width: 200px"> |
|
|
|
<el-input v-model="page.imei"></el-input> |
|
|
|
</div> |
|
|
|
<span class="demonstration" style="margin-left: 18px; line-height: 40px" |
|
|
|
>录音结果:</span |
|
|
|
> |
|
|
|
<div style="width: 200px"> |
|
|
|
<el-select v-model="page.recording" placeholder="请选择"> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
background: #ffffff; |
|
|
|
padding-left: 18px; |
|
|
|
display: flex; |
|
|
|
padding-top: 18px; |
|
|
|
" |
|
|
|
> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button |
|
|
|
@click="screening()" |
|
|
|
style="background: #2671e2; color: #ffffff" |
|
|
|
>筛选</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button @click="empty()">清空筛选条件</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="tablebox" v-if="activeTotal == 1"> |
|
|
|
<template> |
|
|
|
<el-table :data="tableData" style="width: 100%"> |
|
|
|
<el-table-column prop="index" label="序号" width="100" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="imei" label="设备编号" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="agentName" label="领用人" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<!-- <el-table-column--> |
|
|
|
<!-- prop="id"--> |
|
|
|
<!-- label="接待记录ID"--> |
|
|
|
<!-- align="center">--> |
|
|
|
<!-- </el-table-column>--> |
|
|
|
|
|
|
|
<el-table-column prop="staTime" label="指派时间" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endTime" label="结束时间" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.endTime.substring(0, 19) }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="recordingName" label="录音结果" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="recordingReasonName" |
|
|
|
label="未完整录音原因" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="" label="操作" align="center"> |
|
|
|
<template slot-scope="{ row }"> |
|
|
|
<el-button |
|
|
|
v-if="row.recording != 0" |
|
|
|
@click.native.prevent="goinfo(row)" |
|
|
|
type="text" |
|
|
|
size="small" |
|
|
|
>接待详情</el-button |
|
|
|
> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</template> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:current-page="currentPage4" |
|
|
|
:page-sizes="[6, 10, 14, 20]" |
|
|
|
:page-size="6" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="page.total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
activeTotal: 0, |
|
|
|
customtime: "", |
|
|
|
tableData: [], |
|
|
|
currentPage4: 1, |
|
|
|
houseList: [], |
|
|
|
flag: false, |
|
|
|
page: { |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 6, |
|
|
|
openTime: "", |
|
|
|
closeTime: "", |
|
|
|
houseName: "", |
|
|
|
accountName: "", |
|
|
|
imei: "", |
|
|
|
total:10, |
|
|
|
recording: "", |
|
|
|
}, |
|
|
|
options: [ |
|
|
|
{ |
|
|
|
value: "0", |
|
|
|
label: "无录音", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: "1", |
|
|
|
label: "部分录音", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: "2", |
|
|
|
label: "完整录音", |
|
|
|
}, |
|
|
|
], |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
return |
|
|
|
let theRequest=this.$route.query |
|
|
|
console.log(theRequest, "123"); //此时的theRequest就是我们需要的参数; |
|
|
|
if (theRequest.houseId) { |
|
|
|
this.activeTotal = theRequest.flag; |
|
|
|
this.flag = true; |
|
|
|
this.page.openTime = theRequest.startDate; |
|
|
|
this.page.closeTime = theRequest.endDate; |
|
|
|
this.customtime = [theRequest.startDate, theRequest.endDate]; |
|
|
|
this.page.houseName = theRequest.houseId; |
|
|
|
} else { |
|
|
|
let num = 24 * 3600 * 1000 * 6; |
|
|
|
let time1 = this.timestampToTime(new Date().getTime() - num); |
|
|
|
console.log(this.timestampToTime(new Date().getTime()), time1); |
|
|
|
this.page.openTime = time1.trim(); |
|
|
|
this.page.closeTime = this.timestampToTime(new Date().getTime()).trim(); |
|
|
|
this.customtime = [this.page.openTime, this.page.closeTime]; |
|
|
|
} |
|
|
|
|
|
|
|
// this.activeTotal=0; |
|
|
|
// this.customtime=[] ; |
|
|
|
this.tableData = []; |
|
|
|
this.tableData1 = []; |
|
|
|
this.getHouseList(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
timestampToTime(timestamp) { |
|
|
|
var date = new Date(timestamp); //时间戳为10位需*1000,时间戳为13位的话不需乘1000 |
|
|
|
// var date = new Date(timestamp * 1000);//时间戳为10位需*1000,时间戳为13位的话不需乘1000 |
|
|
|
|
|
|
|
var yyyy = date.getFullYear() + "-"; |
|
|
|
|
|
|
|
var MM = |
|
|
|
(date.getMonth() + 1 < 10 |
|
|
|
? "0" + (date.getMonth() + 1) |
|
|
|
: date.getMonth() + 1) + "-"; |
|
|
|
|
|
|
|
// var dd = date.getDate() + ' '; |
|
|
|
var dd = |
|
|
|
(date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " "; |
|
|
|
|
|
|
|
// var HH = date.getHours() + ':'; |
|
|
|
// var HH = (date.getHours() < 10 ? '0'+(date.getHours()) : date.getHours()) + ':'; |
|
|
|
// |
|
|
|
// // var mm = date.getMinutes() + ':'; |
|
|
|
// var mm = (date.getMinutes() < 10 ? '0'+(date.getMinutes()) : date.getMinutes()) + ':'; |
|
|
|
// |
|
|
|
// // var ss = date.getSeconds(); |
|
|
|
// var ss = (date.getSeconds() < 10 ? '0'+(date.getSeconds()) : date.getSeconds()); |
|
|
|
|
|
|
|
// return yyyy+MM+dd+HH+mm+ss; |
|
|
|
return yyyy + MM + dd; |
|
|
|
}, |
|
|
|
//时间补0 |
|
|
|
Zeropadding(s) { |
|
|
|
return s < 10 ? "0" + s : s; |
|
|
|
}, |
|
|
|
tapclickyab(i) { |
|
|
|
this.activeTotal = i; |
|
|
|
this.getTableList(); |
|
|
|
}, |
|
|
|
screening() { |
|
|
|
this.page.pageNum = 1; |
|
|
|
this.page.pageSize = 6; |
|
|
|
this.getTableList(); |
|
|
|
}, |
|
|
|
goinfo(row) { |
|
|
|
console.log(row); |
|
|
|
location.href = "${jypath}/zk/file/receptionDetails"; |
|
|
|
localStorage.setItem("AudioListId", row.id); |
|
|
|
localStorage.setItem("AudioIdx", 0); |
|
|
|
}, |
|
|
|
empty() { |
|
|
|
this.page = { |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 6, |
|
|
|
openTime: "", |
|
|
|
closeTime: "", |
|
|
|
houseName: this.houseList[0].id, |
|
|
|
accountName: "", |
|
|
|
imei: "", |
|
|
|
total: "", |
|
|
|
}; |
|
|
|
this.customtime = ""; |
|
|
|
this.getTableList(); |
|
|
|
}, |
|
|
|
//时间选择 |
|
|
|
confirmtime() { |
|
|
|
console.log(this.customtime); |
|
|
|
// const d = new Date(this.customtime[0]) |
|
|
|
// this.page.openTime = d.getFullYear() + '-' + this.Zeropadding((d.getMonth() + 1)) + '-' + this.Zeropadding(d.getDate()) |
|
|
|
// const c = new Date(this.customtime[1]) |
|
|
|
// this.page.closeTime = c.getFullYear() + '-' + this.Zeropadding((c.getMonth() + 1)) + '-' + this.Zeropadding(c.getDate()) |
|
|
|
this.page.openTime = this.customtime[0]; |
|
|
|
this.page.closeTime = this.customtime[1]; |
|
|
|
}, |
|
|
|
handleSizeChange(val) { |
|
|
|
console.log("每页条" + val); |
|
|
|
this.page.pageSize = val; |
|
|
|
this.getTableList(); |
|
|
|
}, |
|
|
|
handleCurrentChange(val) { |
|
|
|
console.log("当前页" + val); |
|
|
|
this.page.pageNum = val; |
|
|
|
this.getTableList(); |
|
|
|
}, |
|
|
|
//获取楼盘数据 |
|
|
|
getHouseList() { |
|
|
|
axios({ |
|
|
|
url: `${jypath}/equipment/onlinerecord/findAllProperties`, |
|
|
|
method: "get", |
|
|
|
}).then((res) => { |
|
|
|
// console.log(res.data.obj) |
|
|
|
if (res.data.res == 1) { |
|
|
|
this.houseList = res.data.obj; |
|
|
|
if (!this.flag) { |
|
|
|
this.page.houseName = res.data.obj[0].id; |
|
|
|
} |
|
|
|
this.getTableList(); |
|
|
|
// res.data.obj.results.forEach((item,index)=>{ |
|
|
|
// item.index=index+1 |
|
|
|
// }) |
|
|
|
// this.tableData=res.data.obj.results; |
|
|
|
// this.page.total = res.data.obj.totalRecord; |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
//获取table数据、 |
|
|
|
getTableList() { |
|
|
|
console.log(this.activeTotal, "888888888888888888888"); |
|
|
|
var url = ""; |
|
|
|
let obj = { |
|
|
|
pageNum: this.page.pageNum, |
|
|
|
pageSize: this.page.pageSize, |
|
|
|
imei: this.page.imei, |
|
|
|
}; |
|
|
|
this.tableData = []; |
|
|
|
if (this.activeTotal == 0) { |
|
|
|
url = `${jypath}/equipment/onlinerecord/findByPage`; |
|
|
|
obj.openTime = this.page.openTime; |
|
|
|
obj.closeTime = this.page.closeTime; |
|
|
|
obj.houseId = this.page.houseName; |
|
|
|
obj.accountName = this.page.accountName; |
|
|
|
} else { |
|
|
|
url = `${jypath}/equipment/onlinerecord/assignmentRecord`; |
|
|
|
obj.staDate = this.page.openTime; |
|
|
|
obj.endDate = this.page.closeTime; |
|
|
|
obj.projectId = this.page.houseName; |
|
|
|
obj.agentName = this.page.accountName; |
|
|
|
obj.recording = this.page.recording; |
|
|
|
} |
|
|
|
axios({ |
|
|
|
url: url, |
|
|
|
method: "post", |
|
|
|
data: obj, |
|
|
|
}).then((res) => { |
|
|
|
// console.log(res) |
|
|
|
if (res.data.res == 1) { |
|
|
|
if (!res.data.obj.results) return; |
|
|
|
res.data.obj.results.forEach((item, index) => { |
|
|
|
item.index = index + 1; |
|
|
|
}); |
|
|
|
this.tableData = res.data.obj.results; |
|
|
|
this.page.total = res.data.obj.totalRecord; |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped > |
|
|
|
.toptab { |
|
|
|
width: 100%; |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
.toptab div { |
|
|
|
padding-left: 30px; |
|
|
|
padding-right: 30px; |
|
|
|
padding-top: 10px; |
|
|
|
padding-bottom: 10px; |
|
|
|
font-size: 14px; |
|
|
|
} |
|
|
|
.activecllasscet { |
|
|
|
color: #ffffff; |
|
|
|
} |
|
|
|
.titlebox { |
|
|
|
width: 100%; |
|
|
|
background: #ffffff; |
|
|
|
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04); |
|
|
|
border-radius: 8px; |
|
|
|
margin-top: 20px; |
|
|
|
padding-bottom: 18px; |
|
|
|
} |
|
|
|
.tablebox { |
|
|
|
width: 100%; |
|
|
|
background: #ffffff; |
|
|
|
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04); |
|
|
|
border-radius: 8px; |
|
|
|
margin-top: 20px; |
|
|
|
padding: 18px; |
|
|
|
} |
|
|
|
</style> |