添加mqtt通讯

guifei zhu

2024-09-18 ba616e9307681da4781b7610ec3c27721d793379

添加mqtt通讯

 App.vue

@@ -32,13 +32,41 @@
            console.log('App Launch')

        },

        onShow: function() {

            //console.log('App Show')

             console.log('App Show')
             // this.conn()
			 


        },

        onHide: function() {

            //console.log('App Hide')

             console.log('App Hide')
             // this.disconn()

        },
        methods:{
            //处理掉线重连
            conn(){
                console.log(this.$mqttTool.client)
                if(this.$mqttTool.client){
                    console.log(this.$mqttTool.client.connected)
                }
                if(this.$mqttTool.client && !this.$mqttTool.client.connected){
                    console.info("开始重连")
                    this.$mqttTool.reconnect()
                }else {
					
                }
            },
            disconn(){
                console.log(this.$mqttTool.client)
                if(this.$mqttTool.client){
                    console.log(this.$mqttTool.client.connected)
                }
                // if(this.$mqttTool.client){
                //     this.$mqttTool.end().then(res =>{
                //         console.log('终止：')
                //     })
				
                // }
            }
            
        },

        mounted() {


 common/api.js

@@ -2,12 +2,14 @@
    fly

} from '@/common/request/fly.js'

//配置请求基地址

fly.config.baseURL = "http://192.168.2.6:8800/herb"

fly.config.baseURL = "http://192.168.12.20:9999"

const url = uni.getStorageSync('baseurl');

if (url) {

    fly.config.baseURL = url + "/herb"

}



}

const mqttBaseUrl = "223.241.221.20"; 
const emqxBaseUrl = "http://"+mqttBaseUrl +":18083/api/v5"



// æµ‹è¯•

function test(params) {

@@ -35,8 +37,12 @@
function getOrderList(params) {

    fly.config.loading = true

    return fly.get('/dry/dryOrder/list', params);

}
//设备列表
function queryEquList(params){
    fly.config.loading = true
    return fly.get('/mobile/equ/list', params);
}





//

function getMonth(params) {

@@ -47,8 +53,22 @@
function sendCommand(params) {

    fly.config.loading = true

    return fly.post('/dry/real/sendCommand', params);

}


//emqx æŽ¥å£
function emqxClients() {

    fly.config.loading = true

    return fly.get(emqxBaseUrl + "/clients", {
        auth: {
          username: "a3dc6758f6abc41a",
          password: "FvBwJcmqhAuQ0aBg4FLl5gQA9A9BE64bpl0oJTg9A6I0bK"
        },
        headers: {
      'Content-Type': 'application/json',
    },
    });

}









@@ -57,7 +77,11 @@
    login,

    getRealTimeData,

    getAnalyList,

    getOrderList,

    getOrderList,
    queryEquList,

    getMonth,

    sendCommand

    sendCommand,
	
    emqxClients,
    mqttBaseUrl

}

 common/constant.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,35 @@
//上行指令前缀

const MOBILE_UP = "mobile/up"

//请求查询设备状态

const MOBILE_QUERY_EQU_STATU = MOBILE_UP + "/query/equ/statu"

//发送操作指令
const MOBILE_REQ_EQU_CMD = MOBILE_UP + "/req/equ/cmd"



//解析时equ替换成真实设备唯一标识

//下行指令前缀

const SERVICE_DOWN = "service/down/res"
//请求查询设备状态

const SERVICE_RES_EQU_STATU = SERVICE_DOWN + "/equ/statu"
//接收指令响应
const SERVICE_RES_EQU_CMD = SERVICE_DOWN + "/equ/cmd";







/***********************缓存相关********************************/


//设备id(uni.getSystemInfo)

const DEVICE_ID = "device_id"





export default {

    MOBILE_QUERY_EQU_STATU,
    SERVICE_RES_EQU_STATU,
    SERVICE_DOWN,
    MOBILE_REQ_EQU_CMD,
    SERVICE_RES_EQU_CMD,







    DEVICE_ID

}

 common/request/fly.js

@@ -4,7 +4,7 @@


fly.config.loading = true;

//实例级配置

//fly.config.timeout=6000;

fly.config.timeout=10000;

//添加拦截器

fly.interceptors.request.use((config, promise) => {

    console.info(fly.config.loading)


 lib/mqttTool.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,141 @@
/* main.js é¡¹ç›®ä¸»å…¥å£æ³¨å…¥å®žä¾‹ */
// import mqttTool from './lib/mqttTool.js'
// Vue.prototype.$mqttTool = mqttTool

/* ä½¿ç”¨èŒƒä¾‹è§ /pages/index/index.vue */
// mqtt协议：H5使用ws/wss APP-PLUS使用wx/wxs

var mqtt = require('mqtt/dist/mqtt.js')

//客户端
let mqttTool = {
    client: null
}

//连接息
mqttTool.connect = function(params){
    let options = {
        clientId: params.clientId,
        username: params.username,
        password: params.password,
        clean: true,
        keepalive:10,  //心跳 å•ä½ï¼šs
        connectTimeout: 10*1000, //连接超时 å•ä½ï¼šms
        cleanSession: true
    }
    let client = mqtt.connect(params.url, options);
    mqttTool.client = client
    return client;
}

mqttTool.end = function(){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":end æœªè¿žæŽ¥")
            return;
        }
        mqttTool.client.end()
        mqttTool.client = null
        resolve('连接终止')
    })
}

