import { ref, watch } from 'vue';
import { defineStore } from 'pinia';
import { addPoint, addPolyLine } from '@/utils/map/mapOperation.js';
export const useDrawPointStore = defineStore('drawPointStore', () => {
  //当前患者绘制点位列表
  const currentDrawPointList = ref([]);

  //当前选中点id
  const currentSelectId = ref('');
  const currentSelectName = ref('');
  //是否开始标会
  const drawStartStatus = ref(false);

  //信息框当前展示点位index
  const infoBoxIndex = ref(0);

  //修改当前展示点位index
  const setInfoBoxIndex = (index) => {
    infoBoxIndex.value = index;
  };

  //修改是否开始绘制状态
  const setDrawStartStatus = (value) => {
    drawStartStatus.value = value;
  };

  const pushCurrentDrawPointList = (point) => {
    currentDrawPointList.value.push(point);
  };

  const modifyCurrentDrawPointList = (key, value) => {
    if (currentDrawPointList.value[infoBoxIndex.value]) {
      currentDrawPointList.value[infoBoxIndex.value][key] = value;
    }
  };

  watch(
    () => currentDrawPointList.value,
    () => {
      const pointList = currentDrawPointList.value
        .filter((item) => {
          return item.x && item.y;
        })
        .sort((pre, next) => new Date(pre.date) - new Date(next.date));
      addPoint(pointList, 'drawPoint');
      addPolyLine(pointList, 'drawLine');
    },
    {
      deep: true
    }
  );
  return {
    currentDrawPointList,
    infoBoxIndex,
    currentSelectId,
    currentSelectName,
    setInfoBoxIndex,
    drawStartStatus,
    pushCurrentDrawPointList,
    setDrawStartStatus,
    modifyCurrentDrawPointList
  };
});
