From c4f8cc1f88a83de4784b5fc90496ff79d377e321 Mon Sep 17 00:00:00 2001
From: hwh <332078369@qq.com>
Date: 星期五, 06 九月 2024 16:51:35 +0800
Subject: [PATCH] 设备监控设置
---
Web/src/views/device/deviceMonitor/index.vue | 24 +++++-
Web/src/views/device/alarmManage/index.vue | 2
Web/src/views/device/deviceMonitor/component/setting.vue | 198 +++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 220 insertions(+), 4 deletions(-)
diff --git a/Web/src/views/device/alarmManage/index.vue b/Web/src/views/device/alarmManage/index.vue
index 3d1de64..55db218 100644
--- a/Web/src/views/device/alarmManage/index.vue
+++ b/Web/src/views/device/alarmManage/index.vue
@@ -56,6 +56,7 @@
import 'splitpanes/dist/splitpanes.css';
import { listWcsAlarmInfo, resetWcsAlarmInfo } from '/@/api/wcs/wcsAlarmInfo';
import { signalR } from './signalR';
+import { ElMessageBox, ElMessage } from "element-plus";
//杩炴帴signalR 鐩戝惉鍙樻洿
onMounted(async () => {
signalR.off('PublicAlarm');
@@ -1951,6 +1952,7 @@
//澶嶄綅鎶ヨ
const reset = async () => {
await resetWcsAlarmInfo({ layer: layer.value });
+ ElMessage.success("澶嶄綅鎴愬姛");
// await handleQuery();
}
diff --git a/Web/src/views/device/deviceMonitor/component/setting.vue b/Web/src/views/device/deviceMonitor/component/setting.vue
new file mode 100644
index 0000000..c663b22
--- /dev/null
+++ b/Web/src/views/device/deviceMonitor/component/setting.vue
@@ -0,0 +1,198 @@
+<template>
+ <div class="wcsAlarmInfo-container">
+ <el-dialog v-model="isShowDialog" :width="800" draggable="" :close-on-click-modal="false">
+ <template #header>
+ <div class="dialog-header">
+ <span>{{ props.title }}</span>
+ </div>
+ </template>
+
+ <el-card class="box-card" shadow="hover">
+ <template #header>
+ <div class="card-header">
+
+ <div>
+ <span>宸ヤ綅鍙凤細</span>
+ <el-select v-model="stationValue" placeholder="璇烽�夋嫨" filterable value-key="stationNum"
+ style="width: 200px;">
+ <el-option v-for="item in listStationsData" :key="item.id" :label="item.stationNum"
+ :value="item">
+ </el-option>
+ </el-select>
+ <el-button style="margin-left: 10px;">鑷姩</el-button>
+ </div>
+ <div>
+ <div :class="['lineStatus', stationValue.status ? 'device-status-0' : 'device-status-1']"></div>
+ </div>
+ </div>
+ </template>
+ <div>
+ <el-form label-position="left" label-width="80px">
+ <el-row :gutter="25">
+ <el-col :span="12">
+ <el-form-item label="璧峰宸ヤ綅">
+ <el-input v-model="stationValue.startLocatNo"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鐩殑宸ヤ綅">
+ <el-input v-model="stationValue.endLocatNo"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="PLC">
+ <el-input v-model="stationValue.plc"></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="WCS">
+ <el-input v-model="stationValue.wcs"></el-input>
+ </el-form-item>
+ </el-col>
+
+ <el-col :span="12">
+ <el-form-item label="鍙栬揣鎺�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鏀捐揣鎺�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍙栬揣鍒�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鏀捐揣鍒�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鍙栬揣灞�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ <el-col :span="12">
+ <el-form-item label="鏀捐揣灞�">
+ <el-input ></el-input>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <div style="text-align: center;margin: 10px;">
+ <el-button class="button" size="large">鍐欏叆鏁版嵁</el-button>
+ </div>
+ </div>
+ <template #footer>
+ <div class="card-footer">
+ <el-button class="button" size="large">姝� 杞�</el-button>
+ <el-button class="button" size="large">鍙� 杞�</el-button>
+ <el-button class="button" size="large">绉绘牻涓婂崌</el-button>
+ <el-button class="button" size="large">绉绘牻涓嬮檷</el-button>
+ </div>
+ </template>
+ </el-card>
+
+ <!-- <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="closeDialog" type="primary">鍏� 闂�</el-button>
+ </span>
+ </template> -->
+ </el-dialog>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, defineModel } from 'vue';
+const listStationsData = defineModel<any>("listStationsData")
+const stationValue = defineModel<any>("stationValue")
+
+const props = defineProps({
+ title: {
+ type: String,
+ default: '',
+ }
+});
+// const emit = defineEmits<{ (e: "update:listStationsData", value: Array<any>): void, (e: "update:stationValue", value): void }>()
+
+// const handlestationChange = () => {
+// emit('update:listStationsData', listStationsData.value);
+// emit('update:stationValue', stationValue);
+// };
+
+const isShowDialog = ref(false);
+
+const openDialog = async (row: any) => {
+ console.log(listStationsData.value);
+ debugger;
+ isShowDialog.value = true;
+};
+
+const closeDialog = () => {
+ isShowDialog.value = false;
+};
+
+defineExpose({ openDialog });
+</script>
+
+<style>
+.el-col {
+ margin-bottom: 15px;
+}
+
+.card-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: #fff;
+ padding: 10px;
+ border-radius: 10px 10px 0 0;
+}
+
+.card-footer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.text {
+ font-size: 14px;
+ color: #fff;
+}
+
+.item {
+ margin-bottom: 18px;
+}
+
+.box-card {
+ width: 100%;
+ background: linear-gradient(135deg, #66ccff, #3399ff);
+ border-radius: 10px;
+ color: #fff;
+}
+
+.dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ padding: 10px;
+}
+
+.lineStatus {
+ right: 0;
+ height: 20px;
+ width: 20px;
+ border-radius: 50%;
+ background-color: #67C23A;
+}
+
+.device-status-0 {
+ background-color: #67C23A;
+}
+
+.device-status-1 {
+ background-color: red;
+}
+</style>
\ No newline at end of file
diff --git a/Web/src/views/device/deviceMonitor/index.vue b/Web/src/views/device/deviceMonitor/index.vue
index 8865fab..03e945c 100644
--- a/Web/src/views/device/deviceMonitor/index.vue
+++ b/Web/src/views/device/deviceMonitor/index.vue
@@ -11,7 +11,7 @@
<el-option v-for="item in lineOptions" :key="item.id" :label="item.text"
:value="item.id"></el-option>
</el-select>
- <el-select v-model="stationValue" placeholder="璇烽�夋嫨" style="margin-top: 10px;"
+ <el-select v-model="stationValue" placeholder="璇烽�夋嫨" style="margin-top: 10px;" filterable
value-key="stationNum">
<el-option v-for="item in listStationsData" :key="item.id" :label="item.stationNum"
:value="item">
@@ -53,7 +53,7 @@
<el-form label-position="left" label-width="80px">
<el-form-item>
<el-button>鍐欏叆</el-button>
- <el-button>璁剧疆</el-button>
+ <el-button @click="openDialog">璁剧疆</el-button>
</el-form-item>
</el-form>
</div>
@@ -100,13 +100,13 @@
<el-form label-position="left">
<el-form-item>
<el-button>鍐欏叆</el-button>
- <el-button>璁剧疆</el-button>
</el-form-item>
</el-form>
</div>
</el-card>
</div>
</el-main>
+ <setting ref="settingDialogRef" :title="title" v-model:listStationsData="listStationsData" v-model:stationValue="stationValue" />
</el-container>
</template>
@@ -116,11 +116,14 @@
import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
import { listWcsPlc } from '/@/api/wcs/wcsPlc';
+import setting from '/@/views/device/deviceMonitor/component/setting.vue'
+
const stations = ref<any>([]);
const listStationsData = ref<any>([]);
const listStackingMachineData = ref<any>([]);
const lineOptions = ref<any>([]);
const lineValue = ref(1);
+const title = ref<string>('');
const stationValue = ref<any>({
taskNo: '',
taskType: '',
@@ -130,7 +133,11 @@
wcs: '',
status: false
});
-
+const settingDialogRef = ref();
+// 鎵撳紑鎵撳嵃椤甸潰
+const openDialog = async () => {
+ settingDialogRef.value.openDialog(stationValue);
+}
// 鏌ヨ鎿嶄綔
const handleQuery = async () => {
var listplc = await listWcsPlc({ type: 1 });
@@ -146,11 +153,14 @@
listStationsData.value = stations.value[lineValue.value];
stationValue.value = listStationsData.value[0];
}
+ title.value = listStationsData.value[0].text;
};
+
handleQuery();
const handleLineChange = (field: string, value: number) => {
listStationsData.value = stations.value[value];
+ title.value = lineOptions.value.filter(s => s.id == value)[0].text;
if (listStationsData.value.length > 0)
stationValue.value = listStationsData.value[0];
};
@@ -166,6 +176,12 @@
margin-bottom: 10px;
}
+.el-button {
+ background-color: #fff;
+ border-color: #fff;
+ color: #000000;
+}
+
.linefix {
border-bottom: 1px solid rgb(197, 195, 195);
display: flex;
--
Gitblit v1.8.0