物联网之ESP32与微信小程序实现指示灯、转向灯


ESP32

代码

cpp 复制代码
#include <WiFi.h>
#include <WebServer.h>
#include <ArduinoJson.h>

const char* ssid = "jifu";
const char* pass = "2022xinchan!@#";
const int dateTime = 500;
const int ledPin4 = 4;
const int ledPin5 = 5;
bool isLTS = false;
bool isRTS = false;
bool isDFL = false;

WebServer server(8068);

// 封装响应函数
void sendResponse(int code, const char* status, const char* message, const String& originId, const String& newId) {
  StaticJsonDocument<200> doc;
  doc["code"] = code;
  doc["status"] = status;
  doc["message"] = message;

  JsonObject responseObj = doc.createNestedObject("response");
  responseObj["originId"] = originId;
  responseObj["newId"] = newId;

  String res;
  serializeJson(doc, res);
  server.send(code, "application/json", res);
}

// 封装指示灯错误响应
void fnIndicatorLightSendResponseError(const String& originId, const String& newId) {
  isLTS = false;
  isRTS = false;
  isDFL = false;
  sendResponse(500, "failure", "失败", originId, newId);
}

// 封装指示灯
void fnEncapsula(int pin1, int pin2) {
  if (pin1 != 1) digitalWrite(pin1, HIGH);
  if (pin2 != 1) digitalWrite(pin2, HIGH);
  delay(dateTime);
  if (pin1 != 1) digitalWrite(pin1, LOW);
  if (pin2 != 1) digitalWrite(pin2, LOW);
  delay(dateTime);
}

// 左转灯
void leftTurnSignal() {
  fnEncapsula(ledPin4, 1);
}

// 右转灯
void rightTurnSignal() {
  fnEncapsula(1, ledPin5);
}

// 双闪灯
void doubleFlashingLights() {
  fnEncapsula(ledPin4, ledPin5);
}

// 指示灯
void fnIndicatorLight() {
  String originId = server.arg("originId");
  String newId = server.arg("newId");
  if (originId == "") {
    int id = newId.toInt();

    switch (id) {
      case 1:
        isLTS = true;
        sendResponse(200, "success", "左转灯已开启", originId, newId);
        break;
      case 2:
        isRTS = true;
        sendResponse(200, "success", "右转灯已开启", originId, newId);
        break;
      case 3:
        isDFL = true;
        sendResponse(200, "success", "双闪灯已开启", originId, newId);
        break;
      default:
        fnIndicatorLightSendResponseError(originId, newId);
        break;
    }
  } else if (newId == "") {
    int id = originId.toInt();

    switch (id) {
      case 1:
        isLTS = false;
        sendResponse(200, "success", "左转灯已关闭", originId, newId);
        break;
      case 2:
        isRTS = false;
        sendResponse(200, "success", "右转灯已关闭", originId, newId);
        break;
      case 3:
        isDFL = false;
        sendResponse(200, "success", "双闪灯已关闭", originId, newId);
        break;
      default:
        fnIndicatorLightSendResponseError(originId, newId);
        break;
    }
  } else if (originId != "" && newId != "") {
    if (newId == "1") {
      isLTS = true;
      isRTS = false;
      isDFL = false;
      sendResponse(200, "success", "左转灯已开启", originId, newId);
    } else if (newId == "2") {
      isLTS = false;
      isRTS = true;
      isDFL = false;
      sendResponse(200, "success", "右转灯已开启", originId, newId);
    } else if (newId == "3") {
      isLTS = false;
      isRTS = false;
      isDFL = true;
      sendResponse(200, "success", "双闪灯已开启", originId, newId);
    } else {
      fnIndicatorLightSendResponseError(originId, newId);
    }
  } else {
    fnIndicatorLightSendResponseError(originId, newId);
  }
}

// 初始化WiFi服务
void runInit() {
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, pass);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print("Loading in progress...");
  }
  pinMode(ledPin4, OUTPUT);
  pinMode(ledPin5, OUTPUT);
  Serial.print("\nWiFiIP: ");
  Serial.println(WiFi.localIP());
}

// 主函数
void setup() {
  Serial.begin(9600);
  runInit();
  server.on("/api/apiIndicatorLight", HTTP_GET, fnIndicatorLight);
  server.begin();
}

// 循环函数
void loop() {
  server.handleClient();
  if (isLTS) leftTurnSignal();
  if (isRTS) rightTurnSignal();
  if (isDFL) doubleFlashingLights();
}

解析

敬请期待...


微信小程序

Html

代码

html 复制代码
<view class="d_g gtc1_1fr gg_38">
  <view class="h_208 lh_208 fs_58 fw_b ta_c bc_efefef radius_8 {{activa===item.id?'color_409eff':''}}" wx:for="{{list}}" wx:key="id" data-id='{{item.id}}' catchtap='handleTabBar'>
    {{item.title}}
  </view>
</view>

解析
敬请期待...


JavaScript

代码

javascript 复制代码
// components/IndicatorLight/page.js
import {
  indicatorLight
} from '../../api/indicatorLight.js';

const {
  showToast
} = getApp();

Component({

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    list: [{
        id: 1,
        title: '左 转'
      },
      {
        id: 2,
        title: '右 转'
      },
      {
        id: 3,
        title: '双 闪'
      }
    ],
    activa: ''
  },

  /**
   * 组件的方法列表
   */
  methods: {
    async handleTabBar({
      target: {
        dataset: {
          id
        }
      }
    }) {
      const that = this;
      const thatData = that.data;
      let originId = thatData.activa;
      let newId = id;

      newId = originId === id ? '' : id;

      let {
        message
      } = await indicatorLight({
        originId,
        newId
      });

      that.setData({
          activa: newId
        },
        () => showToast(message)
      );
    }
  }
})

解析
敬请期待...

相关推荐
吕彬-前端23 分钟前
使用vite+react+ts+Ant Design开发后台管理项目(五)
前端·javascript·react.js
学前端的小朱26 分钟前
Redux的简介及其在React中的应用
前端·javascript·react.js·redux·store
深圳市青牛科技实业有限公司31 分钟前
【青牛科技】应用方案|D2587A高压大电流DC-DC
人工智能·科技·单片机·嵌入式硬件·机器人·安防监控
guai_guai_guai35 分钟前
uniapp
前端·javascript·vue.js·uni-app
Mr.谢尔比1 小时前
电赛入门之软件stm32keil+cubemx
stm32·单片机·嵌入式硬件·mcu·信息与通信·信号处理
LightningJie1 小时前
STM32中ARR(自动重装寄存器)为什么要减1
stm32·单片机·嵌入式硬件
bysking2 小时前
【前端-组件】定义行分组的表格表单实现-bysking
前端·react.js
王哲晓2 小时前
第三十章 章节练习商品列表组件封装
前端·javascript·vue.js
fg_4112 小时前
无网络安装ionic和运行
前端·npm
理想不理想v2 小时前
‌Vue 3相比Vue 2的主要改进‌?
前端·javascript·vue.js·面试