Compare commits
	
		
			28 Commits
		
	
	
		
			bb6bfc5ab6
			...
			master
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 9be57ad750 | |||
| f7313c5911 | |||
| a7e81ad8fb | |||
| 32cbf9076f | |||
| 9a411cc663 | |||
|  | 445a88e540 | ||
|  | 2b355aaf8f | ||
| f60a46ed1d | |||
| 2688896660 | |||
|  | 4a67e226e1 | ||
|  | 11ee0d6541 | ||
| 98b3237c9a | |||
|  | 46aaa47e07 | ||
| ca0f62b2eb | |||
| 5534104e87 | |||
| b72fe1bfed | |||
| f4493bde1c | |||
|  | d682ecc91c | ||
|  | 2b76ef7d23 | ||
| 9ec13b35b8 | |||
| 7acccd3de0 | |||
| e40f45a79a | |||
| 77083a84a1 | |||
| 9f53ea6981 | |||
| 8f634d012c | |||
| 03c573d5b2 | |||
| 348714edaf | |||
| 814fe4605a | 
							
								
								
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							
							
						
						
									
										2
									
								
								.env.dev
									
									
									
									
									
								
							| @@ -1,7 +1,7 @@ | ||||
| ### | ||||
|  # @Author: Do not edit | ||||
|  # @Date: 2023-08-29 09:40:39 | ||||
|  # @LastEditTime: 2023-09-18 10:44:07 | ||||
|  # @LastEditTime: 2023-10-16 09:22:52 | ||||
|  # @LastEditors: DY | ||||
|  # @Description:  | ||||
| ###  | ||||
|   | ||||
| @@ -75,7 +75,7 @@ | ||||
|     "vue-count-to": "1.0.13", | ||||
|     "vue-cropper": "0.5.8", | ||||
|     "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-router": "3.4.9", | ||||
|     "vue-video-player": "^5.0.2", | ||||
|   | ||||
| @@ -1,3 +1,10 @@ | ||||
| /* | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-08-28 15:30:53 | ||||
|  * @LastEditTime: 2023-10-13 17:08:33 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
|  */ | ||||
| import request from '@/utils/request' | ||||
|  | ||||
| // 创建产线目前生产产品表 主要为更新 | ||||
| @@ -35,11 +42,11 @@ export function getLineBindProductLog(id) { | ||||
| } | ||||
|  | ||||
| // 获得产线目前生产产品表 主要为更新分页 | ||||
| export function getLineBindProductLogPage(query) { | ||||
| export function getLineBindProductLogPage(data) { | ||||
|   return request({ | ||||
|     url: '/base/line-bind-product-log/page', | ||||
|     method: 'get', | ||||
|     params: query | ||||
|     method: 'post', | ||||
|     data: data | ||||
|   }) | ||||
| } | ||||
|  | ||||
|   | ||||
							
								
								
									
										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 | 
							
								
								
									
										
											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/tuple.png
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								src/assets/images/tuple.png
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| After Width: | Height: | Size: 944 B | 
| @@ -10,6 +10,8 @@ | ||||
| 		ref="form" | ||||
| 		:model="form" | ||||
| 		:label-width="`${labelWidth}px`" | ||||
| 		:size="size" | ||||
| 		:label-position="labelPosition" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex"> | ||||
| 			<el-col v-for="col in row" :key="col.label" :span="24 / row.length"> | ||||
| @@ -46,23 +48,6 @@ | ||||
| 						: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]" | ||||
| @@ -74,6 +59,43 @@ | ||||
| 						:key="col.key" | ||||
| 						:is="col.subcomponent" | ||||
| 						:inlineStyle="col.style"></component> | ||||
|  | ||||
| 					<div | ||||
| 						class="upload-area" | ||||
| 						:class="uploadOpen ? '' : 'height-48'" | ||||
| 						ref="uploadArea" | ||||
| 						v-if="col.upload"> | ||||
| 						<span class="close-icon" :class="uploadOpen ? 'open' : ''"> | ||||
| 							<el-button | ||||
| 								type="text" | ||||
| 								icon="el-icon-arrow-right" | ||||
| 								@click="handleFilesOpen" /> | ||||
| 						</span> | ||||
| 						<!-- :file-list="uploadedFileList" --> | ||||
| 						<el-upload | ||||
| 							class="upload-in-dialog" | ||||
| 							v-if="col.upload" | ||||
| 							:action="uploadUrl" | ||||
| 							:headers="uploadHeaders" | ||||
| 							:show-file-list="false" | ||||
| 							icon="el-icon-upload2" | ||||
| 							:before-upload="beforeUpload" | ||||
| 							:on-success="handleUploadSuccess" | ||||
| 							v-bind="col.bind"> | ||||
| 							<el-button size="mini" :disabled="col.bind?.disabled || false"> | ||||
| 								上传文件 | ||||
| 							</el-button> | ||||
| 							<div class="el-upload__tip" slot="tip" v-if="col.uploadTips"> | ||||
| 								{{ col.uploadTips || '只能上传jpg/png文件, 大小不超过2MB' }} | ||||
| 							</div> | ||||
| 						</el-upload> | ||||
|  | ||||
| 						<uploadedFile | ||||
| 							class="file" | ||||
| 							v-for="file in form[col.prop] || []" | ||||
| 							:file="file" | ||||
| 							@delete="handleDeleteFile(file)" /> | ||||
| 					</div> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| @@ -81,6 +103,9 @@ | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| import tupleImg from '@/assets/images/tuple.png'; | ||||
|  | ||||
| /** | ||||
|  * 找到最长的label | ||||
|  * @param {*} options | ||||
| @@ -99,6 +124,48 @@ function findMaxLabelWidth(rows) { | ||||
| 	return max; | ||||
| } | ||||
|  | ||||
| const uploadedFile = { | ||||
| 	name: 'UploadedFile', | ||||
| 	props: ['file'], | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleDelete() { | ||||
| 			console.log('emit delete event') | ||||
| 			this.$emit('delete', this.file); | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() {}, | ||||
| 	render: function (h) { | ||||
| 		return ( | ||||
| 			<div | ||||
| 				title={this.file.fileName} | ||||
| 				style={{ | ||||
| 					background: `url(${tupleImg}) no-repeat`, | ||||
| 					backgroundSize: '14px', | ||||
| 					backgroundPosition: '0 55%', | ||||
| 					paddingLeft: '20px', | ||||
| 					paddingRight: '24px', | ||||
| 					textOverflow: 'ellipsis', | ||||
| 					whiteSpace: 'nowrap', | ||||
| 					overflow: 'hidden', | ||||
| 					cursor: 'pointer', | ||||
| 					display: 'inline-block', | ||||
| 				}}> | ||||
| 				{this.file.fileName} | ||||
| 				<el-button | ||||
| 					type="text" | ||||
| 					icon="el-icon-close" | ||||
| 					style="float: right; position: relative; top: 2px; left: 8px; z-index: 100" | ||||
| 					class="dialog__upload_component__close" | ||||
| 					onClick={this.handleDelete} | ||||
| 				/> | ||||
| 			</div> | ||||
| 		); | ||||
| 	}, | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| @@ -106,7 +173,7 @@ export default { | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	components: { uploadedFile }, | ||||
| 	props: { | ||||
| 		rows: { | ||||
| 			type: Array, | ||||
| @@ -119,14 +186,26 @@ export default { | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		} | ||||
| 		}, | ||||
| 		labelPosition: { | ||||
| 			type: String, | ||||
| 			default: 'right', | ||||
| 		}, | ||||
| 		size: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			uploadOpen: false, | ||||
| 			form: {}, | ||||
| 			formLoading: true, | ||||
| 			optionListOf: {}, | ||||
| 			uploadedFileList: [], | ||||
| 			dataLoaded: false, | ||||
| 			uploadHeaders: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 上传有关的headers,url都是固定的 | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| @@ -136,16 +215,6 @@ export default { | ||||
| 			return max * 20; | ||||
| 			// return max * 20 + 'px'; | ||||
| 		}, | ||||
| 		form: { | ||||
| 			get() { | ||||
| 				// if (this.dataLoaded) return this.dataForm; | ||||
| 				// else return {} | ||||
| 				return this.dataForm; | ||||
| 			}, | ||||
| 			set(val) { | ||||
| 				console.log('set form', val); | ||||
| 			}, | ||||
| 		}, | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		rows: { | ||||
| @@ -158,6 +227,13 @@ export default { | ||||
| 			deep: true, | ||||
| 			immediate: false, | ||||
| 		}, | ||||
| 		dataForm: { | ||||
| 			handler(val) { | ||||
| 				this.form = JSON.parse(JSON.stringify(val)); | ||||
| 			}, | ||||
| 			deep: true, | ||||
| 			immediate: true, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		// 处理 options | ||||
| @@ -273,23 +349,27 @@ export default { | ||||
| 		beforeUpload() {}, | ||||
| 		// 上传前的验证规则可通过 bind 属性传入 | ||||
| 		handleUploadSuccess(response, file, fileList) { | ||||
| 			console.log( | ||||
| 				'[dialogForm:handleUploadSuccess]', | ||||
| 				response, | ||||
| 				file, | ||||
| 				fileList, | ||||
| 				this.form | ||||
| 			); | ||||
| 			// 保存原始文件名 | ||||
| 			if ('fileNames' in this.form) this.form.fileNames.push(file.name); | ||||
| 			// 保存完整地址 | ||||
| 			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data); | ||||
| 			this.form.files.push({ | ||||
| 				fileName: file.name, | ||||
| 				fileUrl: response.data, | ||||
| 				fileType: 2, | ||||
| 			}); | ||||
| 			this.$modal.msgSuccess('上传成功'); | ||||
| 			this.$emit('update', this.form); | ||||
| 		}, | ||||
|  | ||||
| 		getFileName(fileUrl) { | ||||
| 			return fileUrl.split('/').pop(); | ||||
| 		}, | ||||
|  | ||||
| 		handleFilesOpen() { | ||||
| 			this.uploadOpen = !this.uploadOpen; | ||||
| 		}, | ||||
|  | ||||
| 		handleDeleteFile(file) { | ||||
| 			this.form.files = this.form.files.filter(item => item.fileUrl != file.fileUrl); | ||||
| 			this.$emit('update', this.form); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
| @@ -299,4 +379,52 @@ export default { | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
|  | ||||
| .upload-area { | ||||
| 	// background: #ccc; | ||||
| 	// display: grid; | ||||
| 	// grid-auto-rows: 34px; | ||||
| 	// grid-template-columns: repeat(6, minmax(32px, max-content)); | ||||
| 	// gap: 8px; | ||||
| 	// align-items: center; | ||||
| 	position: relative; | ||||
| 	overflow: hidden; | ||||
| 	transition: height 0.3s ease-out; | ||||
| } | ||||
|  | ||||
| .upload-in-dialog { | ||||
| 	// display: inline-block; | ||||
| 	margin-right: 24px; | ||||
| 	// background: #ccc; | ||||
| 	position: relative; | ||||
| 	// top: -13px; | ||||
| 	float: left; | ||||
| } | ||||
|  | ||||
| .close-icon { | ||||
| 	// background: #ccc; | ||||
| 	position: absolute; | ||||
| 	top: 0; | ||||
| 	right: 12px; | ||||
| 	z-index: 100; | ||||
| 	transition: transform 0.3s ease-out; | ||||
| } | ||||
|  | ||||
| .close-icon.open { | ||||
| 	transform: rotateZ(90deg); | ||||
| } | ||||
| </style> | ||||
|  | ||||
| <style> | ||||
| .dialog__upload_component__close { | ||||
| 	color: #ccc; | ||||
| } | ||||
| .dialog__upload_component__close:hover { | ||||
| 	/* color: #777; */ | ||||
| 	color: red; | ||||
| } | ||||
|  | ||||
| .height-48 { | ||||
| 	height: 35px !important; | ||||
| } | ||||
| </style> | ||||
|   | ||||
| @@ -151,7 +151,7 @@ export default { | ||||
| 				name: '', | ||||
| 				plcParamName: '', | ||||
| 				unit: '', | ||||
| 				collection: '', | ||||
| 				collection: 1, | ||||
| 				minValue: '', | ||||
| 				maxValue: '', | ||||
| 				defaultValue: '', | ||||
| @@ -370,7 +370,7 @@ export default { | ||||
| 				name: '', | ||||
| 				plcParamName: '', | ||||
| 				unit: '', | ||||
| 				collection: '', | ||||
| 				collection: 1, | ||||
| 				minValue: '', | ||||
| 				maxValue: '', | ||||
| 				defaultValue: '', | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| <!-- | ||||
|  * @Author: zhp | ||||
|  * @Date: 2023-09-13 09:02:25 | ||||
|  * @LastEditTime: 2023-10-08 15:39:38 | ||||
|  * @LastEditTime: 2023-10-16 14:56:58 | ||||
|  * @LastEditors: DY | ||||
|  * @Description: | ||||
| --> | ||||
|   | ||||
| @@ -1,8 +1,12 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||
|     <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" /> | ||||
|     <balance-chart ref="lineChart" /> | ||||
|     <div v-if="tableData.length"> | ||||
|       <base-table v-loading="dataListLoading" :span-method="mergeColumnHandler" :table-props="tableProps" :table-data="tableData" /> | ||||
|       <SearchBar :formConfigs="[{ label: '产线平衡分析图', type: 'title' }]" /> | ||||
|       <balance-chart ref="lineChart" /> | ||||
|     </div> | ||||
|     <div v-else class="no-data-bg"></div> | ||||
|     <!-- <pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -89,7 +93,7 @@ export default { | ||||
|         }, | ||||
|         { | ||||
|           type: 'button', | ||||
|           btnName: '搜索', | ||||
|           btnName: '查询', | ||||
|           name: 'search', | ||||
|           color: 'primary', | ||||
|         } | ||||
| @@ -144,11 +148,6 @@ export default { | ||||
|       // this.listQuery.lineId = '1672847052717821953' | ||||
|       // this.listQuery.startTime = '1693497600000'; | ||||
|       // 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 => { | ||||
|         console.log(res) | ||||
|         let arr = [ | ||||
| @@ -228,11 +227,17 @@ export default { | ||||
|           this.listQuery.lineId = val.lineIds | ||||
|           this.listQuery.startTime = val.time ? String(new Date(val.time[0]).getTime()) : undefined; | ||||
|           this.listQuery.endTime = val.time ? String(new Date(val.time[1]).getTime()) : undefined; | ||||
|           if (val.time) { | ||||
|           if (val.time && val.lineIds) { | ||||
|             this.tableData = [] | ||||
|             this.xData = [] | ||||
|             this.yData = [] | ||||
|             this.tableProps = [] | ||||
|             this.spanArr = [] | ||||
|             this.timeList = [] | ||||
|             this.getData() | ||||
|           } else { | ||||
|             this.$message({ | ||||
|               message: '请选择时间', | ||||
|               message: '请选择产线和时间', | ||||
|               type: 'warning' | ||||
|             }); | ||||
|           } | ||||
|   | ||||
| @@ -1,8 +1,12 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | ||||
|     <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" /> | ||||
|     <line-chart ref="lineChart" /> | ||||
|     <div v-if="tableData.length"> | ||||
|       <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" /> | ||||
|       <SearchBar :formConfigs="[{ label: '产品产量对比图', type: 'title' }]" /> | ||||
|       <line-chart ref="lineChart" /> | ||||
|     </div> | ||||
|     <div v-else class="no-data-bg"></div> | ||||
|     <!-- <pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -72,7 +76,7 @@ export default { | ||||
| 				{ | ||||
| 					type: 'datePicker', | ||||
| 					label: '时间', | ||||
| 					dateType: 'datetime', | ||||
| 					dateType: 'month', | ||||
| 					format: 'yyyy-MM-dd', | ||||
| 					valueFormat: 'yyyy-MM-dd HH:mm:ss', | ||||
| 					rangeSeparator: '-', | ||||
| @@ -82,7 +86,7 @@ export default { | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '搜索', | ||||
| 					btnName: '查询', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				} | ||||
| @@ -101,6 +105,8 @@ export default { | ||||
| 			this.optionArrUrl.forEach((item, index) => { | ||||
| 				item(params).then((response) => { | ||||
| 					this.formConfig[index].selectOptions = response.data.list | ||||
|           // this.formConfig[0].defaultSelect = response.data.list[0].id | ||||
|           this.$set(this.formConfig[0], 'defaultSelect', response.data.list[0].id) | ||||
| 				}); | ||||
| 			}); | ||||
|     }, | ||||
| @@ -112,11 +118,13 @@ export default { | ||||
|         let arr = [ | ||||
|           	{ | ||||
|               prop: 'lineName', | ||||
|           		label: '产线' | ||||
|           		label: '产线', | ||||
|               fixed: 'left' | ||||
|           	}, | ||||
|             { | ||||
|               prop: 'sum', | ||||
|               label: '合计' | ||||
|               label: '合计', | ||||
|               fixed: 'left' | ||||
|             }, | ||||
|             { | ||||
|               prop: res.data ? res.data.nameData[0].name : undefined, | ||||
| @@ -220,7 +228,6 @@ export default { | ||||
|       }); | ||||
|     }, | ||||
|     buttonClick(val) { | ||||
|       // console.log(val) | ||||
| 			switch (val.btnName) { | ||||
|         case 'search': | ||||
|           this.listQuery.lineIds = val.lineIds ? val.lineIds :undefined | ||||
|   | ||||
							
								
								
									
										412
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										412
									
								
								src/views/core/base/equipment/components/AssetsUpload.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,412 @@ | ||||
| <!--  | ||||
|     filename: AssetsUpload.vue | ||||
|     author: liubin | ||||
|     date: 2023-10-12 16:40:14 | ||||
|     description: 上传资料/图片 组件 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<div class="assets-upload"> | ||||
| 		<section class="operations"> | ||||
| 			<el-button type="text" class="expand-btn" @click="expand = !expand"> | ||||
| 				<i class="el-icon-folder-opened" v-if="expand"></i> | ||||
| 				<i class="el-icon-folder" v-else></i> | ||||
| 				展开 | ||||
| 			</el-button> | ||||
| 			<!-- <div class="preview-btn"> | ||||
| 				<i class="el-icon-view"></i> | ||||
| 				预览 | ||||
| 			</div> --> | ||||
| 		</section> | ||||
| 		<section class="file-area"> | ||||
| 			<el-upload | ||||
| 				class="equipment-upload" | ||||
| 				:disabled="disabled" | ||||
| 				drag | ||||
| 				:action="uploadUrl" | ||||
| 				:headers="headers" | ||||
| 				multiple | ||||
| 				:show-file-list="false" | ||||
| 				:before-upload="beforeUpload" | ||||
| 				:on-success="handleSuccess"> | ||||
| 				<i class="el-icon-upload"></i> | ||||
| 				<div class="el-upload__text"> | ||||
| 					<span>将文件拖到此处或</span> | ||||
| 					<em>点击上传</em> | ||||
| 				</div> | ||||
| 				<div class="el-upload__tip" slot="tip"> | ||||
| 					{{ | ||||
| 						isPicMode ? '仅支持上传 .jpg .png 格式文件, 且' : '' | ||||
| 					}}文件大小不超过2MB | ||||
| 				</div> | ||||
| 			</el-upload> | ||||
| 			<!-- <div | ||||
| 				class="file-list__item" | ||||
| 				v-for="n in 9" | ||||
| 				:key="n" | ||||
| 				:style="{ | ||||
| 					display: n > 4 && !expand ? 'none' : 'block', | ||||
| 				}" | ||||
| 				:data-name="n" | ||||
| 				:class="{ 'default-icon': !isPicMode }"> | ||||
| 				<i class="el-icon-delete"></i> | ||||
| 			</div> --> | ||||
| 			<div | ||||
| 				class="file-list__item" | ||||
| 				v-for="(file, index) in files" | ||||
| 				:key="file.fileName" | ||||
| 				:style="{ | ||||
| 					display: index > 3 && !expand ? 'none' : 'block', | ||||
| 					background: isPicMode | ||||
| 						? `url(${file.fileUrl}) no-repeat` | ||||
| 						: `url(${defaultBg}) no-repeat`, | ||||
| 					backgroundSize: isPicMode ? '100% 100%' : '64px', | ||||
| 					backgroundPosition: isPicMode ? '0% 0%' : 'center', | ||||
| 				}" | ||||
| 				:data-name="file.fileName"> | ||||
| 				<el-button | ||||
| 					v-if="!disabled" | ||||
| 					type="text" | ||||
| 					class="el-icon-delete" | ||||
| 					style="padding: 0" | ||||
| 					@click="(e) => handleDelete(file)" /> | ||||
| 			</div> | ||||
| 		</section> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| import defaultBg from '../../../../../assets/images/default-file-icon.png'; | ||||
|  | ||||
| function checkSize(file, message) { | ||||
| 	const isLt2M = file.size / 1024 / 1024 < 2; | ||||
| 	if (!isLt2M) { | ||||
| 		message.error('上传文件大小不能超过 2MB!'); | ||||
| 	} | ||||
| 	return isLt2M; | ||||
| } | ||||
|  | ||||
| function checkPic(file, message) { | ||||
| 	const isJPG = file.type === 'image/jpeg'; | ||||
| 	const isPNG = file.type === 'image/png'; | ||||
| 	const isPic = isJPG || isPNG; | ||||
| 	if (!isPic) { | ||||
| 		message.error('上传图片只能是 JPG/PNG 格式!'); | ||||
| 	} | ||||
| 	return isPic; | ||||
| } | ||||
|  | ||||
| export default { | ||||
| 	name: 'AssetsUpload', | ||||
| 	components: {}, | ||||
| 	model: { | ||||
| 		prop: 'dataSource', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	props: { | ||||
| 		type: { | ||||
| 			type: String, | ||||
| 			default: 'image', | ||||
| 		}, | ||||
| 		dataSource: { | ||||
| 			type: Array, | ||||
| 			default: () => [], | ||||
| 		}, | ||||
| 		equipmentId: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 		isPicMode: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	emits: ['update-filelist'], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			defaultBg, | ||||
| 			expand: false, | ||||
| 			headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部 | ||||
| 			fileList: [], | ||||
| 			uploadUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', | ||||
| 			files: [ | ||||
| 				// 服务器返回的结构 | ||||
| 				// { | ||||
| 				// 	fileName: 'sf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://hbimg.b0.upaiyun.com/cc7475787bd08ed926b68eaf53fa1f2c5473259115e3c-gJdObd_fw658', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'sddf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: 'https://img0.sc115.com/wm/xqx/pic1/1501xofo4ssolji.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'jjj.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013081823/1-130QR34544.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdfasdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://hbimg.b0.upaiyun.com/8f6bced5f2e38d3a021b2c48d5a98dfb6317e3e12c6a0-QmhJ5v_fw658', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdkj.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013013021/1-130130212034.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'lkasjdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013072122/1-130H1223057.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'asdf.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://img.1ppt.com/uploads/allimg/1212/1-1212101ZH5A2.jpg', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	fileName: 'afdffff.docs', | ||||
| 				// 	fileType: 'asset', | ||||
| 				// 	fileUrl: | ||||
| 				// 		'https://www.mms591.com/www.mms591.com-photo/2013051721/1-13051H11945.jpg', | ||||
| 				// }, | ||||
| 			], | ||||
| 			updateTimer: null, | ||||
| 		}; | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		dataSource: { | ||||
| 			handler(val) { | ||||
| 				this.files = JSON.parse(JSON.stringify(val)); | ||||
| 			}, | ||||
| 			immediate: true, | ||||
| 			deep: true, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() {}, | ||||
| 	methods: { | ||||
| 		// handle success, per file! | ||||
| 		handleSuccess(response, file, fileList) { | ||||
| 			this.$notify({ | ||||
| 				title: '成功', | ||||
| 				message: '上传成功! 点击确认保存上传结果', | ||||
| 				type: 'success', | ||||
| 			}); | ||||
| 			if ( | ||||
| 				response == null || | ||||
| 				!('data' in response) || | ||||
| 				response.data == null || | ||||
| 				response.data.trim() == '' | ||||
| 			) { | ||||
| 				this.$message.error('上传出错了!'); | ||||
| 				return; | ||||
| 			} | ||||
| 			this.files.push({ | ||||
| 				fileName: file.name, | ||||
| 				fileUrl: response.data, | ||||
| 				fileType: this.isPicMode ? 1 : 2, | ||||
| 			}); | ||||
| 			// debugger; | ||||
|  | ||||
| 			// 延时更新 | ||||
| 			if (this.updateTimer) { | ||||
| 				clearTimeout(this.updateTimer); | ||||
| 			} | ||||
| 			this.updateTimer = setTimeout(() => { | ||||
| 				console.log('[AssetsUpload] 更新上传列表'); | ||||
| 				this.emitFilelist(); | ||||
| 				clearTimeout(this.updateTimer); | ||||
| 				this.updateTimer = null; | ||||
| 			}, 500); | ||||
| 		}, | ||||
|  | ||||
| 		emitFilelist() { | ||||
| 			this.$emit('update', this.files); | ||||
| 		}, | ||||
|  | ||||
| 		handleRemove(file, fileList) { | ||||
| 			debugger; | ||||
| 		}, | ||||
|  | ||||
| 		handleDelete(file) { | ||||
| 			// fileName fileType 都可能一样,但 fileUrl 一定不一样 | ||||
| 			this.files = this.files.filter((item) => item.fileUrl != file.fileUrl); | ||||
| 			this.$notify({ | ||||
| 				title: '成功', | ||||
| 				message: '删除成功! 需点击确认保存删除结果', | ||||
| 				type: 'success', | ||||
| 			}); | ||||
| 			this.emitFilelist(); | ||||
| 		}, | ||||
|  | ||||
| 		beforeUpload(file) { | ||||
| 			if (this.isPicMode) { | ||||
| 				return checkPic(file, this.$message) && checkSize(file, this.$message); | ||||
| 			} | ||||
| 			return checkSize(file, this.$message); | ||||
| 		}, | ||||
|  | ||||
| 		handleUpload() { | ||||
| 			switch (this.type) { | ||||
| 				case 'image': | ||||
| 					break; | ||||
| 				case 'asset': | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		updateFileList(appendFilelist) { | ||||
| 			// Array | ||||
| 			this.$emit('update-filelist', this.appendFilelist); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .assets-upload { | ||||
| 	position: relative; | ||||
| } | ||||
|  | ||||
| .operations { | ||||
| 	position: absolute; | ||||
| 	top: -36px; | ||||
| 	right: 0; | ||||
| 	display: flex; | ||||
| 	align-items: center; | ||||
| } | ||||
|  | ||||
| .expand-btn, | ||||
| .preview-btn { | ||||
| 	font-size: 14px; | ||||
| 	line-height: 1.2; | ||||
| 	display: inline-block; | ||||
| 	padding-left: 20px; | ||||
| 	cursor: pointer; | ||||
| 	z-index: 1000; | ||||
| } | ||||
|  | ||||
| .expand-btn { | ||||
| 	margin-right: 12px; | ||||
| } | ||||
|  | ||||
| .preview-btn { | ||||
| 	color: #ccc; | ||||
| } | ||||
|  | ||||
| .expand-btn, | ||||
| .preview-btn:hover, | ||||
| .preview-btn.active { | ||||
| 	// color: #0042d0; | ||||
| 	color: #0b58ff; | ||||
| } | ||||
|  | ||||
| :deep(.equipment-upload) { | ||||
| 	background: #ccc4; | ||||
| 	.el-upload-dragger { | ||||
| 		width: 188px; | ||||
| 		height: 128px; | ||||
| 	} | ||||
|  | ||||
| 	.el-icon-upload { | ||||
| 		margin: 12px 0; | ||||
| 		font-size: 48px; | ||||
| 	} | ||||
|  | ||||
| 	.el-upload__text { | ||||
| 		font-size: 12px; | ||||
| 		line-height: 2px; | ||||
| 		display: flex; | ||||
| 		flex-direction: column; | ||||
|  | ||||
| 		em { | ||||
| 			margin-top: 12px; | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	.el-upload__tip { | ||||
| 		font-size: 12px; | ||||
| 		line-height: 1.5; | ||||
| 		color: #d1d1d1; | ||||
| 		margin: 0 0 12px; | ||||
| 		transform: translateY(-12px); | ||||
| 		user-select: none; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .file-list { | ||||
| 	padding: 12px; | ||||
| 	border: 1px solid #ccc; | ||||
| } | ||||
|  | ||||
| // custom | ||||
| .file-area { | ||||
| 	display: grid; | ||||
| 	grid-template-columns: repeat(5, 188px); | ||||
| 	grid-auto-rows: 128px; | ||||
| 	gap: 24px 18px; | ||||
| 	place-content: center; | ||||
| } | ||||
|  | ||||
| .file-list__item { | ||||
| 	background-color: #fff; | ||||
| 	border: 1px dashed #d9d9d9; | ||||
| 	border-radius: 6px; | ||||
| 	-webkit-box-sizing: border-box; | ||||
| 	box-sizing: border-box; | ||||
| 	text-align: center; | ||||
| 	cursor: pointer; | ||||
| 	position: relative; | ||||
| 	// overflow: hidden; | ||||
|  | ||||
| 	&:hover { | ||||
| 		.el-icon-delete { | ||||
| 			display: block; | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	.el-icon-delete { | ||||
| 		color: #ccc; | ||||
| 		position: absolute; | ||||
| 		top: 8px; | ||||
| 		right: 8px; | ||||
| 		display: none; | ||||
|  | ||||
| 		&:hover { | ||||
| 			color: rgb(210, 41, 41); | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
|  | ||||
| .file-list__item:hover { | ||||
| 	border-color: #0b58ff; | ||||
| } | ||||
|  | ||||
| .file-list__item::after { | ||||
| 	content: attr(data-name); | ||||
| 	position: absolute; | ||||
| 	left: 0; | ||||
| 	bottom: -26px; | ||||
| 	font-size: 14px; | ||||
| 	line-height: 2; | ||||
| 	color: #616161; | ||||
| } | ||||
|  | ||||
| .default-icon { | ||||
| 	background: url(../../../../../assets/images/default-file-icon.png) no-repeat; | ||||
| 	background-position: center; | ||||
| 	background-size: 64px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										313
									
								
								src/views/core/base/equipment/components/DialogForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										313
									
								
								src/views/core/base/equipment/components/DialogForm.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,313 @@ | ||||
| <!--  | ||||
|     filename: dialogForm.vue | ||||
|     author: liubin | ||||
|     date: 2023-08-15 10:32:36 | ||||
|     description: 弹窗的表单组件 | ||||
| --> | ||||
|  | ||||
| <template> | ||||
| 	<el-form | ||||
| 		ref="form" | ||||
| 		:model="form" | ||||
| 		:label-width="`${labelWidth}px`" | ||||
| 		:size="size" | ||||
| 		:label-position="labelPosition" | ||||
| 		v-loading="formLoading"> | ||||
| 		<el-row :gutter="20" v-for="(row, rindex) in rows" :key="rindex"> | ||||
| 			<el-col v-for="col in row" :key="col.label" :span="24 / row.length"> | ||||
| 				<el-form-item :label="col.label" :prop="col.prop" :rules="col.rules"> | ||||
| 					<el-input | ||||
| 						v-if="col.input" | ||||
| 						v-model="form[col.prop]" | ||||
| 						@change="$emit('update', form)" | ||||
| 						:placeholder="`请输入${col.label}`" | ||||
| 						v-bind="col.bind" /> | ||||
| 					<el-input | ||||
| 						v-if="col.textarea" | ||||
| 						type="textarea" | ||||
| 						v-model="form[col.prop]" | ||||
| 						@change="$emit('update', form)" | ||||
| 						:placeholder="`请输入${col.label}`" | ||||
| 						v-bind="col.bind" /> | ||||
| 					<el-select | ||||
| 						v-if="col.select" | ||||
| 						v-model="form[col.prop]" | ||||
| 						:placeholder="`请选择${col.label}`" | ||||
| 						@change="$emit('update', form)" | ||||
| 						v-bind="col.bind"> | ||||
| 						<el-option | ||||
| 							v-for="opt in optionListOf[col.prop]" | ||||
| 							:key="opt.value" | ||||
| 							:label="opt.label" | ||||
| 							:value="opt.value" /> | ||||
| 					</el-select> | ||||
| 					<el-date-picker | ||||
| 						v-if="col.datetime" | ||||
| 						v-model="form[col.prop]" | ||||
| 						type="datetime" | ||||
| 						:placeholder="`请选择${col.label}`" | ||||
| 						value-format="timestamp" | ||||
| 						v-bind="col.bind"></el-date-picker> | ||||
| 					<el-upload | ||||
| 						class="upload-in-dialog" | ||||
| 						v-if="col.upload" | ||||
| 						:file-list="uploadedFileList" | ||||
| 						:action="col.url" | ||||
| 						:on-success="handleUploadSuccess" | ||||
| 						v-bind="col.bind"> | ||||
| 						<el-button | ||||
| 							size="small" | ||||
| 							type="primary" | ||||
| 							:disabled="col.bind?.disabled || false"> | ||||
| 							点击上传 | ||||
| 						</el-button> | ||||
| 						<div class="el-upload__tip" slot="tip" v-if="col.uploadTips"> | ||||
| 							{{ col.uploadTips || '只能上传jpg/png文件,大小不超过2MB' }} | ||||
| 						</div> | ||||
| 					</el-upload> | ||||
| 					<el-switch | ||||
| 						v-if="col.switch" | ||||
| 						v-model="form[col.prop]" | ||||
| 						active-color="#0b58ff" | ||||
| 						inactive-color="#e1e1e1" | ||||
| 						v-bind="col.bind"></el-switch> | ||||
| 					<component | ||||
| 						v-if="col.subcomponent" | ||||
| 						:key="col.key" | ||||
| 						:is="col.subcomponent" | ||||
| 						v-bind="col.bind" | ||||
| 						:inlineStyle="col.style"></component> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| /** | ||||
|  * 找到最长的label | ||||
|  * @param {*} options | ||||
|  */ | ||||
| function findMaxLabelWidth(rows) { | ||||
| 	let max = 0; | ||||
| 	rows.forEach((row) => { | ||||
| 		row.forEach((opt) => { | ||||
| 			// debugger; | ||||
| 			if (!opt.label) return 0; | ||||
| 			if (opt.label.length > max) { | ||||
| 				max = opt.label.length; | ||||
| 			} | ||||
| 		}); | ||||
| 	}); | ||||
| 	return max; | ||||
| } | ||||
|  | ||||
| export default { | ||||
| 	name: 'DialogForm', | ||||
| 	model: { | ||||
| 		prop: 'dataForm', | ||||
| 		event: 'update', | ||||
| 	}, | ||||
| 	emits: ['update'], | ||||
| 	components: {}, | ||||
| 	props: { | ||||
| 		rows: { | ||||
| 			type: Array, | ||||
| 			default: () => [], | ||||
| 		}, | ||||
| 		dataForm: { | ||||
| 			type: Object, | ||||
| 			default: () => ({}), | ||||
| 		}, | ||||
| 		disabled: { | ||||
| 			type: Boolean, | ||||
| 			default: false, | ||||
| 		}, | ||||
| 		labelPosition: { | ||||
| 			type: String, | ||||
| 			default: 'right', | ||||
| 		}, | ||||
| 		size: { | ||||
| 			type: String, | ||||
| 			default: '', | ||||
| 		}, | ||||
| 	}, | ||||
| 	data() { | ||||
| 		return { | ||||
| 			formLoading: true, | ||||
| 			optionListOf: {}, | ||||
| 			uploadedFileList: [], | ||||
| 			dataLoaded: false, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		labelWidth() { | ||||
| 			let max = findMaxLabelWidth(this.rows); | ||||
| 			// 每个汉字占20px | ||||
| 			return max * 20; | ||||
| 			// return max * 20 + 'px'; | ||||
| 		}, | ||||
| 		form: { | ||||
| 			get() { | ||||
| 				// if (this.dataLoaded) return this.dataForm; | ||||
| 				// else return {} | ||||
| 				return this.dataForm; | ||||
| 			}, | ||||
| 			set(val) { | ||||
| 				console.log('set form', val); | ||||
| 			}, | ||||
| 		}, | ||||
| 	}, | ||||
| 	watch: { | ||||
| 		rows: { | ||||
| 			handler() { | ||||
| 				console.log('watch triggered!'); | ||||
| 				this.$nextTick(() => { | ||||
| 					this.handleOptions('watch'); | ||||
| 				}); | ||||
| 			}, | ||||
| 			deep: true, | ||||
| 			immediate: false, | ||||
| 		}, | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		// 处理 options | ||||
| 		this.handleOptions(); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 模拟透传 ref  */ | ||||
| 		validate(cb) { | ||||
| 			return this.$refs.form.validate(cb); | ||||
| 		}, | ||||
| 		resetFields(args) { | ||||
| 			return this.$refs.form.resetFields(args); | ||||
| 		}, | ||||
| 		// getCode | ||||
| 		async getCode(url) { | ||||
| 			const response = await this.$axios(url); | ||||
| 			return response.data; | ||||
| 		}, | ||||
| 		async handleOptions(trigger = 'monuted') { | ||||
| 			console.log('[dialogForm:handleOptions]'); | ||||
| 			const promiseList = []; | ||||
| 			this.rows.forEach((cols) => { | ||||
| 				cols.forEach((opt) => { | ||||
| 					if (opt.value && !this.form[opt.prop]) { | ||||
| 						// 默认值 | ||||
| 						this.form[opt.prop] = opt.value; | ||||
| 					} | ||||
|  | ||||
| 					if (opt.options) { | ||||
| 						this.$set(this.optionListOf, opt.prop, opt.options); | ||||
| 					} else if (opt.url) { | ||||
| 						// 如果有 depends,则暂时先不获取,注册一个watcher | ||||
| 						if (opt.depends) { | ||||
| 							console.log('[handleOptions] setting watch'); | ||||
| 							this.$watch( | ||||
| 								() => this.form[opt.depends], | ||||
| 								(id) => { | ||||
| 									console.log('<', opt.depends, '>', 'changed', id); | ||||
| 									if (id == null) return; | ||||
| 									// 清空原有选项 | ||||
| 									this.form[opt.prop] = null; | ||||
| 									// 获取新的选项 | ||||
| 									this.$axios({ | ||||
| 										url: `${opt.url}?id=${id}`, | ||||
| 									}).then((res) => { | ||||
| 										this.$set( | ||||
| 											this.optionListOf, | ||||
| 											opt.prop, | ||||
| 											res.data.map((item) => ({ | ||||
| 												label: item[opt.labelKey ?? 'name'], | ||||
| 												value: item[opt.valueKey ?? 'id'], | ||||
| 											})) | ||||
| 										); | ||||
| 									}); | ||||
| 								}, | ||||
| 								{ | ||||
| 									immediate: true, | ||||
| 								} | ||||
| 							); | ||||
| 							return; | ||||
| 						} | ||||
| 						// 如果是下拉框,或者新增模式下的输入框,才去请求 | ||||
| 						if (opt.select || (opt.input && !this.form?.id)) { | ||||
| 							promiseList.push(async () => { | ||||
| 								const response = await this.$axios(opt.url, { | ||||
| 									method: opt.method ?? 'get', | ||||
| 								}); | ||||
| 								console.log('[dialogForm:handleOptions:response]', response); | ||||
| 								if (opt.select) { | ||||
| 									// 处理下拉框选项 | ||||
| 									const list = | ||||
| 										'list' in response.data | ||||
| 											? response.data.list | ||||
| 											: response.data; | ||||
| 									this.$set( | ||||
| 										this.optionListOf, | ||||
| 										opt.prop, | ||||
| 										list.map((item) => ({ | ||||
| 											label: item[opt.labelKey ?? 'name'], | ||||
| 											value: item[opt.valueKey ?? 'id'], | ||||
| 										})) | ||||
| 									); | ||||
| 								} else if (opt.input) { | ||||
| 									console.log('setting code: ', response.data); | ||||
| 									// 处理输入框数据 | ||||
| 									this.form[opt.prop] = response.data; | ||||
| 								} | ||||
| 							}); | ||||
| 						} | ||||
| 					} | ||||
| 				}); | ||||
| 			}); | ||||
|  | ||||
| 			console.log('[dialogForm:handleOptions] done!'); | ||||
|  | ||||
| 			// 如果是 watch 触发的,不需要执行进一步的请求 | ||||
| 			if (trigger == 'watch') { | ||||
| 				this.formLoading = false; | ||||
| 				return; | ||||
| 			} | ||||
| 			try { | ||||
| 				await Promise.all(promiseList.map((fn) => fn())); | ||||
| 				this.formLoading = false; | ||||
| 				this.dataLoaded = true; | ||||
| 				// console.log("[dialogForm:handleOptions:optionListOf]", this.optionListOf) | ||||
| 			} catch (error) { | ||||
| 				console.log('[dialogForm:handleOptions:error]', error); | ||||
| 				this.formLoading = false; | ||||
| 			} | ||||
| 			if (!promiseList.length) this.formLoading = false; | ||||
| 		}, | ||||
| 		// 上传成功的特殊处理 | ||||
| 		beforeUpload() {}, | ||||
| 		// 上传前的验证规则可通过 bind 属性传入 | ||||
| 		handleUploadSuccess(response, file, fileList) { | ||||
| 			console.log( | ||||
| 				'[dialogForm:handleUploadSuccess]', | ||||
| 				response, | ||||
| 				file, | ||||
| 				fileList, | ||||
| 				this.form | ||||
| 			); | ||||
| 			// 保存原始文件名 | ||||
| 			if ('fileNames' in this.form) this.form.fileNames.push(file.name); | ||||
| 			// 保存完整地址 | ||||
| 			if ('fileUrls' in this.form) this.form.fileUrls.push(response.data); | ||||
| 			this.$modal.msgSuccess('上传成功'); | ||||
| 		}, | ||||
|  | ||||
| 		getFileName(fileUrl) { | ||||
| 			return fileUrl.split('/').pop(); | ||||
| 		}, | ||||
| 	}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .el-date-editor, | ||||
| .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
| @@ -29,23 +29,28 @@ | ||||
| 				<section v-for="(section, index) in sections" :key="section.key"> | ||||
| 					<SmallTitle v-if="index != 0">{{ section.name }}</SmallTitle> | ||||
|  | ||||
| 					<div class="form-part" v-if="section.key == 'base'"> | ||||
| 					<div | ||||
| 						class="form-part" | ||||
| 						v-if="section.key == 'base'" | ||||
| 						style="margin-bottom: 32px"> | ||||
| 						<el-skeleton v-if="!showForm" animated /> | ||||
| 						<DialogForm | ||||
| 						<EquipmentInfoForm | ||||
| 							key="drawer-dialog-form" | ||||
| 							v-if="showForm" | ||||
| 							ref="form" | ||||
| 							:dataForm="form" | ||||
| 							:rows="formRows" /> | ||||
| 							:disabled="mode.includes('detail')" | ||||
| 							:sync-filelist="syncFileListFlag" | ||||
| 							v-model="form" /> | ||||
| 					</div> | ||||
|  | ||||
| 					<div v-if="section.key == 'attrs'" style="margin-top: 12px"> | ||||
| 						<base-table | ||||
| 							v-loading="attrListLoading" | ||||
| 							:table-props="section.props" | ||||
| 							:page="section.pageNo || 1" | ||||
| 							:limit="section.pageSize || 10" | ||||
| 							:page="attrQuery?.params.pageNo || 1" | ||||
| 							:limit="attrQuery?.params.pageSize || 10" | ||||
| 							:table-data="list" | ||||
| 							:add-button-show="mode.includes('detail') ? null : '添加属性'" | ||||
| 							@emitButtonClick="handleAddAttr" | ||||
| 							@emitFun="handleEmitFun"> | ||||
| 							<method-btn | ||||
| 								v-if="section.tableBtn" | ||||
| @@ -54,27 +59,31 @@ | ||||
| 								:method-list="tableBtn" | ||||
| 								@clickBtn="handleTableBtnClick" /> | ||||
| 						</base-table> | ||||
|  | ||||
| 						<!-- 分页组件 --> | ||||
| 						<pagination | ||||
| 							v-show="total > 0" | ||||
| 							:total="total" | ||||
| 							:page.sync="attrQuery.params.pageNo" | ||||
| 							:limit.sync="attrQuery.params.pageSize" | ||||
| 							@pagination="getAttrList" /> | ||||
| 					</div> | ||||
| 				</section> | ||||
| 			</div> | ||||
|  | ||||
| 			<div class="drawer-body__footer"> | ||||
| 				<el-button style="margin-right: 10px" @click="handleCancel"> | ||||
| 					返回 | ||||
| 				</el-button> | ||||
| 				<el-button style="" @click="handleCancel">取消</el-button> | ||||
| 				<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit"> | ||||
| 					编辑 | ||||
| 				</el-button> | ||||
| 				<span v-else> | ||||
| 					<el-button type="primary" @click="handleSave">保存</el-button> | ||||
| 					<!-- sections的第二项必须是 属性列表  --> | ||||
| 					<el-button | ||||
| 				<el-button v-else type="primary" @click="handleConfirm">确定</el-button> | ||||
| 				<!-- sections的第二项必须是 属性列表  --> | ||||
| 				<!-- <el-button | ||||
| 						v-if="sections[1].allowAdd" | ||||
| 						type="primary" | ||||
| 						@click="handleAddAttr"> | ||||
| 						添加属性 | ||||
| 					</el-button> | ||||
| 				</span> | ||||
| 					</el-button> --> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| @@ -99,11 +108,13 @@ | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import DialogForm from '@/components/DialogForm'; | ||||
| import DialogForm from './DialogForm'; | ||||
| import EquipmentInfoForm from './EquipmentInfoForm.vue'; | ||||
|  | ||||
| const SmallTitle = { | ||||
| 	name: 'SmallTitle', | ||||
| 	props: ['size'], | ||||
| 	components: {}, | ||||
| 	data() { | ||||
| 		return {}; | ||||
| 	}, | ||||
| @@ -127,12 +138,13 @@ const SmallTitle = { | ||||
| }; | ||||
|  | ||||
| export default { | ||||
| 	components: { SmallTitle, DialogForm }, | ||||
| 	components: { SmallTitle, DialogForm, EquipmentInfoForm }, | ||||
| 	props: ['sections', 'mode', 'dataId'], // dataId 作为一个通用的存放id的字段 | ||||
| 	data() { | ||||
| 		return { | ||||
| 			visible: false, | ||||
| 			showForm: false, | ||||
| 			btnLoading: false, | ||||
| 			total: 0, | ||||
| 			form: {}, | ||||
| 			list: [], | ||||
| @@ -161,10 +173,16 @@ export default { | ||||
| 					}, | ||||
| 				], | ||||
| 			], | ||||
| 			attrQuery: null, // 属性列表的请求 | ||||
| 			attrQuery: { | ||||
| 				params: { | ||||
| 					pageNo: 1, | ||||
| 					pageSize: 10, | ||||
| 				}, | ||||
| 			}, // 属性列表的请求 | ||||
| 			infoQuery: null, // 基本信息的请求 | ||||
| 			attrFormSubmitting: false, | ||||
| 			attrListLoading: false, | ||||
| 			syncFileListFlag: null, | ||||
| 		}; | ||||
| 	}, | ||||
| 	computed: { | ||||
| @@ -175,15 +193,19 @@ export default { | ||||
| 						// 重置图片的位置 | ||||
| 						return { | ||||
| 							...col, | ||||
| 							bind: { | ||||
| 								...col.bind, | ||||
| 							}, | ||||
| 							style: { | ||||
| 								left: 0, | ||||
| 								right: 'unset' | ||||
| 							} | ||||
| 						} | ||||
| 								right: 'unset', | ||||
| 							}, | ||||
| 						}; | ||||
| 					} | ||||
| 					return { | ||||
| 						...col, | ||||
| 						bind: { | ||||
| 							...col.bind, | ||||
| 							// 详情 模式下,禁用各种输入 | ||||
| 							disabled: this.mode == 'detail', | ||||
| 						}, | ||||
| @@ -208,9 +230,52 @@ export default { | ||||
| 				this.$axios(query).then(({ data }) => { | ||||
| 					if (section.key == 'base') { | ||||
| 						this.form = data; | ||||
| 						// this.form = { | ||||
| 						// 	code: 'gj', | ||||
| 						// 	name: '下片机', | ||||
| 						// 	enName: 'unload', | ||||
| 						// 	abbr: '', | ||||
| 						// 	equipmentTypeId: 21084, | ||||
| 						// 	remark: '备注', | ||||
| 						// 	id: '1712367395052384257', | ||||
| 						// 	createTime: 1697095176000, | ||||
| 						// 	enterTime: 0, | ||||
| 						// 	productionTime: 0, | ||||
| 						// 	files: [ | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试.xlsx', | ||||
| 						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0108%2F0f0c6f30j00r5cle9000sc000hs00gtc.jpg&thumbnail=660x2147483647&quality=80&type=jpg', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试2.xlsx', | ||||
| 						// 			fileUrl: 'https://nimg.ws.126.net/?url=http%3A%2F%2Fdingyue.ws.126.net%2F2022%2F0415%2F2cd23619j00racb96000kc000hs00hsc.jpg&thumbnail=660x2147483647&quality=80&type=jpg', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试3.xlsx', | ||||
| 						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F1fea91a0-d088-409e-b145-e0e61254b28b%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=2e0fe7d1de7f54adff3007efe133d67c', | ||||
| 						// 			fileType: 1 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试4.xlsx', | ||||
| 						// 			fileUrl: 'https://pics5.baidu.com/feed/b7003af33a87e950cdfb4b4546eed044faf2b40d.jpeg?token=1d7484cfe4b014dd201f8c8725cab945', | ||||
| 						// 			fileType: 2 | ||||
| 						// 		}, | ||||
| 						// 		{ | ||||
| 						// 			fileName: '测试5.xlsx', | ||||
| 						// 			fileUrl: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Fe3500876-9c46-4b70-8d37-4799520cdd13%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1700031689&t=4abc1df930e62730e5361a7d3765e0f2', | ||||
| 						// 			fileType: 2 | ||||
| 						// 		}, | ||||
| 						// 	], | ||||
| 						// 	tvalue: 0, | ||||
| 						// 	processingTime: 0, | ||||
| 						// 	manufacturer: '', | ||||
| 						// 	spec: '', | ||||
| 						// 	description: '描述', | ||||
| 						// }; | ||||
| 						this.showForm = true; | ||||
| 						this.infoQuery = query; | ||||
| 						console.log('setting form: ', this.form, data); | ||||
| 					} else if (section.key == 'attrs') { | ||||
| 						this.attrQuery = query; | ||||
| 						this.list = data.list; | ||||
| @@ -231,6 +296,24 @@ export default { | ||||
| 					break; | ||||
| 			} | ||||
| 		}, | ||||
| 		async handleConfirm() { | ||||
| 			this.btnLoading = true; | ||||
| 			this.syncFileListFlag = Math.random(); | ||||
|  | ||||
| 			this.$nextTick(async () => { | ||||
| 				const { code, data } = await this.$axios({ | ||||
| 					url: this.sections[0].urlUpdate, | ||||
| 					method: 'put', | ||||
| 					data: this.form, | ||||
| 				}); | ||||
| 				if (code == 0) { | ||||
| 					this.$modal.msgSuccess('更新成功'); | ||||
| 				} | ||||
|  | ||||
| 				this.btnLoading = false; | ||||
| 				this.handleCancel(); | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		handleEmitFun(val) { | ||||
| 			console.log('handleEmitFun', val); | ||||
| @@ -273,7 +356,7 @@ export default { | ||||
|  | ||||
| 		// 开启编辑 | ||||
| 		toggleEdit() { | ||||
| 			this.mode = 'edit'; | ||||
| 			this.$emit('update-mode', 'edit'); | ||||
| 		}, | ||||
|  | ||||
| 		// 新增属性 | ||||
| @@ -331,33 +414,44 @@ export default { | ||||
| 		}, | ||||
|  | ||||
| 		// 提交属性表 | ||||
| 		async submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate((valid) => { | ||||
| 		submitAttrForm() { | ||||
| 			this.$refs['attrForm'].validate(async (valid) => { | ||||
| 				if (!valid) { | ||||
| 					return; | ||||
| 				} | ||||
| 			}); | ||||
| 			console.log('this.attrform', this.attrForm); | ||||
| 			const isEdit = this.attrForm.id != null; | ||||
| 			this.attrFormSubmitting = true; | ||||
| 			const res = await this.$axios({ | ||||
| 				url: isEdit ? this.sections[1].urlUpdate : this.sections[1].urlCreate, | ||||
| 				method: isEdit ? 'put' : 'post', | ||||
| 				data: this.attrForm, | ||||
| 			}); | ||||
|  | ||||
| 			if (res.code == 0) { | ||||
| 				this.closeAttrForm(); | ||||
| 				this.$message({ | ||||
| 					message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 					type: 'success', | ||||
| 					duration: 1500, | ||||
| 					onClose: () => { | ||||
| 						this.getAttrList(); | ||||
| 					}, | ||||
| 				}); | ||||
| 			} | ||||
| 			this.attrFormSubmitting = false; | ||||
| 				try { | ||||
| 					const isEdit = this.attrForm.id != null; | ||||
| 					this.attrFormSubmitting = true; | ||||
| 					const res = await this.$axios({ | ||||
| 						url: isEdit | ||||
| 							? this.sections[1].urlUpdate | ||||
| 							: this.sections[1].urlCreate, | ||||
| 						method: isEdit ? 'put' : 'post', | ||||
| 						data: this.attrForm, | ||||
| 					}); | ||||
|  | ||||
| 					if (res.code == 0) { | ||||
| 						this.closeAttrForm(); | ||||
| 						this.$message({ | ||||
| 							message: `${isEdit ? '更新' : '创建'}成功`, | ||||
| 							type: 'success', | ||||
| 							duration: 1500, | ||||
| 							onClose: () => { | ||||
| 								this.getAttrList(); | ||||
| 							}, | ||||
| 						}); | ||||
| 					} | ||||
| 					this.attrFormSubmitting = false; | ||||
| 				} catch (err) { | ||||
| 					this.$message({ | ||||
| 						message: err, | ||||
| 						type: 'error', | ||||
| 						duration: 1500, | ||||
| 					}); | ||||
| 					this.attrFormSubmitting = false; | ||||
| 				} | ||||
| 			}); | ||||
| 		}, | ||||
|  | ||||
| 		closeAttrForm() { | ||||
|   | ||||
							
								
								
									
										337
									
								
								src/views/core/base/equipment/components/EquipmentInfoForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										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> | ||||
| @@ -36,13 +36,16 @@ | ||||
| 			:dialogVisible="open" | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			width="60%" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm | ||||
| 				v-if="open" | ||||
| 				key="index-dialog-form" | ||||
| 				ref="form" | ||||
| 				label-position="top" | ||||
| 				size="small" | ||||
| 				:dataForm="form" | ||||
| 				:rows="rows" /> | ||||
| 				:rows="computedRows" /> | ||||
| 		</base-dialog> | ||||
|  | ||||
| 		<!-- 设备 详情 - 编辑 --> | ||||
| @@ -50,12 +53,13 @@ | ||||
| 			v-if="editVisible" | ||||
| 			ref="drawer" | ||||
| 			:mode="editMode" | ||||
| 			@update-mode="editMode = $event" | ||||
| 			:data-id="form.id" | ||||
| 			:sections="[ | ||||
| 				{ | ||||
| 					name: '基本信息', | ||||
| 					key: 'base', | ||||
| 					rows: rows, | ||||
| 					rows: computedRows, | ||||
| 					url: '/base/equipment/get', | ||||
| 					urlUpdate: '/base/equipment/update', | ||||
| 					urlCreate: '/base/equipment/create', | ||||
| @@ -93,8 +97,8 @@ | ||||
| 				}, | ||||
| 			]" | ||||
| 			@refreshDataList="getList" | ||||
| 			@cancel="editVisible = false" | ||||
| 			@destroy="editVisible = false" /> | ||||
| 			@cancel="cancelEdit" | ||||
| 			@destroy="cancelEdit" /> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| @@ -115,6 +119,7 @@ import { | ||||
| 	exportEquipmentExcel, | ||||
| } from '@/api/base/equipment'; | ||||
| import Editor from '@/components/Editor'; | ||||
| import AssetsUpload from './components/AssetsUpload.vue'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'Equipment', | ||||
| @@ -155,7 +160,7 @@ export default { | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备名称' }, | ||||
| 				{ width: 256, prop: 'code', label: '检测编码' }, | ||||
| 				{ width: 256, prop: 'code', label: '设备编码' }, | ||||
| 				{ prop: 'equipmentType', label: '设备类型' }, | ||||
| 				{ prop: 'enName', label: '英文名称' }, | ||||
| 				{ prop: 'abbr', label: '缩写' }, | ||||
| @@ -239,8 +244,6 @@ export default { | ||||
| 						prop: 'code', | ||||
| 						url: '/base/equipment/getCode', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '英文名称', | ||||
| @@ -250,6 +253,8 @@ export default { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '缩写', | ||||
| @@ -259,13 +264,15 @@ export default { | ||||
| 						// 	disabled: true, // some condition, like detail mode... | ||||
| 						// } | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
|  | ||||
| 					{ | ||||
| 						select: true, | ||||
| 						label: '设备类型', | ||||
| 						prop: 'equipmentTypeId', | ||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||
| 						bind: { | ||||
| 							filterable: true, | ||||
| 						}, | ||||
| 					}, | ||||
| 					// { | ||||
| 					// 	select: true, | ||||
| @@ -286,8 +293,6 @@ export default { | ||||
| 						label: '进厂日期', | ||||
| 						prop: 'enterTime', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						prop: 'tvalue', | ||||
| @@ -302,11 +307,14 @@ export default { | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '产品加工时间', | ||||
| 						label: '产品加工时间(s)', | ||||
| 						prop: 'processingTime', | ||||
| 						rules: [ | ||||
| 							{ required: true, message: '不能为空', trigger: 'blur' }, | ||||
| 							{ | ||||
| 								type: 'number', | ||||
| 								message: '请输入正确的数字值', | ||||
| @@ -315,8 +323,7 @@ export default { | ||||
| 							}, | ||||
| 						], | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
|  | ||||
| 					{ | ||||
| 						input: true, | ||||
| 						label: '制造商', | ||||
| @@ -337,40 +344,79 @@ export default { | ||||
| 						prop: 'description', | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						upload: true, | ||||
| 						label: '上传资料', | ||||
| 						prop: 'uploadFiles', | ||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 						bind: { | ||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 							'show-file-list': false, | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						diy: true, | ||||
| 						key: 'eq-assets', | ||||
| 						label: '设备资料', | ||||
| 						prop: 'fileNames', | ||||
| 						subcomponent: EquipmentAssets, | ||||
| 					}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						diy: true, | ||||
| 						key: 'eq-pics', | ||||
| 						label: '设备图片', | ||||
| 						prop: 'fileUrls', | ||||
| 						subcomponent: EquipmentPics, | ||||
| 						pictures: async () => { | ||||
| 							// some async request | ||||
| 							return []; | ||||
| 						}, | ||||
| 					}, | ||||
| 				], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		assetUpload: true, | ||||
| 				// 		label: '上传资料', | ||||
| 				// 		fieldName: 'assets', | ||||
| 				// 		subcomponent: AssetsUpload | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		assetUpload: true, | ||||
| 				// 		label: '上传图片', | ||||
| 				// 		fieldName: 'images', | ||||
| 				// 		subcomponent: AssetsUpload | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		upload: true, | ||||
| 				// 		label: '上传资料', | ||||
| 				// 		prop: 'uploadFiles', | ||||
| 				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 				// 		uploadFnName: 'assetsUpload', // 上传方法名 | ||||
| 				// 		bind: { | ||||
| 				// 			headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 				// 			'show-file-list': false, | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-assets', | ||||
| 				// 		label: '设备资料', | ||||
| 				// 		prop: 'fileNames', | ||||
| 				// 		subcomponent: EquipmentAssets, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// { | ||||
| 				// 		upload: true, | ||||
| 				// 		label: '上传图片', | ||||
| 				// 		prop: 'uploadImages', | ||||
| 				// 		url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 				// 		uploadFnName: 'imagesUpload', // 上传方法名 | ||||
| 				// 		bind: { | ||||
| 				// 			headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 				// 			'show-file-list': false, | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-pics', | ||||
| 				// 		label: '设备图片', | ||||
| 				// 		prop: 'fileUrls', | ||||
| 				// 		subcomponent: EquipmentPics, | ||||
| 				// 		pictures: async () => { | ||||
| 				// 			// some async request | ||||
| 				// 			return []; | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 				// [ | ||||
| 				// 	{ | ||||
| 				// 		diy: true, | ||||
| 				// 		key: 'eq-pics', | ||||
| 				// 		label: '设备图片', | ||||
| 				// 		prop: 'fileUrls', | ||||
| 				// 		subcomponent: EquipmentPics, | ||||
| 				// 		pictures: async () => { | ||||
| 				// 			// some async request | ||||
| 				// 			return []; | ||||
| 				// 		}, | ||||
| 				// 	}, | ||||
| 				// ], | ||||
| 			], | ||||
| 			editVisible: false, | ||||
| 			editMode: 'edit', // 'edit', 'detail' | ||||
| @@ -399,11 +445,49 @@ export default { | ||||
| 			form: { | ||||
| 				id: null, | ||||
| 			}, | ||||
| 			showUploadComponents: false, // 是否显示上传组件 | ||||
| 		}; | ||||
| 	}, | ||||
| 	created() { | ||||
| 		this.getList(); | ||||
| 	}, | ||||
| 	computed: { | ||||
| 		computedRows() { | ||||
| 			return this.showUploadComponents | ||||
| 				? [ | ||||
| 						...this.rows, | ||||
| 						[ | ||||
| 							{ | ||||
| 								assetUpload: true, | ||||
| 								key: 'eq-assets', // 用于区分不同的上传组件 | ||||
| 								label: '上传资料', | ||||
| 								fieldName: 'assets', | ||||
| 								subcomponent: AssetsUpload, | ||||
| 								prop: 'uploadedAssets', | ||||
| 								default: [], | ||||
| 								bind: { | ||||
| 									'is-pic-mode': false, | ||||
| 								}, | ||||
| 							}, | ||||
| 						], | ||||
| 						[ | ||||
| 							{ | ||||
| 								assetUpload: true, | ||||
| 								key: 'eq-pics', // 用于区分不同的上传组件 | ||||
| 								label: '上传图片', | ||||
| 								fieldName: 'images', | ||||
| 								subcomponent: AssetsUpload, | ||||
| 								// prop: '', | ||||
| 								// default: [], | ||||
| 								bind: { | ||||
| 									'is-pic-mode': true, | ||||
| 								}, | ||||
| 							}, | ||||
| 						], | ||||
| 				  ] | ||||
| 				: this.rows; | ||||
| 		}, | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		/** 查询列表 */ | ||||
| 		getList() { | ||||
| @@ -420,6 +504,10 @@ export default { | ||||
| 			this.open = false; | ||||
| 			this.reset(); | ||||
| 		}, | ||||
| 		cancelEdit() { | ||||
| 			this.showUploadComponents = false; | ||||
| 			this.editVisible = false; | ||||
| 		}, | ||||
| 		/** 表单重置 */ | ||||
| 		reset() { | ||||
| 			this.form = { | ||||
| @@ -445,11 +533,13 @@ export default { | ||||
| 		handleAdd() { | ||||
| 			this.reset(); | ||||
| 			this.open = true; | ||||
| 			this.showUploadComponents = false; | ||||
| 			this.title = '添加设备'; | ||||
| 		}, | ||||
| 		/** 修改按钮操作 */ | ||||
| 		handleUpdate(row) { | ||||
| 			this.reset(); | ||||
| 			this.showUploadComponents = true; | ||||
| 			const id = row.id; | ||||
| 			getEquipment(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| @@ -516,6 +606,7 @@ export default { | ||||
| 		viewDetail(id) { | ||||
| 			this.reset(); | ||||
| 			this.editMode = 'detail'; | ||||
| 			this.showUploadComponents = true; | ||||
| 			this.form.id = id; | ||||
| 			this.editVisible = true; | ||||
| 			this.$nextTick(() => { | ||||
| @@ -524,11 +615,11 @@ export default { | ||||
| 		}, | ||||
| 		// overwrite basicPageMixin 里的 处理表格按钮 方法 | ||||
| 		handleTableBtnClick({ data, type }) { | ||||
| 			console.log('[handleTableBtnClick]', data, type); | ||||
| 			switch (type) { | ||||
| 				case 'edit': | ||||
| 					this.reset(); | ||||
| 					this.editMode = 'edit'; | ||||
| 					this.showUploadComponents = true; | ||||
| 					this.form.id = data.id; | ||||
| 					this.editVisible = true; | ||||
| 					this.$nextTick(() => { | ||||
|   | ||||
| @@ -37,7 +37,7 @@ | ||||
| 			@close="cancel" | ||||
| 			@cancel="cancel" | ||||
| 			@confirm="submitForm"> | ||||
| 			<DialogForm v-if="open" ref="form" :dataForm="form" :rows="rows" /> | ||||
| 			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" /> | ||||
| 		</base-dialog> | ||||
| 	</div> | ||||
| </template> | ||||
| @@ -55,7 +55,7 @@ import { | ||||
| 	exportEquipmentTypeExcel, | ||||
| } from '@/api/base/equipmentType'; | ||||
|  | ||||
| import { getAccessToken } from '@/utils/auth'; | ||||
| // import { getAccessToken } from '@/utils/auth'; | ||||
|  | ||||
| export default { | ||||
| 	name: 'EquipmentType', | ||||
| @@ -86,9 +86,9 @@ export default { | ||||
| 					width: 180, | ||||
| 					filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), | ||||
| 				}, | ||||
| 				{ prop: 'name', label: '设备类型名称',  }, | ||||
| 				{ prop: 'code', label: '检测类型编码',  }, | ||||
| 				{ prop: 'remark', label: '备注',  }, | ||||
| 				{ prop: 'name', label: '设备类型名称' }, | ||||
| 				{ prop: 'code', label: '检测类型编码' }, | ||||
| 				{ prop: 'remark', label: '备注' }, | ||||
| 			], | ||||
| 			searchBarFormConfig: [ | ||||
| 				{ | ||||
| @@ -149,15 +149,13 @@ export default { | ||||
| 						prop: 'parentId', | ||||
| 						url: '/base/equipment-type/page?pageNo=1&pageSize=100', | ||||
| 					}, | ||||
| 					{}, | ||||
| 				], | ||||
| 				[ | ||||
| 					{ | ||||
| 						upload: true, | ||||
| 						label: '上传资料', | ||||
| 						prop: 'uploadFiles', | ||||
| 						url: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/upload', // 请求地址 | ||||
| 						bind: { | ||||
| 							headers: { Authorization: 'Bearer ' + getAccessToken() }, | ||||
| 							'show-file-list': false, | ||||
| 						}, | ||||
| 						prop: 'files', | ||||
| 					}, | ||||
| 				], | ||||
| 				[{ input: true, label: '备注', prop: 'remark' }], | ||||
| @@ -236,6 +234,25 @@ export default { | ||||
| 			const id = row.id; | ||||
| 			getEquipmentType(id).then((response) => { | ||||
| 				this.form = response.data; | ||||
| 				// this.form = { | ||||
| 				// 	code: 'SBLX20230925184444000041', | ||||
| 				// 	name: '测试131', | ||||
| 				// 	remark: '测试可删除', | ||||
| 				// 	id: '1706258479729336322', | ||||
| 				// 	files: [ | ||||
| 				// 		{ fileName: '1.png', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.asdfaslkjfkasdf.png', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '2.txt', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.rar', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '1.kkk', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: 'test.file', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: '222', fileUrl: '', fileType: 2 }, | ||||
| 				// 		{ fileName: 'g', fileUrl: '', fileType: 2 }, | ||||
| 				// 	], | ||||
| 				// 	createTime: 1695638697000, | ||||
| 				// 	parentId: '1701869972319584257', | ||||
| 				// }; | ||||
| 				// debugger; | ||||
| 				this.open = true; | ||||
| 				this.title = '修改设备类型'; | ||||
| 			}); | ||||
| @@ -267,7 +284,7 @@ export default { | ||||
| 		handleDelete(row) { | ||||
| 			const id = row.id; | ||||
| 			this.$modal | ||||
| 				.confirm('是否确认删除设备类型编号为"' + id + '"的数据项?') | ||||
| 				.confirm('是否确认删除设备类型"' + row.name + '"?') | ||||
| 				.then(function () { | ||||
| 					return deleteEquipmentType(id); | ||||
| 				}) | ||||
|   | ||||
| @@ -1,8 +1,8 @@ | ||||
| <!-- | ||||
|  * @Author: zwq | ||||
|  * @Date: 2021-11-18 14:16:25 | ||||
|  * @LastEditors: zwq | ||||
|  * @LastEditTime: 2023-08-01 16:59:06 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-16 11:16:48 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| @@ -12,21 +12,30 @@ | ||||
| 		ref="dataForm" | ||||
| 		@keyup.enter.native="dataFormSubmit()" | ||||
| 		label-width="80px"> | ||||
| 		<el-form-item label="工厂编码" prop="code"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.code" | ||||
| 				clearable | ||||
| 				placeholder="请输入工厂编码" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="工厂名称" prop="name"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.name" | ||||
| 				clearable | ||||
| 				placeholder="请输入工厂名称" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="地址" prop="address"> | ||||
| 			<el-input v-model="dataForm.address" clearable placeholder="请输入地址" /> | ||||
| 		</el-form-item> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工厂编码" prop="code"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.code" | ||||
| 						clearable | ||||
| 						placeholder="请输入工厂编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工厂名称" prop="name"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.name" | ||||
| 						clearable | ||||
| 						placeholder="请输入工厂名称" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="地址" prop="address"> | ||||
| 					<el-input v-model="dataForm.address" clearable placeholder="请输入地址" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		<!-- <el-form-item label="启用状态" prop="enabled"> | ||||
| 			<el-select | ||||
| 				v-model="dataForm.enabled" | ||||
| @@ -38,9 +47,12 @@ | ||||
| 					:value="dict.value" /> | ||||
| 			</el-select> | ||||
| 		</el-form-item> --> | ||||
| 		<el-form-item label="备注" prop="remark"> | ||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||
| 		</el-form-item> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="备注" prop="remark"> | ||||
| 					<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 	</el-form> | ||||
| </template> | ||||
|  | ||||
|   | ||||
| @@ -29,7 +29,7 @@ | ||||
| 			@cancel="handleCancel" | ||||
| 			@confirm="handleConfirm" | ||||
| 			:before-close="handleCancel" | ||||
| 			width="70%"> | ||||
| 			width="50%"> | ||||
| 			<add-or-update | ||||
| 				ref="addOrUpdate" | ||||
| 				@refreshDataList="successSubmit"></add-or-update> | ||||
| @@ -51,7 +51,7 @@ const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'code', | ||||
| 		label: '工厂编码' | ||||
| 	}, | ||||
| 	},																																																																						 | ||||
| 	{ | ||||
| 		prop: 'name', | ||||
| 		label: '工厂名称' | ||||
|   | ||||
| @@ -2,15 +2,14 @@ | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-02 15:12:42 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-10 16:49:03 | ||||
|  * @LastEditTime: 2023-10-13 16:35:03 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| 	<div class="app-container"> | ||||
| 		<search-bar | ||||
| 			:formConfigs="formConfig" | ||||
| 			ref="searchBarForm" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 			:formConfigs="[{ label: '产线在制产品', type: 'title' }]" | ||||
| 			ref="searchBarForm" /> | ||||
| 		<base-table | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| @@ -36,20 +35,17 @@ import { getProductPage } from '@/api/core/base/product'; | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'lineName', | ||||
| 		label: '产线', | ||||
| 		align: 'center', | ||||
| 		label: '产线' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'productName', | ||||
| 		label: '在制产品', | ||||
| 		align: 'center', | ||||
| 		list: [], | ||||
| 		subcomponent: selectProduct, | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'recordTime', | ||||
| 		label: '开始时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| ]; | ||||
| @@ -63,14 +59,14 @@ export default { | ||||
| 			}, | ||||
| 			tableProps, | ||||
| 			tableData: [], | ||||
| 			formConfig: [ | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '同步', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 			], | ||||
| 			// formConfig: [ | ||||
| 			// 	{ | ||||
| 			// 		type: 'button', | ||||
| 			// 		btnName: '同步', | ||||
| 			// 		name: 'search', | ||||
| 			// 		color: 'primary', | ||||
| 			// 	}, | ||||
| 			// ], | ||||
| 		}; | ||||
| 	}, | ||||
| 	components: {}, | ||||
|   | ||||
| @@ -2,12 +2,11 @@ | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-03 14:09:18 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-10 16:54:09 | ||||
|  * @LastEditTime: 2023-10-13 16:47:25 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| 	<div class="tableInner"> | ||||
| 		<el-input readonly v-model="list.productName" style="width: 50%;" ></el-input> | ||||
| 		<el-popover | ||||
|     placement="top" | ||||
|     title="切换在制产品" | ||||
| @@ -28,8 +27,11 @@ | ||||
| 					确定 | ||||
| 				</el-button> | ||||
| 			</div> | ||||
| 			<el-button type="text" slot="reference">切换</el-button> | ||||
| 			<el-button type="text" slot="reference"> | ||||
| 				<svg-icon icon-class="changelogo"/> | ||||
| 			</el-button> | ||||
| 		</el-popover> | ||||
| 		<el-input readonly v-model="list.productName" style="width: 50%;margin-left: 5px" ></el-input> | ||||
| 	</div> | ||||
| </template> | ||||
| <script> | ||||
| @@ -61,6 +63,7 @@ export default { | ||||
| 			switchLineBindProduct(data).then((response) => { | ||||
| 				this.$modal.msgSuccess('修改成功'); | ||||
| 				this.visible = false; | ||||
| 				this.list.productName = this.list.string.split('+')[1] | ||||
| 				this.$emit('emitData'); | ||||
| 			}); | ||||
| 		}, | ||||
|   | ||||
| @@ -28,24 +28,20 @@ import { getProductPage } from '@/api/core/base/product'; | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'productionLineName', | ||||
| 		label: '产线', | ||||
| 		align: 'center', | ||||
| 		label: '产线' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'productName', | ||||
| 		label: '在制产品', | ||||
| 		align: 'center', | ||||
| 		label: '在制产品' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'startTime', | ||||
| 		label: '开始时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'endTime', | ||||
| 		label: '结束时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 	}, | ||||
| ]; | ||||
| @@ -86,7 +82,8 @@ export default { | ||||
| 					rangeSeparator: '-', | ||||
| 					startPlaceholder: '开始时间', | ||||
| 					endPlaceholder: '结束时间', | ||||
| 					param: 'createTime', | ||||
| 					param: 'startTime', | ||||
| 					valueFormat: 'timestamp' | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| @@ -126,7 +123,7 @@ export default { | ||||
| 					this.listQuery.pageSize = 10; | ||||
| 					this.listQuery.productionLineId = val.productionLineId; | ||||
| 					this.listQuery.productId = val.productId; | ||||
| 					this.listQuery.createTime = val.createTime; | ||||
| 					this.listQuery.startTime = val.startTime; | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'reset': | ||||
|   | ||||
| @@ -43,7 +43,7 @@ | ||||
| 							<el-form-item label="产品类型" prop="typeDictValue"> | ||||
| 								<el-select | ||||
| 									v-model="dataForm.typeDictValue" | ||||
|                   style="width: 100%" | ||||
| 									style="width: 100%" | ||||
| 									:disabled="isdetail" | ||||
| 									placeholder="请选择产品类型"> | ||||
| 									<el-option | ||||
| @@ -58,7 +58,7 @@ | ||||
| 							<el-form-item label="单位" prop="unitDictValue"> | ||||
| 								<el-select | ||||
| 									v-model="dataForm.unitDictValue" | ||||
|                   style="width: 100%" | ||||
| 									style="width: 100%" | ||||
| 									:disabled="isdetail" | ||||
| 									placeholder="请选择单位"> | ||||
| 									<el-option | ||||
| @@ -83,8 +83,8 @@ | ||||
| 							<el-form-item label="单位平方数" prop="area"> | ||||
| 								<el-input | ||||
| 									:disabled="isdetail" | ||||
|                   v-model="dataForm.area" | ||||
|                   placeholder="请输入单位平方数" /> | ||||
| 									v-model="dataForm.area" | ||||
| 									placeholder="请输入单位平方数" /> | ||||
| 							</el-form-item> | ||||
| 						</el-col> | ||||
| 					</el-row> | ||||
| @@ -111,6 +111,8 @@ | ||||
| 						:table-props="tableProps" | ||||
| 						:page="listQuery.pageNo" | ||||
| 						:limit="listQuery.pageSize" | ||||
| 						:add-button-show="isdetail ? null : '添加属性'" | ||||
| 						@emitButtonClick="addNew()" | ||||
| 						:table-data="productAttributeList"> | ||||
| 						<method-btn | ||||
| 							v-if="!isdetail" | ||||
| @@ -123,15 +125,15 @@ | ||||
| 					<pagination | ||||
| 						v-show="listQuery.total > 0" | ||||
| 						:total="listQuery.total" | ||||
| 						:page.sync="listQuery.current" | ||||
| 						:limit.sync="listQuery.size" | ||||
| 						:page.sync="listQuery.pageNo" | ||||
| 						:limit.sync="listQuery.pageSize" | ||||
| 						:page-sizes="[5, 10, 15]" | ||||
| 						@pagination="getList" /> | ||||
| 				</div> | ||||
| 			</div> | ||||
| 		</div> | ||||
|  | ||||
| 		<div style="position: absolute; bottom: 24px; right: 24px"> | ||||
| 		<!-- <div style="position: absolute; bottom: 24px; right: 24px"> | ||||
| 			<el-button style="margin-right: 10px" @click="goback()">返回</el-button> | ||||
| 			<el-button v-if="isdetail" type="primary" @click="goEdit()"> | ||||
| 				编辑 | ||||
| @@ -145,6 +147,14 @@ | ||||
| 					添加属性 | ||||
| 				</el-button> | ||||
| 			</span> | ||||
| 		</div> --> | ||||
|  | ||||
| 		<div class="drawer-body__footer"> | ||||
| 			<el-button style="" @click="goback()">取消</el-button> | ||||
| 			<el-button v-if="isdetail" type="primary" @click="goEdit()"> | ||||
| 				编辑 | ||||
| 			</el-button> | ||||
| 			<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button> | ||||
| 		</div> | ||||
|  | ||||
| 		<product-attr-add | ||||
| @@ -250,12 +260,12 @@ export default { | ||||
| 					}, | ||||
| 				], | ||||
| 				area: [ | ||||
| 					// { | ||||
| 					// 	type: 'float', | ||||
| 					// 	message: '单位平方数为浮点类型', | ||||
| 					// 	trigger: 'blur', | ||||
| 					// 	transfom: 'val => Float(val)', | ||||
| 					// }, | ||||
| 					{ | ||||
| 						type: 'number', | ||||
| 						message: '请输入正确的数值', | ||||
| 						trigger: 'change', | ||||
| 						transform: (val) => Number(val), | ||||
| 					}, | ||||
| 				], | ||||
| 				processTime: [ | ||||
| 					{ | ||||
| @@ -263,12 +273,12 @@ export default { | ||||
| 						message: '完成单位产品用时不能为空', | ||||
| 						trigger: 'blur', | ||||
| 					}, | ||||
| 					// { | ||||
| 					// 	type: 'number', | ||||
| 					// 	message: '完成单位产品用时为浮点类型', | ||||
| 					// 	trigger: 'blur', | ||||
| 					// 	transfom: 'val => Number(val)', | ||||
| 					// }, | ||||
| 					{ | ||||
| 						type: 'number', | ||||
| 						message: '请输入正确的数值', | ||||
| 						trigger: 'blur', | ||||
| 						transform: (val) => Number(val), | ||||
| 					}, | ||||
| 				], | ||||
| 			}, | ||||
| 			isdetail: false, | ||||
| @@ -277,6 +287,7 @@ export default { | ||||
| 	methods: { | ||||
| 		initData() { | ||||
| 			this.productAttributeList.splice(0); | ||||
| 			this.listQuery.total = 0; | ||||
| 		}, | ||||
| 		init(id, isdetail) { | ||||
| 			this.initData(); | ||||
| @@ -304,12 +315,10 @@ export default { | ||||
|  | ||||
| 		getList() { | ||||
| 			// 获取产品的属性列表 | ||||
| 			const params = { | ||||
| 				pageSize: 10, | ||||
| 				pageNo: 1, | ||||
| 			getProductAttrPage({ | ||||
| 				...this.listQuery, | ||||
| 				productId: this.dataForm.id, | ||||
| 			}; | ||||
| 			getProductAttrPage(params).then((response) => { | ||||
| 			}).then((response) => { | ||||
| 				this.productAttributeList = response.data.list; | ||||
| 				this.listQuery.total = response.data.total; | ||||
| 			}); | ||||
| @@ -390,6 +399,8 @@ export default { | ||||
| <style scoped> | ||||
| .drawer >>> .el-drawer { | ||||
| 	border-radius: 8px 0 0 8px; | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| } | ||||
|  | ||||
| .drawer >>> .el-form-item__label { | ||||
| @@ -400,14 +411,20 @@ export default { | ||||
| 	margin: 0; | ||||
| 	padding: 32px 32px 24px; | ||||
| 	border-bottom: 1px solid #dcdfe6; | ||||
| 	margin-bottom: 30px; | ||||
| } | ||||
| .drawer >>> .el-drawer__body { | ||||
| 	flex: 1; | ||||
| 	height: 1px; | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| } | ||||
|  | ||||
| .drawer >>> .content { | ||||
| 	padding: 0 24px 30px; | ||||
| 	padding: 30px 24px; | ||||
| 	flex: 1; | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	height: 100%; | ||||
| 	/* height: 100%; */ | ||||
| } | ||||
|  | ||||
| .drawer >>> .visual-part { | ||||
| @@ -422,4 +439,10 @@ export default { | ||||
| .drawer >>> .attr-list { | ||||
| 	padding: 0 16px; | ||||
| } | ||||
|  | ||||
| .drawer-body__footer { | ||||
| 	display: flex; | ||||
| 	justify-content: flex-end; | ||||
| 	padding: 18px; | ||||
| } | ||||
| </style> | ||||
|   | ||||
| @@ -1,8 +1,8 @@ | ||||
| <!-- | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-01 14:55:51 | ||||
|  * @LastEditors: zwq | ||||
|  * @LastEditTime: 2023-08-03 15:22:53 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-10-13 10:27:00 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| @@ -50,30 +50,25 @@ import { | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'code', | ||||
| 		label: '产品编码', | ||||
| 		align: 'center', | ||||
| 		label: '产品编码' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'name', | ||||
| 		label: '产品名称', | ||||
| 		align: 'center', | ||||
| 		label: '产品名称' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'specifications', | ||||
| 		label: '规格', | ||||
| 		align: 'center', | ||||
| 		label: '规格' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'unitDictValue', | ||||
| 		label: '单位', | ||||
| 		align: 'center', | ||||
| 		subcomponent: unitDict, | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'createTime', | ||||
| 		label: '创建时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 		filter: parseTime | ||||
| 	}, | ||||
| ]; | ||||
|  | ||||
| @@ -127,14 +122,14 @@ export default { | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '重置', | ||||
| 					name: 'reset', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: 'separate', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	type: 'button', | ||||
| 				// 	btnName: '重置', | ||||
| 				// 	name: 'reset', | ||||
| 				// }, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
|   | ||||
| @@ -7,53 +7,84 @@ | ||||
| --> | ||||
| <template> | ||||
| 	<el-form | ||||
| 		class="dialog-inner__form" | ||||
| 		:model="dataForm" | ||||
| 		:rules="dataRule" | ||||
| 		ref="dataForm" | ||||
| 		@keyup.enter.native="dataFormSubmit()" | ||||
| 		label-width="90px"> | ||||
| 		<el-form-item label="产线编码" prop="code"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.code" | ||||
| 				clearable | ||||
| 				placeholder="请输入产线编码" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="产线名称" prop="name"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.name" | ||||
| 				clearable | ||||
| 				placeholder="请输入产线名称" /> | ||||
| 		</el-form-item> | ||||
|     <el-form-item prop="factoryId" label="工厂名称"> | ||||
|       <el-select | ||||
|       v-model="dataForm.factoryId" filterable clearable placeholder="请选择工厂"> | ||||
|         <el-option | ||||
|           v-for="item in urlOptions.optionArr.arr0" | ||||
|           :key="item.id" | ||||
|           :label="item.name" | ||||
|           :value="item.id" | ||||
|         > | ||||
|         </el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
| 		<el-form-item label="产线TT值(h)" prop="tvalue"> | ||||
| 			<el-input v-model="dataForm.tvalue" clearable placeholder="请输入每小时下片数量" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="额外编码" prop="externalCode"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.externalCode" | ||||
| 				clearable | ||||
| 				placeholder="请输入额外编码" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="描述" prop="description"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.description" | ||||
| 				type="textarea" | ||||
| 				placeholder="请输入内容" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="备注" prop="remark"> | ||||
| 			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||
| 		</el-form-item> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="产线编码" prop="code"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.code" | ||||
| 						clearable | ||||
| 						placeholder="请输入产线编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="产线名称" prop="name"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.name" | ||||
| 						clearable | ||||
| 						placeholder="请输入产线名称" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item prop="factoryId" label="工厂名称"> | ||||
| 					<el-select | ||||
| 						v-model="dataForm.factoryId" | ||||
| 						filterable | ||||
| 						clearable | ||||
| 						placeholder="请选择工厂"> | ||||
| 						<el-option | ||||
| 							v-for="item in urlOptions.optionArr.arr0" | ||||
| 							:key="item.id" | ||||
| 							:label="item.name" | ||||
| 							:value="item.id"></el-option> | ||||
| 					</el-select> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="产线TT值(h)" prop="tvalue"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.tvalue" | ||||
| 						clearable | ||||
| 						placeholder="请输入每小时下片数量" /> | ||||
| 				</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> | ||||
| </template> | ||||
|  | ||||
| @@ -65,22 +96,20 @@ import { | ||||
| 	getProductionLine, | ||||
| 	getCode, | ||||
| } from '@/api/core/base/productionLine'; | ||||
| import { | ||||
| 	getFactoryPage, | ||||
| } from '@/api/core/base/factory'; | ||||
| import { getFactoryPage } from '@/api/core/base/factory'; | ||||
|  | ||||
| export default { | ||||
| 	mixins: [basicAdd], | ||||
| 	data() { | ||||
| 		return { | ||||
| 			urlOptions: { | ||||
|         getOption: true, | ||||
| 			  isGetCode: true, | ||||
|         codeURL: getCode, | ||||
| 				getOption: true, | ||||
| 				isGetCode: true, | ||||
| 				codeURL: getCode, | ||||
| 				createURL: createProductionLine, | ||||
| 				updateURL: updateProductionLine, | ||||
| 				infoURL: getProductionLine, | ||||
|         optionArrUrl: [getFactoryPage], | ||||
| 				optionArrUrl: [getFactoryPage], | ||||
| 			}, | ||||
| 			dataForm: { | ||||
| 				id: undefined, | ||||
| @@ -99,13 +128,26 @@ export default { | ||||
| 				name: [ | ||||
| 					{ required: true, message: '产线名称不能为空', trigger: 'blur' }, | ||||
| 				], | ||||
|         factoryId: [ | ||||
| 				factoryId: [ | ||||
| 					{ required: true, message: '工厂不能为空', trigger: 'change' }, | ||||
| 				], | ||||
| 				tvalue: [ | ||||
| 					{ | ||||
| 						type: 'number', | ||||
| 						message: '请输入正确的数字', | ||||
| 						trigger: 'change', | ||||
| 						transform: (val) => Number(val), | ||||
| 					}, | ||||
| 				], | ||||
| 			}, | ||||
| 		}; | ||||
| 	}, | ||||
| 	methods: { | ||||
| 	}, | ||||
| 	methods: {}, | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| <style scoped> | ||||
| .dialog-inner__form >>> .el-select { | ||||
| 	width: 100%; | ||||
| } | ||||
| </style> | ||||
|   | ||||
| @@ -29,7 +29,7 @@ | ||||
| 			@cancel="handleCancel" | ||||
| 			@confirm="handleConfirm" | ||||
| 			:before-close="handleCancel" | ||||
| 			width="70%"> | ||||
| 			width="50%"> | ||||
| 			<add-or-update | ||||
| 				ref="addOrUpdate" | ||||
| 				@refreshDataList="successSubmit"></add-or-update> | ||||
| @@ -52,45 +52,37 @@ import { | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'code', | ||||
| 		label: '产线编码', | ||||
| 		align: 'center', | ||||
| 		label: '产线编码' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'name', | ||||
| 		label: '产线名称', | ||||
| 		align: 'center', | ||||
| 		label: '产线名称' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'factoryName', | ||||
| 		label: '工厂', | ||||
| 		align: 'center', | ||||
| 		label: '工厂' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'externalCode', | ||||
| 		label: '额外编码', | ||||
| 		align: 'center', | ||||
| 		label: '额外编码' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'status', | ||||
| 		label: '当前状态', | ||||
| 		align: 'center', | ||||
| 		filter: codeFilter('lineStatus'), | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'description', | ||||
| 		label: '描述', | ||||
| 		align: 'center', | ||||
| 		label: '描述' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'remark', | ||||
| 		label: '备注', | ||||
| 		align: 'center', | ||||
| 		label: '备注' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'createTime', | ||||
| 		label: '创建时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 		filter: parseTime | ||||
| 	}, | ||||
| ]; | ||||
|  | ||||
| @@ -132,14 +124,14 @@ export default { | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '重置', | ||||
| 					name: 'reset', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: 'separate', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	type: 'button', | ||||
| 				// 	btnName: '重置', | ||||
| 				// 	name: 'reset', | ||||
| 				// }, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| @@ -173,7 +165,7 @@ export default { | ||||
| 		getDataList() { | ||||
| 			this.dataListLoading = true; | ||||
| 			this.urlOptions.getDataListURL(this.listQuery).then((response) => { | ||||
| 				this.total = response.data.total; | ||||
| 				this.listQuery.total = response.data.total; | ||||
| 				this.getStatus(response.data.list); | ||||
| 				this.dataListLoading = false; | ||||
| 			}); | ||||
| @@ -195,7 +187,7 @@ export default { | ||||
| 			switch (val.btnName) { | ||||
| 				case 'search': | ||||
| 					this.listQuery.pageNo = 1; | ||||
| 					this.listQuery.pageSize = 10;.7 | ||||
| 					this.listQuery.pageSize = 10; | ||||
| 					this.listQuery.name = val.name; | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
|   | ||||
| @@ -2,7 +2,7 @@ | ||||
|  * @Author: zwq | ||||
|  * @Date: 2023-08-01 13:52:10 | ||||
|  * @LastEditors: DY | ||||
|  * @LastEditTime: 2023-09-21 10:48:54 | ||||
|  * @LastEditTime: 2023-10-16 13:40:00 | ||||
|  * @Description: | ||||
| --> | ||||
| <template> | ||||
| @@ -12,33 +12,45 @@ | ||||
| 		ref="dataForm" | ||||
| 		@keyup.enter.native="dataFormSubmit()" | ||||
| 		label-width="90px"> | ||||
| 		<el-form-item label="工段编码" prop="code"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.code" | ||||
| 				clearable | ||||
| 				placeholder="请输入工段编码" /> | ||||
| 		</el-form-item> | ||||
| 		<el-form-item label="工段名称" prop="name"> | ||||
| 			<el-input | ||||
| 				v-model="dataForm.name" | ||||
| 				clearable | ||||
| 				placeholder="请输入工段名称" /> | ||||
| 		</el-form-item> | ||||
|     <el-form-item prop="productionLineId" label="产线"> | ||||
|       <el-select | ||||
|       v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线"> | ||||
|         <el-option | ||||
|           v-for="item in urlOptions.optionArr.arr0" | ||||
|           :key="item.id" | ||||
|           :label="item.name" | ||||
|           :value="item.id" | ||||
|         > | ||||
|         </el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
| 		<el-form-item label="排序" prop="sort"> | ||||
| 			<el-input-number v-model="dataForm.sort" :min="1" :max="100" clearable placeholder="请输入排序" /> | ||||
| 		</el-form-item> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工段编码" prop="code"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.code" | ||||
| 						clearable | ||||
| 						placeholder="请输入工段编码" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item label="工段名称" prop="name"> | ||||
| 					<el-input | ||||
| 						v-model="dataForm.name" | ||||
| 						clearable | ||||
| 						placeholder="请输入工段名称" /> | ||||
| 				</el-form-item> | ||||
| 			</el-col> | ||||
| 		</el-row> | ||||
| 		<el-row :gutter="20"> | ||||
| 			<el-col :span="12"> | ||||
| 				<el-form-item prop="productionLineId" label="产线"> | ||||
| 					<el-select | ||||
| 					v-model="dataForm.productionLineId" filterable clearable placeholder="请选择产线"> | ||||
| 						<el-option | ||||
| 							v-for="item in urlOptions.optionArr.arr0" | ||||
| 							:key="item.id" | ||||
| 							: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-input v-model="dataForm.remark" clearable placeholder="请输入备注" /> | ||||
| 		</el-form-item> | ||||
|   | ||||
| @@ -29,7 +29,7 @@ | ||||
| 			@cancel="handleCancel" | ||||
| 			@confirm="handleConfirm" | ||||
| 			:before-close="handleCancel" | ||||
| 			width="70%"> | ||||
| 			width="50%"> | ||||
| 			<add-or-update | ||||
| 				ref="addOrUpdate" | ||||
| 				@refreshDataList="successSubmit"></add-or-update> | ||||
| @@ -50,34 +50,28 @@ import { | ||||
| const tableProps = [ | ||||
| 	{ | ||||
| 		prop: 'code', | ||||
| 		label: '工段编码', | ||||
| 		align: 'center', | ||||
| 		label: '工段编码' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'name', | ||||
| 		label: '工段名称', | ||||
| 		align: 'center', | ||||
| 		label: '工段名称' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'productionLineName', | ||||
| 		label: '产线', | ||||
| 		align: 'center', | ||||
| 		label: '产线' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'sort', | ||||
| 		label: '排序', | ||||
| 		align: 'center', | ||||
| 		label: '排序' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'remark', | ||||
| 		label: '备注', | ||||
| 		align: 'center', | ||||
| 		label: '备注' | ||||
| 	}, | ||||
| 	{ | ||||
| 		prop: 'createTime', | ||||
| 		label: '创建时间', | ||||
| 		align: 'center', | ||||
| 		filter: parseTime, | ||||
| 		filter: parseTime | ||||
| 	}, | ||||
| ]; | ||||
|  | ||||
| @@ -119,14 +113,14 @@ export default { | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '重置', | ||||
| 					name: 'reset', | ||||
| 				}, | ||||
| 				// { | ||||
| 				// 	type: 'separate', | ||||
| 				// }, | ||||
| 				// { | ||||
| 				// 	type: 'button', | ||||
| 				// 	btnName: '重置', | ||||
| 				// 	name: 'reset', | ||||
| 				// }, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| <!-- | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-08-29 14:59:29 | ||||
|  * @LastEditTime: 2023-10-09 09:08:08 | ||||
|  * @LastEditTime: 2023-10-16 15:10:42 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
| --> | ||||
| @@ -12,6 +12,7 @@ | ||||
| 			ref="searchBarForm" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 		<base-table | ||||
| 			v-if="showData.length" | ||||
| 			class="right-aside" | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| @@ -22,6 +23,7 @@ | ||||
| 			@selection-change="selectChange" | ||||
| 			> | ||||
| 		</base-table> | ||||
| 		<div v-else class="no-data-bg"></div> | ||||
| 		<pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -117,6 +119,7 @@ export default { | ||||
|         pageNo: 1, | ||||
|         total: 1, | ||||
|       }, | ||||
| 			fileName: '', | ||||
|       exportLoading: false, | ||||
|       dataListLoading: false, | ||||
| 			dialogVisible: false, | ||||
| @@ -194,7 +197,8 @@ export default { | ||||
| 					type: 'button', | ||||
| 					btnName: '导出', | ||||
| 					name: 'export', | ||||
| 					color: 'warning', | ||||
| 					color: 'primary', | ||||
| 					plain: true | ||||
| 				} | ||||
| 			], | ||||
| 		}; | ||||
| @@ -207,6 +211,7 @@ export default { | ||||
| 		test() { | ||||
| 			var target = document.getElementsByClassName("right-aside")[0] | ||||
| 			target.style.background = '#FFFFFF' | ||||
| 			var that = this | ||||
| 			setTimeout(() => { | ||||
| 				html2canvas(target).then(function(canvas) { | ||||
| 						var contentWidth = canvas.width | ||||
| @@ -242,7 +247,7 @@ export default { | ||||
| 							} | ||||
| 						} | ||||
|  | ||||
| 						pdf.save('产线统计自动报表.pdf') | ||||
| 						pdf.save(that.fileName + '产线产量.pdf') | ||||
| 				}) | ||||
| 			}, 300) | ||||
| 		}, | ||||
| @@ -285,7 +290,7 @@ export default { | ||||
|       try { | ||||
|         FileSaver.saveAs(new Blob([exportTableOut], { | ||||
|           type: 'application/octet-stream' | ||||
|         }), '产线统计自动报表.xlsx') | ||||
|         }), this.fileName + '产线产量.xlsx') | ||||
|       } catch (e) { | ||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||
|       } | ||||
| @@ -310,6 +315,9 @@ export default { | ||||
| 					this.listQuery.reportType = val.reportType ? val.reportType : 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; | ||||
| 					if (val.timeVal && val.timeVal.length > 0) { | ||||
| 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||
|           } | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'export': | ||||
| @@ -327,7 +335,7 @@ export default { | ||||
| 					item.reportType = item.reportType === 1 ? '日' : item.reportType === 2 ? '周' : '月' | ||||
| 					return item | ||||
| 				}); | ||||
|         this.total = response.data.total; | ||||
|         this.listQuery.total = response.data.total; | ||||
|         this.dataListLoading = false; | ||||
| 				this.showData = this.tableData | ||||
|       }); | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| <!-- | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-08-29 14:59:29 | ||||
|  * @LastEditTime: 2023-10-09 15:14:42 | ||||
|  * @LastEditTime: 2023-10-16 15:18:23 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
| --> | ||||
| @@ -12,6 +12,7 @@ | ||||
| 			ref="searchBarForm" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 		<base-table | ||||
| 			v-if="showData.length" | ||||
| 			class="right-aside" | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| @@ -29,6 +30,7 @@ | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleClick" /> | ||||
| 		</base-table> | ||||
| 		<div v-else class="no-data-bg"></div> | ||||
| 		<pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -110,7 +112,7 @@ export default { | ||||
| 			showData: [], | ||||
| 			tableData: [], | ||||
| 			selectedList: [], | ||||
| 			fileName: [], | ||||
| 			fileName: '', | ||||
| 			formConfig: [ | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| @@ -145,7 +147,8 @@ export default { | ||||
| 					type: 'button', | ||||
| 					btnName: '导出', | ||||
| 					name: 'export', | ||||
| 					color: 'warning', | ||||
| 					color: 'primary', | ||||
| 					plain: true | ||||
| 				} | ||||
| 			], | ||||
| 		}; | ||||
| @@ -156,7 +159,7 @@ export default { | ||||
| 		} | ||||
| 		// const time = new Date() | ||||
| 		// this.formConfig[1].defaultSelect = [time, time] | ||||
| 		// this.getDataList() | ||||
| 		this.getDataList() | ||||
| 		this.getPdLineList() | ||||
| 	}, | ||||
| 	methods: { | ||||
| @@ -199,7 +202,7 @@ export default { | ||||
| 							} | ||||
| 						} | ||||
|  | ||||
| 						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_产线产量.pdf') | ||||
| 						pdf.save(that.fileName + '产线产量.pdf') | ||||
| 				}) | ||||
| 			}, 300) | ||||
| 		}, | ||||
| @@ -222,7 +225,7 @@ export default { | ||||
|       try { | ||||
|         FileSaver.saveAs(new Blob([exportTableOut], { | ||||
|           type: 'application/octet-stream' | ||||
|         }), this.fileName[0] + '-' + this.fileName[1] + '_产线产量.xlsx') | ||||
|         }), this.fileName + '产线产量.xlsx') | ||||
|       } catch (e) { | ||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||
|       } | ||||
| @@ -265,17 +268,10 @@ export default { | ||||
| 					this.listQuery.proLineId = val.line ? val.line : undefined; | ||||
| 					this.listQuery.startTime = val.timeVal ? new Date(val.timeVal[0]).getTime() : undefined; | ||||
| 					this.listQuery.endTime = val.timeVal ? new Date(val.timeVal[1]).getTime() : undefined; | ||||
| 					console.log('nihc 你好', val.timeVal) | ||||
| 					if (val.timeVal && val.timeVal.length > 0) { | ||||
| 						this.fileName[0] = val.timeVal[0].slice(0, 10) | ||||
| 						this.fileName[1] = val.timeVal[1].slice(0, 10) | ||||
|             this.getDataList(); | ||||
|           } else { | ||||
|             this.$message({ | ||||
|               message: '请选择时间', | ||||
|               type: 'warning' | ||||
|             }); | ||||
| 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||
|           } | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'export': | ||||
| 					this.handleExport(); | ||||
| @@ -289,7 +285,7 @@ export default { | ||||
|       this.dataListLoading = true; | ||||
|       this.urlOptions.getDataListURL(this.listQuery).then(response => { | ||||
|         this.tableData = response.data; | ||||
|         this.total = response.data.total; | ||||
|         this.listQuery.total = response.data.length; | ||||
|         this.dataListLoading = false; | ||||
| 				this.showData = this.tableData | ||||
|       }); | ||||
|   | ||||
| @@ -11,13 +11,14 @@ | ||||
| 			ref="search-bar" /> | ||||
| 		<el-skeleton v-if="initing" :rows="6" animated /> | ||||
| 		<!-- :span-method="mergeColumnHandler" --> | ||||
| 		<div v-else :class="{ 'no-data-bg': !tableData || tableData.length == 0 }"> | ||||
| 		<base-table | ||||
| 			v-else | ||||
| 		v-if="tableData && tableData.length > 0" | ||||
| 			:table-props="tableProps" | ||||
| 			:table-data="tableData" | ||||
| 			@emitFun="handleEmitFun"></base-table> | ||||
| 		<!-- :page="queryParams.pageNo" | ||||
| 			:limit="queryParams.pageSize" --> | ||||
| 			@emitFun="handleEmitFun" | ||||
| 		/> | ||||
| 		</div> | ||||
| 	</div> | ||||
| </template> | ||||
|  | ||||
| @@ -65,10 +66,10 @@ export default { | ||||
| 						label: times.slice(0, 10) + ' ' + times.slice(11), | ||||
| 						align: 'center', | ||||
| 						children: [ | ||||
| 							{ prop: times + '_in', label: '投入数量', align: 'center' }, | ||||
| 							{ prop: times + '_out', label: '产出数量', align: 'center' }, | ||||
| 							{ prop: times + '_junk', label: '报废数量', align: 'center' }, | ||||
| 							{ prop: times + '_area', label: '产出面积', align: 'center' } | ||||
| 							{ prop: times + '_in', label: '投入数量' }, | ||||
| 							{ prop: times + '_out', label: '产出数量' }, | ||||
| 							{ prop: times + '_junk', label: '报废数量' }, | ||||
| 							{ prop: times + '_area', label: '产出面积' } | ||||
| 						] | ||||
| 					} | ||||
| 					this.arr.push(subprop) | ||||
| @@ -149,14 +150,14 @@ export default { | ||||
|           { | ||||
|             prop: 'proLineName', | ||||
|             label: '生产线', | ||||
|             align: 'center', | ||||
| 						fixed: 'left' | ||||
| 						fixed: 'left', | ||||
| 						showOverflowTooltip: true | ||||
|           }, | ||||
|           { | ||||
|             prop: 'spec', | ||||
|             label: '产品规格', | ||||
|             align: 'center', | ||||
| 						fixed: 'left' | ||||
| 						fixed: 'left', | ||||
| 						showOverflowTooltip: true | ||||
|           } | ||||
| 				] | ||||
| 				this.buildProps(res.data.nameData); | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| <!-- | ||||
|  * @Author: Do not edit | ||||
|  * @Date: 2023-08-29 14:59:29 | ||||
|  * @LastEditTime: 2023-10-08 10:51:49 | ||||
|  * @LastEditTime: 2023-10-16 15:19:04 | ||||
|  * @LastEditors: DY | ||||
|  * @Description:  | ||||
| --> | ||||
| @@ -13,6 +13,7 @@ | ||||
| 			ref="searchBarForm" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 		<base-table | ||||
| 			v-if="showData.length" | ||||
| 			class="right-aside" | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| @@ -30,6 +31,7 @@ | ||||
| 				:method-list="tableBtn" | ||||
| 				@clickBtn="handleClick" /> | ||||
| 		</base-table> | ||||
| 		<div v-else class="no-data-bg"></div> | ||||
| 		<pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -129,6 +131,7 @@ export default { | ||||
| 			tableBtn: [], | ||||
| 			tableData: [], | ||||
| 			showData: [], | ||||
| 			fileName: '', | ||||
| 			formConfig: [ | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| @@ -187,7 +190,8 @@ export default { | ||||
| 					type: 'button', | ||||
| 					btnName: '导出', | ||||
| 					name: 'export', | ||||
| 					color: 'warning', | ||||
| 					color: 'primary', | ||||
| 					plain: true | ||||
| 				} | ||||
| 			], | ||||
| 		}; | ||||
| @@ -200,6 +204,7 @@ export default { | ||||
| 		test() { | ||||
| 			var target = document.getElementsByClassName("right-aside")[0] | ||||
| 			target.style.background = '#FFFFFF' | ||||
| 			var that = this | ||||
| 			setTimeout(() => { | ||||
| 				html2canvas(target).then(function(canvas) { | ||||
| 						var contentWidth = canvas.width | ||||
| @@ -235,7 +240,7 @@ export default { | ||||
| 							} | ||||
| 						} | ||||
|  | ||||
| 						pdf.save('工段统计自动报表.pdf') | ||||
| 						pdf.save(that.fileName + '工段统计.pdf') | ||||
| 				}) | ||||
| 			}, 300) | ||||
| 		}, | ||||
| @@ -258,7 +263,7 @@ export default { | ||||
|       try { | ||||
|         FileSaver.saveAs(new Blob([exportTableOut], { | ||||
|           type: 'application/octet-stream' | ||||
|         }), '工段统计自动报表.xlsx') | ||||
|         }), this.fileName + '工段统计.xlsx') | ||||
|       } catch (e) { | ||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||
|       } | ||||
| @@ -307,6 +312,9 @@ export default { | ||||
| 					this.listQuery.reportType = val.reportType ? val.reportType : 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; | ||||
| 					if (val.timeVal && val.timeVal.length > 0) { | ||||
| 						this.fileName = val.timeVal[0].slice(0, 10) + '-' + val.timeVal[1].slice(0, 10) + '_' | ||||
|           } | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'export': | ||||
| @@ -325,7 +333,7 @@ export default { | ||||
| 					return item | ||||
| 				}); | ||||
| 				this.showData = this.tableData | ||||
|         this.total = response.data.total; | ||||
|         this.listQuery.total = response.data.total; | ||||
|         this.dataListLoading = false; | ||||
|       }); | ||||
|     }, | ||||
|   | ||||
| @@ -3,15 +3,20 @@ | ||||
| 		<search-bar | ||||
| 			:formConfigs="formConfig" | ||||
| 			ref="searchBarForm" | ||||
| 			@select-changed="handleSearchBarChanged" | ||||
| 			@headBtnClick="buttonClick" /> | ||||
| 		<base-table | ||||
| 			v-if="showData.length" | ||||
| 			class="right-aside" | ||||
| 			v-loading="dataListLoading" | ||||
| 			:table-props="tableProps" | ||||
| 			:table-data="showData" | ||||
| 			:page="listQuery.pageNo" | ||||
| 			:limit="listQuery.pageSize" | ||||
| 			:selectWidth="55" | ||||
| 			:table-data="showData" | ||||
| 			@selection-change="selectChange" | ||||
| 		/> | ||||
| 		<div v-else class="no-data-bg"></div> | ||||
| 		<pagination | ||||
| 			:limit.sync="listQuery.pageSize" | ||||
| 			:page.sync="listQuery.pageNo" | ||||
| @@ -45,38 +50,31 @@ import html2canvas from 'html2canvas' | ||||
| const tableProps = [ | ||||
| 	{ | ||||
|     prop: 'proLineName', | ||||
| 		label: '产线名称', | ||||
| 		align: 'center', | ||||
| 		label: '产线名称' | ||||
| 	}, | ||||
|   { | ||||
|     prop: 'sectionName', | ||||
|     label: '工段名称', | ||||
|     align: 'center', | ||||
|     label: '工段名称' | ||||
|   }, | ||||
|   { | ||||
|     prop: 'inputNum', | ||||
|     label: '进片数量/片', | ||||
|     align: 'center', | ||||
|     label: '进片数量/片' | ||||
|   }, | ||||
|   { | ||||
|     prop: 'outputNum', | ||||
|     label: '出片数量/片', | ||||
|     align: 'center', | ||||
|     label: '出片数量/片' | ||||
|   }, | ||||
|   { | ||||
|     prop: 'lossNum', | ||||
|     label: '损耗数量/片', | ||||
|     align: 'center', | ||||
|     label: '损耗数量/片' | ||||
|   }, | ||||
|   { | ||||
|     prop: 'lossArea', | ||||
|     label: '损耗面积/m²', | ||||
|     align: 'center', | ||||
|     label: '损耗面积/m²' | ||||
|   }, | ||||
|   { | ||||
|     prop: 'lossRate', | ||||
|     label: '损耗比例/%', | ||||
|     align: 'center', | ||||
|     label: '损耗比例/%' | ||||
|   } | ||||
| ]; | ||||
|  | ||||
| @@ -110,6 +108,7 @@ export default { | ||||
|           param: 'proLineId', | ||||
| 					defaultSelect: '', | ||||
| 					filterable: true, | ||||
| 					onchange: true, | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'select', | ||||
| @@ -132,15 +131,20 @@ export default { | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '搜索', | ||||
| 					btnName: '查询', | ||||
| 					name: 'search', | ||||
| 					color: 'primary', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'separate', | ||||
| 				}, | ||||
| 				{ | ||||
| 					type: 'button', | ||||
| 					btnName: '导出', | ||||
| 					name: 'export', | ||||
| 				}, | ||||
| 					color: 'primary', | ||||
| 					plain: true | ||||
| 				} | ||||
| 			], | ||||
| 		}; | ||||
| 	}, | ||||
| @@ -151,9 +155,39 @@ export default { | ||||
|     // this.getDataList() | ||||
| 	}, | ||||
| 	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() { | ||||
| 			var target = document.getElementsByClassName("right-aside")[0] | ||||
| 			target.style.background = '#FFFFFF' | ||||
| 			var that = this | ||||
| 			setTimeout(() => { | ||||
| 				html2canvas(target).then(function(canvas) { | ||||
| 						var contentWidth = canvas.width | ||||
| @@ -189,7 +223,7 @@ export default { | ||||
| 							} | ||||
| 						} | ||||
|  | ||||
| 						pdf.save('工段统计数据查询报表.pdf') | ||||
| 						pdf.save(that.fileName[0] + '-' + that.fileName[1] + '_工段统计.pdf') | ||||
| 				}) | ||||
| 			}, 300) | ||||
| 		}, | ||||
| @@ -212,7 +246,7 @@ export default { | ||||
|       try { | ||||
|         FileSaver.saveAs(new Blob([exportTableOut], { | ||||
|           type: 'application/octet-stream' | ||||
|         }), '工段统计数据查询报表.xlsx') | ||||
|         }), this.fileName[0] + '-' + this.fileName[1] + '_工段统计.xlsx') | ||||
|       } catch (e) { | ||||
|         if (typeof console !== 'undefined') console.log(e, exportTableOut) | ||||
|       } | ||||
| @@ -293,10 +327,9 @@ export default { | ||||
|           this.listQuery.sectionId = val.sectionId ? val.sectionId : 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.fileName[0] = val.timeSlot[0] | ||||
| 					this.fileName[1] = val.timeSlot[1] | ||||
| 					console.log('wfjmmki文件名称', this.fileName) | ||||
| 					if (val.timeSlot) { | ||||
| 					if (val.timeSlot && val.timeSlot.length > 0) { | ||||
| 						this.fileName[0] = val.timeSlot[0].slice(0, 10) | ||||
| 						this.fileName[1] = val.timeSlot[1].slice(0, 10) | ||||
|             this.getDataList() | ||||
|           } else { | ||||
|             this.$message({ | ||||
| @@ -315,7 +348,14 @@ export default { | ||||
| 					this.getDataList(); | ||||
| 					break; | ||||
| 				case 'export': | ||||
| 					this.handleExport(); | ||||
| 					if (val.timeSlot && val.timeSlot.length > 0) { | ||||
| 						this.handleExport(); | ||||
|           } else { | ||||
|             this.$message({ | ||||
|               message: '请选择时间', | ||||
|               type: 'warning' | ||||
|             }); | ||||
|           } | ||||
| 					break; | ||||
| 				default: | ||||
| 					console.log(val); | ||||
|   | ||||
| @@ -97,6 +97,22 @@ export default { | ||||
|           trigger: 'axis', | ||||
|           axisPointer: { | ||||
|             type: 'shadow' | ||||
|           }, | ||||
|           formatter: function(params) { | ||||
|             return ( | ||||
|               params[0].axisValue +  | ||||
|               `<br>` + | ||||
|               params.map((item) => { | ||||
|                 let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>` | ||||
|                 let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>` | ||||
| 						let value = item.value ? item.value : '-' | ||||
| 						let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>` | ||||
| 						return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px"> | ||||
| 									<span>${str}${seriesNameStr}</span> | ||||
| 									<span>${valueStr}</span> | ||||
| 								</span>` | ||||
|               }).join(``) | ||||
|             ) | ||||
|           } | ||||
|         }, | ||||
|         grid: { | ||||
| @@ -106,7 +122,11 @@ export default { | ||||
|           containLabel: true | ||||
|         }, | ||||
|         legend: { | ||||
|           data: legendData | ||||
|           data: legendData, | ||||
|           right: '1%', | ||||
|           icon: 'rect', | ||||
|           itemHeight: 8, | ||||
|           itemWidth: 8 | ||||
|         }, | ||||
|         xAxis: { | ||||
|           type: 'category', | ||||
|   | ||||
| @@ -103,7 +103,8 @@ export default { | ||||
|           containLabel: true | ||||
|         }, | ||||
|         legend: { | ||||
|           data: legendData | ||||
|           data: legendData, | ||||
|           right: '1%' | ||||
|         }, | ||||
|         xAxis: { | ||||
|           type: 'category', | ||||
|   | ||||
| @@ -425,7 +425,7 @@ export default { | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style> | ||||
| <style lang='scss'> | ||||
| /* 时间整点 */ | ||||
| .noneMinute .el-time-spinner__wrapper { | ||||
|   width: 100%; | ||||
| @@ -433,6 +433,16 @@ export default { | ||||
| .noneMinute .el-scrollbar:nth-of-type(2) { | ||||
|   display: none; | ||||
| } | ||||
| .demo-form-inline { | ||||
|   .el-date-editor .el-range__icon { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
|   .el-input__prefix .el-icon-date { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style lang="scss" scoped> | ||||
| .demo-form-inline { | ||||
| @@ -446,8 +456,6 @@ export default { | ||||
|     margin-top: 12px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style scoped> | ||||
| .searchBarBox .foldClass { | ||||
|   position: absolute; | ||||
|   top: 14px; | ||||
|   | ||||
| @@ -15,7 +15,7 @@ export default { | ||||
|     return { | ||||
|       chartDom: '', | ||||
|       chart: '', | ||||
|       chartHeight: this.tableHeight(350) | ||||
|       chartHeight: this.tableHeight(370) | ||||
|     } | ||||
|   }, | ||||
|   props: { | ||||
| @@ -34,7 +34,7 @@ export default { | ||||
|   }, | ||||
|   mounted() { | ||||
|     window.addEventListener('resize', () => { | ||||
|       this.chartHeight = this.tableHeight(350) | ||||
|       this.chartHeight = this.tableHeight(370) | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
| @@ -86,17 +86,35 @@ export default { | ||||
|         } | ||||
|       } | ||||
|       var option = { | ||||
|         // title: { | ||||
|         //   text: 'World Population' | ||||
|         // }, | ||||
|         color:['#288AFF','#8EF0AB'], | ||||
|         tooltip: { | ||||
|           trigger: 'axis', | ||||
|           axisPointer: { | ||||
|             type: 'shadow' | ||||
|           }, | ||||
|           formatter: function(params) { | ||||
|             return ( | ||||
|               params[0].axisValue +  | ||||
|               `<br>` + | ||||
|               params.map((item) => { | ||||
|                 let str = `<span style="display:inline-block;width:8px;height:8px;margin: 0 8px 0 -3px;border-radius:2px;background-color:${item.color};"></span>` | ||||
|                 let seriesNameStr = `<span style="display:inline-block;">${item.seriesName}</span>` | ||||
| 						let value = item.value ? item.value : '-' | ||||
| 						let valueStr = `<span style="display:inline-block;margin-left:10px;color:rgba(0,0,0,0.45);">${value}</span>` | ||||
| 						return `<span style="display:flex; justify-content:space-between; margin-bottom: 2px"> | ||||
| 									<span>${str}${seriesNameStr}</span> | ||||
| 									<span>${valueStr}</span> | ||||
| 								</span>` | ||||
|               }).join(``) | ||||
|             ) | ||||
|           } | ||||
|         }, | ||||
|         legend: {}, | ||||
|         legend: { | ||||
|           right: '1%', | ||||
|           icon: 'rect', | ||||
|           itemHeight: 8, | ||||
|           itemWidth: 8 | ||||
|         }, | ||||
|         grid: { | ||||
|           left: '1%', | ||||
|           right: '1%', | ||||
|   | ||||
| @@ -194,13 +194,23 @@ export default { | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style> | ||||
| <style lang='scss'> | ||||
| /* 级联选择器 */ | ||||
| .cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio { | ||||
|   display: none; | ||||
| } | ||||
| .demo-form-inline { | ||||
|   .el-date-editor .el-range__icon { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
|   .el-input__prefix .el-icon-date { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style scoped> | ||||
| <style lang="scss" scoped> | ||||
| .separateStyle { | ||||
|   display: inline-block; | ||||
|   width: 1px; | ||||
| @@ -208,8 +218,6 @@ export default { | ||||
|   background: #E8E8E8; | ||||
|   vertical-align: middle; | ||||
| } | ||||
| </style> | ||||
| <style lang="scss" scoped> | ||||
| .demo-form-inline { | ||||
|   .blue-block { | ||||
|     display: inline-block; | ||||
|   | ||||
| @@ -9,7 +9,8 @@ | ||||
|         :table-data="list" | ||||
|         class="qoq-out-table" | ||||
|       /> | ||||
|       <div style='width: 100%;height: 300px;padding-top: 30px;'> | ||||
|       <div class="chartTitle">环比分析图</div> | ||||
|       <div style='width: 100%'> | ||||
|         <line-chart ref="analysisLineChart" :chartData="chartData"/> | ||||
|       </div> | ||||
|     </div> | ||||
| @@ -111,4 +112,21 @@ export default { | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| </script> | ||||
| <style lang='scss' scoped> | ||||
| .chartTitle { | ||||
|   font-size: 16px; | ||||
|   color: #000; | ||||
|   margin-top: 20px; | ||||
| } | ||||
| .chartTitle::before { | ||||
|   content: ''; | ||||
|   display: inline-block; | ||||
|   width: 4px; | ||||
|   height: 18px; | ||||
|   background-color: #0B58FF; | ||||
|   border-radius: 1px; | ||||
|   margin-right: 8px; | ||||
|   vertical-align: bottom; | ||||
| } | ||||
| </style> | ||||
| @@ -68,12 +68,6 @@ export default { | ||||
|       } | ||||
|       var option = { | ||||
|         color:['#288AFF'], | ||||
|         tooltip: { | ||||
|           trigger: 'axis', | ||||
|           axisPointer: { | ||||
|             type: 'shadow' | ||||
|           } | ||||
|         }, | ||||
|         grid: { | ||||
|           left: '4%', | ||||
|           right: '1%', | ||||
|   | ||||
| @@ -70,9 +70,9 @@ export default { | ||||
|  | ||||
|       var option = { | ||||
|         color:['#288AFF'], | ||||
|         tooltip: { | ||||
|           trigger: 'axis' | ||||
|         }, | ||||
|         // tooltip: { | ||||
|         //   trigger: 'axis' | ||||
|         // }, | ||||
|         grid: { | ||||
|           left: '4%', | ||||
|           right: '1%', | ||||
|   | ||||
| @@ -385,7 +385,7 @@ export default { | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style> | ||||
| <style lang='scss'> | ||||
| /* 级联选择器 */ | ||||
| .cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio { | ||||
|   display: none; | ||||
| @@ -397,6 +397,16 @@ export default { | ||||
| .noneMinute .el-scrollbar:nth-of-type(2) { | ||||
|   display: none; | ||||
| } | ||||
| .demo-form-inline { | ||||
|   .el-date-editor .el-range__icon { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
|   .el-input__prefix .el-icon-date { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style lang="scss" scoped> | ||||
| .demo-form-inline { | ||||
| @@ -410,8 +420,6 @@ export default { | ||||
|     margin-top: 12px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style scoped> | ||||
| .searchBarBox .foldClass { | ||||
|   position: absolute; | ||||
|   top: 14px; | ||||
|   | ||||
| @@ -77,7 +77,8 @@ export default { | ||||
|       var option = { | ||||
|         color:['#FFDC94','#8EF0AB','#63BDFF','#288AFF','#7164FF','#FF6860','#FF9747','#B0EB42','#D680FF','#0043D2'], | ||||
|         legend: { | ||||
|           data: keys | ||||
|           data: keys, | ||||
|           right:'1%' | ||||
|         }, | ||||
|         tooltip: { | ||||
|           trigger: 'axis' | ||||
|   | ||||
| @@ -125,7 +125,31 @@ export default { | ||||
|       this.$emit('submit', this.queryParams) | ||||
|     }, | ||||
|     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) {// 本月最后一天 | ||||
|       let year = moment(timeStamp).format('YYYY') | ||||
| @@ -143,19 +167,20 @@ export default { | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style> | ||||
| <style lang='scss'> | ||||
| /* 级联选择器 */ | ||||
| .cascaderParent .el-cascader-panel .el-scrollbar:first-child .el-radio { | ||||
|   display: none; | ||||
| } | ||||
| </style> | ||||
| <style scoped> | ||||
| .separateStyle { | ||||
|   display: inline-block; | ||||
|   width: 1px; | ||||
|   height: 24px; | ||||
|   background: #E8E8E8; | ||||
|   vertical-align: middle; | ||||
| .demo-form-inline { | ||||
|   .el-date-editor .el-range__icon { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
|   .el-input__prefix .el-icon-date { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| <style lang="scss" scoped> | ||||
| @@ -170,4 +195,11 @@ export default { | ||||
|     margin-top: 10px; | ||||
|   } | ||||
| } | ||||
| .separateStyle { | ||||
|   display: inline-block; | ||||
|   width: 1px; | ||||
|   height: 24px; | ||||
|   background: #E8E8E8; | ||||
|   vertical-align: middle; | ||||
| } | ||||
| </style> | ||||
| @@ -3,6 +3,7 @@ | ||||
|     <!-- 搜索工作栏 --> | ||||
|     <search-area @submit="getList" @exportD="exportData"/> | ||||
|     <div v-show='chartData.length'> | ||||
|       <div class="chartTitle">同比分析图</div> | ||||
|       <div style='width: 100%;height: 400px;'> | ||||
|         <line-chart ref="analysisLineChart" :chartData="chartData"/> | ||||
|       </div> | ||||
| @@ -33,12 +34,12 @@ export default { | ||||
|       chartData: [], | ||||
|       tableProps: [], | ||||
|       list: [], | ||||
|       tableH: this.tableHeight(600) | ||||
|       tableH: this.tableHeight(640) | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     window.addEventListener('resize', () => { | ||||
|       this.tableH = this.tableHeight(600) | ||||
|       this.tableH = this.tableHeight(640) | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
| @@ -99,9 +100,10 @@ export default { | ||||
|       } | ||||
|       this.chartData = this.list | ||||
|     }, | ||||
|     exportData() { | ||||
|     exportData(val) { | ||||
|       if (this.list.length > 0) { | ||||
|         var wb = XLSX.utils.table_to_book(document.querySelector(".yoy-out-table")) | ||||
|         let fileName = val.name + "同比分析.xlsx" | ||||
|         var wbout = XLSX.write(wb, { | ||||
|             bookType: "xlsx", | ||||
|             bookSST: true, | ||||
| @@ -110,7 +112,7 @@ export default { | ||||
|         try { | ||||
|             FileSaver.saveAs( | ||||
|             new Blob([wbout], { type: "application/octet-stream" }), | ||||
|             "同比分析.xlsx" | ||||
|             fileName | ||||
|             ) | ||||
|         } catch (e) { | ||||
|             if (typeof console !== "undefined") console.log(e, wbout); | ||||
| @@ -122,4 +124,20 @@ export default { | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| </script> | ||||
| <style lang='scss' scoped> | ||||
| .chartTitle { | ||||
|   font-size: 16px; | ||||
|   color: #000; | ||||
| } | ||||
| .chartTitle::before { | ||||
|   content: ''; | ||||
|   display: inline-block; | ||||
|   width: 4px; | ||||
|   height: 18px; | ||||
|   background-color: #0B58FF; | ||||
|   border-radius: 1px; | ||||
|   margin-right: 8px; | ||||
|   vertical-align: bottom; | ||||
| } | ||||
| </style> | ||||
| @@ -130,7 +130,7 @@ export default { | ||||
|       this.plcTableName = data.plcTableName | ||||
|       this.objName = data.objName | ||||
|       this.getList() | ||||
|       if (title === 'view') { | ||||
|       if (title === 'detail') { | ||||
|         this.showBtn = false | ||||
|         this.tableBtn = [] | ||||
|       } else { | ||||
|   | ||||
| @@ -113,22 +113,22 @@ export default { | ||||
|       ], | ||||
|       tableProps, | ||||
|       tableBtn: [ | ||||
|         this.$auth.hasPermi('base:energy-plc-connect:bind') | ||||
|           ? { | ||||
|               type: 'connect', | ||||
|               btnName: '绑定' | ||||
|             } | ||||
|           : undefined, | ||||
|         { | ||||
|           type: 'detail', | ||||
|           btnName: '详情' | ||||
|         }, | ||||
|         this.$auth.hasPermi('base:energy-plc-connect:update') | ||||
|           ? { | ||||
|               type: 'edit', | ||||
|               btnName: '编辑' | ||||
|             } | ||||
|           : undefined, | ||||
|         { | ||||
|           type: 'view', | ||||
|           btnName: '查看' | ||||
|         }, | ||||
|         this.$auth.hasPermi('base:energy-plc-connect:bind') | ||||
|         ? { | ||||
|             type: 'connect', | ||||
|             btnName: '绑定' | ||||
|           } | ||||
|         : undefined, | ||||
|         this.$auth.hasPermi('base:energy-plc-connect:delete') | ||||
|           ? { | ||||
|               type: 'delete', | ||||
| @@ -205,10 +205,10 @@ export default { | ||||
|         case 'delete': | ||||
|           this.handleDelete(val.data) | ||||
|           break | ||||
|         case 'view': | ||||
|         case 'detail': | ||||
|           this.paramVisible = true | ||||
|           this.$nextTick(() => { | ||||
|             this.$refs.plcParam.init(val.data, 'view') | ||||
|             this.$refs.plcParam.init(val.data, 'detail') | ||||
|           }) | ||||
|           break | ||||
|         default: | ||||
|   | ||||
| @@ -1,54 +1,72 @@ | ||||
| <template> | ||||
|   <el-form ref="form" :rules="rules" label-width="110px" :model="form"> | ||||
|     <el-form-item label="监控对象" prop="objectId"> | ||||
|       <el-cascader | ||||
|         style='width: 100%;' | ||||
|         v-model="objIds" | ||||
|         :options="objList" | ||||
|         :props="{ checkStrictly: true, value: 'id', label: 'name' }" | ||||
|         popper-class="cascaderParent" | ||||
|         @change="selectObj" | ||||
|         clearable></el-cascader> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="能源类型" prop="energyTypeId"> | ||||
|       <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;" @change="toggleType"> | ||||
|         <el-option | ||||
|           v-for="item in this.energyTypeList" | ||||
|           :key="item.id" | ||||
|           :label="item.name" | ||||
|           :value="item.id"> | ||||
|         </el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="监控模式" prop="type"> | ||||
|       <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange"> | ||||
|         <el-option label="合并" :value= "1" ></el-option> | ||||
|         <el-option label="详细" :value= "2" ></el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="监控详细参数" prop="type" v-if="form.type === 2"> | ||||
|       <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail"> | ||||
|         <el-option | ||||
|           v-for="item in detailList" | ||||
|           :key="item.id" | ||||
|           :label="item.name" | ||||
|           :value="item.id"> | ||||
|         </el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="指标类型" prop="limitType"> | ||||
|       <el-select v-model="form.limitType" placeholder="请选择" style="width: 100%;"> | ||||
|         <el-option | ||||
|           v-for="item in getDictDatas(DICT_TYPE.MONITOR_INDEX_TYPE)" | ||||
|           :key="item.value" | ||||
|           :label="item.label" | ||||
|           :value="item.value"> | ||||
|         </el-option> | ||||
|       </el-select> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="消耗量阈值" prop="limitValue"> | ||||
|       <el-input-number v-model="form.limitValue" :min="0" :max="10000000000000000" style="width: 100%;"></el-input-number> | ||||
|     </el-form-item> | ||||
|     <el-row> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="监控对象" prop="objectId"> | ||||
|           <el-cascader | ||||
|             style='width: 100%;' | ||||
|             v-model="objIds" | ||||
|             :options="objList" | ||||
|             :props="{ checkStrictly: true, value: 'id', label: 'name' }" | ||||
|             popper-class="cascaderParent" | ||||
|             @change="selectObj" | ||||
|             clearable></el-cascader> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="能源类型" prop="energyTypeId"> | ||||
|           <el-select v-model="form.energyTypeId" placeholder="请选择" style="width: 100%;" @change="toggleType"> | ||||
|             <el-option | ||||
|               v-for="item in this.energyTypeList" | ||||
|               :key="item.id" | ||||
|               :label="item.name" | ||||
|               :value="item.id"> | ||||
|             </el-option> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|     <el-row> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="监控模式" prop="type"> | ||||
|           <el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange"> | ||||
|             <el-option label="合并" :value= "1" ></el-option> | ||||
|             <el-option label="详细" :value= "2" ></el-option> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="监控详细参数" prop="type" v-if="form.type === 2"> | ||||
|           <el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail"> | ||||
|             <el-option | ||||
|               v-for="item in detailList" | ||||
|               :key="item.id" | ||||
|               :label="item.name" | ||||
|               :value="item.id"> | ||||
|             </el-option> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|     <el-row> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="指标类型" prop="limitType"> | ||||
|           <el-select v-model="form.limitType" placeholder="请选择" style="width: 100%;"> | ||||
|             <el-option | ||||
|               v-for="item in getDictDatas(DICT_TYPE.MONITOR_INDEX_TYPE)" | ||||
|               :key="item.value" | ||||
|               :label="item.label" | ||||
|               :value="item.value"> | ||||
|             </el-option> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="消耗量阈值" prop="limitValue"> | ||||
|           <el-input-number v-model="form.limitValue" :min="0" :max="10000000000000000" style="width: 100%;"></el-input-number> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|   </el-form> | ||||
| </template> | ||||
| <script> | ||||
|   | ||||
| @@ -124,7 +124,7 @@ export default { | ||||
|       this.energyType = data.energyType | ||||
|       this.energyTypeId = data.energyTypeId | ||||
|       this.getList() | ||||
|       if (title === 'view') { | ||||
|       if (title === 'detail') { | ||||
|         this.showBtn = false | ||||
|         this.tableBtn = [] | ||||
|       } else { | ||||
|   | ||||
| @@ -111,22 +111,22 @@ export default { | ||||
|       ], | ||||
|       tableProps, | ||||
|       tableBtn: [ | ||||
|         this.$auth.hasPermi('monitoring:energy-statistics:update') | ||||
|           ? { | ||||
|               type: 'edit', | ||||
|               btnName: '编辑' | ||||
|             } | ||||
|           : undefined, | ||||
|         { | ||||
|           type: 'view', | ||||
|           btnName: '查看' | ||||
|         }, | ||||
|         this.$auth.hasPermi('monitoring:energy-statistics:bind') | ||||
|         ? { | ||||
|             type: 'connect', | ||||
|             btnName: '绑定' | ||||
|           } | ||||
|         : undefined, | ||||
|         { | ||||
|           type: 'detail', | ||||
|           btnName: '详情' | ||||
|         }, | ||||
|         this.$auth.hasPermi('monitoring:energy-statistics:update') | ||||
|           ? { | ||||
|               type: 'edit', | ||||
|               btnName: '编辑' | ||||
|             } | ||||
|           : undefined, | ||||
|         this.$auth.hasPermi('monitoring:energy-statistics:delete') | ||||
|           ? { | ||||
|               type: 'delete', | ||||
| @@ -199,9 +199,9 @@ export default { | ||||
|         case 'delete': | ||||
|           this.handleDelete(val.data) | ||||
|           break | ||||
|         case 'view': | ||||
|         case 'detail': | ||||
|           this.$nextTick(() => { | ||||
|             this.$refs.plcParam.init(val.data, 'view') | ||||
|             this.$refs.plcParam.init(val.data, 'detail') | ||||
|           }) | ||||
|           break | ||||
|         default: | ||||
|   | ||||
| @@ -43,7 +43,7 @@ export default { | ||||
| 					eq.okQuantity, | ||||
| 					eq.nokQuantity, | ||||
| 					eq.totalQuantity, | ||||
| 					eq.passRate.toFixed(4), | ||||
| 					eq.passRate?.toFixed(4), | ||||
| 				]); | ||||
| 			}); | ||||
| 			return { | ||||
|   | ||||
| @@ -29,7 +29,10 @@ | ||||
| 							@emitFun="handleEmitFun"></base-table> | ||||
| 					</el-tab-pane> | ||||
| 					<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> | ||||
| 							<LineChart v-if="list && list.length" :list="list" /> | ||||
| 							<div v-else class="no-data-bg"></div> | ||||
| @@ -87,6 +90,7 @@ export default { | ||||
| 					rangeSeparator: '-', | ||||
| 					startPlaceholder: '开始日期', | ||||
| 					endPlaceholder: '结束日期', | ||||
| 					defaultTime: ['00:00:00', '23:59:59'], | ||||
| 					param: 'recordTime', | ||||
| 					defaultSelect: [ | ||||
| 						new Date(y, m, d) | ||||
| @@ -246,7 +250,9 @@ export default { | ||||
| 	created() { | ||||
| 		this.fillLineOptions(); | ||||
| 		this.fillProductOptions(); | ||||
| 		this.getList(); | ||||
| 	}, | ||||
| 	mounted() { | ||||
| 		this.$refs['search-bar'].headBtnClick('search'); | ||||
| 	}, | ||||
| 	methods: { | ||||
| 		handleTabClick(tab, event) { | ||||
| @@ -307,12 +313,16 @@ export default { | ||||
| 		}, | ||||
|  | ||||
| 		handleSearchBarBtnClick(btn) { | ||||
| 			console.log('handleSearchBarBtnClick', btn); | ||||
| 			// debugger; | ||||
| 			switch (btn.btnName) { | ||||
| 				case 'search': | ||||
| 					this.queryParams.lineId = btn.lineId; | ||||
| 					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.getList(); | ||||
| 					}); | ||||
| @@ -388,7 +398,7 @@ export default { | ||||
| 	font-size: 14px; | ||||
|  | ||||
| 	&::before { | ||||
| 		content: ""; | ||||
| 		content: ''; | ||||
| 		position: absolute; | ||||
| 		left: 0; | ||||
| 		top: 6px; | ||||
| @@ -398,5 +408,4 @@ export default { | ||||
| 		background: #0b58ff; | ||||
| 	} | ||||
| } | ||||
|  | ||||
| </style> | ||||
|   | ||||
| @@ -14,7 +14,7 @@ import * as echarts from 'echarts'; | ||||
|  *  | ||||
|  * https://echarts.apache.org/zh/option.html#series-custom.renderItem.arguments.params | ||||
|  */ | ||||
| function renderItem(params, api) { } | ||||
| // function renderItem(params, api) { } | ||||
|  | ||||
| export default class Gantt { | ||||
|     constructor(el) { | ||||
|   | ||||
| @@ -74,7 +74,7 @@ | ||||
|  | ||||
| <script> | ||||
| import LineChart from './components/lineChart.vue'; | ||||
| import response from './response.json'; | ||||
| // import response from './response.json'; | ||||
|  | ||||
| export default { | ||||
| 	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> | ||||
| @@ -37,7 +37,7 @@ | ||||
|       @cancel="handleCancel" | ||||
|       @confirm="handleConfirm" | ||||
|       :before-close="handleCancel" | ||||
|       width='70%' | ||||
|       width='50%' | ||||
|     > | ||||
|       <group-class-add ref="classList" @successSubmit="successSubmit" /> | ||||
|     </base-dialog> | ||||
| @@ -108,12 +108,6 @@ export default { | ||||
|       ], | ||||
|       tableProps, | ||||
|       tableBtn: [ | ||||
|         this.$auth.hasPermi('base:group-classes:update') | ||||
|           ? { | ||||
|               type: 'edit', | ||||
|               btnName: '编辑' | ||||
|             } | ||||
|           : undefined, | ||||
|           { | ||||
|             type: 'cancel', | ||||
|             btnName: '作废', | ||||
| @@ -128,6 +122,12 @@ export default { | ||||
|               ] | ||||
|             } | ||||
|           }, | ||||
|         this.$auth.hasPermi('base:group-classes:update') | ||||
|           ? { | ||||
|               type: 'edit', | ||||
|               btnName: '编辑' | ||||
|             } | ||||
|           : undefined, | ||||
|         this.$auth.hasPermi('base:group-classes:delete') | ||||
|           ? { | ||||
|               type: 'delete', | ||||
|   | ||||
| @@ -1,17 +1,29 @@ | ||||
| <template> | ||||
|   <el-form ref="form" :rules="rules" label-width="80px" :model="form"> | ||||
|     <el-form-item label="班组名称" prop="name"> | ||||
|       <el-input v-model="form.name"></el-input> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="班组编码" prop="code"> | ||||
|       <el-input v-model="form.code" disabled></el-input> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="班组人数" prop="num"> | ||||
|       <el-input-number v-model="form.num" :min="1" :max="99999999" style="width: 100%;"></el-input-number> | ||||
|     </el-form-item> | ||||
|     <el-form-item label="班组组长" prop="leaderName"> | ||||
|       <el-input v-model="form.leaderName"></el-input> | ||||
|     </el-form-item> | ||||
|     <el-row> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="班组名称" prop="name"> | ||||
|           <el-input v-model="form.name"></el-input> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="班组编码" prop="code"> | ||||
|           <el-input v-model="form.code" disabled></el-input> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|     <el-row> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="班组人数" prop="num"> | ||||
|           <el-input-number v-model="form.num" :min="1" :max="99999999" style="width: 100%;"></el-input-number> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|       <el-col :span="12"> | ||||
|         <el-form-item label="班组组长" prop="leaderName"> | ||||
|           <el-input v-model="form.leaderName"></el-input> | ||||
|         </el-form-item> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|   </el-form> | ||||
| </template> | ||||
| <script> | ||||
|   | ||||
| @@ -308,6 +308,16 @@ export default { | ||||
|   } | ||||
| </script> | ||||
| <style lang='scss'> | ||||
| .demo-form-inline { | ||||
|   .el-date-editor .el-range__icon { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
|   .el-input__prefix .el-icon-date { | ||||
|     font-size: 16px; | ||||
|     color: #0B58FF; | ||||
|   } | ||||
| } | ||||
| .groupTeamScheduling { | ||||
|   background-color: #F2F4F9; | ||||
|   .operationArea { | ||||
|   | ||||
		Reference in New Issue
	
	Block a user