mqttTool.reconnect = function(){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":reconnect æœªè¿žæŽ¥")
            return;
        }
        mqttTool.client.reconnect()
    })
}

mqttTool.subscribe = function(params){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":unconnect æœªè¿žæŽ¥")
            return;
        }
        mqttTool.client.subscribe(params.topic, {qos:params.qos}, function(err,res) {
            console.log(err,res)
            if (!err && res.length>0) {
                resolve('订阅成功')
                console.log('App_text' + ":subscribe success è®¢é˜…成功")
            }else{
                resolve('订阅失败')
                console.log('App_text' + ":subscribe failed è®¢é˜…失败")
                return;
            } 
        })  
    })
}

mqttTool.unsubscribe = function(params){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":unconnect æœªè¿žæŽ¥")
            return;
        }
        mqttTool.client.unsubscribe(params.topic, function(err) {
            if (!err) {
                resolve('取消订阅成功')
                console.log('App_text' + ":unsubscribe success å–消订阅成功")
            }else{
                resolve('取消订阅失败')
                console.log('App_text' + ":unsubscribe failed å–消订阅失败")
                return;
            } 
        })  
    })
}

mqttTool.publish = function(params){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":unconnect æœªè¿žæŽ¥")
            return;
        }
        mqttTool.client.publish(params.topic, params.message, function(err){
            if (!err) {
                resolve(params.topic + '-' + params.message + '-发送成功')
                console.log('App_text' + ":publish success å‘送成功")
            }else{
                resolve(params.topic + '-' + params.message + '-发送失败')
                console.log('App_text' + ":publish failed å‘送失败")
                return;
            } 
        })
    })
}

//消息处理
mqttTool.message = function(){
    return new Promise((resolve, reject) => {
        if(mqttTool.client == null){
            resolve('未连接')
            console.log('App_text' + ":unconnect æœªè¿žæŽ¥")
            return;
        }
        if(mqttTool.client != null && ! mqttTool.client.connected){
            mqttTool.client.reconnect()
        }
		 
        mqttTool.client.on('message', function(topic, message, buffer) {
            console.info(topic)
            console.info(message)
             setTimeout(() => {
                  resolve({topic, message, buffer })
                }, 300)
        })
	 
    })
}



export default mqttTool

 main.js

@@ -16,6 +16,11 @@
    // å…¨å±€æŒ‚载后使用
Vue.prototype.$api = api

import constant from '@/common/constant.js'
    // å…¨å±€æŒ‚载后使用
Vue.prototype.$constant = constant


import lget from '@/common/loadshget.js'
    // å…¨å±€æŒ‚载后使用
