oee

imcs-ui/src/api/statisticalAnalysis/productlineAvailability.js

@@ -1,48 +1,58 @@
-/*********************** 【质量中心-查看质检结果】API ********************/
-import axiosApi from '../AxiosApi.js'
-
-const apiList = {
-	getList: {
-	    method: 'POST',
-	    url: `/authority/productLinePerformance/query`
-	},
-  page: {
-    method: 'POST',
-    url: `/authority/productLinePerformance/page`
-  },
-  queryOperatorDetailPerformance: {
-    method: 'POST',
-    url: `/authority/productLinePerformance/queryOperatorDetailPerformance`
-  },
-  queryOperatorDetailsPerformance: {
-    method: 'POST',
-    url: `/authority/productLinePerformance/queryOperatorDetailsPerformance`
-  }
-}
-
-export default {
-	getList (data) {
-    return axiosApi({
-      ...apiList.page,
-      data
-    })
-  },
-  page (data) {
-    return axiosApi({
-        ...apiList.page,
-        data
-    })
-  },
-  queryOperatorDetailPerformance (data) {
-    return axiosApi({
-      ...apiList.queryOperatorDetailPerformance,
-      data
-    })
-  },
-  queryOperatorDetailsPerformance (data) {
-    return axiosApi({
-      ...apiList.queryOperatorDetailsPerformance,
-      data
-    })
-  }
-}
+/*********************** 【质量中心-查看质检结果】API ********************/
+import axiosApi from '../AxiosApi.js'
+
+const apiList = {
+	getList: {
+	    method: 'POST',
+	    url: `/authority/productLinePerformance/query`
+	},
+  page: {
+    method: 'POST',
+    url: `/authority/productLinePerformance/page`
+  },
+  queryOperatorDetailPerformance: {
+    method: 'POST',
+    url: `/authority/productLinePerformance/queryOperatorDetailPerformance`
+  },
+  queryOperatorDetailsPerformance: {
+    method: 'POST',
+    url: `/authority/productLinePerformance/queryOperatorDetailsPerformance`
+  },
+  queryProductionLineOee: {
+    method: 'POST',
+    url: `/authority/productLinePerformance/queryProductionLineOee`
+  }
+}
+
+export default {
+	getList (data) {
+    return axiosApi({
+      ...apiList.page,
+      data
+    })
+  },
+  page (data) {
+    return axiosApi({
+        ...apiList.page,
+        data
+    })
+  },
+  queryOperatorDetailPerformance (data) {
+    return axiosApi({
+      ...apiList.queryOperatorDetailPerformance,
+      data
+    })
+  },
+  queryOperatorDetailsPerformance (data) {
+    return axiosApi({
+      ...apiList.queryOperatorDetailsPerformance,
+      data
+    })
+  },
+  queryProductionLineOee (data) {
+    return axiosApi({
+      ...apiList.queryProductionLineOee,
+      data
+    })
+  },
+}

imcs-ui/src/components/Charts/BarChart.vue

