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 {base64ToBlob, blobToBase64, debounce, getId} from "@/utils"; import {watch} from "vue"; import {params} from "@/hook"; import router, {writeRouteName} from "@/router"; import {baseURL} from "@/dbo/main"; import {defaultUses, uses} from '@/store/SVGLabel' const global = window as any; let count = 0; export const api = !global.android // true ? // 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 as string; }, async downloadImage(file) { window.open(URL.createObjectURL(file)); return true; }, async getFile(url) { if (url.includes(baseURL)) { url = url.substring(baseURL.length); } url = url.trim(); const paths = url.split("/") const notBase64BaseTypes = [ ".png", ".jpg" ] const notBase64 = notBase64BaseTypes.some(type => paths[paths.length - 1].includes(type)) if (notBase64) { // await new Promise(resolve => setTimeout(resolve, 2000)) return baseURL + url } else { const data = await axios.get(url, { responseType: "blob" }); const base64 = await blobToBase64(data.data); return URL.createObjectURL(base64ToBlob(base64)) } }, async photograph() { const file = await new Promise(resolve => { const input = document.createElement('input'); input.type = 'file'; input.click(); input.addEventListener("change", ev => { resolve(input.files[0]) }) }) return await this.uploadImage(file) }, async selectPhotoAlbum() { return await this.photograph() }, async closePage() { return router.push({ name: writeRouteName.scene }); }, } : { setStore(data) { return new Promise((resolve) => { console.log("调用setSceneStore参数", JSON.stringify(data)); global.setSceneStoreCallback = (data) => { console.log("setSceneStoreCallback返回", data); resolve(data); }; global.android.setSceneStore( params.m + "/store.json", JSON.stringify(data), "setSceneStoreCallback" ); }); }, getStore() { return new Promise((resolve) => { console.log("调用getSceneStore"); global.getSceneStoreCallback = (data) => { console.log("getSceneStoreCallback返回", data); resolve(data); }; global.android.getSceneStore(params.m + "/store.json", "getSceneStoreCallback"); }); }, async getFile(fileUrl: string) { fileUrl = fileUrl.trim(); if (fileUrl.includes(params.m)) { fileUrl = fileUrl.substring(fileUrl.indexOf(params.m) + params.m.length) } fileUrl = new URL(fileUrl, "http://www.a.com").pathname fileUrl = (params.realPath || params.m) + fileUrl const paths = fileUrl.split("/") const notBase64BaseTypes = [ // ".png", ".jpg" // , ".bin" ] const notBase64 = notBase64BaseTypes.some(type => paths[paths.length - 1].includes(type)) if (!notBase64) { return await new Promise((resolve) => { const apiName = `getImageCallback${count++}` global[apiName] = (base64) => { // console.error("请求url:" + fileUrl, "返回:" + base64.substring(0, 60)) resolve(URL.createObjectURL(base64ToBlob(base64))); delete global[apiName] }; global.android.getImage(fileUrl, apiName); }); } else { console.log("图片文件直接文件系统读取", fileUrl) return fileUrl } }, uploadImage(file: File) { return new Promise(async (resolve) => { const apiName = `uploadImageCallback${count++}` global[apiName] = (data) => { console.log("上传图片成功,返回路径为:", data) resolve(data); delete global[apiName] } const data = await blobToBase64(file); // console.log("上传图片", params.m + "/" + file.name, "参数:", data); global.android.uploadImage(params.m + "/attach/upload/" + file.name, data, apiName); }); }, downloadImage(file: File) { return new Promise(async (resolve) => { const apiName = `downloadImageCallback${count++}` global[apiName] = () => { console.log("已成功下载") resolve(true); delete global[apiName] } const data = await blobToBase64(file); // file为base64 console.log("下载图片", file.name); global.android.downloadImage(file.name, data, apiName); }); }, photograph() { return new Promise((resolve) => { const apiName = `photograph${count++}` global[apiName] = (data) => { console.log("拍照后路径:", data) resolve(data); delete global[apiName] } global.android.cameraPhotograph(params.m, apiName); }); }, selectPhotoAlbum() { return new Promise((resolve) => { const apiName = `selectPhotoAlbum${count++}` global[apiName] = (data) => { console.log("获得相册图片路径:", data) resolve(data); delete global[apiName] } global.android.selectPhotoAlbum(params.m, apiName); }); }, closePage() { return new Promise((resolve) => { global.closeWebViewCallback = resolve; global.android.closeWebView('closeWebViewCallback'); }); }, }; 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 || []; uses.value = data?.uses || defaultUses syncSceneStore(); console.log("开始同步syncSceneStore") }; export const updateSceneStore = debounce(api.setStore, 300); 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" }); return await api.downloadImage(file); }; const syncSceneStore = () => { return watch( () => ({ measures: list.value, baseLines: baseLines.value, basePoints: basePoints.value, fixPoints: fixPoints.value, photos: photos.value, uses: uses.value, accidentPhotos: accidentPhotos.value, roadPhotos: roadPhotos.value, }), (data) => { console.log("监听到数据变化,自动保存store") updateSceneStore(data); }, { deep: true } ); }; // // // if (global.android) { // const isEditInput = (dom: HTMLElement) => { // const tagName = dom.tagName.toUpperCase(); // const isInput = tagName === "INPUT" // const isTextarea = tagName === "TEXTAREA" // console.log(isInput && dom.getAttribute("type") === "text") // if (!(isInput && dom.getAttribute("type") === "text") && !isTextarea) { // return false; // } // console.log("???") // return !dom.hasAttribute("readonly") // } // document.documentElement.addEventListener('focusin', ev => { // console.log("获得焦点") // console.log(ev.target) // if (isEditInput(ev.target as HTMLElement)) { // global.android.inputMethodManager(true); // } // }) // document.documentElement.addEventListener('focusout', ev => { // console.log("失去焦点") // console.log(ev.target) // if (isEditInput(ev.target as HTMLElement)) { // global.android.inputMethodManager(false); // } // }) // // } loadStore().catch((e) => { console.error(e); alert("场景数据加载失败"); });