|
@@ -32,6 +32,7 @@ import { SGraphEdit } from "..";
|
|
|
import { Marker } from "../type/Marker";
|
|
|
import { ItemOrder } from '@persagy-web/big/lib';
|
|
|
import { SMouseEvent } from '@persagy-web/base/lib';
|
|
|
+import { svgTobase64 } from "@persagy-web/big-edit/lib/until"
|
|
|
|
|
|
/**
|
|
|
* 图片编辑类
|
|
@@ -56,7 +57,7 @@ export class SBaseImageEdit extends SGraphEdit {
|
|
|
} // Set data
|
|
|
|
|
|
// default url key
|
|
|
- defaultUrl:string = '';
|
|
|
+ defaultUrl: string = '';
|
|
|
/** 起始锚点 */
|
|
|
startItem: SGraphItem | null = null;
|
|
|
/** 结束锚点 */
|
|
@@ -129,39 +130,12 @@ export class SBaseImageEdit extends SGraphEdit {
|
|
|
return this._url;
|
|
|
}
|
|
|
set url(v: string) {
|
|
|
- this._url = v;
|
|
|
- this.img = new Image();
|
|
|
- this.img.onload = (e): void => {
|
|
|
- const isiOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
|
|
|
- if (isiOS) {
|
|
|
- this.isLoadOver = true;
|
|
|
- this.computeImgSize();
|
|
|
- this.$emit("imgLoadOver");
|
|
|
- this.update();
|
|
|
- } else {
|
|
|
- // @ts-ignore
|
|
|
- const imgSrc = e.path[0].src;
|
|
|
- if (this.isUrlIdentical(imgSrc)) {
|
|
|
- this.isLoadOver = true;
|
|
|
- this.computeImgSize();
|
|
|
- this.$emit("imgLoadOver");
|
|
|
- this.update();
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
-
|
|
|
- this.img.onerror = (e): void => {
|
|
|
- // @ts-ignore
|
|
|
- const imgSrc = e.path[0].src;
|
|
|
- if (this.isUrlIdentical(imgSrc)) {
|
|
|
- this.isLoadOver = false;
|
|
|
- this.$emit("imgLoadOver");
|
|
|
- this.update();
|
|
|
- console.log("加载图片错误!", e);
|
|
|
- }
|
|
|
- };
|
|
|
-
|
|
|
- this.img.src = v;
|
|
|
+ // 处理svg
|
|
|
+ if (v.endsWith('.svg')) {
|
|
|
+ this.initSvg(v)
|
|
|
+ } else {
|
|
|
+ this.initUrl(v)
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/** 锚点 list */
|
|
@@ -279,12 +253,67 @@ export class SBaseImageEdit extends SGraphEdit {
|
|
|
}// Function inData()
|
|
|
|
|
|
/**
|
|
|
+ * 初始化svgurl
|
|
|
+ *
|
|
|
+ * @param v url字符串
|
|
|
+ */
|
|
|
+ initSvg(v: any) {
|
|
|
+ this._url = v;
|
|
|
+ svgTobase64(this.url).then((res) => {
|
|
|
+ this.initUrl(res)
|
|
|
+ }).catch((res) => {
|
|
|
+ this.initUrl(res)
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 初始化url
|
|
|
+ *
|
|
|
+ * @param v url字符串
|
|
|
+ */
|
|
|
+ initUrl(v: any) {
|
|
|
+ this._url = v;
|
|
|
+ this.img = new Image();
|
|
|
+ this.img.onload = (e): void => {
|
|
|
+ const isiOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
|
|
|
+ if (isiOS) {
|
|
|
+ this.isLoadOver = true;
|
|
|
+ this.computeImgSize();
|
|
|
+ this.$emit("imgLoadOver");
|
|
|
+ this.update();
|
|
|
+ } else {
|
|
|
+ // @ts-ignore
|
|
|
+ const imgSrc = e.path[0].src;
|
|
|
+ if (this.isUrlIdentical(imgSrc)) {
|
|
|
+ this.isLoadOver = true;
|
|
|
+ this.computeImgSize();
|
|
|
+ this.$emit("imgLoadOver");
|
|
|
+ this.update();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ this.img.onerror = (e): void => {
|
|
|
+ // @ts-ignore
|
|
|
+ const imgSrc = e.path[0].src;
|
|
|
+ if (this.isUrlIdentical(imgSrc)) {
|
|
|
+ this.isLoadOver = false;
|
|
|
+ this.$emit("imgLoadOver");
|
|
|
+ this.update();
|
|
|
+ console.log("加载图片错误!", e);
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ this.img.src = v;
|
|
|
+ }
|
|
|
+
|
|
|
+ /**
|
|
|
* 将类中得数据转换为方便存储格式的方法
|
|
|
*
|
|
|
* @return 针对 item 类型保持相应的格式
|
|
|
*/
|
|
|
toData(): any {
|
|
|
- if(!this.data){
|
|
|
+ if (!this.data) {
|
|
|
return
|
|
|
}
|
|
|
if (this.data.size) {
|