首页

src/api/dashboard/index.ts

@@ -30,6 +30,18 @@ getPlan: async () => {
   getDevice: async () => {
     return await request.get({ url: `/mes/dashboard/getDevice` })
   },
+  getMold: async () => {
+    return await request.get({ url: `/mes/dashboard/getMold` })
+  },
+  getTodoList: async () => {
+    return await request.get({ url: `/mes/dashboard/getTodoList` })
+  },
+  getDeviceOperationalStatus: async () => {
+    return await request.get({ url: `/iot/device/getDeviceOperationalStatus` })
+  },
+  getDeviceRepairLineOptions: async () => {
+    return await request.get({ url: `/mes/dashboard/getDeviceRepairLineOptions` })
+  },
 
 }
 

src/locales/zh-CN.ts

@@ -453,7 +453,7 @@ export default {
   basedata: {
     product: {
       category:{
-name:'分类名称',
+            name:'分类名称',
       }
     },
     

src/views/Home/Index.vue

@@ -119,10 +119,10 @@ v-model="productionOverviewRange" type="daterange" unlink-panels value-format="Y
 						<el-col v-for="item in group" :key="item.id" :xl="6" :lg="6" :md="12" :sm="12" :xs="24">
 							<div class="todo-card">
 								<div class="todo-title">{{ item.name }}</div>
-								<div class="todo-sub">任务编号：{{ item.id }}</div>
-								<div class="todo-sub">任务类型：{{ item.type }}｜优先级：{{ item.priority }}</div>
-								<div class="todo-sub">计划时间：{{ item.planTime }}</div>
-								<div class="todo-sub">责任部门：{{ item.owner }}</div>
+								<div class="todo-sub">任务编号：{{ item.code }}</div>
+								<div class="todo-sub">任务类型：{{ item.type }}</div>
+								<div class="todo-sub">目标：{{ item.deviceName }}</div>
+								<div class="todo-sub">创建时间：{{ formatDate(item.createTime) }}</div>
 							</div>
 						</el-col>
 					</el-row>
@@ -155,7 +155,7 @@ v-model="productionOverviewRange" type="daterange" unlink-panels value-format="Y
 						<div class="section-title">模具</div>
 					</div>
 					<el-row :gutter="12" class="mt-16px">
-						<el-col v-for="item in alarmStatusCards" :key="item.key" :span="8">
+						<el-col v-for="item in moldStatusCards" :key="item.key" :span="8">
 							<div class="mini-card" :class="item.level">
 								<div class="mini-label">{{ item.label }}</div>
 								<div class="mini-value">{{ item.value }}</div>
@@ -174,30 +174,60 @@ v-model="deviceOverviewRange" type="daterange" unlink-panels value-format="YYYY-
 						start-placeholder="开始日期" end-placeholder="结束日期" size="small" />
 				</div> -->
 			</div>
-			<el-row class="device-overview-row" :gutter="0">
-				<el-col v-for="item in deviceOverviewTop" :key="item.key" :span="2">
+			<el-row class="device-overview-row" :gutter="0" v-model = "formData">
+				<el-col :span="2">
 					<div class="device-overview-item">
-						<div class="production-overview-label">{{ item.label }}</div>
-						<div class="production-overview-value production-overview-value-primary">{{ item.value }}</div>
+						<div class="production-overview-label">总设备数</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.totalDevices }}</div>
 					</div>
 				</el-col>
-				<el-col v-for="item in deviceOverviewBottom" :key="item.key" :span="2">
+				<el-col :span="2">
 					<div class="device-overview-item">
-						<div class="production-overview-label">{{ item.label }}</div>
-						<div class="production-overview-value production-overview-value-primary">{{ item.value }}</div>
+						<div class="production-overview-label">运行</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.runningCount }}</div>
+					</div>
+				</el-col>
+				<el-col :span="2">
+					<div class="device-overview-item">
+						<div class="production-overview-label">待机中</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.standbyCount }}</div>
+					</div>
+				</el-col>
+				<el-col :span="2">
+					<div class="device-overview-item">
+						<div class="production-overview-label">故障中</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.faultCount }}</div>
+					</div>
+				</el-col>
+				<el-col :span="2">
+					<div class="device-overview-item">
+						<div class="production-overview-label">报警中</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.warningCount }}</div>
+					</div>
+				</el-col>
+				<el-col :span="2">
+					<div class="device-overview-item">
+						<div class="production-overview-label">利用率</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.utilizationRate }}</div>
+					</div>
+				</el-col>
+				<el-col :span="2">
+					<div class="device-overview-item">
+						<div class="production-overview-label">故障率</div>
+						<div class="production-overview-value production-overview-value-primary">{{ formData?.faultRate }}</div>
 					</div>
 				</el-col>
 			</el-row>
 		</el-card>
 		<el-row :gutter="16" class="home-section">
