update 设备效率分析头部

src/views/modules/monitoring/equipmentEfficiency.vue

@@ -2,13 +2,39 @@
 	<!-- 设备效率分析 -->
 	<div class="mod-config">
 		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+			<!-- 工厂 -->
 			<el-form-item>
-				<el-input v-model="dataForm.key" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-input>
+				<!-- <el-select v-model="dataForm.factoryId" :placeholder="$t('eq.name') + ' / ' + $t('eq.code')" clearable></el-select> -->
+				<el-select v-model="dataForm.ftId" :placeholder="'工厂'" clearable>
+					<el-option v-for="factory in factoryList" :key="factory.id" :value="factory.id" :label="factory.name" />
+				</el-select>
 			</el-form-item>
+			<!-- 产线 -->
+			<el-form-item>
+				<el-select v-model="dataForm.productlines" :placeholder="'产线'" multiple clearable>
+					<el-option v-for="productLine in productLineList" :key="productLine.id" :value="productLine.id" :label="productLine.name" />
+				</el-select>
+			</el-form-item>
+			<!-- 时间类型 -->
+			<!-- 按时间段 -->
+			<el-form-item>
+				<el-select v-model="timeType" :placeholder="'时间类型'" clearable>
+					<el-option value="range" label="按时间段" />
+					<el-option value="date" label="按日期" />
+				</el-select>
+			</el-form-item>
+			<!-- 日期选择 -->
+			<el-form-item v-if="timeType === 'date'">
+				<el-date-picker key="range-picker" v-model="rawTime" type="date" :placeholder="'请选择日期'" format="yyyy-MM-dd" />
+			</el-form-item>
+			<!-- 时间段选择 -->
+			<el-form-item v-else>
+				<el-date-picker key="time-picker" v-model="rawTime" type="daterange" :range-separator="'至'" :start-placeholder="'开始时间'" :end-placeholder="'结束时间'" format="yyyy-MM-dd" />
+			</el-form-item>
+			<!-- 按钮 -->
 			<el-form-item>
 				<el-button @click="getDataList()">{{ $t('search') }}</el-button>
-				<el-button v-if="$hasPermission('monitoring:equipment:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
+				<!-- <el-button v-if="$hasPermission('monitoring:equipmentEffiency:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
-				<el-button v-if="$hasPermission('monitoring:equipment:export')" @click="exportHandle()">{{ $t('export') }}</el-button>
 			</el-form-item>
 		</el-form>
 
@@ -38,6 +64,7 @@ import CKEditor from 'ckeditor4-vue'
 import { calcMaxHeight } from '@/utils'
 import { timeFilter } from '@/utils/filters'
 import Cookies from 'js-cookie'
+import moment from 'moment'
 
 const tableConfigs = [
 	{
@@ -241,11 +268,21 @@ const addOrUpdateConfigs = {
 export default {
 	data() {
 		return {
+			/** hfxny part */
+			factoryList: [],
+			productLineList: [],
+			/** */
 			calcMaxHeight,
 			tableConfigs,
 			addOrUpdateConfigs,
+			timeType: 'range',
+			rawTime: null, // [] or datetime
 			dataForm: {
-				key: ''
+				type: 1,
+				ftId: null,
+				productlines: [],
+				startTime: null,
+				entTime: null
 			},
 			dataList: [],
 			pageIndex: 1,
@@ -260,13 +297,80 @@ export default {
 		AddOrUpdate,
 		BaseTable
 	},
-	activated() {
+	// activated() {
-		console.log('activated')
+	// 	console.log('activated')
-		this.getDataList()
+	// 	this.getDataList()
-		this.getGroupList()
+	// 	this.getGroupList()
-		this.getTypeList()
+	// 	this.getTypeList()
+	// },
+	created() {
+		this.getFactoryList()
+		this.getProductLineList()
+	},
+	watch: {
+		timeType() {
+			// 防止切换日期类型时报错
+			this.rawTime = null
+		}
 	},
 	methods: {
+		// 获取工厂列表
+		getFactoryList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/factory/page'),
+				method: 'get'
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.factoryList = data.data.list
+					/** set default */
+					if (this.factoryList.length) {
+						this.dataForm.ftId = this.factoryList[0].id
+					}
+				} else {
+					this.factoryList = []
+					this.dataForm.ftId = null
+				}
+			})
+		},
+		// 获取产线列表
+		getProductLineList() {
+			this.$http({
+				url: this.$http.adornUrl('/monitoring/productionLine/page'),
+				method: 'get'
+			}).then(({ data }) => {
+				if (data && data.code === 0) {
+					this.productLineList = data.data.list
+					/** set default */
+					if (this.productLineList.length) {
+						this.dataForm.productlines = [this.productLineList[0].id]
+					}
+				} else {
+					this.productLineList = []
+				}
+			})
+		},
+		// 时间类型预处理
+		getTimeRange() {
+			let startTime
+			let endTime
+
+			if (this.headFormValue.timeValue instanceof Array) {
+				startTime = this.headFormValue.timeValue[0] ? moment(this.headFormValue.timeValue[0]).format('YYYY-MM-DDTHH:mm:ss') : '' // 强制axios使用北京时间
+				endTime = this.headFormValue.timeValue[1] ? moment(this.headFormValue.timeValue[1]).format('YYYY-MM-DDTHH:mm:ss') : ''
+			} else {
+				if (this.headFormValue.timeValue) {
+					startTime = moment(this.headFormValue.timeValue).format('YYYY-MM-DDTHH:mm:ss')
+					endTime = moment(startTime)
+						.add(1, 'd')
+						.format('YYYY-MM-DDTHH:mm:ss')
+				} else {
+					startTime = ''
+					endTime = ''
+				}
+			}
+
+			return { startTime, endTime }
+		},
 		// 获取设备类型列表
 		getTypeList() {
 			this.$http({