.env.dev

@@ -1,10 +1,10 @@
 ###
  # @Author: Do not edit
  # @Date: 2023-08-29 09:40:39
- # @LastEditTime: 2023-09-12 14:01:15
- # @LastEditors: zhp
- # @Description:
-###
+ # @LastEditTime: 2023-09-16 09:41:07
+ # @LastEditors: DY
+ # @Description: 
+### 
 # 开发环境配置
 ENV = 'development'
 
@@ -12,10 +12,10 @@ ENV = 'development'
 VUE_APP_TITLE = 芋道管理系统
 
 # 芋道管理系统/开发环境
-VUE_APP_BASE_API = 'http://192.168.1.188:48080'
+# VUE_APP_BASE_API = 'http://192.168.1.49:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.8:48080'
 # VUE_APP_BASE_API = 'http://192.168.0.33:48080'
-# VUE_APP_BASE_API = 'http://192.168.1.188:48080'
+VUE_APP_BASE_API = 'http://192.168.1.188:48080'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

package.json

@@ -55,8 +55,10 @@
     "file-saver": "^2.0.5",
     "fuse.js": "6.6.2",
     "highlight.js": "9.18.5",
+    "html2canvas": "^1.4.1",
     "js-beautify": "1.13.0",
     "jsencrypt": "3.3.1",
+    "jspdf": "^2.5.1",
     "min-dash": "3.5.2",
     "mockjs": "^1.1.0",
     "moment": "^2.29.4",

src/api/core/monitoring/auto.js