@@ -89,9 +89,9 @@ export default {
             textStyle: {
               show:true,
                fontFamily:'微软雅黑',
-                color: "#fff",
+                color: "#778899",
                 fontSize: '14',
-            },  
+            },
             formatter:function(value){
             	let len = value.length;
             	let result = "";
@@ -103,7 +103,7 @@ export default {
             	}
             	return result;
 							// return value.split("").join("\n");
-						} 
+						}
         	}
         }],
         yAxis: [{
@@ -123,9 +123,9 @@ export default {
             textStyle: {
               show:true,
                fontFamily:'微软雅黑',
-                color: "#fff",
+                color: "#778899",
                 fontSize: '14',
-            },                           
+            },
         	}
         }],
         series: [{

imcs-ui/src/lang/zh/statisticalAnalysis.js

@@ -1,48 +1,53 @@
-/***************************【统计分析】***********************************/
-export default {
-  statisticalAnalysis: {
-    // 本模型下的共通
-    common: {
-    },
-    // 列表搜索表单名称
-    searchForm: {
-      agvAvailability: {
-        statisticalDate: '日期',
-      },
-    },
-    // 按钮的名称
-    buttons: {
-      operatorPerformance: {
-        operatorPerformanceDetail: '查看人员工时详情'
-      }
-    },
-    // 列表的cell名称
-    table: {
-      // agv工时
-      agvAvailability: {
-        statisticalDate: '日期',
-        statisticalHours: '生产工时汇总（小时）',
-      },
-      // OEE
-      resouceOee: {
-      },
-      // 工时管理
-      operatorPerformance: {
-        productLine: '产线',
-        statisticalHours: '生产工时汇总（小时）',
-        statisticalDate: '月份',
-        operatorName: '姓名',
-        operatorDept: '部门',
-        operatorStatisticalHours: '生产工时汇总（小时）',
-        operatorStatisticalDate: '月份',
-      }
-    },
-    // 表单数据名称
-    form: {
-    },
-    // 表单验证规则提示信息
-    rules: {
-
-    }
-  }
-}
+/***************************【统计分析】***********************************/
+export default {
+  statisticalAnalysis: {
+    // 本模型下的共通
+    common: {
+    },
+    // 列表搜索表单名称
+    searchForm: {
+      agvAvailability: {
+        statisticalDate: '日期',
+      },
+      oee: {
+        productlineName: '产线名称',
+        statisticalDate: '日期',
+      },
+    },
+    // 按钮的名称
+    buttons: {
+      operatorPerformance: {
+        operatorPerformanceDetail: '查看人员工时详情'
+      }
+    },
+    // 列表的cell名称
+    table: {
+      // agv工时
+      agvAvailability: {
+        statisticalDate: '日期',
+        statisticalHours: '生产工时汇总（小时）',
+      },
+      // OEE
+      resouceOee: {
+        title: '月设备OEE'
+      },
+      // 工时管理
+      operatorPerformance: {
+        productLine: '产线',
+        statisticalHours: '生产工时汇总（小时）',
+        statisticalDate: '月份',
+        operatorName: '姓名',
+        operatorDept: '部门',
+        operatorStatisticalHours: '生产工时汇总（小时）',
+        operatorStatisticalDate: '月份',
+      }
+    },
+    // 表单数据名称
+    form: {
+    },
+    // 表单验证规则提示信息
+    rules: {
+
+    }
+  }
+}

imcs-ui/src/views/zuihou/statisticalAnalysis/resouceOee/Index.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="app-container">
+    <el-row class="rowCls">
+		<!-- 搜索模块 -->
+    <div class="filter-container">
+    	<span style="margin-left: 15px;">
+    		<span>{{$t("statisticalAnalysis.searchForm.oee.productlineName")}}：</span>
+    		<el-select v-model="productionLineId" :placeholder='$t("common.pleaseSelect")' size="medium" style="width: 150px;">
+        	<el-option
+			      v-for="item in productionLines"
+			      :key="item.id"
+			      :label="item.name"
+			      :value="item.id">
+			    </el-option>
+      	</el-select>
+    	</span>
+
+      <span style="margin-left: 15px;">
+    		<span>{{$t("statisticalAnalysis.searchForm.oee.statisticalDate")}}：</span>
+    		<el-date-picker
+          v-model="statisticalDate"
+          type="datetime"
+          format="yyyy-MM"
+          value-format="yyyy-MM"
+          style="width: 20%;"
+        />
+    	</span>
+      <span style="margin-left: 15px;">
+	      <el-button plain type="primary" icon="el-icon-search" size="medium" @click="search">
+	        {{ $t("table.search") }}
+	      </el-button>
+	      <el-button plain type="warning" icon="el-icon-refresh" size="medium" @click="reset">
+	        {{ $t("table.reset") }}
+	      </el-button>
+      </span>
+    </div>
+    </el-row>
+		<!-- OEE柱状图 -->
+    <el-row class="rowCls">
+      <div class="bottomDiv">
+      <!-- 标题 -->
+      <div class="modelTitle marginBottom15">本月设备OEE</div>
+      <!-- 柱状图数据 -->
+      <div class="chart-wrapper">
+        <bar-chart :barData="barData" :height="heightStr"/>
+      </div>
+      </div>
+    </el-row>
+
+  </div>
+</template>
+
+<script>
+  import productionLineMgrApi from "@/api/runManageCenter/productionLineMgr"
+  import productlineAvailabilityApi from "@/api/statisticalAnalysis/productlineAvailability"
+  import BarChart from '@/components/Charts/BarChart'
+	export default {
+	  name: "oee",
+    components: {BarChart },
+	  props: {
+	  },
+	  data () {
+	    return {
+        heightStr: "380px",
+        productionLines: [],
+	      tableKey: 0,
+	      loading: false,
+        productionLineId:"",
+        statisticalDate:"",
+        barData: {
+            name: 'OEE',
+            xData: [],
+            yData: []
+        },
+	    }
+	  },
+	  // 实例已经在内存中创建好，此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法，最早只能在created中操作
+	  created() {
+	  	// 加载产线下拉框数据
+      this.queryProductionLines()
+		},
+	  computed: {
+	  },
+	  mounted () {
+	  },
+	  methods: {
+      search() {
+          this.fetch()
+      },
+      reset() {
+          this.$refs.table.clearSort()
+          this.$refs.table.clearFilter()
+          this.search()
+      },
+	    fetch () {
+	  	  this.tableKey = !this.tableKey
+	      this.loading = true
+          console.log(this.productionLineId)
+          let params = {}
+          params.statisticalDate = this.statisticalDate
+          params.productionlineId = this.productionLineId
+          console.log(params)
+        productlineAvailabilityApi.queryProductionLineOee(params).then(response => {
+	        const res = response.data
+	        if (res.isSuccess) {
+              this.barData.xData =  res.data.xData
+              this.barData.yData =  res.data.yData
+	        }
+	      }).finally(() => this.loading = false)
+	    },
+      // 产线查找
+      queryProductionLines(){
+          this.productionLines = []
+          productionLineMgrApi.getList({}).then(response => {
+              const res = response.data
+              if (res.isSuccess) {
+                  this.productionLines = res.data
+                  if(this.productionLines.length > 0){
+                      this.productionLineId = this.productionLines[0].id
+                  }
+              }
+          })
+      }
+	  }
+	}
+</script>
+<style lang="scss" scoped></style>