From 39880bb3cd54d412a0ed8f73f0c82005dbbbee44 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Thu, 07 Mar 2024 15:07:42 +0800
Subject: [PATCH] fix:断线统计修改
---
src/views/onlineRate/index.vue | 137 +++++++++++++++++++++++++++++++++------------
1 files changed, 99 insertions(+), 38 deletions(-)
diff --git a/src/views/onlineRate/index.vue b/src/views/onlineRate/index.vue
index 3c664be..de31d70 100644
--- a/src/views/onlineRate/index.vue
+++ b/src/views/onlineRate/index.vue
@@ -7,7 +7,7 @@
class="demo-form-inline"
>
<el-form-item label="������������:">
- <el-select
+ <!-- <el-select
v-model="formInline.organizationId"
placeholder="������������"
>
@@ -17,23 +17,16 @@
:label="item.name"
:value="item.id"
/>
- </el-select>
- </el-form-item>
- <el-form-item label="������������:">
- <el-select
- v-model="formInline.hourState"
+ </el-select> -->
+ <el-cascader
+ ref="cascader"
+ :show-all-levels="false"
+ :options="orgData"
+ collapse-tags
+ :props="props"
clearable
- placeholder="������������"
- >
- <el-option
- label="������"
- value="1"
- />
- <el-option
- label="������"
- value="0"
- />
- </el-select>
+ @change="changeCascader"
+ />
</el-form-item>
<el-form-item>
<el-radio-group
@@ -52,11 +45,29 @@
type="datetimerange"
range-separator="���"
start-placeholder="������������"
+ :clearable="false"
end-placeholder="������������"
value-format="yyyy-MM-dd HH:mm:ss"
+ :default-date="[selectTime[0], selectTime[1]]"
:picker-options="pickerOptions"
- @change="changeDay"
+ @change="changeDay()"
/>
+ </el-form-item>
+ <el-form-item label="������������:">
+ <el-select
+ v-model="formInline.hourState"
+ clearable
+ placeholder="������������"
+ >
+ <el-option
+ label="������"
+ value="1"
+ />
+ <el-option
+ label="������"
+ value="0"
+ />
+ </el-select>
</el-form-item>
<el-form-item>
<el-button
@@ -69,7 +80,7 @@
</el-form>
</div>
<div>
- <p>���������������������<span class="greenClor">{{ tableData.length }}</span>������������<span class="greenClor">{{ onlineData }}</span>��������������� <span :class=" onlineRate<90 ?'redClor':'greenClor'">{{ onlineRate }}%</span></p>
+ <p>���������������������<span class="greenClor">{{ macOnlineData.sum }}</span>������������<span class="greenClor">{{ macOnlineData.online }}</span>��������������� <span :class="Number(macOnlineData.onlineRate)<90 ?'redClor':'greenClor'">{{ macOnlineData.onlineRate }}%</span></p>
<div>
<el-table
v-loading="loading"
@@ -207,16 +218,18 @@
data () {
return {
formInline: {
- organizationId: '',
+ macs: [],
hourState: '',
state: '',
- startTime: dayjs().startOf('day').format('YYYY-MM-DD HH:mm'),
- endTime: dayjs().subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
+ startTime: '',
+ endTime: ''
},
time: '������',
- selectTime: '',
+ selectTime: [],
macDate: {},
+ macOnlineData: {},
orgData: [],
+ props: { multiple: true, label: 'name', value: 'id', children: 'monitorPoint' },
tableData: [],
handleShow: false,
loading: false,
@@ -259,55 +272,88 @@
return this.tableData.filter(item => item.state !== '0').length || 0
},
onlineRate () {
- return Math.floor((this.onlineData / this.tableData.length) * 100) || 0
+ return (this.onlineData / this.tableData.length) * 100 || 0
}
},
watch: {
time (newValue, oldValue) {
let now = dayjs() // ������������������
if (newValue === '���1���') {
- this.selectTime = []
+ this.$set(this.selectTime, 0, new Date(now.subtract(1, 'day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(now.format('YYYY-MM-DD HH:mm')))
+ this.formInline.endTime = now.subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
this.formInline.startTime = now.subtract(1, 'day').format('YYYY-MM-DD HH:mm') // ���������������������
} else if (newValue === '���3���') {
- this.selectTime = []
+ this.$set(this.selectTime, 0, new Date(now.subtract(3, 'day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(now.format('YYYY-MM-DD HH:mm')))
+ this.formInline.endTime = now.subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
this.formInline.startTime = now.subtract(3, 'day').format('YYYY-MM-DD HH:mm') // ���������������������
} else if (newValue === '���5���') {
- this.selectTime = []
+ this.$set(this.selectTime, 0, new Date(now.subtract(5, 'day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(now.format('YYYY-MM-DD HH:mm')))
+ this.formInline.endTime = now.subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
this.formInline.startTime = now.subtract(5, 'day').format('YYYY-MM-DD HH:mm') // ���������������������
} else if (newValue === '���7���') {
- this.selectTime = []
+ this.$set(this.selectTime, 0, new Date(now.subtract(7, 'day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(now.format('YYYY-MM-DD HH:mm')))
+ this.formInline.endTime = now.subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
this.formInline.startTime = now.subtract(7, 'day').format('YYYY-MM-DD HH:mm') // ���������������������
} else if (newValue === '������') {
- this.selectTime = []
+ this.$set(this.selectTime, 0, new Date(dayjs().startOf('day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(now.format('YYYY-MM-DD HH:mm')))
+ this.formInline.endTime = now.subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
console.log('000', dayjs().startOf('day').format('YYYY-MM-DD HH:mm'))
this.formInline.startTime = dayjs().startOf('day').format('YYYY-MM-DD HH:mm')
}
}
},
- created () {
+ mounted () {
this.getOrganizationId()
+ this.$set(this.selectTime, 0, new Date(dayjs().startOf('day').format('YYYY-MM-DD HH:mm')))
+ this.$set(this.selectTime, 1, new Date(dayjs().format('YYYY-MM-DD HH:mm')))
+ },
+ created () {
+
},
methods: {
+ changeCascader (val) {
+ let nodesInfo = this.$refs['cascader'].getCheckedNodes()
+ let macList = nodesInfo.map(({ data: { mac } }) => mac)
+ this.formInline.macs = macList.filter(item => item !== undefined)
+ console.log(macList)
+ },
changeDay () {
- console.log(this.selectTime)
- this.formInline.startTime = this.selectTime[0]
- this.formInline.endTime = this.selectTime[1]
+ console.log('this.selectTime', this.selectTime)
+ if (this.selectTime !== null) {
+ console.log(this.selectTime)
+ this.formInline.startTime = this.selectTime[0]
+
+ if (dayjs(this.selectTime[1]).format('YYYY-MM-DD HH') === dayjs().format('YYYY-MM-DD HH')) {
+ this.formInline.endTime = dayjs(this.selectTime[1]).subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
+ } else {
+ this.formInline.endTime = dayjs(this.selectTime[1]).startOf('day').format('YYYY-MM-DD HH:mm')
+ }
+ }
+ console.log('this.formInline12', this.formInline)
this.time = ''
},
handleDetail (row) {
- console.log(row)
this.handleShow = true
this.macDate = _.cloneDeep(row)
- this.macDate.startTime = this.formInline.startTime
- this.macDate.endTime = this.formInline.endTime
+ this.macDate.startTime = this.selectTime[0]
+ this.macDate.endTime = this.selectTime[1]
+ console.log(this.macDate)
},
handleSearch () {
- if (this.formInline.organizationId !== '') {
+ console.log(' this.formInline', this.formInline)
+ if (this.formInline.macs.length > 0) {
if (this.time === '������') {
+ console.log('������������')
this.formInline.startTime = dayjs().startOf('day').format('YYYY-MM-DD HH:mm')
this.formInline.endTime = dayjs().subtract(1, 'hour').format('YYYY-MM-DD HH:mm')
}
this.loading = true
+ this.getOnlineData()
this.$request({
url: '/onlineRate/page',
method: 'post',
@@ -326,9 +372,24 @@
this.$message.warning('���������������������������')
}
},
+ getOnlineData () {
+ this.$request({
+ url: '/onlineRate/state',
+ method: 'post',
+ data: {
+ macs: this.formInline.macs
+ }
+ })
+ .then(res => {
+ this.macOnlineData = res.data
+ })
+ .catch(err => {
+ console.log(err)
+ })
+ },
getOrganizationId () {
this.$request({
- url: '/organization/getOrganizationId',
+ url: '/organization/queryDevices',
method: 'get'
})
.then(res => {
--
Gitblit v1.8.0