Compare commits
	
		
			37 Commits
		
	
	
		
			03c573d5b2
			...
			projects/l
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 10219fd841 | |||
| 74a2a3b8e5 | |||
| c3b4223e5b | |||
| 070e01c2c4 | |||
| 2665b6a0b0 | |||
| a71fb90e6a | |||
| ac85c83cf9 | |||
| c2e987aee4 | |||
| 0e4ed597cd | |||
| 3e7914ac91 | |||
| 9c19a6197a | |||
| 074b35b6a6 | |||
| 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 | 
							
								
								
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							| @@ -1,7 +1,7 @@ | |||||||
| ### | ### | ||||||
|  # @Author: Do not edit |  # @Author: Do not edit | ||||||
|  # @Date: 2023-08-29 09:40:39 |  # @Date: 2023-08-29 09:40:39 | ||||||
|  # @LastEditTime: 2023-09-18 10:44:07 |  # @LastEditTime: 2023-10-16 09:22:52 | ||||||
|  # @LastEditors: DY |  # @LastEditors: DY | ||||||
|  # @Description:  |  # @Description:  | ||||||
| ###  | ###  | ||||||
|   | |||||||
| @@ -75,7 +75,7 @@ | |||||||
|     "vue-count-to": "1.0.13", |     "vue-count-to": "1.0.13", | ||||||
|     "vue-cropper": "0.5.8", |     "vue-cropper": "0.5.8", | ||||||
|     "vue-meta": "^2.4.0", |     "vue-meta": "^2.4.0", | ||||||
|     "vue-plugin-hiprint": "^0.0.54-fix", |     "vue-plugin-hiprint": "0.0.54-fix", | ||||||
|     "vue-quill-editor": "^3.0.6", |     "vue-quill-editor": "^3.0.6", | ||||||
|     "vue-router": "3.4.9", |     "vue-router": "3.4.9", | ||||||
|     "vue-video-player": "^5.0.2", |     "vue-video-player": "^5.0.2", | ||||||
|   | |||||||
							
								
								
									
										
											BIN
										
									
								
								public/static/videos/login.webm
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								public/static/videos/login.webm
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| @@ -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' | import request from '@/utils/request' | ||||||
|  |  | ||||||
| // 创建产线目前生产产品表 主要为更新 | // 创建产线目前生产产品表 主要为更新 | ||||||
| @@ -35,11 +42,11 @@ export function getLineBindProductLog(id) { | |||||||
| } | } | ||||||
|  |  | ||||||
| // 获得产线目前生产产品表 主要为更新分页 | // 获得产线目前生产产品表 主要为更新分页 | ||||||
| export function getLineBindProductLogPage(query) { | export function getLineBindProductLogPage(data) { | ||||||
|   return request({ |   return request({ | ||||||
|     url: '/base/line-bind-product-log/page', |     url: '/base/line-bind-product-log/page', | ||||||
|     method: 'get', |     method: 'post', | ||||||
|     params: query |     data: data | ||||||
|   }) |   }) | ||||||
| } | } | ||||||
|  |  | ||||||
|   | |||||||
							
								
								
									
										15
									
								
								src/assets/icons/svg/changelogo.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										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 | 
							
								
								
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,14 @@ | |||||||
|  | <?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>上传</title> | ||||||
|  |     <g id="组件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.65"> | ||||||
|  |         <g id="上传_Resources/Button" transform="translate(-12.000000, -9.000000)"> | ||||||
|  |             <g id="上传" transform="translate(12.000000, 9.000000)"> | ||||||
|  |                 <g id="upload" transform="translate(0.875000, 0.875000)" fill="currentColor" fill-rule="nonzero"> | ||||||
|  |                     <path d="M5.80371094,0.138085937 C5.8953125,0.046484375 6.01699219,0 6.13867188,0 C6.26035156,0 6.38066406,0.046484375 6.47363281,0.138085937 L8.60371094,2.26953125 C8.78828125,2.45410156 8.78828125,2.75351562 8.60371094,2.93808594 C8.51484375,3.02695312 8.39589844,3.07617188 8.27011719,3.07617188 C8.14433594,3.07617188 8.02539062,3.02695312 7.93652344,2.93808594 L6.61171875,1.61328125 L6.61171875,9.51289062 C6.61171875,9.77402344 6.39980469,9.9859375 6.13867188,9.9859375 C5.87753906,9.9859375 5.665625,9.77402344 5.665625,9.51289062 L5.665625,1.61328125 L4.34082031,2.93808594 C4.15625,3.12265625 3.85683594,3.12265625 3.67363281,2.93808594 C3.4890625,2.75351562 3.4890625,2.45410156 3.67226563,2.26953125 L5.80371094,0.138085937 Z M11.7769531,7.88046875 C11.5158203,7.88046875 11.3039063,8.09238281 11.3039063,8.35351563 L11.3039063,11.025 C11.3039063,11.1794922 11.178125,11.3066406 11.0222656,11.3066406 L1.22636719,11.3066406 C1.071875,11.3066406 0.944726562,11.1808594 0.944726562,11.025 L0.944726562,8.35214844 C0.944726562,8.09101563 0.7328125,7.87910156 0.471679688,7.87910156 C0.210546875,7.87910156 0,8.09238281 0,8.35214844 L0,11.3996094 C0,11.8685547 0.381445313,12.2486328 0.849023437,12.2486328 L11.4009766,12.2486328 C11.8699219,12.2486328 12.25,11.8671875 12.25,11.3996094 L12.25,8.35214844 C12.25,8.09238281 12.0380859,7.88046875 11.7769531,7.88046875 Z" id="Shape"></path> | ||||||
|  |                 </g> | ||||||
|  |                 <rect id="Rectangle-49" x="0" y="0" width="14" height="14"></rect> | ||||||
|  |             </g> | ||||||
|  |         </g> | ||||||
|  |     </g> | ||||||
|  | </svg> | ||||||
| After Width: | Height: | Size: 2.1 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/default-file-icon.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/default-file-icon.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 1.6 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/login-bg.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/login-bg.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 137 KiB | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 944 B | 
							
								
								
									
										
											BIN
										
									
								
								src/assets/logo/cnbm.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/logo/cnbm.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 1.9 KiB | 