-			<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-16px">
+			<el-col :xl="12" :lg="8" :md="24" :sm="24" :xs="24" class="mb-16px">
 				<el-card shadow="never">
 					<template #header>
 						<div class="h-3 flex justify-between">
 							<span>设备维修数量统计</span>
 						</div>
 					</template>
-					<Echart :options="deviceRepairLineOptionsData" :height="260" />
+					<Echart :options="deviceRepairLineOptions" :height="260" />
 				</el-card>
 			</el-col>
 			<el-col :xl="8" :lg="8" :md="24" :sm="24" :xs="24" class="mb-16px">
@@ -298,23 +328,16 @@ import type {
 	Shortcut,
 	ProductionOverview,
 	ProductionProgressItem,
-	DeviceStatusSummary,
-	AlarmStatusSummary,
 	DeviceOverview,
-	TodoTask
+	TodoTask,
+	DeviceOperationStatus
 } from './types'
 import {
 	pieOptions,
 	barOptions,
-	deviceRepairLineOptions,
 	deviceCategoryPieOptions,
 	deviceDistributionBarOptions,
-	productionOverviewMock,
-	productionProgressMock,
-	deviceStatusMock,
-	alarmStatusMock,
 	deviceOverviewMock,
-	todoTasksMock
 } from './echarts-data'
 import { HomeApi } from '@/api/home/info'
 import { WeatherVO } from '@/api/home/info'
@@ -330,28 +353,21 @@ const loading = ref(true)
 const avatar = userStore.getUser.avatar
 const username = userStore.getUser.nickname
 const pieOptionsData = reactive<EChartsOption>(pieOptions) as EChartsOption
-const deviceRepairLineOptionsData = reactive<EChartsOption>(
-	deviceRepairLineOptions
-) as EChartsOption
+
+
+
+
 const deviceCategoryPieOptionsData = reactive<EChartsOption>(
 	deviceCategoryPieOptions
 ) as EChartsOption
 const deviceDistributionBarOptionsData = reactive<EChartsOption>(
 	deviceDistributionBarOptions
 ) as EChartsOption
-const productionOverview = ref<ProductionOverview>(productionOverviewMock)
+
 const productionOverviewRange = ref<string[]>([])
 const deviceOverview = ref<DeviceOverview>(deviceOverviewMock)
-const deviceOverviewRange = ref<string[]>([])
-const productionProgressTab = ref('all')
-const productionProgressList = ref<ProductionProgressItem[]>()
-
-const todoTaskList = ref<TodoTask[]>(todoTasksMock)
-const deviceStatus = ref<DeviceStatusSummary>(deviceStatusMock)
-const alarmStatus = ref<AlarmStatusSummary>(alarmStatusMock)
-const filteredProductionProgressList = computed(() => {
-	return productionProgressList.value
-})
+
+
 const formatPercent = (value: number | undefined | null) => {
 	if (value === null || value === undefined) return '0%'
 	if (Number.isNaN(value)) return '0%'
@@ -364,6 +380,8 @@ const productionOverviewCenter = ref([])
 
 const plan = ref<ProductionProgressItem[]>([])
 
+const todo = ref<TodoTask[]>([])
+
 // const productionOverviewRight = computed(() => [
 // 	{
 // 		key: 'attendanceCount',
@@ -437,46 +455,7 @@ const deviceOverviewBottom = computed(() => [
 		value: 0
 	}
 ])
