src/mixins/lb/basicPageMixin.js

@@ -31,7 +31,6 @@ export default {
 			// dialogFormConfig: [], // 占位
 		};
 	},
-	mounted() {},
 	methods: {
 		// 过滤后端传回的详情数据
 		filterData(data, keys) {

src/views/equipment/analysis/efficiency/index.vue

@@ -17,10 +17,10 @@
 		<base-table
 			class="base-table__margin"
 			:table-props="tableProps"
-			:page="queryParams.pageNo"
-			:limit="queryParams.pageSize"
 			:table-data="list"
 			@emitFun="handleEmitFun">
+			<!-- :page="queryParams.pageNo"
+			:limit="queryParams.pageSize" -->
 			<!-- <method-btn
 				v-if="tableBtn.length"
 				slot="handleBtn"
@@ -30,28 +30,34 @@
 		</base-table>
 
 		<!-- 分页组件 -->
-		<pagination
+		<!-- <pagination
 			v-show="total > 0"
 			:total="total"
 			:page.sync="queryParams.pageNo"
 			:limit.sync="queryParams.pageSize"
-			@pagination="getList" />
+			@pagination="getList" /> -->
 
 		<!-- 对话框(添加 / 修改) -->
 		<base-dialog
-			:dialogTitle="title"
+			:dialogTitle="visualizationOpen ? '设备可视化' : '查看趋势'"
 			:dialogVisible="open"
-			width="500px"
+			:width="visualizationOpen ? '80%' : '700px'"
+			@closed="closed"
 			@close="cancel"
 			@cancel="cancel"
 			@confirm="submitForm">
-			<!-- some thing ... -->
+			<div class="visualization" v-if="visualizationOpen">
+				<h1>设备可视化</h1>
+			</div>
+			<div v-if="trendOpen">
+				<h1>查看趋势</h1>
+			</div>
 		</base-dialog>
 	</div>
 </template>
 
 <script>
-import moment from 'moment';
+// import moment from 'moment';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
 
 export default {
@@ -61,7 +67,9 @@ export default {
 	props: {},
 	data() {
 		return {
-			searchBarKeys: ['name', 'code'],
+			open: false,
+			visualizationOpen: false,
+			trendOpen: false,
 			// tableBtn: [
 			// 	this.$auth.hasPermi('base:equipment-group:update')
 			// 		? {
@@ -77,21 +85,27 @@ export default {
 			// 		: undefined,
 			// ].filter((v) => v),
 			tableProps: [
-				{ prop: 'duration', label: '工厂', align: 'center' },
+				{ prop: 'factoryName', label: '工厂', align: 'center' },
-				{ prop: 'duration', label: '产线', align: 'center' },
+				{ prop: 'lineName', label: '产线', align: 'center' },
-				{ prop: 'duration', label: '工段', align: 'center' },
+				{ prop: 'sectionName', label: '工段', align: 'center' },
-				{ prop: 'duration', label: '设备', align: 'center' },
+				{ prop: 'equipmentName', label: '设备', align: 'center' },
 				{
 					label: '有效时间',
 					align: 'center',
 					children: [
 						{
 							width: 128,
-							prop: 'duration',
+							prop: 'workTime',
 							label: '工作时长',
 							align: 'center',
 						},
-						{ width: 128, prop: 'duration1', label: '百分比', align: 'center' },
+						{
+							width: 128,
+							prop: 'workRate',
+							label: '百分比',
+							align: 'center',
+							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
+						},
 					],
 				},
 				{
@@ -100,11 +114,11 @@ export default {
 					children: [
 						{
 							width: 128,
-							prop: 'duration',
+							prop: 'stopTime',
 							label: '停机时长',
 							align: 'center',
 						},
-						{ width: 128, prop: 'duration1', label: '百分比', align: 'center' },
+						{ width: 128, prop: 'stopRate', label: '百分比', align: 'center' },
 					],
 				},
 				{
@@ -113,16 +127,18 @@ export default {
 					children: [
 						{
 							width: 128,
-							prop: 'duration',
+							prop: 'downTime',
 							label: '故障时长',
 							align: 'center',
+							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
-						{ width: 128, prop: 'duration1', label: '百分比', align: 'center' },
+						{ width: 128, prop: 'downRate', label: '百分比', align: 'center' },
 						{
 							width: 128,
-							prop: 'duration1',
+							prop: 'timeEfficiency',
 							label: '时间开动率',
 							align: 'center',
+							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
 					],
 				},
@@ -132,26 +148,37 @@ export default {
 					children: [
 						{
 							width: 128,
-							prop: 'duration',
+							prop: 'realProcSpeed',
 							label: '实际加工速度',
 							align: 'center',
 						},
 						{
 							width: 128,
-							prop: 'duration1',
+							prop: 'designProcSpeed',
 							label: '理论加工速度',
 							align: 'center',
 						},
 						{
 							width: 128,
-							prop: 'duration1',
+							prop: 'peEfficiency',
 							label: '速度开动率',
 							align: 'center',
+							filter: (val) => (val != null ? +val.toFixed(3) : '-'),
 						},
 					],
 				},
-				{ prop: 'duration1', label: 'OEE', align: 'center' },
+				{
-				{ prop: 'duration1', label: 'TEEP', align: 'center' },
+					prop: 'oee',
+					label: 'OEE',
+					align: 'center',
+					filter: (val) => (val != null ? +val.toFixed(3) : '-'),
+				},
+				{
+					prop: 'teep',
+					label: 'TEEP',
+					align: 'center',
+					filter: (val) => (val != null ? +val.toFixed(3) : '-'),
+				},
 				{
 					_action: 'view-trend',
 					label: '趋势',
@@ -163,7 +190,7 @@ export default {
 							return h(
 								'el-button',
 								{
-									props: { type: 'text', size: 'mini' },
+									props: { type: 'text' },
 									on: {
 										click: function () {
 											console.log('inejctdata', _this.injectData);
@@ -186,27 +213,54 @@ export default {
 					type: 'select',
 					label: '工厂',
 					placeholder: '请选择工厂',
-					param: 'name',
+					param: 'factoryId',
 					selectOptions: [],
 				},
 				{
 					type: 'select',
 					label: '产线',
 					placeholder: '请选择产线',
-					param: 'codes',
+					param: 'lineId',
 					selectOptions: [],
 				},
 				// 选项切换
 				{
-					type: 'datePicker',
+					type: 'select',
-					label: '时间',
+					label: '时间类型',
-					dateType: 'daterange',
+					param: 'dateFilterType',
-					format: 'yyyy-MM-dd',
+					defaultSelect: 0,
-					valueFormat: 'yyyy-MM-dd HH:mm:ss',
+					selectOptions: [
-					rangeSeparator: '-',
+						{ id: 0, name: '按时间段' },
-					startPlaceholder: '开始时间',
+						{ id: 1, name: '按日期' },
-					endPlaceholder: '结束时间',
+					],
-					param: 'createTime',
+					index: 2,
+					extraOptions: [
+						{
+							parent: 'dateFilterType',
+							// 时间段选择
+							type: 'datePicker',
+							label: '时间段',
+							dateType: 'daterange',
+							format: 'yyyy-MM-dd',
+							valueFormat: 'yyyy-MM-dd HH:mm:ss',
+							defaultTime: ['00:00:00', '00:00:00'],
+							rangeSeparator: '-',
+							startPlaceholder: '开始时间',
+							endPlaceholder: '结束时间',
+							param: 'recordTime',
+						},
+						{
+							parent: 'dateFilterType',
+							// 日期选择
+							type: 'datePicker',
+							label: '日期',
+							dateType: 'date',
+							placeholder: '选择日期',
+							format: 'yyyy-MM-dd',
+							valueFormat: 'yyyy-MM-dd',
+							param: 'recordTime',
+						},
+					],
 				},
 				{
 					type: 'button',
@@ -219,121 +273,139 @@ export default {
 				},
 				{
 					type: 'button',
-					btnName: 'OEE',
+					btnName: '设备可视化',
-					name: 'add',
+					name: 'visualization',
 					plain: true,
 					color: 'success',
 				},
-				{
+				// {
-					type: 'button',
+				// 	type: 'button',
-					btnName: 'TEEP',
+				// 	btnName: 'OEE',
-					name: 'add',
+				// 	name: 'add',
-					plain: true,
+				// 	plain: true,
-					color: 'warning',
+				// 	color: 'success',
-				},
+				// },
+				// {
+				// 	type: 'button',
+				// 	btnName: 'TEEP',
+				// 	name: 'add',
+				// 	plain: true,
+				// 	color: 'warning',
+				// },
 			],
 			// 是否显示弹出层
 			open: false,
 			// 查询参数
 			queryParams: {
-				pageNo: 1,
+				lineId: null,
-				pageSize: 10,
+				factoryId: null,
-				code: null,
+				recordTime: [],
-				name: null,
 			},
 			// 表单参数
 			form: {},
+			list: [],
 		};
 	},
 	created() {
+		this.getFactory();
+		this.getLine();
 		this.getList();
 	},
 	methods: {
+		/** 准备工厂数据 */
+		async getFactory() {
+			const { code, data } = await this.$axios({
+				url: '/base/factory/listAll',
+				method: 'get',
+			});
+			if (code == 0) {
+				this.searchBarFormConfig[0].selectOptions = data.map((item) => {
+					return {
+						name: item.name,
+						id: item.id,
+					};
+				});
+			}
+		},
+
+		/** 准备产线数据 */
+		async getLine() {
+			const { code, data } = await this.$axios({
+				url: '/base/production-line/listAll',
+				method: 'get',
+			});
+			if (code == 0) {
+				this.searchBarFormConfig[1].selectOptions = data.map((item) => {
+					return {
+						name: item.name,
+						id: item.id,
+					};
+				});
+			}
+		},
+
 		/** 覆盖 handleEmitFun 的默认实现 */
 		handleEmitFun({ action, value }) {
-			const {
-				id: equipmentGroupId,
-				name: equipmentGroupName,
-				code: equipmentGroupCode,
-			} = value;
 			switch (action) {
-				case 'equipment-group-show-alert':
+				case 'view-trend':
-					// this.$router.push({ path: '/equipment/base/equipment-group-alarm' });
+					const { id } = value;
-					this.$router.push({
+					this.open = true;
-						name: 'EquipmentGroupAlarm',
+					this.trendOpen = true;
-						params: {
-							equipmentGroupId,
-							equipmentGroupCode,
-							equipmentGroupName,
-						},
-					});
 					break;
 			}
 		},
 		/** 查询列表 */
-		getList() {
+		async getList() {
 			this.loading = true;
-			// 执行查询
+			const { code, data } = await this.$axios({
-			getEquipmentGroupPage(this.queryParams).then((response) => {
+				url: '/analysis/equipment-analysis/efficiency',
-				this.list = response.data.list;
+				method: 'get',
-				this.total = response.data.total;
+				params: this.queryParams,
-				this.loading = false;
 			});
+			if (code == 0) {
+				console.log('data', data);
+				this.list = data;
+			}
 		},
-		/** 取消按钮 */
+
+		handleSearchBarBtnClick({ btnName, ...payload }) {
+			console.log('handleSearchBarBtnClick', btnName, payload);
+			if (btnName == 'visualization') {
+				// 可视化
+				this.visualizationOpen = true;
+				this.open = true;
+			}
+			if (btnName == 'search') {
+				this.queryParams.factoryId = payload.factoryId || null;
+				this.queryParams.lineId = payload.lineId || null;
+				if (payload.recordTime != null) {
+					if (typeof payload.recordTime == 'string') {
+						if (payload.recordTime.trim() !== '') {
+							this.queryParams.recordTime = [
+								`${payload.recordTime} 00:00:00`,
+								`${payload.recordTime} 23:59:59`,
+							];
+						}
+					} else {
+						this.queryParams.recordTime = payload.recordTime;
+					}
+				} else {
+					this.queryParams.recordTime = null;
+				}
+				this.getList();
+			}
+		},
+
 		cancel() {
 			this.open = false;
-			this.reset();
 		},
-		/** 表单重置 */
+
-		reset() {
+		closed() {
-			this.form = {
+			this.visualizationOpen = false;
-				id: undefined,
+			this.trendOpen = false;
-				code: undefined,
-				name: undefined,
-				remark: undefined,
-			};
-			this.resetForm('form');
-		},
-		/** 搜索按钮操作 */
-		handleQuery() {
-			this.queryParams.pageNo = 1;
-			this.getList();
-		},
-		/** 重置按钮操作 */
-		resetQuery() {
-			this.resetForm('queryForm');
-			this.handleQuery();
-		},
-		/** 新增按钮操作 */
-		handleAdd() {
-			this.reset();
-			this.open = true;
-			this.title = '添加设备分组（用于同类型不同厂家的设备区分）';
-		},
-		/** 提交按钮 */
-		submitForm() {
-			this.$refs['form'].validate((valid) => {
-				if (!valid) {
-					return;
-				}
-				// 修改的提交
-				if (this.form.id != null) {
-					updateEquipmentGroup(this.form).then((response) => {
-						this.$modal.msgSuccess('修改成功');
-						this.open = false;
-						this.getList();
-					});
-					return;
-				}
-				// 添加的提交
-				createEquipmentGroup(this.form).then((response) => {
-					this.$modal.msgSuccess('新增成功');
-					this.open = false;
-					this.getList();
-				});
-			});
 		},
+
+		submitForm() {},
 	},
 };
 </script>