From a7867570291d90f50226a01cdb9fa6b8aed69c30 Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Tue, 08 Apr 2025 16:57:48 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue | 171 ++++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 128 insertions(+), 43 deletions(-)
diff --git a/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue b/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
index ec8beda..1706c28 100644
--- a/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
+++ b/src/views/Home/EventOverviewDetail/EventOverviewDetailRight.vue
@@ -1,60 +1,66 @@
<template>
<div class="right">
<div>工单列表</div>
-
<div>
<el-date-picker
+ style="width: 100%"
v-model="timeArr"
type="daterange"
- value-format="YYYY-MM-DD"
+ :value-format="timeFormat"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
- @change="change"
- disabled
+ @change="timeChange"
/>
- <el-select v-model="params.device_sn" placeholder="请选择" size="large" filterable clearable>
- <el-option
- v-for="item in deviceList"
- :label="item.nickname"
- :value="item.device_sn"
- :key="item.device_sn"
- />
- </el-select>
+ </div>
- <el-select
- v-model="params.word_order_type"
- placeholder="请选择"
- size="large"
- filterable
- clearable
- >
- <el-option
- v-for="item in workOrderType"
- :label="item.dictValue"
- :value="item.dictKey"
- :key="item.dictKey"
- />
- </el-select>
- <div>
- <div v-for="item in statusList">
- <div>{{ item.name }}</div>
- <div>{{ item.num || 0 }}</div>
+ <el-select style="width: 100%" v-model="params.device_sn" placeholder="机巢" filterable clearable @change="getList">
+ <el-option v-for="item in deviceList" :label="item.nickname" :value="item.device_sn" :key="item.device_sn" />
+ </el-select>
+ <el-select v-model="params.word_order_type" placeholder="工单类型" filterable clearable @change="getList">
+ <el-option v-for="item in workOrderType" :label="item.dictValue" :value="item.dictKey" :key="item.dictKey" />
+ </el-select>
+ <div class="statusList">
+ <div v-for="item in statusList" @click="statusClick(item)" :class="{ active: item.active }">
+ <div>{{ item.name }}</div>
+ <div>{{ item.num || 0 }}</div>
+ </div>
+ </div>
+
+ <el-checkbox-group v-model="params.eventKeys" @change="getList">
+ <el-checkbox
+ v-for="item in eventList"
+ :label="item.name + ' ' + item.value"
+ :value="item.status"
+ :key="item.dictKey"
+ />
+ </el-checkbox-group>
+
+ <div class="eventList">
+ <div class="eventListItem" v-for="item in list">
+ <img class="eventListItemImg" :src="item.photo_url" alt="" />
+ <div class="eventListItemText">
+ <div class="eventListItemName">{{ item.event_name }}</div>
+ <div class="eventListItemTime">{{ item.create_time }}</div>
</div>
</div>
-
- <el-checkbox-group v-model="params.SFType">
- <el-checkbox v-for="item in SFDictList" :label="item.dictValue":value="item.dictKey" :key="item.dictKey"/>
- </el-checkbox-group>
-
</div>
+
+ <el-pagination
+ background
+ v-model:current-page="params.current"
+ v-model:page-size="params.size"
+ layout="total, prev, pager, next"
+ :total="total"
+ @change="pageChange"
+ />
</div>
</template>
<script setup>
import dayjs from 'dayjs'
import { selectDevicePage } from '@/api/home/machineNest'
import { getMultipleDictionary } from '@/api/system/dictbiz'
-import { getEventStatusNum } from '@/api/home/event'
+import { getEvenNum, getEventPage, getEventStatusNum, getEventTrend } from '@/api/home/event'
const timeFormat = 'YYYY-MM-DD HH:mm:ss'
const today = dayjs().format(timeFormat)
@@ -62,40 +68,91 @@
const timeArr = ref([oneWeekAgo, today])
const deviceList = ref([])
+const total = ref(0)
const params = ref({
- device_sn: '',
- word_order_type: '',
- SFType:[]
+ start_date: timeArr.value[0],
+ end_date: timeArr.value[1],
+ device_sn: undefined,
+ word_order_type: undefined,
+ status: undefined,
+ eventKeys: [],
+ current: 1,
+ size: 10,
})
+
+const statusClick = row => {
+ params.value.status = row.id || undefined
+ statusList.value = statusList.value.map(item => ({
+ ...item,
+ active: item.name === row.name,
+ }))
+ getList()
+}
const getDeviceList = async () => {
const res = await selectDevicePage({ current: 1, size: 99999, type: 1 })
deviceList.value = res.data?.data?.records || []
}
+// 工单类型
const workOrderType = ref([])
-const SFDictList = ref([])
const getDictList = () => {
getMultipleDictionary('WORK_ORDER_TYPE,SF').then(res => {
workOrderType.value = res.data.data?.['WORK_ORDER_TYPE'] || []
- SFDictList.value = res.data.data?.['SF'] || []
})
}
+// 事件状态+数量
const statusList = ref([])
const getEventStatusNumFun = () => {
const [start_date, end_date] = timeArr.value
getEventStatusNum({ start_date, end_date }).then(res => {
- statusList.value = res.data?.data || []
+ statusList.value = (res.data?.data || []).map(i => ({ ...i, active: false }))
+ statusList.value[0].active = true
})
}
-const change = value => {}
+// 事件+数量
+const eventList = ref([])
+const getEventList = () => {
+ const [start_date, end_date] = timeArr.value
+ getEvenNum({ start_date, end_date }).then(res => {
+ eventList.value = res.data.data
+ })
+}
+
+const timeChange = value => {
+ const [start_date, end_date] = timeArr.value
+ params.value.start_date = start_date
+ params.value.end_date = end_date
+ // 重置
+ getEventStatusNumFun()
+ getEventList()
+ params.value.status = undefined
+ params.value.eventKeys = undefined
+ getList()
+}
+
+const pageChange = val => {
+ params.value.current = val
+ getList()
+}
+
+const list = ref([])
+const getList = () => {
+ getEventPage(params.value).then(res => {
+ const resData = res.data.data
+ list.value = resData?.records || []
+ total.value = resData.total
+ })
+}
onMounted(() => {
getDeviceList()
getDictList()
getEventStatusNumFun()
+ getEventList()
+ getList()
})
</script>
<style scoped lang="scss">
@@ -110,5 +167,33 @@
height: 900px;
width: 400px;
background: white;
+ font-size: 18px;
+
+ .statusList {
+ display: flex;
+ flex-wrap: wrap;
+
+ .active {
+ background: #19ad8d;
+ }
+ }
+
+ .eventList {
+ display: flex;
+ flex-wrap: wrap;
+
+ .eventListItem {
+ .eventListItemImg {
+ width: 120px;
+ height: 100px;
+ }
+
+ .eventListItemText {
+ display: flex;
+ justify-content: space-between;
+ font-size: 16px;
+ }
+ }
+ }
}
</style>
--
Gitblit v1.9.3