chuangte/smartswrtch-app
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

11

Browse Source
This commit is contained in:
3321822538@qq.com 2024-09-02 18:03:58 +08:00
parent 3ba83c677e
commit eba1773286
2 changed files with 573 additions and 444 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

214
page_user/sbdetail.vue
View File

@ -10,14 +10,13 @@
设备
</view>
<view class="right">
<!-- <image class="img1" src="https://api.ccttiot.com/smartmeter/img/static/uGvS4RQvbw7OOfhzy6xf" mode="" style="margin-right: 30rpx;" @click="opendevices"></image>
<image class="img1" src="https://api.ccttiot.com/smartmeter/img/static/uNEKwe2WKsJdtQzOdEay" mode="" @click="toewm()"></image> -->
</view>
</view>
<view class="mid">
<view class="mid_left">
<view v-if="opflag" style="border: 0;outline: none;width: 143rpx;padding-left: 0rpx;height: 143rpx;border-radius: 16rpx;"
<view v-if="opflag"
style="border: 0;outline: none;width: 143rpx;padding-left: 0rpx;height: 143rpx;border-radius: 16rpx;"
@click="btnpic">
<image :src="imglist" mode="aspectFit"
style="width: 142rpx;height: 142rpx;border-radius: 20rpx;"></image>
@ -25,23 +24,28 @@
<image v-else :src="imglist" mode="aspectFit"
style="width: 142rpx;height: 142rpx;border-radius: 20rpx;"></image>
<ksp-cropper mode="free" :width="142" :height="142" :maxWidth="1024" :maxHeight="1024" :url="url"
@cancel="oncancel" @ok="onok"></ksp-cropper>
<ksp-cropper mode="free" :width="142" :height="142" :maxWidth="1024" :maxHeight="1024"
:url="url" @cancel="oncancel" @ok="onok"></ksp-cropper>
</view>
<view class="mid_right">
<view class="mid_top">
{{ deviceInfo.deviceName == null ? '' : deviceInfo.deviceName }}
<view class="" style="font-size: 26rpx;margin-top: 8rpx;">
更新时间：{{deviceInfo.lastPullTime == null ? '--' : deviceInfo.lastPullTime}}</view>
<text
style="font-size: 24rpx;color: #8883F0;display: inline-block;border: 1px solid #8883F0;padding: 5rpx;box-sizing: border-box;border-radius: 10rpx;">{{deviceInfo.model == undefined ? '' : deviceInfo.model}}</text>
</view>
<view class="mid_bot">
<view class="txt" v-if="deviceInfo">
S/N码：{{ deviceInfo.deviceNo == null ? '' : deviceInfo.deviceNo }}</view>
<div class="tip" v-if="deviceInfo.onlineStatus==1" style="color: seagreen;border: 2rpx solid;">在线</div>
<div class="tip" v-if="deviceInfo.onlineStatus==0" style="color: red;border: 2rpx solid;">离线</div>
<div class="tip" v-if="deviceInfo.status==1" style="color: seagreen;border: 2rpx solid;">空闲</div>
<div class="tip" v-if="deviceInfo.status==2" style="color: seagreen;border: 2rpx solid;">使用中</div>
<div class="tip" v-if="deviceInfo.onlineStatus==1"
style="color: seagreen;border: 2rpx solid;">在线</div>
<div class="tip" v-if="deviceInfo.onlineStatus==0" style="color: red;border: 2rpx solid;">离线
</div>
<div class="tip" v-if="deviceInfo.status==1" style="color: seagreen;border: 2rpx solid;">空闲
</div>
<div class="tip" v-if="deviceInfo.status==2" style="color: seagreen;border: 2rpx solid;">使用中
</div>
<div class="tip" v-if="deviceInfo.status==3" style="color: red;">维修中</div>
</view>
</view>
@ -102,7 +106,9 @@
</view>
<view class="cont" @click="topage(6)">
<view class="top">
<image style="width: 58rpx;height: 58rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uAnBmmayp3tVGwXntdaM" mode=""></image>
<image style="width: 58rpx;height: 58rpx;"
src="https://api.ccttiot.com/smartmeter/img/static/uAnBmmayp3tVGwXntdaM" mode="">
</image>
</view>
<view class="bot">充值</view>
</view>
@ -124,32 +130,41 @@
</view>
<view class="cont" @click="topage(5)">
<view class="top">
<image style="width: 58rpx;height: 58rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uik9veDG6pMVG5M1Vxze" mode="">
<image style="width: 58rpx;height: 58rpx;"
src="https://api.ccttiot.com/smartmeter/img/static/uik9veDG6pMVG5M1Vxze" mode="">
</image>
</view>
<view class="bot">配网</view>
</view>
<view class="cont" @click="topage(4)">
<view class="top">
<image style="width: 58rpx;height: 58rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u2Uco0iXf8aure0H2ihz" mode="">
<image style="width: 58rpx;height: 58rpx;"
src="https://api.ccttiot.com/smartmeter/img/static/u2Uco0iXf8aure0H2ihz" mode="">
</image>
</view>
<view class="bot">设置</view>
</view>
<view class="cont" @click="btnkq">
<view class="cont" @click="qrFun">
<view class="top">
<u-switch v-model="checked" active-color="#8883F0"></u-switch>
<image style="width: 58rpx;height: 58rpx;"
src="https://api.ccttiot.com/smartmeter/img/static/u7o1YnOGEKxM6KZ4WGXO" mode="">
</image>
</view>
<view class="bot" style="margin-top: 12rpx;">{{tdtxt}}</view>
<view class="bot">分享</view>
</view>
</view>
</view>
<view class="cont_box" style="padding-left: 30rpx;">
</view>
</view>
<view class="conts" @click="btnkq">
<view class="top">
<u-switch v-model="checked" active-color="#8883F0"></u-switch>
</view>
<view class="bot" >手动操作:{{tdtxt}}</view>
</view>
</view>
<view class="tanc" v-if="vipflag">
@ -162,8 +177,6 @@
</view>
</view>
<view class="maskss" v-if="vipflag"></view>
<!-- 蓝牙连接 -->
<view class="bluetoothbox" v-if="bluetoothflag">
<view class="stop">
@ -173,9 +186,6 @@
请将手机与设备尽量靠近
</view>
<image src="https://api.ccttiot.com/smartmeter/img/static/ucDphMKsozqwwllJTAKL" mode=""></image>
<!-- <view class="xqx" @click="bluetoothflag = false">
取消连接
</view> -->
</view>
<!-- 蓝牙连接失败 -->
@ -200,13 +210,28 @@
</view>
</view>
<view v-if="btnmsk" style="width: 100%;height: 100vh;position: fixed;top: 0;left: 0;background-color: #000;opacity: .1;z-index: 999;"></view>
<!-- 展示二维码 -->
<view class="imgewm" v-if="wemflag" @longpress="saveCanvas">
<canvas canvas-id="qrcode" style="height: 100%;margin: 0 auto;" />
<view class="" style="width: 100%;text-align: center;margin-top: 20rpx;">
SN:{{deviceNo}}
</view>
<view class="" style="border: 1px solid; padding: 20rpx;box-sizing: border-box;width: 100%;text-align: center;margin-top: 400rpx;" @click="wemflag = false">
关闭二维码
</view>
</view>
<view class="imgewmflag" v-if="wemflag" @click.stop="ewmyc"></view>
<view v-if="btnmsk"
style="width: 100%;height: 100vh;position: fixed;top: 0;left: 0;background-color: #000;opacity: .1;z-index: 999;">
</view>
</view>
</template>
<script>
var xBlufi = require("@/page_components/blufi/xBlufi.js")
import uQRCode from '@/common/uqrcode.js'
import uniEcCanvas from '@/components/uni-ec-canvas/uni-ec-canvas.vue'
import * as echarts from '@/components/uni-ec-canvas/echarts'
let chart = null
@ -216,6 +241,7 @@
},
data() {
return {
wemflag: false,
btnmsk: false,
bluetoothflag: false,
shibaiflag: false,
@ -230,12 +256,7 @@
info: '',
checked: false,
tittxt: "设备详情",
titlist: [
"全部",
"电表",
"水表",
],
titlist: [],
tdtxt: '开启',
curtitidx: 0,
id: '',
@ -257,6 +278,7 @@
opflag: true,
timer: null,
url: "",
deviceNo: ''
}
},
onLoad(option) {
@ -345,8 +367,57 @@
}, 100)
this.getQiniuToken()
},
mounted() {
this.drawCanvas()
},
methods: {
drawCanvas() {
const ctx = uni.createCanvasContext('qrcode', this);
ctx.setFillStyle('#fff');
ctx.fillRect(10, 10, 250, 250);
ctx.draw();
},
// 长按保存二维码
saveCanvas() {
uni.canvasToTempFilePath({
canvasId: 'qrcode',
success: (res) => {
console.log(res.tempFilePath); // 打印图片路径
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function() {
uni.showToast({
title: '保存成功',
icon: 'success'
});
}
});
},
fail: (err) => {
console.error(err);
}
});
},
//**生成二维码**//
qrFun: function() {
this.wemflag = true
uQRCode.make({
canvasId: 'qrcode',
// componentInstance: this,
text: 'https://kg.chuantewulian.cn/w?s=' + this.deviceNo,
size: 250,
margin: 0,
backgroundColor: '#ffffff',
foregroundColor: '#000000',
fileType: 'jpg',
errorCorrectLevel: uQRCode.errorCorrectLevel.H,
})
},
ewmyc() {
this.wemflag = false
},
btnlyqx() {
this.shibaiflag = false
this.bluetoothflag = false
@ -548,10 +619,10 @@
// 获取设备详情
getDevice(id) {
this.$u.get("/app/device/" + id).then((res) => {
// this.$forceUpdate()
if (res.code == 200) {
this.deviceInfo = res.data
this.storeId = res.data.storeId
this.deviceNo = res.data.deviceNo
// this.qrResult = 'CTKG-' + res.data.mac
this.qrResult = res.data.mac
if (res.data.customPicture != null) {
@ -638,7 +709,6 @@
}
// console.log(stause, 'stausestause');
this.$u.put(`/app/device/${this.deviceInfo.deviceId}/changePower?status=` + stause).then((res) => {
// this.$forceUpdate()
if (res.code == 200) {
// this.groupList=res.rows
setTimeout(() => {
@ -646,7 +716,6 @@
}, 2000)
// this.loadings=true
// this.initChart()
} else {
uni.showToast({
title: res.msg,
@ -672,7 +741,6 @@
})
},
// 其他部分 点击进行跳转
topage(num) {
this.btnmsk = true
@ -685,7 +753,7 @@
let that = this
uni.showModal({
title: '提示',
content: '您确定要将电表时间归零吗？',
content: '您确定要将设备时间归零吗？',
success: function(res) {
if (res.confirm) {
that.btnmsk = false
@ -866,12 +934,14 @@
if (systemInfo.platform == 'android') {
// 当前设备是 Android
uni.navigateTo({
url: '/page_components/wifilist/index?deviceId=' +this.deviceId + '&name=' +this.name
url: '/page_components/wifilist/index?deviceId=' + this.deviceId +
'&name=' + this.name
})
} else if (systemInfo.platform == 'ios') {
// 当前设备是 iOS
uni.navigateTo({
url: '/page_fenbao/device/wifivideo?deviceId=' +this.deviceId + '&name=' +this.name
url: '/page_fenbao/device/wifivideo?deviceId=' + this.deviceId +
'&name=' + this.name
})
}
} else {
@ -1025,6 +1095,7 @@
this.bluetoothflag = false
}, 3000)
console.log("蓝牙未开启", options)
this.shibaiflag = true
// uni.showToast({
// title: '蓝牙未开启',
// icon: 'none',
@ -1142,7 +1213,6 @@
</script>
<style lang="scss">
/deep/ .panel {
position: fixed;
width: 100%;
@ -1154,6 +1224,49 @@
overflow: hidden;
}
.imgewmflag {
width: 750rpx;
height: 100vh;
background: #fff;
border-radius: 0rpx 0rpx 0rpx 0rpx;
z-index: 1;
position: fixed;
top: 0;
left: 0;
}
.imgewm {
width: 250px;
height: 250px;
position: fixed;
top: 20%;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.conts {
display: flex;
justify-content: space-between;
margin-top: 50rpx;
align-items: center;
width: 100%;
height: 100%;
padding: 20rpx;
border-radius: 30rpx;
box-sizing: border-box;
background-color: #fff;
.bot {
// width: 100%;
// height: 80rpx;
// line-height: 80rpx;
// text-align: center;
// border-radius: 30rpx;
// background-color: #fff;
// margin-top: 30rpx;
font-size: 30rpx;
}
}
.bluetoothbox {
width: 100%;
@ -1164,31 +1277,37 @@
left: 0;
z-index: 99;
text-align: center;
.img {
margin-top: 400rpx;
width: 320rpx;
height: 320rpx;
}
.one {
font-size: 36rpx;
color: #000;
}
.two {
margin-top: 30rpx;
font-size: 24rpx;
color: #ccc;
}
.thr {
margin-top: 30rpx;
font-size: 28rpx;
color: #ccc;
}
.anfour {
display: flex;
margin-top: 30rpx;
justify-content: space-between;
padding: 0 220rpx;
box-sizing: border-box;
.qx {
width: 100rpx;
height: 70rpx;
@ -1197,6 +1316,7 @@
border: 1px solid #3D3D3D;
border-radius: 10rpx;
}
.cx {
width: 200rpx;
height: 70rpx;
@ -1207,16 +1327,19 @@
border-radius: 10rpx;
}
}
.stop {
font-size: 36rpx;
color: #000;
margin-top: 380rpx;
}
.xtop {
margin-top: 30rpx;
font-size: 24rpx;
color: #ccc;
}
.xqx {
width: 530rpx;
height: 90rpx;
@ -1227,12 +1350,14 @@
margin: auto;
margin-top: 200rpx;
}
image {
width: 500rpx;
height: 500rpx;
margin-top: 100rpx;
}
}
/deep/ .u-title {
padding-bottom: 22rpx;
}
@ -1244,6 +1369,7 @@
page {
background-color: #F7FAFE;
}
.maskss {
width: 750rpx;
height: 100vh;
@ -1255,6 +1381,7 @@
top: 0;
left: 0;
}
.tanc {
width: 610rpx;
height: 282rpx;
@ -1320,7 +1447,7 @@
.card1 {
padding: 34rpx 0 0 40rpx;
width: 670rpx;
height: 300rpx;
height: 320rpx;
background: #FFFFFF;
box-shadow: 0rpx 14rpx 35rpx 0rpx rgba(53, 140, 255, 0.1);
border-radius: 28rpx 28rpx 28rpx 28rpx;
@ -1363,7 +1490,7 @@
}
.mid_right {
margin-left: 40rpx;
margin-left: 20rpx;
display: flex;
flex-wrap: wrap;
@ -1379,6 +1506,7 @@
display: flex;
flex-wrap: nowrap;
align-items: center;
margin-top: 6rpx;
.txt {
font-size: 26rpx;
@ -1457,6 +1585,7 @@
}
}
}
.bot_right {
display: flex;
width: 100%;
@ -1465,6 +1594,7 @@
padding-right: 80rpx;
box-sizing: border-box;
margin-top: 30rpx;
.cont {
.tit {
font-size: 28rpx;

1
page_user/yetx.vue
View File

@ -93,7 +93,6 @@
sjmeoey:'',
txlist:'',
channelId:'',
listflag:true
}
},