<!--
 * @Date: 2022-09-19 14:11:06
 * @LastEditors: hookehuyr hookehuyr@gmail.com
 * @LastEditTime: 2025-08-12 17:05:50
 * @FilePath: /jgdl/src/pages/collectionSettings/index.vue
 * @Description: 收款设置
-->
<template>
  <view class="collection-settings">

    <!-- 设置列表 -->
    <view class="settings-list">
      <!-- 收款账号 -->
      <view class="setting-item" @click="openAccountModal">
        <view class="setting-left">
          <text class="setting-label">收款账号</text>
        </view>
        <view class="setting-right">
          <text class="setting-status"
            :class="{ 'status-set': accountInfo.bankName && accountInfo.bankAccount && accountInfo.bankImg }">
            {{ accountInfo.bankName && accountInfo.bankAccount && accountInfo.bankImg ? '已设置' : '未设置' }}
          </text>
          <!-- <text class="arrow">></text> -->
          <RectRight color="#999" size="10" />
        </view>
      </view>

      <!-- 身份信息 -->
      <view class="setting-item" @click="openIdentityModal">
        <view class="setting-left">
          <text class="setting-label">身份信息</text>
        </view>
        <view class="setting-right">
          <text class="setting-status"
            :class="{ 'status-set': identityInfo.userName && identityInfo.idCard && identityInfo.idcard_1_img && identityInfo.idcard_2_img && identityInfo.idcard_effect_begin && identityInfo.idcard_effect_end && (identityInfo.idcard_province && identityInfo.idcard_city && identityInfo.idcard_district && identityInfo.idcard_address) }">
            {{ identityInfo.userName && identityInfo.idCard && identityInfo.idcard_1_img && identityInfo.idcard_2_img &&
              identityInfo.idcard_effect_begin && identityInfo.idcard_effect_end && (identityInfo.idcard_province && identityInfo.idcard_city && identityInfo.idcard_district && identityInfo.idcard_address) ? '已设置' :
            '未设置' }}
          </text>
          <!-- <text class="arrow">></text> -->
          <RectRight color="#999" size="10" />
        </view>
      </view>
    </view>

    <!-- 收款账号弹窗 -->
    <nut-popup v-model:visible="showAccountModal" position="bottom" :style="{ width: '100%', height: '85%' }"
      :close-on-click-overlay="false" closeable close-icon-position="top-right" @close="closeAccountModal">
      <view class="modal-content">
        <view class="modal-header">
          <text class="modal-title">收款账号设置</text>
        </view>

        <view class="form-content">
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>银行名称</text>
            <view class="bank-selector" @click="showBankPicker">
              <text class="bank-text" :class="{ 'bank-selected': tempAccountInfo.bankName }">
                {{ getBankNameById(tempAccountInfo.bankName) || '请选择银行' }}
              </text>
              <!-- <text class="arrow-down">></text> -->
              <RectRight color="#999" size="10" />
            </view>
          </view>

          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>银行账号</text>
            <input v-model="tempAccountInfo.bankAccount" placeholder="请输入银行账号"
              class="form-input custom-input native-input" :cursor-spacing="50" @blur="validateBankAccount" />
            <text v-if="bankAccountError" class="error-text">{{ bankAccountError }}</text>
          </view>

          <!-- 银行卡正面照片上传 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>银行卡正面照</text>
            <view class="bank-img-container">
              <view v-if="tempAccountInfo.bankImg" class="bank-img-preview">
                <image :src="tempAccountInfo.bankImg" class="bank-img-image" mode="aspectFill" @tap="previewBankImg" />
                <view class="bank-img-actions">
                  <text class="change-img-btn" @tap="changeBankImg">重新上传</text>
                  <text class="delete-img-btn" @tap="deleteBankImg">删除</text>
                </view>
              </view>
              <view v-else class="bank-img-upload" @tap="changeBankImg">
                <text class="upload-icon">+</text>
                <text class="upload-text">上传银行卡正面照</text>
              </view>
            </view>
          </view>
        </view>

        <view class="modal-footer">
          <nut-button type="default" @click="closeAccountModal" class="footer-btn footer-btn-cancel">
            关闭
          </nut-button>
          <nut-button type="primary" @click="saveAccountInfo" color="#ffa500"
            :disabled="!tempAccountInfo.bankName || !tempAccountInfo.bankAccount || !tempAccountInfo.bankImg"
            class="footer-btn footer-btn-save">
            保存
          </nut-button>
        </view>
      </view>
    </nut-popup>

    <!-- 银行选择器弹窗 -->
    <nut-popup v-model:visible="showBankModal" position="bottom">
      <nut-picker v-model="bankPickerValue" :columns="bankOptions" title="选择银行" @confirm="onBankConfirm"
        @cancel="showBankModal = false"></nut-picker>
    </nut-popup>

    <!-- 身份信息弹窗 -->
    <nut-popup v-model:visible="showIdentityModal" position="bottom" :style="{ width: '100%', height: '85%' }"
      :close-on-click-overlay="false" closeable close-icon-position="top-right" @close="closeIdentityModal">
      <view class="modal-content">
        <view class="modal-header">
          <text class="modal-title">身份信息设置</text>
        </view>

        <view class="form-content">
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>用户名称</text>
            <input v-model="tempIdentityInfo.userName" placeholder="请输入真实姓名" class="form-input native-input" />
          </view>

          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>身份证号码</text>
            <input v-model="tempIdentityInfo.idCard" placeholder="请输入身份证号码" class="form-input native-input"
              maxlength="18" @blur="handleIdCardBlur" :cursor-spacing="50" />
            <text v-if="idCardError" class="error-text">{{ idCardError }}</text>
          </view>

          <!-- 身份证人像面照片上传 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>身份证人像面</text>
            <view class="idcard-img-container">
              <view v-if="tempIdentityInfo.idcard_1_img" class="idcard-img-preview">
                <image :src="tempIdentityInfo.idcard_1_img" class="idcard-img-image" mode="aspectFill"
                  @tap="previewIdcard1Img" />
                <view class="idcard-img-actions">
                  <text class="change-img-btn" @tap="changeIdcard1Img">重新上传</text>
                  <text class="delete-img-btn" @tap="deleteIdcard1Img">删除</text>
                </view>
              </view>
              <view v-else class="idcard-img-upload" @tap="changeIdcard1Img">
                <text class="upload-icon">+</text>
                <text class="upload-text">上传身份证人像面</text>
              </view>
            </view>
          </view>

          <!-- 身份证国徽面照片上传 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>身份证国徽面</text>
            <view class="idcard-img-container">
              <view v-if="tempIdentityInfo.idcard_2_img" class="idcard-img-preview">
                <image :src="tempIdentityInfo.idcard_2_img" class="idcard-img-image" mode="aspectFill"
                  @tap="previewIdcard2Img" />
                <view class="idcard-img-actions">
                  <text class="change-img-btn" @tap="changeIdcard2Img">重新上传</text>
                  <text class="delete-img-btn" @tap="deleteIdcard2Img">删除</text>
                </view>
              </view>
              <view v-else class="idcard-img-upload" @tap="changeIdcard2Img">
                <text class="upload-icon">+</text>
                <text class="upload-text">上传身份证国徽面</text>
              </view>
            </view>
          </view>

          <!-- 证件有效期开始日期 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>证件有效期开始</text>
            <view class="date-selector" @click="showIdcardBeginDatePicker">
              <text class="date-text" :class="{ 'date-selected': tempIdentityInfo.idcard_effect_begin }">
                {{ tempIdentityInfo.idcard_effect_begin || '请选择开始日期' }}
              </text>
              <!-- <text class="arrow-down">></text> -->
              <RectRight color="#999" size="10" />
            </view>
          </view>

          <!-- 证件有效期结束日期 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>证件有效期结束</text>
            <view class="date-selector" @click="showIdcardEndDatePicker">
              <text class="date-text" :class="{ 'date-selected': tempIdentityInfo.idcard_effect_end }">
                {{ tempIdentityInfo.idcard_effect_end || '请选择结束日期' }}
              </text>
              <!-- <text class="arrow-down">></text> -->
              <RectRight color="#999" size="10" />
            </view>
          </view>

          <!-- 身份证地址 -->
          <view class="form-item">
            <text class="form-label"><text class="required-mark">*</text>身份证地址</text>
            <!-- 地址选择器触发器 -->
            <view
              class="address-selector"
              @click="showAddressSelector = true"
            >
              <text class="address-text" :class="{ 'address-selected': addressData.full_address }">
                {{ addressData.full_address || '请选择省市县并填写详细地址' }}
              </text>
              <RectRight color="#999" size="10" />
            </view>
          </view>
        </view>

        <view class="modal-footer">
          <nut-button type="default" @click="closeIdentityModal" class="footer-btn footer-btn-cancel">
            关闭
          </nut-button>
          <nut-button type="primary" @click="saveIdentityInfo" color="#ffa500"
            :disabled="!tempIdentityInfo.userName || !tempIdentityInfo.idCard || !tempIdentityInfo.idcard_1_img || !tempIdentityInfo.idcard_2_img || !tempIdentityInfo.idcard_effect_begin || !tempIdentityInfo.idcard_effect_end || !tempIdentityInfo.idcard_province || !tempIdentityInfo.idcard_city || !tempIdentityInfo.idcard_district || !tempIdentityInfo.idcard_address || !!idCardError"
            class="footer-btn footer-btn-save">
            保存
          </nut-button>
        </view>
      </view>
    </nut-popup>

    <!-- 身份证有效期开始日期选择器 -->
    <nut-popup v-model:visible="showIdcardBeginDate" position="bottom" :style="{ height: '50%' }">
      <nut-date-picker v-model="idcardBeginDate" type="date" title="选择证件有效期开始日期" :max-date="maxYearDate"
        :min-date="minYearDate" @confirm="onIdcardBeginDateConfirm" @cancel="showIdcardBeginDate = false" />
    </nut-popup>

    <!-- 证件有效期结束类型选择器弹窗 -->
    <nut-popup v-model:visible="showEndDateTypeModal" position="bottom">
      <nut-picker v-model="endDateTypePickerValue" :columns="endDateTypeOptions" title="选择证件有效期类型"
        @confirm="onEndDateTypeConfirm" @cancel="showEndDateTypeModal = false"></nut-picker>
    </nut-popup>

    <!-- 身份证有效期结束日期选择器 -->
    <nut-popup v-model:visible="showIdcardEndDate" position="bottom" :style="{ height: '50%' }">
      <nut-date-picker v-model="idcardEndDate" type="date" title="选择证件有效期结束日期" :max-date="maxYearDate"
        :min-date="minYearDate" @confirm="onIdcardEndDateConfirm" @cancel="showIdcardEndDate = false" />
    </nut-popup>

    <!-- 固定返回按钮 - 只有当参数target=sell时才显示 -->
    <view v-if="showBackButton" class="fixed-back-btn" @click="goBack">
      <text class="back-text">返回</text>
    </view>

    <!-- 地址选择器组件 -->
    <AddressSelector
      v-model:visible="showAddressSelector"
      v-model="addressData"
      @change="onAddressChange"
      placeholder="请选择省市县并填写详细地址"
    />

  </view>
