traffic-laser/src/store/sync.ts

import axios from '@/dbo/main'
import { list } from "@/store/measure";
import {baseLines} from "@/store/baseLine";
import {basePoints} from "@/store/basePoint";
import {fixPoints} from "@/store/fixPoint";
import {photos} from "@/store/photos";
import {accidentPhotos} from "@/store/accidentPhotos";
import {roadPhotos} from "@/store/roadPhotos";
import {debounce, getId} from '@/utils'
import {watch} from "vue";
import {params} from "@/hook";
import router from "@/router";

const global = window as any
const api = import.meta.env.DEV && !global.android
// const api = import.meta.env.DEV
  ? {
      async setStore(data) {
        return axios.post("sceneStore", data)
      },
      async getStore() {
        return (await axios.get("/attach/sceneStore")).data
      },
      async uploadImage(file) {
        return (await axios({
          url: "/upload",
          headers: { "Content-Type": "multipart/form-data" },
          method: 'post',
          data: { file }
        })).data.data
      },
      async downloadImage(file) {
        window.open(URL.createObjectURL(file))
      },
      closePage() {

      }
    }
  : {
    setStore(data) {
      return new Promise(resolve => {
        global.android.setSceneStore(params.m, data)
        global.setSceneStoreCallback = resolve
      })
    },
    getStore() {
      return new Promise(resolve => {
        global.getSceneStoreCallback = resolve
        global.android.getSceneStore(params.m)
      })
    },
    uploadImage(file) {
      return new Promise(resolve => {
        global.uploadImageCallback = resolve
        global.android.uploadImage(params.m, file)
      })
    },
    downloadImage(file) {
      return new Promise(resolve => {
        global.downloadImageCallback = resolve
        global.android.downloadImage(params.m, file)
      })
    },
    closePage() {
      return new Promise(resolve => {
        global.closeWebViewCallback = resolve
        global.android.closeWebView()
      })

    }
  }

export const back = () => {
  if (history.state.back) {
    router.back()
  } else {
    api.closePage()
  }
}

const loadStore = async () => {
  const data: any = await api.getStore()
  list.value = data?.measures || []
  baseLines.value = data?.baseLines || []
  basePoints.value = data?.basePoints || []
  fixPoints.value = data?.fixPoints || []
  photos.value = data?.photos || []
  accidentPhotos.value = data?.accidentPhotos || []
  roadPhotos.value = data?.roadPhotos || []

  syncSceneStore()
}

export const updateSceneStore = debounce(api.setStore, 1000)
export const uploadImage = (blob: Blob) => {
  const file = new File([blob], `${getId()}.jpg`)
  return api.uploadImage(file)
}

export const downloadImage = async (data: Blob | string, name: string = getId()) => {
  const blob: Blob = typeof data === "string"
    ? (await axios.get(data, { responseType: "blob" })).data
    : data
  const file = new File([blob], name, {type: "image/jpeg"})
  await api.downloadImage(file)
}

const syncSceneStore = () => {
  return watch(
    () => ({
      measures: list.value,
      baseLines: baseLines.value,
      basePoints: basePoints.value,
      fixPoints: fixPoints.value,
      photos: photos.value,
      accidentPhotos: accidentPhotos.value,
      roadPhotos: roadPhotos.value
    }),
    (data) => {
      updateSceneStore(data)
    },
    { deep: true }
  )
}

loadStore()
  .catch((e) => {
    console.error(e)
    alert("场景数据加载失败")
  })