xunyingcloud/totustec-unipp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加详情信息

Browse Source
This commit is contained in:
18796357645 2025-07-15 17:34:49 +08:00
parent 999489671d
commit 056af4fbb0
2 changed files with 787 additions and 762 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

253
pages/deviceManage/index.vue
View File

@ -22,7 +22,8 @@
</view> </view>
<view class="select_device_item" :class="{ device_active: getType == 'img' }" <view class="select_device_item" :class="{ device_active: getType == 'img' }"
@click="getVideoImg('img')"> @click="getVideoImg('img')">
获取图片</view> 获取图片
</view>
</view> </view>
</view> </view>
@ -35,11 +36,14 @@
<view class="select_device_warp"> <view class="select_device_warp">
<view class="modal_warp"> <view class="modal_warp">
<view class="select_device_item device_model" :class="{ device_active: deviceType == 1 }" <view class="select_device_item device_model" :class="{ device_active: deviceType == 1 }"
@click="deviceType = 1">设备状态</view> @click="deviceType = 1">设备状态
</view>
<view class="select_device_item device_model" :class="{ device_active: deviceType == 2 }" <view class="select_device_item device_model" :class="{ device_active: deviceType == 2 }"
@click="deviceType = 2">设备日志</view> @click="deviceType = 2">设备日志
</view>
<view class="select_device_item device_model" :class="{ device_active: deviceType == 3 }" <view class="select_device_item device_model" :class="{ device_active: deviceType == 3 }"
@click="deviceType = 3">设备控制</view> @click="deviceType = 3">设备控制
</view>
</view> </view>
</view> </view>
@ -106,13 +110,32 @@
</view> </view>
</view> </view>
</view> </view>
<view class="device_status_item" v-for="(field, idx) in statusTwoFields" :key="idx">
<view class="statusItem_modal_warp">
<view class="item_content_warp">
<view class="item_content_left">{{ field.label }}</view>
<view class="item_content_middel">
{{ printInfo[field.key] }}
</view>
</view>
<view class="itemContent_line_warp">
<view class="item_content_model">
<view class="item_content_line"></view>
</view>
</view>
</view>
</view>
</view> </view>
<!-- 设备控制 --> <!-- 设备控制 -->
<view class="device_control_warp" v-if="deviceType == 3"> <view class="device_control_warp" v-if="deviceType == 3">
<view class="deviceN_input_warp"> <view class="deviceN_input_warp">
<view class="device_name_txt"> 请输入设备名称：</view> <view class="device_name_txt"> 请输入设备名称：</view>
<view class="deviceN_input_area"> <view class="deviceN_input_area">
<input class="deviceN_input" type="text" v-model="deviceName" @input="onDeviceNameInput" /> <input class="deviceN_input" type="text" v-model="deviceName" @input="onDeviceNameInput"/>
<view class="clear_deviceN_warp"> <view class="clear_deviceN_warp">
<image class="clear_deviceN_icon" @click="deviceName = ''" v-if="deviceName" <image class="clear_deviceN_icon" @click="deviceName = ''" v-if="deviceName"
src="https://online.totustec.com/upload/deviceManage/clear_deviceN_icon.png"> src="https://online.totustec.com/upload/deviceManage/clear_deviceN_icon.png">
@ -143,7 +166,7 @@
: '#cccccc', : '#cccccc',
}"> }">
<image class="operation_btn_icon" <image class="operation_btn_icon"
src="https://online.totustec.com/upload/print_status1.png"></image> src="https://online.totustec.com/upload/deviceManage/print_status1.png"></image>
<view class="operation_btn_txt">继续打印</view> <view class="operation_btn_txt">继续打印</view>
</view> </view>
</view> </view>
@ -168,7 +191,7 @@
: '#cccccc', : '#cccccc',
}"> }">
<image class="operation_btn_icon" <image class="operation_btn_icon"
src="https://online.totustec.com/upload/print_status1.png"></image> src="https://online.totustec.com/upload/deviceManage/print_status1.png"></image>
<view class="operation_btn_txt">退出打印</view> <view class="operation_btn_txt">退出打印</view>
</view> </view>
</view> </view>
@ -193,10 +216,11 @@
</view> </view>
</template> </template>
<script> <script>
import { import {
BASE_STOKECT_URL BASE_STOKECT_URL, BASE_IMG_URL
} from "@/config.js"; } from "@/config.js";
export default {
export default {
data() { data() {
return { return {
deviceName: "", deviceName: "",
@ -206,6 +230,7 @@
deviceType: 3, deviceType: 3,
deviceCode: "", // 存储接收到的设备编码 deviceCode: "", // 存储接收到的设备编码
deviceDetail: {}, // 存储设备详情数据 deviceDetail: {}, // 存储设备详情数据
printInfo: {},//存储设备二级详情数据
statusMap: { statusMap: {
0: { 0: {
text: "正常", text: "正常",
@ -240,8 +265,8 @@
color: "#ff0000" color: "#ff0000"
}, },
}, },
// 新增：设备状态字段配置 statusFields: [
statusFields: [{ {
label: '设备名称', label: '设备名称',
key: 'brand' key: 'brand'
}, },
@ -255,6 +280,19 @@
key: 'errorStatus', key: 'errorStatus',
isErrorStatus: true isErrorStatus: true
}, },
{
label: '错误码',
key: 'errorStatus',
isErrorCode: true
},
{
label: '当前时间',
key: 'currentTime',
isCurrentTime: true
}
],
statusTwoFields: [
{ {
label: '当前打印层数', label: '当前打印层数',
key: 'currentLayer' key: 'currentLayer'
@ -265,36 +303,25 @@
}, },
{ {
label: '已打印时间(s)', label: '已打印时间(s)',
key: 'printedTime' key: 'currentTicks'
}, },
{ {
label: '总打印时间(s)', label: '总打印时间(s)',
key: 'totalTime' key: 'totalTicks'
}, },
{ {
label: '打印文件名称', label: '打印文件名称',
key: 'fileName' key: 'filename'
},
{
label: '错误码',
key: 'errorStatus',
isErrorCode: true
}, },
{ {
label: '当前任务数量', label: '当前任务数量',
key: 'Task' key: 'task'
}, },
{ {
label: '总共任务数量', label: '总共任务数量',
key: 'totalTask' key: 'total'
}, },
{
label: '当前时间',
key: 'currentTime',
isCurrentTime: true
}
], ],
// WebSocket 相关状态 // WebSocket 相关状态
socketTask: null, // uni-app 的 WebSocket 任务实例 socketTask: null, // uni-app 的 WebSocket 任务实例
isSocketConnected: false, // 连接状态 isSocketConnected: false, // 连接状态
@ -392,7 +419,7 @@
this.socketData = message.data; this.socketData = message.data;
if (this.socketData.imageUrl) { if (this.socketData.imageUrl) {
this.socketData.imageUrl = this.socketData.imageUrl =
"http://online.totustec.com" + message.data.imageUrl; BASE_IMG_URL + message.data.imageUrl;
} }
} }
// WRITEIMG 接收图片数据中 // WRITEIMG 接收图片数据中
@ -541,7 +568,9 @@
if (res.statusCode === 200) { if (res.statusCode === 200) {
this.deviceDetail = res.data; this.deviceDetail = res.data;
this.printInfo = res.data.printInfo;
console.log("设备详情:", this.deviceDetail); console.log("设备详情:", this.deviceDetail);
} }
} catch (error) { } catch (error) {
console.error("获取设备详情失败:", error); console.error("获取设备详情失败:", error);
@ -556,23 +585,23 @@
// console.log('输入内容：', e.detail.value); // console.log('输入内容：', e.detail.value);
}, },
}, },
}; };
</script> </script>
<!-- 临时样式 --> <!-- 临时样式 -->
<style scoped> <style scoped>
.operation_btn_icon { .operation_btn_icon {
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
margin-right: 10rpx; margin-right: 10rpx;
} }
.operation_btn_txt { .operation_btn_txt {
font-weight: 600; font-weight: 600;
font-size: 28rpx; font-size: 28rpx;
color: #333333; color: #333333;
} }
.device_operation_btn { .device_operation_btn {
width: 320rpx; width: 320rpx;
height: 68rpx; height: 68rpx;
background: #ffffff; background: #ffffff;
@ -580,16 +609,16 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.device_operation_warp { .device_operation_warp {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 24rpx; margin-bottom: 24rpx;
} }
.deviceN_input_tip { .deviceN_input_tip {
margin: 24rpx 0 70rpx 0; margin: 24rpx 0 70rpx 0;
font-weight: 400; font-weight: 400;
font-size: 26rpx; font-size: 26rpx;
@ -597,33 +626,33 @@
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.device_control_warp { .device_control_warp {
width: 710rpx; width: 710rpx;
margin-top: 32rpx; margin-top: 32rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.deviceN_input_warp { .deviceN_input_warp {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.device_name_txt { .device_name_txt {
font-weight: 600; font-weight: 600;
font-size: 32rpx; font-size: 32rpx;
color: #333333; color: #333333;
} }
.deviceN_input_area { .deviceN_input_area {
position: relative; position: relative;
} }
.clear_deviceN_warp { .clear_deviceN_warp {
position: absolute; position: absolute;
right: 16rpx; right: 16rpx;
top: 0; top: 0;
@ -633,14 +662,14 @@
z-index: 99; z-index: 99;
pointer-events: auto; pointer-events: auto;
width: 40rpx; width: 40rpx;
} }
.clear_deviceN_icon { .clear_deviceN_icon {
width: 26rpx; width: 26rpx;
height: 26rpx; height: 26rpx;
} }
.deviceN_input { .deviceN_input {
width: 419rpx; width: 419rpx;
height: 74rpx; height: 74rpx;
background: #ffffff; background: #ffffff;
@ -649,108 +678,108 @@
font-weight: 400; font-weight: 400;
font-size: 28rpx; font-size: 28rpx;
color: #666666; color: #666666;
} }
.label_text { .label_text {
margin-left: 8rpx; margin-left: 8rpx;
} }
.label_text2 { .label_text2 {
color: #ff0000; color: #ff0000;
} }
.label_warp { .label_warp {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.label_warp2 { .label_warp2 {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.label_icon { .label_icon {
width: 18rpx; width: 18rpx;
height: 18rpx; height: 18rpx;
background: #cccccc; background: #cccccc;
border-radius: 100%; border-radius: 100%;
} }
.item_content_model { .item_content_model {
padding: 0 20rpx; padding: 0 20rpx;
} }
.item_content_line { .item_content_line {
width: 100%; width: 100%;
height: 1rpx; height: 1rpx;
background-color: #ededed; background-color: #ededed;
} }
.itemContent_line_warp { .itemContent_line_warp {
width: 100%; width: 100%;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
} }
.item_content_middel { .item_content_middel {
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-weight: 400; font-weight: 400;
font-size: 26rpx; font-size: 26rpx;
color: #666666; color: #666666;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.item_content_left { .item_content_left {
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-weight: 600; font-weight: 600;
font-size: 28rpx; font-size: 28rpx;
color: #333333; color: #333333;
margin-left: 5rpx; margin-left: 5rpx;
width: 222rpx; width: 222rpx;
} }
.item_content_warp { .item_content_warp {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.statusItem_modal_warp { .statusItem_modal_warp {
padding: 0 22rpx; padding: 0 22rpx;
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
position: relative; position: relative;
} }
.device_status_item { .device_status_item {
width: 100%; width: 100%;
height: 81rpx; height: 81rpx;
} }
.device_status_warp { .device_status_warp {
width: 710rpx; width: 710rpx;
background: #ffffff; background: #ffffff;
margin-top: 23rpx; margin-top: 23rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.modal_warp { .modal_warp {
padding: 0 16rpx; padding: 0 16rpx;
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.device_active { .device_active {
background-color: #ffffff !important; background-color: #ffffff !important;
} }
.select_device_item { .select_device_item {
width: 329rpx; width: 329rpx;
height: 56rpx; height: 56rpx;
background: #e2edff; background: #e2edff;
@ -762,46 +791,46 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.select_device_warp { .select_device_warp {
width: 710rpx; width: 710rpx;
height: 68rpx; height: 68rpx;
background: #e2edff; background: #e2edff;
border-radius: 60rpx; border-radius: 60rpx;
} }
.content_warp { .content_warp {
padding: 16rpx 20rpx 0 20rpx; padding: 16rpx 20rpx 0 20rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.content_area_warp { .content_area_warp {
width: 100%; width: 100%;
} }
</style> </style>
<style scoped> <style scoped>
.device_model { .device_model {
width: 33%; width: 33%;
} }
.img_video_warp { .img_video_warp {
width: 100%; width: 100%;
height: 281rpx; height: 321;
background: rgba(0, 0, 0, 0.3); background: rgba(0, 0, 0, 0.3);
border-radius: 20rpx; border-radius: 20rpx;
margin: 22rpx 0 32rpx 0; margin: 22rpx 0 32rpx 0;
} }
.back_button_icon { .back_button_icon {
transform: rotate(180deg); transform: rotate(180deg);
width: 28rpx; width: 28rpx;
height: 28rpx; height: 28rpx;
} }
.back_button_warp { .back_button_warp {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -810,9 +839,9 @@
display: flex; display: flex;
align-items: center; align-items: center;
padding-left: 20rpx; padding-left: 20rpx;
} }
.contai_warp { .contai_warp {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -821,20 +850,20 @@
min-height: 100vh; min-height: 100vh;
background-color: #f1f6fc; background-color: #f1f6fc;
overflow-x: hidden !important; overflow-x: hidden !important;
} }
.top_area_warp { .top_area_warp {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative; position: relative;
} }
.top_status_area { .top_status_area {
width: 100%; width: 100%;
} }
.top_nav_warp { .top_nav_warp {
width: 100%; width: 100%;
height: 88rpx; height: 88rpx;
display: flex; display: flex;
@ -847,5 +876,5 @@
position: relative; position: relative;
z-index: 5; z-index: 5;
position: relative; position: relative;
} }
</style> </style>

8
pages/mine/index.vue
View File

@ -51,13 +51,9 @@
<image class="area2_item_right" src="https://online.totustec.com/upload/minePage/mine_area_right.png"></image> <image class="area2_item_right" src="https://online.totustec.com/upload/minePage/mine_area_right.png"></image>
</view> --> </view> -->
<view class="function_area2_item" open-type="share" style=" <view class="function_area2_item" style="border-bottom-left-radius: 20rpx; border-bottom-right-radius: 20rpx;">
border-bottom-left-radius: 20rpx;
border-bottom-right-radius: 20rpx;
">
<view class="area2_item_left"> <view class="area2_item_left">
<image class="area2_item_icon1" src="https://online.totustec.com/upload/minePage/area2_item_icon2.png"> <image class="area2_item_icon1" src="https://online.totustec.com/upload/minePage/area2_item_icon2.png"></image>
</image>
<view class="area2_item_txt">分享小程序</view> <view class="area2_item_txt">分享小程序</view>
</view> </view>
<button open-type="share" class="area2_item_right_btn"> <button open-type="share" class="area2_item_right_btn">