Vue.prototype.$lget = lget

 pages/device/control.vue

@@ -37,10 +37,17 @@
                            </view>

                            <view class="h-tr h-tr-2">

                                <view class="h-td">

                                    <u-tag size="mini" text="在线" type="success" plain plainFill></u-tag>

                                    <u-tag v-if="connected" size="mini" text="在线" type="success" plain

                                        plainFill></u-tag>

                                    <u-tag v-else size="mini" text="离线" type="error" plain plainFill></u-tag>

                                </view>

                                <view class="h-td">

                                    <u-tag size="mini" text="正在干燥" type="success" plain plainFill></u-tag>

                                    <template v-if="runStatu">

                                        <u-tag size="mini" text="正在干燥" type="success" plain plainFill></u-tag>

                                    </template>

                                    <template v-else>

                                        <u-tag size="mini" text="待机" type="error" plain plainFill></u-tag>

                                    </template>

                                </view>

                                <view class="h-td">{{$lget(model,'windTemp')}}</view>

                                <view class="h-td">{{$lget(model,'windTemp')}}</view>

@@ -74,7 +81,7 @@


                            </view>

                            <view class="h-tr h-tr-2">

                                <view class="h-td">生地黄</view>

                                <view class="h-td">{{$lget(model,'herbName')}}</view>

                                <view class="h-td">{{$lget(model,'envTemp') == "" ? "--" :  $lget(model,'envTemp')}}m³

                                </view>

                                <view class="h-td">{{$lget(model,'envHum') == "" ? "--" :$lget(model,'envHum') }}kg

@@ -136,11 +143,12 @@
                <uni-section title="指令" type="line">

                    <view class="flex justify-center padding-lg bg-white">

                        <view class="margin-right-sm">

                            <u-button text="开机" type="success" @click="$u.throttle(showModal(), 500)"></u-button>

                            <u-button :disabled="connected" text="开机" type="success"

                                @click="$u.throttle(showModal(1), 500)"></u-button>

                        </view>



                        <view class="margin-left-sm">

                            <u-button text="关机" type="error" :disabled="true"></u-button>

                            <u-button :disabled="!connected" text="关机" type="error"

                                @click="$u.throttle(showModal(2), 500)"></u-button>

                        </view>





@@ -150,8 +158,8 @@


                <uni-section title="控制台" type="line" class="margin-top-sm ">

                    <view class="padding-left-sm padding-right-sm padding-bottom-sm">

                        <view class="text-sm text-gray">12:00:20: <开机>指令操作成功</view>

                        <view class="text-sm text-gray  margin-top-sm">12:00:10: å‘送<开机>指令</view>

                        <view class="text-sm text-gray" :class="{'margin-top-sm':index>0}"  v-for="(log,index) in logList">{{log}}</view>

                        <!-- <view class="text-sm text-gray  margin-top-sm">12:00:10: å‘送<开机>指令</view> -->

                    </view>



                </uni-section>

@@ -162,15 +170,15 @@
        </swiper>











        <u-modal :show="show" title="验证二级密码" @confirm="confirm" :showCancelButton="true" @cancel="show=false"

            ref="uModal" :asyncClose="true">

        <u-modal :show="show" @confirm="confirm" :showCancelButton="true" @cancel="show=false" ref="uModal"

            :asyncClose="true">



            <slot>

                <view>

                    <u--input style="width: 100%;" placeholder="请输入二级密码" border="surround" password

                <view style="width: 100%;height:100%;">

                    <view style="color:red">

                        è¿œç¨‹æŽ§åˆ¶æ“ä½œå¯èƒ½å­˜åœ¨å®‰å…¨é£Žé™©ï¼Œè¯·è°¨æ…Žæ“ä½œ

                    </view>

                    <u--input style="width: 100%;" placeholder="请输入二级安全密码" border="surround" password

                        clearable></u--input>

                </view>

            </slot>

