{{ prop.data.name }}
@@ -51,6 +51,10 @@ let statusClass = computed(() => {
return prop.data.status == '在线' ? 'online' : 'outline'
})
+let borderBoxColor = computed(() => {
+ return prop.data.status == '在线' ? ['#FF8C00', '#FF8C00'] : ['#999999', '#999999']
+})
+
onMounted(() => {
@@ -77,9 +81,9 @@ onMounted(() => {
width: 80px;
height: 30px;
line-height: 30px;
- top: 8px;
+ top: 20px;
left: 12px;
- font-size: 16px;
+ font-size: 20px;
}
.right-top {
@@ -96,12 +100,12 @@ onMounted(() => {
.right-top .num {
color: #1E90FF;
- font-size: 18px;
+ font-size: 20px;
}
.right-top .name {
color: #fff;
- font-size: 12px;
+ font-size: 14px;
}
.bottom {
@@ -110,7 +114,7 @@ onMounted(() => {
color: #fff;
font-weight: bold;
position: absolute;
- bottom: 8px;
+ bottom: 20px;
left: 0;
text-align: center;
overflow: hidden;
@@ -120,10 +124,10 @@ onMounted(() => {
align-items: center;
}
.bottom text {
- font-size: 18px;
+ font-size: 20px;
}
.bottom small {
- font-size: 14px;
+ font-size: 16px;
}
.chart {
diff --git a/src/views/MicrofactoryDevOnline/index.vue b/src/views/MicrofactoryDevOnline/index.vue
index 71950b5..25a7c81 100644
--- a/src/views/MicrofactoryDevOnline/index.vue
+++ b/src/views/MicrofactoryDevOnline/index.vue
@@ -21,6 +21,7 @@ import header2 from "@/components/headerBox/header2.vue";
import RingChart from "./components/RingChart.vue";
import { ref,onMounted,onUnmounted } from 'vue'
import {getSewingBoard} from '@/http/device'
+import { connectWebsocket, closeWebsocket } from "@/utils/websocket";
import { useI18n } from 'vue-i18n'
let { t } = useI18n();
@@ -37,44 +38,58 @@ let titleTip = [
];
let timer = null;
let arr = ref([]);
-
+let arr_num = ref([]);
function reqSewingBoard() {
getSewingBoard().then((res:any) => {
if (res.code == 200) {
+ let nums = []
arr.value = res.data.map(item=>{
+ nums.push(item.num)
return {
- id: '',
+ id: item.id,
+ num: item.num,
status: item.status == 'true'? '在线':'离线',
name: item.name,
label: item.label,
- count: item.pins,
- series: item.series
+ count: item.in4TodayCount,
+ todayRunTime: item.todayRunTime,
+ todayWorkTime: item.todayWorkTime,
}
});
+ arr_num.value = nums;
}
})
}
-// for (let index = 0; index < 21; index++) {
-// let random = +(Math.random() * 24).toFixed(1);
-// arr.push({
-// id: '',
-// status: '在线',
-// name: '五线包缝机',
-// label: 'RP2011158',
-// count: 0,
-// series: [
-// { value: random, name: '工作时间' },
-// { value: (24-random).toFixed(1), name: '空闲时间' }
-// ]
-// })
-// }
+function getWebsocket(val) {
+ try {
+ let data = JSON.parse(val);
+
+ //
+ if (data.type == "mDeviceStatus"&&arr_num.value.includes(data.msg.num)) {
+ let msg = arr.value.find(item=>item.num == data.msg.num)
+ msg.status = data.msg.status === 0? '离线':'在线'
+
+
+ }
+
+ } catch (err) {
+ console.log(err, "报错了大哥", console.log(val)
+ );
+
+ }
+}
+function errWebsocket(val) {
+
+ console.log(val);
+}
onMounted(()=>{
reqSewingBoard()
timer = setInterval(() => {
reqSewingBoard()
}, 60000);
+ connectWebsocket(null, null, getWebsocket, errWebsocket);
})
onUnmounted(()=>{
clearInterval(timer);
@@ -100,7 +115,7 @@ onUnmounted(()=>{
}
.ringchart {
- width: 260px;
+ width: 280px;
height: 300px;
}
diff --git a/src/views/Recorder/index.vue b/src/views/Recorder/index.vue
index 16632a8..7e2c9eb 100644
--- a/src/views/Recorder/index.vue
+++ b/src/views/Recorder/index.vue
@@ -39,19 +39,25 @@
-
+
-
+
-
+
+
+
+
+
+
+
@@ -105,6 +111,19 @@ let pdfOptions = reactive({ //显示的配置信息
},
})
+let isMobile = ref(false)
+//判断当前环境是PC端还是移动端
+function heckMobile() {
+ isMobile.value = typeof window.orientation !== "undefined" || // 判断是否存在window.orientation属性，此属性在移动设备上一般存在
+ navigator.userAgent.indexOf('IEMobile') !== -1 || // 判断是否为Windows Phone
+ navigator.userAgent.indexOf('iPhone') !== -1 || // 判断是否为iPhone
+ navigator.userAgent.indexOf('Android') !== -1 && navigator.userAgent.indexOf('Mobile') !== -1 || // 判断是否为Android手机
+ navigator.userAgent.indexOf('BlackBerry') !== -1 || // 判断是否为BlackBerry
+ navigator.userAgent.indexOf('Opera Mini') !== -1 // 判断是否为Opera Mini浏览器
+ console.log(isMobile.value,navigator.userAgent);
+
+}
+
//打开录音，申请录音权限
function recOpen() {
//创建录音对象
@@ -260,6 +279,7 @@ function getData() {
}
onMounted(() => {
+ heckMobile()
getData()
// recOpen()
//document.getElementById('app').style.background = '#fff'
@@ -367,11 +387,13 @@ onUnmounted(() => {
justify-content: space-around;
align-items: center;
}
+
.item-btn .wave-start {
- .wave {
- animation: audio-wave 2s ease-in-out infinite;
- }
+ .wave {
+ animation: audio-wave 2s ease-in-out infinite;
}
+}
+
.item-btn .audio {
display: flex;
justify-content: space-between;
@@ -379,7 +401,7 @@ onUnmounted(() => {
gap: 18px;
width: 80px;
height: 40px;
-
+
.wave {
height: 40px;
display: block;
@@ -387,7 +409,7 @@ onUnmounted(() => {
height: 6px;
border-radius: 8px;
background: orange;
-
+
&:nth-child(1) {
animation-delay: 0.1s;
}