<script setup>
import DraggableButton from "@/pages/components/goHome.vue";
/**
 * name：
 * user：sa0ChunLuyu
 * date：2024年9月11日 19:24:50
 */
import { ref } from "vue";
import { $api, $image, $response } from "@/api";
import { onShow } from "@dcloudio/uni-app";
import { useStore } from "@/store";
const $store = useStore();
const person_list = ref([]);

let popup = ref(null);
let unitList = ref([]); // 单位列表

let popupMultiple = ref(false); // 多选弹窗
let multipleList = ref([]); // 多选列表
let multipleIndex = ref(0); // 多选索引
let itemIds = ref([]); // 项目id集合
let itemId = ref(""); // 项目id

const getPersonList = async () => {
  uni.showLoading();
  const response = await $api("GetPersonList");
  uni.hideLoading();
  $response(response, () => {
    person_list.value = response.data.list;
  });
};

const config_ref = ref(null);
const configRef = (e) => {
  if (!config_ref.value) {
    config_ref.value = e;
    getPersonList();
  }
};
const getUserInfo = async () => {
  const response = await $api("UserInfo");
  $response(response, () => {
    // $store.user = response.data.info
    $store.setUser(response.data.info);
    $store.setYytjInfo({}); // 切换体检人的时候清空预约信息
	
	let buyinfo=$store.getBuyInfo()
	buyinfo.person_id=response.data.info.person_id
	$store.setBuyInfo(buyinfo);
	
    // uni.$lu.toast("切换成功");
    // uni.navigateBack({
    //   delta: 1,
    // });
  });
};
const choosePersonClick = async (info) => {
uni.showLoading();
	const response1 = await $api("SetDefaultPerson", {
	  person_id: info.id,
	});
	$response(response1, () => {
	  getUserInfo();
	});
  // 查询团检ID
  const response = await $api("GetGroupUnit", {
    hospital_id: $store.save.hospital,
    id_number: info.id_number,
    phone: info.phone,
  });
   uni.hideLoading();
  $response(response, () => {
    unitList.value = response.data.unit;
    if (response.data.unit.length > 1) {
      popup.value.open("bottom");
    }
    if (response.data.unit.length == 1) {
      getGroupCombo(response.data.unit[0]);
    }
  });
};

