From eb967d7573a8297e493d455dfce2c77319215990 Mon Sep 17 00:00:00 2001
From: wuyouming666 <2265557248@qq.com>
Date: 星期三, 13 九月 2023 08:31:25 +0800
Subject: [PATCH] 注册页面中英文替换 修改电气管理顶部导航栏布局
---
CanadaMes-ui/src/views/Electrical/alarm.vue | 204 +++++++++++++++++++++++++++++++++-----------------
1 files changed, 134 insertions(+), 70 deletions(-)
diff --git a/CanadaMes-ui/src/views/Electrical/alarm.vue b/CanadaMes-ui/src/views/Electrical/alarm.vue
index fa6f8c3..946a1e2 100644
--- a/CanadaMes-ui/src/views/Electrical/alarm.vue
+++ b/CanadaMes-ui/src/views/Electrical/alarm.vue
@@ -2,81 +2,61 @@
<div class="app">
<!--闈㈠寘灞戝鑸尯鍩�-->
<el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">
- <router-link to="/home" tag="el-button" type="text">{{ $t('langHome') }}</router-link>
- <el-button type="text">璁惧绠＄悊</el-button>
- <router-link to="/Electrical/Parameter" tag="el-button" type="text">Parameter</router-link>
- <router-link to="/Electrical/Action" tag="el-button" type="text">Action</router-link>
- <router-link to="/Electrical/Sign" tag="el-button" type="text">Sign</router-link>
- <router-link to="/Electrical/State" tag="el-button" type="text">State</router-link>
- <router-link to="/Electrical/alarm" tag="el-button" type="text">Alarm</router-link>
+ <router-link to="/Electrical/Parameter" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter') }}</router-link>
+ <router-link to="/Electrical/Action" tag="el-button" type="text" active-class="blue-button">{{ $t('Action') }}</router-link>
+ <router-link to="/Electrical/Sign" tag="el-button" type="text" active-class="blue-button">{{ $t('Sign') }}</router-link>
+ <router-link to="/Electrical/State" tag="el-button" type="text" active-class="blue-button">{{ $t('State') }}</router-link>
+ <router-link to="/Electrical/alarm" tag="el-button" type="text" active-class="blue-button">{{ $t('Alarm') }}</router-link>
</el-breadcrumb>
<div>Alarm</div>
- <!-- <el-form label-width="100px" style="display: flex;flex-wrap: wrap;" :model="{ messagepack }">
- <div class="kuai_div" v-for="item in this.record.xyData" :key="item[1]">
- <el-input v-model="item[1]" style="width: 240px;" class="in_mc"></el-input>
- <el-switch v-model="item[0]" active-value="0" inactive-value="1"></el-switch>
- </div>
- </el-form> -->
+ <div class="block">
+ <span class="demonstration">鏃堕棿锛�</span>
+ <el-date-picker v-model="shijian1" type="datetime" placeholder="閫夋嫨鏃ユ湡鏃堕棿" align="right"
+ :picker-options="pickerOptions">
+ </el-date-picker>
+ ~
+ <el-date-picker v-model="shijian2" type="datetime" placeholder="閫夋嫨鏃ユ湡鏃堕棿" align="right"
+ :picker-options="pickerOptions">
+ </el-date-picker>
+
+ <el-button type="primary" @click="selectTime()">{{ $t('Search') }}</el-button>
+ </div>
- <el-table :data="record.xyData" style="width: 100%">
- <el-table-column prop="xyData[1]" label="content" width="180">
+ <el-table :data="localizedRoles" style="width: 100%;" height="550">
+ <el-table-column prop="id" label="id" width="80">
</el-table-column>
- <el-table-column prop="name" label="time-on" width="180">
+ <el-table-column prop="content" label="content">
</el-table-column>
- <el-table-column prop="address" label="End Time">
+ <el-table-column prop="timeon" label="time-on">
+ </el-table-column>
+ <el-table-column prop="endTime" label="End Time">
</el-table-column>
</el-table>
</div>
</template>
<script >
+import { setAll, setTime } from "../../api/alarm";
+import moment from 'moment';
+//setTime
+import LanguageMixin from '../../lang/LanguageMixin'
let socket;
export default {
name: "alarm",
+ mixins: [LanguageMixin],
data () {
return {
+ activeButton: '',
record: {
- params: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
- canshu: [
- 'D01 VFD error',
- 'D02 VFD error',
- 'D03 VFD error',
- 'D04 VFD conveyor',
- 'D05 VFD conveyor',
- 'D06 VFD conveyor',
- 'A01 VFD conveyor',
- 'A02 VFD conveyor',
- 'B01 VFD conveyor',
- 'B02 VFD conveyor',
- 'A01 SERVE TURN JOG+',
- 'A02 SERVE TURN JOG-',
- 'A01 SERVE TRAVEL JOG+',
- 'A02 SERVE TRAVEL JOG-',
- 'B01 SERVE TRAVEL JOG+',
- 'B02 SERVE TRAVEL JOG-',
- 'A01 SERVE TURN POS',
- 'A02 SERVE TURN POS',
- 'A01 SERVE TRAVEL POS',
- 'A02 SERVE TRAVEL POS',
- 'B01 SERVE TRAVEL POS',
- 'B02 SERVE TRAVEL POS',
- 'B01 YV TURN',
- 'B01 YV UP DOWN',
- 'B02 YV TURN',
- 'B02 YV UP DOWN',
- ],
- // canshu: [
- // '1',
- // '1',
- // '0',
- // '0',
- // '0',
- // '0'
- // ],
- xyData: [],
- },
+ params: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+ // xyData: [],
+
+ },
+ roles: [],
+
+ localizedRoles: [],
messagepack: {
data: { taskname: "" }
@@ -85,15 +65,97 @@
data: "1",
pageSize: 10
},
+ pickerOptions: {
+ shortcuts: [{
+ text: '浠婂ぉ',
+ onClick (picker) {
+ picker.$emit('pick', new Date());
+ }
+ }, {
+ text: '鏄ㄥぉ',
+ onClick (picker) {
+ const date = new Date();
+ date.setTime(date.getTime() - 3600 * 1000 * 24);
+ picker.$emit('pick', date);
+ }
+ }, {
+ text: '涓�鍛ㄥ墠',
+ onClick (picker) {
+ const date = new Date();
+ date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
+ picker.$emit('pick', date);
+ }
+ }],
+ },
+ shijian1: "",
+ shijian2: "",
}
+
+
},
created () {
this.init();
+
+
+ if (this.shijian1 == "" || this.shijian2 == "") {
+ //鏌ヨ褰撳ぉ鎶ヨ淇℃伅
+ this.load();
+ }
+ else {
+ //鏍规嵁鏃堕棿鏌ヨ鎶ヨ淇℃伅
+ this.selectTime();
+ }
+
},
methods: {
+ onButtonClick() {
+ this.isButtonClicked = true; // 灏嗘寜閽鑹茶缃负钃濊壊
+ setTimeout(() => {
+ this.isButtonClicked = false; // 閲嶇疆鎸夐挳棰滆壊
+ }, 500); // 杩欓噷鐨�500姣鏄牴鎹偍甯屾湜鎸夐挳棰滆壊鎸佺画澶氶暱鏃堕棿鏉ュ畾鐨勶紝鍙互鏍规嵁闇�姹傝繘琛岃皟鏁�
+ },
+
+ load () {
+ setAll().then(res => {
+ this.roles = res.data.list;
+ const language = this.$i18n.locale;
+ if (language === 'zh-CN') {
+ this.replaceChineseWithEnglish();
+ } else {
+ this.localizedRoles = [...this.roles];
+ }
+ //console.log(this.localizedRoles);
+ });
+
+ },
+ selectTime () {
+ //moment闇�瑕佸崟鐙畨杞緷璧栵紝npm install moment
+ let sj1 = moment(this.shijian1).format('YYYY-MM-DD%20HH:mm');
+ let sj2 = moment(this.shijian2).format('YYYY-MM-DD%20HH:mm')
+ //璋冪敤setTime鏂规硶缁檙oles璧嬪��
+ setTime(sj1, sj2).then(res => {
+ this.roles = res.data.list;
+ //table涓殑鍐呭杩涜璇█杞崲
+ const language = this.$i18n.locale;
+ if (language === 'zh-CN') {
+ this.replaceChineseWithEnglish();
+ } else {
+ this.localizedRoles = [...this.roles];
+ }
+ });
+ },
+ //璇█杞崲
+ replaceChineseWithEnglish () {
+ const translation = this.$t('translation');
+ this.localizedRoles = this.roles.map(role => ({
+ ...role,
+ content: translation[role.content] || role.content
+ }));
+ },
+
init () {
- let viewname = "Action";
+ let viewname = "alarm";
if (typeof (WebSocket) == "undefined") {
console.log("鎮ㄧ殑娴忚鍣ㄤ笉鏀寔WebSocket");
@@ -113,18 +175,16 @@
};
// 娴忚鍣ㄧ鏀舵秷鎭紝鑾峰緱浠庢湇鍔＄鍙戦�佽繃鏉ョ殑鏂囨湰娑堟伅
socket.onmessage = function (msg) {
-
- //console.log("鏀跺埌鏁版嵁====" + msg.data);
let obj = JSON.parse(msg.data);
- this.record.params[0] = obj.acion[0].join(",");
- this.record.params[0] = this.record.params[0].split(",");
-
- for (let a = 0; a <= this.record.params.length - 1; a++) {
- this.record.xyData[a] = [this.record.params[0][a], this.record.canshu[a]];
+ this.record.params[0] = obj.arm;
+ //姣忔璇锋眰鏇存柊鏁版嵁
+ if (this.shijian1 == "" || this.shijian2 == "") {
+ this.load();
}
- //console.log(this.record.params[0]);
- //console.log(this.record.xyData);
+ else {
+ this.selectTime();
+ }
this.$forceUpdate();
}.bind(this);
//鍏抽棴浜嬩欢
@@ -138,10 +198,6 @@
}
},
- send () {
- this.messagepack.data = { taskname: "鍓嶇鍒板悗鍙�" };
- socket?.send(JSON.stringify(this.messagepack)); // 灏嗙粍瑁呭ソ鐨刯son鍙戦�佺粰鏈嶅姟绔紝鐢辨湇鍔＄杩涜杞彂
- }
}
@@ -176,4 +232,12 @@
border: none;
}
}
+
+td div,
+th div {
+ text-align: center;
+}
+.blue-button {
+ background-color: skyblue;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0