</template>

<script setup>
import { ref, onMounted, computed } from "vue";
import Taro from "@tarojs/taro";
import "./index.less";

import { RectRight } from '@nutui/icons-vue-taro'

// 导入接口
import { updateProfileAPI, getProfileAPI } from '@/api/index'
import { getBanksAPI } from '@/api/other'
import BASE_URL from '@/utils/config'

// 导入用户状态管理
import { useUserStore } from '@/stores/user'

// 导入地址选择组件
import AddressSelector from '@/components/AddressSelector.vue'

// 获取页面参数
const instance = Taro.getCurrentInstance()
const { target } = instance.router?.params || {}

// 用户状态管理
const userStore = useUserStore()

/**
 * 判断是否显示返回按钮
 * 只有当参数target=sell时才显示
 */
const showBackButton = computed(() => {
  return target === 'sell'
})

/**
 * 收款账号信息
 */
const accountInfo = ref({
  bankName: '',
  bankAccount: '',
  bankImg: ''
});

/**
 * 身份信息
 */
const identityInfo = ref({
  userName: '',
  idCard: '',
  idcard_1_img: '',
  idcard_2_img: '',
  idcard_effect_begin: '',
  idcard_effect_end: '',
  idcard_address: ''
});

/**
 * 临时收款账号信息（用于弹窗编辑）
 */