const getGroupCombo = async (info) => {
  uni.showLoading();
  // 获取团检套餐
  const response = await $api("GetGroupCombo", {
    hospital_id: $store.save.hospital,
    group_id: info.group_id,
  });
  uni.hideLoading();
  $response(response, () => {
    console.log(response);
    if (response.data.unit.length) {
      let data = response.data.unit[0];
      data.sex = info.sex;
      data.phone = info.phone;
      data.phone = info.married;
      $store.setGroupInfo(data);
      popup.value.close();
      if (!data.items.length && data.tongshou_xiane > 0) {
        // 跳转到选择类似上
        uni.navigateTo({
          url: "/pages/main/tj/selectType",
        });
      } else {
        // 跳转到详情
		//如果有多选一弹出选择
		if (data.duo_xuan_yi.length > 0) {
		  popupMultiple.value.open("center");
		  multipleIndex.value = 0;
		  itemIds.value = [];
		  $store.setDuoXuanYi([]);
		  itemId.value = "";
		  multipleList.value = data.duo_xuan_yi;
		  return;
		}
		
        uni.navigateTo({
          url: "/pages/main/tj/tjxq?groupId=" + info.group_id,
        });
      }
    }
  });
};
const nextItemClick = () => {
	let groupInfo=$store.getGroupInfo();
	console.log('----',groupInfo)
  if (!itemId.value) {
    uni.$lu.toast("请选择项目");
    return;
  }
  let item_name="";
  multipleList.value[multipleIndex.value]['item_list'].forEach((vv,ii)=>{
	  if(vv.item_id==itemId.value){
		  item_name=vv.item_name
	  }
  })
  itemIds.value.push({
    item_id: itemId.value,
	item_name:item_name,
    zu_name: multipleList.value[multipleIndex.value]["0"]["zu_name"],
  });
  if (multipleIndex.value == multipleList.value.length - 1) {
	  $store.setDuoXuanYi(itemIds.value);
	  popupMultiple.value.close();
    uni.navigateTo({
      url: "/pages/main/tj/tjxq?groupId=" + groupInfo.group_id,
    });
    return;
  }
  itemId.value = "";
  multipleIndex.value = multipleIndex.value + 1;
};
onShow(() => {
  if (!!config_ref.value) {
    getPersonList();
  }
});
</script>
<template>
  <DraggableButton />
  <view>
	  <uni-popup ref="popupMultiple" class="w-full">
	    <view class="rounded-10rpx px-20rpx pb-55rpx box-border bg-#fff w-95vw">
	      <view
	        class="center relative pt-40rpx pb-30rpx text-36rpx rounded-t-15rpx box-border"
	      >
	        <text class="line-height-[1] text-32rpx">请选择</text>
	        <uni-icons
	          @click="popupMultiple.close()"
	          type="closeempty"
	          color="#A6A6A6"
	          size="26"
	          class="absolute right-40rpx"
	        ></uni-icons>
	      </view>
	      <view class="bg-#F8F8F8 px-20rpx box-border rounded-10rpx">
	        <view
	          v-for="(item, index) in multipleList[multipleIndex]['item_list']"
	          :key="index"
	          @click="itemId = item.item_id"
	          class="px-20rpx box-border b-b-1 b-#EAEAEA b-solid bs between h-100rpx"
	        >
	          <text class="text-#000000 text-30rpx">{{ item.item_name }}</text>
	          <view class="center">
	            <text class="text-#EC3D15 text-20rpx mt-10rpx mr-5rpx">¥</text>
	            <text class="text-#EC3D15 text-32rpx mb-0">{{ item.price }}</text>
	            <uni-icons
	              class="ml-28rpx"
	              color="#239EA3"
	              :type="itemId == item.item_id ? 'checkbox-filled' : 'circle'"
	              size="30"
	            ></uni-icons>
	          </view>
	        </view>
	      </view>
	      <view class="text-#239EA3 text-28rpx my-45rpx text-center"
	        >当前套餐包含一个可自由{{
	          multipleList[multipleIndex]["item_list"].length
	        }}选1的体检项目，请<br />根据您的实际情况自行选择。</view
	      >
	      <view
	        class="w-270rpx h-80rpx bg-#239EA3 center text-#F8F8F8 text-30rpx rounded-10rpx mx-auto"
	        @click="nextItemClick()"
	        >{{
	          multipleIndex == multipleList.length - 1 ? "确定" : "下一项"
	        }}</view
	      >
	    </view>
	  </uni-popup>
    <view v-if="!!$store.config">
      <view :ref="configRef"></view>
    </view>
    <view class="person_list_wrapper">
      <view
        class="person_item_wrapper"
        v-for="(i, k) in person_list"
        :key="k"
        @click="choosePersonClick(i)"
      >
        <view class="person_avatar_wrapper">
          <image v-if="i.sex === 1" src="@/static/assets/userm.png"></image>
          <image v-else src="@/static/assets/userw.png"></image>
        </view>
        <view class="person_info_wrapper">
          <view class="person_text_wrapper">
            <view class="person_name_wrapper">{{ i.name }}</view>
            <view class="person_sex_wrapper"
              >{{ i.sex === 1 ? "男" : "女" }}性</view
            >
          </view>
          <view class="person_idnumber_wrapper">{{ i.birthday }}</view>
        </view>
        <view v-if="!!i.relation" class="person_type_wrapper">{{
          i.relation
        }}</view>
        <view class="person_type_wrapper">本人</view>
        <!-- <view v-if="i.is_default === 2" @click="choosePersonClick(i)" class="person_choose_wrapper">切换</view> -->
      </view>
    </view>
    <uni-popup ref="popup">
      <view
        class="center relative pt-47rpx pb-32rpx text-36rpx bg-#fff rounded-t-15rpx box-border"
      >
        <text class="line-height-[1] text-32rpx">请选择单位</text>
        <uni-icons
          @click="popup.close()"
          type="closeempty"
          color="#A6A6A6"
          size="26"
          class="absolute right-40rpx top-30rpx"
        ></uni-icons>
      </view>
      <view class="bg-#fff pb-40rpx">
        <view
          class="pt-20rpx pb-20rpx texdt-28rpx text-center"
          v-for="(i, k) in unitList"
          :key="k"
          @click="getGroupCombo(i)"
          >{{ i.group_name }}</view
        >
      </view>
    </uni-popup>
  </view>
</template>
<style scoped>
.person_list_wrapper {
  width: 750rpx;
  margin: 0 auto;
  overflow-y: auto;
}

.person_item_wrapper {
  width: 690rpx;
  height: 166rpx;
  background: #ffffff;
  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
  border-radius: 15rpx;
  position: relative;
  display: flex;
  align-items: center;
  margin: 20rpx auto 0;
}

.person_avatar_wrapper {
  width: 105rpx;
  height: 105rpx;
  margin-left: 47rpx;
}

.person_avatar_wrapper image {
  width: 105rpx;
  height: 105rpx;
  display: inline-block;
  object-fit: contain;
}

.person_info_wrapper {
  margin-left: 38rpx;
}

.person_text_wrapper {
  display: flex;
  align-items: end;
}

.person_name_wrapper {
  font-weight: 500;
  font-size: 32rpx;
  color: #0e0e0e;
  line-height: 1;
}

.person_sex_wrapper {
  font-size: 24rpx;
  color: #9e9e9e;
  line-height: 1;
  margin-left: 10rpx;
}

.person_idnumber_wrapper {
  font-size: 26rpx;
  color: #0e0e0e;
  line-height: 1;
  margin-top: 20rpx;
}

.person_type_wrapper {
  position: absolute;
  width: 100rpx;
  height: 46rpx;
  background: #c0c0c0;
  border-radius: 0rpx 15rpx 0rpx 15rpx;
  right: 0;
  top: 0;
  font-weight: 500;
  font-size: 24rpx;
  color: #ffffff;
  line-height: 46rpx;
  text-align: center;
}

.person_choose_wrapper {
  position: absolute;
  right: 10rpx;
  bottom: 10rpx;
  width: 130rpx;
  height: 50rpx;
  background: #239ea3;
  border-radius: 25rpx;
  font-weight: 400;
  font-size: 22rpx;
  color: #ffffff;
  line-height: 50rpx;
  text-align: center;
}
</style>
