<template>
  <view>
    <scroll-view scroll-y="true" style="height: 95vh">
      <view v-if="isPageShow">
        <page-container
          :show="isPageShow"
          :duration="0"
          :overlay="false"
          @beforeleave="onBeforeleave"
        ></page-container>
      </view>
      <view class="container">
        <u-collapse
          :value="['basic', 'truck', 'pic', 'explain', 'sign']"
          :border="false"
        >
          <u-collapse-item title="基本信息" name="basic">
            <view class="item">
              <view class="title">合同编号</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.contractNo"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">项目名称</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.projectName"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">客户名称</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.customerName"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">客户联系人</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.customerContactName"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">客户联系人手机</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.customerContactPhone"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">销售经理</view>
              <u--input
                border="surround"
                :value="
                  getSalesManagerName(
                    datas.contractSimple && datas.contractSimple.businessManager
                  )
                "
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">授权人</view>
              <u-picker
                :show="showAuthorizerPicker"
                :columns="[contractAuthorizerInformationList]"
                keyName="authorizer"
                @change="changeAuthorizer"
                :immediateChange="true"
                @confirm="confirmAuthorizer"
                @cancel="showAuthorizerPicker = false"
              >
              </u-picker>
              <u--input
                border="surround"
                :value="datas.takeName"
                :disabledColor="disabled ? '#f5f7fa' : '#ffffff'"
                disabled
                fontSize="26"
                @tap="!isRead && !hasSign && (showAuthorizerPicker = true)"
              >
              </u--input>
            </view>
            <view class="item">
              <view class="title">授权人联系电话</view>
              <u--input
                border="surround"
                :value="datas.takePhone"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">授权人身份证</view>
              <u--input
                border="surround"
                :value="datas.takeIdNo"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">交车区域</view>
              <u--input
                border="surround"
                v-model="datas.contractSimple.deliveryAreaName"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title required">驾驶培训</view>
              <u-picker
                :show="showIsDrivingTrainingPicker"
                :columns="[yesNoDic]"
                keyName="dicName"
                :immediateChange="true"
                @confirm="confirmIsDrivingTraining"
                @cancel="showIsDrivingTrainingPicker = false"
              >
              </u-picker>
              <u--input
                border="surround"
                :disabledColor="disabled ? '#f5f7fa' : '#ffffff'"
                disabled
                fontSize="26"
                :value="getYesNoName(datas.isDrivingTraining)"
                @tap="!disabled && (showIsDrivingTrainingPicker = true)"
              >
              </u--input>
            </view>
          </u-collapse-item>
          <u-collapse-item title="交车信息" name="truck">
            <view class="item">
              <view class="title">车牌号</view>
              <u-picker
                :show="showPlateNumberPicker"
                :columns="[inStoreList]"
                keyName="plateNumber"
                :immediateChange="true"
                @confirm="confirmPlateNumber"
                @cancel="showPlateNumberPicker = false"
              >
              </u-picker>
              <u-input
                border="surround"
                :value="datas.truckSimple.plateNumber"
                :disabledColor="platNumberDisabled ? '#f5f7fa' : '#ffffff'"
                disabled
                fontSize="26"
                :customStyle="{
                  paddingTop: '0',
                  paddingBottom: '0',
                  paddingRight: '0',
                }"
                @tap="!platNumberDisabled && searchPlatNumber()"
              >
                <template slot="suffix">
                  <button
                    class="changeCarBtn"
                    :disabled="disabled"
                    @tap.stop="enbalbeChangeTruck"
                  >
                    换车
                  </button>
                </template>
              </u-input>
            </view>
            <view class="item">
              <view class="title">品牌</view>
              <u--input
                border="surround"
                :value="
                  getBrandName(datas.truckSimple && datas.truckSimple.brand)
                "
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">车型</view>
              <u--input
                border="surround"
                :value="
                  getModelName(datas.truckSimple && datas.truckSimple.model)
                "
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title">换车备注</view>
              <u--input
                border="surround"
                v-model="datas.changeRemark"
                fontSize="26"
                :disabled="disabled"
              ></u--input>
            </view>
            <view class="item">
              <view class="title required">交车里程</view>
              <u-input
                border="surround"
                v-model="datas.takeMileage"
                type="digit"
                fontSize="26"
                :disabled="disabled"
              >
                <template slot="suffix">
                  <text class="unit">km</text>
                </template>
              </u-input>
            </view>
            <view class="item">
              <view class="title required">交车电量</view>
              <u-input
                border="surround"
                v-model="datas.electricity"
                type="digit"
                fontSize="26"
                :disabled="disabled"
              >
                <template slot="suffix">
                  <text class="unit">%</text>
                </template>
              </u-input>
            </view>
            <view class="item">
              <view class="title required">交车氢量</view>
              <u-input
                border="surround"
                v-model="datas.hydrogenMeasure"
                type="digit"
                :disabled="disabled"
                fontSize="26"
                :customStyle="{
                  paddingTop: '0',
                  paddingBottom: '0',
                  paddingRight: '0',
                }"
              >
                <template slot="suffix">
                  <uni-section type="line">
                    <uni-data-select
                      v-model="datas.hydrogenUnit"
                      placeholder="请选择"
                      :localdata="range"
                      @change="change"
                      :disabled="disabled"
                    ></uni-data-select>
                  </uni-section>
                </template>
              </u-input>
            </view>
            <view class="item">
              <view class="title">交车地点</view>
              <u--input
                border="surround"
                v-model="datas.handoverAddressName"
                disabled
                fontSize="26"
              ></u--input>
            </view>
            <view class="item">
              <view class="title required">交车时间</view>
              <u-datetime-picker
                :show="showHandoverDatePicker"
                mode="datetime"
                @confirm="confirmHandoverDate"
                @cancel="showHandoverDatePicker = false"
              ></u-datetime-picker>
              <u--input
                border="surround"
                :disabledColor="disabled ? '#f5f7fa' : '#ffffff'"
                disabled
                fontSize="26"
                :value="formatDateTime(datas.handoverDate, 'hour')"
                @tap="!disabled && (showHandoverDatePicker = true)"
              >
              </u--input>
            </view>
            <view class="item">
              <view class="title">送车服务费</view>
              <u-input
                border="surround"
                v-model="datas.deliveryServiceFee"
                @blur="formatToFixed"
                :disabled="disabled"
                type="digit"
                fontSize="26"
              >
                <template slot="suffix">
                  <text class="unit">元</text>
                </template>
              </u-input>
            </view>
            <view class="item">
              <button class="btn checkList required" @tap="openCheckListPopup">
                交车检查单
              </button>
            </view>
          </u-collapse-item>
          <u-collapse-item ref="uploadCollapse" title="照片上传" name="pic">
            <view class="item">
              <view class="title required">仪表盘照片</view>
              <u-upload
                :fileList="fileList1"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="2"
                multiple
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="1"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">正面照片</view>
              <u-upload
                :fileList="fileList2"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="1"
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="2"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">左前方照片</view>
              <u-upload
                :fileList="fileList3"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="1"
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="3"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">右前方照片</view>
              <u-upload
                :fileList="fileList4"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="1"
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="4"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">左后方照片</view>
              <u-upload
                :fileList="fileList5"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="1"
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="5"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">右后方照片</view>
              <u-upload
                :fileList="fileList6"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="1"
                :width="200"
                :height="200"
                :disabled="disabled"
                :deletable="!disabled"
                name="6"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title">瑕疵照片</view>
              <u-upload
                :fileList="fileList7"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="10"
                multiple
                :width="155"
                :height="155"
                :disabled="disabled"
                :deletable="!disabled"
                name="7"
              ></u-upload>
            </view>

            <view class="item">
              <view class="title">轮胎照片</view>
              <u-upload
                :fileList="fileList8"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="20"
                multiple
                :width="155"
                :height="155"
                :disabled="true"
                :deletable="!disabled"
                name="8"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">轮胎照片</view>
              <view class="flexBox" v-if="datas.truckSimple.tireNumber == 6">
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList15"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="15"
                  ></u-upload>
                  <view class="title">左前轮</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList16"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="16"
                  ></u-upload>
                  <view class="title">左后轮(内)</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList17"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="17"
                  ></u-upload>
                  <view class="title">左后轮(外)</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList18"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="18"
                  ></u-upload>
                  <view class="title">右前轮</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList19"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="19"
                  ></u-upload>
                  <view class="title">右后轮(内)</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList20"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="20"
                  ></u-upload>
                  <view class="title">右后轮(外)</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList21"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="21"
                  ></u-upload>
                  <view class="title">备胎</view>
                </view>
              </view>
              <view
                class="flexBox"
                v-else-if="
                  datas.truckSimple.tireNumber == 10 ||
                  datas.truckSimple.tireNumber == 12
                "
              >
                <template v-if="datas.truckSimple.tireNumber == 10">
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList15"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="15"
                    ></u-upload>
                    <view class="title">左前轮</view>
                  </view>
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList18"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="18"
                    ></u-upload>
                    <view class="title">右前轮</view>
                  </view>
                </template>
                <template v-else-if="datas.truckSimple.tireNumber == 12">
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList36"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="36"
                    ></u-upload>
                    <view class="title">左前外</view>
                  </view>
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList37"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="37"
                    ></u-upload>
                    <view class="title">左前内</view>
                  </view>
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList38"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="38"
                    ></u-upload>
                    <view class="title">右前外</view>
                  </view>
                  <view class="flexItem">
                    <u-upload
                      :fileList="fileList39"
                      @afterRead="afterRead"
                      @delete="deletePic"
                      :width="155"
                      :height="155"
                      :maxCount="1"
                      :disabled="disabled"
                      :deletable="!disabled"
                      name="39"
                    ></u-upload>
                    <view class="title">右前内</view>
                  </view>
                </template>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList22"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="22"
                  ></u-upload>
                  <view class="title">左中内</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList23"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="23"
                  ></u-upload>
                  <view class="title">左中外</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList24"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="24"
                  ></u-upload>
                  <view class="title">左后内</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList25"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="25"
                  ></u-upload>
                  <view class="title">左后外</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList26"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="26"
                  ></u-upload>
                  <view class="title">右中内</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList27"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="27"
                  ></u-upload>
                  <view class="title">右中外</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList28"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="28"
                  ></u-upload>
                  <view class="title">右后内</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList29"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="29"
                  ></u-upload>
                  <view class="title">右后外</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList21"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="21"
                  ></u-upload>
                  <view class="title">备胎</view>
                </view>
              </view>
            </view>
            <view class="item">
              <view class="title required">底盘照片</view>
              <view class="flexBox">
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList30"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="30"
                  ></u-upload>
                  <view class="title">正前方底部</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList31"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="31"
                  ></u-upload>
                  <view class="title">左侧前部底部</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList32"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="32"
                  ></u-upload>
                  <view class="title">左侧后方底部</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList33"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="33"
                  ></u-upload>
                  <view class="title">右侧前方底部</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList34"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="34"
                  ></u-upload>
                  <view class="title">右侧后方底部</view>
                </view>
                <view class="flexItem">
                  <u-upload
                    :fileList="fileList35"
                    @afterRead="afterRead"
                    @delete="deletePic"
                    :width="155"
                    :height="155"
                    :maxCount="1"
                    :disabled="disabled"
                    :deletable="!disabled"
                    name="35"
                  ></u-upload>
                  <view class="title">正后方底部</view>
                </view>
              </view>
            </view>
            <view class="item">
              <view class="title">其它</view>
              <u-upload
                :fileList="fileList9"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="10"
                multiple
                :width="155"
                :height="155"
                :disabled="disabled"
                :deletable="!disabled"
                name="9"
              ></u-upload>
            </view>
          </u-collapse-item>
          <u-collapse-item
            ref="giveCarCollapse"
            title="交车说明"
            name="explain"
          >
            <view class="item">
              <view class="title">备注</view>
              <u--textarea
                border="surround"
                v-model="datas.remark"
                fontSize="26"
                :disabled="disabled"
              ></u--textarea>
            </view>
            <view class="item">
              <view class="title required">培训文件签字照片</view>
              <u-upload
                :fileList="fileList12"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="10"
                multiple
                :width="155"
                :height="155"
                :disabled="disabled"
                :deletable="!disabled"
                name="12"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title required">司机证件</view>
              <u-upload
                :fileList="fileList10"
                @afterRead="afterRead"
                @delete="deletePic"
                :maxCount="10"
                multiple
                :width="155"
                :height="155"
                :disabled="disabled"
                :deletable="!disabled"
                name="10"
              ></u-upload>
            </view>
            <view class="item">
              <view class="title">安全培训照片</view>
              <u-upload
                :fileList="fileList13"
                @afterRead="afterRead"
                multiple
                @delete="deletePic"
                :disabled="_disabled"
                :deletable="!_disabled"
                :width="155"
                :height="155"
                name="13"
              ></u-upload>
              <!-- :disabled="disabled"
              :deletable="!disabled" -->
            </view>
            <view class="item">
              <view class="title">安全培训附件</view>
              <view class="block">
                <view class="item">
                  <u-upload
                    :fileList="fileList14"
                    @afterRead="afterReadPdf"
                    @delete="deletePic"
                    uploadIcon="plus"
                    :deletable="!_disabled"
                    accept="all"
                    :disabled="_disabled"
                    multiple
                    :width="155"
                    :height="155"
                    name="14"
                  ></u-upload>
                </view>
                <view class="item" v-for="item in yyPdfList" :key="item.url">
                  <view class="line" style="justify-content: space-between">
                    <view class="text-small left">{{ item.name }}</view>
                    <view class="text-small" @tap="previewYyPdf(item)"
                      >预览</view
                    >
                  </view>
                </view>
              </view>
            </view>
            <view class="item" v-if="isShowOption">
              <view class="title">审批意见</view>
              <u--textarea
                border="surround"
                :disabled="currRole !== 2 || !isSafe"
                v-model="datas.auditOpinion"
                fontSize="26"
              ></u--textarea>
            </view>
          </u-collapse-item>
          <u-collapse-item title="签收栏" name="sign">
            <view class="item">
              <button
                class="btn sign"
                :class="{ disabled: disabled }"
                :disabled="disabled"
                @tap="generateWord"
              >
                点击签名
              </button>
              <button
                v-if="clearButton"
                class="btn sign"
                style="
                  background-color: #fff;
                  color: #7ba746;
                  border: 1px solid #7ba746;
                "
                :class="{ disabled: disabled }"
                :disabled="disabled"
                @tap="clearSign"
              >
                清除签名信息
              </button>
            </view>
            <view class="item">
              <button
                class="btn genDocument"
                :class="{ disabled: disabled }"
                :disabled="disabled"
                @tap="fileDownloadUrl"
              >
                生成签署文件
              </button>
            </view>
            <view class="item">
              <u-upload
                :fileList="fileList11"
                @afterRead="afterRead"
                @delete="deletePic"
                uploadIcon="plus"
                :disabled="true"
                :deletable="false"
                :previewFullImage="false"
                @tap="previewPdf"
                :maxCount="1"
                :width="155"
                :height="155"
                name="11"
              ></u-upload>
            </view>
          </u-collapse-item>
        </u-collapse>

        <u-loading-page
          bg-color="#ffffff"
          color="#7ba746"
          font-size="24"
          :loading="loading"
          :loading-text="loadingText"
        ></u-loading-page>

        <!-- <page-container
            :show="checkListShow"
            :duration="0"
            :overlay="false"
            @beforeleave="checkListShow = false"
          > -->
        <u-popup :show="checkListShow" mode="right">
          <scroll-view scroll-y="true" style="height: 95vh">
            <!-- 编辑模式 -->
            <no-bad-table
              :columns="columns"
              :list="formDataList"
              :spanArr="spanArr"
              :isRead="disabled"
              :slot-cols="['dataCategory', 'dataName', 'takeTruck', 'remark']"
              :span-method="objectSpanMethod"
            >
              <template v-slot="{ row, col, index, isRead }">
                <view
                  v-if="col.key == 'dataCategory'"
                  style="white-space: pre-wrap"
                >
                  {{ row.dataCategory }}
                </view>
                <view
                  v-else-if="col.key == 'dataName'"
                  style="white-space: pre-wrap"
                >
                  {{ row.dataName }}
                </view>
                <view
                  v-else-if="col.key == 'takeTruck'"
                  style="display: flex; justify-content: center"
                >
                  <u-switch
                    size="50"
                    v-if="row.dataType != 3"
                    v-model="row.takeTruck"
                    @change="switchTakeTruck(index)"
                    :disabled="isRead"
                    inactiveColor="#f5f7fa"
                    activeColor="#7ba746"
                  >
                  </u-switch>
                  <u--input
                    border="surround"
                    fontSize="26"
                    v-else
                    :value="row.takeTruck"
                    :disabled="isRead"
                    @change="inputTakeTruck($event, index)"
                  >
                  </u--input>
                </view>
                <view
                  v-else-if="col.key == 'remark' && !row.notUpdate"
                  style="display: flex; justify-content: center"
                >
                  <u--input
                    border="surround"
                    fontSize="26"
                    v-if="row.dataType != 3"
                    :value="row.remark"
                    :disabled="isRead"
                    @change="inputQuality($event, index)"
                  >
                  </u--input>
                </view>
              </template>
            </no-bad-table>
            <view class="btns">
              <button
                class="save"
                :class="{ disabled: disabled }"
                :disabled="disabled"
                @tap="saveFormDataList"
              >
                保存
              </button>
              <button class="cancel" @tap="cancelFormDataChange">取消</button>
            </view>
          </scroll-view>
        </u-popup>
        <!-- </page-container> -->

        <view class="btns">
          <button v-if="currRole === 2 && isSafe" class="done" @tap="passTap">
            通过
          </button>
          <button v-if="currRole === 2 && isSafe" class="done" @tap="rejectTap">
            驳回
          </button>
          <!-- currRole2安全经理1安全员 -->
          <button
            v-if="currRole !== 2"
            class="done"
            :class="{ disabled: isRead && !isSafe }"
            :disabled="isRead && !isSafe"
            @tap="submitConfirm"
          >
            提交
          </button>
          <button
            v-if="currRole === 0"
            class="done"
            :class="{ disabled: isRead }"
            :disabled="isRead"
            @tap="save(false)"
          >
            保存
          </button>
          <button class="cancel" @tap="navigateBack">取消</button>
        </view>
        <view style="width: 0px; height: 0px; overflow: hidden">
          <canvas
            :style="
              'width: ' +
              canvasWidth +
              'px; height:' +
              canvasHeight +
              'px;left:8888px'
            "
            canvas-id="myCanvas"
          ></canvas>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<script>
