<template>
  <uni-popup ref="popup" type="bottom" :mask-click="false">
    <view class="bg-white overflow-hidden pb-10" style="width: 750rpx;">
      <view class="px-15 py-12 text-center text-lg font-semibold text-dark border-b">
        咨询设置
      </view>
      <view class="flex items-center justify-between p-15 border-b">
        <view class="text-base text-dark">自动通过申请</view>
        <switch color="#0074ff" :checked="autoAcceptConsult" @change="change($event)"></switch>
      </view>
      <button-footer :showShadow="false" confirmText="确定" @cancel="close" @confirm="save()" />
    </view>
  </uni-popup>
</template>

<script setup>
import { ref, watch } from 'vue';
import api from "@/utils/api.js";
import buttonFooter from '@/components/button-footer.vue';
import { toast } from '@/utils/widget.js';

const emits = defineEmits(['close'])
const props = defineProps({
  teamId: {
    type: String,
    default: ''
  },
  visible: {
    type: Boolean,
    default: false
  }
})
const popup = ref();
const autoAcceptConsult = ref(false);

function change(e) {
  autoAcceptConsult.value = e.detail.value;
}

async function getAccpetStatus() {
  if (!props.teamId) {
    autoAcceptConsult.value = false
    return
  }
  const res = await api('getAutoAcceptConsult', {
    teamId: props.teamId
  })
  autoAcceptConsult.value = res && typeof res.data === 'boolean' ? res.data : false
}

async function save() {
  const res = await api('updateAutoAcceptConsult', {
    teamId: props.teamId,
    autoAcceptConsult: autoAcceptConsult.value
  })
  if (res && res.success) {
    toast('操作成功')
    close()
  } else {
    toast(res?.message || '操作失败')
  }
}

function close() {
  emits('close')
}

watch(() => props.visible, n => {
  if (n) {
    popup.value && popup.value.open()
    getAccpetStatus()
  } else {
    popup.value && popup.value.close()
  }
})
</script>

<style lang="scss" scoped>
.mt-5 {
  margin-top: 10rpx;
}

.leading-24 {
  line-height: 48rpx;
}
</style>