<template>
  <view class="stop-service">
    <view class="form">
      <uv-form labelPosition="left" :model="form" ref="formRef">
        <uv-form-item
          label="请选择积分收回方式"
          prop="enableFlag"
          required
          labelPosition="top"
          labelWidth="240"
        >
          <uv-radio-group v-model="form.enableFlag" placement="column" activeColor="#6EB657">
            <uv-radio :customStyle="{ marginTop: '20px' }" label="全部收回" name="1"> </uv-radio>
            <uv-radio :customStyle="{ marginTop: '16px' }" label="剩余收回" name="2"> </uv-radio>
          </uv-radio-group>
        </uv-form-item>
      </uv-form>
    </view>
    <view class="btn">
      <view class="cancel" @click="cancelFn">取消</view>
      <view class="confirm" @click="confirmFn">确定</view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app'
import { reactive, ref } from 'vue'
import { stopWmScorePackageApi, updateEnableApi } from '@/service/modules/serviceDelivery'

const currentId = ref()
const currentType = ref()
onLoad((e: any) => {
  currentId.value = e?.id
  currentType.value = e?.type
})

const form = reactive({
  enableFlag: ''
})

const cancelFn = () => {
  uni.navigateBack()
}

const confirmFn = async () => {
  if (!form.enableFlag) {
    return uni.showToast({
      title: '请选择回收方式！',
      icon: 'none'
    })
  }
  const obj = {
    enableType: form.enableFlag,
    id: currentId.value
  }
  let res

  if (currentType.value === '1') {
    res = await stopWmScorePackageApi(obj)
  } else if (currentType.value === '2') {
    res = await updateEnableApi(obj)
  }
  if (res.data) {
    uni.showToast({
      title: '终止成功',
      icon: 'none'
    })
    setTimeout(() => {
      uni.navigateBack()
    }, 1000)
  }
}
</script>

<style lang="scss" scoped>
.stop-service {
  background-color: #f2f2f2;
  height: 100vh;
  padding: 24rpx;

  .form {
    width: 100%;
    height: 230rpx;
    background-color: #fff;
    border-radius: 12rpx;
    padding: 30rpx;
  }
}

.btn {
  position: fixed;
  bottom: 40rpx;
  box-sizing: border-box;
  width: 700rpx;
  height: 160rpx;
  background-color: #fff;
  border-radius: 12rpx;
  display: flex;
  padding: 30rpx 46rpx 54rpx;
  justify-content: space-between;
  box-sizing: border-box;

  view {
    font-weight: 400;
    box-sizing: border-box;
    font-size: 32rpx;
    line-height: 45rpx;
    border-radius: 8rpx;
    height: 72rpx;
    width: 290rpx;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cancel {
    border: 2rpx solid #c7c7c7;
    color: #111;
  }
  .confirm {
    background-color: #6eb657;
    color: #ffffff;
  }
}
</style>