const tempAccountInfo = ref({
  bankName: '',
  bankAccount: '',
  bankImg: ''
});

/**
 * 临时身份信息（用于弹窗编辑）
 */
const tempIdentityInfo = ref({
  userName: '',
  idCard: '',
  idcard_1_img: '',
  idcard_2_img: '',
  idcard_effect_begin: '',
  idcard_effect_end: '',
  // 身份证地址相关字段（显示用中文名称）
  province: '',
  city: '',
  county: '',
  // 身份证地址相关字段（提交用真实字段名）
  idcard_province: '',
  idcard_city: '',
  idcard_district: '',
  idcard_address: ''
});

/**
 * 弹窗显示状态
 */
const showAccountModal = ref(false);
const showIdentityModal = ref(false);
const showBankModal = ref(false);
const showIdcardBeginDate = ref(false);
const showIdcardEndDate = ref(false);
const showEndDateTypeModal = ref(false);
const showAddressSelector = ref(false);

/**
 * 身份证号码错误信息
 */
const idCardError = ref('');

/**
 * 银行账号错误信息
 */
const bankAccountError = ref('');

/**
 * 日期选择器相关状态
 */
const idcardBeginDate = ref(new Date());
const idcardEndDate = ref(new Date());

/**
 * 日期选择器的最大日期（当前年份后80年）
 */
