android-uniapp/pages/index/index.vue

<template>
  <view class="window-box">
    <ly-back :showBack="false"/>
    <view class="search w100 h100 flex-center-center main flex-dir-column">
      <view class="" @click="getListHandle">测验机器</view>
      <br>
      <br>
      <br>
      <view class="flex-between-center w50">
        <view class="w50 flex-center-center">
          <view :class="[machine.scan?'btn-primary':'btn-info']" class="btn">
            扫码器
            <uv-icon v-if="machine.scan" color="#FFF" name="checkbox-mark" size="28"/>
          </view>
        </view>
        <view class="w50 flex-center-center">
          <view :class="[machine.bmi?'btn-primary':'btn-info']" class="btn">
            体重秤
            <uv-icon v-if="machine.bmi" color="#FFF" name="checkbox-mark" size="28"/>
          </view>
        </view>
      </view>
      <br>
      <br>
      <view class="flex-start-center">
        卡号：
        <view class="col-checked">{{ pD.value1 || '--' }}</view>
      </view>
      <br>
      <view class="flex-start-center">
        身高：
        <view class="col-checked">{{ pD.value3 || '0' }}</view>
        cm
      </view>
      <view class="flex-start-center">
        体重：
        <view class="col-checked">{{ pD.value2 || '0' }}</view>
        kg
      </view>


      <!--      <view class="" :class="{'col-green':}"></view>-->

      <!--      <view class="w60 h60 bg2 flex-center-center flex-wrap flex-dir-column">-->
      <!--        <view>请将卡片放入感应区</view>-->
      <!--        <view >-->
      <!--          <uv-image :src="pD.imgUrl+ '/index-card.png'" width="500px" height="306px"></uv-image>-->
      <!--        </view>-->
      <!--      </view>-->
      <!--      <view class="btn btn-primary" @click="search">扫码</view>-->
      <!--      <view class="btn btn-primary" @click="next">下一页</view>-->
      <!--      <view class="btn btn-primary" @click="toSelect">手动选择</view>-->
    </view>
  </view>
</template>

<script setup>
import {getCurrentInstance, inject, onActivated, onBeforeUnmount, onMounted, reactive} from "vue";
import {onShow, onHide} from "@dcloudio/uni-app";
import {navTo, showToast} from "@/utils/app";
import {cradToStudentInfo} from "@/api/student";
import storage from "@/utils/storage";
import {getAllMethods, logs, sleep} from "@/utils/util";
import * as ASCIIUtils from "@/uni_modules/wrs-js-modbusCRCHex/js_sdk/wrs-ASCIIUtils";
import * as HexUtils from "@/uni_modules/wrs-js-modbusCRCHex/js_sdk/wrs-HexUtils";
import {orderToData} from "@/utils/ble/hex";

const $machine = inject('$machine')

const pD = reactive({
  title: '学生未激活',
  select: 0,
  selectMax: 1,
  imgUrl: '/static',
  value1: '',
  value2: '',
})
const machine = reactive({
  scan: false,
  bmi: false,
})
const queryForm = reactive({
  student_id: 0,
})
const search = async () => {
  const {code, msg, data} = await cradToStudentInfo({
    mac: 'BBBBBBBBBBBB'
  })
  if (code === 1) {
    queryForm.student_id = data.student.id
    storage.setKey(`student-${data.student.id}`)
    navTo('pages/task/info', {
      id: queryForm.student_id,
    })
  } else {
    showToast(msg)
  }
  // navTo('pages/task/info')
}

const next = () => {
  navTo('pages/task/info', {
    id: queryForm.student_id,
  })
}

const toSelect = () => {
  navTo('pages/classes/select')
}

const getListHandle = () => {
  // console.log('getListHandle')
  $machine.getUsbList(true)
}

const scanWatch = (res) => {
  console.log('scanWatch123', res)
  pD.value1 = res.value
}

const bmiWatch = (res) => {
  console.log('bmiWatch123', res)
  pD.value2 = res.kg
  pD.value3 = res.cm
}

const notifyMachineUsb = ({id, up}) => {
  machine[id] = up
}

const setWatch = (open = false) => {
  if (open) {
    $machine.scan().setWatch(scanWatch)
    $machine.bmi().setWatch(bmiWatch)
  } else {
    $machine.scan().setWatch(null)
    $machine.bmi().setWatch(null)
  }
}


// 挂载完成之后
onMounted(async (r) => {
  // console.log('index onMounted')
  uni.$on('machineUsb', notifyMachineUsb)
  // getListHandle()
})

onShow(async () => {
  setWatch(true)
})

onHide(async () => {
  setWatch()
})
// 页面卸载前
onBeforeUnmount(() => {
  setWatch()
  uni.$off('machineUsb', notifyMachineUsb)
})
defineExpose({})

// 激活页面时
onActivated(async () => {
})
</script>

<style lang="scss" scoped>
.main {
  background-image: url('static/image/index-bg.png');
  width: 100%;
  height: 100%;
  background-position: center center;
  background-size: 100%;
  background-repeat: no-repeat;
}

.bg2 {
  background-image: url('static/image/index-bg2.png');
  width: 80%;
  height: 80%;
  background-position: center center;
  background-size: 100%;
  background-repeat: no-repeat;
}

.info-item {
  display: flex;
  align-items: center;
  margin-bottom: 30rpx;

  &-label {
    margin-right: 50rpx;
  }
}
</style>