@@ -0,0 +1,25 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2023-09-12 09:44:53
+ * @LastEditTime: 2023-09-13 16:11:41
+ * @LastEditors: DY
+ * @Description: 
+ */
+import request from '@/utils/request'
+
+// 获得工厂分页
+export function getPdlAutoReport(data) {
+  return request({
+    url: '/monitoring/production-monitor/getPdlAutoReport',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获得所有工厂产线列表
+export function getPdList() {
+  return request({
+    url: '/base/production-line/listAll',
+    method: 'get'
+  })
+}

src/api/core/monitoring/data.js

@@ -0,0 +1,25 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2023-09-12 09:44:53
+ * @LastEditTime: 2023-09-14 10:25:46
+ * @LastEditors: DY
+ * @Description: 
+ */
+import request from '@/utils/request'
+
+// 获得产线统计数据查询
+export function getPdlDataSearch(data) {
+  return request({
+    url: '/monitoring/production-monitor/getPdlDataSearch',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获得所有工厂产线列表
+export function getPdList() {
+  return request({
+    url: '/base/production-line/listAll',
+    method: 'get'
+  })
+}

src/api/core/monitoring/data24.js

@@ -0,0 +1,17 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2023-09-12 09:44:53
+ * @LastEditTime: 2023-09-15 14:12:26
+ * @LastEditors: DY
+ * @Description: 
+ */
+import request from '@/utils/request'
+
+// 获得近24小时产线生产数据
+export function getPdlDataOneDay(data) {
+  return request({
+    url: '/monitoring/production-monitor/getPdlDataOneDay',
+    method: 'post',
+    data: data
+  })
+}

src/api/core/monitoring/sectionStatistics.js

@@ -0,0 +1,33 @@
+/*
+ * @Author: Do not edit
+ * @Date: 2023-09-12 09:44:53
+ * @LastEditTime: 2023-09-14 14:01:12
+ * @LastEditors: DY
+ * @Description: 
+ */
+import request from '@/utils/request'
+
+// 获得工段自动统计数据查询
+export function getSectionAutoReport(data) {
+  return request({
+    url: '/monitoring/production-monitor/getSectionAutoReport',
+    method: 'post',
+    data: data
+  })
+}
+
+// 获得所有工厂产线列表
+export function getPdList() {
+  return request({
+    url: '/base/production-line/listAll',
+    method: 'get'
+  })
+}
+
+// 获得所有产线工段列表
+export function getWorkshopSectionList() {
+  return request({
+    url: '/base/workshop-section/listAll',
+    method: 'get'
+  })
+}

src/views/core/analysis/balanceAnalysis/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
-    <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
+    <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" />
     <line-chart ref="lineChart" />
     <!-- <pagination
 			:limit.sync="listQuery.pageSize"
@@ -17,6 +17,7 @@ import { parseTime } from '../../mixins/code-filter';
 import { getCT } from '@/api/core/analysis/index';
 import { getProductionLinePage } from '@/api/core/base/productionLine';
 import lineChart from '../LineChart'
+import { time } from 'echarts';
 // import { getWorkshopSectionPage } from '@/api/core/base/workshopSection';
 
 // const tableProps = [
@@ -59,6 +60,8 @@ export default {
         lineId:undefined,
         startTime:undefined
       },
+      timeList: [],
+      spanArr: [], 
       xData: [],
       yData: [],
       optionArrUrl: [getProductionLinePage],
@@ -69,18 +72,19 @@ export default {
           selectOptions: [],
           param: 'lineIds',
           defaultSelect: '',
-          multiple: true,
+          multiple: false,
           filterable: true,
         },
         {
           type: 'datePicker',
           label: '时间',
-          dateType: 'datetime',
+          dateType: 'datetimerange',
           format: 'yyyy-MM-dd',
           valueFormat: 'yyyy-MM-dd HH:mm:ss',
           rangeSeparator: '-',
           startPlaceholder: '开始时间',
           endPlaceholder: '结束时间',
+          width: 350,
           param: 'time',
         },
         {
@@ -107,10 +111,40 @@ export default {
         });
       });
     },
+    setRowSpan(arr) {
+      let count = 0
+      arr.forEach((item, index) => {
+        if(index === 0) {
+          this.spanArr.push(1)
+        } else {
+          if (item === arr[index - 1]) {
+            this.spanArr[count] += 1
+            this.spanArr.push(0)
+          } else {
+            count = index
+            this.spanArr.push(1)
+          }
+        }
+      })
+      console.log('打印数组长度', this.spanArr)
+    },
+    /** 合并table列的规则 */
+		mergeColumnHandler({ row, column, rowIndex, columnIndex }) {
+			if (columnIndex == 0) {
+				if (this.spanArr[rowIndex]) {
+					return [
+						this.spanArr[rowIndex], // row span
+						1, // col span
+					];
+				} else {
+					return [0, 0];
+				}
+			}
+		},
     getData() {
-      this.listQuery.lineId = '1672847052717821953'
-      this.listQuery.startTime = '1693497600000';
-      this.listQuery.endTime = '1693843200000';
+      // this.listQuery.lineId = '1672847052717821953'
+      // this.listQuery.startTime = '1693497600000';
+      // this.listQuery.endTime = '1693843200000';
       this.urlOptions.getDataListURL(this.listQuery).then(res => {
         console.log(res)
         let arr = [
@@ -123,40 +157,48 @@ export default {
             prop: 'equName',
             label: '设备',
             align: 'center',
-          },
+          }
         ]
-        let eqArr= []
+        let sectionArr= []
         res.data.data.forEach((ele, index) => {
-          console.log(ele);
-          eqArr.push(ele.equName)
+          let tempData = []
+          ele.data.forEach(item => {
+            item.children.forEach(params => {
+              if (params.dynamicName === '设备CT') {
+                tempData[item.dynamicName + '_eq'] = params.dynamicValue
+              } else {
+                tempData[item.dynamicName + '_pl'] = params.dynamicValue
+              }
+            })
+          })
+          tempData['equName'] = ele.equName
+          tempData['sectionName'] = ele.sectionName
+          this.tableData.push(tempData)
+          const { sectionName } = tempData
+          sectionArr.push(sectionName)
         })
-        console.log(eqArr)
-        // console.log(res.data.nameData.slice(1))
+        this.setRowSpan(sectionArr)
+        console.log('工段名称列表', sectionArr)
         res.data.nameData.forEach(item => {
-          if (eqArr[0] === item.parentId) {
-            const props = {
-              'prop': item.name,
-              'label': item.name,
-              'align': 'center'
+          this.timeList.push(item.name)
+        })
+        const timeArray = Array.from(new Set(this.timeList))
+        for (const times of timeArray) {
+          if (times !== '设备CT' && times !== '产线CT') {
+            const subprop = {
+              label: times,
+              align: 'center',
+              children: [
+                { prop: times + '_eq', label: '设备CT', align: 'center' },
+                { prop: times + '_pl', label: '产线CT', align: 'center' }
+              ]
             }
+            arr.push(subprop)
           }
-          arr[2].children.push(props)
-        })
-        let obj = {
-          lineName: res.data.data[0].lineName,
-          sum: res.data.data[0].sum,
         }
-        res.data.data[0].data[0].children.forEach((item, index) => {
-          console.log(item)
-          // let data = 'data' + Number(index+1)
-          obj['' + item.dynamicName + ''] = item.dynamicValue
-        })
-        this.tableData = [obj]
-        console.log(this.tableData)
-        console.log(arr)
         this.tableProps = arr
-        let xData = []
 
+        let xData = []
         res.data.nameData.forEach(item => {
           xData.push(item.name)
           // arr[2].children.push(props)
@@ -180,6 +222,9 @@ export default {
         case 'search':
           // this.listQuery.pageNo = 1;
           // this.listQuery.pageSize = 10;
+          this.listQuery.lineId = val.lineIds
+          this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined;
+          this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined;
           this.getData()
           break;
         case 'reset':

src/views/core/mixins/code-filter.js

@@ -1,8 +1,8 @@
 
 /*
  * @Date: 2020-12-29 16:49:28
- * @LastEditors: zwq
- * @LastEditTime: 2023-08-01 11:10:04
+ * @LastEditors: DY
+ * @LastEditTime: 2023-09-12 11:13:34
  * @FilePath: \basic-admin\src\filters\basicData\index.js
  * @Description:
  */
@@ -13,6 +13,11 @@ const table = {
     2: '停止',
     3: '未知',
   },
+  reportType: {
+    1: '日',
+    2: '周',
+    3: '月'
+  }
 }
 
 // 日期格式化

src/views/core/monitoring/auto/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: Do not edit
  * @Date: 2023-08-29 14:59:29
- * @LastEditTime: 2023-09-11 15:52:20
+ * @LastEditTime: 2023-09-16 17:34:17
  * @LastEditors: DY
  * @Description: 
 -->
@@ -32,100 +32,104 @@
 			:limit.sync="listQuery.pageSize"
 			:page.sync="listQuery.pageNo"
 			:total="listQuery.total"
-			@pagination="getDataList" />
-		<!-- <div>
-			<el-button @click="down()">1111</el-button>
-			<el-table :data="tableData1" stripe style="width: 100%">
-				<el-table-column prop="date" label="日期" width="180" />
-				<el-table-column prop="name" label="姓名" />
-				<el-table-column prop="address" label="地址" />
-			</el-table>
+			@pagination="getDataList"
+		/>
+		<!-- <div v-show="false" ref="pdf">
+			<base-table
+				v-loading="dataListLoading"
+				:table-props="tableProps"
+				:page="listQuery.pageNo"
+				:limit="listQuery.pageSize"
+				:table-data="selectedList"
+			/>
 		</div> -->
+		<div ref="pdf" v-show="false">
+			<el-table :data="selectedList" stripe border style="width: 100%">
+				<el-table-column prop="reportType" label="报表类型" />
+				<el-table-column prop="reportStartTime" label="统计开始时间" />
+				<el-table-column prop="reportEndTime" label="统计结束时间" />
+				<el-table-column prop="proLineName" label="产线名称" />
+				<el-table-column prop="inputNum" label="投入数量/片" />
+				<el-table-column prop="outputNum" label="产出数量/片" />
+				<el-table-column prop="outputArea" label="产出面积/㎡" />
+				<el-table-column prop="lossArea" label="损耗面积/㎡" />
+				<el-table-column prop="lossRatio" label="损耗比例%" />
+			</el-table>
+		</div>
+		<el-dialog
+			title="提示"
+			:visible.sync="dialogVisible"
+			width="30%"
+			:before-close="handleClose">
+			<el-button type="primary" @click="exportXlsx">xlsx</el-button>
+  		<el-button type="success" @click="exportPdf">pdf</el-button>
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="dialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+			</span>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
 import { parseTime } from '../../mixins/code-filter';
-import {
-	getFactoryPage,
-	exportFactoryExcel,
-} from '@/api/core/base/factory';
+import { getPdlAutoReport, getPdList } from '@/api/core/monitoring/auto'
+// import jsPDF from 'jspdf'
+// import html2canvas from 'html2canvas'
+// import codeFilter from '../../mixins/code-filter'
 import * as XLSX from 'xlsx'
 import FileSaver from 'file-saver'
 
-const tableData1 = [
-	{
-		date: '2016-05-03',
-		name: 'fom',
-		address: 'No'
-	},
-	{
-		date: '2016-05-02',
-		name: 'fom',
-		address: '189'
-	},
-	{
-		date: '2016-0225-03',
-		name: 'fom',
-		address: 'Ndddo'
-	},
-	{
-		date: '2016-04445-02',
-		name: 'fom',
-		address: '18edd9'
-	}
-]
-
 const tableProps = [
 	{
-		prop: 'code',
+		prop: 'reportType',
 		label: '报表类型',
-		align: 'center',
+		align: 'center'
 	},
 	{
-		prop: 'createTime',
+		prop: 'reportStartTime',
 		label: '统计开始时间',
 		align: 'center',
 		filter: parseTime,
 	},
 	{
-		prop: 'createTime3',
+		prop: 'reportEndTime',
 		label: '统计结束时间',
 		align: 'center',
 		filter: parseTime,
 	},
 	{
-		prop: 'name',
+		prop: 'proLineName',
 		label: '产线名称',
 		align: 'center',
 	},
 	{
-		prop: 'address',
+		prop: 'inputNum',
 		label: '投入数量/片',
 		align: 'center',
 	},
 	{
-		prop: 'remark44',
+		prop: 'outputNum',
 		label: '产出数量/片',
 		align: 'center',
 	},
 	{
-		prop: 'remark23',
+		prop: 'outputArea',
 		label: '产出面积/㎡',
 		align: 'center',
 	},
 	{
-		prop: 'remark145',
+		prop: 'lossNum',
 		label: '损耗数量/片',
 		align: 'center',
 	},
 	{
-		prop: 'remark22',
+		prop: 'lossArea',
 		label: '损耗面积/㎡',
 		align: 'center',
 	},
 	{
-		prop: 'remark1',
+		prop: 'lossRatio',
 		label: '损耗比例%',
 		align: 'center',
 	}
@@ -135,16 +139,8 @@ export default {
 	data() {
 		return {
 			urlOptions: {
-				getDataListURL: getFactoryPage,
-				exportURL: exportFactoryExcel,
+				getDataListURL: getPdlAutoReport
 			},
-			urlOptions: {
-        getDataListURL: '',
-        deleteURL: '',
-        statusUrl: '',
-        exportURL: ''
-      },
-      tableData1,
       listQuery: {
         pageSize: 10,
         pageNo: 1,
@@ -152,10 +148,12 @@ export default {
       },
       exportLoading: false,
       dataListLoading: false,
+			dialogVisible: false,
       addOrEditTitle: '',
       addOrUpdateVisible: false,
 			tableProps,
 			tableBtn: [],
+			selectedList: [],
 			// tableBtn: [
 			// 	this.$auth.hasPermi(`base:factory:update`)
 			// 		? {
@@ -181,8 +179,21 @@ export default {
 				{
 					type: 'select',
 					label: '报表类型',
-					selectOptions: [],
-					param: 'name',
+					selectOptions: [
+						{
+							id: 1,
+							name: '日'
+						},
+						{
+							id: 2,
+							name: '周'
+						},
+						{
+							id: 3,
+							name: '月'
+						}
+					],
+					param: 'reportType',
 				},
 				{
           type: 'datePicker',
@@ -216,16 +227,63 @@ export default {
 			],
 		};
 	},
-	created() {},
+	created() {
+		this.getDataList()
+		this.getPdLineList()
+	},
 	methods: {
+		exportPdf() {
+			this.pdf()
+			this.dialogVisible = false
+		},
+		exportXlsx() {
+			this.down()
+			this.dialogVisible = false
+		},
+		// imgDownload() {
+		// 	let that = this
+		// 	let img = this.$refs['pdf']
+		// 	// 图片高度
+		// 	var w = parseInt(window.getComputedStyle(img).width)
+		// 	// 图片宽度
+		// 	var h = parseInt(window.getComputedStyle(img).height)
+		// 	// 滚轮置顶，避免留白
+		// 	window.pageYOffset = 0
+		// 	html2canvas(img).then(function(canvas) {
+
+		// 	})
+		// },
+		pdf() {
+			// console.log('打印看看[df]')
+			// const pdf = new jsPDF()
+			// const content = this.$refs.pdf.innerHTML
+			// console.log('打印看看', content)
+			// pdf.text(content, 15, 15)
+			// // pdf.text('Hello world!', 10, 10)
+			// pdf.save('test.pdf')
+			// console.log('打印看看', pdf)
+			const printWindow = window.open('', '_blank')
+			const temp = this.$refs.pdf.innerHTML
+			console.log(temp)
+			printWindow.document.body.innerHTML = temp
+			printWindow.focus()
+			// printWindow.document.writeln(this.$refs.pdf.innerHTML)
+			printWindow.document.close()
+			printWindow.print()
+		},
+		handleClose(done) {
+			this.$confirm('确认关闭？')
+				.then(_ => {
+					done();
+				})
+				.catch(_ => {});
+		},
 		down() {
-			//选中导出时可更改此处数组
-      const selectedData = this.tableData1.slice(0, 2)
-			console.log('你好', selectedData, this.tableData1)
+			//选中导出时可更改此处数组 选中的数组
 			//构建导出的表格数据
 			const exportData = [
-				{date: '日期', name: '姓名', address: '地址'},
-				...selectedData
+				{reportType: '报表类型', reportStartTime: '统计开始时间', reportEndTime: '统计结束时间', proLineName: '产线名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
+				...this.selectedList
 			]
 			//注意表格上绑定id， 获取dom元素
 			const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
@@ -233,7 +291,7 @@ export default {
 			XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
 			const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
 			try {
-				FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), 'hihi.xlsx')
+				FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '产线统计自动报表.xlsx')
 			} catch (e) {
 				console.log(e)
 			}
@@ -241,14 +299,22 @@ export default {
 		selectChange(val) {
       console.log(val)
       this.selectedList = val
+			console.log('勾选数据', this.selectedList)
     },
+		getPdLineList() {
+			getPdList().then((res) => {
+				this.formConfig[0].selectOptions = res.data || []
+			})
+		},
 		buttonClick(val) {
 			switch (val.btnName) {
 				case 'search':
 					this.listQuery.pageNo = 1;
 					this.listQuery.pageSize = 10;
-					this.listQuery.name = val.name;
-					this.listQuery.code = val.code;
+					this.listQuery.lineId = val.line ? val.line : undefined;
+					this.listQuery.reportType = val.reportType ? val.reportType : undefined;
+					this.listQuery.reportStartTime = [new Date(val.timeVal[0]).getTime()];
+					this.listQuery.reportEndTime = [new Date(val.timeVal[1]).getTime()];
 					this.getDataList();
 					break;
 				case 'export':
@@ -262,7 +328,10 @@ export default {
     getDataList() {
       this.dataListLoading = true;
       this.urlOptions.getDataListURL(this.listQuery).then(response => {
-        this.tableData = response.data.list;
+        this.tableData = response.data.list.map(item => {
+					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月'
+					return item
+				});
         this.total = response.data.total;
         this.dataListLoading = false;
       });
@@ -279,17 +348,15 @@ export default {
       this.getDataList();
     },
 		handleExport() {
-      // 处理查询参数
-      let params = { ...this.queryParams };
-      params.pageNo = undefined;
-      params.pageSize = undefined;
-      this.$modal.confirm('是否确认导出所有数据项?').then(() => {
-        this.exportLoading = true;
-        return this.urlOptions.exportURL(params);
-      }).then(response => {
-        this.$download.excel(response, '工厂.xls');
-        this.exportLoading = false;
-      }).catch(() => { });
+			if (this.selectedList.length === 0) {
+				this.selectedList = this.tableData
+			}
+			this.dialogVisible = true
+      // this.$modal.confirm('是否确认导出所选数据项?').then(() => {
+      //   this.exportLoading = true;
+      //   // this.down()
+			// 	this.pdf()
+      // }).catch(() => { });
     }
 	},
 };

src/views/core/monitoring/data/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: Do not edit
  * @Date: 2023-08-29 14:59:29
- * @LastEditTime: 2023-08-31 15:15:31
+ * @LastEditTime: 2023-09-16 17:42:37
  * @LastEditors: DY
  * @Description: 
 -->
@@ -33,50 +33,65 @@
 			:page.sync="listQuery.pageNo"
 			:total="listQuery.total"
 			@pagination="getDataList" />
+		<div ref="pdf" v-show="false">
+			<el-table :data="selectedList" stripe border style="width: 100%">
+				<el-table-column prop="proLineName" label="产线名称" />
+				<el-table-column prop="inputNum" label="投入数量/片" />
+				<el-table-column prop="outputNum" label="产出数量/片" />
+				<el-table-column prop="outputArea" label="产出面积/㎡" />
+				<el-table-column prop="lossNum" label="损耗数量/片" />
+				<el-table-column prop="lossArea" label="损耗面积/㎡" />
+				<el-table-column prop="lossRatio" label="损耗比例%" />
+			</el-table>
+		</div>
+		<el-dialog
+			title="提示"
+			:visible.sync="dialogVisible"
+			width="30%"
+			:before-close="handleClose">
+			<el-button type="primary" @click="exportXlsx">xlsx</el-button>
+  		<el-button type="success" @click="exportPdf">pdf</el-button>
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="dialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+			</span>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
-import {
-	getFactoryPage,
-	exportFactoryExcel,
-} from '@/api/core/base/factory';
+import { getPdlDataSearch, getPdList } from '@/api/core/monitoring/data'
+import * as XLSX from 'xlsx'
+import FileSaver from 'file-saver'
 
 const tableProps = [
 	{
-		prop: 'name',
-		label: '产线名称',
-		align: 'center',
+		prop: 'proLineName',
+		label: '产线名称'
 	},
 	{
-		prop: 'address',
-		label: '投入数量/片',
-		align: 'center',
+		prop: 'inputNum',
+		label: '投入数量/片'
 	},
 	{
-		prop: 'remark44',
-		label: '产出数量/片',
-		align: 'center',
+		prop: 'outputNum',
+		label: '产出数量/片'
 	},
 	{
-		prop: 'remark23',
-		label: '产出面积/㎡',
-		align: 'center',
+		prop: 'outputArea',
+		label: '产出面积/㎡'
 	},
 	{
-		prop: 'remark145',
-		label: '损耗数量/片',
-		align: 'center',
+		prop: 'lossNum',
+		label: '损耗数量/片'
 	},
 	{
-		prop: 'remark22',
-		label: '损耗面积/㎡',
-		align: 'center',
+		prop: 'lossArea',
+		label: '损耗面积/㎡'
 	},
 	{
-		prop: 'remark1',
-		label: '损耗比例%',
-		align: 'center',
+		prop: 'lossRate',
+		label: '损耗比例%'
 	}
 ];
 
@@ -84,28 +99,24 @@ export default {
 	data() {
 		return {
 			urlOptions: {
-				getDataListURL: getFactoryPage,
-				exportURL: exportFactoryExcel,
+				getDataListURL: getPdlDataSearch
 			},
-			urlOptions: {
-        getDataListURL: '',
-        deleteURL: '',
-        statusUrl: '',
-        exportURL: ''
-      },
       tableData: [],
       listQuery: {
         pageSize: 10,
         pageNo: 1,
         total: 1,
+				proLineId: undefined
       },
       exportLoading: false,
       dataListLoading: false,
+			dialogVisible: false,
       addOrEditTitle: '',
       addOrUpdateVisible: false,
 			tableProps,
 			tableBtn: [],
 			tableData: [],
+			selectedList: [],
 			formConfig: [
 				{
 					type: 'select',
@@ -145,8 +156,57 @@ export default {
 			],
 		};
 	},
-	created() {},
+	created() {
+		this.getDataList()
+		this.getPdLineList()
+	},
 	methods: {
+		exportPdf() {
+			this.pdf()
+			this.dialogVisible = false
+		},
+		exportXlsx() {
+			this.down()
+			this.dialogVisible = false
+		},
+		pdf() {
+			const printWindow = window.open('', '_blank')
+			const temp = this.$refs.pdf.innerHTML
+			console.log(temp)
+			printWindow.document.body.innerHTML = temp
+			printWindow.document.close()
+			printWindow.print()
+		},
+		down() {
+			//选中导出时可更改此处数组 选中的数组
+			//构建导出的表格数据
+			const exportData = [
+				{proLineName: '产线名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
+				...this.selectedList
+			]
+			//注意表格上绑定id， 获取dom元素
+			const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
+			const workbook = XLSX.utils.book_new()
+			XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
+			const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
+			try {
+				FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '产线统计数据查询.xlsx')
+			} catch (e) {
+				console.log(e)
+			}
+    },
+		handleClose(done) {
+			this.$confirm('确认关闭？')
+				.then(_ => {
+					done();
+				})
+				.catch(_ => {});
+		},
+		getPdLineList() {
+			getPdList().then((res) => {
+				this.formConfig[0].selectOptions = res.data || []
+			})
+		},
 		selectChange(val) {
       console.log(val)
       this.selectedList = val
@@ -156,8 +216,9 @@ export default {
 				case 'search':
 					this.listQuery.pageNo = 1;
 					this.listQuery.pageSize = 10;
-					this.listQuery.name = val.name;
-					this.listQuery.code = val.code;
+					this.listQuery.proLineId = val.line ? val.line : undefined;
+					this.listQuery.startTime = val.timeVal ? new Date(val.timeVal[0]).getTime() : undefined;
+					this.listQuery.endTime = val.timeVal ? new Date(val.timeVal[1]).getTime() : undefined;
 					this.getDataList();
 					break;
 				case 'export':
@@ -171,7 +232,7 @@ export default {
     getDataList() {
       this.dataListLoading = true;
       this.urlOptions.getDataListURL(this.listQuery).then(response => {
-        this.tableData = response.data.list;
+        this.tableData = response.data;
         this.total = response.data.total;
         this.dataListLoading = false;
       });
@@ -188,17 +249,21 @@ export default {
       this.getDataList();
     },
 		handleExport() {
+			if (this.selectedList.length === 0) {
+				this.selectedList = this.tableData
+			}
+			this.dialogVisible = true
       // 处理查询参数
-      let params = { ...this.queryParams };
-      params.pageNo = undefined;
-      params.pageSize = undefined;
-      this.$modal.confirm('是否确认导出所有数据项?').then(() => {
-        this.exportLoading = true;
-        return this.urlOptions.exportURL(params);
-      }).then(response => {
-        this.$download.excel(response, '工厂.xls');
-        this.exportLoading = false;
-      }).catch(() => { });
+      // let params = { ...this.queryParams };
+      // params.pageNo = undefined;
+      // params.pageSize = undefined;
+      // this.$modal.confirm('是否确认导出所有数据项?').then(() => {
+      //   this.exportLoading = true;
+      //   return this.urlOptions.exportURL(params);
+      // }).then(response => {
+      //   this.$download.excel(response, '工厂.xls');
+      //   this.exportLoading = false;
+      // }).catch(() => { });
     }
 	},
 };

src/views/core/monitoring/data24/index.vue

@@ -0,0 +1,207 @@
+<!-- 
+    filename: index.vue
+    author: liubin
+    date: 2023-08-04 14:44:58
+    description: 设备24小时生产记录
+-->
+<template>
+	<div class="app-container">
+		<SearchBar
+			:formConfigs="[{ label: '设备近24小时产线生产数据', type: 'title' }]"
+			ref="search-bar" />
+		<el-skeleton v-if="initing" :rows="6" animated />
+		<base-table
+			v-else
+			:span-method="mergeColumnHandler"
+			:table-props="tableProps"
+			:table-data="tableData"
+			@emitFun="handleEmitFun"></base-table>
+		<!-- :page="queryParams.pageNo"
+			:limit="queryParams.pageSize" -->
+	</div>
+</template>
+
+<script>
+import { getPdlDataOneDay } from '@/api/core/monitoring/data24'
+
+export default {
+	name: 'productionLineData24',
+	components: {},
+	props: {},
+	data() {
+		return {
+      urlOptions: {
+				getDataListURL: getPdlDataOneDay
+			},
+			initing: false,
+			queryParams: {
+				pageNo: 1,
+				pageSize: 10,
+			},
+			list: [],
+			arr: [],
+			spanArr: [], 
+			timeList: [],
+			tableData: [],
+			tableProps: [],
+			spanInfo: {},
+		};
+	},
+	computed: {},
+	mounted() {
+		this.getList();
+	},
+	methods: {
+		/** 构建tableProps - 依据第一个元素所提供的信息 */
+		buildProps(plData) {
+			plData.forEach(item => {
+				this.timeList.push(item.name)
+			})
+			const timeArray = Array.from(new Set(this.timeList))
+			console.log('nihc', timeArray)
+			for (const times of timeArray) {
+				if (times !== '投入数量' && times !== '产出数量' && times !== '报废数量' && times !== '产出面积') {
+					const subprop = {
+						label: times,
+						align: 'center',
+						children: [
+							{ prop: times + '_in', label: '投入数量', align: 'center' },
+							{ prop: times + '_out', label: '产出数量', align: 'center' },
+							{ prop: times + '_junk', label: '报废数量', align: 'center' },
+							{ prop: times + '_area', label: '产出面积', align: 'center' }
+						]
+					}
+					this.arr.push(subprop)
+				}
+			}
+			this.tableProps = this.arr
+		},
+		setRowSpan(arr) {
+      let count = 0
+      arr.forEach((item, index) => {
+        if(index === 0) {
+          this.spanArr.push(1)
+        } else {
+          if (item === arr[index - 1]) {
+            this.spanArr[count] += 1
+            this.spanArr.push(0)
+          } else {
+            count = index
+            this.spanArr.push(1)
+          }
+        }
+      })
+      console.log('打印数组长度', this.spanArr)
+    },
+
+		/** 把 list 里的数据转换成 tableProps 对应的格式 */
+		convertList(list) {
+			let sectionArr= []
+			console.log('打印看下数据list', list)
+			list.forEach((ele, index) => {
+				let tempData = []
+				ele.data.forEach(item => {
+					item.children.forEach(params => {
+						if (params.dynamicName === '投入数量') {
+							tempData[item.dynamicName + '_in'] = params.dynamicValue
+						} else if (params.dynamicName === '产出数量') {
+							tempData[item.dynamicName + '_out'] = params.dynamicValue
+						} else if (params.dynamicName === '报废数量') {
+							tempData[item.dynamicName + '_junk'] = params.dynamicValue
+						} else {
+							tempData[item.dynamicName + '_area'] = params.dynamicValue
+						}
+					})
+				})
+				tempData['proLineName'] = ele.proLineName
+				tempData['spec'] = ele.spec
+				this.tableData.push(tempData)
+				console.log('看看数据', this.tableData, tempData)
+				const { sectionName } = tempData
+				sectionArr.push(sectionName)
+			})
+			this.setRowSpan(sectionArr)
+			console.log('工段名称列表', sectionArr)
+		},
+
+		buildData(data) {
+			this.convertList(data);
+		},
+
+		/** 合并table列的规则 */
+		mergeColumnHandler({ row, column, rowIndex, columnIndex }) {
+			if (columnIndex == 0) {
+				if (this.spanArr[rowIndex]) {
+					return [
+						this.spanArr[rowIndex], // row span
+						1, // col span
+					];
+				} else {
+					return [0, 0];
+				}
+			}
+		},
+
+		async getList() {
+      this.urlOptions.getDataListURL().then(res => {
+        console.log('看看数据', res)
+				this.arr = [
+          {
+            prop: 'proLineName',
+            label: '生产线',
+            align: 'center',
+          },
+          {
+            prop: 'spec',
+            label: '产品规格',
+            align: 'center',
+          }
+				]
+				this.buildProps(res.data.nameData);
+				this.buildData(res.data.data);
+      })
+
+			// // const data = this.res.data;
+			// // console.log('recent-24', data);
+
+			// this.initing = true;
+			
+			// this.queryParams.pageSize = this.list.length;
+
+			// setTimeout(() => {
+			// 	this.initing = false;
+			// }, 1000);
+		},
+
+		handleEmitFun(payload) {
+			console.log('payload', payload);
+		},
+	},
+};
+</script>
+
+<style scoped lang="scss">
+::-webkit-scrollbar {
+	display: none;
+}
+
+pre {
+	margin: 10px;
+	background: #f6f8faf6;
+	border: 1px solid #e1e4e8;
+	padding: 12px;
+	border-radius: 12px;
+	position: fixed;
+	// top: 15vh;
+	top: 10vh;
+	left: 0;
+	max-height: 80vh;
+	overflow-y: auto;
+	z-index: 100000;
+	box-shadow: 0 0 32px 12px #0001;
+}
+
+code {
+	font-family: 'IntelOne Mono', 'Ubuntu', 'Courier New', Courier, monospace;
+}
+</style>

src/views/core/monitoring/sectionStatistics/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: Do not edit
  * @Date: 2023-08-29 14:59:29
- * @LastEditTime: 2023-08-31 15:31:40
+ * @LastEditTime: 2023-09-16 17:41:53
  * @LastEditors: DY
  * @Description: 
 -->
@@ -9,6 +9,7 @@
 	<div class="app-container">
 		<search-bar
 			:formConfigs="formConfig"
+			:isFold="true"
 			ref="searchBarForm"
 			@headBtnClick="buttonClick" />
 		<base-table
@@ -33,73 +34,88 @@
 			:page.sync="listQuery.pageNo"
 			:total="listQuery.total"
 			@pagination="getDataList" />
+		<div ref="pdf" v-show="false">
+			<el-table :data="selectedList" stripe border style="width: 100%">
+				<el-table-column prop="reportType" label="产线类型" />
+				<el-table-column prop="reportStartTime" label="统计开始时间" />
+				<el-table-column prop="reportEndTime" label="统计结束时间" />
+				<el-table-column prop="proLineName" label="产线名称" />
+				<el-table-column prop="sectionName" label="工段名称" />
+				<el-table-column prop="inputNum" label="投入数量/片" />
+				<el-table-column prop="outputNum" label="产出数量/片" />
+				<el-table-column prop="outputArea" label="产出面积/㎡" />
+				<el-table-column prop="lossNum" label="损耗数量/片" />
+				<el-table-column prop="lossArea" label="损耗面积/㎡" />
+				<el-table-column prop="lossRatio" label="损耗比例%" />
+			</el-table>
+		</div>
+		<el-dialog
+			title="提示"
+			:visible.sync="dialogVisible"
+			width="30%"
+			:before-close="handleClose">
+			<el-button type="primary" @click="exportXlsx">xlsx</el-button>
+  		<el-button type="success" @click="exportPdf">pdf</el-button>
+			<span slot="footer" class="dialog-footer">
+				<el-button @click="dialogVisible = false">取 消</el-button>
+				<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+			</span>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
 import { parseTime } from '../../mixins/code-filter';
-import {
-	getFactoryPage,
-	exportFactoryExcel,
-} from '@/api/core/base/factory';
+import { getWorkshopSectionList, getPdList, getSectionAutoReport  } from '@/api/core/monitoring/sectionStatistics'
+import * as XLSX from 'xlsx'
+import FileSaver from 'file-saver'
 
 const tableProps = [
 	{
-		prop: 'code',
-		label: '产线类型',
-		align: 'center',
+		prop: 'reportType',
+		label: '产线类型'
 	},
 	{
-		prop: 'createTime',
+		prop: 'reportStartTime',
 		label: '统计开始时间',
-		align: 'center',
 		filter: parseTime,
 	},
 	{
-		prop: 'createTime3',
+		prop: 'reportEndTime',
 		label: '统计结束时间',
-		align: 'center',
 		filter: parseTime,
 	},
 	{
-		prop: 'name',
-		label: '产线名称',
-		align: 'center',
+		prop: 'lineName',
+		label: '产线名称'
 	},
 	{
-		prop: 'name1',
-		label: '工段名称',
-		align: 'center',
+		prop: 'sectionName',
+		label: '工段名称'
 	},
 	{
-		prop: 'address',
-		label: '投入数量/片',
-		align: 'center',
+		prop: 'inputNum',
+		label: '投入数量/片'
 	},
 	{
-		prop: 'remark44',
-		label: '产出数量/片',
-		align: 'center',
+		prop: 'outputNum',
+		label: '产出数量/片'
 	},
 	{
-		prop: 'remark23',
-		label: '产出面积/㎡',
-		align: 'center',
+		prop: 'outputArea',
+		label: '产出面积/㎡'
 	},
 	{
-		prop: 'remark145',
-		label: '损耗数量/片',
-		align: 'center',
+		prop: 'lossNum',
+		label: '损耗数量/片'
 	},
 	{
-		prop: 'remark22',
-		label: '损耗面积/㎡',
-		align: 'center',
+		prop: 'lossArea',
+		label: '损耗面积/㎡'
 	},
 	{
-		prop: 'remark1',
-		label: '损耗比例%',
-		align: 'center',
+		prop: 'lossRatio',
+		label: '损耗比例%'
 	}
 ];
 
@@ -107,15 +123,8 @@ export default {
 	data() {
 		return {
 			urlOptions: {
-				getDataListURL: getFactoryPage,
-				exportURL: exportFactoryExcel,
+				getDataListURL: getSectionAutoReport
 			},
-			urlOptions: {
-        getDataListURL: '',
-        deleteURL: '',
-        statusUrl: '',
-        exportURL: ''
-      },
       tableData: [],
       listQuery: {
         pageSize: 10,
@@ -124,6 +133,8 @@ export default {
       },
       exportLoading: false,
       dataListLoading: false,
+			selectedList: [],
+			dialogVisible: false,
       addOrEditTitle: '',
       addOrUpdateVisible: false,
 			tableProps,
@@ -145,8 +156,21 @@ export default {
 				{
 					type: 'select',
 					label: '报表类型',
-					selectOptions: [],
-					param: 'name',
+					selectOptions: [
+						{
+							id: 1,
+							name: '日'
+						},
+						{
+							id: 2,
+							name: '周'
+						},
+						{
+							id: 3,
+							name: '月'
+						}
+					],
+					param: 'reportType',
 				},
 				{
           type: 'datePicker',
@@ -158,8 +182,7 @@ export default {
           startPlaceholder: '开始时间',
           endPlaceholder: '结束时间',
           param: 'timeVal',
-          defaultSelect: [],
-          width: 350
+          defaultSelect: []
         },
 				{
 					type: 'button',
@@ -180,8 +203,61 @@ export default {
 			],
 		};
 	},
-	created() {},
+	created() {
+		this.getDataList()
+		this.getPdLineList()
+	},
 	methods: {
+		exportPdf() {
+			this.pdf()
+			this.dialogVisible = false
+		},
+		exportXlsx() {
+			this.down()
+			this.dialogVisible = false
+		},
+		pdf() {
+			const printWindow = window.open('', '_blank')
+			const temp = this.$refs.pdf.innerHTML
+			console.log(temp)
+			printWindow.document.body.innerHTML = temp
+			printWindow.document.close()
+			printWindow.print()
+		},
+		down() {
+			//选中导出时可更改此处数组 选中的数组
+			//构建导出的表格数据
+			const exportData = [
+				{reportType: '产线类型', reportStartTime: '统计开始时间', reportEndTime: '统计结束时间', lineName: '产线名称', sectionName: '工段名称', inputNum: '投入数量/片', outputNum: '产出数量/片', outputArea: '产出面积/㎡', lossNum: '损耗数量/片', lossArea: '损耗面积/㎡', lossRatio: '损耗比例%' },
+				...this.selectedList
+			]
+			//注意表格上绑定id， 获取dom元素
+			const worksheet = XLSX.utils.json_to_sheet(exportData, { skipHeader: true })
+			const workbook = XLSX.utils.book_new()
+			XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1")
+			const workbookOutput = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' })
+			try {
+				FileSaver.saveAs(new Blob([workbookOutput], { type: 'application/octet-stream' }), '工段统计自动报表.xlsx')
+			} catch (e) {
+				console.log(e)
+			}
+    },
+		handleClose(done) {
+			this.$confirm('确认关闭？')
+				.then(_ => {
+					done();
+				})
+				.catch(_ => {});
+		},
+		getPdLineList() {
+			getPdList().then((res) => {
+				this.formConfig[0].selectOptions = res.data || []
+			})
+			// 获取工段list
+			getWorkshopSectionList().then((res) => {
+				this.formConfig[1].selectOptions = res.data || []
+			})
+		},
 		selectChange(val) {
       console.log(val)
       this.selectedList = val
@@ -191,8 +267,11 @@ export default {
 				case 'search':
 					this.listQuery.pageNo = 1;
 					this.listQuery.pageSize = 10;
-					this.listQuery.name = val.name;
-					this.listQuery.code = val.code;
+					this.listQuery.lineId = val.line ? val.line : undefined;
+					this.listQuery.sectionId = val.section ? val.section : undefined;
+					this.listQuery.reportType = val.reportType ? val.reportType : undefined;
+					this.listQuery.reportStartTime = [new Date(val.timeVal[0]).getTime()];
+					this.listQuery.reportEndTime = [new Date(val.timeVal[1]).getTime()];
 					this.getDataList();
 					break;
 				case 'export':
@@ -206,7 +285,10 @@ export default {
     getDataList() {
       this.dataListLoading = true;
       this.urlOptions.getDataListURL(this.listQuery).then(response => {
-        this.tableData = response.data.list;
+        this.tableData = response.data.list.map(item => {
+					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月'
+					return item
+				});
         this.total = response.data.total;
         this.dataListLoading = false;
       });
@@ -223,17 +305,21 @@ export default {
       this.getDataList();
     },
 		handleExport() {
+			if (this.selectedList.length === 0) {
+				this.selectedList = this.tableData
+			}
+			this.dialogVisible = true
       // 处理查询参数
-      let params = { ...this.queryParams };
-      params.pageNo = undefined;
-      params.pageSize = undefined;
-      this.$modal.confirm('是否确认导出所有数据项?').then(() => {
-        this.exportLoading = true;
-        return this.urlOptions.exportURL(params);
-      }).then(response => {
-        this.$download.excel(response, '工厂.xls');
-        this.exportLoading = false;
-      }).catch(() => { });
+      // let params = { ...this.queryParams };
+      // params.pageNo = undefined;
+      // params.pageSize = undefined;
+      // this.$modal.confirm('是否确认导出所有数据项?').then(() => {
+      //   this.exportLoading = true;
+      //   return this.urlOptions.exportURL(params);
+      // }).then(response => {
+      //   this.$download.excel(response, '工厂.xls');
+      //   this.exportLoading = false;
+      // }).catch(() => { });
     }
 	},
 };