const currentYear = new Date().getFullYear();
const maxYearDate = ref(new Date(currentYear + 80, 11, 31)); // 80年后的12月31日

/**
 * 日期选择器的最小日期（当前年份前80年）
 */
const minYearDate = ref(new Date(currentYear - 80, 0, 1)); // 80年前的1月1日

// 银行选择器当前选中的值
const bankPickerValue = ref([]);

// 证件有效期结束类型选择器当前选中的值
const endDateTypePickerValue = ref([]);

/**
 * 证件有效期结束类型选项
 */
const endDateTypeOptions = ref([
  {
    text: '长期',
    value: 'long_term'
  },
  {
    text: '选择日期',
    value: 'select_date'
  }
]);

/**
 * 银行列表数据（从接口获取）
 */
const bankOptions = ref([]);

/**
 * 获取银行列表
 */
const getBanksList = async () => {
  try {
    const result = await getBanksAPI();
    if (result.code && result.data) {
      // 适配数据格式：将 {id, name} 转换为 {text: name, value: id}
      bankOptions.value = result.data.map(bank => ({
        text: bank.name,
        value: bank.id
      }));
    }
  } catch (error) {
    console.error('获取银行列表失败:', error);
  }
};

/**
 * 获取用户信息
 */
const getUserInfo = async () => {
  try {
    const result = await getProfileAPI();
    if (result.code && result.data) {
      const userInfo = result.data;

      // 设置收款账号信息
      if (userInfo.bank_id && userInfo.bank_no) {
        accountInfo.value = {
          bankName: userInfo.bank_id, // 存储银行ID
          bankAccount: userInfo.bank_no, // 存储银行账号
          bankImg: userInfo.bank_img || '' // 存储银行卡图片
        };
      }

      // 设置身份信息
      if (userInfo.name && userInfo.idcard) {
        identityInfo.value = {
          userName: userInfo.name,
          idCard: userInfo.idcard,
          idcard_1_img: userInfo.idcard_1_img || '',
          idcard_2_img: userInfo.idcard_2_img || '',
          idcard_effect_begin: userInfo.idcard_effect_begin || '',
          idcard_effect_end: userInfo.idcard_effect_end || '',
          // 地址字段（用于显示的中文名称）
          province: userInfo.province_name || '',
          city: userInfo.city_name || '',
          county: userInfo.county_name || userInfo.district_name || '',
          // 身份证地址字段（真实字段名）
          idcard_province: userInfo.idcard_province || '',
          idcard_city: userInfo.idcard_city || '',
          idcard_district: userInfo.idcard_district || '',
          idcard_address: userInfo.idcard_address || ''
        };
      }
    }
  } catch (error) {
    console.error('获取用户信息失败:', error);
  }
};

/**
 * 页面加载时获取数据
 */
onMounted(() => {
  getBanksList();
  getUserInfo();
});

/**
 * 身份证号码校验
 * @param {string} idCard - 身份证号码
 * @returns {boolean} - 是否有效
 */