| @@ -1,10 +1,13 @@ | |||||||
| /* ===== PC DESIGN ===== */ | /* ===== PC DESIGN ===== */ | ||||||
| $W: 1000; | $W: 1080; | ||||||
| $H: 1920; | $H: 1920; | ||||||
| $picW: 438; | // $picW: 438; | ||||||
| $picH: 560; | // $picH: 560; | ||||||
| $formW: 320; | $picW: 1080; | ||||||
|  | $picH: 1118; | ||||||
|  | $formW: 420; | ||||||
| $tabW: $formW / 2; | $tabW: $formW / 2; | ||||||
|  | // $rowH: 56; | ||||||
| $rowH: 56; | $rowH: 56; | ||||||
| $buttonH: 50; | $buttonH: 50; | ||||||
|  |  | ||||||
| @@ -15,6 +18,7 @@ $containerBgImage: '../assets/images/bg.png'; | |||||||
| $logoWidth: 417px; | $logoWidth: 417px; | ||||||
| $logoHeight: 64px; | $logoHeight: 64px; | ||||||
| $logoImage: '../assets/logo/login-logo.png'; | $logoImage: '../assets/logo/login-logo.png'; | ||||||
|  | $cnbmLogo: '../assets/logo/cnbm.png'; | ||||||
| // container-content | // container-content | ||||||
| $contentWidth: round($W / $H * 100) * 1vw; | $contentWidth: round($W / $H * 100) * 1vw; | ||||||
| $contentHeight: round($picH / $W * 100) / 100 * $contentWidth; | $contentHeight: round($picH / $W * 100) / 100 * $contentWidth; | ||||||
| @@ -22,7 +26,8 @@ $contentBgColor: #ffffff; | |||||||
| // container-content-pic | // container-content-pic | ||||||
| $picWidth: round($picW / $H * 100) * 1vw; | $picWidth: round($picW / $H * 100) * 1vw; | ||||||
| $picHeight: inherit; | $picHeight: inherit; | ||||||
| $picImage: '../assets/images/pic.png'; | // $picImage: '../assets/images/pic.png'; | ||||||
|  | $picImage: '../assets/images/login-bg.png'; | ||||||
| // container-content-field | // container-content-field | ||||||
| $fieldWidth: $contentWidth - $picWidth; | $fieldWidth: $contentWidth - $picWidth; | ||||||
| $fieldHeight: inherit; | $fieldHeight: inherit; | ||||||
| @@ -34,231 +39,310 @@ $buttonHeight: $buttonH * 1px; | |||||||
|  |  | ||||||
| // - - - - - 页面基础设置 | // - - - - - 页面基础设置 | ||||||
| .container { | .container { | ||||||
|   .login-code { | 	.login-code { | ||||||
|     width: 33%; | 		width: 33%; | ||||||
|     height: 38px; | 		height: 38px; | ||||||
|     float: right; | 		float: right; | ||||||
|     img { | 		img { | ||||||
|       cursor: pointer; | 			cursor: pointer; | ||||||
|       width:100%;max-width:100px; height:auto; | 			width: 100%; | ||||||
|       vertical-align: middle; | 			max-width: 100px; | ||||||
|     } | 			height: auto; | ||||||
|   } | 			vertical-align: middle; | ||||||
|   // 元素 | 		} | ||||||
|   width: inherit; | 	} | ||||||
|   height: inherit; | 	// 元素 | ||||||
|   min-width: 1080px; | 	width: inherit; | ||||||
|   min-height: 620px; | 	height: inherit; | ||||||
|   background-color: $containerBgColor; | 	min-width: 1080px; | ||||||
|   background-image: url($containerBgImage); | 	min-height: 620px; | ||||||
|   background-size: cover; | 	background-color: $containerBgColor; | ||||||
|   // 定位 | 	// background-image: url($containerBgImage); | ||||||
|   position: relative; | 	background-size: cover; | ||||||
|   display: flex; | 	// 定位 | ||||||
|   justify-content: center; | 	position: relative; | ||||||
|   align-items: center; | 	display: flex; | ||||||
|   // 文字 | 	justify-content: center; | ||||||
|   font-size: 14px; | 	align-items: center; | ||||||
|   font-family: Microsoft YaHei; | 	// 文字 | ||||||
|   font-weight: 400; | 	font-size: 14px; | ||||||
|   .logo { | 	font-family: Microsoft YaHei; | ||||||
|     // 元素 | 	font-weight: 400; | ||||||
|     width: $logoWidth; | 	.logo { | ||||||
|     height: $logoHeight; | 		// 元素 | ||||||
|     // background-image: url($logoImage); | 		width: $logoWidth; | ||||||
|     // background-size: contain; | 		height: $logoHeight; | ||||||
|     // 定位 | 		// background-image: url($logoImage); | ||||||
|     position: absolute; | 		// background-size: contain; | ||||||
|     top: 50px; | 		// 定位 | ||||||
|     left: 50%; | 		position: absolute; | ||||||
|     margin-left: -$logoWidth/2; | 		top: 50px; | ||||||
|   } | 		left: 50%; | ||||||
|   .content { | 		margin-left: -$logoWidth/2; | ||||||
|     // 元素 | 	} | ||||||
|     width: $contentWidth; | 	.content { | ||||||
|     height: $contentHeight; | 		// 元素 | ||||||
|     background-color: #ffffff; | 		// width: $contentWidth; | ||||||
|     box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07); | 		// height: $contentHeight; | ||||||
|     border-radius: 20px; | 		width: 100%; | ||||||
|     // 定位 | 		height: 100%; | ||||||
|     position: relative; | 		background-color: #ffffff; | ||||||
|     .pic { | 		// box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07); | ||||||
|       // 元素 | 		// border-radius: 20px; | ||||||
|       width: $picWidth; | 		// 定位 | ||||||
|       height: $picHeight; | 		position: relative; | ||||||
|       background-image: url($picImage); | 		display: flex; | ||||||
|       background-repeat: no-repeat; |  | ||||||
|       background-size: cover; | 		.pic { | ||||||
|       border-radius: 20px 0 0 20px; | 			// 元素 | ||||||
|       // 定位 | 			width: $picWidth; | ||||||
|       position: absolute; | 			height: $picHeight; | ||||||
|       top: 0; | 			background-image: url($picImage); | ||||||
|       left: 0; | 			background-repeat: no-repeat; | ||||||
|     } | 			background-size: 100% 100%; | ||||||
|     .field { | 			background-position: 0 0; | ||||||
|       width: $fieldWidth; | 			position: relative; | ||||||
|       height: $fieldHeight; |  | ||||||
|       // 定位 | 			&::after { | ||||||
|       position: absolute; |         content: ''; | ||||||
|       top: 0; | 				position: absolute; | ||||||
|       left: $picWidth; | 				top: 0; | ||||||
|       display:flex; | 				left: 0; | ||||||
|       justify-content: center; | 				width: 100%; | ||||||
|       align-items: center; | 				height: 100%; | ||||||
|       .pc-title{ width: 100%; clear: both;} |         // background: #f003; | ||||||
|       .mobile-title, |         display: inline-block; | ||||||
|       .mobile-switch { | 			} | ||||||
|         display: none; | 		} | ||||||
|       } | 		.field { | ||||||
|       .form { | 			// background: #ccc3; | ||||||
|         box-sizing: border-box; | 			position: relative; | ||||||
|         width: $formWidth; | 			padding-top: 196px; | ||||||
|         // - - - tab | 			flex: 1; | ||||||
|         :deep(.el-tabs__content) { | 			display: flex; | ||||||
|           padding: 20px 0 0; | 			flex-direction: column; | ||||||
|         } | 			// justify-content: center; | ||||||
|         :deep(.el-tabs__item) { | 			align-items: center; | ||||||
|           // 元素 | 			.pc-title { | ||||||
|           width: $tabWidth; | 				width: 100%; | ||||||
|           height: $rowHeight; | 				text-align: center; | ||||||
|           padding: 0; | 				clear: both; | ||||||
|           // 文字 | 				position: relative; | ||||||
|           line-height: $rowHeight; | 				top: -36px; | ||||||
|           color: #666666; |  | ||||||
|         } | 				// h3.title { | ||||||
|         :deep(.el-tabs__item.is-active) { | 				// 	position: relative; | ||||||
|           font-weight: bold; |  | ||||||
|           color: #2F53EB; | 				// 	&::before { | ||||||
|         } | 				// 		content: ''; | ||||||
|         :deep(.el-tabs__active-bar) { | 				// 		background: url($cnbmLogo) 100% / 100% no-repeat; | ||||||
|           height: 3px; | 				// 		height: 48px; | ||||||
|           border-radius: 2px; | 				// 		width: 48px; | ||||||
|         } | 				// 		position: absolute; | ||||||
|         // - - - input | 				// 		left: 0px; | ||||||
|         :deep(.el-input__inner) { | 				// 		top: 4px; | ||||||
|           // 元素 | 				// 		display: inline-block; | ||||||
|           width: 100%; | 				// 	} | ||||||
|           height: $rowHeight; | 				// } | ||||||
|           background: #f5f5f5; | 			} | ||||||
|           border: 0; | 			.mobile-title, | ||||||
|           border-radius: 28px; | 			.mobile-switch { | ||||||
|           // 文字 | 				display: none; | ||||||
|           text-align: center; | 			} | ||||||
|           line-height: 19px; | 			.form { | ||||||
|           color: #262626; | 				margin-top: 32px; | ||||||
|         } | 				box-sizing: border-box; | ||||||
|         .code:deep(.el-input__inner) { | 				// width: $formWidth; | ||||||
|           padding: 0 24px; | 				width: 100%; | ||||||
|           // 文字 | 				// - - - tab | ||||||
|           text-align: left; | 				:deep(.el-tabs__nav) { | ||||||
|         } | 					// background: #f0f3; | ||||||
|         :deep(.el-input__inner::-webkit-input-placeholder) { /* WebKit browsers */ | 				} | ||||||
|           font-weight: 400; | 				:deep(.el-tabs__content) { | ||||||
|           color: #8C8C8C; | 					padding: 20px 0 0; | ||||||
|         } | 				} | ||||||
|         :deep(.el-input__inner:-moz-placeholder) { /* Mozilla Firefox 4 to 18 */ | 				:deep(.el-tabs__item) { | ||||||
|           font-weight: 400; | 					user-select: none; | ||||||
|           color: #8C8C8C; | 					// 元素 | ||||||
|         } | 					width: $tabWidth; | ||||||
|         :deep(.el-input__inner::-moz-placeholder) { /* Mozilla Firefox 19+ */ | 					height: $rowHeight; | ||||||
|           font-weight: 400; | 					padding: 0; | ||||||
|           color: #8C8C8C; | 					// 文字 | ||||||
|           opacity:1; | 					line-height: $rowHeight; | ||||||
|         } | 					color: #666666; | ||||||
|         :deep(.el-input__inner:-ms-input-placeholder) { /* Internet Explorer 10+ */ | 					font-size: 18px; | ||||||
|           font-weight: 400; | 					font-weight: 400; | ||||||
|           color: #8C8C8C !important; | 					text-align: center; | ||||||
|         } | 				} | ||||||
|         :deep(.el-form-item) { | 				:deep(.el-tabs__item.is-active) { | ||||||
|           position: relative; | 					font-weight: 500; | ||||||
|           .button-code { | 					color: #2f53eb; | ||||||
|             // 元素 | 				} | ||||||
|             height: $rowHeight; | 				:deep(.el-tabs__active-bar) { | ||||||
|             box-sizing: border-box; | 					height: 3px; | ||||||
|             // 定位 | 					border-radius: 2px; | ||||||
|             position: absolute; | 				} | ||||||
|             top: 0; | 				// - - - input | ||||||
|             right: 20px; | 				:deep(.el-input__inner) { | ||||||
|             z-index: 1; | 					// 元素 | ||||||
|             // 文字 | 					width: 100%; | ||||||
|             line-height: 20px; | 					height: $rowHeight; | ||||||
|             font-size: 14px; | 					background: #f5f5f5; | ||||||
|             font-family: PingFang SC; | 					border: 0; | ||||||
|             font-weight: 400; | 					border-radius: 28px; | ||||||
|             color: #2F53EB; | 					// 文字 | ||||||
|             span { | 					text-align: center; | ||||||
|               padding-left: 15px; | 					line-height: 19px; | ||||||
|               border-left: 2px solid #D9D9D9; | 					color: #262626; | ||||||
|             } | 				} | ||||||
|           } | 				.code:deep(.el-input__inner) { | ||||||
|         } | 					padding: 0 24px; | ||||||
|         :deep(.el-form-item__error) { | 					// 文字 | ||||||
|           padding-left: 24px; | 					text-align: left; | ||||||
|         } | 				} | ||||||
|         .button { | 				:deep(.el-input__inner::-webkit-input-placeholder) { | ||||||
|           width: 100%; | 					/* WebKit browsers */ | ||||||
|           height: $buttonHeight; | 					font-weight: 400; | ||||||
|           background: rgba(24, 144, 255, 0.2); | 					color: #8c8c8c; | ||||||
|           border: 0; | 				} | ||||||
|           border-radius: 24px; | 				:deep(.el-input__inner:-moz-placeholder) { | ||||||
|           margin-bottom: 20px; | 					/* Mozilla Firefox 4 to 18 */ | ||||||
|           // 文字 | 					font-weight: 400; | ||||||
|           line-height: 26px; | 					color: #8c8c8c; | ||||||
|           font-size: 20px; | 				} | ||||||
|           color: #FFFFFF; | 				:deep(.el-input__inner::-moz-placeholder) { | ||||||
|         } | 					/* Mozilla Firefox 19+ */ | ||||||
|         .button-active { | 					font-weight: 400; | ||||||
|           background: #2F53EB; | 					color: #8c8c8c; | ||||||
|           box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2); | 					opacity: 1; | ||||||
|         } | 				} | ||||||
|       } | 				:deep(.el-input__inner:-ms-input-placeholder) { | ||||||
|     } | 					/* Internet Explorer 10+ */ | ||||||
|   } | 					font-weight: 400; | ||||||
|   .footer { | 					color: #8c8c8c !important; | ||||||
|     // 元素 | 				} | ||||||
|     height: 16px; | 				:deep(.el-form-item) { | ||||||
|     line-height: 16px; | 					position: relative; | ||||||
|     font-size: 12px; | 					.button-code { | ||||||
|     color: #8c8c8c; | 						// 元素 | ||||||
|     // 定位 | 						height: $rowHeight; | ||||||
|     position: absolute; | 						box-sizing: border-box; | ||||||
|     bottom: 30px; | 						// 定位 | ||||||
|     a, | 						position: absolute; | ||||||
|     a:hover, | 						top: 0; | ||||||
|     a:active { | 						right: 20px; | ||||||
|       color: inherit; | 						z-index: 1; | ||||||
|       text-decoration: none; | 						// 文字 | ||||||
|     } | 						line-height: 20px; | ||||||
|   } | 						font-size: 14px; | ||||||
|  | 						font-family: PingFang SC; | ||||||
|  | 						font-weight: 400; | ||||||
|  | 						color: #2f53eb; | ||||||
|  | 						span { | ||||||
|  | 							padding-left: 15px; | ||||||
|  | 							border-left: 2px solid #d9d9d9; | ||||||
|  | 						} | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  | 				:deep(.el-form-item__error) { | ||||||
|  | 					padding-left: 24px; | ||||||
|  | 				} | ||||||
|  | 				.button { | ||||||
|  | 					width: 100%; | ||||||
|  | 					height: $buttonHeight; | ||||||
|  | 					background: rgba(24, 144, 255, 0.2); | ||||||
|  | 					border: 0; | ||||||
|  | 					border-radius: 24px; | ||||||
|  | 					margin-bottom: 20px; | ||||||
|  | 					// 文字 | ||||||
|  | 					line-height: 26px; | ||||||
|  | 					font-size: 20px; | ||||||
|  | 					color: #ffffff; | ||||||
|  | 				} | ||||||
|  | 				.button-active { | ||||||
|  | 					background: #2f53eb; | ||||||
|  | 					box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2); | ||||||
|  | 				} | ||||||
|  | 			} | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
|  |  | ||||||
|  | 	.login-form { | ||||||
|  | 		* { | ||||||
|  | 			user-select: none; | ||||||
|  | 		} | ||||||
|  | 		// - - - input | ||||||
|  | 		:deep(.el-input__inner) { | ||||||
|  | 			// 元素 | ||||||
|  | 			width: 420px; | ||||||
|  | 			height: 66px; | ||||||
|  | 			color: #262626; | ||||||
|  | 			font-size: 18px; | ||||||
|  | 		} | ||||||
|  | 		:deep(.el-checkbox__label) { | ||||||
|  | 			font-size: 18px; | ||||||
|  | 			line-height: 14px; | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
|  |  | ||||||
|  | 	.footer { | ||||||
|  | 		user-select: none; | ||||||
|  | 		// 元素 | ||||||
|  | 		height: 16px; | ||||||
|  | 		line-height: 16px; | ||||||
|  | 		font-size: 12px; | ||||||
|  | 		color: #8c8c8c; | ||||||
|  | 		// 定位 | ||||||
|  | 		position: absolute; | ||||||
|  | 		bottom: 30px; | ||||||
|  | 		a, | ||||||
|  | 		a:hover, | ||||||
|  | 		a:active { | ||||||
|  | 			color: inherit; | ||||||
|  | 			text-decoration: none; | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
| } | } | ||||||
|  |  | ||||||
| // - - - - - PC 最小尺寸设置 | // - - - - - PC 最小尺寸设置 | ||||||
| @media screen and (min-width: 599px) and (max-width: 1366px) { | @media screen and (min-width: 599px) and (max-width: 1366px) { | ||||||
|   .container { | 	.container { | ||||||
|     .content { | 		min-width: 599px; | ||||||
|       width: 710px; | 		.content { | ||||||
|       height: 397px; | 			// width: 710px; | ||||||
|       .pic { | 			// height: 397px; | ||||||
|         width: 314px; | 			width: 100%; | ||||||
|       } | 			height: 100%; | ||||||
|       .field { | 			.pic { | ||||||
|         width: calc(710px - 314px); | 				// width: 314px; | ||||||
|         left: 314px; | 				display: none; | ||||||
|         .form { | 			} | ||||||
|           width: 320px; | 			.field { | ||||||
|           :deep(.el-input__inner) { | 				// width: calc(710px - 314px); | ||||||
|             width: 320px; | 				// left: 314px; | ||||||
|             height: 56px; | 				// justify-content: center; | ||||||
|           } | 				width: 100%; | ||||||
|           .button { |  | ||||||
|             height: 50px; |  | ||||||
|           } |  | ||||||
|         } |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
|  |  | ||||||
|  | 				.pc-title { | ||||||
|  | 					h3 { | ||||||
|  | 						font-size: 2.4rem !important; | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  |  | ||||||
|  | 				.form { | ||||||
|  | 					// width: 320px; | ||||||
|  | 					:deep(.el-input__inner) { | ||||||
|  | 						width: 320px; | ||||||
|  | 						height: 56px; | ||||||
|  | 					} | ||||||
|  | 					.button { | ||||||
|  | 						height: 50px; | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  | 			} | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
|  | } | ||||||
|  |  | ||||||
| /* ===== MOBILE DESIGN ===== */ | /* ===== MOBILE DESIGN ===== */ | ||||||
| $mobileW: 375; | $mobileW: 375; | ||||||
| @@ -273,115 +357,142 @@ $mobileButtonH: 48; | |||||||
| $mobileContainerBgImage: '../assets/images/bg-mobile.png'; | $mobileContainerBgImage: '../assets/images/bg-mobile.png'; | ||||||
| // container-content | // container-content | ||||||
| $mobileContentWidth: round($mobileContentW / $mobileW * 100) * 1vw; | $mobileContentWidth: round($mobileContentW / $mobileW * 100) * 1vw; | ||||||
| $mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 * $mobileContentWidth; | $mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 * | ||||||
|  | 	$mobileContentWidth; | ||||||
| // container-content-field-form | // container-content-field-form | ||||||
| $mobileFormWidth: round($mobileFormW / $mobileW *100) * 1vw; | $mobileFormWidth: round($mobileFormW / $mobileW * 100) * 1vw; | ||||||
| $mobileRowHeight: $mobileRowH * 1px; | $mobileRowHeight: $mobileRowH * 1px; | ||||||
| $mobileButtonHeight: $mobileButtonH * 1px; | $mobileButtonHeight: $mobileButtonH * 1px; | ||||||
| $iconBgImage: '../assets/images/icon.png'; | $iconBgImage: '../assets/images/icon.png'; | ||||||
|  |  | ||||||
| // - - - - - 移动端设置 | // - - - - - 移动端设置 | ||||||
| @media screen and (max-width: 599px) { | @media screen and (max-width: 599px) { | ||||||
|   .container { | 	.container { | ||||||
|     // 元素 | 		// 元素 | ||||||
|     background-image: url($mobileContainerBgImage); | 		background-image: url($mobileContainerBgImage); | ||||||
|     min-width: 280px; | 		min-width: 280px; | ||||||
|     min-height: 568px; | 		min-height: 568px; | ||||||
|     // 文字 | 		// 文字 | ||||||
|     font-size: 17px; | 		font-size: 14px; | ||||||
|     font-family: PingFang SC; | 		font-family: PingFang SC; | ||||||
|     font-weight: bold; | 		font-weight: bold; | ||||||
|     .logo { | 		.logo { | ||||||
|       display: none; | 			display: none; | ||||||
|     } | 		} | ||||||
|  |  | ||||||
|     .content { | 		.pc-title { | ||||||
|       // 元素 | 			display: none; | ||||||
|       width: $mobileContentWidth; | 		} | ||||||
|       height: $mobileContentHeight; |  | ||||||
|       min-width: 250px; | 		.content { | ||||||
|       min-height: 340px; | 			// 元素 | ||||||
|       // 定位 | 			width: $mobileContentWidth; | ||||||
|       display: flex; | 			height: $mobileContentHeight; | ||||||
|       justify-content: center; | 			min-width: 250px; | ||||||
|       align-items: center; | 			min-height: 340px; | ||||||
|       .pic { | 			// 定位 | ||||||
|         display: none; | 			display: flex; | ||||||
|       } | 			justify-content: center; | ||||||
|       .field { | 			align-items: center; | ||||||
|         // 元素 | 			.pic { | ||||||
|         width: inherit; | 				display: none; | ||||||
|         min-height: inherit; | 			} | ||||||
|         // 定位 | 			.field { | ||||||
|         left: 0; |         padding: 0; | ||||||
|         display: flex; | 				// 元素 | ||||||
|         flex-direction: column; | 				width: inherit; | ||||||
|         .mobile-title { | 				min-height: inherit; | ||||||
|           // 元素 | 				// 定位 | ||||||
|           margin: 0 0 20px; | 				left: 0; | ||||||
|           display: block; | 				display: flex; | ||||||
|         } | 				flex-direction: column; | ||||||
|         .form { |  | ||||||
|           width: $mobileFormWidth; | 				.mobile-title { | ||||||
|           // - - - tab | 					// 元素 | ||||||
|           :deep(.el-tabs__header) { | 					margin: 0; | ||||||
|             display: none; | 					display: block; | ||||||
|           } | 				} | ||||||
|           :deep(.el-tabs__content) { |  | ||||||
|             padding: 0; | 				.form { | ||||||
|           } |  | ||||||
|           // - - - input |  | ||||||
|           :deep(.el-input__inner) { |  | ||||||
|             height: $mobileRowHeight; |  | ||||||
|             line-height: 24px; |  | ||||||
|             // 文字 |  | ||||||
|             text-align: center; |  | ||||||
|             color: #262626; |  | ||||||
|           } |  | ||||||
|           :deep(.el-form-item) { |  | ||||||
|             .button-code { |  | ||||||
|               // 元素 |  | ||||||
|               height: $mobileRowHeight; |  | ||||||
|             } |  | ||||||
|           } |  | ||||||
|           .button { |  | ||||||
|             height: $mobileButtonHeight; |  | ||||||
|             line-height: 24px; |  | ||||||
|             color: #FFFFFF; |  | ||||||
|           } |  | ||||||
|         } |  | ||||||
|         .mobile-switch { |  | ||||||
|           display: block; |  | ||||||
|           line-height: 20px; |  | ||||||
|           font-size: 14px; |  | ||||||
|           font-weight: 400; |  | ||||||
|           color: #595959; |  | ||||||
|           margin: 0; |           margin: 0; | ||||||
|           .icon { | 					width: $mobileFormWidth; | ||||||
|             width: 14px; | 					// - - - tab | ||||||
|             height: 14px; | 					:deep(.el-tabs__header) { | ||||||
|             display: inline-block; | 						display: none; | ||||||
|             background-image: url($iconBgImage); | 					} | ||||||
|             background-size: cover; | 					:deep(.el-tabs__content) { | ||||||
|           } | 						padding: 0; | ||||||
|         } | 					} | ||||||
|         .mobile-switch:hover { | 					// - - - input | ||||||
|           cursor: pointer; | 					:deep(.el-input__inner) { | ||||||
|         } | 						height: $mobileRowHeight; | ||||||
|       } | 						line-height: 24px; | ||||||
|     } | 						// 文字 | ||||||
|     .footer { | 						text-align: center; | ||||||
|       // 元素 | 						color: #262626; | ||||||
|       font-size: 12px; | 					} | ||||||
|       font-family: PingFang SC; | 					:deep(.el-form-item) { | ||||||
|       font-weight: 400; | 						.button-code { | ||||||
|       line-height: 17px; | 							// 元素 | ||||||
|       color: #333333; | 							height: $mobileRowHeight; | ||||||
|       opacity: 0.6; | 						} | ||||||
|       // 定位 | 					} | ||||||
|       position: absolute; | 					.button { | ||||||
|       bottom: 20px; | 						height: $mobileButtonHeight; | ||||||
|     } | 						line-height: 24px; | ||||||
|   } | 						color: #ffffff; | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  |  | ||||||
|  | 				.login-form { | ||||||
|  | 					:deep(.el-input__inner) { | ||||||
|  | 						height: $mobileRowHeight; | ||||||
|  | 						line-height: 24px; | ||||||
|  | 						// 文字 | ||||||
|  | 						text-align: center; | ||||||
|  | 						color: #262626; | ||||||
|  | 					} | ||||||
|  |  | ||||||
|  |           :deep(#button-form-item) { | ||||||
|  |             margin: 0 !important; | ||||||
|  | 						button { | ||||||
|  | 							// 元素 | ||||||
|  | 							height: $mobileRowHeight; | ||||||
|  | 						} | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  | 				.mobile-switch { | ||||||
|  | 					display: block; | ||||||
|  | 					line-height: 20px; | ||||||
|  | 					font-size: 14px; | ||||||
|  | 					font-weight: 400; | ||||||
|  | 					color: #595959; | ||||||
|  | 					margin: 0; | ||||||
|  | 					.icon { | ||||||
|  | 						width: 14px; | ||||||
|  | 						height: 14px; | ||||||
|  | 						display: inline-block; | ||||||
|  | 						background-image: url($iconBgImage); | ||||||
|  | 						background-size: cover; | ||||||
|  | 					} | ||||||
|  | 				} | ||||||
|  | 				.mobile-switch:hover { | ||||||
|  | 					cursor: pointer; | ||||||
|  | 				} | ||||||
|  | 			} | ||||||
|  | 		} | ||||||
|  |  | ||||||
|  | 		.footer { | ||||||
|  | 			// 元素 | ||||||
|  | 			font-size: 12px; | ||||||
|  | 			font-family: PingFang SC; | ||||||
|  | 			font-weight: 400; | ||||||
|  | 			line-height: 17px; | ||||||
|  | 			color: #333333; | ||||||
|  | 			opacity: 0.6; | ||||||
|  | 			// 定位 | ||||||
|  | 			// position: absolute; | ||||||
|  | 			bottom: -32px; | ||||||
|  | 		} | ||||||
|  | 	} | ||||||
| } | } | ||||||
|   | |||||||
| @@ -10,6 +10,8 @@ | |||||||
| 		ref="form" | 		ref="form" | ||||||
| 		:model="form" | 		:model="form" | ||||||
| 		:label-width="`${labelWidth}px`" | 		:label-width="`${labelWidth}px`" | ||||||
|  | 		:size="size" | ||||||
|  | 		:label-position="labelPosition" | ||||||
| 		v-loading="formLoading"> | 		v-loading="formLoading"> | ||||||
| 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex"> | 		<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-col v-for="col in row" :key="col.label" :span="24 / row.length"> | ||||||
| @@ -46,23 +48,6 @@ | |||||||
| 						:placeholder="`请选择${col.label}`" | 						:placeholder="`请选择${col.label}`" | ||||||
| 						value-format="timestamp" | 						value-format="timestamp" | ||||||
| 						v-bind="col.bind"></el-date-picker> | 						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 | 					<el-switch | ||||||
| 						v-if="col.switch" | 						v-if="col.switch" | ||||||
| 						v-model="form[col.prop]" | 						v-model="form[col.prop]" | ||||||
| @@ -74,6 +59,47 @@ | |||||||
| 						:key="col.key" | 						:key="col.key" | ||||||
| 						:is="col.subcomponent" | 						:is="col.subcomponent" | ||||||
| 						:inlineStyle="col.style"></component> | 						: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"> | ||||||
|  | 								<svg-icon | ||||||
|  | 									icon-class="icon-upload" | ||||||
|  | 									style="color: inherit"></svg-icon> | ||||||
|  | 								上传文件 | ||||||
|  | 							</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" | ||||||
|  | 							:key="file.fileUrl" | ||||||
|  | 							@delete="handleDeleteFile(file)" /> | ||||||
|  | 					</div> | ||||||
| 				</el-form-item> | 				</el-form-item> | ||||||
| 			</el-col> | 			</el-col> | ||||||
| 		</el-row> | 		</el-row> | ||||||
| @@ -81,6 +107,9 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
|  | import { getAccessToken } from '@/utils/auth'; | ||||||
|  | import tupleImg from '@/assets/images/tuple.png'; | ||||||
|  |  | ||||||
| /** | /** | ||||||
|  * 找到最长的label |  * 找到最长的label | ||||||
|  * @param {*} options |  * @param {*} options | ||||||
| @@ -99,6 +128,47 @@ function findMaxLabelWidth(rows) { | |||||||
| 	return max; | 	return max; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | const uploadedFile = { | ||||||
|  | 	name: 'UploadedFile', | ||||||
|  | 	props: ['file'], | ||||||
|  | 	data() { | ||||||
|  | 		return {}; | ||||||
|  | 	}, | ||||||
|  | 	methods: { | ||||||
|  | 		handleDelete() { | ||||||
|  | 			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 { | export default { | ||||||
| 	name: 'DialogForm', | 	name: 'DialogForm', | ||||||
| 	model: { | 	model: { | ||||||
| @@ -106,7 +176,7 @@ export default { | |||||||
| 		event: 'update', | 		event: 'update', | ||||||
| 	}, | 	}, | ||||||
| 	emits: ['update'], | 	emits: ['update'], | ||||||
| 	components: {}, | 	components: { uploadedFile }, | ||||||
| 	props: { | 	props: { | ||||||
| 		rows: { | 		rows: { | ||||||
| 			type: Array, | 			type: Array, | ||||||
| @@ -119,14 +189,30 @@ export default { | |||||||
| 		disabled: { | 		disabled: { | ||||||
| 			type: Boolean, | 			type: Boolean, | ||||||
| 			default: false, | 			default: false, | ||||||
| 		} | 		}, | ||||||
|  | 		hasFile: { | ||||||
|  | 			type: Boolean, | ||||||
|  | 			default: false, | ||||||
|  | 		}, | ||||||
|  | 		labelPosition: { | ||||||
|  | 			type: String, | ||||||
|  | 			default: 'right', | ||||||
|  | 		}, | ||||||
|  | 		size: { | ||||||
|  | 			type: String, | ||||||
|  | 			default: '', | ||||||
|  | 		}, | ||||||
| 	}, | 	}, | ||||||
| 	data() { | 	data() { | ||||||
| 		return { | 		return { | ||||||
|  | 			uploadOpen: false, | ||||||
|  | 			form: {}, | ||||||
| 			formLoading: true, | 			formLoading: true, | ||||||
| 			optionListOf: {}, | 			optionListOf: {}, | ||||||
| 			uploadedFileList: [], | 			uploadedFileList: [], | ||||||
| 			dataLoaded: false, | 			dataLoaded: false, | ||||||
|  | 			uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() }, | ||||||
|  | 			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers,url都是固定的 | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	computed: { | 	computed: { | ||||||
| @@ -136,21 +222,10 @@ export default { | |||||||
| 			return max * 20; | 			return max * 20; | ||||||
| 			// return max * 20 + 'px'; | 			// 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: { | 	watch: { | ||||||
| 		rows: { | 		rows: { | ||||||
| 			handler() { | 			handler() { | ||||||
| 				console.log('watch triggered!'); |  | ||||||
| 				this.$nextTick(() => { | 				this.$nextTick(() => { | ||||||
| 					this.handleOptions('watch'); | 					this.handleOptions('watch'); | ||||||
| 				}); | 				}); | ||||||
| @@ -158,6 +233,16 @@ export default { | |||||||
| 			deep: true, | 			deep: true, | ||||||
| 			immediate: false, | 			immediate: false, | ||||||
| 		}, | 		}, | ||||||
|  | 		dataForm: { | ||||||
|  | 			handler(val) { | ||||||
|  | 				this.form = JSON.parse(JSON.stringify(val)); | ||||||
|  | 				if (this.hasFile) { | ||||||
|  | 					this.form.files = this.form.files ?? []; | ||||||
|  | 				} | ||||||
|  | 			}, | ||||||
|  | 			deep: true, | ||||||
|  | 			immediate: true, | ||||||
|  | 		}, | ||||||
| 	}, | 	}, | ||||||
| 	mounted() { | 	mounted() { | ||||||
| 		// 处理 options | 		// 处理 options | ||||||
| @@ -273,23 +358,29 @@ export default { | |||||||
| 		beforeUpload() {}, | 		beforeUpload() {}, | ||||||
| 		// 上传前的验证规则可通过 bind 属性传入 | 		// 上传前的验证规则可通过 bind 属性传入 | ||||||
| 		handleUploadSuccess(response, file, fileList) { | 		handleUploadSuccess(response, file, fileList) { | ||||||
| 			console.log( | 			this.form.files.push({ | ||||||
| 				'[dialogForm:handleUploadSuccess]', | 				fileName: file.name, | ||||||
| 				response, | 				fileUrl: response.data, | ||||||
| 				file, | 				fileType: 2, | ||||||
| 				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('上传成功'); | 			this.$modal.msgSuccess('上传成功'); | ||||||
|  | 			this.$emit('update', this.form); | ||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| 		getFileName(fileUrl) { | 		getFileName(fileUrl) { | ||||||
| 			return fileUrl.split('/').pop(); | 			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> | </script> | ||||||
| @@ -299,4 +390,52 @@ export default { | |||||||
| .el-select { | .el-select { | ||||||
| 	width: 100%; | 	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> | </style> | ||||||
|   | |||||||
| @@ -6,7 +6,9 @@ | |||||||
| --> | --> | ||||||
|  |  | ||||||
| <template> | <template> | ||||||
| 	<div ref="dataBoard" class=""></div> | 	<div ref="dataBoard" class="data-board"> | ||||||
|  | 		<el-button type="text" @click="goback" class="go-back--btn">返回</el-button> | ||||||
|  | 	</div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| @@ -24,39 +26,42 @@ export default { | |||||||
| 			mainFooter: null, // dom | 			mainFooter: null, // dom | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	mounted() { | 	// mounted() { | ||||||
| 		this.$nextTick(() => { | 	// 	this.$nextTick(() => { | ||||||
| 			this.modify(); | 	// 		this.modify(); | ||||||
| 		}); | 	// 	}); | ||||||
| 	}, | 	// }, | ||||||
| 	activated() { | 	// activated() { | ||||||
| 		this.modify(); | 	// 	this.modify(); | ||||||
| 	}, | 	// }, | ||||||
| 	deactivated() { | 	// deactivated() { | ||||||
| 		this.recover(); | 	// 	this.recover(); | ||||||
| 	}, | 	// }, | ||||||
| 	beforeDestroy() { | 	// beforeDestroy() { | ||||||
| 		this.recover(); | 	// 	this.recover(); | ||||||
| 	}, | 	// }, | ||||||
| 	methods: { | 	methods: { | ||||||
| 		modify() { | 		// modify() { | ||||||
| 			// 在这个页面临时修改下父类的margin,结束时需还原 | 		// 	// 在这个页面临时修改下父类的margin,结束时需还原 | ||||||
| 			this.appMain = document.querySelector('.app-main'); | 		// 	this.appMain = document.querySelector('.app-main'); | ||||||
| 			// this.appMain.style.minHeight = 'calc(100vh - 90px)'; | 		// 	// this.appMain.style.minHeight = 'calc(100vh - 90px)'; | ||||||
| 			this.appMain.style.margin = 0; | 		// 	this.appMain.style.margin = 0; | ||||||
| 			// 在这个页面临时删除 main-footer 元素,结束时需还原 | 		// 	// 在这个页面临时删除 main-footer 元素,结束时需还原 | ||||||
| 			// this.mainFooter = document.querySelector('.main-footer').cloneNode(true); | 		// 	// this.mainFooter = document.querySelector('.main-footer').cloneNode(true); | ||||||
| 			// document.querySelector('.main-footer').remove(); | 		// 	// document.querySelector('.main-footer').remove(); | ||||||
|             this.$refs.dataBoard.classList.add('data-board'); |         //     this.$refs.dataBoard.classList.add('data-board'); | ||||||
| 		}, | 		// }, | ||||||
| 		recover() { | 		// recover() { | ||||||
|             this.$refs.dataBoard.classList.remove('data-board'); |         //     this.$refs.dataBoard.classList.remove('data-board'); | ||||||
| 			this.$nextTick(() => { | 		// 	this.$nextTick(() => { | ||||||
| 				this.appMain.style.margin = this.parentStyle.margin; | 		// 		this.appMain.style.margin = this.parentStyle.margin; | ||||||
| 				// this.appMain.style.minHeight = this.parentStyle.minHeight; | 		// 		// this.appMain.style.minHeight = this.parentStyle.minHeight; | ||||||
| 				// this.appMain.insertAdjacentElement('afterend', this.mainFooter); | 		// 		// this.appMain.insertAdjacentElement('afterend', this.mainFooter); | ||||||
| 			}); | 		// 	}); | ||||||
| 		}, | 		// }, | ||||||
|  | 		goback() { | ||||||
|  | 			this.$router.go(-1); | ||||||
|  | 		} | ||||||
| 	}, | 	}, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
| @@ -71,4 +76,25 @@ export default { | |||||||
| 	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain | 	background: url('../../../assets/images/DataBoard.png') 100% 100% / contain | ||||||
| 		no-repeat; | 		no-repeat; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .go-back--btn { | ||||||
|  | 	position: fixed; | ||||||
|  | 	top: 28px; | ||||||
|  | 	left: 24px; | ||||||
|  | 	color: #fff; | ||||||
|  | 	font-size: 18px; | ||||||
|  | 	letter-spacing: 6px; | ||||||
|  |  | ||||||
|  | 	&:hover { | ||||||
|  | 		text-decoration: underline; | ||||||
|  | 	} | ||||||
|  |  | ||||||
|  | 	&::after { | ||||||
|  | 		content: "\2BAA"; | ||||||
|  | 		position: absolute; | ||||||
|  | 		top: 6px; | ||||||
|  | 		right: -26px; | ||||||
|  | 		font-size: 24px; | ||||||
|  | 	} | ||||||
|  | } | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@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> | 		</base-dialog> | ||||||
|  |  | ||||||
| 		<!-- 抽屉 详情 --> | 		<!-- 抽屉 详情 --> | ||||||
|   | |||||||
| @@ -36,7 +36,7 @@ | |||||||
| 							v-if="showForm" | 							v-if="showForm" | ||||||
| 							ref="form" | 							ref="form" | ||||||
| 							:disabled="mode.includes('detail')" | 							:disabled="mode.includes('detail')" | ||||||
| 							:dataForm="form" | 							v-model="form" | ||||||
| 							:rows="formRows" /> | 							:rows="formRows" /> | ||||||
| 					</div> | 					</div> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@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> | 		</base-dialog> | ||||||
|  |  | ||||||
| 		<!-- 抽屉 详情 --> | 		<!-- 抽屉 详情 --> | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@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> | 		</base-dialog> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
|   | |||||||
| @@ -36,7 +36,7 @@ | |||||||
| 							v-if="showForm" | 							v-if="showForm" | ||||||
| 							ref="form" | 							ref="form" | ||||||
| 							:disabled="mode.includes('detail')" | 							:disabled="mode.includes('detail')" | ||||||
| 							:dataForm="form" | 							v-model="form" | ||||||
| 							:rows="formRows" /> | 							:rows="formRows" /> | ||||||
| 					</div> | 					</div> | ||||||
|  |  | ||||||
| @@ -151,7 +151,7 @@ export default { | |||||||
| 				name: '', | 				name: '', | ||||||
| 				plcParamName: '', | 				plcParamName: '', | ||||||
| 				unit: '', | 				unit: '', | ||||||
| 				collection: '', | 				collection: 1, | ||||||
| 				minValue: '', | 				minValue: '', | ||||||
| 				maxValue: '', | 				maxValue: '', | ||||||
| 				defaultValue: '', | 				defaultValue: '', | ||||||
| @@ -370,7 +370,7 @@ export default { | |||||||
| 				name: '', | 				name: '', | ||||||
| 				plcParamName: '', | 				plcParamName: '', | ||||||
| 				unit: '', | 				unit: '', | ||||||
| 				collection: '', | 				collection: 1, | ||||||
| 				minValue: '', | 				minValue: '', | ||||||
| 				maxValue: '', | 				maxValue: '', | ||||||
| 				defaultValue: '', | 				defaultValue: '', | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@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> | 		</base-dialog> | ||||||
|  |  | ||||||
| 		<!-- 抽屉 详情 --> | 		<!-- 抽屉 详情 --> | ||||||
|   | |||||||
| @@ -38,7 +38,7 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@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> | 		</base-dialog> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zhp |  * @Author: zhp | ||||||
|  * @Date: 2023-09-13 09:02:25 |  * @Date: 2023-09-13 09:02:25 | ||||||
|  * @LastEditTime: 2023-10-08 15:39:38 |  * @LastEditTime: 2023-10-16 14:56:58 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
|   | |||||||
| @@ -1,8 +1,12 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="app-container"> |   <div class="app-container"> | ||||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||||
|     <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" /> |     <div v-if="tableData.length"> | ||||||
|     <balance-chart ref="lineChart" /> |       <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 |     <!-- <pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -89,7 +93,7 @@ export default { | |||||||
|         }, |         }, | ||||||
|         { |         { | ||||||
|           type: 'button', |           type: 'button', | ||||||
|           btnName: '搜索', |           btnName: '查询', | ||||||
|           name: 'search', |           name: 'search', | ||||||
|           color: 'primary', |           color: 'primary', | ||||||
|         } |         } | ||||||
| @@ -144,11 +148,6 @@ export default { | |||||||
|       // this.listQuery.lineId = '1672847052717821953' |       // this.listQuery.lineId = '1672847052717821953' | ||||||
|       // this.listQuery.startTime = '1693497600000'; |       // this.listQuery.startTime = '1693497600000'; | ||||||
|       // this.listQuery.endTime = '1693843200000'; |       // this.listQuery.endTime = '1693843200000'; | ||||||
|       this.tableData.splice(0) |  | ||||||
|       this.xData.splice(0) |  | ||||||
|       this.yData.splice(0) |  | ||||||
|       this.tableProps.splice(0) |  | ||||||
|       this.spanArr.splice(0) |  | ||||||
|       this.urlOptions.getDataListURL(this.listQuery).then(res => { |       this.urlOptions.getDataListURL(this.listQuery).then(res => { | ||||||
|         console.log(res) |         console.log(res) | ||||||
|         let arr = [ |         let arr = [ | ||||||
| @@ -228,11 +227,17 @@ export default { | |||||||
|           this.listQuery.lineId = val.lineIds |           this.listQuery.lineId = val.lineIds | ||||||
|           this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined; |           this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined; | ||||||
|           this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined; |           this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined; | ||||||
|           if (val.time) { |           if (val.time && val.lineIds) { | ||||||
|  |             this.tableData = [] | ||||||
|  |             this.xData = [] | ||||||
|  |             this.yData = [] | ||||||
|  |             this.tableProps = [] | ||||||
|  |             this.spanArr = [] | ||||||
|  |             this.timeList = [] | ||||||
|             this.getData() |             this.getData() | ||||||
|           } else { |           } else { | ||||||
|             this.$message({ |             this.$message({ | ||||||
|               message: '请选择时间', |               message: '请选择产线和时间', | ||||||
|               type: 'warning' |               type: 'warning' | ||||||
|             }); |             }); | ||||||
|           } |           } | ||||||
|   | |||||||
| @@ -1,8 +1,12 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="app-container"> |   <div class="app-container"> | ||||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||||
|     <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" /> |     <div v-if="tableData.length"> | ||||||
|     <line-chart ref="lineChart" /> |       <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 |     <!-- <pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -72,7 +76,7 @@ export default { | |||||||
| 				{ | 				{ | ||||||
| 					type: 'datePicker', | 					type: 'datePicker', | ||||||
| 					label: '时间', | 					label: '时间', | ||||||
| 					dateType: 'datetime', | 					dateType: 'month', | ||||||
| 					format: 'yyyy-MM-dd', | 					format: 'yyyy-MM-dd', | ||||||
| 					valueFormat: 'yyyy-MM-dd HH:mm:ss', | 					valueFormat: 'yyyy-MM-dd HH:mm:ss', | ||||||
| 					rangeSeparator: '-', | 					rangeSeparator: '-', | ||||||
| @@ -82,7 +86,7 @@ export default { | |||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '搜索', | 					btnName: '查询', | ||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| 				} | 				} | ||||||
| @@ -101,6 +105,8 @@ export default { | |||||||
| 			this.optionArrUrl.forEach((item, index) => { | 			this.optionArrUrl.forEach((item, index) => { | ||||||
| 				item(params).then((response) => { | 				item(params).then((response) => { | ||||||
| 					this.formConfig[index].selectOptions = response.data.list | 					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) | ||||||
| 				}); | 				}); | ||||||
| 			}); | 			}); | ||||||
|     }, |     }, | ||||||
| @@ -112,11 +118,13 @@ export default { | |||||||
|         let arr = [ |         let arr = [ | ||||||
|           	{ |           	{ | ||||||
|               prop: 'lineName', |               prop: 'lineName', | ||||||
|           		label: '产线' |           		label: '产线', | ||||||
|  |               fixed: 'left' | ||||||
|           	}, |           	}, | ||||||
|             { |             { | ||||||
|               prop: 'sum', |               prop: 'sum', | ||||||
|               label: '合计' |               label: '合计', | ||||||
|  |               fixed: 'left' | ||||||
|             }, |             }, | ||||||
|             { |             { | ||||||
|               prop: res.data ? res.data.nameData[0].name : undefined, |               prop: res.data ? res.data.nameData[0].name : undefined, | ||||||
| @@ -220,7 +228,6 @@ export default { | |||||||
|       }); |       }); | ||||||
|     }, |     }, | ||||||
|     buttonClick(val) { |     buttonClick(val) { | ||||||
|       // console.log(val) |  | ||||||
| 			switch (val.btnName) { | 			switch (val.btnName) { | ||||||
|         case 'search': |         case 'search': | ||||||
|           this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined |           this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined | ||||||
|   | |||||||
							
								
								
									
										422
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										422
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,422 @@ | |||||||
|  | <!--  | ||||||
|  |     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" | ||||||
|  | 			:style="{ | ||||||
|  | 				height: expand ? 'auto' : isPicMode ? '180px' : '152px', | ||||||
|  | 				gap: isPicMode ? '0 24px' : '24px', | ||||||
|  | 				gridAutoRows: isPicMode ? '180px' : '152px', | ||||||
|  | 			}"> | ||||||
|  | 			<el-upload | ||||||
|  | 				class="equipment-upload" | ||||||
|  | 				:style="{ marginBottom: isPicMode ? '48px' : '24px' }" | ||||||
|  | 				: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="{ | ||||||
|  | 					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) { | ||||||
|  | 	.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; | ||||||
|  | 	} | ||||||
|  | } | ||||||
|  |  | ||||||
|  | .equipment-upload { | ||||||
|  | 	margin-bottom: 24px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | .file-list { | ||||||
|  | 	padding: 12px; | ||||||
|  | 	border: 1px solid #ccc; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | // custom | ||||||
|  | .file-area { | ||||||
|  | 	display: grid; | ||||||
|  | 	grid-template-columns: repeat(auto-fill, 188px); | ||||||
|  | 	grid-auto-rows: 152px; | ||||||
|  | 	gap: 48px 24px; | ||||||
|  | 	overflow: hidden; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | .file-list__item { | ||||||
|  | 	height: 128px; | ||||||
|  | 	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
									
								
							
							
						
						
									
										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> | ||||||
| @@ -1,32 +0,0 @@ | |||||||
| <!--  |  | ||||||
|     filename: EquipmentAssets.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2023-08-22 11:11:18 |  | ||||||
|     description: 设备资产 |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
|     <div class="equipment-assets"></div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
|     name: "EquipmentAssets", |  | ||||||
|     components: {}, |  | ||||||
|     props: {}, |  | ||||||
|     data() { |  | ||||||
|         return {} |  | ||||||
|     }, |  | ||||||
|     computed: {}, |  | ||||||
|     methods: {}, |  | ||||||
| } |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .equipment-assets { |  | ||||||
|     background: #f1f1f1; |  | ||||||
|     padding: 12px; |  | ||||||
|     min-height: 128px; |  | ||||||
|     margin-top: 8px; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -29,23 +29,28 @@ | |||||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | 				<section v-for="(section, index) in sections" :key="section.key"> | ||||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | 					<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 /> | 						<el-skeleton v-if="!showForm" animated /> | ||||||
| 						<DialogForm | 						<EquipmentInfoForm | ||||||
| 							key="drawer-dialog-form" | 							key="drawer-dialog-form" | ||||||
| 							v-if="showForm" | 							v-if="showForm" | ||||||
| 							ref="form" | 							:disabled="mode.includes('detail')" | ||||||
| 							:dataForm="form" | 							:sync-filelist="syncFileListFlag" | ||||||
| 							:rows="formRows" /> | 							v-model="form" /> | ||||||
| 					</div> | 					</div> | ||||||
|  |  | ||||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||||
| 						<base-table | 						<base-table | ||||||
| 							v-loading="attrListLoading" | 							v-loading="attrListLoading" | ||||||
| 							:table-props="section.props" | 							:table-props="section.props" | ||||||
| 							:page="section.pageNo || 1" | 							:page="attrQuery?.params.pageNo || 1" | ||||||
| 							:limit="section.pageSize || 10" | 							:limit="attrQuery?.params.pageSize || 10" | ||||||
| 							:table-data="list" | 							:table-data="list" | ||||||
|  | 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||||
|  | 							@emitButtonClick="handleAddAttr" | ||||||
| 							@emitFun="handleEmitFun"> | 							@emitFun="handleEmitFun"> | ||||||
| 							<method-btn | 							<method-btn | ||||||
| 								v-if="section.tableBtn" | 								v-if="section.tableBtn" | ||||||
| @@ -54,27 +59,31 @@ | |||||||
| 								:method-list="tableBtn" | 								:method-list="tableBtn" | ||||||
| 								@clickBtn="handleTableBtnClick" /> | 								@clickBtn="handleTableBtnClick" /> | ||||||
| 						</base-table> | 						</base-table> | ||||||
|  |  | ||||||
|  | 						<!-- 分页组件 --> | ||||||
|  | 						<pagination | ||||||
|  | 							v-show="total > 0" | ||||||
|  | 							:total="total" | ||||||
|  | 							:page.sync="attrQuery.params.pageNo" | ||||||
|  | 							:limit.sync="attrQuery.params.pageSize" | ||||||
|  | 							@pagination="getAttrList" /> | ||||||
| 					</div> | 					</div> | ||||||
| 				</section> | 				</section> | ||||||
| 			</div> | 			</div> | ||||||
|  |  | ||||||
| 			<div class="drawer-body__footer"> | 			<div class="drawer-body__footer"> | ||||||
| 				<el-button style="margin-right: 10px" @click="handleCancel"> | 				<el-button style="" @click="handleCancel">取消</el-button> | ||||||
| 					返回 |  | ||||||
| 				</el-button> |  | ||||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||||
| 					编辑 | 					编辑 | ||||||
| 				</el-button> | 				</el-button> | ||||||
| 				<span v-else> | 				<el-button v-else type="primary" @click="handleConfirm">确定</el-button> | ||||||
| 					<el-button type="primary" @click="handleSave">保存</el-button> | 				<!-- sections的第二项必须是 属性列表  --> | ||||||
| 					<!-- sections的第二项必须是 属性列表  --> | 				<!-- <el-button | ||||||
| 					<el-button |  | ||||||
| 						v-if="sections[1].allowAdd" | 						v-if="sections[1].allowAdd" | ||||||
| 						type="primary" | 						type="primary" | ||||||
| 						@click="handleAddAttr"> | 						@click="handleAddAttr"> | ||||||
| 						添加属性 | 						添加属性 | ||||||
| 					</el-button> | 					</el-button> --> | ||||||
| 				</span> |  | ||||||
| 			</div> | 			</div> | ||||||
| 		</div> | 		</div> | ||||||
|  |  | ||||||
| @@ -99,11 +108,13 @@ | |||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import DialogForm from '@/components/DialogForm'; | import DialogForm from './DialogForm'; | ||||||
|  | import EquipmentInfoForm from './EquipmentInfoForm.vue'; | ||||||
|  |  | ||||||
| const SmallTitle = { | const SmallTitle = { | ||||||
| 	name: 'SmallTitle', | 	name: 'SmallTitle', | ||||||
| 	props: ['size'], | 	props: ['size'], | ||||||
|  | 	components: {}, | ||||||
| 	data() { | 	data() { | ||||||
| 		return {}; | 		return {}; | ||||||
| 	}, | 	}, | ||||||
| @@ -127,12 +138,13 @@ const SmallTitle = { | |||||||
| }; | }; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| 	components: { SmallTitle, DialogForm }, | 	components: { SmallTitle, DialogForm, EquipmentInfoForm }, | ||||||
| 	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段 | 	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段 | ||||||
| 	data() { | 	data() { | ||||||
| 		return { | 		return { | ||||||
| 			visible: false, | 			visible: false, | ||||||
| 			showForm: false, | 			showForm: false, | ||||||
|  | 			btnLoading: false, | ||||||
| 			total: 0, | 			total: 0, | ||||||
| 			form: {}, | 			form: {}, | ||||||
| 			list: [], | 			list: [], | ||||||
| @@ -161,10 +173,16 @@ export default { | |||||||
| 					}, | 					}, | ||||||
| 				], | 				], | ||||||
| 			], | 			], | ||||||
| 			attrQuery: null, // 属性列表的请求 | 			attrQuery: { | ||||||
|  | 				params: { | ||||||
|  | 					pageNo: 1, | ||||||
|  | 					pageSize: 10, | ||||||
|  | 				}, | ||||||
|  | 			}, // 属性列表的请求 | ||||||
| 			infoQuery: null, // 基本信息的请求 | 			infoQuery: null, // 基本信息的请求 | ||||||
| 			attrFormSubmitting: false, | 			attrFormSubmitting: false, | ||||||
| 			attrListLoading: false, | 			attrListLoading: false, | ||||||
|  | 			syncFileListFlag: null, | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	computed: { | 	computed: { | ||||||
| @@ -175,15 +193,19 @@ export default { | |||||||
| 						// 重置图片的位置 | 						// 重置图片的位置 | ||||||
| 						return { | 						return { | ||||||
| 							...col, | 							...col, | ||||||
|  | 							bind: { | ||||||
|  | 								...col.bind, | ||||||
|  | 							}, | ||||||
| 							style: { | 							style: { | ||||||
| 								left: 0, | 								left: 0, | ||||||
| 								right: 'unset' | 								right: 'unset', | ||||||
| 							} | 							}, | ||||||
| 						} | 						}; | ||||||
| 					} | 					} | ||||||
| 					return { | 					return { | ||||||
| 						...col, | 						...col, | ||||||
| 						bind: { | 						bind: { | ||||||
|  | 							...col.bind, | ||||||
| 							// 详情 模式下,禁用各种输入 | 							// 详情 模式下,禁用各种输入 | ||||||
| 							disabled: this.mode == 'detail', | 							disabled: this.mode == 'detail', | ||||||
| 						}, | 						}, | ||||||
| @@ -208,9 +230,52 @@ export default { | |||||||
| 				this.$axios(query).then(({ data }) => { | 				this.$axios(query).then(({ data }) => { | ||||||
| 					if (section.key == 'base') { | 					if (section.key == 'base') { | ||||||
| 						this.form = data; | 						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.showForm = true; | ||||||
| 						this.infoQuery = query; | 						this.infoQuery = query; | ||||||
| 						console.log('setting form: ', this.form, data); |  | ||||||
| 					} else if (section.key == 'attrs') { | 					} else if (section.key == 'attrs') { | ||||||
| 						this.attrQuery = query; | 						this.attrQuery = query; | ||||||
| 						this.list = data.list; | 						this.list = data.list; | ||||||
| @@ -231,6 +296,24 @@ export default { | |||||||
| 					break; | 					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) { | 		handleEmitFun(val) { | ||||||
| 			console.log('handleEmitFun', val); | 			console.log('handleEmitFun', val); | ||||||
| @@ -273,7 +356,7 @@ export default { | |||||||
|  |  | ||||||
| 		// 开启编辑 | 		// 开启编辑 | ||||||
| 		toggleEdit() { | 		toggleEdit() { | ||||||
| 			this.mode = 'edit'; | 			this.$emit('update-mode', 'edit'); | ||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| 		// 新增属性 | 		// 新增属性 | ||||||
| @@ -331,33 +414,44 @@ export default { | |||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| 		// 提交属性表 | 		// 提交属性表 | ||||||
| 		async submitAttrForm() { | 		submitAttrForm() { | ||||||
| 			this.$refs['attrForm'].validate((valid) => { | 			this.$refs['attrForm'].validate(async (valid) => { | ||||||
| 				if (!valid) { | 				if (!valid) { | ||||||
| 					return; | 					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) { | 				try { | ||||||
| 				this.closeAttrForm(); | 					const isEdit = this.attrForm.id != null; | ||||||
| 				this.$message({ | 					this.attrFormSubmitting = true; | ||||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | 					const res = await this.$axios({ | ||||||
| 					type: 'success', | 						url: isEdit | ||||||
| 					duration: 1500, | 							? this.sections[1].urlUpdate | ||||||
| 					onClose: () => { | 							: this.sections[1].urlCreate, | ||||||
| 						this.getAttrList(); | 						method: isEdit ? 'put' : 'post', | ||||||
| 					}, | 						data: this.attrForm, | ||||||
| 				}); | 					}); | ||||||
| 			} |  | ||||||
| 			this.attrFormSubmitting = false; | 					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() { | 		closeAttrForm() { | ||||||
|   | |||||||
							
								
								
									
										337
									
								
								src/views/core/base/equipment/components/EquipmentInfoForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										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> | ||||||
| @@ -1,111 +0,0 @@ | |||||||
| <!--  |  | ||||||
|     filename: EquipmentPics.vue |  | ||||||
|     author: liubin |  | ||||||
|     date: 2023-08-18 16:29:39 |  | ||||||
|     description:  |  | ||||||
| --> |  | ||||||
|  |  | ||||||
| <template> |  | ||||||
| 	<div class="equipment-pics"> |  | ||||||
| 		<div v-for="(url, idx) in images" :key="url"> |  | ||||||
| 			<img :src="url" :alt="url" /> |  | ||||||
| 			<figure class="big-img" :style="inlineStyle"> |  | ||||||
| 				<img :src="url" :alt="url" /> |  | ||||||
| 				<figcaption>{{ desc[idx] }}</figcaption> |  | ||||||
| 			</figure> |  | ||||||
| 		</div> |  | ||||||
| 	</div> |  | ||||||
| </template> |  | ||||||
|  |  | ||||||
| <script> |  | ||||||
| export default { |  | ||||||
| 	name: 'EquipmentPics', |  | ||||||
| 	components: {}, |  | ||||||
| 	props: { |  | ||||||
| 		inlineStyle: { |  | ||||||
| 			type: Object, |  | ||||||
| 			default: () => ({}), |  | ||||||
| 		}, |  | ||||||
| 	}, |  | ||||||
| 	data() { |  | ||||||
| 		return { |  | ||||||
| 			desc: [ |  | ||||||
| 				'车间设备 - 1', |  | ||||||
| 				'车间设备 - 2', |  | ||||||
| 				'车间设备 - 3', |  | ||||||
| 				'车间设备 - 4', |  | ||||||
| 				'车间设备 - 5', |  | ||||||
| 				'车间设备 - 6', |  | ||||||
| 				'车间设备 - 7', |  | ||||||
| 				'车间设备 - 8', |  | ||||||
| 				'车间设备 - 9', |  | ||||||
| 				'车间设备 - 10', |  | ||||||
| 				'车间设备 - 11', |  | ||||||
| 				'车间设备 - 12', |  | ||||||
| 			], |  | ||||||
| 			images: Array(10) |  | ||||||
| 				.fill(1) |  | ||||||
| 				.map((_, index) => require(`../assets/eq${index + 1}.jpg`)), |  | ||||||
| 		}; |  | ||||||
| 	}, |  | ||||||
| 	methods: {}, |  | ||||||
| }; |  | ||||||
| </script> |  | ||||||
|  |  | ||||||
| <style scoped lang="scss"> |  | ||||||
| .equipment-pics { |  | ||||||
| 	// background: #cfcfcf; |  | ||||||
| 	padding: 12px; |  | ||||||
| 	// margin: 8px; |  | ||||||
| 	display: flex; |  | ||||||
| 	overflow-x: auto; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div { |  | ||||||
| 	height: 100px; |  | ||||||
| 	position: relative; |  | ||||||
| 	cursor: pointer; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div:not(:last-child) { |  | ||||||
| 	margin-right: 12px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div > img { |  | ||||||
| 	height: 95%; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div > figure { |  | ||||||
| 	display: none; |  | ||||||
| 	position: fixed; |  | ||||||
| 	// inset: 0; |  | ||||||
| 	// margin: auto; |  | ||||||
| 	top: 0; |  | ||||||
| 	right: 0; |  | ||||||
| 	// width: 640px; |  | ||||||
| 	// height: 480px; |  | ||||||
| 	background: #000; |  | ||||||
| 	overflow: hidden; |  | ||||||
| 	padding: 8px 8px 0; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div:hover > figure { |  | ||||||
| 	margin: 0; |  | ||||||
| 	display: flex; |  | ||||||
| 	flex-direction: column; |  | ||||||
| 	align-items: center; |  | ||||||
| 	justify-content: center; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div > figure > img { |  | ||||||
| 	flex: 1; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| .equipment-pics > div > figure > figcaption { |  | ||||||
| 	height: 24px; |  | ||||||
| 	margin-top: 8px; |  | ||||||
| 	font-size: 18px; |  | ||||||
| 	line-height: 1; |  | ||||||
| 	color: #fff; |  | ||||||
| } |  | ||||||
| </style> |  | ||||||
| @@ -36,13 +36,17 @@ | |||||||
| 			:dialogVisible="open" | 			:dialogVisible="open" | ||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
|  | 			width="60%" | ||||||
| 			@confirm="submitForm"> | 			@confirm="submitForm"> | ||||||
| 			<DialogForm | 			<DialogForm | ||||||
| 				v-if="open" | 				v-if="open" | ||||||
| 				key="index-dialog-form" | 				key="index-dialog-form" | ||||||
| 				ref="form" | 				ref="form" | ||||||
| 				:dataForm="form" | 				label-position="top" | ||||||
| 				:rows="rows" /> | 				size="small" | ||||||
|  | 				v-model="form" | ||||||
|  | 				:rows="computedRows" | ||||||
|  | 				:has-file="true" /> | ||||||
| 		</base-dialog> | 		</base-dialog> | ||||||
|  |  | ||||||
| 		<!-- 设备 详情 - 编辑 --> | 		<!-- 设备 详情 - 编辑 --> | ||||||
| @@ -50,12 +54,13 @@ | |||||||
| 			v-if="editVisible" | 			v-if="editVisible" | ||||||
| 			ref="drawer" | 			ref="drawer" | ||||||
| 			:mode="editMode" | 			:mode="editMode" | ||||||
|  | 			@update-mode="editMode = $event" | ||||||
| 			:data-id="form.id" | 			:data-id="form.id" | ||||||
| 			:sections="[ | 			:sections="[ | ||||||
| 				{ | 				{ | ||||||
| 					name: '基本信息', | 					name: '基本信息', | ||||||
| 					key: 'base', | 					key: 'base', | ||||||
| 					rows: rows, | 					rows: computedRows, | ||||||
| 					url: '/base/equipment/get', | 					url: '/base/equipment/get', | ||||||
| 					urlUpdate: '/base/equipment/update', | 					urlUpdate: '/base/equipment/update', | ||||||
| 					urlCreate: '/base/equipment/create', | 					urlCreate: '/base/equipment/create', | ||||||
| @@ -93,17 +98,14 @@ | |||||||
| 				}, | 				}, | ||||||
| 			]" | 			]" | ||||||
| 			@refreshDataList="getList" | 			@refreshDataList="getList" | ||||||
| 			@cancel="editVisible = false" | 			@cancel="cancelEdit" | ||||||
| 			@destroy="editVisible = false" /> | 			@destroy="cancelEdit" /> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import moment from 'moment'; | import moment from 'moment'; | ||||||
| import basicPageMixin from '@/mixins/lb/basicPageMixin'; | import basicPageMixin from '@/mixins/lb/basicPageMixin'; | ||||||
| import { getAccessToken } from '@/utils/auth'; |  | ||||||
| import EquipmentPics from './components/EquipmentPics'; |  | ||||||
| import EquipmentAssets from './components/EquipmentAssets'; |  | ||||||
| import EquipmentDrawer from './components/EquipmentDrawer'; | import EquipmentDrawer from './components/EquipmentDrawer'; | ||||||
|  |  | ||||||
| import { | import { | ||||||
| @@ -115,6 +117,7 @@ import { | |||||||
| 	exportEquipmentExcel, | 	exportEquipmentExcel, | ||||||
| } from '@/api/base/equipment'; | } from '@/api/base/equipment'; | ||||||
| import Editor from '@/components/Editor'; | import Editor from '@/components/Editor'; | ||||||
|  | import AssetsUpload from './components/AssetsUpload.vue'; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| 	name: 'Equipment', | 	name: 'Equipment', | ||||||
| @@ -127,6 +130,12 @@ export default { | |||||||
| 		return { | 		return { | ||||||
| 			searchBarKeys: ['name', 'code'], | 			searchBarKeys: ['name', 'code'], | ||||||
| 			tableBtn: [ | 			tableBtn: [ | ||||||
|  | 				this.$auth.hasPermi(`base:equipment:update`) | ||||||
|  | 					? { | ||||||
|  | 							type: 'detail', | ||||||
|  | 							btnName: '详情', | ||||||
|  | 					  } | ||||||
|  | 					: undefined, | ||||||
| 				this.$auth.hasPermi('base:equipment:update') | 				this.$auth.hasPermi('base:equipment:update') | ||||||
| 					? { | 					? { | ||||||
| 							type: 'edit', | 							type: 'edit', | ||||||
| @@ -139,12 +148,6 @@ export default { | |||||||
| 							btnName: '删除', | 							btnName: '删除', | ||||||
| 					  } | 					  } | ||||||
| 					: undefined, | 					: undefined, | ||||||
| 				this.$auth.hasPermi(`base:equipment:update`) |  | ||||||
| 					? { |  | ||||||
| 							type: 'detail', |  | ||||||
| 							btnName: '详情', |  | ||||||
| 					  } |  | ||||||
| 					: undefined, |  | ||||||
| 			].filter((v) => v), | 			].filter((v) => v), | ||||||
| 			tableProps: [ | 			tableProps: [ | ||||||
| 				{ | 				{ | ||||||
| @@ -155,7 +158,7 @@ export default { | |||||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||||
| 				}, | 				}, | ||||||
| 				{ prop: 'name', label: '设备名称' }, | 				{ prop: 'name', label: '设备名称' }, | ||||||
| 				{ width: 256, prop: 'code', label: '检测编码' }, | 				{ width: 256, prop: 'code', label: '设备编码' }, | ||||||
| 				{ prop: 'equipmentType', label: '设备类型' }, | 				{ prop: 'equipmentType', label: '设备类型' }, | ||||||
| 				{ prop: 'enName', label: '英文名称' }, | 				{ prop: 'enName', label: '英文名称' }, | ||||||
| 				{ prop: 'abbr', label: '缩写' }, | 				{ prop: 'abbr', label: '缩写' }, | ||||||
| @@ -208,6 +211,13 @@ export default { | |||||||
| 				{ | 				{ | ||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
|  | 				{ | ||||||
|  | 					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '', | ||||||
|  | 					btnName: '导出', | ||||||
|  | 					name: 'export', | ||||||
|  | 					plain: true, | ||||||
|  | 					color: 'primary', | ||||||
|  | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: this.$auth.hasPermi('base:equipment:create') ? 'button' : '', | 					type: this.$auth.hasPermi('base:equipment:create') ? 'button' : '', | ||||||
| 					btnName: '新增', | 					btnName: '新增', | ||||||
| @@ -215,12 +225,6 @@ export default { | |||||||
| 					plain: true, | 					plain: true, | ||||||
| 					color: 'success', | 					color: 'success', | ||||||
| 				}, | 				}, | ||||||
| 				{ |  | ||||||
| 					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '', |  | ||||||
| 					btnName: '导出', |  | ||||||
| 					name: 'export', |  | ||||||
| 					color: 'warning', |  | ||||||
| 				}, |  | ||||||
| 			], | 			], | ||||||
| 			rows: [ | 			rows: [ | ||||||
| 				[ | 				[ | ||||||
| @@ -239,8 +243,6 @@ export default { | |||||||
| 						prop: 'code', | 						prop: 'code', | ||||||
| 						url: '/base/equipment/getCode', | 						url: '/base/equipment/getCode', | ||||||
| 					}, | 					}, | ||||||
| 				], |  | ||||||
| 				[ |  | ||||||
| 					{ | 					{ | ||||||
| 						input: true, | 						input: true, | ||||||
| 						label: '英文名称', | 						label: '英文名称', | ||||||
| @@ -250,6 +252,8 @@ export default { | |||||||
| 						// 	disabled: true, // some condition, like detail mode... | 						// 	disabled: true, // some condition, like detail mode... | ||||||
| 						// } | 						// } | ||||||
| 					}, | 					}, | ||||||
|  | 				], | ||||||
|  | 				[ | ||||||
| 					{ | 					{ | ||||||
| 						input: true, | 						input: true, | ||||||
| 						label: '缩写', | 						label: '缩写', | ||||||
| @@ -259,13 +263,15 @@ export default { | |||||||
| 						// 	disabled: true, // some condition, like detail mode... | 						// 	disabled: true, // some condition, like detail mode... | ||||||
| 						// } | 						// } | ||||||
| 					}, | 					}, | ||||||
| 				], |  | ||||||
| 				[ |  | ||||||
| 					{ | 					{ | ||||||
| 						select: true, | 						select: true, | ||||||
| 						label: '设备类型', | 						label: '设备类型', | ||||||
| 						prop: 'equipmentTypeId', | 						prop: 'equipmentTypeId', | ||||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||||
|  | 						bind: { | ||||||
|  | 							filterable: true, | ||||||
|  | 						}, | ||||||
| 					}, | 					}, | ||||||
| 					// { | 					// { | ||||||
| 					// 	select: true, | 					// 	select: true, | ||||||
| @@ -286,8 +292,6 @@ export default { | |||||||
| 						label: '进厂日期', | 						label: '进厂日期', | ||||||
| 						prop: 'enterTime', | 						prop: 'enterTime', | ||||||
| 					}, | 					}, | ||||||
| 				], |  | ||||||
| 				[ |  | ||||||
| 					{ | 					{ | ||||||
| 						input: true, | 						input: true, | ||||||
| 						prop: 'tvalue', | 						prop: 'tvalue', | ||||||
| @@ -302,11 +306,14 @@ export default { | |||||||
| 							}, | 							}, | ||||||
| 						], | 						], | ||||||
| 					}, | 					}, | ||||||
|  | 				], | ||||||
|  | 				[ | ||||||
| 					{ | 					{ | ||||||
| 						input: true, | 						input: true, | ||||||
| 						label: '产品加工时间', | 						label: '产品加工时间(s)', | ||||||
| 						prop: 'processingTime', | 						prop: 'processingTime', | ||||||
| 						rules: [ | 						rules: [ | ||||||
|  | 							{ required: true, message: '不能为空', trigger: 'blur' }, | ||||||
| 							{ | 							{ | ||||||
| 								type: 'number', | 								type: 'number', | ||||||
| 								message: '请输入正确的数字值', | 								message: '请输入正确的数字值', | ||||||
| @@ -315,8 +322,7 @@ export default { | |||||||
| 							}, | 							}, | ||||||
| 						], | 						], | ||||||
| 					}, | 					}, | ||||||
| 				], |  | ||||||
| 				[ |  | ||||||
| 					{ | 					{ | ||||||
| 						input: true, | 						input: true, | ||||||
| 						label: '制造商', | 						label: '制造商', | ||||||
| @@ -337,40 +343,79 @@ export default { | |||||||
| 						prop: 'description', | 						prop: 'description', | ||||||
| 					}, | 					}, | ||||||
| 				], | 				], | ||||||
| 				[ | 				// [ | ||||||
| 					{ | 				// 	{ | ||||||
| 						upload: true, | 				// 		assetUpload: true, | ||||||
| 						label: '上传资料', | 				// 		label: '上传资料', | ||||||
| 						prop: 'uploadFiles', | 				// 		fieldName: 'assets', | ||||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | 				// 		subcomponent: AssetsUpload | ||||||
| 						bind: { | 				// 	}, | ||||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, | 				// ], | ||||||
| 							'show-file-list': false, | 				// [ | ||||||
| 						}, | 				// 	{ | ||||||
| 					}, | 				// 		assetUpload: true, | ||||||
| 				], | 				// 		label: '上传图片', | ||||||
| 				[ | 				// 		fieldName: 'images', | ||||||
| 					{ | 				// 		subcomponent: AssetsUpload | ||||||
| 						diy: true, | 				// 	}, | ||||||
| 						key: 'eq-assets', | 				// ], | ||||||
| 						label: '设备资料', | 				// [ | ||||||
| 						prop: 'fileNames', | 				// 	{ | ||||||
| 						subcomponent: EquipmentAssets, | 				// 		upload: true, | ||||||
| 					}, | 				// 		label: '上传资料', | ||||||
| 				], | 				// 		prop: 'uploadFiles', | ||||||
| 				[ | 				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||||
| 					{ | 				// 		uploadFnName: 'assetsUpload', // 上传方法名 | ||||||
| 						diy: true, | 				// 		bind: { | ||||||
| 						key: 'eq-pics', | 				// 			headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||||
| 						label: '设备图片', | 				// 			'show-file-list': false, | ||||||
| 						prop: 'fileUrls', | 				// 		}, | ||||||
| 						subcomponent: EquipmentPics, | 				// 	}, | ||||||
| 						pictures: async () => { | 				// 	{ | ||||||
| 							// some async request | 				// 		diy: true, | ||||||
| 							return []; | 				// 		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, | 			editVisible: false, | ||||||
| 			editMode: 'edit', // 'edit', 'detail' | 			editMode: 'edit', // 'edit', 'detail' | ||||||
| @@ -399,11 +444,49 @@ export default { | |||||||
| 			form: { | 			form: { | ||||||
| 				id: null, | 				id: null, | ||||||
| 			}, | 			}, | ||||||
|  | 			showUploadComponents: false, // 是否显示上传组件 | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	created() { | 	created() { | ||||||
| 		this.getList(); | 		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: { | 	methods: { | ||||||
| 		/** 查询列表 */ | 		/** 查询列表 */ | ||||||
| 		getList() { | 		getList() { | ||||||
| @@ -420,6 +503,10 @@ export default { | |||||||
| 			this.open = false; | 			this.open = false; | ||||||
| 			this.reset(); | 			this.reset(); | ||||||
| 		}, | 		}, | ||||||
|  | 		cancelEdit() { | ||||||
|  | 			this.showUploadComponents = false; | ||||||
|  | 			this.editVisible = false; | ||||||
|  | 		}, | ||||||
| 		/** 表单重置 */ | 		/** 表单重置 */ | ||||||
| 		reset() { | 		reset() { | ||||||
| 			this.form = { | 			this.form = { | ||||||
| @@ -445,11 +532,13 @@ export default { | |||||||
| 		handleAdd() { | 		handleAdd() { | ||||||
| 			this.reset(); | 			this.reset(); | ||||||
| 			this.open = true; | 			this.open = true; | ||||||
|  | 			this.showUploadComponents = false; | ||||||
| 			this.title = '添加设备'; | 			this.title = '添加设备'; | ||||||
| 		}, | 		}, | ||||||
| 		/** 修改按钮操作 */ | 		/** 修改按钮操作 */ | ||||||
| 		handleUpdate(row) { | 		handleUpdate(row) { | ||||||
| 			this.reset(); | 			this.reset(); | ||||||
|  | 			this.showUploadComponents = true; | ||||||
| 			const id = row.id; | 			const id = row.id; | ||||||
| 			getEquipment(id).then((response) => { | 			getEquipment(id).then((response) => { | ||||||
| 				this.form = response.data; | 				this.form = response.data; | ||||||
| @@ -516,6 +605,7 @@ export default { | |||||||
| 		viewDetail(id) { | 		viewDetail(id) { | ||||||
| 			this.reset(); | 			this.reset(); | ||||||
| 			this.editMode = 'detail'; | 			this.editMode = 'detail'; | ||||||
|  | 			this.showUploadComponents = true; | ||||||
| 			this.form.id = id; | 			this.form.id = id; | ||||||
| 			this.editVisible = true; | 			this.editVisible = true; | ||||||
| 			this.$nextTick(() => { | 			this.$nextTick(() => { | ||||||
| @@ -524,11 +614,11 @@ export default { | |||||||
| 		}, | 		}, | ||||||
| 		// overwrite basicPageMixin 里的 处理表格按钮 方法 | 		// overwrite basicPageMixin 里的 处理表格按钮 方法 | ||||||
| 		handleTableBtnClick({ data, type }) { | 		handleTableBtnClick({ data, type }) { | ||||||
| 			console.log('[handleTableBtnClick]', data, type); |  | ||||||
| 			switch (type) { | 			switch (type) { | ||||||
| 				case 'edit': | 				case 'edit': | ||||||
| 					this.reset(); | 					this.reset(); | ||||||
| 					this.editMode = 'edit'; | 					this.editMode = 'edit'; | ||||||
|  | 					this.showUploadComponents = true; | ||||||
| 					this.form.id = data.id; | 					this.form.id = data.id; | ||||||
| 					this.editVisible = true; | 					this.editVisible = true; | ||||||
| 					this.$nextTick(() => { | 					this.$nextTick(() => { | ||||||
|   | |||||||
| @@ -37,7 +37,12 @@ | |||||||
| 			@close="cancel" | 			@close="cancel" | ||||||
| 			@cancel="cancel" | 			@cancel="cancel" | ||||||
| 			@confirm="submitForm"> | 			@confirm="submitForm"> | ||||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | 			<DialogForm | ||||||
|  | 				v-if="open" | ||||||
|  | 				ref="form" | ||||||
|  | 				v-model="form" | ||||||
|  | 				:rows="rows" | ||||||
|  | 				:has-file="true" /> | ||||||
| 		</base-dialog> | 		</base-dialog> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
| @@ -55,7 +60,7 @@ import { | |||||||
| 	exportEquipmentTypeExcel, | 	exportEquipmentTypeExcel, | ||||||
| } from '@/api/base/equipmentType'; | } from '@/api/base/equipmentType'; | ||||||
|  |  | ||||||
| import { getAccessToken } from '@/utils/auth'; | // import { getAccessToken } from '@/utils/auth'; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| 	name: 'EquipmentType', | 	name: 'EquipmentType', | ||||||
| @@ -86,9 +91,9 @@ export default { | |||||||
| 					width: 180, | 					width: 180, | ||||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||||
| 				}, | 				}, | ||||||
| 				{ prop: 'name', label: '设备类型名称',  }, | 				{ prop: 'name', label: '设备类型名称' }, | ||||||
| 				{ prop: 'code', label: '检测类型编码',  }, | 				{ prop: 'code', label: '检测类型编码' }, | ||||||
| 				{ prop: 'remark', label: '备注',  }, | 				{ prop: 'remark', label: '备注' }, | ||||||
| 			], | 			], | ||||||
| 			searchBarFormConfig: [ | 			searchBarFormConfig: [ | ||||||
| 				{ | 				{ | ||||||
| @@ -149,15 +154,13 @@ export default { | |||||||
| 						prop: 'parentId', | 						prop: 'parentId', | ||||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||||
| 					}, | 					}, | ||||||
|  | 					{}, | ||||||
|  | 				], | ||||||
|  | 				[ | ||||||
| 					{ | 					{ | ||||||
| 						upload: true, | 						upload: true, | ||||||
| 						label: '上传资料', | 						label: '上传资料', | ||||||
| 						prop: 'uploadFiles', | 						prop: 'files', | ||||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 |  | ||||||
| 						bind: { |  | ||||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, |  | ||||||
| 							'show-file-list': false, |  | ||||||
| 						}, |  | ||||||
| 					}, | 					}, | ||||||
| 				], | 				], | ||||||
| 				[{ input: true, label: '备注', prop: 'remark' }], | 				[{ input: true, label: '备注', prop: 'remark' }], | ||||||
| @@ -209,8 +212,6 @@ export default { | |||||||
| 				name: undefined, | 				name: undefined, | ||||||
| 				parentId: undefined, | 				parentId: undefined, | ||||||
| 				remark: undefined, | 				remark: undefined, | ||||||
| 				fileNames: [], |  | ||||||
| 				fileUrls: [], |  | ||||||
| 			}; | 			}; | ||||||
| 			this.resetForm('form'); | 			this.resetForm('form'); | ||||||
| 		}, | 		}, | ||||||
| @@ -236,6 +237,25 @@ export default { | |||||||
| 			const id = row.id; | 			const id = row.id; | ||||||
| 			getEquipmentType(id).then((response) => { | 			getEquipmentType(id).then((response) => { | ||||||
| 				this.form = response.data; | 				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.open = true; | ||||||
| 				this.title = '修改设备类型'; | 				this.title = '修改设备类型'; | ||||||
| 			}); | 			}); | ||||||
| @@ -267,7 +287,7 @@ export default { | |||||||
| 		handleDelete(row) { | 		handleDelete(row) { | ||||||
| 			const id = row.id; | 			const id = row.id; | ||||||
| 			this.$modal | 			this.$modal | ||||||
| 				.confirm('是否确认删除设备类型编号为"' + id + '"的数据项?') | 				.confirm('是否确认删除设备类型"' + row.name + '"?') | ||||||
| 				.then(function () { | 				.then(function () { | ||||||
| 					return deleteEquipmentType(id); | 					return deleteEquipmentType(id); | ||||||
| 				}) | 				}) | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2021-11-18 14:16:25 |  * @Date: 2021-11-18 14:16:25 | ||||||
|  * @LastEditors: zwq |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2023-08-01 16:59:06 |  * @LastEditTime: 2023-10-16 11:16:48 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| @@ -12,21 +12,30 @@ | |||||||
| 		ref="dataForm" | 		ref="dataForm" | ||||||
| 		@keyup.enter.native="dataFormSubmit()" | 		@keyup.enter.native="dataFormSubmit()" | ||||||
| 		label-width="80px"> | 		label-width="80px"> | ||||||
| 		<el-form-item label="工厂编码" prop="code"> | 		<el-row :gutter="20"> | ||||||
| 			<el-input | 			<el-col :span="12"> | ||||||
| 				v-model="dataForm.code" | 				<el-form-item label="工厂编码" prop="code"> | ||||||
| 				clearable | 					<el-input | ||||||
| 				placeholder="请输入工厂编码" /> | 						v-model="dataForm.code" | ||||||
| 		</el-form-item> | 						clearable | ||||||
| 		<el-form-item label="工厂名称" prop="name"> | 						placeholder="请输入工厂编码" /> | ||||||
| 			<el-input | 				</el-form-item> | ||||||
| 				v-model="dataForm.name" | 			</el-col> | ||||||
| 				clearable | 			<el-col :span="12"> | ||||||
| 				placeholder="请输入工厂名称" /> | 				<el-form-item label="工厂名称" prop="name"> | ||||||
| 		</el-form-item> | 					<el-input | ||||||
| 		<el-form-item label="地址" prop="address"> | 						v-model="dataForm.name" | ||||||
| 			<el-input v-model="dataForm.address" clearable placeholder="请输入地址" /> | 						clearable | ||||||
| 		</el-form-item> | 						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-form-item label="启用状态" prop="enabled"> | ||||||
| 			<el-select | 			<el-select | ||||||
| 				v-model="dataForm.enabled" | 				v-model="dataForm.enabled" | ||||||
| @@ -38,9 +47,12 @@ | |||||||
| 					:value="dict.value" /> | 					:value="dict.value" /> | ||||||
| 			</el-select> | 			</el-select> | ||||||
| 		</el-form-item> --> | 		</el-form-item> --> | ||||||
| 		<el-form-item label="备注" prop="remark"> | 			<el-col :span="12"> | ||||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | 				<el-form-item label="备注" prop="remark"> | ||||||
| 		</el-form-item> | 					<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||||
|  | 				</el-form-item> | ||||||
|  | 			</el-col> | ||||||
|  | 		</el-row> | ||||||
| 	</el-form> | 	</el-form> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -29,7 +29,7 @@ | |||||||
| 			@cancel="handleCancel" | 			@cancel="handleCancel" | ||||||
| 			@confirm="handleConfirm" | 			@confirm="handleConfirm" | ||||||
| 			:before-close="handleCancel" | 			:before-close="handleCancel" | ||||||
| 			width="70%"> | 			width="50%"> | ||||||
| 			<add-or-update | 			<add-or-update | ||||||
| 				ref="addOrUpdate" | 				ref="addOrUpdate" | ||||||
| 				@refreshDataList="successSubmit"></add-or-update> | 				@refreshDataList="successSubmit"></add-or-update> | ||||||
| @@ -51,7 +51,7 @@ const tableProps = [ | |||||||
| 	{ | 	{ | ||||||
| 		prop: 'code', | 		prop: 'code', | ||||||
| 		label: '工厂编码' | 		label: '工厂编码' | ||||||
| 	}, | 	},																																																																						 | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'name', | 		prop: 'name', | ||||||
| 		label: '工厂名称' | 		label: '工厂名称' | ||||||
|   | |||||||
| @@ -2,15 +2,14 @@ | |||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2023-08-02 15:12:42 |  * @Date: 2023-08-02 15:12:42 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2023-10-10 16:49:03 |  * @LastEditTime: 2023-10-13 16:35:03 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| 	<div class="app-container"> | 	<div class="app-container"> | ||||||
| 		<search-bar | 		<search-bar | ||||||
| 			:formConfigs="formConfig" | 			:formConfigs="[{ label: '产线在制产品', type: 'title' }]" | ||||||
| 			ref="searchBarForm" | 			ref="searchBarForm" /> | ||||||
| 			@headBtnClick="buttonClick" /> |  | ||||||
| 		<base-table | 		<base-table | ||||||
| 			v-loading="dataListLoading" | 			v-loading="dataListLoading" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| @@ -36,20 +35,17 @@ import { getProductPage } from '@/api/core/base/product'; | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'lineName', | 		prop: 'lineName', | ||||||
| 		label: '产线', | 		label: '产线' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'productName', | 		prop: 'productName', | ||||||
| 		label: '在制产品', | 		label: '在制产品', | ||||||
| 		align: 'center', |  | ||||||
| 		list: [], | 		list: [], | ||||||
| 		subcomponent: selectProduct, | 		subcomponent: selectProduct, | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'recordTime', | 		prop: 'recordTime', | ||||||
| 		label: '开始时间', | 		label: '开始时间', | ||||||
| 		align: 'center', |  | ||||||
| 		filter: parseTime, | 		filter: parseTime, | ||||||
| 	}, | 	}, | ||||||
| ]; | ]; | ||||||
| @@ -63,14 +59,14 @@ export default { | |||||||
| 			}, | 			}, | ||||||
| 			tableProps, | 			tableProps, | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
| 			formConfig: [ | 			// formConfig: [ | ||||||
| 				{ | 			// 	{ | ||||||
| 					type: 'button', | 			// 		type: 'button', | ||||||
| 					btnName: '同步', | 			// 		btnName: '同步', | ||||||
| 					name: 'search', | 			// 		name: 'search', | ||||||
| 					color: 'primary', | 			// 		color: 'primary', | ||||||
| 				}, | 			// 	}, | ||||||
| 			], | 			// ], | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	components: {}, | 	components: {}, | ||||||
|   | |||||||
| @@ -2,12 +2,11 @@ | |||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2023-08-03 14:09:18 |  * @Date: 2023-08-03 14:09:18 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2023-10-10 16:54:09 |  * @LastEditTime: 2023-10-13 16:47:25 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| 	<div class="tableInner"> | 	<div class="tableInner"> | ||||||
| 		<el-input readonly v-model="list.productName" style="width: 50%;" ></el-input> |  | ||||||
| 		<el-popover | 		<el-popover | ||||||
|     placement="top" |     placement="top" | ||||||
|     title="切换在制产品" |     title="切换在制产品" | ||||||
| @@ -28,8 +27,11 @@ | |||||||
| 					确定 | 					确定 | ||||||
| 				</el-button> | 				</el-button> | ||||||
| 			</div> | 			</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-popover> | ||||||
|  | 		<el-input readonly v-model="list.productName" style="width: 50%;margin-left: 5px" ></el-input> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
| <script> | <script> | ||||||
| @@ -61,6 +63,7 @@ export default { | |||||||
| 			switchLineBindProduct(data).then((response) => { | 			switchLineBindProduct(data).then((response) => { | ||||||
| 				this.$modal.msgSuccess('修改成功'); | 				this.$modal.msgSuccess('修改成功'); | ||||||
| 				this.visible = false; | 				this.visible = false; | ||||||
|  | 				this.list.productName = this.list.string.split('+')[1] | ||||||
| 				this.$emit('emitData'); | 				this.$emit('emitData'); | ||||||
| 			}); | 			}); | ||||||
| 		}, | 		}, | ||||||
|   | |||||||
| @@ -28,24 +28,20 @@ import { getProductPage } from '@/api/core/base/product'; | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'productionLineName', | 		prop: 'productionLineName', | ||||||
| 		label: '产线', | 		label: '产线' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'productName', | 		prop: 'productName', | ||||||
| 		label: '在制产品', | 		label: '在制产品' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'startTime', | 		prop: 'startTime', | ||||||
| 		label: '开始时间', | 		label: '开始时间', | ||||||
| 		align: 'center', |  | ||||||
| 		filter: parseTime, | 		filter: parseTime, | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'endTime', | 		prop: 'endTime', | ||||||
| 		label: '结束时间', | 		label: '结束时间', | ||||||
| 		align: 'center', |  | ||||||
| 		filter: parseTime, | 		filter: parseTime, | ||||||
| 	}, | 	}, | ||||||
| ]; | ]; | ||||||
| @@ -86,7 +82,8 @@ export default { | |||||||
| 					rangeSeparator: '-', | 					rangeSeparator: '-', | ||||||
| 					startPlaceholder: '开始时间', | 					startPlaceholder: '开始时间', | ||||||
| 					endPlaceholder: '结束时间', | 					endPlaceholder: '结束时间', | ||||||
| 					param: 'createTime', | 					param: 'startTime', | ||||||
|  | 					valueFormat: 'timestamp' | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'button', | 					type: 'button', | ||||||
| @@ -126,7 +123,7 @@ export default { | |||||||
| 					this.listQuery.pageSize = 10; | 					this.listQuery.pageSize = 10; | ||||||
| 					this.listQuery.productionLineId = val.productionLineId; | 					this.listQuery.productionLineId = val.productionLineId; | ||||||
| 					this.listQuery.productId = val.productId; | 					this.listQuery.productId = val.productId; | ||||||
| 					this.listQuery.createTime = val.createTime; | 					this.listQuery.startTime = val.startTime; | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'reset': | 				case 'reset': | ||||||
|   | |||||||
| @@ -43,7 +43,7 @@ | |||||||
| 							<el-form-item label="产品类型" prop="typeDictValue"> | 							<el-form-item label="产品类型" prop="typeDictValue"> | ||||||
| 								<el-select | 								<el-select | ||||||
| 									v-model="dataForm.typeDictValue" | 									v-model="dataForm.typeDictValue" | ||||||
|                   style="width: 100%" | 									style="width: 100%" | ||||||
| 									:disabled="isdetail" | 									:disabled="isdetail" | ||||||
| 									placeholder="请选择产品类型"> | 									placeholder="请选择产品类型"> | ||||||
| 									<el-option | 									<el-option | ||||||
| @@ -58,7 +58,7 @@ | |||||||
| 							<el-form-item label="单位" prop="unitDictValue"> | 							<el-form-item label="单位" prop="unitDictValue"> | ||||||
| 								<el-select | 								<el-select | ||||||
| 									v-model="dataForm.unitDictValue" | 									v-model="dataForm.unitDictValue" | ||||||
|                   style="width: 100%" | 									style="width: 100%" | ||||||
| 									:disabled="isdetail" | 									:disabled="isdetail" | ||||||
| 									placeholder="请选择单位"> | 									placeholder="请选择单位"> | ||||||
| 									<el-option | 									<el-option | ||||||
| @@ -83,8 +83,8 @@ | |||||||
| 							<el-form-item label="单位平方数" prop="area"> | 							<el-form-item label="单位平方数" prop="area"> | ||||||
| 								<el-input | 								<el-input | ||||||
| 									:disabled="isdetail" | 									:disabled="isdetail" | ||||||
|                   v-model="dataForm.area" | 									v-model="dataForm.area" | ||||||
|                   placeholder="请输入单位平方数" /> | 									placeholder="请输入单位平方数" /> | ||||||
| 							</el-form-item> | 							</el-form-item> | ||||||
| 						</el-col> | 						</el-col> | ||||||
| 					</el-row> | 					</el-row> | ||||||
| @@ -111,6 +111,8 @@ | |||||||
| 						:table-props="tableProps" | 						:table-props="tableProps" | ||||||
| 						:page="listQuery.pageNo" | 						:page="listQuery.pageNo" | ||||||
| 						:limit="listQuery.pageSize" | 						:limit="listQuery.pageSize" | ||||||
|  | 						:add-button-show="isdetail ? null : '添加属性'" | ||||||
|  | 						@emitButtonClick="addNew()" | ||||||
| 						:table-data="productAttributeList"> | 						:table-data="productAttributeList"> | ||||||
| 						<method-btn | 						<method-btn | ||||||
| 							v-if="!isdetail" | 							v-if="!isdetail" | ||||||
| @@ -123,15 +125,15 @@ | |||||||
| 					<pagination | 					<pagination | ||||||
| 						v-show="listQuery.total > 0" | 						v-show="listQuery.total > 0" | ||||||
| 						:total="listQuery.total" | 						:total="listQuery.total" | ||||||
| 						:page.sync="listQuery.current" | 						:page.sync="listQuery.pageNo" | ||||||
| 						:limit.sync="listQuery.size" | 						:limit.sync="listQuery.pageSize" | ||||||
| 						:page-sizes="[5, 10, 15]" | 						:page-sizes="[5, 10, 15]" | ||||||
| 						@pagination="getList" /> | 						@pagination="getList" /> | ||||||
| 				</div> | 				</div> | ||||||
| 			</div> | 			</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 style="margin-right: 10px" @click="goback()">返回</el-button> | ||||||
| 			<el-button v-if="isdetail" type="primary" @click="goEdit()"> | 			<el-button v-if="isdetail" type="primary" @click="goEdit()"> | ||||||
| 				编辑 | 				编辑 | ||||||
| @@ -145,6 +147,14 @@ | |||||||
| 					添加属性 | 					添加属性 | ||||||
| 				</el-button> | 				</el-button> | ||||||
| 			</span> | 			</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> | 		</div> | ||||||
|  |  | ||||||
| 		<product-attr-add | 		<product-attr-add | ||||||
| @@ -250,12 +260,12 @@ export default { | |||||||
| 					}, | 					}, | ||||||
| 				], | 				], | ||||||
| 				area: [ | 				area: [ | ||||||
| 					// { | 					{ | ||||||
| 					// 	type: 'float', | 						type: 'number', | ||||||
| 					// 	message: '单位平方数为浮点类型', | 						message: '请输入正确的数值', | ||||||
| 					// 	trigger: 'blur', | 						trigger: 'change', | ||||||
| 					// 	transfom: 'val => Float(val)', | 						transform: (val) => Number(val), | ||||||
| 					// }, | 					}, | ||||||
| 				], | 				], | ||||||
| 				processTime: [ | 				processTime: [ | ||||||
| 					{ | 					{ | ||||||
| @@ -263,12 +273,12 @@ export default { | |||||||
| 						message: '完成单位产品用时不能为空', | 						message: '完成单位产品用时不能为空', | ||||||
| 						trigger: 'blur', | 						trigger: 'blur', | ||||||
| 					}, | 					}, | ||||||
| 					// { | 					{ | ||||||
| 					// 	type: 'number', | 						type: 'number', | ||||||
| 					// 	message: '完成单位产品用时为浮点类型', | 						message: '请输入正确的数值', | ||||||
| 					// 	trigger: 'blur', | 						trigger: 'blur', | ||||||
| 					// 	transfom: 'val => Number(val)', | 						transform: (val) => Number(val), | ||||||
| 					// }, | 					}, | ||||||
| 				], | 				], | ||||||
| 			}, | 			}, | ||||||
| 			isdetail: false, | 			isdetail: false, | ||||||
| @@ -277,6 +287,7 @@ export default { | |||||||
| 	methods: { | 	methods: { | ||||||
| 		initData() { | 		initData() { | ||||||
| 			this.productAttributeList.splice(0); | 			this.productAttributeList.splice(0); | ||||||
|  | 			this.listQuery.total = 0; | ||||||
| 		}, | 		}, | ||||||
| 		init(id, isdetail) { | 		init(id, isdetail) { | ||||||
| 			this.initData(); | 			this.initData(); | ||||||
| @@ -304,12 +315,10 @@ export default { | |||||||
|  |  | ||||||
| 		getList() { | 		getList() { | ||||||
| 			// 获取产品的属性列表 | 			// 获取产品的属性列表 | ||||||
| 			const params = { | 			getProductAttrPage({ | ||||||
| 				pageSize: 10, | 				...this.listQuery, | ||||||
| 				pageNo: 1, |  | ||||||
| 				productId: this.dataForm.id, | 				productId: this.dataForm.id, | ||||||
| 			}; | 			}).then((response) => { | ||||||
| 			getProductAttrPage(params).then((response) => { |  | ||||||
| 				this.productAttributeList = response.data.list; | 				this.productAttributeList = response.data.list; | ||||||
| 				this.listQuery.total = response.data.total; | 				this.listQuery.total = response.data.total; | ||||||
| 			}); | 			}); | ||||||
| @@ -390,6 +399,8 @@ export default { | |||||||
| <style scoped> | <style scoped> | ||||||
| .drawer >>> .el-drawer { | .drawer >>> .el-drawer { | ||||||
| 	border-radius: 8px 0 0 8px; | 	border-radius: 8px 0 0 8px; | ||||||
|  | 	display: flex; | ||||||
|  | 	flex-direction: column; | ||||||
| } | } | ||||||
|  |  | ||||||
| .drawer >>> .el-form-item__label { | .drawer >>> .el-form-item__label { | ||||||
| @@ -400,14 +411,20 @@ export default { | |||||||
| 	margin: 0; | 	margin: 0; | ||||||
| 	padding: 32px 32px 24px; | 	padding: 32px 32px 24px; | ||||||
| 	border-bottom: 1px solid #dcdfe6; | 	border-bottom: 1px solid #dcdfe6; | ||||||
| 	margin-bottom: 30px; | } | ||||||
|  | .drawer >>> .el-drawer__body { | ||||||
|  | 	flex: 1; | ||||||
|  | 	height: 1px; | ||||||
|  | 	display: flex; | ||||||
|  | 	flex-direction: column; | ||||||
| } | } | ||||||
|  |  | ||||||
| .drawer >>> .content { | .drawer >>> .content { | ||||||
| 	padding: 0 24px 30px; | 	padding: 30px 24px; | ||||||
|  | 	flex: 1; | ||||||
| 	display: flex; | 	display: flex; | ||||||
| 	flex-direction: column; | 	flex-direction: column; | ||||||
| 	height: 100%; | 	/* height: 100%; */ | ||||||
| } | } | ||||||
|  |  | ||||||
| .drawer >>> .visual-part { | .drawer >>> .visual-part { | ||||||
| @@ -422,4 +439,10 @@ export default { | |||||||
| .drawer >>> .attr-list { | .drawer >>> .attr-list { | ||||||
| 	padding: 0 16px; | 	padding: 0 16px; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .drawer-body__footer { | ||||||
|  | 	display: flex; | ||||||
|  | 	justify-content: flex-end; | ||||||
|  | 	padding: 18px; | ||||||
|  | } | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -1,8 +1,8 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2023-08-01 14:55:51 |  * @Date: 2023-08-01 14:55:51 | ||||||
|  * @LastEditors: zwq |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2023-08-03 15:22:53 |  * @LastEditTime: 2023-10-13 10:27:00 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| @@ -50,30 +50,25 @@ import { | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'code', | 		prop: 'code', | ||||||
| 		label: '产品编码', | 		label: '产品编码' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'name', | 		prop: 'name', | ||||||
| 		label: '产品名称', | 		label: '产品名称' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'specifications', | 		prop: 'specifications', | ||||||
| 		label: '规格', | 		label: '规格' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'unitDictValue', | 		prop: 'unitDictValue', | ||||||
| 		label: '单位', | 		label: '单位', | ||||||
| 		align: 'center', |  | ||||||
| 		subcomponent: unitDict, | 		subcomponent: unitDict, | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'createTime', | 		prop: 'createTime', | ||||||
| 		label: '创建时间', | 		label: '创建时间', | ||||||
| 		align: 'center', | 		filter: parseTime | ||||||
| 		filter: parseTime, |  | ||||||
| 	}, | 	}, | ||||||
| ]; | ]; | ||||||
|  |  | ||||||
| @@ -127,14 +122,14 @@ export default { | |||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'separate', | 				// 	type: 'separate', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'button', | 				// 	type: 'button', | ||||||
| 					btnName: '重置', | 				// 	btnName: '重置', | ||||||
| 					name: 'reset', | 				// 	name: 'reset', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
|   | |||||||
| @@ -7,53 +7,84 @@ | |||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| 	<el-form | 	<el-form | ||||||
|  | 		class="dialog-inner__form" | ||||||
| 		:model="dataForm" | 		:model="dataForm" | ||||||
| 		:rules="dataRule" | 		:rules="dataRule" | ||||||
| 		ref="dataForm" | 		ref="dataForm" | ||||||
| 		@keyup.enter.native="dataFormSubmit()" | 		@keyup.enter.native="dataFormSubmit()" | ||||||
| 		label-width="90px"> | 		label-width="90px"> | ||||||
| 		<el-form-item label="产线编码" prop="code"> | 		<el-row :gutter="20"> | ||||||
| 			<el-input | 			<el-col :span="12"> | ||||||
| 				v-model="dataForm.code" | 				<el-form-item label="产线编码" prop="code"> | ||||||
| 				clearable | 					<el-input | ||||||
| 				placeholder="请输入产线编码" /> | 						v-model="dataForm.code" | ||||||
| 		</el-form-item> | 						clearable | ||||||
| 		<el-form-item label="产线名称" prop="name"> | 						placeholder="请输入产线编码" /> | ||||||
| 			<el-input | 				</el-form-item> | ||||||
| 				v-model="dataForm.name" | 			</el-col> | ||||||
| 				clearable | 			<el-col :span="12"> | ||||||
| 				placeholder="请输入产线名称" /> | 				<el-form-item label="产线名称" prop="name"> | ||||||
| 		</el-form-item> | 					<el-input | ||||||
|     <el-form-item prop="factoryId" label="工厂名称"> | 						v-model="dataForm.name" | ||||||
|       <el-select | 						clearable | ||||||
|       v-model="dataForm.factoryId" filterable clearable placeholder="请选择工厂"> | 						placeholder="请输入产线名称" /> | ||||||
|         <el-option | 				</el-form-item> | ||||||
|           v-for="item in urlOptions.optionArr.arr0" | 			</el-col> | ||||||
|           :key="item.id" | 		</el-row> | ||||||
|           :label="item.name" | 		<el-row :gutter="20"> | ||||||
|           :value="item.id" | 			<el-col :span="12"> | ||||||
|         > | 				<el-form-item prop="factoryId" label="工厂名称"> | ||||||
|         </el-option> | 					<el-select | ||||||
|       </el-select> | 						v-model="dataForm.factoryId" | ||||||
|     </el-form-item> | 						filterable | ||||||
| 		<el-form-item label="产线TT值(h)" prop="tvalue"> | 						clearable | ||||||
| 			<el-input v-model="dataForm.tvalue" clearable placeholder="请输入每小时下片数量" /> | 						placeholder="请选择工厂"> | ||||||
| 		</el-form-item> | 						<el-option | ||||||
| 		<el-form-item label="额外编码" prop="externalCode"> | 							v-for="item in urlOptions.optionArr.arr0" | ||||||
| 			<el-input | 							:key="item.id" | ||||||
| 				v-model="dataForm.externalCode" | 							:label="item.name" | ||||||
| 				clearable | 							:value="item.id"></el-option> | ||||||
| 				placeholder="请输入额外编码" /> | 					</el-select> | ||||||
| 		</el-form-item> | 				</el-form-item> | ||||||
| 		<el-form-item label="描述" prop="description"> | 			</el-col> | ||||||
| 			<el-input | 			<el-col :span="12"> | ||||||
| 				v-model="dataForm.description" | 				<el-form-item label="产线TT值(h)" prop="tvalue"> | ||||||
| 				type="textarea" | 					<el-input | ||||||
| 				placeholder="请输入内容" /> | 						v-model="dataForm.tvalue" | ||||||
| 		</el-form-item> | 						clearable | ||||||
| 		<el-form-item label="备注" prop="remark"> | 						placeholder="请输入每小时下片数量" /> | ||||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | 				</el-form-item> | ||||||
| 		</el-form-item> | 			</el-col> | ||||||
|  | 		</el-row> | ||||||
|  | 		<el-row :gutter="20"> | ||||||
|  | 			<el-col :span="12"> | ||||||
|  | 				<el-form-item label="额外编码" prop="externalCode"> | ||||||
|  | 					<el-input | ||||||
|  | 						v-model="dataForm.externalCode" | ||||||
|  | 						clearable | ||||||
|  | 						placeholder="请输入额外编码" /> | ||||||
|  | 				</el-form-item> | ||||||
|  | 			</el-col> | ||||||
|  | 			<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-row> | ||||||
|  | 			<el-col> | ||||||
|  | 				<el-form-item label="描述" prop="description"> | ||||||
|  | 					<el-input | ||||||
|  | 						v-model="dataForm.description" | ||||||
|  | 						type="textarea" | ||||||
|  | 						placeholder="请输入内容" /> | ||||||
|  | 				</el-form-item> | ||||||
|  | 			</el-col> | ||||||
|  | 		</el-row> | ||||||
| 	</el-form> | 	</el-form> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -65,22 +96,20 @@ import { | |||||||
| 	getProductionLine, | 	getProductionLine, | ||||||
| 	getCode, | 	getCode, | ||||||
| } from '@/api/core/base/productionLine'; | } from '@/api/core/base/productionLine'; | ||||||
| import { | import { getFactoryPage } from '@/api/core/base/factory'; | ||||||
| 	getFactoryPage, |  | ||||||
| } from '@/api/core/base/factory'; |  | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| 	mixins: [basicAdd], | 	mixins: [basicAdd], | ||||||
| 	data() { | 	data() { | ||||||
| 		return { | 		return { | ||||||
| 			urlOptions: { | 			urlOptions: { | ||||||
|         getOption: true, | 				getOption: true, | ||||||
| 			  isGetCode: true, | 				isGetCode: true, | ||||||
|         codeURL: getCode, | 				codeURL: getCode, | ||||||
| 				createURL: createProductionLine, | 				createURL: createProductionLine, | ||||||
| 				updateURL: updateProductionLine, | 				updateURL: updateProductionLine, | ||||||
| 				infoURL: getProductionLine, | 				infoURL: getProductionLine, | ||||||
|         optionArrUrl: [getFactoryPage], | 				optionArrUrl: [getFactoryPage], | ||||||
| 			}, | 			}, | ||||||
| 			dataForm: { | 			dataForm: { | ||||||
| 				id: undefined, | 				id: undefined, | ||||||
| @@ -99,13 +128,26 @@ export default { | |||||||
| 				name: [ | 				name: [ | ||||||
| 					{ required: true, message: '产线名称不能为空', trigger: 'blur' }, | 					{ required: true, message: '产线名称不能为空', trigger: 'blur' }, | ||||||
| 				], | 				], | ||||||
|         factoryId: [ | 				factoryId: [ | ||||||
| 					{ required: true, message: '工厂不能为空', trigger: 'change' }, | 					{ required: true, message: '工厂不能为空', trigger: 'change' }, | ||||||
| 				], | 				], | ||||||
|  | 				tvalue: [ | ||||||
|  | 					{ | ||||||
|  | 						type: 'number', | ||||||
|  | 						message: '请输入正确的数字', | ||||||
|  | 						trigger: 'change', | ||||||
|  | 						transform: (val) => Number(val), | ||||||
|  | 					}, | ||||||
|  | 				], | ||||||
| 			}, | 			}, | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| 	methods: { | 	methods: {}, | ||||||
| 	}, |  | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
|  |  | ||||||
|  | <style scoped> | ||||||
|  | .dialog-inner__form >>> .el-select { | ||||||
|  | 	width: 100%; | ||||||
|  | } | ||||||
|  | </style> | ||||||
|   | |||||||
| @@ -29,7 +29,7 @@ | |||||||
| 			@cancel="handleCancel" | 			@cancel="handleCancel" | ||||||
| 			@confirm="handleConfirm" | 			@confirm="handleConfirm" | ||||||
| 			:before-close="handleCancel" | 			:before-close="handleCancel" | ||||||
| 			width="70%"> | 			width="50%"> | ||||||
| 			<add-or-update | 			<add-or-update | ||||||
| 				ref="addOrUpdate" | 				ref="addOrUpdate" | ||||||
| 				@refreshDataList="successSubmit"></add-or-update> | 				@refreshDataList="successSubmit"></add-or-update> | ||||||
| @@ -52,45 +52,37 @@ import { | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'code', | 		prop: 'code', | ||||||
| 		label: '产线编码', | 		label: '产线编码' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'name', | 		prop: 'name', | ||||||
| 		label: '产线名称', | 		label: '产线名称' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'factoryName', | 		prop: 'factoryName', | ||||||
| 		label: '工厂', | 		label: '工厂' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'externalCode', | 		prop: 'externalCode', | ||||||
| 		label: '额外编码', | 		label: '额外编码' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'status', | 		prop: 'status', | ||||||
| 		label: '当前状态', | 		label: '当前状态', | ||||||
| 		align: 'center', |  | ||||||
| 		filter: codeFilter('lineStatus'), | 		filter: codeFilter('lineStatus'), | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'description', | 		prop: 'description', | ||||||
| 		label: '描述', | 		label: '描述' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'remark', | 		prop: 'remark', | ||||||
| 		label: '备注', | 		label: '备注' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'createTime', | 		prop: 'createTime', | ||||||
| 		label: '创建时间', | 		label: '创建时间', | ||||||
| 		align: 'center', | 		filter: parseTime | ||||||
| 		filter: parseTime, |  | ||||||
| 	}, | 	}, | ||||||
| ]; | ]; | ||||||
|  |  | ||||||
| @@ -132,14 +124,14 @@ export default { | |||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'separate', | 				// 	type: 'separate', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'button', | 				// 	type: 'button', | ||||||
| 					btnName: '重置', | 				// 	btnName: '重置', | ||||||
| 					name: 'reset', | 				// 	name: 'reset', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
| @@ -173,7 +165,7 @@ export default { | |||||||
| 		getDataList() { | 		getDataList() { | ||||||
| 			this.dataListLoading = true; | 			this.dataListLoading = true; | ||||||
| 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | ||||||
| 				this.total = response.data.total; | 				this.listQuery.total = response.data.total; | ||||||
| 				this.getStatus(response.data.list); | 				this.getStatus(response.data.list); | ||||||
| 				this.dataListLoading = false; | 				this.dataListLoading = false; | ||||||
| 			}); | 			}); | ||||||
| @@ -195,7 +187,7 @@ export default { | |||||||
| 			switch (val.btnName) { | 			switch (val.btnName) { | ||||||
| 				case 'search': | 				case 'search': | ||||||
| 					this.listQuery.pageNo = 1; | 					this.listQuery.pageNo = 1; | ||||||
| 					this.listQuery.pageSize = 10;.7 | 					this.listQuery.pageSize = 10; | ||||||
| 					this.listQuery.name = val.name; | 					this.listQuery.name = val.name; | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|  * @Author: zwq |  * @Author: zwq | ||||||
|  * @Date: 2023-08-01 13:52:10 |  * @Date: 2023-08-01 13:52:10 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @LastEditTime: 2023-09-21 10:48:54 |  * @LastEditTime: 2023-10-16 13:40:00 | ||||||
|  * @Description: |  * @Description: | ||||||
| --> | --> | ||||||
| <template> | <template> | ||||||
| @@ -12,33 +12,45 @@ | |||||||
| 		ref="dataForm" | 		ref="dataForm" | ||||||
| 		@keyup.enter.native="dataFormSubmit()" | 		@keyup.enter.native="dataFormSubmit()" | ||||||
| 		label-width="90px"> | 		label-width="90px"> | ||||||
| 		<el-form-item label="工段编码" prop="code"> | 		<el-row :gutter="20"> | ||||||
| 			<el-input | 			<el-col :span="12"> | ||||||
| 				v-model="dataForm.code" | 				<el-form-item label="工段编码" prop="code"> | ||||||
| 				clearable | 					<el-input | ||||||
| 				placeholder="请输入工段编码" /> | 						v-model="dataForm.code" | ||||||
| 		</el-form-item> | 						clearable | ||||||
| 		<el-form-item label="工段名称" prop="name"> | 						placeholder="请输入工段编码" /> | ||||||
| 			<el-input | 				</el-form-item> | ||||||
| 				v-model="dataForm.name" | 			</el-col> | ||||||
| 				clearable | 			<el-col :span="12"> | ||||||
| 				placeholder="请输入工段名称" /> | 				<el-form-item label="工段名称" prop="name"> | ||||||
| 		</el-form-item> | 					<el-input | ||||||
|     <el-form-item prop="productionLineId" label="产线"> | 						v-model="dataForm.name" | ||||||
|       <el-select | 						clearable | ||||||
|       v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线"> | 						placeholder="请输入工段名称" /> | ||||||
|         <el-option | 				</el-form-item> | ||||||
|           v-for="item in urlOptions.optionArr.arr0" | 			</el-col> | ||||||
|           :key="item.id" | 		</el-row> | ||||||
|           :label="item.name" | 		<el-row :gutter="20"> | ||||||
|           :value="item.id" | 			<el-col :span="12"> | ||||||
|         > | 				<el-form-item prop="productionLineId" label="产线"> | ||||||
|         </el-option> | 					<el-select | ||||||
|       </el-select> | 					v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线"> | ||||||
|     </el-form-item> | 						<el-option | ||||||
| 		<el-form-item label="排序" prop="sort"> | 							v-for="item in urlOptions.optionArr.arr0" | ||||||
| 			<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" /> | 							:key="item.id" | ||||||
| 		</el-form-item> | 							:label="item.name" | ||||||
|  | 							:value="item.id" | ||||||
|  | 						> | ||||||
|  | 						</el-option> | ||||||
|  | 					</el-select> | ||||||
|  | 				</el-form-item> | ||||||
|  | 			</el-col> | ||||||
|  | 			<el-col :span="12"> | ||||||
|  | 				<el-form-item label="排序" prop="sort"> | ||||||
|  | 					<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" /> | ||||||
|  | 				</el-form-item> | ||||||
|  | 			</el-col> | ||||||
|  | 		</el-row> | ||||||
| 		<el-form-item label="备注" prop="remark"> | 		<el-form-item label="备注" prop="remark"> | ||||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||||
| 		</el-form-item> | 		</el-form-item> | ||||||
|   | |||||||
| @@ -29,7 +29,7 @@ | |||||||
| 			@cancel="handleCancel" | 			@cancel="handleCancel" | ||||||
| 			@confirm="handleConfirm" | 			@confirm="handleConfirm" | ||||||
| 			:before-close="handleCancel" | 			:before-close="handleCancel" | ||||||
| 			width="70%"> | 			width="50%"> | ||||||
| 			<add-or-update | 			<add-or-update | ||||||
| 				ref="addOrUpdate" | 				ref="addOrUpdate" | ||||||
| 				@refreshDataList="successSubmit"></add-or-update> | 				@refreshDataList="successSubmit"></add-or-update> | ||||||
| @@ -50,34 +50,28 @@ import { | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'code', | 		prop: 'code', | ||||||
| 		label: '工段编码', | 		label: '工段编码' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'name', | 		prop: 'name', | ||||||
| 		label: '工段名称', | 		label: '工段名称' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'productionLineName', | 		prop: 'productionLineName', | ||||||
| 		label: '产线', | 		label: '产线' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'sort', | 		prop: 'sort', | ||||||
| 		label: '排序', | 		label: '排序' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'remark', | 		prop: 'remark', | ||||||
| 		label: '备注', | 		label: '备注' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
| 	{ | 	{ | ||||||
| 		prop: 'createTime', | 		prop: 'createTime', | ||||||
| 		label: '创建时间', | 		label: '创建时间', | ||||||
| 		align: 'center', | 		filter: parseTime | ||||||
| 		filter: parseTime, |  | ||||||
| 	}, | 	}, | ||||||
| ]; | ]; | ||||||
|  |  | ||||||
| @@ -119,14 +113,14 @@ export default { | |||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'separate', | 				// 	type: 'separate', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				// { | ||||||
| 					type: 'button', | 				// 	type: 'button', | ||||||
| 					btnName: '重置', | 				// 	btnName: '重置', | ||||||
| 					name: 'reset', | 				// 	name: 'reset', | ||||||
| 				}, | 				// }, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'separate', | 					type: 'separate', | ||||||
| 				}, | 				}, | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: Do not edit |  * @Author: Do not edit | ||||||
|  * @Date: 2023-08-29 14:59:29 |  * @Date: 2023-08-29 14:59:29 | ||||||
|  * @LastEditTime: 2023-10-09 09:08:08 |  * @LastEditTime: 2023-10-16 15:10:42 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description:  |  * @Description:  | ||||||
| --> | --> | ||||||
| @@ -12,6 +12,7 @@ | |||||||
| 			ref="searchBarForm" | 			ref="searchBarForm" | ||||||
| 			@headBtnClick="buttonClick" /> | 			@headBtnClick="buttonClick" /> | ||||||
| 		<base-table | 		<base-table | ||||||
|  | 			v-if="showData.length" | ||||||
| 			class="right-aside" | 			class="right-aside" | ||||||
| 			v-loading="dataListLoading" | 			v-loading="dataListLoading" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| @@ -22,6 +23,7 @@ | |||||||
| 			@selection-change="selectChange" | 			@selection-change="selectChange" | ||||||
| 			> | 			> | ||||||
| 		</base-table> | 		</base-table> | ||||||
|  | 		<div v-else class="no-data-bg"></div> | ||||||
| 		<pagination | 		<pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -117,6 +119,7 @@ export default { | |||||||
|         pageNo: 1, |         pageNo: 1, | ||||||
|         total: 1, |         total: 1, | ||||||
|       }, |       }, | ||||||
|  | 			fileName: '', | ||||||
|       exportLoading: false, |       exportLoading: false, | ||||||
|       dataListLoading: false, |       dataListLoading: false, | ||||||
| 			dialogVisible: false, | 			dialogVisible: false, | ||||||
| @@ -194,7 +197,8 @@ export default { | |||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 					color: 'warning', | 					color: 'primary', | ||||||
|  | 					plain: true | ||||||
| 				} | 				} | ||||||
| 			], | 			], | ||||||
| 		}; | 		}; | ||||||
| @@ -207,6 +211,7 @@ export default { | |||||||
| 		test() { | 		test() { | ||||||
| 			var target = document.getElementsByClassName("right-aside")[0] | 			var target = document.getElementsByClassName("right-aside")[0] | ||||||
| 			target.style.background = '#FFFFFF' | 			target.style.background = '#FFFFFF' | ||||||
|  | 			var that = this | ||||||
| 			setTimeout(() => { | 			setTimeout(() => { | ||||||
| 				html2canvas(target).then(function(canvas) { | 				html2canvas(target).then(function(canvas) { | ||||||
| 						var contentWidth = canvas.width | 						var contentWidth = canvas.width | ||||||
| @@ -242,7 +247,7 @@ export default { | |||||||
| 							} | 							} | ||||||
| 						} | 						} | ||||||
|  |  | ||||||
| 						pdf.save('产线统计自动报表.pdf') | 						pdf.save(that.fileName + '产线产量.pdf') | ||||||
| 				}) | 				}) | ||||||
| 			}, 300) | 			}, 300) | ||||||
| 		}, | 		}, | ||||||
| @@ -285,7 +290,7 @@ export default { | |||||||
|       try { |       try { | ||||||
|         FileSaver.saveAs(new Blob([exportTableOut], { |         FileSaver.saveAs(new Blob([exportTableOut], { | ||||||
|           type: 'application/octet-stream' |           type: 'application/octet-stream' | ||||||
|         }), '产线统计自动报表.xlsx') |         }), this.fileName + '产线产量.xlsx') | ||||||
|       } catch (e) { |       } catch (e) { | ||||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) |         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||||
|       } |       } | ||||||
| @@ -310,6 +315,9 @@ export default { | |||||||
| 					this.listQuery.reportType = val.reportType ? val.reportType : undefined; | 					this.listQuery.reportType = val.reportType ? val.reportType : undefined; | ||||||
| 					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined; | 					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined; | ||||||
| 					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined; | 					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined; | ||||||
|  | 					if (val.timeVal && val.timeVal.length > 0) { | ||||||
|  | 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||||
|  |           } | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'export': | 				case 'export': | ||||||
| @@ -327,7 +335,7 @@ export default { | |||||||
| 					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月' | 					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月' | ||||||
| 					return item | 					return item | ||||||
| 				}); | 				}); | ||||||
|         this.total = response.data.total; |         this.listQuery.total = response.data.total; | ||||||
|         this.dataListLoading = false; |         this.dataListLoading = false; | ||||||
| 				this.showData = this.tableData | 				this.showData = this.tableData | ||||||
|       }); |       }); | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: Do not edit |  * @Author: Do not edit | ||||||
|  * @Date: 2023-08-29 14:59:29 |  * @Date: 2023-08-29 14:59:29 | ||||||
|  * @LastEditTime: 2023-10-09 15:14:42 |  * @LastEditTime: 2023-10-16 15:18:23 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description:  |  * @Description:  | ||||||
| --> | --> | ||||||
| @@ -12,6 +12,7 @@ | |||||||
| 			ref="searchBarForm" | 			ref="searchBarForm" | ||||||
| 			@headBtnClick="buttonClick" /> | 			@headBtnClick="buttonClick" /> | ||||||
| 		<base-table | 		<base-table | ||||||
|  | 			v-if="showData.length" | ||||||
| 			class="right-aside" | 			class="right-aside" | ||||||
| 			v-loading="dataListLoading" | 			v-loading="dataListLoading" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| @@ -29,6 +30,7 @@ | |||||||
| 				:method-list="tableBtn" | 				:method-list="tableBtn" | ||||||
| 				@clickBtn="handleClick" /> | 				@clickBtn="handleClick" /> | ||||||
| 		</base-table> | 		</base-table> | ||||||
|  | 		<div v-else class="no-data-bg"></div> | ||||||
| 		<pagination | 		<pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -110,7 +112,7 @@ export default { | |||||||
| 			showData: [], | 			showData: [], | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
| 			selectedList: [], | 			selectedList: [], | ||||||
| 			fileName: [], | 			fileName: '', | ||||||
| 			formConfig: [ | 			formConfig: [ | ||||||
| 				{ | 				{ | ||||||
| 					type: 'select', | 					type: 'select', | ||||||
| @@ -145,7 +147,8 @@ export default { | |||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 					color: 'warning', | 					color: 'primary', | ||||||
|  | 					plain: true | ||||||
| 				} | 				} | ||||||
| 			], | 			], | ||||||
| 		}; | 		}; | ||||||
| @@ -156,7 +159,7 @@ export default { | |||||||
| 		} | 		} | ||||||
| 		// const time = new Date() | 		// const time = new Date() | ||||||
| 		// this.formConfig[1].defaultSelect = [time, time] | 		// this.formConfig[1].defaultSelect = [time, time] | ||||||
| 		// this.getDataList() | 		this.getDataList() | ||||||
| 		this.getPdLineList() | 		this.getPdLineList() | ||||||
| 	}, | 	}, | ||||||
| 	methods: { | 	methods: { | ||||||
| @@ -199,7 +202,7 @@ export default { | |||||||
| 							} | 							} | ||||||
| 						} | 						} | ||||||
|  |  | ||||||
| 						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_产线产量.pdf') | 						pdf.save(that.fileName + '产线产量.pdf') | ||||||
| 				}) | 				}) | ||||||
| 			}, 300) | 			}, 300) | ||||||
| 		}, | 		}, | ||||||
| @@ -222,7 +225,7 @@ export default { | |||||||
|       try { |       try { | ||||||
|         FileSaver.saveAs(new Blob([exportTableOut], { |         FileSaver.saveAs(new Blob([exportTableOut], { | ||||||
|           type: 'application/octet-stream' |           type: 'application/octet-stream' | ||||||
|         }), this.fileName[0] + '-' + this.fileName[1] + '_产线产量.xlsx') |         }), this.fileName + '产线产量.xlsx') | ||||||
|       } catch (e) { |       } catch (e) { | ||||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) |         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||||
|       } |       } | ||||||
| @@ -265,17 +268,10 @@ export default { | |||||||
| 					this.listQuery.proLineId = val.line ? val.line : undefined; | 					this.listQuery.proLineId = val.line ? val.line : undefined; | ||||||
| 					this.listQuery.startTime = val.timeVal ? new Date(val.timeVal[0]).getTime() : undefined; | 					this.listQuery.startTime = val.timeVal ? new Date(val.timeVal[0]).getTime() : undefined; | ||||||
| 					this.listQuery.endTime = val.timeVal ? new Date(val.timeVal[1]).getTime() : undefined; | 					this.listQuery.endTime = val.timeVal ? new Date(val.timeVal[1]).getTime() : undefined; | ||||||
| 					console.log('nihc 你好', val.timeVal) |  | ||||||
| 					if (val.timeVal && val.timeVal.length > 0) { | 					if (val.timeVal && val.timeVal.length > 0) { | ||||||
| 						this.fileName[0] = val.timeVal[0].slice(0, 10) | 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||||
| 						this.fileName[1] = val.timeVal[1].slice(0, 10) |  | ||||||
|             this.getDataList(); |  | ||||||
|           } else { |  | ||||||
|             this.$message({ |  | ||||||
|               message: '请选择时间', |  | ||||||
|               type: 'warning' |  | ||||||
|             }); |  | ||||||
|           } |           } | ||||||
|  | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'export': | 				case 'export': | ||||||
| 					this.handleExport(); | 					this.handleExport(); | ||||||
| @@ -289,7 +285,7 @@ export default { | |||||||
|       this.dataListLoading = true; |       this.dataListLoading = true; | ||||||
|       this.urlOptions.getDataListURL(this.listQuery).then(response => { |       this.urlOptions.getDataListURL(this.listQuery).then(response => { | ||||||
|         this.tableData = response.data; |         this.tableData = response.data; | ||||||
|         this.total = response.data.total; |         this.listQuery.total = response.data.length; | ||||||
|         this.dataListLoading = false; |         this.dataListLoading = false; | ||||||
| 				this.showData = this.tableData | 				this.showData = this.tableData | ||||||
|       }); |       }); | ||||||
|   | |||||||
| @@ -11,13 +11,14 @@ | |||||||
| 			ref="search-bar" /> | 			ref="search-bar" /> | ||||||
| 		<el-skeleton v-if="initing" :rows="6" animated /> | 		<el-skeleton v-if="initing" :rows="6" animated /> | ||||||
| 		<!-- :span-method="mergeColumnHandler" --> | 		<!-- :span-method="mergeColumnHandler" --> | ||||||
|  | 		<div v-else :class="{ 'no-data-bg': !tableData || tableData.length == 0 }"> | ||||||
| 		<base-table | 		<base-table | ||||||
| 			v-else | 		v-if="tableData && tableData.length > 0" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| 			:table-data="tableData" | 			:table-data="tableData" | ||||||
| 			@emitFun="handleEmitFun"></base-table> | 			@emitFun="handleEmitFun" | ||||||
| 		<!-- :page="queryParams.pageNo" | 		/> | ||||||
| 			:limit="queryParams.pageSize" --> | 		</div> | ||||||
| 	</div> | 	</div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| @@ -65,10 +66,10 @@ export default { | |||||||
| 						label: times.slice(0, 10) + ' ' + times.slice(11), | 						label: times.slice(0, 10) + ' ' + times.slice(11), | ||||||
| 						align: 'center', | 						align: 'center', | ||||||
| 						children: [ | 						children: [ | ||||||
| 							{ prop: times + '_in', label: '投入数量', align: 'center' }, | 							{ prop: times + '_in', label: '投入数量' }, | ||||||
| 							{ prop: times + '_out', label: '产出数量', align: 'center' }, | 							{ prop: times + '_out', label: '产出数量' }, | ||||||
| 							{ prop: times + '_junk', label: '报废数量', align: 'center' }, | 							{ prop: times + '_junk', label: '报废数量' }, | ||||||
| 							{ prop: times + '_area', label: '产出面积', align: 'center' } | 							{ prop: times + '_area', label: '产出面积' } | ||||||
| 						] | 						] | ||||||
| 					} | 					} | ||||||
| 					this.arr.push(subprop) | 					this.arr.push(subprop) | ||||||
| @@ -149,14 +150,14 @@ export default { | |||||||
|           { |           { | ||||||
|             prop: 'proLineName', |             prop: 'proLineName', | ||||||
|             label: '生产线', |             label: '生产线', | ||||||
|             align: 'center', | 						fixed: 'left', | ||||||
| 						fixed: 'left' | 						showOverflowTooltip: true | ||||||
|           }, |           }, | ||||||
|           { |           { | ||||||
|             prop: 'spec', |             prop: 'spec', | ||||||
|             label: '产品规格', |             label: '产品规格', | ||||||
|             align: 'center', | 						fixed: 'left', | ||||||
| 						fixed: 'left' | 						showOverflowTooltip: true | ||||||
|           } |           } | ||||||
| 				] | 				] | ||||||
| 				this.buildProps(res.data.nameData); | 				this.buildProps(res.data.nameData); | ||||||
|   | |||||||
| @@ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: Do not edit |  * @Author: Do not edit | ||||||
|  * @Date: 2023-08-29 14:59:29 |  * @Date: 2023-08-29 14:59:29 | ||||||
|  * @LastEditTime: 2023-10-08 10:51:49 |  * @LastEditTime: 2023-10-16 15:19:04 | ||||||
|  * @LastEditors: DY |  * @LastEditors: DY | ||||||
|  * @Description:  |  * @Description:  | ||||||
| --> | --> | ||||||
| @@ -13,6 +13,7 @@ | |||||||
| 			ref="searchBarForm" | 			ref="searchBarForm" | ||||||
| 			@headBtnClick="buttonClick" /> | 			@headBtnClick="buttonClick" /> | ||||||
| 		<base-table | 		<base-table | ||||||
|  | 			v-if="showData.length" | ||||||
| 			class="right-aside" | 			class="right-aside" | ||||||
| 			v-loading="dataListLoading" | 			v-loading="dataListLoading" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| @@ -30,6 +31,7 @@ | |||||||
| 				:method-list="tableBtn" | 				:method-list="tableBtn" | ||||||
| 				@clickBtn="handleClick" /> | 				@clickBtn="handleClick" /> | ||||||
| 		</base-table> | 		</base-table> | ||||||
|  | 		<div v-else class="no-data-bg"></div> | ||||||
| 		<pagination | 		<pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -129,6 +131,7 @@ export default { | |||||||
| 			tableBtn: [], | 			tableBtn: [], | ||||||
| 			tableData: [], | 			tableData: [], | ||||||
| 			showData: [], | 			showData: [], | ||||||
|  | 			fileName: '', | ||||||
| 			formConfig: [ | 			formConfig: [ | ||||||
| 				{ | 				{ | ||||||
| 					type: 'select', | 					type: 'select', | ||||||
| @@ -187,7 +190,8 @@ export default { | |||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 					color: 'warning', | 					color: 'primary', | ||||||
|  | 					plain: true | ||||||
| 				} | 				} | ||||||
| 			], | 			], | ||||||
| 		}; | 		}; | ||||||
| @@ -200,6 +204,7 @@ export default { | |||||||
| 		test() { | 		test() { | ||||||
| 			var target = document.getElementsByClassName("right-aside")[0] | 			var target = document.getElementsByClassName("right-aside")[0] | ||||||
| 			target.style.background = '#FFFFFF' | 			target.style.background = '#FFFFFF' | ||||||
|  | 			var that = this | ||||||
| 			setTimeout(() => { | 			setTimeout(() => { | ||||||
| 				html2canvas(target).then(function(canvas) { | 				html2canvas(target).then(function(canvas) { | ||||||
| 						var contentWidth = canvas.width | 						var contentWidth = canvas.width | ||||||
| @@ -235,7 +240,7 @@ export default { | |||||||
| 							} | 							} | ||||||
| 						} | 						} | ||||||
|  |  | ||||||
| 						pdf.save('工段统计自动报表.pdf') | 						pdf.save(that.fileName + '工段统计.pdf') | ||||||
| 				}) | 				}) | ||||||
| 			}, 300) | 			}, 300) | ||||||
| 		}, | 		}, | ||||||
| @@ -258,7 +263,7 @@ export default { | |||||||
|       try { |       try { | ||||||
|         FileSaver.saveAs(new Blob([exportTableOut], { |         FileSaver.saveAs(new Blob([exportTableOut], { | ||||||
|           type: 'application/octet-stream' |           type: 'application/octet-stream' | ||||||
|         }), '工段统计自动报表.xlsx') |         }), this.fileName + '工段统计.xlsx') | ||||||
|       } catch (e) { |       } catch (e) { | ||||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) |         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||||
|       } |       } | ||||||
| @@ -307,6 +312,9 @@ export default { | |||||||
| 					this.listQuery.reportType = val.reportType ? val.reportType : undefined; | 					this.listQuery.reportType = val.reportType ? val.reportType : undefined; | ||||||
| 					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined; | 					this.listQuery.reportStartTime = val.timeVal ? [new Date(val.timeVal[0]).getTime()] : undefined; | ||||||
| 					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined; | 					this.listQuery.reportEndTime = val.timeVal ? [new Date(val.timeVal[1]).getTime()] : undefined; | ||||||
|  | 					if (val.timeVal && val.timeVal.length > 0) { | ||||||
|  | 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||||
|  |           } | ||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'export': | 				case 'export': | ||||||
| @@ -325,7 +333,7 @@ export default { | |||||||
| 					return item | 					return item | ||||||
| 				}); | 				}); | ||||||
| 				this.showData = this.tableData | 				this.showData = this.tableData | ||||||
|         this.total = response.data.total; |         this.listQuery.total = response.data.total; | ||||||
|         this.dataListLoading = false; |         this.dataListLoading = false; | ||||||
|       }); |       }); | ||||||
|     }, |     }, | ||||||
|   | |||||||
| @@ -3,15 +3,20 @@ | |||||||
| 		<search-bar | 		<search-bar | ||||||
| 			:formConfigs="formConfig" | 			:formConfigs="formConfig" | ||||||
| 			ref="searchBarForm" | 			ref="searchBarForm" | ||||||
|  | 			@select-changed="handleSearchBarChanged" | ||||||
| 			@headBtnClick="buttonClick" /> | 			@headBtnClick="buttonClick" /> | ||||||
| 		<base-table | 		<base-table | ||||||
|  | 			v-if="showData.length" | ||||||
| 			class="right-aside" | 			class="right-aside" | ||||||
| 			v-loading="dataListLoading" | 			v-loading="dataListLoading" | ||||||
| 			:table-props="tableProps" | 			:table-props="tableProps" | ||||||
| 			:table-data="showData" | 			:page="listQuery.pageNo" | ||||||
|  | 			:limit="listQuery.pageSize" | ||||||
| 			:selectWidth="55" | 			:selectWidth="55" | ||||||
|  | 			:table-data="showData" | ||||||
| 			@selection-change="selectChange" | 			@selection-change="selectChange" | ||||||
| 		/> | 		/> | ||||||
|  | 		<div v-else class="no-data-bg"></div> | ||||||
| 		<pagination | 		<pagination | ||||||
| 			:limit.sync="listQuery.pageSize" | 			:limit.sync="listQuery.pageSize" | ||||||
| 			:page.sync="listQuery.pageNo" | 			:page.sync="listQuery.pageNo" | ||||||
| @@ -45,38 +50,31 @@ import html2canvas from 'html2canvas' | |||||||
| const tableProps = [ | const tableProps = [ | ||||||
| 	{ | 	{ | ||||||
|     prop: 'proLineName', |     prop: 'proLineName', | ||||||
| 		label: '产线名称', | 		label: '产线名称' | ||||||
| 		align: 'center', |  | ||||||
| 	}, | 	}, | ||||||
|   { |   { | ||||||
|     prop: 'sectionName', |     prop: 'sectionName', | ||||||
|     label: '工段名称', |     label: '工段名称' | ||||||
|     align: 'center', |  | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     prop: 'inputNum', |     prop: 'inputNum', | ||||||
|     label: '进片数量/片', |     label: '进片数量/片' | ||||||
|     align: 'center', |  | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     prop: 'outputNum', |     prop: 'outputNum', | ||||||
|     label: '出片数量/片', |     label: '出片数量/片' | ||||||
|     align: 'center', |  | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     prop: 'lossNum', |     prop: 'lossNum', | ||||||
|     label: '损耗数量/片', |     label: '损耗数量/片' | ||||||
|     align: 'center', |  | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     prop: 'lossArea', |     prop: 'lossArea', | ||||||
|     label: '损耗面积/m²', |     label: '损耗面积/m²' | ||||||
|     align: 'center', |  | ||||||
|   }, |   }, | ||||||
|   { |   { | ||||||
|     prop: 'lossRate', |     prop: 'lossRate', | ||||||
|     label: '损耗比例/%', |     label: '损耗比例/%' | ||||||
|     align: 'center', |  | ||||||
|   } |   } | ||||||
| ]; | ]; | ||||||
|  |  | ||||||
| @@ -110,6 +108,7 @@ export default { | |||||||
|           param: 'proLineId', |           param: 'proLineId', | ||||||
| 					defaultSelect: '', | 					defaultSelect: '', | ||||||
| 					filterable: true, | 					filterable: true, | ||||||
|  | 					onchange: true, | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'select', | 					type: 'select', | ||||||
| @@ -132,15 +131,20 @@ export default { | |||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '搜索', | 					btnName: '查询', | ||||||
| 					name: 'search', | 					name: 'search', | ||||||
| 					color: 'primary', | 					color: 'primary', | ||||||
| 				}, | 				}, | ||||||
|  | 				{ | ||||||
|  | 					type: 'separate', | ||||||
|  | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					type: 'button', | 					type: 'button', | ||||||
| 					btnName: '导出', | 					btnName: '导出', | ||||||
| 					name: 'export', | 					name: 'export', | ||||||
| 				}, | 					color: 'primary', | ||||||
|  | 					plain: true | ||||||
|  | 				} | ||||||
| 			], | 			], | ||||||
| 		}; | 		}; | ||||||
| 	}, | 	}, | ||||||
| @@ -151,9 +155,39 @@ export default { | |||||||
|     // this.getDataList() |     // this.getDataList() | ||||||
| 	}, | 	}, | ||||||
| 	methods: { | 	methods: { | ||||||
|  | 		/** 根据产线获取工段 */ | ||||||
|  | 		async getWorksectionById(lineId) { | ||||||
|  | 			const { code, data } = await this.$axios({ | ||||||
|  | 				url: '/base/workshop-section/listByParentId', | ||||||
|  | 				method: 'get', | ||||||
|  | 				params: { | ||||||
|  | 					id: lineId, | ||||||
|  | 				}, | ||||||
|  | 			}); | ||||||
|  | 			if (code == 0) { | ||||||
|  | 				this.formConfig[1].selectOptions = data.map((item) => { | ||||||
|  | 					return { | ||||||
|  | 						name: item.name, | ||||||
|  | 						id: item.id, | ||||||
|  | 					}; | ||||||
|  | 				}); | ||||||
|  | 			} | ||||||
|  | 		}, | ||||||
|  | 		handleSearchBarChanged({ param, value }) { | ||||||
|  | 			if (!value) { | ||||||
|  | 				this.formConfig[1].selectOptions = []; | ||||||
|  | 				return; | ||||||
|  | 			} | ||||||
|  | 			switch (param) { | ||||||
|  | 				case 'proLineId': | ||||||
|  | 					this.getWorksectionById(value); | ||||||
|  | 					break; | ||||||
|  | 			} | ||||||
|  | 		}, | ||||||
| 		test() { | 		test() { | ||||||
| 			var target = document.getElementsByClassName("right-aside")[0] | 			var target = document.getElementsByClassName("right-aside")[0] | ||||||
| 			target.style.background = '#FFFFFF' | 			target.style.background = '#FFFFFF' | ||||||
|  | 			var that = this | ||||||
| 			setTimeout(() => { | 			setTimeout(() => { | ||||||
| 				html2canvas(target).then(function(canvas) { | 				html2canvas(target).then(function(canvas) { | ||||||
| 						var contentWidth = canvas.width | 						var contentWidth = canvas.width | ||||||
| @@ -189,7 +223,7 @@ export default { | |||||||
| 							} | 							} | ||||||
| 						} | 						} | ||||||
|  |  | ||||||
| 						pdf.save('工段统计数据查询报表.pdf') | 						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_工段统计.pdf') | ||||||
| 				}) | 				}) | ||||||
| 			}, 300) | 			}, 300) | ||||||
| 		}, | 		}, | ||||||
| @@ -212,7 +246,7 @@ export default { | |||||||
|       try { |       try { | ||||||
|         FileSaver.saveAs(new Blob([exportTableOut], { |         FileSaver.saveAs(new Blob([exportTableOut], { | ||||||
|           type: 'application/octet-stream' |           type: 'application/octet-stream' | ||||||
|         }), '工段统计数据查询报表.xlsx') |         }), this.fileName[0] + '-' + this.fileName[1] + '_工段统计.xlsx') | ||||||
|       } catch (e) { |       } catch (e) { | ||||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) |         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||||
|       } |       } | ||||||
| @@ -293,10 +327,9 @@ export default { | |||||||
|           this.listQuery.sectionId = val.sectionId ? val.sectionId : undefined |           this.listQuery.sectionId = val.sectionId ? val.sectionId : undefined | ||||||
|           this.listQuery.startTime = val.timeSlot ? new Date(val.timeSlot[0]).getTime() : undefined |           this.listQuery.startTime = val.timeSlot ? new Date(val.timeSlot[0]).getTime() : undefined | ||||||
|           this.listQuery.endTime = val.timeSlot ? new Date(val.timeSlot[1]).getTime() : undefined |           this.listQuery.endTime = val.timeSlot ? new Date(val.timeSlot[1]).getTime() : undefined | ||||||
| 					this.fileName[0] = val.timeSlot[0] | 					if (val.timeSlot && val.timeSlot.length > 0) { | ||||||
| 					this.fileName[1] = val.timeSlot[1] | 						this.fileName[0] = val.timeSlot[0].slice(0, 10) | ||||||
| 					console.log('wfjmmki文件名称', this.fileName) | 						this.fileName[1] = val.timeSlot[1].slice(0, 10) | ||||||
| 					if (val.timeSlot) { |  | ||||||
|             this.getDataList() |             this.getDataList() | ||||||
|           } else { |           } else { | ||||||
|             this.$message({ |             this.$message({ | ||||||
| @@ -315,7 +348,14 @@ export default { | |||||||
| 					this.getDataList(); | 					this.getDataList(); | ||||||
| 					break; | 					break; | ||||||
| 				case 'export': | 				case 'export': | ||||||
| 					this.handleExport(); | 					if (val.timeSlot && val.timeSlot.length > 0) { | ||||||
|  | 						this.handleExport(); | ||||||
|  |           } else { | ||||||
|  |             this.$message({ | ||||||
|  |               message: '请选择时间', | ||||||
|  |               type: 'warning' | ||||||
|  |             }); | ||||||
|  |           } | ||||||
| 					break; | 					break; | ||||||
| 				default: | 				default: | ||||||
| 					console.log(val); | 					console.log(val); | ||||||
|   | |||||||
| @@ -125,7 +125,31 @@ export default { | |||||||
|       this.$emit('submit', this.queryParams) |       this.$emit('submit', this.queryParams) | ||||||
|     }, |     }, | ||||||
|     exportData() { |     exportData() { | ||||||
|       this.$emit('exportD') |       let name | ||||||
|  |       if (this.queryParams.objId) { | ||||||
|  |         name = this.getObjName(this.objList, this.queryParams.objId) | ||||||
|  |       } else { | ||||||
|  |         this.$modal.msgWarning("对象不能为空") | ||||||
|  |         return false | ||||||
|  |       } | ||||||
|  |       this.$emit('exportD', {name: name}) | ||||||
|  |     }, | ||||||
|  |     // 递归取对象name | ||||||
|  |     getObjName(list, id) { | ||||||
|  |       let _this = this | ||||||
|  |       for (let i = 0; i < list.length; i++) { | ||||||
|  |         let a = list[i] | ||||||
|  |         if (a.id === id) { | ||||||
|  |           return a.name | ||||||
|  |         } else { | ||||||
|  |           if (a.children && a.children.length > 0) { | ||||||
|  |             let res = _this.getObjName(a.children, id) | ||||||
|  |             if (res) { | ||||||
|  |               return res | ||||||
|  |             } | ||||||
|  |           } | ||||||
|  |         } | ||||||
|  |       } | ||||||
|     }, |     }, | ||||||
|     transformTime(timeStamp) {// 本月最后一天 |     transformTime(timeStamp) {// 本月最后一天 | ||||||
|       let year = moment(timeStamp).format('YYYY') |       let year = moment(timeStamp).format('YYYY') | ||||||
|   | |||||||
| @@ -100,9 +100,10 @@ export default { | |||||||
|       } |       } | ||||||
|       this.chartData = this.list |       this.chartData = this.list | ||||||
|     }, |     }, | ||||||
|     exportData() { |     exportData(val) { | ||||||
|       if (this.list.length > 0) { |       if (this.list.length > 0) { | ||||||
|         var wb = XLSX.utils.table_to_book(document.querySelector(".yoy-out-table")) |         var wb = XLSX.utils.table_to_book(document.querySelector(".yoy-out-table")) | ||||||
|  |         let fileName = val.name + "同比分析.xlsx" | ||||||
|         var wbout = XLSX.write(wb, { |         var wbout = XLSX.write(wb, { | ||||||
|             bookType: "xlsx", |             bookType: "xlsx", | ||||||
|             bookSST: true, |             bookSST: true, | ||||||
| @@ -111,7 +112,7 @@ export default { | |||||||
|         try { |         try { | ||||||
|             FileSaver.saveAs( |             FileSaver.saveAs( | ||||||
|             new Blob([wbout], { type: "application/octet-stream" }), |             new Blob([wbout], { type: "application/octet-stream" }), | ||||||
|             "同比分析.xlsx" |             fileName | ||||||
|             ) |             ) | ||||||
|         } catch (e) { |         } catch (e) { | ||||||
|             if (typeof console !== "undefined") console.log(e, wbout); |             if (typeof console !== "undefined") console.log(e, wbout); | ||||||
|   | |||||||
| @@ -43,7 +43,7 @@ export default { | |||||||
| 					eq.okQuantity, | 					eq.okQuantity, | ||||||
| 					eq.nokQuantity, | 					eq.nokQuantity, | ||||||
| 					eq.totalQuantity, | 					eq.totalQuantity, | ||||||
| 					eq.passRate.toFixed(4), | 					eq.passRate?.toFixed(4), | ||||||
| 				]); | 				]); | ||||||
| 			}); | 			}); | ||||||
| 			return { | 			return { | ||||||
|   | |||||||
| @@ -29,7 +29,10 @@ | |||||||
| 							@emitFun="handleEmitFun"></base-table> | 							@emitFun="handleEmitFun"></base-table> | ||||||
| 					</el-tab-pane> | 					</el-tab-pane> | ||||||
| 					<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph"> | 					<el-tab-pane :label="'\u3000柱状图\u3000'" name="graph"> | ||||||
| 						<div v-if="activeName == 'graph'" class="graph" style="height: 40vh; display: flex; flex-direction: column;"> | 						<div | ||||||
|  | 							v-if="activeName == 'graph'" | ||||||
|  | 							class="graph" | ||||||
|  | 							style="height: 40vh; display: flex; flex-direction: column"> | ||||||
| 							<div class="blue-title">各设备加工数量</div> | 							<div class="blue-title">各设备加工数量</div> | ||||||
| 							<LineChart v-if="list && list.length" :list="list" /> | 							<LineChart v-if="list && list.length" :list="list" /> | ||||||
| 							<div v-else class="no-data-bg"></div> | 							<div v-else class="no-data-bg"></div> | ||||||
| @@ -87,6 +90,7 @@ export default { | |||||||
| 					rangeSeparator: '-', | 					rangeSeparator: '-', | ||||||
| 					startPlaceholder: '开始日期', | 					startPlaceholder: '开始日期', | ||||||
| 					endPlaceholder: '结束日期', | 					endPlaceholder: '结束日期', | ||||||
|  | 					defaultTime: ['00:00:00', '23:59:59'], | ||||||
| 					param: 'recordTime', | 					param: 'recordTime', | ||||||
| 					defaultSelect: [ | 					defaultSelect: [ | ||||||
| 						new Date(y, m, d) | 						new Date(y, m, d) | ||||||
| @@ -246,7 +250,9 @@ export default { | |||||||
| 	created() { | 	created() { | ||||||
| 		this.fillLineOptions(); | 		this.fillLineOptions(); | ||||||
| 		this.fillProductOptions(); | 		this.fillProductOptions(); | ||||||
| 		this.getList(); | 	}, | ||||||
|  | 	mounted() { | ||||||
|  | 		this.$refs['search-bar'].headBtnClick('search'); | ||||||
| 	}, | 	}, | ||||||
| 	methods: { | 	methods: { | ||||||
| 		handleTabClick(tab, event) { | 		handleTabClick(tab, event) { | ||||||
| @@ -307,12 +313,16 @@ export default { | |||||||
| 		}, | 		}, | ||||||
|  |  | ||||||
| 		handleSearchBarBtnClick(btn) { | 		handleSearchBarBtnClick(btn) { | ||||||
| 			console.log('handleSearchBarBtnClick', btn); | 			// debugger; | ||||||
| 			switch (btn.btnName) { | 			switch (btn.btnName) { | ||||||
| 				case 'search': | 				case 'search': | ||||||
| 					this.queryParams.lineId = btn.lineId; | 					this.queryParams.lineId = btn.lineId; | ||||||
| 					this.queryParams.productId = btn.productId; | 					this.queryParams.productId = btn.productId; | ||||||
| 					this.queryParams.recordTime = btn.recordTime ? btn.recordTime.map(time => moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss')) : null; | 					this.queryParams.recordTime = btn.recordTime | ||||||
|  | 						? btn.recordTime.map((time) => | ||||||
|  | 								moment(new Date(time)).format('YYYY-MM-DD HH:mm:ss') | ||||||
|  | 						  ) | ||||||
|  | 						: null; | ||||||
| 					this.$nextTick(() => { | 					this.$nextTick(() => { | ||||||
| 						this.getList(); | 						this.getList(); | ||||||
| 					}); | 					}); | ||||||
| @@ -388,7 +398,7 @@ export default { | |||||||
| 	font-size: 14px; | 	font-size: 14px; | ||||||
|  |  | ||||||
| 	&::before { | 	&::before { | ||||||
| 		content: ""; | 		content: ''; | ||||||
| 		position: absolute; | 		position: absolute; | ||||||
| 		left: 0; | 		left: 0; | ||||||
| 		top: 6px; | 		top: 6px; | ||||||
| @@ -398,5 +408,4 @@ export default { | |||||||
| 		background: #0b58ff; | 		background: #0b58ff; | ||||||
| 	} | 	} | ||||||
| } | } | ||||||
|  |  | ||||||
| </style> | </style> | ||||||
|   | |||||||
| @@ -14,7 +14,7 @@ import * as echarts from 'echarts'; | |||||||
|  *  |  *  | ||||||
|  * https://echarts.apache.org/zh/option.html#series-custom.renderItem.arguments.params |  * https://echarts.apache.org/zh/option.html#series-custom.renderItem.arguments.params | ||||||
|  */ |  */ | ||||||
| function renderItem(params, api) { } | // function renderItem(params, api) { } | ||||||
|  |  | ||||||
| export default class Gantt { | export default class Gantt { | ||||||
|     constructor(el) { |     constructor(el) { | ||||||
|   | |||||||
| @@ -74,7 +74,7 @@ | |||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import LineChart from './components/lineChart.vue'; | import LineChart from './components/lineChart.vue'; | ||||||
| import response from './response.json'; | // import response from './response.json'; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
| 	name: 'SGProduction', | 	name: 'SGProduction', | ||||||
|   | |||||||
| @@ -1,497 +0,0 @@ | |||||||
| <!DOCTYPE html> |  | ||||||
| <html lang="en"> |  | ||||||
|  |  | ||||||
| <head> |  | ||||||
| 	<meta charset="UTF-8" /> |  | ||||||
| 	<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |  | ||||||
| 	<title>Document</title> |  | ||||||
| </head> |  | ||||||
|  |  | ||||||
| <body> |  | ||||||
| 	<div id="app" style="width: 100vw; height: 80vh; background: #fff; margin: 24px"></div> |  | ||||||
|  |  | ||||||
| 	<script src="./echarts.js"></script> |  | ||||||
| 	<script> |  | ||||||
| 		function getStartTime(timestamp) { |  | ||||||
| 			return new Date(new Date(timestamp).toLocaleDateString()).getTime(); |  | ||||||
| 		} |  | ||||||
|  |  | ||||||
| 		function renderItem(params, api) { |  | ||||||
| 			var categoryIndex = api.value(0); |  | ||||||
| 			var start = api.coord([api.value(1), categoryIndex]); |  | ||||||
| 			var end = api.coord([api.value(2), categoryIndex]); |  | ||||||
| 			console.log(` |  | ||||||
|                     categoryIndex: ${categoryIndex}, |  | ||||||
|                     start: ${start}, |  | ||||||
|                     end: ${end}, |  | ||||||
|                     api.value0: ${api.value(0)} |  | ||||||
|                     api.value1: ${api.value(1)} |  | ||||||
|                     api.value2: ${api.value(2)} |  | ||||||
|                     params.coordSys: ${JSON.stringify(params.coordSys)} |  | ||||||
|                     api.size: ${api.size([0, 1])} |  | ||||||
|                     api.style(): ${JSON.stringify(api.style())} |  | ||||||
|                 `); |  | ||||||
|  |  | ||||||
| 			var height = api.size([0, 1])[1] * 2; |  | ||||||
| 			// 用一个矩形去截取另一个矩形 |  | ||||||
| 			var rectShape = echarts.graphic.clipRectByRect( |  | ||||||
| 				// 被截取矩形 |  | ||||||
| 				{ |  | ||||||
| 					x: start[0], |  | ||||||
| 					y: start[1] - height / 2, |  | ||||||
| 					width: end[0] - start[0], |  | ||||||
| 					height: height, |  | ||||||
| 				}, |  | ||||||
| 				// {x: 0, y: 0, width: 2000, height: 60 } // <== 也行... |  | ||||||
| 				// 截取矩形 |  | ||||||
| 				{ |  | ||||||
| 					// 截取掉grid以外的部分,实质是计算方块的偏移量 |  | ||||||
| 					x: params.coordSys.x, // {number} grid rect 的 x |  | ||||||
| 					// y: params.coordSys.y, // {number} grid rect 的 y |  | ||||||
| 					y: params.coordSys.y - 16, // {number} grid rect 的 y,并多减掉 16 个单位 |  | ||||||
| 					// width: end[0] - start[0], |  | ||||||
| 					width: params.coordSys.width, // {number} grid rect 的 width |  | ||||||
| 					height: params.coordSys.height, // {number} grid rect 的 height |  | ||||||
| 				} |  | ||||||
| 			); |  | ||||||
| 			console.log(`------------- ${JSON.stringify(rectShape)} -------------- `) |  | ||||||
| 			return ( |  | ||||||
| 				rectShape && { |  | ||||||
| 					type: 'rect', |  | ||||||
| 					transition: ['shape'], |  | ||||||
| 					shape: rectShape, |  | ||||||
| 					style: api.style(), |  | ||||||
| 				} |  | ||||||
| 			); |  | ||||||
| 		} |  | ||||||
|  |  | ||||||
| 		function getXaxisRange(startTime) { |  | ||||||
| 			return Array(24) |  | ||||||
| 				.fill(startTime) |  | ||||||
| 				.map((item, index) => { |  | ||||||
| 					return new Date(item + index * 3600 * 1000) |  | ||||||
| 						.toLocaleTimeString() |  | ||||||
| 						.split(':') |  | ||||||
| 						.slice(0, 2) |  | ||||||
| 						.join(':'); |  | ||||||
| 				}); |  | ||||||
| 		} |  | ||||||
|  |  | ||||||
| 		function getTodayStart(today) { |  | ||||||
| 			const [y, m, d] = [ |  | ||||||
| 				today.getFullYear(), |  | ||||||
| 				today.getMonth(), |  | ||||||
| 				today.getDate(), |  | ||||||
| 			]; |  | ||||||
| 			return new Date(y, m, d).getTime(); |  | ||||||
| 		} |  | ||||||
|  |  | ||||||
| 		/** 颜色配置 */ |  | ||||||
| 		const types = [ |  | ||||||
| 			{ name: '运行', color: '#288AFF' }, |  | ||||||
| 			{ name: '故障', color: '#FC9C91' }, |  | ||||||
| 			{ name: '计划停机', color: '#FFDC94' }, |  | ||||||
| 			{ name: '空白', color: '#F2F4F9' }, |  | ||||||
| 		]; |  | ||||||
|  |  | ||||||
| 		const option = { |  | ||||||
| 			tooltip: { |  | ||||||
| 				trigger: 'item', |  | ||||||
| 				axisPointer: { |  | ||||||
| 					type: 'none', |  | ||||||
| 					// label: { |  | ||||||
| 					// 	backgroundColor: '#6a7985', |  | ||||||
| 					// }, |  | ||||||
| 				}, |  | ||||||
| 				formatter: (params) => { |  | ||||||
| 					// console.log('formatter', params) |  | ||||||
| 					// return ` |  | ||||||
| 					// <div>${new Date(params[0].value[1]).toLocaleString()} ~ ${new Date(params[0].value[2]).toLocaleString()}</div> |  | ||||||
| 					// <div style="display: flex; justify-content: space-between; min-width: 128px; align-items: center;"> |  | ||||||
| 					//     <span>${params[0].seriesName}</span> |  | ||||||
| 					//     <span>${params[0].name}</span> |  | ||||||
| 					// </div> |  | ||||||
| 					// ` |  | ||||||
| 					return ` |  | ||||||
| 						<div style="display: flex; align-items: center; justify-content: space-between"> |  | ||||||
| 						<h1 style="font-size: 18px; font-weight: 600;">${params.seriesName}</h1> |  | ||||||
|                         <h2 style="font-size: 18px; font-weight: 400; letter-spacing: 1px;">${params.name} <span style="display: inline-block; margin-left: 8px; width: 12px; height: 12px; border-radius: 50%; background: ${params.color} "></span></h2> |  | ||||||
|                         </div> |  | ||||||
| 						<div>${new Date(params.value[1]).toLocaleString()} ~ ${new Date(params.value[2]).toLocaleString()}</div> |  | ||||||
|                         ` |  | ||||||
| 				} |  | ||||||
| 			}, |  | ||||||
| 			grid: [ |  | ||||||
| 				{ |  | ||||||
| 					id: 0, |  | ||||||
| 					top: 10, |  | ||||||
| 					left: 128, |  | ||||||
| 					right: 64, |  | ||||||
| 					height: 56, |  | ||||||
| 				}, |  | ||||||
| 				// { |  | ||||||
| 				// 	id: 1, |  | ||||||
| 				// 	top: 80, |  | ||||||
| 				// 	height: 56, |  | ||||||
| 				// }, |  | ||||||
| 				// ***************** 添加第二个grid ***************** |  | ||||||
| 				{ |  | ||||||
| 					id: 1, |  | ||||||
| 					top: 180, |  | ||||||
| 					left: 128, |  | ||||||
| 					right: 64, |  | ||||||
| 					height: 56 |  | ||||||
| 				} |  | ||||||
| 			], |  | ||||||
| 			xAxis: [ |  | ||||||
| 				{ |  | ||||||
| 					id: 'asdf', |  | ||||||
| 					gridIndex: 0, |  | ||||||
| 					axisTick: { |  | ||||||
| 						alignWithLabel: true, |  | ||||||
| 						inside: true, |  | ||||||
| 					}, |  | ||||||
| 					type: 'time', |  | ||||||
| 					min: getTodayStart(new Date()), // <=== |  | ||||||
| 					max: getStartTime(new Date().getTime() + 3600 * 24 * 1000), // <=== |  | ||||||
| 					splitNumber: 10, |  | ||||||
| 					axisLabel: { |  | ||||||
| 						margin: 12, |  | ||||||
| 						// rotate: -15, |  | ||||||
| 						formatter: function (val) { |  | ||||||
| 							return new Date(val) |  | ||||||
| 								.toLocaleTimeString() |  | ||||||
| 								.split(':') |  | ||||||
| 								.slice(0, 2) |  | ||||||
| 								.join(':'); |  | ||||||
| 						}, |  | ||||||
| 					}, |  | ||||||
| 					boundaryGap: false, |  | ||||||
| 					// data: getXaxisRange(getTodayStart(new Date())), |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
| 					id: 'asdff', |  | ||||||
| 					gridIndex: 0, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisLine: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 				// ***************** 添加第二个 xAxis ***************** |  | ||||||
| 				{ |  | ||||||
| 					id: 'asdfjk', |  | ||||||
| 					gridIndex: 1, |  | ||||||
| 					axisTick: { |  | ||||||
| 						alignWithLabel: true, |  | ||||||
| 						inside: true, |  | ||||||
| 					}, |  | ||||||
| 					type: 'time', |  | ||||||
| 					min: getTodayStart(new Date()), // <=== |  | ||||||
| 					max: getStartTime(new Date().getTime() + 3600 * 24 * 1000), // <=== |  | ||||||
| 					splitNumber: 10, |  | ||||||
| 					axisLabel: { |  | ||||||
| 						margin: 12, |  | ||||||
| 						// rotate: -15, |  | ||||||
| 						formatter: function (val) { |  | ||||||
| 							return new Date(val) |  | ||||||
| 								.toLocaleTimeString() |  | ||||||
| 								.split(':') |  | ||||||
| 								.slice(0, 2) |  | ||||||
| 								.join(':'); |  | ||||||
| 						}, |  | ||||||
| 					}, |  | ||||||
| 					boundaryGap: false, |  | ||||||
| 					// data: getXaxisRange(getTodayStart(new Date())), |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
| 					id: 'fjkd', |  | ||||||
| 					gridIndex: 1, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisLine: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 			], |  | ||||||
| 			yAxis: [ |  | ||||||
| 				// 主y轴 |  | ||||||
| 				{ |  | ||||||
| 					id: 0, |  | ||||||
| 					gridIndex: 0, |  | ||||||
| 					type: 'value', |  | ||||||
| 					splitLine: { show: false }, |  | ||||||
| 					name: '设备1', |  | ||||||
| 					nameLocation: 'center', |  | ||||||
| 					nameGap: 56, |  | ||||||
| 					nameRotate: 0, |  | ||||||
| 					nameTextStyle: { |  | ||||||
| 						fontSize: 18, |  | ||||||
| 					}, |  | ||||||
| 					axisLine: { |  | ||||||
| 						show: true, |  | ||||||
| 						lineStyle: {}, |  | ||||||
| 					}, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisTick: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 				// 辅y轴 |  | ||||||
| 				{ |  | ||||||
| 					id: 1, |  | ||||||
| 					gridIndex: 0, |  | ||||||
| 					type: 'value', |  | ||||||
| 					splitLine: { show: false }, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisTick: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 				// ***************** 添加第二个 yAxis ***************** |  | ||||||
| 				{ |  | ||||||
| 					id: 2, |  | ||||||
| 					gridIndex: 1, |  | ||||||
| 					type: 'value', |  | ||||||
| 					splitLine: { show: false }, |  | ||||||
| 					name: '设备1', |  | ||||||
| 					nameLocation: 'center', |  | ||||||
| 					nameGap: 56, |  | ||||||
| 					nameRotate: 0, |  | ||||||
| 					nameTextStyle: { |  | ||||||
| 						fontSize: 18, |  | ||||||
| 					}, |  | ||||||
| 					axisLine: { |  | ||||||
| 						show: true, |  | ||||||
| 						lineStyle: {}, |  | ||||||
| 					}, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisTick: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 				// 辅y轴 |  | ||||||
| 				{ |  | ||||||
| 					id: 3, |  | ||||||
| 					gridIndex: 1, |  | ||||||
| 					type: 'value', |  | ||||||
| 					splitLine: { show: false }, |  | ||||||
| 					axisLabel: { show: false }, |  | ||||||
| 					axisTick: { show: false }, |  | ||||||
| 				}, |  | ||||||
| 			], |  | ||||||
| 			series: [ |  | ||||||
| 				{ |  | ||||||
| 					// 沉默的背景 |  | ||||||
| 					xAxisIndex: 0, |  | ||||||
| 					yAxisIndex: 0, |  | ||||||
| 					type: 'custom', |  | ||||||
| 					renderItem: renderItem, |  | ||||||
| 					silent: true, |  | ||||||
| 					itemStyle: { |  | ||||||
| 						opacity: 0.8, |  | ||||||
| 					}, |  | ||||||
| 					encode: { |  | ||||||
| 						x: [1, 2], |  | ||||||
| 						y: 0, |  | ||||||
| 					}, |  | ||||||
| 					data: [ |  | ||||||
| 						{ |  | ||||||
| 							name: '无数据', |  | ||||||
| 							value: [0, 1696694400000, 1696780800000, 0], |  | ||||||
| 							tooltip: { show: false }, |  | ||||||
| 							// silent: true, |  | ||||||
| 							// animation: false, |  | ||||||
| 							// universalTransition: { enable: false }, |  | ||||||
| 							// hoverAnimation: false, |  | ||||||
| 							// selectMode: true, |  | ||||||
| 							// select: { disabled: true }, |  | ||||||
| 							// emphasis: { disabled: false, focus: 'none', itemStyle: { opacity: 0 } }, |  | ||||||
| 							// z: 0, |  | ||||||
| 							// zlevel: 0, |  | ||||||
| 							// emphasis: { disabled: true }, |  | ||||||
| 							itemStyle: { |  | ||||||
| 								color: '#ccc', |  | ||||||
| 								opacity: 0.3, |  | ||||||
| 							} |  | ||||||
| 						} |  | ||||||
| 					] |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
| 					name: '设备1', |  | ||||||
| 					xAxisIndex: 0, |  | ||||||
| 					yAxisIndex: 0, |  | ||||||
| 					type: 'custom', |  | ||||||
| 					renderItem: renderItem, |  | ||||||
| 					itemStyle: { |  | ||||||
| 						opacity: 0.8, |  | ||||||
| 					}, |  | ||||||
| 					encode: { |  | ||||||
| 						x: [1, 2], |  | ||||||
| 						y: 0, |  | ||||||
| 					}, |  | ||||||
| 					data: [ |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696694400000, 1696699400000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696730000000, 1696734040450, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '故障', |  | ||||||
| 							value: [0, 1696737040000, 1696754040450, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[1].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '计划停机', |  | ||||||
| 							value: [0, 1696755000000, 1696759000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[2].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696759000000, 1696769000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '计划停机', |  | ||||||
| 							value: [0, 1696769400000, 1696779000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[2].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 					], |  | ||||||
| 				}, |  | ||||||
| 				// ***************** 添加第二个设备 ***************** |  | ||||||
| 				{ |  | ||||||
| 					// 沉默的背景 |  | ||||||
| 					xAxisIndex: 2, |  | ||||||
| 					yAxisIndex: 2, |  | ||||||
| 					type: 'custom', |  | ||||||
| 					renderItem: renderItem, |  | ||||||
| 					silent: true, |  | ||||||
| 					itemStyle: { |  | ||||||
| 						opacity: 0.8, |  | ||||||
| 					}, |  | ||||||
| 					encode: { |  | ||||||
| 						x: [1, 2], |  | ||||||
| 						y: 0, |  | ||||||
| 					}, |  | ||||||
| 					data: [ |  | ||||||
| 						{ |  | ||||||
| 							name: '无数据', |  | ||||||
| 							value: [0, 1696694400000, 1696780800000, 0], |  | ||||||
| 							tooltip: { show: false }, |  | ||||||
| 							// silent: true, |  | ||||||
| 							// animation: false, |  | ||||||
| 							// universalTransition: { enable: false }, |  | ||||||
| 							// hoverAnimation: false, |  | ||||||
| 							// selectMode: true, |  | ||||||
| 							// select: { disabled: true }, |  | ||||||
| 							// emphasis: { disabled: false, focus: 'none', itemStyle: { opacity: 0 } }, |  | ||||||
| 							// z: 0, |  | ||||||
| 							// zlevel: 0, |  | ||||||
| 							// emphasis: { disabled: true }, |  | ||||||
| 							itemStyle: { |  | ||||||
| 								color: '#ccc', |  | ||||||
| 								opacity: 0.3, |  | ||||||
| 							} |  | ||||||
| 						} |  | ||||||
| 					] |  | ||||||
| 				}, |  | ||||||
| 				{ |  | ||||||
| 					name: '设备2', |  | ||||||
| 					xAxisIndex: 2, |  | ||||||
| 					yAxisIndex: 2, |  | ||||||
| 					type: 'custom', |  | ||||||
| 					renderItem: renderItem, |  | ||||||
| 					itemStyle: { |  | ||||||
| 						opacity: 0.8, |  | ||||||
| 					}, |  | ||||||
| 					encode: { |  | ||||||
| 						x: [1, 2], |  | ||||||
| 						y: 0, |  | ||||||
| 					}, |  | ||||||
| 					data: [ |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696694400000, 1696699400000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 							// showBackground: true, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696730000000, 1696734040450, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '故障', |  | ||||||
| 							value: [0, 1696737040000, 1696754040450, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[1].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '计划停机', |  | ||||||
| 							value: [0, 1696755000000, 1696759000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[2].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '运行', |  | ||||||
| 							value: [0, 1696759000000, 1696769000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[0].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 						{ |  | ||||||
| 							name: '计划停机', |  | ||||||
| 							value: [0, 1696769400000, 1696779000000, 0], |  | ||||||
| 							itemStyle: { |  | ||||||
| 								normal: { |  | ||||||
| 									color: types[2].color, |  | ||||||
| 								}, |  | ||||||
| 							}, |  | ||||||
| 						}, |  | ||||||
| 					], |  | ||||||
| 				}, |  | ||||||
| 			], |  | ||||||
| 		}; |  | ||||||
|  |  | ||||||
| 		const el = document.getElementById('app'); |  | ||||||
| 		const myChart = echarts.init(el); |  | ||||||
|  |  | ||||||
| 		console.log('mychart', myChart); |  | ||||||
| 		myChart.setOption(option); |  | ||||||
| 	</script> |  | ||||||
| </body> |  | ||||||
|  |  | ||||||
| </html> |  | ||||||
| @@ -1,81 +1,238 @@ | |||||||
| <template xmlns=""> | <template xmlns=""> | ||||||
|   <div class="container"> | 	<div class="container"> | ||||||
|     <div class="logo"></div> | 		<div class="logo"></div> | ||||||
|     <!-- 登录区域 --> | 		<!-- 登录区域 --> | ||||||
|     <div class="content"> | 		<div class="content"> | ||||||
|       <!-- 配图 --> | 			<!-- 配图 --> | ||||||
|       <div class="pic"></div> | 			<div class="pic"> | ||||||
|       <!-- 表单 --> | 				<div | ||||||
|       <div class="field"> | 					class="welcome" | ||||||
|         <!-- [移动端]标题 --> | 					style=" | ||||||
|         <h2 class="mobile-title"> | 						position: absolute; | ||||||
|           <h3 class="title">芋道后台管理系统</h3> | 						top: 15%; | ||||||
|         </h2> | 						left: 20%; | ||||||
|  | 						user-select: none; | ||||||
|  | 						display: flex; | ||||||
|  | 						flex-direction: column; | ||||||
|  | 						align-items: flex-start; | ||||||
|  | 					"> | ||||||
|  | 					<strong | ||||||
|  | 						style=" | ||||||
|  | 							letter-spacing: 1px; | ||||||
|  | 							font-family: Arial, Helvetica, sans-serif; | ||||||
|  | 							font-weight: 500; | ||||||
|  | 							font-size: 88px; | ||||||
|  | 						"> | ||||||
|  | 						<span style="color: #26b9de">Wel</span> | ||||||
|  | 						<span style="color: #fff">come</span> | ||||||
|  | 					</strong> | ||||||
|  | 					<p | ||||||
|  | 						style=" | ||||||
|  | 							margin: 0; | ||||||
|  | 							font-size: 26px; | ||||||
|  | 							letter-spacing: 1px; | ||||||
|  | 							color: #26b9de; | ||||||
|  | 							opacity: 75%; | ||||||
|  | 						"> | ||||||
|  | 						<span | ||||||
|  | 							style=" | ||||||
|  | 								display: inline-block; | ||||||
|  | 								height: 20px; | ||||||
|  | 								width: 20px; | ||||||
|  | 								margin-left: 8px; | ||||||
|  | 								margin-right: 12px; | ||||||
|  | 								border-radius: 100%; | ||||||
|  | 								background: #26b9de; | ||||||
|  | 							"></span> | ||||||
|  | 						产线生产监控系统 | ||||||
|  | 					</p> | ||||||
|  | 				</div> | ||||||
|  | 				<video | ||||||
|  | 					src="/static/videos/login.webm" | ||||||
|  | 					muted | ||||||
|  | 					autoplay | ||||||
|  | 					loop | ||||||
|  | 					style=" | ||||||
|  | 						user-select: none; | ||||||
|  | 						position: absolute; | ||||||
|  | 						top: 28%; | ||||||
|  | 						width: 100%; | ||||||
|  | 						height: 70%; | ||||||
|  | 					"></video> | ||||||
|  | 			</div> | ||||||
|  | 			<!-- 表单 --> | ||||||
|  | 			<div class="field"> | ||||||
|  | 				<!-- [移动端]标题 --> | ||||||
|  | 				<h2 class="mobile-title"> | ||||||
|  | 					<h3 class="title">中建材智能自动化研究院有限公司</h3> | ||||||
|  | 				</h2> | ||||||
|  | 				<h2 class="pc-title" style=""> | ||||||
|  | 					<h3 | ||||||
|  | 						class="title" | ||||||
|  | 						style=" | ||||||
|  | 							margin: 0; | ||||||
|  | 							margin-left: 32px; | ||||||
|  | 							font-weight: 400; | ||||||
|  | 							user-select: none; | ||||||
|  | 							color: #000; | ||||||
|  | 							font-size: 36px; | ||||||
|  | 							line-height: 54px; | ||||||
|  | 							letter-spacing: 2px; | ||||||
|  | 						"> | ||||||
|  | 						<img | ||||||
|  | 							src="../assets/logo/cnbm.png" | ||||||
|  | 							alt="cnbm_logo" | ||||||
|  | 							style=" | ||||||
|  | 								height: 48px; | ||||||
|  | 								width: 48px; | ||||||
|  | 								position: relative; | ||||||
|  | 								top: 12px; | ||||||
|  | 								right: 8px; | ||||||
|  | 							" /> | ||||||
|  | 						<span>中建材智能自动化研究院有限公司</span> | ||||||
|  | 					</h3> | ||||||
|  | 					<h3 | ||||||
|  | 						class="sub-title" | ||||||
|  | 						style=" | ||||||
|  | 							margin: 0; | ||||||
|  | 							margin-left: 32px; | ||||||
|  | 							font-weight: 400; | ||||||
|  | 							user-select: none; | ||||||
|  | 							color: #000; | ||||||
|  | 							font-size: 36px; | ||||||
|  | 							line-height: 54px; | ||||||
|  | 							letter-spacing: 2px; | ||||||
|  | 						"> | ||||||
|  | 						产线生产监控系统 | ||||||
|  | 					</h3> | ||||||
|  | 				</h2> | ||||||
|  |  | ||||||
|         <!-- 表单 --> | 				<!-- 表单 --> | ||||||
|         <div class="form-cont"> | 				<div class="form-cont"> | ||||||
|           <el-tabs class="form" v-model="loginForm.loginType" style=" float:none;"> | 					<el-tabs | ||||||
|             <el-tab-pane label="账号密码登录" name="uname"> | 						class="form" | ||||||
|             </el-tab-pane> | 						v-model="loginForm.loginType" | ||||||
|             <el-tab-pane label="短信验证码登录" name="sms"> | 						style="float: none"> | ||||||
|             </el-tab-pane> | 						<el-tab-pane label="账号密码登录" name="uname"></el-tab-pane> | ||||||
|           </el-tabs> | 						<el-tab-pane label="短信验证码登录" name="sms"></el-tab-pane> | ||||||
|           <div> | 					</el-tabs> | ||||||
|             <el-form ref="loginForm" :model="loginForm" :rules="LoginRules" class="login-form"> | 					<div style=""> | ||||||
|               <el-form-item prop="tenantName" v-if="tenantEnable"> | 						<el-form | ||||||
|                 <el-input v-model="loginForm.tenantName" type="text" auto-complete="off" placeholder='租户'> | 							ref="loginForm" | ||||||
|                   <svg-icon slot="prefix" icon-class="tree" class="el-input__icon input-icon" /> | 							:model="loginForm" | ||||||
|                 </el-input> | 							:rules="LoginRules" | ||||||
|               </el-form-item> | 							class="login-form"> | ||||||
|               <!-- 账号密码登录 --> | 							<el-form-item prop="tenantName" v-if="tenantEnable"> | ||||||
|               <div v-if="loginForm.loginType === 'uname'"> | 								<el-input | ||||||
|                 <el-form-item prop="username"> | 									v-model="loginForm.tenantName" | ||||||
|                   <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号"> | 									type="text" | ||||||
|                     <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" /> | 									auto-complete="off" | ||||||
|                   </el-input> | 									placeholder="租户"> | ||||||
|                 </el-form-item> | 									<!-- <svg-icon | ||||||
|                 <el-form-item prop="password"> | 										slot="prefix" | ||||||
|                   <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码" | 										icon-class="tree" | ||||||
|                     @keyup.enter.native="getCode"> | 										class="el-input__icon input-icon" /> --> | ||||||
|                     <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> | 								</el-input> | ||||||
|                   </el-input> | 							</el-form-item> | ||||||
|                 </el-form-item> | 							<!-- 账号密码登录 --> | ||||||
|                 <el-checkbox v-model="loginForm.rememberMe" style="margin:0 0 25px 0;">记住密码</el-checkbox> | 							<div v-if="loginForm.loginType === 'uname'"> | ||||||
|               </div> | 								<el-form-item prop="username"> | ||||||
|  | 									<el-input | ||||||
|  | 										v-model="loginForm.username" | ||||||
|  | 										type="text" | ||||||
|  | 										auto-complete="off" | ||||||
|  | 										placeholder="账号"> | ||||||
|  | 										<!-- <svg-icon | ||||||
|  | 											slot="prefix" | ||||||
|  | 											icon-class="user" | ||||||
|  | 											class="el-input__icon input-icon" /> --> | ||||||
|  | 									</el-input> | ||||||
|  | 								</el-form-item> | ||||||
|  | 								<el-form-item prop="password"> | ||||||
|  | 									<el-input | ||||||
|  | 										v-model="loginForm.password" | ||||||
|  | 										type="password" | ||||||
|  | 										auto-complete="off" | ||||||
|  | 										placeholder="密码" | ||||||
|  | 										@keyup.enter.native="getCode"> | ||||||
|  | 										<!-- <svg-icon | ||||||
|  | 											slot="prefix" | ||||||
|  | 											icon-class="password" | ||||||
|  | 											class="el-input__icon input-icon" /> --> | ||||||
|  | 									</el-input> | ||||||
|  | 								</el-form-item> | ||||||
|  | 								<el-checkbox | ||||||
|  | 									v-model="loginForm.rememberMe" | ||||||
|  | 									style="margin: 0 0 25px 0"> | ||||||
|  | 									记住密码 | ||||||
|  | 								</el-checkbox> | ||||||
|  | 							</div> | ||||||
|  |  | ||||||
|               <!-- 短信验证码登录 --> | 							<!-- 短信验证码登录 --> | ||||||
|               <div v-if="loginForm.loginType === 'sms'"> | 							<div v-if="loginForm.loginType === 'sms'"> | ||||||
|                 <el-form-item prop="mobile"> | 								<el-form-item prop="mobile"> | ||||||
|                   <el-input v-model="loginForm.mobile" type="text" auto-complete="off" placeholder="请输入手机号"> | 									<el-input | ||||||
|                     <svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" /> | 										v-model="loginForm.mobile" | ||||||
|                   </el-input> | 										type="text" | ||||||
|                 </el-form-item> | 										auto-complete="off" | ||||||
|                 <el-form-item prop="mobileCode"> | 										placeholder="请输入手机号"> | ||||||
|                   <el-input v-model="loginForm.mobileCode" type="text" auto-complete="off" placeholder="短信验证码" | 										<!-- <svg-icon | ||||||
|                     class="sms-login-mobile-code-prefix" @keyup.enter.native="handleLogin"> | 											slot="prefix" | ||||||
|                     <template> | 											icon-class="phone" | ||||||
|                       <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /> | 											class="el-input__icon input-icon" /> --> | ||||||
|                     </template> | 									</el-input> | ||||||
|                     <template slot="append"> | 								</el-form-item> | ||||||
|                       <span v-if="mobileCodeTimer <= 0" class="getMobileCode" @click="getSmsCode" | 								<el-form-item prop="mobileCode"> | ||||||
|                         style="cursor: pointer;">获取验证码</span> | 									<el-input | ||||||
|                       <span v-if="mobileCodeTimer > 0" class="getMobileCode">{{ mobileCodeTimer }}秒后可重新获取</span> | 										v-model="loginForm.mobileCode" | ||||||
|                     </template> | 										type="text" | ||||||
|                   </el-input> | 										auto-complete="off" | ||||||
|                 </el-form-item> | 										placeholder="短信验证码" | ||||||
|               </div> | 										class="sms-login-mobile-code-prefix" | ||||||
|  | 										@keyup.enter.native="handleLogin"> | ||||||
|  | 										<!-- <template> | ||||||
|  | 											<svg-icon | ||||||
|  | 												slot="prefix" | ||||||
|  | 												icon-class="password" | ||||||
|  | 												class="el-input__icon input-icon" /> | ||||||
|  | 										</template> --> | ||||||
|  | 										<template slot="suffix"> | ||||||
|  | 											<span | ||||||
|  | 												v-if="mobileCodeTimer <= 0" | ||||||
|  | 												class="getMobileCode" | ||||||
|  | 												@click="getSmsCode" | ||||||
|  | 												style=" | ||||||
|  | 													cursor: pointer; | ||||||
|  | 													color: #0b58ff; | ||||||
|  | 													font-size: 18px; | ||||||
|  | 													line-height: 66px; | ||||||
|  | 													padding-right: 12px; | ||||||
|  | 												"> | ||||||
|  | 												获取验证码 | ||||||
|  | 											</span> | ||||||
|  | 											<span v-if="mobileCodeTimer > 0" class="getMobileCode"> | ||||||
|  | 												{{ mobileCodeTimer }}秒后可重新获取 | ||||||
|  | 											</span> | ||||||
|  | 										</template> | ||||||
|  | 									</el-input> | ||||||
|  | 								</el-form-item> | ||||||
|  | 							</div> | ||||||
|  |  | ||||||
|               <!-- 下方的登录按钮 --> | 							<!-- 下方的登录按钮 --> | ||||||
|               <el-form-item style="width:100%;"> | 							<el-form-item id="button-form-item" style="width: 100%; margin-top: 32px"> | ||||||
|                 <el-button :loading="loading" size="medium" type="primary" style="width:100%;" | 								<el-button | ||||||
|                   @click.native.prevent="getCode"> | 									:loading="loading" | ||||||
|                   <span v-if="!loading">登 录</span> | 									size="medium" | ||||||
|                   <span v-else>登 录 中...</span> | 									type="primary" | ||||||
|                 </el-button> | 									style="width: 100%; height: 66px; font-size: 18px;" | ||||||
|               </el-form-item> | 									@click.native.prevent="getCode"> | ||||||
|  | 									<span v-if="!loading">登 录</span> | ||||||
|  | 									<span v-else>登 录 中...</span> | ||||||
|  | 								</el-button> | ||||||
|  | 							</el-form-item> | ||||||
|  |  | ||||||
|               <!--  社交登录 --> | 							<!--  社交登录 --> | ||||||
|               <!-- <el-form-item style="width:100%;"> | 							<!-- <el-form-item style="width:100%;"> | ||||||
|                   <div class="oauth-login" style="display:flex"> |                   <div class="oauth-login" style="display:flex"> | ||||||
|                     <div class="oauth-login-item" v-for="item in SysUserSocialTypeEnum" :key="item.type" @click="doSocialLogin(item)"> |                     <div class="oauth-login-item" v-for="item in SysUserSocialTypeEnum" :key="item.type" @click="doSocialLogin(item)"> | ||||||
|                       <img :src="item.img" height="25px" width="25px" alt="登录" > |                       <img :src="item.img" height="25px" width="25px" alt="登录" > | ||||||
| @@ -83,265 +240,305 @@ | |||||||
|                     </div> |                     </div> | ||||||
|                 </div> |                 </div> | ||||||
|               </el-form-item> --> |               </el-form-item> --> | ||||||
|             </el-form> | 						</el-form> | ||||||
|           </div> | 					</div> | ||||||
|         </div> | 				</div> | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|  |  | ||||||
|     <!-- 图形验证码 --> | 				<!-- footer --> | ||||||
|     <Verify ref="verify" :captcha-type="'blockPuzzle'" :img-size="{ width: '400px', height: '200px' }" | 				<div class="footer"> | ||||||
|       @success="handleLogin" /> | 					Copyright © 2023 中建材智能自动化院 All Rights Reserved. | ||||||
|  | 				</div> | ||||||
|  | 			</div> | ||||||
|  | 		</div> | ||||||
|  |  | ||||||
|     <!-- footer --> | 		<!-- 图形验证码 --> | ||||||
|     <div class="footer"> | 		<Verify | ||||||
|       Copyright © 2023 中建材智能自动化院 All Rights Reserved. | 			ref="verify" | ||||||
|     </div> | 			:captcha-type="'blockPuzzle'" | ||||||
|   </div> | 			:img-size="{ width: '400px', height: '200px' }" | ||||||
|  | 			@success="handleLogin" /> | ||||||
|  | 	</div> | ||||||
| </template> | </template> | ||||||
|  |  | ||||||
| <script> | <script> | ||||||
| import { sendSmsCode, socialAuthRedirect } from "@/api/login"; | import { sendSmsCode, socialAuthRedirect } from '@/api/login'; | ||||||
| import { getTenantIdByName } from "@/api/system/tenant"; | import { getTenantIdByName } from '@/api/system/tenant'; | ||||||
| import { SystemUserSocialTypeEnum } from "@/utils/constants"; | import { SystemUserSocialTypeEnum } from '@/utils/constants'; | ||||||
| import { getCaptchaEnable, getTenantEnable } from "@/utils/ruoyi"; | import { getCaptchaEnable, getTenantEnable } from '@/utils/ruoyi'; | ||||||
| import { | import { | ||||||
|   getPassword, | 	getPassword, | ||||||
|   getRememberMe, getTenantName, | 	getRememberMe, | ||||||
|   getUsername, | 	getTenantName, | ||||||
|   removePassword, removeRememberMe, removeTenantName, | 	getUsername, | ||||||
|   removeUsername, | 	removePassword, | ||||||
|   setPassword, setRememberMe, setTenantId, setTenantName, | 	removeRememberMe, | ||||||
|   setUsername | 	removeTenantName, | ||||||
| } from "@/utils/auth"; | 	removeUsername, | ||||||
|  | 	setPassword, | ||||||
|  | 	setRememberMe, | ||||||
|  | 	setTenantId, | ||||||
|  | 	setTenantName, | ||||||
|  | 	setUsername, | ||||||
|  | } from '@/utils/auth'; | ||||||
|  |  | ||||||
| import Verify from '@/components/Verifition/Verify'; | import Verify from '@/components/Verifition/Verify'; | ||||||
| import { resetUserPwd } from "@/api/system/user"; | import { resetUserPwd } from '@/api/system/user'; | ||||||
|  |  | ||||||
| export default { | export default { | ||||||
|   name: "Login", | 	name: 'Login', | ||||||
|   components: { | 	components: { | ||||||
|     Verify | 		Verify, | ||||||
|   }, | 	}, | ||||||
|   data() { | 	data() { | ||||||
|     return { | 		return { | ||||||
|       codeUrl: "", | 			codeUrl: '', | ||||||
|       captchaEnable: true, | 			captchaEnable: true, | ||||||
|       tenantEnable: true, | 			tenantEnable: true, | ||||||
|       mobileCodeTimer: 0, | 			mobileCodeTimer: 0, | ||||||
|       loginForm: { | 			loginForm: { | ||||||
|         loginType: "uname", | 				loginType: 'uname', | ||||||
|         username: "admin", | 				username: 'admin', | ||||||
|         password: "admin123", | 				password: 'admin123', | ||||||
|         captchaVerification: "", | 				captchaVerification: '', | ||||||
|         mobile: "", | 				mobile: '', | ||||||
|         mobileCode: "", | 				mobileCode: '', | ||||||
|         rememberMe: false, | 				rememberMe: false, | ||||||
|         tenantName: "技术中心", | 				tenantName: '技术中心', | ||||||
|       }, | 			}, | ||||||
|       scene: 21, | 			scene: 21, | ||||||
|  |  | ||||||
|       LoginRules: { | 			LoginRules: { | ||||||
|         username: [ | 				username: [ | ||||||
|           { required: true, trigger: "blur", message: "用户名不能为空" } | 					{ required: true, trigger: 'blur', message: '用户名不能为空' }, | ||||||
|         ], | 				], | ||||||
|         password: [ | 				password: [ | ||||||
|           { required: true, trigger: "blur", message: "密码不能为空" } | 					{ required: true, trigger: 'blur', message: '密码不能为空' }, | ||||||
|         ], | 				], | ||||||
|         mobile: [ | 				mobile: [ | ||||||
|           { required: true, trigger: "blur", message: "手机号不能为空" }, | 					{ required: true, trigger: 'blur', message: '手机号不能为空' }, | ||||||
|           { | 					{ | ||||||
|             validator: function (rule, value, callback) { | 						validator: function (rule, value, callback) { | ||||||
|               if (/^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/.test(value) === false) { | 							if ( | ||||||
|                 callback(new Error("手机号格式错误")); | 								/^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/.test( | ||||||
|               } else { | 									value | ||||||
|                 callback(); | 								) === false | ||||||
|               } | 							) { | ||||||
|             }, trigger: "blur" | 								callback(new Error('手机号格式错误')); | ||||||
|           } | 							} else { | ||||||
|         ], | 								callback(); | ||||||
|         tenantName: [ | 							} | ||||||
|           { required: true, trigger: "blur", message: "租户不能为空" }, | 						}, | ||||||
|           { | 						trigger: 'blur', | ||||||
|             validator: (rule, value, callback) => { | 					}, | ||||||
|               // debugger | 				], | ||||||
|               getTenantIdByName(value).then(res => { | 				tenantName: [ | ||||||
|                 const tenantId = res.data; | 					{ required: true, trigger: 'blur', message: '租户不能为空' }, | ||||||
|                 if (tenantId && tenantId >= 0) { | 					{ | ||||||
|                   // 设置租户 | 						validator: (rule, value, callback) => { | ||||||
|                   setTenantId(tenantId) | 							// debugger | ||||||
|                   callback(); | 							getTenantIdByName(value).then((res) => { | ||||||
|                 } else { | 								const tenantId = res.data; | ||||||
|                   callback('租户不存在'); | 								if (tenantId && tenantId >= 0) { | ||||||
|                 } | 									// 设置租户 | ||||||
|               }); | 									setTenantId(tenantId); | ||||||
|             }, | 									callback(); | ||||||
|             trigger: 'blur' | 								} else { | ||||||
|           } | 									callback('租户不存在'); | ||||||
|         ] | 								} | ||||||
|       }, | 							}); | ||||||
|       loading: false, | 						}, | ||||||
|       redirect: undefined, | 						trigger: 'blur', | ||||||
|       // 枚举 | 					}, | ||||||
|       SysUserSocialTypeEnum: SystemUserSocialTypeEnum, | 				], | ||||||
|     }; | 			}, | ||||||
|   }, | 			loading: false, | ||||||
|   created() { | 			redirect: undefined, | ||||||
|     // 租户开关 | 			// 枚举 | ||||||
|     this.tenantEnable = getTenantEnable(); | 			SysUserSocialTypeEnum: SystemUserSocialTypeEnum, | ||||||
|     if (this.tenantEnable) { | 		}; | ||||||
|       getTenantIdByName(this.loginForm.tenantName).then(res => { // 设置租户 | 	}, | ||||||
|         const tenantId = res.data; | 	created() { | ||||||
|         if (tenantId && tenantId >= 0) { | 		// 租户开关 | ||||||
|           setTenantId(tenantId) | 		this.tenantEnable = getTenantEnable(); | ||||||
|         } | 		if (this.tenantEnable) { | ||||||
|       }); | 			getTenantIdByName(this.loginForm.tenantName).then((res) => { | ||||||
|     } | 				// 设置租户 | ||||||
|     // 验证码开关 | 				const tenantId = res.data; | ||||||
|     this.captchaEnable = getCaptchaEnable(); | 				if (tenantId && tenantId >= 0) { | ||||||
|     // 重定向地址 | 					setTenantId(tenantId); | ||||||
|     this.redirect = this.$route.query.redirect ? decodeURIComponent(this.$route.query.redirect) : undefined; | 				} | ||||||
|     this.getCookie(); | 			}); | ||||||
|   }, | 		} | ||||||
|   methods: { | 		// 验证码开关 | ||||||
|     getCode() { | 		this.captchaEnable = getCaptchaEnable(); | ||||||
|       // 情况一,未开启:则直接登录 | 		// 重定向地址 | ||||||
|       if (!this.captchaEnable) { | 		this.redirect = this.$route.query.redirect | ||||||
|         this.handleLogin({}) | 			? decodeURIComponent(this.$route.query.redirect) | ||||||
|         return; | 			: undefined; | ||||||
|       } | 		this.getCookie(); | ||||||
|  | 	}, | ||||||
|  | 	methods: { | ||||||
|  | 		getCode() { | ||||||
|  | 			// 情况一,未开启:则直接登录 | ||||||
|  | 			if (!this.captchaEnable) { | ||||||
|  | 				this.handleLogin({}); | ||||||
|  | 				return; | ||||||
|  | 			} | ||||||
|  |  | ||||||
|       // 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录 | 			// 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录 | ||||||
|       // 弹出验证码 | 			// 弹出验证码 | ||||||
|       this.$refs.verify.show() | 			this.$refs.verify.show(); | ||||||
|     }, | 		}, | ||||||
|     getCookie() { | 		getCookie() { | ||||||
|       const username = getUsername(); | 			const username = getUsername(); | ||||||
|       const password = getPassword(); | 			const password = getPassword(); | ||||||
|       const rememberMe = getRememberMe(); | 			const rememberMe = getRememberMe(); | ||||||
|       const tenantName = getTenantName(); | 			const tenantName = getTenantName(); | ||||||
|       this.loginForm = { | 			this.loginForm = { | ||||||
|         ...this.loginForm, | 				...this.loginForm, | ||||||
|         username: username ? username : this.loginForm.username, | 				username: username ? username : this.loginForm.username, | ||||||
|         password: password ? password : this.loginForm.password, | 				password: password ? password : this.loginForm.password, | ||||||
|         rememberMe: rememberMe ? getRememberMe() : false, | 				rememberMe: rememberMe ? getRememberMe() : false, | ||||||
|         tenantName: tenantName ? tenantName : this.loginForm.tenantName, | 				tenantName: tenantName ? tenantName : this.loginForm.tenantName, | ||||||
|       }; | 			}; | ||||||
|     }, | 		}, | ||||||
|     handleLogin(captchaParams) { | 		handleLogin(captchaParams) { | ||||||
|       this.$refs.loginForm.validate(valid => { | 			this.$refs.loginForm.validate((valid) => { | ||||||
|         if (valid) { | 				if (valid) { | ||||||
|           this.loading = true; | 					this.loading = true; | ||||||
|           // 设置 Cookie | 					// 设置 Cookie | ||||||
|           if (this.loginForm.rememberMe) { | 					if (this.loginForm.rememberMe) { | ||||||
|             setUsername(this.loginForm.username) | 						setUsername(this.loginForm.username); | ||||||
|             setPassword(this.loginForm.password) | 						setPassword(this.loginForm.password); | ||||||
|             setRememberMe(this.loginForm.rememberMe) | 						setRememberMe(this.loginForm.rememberMe); | ||||||
|             setTenantName(this.loginForm.tenantName) | 						setTenantName(this.loginForm.tenantName); | ||||||
|           } else { | 					} else { | ||||||
|             removeUsername() | 						removeUsername(); | ||||||
|             removePassword() | 						removePassword(); | ||||||
|             removeRememberMe() | 						removeRememberMe(); | ||||||
|             removeTenantName() | 						removeTenantName(); | ||||||
|           } | 					} | ||||||
|           this.loginForm.captchaVerification = captchaParams.captchaVerification | 					this.loginForm.captchaVerification = | ||||||
|           // 发起登陆 | 						captchaParams.captchaVerification; | ||||||
|           // console.log("发起登录", this.loginForm); | 					// 发起登陆 | ||||||
|           this.$store.dispatch(this.loginForm.loginType === "sms" ? "SmsLogin" : "Login", this.loginForm).then(() => { | 					// console.log("发起登录", this.loginForm); | ||||||
|             this.$router.push({ path: this.redirect || "/" }).catch(() => { | 					this.$store | ||||||
|             }); | 						.dispatch( | ||||||
|           }).catch(() => { | 							this.loginForm.loginType === 'sms' ? 'SmsLogin' : 'Login', | ||||||
|             this.loading = false; | 							this.loginForm | ||||||
|           }); | 						) | ||||||
|         } | 						.then(() => { | ||||||
|       }); | 							this.$router.push({ path: this.redirect || '/' }).catch(() => {}); | ||||||
|     }, | 						}) | ||||||
|     async doSocialLogin(socialTypeEnum) { | 						.catch(() => { | ||||||
|       // 设置登录中 | 							this.loading = false; | ||||||
|       this.loading = true; | 						}); | ||||||
|       let tenant = false; | 				} | ||||||
|       if (this.tenantEnable) { | 			}); | ||||||
|         await this.$prompt('请输入租户名称', "提示", { | 		}, | ||||||
|           confirmButtonText: "确定", | 		async doSocialLogin(socialTypeEnum) { | ||||||
|           cancelButtonText: "取消" | 			// 设置登录中 | ||||||
|         }).then(async ({ value }) => { | 			this.loading = true; | ||||||
|           await getTenantIdByName(value).then(res => { | 			let tenant = false; | ||||||
|             const tenantId = res.data; | 			if (this.tenantEnable) { | ||||||
|             tenant = true | 				await this.$prompt('请输入租户名称', '提示', { | ||||||
|             if (tenantId && tenantId >= 0) { | 					confirmButtonText: '确定', | ||||||
|               setTenantId(tenantId) | 					cancelButtonText: '取消', | ||||||
|             } | 				}) | ||||||
|           }); | 					.then(async ({ value }) => { | ||||||
|         }).catch(() => { | 						await getTenantIdByName(value).then((res) => { | ||||||
|           // 取消登录按钮 loading状态 | 							const tenantId = res.data; | ||||||
|           this.loading = false; | 							tenant = true; | ||||||
|  | 							if (tenantId && tenantId >= 0) { | ||||||
|  | 								setTenantId(tenantId); | ||||||
|  | 							} | ||||||
|  | 						}); | ||||||
|  | 					}) | ||||||
|  | 					.catch(() => { | ||||||
|  | 						// 取消登录按钮 loading状态 | ||||||
|  | 						this.loading = false; | ||||||
|  |  | ||||||
|           return false | 						return false; | ||||||
|         }); | 					}); | ||||||
|       } else { | 			} else { | ||||||
|         tenant = true | 				tenant = true; | ||||||
|       } | 			} | ||||||
|       if (tenant) { | 			if (tenant) { | ||||||
|         // 计算 redirectUri | 				// 计算 redirectUri | ||||||
|         const redirectUri = location.origin + '/social-login?' | 				const redirectUri = | ||||||
|           + encodeURIComponent('type=' + socialTypeEnum.type + '&redirect=' + (this.redirect || "/")); // 重定向不能丢 | 					location.origin + | ||||||
|         // const redirectUri = 'http://127.0.0.1:48080/api/gitee/callback'; | 					'/social-login?' + | ||||||
|         // const redirectUri = 'http://127.0.0.1:48080/api/dingtalk/callback'; | 					encodeURIComponent( | ||||||
|         // 进行跳转 | 						'type=' + | ||||||
|         socialAuthRedirect(socialTypeEnum.type, encodeURIComponent(redirectUri)).then((res) => { | 							socialTypeEnum.type + | ||||||
|           // console.log(res.url); | 							'&redirect=' + | ||||||
|           window.location.href = res.data; | 							(this.redirect || '/') | ||||||
|         }); | 					); // 重定向不能丢 | ||||||
|       } | 				// const redirectUri = 'http://127.0.0.1:48080/api/gitee/callback'; | ||||||
|     }, | 				// const redirectUri = 'http://127.0.0.1:48080/api/dingtalk/callback'; | ||||||
|     /** ========== 以下为升级短信登录 ========== */ | 				// 进行跳转 | ||||||
|     getSmsCode() { | 				socialAuthRedirect( | ||||||
|       if (this.mobileCodeTimer > 0) return; | 					socialTypeEnum.type, | ||||||
|       this.$refs.loginForm.validate(valid => { | 					encodeURIComponent(redirectUri) | ||||||
|         if (!valid) return; | 				).then((res) => { | ||||||
|         sendSmsCode(this.loginForm.mobile, this.scene, this.loginForm.uuid, this.loginForm.code).then(res => { | 					// console.log(res.url); | ||||||
|           this.$modal.msgSuccess("获取验证码成功") | 					window.location.href = res.data; | ||||||
|           this.mobileCodeTimer = 60; | 				}); | ||||||
|           let msgTimer = setInterval(() => { | 			} | ||||||
|             this.mobileCodeTimer = this.mobileCodeTimer - 1; | 		}, | ||||||
|             if (this.mobileCodeTimer <= 0) { | 		/** ========== 以下为升级短信登录 ========== */ | ||||||
|               clearInterval(msgTimer); | 		getSmsCode() { | ||||||
|             } | 			if (this.mobileCodeTimer > 0) return; | ||||||
|           }, 1000); | 			this.$refs.loginForm.validate((valid) => { | ||||||
|         }); | 				if (!valid) return; | ||||||
|       }); | 				sendSmsCode( | ||||||
|     } | 					this.loginForm.mobile, | ||||||
|   } | 					this.scene, | ||||||
|  | 					this.loginForm.uuid, | ||||||
|  | 					this.loginForm.code | ||||||
|  | 				).then((res) => { | ||||||
|  | 					this.$modal.msgSuccess('获取验证码成功'); | ||||||
|  | 					this.mobileCodeTimer = 60; | ||||||
|  | 					let msgTimer = setInterval(() => { | ||||||
|  | 						this.mobileCodeTimer = this.mobileCodeTimer - 1; | ||||||
|  | 						if (this.mobileCodeTimer <= 0) { | ||||||
|  | 							clearInterval(msgTimer); | ||||||
|  | 						} | ||||||
|  | 					}, 1000); | ||||||
|  | 				}); | ||||||
|  | 			}); | ||||||
|  | 		}, | ||||||
|  | 	}, | ||||||
| }; | }; | ||||||
| </script> | </script> | ||||||
| <style lang="scss" scoped> | <style lang="scss" scoped> | ||||||
| @import "~@/assets/styles/login.scss"; | @import '~@/assets/styles/login.scss'; | ||||||
|  |  | ||||||
|  |  | ||||||
| .oauth-login { | .oauth-login { | ||||||
|   display: flex; | 	display: flex; | ||||||
|   align-items: center; | 	align-items: center; | ||||||
|   cursor: pointer; | 	cursor: pointer; | ||||||
| } | } | ||||||
|  |  | ||||||
| .oauth-login-item { | .oauth-login-item { | ||||||
|   display: flex; | 	display: flex; | ||||||
|   align-items: center; | 	align-items: center; | ||||||
|   margin-right: 10px; | 	margin-right: 10px; | ||||||
| } | } | ||||||
|  |  | ||||||
| .oauth-login-item img { | .oauth-login-item img { | ||||||
|   height: 25px; | 	height: 25px; | ||||||
|   width: 25px; | 	width: 25px; | ||||||
| } | } | ||||||
|  |  | ||||||
| .oauth-login-item span:hover { | .oauth-login-item span:hover { | ||||||
|   text-decoration: underline red; | 	text-decoration: underline red; | ||||||
|   color: red; | 	color: red; | ||||||
| } | } | ||||||
|  |  | ||||||
| .sms-login-mobile-code-prefix { | .sms-login-mobile-code-prefix { | ||||||
|   :deep(.el-input__prefix) { | 	:deep(.el-input__prefix) { | ||||||
|     top: 22%; | 		top: 22%; | ||||||
|   } | 	} | ||||||
| }</style> | } | ||||||
|  | </style> | ||||||
|   | |||||||
| @@ -77,7 +77,6 @@ export default { | |||||||
| 					label: '设备名称', | 					label: '设备名称', | ||||||
| 				}, | 				}, | ||||||
| 				{ | 				{ | ||||||
| 					width: 128, |  | ||||||
| 					prop: 'equipmentCode', | 					prop: 'equipmentCode', | ||||||
| 					label: '设备编码', | 					label: '设备编码', | ||||||
| 				}, | 				}, | ||||||
| @@ -117,6 +116,7 @@ export default { | |||||||
| 				{ | 				{ | ||||||
| 					_action: 'params-monitor', | 					_action: 'params-monitor', | ||||||
| 					label: '操作', | 					label: '操作', | ||||||
|  | 					width: 56, | ||||||
| 					subcomponent: { | 					subcomponent: { | ||||||
| 						props: ['injectData'], | 						props: ['injectData'], | ||||||
| 						render: function (h) { | 						render: function (h) { | ||||||
| @@ -124,10 +124,10 @@ export default { | |||||||
| 							return h( | 							return h( | ||||||
| 								'el-button', | 								'el-button', | ||||||
| 								{ | 								{ | ||||||
|  | 									class: 'iconfont icon-detail', | ||||||
| 									props: { type: 'text' }, | 									props: { type: 'text' }, | ||||||
| 									on: { | 									on: { | ||||||
| 										click: function () { | 										click: function () { | ||||||
| 											console.log('inejctdata', _this.injectData); |  | ||||||
| 											_this.$emit('emitData', { | 											_this.$emit('emitData', { | ||||||
| 												action: _this.injectData._action, | 												action: _this.injectData._action, | ||||||
| 												// value: _this.injectData.id, | 												// value: _this.injectData.id, | ||||||
| @@ -135,8 +135,8 @@ export default { | |||||||
| 											}); | 											}); | ||||||
| 										}, | 										}, | ||||||
| 									}, | 									}, | ||||||
| 								}, | 								} | ||||||
| 								'查看详情' | 								// '查看详情' | ||||||
| 							); | 							); | ||||||
| 						}, | 						}, | ||||||
| 					}, | 					}, | ||||||
|   | |||||||
| @@ -42,7 +42,7 @@ | |||||||
| 			<DialogForm | 			<DialogForm | ||||||
| 				v-if="open" | 				v-if="open" | ||||||
| 				ref="form" | 				ref="form" | ||||||
| 				:dataForm="form" | 				v-model="form" | ||||||
| 				:rows="[ | 				:rows="[ | ||||||
| 					[ | 					[ | ||||||
| 						{ | 						{ | ||||||
|   | |||||||
| @@ -40,7 +40,7 @@ | |||||||
| 			<DialogForm | 			<DialogForm | ||||||
| 				v-if="open" | 				v-if="open" | ||||||
| 				ref="form" | 				ref="form" | ||||||
| 				:dataForm="form" | 				v-model="form" | ||||||
| 				:rows="[ | 				:rows="[ | ||||||
| 					[ | 					[ | ||||||
| 						{ | 						{ | ||||||
|   | |||||||
| @@ -64,6 +64,7 @@ export default { | |||||||
| 				name: item.inspectionContent, | 				name: item.inspectionContent, | ||||||
| 				type: 'bar', | 				type: 'bar', | ||||||
| 				barCategoryGap: 12, | 				barCategoryGap: 12, | ||||||
|  | 				barWidth: 20, | ||||||
| 				data: [], | 				data: [], | ||||||
| 			}; | 			}; | ||||||
|  |  | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user