<template>
  <view>
    <template v-for="(item, index) in addInfoArr" :key="index">
      <add-component ref="addComponentRef"></add-component>
    </template>
    <view class="Wrapper-Btn">
      <up-button
        @click="handleQux"
        type="error"
        :plain="true"
        :hairline="true"
        text="取消"
        :customStyle="hadlClickEdit"
      ></up-button>
      <up-button
        type="error"
        text="确定"
        @click="handlOk(item)"
        :customStyle="hadlClickEdit"
      ></up-button>
    </view>
  </view>
</template>

<script setup>
import { ref, reactive } from 'vue'
import { useraDdressData } from '@/api/userSettings.js'
import pickerAddress from '@/pages_home/components/pickerAddress/pickerAddress.vue' // 地区选择器组件
import addComponent from '@/pages_home/components/setupUserCopy/Add.vue'

const addComponentRef = ref(null)

const addInfoArr = ref([{}])

function handleAdd() {
  if (addInfoArr.value.length < 4) addInfoArr.value.push({})
}

const handlOk = async (item) => {
  const params = []
  const paramsData = {
    volunteerId: item.volunteerId, // 获取 volunteerId
    serviceCategory: item.serviceCategory, // 获取 serviceCategory
    businessManagementId: item.businessManagementId, //获取 businessManagementId
  }
  const data = encodeURIComponent(JSON.stringify(paramsData))
  addInfoArr.value.forEach((item, index) => {
    params.push(addComponentRef.value[index].modelForm)
  })

  params.forEach(async (obj) => {
    const res = await useraDdressData(obj)
    if (res.code == 200) {
      uni.showToast({
        title: '新增成功',
        icon: 'success', // 或者 'none'
        duration: 1500, // 显示时间，单位毫秒，默认1500
        mask: true, // 是否显示透明蒙层，防止触摸穿透，默认false
      })
      setTimeout(() => {
        // uni.navigateBack({
        // 	delta: 2
        // })
        wx.reLaunch({
          url: `/pages_home/pages/Volunteerside/goodsDetails?paramsData=${data}`,
        })
      }, 1500)
    }
  })
}

const handleQux = () => {
  uni.navigateBack({
    delta: 2,
  })
}
const hadlClickEdit = {
  width: '240rpx',
  marginTop: '30rpx',
}
</script>
<style scoped lang="scss">
.address-inp {
  color: #929292;
}

.Wrapper-Btn {
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>