const validateIdCard = (idCard) => {
  if (!idCard) {
    return { valid: false, error: '请输入身份证号码' };
  }

  // 身份证号码正则表达式
  const idCardRegex = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;

  if (!idCardRegex.test(idCard)) {
    return { valid: false, error: '身份证号码格式不正确' };
  }

  // 校验码验证
  const weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
  const checkCodes = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];

  let sum = 0;
  for (let i = 0; i < 17; i++) {
    sum += parseInt(idCard[i]) * weights[i];
  }

  const checkCode = checkCodes[sum % 11];
  const lastChar = idCard[17].toUpperCase();

  if (checkCode !== lastChar) {
    return { valid: false, error: '身份证号码校验失败' };
  }

  return { valid: true, error: '' };
};

/**
 * 处理身份证号码失焦事件
 */
const handleIdCardBlur = () => {
  const idCard = tempIdentityInfo.value.idCard;
  if (idCard) {
    const result = validateIdCard(idCard);
    idCardError.value = result.error;
  } else {
    idCardError.value = '';
  }
};

/**
 * 银行账号校验
 * @param {string} bankAccount - 银行账号
 * @returns {object} - 校验结果
 */
const validateBankAccountNumber = (bankAccount) => {
  if (!bankAccount) {
    return { valid: false, error: '请输入银行账号' };
  }

  // 检查是否都是数字
  const numberRegex = /^\d+$/;
  if (!numberRegex.test(bankAccount)) {
    return { valid: false, error: '银行账号只能包含数字' };
  }

  return { valid: true, error: '' };
};

/**
  * 处理银行账号失焦事件
  */
const validateBankAccount = () => {
  const bankAccount = tempAccountInfo.value.bankAccount;
  if (bankAccount) {
    const result = validateBankAccountNumber(String(bankAccount));
    bankAccountError.value = result.error;
  } else {
    bankAccountError.value = '';
  }
};

/**
 * 根据银行ID获取银行名称
 * @param {string} bankId - 银行ID
 * @returns {string} - 银行名称
 */
const getBankNameById = (bankId) => {
  if (!bankId || !bankOptions.value.length) return '';
  const bank = bankOptions.value.find(item => item.value === bankId);
  return bank ? bank.text : bankId;
};

/**
 * 显示银行选择弹窗
 */
const showBankPicker = () => {
  // 设置当前选中的值
  if (tempAccountInfo.value.bankName) {
    bankPickerValue.value = [tempAccountInfo.value.bankName];
  } else if (bankOptions.value.length > 0) {
    bankPickerValue.value = [bankOptions.value[0].value];
  }
  showBankModal.value = true;
};



/**
 * 银行选择确认回调
 */
const onBankConfirm = ({ selectedValue }) => {
  tempAccountInfo.value.bankName = selectedValue[0];
  showBankModal.value = false;
};

/**
 * 打开收款账号弹窗
 */
const openAccountModal = () => {
  tempAccountInfo.value = { ...accountInfo.value };
  bankAccountError.value = '';
  showAccountModal.value = true;
};

/**
 * 关闭收款账号弹窗
 */
const closeAccountModal = () => {
  showAccountModal.value = false;
  tempAccountInfo.value = { bankName: '', bankAccount: '', bankImg: '' };
  bankAccountError.value = '';
};

/**
 * 保存收款账号信息
 */
const saveAccountInfo = async () => {
  if (!tempAccountInfo.value.bankName || !tempAccountInfo.value.bankAccount) {
    Taro.showToast({
      title: '请填写完整信息',
      icon: 'none'
    });
    return;
  }

  try {
    // 调用API保存收款账号信息
    const result = await updateProfileAPI({
      bank_id: tempAccountInfo.value.bankName, // 发送银行ID
      bank_no: String(tempAccountInfo.value.bankAccount), // 转换为字符串传给接口
      bank_img: tempAccountInfo.value.bankImg // 发送银行卡图片
    });

    if (result.code) {
      accountInfo.value = { ...tempAccountInfo.value };

      // 更新全局用户状态
      userStore.updateUserInfo({
        bank_id: tempAccountInfo.value.bankName, // 存储银行ID
        bank_no: tempAccountInfo.value.bankAccount, // 保持数字类型存储到全局状态
        bank_img: tempAccountInfo.value.bankImg // 存储银行卡图片
      });

      closeAccountModal();

      Taro.showToast({
        title: '保存成功',
        icon: 'success'
      });
    }
  } catch (error) {
    console.error('保存收款账号失败:', error);
    Taro.showToast({
      title: '保存失败，请重试',
      icon: 'none'
    });
  }
};

/**
 * 打开身份信息弹窗
 */
