Compare commits
	
		
			192 Commits
		
	
	
		
			5aafefda26
			...
			master
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 9be57ad750 | |||
| f7313c5911 | |||
| a7e81ad8fb | |||
| 32cbf9076f | |||
| 9a411cc663 | |||
|  | 445a88e540 | ||
|  | 2b355aaf8f | ||
| f60a46ed1d | |||
| 2688896660 | |||
|  | 4a67e226e1 | ||
|  | 11ee0d6541 | ||
| 98b3237c9a | |||
|  | 46aaa47e07 | ||
| ca0f62b2eb | |||
| 5534104e87 | |||
| b72fe1bfed | |||
| f4493bde1c | |||
|  | d682ecc91c | ||
|  | 2b76ef7d23 | ||
| 9ec13b35b8 | |||
| 7acccd3de0 | |||
| e40f45a79a | |||
| 77083a84a1 | |||
| 9f53ea6981 | |||
| 8f634d012c | |||
| 03c573d5b2 | |||
| 348714edaf | |||
| 814fe4605a | |||
| bb6bfc5ab6 | |||
| 0162f338ba | |||
| 8f99915720 | |||
| 744e5d80be | |||
|  | d3b119ad9b | ||
|  | 69bdab75d4 | ||
| af5e0333ed | |||
| b2ee61b8cb | |||
| 723d83cc02 | |||
| 769830c448 | |||
| 907db90e93 | |||
| 6e390bf12a | |||
| b39f0625a1 | |||
| e985c73e00 | |||
| 180fcf5ad8 | |||
|  | b1c0d21888 | ||
|  | 96d52fafee | ||
| 4f7889ff60 | |||
| bc2c5a4787 | |||
| ab8e9cb2a5 | |||
| 57960ff8bf | |||
| b9e39dacf1 | |||
| 80ad95be6e | |||
| 7dfaae02a8 | |||
| cf2d7af94b | |||
| a48b31dcbe | |||
| 96b0a9e503 | |||
| 9c257aa24a | |||
| 7ab5f1b812 | |||
| 5c796cd44f | |||
| fe0b5538a8 | |||
| 90695acefd | |||
| a90c5cca0c | |||
| 4d7e3c0e04 | |||
| ee40707d2c | |||
| 20808c0975 | |||
| 87f56dd9ac | |||
| 24ffea330d | |||
| a4594426c3 | |||
| c899bb37e3 | |||
| 47e91d821b | |||
| d907d2f341 | |||
| 1116531aff | |||
| 8dc5bbb4d8 | |||
| c24d22aedd | |||
| bbbfa9644d | |||
| db4ecc91d6 | |||
|  | 699810f40a | ||
|  | d454f20bd6 | ||
| 56f209a27e | |||
| 980f3468b7 | |||
| 95da2191dd | |||
| 42550264c8 | |||
| 727f7d57c3 | |||
| aa32e4d3fb | |||
| dcda3a6294 | |||
| f43b1c1eab | |||
| ca3965e8cb | |||
| ee3d6f9dc6 | |||
| e2a777069e | |||
| 06fa7d40b3 | |||
| f6f0480744 | |||
| 45e7f337bf | |||
| 8e0d63839a | |||
| 6c21f01fd7 | |||
| 52bc38499c | |||
| c600d14f8f | |||
| 2265c549e6 | |||
| a74242f3b3 | |||
| ebcf3d4d78 | |||
| 8ad84a4d61 | |||
| ff9e93d264 | |||
| 928258e509 | |||
|  | ee0affc78f | ||
|  | dfec94be17 | ||
| a12530b835 | |||
| b3db8dcae8 | |||
| 24a0857808 | |||
| e0cc022e34 | |||
| 71bcd14c72 | |||
| 646859aeef | |||
| 5a31498224 | |||
| c965dfbc5a | |||
| c364162a2a | |||
| 282ef45114 | |||
| 0371859d14 | |||
| 7407b97f5a | |||
| eff5e0d1e1 | |||
| 60dc449a27 | |||
| 159d626b30 | |||
|  | bc5d3d44d5 | ||
| a6d8a7a9da | |||
| 7d2bfaea18 | |||
|  | e9538744c3 | ||
|  | 8cf2f9f7e9 | ||
| 772a4b0633 | |||
| 27ebe39a96 | |||
| 97f9b52e87 | |||
|  | f85cb9c50f | ||
|  | e8cc1fc50b | ||
| f08c79fc23 | |||
| f341ec7b30 | |||
| 2c6a6b001c | |||
| b17bc0e162 | |||
| d595bf2660 | |||
| 529889fd07 | |||
| 2f18299b0b | |||
| d1c93cbf46 | |||
|  | 7d959e8ad3 | ||
|  | 6f0040a0ae | ||
| 347265853e | |||
|  | f1bbdf82e5 | ||
|  | 645ba2843f | ||
| f2f3a9e850 | |||
| 14e06d9456 | |||
| 4e05b3e3d6 | |||
| 6e678f7c68 | |||
| b91b8c3d3c | |||
| a445c8a61d | |||
| df0dc6bfa0 | |||
| c44ec6f49c | |||
| 6197b606f1 | |||
| c7b32ab34e | |||
| e2527f2e30 | |||
| 76100ad07d | |||
| fa02c3933d | |||
| d63d49ccc9 | |||
| cd437ed7d3 | |||
| 052f54833c | |||
| e42b7035fe | |||
| a505f34abc | |||
| edc5d64acc | |||
| e5fed36234 | |||
| 2dd40261a4 | |||
| e16b6f8ec4 | |||
| 9c59a7e715 | |||
| 55e8de1136 | |||
| ffedc7c256 | |||
| fbd78c6aa5 | |||
| 6f71b6a7c0 | |||
| 55f90a7102 | |||
| b6df60a315 | |||
| 31dbc025c8 | |||
| 63206d4769 | |||
| b23b5256f9 | |||
| 21fbd88a32 | |||
| 0158a11644 | |||
| 62256b57a5 | |||
| 0e6c01e578 | |||
| 0ec4238042 | |||
| fd0c14ff1c | |||
| 72393caee1 | |||
| 14eb83932e | |||
| 0f6418fcf9 | |||
| 100d28fd68 | |||
| bf52db3b6a | |||
| 0f5e4b8368 | |||
| e37bb3f2ce | |||
| 84ed13d58f | |||
| 383f98e1d9 | |||
| 50318121dc | |||
| 01fe2da523 | |||
| d370948705 | |||
| 6e39dd48ff | 
							
								
								
									
										13
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						| @@ -1,13 +1,20 @@ | ||||
| ### | ||||
|  # @Author: Do not edit | ||||
|  # @Date: 2023-08-29 09:40:39 | ||||
|  # @LastEditTime: 2023-10-16 09:22:52 | ||||
|  # @LastEditors: DY | ||||
|  # @Description:  | ||||
| ###  | ||||
| # 开发环境配置 | ||||
| ENV = 'development' | ||||
|  | ||||
| # 页面标题 | ||||
| VUE_APP_TITLE = 芋道管理系统 | ||||
| VUE_APP_TITLE = 产线监控系统 | ||||
|  | ||||
| # 芋道管理系统/开发环境 | ||||
| VUE_APP_BASE_API = 'http://192.168.1.49:48080' | ||||
| # VUE_APP_BASE_API = 'http://192.168.1.49:48080' | ||||
| # VUE_APP_BASE_API = 'http://192.168.1.8:48080' | ||||
| # VUE_APP_BASE_API = 'http://192.168.0.33:48080' | ||||
| VUE_APP_BASE_API = 'http://192.168.0.33:48080' | ||||
| # VUE_APP_BASE_API = 'http://192.168.1.188:48080' | ||||
|  | ||||
| # 路由懒加载 | ||||
|   | ||||
| @@ -2,7 +2,7 @@ | ||||
| ENV = 'development' | ||||
|  | ||||
| # 页面标题 | ||||
| VUE_APP_TITLE = 芋道管理系统 | ||||
| VUE_APP_TITLE = 产线监控系统 | ||||
|  | ||||
| # 芋道管理系统/本地环境 | ||||
| VUE_APP_BASE_API = 'http://api-dashboard.yudao.iocoder.cn' | ||||
|   | ||||
| @@ -2,13 +2,15 @@ | ||||
| ENV = 'production' | ||||
|  | ||||
| # 页面标题 | ||||
| VUE_APP_TITLE = 芋道管理系统 | ||||
| VUE_APP_TITLE = 产线监控系统 | ||||
|  | ||||
| # 芋道管理系统/生产环境 | ||||
| VUE_APP_BASE_API = '/prod-api' | ||||
|  | ||||
| # 根据服务器或域名修改 | ||||
| PUBLIC_PATH = 'http://my-pi.com:8888/yudao-admin/' | ||||
| # PUBLIC_PATH = 'http://my-pi.com:8888/yudao-admin/' | ||||
| PUBLIC_PATH = 'http://192.168.0.33:8888/' | ||||
|  | ||||
| # 二级部署路径 | ||||
| VUE_APP_APP_NAME ='yudao-admin' | ||||
|  | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| NODE_ENV = production | ||||
|  | ||||
| # 页面标题 | ||||
| VUE_APP_TITLE = 芋道管理系统 | ||||
| VUE_APP_TITLE = 产线监控系统 | ||||
|  | ||||
| # 测试环境配置 | ||||
| ENV = 'staging' | ||||
|   | ||||
| @@ -4,7 +4,7 @@ NODE_ENV = development | ||||
| ENV = 'staging' | ||||
|  | ||||
| # 页面标题 | ||||
| VUE_APP_TITLE = 芋道管理系统 | ||||
| VUE_APP_TITLE = 产线监控系统 | ||||
|  | ||||
| # 芋道管理系统/测试环境 | ||||
| VUE_APP_BASE_API = 'http://127.0.0.1:48080' | ||||
|   | ||||
							
								
								
									
										1
									
								
								.gitignore
									
									
									
									
										vendored
									
									
								
							
							
						
						| @@ -20,3 +20,4 @@ selenium-debug.log | ||||
| *.local | ||||
|  | ||||
| package-lock.json | ||||
| echarts.js | ||||
							
								
								
									
										15
									
								
								package.json
									
									
									
									
									
								
							
							
						
						| @@ -50,31 +50,40 @@ | ||||
|     "code-brick-zj": "^1.0.2", | ||||
|     "core-js": "^3.26.0", | ||||
|     "crypto-js": "^4.0.0", | ||||
|     "diagram-js": "^12.3.0", | ||||
|     "echarts": "5.4.0", | ||||
|     "element-ui": "2.15.12", | ||||
|     "file-saver": "2.0.5", | ||||
|     "file-saver": "^2.0.5", | ||||
|     "fuse.js": "6.6.2", | ||||
|     "highlight.js": "9.18.5", | ||||
|     "html2canvas": "^1.4.1", | ||||
|     "js-beautify": "1.13.0", | ||||
|     "jsencrypt": "3.3.1", | ||||
|     "jspdf": "^2.5.1", | ||||
|     "min-dash": "3.5.2", | ||||
|     "mockjs": "^1.1.0", | ||||
|     "moment": "^2.29.4", | ||||
|     "nprogress": "0.2.0", | ||||
|     "qrcode.vue": "^1.7.0", | ||||
|     "qs": "^6.11.2", | ||||
|     "quill": "1.3.7", | ||||
|     "screenfull": "5.0.2", | ||||
|     "sortablejs": "1.10.2", | ||||
|     "throttle-debounce": "2.1.0", | ||||
|     "video.js": "^8.5.2", | ||||
|     "vue": "2.7.14", | ||||
|     "vue-count-to": "1.0.13", | ||||
|     "vue-cropper": "0.5.8", | ||||
|     "vue-meta": "^2.4.0", | ||||
|     "vue-plugin-hiprint": "0.0.54-fix", | ||||
|     "vue-quill-editor": "^3.0.6", | ||||
|     "vue-router": "3.4.9", | ||||
|     "vue-video-player": "^5.0.2", | ||||
|     "vuedraggable": "2.24.3", | ||||
|     "vuex": "3.6.2", | ||||
|     "xml-js": "1.6.11" | ||||
|     "xlsx": "^0.18.5", | ||||
|     "xml-js": "1.6.11", | ||||
|     "yorkie": "^2.0.0" | ||||
|   }, | ||||
|   "devDependencies": { | ||||
|     "@vue/cli-plugin-babel": "4.5.18", | ||||
| @@ -88,7 +97,7 @@ | ||||
|     "chalk": "4.1.0", | ||||
|     "compression-webpack-plugin": "5.0.2", | ||||
|     "connect": "3.6.6", | ||||
|     "eslint": "7.15.0", | ||||
|     "eslint": "6.8.0", | ||||
|     "eslint-config-airbnb-base": "^14.0.0", | ||||
|     "eslint-plugin-import": "^2.26.0", | ||||
|     "eslint-plugin-prettier": "^3.1.0", | ||||
|   | ||||
| Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 2.0 KiB | 
| @@ -1,215 +1,218 @@ | ||||
| <!DOCTYPE html> | ||||
| <html> | ||||
| 	<head> | ||||
| 		<meta charset="utf-8" /> | ||||
| 		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> | ||||
| 		<meta name="renderer" content="webkit" /> | ||||
| 		<meta | ||||
| 			name="viewport" | ||||
| 			content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> | ||||
| 		<link rel="icon" href="<%= BASE_URL %>favicon.ico" /> | ||||
| 		<title><%= webpackConfig.name %></title> | ||||
| 		<!--[if lt IE 11]> | ||||
|  | ||||
| <head> | ||||
| 	<meta charset="utf-8" /> | ||||
| 	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> | ||||
| 	<meta name="renderer" content="webkit" /> | ||||
| 	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> | ||||
| 	<link rel="stylesheet" type="text/css" media="print" href="<%= BASE_URL %>print-lock.css"> | ||||
| 	<link rel="icon" href="<%= BASE_URL %>favicon.ico" /> | ||||
| 	<title> | ||||
| 		<%= webpackConfig.name %> | ||||
| 	</title> | ||||
| 	<!--[if lt IE 11]> | ||||
| 			<script> | ||||
| 				window.location.href = 'html/ie.html'; | ||||
| 			</script> | ||||
| 		<![endif]--> | ||||
| 		<style> | ||||
| 			html, | ||||
| 			body, | ||||
| 			#app { | ||||
| 				height: 100%; | ||||
| 				margin: 0px; | ||||
| 				padding: 0px; | ||||
| 	<style> | ||||
| 		html, | ||||
| 		body, | ||||
| 		#app { | ||||
| 			height: 100%; | ||||
| 			margin: 0px; | ||||
| 			padding: 0px; | ||||
| 		} | ||||
|  | ||||
| 		.chromeframe { | ||||
| 			margin: 0.2em 0; | ||||
| 			background: #ccc; | ||||
| 			color: #000; | ||||
| 			padding: 0.2em 0; | ||||
| 		} | ||||
|  | ||||
| 		#loader-wrapper { | ||||
| 			position: fixed; | ||||
| 			top: 0; | ||||
| 			left: 0; | ||||
| 			width: 100%; | ||||
| 			height: 100%; | ||||
| 			z-index: 999999; | ||||
| 		} | ||||
|  | ||||
| 		#loader { | ||||
| 			display: block; | ||||
| 			position: relative; | ||||
| 			left: 50%; | ||||
| 			top: 50%; | ||||
| 			width: 150px; | ||||
| 			height: 150px; | ||||
| 			margin: -75px 0 0 -75px; | ||||
| 			border-radius: 50%; | ||||
| 			border: 3px solid transparent; | ||||
| 			border-top-color: #fff; | ||||
| 			-webkit-animation: spin 2s linear infinite; | ||||
| 			-ms-animation: spin 2s linear infinite; | ||||
| 			-moz-animation: spin 2s linear infinite; | ||||
| 			-o-animation: spin 2s linear infinite; | ||||
| 			animation: spin 2s linear infinite; | ||||
| 			z-index: 1001; | ||||
| 		} | ||||
|  | ||||
| 		#loader:before { | ||||
| 			content: ''; | ||||
| 			position: absolute; | ||||
| 			top: 5px; | ||||
| 			left: 5px; | ||||
| 			right: 5px; | ||||
| 			bottom: 5px; | ||||
| 			border-radius: 50%; | ||||
| 			border: 3px solid transparent; | ||||
| 			border-top-color: #fff; | ||||
| 			-webkit-animation: spin 3s linear infinite; | ||||
| 			-moz-animation: spin 3s linear infinite; | ||||
| 			-o-animation: spin 3s linear infinite; | ||||
| 			-ms-animation: spin 3s linear infinite; | ||||
| 			animation: spin 3s linear infinite; | ||||
| 		} | ||||
|  | ||||
| 		#loader:after { | ||||
| 			content: ''; | ||||
| 			position: absolute; | ||||
| 			top: 15px; | ||||
| 			left: 15px; | ||||
| 			right: 15px; | ||||
| 			bottom: 15px; | ||||
| 			border-radius: 50%; | ||||
| 			border: 3px solid transparent; | ||||
| 			border-top-color: #fff; | ||||
| 			-moz-animation: spin 1.5s linear infinite; | ||||
| 			-o-animation: spin 1.5s linear infinite; | ||||
| 			-ms-animation: spin 1.5s linear infinite; | ||||
| 			-webkit-animation: spin 1.5s linear infinite; | ||||
| 			animation: spin 1.5s linear infinite; | ||||
| 		} | ||||
|  | ||||
| 		@-webkit-keyframes spin { | ||||
| 			0% { | ||||
| 				-webkit-transform: rotate(0deg); | ||||
| 				-ms-transform: rotate(0deg); | ||||
| 				transform: rotate(0deg); | ||||
| 			} | ||||
|  | ||||
| 			.chromeframe { | ||||
| 				margin: 0.2em 0; | ||||
| 				background: #ccc; | ||||
| 				color: #000; | ||||
| 				padding: 0.2em 0; | ||||
| 			100% { | ||||
| 				-webkit-transform: rotate(360deg); | ||||
| 				-ms-transform: rotate(360deg); | ||||
| 				transform: rotate(360deg); | ||||
| 			} | ||||
| 		} | ||||
|  | ||||
| 		@keyframes spin { | ||||
| 			0% { | ||||
| 				-webkit-transform: rotate(0deg); | ||||
| 				-ms-transform: rotate(0deg); | ||||
| 				transform: rotate(0deg); | ||||
| 			} | ||||
|  | ||||
| 			#loader-wrapper { | ||||
| 				position: fixed; | ||||
| 				top: 0; | ||||
| 				left: 0; | ||||
| 				width: 100%; | ||||
| 				height: 100%; | ||||
| 				z-index: 999999; | ||||
| 			100% { | ||||
| 				-webkit-transform: rotate(360deg); | ||||
| 				-ms-transform: rotate(360deg); | ||||
| 				transform: rotate(360deg); | ||||
| 			} | ||||
| 		} | ||||
|  | ||||
| 			#loader { | ||||
| 				display: block; | ||||
| 				position: relative; | ||||
| 				left: 50%; | ||||
| 				top: 50%; | ||||
| 				width: 150px; | ||||
| 				height: 150px; | ||||
| 				margin: -75px 0 0 -75px; | ||||
| 				border-radius: 50%; | ||||
| 				border: 3px solid transparent; | ||||
| 				border-top-color: #fff; | ||||
| 				-webkit-animation: spin 2s linear infinite; | ||||
| 				-ms-animation: spin 2s linear infinite; | ||||
| 				-moz-animation: spin 2s linear infinite; | ||||
| 				-o-animation: spin 2s linear infinite; | ||||
| 				animation: spin 2s linear infinite; | ||||
| 				z-index: 1001; | ||||
| 			} | ||||
| 		#loader-wrapper .loader-section { | ||||
| 			position: fixed; | ||||
| 			top: 0; | ||||
| 			width: 51%; | ||||
| 			height: 100%; | ||||
| 			background: #7171c6; | ||||
| 			z-index: 1000; | ||||
| 			-webkit-transform: translateX(0); | ||||
| 			-ms-transform: translateX(0); | ||||
| 			transform: translateX(0); | ||||
| 		} | ||||
|  | ||||
| 			#loader:before { | ||||
| 				content: ''; | ||||
| 				position: absolute; | ||||
| 				top: 5px; | ||||
| 				left: 5px; | ||||
| 				right: 5px; | ||||
| 				bottom: 5px; | ||||
| 				border-radius: 50%; | ||||
| 				border: 3px solid transparent; | ||||
| 				border-top-color: #fff; | ||||
| 				-webkit-animation: spin 3s linear infinite; | ||||
| 				-moz-animation: spin 3s linear infinite; | ||||
| 				-o-animation: spin 3s linear infinite; | ||||
| 				-ms-animation: spin 3s linear infinite; | ||||
| 				animation: spin 3s linear infinite; | ||||
| 			} | ||||
| 		#loader-wrapper .loader-section.section-left { | ||||
| 			left: 0; | ||||
| 		} | ||||
|  | ||||
| 			#loader:after { | ||||
| 				content: ''; | ||||
| 				position: absolute; | ||||
| 				top: 15px; | ||||
| 				left: 15px; | ||||
| 				right: 15px; | ||||
| 				bottom: 15px; | ||||
| 				border-radius: 50%; | ||||
| 				border: 3px solid transparent; | ||||
| 				border-top-color: #fff; | ||||
| 				-moz-animation: spin 1.5s linear infinite; | ||||
| 				-o-animation: spin 1.5s linear infinite; | ||||
| 				-ms-animation: spin 1.5s linear infinite; | ||||
| 				-webkit-animation: spin 1.5s linear infinite; | ||||
| 				animation: spin 1.5s linear infinite; | ||||
| 			} | ||||
| 		#loader-wrapper .loader-section.section-right { | ||||
| 			right: 0; | ||||
| 		} | ||||
|  | ||||
| 			@-webkit-keyframes spin { | ||||
| 				0% { | ||||
| 					-webkit-transform: rotate(0deg); | ||||
| 					-ms-transform: rotate(0deg); | ||||
| 					transform: rotate(0deg); | ||||
| 				} | ||||
| 		.loaded #loader-wrapper .loader-section.section-left { | ||||
| 			-webkit-transform: translateX(-100%); | ||||
| 			-ms-transform: translateX(-100%); | ||||
| 			transform: translateX(-100%); | ||||
| 			-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 			transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 		} | ||||
|  | ||||
| 				100% { | ||||
| 					-webkit-transform: rotate(360deg); | ||||
| 					-ms-transform: rotate(360deg); | ||||
| 					transform: rotate(360deg); | ||||
| 				} | ||||
| 			} | ||||
| 		.loaded #loader-wrapper .loader-section.section-right { | ||||
| 			-webkit-transform: translateX(100%); | ||||
| 			-ms-transform: translateX(100%); | ||||
| 			transform: translateX(100%); | ||||
| 			-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 			transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 		} | ||||
|  | ||||
| 			@keyframes spin { | ||||
| 				0% { | ||||
| 					-webkit-transform: rotate(0deg); | ||||
| 					-ms-transform: rotate(0deg); | ||||
| 					transform: rotate(0deg); | ||||
| 				} | ||||
| 		.loaded #loader { | ||||
| 			opacity: 0; | ||||
| 			-webkit-transition: all 0.3s ease-out; | ||||
| 			transition: all 0.3s ease-out; | ||||
| 		} | ||||
|  | ||||
| 				100% { | ||||
| 					-webkit-transform: rotate(360deg); | ||||
| 					-ms-transform: rotate(360deg); | ||||
| 					transform: rotate(360deg); | ||||
| 				} | ||||
| 			} | ||||
| 		.loaded #loader-wrapper { | ||||
| 			visibility: hidden; | ||||
| 			-webkit-transform: translateY(-100%); | ||||
| 			-ms-transform: translateY(-100%); | ||||
| 			transform: translateY(-100%); | ||||
| 			-webkit-transition: all 0.3s 1s ease-out; | ||||
| 			transition: all 0.3s 1s ease-out; | ||||
| 		} | ||||
|  | ||||
| 			#loader-wrapper .loader-section { | ||||
| 				position: fixed; | ||||
| 				top: 0; | ||||
| 				width: 51%; | ||||
| 				height: 100%; | ||||
| 				background: #7171c6; | ||||
| 				z-index: 1000; | ||||
| 				-webkit-transform: translateX(0); | ||||
| 				-ms-transform: translateX(0); | ||||
| 				transform: translateX(0); | ||||
| 			} | ||||
| 		.no-js #loader-wrapper { | ||||
| 			display: none; | ||||
| 		} | ||||
|  | ||||
| 			#loader-wrapper .loader-section.section-left { | ||||
| 				left: 0; | ||||
| 			} | ||||
| 		.no-js h1 { | ||||
| 			color: #222222; | ||||
| 		} | ||||
|  | ||||
| 			#loader-wrapper .loader-section.section-right { | ||||
| 				right: 0; | ||||
| 			} | ||||
| 		#loader-wrapper .load_title { | ||||
| 			font-family: 'Open Sans'; | ||||
| 			color: #fff; | ||||
| 			font-size: 19px; | ||||
| 			width: 100%; | ||||
| 			text-align: center; | ||||
| 			z-index: 9999999999999; | ||||
| 			position: absolute; | ||||
| 			top: 60%; | ||||
| 			opacity: 1; | ||||
| 			line-height: 30px; | ||||
| 		} | ||||
|  | ||||
| 			.loaded #loader-wrapper .loader-section.section-left { | ||||
| 				-webkit-transform: translateX(-100%); | ||||
| 				-ms-transform: translateX(-100%); | ||||
| 				transform: translateX(-100%); | ||||
| 				-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 				transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 			} | ||||
| 		#loader-wrapper .load_title span { | ||||
| 			font-weight: normal; | ||||
| 			font-style: italic; | ||||
| 			font-size: 13px; | ||||
| 			color: #fff; | ||||
| 			opacity: 0.5; | ||||
| 		} | ||||
| 	</style> | ||||
| </head> | ||||
|  | ||||
| 			.loaded #loader-wrapper .loader-section.section-right { | ||||
| 				-webkit-transform: translateX(100%); | ||||
| 				-ms-transform: translateX(100%); | ||||
| 				transform: translateX(100%); | ||||
| 				-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 				transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); | ||||
| 			} | ||||
|  | ||||
| 			.loaded #loader { | ||||
| 				opacity: 0; | ||||
| 				-webkit-transition: all 0.3s ease-out; | ||||
| 				transition: all 0.3s ease-out; | ||||
| 			} | ||||
|  | ||||
| 			.loaded #loader-wrapper { | ||||
| 				visibility: hidden; | ||||
| 				-webkit-transform: translateY(-100%); | ||||
| 				-ms-transform: translateY(-100%); | ||||
| 				transform: translateY(-100%); | ||||
| 				-webkit-transition: all 0.3s 1s ease-out; | ||||
| 				transition: all 0.3s 1s ease-out; | ||||
| 			} | ||||
|  | ||||
| 			.no-js #loader-wrapper { | ||||
| 				display: none; | ||||
| 			} | ||||
|  | ||||
| 			.no-js h1 { | ||||
| 				color: #222222; | ||||
| 			} | ||||
|  | ||||
| 			#loader-wrapper .load_title { | ||||
| 				font-family: 'Open Sans'; | ||||
| 				color: #fff; | ||||
| 				font-size: 19px; | ||||
| 				width: 100%; | ||||
| 				text-align: center; | ||||
| 				z-index: 9999999999999; | ||||
| 				position: absolute; | ||||
| 				top: 60%; | ||||
| 				opacity: 1; | ||||
| 				line-height: 30px; | ||||
| 			} | ||||
|  | ||||
| 			#loader-wrapper .load_title span { | ||||
| 				font-weight: normal; | ||||
| 				font-style: italic; | ||||
| 				font-size: 13px; | ||||
| 				color: #fff; | ||||
| 				opacity: 0.5; | ||||
| 			} | ||||
| 		</style> | ||||
| 	</head> | ||||
|  | ||||
| 	<body> | ||||
| 		<div id="app"> | ||||
| 			<div id="loader-wrapper"> | ||||
| 				<div id="loader"></div> | ||||
| 				<div class="loader-section section-left"></div> | ||||
| 				<div class="loader-section section-right"></div> | ||||
| 				<div class="load_title">正在加载系统资源,请耐心等待</div> | ||||
| 			</div> | ||||
| <body> | ||||
| 	<div id="app"> | ||||
| 		<div id="loader-wrapper"> | ||||
| 			<div id="loader"></div> | ||||
| 			<div class="loader-section section-left"></div> | ||||
| 			<div class="loader-section section-right"></div> | ||||
| 			<div class="load_title">正在加载系统资源,请耐心等待</div> | ||||
| 		</div> | ||||
| 	</body> | ||||
| </html> | ||||
| 	</div> | ||||
| </body> | ||||
|  | ||||
| </html> | ||||
							
								
								
									
										339
									
								
								public/print-lock.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,339 @@ | ||||
| @media print { | ||||
|   body { | ||||
|     margin: 0px; | ||||
|     padding: 0px; | ||||
|   } | ||||
| } | ||||
|  | ||||
| @page { | ||||
|   margin: 0; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper * { | ||||
|   box-sizing: border-box; | ||||
|   -moz-box-sizing: border-box; /* Firefox */ | ||||
|   -webkit-box-sizing: border-box; /* Safari */ | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper *:focus { | ||||
|   outline: -webkit-focus-ring-color auto 0px; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper { | ||||
|   position: relative; | ||||
|   padding: 0 0 0 0; | ||||
|   page-break-after: always; | ||||
|   -webkit-user-select: none; /* Chrome/Safari/Opera */ | ||||
|   -moz-user-select: none; /* Firefox */ | ||||
|   user-select: none; | ||||
|   overflow-x: hidden; | ||||
|   overflow: hidden; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper .hiprint-printPaper-content { | ||||
|   position: relative; | ||||
| } | ||||
|  | ||||
| /* 火狐浏览器打印 第一页过后 重叠问题 */ | ||||
| @-moz-document url-prefix() { | ||||
|   .hiprint-printPaper .hiprint-printPaper-content { | ||||
|     position: relative; | ||||
|     margin-top: 20px; | ||||
|     top: -20px | ||||
|   } | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper.design { | ||||
|   overflow: visible; | ||||
| } | ||||
|  | ||||
|  | ||||
| .hiprint-printTemplate .hiprint-printPanel { | ||||
|   page-break-after: always; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper, hiprint-printPanel { | ||||
|   box-sizing: border-box; | ||||
|   border: 0px; | ||||
| } | ||||
|  | ||||
| .hiprint-printPanel .hiprint-printPaper:last-child { | ||||
|   page-break-after: avoid; | ||||
| } | ||||
|  | ||||
| .hiprint-printTemplate .hiprint-printPanel:last-child { | ||||
|   page-break-after: avoid; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper .hideheaderLinetarget { | ||||
|   border-top: 0px dashed rgb(201, 190, 190) !important; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper .hidefooterLinetarget { | ||||
|   border-top: 0px dashed rgb(201, 190, 190) !important; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper.design { | ||||
|   border: 1px dashed rgba(170, 170, 170, 0.7); | ||||
| } | ||||
|  | ||||
| .design .hiprint-printElement-table-content, .design .hiprint-printElement-longText-content { | ||||
|   overflow: hidden; | ||||
|   box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| .design .resize-panel { | ||||
|   box-sizing: border-box; | ||||
|   border: 1px dotted; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-text { | ||||
|   background-color: transparent; | ||||
|   background-repeat: repeat; | ||||
|   padding: 0 0 0 0; | ||||
|   border: 0.75pt none rgb(0, 0, 0); | ||||
|   direction: ltr; | ||||
|   font-family: 'SimSun'; | ||||
|   font-size: 9pt; | ||||
|   font-style: normal; | ||||
|   font-weight: normal; | ||||
|   padding-bottom: 0pt; | ||||
|   padding-left: 0pt; | ||||
|   padding-right: 0pt; | ||||
|   padding-top: 0pt; | ||||
|   text-align: left; | ||||
|   text-decoration: none; | ||||
|   line-height: 9.75pt; | ||||
|   box-sizing: border-box; | ||||
|   word-wrap: break-word; | ||||
|   word-break: break-all; | ||||
| } | ||||
|  | ||||
| .design .hiprint-printElement-text-content { | ||||
|   border: 1px dashed rgb(206, 188, 188); | ||||
|   box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-longText { | ||||
|   background-color: transparent; | ||||
|   background-repeat: repeat; | ||||
|   border: 0.75pt none rgb(0, 0, 0); | ||||
|   direction: ltr; | ||||
|   font-family: 'SimSun'; | ||||
|   font-size: 9pt; | ||||
|   font-style: normal; | ||||
|   font-weight: normal; | ||||
|   padding-bottom: 0pt; | ||||
|   padding-left: 0pt; | ||||
|   padding-right: 0pt; | ||||
|   padding-top: 0pt; | ||||
|   text-align: left; | ||||
|   text-decoration: none; | ||||
|   line-height: 9.75pt; | ||||
|   box-sizing: border-box; | ||||
|   word-wrap: break-word; | ||||
|   word-break: break-all; | ||||
|   /*white-space: pre-wrap*/ | ||||
| } | ||||
|  | ||||
|  | ||||
| .hiprint-printElement-table { | ||||
|   background-color: transparent; | ||||
|   background-repeat: repeat; | ||||
|   color: rgb(0, 0, 0); | ||||
|   border-color: rgb(0, 0, 0); | ||||
|   border-style: none; | ||||
|   direction: ltr; | ||||
|   font-family: 'SimSun'; | ||||
|   font-size: 9pt; | ||||
|   font-style: normal; | ||||
|   font-weight: normal; | ||||
|   padding-bottom: 0pt; | ||||
|   padding-left: 0pt; | ||||
|   padding-right: 0pt; | ||||
|   padding-top: 0pt; | ||||
|   text-align: left; | ||||
|   text-decoration: none; | ||||
|   padding: 0 0 0 0; | ||||
|   box-sizing: border-box; | ||||
|   line-height: 9.75pt; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-table thead { | ||||
|   background: #e8e8e8; | ||||
|   font-weight: 700; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-tableTarget, .hiprint-printElement-tableTarget tr, .hiprint-printElement-tableTarget td { | ||||
|   border-color: rgb(0, 0, 0); | ||||
|   /*border-style: none;*/ | ||||
|   /*border: 1px solid rgb(0, 0, 0);*/ | ||||
|   font-weight: normal; | ||||
|   direction: ltr; | ||||
|   padding-bottom: 0pt; | ||||
|   padding-left: 4pt; | ||||
|   padding-right: 4pt; | ||||
|   padding-top: 0pt; | ||||
|   text-decoration: none; | ||||
|   vertical-align: middle; | ||||
|   box-sizing: border-box; | ||||
|   word-wrap: break-word; | ||||
|   word-break: break-all; | ||||
|   /*line-height: 9.75pt; | ||||
|   font-size: 9pt;*/ | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-tableTarget-border-all { | ||||
|   border: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-none { | ||||
|   border: 0px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-lr { | ||||
|   border-left: 1px solid; | ||||
|   border-right: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-left { | ||||
|   border-left: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-right { | ||||
|   border-right: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-tb { | ||||
|   border-top: 1px solid; | ||||
|   border-bottom: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-top { | ||||
|   border-top: 1px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-bottom { | ||||
|   border-bottom: 1px solid; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-tableTarget-border-td-none td { | ||||
|   border: 0px solid; | ||||
| } | ||||
| .hiprint-printElement-tableTarget-border-td-all td:not(:last-child) { | ||||
|   border-right: 1px solid; | ||||
| } | ||||
|  | ||||
| /*.hiprint-printElement-tableTarget tr,*/ | ||||
| .hiprint-printElement-tableTarget td { | ||||
|   height: 18pt; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper .hiprint-paperNumber { | ||||
|   font-size: 9pt; | ||||
| } | ||||
|  | ||||
| .design .hiprint-printElement-table-handle { | ||||
|   position: absolute; | ||||
|   height: 21pt; | ||||
|   width: 21pt; | ||||
|   background: red; | ||||
|   z-index: 1; | ||||
| } | ||||
|  | ||||
| .hiprint-printPaper .hiprint-paperNumber-disabled { | ||||
|   float: right !important; | ||||
|   right: 0 !important; | ||||
|   color: gainsboro !important; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-vline, .hiprint-printElement-hline { | ||||
|   border: 0px none rgb(0, 0, 0); | ||||
|  | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-vline { | ||||
|   border-left: 0.75pt solid #000; | ||||
|   border-right: 0px none rgb(0, 0, 0) !important; | ||||
|   border-bottom: 0px none rgb(0, 0, 0) !important; | ||||
|   border-top: 0px none rgb(0, 0, 0) !important; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-hline { | ||||
|   border-top: 0.75pt solid #000; | ||||
|   border-right: 0px none rgb(0, 0, 0) !important; | ||||
|   border-bottom: 0px none rgb(0, 0, 0) !important; | ||||
|   border-left: 0px none rgb(0, 0, 0) !important; | ||||
| } | ||||
|  | ||||
| .hiprint-printElement-oval, .hiprint-printElement-rect { | ||||
|   border: 0.75pt solid #000; | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-middle { | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-middle > div { | ||||
|   display: grid; | ||||
|   align-items: center; | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-bottom { | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-bottom > div { | ||||
|   display: grid; | ||||
|   align-items: flex-end; | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-wrap { | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-wrap .hiprint-text-content-wrap-nowrap { | ||||
|   white-space: nowrap; | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-wrap .hiprint-text-content-wrap-clip { | ||||
|   white-space: nowrap; | ||||
|   overflow: hidden; | ||||
|   text-overflow: clip; | ||||
| } | ||||
|  | ||||
| .hiprint-text-content-wrap .hiprint-text-content-wrap-ellipsis { | ||||
|   white-space: nowrap; | ||||
|   overflow: hidden; | ||||
|   text-overflow: ellipsis; | ||||
| } | ||||
|  | ||||
| /*hi-grid-row */ | ||||
| .hi-grid-row { | ||||
|   position: relative; | ||||
|   height: auto; | ||||
|   margin-right: 0; | ||||
|   margin-left: 0; | ||||
|   zoom: 1; | ||||
|   display: block; | ||||
|   box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| .hi-grid-row::after, .hi-grid-row::before { | ||||
|   display: table; | ||||
|   content: ''; | ||||
|   box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| .hi-grid-col { | ||||
|   display: block; | ||||
|   box-sizing: border-box; | ||||
|   position: relative; | ||||
|   float: left; | ||||
|   flex: 0 0 auto; | ||||
| } | ||||
|  | ||||
| .table-grid-row { | ||||
|   margin-left: -0pt; | ||||
|   margin-right: -0pt; | ||||
| } | ||||
|  | ||||
| .tableGridColumnsGutterRow { | ||||
|   padding-left: 0pt; | ||||
|   padding-right: 0pt; | ||||
| } | ||||
|  | ||||
| .hiprint-gridColumnsFooter { | ||||
|   text-align: left; | ||||
|   clear: both; | ||||
| } | ||||
							
								
								
									
										37
									
								
								src/api/analysis/energyAnalysis.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,37 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获取走势分析数据 | ||||
| export function getEnergyTrend(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/energy-analysis/getTrend', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取对比分析数据 | ||||
| export function getCompare(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/energy-analysis/getCompare', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取同比分析数据(1:季度,2:月;3:日) | ||||
| export function getYoy(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/energy-analysis/getYoy', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取环比分析数据(1:月,2:周,3:日) | ||||
| export function getQoq(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/energy-analysis/getChain', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										70
									
								
								src/api/base/energyPlc.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,70 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源实时数据库plc相关 | ||||
| export function createEnergyPlc(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源实时数据库plc相关 | ||||
| export function updateEnergyPlc(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源实时数据库plc相关 | ||||
| export function deleteEnergyPlc(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源实时数据库plc相关 | ||||
| export function getEnergyPlc(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得实时数据表列表(所有) | ||||
| export function getEnergyPlcAll() { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取关联表编码 | ||||
| export function getCode() { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/getCode', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源实时数据库plc相关分页 | ||||
| export function getEnergyPlcPage(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源实时数据库plc相关 Excel | ||||
| export function exportEnergyPlcExcel(query) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/base/energyPlcConnect.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源与对象的关联关系(一对多) | ||||
| export function createEnergyPlcConnect(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源与对象的关联关系(一对多) | ||||
| export function updateEnergyPlcConnect(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源与对象的关联关系(一对多) | ||||
| export function deleteEnergyPlcConnect(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源与对象的关联关系(一对多) | ||||
| export function getEnergyPlcConnect(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源与对象的关联关系(一对多)分页 | ||||
| export function getEnergyPlcConnectPage(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源与对象的关联关系(一对多) Excel | ||||
| export function exportEnergyPlcConnectExcel(query) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-connect/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/base/energyPlcParam.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源plc详细点 | ||||
| export function createEnergyPlcParam(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源plc详细点 | ||||
| export function updateEnergyPlcParam(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源plc详细点 | ||||
| export function deleteEnergyPlcParam(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源plc详细点 | ||||
| export function getEnergyPlcParam(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源plc详细点分页 | ||||
| export function getEnergyPlcParamPage(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源plc详细点 Excel | ||||
| export function exportEnergyPlcParamExcel(query) { | ||||
|   return request({ | ||||
|     url: '/base/energy-plc-param/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/base/energyQuantityRealtime.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建后端统计 能源抄表 实时 | ||||
| export function createEnergyQuantityRealtime(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新后端统计 能源抄表 实时 | ||||
| export function updateEnergyQuantityRealtime(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除后端统计 能源抄表 实时 | ||||
| export function deleteEnergyQuantityRealtime(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得后端统计 能源抄表 实时 | ||||
| export function getEnergyQuantityRealtime(id) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得后端统计 能源抄表 实时分页 | ||||
| export function getEnergyQuantityRealtimePage(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出后端统计 能源抄表 实时 Excel | ||||
| export function exportEnergyQuantityRealtimeExcel(data) { | ||||
|   return request({ | ||||
|     url: '/base/energy-quantity-realtime/export-excel', | ||||
|     method: 'post', | ||||
|     data: data, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
| @@ -43,6 +43,14 @@ export function getEnergyTypePage(data) { | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源类型列表(获取所有) | ||||
| export function getEnergyTypeListAll() { | ||||
|   return request({ | ||||
|     url: '/base/energy-type/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源类型编码 | ||||
| export function getEnergyTypeCode() { | ||||
|   return request({ | ||||
|   | ||||
| @@ -52,3 +52,10 @@ export function exportEquipmentExcel(query) { | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
| // 获得所有设备列表 | ||||
| export function getEquipmentAll() { | ||||
|   return request({ | ||||
|     url: '/base/equipment/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|   | ||||
							
								
								
									
										8
									
								
								src/api/base/factory.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,8 @@ | ||||
| import request from '@/utils/request' | ||||
| // 获得工厂产线工段设备树形结构 | ||||
| export function getTree() { | ||||
|   return request({ | ||||
|     url: '/base/factory/getTree', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
| @@ -50,3 +50,11 @@ export function getCode() { | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得可用的排班列表 | ||||
| export function listEnabled() { | ||||
|   return request({ | ||||
|     url: '/base/group-team/listEnabled', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|   | ||||
| @@ -1,54 +1,28 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建排班信息 | ||||
| export function createGroupTeamScheduling(data) { | ||||
| // 获取某月预排班-已有排班 | ||||
| export function getPreset(query) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新排班信息 | ||||
| export function updateGroupTeamScheduling(data) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除排班信息 | ||||
| export function deleteGroupTeamScheduling(id) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得排班信息 | ||||
| export function getGroupTeamScheduling(id) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得排班信息分页 | ||||
| export function getGroupTeamSchedulingPage(query) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/page', | ||||
|     url: '/base/group-team-scheduling/getPreset', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出排班信息 Excel | ||||
| export function exportGroupTeamSchedulingExcel(query) { | ||||
| // 批量创建-更新排班信息 | ||||
| export function createOrUpdateList(data) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|     url: '/base/group-team-scheduling/createOrUpdateList', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 自动排班,填充上月已有的排班 | ||||
| export function autoSet(query) { | ||||
|   return request({ | ||||
|     url: '/base/group-team-scheduling/autoSet', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										8
									
								
								src/api/base/productionLine.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,8 @@ | ||||
| import request from '@/utils/request' | ||||
| // 获得所有工厂产线列表 | ||||
| export function getLineAll() { | ||||
|   return request({ | ||||
|     url: '/base/production-line/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										8
									
								
								src/api/base/workshopSection.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,8 @@ | ||||
| import request from '@/utils/request' | ||||
| // 获得所有产线工段列表 | ||||
| export function getWorkShopAll() { | ||||
|   return request({ | ||||
|     url: '/base/workshop-section/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										24
									
								
								src/api/core/analysis/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,24 @@ | ||||
| /* | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-12 14:07:04 | ||||
|  * @LastEditTime: 2023-09-13 09:53:45 | ||||
|  * @LastEditors: zhp | ||||
|  * @Description: | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| export function getYieldAnalysisPageData(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/production-analysis/getOutput', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| export function getCT(data) { | ||||
|   return request({ | ||||
|     url: '/analysis/production-analysis/getCT', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
| @@ -1,3 +1,10 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-08-28 15:30:53 | ||||
|  * @LastEditTime: 2023-10-13 17:08:33 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建产线目前生产产品表 主要为更新 | ||||
| @@ -35,11 +42,11 @@ export function getLineBindProductLog(id) { | ||||
| } | ||||
|  | ||||
| // 获得产线目前生产产品表 主要为更新分页 | ||||
| export function getLineBindProductLogPage(query) { | ||||
| export function getLineBindProductLogPage(data) { | ||||
|   return request({ | ||||
|     url: '/base/line-bind-product-log/page', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
|   | ||||
| @@ -1,3 +1,10 @@ | ||||
| /* | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-08-28 14:29:51 | ||||
|  * @LastEditTime: 2023-08-31 14:33:46 | ||||
|  * @LastEditors: zhp | ||||
|  * @Description: | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建产线工段 | ||||
|   | ||||
							
								
								
									
										25
									
								
								src/api/core/monitoring/auto.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,25 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-09-12 09:44:53 | ||||
|  * @LastEditTime: 2023-09-13 16:11:41 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获得工厂分页 | ||||
| export function getPdlAutoReport(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/production-monitor/getPdlAutoReport', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得所有工厂产线列表 | ||||
| export function getPdList() { | ||||
|   return request({ | ||||
|     url: '/base/production-line/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										25
									
								
								src/api/core/monitoring/data.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,25 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-09-12 09:44:53 | ||||
|  * @LastEditTime: 2023-09-14 10:25:46 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获得产线统计数据查询 | ||||
| export function getPdlDataSearch(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/production-monitor/getPdlDataSearch', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得所有工厂产线列表 | ||||
| export function getPdList() { | ||||
|   return request({ | ||||
|     url: '/base/production-line/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										17
									
								
								src/api/core/monitoring/data24.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,17 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-09-12 09:44:53 | ||||
|  * @LastEditTime: 2023-09-15 14:12:26 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获得近24小时产线生产数据 | ||||
| export function getPdlDataOneDay(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/production-monitor/getPdlDataOneDay', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										16
									
								
								src/api/core/monitoring/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,16 @@ | ||||
| /* | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-12 14:07:04 | ||||
|  * @LastEditTime: 2023-09-13 09:46:44 | ||||
|  * @LastEditors: zhp | ||||
|  * @Description: | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| export function getSectionDataSearch(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/production-monitor/getSectionDataSearch', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										33
									
								
								src/api/core/monitoring/sectionStatistics.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,33 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-09-12 09:44:53 | ||||
|  * @LastEditTime: 2023-09-14 14:01:12 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获得工段自动统计数据查询 | ||||
| export function getSectionAutoReport(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/production-monitor/getSectionAutoReport', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得所有工厂产线列表 | ||||
| export function getPdList() { | ||||
|   return request({ | ||||
|     url: '/base/production-line/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得所有产线工段列表 | ||||
| export function getWorkshopSectionList() { | ||||
|   return request({ | ||||
|     url: '/base/workshop-section/listAll', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										63
									
								
								src/api/monitoring/energyLimit.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,63 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源监控配置 | ||||
| export function createEnergyLimit(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源监控配置 | ||||
| export function updateEnergyLimit(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源监控配置 | ||||
| export function deleteEnergyLimit(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源监控配置 | ||||
| export function getEnergyLimit(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源监控配置分页 | ||||
| export function getEnergyLimitPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源监控配置 Excel | ||||
| export function exportEnergyLimitExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取详细参数列表 | ||||
| export function getEnergyParamList(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-limit/listParam', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/monitoring/energyOverlimitLog.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源超限记录 | ||||
| export function createEnergyOverlimitLog(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源超限记录 | ||||
| export function updateEnergyOverlimitLog(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源超限记录 | ||||
| export function deleteEnergyOverlimitLog(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源超限记录 | ||||
| export function getEnergyOverlimitLog(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源超限记录分页 | ||||
| export function getEnergyOverlimitLogPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源超限记录 Excel | ||||
| export function exportEnergyOverlimitLogExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-overlimit-log/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										39
									
								
								src/api/monitoring/energyReport.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,39 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 获得能耗统计查询分页 | ||||
| export function energyReportPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-report/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能耗统计报表分页 | ||||
| export function energyReportPageAuto(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-report/pageAuto', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能耗统计查询 | ||||
| export function energyReportPageExport(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-report/export', | ||||
|     method: 'post', | ||||
|     data: data, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能耗统计报表 | ||||
| export function energyReportPageExportAuto(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-report/exportAuto', | ||||
|     method: 'post', | ||||
|     data: data, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										62
									
								
								src/api/monitoring/energyStatistics.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,62 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源统计主 | ||||
| export function createEnergyStatistics(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源统计主 | ||||
| export function updateEnergyStatistics(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源统计主 | ||||
| export function deleteEnergyStatistics(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源统计主 | ||||
| export function getEnergyStatistics(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源统计主分页 | ||||
| export function getEnergyStatisticsPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源统计主 Excel | ||||
| export function exportEnergyStatisticsExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获取编码 | ||||
| export function getCode() { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics/getCode', | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										72
									
								
								src/api/monitoring/energyStatisticsDet.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,72 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建能源统计详细表 | ||||
| export function createEnergyStatisticsDet(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新能源统计详细表 | ||||
| export function updateEnergyStatisticsDet(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除能源统计详细表 | ||||
| export function deleteEnergyStatisticsDet(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源统计详细表 | ||||
| export function getEnergyStatisticsDet(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得能源统计详细表分页 | ||||
| export function getEnergyStatisticsDetPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/page', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出能源统计详细表 Excel | ||||
| export function exportEnergyStatisticsDetExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得 新增参数关联 分页 | ||||
| export function addParamPage(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/addParamPage', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除(批量) | ||||
| export function deleteMany(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/energy-statistics-det/deleteMany', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/monitoring/equipmentAlarmLog.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建设备报警日志 | ||||
| export function createEquipmentAlarmLog(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新设备报警日志 | ||||
| export function updateEquipmentAlarmLog(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除设备报警日志 | ||||
| export function deleteEquipmentAlarmLog(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得设备报警日志 | ||||
| export function getEquipmentAlarmLog(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得设备报警日志分页 | ||||
| export function getEquipmentAlarmLogPage(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/page', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出设备报警日志 Excel | ||||
| export function exportEquipmentAlarmLogExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-log/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										54
									
								
								src/api/monitoring/equipmentAlarmRealtime.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,54 @@ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建设备报警实时信息 | ||||
| export function createEquipmentAlarmRealtime(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/create', | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 更新设备报警实时信息 | ||||
| export function updateEquipmentAlarmRealtime(data) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/update', | ||||
|     method: 'put', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 删除设备报警实时信息 | ||||
| export function deleteEquipmentAlarmRealtime(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/delete?id=' + id, | ||||
|     method: 'delete' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得设备报警实时信息 | ||||
| export function getEquipmentAlarmRealtime(id) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/get?id=' + id, | ||||
|     method: 'get' | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 获得设备报警实时信息分页 | ||||
| export function getEquipmentAlarmRealtimePage(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/page', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|   }) | ||||
| } | ||||
|  | ||||
| // 导出设备报警实时信息 Excel | ||||
| export function exportEquipmentAlarmRealtimeExcel(query) { | ||||
|   return request({ | ||||
|     url: '/monitoring/equipment-alarm-realtime/export-excel', | ||||
|     method: 'get', | ||||
|     params: query, | ||||
|     responseType: 'blob' | ||||
|   }) | ||||
| } | ||||
							
								
								
									
										12
									
								
								src/assets/icons/svg/Confirm.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,12 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="16px" height="16px" viewBox="0 0 16 16" 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="设备监控-设备加工数量" transform="translate(-496.000000, -187.000000)" fill-rule="nonzero"> | ||||
|             <g id="选择" transform="translate(496.000000, 187.000000)"> | ||||
|                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect> | ||||
|                 <path d="M13.8735116,4.65950813 C13.6725171,4.47101195 13.3555167,4.48001613 13.1670206,4.6815213 L6.49899208,11.7809972 L2.85649778,8.19199033 C2.65950812,7.99798414 2.34299153,8 2.14898534,8.19698966 C1.95497916,8.3934955 1.95747883,8.71049591 2.15449536,8.90399141 L6.16199434,12.8519823 C6.16349952,12.8534874 6.1654885,12.8539712 6.16699367,12.8554764 C6.16849884,12.8569816 6.16898266,12.8589706 6.17048783,12.8604757 C6.20198897,12.8904717 6.23999461,12.9074856 6.27649508,12.9274829 C6.29450341,12.9379922 6.3099852,12.953474 6.32898802,12.960973 C6.38798547,12.9839807 6.45047706,12.9959683 6.51248486,12.9959683 C6.57798681,12.9959683 6.64348875,12.9829593 6.70447519,12.9569682 C6.72498319,12.9484747 6.74097566,12.930977 6.75997848,12.919957 C6.79747344,12.8979438 6.83647358,12.8794517 6.86848541,12.8469561 C6.86999058,12.8454509 6.87047439,12.8429512 6.87197956,12.841446 C6.87297405,12.8399409 6.87498991,12.8394571 6.8764682,12.8379519 L13.8949604,5.36594544 C14.0849886,5.16548852 14.0745061,4.8489988 13.8735116,4.65950813 Z" id="路径" fill="#0B58FF"></path> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 1.7 KiB | 
							
								
								
									
										14
									
								
								src/assets/icons/svg/Qian.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,14 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="16px" height="16px" viewBox="0 0 16 16" 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="设备监控-设备加工数量" transform="translate(-284.000000, -164.000000)" fill-rule="nonzero"> | ||||
|             <g id="编组-7" transform="translate(284.000000, 162.000000)"> | ||||
|                 <g id="菜单" transform="translate(0.000000, 2.000000)"> | ||||
|                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="16" height="16"></rect> | ||||
|                     <path d="M3.00057813,4.49926562 L13.0025156,4.49926562 C13.2786563,4.49926562 13.5025156,4.27540625 13.5025156,3.99926563 C13.5025156,3.723125 13.2786563,3.49926563 13.0025156,3.49926563 L3.00057813,3.49926563 C2.7244375,3.49926563 2.50057813,3.723125 2.50057813,3.99926563 C2.50057813,4.27540625 2.7244375,4.49926562 3.00057813,4.49926562 Z M3.0004375,8.48703125 L12.9786875,8.48703125 C13.2548281,8.48703125 13.4786875,8.26317187 13.4786875,7.98703125 C13.4786875,7.71089062 13.2548281,7.48703125 12.9786875,7.48703125 L3.0004375,7.48703125 C2.72429687,7.48703125 2.5004375,7.71089062 2.5004375,7.98703125 C2.5004375,8.26317187 2.72429687,8.48703125 3.0004375,8.48703125 Z M13.0025156,11.4969063 L3.00057813,11.4969063 C2.7244375,11.4969063 2.50057813,11.7207656 2.50057813,11.9969063 C2.50057813,12.2730469 2.7244375,12.4969063 3.00057813,12.4969063 L13.0025156,12.4969063 C13.2786563,12.4969063 13.5025156,12.2730469 13.5025156,11.9969063 C13.5025156,11.7207656 13.2786563,11.4969063 13.0025156,11.4969063 L13.0025156,11.4969063 Z" id="形状" fill="#373738"></path> | ||||
|                 </g> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 1.8 KiB | 
							
								
								
									
										15
									
								
								src/assets/icons/svg/changelogo.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,15 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||
|     <title>状态切换备份 3</title> | ||||
|     <g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||
|         <g id="icon和插图" transform="translate(-877.000000, -246.000000)"> | ||||
|             <g id="状态切换备份-3" transform="translate(885.000000, 254.000000) rotate(-270.000000) translate(-885.000000, -254.000000) translate(877.000000, 246.000000)"> | ||||
|                 <rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="15" height="15"></rect> | ||||
|                 <g id="错误" transform="translate(0.000000, 0.000000)" fill-rule="nonzero"> | ||||
|                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="6.4293957e-15" width="16" height="16"></rect> | ||||
|                     <path d="M8,1 C11.85,1 15,4.15 15,8 C15,11.85 11.85,15 8,15 C4.15,15 1,11.85 1,8 C1,4.15 4.15,1 8,1 Z M8,2.19926499 C4.80249503,2.19926499 2.18635461,4.80959575 2.18635461,8 C2.18635461,11.1904043 4.80249503,13.800735 8,13.800735 C11.197505,13.800735 13.8136454,11.1904043 13.8136454,8 C13.8136454,4.80959575 11.197505,2.19926499 8,2.19926499 Z M9.18342887,4.39602962 C9.42080763,4.39602962 9.61773566,4.56921978 9.65474747,4.7961346 L9.66099805,4.87359881 L9.66052938,9.97276858 L10.1621026,9.47231604 C10.3071657,9.32725295 10.5223305,9.29501672 10.6985498,9.37560733 L10.7713701,9.41705393 L10.837514,9.47231606 C11.0033004,9.63810246 11.0217211,9.89545015 10.8927761,10.0815835 L10.837514,10.1477274 L9.52115984,11.4640816 C9.38457467,11.600698 9.17913638,11.6415719 9.00066062,11.5676398 C8.84450229,11.5029526 8.73591407,11.3615296 8.71120699,11.1977853 L8.70585968,11.1264012 L8.70585968,4.87359881 C8.70585968,4.60984463 8.91967469,4.39602962 9.18342887,4.39602962 Z M6.99933939,4.43236016 C7.15549771,4.49704738 7.26408594,4.63847045 7.28879302,4.80221473 L7.29414032,4.87359881 L7.29414032,11.1264012 C7.29414032,11.2530604 7.24382515,11.374532 7.15426356,11.4640936 C7.06470196,11.5536552 6.94323037,11.6039704 6.81657114,11.6039704 C6.68991191,11.6039704 6.56844032,11.5536552 6.47887872,11.4640936 C6.40722945,11.3924443 6.36069788,11.3003726 6.34495123,11.2015604 L6.33900196,11.1264012 L6.33858601,6.02634681 L5.83789738,6.52768395 C5.69283427,6.67274705 5.47766955,6.70498329 5.30145018,6.62439268 L5.22862992,6.58294608 L5.162486,6.52768394 C4.9966996,6.36189754 4.97827889,6.10454984 5.10722387,5.91841648 L5.162486,5.85227257 L6.47884017,4.53591839 C6.61542534,4.39930202 6.82086362,4.35842813 6.99933939,4.43236016 Z" id="形状结合" fill="#0B58FF"></path> | ||||
|                 </g> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 2.7 KiB | 
							
								
								
									
										13
									
								
								src/assets/icons/svg/downArrow.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,13 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||
|     <title>收起箭头小备份 3</title> | ||||
|     <g id="能源管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||
|         <g id="能源监控-同比分析" transform="translate(-848.000000, -392.000000)" fill-rule="nonzero"> | ||||
|             <g id="收起箭头小备份-3" transform="translate(855.000000, 399.000000) scale(1, -1) translate(-855.000000, -399.000000) translate(848.000000, 392.000000)"> | ||||
|                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="14" height="14"></rect> | ||||
|                 <path d="M6.60391666,1.57197282 L7.01633334,1.15897282 L12.70325,6.8441395 C12.9278333,7.06872283 12.93075,7.4408895 12.70325,7.6683895 C12.5941655,7.77825546 12.4457769,7.84009206 12.2909546,7.84020155 C12.1361323,7.84031104 11.9876564,7.77868438 11.8784167,7.66897282 L7.0175,2.8103895 L2.16066666,7.66955616 C2.05160439,7.77930978 1.90326864,7.84102718 1.74854166,7.84102718 C1.59381468,7.84102718 1.44547894,7.77930978 1.33641666,7.66955616 C1.10964988,7.4415567 1.1091291,7.07336285 1.33525,6.84472282 L6.58116666,1.59647282 L6.6045,1.57255616 L6.60391666,1.57197282 Z" id="路径" fill="#FFBD02"></path> | ||||
|                 <path d="M6.60391666,6.57197282 L7.01633334,6.15897282 L12.70325,11.8441395 C12.9278333,12.0687228 12.93075,12.4408895 12.70325,12.6683895 C12.5941655,12.7782555 12.4457769,12.8400921 12.2909546,12.8402015 C12.1361323,12.840311 11.9876564,12.7786844 11.8784167,12.6689728 L7.0175,7.8103895 L2.16066666,12.6695562 C2.05160439,12.7793098 1.90326864,12.8410272 1.74854166,12.8410272 C1.59381468,12.8410272 1.44547894,12.7793098 1.33641666,12.6695562 C1.10964988,12.4415567 1.1091291,12.0733628 1.33525,11.8447228 L6.58116666,6.59647282 L6.6045,6.57255616 L6.60391666,6.57197282 Z" id="路径备份-2" fill="#FFBD02"></path> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 2.0 KiB | 
							
								
								
									
										12
									
								
								src/assets/icons/svg/downward.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,12 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="18px" height="18px" viewBox="0 0 18 18" 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="编组-43" transform="translate(-1870.000000, -119.000000)" fill-rule="nonzero"> | ||||
|             <g id="下拉展开" transform="translate(1870.000000, 119.000000)"> | ||||
|                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18"></rect> | ||||
|                 <path d="M9.79014922,13.2165873 L16.1721224,6.15356667 C16.6092925,5.77338351 16.6092925,5.16518371 16.1721224,4.78500055 C15.964758,4.60350795 15.6800768,4.50112918 15.3827707,4.50112918 C15.0854647,4.50112918 14.8007835,4.60350795 14.5934191,4.78500055 L9.00013482,11.162609 L3.40552499,4.78387137 C3.19816065,4.60237877 2.91347942,4.5 2.61617336,4.5 C2.3188673,4.5 2.03418606,4.60237877 1.82682172,4.78387137 C1.39105943,5.16454327 1.39105943,5.77176559 1.82682172,6.15243749 L8.20879489,13.214329 C8.31400161,13.3066969 8.440317,13.3797143 8.57994259,13.4288732 C8.99637706,13.5753327 9.475517,13.4912854 9.79014922,13.2165873 Z" id="路径" fill="#0B58FF"></path> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 1.3 KiB | 
							
								
								
									
										10
									
								
								src/assets/icons/svg/toggle.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,10 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||
|     <title>切换</title> | ||||
|     <g id="1班组管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||
|         <g id="切换" fill="#FFFFFF" fill-rule="nonzero"> | ||||
|             <rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect> | ||||
|             <path d="M14.5,9.15 C14.969442,9.15 15.35,9.53055796 15.35,10 C15.35,10.4333311 15.0257376,10.7909267 14.6066222,10.8433773 L14.5,10.85 L3.523,10.8493636 L5.10448737,12.4305126 C5.26177017,12.5877954 5.34716031,12.7990496 5.34764236,13.015701 L5.34074746,13.1242515 L5.31933966,13.2323523 C5.24258033,13.518822 5.01882201,13.7425803 4.73235229,13.8193397 C4.48169128,13.8865041 4.21633806,13.832194 4.01342676,13.6770775 L3.93051263,13.6044874 L1.04232939,10.7055042 C0.831903536,10.5688042 0.689345737,10.3541899 0.656994192,10.1075365 L0.65,10 L0.65778959,9.88152374 C0.670925502,9.77175364 0.705946489,9.66606949 0.76033092,9.57061601 L0.821076439,9.47880032 L0.894170559,9.39517056 C1.02591288,9.26342824 1.19742791,9.1808136 1.37731459,9.15882561 L1.5,9.15 L14.5,9.15 Z M11.9865732,2.32292254 L12.0694874,2.39551263 L14.9508862,5.29019827 C15.1653597,5.42263107 15.3074642,5.64305498 15.3419246,5.89182346 L15.35,6 L15.3417548,6.1198336 C15.3282251,6.22918814 15.2930578,6.33441548 15.2387207,6.42946868 L15.1780851,6.52090655 L15.1052179,6.60421789 C14.9738843,6.73555151 14.8030912,6.81820523 14.622959,6.840766 L14.5,6.85 L1.5,6.85 C1.03055796,6.85 0.65,6.46944204 0.65,6 C0.65,5.56666889 0.974262406,5.20907332 1.39337781,5.15662271 L1.5,5.15 L12.475,5.14936355 L10.8955126,3.56948738 C10.7382298,3.41220459 10.6528397,3.20095039 10.6523576,2.98429905 L10.6592525,2.8757485 L10.6806603,2.76764771 C10.7478247,2.5169867 10.9275353,2.31433911 11.1633258,2.21617103 L11.2676477,2.18066033 C11.5183087,2.11349592 11.7836619,2.167806 11.9865732,2.32292254 Z" id="形状结合"></path> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 2.0 KiB | 
							
								
								
									
										13
									
								
								src/assets/icons/svg/upArrow.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,13 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||||
|     <title>收起箭头小备份 11</title> | ||||
|     <g id="能源管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||||
|         <g id="能源监控-同比分析" transform="translate(-848.000000, -269.000000)" fill-rule="nonzero"> | ||||
|             <g id="收起箭头小备份-11" transform="translate(848.000000, 269.000000)"> | ||||
|                 <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="14" height="14"></rect> | ||||
|                 <path d="M6.60391666,1.57197282 L7.01633334,1.15897282 L12.70325,6.8441395 C12.9278333,7.06872283 12.93075,7.4408895 12.70325,7.6683895 C12.5941655,7.77825546 12.4457769,7.84009206 12.2909546,7.84020155 C12.1361323,7.84031104 11.9876564,7.77868438 11.8784167,7.66897282 L7.0175,2.8103895 L2.16066666,7.66955616 C2.05160439,7.77930978 1.90326864,7.84102718 1.74854166,7.84102718 C1.59381468,7.84102718 1.44547894,7.77930978 1.33641666,7.66955616 C1.10964988,7.4415567 1.1091291,7.07336285 1.33525,6.84472282 L6.58116666,1.59647282 L6.6045,1.57255616 L6.60391666,1.57197282 Z" id="路径" fill="#37D97F"></path> | ||||
|                 <path d="M6.60391666,6.57197282 L7.01633334,6.15897282 L12.70325,11.8441395 C12.9278333,12.0687228 12.93075,12.4408895 12.70325,12.6683895 C12.5941655,12.7782555 12.4457769,12.8400921 12.2909546,12.8402015 C12.1361323,12.840311 11.9876564,12.7786844 11.8784167,12.6689728 L7.0175,7.8103895 L2.16066666,12.6695562 C2.05160439,12.7793098 1.90326864,12.8410272 1.74854166,12.8410272 C1.59381468,12.8410272 1.44547894,12.7793098 1.33641666,12.6695562 C1.10964988,12.4415567 1.1091291,12.0733628 1.33525,11.8447228 L6.58116666,6.59647282 L6.6045,6.57255616 L6.60391666,6.57197282 Z" id="路径备份-2" fill="#37D97F"></path> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 1.9 KiB | 
							
								
								
									
										14
									
								
								src/assets/icons/svg/upward.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,14 @@ | ||||
| <?xml version="1.0" encoding="UTF-8"?> | ||||
| <svg width="18px" height="18px" viewBox="0 0 18 18" 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="编组-43" transform="translate(-1870.000000, -485.000000)" fill-rule="nonzero"> | ||||
|             <g id="编组-18备份" transform="translate(1.000000, 366.000000)"> | ||||
|                 <g id="收起" transform="translate(1878.000000, 128.000000) scale(1, -1) translate(-1878.000000, -128.000000) translate(1869.000000, 119.000000)"> | ||||
|                     <rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="18" height="18"></rect> | ||||
|                     <path d="M9.79014922,13.2165873 L16.1721224,6.15356667 C16.6092925,5.77338351 16.6092925,5.16518371 16.1721224,4.78500055 C15.964758,4.60350795 15.6800768,4.50112918 15.3827707,4.50112918 C15.0854647,4.50112918 14.8007835,4.60350795 14.5934191,4.78500055 L9.00013482,11.162609 L3.40552499,4.78387137 C3.19816065,4.60237877 2.91347942,4.5 2.61617336,4.5 C2.3188673,4.5 2.03418606,4.60237877 1.82682172,4.78387137 C1.39105943,5.16454327 1.39105943,5.77176559 1.82682172,6.15243749 L8.20879489,13.214329 C8.31400161,13.3066969 8.440317,13.3797143 8.57994259,13.4288732 C8.99637706,13.5753327 9.475517,13.4912854 9.79014922,13.2165873 Z" id="路径" fill="#0B58FF"></path> | ||||
|                 </g> | ||||
|             </g> | ||||
|         </g> | ||||
|     </g> | ||||
| </svg> | ||||
| After Width: | Height: | Size: 1.5 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/DataBoard.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 10 MiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/Qian.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 612 B | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/default-file-icon.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 1.6 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/factory-icon.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 710 B | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/no-data-bg.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 205 KiB | 
| @@ -1 +1 @@ | ||||
| <svg t="1627279997305" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11904" width="40" height="40"><path d="M938.7008 669.525333L938.7008 249.412267c0-90.555733-73.5232-164.078933-164.1472-164.078933L249.378133 85.333333c-90.555733 0-164.078933 73.48906699-164.078933 164.078933l0 525.2096c0 90.555733 73.454933 164.078933 164.07893301 164.078933l525.20959999 0c80.725333 0 147.8656-58.368 161.553067-135.099733-43.52-18.8416-232.106667-100.283733-330.376533-147.182933-74.786133 90.589867-153.088 144.930133-271.121067 144.930133s-196.81279999-72.704-187.357867-161.655467c6.2464-58.402133 46.2848-153.9072 220.296533-137.5232 91.682133 8.6016 133.666133 25.736533 208.418133 50.414933 19.3536-35.4304 35.4304-74.513067 47.616-116.0192L292.0448 436.565333l0-32.8704 164.0448 0 0-58.9824L256 344.712533l1e-8-36.181333 200.12373299 0L456.123733 223.3344c0 0 1.809067-13.312 16.520533-13.31200001l82.056533 1e-8 0 98.474667 213.333333 0 0 36.181333-213.333333 1e-8 0 58.98239999 174.045867 0c-16.00853301 65.1264-40.277333 124.962133-70.690133 177.220267C708.608 599.176533 938.7008 669.525333 938.7008 669.525333L938.7008 669.525333 938.7008 669.525333 938.7008 669.525333zM321.57013299 744.994133c-124.7232 0-144.452267-78.7456-137.83039999-111.65013299 6.5536-32.733867 42.666667-75.502933 112.0256-75.50293301 79.6672 0 151.04 20.445867 236.714667 62.088533C472.302933 698.333867 398.370133 744.994133 321.57013299 744.994133L321.57013299 744.994133 321.57013299 744.994133zM321.57013299 744.994133" fill="#1296db" p-id="11905"></path></svg> | ||||
| <svg t="1627279997305" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11904" width="40" height="40"><path d="M938.7008 669.525333L938.7008 249.412267c0-90.555733-73.5232-164.078933-164.1472-164.078933L249.378133 85.333333c-90.555733 0-164.078933 73.48906699-164.078933 164.078933l0 525.2096c0 90.555733 73.454933 164.078933 164.07893301 164.078933l525.20959999 0c80.725333 0 147.8656-58.368 161.553067-135.099733-43.52-18.8416-232.106667-100.283733-330.376533-147.182933-74.786133 90.589867-153.088 144.930133-271.121067 144.930133s-196.81279999-72.704-187.357867-161.655467c6.2464-58.402133 46.2848-153.9072 220.296533-137.5232 91.682133 8.6016 133.666133 25.736533 208.418133 50.414933 19.3536-35.4304 35.4304-74.513067 47.616-116.0192L292.0448 436.565333l0-32.8704 164.0448 0 0-58.9824L256 344.712533l1e-8-36.181333 200.12373299 0L456.123733 223.3344c0 0 1.809067-13.312 16.520533-13.31200001l82.056533 1e-8 0 98.474667 213.333333 0 0 36.181333-213.333333 1e-8 0 58.98239999 174.045867 0c-16.00853301 65.1264-40.277333 124.962133-70.690133 177.220267C708.608 599.176533 938.7008 669.525333 938.7008 669.525333L938.7008 669.525333 938.7008 669.525333 938.7008 669.525333zM321.57013299 744.994133c-124.7232 0-144.452267-78.7456-137.83039999-111.65013299 6.5536-32.733867 42.666667-75.502933 112.0256-75.50293301 79.6672 0 151.04 20.445867 236.714667 62.088533C472.302933 698.333867 398.370133 744.994133 321.57013299 744.994133L321.57013299 744.994133 321.57013299 744.994133zM321.57013299 744.994133" fill="#1296db" p-id="11905"></path></svg> | ||||
|   | ||||
| Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/tree-icon-1.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 2.0 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/tree-icon-2.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 3.2 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						| After Width: | Height: | Size: 944 B | 
| @@ -6,182 +6,217 @@ | ||||
| @import './btn.scss'; | ||||
|  | ||||
| body { | ||||
|   height: 100%; | ||||
|   -moz-osx-font-smoothing: grayscale; | ||||
|   -webkit-font-smoothing: antialiased; | ||||
|   text-rendering: optimizeLegibility; | ||||
|   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; | ||||
| 	height: 100%; | ||||
| 	-moz-osx-font-smoothing: grayscale; | ||||
| 	-webkit-font-smoothing: antialiased; | ||||
| 	text-rendering: optimizeLegibility; | ||||
| 	font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, | ||||
| 		Microsoft YaHei, Arial, sans-serif; | ||||
| } | ||||
|  | ||||
| label { | ||||
|   font-weight: 700; | ||||
| // label { | ||||
| //   font-weight: 700; | ||||
| // } | ||||
| .searchBarBox .el-form-item--medium .el-form-item__label { | ||||
|   line-height: 40px; | ||||
| } | ||||
| .searchBarBox .el-form-item--medium .el-form-item__content { | ||||
|   line-height: 40px; | ||||
| } | ||||
| .searchBarBox .el-range-editor--small.el-input__inner { | ||||
|   height: 34px; | ||||
| } | ||||
|  | ||||
| html { | ||||
|   height: 100%; | ||||
|   box-sizing: border-box; | ||||
| 	height: 100%; | ||||
| 	box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| #app { | ||||
|   height: 100%; | ||||
| 	height: 100%; | ||||
| } | ||||
|  | ||||
| *, | ||||
| *:before, | ||||
| *:after { | ||||
|   box-sizing: inherit; | ||||
| 	box-sizing: inherit; | ||||
| } | ||||
|  | ||||
| .no-padding { | ||||
|   padding: 0px !important; | ||||
| 	padding: 0px !important; | ||||
| } | ||||
|  | ||||
| .padding-content { | ||||
|   padding: 4px 0; | ||||
| 	padding: 4px 0; | ||||
| } | ||||
|  | ||||
| a:focus, | ||||
| a:active { | ||||
|   outline: none; | ||||
| 	outline: none; | ||||
| } | ||||
|  | ||||
| a, | ||||
| a:focus, | ||||
| a:hover { | ||||
|   cursor: pointer; | ||||
|   color: inherit; | ||||
|   text-decoration: none; | ||||
| 	cursor: pointer; | ||||
| 	color: inherit; | ||||
| 	text-decoration: none; | ||||
| } | ||||
|  | ||||
| div:focus { | ||||
|   outline: none; | ||||
| 	outline: none; | ||||
| } | ||||
|  | ||||
| .fr { | ||||
|   float: right; | ||||
| 	float: right; | ||||
| } | ||||
|  | ||||
| .fl { | ||||
|   float: left; | ||||
| 	float: left; | ||||
| } | ||||
|  | ||||
| .pr-5 { | ||||
|   padding-right: 5px; | ||||
| 	padding-right: 5px; | ||||
| } | ||||
|  | ||||
| .pl-5 { | ||||
|   padding-left: 5px; | ||||
| 	padding-left: 5px; | ||||
| } | ||||
|  | ||||
| .block { | ||||
|   display: block; | ||||
| 	display: block; | ||||
| } | ||||
|  | ||||
| .pointer { | ||||
|   cursor: pointer; | ||||
| 	cursor: pointer; | ||||
| } | ||||
|  | ||||
| .inlineBlock { | ||||
|   display: block; | ||||
| 	display: block; | ||||
| } | ||||
|  | ||||
| .clearfix { | ||||
|   &:after { | ||||
|     visibility: hidden; | ||||
|     display: block; | ||||
|     font-size: 0; | ||||
|     content: " "; | ||||
|     clear: both; | ||||
|     height: 0; | ||||
|   } | ||||
| 	&:after { | ||||
| 		visibility: hidden; | ||||
| 		display: block; | ||||
| 		font-size: 0; | ||||
| 		content: ' '; | ||||
| 		clear: both; | ||||
| 		height: 0; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| aside { | ||||
|   background: #eef1f6; | ||||
|   padding: 8px 24px; | ||||
|   margin-bottom: 20px; | ||||
|   border-radius: 2px; | ||||
|   display: block; | ||||
|   line-height: 32px; | ||||
|   font-size: 16px; | ||||
|   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; | ||||
|   color: #2c3e50; | ||||
|   -webkit-font-smoothing: antialiased; | ||||
|   -moz-osx-font-smoothing: grayscale; | ||||
| 	background: #eef1f6; | ||||
| 	padding: 8px 24px; | ||||
| 	margin-bottom: 20px; | ||||
| 	border-radius: 2px; | ||||
| 	display: block; | ||||
| 	line-height: 32px; | ||||
| 	font-size: 16px; | ||||
| 	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, | ||||
| 		Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif; | ||||
| 	color: #2c3e50; | ||||
| 	-webkit-font-smoothing: antialiased; | ||||
| 	-moz-osx-font-smoothing: grayscale; | ||||
|  | ||||
|   a { | ||||
|     color: #337ab7; | ||||
|     cursor: pointer; | ||||
| 	a { | ||||
| 		color: #337ab7; | ||||
| 		cursor: pointer; | ||||
|  | ||||
|     &:hover { | ||||
|       color: rgb(32, 160, 255); | ||||
|     } | ||||
|   } | ||||
| 		&:hover { | ||||
| 			color: rgb(32, 160, 255); | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
|  | ||||
| //main-container全局样式 | ||||
| .app-container { | ||||
|   padding: 16px; | ||||
| 	padding: 16px; | ||||
| } | ||||
|  | ||||
| .components-container { | ||||
|   margin: 30px 50px; | ||||
|   position: relative; | ||||
| 	margin: 30px 50px; | ||||
| 	position: relative; | ||||
| } | ||||
|  | ||||
| .text-center { | ||||
|   text-align: center | ||||
| 	text-align: center; | ||||
| } | ||||
|  | ||||
| .sub-navbar { | ||||
|   height: 50px; | ||||
|   line-height: 50px; | ||||
|   position: relative; | ||||
|   width: 100%; | ||||
|   text-align: right; | ||||
|   padding-right: 20px; | ||||
|   transition: 600ms ease position; | ||||
|   background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%); | ||||
| 	height: 50px; | ||||
| 	line-height: 50px; | ||||
| 	position: relative; | ||||
| 	width: 100%; | ||||
| 	text-align: right; | ||||
| 	padding-right: 20px; | ||||
| 	transition: 600ms ease position; | ||||
| 	background: linear-gradient( | ||||
| 		90deg, | ||||
| 		rgba(32, 182, 249, 1) 0%, | ||||
| 		rgba(32, 182, 249, 1) 0%, | ||||
| 		rgba(33, 120, 241, 1) 100%, | ||||
| 		rgba(33, 120, 241, 1) 100% | ||||
| 	); | ||||
|  | ||||
|   .subtitle { | ||||
|     font-size: 20px; | ||||
|     color: #fff; | ||||
|   } | ||||
| 	.subtitle { | ||||
| 		font-size: 20px; | ||||
| 		color: #fff; | ||||
| 	} | ||||
|  | ||||
|   &.draft { | ||||
|     background: #d0d0d0; | ||||
|   } | ||||
| 	&.draft { | ||||
| 		background: #d0d0d0; | ||||
| 	} | ||||
|  | ||||
|   &.deleted { | ||||
|     background: #d0d0d0; | ||||
|   } | ||||
| 	&.deleted { | ||||
| 		background: #d0d0d0; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .link-type, | ||||
| .link-type:focus { | ||||
|   color: #337ab7; | ||||
|   cursor: pointer; | ||||
| 	color: #337ab7; | ||||
| 	cursor: pointer; | ||||
|  | ||||
|   &:hover { | ||||
|     color: rgb(32, 160, 255); | ||||
|   } | ||||
| 	&:hover { | ||||
| 		color: rgb(32, 160, 255); | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .filter-container { | ||||
|   padding-bottom: 10px; | ||||
| 	padding-bottom: 10px; | ||||
|  | ||||
|   .filter-item { | ||||
|     display: inline-block; | ||||
|     vertical-align: middle; | ||||
|     margin-bottom: 10px; | ||||
|   } | ||||
| 	.filter-item { | ||||
| 		display: inline-block; | ||||
| 		vertical-align: middle; | ||||
| 		margin-bottom: 10px; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| //refine vue-multiselect plugin | ||||
| .multiselect { | ||||
|   line-height: 16px; | ||||
| 	line-height: 16px; | ||||
| } | ||||
|  | ||||
| .multiselect--active { | ||||
|   z-index: 1000 !important; | ||||
| 	z-index: 1000 !important; | ||||
| } | ||||
|  | ||||
| .no-data-bg { | ||||
| 	height: 240px; | ||||
| 	background: url(../images/no-data-bg.png) 50% 100% / contain | ||||
| 		no-repeat; | ||||
| 	position: relative; | ||||
|  | ||||
| 	&::after { | ||||
| 		content: '暂无数据'; | ||||
| 		position: absolute; | ||||
| 		bottom: 12px; | ||||
| 		left: 50%; | ||||
| 		transform: translateX(-50%); | ||||
| 		color: #ccc; | ||||
| 		font-size: 18px; | ||||
| 		letter-spacing: 1px; | ||||
| 	} | ||||
| } | ||||
|   | ||||
| @@ -5,110 +5,123 @@ | ||||
|  | ||||
| /** 基础通用 **/ | ||||
| .pt5 { | ||||
|   padding-top: 5px; | ||||
| 	padding-top: 5px; | ||||
| } | ||||
| .pr5 { | ||||
|   padding-right: 5px; | ||||
| 	padding-right: 5px; | ||||
| } | ||||
| .pb5 { | ||||
|   padding-bottom: 5px; | ||||
| 	padding-bottom: 5px; | ||||
| } | ||||
| .mt5 { | ||||
|   margin-top: 5px; | ||||
| 	margin-top: 5px; | ||||
| } | ||||
| .mr5 { | ||||
|   margin-right: 5px; | ||||
| 	margin-right: 5px; | ||||
| } | ||||
| .mb5 { | ||||
|   margin-bottom: 5px; | ||||
| 	margin-bottom: 5px; | ||||
| } | ||||
| .mb8 { | ||||
|   margin-bottom: 8px; | ||||
| 	margin-bottom: 8px; | ||||
| } | ||||
| .ml5 { | ||||
|   margin-left: 5px; | ||||
| 	margin-left: 5px; | ||||
| } | ||||
| .mt10 { | ||||
|   margin-top: 10px; | ||||
| 	margin-top: 10px; | ||||
| } | ||||
| .mr10 { | ||||
|   margin-right: 10px; | ||||
| 	margin-right: 10px; | ||||
| } | ||||
| .mb10 { | ||||
|   margin-bottom: 10px; | ||||
| 	margin-bottom: 10px; | ||||
| } | ||||
| .ml10 { | ||||
|   margin-left: 10px; | ||||
| 	margin-left: 10px; | ||||
| } | ||||
| .mt20 { | ||||
|   margin-top: 20px; | ||||
| 	margin-top: 20px; | ||||
| } | ||||
| .mr20 { | ||||
|   margin-right: 20px; | ||||
| 	margin-right: 20px; | ||||
| } | ||||
| .mb20 { | ||||
|   margin-bottom: 20px; | ||||
| 	margin-bottom: 20px; | ||||
| } | ||||
| .ml20 { | ||||
|   margin-left: 20px; | ||||
| 	margin-left: 20px; | ||||
| } | ||||
|  | ||||
| .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { | ||||
|   font-family: inherit; | ||||
|   font-weight: 500; | ||||
|   line-height: 1.1; | ||||
|   color: inherit; | ||||
| .h1, | ||||
| .h2, | ||||
| .h3, | ||||
| .h4, | ||||
| .h5, | ||||
| .h6, | ||||
| h1, | ||||
| h2, | ||||
| h3, | ||||
| h4, | ||||
| h5, | ||||
| h6 { | ||||
| 	font-family: inherit; | ||||
| 	font-weight: 500; | ||||
| 	line-height: 1.1; | ||||
| 	color: inherit; | ||||
| } | ||||
|  | ||||
| .el-message-box__status + .el-message-box__message{ | ||||
|   word-break: break-word; | ||||
| .el-message-box__status + .el-message-box__message { | ||||
| 	word-break: break-word; | ||||
| } | ||||
|  | ||||
| .el-dialog:not(.is-fullscreen) { | ||||
|   margin-top: 6vh !important; | ||||
| 	// margin-top: 6vh !important; | ||||
| 	margin-top: 12vh !important; | ||||
| } | ||||
|  | ||||
| .el-dialog__wrapper.scrollbar .el-dialog .el-dialog__body { | ||||
|   overflow: auto; | ||||
|   overflow-x: hidden; | ||||
|   max-height: 70vh; | ||||
|   padding: 10px 20px 0; | ||||
| 	overflow: auto; | ||||
| 	overflow-x: hidden; | ||||
| 	max-height: 70vh; | ||||
| 	padding: 10px 20px 0; | ||||
| } | ||||
|  | ||||
| .el-dialog{ | ||||
|   display: flex; | ||||
|   flex-direction: column; | ||||
|   max-width: calc(100% - 30px); | ||||
|   max-height: calc(100% - 70px); | ||||
|   .el-dialog__body { | ||||
|     overflow: auto; | ||||
|   } | ||||
| .el-dialog { | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	max-width: calc(100% - 30px); | ||||
| 	max-height: calc(100% - 70px); | ||||
| 	.el-dialog__body { | ||||
| 		overflow: auto; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .el-table { | ||||
|   .el-table__header-wrapper, .el-table__fixed-header-wrapper { | ||||
|     th { | ||||
|       word-break: break-word; | ||||
|       background-color: #f8f8f9; | ||||
|       color: #515a6e; | ||||
|       height: 40px; | ||||
|       font-size: 13px; | ||||
|     } | ||||
|   } | ||||
|   .el-table__body-wrapper { | ||||
|     .el-button [class*="el-icon-"] + span { | ||||
|       margin-left: 1px; | ||||
|     } | ||||
|   } | ||||
| 	.el-table__header-wrapper, | ||||
| 	.el-table__fixed-header-wrapper { | ||||
| 		th { | ||||
| 			word-break: break-word; | ||||
| 			background-color: #f8f8f9; | ||||
| 			color: #515a6e; | ||||
| 			height: 40px; | ||||
| 			font-size: 13px; | ||||
| 		} | ||||
| 	} | ||||
| 	.el-table__body-wrapper { | ||||
| 		.el-button [class*='el-icon-'] + span { | ||||
| 			margin-left: 1px; | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
|  | ||||
| /** 表单布局 **/ | ||||
| .form-header { | ||||
|   font-size:15px; | ||||
|   color:#6379bb; | ||||
|   border-bottom:1px solid #ddd; | ||||
|   margin:8px 10px 25px 10px; | ||||
|   padding-bottom:5px | ||||
| 	font-size: 15px; | ||||
| 	color: #6379bb; | ||||
| 	border-bottom: 1px solid #ddd; | ||||
| 	margin: 8px 10px 25px 10px; | ||||
| 	padding-bottom: 5px; | ||||
| } | ||||
|  | ||||
| /** 表格布局 **/ | ||||
| @@ -122,169 +135,171 @@ | ||||
|  | ||||
| /* tree border */ | ||||
| .tree-border { | ||||
|   margin-top: 5px; | ||||
|   border: 1px solid #e5e6e7; | ||||
|   background: #FFFFFF none; | ||||
|   border-radius:4px; | ||||
| 	margin-top: 5px; | ||||
| 	border: 1px solid #e5e6e7; | ||||
| 	background: #ffffff none; | ||||
| 	border-radius: 4px; | ||||
| } | ||||
|  | ||||
| .pagination-container .el-pagination { | ||||
|   right: 0; | ||||
|   position: absolute; | ||||
| 	right: 0; | ||||
| 	position: absolute; | ||||
| } | ||||
|  | ||||
| @media ( max-width : 768px) { | ||||
|   .pagination-container .el-pagination > .el-pagination__jump { | ||||
|     display: none !important; | ||||
|   } | ||||
|   .pagination-container .el-pagination > .el-pagination__sizes { | ||||
|     display: none !important; | ||||
|   } | ||||
| @media (max-width: 768px) { | ||||
| 	.pagination-container .el-pagination > .el-pagination__jump { | ||||
| 		display: none !important; | ||||
| 	} | ||||
| 	.pagination-container .el-pagination > .el-pagination__sizes { | ||||
| 		display: none !important; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .el-table .fixed-width .el-button--mini { | ||||
|   padding-left: 0; | ||||
|   padding-right: 0; | ||||
|   width: inherit; | ||||
| 	padding-left: 0; | ||||
| 	padding-right: 0; | ||||
| 	width: inherit; | ||||
| } | ||||
|  | ||||
| /** 表格更多操作下拉样式 */ | ||||
| .el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine { | ||||
|   cursor: pointer; | ||||
|   margin-left: 5px; | ||||
| .el-table .el-dropdown-link, | ||||
| .el-table .el-dropdown-selfdefine { | ||||
| 	cursor: pointer; | ||||
| 	margin-left: 5px; | ||||
| } | ||||
|  | ||||
| .el-table .el-dropdown, .el-icon-arrow-down { | ||||
|   font-size: 12px; | ||||
| .el-table .el-dropdown, | ||||
| .el-icon-arrow-down { | ||||
| 	font-size: 12px; | ||||
| } | ||||
|  | ||||
| .el-tree-node__content > .el-checkbox { | ||||
|   margin-right: 8px; | ||||
| 	margin-right: 8px; | ||||
| } | ||||
|  | ||||
| .list-group-striped > .list-group-item { | ||||
|   border-left: 0; | ||||
|   border-right: 0; | ||||
|   border-radius: 0; | ||||
|   padding-left: 0; | ||||
|   padding-right: 0; | ||||
| 	border-left: 0; | ||||
| 	border-right: 0; | ||||
| 	border-radius: 0; | ||||
| 	padding-left: 0; | ||||
| 	padding-right: 0; | ||||
|  | ||||
|   &:not(:last-child) { | ||||
|     border-bottom: 1px solid #e7eaec; | ||||
|   } | ||||
| 	&:not(:last-child) { | ||||
| 		border-bottom: 1px solid #e7eaec; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .list-group { | ||||
|   padding-left: 0px; | ||||
|   list-style: none; | ||||
| 	padding-left: 0px; | ||||
| 	list-style: none; | ||||
| } | ||||
|  | ||||
| .list-group-item { | ||||
|   // border-bottom: 1px solid #e7eaec; | ||||
|   // border-top: 1px solid #e7eaec; | ||||
|   margin-bottom: -1px; | ||||
|   padding: 11px 0px; | ||||
|   font-size: 13px; | ||||
| 	// border-bottom: 1px solid #e7eaec; | ||||
| 	// border-top: 1px solid #e7eaec; | ||||
| 	margin-bottom: -1px; | ||||
| 	padding: 11px 0px; | ||||
| 	font-size: 13px; | ||||
| } | ||||
|  | ||||
| .pull-right { | ||||
|   float: right !important; | ||||
| 	float: right !important; | ||||
| } | ||||
|  | ||||
| .el-card__header { | ||||
|   padding: 14px 15px 7px; | ||||
|   min-height: 40px; | ||||
| 	padding: 14px 15px 7px; | ||||
| 	min-height: 40px; | ||||
| } | ||||
|  | ||||
| .el-card__body { | ||||
|   padding: 15px 20px 20px 20px; | ||||
| 	padding: 15px 20px 20px 20px; | ||||
| } | ||||
|  | ||||
| .card-box { | ||||
|   padding-right: 15px; | ||||
|   padding-left: 15px; | ||||
|   margin-bottom: 10px; | ||||
| 	padding-right: 15px; | ||||
| 	padding-left: 15px; | ||||
| 	margin-bottom: 10px; | ||||
| } | ||||
|  | ||||
| /* button color */ | ||||
| .el-button--cyan.is-active, | ||||
| .el-button--cyan:active { | ||||
|   background: #20B2AA; | ||||
|   border-color: #20B2AA; | ||||
|   color: #FFFFFF; | ||||
| 	background: #20b2aa; | ||||
| 	border-color: #20b2aa; | ||||
| 	color: #ffffff; | ||||
| } | ||||
|  | ||||
| .el-button--cyan:focus, | ||||
| .el-button--cyan:hover { | ||||
|   background: #48D1CC; | ||||
|   border-color: #48D1CC; | ||||
|   color: #FFFFFF; | ||||
| 	background: #48d1cc; | ||||
| 	border-color: #48d1cc; | ||||
| 	color: #ffffff; | ||||
| } | ||||
|  | ||||
| .el-button--cyan { | ||||
|   background-color: #20B2AA; | ||||
|   border-color: #20B2AA; | ||||
|   color: #FFFFFF; | ||||
| 	background-color: #20b2aa; | ||||
| 	border-color: #20b2aa; | ||||
| 	color: #ffffff; | ||||
| } | ||||
|  | ||||
| /* text color */ | ||||
| .text-navy { | ||||
|   color: #1ab394; | ||||
| 	color: #1ab394; | ||||
| } | ||||
|  | ||||
| .text-primary { | ||||
|   color: inherit; | ||||
| 	color: inherit; | ||||
| } | ||||
|  | ||||
| .text-success { | ||||
|   color: #1c84c6; | ||||
| 	color: #1c84c6; | ||||
| } | ||||
|  | ||||
| .text-info { | ||||
|   color: #23c6c8; | ||||
| 	color: #23c6c8; | ||||
| } | ||||
|  | ||||
| .text-warning { | ||||
|   color: #f8ac59; | ||||
| 	color: #f8ac59; | ||||
| } | ||||
|  | ||||
| .text-danger { | ||||
|   color: #ed5565; | ||||
| 	color: #ed5565; | ||||
| } | ||||
|  | ||||
| .text-muted { | ||||
|   color: #888888; | ||||
| 	color: #888888; | ||||
| } | ||||
|  | ||||
| /* image */ | ||||
| .img-circle { | ||||
|   border-radius: 50%; | ||||
| 	border-radius: 50%; | ||||
| } | ||||
|  | ||||
| .img-lg { | ||||
|   width: 120px; | ||||
|   height: 120px; | ||||
| 	width: 120px; | ||||
| 	height: 120px; | ||||
| } | ||||
|  | ||||
| .avatar-upload-preview { | ||||
|   position: absolute; | ||||
|   top: 50%; | ||||
|   transform: translate(50%, -50%); | ||||
|   width: 200px; | ||||
|   height: 200px; | ||||
|   border-radius: 50%; | ||||
|   box-shadow: 0 0 4px #ccc; | ||||
|   overflow: hidden; | ||||
| 	position: absolute; | ||||
| 	top: 50%; | ||||
| 	transform: translate(50%, -50%); | ||||
| 	width: 200px; | ||||
| 	height: 200px; | ||||
| 	border-radius: 50%; | ||||
| 	box-shadow: 0 0 4px #ccc; | ||||
| 	overflow: hidden; | ||||
| } | ||||
|  | ||||
| /* 拖拽列样式 */ | ||||
| .sortable-ghost{ | ||||
|   opacity: .8; | ||||
|   color: #fff!important; | ||||
|   background: #42b983!important; | ||||
| .sortable-ghost { | ||||
| 	opacity: 0.8; | ||||
| 	color: #fff !important; | ||||
| 	background: #42b983 !important; | ||||
| } | ||||
|  | ||||
| .top-right-btn { | ||||
|   position: relative; | ||||
|   float: right; | ||||
| 	position: relative; | ||||
| 	float: right; | ||||
| } | ||||
|   | ||||
| @@ -10,6 +10,8 @@ | ||||
| 		ref="form" | ||||
| 		:model="form" | ||||
| 		:label-width="`${labelWidth}px`" | ||||
| 		:size="size" | ||||
| 		:label-position="labelPosition" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex"> | ||||
| 			<el-col v-for="col in row" :key="col.label" :span="24 / row.length"> | ||||
| @@ -46,28 +48,54 @@ | ||||
| 						:placeholder="`请选择${col.label}`" | ||||
| 						value-format="timestamp" | ||||
| 						v-bind="col.bind"></el-date-picker> | ||||
| 					<el-upload | ||||
| 						class="upload-in-dialog" | ||||
| 						v-if="col.upload" | ||||
| 						:file-list="uploadedFileList" | ||||
| 						:action="col.url" | ||||
| 						:on-success="handleUploadSuccess" | ||||
| 						v-bind="col.bind"> | ||||
| 						<el-button | ||||
| 							size="small" | ||||
| 							type="primary" | ||||
| 							:disabled="col.bind?.disabled || false"> | ||||
| 							点击上传 | ||||
| 						</el-button> | ||||
| 						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips"> | ||||
| 							{{ col.uploadTips || '只能上传jpg/png文件,大小不超过2MB' }} | ||||
| 						</div> | ||||
| 					</el-upload> | ||||
| 					<el-switch | ||||
| 						v-if="col.switch" | ||||
| 						v-model="form[col.prop]" | ||||
| 						active-color="#0b58ff" | ||||
| 						inactive-color="#e1e1e1" | ||||
| 						v-bind="col.bind"></el-switch> | ||||
| 					<component | ||||
| 						v-if="col.subcomponent" | ||||
| 						:key="col.key" | ||||
| 						:is="col.subcomponent" | ||||
| 						:inlineStyle="col.style"></component> | ||||
|  | ||||
| 					<div | ||||
| 						class="upload-area" | ||||
| 						:class="uploadOpen ? '' : 'height-48'" | ||||
| 						ref="uploadArea" | ||||
| 						v-if="col.upload"> | ||||
| 						<span class="close-icon" :class="uploadOpen ? 'open' : ''"> | ||||
| 							<el-button | ||||
| 								type="text" | ||||
| 								icon="el-icon-arrow-right" | ||||
| 								@click="handleFilesOpen" /> | ||||
| 						</span> | ||||
| 						<!-- :file-list="uploadedFileList" --> | ||||
| 						<el-upload | ||||
| 							class="upload-in-dialog" | ||||
| 							v-if="col.upload" | ||||
| 							:action="uploadUrl" | ||||
| 							:headers="uploadHeaders" | ||||
| 							:show-file-list="false" | ||||
| 							icon="el-icon-upload2" | ||||
| 							:before-upload="beforeUpload" | ||||
| 							:on-success="handleUploadSuccess" | ||||
| 							v-bind="col.bind"> | ||||
| 							<el-button size="mini" :disabled="col.bind?.disabled || false"> | ||||
| 								上传文件 | ||||
| 							</el-button> | ||||
| 							<div class="el-upload__tip" slot="tip" v-if="col.uploadTips"> | ||||
| 								{{ col.uploadTips || '只能上传jpg/png文件, 大小不超过2MB' }} | ||||
| 							</div> | ||||
| 						</el-upload> | ||||
|  | ||||
| 						<uploadedFile | ||||
| 							class="file" | ||||
| 							v-for="file in form[col.prop] || []" | ||||
| 							:file="file" | ||||
| 							@delete="handleDeleteFile(file)" /> | ||||
| 					</div> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| @@ -75,6 +103,9 @@ | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| import tupleImg from '@/assets/images/tuple.png'; | ||||
|  | ||||
| /** | ||||
|  * 找到最长的label | ||||
|  * @param {*} options | ||||
| @@ -83,6 +114,8 @@ function findMaxLabelWidth(rows) { | ||||
| 	let max = 0; | ||||
| 	rows.forEach((row) => { | ||||
| 		row.forEach((opt) => { | ||||
| 			// debugger; | ||||
| 			if (!opt.label) return 0; | ||||
| 			if (opt.label.length > max) { | ||||
| 				max = opt.label.length; | ||||
| 			} | ||||
| @@ -91,6 +124,48 @@ function findMaxLabelWidth(rows) { | ||||
| 	return max; | ||||
| } | ||||
|  | ||||
| const uploadedFile = { | ||||
| 	name: 'UploadedFile', | ||||
| 	props: ['file'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleDelete() { | ||||
| 			console.log('emit delete event') | ||||
| 			this.$emit('delete', this.file); | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() {}, | ||||
| 	render: function (h) { | ||||
| 		return ( | ||||
| 			<div | ||||
| 				title={this.file.fileName} | ||||
| 				style={{ | ||||
| 					background: `url(${tupleImg}) no-repeat`, | ||||
| 					backgroundSize: '14px', | ||||
| 					backgroundPosition: '0 55%', | ||||
| 					paddingLeft: '20px', | ||||
| 					paddingRight: '24px', | ||||
| 					textOverflow: 'ellipsis', | ||||
| 					whiteSpace: 'nowrap', | ||||
| 					overflow: 'hidden', | ||||
| 					cursor: 'pointer', | ||||
| 					display: 'inline-block', | ||||
| 				}}> | ||||
| 				{this.file.fileName} | ||||
| 				<el-button | ||||
| 					type="text" | ||||
| 					icon="el-icon-close" | ||||
| 					style="float: right; position: relative; top: 2px; left: 8px; z-index: 100" | ||||
| 					class="dialog__upload_component__close" | ||||
| 					onClick={this.handleDelete} | ||||
| 				/> | ||||
| 			</div> | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| @@ -98,7 +173,7 @@ export default { | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	components: { uploadedFile }, | ||||
| 	props: { | ||||
| 		rows: { | ||||
| 			type: Array, | ||||
| @@ -108,13 +183,29 @@ export default { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		labelPosition: { | ||||
| 			type: String, | ||||
| 			default: 'right', | ||||
| 		}, | ||||
| 		size: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			uploadOpen: false, | ||||
| 			form: {}, | ||||
| 			formLoading: true, | ||||
| 			optionListOf: {}, | ||||
| 			uploadedFileList: [], | ||||
| 			dataLoaded: false, | ||||
| 			uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers,url都是固定的 | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| @@ -124,16 +215,6 @@ export default { | ||||
| 			return max * 20; | ||||
| 			// return max * 20 + 'px'; | ||||
| 		}, | ||||
| 		form: { | ||||
| 			get() { | ||||
| 				// if (this.dataLoaded) return this.dataForm; | ||||
| 				// else return {} | ||||
| 				return this.dataForm; | ||||
| 			}, | ||||
| 			set(val) { | ||||
| 				console.log('set form', val); | ||||
| 			}, | ||||
| 		}, | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		rows: { | ||||
| @@ -146,6 +227,13 @@ export default { | ||||
| 			deep: true, | ||||
| 			immediate: false, | ||||
| 		}, | ||||
| 		dataForm: { | ||||
| 			handler(val) { | ||||
| 				this.form = JSON.parse(JSON.stringify(val)); | ||||
| 			}, | ||||
| 			deep: true, | ||||
| 			immediate: true, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		// 处理 options | ||||
| @@ -229,7 +317,7 @@ export default { | ||||
| 										})) | ||||
| 									); | ||||
| 								} else if (opt.input) { | ||||
| 									console.log('setting code: ', response.data) | ||||
| 									console.log('setting code: ', response.data); | ||||
| 									// 处理输入框数据 | ||||
| 									this.form[opt.prop] = response.data; | ||||
| 								} | ||||
| @@ -261,23 +349,27 @@ export default { | ||||
| 		beforeUpload() {}, | ||||
| 		// 上传前的验证规则可通过 bind 属性传入 | ||||
| 		handleUploadSuccess(response, file, fileList) { | ||||
| 			console.log( | ||||
| 				'[dialogForm:handleUploadSuccess]', | ||||
| 				response, | ||||
| 				file, | ||||
| 				fileList, | ||||
| 				this.form | ||||
| 			); | ||||
| 			// 保存原始文件名 | ||||
| 			if ('fileNames' in this.form) this.form.fileNames.push(file.name); | ||||
| 			// 保存完整地址 | ||||
| 			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data); | ||||
| 			this.form.files.push({ | ||||
| 				fileName: file.name, | ||||
| 				fileUrl: response.data, | ||||
| 				fileType: 2, | ||||
| 			}); | ||||
| 			this.$modal.msgSuccess('上传成功'); | ||||
| 			this.$emit('update', this.form); | ||||
| 		}, | ||||
|  | ||||
| 		getFileName(fileUrl) { | ||||
| 			return fileUrl.split('/').pop(); | ||||
| 		}, | ||||
|  | ||||
| 		handleFilesOpen() { | ||||
| 			this.uploadOpen = !this.uploadOpen; | ||||
| 		}, | ||||
|  | ||||
| 		handleDeleteFile(file) { | ||||
| 			this.form.files = this.form.files.filter(item => item.fileUrl != file.fileUrl); | ||||
| 			this.$emit('update', this.form); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
| @@ -287,4 +379,52 @@ export default { | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
|  | ||||
| .upload-area { | ||||
| 	// background: #ccc; | ||||
| 	// display: grid; | ||||
| 	// grid-auto-rows: 34px; | ||||
| 	// grid-template-columns: repeat(6, minmax(32px, max-content)); | ||||
| 	// gap: 8px; | ||||
| 	// align-items: center; | ||||
| 	position: relative; | ||||
| 	overflow: hidden; | ||||
| 	transition: height 0.3s ease-out; | ||||
| } | ||||
|  | ||||
| .upload-in-dialog { | ||||
| 	// display: inline-block; | ||||
| 	margin-right: 24px; | ||||
| 	// background: #ccc; | ||||
| 	position: relative; | ||||
| 	// top: -13px; | ||||
| 	float: left; | ||||
| } | ||||
|  | ||||
| .close-icon { | ||||
| 	// background: #ccc; | ||||
| 	position: absolute; | ||||
| 	top: 0; | ||||
| 	right: 12px; | ||||
| 	z-index: 100; | ||||
| 	transition: transform 0.3s ease-out; | ||||
| } | ||||
|  | ||||
| .close-icon.open { | ||||
| 	transform: rotateZ(90deg); | ||||
| } | ||||
| </style> | ||||
|  | ||||
| <style> | ||||
| .dialog__upload_component__close { | ||||
| 	color: #ccc; | ||||
| } | ||||
| .dialog__upload_component__close:hover { | ||||
| 	/* color: #777; */ | ||||
| 	color: red; | ||||
| } | ||||
|  | ||||
| .height-48 { | ||||
| 	height: 35px !important; | ||||
| } | ||||
| </style> | ||||
|   | ||||
							
								
								
									
										89
									
								
								src/components/SequenceGraph/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,89 @@ | ||||
| <!--  | ||||
|     filename: index.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-29 14:39:40 | ||||
|     description: 状态时序图  | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<div class="sequence-graph"> | ||||
| 		<SequenceGraphItem v-for="eq in Object.keys(list)" :key="eq" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import SequenceGraphItem from './sequenceGraphItem.vue'; | ||||
| export default { | ||||
| 	name: 'SequenceGraph', | ||||
| 	components: { SequenceGraphItem }, | ||||
| 	props: { | ||||
| 		colors: { | ||||
| 			type: Array, | ||||
| 			default: () => ['', '', '', '', '', ''], // 默认颜色 | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			list: { | ||||
| 				打孔机: { | ||||
| 					equipmentId: 1, | ||||
| 					equipmentName: 'EQ1', | ||||
| 					status: '', | ||||
| 					startTime: '', | ||||
| 					duration: '', | ||||
| 					startPos: '', | ||||
| 					relativeDuring: '', | ||||
| 				}, | ||||
| 				磨边机: { | ||||
| 					equipmentId: 12, | ||||
| 					equipmentName: 'EQ2', | ||||
| 					status: '', | ||||
| 					startTime: '', | ||||
| 					duration: '', | ||||
| 					startPos: '', | ||||
| 					relativeDuring: '', | ||||
| 				}, | ||||
| 				清洗机: { | ||||
| 					equipmentId: 13, | ||||
| 					equipmentName: 'EQ3', | ||||
| 					status: '', | ||||
| 					startTime: '', | ||||
| 					duration: '', | ||||
| 					startPos: '', | ||||
| 					relativeDuring: '', | ||||
| 				}, | ||||
| 				窑炉: { | ||||
| 					equipmentId: 14, | ||||
| 					equipmentName: 'EQ4', | ||||
| 					status: '', | ||||
| 					startTime: '', | ||||
| 					duration: '', | ||||
| 					startPos: '', | ||||
| 					relativeDuring: '', | ||||
| 				}, | ||||
| 				AGV: { | ||||
| 					equipmentId: 15, | ||||
| 					equipmentName: 'EQ5', | ||||
| 					status: '', | ||||
| 					startTime: '', | ||||
| 					duration: '', | ||||
| 					startPos: '', | ||||
| 					relativeDuring: '', | ||||
| 				}, | ||||
| 			}, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: {}, | ||||
| 	methods: {}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .sequence-graph { | ||||
| 	padding: 24px; | ||||
| 	background: #fff; | ||||
| 	border-radius: 6px; | ||||
| 	margin: 12px; | ||||
| 	box-shadow: 0 0 32px 8px rgba($color: #000000, $alpha: 0.2); | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										51
									
								
								src/components/SequenceGraph/sequenceGraphItem.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,51 @@ | ||||
| <!--  | ||||
|     filename: sequenceGraphItem.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-29 14:40:51 | ||||
|     description: 时序图最小单元 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<div class="sequence-graph-item" :style="styles"> | ||||
|         <span v-if="time != null">{{ time }}</span> | ||||
|     </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'SequenceGraphItem', | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		color: { | ||||
| 			type: String, | ||||
| 			default: 'black', | ||||
| 		}, | ||||
|         time: { | ||||
|             type: String, | ||||
|             default: null | ||||
|         } | ||||
| 	}, | ||||
|     computed: { | ||||
|         styles() { | ||||
|             return { | ||||
|                 color: this.color | ||||
|             } | ||||
|         } | ||||
|     }, | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	computed: {}, | ||||
| 	methods: {}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .sequence-graph-item { | ||||
|     background: #fff; | ||||
|     padding: 12px; | ||||
|     width: 40px; | ||||
|     height: 32px; | ||||
|     display: inline-block; | ||||
| } | ||||
| </style> | ||||
| @@ -32,7 +32,7 @@ export default { | ||||
|   min-height: calc(100vh - 56px); | ||||
|   min-width: calc(100vh - 280px); | ||||
|   position: relative; | ||||
|   overflow: hidden; | ||||
|   overflow: visible; | ||||
|   margin: 8px 14px 0px 16px; | ||||
|   border-radius: 8px; | ||||
|   background-color: #fff; | ||||
| @@ -46,6 +46,8 @@ export default { | ||||
|   .app-main { | ||||
|     /* 84 = navbar + tags-view = 50 + 34 */ | ||||
|     min-height: calc(100vh - 120px - 8px); | ||||
|     display: flex; | ||||
|     flex-direction: column; | ||||
|   } | ||||
|  | ||||
|   .fixed-header + .app-main { | ||||
|   | ||||
| @@ -94,7 +94,7 @@ export default { | ||||
|     async logout() { | ||||
|       this.$modal.confirm('确定注销并退出系统吗?', '提示').then(() => { | ||||
|         this.$store.dispatch('LogOut').then(() => { | ||||
|           location.href = getPath('/index'); | ||||
|           location.href = getPath('/'); | ||||
|         }) | ||||
|       }).catch(() => {}); | ||||
|     } | ||||
|   | ||||
| @@ -52,6 +52,13 @@ Vue.prototype.divide = divide; | ||||
| Vue.prototype.tableHeight = function(n) { | ||||
| 	return window.innerHeight - n | ||||
| } | ||||
| Vue.prototype.searchBarWidth = function(name, num) { | ||||
| 	if (document.getElementById(name) && document.getElementById(name).offsetWidth < num) { | ||||
| 		return true | ||||
| 	} else { | ||||
| 		return false | ||||
| 	} | ||||
| } | ||||
|  | ||||
| // 全局组件挂载 | ||||
| Vue.component('DictTag', DictTag); | ||||
|   | ||||
| @@ -31,7 +31,6 @@ export default { | ||||
| 			// dialogFormConfig: [], // 占位 | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() {}, | ||||
| 	methods: { | ||||
| 		// 过滤后端传回的详情数据 | ||||
| 		filterData(data, keys) { | ||||
| @@ -54,6 +53,9 @@ export default { | ||||
| 				case 'delete': | ||||
| 					this.handleDelete(data); | ||||
| 					break; | ||||
| 				case 'detail': | ||||
| 					this.handleDetail(data); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		// 处理搜索栏按钮 | ||||
|   | ||||
| @@ -65,16 +65,22 @@ export const constantRoutes = [ | ||||
|     hidden: true | ||||
|   }, | ||||
|   { | ||||
|     path: '', | ||||
|     path: '/print-design', | ||||
|     component: (resolve) => require(['@/views/print/design'], resolve), | ||||
|     hidden: true | ||||
|   }, | ||||
|   { | ||||
|     path: '/', | ||||
|     component: Layout, | ||||
|     redirect: 'index', | ||||
|     children: [{ | ||||
|         path: 'index', | ||||
|         component: (resolve) => require(['@/views/index'], resolve), | ||||
|         name: '首页', | ||||
|         meta: {title: '首页', icon: 'dashboard', affix: true} | ||||
|       } | ||||
|     ] | ||||
|     redirect: 'core/base/factory', | ||||
|     // children: [{ | ||||
|     //   path: 'index', | ||||
|     //   redirect: 'core/base/factory', | ||||
|     //   component: (resolve) => require(['@/views/index'], resolve), | ||||
|     //   name: '首页', | ||||
|     //   meta: { title: '首页', icon: 'dashboard', affix: true } | ||||
|     // } | ||||
|     // ] | ||||
|   }, | ||||
|   { | ||||
|     path: '/user', | ||||
| @@ -82,15 +88,15 @@ export const constantRoutes = [ | ||||
|     hidden: true, | ||||
|     redirect: 'noredirect', | ||||
|     children: [{ | ||||
|         path: 'profile', | ||||
|         component: (resolve) => require(['@/views/system/user/profile/index'], resolve), | ||||
|         name: 'Profile', | ||||
|         meta: {title: '个人中心', icon: 'user'} | ||||
|       }, { | ||||
|         path: 'notify-message', | ||||
|         component: (resolve) => require(['@/views/system/notify/my/index'], resolve), | ||||
|         name: 'MyNotifyMessage', | ||||
|         meta: { title: '我的站内信', icon: 'message' }, | ||||
|       path: 'profile', | ||||
|       component: (resolve) => require(['@/views/system/user/profile/index'], resolve), | ||||
|       name: 'Profile', | ||||
|       meta: { title: '个人中心', icon: 'user' } | ||||
|     }, { | ||||
|       path: 'notify-message', | ||||
|       component: (resolve) => require(['@/views/system/notify/my/index'], resolve), | ||||
|       name: 'MyNotifyMessage', | ||||
|       meta: { title: '我的站内信', icon: 'message' }, | ||||
|     }] | ||||
|   }, | ||||
|   { | ||||
| @@ -98,11 +104,11 @@ export const constantRoutes = [ | ||||
|     component: Layout, | ||||
|     hidden: true, | ||||
|     children: [{ | ||||
|         path: 'type/data/:dictId(\\d+)', | ||||
|         component: (resolve) => require(['@/views/system/dict/data'], resolve), | ||||
|         name: 'SystemDictData', | ||||
|         meta: {title: '字典数据', icon: '', activeMenu: '/system/dict'} | ||||
|       } | ||||
|       path: 'type/data/:dictId(\\d+)', | ||||
|       component: (resolve) => require(['@/views/system/dict/data'], resolve), | ||||
|       name: 'SystemDictData', | ||||
|       meta: { title: '字典数据', icon: '', activeMenu: '/system/dict' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
|   { | ||||
| @@ -110,22 +116,22 @@ export const constantRoutes = [ | ||||
|     component: Layout, | ||||
|     hidden: true, | ||||
|     children: [{ | ||||
|         path: 'log', | ||||
|         component: (resolve) => require(['@/views/infra/job/log'], resolve), | ||||
|         name: 'InfraJobLog', | ||||
|         meta: {title: '调度日志', activeMenu: '/infra/job'} | ||||
|       } | ||||
|       path: 'log', | ||||
|       component: (resolve) => require(['@/views/infra/job/log'], resolve), | ||||
|       name: 'InfraJobLog', | ||||
|       meta: { title: '调度日志', activeMenu: '/infra/job' } | ||||
|     } | ||||
|     ] | ||||
|   }, { | ||||
|     path: '/codegen', | ||||
|     component: Layout, | ||||
|     hidden: true, | ||||
|     children: [{ | ||||
|         path: 'edit/:tableId(\\d+)', | ||||
|         component: (resolve) => require(['@/views/infra/codegen/editTable'], resolve), | ||||
|         name: 'InfraCodegenEditTable', | ||||
|         meta: {title: '修改生成配置', activeMenu: '/infra/codegen'} | ||||
|       } | ||||
|       path: 'edit/:tableId(\\d+)', | ||||
|       component: (resolve) => require(['@/views/infra/codegen/editTable'], resolve), | ||||
|       name: 'InfraCodegenEditTable', | ||||
|       meta: { title: '修改生成配置', activeMenu: '/infra/codegen' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
|   { | ||||
| @@ -134,16 +140,16 @@ export const constantRoutes = [ | ||||
|     hidden: true, | ||||
|     redirect: 'noredirect', | ||||
|     children: [{ | ||||
|         path: 'oa/leave/create', | ||||
|         component: (resolve) => require(['@/views/bpm/oa/leave/create'], resolve), | ||||
|         name: 'BpmOALeaveCreate', | ||||
|         meta: {title: '发起 OA 请假', icon: 'form', activeMenu: '/bpm/oa/leave'} | ||||
|       }, { | ||||
|         path: 'oa/leave/detail', | ||||
|         component: (resolve) => require(['@/views/bpm/oa/leave/detail'], resolve), | ||||
|         name: 'BpmOALeaveDetail', | ||||
|         meta: {title: '查看 OA 请假', icon: 'view', activeMenu: '/bpm/oa/leave'} | ||||
|       } | ||||
|       path: 'oa/leave/create', | ||||
|       component: (resolve) => require(['@/views/bpm/oa/leave/create'], resolve), | ||||
|       name: 'BpmOALeaveCreate', | ||||
|       meta: { title: '发起 OA 请假', icon: 'form', activeMenu: '/bpm/oa/leave' } | ||||
|     }, { | ||||
|       path: 'oa/leave/detail', | ||||
|       component: (resolve) => require(['@/views/bpm/oa/leave/detail'], resolve), | ||||
|       name: 'BpmOALeaveDetail', | ||||
|       meta: { title: '查看 OA 请假', icon: 'view', activeMenu: '/bpm/oa/leave' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
|   { | ||||
| @@ -151,31 +157,31 @@ export const constantRoutes = [ | ||||
|     component: Layout, | ||||
|     hidden: true, | ||||
|     children: [{ | ||||
|         path: 'manager/form/edit', | ||||
|         component: (resolve) => require(['@/views/bpm/form/formEditor'], resolve), | ||||
|         name: 'BpmFormEditor', | ||||
|         meta: {title: '流程表单-编辑', activeMenu: '/bpm/manager/form'} | ||||
|       }, { | ||||
|         path: 'manager/definition', | ||||
|         component: (resolve) => require(['@/views/bpm/definition/index'], resolve), | ||||
|         name: 'BpmProcessDefinition', | ||||
|         meta: {title: '流程定义', activeMenu: '/bpm/manager/model'} | ||||
|       }, { | ||||
|         path: 'manager/model/design', | ||||
|         component: (resolve) => require(['@/views/bpm/model/modelEditor'], resolve), | ||||
|         name: 'BpmModelEditor', | ||||
|         meta: {title: '设计流程', activeMenu: '/bpm/manager/model'} | ||||
|       }, { | ||||
|         path: 'process-instance/create', | ||||
|         component: (resolve) => require(['@/views/bpm/processInstance/create'], resolve), | ||||
|         name: 'BpmProcessInstanceCreate', | ||||
|         meta: {title: '发起流程', activeMenu: '/bpm/task/my'} | ||||
|       }, { | ||||
|         path: 'process-instance/detail', | ||||
|         component: (resolve) => require(['@/views/bpm/processInstance/detail'], resolve), | ||||
|         name: 'BpmProcessInstanceDetail', | ||||
|         meta: {title: '流程详情', activeMenu: '/bpm/task/my'} | ||||
|       } | ||||
|       path: 'manager/form/edit', | ||||
|       component: (resolve) => require(['@/views/bpm/form/formEditor'], resolve), | ||||
|       name: 'BpmFormEditor', | ||||
|       meta: { title: '流程表单-编辑', activeMenu: '/bpm/manager/form' } | ||||
|     }, { | ||||
|       path: 'manager/definition', | ||||
|       component: (resolve) => require(['@/views/bpm/definition/index'], resolve), | ||||
|       name: 'BpmProcessDefinition', | ||||
|       meta: { title: '流程定义', activeMenu: '/bpm/manager/model' } | ||||
|     }, { | ||||
|       path: 'manager/model/design', | ||||
|       component: (resolve) => require(['@/views/bpm/model/modelEditor'], resolve), | ||||
|       name: 'BpmModelEditor', | ||||
|       meta: { title: '设计流程', activeMenu: '/bpm/manager/model' } | ||||
|     }, { | ||||
|       path: 'process-instance/create', | ||||
|       component: (resolve) => require(['@/views/bpm/processInstance/create'], resolve), | ||||
|       name: 'BpmProcessInstanceCreate', | ||||
|       meta: { title: '发起流程', activeMenu: '/bpm/task/my' } | ||||
|     }, { | ||||
|       path: 'process-instance/detail', | ||||
|       component: (resolve) => require(['@/views/bpm/processInstance/detail'], resolve), | ||||
|       name: 'BpmProcessInstanceDetail', | ||||
|       meta: { title: '流程详情', activeMenu: '/bpm/task/my' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
|   { | ||||
| @@ -186,7 +192,7 @@ export const constantRoutes = [ | ||||
|       path: 'value/:propertyId(\\d+)', | ||||
|       component: (resolve) => require(['@/views/mall/product/property/value'], resolve), | ||||
|       name: 'ProductPropertyValue', | ||||
|       meta: {title: '商品属性值', icon: '', activeMenu: '/product/property'} | ||||
|       meta: { title: '商品属性值', icon: '', activeMenu: '/product/property' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
| @@ -198,14 +204,14 @@ export const constantRoutes = [ | ||||
|       path: 'edit/:spuId(\\d+)', | ||||
|       component: (resolve) => require(['@/views/mall/product/spu/save'], resolve), | ||||
|       name: 'ProductSpuUpdate', | ||||
|       meta: {title: '修改商品', activeMenu: '/product/spu'} | ||||
|       meta: { title: '修改商品', activeMenu: '/product/spu' } | ||||
|     }, | ||||
|       { | ||||
|         path: 'add', | ||||
|         component: (resolve) => require(['@/views/mall/product/spu/save'], resolve), | ||||
|         name: 'ProductSpuCreate', | ||||
|         meta: {title: '添加商品', activeMenu: '/product/spu'} | ||||
|       } | ||||
|     { | ||||
|       path: 'add', | ||||
|       component: (resolve) => require(['@/views/mall/product/spu/save'], resolve), | ||||
|       name: 'ProductSpuCreate', | ||||
|       meta: { title: '添加商品', activeMenu: '/product/spu' } | ||||
|     } | ||||
|     ] | ||||
|   }, | ||||
|   { | ||||
| @@ -247,7 +253,7 @@ Router.prototype.push = function push(location) { | ||||
|  | ||||
| export default new Router({ | ||||
|   base: process.env.VUE_APP_APP_NAME ? process.env.VUE_APP_APP_NAME : "/", | ||||
|   mode: 'history', // 去掉url中的# | ||||
|   scrollBehavior: () => ({y: 0}), | ||||
|   mode: 'hash', // 去掉url中的# | ||||
|   scrollBehavior: () => ({ y: 0 }), | ||||
|   routes: constantRoutes | ||||
| }) | ||||
|   | ||||
| @@ -175,4 +175,24 @@ input, textarea{ | ||||
|  | ||||
| ::-webkit-scrollbar-thumb:hover { | ||||
|   background-color: rgba(144,147,153,.3); | ||||
| } | ||||
| } | ||||
|  | ||||
| // 抽屉head区域---start | ||||
| .el-drawer__header { | ||||
|   padding-bottom: 20px; | ||||
|   margin-bottom: 23px; | ||||
|   font-size: 20px; | ||||
|   font-weight: 500; | ||||
|   color: rgba(0,0,0,0.85); | ||||
|   border-bottom: 1px solid rgba(233, 233, 233, 1); | ||||
| } | ||||
| .el-drawer__header > :first-child::before { | ||||
|   content: ''; | ||||
|   display: inline-block; | ||||
|   width: 4px; | ||||
|   height: 24px; | ||||
|   background-color: #0b58ff; | ||||
|   margin-right: 8px; | ||||
|   vertical-align: middle; | ||||
| } | ||||
| // 抽屉head区域---end | ||||
							
								
								
									
										64
									
								
								src/utils/chartMixins/resize.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,64 @@ | ||||
| import { debounce } from '@/utils/debounce' | ||||
|  | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       $_sidebarElm: null, | ||||
|       $_resizeHandler: null | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.$_resizeHandler = debounce(() => { | ||||
|       if (this.chart) { | ||||
|         this.chart.resize() | ||||
|       } | ||||
|     }, 100) | ||||
|     this.$_initResizeEvent() | ||||
|     this.$_initSidebarResizeEvent() | ||||
|   }, | ||||
|   beforeDestroy() { | ||||
|     this.$_destroyResizeEvent() | ||||
|     this.$_destroySidebarResizeEvent() | ||||
|   }, | ||||
|   // to fixed bug when cached by keep-alive | ||||
|   // https://github.com/PanJiaChen/vue-element-admin/issues/2116 | ||||
|   activated() { | ||||
|     this.$_initResizeEvent() | ||||
|     this.$_initSidebarResizeEvent() | ||||
|   }, | ||||
|   deactivated() { | ||||
|     this.$_destroyResizeEvent() | ||||
|     this.$_destroySidebarResizeEvent() | ||||
|   }, | ||||
|   methods: { | ||||
|     // use $_ for mixins properties | ||||
|     // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential | ||||
|     $_initResizeEvent() { | ||||
|       window.addEventListener('resize', this.$_resizeHandler) | ||||
|     }, | ||||
|     $_destroyResizeEvent() { | ||||
|       window.removeEventListener('resize', this.$_resizeHandler) | ||||
|     }, | ||||
|     $_sidebarResizeHandler(e) { | ||||
|       if (e.propertyName === 'width') { | ||||
|         this.$_resizeHandler() | ||||
|       } | ||||
|     }, | ||||
|     $_initSidebarResizeEvent() { | ||||
|       this.$_sidebarElm = | ||||
|         document.getElementsByClassName('sidebar-container')[0] | ||||
|       this.$_sidebarElm && | ||||
|         this.$_sidebarElm.addEventListener( | ||||
|           'transitionend', | ||||
|           this.$_sidebarResizeHandler | ||||
|         ) | ||||
|     }, | ||||
|     $_destroySidebarResizeEvent() { | ||||
|       this.$_sidebarElm && | ||||
|         this.$_sidebarElm.removeEventListener( | ||||
|           'transitionend', | ||||
|           this.$_sidebarResizeHandler | ||||
|         ) | ||||
|     } | ||||
|   } | ||||
| } | ||||
							
								
								
									
										40
									
								
								src/utils/debounce.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,40 @@ | ||||
| /** | ||||
|  * @param {Function} func | ||||
|  * @param {number} wait | ||||
|  * @param {boolean} immediate | ||||
|  * @return {*} | ||||
|  */ | ||||
| export function debounce(func, wait, immediate) { | ||||
|   let timeout, args, context, timestamp, result | ||||
|  | ||||
|   const later = function () { | ||||
|     // 据上一次触发时间间隔 | ||||
|     const last = +new Date() - timestamp | ||||
|  | ||||
|     // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait | ||||
|     if (last < wait && last > 0) { | ||||
|       timeout = setTimeout(later, wait - last) | ||||
|     } else { | ||||
|       timeout = null | ||||
|       // 如果设定为immediate===true,因为开始边界已经调用过了此处无需调用 | ||||
|       if (!immediate) { | ||||
|         result = func.apply(context, args) | ||||
|         if (!timeout) context = args = null | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   return function (...args) { | ||||
|     context = this | ||||
|     timestamp = +new Date() | ||||
|     const callNow = immediate && !timeout | ||||
|     // 如果延时不存在,重新设定延时 | ||||
|     if (!timeout) timeout = setTimeout(later, wait) | ||||
|     if (callNow) { | ||||
|       result = func.apply(context, args) | ||||
|       context = args = null | ||||
|     } | ||||
|  | ||||
|     return result | ||||
|   } | ||||
| } | ||||
| @@ -91,7 +91,11 @@ export const DICT_TYPE = { | ||||
|   ENERGY_UNIT: 'energy_unit', | ||||
|    | ||||
|   // ============== ENERGY - 能源模块 ============= | ||||
|   EQU_ALARM_LEVEL: 'equ_alarm_level' | ||||
|   EQU_ALARM_LEVEL: 'equ_alarm_level', | ||||
|   MONITOR_INDEX_TYPE: 'monitor_index_type', | ||||
|   OBJECT_TYPE: 'object_type', | ||||
|   STATISTIC_TYPE: 'statistic_type', | ||||
|   TIME_DIM: 'time_dim' | ||||
| } | ||||
|  | ||||
| /** | ||||
|   | ||||
| @@ -1,3 +1,5 @@ | ||||
| import moment from 'moment'; | ||||
|  | ||||
| /** | ||||
|  * 用于动态表结构的 tableProps 生成 | ||||
|  * @param {*} nameData | ||||
| @@ -16,10 +18,9 @@ export function handleNameData(nameData) { | ||||
| function step1(tree1) { | ||||
| 	return Array.from(new Set(tree1.map((item) => item.name))) | ||||
| 		.sort() | ||||
| 		.map((item) => ({ | ||||
| 			prop: item, | ||||
| 			label: item, | ||||
| 			align: 'center', | ||||
| 		.map((time) => ({ | ||||
| 			prop: time, | ||||
| 			label: moment(time).format('YYYY-MM-DD HH:mm:ss'), | ||||
| 			children: [], | ||||
| 		})); | ||||
| } | ||||
| @@ -33,7 +34,6 @@ function step2(firstTierProps, tree2) { | ||||
| 			parent.children.push({ | ||||
| 				label: nd.name, | ||||
| 				prop: `${parent.prop}-${nd.name}`, | ||||
| 				align: 'center', | ||||
| 			}); | ||||
| 		} | ||||
| 	}); | ||||
|   | ||||
							
								
								
									
										74
									
								
								src/views/base/dataBoard/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,74 @@ | ||||
| <!--  | ||||
|     filename: index.vue | ||||
|     author: liubin | ||||
|     date: 2023-10-11 09:32:04 | ||||
|     description: 设备看板 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<div ref="dataBoard" class=""></div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'DataBoard', | ||||
| 	components: {}, | ||||
| 	props: {}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			appMain: null, // dom | ||||
| 			parentStyle: { | ||||
| 				margin: '8px 14px 0px 16px', | ||||
| 				minHeight: 'calc(100vh - 120px - 8px)', | ||||
| 			}, // object | ||||
| 			mainFooter: null, // dom | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.$nextTick(() => { | ||||
| 			this.modify(); | ||||
| 		}); | ||||
| 	}, | ||||
| 	activated() { | ||||
| 		this.modify(); | ||||
| 	}, | ||||
| 	deactivated() { | ||||
| 		this.recover(); | ||||
| 	}, | ||||
| 	beforeDestroy() { | ||||
| 		this.recover(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		modify() { | ||||
| 			// 在这个页面临时修改下父类的margin,结束时需还原 | ||||
| 			this.appMain = document.querySelector('.app-main'); | ||||
| 			// this.appMain.style.minHeight = 'calc(100vh - 90px)'; | ||||
| 			this.appMain.style.margin = 0; | ||||
| 			// 在这个页面临时删除 main-footer 元素,结束时需还原 | ||||
| 			// this.mainFooter = document.querySelector('.main-footer').cloneNode(true); | ||||
| 			// 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); | ||||
| 			}); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .data-board { | ||||
| 	position: absolute; | ||||
| 	top: 0; | ||||
| 	left: 0; | ||||
| 	width: 100%; | ||||
| 	height: 100%; | ||||
| 	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain | ||||
| 		no-repeat; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										482
									
								
								src/views/base/equipmentBindGroup/components/BasicDrawer.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,482 @@ | ||||
| <!--  | ||||
|     filename: EquipmentDrawer.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-22 14:38:56 | ||||
|     description:  | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-drawer | ||||
| 		:visible="visible" | ||||
| 		:show-close="false" | ||||
| 		:wrapper-closable="false" | ||||
| 		class="drawer" | ||||
| 		custom-class="mes-drawer" | ||||
| 		size="60%" | ||||
| 		@closed="$emit('destroy')"> | ||||
| 		<SmallTitle slot="title"> | ||||
| 			{{ | ||||
| 				mode.includes('detail') | ||||
| 					? '详情' | ||||
| 					: mode.includes('edit') | ||||
| 					? '编辑' | ||||
| 					: '新增' | ||||
| 			}} | ||||
| 		</SmallTitle> | ||||
|  | ||||
| 		<div class="drawer-body flex"> | ||||
| 			<div class="drawer-body__content"> | ||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | ||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | ||||
|  | ||||
| 					<div class="form-part" v-if="section.key == 'base'"> | ||||
| 						<el-skeleton v-if="!showForm" animated /> | ||||
| 						<BaseInfoForm | ||||
| 							key="drawer-dialog-form" | ||||
| 							v-if="showForm" | ||||
| 							ref="form" | ||||
| 							:disabled="true" | ||||
| 							:dataForm="form" | ||||
| 							:rows="formRows" /> | ||||
| 					</div> | ||||
|  | ||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||
| 						<base-table | ||||
| 							v-loading="attrListLoading" | ||||
| 							:table-props="section.props" | ||||
| 							:page="attrQuery?.params.pageNo || 1" | ||||
| 							:limit="attrQuery?.params.pageSize || 10" | ||||
| 							:table-data="list" | ||||
| 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||
| 							@emitButtonClick="handleAddAttr" | ||||
| 							@emitFun="handleEmitFun"> | ||||
| 							<method-btn | ||||
| 								v-if="section.tableBtn" | ||||
| 								slot="handleBtn" | ||||
| 								label="操作" | ||||
| 								:method-list="tableBtn" | ||||
| 								@clickBtn="handleTableBtnClick" /> | ||||
| 						</base-table> | ||||
|  | ||||
| 						<!-- 分页组件 --> | ||||
| 						<pagination | ||||
| 							v-show="total > 0" | ||||
| 							:total="total" | ||||
| 							:page.sync="attrQuery.params.pageNo" | ||||
| 							:limit.sync="attrQuery.params.pageSize" | ||||
| 							@pagination="getAttrList" /> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 			</div> | ||||
|  | ||||
| 			<div class="drawer-body__footer"> | ||||
| 				<el-button style="" @click="handleCancel">取消</el-button> | ||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||
| 					编辑 | ||||
| 				</el-button> | ||||
| 				<el-button v-else type="primary" @click="handleCancel">确定</el-button> | ||||
| 				<!-- sections的第二项必须是 属性列表  --> | ||||
| 				<!-- <el-button | ||||
| 						v-if="sections[1].allowAdd" | ||||
| 						type="primary" | ||||
| 						@click="handleAddAttr"> | ||||
| 						添加属性 | ||||
| 					</el-button> --> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| 		<!-- 属性对话框 --> | ||||
| 		<base-dialog | ||||
| 			v-if="sections[1].allowAdd" | ||||
| 			:dialogTitle="attrTitle" | ||||
| 			:dialogVisible="attrFormVisible" | ||||
| 			width="45%" | ||||
| 			:append-to-body="true" | ||||
| 			custom-class="baseDialog" | ||||
| 			@close="closeAttrForm" | ||||
| 			@cancel="closeAttrForm" | ||||
| 			@confirm="submitAttrForm"> | ||||
| 			<DialogForm | ||||
| 				v-if="attrFormVisible" | ||||
| 				ref="attrForm" | ||||
| 				:disabled="mode.includes('detail')" | ||||
| 				v-model="attrForm" | ||||
| 				:rows="attrRows" /> | ||||
| 		</base-dialog> | ||||
| 	</el-drawer> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import BaseInfoForm from '@/components/DialogForm'; | ||||
| import DialogForm from './dialogForm'; | ||||
|  | ||||
| const SmallTitle = { | ||||
| 	name: 'SmallTitle', | ||||
| 	props: ['size'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	methods: {}, | ||||
| 	render: function (h) { | ||||
| 		return h( | ||||
| 			'span', | ||||
| 			{ | ||||
| 				class: 'small-title', | ||||
| 				style: { | ||||
| 					fontSize: '18px', | ||||
| 					lineHeight: | ||||
| 						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px', | ||||
| 					fontWeight: 500, | ||||
| 					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif', | ||||
| 				}, | ||||
| 			}, | ||||
| 			this.$slots.default | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	components: { SmallTitle, DialogForm, BaseInfoForm }, | ||||
| 	props: ['sections', 'defaultMode', 'dataId'], // dataId 作为一个通用的存放id的字段 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			mode: '', | ||||
| 			visible: false, | ||||
| 			showForm: false, | ||||
| 			total: 0, | ||||
| 			form: {}, | ||||
| 			list: [], | ||||
| 			attrTitle: '', | ||||
| 			attrForm: { | ||||
| 				id: null, | ||||
| 				equipmentGroupId: '', | ||||
| 				code: '', | ||||
| 				type: '', | ||||
| 				grade: '', | ||||
| 				alarmCode: '', | ||||
| 				alarmContent: '', | ||||
| 				plcParamName: '', | ||||
| 			}, | ||||
| 			attrFormVisible: false, | ||||
| 			attrRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '报警编码', // 自动生成 | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment-group-alarm/getCode', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '报警类型', // 固定选项 | ||||
| 						prop: 'type', | ||||
| 						options: [ | ||||
| 							{ label: '布尔型', value: 2 }, | ||||
| 							{ label: '字符型', value: 1 }, | ||||
| 						], | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '报警级别', // 字典 | ||||
| 						prop: 'grade', | ||||
| 						options: this.getDictDatas(this.DICT_TYPE.EQU_ALARM_LEVEL), | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备报警编码', // 对应到设备实际的报警编码 | ||||
| 						prop: 'alarmCode', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数列名', // 在实时数据库的列名 | ||||
| 						prop: 'plcParamName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '报警内容', | ||||
| 						prop: 'alarmContent', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			attrQuery: { | ||||
| 				params: { | ||||
| 					pageNo: 1, | ||||
| 					pageSize: 10, | ||||
| 				}, | ||||
| 			}, // 属性列表的请求 | ||||
| 			infoQuery: null, // 基本信息的请求 | ||||
| 			attrFormSubmitting: false, | ||||
| 			attrListLoading: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		formRows() { | ||||
| 			return this.sections[0].rows.map((row) => { | ||||
| 				return row.map((col) => { | ||||
| 					return { | ||||
| 						...col, | ||||
| 						bind: { | ||||
| 							// 详情 模式下,禁用各种输入 | ||||
| 							// disabled: this.mode == 'detail', | ||||
| 							disabled: true, | ||||
| 						}, | ||||
| 					}; | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		tableBtn() { | ||||
| 			return this.mode == 'detail' ? [] : this.sections[1].tableBtn; | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.mode = this.defaultMode || 'detail'; | ||||
| 		for (const section of this.sections) { | ||||
| 			// 请求具体信息 | ||||
| 			if ('url' in section) { | ||||
| 				const query = { | ||||
| 					url: section.url, | ||||
| 					method: section.method || 'get', | ||||
| 					params: section.queryParams || null, | ||||
| 					data: section.data || null, | ||||
| 				}; | ||||
| 				// debugger; | ||||
| 				this.$axios(query).then(({ data }) => { | ||||
| 					if (section.key == 'base') { | ||||
| 						this.form = data; | ||||
| 						this.showForm = true; | ||||
| 						this.infoQuery = query; | ||||
| 					} else if (section.key == 'attrs') { | ||||
| 						this.attrQuery = query; | ||||
| 						this.list = data.list; | ||||
| 						this.total = data.total; | ||||
| 					} | ||||
| 				}); | ||||
| 			} | ||||
| 		} | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleTableBtnClick({ type, data }) { | ||||
| 			switch (type) { | ||||
| 				case 'edit': | ||||
| 					this.handleEditAttr(data.id); | ||||
| 					break; | ||||
| 				case 'delete': | ||||
| 					this.handleDeleteAttr(data.id); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		handleEmitFun(val) { | ||||
| 			console.log('handleEmitFun', val); | ||||
| 		}, | ||||
|  | ||||
| 		init() { | ||||
| 			this.visible = true; | ||||
| 		}, | ||||
|  | ||||
| 		async getAttrList() { | ||||
| 			this.attrListLoading = true; | ||||
| 			const res = await this.$axios(this.attrQuery); | ||||
| 			if (res.code == 0) { | ||||
| 				this.list = res.data.list; | ||||
| 				this.total = res.data.total; | ||||
| 			} | ||||
| 			this.attrListLoading = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 保存表单 | ||||
| 		handleSave() { | ||||
| 			this.$refs['form'][0].validate(async (valid) => { | ||||
| 				if (valid) { | ||||
| 					const isEdit = this.mode == 'edit'; | ||||
| 					await this.$axios({ | ||||
| 						url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], | ||||
| 						method: isEdit ? 'put' : 'post', | ||||
| 						data: this.form, | ||||
| 					}); | ||||
| 					this.$modal.msgSuccess(`${isEdit ? '更新' : '创建'}成功`); | ||||
| 					this.visible = false; | ||||
| 					this.$emit('refreshDataList'); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		handleCancel() { | ||||
| 			this.visible = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 开启编辑 | ||||
| 		toggleEdit() { | ||||
| 			this.mode = 'edit'; | ||||
| 		}, | ||||
|  | ||||
| 		// 新增属性 | ||||
| 		handleAddAttr() { | ||||
| 			if (!this.dataId) return this.$message.error('请先创建设备分组信息'); | ||||
| 			this.attrForm = { | ||||
| 				id: null, | ||||
| 				equipmentGroupId: this.dataId, | ||||
| 				code: '', | ||||
| 				type: '', | ||||
| 				grade: '', | ||||
| 				alarmCode: '', | ||||
| 				alarmContent: '', | ||||
| 				plcParamName: '', | ||||
| 			}; | ||||
| 			this.attrTitle = '添加设备分组报警'; | ||||
| 			this.attrFormVisible = true; | ||||
| 		}, | ||||
|  | ||||
| 		// 编辑属性 | ||||
| 		async handleEditAttr(attrId) { | ||||
| 			const res = await this.$axios({ | ||||
| 				url: this.sections[1].urlDetail, | ||||
| 				method: 'get', | ||||
| 				params: { id: attrId }, | ||||
| 			}); | ||||
| 			if (res.code == 0) { | ||||
| 				this.attrForm = res.data; | ||||
| 				this.attrTitle = '编辑设备分组报警'; | ||||
| 				this.attrFormVisible = true; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		// 删除属性 | ||||
| 		handleDeleteAttr(attrId) { | ||||
| 			this.$confirm('确定删除该分组报警?', '提示', { | ||||
| 				confirmButtonText: '确定', | ||||
| 				cancelButtonText: '取消', | ||||
| 				type: 'warning', | ||||
| 			}) | ||||
| 				.then(async () => { | ||||
| 					const res = await this.$axios({ | ||||
| 						url: this.sections[1].urlDelete, | ||||
| 						method: 'delete', | ||||
| 						params: { id: attrId }, | ||||
| 					}); | ||||
| 					if (res.code == 0) { | ||||
| 						this.$message({ | ||||
| 							message: '删除成功', | ||||
| 							type: 'success', | ||||
| 							duration: 1500, | ||||
| 							onClose: () => { | ||||
| 								this.getAttrList(); | ||||
| 							}, | ||||
| 						}); | ||||
| 					} | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
|  | ||||
| 		// 提交属性表 | ||||
| 		async submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 			}); | ||||
| 			console.log('this.attrform', this.attrForm); | ||||
| 			const isEdit = this.attrForm.id != null; | ||||
| 			this.attrFormSubmitting = true; | ||||
| 			const res = await this.$axios({ | ||||
| 				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, | ||||
| 				method: isEdit ? 'put' : 'post', | ||||
| 				data: this.attrForm, | ||||
| 			}); | ||||
|  | ||||
| 			if (res.code == 0) { | ||||
| 				this.closeAttrForm(); | ||||
| 				this.$message({ | ||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 					type: 'success', | ||||
| 					duration: 1500, | ||||
| 					onClose: () => { | ||||
| 						this.getAttrList(); | ||||
| 					}, | ||||
| 				}); | ||||
| 			} | ||||
| 			this.attrFormSubmitting = false; | ||||
| 		}, | ||||
|  | ||||
| 		closeAttrForm() { | ||||
| 			this.attrFormVisible = false; | ||||
| 		}, | ||||
|  | ||||
| 		handleClick(raw) { | ||||
| 			if (raw.type === 'delete') { | ||||
| 				this.$confirm(`确定删除该报警?`, '提示', { | ||||
| 					confirmButtonText: '确定', | ||||
| 					cancelButtonText: '取消', | ||||
| 					type: 'warning', | ||||
| 				}) | ||||
| 					.then(() => { | ||||
| 						deleteProductAttr(raw.data.id).then(({ data }) => { | ||||
| 							this.$message({ | ||||
| 								message: '操作成功', | ||||
| 								type: 'success', | ||||
| 								duration: 1500, | ||||
| 								onClose: () => { | ||||
| 									this.getList(); | ||||
| 								}, | ||||
| 							}); | ||||
| 						}); | ||||
| 					}) | ||||
| 					.catch(() => {}); | ||||
| 			} else { | ||||
| 				this.addNew(raw.data.id); | ||||
| 			} | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped> | ||||
| .drawer >>> .el-drawer { | ||||
| 	border-radius: 8px 0 0 8px; | ||||
| } | ||||
|  | ||||
| .drawer >>> .el-drawer__header { | ||||
| 	margin: 0; | ||||
| 	padding: 32px 32px 24px; | ||||
| 	border-bottom: 1px solid #dcdfe6; | ||||
| 	margin-bottom: 0px; | ||||
| } | ||||
|  | ||||
| .small-title::before { | ||||
| 	content: ''; | ||||
| 	display: inline-block; | ||||
| 	vertical-align: top; | ||||
| 	width: 4px; | ||||
| 	height: 22px; | ||||
| 	border-radius: 1px; | ||||
| 	margin-right: 8px; | ||||
| 	background-color: #0b58ff; | ||||
| } | ||||
|  | ||||
| .drawer-body { | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	height: 100%; | ||||
| } | ||||
|  | ||||
| .drawer-body__content { | ||||
| 	flex: 1; | ||||
| 	/* background: #eee; */ | ||||
| 	padding: 20px 30px; | ||||
| 	overflow-y: auto; | ||||
| } | ||||
|  | ||||
| .drawer-body__footer { | ||||
| 	display: flex; | ||||
| 	justify-content: flex-end; | ||||
| 	padding: 18px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										186
									
								
								src/views/base/equipmentBindGroup/components/dialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,186 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-09-11 15:55:13 | ||||
|     description: DialogForm for equipmentBindSection only | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="dataForm" | ||||
| 		label-width="100px" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警编码" | ||||
| 					prop="code" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.code" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入工段排序" /> | ||||
| 				</el-form-item> | ||||
| 				<!-- 				 | ||||
| 				<el-form-item | ||||
| 					label="报警编码" | ||||
| 					prop="code" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.code" | ||||
| 						placeholder="请选择产线" | ||||
| 						@change="handleProductlineChange"> | ||||
| 						<el-option | ||||
| 							v-for="opt in productionLineList" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> --> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警类型" | ||||
| 					prop="type" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.type" | ||||
| 						placeholder="请选择报警类型" | ||||
| 						@change="handleTypeChange"> | ||||
| 						<el-option | ||||
| 							v-for="opt in [ | ||||
| 								{ label: '布尔型', value: 2 }, | ||||
| 								{ label: '字符型', value: 1 }, | ||||
| 							]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警级别" | ||||
| 					prop="grade" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.grade" | ||||
| 						placeholder="请选择报警级别" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in getDictDatas(DICT_TYPE.EQU_ALARM_LEVEL)" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					v-if="+dataForm.type == 1" | ||||
| 					label="设备报警编码" | ||||
| 					prop="alarmCode"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmCode" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入设备报警编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="参数列名" | ||||
| 					prop="plcParamName" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.plcParamName" | ||||
| 						placeholder="请输入参数列名" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警内容" | ||||
| 					prop="alarmContent" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmContent" | ||||
| 						placeholder="请输入报警内容" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.getCode('/base/equipment-group-alarm/getCode').then((code) => { | ||||
| 			this.formLoading = false; | ||||
| 			this.$emit('update', { | ||||
| 				...this.dataForm, | ||||
| 				code, | ||||
| 			}); | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		async handleTypeChange(id) { | ||||
| 			this.dataForm.alarmCode = ''; | ||||
| 			this.$emit('update', this.dataForm); | ||||
| 		}, | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -17,6 +17,7 @@ | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
| @@ -39,6 +40,57 @@ | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
|  | ||||
| 		<!-- 抽屉 详情 --> | ||||
| 		<BasicDrawer | ||||
| 			v-if="editVisible" | ||||
| 			ref="drawer" | ||||
| 			:default-mode="editMode" | ||||
| 			:data-id="alarmForm.id" | ||||
| 			:sections="[ | ||||
| 				{ | ||||
| 					name: '基本信息', | ||||
| 					key: 'base', | ||||
| 					rows: drawerBaseInfoRows, | ||||
| 					url: '/base/equipment-group/get', | ||||
| 					urlUpdate: '/base/equipment-group/update', | ||||
| 					urlCreate: '/base/equipment-group/create', | ||||
| 					queryParams: { id: alarmForm.id }, | ||||
| 				}, | ||||
| 				{ | ||||
| 					name: '属性列表', | ||||
| 					key: 'attrs', | ||||
| 					props: drawerListProps, | ||||
| 					url: '/base/equipment-group-alarm/page', | ||||
| 					urlCreate: '/base/equipment-group-alarm/create', | ||||
| 					urlUpdate: '/base/equipment-group-alarm/update', | ||||
| 					urlDelete: '/base/equipment-group-alarm/delete', | ||||
| 					urlDetail: '/base/equipment-group-alarm/get', | ||||
| 					queryParams: { | ||||
| 						equipmentGroupId: alarmForm.id, | ||||
| 						pageNo: 1, | ||||
| 						pageSize: 10, | ||||
| 					}, | ||||
| 					tableBtn: [ | ||||
| 						this.$auth.hasPermi('base:equipment-group:update') | ||||
| 							? { | ||||
| 									type: 'edit', | ||||
| 									btnName: '修改', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 						this.$auth.hasPermi('base:equipment-group:delete') | ||||
| 							? { | ||||
| 									type: 'delete', | ||||
| 									btnName: '删除', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 					].filter((v) => v), | ||||
| 					allowAdd: true, | ||||
| 				}, | ||||
| 			]" | ||||
| 			@refreshDataList="getList" | ||||
| 			@cancel="editVisible = false" | ||||
| 			@destroy="editVisible = false" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| @@ -54,16 +106,24 @@ import { | ||||
|  | ||||
| import { getEquipmentGroupPage } from '@/api/base/equipmentGroup'; | ||||
| import moment from 'moment'; | ||||
| import { publicFormatter } from '@/utils/dict'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
| import BasicDrawer from './components/BasicDrawer.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentBindGroup', | ||||
| 	components: {}, | ||||
| 	components: { BasicDrawer }, | ||||
| 	mixins: [basicPageMixin], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			searchBarKeys: ['groupId', 'equipmentName'], | ||||
| 			tableBtn: [ | ||||
| 				this.$auth.hasPermi('base:equipment-bind-group:update') | ||||
| 					? { | ||||
| 							type: 'detail', | ||||
| 							btnName: '查看报警', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 				this.$auth.hasPermi('base:equipment-bind-group:update') | ||||
| 					? { | ||||
| 							type: 'edit', | ||||
| @@ -85,35 +145,34 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'equipmentName', label: '设备', align: 'center' }, | ||||
| 				{ prop: 'groupName', label: '分组', align: 'center' }, | ||||
| 				{ | ||||
| 					_action: 'equipment-bind-group-show-alert', | ||||
| 					label: '分组报警', | ||||
| 					align: 'center', | ||||
| 					subcomponent: { | ||||
| 						props: ['injectData'], | ||||
| 						render: function (h) { | ||||
| 							const _this = this; | ||||
| 							return h( | ||||
| 								'el-button', | ||||
| 								{ | ||||
| 									props: { type: 'text', size: 'mini' }, | ||||
| 									on: { | ||||
| 										click: function () { | ||||
| 											console.log('inejctdata', _this.injectData); | ||||
| 											_this.$emit('emitData', { | ||||
| 												action: _this.injectData._action, | ||||
| 												value: _this.injectData, | ||||
| 											}); | ||||
| 										}, | ||||
| 									}, | ||||
| 								}, | ||||
| 								'查看报警' | ||||
| 							); | ||||
| 						}, | ||||
| 					}, | ||||
| 				}, | ||||
| 				{ prop: 'equipmentName', label: '设备' }, | ||||
| 				{ prop: 'groupName', label: '分组' }, | ||||
| 				// { | ||||
| 				// 	_action: 'equipment-bind-group-show-alert', | ||||
| 				// 	label: '分组报警', | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| 				// 			const _this = this; | ||||
| 				// 			return h( | ||||
| 				// 				'el-button', | ||||
| 				// 				{ | ||||
| 				// 					props: { type: 'text' }, | ||||
| 				// 					on: { | ||||
| 				// 						click: function () { | ||||
| 				// 							console.log('inejctdata', _this.injectData); | ||||
| 				// 							_this.$emit('emitData', { | ||||
| 				// 								action: _this.injectData._action, | ||||
| 				// 								value: _this.injectData, | ||||
| 				// 							}); | ||||
| 				// 						}, | ||||
| 				// 					}, | ||||
| 				// 				}, | ||||
| 				// 				'查看报警' | ||||
| 				// 			); | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| @@ -162,6 +221,9 @@ export default { | ||||
| 						label: '设备', | ||||
| 						url: '/base/equipment/page?pageNo=1&pageSize=100', | ||||
| 						prop: 'equipmentId', | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| @@ -173,6 +235,9 @@ export default { | ||||
| 						// depends: '__product_line', // 依赖产线获取数据 | ||||
| 						// depends: 'productionLineId', | ||||
| 						prop: 'groupId', | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| @@ -190,6 +255,59 @@ export default { | ||||
| 			form: {}, | ||||
| 			// 表单校验 | ||||
| 			rules: {}, | ||||
| 			// | ||||
| 			alarmForm: { | ||||
| 				id: undefined, | ||||
| 				equipmentGroupCode: undefined, | ||||
| 				equipmentGroupName: undefined, | ||||
| 			}, | ||||
| 			editVisible: false, | ||||
| 			editMode: '', | ||||
| 			drawerBaseInfoRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备分组名称', | ||||
| 						prop: 'name', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						// bind: { | ||||
| 						// 	disabled: this.editMode == 'detail', // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备分组编码', | ||||
| 						prop: 'code', | ||||
| 						// url: '/base/equipment/getCode', | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			drawerListProps: [ | ||||
| 				{ | ||||
| 					prop: 'createTime', | ||||
| 					label: '添加时间', | ||||
| 					fixed: true, | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ width: 240, prop: 'code', label: '报警编码' }, | ||||
| 				{ | ||||
| 					width: 100, | ||||
| 					prop: 'type', | ||||
| 					label: '报警类型', | ||||
| 					filter: (val) => | ||||
| 						val != null ? ['-', '字符型', '布尔型', '-'][val] : '-', | ||||
| 				}, | ||||
| 				{ | ||||
| 					width: 90, | ||||
| 					prop: 'grade', | ||||
| 					label: '报警级别', | ||||
| 					filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL), | ||||
| 				}, | ||||
| 				{ width: 180, prop: 'alarmCode', label: '设备报警编码' }, | ||||
| 				{ width: 128, prop: 'plcParamName', label: '参数列名' }, | ||||
| 				{ width: 128, prop: 'alarmContent', label: '报警内容' }, | ||||
| 			], | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| @@ -223,7 +341,6 @@ export default { | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| 			this.loading = true; | ||||
| 			_// 执行查询 | ||||
| 			getEquipmentBindGroupPage(this.queryParams).then((response) => { | ||||
| 				this.list = response.data.list; | ||||
| 				this.total = response.data.total; | ||||
| @@ -293,11 +410,25 @@ export default { | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		// 查看报警 | ||||
| 		handleDetail(row) { | ||||
| 			const { equipmentId, equipmentName, groupCode, groupId, groupName, id } = | ||||
| 				row; | ||||
| 			// 打开抽屉 | ||||
| 			this.editMode = 'detail'; | ||||
| 			this.alarmForm.id = groupId; | ||||
| 			this.alarmForm.equipmentGroupCode = groupCode; | ||||
| 			this.alarmForm.equipmentGroupName = groupName; | ||||
| 			this.editVisible = true; | ||||
| 			this.$nextTick(() => { | ||||
| 				this.$refs['drawer'].init(); | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 删除按钮操作 */ | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除设备与分组绑定编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除该分组绑定?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentBindGroup(id); | ||||
| 				}) | ||||
|   | ||||
							
								
								
									
										225
									
								
								src/views/base/equipmentBindSection/dialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,225 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-09-11 15:55:13 | ||||
|     description: DialogForm for equipmentBindSection only | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="dataForm" | ||||
| 		label-width="100px" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="产线" | ||||
| 					prop="productionLineId" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.productionLineId" | ||||
| 						placeholder="请选择产线" | ||||
| 						filterable | ||||
| 						@change="handleProductlineChange"> | ||||
| 						<el-option | ||||
| 							v-for="opt in productionLineList" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="工段" | ||||
| 					prop="workshopSectionId" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.workshopSectionId" | ||||
| 						filterable | ||||
| 						placeholder="请选择工段" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in worksectionList" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="设备" | ||||
| 					prop="equipmentId" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.equipmentId" | ||||
| 						filterable | ||||
| 						placeholder="请选择设备" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in equipmentList" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工段排序" prop="sort"> | ||||
| 					<el-input-number | ||||
| 						v-model="dataForm.sort" | ||||
| 						filterable | ||||
| 						min="0" | ||||
| 						max="100" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入工段排序" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="产线数据类型" prop="lineDataType"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.lineDataType" | ||||
| 						placeholder="请选择产线数据类型" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in [ | ||||
| 								{ label: '无类型', value: 0 }, | ||||
| 								{ label: '进口统计', value: 1 }, | ||||
| 								{ label: '出口统计', value: 2 }, | ||||
| 							]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工段数据类型" prop="sectionDataType"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.sectionDataType" | ||||
| 						placeholder="请选择工段数据类型" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in [ | ||||
| 								{ label: '无类型', value: 0 }, | ||||
| 								{ label: '进口统计', value: 1 }, | ||||
| 								{ label: '出口统计', value: 2 }, | ||||
| 							]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 			productionLineList: [], | ||||
| 			equipmentList: [], | ||||
| 			worksectionList: [], | ||||
| 			dataFormCache: null, | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		Promise.all([this.getProductLineList(), this.getEquipmentList()]).then( | ||||
| 			() => { | ||||
| 				this.formLoading = false; | ||||
| 			} | ||||
| 		); | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		'dataForm.productionLineId': { | ||||
| 			handler: async function (plId) { | ||||
| 				if (plId) await this.getWorksectionList(plId); | ||||
| 			}, | ||||
| 			immediate: true, | ||||
| 		}, | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		async handleProductlineChange(id) { | ||||
| 			await this.getWorksectionList(id); | ||||
| 			this.dataForm.workshopSectionId = null; | ||||
| 			this.$emit('update', this.dataForm); | ||||
| 		}, | ||||
| 		// getCode | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 		// 获取产线列表 | ||||
| 		async getProductLineList() { | ||||
| 			const response = await this.$axios('/base/production-line/listAll'); | ||||
| 			this.productionLineList = response.data.map((item) => ({ | ||||
| 				label: item.name, | ||||
| 				value: item.id, | ||||
| 			})); | ||||
| 		}, | ||||
| 		// 获取设备列表 | ||||
| 		async getEquipmentList() { | ||||
| 			const response = await this.$axios( | ||||
| 				'/base/equipment/page?pageNo=1&pageSize=100' | ||||
| 			); | ||||
| 			this.equipmentList = response.data.list.map((item) => ({ | ||||
| 				label: item.name, | ||||
| 				value: item.id, | ||||
| 			})); | ||||
| 		}, | ||||
| 		// 获取工段列表 | ||||
| 		async getWorksectionList(plId) { | ||||
| 			const response = await this.$axios( | ||||
| 				'/base/workshop-section/listByParentId', | ||||
| 				{ | ||||
| 					params: { | ||||
| 						id: plId, | ||||
| 					}, | ||||
| 				} | ||||
| 			); | ||||
| 			this.worksectionList = response.data.map((item) => ({ | ||||
| 				label: item.name, | ||||
| 				value: item.id, | ||||
| 			})); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -17,6 +17,7 @@ | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
| @@ -37,7 +38,7 @@ | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
| @@ -53,10 +54,10 @@ import { | ||||
| } from '@/api/base/equipmentBindSection'; | ||||
| import moment from 'moment'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
|  | ||||
| import DialogForm from './dialogForm.vue'; | ||||
| export default { | ||||
| 	name: 'EquipmentBindSection', | ||||
| 	components: {}, | ||||
| 	components: { DialogForm }, | ||||
| 	mixins: [basicPageMixin], | ||||
| 	data() { | ||||
| 		return { | ||||
| @@ -83,28 +84,26 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'productionLine', label: '产线名称', align: 'center' }, | ||||
| 				{ prop: 'workshopSection', label: '工段名称', align: 'center' }, | ||||
| 				{ prop: 'equipment', label: '设备名称', align: 'center' }, | ||||
| 				{ prop: 'sort', label: '工段中排序', align: 'center' }, | ||||
| 				{ prop: 'productionLine', label: '产线名称' }, | ||||
| 				{ prop: 'workshopSection', label: '工段名称' }, | ||||
| 				{ prop: 'equipment', label: '设备名称' }, | ||||
| 				{ prop: 'sort', label: '工段中排序' }, | ||||
| 				{ | ||||
| 					prop: 'lineDataType', | ||||
| 					label: '产线数据类型', | ||||
| 					align: 'center', | ||||
| 					filter: (val) => | ||||
| 						val != null ? ['无类型', '进口计数', '出口计数'][val] : '-', | ||||
| 				}, | ||||
| 				{ | ||||
| 					prop: 'sectionDataType', | ||||
| 					label: '工段数据类型', | ||||
| 					align: 'center', | ||||
| 					filter: (val) => | ||||
| 						val != null ? ['无类型', '进口计数', '出口计数'][val] : '-', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	action: 'show-alert', | ||||
| 				// 	label: '报警', | ||||
| 				// 	align: 'center', | ||||
| 				// 	, | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| @@ -135,6 +134,8 @@ export default { | ||||
| 					label: '工段', | ||||
| 					placeholder: '请选择工段', | ||||
| 					param: 'workshopSectionId', | ||||
| 					selectOptions: [], | ||||
| 					filterable: true | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| @@ -181,8 +182,8 @@ export default { | ||||
| 						select: true, | ||||
| 						label: '工段', | ||||
| 						url: '/base/workshop-section/listByParentId', // 根据产线获取 | ||||
|             // depends: '__product_line', // 依赖产线获取数据 | ||||
|             depends: 'productionLineId', | ||||
| 						// depends: '__product_line', // 依赖产线获取数据 | ||||
| 						depends: 'productionLineId', | ||||
| 						prop: 'workshopSectionId', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| @@ -240,8 +241,24 @@ export default { | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getList(); | ||||
| 		this.initWorksection(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 准备工段数据 */ | ||||
| 		async initWorksection() { | ||||
| 			const { code, data } = await this.$axios({ | ||||
| 				url: '/base/workshop-section/listAll', | ||||
| 				method: 'get', | ||||
| 			}); | ||||
| 			if (code == 0) { | ||||
| 				this.searchBarFormConfig[0].selectOptions = data.map((item) => { | ||||
| 					return { | ||||
| 						name: item.name, | ||||
| 						id: item.id, | ||||
| 					}; | ||||
| 				}); | ||||
| 			} | ||||
| 		}, | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| 			this.loading = true; | ||||
| @@ -324,7 +341,7 @@ export default { | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除工段设备绑定编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除工段设备绑定设备名称为"' + row.equipment + '"的数据项?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentBindSection(id); | ||||
| 				}) | ||||
|   | ||||
							
								
								
									
										481
									
								
								src/views/base/equipmentGroup/components/BasicDrawer.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,481 @@ | ||||
| <!--  | ||||
|     filename: EquipmentDrawer.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-22 14:38:56 | ||||
|     description:  | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-drawer | ||||
| 		:visible="visible" | ||||
| 		:show-close="false" | ||||
| 		:wrapper-closable="false" | ||||
| 		class="drawer" | ||||
| 		custom-class="mes-drawer" | ||||
| 		size="60%" | ||||
| 		@closed="$emit('destroy')"> | ||||
| 		<SmallTitle slot="title"> | ||||
| 			{{ | ||||
| 				mode.includes('detail') | ||||
| 					? '详情' | ||||
| 					: mode.includes('edit') | ||||
| 					? '编辑' | ||||
| 					: '新增' | ||||
| 			}} | ||||
| 		</SmallTitle> | ||||
|  | ||||
| 		<div class="drawer-body flex"> | ||||
| 			<div class="drawer-body__content"> | ||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | ||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | ||||
|  | ||||
| 					<div class="form-part" v-if="section.key == 'base'"> | ||||
| 						<el-skeleton v-if="!showForm" animated /> | ||||
| 						<BaseInfoForm | ||||
| 							key="drawer-dialog-form" | ||||
| 							v-if="showForm" | ||||
| 							ref="form" | ||||
| 							:disabled="mode.includes('detail')" | ||||
| 							:dataForm="form" | ||||
| 							:rows="formRows" /> | ||||
| 					</div> | ||||
|  | ||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||
| 						<base-table | ||||
| 							v-loading="attrListLoading" | ||||
| 							:table-props="section.props" | ||||
| 							:page="attrQuery?.params.pageNo || 1" | ||||
| 							:limit="attrQuery?.params.pageSize || 10" | ||||
| 							:table-data="list" | ||||
| 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||
| 							@emitButtonClick="handleAddAttr" | ||||
| 							@emitFun="handleEmitFun"> | ||||
| 							<method-btn | ||||
| 								v-if="section.tableBtn" | ||||
| 								slot="handleBtn" | ||||
| 								label="操作" | ||||
| 								:method-list="tableBtn" | ||||
| 								@clickBtn="handleTableBtnClick" /> | ||||
| 						</base-table> | ||||
|  | ||||
| 						<!-- 分页组件 --> | ||||
| 						<pagination | ||||
| 							v-show="total > 0" | ||||
| 							:total="total" | ||||
| 							:page.sync="attrQuery.params.pageNo" | ||||
| 							:limit.sync="attrQuery.params.pageSize" | ||||
| 							@pagination="getAttrList" /> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 			</div> | ||||
|  | ||||
| 			<div class="drawer-body__footer"> | ||||
| 				<el-button style="" @click="handleCancel">取消</el-button> | ||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||
| 					编辑 | ||||
| 				</el-button> | ||||
| 				<el-button v-else type="primary" @click="handleCancel">确定</el-button> | ||||
| 				<!-- sections的第二项必须是 属性列表  --> | ||||
| 				<!-- <el-button | ||||
| 						v-if="sections[1].allowAdd" | ||||
| 						type="primary" | ||||
| 						@click="handleAddAttr"> | ||||
| 						添加属性 | ||||
| 					</el-button> --> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| 		<!-- 属性对话框 --> | ||||
| 		<base-dialog | ||||
| 			v-if="sections[1].allowAdd" | ||||
| 			:dialogTitle="attrTitle" | ||||
| 			:dialogVisible="attrFormVisible" | ||||
| 			width="45%" | ||||
| 			:append-to-body="true" | ||||
| 			custom-class="baseDialog" | ||||
| 			@close="closeAttrForm" | ||||
| 			@cancel="closeAttrForm" | ||||
| 			@confirm="submitAttrForm"> | ||||
| 			<DialogForm | ||||
| 				v-if="attrFormVisible" | ||||
| 				ref="attrForm" | ||||
| 				:disabled="mode.includes('detail')" | ||||
| 				v-model="attrForm" | ||||
| 				:rows="attrRows" /> | ||||
| 		</base-dialog> | ||||
| 	</el-drawer> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import BaseInfoForm from '@/components/DialogForm'; | ||||
| import DialogForm from './dialogForm'; | ||||
|  | ||||
| const SmallTitle = { | ||||
| 	name: 'SmallTitle', | ||||
| 	props: ['size'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	methods: {}, | ||||
| 	render: function (h) { | ||||
| 		return h( | ||||
| 			'span', | ||||
| 			{ | ||||
| 				class: 'small-title', | ||||
| 				style: { | ||||
| 					fontSize: '18px', | ||||
| 					lineHeight: | ||||
| 						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px', | ||||
| 					fontWeight: 500, | ||||
| 					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif', | ||||
| 				}, | ||||
| 			}, | ||||
| 			this.$slots.default | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	components: { SmallTitle, DialogForm, BaseInfoForm }, | ||||
| 	props: ['sections', 'defaultMode', 'dataId'], // dataId 作为一个通用的存放id的字段 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			mode: '', | ||||
| 			visible: false, | ||||
| 			showForm: false, | ||||
| 			total: 0, | ||||
| 			form: {}, | ||||
| 			list: [], | ||||
| 			attrTitle: '', | ||||
| 			attrForm: { | ||||
| 				id: null, | ||||
| 				equipmentGroupId: '', | ||||
| 				code: '', | ||||
| 				type: '', | ||||
| 				grade: '', | ||||
| 				alarmCode: '', | ||||
| 				alarmContent: '', | ||||
| 				plcParamName: '', | ||||
| 			}, | ||||
| 			attrFormVisible: false, | ||||
| 			attrRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '报警编码', // 自动生成 | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment-group-alarm/getCode', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '报警类型', // 固定选项 | ||||
| 						prop: 'type', | ||||
| 						options: [ | ||||
| 							{ label: '布尔型', value: 2 }, | ||||
| 							{ label: '字符型', value: 1 }, | ||||
| 						], | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '报警级别', // 字典 | ||||
| 						prop: 'grade', | ||||
| 						options: this.getDictDatas(this.DICT_TYPE.EQU_ALARM_LEVEL), | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备报警编码', // 对应到设备实际的报警编码 | ||||
| 						prop: 'alarmCode', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数列名', // 在实时数据库的列名 | ||||
| 						prop: 'plcParamName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '报警内容', | ||||
| 						prop: 'alarmContent', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			attrQuery: { | ||||
| 				params: { | ||||
| 					pageNo: 1, | ||||
| 					pageSize: 10, | ||||
| 				}, | ||||
| 			}, // 属性列表的请求 | ||||
| 			infoQuery: null, // 基本信息的请求 | ||||
| 			attrFormSubmitting: false, | ||||
| 			attrListLoading: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		formRows() { | ||||
| 			return this.sections[0].rows.map((row) => { | ||||
| 				return row.map((col) => { | ||||
| 					return { | ||||
| 						...col, | ||||
| 						bind: { | ||||
| 							// 详情 模式下,禁用各种输入 | ||||
| 							// disabled: this.mode == 'detail', | ||||
| 							disabled: true | ||||
| 						}, | ||||
| 					}; | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		tableBtn() { | ||||
| 			return this.mode == 'detail' ? [] : this.sections[1].tableBtn; | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.mode = this.defaultMode || 'detail'; | ||||
| 		for (const section of this.sections) { | ||||
| 			// 请求具体信息 | ||||
| 			if ('url' in section) { | ||||
| 				const query = { | ||||
| 					url: section.url, | ||||
| 					method: section.method || 'get', | ||||
| 					params: section.queryParams || null, | ||||
| 					data: section.data || null, | ||||
| 				}; | ||||
| 				// debugger; | ||||
| 				this.$axios(query).then(({ data }) => { | ||||
| 					if (section.key == 'base') { | ||||
| 						this.form = data; | ||||
| 						this.showForm = true; | ||||
| 						this.infoQuery = query; | ||||
| 					} else if (section.key == 'attrs') { | ||||
| 						this.attrQuery = query; | ||||
| 						this.list = data.list; | ||||
| 						this.total = data.total; | ||||
| 					} | ||||
| 				}); | ||||
| 			} | ||||
| 		} | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleTableBtnClick({ type, data }) { | ||||
| 			switch (type) { | ||||
| 				case 'edit': | ||||
| 					this.handleEditAttr(data.id); | ||||
| 					break; | ||||
| 				case 'delete': | ||||
| 					this.handleDeleteAttr(data.id); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		handleEmitFun(val) { | ||||
| 			console.log('handleEmitFun', val); | ||||
| 		}, | ||||
|  | ||||
| 		init() { | ||||
| 			this.visible = true; | ||||
| 		}, | ||||
|  | ||||
| 		async getAttrList() { | ||||
| 			this.attrListLoading = true; | ||||
| 			const res = await this.$axios(this.attrQuery); | ||||
| 			if (res.code == 0) { | ||||
| 				this.list = res.data.list; | ||||
| 				this.total = res.data.total; | ||||
| 			} | ||||
| 			this.attrListLoading = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 保存表单 | ||||
| 		handleSave() { | ||||
| 			this.$refs['form'][0].validate(async (valid) => { | ||||
| 				if (valid) { | ||||
| 					const isEdit = this.mode == 'edit'; | ||||
| 					await this.$axios({ | ||||
| 						url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], | ||||
| 						method: isEdit ? 'put' : 'post', | ||||
| 						data: this.form, | ||||
| 					}); | ||||
| 					this.$modal.msgSuccess(`${isEdit ? '更新' : '创建'}成功`); | ||||
| 					this.visible = false; | ||||
| 					this.$emit('refreshDataList'); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		handleCancel() { | ||||
| 			this.visible = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 开启编辑 | ||||
| 		toggleEdit() { | ||||
| 			this.mode = 'edit'; | ||||
| 		}, | ||||
|  | ||||
| 		// 新增属性 | ||||
| 		handleAddAttr() { | ||||
| 			if (!this.dataId) return this.$message.error('请先创建设备分组信息'); | ||||
| 			this.attrForm = { | ||||
| 				id: null, | ||||
| 				equipmentGroupId: this.dataId, | ||||
| 				code: '', | ||||
| 				type: '', | ||||
| 				grade: '', | ||||
| 				alarmCode: '', | ||||
| 				alarmContent: '', | ||||
| 				plcParamName: '', | ||||
| 			}; | ||||
| 			this.attrTitle = '添加设备分组报警'; | ||||
| 			this.attrFormVisible = true; | ||||
| 		}, | ||||
|  | ||||
| 		// 编辑属性 | ||||
| 		async handleEditAttr(attrId) { | ||||
| 			const res = await this.$axios({ | ||||
| 				url: this.sections[1].urlDetail, | ||||
| 				method: 'get', | ||||
| 				params: { id: attrId }, | ||||
| 			}); | ||||
| 			if (res.code == 0) { | ||||
| 				this.attrForm = res.data; | ||||
| 				this.attrTitle = '编辑设备分组报警'; | ||||
| 				this.attrFormVisible = true; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		// 删除属性 | ||||
| 		handleDeleteAttr(attrId) { | ||||
| 			this.$confirm('确定删除该分组报警?', '提示', { | ||||
| 				confirmButtonText: '确定', | ||||
| 				cancelButtonText: '取消', | ||||
| 				type: 'warning', | ||||
| 			}) | ||||
| 				.then(async () => { | ||||
| 					const res = await this.$axios({ | ||||
| 						url: this.sections[1].urlDelete, | ||||
| 						method: 'delete', | ||||
| 						params: { id: attrId }, | ||||
| 					}); | ||||
| 					if (res.code == 0) { | ||||
| 						this.$message({ | ||||
| 							message: '删除成功', | ||||
| 							type: 'success', | ||||
| 							duration: 1500, | ||||
| 							onClose: () => { | ||||
| 								this.getAttrList(); | ||||
| 							}, | ||||
| 						}); | ||||
| 					} | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
|  | ||||
| 		// 提交属性表 | ||||
| 		async submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 			}); | ||||
| 			const isEdit = this.attrForm.id != null; | ||||
| 			this.attrFormSubmitting = true; | ||||
| 			const res = await this.$axios({ | ||||
| 				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, | ||||
| 				method: isEdit ? 'put' : 'post', | ||||
| 				data: this.attrForm, | ||||
| 			}); | ||||
|  | ||||
| 			if (res.code == 0) { | ||||
| 				this.closeAttrForm(); | ||||
| 				this.$message({ | ||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 					type: 'success', | ||||
| 					duration: 1500, | ||||
| 					onClose: () => { | ||||
| 						this.getAttrList(); | ||||
| 					}, | ||||
| 				}); | ||||
| 			} | ||||
| 			this.attrFormSubmitting = false; | ||||
| 		}, | ||||
|  | ||||
| 		closeAttrForm() { | ||||
| 			this.attrFormVisible = false; | ||||
| 		}, | ||||
|  | ||||
| 		handleClick(raw) { | ||||
| 			if (raw.type === 'delete') { | ||||
| 				this.$confirm(`确定删除该报警?`, '提示', { | ||||
| 					confirmButtonText: '确定', | ||||
| 					cancelButtonText: '取消', | ||||
| 					type: 'warning', | ||||
| 				}) | ||||
| 					.then(() => { | ||||
| 						deleteProductAttr(raw.data.id).then(({ data }) => { | ||||
| 							this.$message({ | ||||
| 								message: '操作成功', | ||||
| 								type: 'success', | ||||
| 								duration: 1500, | ||||
| 								onClose: () => { | ||||
| 									this.getList(); | ||||
| 								}, | ||||
| 							}); | ||||
| 						}); | ||||
| 					}) | ||||
| 					.catch(() => {}); | ||||
| 			} else { | ||||
| 				this.addNew(raw.data.id); | ||||
| 			} | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped> | ||||
| .drawer >>> .el-drawer { | ||||
| 	border-radius: 8px 0 0 8px; | ||||
| } | ||||
|  | ||||
| .drawer >>> .el-drawer__header { | ||||
| 	margin: 0; | ||||
| 	padding: 32px 32px 24px; | ||||
| 	border-bottom: 1px solid #dcdfe6; | ||||
| 	margin-bottom: 0px; | ||||
| } | ||||
|  | ||||
| .small-title::before { | ||||
| 	content: ''; | ||||
| 	display: inline-block; | ||||
| 	vertical-align: top; | ||||
| 	width: 4px; | ||||
| 	height: 22px; | ||||
| 	border-radius: 1px; | ||||
| 	margin-right: 8px; | ||||
| 	background-color: #0b58ff; | ||||
| } | ||||
|  | ||||
| .drawer-body { | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	height: 100%; | ||||
| } | ||||
|  | ||||
| .drawer-body__content { | ||||
| 	flex: 1; | ||||
| 	/* background: #eee; */ | ||||
| 	padding: 20px 30px; | ||||
| 	overflow-y: auto; | ||||
| } | ||||
|  | ||||
| .drawer-body__footer { | ||||
| 	display: flex; | ||||
| 	justify-content: flex-end; | ||||
| 	padding: 18px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										187
									
								
								src/views/base/equipmentGroup/components/dialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,187 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-09-11 15:55:13 | ||||
|     description: DialogForm for equipmentBindSection only | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="dataForm" | ||||
| 		label-width="100px" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警编码" | ||||
| 					prop="code" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.code" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入工段排序" /> | ||||
| 				</el-form-item> | ||||
| 				<!-- 				 | ||||
| 				<el-form-item | ||||
| 					label="报警编码" | ||||
| 					prop="code" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.code" | ||||
| 						placeholder="请选择产线" | ||||
| 						@change="handleProductlineChange"> | ||||
| 						<el-option | ||||
| 							v-for="opt in productionLineList" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> --> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警类型" | ||||
| 					prop="type" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.type" | ||||
| 						placeholder="请选择报警类型" | ||||
| 						@change="handleTypeChange"> | ||||
| 						<el-option | ||||
| 							v-for="opt in [ | ||||
| 								{ label: '布尔型', value: 2 }, | ||||
| 								{ label: '字符型', value: 1 }, | ||||
| 							]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警级别" | ||||
| 					prop="grade" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.grade" | ||||
| 						placeholder="请选择报警级别" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in getDictDatas(DICT_TYPE.EQU_ALARM_LEVEL)" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					v-if="+dataForm.type == 1" | ||||
| 					label="设备报警编码" | ||||
| 					prop="alarmCode"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmCode" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入设备报警编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="参数列名" | ||||
| 					prop="plcParamName" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.plcParamName" | ||||
| 						placeholder="请输入参数列名" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警内容" | ||||
| 					prop="alarmContent" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmContent" | ||||
| 						placeholder="请输入报警内容" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.getCode('/base/equipment-group-alarm/getCode').then((code) => { | ||||
| 			this.formLoading = false; | ||||
| 			this.$emit('update', { | ||||
| 				...this.dataForm, | ||||
| 				code, | ||||
| 			}); | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		async handleTypeChange(id) { | ||||
| 			// debugger; | ||||
| 			this.dataForm.alarmCode = ''; | ||||
| 			this.$emit('update', this.dataForm); | ||||
| 		}, | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -17,6 +17,7 @@ | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
| @@ -39,6 +40,57 @@ | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
|  | ||||
| 		<!-- 抽屉 详情 --> | ||||
| 		<BasicDrawer | ||||
| 			v-if="editVisible" | ||||
| 			ref="drawer" | ||||
| 			:default-mode="editMode" | ||||
| 			:data-id="alarmForm.id" | ||||
| 			:sections="[ | ||||
| 				{ | ||||
| 					name: '基本信息', | ||||
| 					key: 'base', | ||||
| 					rows: drawerBaseInfoRows, | ||||
| 					url: '/base/equipment-group/get', | ||||
| 					urlUpdate: '/base/equipment-group/update', | ||||
| 					urlCreate: '/base/equipment-group/create', | ||||
| 					queryParams: { id: alarmForm.id }, | ||||
| 				}, | ||||
| 				{ | ||||
| 					name: '属性列表', | ||||
| 					key: 'attrs', | ||||
| 					props: drawerListProps, | ||||
| 					url: '/base/equipment-group-alarm/page', | ||||
| 					urlCreate: '/base/equipment-group-alarm/create', | ||||
| 					urlUpdate: '/base/equipment-group-alarm/update', | ||||
| 					urlDelete: '/base/equipment-group-alarm/delete', | ||||
| 					urlDetail: '/base/equipment-group-alarm/get', | ||||
| 					queryParams: { | ||||
| 						equipmentGroupId: alarmForm.id, | ||||
| 						pageNo: 1, | ||||
| 						pageSize: 10, | ||||
| 					}, | ||||
| 					tableBtn: [ | ||||
| 						this.$auth.hasPermi('base:equipment-group:update') | ||||
| 							? { | ||||
| 									type: 'edit', | ||||
| 									btnName: '修改', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 						this.$auth.hasPermi('base:equipment-group:delete') | ||||
| 							? { | ||||
| 									type: 'delete', | ||||
| 									btnName: '删除', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 					].filter((v) => v), | ||||
| 					allowAdd: true, | ||||
| 				}, | ||||
| 			]" | ||||
| 			@refreshDataList="getList" | ||||
| 			@cancel="editVisible = false" | ||||
| 			@destroy="editVisible = false" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| @@ -52,17 +104,27 @@ import { | ||||
| 	exportEquipmentGroupExcel, | ||||
| } from '@/api/base/equipmentGroup'; | ||||
| import moment from 'moment'; | ||||
| import { publicFormatter } from '@/utils/dict'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| // import { getAccessToken } from '@/utils/auth'; | ||||
| import BasicDrawer from './components/BasicDrawer.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentGroup', | ||||
| 	mixins: [basicPageMixin], | ||||
| 	components: {}, | ||||
| 	components: { BasicDrawer }, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			editVisible: false, | ||||
| 			editMode: '', | ||||
| 			searchBarKeys: ['name', 'code'], | ||||
| 			tableBtn: [ | ||||
| 				this.$auth.hasPermi('base:equipment-group:update') | ||||
| 					? { | ||||
| 							type: 'detail', | ||||
| 							btnName: '查看报警', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 				this.$auth.hasPermi('base:equipment-group:update') | ||||
| 					? { | ||||
| 							type: 'edit', | ||||
| @@ -84,38 +146,87 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备分组名称', align: 'center' }, | ||||
| 				{ prop: 'code', label: '检测分组编码', align: 'center' }, | ||||
| 				{ prop: 'remark', label: '备注', align: 'center' }, | ||||
| 				{ | ||||
| 					_action: 'equipment-group-show-alert', | ||||
| 					label: '报警', | ||||
| 					align: 'center', | ||||
| 					subcomponent: { | ||||
| 						props: ['injectData'], | ||||
| 						render: function (h) { | ||||
| 							const _this = this; | ||||
| 							return h( | ||||
| 								'el-button', | ||||
| 								{ | ||||
| 									props: { type: 'text', size: 'mini' }, | ||||
| 									on: { | ||||
| 										click: function () { | ||||
| 											console.log('inejctdata', _this.injectData); | ||||
| 											_this.$emit('emitData', { | ||||
| 												action: _this.injectData._action, | ||||
| 												// value: _this.injectData.id, | ||||
| 												value: _this.injectData, | ||||
| 											}); | ||||
| 										}, | ||||
| 									}, | ||||
| 								}, | ||||
| 								'查看报警' | ||||
| 							); | ||||
| 						}, | ||||
| 					}, | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备分组名称' }, | ||||
| 				{ prop: 'code', label: '设备分组编码' }, | ||||
| 				{ prop: 'remark', label: '备注' }, | ||||
| 				// { | ||||
| 				// 	_action: 'equipment-group-show-alert', | ||||
| 				// 	label: '报警', | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| 				// 			const _this = this; | ||||
| 				// 			return h( | ||||
| 				// 				'el-button', | ||||
| 				// 				{ | ||||
| 				// 					props: { type: 'text' }, | ||||
| 				// 					on: { | ||||
| 				// 						click: function () { | ||||
| 				// 							console.log('inejctdata', _this.injectData); | ||||
| 				// 							_this.$emit('emitData', { | ||||
| 				// 								action: _this.injectData._action, | ||||
| 				// 								// value: _this.injectData.id, | ||||
| 				// 								value: _this.injectData, | ||||
| 				// 							}); | ||||
| 				// 						}, | ||||
| 				// 					}, | ||||
| 				// 				}, | ||||
| 				// 				'查看报警' | ||||
| 				// 			); | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// }, | ||||
| 			], | ||||
| 			drawerBaseInfoRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备分组名称', | ||||
| 						prop: 'name', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						// bind: { | ||||
| 						// 	disabled: this.editMode == 'detail', // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备分组编码', | ||||
| 						prop: 'code', | ||||
| 						// url: '/base/equipment/getCode', | ||||
| 					} | ||||
| 				] | ||||
| 			], | ||||
| 			drawerListProps: [ | ||||
| 				{ | ||||
| 					prop: 'createTime', | ||||
| 					label: '添加时间', | ||||
| 					fixed: true, | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ width: 240, prop: 'code', label: '报警编码' }, | ||||
| 				{ | ||||
| 					width: 100, | ||||
| 					prop: 'type', | ||||
| 					label: '报警类型', | ||||
| 					filter: (val) => | ||||
| 						val != null ? ['-', '字符型', '布尔型', '-'][val] : '-', | ||||
| 				}, | ||||
| 				{ | ||||
| 					width: 90, | ||||
| 					prop: 'grade', | ||||
| 					label: '报警级别', | ||||
| 					filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL), | ||||
| 				}, | ||||
| 				{ width: 180, prop: 'alarmCode', label: '设备报警编码' }, | ||||
| 				{ width: 128, prop: 'plcParamName', label: '参数列名' }, | ||||
| 				{ width: 128, prop: 'alarmContent', label: '报警内容' }, | ||||
| 			], | ||||
| 			alarmForm: { | ||||
| 				id: undefined, | ||||
| 				equipmentGroupCode: undefined, | ||||
| 				equipmentGroupName: undefined, | ||||
| 			}, | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| @@ -127,7 +238,7 @@ export default { | ||||
| 					type: 'input', | ||||
| 					label: '分组编码', | ||||
| 					placeholder: '请输入设备分组编码', | ||||
| 					param: 'codes', | ||||
| 					param: 'code', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| @@ -172,6 +283,7 @@ export default { | ||||
| 						label: '分组编码', | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment-group/getCode', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| @@ -298,15 +410,25 @@ export default { | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		// 查看报警 | ||||
| 		handleDetail(row) { | ||||
| 			// debugger; | ||||
| 			const { id, code, name, createTime } = row; | ||||
| 			// 打开抽屉 | ||||
| 			this.editMode = 'detail'; | ||||
| 			this.alarmForm.id = id; | ||||
| 			this.alarmForm.equipmentGroupCode = code; | ||||
| 			this.alarmForm.equipmentGroupName = name; | ||||
| 			this.editVisible = true; | ||||
| 			this.$nextTick(() => { | ||||
| 				this.$refs['drawer'].init(); | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 删除按钮操作 */ | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm( | ||||
| 					'是否确认删除设备分组(用于同类型不同厂家的设备区分)编号为"' + | ||||
| 						id + | ||||
| 						'"的数据项?' | ||||
| 				) | ||||
| 				.confirm('是否确认删除设备分组 "' + row.name + '"?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentGroup(id); | ||||
| 				}) | ||||
|   | ||||
							
								
								
									
										187
									
								
								src/views/base/equipmentGroupAlarm/dialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,187 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-09-11 15:55:13 | ||||
|     description: DialogForm for equipmentBindSection only | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="dataForm" | ||||
| 		label-width="100px" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警编码" | ||||
| 					prop="code" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.code" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入工段排序" /> | ||||
| 				</el-form-item> | ||||
| 				<!-- 				 | ||||
| 						<el-form-item | ||||
| 						label="报警编码" | ||||
| 						prop="code" | ||||
| 						:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 						<el-select | ||||
| 						v-model="dataForm.code" | ||||
| 						placeholder="请选择产线" | ||||
| 						@change="handleProductlineChange"> | ||||
| 						<el-option | ||||
| 						v-for="opt in productionLineList" | ||||
| 						:key="opt.value" | ||||
| 						:label="opt.label" | ||||
| 						:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> --> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警类型" | ||||
| 					prop="type" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.type" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请选择报警类型" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in [ | ||||
| 								{ label: '布尔型', value: 2 }, | ||||
| 								{ label: '字符型', value: 1 }, | ||||
| 							]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警级别" | ||||
| 					prop="grade" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-select | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.grade" | ||||
| 						placeholder="请选择报警级别" | ||||
| 						@change="$emit('update', dataForm)"> | ||||
| 						<el-option | ||||
| 							v-for="opt in getDictDatas(DICT_TYPE.EQU_ALARM_LEVEL)" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
|  | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					v-if="+dataForm.type == 1" | ||||
| 					label="设备报警编码" | ||||
| 					prop="alarmCode"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmCode" | ||||
| 						@change="$emit('update', dataForm)" | ||||
| 						placeholder="请输入设备报警编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="参数列名" | ||||
| 					prop="plcParamName" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.plcParamName" | ||||
| 						placeholder="请输入参数列名" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item | ||||
| 					label="报警内容" | ||||
| 					prop="alarmContent" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						:disabled="disabled" | ||||
| 						v-model="dataForm.alarmContent" | ||||
| 						placeholder="请输入报警内容" | ||||
| 						@change="$emit('update', dataForm)"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.getCode('/base/equipment-group-alarm/getCode').then((code) => { | ||||
| 			this.formLoading = false; | ||||
| 			this.$emit('update', { | ||||
| 				...this.dataForm, | ||||
| 				code, | ||||
| 			}); | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		async handleProductlineChange(id) { | ||||
| 			await this.getWorksectionList(id); | ||||
| 			this.dataForm.workshopSectionId = null; | ||||
| 			this.$emit('update', this.dataForm); | ||||
| 		}, | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -17,6 +17,7 @@ | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
| @@ -37,7 +38,7 @@ | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
| @@ -54,10 +55,11 @@ import { | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
| import moment from 'moment'; | ||||
| import { publicFormatter } from '@/utils/dict'; | ||||
| import DialogForm from './dialogForm.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentGroupAlarm', | ||||
| 	components: {}, | ||||
| 	components: { DialogForm }, | ||||
| 	mixins: [basicPageMixin], | ||||
| 	data() { | ||||
| 		return { | ||||
| @@ -84,22 +86,27 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'code', label: '报警编码', align: 'center' }, | ||||
| 				{ prop: 'type', label: '报警类型', align: 'center' }, | ||||
| 				{  width: 240, prop: 'code', label: '报警编码' }, | ||||
| 				{ | ||||
| 					prop: 'type', | ||||
| 					label: '报警类型', | ||||
| 					filter: (val) => | ||||
| 						val != null ? ['-', '字符型', '布尔型', '-'][val] : '-', | ||||
| 				}, | ||||
| 				{ | ||||
| 					prop: 'grade', | ||||
| 					label: '报警级别', | ||||
| 					align: 'center', | ||||
| 					filter: publicFormatter(this.DICT_TYPE.EQU_ALARM_LEVEL), | ||||
| 				}, | ||||
| 				{ prop: 'alarmCode', label: '设备报警编码', align: 'center' }, | ||||
| 				{ prop: 'plcParamName', label: '参数列名', align: 'center' }, | ||||
| 				{ prop: 'alarmContent', label: '报警内容', align: 'center' }, | ||||
| 				{ prop: 'alarmCode', label: '设备报警编码' }, | ||||
| 				{ prop: 'plcParamName', label: '参数列名' }, | ||||
| 				{ prop: 'alarmContent', label: '报警内容' }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| 					label: '设备分组编码', | ||||
| 					width: '220', | ||||
| 					placeholder: '/', | ||||
| 					param: 'equipmentGroupCode', | ||||
| 					defaultSelect: null, | ||||
| @@ -181,14 +188,14 @@ export default { | ||||
| 			}, | ||||
| 			// 表单参数 | ||||
| 			form: { | ||||
| 				id: undefined, | ||||
| 				equipmentGroupId: undefined, | ||||
| 				code: undefined, | ||||
| 				type: undefined, | ||||
| 				grade: undefined, | ||||
| 				alarmCode: undefined, | ||||
| 				alarmContent: undefined, | ||||
| 				plcParamName: undefined, | ||||
| 				id: null, | ||||
| 				equipmentGroupId: null, | ||||
| 				code: null, | ||||
| 				type: null, | ||||
| 				grade: null, | ||||
| 				alarmCode: null, | ||||
| 				alarmContent: null, | ||||
| 				plcParamName: null, | ||||
| 			}, | ||||
| 			// // 表单校验 | ||||
| 			// rules: { | ||||
| @@ -249,14 +256,14 @@ export default { | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| 				id: undefined, | ||||
| 				equipmentGroupId: undefined, | ||||
| 				code: undefined, | ||||
| 				type: undefined, | ||||
| 				grade: undefined, | ||||
| 				alarmCode: undefined, | ||||
| 				alarmContent: undefined, | ||||
| 				plcParamName: undefined, | ||||
| 				id: null, | ||||
| 				equipmentGroupId: null, | ||||
| 				code: null, | ||||
| 				type: null, | ||||
| 				grade: null, | ||||
| 				alarmCode: null, | ||||
| 				alarmContent: null, | ||||
| 				plcParamName: null, | ||||
| 			}; | ||||
| 			this.resetForm('form'); | ||||
| 		}, | ||||
| @@ -321,7 +328,7 @@ export default { | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除设备分组报警明细编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除该报警?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentGroupAlarm(id); | ||||
| 				}) | ||||
|   | ||||
| @@ -1,233 +1,378 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
| 	<div class="app-container"> | ||||
| 		<!-- 搜索工作栏 --> | ||||
| 		<SearchBar | ||||
| 			:formConfigs="searchBarFormConfig" | ||||
| 			ref="search-bar" | ||||
| 			@headBtnClick="handleSearchBarBtnClick" /> | ||||
|  | ||||
|     <!-- 搜索工作栏 --> | ||||
|     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="实时关联表实际名称" prop="plcTableName"> | ||||
|         <el-input v-model="queryParams.plcTableName" placeholder="请输入实时关联表实际名称" clearable @keyup.enter.native="handleQuery"/> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="标识名称" prop="name"> | ||||
|         <el-input v-model="queryParams.name" placeholder="请输入标识名称" clearable @keyup.enter.native="handleQuery"/> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button> | ||||
|         <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button> | ||||
|       </el-form-item> | ||||
|     </el-form> | ||||
| 		<!-- 列表 --> | ||||
| 		<base-table | ||||
| 			:table-props="tableProps" | ||||
| 			:page="queryParams.pageNo" | ||||
| 			:limit="queryParams.pageSize" | ||||
| 			:table-data="list" | ||||
| 			ref="pageTable" | ||||
| 			@emitFun="handleEmitFun"> | ||||
| 			<method-btn | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
|  | ||||
|     <!-- 操作工具栏 --> | ||||
|     <el-row :gutter="10" class="mb8"> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" | ||||
|                    v-hasPermi="['base:equipment-plc:create']">新增</el-button> | ||||
|       </el-col> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading" | ||||
|                    v-hasPermi="['base:equipment-plc:export']">导出</el-button> | ||||
|       </el-col> | ||||
|       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||||
|     </el-row> | ||||
| 		<!-- 分页组件 --> | ||||
| 		<pagination | ||||
| 			v-show="total > 0" | ||||
| 			:total="total" | ||||
| 			:page.sync="queryParams.pageNo" | ||||
| 			:limit.sync="queryParams.pageSize" | ||||
| 			@pagination="getList" /> | ||||
|  | ||||
|     <!-- 列表 --> | ||||
|     <el-table v-loading="loading" :data="list"> | ||||
|       <el-table-column label="id" align="center" prop="id" /> | ||||
|       <el-table-column label="实时关联表实际名称" align="center" prop="plcTableName" /> | ||||
|       <el-table-column label="关联表编码" align="center" prop="code" /> | ||||
|       <el-table-column label="标识名称" align="center" prop="name" /> | ||||
|       <el-table-column label="英文标识名称" align="center" prop="enName" /> | ||||
|       <el-table-column label="描述" align="center" prop="description" /> | ||||
|       <el-table-column label="是否采集 0 代表不采集, 1 代表采集" align="center" prop="collection" /> | ||||
|       <el-table-column label="创建时间" align="center" prop="createTime" width="180"> | ||||
|         <template v-slot="scope"> | ||||
|           <span>{{ parseTime(scope.row.createTime) }}</span> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|       <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||||
|         <template v-slot="scope"> | ||||
|           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc:update']">修改</el-button> | ||||
|           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc:delete']">删除</el-button> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|     </el-table> | ||||
|     <!-- 分页组件 --> | ||||
|     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize" | ||||
|                 @pagination="getList"/> | ||||
|  | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body> | ||||
|       <el-form ref="form" :model="form" :rules="rules" label-width="80px"> | ||||
|         <el-form-item label="实时关联表实际名称" prop="plcTableName"> | ||||
|           <el-input v-model="form.plcTableName" placeholder="请输入实时关联表实际名称" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="关联表编码" prop="code"> | ||||
|           <el-input v-model="form.code" placeholder="请输入关联表编码" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="标识名称" prop="name"> | ||||
|           <el-input v-model="form.name" placeholder="请输入标识名称" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="英文标识名称" prop="enName"> | ||||
|           <el-input v-model="form.enName" placeholder="请输入英文标识名称" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="描述" prop="description"> | ||||
|           <el-input v-model="form.description" placeholder="请输入描述" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="是否采集 0 代表不采集, 1 代表采集" prop="collection"> | ||||
|           <el-input v-model="form.collection" placeholder="请输入是否采集 0 代表不采集, 1 代表采集" /> | ||||
|         </el-form-item> | ||||
|       </el-form> | ||||
|       <div slot="footer" class="dialog-footer"> | ||||
|         <el-button type="primary" @click="submitForm">确 定</el-button> | ||||
|         <el-button @click="cancel">取 消</el-button> | ||||
|       </div> | ||||
|     </el-dialog> | ||||
|   </div> | ||||
| 		<!-- 对话框(添加 / 修改) --> | ||||
| 		<base-dialog | ||||
| 			:dialogTitle="title" | ||||
| 			:dialogVisible="open" | ||||
| 			width="700px" | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { createEquipmentPlc, updateEquipmentPlc, deleteEquipmentPlc, getEquipmentPlc, getEquipmentPlcPage, exportEquipmentPlcExcel } from "@/api/base/equipmentPlc"; | ||||
| import { | ||||
| 	createEquipmentPlc, | ||||
| 	updateEquipmentPlc, | ||||
| 	deleteEquipmentPlc, | ||||
| 	getEquipmentPlc, | ||||
| 	getEquipmentPlcPage, | ||||
| 	exportEquipmentPlcExcel, | ||||
| } from '@/api/base/equipmentPlc'; | ||||
| import moment from 'moment'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
|  | ||||
| const switchBtn = { | ||||
| 	name: 'SwitchBtn', | ||||
| 	props: ['injectData'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		active() { | ||||
| 			return +this.injectData[this.injectData.prop] == 1 ? true : false; | ||||
| 		}, | ||||
| 	}, | ||||
| 	methods: {}, | ||||
| 	render: function (h) { | ||||
| 		return h( | ||||
| 			'el-switch', | ||||
| 			{ | ||||
| 				props: { | ||||
| 					value: this.active, | ||||
| 				}, | ||||
| 				on: { | ||||
| 					change: (newVal) => { | ||||
| 						this.$emit('emitData', { | ||||
| 							action: 'update-collect', | ||||
| 							payload: { | ||||
| 								...this.injectData, | ||||
| 								collection: newVal ? 1 : 0, | ||||
| 							}, | ||||
| 						}); | ||||
| 					}, | ||||
| 				}, | ||||
| 			}, | ||||
| 			null | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
|   name: "EquipmentPlc", | ||||
|   components: { | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 导出遮罩层 | ||||
|       exportLoading: false, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 实时数据采集配置列表 | ||||
|       list: [], | ||||
|       // 弹出层标题 | ||||
|       title: "", | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNo: 1, | ||||
|         pageSize: 10, | ||||
|         plcTableName: null, | ||||
|         name: null, | ||||
|       }, | ||||
|       // 表单参数 | ||||
|       form: {}, | ||||
|       // 表单校验 | ||||
|       rules: { | ||||
|         plcTableName: [{ required: true, message: "实时关联表实际名称不能为空", trigger: "blur" }], | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|   }, | ||||
|   methods: { | ||||
|     /** 查询列表 */ | ||||
|     getList() { | ||||
|       this.loading = true; | ||||
|       // 执行查询 | ||||
|       getEquipmentPlcPage(this.queryParams).then(response => { | ||||
|         this.list = response.data.list; | ||||
|         this.total = response.data.total; | ||||
|         this.loading = false; | ||||
|       }); | ||||
|     }, | ||||
|     /** 取消按钮 */ | ||||
|     cancel() { | ||||
|       this.open = false; | ||||
|       this.reset(); | ||||
|     }, | ||||
|     /** 表单重置 */ | ||||
|     reset() { | ||||
|       this.form = { | ||||
|         id: undefined, | ||||
|         plcTableName: undefined, | ||||
|         code: undefined, | ||||
|         name: undefined, | ||||
|         enName: undefined, | ||||
|         description: undefined, | ||||
|         collection: undefined, | ||||
|       }; | ||||
|       this.resetForm("form"); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     handleQuery() { | ||||
|       this.queryParams.pageNo = 1; | ||||
|       this.getList(); | ||||
|     }, | ||||
|     /** 重置按钮操作 */ | ||||
|     resetQuery() { | ||||
|       this.resetForm("queryForm"); | ||||
|       this.handleQuery(); | ||||
|     }, | ||||
|     /** 新增按钮操作 */ | ||||
|     handleAdd() { | ||||
|       this.reset(); | ||||
|       this.open = true; | ||||
|       this.title = "添加实时数据采集配置"; | ||||
|     }, | ||||
|     /** 修改按钮操作 */ | ||||
|     handleUpdate(row) { | ||||
|       this.reset(); | ||||
|       const id = row.id; | ||||
|       getEquipmentPlc(id).then(response => { | ||||
|         this.form = response.data; | ||||
|         this.open = true; | ||||
|         this.title = "修改实时数据采集配置"; | ||||
|       }); | ||||
|     }, | ||||
|     /** 提交按钮 */ | ||||
|     submitForm() { | ||||
|       this.$refs["form"].validate(valid => { | ||||
|         if (!valid) { | ||||
|           return; | ||||
|         } | ||||
|         // 修改的提交 | ||||
|         if (this.form.id != null) { | ||||
|           updateEquipmentPlc(this.form).then(response => { | ||||
|             this.$modal.msgSuccess("修改成功"); | ||||
|             this.open = false; | ||||
|             this.getList(); | ||||
|           }); | ||||
|           return; | ||||
|         } | ||||
|         // 添加的提交 | ||||
|         createEquipmentPlc(this.form).then(response => { | ||||
|           this.$modal.msgSuccess("新增成功"); | ||||
|           this.open = false; | ||||
|           this.getList(); | ||||
|         }); | ||||
|       }); | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const id = row.id; | ||||
|       this.$modal.confirm('是否确认删除实时数据采集配置编号为"' + id + '"的数据项?').then(function() { | ||||
|           return deleteEquipmentPlc(id); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.$modal.msgSuccess("删除成功"); | ||||
|         }).catch(() => {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       // 处理查询参数 | ||||
|       let params = {...this.queryParams}; | ||||
|       params.pageNo = undefined; | ||||
|       params.pageSize = undefined; | ||||
|       this.$modal.confirm('是否确认导出所有实时数据采集配置数据项?').then(() => { | ||||
|           this.exportLoading = true; | ||||
|           return exportEquipmentPlcExcel(params); | ||||
|         }).then(response => { | ||||
|           this.$download.excel(response, '实时数据采集配置.xls'); | ||||
|           this.exportLoading = false; | ||||
|         }).catch(() => {}); | ||||
|     } | ||||
|   } | ||||
| 	name: 'EquipmentPlc', | ||||
| 	mixins: [basicPageMixin], | ||||
| 	components: {}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			tableKey: Math.random(), | ||||
| 			searchBarKeys: ['name', 'plcTableName'], | ||||
| 			tableBtn: [ | ||||
| 				this.$auth.hasPermi('base:equipment-plc:update') | ||||
| 					? { | ||||
| 							type: 'edit', | ||||
| 							btnName: '修改', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 				this.$auth.hasPermi('base:equipment-plc:delete') | ||||
| 					? { | ||||
| 							type: 'delete', | ||||
| 							btnName: '删除', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 			].filter((v) => v), | ||||
| 			tableProps: [ | ||||
| 				// { | ||||
| 				// 	prop: 'createTime', | ||||
| 				// 	label: '添加时间', | ||||
| 				// 	fixed: true, | ||||
| 				// 	width: 180, | ||||
| 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				// }, | ||||
| 				{ prop: 'code', label: '编码' }, | ||||
| 				{ prop: 'plcTableName', label: '关联表名' }, | ||||
| 				{ prop: 'name', label: '标识名称' }, | ||||
| 				{ prop: 'enName', label: '英文名称' }, | ||||
| 				{ | ||||
| 					prop: 'collection', | ||||
| 					label: '是否采集', | ||||
| 					subcomponent: switchBtn, | ||||
| 				}, | ||||
| 				{ prop: 'description', label: '描述' }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| 					label: '表名', | ||||
| 					placeholder: '请输入表名', | ||||
| 					param: 'plcTableName', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| 					label: '标识', | ||||
| 					placeholder: '请输入标识', | ||||
| 					param: 'name', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '查询', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					// type: this.$auth.hasPermi('base:equipment-plc:create') | ||||
| 					// 	? 'button' | ||||
| 					// 	: '', | ||||
| 					type: 'button', | ||||
| 					btnName: '新增', | ||||
| 					name: 'add', | ||||
| 					plain: true, | ||||
| 					color: 'success', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: this.$auth.hasPermi('base:equipment-plc:export') ? 'button' : '', | ||||
| 				// 	btnName: '导出', | ||||
| 				// 	name: 'export', | ||||
| 				// 	color: 'warning', | ||||
| 				// }, | ||||
| 			], | ||||
| 			rows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '关联表名', | ||||
| 						prop: 'plcTableName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						// bind: { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '编码', | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment-group/getCode', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '标识', | ||||
| 						prop: 'name', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						// bind: { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '英文名', | ||||
| 						prop: 'enName', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						switch: true, | ||||
| 						label: '是否采集', // 是否采集 0 代表不采集, 1 代表采集 | ||||
| 						prop: 'collection', | ||||
| 						value: 1, | ||||
| 						bind: { | ||||
| 							'active-value': 1, | ||||
| 							'inactive-value': 0, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						textarea: true, | ||||
| 						label: '描述', | ||||
| 						prop: 'description', | ||||
| 						bind: { | ||||
| 							placeholder: '请输入备注', | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			// 是否显示弹出 | ||||
| 			open: false, | ||||
| 			// 查询参数 | ||||
| 			queryParams: { | ||||
| 				pageNo: 1, | ||||
| 				pageSize: 10, | ||||
| 				plcTableName: null, | ||||
| 				name: null, | ||||
| 			}, | ||||
| 			// 表单参数 | ||||
| 			form: {}, | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getList(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 覆盖 handleEmitFun 的默认实现 */ | ||||
| 		handleEmitFun({ action, payload }) { | ||||
| 			switch (action) { | ||||
| 				case 'update-collect': | ||||
| 					this.reset(); | ||||
| 					const tempForm = {}; | ||||
| 					Object.keys(this.form).forEach((key) => { | ||||
| 						tempForm[key] = payload[key]; | ||||
| 					}); | ||||
| 					updateEquipmentPlc(tempForm).then((response) => { | ||||
| 						this.$modal.msgSuccess('修改成功'); | ||||
| 						this.open = false; | ||||
| 						this.getList(); | ||||
| 					}); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| 			this.loading = true; | ||||
| 			// 执行查询 | ||||
| 			getEquipmentPlcPage(this.queryParams).then((response) => { | ||||
| 				this.list = response.data.list; | ||||
| 				this.total = response.data.total; | ||||
| 				this.loading = false; | ||||
| 				// this.tableKey = Math.random(); // method 1 | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 取消按钮 */ | ||||
| 		cancel() { | ||||
| 			this.open = false; | ||||
| 			this.reset(); | ||||
| 		}, | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| 				id: undefined, | ||||
| 				plcTableName: undefined, | ||||
| 				code: undefined, | ||||
| 				name: undefined, | ||||
| 				enName: undefined, | ||||
| 				description: undefined, | ||||
| 				collection: undefined, | ||||
| 			}; | ||||
| 			this.resetForm('form'); | ||||
| 		}, | ||||
| 		/** 搜索按钮操作 */ | ||||
| 		handleQuery() { | ||||
| 			this.queryParams.pageNo = 1; | ||||
| 			this.getList(); | ||||
| 		}, | ||||
| 		/** 重置按钮操作 */ | ||||
| 		resetQuery() { | ||||
| 			this.resetForm('queryForm'); | ||||
| 			this.handleQuery(); | ||||
| 		}, | ||||
| 		/** 新增按钮操作 */ | ||||
| 		handleAdd() { | ||||
| 			this.reset(); | ||||
| 			this.open = true; | ||||
| 			this.title = '添加实时数据采集配置'; | ||||
| 		}, | ||||
| 		/** 修改按钮操作 */ | ||||
| 		handleUpdate(row) { | ||||
| 			this.reset(); | ||||
| 			const id = row.id; | ||||
| 			getEquipmentPlc(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| 				this.open = true; | ||||
| 				this.title = '修改实时数据采集配置'; | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 提交按钮 */ | ||||
| 		submitForm() { | ||||
| 			this.$refs['form'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 				// 修改的提交 | ||||
| 				if (this.form.id != null) { | ||||
| 					updateEquipmentPlc(this.form).then((response) => { | ||||
| 						this.$modal.msgSuccess('修改成功'); | ||||
| 						this.open = false; | ||||
| 						this.getList(); | ||||
| 					}); | ||||
| 					return; | ||||
| 				} | ||||
| 				// 添加的提交 | ||||
| 				createEquipmentPlc(this.form).then((response) => { | ||||
| 					this.$modal.msgSuccess('新增成功'); | ||||
| 					this.open = false; | ||||
| 					this.getList(); | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 删除按钮操作 */ | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除实时数据采集配置编号为"' + id + '"的数据项?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentPlc(id); | ||||
| 				}) | ||||
| 				.then(() => { | ||||
| 					this.getList(); | ||||
| 					this.$modal.msgSuccess('删除成功'); | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
| 		/** 导出按钮操作 */ | ||||
| 		handleExport() { | ||||
| 			// 处理查询参数 | ||||
| 			let params = { ...this.queryParams }; | ||||
| 			params.pageNo = undefined; | ||||
| 			params.pageSize = undefined; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认导出所有实时数据采集配置数据项?') | ||||
| 				.then(() => { | ||||
| 					this.exportLoading = true; | ||||
| 					return exportEquipmentPlcExcel(params); | ||||
| 				}) | ||||
| 				.then((response) => { | ||||
| 					this.$download.excel(response, '实时数据采集配置.xls'); | ||||
| 					this.exportLoading = false; | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|   | ||||
							
								
								
									
										531
									
								
								src/views/base/equipmentPlcConnect/components/BasicDrawer.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,531 @@ | ||||
| <!--  | ||||
|     filename: EquipmentDrawer.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-22 14:38:56 | ||||
|     description:  | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-drawer | ||||
| 		:visible="visible" | ||||
| 		:show-close="false" | ||||
| 		:wrapper-closable="false" | ||||
| 		class="drawer" | ||||
| 		custom-class="mes-drawer" | ||||
| 		size="60%" | ||||
| 		@closed="$emit('destroy')"> | ||||
| 		<SmallTitle slot="title"> | ||||
| 			{{ | ||||
| 				mode.includes('detail') | ||||
| 					? '详情' | ||||
| 					: mode.includes('edit') | ||||
| 					? '编辑' | ||||
| 					: '新增' | ||||
| 			}} | ||||
| 		</SmallTitle> | ||||
|  | ||||
| 		<div class="drawer-body flex"> | ||||
| 			<div class="drawer-body__content"> | ||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | ||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | ||||
|  | ||||
| 					<div class="form-part" v-if="section.key == 'base'"> | ||||
| 						<el-skeleton v-if="!showForm" animated /> | ||||
| 						<BaseInfoForm | ||||
| 							key="drawer-dialog-form" | ||||
| 							v-if="showForm" | ||||
| 							ref="form" | ||||
| 							:disabled="mode.includes('detail')" | ||||
| 							:dataForm="form" | ||||
| 							:rows="formRows" /> | ||||
| 					</div> | ||||
|  | ||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||
| 						<base-table | ||||
| 							v-loading="attrListLoading" | ||||
| 							:table-props="section.props" | ||||
| 							:page="attrQuery?.params.pageNo || 1" | ||||
| 							:limit="attrQuery?.params.pageSize || 10" | ||||
| 							:table-data="list" | ||||
| 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||
| 							@emitButtonClick="handleAddAttr" | ||||
| 							@emitFun="handleEmitFun"> | ||||
| 							<method-btn | ||||
| 								v-if="section.tableBtn" | ||||
| 								slot="handleBtn" | ||||
| 								label="操作" | ||||
| 								:method-list="tableBtn" | ||||
| 								@clickBtn="handleTableBtnClick" /> | ||||
| 						</base-table> | ||||
|  | ||||
| 						<!-- 分页组件 --> | ||||
| 						<pagination | ||||
| 							v-show="total > 0" | ||||
| 							:total="total" | ||||
| 							:page.sync="attrQuery.params.pageNo" | ||||
| 							:limit.sync="attrQuery.params.pageSize" | ||||
| 							@pagination="getAttrList" /> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 			</div> | ||||
|  | ||||
| 			<div class="drawer-body__footer"> | ||||
| 				<el-button style="" @click="handleCancel">取消</el-button> | ||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||
| 					编辑 | ||||
| 				</el-button> | ||||
| 				<el-button v-else type="primary" @click="handleCancel">确定</el-button> | ||||
| 				<!-- sections的第二项必须是 属性列表  --> | ||||
| 				<!-- <el-button | ||||
| 						v-if="sections[1].allowAdd" | ||||
| 						type="primary" | ||||
| 						@click="handleAddAttr"> | ||||
| 						添加属性 | ||||
| 					</el-button> --> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| 		<!-- 属性对话框 --> | ||||
| 		<base-dialog | ||||
| 			v-if="sections[1].allowAdd" | ||||
| 			:dialogTitle="attrTitle" | ||||
| 			:dialogVisible="attrFormVisible" | ||||
| 			width="45%" | ||||
| 			:append-to-body="true" | ||||
| 			custom-class="baseDialog" | ||||
| 			@close="closeAttrForm" | ||||
| 			@cancel="closeAttrForm" | ||||
| 			@confirm="submitAttrForm"> | ||||
| 			<DialogForm | ||||
| 				v-if="attrFormVisible" | ||||
| 				ref="attrForm" | ||||
| 				:disabled="mode.includes('detail')" | ||||
| 				v-model="attrForm" | ||||
| 				:rows="attrRows" /> | ||||
| 		</base-dialog> | ||||
| 	</el-drawer> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import BaseInfoForm from '@/components/DialogForm'; | ||||
|  | ||||
| const SmallTitle = { | ||||
| 	name: 'SmallTitle', | ||||
| 	props: ['size'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	methods: {}, | ||||
| 	render: function (h) { | ||||
| 		return h( | ||||
| 			'span', | ||||
| 			{ | ||||
| 				class: 'small-title', | ||||
| 				style: { | ||||
| 					fontSize: '18px', | ||||
| 					lineHeight: | ||||
| 						this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px', | ||||
| 					fontWeight: 500, | ||||
| 					fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif', | ||||
| 				}, | ||||
| 			}, | ||||
| 			this.$slots.default | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	components: { SmallTitle, DialogForm: BaseInfoForm, BaseInfoForm }, | ||||
| 	props: ['sections', 'defaultMode', 'infoData'], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			mode: '', | ||||
| 			visible: false, | ||||
| 			showForm: false, | ||||
| 			total: 0, | ||||
| 			form: {}, | ||||
| 			list: [], | ||||
| 			attrTitle: '', | ||||
| 			attrForm: { | ||||
| 				id: null, | ||||
| 				name: '', | ||||
| 				plcParamName: '', | ||||
| 				unit: '', | ||||
| 				collection: 1, | ||||
| 				minValue: '', | ||||
| 				maxValue: '', | ||||
| 				defaultValue: '', | ||||
| 				description: '', | ||||
| 				remark: '', | ||||
| 				alarmContent: '', | ||||
| 			}, | ||||
| 			attrFormVisible: false, | ||||
| 			attrRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数列名', | ||||
| 						prop: 'plcParamName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数名称', | ||||
| 						prop: 'name', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '单位', | ||||
| 						prop: 'unit', | ||||
| 						options: this.getDictDatas(this.DICT_TYPE.UNIT_DICT), | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						switch: true, | ||||
| 						label: '是否采集', | ||||
| 						prop: 'collection', | ||||
| 						bind: { | ||||
| 							'active-value': 1, | ||||
| 							'inactive-value': 0, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '最小值', | ||||
| 						prop: 'minValue', | ||||
| 						rules: [ | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字', | ||||
| 								trigger: 'change', | ||||
| 								transform: (val) => Number(val), | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '最大值', | ||||
| 						prop: 'maxValue', | ||||
| 						rules: [ | ||||
| 							{ | ||||
| 								required: false, | ||||
| 							}, | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字', | ||||
| 								trigger: 'change', | ||||
| 								transform: (val) => Number(val), | ||||
| 							}, | ||||
| 						], | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '标准值', | ||||
| 						prop: 'defaultValue', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '描述', | ||||
| 						prop: 'description', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '备注', | ||||
| 						prop: 'remark', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			attrQuery: { | ||||
| 				params: { | ||||
| 					pageNo: 1, | ||||
| 					pageSize: 10, | ||||
| 				}, | ||||
| 			}, // 属性列表的请求 | ||||
| 			infoQuery: null, // 基本信息的请求 | ||||
| 			attrFormSubmitting: false, | ||||
| 			attrListLoading: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		formRows() { | ||||
| 			return this.sections[0].rows.map((row) => { | ||||
| 				return row.map((col) => { | ||||
| 					return { | ||||
| 						...col, | ||||
| 						bind: { | ||||
| 							// 详情 模式下,禁用各种输入 | ||||
| 							// disabled: this.mode == 'detail', | ||||
| 							disabled: true, | ||||
| 						}, | ||||
| 					}; | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		tableBtn() { | ||||
| 			return this.mode == 'detail' ? [] : this.sections[1].tableBtn; | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.mode = this.defaultMode || 'detail'; | ||||
| 		for (const section of this.sections) { | ||||
| 			// 请求具体信息 | ||||
| 			if ('url' in section) { | ||||
| 				const query = { | ||||
| 					url: section.url, | ||||
| 					method: section.method || 'get', | ||||
| 					params: section.queryParams || null, | ||||
| 					data: section.data || null, | ||||
| 				}; | ||||
| 				// debugger; | ||||
| 				this.$axios(query).then(({ data }) => { | ||||
| 					if (section.key == 'base') { | ||||
| 						this.form = data; | ||||
| 						this.showForm = true; | ||||
| 						this.infoQuery = query; | ||||
| 					} else if (section.key == 'attrs') { | ||||
| 						this.attrQuery = query; | ||||
| 						this.list = data.list; | ||||
| 						this.total = data.total; | ||||
| 					} | ||||
| 				}); | ||||
| 			} else if (section.key == 'base') { | ||||
| 				this.form = this.infoData; | ||||
| 				this.showForm = true; | ||||
| 			} | ||||
| 		} | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleTableBtnClick({ type, data }) { | ||||
| 			switch (type) { | ||||
| 				case 'edit': | ||||
| 					this.handleEditAttr(data.id); | ||||
| 					break; | ||||
| 				case 'delete': | ||||
| 					this.handleDeleteAttr(data.id); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		handleEmitFun(val) { | ||||
| 			console.log('handleEmitFun', val); | ||||
| 		}, | ||||
|  | ||||
| 		init() { | ||||
| 			this.visible = true; | ||||
| 		}, | ||||
|  | ||||
| 		async getAttrList() { | ||||
| 			this.attrListLoading = true; | ||||
| 			const res = await this.$axios(this.attrQuery); | ||||
| 			if (res.code == 0) { | ||||
| 				this.list = res.data.list; | ||||
| 				this.total = res.data.total; | ||||
| 			} | ||||
| 			this.attrListLoading = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 保存表单 | ||||
| 		handleSave() { | ||||
| 			this.$refs['form'][0].validate(async (valid) => { | ||||
| 				if (valid) { | ||||
| 					const isEdit = this.mode == 'edit'; | ||||
| 					await this.$axios({ | ||||
| 						url: this.sections[0][isEdit ? 'urlUpdate' : 'urlCreate'], | ||||
| 						method: isEdit ? 'put' : 'post', | ||||
| 						data: this.form, | ||||
| 					}); | ||||
| 					this.$modal.msgSuccess(`${isEdit ? '更新' : '创建'}成功`); | ||||
| 					this.visible = false; | ||||
| 					this.$emit('refreshDataList'); | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		handleCancel() { | ||||
| 			this.visible = false; | ||||
| 		}, | ||||
|  | ||||
| 		// 开启编辑 | ||||
| 		toggleEdit() { | ||||
| 			this.mode = 'edit'; | ||||
| 		}, | ||||
|  | ||||
| 		// 新增属性 | ||||
| 		handleAddAttr() { | ||||
| 			this.attrForm = { | ||||
| 				id: null, | ||||
| 				name: '', | ||||
| 				plcParamName: '', | ||||
| 				unit: '', | ||||
| 				collection: 1, | ||||
| 				minValue: '', | ||||
| 				maxValue: '', | ||||
| 				defaultValue: '', | ||||
| 				description: '', | ||||
| 				remark: '', | ||||
| 				alarmContent: '', | ||||
| 			}; | ||||
| 			this.attrTitle = '添加设备绑定信息'; | ||||
| 			this.attrFormVisible = true; | ||||
| 		}, | ||||
|  | ||||
| 		// 编辑属性 | ||||
| 		async handleEditAttr(attrId) { | ||||
| 			const res = await this.$axios({ | ||||
| 				url: this.sections[1].urlDetail, | ||||
| 				method: 'get', | ||||
| 				params: { id: attrId }, | ||||
| 			}); | ||||
| 			if (res.code == 0) { | ||||
| 				this.attrForm = res.data; | ||||
| 				this.attrTitle = '编辑设备绑定信息'; | ||||
| 				this.attrFormVisible = true; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		// 删除属性 | ||||
| 		handleDeleteAttr(attrId) { | ||||
| 			this.$confirm('确定删除该分组报警?', '提示', { | ||||
| 				confirmButtonText: '确定', | ||||
| 				cancelButtonText: '取消', | ||||
| 				type: 'warning', | ||||
| 			}) | ||||
| 				.then(async () => { | ||||
| 					const res = await this.$axios({ | ||||
| 						url: this.sections[1].urlDelete, | ||||
| 						method: 'delete', | ||||
| 						params: { id: attrId }, | ||||
| 					}); | ||||
| 					if (res.code == 0) { | ||||
| 						this.$message({ | ||||
| 							message: '删除成功', | ||||
| 							type: 'success', | ||||
| 							duration: 1500, | ||||
| 							onClose: () => { | ||||
| 								this.getAttrList(); | ||||
| 							}, | ||||
| 						}); | ||||
| 					} | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
|  | ||||
| 		// 提交属性表 | ||||
| 		async submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 			}); | ||||
| 			const isEdit = this.attrForm.id != null; | ||||
| 			this.attrFormSubmitting = true; | ||||
| 			const res = await this.$axios({ | ||||
| 				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, | ||||
| 				method: isEdit ? 'put' : 'post', | ||||
| 				data: { | ||||
| 					...this.attrForm, | ||||
| 					connectId: this.infoData.id | ||||
| 				}, | ||||
| 			}); | ||||
|  | ||||
| 			if (res.code == 0) { | ||||
| 				this.closeAttrForm(); | ||||
| 				this.$message({ | ||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 					type: 'success', | ||||
| 					duration: 1500, | ||||
| 					onClose: () => { | ||||
| 						this.getAttrList(); | ||||
| 					}, | ||||
| 				}); | ||||
| 			} | ||||
| 			this.attrFormSubmitting = false; | ||||
| 		}, | ||||
|  | ||||
| 		closeAttrForm() { | ||||
| 			this.attrFormVisible = false; | ||||
| 		}, | ||||
|  | ||||
| 		handleClick(raw) { | ||||
| 			if (raw.type === 'delete') { | ||||
| 				this.$confirm(`确定删除该报警?`, '提示', { | ||||
| 					confirmButtonText: '确定', | ||||
| 					cancelButtonText: '取消', | ||||
| 					type: 'warning', | ||||
| 				}) | ||||
| 					.then(() => { | ||||
| 						deleteProductAttr(raw.data.id).then(({ data }) => { | ||||
| 							this.$message({ | ||||
| 								message: '操作成功', | ||||
| 								type: 'success', | ||||
| 								duration: 1500, | ||||
| 								onClose: () => { | ||||
| 									this.getList(); | ||||
| 								}, | ||||
| 							}); | ||||
| 						}); | ||||
| 					}) | ||||
| 					.catch(() => {}); | ||||
| 			} else { | ||||
| 				this.addNew(raw.data.id); | ||||
| 			} | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped> | ||||
| .drawer >>> .el-drawer { | ||||
| 	border-radius: 8px 0 0 8px; | ||||
| } | ||||
|  | ||||
| .drawer >>> .el-drawer__header { | ||||
| 	margin: 0; | ||||
| 	padding: 32px 32px 24px; | ||||
| 	border-bottom: 1px solid #dcdfe6; | ||||
| 	margin-bottom: 0px; | ||||
| } | ||||
|  | ||||
| .small-title::before { | ||||
| 	content: ''; | ||||
| 	display: inline-block; | ||||
| 	vertical-align: top; | ||||
| 	width: 4px; | ||||
| 	height: 22px; | ||||
| 	border-radius: 1px; | ||||
| 	margin-right: 8px; | ||||
| 	background-color: #0b58ff; | ||||
| } | ||||
|  | ||||
| .drawer-body { | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	height: 100%; | ||||
| } | ||||
|  | ||||
| .drawer-body__content { | ||||
| 	flex: 1; | ||||
| 	/* background: #eee; */ | ||||
| 	padding: 20px 30px; | ||||
| 	overflow-y: auto; | ||||
| } | ||||
|  | ||||
| .drawer-body__footer { | ||||
| 	display: flex; | ||||
| 	justify-content: flex-end; | ||||
| 	padding: 18px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										85
									
								
								src/views/base/equipmentPlcConnect/http.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,85 @@ | ||||
| /* | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-11 16:18:44 | ||||
|  * @LastEditTime: 2023-09-12 14:25:01 | ||||
|  * @LastEditors: zhp | ||||
|  * @Description:   | ||||
|  */ | ||||
| import Mock from 'mockjs'; | ||||
|  | ||||
| const baseURL = 'http://192.168.1.188:48080/admin-api'; | ||||
|  | ||||
| Mock.setup({ | ||||
| 	timeout: 200, | ||||
| }); | ||||
|  | ||||
| // @database | ||||
| const list = Mock.mock({ | ||||
| 	'data|1-10': [ | ||||
| 		{ | ||||
| 			'id|+1': 1, | ||||
| 			productionLine: (options) => { | ||||
| 				// console.log('otpsion', options.context.currentContext); | ||||
| 				return `EQ${options.context.currentContext.id}`; | ||||
| 			}, | ||||
| 			workshopSection: ({ context: { currentContext } }) => | ||||
| 				`EQ${currentContext.id}_WS${Mock.Random.integer(1, 10)}`, | ||||
| 			equipmentName: ({ context: { currentContext } }) => | ||||
| 				`设备${currentContext.id}`, | ||||
| 			equipmentCode: ({ context: { currentContext } }) => | ||||
| 				`${currentContext.equipmentName}_Code`, | ||||
| 			plcCode: ({ context: { currentContext } }) => | ||||
| 				`PLC_TABLE_CODE_${currentContext.id}`, | ||||
| 			plcTableName: ({ context: { currentContext } }) => | ||||
| 				`PLC_TABLE_${currentContext.id}`, | ||||
| 			plcName: ({ context: { currentContext } }) => `PLC_${currentContext.id}`, | ||||
| 			'bindingParameters|1-10': 1, | ||||
| 		}, | ||||
| 	], | ||||
| }); | ||||
|  | ||||
| // @page | ||||
| Mock.mock( | ||||
| 	RegExp(baseURL + '/base/equipment-plc-connect/page' + '.*'), | ||||
| 	'get', | ||||
| 	(options) => { | ||||
| 		console.log('[Mock url]', options.url, list); | ||||
| 		return { | ||||
| 			code: 0, | ||||
| 			data: { | ||||
| 				list: list.data, | ||||
| 				total: list.data.length, | ||||
| 			}, | ||||
| 		}; | ||||
| 	} | ||||
| ); | ||||
|  | ||||
| // @create | ||||
| Mock.mock(baseURL + '/base/equipment-plc-connect/create', 'post', (options) => { | ||||
| 	console.log('options', options); | ||||
| 	const { url, type, body } = options; | ||||
| 	const newItem = JSON.parse(body); | ||||
| 	list.data.push(newItem); | ||||
| 	return { | ||||
| 		code: 0, | ||||
| 		data: null, | ||||
| 		msg: 'success', | ||||
| 	}; | ||||
| }); | ||||
|  | ||||
| // @update | ||||
| Mock.mock( | ||||
| 	baseURL + '/admin-api/base/equipment-plc-connect/update', | ||||
| 	'put', | ||||
| 	(options) => { | ||||
| 		const { url, type, body } = options; | ||||
| 		const { id } = JSON.parse(body); | ||||
| 		const newItem = list.data.find((item) => item.id == id); | ||||
| 		newItem = { ...newItem, ...JSON.parse(body) }; | ||||
| 		return { | ||||
| 			code: 0, | ||||
| 			msg: 'success', | ||||
| 			data: null, | ||||
| 		}; | ||||
| 	} | ||||
| ); | ||||
| @@ -1,209 +1,518 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
| 	<div class="app-container"> | ||||
| 		<!-- 搜索工作栏 --> | ||||
| 		<SearchBar | ||||
| 			:formConfigs="searchBarFormConfig" | ||||
| 			ref="search-bar" | ||||
| 			@headBtnClick="handleSearchBarBtnClick" /> | ||||
|  | ||||
|     <!-- 搜索工作栏 --> | ||||
|     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="plc表iD" prop="plcId"> | ||||
|         <el-input v-model="queryParams.plcId" placeholder="请输入plc表iD" clearable @keyup.enter.native="handleQuery"/> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="设备表id" prop="equipmentId"> | ||||
|         <el-input v-model="queryParams.equipmentId" placeholder="请输入设备表id" clearable @keyup.enter.native="handleQuery"/> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button> | ||||
|         <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button> | ||||
|       </el-form-item> | ||||
|     </el-form> | ||||
| 		<!-- 列表 --> | ||||
| 		<base-table | ||||
| 			:table-props="tableProps" | ||||
| 			:page="queryParams.pageNo" | ||||
| 			:limit="queryParams.pageSize" | ||||
| 			:table-data="list" | ||||
| 			@emitFun="handleEmitFun"> | ||||
| 			<method-btn | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
|  | ||||
|     <!-- 操作工具栏 --> | ||||
|     <el-row :gutter="10" class="mb8"> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" | ||||
|                    v-hasPermi="['base:equipment-plc-connect:create']">新增</el-button> | ||||
|       </el-col> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading" | ||||
|                    v-hasPermi="['base:equipment-plc-connect:export']">导出</el-button> | ||||
|       </el-col> | ||||
|       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||||
|     </el-row> | ||||
| 		<!-- 分页组件 --> | ||||
| 		<pagination | ||||
| 			v-show="total > 0" | ||||
| 			:total="total" | ||||
| 			:page.sync="queryParams.pageNo" | ||||
| 			:limit.sync="queryParams.pageSize" | ||||
| 			@pagination="getList" /> | ||||
|  | ||||
|     <!-- 列表 --> | ||||
|     <el-table v-loading="loading" :data="list"> | ||||
|       <el-table-column label="id" align="center" prop="id" /> | ||||
|       <el-table-column label="plc表iD" align="center" prop="plcId" /> | ||||
|       <el-table-column label="设备表id" align="center" prop="equipmentId" /> | ||||
|       <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||||
|         <template v-slot="scope"> | ||||
|           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc-connect:update']">修改</el-button> | ||||
|           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc-connect:delete']">删除</el-button> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|     </el-table> | ||||
|     <!-- 分页组件 --> | ||||
|     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize" | ||||
|                 @pagination="getList"/> | ||||
| 		<!-- 对话框(添加 / 修改) --> | ||||
| 		<base-dialog | ||||
| 			:dialogTitle="title" | ||||
| 			:dialogVisible="open" | ||||
| 			width="700px" | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
|  | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body> | ||||
|       <el-form ref="form" :model="form" :rules="rules" label-width="80px"> | ||||
|         <el-form-item label="plc表iD" prop="plcId"> | ||||
|           <el-input v-model="form.plcId" placeholder="请输入plc表iD" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="设备表id" prop="equipmentId"> | ||||
|           <el-input v-model="form.equipmentId" placeholder="请输入设备表id" /> | ||||
|         </el-form-item> | ||||
|       </el-form> | ||||
|       <div slot="footer" class="dialog-footer"> | ||||
|         <el-button type="primary" @click="submitForm">确 定</el-button> | ||||
|         <el-button @click="cancel">取 消</el-button> | ||||
|       </div> | ||||
|     </el-dialog> | ||||
|   </div> | ||||
| 		<!-- 抽屉 详情 --> | ||||
| 		<BasicDrawer | ||||
| 			v-if="editVisible" | ||||
| 			ref="drawer" | ||||
| 			:default-mode="editMode" | ||||
| 			:info-data="alarmForm" | ||||
| 			:sections="[ | ||||
| 				{ | ||||
| 					name: '基本信息', | ||||
| 					key: 'base', | ||||
| 					rows: drawerBaseInfoRows, | ||||
| 				}, | ||||
| 				{ | ||||
| 					name: '属性列表', | ||||
| 					key: 'attrs', | ||||
| 					props: drawerListProps, | ||||
| 					url: '/base/equipment-plc-param/page', | ||||
| 					urlCreate: '/base/equipment-plc-param/create', | ||||
| 					urlUpdate: '/base/equipment-plc-param/update', | ||||
| 					urlDelete: '/base/equipment-plc-param/delete', | ||||
| 					urlDetail: '/base/equipment-plc-param/get', | ||||
| 					queryParams: { | ||||
| 						connectId: alarmForm.id, | ||||
| 						pageNo: 1, | ||||
| 						pageSize: 10, | ||||
| 					}, | ||||
| 					tableBtn: [ | ||||
| 						this.$auth.hasPermi('base:equipment-plc-param:update') | ||||
| 							? { | ||||
| 									type: 'edit', | ||||
| 									btnName: '修改', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 						this.$auth.hasPermi('base:equipment-plc-param:delete') | ||||
| 							? { | ||||
| 									type: 'delete', | ||||
| 									btnName: '删除', | ||||
| 							  } | ||||
| 							: undefined, | ||||
| 					].filter((v) => v), | ||||
| 					allowAdd: true, | ||||
| 				}, | ||||
| 			]" | ||||
| 			@refreshDataList="getList" | ||||
| 			@cancel="editVisible = false" | ||||
| 			@destroy="editVisible = false" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { createEquipmentPlcConnect, updateEquipmentPlcConnect, deleteEquipmentPlcConnect, getEquipmentPlcConnect, getEquipmentPlcConnectPage, exportEquipmentPlcConnectExcel } from "@/api/base/equipmentPlcConnect"; | ||||
| import { | ||||
| 	createEquipmentPlcConnect, | ||||
| 	updateEquipmentPlcConnect, | ||||
| 	deleteEquipmentPlcConnect, | ||||
| 	getEquipmentPlcConnect, | ||||
| 	getEquipmentPlcConnectPage, | ||||
| 	exportEquipmentPlcConnectExcel, | ||||
| } from '@/api/base/equipmentPlcConnect'; | ||||
| import moment from 'moment'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
| // import './http'; | ||||
| import BasicDrawer from './components/BasicDrawer.vue'; | ||||
| import { publicFormatter } from '@/utils/dict'; | ||||
|  | ||||
| export default { | ||||
|   name: "EquipmentPlcConnect", | ||||
|   components: { | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 导出遮罩层 | ||||
|       exportLoading: false, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 设备与实时采集关系表(一对多)列表 | ||||
|       list: [], | ||||
|       // 弹出层标题 | ||||
|       title: "", | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNo: 1, | ||||
|         pageSize: 10, | ||||
|         plcId: null, | ||||
|         equipmentId: null, | ||||
|       }, | ||||
|       // 表单参数 | ||||
|       form: {}, | ||||
|       // 表单校验 | ||||
|       rules: { | ||||
|         plcId: [{ required: true, message: "plc表iD不能为空", trigger: "blur" }], | ||||
|         equipmentId: [{ required: true, message: "设备表id不能为空", trigger: "blur" }], | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|   }, | ||||
|   methods: { | ||||
|     /** 查询列表 */ | ||||
|     getList() { | ||||
|       this.loading = true; | ||||
|       // 执行查询 | ||||
|       getEquipmentPlcConnectPage(this.queryParams).then(response => { | ||||
|         this.list = response.data.list; | ||||
|         this.total = response.data.total; | ||||
|         this.loading = false; | ||||
|       }); | ||||
|     }, | ||||
|     /** 取消按钮 */ | ||||
|     cancel() { | ||||
|       this.open = false; | ||||
|       this.reset(); | ||||
|     }, | ||||
|     /** 表单重置 */ | ||||
|     reset() { | ||||
|       this.form = { | ||||
|         id: undefined, | ||||
|         plcId: undefined, | ||||
|         equipmentId: undefined, | ||||
|       }; | ||||
|       this.resetForm("form"); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     handleQuery() { | ||||
|       this.queryParams.pageNo = 1; | ||||
|       this.getList(); | ||||
|     }, | ||||
|     /** 重置按钮操作 */ | ||||
|     resetQuery() { | ||||
|       this.resetForm("queryForm"); | ||||
|       this.handleQuery(); | ||||
|     }, | ||||
|     /** 新增按钮操作 */ | ||||
|     handleAdd() { | ||||
|       this.reset(); | ||||
|       this.open = true; | ||||
|       this.title = "添加设备与实时采集关系表(一对多)"; | ||||
|     }, | ||||
|     /** 修改按钮操作 */ | ||||
|     handleUpdate(row) { | ||||
|       this.reset(); | ||||
|       const id = row.id; | ||||
|       getEquipmentPlcConnect(id).then(response => { | ||||
|         this.form = response.data; | ||||
|         this.open = true; | ||||
|         this.title = "修改设备与实时采集关系表(一对多)"; | ||||
|       }); | ||||
|     }, | ||||
|     /** 提交按钮 */ | ||||
|     submitForm() { | ||||
|       this.$refs["form"].validate(valid => { | ||||
|         if (!valid) { | ||||
|           return; | ||||
|         } | ||||
|         // 修改的提交 | ||||
|         if (this.form.id != null) { | ||||
|           updateEquipmentPlcConnect(this.form).then(response => { | ||||
|             this.$modal.msgSuccess("修改成功"); | ||||
|             this.open = false; | ||||
|             this.getList(); | ||||
|           }); | ||||
|           return; | ||||
|         } | ||||
|         // 添加的提交 | ||||
|         createEquipmentPlcConnect(this.form).then(response => { | ||||
|           this.$modal.msgSuccess("新增成功"); | ||||
|           this.open = false; | ||||
|           this.getList(); | ||||
|         }); | ||||
|       }); | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const id = row.id; | ||||
|       this.$modal.confirm('是否确认删除设备与实时采集关系表(一对多)编号为"' + id + '"的数据项?').then(function() { | ||||
|           return deleteEquipmentPlcConnect(id); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.$modal.msgSuccess("删除成功"); | ||||
|         }).catch(() => {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       // 处理查询参数 | ||||
|       let params = {...this.queryParams}; | ||||
|       params.pageNo = undefined; | ||||
|       params.pageSize = undefined; | ||||
|       this.$modal.confirm('是否确认导出所有设备与实时采集关系表(一对多)数据项?').then(() => { | ||||
|           this.exportLoading = true; | ||||
|           return exportEquipmentPlcConnectExcel(params); | ||||
|         }).then(response => { | ||||
|           this.$download.excel(response, '设备与实时采集关系表(一对多).xls'); | ||||
|           this.exportLoading = false; | ||||
|         }).catch(() => {}); | ||||
|     } | ||||
|   } | ||||
| 	name: 'EquipmentPlcConnect', | ||||
| 	mixins: [basicPageMixin], | ||||
| 	components: { BasicDrawer }, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			searchBarKeys: ['equipmentId', 'plcId'], | ||||
| 			// tableBtn: [ | ||||
| 			// 	this.$auth.hasPermi('base:equipment-plc:update') | ||||
| 			// 		? { | ||||
| 			// 				type: 'edit', | ||||
| 			// 				btnName: '修改', | ||||
| 			// 		  } | ||||
| 			// 		: undefined, | ||||
| 			// 	this.$auth.hasPermi('base:equipment-plc:delete') | ||||
| 			// 		? { | ||||
| 			// 				type: 'delete', | ||||
| 			// 				btnName: '删除', | ||||
| 			// 		  } | ||||
| 			// 		: undefined, | ||||
| 			// ].filter((v) => v), | ||||
| 			tableBtn: [ | ||||
| 				{ | ||||
| 					type: 'detail', | ||||
| 					btnName: '参数绑定', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'edit', | ||||
| 					btnName: '修改', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: 'params-bind', | ||||
| 				// 	btnName: '参数绑定', | ||||
| 				// }, | ||||
| 				{ | ||||
| 					type: 'delete', | ||||
| 					btnName: '删除', | ||||
| 				}, | ||||
| 			], | ||||
| 			tableProps: [ | ||||
| 				// { | ||||
| 				// 	prop: 'createTime', | ||||
| 				// 	label: '添加时间', | ||||
| 				// 	fixed: true, | ||||
| 				// 	width: 180, | ||||
| 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				// }, | ||||
| 				{ prop: 'productionLine', label: '产线' }, | ||||
| 				{ prop: 'workshopSection', label: '工段' }, | ||||
| 				{ prop: 'equipmentName', label: '设备名' }, | ||||
| 				{ prop: 'equipmentCode', label: '设备编码' }, | ||||
| 				{ prop: 'plcCode', label: '关联表编码' }, | ||||
| 				{ prop: 'plcTableName', label: '关联表名' }, | ||||
| 				{ prop: 'plcName', label: '标识名称' }, | ||||
| 				{ prop: 'bindingParameters', label: '绑定参数数量' }, | ||||
| 				// { | ||||
| 				// 	_action: 'params-bind', | ||||
| 				// 	label: '查看绑定', | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| 				// 			const _this = this; | ||||
| 				// 			return h( | ||||
| 				// 				'el-button', | ||||
| 				// 				{ | ||||
| 				// 					props: { type: 'text' }, | ||||
| 				// 					on: { | ||||
| 				// 						click: function () { | ||||
| 				// 							console.log('inejctdata', _this.injectData); | ||||
| 				// 							_this.$emit('emitData', { | ||||
| 				// 								action: _this.injectData._action, | ||||
| 				// 								payload: _this.injectData, | ||||
| 				// 							}); | ||||
| 				// 						}, | ||||
| 				// 					}, | ||||
| 				// 				}, | ||||
| 				// 				'查看绑定' | ||||
| 				// 			); | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| 					label: '设备名', | ||||
| 					placeholder: '请选择设备', | ||||
| 					param: 'equipmentId', | ||||
| 					selectOptions: [], | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| 					label: '编码', | ||||
| 					placeholder: '请选择编码', | ||||
| 					param: 'plcId', | ||||
| 					selectOptions: [], | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '查询', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					// type: this.$auth.hasPermi('base:equipment-plc:create') | ||||
| 					// 	? 'button' | ||||
| 					// 	: '', | ||||
| 					type: 'button', | ||||
| 					btnName: '新增', | ||||
| 					name: 'add', | ||||
| 					plain: true, | ||||
| 					color: 'success', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: this.$auth.hasPermi('base:equipment-plc:export') ? 'button' : '', | ||||
| 				// 	btnName: '导出', | ||||
| 				// 	name: 'export', | ||||
| 				// 	color: 'warning', | ||||
| 				// }, | ||||
| 			], | ||||
| 			rows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '关联表名', | ||||
| 						prop: 'plcId', | ||||
| 						labelKey: `plcTableName`, | ||||
| 						url: '/base/equipment-plc/listAll', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '设备', | ||||
| 						prop: 'equipmentId', | ||||
| 						url: '/base/equipment/page?pageNo=1&pageSize=99', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			open: false, | ||||
| 			// 查询参数 | ||||
| 			queryParams: { | ||||
| 				pageNo: 1, | ||||
| 				pageSize: 10, | ||||
| 				plcId: null, | ||||
| 				equipmentId: null, | ||||
| 			}, | ||||
| 			// 表单参数 | ||||
| 			form: {}, | ||||
| 			// 查看绑定配置 | ||||
| 			editVisible: false, | ||||
| 			editMode: '', | ||||
| 			drawerBaseInfoRows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '设备名', | ||||
| 						prop: 'equipmentName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 						// bind: { | ||||
| 						// 	disabled: this.editMode == 'detail', // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '关联表名', | ||||
| 						prop: 'plcTableName', | ||||
| 						// url: '/base/equipment/getCode', | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			drawerListProps: [ | ||||
| 				{ prop: 'plcParamName', label: '参数列名' }, | ||||
| 				{ prop: 'name', label: '参数名称' }, | ||||
| 				{ | ||||
| 					prop: 'unit', | ||||
| 					label: '单位', | ||||
| 					filter: publicFormatter('unit_dict'), | ||||
| 				}, | ||||
| 				{ | ||||
| 					prop: 'collection', | ||||
| 					label: '是否采集', | ||||
| 					filter: (val) => (val != null ? ['否', '是'][val] : '-'), | ||||
| 				}, | ||||
| 				{ prop: 'minValue', label: '最小值' }, | ||||
| 				{ prop: 'maxValue', label: '最大值' }, | ||||
| 				{ prop: 'defaultValue', label: '标准值' }, | ||||
| 				{ prop: 'description', label: '描述' }, | ||||
| 				{ prop: 'remark', label: '备注' }, | ||||
| 			], | ||||
| 			alarmForm: { | ||||
| 				id: undefined, | ||||
| 				equipmentName: undefined, | ||||
| 				plcTableName: undefined, | ||||
| 			}, | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getList(); | ||||
| 		this.initSearchOptions(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		async getEquipmentOptions() { | ||||
| 			const res = await this.$axios({ | ||||
| 				url: '/base/equipment/listAll', | ||||
| 				method: 'get', | ||||
| 			}); | ||||
| 			return res.data; | ||||
| 		}, | ||||
|  | ||||
| 		async getPlcOptions() { | ||||
| 			const res = await this.$axios({ | ||||
| 				url: '/base/equipment-plc/listAll', | ||||
| 				method: 'get', | ||||
| 			}); | ||||
| 			return res.data; | ||||
| 		}, | ||||
|  | ||||
| 		/** 初始化查询条件 */ | ||||
| 		async initSearchOptions() { | ||||
| 			Promise.all([this.getEquipmentOptions(), this.getPlcOptions()]).then( | ||||
| 				([eqList, plcList]) => { | ||||
| 					this.searchBarFormConfig[0].selectOptions = eqList.map((item) => { | ||||
| 						return { | ||||
| 							name: item.name, | ||||
| 							id: item.id, | ||||
| 						}; | ||||
| 					}); | ||||
| 					this.searchBarFormConfig[1].selectOptions = plcList.map((item) => { | ||||
| 						return { | ||||
| 							name: item.name, | ||||
| 							id: item.id, | ||||
| 						}; | ||||
| 					}); | ||||
| 				} | ||||
| 			); | ||||
| 		}, | ||||
| 		/** 覆盖 handleEmitFun 的默认实现 */ | ||||
| 		handleEmitFun({ action, payload }) { | ||||
| 			switch (action) { | ||||
| 				case 'params-bind': | ||||
| 					this.reset(); | ||||
| 					const { | ||||
| 						id, | ||||
| 						equipmentName, | ||||
| 						equipmentId, | ||||
| 						plcId, | ||||
| 						plcName, | ||||
| 						plcTableName, | ||||
| 					} = payload; | ||||
| 					// console.log('Cha看绑定参数弹窗', id, equipmentName, plcTableName); | ||||
| 					this.$router.push({ | ||||
| 						name: 'EquipmentPlcParam', | ||||
| 						params: { | ||||
| 							id, | ||||
| 							equipmentName, | ||||
| 							plcTableName, | ||||
| 						}, | ||||
| 					}); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
|  | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| 			this.loading = true; | ||||
| 			// 执行查询 | ||||
| 			getEquipmentPlcConnectPage(this.queryParams).then((response) => { | ||||
| 				this.list = response.data.list; | ||||
| 				this.total = response.data.total; | ||||
| 				this.loading = false; | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 取消按钮 */ | ||||
| 		cancel() { | ||||
| 			this.open = false; | ||||
| 			this.reset(); | ||||
| 		}, | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| 				id: undefined, | ||||
| 				plcId: undefined, | ||||
| 				equipmentId: undefined, | ||||
| 			}; | ||||
| 			this.resetForm('form'); | ||||
| 		}, | ||||
| 		/** 搜索按钮操作 */ | ||||
| 		handleQuery() { | ||||
| 			this.queryParams.pageNo = 1; | ||||
| 			this.getList(); | ||||
| 		}, | ||||
| 		/** 重置按钮操作 */ | ||||
| 		resetQuery() { | ||||
| 			this.resetForm('queryForm'); | ||||
| 			this.handleQuery(); | ||||
| 		}, | ||||
| 		/** 新增按钮操作 */ | ||||
| 		handleAdd() { | ||||
| 			this.reset(); | ||||
| 			this.open = true; | ||||
| 			this.title = '添加设备与实时采集关系表(一对多)'; | ||||
| 		}, | ||||
| 		/** 修改按钮操作 */ | ||||
| 		handleUpdate(row) { | ||||
| 			this.reset(); | ||||
| 			const id = row.id; | ||||
| 			getEquipmentPlcConnect(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| 				this.open = true; | ||||
| 				this.title = '修改设备与实时采集关系表(一对多)'; | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 提交按钮 */ | ||||
| 		submitForm() { | ||||
| 			this.$refs['form'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 				// 修改的提交 | ||||
| 				if (this.form.id != null) { | ||||
| 					updateEquipmentPlcConnect(this.form).then((response) => { | ||||
| 						this.$modal.msgSuccess('修改成功'); | ||||
| 						this.open = false; | ||||
| 						this.getList(); | ||||
| 					}); | ||||
| 					return; | ||||
| 				} | ||||
| 				// 添加的提交 | ||||
| 				createEquipmentPlcConnect(this.form).then((response) => { | ||||
| 					this.$modal.msgSuccess('新增成功'); | ||||
| 					this.open = false; | ||||
| 					this.getList(); | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		// 查看报警 | ||||
| 		handleDetail(row) { | ||||
| 			// debugger; | ||||
| 			const { | ||||
| 				id, | ||||
| 				bindingParameters, | ||||
| 				equipmentCode, | ||||
| 				equipmentId, | ||||
| 				equipmentName, | ||||
| 				plcCode, | ||||
| 				plcId, | ||||
| 				plcName, | ||||
| 				plcTableName, | ||||
| 				productionLine, | ||||
| 				workshopSection, | ||||
| 			} = row; | ||||
| 			// 打开抽屉 | ||||
| 			this.editMode = 'detail'; | ||||
| 			this.alarmForm.id = id; | ||||
| 			this.alarmForm.plcTableName = plcTableName; // 关联表名 | ||||
| 			this.alarmForm.equipmentName = equipmentName; | ||||
| 			this.editVisible = true; | ||||
| 			this.$nextTick(() => { | ||||
| 				this.$refs['drawer'].init(); | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		/** 删除按钮操作 */ | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否删除该配置?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentPlcConnect(id); | ||||
| 				}) | ||||
| 				.then(() => { | ||||
| 					this.getList(); | ||||
| 					this.$modal.msgSuccess('删除成功'); | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
|  | ||||
| 		/** 导出按钮操作 */ | ||||
| 		handleExport() { | ||||
| 			// 处理查询参数 | ||||
| 			let params = { ...this.queryParams }; | ||||
| 			params.pageNo = undefined; | ||||
| 			params.pageSize = undefined; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认导出所有设备与实时采集关系表(一对多)数据项?') | ||||
| 				.then(() => { | ||||
| 					this.exportLoading = true; | ||||
| 					return exportEquipmentPlcConnectExcel(params); | ||||
| 				}) | ||||
| 				.then((response) => { | ||||
| 					this.$download.excel(response, '设备与实时采集关系表(一对多).xls'); | ||||
| 					this.exportLoading = false; | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|   | ||||
| @@ -1,255 +1,452 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
| 	<div class="app-container"> | ||||
| 		<!-- 搜索工作栏 --> | ||||
| 		<SearchBar | ||||
| 			:formConfigs="searchBarFormConfig" | ||||
| 			ref="search-bar" | ||||
| 			@headBtnClick="handleSearchBarBtnClick" /> | ||||
|  | ||||
|     <!-- 搜索工作栏 --> | ||||
|     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="实时数采表id" prop="connectId"> | ||||
|         <el-input v-model="queryParams.connectId" placeholder="请输入实时数采表id" clearable @keyup.enter.native="handleQuery"/> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button> | ||||
|         <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button> | ||||
|       </el-form-item> | ||||
|     </el-form> | ||||
| 		<!-- 列表 --> | ||||
| 		<base-table | ||||
| 			:table-props="tableProps" | ||||
| 			:page="queryParams.pageNo" | ||||
| 			:limit="queryParams.pageSize" | ||||
| 			:table-data="list" | ||||
| 			@emitFun="handleEmitFun"> | ||||
| 			<method-btn | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
|  | ||||
|     <!-- 操作工具栏 --> | ||||
|     <el-row :gutter="10" class="mb8"> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" | ||||
|                    v-hasPermi="['base:equipment-plc-param:create']">新增</el-button> | ||||
|       </el-col> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading" | ||||
|                    v-hasPermi="['base:equipment-plc-param:export']">导出</el-button> | ||||
|       </el-col> | ||||
|       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||||
|     </el-row> | ||||
| 		<!-- 分页组件 --> | ||||
| 		<pagination | ||||
| 			v-show="total > 0" | ||||
| 			:total="total" | ||||
| 			:page.sync="queryParams.pageNo" | ||||
| 			:limit.sync="queryParams.pageSize" | ||||
| 			@pagination="getList" /> | ||||
|  | ||||
|     <!-- 列表 --> | ||||
|     <el-table v-loading="loading" :data="list"> | ||||
|       <el-table-column label="ID" align="center" prop="id" /> | ||||
|       <el-table-column label="实时数采表id" align="center" prop="connectId" /> | ||||
|       <el-table-column label="plc实际的列名(参数列名)" align="center" prop="plcParamName" /> | ||||
|       <el-table-column label="参数名称" align="center" prop="name" /> | ||||
|       <el-table-column label="单位 关联数据字典表label_value" align="center" prop="unit"> | ||||
|         <template v-slot="scope"> | ||||
|           <dict-tag :type="DICT_TYPE.UNIT_DICT" :value="scope.row.unit" /> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|       <el-table-column label="最小值 数值型可用" align="center" prop="minValue" /> | ||||
|       <el-table-column label="最大值 数值型可用" align="center" prop="maxValue" /> | ||||
|       <el-table-column label="参数设定标准值" align="center" prop="defaultValue" /> | ||||
|       <el-table-column label="0 代表不采集, 1 代表采集" align="center" prop="collection" /> | ||||
|       <el-table-column label="描述" align="center" prop="description" /> | ||||
|       <el-table-column label="备注" align="center" prop="remark" /> | ||||
|       <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | ||||
|         <template v-slot="scope"> | ||||
|           <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc-param:update']">修改</el-button> | ||||
|           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" | ||||
|                      v-hasPermi="['base:equipment-plc-param:delete']">删除</el-button> | ||||
|         </template> | ||||
|       </el-table-column> | ||||
|     </el-table> | ||||
|     <!-- 分页组件 --> | ||||
|     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize" | ||||
|                 @pagination="getList"/> | ||||
|  | ||||
|     <!-- 对话框(添加 / 修改) --> | ||||
|     <el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body> | ||||
|       <el-form ref="form" :model="form" :rules="rules" label-width="80px"> | ||||
|         <el-form-item label="实时数采表id" prop="connectId"> | ||||
|           <el-input v-model="form.connectId" placeholder="请输入实时数采表id" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="plc实际的列名(参数列名)" prop="plcParamName"> | ||||
|           <el-input v-model="form.plcParamName" placeholder="请输入plc实际的列名(参数列名)" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="参数名称" prop="name"> | ||||
|           <el-input v-model="form.name" placeholder="请输入参数名称" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="单位 关联数据字典表label_value" prop="unit"> | ||||
|           <el-select v-model="form.unit" placeholder="请选择单位 关联数据字典表label_value"> | ||||
|             <el-option v-for="dict in this.getDictDatas(DICT_TYPE.UNIT_DICT)" | ||||
|                        :key="dict.value" :label="dict.label" :value="dict.value" /> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="最小值 数值型可用" prop="minValue"> | ||||
|           <el-input v-model="form.minValue" placeholder="请输入最小值 数值型可用" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="最大值 数值型可用" prop="maxValue"> | ||||
|           <el-input v-model="form.maxValue" placeholder="请输入最大值 数值型可用" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="参数设定标准值" prop="defaultValue"> | ||||
|           <el-input v-model="form.defaultValue" placeholder="请输入参数设定标准值" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="0 代表不采集, 1 代表采集" prop="collection"> | ||||
|           <el-input v-model="form.collection" placeholder="请输入0 代表不采集, 1 代表采集" /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="描述"> | ||||
|           <editor v-model="form.description" :min-height="192"/> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="备注" prop="remark"> | ||||
|           <el-input v-model="form.remark" placeholder="请输入备注" /> | ||||
|         </el-form-item> | ||||
|       </el-form> | ||||
|       <div slot="footer" class="dialog-footer"> | ||||
|         <el-button type="primary" @click="submitForm">确 定</el-button> | ||||
|         <el-button @click="cancel">取 消</el-button> | ||||
|       </div> | ||||
|     </el-dialog> | ||||
|   </div> | ||||
| 		<!-- 对话框(添加 / 修改) --> | ||||
| 		<base-dialog | ||||
| 			:dialogTitle="title" | ||||
| 			:dialogVisible="open" | ||||
| 			width="700px" | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { createEquipmentPlcParam, updateEquipmentPlcParam, deleteEquipmentPlcParam, getEquipmentPlcParam, getEquipmentPlcParamPage, exportEquipmentPlcParamExcel } from "@/api/base/equipmentPlcParam"; | ||||
| import Editor from '@/components/Editor'; | ||||
| import { | ||||
| 	createEquipmentPlcParam, | ||||
| 	updateEquipmentPlcParam, | ||||
| 	deleteEquipmentPlcParam, | ||||
| 	getEquipmentPlcParam, | ||||
| 	getEquipmentPlcParamPage, | ||||
| 	exportEquipmentPlcParamExcel, | ||||
| } from '@/api/base/equipmentPlcParam'; | ||||
| import moment from 'moment'; | ||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||
| import { publicFormatter } from '@/utils/dict'; | ||||
|  | ||||
| export default { | ||||
|   name: "EquipmentPlcParam", | ||||
|   components: { | ||||
|     Editor | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 导出遮罩层 | ||||
|       exportLoading: false, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 设备数采详情列表 | ||||
|       list: [], | ||||
|       // 弹出层标题 | ||||
|       title: "", | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNo: 1, | ||||
|         pageSize: 10, | ||||
|         connectId: null, | ||||
|       }, | ||||
|       // 表单参数 | ||||
|       form: {}, | ||||
|       // 表单校验 | ||||
|       rules: { | ||||
|         connectId: [{ required: true, message: "实时数采表id不能为空", trigger: "blur" }], | ||||
|         plcParamName: [{ required: true, message: "plc实际的列名(参数列名)不能为空", trigger: "blur" }], | ||||
|         name: [{ required: true, message: "参数名称不能为空", trigger: "blur" }], | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|   }, | ||||
|   methods: { | ||||
|     /** 查询列表 */ | ||||
|     getList() { | ||||
|       this.loading = true; | ||||
|       // 执行查询 | ||||
|       getEquipmentPlcParamPage(this.queryParams).then(response => { | ||||
|         this.list = response.data.list; | ||||
|         this.total = response.data.total; | ||||
|         this.loading = false; | ||||
|       }); | ||||
|     }, | ||||
|     /** 取消按钮 */ | ||||
|     cancel() { | ||||
|       this.open = false; | ||||
|       this.reset(); | ||||
|     }, | ||||
|     /** 表单重置 */ | ||||
|     reset() { | ||||
|       this.form = { | ||||
|         id: undefined, | ||||
|         connectId: undefined, | ||||
|         plcParamName: undefined, | ||||
|         name: undefined, | ||||
|         unit: undefined, | ||||
|         minValue: undefined, | ||||
|         maxValue: undefined, | ||||
|         defaultValue: undefined, | ||||
|         collection: undefined, | ||||
|         description: undefined, | ||||
|         remark: undefined, | ||||
|       }; | ||||
|       this.resetForm("form"); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     handleQuery() { | ||||
|       this.queryParams.pageNo = 1; | ||||
|       this.getList(); | ||||
|     }, | ||||
|     /** 重置按钮操作 */ | ||||
|     resetQuery() { | ||||
|       this.resetForm("queryForm"); | ||||
|       this.handleQuery(); | ||||
|     }, | ||||
|     /** 新增按钮操作 */ | ||||
|     handleAdd() { | ||||
|       this.reset(); | ||||
|       this.open = true; | ||||
|       this.title = "添加设备数采详情"; | ||||
|     }, | ||||
|     /** 修改按钮操作 */ | ||||
|     handleUpdate(row) { | ||||
|       this.reset(); | ||||
|       const id = row.id; | ||||
|       getEquipmentPlcParam(id).then(response => { | ||||
|         this.form = response.data; | ||||
|         this.open = true; | ||||
|         this.title = "修改设备数采详情"; | ||||
|       }); | ||||
|     }, | ||||
|     /** 提交按钮 */ | ||||
|     submitForm() { | ||||
|       this.$refs["form"].validate(valid => { | ||||
|         if (!valid) { | ||||
|           return; | ||||
|         } | ||||
|         // 修改的提交 | ||||
|         if (this.form.id != null) { | ||||
|           updateEquipmentPlcParam(this.form).then(response => { | ||||
|             this.$modal.msgSuccess("修改成功"); | ||||
|             this.open = false; | ||||
|             this.getList(); | ||||
|           }); | ||||
|           return; | ||||
|         } | ||||
|         // 添加的提交 | ||||
|         createEquipmentPlcParam(this.form).then(response => { | ||||
|           this.$modal.msgSuccess("新增成功"); | ||||
|           this.open = false; | ||||
|           this.getList(); | ||||
|         }); | ||||
|       }); | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const id = row.id; | ||||
|       this.$modal.confirm('是否确认删除设备数采详情编号为"' + id + '"的数据项?').then(function() { | ||||
|           return deleteEquipmentPlcParam(id); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.$modal.msgSuccess("删除成功"); | ||||
|         }).catch(() => {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       // 处理查询参数 | ||||
|       let params = {...this.queryParams}; | ||||
|       params.pageNo = undefined; | ||||
|       params.pageSize = undefined; | ||||
|       this.$modal.confirm('是否确认导出所有设备数采详情数据项?').then(() => { | ||||
|           this.exportLoading = true; | ||||
|           return exportEquipmentPlcParamExcel(params); | ||||
|         }).then(response => { | ||||
|           this.$download.excel(response, '设备数采详情.xls'); | ||||
|           this.exportLoading = false; | ||||
|         }).catch(() => {}); | ||||
|     } | ||||
|   } | ||||
| 	name: 'EquipmentPlcParam', | ||||
| 	mixins: [basicPageMixin], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			tableProps: [ | ||||
| 				// { | ||||
| 				// 	prop: 'createTime', | ||||
| 				// 	label: '添加时间', | ||||
| 				// 	fixed: true, | ||||
| 				// 	width: 180, | ||||
| 				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				// }, | ||||
| 				{ prop: 'plcParamName', label: '参数列名' }, | ||||
| 				{ prop: 'name', label: '参数名称' }, | ||||
| 				{ | ||||
| 					prop: 'unit', | ||||
| 					label: '单位', | ||||
| 					filter: publicFormatter('unit_dict'), | ||||
| 				}, | ||||
| 				{ | ||||
| 					prop: 'collection', | ||||
| 					label: '是否采集', | ||||
| 					filter: (val) => (val != null ? ['否', '是'][val] : '-'), | ||||
| 				}, | ||||
| 				{ prop: 'minValue', label: '最小值' }, | ||||
| 				{ prop: 'maxValue', label: '最大值' }, | ||||
| 				{ prop: 'defaultValue', label: '标准值' }, | ||||
| 				{ prop: 'description', label: '描述' }, | ||||
| 				{ prop: 'remark', label: '备注' }, | ||||
| 				// { | ||||
| 				// 	_action: 'params-bind', | ||||
| 				// 	label: '查看绑定', | ||||
| 				// 	, | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| 				// 			const _this = this; | ||||
| 				// 			return h( | ||||
| 				// 				'el-button', | ||||
| 				// 				{ | ||||
| 				// 					props: { type: 'text' }, | ||||
| 				// 					on: { | ||||
| 				// 						click: function () { | ||||
| 				// 							console.log('inejctdata', _this.injectData); | ||||
| 				// 							_this.$emit('emitData', { | ||||
| 				// 								action: _this.injectData._action, | ||||
| 				// 								payload: _this.injectData, | ||||
| 				// 							}); | ||||
| 				// 						}, | ||||
| 				// 					}, | ||||
| 				// 				}, | ||||
| 				// 				'查看绑定' | ||||
| 				// 			); | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// }, | ||||
| 			], | ||||
| 			rows: [ | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数列名', | ||||
| 						prop: 'plcParamName', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '参数名称', | ||||
| 						prop: 'name', | ||||
| 						rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '单位', | ||||
| 						prop: 'unit', | ||||
| 						options: this.getDictDatas(this.DICT_TYPE.UNIT_DICT), | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						switch: true, | ||||
| 						label: '是否采集', | ||||
| 						prop: 'collection', | ||||
| 						bind: { | ||||
| 							'active-value': 1, | ||||
| 							'inactive-value': 0, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '最小值', | ||||
| 						prop: 'minValue', | ||||
| 						rules: [ | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字', | ||||
| 								trigger: 'change', | ||||
| 								transform: (val) => Number(val), | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '最大值', | ||||
| 						prop: 'maxValue', | ||||
| 						rules: [ | ||||
| 							{ | ||||
| 								required: false, | ||||
| 							}, | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字', | ||||
| 								trigger: 'change', | ||||
| 								transform: (val) => Number(val), | ||||
| 							}, | ||||
| 						], | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '标准值', | ||||
| 						prop: 'defaultValue', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '描述', | ||||
| 						prop: 'description', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '备注', | ||||
| 						prop: 'remark', | ||||
| 						// rules: [{ required: true, message: '不能为空', trigger: 'blur' }], | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			open: false, | ||||
| 			// 查询参数 | ||||
| 			queryParams: { | ||||
| 				pageNo: 1, | ||||
| 				pageSize: 10, | ||||
| 				connectId: null, | ||||
| 			}, | ||||
| 			// 表单参数 | ||||
| 			form: {}, | ||||
| 			connectId: null, | ||||
| 			equipmentName: '', | ||||
| 			plcTableName: '', | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| 					label: '设备名', | ||||
| 					disabled: true, | ||||
| 					param: 'equipmentName', | ||||
| 					defaultSelect: '', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'input', | ||||
| 					label: '关联表名', | ||||
| 					disabled: true, | ||||
| 					param: 'plcName', | ||||
| 					defaultSelect: '', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: | ||||
| 						this.$auth.hasPermi('base:equipment-plc-param:create') && | ||||
| 						!this.isDetailPage | ||||
| 							? 'button' | ||||
| 							: '', | ||||
| 					btnName: '新增', | ||||
| 					name: 'add', | ||||
| 					plain: true, | ||||
| 					color: 'success', | ||||
| 				}, | ||||
| 			], | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		isDetailPage() { | ||||
| 			return this.$route.params.detail === true; | ||||
| 		}, | ||||
| 		tableBtn() { | ||||
| 			return [ | ||||
| 				this.$auth.hasPermi('base:equipment-plc-param:update') && | ||||
| 				!this.isDetailPage | ||||
| 					? { | ||||
| 							type: 'edit', | ||||
| 							btnName: '修改', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 				this.$auth.hasPermi('base:equipment-plc-param:delete') && | ||||
| 				!this.isDetailPage | ||||
| 					? { | ||||
| 							type: 'delete', | ||||
| 							btnName: '删除', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 			].filter((v) => v); | ||||
| 		}, | ||||
| 		// searchBarFormConfig() { | ||||
| 		// 	console.log( | ||||
| 		// 		'ers', | ||||
| 		// 		JSON.stringify({ eid: this.equipmentName, plc: this.plcTableName }) | ||||
| 		// 	); | ||||
| 		// 	return [ | ||||
| 		// 		{ | ||||
| 		// 			type: 'input', | ||||
| 		// 			label: '设备名', | ||||
| 		// 			disabled: true, | ||||
| 		// 			param: 'equipmentName', | ||||
| 		// 			defaultSelect: this.equipmentName, | ||||
| 		// 		}, | ||||
| 		// 		{ | ||||
| 		// 			type: 'input', | ||||
| 		// 			label: '关联表名', | ||||
| 		// 			disabled: true, | ||||
| 		// 			param: 'plcName', | ||||
| 		// 			defaultSelect: this.plcTableName, | ||||
| 		// 		}, | ||||
| 		// 		{ | ||||
| 		// 			type: | ||||
| 		// 				this.$auth.hasPermi('base:equipment-plc-param:create') && | ||||
| 		// 				!this.isDetailPage | ||||
| 		// 					? 'button' | ||||
| 		// 					: '', | ||||
| 		// 			btnName: '新增', | ||||
| 		// 			name: 'add', | ||||
| 		// 			plain: true, | ||||
| 		// 			color: 'success', | ||||
| 		// 		}, | ||||
| 		// 	]; | ||||
| 		// }, | ||||
| 	}, | ||||
| 	activated() { | ||||
| 		console.log('activated,,,'); | ||||
| 		// 设置顶部搜索栏信息 | ||||
| 		const { equipmentName, id: connectId, plcTableName } = this.$route.params; | ||||
| 		// this.equipmentName = equipmentName; | ||||
| 		// this.plcTableName = plcTableName; | ||||
| 		this.setSearchBarFormValue('equipmentName', equipmentName); | ||||
| 		this.setSearchBarFormValue('plcName', plcTableName); | ||||
| 		this.queryParams.connectId = connectId; | ||||
| 		// if (!equipmentGroupId) this.getList(); // 拦截 | ||||
| 		this.getList(); | ||||
| 	}, | ||||
| 	deactivated() { | ||||
| 		console.log('deactivated,,,'); | ||||
| 		this.setSearchBarFormValue('equipmentName', ''); | ||||
| 		this.setSearchBarFormValue('plcName', ''); | ||||
| 		// this.equipmentName = null; | ||||
| 		// this.plcTableName = null; | ||||
| 		this.queryParams.connectId = null; | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 设置 searchBarForm 的默认值 - 用得比较少 */ | ||||
| 		setSearchBarFormValue(param, value) { | ||||
| 			this.searchBarFormConfig.forEach((config) => { | ||||
| 				if (config.param == param) { | ||||
| 					config.defaultSelect = value; | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| 			this.loading = true; | ||||
| 			// 执行查询 | ||||
| 			getEquipmentPlcParamPage(this.queryParams).then((response) => { | ||||
| 				this.list = response.data.list; | ||||
| 				this.total = response.data.total; | ||||
| 				this.loading = false; | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 取消按钮 */ | ||||
| 		cancel() { | ||||
| 			this.open = false; | ||||
| 			this.reset(); | ||||
| 		}, | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| 				id: undefined, | ||||
| 				connectId: undefined, | ||||
| 				plcParamName: undefined, | ||||
| 				name: undefined, | ||||
| 				unit: undefined, | ||||
| 				minValue: null, | ||||
| 				maxValue: null, | ||||
| 				defaultValue: undefined, | ||||
| 				collection: undefined, | ||||
| 				description: undefined, | ||||
| 				remark: undefined, | ||||
| 			}; | ||||
| 			this.resetForm('form'); | ||||
| 		}, | ||||
| 		/** 搜索按钮操作 */ | ||||
| 		handleQuery() { | ||||
| 			this.queryParams.pageNo = 1; | ||||
| 			this.getList(); | ||||
| 		}, | ||||
| 		/** 重置按钮操作 */ | ||||
| 		resetQuery() { | ||||
| 			this.resetForm('queryForm'); | ||||
| 			this.handleQuery(); | ||||
| 		}, | ||||
| 		/** 新增按钮操作 */ | ||||
| 		handleAdd() { | ||||
| 			this.reset(); | ||||
| 			this.open = true; | ||||
| 			this.title = '添加设备数采详情'; | ||||
| 		}, | ||||
| 		/** 修改按钮操作 */ | ||||
| 		handleUpdate(row) { | ||||
| 			this.reset(); | ||||
| 			const id = row.id; | ||||
| 			getEquipmentPlcParam(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| 				this.open = true; | ||||
| 				this.title = '修改设备数采详情'; | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 提交按钮 */ | ||||
| 		submitForm() { | ||||
| 			this.$refs['form'].validate((valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 				// 修改的提交 | ||||
| 				if (this.form.id != null) { | ||||
| 					updateEquipmentPlcParam({ | ||||
| 						...this.form, | ||||
| 						connectId: this.queryParams.connectId, | ||||
| 					}).then((response) => { | ||||
| 						this.$modal.msgSuccess('修改成功'); | ||||
| 						this.open = false; | ||||
| 						this.getList(); | ||||
| 					}); | ||||
| 					return; | ||||
| 				} | ||||
| 				// 添加的提交 | ||||
| 				createEquipmentPlcParam({ | ||||
| 					...this.form, | ||||
| 					connectId: this.queryParams.connectId, | ||||
| 				}).then((response) => { | ||||
| 					this.$modal.msgSuccess('新增成功'); | ||||
| 					this.open = false; | ||||
| 					this.getList(); | ||||
| 				}); | ||||
| 			}); | ||||
| 		}, | ||||
| 		/** 删除按钮操作 */ | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除"' + row.name + '"的参数绑定?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentPlcParam(id); | ||||
| 				}) | ||||
| 				.then(() => { | ||||
| 					this.getList(); | ||||
| 					this.$modal.msgSuccess('删除成功'); | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
| 		/** 导出按钮操作 */ | ||||
| 		handleExport() { | ||||
| 			// 处理查询参数 | ||||
| 			let params = { ...this.queryParams }; | ||||
| 			params.pageNo = undefined; | ||||
| 			params.pageSize = undefined; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认导出所有设备数采详情数据项?') | ||||
| 				.then(() => { | ||||
| 					this.exportLoading = true; | ||||
| 					return exportEquipmentPlcParamExcel(params); | ||||
| 				}) | ||||
| 				.then((response) => { | ||||
| 					this.$download.excel(response, '设备数采详情.xls'); | ||||
| 					this.exportLoading = false; | ||||
| 				}) | ||||
| 				.catch(() => {}); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|   | ||||
							
								
								
									
										94
									
								
								src/views/core/analysis/LineChart.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,94 @@ | ||||
| <!-- | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-13 09:02:25 | ||||
|  * @LastEditTime: 2023-10-16 14:56:58 | ||||
|  * @LastEditors: DY | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
|   <div :class="className" :style="{height:height,width:width}" /> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import * as echarts from 'echarts' | ||||
| require('echarts/theme/macarons') // echarts theme | ||||
| // import resize from './mixins/resize' | ||||
|  | ||||
| export default { | ||||
|   // mixins: [resize], | ||||
|   props: { | ||||
|     className: { | ||||
|       type: String, | ||||
|       default: 'chart' | ||||
|     }, | ||||
|     width: { | ||||
|       type: String, | ||||
|       default: '100%' | ||||
|     }, | ||||
|     height: { | ||||
|       type: String, | ||||
|       default: '350px' | ||||
|     }, | ||||
|     // autoResize: { | ||||
|     //   type: Boolean, | ||||
|     //   default: true | ||||
|     // } | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       chart: null | ||||
|     } | ||||
|   }, | ||||
|   // watch: { | ||||
|   //   chartData: { | ||||
|   //     deep: true, | ||||
|   //     handler(val) { | ||||
|   //       this.setOptions(val) | ||||
|   //     } | ||||
|   //   } | ||||
|   // }, | ||||
|   mounted() { | ||||
|     // this.$nextTick(() => { | ||||
|     //   this.initChart() | ||||
|     // }) | ||||
|   }, | ||||
|   // beforeDestroy() { | ||||
|   //   if (!this.chart) { | ||||
|   //     return | ||||
|   //   } | ||||
|   //   this.chart.dispose() | ||||
|   //   this.chart = null | ||||
|   // }, | ||||
|   methods: { | ||||
|     initChart(xData, yData,lineName) { | ||||
|       console.log( '打印结果', xData,yData, lineName); | ||||
|       this.chart = echarts.init(this.$el, 'macarons') | ||||
|       this.setOptions(xData, yData, lineName) | ||||
|     }, | ||||
|     setOptions(xData, yData, lineName) { | ||||
|       console.log('da', lineName) | ||||
|       let seriesData = [] | ||||
|         lineName.forEach((item,index) => { | ||||
|           seriesData.push({ | ||||
|             name: item, | ||||
|             data: yData[index], | ||||
|             type: 'line', | ||||
|           }) | ||||
|         }) | ||||
|       this.chart.setOption({ | ||||
|         xAxis: { | ||||
|           type: 'category', | ||||
|           data: xData | ||||
|         }, | ||||
|         legend: { | ||||
|           data:lineName | ||||
|         }, | ||||
|         yAxis: { | ||||
|           type: 'value' | ||||
|         }, | ||||
|         series: seriesData | ||||
|       }, true) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
							
								
								
									
										260
									
								
								src/views/core/analysis/balanceAnalysis/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,260 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||
|     <div v-if="tableData.length"> | ||||
|       <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" /> | ||||
|       <SearchBar :formConfigs="[{ label: '产线平衡分析图', type: 'title' }]" /> | ||||
|       <balance-chart ref="lineChart" /> | ||||
|     </div> | ||||
|     <div v-else class="no-data-bg"></div> | ||||
|     <!-- <pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| 			:total="listQuery.total" | ||||
| 			@pagination="getDataList" /> --> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| // import basicPage from '../../mixins/basic-page'; | ||||
| import { parseTime } from '../../mixins/code-filter'; | ||||
| import { getCT } from '@/api/core/analysis/index'; | ||||
| import { getProductionLinePage } from '@/api/core/base/productionLine'; | ||||
| import BalanceChart from '../balanceChart' | ||||
| import { time } from 'echarts'; | ||||
| // import { getWorkshopSectionPage } from '@/api/core/base/workshopSection'; | ||||
|  | ||||
| // const tableProps = [ | ||||
| // 	// { | ||||
| //   //   prop: 'lineName', | ||||
| // 	// 	label: '产线', | ||||
| // 	// 	align: 'center', | ||||
| // 	// }, | ||||
| //   // { | ||||
| //   //   prop: 'sum', | ||||
| //   //   label: '合计', | ||||
| //   //   align: 'center', | ||||
| //   // }, | ||||
| //   // { | ||||
| //   //   prop: 'dynamicValue', | ||||
| //   //   label: 'dynamicName', | ||||
| //   //   align: 'center', | ||||
| //   //   children:[ | ||||
|  | ||||
| //   //   ] | ||||
| //   // } | ||||
| // ]; | ||||
|  | ||||
| export default { | ||||
|   components: { | ||||
|     BalanceChart | ||||
|   }, | ||||
|   // mixins: [basicPage], | ||||
|   data() { | ||||
|     return { | ||||
|       urlOptions: { | ||||
|         getDataListURL: getCT, | ||||
|       }, | ||||
|       tableProps: [], | ||||
|       dataListLoading: false, | ||||
|       tableData: [], | ||||
|       listQuery: { | ||||
|         // time: '' | ||||
|         endTime: undefined, | ||||
|         lineId:undefined, | ||||
|         startTime:undefined | ||||
|       }, | ||||
|       timeList: [], | ||||
|       spanArr: [],  | ||||
|       xData: [], | ||||
|       yData: [], | ||||
|       optionArrUrl: [getProductionLinePage], | ||||
|       formConfig: [ | ||||
|         { | ||||
|           type: 'select', | ||||
|           label: '产线', | ||||
|           selectOptions: [], | ||||
|           param: 'lineIds', | ||||
|           defaultSelect: '', | ||||
|           multiple: false, | ||||
|           filterable: true, | ||||
|         }, | ||||
|         { | ||||
|           type: 'datePicker', | ||||
|           label: '时间', | ||||
|           dateType: 'datetimerange', | ||||
|           format: 'yyyy-MM-dd', | ||||
|           valueFormat: 'yyyy-MM-dd HH:mm:ss', | ||||
|           rangeSeparator: '-', | ||||
|           startPlaceholder: '开始时间', | ||||
|           endPlaceholder: '结束时间', | ||||
|           width: 350, | ||||
|           param: 'time', | ||||
|         }, | ||||
|         { | ||||
|           type: 'button', | ||||
|           btnName: '查询', | ||||
|           name: 'search', | ||||
|           color: 'primary', | ||||
|         } | ||||
|       ], | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getArr(); | ||||
|   }, | ||||
|   methods: { | ||||
|     getArr() { | ||||
|       const params = { | ||||
|         page: 1, | ||||
|         limit: 500 | ||||
|       } | ||||
|       this.optionArrUrl.forEach((item, index) => { | ||||
|         item(params).then((response) => { | ||||
|           this.formConfig[index].selectOptions = response.data.list | ||||
|         }); | ||||
|       }); | ||||
|     }, | ||||
|     setRowSpan(arr) { | ||||
|       let count = 0 | ||||
|       arr.forEach((item, index) => { | ||||
|         if(index === 0) { | ||||
|           this.spanArr.push(1) | ||||
|         } else { | ||||
|           if (item === arr[index - 1]) { | ||||
|             this.spanArr[count] += 1 | ||||
|             this.spanArr.push(0) | ||||
|           } else { | ||||
|             count = index | ||||
|             this.spanArr.push(1) | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     /** 合并table列的规则 */ | ||||
| 		mergeColumnHandler({ row, column, rowIndex, columnIndex }) { | ||||
| 			if (columnIndex == 0) { | ||||
| 				if (this.spanArr[rowIndex]) { | ||||
| 					return [ | ||||
| 						this.spanArr[rowIndex], // row span | ||||
| 						1, // col span | ||||
| 					]; | ||||
| 				} else { | ||||
| 					return [0, 0]; | ||||
| 				} | ||||
| 			} | ||||
| 		}, | ||||
|     getData() { | ||||
|       // this.listQuery.lineId = '1672847052717821953' | ||||
|       // this.listQuery.startTime = '1693497600000'; | ||||
|       // this.listQuery.endTime = '1693843200000'; | ||||
|       this.urlOptions.getDataListURL(this.listQuery).then(res => { | ||||
|         console.log(res) | ||||
|         let arr = [ | ||||
|           { | ||||
|             prop: 'sectionName', | ||||
|             label: '工段', | ||||
|             align: 'center', | ||||
|           }, | ||||
|           { | ||||
|             prop: 'equName', | ||||
|             label: '设备', | ||||
|             align: 'center', | ||||
|           } | ||||
|         ] | ||||
|         let sectionArr= [] | ||||
|         res.data.data.forEach((ele, index) => { | ||||
|           let tempData = [] | ||||
|           let eqData = [] | ||||
|             let plData = [] | ||||
|           ele.data.forEach((item, index) => { | ||||
|             item.children.forEach(params => { | ||||
|               if (params.dynamicName === '设备CT') { | ||||
|                 tempData[item.dynamicName + '_eq'] = params.dynamicValue | ||||
|                 eqData[index] = params.dynamicValue | ||||
|               } else { | ||||
|                 tempData[item.dynamicName + '_pl'] = params.dynamicValue | ||||
|                 plData[index] = params.dynamicValue | ||||
|               } | ||||
|             }) | ||||
|           }) | ||||
|           const equipment = { | ||||
|             name: ele.equName, | ||||
|             eqData: eqData, | ||||
|             plData: plData | ||||
|           } | ||||
|           tempData['equName'] = ele.equName | ||||
|           tempData['sectionName'] = ele.sectionName | ||||
|           this.tableData.push(tempData) | ||||
|           const { sectionName } = tempData | ||||
|           sectionArr.push(sectionName) | ||||
|           this.yData.push(equipment) | ||||
|           console.log('看看equ', this.yData) | ||||
|         }) | ||||
|         this.setRowSpan(sectionArr) | ||||
|         res.data.nameData.forEach(item => { | ||||
|           this.timeList.push(item.name) | ||||
|         }) | ||||
|         const timeArray = Array.from(new Set(this.timeList)) | ||||
|         for (const times of timeArray) { | ||||
|           if (times !== '设备CT' && times !== '产线CT') { | ||||
|             const subprop = { | ||||
|               label: times, | ||||
|               align: 'center', | ||||
|               children: [ | ||||
|                 { prop: times + '_eq', label: '设备CT', align: 'center' }, | ||||
|                 { prop: times + '_pl', label: '产线CT', align: 'center' } | ||||
|               ] | ||||
|             } | ||||
|             arr.push(subprop) | ||||
|             this.xData.push(times) | ||||
|           } | ||||
|         } | ||||
|         this.tableProps = arr | ||||
|  | ||||
|         console.log('表格横坐标', this.xData) | ||||
|         this.$refs.lineChart.initChart(this.xData, this.yData) | ||||
|         // this.total = response.data.total; | ||||
|         // this.dataListLoading = false; | ||||
|       }); | ||||
|     }, | ||||
|     buttonClick(val) { | ||||
|       // console.log(val) | ||||
|       switch (val.btnName) { | ||||
|         case 'search': | ||||
|           // this.listQuery.pageNo = 1; | ||||
|           // this.listQuery.pageSize = 10; | ||||
|           this.listQuery.lineId = val.lineIds | ||||
|           this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined; | ||||
|           this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined; | ||||
|           if (val.time && val.lineIds) { | ||||
|             this.tableData = [] | ||||
|             this.xData = [] | ||||
|             this.yData = [] | ||||
|             this.tableProps = [] | ||||
|             this.spanArr = [] | ||||
|             this.timeList = [] | ||||
|             this.getData() | ||||
|           } else { | ||||
|             this.$message({ | ||||
|               message: '请选择产线和时间', | ||||
|               type: 'warning' | ||||
|             }); | ||||
|           } | ||||
|           break; | ||||
|         case 'reset': | ||||
|           this.$refs.searchBarForm.resetForm(); | ||||
|           this.listQuery = { | ||||
|             pageSize: 10, | ||||
|             pageNo: 1, | ||||
|             total: 1, | ||||
|           }; | ||||
|           this.getDataList(); | ||||
|           break; | ||||
|         default: | ||||
|           console.log(val); | ||||
|       } | ||||
|     }, | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
							
								
								
									
										134
									
								
								src/views/core/analysis/balanceChart.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,134 @@ | ||||
| <!-- | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-13 09:02:25 | ||||
|  * @LastEditTime: 2023-10-08 16:36:37 | ||||
|  * @LastEditors: DY | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
|   <div> | ||||
|     <div style="margin: 20px"> | ||||
|       <el-button v-for="(item, index) in buttonList" :key="index" :class="[item.actived ? 'activeButton': 'normalButton']" @click="changeChart(index)">{{ item.name }}</el-button> | ||||
|     </div> | ||||
|     <div ref="chartDiv" :class="className" :style="{height:height,width:width}" /> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import * as echarts from 'echarts' | ||||
| require('echarts/theme/macarons') // echarts theme | ||||
| // import resize from './mixins/resize' | ||||
|  | ||||
| export default { | ||||
|   // mixins: [resize], | ||||
|   props: { | ||||
|     className: { | ||||
|       type: String, | ||||
|       default: 'chart' | ||||
|     }, | ||||
|     width: { | ||||
|       type: String, | ||||
|       default: '100%' | ||||
|     }, | ||||
|     height: { | ||||
|       type: String, | ||||
|       default: '350px' | ||||
|     }, | ||||
|     // autoResize: { | ||||
|     //   type: Boolean, | ||||
|     //   default: true | ||||
|     // } | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       chart: null, | ||||
|       dataArray: [], | ||||
|       xDatas: [], | ||||
|       buttonList: [] | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|   }, | ||||
|   methods: { | ||||
|     changeChart(index) { | ||||
|       this.setOptions(this.xDatas, this.dataArray[index]) | ||||
|       this.buttonList.forEach((item, s) => { | ||||
|         if (index === s) { | ||||
|           // item.actived = true | ||||
|           this.$nextTick(() =>{ | ||||
|             // item.actived = true | ||||
|             this.$set(item, 'actived', true) | ||||
|           }) | ||||
|         } else { | ||||
|           // item.actived = false | ||||
|           this.$nextTick(() =>{ | ||||
|             // item.actived = false | ||||
|             this.$set(item, 'actived', false) | ||||
|           }) | ||||
|           // this.$set(item, 'actived', false) | ||||
|         } | ||||
|       }) | ||||
|       console.log('看一下数22222据', this.dataArray) | ||||
|     }, | ||||
|     initChart(xData, yData, lineName) { | ||||
|       this.dataArray = yData | ||||
|       this.buttonList = this.dataArray.map((item, index) => { | ||||
|         return { | ||||
|           'name': item.name, | ||||
|           'actived': index === 0 ? true : false | ||||
|         } | ||||
|       }) | ||||
|       console.log('看一下数据', this.dataArray) | ||||
|       this.xDatas = xData | ||||
|       this.chart = echarts.init(this.$refs.chartDiv, 'macarons') | ||||
|       this.setOptions(xData, yData[0], lineName) | ||||
|     }, | ||||
|     setOptions(xData, dataList, lineName) { | ||||
|       // let seriesData = [] | ||||
|         // lineName.forEach((item,index) => { | ||||
|         //   seriesData.push({ | ||||
|         //     name: item, | ||||
|         //     data: yData[index], | ||||
|         //     type: 'line', | ||||
|         //   }) | ||||
|         // }) | ||||
|       this.chart.setOption({ | ||||
|         xAxis: { | ||||
|           type: 'category', | ||||
|           data: xData | ||||
|         }, | ||||
|         tooltip: { | ||||
|           trigger: 'axis' | ||||
|         }, | ||||
|         legend: { | ||||
|           data:lineName | ||||
|         }, | ||||
|         yAxis: { | ||||
|           type: 'value' | ||||
|         }, | ||||
|         series: [ | ||||
|           { | ||||
|             name: '设备CT', | ||||
|             data: dataList.eqData, | ||||
|             type: 'line', | ||||
|           }, | ||||
|           { | ||||
|             name: '产线CT', | ||||
|             data: dataList.plData, | ||||
|             type: 'line', | ||||
|           } | ||||
|         ] | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped> | ||||
| .activeButton { | ||||
|   background-color: rgb(93,159,255); | ||||
| } | ||||
| .normalButton { | ||||
|   background-color: none; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										262
									
								
								src/views/core/analysis/yieldAnalysis/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,262 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||
|     <div v-if="tableData.length"> | ||||
|       <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" /> | ||||
|       <SearchBar :formConfigs="[{ label: '产品产量对比图', type: 'title' }]" /> | ||||
|       <line-chart ref="lineChart" /> | ||||
|     </div> | ||||
|     <div v-else class="no-data-bg"></div> | ||||
|     <!-- <pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| 			:total="listQuery.total" | ||||
| 			@pagination="getDataList" /> --> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| // import basicPage from '../../mixins/basic-page'; | ||||
| import { parseTime } from '../../mixins/code-filter'; | ||||
| import { getYieldAnalysisPageData } from '@/api/core/analysis/index'; | ||||
| import { getProductionLinePage } from '@/api/core/base/productionLine'; | ||||
| import lineChart from '../LineChart' | ||||
| // import { getWorkshopSectionPage } from '@/api/core/base/workshopSection'; | ||||
|  | ||||
| // const tableProps = [ | ||||
| // 	// { | ||||
| //   //   prop: 'lineName', | ||||
| // 	// 	label: '产线', | ||||
| // 	// 	align: 'center', | ||||
| // 	// }, | ||||
| //   // { | ||||
| //   //   prop: 'sum', | ||||
| //   //   label: '合计', | ||||
| //   //   align: 'center', | ||||
| //   // }, | ||||
| //   // { | ||||
| //   //   prop: 'dynamicValue', | ||||
| //   //   label: 'dynamicName', | ||||
| //   //   align: 'center', | ||||
| //   //   children:[ | ||||
|  | ||||
| //   //   ] | ||||
| //   // } | ||||
| // ]; | ||||
|  | ||||
| export default { | ||||
|   components: { | ||||
|     lineChart, | ||||
|   }, | ||||
| 	// mixins: [basicPage], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			urlOptions: { | ||||
|         getDataListURL: getYieldAnalysisPageData, | ||||
| 			}, | ||||
|       tableProps:[], | ||||
|       dataListLoading:false, | ||||
|       tableData: [], | ||||
|       listQuery: { | ||||
|         lineIds: [], | ||||
|         time: '' | ||||
|       }, | ||||
|       dateLabelList: [], | ||||
|       optionArrUrl: [getProductionLinePage ], | ||||
| 			formConfig: [ | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| 					label: '产线', | ||||
| 					selectOptions: [], | ||||
|           param: 'lineIds', | ||||
|           defaultSelect: '', | ||||
|           multiple:true, | ||||
| 					filterable: true, | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'datePicker', | ||||
| 					label: '时间', | ||||
| 					dateType: 'month', | ||||
| 					format: 'yyyy-MM-dd', | ||||
| 					valueFormat: 'yyyy-MM-dd HH:mm:ss', | ||||
| 					rangeSeparator: '-', | ||||
| 					startPlaceholder: '开始时间', | ||||
| 					endPlaceholder: '结束时间', | ||||
|           param: 'time', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '查询', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				} | ||||
| 			], | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getArr(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		getArr() { | ||||
| 			const params = { | ||||
| 				page: 1, | ||||
| 				limit: 500, | ||||
| 			}; | ||||
| 			this.optionArrUrl.forEach((item, index) => { | ||||
| 				item(params).then((response) => { | ||||
| 					this.formConfig[index].selectOptions = response.data.list | ||||
|           // this.formConfig[0].defaultSelect = response.data.list[0].id | ||||
|           this.$set(this.formConfig[0], 'defaultSelect', response.data.list[0].id) | ||||
| 				}); | ||||
| 			}); | ||||
|     }, | ||||
|     getData() { | ||||
|       // this.listQuery.lineIds = ['1672847052717821953'] | ||||
|       // this.listQuery.productId = val.productId; | ||||
|       // this.listQuery.time = '1694486098000'; | ||||
|       this.urlOptions.getDataListURL(this.listQuery).then(res => { | ||||
|         let arr = [ | ||||
|           	{ | ||||
|               prop: 'lineName', | ||||
|           		label: '产线', | ||||
|               fixed: 'left' | ||||
|           	}, | ||||
|             { | ||||
|               prop: 'sum', | ||||
|               label: '合计', | ||||
|               fixed: 'left' | ||||
|             }, | ||||
|             { | ||||
|               prop: res.data ? res.data.nameData[0].name : undefined, | ||||
|               label: res.data ? res.data.nameData[0].name : undefined, | ||||
|               align: 'center', | ||||
|               children:[ | ||||
|  | ||||
|               ] | ||||
|             } | ||||
|         ] | ||||
|         // console.log(res.data.nameData.slice(1)) | ||||
|         let xData = [] | ||||
|         let yAllData = [] | ||||
|         let lineName = [] | ||||
|         if (res.data) { | ||||
|           let tempDateList = [] | ||||
|           res.data.nameData.forEach(date => { | ||||
|             tempDateList.push(date.name) | ||||
|           }) | ||||
|           this.dateLabelList = Array.from(new Set(tempDateList)) | ||||
|  | ||||
|           this.dateLabelList.forEach(item => { | ||||
|             if (item.indexOf('年') === -1) { | ||||
|               // 构造表头 | ||||
|               const props = { | ||||
|                 'prop': item, | ||||
|                 'label': item | ||||
|               } | ||||
|               arr[2].children.push(props) | ||||
|  | ||||
|               // 构造echarts横坐标 | ||||
|               xData.push(item) | ||||
|             } | ||||
|           }) | ||||
|           // res.data.nameData.slice(1).forEach(item => { | ||||
|           //   const props = { | ||||
|           //     'prop': item.name, | ||||
|           //     'label': item.name, | ||||
|           //     'align': 'center' | ||||
|           //   } | ||||
|           //   arr[2].children.push(props) | ||||
|           // }) | ||||
|           let tableDataArr =[] | ||||
|           res.data.data.forEach(item => { | ||||
|             let obj = {} | ||||
|             obj.lineName= item.lineName, | ||||
|             obj.sum= item.sum, | ||||
|             item.data.forEach((ele, index) => { | ||||
|               // console.log(ele) | ||||
|               ele.children.forEach((e) => { | ||||
|                 console.log(e.dynamicName) | ||||
|                 obj['' + e.dynamicName + ''] = e.dynamicValue | ||||
|                 console.log(obj['' + e.dynamicName + '']); | ||||
|               }) | ||||
|             }) | ||||
|             tableDataArr.push(obj) | ||||
|           }); | ||||
|           this.tableData = tableDataArr | ||||
|           this.tableProps = arr | ||||
|            | ||||
|           // let tempList = [] | ||||
|           // res.data.nameData.slice(1).forEach(item => { | ||||
|           //   tempList.push(item.name) | ||||
|           //   // arr[2].children.push(props) | ||||
|           // }) | ||||
|           // xData = Array.from(new Set(tempList)) | ||||
|            | ||||
|           res.data.data.forEach(item => { | ||||
|             let yData = [] | ||||
|             lineName.push(item.lineName) | ||||
|             // let obj = {} | ||||
|             // obj.lineName = item.lineName, | ||||
|             //   obj.sum = item.sum, | ||||
|             item.data.forEach((ele, index) => { | ||||
|                 // console.log(ele) | ||||
|               ele.children.forEach((e) => { | ||||
|                 // let yData = [] | ||||
|                 yData.push(e.dynamicValue) | ||||
|                 }) | ||||
|               }) | ||||
|             yAllData.push(yData) | ||||
|           }); | ||||
|           console.log(lineName) | ||||
|         } else { | ||||
|           this.tableProps = arr | ||||
|           this.tableData = [] | ||||
|           xData = [] | ||||
|           yAllData = [] | ||||
|           lineName = [] | ||||
|         } | ||||
|         // res.data.data[0].data[0].children.forEach((item, index) => { | ||||
|         //   // console.log(item) | ||||
|         //   yData.push(item.dynamicValue) | ||||
|         //   // let data = 'data' + Number(index+1) | ||||
|         //   // obj['' + item.dynamicName + ''] = item.dynamicValue | ||||
|         // }) | ||||
|         // console.log(this.yData) | ||||
|         this.$refs.lineChart.initChart(xData, yAllData, lineName) | ||||
|         // this.total = response.data.total; | ||||
|         // this.dataListLoading = false; | ||||
|       }); | ||||
|     }, | ||||
|     buttonClick(val) { | ||||
| 			switch (val.btnName) { | ||||
|         case 'search': | ||||
|           this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined | ||||
|           // this.listQuery.productId = val.productId; | ||||
|           this.listQuery.time = val.time ? new Date(val.time).getTime() : undefined | ||||
| 					// this.listQuery.pageNo = 1; | ||||
|           // this.listQuery.pageSize = 10; | ||||
|           if (val.time) { | ||||
|             this.getData() | ||||
|           } else { | ||||
|             this.$message({ | ||||
|               message: '请选择时间', | ||||
|               type: 'warning' | ||||
|             }); | ||||
|           } | ||||
| 					break; | ||||
| 				case 'reset': | ||||
| 					this.$refs.searchBarForm.resetForm(); | ||||
| 					this.listQuery = { | ||||
| 						pageSize: 10, | ||||
| 						pageNo: 1, | ||||
| 						total: 1, | ||||
| 					}; | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				default: | ||||
| 					console.log(val); | ||||
| 			} | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
							
								
								
									
										412
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,412 @@ | ||||
| <!--  | ||||
|     filename: AssetsUpload.vue | ||||
|     author: liubin | ||||
|     date: 2023-10-12 16:40:14 | ||||
|     description: 上传资料/图片 组件 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<div class="assets-upload"> | ||||
| 		<section class="operations"> | ||||
| 			<el-button type="text" class="expand-btn" @click="expand = !expand"> | ||||
| 				<i class="el-icon-folder-opened" v-if="expand"></i> | ||||
| 				<i class="el-icon-folder" v-else></i> | ||||
| 				展开 | ||||
| 			</el-button> | ||||
| 			<!-- <div class="preview-btn"> | ||||
| 				<i class="el-icon-view"></i> | ||||
| 				预览 | ||||
| 			</div> --> | ||||
| 		</section> | ||||
| 		<section class="file-area"> | ||||
| 			<el-upload | ||||
| 				class="equipment-upload" | ||||
| 				:disabled="disabled" | ||||
| 				drag | ||||
| 				:action="uploadUrl" | ||||
| 				:headers="headers" | ||||
| 				multiple | ||||
| 				:show-file-list="false" | ||||
| 				:before-upload="beforeUpload" | ||||
| 				:on-success="handleSuccess"> | ||||
| 				<i class="el-icon-upload"></i> | ||||
| 				<div class="el-upload__text"> | ||||
| 					<span>将文件拖到此处或</span> | ||||
| 					<em>点击上传</em> | ||||
| 				</div> | ||||
| 				<div class="el-upload__tip" slot="tip"> | ||||
| 					{{ | ||||
| 						isPicMode ? '仅支持上传 .jpg .png 格式文件, 且' : '' | ||||
| 					}}文件大小不超过2MB | ||||
| 				</div> | ||||
| 			</el-upload> | ||||
| 			<!-- <div | ||||
| 				class="file-list__item" | ||||
| 				v-for="n in 9" | ||||
| 				:key="n" | ||||
| 				:style="{ | ||||
| 					display: n > 4 && !expand ? 'none' : 'block', | ||||
| 				}" | ||||
| 				:data-name="n" | ||||
| 				:class="{ 'default-icon': !isPicMode }"> | ||||
| 				<i class="el-icon-delete"></i> | ||||
| 			</div> --> | ||||
| 			<div | ||||
| 				class="file-list__item" | ||||
| 				v-for="(file, index) in files" | ||||
| 				:key="file.fileName" | ||||
| 				:style="{ | ||||
| 					display: index > 3 && !expand ? 'none' : 'block', | ||||
| 					background: isPicMode | ||||
| 						? `url(${file.fileUrl}) no-repeat` | ||||
| 						: `url(${defaultBg}) no-repeat`, | ||||
| 					backgroundSize: isPicMode ? '100% 100%' : '64px', | ||||
| 					backgroundPosition: isPicMode ? '0% 0%' : 'center', | ||||
| 				}" | ||||
| 				:data-name="file.fileName"> | ||||
| 				<el-button | ||||
| 					v-if="!disabled" | ||||
| 					type="text" | ||||
| 					class="el-icon-delete" | ||||
| 					style="padding: 0" | ||||
| 					@click="(e) => handleDelete(file)" /> | ||||
| 			</div> | ||||
| 		</section> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| import defaultBg from '../../../../../assets/images/default-file-icon.png'; | ||||
|  | ||||
| function checkSize(file, message) { | ||||
| 	const isLt2M = file.size / 1024 / 1024 < 2; | ||||
| 	if (!isLt2M) { | ||||
| 		message.error('上传文件大小不能超过 2MB!'); | ||||
| 	} | ||||
| 	return isLt2M; | ||||
| } | ||||
|  | ||||
| function checkPic(file, message) { | ||||
| 	const isJPG = file.type === 'image/jpeg'; | ||||
| 	const isPNG = file.type === 'image/png'; | ||||
| 	const isPic = isJPG || isPNG; | ||||
| 	if (!isPic) { | ||||
| 		message.error('上传图片只能是 JPG/PNG 格式!'); | ||||
| 	} | ||||
| 	return isPic; | ||||
| } | ||||
|  | ||||
| export default { | ||||
| 	name: 'AssetsUpload', | ||||
| 	components: {}, | ||||
| 	model: { | ||||
| 		prop: 'dataSource', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	props: { | ||||
| 		type: { | ||||
| 			type: String, | ||||
| 			default: 'image', | ||||
| 		}, | ||||
| 		dataSource: { | ||||
| 			type: Array, | ||||
| 			default: () => [], | ||||
| 		}, | ||||
| 		equipmentId: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 		isPicMode: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	emits: ['update-filelist'], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			defaultBg, | ||||
| 			expand: false, | ||||
| 			headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部 | ||||
| 			fileList: [], | ||||
| 			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', | ||||
| 			files: [ | ||||
| 				// 服务器返回的结构 | ||||
| 				// { | ||||
| 				// 	fileName: 'sf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://hbimg.b0.upaiyun.com/cc7475787bd08ed926b68eaf53fa1f2c5473259115e3c-gJdObd_fw658', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'sddf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: 'https://img0.sc115.com/wm/xqx/pic1/1501xofo4ssolji.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'jjj.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013081823/1-130QR34544.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdfasdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://hbimg.b0.upaiyun.com/8f6bced5f2e38d3a021b2c48d5a98dfb6317e3e12c6a0-QmhJ5v_fw658', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdkj.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013013021/1-130130212034.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'lkasjdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013072122/1-130H1223057.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://img.1ppt.com/uploads/allimg/1212/1-1212101ZH5A2.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'afdffff.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013051721/1-13051H11945.jpg', | ||||
| 				// }, | ||||
| 			], | ||||
| 			updateTimer: null, | ||||
| 		}; | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		dataSource: { | ||||
| 			handler(val) { | ||||
| 				this.files = JSON.parse(JSON.stringify(val)); | ||||
| 			}, | ||||
| 			immediate: true, | ||||
| 			deep: true, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() {}, | ||||
| 	methods: { | ||||
| 		// handle success, per file! | ||||
| 		handleSuccess(response, file, fileList) { | ||||
| 			this.$notify({ | ||||
| 				title: '成功', | ||||
| 				message: '上传成功! 点击确认保存上传结果', | ||||
| 				type: 'success', | ||||
| 			}); | ||||
| 			if ( | ||||
| 				response == null || | ||||
| 				!('data' in response) || | ||||
| 				response.data == null || | ||||
| 				response.data.trim() == '' | ||||
| 			) { | ||||
| 				this.$message.error('上传出错了!'); | ||||
| 				return; | ||||
| 			} | ||||
| 			this.files.push({ | ||||
| 				fileName: file.name, | ||||
| 				fileUrl: response.data, | ||||
| 				fileType: this.isPicMode ? 1 : 2, | ||||
| 			}); | ||||
| 			// debugger; | ||||
|  | ||||
| 			// 延时更新 | ||||
| 			if (this.updateTimer) { | ||||
| 				clearTimeout(this.updateTimer); | ||||
| 			} | ||||
| 			this.updateTimer = setTimeout(() => { | ||||
| 				console.log('[AssetsUpload] 更新上传列表'); | ||||
| 				this.emitFilelist(); | ||||
| 				clearTimeout(this.updateTimer); | ||||
| 				this.updateTimer = null; | ||||
| 			}, 500); | ||||
| 		}, | ||||
|  | ||||
| 		emitFilelist() { | ||||
| 			this.$emit('update', this.files); | ||||
| 		}, | ||||
|  | ||||
| 		handleRemove(file, fileList) { | ||||
| 			debugger; | ||||
| 		}, | ||||
|  | ||||
| 		handleDelete(file) { | ||||
| 			// fileName fileType 都可能一样,但 fileUrl 一定不一样 | ||||
| 			this.files = this.files.filter((item) => item.fileUrl != file.fileUrl); | ||||
| 			this.$notify({ | ||||
| 				title: '成功', | ||||
| 				message: '删除成功! 需点击确认保存删除结果', | ||||
| 				type: 'success', | ||||
| 			}); | ||||
| 			this.emitFilelist(); | ||||
| 		}, | ||||
|  | ||||
| 		beforeUpload(file) { | ||||
| 			if (this.isPicMode) { | ||||
| 				return checkPic(file, this.$message) && checkSize(file, this.$message); | ||||
| 			} | ||||
| 			return checkSize(file, this.$message); | ||||
| 		}, | ||||
|  | ||||
| 		handleUpload() { | ||||
| 			switch (this.type) { | ||||
| 				case 'image': | ||||
| 					break; | ||||
| 				case 'asset': | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		updateFileList(appendFilelist) { | ||||
| 			// Array | ||||
| 			this.$emit('update-filelist', this.appendFilelist); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .assets-upload { | ||||
| 	position: relative; | ||||
| } | ||||
|  | ||||
| .operations { | ||||
| 	position: absolute; | ||||
| 	top: -36px; | ||||
| 	right: 0; | ||||
| 	display: flex; | ||||
| 	align-items: center; | ||||
| } | ||||
|  | ||||
| .expand-btn, | ||||
| .preview-btn { | ||||
| 	font-size: 14px; | ||||
| 	line-height: 1.2; | ||||
| 	display: inline-block; | ||||
| 	padding-left: 20px; | ||||
| 	cursor: pointer; | ||||
| 	z-index: 1000; | ||||
| } | ||||
|  | ||||
| .expand-btn { | ||||
| 	margin-right: 12px; | ||||
| } | ||||
|  | ||||
| .preview-btn { | ||||
| 	color: #ccc; | ||||
| } | ||||
|  | ||||
| .expand-btn, | ||||
| .preview-btn:hover, | ||||
| .preview-btn.active { | ||||
| 	// color: #0042d0; | ||||
| 	color: #0b58ff; | ||||
| } | ||||
|  | ||||
| :deep(.equipment-upload) { | ||||
| 	background: #ccc4; | ||||
| 	.el-upload-dragger { | ||||
| 		width: 188px; | ||||
| 		height: 128px; | ||||
| 	} | ||||
|  | ||||
| 	.el-icon-upload { | ||||
| 		margin: 12px 0; | ||||
| 		font-size: 48px; | ||||
| 	} | ||||
|  | ||||
| 	.el-upload__text { | ||||
| 		font-size: 12px; | ||||
| 		line-height: 2px; | ||||
| 		display: flex; | ||||
| 		flex-direction: column; | ||||
|  | ||||
| 		em { | ||||
| 			margin-top: 12px; | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	.el-upload__tip { | ||||
| 		font-size: 12px; | ||||
| 		line-height: 1.5; | ||||
| 		color: #d1d1d1; | ||||
| 		margin: 0 0 12px; | ||||
| 		transform: translateY(-12px); | ||||
| 		user-select: none; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .file-list { | ||||
| 	padding: 12px; | ||||
| 	border: 1px solid #ccc; | ||||
| } | ||||
|  | ||||
| // custom | ||||
| .file-area { | ||||
| 	display: grid; | ||||
| 	grid-template-columns: repeat(5, 188px); | ||||
| 	grid-auto-rows: 128px; | ||||
| 	gap: 24px 18px; | ||||
| 	place-content: center; | ||||
| } | ||||
|  | ||||
| .file-list__item { | ||||
| 	background-color: #fff; | ||||
| 	border: 1px dashed #d9d9d9; | ||||
| 	border-radius: 6px; | ||||
| 	-webkit-box-sizing: border-box; | ||||
| 	box-sizing: border-box; | ||||
| 	text-align: center; | ||||
| 	cursor: pointer; | ||||
| 	position: relative; | ||||
| 	// overflow: hidden; | ||||
|  | ||||
| 	&:hover { | ||||
| 		.el-icon-delete { | ||||
| 			display: block; | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	.el-icon-delete { | ||||
| 		color: #ccc; | ||||
| 		position: absolute; | ||||
| 		top: 8px; | ||||
| 		right: 8px; | ||||
| 		display: none; | ||||
|  | ||||
| 		&:hover { | ||||
| 			color: rgb(210, 41, 41); | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .file-list__item:hover { | ||||
| 	border-color: #0b58ff; | ||||
| } | ||||
|  | ||||
| .file-list__item::after { | ||||
| 	content: attr(data-name); | ||||
| 	position: absolute; | ||||
| 	left: 0; | ||||
| 	bottom: -26px; | ||||
| 	font-size: 14px; | ||||
| 	line-height: 2; | ||||
| 	color: #616161; | ||||
| } | ||||
|  | ||||
| .default-icon { | ||||
| 	background: url(../../../../../assets/images/default-file-icon.png) no-repeat; | ||||
| 	background-position: center; | ||||
| 	background-size: 64px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										313
									
								
								src/views/core/base/equipment/components/DialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,313 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-15 10:32:36 | ||||
|     description: 弹窗的表单组件 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="form" | ||||
| 		:label-width="`${labelWidth}px`" | ||||
| 		:size="size" | ||||
| 		:label-position="labelPosition" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex"> | ||||
| 			<el-col v-for="col in row" :key="col.label" :span="24 / row.length"> | ||||
| 				<el-form-item :label="col.label" :prop="col.prop" :rules="col.rules"> | ||||
| 					<el-input | ||||
| 						v-if="col.input" | ||||
| 						v-model="form[col.prop]" | ||||
| 						@change="$emit('update', form)" | ||||
| 						:placeholder="`请输入${col.label}`" | ||||
| 						v-bind="col.bind" /> | ||||
| 					<el-input | ||||
| 						v-if="col.textarea" | ||||
| 						type="textarea" | ||||
| 						v-model="form[col.prop]" | ||||
| 						@change="$emit('update', form)" | ||||
| 						:placeholder="`请输入${col.label}`" | ||||
| 						v-bind="col.bind" /> | ||||
| 					<el-select | ||||
| 						v-if="col.select" | ||||
| 						v-model="form[col.prop]" | ||||
| 						:placeholder="`请选择${col.label}`" | ||||
| 						@change="$emit('update', form)" | ||||
| 						v-bind="col.bind"> | ||||
| 						<el-option | ||||
| 							v-for="opt in optionListOf[col.prop]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 					<el-date-picker | ||||
| 						v-if="col.datetime" | ||||
| 						v-model="form[col.prop]" | ||||
| 						type="datetime" | ||||
| 						:placeholder="`请选择${col.label}`" | ||||
| 						value-format="timestamp" | ||||
| 						v-bind="col.bind"></el-date-picker> | ||||
| 					<el-upload | ||||
| 						class="upload-in-dialog" | ||||
| 						v-if="col.upload" | ||||
| 						:file-list="uploadedFileList" | ||||
| 						:action="col.url" | ||||
| 						:on-success="handleUploadSuccess" | ||||
| 						v-bind="col.bind"> | ||||
| 						<el-button | ||||
| 							size="small" | ||||
| 							type="primary" | ||||
| 							:disabled="col.bind?.disabled || false"> | ||||
| 							点击上传 | ||||
| 						</el-button> | ||||
| 						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips"> | ||||
| 							{{ col.uploadTips || '只能上传jpg/png文件,大小不超过2MB' }} | ||||
| 						</div> | ||||
| 					</el-upload> | ||||
| 					<el-switch | ||||
| 						v-if="col.switch" | ||||
| 						v-model="form[col.prop]" | ||||
| 						active-color="#0b58ff" | ||||
| 						inactive-color="#e1e1e1" | ||||
| 						v-bind="col.bind"></el-switch> | ||||
| 					<component | ||||
| 						v-if="col.subcomponent" | ||||
| 						:key="col.key" | ||||
| 						:is="col.subcomponent" | ||||
| 						v-bind="col.bind" | ||||
| 						:inlineStyle="col.style"></component> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| /** | ||||
|  * 找到最长的label | ||||
|  * @param {*} options | ||||
|  */ | ||||
| function findMaxLabelWidth(rows) { | ||||
| 	let max = 0; | ||||
| 	rows.forEach((row) => { | ||||
| 		row.forEach((opt) => { | ||||
| 			// debugger; | ||||
| 			if (!opt.label) return 0; | ||||
| 			if (opt.label.length > max) { | ||||
| 				max = opt.label.length; | ||||
| 			} | ||||
| 		}); | ||||
| 	}); | ||||
| 	return max; | ||||
| } | ||||
|  | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		rows: { | ||||
| 			type: Array, | ||||
| 			default: () => [], | ||||
| 		}, | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		labelPosition: { | ||||
| 			type: String, | ||||
| 			default: 'right', | ||||
| 		}, | ||||
| 		size: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 			optionListOf: {}, | ||||
| 			uploadedFileList: [], | ||||
| 			dataLoaded: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		labelWidth() { | ||||
| 			let max = findMaxLabelWidth(this.rows); | ||||
| 			// 每个汉字占20px | ||||
| 			return max * 20; | ||||
| 			// return max * 20 + 'px'; | ||||
| 		}, | ||||
| 		form: { | ||||
| 			get() { | ||||
| 				// if (this.dataLoaded) return this.dataForm; | ||||
| 				// else return {} | ||||
| 				return this.dataForm; | ||||
| 			}, | ||||
| 			set(val) { | ||||
| 				console.log('set form', val); | ||||
| 			}, | ||||
| 		}, | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		rows: { | ||||
| 			handler() { | ||||
| 				console.log('watch triggered!'); | ||||
| 				this.$nextTick(() => { | ||||
| 					this.handleOptions('watch'); | ||||
| 				}); | ||||
| 			}, | ||||
| 			deep: true, | ||||
| 			immediate: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		// 处理 options | ||||
| 		this.handleOptions(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		// getCode | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 		async handleOptions(trigger = 'monuted') { | ||||
| 			console.log('[dialogForm:handleOptions]'); | ||||
| 			const promiseList = []; | ||||
| 			this.rows.forEach((cols) => { | ||||
| 				cols.forEach((opt) => { | ||||
| 					if (opt.value && !this.form[opt.prop]) { | ||||
| 						// 默认值 | ||||
| 						this.form[opt.prop] = opt.value; | ||||
| 					} | ||||
|  | ||||
| 					if (opt.options) { | ||||
| 						this.$set(this.optionListOf, opt.prop, opt.options); | ||||
| 					} else if (opt.url) { | ||||
| 						// 如果有 depends,则暂时先不获取,注册一个watcher | ||||
| 						if (opt.depends) { | ||||
| 							console.log('[handleOptions] setting watch'); | ||||
| 							this.$watch( | ||||
| 								() => this.form[opt.depends], | ||||
| 								(id) => { | ||||
| 									console.log('<', opt.depends, '>', 'changed', id); | ||||
| 									if (id == null) return; | ||||
| 									// 清空原有选项 | ||||
| 									this.form[opt.prop] = null; | ||||
| 									// 获取新的选项 | ||||
| 									this.$axios({ | ||||
| 										url: `${opt.url}?id=${id}`, | ||||
| 									}).then((res) => { | ||||
| 										this.$set( | ||||
| 											this.optionListOf, | ||||
| 											opt.prop, | ||||
| 											res.data.map((item) => ({ | ||||
| 												label: item[opt.labelKey ?? 'name'], | ||||
| 												value: item[opt.valueKey ?? 'id'], | ||||
| 											})) | ||||
| 										); | ||||
| 									}); | ||||
| 								}, | ||||
| 								{ | ||||
| 									immediate: true, | ||||
| 								} | ||||
| 							); | ||||
| 							return; | ||||
| 						} | ||||
| 						// 如果是下拉框,或者新增模式下的输入框,才去请求 | ||||
| 						if (opt.select || (opt.input && !this.form?.id)) { | ||||
| 							promiseList.push(async () => { | ||||
| 								const response = await this.$axios(opt.url, { | ||||
| 									method: opt.method ?? 'get', | ||||
| 								}); | ||||
| 								console.log('[dialogForm:handleOptions:response]', response); | ||||
| 								if (opt.select) { | ||||
| 									// 处理下拉框选项 | ||||
| 									const list = | ||||
| 										'list' in response.data | ||||
| 											? response.data.list | ||||
| 											: response.data; | ||||
| 									this.$set( | ||||
| 										this.optionListOf, | ||||
| 										opt.prop, | ||||
| 										list.map((item) => ({ | ||||
| 											label: item[opt.labelKey ?? 'name'], | ||||
| 											value: item[opt.valueKey ?? 'id'], | ||||
| 										})) | ||||
| 									); | ||||
| 								} else if (opt.input) { | ||||
| 									console.log('setting code: ', response.data); | ||||
| 									// 处理输入框数据 | ||||
| 									this.form[opt.prop] = response.data; | ||||
| 								} | ||||
| 							}); | ||||
| 						} | ||||
| 					} | ||||
| 				}); | ||||
| 			}); | ||||
|  | ||||
| 			console.log('[dialogForm:handleOptions] done!'); | ||||
|  | ||||
| 			// 如果是 watch 触发的,不需要执行进一步的请求 | ||||
| 			if (trigger == 'watch') { | ||||
| 				this.formLoading = false; | ||||
| 				return; | ||||
| 			} | ||||
| 			try { | ||||
| 				await Promise.all(promiseList.map((fn) => fn())); | ||||
| 				this.formLoading = false; | ||||
| 				this.dataLoaded = true; | ||||
| 				// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf) | ||||
| 			} catch (error) { | ||||
| 				console.log('[dialogForm:handleOptions:error]', error); | ||||
| 				this.formLoading = false; | ||||
| 			} | ||||
| 			if (!promiseList.length) this.formLoading = false; | ||||
| 		}, | ||||
| 		// 上传成功的特殊处理 | ||||
| 		beforeUpload() {}, | ||||
| 		// 上传前的验证规则可通过 bind 属性传入 | ||||
| 		handleUploadSuccess(response, file, fileList) { | ||||
| 			console.log( | ||||
| 				'[dialogForm:handleUploadSuccess]', | ||||
| 				response, | ||||
| 				file, | ||||
| 				fileList, | ||||
| 				this.form | ||||
| 			); | ||||
| 			// 保存原始文件名 | ||||
| 			if ('fileNames' in this.form) this.form.fileNames.push(file.name); | ||||
| 			// 保存完整地址 | ||||
| 			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data); | ||||
| 			this.$modal.msgSuccess('上传成功'); | ||||
| 		}, | ||||
|  | ||||
| 		getFileName(fileUrl) { | ||||
| 			return fileUrl.split('/').pop(); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -29,23 +29,28 @@ | ||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | ||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | ||||
|  | ||||
| 					<div class="form-part" v-if="section.key == 'base'"> | ||||
| 					<div | ||||
| 						class="form-part" | ||||
| 						v-if="section.key == 'base'" | ||||
| 						style="margin-bottom: 32px"> | ||||
| 						<el-skeleton v-if="!showForm" animated /> | ||||
| 						<DialogForm | ||||
| 						<EquipmentInfoForm | ||||
| 							key="drawer-dialog-form" | ||||
| 							v-if="showForm" | ||||
| 							ref="form" | ||||
| 							:dataForm="form" | ||||
| 							:rows="formRows" /> | ||||
| 							:disabled="mode.includes('detail')" | ||||
| 							:sync-filelist="syncFileListFlag" | ||||
| 							v-model="form" /> | ||||
| 					</div> | ||||
|  | ||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||
| 						<base-table | ||||
| 							v-loading="attrListLoading" | ||||
| 							:table-props="section.props" | ||||
| 							:page="section.pageNo || 1" | ||||
| 							:limit="section.pageSize || 10" | ||||
| 							:page="attrQuery?.params.pageNo || 1" | ||||
| 							:limit="attrQuery?.params.pageSize || 10" | ||||
| 							:table-data="list" | ||||
| 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||
| 							@emitButtonClick="handleAddAttr" | ||||
| 							@emitFun="handleEmitFun"> | ||||
| 							<method-btn | ||||
| 								v-if="section.tableBtn" | ||||
| @@ -54,27 +59,31 @@ | ||||
| 								:method-list="tableBtn" | ||||
| 								@clickBtn="handleTableBtnClick" /> | ||||
| 						</base-table> | ||||
|  | ||||
| 						<!-- 分页组件 --> | ||||
| 						<pagination | ||||
| 							v-show="total > 0" | ||||
| 							:total="total" | ||||
| 							:page.sync="attrQuery.params.pageNo" | ||||
| 							:limit.sync="attrQuery.params.pageSize" | ||||
| 							@pagination="getAttrList" /> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 			</div> | ||||
|  | ||||
| 			<div class="drawer-body__footer"> | ||||
| 				<el-button style="margin-right: 10px" @click="handleCancel"> | ||||
| 					返回 | ||||
| 				</el-button> | ||||
| 				<el-button style="" @click="handleCancel">取消</el-button> | ||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||
| 					编辑 | ||||
| 				</el-button> | ||||
| 				<span v-else> | ||||
| 					<el-button type="primary" @click="handleSave">保存</el-button> | ||||
| 					<!-- sections的第二项必须是 属性列表  --> | ||||
| 					<el-button | ||||
| 				<el-button v-else type="primary" @click="handleConfirm">确定</el-button> | ||||
| 				<!-- sections的第二项必须是 属性列表  --> | ||||
| 				<!-- <el-button | ||||
| 						v-if="sections[1].allowAdd" | ||||
| 						type="primary" | ||||
| 						@click="handleAddAttr"> | ||||
| 						添加属性 | ||||
| 					</el-button> | ||||
| 				</span> | ||||
| 					</el-button> --> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| @@ -99,11 +108,13 @@ | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import DialogForm from '@/components/DialogForm'; | ||||
| import DialogForm from './DialogForm'; | ||||
| import EquipmentInfoForm from './EquipmentInfoForm.vue'; | ||||
|  | ||||
| const SmallTitle = { | ||||
| 	name: 'SmallTitle', | ||||
| 	props: ['size'], | ||||
| 	components: {}, | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| @@ -127,12 +138,13 @@ const SmallTitle = { | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	components: { SmallTitle, DialogForm }, | ||||
| 	components: { SmallTitle, DialogForm, EquipmentInfoForm }, | ||||
| 	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			visible: false, | ||||
| 			showForm: false, | ||||
| 			btnLoading: false, | ||||
| 			total: 0, | ||||
| 			form: {}, | ||||
| 			list: [], | ||||
| @@ -161,10 +173,16 @@ export default { | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			attrQuery: null, // 属性列表的请求 | ||||
| 			attrQuery: { | ||||
| 				params: { | ||||
| 					pageNo: 1, | ||||
| 					pageSize: 10, | ||||
| 				}, | ||||
| 			}, // 属性列表的请求 | ||||
| 			infoQuery: null, // 基本信息的请求 | ||||
| 			attrFormSubmitting: false, | ||||
| 			attrListLoading: false, | ||||
| 			syncFileListFlag: null, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| @@ -175,15 +193,19 @@ export default { | ||||
| 						// 重置图片的位置 | ||||
| 						return { | ||||
| 							...col, | ||||
| 							bind: { | ||||
| 								...col.bind, | ||||
| 							}, | ||||
| 							style: { | ||||
| 								left: 0, | ||||
| 								right: 'unset' | ||||
| 							} | ||||
| 						} | ||||
| 								right: 'unset', | ||||
| 							}, | ||||
| 						}; | ||||
| 					} | ||||
| 					return { | ||||
| 						...col, | ||||
| 						bind: { | ||||
| 							...col.bind, | ||||
| 							// 详情 模式下,禁用各种输入 | ||||
| 							disabled: this.mode == 'detail', | ||||
| 						}, | ||||
| @@ -208,9 +230,52 @@ export default { | ||||
| 				this.$axios(query).then(({ data }) => { | ||||
| 					if (section.key == 'base') { | ||||
| 						this.form = data; | ||||
| 						// this.form = { | ||||
| 						// 	code: 'gj', | ||||
| 						// 	name: '下片机', | ||||
| 						// 	enName: 'unload', | ||||
| 						// 	abbr: '', | ||||
| 						// 	equipmentTypeId: 21084, | ||||
| 						// 	remark: '备注', | ||||
| 						// 	id: '1712367395052384257', | ||||
| 						// 	createTime: 1697095176000, | ||||
| 						// 	enterTime: 0, | ||||
| 						// 	productionTime: 0, | ||||
| 						// 	files: [ | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试.xlsx', | ||||
| 						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0108%2F0f0c6f30j00r5cle9000sc000hs00gtc.jpg&thumbnail=660x2147483647&quality=80&type=jpg', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试2.xlsx', | ||||
| 						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0415%2F2cd23619j00racb96000kc000hs00hsc.jpg&thumbnail=660x2147483647&quality=80&type=jpg', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试3.xlsx', | ||||
| 						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F1fea91a0-d088-409e-b145-e0e61254b28b%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=2e0fe7d1de7f54adff3007efe133d67c', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试4.xlsx', | ||||
| 						// 			fileUrl: 'https://pics5.baidu.com/feed/b7003af33a87e950cdfb4b4546eed044faf2b40d.jpeg?token=1d7484cfe4b014dd201f8c8725cab945', | ||||
| 						// 			fileType: 2 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试5.xlsx', | ||||
| 						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Fe3500876-9c46-4b70-8d37-4799520cdd13%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=4abc1df930e62730e5361a7d3765e0f2', | ||||
| 						// 			fileType: 2 | ||||
| 						// 		}, | ||||
| 						// 	], | ||||
| 						// 	tvalue: 0, | ||||
| 						// 	processingTime: 0, | ||||
| 						// 	manufacturer: '', | ||||
| 						// 	spec: '', | ||||
| 						// 	description: '描述', | ||||
| 						// }; | ||||
| 						this.showForm = true; | ||||
| 						this.infoQuery = query; | ||||
| 						console.log('setting form: ', this.form, data); | ||||
| 					} else if (section.key == 'attrs') { | ||||
| 						this.attrQuery = query; | ||||
| 						this.list = data.list; | ||||
| @@ -231,6 +296,24 @@ export default { | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		async handleConfirm() { | ||||
| 			this.btnLoading = true; | ||||
| 			this.syncFileListFlag = Math.random(); | ||||
|  | ||||
| 			this.$nextTick(async () => { | ||||
| 				const { code, data } = await this.$axios({ | ||||
| 					url: this.sections[0].urlUpdate, | ||||
| 					method: 'put', | ||||
| 					data: this.form, | ||||
| 				}); | ||||
| 				if (code == 0) { | ||||
| 					this.$modal.msgSuccess('更新成功'); | ||||
| 				} | ||||
|  | ||||
| 				this.btnLoading = false; | ||||
| 				this.handleCancel(); | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		handleEmitFun(val) { | ||||
| 			console.log('handleEmitFun', val); | ||||
| @@ -273,7 +356,7 @@ export default { | ||||
|  | ||||
| 		// 开启编辑 | ||||
| 		toggleEdit() { | ||||
| 			this.mode = 'edit'; | ||||
| 			this.$emit('update-mode', 'edit'); | ||||
| 		}, | ||||
|  | ||||
| 		// 新增属性 | ||||
| @@ -331,33 +414,44 @@ export default { | ||||
| 		}, | ||||
|  | ||||
| 		// 提交属性表 | ||||
| 		async submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate((valid) => { | ||||
| 		submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate(async (valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 			}); | ||||
| 			console.log('this.attrform', this.attrForm); | ||||
| 			const isEdit = this.attrForm.id != null; | ||||
| 			this.attrFormSubmitting = true; | ||||
| 			const res = await this.$axios({ | ||||
| 				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, | ||||
| 				method: isEdit ? 'put' : 'post', | ||||
| 				data: this.attrForm, | ||||
| 			}); | ||||
|  | ||||
| 			if (res.code == 0) { | ||||
| 				this.closeAttrForm(); | ||||
| 				this.$message({ | ||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 					type: 'success', | ||||
| 					duration: 1500, | ||||
| 					onClose: () => { | ||||
| 						this.getAttrList(); | ||||
| 					}, | ||||
| 				}); | ||||
| 			} | ||||
| 			this.attrFormSubmitting = false; | ||||
| 				try { | ||||
| 					const isEdit = this.attrForm.id != null; | ||||
| 					this.attrFormSubmitting = true; | ||||
| 					const res = await this.$axios({ | ||||
| 						url: isEdit | ||||
| 							? this.sections[1].urlUpdate | ||||
| 							: this.sections[1].urlCreate, | ||||
| 						method: isEdit ? 'put' : 'post', | ||||
| 						data: this.attrForm, | ||||
| 					}); | ||||
|  | ||||
| 					if (res.code == 0) { | ||||
| 						this.closeAttrForm(); | ||||
| 						this.$message({ | ||||
| 							message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 							type: 'success', | ||||
| 							duration: 1500, | ||||
| 							onClose: () => { | ||||
| 								this.getAttrList(); | ||||
| 							}, | ||||
| 						}); | ||||
| 					} | ||||
| 					this.attrFormSubmitting = false; | ||||
| 				} catch (err) { | ||||
| 					this.$message({ | ||||
| 						message: err, | ||||
| 						type: 'error', | ||||
| 						duration: 1500, | ||||
| 					}); | ||||
| 					this.attrFormSubmitting = false; | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		closeAttrForm() { | ||||
|   | ||||
							
								
								
									
										337
									
								
								src/views/core/base/equipment/components/EquipmentInfoForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						| @@ -0,0 +1,337 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-15 10:32:36 | ||||
|     description: 弹窗的表单组件 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		class="equipment-info-form" | ||||
| 		ref="form" | ||||
| 		:model="form" | ||||
| 		label-width="200px" | ||||
| 		label-position="top" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item | ||||
| 					label="设备名称" | ||||
| 					prop="name" | ||||
| 					:rules="[{ required: true, message: '不能为空', trigger: 'blur' }]"> | ||||
| 					<el-input | ||||
| 						v-model="form.name" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入设备名称"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="设备编码" prop="code" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.code" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入设备编码"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="英文名称" prop="enName" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.enName" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入英文名称"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="缩写" prop="abbr" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.abbr" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入名称缩写"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="设备类型" prop="equipmentTypeId" :rules="[]"> | ||||
| 					<el-select | ||||
| 						v-model="form.equipmentTypeId" | ||||
| 						:disabled="disabled" | ||||
| 						filterable | ||||
| 						placeholder="请选择设备类型"> | ||||
| 						<el-option | ||||
| 							v-for="eqType in eqTypeList" | ||||
| 							:key="eqType.id" | ||||
| 							:label="eqType.name" | ||||
| 							:value="eqType.id"></el-option> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="备注" prop="remark" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.remark" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入备注"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="生产日期" prop="productionTime" :rules="[]"> | ||||
| 					<el-date-picker | ||||
| 						v-model="form.enterTime" | ||||
| 						:disabled="disabled" | ||||
| 						type="datetime" | ||||
| 						placeholder="请选择生产日期" | ||||
| 						value-format="timestamp"></el-date-picker> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="进场日期" prop="enterTime" :rules="[]"> | ||||
| 					<el-date-picker | ||||
| 						v-model="form.enterTime" | ||||
| 						:disabled="disabled" | ||||
| 						type="datetime" | ||||
| 						placeholder="请选择进场日期" | ||||
| 						value-format="timestamp"></el-date-picker> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item | ||||
| 					label="设备TT值" | ||||
| 					prop="tvalue" | ||||
| 					:rules="[ | ||||
| 						{ required: true, message: '不能为空', trigger: 'blur' }, | ||||
| 						{ | ||||
| 							type: 'number', | ||||
| 							message: '请输入正确的数字值', | ||||
| 							trigger: 'blur', | ||||
| 							transform: (val) => Number(val), | ||||
| 						}, | ||||
| 					]"> | ||||
| 					<el-input | ||||
| 						v-model="form.tvalue" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入设备TT值"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item | ||||
| 					label="产品加工时间(s)" | ||||
| 					prop="processingTime" | ||||
| 					:rules="[ | ||||
| 						{ required: true, message: '不能为空', trigger: 'blur' }, | ||||
| 						{ | ||||
| 							type: 'number', | ||||
| 							message: '请输入正确的数字值', | ||||
| 							trigger: 'blur', | ||||
| 							transform: (val) => Number(val), | ||||
| 						}, | ||||
| 					]"> | ||||
| 					<el-input | ||||
| 						v-model="form.processingTime" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入产品加工时间"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="制造商" prop="manufacturer" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.manufacturer" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入制造商"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="8"> | ||||
| 				<el-form-item label="设备规格" prop="spec" :rules="[]"> | ||||
| 					<el-input | ||||
| 						v-model="form.spec" | ||||
| 						:disabled="disabled" | ||||
| 						placeholder="请输入设备规格"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<!-- 功能描述  --> | ||||
| 			<el-col> | ||||
| 				<el-form-item label="功能描述" prop="description" :rules="[]"> | ||||
| 					<el-input | ||||
| 						type="textarea" | ||||
| 						:disabled="disabled" | ||||
| 						v-model="form.description" | ||||
| 						placeholder="请填写功能描述"></el-input> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<!-- 上传资料  --> | ||||
| 			<el-col> | ||||
| 				<el-form-item label="上传资料" prop="assets" :rules="[]"> | ||||
| 					<AssetsUpload v-model="form.assets" :disabled="disabled" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<!-- 上传图片  --> | ||||
| 			<el-col> | ||||
| 				<el-form-item label="上传图片" prop="pics" :rules="[]"> | ||||
| 					<AssetsUpload | ||||
| 						:is-pic-mode="true" | ||||
| 						v-model="form.pics" | ||||
| 						:disabled="disabled" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import AssetsUpload from './AssetsUpload.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentInfoForm', | ||||
|  | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
|  | ||||
| 	emits: ['update'], | ||||
|  | ||||
| 	components: { AssetsUpload }, | ||||
|  | ||||
| 	props: { | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		syncFilelist: { | ||||
| 			type: Number, | ||||
| 			default: null, | ||||
| 			required: false, | ||||
| 		}, | ||||
| 	}, | ||||
|  | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: false, | ||||
| 			form: { | ||||
| 				name: '', | ||||
| 				code: '', | ||||
| 				enName: '', | ||||
| 				abbr: '', | ||||
| 				equipmentTypeId: '', | ||||
| 				remark: '', | ||||
| 				productionTime: '', | ||||
| 				enterTime: '', | ||||
| 				tvalue: '', | ||||
| 				processingTime: '', | ||||
| 				manufacturer: '', | ||||
| 				spec: '', | ||||
| 				description: '', | ||||
| 				assets: [], | ||||
| 				pics: [], | ||||
| 			}, | ||||
| 			eqTypeList: [], | ||||
| 			dataLoaded: false, | ||||
| 		}; | ||||
| 	}, | ||||
|  | ||||
| 	watch: { | ||||
| 		dataForm: { | ||||
| 			handler(val) { | ||||
| 				// debugger; | ||||
| 				this.form = JSON.parse(JSON.stringify(val)); | ||||
| 				this.form.assets = | ||||
| 					this.form.files?.filter((item) => item.fileType == '2') || []; | ||||
| 				this.form.pics = | ||||
| 					this.form.files?.filter((item) => item.fileType == '1') || []; | ||||
| 				delete this.form.files; | ||||
| 			}, | ||||
| 			immediate: true, | ||||
| 			deep: true, | ||||
| 		}, | ||||
| 		syncFilelist: { | ||||
| 			handler(val) { | ||||
| 				if (val != null) { | ||||
| 					this.updateForm(); | ||||
| 				} | ||||
| 			}, | ||||
| 			immediate: true, | ||||
| 		}, | ||||
| 	}, | ||||
|  | ||||
| 	mounted() { | ||||
| 		this.getEqTypeList(); | ||||
| 	}, | ||||
|  | ||||
| 	methods: { | ||||
| 		updateForm() { | ||||
| 			console.log('update form ==> '); | ||||
| 			this.form.files = [...this.form.assets, ...this.form.pics]; | ||||
| 			delete this.form.assets; | ||||
| 			delete this.form.pics; | ||||
| 			this.$emit('update', this.form); | ||||
| 		}, | ||||
|  | ||||
| 		async getEqTypeList() { | ||||
| 			this.formLoading = true; | ||||
| 			const { code, data } = await this.$axios( | ||||
| 				'/base/equipment-type/page?pageNo=1&pageSize=100' | ||||
| 			); | ||||
| 			// debugger; | ||||
| 			if (code == 0) { | ||||
| 				this.eqTypeList = data.list; | ||||
| 			} | ||||
| 			this.formLoading = false; | ||||
| 		}, | ||||
|  | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		// getCode | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 		// 上传成功的特殊处理 | ||||
| 		beforeUpload() {}, | ||||
| 		// 上传前的验证规则可通过 bind 属性传入 | ||||
| 		handleUploadSuccess(response, file, fileList) { | ||||
| 			console.log( | ||||
| 				'[dialogForm:handleUploadSuccess]', | ||||
| 				response, | ||||
| 				file, | ||||
| 				fileList, | ||||
| 				this.form | ||||
| 			); | ||||
| 			// 保存原始文件名 | ||||
| 			if ('fileNames' in this.form) this.form.fileNames.push(file.name); | ||||
| 			// 保存完整地址 | ||||
| 			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data); | ||||
| 			this.$modal.msgSuccess('上传成功'); | ||||
| 		}, | ||||
|  | ||||
| 		getFileName(fileUrl) { | ||||
| 			return fileUrl.split('/').pop(); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -16,6 +16,7 @@ | ||||
| 			<method-btn | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				:width="120" | ||||
| 				label="操作" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| @@ -35,13 +36,16 @@ | ||||
| 			:dialogVisible="open" | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			width="60%" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm | ||||
| 				v-if="open" | ||||
| 				key="index-dialog-form" | ||||
| 				ref="form" | ||||
| 				label-position="top" | ||||
| 				size="small" | ||||
| 				:dataForm="form" | ||||
| 				:rows="rows" /> | ||||
| 				:rows="computedRows" /> | ||||
| 		</base-dialog> | ||||
|  | ||||
| 		<!-- 设备 详情 - 编辑 --> | ||||
| @@ -49,12 +53,13 @@ | ||||
| 			v-if="editVisible" | ||||
| 			ref="drawer" | ||||
| 			:mode="editMode" | ||||
| 			@update-mode="editMode = $event" | ||||
| 			:data-id="form.id" | ||||
| 			:sections="[ | ||||
| 				{ | ||||
| 					name: '基本信息', | ||||
| 					key: 'base', | ||||
| 					rows: rows, | ||||
| 					rows: computedRows, | ||||
| 					url: '/base/equipment/get', | ||||
| 					urlUpdate: '/base/equipment/update', | ||||
| 					urlCreate: '/base/equipment/create', | ||||
| @@ -92,8 +97,8 @@ | ||||
| 				}, | ||||
| 			]" | ||||
| 			@refreshDataList="getList" | ||||
| 			@cancel="editVisible = false" | ||||
| 			@destroy="editVisible = false" /> | ||||
| 			@cancel="cancelEdit" | ||||
| 			@destroy="cancelEdit" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| @@ -114,6 +119,7 @@ import { | ||||
| 	exportEquipmentExcel, | ||||
| } from '@/api/base/equipment'; | ||||
| import Editor from '@/components/Editor'; | ||||
| import AssetsUpload from './components/AssetsUpload.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'Equipment', | ||||
| @@ -138,6 +144,12 @@ export default { | ||||
| 							btnName: '删除', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 				this.$auth.hasPermi(`base:equipment:update`) | ||||
| 					? { | ||||
| 							type: 'detail', | ||||
| 							btnName: '详情', | ||||
| 					  } | ||||
| 					: undefined, | ||||
| 			].filter((v) => v), | ||||
| 			tableProps: [ | ||||
| 				{ | ||||
| @@ -147,38 +159,37 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备名称', align: 'center' }, | ||||
| 				{ prop: 'code', label: '检测编码', align: 'center' }, | ||||
| 				{ prop: 'equipmentType', label: '设备类型', align: 'center' }, | ||||
| 				{ prop: 'enName', label: '英文名称', align: 'center' }, | ||||
| 				{ prop: 'abbr', label: '缩写', align: 'center' }, | ||||
| 				{ | ||||
| 					action: 'show-detail', | ||||
| 					label: '详情', | ||||
| 					align: 'center', | ||||
| 					subcomponent: { | ||||
| 						props: ['injectData'], | ||||
| 						render: function (h) { | ||||
| 							const _this = this; | ||||
| 							return h( | ||||
| 								'el-button', | ||||
| 								{ | ||||
| 									props: { type: 'text', size: 'mini' }, | ||||
| 									on: { | ||||
| 										click: function () { | ||||
| 											console.log('inejctdata', _this.injectData); | ||||
| 											_this.$emit('emitData', { | ||||
| 												action: _this.injectData.action, | ||||
| 												value: _this.injectData.id, | ||||
| 											}); | ||||
| 										}, | ||||
| 									}, | ||||
| 								}, | ||||
| 								'查看详情' | ||||
| 							); | ||||
| 						}, | ||||
| 					}, | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备名称' }, | ||||
| 				{ width: 256, prop: 'code', label: '设备编码' }, | ||||
| 				{ prop: 'equipmentType', label: '设备类型' }, | ||||
| 				{ prop: 'enName', label: '英文名称' }, | ||||
| 				{ prop: 'abbr', label: '缩写' }, | ||||
| 				// { | ||||
| 				// 	action: 'show-detail', | ||||
| 				// 	label: '详情', | ||||
| 				// 	subcomponent: { | ||||
| 				// 		props: ['injectData'], | ||||
| 				// 		render: function (h) { | ||||
| 				// 			const _this = this; | ||||
| 				// 			return h( | ||||
| 				// 				'el-button', | ||||
| 				// 				{ | ||||
| 				// 					props: { type: 'text', size: 'mini' }, | ||||
| 				// 					on: { | ||||
| 				// 						click: function () { | ||||
| 				// 							console.log('inejctdata', _this.injectData); | ||||
| 				// 							_this.$emit('emitData', { | ||||
| 				// 								action: _this.injectData.action, | ||||
| 				// 								value: _this.injectData.id, | ||||
| 				// 							}); | ||||
| 				// 						}, | ||||
| 				// 					}, | ||||
| 				// 				}, | ||||
| 				// 				'查看详情' | ||||
| 				// 			); | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| @@ -233,8 +244,6 @@ export default { | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment/getCode', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '英文名称', | ||||
| @@ -244,6 +253,8 @@ export default { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '缩写', | ||||
| @@ -253,13 +264,15 @@ export default { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
|  | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '设备类型', | ||||
| 						prop: 'equipmentTypeId', | ||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 					}, | ||||
| 					// { | ||||
| 					// 	select: true, | ||||
| @@ -280,8 +293,6 @@ export default { | ||||
| 						label: '进厂日期', | ||||
| 						prop: 'enterTime', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						prop: 'tvalue', | ||||
| @@ -296,11 +307,14 @@ export default { | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '产品加工时间', | ||||
| 						label: '产品加工时间(s)', | ||||
| 						prop: 'processingTime', | ||||
| 						rules: [ | ||||
| 							{ required: true, message: '不能为空', trigger: 'blur' }, | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字值', | ||||
| @@ -309,8 +323,7 @@ export default { | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
|  | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '制造商', | ||||
| @@ -331,40 +344,79 @@ export default { | ||||
| 						prop: 'description', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						upload: true, | ||||
| 						label: '上传资料', | ||||
| 						prop: 'uploadFiles', | ||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 						bind: { | ||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 							'show-file-list': false, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						diy: true, | ||||
| 						key: 'eq-assets', | ||||
| 						label: '设备资料', | ||||
| 						prop: 'fileNames', | ||||
| 						subcomponent: EquipmentAssets, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						diy: true, | ||||
| 						key: 'eq-pics', | ||||
| 						label: '设备图片', | ||||
| 						prop: 'fileUrls', | ||||
| 						subcomponent: EquipmentPics, | ||||
| 						pictures: async () => { | ||||
| 							// some async request | ||||
| 							return []; | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		assetUpload: true, | ||||
| 				// 		label: '上传资料', | ||||
| 				// 		fieldName: 'assets', | ||||
| 				// 		subcomponent: AssetsUpload | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		assetUpload: true, | ||||
| 				// 		label: '上传图片', | ||||
| 				// 		fieldName: 'images', | ||||
| 				// 		subcomponent: AssetsUpload | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		upload: true, | ||||
| 				// 		label: '上传资料', | ||||
| 				// 		prop: 'uploadFiles', | ||||
| 				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 				// 		uploadFnName: 'assetsUpload', // 上传方法名 | ||||
| 				// 		bind: { | ||||
| 				// 			headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 				// 			'show-file-list': false, | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-assets', | ||||
| 				// 		label: '设备资料', | ||||
| 				// 		prop: 'fileNames', | ||||
| 				// 		subcomponent: EquipmentAssets, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// { | ||||
| 				// 		upload: true, | ||||
| 				// 		label: '上传图片', | ||||
| 				// 		prop: 'uploadImages', | ||||
| 				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 				// 		uploadFnName: 'imagesUpload', // 上传方法名 | ||||
| 				// 		bind: { | ||||
| 				// 			headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 				// 			'show-file-list': false, | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-pics', | ||||
| 				// 		label: '设备图片', | ||||
| 				// 		prop: 'fileUrls', | ||||
| 				// 		subcomponent: EquipmentPics, | ||||
| 				// 		pictures: async () => { | ||||
| 				// 			// some async request | ||||
| 				// 			return []; | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-pics', | ||||
| 				// 		label: '设备图片', | ||||
| 				// 		prop: 'fileUrls', | ||||
| 				// 		subcomponent: EquipmentPics, | ||||
| 				// 		pictures: async () => { | ||||
| 				// 			// some async request | ||||
| 				// 			return []; | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 			], | ||||
| 			editVisible: false, | ||||
| 			editMode: 'edit', // 'edit', 'detail' | ||||
| @@ -377,8 +429,8 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '属性名称', align: 'center' }, | ||||
| 				{ prop: 'value', label: '属性值', align: 'center' }, | ||||
| 				{ prop: 'name', label: '属性名称' }, | ||||
| 				{ prop: 'value', label: '属性值' }, | ||||
| 			], | ||||
| 			// 是否显示弹出层 | ||||
| 			open: false, | ||||
| @@ -393,11 +445,49 @@ export default { | ||||
| 			form: { | ||||
| 				id: null, | ||||
| 			}, | ||||
| 			showUploadComponents: false, // 是否显示上传组件 | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getList(); | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		computedRows() { | ||||
| 			return this.showUploadComponents | ||||
| 				? [ | ||||
| 						...this.rows, | ||||
| 						[ | ||||
| 							{ | ||||
| 								assetUpload: true, | ||||
| 								key: 'eq-assets', // 用于区分不同的上传组件 | ||||
| 								label: '上传资料', | ||||
| 								fieldName: 'assets', | ||||
| 								subcomponent: AssetsUpload, | ||||
| 								prop: 'uploadedAssets', | ||||
| 								default: [], | ||||
| 								bind: { | ||||
| 									'is-pic-mode': false, | ||||
| 								}, | ||||
| 							}, | ||||
| 						], | ||||
| 						[ | ||||
| 							{ | ||||
| 								assetUpload: true, | ||||
| 								key: 'eq-pics', // 用于区分不同的上传组件 | ||||
| 								label: '上传图片', | ||||
| 								fieldName: 'images', | ||||
| 								subcomponent: AssetsUpload, | ||||
| 								// prop: '', | ||||
| 								// default: [], | ||||
| 								bind: { | ||||
| 									'is-pic-mode': true, | ||||
| 								}, | ||||
| 							}, | ||||
| 						], | ||||
| 				  ] | ||||
| 				: this.rows; | ||||
| 		}, | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| @@ -414,6 +504,10 @@ export default { | ||||
| 			this.open = false; | ||||
| 			this.reset(); | ||||
| 		}, | ||||
| 		cancelEdit() { | ||||
| 			this.showUploadComponents = false; | ||||
| 			this.editVisible = false; | ||||
| 		}, | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| @@ -439,11 +533,13 @@ export default { | ||||
| 		handleAdd() { | ||||
| 			this.reset(); | ||||
| 			this.open = true; | ||||
| 			this.showUploadComponents = false; | ||||
| 			this.title = '添加设备'; | ||||
| 		}, | ||||
| 		/** 修改按钮操作 */ | ||||
| 		handleUpdate(row) { | ||||
| 			this.reset(); | ||||
| 			this.showUploadComponents = true; | ||||
| 			const id = row.id; | ||||
| 			getEquipment(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| @@ -478,7 +574,7 @@ export default { | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除设备编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除设备名称为"' + row.name + '"的数据项?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipment(id); | ||||
| 				}) | ||||
| @@ -510,6 +606,7 @@ export default { | ||||
| 		viewDetail(id) { | ||||
| 			this.reset(); | ||||
| 			this.editMode = 'detail'; | ||||
| 			this.showUploadComponents = true; | ||||
| 			this.form.id = id; | ||||
| 			this.editVisible = true; | ||||
| 			this.$nextTick(() => { | ||||
| @@ -518,11 +615,11 @@ export default { | ||||
| 		}, | ||||
| 		// overwrite basicPageMixin 里的 处理表格按钮 方法 | ||||
| 		handleTableBtnClick({ data, type }) { | ||||
| 			console.log('[handleTableBtnClick]', data, type); | ||||
| 			switch (type) { | ||||
| 				case 'edit': | ||||
| 					this.reset(); | ||||
| 					this.editMode = 'edit'; | ||||
| 					this.showUploadComponents = true; | ||||
| 					this.form.id = data.id; | ||||
| 					this.editVisible = true; | ||||
| 					this.$nextTick(() => { | ||||
| @@ -532,6 +629,10 @@ export default { | ||||
| 				case 'delete': | ||||
| 					this.handleDelete(data); | ||||
| 					break; | ||||
| 				case 'detail': | ||||
| 					const { id } = data; | ||||
| 					this.viewDetail(id); | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 	}, | ||||
|   | ||||
| @@ -17,6 +17,7 @@ | ||||
| 				v-if="tableBtn.length" | ||||
| 				slot="handleBtn" | ||||
| 				label="操作" | ||||
| 				:width="120" | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleTableBtnClick" /> | ||||
| 		</base-table> | ||||
| @@ -36,7 +37,7 @@ | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
| @@ -54,7 +55,7 @@ import { | ||||
| 	exportEquipmentTypeExcel, | ||||
| } from '@/api/base/equipmentType'; | ||||
|  | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| // import { getAccessToken } from '@/utils/auth'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentType', | ||||
| @@ -85,9 +86,9 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备类型名称', align: 'center' }, | ||||
| 				{ prop: 'code', label: '检测类型编码', align: 'center' }, | ||||
| 				{ prop: 'remark', label: '备注', align: 'center' }, | ||||
| 				{ prop: 'name', label: '设备类型名称' }, | ||||
| 				{ prop: 'code', label: '检测类型编码' }, | ||||
| 				{ prop: 'remark', label: '备注' }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| @@ -148,15 +149,13 @@ export default { | ||||
| 						prop: 'parentId', | ||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||
| 					}, | ||||
| 					{}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						upload: true, | ||||
| 						label: '上传资料', | ||||
| 						prop: 'uploadFiles', | ||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 						bind: { | ||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 							'show-file-list': false, | ||||
| 						}, | ||||
| 						prop: 'files', | ||||
| 					}, | ||||
| 				], | ||||
| 				[{ input: true, label: '备注', prop: 'remark' }], | ||||
| @@ -235,6 +234,25 @@ export default { | ||||
| 			const id = row.id; | ||||
| 			getEquipmentType(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| 				// this.form = { | ||||
| 				// 	code: 'SBLX20230925184444000041', | ||||
| 				// 	name: '测试131', | ||||
| 				// 	remark: '测试可删除', | ||||
| 				// 	id: '1706258479729336322', | ||||
| 				// 	files: [ | ||||
| 				// 		{ fileName: '1.png', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.asdfaslkjfkasdf.png', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '2.txt', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.rar', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.kkk', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: 'test.file', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '222', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: 'g', fileUrl: '', fileType: 2 }, | ||||
| 				// 	], | ||||
| 				// 	createTime: 1695638697000, | ||||
| 				// 	parentId: '1701869972319584257', | ||||
| 				// }; | ||||
| 				// debugger; | ||||
| 				this.open = true; | ||||
| 				this.title = '修改设备类型'; | ||||
| 			}); | ||||
| @@ -266,7 +284,7 @@ export default { | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除设备类型编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除设备类型"' + row.name + '"?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentType(id); | ||||
| 				}) | ||||
|   | ||||
| @@ -1,8 +1,8 @@ | ||||
| <!-- | ||||
|  * @Author: zwq | ||||
|  * @Date: 2021-11-18 14:16:25 | ||||
|  * @LastEditors: zwq | ||||
|  * @LastEditTime: 2023-08-01 16:59:06 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-16 11:16:48 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| @@ -12,21 +12,30 @@ | ||||
| 		ref="dataForm" | ||||
| 		@keyup.enter.native="dataFormSubmit()" | ||||
| 		label-width="80px"> | ||||
| 		<el-form-item label="工厂编码" prop="code"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.code" | ||||
| 				clearable | ||||
| 				placeholder="请输入工厂编码" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="工厂名称" prop="name"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.name" | ||||
| 				clearable | ||||
| 				placeholder="请输入工厂名称" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="地址" prop="address"> | ||||
| 			<el-input v-model="dataForm.address" clearable placeholder="请输入地址" /> | ||||
| 		</el-form-item> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工厂编码" prop="code"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.code" | ||||
| 						clearable | ||||
| 						placeholder="请输入工厂编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工厂名称" prop="name"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.name" | ||||
| 						clearable | ||||
| 						placeholder="请输入工厂名称" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="地址" prop="address"> | ||||
| 					<el-input v-model="dataForm.address" clearable placeholder="请输入地址" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		<!-- <el-form-item label="启用状态" prop="enabled"> | ||||
| 			<el-select | ||||
| 				v-model="dataForm.enabled" | ||||
| @@ -38,9 +47,12 @@ | ||||
| 					:value="dict.value" /> | ||||
| 			</el-select> | ||||
| 		</el-form-item> --> | ||||
| 		<el-form-item label="备注" prop="remark"> | ||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||
| 		</el-form-item> | ||||
| 			<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> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
|   | ||||
| @@ -29,7 +29,7 @@ | ||||
| 			@cancel="handleCancel" | ||||
| 			@confirm="handleConfirm" | ||||
| 			:before-close="handleCancel" | ||||
| 			width="70%"> | ||||
| 			width="50%"> | ||||
| 			<add-or-update | ||||
| 				ref="addOrUpdate" | ||||
| 				@refreshDataList="successSubmit"></add-or-update> | ||||
| @@ -50,29 +50,24 @@ import { | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'code', | ||||
| 		label: '工厂编码', | ||||
| 		align: 'center', | ||||
| 	}, | ||||
| 		label: '工厂编码' | ||||
| 	},																																																																						 | ||||
| 	{ | ||||
| 		prop: 'name', | ||||
| 		label: '工厂名称', | ||||
| 		align: 'center', | ||||
| 		label: '工厂名称' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'address', | ||||
| 		label: '地址', | ||||
| 		align: 'center', | ||||
| 		label: '地址' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'remark', | ||||
| 		label: '备注', | ||||
| 		align: 'center', | ||||
| 		label: '备注' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'createTime', | ||||
| 		label: '创建时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 		filter: parseTime | ||||
| 	}, | ||||
| ]; | ||||
|  | ||||
| @@ -120,14 +115,14 @@ export default { | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '重置', | ||||
| 					name: 'reset', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: 'separate', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	type: 'button', | ||||
| 				// 	btnName: '重置', | ||||
| 				// 	name: 'reset', | ||||
| 				// }, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
|   | ||||
| @@ -1,16 +1,15 @@ | ||||
| <!-- | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-02 15:12:42 | ||||
|  * @LastEditors: zwq | ||||
|  * @LastEditTime: 2023-08-03 14:24:36 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-13 16:35:03 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| 	<div class="app-container"> | ||||
| 		<search-bar | ||||
| 			:formConfigs="formConfig" | ||||
| 			ref="searchBarForm" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 			:formConfigs="[{ label: '产线在制产品', type: 'title' }]" | ||||
| 			ref="searchBarForm" /> | ||||
| 		<base-table | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| @@ -36,20 +35,17 @@ import { getProductPage } from '@/api/core/base/product'; | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'lineName', | ||||
| 		label: '产线', | ||||
| 		align: 'center', | ||||
| 		label: '产线' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'productName', | ||||
| 		label: '在制产品', | ||||
| 		align: 'center', | ||||
| 		list: [], | ||||
| 		subcomponent: selectProduct, | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'recordTime', | ||||
| 		label: '开始时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| ]; | ||||
| @@ -63,14 +59,14 @@ export default { | ||||
| 			}, | ||||
| 			tableProps, | ||||
| 			tableData: [], | ||||
| 			formConfig: [ | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '同步', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 			], | ||||
| 			// formConfig: [ | ||||
| 			// 	{ | ||||
| 			// 		type: 'button', | ||||
| 			// 		btnName: '同步', | ||||
| 			// 		name: 'search', | ||||
| 			// 		color: 'primary', | ||||
| 			// 	}, | ||||
| 			// ], | ||||
| 		}; | ||||
| 	}, | ||||
| 	components: {}, | ||||
| @@ -81,6 +77,7 @@ export default { | ||||
| 		}; | ||||
| 		getProductPage(params).then((response) => { | ||||
| 			this.tableProps[1].list = response.data.list; | ||||
| 			console.log('打印', this.tableProps[1].list) | ||||
| 		}); | ||||
| 	}, | ||||
| 	methods: { | ||||
|   | ||||
| @@ -1,13 +1,12 @@ | ||||
| <!-- | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-03 14:09:18 | ||||
|  * @LastEditors: zwq | ||||
|  * @LastEditTime: 2023-08-03 14:51:16 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-13 16:47:25 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| 	<div class="tableInner"> | ||||
| 		<el-input readonly v-model="list.productName" style="width: 50%;" ></el-input> | ||||
| 		<el-popover | ||||
|     placement="top" | ||||
|     title="切换在制产品" | ||||
| @@ -28,8 +27,11 @@ | ||||
| 					确定 | ||||
| 				</el-button> | ||||
| 			</div> | ||||
| 			<el-button type="text" slot="reference">切换</el-button> | ||||
| 			<el-button type="text" slot="reference"> | ||||
| 				<svg-icon icon-class="changelogo"/> | ||||
| 			</el-button> | ||||
| 		</el-popover> | ||||
| 		<el-input readonly v-model="list.productName" style="width: 50%;margin-left: 5px" ></el-input> | ||||
| 	</div> | ||||
| </template> | ||||
| <script> | ||||
| @@ -48,6 +50,9 @@ export default { | ||||
| 			visible: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		console.log('hello', this.list) | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		changeInput() { | ||||
| 			const data = { | ||||
| @@ -58,6 +63,7 @@ export default { | ||||
| 			switchLineBindProduct(data).then((response) => { | ||||
| 				this.$modal.msgSuccess('修改成功'); | ||||
| 				this.visible = false; | ||||
| 				this.list.productName = this.list.string.split('+')[1] | ||||
| 				this.$emit('emitData'); | ||||
| 			}); | ||||
| 		}, | ||||
|   | ||||
| @@ -28,24 +28,20 @@ import { getProductPage } from '@/api/core/base/product'; | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'productionLineName', | ||||
| 		label: '产线', | ||||
| 		align: 'center', | ||||
| 		label: '产线' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'productName', | ||||
| 		label: '在制产品', | ||||
| 		align: 'center', | ||||
| 		label: '在制产品' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'startTime', | ||||
| 		label: '开始时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'endTime', | ||||
| 		label: '结束时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| ]; | ||||
| @@ -86,7 +82,8 @@ export default { | ||||
| 					rangeSeparator: '-', | ||||
| 					startPlaceholder: '开始时间', | ||||
| 					endPlaceholder: '结束时间', | ||||
| 					param: 'createTime', | ||||
| 					param: 'startTime', | ||||
| 					valueFormat: 'timestamp' | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| @@ -126,7 +123,7 @@ export default { | ||||
| 					this.listQuery.pageSize = 10; | ||||
| 					this.listQuery.productionLineId = val.productionLineId; | ||||
| 					this.listQuery.productId = val.productId; | ||||
| 					this.listQuery.createTime = val.createTime; | ||||
| 					this.listQuery.startTime = val.startTime; | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'reset': | ||||
|   | ||||