-// const deviceStatusCards = computed(() => [
-// 	{
-// 		key: 'inactive',
-// 		label: '非活动',
-// 		value: deviceStatus.value.inactive,
-// 		level: 'mini-danger'
-// 	},
-// 	{
-// 		key: 'active',
-// 		label: '活动',
-// 		value: deviceStatus.value.active,
-// 		level: 'mini-normal'
-// 	},
-// 	{
-// 		key: 'total',
-// 		label: '总数',
-// 		value: deviceStatus.value.total,
-// 		level: 'mini-total'
-// 	}
-// ])
-const alarmStatusCards = computed(() => [
-	{
-		key: 'serious',
-		label: '严重',
-		value: alarmStatus.value.serious,
-		level: 'mini-danger'
-	},
-	{
-		key: 'assignedToMe',
-		label: '分配给我',
-		value: alarmStatus.value.assignedToMe,
-		level: 'mini-normal'
-	},
-	{
-		key: 'total',
-		label: '总数',
-		value: alarmStatus.value.total,
-		level: 'mini-total'
-	}
-])
+
 const groupBySize = <T,>(list: T[], size: number) => {
 	const result: T[][] = []
 	for (let i = 0; i < list.length; i += size) {
@@ -485,7 +464,7 @@ const groupBySize = <T,>(list: T[], size: number) => {
 	return result
 }
 
-const todoTaskGroups = computed(() => groupBySize(todoTaskList.value, 4))
+
 // 获取统计数
 let totalSate = reactive<WorkplaceTotal>({
 	project: 0,
@@ -499,7 +478,42 @@ const todayWeather = ref({} as WeatherVO)
 let weatherCity = ""
 const production = ref({} as DashboardProductVO)
 const productionProgressGroups = computed(() => groupBySize(plan.value, 3))
+const todoTaskGroups = computed(() => groupBySize(todo.value, 4))
 const deviceStatusCards = ref<DeviceStatusVO[]>([])
+const moldStatusCards = ref<DeviceStatusVO[]>([])
+const formData = ref<DeviceOperationStatus>()
+const deviceRepairLineOptions = ref<EChartsOption>({
+  title: {
+    text: '设备维修数量统计',
+    left: 'center'
+  },
+  tooltip: {
+    trigger: 'axis'
+  },
+  grid: {
+    left: 40,
+    right: 20,
+    bottom: 30,
+    top: 60,
+    containLabel: true
+  },
+  xAxis: {
+    type: 'category',
+    boundaryGap: false,
+    data: ['一月', '二月', '三月', '四月', '五月', '六月']
+  },
+  yAxis: {
+    type: 'value'
+  },
+  series: [
+    {
+      name: '维修数量',
+      type: 'line',
+      smooth: true,
+      data: [3, 5, 4, 6, 8, 7]
+    }
+  ]
+})
 /** 初始化 **/
 onMounted(async () => {
 	// 加载
@@ -513,6 +527,12 @@ onMounted(async () => {
 	production.value = await DashboardApi.getProduction(productionOverviewRange)
 	plan.value = await DashboardApi.getPlan()
 	deviceStatusCards.value = await DashboardApi.getDevice()
+	moldStatusCards.value = await DashboardApi.getMold()
+	todo.value = await DashboardApi.getTodoList()
+	formData.value = await  DashboardApi.getDeviceOperationalStatus()
+	const Options = await DashboardApi.getDeviceRepairLineOptions()
+	deviceRepairLineOptions.value.xAxis.data = Options.xaxis
+	deviceRepairLineOptions.value.series[0].data =  Options.series
   productionOverviewLeft.value = production.value.taskItems
 	productionOverviewCenter.value = production.value.planItems
 
@@ -521,8 +541,10 @@ onMounted(async () => {
 const getPlanStatusLabel = (value: any) => {
   const v = value === '' || value === null || value === undefined ? undefined : String(value)
   if (v == '1') return '已排产'
-  if (v == '2') return '试产'
-  if (v == '3') return '量产'
+  if (v == '6') return '试产'
+  if (v == '2') return '量产'
+	if (v == '3') return '暂停'
+	if (v == '4') return '待入库'
   return '-'
 }
 const getPlanStatusTagType = (value: any) => {

src/views/Home/types.ts

@@ -106,8 +106,19 @@ export type DeviceOverview = {
 export type TodoTask = {
 	id: string
 	name: string
+	code: string
 	type: string
-	priority: string
-	planTime: string
-	owner: string
+	deviceName: string
+	createTime: Date
+}
+
+export type DeviceOperationStatus = {
+	totalDevices: number
+	runningCount: number
+	standbyCount: number
+	faultCount: number
+	warningCount: number
+	utilizationRate: number
+	faultRate: number
 }
+