const openIdentityModal = () => {
  tempIdentityInfo.value = { ...identityInfo.value };
  idCardError.value = '';
  // 初始化地址选择器数据
  initAddressData();
  showIdentityModal.value = true;
};

/**
 * 初始化地址选择器数据
 */
const initAddressData = () => {
  addressData.value = {
    province: tempIdentityInfo.value.province || '',
    city: tempIdentityInfo.value.city || '',
    county: tempIdentityInfo.value.county || '',
    province_code: tempIdentityInfo.value.idcard_province || '',
    city_code: tempIdentityInfo.value.idcard_city || '',
    county_code: tempIdentityInfo.value.idcard_district || '',
    detail_address: tempIdentityInfo.value.idcard_address || '',
    full_address: (tempIdentityInfo.value.province + tempIdentityInfo.value.city + tempIdentityInfo.value.county + tempIdentityInfo.value.idcard_address) || ''
  }
};

/**
 * 关闭身份信息弹窗
 */
const closeIdentityModal = () => {
  showIdentityModal.value = false;
  tempIdentityInfo.value = {
    userName: '',
    idCard: '',
    idcard_1_img: '',
    idcard_2_img: '',
    idcard_effect_begin: '',
    idcard_effect_end: '',
    province: '',
    city: '',
    county: '',
    idcard_province: '',
    idcard_city: '',
    idcard_district: '',
    idcard_address: ''
  };
  idCardError.value = '';
};

/**
 * 上传银行卡正面照
 */
const changeBankImg = () => {
  Taro.chooseImage({
    count: 1,
    sizeType: ['compressed'],
    sourceType: ['album', 'camera'],
    success: function (res) {
      const tempFilePath = res.tempFilePaths[0]
      uploadBankImage(tempFilePath)
    },
    fail: function () {
      Taro.showToast({
        title: '选择图片失败',
        icon: 'none'
      })
    }
  })
}

/**
 * 上传银行卡图片到服务器
 * @param {String} filePath - 图片文件路径
 */
const uploadBankImage = (filePath) => {
  // 显示上传中提示
  Taro.showLoading({
    title: '上传中',
    mask: true
  })

  // 上传图片
  wx.uploadFile({
    url: BASE_URL + '/admin/?m=srv&a=upload',
    filePath,
    name: 'file',
    header: {
      'content-type': 'multipart/form-data',
    },
    success: function (res) {
      let upload_data = JSON.parse(res.data);
      Taro.hideLoading({
        success: () => {
          if (res.statusCode === 200) {
            tempAccountInfo.value.bankImg = upload_data.data.src;
            Taro.showToast({
              title: '上传成功',
              icon: 'success'
            })
          } else {
            Taro.showToast({
              icon: 'error',
              title: '服务器错误,稍后重试！',
              mask: true
            })
          }
        },
      });
    },
    fail: function (res) {
      Taro.hideLoading({
        success: () => {
          Taro.showToast({
            icon: 'error',
            title: '上传失败,稍后重试！',
            mask: true
          })
        },
      });
    }
  })
}

/**
 * 预览银行卡图片
 */
const previewBankImg = () => {
  if (tempAccountInfo.value.bankImg) {
    Taro.previewImage({
      urls: [tempAccountInfo.value.bankImg],
      current: tempAccountInfo.value.bankImg
    })
  }
}

/**
 * 删除银行卡图片
 */
const deleteBankImg = () => {
  Taro.showModal({
    title: '确认删除',
    content: '确定要删除银行卡照片吗？',
    success: function (res) {
      if (res.confirm) {
        tempAccountInfo.value.bankImg = ''
        Taro.showToast({
          title: '删除成功',
          icon: 'success'
        })
      }
    }
  })
}

/**
 * 选择身份证人像面照片
 */
const changeIdcard1Img = () => {
  Taro.chooseImage({
    count: 1,
    sizeType: ['compressed'],
    sourceType: ['album', 'camera'],
    success: function (res) {
      const tempFilePath = res.tempFilePaths[0]
      uploadIdcardImage(tempFilePath, 'idcard_1_img')
    },
    fail: function () {
      Taro.showToast({
        title: '选择图片失败',
        icon: 'none'
      })
    }
  })
}

/**
 * 选择身份证国徽面照片
 */
