sl-sfy-safety/src/views/cameras/preview/store/useFenceStore.ts

import {
  GetFenceParams,
  getFenceApi,
  saveFenceApi,
  SaveFenceParams,
} from '@/api/camera/camera-preview';
import { defineStore } from 'pinia';
import { ref } from 'vue';
import { ServerLines } from '../components/FenceEditor/constants';

/** 当前电子围栏的store */
export const useFenceStore = defineStore('electronicFencePolygonStore', () => {
  /** 后端返回的电子围栏点 */
  const serverFencePoints = ref<ServerLines>([]);
  /** 当前编辑的电子围栏的点 */
  const currentFencePoints = ref([]);
  const currentFenceId = ref<number>();

  /** 获取电子围栏 */
  const getFence = (param: GetFenceParams) => {
    // return new Promise((resolve) => {
    //   setTimeout(() => {
    //     const res = {
    //       id: 2,
    //       electronicFencePolygon:
    //         Math.random() > 0.5
    //           ? ``
    //           : `[[[150.9196038878118,103.42855053676564],[350.91958691002293,54.42855423815479],[464.91957723268325,211.42854237860183],[222.9195977758078,225.42854132106206],[60.91961152781679,175.42854509798977]],[[325.9195890322465,259.42853875275125],[534.9195712904572,249.42853950813677],[624.9195636504521,362.42853097228016],[509.91957341268073,380.4285296125862],[309.91959039046964,345.4285322564356]]]`,
    //     };
    //     currentFenceId.value = res.id;
    //     const points = res.electronicFencePolygon
    //       ? (JSON.parse(res.electronicFencePolygon) as [])
    //       : [];
    //     currentFencePoints.value = points;
    //     serverFencePoints.value = points;
    //     resolve();
    //   }, 200);
    // });

    return getFenceApi(param).then((res) => {
      currentFenceId.value = res.id;
      const points = res.electronicFencePolygon
        ? (JSON.parse(res.electronicFencePolygon) as [])
        : [];
      currentFencePoints.value = points;
      serverFencePoints.value = points;
    });
  };

  const saveFence = (param: SaveFenceParams) => {
    return saveFenceApi(param).then((res) => {
      console.log('save success', res);
    });
  };

  return { serverFencePoints, currentFencePoints, currentFenceId, getFence, saveFence };
});

export default useFenceStore;