Compare commits
	
		
			17 Commits
		
	
	
		
			projects/r
			...
			projects/q
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
|  | 1a0d786774 | ||
|  | 1b6e6702ed | ||
|  | f23e025974 | ||
|  | d77bebd375 | ||
| 4225ff35ae | |||
| 33fce6cb7b | |||
| dd85c50077 | |||
| c30bc48259 | |||
| 92b0b78c9d | |||
| 9fec50eccb | |||
|  | a7406e7867 | ||
|  | f3d88638f5 | ||
| acff3b68be | |||
| f24b769305 | |||
| 446fa9a0d1 | |||
| 8d741b8d8a | |||
| 2c1e1845f4 | 
							
								
								
									
										3
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						| @@ -12,8 +12,7 @@ ENV = 'development' | |||||||
| VUE_APP_TITLE = 智能监控分析系统 | VUE_APP_TITLE = 智能监控分析系统 | ||||||
|  |  | ||||||
| # 芋道管理系统/开发环境 | # 芋道管理系统/开发环境 | ||||||
| # VUE_APP_BASE_API = 'http://192.168.8.22:48080' | VUE_APP_BASE_API = 'http://172.16.32.79:48080' | ||||||
| VUE_APP_BASE_API = 'http://172.16.32.79:48082' |  | ||||||
|  |  | ||||||
| # 路由懒加载 | # 路由懒加载 | ||||||
| VUE_CLI_BABEL_TRANSPILE_MODULES = true | VUE_CLI_BABEL_TRANSPILE_MODULES = true | ||||||
|   | |||||||
| @@ -52,6 +52,7 @@ | |||||||
|     "crypto-js": "^4.0.0", |     "crypto-js": "^4.0.0", | ||||||
|     "diagram-js": "^12.3.0", |     "diagram-js": "^12.3.0", | ||||||
|     "echarts": "5.4.0", |     "echarts": "5.4.0", | ||||||
|  |     "el-tree-transfer": "^2.4.7", | ||||||
|     "element-ui": "2.15.12", |     "element-ui": "2.15.12", | ||||||
|     "file-saver": "^2.0.5", |     "file-saver": "^2.0.5", | ||||||
|     "fuse.js": "6.6.2", |     "fuse.js": "6.6.2", | ||||||
|   | |||||||
							
								
								
									
										
											BIN
										
									
								
								public/static/videos/01.webm
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -61,9 +61,9 @@ export function exportFactoryExcel(query) { | |||||||
| // 获取产线设备状态 | // 获取产线设备状态 | ||||||
| export function getLineEqStatus(data) { | export function getLineEqStatus(data) { | ||||||
|   return request({ |   return request({ | ||||||
|     url: '/base/production-line/getLineEqStatus', | 		url: '/monitoring/equipment-monitor/getLineEqStatus', | ||||||
| 		method: 'post', | 		method: 'post', | ||||||
|     data: data | 		data: data, | ||||||
|   }) | 	}); | ||||||
| } | } | ||||||
|  |  | ||||||
|   | |||||||
| @@ -44,25 +44,16 @@ export function getProductAuto(data) { | |||||||
| // 班组自动报表分页 | // 班组自动报表分页 | ||||||
| export function getTeamReportPage(data) { | export function getTeamReportPage(data) { | ||||||
|   return request({ |   return request({ | ||||||
| 		url: '/monitoring/group-off-record/page', |     url: '/monitoring/team-auto-report/page', | ||||||
|     method: 'post', |     method: 'post', | ||||||
| 		data: data, |     data: data | ||||||
| 	}); |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| // 班组自动报表分页详细 | // 班组自动报表分页详细 | ||||||
| export function getTeamReportPageDet(id) { | export function getTeamReportPageDet(id) { | ||||||
|   return request({ |   return request({ | ||||||
|     url: '/monitoring/group-off-record/get?id=' + id, |     url: '/monitoring/team-auto-report/pageDet?id=' + id, | ||||||
|     method: 'get', |     method: 'get', | ||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
| export function exportGroupProductReportExcel(data) { |  | ||||||
|   return request({ |  | ||||||
| 		url: '/monitoring/group-off-record/export-det-excel', |  | ||||||
| 		method: 'get', |  | ||||||
| 		params: data, |  | ||||||
| 		responseType: 'blob', |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
|   | |||||||
| @@ -1,18 +0,0 @@ | |||||||
| import request from '@/utils/request' |  | ||||||
| // 获得工厂分页 |  | ||||||
| export function getMaterialReceiptIssuePageData(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/material-warehouse-his/page', |  | ||||||
| 		method: 'post', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
|  |  | ||||||
|  |  | ||||||
| export function createMaterialIssue(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/material-warehouse-his/create', |  | ||||||
| 		method: 'post', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
| @@ -1,45 +0,0 @@ | |||||||
| import request from '@/utils/request' |  | ||||||
|  |  | ||||||
| export function getOrderPage(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/core-work-order/page', |  | ||||||
| 		method: 'post', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| export function updateOrderData(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/core-work-order/updatee', |  | ||||||
| 		method: 'put', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| export function createOrderData(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/core-work-order/create', |  | ||||||
| 		method: 'post', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
| export function getOrderData(id) { |  | ||||||
|   return request({ |  | ||||||
| 		url: '/base/core-work-order/get?id=' + id, |  | ||||||
| 		method: 'get', |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
| export function getOrderCode(data) { |  | ||||||
| 	return request({ |  | ||||||
| 		url: '/base/core-work-order/getCode', |  | ||||||
| 		method: 'get', |  | ||||||
| 		data: data, |  | ||||||
| 	}); |  | ||||||
| } |  | ||||||
|  |  | ||||||
| export function deleteOrder(id) { |  | ||||||
|   return request({ |  | ||||||
|     url: '/base/core-work-order/delete?id=' + id, |  | ||||||
|     method: 'delete' |  | ||||||
|   }) |  | ||||||
| } |  | ||||||
							
								
								
									
										20
									
								
								src/assets/icons/svg/dataBoard1.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,20 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <title>编组备份</title> | ||||||
|  |     <g id="秦皇岛/北方压延" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="现场看板tc—整体产线" transform="translate(-38.175000, -126.808988)"> | ||||||
|  |             <g id="编组备份" transform="translate(38.175000, 126.808988)"> | ||||||
|  |                 <polygon id="Fill-1" fill="#CAE5DD" opacity="0" points="0 32 32 32 32 0 0 0"></polygon> | ||||||
|  |                 <path d="M24.1201333,5.07973333 L22.1468,5.07973333 L22.1468,6.3064 L24.1201333,6.3064 C24.7308,6.3064 25.2268,6.8024 25.2268,7.41306667 L25.2268,25.4530667 C25.2268,26.0650667 24.7308,26.5597333 24.1201333,26.5597333 L7.93346667,26.5597333 C7.32146667,26.5597333 6.8268,26.0650667 6.8268,25.4530667 L6.8268,7.41306667 C6.8268,6.8024 7.32146667,6.3064 7.93346667,6.3064 L10.2001333,6.3064 L10.2001333,5.07973333 L7.93346667,5.07973333 C6.64813333,5.08773333 5.6068,6.12773333 5.60013333,7.41306667 L5.60013333,25.4530667 C5.6068,26.7384 6.64813333,27.7797333 7.93346667,27.7864 L24.1334667,27.7864 C25.4188,27.7797333 26.4588,26.7384 26.4668,25.4530667 L26.4668,7.41306667 C26.4588,6.1224 25.4108,5.07973333 24.1201333,5.07973333" id="Fill-3" fill="#6EF9DE"></path> | ||||||
|  |                 <path d="M7.93333333,5.56026667 C6.90933333,5.56026667 6.08,6.3896 6.08,7.4136 L6.08,25.4536 C6.08,26.4776 6.90933333,27.3069333 7.93333333,27.3069333 L24.1333333,27.3069333 C25.156,27.3069333 25.9866667,26.4776 25.9866667,25.4536 L25.9866667,7.4136 C25.9866667,6.3896 25.156,5.56026667 24.1333333,5.56026667 L22.6,5.56026667 L22.6,5.78693333 L24.0933333,5.78693333 C24.9613333,5.78693333 25.6666667,6.49093333 25.6666667,7.36026667 L25.6666667,25.4002667 C25.6666667,26.2682667 24.9613333,26.9736 24.0933333,26.9736 L7.93333333,26.9736 C7.064,26.9736 6.36,26.2682667 6.36,25.4002667 L6.36,7.4136 C6.33066667,6.54426667 7.01066667,5.81626667 7.87866667,5.78693333 C7.89733333,5.78693333 7.91466667,5.78693333 7.93333333,5.78693333 L9.73333333,5.78693333 L9.73333333,5.50693333 L7.93333333,5.56026667 Z M24.8266667,28.2536 L7.21333333,28.2536 C6.05733333,28.2536 5.12,27.3162667 5.12,26.1602667 L5.12,6.70693333 C5.12,5.55093333 6.05733333,4.6136 7.21333333,4.6136 L10.6666667,4.6136 L10.6666667,6.78693333 L8.81333333,6.78693333 C7.97333333,6.78693333 7.29333333,7.46693333 7.29333333,8.30693333 L7.29333333,24.5602667 C7.29333333,25.3989333 7.97333333,26.0802667 8.81333333,26.0802667 L23.2266667,26.0802667 C24.0666667,26.0802667 24.7466667,25.3989333 24.7466667,24.5602667 L24.7466667,8.30693333 C24.7466667,7.46693333 24.0666667,6.78693333 23.2266667,6.78693333 L21.68,6.78693333 L21.68,4.6136 L24.8266667,4.6136 C25.9826667,4.6136 26.92,5.55093333 26.92,6.70693333 L26.92,26.1602667 C26.92,27.3162667 25.9826667,28.2536 24.8266667,28.2536 L24.8266667,28.2536 Z" id="Fill-5" fill="#6EF9DE"></path> | ||||||
|  |                 <path d="M11.3468,3.3864 L20.9068,3.3864 C21.7534667,3.3864 22.4401333,4.07306667 22.4401333,4.91973333 L22.4401333,6.1864 C22.4401333,7.03306667 21.7534667,7.71973333 20.9068,7.71973333 L11.3468,7.71973333 C10.5001333,7.71973333 9.81346667,7.03306667 9.81346667,6.1864 L9.81346667,4.91973333 C9.81346667,4.07306667 10.5001333,3.3864 11.3468,3.3864" id="Fill-7" fill="#6EF9DE"></path> | ||||||
|  |                 <path d="M21.7732,11.3864 C21.7732,12.0530667 21.5065333,12.3864 20.9598667,12.3864 L13.1065333,12.3864 C12.5732,12.3864 12.2932,12.0530667 12.2932,11.3864 C12.2932,10.7197333 12.5732,10.3997333 13.1065333,10.3997333 L20.9598667,10.3997333 C21.5065333,10.3997333 21.7732,10.7330667 21.7732,11.3864" id="Fill-9" fill="#6EF9E1"></path> | ||||||
|  |                 <path d="M10.2666667,10.4130667 L10.28,10.4130667 C10.824,10.4130667 11.2666667,10.8557333 11.2666667,11.3997333 L11.2666667,11.4130667 C11.2666667,11.9584 10.824,12.3997333 10.28,12.3997333 L10.2666667,12.3997333 C9.72133333,12.3997333 9.28,11.9584 9.28,11.4130667 L9.28,11.3997333 C9.28,10.8557333 9.72133333,10.4130667 10.2666667,10.4130667" id="Fill-11" fill="#6DF8E1"></path> | ||||||
|  |                 <path d="M21.7732,16.3597333 C21.7732,17.0264 21.3998667,17.3597333 20.6398667,17.3597333 L13.4398667,17.3597333 C12.6798667,17.3597333 12.2932,17.0264 12.2932,16.3597333 C12.2932,15.6930667 12.6798667,15.3597333 13.4398667,15.3597333 L20.6398667,15.3597333 C21.3998667,15.3597333 21.7732,15.6930667 21.7732,16.3597333" id="Fill-13" fill="#6EF9E1"></path> | ||||||
|  |                 <path d="M10.2666667,15.4130667 L10.28,15.4130667 C10.824,15.4130667 11.2666667,15.8557333 11.2666667,16.3997333 L11.2666667,16.4130667 C11.2666667,16.9584 10.824,17.3997333 10.28,17.3997333 L10.2666667,17.3997333 C9.72133333,17.3997333 9.28,16.9584 9.28,16.4130667 L9.28,16.3997333 C9.28,15.8557333 9.72133333,15.4130667 10.2666667,15.4130667" id="Fill-15" fill="#6DF8E1"></path> | ||||||
|  |                 <path d="M21.7732,21.3597333 C21.7732,22.0264 21.5065333,22.3597333 20.9598667,22.3597333 L13.1065333,22.3597333 C12.5732,22.3597333 12.2932,22.0264 12.2932,21.3597333 C12.2932,20.6930667 12.5732,20.3597333 13.1065333,20.3597333 L20.9598667,20.3597333 C21.5065333,20.3597333 21.7732,20.6930667 21.7732,21.3597333" id="Fill-17" fill="#6EF9E1"></path> | ||||||
|  |                 <path d="M10.2666667,20.3864 L10.28,20.3864 C10.824,20.3864 11.2666667,20.8290667 11.2666667,21.3730667 L11.2666667,21.3864 C11.2666667,21.9317333 10.824,22.3730667 10.28,22.3730667 L10.2666667,22.3730667 C9.72133333,22.3730667 9.28,21.9317333 9.28,21.3864 L9.28,21.3730667 C9.28,20.8290667 9.72133333,20.3864 10.2666667,20.3864" id="Fill-19" fill="#6DF8E1"></path> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 5.6 KiB | 
							
								
								
									
										18
									
								
								src/assets/icons/svg/dataBoard2.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,18 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <title>切片</title> | ||||||
|  |     <defs> | ||||||
|  |         <linearGradient x1="100%" y1="81.9999999%" x2="20.318998%" y2="18.0000001%" id="linearGradient-1"> | ||||||
|  |             <stop stop-color="#4BFFC8" offset="0%"></stop> | ||||||
|  |             <stop stop-color="#45F2EC" offset="100%"></stop> | ||||||
|  |         </linearGradient> | ||||||
|  |     </defs> | ||||||
|  |     <g id="秦皇岛/北方压延" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="现场看板tc—整体产线" transform="translate(-35.000000, -741.000000)" fill-rule="nonzero"> | ||||||
|  |             <g id="icon/可视化/柱状图" transform="translate(35.000000, 741.000000)"> | ||||||
|  |                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="32" height="32"></rect> | ||||||
|  |                 <path d="M6.07816026,6.07816026 L6.07816026,23.4413798 L28.4022997,23.4413798 L28.4022997,25.9218397 L3.5977003,25.9218397 L3.5977003,6.07816026 L6.07816026,6.07816026 Z M13.5195401,6.07816026 L13.5195401,22.2011498 L8.55862018,22.2011498 L8.55862018,6.07816026 L13.5195401,6.07816026 Z M20.9609199,11.0390801 L20.9609199,22.2011498 L16,22.2011498 L16,11.0390801 L20.9609199,11.0390801 Z M28.4022997,16 L28.4022997,22.2011498 L23.4413798,22.2011498 L23.4413798,16 L28.4022997,16 Z" id="形状" fill="url(#linearGradient-1)"></path> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 1.5 KiB | 
							
								
								
									
										18
									
								
								src/assets/icons/svg/dataBoard3.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,18 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="27px" height="32px" viewBox="0 0 27 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <title>产线备份 3</title> | ||||||
|  |     <defs> | ||||||
|  |         <linearGradient x1="100%" y1="84.4142661%" x2="20.318998%" y2="15.5857339%" id="linearGradient-1"> | ||||||
|  |             <stop stop-color="#4BFFC8" offset="0%"></stop> | ||||||
|  |             <stop stop-color="#45F2EC" offset="100%"></stop> | ||||||
|  |         </linearGradient> | ||||||
|  |     </defs> | ||||||
|  |     <g id="秦皇岛/北方压延" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="现场看板tc—整体产线" transform="translate(-456.000000, -740.000000)" fill-rule="nonzero"> | ||||||
|  |             <g id="产线备份-3" transform="translate(456.000000, 740.000000)"> | ||||||
|  |                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="27" height="32"></rect> | ||||||
|  |                 <path d="M5.9634842,21.3256682 C5.8209113,21.3358884 5.67787363,21.3358884 5.53530073,21.3256682 L5.53152795,21.3256682 C4.70985419,21.2655042 3.9028068,20.8665317 3.27496659,20.1284294 C1.90834447,18.5219016 1.90834447,15.9172034 3.27496659,14.3106756 C3.5291373,14.011848 3.81269745,13.7686207 4.11471142,13.5809616 L4.11389125,13.5765264 L4.1789034,13.5420735 C4.26583759,13.4907514 4.35456706,13.4437443 4.44485723,13.4011765 L16.0336968,7.2612301 L16.0353372,7.27016472 C18.3137697,6.10911436 21.061777,6.62333696 22.9243013,8.8128968 C25.3585662,11.6745456 25.3585662,16.314119 22.9243013,19.1757678 C21.7290674,20.580881 20.1691859,21.2960361 18.6027704,21.3212973 L18.6035632,21.3256682 L5.9634842,21.3256682 Z M5.625,20 C6.86761875,20 7.875,18.8061 7.875,17.3333333 C7.875,15.8605667 6.86761875,14.6666667 5.625,14.6666667 C4.382325,14.6666667 3.375,15.8605667 3.375,17.3333333 C3.375,18.8061 4.382325,20 5.625,20 Z M18.5625,18.6666667 C20.737088,18.6666667 22.5,16.5773202 22.5,14 C22.5,11.4226798 20.737088,9.33333333 18.5625,9.33333333 C16.3878602,9.33333333 14.625,11.4226798 14.625,14 C14.625,16.5773202 16.3878602,18.6666667 18.5625,18.6666667 Z M4.92857143,22.6666667 L22.5,22.6666667 L22.5,24.8888889 C22.5,25.1343611 22.3081339,25.3333333 22.0714286,25.3333333 L4.5,25.3333333 L4.5,23.1111111 C4.5,22.8656389 4.69186607,22.6666667 4.92857143,22.6666667 Z" id="形状" fill="url(#linearGradient-1)"></path> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 2.3 KiB | 
							
								
								
									
										18
									
								
								src/assets/icons/svg/dataBoard4.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,18 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <title>切片</title> | ||||||
|  |     <defs> | ||||||
|  |         <linearGradient x1="99.4683184%" y1="100%" x2="20.6346149%" y2="7.84095011e-14%" id="linearGradient-1"> | ||||||
|  |             <stop stop-color="#4BFFC8" offset="0%"></stop> | ||||||
|  |             <stop stop-color="#45F2EC" offset="100%"></stop> | ||||||
|  |         </linearGradient> | ||||||
|  |     </defs> | ||||||
|  |     <g id="秦皇岛/北方压延" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="现场看板tc—整体产线" transform="translate(-1514.000000, -127.000000)" fill-rule="nonzero"> | ||||||
|  |             <g id="icon/可视化/模块" transform="translate(1514.000000, 127.000000)"> | ||||||
|  |                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="7.10542736e-14" width="32" height="32"></rect> | ||||||
|  |                 <path d="M25.7527221,14.1816202 L24.188579,14.1816202 L24.188579,9.49373791 C24.1860753,8.90287145 23.7063759,8.4252046 23.1155041,8.42520991 L17.3681876,8.42520991 L17.3681876,6.56551655 C17.370851,5.66122185 17.0084214,4.79412914 16.363022,4.1607133 C15.7176226,3.52729745 14.8438903,3.18118084 13.9398043,3.20079015 C12.066652,3.28658042 10.6006443,4.84522051 10.629641,6.72011209 L10.629641,8.42520991 L4.88232453,8.42520991 C4.29145277,8.4252046 3.81175331,8.90287145 3.80921104,9.49373791 L3.80921104,13.0994515 C3.80682438,13.385621 3.9188086,13.6609038 4.12031265,13.8641155 C4.32181669,14.0673272 4.59614473,14.1816305 4.88232453,14.1816202 L5.48251897,14.1816202 C7.35572581,14.1525356 8.91367406,15.6158797 9.00184091,17.4872366 C9.01900932,18.3913465 8.67055578,19.2641187 8.03543236,19.9078018 C7.40030895,20.5514848 6.53227944,20.9115903 5.62802066,20.9065261 L4.88232453,20.9065261 C4.28968163,20.9065261 3.80921104,21.3869581 3.80921104,21.979601 L3.80921104,27.7269175 C3.80921104,28.3195604 4.28968163,28.8000021 4.88232453,28.8000021 L9.55656609,28.8000021 C9.84153405,28.8012076 10.1151815,28.6885421 10.3166861,28.4870375 C10.5181907,28.2855329 10.6308562,28.0118854 10.629641,27.7269175 L10.629641,27.1949269 C10.6006443,25.3200353 12.066652,23.7613953 13.9398043,23.675605 C14.8438903,23.6559957 15.7176226,24.0021123 16.363022,24.6355281 C17.0084214,25.268944 17.370851,26.1360367 17.3681876,27.0403314 L17.3681876,27.7269175 C17.3669784,28.0110957 17.479021,28.2840495 17.6795401,28.4854219 C17.8800592,28.6867943 18.1525348,28.8000021 18.4367156,28.8000021 L23.1155041,28.8000021 C23.708147,28.8000021 24.188579,28.3195604 24.188579,27.7269175 L24.188579,20.9065261 L25.9027707,20.9065261 C26.8070472,20.910389 27.6746078,20.5491212 28.3088772,19.9045802 C28.9431467,19.2600392 29.290432,18.3867874 29.272044,17.4826896 C29.1815049,15.6131286 27.6242468,14.1524446 25.7527221,14.1816202 Z" id="路径" fill="url(#linearGradient-1)"></path> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 2.9 KiB | 
							
								
								
									
										11
									
								
								src/assets/icons/svg/fullScreenView.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,11 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <g id="驾驶舱" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="运营总览_生产线监控驾驶舱" transform="translate(-1866.000000, -36.000000)"> | ||||||
|  |             <g id="编组-54" transform="translate(1866.000000, 36.000000)"> | ||||||
|  |                 <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="21" height="21"></rect> | ||||||
|  |                 <path d="M18.4001211,1 L18.574731,1.00571398 C18.8641421,1.02474925 19.1451559,1.09128771 19.4122178,1.20447947 C19.7221027,1.33395436 19.9991094,1.52058631 20.2392616,1.76073844 C20.4776764,1.99915325 20.6652172,2.27804627 20.7953442,2.58736464 C20.9313506,2.90825642 21,3.24882158 21,3.59987893 L21,3.59987893 L21,18.4001211 L20.994286,18.574731 C20.9752507,18.8641421 20.9087123,19.1451559 20.7955205,19.4122178 C20.6660456,19.7221027 20.4794137,19.9991094 20.2392616,20.2392616 C20.0008468,20.4776764 19.7219537,20.6652172 19.4126354,20.7953442 C19.0917436,20.9313506 18.7511784,21 18.4001211,21 L18.4001211,21 L3.59987893,21 L3.42526905,20.994286 C3.13585794,20.9752507 2.85484405,20.9087123 2.58778224,20.7955205 C2.2778973,20.6660456 2.00089057,20.4794137 1.76073844,20.2392616 C1.52232363,20.0008468 1.33478285,19.7219537 1.20465581,19.4126354 C1.06864936,19.0917436 1,18.7511784 1,18.4001211 L1,18.4001211 L1,3.59987893 L1.00571398,3.42526905 C1.02474925,3.13585794 1.09128771,2.85484405 1.20447947,2.58778224 C1.33395436,2.2778973 1.52058631,2.00089057 1.76073844,1.76073844 C1.99915325,1.52232363 2.27804627,1.33478285 2.58736464,1.20465581 C2.90825642,1.06864936 3.24882158,1 3.59987893,1 L3.59987893,1 L18.4001211,1 Z M18.4001211,2.29539952 L3.59987893,2.29539952 L3.49797651,2.2993263 C2.82542992,2.35136056 2.29539952,2.9140495 2.29539952,3.59987893 L2.29539952,3.59987893 L2.29539952,18.4001211 L2.2993263,18.5020235 C2.35136056,19.1745701 2.9140495,19.7046005 3.59987893,19.7046005 L3.59987893,19.7046005 L18.4001211,19.7046005 L18.5020235,19.7006737 C19.1745701,19.6486394 19.7046005,19.0859505 19.7046005,18.4001211 L19.7046005,18.4001211 L19.7046005,3.59987893 L19.7006737,3.49797651 C19.6486394,2.82542992 19.0859505,2.29539952 18.4001211,2.29539952 L18.4001211,2.29539952 Z M4.56580299,11.8731508 L4.63987359,11.8789244 C4.95620444,11.9219442 5.20096852,12.1943435 5.20096852,12.5208838 L5.20096852,12.5208838 L5.20096852,15.8606113 L8.39814764,12.6634321 L8.45892035,12.6098356 C8.71226443,12.4133149 9.08161636,12.4311804 9.3138681,12.6634321 C9.56547415,12.9150382 9.56547415,13.3275466 9.3138681,13.5791526 L9.3138681,13.5791526 L6.09149511,16.7990315 L9.4155569,16.7990315 L9.49368756,16.8035151 C9.82695229,16.8420028 10.0864105,17.123441 10.081435,17.4601165 C10.0742517,17.8119637 9.78624591,18.094431 9.43371671,18.094431 L9.43371671,18.094431 L4.5691586,18.094431 L4.49163938,18.0899766 C4.16113157,18.051728 3.90556901,17.7718105 3.90556901,17.4308414 L3.90556901,17.4308414 L3.90556901,12.5367736 L3.91007171,12.4587841 C3.94871707,12.1260764 4.23118526,11.8665247 4.56580299,11.8731508 L4.56580299,11.8731508 Z M17.4353814,3.90556901 L17.512257,3.91000958 C17.8400885,3.94813523 18.094431,4.22707005 18.094431,4.56461864 L18.094431,4.56461864 L18.094431,9.46095642 L18.0899283,9.53894589 C18.0512829,9.87165361 17.7688147,10.1312053 17.434197,10.1245792 C17.0828999,10.1173731 16.7990315,9.82850504 16.7990315,9.47684625 L16.7990315,9.47684625 L16.7990315,6.13938874 L13.6018524,9.33656786 L13.5410796,9.39016441 C13.2877356,9.58668512 12.9183836,9.5688196 12.6861319,9.33656786 C12.4345258,9.08496181 12.4345258,8.67245345 12.6861319,8.4208474 L12.6861319,8.4208474 L15.9060108,5.20096852 L12.5821731,5.20096852 L12.5040246,5.19648608 C12.170734,5.1580095 11.9119308,4.876675 11.9185506,4.54071802 C11.9257483,4.18803625 12.2137541,3.90556901 12.5662833,3.90556901 L12.5662833,3.90556901 L17.4353814,3.90556901 Z" id="形状结合" fill="#52FFF1" fill-rule="nonzero" opacity="0.79078311"></path> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 4.1 KiB | 
							
								
								
									
										9
									
								
								src/assets/icons/svg/unFullScreenView.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,9 @@ | |||||||
|  | <?xml version="1.0" encoding="UTF-8"?> | ||||||
|  | <svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||||
|  |     <g id="驾驶舱" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||||
|  |         <g id="编组-54备份"> | ||||||
|  |             <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="21" height="21"></rect> | ||||||
|  |             <path d="M18.4001211,1 L18.574731,1.00571398 C18.8641421,1.02474925 19.1451559,1.09128771 19.4122178,1.20447947 C19.7221027,1.33395436 19.9991094,1.52058631 20.2392616,1.76073844 C20.4776764,1.99915325 20.6652172,2.27804627 20.7953442,2.58736464 C20.9313506,2.90825642 21,3.24882158 21,3.59987893 L21,3.59987893 L21,18.4001211 L20.994286,18.574731 C20.9752507,18.8641421 20.9087123,19.1451559 20.7955205,19.4122178 C20.6660456,19.7221027 20.4794137,19.9991094 20.2392616,20.2392616 C20.0008468,20.4776764 19.7219537,20.6652172 19.4126354,20.7953442 C19.0917436,20.9313506 18.7511784,21 18.4001211,21 L18.4001211,21 L3.59987893,21 L3.42526905,20.994286 C3.13585794,20.9752507 2.85484405,20.9087123 2.58778224,20.7955205 C2.2778973,20.6660456 2.00089057,20.4794137 1.76073844,20.2392616 C1.52232363,20.0008468 1.33478285,19.7219537 1.20465581,19.4126354 C1.06864936,19.0917436 1,18.7511784 1,18.4001211 L1,18.4001211 L1,3.59987893 L1.00571398,3.42526905 C1.02474925,3.13585794 1.09128771,2.85484405 1.20447947,2.58778224 C1.33395436,2.2778973 1.52058631,2.00089057 1.76073844,1.76073844 C1.99915325,1.52232363 2.27804627,1.33478285 2.58736464,1.20465581 C2.90825642,1.06864936 3.24882158,1 3.59987893,1 L3.59987893,1 L18.4001211,1 Z M18.4001211,2.29539952 L3.59987893,2.29539952 L3.49797651,2.2993263 C2.82542992,2.35136056 2.29539952,2.9140495 2.29539952,3.59987893 L2.29539952,3.59987893 L2.29539952,18.4001211 L2.2993263,18.5020235 C2.35136056,19.1745701 2.9140495,19.7046005 3.59987893,19.7046005 L3.59987893,19.7046005 L18.4001211,19.7046005 L18.5020235,19.7006737 C19.1745701,19.6486394 19.7046005,19.0859505 19.7046005,18.4001211 L19.7046005,18.4001211 L19.7046005,3.59987893 L19.7006737,3.49797651 C19.6486394,2.82542992 19.0859505,2.29539952 18.4001211,2.29539952 L18.4001211,2.29539952 Z M9.43538136,11.905569 L9.512257,11.9100096 C9.84008849,11.9481352 10.094431,12.2270701 10.094431,12.5646186 L10.094431,12.5646186 L10.094431,17.4609564 L10.0899283,17.5389459 C10.0512829,17.8716536 9.76881474,18.1312053 9.43419701,18.1245792 C9.08289988,18.1173731 8.79903148,17.828505 8.79903148,17.4768462 L8.79903148,17.4768462 L8.79903148,14.1393887 L5.60185236,17.3365679 L5.54107965,17.3901644 C5.28773557,17.5866851 4.91838364,17.5688196 4.6861319,17.3365679 C4.43452585,17.0849618 4.43452585,16.6724534 4.6861319,16.4208474 L4.6861319,16.4208474 L7.90601077,13.2009685 L4.58217312,13.2009685 L4.50402457,13.1964861 C4.17073404,13.1580095 3.9119308,12.876675 3.91855064,12.540718 C3.92574827,12.1880363 4.21375409,11.905569 4.56628329,11.905569 L4.56628329,11.905569 L9.43538136,11.905569 Z M12.565803,3.8731508 L12.6398736,3.87892442 C12.9562044,3.92194416 13.2009685,4.19434347 13.2009685,4.52088378 L13.2009685,4.52088378 L13.2009685,7.86061126 L16.3981476,4.66343214 L16.4589204,4.60983559 C16.7122644,4.41331488 17.0816164,4.4311804 17.3138681,4.66343214 C17.5654742,4.91503819 17.5654742,5.32754655 17.3138681,5.5791526 L17.3138681,5.5791526 L14.0914951,8.79903148 L17.4155569,8.79903148 L17.4936876,8.80351509 C17.8269523,8.84200281 18.0864105,9.12344101 18.081435,9.46011654 C18.0742517,9.81196375 17.7862459,10.094431 17.4337167,10.094431 L17.4337167,10.094431 L12.5691586,10.094431 L12.4916394,10.0899766 C12.1611316,10.051728 11.905569,9.77181051 11.905569,9.4308414 L11.905569,9.4308414 L11.905569,4.53677361 L11.9100717,4.45878413 C11.9487171,4.12607641 12.2311853,3.86652471 12.565803,3.8731508 L12.565803,3.8731508 Z" id="形状结合" fill="#52FFF1" fill-rule="nonzero" opacity="0.79078311"></path> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 3.9 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/arrDown.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 595 B | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/arrUp.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 550 B | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/background.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 8.9 MiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/center-bottom.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 33 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/center-top.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 92 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/centerNumB.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 16 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/centerNumY.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 46 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/data-board-title.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 49 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/defectNum.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 64 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/dotG.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.1 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/dotR.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.1 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/dotY.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.1 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/eq-tip.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 91 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/head.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 107 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/left-bottom.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 36 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/left-top.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 58 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/leftTopDataBox.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 113 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/leftTopIcon1.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 14 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/leftTopIcon2.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 5.9 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/leftbar.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.4 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/numberBox.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 16 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/ranking1.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 16 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/ranking2.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 14 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/ranking3.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 14 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/rankingBg1.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 48 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/rankingBg2.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 45 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/right-bottom.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 55 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/rightbar.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.5 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/dataBoard/time-choose.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.7 KiB | 
| @@ -1,16 +1,30 @@ | |||||||
|  | <!-- | ||||||
|  |     filename: index.vue | ||||||
|  |     author: liubin | ||||||
|  |     date: 2024-04-02 09:49:36 | ||||||
|  |     description: | ||||||
|  | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
|   <!-- 按钮切换 --> |   <!-- 按钮切换 --> | ||||||
|   <div v-if="buttonMode" class="button-nav"> |   <div v-if="buttonMode" class="button-nav"> | ||||||
|     <button v-for="m in menus" :key="m" @click="handleClick(m)" |     <button | ||||||
|  |       v-for="m in menus" | ||||||
|  |       :key="m" | ||||||
|  |       @click="currentMenu = m" | ||||||
|       :data-text="m" |       :data-text="m" | ||||||
|       :class="[m === currentMenu ? 'active' : '']" |       :class="[m === currentMenu ? 'active' : '']" | ||||||
|     ></button> |     ></button> | ||||||
|   </div> |   </div> | ||||||
|   <!-- 标签切换 --> |   <!-- 标签切换 --> | ||||||
|   <div v-else class="custom-tabs" style="height: 100%; width: 100%"> |   <div v-else class="custom-tabs" style="height: 100%; width: 100%"> | ||||||
|     <el-tabs class="tag-nav" v-model="currentMenu" style="height: 100%" @tab-click="handleTabClick"> |     <el-tabs class="tag-nav" v-model="currentMenu" style="height: 100%"> | ||||||
|       <el-tab-pane v-for="(m, idx) in menus" :key="m" :label="idx == 0 ? `\u2002${m}\u2002` : `\u3000${m}\u3000`" |       <el-tab-pane | ||||||
|         :name="m"> |         v-for="(m, idx) in menus" | ||||||
|  |         :key="m" | ||||||
|  |         :label="idx == 0 ? `\u2002${m}\u2002` : `\u3000${m}\u3000`" | ||||||
|  |         :name="m" | ||||||
|  |       > | ||||||
|         <slot :name="`tab${idx + 1}`"></slot> |         <slot :name="`tab${idx + 1}`"></slot> | ||||||
|       </el-tab-pane> |       </el-tab-pane> | ||||||
|     </el-tabs> |     </el-tabs> | ||||||
| @@ -25,17 +39,14 @@ export default { | |||||||
|       type: Array, |       type: Array, | ||||||
|       required: true, |       required: true, | ||||||
|       default: () => [], |       default: () => [], | ||||||
|       validator: (val) => val.length > 0, |       validator: (val) => { | ||||||
|  |         return val.length > 0; | ||||||
|  |       }, | ||||||
|     }, |     }, | ||||||
|     buttonMode: { |     buttonMode: { | ||||||
|       type: Boolean, |       type: Boolean, | ||||||
|       default: true, |       default: true, | ||||||
|     }, |     }, | ||||||
|     // 新增:支持外部传入选中值(v-model 绑定) |  | ||||||
|     value: { |  | ||||||
|       type: String, |  | ||||||
|       default: "", |  | ||||||
|     }, |  | ||||||
|   }, |   }, | ||||||
|   data() { |   data() { | ||||||
|     return { |     return { | ||||||
| @@ -43,34 +54,16 @@ export default { | |||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   created() { |   created() { | ||||||
|     // 优先使用外部传入的 value,否则默认第一个 |     this.currentMenu = this.menus[0]; | ||||||
|     this.currentMenu = this.value || this.menus[0]; |  | ||||||
|   }, |   }, | ||||||
|   watch: { |   watch: { | ||||||
|     // 监听外部 value 变化,同步到内部 currentMenu |  | ||||||
|     value(newVal) { |  | ||||||
|       this.currentMenu = newVal; |  | ||||||
|     }, |  | ||||||
|     // 监听内部 currentMenu 变化,通知外部 |  | ||||||
|     currentMenu(val) { |     currentMenu(val) { | ||||||
|       this.$emit("input", val); // 触发 v-model 同步 |       this.$emit("change", val); | ||||||
|       this.$emit("change", val); // 保留原 change 事件 |  | ||||||
|     }, |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     // 按钮点击事件 |  | ||||||
|     handleClick(m) { |  | ||||||
|       this.currentMenu = m; |  | ||||||
|     }, |  | ||||||
|     // 标签点击事件(el-tabs 自带) |  | ||||||
|     handleTabClick(tab) { |  | ||||||
|       this.currentMenu = tab.name; |  | ||||||
|     }, |     }, | ||||||
|   }, |   }, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
| <!-- 样式不变 --> |  | ||||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||||
| .button-nav { | .button-nav { | ||||||
|   width: 100%; |   width: 100%; | ||||||
| @@ -120,7 +113,6 @@ export default { | |||||||
|   display: inline-block; |   display: inline-block; | ||||||
|   /* transform: translateY(-12px); */ |   /* transform: translateY(-12px); */ | ||||||
| } | } | ||||||
|  |  | ||||||
| .custom-tabs >>> .el-tabs__item { | .custom-tabs >>> .el-tabs__item { | ||||||
|   padding-left: 0px !important; |   padding-left: 0px !important; | ||||||
|   padding-right: 0px !important; |   padding-right: 0px !important; | ||||||
| @@ -131,7 +123,6 @@ export default { | |||||||
| .custom-tabs >>> .el-tabs__content { | .custom-tabs >>> .el-tabs__content { | ||||||
|   height: calc(100% - 42px); |   height: calc(100% - 42px); | ||||||
| } | } | ||||||
|  |  | ||||||
| .custom-tabs >>> .el-tab-pane { | .custom-tabs >>> .el-tab-pane { | ||||||
|   box-sizing: border-box; |   box-sizing: border-box; | ||||||
|   height: 100%; |   height: 100%; | ||||||
|   | |||||||
| @@ -21,6 +21,7 @@ import { | |||||||
| 	handleTree, | 	handleTree, | ||||||
| 	addBeginAndEndTime, | 	addBeginAndEndTime, | ||||||
| 	divide, | 	divide, | ||||||
|  | 	formatThousands | ||||||
| } from '@/utils/ruoyi'; | } from '@/utils/ruoyi'; | ||||||
| import Pagination from '@/components/Pagination'; | import Pagination from '@/components/Pagination'; | ||||||
| // 自定义表格工具扩展 | // 自定义表格工具扩展 | ||||||
| @@ -45,6 +46,7 @@ Vue.prototype.resetForm = resetForm; | |||||||
| Vue.prototype.getDictDatas = getDictDatas; | Vue.prototype.getDictDatas = getDictDatas; | ||||||
| Vue.prototype.getDictDatas2 = getDictDatas2; | Vue.prototype.getDictDatas2 = getDictDatas2; | ||||||
| Vue.prototype.getDictDataLabel = getDictDataLabel; | Vue.prototype.getDictDataLabel = getDictDataLabel; | ||||||
|  | Vue.prototype.formatThousands = formatThousands; | ||||||
| Vue.prototype.DICT_TYPE = DICT_TYPE; | Vue.prototype.DICT_TYPE = DICT_TYPE; | ||||||
| Vue.prototype.handleTree = handleTree; | Vue.prototype.handleTree = handleTree; | ||||||
| Vue.prototype.addBeginAndEndTime = addBeginAndEndTime; | Vue.prototype.addBeginAndEndTime = addBeginAndEndTime; | ||||||
|   | |||||||
| @@ -295,3 +295,15 @@ export function getPath(path) { | |||||||
|   } |   } | ||||||
|   return Math.floor(divisor/dividend*100)/100; |   return Math.floor(divisor/dividend*100)/100; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | // 通用千分位格式化函数 | ||||||
|  | export function formatThousands(value) { | ||||||
|  |   if (value === null || value === undefined) return '0' | ||||||
|  |    | ||||||
|  |   // 清理已有逗号并转为数字 | ||||||
|  |   const numValue = Number(String(value).replace(/,/g, '')) | ||||||
|  |   if (isNaN(numValue)) return '0' | ||||||
|  |  | ||||||
|  |   // 支持小数处理 | ||||||
|  |   return numValue.toLocaleString('en-US') | ||||||
|  | } | ||||||
							
								
								
									
										116
									
								
								src/views/base/dataBoard/components/CenterBottomL.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,116 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='centerBottomL'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard3" class='icon'/> | ||||||
|  |       <span>本月数据</span> | ||||||
|  |     </div> | ||||||
|  |     <div class='dataBox' style='top:50px'> | ||||||
|  |       <p> | ||||||
|  |         <span class='text'>总投入片数</span> | ||||||
|  |         <span class='precent' :class='{precentR:monthData?.inputNumChange>=0,precentG:monthData?.inputNumChange<0}'>{{monthData?.inputNumChange || '-'}}%</span> | ||||||
|  |         <img v-show='monthData?.inputNumChange<0' src="../../../../assets/images/dataBoard/arrDown.png" alt="" width='5' height='15'> | ||||||
|  |         <img v-show='monthData?.inputNumChange>=0' src="../../../../assets/images/dataBoard/arrUp.png" alt="" width='5' height='15'> | ||||||
|  |       </p> | ||||||
|  |       <p class='num'>{{monthData?.inputNum ? formatThousands(monthData.inputNum) : '-'}}</p> | ||||||
|  |     </div> | ||||||
|  |     <div class='dataBox'style='top:180px'> | ||||||
|  |       <p> | ||||||
|  |         <span class='text'>总生产片数</span> | ||||||
|  |         <span class='precent' :class='{precentR:monthData?.outputNumChange>=0,precentG:monthData?.outputNumChange<0}'>{{monthData?.outputNumChange || '-'}}%</span> | ||||||
|  |         <img v-show='monthData?.outputNumChange<0' src="../../../../assets/images/dataBoard/arrDown.png" alt="" width='5' height='15'> | ||||||
|  |         <img v-show='monthData?.outputNumChange>=0' src="../../../../assets/images/dataBoard/arrUp.png" alt="" width='5' height='15'> | ||||||
|  |       </p> | ||||||
|  |       <p class='num'>{{monthData?.outputNum ? formatThousands(monthData.outputNum) : '-'}}</p> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: 'CenterBottomL', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       val.monthAndLastMonth && val.monthAndLastMonth.forEach(item => { | ||||||
|  |         if (item.dataType === "本月") { | ||||||
|  |           this.monthData = item | ||||||
|  |         } | ||||||
|  |       }) | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       monthData:{} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   methods: {} | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | <style lang="scss" scoped> | ||||||
|  | .centerBottomL { | ||||||
|  |   width: 337px; | ||||||
|  |   height: 332px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/center-bottom.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   left: 440px; | ||||||
|  |   bottom:23px; | ||||||
|  |   .title { | ||||||
|  |     margin: 7px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 33px; | ||||||
|  |       height: 33px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |       margin-top: 5px; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .dataBox { | ||||||
|  |     width: 290px; | ||||||
|  |     height: 135px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/numberBox.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     padding:22px 0 0 16px; | ||||||
|  |     left: 24px; | ||||||
|  |     p{ | ||||||
|  |       margin: 0; | ||||||
|  |     } | ||||||
|  |     .text { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 20px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       letter-spacing: 2px; | ||||||
|  |       margin-right: 8px; | ||||||
|  |     } | ||||||
|  |     .precent { | ||||||
|  |       font-size: 18px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |     } | ||||||
|  |     .precentR { | ||||||
|  |       color: #FF271D; | ||||||
|  |     } | ||||||
|  |     .precentG { | ||||||
|  |       color: #34F716; | ||||||
|  |     } | ||||||
|  |     .num { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 38px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       margin-top: 5px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										100
									
								
								src/views/base/dataBoard/components/CenterBottomR.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,100 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='centerBottomR'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard3" class='icon'/> | ||||||
|  |       <span>上月数据</span> | ||||||
|  |     </div> | ||||||
|  |     <div class='dataBox' style='top:50px'> | ||||||
|  |       <p> | ||||||
|  |         <span class='text'>总投入片数</span> | ||||||
|  |       </p> | ||||||
|  |       <p class='num'>{{lastMonthData?.inputNum ? formatThousands(lastMonthData.inputNum) : '-'}}</p> | ||||||
|  |     </div> | ||||||
|  |     <div class='dataBox'style='top:180px'> | ||||||
|  |       <p> | ||||||
|  |         <span class='text'>总生产片数</span> | ||||||
|  |       </p> | ||||||
|  |       <p class='num'>{{lastMonthData?.outputNum ? formatThousands(lastMonthData.outputNum) : '-'}}</p> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: 'CenterBottomR', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       val.monthAndLastMonth && val.monthAndLastMonth.forEach(item => { | ||||||
|  |         if (item.dataType === "上月") { | ||||||
|  |           this.lastMonthData = item | ||||||
|  |         }  | ||||||
|  |       }) | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       lastMonthData:{} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   methods: {} | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | <style lang="scss" scoped> | ||||||
|  | .centerBottomR { | ||||||
|  |   width: 337px; | ||||||
|  |   height: 332px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/center-bottom.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   left: 791px; | ||||||
|  |   bottom:23px; | ||||||
|  |   .title { | ||||||
|  |     margin: 7px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 33px; | ||||||
|  |       height: 33px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |       margin-top: 5px; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .dataBox { | ||||||
|  |     width: 290px; | ||||||
|  |     height: 135px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/numberBox.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     padding:22px 0 0 16px; | ||||||
|  |     left: 24px; | ||||||
|  |     p{ | ||||||
|  |       margin: 0; | ||||||
|  |     } | ||||||
|  |     .text { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 20px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       letter-spacing: 2px; | ||||||
|  |       margin-right: 8px; | ||||||
|  |     } | ||||||
|  |     .num { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 38px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       margin-top: 5px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										352
									
								
								src/views/base/dataBoard/components/CenterTop.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,352 @@ | |||||||
|  | <template> | ||||||
|  |   <div ref="centerTopBox" class='centerTopBox'> | ||||||
|  |     <div> | ||||||
|  |       <video src="/static/videos/01.webm" muted autoplay loop class='videoStyle'></video> | ||||||
|  |       <div | ||||||
|  |         class='eqTipBox' | ||||||
|  |         v-show='showTooltip' | ||||||
|  |         :style="'left:'+tooltipStyle.left+'px;top:'+tooltipStyle.top+'px;'" | ||||||
|  |       > | ||||||
|  |         <p><span class='eqTipTitle'>设备名称:</span><span class='eqTipNum'>{{eqTipMsg.name}}</span></p> | ||||||
|  |         <p><span class='eqTipTitle'>进口数量:</span><span class='eqTipNum'>{{eqTipMsg.input}}</span></p> | ||||||
|  |         <p><span class='eqTipTitle'>出口数量:</span><span class='eqTipNum'>{{eqTipMsg.output}}</span></p> | ||||||
|  |         <p><span class='eqTipTitle'>报警状态:</span> | ||||||
|  |           <span class='eqTipNum'> | ||||||
|  |             <img v-show='eqTipMsg.alarm' :src='dotY' width='16'/> | ||||||
|  |             <img v-show='!eqTipMsg.alarm' :src='dotG' width='16'/> | ||||||
|  |             {{eqTipMsg.alarm?'报警':'未报警'}} | ||||||
|  |           </span> | ||||||
|  |         </p> | ||||||
|  |         <p><span class='eqTipTitle'>在线状态:</span> | ||||||
|  |           <span class='eqTipNum'> | ||||||
|  |             <img v-show='eqTipMsg.status' :src='dotG' width='16'/> | ||||||
|  |             <img v-show='!eqTipMsg.status' :src='dotR' width='16'/> | ||||||
|  |             {{eqTipMsg.status?'在线':'离线'}} | ||||||
|  |           </span> | ||||||
|  |         </p> | ||||||
|  |       </div> | ||||||
|  |       <!-- 设备 --> | ||||||
|  |       <div class='eqBox'> | ||||||
|  |         <!-- line-从上到下-从右往左 --> | ||||||
|  |         <span  | ||||||
|  |           v-for='(item,index) in eqList' | ||||||
|  |           :key='index' | ||||||
|  |           :style="'width:'+item.w+'px;height:'+item.h+'px;left:'+item.l+'px;top:'+item.t+'px'" | ||||||
|  |           @mouseenter="handleMouseEnter(item, $event)" | ||||||
|  |           @mouseleave="handleMouseLeave" | ||||||
|  |         ></span> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |     <div class='centerTopTopBox'> | ||||||
|  |       <div style='display: inline-block;'> | ||||||
|  |         <img src="../../../../assets/images/dataBoard/centerNumB.png" alt="" width='203'> | ||||||
|  |         <p class='num'>{{dataObj?.productRate || '-'}}%</p> | ||||||
|  |         <p class='title'>成品率</p> | ||||||
|  |       </div> | ||||||
|  |       <div style='display: inline-block;'> | ||||||
|  |         <img src="../../../../assets/images/dataBoard/centerNumY.png" alt="" width='261'> | ||||||
|  |         <p class='num' style='width: 260px;padding-left: 20px;'>{{dataObj?.todayProduct ? formatThousands(dataObj.todayProduct) : '-'}}</p> | ||||||
|  |         <p class='title' style='color:#FFB625'>今日产量</p> | ||||||
|  |       </div> | ||||||
|  |       <div style='display: inline-block;'> | ||||||
|  |         <img src="../../../../assets/images/dataBoard/centerNumY.png" alt="" width='261'> | ||||||
|  |         <p class='num' style='width: 260px;padding-left: 20px;'>{{dataObj?.monthProduct ? formatThousands(dataObj.monthProduct) : '-'}}</p> | ||||||
|  |         <p class='title' style='color:#FFB625'>本月产量</p> | ||||||
|  |       </div> | ||||||
|  |       <div style='display: inline-block;'> | ||||||
|  |         <img src="../../../../assets/images/dataBoard/centerNumB.png" alt="" width='203'> | ||||||
|  |         <p class='num'>{{dataObj?.alarmNum ? formatThousands(dataObj.alarmNum) : '-'}}</p> | ||||||
|  |         <p class='title'>设备报警数</p> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: 'CenterTop', | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       showTooltip:false, | ||||||
|  |       tooltipStyle: { | ||||||
|  |         left: 0, | ||||||
|  |         top: 0 | ||||||
|  |       }, | ||||||
|  |       dotY:require('../../../../assets/images/dataBoard/dotY.png'), | ||||||
|  |       dotR:require('../../../../assets/images/dataBoard/dotR.png'), | ||||||
|  |       dotG:require('../../../../assets/images/dataBoard/dotG.png'), | ||||||
|  |       eqList:[ | ||||||
|  |         {name:'A1-磨边机-1',id:100301,w:70,h:18,l:830,t:160}, | ||||||
|  |         {name:'A1-磨边机-2',id:100302,w:70,h:18,l:830,t:183}, | ||||||
|  |         {name:'A1-磨边机-3',id:100303,w:70,h:18,l:832,t:206}, | ||||||
|  |         {name:'A1-磨边后清洗机-1',id:100401,w:30,h:15,l:798,t:160}, | ||||||
|  |         {name:'A1-磨边后清洗机-2',id:100402,w:30,h:15,l:798,t:183}, | ||||||
|  |         {name:'A1-磨边后清洗机-3',id:100403,w:30,h:15,l:800,t:206}, | ||||||
|  |         {name:'A1-打孔机-1',id:100501,w:13,h:12,l:730,t:163}, | ||||||
|  |         {name:'A1-打孔机-2',id:100502,w:13,h:12,l:730,t:187}, | ||||||
|  |         {name:'A1-打孔机-3',id:100503,w:13,h:12,l:730,t:210}, | ||||||
|  |         {name:'A1-打孔后清洗机-1',id:100601,w:32,h:15,l:665,t:160}, | ||||||
|  |         {name:'A1-打孔后清洗机-2',id:100602,w:32,h:15,l:665,t:183}, | ||||||
|  |         {name:'A1-打孔后清洗机-3',id:100603,w:32,h:15,l:665,t:206}, | ||||||
|  |         {name:'A1-丝印机-1',id:100701,w:30,h:12,l:605,t:163}, | ||||||
|  |         {name:'A1-丝印机-2',id:100702,w:30,h:12,l:605,t:187}, | ||||||
|  |         {name:'A1-丝印机-3',id:100703,w:30,h:12,l:605,t:210}, | ||||||
|  |         {name:'A1-丝印后固化机-1',id:101301,w:37,h:12,l:558,t:163}, | ||||||
|  |         {name:'A1-丝印后固化机-2',id:101302,w:37,h:12,l:558,t:187}, | ||||||
|  |         {name:'A1-丝印后固化机-3',id:101303,w:37,h:12,l:558,t:210}, | ||||||
|  |         {name:'A1-钢化炉',id:101401,w:75,h:15,l:382,t:209}, | ||||||
|  |         {name:'A1-包装清洗机-1',id:101501,w:30,h:15,l:228,t:173}, | ||||||
|  |         {name:'A1-包装清洗机-2',id:101502,w:30,h:15,l:228,t:206}, | ||||||
|  |         {name:'A1-铺纸机-1',id:101601,w:18,h:15,l:188,t:175}, | ||||||
|  |         {name:'A1-铺纸机-2',id:101602,w:18,h:15,l:188,t:206}, | ||||||
|  |  | ||||||
|  |         {name:'A2-磨边机-1',id:200301,w:70,h:18,l:832,t:233}, | ||||||
|  |         {name:'A2-磨边机-2',id:200302,w:70,h:18,l:833,t:257}, | ||||||
|  |         {name:'A2-磨边机-3',id:200303,w:70,h:18,l:834,t:281}, | ||||||
|  |         {name:'A2-磨边后清洗机-1',id:200401,w:30,h:15,l:800,t:233}, | ||||||
|  |         {name:'A2-磨边后清洗机-2',id:200402,w:30,h:15,l:801,t:257}, | ||||||
|  |         {name:'A2-磨边后清洗机-3',id:200403,w:30,h:15,l:802,t:281}, | ||||||
|  |         {name:'A2-打孔机-1',id:200501,w:13,h:12,l:731,t:240}, | ||||||
|  |         {name:'A2-打孔机-2',id:200502,w:13,h:12,l:731,t:262}, | ||||||
|  |         {name:'A2-打孔机-3',id:200503,w:13,h:12,l:731,t:285}, | ||||||
|  |         {name:'A2-打孔后清洗机-1',id:200601,w:32,h:15,l:666,t:234}, | ||||||
|  |         {name:'A2-打孔后清洗机-2',id:200602,w:32,h:15,l:666,t:258}, | ||||||
|  |         {name:'A2-打孔后清洗机-3',id:200603,w:32,h:15,l:666,t:282}, | ||||||
|  |         {name:'A2-丝印机-1',id:200701,w:30,h:12,l:605,t:238}, | ||||||
|  |         {name:'A2-丝印机-2',id:200702,w:30,h:12,l:605,t:262}, | ||||||
|  |         {name:'A2-丝印机-3',id:200703,w:30,h:12,l:605,t:286}, | ||||||
|  |         {name:'A2-丝印后固化机-1',id:201301,w:37,h:12,l:558,t:238}, | ||||||
|  |         {name:'A2-丝印后固化机-2',id:201302,w:37,h:12,l:558,t:262}, | ||||||
|  |         {name:'A2-丝印后固化机-3',id:201303,w:37,h:12,l:558,t:286}, | ||||||
|  |         {name:'A2-钢化炉',id:201401,w:75,h:15,l:382,t:238}, | ||||||
|  |         {name:'A2-包装清洗机-1',id:201501,w:30,h:15,l:228,t:234}, | ||||||
|  |         {name:'A2-包装清洗机-2',id:201502,w:30,h:15,l:228,t:267}, | ||||||
|  |         {name:'A2-铺纸机-1',id:201601,w:18,h:15,l:187,t:234}, | ||||||
|  |         {name:'A2-铺纸机-2',id:201602,w:18,h:15,l:186,t:267}, | ||||||
|  |  | ||||||
|  |         {name:'A3-磨边机-1',id:300301,w:70,h:18,l:834,t:318}, | ||||||
|  |         {name:'A3-磨边机-2',id:300302,w:70,h:18,l:834,t:342}, | ||||||
|  |         {name:'A3-磨边后清洗机-1',id:300401,w:30,h:15,l:802,t:319}, | ||||||
|  |         {name:'A3-磨边后清洗机-2',id:300402,w:30,h:15,l:802,t:342}, | ||||||
|  |         {name:'A3-打孔机-1',id:300501,w:13,h:12,l:731,t:324}, | ||||||
|  |         {name:'A3-打孔机-2',id:300502,w:13,h:12,l:731,t:348}, | ||||||
|  |         {name:'A3-打孔后清洗机-1',id:300601,w:32,h:15,l:666,t:320}, | ||||||
|  |         {name:'A3-打孔后清洗机-2',id:300602,w:32,h:15,l:666,t:342}, | ||||||
|  |         {name:'A3-丝印机-1',id:300701,w:30,h:12,l:605,t:324}, | ||||||
|  |         {name:'A3-丝印机-2',id:300702,w:30,h:12,l:605,t:348}, | ||||||
|  |         {name:'A3-一次镀膜机-1',id:300801,w:20,h:15,l:553,t:322}, | ||||||
|  |         {name:'A3-一次镀膜机-2',id:300802,w:20,h:15,l:553,t:346}, | ||||||
|  |         {name:'A3-丝印后固化机-1',id:301301,w:37,h:12,l:506,t:324}, | ||||||
|  |         {name:'A3-丝印后固化机-2',id:301302,w:37,h:12,l:506,t:347}, | ||||||
|  |         {name:'A3-钢化炉',id:301401,w:75,h:15,l:340,t:346}, | ||||||
|  |         {name:'A3-包装清洗机-1',id:301501,w:30,h:15,l:240,t:343}, | ||||||
|  |         {name:'A3-铺纸机-1',id:301601,w:18,h:15,l:200,t:343}, | ||||||
|  |         {name:'A3-铺纸机-2',id:301602,w:18,h:15,l:170,t:343}, | ||||||
|  |  | ||||||
|  |         {name:'A4-磨边机-1',id:400301,w:70,h:18,l:838,t:380}, | ||||||
|  |         {name:'A4-磨边机-2',id:400302,w:70,h:18,l:838,t:405}, | ||||||
|  |         {name:'A4-磨边机-3',id:400303,w:70,h:18,l:839,t:428}, | ||||||
|  |         {name:'A4-磨边后清洗机-1',id:400401,w:30,h:15,l:804,t:380}, | ||||||
|  |         {name:'A4-磨边后清洗机-2',id:400402,w:30,h:15,l:805,t:405}, | ||||||
|  |         {name:'A4-磨边后清洗机-3',id:400403,w:30,h:15,l:806,t:427}, | ||||||
|  |         {name:'A4-一次镀膜机-1',id:400801,w:20,h:15,l:707,t:381}, | ||||||
|  |         {name:'A4-一次镀膜机-2',id:400802,w:20,h:15,l:707,t:407}, | ||||||
|  |         {name:'A4-一次镀膜机-3',id:400803,w:20,h:15,l:707,t:429}, | ||||||
|  |         {name:'A4-一次固化机-1',id:401001,w:37,h:12,l:660,t:383}, | ||||||
|  |         {name:'A4-一次固化机-2',id:401002,w:37,h:12,l:660,t:409}, | ||||||
|  |         {name:'A4-一次固化机-3',id:401003,w:37,h:12,l:660,t:431}, | ||||||
|  |         {name:'A4-二次镀膜机-1',id:401101,w:20,h:15,l:605,t:382}, | ||||||
|  |         {name:'A4-二次镀膜机-2',id:401102,w:20,h:15,l:605,t:408}, | ||||||
|  |         {name:'A4-二次镀膜机-3',id:401103,w:20,h:15,l:605,t:430}, | ||||||
|  |         {name:'A4-二次固化机-1',id:401201,w:37,h:12,l:557,t:383}, | ||||||
|  |         {name:'A4-二次固化机-2',id:401202,w:37,h:12,l:557,t:409}, | ||||||
|  |         {name:'A4-二次固化机-3',id:401203,w:37,h:12,l:557,t:431}, | ||||||
|  |         {name:'A4-钢化炉',id:401401,w:75,h:15,l:379,t:381}, | ||||||
|  |         {name:'A4-包装清洗机-1',id:401501,w:30,h:15,l:220,t:379}, | ||||||
|  |         {name:'A4-包装清洗机-2',id:401502,w:30,h:18,l:220,t:410}, | ||||||
|  |         {name:'A4-铺纸机-1',id:401601,w:18,h:15,l:180,t:381}, | ||||||
|  |         {name:'A4-铺纸机-2',id:401602,w:18,h:15,l:180,t:414}, | ||||||
|  |  | ||||||
|  |         {name:'A5-磨边机-1',id:500301,w:70,h:18,l:817,t:465}, | ||||||
|  |         {name:'A5-磨边机-2',id:500302,w:70,h:18,l:817,t:488}, | ||||||
|  |         {name:'A5-磨边机-3',id:500303,w:70,h:18,l:819,t:512}, | ||||||
|  |         {name:'A5-磨边后清洗机-1',id:500401,w:30,h:15,l:784,t:462}, | ||||||
|  |         {name:'A5-磨边后清洗机-2',id:500402,w:30,h:15,l:784,t:488}, | ||||||
|  |         {name:'A5-磨边后清洗机-3',id:500403,w:30,h:15,l:785,t:512}, | ||||||
|  |         {name:'A5-一次镀膜机-1',id:500801,w:20,h:15,l:685,t:466}, | ||||||
|  |         {name:'A5-一次镀膜机-2',id:500802,w:20,h:15,l:685,t:490}, | ||||||
|  |         {name:'A5-一次镀膜机-3',id:500803,w:20,h:15,l:685,t:513}, | ||||||
|  |         {name:'A5-一次固化机-1',id:501001,w:37,h:12,l:638,t:468}, | ||||||
|  |         {name:'A5-一次固化机-2',id:501002,w:37,h:12,l:638,t:491}, | ||||||
|  |         {name:'A5-一次固化机-3',id:501003,w:37,h:12,l:638,t:514}, | ||||||
|  |         {name:'A5-二次镀膜机-1',id:501101,w:20,h:15,l:584,t:468}, | ||||||
|  |         {name:'A5-二次镀膜机-2',id:501102,w:20,h:15,l:584,t:490}, | ||||||
|  |         {name:'A5-二次镀膜机-3',id:501103,w:20,h:15,l:584,t:513}, | ||||||
|  |         {name:'A5-二次固化机-1',id:501201,w:37,h:12,l:535,t:468}, | ||||||
|  |         {name:'A5-二次固化机-2',id:501202,w:37,h:12,l:535,t:492}, | ||||||
|  |         {name:'A5-二次固化机-3',id:501203,w:37,h:12,l:535,t:514}, | ||||||
|  |         {name:'A5-钢化炉',id:501401,w:75,h:15,l:344,t:513}, | ||||||
|  |         {name:'A5-包装清洗机-1',id:501501,w:30,h:18,l:185,t:473}, | ||||||
|  |         {name:'A5-包装清洗机-2',id:501502,w:30,h:18,l:185,t:511}, | ||||||
|  |         {name:'A5-铺纸机-1',id:501601,w:18,h:15,l:144,t:475}, | ||||||
|  |         {name:'A5-铺纸机-2',id:501602,w:18,h:15,l:144,t:511} | ||||||
|  |       ], | ||||||
|  |       eqTipMsg:{ | ||||||
|  |         name:'', | ||||||
|  |         input:null, | ||||||
|  |         output:null, | ||||||
|  |         alarm:'未报警', | ||||||
|  |         status:'在线' | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   props: { | ||||||
|  |     scaleNum: { | ||||||
|  |       type: Number, | ||||||
|  |       default: 1 | ||||||
|  |     }, | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     scaleNum(val) { | ||||||
|  |       this.scaleNum = val | ||||||
|  |     }, | ||||||
|  |     dataObj(val) { | ||||||
|  |       val.equipmentDets && val.equipmentDets.forEach(item => { | ||||||
|  |         this.eqList.forEach(eq => { | ||||||
|  |           if (eq.id == item.id) { | ||||||
|  |             eq.name = item.name | ||||||
|  |             eq.input = item.input | ||||||
|  |             eq.output = item.output | ||||||
|  |             eq.alarm = item.isError | ||||||
|  |             eq.status = item.isRun | ||||||
|  |           } | ||||||
|  |         }) | ||||||
|  |       }) | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   mounted() {}, | ||||||
|  |   methods: { | ||||||
|  |     // 鼠标hover事件 | ||||||
|  |     handleMouseEnter(item, event) { | ||||||
|  |       this.showTooltip = true; | ||||||
|  |       this.eqTipMsg.name = item.name; | ||||||
|  |       this.eqTipMsg.input = item.input; | ||||||
|  |       this.eqTipMsg.output = item.output; | ||||||
|  |       this.eqTipMsg.alarm = item.alarm; | ||||||
|  |       this.eqTipMsg.status = item.status; | ||||||
|  |       this.updateTooltipPosition(event); | ||||||
|  |     }, | ||||||
|  |     handleMouseLeave() { | ||||||
|  |       this.showTooltip = false; | ||||||
|  |     }, | ||||||
|  |     updateTooltipPosition(event) { | ||||||
|  |       const rect = this.$refs.centerTopBox.getBoundingClientRect() | ||||||
|  |       const offset = 15; | ||||||
|  |       const tooltipWidth = 315*this.scaleNum; | ||||||
|  |       const tooltipHeight = 170*this.scaleNum; | ||||||
|  |       const startX = rect.left; | ||||||
|  |       const startY = rect.top; | ||||||
|  |       const endX = rect.width; | ||||||
|  |       const endY = rect.height; | ||||||
|  |       let posX = event.clientX-startX + offset; | ||||||
|  |       let posY = event.clientY-startY + offset; | ||||||
|  |       if (posX + tooltipWidth > endX) { | ||||||
|  |         posX = event.clientX-startX - tooltipWidth - offset; | ||||||
|  |       } | ||||||
|  |       if (posY + tooltipHeight > endY) { | ||||||
|  |         posY = event.clientY -startY - tooltipHeight - offset; | ||||||
|  |       } | ||||||
|  |       this.tooltipStyle.left = posX/this.scaleNum; | ||||||
|  |       this.tooltipStyle.top = posY/this.scaleNum; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | <style lang="scss" scoped> | ||||||
|  | p{ | ||||||
|  |   margin: 0; | ||||||
|  | } | ||||||
|  | .centerTopBox { | ||||||
|  |   width: 1041px; | ||||||
|  |   height: 600px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/center-top.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   left: 440px; | ||||||
|  |   top:113px; | ||||||
|  |   overflow: hidden; | ||||||
|  |   .videoStyle { | ||||||
|  |     width: 1920px; | ||||||
|  |     height: 1080px; | ||||||
|  |     position: absolute; | ||||||
|  |     left:-440px; | ||||||
|  |     top:-113px; | ||||||
|  |   } | ||||||
|  |   .eqTipBox { | ||||||
|  |     width: 315px; | ||||||
|  |     height: 170px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/eq-tip.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     padding-top: 10px; | ||||||
|  |     z-index: 1; | ||||||
|  |     span{ | ||||||
|  |       display: inline-block; | ||||||
|  |       font-size: 20px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       letter-spacing: 1px; | ||||||
|  |       vertical-align: middle; | ||||||
|  |     } | ||||||
|  |     .eqTipTitle { | ||||||
|  |       width: 112px; | ||||||
|  |       height: 30px; | ||||||
|  |       padding-left: 15px; | ||||||
|  |     } | ||||||
|  |     .eqTipNum { | ||||||
|  |       width: 190px; | ||||||
|  |       height: 30px; | ||||||
|  |       line-height: 30px; | ||||||
|  |       white-space: nowrap; | ||||||
|  |       overflow: hidden; | ||||||
|  |       text-overflow: ellipsis; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .eqBox { | ||||||
|  |     span{ | ||||||
|  |       display: inline-block; | ||||||
|  |       // border: 1px solid red; | ||||||
|  |       position: absolute; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .centerTopTopBox { | ||||||
|  |     padding-left: 48px; | ||||||
|  |     position: absolute; | ||||||
|  |     top:30px; | ||||||
|  |     .num { | ||||||
|  |       width: 203px; | ||||||
|  |       height: 65px; | ||||||
|  |       line-height: 65px; | ||||||
|  |       padding-left: 10px; | ||||||
|  |       box-sizing: border-box; | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 38px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       text-shadow: 0px 5px 2px rgba(0,0,0,0.62); | ||||||
|  |       text-align: center; | ||||||
|  |       position: absolute; | ||||||
|  |       top:0px; | ||||||
|  |     } | ||||||
|  |     .title { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 20px; | ||||||
|  |       color: #00C8F7; | ||||||
|  |       letter-spacing: 2px; | ||||||
|  |       text-shadow: 0px 5px 2px rgba(0,0,0,0.62); | ||||||
|  |       text-align: center; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										108
									
								
								src/views/base/dataBoard/components/Header.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,108 @@ | |||||||
|  | <template> | ||||||
|  |   <header class="dataBoardHeader"> | ||||||
|  |     <div class='topTitle'></div> | ||||||
|  |     <!-- <div class='time-chsoose'> | ||||||
|  |       <span class='title'>时间选择</span> | ||||||
|  |       <span class='time-show'>{{time}}</span> | ||||||
|  |       <el-date-picker | ||||||
|  |         v-model="time" | ||||||
|  |         type="date" | ||||||
|  |         value-format='yyyy-MM-dd' | ||||||
|  |         :clearable='false' | ||||||
|  |         style='position: absolute;right: 0px;width: 119px;top:-2px;opacity: 0;' | ||||||
|  |       > | ||||||
|  |       </el-date-picker> | ||||||
|  |     </div> --> | ||||||
|  |     <div | ||||||
|  |       type="text" | ||||||
|  |       class="screen-btn" | ||||||
|  |       :title="isFullScreen?'退出全屏':'全屏'" | ||||||
|  |       @click="changeFullScreen" | ||||||
|  |     > | ||||||
|  |       <svg-icon v-if="isFullScreen" icon-class="unFullScreenView" /> | ||||||
|  |       <svg-icon v-else icon-class="fullScreenView" /> | ||||||
|  |     </div> | ||||||
|  |   </header> | ||||||
|  | </template> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  | // import moment from 'moment' | ||||||
|  | export default { | ||||||
|  |   name: 'DataBoardHeader', | ||||||
|  |   props: { | ||||||
|  |     isFullScreen: { | ||||||
|  |       type: Boolean, | ||||||
|  |       default: () => { | ||||||
|  |         return false | ||||||
|  |       } | ||||||
|  |     }, | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       // time: moment().format('YYYY-MM-DD') | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   computed: {}, | ||||||
|  |   methods: { | ||||||
|  |     changeFullScreen() { | ||||||
|  |       this.$emit('screenfullChange') | ||||||
|  |     }, | ||||||
|  |     exportPDF() { | ||||||
|  |       this.$emit('exportPDF') | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | <style scoped lang="scss"> | ||||||
|  | .dataBoardHeader { | ||||||
|  | 	background: url('../../../../assets/images/dataBoard/head.png') no-repeat; | ||||||
|  | 	height: 99px; | ||||||
|  | 	background-size: 100%; | ||||||
|  | 	background-position: 0 0; | ||||||
|  | 	position: relative; | ||||||
|  | 	.topTitle{ | ||||||
|  | 		width: 465px; | ||||||
|  | 		height: 77px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/data-board-title.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     left: 731px; | ||||||
|  |     top:19px; | ||||||
|  |   } | ||||||
|  |   .time-chsoose { | ||||||
|  |     width: 212px; | ||||||
|  | 		height: 33px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/time-choose.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     right: 63px; | ||||||
|  |     top:49px; | ||||||
|  |     .title { | ||||||
|  |       font-size: 18px; | ||||||
|  |       color: #082049; | ||||||
|  |       letter-spacing: 1px; | ||||||
|  |       position: relative; | ||||||
|  |       top: 4px; | ||||||
|  |       left: 8px | ||||||
|  |     } | ||||||
|  |     .time-show { | ||||||
|  |       font-size: 18px; | ||||||
|  |       color: #FFFFFF; | ||||||
|  |       line-height: 18px; | ||||||
|  |       position: relative; | ||||||
|  |       top: 4px; | ||||||
|  |       left: 28px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | 	.screen-btn{ | ||||||
|  | 		color: #00fff0; | ||||||
|  |     height: 32px; | ||||||
|  |     line-height: 32px; | ||||||
|  | 		font-size: 32px; | ||||||
|  | 		position: absolute; | ||||||
|  | 		right: 22px; | ||||||
|  | 		top:47px; | ||||||
|  | 	} | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										284
									
								
								src/views/base/dataBoard/components/LeftBottom.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,284 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='leftBottomBox'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard2" class='icon'/> | ||||||
|  |       <span>投入产出及良品率</span> | ||||||
|  |     </div> | ||||||
|  |     <div v-if='xData.length === 0' class='noData'>暂无数据</div> | ||||||
|  |     <div v-else> | ||||||
|  |       <div class="top_legend"> | ||||||
|  |         <span class="chart_legend_icon1">投入</span> | ||||||
|  |         <span class="chart_legend_icon2">产出</span> | ||||||
|  |         <span><span class="chart_legend_icon3"></span>良品率</span> | ||||||
|  |       </div> | ||||||
|  |       <div id='inOutputChart' style='width: 400px;height: 290px;'></div> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | import * as echarts from 'echarts'; | ||||||
|  | export default { | ||||||
|  |   name: 'LeftBottom', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       this.xData = [] | ||||||
|  |       this.inputData = [] | ||||||
|  |       this.outputData = [] | ||||||
|  |       this.goodRateData = [] | ||||||
|  |       val.monthBar && val.monthBar.forEach(item => { | ||||||
|  |         this.xData.push(item.dataType) | ||||||
|  |         this.inputData.push(item.inputNum) | ||||||
|  |         this.outputData.push(item.outputNum) | ||||||
|  |         this.goodRateData.push(item.goodRate) | ||||||
|  |       }) | ||||||
|  |       this.initChart(); | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       chartDom: '', | ||||||
|  |       chart: '', | ||||||
|  |       xData:[], | ||||||
|  |       inputData:[], | ||||||
|  |       outputData:[], | ||||||
|  |       goodRateData:[], | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   mounted() {}, | ||||||
|  |   methods: { | ||||||
|  |     initChart() { | ||||||
|  |       if ( | ||||||
|  |         this.chart !== null && | ||||||
|  |         this.chart !== '' && | ||||||
|  |         this.chart !== undefined | ||||||
|  |       ) { | ||||||
|  |         this.chart.dispose() // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例 | ||||||
|  |       } | ||||||
|  |       this.chartDom = document.getElementById('inOutputChart') | ||||||
|  |       this.chart = echarts.init(this.chartDom) | ||||||
|  |       var option; | ||||||
|  |       option = { | ||||||
|  |         grid: { top: 40, right: 10, bottom: 5, left: 10, containLabel: true }, | ||||||
|  |         legend: { | ||||||
|  |           show: false, | ||||||
|  |         }, | ||||||
|  |         xAxis: { | ||||||
|  |           type: "category", | ||||||
|  |           data: this.xData, | ||||||
|  |           axisLabel: { | ||||||
|  |             color: "#fff", | ||||||
|  |             fontSize: 10, | ||||||
|  |             interval: 0, | ||||||
|  |             rotate:30 | ||||||
|  |           }, | ||||||
|  |           axisTick: { show: false }, | ||||||
|  |           axisLine: { | ||||||
|  |             lineStyle: { | ||||||
|  |               width: 2, | ||||||
|  |               color: "#5982B2", | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |         }, | ||||||
|  |         yAxis: [{ | ||||||
|  |           name: "单位/片", | ||||||
|  |           nameTextStyle: { | ||||||
|  |             color: "#DFF1FE", | ||||||
|  |             fontSize: 12, | ||||||
|  |           }, | ||||||
|  |           type: "value", | ||||||
|  |           axisLabel: { | ||||||
|  |             color: "#DFF1FE", | ||||||
|  |             fontSize: 12, | ||||||
|  |             formatter: "{value}", | ||||||
|  |           }, | ||||||
|  |           axisLine: { | ||||||
|  |             show: true, | ||||||
|  |             lineStyle: { | ||||||
|  |               width: 2, | ||||||
|  |               color: "#5982B2", | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |           splitLine: { | ||||||
|  |             lineStyle: { | ||||||
|  |               width: 2, | ||||||
|  |               color: "#5982B2", | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |         },{ | ||||||
|  |           name: "良品率/%", | ||||||
|  |           nameTextStyle: { | ||||||
|  |             color: "#DFF1FE", | ||||||
|  |             fontSize: 12, | ||||||
|  |           }, | ||||||
|  |           type: "value", | ||||||
|  |           axisLabel: { | ||||||
|  |             color: "#DFF1FE", | ||||||
|  |             fontSize: 12, | ||||||
|  |             formatter: "{value}", | ||||||
|  |           }, | ||||||
|  |           axisLine: { | ||||||
|  |             show: true, | ||||||
|  |             lineStyle: { | ||||||
|  |               width: 2, | ||||||
|  |               color: "#5982B2", | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |           splitLine: { | ||||||
|  |             lineStyle: { | ||||||
|  |               width: 2, | ||||||
|  |               color: "#5982B2", | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |         }], | ||||||
|  |         tooltip: { | ||||||
|  |           trigger: "axis", | ||||||
|  |           axisPointer: { | ||||||
|  |             type: "shadow", | ||||||
|  |           }, | ||||||
|  |           className: "qhd-chart-tooltip", | ||||||
|  |           show: true, | ||||||
|  |         }, | ||||||
|  |         series: [ | ||||||
|  |           { | ||||||
|  |             data: this.inputData, | ||||||
|  |             type: "bar", | ||||||
|  |             barWidth: 10, | ||||||
|  |             barGap:0, | ||||||
|  |             itemStyle: { | ||||||
|  |               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | ||||||
|  |                 { offset: 0, color: 'rgba(157, 234, 245, 1)' }, | ||||||
|  |                 { offset: 1, color: 'rgba(110, 249, 222, 1)' }, | ||||||
|  |               ]), | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |           { | ||||||
|  |             data:this.outputData, | ||||||
|  |             type: "bar", | ||||||
|  |             barWidth: 10, | ||||||
|  |             itemStyle: { | ||||||
|  |               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | ||||||
|  |                 { offset: 0, color: 'rgba(92, 183, 255, 1)' }, | ||||||
|  |                 { offset: 1, color: 'rgba(54, 75, 254, 1)' }, | ||||||
|  |               ]), | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |           { | ||||||
|  |             data:this.goodRateData, | ||||||
|  |             type: "line", | ||||||
|  |             yAxisIndex: 1, | ||||||
|  |             symbol:'circle', | ||||||
|  |             symbolSize: 7, | ||||||
|  |             color:'rgba(18, 255, 245, 1)', | ||||||
|  |             areaStyle: { | ||||||
|  |               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ | ||||||
|  |                 { offset: 0, color: 'rgba(18, 255, 245, 0.8)' }, | ||||||
|  |                 { offset: 0.2, color: 'rgba(18, 255, 245, 0.2)' }, | ||||||
|  |                 { offset: 0.4, color: 'rgba(18, 255, 245, 0)' }, | ||||||
|  |               ]), | ||||||
|  |             } | ||||||
|  |           } | ||||||
|  |         ], | ||||||
|  |       } | ||||||
|  |       option && this.chart.setOption(option); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | <style lang='scss' scoped> | ||||||
|  | .leftBottomBox { | ||||||
|  |   width: 402px; | ||||||
|  |   height: 332px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/left-bottom.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   left: 23px; | ||||||
|  |   bottom:23px; | ||||||
|  |   .title { | ||||||
|  |     margin: 7px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 32px; | ||||||
|  |       height: 32px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |       margin-top: 5px; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .top_legend { | ||||||
|  |     color: #fff; | ||||||
|  |     font-size: 14px; | ||||||
|  |     position: absolute; | ||||||
|  |     left:120px; | ||||||
|  |     top:50px; | ||||||
|  |     .chart_legend_icon1{ | ||||||
|  |       margin-right: 10px; | ||||||
|  |     } | ||||||
|  |     .chart_legend_icon2{ | ||||||
|  |       margin-right: 14px; | ||||||
|  |     } | ||||||
|  |     .chart_legend_icon1:before { | ||||||
|  |       display: inline-block; | ||||||
|  |       content: ""; | ||||||
|  |       width: 10px; | ||||||
|  |       height: 10px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       border-radius: 2px; | ||||||
|  |       background: #73F8E0; | ||||||
|  |     } | ||||||
|  |     .chart_legend_icon2:before { | ||||||
|  |       display: inline-block; | ||||||
|  |       content: ""; | ||||||
|  |       width: 10px; | ||||||
|  |       height: 10px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       border-radius: 2px; | ||||||
|  |       background: #497EFF; | ||||||
|  |     } | ||||||
|  |     .chart_legend_icon3 { | ||||||
|  |       display: inline-block; | ||||||
|  |       width: 8px; | ||||||
|  |       height: 8px; | ||||||
|  |       margin-right: 8px; | ||||||
|  |       border-radius: 4px; | ||||||
|  |       background: #73F8E0; | ||||||
|  |       position:relative; | ||||||
|  |     } | ||||||
|  |     .chart_legend_icon3:before { | ||||||
|  |       display: inline-block; | ||||||
|  |       content: ""; | ||||||
|  |       width: 16px; | ||||||
|  |       height:2px; | ||||||
|  |       background: #73F8E0; | ||||||
|  |       position:absolute; | ||||||
|  |       top:3px; | ||||||
|  |       left:-4px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | .noData  { | ||||||
|  |   font-size: 24px; | ||||||
|  |   text-align: center; | ||||||
|  |   padding-top: 100px; | ||||||
|  | } | ||||||
|  | </style> | ||||||
|  | <style> | ||||||
|  | .qhd-chart-tooltip { | ||||||
|  |   background: #0a2b4f77 !important; | ||||||
|  |   border: none !important; | ||||||
|  |   backdrop-filter: blur(12px); | ||||||
|  | } | ||||||
|  | .qhd-chart-tooltip * { | ||||||
|  |   color: #fff !important; | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										162
									
								
								src/views/base/dataBoard/components/LeftTop.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,162 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='leftTopBox'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard1" class='icon'/> | ||||||
|  |       <span>近期数据对比</span> | ||||||
|  |     </div> | ||||||
|  |     <div class='title-split'> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/leftbar.png" alt=""> | ||||||
|  |       <span class='text'>本日</span> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/rightbar.png" alt=""> | ||||||
|  |     </div> | ||||||
|  |     <div class='data-box'> | ||||||
|  |       <div class='left-icon' style="top:19px;"> | ||||||
|  |         <img src="../../../../assets//images/dataBoard/leftTopIcon1.png" alt="" width='54'> | ||||||
|  |         <div>总投入</div> | ||||||
|  |       </div> | ||||||
|  |       <div class='left-icon' style="top:139px;"> | ||||||
|  |         <img src="../../../../assets//images/dataBoard/leftTopIcon2.png" alt="" width='48'> | ||||||
|  |         <div>总生产</div> | ||||||
|  |       </div> | ||||||
|  |       <div class='right-data' style="top:15px;"> | ||||||
|  |         <p><span class='num'>{{todayData?.inputNum ? formatThousands(todayData.inputNum) : '-'}}</span><span class='text'>片数</span></p> | ||||||
|  |         <p><span class='num'>{{todayData?.inputArea ? formatThousands(todayData.inputArea) : '-'}}</span><span class='text'>面积/㎡</span></p> | ||||||
|  |       </div> | ||||||
|  |       <div class='right-data' style="top:132px;"> | ||||||
|  |         <p><span class='num'>{{todayData?.outputNum ? formatThousands(todayData.outputNum) : '-'}}</span><span class='text'>片数</span></p> | ||||||
|  |         <p><span class='num'>{{todayData?.outputArea ? formatThousands(todayData.outputArea) : '-'}}</span><span class='text'>面积/㎡</span></p> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |     <div class='title-split'> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/leftbar.png" alt=""> | ||||||
|  |       <span class='text'>昨日</span> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/rightbar.png" alt=""> | ||||||
|  |     </div> | ||||||
|  |     <div class='data-box'> | ||||||
|  |       <div class='left-icon' style="top:19px;"> | ||||||
|  |         <img src="../../../../assets//images/dataBoard/leftTopIcon1.png" alt="" width='54'> | ||||||
|  |         <div>总投入</div> | ||||||
|  |       </div> | ||||||
|  |       <div class='left-icon' style="top:139px;"> | ||||||
|  |         <img src="../../../../assets//images/dataBoard/leftTopIcon2.png" alt="" width='48'> | ||||||
|  |         <div>总生产</div> | ||||||
|  |       </div> | ||||||
|  |       <div class='right-data' style="top:15px;"> | ||||||
|  |         <p><span class='num'>{{yesterdayData?.inputNum ? formatThousands(yesterdayData.inputNum) : '-'}}</span><span class='text'>片数</span></p> | ||||||
|  |         <p><span class='num'>{{yesterdayData?.inputArea ? formatThousands(yesterdayData.inputArea) : '-'}}</span><span class='text'>面积/㎡</span></p> | ||||||
|  |       </div> | ||||||
|  |       <div class='right-data' style="top:132px;"> | ||||||
|  |         <p><span class='num'>{{yesterdayData?.outputNum ? formatThousands(yesterdayData.outputNum) : '-'}}</span><span class='text'>片数</span></p> | ||||||
|  |         <p><span class='num'>{{yesterdayData?.outputArea ? formatThousands(yesterdayData.outputArea) : '-'}}</span><span class='text'>面积/㎡</span></p> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: 'LeftTop', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       val.todayAndYesterday && val.todayAndYesterday.forEach(item => { | ||||||
|  |         if (item.dataType === "今日") { | ||||||
|  |           this.todayData = item | ||||||
|  |         } else { | ||||||
|  |           this.yesterdayData = item | ||||||
|  |         } | ||||||
|  |       }) | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       todayData:{}, | ||||||
|  |       yesterdayData:{} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   methods: {} | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | <style lang='scss' scoped> | ||||||
|  | .leftTopBox { | ||||||
|  |   width: 402px; | ||||||
|  |   height: 600px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/left-top.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   left: 23px; | ||||||
|  |   top:113px; | ||||||
|  |   .title { | ||||||
|  |     margin: 10px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 33px; | ||||||
|  |       height: 33px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .title-split { | ||||||
|  |     margin-left: 95px; | ||||||
|  |     margin-top: 10px; | ||||||
|  |     .text{ | ||||||
|  |       display: inline-block; | ||||||
|  |       width: 100px; | ||||||
|  |       font-size: 22px; | ||||||
|  |       color: #01CFCC; | ||||||
|  |       line-height: 24px; | ||||||
|  |       letter-spacing: 7px; | ||||||
|  |       text-align: center; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .data-box { | ||||||
|  |     width: 358px; | ||||||
|  |     height: 230px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/leftTopDataBox.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     margin-top: 8px; | ||||||
|  |     position: relative; | ||||||
|  |     left: 24px; | ||||||
|  |     .left-icon { | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 16px; | ||||||
|  |       color: #9DEAF5; | ||||||
|  |       line-height: 22px; | ||||||
|  |       letter-spacing: 1px; | ||||||
|  |       text-shadow: 0px 4px 2px rgba(0,0,0,0.62); | ||||||
|  |       position: absolute; | ||||||
|  |       left: 30px; | ||||||
|  |     } | ||||||
|  |     .right-data { | ||||||
|  |       position: absolute; | ||||||
|  |       left: 100px; | ||||||
|  |       p{ | ||||||
|  |         margin: 0; | ||||||
|  |       }; | ||||||
|  |       .num { | ||||||
|  |         font-weight: 500; | ||||||
|  |         font-size: 32px; | ||||||
|  |         color: #FFFFFF; | ||||||
|  |         text-shadow: 0px 4px 2px rgba(0,0,0,0.62); | ||||||
|  |         margin-right: 5px; | ||||||
|  |       } | ||||||
|  |       .text { | ||||||
|  |         font-weight: 500; | ||||||
|  |         font-size: 16px; | ||||||
|  |         color: #FFFFFF; | ||||||
|  |         letter-spacing: 1px; | ||||||
|  |         text-shadow: 0px 4px 2px rgba(0,0,0,0.62); | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										198
									
								
								src/views/base/dataBoard/components/RightBottom.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,198 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='rightBottomBox'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard3" class='icon'/> | ||||||
|  |       <span>本月<span class='dotted'></span>班组生产排名</span> | ||||||
|  |     </div> | ||||||
|  |     <div class='rankingLeft'> | ||||||
|  |       <div class='rankingLeftTitle'>产量</div> | ||||||
|  |       <div class='rankingTypeBox'> | ||||||
|  |         <div style='margin-bottom: 10px;' v-for='(item,index) in teamProductionRank' :key='index'> | ||||||
|  |         <img :src="require(`../../../../assets/images/dataBoard/ranking${index+1}.png`)" alt="" width="50"> | ||||||
|  |           <div class='rankingTextBox'> | ||||||
|  |             <p class='text1'>{{item.name}}/片</p> | ||||||
|  |             <p class='text2'>{{item?.value ? formatThousands(item.value) : '-'}}</p> | ||||||
|  |           </div> | ||||||
|  |         </div> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |     <div class='rankingRight'> | ||||||
|  |       <div class='rankingRightTitle'> | ||||||
|  |         成品率 | ||||||
|  |       </div> | ||||||
|  |       <div class='rankingTypeBox' style='left: 120px;'> | ||||||
|  |         <div style='margin-bottom: 10px;' v-for='(item,index) in teamRateRank' :key='index'> | ||||||
|  |           <img :src="require(`../../../../assets/images/dataBoard/ranking${index+1}.png`)" alt="" width="50"> | ||||||
|  |           <div class='rankingTextBox'> | ||||||
|  |             <p class='text1'>{{item.name}}</p> | ||||||
|  |             <p class='text2'>{{Math.trunc(item.value)}}<span style='font-size: 20px;'>.{{item.value1}}%</span></p> | ||||||
|  |           </div> | ||||||
|  |         </div> | ||||||
|  |         <!-- <div> | ||||||
|  |           <img src="../../../../assets//images//dataBoard/ranking2.png" alt="" width='50'> | ||||||
|  |           <div class='rankingTextBox'> | ||||||
|  |             <p class='text1'>班组1</p> | ||||||
|  |             <p class='text2'>94<span style='font-size: 20px;'>.13%</span></p> | ||||||
|  |           </div> | ||||||
|  |         </div> | ||||||
|  |         <div> | ||||||
|  |           <img src="../../../../assets//images//dataBoard/ranking3.png" alt="" width='50'> | ||||||
|  |           <div class='rankingTextBox'> | ||||||
|  |             <p class='text1'>班组1</p> | ||||||
|  |             <p class='text2'>90<span style='font-size: 20px;'>.42%</span></p> | ||||||
|  |           </div> | ||||||
|  |         </div> --> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | export default { | ||||||
|  |   name: 'RightBottom', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       this.teamProductionRank = [] | ||||||
|  |       this.teamRateRank = [] | ||||||
|  |       val.teamProductionRank && val.teamProductionRank.forEach(item => { | ||||||
|  |         let obj = { | ||||||
|  |           name: item.name, | ||||||
|  |           value: item.value, | ||||||
|  |           rank: item.rank, | ||||||
|  |         } | ||||||
|  |         this.teamProductionRank.push(obj) | ||||||
|  |       }) | ||||||
|  |       val.teamRateRank && val.teamRateRank.forEach(item => { | ||||||
|  |         let obj = { | ||||||
|  |           name: item.name, | ||||||
|  |           value: item.value, | ||||||
|  |           rank: item.rank, | ||||||
|  |           value1: this.getPositiveDecimal(item.value) | ||||||
|  |         } | ||||||
|  |         this.teamRateRank.push(obj) | ||||||
|  |       }) | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       teamProductionRank:[], | ||||||
|  |       teamRateRank:[] | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   mounted() {}, | ||||||
|  |   methods: { | ||||||
|  |     getPositiveDecimal(num) {   | ||||||
|  |       const str = Math.abs(num).toString();   | ||||||
|  |       const [, decimal] = str.split('.'); | ||||||
|  |       return decimal || '00'; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | <style lang='scss' scoped> | ||||||
|  | p{ | ||||||
|  |   margin: 0; | ||||||
|  | } | ||||||
|  | .rightBottomBox { | ||||||
|  |   width: 755px; | ||||||
|  |   height: 332px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/right-bottom.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   right: 23px; | ||||||
|  |   bottom:23px; | ||||||
|  |   .title { | ||||||
|  |     margin: 10px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 33px; | ||||||
|  |       height: 33px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |       .dotted { | ||||||
|  |         display: inline-block; | ||||||
|  |         width: 4px; | ||||||
|  |         height: 4px; | ||||||
|  |         border-radius: 2px; | ||||||
|  |         background-color: #52FFF1; | ||||||
|  |         margin: 0 8px; | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .rankingLeft { | ||||||
|  |     width: 405px; | ||||||
|  |     height: 265px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/rankingBg1.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     left: 12px; | ||||||
|  |     top: 48px; | ||||||
|  |     .rankingLeftTitle { | ||||||
|  |       width: 24px; | ||||||
|  |       height: 73px; | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 55px; | ||||||
|  |       position: relative; | ||||||
|  |       left: 37px; | ||||||
|  |       top: 63px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .rankingRight { | ||||||
|  |     width: 338px; | ||||||
|  |     height: 265px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/rankingBg2.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: absolute; | ||||||
|  |     right: 12px; | ||||||
|  |     top: 48px; | ||||||
|  |     .rankingRightTitle { | ||||||
|  |       width: 24px; | ||||||
|  |       height: 132px; | ||||||
|  |       font-weight: 500; | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 55px; | ||||||
|  |       position: relative; | ||||||
|  |       left: 37px; | ||||||
|  |       top: 43px; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .rankingTypeBox { | ||||||
|  |       position: absolute; | ||||||
|  |       left: 100px; | ||||||
|  |       top:13px; | ||||||
|  |       .rankingTextBox { | ||||||
|  |         display: inline-block; | ||||||
|  |         margin-left: 16px; | ||||||
|  |         vertical-align: top; | ||||||
|  |         .text1 { | ||||||
|  |           font-weight: 500; | ||||||
|  |           font-size: 17px; | ||||||
|  |           color: #FFFFFF; | ||||||
|  |           line-height: 22px; | ||||||
|  |           letter-spacing: 1px; | ||||||
|  |           padding-top: 5px; | ||||||
|  |         } | ||||||
|  |         .text2 { | ||||||
|  |           font-weight: 500; | ||||||
|  |           font-size: 32px; | ||||||
|  |           color: #FFFFFF; | ||||||
|  |           line-height: 22px; | ||||||
|  |           margin-top: 8px; | ||||||
|  |         } | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										352
									
								
								src/views/base/dataBoard/components/RightTop.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,352 @@ | |||||||
|  | <template> | ||||||
|  |   <div class='rightTopBox'> | ||||||
|  |     <div class='title'> | ||||||
|  |       <svg-icon icon-class="dataBoard4" class='icon'/> | ||||||
|  |       <span>缺陷情况</span> | ||||||
|  |     </div> | ||||||
|  |     <div class='title-split'> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/leftbar.png" alt=""> | ||||||
|  |       <span class='text'>总数</span> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/rightbar.png" alt=""> | ||||||
|  |     </div> | ||||||
|  |     <div class='dataBox'> | ||||||
|  |       <div class='row'> | ||||||
|  |         <div class='box' style='width: 105px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span style='margin-right: 3px;'>当日</span> | ||||||
|  |             <img v-show='nokSumDet.today >= nokSumDet.yesterday' src="../../../../assets/images/dataBoard/arrUp.png" alt="" width='5' height='15'> | ||||||
|  |             <img v-show='nokSumDet.today < nokSumDet.yesterday' src="../../../../assets/images/dataBoard/arrDown.png" alt="" width='5' height='15'> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.today ? formatThousands(nokSumDet.today) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |         <div class='box' style='width: 115px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span style='margin-right: 3px;'>本月</span> | ||||||
|  |             <img v-show='nokSumDet.month >= nokSumDet.lastMonth' src="../../../../assets/images/dataBoard/arrUp.png" alt="" width='5' height='15'> | ||||||
|  |             <img v-show='nokSumDet.month < nokSumDet.lastMonth' src="../../../../assets/images/dataBoard/arrDown.png" alt="" width='5' height='15'> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.month ? formatThousands(nokSumDet.month) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |         <div class='box' style='width: 110px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span style='margin-right: 3px;'>本年</span> | ||||||
|  |             <img v-show='nokSumDet.year >= nokSumDet.lastYear' src="../../../../assets/images/dataBoard/arrUp.png" alt="" width='5' height='15'> | ||||||
|  |             <img v-show='nokSumDet.year < nokSumDet.lastYear' src="../../../../assets/images/dataBoard/arrDown.png" alt="" width='5' height='15'> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.year ? formatThousands(nokSumDet.year) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |       </div> | ||||||
|  |       <div class='row' style='padding-top: 5px;'> | ||||||
|  |         <div class='box' style='width: 105px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span>昨日</span> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.yesterday ? formatThousands(nokSumDet.yesterday) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |         <div class='box' style='width: 115px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span>上月</span> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.lastMonth ? formatThousands(nokSumDet.lastMonth) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |         <div class='box' style='width: 110px;'> | ||||||
|  |           <p class='name'> | ||||||
|  |             <span>上年</span> | ||||||
|  |           </p> | ||||||
|  |           <p class='num'>{{nokSumDet?.lastYear ? formatThousands(nokSumDet.lastYear) : '-'}}</p> | ||||||
|  |         </div> | ||||||
|  |       </div> | ||||||
|  |     </div> | ||||||
|  |     <div class='title-split2'> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/leftbar.png" alt=""> | ||||||
|  |       <span class='text'>全厂缺陷汇总</span> | ||||||
|  |       <img src="../../../../assets//images/dataBoard/rightbar.png" alt=""> | ||||||
|  |     </div> | ||||||
|  |     <div id='defectSumChart' style='width: 400px;height: 315px;'></div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  | <script> | ||||||
|  | import * as echarts from 'echarts'; | ||||||
|  | const colors = [ | ||||||
|  |   "rgb(39, 96, 255)", | ||||||
|  |   "rgb(91, 155, 255)", | ||||||
|  |   "rgb(153, 214, 108)", | ||||||
|  |   "rgb(18, 255, 245)", | ||||||
|  |   "rgb(221, 177, 18)", | ||||||
|  | ]; | ||||||
|  | export default { | ||||||
|  |   name: 'RightTop', | ||||||
|  |   props: { | ||||||
|  |     dataObj: { | ||||||
|  |       type: Object, | ||||||
|  |       default: () => {} | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   watch: { | ||||||
|  |     dataObj(val) { | ||||||
|  |       this.nokSumDet = val.nokSumDet | ||||||
|  |       this.dataProps = [] | ||||||
|  |       val.nokPieDet && val.nokPieDet.forEach(item => { | ||||||
|  |         let obj = { | ||||||
|  |           value: item.num, | ||||||
|  |           name: item.type | ||||||
|  |         } | ||||||
|  |         this.dataProps.push(obj) | ||||||
|  |       }) | ||||||
|  |       this.initChart() | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   data() { | ||||||
|  |     return { | ||||||
|  |       nokSumDet:{}, | ||||||
|  |       chartDom: '', | ||||||
|  |       chart: '', | ||||||
|  |       dataProps:[], | ||||||
|  |       rangArrValue:[], | ||||||
|  |       dataList:[], | ||||||
|  |       totalValue:0 | ||||||
|  |     } | ||||||
|  |   }, | ||||||
|  |   mounted() {}, | ||||||
|  |   methods: { | ||||||
|  |     initChart() { | ||||||
|  |       if ( | ||||||
|  |         this.chart !== null && | ||||||
|  |         this.chart !== '' && | ||||||
|  |         this.chart !== undefined | ||||||
|  |       ) { | ||||||
|  |         this.chart.dispose() // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例 | ||||||
|  |       } | ||||||
|  |       this.chartDom = document.getElementById('defectSumChart') | ||||||
|  |       this.chart = echarts.init(this.chartDom) | ||||||
|  |       var option; | ||||||
|  |       this.getPersonnelList(this.dataProps) | ||||||
|  |       option = { | ||||||
|  |         color: colors, | ||||||
|  |         graphic: [ | ||||||
|  |           { | ||||||
|  |             type: "text", | ||||||
|  |             left: "center", | ||||||
|  |             top: "44%", | ||||||
|  |             style: { | ||||||
|  |               text: this.totalValue, | ||||||
|  |               fill: "#fff", | ||||||
|  |               width: 150, | ||||||
|  |               height: 44, | ||||||
|  |               fontSize: 31, | ||||||
|  |               fontWeight: 400, | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |           { | ||||||
|  |             type: "text", | ||||||
|  |             left: "center", | ||||||
|  |             top: "55%", | ||||||
|  |             style: { | ||||||
|  |               text: "总数/件", | ||||||
|  |               fill: "rgba(255, 255, 255, 0.70)", | ||||||
|  |               width: 32, | ||||||
|  |               height: 16, | ||||||
|  |               fontSize: 16, | ||||||
|  |               fontWeight: 400, | ||||||
|  |             }, | ||||||
|  |           }, | ||||||
|  |         ], | ||||||
|  |         series: [ | ||||||
|  |           { | ||||||
|  |             name: "产线缺陷分类", | ||||||
|  |             type: "pie", | ||||||
|  |             radius: ["45%", "60%"], | ||||||
|  |             center: ["50%", "50%"], | ||||||
|  |             label:{ | ||||||
|  |               formatter:function(params){ | ||||||
|  |                 return `{color${params.dataIndex}|${params.percent}%}\n{style2|${params.name}}` | ||||||
|  |               }, | ||||||
|  |               rich:{ | ||||||
|  |                 color0:{color:'rgb(39, 96, 255)',fontSize:22}, | ||||||
|  |                 color1:{color:'rgb(91, 155, 255)',fontSize:22}, | ||||||
|  |                 color2:{color:'rgb(153, 214, 108)',fontSize:22}, | ||||||
|  |                 color3:{color:'rgb(18, 255, 245)',fontSize:22}, | ||||||
|  |                 color4:{color:'rgb(221, 177, 18)',fontSize:22}, | ||||||
|  |                 color5:{color:'rgb(39, 96, 255)',fontSize:22}, | ||||||
|  |                 color6:{color:'rgb(91, 155, 255)',fontSize:22}, | ||||||
|  |                 color7:{color:'rgb(153, 214, 108)',fontSize:22}, | ||||||
|  |                 color8:{color:'rgb(18, 255, 245)',fontSize:22}, | ||||||
|  |                 color9:{color:'rgb(221, 177, 18)',fontSize:22}, | ||||||
|  |                 style2:{ | ||||||
|  |                   color:'#fff', | ||||||
|  |                   fontSize:14 | ||||||
|  |                 } | ||||||
|  |               } | ||||||
|  |             }, | ||||||
|  |             data: this.dataList, | ||||||
|  |           }, | ||||||
|  |         ], | ||||||
|  |       } | ||||||
|  |       option && this.chart.setOption(option); | ||||||
|  |     }, | ||||||
|  |     getCoordinates(startArc, endArc) { | ||||||
|  |       const posi = [ | ||||||
|  |         Math.sin(startArc), | ||||||
|  |         -Math.cos(startArc), | ||||||
|  |         Math.sin(endArc), | ||||||
|  |         -Math.cos(endArc), | ||||||
|  |       ]; | ||||||
|  |       const dx = posi[2] - posi[0]; | ||||||
|  |       const dy = posi[3] - posi[1]; | ||||||
|  |  | ||||||
|  |       return this.getLocation(dx, dy); | ||||||
|  |     }, | ||||||
|  |     getLocation(dx,dy) { | ||||||
|  |       const tanV = dx / dy; | ||||||
|  |       const directSign = Math.abs(tanV) < 1; | ||||||
|  |       const t = directSign ? tanV : 1 / tanV; | ||||||
|  |  | ||||||
|  |       const sign1 = t > 0 ? 1 : -1; | ||||||
|  |       const sign2 = dx > 0 ? 1 : -1; | ||||||
|  |       const sign = directSign ? sign1 * sign2 : sign2; | ||||||
|  |  | ||||||
|  |       const group1 = [0.5 - (sign * t) / 2, 0.5 + (sign * t) / 2]; | ||||||
|  |       const group2 = sign > 0 ? [0, 1] : [1, 0]; | ||||||
|  |       const group = [...group1, ...group2]; | ||||||
|  |       const keys = directSign ? ["x", "x2", "y", "y2"] : ["y", "y2", "x", "x2"]; | ||||||
|  |  | ||||||
|  |       let res = {}; | ||||||
|  |       keys.forEach((k, idx) => { | ||||||
|  |         res[k] = group[idx]; | ||||||
|  |       }); | ||||||
|  |       return res; | ||||||
|  |     }, | ||||||
|  |     async getPersonnelList(dataProps){ | ||||||
|  |       this.rangArrValue = []; | ||||||
|  |       this.totalValue = 0; | ||||||
|  |       this.dataList = []; | ||||||
|  |       this.totalValue = dataProps.reduce( | ||||||
|  |         (total, value) => total + value.value, | ||||||
|  |         0 | ||||||
|  |       ); | ||||||
|  |       let cacheNum = 0; | ||||||
|  |       for (let i = 0; i < dataProps.length; i++) { | ||||||
|  |         const endNum = cacheNum + dataProps[i].value; | ||||||
|  |         this.rangArrValue.push([cacheNum, endNum]); | ||||||
|  |         cacheNum = endNum; | ||||||
|  |       } | ||||||
|  |       const angleArr = this.rangArrValue.map((arr) => | ||||||
|  |         arr.map((num) => (num / this.totalValue) * Math.PI * 2) | ||||||
|  |       ); | ||||||
|  |       this.dataList = dataProps.map((item, index) => { | ||||||
|  |         const range = this.getCoordinates(angleArr[index][0], angleArr[index][1]); | ||||||
|  |         const startColor = colors[index%5]; | ||||||
|  |         const color = { | ||||||
|  |           type: "linear", | ||||||
|  |           x: range.x, | ||||||
|  |           x2: range.x2, | ||||||
|  |           y: range.y, | ||||||
|  |           y2: range.y2, | ||||||
|  |           colorStops: [ | ||||||
|  |             { | ||||||
|  |               offset: 0, | ||||||
|  |               color: startColor, // 起始颜色 | ||||||
|  |             }, | ||||||
|  |             { | ||||||
|  |               offset: 1, | ||||||
|  |               color: `${startColor.substring(0, startColor.length - 1)}, 0.2)`, // 终点颜色 | ||||||
|  |             }, | ||||||
|  |           ], | ||||||
|  |           global: false, | ||||||
|  |         }; | ||||||
|  |  | ||||||
|  |         return { | ||||||
|  |           name: item.name, | ||||||
|  |           value: item.value, | ||||||
|  |           itemStyle: { | ||||||
|  |             color: color, | ||||||
|  |           }, | ||||||
|  |         }; | ||||||
|  |       }); | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </script> | ||||||
|  | <style lang='scss' scoped> | ||||||
|  | p{ | ||||||
|  |   margin: 0; | ||||||
|  | } | ||||||
|  | .rightTopBox { | ||||||
|  |   width: 402px; | ||||||
|  |   height: 600px; | ||||||
|  |   background: url('../../../../assets/images/dataBoard/left-top.png') no-repeat; | ||||||
|  |   background-size: 100%; | ||||||
|  |   position: absolute; | ||||||
|  |   right: 23px; | ||||||
|  |   top:113px; | ||||||
|  |   .title { | ||||||
|  |     margin: 10px 0 0 15px; | ||||||
|  |     .icon { | ||||||
|  |       width: 33px; | ||||||
|  |       height: 33px; | ||||||
|  |       margin-right: 5px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |     span { | ||||||
|  |       font-size: 24px; | ||||||
|  |       color: #52FFF1; | ||||||
|  |       line-height: 24px; | ||||||
|  |       vertical-align:middle; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .title-split { | ||||||
|  |     margin-left: 95px; | ||||||
|  |     margin-top: 10px; | ||||||
|  |     .text{ | ||||||
|  |       display: inline-block; | ||||||
|  |       width: 100px; | ||||||
|  |       font-size: 22px; | ||||||
|  |       color: #01CFCC; | ||||||
|  |       line-height: 24px; | ||||||
|  |       letter-spacing: 7px; | ||||||
|  |       text-align: center; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .title-split2 { | ||||||
|  |     margin-left: 66px; | ||||||
|  |     margin-top: 20px; | ||||||
|  |     .text{ | ||||||
|  |       display: inline-block; | ||||||
|  |       width: 160px; | ||||||
|  |       font-size: 22px; | ||||||
|  |       color: #01CFCC; | ||||||
|  |       line-height: 24px; | ||||||
|  |       letter-spacing: 2px; | ||||||
|  |       text-align: center; | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  |   .dataBox { | ||||||
|  |     width: 358px; | ||||||
|  |     height: 160px; | ||||||
|  |     background: url('../../../../assets/images/dataBoard/defectNum.png') no-repeat; | ||||||
|  |     background-size: 100%; | ||||||
|  |     position: relative; | ||||||
|  |     left: 21px; | ||||||
|  |     top:8px; | ||||||
|  |     padding-left: 24px; | ||||||
|  |     .row { | ||||||
|  |       .box{ | ||||||
|  |         display: inline-block; | ||||||
|  |         padding-top: 10px; | ||||||
|  |         .name { | ||||||
|  |           font-weight: 500; | ||||||
|  |           font-size: 20px; | ||||||
|  |           color: #FFFFFF; | ||||||
|  |           letter-spacing: 2px; | ||||||
|  |         } | ||||||
|  |         .num { | ||||||
|  |           font-weight: 500; | ||||||
|  |           font-size: 28px; | ||||||
|  |           color: #FFFFFF; | ||||||
|  |           text-shadow: 0px 5px 2px rgba(0,0,0,0.62); | ||||||
|  |         } | ||||||
|  |       } | ||||||
|  |     } | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | </style> | ||||||
| @@ -1,100 +1,239 @@ | |||||||
| <!--  |  | ||||||
|     filename: index.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2023-10-11 09:32:04 |  | ||||||
|     description: 设备看板 |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| 	<div ref="dataBoard" class="data-board"> | 	<div ref='dataBoardBoxB' class='dataBoardBoxB'> | ||||||
| 		<el-button type="text" @click="goback" class="go-back--btn">返回</el-button> | 		<div id="dataBoardBox" class='dataBoardBox' style="width: 1920px;height: 1080px;" :style="{ transform: 'scale(' + scaleNum + ')' }"> | ||||||
|  | 			<DataBoardHeader | ||||||
|  | 				:is-full-screen="isFullScreen" | ||||||
|  | 				@screenfullChange="screenfullChange" | ||||||
|  | 			/> | ||||||
|  | 			<LeftTop :dataObj='dataObj'/> | ||||||
|  | 			<LeftBottom :dataObj='dataObj'/> | ||||||
|  | 			<CenterTop :scaleNum='scaleNum' :dataObj='dataObj'/> | ||||||
|  | 			<CenterBottomL :dataObj='dataObj'/> | ||||||
|  | 			<CenterBottomR :dataObj='dataObj'/> | ||||||
|  | 			<RightTop :dataObj='dataObj'/> | ||||||
|  | 			<RightBottom :dataObj='dataObj'/> | ||||||
|  | 		</div> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
|  | import DataBoardHeader from './components/Header.vue'; | ||||||
|  | import LeftTop from './components/LeftTop.vue'; | ||||||
|  | import LeftBottom from './components/LeftBottom.vue'; | ||||||
|  | import CenterTop from './components/CenterTop.vue'; | ||||||
|  | import CenterBottomL from './components/CenterBottomL.vue'; | ||||||
|  | import CenterBottomR from './components/CenterBottomR.vue'; | ||||||
|  | import RightTop from './components/RightTop.vue'; | ||||||
|  | import RightBottom from './components/RightBottom.vue'; | ||||||
|  | import { debounce } from '@/utils/debounce'; | ||||||
|  | import screenfull from 'screenfull'; | ||||||
|  | import { getAccessToken } from '@/utils/auth'; | ||||||
|  | import store from "@/store"; | ||||||
| export default { | export default { | ||||||
| 	name: 'DataBoard', | 	name: 'DataBoard', | ||||||
| 	components: {}, | 	components: { DataBoardHeader,LeftTop,LeftBottom,CenterTop,CenterBottomL,CenterBottomR,RightTop,RightBottom }, | ||||||
| 	props: {}, | 	props: {}, | ||||||
| 	data() { | 	data() { | ||||||
| 		return { | 		return { | ||||||
| 			appMain: null, // dom | 			isFullScreen: false, | ||||||
| 			parentStyle: { | 			scaleNum: 0.8, | ||||||
| 				margin: '8px 14px 0px 16px', | 			dataObj:{}, | ||||||
| 				minHeight: 'calc(100vh - 120px - 8px)', | 			sseReader: null,        // 保存流读取器 | ||||||
| 			}, // object |       abortController: null,  // 用于中止 fetch 请求 | ||||||
| 			mainFooter: null, // dom |       retryCount: 0,          // 当前重试次数 | ||||||
|  |       isDestroyed: false      // 标记组件是否已销毁 | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	// mounted() { | 	created() { | ||||||
| 	// 	this.$nextTick(() => { |     this.init() | ||||||
| 	// 		this.modify(); |   }, | ||||||
| 	// 	}); | 	mounted() { | ||||||
| 	// }, | 	  this.boxReset = debounce(() => { | ||||||
| 	// activated() { |       this.resetSize() | ||||||
| 	// 	this.modify(); |     }, 300) | ||||||
| 	// }, |     this.boxReset() | ||||||
| 	// deactivated() { |     window.addEventListener('resize', () => { | ||||||
| 	// 	this.recover(); |       this.boxReset() | ||||||
| 	// }, |     }) | ||||||
| 	// beforeDestroy() { | 		this.getData() | ||||||
| 	// 	this.recover(); | 	}, | ||||||
| 	// }, | 	beforeDestroy() { | ||||||
| 	methods: { |     this.closeSSE(); | ||||||
| 		// modify() { |   }, | ||||||
| 		// 	// 在这个页面临时修改下父类的margin,结束时需还原 |   destroyed() { | ||||||
| 		// 	this.appMain = document.querySelector('.app-main'); |     window.removeEventListener('resize', this.boxReset); | ||||||
| 		// 	// this.appMain.style.minHeight = 'calc(100vh - 90px)'; |   }, | ||||||
| 		// 	this.appMain.style.margin = 0; | 	computed: { | ||||||
| 		// 	// 在这个页面临时删除 main-footer 元素,结束时需还原 | 		sidebarOpened() { | ||||||
| 		// 	// this.mainFooter = document.querySelector('.main-footer').cloneNode(true); | 			return this.$store.state.app.sidebar.opened | ||||||
| 		// 	// document.querySelector('.main-footer').remove(); |  | ||||||
|         //     this.$refs.dataBoard.classList.add('data-board'); |  | ||||||
| 		// }, |  | ||||||
| 		// recover() { |  | ||||||
|         //     this.$refs.dataBoard.classList.remove('data-board'); |  | ||||||
| 		// 	this.$nextTick(() => { |  | ||||||
| 		// 		this.appMain.style.margin = this.parentStyle.margin; |  | ||||||
| 		// 		// this.appMain.style.minHeight = this.parentStyle.minHeight; |  | ||||||
| 		// 		// this.appMain.insertAdjacentElement('afterend', this.mainFooter); |  | ||||||
| 		// 	}); |  | ||||||
| 		// }, |  | ||||||
| 		goback() { |  | ||||||
| 			this.$router.go(-1); |  | ||||||
| 		} | 		} | ||||||
| 	}, | 	}, | ||||||
|  | 	watch: { | ||||||
|  | 		sidebarOpened(newVal, oldVal) { | ||||||
|  | 			this.boxReset() | ||||||
|  | 		} | ||||||
|  | 	}, | ||||||
|  | 	methods: { | ||||||
|  | 		async getData() { | ||||||
|  | 			let _this = this; | ||||||
|  | 			if (_this.isDestroyed) return; | ||||||
|  | 			const url = process.env.VUE_APP_BASE_API+'/admin-api/monitoring/message/subscribe/'+store.getters.userId+'-'+Date.now(); | ||||||
|  | 			const token = getAccessToken() | ||||||
|  | 			const headers = new Headers({ | ||||||
|  |         'Authorization': `Bearer ${token}`, | ||||||
|  |         'Content-Type': 'text/event-stream' | ||||||
|  |       }); | ||||||
|  | 			try { | ||||||
|  |         // 创建中止控制器 | ||||||
|  |         this.abortController = new AbortController(); | ||||||
|  |         // 发起 fetch 请求(替换为你的接口地址) | ||||||
|  |         const response = await fetch(url, { | ||||||
|  |           method: 'GET', | ||||||
|  |           headers: headers, | ||||||
|  |           signal: _this.abortController.signal // 绑定中止信号 | ||||||
|  |         }); | ||||||
|  |  | ||||||
|  |         // 获取流读取器 | ||||||
|  |         _this.sseReader = response.body.getReader(); | ||||||
|  |         const decoder = new TextDecoder(); | ||||||
|  |  | ||||||
|  |         // 持续读取流数据 | ||||||
|  |         while (true) { | ||||||
|  |           const { done, value } = await _this.sseReader.read(); | ||||||
|  |           if (done) { | ||||||
|  |             console.log('SSE 连接正常关闭'); | ||||||
|  |             _this.handleReconnect(); // 触发重连 | ||||||
|  |             break; | ||||||
|  |           } | ||||||
|  |           // 处理 SSE 事件数据 | ||||||
|  |           const data = decoder.decode(value); | ||||||
|  |           console.log('收到消息:', data); | ||||||
|  | 					if (_this.isValidData(data)){ | ||||||
|  | 						_this.upDateMsg(data); | ||||||
|  | 					} | ||||||
|  |         } | ||||||
|  |       } catch (error) { | ||||||
|  |         // 主动中止的请求不报错 | ||||||
|  |         if (error.name === 'AbortError') return; | ||||||
|  |         console.error('SSE 连接异常:', error); | ||||||
|  |         _this.handleReconnect(); // 触发重连 | ||||||
|  |       } | ||||||
|  | 		}, | ||||||
|  | 		closeSSE() { | ||||||
|  |       this.isDestroyed = true; // 标记销毁 | ||||||
|  |       if (this.abortController) { | ||||||
|  |         this.abortController.abort(); // 中止 fetch 请求 | ||||||
|  |       } | ||||||
|  |       if (this.sseReader) { | ||||||
|  |         this.sseReader.cancel();      // 关闭流读取器 | ||||||
|  |         this.sseReader = null; | ||||||
|  |       } | ||||||
|  |       console.log('SSE 连接已强制关闭'); | ||||||
|  |     }, | ||||||
|  | 		handleReconnect() { | ||||||
|  |       if (this.isDestroyed) return; | ||||||
|  |       // 指数退避策略(最大重试 5 次) | ||||||
|  |       const maxRetries = 5; | ||||||
|  |       if (this.retryCount < maxRetries) { | ||||||
|  |         const delay = Math.pow(2, this.retryCount) * 1000; | ||||||
|  |         setTimeout(() => { | ||||||
|  |           this.retryCount++; | ||||||
|  |           this.initSSE(); | ||||||
|  |         }, delay); | ||||||
|  |       } else { | ||||||
|  |         console.error('SSE 重连次数已达上限'); | ||||||
|  |       } | ||||||
|  |     }, | ||||||
|  | 		isValidData (data) { | ||||||
|  | 		  return data.trim().startsWith('data:{') && !data.includes('heartbeat'); | ||||||
|  | 		}, | ||||||
|  | 		upDateMsg(data) { | ||||||
|  |       const jsonStr = data.replace(/^data:/, '').trim(); | ||||||
|  |       console.log('jsonStr', jsonStr); | ||||||
|  |  | ||||||
|  | 			try { | ||||||
|  | 				const dataObj = JSON.parse(jsonStr); | ||||||
|  | 				this.dataObj = dataObj | ||||||
|  | 				console.log('dataObj',this.dataObj) | ||||||
|  | 			} catch (e) { | ||||||
|  | 				console.error('JSON 解析失败:', e); | ||||||
|  | 			} | ||||||
|  | 		}, | ||||||
|  | 		change() { | ||||||
|  |       this.isFullScreen = screenfull.isFullscreen | ||||||
|  |     }, | ||||||
|  | 		init() { | ||||||
|  |       if (!screenfull.isEnabled) { | ||||||
|  |         this.$message({ | ||||||
|  |           message: 'you browser can not work', | ||||||
|  |           type: 'warning' | ||||||
|  |         }) | ||||||
|  |         return false | ||||||
|  |       } | ||||||
|  |       screenfull.on('change', this.change) | ||||||
|  |     }, | ||||||
|  |     destroy() { | ||||||
|  |       if (!screenfull.isEnabled) { | ||||||
|  |         this.$message({ | ||||||
|  |           message: 'you browser can not work', | ||||||
|  |           type: 'warning' | ||||||
|  |         }) | ||||||
|  |         return false | ||||||
|  |       } | ||||||
|  |       screenfull.off('change', this.change) | ||||||
|  |     }, | ||||||
|  | 		// 全屏 | ||||||
|  |     screenfullChange() { | ||||||
|  |       if (!screenfull.isEnabled) { | ||||||
|  |         this.$message({ | ||||||
|  |           message: 'you browser can not work', | ||||||
|  |           type: 'warning' | ||||||
|  |         }) | ||||||
|  |         return false | ||||||
|  |       } | ||||||
|  |       screenfull.toggle(this.$refs.dataBoardBoxB) | ||||||
|  |     }, | ||||||
|  | 		resetSize() { | ||||||
|  |       const dataBoardBox = document.getElementById('dataBoardBox') | ||||||
|  |       const rw = parseFloat(window.innerWidth) | ||||||
|  | 			const rh = parseFloat(window.innerHeight) | ||||||
|  |       const bw = parseFloat(dataBoardBox.style.width) | ||||||
|  |       const bh = parseFloat(dataBoardBox.style.height) | ||||||
|  |       let wx = 0 | ||||||
|  | 			let hy = 0 | ||||||
|  |       if (screenfull.isFullscreen) { | ||||||
|  |         wx = rw / bw | ||||||
|  | 				hy = rh / bh | ||||||
|  |       } else { | ||||||
|  |         if (this.$store.state.app.sidebar.opened) { | ||||||
|  |           wx = (rw - 283) / bw | ||||||
|  |         } else { | ||||||
|  |           wx = (rw - 88) / bw | ||||||
|  |         } | ||||||
|  | 				hy = (rh - 150) / bh | ||||||
|  |       } | ||||||
|  |       this.scaleNum = wx < hy ? wx : hy | ||||||
|  |     }, | ||||||
|  | 	}, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||||
| .data-board { | 	.dataBoardBoxB { | ||||||
| 	position: absolute; |  | ||||||
| 	top: 0; |  | ||||||
| 	left: 0; |  | ||||||
| 		width: 100%; | 		width: 100%; | ||||||
| 	height: 100%; | 		height: calc(100vh - 150px); | ||||||
| 	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain | 		position: relative; | ||||||
| 		no-repeat; | 		overflow: auto; | ||||||
| } | 		.dataBoardBox { | ||||||
|  |  | ||||||
| .go-back--btn { |  | ||||||
| 	position: fixed; |  | ||||||
| 	top: 28px; |  | ||||||
| 	left: 24px; |  | ||||||
| 	color: #fff; |  | ||||||
| 	font-size: 18px; |  | ||||||
| 	letter-spacing: 6px; |  | ||||||
|  |  | ||||||
| 	&:hover { |  | ||||||
| 		text-decoration: underline; |  | ||||||
| 	} |  | ||||||
|  |  | ||||||
| 	&::after { |  | ||||||
| 		content: "\2BAA"; |  | ||||||
| 			position: absolute; | 			position: absolute; | ||||||
| 		top: 6px; | 			transform-origin: 16px 8px; | ||||||
| 		right: -26px; | 			font-size: 16px; | ||||||
| 		font-size: 24px; | 			top: 0px; | ||||||
|  | 			left: 0px; | ||||||
|  | 			background: url('../../../assets/images/dataBoard/background.png') no-repeat; | ||||||
|  | 			background-size: cover; | ||||||
|  | 			background-position: 0 0; | ||||||
|  | 			overflow: auto; | ||||||
| 		} | 		} | ||||||
| 	} | 	} | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -1,43 +1,57 @@ | |||||||
| <template> | <template> | ||||||
| 	<div> | 	<div> | ||||||
| 		<div style="background: #f2f4f9; height: 40px; width: 100%"> | 		<div style="background: #f2f4f9; height: 40px; width: 100%"> | ||||||
|       <ButtonNav :menus="['当前', '历史']" @change="currentMenu" v-model="activeName"> | 			<ButtonNav :menus="['当前', '历史']" @change="currentMenu"> | ||||||
|         <!-- <template v-slot:tab1> | 				<template v-slot:tab1> | ||||||
| 					<div>当前</div> | 					<div>当前</div> | ||||||
| 				</template> | 				</template> | ||||||
| 				<template v-slot:tab2> | 				<template v-slot:tab2> | ||||||
| 					<div>历史</div> | 					<div>历史</div> | ||||||
|         </template> --> | 				</template> | ||||||
| 			</ButtonNav> | 			</ButtonNav> | ||||||
| 		</div> | 		</div> | ||||||
| 		<div class="app-container energyOverlimitLog"> | 		<div class="app-container energyOverlimitLog"> | ||||||
|       <div v-if="activeName === '历史' && routeType !== 'order'"> | 			<div v-show="activeName === 'his'"> | ||||||
| 				<!-- 搜索工作栏 --> | 				<!-- 搜索工作栏 --> | ||||||
|         <search-bar :formConfigs="formConfig" ref="searchBarForm" @select-changed="handleSearchBarChanged" | 				<search-bar | ||||||
|  | 					:formConfigs="formConfig" | ||||||
|  | 					ref="searchBarForm" | ||||||
|  | 					@select-changed="handleSearchBarChanged" | ||||||
| 					@headBtnClick="buttonClick" /> | 					@headBtnClick="buttonClick" /> | ||||||
| 			</div> | 			</div> | ||||||
|       <h2 v-else> | 			<div v-show="activeName === 'now'"></div> | ||||||
|         订单名称:{{ name }} |  | ||||||
|         订单编码:{{ code }} |  | ||||||
|         <el-button    v-hasPermi="['base:core-work-order:export']" type="primary" @click="handleExport">导出</el-button> |  | ||||||
|       </h2> |  | ||||||
|       <div v-show="activeName === '当前'"></div> |  | ||||||
| 			<!-- 列表 --> | 			<!-- 列表 --> | ||||||
|       <div v-if="activeName === '历史'"> | 			<div v-if="activeName === 'his'"> | ||||||
|         <base-table-s :page="1" :limit="100" :table-props="tableProps" :table-data="tableData" | 				<base-table-s | ||||||
|  | 					:page="1" | ||||||
|  | 					:limit="100" | ||||||
|  | 					:table-props="tableProps" | ||||||
|  | 					:table-data="tableData" | ||||||
| 					:max-height="tableH / 2"></base-table-s> | 					:max-height="tableH / 2"></base-table-s> | ||||||
| 				<div v-if="listQuery.lineId.length !== 1 && tableData.length > 0"> | 				<div v-if="listQuery.lineId.length !== 1 && tableData.length > 0"> | ||||||
|           <barChart style="margin-top: 50px" ref="barChart" height="600px" :bar-data="tableData" /> | 					<barChart | ||||||
|  | 						style="margin-top: 50px" | ||||||
|  | 						ref="barChart" | ||||||
|  | 						height="600px" | ||||||
|  | 						:bar-data="tableData" /> | ||||||
| 				</div> | 				</div> | ||||||
| 			</div> | 			</div> | ||||||
|       <div v-if="activeName === '当前'"> | 			<div v-if="activeName === 'now'"> | ||||||
| 				<span class="blue-block"></span> | 				<span class="blue-block"></span> | ||||||
| 				<span class="tip">当班数据</span> | 				<span class="tip">当班数据</span> | ||||||
|         <base-table-s :page="1" :limit="100" :table-props="tableProps" :table-data="tableData2" | 				<base-table-s | ||||||
|  | 					:page="1" | ||||||
|  | 					:limit="100" | ||||||
|  | 					:table-props="tableProps" | ||||||
|  | 					:table-data="tableData2" | ||||||
| 					:max-height="tableH / 2" /> | 					:max-height="tableH / 2" /> | ||||||
| 				<span class="blue-block"></span> | 				<span class="blue-block"></span> | ||||||
| 				<span class="tip">当天数据</span> | 				<span class="tip">当天数据</span> | ||||||
|         <base-table-s :page="1" :limit="100" :table-props="tableProps" :table-data="tableData3" | 				<base-table-s | ||||||
|  | 					:page="1" | ||||||
|  | 					:limit="100" | ||||||
|  | 					:table-props="tableProps" | ||||||
|  | 					:table-data="tableData3" | ||||||
| 					:max-height="tableH / 2" /> | 					:max-height="tableH / 2" /> | ||||||
| 			</div> | 			</div> | ||||||
| 		</div> | 		</div> | ||||||
| @@ -267,9 +281,6 @@ export default { | |||||||
| 			urlOptions: { | 			urlOptions: { | ||||||
| 				getDataListURL: getPdlAutoReportNewSearch, | 				getDataListURL: getPdlAutoReportNewSearch, | ||||||
| 			}, | 			}, | ||||||
|       routeType: 'line', |  | ||||||
|       code: '', |  | ||||||
|       name:'', |  | ||||||
| 			formConfig: [ | 			formConfig: [ | ||||||
| 				{ | 				{ | ||||||
| 					type: 'select', | 					type: 'select', | ||||||
| @@ -284,7 +295,6 @@ export default { | |||||||
| 					selectOptions: [], | 					selectOptions: [], | ||||||
| 					param: 'lineId', | 					param: 'lineId', | ||||||
| 					multiple: true, | 					multiple: true, | ||||||
|           defaultSelect:[] |  | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'datePicker', | 					type: 'datePicker', | ||||||
| @@ -296,7 +306,6 @@ export default { | |||||||
| 					startPlaceholder: '开始时间', | 					startPlaceholder: '开始时间', | ||||||
| 					endPlaceholder: '结束时间', | 					endPlaceholder: '结束时间', | ||||||
| 					param: 'timeVal', | 					param: 'timeVal', | ||||||
|           defaultSelect:[], |  | ||||||
| 					width: 350, | 					width: 350, | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| @@ -309,8 +318,8 @@ export default { | |||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
|           type: this.$auth.hasPermi('|base:core-work-order:export') ? 'button' : '', | 					// type: this.$auth.hasPermi('base:factory:export') ? 'button' : '', | ||||||
| 					// type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 					color: 'warning', | 					color: 'warning', | ||||||
| @@ -319,7 +328,7 @@ export default { | |||||||
| 			listQuery: { | 			listQuery: { | ||||||
| 				lineId: [], | 				lineId: [], | ||||||
| 			}, | 			}, | ||||||
|       activeName: '当前', | 			activeName: 'now', | ||||||
| 			tableProps, | 			tableProps, | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
| 			tableData2: [], | 			tableData2: [], | ||||||
| @@ -331,30 +340,8 @@ export default { | |||||||
| 		baseTableS, | 		baseTableS, | ||||||
| 		barChart, | 		barChart, | ||||||
| 	}, | 	}, | ||||||
| 	mounted() { | 	created() { | ||||||
|     this.getPdLineList() | 		this.getPdLineList(); | ||||||
|     this.$nextTick(() => { |  | ||||||
|       const tab = this.$route.query.tab; // 获取路由参数 |  | ||||||
|       console.log(this.$route.query); |  | ||||||
|       this.routeType = this.$route.query.buttonType === 'order' ? 'order' : 'line' |  | ||||||
|       this.code = this.$route.query.code |  | ||||||
|       this.name = this.$route.query.name |  | ||||||
|  |  | ||||||
|       if (tab === 'his') { |  | ||||||
|         // 路由参数为 his 时,切换到“历史”标签 |  | ||||||
|         this.activeName = '历史'; // 注意:这里直接传标签名('历史'),不是'his' |  | ||||||
|         this.formConfig[1].defaultSelect = this.$route.query.lineId |  | ||||||
|         this.formConfig[2].defaultSelect[0] = this.$route.query.startProduceTime |  | ||||||
|         this.formConfig[2].defaultSelect[1] = this.$route.query.finishProduceTime |  | ||||||
|         // this.buttonClick() |  | ||||||
|         this.listQuery.lineId = this.$route.query.lineId |  | ||||||
|       } else { |  | ||||||
|         this.activeName = '当前'; // 默认“当前”标签 |  | ||||||
|       } |  | ||||||
|     }) |  | ||||||
|  |  | ||||||
|  |  | ||||||
|   // ... 其他方法 ... |  | ||||||
| 	}, | 	}, | ||||||
| 	methods: { | 	methods: { | ||||||
| 		getPdLineList() { | 		getPdLineList() { | ||||||
| @@ -376,7 +363,7 @@ export default { | |||||||
| 					this.listQuery.lineId = val.lineId || []; | 					this.listQuery.lineId = val.lineId || []; | ||||||
| 					this.listQuery.startTime = val.timeVal ? val.timeVal[0] : undefined; | 					this.listQuery.startTime = val.timeVal ? val.timeVal[0] : undefined; | ||||||
| 					this.listQuery.endTime = val.timeVal ? val.timeVal[1] : undefined; | 					this.listQuery.endTime = val.timeVal ? val.timeVal[1] : undefined; | ||||||
| 					if (this.activeName === '历史') { | 					if (this.activeName === 'his') { | ||||||
| 						this.getDataList(); | 						this.getDataList(); | ||||||
| 					} else { | 					} else { | ||||||
| 						this.getDataList2(); | 						this.getDataList2(); | ||||||
| @@ -390,17 +377,11 @@ export default { | |||||||
| 			} | 			} | ||||||
| 		}, | 		}, | ||||||
| 		currentMenu(val) { | 		currentMenu(val) { | ||||||
|       this.activeName = val; // 同步标签名到 activeName | 			this.activeName = val === '历史' ? 'his' : 'now'; | ||||||
|       let actualName = val === '历史' ? 'his' : 'now'; // 转换为内部状态 | 			if (this.activeName === 'his') { | ||||||
|  | 				this.$refs.searchBarForm.resetForm(); | ||||||
|     // 后续逻辑不变(根据 activeName 加载对应数据) |  | ||||||
|       if (actualName === 'his') { |  | ||||||
| 				// this.$refs.searchBarForm.resetForm(); |  | ||||||
| 				this.listQuery.factoryId = undefined; | 				this.listQuery.factoryId = undefined; | ||||||
|         if (!this.$route.query.lineId) { |  | ||||||
| 				this.listQuery.lineId = []; | 				this.listQuery.lineId = []; | ||||||
|  |  | ||||||
|         } |  | ||||||
| 				// 获取当前时间 | 				// 获取当前时间 | ||||||
| 				const now = new Date(); | 				const now = new Date(); | ||||||
| 				// 获取前一天的同一时间 | 				// 获取前一天的同一时间 | ||||||
| @@ -423,62 +404,11 @@ export default { | |||||||
| 				this.getDataList2(); | 				this.getDataList2(); | ||||||
| 			} | 			} | ||||||
| 		}, | 		}, | ||||||
|  | 		// 获取数据列表 | ||||||
| 		getDataList() { | 		getDataList() { | ||||||
| 			if (this.listQuery.startTime) { | 			if (this.listQuery.startTime) { | ||||||
| 				this.dataListLoading = true; | 				this.dataListLoading = true; | ||||||
|  | 				this.urlOptions.getDataListURL(this.listQuery).then((response) => { | ||||||
|         // 判断是否为order类型且lineId有值 |  | ||||||
|         if (this.routeType === 'order' && this.listQuery.lineId?.length) { |  | ||||||
|           // 存储所有接口请求的Promise |  | ||||||
|           const requests = this.listQuery.lineId.map(lineId => { |  | ||||||
|             // 复制原有查询参数,替换当前lineId |  | ||||||
|             const params = { ...this.listQuery, lineId: [lineId] }; |  | ||||||
|             return this.urlOptions.getDataListURL(params); |  | ||||||
|           }); |  | ||||||
|  |  | ||||||
|           // 并行执行所有请求 |  | ||||||
|           Promise.all(requests) |  | ||||||
|             .then(responses => { |  | ||||||
|               // 合并所有接口返回的数据 |  | ||||||
|               this.tableData = responses.flatMap(response => { |  | ||||||
|                 return response.data.map(item => { |  | ||||||
|                   // 处理嵌套属性 |  | ||||||
|                   item.originalLossNum = item.original?.lossNum; |  | ||||||
|                   item.originalLossArea = item.original?.lossArea; |  | ||||||
|                   item.edgeLossNum = item.edge?.lossNum; |  | ||||||
|                   item.edgeLossArea = item.edge?.lossArea; |  | ||||||
|                   item.drillLossNum = item.drill?.lossNum; |  | ||||||
|                   item.drillLossArea = item.drill?.lossArea; |  | ||||||
|                   item.coatingLossNum = item.coating?.lossNum; |  | ||||||
|                   item.coatingLossArea = item.coating?.lossArea; |  | ||||||
|                   item.silkLossNum = item.silk?.lossNum; |  | ||||||
|                   item.silkLossArea = item.silk?.lossArea; |  | ||||||
|                   item.temperingLossNum = item.tempering?.lossNum; |  | ||||||
|                   item.temperingLossArea = item.tempering?.lossArea; |  | ||||||
|                   item.packingLossNum = item.packing?.lossNum; |  | ||||||
|                   item.packingLossArea = item.packing?.lossArea; |  | ||||||
|                   return item; |  | ||||||
|                 }); |  | ||||||
|               }); |  | ||||||
|  |  | ||||||
|               this.$nextTick(() => { |  | ||||||
|                 if (this.tableData.length > 0) { |  | ||||||
|                   this.$refs.barChart.initChart(); |  | ||||||
|                 } |  | ||||||
|               }); |  | ||||||
|             }) |  | ||||||
|             .catch(error => { |  | ||||||
|               console.error('接口请求失败:', error); |  | ||||||
|               this.$message.error('数据加载失败,请重试'); |  | ||||||
|             }) |  | ||||||
|             .finally(() => { |  | ||||||
|               this.dataListLoading = false; |  | ||||||
|             }); |  | ||||||
|         } else { |  | ||||||
|           // 非order类型或无lineId时,正常单次请求 |  | ||||||
|           this.urlOptions.getDataListURL(this.listQuery) |  | ||||||
|             .then(response => { |  | ||||||
| 					this.tableData = response.data.map((item, index) => { | 					this.tableData = response.data.map((item, index) => { | ||||||
| 						item.originalLossNum = item.original?.lossNum; | 						item.originalLossNum = item.original?.lossNum; | ||||||
| 						item.originalLossArea = item.original?.lossArea; | 						item.originalLossArea = item.original?.lossArea; | ||||||
| @@ -496,21 +426,13 @@ export default { | |||||||
| 						item.packingLossArea = item.packing?.lossArea; | 						item.packingLossArea = item.packing?.lossArea; | ||||||
| 						return item; | 						return item; | ||||||
| 					}); | 					}); | ||||||
|  |  | ||||||
| 					this.$nextTick(() => { | 					this.$nextTick(() => { | ||||||
|             if(this.tableData.length>0){ |             if(this.tableData.length>0){ | ||||||
|               this.$refs.barChart.initChart(); |               this.$refs.barChart.initChart(); | ||||||
|             } |             } | ||||||
| 					}); | 					}); | ||||||
|             }) |  | ||||||
|             .catch(error => { |  | ||||||
|               console.error('接口请求失败:', error); |  | ||||||
|               this.$message.error('数据加载失败,请重试'); |  | ||||||
|             }) |  | ||||||
|             .finally(() => { |  | ||||||
| 					this.dataListLoading = false; | 					this.dataListLoading = false; | ||||||
| 				}); | 				}); | ||||||
|         } |  | ||||||
| 			} else { | 			} else { | ||||||
| 				this.$message.warning('请选择时间范围'); | 				this.$message.warning('请选择时间范围'); | ||||||
| 			} | 			} | ||||||
|   | |||||||
| @@ -48,7 +48,7 @@ const tableProps = [ | |||||||
| 		prop: 'reportDate', | 		prop: 'reportDate', | ||||||
| 		label: '日期', | 		label: '日期', | ||||||
| 		width: 130, | 		width: 130, | ||||||
|     fixed: true |     fixed: true, | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'factoryName', | 		prop: 'factoryName', | ||||||
| @@ -290,6 +290,10 @@ export default { | |||||||
| 					type: 'select', | 					type: 'select', | ||||||
| 					label: '维度', | 					label: '维度', | ||||||
|           selectOptions: [ |           selectOptions: [ | ||||||
|  |             // { | ||||||
|  |             //   id: '0', | ||||||
|  |             //   name: '班', | ||||||
|  |             // }, | ||||||
| 						{ | 						{ | ||||||
| 							id: 1, | 							id: 1, | ||||||
| 							name: '日', | 							name: '日', | ||||||
| @@ -414,13 +418,17 @@ export default { | |||||||
| 		buttonClick(val) { | 		buttonClick(val) { | ||||||
| 			switch (val.btnName) { | 			switch (val.btnName) { | ||||||
|         case 'search': |         case 'search': | ||||||
|  |  | ||||||
| 					this.listQuery.pageNo = 1; | 					this.listQuery.pageNo = 1; | ||||||
| 					this.listQuery.pageSize = 10; | 					this.listQuery.pageSize = 10; | ||||||
| 					this.listQuery.factoryId = val.factoryId || undefined; | 					this.listQuery.factoryId = val.factoryId || undefined; | ||||||
|           this.listQuery.lineId = val.lineId ? [val.lineId] : []; |           this.listQuery.lineId = val.lineId ? [val.lineId] : []; | ||||||
| 					this.listQuery.reportType = val.reportType || undefined; |           console.log(val.reportType); | ||||||
|  |           this.listQuery.reportType = val.reportType ? Number(val.reportType) :undefined | ||||||
| 					this.listQuery.startTime = val.timeVal ? val.timeVal[0] : undefined; | 					this.listQuery.startTime = val.timeVal ? val.timeVal[0] : undefined; | ||||||
|           this.listQuery.endTime = val.timeVal ? val.timeVal[1] : undefined; |           this.listQuery.endTime = val.timeVal ? val.timeVal[1] : undefined; | ||||||
|  |           console.log(this.listQuery.reportType); | ||||||
|  |  | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'export': | 				case 'export': | ||||||
| @@ -433,10 +441,41 @@ export default { | |||||||
| 		// 获取数据列表 | 		// 获取数据列表 | ||||||
| 		getDataList() { | 		getDataList() { | ||||||
| 			this.dataListLoading = true; | 			this.dataListLoading = true; | ||||||
| 			const arr = ['日', '周', '月', '年']; |       const arr = [ | ||||||
|  |         { | ||||||
|  |           id: 0, | ||||||
|  |           name: '班', | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           id: 1, | ||||||
|  |           name: '日', | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           id: 2, | ||||||
|  |           name: '周', | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           id: 3, | ||||||
|  |           name: '月', | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |           id: 4, | ||||||
|  |           name: '年', | ||||||
|  |         }, | ||||||
|  |       ] | ||||||
|  |       const reportTypeNameMap = arr.reduce((map, item) => { | ||||||
|  |         map[item.id] = item.name; | ||||||
|  |         return map; | ||||||
|  |       }, {}); | ||||||
|  |  | ||||||
| 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | ||||||
|         this.tableData = response.data.list.map((item, index) => { |         this.tableData = response.data.list.map((item, index) => { | ||||||
| 					item.reportType = arr[item.reportType - 1]; |           const typeId = item.reportType; | ||||||
|  |           item.reportType = reportTypeNameMap[typeId] || '未知'; | ||||||
|  |           // item.reportType = arr[item.reportType - 1]; | ||||||
|  |  | ||||||
|  |           item.reportDate = item.reportDate; | ||||||
|  |  | ||||||
| 					item.originalLossNum = item.original?.lossNum; | 					item.originalLossNum = item.original?.lossNum; | ||||||
| 					item.originalLossArea = item.original?.lossArea; | 					item.originalLossArea = item.original?.lossArea; | ||||||
| 					item.edgeLossNum = item.edge?.lossNum; | 					item.edgeLossNum = item.edge?.lossNum; | ||||||
|   | |||||||
| @@ -305,7 +305,7 @@ export default { | |||||||
| 					this.startTime = new Date(payload.recordTime) | 					this.startTime = new Date(payload.recordTime) | ||||||
| 					this.queryParams.lineId = payload.lineId || null; | 					this.queryParams.lineId = payload.lineId || null; | ||||||
| 					this.queryParams.sectionId = payload.sectionId || null; | 					this.queryParams.sectionId = payload.sectionId || null; | ||||||
| 					this.queryParams.equipmentId = payload.equipmentId || null; |           this.queryParams.equipmentId = payload.equipmentId ? Number(payload.equipmentId) : undefined | ||||||
| 					this.queryParams.recordTime = payload.recordTime | 					this.queryParams.recordTime = payload.recordTime | ||||||
| 						? [ | 						? [ | ||||||
| 							payload.recordTime, | 							payload.recordTime, | ||||||
|   | |||||||
| @@ -132,7 +132,7 @@ export default { | |||||||
| 				}, | 				}, | ||||||
| 			], | 			], | ||||||
| 			queryParams: { | 			queryParams: { | ||||||
| 				equipmentId: null, | 				equipmentId: undefined, | ||||||
| 				recordTime: null, | 				recordTime: null, | ||||||
| 			}, | 			}, | ||||||
| 			graphList: [], | 			graphList: [], | ||||||
| @@ -153,7 +153,7 @@ export default { | |||||||
| 		this.$nextTick(() => { | 		this.$nextTick(() => { | ||||||
| 			this.$refs['search-bar'].formInline.recordTime = formattedDate; | 			this.$refs['search-bar'].formInline.recordTime = formattedDate; | ||||||
| 		}); | 		}); | ||||||
| 		this.queryParams.equipmentId = Number(this.$route.query.eqid); |     this.queryParams.equipmentId = this.$route.query.eqid? Number(this.$route.query.eqid): undefined | ||||||
| 		this.startTime = new Date(formattedDate); | 		this.startTime = new Date(formattedDate); | ||||||
| 		this.queryParams.recordTime = formattedDate | 		this.queryParams.recordTime = formattedDate | ||||||
| 			? [ | 			? [ | ||||||
| @@ -207,7 +207,7 @@ export default { | |||||||
|  |  | ||||||
| 		/** 重置查询条件 */ | 		/** 重置查询条件 */ | ||||||
| 		initQuery() { | 		initQuery() { | ||||||
| 			this.queryParams.equipmentId = null; | 			this.queryParams.equipmentId = undefined; | ||||||
| 			this.queryParams.recordTime = null; | 			this.queryParams.recordTime = null; | ||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| @@ -251,7 +251,7 @@ export default { | |||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| 		handleSearchBarBtnClick({ btnName, ...payload }) { | 		handleSearchBarBtnClick({ btnName, ...payload }) { | ||||||
|       this.queryParams.equipmentId = Number(this.$route.query.eqid); |       this.queryParams.equipmentId = this.$route.query.eqid ? Number(this.$route.query.eqid) :undefined | ||||||
| 			switch (btnName) { | 			switch (btnName) { | ||||||
| 				case 'search': | 				case 'search': | ||||||
| 					if (!payload.recordTime || payload.recordTime.length <= 0) { | 					if (!payload.recordTime || payload.recordTime.length <= 0) { | ||||||
|   | |||||||
| @@ -7,95 +7,71 @@ | |||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| 	<div> | 	<div> | ||||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | 		<search-bar | ||||||
|     <el-table id="detail" :data="tableData" :header-cell-style="{ | 			:formConfigs="formConfig" | ||||||
|  | 			ref="searchBarForm" | ||||||
|  | 			@headBtnClick="buttonClick" /> | ||||||
|  | 		<el-table | ||||||
|  | 			id="detail" | ||||||
|  | 			:data="tableData" | ||||||
|  | 			:header-cell-style="{ | ||||||
| 				background: '#F2F4F9', | 				background: '#F2F4F9', | ||||||
| 				color: '#606266', | 				color: '#606266', | ||||||
| 			}" border  v-loading="dataListLoading" style="width: 100%" ref="dataList"> | 			}" | ||||||
|  | 			border | ||||||
|  | 			:span-method="arraySpanMethod" | ||||||
|  | 			v-loading="dataListLoading" | ||||||
|  | 			style="width: 100%" | ||||||
|  | 			ref="dataList"> | ||||||
| 			<el-table-column prop="lineName" label="产线" align="center" /> | 			<el-table-column prop="lineName" label="产线" align="center" /> | ||||||
|       <!-- <el-table-column prop="sizes" width="105" showOverflowtooltip align="center" label="规格" /> --> | 			<el-table-column | ||||||
|       <!-- <el-table-column prop="process" label="产品工艺" align="center" /> --> | 				prop="sizes" | ||||||
|       <el-table-column prop="inputN" label="磨边" align="center"> | 				width="105" | ||||||
|         <el-table-column prop="edgeNum" label="投入数量/片" /> | 				showOverflowtooltip | ||||||
|         <el-table-column prop="edgeTime" label="数据上报时间"> |         align="center" | ||||||
|  | 				label="规格" /> | ||||||
|  | 			<el-table-column prop="process" label="产品工艺" align="center" /> | ||||||
|  | 			<el-table-column prop="inputN" label="投入" align="center"> | ||||||
|  | 				<el-table-column prop="inputNum" label="投入数量/片" /> | ||||||
|  | 				<el-table-column prop="inputArea" label="投入面积/m²"> | ||||||
| 					<template v-slot="scope"> | 					<template v-slot="scope"> | ||||||
| 						<span> | 						<span> | ||||||
| 							{{ | 							{{ | ||||||
|               scope.row.reportType === 0 | 								scope.row.inputArea != null | ||||||
|               ? parseTime(scope.row.edgeTime) | 									? scope.row.inputArea.toFixed(2) | ||||||
| 									: '-' | 									: '-' | ||||||
| 							}} | 							}} | ||||||
| 						</span> | 						</span> | ||||||
| 					</template> | 					</template> | ||||||
| 				</el-table-column> | 				</el-table-column> | ||||||
| 			</el-table-column> | 			</el-table-column> | ||||||
|       <el-table-column prop="outputN" label="打孔/丝印" align="center"> | 			<el-table-column prop="outputN" label="产出" align="center"> | ||||||
|         <el-table-column prop="drillCoating" label="投入数量"> | 				<el-table-column prop="outputNum" label="产出数量/片" /> | ||||||
|  | 				<el-table-column prop="outputArea" label="产出面积/m²"> | ||||||
| 					<template v-slot="scope"> | 					<template v-slot="scope"> | ||||||
| 						<span> | 						<span> | ||||||
| 							{{ | 							{{ | ||||||
|               (scope.row.drillNum ?? '-') | 								scope.row.outputArea != null | ||||||
|               + '/' | 									? scope.row.outputArea.toFixed(2) | ||||||
|               + (scope.row.coatingNum ?? '-') |  | ||||||
|               }} |  | ||||||
|             </span> |  | ||||||
|           </template> |  | ||||||
|         </el-table-column> |  | ||||||
|         <el-table-column prop="coatingTime" label="数据上报时间"> |  | ||||||
|           <template v-slot="scope"> |  | ||||||
|             <span> |  | ||||||
|               {{ |  | ||||||
|   scope.row.reportType === 0 |  | ||||||
|               ? parseTime(scope.row.coatingTime) |  | ||||||
| 									: '-' | 									: '-' | ||||||
| 							}} | 							}} | ||||||
| 						</span> | 						</span> | ||||||
| 					</template> | 					</template> | ||||||
| 				</el-table-column> | 				</el-table-column> | ||||||
| 			</el-table-column> | 			</el-table-column> | ||||||
|       <el-table-column prop="lossN" label="镀膜" align="center"> | 			<el-table-column prop="lossN" label="不良" align="center"> | ||||||
|         <el-table-column prop="silkNum" label="投入数量" /> | 				<el-table-column prop="lossNum" label="不良数量/片" /> | ||||||
|         <el-table-column prop="silkTime" label="数据上报时间"> | 				<el-table-column prop="lossArea" label="不良面积/m²"> | ||||||
| 					<template v-slot="scope"> | 					<template v-slot="scope"> | ||||||
| 						<span> | 						<span> | ||||||
| 							{{ | 							{{ | ||||||
|   scope.row.reportType === 0 | 								scope.row.lossArea != null ? scope.row.lossArea.toFixed(2) : '-' | ||||||
|               ? parseTime(scope.row.silkTime) |  | ||||||
|               : '-' |  | ||||||
| 							}} | 							}} | ||||||
| 						</span> | 						</span> | ||||||
| 					</template> | 					</template> | ||||||
| 				</el-table-column> | 				</el-table-column> | ||||||
| 			</el-table-column> | 			</el-table-column> | ||||||
|       <el-table-column prop="lossN" label="钢化" align="center"> | 			<el-table-column prop="lossRatio" label="不良率/%"> | ||||||
|         <el-table-column prop="temperingNum" label="投入数量" /> |  | ||||||
|         <el-table-column prop="temperingTime" label="数据上报时间"> |  | ||||||
|           <template v-slot="scope"> |  | ||||||
|             <span> |  | ||||||
|               {{ |  | ||||||
|   scope.row.reportType === 0 |  | ||||||
|               ? parseTime(scope.row.temperingTime) |  | ||||||
|               : '-' |  | ||||||
|               }} |  | ||||||
|             </span> |  | ||||||
|           </template> |  | ||||||
|         </el-table-column> |  | ||||||
|       </el-table-column> |  | ||||||
|       <el-table-column prop="lossN" label="包装" align="center"> |  | ||||||
|         <el-table-column prop="packingNum" label="投入数量" /> |  | ||||||
|         <el-table-column prop="packingTime" label="数据上报时间"> |  | ||||||
|           <template v-slot="scope"> |  | ||||||
|             <span> |  | ||||||
|               {{ |  | ||||||
|   scope.row.reportType === 0 |  | ||||||
|               ? parseTime(scope.row.packingTime) |  | ||||||
|               : '-' |  | ||||||
|               }} |  | ||||||
|             </span> |  | ||||||
|           </template> |  | ||||||
|         </el-table-column> |  | ||||||
|       </el-table-column> |  | ||||||
|       <!-- <el-table-column prop="lossRatio" label="不良率/%"> |  | ||||||
| 				<template v-slot="scope"> | 				<template v-slot="scope"> | ||||||
| 					<span> | 					<span> | ||||||
| 						{{ | 						{{ | ||||||
| @@ -210,12 +186,20 @@ | |||||||
| 							</span> | 							</span> | ||||||
| 						</template> | 						</template> | ||||||
| 					</el-table-column> | 					</el-table-column> | ||||||
|         </el-table-column> --> | 				</el-table-column> | ||||||
|       <el-table-column prop="down" label="下片" align="center"> | 				<el-table-column prop="packing" label="包装" align="center"> | ||||||
|         <el-table-column prop="downNum" label="成品数量" /> | 					<el-table-column prop="packingLossNum" label="包装不良/片" /> | ||||||
|         <el-table-column prop="scrapNum" label="废片数量" /> | 					<el-table-column prop="packingLossArea" label="包装不良/m²"> | ||||||
|         <el-table-column prop="inputOutputRate" label="投入产出率" /> | 						<template v-slot="scope"> | ||||||
|         <el-table-column prop="yieldRate" label="加工成品率" /> | 							<span> | ||||||
|  | 								{{ | ||||||
|  | 									scope.row.packingLossArea != null | ||||||
|  | 										? scope.row.packingLossArea.toFixed(2) | ||||||
|  | 										: '-' | ||||||
|  | 								}} | ||||||
|  | 							</span> | ||||||
|  | 						</template> | ||||||
|  | 					</el-table-column> | ||||||
| 				</el-table-column> | 				</el-table-column> | ||||||
| 			</el-table-column> | 			</el-table-column> | ||||||
| 		</el-table> | 		</el-table> | ||||||
| @@ -223,7 +207,7 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import { getTeamReportPageDet, exportGroupProductReportExcel } from '@/api/core/monitoring/auto'; | import { getTeamReportPageDet } from '@/api/core/monitoring/auto'; | ||||||
| import * as XLSX from 'xlsx'; | import * as XLSX from 'xlsx'; | ||||||
| import FileSaver from 'file-saver'; | import FileSaver from 'file-saver'; | ||||||
|  |  | ||||||
| @@ -232,7 +216,6 @@ export default { | |||||||
| 	data() { | 	data() { | ||||||
| 		return { | 		return { | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
|       id:null, |  | ||||||
| 			dataListLoading: false, | 			dataListLoading: false, | ||||||
| 			formConfig: [ | 			formConfig: [ | ||||||
| 				{ | 				{ | ||||||
| @@ -251,7 +234,6 @@ export default { | |||||||
| 	methods: { | 	methods: { | ||||||
| 		// 获取数据列表 | 		// 获取数据列表 | ||||||
| 		init(id) { | 		init(id) { | ||||||
|       this.id = id |  | ||||||
| 			this.dataListLoading = true; | 			this.dataListLoading = true; | ||||||
| 			getTeamReportPageDet(id).then((response) => { | 			getTeamReportPageDet(id).then((response) => { | ||||||
| 				this.tableData = response.data?.map((item, index) => { | 				this.tableData = response.data?.map((item, index) => { | ||||||
| @@ -277,17 +259,17 @@ export default { | |||||||
| 				this.dataListLoading = false; | 				this.dataListLoading = false; | ||||||
| 			}); | 			}); | ||||||
| 		}, | 		}, | ||||||
| 		// arraySpanMethod({ row, column, rowIndex, columnIndex }) { | 		arraySpanMethod({ row, column, rowIndex, columnIndex }) { | ||||||
| 		// 	if (row.isSummaryReport) { | 			if (row.isSummaryReport) { | ||||||
| 		// 		if (columnIndex === 0) { | 				if (columnIndex === 0) { | ||||||
| 		// 			return [1, 3]; | 					return [1, 3]; | ||||||
| 		// 		} else if (columnIndex === 1) { | 				} else if (columnIndex === 1) { | ||||||
| 		// 			return [0, 0]; | 					return [0, 0]; | ||||||
| 		// 		} else if (columnIndex === 2) { | 				} else if (columnIndex === 2) { | ||||||
| 		// 			return [0, 0]; | 					return [0, 0]; | ||||||
| 		// 		} | 				} | ||||||
| 		// 	} | 			} | ||||||
| 		// }, | 		}, | ||||||
|  |  | ||||||
| 		buttonClick(val) { | 		buttonClick(val) { | ||||||
| 			switch (val.btnName) { | 			switch (val.btnName) { | ||||||
| @@ -299,32 +281,26 @@ export default { | |||||||
| 			} | 			} | ||||||
| 		}, | 		}, | ||||||
| 		handleExport() { | 		handleExport() { | ||||||
|       this.$modal.confirm('是否确认导出').then(() => { | 			let tables = document.querySelector('#detail').cloneNode(true); | ||||||
|           return exportGroupProductReportExcel({id:this.id}); | 			let exportTable = XLSX.utils.table_to_book(tables); | ||||||
|         }).then(response => { |  | ||||||
|           console.log(response) |  | ||||||
|           this.$download.excel(response, '班组生产报表-详情.xls'); |  | ||||||
|         }).catch(() => {}) |  | ||||||
| 			// let tables = document.querySelector('#detail').cloneNode(true); |  | ||||||
| 			// let exportTable = XLSX.utils.table_to_book(tables); |  | ||||||
|  |  | ||||||
| 			// var exportTableOut = XLSX.write(exportTable, { | 			var exportTableOut = XLSX.write(exportTable, { | ||||||
| 			// 	bookType: 'xlsx', | 				bookType: 'xlsx', | ||||||
| 			// 	bookSST: true, | 				bookSST: true, | ||||||
| 			// 	type: 'array', | 				type: 'array', | ||||||
| 			// }); | 			}); | ||||||
| 			// // sheetjs.xlsx为导出表格的标题名称 | 			// sheetjs.xlsx为导出表格的标题名称 | ||||||
| 			// try { | 			try { | ||||||
| 			// 	FileSaver.saveAs( | 				FileSaver.saveAs( | ||||||
| 			// 		new Blob([exportTableOut], { | 					new Blob([exportTableOut], { | ||||||
| 			// 			type: 'application/octet-stream', | 						type: 'application/octet-stream', | ||||||
| 			// 		}), | 					}), | ||||||
| 			// 		'班组生产报表-详情.xlsx' | 					'班组生产报表-详情.xlsx' | ||||||
| 			// 	); | 				); | ||||||
| 			// } catch (e) { | 			} catch (e) { | ||||||
| 			// 	if (typeof console !== 'undefined') console.log(e, exportTableOut); | 				if (typeof console !== 'undefined') console.log(e, exportTableOut); | ||||||
| 			// } | 			} | ||||||
| 			// return exportTableOut; | 			return exportTableOut; | ||||||
| 		}, | 		}, | ||||||
| 	}, | 	}, | ||||||
| }; | }; | ||||||
|   | |||||||
| @@ -74,7 +74,7 @@ const tableProps = [ | |||||||
|     fixed: true |     fixed: true | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
|     prop: 'reportDate', | 		prop: 'reportName', | ||||||
| 		label: '日期', | 		label: '日期', | ||||||
| 		width: 180, | 		width: 180, | ||||||
|     fixed: true |     fixed: true | ||||||
| @@ -89,241 +89,211 @@ const tableProps = [ | |||||||
| 		label: '班组', | 		label: '班组', | ||||||
|     fixed: true |     fixed: true | ||||||
| 	}, | 	}, | ||||||
|   { |  | ||||||
|     prop: 'edgeNum', |  | ||||||
|     label: '磨边', |  | ||||||
|     fixed: true |  | ||||||
|   }, { |  | ||||||
|     prop: 'drillOrCoating', |  | ||||||
|     label: '打孔/丝印', |  | ||||||
|     fixed: true |  | ||||||
|   }, { |  | ||||||
|     prop: 'silkNum', |  | ||||||
|     label: '镀膜', |  | ||||||
|     fixed: true |  | ||||||
|   }, { |  | ||||||
|     prop: 'temperingNum', |  | ||||||
|     label: '钢化', |  | ||||||
|     fixed: true |  | ||||||
|   }, { |  | ||||||
|     prop: 'packingNum', |  | ||||||
|     label: '包装', |  | ||||||
|     fixed: true |  | ||||||
|   }, |  | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'inputN', | 		prop: 'inputN', | ||||||
| 		label: '下片', | 		label: '投入', | ||||||
| 		align: 'center', | 		align: 'center', | ||||||
| 		children: [ | 		children: [ | ||||||
| 			{ | 			{ | ||||||
|         prop: 'downNum', | 				prop: 'inputNum', | ||||||
| 				label: '成品数量', | 				label: '投入数量/片', | ||||||
|         width:100 |         width:100 | ||||||
| 			}, | 			}, | ||||||
| 			{ | 			{ | ||||||
|         prop: 'scrapNum', | 				prop: 'inputArea', | ||||||
| 				label: '废片数量', | 				label: '投入面积/m²', | ||||||
|         width:100 |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         prop: 'inputOutputRate', |  | ||||||
|         label: '投入产出率', |  | ||||||
|         width: 100 |  | ||||||
|       }, |  | ||||||
|       { |  | ||||||
|         prop: 'yieldRate', |  | ||||||
|         label: '加工成品率', |  | ||||||
|         width:100 |         width:100 | ||||||
| 			}, | 			}, | ||||||
| 		], | 		], | ||||||
| 	}, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'outputN', | 		prop: 'outputN', | ||||||
| 	// 	label: '产出', | 		label: '产出', | ||||||
| 	// 	align: 'center', | 		align: 'center', | ||||||
| 	// 	children: [ | 		children: [ | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'outputNum', | 				prop: 'outputNum', | ||||||
| 	// 			label: '产出数量/片', | 				label: '产出数量/片', | ||||||
|   //       width:100 |         width:100 | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'outputArea', | 				prop: 'outputArea', | ||||||
| 	// 			label: '产出面积/㎡', | 				label: '产出面积/㎡', | ||||||
| 	// 			filter: (val) => (val != null ? val.toFixed(2) : '-'), | 				filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //       width:100 |         width:100 | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 	], | 		], | ||||||
| 	// }, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'lossN', | 		prop: 'lossN', | ||||||
| 	// 	label: '不良', | 		label: '不良', | ||||||
| 	// 	align: 'center', | 		align: 'center', | ||||||
| 	// 	children: [ | 		children: [ | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'lossNum', | 				prop: 'lossNum', | ||||||
| 	// 			label: '不良数量/片', | 				label: '不良数量/片', | ||||||
|   //       width:100 |         width:100 | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'lossArea', | 				prop: 'lossArea', | ||||||
| 	// 			label: '不良面积/㎡', | 				label: '不良面积/㎡', | ||||||
| 	// 			filter: (val) => (val != null ? val.toFixed(2) : '-'), | 				filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //       width:100 |         width:100 | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 	], | 		], | ||||||
| 	// }, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'lossRatio', | 		prop: 'lossRatio', | ||||||
| 	// 	label: '不良率/%', | 		label: '不良率/%', | ||||||
| 	// 	filter: (val) => (val != null ? val.toFixed(2) : '-'), | 		filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //   width:100 |     width:100 | ||||||
| 	// }, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'outputRatio', | 		prop: 'outputRatio', | ||||||
| 	// 	label: '投入产出率/%', | 		label: '投入产出率/%', | ||||||
| 	// 	filter: (val) => (val != null ? val.toFixed(2) : '-'), | 		filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //   width:110 |     width:110 | ||||||
| 	// }, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'processingRatio', | 		prop: 'processingRatio', | ||||||
| 	// 	label: '加工成品率/%', | 		label: '加工成品率/%', | ||||||
| 	// 	filter: (val) => (val != null ? val.toFixed(2) : '-'), | 		filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //   width:110 |     width:110 | ||||||
| 	// }, | 	}, | ||||||
| 	// { | 	{ | ||||||
| 	// 	prop: 'lossD', | 		prop: 'lossD', | ||||||
| 	// 	label: '不良详情', | 		label: '不良详情', | ||||||
| 	// 	align: 'center', | 		align: 'center', | ||||||
| 	// 	children: [ | 		children: [ | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'original', | 				prop: 'original', | ||||||
| 	// 			label: '原片', | 				label: '原片', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'originalLossNum', | 						prop: 'originalLossNum', | ||||||
| 	// 					label: '原片不良/片', | 						label: '原片不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'originalLossArea', | 						prop: 'originalLossArea', | ||||||
| 	// 					label: '原片不良/㎡', | 						label: '原片不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'edge', | 				prop: 'edge', | ||||||
| 	// 			label: '磨边', | 				label: '磨边', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'edgeLossNum', | 						prop: 'edgeLossNum', | ||||||
| 	// 					label: '磨边不良/片', | 						label: '磨边不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'edgeLossArea', | 						prop: 'edgeLossArea', | ||||||
| 	// 					label: '磨边不良/㎡', | 						label: '磨边不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'drill', | 				prop: 'drill', | ||||||
| 	// 			label: '打孔', | 				label: '打孔', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'drillLossNum', | 						prop: 'drillLossNum', | ||||||
| 	// 					label: '打孔不良/片', | 						label: '打孔不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'drillLossArea', | 						prop: 'drillLossArea', | ||||||
| 	// 					label: '打孔不良/㎡', | 						label: '打孔不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'coating', | 				prop: 'coating', | ||||||
| 	// 			label: '镀膜', | 				label: '镀膜', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'coatingLossNum', | 						prop: 'coatingLossNum', | ||||||
| 	// 					label: '镀膜不良/片', | 						label: '镀膜不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'coatingLossArea', | 						prop: 'coatingLossArea', | ||||||
| 	// 					label: '镀膜不良/㎡', | 						label: '镀膜不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'silk', | 				prop: 'silk', | ||||||
| 	// 			label: '丝印', | 				label: '丝印', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'silkLossNum', | 						prop: 'silkLossNum', | ||||||
| 	// 					label: '丝印不良/片', | 						label: '丝印不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'silkLossArea', | 						prop: 'silkLossArea', | ||||||
| 	// 					label: '丝印不良/㎡', | 						label: '丝印不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'tempering', | 				prop: 'tempering', | ||||||
| 	// 			label: '钢化', | 				label: '钢化', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'temperingLossNum', | 						prop: 'temperingLossNum', | ||||||
| 	// 					label: '钢化不良/片', | 						label: '钢化不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'temperingLossArea', | 						prop: 'temperingLossArea', | ||||||
| 	// 					label: '钢化不良/㎡', | 						label: '钢化不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 		{ | 			{ | ||||||
| 	// 			prop: 'packing', | 				prop: 'packing', | ||||||
| 	// 			label: '包装', | 				label: '包装', | ||||||
|   //       align: 'center', |         align: 'center', | ||||||
| 	// 			children: [ | 				children: [ | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'packingLossNum', | 						prop: 'packingLossNum', | ||||||
| 	// 					label: '包装不良/片', | 						label: '包装不良/片', | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 				{ | 					{ | ||||||
| 	// 					prop: 'packingLossArea', | 						prop: 'packingLossArea', | ||||||
| 	// 					label: '包装不良/㎡', | 						label: '包装不良/㎡', | ||||||
| 	// 					filter: (val) => (val != null ? val.toFixed(2) : '-'), | 						filter: (val) => (val != null ? val.toFixed(2) : '-'), | ||||||
|   //           width:100 |             width:100 | ||||||
| 	// 				}, | 					}, | ||||||
| 	// 			], | 				], | ||||||
| 	// 		}, | 			}, | ||||||
| 	// 	], | 		], | ||||||
| 	// }, | 	}, | ||||||
| ]; | ]; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| @@ -340,21 +310,16 @@ export default { | |||||||
|         reportType: 1, |         reportType: 1, | ||||||
| 				pageSize: 10, | 				pageSize: 10, | ||||||
| 				pageNo: 1, | 				pageNo: 1, | ||||||
|         startTime: undefined, |  | ||||||
|         endTime: undefined, |  | ||||||
| 				total: 1, | 				total: 1, | ||||||
| 			}, | 			}, | ||||||
| 			fileName: '', | 			fileName: '', | ||||||
| 			dataListLoading: false, | 			dataListLoading: false, | ||||||
| 			tableProps, | 			tableProps, | ||||||
| 			tableBtn: [ | 			tableBtn: [ | ||||||
|         this.$auth.hasPermi(`monitoring:group-off:update`) | 				{ | ||||||
|           ? { |  | ||||||
| 					type: 'eq', | 					type: 'eq', | ||||||
| 					btnName: '详情', | 					btnName: '详情', | ||||||
|           } | 				}, | ||||||
|           : undefined, |  | ||||||
|  |  | ||||||
| 			].filter((v) => v), | 			].filter((v) => v), | ||||||
| 			showData: [], | 			showData: [], | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
| @@ -375,18 +340,14 @@ export default { | |||||||
| 					type: 'select', | 					type: 'select', | ||||||
| 					label: '报表类型', | 					label: '报表类型', | ||||||
| 					selectOptions: [ | 					selectOptions: [ | ||||||
|             { |  | ||||||
|               id: 0, |  | ||||||
|               name: '班', |  | ||||||
|             }, |  | ||||||
| 						{ | 						{ | ||||||
| 							id: 1, | 							id: 1, | ||||||
| 							name: '日', | 							name: '日', | ||||||
| 						}, | 						}, | ||||||
| 						// { | 						{ | ||||||
| 						// 	id: 2, | 							id: 2, | ||||||
| 						// 	name: '周', | 							name: '周', | ||||||
| 						// }, | 						}, | ||||||
| 						{ | 						{ | ||||||
| 							id: 3, | 							id: 3, | ||||||
| 							name: '月', | 							name: '月', | ||||||
| @@ -411,8 +372,7 @@ export default { | |||||||
| 					param: 'timeVal', | 					param: 'timeVal', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
|           type: this.$auth.hasPermi('monitoring:group-off:query') ? 'button' : '', | 					type: 'button', | ||||||
|  |  | ||||||
| 					btnName: '查询', | 					btnName: '查询', | ||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| @@ -421,8 +381,8 @@ export default { | |||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
|           type: this.$auth.hasPermi('monitoring:group-off:export') ? 'button' : '', | 					// type: this.$auth.hasPermi('base:factory:export') ? 'button' : '', | ||||||
| 					// type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 					color: 'warning', | 					color: 'warning', | ||||||
| @@ -442,9 +402,7 @@ export default { | |||||||
| 		// 设置为23:59:59 | 		// 设置为23:59:59 | ||||||
| 		const end = new Date(yesterday.getTime()); | 		const end = new Date(yesterday.getTime()); | ||||||
| 		end.setHours(23, 59, 59, 59); | 		end.setHours(23, 59, 59, 59); | ||||||
|     this.listQuery.startTime = yesterday.getTime(), [end.getTime()]; | 		this.listQuery.reportStartTime = [yesterday.getTime(),end.getTime()]; | ||||||
|     this.listQuery.endTime = end.getTime() |  | ||||||
|  |  | ||||||
| 		this.$nextTick(() => { | 		this.$nextTick(() => { | ||||||
| 			this.$refs.searchBarForm.formInline.timeVal = [yesterday.getTime(),end.getTime()]; | 			this.$refs.searchBarForm.formInline.timeVal = [yesterday.getTime(),end.getTime()]; | ||||||
| 		}); | 		}); | ||||||
| @@ -503,11 +461,8 @@ export default { | |||||||
| 					this.listQuery.factoryId = val.factoryId || undefined; | 					this.listQuery.factoryId = val.factoryId || undefined; | ||||||
| 					this.listQuery.teamId = val.teamId || undefined; | 					this.listQuery.teamId = val.teamId || undefined; | ||||||
| 					this.listQuery.reportType = val.reportType || undefined; | 					this.listQuery.reportType = val.reportType || undefined; | ||||||
|           this.listQuery.startTime = val.timeVal | 					this.listQuery.reportStartTime = val.timeVal | ||||||
| 						? val.timeVal[0] | 						? val.timeVal | ||||||
|             : undefined; |  | ||||||
|           this.listQuery.endTime = val.timeVal |  | ||||||
|             ? val.timeVal[1] |  | ||||||
| 						: undefined; | 						: undefined; | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| @@ -521,9 +476,7 @@ export default { | |||||||
| 		// 获取数据列表 | 		// 获取数据列表 | ||||||
| 		getDataList() { | 		getDataList() { | ||||||
| 			this.dataListLoading = true; | 			this.dataListLoading = true; | ||||||
|       console.log(this.listQuery); | 			const arr = ['日', '周', '月', '年']; | ||||||
|  |  | ||||||
|       const arr = ['班', '日', '', '月', '年']; // 索引0对应班,1对应日,3对应月,4对应年,索引2留空 |  | ||||||
| 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | ||||||
| 				if (!response.data.list) { | 				if (!response.data.list) { | ||||||
| 					this.showData = []; | 					this.showData = []; | ||||||
| @@ -531,8 +484,7 @@ export default { | |||||||
| 					return; | 					return; | ||||||
| 				} | 				} | ||||||
| 				this.tableData = response.data?.list.map((item, index) => { | 				this.tableData = response.data?.list.map((item, index) => { | ||||||
|           item.reportType = arr[item.reportType] || item.reportType; | 					item.reportType = arr[item.reportType - 1]; | ||||||
|           item.drillOrCoating = item.drillNum + "/" + item.coatingNum |  | ||||||
| 					item.originalLossNum = item.original?.lossNum; | 					item.originalLossNum = item.original?.lossNum; | ||||||
| 					item.originalLossArea = item.original?.lossArea; | 					item.originalLossArea = item.original?.lossArea; | ||||||
| 					item.edgeLossNum = item.edge?.lossNum; | 					item.edgeLossNum = item.edge?.lossNum; | ||||||
| @@ -556,7 +508,7 @@ export default { | |||||||
| 		}, | 		}, | ||||||
| 		handleClick(val) { | 		handleClick(val) { | ||||||
| 			this.addOrUpdateVisible = true; | 			this.addOrUpdateVisible = true; | ||||||
|       const time = val.data.timeVal ? parseTime(val.data.timeVal[0]) + '-' + parseTime(val.data.timeVal[1]) : '- ' |       const time = val.data.reportName?val.data.reportName:'- ' | ||||||
|       const teamName = val.data.teamName?val.data.teamName:'- ' |       const teamName = val.data.teamName?val.data.teamName:'- ' | ||||||
|       const teamLeader = val.data.teamLeader?val.data.teamLeader:'- ' |       const teamLeader = val.data.teamLeader?val.data.teamLeader:'- ' | ||||||
| 			this.addOrEditTitle = | 			this.addOrEditTitle = | ||||||
|   | |||||||
| @@ -1,123 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2021-11-18 14:16:25 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-10-16 11:16:48 |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px"> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="物料名称" prop="materialName"> |  | ||||||
|           <el-input v-model="dataForm.materialName" clearable placeholder="请输入物料名称" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="物料规格" prop="materialSize"> |  | ||||||
|           <el-input v-model="dataForm.materialSize" clearable placeholder="请输入物料规格" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="物料批次" prop="materialDate"> |  | ||||||
|           <el-input v-model="dataForm.materialDate" clearable placeholder="请输入物料批次" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <!-- <el-form-item label="启用状态" prop="enabled"> |  | ||||||
| 			<el-select |  | ||||||
| 				v-model="dataForm.enabled" |  | ||||||
| 				placeholder="请选择启用状态"> |  | ||||||
| 				<el-option |  | ||||||
| 					v-for="dict in this.getDictDatas(DICT_TYPE.INFRA_BOOLEAN_STRING)" |  | ||||||
| 					:key="dict.value" |  | ||||||
| 					:label="dict.label" |  | ||||||
| 					:value="dict.value" /> |  | ||||||
| 			</el-select> |  | ||||||
| 		</el-form-item> --> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="入库数量" prop="materialNum"> |  | ||||||
|           <el-input v-model="dataForm.materialNum" clearable placeholder="请输入入库数量" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|   </el-form> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import basicAdd from './../mixins/basic-add'; |  | ||||||
| import { |  | ||||||
|   createMaterialIssue, |  | ||||||
| } from '@/api/material/issue'; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
| 	mixins: [basicAdd], |  | ||||||
| 	data() { |  | ||||||
| 		return { |  | ||||||
| 			urlOptions: { |  | ||||||
| 			  isGetCode: false, |  | ||||||
|         // codeURL: getCode, |  | ||||||
|         createURL: createMaterialIssue, |  | ||||||
| 				// updateURL: updateFactory, |  | ||||||
| 				// infoURL: getFactory, |  | ||||||
| 			}, |  | ||||||
| 			dataForm: { |  | ||||||
|         id: undefined, |  | ||||||
|         materialName: undefined, |  | ||||||
|         materialNum: undefined, |  | ||||||
|         materialDate: undefined, |  | ||||||
|         materialSize: undefined, |  | ||||||
|         operateStatus:undefined |  | ||||||
| 			}, |  | ||||||
| 			dataRule: { |  | ||||||
|         materialName: [{ required: true, message: "物料名称不能为空", trigger: "blur" }], |  | ||||||
|         materialNum: [{  required: true, message: "数量不能为空", trigger: "blur" }], |  | ||||||
|       } |  | ||||||
| 		}; |  | ||||||
| 	}, |  | ||||||
|   methods: { |  | ||||||
|     init(operateStatus) { |  | ||||||
|       this.dataForm.operateStatus = operateStatus; |  | ||||||
|       this.visible = true; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs["dataForm"].resetFields(); |  | ||||||
|         // if (this.dataForm.id) { |  | ||||||
|         //   this.urlOptions.infoURL(id).then(response => { |  | ||||||
|         //     this.dataForm = response.data; |  | ||||||
|         //     if (this.setData) { |  | ||||||
|         //       this.setDataForm() |  | ||||||
|         //     } |  | ||||||
|         //   }); |  | ||||||
|         // } else { |  | ||||||
|         //   if (this.urlOptions.isGetCode) { |  | ||||||
|         //     this.getCode() |  | ||||||
|         //   } |  | ||||||
|         // } |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     dataFormSubmit() { |  | ||||||
|       this.$refs["dataForm"].validate((valid) => { |  | ||||||
|         if (!valid) { |  | ||||||
|           return false; |  | ||||||
|         } |  | ||||||
|         // 修改的提交 |  | ||||||
|         // if (this.dataForm.id) { |  | ||||||
|         //   this.urlOptions.updateURL(this.dataForm).then(response => { |  | ||||||
|         //     this.$modal.msgSuccess("修改成功"); |  | ||||||
|         //     this.visible = false; |  | ||||||
|         //     this.$emit("refreshDataList"); |  | ||||||
|         //   }); |  | ||||||
|         //   return; |  | ||||||
|         // } |  | ||||||
|         // 添加的提交 |  | ||||||
|         this.urlOptions.createURL(this.dataForm).then(response => { |  | ||||||
|           this.$modal.msgSuccess("新增成功"); |  | ||||||
|           this.visible = false; |  | ||||||
|           this.$emit("refreshDataList"); |  | ||||||
|         }); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| @@ -1,243 +0,0 @@ | |||||||
| <template> |  | ||||||
| 	<div class="app-container"> |  | ||||||
| 		<search-bar |  | ||||||
| 			:formConfigs="formConfig" |  | ||||||
| 			ref="searchBarForm" |  | ||||||
| 			@headBtnClick="buttonClick" /> |  | ||||||
| 		<base-table |  | ||||||
| 			v-loading="dataListLoading" |  | ||||||
| 			:table-props="tableProps" |  | ||||||
| 			:page="listQuery.pageNo" |  | ||||||
| 			:limit="listQuery.pageSize" |  | ||||||
| 			:table-data="tableData"> |  | ||||||
| 			<!-- <method-btn |  | ||||||
| 				v-if="tableBtn.length" |  | ||||||
| 				slot="handleBtn" |  | ||||||
| 				:width="120" |  | ||||||
| 				label="操作" |  | ||||||
| 				:method-list="tableBtn" |  | ||||||
| 				@clickBtn="handleClick" /> --> |  | ||||||
| 		</base-table> |  | ||||||
| 		<pagination |  | ||||||
| 			:limit.sync="listQuery.pageSize" |  | ||||||
| 			:page.sync="listQuery.pageNo" |  | ||||||
| 			:total="listQuery.total" |  | ||||||
| 			@pagination="getDataList" /> |  | ||||||
| 		<base-dialog |  | ||||||
| 			:dialogTitle="addOrEditTitle" |  | ||||||
| 			:dialogVisible="addOrUpdateVisible" |  | ||||||
| 			@cancel="handleCancel" |  | ||||||
| 			@confirm="handleConfirm" |  | ||||||
| 			:before-close="handleCancel" |  | ||||||
| 			width="30%"> |  | ||||||
| 			<add-or-update |  | ||||||
| 				ref="addOrUpdate" |  | ||||||
| 				@refreshDataList="successSubmit"></add-or-update> |  | ||||||
| 		</base-dialog> |  | ||||||
| 	</div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import AddOrUpdate from './add-or-updata'; |  | ||||||
| import basicPage from './../mixins/basic-page'; |  | ||||||
| import { parseTime } from './../mixins/code-filter'; |  | ||||||
| import { |  | ||||||
|   getMaterialReceiptIssuePageData, |  | ||||||
| } from '@/api/material/issue'; |  | ||||||
|  |  | ||||||
| const tableProps = [ |  | ||||||
| 	{ |  | ||||||
|     prop: 'materialName', |  | ||||||
| 		label: '物料名称' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
|     prop: 'materialSize', |  | ||||||
| 		label: '物料规格' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
|     prop: 'materialDate', |  | ||||||
|     label: '物料批次' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
|     prop: 'operateStatus', |  | ||||||
|     label: '操作状态', |  | ||||||
|     filter: (val) => ['', '入库', '出库'][val] |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'materialNum', |  | ||||||
|     label: '出入库数量', |  | ||||||
|     // filter: (val) => ['', '入库', '出库', '移库'][val] |  | ||||||
|   }, |  | ||||||
| 	{ |  | ||||||
| 		prop: 'createTime', |  | ||||||
| 		label: '操作时间', |  | ||||||
| 		filter: parseTime |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'creator', |  | ||||||
|     label: '操作人', |  | ||||||
|     // filter: parseTime |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
| 	mixins: [basicPage], |  | ||||||
| 	data() { |  | ||||||
| 		return { |  | ||||||
| 			urlOptions: { |  | ||||||
|         getDataListURL: getMaterialReceiptIssuePageData, |  | ||||||
| 				// deleteURL: deleteFactory, |  | ||||||
| 				// exportURL: exportFactoryExcel, |  | ||||||
|       }, |  | ||||||
|       operateStatus:undefined, |  | ||||||
| 			tableProps, |  | ||||||
| 			// tableBtn: [ |  | ||||||
| 			// 	this.$auth.hasPermi(`base:factory:update`) |  | ||||||
| 			// 		? { |  | ||||||
| 			// 				type: 'edit', |  | ||||||
| 			// 				btnName: '编辑', |  | ||||||
| 			// 		  } |  | ||||||
| 			// 		: undefined, |  | ||||||
|       //     this.$auth.hasPermi(`base:factory:delete`) |  | ||||||
| 			// 		? { |  | ||||||
| 			// 				type: 'delete', |  | ||||||
| 			// 				btnName: '删除', |  | ||||||
| 			// 		  } |  | ||||||
| 			// 		: undefined, |  | ||||||
| 			// ].filter((v)=>v), |  | ||||||
| 			tableData: [], |  | ||||||
| 			formConfig: [ |  | ||||||
| 				{ |  | ||||||
|           type: 'input', |  | ||||||
|           label: '物料名称', |  | ||||||
| 					placeholder: '物料名称', |  | ||||||
|           param: 'materialName', |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
| 					type: 'input', |  | ||||||
|           label: '操作人', |  | ||||||
| 					placeholder: '操作人', |  | ||||||
|           param: 'operateName', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: 'select', |  | ||||||
|           label: '操作状态', |  | ||||||
|           placeholder: '操作状态', |  | ||||||
|           selectOptions: [{ |  | ||||||
|             id: 1, |  | ||||||
|             name:'入库' |  | ||||||
|           }, |  | ||||||
|             { |  | ||||||
|               id: 2, |  | ||||||
|               name: '出库' |  | ||||||
|             }], |  | ||||||
|           param: 'operateStatus', |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: 'datePicker', |  | ||||||
|           label: '操作时间', |  | ||||||
|           dateType: 'daterange', |  | ||||||
|           format: 'yyyy-MM-dd', |  | ||||||
|           valueFormat: 'timestamp', |  | ||||||
|           rangeSeparator: '-', |  | ||||||
|           startPlaceholder: '开始时间', |  | ||||||
|           endPlaceholder: '结束时间', |  | ||||||
|           param: 'timeVal', |  | ||||||
|         }, |  | ||||||
| 				{ |  | ||||||
|           type: this.$auth.hasPermi('base:material-warehouse-his:query') ? 'button' : '', |  | ||||||
| 					btnName: '搜索', |  | ||||||
| 					name: 'search', |  | ||||||
| 					color: 'primary', |  | ||||||
| 				}, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: 'separate', |  | ||||||
| 				// }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: 'button', |  | ||||||
| 				// 	btnName: '重置', |  | ||||||
| 				// 	name: 'reset', |  | ||||||
| 				// }, |  | ||||||
| 				{ |  | ||||||
| 					type: 'separate', |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
|           type: this.$auth.hasPermi('base:material-warehouse-his:create') ? 'button' : '', |  | ||||||
| 					btnName: '入库', |  | ||||||
|           name: 'receipt', |  | ||||||
| 					color: 'success', |  | ||||||
| 					plain: true, |  | ||||||
|         }, |  | ||||||
|         { |  | ||||||
|           type: this.$auth.hasPermi('base:material-warehouse-his:create') ? 'button' : '', |  | ||||||
|           btnName: '出库', |  | ||||||
|           name: 'issue', |  | ||||||
|           color: 'success', |  | ||||||
|           plain: true, |  | ||||||
|         }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: this.$auth.hasPermi('base:factory:create') ? 'separate' : '', |  | ||||||
| 				// }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: this.$auth.hasPermi('base:factory:export') ? 'button' : '', |  | ||||||
| 				// 	btnName: '导出', |  | ||||||
| 				// 	name: 'export', |  | ||||||
| 				// 	color: 'warning', |  | ||||||
| 				// }, |  | ||||||
| 			], |  | ||||||
| 		}; |  | ||||||
| 	}, |  | ||||||
| 	components: { |  | ||||||
| 		AddOrUpdate, |  | ||||||
| 	}, |  | ||||||
| 	created() {}, |  | ||||||
|   methods: { |  | ||||||
|     addOrUpdateHandle() { |  | ||||||
|       this.addOrUpdateVisible = true; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.addOrUpdate.init(this.operateStatus); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
| 		buttonClick(val) { |  | ||||||
| 			switch (val.btnName) { |  | ||||||
| 				case 'search': |  | ||||||
| 					this.listQuery.pageNo = 1; |  | ||||||
|           this.listQuery.pageSize = 10; |  | ||||||
|           this.listQuery.operateName = val.operateName ? val.operateName :undefined; |  | ||||||
|           this.listQuery.operateTimeStart = val.timeVal? val.timeVal[0] :undefined; |  | ||||||
|           this.listQuery.operateTimeEnd = val.timeVal ? val.timeVal[1] : undefined; |  | ||||||
|           this.listQuery.materialName = val.materialName ? val.materialName : undefined; |  | ||||||
|           this.listQuery.operateStatus = val.operateStatus ? val.operateStatus : undefined; |  | ||||||
| 					this.getDataList(); |  | ||||||
| 					break; |  | ||||||
| 				case 'reset': |  | ||||||
| 					this.$refs.searchBarForm.resetForm(); |  | ||||||
| 					this.listQuery = { |  | ||||||
| 						pageSize: 10, |  | ||||||
| 						pageNo: 1, |  | ||||||
| 						total: 1, |  | ||||||
| 					}; |  | ||||||
| 					this.getDataList(); |  | ||||||
| 					break; |  | ||||||
|         case 'receipt': |  | ||||||
| 					this.addOrEditTitle = '入库'; |  | ||||||
|           this.addOrUpdateVisible = true; |  | ||||||
|           this.operateStatus = 1 |  | ||||||
|           this.addOrUpdateHandle(); |  | ||||||
|           break; |  | ||||||
|         case 'issue': |  | ||||||
|           this.addOrEditTitle = '出库'; |  | ||||||
|           this.addOrUpdateVisible = true; |  | ||||||
|           this.operateStatus = 2 |  | ||||||
|           this.addOrUpdateHandle(); |  | ||||||
|           break; |  | ||||||
| 				case 'export': |  | ||||||
| 					this.handleExport(); |  | ||||||
| 					break; |  | ||||||
| 				default: |  | ||||||
| 					console.log(val); |  | ||||||
| 			} |  | ||||||
| 		}, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| @@ -1,100 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2022-08-24 11:19:43 |  | ||||||
|  * @LastEditors: zwq |  | ||||||
|  * @LastEditTime: 2023-08-03 14:21:04 |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| export default { |  | ||||||
|   data() { |  | ||||||
|     /* eslint-disable */ |  | ||||||
|     return { |  | ||||||
|       urlOptions: { |  | ||||||
|         createURL: '', |  | ||||||
|         updateURL: '', |  | ||||||
|         infoURL: '', |  | ||||||
|         codeURL: '', |  | ||||||
|         getOption: false, |  | ||||||
|         isGetCode: false, |  | ||||||
|         optionArrUrl: [], |  | ||||||
|         optionArr: {} |  | ||||||
|       }, |  | ||||||
|       visible: false, |  | ||||||
|       setData: false |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     init(id) { |  | ||||||
|       this.dataForm.id = id || ""; |  | ||||||
|       this.visible = true; |  | ||||||
|       if (this.urlOptions.getOption) { |  | ||||||
|         this.getArr() |  | ||||||
|       } |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs["dataForm"].resetFields(); |  | ||||||
|         if (this.dataForm.id) { |  | ||||||
|           this.urlOptions.infoURL(id).then(response => { |  | ||||||
|             this.dataForm = response.data; |  | ||||||
|             if (this.setData) { |  | ||||||
|               this.setDataForm() |  | ||||||
|             } |  | ||||||
|           }); |  | ||||||
|         } else { |  | ||||||
|           if (this.urlOptions.isGetCode) { |  | ||||||
|             this.getCode() |  | ||||||
|           } |  | ||||||
| 				} |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
| 		getCode() { |  | ||||||
| 			this.urlOptions.codeURL() |  | ||||||
| 				.then(({ data: res }) => { |  | ||||||
| 					this.dataForm.code = res; |  | ||||||
| 				}) |  | ||||||
| 				.catch(() => {}); |  | ||||||
| 		}, |  | ||||||
|     getArr() { |  | ||||||
|       const params = { |  | ||||||
|         pageSize: 100, |  | ||||||
|         pageNo: 1, |  | ||||||
|       } |  | ||||||
|       this.urlOptions.optionArrUrl.forEach((item, index) => { |  | ||||||
|         item(params).then(({ data: res }) => { |  | ||||||
|           this.$set(this.urlOptions.optionArr, `arr${index}`, res.list) |  | ||||||
|         }) |  | ||||||
|           .catch(() => { |  | ||||||
|           }); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     // 表单提交 |  | ||||||
|     dataFormSubmit() { |  | ||||||
|       this.$refs["dataForm"].validate((valid) => { |  | ||||||
|         if (!valid) { |  | ||||||
|           return false; |  | ||||||
|         } |  | ||||||
|         // 修改的提交 |  | ||||||
|         if (this.dataForm.id) { |  | ||||||
|           this.urlOptions.updateURL(this.dataForm).then(response => { |  | ||||||
|             this.$modal.msgSuccess("修改成功"); |  | ||||||
|             this.visible = false; |  | ||||||
|             this.$emit("refreshDataList"); |  | ||||||
|           }); |  | ||||||
|           return; |  | ||||||
|         } |  | ||||||
|         // 添加的提交 |  | ||||||
|         this.urlOptions.createURL(this.dataForm).then(response => { |  | ||||||
|           this.$modal.msgSuccess("新增成功"); |  | ||||||
|           this.visible = false; |  | ||||||
|           this.$emit("refreshDataList"); |  | ||||||
|         }); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     formClear() { |  | ||||||
|       this.$refs.dataForm.resetFields() |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| @@ -1,168 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2022-08-24 11:19:43 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-09-21 16:02:07 |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| export default { |  | ||||||
|   data() { |  | ||||||
|     /* eslint-disable */ |  | ||||||
|     return { |  | ||||||
|       urlOptions: { |  | ||||||
|         getDataListURL: '', |  | ||||||
|         deleteURL: '', |  | ||||||
|         statusUrl: '', |  | ||||||
|         exportURL: '' |  | ||||||
|       }, |  | ||||||
|       tableData: [], |  | ||||||
|       listQuery: { |  | ||||||
|         pageSize: 10, |  | ||||||
|         pageNo: 1, |  | ||||||
|         total: 1, |  | ||||||
|       }, |  | ||||||
|       exportLoading: false, |  | ||||||
|       dataListLoading: false, |  | ||||||
|       addOrEditTitle: '', |  | ||||||
|       addOrUpdateVisible: false, |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.getDataList() |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     // 获取数据列表 |  | ||||||
|     getDataList() { |  | ||||||
|       this.dataListLoading = true; |  | ||||||
|       this.urlOptions.getDataListURL(this.listQuery).then(response => { |  | ||||||
|         this.tableData = response.data.list; |  | ||||||
|         this.listQuery.total = response.data.total; |  | ||||||
|         this.dataListLoading = false; |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     // 每页数 |  | ||||||
|     sizeChangeHandle(val) { |  | ||||||
|       this.listQuery.pageSize = val; |  | ||||||
|       this.listQuery.pageNo = 1; |  | ||||||
|       this.getDataList(); |  | ||||||
|     }, |  | ||||||
|     // 当前页 |  | ||||||
|     currentChangeHandle(val) { |  | ||||||
|       this.listQuery.pageNo = val; |  | ||||||
|       this.getDataList(); |  | ||||||
|     }, |  | ||||||
|     // 新增 / 修改 |  | ||||||
|     addOrUpdateHandle(id) { |  | ||||||
|       this.addOrUpdateVisible = true; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.addOrUpdate.init(id); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     cancel(id) { |  | ||||||
|       this.$refs["popover-" + id].showPopper = false; |  | ||||||
|     }, |  | ||||||
|     //改变状态 |  | ||||||
|     changeStatus(id) { |  | ||||||
|       this.$http |  | ||||||
|         .post(this.urlOptions.statusUrl, { id }) |  | ||||||
|         .then(({ data: res }) => { |  | ||||||
|           if (res.code !== 0) { |  | ||||||
|             return this.$message.warning(res.msg); |  | ||||||
|           } |  | ||||||
|           this.$refs["popover-" + id].showPopper = false; |  | ||||||
|           this.$message({ |  | ||||||
|             message: this.$t("prompt.success"), |  | ||||||
|             type: "success", |  | ||||||
|             duration: 500, |  | ||||||
|             onClose: () => { |  | ||||||
|               this.getDataList(); |  | ||||||
|             }, |  | ||||||
|           }); |  | ||||||
|         }) |  | ||||||
|         .catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     //tableBtn点击 |  | ||||||
|     handleClick(val) { |  | ||||||
|       if (val.type === "edit") { |  | ||||||
|         this.addOrUpdateVisible = true; |  | ||||||
|         this.addOrEditTitle = "编辑"; |  | ||||||
|         this.$nextTick(() => { |  | ||||||
|           this.$refs.addOrUpdate.init(val.data.id); |  | ||||||
|         }); |  | ||||||
|       } else if (val.type === "delete") { |  | ||||||
|         this.deleteHandle(val.data.id, val.data.name, val.data._pageIndex) |  | ||||||
|       } else if (val.type === "change") { |  | ||||||
|         this.changeStatus(val.data.id) |  | ||||||
|       } else { |  | ||||||
|         this.otherMethods(val) |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     // 删除 |  | ||||||
|     deleteHandle(id, name, index) { |  | ||||||
|       this.$confirm(`确定对${name ? '[名称=' + name + ']' : '[序号=' + index + ']'}进行删除操作?`, "提示", { |  | ||||||
|         confirmButtonText: "确定", |  | ||||||
|         cancelButtonText: "取消", |  | ||||||
|         type: "warning", |  | ||||||
|       }) |  | ||||||
|         .then(() => { |  | ||||||
|           this.urlOptions.deleteURL(id).then(({ data }) => { |  | ||||||
|             this.$message({ |  | ||||||
|               message: "操作成功", |  | ||||||
|               type: "success", |  | ||||||
|               duration: 1500, |  | ||||||
|               onClose: () => { |  | ||||||
|                 this.getDataList(); |  | ||||||
|               }, |  | ||||||
|             }); |  | ||||||
|           }); |  | ||||||
|         }) |  | ||||||
|         .catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     //search-bar点击 |  | ||||||
|     buttonClick(val) { |  | ||||||
|       switch (val.btnName) { |  | ||||||
|         case "search": |  | ||||||
|           this.listQuery.xm1 = val.xm1; |  | ||||||
|           this.listQuery.xm2 = val.xm2; |  | ||||||
|           this.listQuery.pageNo = 1; |  | ||||||
|           this.getDataList(); |  | ||||||
|           break; |  | ||||||
|         case "add": |  | ||||||
|           this.addOrEditTitle = '新增' |  | ||||||
|           this.addOrUpdateVisible = true; |  | ||||||
|           this.addOrUpdateHandle() |  | ||||||
|           break; |  | ||||||
|         default: |  | ||||||
|           console.log(val) |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     handleCancel() { |  | ||||||
|       this.$refs.addOrUpdate.formClear() |  | ||||||
|       this.addOrUpdateVisible = false |  | ||||||
|       this.addOrEditTitle = '' |  | ||||||
|     }, |  | ||||||
|     handleConfirm() { |  | ||||||
|       this.$refs.addOrUpdate.dataFormSubmit() |  | ||||||
|     }, |  | ||||||
|     successSubmit() { |  | ||||||
|       this.handleCancel() |  | ||||||
|       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(() => { }); |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| @@ -1,73 +0,0 @@ | |||||||
|  |  | ||||||
| /* |  | ||||||
|  * @Date: 2020-12-29 16:49:28 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-09-12 11:13:34 |  | ||||||
|  * @FilePath: \basic-admin\src\filters\basicData\index.js |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
|  |  | ||||||
| const table = { |  | ||||||
|   lineStatus: { |  | ||||||
|     1: '生产中', |  | ||||||
|     2: '停止', |  | ||||||
|     3: '未知', |  | ||||||
|   }, |  | ||||||
|   reportType: { |  | ||||||
|     1: '日', |  | ||||||
|     2: '周', |  | ||||||
|     3: '月' |  | ||||||
|   }, |  | ||||||
|   pdType: { |  | ||||||
|     1: '原片', |  | ||||||
|     0: '深加工', |  | ||||||
|   }, |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 日期格式化 |  | ||||||
| export function parseTime(time, pattern) { |  | ||||||
|   if (arguments.length === 0 || !time) { |  | ||||||
|     return null |  | ||||||
|   } |  | ||||||
|   const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}' |  | ||||||
|   let date |  | ||||||
|   if (typeof time === 'object') { |  | ||||||
|     date = time |  | ||||||
|   } else { |  | ||||||
|     if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) { |  | ||||||
|       time = parseInt(time) |  | ||||||
|     } else if (typeof time === 'string') { |  | ||||||
|       time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.\d{3}/gm),''); |  | ||||||
|     } |  | ||||||
|     if ((typeof time === 'number') && (time.toString().length === 10)) { |  | ||||||
|       time = time * 1000 |  | ||||||
|     } |  | ||||||
|     date = new Date(time) |  | ||||||
|   } |  | ||||||
|   const formatObj = { |  | ||||||
|     y: date.getFullYear(), |  | ||||||
|     m: date.getMonth() + 1, |  | ||||||
|     d: date.getDate(), |  | ||||||
|     h: date.getHours(), |  | ||||||
|     i: date.getMinutes(), |  | ||||||
|     s: date.getSeconds(), |  | ||||||
|     a: date.getDay() |  | ||||||
|   } |  | ||||||
|   const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => { |  | ||||||
|     let value = formatObj[key] |  | ||||||
|     // Note: getDay() returns 0 on Sunday |  | ||||||
|     if (key === 'a') { |  | ||||||
|       return ['日', '一', '二', '三', '四', '五', '六'][value] |  | ||||||
|     } |  | ||||||
|     if (result.length > 0 && value < 10) { |  | ||||||
|       value = '0' + value |  | ||||||
|     } |  | ||||||
|     return value || 0 |  | ||||||
|   }) |  | ||||||
|   return time_str |  | ||||||
| } |  | ||||||
| export default function (dictTable) { |  | ||||||
|   return function (val) { |  | ||||||
|     return table?.[dictTable]?.[val] |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| @@ -248,12 +248,11 @@ export default { | |||||||
| 				this.lineArr = response.data; | 				this.lineArr = response.data; | ||||||
| 				this.lineArr.forEach((item, index) => { | 				this.lineArr.forEach((item, index) => { | ||||||
| 					const num = [ | 					const num = [ | ||||||
| 						'', | 						'20001', | ||||||
| 						'1672847052717821953', | 						'20002', | ||||||
| 						'1672847052717821954', | 						'20003', | ||||||
| 						'1686260211054157825', | 						'20004', | ||||||
| 						'1701892552632770122', | 						'20005', | ||||||
| 						'1714562503683465331', |  | ||||||
| 					].indexOf(item.id); | 					].indexOf(item.id); | ||||||
| 					if (num > 0) { | 					if (num > 0) { | ||||||
| 						item.num = num; | 						item.num = num; | ||||||
|   | |||||||
							
								
								
									
										339
									
								
								src/views/monitoring/qhdEquipmentVisualize/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,339 @@ | |||||||
|  | <!-- | ||||||
|  |  * @Author: zwq | ||||||
|  |  * @Date: 2025-02-10 09:15:55 | ||||||
|  |  * @LastEditors: zwq | ||||||
|  |  * @LastEditTime: 2025-02-25 15:48:59 | ||||||
|  |  * @Description: | ||||||
|  | --> | ||||||
|  | <template> | ||||||
|  |   <div class="app-container" style="overflow: auto"> | ||||||
|  |     <search-bar :formConfigs="formConfig" ref="searchBarForm" @select-changed="handleSearchBarChanged" | ||||||
|  |       @headBtnClick="buttonClick" /> | ||||||
|  |     <div class="top-tip"> | ||||||
|  |       <div class="block" style="background: #5b8ff9" /> | ||||||
|  |       运行 | ||||||
|  |       <div class="block" style="background: #f4b183" /> | ||||||
|  |       停机 | ||||||
|  |       <div class="block" style="background: #ff4f3e" /> | ||||||
|  |       故障 | ||||||
|  |     </div> | ||||||
|  |     <div class="canvas-line" v-for="(item, index) in lineArr" :key="index"> | ||||||
|  |       <div class="title">{{ item.name }}</div> | ||||||
|  |       <canvas style=" | ||||||
|  | 					box-shadow: 1px 1px 2px 2px #909399; | ||||||
|  | 					padding: 0; | ||||||
|  | 					height: 350px; | ||||||
|  | 					width: 2500px; | ||||||
|  | 				" @click="getclient($event, index + 1, item.num)" :id="'mycanvas' + (index + 1)"></canvas> | ||||||
|  |     </div> | ||||||
|  |   </div> | ||||||
|  | </template> | ||||||
|  |  | ||||||
|  | <script> | ||||||
|  | import { getPdList } from '@/api/core/monitoring/auto'; | ||||||
|  | import { getFactoryPage, getLineEqStatus } from '@/api/core/base/factory'; | ||||||
|  | import linePot from './line-pot'; | ||||||
|  |  | ||||||
|  | export default { | ||||||
|  | 	data() { | ||||||
|  | 		return { | ||||||
|  | 			listQuery: { | ||||||
|  | 				factoryId: null, | ||||||
|  | 				lineId: null, | ||||||
|  | 			}, | ||||||
|  | 			ctx: '', //canvas | ||||||
|  | 			lineArr: [], | ||||||
|  | 			formConfig: [ | ||||||
|  | 				{ | ||||||
|  | 					type: 'select', | ||||||
|  | 					label: '工厂', | ||||||
|  | 					selectOptions: [], | ||||||
|  | 					param: 'factoryId', | ||||||
|  | 					onchange: true, | ||||||
|  | 				}, | ||||||
|  | 				{ | ||||||
|  | 					type: 'select', | ||||||
|  | 					label: '产线', | ||||||
|  | 					selectOptions: [], | ||||||
|  | 					param: 'lineId', | ||||||
|  | 					multiple: true, | ||||||
|  |           width: 410 | ||||||
|  | 				}, | ||||||
|  | 				{ | ||||||
|  | 					type: 'button', | ||||||
|  | 					btnName: '搜索', | ||||||
|  | 					name: 'search', | ||||||
|  | 					color: 'primary', | ||||||
|  | 				}, | ||||||
|  | 			], | ||||||
|  | 			linePot, | ||||||
|  | 		}; | ||||||
|  | 	}, | ||||||
|  | 	components: {}, | ||||||
|  | 	created() { | ||||||
|  | 		this.getPdLineList(); | ||||||
|  | 	}, | ||||||
|  | 	methods: { | ||||||
|  | 		initCanvas(name) { | ||||||
|  | 			let canvas = document.getElementById(name); | ||||||
|  | 			canvas.width = canvas.clientWidth; | ||||||
|  |       canvas.width = canvas.clientWidth; | ||||||
|  |       console.log(canvas.width); | ||||||
|  |  | ||||||
|  | 			canvas.height = 350; | ||||||
|  | 			this.ctx = canvas.getContext('2d'); | ||||||
|  | 			this.ctx.lineWidth = 1; | ||||||
|  | 			this.ctx.strokeStyle = '#909399'; | ||||||
|  | 			this.ctx.fillStyle = '#5b8ff9'; | ||||||
|  | 			this.ctx.font = '12px 宋体'; //文字大小 字体样式 | ||||||
|  |       this.ctx.clearRect(0, 0, canvas.clientWidth, 350); //清空画布 | ||||||
|  | 		}, | ||||||
|  | 		//画长方形 | ||||||
|  | 		fillRect(x, y, width, height, name, color) { | ||||||
|  | 			this.ctx.beginPath(); //开始 | ||||||
|  | 			this.ctx.fillStyle = color ? color : '#5b8ff9'; //填充颜色 | ||||||
|  | 			this.ctx.fillRect(x, y, width, height); //左上角点的坐标(x,y) 宽 高 | ||||||
|  | 			this.ctx.strokeRect(x, y, width, height); | ||||||
|  | 			this.ctx.fillStyle = '#fff'; //填充颜色 | ||||||
|  | 			if (height === 50) { | ||||||
|  | 				//判断是否特殊机器 机器文字y轴定位加10 | ||||||
|  | 				this.ctx.fillText(name, x + 5, y + 30); | ||||||
|  | 			} else { | ||||||
|  | 				this.ctx.fillText(name, x + 5, y + 20); | ||||||
|  | 			} | ||||||
|  | 			this.ctx.closePath(); //结束 | ||||||
|  | 		}, | ||||||
|  | 		//画特殊形 | ||||||
|  | 		fillLRect(LArr, name, color) { | ||||||
|  | 			this.ctx.beginPath(); //开始 | ||||||
|  | 			LArr.forEach((item, index) => { | ||||||
|  | 				if (index === 0) { | ||||||
|  | 					this.ctx.moveTo(item[0], item[1]); | ||||||
|  | 				} else { | ||||||
|  | 					this.ctx.lineTo(item[0], item[1]); | ||||||
|  | 				} | ||||||
|  | 			}); | ||||||
|  | 			this.ctx.closePath(); //结束   // 闭合路径 | ||||||
|  | 			this.ctx.fillStyle = color ? color : '#5b8ff9'; //填充颜色 | ||||||
|  | 			this.ctx.fill(); | ||||||
|  | 			this.ctx.stroke(); | ||||||
|  | 			this.ctx.fillStyle = '#fff'; //填充颜色 | ||||||
|  | 			if (LArr[0][0] === LArr[1][0]) { | ||||||
|  | 				//判断L形第一截是竖着还是横着 | ||||||
|  | 				this.ctx.fillText(name, LArr[1][0] + 5, LArr[1][1]-10); //竖着 | ||||||
|  | 			} else { | ||||||
|  | 				this.ctx.fillText(name, LArr[0][0] + 25, LArr[0][1] + 20); | ||||||
|  | 			} | ||||||
|  |     }, | ||||||
|  |     isEven(num) { | ||||||
|  |       return (num & 1) === 0; | ||||||
|  |     }, | ||||||
|  |     setRect(item, index) { | ||||||
|  |       console.log(index) | ||||||
|  |       let identifier = '' | ||||||
|  |       if (this.isEven(index + 1)) { | ||||||
|  |          identifier = 'line' + item.num + 'canvasSecondHalf'; | ||||||
|  |       } else { | ||||||
|  |         identifier = 'line' + item.num + 'canvasFirstHalf'; | ||||||
|  |       } | ||||||
|  | 			// const identifier = 'line' + item.num + 'canvas'; | ||||||
|  | 			this.$nextTick(() => { | ||||||
|  | 				this.initCanvas('mycanvas' + (index + 1)); | ||||||
|  | 			}); | ||||||
|  | 			this.$nextTick(() => { | ||||||
|  | 				this.linePot[identifier].forEach((idItem) => { | ||||||
|  | 					item.children.forEach((eqItem) => { | ||||||
|  | 						if (eqItem.id === idItem.id) { | ||||||
|  | 							idItem.color = ['#5b8ff9', '#f4b183', '#ff4f3e'][ | ||||||
|  | 								eqItem.equipmentStatus | ||||||
|  | 							]; | ||||||
|  | 						} | ||||||
|  | 					}); | ||||||
|  | 					if (idItem.isL) { | ||||||
|  | 						this.fillLRect(idItem.line, idItem.name, idItem.color); | ||||||
|  | 					} else { | ||||||
|  | 						this.fillRect( | ||||||
|  | 							idItem.x, | ||||||
|  | 							idItem.y, | ||||||
|  | 							idItem.width, | ||||||
|  | 							idItem.height, | ||||||
|  | 							idItem.name, | ||||||
|  | 							idItem.color | ||||||
|  | 						); | ||||||
|  | 					} | ||||||
|  | 				}); | ||||||
|  | 			}); | ||||||
|  | 		}, | ||||||
|  | 		getclient(e, index, num) { | ||||||
|  | 			let canvas = document.getElementById('mycanvas' + index); | ||||||
|  | 			const rect = canvas.getBoundingClientRect(); | ||||||
|  |       let identifier = '' | ||||||
|  |       if (this.isEven(index + 1)) { | ||||||
|  |         identifier = 'line' + num + 'canvasSecondHalf'; | ||||||
|  |       } else { | ||||||
|  |         identifier = 'line' + num + 'canvasFirstHalf'; | ||||||
|  |       } | ||||||
|  | 			this.isEQ(e.clientX - rect.left, e.clientY - rect.top, identifier); | ||||||
|  | 		}, | ||||||
|  | 		// 检查点击位置是否在设备内 | ||||||
|  | 		isEQ(x, y, identifier) { | ||||||
|  | 			this.linePot[identifier].forEach((idItem) => { | ||||||
|  | 				if (idItem.isEQ) { | ||||||
|  | 					// 检查点击位置是否在矩形内 | ||||||
|  | 					if ( | ||||||
|  | 						x >= idItem.x && | ||||||
|  | 						x <= idItem.x + idItem.width && | ||||||
|  | 						y >= idItem.y && | ||||||
|  | 						y <= idItem.y + idItem.height | ||||||
|  | 					) { | ||||||
|  | 						console.log(idItem.name, idItem.id); | ||||||
|  | 						this.$router.push({ | ||||||
|  |               path: '//base/production-line/getLineEqStatus', | ||||||
|  | 							query: { eqid: idItem.id }, | ||||||
|  | 						}); | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  | 			}); | ||||||
|  | 		}, | ||||||
|  | 		getPdLineList() { | ||||||
|  | 			const params = { | ||||||
|  | 				pageSize: 100, | ||||||
|  | 				pageNo: 1, | ||||||
|  | 			}; | ||||||
|  | 			getFactoryPage(params).then((res) => { | ||||||
|  | 				this.formConfig[0].selectOptions = res.data.list || []; | ||||||
|  | 			}); | ||||||
|  | 			getPdList().then((res) => { | ||||||
|  | 				this.formConfig[1].selectOptions = res.data || []; | ||||||
|  | 			}); | ||||||
|  | 		}, | ||||||
|  | 		buttonClick(val) { | ||||||
|  | 			switch (val.btnName) { | ||||||
|  | 				case 'search': | ||||||
|  | 					this.listQuery.pageNo = 1; | ||||||
|  | 					this.listQuery.pageSize = 100; | ||||||
|  | 					this.listQuery.factoryId = val.factoryId || undefined; | ||||||
|  | 					this.listQuery.lineId = val.lineId ? val.lineId : []; | ||||||
|  | 					this.getDataList(); | ||||||
|  | 					break; | ||||||
|  | 				default: | ||||||
|  | 					console.log(val); | ||||||
|  | 			} | ||||||
|  | 		}, | ||||||
|  | 		handleSearchBarChanged({ param, value }) { | ||||||
|  | 			this.listQuery.lineId = []; | ||||||
|  | 			this.$refs.searchBarForm.formInline.lineId = undefined; | ||||||
|  | 			getPdList(value).then((res) => { | ||||||
|  | 				this.formConfig[1].selectOptions = res.data || []; | ||||||
|  | 			}); | ||||||
|  | 		}, | ||||||
|  | 		getDataList() { | ||||||
|  | 			// this.lineArr = [ | ||||||
|  | 			// 	{ | ||||||
|  | 			// 		num: 1, | ||||||
|  | 			// 		name: 'A1', | ||||||
|  | 			// 		children: [], | ||||||
|  | 			// 	}, | ||||||
|  | 			// 	{ | ||||||
|  | 			// 		num: 2, | ||||||
|  | 			// 		name: 'A2', | ||||||
|  | 			// 		children: [], | ||||||
|  | 			// 	}, | ||||||
|  | 			// 	{ | ||||||
|  | 			// 		num: 3, | ||||||
|  | 			// 		name: 'A3', | ||||||
|  | 			// 		children: [], | ||||||
|  | 			// 	}, | ||||||
|  | 			// 	{ | ||||||
|  | 			// 		num: 4, | ||||||
|  | 			// 		name: 'A4', | ||||||
|  | 			// 		children: [], | ||||||
|  | 			// 	}, | ||||||
|  | 			// 	{ | ||||||
|  | 			// 		num: 5, | ||||||
|  | 			// 		name: 'A5', | ||||||
|  | 			// 		children: [], | ||||||
|  | 			// 	}, | ||||||
|  | 			// ]; | ||||||
|  |       getLineEqStatus(this.listQuery).then((response) => { | ||||||
|  |         this.lineArr = response.data; | ||||||
|  |         // Create a new array by duplicating each item | ||||||
|  |         const duplicatedArr = []; | ||||||
|  |         this.lineArr.forEach((item, index) => { | ||||||
|  |           console.log(item,'item'); | ||||||
|  |  | ||||||
|  |           // Process original item | ||||||
|  |           const num = [ | ||||||
|  |             '', | ||||||
|  |             20001, | ||||||
|  |             20002, | ||||||
|  |             20003, | ||||||
|  |             20004, | ||||||
|  |             20005, | ||||||
|  |           ].indexOf(item.id); | ||||||
|  |           if (num > 0) { | ||||||
|  |             // Original item with copy=1 | ||||||
|  |             const originalItem = { | ||||||
|  |               ...item, | ||||||
|  |               num: num, | ||||||
|  |               name: item.lineName +'前半段', | ||||||
|  |               copy: 1 | ||||||
|  |             }; | ||||||
|  |             duplicatedArr.push(originalItem); | ||||||
|  |             this.setRect(originalItem, index * 2); // Adjust index for original | ||||||
|  |  | ||||||
|  |             // Create copy with copy=2 | ||||||
|  |             const copiedItem = { | ||||||
|  |               ...item, | ||||||
|  |               num: num, | ||||||
|  |               name: item.lineName + '后半段', | ||||||
|  |               copy: 2 | ||||||
|  |             }; | ||||||
|  |             duplicatedArr.push(copiedItem); | ||||||
|  |             this.setRect(copiedItem, index * 2 + 1); // Adjust index for copy | ||||||
|  |           } else { | ||||||
|  |             this.$message.warning('没有对应的产线!'); | ||||||
|  |           } | ||||||
|  |         }); | ||||||
|  |         console.log(duplicatedArr); | ||||||
|  |  | ||||||
|  |         // Replace the original array with the duplicated one | ||||||
|  |         this.lineArr = duplicatedArr; | ||||||
|  |       }); | ||||||
|  | 		}, | ||||||
|  | 	}, | ||||||
|  | }; | ||||||
|  | </script> | ||||||
|  |  | ||||||
|  | <style scoped lang="scss"> | ||||||
|  | .top-tip { | ||||||
|  | 	.block { | ||||||
|  | 		display: inline-block; | ||||||
|  | 		width: 20px; | ||||||
|  | 		height: 10px; | ||||||
|  | 		margin-left: 20px; | ||||||
|  | 		margin-right: 3px; | ||||||
|  | 	} | ||||||
|  | } | ||||||
|  | .canvas-line { | ||||||
|  | 	margin-top: 20px; | ||||||
|  | 	min-width: 2000px; | ||||||
|  |   overflow: auto; | ||||||
|  |   // height: 300px; | ||||||
|  |   // overflow-x: hidden; | ||||||
|  | 	.title { | ||||||
|  | 		font-size: 20px; | ||||||
|  | 		font-weight: bolder; | ||||||
|  | 		&::before { | ||||||
|  | 			content: ''; | ||||||
|  | 			background: rgb(39, 240, 17); | ||||||
|  | 			display: inline-block; | ||||||
|  | 			width: 8px; | ||||||
|  | 			height: 8px; | ||||||
|  | 			border-radius: 50%; | ||||||
|  | 			margin-right: 3px; | ||||||
|  | 			transform: translateY(-50%); | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
|  | } | ||||||
|  | </style> | ||||||
							
								
								
									
										5131
									
								
								src/views/monitoring/qhdEquipmentVisualize/line-pot.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -1,172 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2023-08-01 13:52:10 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-10-16 13:40:00 |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" |  | ||||||
|     label-width="130px"> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="订单名称" prop="name"> |  | ||||||
|           <el-input v-model="dataForm.name" clearable placeholder="请输入订单名称" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="订单编码" prop="code"> |  | ||||||
|           <el-input v-model="dataForm.code" clearable placeholder="请输入订单编码" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="客户" prop="customerName"> |  | ||||||
|           <el-input v-model="dataForm.customerName" clearable placeholder="请输入客户" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="计划加工量(片)" prop="planProductNum"> |  | ||||||
|           <el-input v-model="dataForm.planProductNum" clearable placeholder="请输入计划加工量" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="产品工艺" prop="processName"> |  | ||||||
|           <el-input v-model="dataForm.processName" clearable placeholder="请输入产品工艺" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="产品规格" prop="planProductSize"> |  | ||||||
|           <el-input v-model="dataForm.planProductSize" clearable placeholder="请输入产品规格" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="交货日期" prop="deliveryTime"> |  | ||||||
|           <el-date-picker v-model="dataForm.deliveryTime" type="date" placeholder="选择交货日期" value-format="timestamp"> |  | ||||||
|           </el-date-picker> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="包装规格(片/箱)" prop="packSpec"> |  | ||||||
|           <el-input v-model="dataForm.packSpec" clearable placeholder="请输入包装规格" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <el-row :gutter="20"> |  | ||||||
|       <el-col :span="12"> |  | ||||||
|         <el-form-item label="备注" prop="remark"> |  | ||||||
|           <el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <span>产线信息</span> |  | ||||||
|     <el-button type="text" icon="el-icon-plus" @click="handleAdd" style="color: #409EFF;float: right;"> |  | ||||||
|     </el-button> |  | ||||||
|     <el-divider></el-divider> |  | ||||||
|     <el-row :gutter="24" v-for="(item, index) in dataForm.bindLineList" :key="index"> |  | ||||||
|       <el-col :span="8"> |  | ||||||
|         <el-form-item label="产线" :prop="'bindLineList.' + index + '.lineId'"> |  | ||||||
|           <el-select v-model="item.lineId" filterable clearable placeholder="请选择产线"> |  | ||||||
|             <el-option v-for="line in urlOptions.optionArr.arr0" :key="line.id" :label="line.name" |  | ||||||
|               :value="line.id"></el-option> |  | ||||||
|           </el-select> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="14"> |  | ||||||
|         <el-form-item label="实际生产时间段" :prop="'bindLineList[' + index + '].dateRange'"> |  | ||||||
|           <el-date-picker v-model="item.dateRange" type="datetimerange" range-separator="至" start-placeholder="开始日期" |  | ||||||
|             end-placeholder="结束日期" value-format="timestamp" @change="(va1) => handleChange(va1, index)" /> |  | ||||||
|         </el-form-item> |  | ||||||
|       </el-col> |  | ||||||
|       <el-col :span="2"> |  | ||||||
|         <!-- 删除按钮(至少保留一项) --> |  | ||||||
|         <el-button type="text" icon="el-icon-delete" @click="handleDelete(index)" |  | ||||||
|           :disabled="dataForm.bindLineList.length <= 1" style="color: #f56c6c;"></el-button> |  | ||||||
|       </el-col> |  | ||||||
|     </el-row> |  | ||||||
|     <!-- <el-form-item label="备注" prop="remark"> |  | ||||||
|       <el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> |  | ||||||
|     </el-form-item> --> |  | ||||||
|   </el-form> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import basicAdd from '../../mixins/basic-add'; |  | ||||||
| import { |  | ||||||
|   updateOrderData, |  | ||||||
|   createOrderData, |  | ||||||
|   getOrderData, |  | ||||||
|   getOrderCode |  | ||||||
|   // exportWorkshopSectionExcel |  | ||||||
| } from "@/api/order/index"; |  | ||||||
| import { |  | ||||||
| 	getProductionLinePage, |  | ||||||
| } from '@/api/core/base/productionLine'; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
| 	mixins: [basicAdd], |  | ||||||
| 	data() { |  | ||||||
| 		return { |  | ||||||
| 			urlOptions: { |  | ||||||
|         getOption: true, |  | ||||||
| 			  isGetCode: true, |  | ||||||
|         codeURL: getOrderCode, |  | ||||||
|         createURL: createOrderData, |  | ||||||
|         updateURL: updateOrderData, |  | ||||||
|         infoURL: getOrderData, |  | ||||||
|         optionArrUrl: [getProductionLinePage], |  | ||||||
| 			}, |  | ||||||
| 			dataForm: { |  | ||||||
| 				id: undefined, |  | ||||||
| 				code: undefined, |  | ||||||
|         bindLineList: [ |  | ||||||
|         ], |  | ||||||
|         deliveryTime:undefined, |  | ||||||
| 				name: undefined, |  | ||||||
|         remark: undefined, |  | ||||||
|         planProductSize: undefined, |  | ||||||
|         planProductNum: undefined, |  | ||||||
|         customerName: undefined, |  | ||||||
|         processName: undefined, |  | ||||||
|         packSpec: undefined, |  | ||||||
| 			}, |  | ||||||
| 			dataRule: { |  | ||||||
| 				code: [ |  | ||||||
| 					{ required: true, message: '订单编码不能为空', trigger: 'blur' }, |  | ||||||
| 				], |  | ||||||
| 				name: [ |  | ||||||
| 					{ required: true, message: '订单名称不能为空', trigger: 'blur' }, |  | ||||||
| 				], |  | ||||||
| 			}, |  | ||||||
| 		}; |  | ||||||
| 	}, |  | ||||||
|   methods: { |  | ||||||
|     handleAdd() { |  | ||||||
|       const newItem = { |  | ||||||
|         productionLineId: '', |  | ||||||
|         dateRange: [] |  | ||||||
|       }; |  | ||||||
|       // 使用 this.$set 向数组添加元素(确保响应式) |  | ||||||
|       this.$set( |  | ||||||
|         this.dataForm.bindLineList, |  | ||||||
|         this.dataForm.bindLineList.length,  // 新元素的索引(数组长度即最后一个位置) |  | ||||||
|         newItem  // 要添加的新元素 |  | ||||||
|       ); |  | ||||||
|     }, |  | ||||||
|     handleChange(val, index) { |  | ||||||
|       console.log(val); |  | ||||||
|       this.dataForm.bindLineList[index].startProduceTime = val[0] |  | ||||||
|       this.dataForm.bindLineList[index].finishProduceTime = val[1] |  | ||||||
|     }, |  | ||||||
|     handleDelete(index) { |  | ||||||
|       this.dataForm.bindLineList.splice(index, 1); |  | ||||||
|       Message.info('已删除该配置'); |  | ||||||
|     }, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| @@ -1,358 +0,0 @@ | |||||||
| <!-- |  | ||||||
|  * @Author: zhp |  | ||||||
|  * @Date: 2021-12-04 16:27:09 |  | ||||||
|  * @LastEditTime: 2022-08-09 09:47:17 |  | ||||||
|  * @LastEditors: zhp |  | ||||||
|  * @Description: |  | ||||||
| --> |  | ||||||
| <template> |  | ||||||
|   <div> |  | ||||||
|     <el-drawer title="详情" :visible.sync="drawer" :before-close="handleClose" size="60%"> |  | ||||||
|       <div class="detailBox"> |  | ||||||
|         <h2 style="margin-left: 32px;"> |  | ||||||
|           订单编号: {{ dataForm.code}} |  | ||||||
|         </h2> |  | ||||||
|         <el-row> |  | ||||||
|           <el-col :span="8"> |  | ||||||
|             <p class="title">订单名称</p> |  | ||||||
|             <p class="text">{{ dataForm.name }}</p> |  | ||||||
|           </el-col> |  | ||||||
|           <el-col :span="8"> |  | ||||||
|             <p class="title">客户</p> |  | ||||||
|             <p class="text">{{ dataForm.customerName }}</p> |  | ||||||
|           </el-col> |  | ||||||
|           <el-col :span="8"> |  | ||||||
|             <p class="title">计划加工量</p> |  | ||||||
|             <p class="text">{{ dataForm?.planProductNum }}</p> |  | ||||||
|           </el-col> |  | ||||||
|         </el-row> |  | ||||||
|         <!-- <el-divider /> --> |  | ||||||
|         <div> |  | ||||||
|           <el-row> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">产品工艺</p> |  | ||||||
|               <p class="text">{{ dataForm?.processName }}</p> |  | ||||||
|             </el-col> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">产品规格</p> |  | ||||||
|               <p class="text">{{ dataForm?.planProductSize }}</p> |  | ||||||
|             </el-col> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">交货日期</p> |  | ||||||
|               <p class="text">{{ parseTime(dataForm?.deliveryTime) }}</p> |  | ||||||
|             </el-col> |  | ||||||
|           </el-row> |  | ||||||
|           <el-row> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">包装规格(片/箱)</p> |  | ||||||
|               <p class="text">{{ dataForm?.packSpec }}</p> |  | ||||||
|             </el-col> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">实际生产时间</p> |  | ||||||
|               <p class="text">{{ parseTime(dataForm?.startProduceTime) + '-' + parseTime(dataForm?.finishProduceTime) }}</p> |  | ||||||
|             </el-col> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">实际投入数量</p> |  | ||||||
|               <p class="text">{{ dataForm?.assignQuantity }}</p> |  | ||||||
|             </el-col> |  | ||||||
|           </el-row> |  | ||||||
|           <el-row> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">实际产出数量</p> |  | ||||||
|               <p class="text">{{ dataForm?.actualQuantity }}</p> |  | ||||||
|             </el-col> |  | ||||||
|             <el-col :span="8"> |  | ||||||
|               <p class="title">备注</p> |  | ||||||
|               <p class="text">{{ dataForm?.remark }}</p> |  | ||||||
|             </el-col> |  | ||||||
|           </el-row> |  | ||||||
|         </div> |  | ||||||
|         <!-- <div v-if="glass === 4"> --> |  | ||||||
|         <!-- 铜铟镓硒待完成 --> |  | ||||||
|         <!-- </div> --> |  | ||||||
|       </div> |  | ||||||
|       <!-- <head-form :form-config="headFormConfig" @headBtnClick="btnClick" /> --> |  | ||||||
|  |  | ||||||
|       <h2 style="margin-left: 32px;"> |  | ||||||
|         产线信息 |  | ||||||
|       </h2> |  | ||||||
|       <el-divider /> |  | ||||||
|       <el-button @click="handleRoute" type="text" style="float: right;margin-right: 20px;">订单生产详情</el-button> |  | ||||||
|       <base-table :table-props="tableProps" :table-data="tableData"> |  | ||||||
|         <method-btn v-if="tableBtn.length" slot="handleBtn" :width="120" label="操作" :method-list="tableBtn" |  | ||||||
|           @clickBtn="handleClick" /> |  | ||||||
|       </base-table> |  | ||||||
|       <!-- <pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total" |  | ||||||
|         @pagination="getDataList" /> --> |  | ||||||
|     </el-drawer> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| const tableProps = [{ |  | ||||||
|   prop: 'lineName', |  | ||||||
|   label: '产线', |  | ||||||
|   align: 'center' |  | ||||||
| }, |  | ||||||
|   { |  | ||||||
|     prop: 'processName', |  | ||||||
|     label: '产品工艺', |  | ||||||
|     align: 'center' |  | ||||||
|   }, { |  | ||||||
|     prop: 'planProductSize', |  | ||||||
|     label: '产品规格', |  | ||||||
|     align: 'center' |  | ||||||
|   }, { |  | ||||||
|     prop: 'startProduceTime', |  | ||||||
|     label: '开始时间', |  | ||||||
|     filter: parseTime, |  | ||||||
|  |  | ||||||
|     align: 'center' |  | ||||||
|   }, { |  | ||||||
|     prop: 'finishProduceTime', |  | ||||||
|     label: '结束时间', |  | ||||||
|     filter: parseTime, |  | ||||||
|     align: 'center' |  | ||||||
|   }, { |  | ||||||
|     prop: 'assignQuantity', |  | ||||||
|     label: '投入数量', |  | ||||||
|     align: 'center' |  | ||||||
|   }, { |  | ||||||
|     prop: 'actualQuantity', |  | ||||||
|     label: '产出数量', |  | ||||||
|     align: 'center' |  | ||||||
|   }, |  | ||||||
| ] |  | ||||||
| // import { getPageWareHouseSubstrateHistory } from '@/api/equipment/trans' |  | ||||||
| // import BaseTable from '@/components/BaseTable' |  | ||||||
| // // import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn' |  | ||||||
| // import Pagination from '@/components/Pagination' |  | ||||||
| // edit here |  | ||||||
| // import i18n from '@/lang' |  | ||||||
|  |  | ||||||
| // import HeadForm from '@/components/basicData/HeadForm' |  | ||||||
| import { |  | ||||||
|   getOrderData, |  | ||||||
|   // exportWorkshopSectionExcel |  | ||||||
| } from "@/api/order/index"; |  | ||||||
| import { parseTime } from '../../mixins/code-filter'; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
|   components: { |  | ||||||
|     // BaseTable, |  | ||||||
|     // Pagination, |  | ||||||
|     // HeadForm |  | ||||||
|     // MethodBtn |  | ||||||
|     // MethodBtn |  | ||||||
|   }, |  | ||||||
|   data() { |  | ||||||
|     return { |  | ||||||
|       tableProps, |  | ||||||
|       drawer: false, |  | ||||||
|       list: [], |  | ||||||
|       tableBtn: [{ |  | ||||||
|             type: 'detail', |  | ||||||
|             btnName: '产线生产详情', |  | ||||||
|           } |  | ||||||
|         // this.$auth.hasPermi(`base:workshop-section:delete`) |  | ||||||
|         // ? { |  | ||||||
|         // 		type: 'delete', |  | ||||||
|         // 		btnName: '删除', |  | ||||||
|         //   } |  | ||||||
|         // : undefined, |  | ||||||
|       ].filter((v) => v), |  | ||||||
|       tableData:[], |  | ||||||
|       listLoading: false, |  | ||||||
|       total: 0, |  | ||||||
|       edit: false, |  | ||||||
|       // dataForm: { |  | ||||||
|       //   id: null, |  | ||||||
|       //   io: null, |  | ||||||
|       //   status: null |  | ||||||
|       // }, |  | ||||||
|       lineIdList:[], |  | ||||||
|       dataForm: { |  | ||||||
|         id: null, |  | ||||||
|         name: '', // 订单名称 |  | ||||||
|         customerName: '', // 客户 |  | ||||||
|         planProductNum: '', // 计划加工量 |  | ||||||
|         processName: '', // 产品工艺 |  | ||||||
|         planProductSize: '', // 产品规格 |  | ||||||
|         deliveryTime: '', // 交货日期 |  | ||||||
|         packSpec: '', // 包装规格(片/箱) |  | ||||||
|         startProduceTime: '', // 实际生产时间 |  | ||||||
|         assignQuantity: '', // 实际投入数量 |  | ||||||
|         actualQuantity: '', // 实际产出数量 |  | ||||||
|         remark: '' // 备注 |  | ||||||
|       }, |  | ||||||
|       listQuery: { |  | ||||||
|  |  | ||||||
|       }, |  | ||||||
|       // headFormConfig: [ |  | ||||||
|       //   { |  | ||||||
|       //     label: this.$t('module.equipmentManager.trans.inEqTime'), |  | ||||||
|       //     type: 'datePickRange', |  | ||||||
|       //     dateType: 'datetimerange', |  | ||||||
|       //     format: 'yyyy-MM-dd HH:mm:ss', |  | ||||||
|       //     valueFormat: 'yyyy-MM-ddTHH:mm:ss', |  | ||||||
|       //     param: 'inTime' |  | ||||||
|       //   }, |  | ||||||
|       //   { |  | ||||||
|       //     label: this.$t('module.equipmentManager.trans.outTime'), |  | ||||||
|       //     type: 'datePickRange', |  | ||||||
|       //     dateType: 'datetimerange', |  | ||||||
|       //     format: 'yyyy-MM-dd HH:mm:ss', |  | ||||||
|       //     valueFormat: 'yyyy-MM-ddTHH:mm:ss', |  | ||||||
|       //     param: 'outTime' |  | ||||||
|       //   }, |  | ||||||
|       //   { |  | ||||||
|       //     type: 'button', |  | ||||||
|       //     btnName: 'btn.search', |  | ||||||
|       //     name: 'search', |  | ||||||
|       //     color: 'primary' |  | ||||||
|       //   } |  | ||||||
|       //   // { |  | ||||||
|       //   //   type: 'button', |  | ||||||
|       //   //   btnName: 'btn.exportBtn', |  | ||||||
|       //   //   name: 'exportBtn', |  | ||||||
|       //   //   color: 'primary' |  | ||||||
|       //   // } |  | ||||||
|       // ], |  | ||||||
|       rules: { |  | ||||||
|         // slotNo: [ |  | ||||||
|         //   { required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.trans.slotNo')]), trigger: 'blur' } |  | ||||||
|         // ], |  | ||||||
|         // substrateId: [ |  | ||||||
|         //   { required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.trans.substrateId')]), trigger: 'blur' } |  | ||||||
|         // ] |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     handleClose() { |  | ||||||
|       this.drawer = false |  | ||||||
|     }, |  | ||||||
|     handleRoute() { |  | ||||||
|       console.log(this.lineIdList); |  | ||||||
|  |  | ||||||
|       this.$router.push({ |  | ||||||
|         path: '/core/monitoring/production-line-data', |  | ||||||
|         query: { |  | ||||||
|           lineId: this.lineIdList, |  | ||||||
|           startProduceTime: this.dataForm.startProduceTime, |  | ||||||
|           finishProduceTime: this.dataForm.finishProduceTime, |  | ||||||
|           tab: 'his', |  | ||||||
|           name: this.dataForm.name, |  | ||||||
|           code: this.dataForm.code, |  | ||||||
|  |  | ||||||
|           buttonType:'order' |  | ||||||
|         } |  | ||||||
|       }) |  | ||||||
|     }, |  | ||||||
|     handleClick(val) { |  | ||||||
|       console.log(val); |  | ||||||
|  |  | ||||||
|       this.$router.push({ |  | ||||||
|         path: '/core/monitoring/production-line-data', |  | ||||||
|         query: { |  | ||||||
|           lineId: [val.data.lineId], |  | ||||||
|           startProduceTime: val.data.startProduceTime, |  | ||||||
|           finishProduceTime: val.data.finishProduceTime, |  | ||||||
|           tab:'his' |  | ||||||
|         } |  | ||||||
|       }) |  | ||||||
|     }, |  | ||||||
|     async init(id) { |  | ||||||
|       // if (id !== undefined) { |  | ||||||
|       this.dataForm.id = id || '' |  | ||||||
|       //   this.edit = true |  | ||||||
|       // } |  | ||||||
|       // console.log(this.edit) |  | ||||||
|       this.drawer = true |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         // this.$refs['dataForm'].resetFields() |  | ||||||
|         getOrderData(id).then((res) => { |  | ||||||
|           this.dataForm = res.data |  | ||||||
|           this.tableData = res.data.bindLines |  | ||||||
|  |  | ||||||
|           this.tableData.forEach(ele => { |  | ||||||
|             this.lineIdList.push( |  | ||||||
|               ele.lineId |  | ||||||
|             ) |  | ||||||
|           }); |  | ||||||
|  |  | ||||||
|         }) |  | ||||||
|         // console.log(); |  | ||||||
|  |  | ||||||
|         // if (this.listQuery.id) { |  | ||||||
|         //   this.getList() |  | ||||||
|         // } |  | ||||||
|       }) |  | ||||||
|     }, |  | ||||||
|     getList() { |  | ||||||
|       getPageWareHouseSubstrateHistory(this.listQuery).then(res => { |  | ||||||
|         console.log(res) |  | ||||||
|  |  | ||||||
|         this.list = res.data.records |  | ||||||
|         this.total = res.data.total |  | ||||||
|       }) |  | ||||||
|     } |  | ||||||
|     // dataSubmit() { |  | ||||||
|     //   this.$refs['dataForm'].validate((valid) => { |  | ||||||
|     //     if (valid) { |  | ||||||
|     //       if (this.dataForm.id) { |  | ||||||
|     //         const data = { |  | ||||||
|     //           id: this.dataForm.id, |  | ||||||
|     //           io: this.dataForm.io, |  | ||||||
|     //           status: this.dataForm.status |  | ||||||
|     //         } |  | ||||||
|     //         addOrUpdateLineSideWareHouseDetailData(data).then(res => { |  | ||||||
|     //           this.$message({ |  | ||||||
|     //             message: this.$t('module.basicData.visual.success'), |  | ||||||
|     //             type: 'success', |  | ||||||
|     //             duration: 1500, |  | ||||||
|     //             onClose: () => { |  | ||||||
|     //               this.drawer = false |  | ||||||
|     //               this.$emit('refreshDataList') |  | ||||||
|     //             } |  | ||||||
|     //           }) |  | ||||||
|     //         }) |  | ||||||
|     //       } |  | ||||||
|     //     } |  | ||||||
|     //   }) |  | ||||||
|     // } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style lang="scss" scoped> |  | ||||||
|     .detailBox p { |  | ||||||
|       margin: 0; |  | ||||||
|       padding: 0 32px; |  | ||||||
|     } |  | ||||||
|  |  | ||||||
|     .detailBox.title { |  | ||||||
|       /* width: 56px; */ |  | ||||||
|       /* height: 14px; */ |  | ||||||
|       font-family: Source Han Sans CN, Source Han Sans CN; |  | ||||||
|       font-weight: 400; |  | ||||||
|       font-size: 14px; |  | ||||||
|       color: rgba(0, 0, 0, 0.85); |  | ||||||
|       line-height: 16px; |  | ||||||
|       text-align: left; |  | ||||||
|       font-style: normal; |  | ||||||
|       text-transform: none; |  | ||||||
|     } |  | ||||||
|  |  | ||||||
|     .detailBox.text { |  | ||||||
|       font-size: 14px; |  | ||||||
|       font-weight: 400; |  | ||||||
|       color: rgba(102, 102, 102, 0.75); |  | ||||||
|       padding-bottom: 20px; |  | ||||||
|     } |  | ||||||
|  |  | ||||||
|     .detailBox { |  | ||||||
|       width: 98%; |  | ||||||
|       padding: 30px 0; |  | ||||||
|     } |  | ||||||
| </style> |  | ||||||
| @@ -1,362 +0,0 @@ | |||||||
| <template> |  | ||||||
|   <div class="app-container"> |  | ||||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |  | ||||||
|     <el-table v-loading="dataListLoading" :data="tableData" row-key="id" border style="width: 100%"> |  | ||||||
|       <el-table-column label="序号" type="index" width="50" /> |  | ||||||
|       <!-- 订单名称/产线名称列 --> |  | ||||||
|       <el-table-column prop="name" label="订单名称/产线名称" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 订单编号列 --> |  | ||||||
|       <el-table-column prop="code" label="订单编号" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 客户列 --> |  | ||||||
|       <el-table-column prop="customerName" label="客户" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 计划加工量列 --> |  | ||||||
|       <el-table-column prop="planProductNum" label="计划加工量" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 实际加工量列 --> |  | ||||||
|       <el-table-column prop="actualQuantity" label="实际加工量" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 产品工艺列 --> |  | ||||||
|       <el-table-column prop="processName" label="产品工艺" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 产品规格列 --> |  | ||||||
|       <el-table-column prop="planProductSize" label="产品规格" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 交货时间列(带时间格式化) --> |  | ||||||
|       <el-table-column prop="deliveryTime" label="交货时间" align="center"> |  | ||||||
|         <template #default="scope"> |  | ||||||
|           {{ parseTime(scope.row.deliveryTime) }} |  | ||||||
|         </template> |  | ||||||
|       </el-table-column> |  | ||||||
|  |  | ||||||
|       <!-- 开始时间列(带时间格式化) --> |  | ||||||
|       <el-table-column prop="startProduceTime" label="开始时间" align="center"> |  | ||||||
|         <template #default="scope"> |  | ||||||
|           {{ parseTime(scope.row.startProduceTime) }} |  | ||||||
|         </template> |  | ||||||
|       </el-table-column> |  | ||||||
|  |  | ||||||
|       <!-- 结束时间列(带时间格式化) --> |  | ||||||
|       <el-table-column prop="finishProduceTime" label="结束时间" align="center"> |  | ||||||
|         <template #default="scope"> |  | ||||||
|           {{ parseTime(scope.row.finishProduceTime) }} |  | ||||||
|         </template> |  | ||||||
|       </el-table-column> |  | ||||||
|  |  | ||||||
|       <!-- 产线数量列 --> |  | ||||||
|       <el-table-column prop="bindLineNum" label="产线数量" align="center" /> |  | ||||||
|  |  | ||||||
|       <!-- 操作列(对应原handleBtn插槽) --> |  | ||||||
|       <el-table-column fixed="right" label="操作" width="120"> |  | ||||||
|         <template #default="scope"> |  | ||||||
|           <!-- 只在 level 为 0 时显示操作按钮 --> |  | ||||||
|           <div v-if="scope.row.level === 0"> |  | ||||||
|             <!-- 详情按钮 --> |  | ||||||
|             <span v-hasPermi="['base:core-work-order:update']" class="iconfont icon-detail  primary-color" |  | ||||||
|               @click="handleDetail(scope.row)" style="cursor: pointer; margin-right: 10px;"></span> |  | ||||||
|  |  | ||||||
|             <!-- 编辑按钮 --> |  | ||||||
|             <span v-hasPermi="['base:core-work-order:update']" class="iconfont icon-edit primary-color" |  | ||||||
|               @click="handleEdit(scope.row)" style="cursor: pointer; margin-right: 10px;"></span> |  | ||||||
|  |  | ||||||
|             <!-- 删除按钮 --> |  | ||||||
|             <span v-hasPermi="['base:core-work-order:delete']" class="iconfont icon-delete delete-color" |  | ||||||
|               @click="deleteHandle(scope.row.id,scope.row.name,scope.row.index)" style="cursor: pointer;"></span> |  | ||||||
|           </div> |  | ||||||
|         </template> |  | ||||||
|       </el-table-column> |  | ||||||
|     </el-table> |  | ||||||
|     <pagination :limit.sync="listQuery.pageSize" :page.sync="listQuery.pageNo" :total="listQuery.total" |  | ||||||
|       @pagination="getDataList" /> |  | ||||||
|     <base-dialog :dialogTitle="addOrEditTitle" :dialogVisible="addOrUpdateVisible" @cancel="handleCancel" |  | ||||||
|       @confirm="handleConfirm" :before-close="handleCancel" width="50%"> |  | ||||||
|       <add-or-update ref="addOrUpdate" @refreshDataList="successSubmit"></add-or-update> |  | ||||||
|     </base-dialog> |  | ||||||
|     <detail v-if="dialogVisibleDetail" ref="detailDialog" @refreshDataList="getDataList" /> |  | ||||||
|   </div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| import AddOrUpdate from './add-or-updata'; |  | ||||||
| import detail from './detail'; |  | ||||||
|  |  | ||||||
| import basicPage from '../../mixins/basic-page'; |  | ||||||
| import { parseTime } from '../../mixins/code-filter'; |  | ||||||
| import { |  | ||||||
|   getOrderPage, |  | ||||||
|   deleteOrder |  | ||||||
|   // getWorkshopSectionPage, |  | ||||||
|   // exportWorkshopSectionExcel |  | ||||||
| } from "@/api/order/index"; |  | ||||||
| import { getPdList } from '@/api/core/monitoring/auto'; |  | ||||||
| import { getFactoryPage } from '@/api/core/base/factory'; |  | ||||||
|  |  | ||||||
| const tableProps = [ |  | ||||||
| 	{ |  | ||||||
| 		prop: 'name', |  | ||||||
| 		label: '订单名称/产线名称' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
| 		prop: 'code', |  | ||||||
| 		label: '订单编号' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
|     prop: 'customerName', |  | ||||||
| 		label: '客户' |  | ||||||
| 	}, |  | ||||||
| 	{ |  | ||||||
|     prop: 'planProductNum', |  | ||||||
| 		label: '计划加工量' |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'productNum', |  | ||||||
|     label: '实际加工量' |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'processName', |  | ||||||
|     label: '产品工艺' |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'planProductSize', |  | ||||||
|     label: '产品规格' |  | ||||||
|   }, |  | ||||||
| 	{ |  | ||||||
|     prop: 'deliveryTime', |  | ||||||
|     label: '交货时间', |  | ||||||
| 		filter: parseTime |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'startProduceTime', |  | ||||||
|     label: '开始时间', |  | ||||||
|     filter: parseTime |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'finishProduceTime', |  | ||||||
|     label: '结束时间', |  | ||||||
|     filter: parseTime |  | ||||||
|   }, |  | ||||||
|   { |  | ||||||
|     prop: 'bindLineNum', |  | ||||||
|     label: '产线数量', |  | ||||||
|   }, |  | ||||||
| ]; |  | ||||||
|  |  | ||||||
| export default { |  | ||||||
| 	mixins: [basicPage], |  | ||||||
| 	data() { |  | ||||||
| 		return { |  | ||||||
| 			urlOptions: { |  | ||||||
|         getDataListURL: getOrderPage, |  | ||||||
|         deleteURL: deleteOrder, |  | ||||||
| 				// exportURL: exportWorkshopSectionExcel, |  | ||||||
| 			}, |  | ||||||
|       tableProps, |  | ||||||
|       dialogVisibleDetail:false, |  | ||||||
| 			tableBtn: [ |  | ||||||
|         this.$auth.hasPermi(`base:core-work-order:update`) |  | ||||||
| 					? { |  | ||||||
| 							type: 'edit', |  | ||||||
| 							btnName: '编辑', |  | ||||||
| 					  } |  | ||||||
| 					: undefined, |  | ||||||
|         this.$auth.hasPermi(`base:core-work-order:delete`) |  | ||||||
| 					? { |  | ||||||
| 							type: 'delete', |  | ||||||
| 							btnName: '删除', |  | ||||||
| 					  } |  | ||||||
| 					: undefined, |  | ||||||
| 			].filter((v)=>v), |  | ||||||
| 			listQuery: { |  | ||||||
|         lineId: null, |  | ||||||
|         startTime: undefined, |  | ||||||
|         endTime:undefined |  | ||||||
| 			}, |  | ||||||
| 			tableData: [], |  | ||||||
|       formConfig: [ |  | ||||||
|         { |  | ||||||
|           type: 'input', |  | ||||||
|           label: '订单名称', |  | ||||||
|           placeholder: '工段名称', |  | ||||||
|           param: 'name', |  | ||||||
|         }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: 'select', |  | ||||||
| 				// 	label: '工厂', |  | ||||||
| 				// 	selectOptions: [], |  | ||||||
| 				// 	param: 'factoryId', |  | ||||||
| 				// 	onchange: true, |  | ||||||
| 				// }, |  | ||||||
| 				{ |  | ||||||
| 					type: 'select', |  | ||||||
| 					label: '产线', |  | ||||||
| 					selectOptions: [], |  | ||||||
| 					param: 'lineId', |  | ||||||
| 					// multiple: true, |  | ||||||
| 				}, |  | ||||||
|         { |  | ||||||
|           type: 'datePicker', |  | ||||||
|           label: '时间范围', |  | ||||||
|           dateType: 'daterange', |  | ||||||
|           format: 'yyyy-MM-dd', |  | ||||||
|           valueFormat: 'timestamp', |  | ||||||
|           rangeSeparator: '-', |  | ||||||
|           startPlaceholder: '开始时间', |  | ||||||
|           endPlaceholder: '结束时间', |  | ||||||
|           param: 'timeVal', |  | ||||||
|         }, |  | ||||||
| 				{ |  | ||||||
|           type: this.$auth.hasPermi('base:core-work-order:query') ? 'button' : '', |  | ||||||
| 					btnName: '搜索', |  | ||||||
| 					name: 'search', |  | ||||||
| 					color: 'primary', |  | ||||||
| 				}, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: 'separate', |  | ||||||
| 				// }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: 'button', |  | ||||||
| 				// 	btnName: '重置', |  | ||||||
| 				// 	name: 'reset', |  | ||||||
| 				// }, |  | ||||||
| 				{ |  | ||||||
| 					type: 'separate', |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
|           type: this.$auth.hasPermi('base:core-work-order:create') ? 'button' : '', |  | ||||||
| 					btnName: '新增', |  | ||||||
| 					name: 'add', |  | ||||||
| 					color: 'success', |  | ||||||
| 					plain: true, |  | ||||||
| 				}, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: this.$auth.hasPermi('base:workshop-section:create') ? 'separate' : '', |  | ||||||
| 				// }, |  | ||||||
| 				// { |  | ||||||
| 				// 	type: this.$auth.hasPermi('base:workshop-section:export') ? 'button' : '', |  | ||||||
| 				// 	btnName: '导出', |  | ||||||
| 				// 	name: 'export', |  | ||||||
| 				// 	color: 'warning', |  | ||||||
| 				// }, |  | ||||||
| 			], |  | ||||||
| 		}; |  | ||||||
| 	}, |  | ||||||
| 	components: { |  | ||||||
|     AddOrUpdate, |  | ||||||
|     detail |  | ||||||
| 	}, |  | ||||||
| 	created() { |  | ||||||
| 		this.getPdLineList(); |  | ||||||
| 	}, |  | ||||||
| 	methods: { |  | ||||||
| 		getPdLineList() { |  | ||||||
| 			getPdList().then((res) => { |  | ||||||
| 				this.formConfig[1].selectOptions = res.data || []; |  | ||||||
| 			}); |  | ||||||
| 			const params = { |  | ||||||
| 				pageSize: 100, |  | ||||||
| 				pageNo: 1, |  | ||||||
| 			}; |  | ||||||
| 			getFactoryPage(params).then((res) => { |  | ||||||
| 				this.formConfig[0].selectOptions = res.data.list || []; |  | ||||||
| 			}); |  | ||||||
| 		}, |  | ||||||
| 		// handleSearchBarChanged({ param, value }) { |  | ||||||
| 		// 	this.listQuery.lineId = null; |  | ||||||
| 		// 	this.$refs.searchBarForm.formInline.lineId = undefined; |  | ||||||
| 		// 	getPdList(value).then((res) => { |  | ||||||
| 		// 		this.formConfig[1].selectOptions = res.data || []; |  | ||||||
| 		// 	}); |  | ||||||
|     // }, |  | ||||||
|     getDataList() { |  | ||||||
|       this.dataListLoading = true; |  | ||||||
|       this.urlOptions.getDataListURL(this.listQuery).then(response => { |  | ||||||
|         this.tableData = response.data.list.map((ele) => { |  | ||||||
|           ele.children = ele.bindLines.map((item) => { |  | ||||||
|             item.name = item.lineName; |  | ||||||
|             item.level = 1 |  | ||||||
|             return item |  | ||||||
|           }) |  | ||||||
|           ele.level = 0 |  | ||||||
|           return ele; |  | ||||||
|         }) |  | ||||||
|         console.log(this.tableData); |  | ||||||
|         this.listQuery.total = response.data.total; |  | ||||||
|         this.dataListLoading = false; |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     handleEdit(val) { |  | ||||||
|       console.log(val); |  | ||||||
|  |  | ||||||
|       // if (val.type === "edit") { |  | ||||||
|         this.addOrUpdateVisible = true; |  | ||||||
|         this.addOrEditTitle = "编辑"; |  | ||||||
|         this.$nextTick(() => { |  | ||||||
|           this.$refs.addOrUpdate.init(val.id); |  | ||||||
|         }); |  | ||||||
|       // } |  | ||||||
|     }, |  | ||||||
|     handleDetail(val) { |  | ||||||
|       console.log(val); |  | ||||||
|  |  | ||||||
|       // if (val.type === "edit") { |  | ||||||
|       this.dialogVisibleDetail = true; |  | ||||||
|       // this.addOrEditTitle = "编辑"; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.detailDialog.init(val.id); |  | ||||||
|       }); |  | ||||||
|       // } |  | ||||||
|     }, |  | ||||||
|     addOrUpdateHandle(id) { |  | ||||||
|       this.addOrUpdateVisible = true; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.addOrUpdate.init(id); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     buttonClick(val) { |  | ||||||
|       console.log(val); |  | ||||||
|  |  | ||||||
| 			switch (val.btnName) { |  | ||||||
| 				case 'search': |  | ||||||
| 					this.listQuery.pageNo = 1; |  | ||||||
| 					this.listQuery.pageSize = 10; |  | ||||||
| 					this.listQuery.name = val.name; |  | ||||||
| 					this.listQuery.factoryId = val.factoryId || undefined; |  | ||||||
|           this.listQuery.lineId = val.lineId || null; |  | ||||||
|           this.listQuery.startTime = val.timeVal ? val.timeVal[0] : undefined |  | ||||||
|           this.listQuery.endTime = val.timeVal ? val.timeVal[1] : undefined |  | ||||||
| 					this.getDataList(); |  | ||||||
| 					break; |  | ||||||
| 				case 'reset': |  | ||||||
| 					this.$refs.searchBarForm.resetForm(); |  | ||||||
| 					this.listQuery = { |  | ||||||
| 						pageSize: 10, |  | ||||||
| 						pageNo: 1, |  | ||||||
| 						total: 1, |  | ||||||
| 					}; |  | ||||||
| 					this.getDataList(); |  | ||||||
| 					break; |  | ||||||
| 				case 'add': |  | ||||||
| 					this.addOrEditTitle = '新增'; |  | ||||||
| 					this.addOrUpdateVisible = true; |  | ||||||
| 					this.addOrUpdateHandle(); |  | ||||||
| 					break; |  | ||||||
| 				case 'export': |  | ||||||
| 					this.handleExport(); |  | ||||||
| 					break; |  | ||||||
| 				default: |  | ||||||
| 					console.log(val); |  | ||||||
| 			} |  | ||||||
| 		}, |  | ||||||
| 	}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
| <style> |  | ||||||
| .delete-color { |  | ||||||
|   color: #ff5454; |  | ||||||
| } |  | ||||||
| .primary-color { |  | ||||||
|   color: #0b58ff; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -1,109 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2022-08-24 11:19:43 |  | ||||||
|  * @LastEditors: zwq |  | ||||||
|  * @LastEditTime: 2023-08-03 14:21:04 |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| export default { |  | ||||||
|   data() { |  | ||||||
|     /* eslint-disable */ |  | ||||||
|     return { |  | ||||||
|       urlOptions: { |  | ||||||
|         createURL: '', |  | ||||||
|         updateURL: '', |  | ||||||
|         infoURL: '', |  | ||||||
|         codeURL: '', |  | ||||||
|         getOption: false, |  | ||||||
|         isGetCode: false, |  | ||||||
|         optionArrUrl: [], |  | ||||||
|         optionArr: {} |  | ||||||
|       }, |  | ||||||
|       dataForm:{}, |  | ||||||
|       visible: false, |  | ||||||
|       setData: false |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|   }, |  | ||||||
|   activated() { |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     init(id) { |  | ||||||
|       this.dataForm.id = id || ""; |  | ||||||
|       this.visible = true; |  | ||||||
|       if (this.urlOptions.getOption) { |  | ||||||
|         this.getArr() |  | ||||||
|       } |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs["dataForm"].resetFields(); |  | ||||||
|         this.dataForm.bindLineList = [] |  | ||||||
|         if (this.dataForm.id) { |  | ||||||
|           this.urlOptions.infoURL(id).then(response => { |  | ||||||
|             this.dataForm = response.data; |  | ||||||
|             this.dataForm.bindLineList = response.data.bindLines.map((ele) => { |  | ||||||
|               ele.lineId = ele.lineId; |  | ||||||
|               ele.dateRange = [ele.startProduceTime, ele.finishProduceTime]; |  | ||||||
|               return ele |  | ||||||
|             }) |  | ||||||
|  |  | ||||||
|             if (this.setData) { |  | ||||||
|               this.setDataForm() |  | ||||||
|             } |  | ||||||
|           }); |  | ||||||
|         } else { |  | ||||||
|           if (this.urlOptions.isGetCode) { |  | ||||||
|             this.getCode() |  | ||||||
|           } |  | ||||||
| 				} |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
| 		getCode() { |  | ||||||
| 			this.urlOptions.codeURL() |  | ||||||
| 				.then(({ data: res }) => { |  | ||||||
| 					this.dataForm.code = res; |  | ||||||
| 				}) |  | ||||||
| 				.catch(() => {}); |  | ||||||
| 		}, |  | ||||||
|     getArr() { |  | ||||||
|       const params = { |  | ||||||
|         pageSize: 100, |  | ||||||
|         pageNo: 1, |  | ||||||
|       } |  | ||||||
|       this.urlOptions.optionArrUrl.forEach((item, index) => { |  | ||||||
|         item(params).then(({ data: res }) => { |  | ||||||
|           this.$set(this.urlOptions.optionArr, `arr${index}`, res.list) |  | ||||||
|         }) |  | ||||||
|           .catch(() => { |  | ||||||
|           }); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     // 表单提交 |  | ||||||
|     dataFormSubmit() { |  | ||||||
|       this.$refs["dataForm"].validate((valid) => { |  | ||||||
|         if (!valid) { |  | ||||||
|           return false; |  | ||||||
|         } |  | ||||||
|         // 修改的提交 |  | ||||||
|         if (this.dataForm.id) { |  | ||||||
|           this.urlOptions.updateURL(this.dataForm).then(response => { |  | ||||||
|             this.$modal.msgSuccess("修改成功"); |  | ||||||
|             this.visible = false; |  | ||||||
|             this.$emit("refreshDataList"); |  | ||||||
|           }); |  | ||||||
|           return; |  | ||||||
|         } |  | ||||||
|         // 添加的提交 |  | ||||||
|         this.urlOptions.createURL(this.dataForm).then(response => { |  | ||||||
|           this.$modal.msgSuccess("新增成功"); |  | ||||||
|           this.visible = false; |  | ||||||
|           this.$emit("refreshDataList"); |  | ||||||
|         }); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     formClear() { |  | ||||||
|       this.$refs.dataForm.resetFields() |  | ||||||
|  |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| @@ -1,168 +0,0 @@ | |||||||
| /* |  | ||||||
|  * @Author: zwq |  | ||||||
|  * @Date: 2022-08-24 11:19:43 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-09-21 16:02:07 |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
| export default { |  | ||||||
|   data() { |  | ||||||
|     /* eslint-disable */ |  | ||||||
|     return { |  | ||||||
|       urlOptions: { |  | ||||||
|         getDataListURL: '', |  | ||||||
|         deleteURL: '', |  | ||||||
|         statusUrl: '', |  | ||||||
|         exportURL: '' |  | ||||||
|       }, |  | ||||||
|       tableData: [], |  | ||||||
|       listQuery: { |  | ||||||
|         pageSize: 10, |  | ||||||
|         pageNo: 1, |  | ||||||
|         total: 1, |  | ||||||
|       }, |  | ||||||
|       exportLoading: false, |  | ||||||
|       dataListLoading: false, |  | ||||||
|       addOrEditTitle: '', |  | ||||||
|       addOrUpdateVisible: false, |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   created() { |  | ||||||
|   }, |  | ||||||
|   mounted() { |  | ||||||
|     this.getDataList() |  | ||||||
|   }, |  | ||||||
|   methods: { |  | ||||||
|     // 获取数据列表 |  | ||||||
|     getDataList() { |  | ||||||
|       this.dataListLoading = true; |  | ||||||
|       this.urlOptions.getDataListURL(this.listQuery).then(response => { |  | ||||||
|         this.tableData = response.data.list; |  | ||||||
|         this.listQuery.total = response.data.total; |  | ||||||
|         this.dataListLoading = false; |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     // 每页数 |  | ||||||
|     sizeChangeHandle(val) { |  | ||||||
|       this.listQuery.pageSize = val; |  | ||||||
|       this.listQuery.pageNo = 1; |  | ||||||
|       this.getDataList(); |  | ||||||
|     }, |  | ||||||
|     // 当前页 |  | ||||||
|     currentChangeHandle(val) { |  | ||||||
|       this.listQuery.pageNo = val; |  | ||||||
|       this.getDataList(); |  | ||||||
|     }, |  | ||||||
|     // 新增 / 修改 |  | ||||||
|     addOrUpdateHandle(id) { |  | ||||||
|       this.addOrUpdateVisible = true; |  | ||||||
|       this.$nextTick(() => { |  | ||||||
|         this.$refs.addOrUpdate.init(id); |  | ||||||
|       }); |  | ||||||
|     }, |  | ||||||
|     cancel(id) { |  | ||||||
|       this.$refs["popover-" + id].showPopper = false; |  | ||||||
|     }, |  | ||||||
|     //改变状态 |  | ||||||
|     changeStatus(id) { |  | ||||||
|       this.$http |  | ||||||
|         .post(this.urlOptions.statusUrl, { id }) |  | ||||||
|         .then(({ data: res }) => { |  | ||||||
|           if (res.code !== 0) { |  | ||||||
|             return this.$message.warning(res.msg); |  | ||||||
|           } |  | ||||||
|           this.$refs["popover-" + id].showPopper = false; |  | ||||||
|           this.$message({ |  | ||||||
|             message: this.$t("prompt.success"), |  | ||||||
|             type: "success", |  | ||||||
|             duration: 500, |  | ||||||
|             onClose: () => { |  | ||||||
|               this.getDataList(); |  | ||||||
|             }, |  | ||||||
|           }); |  | ||||||
|         }) |  | ||||||
|         .catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     //tableBtn点击 |  | ||||||
|     handleClick(val) { |  | ||||||
|       if (val.type === "edit") { |  | ||||||
|         this.addOrUpdateVisible = true; |  | ||||||
|         this.addOrEditTitle = "编辑"; |  | ||||||
|         this.$nextTick(() => { |  | ||||||
|           this.$refs.addOrUpdate.init(val.data.id); |  | ||||||
|         }); |  | ||||||
|       } else if (val.type === "delete") { |  | ||||||
|         this.deleteHandle(val.data.id, val.data.name, val.data._pageIndex) |  | ||||||
|       } else if (val.type === "change") { |  | ||||||
|         this.changeStatus(val.data.id) |  | ||||||
|       } else { |  | ||||||
|         this.otherMethods(val) |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     // 删除 |  | ||||||
|     deleteHandle(id, name, index) { |  | ||||||
|       this.$confirm(`确定对${name ? '[名称=' + name + ']' : '[序号=' + index + ']'}进行删除操作?`, "提示", { |  | ||||||
|         confirmButtonText: "确定", |  | ||||||
|         cancelButtonText: "取消", |  | ||||||
|         type: "warning", |  | ||||||
|       }) |  | ||||||
|         .then(() => { |  | ||||||
|           this.urlOptions.deleteURL(id).then(({ data }) => { |  | ||||||
|             this.$message({ |  | ||||||
|               message: "操作成功", |  | ||||||
|               type: "success", |  | ||||||
|               duration: 1500, |  | ||||||
|               onClose: () => { |  | ||||||
|                 this.getDataList(); |  | ||||||
|               }, |  | ||||||
|             }); |  | ||||||
|           }); |  | ||||||
|         }) |  | ||||||
|         .catch(() => { }); |  | ||||||
|     }, |  | ||||||
|     //search-bar点击 |  | ||||||
|     buttonClick(val) { |  | ||||||
|       switch (val.btnName) { |  | ||||||
|         case "search": |  | ||||||
|           this.listQuery.xm1 = val.xm1; |  | ||||||
|           this.listQuery.xm2 = val.xm2; |  | ||||||
|           this.listQuery.pageNo = 1; |  | ||||||
|           this.getDataList(); |  | ||||||
|           break; |  | ||||||
|         case "add": |  | ||||||
|           this.addOrEditTitle = '新增' |  | ||||||
|           this.addOrUpdateVisible = true; |  | ||||||
|           this.addOrUpdateHandle() |  | ||||||
|           break; |  | ||||||
|         default: |  | ||||||
|           console.log(val) |  | ||||||
|       } |  | ||||||
|     }, |  | ||||||
|     handleCancel() { |  | ||||||
|       this.$refs.addOrUpdate.formClear() |  | ||||||
|       this.addOrUpdateVisible = false |  | ||||||
|       this.addOrEditTitle = '' |  | ||||||
|     }, |  | ||||||
|     handleConfirm() { |  | ||||||
|       this.$refs.addOrUpdate.dataFormSubmit() |  | ||||||
|     }, |  | ||||||
|     successSubmit() { |  | ||||||
|       this.handleCancel() |  | ||||||
|       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(() => { }); |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| @@ -1,73 +0,0 @@ | |||||||
|  |  | ||||||
| /* |  | ||||||
|  * @Date: 2020-12-29 16:49:28 |  | ||||||
|  * @LastEditors: DY |  | ||||||
|  * @LastEditTime: 2023-09-12 11:13:34 |  | ||||||
|  * @FilePath: \basic-admin\src\filters\basicData\index.js |  | ||||||
|  * @Description: |  | ||||||
|  */ |  | ||||||
|  |  | ||||||
| const table = { |  | ||||||
|   lineStatus: { |  | ||||||
|     1: '生产中', |  | ||||||
|     2: '停止', |  | ||||||
|     3: '未知', |  | ||||||
|   }, |  | ||||||
|   reportType: { |  | ||||||
|     1: '日', |  | ||||||
|     2: '周', |  | ||||||
|     3: '月' |  | ||||||
|   }, |  | ||||||
|   pdType: { |  | ||||||
|     1: '原片', |  | ||||||
|     0: '深加工', |  | ||||||
|   }, |  | ||||||
| } |  | ||||||
|  |  | ||||||
| // 日期格式化 |  | ||||||
| export function parseTime(time, pattern) { |  | ||||||
|   if (arguments.length === 0 || !time) { |  | ||||||
|     return null |  | ||||||
|   } |  | ||||||
|   const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}' |  | ||||||
|   let date |  | ||||||
|   if (typeof time === 'object') { |  | ||||||
|     date = time |  | ||||||
|   } else { |  | ||||||
|     if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) { |  | ||||||
|       time = parseInt(time) |  | ||||||
|     } else if (typeof time === 'string') { |  | ||||||
|       time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.\d{3}/gm),''); |  | ||||||
|     } |  | ||||||
|     if ((typeof time === 'number') && (time.toString().length === 10)) { |  | ||||||
|       time = time * 1000 |  | ||||||
|     } |  | ||||||
|     date = new Date(time) |  | ||||||
|   } |  | ||||||
|   const formatObj = { |  | ||||||
|     y: date.getFullYear(), |  | ||||||
|     m: date.getMonth() + 1, |  | ||||||
|     d: date.getDate(), |  | ||||||
|     h: date.getHours(), |  | ||||||
|     i: date.getMinutes(), |  | ||||||
|     s: date.getSeconds(), |  | ||||||
|     a: date.getDay() |  | ||||||
|   } |  | ||||||
|   const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => { |  | ||||||
|     let value = formatObj[key] |  | ||||||
|     // Note: getDay() returns 0 on Sunday |  | ||||||
|     if (key === 'a') { |  | ||||||
|       return ['日', '一', '二', '三', '四', '五', '六'][value] |  | ||||||
|     } |  | ||||||
|     if (result.length > 0 && value < 10) { |  | ||||||
|       value = '0' + value |  | ||||||
|     } |  | ||||||
|     return value || 0 |  | ||||||
|   }) |  | ||||||
|   return time_str |  | ||||||
| } |  | ||||||
| export default function (dictTable) { |  | ||||||
|   return function (val) { |  | ||||||
|     return table?.[dictTable]?.[val] |  | ||||||
|   } |  | ||||||
| } |  | ||||||