Compare commits
	
		
			192 Commits
		
	
	
		
			5aafefda26
			...
			projects/m
		
	
	| 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>
 | 
			
		||||
	</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  | 
							
								
								
									
										
											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
 | 
			
		||||
})
 | 
			
		||||
 
 | 
			
		||||
@@ -176,3 +176,23 @@ 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':
 | 
			
		||||
 
 | 
			
		||||
@@ -43,7 +43,7 @@
 | 
			
		||||
							<el-form-item label="产品类型" prop="typeDictValue">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.typeDictValue"
 | 
			
		||||
                  style="width: 100%"
 | 
			
		||||
									style="width: 100%"
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择产品类型">
 | 
			
		||||
									<el-option
 | 
			
		||||
@@ -58,7 +58,7 @@
 | 
			
		||||
							<el-form-item label="单位" prop="unitDictValue">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.unitDictValue"
 | 
			
		||||
                  style="width: 100%"
 | 
			
		||||
									style="width: 100%"
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择单位">
 | 
			
		||||
									<el-option
 | 
			
		||||
@@ -83,8 +83,8 @@
 | 
			
		||||
							<el-form-item label="单位平方数" prop="area">
 | 
			
		||||
								<el-input
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
                  v-model="dataForm.area"
 | 
			
		||||
                  placeholder="请输入单位平方数" />
 | 
			
		||||
									v-model="dataForm.area"
 | 
			
		||||
									placeholder="请输入单位平方数" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
@@ -111,6 +111,8 @@
 | 
			
		||||
						:table-props="tableProps"
 | 
			
		||||
						:page="listQuery.pageNo"
 | 
			
		||||
						:limit="listQuery.pageSize"
 | 
			
		||||
						:add-button-show="isdetail ? null : '添加属性'"
 | 
			
		||||
						@emitButtonClick="addNew()"
 | 
			
		||||
						:table-data="productAttributeList">
 | 
			
		||||
						<method-btn
 | 
			
		||||
							v-if="!isdetail"
 | 
			
		||||
@@ -123,15 +125,15 @@
 | 
			
		||||
					<pagination
 | 
			
		||||
						v-show="listQuery.total > 0"
 | 
			
		||||
						:total="listQuery.total"
 | 
			
		||||
						:page.sync="listQuery.current"
 | 
			
		||||
						:limit.sync="listQuery.size"
 | 
			
		||||
						:page.sync="listQuery.pageNo"
 | 
			
		||||
						:limit.sync="listQuery.pageSize"
 | 
			
		||||
						:page-sizes="[5, 10, 15]"
 | 
			
		||||
						@pagination="getList" />
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<div style="position: absolute; bottom: 24px; right: 24px">
 | 
			
		||||
		<!-- <div style="position: absolute; bottom: 24px; right: 24px">
 | 
			
		||||
			<el-button style="margin-right: 10px" @click="goback()">返回</el-button>
 | 
			
		||||
			<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
				编辑
 | 
			
		||||
@@ -145,6 +147,14 @@
 | 
			
		||||
					添加属性
 | 
			
		||||
				</el-button>
 | 
			
		||||
			</span>
 | 
			
		||||
		</div> -->
 | 
			
		||||
 | 
			
		||||
		<div class="drawer-body__footer">
 | 
			
		||||
			<el-button style="" @click="goback()">取消</el-button>
 | 
			
		||||
			<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
				编辑
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<product-attr-add
 | 
			
		||||
@@ -250,12 +260,12 @@ export default {
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				area: [
 | 
			
		||||
					// {
 | 
			
		||||
					// 	type: 'float',
 | 
			
		||||
					// 	message: '单位平方数为浮点类型',
 | 
			
		||||
					// 	trigger: 'blur',
 | 
			
		||||
					// 	transfom: 'val => Float(val)',
 | 
			
		||||
					// },
 | 
			
		||||
					{
 | 
			
		||||
						type: 'number',
 | 
			
		||||
						message: '请输入正确的数值',
 | 
			
		||||
						trigger: 'change',
 | 
			
		||||
						transform: (val) => Number(val),
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				processTime: [
 | 
			
		||||
					{
 | 
			
		||||
@@ -263,12 +273,12 @@ export default {
 | 
			
		||||
						message: '完成单位产品用时不能为空',
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
					},
 | 
			
		||||
					// {
 | 
			
		||||
					// 	type: 'number',
 | 
			
		||||
					// 	message: '完成单位产品用时为浮点类型',
 | 
			
		||||
					// 	trigger: 'blur',
 | 
			
		||||
					// 	transfom: 'val => Number(val)',
 | 
			
		||||
					// },
 | 
			
		||||
					{
 | 
			
		||||
						type: 'number',
 | 
			
		||||
						message: '请输入正确的数值',
 | 
			
		||||
						trigger: 'blur',
 | 
			
		||||
						transform: (val) => Number(val),
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			},
 | 
			
		||||
			isdetail: false,
 | 
			
		||||
@@ -277,6 +287,7 @@ export default {
 | 
			
		||||
	methods: {
 | 
			
		||||
		initData() {
 | 
			
		||||
			this.productAttributeList.splice(0);
 | 
			
		||||
			this.listQuery.total = 0;
 | 
			
		||||
		},
 | 
			
		||||
		init(id, isdetail) {
 | 
			
		||||
			this.initData();
 | 
			
		||||
@@ -304,12 +315,10 @@ export default {
 | 
			
		||||
 | 
			
		||||
		getList() {
 | 
			
		||||
			// 获取产品的属性列表
 | 
			
		||||
			const params = {
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
			getProductAttrPage({
 | 
			
		||||
				...this.listQuery,
 | 
			
		||||
				productId: this.dataForm.id,
 | 
			
		||||
			};
 | 
			
		||||
			getProductAttrPage(params).then((response) => {
 | 
			
		||||
			}).then((response) => {
 | 
			
		||||
				this.productAttributeList = response.data.list;
 | 
			
		||||
				this.listQuery.total = response.data.total;
 | 
			
		||||
			});
 | 
			
		||||
@@ -390,6 +399,8 @@ export default {
 | 
			
		||||
<style scoped>
 | 
			
		||||
.drawer >>> .el-drawer {
 | 
			
		||||
	border-radius: 8px 0 0 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form-item__label {
 | 
			
		||||
@@ -400,14 +411,20 @@ export default {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	padding: 32px 32px 24px;
 | 
			
		||||
	border-bottom: 1px solid #dcdfe6;
 | 
			
		||||
	margin-bottom: 30px;
 | 
			
		||||
}
 | 
			
		||||
.drawer >>> .el-drawer__body {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	height: 1px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .content {
 | 
			
		||||
	padding: 0 24px 30px;
 | 
			
		||||
	padding: 30px 24px;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	height: 100%;
 | 
			
		||||
	/* height: 100%; */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .visual-part {
 | 
			
		||||
@@ -422,4 +439,10 @@ export default {
 | 
			
		||||
.drawer >>> .attr-list {
 | 
			
		||||
	padding: 0 16px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer-body__footer {
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: flex-end;
 | 
			
		||||
	padding: 18px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||