const changeIdcard2Img = () => {
  Taro.chooseImage({
    count: 1,
    sizeType: ['compressed'],
    sourceType: ['album', 'camera'],
    success: function (res) {
      const tempFilePath = res.tempFilePaths[0]
      uploadIdcardImage(tempFilePath, 'idcard_2_img')
    },
    fail: function () {
      Taro.showToast({
        title: '选择图片失败',
        icon: 'none'
      })
    }
  })
}

/**
 * 上传身份证图片到服务器
 * @param {String} filePath - 图片文件路径
 * @param {String} fieldName - 字段名称 (idcard_1_img 或 idcard_2_img)
 */
const uploadIdcardImage = (filePath, fieldName) => {
  // 显示上传中提示
  Taro.showLoading({
    title: '上传中',
    mask: true
  })

  // 上传图片
  wx.uploadFile({
    url: BASE_URL + '/admin/?m=srv&a=upload',
    filePath,
    name: 'file',
    header: {
      'content-type': 'multipart/form-data',
    },
    success: function (res) {
      let upload_data = JSON.parse(res.data);
      Taro.hideLoading({
        success: () => {
          if (res.statusCode === 200) {
            tempIdentityInfo.value[fieldName] = upload_data.data.src;
            Taro.showToast({
              title: '上传成功',
              icon: 'success'
            })
          } else {
            Taro.showToast({
              icon: 'error',
              title: '服务器错误,稍后重试！',
              mask: true
            })
          }
        },
      });
    },
    fail: function (res) {
      Taro.hideLoading({
        success: () => {
          Taro.showToast({
            icon: 'error',
            title: '上传失败,稍后重试！',
            mask: true
          })
        },
      });
    }
  })
}

/**
 * 预览身份证人像面图片
 */
const previewIdcard1Img = () => {
  if (tempIdentityInfo.value.idcard_1_img) {
    Taro.previewImage({
      urls: [tempIdentityInfo.value.idcard_1_img],
      current: tempIdentityInfo.value.idcard_1_img
    })
  }
}

/**
 * 预览身份证国徽面图片
 */
const previewIdcard2Img = () => {
  if (tempIdentityInfo.value.idcard_2_img) {
    Taro.previewImage({
      urls: [tempIdentityInfo.value.idcard_2_img],
      current: tempIdentityInfo.value.idcard_2_img
    })
  }
}

/**
 * 删除身份证人像面图片
 */
const deleteIdcard1Img = () => {
  Taro.showModal({
    title: '确认删除',
    content: '确定要删除身份证人像面照片吗？',
    success: function (res) {
      if (res.confirm) {
        tempIdentityInfo.value.idcard_1_img = ''
        Taro.showToast({
          title: '删除成功',
          icon: 'success'
        })
      }
    }
  })
}

/**
 * 删除身份证国徽面图片
 */
const deleteIdcard2Img = () => {
  Taro.showModal({
    title: '确认删除',
    content: '确定要删除身份证国徽面照片吗？',
    success: function (res) {
      if (res.confirm) {
        tempIdentityInfo.value.idcard_2_img = ''
        Taro.showToast({
          title: '删除成功',
          icon: 'success'
        })
      }
    }
  })
}

/**
 * 显示身份证有效期开始日期选择器
 */
const showIdcardBeginDatePicker = () => {
  showIdcardBeginDate.value = true
}

/**
 * 显示身份证有效期结束日期选择器
 */
const showIdcardEndDatePicker = () => {
  // 设置默认选中第一个选项
  if (endDateTypeOptions.value.length > 0) {
    endDateTypePickerValue.value = [endDateTypeOptions.value[0].value];
  }
  showEndDateTypeModal.value = true
}

/**
 * 确认选择身份证有效期开始日期
 * @param {Object} param - 日期选择器返回的参数
 */
const onIdcardBeginDateConfirm = (param) => {
  const { selectedValue } = param
  const year = selectedValue[0]
  const month = selectedValue[1].toString().padStart(2, '0')
  const day = selectedValue[2].toString().padStart(2, '0')
  tempIdentityInfo.value.idcard_effect_begin = `${year}-${month}-${day}`
  showIdcardBeginDate.value = false
}

/**
 * 证件有效期结束类型选择确认回调
 * @param {Object} param - 选择器返回的参数
 */
