charge-front/src/pages-charge/codeing/codeing.vue

<template>
  <view class="pt-10 pr-60 pl-60">
    <view class="lh-0">
      <!-- #ifdef MP-WEIXIN -->
      <!-- #endif -->
      <image
        src="/pages-charge/static/charge-input-head.png"
        mode="widthFix"
        style="width: 100%"
      ></image>
    </view>
    <view class="mt-20">
      <style-input
        title="充电编码"
        :value="value"
        :focus="focus"
        type="text"
        @input="input"
      />
    </view>
    <view style="margin-top: 100rpx">
      <style-button type="primary" @click="submit">确认</style-button>
      <view class="mt-20"></view>
      <style-button type="primary" :border="true" @click="scanCode"
        >扫码充电</style-button
      >
    </view>
  </view>
</template>

<script setup lang="ts">
import {fetchStationByConnectorIdOrShortId, fetchStationDetailByConnectorId} from "@/api/charge";
import { ref } from "vue";
import { scanCode } from "../../utils/code";
import { to } from "../../utils/navigate";

const value = ref("");
const focus = ref(true);

const submit = () => {
  if (!value.value) {
    uni.showToast({
      title: "请输入充电编码",
      icon: "none",
    });
    return;
  }
  uni.showLoading({
    title: "加载中",
  });
  fetchStationDetailByConnectorId(value.value)
    .then(() => {
      uni.hideLoading();
      to(`/pages-charge/appointment/appointment?connectorId=${value.value}`);
    })
    .catch((err) => {
      value.value = ''
      console.log(err);
      uni.hideLoading();
      uni.showModal({
        title: "温馨提示",
        content: `充电桩编号不存在，请检查后重新输入`,
        confirmText: "确定",
        confirmColor: "#2d9e95",
        showCancel: false,
      });
    });
};
const input = (e: any) => {
  value.value = e.value;
};
</script>