<template>
  <div class="main" :style="{ paddingTop: haveCode ? '44rpx' : '' }">
    <div class="topMessage" v-if="!haveCode">
      <div class="messageTitle">请输入您的车牌号</div>
      <div class="messageList">
        <div class="messageText">
          1、您授权的车牌信息安全将被严格保证，并限于您授权的用途；
        </div>
        <div class="messageText">2、1个车牌号仅允许被1个账号绑定。</div>
      </div>
      <image class="carLogo" src="https://eshangtech.com/wanmeiyizhanImg/home/carLogoBg.png" />
    </div>

    <!-- 输入车牌号的框 -->
    <div class="codeBox"
      :style="{ transform: haveCode ? '' : 'translateY(-60rpx)', marginBottom: haveCode ? '28rpx' : '' }">
      <!-- 切换一下 是燃油车 还是 新能源 -->
      <div class="carTypeChange" @click="handleChangeCar">
        <view class="carTypeLeft">
          <span class="typeName">{{ carType === 1 ? '燃油车牌' : carType === 2 ? '新能源牌' : '' }}</span>
        </view>

        <view class="carTypeRight">
          <image class="changeIcon"
            :src="carType === 1 ? '/static/home/newChangeCarType.svg' : '/static/home/normalChargeIcon.svg'" />
          <span class="carType" :style="{ color: carType === 1 ? '#50D000' : '#0077FF' }">{{ carType === 1 ? '新能源' :
            carType === 2 ? '燃油车' :
              '' }}</span>
        </view>
      </div>

      <div class="input-box">
        <div :class="haveCode ? 'input-f cccBg' : nowIndex === i ? 'input-f orangeRedBorder' : 'input-f'"
          v-for="(item, i) in normalLen" :key="i" @tap="focusInput(i)">
          <div :class="i === 7 && carType === 1 ? 'show-input disabledBox' : 'show-input'">
            <image style="width: 38rpx;height: 38rpx;" class="disabledIcon" v-if="i === 7 && carType === 1"
              src="/static/home/disabledCode.svg" />
            <span v-else>{{ saveCarText[i] }}</span>
          </div>
        </div>
        <!-- <div class="input-f lastBox" @tap="handleChangeCarType">
          <div calss="show-input">
            <span class="text-sm">{{ newEnergy ? "新能源" : "" }}</span>
          </div>
        </div> -->
      </div>
    </div>

    <!-- <div class="bindTypeBox" v-if="!haveCode">
      <span class="bindTrain" @click="handleChangeBindType">{{
        bindCarType === 1 ? "绑定货车" : "绑定轿车"
      }}</span>
    </div> -->

    <view>
      <div class="bindPopup">
        <div class="popupTitle" v-if="!haveCode">绑定车辆</div>


        <div class="fileItem">
          <div class="itemTitle">身份证<span style="color: red;margin-left: 8rpx;">*</span></div>
          <div class="newUploadImgBox">
            <div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(1)>
              <view class="leftText">{{ codeImgObj.frontIDCard ? '身份证人像面' : '请上传身份证人像面' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.frontIDCard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>

            <div class="imgItem" @click=handleShowUplodaPopup(2)>
              <view class="leftText">{{ codeImgObj.reverseIDcard ? '身份证国徽面' : '请上传身份证国徽面' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.reverseIDcard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>
          </div>

          <!-- <div class="uploadImgBox">
            <div class="submitImgBox" v-if="!codeImgObj.frontIDCard" @click="submitImg('1', '1')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText">请上传身份证人像面</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.frontIDCard" @click="submitImg('1', '1')" mode="aspectFill" />
            </div>

            <div class="submitImgBox" v-if="!codeImgObj.reverseIDcard" @click="submitImg('1', '2')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText">请上传身份证国徽面</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.reverseIDcard" @click="submitImg('1', '2')" mode="aspectFill" />
            </div>
          </div> -->
        </div>

        <div class="fileItem">
          <div class="itemTitle">驾驶证<span style="color: red;margin-left: 8rpx;">*</span></div>
          <div class="newUploadImgBox">
            <div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(3)>
              <view class="leftText">{{ codeImgObj.frontDriverCard ? '驾驶证主页' : '请上传驾驶证主页' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.frontDriverCard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>

            <div class="imgItem" @click=handleShowUplodaPopup(4)>
              <view class="leftText">{{ codeImgObj.reverseDriverCard ? '驾驶证副页' : '请上传驾驶证副页' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.reverseDriverCard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>
          </div>

          <!-- <div class="uploadImgBox">
            <div class="submitImgBox" v-if="!codeImgObj.frontDriverCard" @click="submitImg('2', '1')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText"><span style="color: red">*</span>请上传驾驶证主页</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.frontDriverCard" @click="submitImg('2', '1')" mode="aspectFill" />
            </div>

            <div class="submitImgBox" v-if="!codeImgObj.reverseDriverCard" @click="submitImg('2', '2')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText">请上传驾驶证副页</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.reverseDriverCard" @click="submitImg('2', '2')" mode="aspectFill" />
            </div>
          </div> -->
        </div>

        <div class="fileItem">
          <div class="itemTitle">行驶证<span style="color: red;margin-left: 8rpx;">*</span></div>

          <div class="newUploadImgBox">
            <div class="imgItem" style="margin-bottom: 28rpx;" @click=handleShowUplodaPopup(5)>
              <view class="leftText">{{ codeImgObj.frontLicenseCard ? '行驶证主页' : '请上传行驶证主页' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.frontLicenseCard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>

            <div class="imgItem" @click=handleShowUplodaPopup(6)>
              <view class="leftText">{{ codeImgObj.reverseLicenseCard ? '行驶证副页' : '请上传行驶证副页' }}</view>
              <view class="rightBox">
                <span class="rightText">{{ codeImgObj.reverseLicenseCard ? haveCode ? '查看图片' : '上传成功' : '点击上传' }}</span>
                <image class="rightIcon" src="/static/home/rightRow.svg" />
              </view>
            </div>
          </div>




          <!-- <div class="uploadImgBox">
            <div class="submitImgBox" v-if="!codeImgObj.frontLicenseCard" @click="submitImg('3', '1')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText"><span style="color: red">*</span>请上传行驶证主页</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.frontLicenseCard" @click="submitImg('3', '1')" mode="aspectFill" />
            </div>

            <div class="submitImgBox" v-if="!codeImgObj.reverseLicenseCard" @click="submitImg('3', '2')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
              <span class="submitText">请上传行驶证副页</span>
            </div>
            <div class="imgItem" v-else>
              <image :src="codeImgObj.reverseLicenseCard" @click="submitImg('3', '2')" mode="aspectFill" />
            </div>
          </div> -->
        </div>
      </div>
    </view>

    <!-- 确认绑定按钮 -->
    <div class="confirmBox" @click="handleConfirmCode" v-if="!haveCode">
      确认绑定
    </div>
    <!-- 取消绑定 -->
    <div class="cancelBox" @click="handleCancelCode" v-if="haveCode">
      解绑车辆
    </div>

    <uni-popup ref="uploadPopup" :show="showPopup" :safe-area="false" :mask-click="false" :is-mask-click="false">
      <view class="uploadBox">
        <image class="closeIcon" src="/static/home/newCloseIcon.svg" @click="handleHideUplodaPopup" />
        <div class="uploadTitle">{{
          popupType === 1 ? '身份证人像面' :
            popupType === 2 ? '身份证国徽面' :
              popupType === 3 ? '驾驶证主页' :
                popupType === 4 ? '驾驶证副页' :
                  popupType === 5 ? '行驶证主页' :
                    popupType === 6 ? '行驶证副页' : ''
        }}</div>

        <div class="imgBox" :style="{
          backgroundImage: `url(${popupType === 1 ? codeImgObj.frontIDCard :
            popupType === 2 ? codeImgObj.reverseIDcard :
              popupType === 3 ? codeImgObj.frontDriverCard :
                popupType === 4 ? codeImgObj.reverseDriverCard :
                  popupType === 5 ? codeImgObj.frontLicenseCard :
                    popupType === 6 ? codeImgObj.reverseLicenseCard : '#E8E8E8'
            })`
        }" @click="handlePriview"></div>

        <div class="uploadAgain" @click="handleUploadAgain" v-if="!haveCode">重新上传</div>


      </view>
    </uni-popup>

    <!-- 货车司机 -->
    <!-- <div class="confirmBox" style="margin-top: 26rpx" @click="handleBindTruck">
      绑定货车
    </div> -->

    <!-- <uni-popup
      ref="popup"
      :show="showPopup"
      :safe-area="false"
      @close="handleClosePopup"
      @maskClick="handleClosePopup"
    >
      <div class="bindPopup">
        <div class="fileItem">
          <div class="itemTitle">身份证<span style="color: red">*</span></div>
          <div class="uploadImgBox">
            <div class="submitImgBox" @click="submitImg('1')">
              <image class="addIcon" src="/static/home/addImageIcon.svg" />
            </div>

            <div
              class="imgItem"
              v-for="(item, index) in IDCardImgList"
              :key="index"
            >
              <image
                :src="item"
                @click="showImg2(index, IDCardImgList)"
                mode="aspectFill"
              />
              <div class="closeBox" @click.stop="deleteImgFunc(item, index)">
                <image class="closeIcon" src="/static/home/closeIcon.svg" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </uni-popup> -->

    <div>
      <keyboard :isShow="isShow" :keyBoardType="defaultKeyWordType" @inputchange="inputChange" @delete="delValue"
        @ok="confirmboard" />
    </div>

    <div class="page-body" v-if="false">
      <div v-show="!isLoading && cards.length > 0">
        <div class="title">已绑车辆</div>
        <swiper scroll-x="true" class="banner">
          <swiper-item v-for="(item, o) in cards" :key="o" class="car-card">
            <div class="car-card">
              <image src="https://eshangtech.com/wanmeiyizhanImg/car-card.png" mode="acspetFit" />
              <text class="card-title">{{ item.License_Plate }}</text>
            </div>
          </swiper-item>
          <swiper-item class="car-card">
            <div class="car-card-add"></div>
          </swiper-item>
        </swiper>
      </div>
      <div v-show="!isLoading && cards.length == 0">
        <image src="https://eshangtech.com/wanmeiyizhanImg/car.png" mode="acspetFit" class="pic-image"></image>
        <div class="tip-text">暂无绑定车辆</div>
        <div class="add-car" @tap="toAdd">
          <van-icon name="plus" size="32" color="#B0B0B0" />
          <span class="">添加车辆</span>
        </div>
      </div>
    </div>
    <CustomLoading :visible="isLoading" v-if="isLoading" @update:visible="(val) => (isLoading = val)" />
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import keyboard from "../../../components/keyboard.vue";
import CustomLoading from "../../../components/customLoading.vue";
export default {
  data() {
    return {
      cards: [],
      // isLoading: true,
      normalLen: 8,
      nowIndex: -1,
      isShow: false,
      saveCarText: ["皖", "A", "", "", "", "", "", ""],
      newEnergy: true, // 是否是新能源
      haveCode: false, // 判断是否已经有了code
      defaultKeyWordType: 1, // 默认的键盘类型 1是 省份  2是 车牌号
      showPopup: false,
      IDCardImgList: [], // 身份证 上传的图片
      driverLicenseList: [], // 驾驶证 上传的图片
      drivingLicenseList: [], // 行驶证 上传的图片
      bindCarType: 1, // 绑定车的类型  1 轿车  2 货车
      isLoading: false,
      carType: 1,// 1 燃油车  2 新能源汽车
      codeInfo: {
        cardInfoCode: {
          STAFF_ID: "",
        }, // 身份证的数据
        drivingInfo: {
          STAFF_ID: "",
        }, // 驾驶证的数据
        vehicleInfo: {
          STAFF_ID: "",
        }, // 行驶证的数据
      },
      codeImgObj: {
        frontIDCard: "", // 身份证正面
        reverseIDcard: "", // 身份证反面
        frontDriverCard: "", // 驾驶证正面
        reverseDriverCard: "", // 驾驶证反面
        frontLicenseCard: "", // 行驶证正面
        reverseLicenseCard: "", // 行驶证反面
      }, // 三证的图片数据
      popupType: 0,// 上传证件类型
    };
  },
  computed: {
    ...mapGetters({
      user: "user",
    }),
  },
  components: {
    keyboard,
    CustomLoading,
  },
  methods: {
    // 重新上传
    handleUploadAgain() {
      // 身份证正面
      if (this.popupType === 1) {
        this.submitImg('1', '1')
      } else if (this.popupType === 2) {
        // 身份证反面
        this.submitImg('1', '2')
      } else if (this.popupType === 3) {
        // 驾驶证主页
        this.submitImg('2', '1')
      } else if (this.popupType === 4) {
        // 驾驶证副页
        this.submitImg('2', '2')
      } else if (this.popupType === 5) {
        // 行驶证主页
        this.submitImg('3', '1')
      } else if (this.popupType === 6) {
        // 行驶证副页
        this.submitImg('3', '2')
      }
    },
    // 预览图片
    handlePriview() {
      uni.previewImage({
        current: 0, // 当前显示图片的http链接
        urls: [this.popupType === 1 ? this.codeImgObj.frontIDCard :
          this.popupType === 2 ? this.codeImgObj.reverseIDcard :
            this.popupType === 3 ? this.codeImgObj.frontDriverCard :
              this.popupType === 4 ? this.codeImgObj.reverseDriverCard :
                this.popupType === 5 ? this.codeImgObj.frontLicenseCard :
                  this.popupType === 6 ? this.codeImgObj.reverseLicenseCard : ""], // 需要预览的图片http链接列表
      });
    },
    // 点击立即上传 唤起悬浮框
    handleShowUplodaPopup(value) {
      console.log('valuevaluevaluevalue', value);
      // this.popupType = value
      // this.$refs.uploadPopup.open('center')

      // 判断是否显示编辑的抽屉
      let isShowDetail = false
      if (value === 1 && this.codeImgObj.frontIDCard) {
        isShowDetail = true
      } else if (value === 2 && this.codeImgObj.reverseIDcard) {
        isShowDetail = true
      } else if (value === 3 && this.codeImgObj.frontDriverCard) {
        isShowDetail = true
      } else if (value === 4 && this.codeImgObj.reverseDriverCard) {
        isShowDetail = true
      } else if (value === 5 && this.codeImgObj.frontLicenseCard) {
        isShowDetail = true
      } else if (value === 6 && this.codeImgObj.reverseLicenseCard) {
        isShowDetail = true
      }
      if (isShowDetail) {
        this.popupType = value
        this.$refs.uploadPopup.open('center')
      } else {
        // 身份证正面
        if (value === 1) {
          this.submitImg('1', '1')
        } else if (value === 2) {
          // 身份证反面
          this.submitImg('1', '2')
        } else if (value === 3) {
          // 驾驶证主页
          this.submitImg('2', '1')
        } else if (value === 4) {
          // 驾驶证副页
          this.submitImg('2', '2')
        } else if (value === 5) {
          // 行驶证主页
          this.submitImg('3', '1')
        } else if (value === 6) {
          // 行驶证副页
          this.submitImg('3', '2')
        }
      }


      console.log('this.codeInfo', this.codeInfo);
      console.log('this.codeImgObj', this.codeImgObj);

    },
    // 
    handleHideUplodaPopup() {
      this.popupType = 0
      this.$refs.uploadPopup.close()
    },
    // 切换汽车类型 会增加会减少车牌号
    handleChangeCar() {
      if (this.carType === 1) {
        this.carType = 2
        // this.normalLen = 8
      } else {
        this.carType = 1
        // this.normalLen = 7
      }
      this.$forceUpdate();
    },
    // 修改绑定类型
    handleChangeBindType() {
      if (this.bindCarType === 1) {
        this.bindCarType = 2;
      } else {
        this.bindCarType = 1;
      }
    },
    // 绑定货车
    handleBindTruck() {
      this.handleOpenDetail();
    },
    // 关闭悬浮框 货车的
    handleClosePopup() {
      this.$refs.popup.close();
    },
    // 打开悬浮框 货车的
    handleOpenDetail() {
      this.$refs.popup.open("bottom");
    },
    showImg2(index, imgList) {
      uni.previewImage({
        urls: imgList,
        current: index,
        loop: true,
        indicator: "number",
      });
    },
    // 删除答案里面的图片
    deleteImgFuncResponse(item, index) {
      item = item.splice(index, 1);
      this.$forceUpdate();
    },
    submitImg(type, frontOrBack) {
      // type 1 为身份证 2 为驾驶证  3 为行驶证
      // frontOrBack 1 为正面  2 为反面
      if (this.haveCode) {
        let imgList = [];
        if (type === "1") {
          if (frontOrBack === "1") {
            imgList = [this.codeImgObj.frontIDCard];
          } else {
            imgList = [this.codeImgObj.reverseIDcard];
          }
        } else if (type === "2") {
          if (frontOrBack === "1") {
            imgList = [this.codeImgObj.frontDriverCard];
          } else {
            imgList = [this.codeImgObj.reverseDriverCard];
          }
        } else if (type === "3") {
          if (frontOrBack === "1") {
            imgList = [this.codeImgObj.frontLicenseCard];
          } else {
            imgList = [this.codeImgObj.reverseLicenseCard];
          }
        }

        uni.previewImage({
          urls: imgList,
          current: 0,
          loop: true,
          indicator: "number",
        });
      } else {
        let _this = this;
        uni.chooseImage({
          count: 9, //默认9
          sizeType: ["original", "compressed"],
          sourceType: ["camera"],
          // "album",
          success: function (rs) {
            let quality = 100;
            if (rs.tempFiles[0].size > 1024 * 200) {
              quality = ((1024 * 200) / rs.tempFiles[0].size) * 100;
            }
            if (quality < 100 && rs.tempFiles[0].path.indexOf(".jpg") > -1) {
              uni.compressImage({
                src: rs.tempFilePaths[0], // 图片路径
                quality: quality, // 压缩质量
                success(res) {
                  let data = {};
                  if (res.data) {
                    data = JSON.parse(res.data);
                  }
                  // uni.showLoading({
                  //   title: "图片上传中...",
                  // });
                  _this.isLoading = true;
                  uni.uploadFile({
                    // url: "https://user.eshangtech.com/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
                    // url: "https://es.robot-z.cn/oss/upload",
                    url: "https://es.eshangtech.com/oss/upload",
                    filePath: res.tempFilePath,
                    header: {
                      "Content-Type": "multipart/form-data",
                    },
                    formData: {},
                    fileType: "image",
                    name: "file",
                    async success(res) {
                      let data = {};
                      if (res.data) {
                        data = JSON.parse(res.data);
                      }
                      // uni.hideLoading();

                      _this.isLoading = false;

                      if (type === "1") {
                        const res = await _this.handleIdentification(
                          `https://es.eshangtech.com/${data.data.path}`,
                          1,
                          frontOrBack
                        );
                        if (res) {
                          if (frontOrBack === "1") {
                            _this.codeImgObj.frontIDCard = `https://es.eshangtech.com/${data.data.path}`;
                          } else {
                            _this.codeImgObj.reverseIDcard = `https://es.eshangtech.com/${data.data.path}`;
                          }
                          // // 身份证的数组
                          // _this.IDCardImgList.push(
                          //   `https://es.eshangtech.com/${data.data.path}`
                          // );
                        }
                      } else if (type === "2") {
                        const res = await _this.handleIdentification(
                          `https://es.eshangtech.com/${data.data.path}`,
                          2,
                          frontOrBack
                        );
                        if (res) {
                          if (frontOrBack === "1") {
                            _this.codeImgObj.frontDriverCard = `https://es.eshangtech.com/${data.data.path}`;
                          } else {
                            _this.codeImgObj.reverseDriverCard = `https://es.eshangtech.com/${data.data.path}`;
                          }
                          // 驾驶证的图片
                          // _this.driverLicenseList.push(
                          //   `https://es.eshangtech.com/${data.data.path}`
                          // );
                        }
                      } else if (type === "3") {
                        const res = await _this.handleIdentification(
                          `https://es.eshangtech.com/${data.data.path}`,
                          3,
                          frontOrBack
                        );
                        if (res) {
                          if (frontOrBack === "1") {
                            _this.codeImgObj.frontLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
                          } else {
                            _this.codeImgObj.reverseLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
                          }

                          // 行驶证图片
                          // _this.drivingLicenseList.push(
                          //   `https://es.eshangtech.com/${data.data.path}`
                          // );
                        }
                      }


                      console.log('_this.codeImgObj', _this.codeImgObj);

                      // _this.$forceUpdate();
                    },
                    fail(error) {
                      _this.noPost = true;
                    },
                  });
                },
                fail(error) {
                  _this.noPost = true;
                },
              });
            } else {
              _this.isLoading = true;
              // uni.showLoading({
              //   title: "图片上传中...",
              // });
              uni.uploadFile({
                // url: "https://user.eshangtech.com/Coop.Merchant/Handler/handler_ajax.ashx?action_type=UploadFile&folder=MBWA",
                // url: "https://es.robot-z.cn/oss/upload",
                url: "https://es.eshangtech.com/oss/upload",
                filePath: rs.tempFilePaths[0],
                fileType: "image",
                header: {
                  "Content-Type": "multipart/form-data",
                },
                name: "file",
                async success(res) {
                  let data = {};
                  if (res.data) {
                    data = JSON.parse(res.data);
                  }
                  // uni.hideLoading();

                  _this.isLoading = false;
                  if (type === "1") {
                    const res = await _this.handleIdentification(
                      `https://es.eshangtech.com/${data.data.path}`,
                      1,
                      frontOrBack
                    );
                    if (res) {
                      if (frontOrBack === "1") {
                        _this.codeImgObj.frontIDCard = `https://es.eshangtech.com/${data.data.path}`;
                      } else {
                        _this.codeImgObj.reverseIDcard = `https://es.eshangtech.com/${data.data.path}`;
                      }
                      // // 身份证的数组
                      // _this.IDCardImgList.push(
                      //   `https://es.eshangtech.com/${data.data.path}`
                      // );
                    }
                  } else if (type === "2") {
                    const res = await _this.handleIdentification(
                      `https://es.eshangtech.com/${data.data.path}`,
                      2,
                      frontOrBack
                    );
                    if (res) {
                      if (frontOrBack === "1") {
                        _this.codeImgObj.frontDriverCard = `https://es.eshangtech.com/${data.data.path}`;
                      } else {
                        _this.codeImgObj.reverseDriverCard = `https://es.eshangtech.com/${data.data.path}`;
                      }
                      // // 驾驶证的图片
                      // _this.driverLicenseList.push(
                      //   `https://es.eshangtech.com/${data.data.path}`
                      // );
                    }
                  } else if (type === "3") {
                    const res = await _this.handleIdentification(
                      `https://es.eshangtech.com/${data.data.path}`,
                      3,
                      frontOrBack
                    );
                    if (res) {
                      if (frontOrBack === "1") {
                        _this.codeImgObj.frontLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
                      } else {
                        _this.codeImgObj.reverseLicenseCard = `https://es.eshangtech.com/${data.data.path}`;
                      }
                      // // 行驶证图片
                      // _this.drivingLicenseList.push(
                      //   `https://es.eshangtech.com/${data.data.path}`
                      // );
                    }
                  }

                  console.log('_this.codeImgObj', _this.codeImgObj);
                  // _this.$forceUpdate();
                },
                fail(error) {
                  _this.noPost = true;
                },
              });
            }
          },
          fail: function (err) { },
        });
      }

    },

    // 根据车辆类型返回需要的准驾车型
    getRequiredLicenseTypes(vehicleType) {
      if (!vehicleType) return [];
      if (
        vehicleType.includes("小型") &&
        (vehicleType.includes("轿车") || vehicleType.includes("客车"))
      ) {
        return ["C1", "C2"];
      } else if (
        vehicleType.includes("微型货车") ||
        vehicleType.includes("微型封闭式货车") ||
        vehicleType.includes("轻型货车") ||
        vehicleType.includes("轻型封闭式货车")
      ) {
        return ["C1"]; // 轻微型货车 C1可以开
      } else if (
        vehicleType.includes("中型货车") ||
        vehicleType.includes("中型封闭式货车")
      ) {
        return ["B2"];
      } else if (
        vehicleType.includes("重型货车") ||
        vehicleType.includes("重型封闭式货车")
      ) {
        return ["B2"];
      } else if (vehicleType.includes("牵引车")) {
        return ["A2"];
      } else if (vehicleType.includes("中型客车")) {
        return ["B1"];
      } else if (
        vehicleType.includes("大型客车") ||
        vehicleType.includes("重型客车")
      ) {
        return ["A1"];
      } else if (vehicleType.includes("半挂")) {
        return ["A2"];
      } else {
        return []; // 无法判断的车辆类型，默认放过
      }
    },
    // 证件识别
    async handleIdentification(url, type, frontOrBack) {
      this.isLoading = true;
      // type  1 身份证  2 驾驶证 3 行驶证
      // frontOrBack 1 为正面  2 为反面
      console.log("frontOrBack", frontOrBack);

      const req = {
        imageUrl: url,
      };
      let data = {};
      if (type === 1) {
        data = await this.$api.$get("/MemberIdentify/RecognizeIdCard", req);
      } else if (type === 2) {
        data = await this.$api.$get("/MemberIdentify/RecognizeDriving", req);
      } else if (type === 3) {
        data = await this.$api.$get("/MemberIdentify/RecognizeVehicle", req);
      }
      if (data.Result_Code !== 100) {
        uni.showToast({
          title: `${type === 1
            ? "身份证"
            : type === 2
              ? "驾驶证"
              : type === 3
                ? "行驶证"
                : ""
            }识别失败！请重新上传`,
          icon: "error",
        });
        this.isLoading = false;
        return false;
      }

      let obj = JSON.parse(data.Result_Data);

      let infoObj = {};
      if (type === 1) {
        console.log("this.codeInfo.cardInfoCode", this.codeInfo.cardInfoCode);
        if (frontOrBack === "1") {
          if (obj.data.face) {
            infoObj = obj.data.face.data;
            this.codeInfo.cardInfoCode = {
              ...this.codeInfo.cardInfoCode,
              MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码 ,
              IDCARDINFO_NAME: infoObj.name || "", // 身份证人名
              IDCARDINFO_CODE: infoObj.idNumber || "", // 证件号码
              GENDER:
                infoObj.sex === "男" ? 1 : infoObj.sex === "女" ? "2" : "0", //性别  男1 女2
              NATIONALITY: infoObj.ethnicity || "", //名族
              BIRTH_DATE: infoObj.birthDate || "", //证件生日
              IDCARDINFO_ADDRESS: infoObj.address || "", //证件地址
              STAFF_ID: "",
              STAFF_NAME: this.user.MEMBERSHIP_NAME, //
              IDCARDINFO_STATE: 1,
              OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),
            };
          } else {
            uni.showToast({
              title: "身份证识别失败，请重新上传！",
              icon: "error",
            });
            this.isLoading = false;
            return false;
          }
        } else {
          if (obj.data.back) {
            infoObj = obj.data.back.data;
            let [start, end] = ["", ""];
            if (infoObj.validPeriod) {
              [start, end] = infoObj.validPeriod.split("-");
            }
            start = start.replace(/\./g, "-");
            end = end.replace(/\./g, "-");
            this.codeInfo.cardInfoCode = {
              ...this.codeInfo.cardInfoCode,
              ISSUE_DATE: start || "",
              EXPIRE_DATE: end || "",
              ISSUE_AUTHORITY: infoObj.issueAuthority || "",
            };
          } else {
            uni.showToast({
              title: "身份证识别失败，请重新上传！",
              icon: "error",
            });
            this.isLoading = false;
            return false;
          }
        }
      } else if (type === 2) {
        if (frontOrBack === "1") {
          if (obj.data.face) {
            infoObj = obj.data.face.data;
            let [start, end] = ["", ""];
            if (infoObj.validPeriod) {
              [start, end] = infoObj.validPeriod.split("至");
            }
            this.codeInfo.drivingInfo = {
              ...this.codeInfo.drivingInfo,
              MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码
              // LICENSE_NUMBER: infoObj.licenseNumber, // 驾驶证号
              IDCARDINFO_NAME: infoObj.name, // 证件姓名
              IDCARDINFO_CODE: infoObj.licenseNumber, // 关联身份证号
              LICENSE_TYPE: infoObj.approvedType, // 准驾车型
              VALID_FROM: start, // 有效期起始日
              VALID_TO: end, // 有效期截止日
              ISSUE_DATE: infoObj.initialIssueDate, // 发证日期
              DRIVERLICENSE_STATE: 1, // 状态（正常/吊销/过期）
              STAFF_ID: "", //
              STAFF_NAME: this.user.MEMBERSHIP_NAME, //
              OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
            };
          } else {
            uni.showToast({
              title: "驾驶证识别失败，请重新上传！",
              icon: "error",
            });
            this.isLoading = false;
            return false;
          }
        } else {
          if (obj.data.back) {
            infoObj = obj.data.back.data;
            this.codeInfo.drivingInfo = {
              ...this.codeInfo.drivingInfo,
              LICENSE_NUMBER: infoObj.licenseNumber,
              RECORD: infoObj.record,
              RECORD_NUMBER: infoObj.recordNumber,
            };
          } else {
            uni.showToast({
              title: "驾驶证识别失败，请重新上传！",
              icon: "error",
            });
            _this.isLoading = false;
            return false;
          }
        }
      } else if (type === 3) {
        if (frontOrBack === "1") {
          if (obj.data.face) {
            infoObj = obj.data.face.data;
            this.codeInfo.vehicleInfo = {
              ...this.codeInfo.vehicleInfo,
              MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, //
              PLATE_NUMBER: infoObj.licensePlateNumber, // 车牌号
              VEHICLE_TYPE: infoObj.vehicleType, // 车辆类型（如轿车/货车）
              // IDCARDINFO_CODE: "string",// 所有人身份证号
              IDCARDINFO_ADDRESS: infoObj.address, // 所有人住址
              VEHICLELICENSE_VIN: infoObj.vinCode, // 车辆识别代号（车架号）
              ENGINE_NUMBER: infoObj.engineNumber, // 发动机号
              REGISTER_DATE: infoObj.registrationDate, // 注册日期
              INSPECT_DATE: infoObj.inspectionRecord, // 检验有效期
              STAFF_ID: 0, //
              STAFF_NAME: "", //
              VEHICLELICENSE_STATE: 1,
              OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
              VEHICLELICENSE_DESC: "", //

              ISSUEAUTHORITY: infoObj.issueAuthority, // 签发机关
              MODAL: infoObj.model, // 品牌类型
              OWNER: infoObj.owner, // 所有人名称
              ISSUEDATE: infoObj.issueDate, // 发证日期
              USE_NATURE: infoObj.useNature, // 使用性质
            };
          } else {
            uni.showToast({
              title: "行驶证识别失败，请重新上传！",
              icon: "error",
            });
            this.isLoading = false;
            return false;
          }
        } else {
          if (obj.data.back) {
            infoObj = obj.data.back.data;
            this.codeInfo.vehicleInfo = {
              ...this.codeInfo.vehicleInfo,
              ...infoObj,
            };
          } else {
            uni.showToast({
              title: "行驶证识别失败，请重新上传！",
              icon: "error",
            });
            this.isLoading = false;
            return false;
          }
        }
      }
      this.isLoading = false;




      return true;
      // 到这里说明已经拿到了 识别到的数据了 然后去调用一下 存储的接口
      // 三证分别是三个不同的接口
      // let codeInfo = {}
      // if (type === 1) {
      //   // 存储身份证的识别信息
      //   const req = {
      //     MEMBERSHIP_ID: this.user.MEMBERSHIP_ID, // 会员内码 ,
      //     IDCARDINFO_NAME: infoObj.name, // 身份证人名
      //     IDCARDINFO_CODE: infoObj.idNumber, // 证件号码
      //     GENDER: infoObj.sex === '男' ? 1 : infoObj.sex === '女' ? '2' : '0',//性别  男1 女2
      //     NATIONALITY: infoObj.ethnicity,//名族
      //     BIRTH_DATE: infoObj.birthDate,//证件生日
      //     IDCARDINFO_ADDRESS: infoObj.address,//证件地址
      //     ISSUE_DATE: ,//签发日期
      //     EXPIRE_DATE: "",//失效日期
      //     STAFF_ID: "",
      //     ISSUE_AUTHORITY: "",//签发机关
      //     STAFF_NAME: this.user.MEMBERSHIP_NAME,//
      //     OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
      //   }
      //   codeInfo = await this.$api.$post(
      //     "/EShangApiMain/Member/SynchroIDCARDINFO",
      //     req
      //   );
      // } else if (type === 2) {
      //   // 存储驾驶证的识别信息
      //   const req = {
      //     DRIVERLICENSE_ID: 0,
      //     MEMBERSHIP_ID: 0,// 会员内码
      //     LICENSE_NUMBER: "string", // 驾驶证号
      //     IDCARDINFO_NAME: "string",// 关联身份证号
      //     IDCARDINFO_CODE: "string",// 证件姓名
      //     LICENSE_TYPE: "string",// 准驾车型
      //     VALID_FROM: "string",// 有效期起始日
      //     VALID_TO: "string",// 有效期截止日
      //     ISSUE_DATE: "string",// 发证日期
      //     DRIVERLICENSE_STATUS: "string",// 状态（正常/吊销/过期）
      //     STAFF_ID: 0,//
      //     STAFF_NAME: "",//
      //     OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
      //     DRIVERLICENSE_DESC: ""//
      //   }
      // } else if (type === 3) {
      //   // 存储行驶证的识别信息
      //   const req = {
      //     VEHICLELICENSE_ID: 0, //
      //     MEMBERSHIP_ID: 0,//
      //     PLATE_NUMBER: "string",// 车牌号
      //     VEHICLE_TYPE: "string",// 车辆类型（如轿车/货车）
      //     IDCARDINFO_CODE: "string",// 所有人身份证号
      //     IDCARDINFO_ADDRESS: "string",// 所有人住址
      //     VEHICLELICENSE_VIN: "string",// 车辆识别代号（车架号）
      //     ENGINE_NUMBER: "string",// 发动机号
      //     REGISTER_DATE: "string",// 注册日期
      //     INSPECT_DATE: "string",// 检验有效期
      //     STAFF_ID: 0,//
      //     STAFF_NAME: "",//
      //     OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"),//
      //     VEHICLELICENSE_DESC: ""//
      //   }
      // }

      // 前面前端调用的 有签名的方法问题
      // const config = {
      //   accessKeyId: 'LTAI5tCyuvisosdGk8sCbuhZ', // 替换为你的AK
      //   accessKeySecret: 'NhnqXZGE8pN1jFNnQL6BJDJQGPBaJY', // 替换为你的SK
      //   endpoint: 'ocr-api.cn-hangzhou.aliyuncs.com', // 服务端点
      //   apiVersion: '2019-12-30', // API版本
      //   action: 'RecognizeVehicleLicense' // 行驶证识别接口
      // };

      // const businessRes = await new Promise((resolve, reject) => {
      //   uni.request({
      //     url: `https://api.aliyun.com/api/auth/product/openAPIRequest`,
      //     method: "POST",
      //     data: {
      //       action: "RecognizeDrivingLicense",
      //       params: {
      //         Url: url
      //       }
      //     },
      //     success(res) {
      //       resolve(res);
      //     },
      //   });
      // });
      // console.log('businessResbusinessResbusinessResbusinessResbusinessResbusinessResbusinessResbusinessRes', businessRes);
    },
    // 确认绑定
    async handleConfirmCode() {
      console.log("this.saveCarText", this.saveCarText);
      let _this = this;
      let carText = _this.saveCarText.join("");
      console.log("carText", carText);
      console.log("carType", this.carType);

      // if ((this.carType === 1 && carText.length < 7) || (this.carType === 2 && carText.length < 8)) {
      //   uni.showModal({
      //     title: "温馨提示",
      //     content: "请您完善车牌号再提交",
      //     cancelColor: "#000000",
      //     confirmText: "确定",
      //     confirmColor: "#3CC51F",
      //     success: (result) => {
      //       if (result.confirm) {
      //       }
      //     },
      //   });
      //   return;
      // } else {
      //   let reg
      //   if (this.carType === 1) {
      //     reg =
      //       /^(([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳使领]))$/;
      //   } else {
      //     reg = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][DF][A-HJ-NP-Z0-9]{5}$/
      //   }

      //   const careg = reg.test(carText);
      //   if (!careg) {
      //     uni.showModal({
      //       title: "温馨提示",
      //       content: "请输入正确车牌号",
      //       showCancel: false,
      //     });
      //     return;
      //   }
      // }
      console.log('carTextcarTextcarTextcarTextcarText', carText);

      let isOk = true;
      // if (this.bindCarType === 2) {
      //   // 暂时把非身份证的副页 都设置为不必填
      //   if (!this.codeImgObj.frontIDCard || !this.codeImgObj.reverseIDcard) {
      //     uni.showModal({
      //       title: "温馨提示",
      //       content: "请上传身份证！",
      //       showCancel: false,
      //     });
      //     return;
      //   }
      //   if (!this.codeImgObj.frontDriverCard) {
      //     // || !this.codeImgObj.reverseDriverCard
      //     uni.showModal({
      //       title: "温馨提示",
      //       content: "请上传身份证！",
      //       showCancel: false,
      //     });
      //     return;
      //   }
      //   if (!this.codeImgObj.frontLicenseCard) {
      //     // || !this.codeImgObj.reverseLicenseCard
      //     uni.showModal({
      //       title: "温馨提示",
      //       content: "请上传身份证！",
      //       showCancel: false,
      //     });
      //     return;
      //   }

      //   // // 判断身份证和驾驶证 身份证号、名字 是否一致
      //   // if (this.codeInfo.cardInfoCode.IDCARDINFO_CODE && this.codeInfo.drivingInfo.LICENSE_NUMBER && this.codeInfo.drivingInfo.LICENSE_NUMBER === this.codeInfo.cardInfoCode.IDCARDINFO_CODE ||
      //   //   this.codeInfo.cardInfoCode.IDCARDINFO_NAME && this.codeInfo.drivingInfo.IDCARDINFO_CODE && this.codeInfo.drivingInfo.IDCARDINFO_CODE === this.codeInfo.cardInfoCode.IDCARDINFO_NAME) {
      //   // } else {
      //   //   uni.showModal({
      //   //     title: "温馨提示",
      //   //     content: "驾驶证和身份证信息不一致，请重新上传",
      //   //     showCancel: false,
      //   //   });
      //   //   return false;
      //   // }

      //   // // 比较 驾驶证的准驾车型 和 行驶证的车辆类型 是否一致
      //   // const vehicleType = this.codeInfo.vehicleInfo.VEHICLE_TYPE || '';
      //   // const approvedType = this.codeInfo.drivingInfo.LICENSE_TYPE || '';

      //   // const requiredLicenseTypes = this.getRequiredLicenseTypes(vehicleType);

      //   // if (requiredLicenseTypes && requiredLicenseTypes.length > 0) {
      //   //   if (!requiredLicenseTypes.includes(approvedType)) {
      //   //     uni.showModal({
      //   //       title: "温馨提示",
      //   //       content: `驾驶证准驾车型（${approvedType}）不符合驾驶车辆（${vehicleType}）的要求`,
      //   //       showCancel: false,
      //   //     });
      //   //     return false;
      //   //   }
      //   // } else {
      //   //   uni.showModal({
      //   //     title: "温馨提示",
      //   //     content: `未知车型！`,
      //   //     showCancel: false,
      //   //   });
      //   //   return false;
      //   // }

      //   if (
      //     this.codeInfo.vehicleInfo.PLATE_NUMBER !==
      //     this.saveCarText.toString().replace(/,/g, "")
      //   ) {
      //     uni.showModal({
      //       title: "温馨提示",
      //       content: `行驶证车牌号与绑定车牌号不一致！`,
      //       showCancel: false,
      //     });
      //     return false;
      //   }

      //   // if (!(this.IDCardImgList && this.IDCardImgList.length > 0)) {
      //   //   uni.showModal({
      //   //     title: "温馨提示",
      //   //     content: "请上传身份证！",
      //   //     showCancel: false,
      //   //   });
      //   //   return;
      //   // }

      //   // if (!(this.driverLicenseList && this.driverLicenseList.length > 0)) {
      //   //   uni.showModal({
      //   //     title: "温馨提示",
      //   //     content: "请上传驾驶证！",
      //   //     showCancel: false,
      //   //   });
      //   //   return;
      //   // }
      //   // if (!(this.drivingLicenseList && this.drivingLicenseList.length > 0)) {
      //   //   uni.showModal({
      //   //     title: "温馨提示",
      //   //     content: "请上传行驶证！",
      //   //     showCancel: false,
      //   //   });
      //   //   return;
      //   // }
      //   this.isLoading = true;

      //   console.log("this.codeInfothis.codeInfothis.codeInfo", this.codeInfo);
      isOk = await this.handleSaveAllCarInfo();
      // } else {
      //   let code = this.saveCarText.toString().replace(/,/g, "");
      //   const vehicleInfo = await this.$api.$post(
      //     "/EShangApiMain/Member/SynchroVEHICLELICENSE",
      //     {
      //       PLATE_NUMBER: code,
      //       STAFF_NAME: "", //
      //       VEHICLELICENSE_STATE: 1,
      //       OPERATE_DATE: this.$moment.now().format("YYYY-MM-DD HH:mm:ss"), //
      //     }
      //   );
      //   if (vehicleInfo.Result_Code !== 100) {
      //     uni.showToast({
      //       title: "存储失败！",
      //       icon: "none",
      //     });
      //     isOk = false;
      //     return false;
      //   }
      // }

      // 图片的上传对象格式
      // let imgObj = {
      //   IDCardImgList: _this.IDCardImgList,
      //   driverLicenseList: _this.driverLicenseList,
      //   drivingLicenseList: _this.drivingLicenseList,
      // };
      let imgObj = this.codeImgObj;

      this.isLoading = true;
      console.log('imgObjimgObjimgObjimgObj', imgObj);


      if (isOk) {
        _this.$api
          .getCoop({
            action_type: "BindVehicle",
            LicensePlate: carText,
            VehicleType: this.carType === 2 ? "新能源" : "",
            ImageInfo: imgObj ? JSON.stringify(imgObj) : "",
          })
          .then((res) => {
            console.log("res", res);
            if (res.Result_Code === 100) {
              uni.showModal({
                content: res.Result_Desc,
                cancelColor: "#000000",
                showCancel: false,
                confirmText: "确定",
                confirmColor: "#3CC51F",
                success: (result) => {
                  _this.isShow = false;
                  _this.getList();
                  _this.handleSearchCurrentList();
                },
              });
            } else {
              uni.showModal({
                title: "温馨提示",
                content: res.Result_Desc,
                cancelColor: "#000000",
                confirmText: "确定",
                confirmColor: "#3CC51F",
                success: (result) => {
                  if (result.confirm) {
                  }
                },
              });
            }
          });
      }
      this.isLoading = false;
    },

    // 一次性存储三份数据
    async handleSaveAllCarInfo() {
      const data = await this.$api.$post(
        "/EShangApiMain/Member/SyncMemberLicense",
        {
          idcardinfoModel: this.codeInfo.cardInfoCode,
          driverlicenseModel: this.codeInfo.drivingInfo,
          vehiclelicenseModel: this.codeInfo.vehicleInfo,
        }
      );
      if (data.Result_Code !== 100) {
        uni.showToast({
          title: `${data.Result_Desc}`,
          icon: "none",
        });
        return false;
      }
      return true;

      // const codeCarInfo = await this.$api.$post(
      //   "/EShangApiMain/Member/SynchroIDCARDINFO",
      //   this.codeInfo.cardInfoCode
      // );
      // console.log('codeCarInfo', codeCarInfo);
      // if (codeCarInfo.Result_Code !== 100) {
      //   uni.showToast({
      //     title: "身份证信息有误，请重新上传图片！",
      //     icon: 'none'
      //   })
      //   return false
      // }

      // const drivingInfo = await this.$api.$post(
      //   "/EShangApiMain/Member/SynchroDRIVERLICENSE",
      //   this.codeInfo.drivingInfo
      // );
      // if (drivingInfo.Result_Code !== 100) {
      //   uni.showToast({
      //     title: "驾驶证信息有误，请重新上传图片！",
      //     icon: 'none'
      //   })
      //   return false
      // }

      // const vehicleInfo = await this.$api.$post(
      //   "/EShangApiMain/Member/SynchroVEHICLELICENSE",
      //   this.codeInfo.vehicleInfo
      // );
      // if (vehicleInfo.Result_Code !== 100) {
      //   uni.showToast({
      //     title: "行驶证信息有误，请重新上传图片！",
      //     icon: 'none'
      //   })
      //   return false
      // }
      // return true
    },
    // 一次性查当前的用户的三证id
    async handleSearchCurrentList() {
      const codeCarInfo = await this.$api.$post(
        "/EShangApiMain/Member/GetIDCARDINFOList",
        {
          SearchParameter: {
            MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
            IDCARDINFO_STATE: 1,
          },
          PageIndex: 1,
          PageSize: 10,
        }
      );
      console.log("codeCarInfo", codeCarInfo);

      const drivingInfo = await this.$api.$post(
        "/EShangApiMain/Member/GetDRIVERLICENSEList",
        {
          SearchParameter: {
            MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
            DRIVERLICENSE_STATE: 1,
          },
          PageIndex: 1,
          PageSize: 10,
        }
      );
      console.log("drivingInfo", drivingInfo);

      const vehicleInfo = await this.$api.$post(
        "/EShangApiMain/Member/GetVEHICLELICENSEList",
        {
          SearchParameter: {
            MEMBERSHIP_ID: this.user.MEMBERSHIP_ID,
            VEHICLELICENSE_STATE: 1,
          },
          PageIndex: 1,
          PageSize: 10,
        }
      );
      console.log("vehicleInfo", vehicleInfo);

      this.codeInfo = {
        cardInfoCode:
          codeCarInfo.Result_Data.List &&
            codeCarInfo.Result_Data.List.length > 0
            ? codeCarInfo.Result_Data.List[0]
            : { STAFF_ID: "" },
        drivingInfo:
          drivingInfo.Result_Data.List &&
            drivingInfo.Result_Data.List.length > 0
            ? drivingInfo.Result_Data.List[0]
            : { STAFF_ID: "" },
        vehicleInfo:
          vehicleInfo.Result_Data.List &&
            vehicleInfo.Result_Data.List.length > 0
            ? vehicleInfo.Result_Data.List[0]
            : { STAFF_ID: "" },
      };
      console.log("this.codeInfo", this.codeInfo);
    },
    // 一次性解绑当前三证
    async handleDeleteCurrent() {
      console.log("this.codeInfo", this.codeInfo);

      console.log(
        "this.codeInfo.cardInfoCode.IDCARDINFO_ID",
        this.codeInfo.cardInfoCode.IDCARDINFO_ID
      );
      const codeCarInfo = await this.$api.$get(
        "/EShangApiMain/Member/DeleteIDCARDINFO",
        {
          IDCARDINFOId: this.codeInfo.cardInfoCode.IDCARDINFO_ID,
        }
      );
      if (codeCarInfo.Result_Code !== 100) {
        uni.showToast({
          title: "删除失败！",
          icon: "none",
        });
        return false;
      }

      console.log(
        "this.codeInfo.drivingInfo.DRIVERLICENSE_ID",
        this.codeInfo.drivingInfo.DRIVERLICENSE_ID
      );
      const drivingInfo = await this.$api.$get(
        "/EShangApiMain/Member/DeleteDRIVERLICENSE",
        {
          DRIVERLICENSEId: this.codeInfo.drivingInfo.DRIVERLICENSE_ID,
        }
      );
      if (drivingInfo.Result_Code !== 100) {
        uni.showToast({
          title: "删除失败！",
          icon: "none",
        });
        return false;
      }
      console.log(
        "this.codeInfo.vehicleInfo.VEHICLELICENSE_ID",
        this.codeInfo.vehicleInfo.VEHICLELICENSE_ID
      );

      const vehicleInfo = await this.$api.$get(
        "/EShangApiMain/Member/DeleteVEHICLELICENSE",
        {
          VEHICLELICENSEId: this.codeInfo.vehicleInfo.VEHICLELICENSE_ID,
        }
      );
      if (vehicleInfo.Result_Code !== 100) {
        uni.showToast({
          title: "删除失败！",
          icon: "none",
        });
        return false;
      }
      return true;
    },
    // 改变车的能源类型
    handleChangeCarType() {
      if (this.haveCode) {
        uni.showToast({
          title: "已有关联车辆！如需修改请先解绑",
          icon: "none",
          duration: 2000,
        });
        return;
      } else {
        this.newEnergy = !this.newEnergy;
      }
    },
    inputChange(value) {
      console.log('inputChangeinputChangeinputChangeinputChangeinputChange', value);

      let index = this.nowIndex;
      this.saveCarText[index] = value;
      let next = index + 1;
      if (this.carType === 1) {
        if (next < 7) {
          this.nowIndex = next;
        }
      } else {
        if (next < 8) {
          this.nowIndex = next;
        }
      }

      console.log('inputChangeinputChangeinputChangeinputChangeinputChange', this.nowIndex);
      if (this.nowIndex >= 1) {
        this.defaultKeyWordType = 2;
      } else {
        this.defaultKeyWordType = 1;
      }

      this.$forceUpdate();
    },
    delValue() {
      let index = this.nowIndex;

      this.saveCarText[index] = "";
      let next = index - 1;

      if (next > -1) {
        this.nowIndex = next;
      }

      if (this.nowIndex >= 1) {
        this.defaultKeyWordType = 2;
      } else {
        this.defaultKeyWordType = 1;
      }

      this.$forceUpdate();
    },
    confirmboard() {
      this.isShow = false;
    },
    focusInput(value) {
      console.log('focusInputfocusInputfocusInputfocusInputfocusInput', value);
      if (value === 7 && this.carType === 1) {
        return
      }

      // 判断第一个 有没有值 有值了的话 就显示数字键盘 没值的话 就显示中文键盘
      if (value === 0) {
        this.defaultKeyWordType = 1;
      } else {
        this.defaultKeyWordType = 2;
      }

      if (this.haveCode) {
        uni.showToast({
          title: "已有关联车辆！如需修改请先解绑",
          icon: "none",
          duration: 2000,
        });
        return;
      }
      this.isShow = true;
      this.nowIndex = value;
    },
    // 取消绑定
    async handleCancelCode() {
      let _this = this;
      let data = false;

      console.log('_this.cards_this.cards_this.cards', _this.cards);


      // if (this.bindCarType === 2) {
      //   this.isLoading = true;
      //   // 删除三个
      //   data = await this.handleDeleteCurrent();
      // } else {
      //   data = true;
      // }

      if (_this.cards && _this.cards.length > 0) {
        let obj = _this.cards[0];
        uni.showModal({
          title: "确认取消绑定？",
          content: "取消绑定后将无法恢复",
          success: async function (res) {
            if (res.confirm) {
              this.isLoading = true;
              // 删除三个
              data = await _this.handleDeleteCurrent();
              _this.$api
                .getCoop({
                  action_type: "UnbindVehicle",
                  MEMBERSHIPVEHICLE_ID: obj.MEMBERSHIPVEHICLE_ID,
                  LicensePlate: obj.License_Plate,
                  // Membership_Id: _this.user.MEMBERSHIP_ID,
                })
                .then((res) => {
                  _this.isLoading = false;
                  if (res.Result_Code === 100) {
                    // _this.IDCardImgList = [];
                    // _this.driverLicenseList = [];
                    // _this.drivingLicenseList = [];
                    _this.codeImgObj = {
                      frontIDCard: "", // 身份证正面
                      reverseIDcard: "", // 身份证反面
                      frontDriverCard: "", // 驾驶证正面
                      reverseDriverCard: "", // 驾驶证反面
                      frontLicenseCard: "", // 行驶证正面
                      reverseLicenseCard: "", // 行驶证反面
                    };
                    uni.showModal({
                      content: res.Result_Desc,
                      cancelColor: "#000000",
                      showCancel: false,
                      confirmText: "确定",
                      confirmColor: "#3CC51F",
                      success: (result) => {
                        _this.isShow = false;
                        _this.getList();
                      },
                    });
                  }
                });
            }
          },
        });
      } else {
        uni.showToast({
          title: "暂无关联车辆！",
          icon: "none",
          duration: 2000,
        });
        _this.isLoading = false;
      }
    },
    getList() {
      let _this = this;
      // uni.showLoading({ title: "加载中" });
      _this.isLoading = true;
      this.$api
        .getCoop({
          action_type: "GetVehicleList",
        })
        .then((res) => {
          console.log('GetVehicleListGetVehicleListGetVehicleList', res);
          console.log('_this.user_this.user_this.user_this.user_this.user', _this.user);


          _this.isLoading = false;
          _this.cards = res.Result_Data.List;
          if (_this.cards && _this.cards.length > 0) {
            let obj = _this.cards[0];
            let code = obj.License_Plate;
            let imgObj = JSON.parse(obj.ImageInfo);
            _this.codeImgObj = imgObj;
            if (obj.VehicleType === '新能源') {
              _this.carType = 2;
            }
            // _this.IDCardImgList = imgObj.IDCardImgList;
            // _this.driverLicenseList = imgObj.driverLicenseList;
            // _this.drivingLicenseList = imgObj.drivingLicenseList;
            _this.saveCarText = code.split("");
            _this.haveCode = true;
          } else {
            _this.saveCarText = ["皖", "A", "", "", "", "", "", ""];
            _this.haveCode = false;
          }
          // uni.hideLoading();

          _this.isLoading = false;
        });
    },
    toAdd() {
      uni.navigateTo({ url: "/pages/homeFn/bindingCar/index" });
    },
  },
  onShow() { },
  async onLoad() {
    this.isLoading = true;
    this.getList();
    await this.handleSearchCurrentList();
    this.$utils.addUserBehaviorNew();
  },
};
</script>

<style lang="less" scoped>
.main {
  width: 100%;
  min-height: 100vh;
  background: #f5f5f5;
  padding-bottom: 40rpx;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);

  .topMessage {
    width: 100%;
    height: 292rpx;
    background: linear-gradient(270deg, #727377 0%, #424448 100%);
    box-sizing: border-box;
    padding: 48rpx 32rpx;
    position: relative;

    .messageTitle {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 32rpx;
      color: #ffffff;
      line-height: 44rpx;
      text-align: left;
      font-style: normal;
    }

    .messageList {
      width: 100%;
      margin-top: 16rpx;

      .messageText {
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #b8b7b4;
        line-height: 36rpx;
        text-align: left;
        font-style: normal;
        margin-bottom: 4rpx;
      }
    }

    .carLogo {
      position: absolute;
      right: 12rpx;
      bottom: 0;
      width: 240rpx;
      height: 240rpx;
      opacity: 0.8;
    }
  }

  .codeBox {
    width: calc(100% - 64rpx);
    height: 206rpx;
    background: #ffffff;
    border-radius: 10rpx;
    margin-left: 32rpx;
    box-sizing: border-box;
    padding: 28rpx 32rpx;

    .carTypeChange {
      width: 100%;
      height: 30rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;

      .carTypeLeft {
        .typeName {
          font-weight: 400;
          font-size: 30rpx;
          color: #000000;
          text-align: left;
          font-style: normal;
        }
      }

      .carTypeRight {
        display: flex;
        align-items: center;
        justify-content: flex-end;

        .changeIcon {
          width: 24rpx;
          height: 24rpx;
          margin-right: 8rpx;
        }

        .carType {
          color: #ba922f;
          font-family: "PingFangSC";
          font-weight: 400;
          font-size: 24rpx;
          color: #0077FF;
          text-align: left;
          font-style: normal;
        }
      }


    }

    .input-box {
      display: flex;
      align-items: center;
      margin-top: 24rpx;

      .input-f {
        text-align: center;
        width: 72rpx;
        height: 72rpx;
        box-sizing: border-box;
        border-radius: 5rpx;
        line-height: 72rpx;
        position: relative;
        border: 1rpx solid #e7e7e6;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 8rpx;

        .show-input {
          font-size: 34rpx;
        }

        .disabledBox {
          display: flex;
          align-items: center;
          justify-content: center;
        }

        .disabled {
          background-color: #F6F6F6;
        }

        .text-sm {
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 20rpx;
          color: #716f69;
          line-height: 28rpx;
          text-align: left;
          font-style: normal;
        }

        .text-tip-btn {
          text-align: center;
          width: 74rpx;
          height: 74rpx;
          border: 1rpx dashed #ededed;
          border-radius: 5rpx;
          background: #f8f8f8;
          line-height: 70rpx;
        }
      }

      .cccBg {
        background: #f5f6f7;
      }

      .orangeRedBorder {
        border: 1px solid #07C160;
      }

      .lastBox {
        background: #f5f6f7;
        border-radius: 2rpx;
        border: 1rpx dashed #e7e7e6 !important;
      }

      .input-f:nth-last-child(1) {
        margin-right: 0;
      }
    }
  }

  .confirmBox {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 32rpx;
    // height: 88rpx;
    padding: 14rpx 0;
    color: #ffffff;
    line-height: 44rpx;
    text-align: center;
    font-style: normal;
    width: calc(100% - 64rpx);
    margin-left: 32rpx;
    background: #07C160;
    border-radius: 10rpx;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .cancelBox {
    font-family: "PingFangSC";
    font-weight: 400;
    font-size: 32rpx;
    height: 88rpx;
    color: #b8b7b4;
    line-height: 44rpx;
    text-align: center;
    font-style: normal;
    width: calc(100% - 64rpx);
    margin-left: 32rpx;
    background: #ffffff;
    border-radius: 6rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b8b7b4;
    margin-top: 24rpx;
  }

  .bindPopup {
    width: 100%;
    box-sizing: border-box;
    padding: 0 32rpx;
    border-top-left-radius: 32rpx;
    border-top-right-radius: 32rpx;
    padding-bottom: env(safe-area-inset-bottom);

    .popupTitle {
      font-weight: 400;
      font-size: 32rpx;
      color: #000000;
      text-align: left;
      font-style: normal;
      text-transform: none;
      margin-bottom: 20rpx;
    }


    .fileItem {
      margin-bottom: 24rpx;
      background-color: #fff;
      box-sizing: border-box;
      padding: 26rpx 32rpx;
      border-radius: 10rpx;

      .itemTitle {
        font-family: "PingFangSC";
        font-weight: 400;
        font-size: 28rpx;
        line-height: 44rpx;
        text-align: left;
        font-style: normal;
        margin-bottom: 16rpx;
      }

      .newUploadImgBox {

        .imgItem {
          width: 100%;
          box-sizing: border-box;
          padding: 20rpx 22rpx;
          background: #F6F6F6;
          border-radius: 6rpx;
          display: flex;
          align-items: center;
          justify-content: space-between;

          .leftText {
            font-weight: 400;
            font-size: 26rpx;
            color: rgba(0, 0, 0, 0.3);
            text-align: left;
            font-style: normal;
            text-transform: none;
          }

          .rightBox {
            display: flex;
            align-items: center;

            .rightText {
              font-weight: 400;
              font-size: 24rpx;
              color: #07C160;
              text-align: right;
              font-style: normal;
              text-transform: none;
            }

            .rightIcon {
              width: 20rpx;
              height: 20rpx;
              margin-left: 10rpx;
            }
          }
        }

      }


      .uploadImgBox {
        width: 100%;
        margin-top: 16rpx;
        display: flex;
        align-items: center;
        flex-wrap: wrap;

        .submitImgBox {
          width: 200rpx;
          height: 200rpx;
          background: #fff;
          border-radius: 8rpx;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          margin-right: 32rpx;

          .addIcon {
            width: 40rpx;
            height: 40rpx;
            color: #b4b5ba;
            margin-bottom: 24rpx;
          }

          .submitText {
            font-size: 22rpx;
            color: #b4b5ba;
          }
        }

        .imgItem {
          width: 200rpx;
          height: 200rpx;
          margin-right: 32rpx;
          position: relative;
          border-radius: 8rpx;
          overflow: hidden;

          image {
            width: 100%;
            height: 100%;
          }

          .closeBox {
            width: 32rpx;
            height: 32rpx;
            border-radius: 0rpx 8rpx 0rpx 8rpx;
            background: rgba(6, 10, 25, 0.5);
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            top: 0;
            right: 0;

            .closeIcon {
              width: 24rpx;
              height: 24rpx;
            }
          }
        }
      }
    }
  }

  .bindTypeBox {
    width: 100%;
    box-sizing: border-box;
    padding: 0 32rpx;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 8px;

    .bindTrain {
      font-family: "PingFangSC";
      font-weight: 400;
      font-size: 30rpx;
      line-height: 36rpx;
      color: #ba922f;
      text-align: left;
      font-style: normal;
    }
  }
}

page {
  background: #fff;
}

.title {
  color: #333333;
  padding-bottom: 36rpx;
  padding-left: 28rpx;
  padding-top: 43rpx;
}

.banner {
  height: 500rpx;
}

.car-card-add {
  width: 502rpx;
  height: 246rpx;
  background: #ffffff;
  border-radius: 8rpx;
  box-shadow: 0rpx 2rpx 8rpx 0rpx rgba(221, 221, 221, 0.48);
}

.car-card {
  position: relative;
  padding-left: 35rpx;
  padding-top: 33rpx;
  width: 534rpx !important;
  height: 285rpx;

  // margin-left 26rpx
  image {
    width: 534rpx;
    height: 285rpx;
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
  }

  .card-title {
    background: linear-gradient(#f3e6dd, #e5ba9f);
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    font-size: 36rpx;
    font-weight: bolder;
  }
}

.pic-image {
  width: 482rpx;
  height: 281rpx;
  margin-left: 128rpx;
  margin-right: 140rpx;
  margin-top: 138rpx;
  margin-bottom: 54rpx;
}

.tip-text {
  text-align: center;
}

.add-car {
  color: #b0b0b0;
  width: 504rpx;
  height: 145rpx;
  background: #f8f8f8;
  border: 1rpx dashed #c3c3c3;
  border-radius: 5rpx;
  display: flex;
  align-items: center;
  flex-direction: column;
  margin: 83rpx auto;
  font-size: 24rpx;
  justify-content: center;
  line-height: 1.5;
}

.uploadBox {
  width: calc(100vw - 64rpx);
  box-sizing: border-box;
  padding: 32rpx;
  background-color: #fff;
  border-radius: 10rpx;
  position: relative;

  .closeIcon {
    width: 40rpx;
    height: 40rpx;
    position: absolute;
    top: 20rpx;
    right: 20rpx;
  }

  .uploadTitle {
    font-weight: 400;
    font-size: 28rpx;
    color: #000000;
    text-align: center;
    font-style: normal;
    text-transform: none;
  }

  .imgBox {
    width: 100%;
    height: calc(100vw - 64rpx);
    border-radius: 10rpx;
    margin-top: 42rpx;
    // background: #E8E8E8;
    background-repeat: no-repeat;
    background-size: contain;

  }

  .uploadAgain {
    width: 100%;
    border-radius: 10rpx;
    background-color: #07C160;
    box-sizing: border-box;
    padding: 14rpx;
    font-weight: 400;
    font-size: 30rpx;
    color: #FFFFFF;
    text-align: center;
    font-style: normal;
    text-transform: none;
    margin-top: 36rpx;
  }

}
</style>