import { getUser } from "@/utils/auth.js";
import { checkButtonPermission } from "@/utils/permission.js";
import FileManager from "@/utils/fileManager.js";
export default {
  options: {
    styleIsolation: "shared", // 解除样式隔离
  },

  data() {
    return {
      value: null,
      checkListShow: false, // 检查单弹窗
      spanArr: [],
      columns: [
        {
          title: "检查类别",
          key: "dataCategory",
        },
        {
          title: "检查项目",
          key: "dataName",
        },
        {
          title: "是否拥有/检查",
          key: "takeTruck",
        },
        {
          title: "数量/备注",
          key: "remark",
        },
      ],
      range: [
        { value: 1, text: "%" },
        { value: 2, text: "MPa" },
        { value: 3, text: "kg" },
      ],
      datas: {
        contractNo: "合同编号",
        projectName: "项目名称",
        isDrivingTraining: 0,
        dataList: [], // 交车单数据
        hydrogenUnit: null,
        handoverAddressName: "",
        handoverAddress: "", // 交车地址
        deliveryServiceFee: "", // 送车服务费
      },
      DrivingTrainingRange: [
        { value: 0, text: "否" },
        { value: 1, text: "是" },
      ],
      id: "1062294605097091072",
      brands: [], // 车辆品牌字典列表
      truckType: [], // 车辆型号字典列表,
      salesManagerDic: [], // 销售经理字典列表
      yesNoDic: [],
      userInfo: {}, // 用户信息
      contractAuthorizerInformationList: [], // 授权人列表
      inStoreList: [], // 在库状态车辆列表
      showAuthorizerPicker: false,
      showIsDrivingTrainingPicker: false,
      showHandoverDatePicker: false,
      platNumberDisabled: true,
      showPlateNumberPicker: false,
      fileList1: [], // 仪表盘照片
      fileList2: [], // 正面照片
      fileList3: [], // 左前方照片
      fileList4: [], // 右前方照片
      fileList5: [], // 左后方照片
      fileList6: [], // 右后方照片
      fileList7: [], // 瑕疵照片
      fileList8: [], // 轮胎照片
      fileList9: [], // 其它
      fileList10: [], // 司机证件
      fileList11: [], // 电子文档
      fileList12: [], // 培训文件签字照片、
      fileList13: [], // 安全培训照片
      fileList14: [], // 安全培训附件
      fileList15: [], // 左前轮照片 leftFrontTirePic
      fileList16: [], // 左后轮(内) leftRearTirePicIn
      fileList17: [], // 左后轮(外) leftRearTirePicOut
      fileList18: [], // 右前轮 rightFrontTirePic
      fileList19: [], // 右后轮(内) rightRearTirePicIn
      fileList20: [], // 右后轮(外) rightRearTirePicOut
      fileList21: [], // 备胎 spareTirePic
      //后面49T
      fileList22: [], // 左中内 leftMiddleTirePicIn
      fileList23: [], // 左中外 leftMiddleTirePicOut
      fileList24: [], // 左后内 leftRearMiddleTirePicIn
      fileList25: [], // 左后外 leftRearMiddleTirePicOut
      fileList26: [], // 右中内 rightMiddleTirePicIn
      fileList27: [], // 右中外 rightMiddleTirePicOut
      fileList28: [], // 右后内 rightRearMiddleTirePicIn
      fileList29: [], // 右后外 rightRearMiddleTirePicOut
      fileList30: [], // 正前方底部照片 frontBottomPic
      fileList31: [], // 左侧前部底部照片 leftFrontBottomPic
      fileList32: [], // 左侧后方底部照片 leftRearBottomPic
      fileList33: [], // 右侧前方底部照片 rightFrontBottomPic
      fileList34: [], // 右侧后方底部照片 rightRearBottomPic
      fileList35: [], // 正后方底部照片 rearBottomPic
      fileList36: [], // 左前外 leftFrontTirePicOut
      fileList37: [], // 左前内 leftFrontTirePicIn
      fileList38: [], // 右前外 rightFrontTirePicOut
      fileList39: [], // 右前内 rightFrontTirePicIn
      canvasWidth: 0,
      canvasHeight: 0,
      isRead: false, // 页面是否处于阅读模式
      isSafe: false, // 是否安全员/安全经理
      formDataList: [], // 交车检查单数据副本
      loading: false,
      loadingText: "加载中...",
      hasSign: false, // 已完成签名，签署文件已生成
      hasSaveCheckList: false, // 是否保存过交车检查单
      compressPicMap: new Map(), // 缩略图映射，key为原图，value为缩略图
      isPageShow: false, //用来控制是否显示返回拦截弹窗
      showClearTip: false, // 是否提示清除签名
      fileManager: new FileManager(), // 文件管理器实例
    };
  },
  computed: {
    // 大部分组件的禁用直接用 disabled：查看模式或者已完成签署
    disabled() {
      return this.isRead || this.hasSign;
    },
    //清除签名信息按钮
    clearButton: function () {
      return checkButtonPermission("clearSignInfo", "applicationForDelivery");
    },
    _disabled() {
      return this.disabled && (!this.isSafe || this.currRole === 2);
    },
    currRole() {
      const ids = this.userInfo?.roles?.map((item) => item.id) || [];
      if (ids.includes("1076403008717209600")) {
        return 2; //安全经理
      } else if (ids.includes("1012435145369616384")) {
        return 1; //安全员
      } else {
        return 0; //其他
      }
    },
    isShowOption() {
      return (
        this.currRole == 2 ||
        (this.currRole == 1 && this.datas?.safetyAuditStatus === 2)
      );
    },
    yyPdfList() {
      console.log("yypdf");
      console.log(this.fileList14);
      return this.fileList14;
      //   .filter(
      //     (item) => item.type == "file" || item.type == "pdf"
      //   )
    },
  },
  methods: {
    formatToFixed() {
      if (
        this.datas.deliveryServiceFee === "" ||
        this.datas.deliveryServiceFee == null
      )
        return;

      // 转为数字，保留两位小数，再转回字符串（避免科学计数法）
      const num = parseFloat(this.datas.deliveryServiceFee);
      if (!isNaN(num)) {
        this.$set(this.datas, "deliveryServiceFee", num.toFixed(2));
      } else {
        this.$set(this.datas, "deliveryServiceFee", "");
      }
    },
    clearSign() {
      uni.showModal({
        title: "提示",
        content: "确认清除签名信息吗?",
        success: (res) => {
          if (res.confirm) {
            this.$api.returnCar.clearSignInfo({ id: this.id }).then((res) => {
              if (res) {
                this.datas.signFlowId = null;
                uni.showToast({
                  title: "清除成功",
                  icon: "success",
                  duration: 1500,
                  success() {},
                });
              }
            });
          }
        },
      });
    },
    onBeforeleave() {
      this.isPageShow = false;
      if (this.checkListShow) {
        this.checkListShow = false;
        this.$nextTick(() => {
          this.isPageShow = true;
        });
      } else {
        uni.showModal({
          title: "离开提示",
          content: "请确认是否退出当前界面?",
          success: (res) => {
            if (res.confirm) {
              this.navigateBack();
            } else {
              this.isPageShow = true;
              console.log("用户点击取消");
            }
          },
        });
      }

      //   this.$nextTick(() => {
      //     this.isPageShow = true;
      //   });
      // this.isPageShow = false;
      //
      //   setTimeout(() => {
      //     this.isPageShow = true;
      //   }, 10);
    },
    getData() {
      this.$api.truckRent.getTakeId({ id: this.id }).then((res) => {
        // 避免出现额外的小数，"100.00" => 100
        res.takeMileage = res.takeMileage ? Number(res.takeMileage) : null;
        res.electricity = res.electricity ? Number(res.electricity) : null;
        res.hydrogenMeasure = res.hydrogenMeasure
          ? Number(res.hydrogenMeasure)
          : null;

        this.datas = res;
        const authorizerList = res.contractAuthorizerInformationList;
        this.contractAuthorizerInformationList = authorizerList;
        // 如果授权人列表只有一个授权人，默认填入
        if (authorizerList && authorizerList.length == 1) {
          this.datas.takeName = authorizerList[0].authorizer;
          this.datas.takeIdNo = authorizerList[0].authorizerIdentityCard;
          this.datas.takePhone = authorizerList[0].authorizerTelephone;
        }

        // 将底盘照片从对象格式转换为字符串格式，统一处理
        this.convertChassisPicsToString();

        // 根据后端相应的相关图片字段，重新得到fileList用于前端图片预览
        this.parseFileListBack();
        console.log("this.isRead");
        console.log(this.isRead);
        if (!this.isRead) {
          // 自动获取用户当前位置，填入 "交车地点" 字段中
          this.getLocation();
        }

        // formDataList为深度拷贝的一个对象，并不会直接影响到该车辆的交车检查单单信息
        this.formDataList = this.processFormDataList(
          this.deepClone(this.datas.dataList)
        );
        this.getSpanArr(this.formDataList);
      });
    },
    // 将底盘照片从对象格式转换为字符串格式
    convertChassisPicsToString() {
      const chassisPicKeys = [
        "frontBottomPic",
        "leftFrontBottomPic",
        "leftRearBottomPic",
        "rightFrontBottomPic",
        "rightRearBottomPic",
        "rearBottomPic",
      ];

      chassisPicKeys.forEach((key) => {
        const picData = this.datas[key];
        // 如果是对象格式，提取path作为字符串
        if (picData && typeof picData === "object" && picData.path) {
          this.datas[key] = picData.path;
        }
      });
    },
    goto(e) {
      uni.navigateTo({ url: e.target.dataset.url });
    },
    navigateBack() {
      this.isPageShow = false;
      setTimeout(() => {
        uni.navigateBack();
      }, 100);
    },
    formatDateTime(obj, type = "date") {
      if (obj == null) {
        return "";
      }
      // 精确到日
      if (type == "date") {
        let date = new Date(obj);
        let y = 1900 + date.getYear();
        let m = "0" + (date.getMonth() + 1);
        let d = "0" + date.getDate();
        return (
          y +
          "-" +
          m.substring(m.length - 2, m.length) +
          "-" +
          d.substring(d.length - 2, d.length)
        );
      }
      // 精确到小时和分钟
      else if (type == "hour") {
        const date = new Date(obj); // 将时间戳转换为毫秒
        const year = date.getFullYear();
        const month = String(date.getMonth() + 1).padStart(2, "0"); // 月份从0开始
        const day = String(date.getDate()).padStart(2, "0");
        const hour = String(date.getHours()).padStart(2, "0");
        const minute = String(date.getMinutes()).padStart(2, "0");
        return `${year}-${month}-${day}  ${hour}:${minute}`;
      }
    },
    getNowDateTime() {
      let currentTime = new Date();
      let year = currentTime.getFullYear();
      let month = currentTime.getMonth() + 1;
      let day = currentTime.getDate();
      let hours = currentTime.getHours();
      let minutes = currentTime.getMinutes();
      month = month < 10 ? "0" + month : month;
      day = day < 10 ? "0" + day : day;
      hours = hours < 10 ? "0" + hours : hours;
      minutes = minutes < 10 ? "0" + minutes : minutes;

      return `${year}-${month}-${day} ${hours}:${minutes}`;
    },
    getDic() {
      this.$api.standbyVehicle.getVehicleBrand().then((res) => {
        this.brands = res;
      });
      this.$api.standbyVehicle.getTruckType().then((res) => {
        this.truckType = res;
      });
      this.$api.truckRent.getSalesManagerDic().then((res) => {
        this.salesManagerDic = res;
      });
      this.$api.standbyVehicle.getYesNoDic().then((res) => {
        this.yesNoDic = res;
      });
    },
    getBrandName(dicCode) {
      return this.getDicValue(this.brands, dicCode);
    },
    getModelName(dicCode) {
      return this.getDicValue(this.truckType, dicCode);
    },
    getSalesManagerName(dicCode) {
      return this.getDicValue(this.salesManagerDic, dicCode);
    },
    getYesNoName(dicCode) {
      return this.getDicValue(this.yesNoDic, dicCode);
    },
    getDicValue(dic, dicCode) {
      if (dic.length == 0) {
        return "";
      }

      return dic.find((x) => x.dicCode == dicCode)?.dicName ?? "";
    },
    getInStoreList(plateNumber) {
      this.$api.truck.queryInStoreList({ plateNumber }).then((res) => {
        this.inStoreList = res;
        this.showPlateNumberPicker = true;
      });
    },
    changeAuthorizer() {
      if (this.datas.signFlowId) {
        this.showClearTip = true;
        //在修改签章人信息后记录一个信息被修改的标签,点击点击签名的时候验证标签如果是则提示先点击清除签名信息.
      }
    },
    confirmAuthorizer(e) {
      this.showAuthorizerPicker = false;
      this.datas.takeName = e.value[0].authorizer;
      this.datas.takeIdNo = e.value[0].authorizerIdentityCard;
      this.datas.takePhone = e.value[0].authorizerTelephone;
    },
    confirmIsDrivingTraining(e) {
      this.datas.isDrivingTraining = e.indexs[0];
      this.showIsDrivingTrainingPicker = false;
    },
    confirmHandoverDate(e) {
      console.log(e.value);
      if (e.value) {
        const selectedTime = new Date(e.value);
        const now = new Date();

        // 如果选择的日期是今天，检查时间是否超过当前时间
        if (selectedTime > now) {
          this.alert("交车时间不能大于当前时间");
          this.datas.handoverDate = now.getTime();
        } else {
          this.datas.handoverDate = e.value;
        }
      }
      this.showHandoverDatePicker = false;
    },
    confirmPlateNumber(e) {
      const truckId = e.value[0].id;
      this.$api.truckRent
        .validateTruckByIds({ contractId: this.datas.id, ids: truckId })
        .then((res) => {
          // 该车辆已被占用
          if (!res) {
            return;
          }

          this.datas.truckSimple = { ...e.value[0], truckId };
          this.datas.changeTruckId = truckId; // 指示后端，换了车辆id
          this.showPlateNumberPicker = false;

          // 换车后更新交车检查单
          this.$api.truckRent
            .getFormDataTemplate({
              tireNumber: this.datas.truckSimple.tireNumber,
            })
            .then((res) => {
              this.datas.dataList = res;
              this.formDataList = this.processFormDataList(
                this.deepClone(this.datas.dataList)
              );
              this.getSpanArr(this.formDataList);
            });
        });
    },
    enbalbeChangeTruck() {
      this.platNumberDisabled = false;
      this.searchPlatNumber();
    },
    searchPlatNumber() {
      uni.showModal({
        title: "车牌号关键字",
        confirmText: "搜索",
        editable: true,
        placeholderText: "请输入车牌号关键字用于检索",
        success: (res) => {
          res.confirm && this.getInStoreList(res.content);
        },
      });
    },
    getLocation() {
      uni.getLocation({
        type: "wgs84",
        success: (res) => {
          const longitude = res.longitude;
          const latitude = res.latitude;
          this.$api.truckRent
            .getAddress({ longitude, latitude })
            .then((res) => {
              this.datas.handoverAddressName = res?.data ?? "浙江省嘉兴市";
              this.datas.handoverAddress = res?.data ?? "浙江省嘉兴市";
            });
        },
        fail: (err) => {
          console.log(err);
          if (
            err.errMsg.includes("auth deny") ||
            err.errMsg.includes("auth denied")
          ) {
            // 判断是临时拒绝还是永久拒绝
            // 方法：调用 wx.getSetting 检查用户授权状态
            uni.getSetting({
              success: (res) => {
                console.log("getSetting", res);
                if (res.authSetting["scope.userLocation"] === false) {
                  let that = this;
                  // 返回 false 表示用户**永久拒绝**了授权
                  uni.showModal({
                    title: "定位权限被关闭",
                    content:
                      "您已关闭定位权限，无法获取位置。请前往设置页手动开启。",
                    confirmText: "去设置",
                    showCancel: true,
                    success: function (modalRes) {
                      if (modalRes.confirm) {
                        // 跳转到小程序设置页
                        uni.openSetting({
                          success: (settingRes) => {
                            // 用户在设置页修改了权限
                            if (settingRes.authSetting["scope.userLocation"]) {
                              // 权限已开启，重新获取位置
                              uni.getLocation({
                                type: "wgs84",
                                success: (locRes) => {
                                  console.log("重新获取位置成功:", locRes);
                                  const longitude = locRes.longitude;
                                  const latitude = locRes.latitude;
                                  that.$api.truckRent
                                    .getAddress({ longitude, latitude })
                                    .then((res) => {
                                      that.datas.handoverAddressName =
                                        res?.data ?? "浙江省嘉兴市";
                                      that.datas.handoverAddress =
                                        res?.data ?? "浙江省嘉兴市";
                                    });
                                },
                                fail: (locErr) => {
                                  console.log("重新获取位置失败:", locErr);
                                  uni.showToast({
                                    title: "仍未获取到位置",
                                    icon: "none",
                                  });
                                },
                              });
                            } else {
                              uni.showToast({
                                title: "请开启定位权限",
                                icon: "none",
                              });
                            }
                          },
                        });
                      }
                    },
                  });
                } else {
                  // 返回 undefined 表示未授权（可能是临时拒绝）
                  uni.showModal({
                    title: "需要定位权限",
                    content: "请允许定位授权以使用此功能。",
                    confirmText: "去授权",
                    success: function (modalRes) {
                      if (modalRes.confirm) {
                        // 再次尝试，可能会弹出授权窗口
                        getLocation();
                      }
                    },
                  });
                }
              },
              fail: (err) => {
                console.error("获取设置失败:", err);
                uni.showToast({ title: "检查权限失败", icon: "none" });
              },
            });
          } else {
            uni.showToast({
              title: "获取位置失败: " + err.errMsg,
              icon: "none",
            });
          }
        },
      });
    },
    objectSpanMethod(row, column, rowIndex, columnIndex) {
      if (columnIndex === 0) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    switchTakeTruck(index) {
      this.formDataList[index].takeTruck = !this.formDataList[index].takeTruck;
    },
    inputQuality(value, index) {
      if (
        ["证件信息", "工具信息"].includes(this.formDataList[index].dataCategory)
      ) {
        if (value) {
          this.formDataList[index].takeTruck = true;
        } else {
          this.formDataList[index].takeTruck = false;
        }
      }
      this.formDataList[index].remark = value;
    },
    inputTakeTruck(value, index) {
      this.formDataList[index].takeTruck = value;
    },
    cancelFormDataChange() {
      this.formDataList = this.processFormDataList(
        this.deepClone(this.datas.dataList)
      );
      this.getSpanArr(this.formDataList);
      this.checkListShow = false;
      uni.setNavigationBarTitle({
        title: "交车信息",
      });
    },
    getSpanArr(data) {
      //合并单元格 竖形
      this.spanArr = [];
      for (let i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同 dataCategory (类别字段)
          if (data[i].dataCategory === data[i - 1].dataCategory) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    deepClone(obj) {
      if (obj === null) return null;
      if (typeof obj !== "object") return obj;
      if (obj instanceof Date) {
        let date = new Date();
        date.setTime(obj.getTime());
        return date;
      }
      if (obj instanceof RegExp) {
        let re = new RegExp(obj.source);
        re.lastIndex = obj.lastIndex;
        return re;
      }
      let newObj = new obj.constructor();
      for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
          newObj[key] = this.deepClone(obj[key]);
        }
      }
      return newObj;
    },
    processFormDataList(dataList) {
      dataList = dataList.filter((x) => x.dataName != "检查项目");
      for (let item of dataList) {
        if (item.dataType != 1) {
          continue;
        }

        // 如果dataType是1，表示是布尔类型，进行字符串到布尔的转化
        if (item.takeTruck == "true" || item.takeTruck == true) {
          item.takeTruck = true;
        } else {
          item.takeTruck = false;
        }
      }

      return dataList;
    },
    openCheckListPopup() {
      this.checkListShow = true;
      uni.setNavigationBarTitle({
        title: "交车检查单",
      });
    },
    change(e) {
      this.datas.hydrogenUnit = e;
    },
    checkCameraPermission() {
      console.log("checkCameraPermission");
      uni.getSetting({
        success(res) {
          if (!res.authSetting["scope.camera"]) {
            console.log(`有相机权限`);
            return;
          } else {
            console.log(`没有相机权限! 开始申请获取`);
            this.requestCameraPermission();
          }
        },
        fail(e) {
          console.log(`获取setting失败:\n`, e);
        },
      });
    },
    requestCameraPermission() {
      uni.authorize({
        scope: "scope.camera",
        success() {
          console.log(`相机权限授权成功`);
        },
        fail() {
          console.log(`相机权限授权失败`);
        },
      });
    },
    // 保存备车检查单
    saveFormDataList() {
      if (!this.checkFormData()) {
        return false;
      }

      this.hasSaveCheckList = true;
      this.checkListShow = false;
      this.datas.dataList = this.deepClone(this.formDataList);
      uni.setNavigationBarTitle({
        title: "交车信息",
      });
    },
    // 检查备车检查单是否正确填写
    checkFormData(alert = true) {
      const targets = this.formDataList.filter(
        (x) => x.dataCategory == "外观检查" && x.dataName != "其他"
      );
      const target = targets?.find(
        (x) => (!x.takeTruck || x.takeTruck === "false") && !x.remark
      );
      console.log(this.formDataList);
      console.log(`targets\n`, targets);
      console.log(`target\n`, target);
      if (target) {
        alert && this.alert(`${target.dataName} 未勾选，需填写备注!`);
        return false;
      }

      return true;
    },

    // 删除图片
    deletePic(event) {
      const fileList = this[`fileList${event.name}`];
      if (fileList.some((x) => x.status == "uploading")) {
        this.alert(`请等待现有图片上传完成后再操作`);
        return;
      }

      this[`fileList${event.name}`].splice(event.index, 1);

      // 使用文件管理器统一处理，传递当前文件列表
      this.fileManager.removeFileFromData(
        this.datas,
        event.name,
        event.index,
        this[`fileList${event.name}`]
      );

      if (!this.isSafe) this.save(true); // 自动保存.
    },

    // 新增附件
    async afterReadPdf(event) {
      // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
      let lists = [].concat(event.file);
      let fileListLen = this[`fileList${event.name}`].length;
      lists.map((item) => {
        this[`fileList${event.name}`].push({
          ...item,
          status: "uploading",
          message: "上传中",
        });
      });
      //const fileSize = event.file.size / 1024 ** 2; // 图片多少MB
      console.log(`event.file:\n`, event.file);

      for (let i = 0; i < lists.length; i++) {
        const result = await this.uploadFilePromise(lists[i].url);
        // let result = { data: { url: waterUrl }}
        let item = this[`fileList${event.name}`][fileListLen];
        this[`fileList${event.name}`].splice(
          fileListLen,
          1,
          Object.assign(item, {
            status: "success",
            message: "",
            url: result.data?.url ?? "",
            thumb: item.type === "file" ? "/static/pdf.png" : "",
          })
        );
        fileListLen++;
        console.log("fileList");
        console.log(this[`fileList${event.name}`]);
        console.log(result.data);
        const imgUrl = result.data?.url ?? "";
        const fileName = event.file[0]?.name ?? "";

        // 使用文件管理器统一处理
        this.fileManager.addFileToData(this.datas, event.name, imgUrl, {
          fileName: fileName,
          thumb: "/static/pdf.png",
        });

        console.log(this.datas.safetyTrainingAttachment);
        this.$nextTick(() => {
          // 解决折叠collapse高度无法动态更新的问题
          this.$refs.giveCarCollapse.init();
        });
      }
      if (!this.isSafe) this.save(true); // 自动保存
    },
    // 新增图片
    async afterRead(event) {
      console.log(event);
      // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
      let lists = [].concat(event.file);
      let fileListLen = this[`fileList${event.name}`].length;
      lists.map((item) => {
        this[`fileList${event.name}`].push({
          ...item,
          status: "uploading",
          message: "上传中",
        });
      });
      console.log(`event.file:\n`, event.file);

      for (let i = 0; i < lists.length; i++) {
        this.loading = true;
        this.loadingText = "添加水印中...";
        const fileSize = lists[i].size / 1024 ** 2; // 图片多少MB
        let waterUrl = "";
        try {
          waterUrl = await this.addWatermark(lists[i].url, fileSize);
        } catch (e) {
          this.alert(e.toString());
          this[`fileList${event.name}`].splice(fileListLen, 1);
          return;
        }
        const result = await this.uploadFilePromise(waterUrl);
        // let result = { data: { url: waterUrl }}
        let item = this[`fileList${event.name}`][fileListLen];
        this[`fileList${event.name}`].splice(
          fileListLen,
          1,
          Object.assign(item, {
            status: "success",
            message: "",
            url: result.data?.url ?? "",
            thumb: waterUrl,
          })
        );
        fileListLen++;

        const imgUrl = result.data?.url ?? "";

        if (imgUrl) {
          this.compressPicMap.set(
            imgUrl,
            result.data?.compressedImageUrl ?? ""
          );
          console.log(this.compressPicMap);
          console.log(result.data?.compressedImageUrl);
        }

        // 使用文件管理器统一处理
        this.fileManager.addFileToData(this.datas, event.name, imgUrl);

        // 特殊处理：轮胎照片上传后显示轮胎厚度输入框
        const tirePhotoTypes = [
          "15",
          "16",
          "17",
          "18",
          "19",
          "20",
          "22",
          "23",
          "24",
          "25",
          "26",
          "27",
          "28",
          "29",
          "36",
          "37",
          "38",
          "39",
        ];
        if (tirePhotoTypes.includes(event.name)) {
          const tireKeyMap = {
            15: "leftFrontTirePic",
            16: "leftRearTirePicIn",
            17: "leftRearTirePicOut",
            18: "rightFrontTirePic",
            19: "rightRearTirePicIn",
            20: "rightRearTirePicOut",
            22: "leftMiddleTirePicIn",
            23: "leftMiddleTirePicOut",
            24: "leftRearMiddleTirePicIn",
            25: "leftRearMiddleTirePicOut",
            26: "rightMiddleTirePicIn",
            27: "rightMiddleTirePicOut",
            28: "rightRearMiddleTirePicIn",
            29: "rightRearMiddleTirePicOut",
            36: "leftFrontTirePicOut",
            37: "leftFrontTirePicIn",
            38: "rightFrontTirePicOut",
            39: "rightFrontTirePicIn",
          };
          this.showTireModal(tireKeyMap[event.name]);
        }

        this.$nextTick(() => {
          // 解决折叠collapse高度无法动态更新的问题
          if (["12", "10", "13"].includes(event.name)) {
            this.$refs.giveCarCollapse.init();
          } else {
            this.$refs.uploadCollapse.init();
          }
        });
      }
      if (!this.isSafe) this.save(true); //自动保存
    },

    showTireModal(tire) {
      let tireTitle = "";
      let inputName = "";
      //4.5 18t
      if (this.datas.truckSimple.tireNumber === 6) {
        switch (tire) {
          case "leftFrontTirePic":
            tireTitle = "左前轮";
            inputName = "左前（1轴）";
            break;
          case "leftRearTirePicIn":
            tireTitle = "左后轮(内)";
            inputName = "左后内（2轴）";
            break;
          case "leftRearTirePicOut":
            tireTitle = "左后轮(外)";
            inputName = "左后外（2轴）";
            break;
          case "rightFrontTirePic":
            tireTitle = "右前轮";
            inputName = "右前（1轴）";
            break;
          case "rightRearTirePicIn":
            tireTitle = "右后轮(内)";
            inputName = "右后内（2轴）";
            break;
          case "rightRearTirePicOut":
            tireTitle = "右后轮(外)";
            inputName = "右后外（2轴）";
            break;
        }
      } else if (this.datas.truckSimple.tireNumber === 10) {
        switch (tire) {
          case "leftFrontTirePic":
            tireTitle = "左前轮";
            inputName = "左前（1轴）";
            break;
          case "rightFrontTirePic":
            tireTitle = "右前轮";
            inputName = "右前（1轴）";
            break;
          case "leftMiddleTirePicIn":
            tireTitle = "左中内";
            inputName = "左中内（2轴）";
            break;
          case "leftMiddleTirePicOut":
            tireTitle = "左中外";
            inputName = "中外（2轴）";
            break;
          case "leftRearMiddleTirePicIn":
            tireTitle = "左后内";
            inputName = "左后内（3轴）";
            break;
          case "leftRearMiddleTirePicOut":
            tireTitle = "左后外";
            inputName = "左后外（3轴）";
            break;
          case "rightMiddleTirePicIn":
            tireTitle = "右中内";
            inputName = "右中内（2轴）";
            break;
          case "rightMiddleTirePicOut":
            tireTitle = "右中外";
            inputName = "右中外（2轴）";
            break;
          case "rightRearMiddleTirePicIn":
            tireTitle = "右后内";
            inputName = "右后内（3轴）";
            break;
          case "rightRearMiddleTirePicOut":
            tireTitle = "右后外";
            inputName = "右后外（3轴）";
            break;
        }
      } else if (this.datas.truckSimple.tireNumber === 12) {
        switch (tire) {
          case "leftFrontTirePicOut":
            tireTitle = "左前外";
            inputName = "左前外";
            break;
          case "leftFrontTirePicIn":
            tireTitle = "左前内";
            inputName = "左前内";
            break;
          case "rightFrontTirePicOut":
            tireTitle = "右前外";
            inputName = "右前外";
            break;
          case "rightFrontTirePicIn":
            tireTitle = "右前内";
            inputName = "右前内";
            break;
          case "leftMiddleTirePicIn":
            tireTitle = "左中内";
            inputName = "左中内";
            break;
          case "leftMiddleTirePicOut":
            tireTitle = "左中外";
            inputName = "左中外"; //中外（2轴）
            break;
          case "leftRearMiddleTirePicIn":
            tireTitle = "左后内";
            inputName = "左后内";
            break;
          case "leftRearMiddleTirePicOut":
            tireTitle = "左后外";
            inputName = "左后外";
            break;
          case "rightMiddleTirePicIn":
            tireTitle = "右中内";
            inputName = "右中内";
            break;
          case "rightMiddleTirePicOut":
            tireTitle = "右中外";
            inputName = "右中外";
            break;
          case "rightRearMiddleTirePicIn":
            tireTitle = "右后内";
            inputName = "右后内";
            break;
          case "rightRearMiddleTirePicOut":
            tireTitle = "右后外";
            inputName = "右后外";
            break;
        }
      }
      uni.showModal({
        title: `请输入${tireTitle}厚度`,
        confirmText: "确认",
        editable: true,
        placeholderText: "请输入轮胎厚度用于交车检查单",
        success: (res) => {
          if (res.confirm && res.content !== "") {
            console.log(res);
            console.log(this.datas.dataList);
            const obj = this.datas.dataList.find(
              (item) => item.dataName === inputName
            );
            if (obj) {
              this.$set(obj, "returnTruck", res.content);
              this.$set(obj, "takeTruck", res.content);
            }
            console.log(
              this.datas.dataList.find((item) => item.dataName === inputName)
            );
            this.formDataList = this.processFormDataList(
              this.deepClone(this.datas.dataList)
            );
            this.getSpanArr(this.formDataList);
          }
        },
      });
    },

    uploadFilePromise(url) {
      return new Promise((resolve, reject) => {
        let a = uni.uploadFile({
          url: "/attachment/upload",
          filePath: url,
          name: "file",
          success: (res) => {
            resolve(JSON.parse(res.data || {}));
          },
          fail: (e) => {
            reject(e);
          },
        });
      });
    },
    // 图片添加水印
    async addWatermark(img, fileSize) {
      try {
        // 检测是否为鸿蒙系统
        const systemInfo = uni.getSystemInfoSync();
        const isHarmonyOS = systemInfo.platform === 'harmony' || systemInfo.system.includes('HarmonyOS');
        
        const image = img;
        let res1 = await new Promise((resolve, reject) => {
          uni.getImageInfo({
            src: img,
            success: (res) => {
              // 设置canvas宽高等于原图片宽高
              this.canvasWidth = res.width;
              this.canvasHeight = res.height;
              
              // 鸿蒙系统特殊处理：降低图片分辨率以避免性能问题
              if (isHarmonyOS && (res.width > 2000 || res.height > 2000)) {
                const scale = Math.min(2000 / res.width, 2000 / res.height);
                this.canvasWidth = Math.floor(res.width * scale);
                this.canvasHeight = Math.floor(res.height * scale);
              }
              
              // 创建 canvas 的绘图上下文
              const ctx = uni.createCanvasContext("myCanvas", this);
              
              // 鸿蒙系统使用更简单的绘制方式
              if (isHarmonyOS) {
                ctx.drawImage(image, 0, 0, this.canvasWidth, this.canvasHeight);
                // 简化水印，减少文字和图片元素
                ctx.font = "20px Arial";
                ctx.fillStyle = "#fff";
                ctx.textAlign = "left";
                ctx.fillText(this.getNowDateTime(), 10, this.canvasHeight - 20);
              } else {
                // 标准绘制方式
                ctx.drawImage(image, 0, 0, res.width, res.height);
                ctx.drawImage("/static/logo3.png", 10, res.height - 150, 200, 40.8);
                ctx.font = "25px 黑体";
                ctx.fillStyle = "#fff";
                ctx.textAlign = "left";
                ctx.fillText(this.getNowDateTime(), 10, res.height - 70);
                ctx.fillText(this.datas.handoverAddress, 10, res.height - 30);
              }
              
              // 画到 canvas 中
              ctx.draw(false, () => {
                // 将画布转化为图片
                // 鸿蒙系统使用更长的延时
                let timeout = isHarmonyOS ? 2000 : 1000;
                if (fileSize <= 3) {
                  timeout = isHarmonyOS ? 1500 : 1000;
                } else {
                  timeout = isHarmonyOS ? 2000 * (fileSize / 3) : 1000 * (fileSize / 3);
                }

                setTimeout(() => {
                  uni.canvasToTempFilePath(
                    {
                      canvasId: "myCanvas",
                      fileType: "jpg",
                      quality: fileSize <= 3 ? 1 : (isHarmonyOS ? 0.6 : 0.75), // 鸿蒙系统使用更低的压缩率
                      success: (res) => {
                        console.log(res);
                        this.loading = false;
                        resolve(res.tempFilePath);
                      },
                      fail: (err) => {
                        console.error("Canvas转换失败:", err);
                        // 鸿蒙系统失败时返回原图
                        if (isHarmonyOS) {
                          this.loading = false;
                          resolve(img);
                        } else {
                          this.loading = false;
                          reject(err);
                        }
                      },
                    },
                    this
                  );
                }, timeout);
              });
            },
            fail: (err) => {
              console.error("获取图片信息失败:", err);
              this.loading = false;
              reject(err);
            }
          });
        });
        return res1;
      } catch (error) {
        console.error("水印处理异常:", error);
        this.loading = false;
        throw error;
      }
    },
    parseFileListBack() {
      console.log(this.compressPicMap);

      // 使用文件管理器统一处理
      const fileLists = this.fileManager.parseFileListFromData(
        this.datas,
        this.compressPicMap
      );

      // 将解析后的文件列表赋值给组件的 fileList 变量
      Object.keys(fileLists).forEach((key) => {
        if (key.startsWith("fileList")) {
          this[key] = fileLists[key];
        }
      });

      // 处理电子签名状态
      if (
        this.datas.esignatureAttachment &&
        this.datas.esignatureAttachment.length >= 1
      ) {
        this.hasSign = true;
      }

      this.$nextTick(() => {
        this.$refs.uploadCollapse.init();
      });
    },

    passTap() {
      if (
        (!this.datas.safetyTrainingPicture ||
          this.datas.safetyTrainingPicture.length == 0) &&
        (!this.datas.safetyTrainingAttachment ||
          this.datas.safetyTrainingAttachment.length == 0)
      ) {
        this.alert(`请上传安全培训照片或附件`);
        return;
      }
      if (this.currRole === 2) this.datas.auditResult = 1; // 通过
      this.datas.submit = true; // 提交
      this.$api.truckRent.safeAudit(this.datas).then((res) => {
        if (res) {
          uni.showToast({
            title: "通过成功",
            icon: "success",
            duration: 1500,
            success() {
              setTimeout(() => {
                uni.navigateBack();
              }, 1500);
            },
          });
        }
      });
    },
    rejectTap() {
      console.log(this.datas);

      if (
        (!this.datas.safetyTrainingPicture ||
          this.datas.safetyTrainingPicture.length == 0) &&
        (!this.datas.safetyTrainingAttachment ||
          this.datas.safetyTrainingAttachment.length == 0)
      ) {
        this.alert(`请上传安全培训照片或附件`);
        return;
      }
      if (!this.datas.auditOpinion || this.datas.auditOpinion == "") {
        this.alert("审批意见不能为空");
        return false;
      }
      this.datas.auditResult = 0;
      this.datas.submit = true; // 提交
      this.$api.truckRent.safeAudit(this.datas).then((res) => {
        if (res) {
          uni.showToast({
            title: "驳回成功",
            icon: "success",
            duration: 1500,
            success() {
              setTimeout(() => {
                uni.navigateBack();
              }, 1500);
            },
          });
        }
      });
    },
    // 保存
    save(isAuto = false) {
      this.datas.submit = false; // 不提交，仅保存
      this.$api.truckRent.addTake(this.datas).then((res) => {
        console.log(res);
        if (res && !isAuto) {
          uni.showToast({
            title: "保存成功",
            icon: "success",
            duration: 1500,
            success() {},
          });
          this.isPageShow = false;
          setTimeout(() => {
            uni.navigateBack();
          }, 1500);
        }
      });
    },
    submitConfirm() {
      if (this.currRole === 1) {
        this.passTap();
      } else {
        uni.showModal({
          title: "提示",
          content: "确认交车?",
          success: (res) => {
            if (res.confirm) {
              this.submit();
            }
          },
        });
      }
    },
    submit() {
      if (
        !this.datas.esignatureAttachment ||
        this.datas.esignatureAttachment.length == 0
      ) {
        this.alert(`请完成电子签名`);
        return;
      }
      this.datas.submit = true; // 提交
      this.$api.truckRent.addTake(this.datas).then((res) => {
        if (res) {
          uni.showToast({
            title: "提交成功",
            icon: "success",
            duration: 1500,
            success() {},
          });
          this.isPageShow = false;
          setTimeout(() => {
            uni.navigateBack();
          }, 1500);
        }
      });
    },
    // 在提交前检查，是否有必填字段未填写
    check() {
      if (
        this.datas.isDrivingTraining !== 0 &&
        this.datas.isDrivingTraining !== 1
      ) {
        this.alert("请选择驾驶培训");
        return false;
      }
      if (this.datas.changeTruckld && !this.datas.changeRemark) {
        this.alert("请填写换车备注");
        return false;
      }
      if (!this.datas.takeMileage) {
        this.alert("请填写交车里程");
        return false;
      }
      if (!this.datas.electricity) {
        this.alert("请填写交车电量");
        return false;
      }
      if (!this.datas.hydrogenMeasure) {
        this.alert("请填写交车氢量");
        return false;
      }
      if (!this.datas.hydrogenUnit) {
        this.alert("请选择交车氢量单位");
        return false;
      }
      if (!this.datas.handoverDate) {
        this.alert("请填写交车时间");
        return false;
      }
      if (!this.datas.dashboardPic) {
        this.alert("请上传仪表盘照片");
        return false;
      }
      if (!this.datas.frontPic) {
        this.alert("请上传正面照片");
        return false;
      }
      if (!this.datas.leftFrontPic) {
        this.alert("请上传左前方照片");
        return false;
      }
      if (!this.datas.rightFrontPic) {
        this.alert("请上传右前方照片");
        return false;
      }
      if (!this.datas.leftRearPic) {
        this.alert("请上传左后方照片");
        return false;
      }
      if (!this.datas.rightRearPic) {
        this.alert("请上传右后方照片");
        return false;
      }

      if (
        (!this.datas.tirePic || this.datas.tirePic.length < 6) &&
        this.datas.truckSimple.tireNumber == 6
      ) {
        if (!this.datas.leftFrontTirePic) {
          this.alert("请上传左前轮照片");
          return false;
        }
        if (!this.datas.leftRearTirePicIn) {
          this.alert("请上传左后轮(内)照片");
          return false;
        }
        if (!this.datas.leftRearTirePicOut) {
          this.alert("请上传左后轮(外)照片");
          return false;
        }
        if (!this.datas.rightFrontTirePic) {
          this.alert("请上传右前轮照片");
          return false;
        }
        if (!this.datas.rightRearTirePicIn) {
          this.alert("请上传右后轮(内)照片");
          return false;
        }
        if (!this.datas.rightRearTirePicOut) {
          this.alert("请上传右后轮(外)照片");
          return false;
        }
      } else if (
        (!this.datas.tirePic || this.datas.tirePic.length < 10) &&
        this.datas.truckSimple.tireNumber == 10
      ) {
        if (!this.datas.leftFrontTirePic) {
          this.alert("请上传左前轮照片");
          return false;
        }
        if (!this.datas.rightFrontTirePic) {
          this.alert("请上传右前轮照片");
          return false;
        }
        if (!this.datas.leftMiddleTirePicIn) {
          this.alert("请上传左中内照片");
          return false;
        }
        if (!this.datas.leftMiddleTirePicOut) {
          this.alert("请上传左中外照片");
          return false;
        }
        if (!this.datas.leftRearMiddleTirePicIn) {
          this.alert("请上传左后内照片");
          return false;
        }
        if (!this.datas.leftRearMiddleTirePicOut) {
          this.alert("请上传左后外照片");
          return false;
        }
        if (!this.datas.rightMiddleTirePicIn) {
          this.alert("请上传右中内照片");
          return false;
        }
        if (!this.datas.rightMiddleTirePicOut) {
          this.alert("请上传右中外照片");
          return false;
        }
        if (!this.datas.rightRearMiddleTirePicIn) {
          this.alert("请上传右后内照片");
          return false;
        }
        if (!this.datas.rightRearMiddleTirePicOut) {
          this.alert("请上传右后外照片");
          return false;
        }
      } else if (
        (!this.datas.tirePic || this.datas.tirePic.length < 12) &&
        this.datas.truckSimple.tireNumber == 12
      ) {
        if (!this.datas.leftFrontTirePicOut) {
          this.alert("请上传左前外照片");
          return false;
        }
        if (!this.datas.leftFrontTirePicIn) {
          this.alert("请上传左前内照片");
          return false;
        }
        if (!this.datas.rightFrontTirePicOut) {
          this.alert("请上传右前外照片");
          return false;
        }
        if (!this.datas.rightFrontTirePicIn) {
          this.alert("请上传右前内照片");
          return false;
        }
        if (!this.datas.leftMiddleTirePicIn) {
          this.alert("请上传左中内照片");
          return false;
        }
        if (!this.datas.leftMiddleTirePicOut) {
          this.alert("请上传左中外照片");
          return false;
        }
        if (!this.datas.leftRearMiddleTirePicIn) {
          this.alert("请上传左后内照片");
          return false;
        }
        if (!this.datas.leftRearMiddleTirePicOut) {
          this.alert("请上传左后外照片");
          return false;
        }
        if (!this.datas.rightMiddleTirePicIn) {
          this.alert("请上传右中内照片");
          return false;
        }
        if (!this.datas.rightMiddleTirePicOut) {
          this.alert("请上传右中外照片");
          return false;
        }
        if (!this.datas.rightRearMiddleTirePicIn) {
          this.alert("请上传右后内照片");
          return false;
        }
        if (!this.datas.rightRearMiddleTirePicOut) {
          this.alert("请上传右后外照片");
          return false;
        }
      }
      //   if (!this.datas.tirePic || this.datas.tirePic.length == 0) {
      //     this.alert("请上传轮胎照片");
      //     return false;
      //   }
      //   if (this.datas.tirePic.length < this.datas.truckSimple.tireNumber) {
      //     this.alert("轮胎照片上传数量不小于车辆轮胎数量");
      //     return false;
      //   }

      // 底盘照片必填检查
      if (!this.datas.frontBottomPic) {
        this.alert("请上传正前方底部照片");
        return false;
      }
      if (!this.datas.leftFrontBottomPic) {
        this.alert("请上传左侧前部底部照片");
        return false;
      }
      if (!this.datas.leftRearBottomPic) {
        this.alert("请上传左侧后方底部照片");
        return false;
      }
      if (!this.datas.rightFrontBottomPic) {
        this.alert("请上传右侧前方底部照片");
        return false;
      }
      if (!this.datas.rightRearBottomPic) {
        this.alert("请上传右侧后方底部照片");
        return false;
      }
      if (!this.datas.rearBottomPic) {
        this.alert("请上传正后方底部照片");
        return false;
      }

      if (!this.datas.signAttachment || this.datas.signAttachment.length == 0) {
        this.alert("请上传培训文件签字照片");
        return false;
      }
      if (!this.datas.documents || this.datas.documents.length == 0) {
        this.alert("请上传司机证件");
        return false;
      }
      return true;
    },
    alert(msg, time = 1500) {
      uni.showToast({
        title: msg,
        icon: "none",
        duration: time,
      });
    },
    // 生成交车确认单文档
    generateWord() {
      // 若存在字段未填写，则不请求接口
      if (!this.check()) {
        return;
      }

      if (!this.hasSaveCheckList) {
        this.alert(`请填写交车检查单`);
        return;
      }

      if (!this.datas.takePhone || !this.datas.takeName) {
        this.alert(`签名需要指定授权人`);
        return;
      }

      if (this.showClearTip) {
        this.alert(`当前交车单已存在签名流程，建议先清除签名信息`, 2500);
        this.showClearTip = false;
        return;
      }
      this.loading = true;
      this.loadingText = "生成签署文档中...";
      const datas = this.deepClone(this.datas);
      this.handleDatasCompressImg(datas); // 替换为缩略图
      this.$api.truckRent.generateWord(datas).then((res) => {
        console.log(res);
        if (!res) {
          ///this.alert("生成签署文档失败");
          this.loading = false;
          return;
        }

        if (res.msg === "signatureAgain") {
          this.loading = false;
          uni.navigateTo({
            url: `/pages/webview/index?url=${encodeURIComponent(res.data)}`,
          });
          return;
        }
        if (res.msg != "OK") {
          this.alert(res.msg);
          this.loading = false;
          return;
        }

        let filePath = res.data[0]?.path;
        if (!filePath) {
          this.alert("生成签署文档失败");
          this.loading = false;
          return;
        }

        this.initiateSignature(filePath);
      });
    },
    // 发起电子签章
    initiateSignature(filePath) {
      this.loading = true;
      this.loadingText = "发起电子签章中...";
      this.$api.truckRent
        .initiateSignature({
          businessType: "1",
          fileName: `${this.datas.truckSimple.plateNumber}交车确认单.docx`,
          filePath: filePath,
          psnAccount1: this.userInfo.phone,
          psnAccount2: this.datas.takePhone,
          psnName1: this.userInfo.userName,
          psnName2: this.datas.takeName,
          signFlowTitle: `${this.datas.truckSimple.plateNumber}交车确认单`,
          tireNumber: this.datas.truckSimple.tireNumber,
        })
        .then((res) => {
          console.log(res);
          if (!res) {
            this.alert(`发起电子签章失败`);
            this.loading = false;
            return;
          }

          const signFlowId = res.data;
          if (!signFlowId) {
            this.alert(res?.msg || `发起电子签章失败`);
            this.loading = false;
            return;
          }

          this.datas.signFlowId = signFlowId;
          this.getSignatureUrl(signFlowId);
        });
    },
    // 生成签署链接
    getSignatureUrl(signFlowId) {
      this.loading = true;
      this.loadingText = "获取电子签章签署链接中...";
      this.$api.truckRent
        .getSignatureUrl({
          signFlowId: signFlowId,
          psnAccount: this.userInfo.phone,
        })
        .then((res) => {
          if (!res) {
            this.alert(`获取电子签章签署链接失败`);
            this.loading = false;
            return;
          }

          console.log(res);
          const signUrl = res.data;
          if (!signUrl) {
            this.alert(`获取电子签章签署链接失败`);
            this.loading = false;
            return;
          }

          this.loading = false;
          this.save(true); //自动保存
          uni.navigateTo({
            url: `/pages/webview/index?url=${encodeURIComponent(signUrl)}`,
          });
        });
    },
    fileDownloadUrl() {
      if (!this.datas.signFlowId) {
        uni.showToast({
          icon: "none",
          title: "请先点击签名",
          duration: 2000,
        });

        return;
      }

      this.loading = true;
      this.loadingText = "下载中...";
      this.$api.truckRent
        .fileDownloadUrl({
          signFlowId: this.datas.signFlowId,
        })
        .then((res) => {
          this.loading = false;
          if (!res) {
            this.alert(`下载失败`);
            return;
          }
          if (res.msg != "OK") {
            this.alert(res.msg);
            return;
          }

          this.datas.esignatureAttachment = res.data;
          this.fileList11 = res.data.map((x) => ({
            url: x.path,
            thumb: "/static/pdf.png",
          }));
          this.hasSign = true;
          this.save(true); //自动保存
        });
    },
    previewPdf() {
      if (
        !this.datas.esignatureAttachment ||
        this.datas.esignatureAttachment.length == 0
      ) {
        this.alert(`请先点击生成签署文件`);
        return;
      }

      const path = this.datas.esignatureAttachment[0].path;
      console.log(path);
      this.loading = true;
      this.loadingText = "加载中...";
      const that = this;
      uni.downloadFile({
        url: path,
        success: function (res) {
          var filePath = res.tempFilePath;
          this.loading = false;
          uni.openDocument({
            filePath: filePath,
            success: function (res) {
              this.loading = false;
            },
            fail() {
              this.loading = false;
            },
          });
        },
        fail() {
          that.loading = false;
          uni.showToast({
            title: `预览文件失败`,
            icon: "none",
            duration: 1500,
          });
        },
      });
    },
    // 预览安全审批附件
    previewYyPdf(data) {
      if (!data || !data.url) {
        this.alert(`文件上传异常`);
        return;
      }
      console.log(data);
      const path = data.url;
      this.loading = true;
      this.loadingText = "加载中...";
      const that = this;
      uni.downloadFile({
        url: path,
        success: function (res) {
          var filePath = res.tempFilePath;
          that.loading = false;
          uni.openDocument({
            filePath: filePath,
            success: function (res) {
              that.loading = false;
            },
            fail() {
              that.loading = false;
            },
          });
        },
        fail() {
          that.alert("预览文件失败");
          that.loading = false;
        },
      });
    },
    // 提交给生成签署文档接口的参数，其中的图片全部替换为缩略图
    handleDatasCompressImg(datas) {
      console.log(this.compressPicMap);
      //直接字符串
      const keys1 = [
        "dashboardPic",
        "dashboard2Pic",
        "frontPic",
        "leftFrontPic",
        "rightFrontPic",
        "leftRearPic",
        "rightRearPic",
        //4.5 18T
        "leftFrontTirePic",
        "leftRearTirePicIn",
        "leftRearTirePicOut",
        "rightFrontTirePic",
        "rightRearTirePicIn",
        "rightRearTirePicOut",
        "spareTirePic",
        //12T新增轮胎字段
        "leftFrontTirePicOut",
        "leftFrontTirePicIn",
        "rightFrontTirePicOut",
        "rightFrontTirePicIn",
        //49T
        "leftMiddleTirePicIn",
        "leftMiddleTirePicOut",
        "leftRearMiddleTirePicIn",
        "leftRearMiddleTirePicOut",
        "rightMiddleTirePicIn", //右中内
        "rightMiddleTirePicOut",
        "rightRearMiddleTirePicIn",
        "rightRearMiddleTirePicOut",
        //底盘照片
        "frontBottomPic",
        "leftFrontBottomPic",
        "leftRearBottomPic",
        "rightFrontBottomPic",
        "rightRearBottomPic",
        "rearBottomPic",
      ];
      for (let key of keys1) {
        if (datas[key]) {
          datas[key] = this.compressPicMap.get(datas[key]);
        }
      }
      //字符串数组
      const keys2 = ["blemish", "tirePic", "otherPic", "documents"];
      for (let key of keys2) {
        datas[key] = datas[key].map(
          (x) => this.compressPicMap.get(x) || x.path
        );
      }
      //字符串数组
      const keys3 = ["safetyTrainingPicture"];

      for (let key of keys3) {
        console.log(datas[key]);
        datas[key] = datas[key].map((x) => {
          return { path: this.compressPicMap.get(x.path) || x.path };
        });
      }
    },
  },
  onLoad(options) {
    if (options.id) {
      this.id = options.id;
    }
    if (options.isRead) {
      this.isRead = Number(options.isRead);
    }
    if (!this.isRead) {
      this.isPageShow = true; // 如果不是查看模式，则开启拦截
    }
    //是否安全审查人员
    if (options.isSafe) {
      this.isSafe = Number(options.isSafe);
    }
    console.log(options);
    this.userInfo = getUser() || {};
    console.log(this.userInfo);
    this.checkCameraPermission(); // 检测拍照权限
    this.getDic();
    this.getData();
    // this.getInStoreList()
  },
  onPullDownRefresh() {
    // this.getData()
    uni.stopPullDownRefresh(); //刷新数据之后停止刷新效果
  },
  onShow() {
    if (this.loadingText != "添加水印中...") {
      this.loading = false;
    }
  },
  onHide() {},
  destroyed() {},
};
</script>

<style lang="less" scoped>
.flexBox {
  display: flex;
  flex-wrap: wrap;

  .flexItem {
    flex: 0 0 33.3%;
    box-sizing: border-box;

    .title {
      font-size: 24rpx;
    }
  }
}

/deep/ .u-upload__wrap__preview__other__text {
  overflow: hidden;
  text-align: center;
  word-break: break-word;
}

.container {
  // background-color: #d7d7d7;
  padding: 30rpx;

  .line {
    display: flex;
    align-items: center;
    margin-bottom: 15rpx;
    font-size: 14px;

    .left {
      margin-right: 50rpx;
      width: 300rpx;
    }

    .text-small {
      font-size: x-small;
    }

    .text-normal {
      font-size: small;
    }
  }

  .item {
    margin-top: 30rpx;

    .title {
      font-size: 26rpx;
      margin-bottom: 15rpx;

      &.required::before {
        content: "*";
        color: red;
        margin-right: 3rpx;
      }
    }

    .btn.checkList {
      width: 200rpx;
      height: 60rpx;
      font-size: 26rpx;
      line-height: 26rpx;
      padding: 17rpx 0;
      text-align: center;
      background-color: #7ba746;
      color: white;
      margin-left: 0;

      &.required::before {
        content: "*";
        color: red;
        margin-right: 3rpx;
      }
    }

    .unit {
      font-size: 26rpx;
    }

    .btn {
      width: 200rpx;
      height: 80rpx;
      margin-left: 0;
      font-size: 26rpx;
      line-height: 26rpx;
      padding: 27rpx 0;
      text-align: center;
      color: white;

      &.sign {
        background-color: #7ba746;
        display: inline-block;
        margin-right: 30rpx;
      }

      &.genDocument {
        background-color: #1e98d7;
      }

      &.disabled {
        opacity: 0.6;
      }
    }
  }

  .btns {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin-top: 20rpx;

    button {
      width: 200rpx;
      height: 60rpx;
      font-size: 26rpx;
      line-height: 26rpx;
      padding: 17rpx 0;
      text-align: center;
    }

    .cancel {
      background-color: white;
      color: #7ba746;
      border: 1rpx #7ba746 solid;
    }

    .save {
      background-color: #7ba746;
      color: white;
    }

    .done {
      background-color: #7ba746;
      color: white;
    }

    .disabled {
      opacity: 0.6;
    }
  }
}

/deep/ .u-textarea textarea {
  min-height: 100rpx !important;
  font-size: 26rpx !important;
}

/deep/ .u-border {
  border-width: 1rpx !important;
  border-color: gray !important;
  border-style: solid;
}

/deep/ .u-collapse-item__content__text {
  padding: unset !important;
  color: unset !important;
  font-size: unset !important;
}

/deep/ .u-cell__title-text {
  font-size: unset !important;
  line-height: unset !important;
  color: unset !important;
}

/deep/ .u-cell__body {
  padding: unset !important;
  font-size: unset !important;
  color: unset !important;
}

/deep/ .u-cell__right-icon-wrap text {
  font-size: 32rpx !important;
}

/deep/ .u-cell--clickable {
  background-color: unset !important;
}

/deep/ .u-collapse-item {
  margin-bottom: 30rpx;
}

/deep/ .uni-select {
  width: 100rpx !important;
}

/deep/ .u-upload__button text {
  font-size: 48rpx !important;
}

/deep/ .u-upload__deletable {
  height: 42rpx !important;
  width: 42rpx !important;
}

/deep/ .u-upload__deletable text {
  font-size: 32rpx !important;
  line-height: 32rpx !important;
}

/deep/ picker-view {
  height: 600rpx !important;
}

/deep/ .u-datetime-picker {
  width: 100% !important;
}

/deep/ .u-datetime-picker__view {
  height: 600rpx !important;
}

/deep/ .u-datetime-picker__view__column {
  height: 600rpx !important;
}

/deep/ .uni-select__input-text {
  font-size: 26rpx !important;
  text-align: right !important;
}

/deep/ .uni-select__selector-item text {
  font-size: 26rpx !important;
}

/deep/ .uni-select {
  padding-right: 18rpx !important;
  border-width: 1rpx !important;
  border-color: gray !important;
  border-style: solid !important;
  border-top-width: 0 !important;
  border-right-width: 0 !important;
  border-bottom-width: 0 !important;
}

// /deep/ picker-view picker-view-column:nth-of-type(5) {
//   display: none;
// }

.changeCarBtn {
  height: 76rpx;
  font-size: 26rpx;
  line-height: 76rpx;
  border-width: 1rpx !important;
  border-color: gray !important;
  border-style: solid !important;
  border-top-width: 0 !important;
  border-right-width: 0 !important;
  border-bottom-width: 0 !important;
}

/* 检查单样式开始 */
/deep/ .td_wrap {
  height: auto !important;
}

/deep/ checkbox-group view.td {
  width: 186rpx !important;
}

/deep/ checkbox-group view.td_wrap {
  width: 186rpx !important;
}

/deep/ .no-bad-table-wrap .td.rowspan {
  display: flex;
  align-items: center;
  justify-content: center;
}

/deep/ .div-table-head .thead .tr view {
  width: 186rpx !important;
}

/deep/ no-bad-table {
  overflow-x: hidden;
}

/deep/ .no-bad-table-wrap .thead .tr .td {
  background-color: #7ba746;
  color: white;
}

/deep/ .no-bad-table-wrap .thead .tr .td .td_wrap {
  background-color: #7ba746;
  color: white;
}

/* 检查单样式结束 */

/* loading 置于顶层 */
/deep/ .u-fade-enter-to.u-fade-enter-active {
  z-index: 10074 !important;
}
</style>
