物联网之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)
      );
    }
  }
})

解析
敬请期待...

相关推荐
帅过二硕ฅ17 分钟前
uniapp点击跳转到对应位置
前端·javascript·uni-app
正小安3 小时前
URL.createObjectURL 与 FileReader:Web 文件处理两大法宝的对比
前端·javascript
赵广陆3 小时前
SprinBoot+Vue宠物寄养系统的设计与实现
前端·vue.js·宠物
A黄俊辉A4 小时前
vue3中把封装svg图标为全局组件
前端·javascript·vue.js
老贾爱编程4 小时前
VUE实现刻度尺进度条
前端·javascript·vue.js
F2E_Zhangmo4 小时前
vue如何做到计算属性传参?
前端·javascript·vue.js
繁依Fanyi5 小时前
828华为云征文|华为Flexus云服务器搭建OnlyOffice私有化在线办公套件
服务器·开发语言·前端·python·算法·华为·华为云
叫我小鹏呀5 小时前
vue3中el-table中点击图片放大时,被表格覆盖
前端·javascript·vue.js
梅双单片机5 小时前
【源代码+仿真+原理图+技术文档+演示录屏+软件】基于单片机的厨房监控系统的设计与实现
单片机·嵌入式硬件
我命由我123455 小时前
2.使用 VSCode 过程中的英语积累 - Edit 菜单(每一次重点积累 5 个单词)
前端·javascript·ide·vscode·学习·编辑器·学习方法