From f3a8b27eb23c940dcd67bd459b76b0457fcb8b46 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Thu, 13 Jun 2024 13:29:49 +0800 Subject: [PATCH] fix: 样式修改 --- src/views/onlineRate/index.vue | 94 ++++++++++++++++++++++++++++++++++------------ 1 files changed, 69 insertions(+), 25 deletions(-) diff --git a/src/views/onlineRate/index.vue b/src/views/onlineRate/index.vue index abe1530..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,7 +17,16 @@ :label="item.name" :value="item.id" /> - </el-select> + </el-select> --> + <el-cascader + ref="cascader" + :show-all-levels="false" + :options="orgData" + collapse-tags + :props="props" + clearable + @change="changeCascader" + /> </el-form-item> <el-form-item> <el-radio-group @@ -36,10 +45,12 @@ 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="������������:"> @@ -207,17 +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, @@ -267,49 +279,81 @@ 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 () { - this.getOnlineData() - 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', @@ -331,9 +375,9 @@ getOnlineData () { this.$request({ url: '/onlineRate/state', - method: 'get', - params: { - organizationId: this.formInline.organizationId + method: 'post', + data: { + macs: this.formInline.macs } }) .then(res => { @@ -345,7 +389,7 @@ }, getOrganizationId () { this.$request({ - url: '/organization/getOrganizationId', + url: '/organization/queryDevices', method: 'get' }) .then(res => { -- Gitblit v1.8.0