From 481994e460d0a48caa4ad8c16090c15e5068ef3f Mon Sep 17 00:00:00 2001
From: gaoshp <291585735@qq.com>
Date: 星期日, 21 四月 2024 19:16:49 +0800
Subject: [PATCH] update
---
src/views/mdc/alarm-statistics.vue | 105 ++++++
src/views/mdc/components/TimeAlarm.vue | 254 ++++++++++++++++
src/views/login/components/passwordForm.vue | 296 ++++++++++---------
src/views/mdc/MYTree.vue | 31 +
src/views/mdc/components/ShiftAlarm.vue | 190 ++++++++++++
5 files changed, 719 insertions(+), 157 deletions(-)
diff --git a/src/views/login/components/passwordForm.vue b/src/views/login/components/passwordForm.vue
index a028d51..ea84d84 100644
--- a/src/views/login/components/passwordForm.vue
+++ b/src/views/login/components/passwordForm.vue
@@ -1,161 +1,173 @@
<template>
- <el-form ref="loginForm" :model="form" :rules="rules" label-width="0" size="large" @keyup.enter="login" class="login-form">
+ <el-form ref="loginForm" :model="form" :rules="rules" label-width="0" size="large" @keyup.enter="login"
+ class="login-form">
<el-form-item prop="user">
- <el-input v-model="form.user" prefix-icon="el-icon-user" clearable :placeholder="$t('login.userPlaceholder')" class="inputHeight">
+ <el-input v-model="form.user" prefix-icon="el-icon-user" clearable
+ :placeholder="$t('login.userPlaceholder')" class="inputHeight">
</el-input>
</el-form-item>
<el-form-item prop="password">
- <el-input v-model="form.password" prefix-icon="el-icon-lock" clearable show-password :placeholder="$t('login.PWPlaceholder')" class="inputHeight"></el-input>
+ <el-input v-model="form.password" prefix-icon="el-icon-lock" clearable show-password
+ :placeholder="$t('login.PWPlaceholder')" class="inputHeight"></el-input>
</el-form-item>
<el-form-item>
- <el-button type="primary" style="width: 100%;" :loading="islogin" @click="login">{{ $t('login.signIn') }}</el-button>
+ <el-button type="primary" style="width: 100%;" :loading="islogin" @click="login">{{ $t('login.signIn')
+ }}</el-button>
</el-form-item>
</el-form>
</template>
<script>
- export default {
- data() {
- return {
- userType: 'admin',
- form: {
- user: "admin",
- password: "123456",
- autologin: false
- },
- rules: {
- user: [
- {required: true, message: this.$t('login.userError'), trigger: 'blur'}
- ],
- password: [
- {required: true, message: this.$t('login.PWError'), trigger: 'blur'}
- ]
- },
- islogin: false,
- }
- },
- watch:{
- userType(val){
- if(val == 'admin'){
- this.form.user = 'admin'
- this.form.password = 'admin'
- }else if(val == 'user'){
- this.form.user = 'user'
- this.form.password = 'user'
- }
- }
- },
- mounted() {
- //this.$HTTP.get('/api/blade-sync/outer-app-config/appStatus')
- },
- methods: {
- async login(){
- var validate = await this.$refs.loginForm.validate().catch(()=>{})
- if(!validate){ return false }
- this.islogin = true
- var data = {
- username: this.form.user,
- //password: this.$TOOL.crypto.MD5(this.form.password)
- password: this.form.password,
- tenantId: "000000",
- grant_type: "password",
- scope: "all"
- }
- await this.$HTTP.postJ("/api/blade-auth/oauth/token?" + this.$TOOL.qsStringify(data)).then(res=> {
- if(res.user_id) {
- //鑾峰彇token
- this.$TOOL.cookie.set("TOKEN", res.access_token, {
- expires: this.form.autologin? 24*60*60 : 0
- })
- res.userName = res.user_name;
- res.role = ["SA", "admin", "Auditor"];
- res.dashboard = "0";
- res.userId = "1";
- this.$TOOL.data.set("USER_INFO", res);
- this.islogin = false;
- }else {
- this.$message({
- showClose: true,
- message: res.error_description,
- type: 'error'
- });
- }
- })
- //鑾峰彇鑿滃崟
- await this.$HTTP.get("/api/blade-system/menu/routes?" + this.$TOOL.qsStringify({"appCode": "CPS"})).then(res=> {
- if(res.data.length==0){
- this.islogin = false
- this.$alert("褰撳墠鐢ㄦ埛鏃犱换浣曡彍鍗曟潈闄愶紝璇疯仈绯荤郴缁熺鐞嗗憳", "鏃犳潈闄愯闂�", {
- type: 'error',
- center: true
- })
- return false
- }
- //寮�濮�
- function addComponentToLastLevel(items) {
- return items.map((item) => {
- // 澶嶅埗褰撳墠椤癸紝閬垮厤鐩存帴淇敼鍘熷瀵硅薄
- const clonedItem = { ...item };
-
- // 妫�鏌ュ綋鍓嶉」鏄惁鏈� children 灞炴��
- if (clonedItem.children) {
- // 閫掑綊澶勭悊 children
- clonedItem.children = addComponentToLastLevel(clonedItem.children);
- } else {
- // 濡傛灉娌℃湁 children 灞炴�э紝璇存槑鏄渶鍚庝竴绾э紝娣诲姞 component 瀵硅薄
- var len = clonedItem.path.length;
- if(item.name == "浠诲姟璋冨害") {
- //clonedItem.component = clonedItem.path; //鏈塩omponent涓嶅彲浠ヤ娇鐢╥frame
- }else {
- clonedItem.component = clonedItem.path.substring(1,len);
- }
- }
- if(item.name == "浠诲姟璋冨害") {
- clonedItem.meta = {title: clonedItem.name,icon: "el-icon-takeaway-box", type: "iframe"}
- }else {
- clonedItem.meta = {title: clonedItem.name,icon: "el-icon-takeaway-box", type: "menu"}
- }
- return clonedItem;
- });
- }
- var transformedArray = addComponentToLastLevel(res.data);
- //鑾峰彇澶氫釜宸ヤ綔鍙�
- this.$HTTP.get("/api/blade-system/workbench/list?status=1").then(resp=> {
- if(resp.data.length) {
- //console.log(resp.data,resp.data[0].name,333);
- resp.data.forEach((item,index)=> {
- item.component = "home";
- item.meta = {title: item.name, icon: 'el-icon-menu', affix: true};
- item.path = "/dashboard";
- item.parentId = item.id;
- })
- transformedArray[0].path = "/home";
- transformedArray[0].children = resp.data;
- var obj = {
- dashboardGrid: ["welcome", "ver", "time", "progress", "echarts", "about"],
- menu: transformedArray,
- permissions: ["list.add", "list.edit", "list.delete", "user.add", "user.edit", "user.delete"]
- }
- this.$TOOL.data.set("MENU", obj.menu)
- this.$TOOL.data.set("PERMISSIONS", obj.permissions)
- this.$TOOL.data.set("DASHBOARDGRID", obj.dashboardGrid)
- console.log(transformedArray,222)
-
- this.$router.replace({
- path: '/'
- })
- this.$message.success("Login Success 鐧诲綍鎴愬姛")
- this.islogin = false;
- }
- })
- })
-
+export default {
+ data() {
+ return {
+ userType: 'admin',
+ form: {
+ user: "admin",
+ password: "123456",
+ autologin: false
+ },
+ rules: {
+ user: [
+ { required: true, message: this.$t('login.userError'), trigger: 'blur' }
+ ],
+ password: [
+ { required: true, message: this.$t('login.PWError'), trigger: 'blur' }
+ ]
+ },
+ islogin: false,
+ }
+ },
+ watch: {
+ userType(val) {
+ if (val == 'admin') {
+ this.form.user = 'admin'
+ this.form.password = 'admin'
+ } else if (val == 'user') {
+ this.form.user = 'user'
+ this.form.password = 'user'
}
}
+ },
+ mounted() {
+ //this.$HTTP.get('/api/blade-sync/outer-app-config/appStatus')
+ },
+ methods: {
+ async login() {
+ var validate = await this.$refs.loginForm.validate().catch(() => { })
+ if (!validate) { return false }
+ this.islogin = true
+ var data = {
+ username: this.form.user,
+ //password: this.$TOOL.crypto.MD5(this.form.password)
+ password: this.form.password,
+ tenantId: "000000",
+ grant_type: "password",
+ scope: "all"
+ }
+ await this.$HTTP.postJ("/api/blade-auth/oauth/token?" + this.$TOOL.qsStringify(data)).then(res => {
+ if (res.user_id) {
+ //鑾峰彇token
+ this.$TOOL.cookie.set("TOKEN", res.access_token, {
+ expires: this.form.autologin ? 24 * 60 * 60 : 0
+ })
+ res.userName = res.user_name;
+ res.role = ["SA", "admin", "Auditor"];
+ res.dashboard = "0";
+ res.userId = "1";
+ this.$TOOL.data.set("USER_INFO", res);
+ this.islogin = false;
+ } else {
+ this.$message({
+ showClose: true,
+ message: res.error_description,
+ type: 'error'
+ });
+ }
+ })
+ //鑾峰彇鑿滃崟
+ await this.$HTTP.get("/api/blade-system/menu/routes?" + this.$TOOL.qsStringify({ "appCode": "CPS" })).then(res => {
+ if (res.data.length == 0) {
+ this.islogin = false
+ this.$alert("褰撳墠鐢ㄦ埛鏃犱换浣曡彍鍗曟潈闄愶紝璇疯仈绯荤郴缁熺鐞嗗憳", "鏃犳潈闄愯闂�", {
+ type: 'error',
+ center: true
+ })
+ return false
+ }
+ //寮�濮�
+ function addComponentToLastLevel(items) {
+ return items.map((item) => {
+ // 澶嶅埗褰撳墠椤癸紝閬垮厤鐩存帴淇敼鍘熷瀵硅薄
+ const clonedItem = { ...item };
+
+ // 妫�鏌ュ綋鍓嶉」鏄惁鏈� children 灞炴��
+ if (clonedItem.children) {
+ // 閫掑綊澶勭悊 children
+ clonedItem.children = addComponentToLastLevel(clonedItem.children);
+ } else {
+ // 濡傛灉娌℃湁 children 灞炴�э紝璇存槑鏄渶鍚庝竴绾э紝娣诲姞 component 瀵硅薄
+ var len = clonedItem.path.length;
+ if (item.name == "浠诲姟璋冨害") {
+ //clonedItem.component = clonedItem.path; //鏈塩omponent涓嶅彲浠ヤ娇鐢╥frame
+ } else {
+ clonedItem.component = clonedItem.path.substring(1, len);
+ }
+ }
+ if (item.name == "浠诲姟璋冨害") {
+ clonedItem.meta = { title: clonedItem.name, icon: "el-icon-takeaway-box", type: "iframe" }
+ } else {
+ clonedItem.meta = { title: clonedItem.name, icon: "el-icon-takeaway-box", type: "menu" }
+ }
+ return clonedItem;
+ });
+ }
+ var transformedArray = addComponentToLastLevel(res.data);
+ //鑾峰彇澶氫釜宸ヤ綔鍙�
+ this.$HTTP.get("/api/blade-system/workbench/list?status=1").then(resp => {
+ if (resp.data.length) {
+ //console.log(resp.data,resp.data[0].name,333);
+ resp.data.forEach((item, index) => {
+ item.component = "home";
+ item.meta = { title: item.name, icon: 'el-icon-menu', affix: true };
+ item.path = "/dashboard";
+ item.parentId = item.id;
+ })
+ transformedArray[0].path = "/home";
+ transformedArray[0].children = resp.data;
+ var obj = {
+ dashboardGrid: ["welcome", "ver", "time", "progress", "echarts", "about"],
+ menu: transformedArray,
+ permissions: ["list.add", "list.edit", "list.delete", "user.add", "user.edit", "user.delete"]
+ }
+ this.$TOOL.data.set("MENU", obj.menu)
+ this.$TOOL.data.set("PERMISSIONS", obj.permissions)
+ this.$TOOL.data.set("DASHBOARDGRID", obj.dashboardGrid)
+ console.log(transformedArray, 222)
+
+ this.$router.replace({
+ path: '/'
+ })
+ // this.$message.success("Login Success 鐧诲綍鎴愬姛")
+ this.islogin = false;
+ }
+ })
+ })
+
+ }
}
+}
</script>
<style>
-.login-form {margin: 0 auto;margin-top: 46px;width: 294px;}
-.inputHeight {height: 40px;line-height: 40px;}
+.login-form {
+ margin: 0 auto;
+ margin-top: 46px;
+ width: 294px;
+}
+
+.inputHeight {
+ height: 40px;
+ line-height: 40px;
+}
</style>
diff --git a/src/views/mdc/MYTree.vue b/src/views/mdc/MYTree.vue
index 0d290aa..9192086 100644
--- a/src/views/mdc/MYTree.vue
+++ b/src/views/mdc/MYTree.vue
@@ -1,13 +1,13 @@
<!--
* @Date: 2024-04-18 19:53:35
* @LastEditors: Sneed
- * @LastEditTime: 2024-04-18 21:30:19
+ * @LastEditTime: 2024-04-21 10:37:48
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/MYTree.vue
-->
<template>
<el-tree ref="treeRef" v-bind="$attrs" :show-checkbox="showCheckbox" :current-node-key="currentNodeKey"
node-key="id" :props="defalutProps" :data="data" @check-change="checkChange" @node-click="handleNodeClick"
- highlight-current default-expand-all :render-content="renderContent"></el-tree>
+ highlight-current default-expand-all :expand-on-click-node="false" :render-content="renderContent"></el-tree>
</template>
<script>
@@ -23,13 +23,17 @@
return {
pmsPng,
firstWorkKey: '',
- currentNodeKey: '',
+ currentNodeKey: [],
defalutProps: {
label: 'title',
- children: 'children'
+ children: 'children',
+ disabled: 'disabled',
+ class: (data, node) => {
+ return this.value.includes(data.id) ? 'active' : ''
+ }
},
data: [],
- value: []
+ value: [],
}
},
watch: {
@@ -44,12 +48,15 @@
},
created() {
this.getList()
+ this.customNodeClass = (data, node) => {
+ return this.currentNodeKey == node.id || this.value.includes(node.id) ? 'active' : ''
+ }
},
methods: {
renderContent(h, { data }) {
let img = data.groupTag == 'fms_beltline'
- return h('span', {
-
+ return h('a', {
+ disabled: data.disabled
},
img ? h('img', {
src: pmsPng
@@ -65,6 +72,7 @@
this.data = this.formatData(data)
this.$nextTick(() => {
this.currentNodeKey = this.firstWorkKey
+ this.$emit('loaded', this.firstWorkKey)
})
}
})
@@ -79,6 +87,7 @@
let newData = []
if (!current) {
newData = data.filter(item => item.parentId == 0).map(v => {
+ if (!v.isWorkstation) v.disabled = true
v.children = this.formatData(data, v).sort((a, b) => {
return b.sort - a.sort
})
@@ -88,6 +97,7 @@
} else {
let res = data.filter(v => v.parentId == current.id)
res = res.map(item => {
+ if (!item.isWorkstation) item.disabled = true
item.children = this.formatData(data, item).sort((a, b) => {
return b.sort - a.sort
})
@@ -99,7 +109,6 @@
return newData
},
handleNodeClick(node) {
- console.log(node)
this.$nextTick(() => {
if (node.isWorkstation) {
this.currentNodeKey = node.id
@@ -114,4 +123,8 @@
}
</script>
-<style lang="scss" scoped></style>
\ No newline at end of file
+<style lang="scss">
+.active .el-tree-node__content {
+ background: var(--el-color-primary) !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/mdc/alarm-statistics.vue b/src/views/mdc/alarm-statistics.vue
index 6095b7e..6d41bbd 100644
--- a/src/views/mdc/alarm-statistics.vue
+++ b/src/views/mdc/alarm-statistics.vue
@@ -1,21 +1,114 @@
<!--
* @Date: 2024-04-09 22:11:21
* @LastEditors: Sneed
- * @LastEditTime: 2024-04-15 23:51:52
+ * @LastEditTime: 2024-04-21 18:58:16
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/alarm-statistics.vue
- * 杩囩▼鍙傛暟
+ * 鏁堢巼鍒嗘瀽
-->
<template>
- <el-main>
- <el-card shadow="never">
- 杩囩▼鍙傛暟
+ <el-main style="height: 100%;">
+ <el-card shadow="never" style="height: 100%;" body-style="height: 100%">
+ <el-container style="height: 100%;">
+ <el-aside width="300px" style="height: 100%;">
+ <el-container>
+ <el-main class="nopadding">
+ <el-row>
+ <el-col style="margin-top: 14px;">鏃ユ湡</el-col>
+ <el-col>
+ <el-date-picker value-format="YYYY-MM-DD" style="width: 250px" v-model="time"
+ type="daterange" range-separator="-" start-placeholder="" end-placeholder="" />
+ </el-col>
+ </el-row>
+ <el-row style="margin-top: 14px;">
+ 宸ヤ綅
+ </el-row>
+ <MYTree v-model="treeChecked" @loaded="query"></MYTree>
+ </el-main>
+ <el-footer>
+ <el-button @click="query()">鏌ヨ</el-button>
+ <el-button>瀵煎嚭</el-button>
+ </el-footer>
+ </el-container>
+ </el-aside>
+ <el-container>
+ <el-main>
+ <el-tabs tab-position="top" v-model="activeName" type="card">
+ <el-tab-pane label="鎸夌彮娆＄粺璁�" name="shift">
+ <Shift colname="浜ч噺" url="/api/blade-mdc/alarm/summary-shift-graph" ref="shift"
+ v-if="activeName == 'shift'">
+ </Shift>
+ </el-tab-pane>
+ <el-tab-pane label="鎸夋椂闂村懆鏈熺粺璁�" name="time">
+ <Time url="/api/blade-mdc/alarm/summary-graph" ref="time" v-if="activeName == 'time'">
+ </Time>
+ </el-tab-pane>
+ </el-tabs>
+ </el-main>
+ </el-container>
+ </el-container>
</el-card>
</el-main>
</template>
<script>
-export default {
+import moment from 'moment';
+import MYTree from './MYTree.vue'
+import Shift from './components/ShiftAlarm.vue'
+import Time from './components/TimeAlarm.vue'
+export default {
+ components: {
+ MYTree,
+ Shift,
+ Time
+ },
+ watch: {
+ activeName() {
+ this.$nextTick(() => {
+ this.query()
+ })
+
+ }
+ },
+ data() {
+ return {
+ activeName: 'shift',
+ time: [],
+ treeChecked: [],
+ options: [
+ {
+ label: '绋煎姩鐜�',
+ value: 'OEE',
+ },
+ {
+ label: '鎶ヨ鐜�',
+ value: 'ALARM',
+ },
+ {
+ label: '杩愯鐜�',
+ value: 'RUNNING',
+ },
+ ]
+ }
+ },
+ created() {
+ this.time = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
+ },
+ mounted() {
+ // this.$nextTick(() => {
+ // this.query()
+ // })
+ },
+ methods: {
+ query(firstWorkKey) {
+ let workstationId = firstWorkKey ? [firstWorkKey] : [...this.treeChecked]
+ this.$refs[this.activeName].init({
+ endDate: this.time[1],
+ startDate: this.time[0],
+ workstationId
+ })
+ }
+ }
}
</script>
diff --git a/src/views/mdc/components/ShiftAlarm.vue b/src/views/mdc/components/ShiftAlarm.vue
new file mode 100644
index 0000000..27a7b87
--- /dev/null
+++ b/src/views/mdc/components/ShiftAlarm.vue
@@ -0,0 +1,190 @@
+<!--
+ * @Date: 2024-04-18 21:52:18
+ * @LastEditors: Sneed
+ * @LastEditTime: 2024-04-21 18:49:27
+ * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/ShiftAlarm.vue
+-->
+<template>
+ <el-main>
+ <el-row>
+ <el-col>
+ <el-button-group>
+ <el-button @click="btnListActive = item.id" :type="btnListActive == item.id ? 'primary' : ''"
+ v-for="item in btnList" :key="item.id">{{
+ item.title }}</el-button>
+ </el-button-group>
+ </el-col>
+ <el-col>
+ <el-switch v-model="isShowTable" class="mb-2" active-text="鏁版嵁琛�" inactive-text="缁熻鍥�" />
+ </el-col>
+
+
+ </el-row>
+ <el-row v-show="!isShowTable">
+ <el-col style="margin-top: 12px;" v-for="item in chartsData" :key="item.shiftIndex">
+ <el-card shadow="never">
+ <template #header>
+ <div class="card-header">
+ <span>{{ item.title }}</span>
+ </div>
+ </template>
+ <scEcharts height="300px" :option="item.option"></scEcharts>
+ </el-card>
+ </el-col>
+ </el-row>
+ <el-empty description="鏆傛棤鏁版嵁" v-if="tableData.length == 0"></el-empty>
+ <el-row v-show="isShowTable" v-for="(item, index) in tableData" :key="index">
+ <el-col style="margin-top: 12px;">
+ <div>{{ item.title }}</div>
+ <el-table ref="table" row-key="id" border :data="item.data" stripe>
+ <el-table-column prop="alarmCode" label="鎶ヨ浠ｇ爜" />
+ <el-table-column prop="alarmMsg" label="鎶ヨ淇℃伅" />
+ <el-table-column prop="count" label="鎶ヨ娆℃暟" />
+ </el-table>
+ </el-col>
+ </el-row>
+ </el-main>
+
+</template>
+
+<script>
+import scEcharts from '@/components/scEcharts';
+import moment from 'moment';
+export default {
+ props: {
+ url: {
+ default: '',
+ type: String,
+ },
+ },
+ components: {
+ scEcharts
+ },
+ data() {
+ return {
+ sheetUrl: '/api/blade-mdc/alarm/data-shift-sheet',
+ isShowTable: false,
+ params: {
+ enums: "SHIFT",
+ month: 0,
+ queryTime: "2024-04-18",
+ shiftIndex: 1,
+ week: 0,
+ workstationId: "",
+ year: 0,
+ },
+ btnList: [],
+ btnListActive: '',
+ tableData: [],
+ chartsData: [
+ ],
+ }
+ },
+ watch: {
+ btnListActive(val) {
+ this.queryChart({
+ ...this.params,
+ })
+ }
+ },
+ methods: {
+ init(params) {
+ this.params = {
+ ...this.params,
+ ...params,
+ workstationId: params.workstationId.toString()
+ }
+ this.getTime({
+ endDate: params.endDate,
+ startDate: params.startDate,
+ }).then(res => {
+ })
+
+ },
+ getTime(data) {
+ return new Promise(resolve => {
+ let arr = []
+ let date = moment(data.startDate)
+ arr.push({
+ title: date.format('YYYY-MM-DD'),
+ id: date.format('YYYY-MM-DD')
+ })
+ while (date.format('YYYY-MM-DD') < data.endDate) {
+ date = date.add(1, 'd')
+ arr.push({
+ title: date.format('YYYY-MM-DD'),
+ id: date.format('YYYY-MM-DD')
+ })
+ }
+ this.btnList = arr;
+ this.btnListActive = arr[0].id
+ resolve(arr)
+ })
+ },
+ queryChart(data) {
+ let dataSend = {
+ ...this.params,
+ queryTime: this.btnListActive,
+ }
+ this.queryTableData(dataSend)
+ return this.$HTTP.post(this.url, dataSend, {}).then(res => {
+ this.chartsData = res.data.map(item => {
+ return {
+ title: `鐝${item.shiftIndex} ${item.shiftIndexName}`,
+ shiftName: item.shiftName,
+ shiftIndexName: item.shiftIndexName,
+ option: this.setOptions(item.res)
+ }
+ })
+ })
+ },
+ setOptions(obj) {
+ let source = Object.keys(obj)
+ let data = Object.values(obj)
+ return {
+ legend: {
+ type: 'plain',
+ },
+ title: {
+ text: '缁熻鍥捐〃',
+ subtext: '',
+ },
+ grid: {
+ top: '80px'
+ },
+ tooltip: {
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: source
+ },
+ yAxis: {
+ type: 'value'
+ },
+ dataZoom: [
+ { type: 'slider' }
+ ],
+ series: [{
+ type: 'bar',
+ data
+ }]
+ }
+ },
+ queryTableData(data) {
+ return this.$HTTP.post(this.sheetUrl, data, {}).then(res => {
+ this.tableData = res.data.map(item => {
+ return {
+ title: `鐝${item.shiftIndex}`,
+ shiftName: item.shiftName,
+ shiftIndex: item.shiftIndex,
+ data: item.alarmDataSheetVOList
+ }
+ })
+ })
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped></style>
\ No newline at end of file
diff --git a/src/views/mdc/components/TimeAlarm.vue b/src/views/mdc/components/TimeAlarm.vue
new file mode 100644
index 0000000..2aedb51
--- /dev/null
+++ b/src/views/mdc/components/TimeAlarm.vue
@@ -0,0 +1,254 @@
+<!--
+ * @Date: 2024-04-18 21:52:18
+ * @LastEditors: Sneed
+ * @LastEditTime: 2024-04-21 19:15:52
+ * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/TimeAlarm.vue
+-->
+<template>
+ <el-row>
+ <el-col>
+ <el-switch v-model="isShowTable" class="mb-2" active-text="鏁版嵁琛�" inactive-text="缁熻鍥�" />
+ </el-col>
+ <el-col style="margin-top: 12px;">
+ <el-collapse v-model="active" accordion>
+ <el-collapse-item title="鏃� 鎸夋棩鏌ョ湅" name="1">
+ <el-button-group>
+ <el-button size="small" @click="queryDay(item)" :type="valueDay == item.value ? 'primary' : ''"
+ v-for="item in btnListDay" :key="item.value">{{
+ item.label
+ }}</el-button>
+ </el-button-group>
+ <scEcharts v-if="active == 1" style="width:100%" height="300px" :option="dayCharts"></scEcharts>
+ </el-collapse-item>
+ <el-collapse-item title="鍛� 鎸夊懆鏌ョ湅" name="2">
+ <el-button-group>
+ <el-button size="small" @click="queryWeek(item)"
+ :type="valueWeek == item.value ? 'primary' : ''" v-for="item in btnListWeek"
+ :key="item.value">{{ item.label
+ }}</el-button>
+ </el-button-group>
+ <scEcharts v-if="active == 2" style="width:100%" height="300px" :option="weekCharts"></scEcharts>
+ </el-collapse-item>
+ <el-collapse-item title="鏈� 鎸夋湀鏌ョ湅" name="3">
+ <el-button-group>
+ <el-button size="small" @click="queryMonth(item)"
+ :type="valueMonth == item.value ? 'primary' : ''" v-for="item in btnListMonth"
+ :key="item.value">{{ item.label
+ }}</el-button>
+ </el-button-group>
+ <scEcharts v-if="active == 3" height="300px" :option="monthCharts"></scEcharts>
+
+ </el-collapse-item>
+ </el-collapse>
+ </el-col>
+ </el-row>
+</template>
+
+<script>
+import scEcharts from '@/components/scEcharts';
+import moment from 'moment';
+export default {
+ props: {
+ url: {
+ default: '',
+ type: String,
+ }
+ },
+ components: {
+ scEcharts
+ },
+ data() {
+ return {
+ sheetUrl: '/api/blade-mdc/alarm/data-sheet',
+ apiObj: '',
+ params: {
+ enums: "DAY",
+ month: 0,
+ queryTime: "", //2024-05-21
+ shiftIndex: 1,
+ week: 0,
+ workstationId: "",
+ year: 0,
+ },
+ active: '1',
+ valueDay: '',
+ valueWeek: '',
+ valueMonth: '',
+ btnListDay: [],
+ btnListWeek: [],
+ btnListMonth: [],
+ dayCharts: {},
+ weekCharts: {},
+ monthCharts: {},
+ }
+ },
+ watch: {
+
+ },
+ methods: {
+ init(params) {
+ this.params.workstationId = params.workstationId.toString()
+ this.getTime({
+ endDate: params.endDate,
+ startDate: params.startDate,
+ }).then(res => {
+
+ })
+
+ },
+ getTime(data) {
+ return Promise.all([
+ this.$HTTP.post('/api/blade-mdc/efficiency-analysis/interval', {
+ ...data,
+ statisticalMethod: "DAY"
+ }).then(res => {
+ if (res.code === 200) {
+ this.btnListDay = res.data.map(item => ({
+ label: item.title,
+ value: item.id,
+ startDate: item.startDate,
+ endDate: item.endDate,
+ week: moment(item.id).week(),
+ month: moment(item.id).month() + 1,
+ year: moment(item.id).year()
+ })).reverse()
+ }
+ this.queryDay(this.btnListDay[0])
+ }),
+ this.$HTTP.post('/api/blade-mdc/efficiency-analysis/interval', {
+ ...data,
+ statisticalMethod: "WEEK"
+ }).then(res => {
+ if (res.code === 200) {
+ this.btnListWeek = res.data.map(item => ({
+ label: item.title,
+ value: item.id,
+ startDate: item.startDate,
+ endDate: item.endDate,
+ week: moment(item.startDate).week(),
+ month: moment(item.startDate).month() + 1,
+ year: moment(item.startDate).year()
+ })).reverse()
+
+ }
+ }),
+ this.$HTTP.post('/api/blade-mdc/efficiency-analysis/interval', {
+ ...data,
+ statisticalMethod: "MONTH"
+ }).then(res => {
+ if (res.code === 200) {
+ this.btnListMonth = res.data.map(item => ({
+ label: item.title,
+ value: item.id,
+ startDate: item.startDate,
+ endDate: item.endDate,
+ week: moment(item.id + '-1').week(),
+ month: moment(item.id + '-1').month() + 1,
+ year: moment(item.id + '-1').year()
+ })).reverse()
+
+ }
+ })
+ ]).then(() => {
+ this.queryWeek(this.btnListWeek[0])
+ this.queryMonth(this.btnListMonth[0])
+ })
+ },
+ queryDay(row) {
+ this.valueDay = row.value
+ this.query({
+ enums: "DAY",
+ queryTime: row.value, //2024-05-21
+ week: row.week,
+ month: row.month,
+ year: row.year,
+ shiftIndex: 1,
+ workstationId: this.params.workstationId,
+ }).then(res => {
+ this.dayCharts = res
+ })
+ },
+ queryWeek(row) {
+ this.valueWeek = row.value
+ console.log(row)
+ this.query({
+ enums: "WEEK",
+ queryTime: this.valueDay,
+ week: row.week,
+ month: row.month,
+ year: row.year,
+ workstationId: this.params.workstationId,
+ }).then(res => {
+ this.weekCharts = res
+ })
+ },
+ queryMonth(row) {
+ this.valueMonth = row.value
+ this.query({
+ enums: "MONTH",
+ queryTime: this.valueDay,
+ week: row.week,
+ month: row.month,
+ year: row.year,
+ workstationId: this.params.workstationId,
+ }).then(res => {
+ this.monthCharts = res
+ })
+ },
+ query(data) {
+ console.log(data)
+ this.queryTableData(data)
+ return this.$HTTP.post(this.url, data, {}).then(res => {
+ return this.setOptions(res.data.res)
+ })
+ },
+ setOptions(obj) {
+ let source = Object.keys(obj)
+ let data = Object.values(obj)
+ return {
+ legend: {
+ type: 'plain',
+ },
+ title: {
+ text: '',
+ subtext: '',
+ },
+ grid: {
+ top: '80px'
+ },
+ tooltip: {
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: source
+ },
+ yAxis: {
+ type: 'value'
+ },
+ dataZoom: [
+ { type: 'slider' }
+ ],
+ series: [{
+ type: 'bar',
+ data
+ }]
+ }
+ },
+ queryTableData() {
+ return this.$HTTP.post(this.sheetUrl, data, {}).then(res => {
+ this.tableData = res.data.map(item => {
+ return {
+ title: `鐝${item.shiftIndex}`,
+ shiftName: item.shiftName,
+ shiftIndex: item.shiftIndex,
+ data: item.alarmDataSheetVOList
+ }
+ })
+ })
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped></style>
\ No newline at end of file
--
Gitblit v1.9.3