const onEndDateTypeConfirm = ({ selectedValue }) => {
  const selectedType = selectedValue[0];

  if (selectedType === 'long_term') {
    // 选择长期，直接设置为"长期"
    tempIdentityInfo.value.idcard_effect_end = '长期';
    showEndDateTypeModal.value = false;
  } else if (selectedType === 'select_date') {
    // 选择日期，打开日期选择器
    showEndDateTypeModal.value = false;
    showIdcardEndDate.value = true;
  }
};

/**
 * 确认选择身份证有效期结束日期
 * @param {Object} param - 日期选择器返回的参数
 */
const onIdcardEndDateConfirm = (param) => {
  const { selectedValue } = param
  const year = selectedValue[0]
  const month = selectedValue[1].toString().padStart(2, '0')
  const day = selectedValue[2].toString().padStart(2, '0')
  tempIdentityInfo.value.idcard_effect_end = `${year}-${month}-${day}`
  showIdcardEndDate.value = false
}

/**
 * 保存身份信息
 */
const saveIdentityInfo = async () => {
  if (!tempIdentityInfo.value.userName || !tempIdentityInfo.value.idCard) {
    Taro.showToast({
      title: '请填写完整信息',
      icon: 'none'
    });
    return;
  }

  const validation = validateIdCard(tempIdentityInfo.value.idCard);
  if (!validation.valid) {
    Taro.showToast({
      title: validation.error,
      icon: 'none'
    });
    return;
  }

  try {
    // 调用API保存身份信息
    const result = await updateProfileAPI({
      name: tempIdentityInfo.value.userName,
      idcard: tempIdentityInfo.value.idCard,
      idcard_1_img: tempIdentityInfo.value.idcard_1_img,
      idcard_2_img: tempIdentityInfo.value.idcard_2_img,
      idcard_effect_begin: tempIdentityInfo.value.idcard_effect_begin,
      idcard_effect_end: tempIdentityInfo.value.idcard_effect_end,
      // 使用真实的身份证地址字段名
      idcard_province: tempIdentityInfo.value.idcard_province,
      idcard_city: tempIdentityInfo.value.idcard_city,
      idcard_district: tempIdentityInfo.value.idcard_district,
      idcard_address: tempIdentityInfo.value.idcard_address
    });

    if (result.code) {
      identityInfo.value = { ...tempIdentityInfo.value };

      // 更新全局用户状态
      userStore.updateUserInfo({
        name: tempIdentityInfo.value.userName,
        idcard: tempIdentityInfo.value.idCard,
        idcard_1_img: tempIdentityInfo.value.idcard_1_img,
        idcard_2_img: tempIdentityInfo.value.idcard_2_img,
        idcard_effect_begin: tempIdentityInfo.value.idcard_effect_begin,
        idcard_effect_end: tempIdentityInfo.value.idcard_effect_end,
        // 身份证地址字段
        idcard_province: tempIdentityInfo.value.idcard_province,
        idcard_city: tempIdentityInfo.value.idcard_city,
        idcard_district: tempIdentityInfo.value.idcard_district,
        idcard_address: tempIdentityInfo.value.idcard_address
      });

      closeIdentityModal();

      Taro.showToast({
        title: '保存成功',
        icon: 'success'
      });
    } else {
      Taro.showToast({
        title: result.message || '保存失败',
        icon: 'none'
      });
    }
  } catch (error) {
    console.error('保存身份信息失败:', error);
    Taro.showToast({
      title: '保存失败，请重试',
      icon: 'none'
    });
  }
};

/**
 * 返回上一页
 */
const goBack = () => {
  Taro.redirectTo({
    url: '/pages/sell/index'
  });
};

// 地址选择相关状态
const addressData = ref({
  province: '',
  city: '',
  county: '',
  detail_address: '',
  full_address: ''
})

/**
 * 地址变化处理回调
 * @param {Object} address - 地址数据对象
 */
const onAddressChange = (address) => {
  // 更新临时身份信息中的地址字段（中文名称，用于显示）
  tempIdentityInfo.value.province = address.province
  tempIdentityInfo.value.city = address.city
  tempIdentityInfo.value.county = address.county

  // 更新身份证地址字段（真实字段名，用于提交）
  tempIdentityInfo.value.idcard_province = address.province_code || address.province
  tempIdentityInfo.value.idcard_city = address.city_code || address.city
  tempIdentityInfo.value.idcard_district = address.county_code || address.county
  tempIdentityInfo.value.idcard_address = address.detail_address
}
</script>

<script>
export default {
  name: "collectionSettings",
};
</script>