<template>
  <full-page :customScroll="empty">
    <view v-if="customers.length === 0" class="flex items-center justify-center h-full">
      <empty-data />
    </view>
    <view class="p-15">
      <view v-for="customer in customers" :key="customer._id" class="bg-white rounded shadow-lg mb-10">
        <view class="flex items-center px-15 py-12 border-b">
          <view class="flex-shrink-0 mr-5 text-lg text-dark font-semibold">{{ customer.name }}</view>
          <view v-if="customer.relationship"
            class="flex-shrink-0 mr-5 border-primary text-primary px-10 text-sm leading-normal rounded-sm">
            {{ customer.relationship }}
          </view>
          <view class="flex-grow mr-5"></view>
          <view v-if="enableHis && customer.isConnectHis"
            class="px-15 py-5 text-sm leading-normal bg-success text-white rounded-sm">
            未关联档案
          </view>
          <view v-else-if="enableHis" class="px-15 py-5 text-sm leading-normal bg-warning text-white rounded-sm">未关联档案
          </view>
        </view>
        <view class="px-15 py-12 border-b">
          <view class="text-base leading-normal">
            <text v-if="customer.sex"> {{ customer.sex }}</text>
            <text v-if="customer.sex && customer.age">/</text>
            <text v-if="customer.age"> {{ customer.age }}岁</text>
            <text v-if="customer.sex || customer.age">，</text>
            <text v-if="customer.mobile"> {{ customer.mobile }}</text>
          </view>
          <view class="text-base leading-normal">证件号：{{ customer.idCard || '--' }}</view>
        </view>
        <view class="px-15 py-12 flex justify-end">
          <view v-if="enableHis && !customer.isConnectHis" class="mr-10 text-base text-primary">关联档案</view>
          <view class="text-base text-success" @click="changeArchive(customer)">完善个人信息</view>
          <!-- <view class="text-base text-danger" @click="unBindArchive(customer)">删除档案</view> -->
        </view>
      </view>
    </view>
    <template #footer>
      <button-footer confirmText="新增档案" :showCancel="false" @confirm="addArchive()" />
    </template>
  </full-page>
</template>
<script setup>
import { ref } from 'vue';
import { storeToRefs } from 'pinia'
import useGuard from '@/hooks/useGuard';
import useAccount from '@/store/account';
import api from '@/utils/api';

import ButtonFooter from '@/components/button-footer.vue';
import EmptyData from '@/components/empty-data.vue';
import FullPage from '@/components/full-page.vue';
import { confirm, toast } from '../../utils/widget';

const empty = ref(false)
const { useLoad, useShow } = useGuard();
const { account } = storeToRefs(useAccount());
const corpId = ref('');
const teamId = ref('');
const corpUserId = ref('');
const referenceCustomerId = ref('');
const enableHis = ref(false);
const customers = ref([]);

function addArchive() {
  uni.navigateTo({
    url: `/pages/archive/edit-archive?corpUserId=${corpUserId.value}&referenceCustomerId=${referenceCustomerId.value}&teamId=${teamId.value}&corpId=${corpId.value}`
  })
}

function changeArchive(customer) {
  uni.navigateTo({
    url: `/pages/archive/edit-archive?teamId=${teamId.value}&corpId=${corpId.value}&id=${customer._id}`
  })
}

async function getMembers() {
  const res = await api('getTeamCustomers', { corpId: corpId.value, teamId: teamId.value, miniAppId: account.value.openid });
  customers.value = res && Array.isArray(res.data) ? res.data : [];
  // enableHis.value = res && typeof res.enableHis === 'boolean' ? res.enableHis : false;
  if (!res || !res.data) {
    toast(res?.message || '获取档案信息失败')
  }
}

async function unBindArchive(customer) {
  await confirm('确定删除档案吗？')
  const res = await api('unbindMiniAppArchive', { id: customer._id, corpId: corpId.value, teamId: teamId.value, miniAppId: account.value.openid });
  if (res && res.success) {
    await toast('删除成功');
    getMembers();
  } else {
    toast(res?.message || '删除失败')
  }
}

useLoad(options => {
  teamId.value = options.teamId;
  corpId.value = options.corpId;
  corpUserId.value = options.corpUserId;
  referenceCustomerId.value = options.referenceCustomerId || '';
})

useShow(() => {
  if (teamId.value && corpId.value) {
    getMembers()
  }
})
</script>