@@ -187,6 +195,14 @@
    export default {

        data() {

            return {

                //上个页面传递过来的数据

                option: {},

                //操作指令log

                logList: [],

                //当前设备连接状态

                connected: false,

                //开关机指令 1-开机 2-关机

                cmd: -1,

                show: false,

                swiperList: ["监测", "控制"],

                swiperCurrent: 0,

@@ -221,8 +237,8 @@
                notice: "2023-03-1812:00:001号机台低温报警",

                model: {},

                queryParam: {

                    machineid: "GM001",

                    tenantid: 1003

                    machineid: "",

                    tenantid: null

                },

                bannerList: [{

                    imageUrl: '../../static/image/zcy_gzj1.png'

@@ -232,11 +248,21 @@
            }

        },

        onShow() {

            console.info("onShow")

            this.startTimer()



        },



        onLoad(e) {

        onLoad(option) {

            const userinfo = uni.getStorageSync('userinfo');

            this.option = option

            this.option.tenantid = userinfo.loginTenantId

            this.option.username = userinfo.username





            //初始化查询参数

            this.queryParam.machineid = option.code

            this.queryParam.tenantid = userinfo.loginTenantId



        },

        onBackPress() {

@@ -254,31 +280,131 @@
        },

        onReady() {

            //this.getServerData()

            // this.$mqttTool.message().then(res => {

            //     console.error("解析数据")

            //     if (res.topic == this.$constant.SERVICE_RES_EQU_STATU) {

            //         const msgstr = res.message.toString();

            //         const message = JSON.parse(msgstr);

            //         console.error(message)

            //         console.error(message.success)

            //     }

            // })

            let _this = this

            this.$mqttTool.client.on('message', function(topic, message, buffer) {



                console.error("解析数据")

                const msg = JSON.parse(message);

                console.error(topic)

                console.error(msg)

                console.error(msg.success)

                if (topic == _this.$constant.SERVICE_RES_EQU_STATU.replace('equ', _this.deviceId)) {

                    if (msg.success) {

                        _this.connected = msg.connected

                    } else {

                        _this.connected = false

                    }

                } else if (topic == _this.$constant.SERVICE_RES_EQU_CMD.replace('equ', _this.deviceId)) {
                    //发送指令收到响应
                    //添加log
                    let log = this.getCurrentTime() +'返回：' +  + '指令' ;
                    this.logList.push(log)
					
                    setTimeout(() => {

                        // 3秒后自动关闭

                        uni.showToast({

                            title: msg.msg,

                            icon: 'none',

                            mask: true

                        });

                        _this.show = false;

                    }, 1000)

                }

            })



            this.queryEquStatu()



        },

        methods: {

            showModal() {

            //MQTT

            queryEquStatu() {



                //1.查询设备实时状态

                const message = {

                    clientId: this.option.clientId,

                    timestamp: new Date(),

                    req: this.deviceId

                }

                let opts = {

                    topic: this.$constant.MOBILE_QUERY_EQU_STATU,

                    message: JSON.stringify(message),

                }



                this.$mqttTool.publish(opts).then(res => {

                    console.error(res)

                })



            },



            sendEquCmd() {

                //添加log

                let log = this.getCurrentTime() +'发送' + (this.cmd == 1 ? "：《开机》" : "：《关机》") + '指令' ;

                this.logList.push(log)

		 
                //1.发送开关机指令 1-开机  2-关机

                const message = {

                    clientId: this.option.clientId,

                    cmd: this.cmd,

                    timestamp: new Date(),

                    req: this.deviceId

                }

                let opts = {

                    topic: this.$constant.MOBILE_REQ_EQU_CMD,

                    message: JSON.stringify(message),

                }



                this.$mqttTool.publish(opts).then(res => {

                    console.error(res)

                })



            },



            showModal(cmd) {

                this.show = true;

                this.cmd = cmd;

            },

            confirm() {

                setTimeout(() => {

                    // 3秒后自动关闭
                    uni.showToast({
                        title: '操作成功~',
                        icon: 'none',
                        mask: true
                    });

                    this.show = false;

                }, 3000)

                this.sendEquCmd()

                // setTimeout(() => {

                //     // 3秒后自动关闭

                //     uni.showToast({

                //         title: '操作成功~',

                //         icon: 'none',

                //         mask: true

                //     });

                //     this.show = false;

                // }, 3000)









            },

            startTimer() {

                console.info("监控页面显示")

                this.getRealData()

                //不间断查询待操作干燥机的状态，实时更新

                //this.queryEquStatu()

                if (!this.$monitorTimer) {

                    this.$monitorTimer = setInterval(() => {

                        console.info("定时器工作")

                        console.info(this.$monitorTimer)

                        this.getRealData()



                        /**

                         * TODO ä½¿ç”¨last_will代替轮询

                         */

                        //不间断查询待操作干燥机的状态，实时更新   
                        //this.queryEquStatu()



                    }, 1000 * 12)

                }



@@ -303,6 +429,20 @@
                this.swiperCurrent = e.detail.current;

                console.log(e.detail.current)

                this.$refs.tabs.unlockDx();

            },

            getCurrentTime() {

                // èŽ·å–当前时间  
                let now = new Date();

                // æ ¼å¼åŒ–时间  
                let year = now.getFullYear();

                let month = (now.getMonth() + 1).toString().padStart(2, '0');

                let day = now.getDate().toString().padStart(2, '0');

                let hours = now.getHours().toString().padStart(2, '0');

                let minutes = now.getMinutes().toString().padStart(2, '0');

                let seconds = now.getSeconds().toString().padStart(2, '0');



                // è¿”回结果  
                return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;

            },

            getServerData() {

                //模拟从服务器获取数据时的延时

@@ -452,6 +592,9 @@
            }

        },

        computed: {

            deviceId() {

                return uni.getStorageSync(this.$constant.DEVICE_ID);

            },

            //运行状态

            runStatu() {

                let stop = this.$lget(this.model, 'stop');


 pages/login/login.vue

@@ -34,8 +34,8 @@
        data() {

            return {

                model: {

                    username: "",

                    password: ""

                    username: "tongjitang",

                    password: "123456"

                },

                rules: {

                    'username': {

@@ -51,7 +51,7 @@
                        trigger: ['blur', 'change']

                    },

                },



				 
            };

        },

        onLoad() {

@@ -62,14 +62,14 @@


        },



        methods: {

        methods: {
		 
            forget() {

                uni.navigateTo({

                    url: "/pages/tabBar/demo"

                })

            },

            submit() {



            submit() {
                if (this.model.username.startsWith("http")) {

                    uni.setStorageSync('baseurl', this.model.username);

                    this.model.username = null

@@ -86,7 +86,8 @@
            },

            login() {

                this.$api.login(this.model).then((res) => {

                    if (res.success) {

                    if (res.success) {
						 


                        console.log('request success', res)

                        uni.showToast({

@@ -97,7 +98,8 @@


                        uni.setStorageSync('account', this.model);

                        uni.setStorageSync('userinfo', res.result.userInfo);

                        uni.setStorageSync('token', res.result.token);

                        uni.setStorageSync('token', res.result.token);
				 


                        uni.switchTab({

                            url: '/pages/tabBar/general'


 pages/tabBar/device.vue

@@ -12,13 +12,14 @@


                <view class="card-box dynamic shadow">

                    <view class="title-box margin-bottom-sm">

                        <view  style="width: 100vw;" class="left justify-between">

                        <view style="width: 100vw;" class="left justify-between">

                            <view class="flex align-center">

                                <uni-text class="cuIcon-titles text-blue"></uni-text>

                                <view class="title">总览</view>

                            </view>

                            <view>

                                <text class="text-gray margin-right-lg">2024-07-14</text>

                                <text

                                    class="text-gray margin-right-lg">{{new Date().toLocaleDateString().replace(/\//g, '-')}}</text>

                            </view>



                        </view>

@@ -28,20 +29,20 @@
                        <view class="flex">

                            <view class="flex-sub flex flex-direction text-center">

                                <text class="text-df">设备总数</text>

                                <text class="text-bold text-sl margin-top-xs  text-gray margin-top-sm">20

                                <text class="text-bold text-sl margin-top-xs  text-gray margin-top-sm">{{equCount}}

                                    <text class="text-gray text-sm margin-left-xs">台</text></text>

                            </view>
							
                            <view class="flex-sub flex flex-direction text-center">
                                <text class="text-df">开机设备</text>
                                <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">10
                                    <text class="text-gray text-sm margin-left-xs">台</text></text>
                            </view>
							
                            <view class="flex-sub flex flex-direction text-center">
                                <text class="text-df">运行设备</text>
                                <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">10
                                    <text class="text-gray text-sm margin-left-xs">台</text></text>
                            </view>



                            <view class="flex-sub flex flex-direction text-center">

                                <text class="text-df">开机设备</text>

                                <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">{{onlineCount}}

                                    <text class="text-gray text-sm margin-left-xs">台</text></text>

                            </view>



                            <view class="flex-sub flex flex-direction text-center">

                                <text class="text-df">运行设备</text>

                                <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">{{onlineCount}}

                                    <text class="text-gray text-sm margin-left-xs">台</text></text>

                            </view>

                        </view>

                        <view class="margin-top">

@@ -58,62 +59,64 @@




            </template>

			
			 
			
            <u-skeleton
                    class=" "
                    rows="20"
                    :loading="loading"
                    :title="false"
                >
            <!-- å¦‚果希望其他view跟着页面滚动，可以放在z-paging标签内 -->

            <view class="card-box dynamic shadow" v-for="(item,index) in dataList" :key="index"

                @click="itemClick(item)">

                <view class="title-box">

                    <view class="left flex-sub">

                        <uni-text class="cuIcon-titles text-blue"></uni-text>

                        <view class="title text-cut">1#智能干燥机</view>

                        <view class="flex title text-green text-sm">

                            <u-tag size="mini" text="在线" type="success" plain plainFill></u-tag>
                            <u-tag class="margin-left-xs" size="mini" text="停机" type="error" plain plainFill></u-tag>







            <u-skeleton class=" " rows="20" :loading="loading" :title="false">

                <!-- å¦‚果希望其他view跟着页面滚动，可以放在z-paging标签内 -->

                <view class="card-box dynamic shadow" v-for="(item,index) in dataList" :key="index"

                    @click="itemClick(item)">

                    <view class="title-box">

                        <view class="left flex-sub">

                            <uni-text class="cuIcon-titles text-blue"></uni-text>

                            <view class="title text-cut">{{$lget(item,'name')}}</view>

                            <view class="flex title text-green text-sm">

                                <u-tag v-if="item.online" size="mini" text="在线" type="success" plain plainFill></u-tag>

                                <u-tag v-else class="" size="mini" text="停机" type="error" plain plainFill></u-tag>

                            </view>

                        </view>

                    </view>

                    <view class="right" style="min-width: 240rpx;">

                        <!-- <u-badge :isDot="true" type="success"></u-badge> -->

                        <view class="title text-gray text-sm">开机时间:</view>

                        <view class="title text-gray text-sm">10:00:10</view>

                    </view>

                </view>



                <view class="info-box">

                    <view class="left flex-sub">

                        <view class="title text-sm">烘干药材:</view>

                        <view class="title text-sm">生地黄</view>

                    </view>

                    <view class="right" style="min-width: 240rpx;">

                        <view class="title text-sm">烘干时间:</view>

                        <view class="title text-sm">01:20:00</view>

                    </view>

                </view>



                <view class="info-box">

                    <view class="left flex-sub">

                        <view class="title text-sm text-cut">报警信息:</view>

                        <view class="flex  title text-sm">

                            <u-tag size="mini" text="温度传感器报警" type="warning" plain plainFill></u-tag>

                            <u-tag size="mini" class="margin-left-xs" text="前门未关" type="warning" plain

                                plainFill></u-tag>

                            <u-tag size="mini" class="margin-left-xs" text="风箱低位报警" type="error" plain

                                plainFill></u-tag>

                        <view class="right" style="min-width: 240rpx;">

                            <!-- <u-badge :isDot="true" type="success"></u-badge> -->

                            <!-- <view class="title text-gray text-sm">开机时间:</view> -->

                            <view class="title text-gray text-sm">{{$lget(item,'upTime')}}</view>

                        </view>

                    </view>



                    <view class="info-box">

                        <view class="left flex-sub">

                            <view class="title text-sm">烘干药材:</view>

                            <view class="title text-sm text-gray">--</view>

                        </view>

                        <view class="right" style="min-width: 240rpx;">

                            <view class="title text-sm">烘干时间:</view>

                            <view class="title text-sm text-gray">--</view>

                        </view>

                    </view>



                    <view class="info-box">

                        <view class="left flex-sub">

                            <view class="title text-sm text-cut">报警信息:</view>

                            <view class="flex  title text-sm">

                                <template v-if="item.online && !item.fault">

                                    <u-tag size="mini" text="正常" type="success" plain plainFill></u-tag>

                                </template>

                                <template v-else-if="item.fault">

                                    <u-tag size="mini" text="温度传感器报警" type="warning" plain plainFill></u-tag>

                                    <u-tag size="mini" class="margin-left-xs" text="前门未关" type="warning" plain

                                        plainFill></u-tag>

                                    <u-tag size="mini" class="margin-left-xs" text="风箱低位报警" type="error" plain

                                        plainFill></u-tag>

                                </template>

                                <template v-else>

                                </template>

                            </view>

                        </view>



                    </view>



                </view>



            </view>



           </u-skeleton>
            </u-skeleton>

        </z-paging>

    </view>

</template>

@@ -121,46 +124,53 @@
<script>

    export default {

        data() {

            return {
                loading:true,

            return {

                loading: true,

                // v-model绑定的这个变量不要在分页请求结束中自己赋值！！！

                dataList: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],

                dataList: [],

            }

        },

        methods: {

            queryList(pageNo, pageSize) {
            queryList(pageNo, pageSize) {

                this.loading = true;

                // ç»„件加载时会自动触发此方法，因此默认页面加载时会自动触发，无需手动调用

                // è¿™é‡Œçš„pageNo和pageSize会自动计算好，直接传给服务器即可

                // æ¨¡æ‹Ÿè¯·æ±‚服务器获取分页数据，请替换成自己的网络请求

                // const params = {

                //     pageNo: pageNo,

                //     pageSize: pageSize,

                // }

                // this.$request.queryList(params).then(res => {

                //     // å°†è¯·æ±‚的结果数组传递给z-paging

                this.$refs.paging.complete(this.dataList);

                // }).catch(res => {

                //     // å¦‚果请求失败写this.$refs.paging.complete(false);

                //     // æ³¨æ„ï¼Œæ¯æ¬¡éƒ½éœ€è¦åœ¨catch中写这句话很麻烦，z-paging提供了方案可以全局统一处理

                //     // åœ¨åº•å±‚的网络请求抛出异常时，写uni.$emit('z-paging-error-emit');即可

                //     this.$refs.paging.complete(false);

                // })
                setTimeout(() => {
                    this.loading = false
                }, 1000)

            },
            itemClick(item){
                uni.navigateTo({
                    url:"/pages/device/control"
                })
                const params = {

                    pageNo: pageNo,

                    pageSize: pageSize,

                }

                this.$api.queryEquList(params).then((res) => {

                    //     // å°†è¯·æ±‚的结果数组传递给z-paging

                    this.$refs.paging.complete(res.result.records);

                    this.loading = false

                }).catch(res => {

                    // å¦‚果请求失败写this.$refs.paging.complete(false);

                    // æ³¨æ„ï¼Œæ¯æ¬¡éƒ½éœ€è¦åœ¨catch中写这句话很麻烦，z-paging提供了方案可以全局统一处理

                    // åœ¨åº•å±‚的网络请求抛出异常时，写uni.$emit('z-paging-error-emit');即可

                    this.$refs.paging.complete(false);

                    this.loading = false

                })



            },

            itemClick(item) {

                uni.navigateTo({

                    url: "/pages/device/control?code="+item.code+"&clientId="+item.clientId

                })

            }



        },onReady() {
			
            setTimeout(() => {
                this.loading = false
            }, 1000)
        },

        onReady() {



        },

        computed: {

            equCount() {

                return this.dataList.length

            },

            onlineCount() {

                const list = this.dataList.filter(item => item.online)

                return list.length

            }

        }

    }

</script>


 pages/tabBar/general.vue

@@ -177,7 +177,8 @@
                    <view class="flex">

                        <text>中草药</text>

                        <text>丨</text>

                        <text @click="showLongName(showValue(item.herbName))" class="text-cut flex-twice">{{showValue(item.herbName)}}</text>

                        <text @click="showLongName(showValue(item.herbName))"

                            class="text-cut flex-twice">{{showValue(item.herbName)}}</text>

                        <!-- <view class="margin-lr-sm">

                            <u-tag text="报警一次" plain size="mini" type="warning"></u-tag>

                        </view> -->

@@ -356,21 +357,98 @@


        },

        onReady() {

            const userinfo = uni.getStorageSync('userinfo');

            const tenantid = userinfo.loginTenantId

            uni.getSystemInfo({

                success: (res) => {

                    let deviceId = res.deviceId

                    if (!deviceId) {

                        deviceId = 'mobile-' + tenantid + '-' + Date.parse(new Date())

                    }

                    uni.setStorageSync(this.$constant.DEVICE_ID, 'mobile-' + tenantid + '-' + res.deviceId);

                }

            })

            this.startConnect();







            let month = uni.$u.timeFormat(new Date(), 'yyyy-mm')

            this.getMonth(month)



            let day = uni.$u.timeFormat(new Date(), 'yyyy-mm-dd')

            this.getOrderList(day, day);
		 
            this.getOrderList(day, day);





        },

        methods: {
            showLongName(longName){
                    this.$refs.uToast.show({
                        type: 'default',
                        message: longName
                    })
				
        methods: {

            /* è¿žæŽ¥MQTT */

            async startConnect() {

                var _this = this

                const account = uni.getStorageSync('account');

                const deviceid = uni.getStorageSync(this.$constant.DEVICE_ID);



                if (!account) {



                    return false

                }

                let opts = {

                    // #ifdef H5

                    url: 'ws://' + this.$api.mqttBaseUrl + ':8083/mqtt',

                    // #endif

                    // #ifdef APP-PLUS

                    url: 'wx://' + this.$api.mqttBaseUrl + ':8083/mqtt',

                    // #endif

                    clientId: deviceid,

                    username: account.username,

                    password: account.password

                }

                if (!this.$mqttTool.client) {

                    var client = await this.$mqttTool.connect(opts);

                }

                //订阅查询设备状态返回数据

                this.$mqttTool.subscribe({

                    topic: this.$constant.SERVICE_DOWN + '/' + deviceid + '/#',

                    qos: 0

                }).then(res => {

                    console.error(res)

                })

                //订阅发送指令返回结果

                // this.$mqttTool.subscribe({

                //     topic: this.$constant.SERVICE_RES_EQU_CMD,

                //     qos: 0

                // }).then(res => {

                //     console.error(res)

                // })

                // if (!client) {

                //     return false

                // }



                client.on('connect', function(res) {

                    console.error('连接成功')

                })

                client.on('reconnect', function(res) {

                    console.error('重新连接')

                })

                client.on('error', function(res) {

                    console.info('连接错误')

                })

                client.on('close', function(res) {



                    console.error('关闭成功')



                })

                client.on('message', function(topic, message, buffer) {

                    //console.info(message)

                })

            },





            showLongName(longName) {

                this.$refs.uToast.show({

                    type: 'default',

                    message: longName

                })



            },

            dayChange(dayInfo) { // ç‚¹å‡»æ—¥æœŸ

                this.model.date = dayInfo.date


 static/splash.png

Binary files differ