diff --git a/package.json b/package.json
index a9a1909..ffc8e62 100644
--- a/package.json
+++ b/package.json
@@ -63,7 +63,8 @@
     "vite-plugin-lazy-import": "^1.0.7",
     "vite-plugin-style-import": "^2.0.0",
     "vite-plugin-svg-icons": "^2.0.1",
-    "vite-plugin-vue-setup-extend": "^0.4.0"
+    "vite-plugin-vue-setup-extend": "^0.4.0",
+    "vite-plugin-vuetify": "^2.0.4"
   },
   "main": "index.js"
 }
diff --git a/src/api/reportFlow/index.js b/src/api/reportFlow/index.js
index 8bc67d2..f38ac81 100644
--- a/src/api/reportFlow/index.js
+++ b/src/api/reportFlow/index.js
@@ -52,3 +52,30 @@ export function GetWorkOrderReportWorkList(params) {
     params
   })
 }
+
+// 输入姓名拼音，查询此人今日报工记录
+export function GetReportInfoByName(params) {
+  return request({
+    url: '/mobile/reportflow/get_report_info_by_name',
+    method: 'get',
+    params
+  })
+}
+
+// 根据工艺路线获取所有工序
+export function GetProcessByRoute(params) {
+  return request({
+    url: '/mobile/reportflow/get_process_by_route',
+    method: 'get',
+    params
+  })
+}
+
+// 输入工序id 查询今天报工记录
+export function GetReportByProcessId(params) {
+  return request({
+    url: '/mobile/reportflow/get_report_by_processid',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/api/smartScreen/ProdScreen/index.js b/src/api/smartScreen/ProdScreen/index.js
index 66b9202..fdd73b9 100644
--- a/src/api/smartScreen/ProdScreen/index.js
+++ b/src/api/smartScreen/ProdScreen/index.js
@@ -5,11 +5,11 @@ import request from '@/utils/request'
  * @param {查询条件} data
  */
 export function getMoudle01(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle01',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle01',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -17,11 +17,11 @@ export function getMoudle01(query) {
  * @param {查询条件} data
  */
 export function getMoudle02(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle02',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle02',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -29,11 +29,11 @@ export function getMoudle02(query) {
  * @param {查询条件} data
  */
 export function getMoudle03(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle03',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle03',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -41,11 +41,11 @@ export function getMoudle03(query) {
  * @param {查询条件} data
  */
 export function getMoudle04(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle04',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle04',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -53,11 +53,11 @@ export function getMoudle04(query) {
  * @param {查询条件} data
  */
 export function getMoudle05(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle05',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle05',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -65,11 +65,11 @@ export function getMoudle05(query) {
  * @param {查询条件} data
  */
 export function getMoudle06(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle06',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle06',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -77,11 +77,11 @@ export function getMoudle06(query) {
  * @param {查询条件} data
  */
 export function getMoudle07(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle07',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle07',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -89,11 +89,11 @@ export function getMoudle07(query) {
  * @param {查询条件} data
  */
 export function getMoudle08(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle08',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle08',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -101,11 +101,11 @@ export function getMoudle08(query) {
  * @param {查询条件} data
  */
 export function getMoudle09(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle09',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle09',
+    method: 'get',
+    params: query
+  })
 }
 
 /**
@@ -113,9 +113,9 @@ export function getMoudle09(query) {
  * @param {查询条件} data
  */
 export function getMoudle10(query) {
-    return request({
-        url: 'mes/bigscreen/product2/getMoudle10',
-        method: 'get',
-        params: query
-    })
+  return request({
+    url: 'mes/bigscreen/product2/getMoudle10',
+    method: 'get',
+    params: query
+  })
 }
diff --git a/src/api/smartScreen/ReportScreen/index.js b/src/api/smartScreen/ReportScreen/index.js
new file mode 100644
index 0000000..683b94b
--- /dev/null
+++ b/src/api/smartScreen/ReportScreen/index.js
@@ -0,0 +1,73 @@
+import request from '@/utils/request'
+
+/**
+ * 数字翻牌器
+ * @param {查询条件} data
+ */
+export function getDigitalTurntable(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/digital_turntable',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 各工序产量统计
+ * @param {查询条件} data
+ */
+export function getBarProcessProductStatistic(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/BarProcessProductStatistic',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 各工序产量统计
+ * @param {查询条件} data
+ */
+export function getBarProcessProductStatisticWeek(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/BarProcessProductStatistic_week',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 各工序产量统计
+ * @param {查询条件} data
+ */
+export function getBarProcessProductStatisticMonth(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/BarProcessProductStatistic_month',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 本月每天产量
+ * @param {查询条件} data
+ */
+export function getOutputOfCurrentmonth(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/outputOfCurrentmonth',
+    method: 'get',
+    params: query
+  })
+}
+
+/**
+ * 本月每天产量
+ * @param {查询条件} data
+ */
+export function getAccumulatedReport(query) {
+  return request({
+    url: 'mes/SmartScreen/Product/accumulatedreport',
+    method: 'get',
+    params: query
+  })
+}
diff --git a/src/router/index.js b/src/router/index.js
index 9fed210..8fac6a4 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -65,6 +65,12 @@ export const constantRoutes = [
     component: () => import('@/views/SmartScreen/DeviceScreen/index.vue'),
     hidden: true
   },
+  {
+    name: 'ReportScreen',
+    path: '/SmartScreen/ReportScreen',
+    component: () => import('@/views/SmartScreen/ReportScreen/index.vue'),
+    hidden: true
+  },
   {
     name: 'touchScreen',
     path: '/productManagement/touchScreen',
diff --git a/src/views/SmartScreen/ProdScreen/index.vue b/src/views/SmartScreen/ProdScreen/index.vue
index 5d52a19..6077bb9 100644
--- a/src/views/SmartScreen/ProdScreen/index.vue
+++ b/src/views/SmartScreen/ProdScreen/index.vue
@@ -2,7 +2,9 @@
     <div class="screen">
         <div class="background"></div>
         <div class="back" @click="$router.go(-1)">
-            <el-icon><ArrowLeftBold /></el-icon>
+            <el-icon>
+                <ArrowLeftBold />
+            </el-icon>
         </div>
         <div>
             <logo></logo>
@@ -199,14 +201,17 @@ onUnmounted(() => {
 
 <style scoped>
 @import './index.css';
+
 .box8 {
     margin-top: 10px;
     margin-bottom: 10px;
 }
+
 .top {
     height: 80px;
     background-color: rgba(60, 232, 248, 0.1);
 }
+
 .num-item {
     /* border: #0072ff 1px solid; */
     padding: 10px;
@@ -217,16 +222,21 @@ onUnmounted(() => {
     align-items: center;
     justify-content: center;
 }
+
 .num-title {
     font-size: 20px;
     font-weight: bold;
 }
+
 .num-value {
     font-size: 24px;
     font-weight: 800;
-    -webkit-background-clip: text; /* 仅将背景应用于文本 */
-    -webkit-text-fill-color: transparent; /* 设置文本颜色为透明 */
-    color: transparent; /* 兼容非WebKit浏览器 */
+    -webkit-background-clip: text;
+    /* 仅将背景应用于文本 */
+    -webkit-text-fill-color: transparent;
+    /* 设置文本颜色为透明 */
+    color: transparent;
+    /* 兼容非WebKit浏览器 */
     background-image: linear-gradient(65deg, #0072ff 0%, #00eaff 50%, #01aaff 100%);
 }
 </style>
diff --git a/src/views/SmartScreen/ReportScreen/background/1.png b/src/views/SmartScreen/ReportScreen/background/1.png
new file mode 100644
index 0000000..1c57392
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/1.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/10.png b/src/views/SmartScreen/ReportScreen/background/10.png
new file mode 100644
index 0000000..ae10658
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/10.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/2.png b/src/views/SmartScreen/ReportScreen/background/2.png
new file mode 100644
index 0000000..56d851e
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/2.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/3.png b/src/views/SmartScreen/ReportScreen/background/3.png
new file mode 100644
index 0000000..8bc92cf
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/3.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/4.png b/src/views/SmartScreen/ReportScreen/background/4.png
new file mode 100644
index 0000000..ecf7639
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/4.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/5.png b/src/views/SmartScreen/ReportScreen/background/5.png
new file mode 100644
index 0000000..3199260
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/5.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/6.png b/src/views/SmartScreen/ReportScreen/background/6.png
new file mode 100644
index 0000000..ab1fcdb
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/6.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/7.png b/src/views/SmartScreen/ReportScreen/background/7.png
new file mode 100644
index 0000000..1bf7e8c
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/7.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/8.png b/src/views/SmartScreen/ReportScreen/background/8.png
new file mode 100644
index 0000000..951770b
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/8.png differ
diff --git a/src/views/SmartScreen/ReportScreen/background/9.png b/src/views/SmartScreen/ReportScreen/background/9.png
new file mode 100644
index 0000000..97f6a6e
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/background/9.png differ
diff --git a/src/views/SmartScreen/ReportScreen/charts/chart1.vue b/src/views/SmartScreen/ReportScreen/charts/chart1.vue
new file mode 100644
index 0000000..10f7d8a
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chart1.vue
@@ -0,0 +1,114 @@
+<template>
+    <div ref="chartRef" :style="{ height: height, width: width }" />
+</template>
+
+<script setup>
+import { getCurrentInstance, watch, onMounted, ref } from 'vue'
+import * as echarts from 'echarts'
+import theme from '../theme/chalk.json'
+echarts.registerTheme('theme', theme)
+import { CanvasRenderer } from 'echarts/renderers'
+echarts.use([CanvasRenderer])
+const { proxy } = getCurrentInstance()
+const chartRef = ref(null)
+const props = defineProps({
+    width: {
+        type: String,
+        default: '100%'
+    },
+    height: {
+        type: String,
+        default: '350px'
+    }
+})
+let options = {
+    title: {
+        text: '',
+        left: 'left'
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    xAxis: {
+        data: [],
+        boundaryGap: true,
+        axisTick: {
+            show: false
+        }
+    },
+    yAxis: {
+        type: 'value',
+        axisTick: {
+            show: false
+        }
+    },
+    // 图例
+    legend: {
+        type: 'scroll',
+        top: 'top',
+        width: '60%',
+        right: '0%'
+    },
+    series: [
+    ]
+}
+const chart = ref(null)
+function initChart() {
+    chart.value = echarts.init(proxy.$refs.chartRef, 'theme')
+    chart.value.setOption(options)
+}
+onMounted(() => {
+    initChart()
+    window.addEventListener('resize', () => {
+        chart.value?.resize()
+    })
+})
+/// ============ 修改数据 ===========
+import { getBarProcessProductStatistic } from '@/api/smartScreen/ReportScreen/index.js'
+function updateData() {
+    getBarProcessProductStatistic().then((res) => {
+        if (res.code === 200) {
+            options.title = res.data.title
+            options.xAxis.data = res.data.xAxis.data
+            let _series = res.data.series
+            _series.forEach((item) => {
+                item.label = {
+                    show: true,
+                    position: 'top',
+                    textBorderColor: '#fff',
+                    textBorderWidth: 0,
+                    formatter: '{c}',
+                    color: '#fff'
+                }
+            })
+            options.series = _series
+            chart.value.setOption(options)
+        }
+    })
+}
+function handleQuery() {
+    updateData()
+}
+handleQuery()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ==========================================
+</script>
diff --git a/src/views/SmartScreen/ReportScreen/charts/chart2.vue b/src/views/SmartScreen/ReportScreen/charts/chart2.vue
new file mode 100644
index 0000000..9bf025d
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chart2.vue
@@ -0,0 +1,114 @@
+<template>
+    <div ref="chartRef" :style="{ height: height, width: width }" />
+</template>
+
+<script setup>
+import { getCurrentInstance, watch, onMounted, ref } from 'vue'
+import * as echarts from 'echarts'
+import theme from '../theme/chalk.json'
+echarts.registerTheme('theme', theme)
+import { CanvasRenderer } from 'echarts/renderers'
+echarts.use([CanvasRenderer])
+const { proxy } = getCurrentInstance()
+const chartRef = ref(null)
+const props = defineProps({
+    width: {
+        type: String,
+        default: '100%'
+    },
+    height: {
+        type: String,
+        default: '350px'
+    }
+})
+let options = {
+    title: {
+        text: '',
+        left: 'left'
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    xAxis: {
+        data: [],
+        boundaryGap: true,
+        axisTick: {
+            show: false
+        }
+    },
+    yAxis: {
+        type: 'value',
+        axisTick: {
+            show: false
+        }
+    },
+    // 图例
+    legend: {
+        type: 'scroll',
+        top: 'top',
+        width: '60%',
+        right: '0%'
+    },
+    series: [
+    ]
+}
+const chart = ref(null)
+function initChart() {
+    chart.value = echarts.init(proxy.$refs.chartRef, 'theme')
+    chart.value.setOption(options)
+}
+onMounted(() => {
+    initChart()
+    window.addEventListener('resize', () => {
+        chart.value?.resize()
+    })
+})
+/// ============ 修改数据 ===========
+import { getBarProcessProductStatisticWeek } from '@/api/smartScreen/ReportScreen/index.js'
+function updateData() {
+    getBarProcessProductStatisticWeek().then((res) => {
+        if (res.code === 200) {
+            options.title = res.data.title
+            options.xAxis.data = res.data.xAxis.data
+            let _series = res.data.series
+            _series.forEach((item) => {
+                item.label = {
+                    show: true,
+                    position: 'top',
+                    textBorderColor: '#fff',
+                    textBorderWidth: 0,
+                    formatter: '{c}',
+                    color: '#fff'
+                }
+            })
+            options.series = _series
+            chart.value.setOption(options)
+        }
+    })
+}
+function handleQuery() {
+    updateData()
+}
+handleQuery()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ==========================================
+</script>
diff --git a/src/views/SmartScreen/ReportScreen/charts/chart3.vue b/src/views/SmartScreen/ReportScreen/charts/chart3.vue
new file mode 100644
index 0000000..1a3d0ed
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chart3.vue
@@ -0,0 +1,114 @@
+<template>
+    <div ref="chartRef" :style="{ height: height, width: width }" />
+</template>
+
+<script setup>
+import { getCurrentInstance, watch, onMounted, ref } from 'vue'
+import * as echarts from 'echarts'
+import theme from '../theme/chalk.json'
+echarts.registerTheme('theme', theme)
+import { CanvasRenderer } from 'echarts/renderers'
+echarts.use([CanvasRenderer])
+const { proxy } = getCurrentInstance()
+const chartRef = ref(null)
+const props = defineProps({
+    width: {
+        type: String,
+        default: '100%'
+    },
+    height: {
+        type: String,
+        default: '350px'
+    }
+})
+let options = {
+    title: {
+        text: '',
+        left: 'left'
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    xAxis: {
+        data: [],
+        boundaryGap: true,
+        axisTick: {
+            show: false
+        }
+    },
+    yAxis: {
+        type: 'value',
+        axisTick: {
+            show: false
+        }
+    },
+    // 图例
+    legend: {
+        type: 'scroll',
+        top: 'top',
+        width: '60%',
+        right: '0%'
+    },
+    series: [
+    ]
+}
+const chart = ref(null)
+function initChart() {
+    chart.value = echarts.init(proxy.$refs.chartRef, 'theme')
+    chart.value.setOption(options)
+}
+onMounted(() => {
+    initChart()
+    window.addEventListener('resize', () => {
+        chart.value?.resize()
+    })
+})
+/// ============ 修改数据 ===========
+import { getBarProcessProductStatisticMonth } from '@/api/smartScreen/ReportScreen/index.js'
+function updateData() {
+    getBarProcessProductStatisticMonth().then((res) => {
+        if (res.code === 200) {
+            options.title = res.data.title
+            options.xAxis.data = res.data.xAxis.data
+            let _series = res.data.series
+            _series.forEach((item) => {
+                item.label = {
+                    show: true,
+                    position: 'top',
+                    textBorderColor: '#fff',
+                    textBorderWidth: 0,
+                    formatter: '{c}',
+                    color: '#fff'
+                }
+            })
+            options.series = _series
+            chart.value.setOption(options)
+        }
+    })
+}
+function handleQuery() {
+    updateData()
+}
+handleQuery()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ==========================================
+</script>
diff --git a/src/views/SmartScreen/ReportScreen/charts/chart4.vue b/src/views/SmartScreen/ReportScreen/charts/chart4.vue
new file mode 100644
index 0000000..c7ad39f
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chart4.vue
@@ -0,0 +1,134 @@
+<template>
+    <div ref="chartRef" :style="{ height: height, width: width }" />
+</template>
+
+<script setup>
+import { getCurrentInstance, watch, onMounted, ref } from 'vue'
+import * as echarts from 'echarts'
+import theme from '../theme/chalk.json'
+echarts.registerTheme('theme', theme)
+import { CanvasRenderer } from 'echarts/renderers'
+echarts.use([CanvasRenderer])
+const { proxy } = getCurrentInstance()
+const chartRef = ref(null)
+const props = defineProps({
+    width: {
+        type: String,
+        default: '100%'
+    },
+    height: {
+        type: String,
+        default: '300px'
+    }
+})
+let options = {
+    title: {
+        text: '',
+        left: 'left'
+    },
+    tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+            type: 'shadow'
+        }
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    xAxis: {
+        data: [],
+        boundaryGap: true,
+        axisTick: {
+            show: false
+        },
+        rotate: 60,
+    },
+    yAxis: {
+        type: 'value',
+        axisTick: {
+            show: false
+        },
+    },
+    // 图例
+    legend: {
+        type: 'scroll',
+        top: 'top',
+        width: '70%',
+        left: '20%'
+    },
+    series: [
+    ]
+}
+
+const chart = ref(null)
+function initChart() {
+    chart.value = echarts.init(proxy.$refs.chartRef, 'theme')
+    chart.value.setOption(options)
+}
+onMounted(() => {
+    initChart()
+    window.addEventListener('resize', () => {
+        chart.value?.resize()
+    })
+})
+/// ============ 修改数据 ===========
+import { getAccumulatedReport } from '@/api/smartScreen/ReportScreen/index.js'
+function updateData() {
+    getAccumulatedReport().then((res) => {
+        if (res.code === 200) {
+            options.title = res.data.title
+            options.xAxis.data = res.data.xAxis.data
+            let _series = res.data.series
+            _series.forEach((item) => {
+                item.markPoint = {
+                    data: [{
+                        type: 'max', name: '最大值', label: {
+                            textBorderColor: '#fff',
+                            textBorderWidth: 0,
+                            formatter: '{c}',
+                            color: '#fff'
+                        },
+                    }]
+                }
+                // item.label = {
+                //     show: true,
+                //     position: 'top',
+                //     textBorderColor: '#fff',
+                //     textBorderWidth: 1,
+                //     color: '#fff'
+                // }
+                // if (item.type === 'bar') {
+                //     item.stack = 'group'
+                // }
+            })
+            options.series = _series
+            chart.value.setOption(options)
+        }
+    })
+}
+function handleQuery() {
+    updateData()
+}
+handleQuery()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ==========================================
+</script>
diff --git a/src/views/SmartScreen/ReportScreen/charts/chart5.vue b/src/views/SmartScreen/ReportScreen/charts/chart5.vue
new file mode 100644
index 0000000..b8e2ed0
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chart5.vue
@@ -0,0 +1,129 @@
+<template>
+    <div ref="chartRef" :style="{ height: height, width: width }" />
+</template>
+
+<script setup>
+import { getCurrentInstance, watch, onMounted, ref } from 'vue'
+import * as echarts from 'echarts'
+import theme from '../theme/chalk.json'
+echarts.registerTheme('theme', theme)
+import { CanvasRenderer } from 'echarts/renderers'
+echarts.use([CanvasRenderer])
+const { proxy } = getCurrentInstance()
+const chartRef = ref(null)
+const props = defineProps({
+    width: {
+        type: String,
+        default: '100%'
+    },
+    height: {
+        type: String,
+        default: '300px'
+    }
+})
+let options = {
+    title: {
+        text: '本月产量',
+        left: 'left'
+    },
+    tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+            type: 'shadow'
+        }
+    },
+    grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        containLabel: true
+    },
+    xAxis: {
+        data: [],
+        boundaryGap: true,
+        axisTick: {
+            show: false
+        }
+    },
+    yAxis: {
+        type: 'value',
+        axisTick: {
+            show: false
+        }
+    },
+    // 图例
+    legend: {
+        type: 'scroll',
+        top: 'top',
+        width: '70%',
+        left: '20%'
+    },
+    series: [
+        {
+            name: '本月每天产量',
+            type: 'line',
+            smooth: true,
+            data: [],
+            label: {
+                show: true,
+                position: 'top',
+                textBorderColor: '#fff',
+                textBorderWidth: 1,
+                color: '#fff'
+            }
+        }
+    ]
+}
+
+const chart = ref(null)
+function initChart() {
+    chart.value = echarts.init(proxy.$refs.chartRef, 'theme')
+    chart.value.setOption(options)
+}
+onMounted(() => {
+    initChart()
+    window.addEventListener('resize', () => {
+        chart.value?.resize()
+    })
+})
+/// ============ 修改数据 ===========
+import { getOutputOfCurrentmonth } from '@/api/smartScreen/ReportScreen/index.js'
+function updateData() {
+    getOutputOfCurrentmonth().then((res) => {
+        if (res.code === 200) {
+            options.title = res.data.title
+            options.xAxis.data = res.data.xAxis.data
+            let _series = res.data.series
+            _series.forEach((item) => {
+                if (item.type === 'bar') {
+                    item.stack = 'group'
+                }
+            })
+            options.series = _series
+            chart.value.setOption(options)
+        }
+    })
+}
+function handleQuery() {
+    updateData()
+}
+handleQuery()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ==========================================
+</script>
diff --git a/src/views/SmartScreen/ReportScreen/charts/chartdemo.vue b/src/views/SmartScreen/ReportScreen/charts/chartdemo.vue
new file mode 100644
index 0000000..b99482c
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/chartdemo.vue
@@ -0,0 +1,129 @@
+<!-- 今日工单 -->
+<template>
+    <div>
+        <div class="title">{{ title }}</div>
+        <el-table height="600" :data="dataList" v-loading="loading" ref="tableRef" highlight-current-row
+            @mouseover.native="clearScroll" @mouseleave.native="createScroll">
+            <el-table-column width="80px" prop="groupCode" label="组" :show-overflow-tooltip="true" />
+            <el-table-column width="120px" label="报工/计划" :show-overflow-tooltip="true">
+                <template #default="scope">
+                    {{ ` ${scope.row.reportQuantity} / ${scope.row.planQuantity}` }}
+                </template>
+            </el-table-column>
+            <el-table-column min-width="260px" label="生产进度" align="center">
+                <template #default="scope">
+                    <el-progress :text-inside="true" :stroke-width="24" :percentage="getPercentage(scope.row)"
+                        :color="getProgressColor(scope.row)" />
+                </template>
+            </el-table-column>
+            <!-- <el-table-column prop="status" label="工单状态" :show-overflow-tooltip="true">
+                <template #default="scope">
+                    <el-tag v-if="scope.row.status === 1" type="info">未开始</el-tag>
+                    <el-tag v-if="scope.row.status === 2" type="primary">进行中</el-tag>
+                    <el-tag v-if="scope.row.status === 3" type="success">已完成</el-tag>
+                </template>
+            </el-table-column> -->
+        </el-table>
+    </div>
+</template>
+
+<script setup>
+const { proxy } = getCurrentInstance()
+import { getBarProcessProductStatistic } from '@/api/smartScreen/ReportScreen/index.js'
+const loading = ref(false)
+const dataList = ref([])
+const title = ref('今日各组计划进度')
+function getList() {
+    getBarProcessProductStatistic().then((res) => {
+        const { code, data } = res
+        if (code == 200) {
+            dataList.value = data
+        }
+    })
+}
+/// ====================== 进度条 ==================
+// 获取进度条百分比
+function getPercentage(row) {
+    try {
+        let current = row.reportQuantity || 0
+        let percentage = Math.round((current / row.planQuantity) * 100)
+        if (percentage > 100) {
+            percentage = 100
+        }
+        if (percentage < 0) {
+            percentage = 0
+        }
+        return percentage
+    } catch (error) {
+        return 0
+    }
+}
+// 获取进度条颜色
+function getProgressColor(row) {
+    const percentage = getPercentage(row)
+    if (percentage >= 0 && percentage < 50) {
+        return 'red'
+    } else if (percentage >= 50 && percentage < 90) {
+        return 'orange'
+    } else {
+        return 'green'
+    }
+}
+/// ============================================================
+
+/// ================== 自动滚动/自动获取工单列表 ======================
+
+// 查询
+function handleQuery() {
+    getList()
+}
+handleQuery()
+// 自动获取数据
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        handleQuery()
+    }, 1000 * 60 * 1)
+}
+
+let timer2 = null
+let tableRef = ref(null)
+
+const clearScroll = () => {
+    clearInterval(timer2)
+    timer2 = null
+}
+const createScroll = () => {
+    clearScroll()
+    // 拿到 table
+    const _table = tableRef.value.layout.table.refs
+    // // 拿到可以滚动的元素
+    const tableWrapper = _table.bodyWrapper.firstElementChild.firstElementChild
+    timer2 = setInterval(() => {
+        tableWrapper.scrollTop += 1
+        // 判断是否滚动到底部，如果到底部了置为0（可视高度+距离顶部=整个高度）
+        if (tableWrapper.clientHeight + tableWrapper.scrollTop >= tableWrapper.scrollHeight) {
+            tableWrapper.scrollTop = 0
+        }
+    }, 100)
+}
+
+onMounted(() => {
+    createSearchTimer()
+    createScroll()
+})
+onUnmounted(() => {
+    clearScroll()
+    clearSearchTimer()
+})
+/// =============================================================================================
+</script>
+
+<style scoped>
+@import './table.css';
+</style>
diff --git a/src/views/SmartScreen/ReportScreen/charts/table.css b/src/views/SmartScreen/ReportScreen/charts/table.css
new file mode 100644
index 0000000..f4589fe
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/charts/table.css
@@ -0,0 +1,29 @@
+.el-table {
+    background-color: transparent !important; /* Set the background color for the table */
+	--el-table-text-color: #eee !important;
+	
+	--el-table-border-color: transparent !important; /* Set the border color for the table */
+	--el-table-border: 1px solid #fff !important; /* Set the border for the table */
+    --el-table-border-style: none !important; /* Set the border style for the table */
+    --el-table-border-width: 0 !important; /* Set the border width for the table */
+    --el-table-header-bg-color: transparent !important; /* Set the background color for the table header */
+    --el-table-header-text-color: #eee !important; /* Set the text color for the table header */
+	--el-table-header-cell-padding: 0 0 0 0 !important; /* Set the padding for the table header cell */
+    --el-table-row-hover-bg-color: transparent !important; /* Set the background color for the table row on hover */
+    --el-table-row-hover-text-color: #fff !important; /* Set the text color for the table row on hover */
+    --el-table-row-text-color: #fff !important; /* Set the text color for the table row */
+    --el-table-row-bg-color: transparent !important; /* Set the background color for the table row */
+    --el-table-header-cell-height: 40px !important; /* Set the height for the table header cell */
+    --el-table-cell-height: 40px !important; /* Set the height for the table cell */
+--el-table-cell-padding: 0 0 0 0 !important; /* Set the padding for the table cell */
+	--el-table-tr-bg-color: transparent !important; /* Set the background color for the table row */
+}
+
+.title{
+	height: 20px;
+	font-size: 20px;
+	font-weight: 700;
+	display: flex;
+	align-items: center;
+	color: #fff;
+}
\ No newline at end of file
diff --git a/src/views/SmartScreen/ReportScreen/components/header.png b/src/views/SmartScreen/ReportScreen/components/header.png
new file mode 100644
index 0000000..e9c8411
Binary files /dev/null and b/src/views/SmartScreen/ReportScreen/components/header.png differ
diff --git a/src/views/SmartScreen/ReportScreen/components/kbHeader.vue b/src/views/SmartScreen/ReportScreen/components/kbHeader.vue
new file mode 100644
index 0000000..d8e8658
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/components/kbHeader.vue
@@ -0,0 +1,29 @@
+<template>
+    <div class="header">
+        <span class="title"><slot></slot></span>
+    </div>
+</template>
+
+<script></script>
+
+<style scoped>
+.header {
+    background-image: url('./header.png');
+    background-size: cover;
+    background-position: center center;
+    background-repeat: no-repeat;
+    height: 100px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.title {
+    font-size: 48px;
+    font-weight: 600;
+    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+    -webkit-background-clip: text; /* 仅将背景应用于文本 */
+    -webkit-text-fill-color: transparent; /* 设置文本颜色为透明 */
+    color: transparent; /* 兼容非WebKit浏览器 */
+    background-image: linear-gradient(92deg, #0072ff 0%, #00eaff 20%, #01aaff 100%);
+}
+</style>
diff --git a/src/views/SmartScreen/ReportScreen/components/kbTime.vue b/src/views/SmartScreen/ReportScreen/components/kbTime.vue
new file mode 100644
index 0000000..558fa0a
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/components/kbTime.vue
@@ -0,0 +1,34 @@
+<template>
+    <div class="box">
+        <span class="span">{{ datetime }}</span>
+    </div>
+</template>
+
+<script setup>
+import { getCurrentInstance, onMounted, onUnmounted, ref } from 'vue'
+const { proxy } = getCurrentInstance()
+const timer = ref(null)
+const datetime = ref(null)
+onMounted(() => {
+    timer.value = setInterval(() => {
+        datetime.value = proxy.dayjs().format('YYYY-MM-DD HH:mm:ss')
+    }, 1000)
+})
+onUnmounted(() => {
+    clearInterval(timer.value)
+})
+</script>
+
+<style scoped>
+.box {
+    position: absolute;
+    right: 2%;
+    top: 10px;
+    color: #eeeeee;
+}
+.span {
+    font-size: 36px;
+    font-weight: 600;
+    color: white;
+}
+</style>
diff --git a/src/views/SmartScreen/ReportScreen/components/logo.vue b/src/views/SmartScreen/ReportScreen/components/logo.vue
new file mode 100644
index 0000000..0df57fe
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/components/logo.vue
@@ -0,0 +1,39 @@
+<template>
+    <div class="box">
+        <div class="row-box">
+            <img class="logo" :src="imgUrl" />
+            <span class="text">北泽阀门(昆山)有限公司</span>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import imgUrl from '@/assets/logo/logo.png'
+</script>
+
+<style scoped>
+.box {
+    position: absolute;
+    left: 1%;
+    top: 10px;
+}
+
+.row-box {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+}
+
+.logo {
+    width: 40px;
+    height: 40px;
+}
+
+.text {
+    margin-left: 10px;
+    text-align: center;
+    /* line-height: 25px; */
+    font-size: 24px;
+}
+</style>
diff --git a/src/views/SmartScreen/ReportScreen/index.css b/src/views/SmartScreen/ReportScreen/index.css
new file mode 100644
index 0000000..6f4ea55
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/index.css
@@ -0,0 +1,58 @@
+body{
+	margin: 0;
+	padding: 0;
+}
+.background {
+    padding: 0;
+    margin: 0;
+    position: fixed;
+    left: 0px;
+    top: 0px;
+    width: 100%;
+    height: 100%;
+    background-color: black;
+    /* background: url('./background/2.png') no-repeat; */
+    background-size: 100% 100%;
+    -webkit-filter: brightness(0.1);
+    filter: brightness(0.1);
+    z-index: -1;
+}
+.border {
+    border: 2px solid #a9aabc;
+}
+.screen {
+    padding: 0;
+    margin: 0;
+    width: 99%;
+    height: 100%;
+    color: #eeeeee;
+	background-color: rgba(32, 163, 250, 0.2);
+}
+.screen .header {
+    width: 100%;
+    height: 100px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+}
+.screen .title {
+    font-size: 30px;
+    font-weight: 700;
+    color: #eeeeee;
+}
+.screen .back {
+    position: absolute;
+    left: 10px;
+    top: 10px;
+    color: #eeeeee;
+}
+.body{
+	display: flex;
+	flex-direction: column;
+}
+.box{
+    min-height: 350px;
+	padding: 20px;
+}
+
diff --git a/src/views/SmartScreen/ReportScreen/index.vue b/src/views/SmartScreen/ReportScreen/index.vue
new file mode 100644
index 0000000..ccbe37a
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/index.vue
@@ -0,0 +1,178 @@
+<template>
+    <div class="screen">
+        <div class="background"></div>
+        <div class="back" @click="$router.go(-1)">
+            <el-icon>
+                <ArrowLeftBold />
+            </el-icon>
+        </div>
+        <div>
+            <logo></logo>
+            <kbTime></kbTime>
+        </div>
+        <div class="header">
+            <kbHeader>车间生产看板</kbHeader>
+        </div>
+        <div class="body">
+            <div class="top" dv-bg>
+                <el-row :gutter="20">
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">工单数</div>
+                            <div class="num-value">{{ orderData.workorderQuantity }} 个</div>
+                        </div>
+                    </el-col>
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">已完成工单数</div>
+                            <div class="num-value">{{ orderData.finishedWorkorderQuantity }} 个</div>
+                        </div>
+                    </el-col>
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">未完成工单数</div>
+                            <div class="num-value">{{ orderData.unFinishedWorkorderQuantity }} 个</div>
+                        </div>
+                    </el-col>
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">生产计划数</div>
+                            <div class="num-value">{{ orderData.productionPlanQuantity }} 个</div>
+                        </div>
+                    </el-col>
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">生产完成数</div>
+                            <div class="num-value">{{ orderData.productionFinishQuantity }} 个</div>
+                        </div>
+                    </el-col>
+                    <el-col :span="4">
+                        <div class="num-item">
+                            <div class="num-title">组数量</div>
+                            <div class="num-value">{{ orderData.groupQuantity }} 组</div>
+                        </div>
+                    </el-col>
+                </el-row>
+            </div>
+            <el-row :gutter="5">
+                <el-col :span="8">
+                    <chart1></chart1>
+                </el-col>
+                <el-col :span="8">
+                    <chart2></chart2>
+                </el-col>
+                <el-col :span="8">
+                    <chart3></chart3>
+                </el-col>
+            </el-row>
+            <el-row :gutter="5">
+                <el-col :span="24">
+                    <chart4></chart4>
+                </el-col>
+            </el-row>
+            <el-row :gutter="5">
+                <el-col :span="24">
+                    <chart5></chart5>
+                </el-col>
+            </el-row>
+        </div>
+    </div>
+</template>
+
+<script setup>
+/// ================ 基础组件导入 ======================
+import kbHeader from './components/kbHeader.vue'
+import kbTime from './components/kbTime.vue'
+import logo from './components/logo.vue'
+/// ================================================
+
+/// ================== 图表组件导入 ======================
+// 实际图表
+import chart1 from './charts/chart1.vue'
+import chart2 from './charts/chart2.vue'
+import chart3 from './charts/chart3.vue'
+import chart4 from './charts/chart4.vue'
+import chart5 from './charts/chart5.vue'
+/// ====================================================
+
+import { getCurrentInstance } from 'vue'
+const { proxy } = getCurrentInstance()
+/// =================== 获取工单数据 ======================
+import { getDigitalTurntable } from '@/api/smartScreen/ReportScreen/index.js'
+const orderData = ref({
+    "workorderQuantity": 0, // 工单数量
+    "finishedWorkorderQuantity": 0, // 已完成工单数量
+    "unFinishedWorkorderQuantity": 0, // 未完成工单数量
+    "productionPlanQuantity": 0, // 生产计划数量
+    "productionFinishQuantity": 0, // 生产完成数量
+    "groupQuantity": 0 // 组数量
+})
+function getData() {
+    getDigitalTurntable().then((res) => {
+        console.log(res);
+        orderData.value = res.data
+    })
+}
+getData()
+let timer1 = null
+const clearSearchTimer = () => {
+    clearInterval(timer1)
+    timer1 = null
+}
+const createSearchTimer = () => {
+    clearSearchTimer()
+    timer1 = setInterval(() => {
+        getData()
+    }, 1000 * 60 * 5)
+}
+onMounted(() => {
+    createSearchTimer()
+})
+onUnmounted(() => {
+    clearSearchTimer()
+})
+/// ====================================================
+
+</script>
+
+<style scoped>
+@import './index.css';
+
+.box8 {
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
+.top {
+    height: 80px;
+    background-color: rgba(60, 232, 248, 0.1);
+}
+
+.num-item {
+    /* border: #0072ff 1px solid; */
+    padding: 10px;
+    width: 100%;
+    height: 80px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+}
+
+.num-title {
+    font-size: 20px;
+    font-weight: bold;
+}
+
+.num-value {
+    font-size: 24px;
+    font-weight: 800;
+    -webkit-background-clip: text;
+    /* 仅将背景应用于文本 */
+    -webkit-text-fill-color: transparent;
+    /* 设置文本颜色为透明 */
+    color: transparent;
+    /* 兼容非WebKit浏览器 */
+    background-image: linear-gradient(65deg, #0072ff 0%, #00eaff 50%, #01aaff 100%);
+}
+</style>
diff --git a/src/views/SmartScreen/ReportScreen/theme/chalk.json b/src/views/SmartScreen/ReportScreen/theme/chalk.json
new file mode 100644
index 0000000..68e2a62
--- /dev/null
+++ b/src/views/SmartScreen/ReportScreen/theme/chalk.json
@@ -0,0 +1,356 @@
+{
+    "color": ["#8BC34A", "#05f8d6", "#fdd845", "#22ed7c", "#09b0d3", "#1d27c9", "#f9e264", "#f47a75", "#72ccff", "#f0805a", "#26c0c0", "#d851cc", "#b91dd8", "#2418ea"],
+    "backgroundColor": "transparent",
+    "textStyle": {
+        "color": "#fff"
+    },
+    "title": {
+        "textStyle": {
+            "color": "#ffffff"
+        },
+        "subtextStyle": {
+            "color": "#dddddd"
+        }
+    },
+    "line": {
+        "itemStyle": {
+            "borderWidth": "4"
+        },
+        "lineStyle": {
+            "width": "3"
+        },
+        "symbolSize": "0",
+        "symbol": "circle",
+        "smooth": true
+    },
+    "radar": {
+        "itemStyle": {
+            "borderWidth": "4"
+        },
+        "lineStyle": {
+            "width": "3"
+        },
+        "symbolSize": "0",
+        "symbol": "circle",
+        "smooth": true
+    },
+    "bar": {
+        "itemStyle": {
+            "barBorderWidth": 0,
+            "barBorderColor": "#ccc"
+        }
+    },
+    "pie": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "scatter": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "boxplot": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "parallel": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "sankey": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "funnel": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "gauge": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        }
+    },
+    "candlestick": {
+        "itemStyle": {
+            "color": "#fc97af",
+            "color0": "transparent",
+            "borderColor": "#fc97af",
+            "borderColor0": "#87f7cf",
+            "borderWidth": "2"
+        }
+    },
+    "graph": {
+        "itemStyle": {
+            "borderWidth": 0,
+            "borderColor": "#ccc"
+        },
+        "lineStyle": {
+            "width": "1",
+            "color": "#ffffff"
+        },
+        "symbolSize": "0",
+        "symbol": "circle",
+        "smooth": true,
+        "color": ["#fc97af", "#87f7cf", "#f7f494", "#72ccff", "#f7c5a0", "#d4a4eb", "#d2f5a6", "#76f2f2"],
+        "label": {
+            "color": "#FFFFF"
+        }
+    },
+    "map": {
+        "itemStyle": {
+            "areaColor": "#f3f3f3",
+            "borderColor": "#999999",
+            "borderWidth": 0.5
+        },
+        "label": {
+            "color": "#893448"
+        },
+        "emphasis": {
+            "itemStyle": {
+                "areaColor": "rgba(255,178,72,1)",
+                "borderColor": "#eb8146",
+                "borderWidth": 1
+            },
+            "label": {
+                "color": "rgb(137,52,72)"
+            }
+        }
+    },
+    "geo": {
+        "itemStyle": {
+            "areaColor": "#f3f3f3",
+            "borderColor": "#999999",
+            "borderWidth": 0.5
+        },
+        "label": {
+            "color": "#893448"
+        },
+        "emphasis": {
+            "itemStyle": {
+                "areaColor": "rgba(255,178,72,1)",
+                "borderColor": "#eb8146",
+                "borderWidth": 1
+            },
+            "label": {
+                "color": "rgb(137,52,72)"
+            }
+        }
+    },
+    "categoryAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#666666"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "color": "#aaaaaa"
+        },
+        "splitLine": {
+            "show": false,
+            "lineStyle": {
+                "color": ["#e6e6e6"]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"]
+            }
+        }
+    },
+    "valueAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#666666"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "color": "#aaaaaa"
+        },
+        "splitLine": {
+            "show": false,
+            "lineStyle": {
+                "color": ["#e6e6e6"]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"]
+            }
+        }
+    },
+    "logAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#666666"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "color": "#aaaaaa"
+        },
+        "splitLine": {
+            "show": false,
+            "lineStyle": {
+                "color": ["#e6e6e6"]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"]
+            }
+        }
+    },
+    "timeAxis": {
+        "axisLine": {
+            "show": true,
+            "lineStyle": {
+                "color": "#666666"
+            }
+        },
+        "axisTick": {
+            "show": false,
+            "lineStyle": {
+                "color": "#333"
+            }
+        },
+        "axisLabel": {
+            "show": true,
+            "color": "#aaaaaa"
+        },
+        "splitLine": {
+            "show": false,
+            "lineStyle": {
+                "color": ["#e6e6e6"]
+            }
+        },
+        "splitArea": {
+            "show": false,
+            "areaStyle": {
+                "color": ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"]
+            }
+        }
+    },
+    "toolbox": {
+        "iconStyle": {
+            "borderColor": "#999999"
+        },
+        "emphasis": {
+            "iconStyle": {
+                "borderColor": "#666666"
+            }
+        }
+    },
+    "legend": {
+        "textStyle": {
+            "color": "#999999"
+        }
+    },
+    "tooltip": {
+        "axisPointer": {
+            "lineStyle": {
+                "color": "#cccccc",
+                "width": 1
+            },
+            "crossStyle": {
+                "color": "#cccccc",
+                "width": 1
+            }
+        }
+    },
+    "timeline": {
+        "lineStyle": {
+            "color": "#87f7cf",
+            "width": 1
+        },
+        "itemStyle": {
+            "color": "#87f7cf",
+            "borderWidth": 1
+        },
+        "controlStyle": {
+            "color": "#87f7cf",
+            "borderColor": "#87f7cf",
+            "borderWidth": 0.5
+        },
+        "checkpointStyle": {
+            "color": "#fc97af",
+            "borderColor": "#fc97af"
+        },
+        "label": {
+            "color": "#87f7cf"
+        },
+        "emphasis": {
+            "itemStyle": {
+                "color": "#f7f494"
+            },
+            "controlStyle": {
+                "color": "#87f7cf",
+                "borderColor": "#87f7cf",
+                "borderWidth": 0.5
+            },
+            "label": {
+                "color": "#87f7cf"
+            }
+        }
+    },
+    "visualMap": {
+        "color": ["#fc97af", "#87f7cf"]
+    },
+    "dataZoom": {
+        "backgroundColor": "rgba(255,255,255,0)",
+        "dataBackgroundColor": "rgba(114,204,255,1)",
+        "fillerColor": "rgba(114,204,255,0.2)",
+        "handleColor": "#72ccff",
+        "handleSize": "100%",
+        "textStyle": {
+            "color": "#333333"
+        }
+    },
+    "markPoint": {
+        "label": {
+            "color": "#293441"
+        },
+        "emphasis": {
+            "label": {
+                "color": "#293441"
+            }
+        }
+    }
+}
diff --git a/src/views/productManagement/WorkReport/index.vue b/src/views/productManagement/WorkReport/index.vue
index 0f95241..18db1a2 100644
--- a/src/views/productManagement/WorkReport/index.vue
+++ b/src/views/productManagement/WorkReport/index.vue
@@ -7,10 +7,10 @@
   <div>
     <el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch" @submit.prevent>
       <el-form-item label="工单号" prop="workorder">
-        <el-input v-model.trim="queryParams.workorder" clearable placeholder="请输入工单号" />
+        <el-input v-model="queryParams.workorder" clearable placeholder="请输入工单号" />
       </el-form-item>
       <el-form-item label="作业员" prop="worker">
-        <el-input v-model.trim="queryParams.worker" clearable placeholder="请输入作业员" />
+        <el-input v-model="queryParams.worker" clearable placeholder="请输入作业员" />
       </el-form-item>
       <!-- <el-form-item label="工序" prop="lineCode">
         <el-select v-model="queryParams.lineCode" placeholder="全部">
@@ -18,8 +18,8 @@
           <el-option v-for="(item, index) in allProcessOptions" :key="index" :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item> -->
-      <el-form-item label="查看日期" prop="jobDate">
-        <el-date-picker v-model="queryParams.jobDate" type="daterange" range-separator="到" start-placeholder="开始时间"
+      <el-form-item label="查看日期" prop="jobDateTime">
+        <el-date-picker v-model="queryParams.jobDateTime" type="daterange" range-separator="到" start-placeholder="开始时间"
           end-placeholder="结束时间" placeholder="请选择工单日期区间" />
       </el-form-item>
 
@@ -54,8 +54,8 @@
       <el-table-column prop="badNum" label="不良数量" align="center" v-if="columns.showColumn('badNum')" />
       <el-table-column prop="worker" label="作业员" align="center" :show-overflow-tooltip="true"
         v-if="columns.showColumn('worker')" />
-      <el-table-column prop="jobDate" width="200" align="center" label="作业日期" :show-overflow-tooltip="true"
-        v-if="columns.showColumn('jobDate')" />
+      <el-table-column prop="jobDateTime" width="200" align="center" label="作业日期" :show-overflow-tooltip="true"
+        v-if="columns.showColumn('jobDateTime')" />
       <el-table-column prop="remark" label="备注" align="center" :show-overflow-tooltip="true"
         v-if="columns.showColumn('remark')" />
       <el-table-column prop="createdBy" label="创建人" align="center" :show-overflow-tooltip="true"
@@ -125,8 +125,8 @@
           </el-col>
 
           <el-col :lg="12">
-            <el-form-item label="作业日期" prop="jobDate">
-              <el-date-picker v-model="form.jobDate" type="datetime" placeholder="选择日期时间"
+            <el-form-item label="作业日期" prop="jobDateTime">
+              <el-date-picker v-model="form.jobDateTime" type="datetime" placeholder="选择日期时间"
                 value-format="YYYY-MM-DD HH:mm:ss">
               </el-date-picker>
             </el-form-item>
@@ -155,7 +155,7 @@ const showSearch = ref(true)
 const queryParams = reactive({
   pageNum: 1,
   pageSize: 10,
-  jobDate: [proxy.dayjs(), proxy.dayjs()],
+  jobDateTime: [proxy.dayjs(), proxy.dayjs()],
   sort: 'workorder',
   sortType: 'asc',
 })
@@ -168,7 +168,7 @@ const columns = ref([
   { visible: true, align: 'center', type: '', prop: 'finishNum', label: '完成数量' },
   { visible: true, align: 'center', type: '', prop: 'badNum', label: '不良数量' },
   { visible: true, align: 'center', type: '', prop: 'worker', label: '作业员', showOverflowTooltip: true },
-  { visible: true, align: 'center', type: '', prop: 'jobDate', label: '作业日期', showOverflowTooltip: true },
+  { visible: true, align: 'center', type: '', prop: 'jobDateTime', label: '作业日期', showOverflowTooltip: true },
   { visible: true, align: 'center', type: '', prop: 'remark', label: '备注', showOverflowTooltip: true },
   { visible: false, align: 'center', type: '', prop: 'createdBy', label: '创建人', showOverflowTooltip: true },
   { visible: false, align: 'center', type: '', prop: 'createdTime', label: '创建时间', showOverflowTooltip: true },
@@ -260,7 +260,7 @@ function reset() {
     finishNum: null,
     badNum: null,
     worker: null,
-    jobDate: null,
+    jobDateTime: null,
     remark: null,
     createdBy: null,
     createdTime: null,
diff --git a/src/views/touchScreen/main/index.vue b/src/views/touchScreen/main/index.vue
index dd837f4..a4b6d88 100644
--- a/src/views/touchScreen/main/index.vue
+++ b/src/views/touchScreen/main/index.vue
@@ -69,7 +69,7 @@ const checkIsFullScreen = () => {
 
 // 进入全屏
 const goFullScreen = () => {
-    const appEl = document.getElementById('app');
+    const appEl = document.documentElement;
     if (appEl) {
         appEl.requestFullscreen();
         checkIsFullScreen(); // 更新状态
@@ -130,11 +130,9 @@ const userInfo = ref({
 })
 function getUser() {
     getUserProfile().then((response) => {
-
         if (response.code === 200) {
             userInfo.value.user = response.data.user
             userInfo.value.roles = response.data.roles
-            console.log(userInfo);
         }
     })
 }
@@ -146,8 +144,8 @@ import { useDisplay } from "vuetify";
 const { mobile, name } = useDisplay();
 
 onMounted(() => {
-    console.log(mobile.value); // false
-    console.log(name.value); // false
+    console.log('是否是移动设备', mobile.value); // false
+    console.log('桌面大小', name.value); // false
 });
 </script>
 
diff --git a/src/views/touchScreen/report/index.vue b/src/views/touchScreen/report/index.vue
index 93c53a9..602aedc 100644
--- a/src/views/touchScreen/report/index.vue
+++ b/src/views/touchScreen/report/index.vue
@@ -4,13 +4,15 @@
             <v-col cols="8">
                 <v-card color="blue-darken-4" class="left-content">
                     <v-tabs v-model="tab" bg-color="primary">
-                        <v-tab value="报工">报工</v-tab>
-                        <v-tab value="历史报工记录">历史报工记录</v-tab>
+                        <v-tab value="工序报工">工序报工</v-tab>
+                        <v-tab value="此工单工序记录">此工单工序记录</v-tab>
+                        <v-tab value="此工序今日记录">此工序今日记录</v-tab>
+                        <v-tab value="员工报工记录">员工报工记录</v-tab>
                     </v-tabs>
                     <v-card-text>
                         <v-fade-transition>
                             <v-tabs-window v-model="tab">
-                                <v-tabs-window-item value="报工">
+                                <v-tabs-window-item value="工序报工">
                                     <el-card v-if="formData.workorder" class="mt-4">
                                         <v-text-field type="number" :label="processId === 10 ? '报工数' : '完成数'"
                                             v-model="formData.finishNum"></v-text-field>
@@ -29,21 +31,59 @@
                                         </div>
                                     </el-card>
                                 </v-tabs-window-item>
-                                <v-tabs-window-item value="历史报工记录">
+                                <v-tabs-window-item value="此工单工序记录">
                                     <el-card v-if="formData.workorder" class="mt-4">
-                                        <v-list lines="two" class="bg-transparent">
-                                            <v-list-item v-for="(item, index) in reportWorkerOrderList" :key="index"
-                                                :title="item.processName">
-                                                <v-list-item-subtitle class="d-flex justify-space-between">
-                                                    <span class="text-subtitle-1">
-                                                        {{
-                                                            `完成数:${item.finishNum ?? 0} 不良数:${item.badNum ?? 0}`
-                                                        }}
-                                                    </span>
-                                                    <span>{{ `作业员:${item.worker} 提交时间:${item.jobDate}` }}</span>
-                                                </v-list-item-subtitle>
-                                            </v-list-item>
-                                        </v-list>
+                                        <vxe-table align="center" :data="reportWorkerOrderList">
+                                            <vxe-column type="seq" width="60"></vxe-column>
+                                            <vxe-column field="processName" title="工序"></vxe-column>
+                                            <vxe-column field="finishNum" title="完成数"></vxe-column>
+                                            <vxe-column field="badNum" title="不良数"></vxe-column>
+                                            <vxe-column field="worker" title="作业员"></vxe-column>
+                                            <vxe-column field="jobDateTime" title="提交时间"></vxe-column>
+                                        </vxe-table>
+                                    </el-card>
+                                </v-tabs-window-item>
+                                <v-tabs-window-item value="此工序今日记录">
+                                    <el-card class="mt-4">
+                                        <v-btn style="margin-bottom: 20px" class="bg-blue-darken-1 margin-bottom-4"
+                                            size="x-large" @click="nowdayReportOrderList()">
+                                            搜索
+                                        </v-btn>
+                                        <vxe-table align="center" :data="nowdayReportDataList">
+                                            <vxe-column type="seq" width="60"></vxe-column>
+                                            <vxe-column field="processName" title="工序"></vxe-column>
+                                            <vxe-column field="finishNum" title="完成数"></vxe-column>
+                                            <vxe-column field="badNum" title="不良数"></vxe-column>
+                                            <vxe-column field="worker" title="作业员"></vxe-column>
+                                            <vxe-column field="jobDateTime" title="提交时间"></vxe-column>
+                                        </vxe-table>
+                                        <pagination :total="total1" v-model:page="queryParams1.pageNum"
+                                            v-model:limit="queryParams1.pageSize" @pagination="nowdayReportOrderList" />
+                                    </el-card>
+                                </v-tabs-window-item>
+                                <v-tabs-window-item value="员工报工记录">
+                                    <el-card class="mt-4">
+                                        <div>
+                                            <v-text-field label="作业员" v-model="queryParams2.name">
+                                                <template v-slot:append>
+                                                    <v-btn class="bg-blue-darken-1" size="x-large"
+                                                        @click="queryUserReport()">
+                                                        搜索
+                                                    </v-btn>
+                                                </template>
+                                            </v-text-field>
+                                        </div>
+                                        <vxe-table v-loading="loading" align="center" :data="userReportDataList">
+                                            <vxe-column type="seq" width="60"></vxe-column>
+                                            <vxe-column field="workorder" title="工单号"></vxe-column>
+                                            <vxe-column field="processName" title="工序"></vxe-column>
+                                            <vxe-column field="finishNum" title="完成数"></vxe-column>
+                                            <vxe-column field="badNum" title="不良数"></vxe-column>
+                                            <vxe-column field="worker" title="作业员"></vxe-column>
+                                            <vxe-column field="jobDateTime" title="提交时间"></vxe-column>
+                                        </vxe-table>
+                                        <pagination :total="total2" v-model:page="queryParams2.pageNum"
+                                            v-model:limit="queryParams2.pageSize" @pagination="queryUserReport" />
                                     </el-card>
                                 </v-tabs-window-item>
                             </v-tabs-window>
@@ -202,7 +242,6 @@ const formData = ref({
     // routeCode: '路线编码',
     // groupCode: '组编码'
 })
-
 const reportWorkerOrderList = ref([])
 
 function handleScanInput(val) {
@@ -300,6 +339,55 @@ function submit() {
     })
 }
 
+
+const queryParams1 = reactive({
+    name: '',
+    pageNum: 1,
+    pageSize: 10,
+    processId: null,
+})
+const queryParams2 = reactive({
+    name: '',
+    pageNum: 1,
+    pageSize: 10,
+    processId: null,
+})
+const loading = ref(false)
+const total1 = ref(0)
+const nowdayReportDataList = ref([])
+function nowdayReportOrderList() {
+    loading.value = true
+    queryParams1.processId = processId.value
+    ReportApi.GetReportByProcessId(queryParams1).then(res => {
+        const { code, data } = res
+        if (code == 200) {
+            nowdayReportDataList.value = data.result
+            total1.value = data.totalNum
+            loading.value = false
+        }
+    })
+}
+const total2 = ref(0)
+const userReportDataList = ref([])
+function queryUserReport() {
+    loading.value = true
+    if (queryParams2.name === '') {
+        dialog.show = true
+        dialog.class = 'bg-amber'
+        dialog.title = '异常提示'
+        dialog.text = '请输入姓名拼音'
+        return
+    }
+    ReportApi.GetReportInfoByName(queryParams2).then(res => {
+        const { code, data } = res
+        if (code == 200) {
+            userReportDataList.value = data.result
+            total2.value = data.totalNum
+            loading.value = false
+        }
+    })
+}
+
 </script>
 
 <style scoped>
diff --git a/vite/plugins/index.js b/vite/plugins/index.js
index 47f77f5..0d49b3e 100644
--- a/vite/plugins/index.js
+++ b/vite/plugins/index.js
@@ -6,11 +6,13 @@ import createCompression from './compression'
 import createSetupExtend from './setup-extend'
 // import { createStyleImportPlugin, VxeTableResolve } from 'vite-plugin-style-import'
 import { lazyImport, VxeResolver } from 'vite-plugin-lazy-import'
+import vuetify from 'vite-plugin-vuetify'
 
 export default function createVitePlugins(viteEnv, isBuild = false) {
   const vitePlugins = [vue()]
   vitePlugins.push(createAutoImport())
   vitePlugins.push(createSetupExtend())
+  vitePlugins.push(vuetify())
   vitePlugins.push(createSvgIcon(isBuild))
   isBuild && vitePlugins.push(...createCompression(viteEnv))