Fuyuu
/
dt-admin-pc-v2
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

提交earthObj

master
Fuyuu 9 months ago
parent
e660abd872
commit
3dfea5cd50
1 changed files with 267 additions and 225 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 426
      src/utils/earthMap/earthObj.ts

426
src/utils/earthMap/earthObj.ts
View File

@ -1,7 +1,7 @@
/**
* 创建、删除各种标绘元素
*/
import earthUtils from "@/utils/earthMap/earth"
import earthUtils from '@/utils/earthMap/earth';
// 位置
interface Position {
@ -19,33 +19,33 @@ interface Position {
* @param name 监控点名称
* @param customProp 自定义数据 (JSON)
*/
export const addMonitorPin = (pos: number[], name = "0", customProp = ""): unknown => {
export const addMonitorPin = (pos: number[], name = '0', customProp = ''): unknown => {
const pin = new window.XE.Obj.Pin(window.$earth);
const objConfig = {
xbsjType: "Pin",
xbsjType: 'Pin',
name: `jkd_${name}`,
position: pos,
customProp: customProp,
// imageUrl: "./assets/image/camera.png",
imageUrl: " ",
imageUrl: ' ',
far: 2000, //最远可视距离
near: 1,
pinBuilder: {
// extText: "相机名称",
extText: JSON.parse(customProp).labelName,
extTextFont: "34px 楷体",
extTextFont: '34px 楷体',
extTextPixelOffset: [20, -45],
fillColor: [1, 1, 1, 0.9],
outlineColor: [0, 0, 0, 0.9]
}
outlineColor: [0, 0, 0, 0.9],
},
};
pin.xbsjFromJSON(objConfig);
//移入移出事件
pin.onmouseover = () => {
window.$earth.czm.viewer._container.style.cursor = "pointer";
window.$earth.czm.viewer._container.style.cursor = 'pointer';
};
pin.onmouseout = () => {
window.$earth.czm.viewer._container.style.cursor = "default";
window.$earth.czm.viewer._container.style.cursor = 'default';
};
//方案二 监听相机与监控点的距离 显示/隐藏图案
@ -63,7 +63,6 @@ export const addMonitorPin = (pos: number[], name = "0", customProp = ""): unkno
// });
// console.log(pin);
//方案三 监听相机的高度 显示/隐藏图案
// window.XE.MVVM.watch(window.$earth.camera, 'position', (res :any) => {
// // [2.114222042695852, 0.6632251044444447, 10000000]
@ -79,7 +78,7 @@ export const addMonitorPin = (pos: number[], name = "0", customProp = ""): unkno
// });
return pin;
}
};
/**
* 创建视域
@ -108,18 +107,17 @@ export const addViewShed = (pos: number[], rot: number[], near = 1, far = 200, f
// }
// viewShed.xbsjFromJSON(objConfig);
// console.log('viewShed',viewShed);
viewShed.name = "视域分析"
viewShed.position = pos
viewShed.rotation = rot
viewShed.fovH = window.Cesium.Math.toRadians(fovH)
viewShed.fovV = window.Cesium.Math.toRadians(fovV)
viewShed.far = far
viewShed.near = near
viewShed.name = '视域分析';
viewShed.position = pos;
viewShed.rotation = rot;
viewShed.fovH = window.Cesium.Math.toRadians(fovH);
viewShed.fovV = window.Cesium.Math.toRadians(fovV);
viewShed.far = far;
viewShed.near = near;
viewShed.show = true;
viewShed.ref = "viewshed";
viewShed.ref = 'viewshed';
return viewShed;
}
};
/**
* 创建视频融合
@ -133,8 +131,8 @@ export const addViewShed = (pos: number[], rot: number[], near = 1, far = 200, f
export const addCameraVideo = (videoUrl: string, pos: number[], rot: number[], fovH: number, fovV: number, near_far = [1, 169.4]): unknown => {
const cameraVideo = new window.XE.Obj.CameraVideo(window.$earth);
const objConfig = {
xbsjType: "CameraVideo",
name: "视频融合",
xbsjType: 'CameraVideo',
name: '视频融合',
videoUrl: videoUrl,
position: pos,
rotation: rot,
@ -142,41 +140,44 @@ export const addCameraVideo = (videoUrl: string, pos: number[], rot: number[], f
fovV: fovV,
far: near_far[1],
near: near_far[0],
showHelper: false
}
showHelper: false,
};
cameraVideo.xbsjFromJSON(objConfig);
return cameraVideo;
}
};
//创建模型气泡窗
export const addGeoPin = (pos: Position = {
export const addGeoPin = (
pos: Position = {
// 经度
longitude: 0,
// 纬度
latitude: 0,
// 高度
height: 0,
}, lab = {
},
lab = {
// 高
height: 100,
// 纬度
width: 150,
// 高度
fontSize: 25,
}, content = ''): any => {
},
content = ''
): any => {
const geoPin = new window.XE.Obj.Plots.GeoPin(window.$earth);
const objConfig = {
xbsjType: "GeoPin",
name: "气泡窗",
xbsjType: 'GeoPin',
name: '气泡窗',
position: [pos.longitude, pos.latitude, pos.height],
labmodel: [lab.height, lab.width, lab.fontSize],
far: 1073741824,
innerHTML: pinName(lab, content)
}
innerHTML: pinName(lab, content),
};
geoPin.xbsjFromJSON(objConfig);
return geoPin;
}
};
//修改气泡窗名称
// export function pinName ( name: string = '', img: any = `${require('@/assets/image/dialog.png')}`)
@ -197,33 +198,28 @@ export function pinName(labmodel: any, name = '', img: any = `${require('@/asset
<div style="display:table;height:85%;width:100%">
<span style="display:table-cell;text-align:center;vertical-align:middle;font-size:${labmodel.fontSize}px;color:rgba(154,205,255,0.9)">${name}</span>
</div>
</div>`
</div>`;
}
//创建3DTiles
export const addTileset = (): void => {
const tileset = new window.XE.Obj.Tileset(window.$earth)
const tileset = new window.XE.Obj.Tileset(window.$earth);
const objConfig = {
ref: "bim_indoor",
ref: 'bim_indoor',
czmObject: {
xbsjType: "Tileset",
name: "indoor",
xbsjPosition: [
1.9637768112887974,
0.576622643409596,
0.2
],
xbsjType: 'Tileset',
name: 'indoor',
xbsjPosition: [1.9637768112887974, 0.576622643409596, 0.2],
xbsjUseOriginTransform: false,
url: "./assets/3dtiles/D/indoor/tileset.json",
}
}
url: './assets/3dtiles/D/indoor/tileset.json',
},
};
tileset.xbsjFromJSON(objConfig);
}
};
//创建漫游路径
export const addRoamPath = (param: any): unknown => {
let { pathname, positions, rotations, currentspeed, alwaysalongthepath, loopplay } = param
let { pathname, positions, rotations, currentspeed, alwaysalongthepath, loopplay } = param;
positions = JSON.parse(positions);
rotations = JSON.parse(rotations);
@ -231,7 +227,7 @@ export const addRoamPath = (param: any): unknown => {
loopplay = loopplay == 1 ? true : false;
const path = new window.XE.Obj.Path(window.$earth);
const objConfig = {
xbsjType: "Path",
xbsjType: 'Path',
name: pathname,
positions,
rotations,
@ -240,33 +236,42 @@ export const addRoamPath = (param: any): unknown => {
playing: true,
loopPlay: loopplay,
alwaysAlongThePath: alwaysalongthepath,
}
};
path.xbsjFromJSON(objConfig);
path.cameraAttached = true;
path.currentShow = false;
return path;
}
};
//创建指向箭头
export const addArrow = (positions: Array<Array<number>>, imgUrl = "./assets/image/arrow.png") => {
const road = new window.XE.Obj.Road(window.$earth)
export const addArrow = (positions: Array<Array<number>>, imgUrl = './assets/image/arrow.png') => {
const road = new window.XE.Obj.Road(window.$earth);
const objConfig = {
xbsjType: "Road",
name: "arrow",
xbsjType: 'Road',
name: 'arrow',
positions: positions,
width: 5,
imageUrl: imgUrl
}
imageUrl: imgUrl,
};
road.xbsjFromJSON(objConfig);
return road
}
return road;
};
//创建视频图元
export const addCustomPrimitive = (lon: number, lat: number, height: number, imgUrl: string, rt = [0, 0, 0], id = '', pathId = '', deviceUid = '', scale = [1, 5, 4]) => {
export const addCustomPrimitive = (
lon: number,
lat: number,
height: number,
imgUrl: string,
rt = [0, 0, 0],
id = '',
pathId = '',
deviceUid = '',
scale = [1, 5, 4]
) => {
const cp = new window.XE.Obj.CustomPrimitive(window.$earth);
const objConfig = {
xbsjType: "CustomPrimitive",
xbsjType: 'CustomPrimitive',
position: [window.Cesium.Math.toRadians(lon), window.Cesium.Math.toRadians(lat), height],
rotation: rt,
scale,
@ -275,15 +280,15 @@ export const addCustomPrimitive = (lon: number, lat: number, height: number, img
indices: [0, 1, 2, 0, 2, 3],
renderState: {
cull: {
enabled: true
enabled: true,
},
polygonOffset: {},
scissorTest: {
rectangle: {}
rectangle: {},
},
depthRange: {},
depthTest: {
enabled: true
enabled: true,
},
colorMask: {},
depthMask: false,
@ -294,13 +299,13 @@ export const addCustomPrimitive = (lon: number, lat: number, height: number, img
equationAlpha: 32774,
functionSourceRgb: 770,
functionDestinationRgb: 771,
functionDestinationAlpha: 771
functionDestinationAlpha: 771,
},
stencilTest: {
frontOperation: {},
backOperation: {}
backOperation: {},
},
sampleCoverage: {}
sampleCoverage: {},
},
color: [1, 1, 1, 1],
canvasWidth: 500,
@ -312,80 +317,112 @@ export const addCustomPrimitive = (lon: number, lat: number, height: number, img
pathId,
deviceUid,
// imageUrl: "http://192.168.1.200:8080/live/44040000001320000002@44040000001320000002.m3u8"
}
};
cp.xbsjFromJSON(objConfig);
return cp;
}
};
// 创建船只贴地图片
export const addShipGroundImg = (lon: number, lat: number, height: number, imgUrl: string, rt: number, trackId: number) => {
const shipGroundImg = new window.XE.Obj.GroundImage(window.$earth);
const objConfig = {
name: `${trackId}号船只`,
trackId,
position: [window.Cesium.Math.toRadians(lon), window.Cesium.Math.toRadians(lat), height],
loopPlay: false,
imageUrls: [imgUrl],
rotation: -(Math.PI / 180) * rt,
ground: false,
};
shipGroundImg.xbsjFromJSON(objConfig);
return shipGroundImg;
};
// 创建船只轨迹
export const addShipTrack = (positions: number[][]) => {
const shipTrack = new window.XE.Obj.Polyline(window.$earth);
const objConfig = {
width: 2.0,
positions,
material: {
type: 'XbsjPolylineDashMaterial',
XbsjPolylineDashMaterial: {
color: [1, 1, 0.03, 1],
},
},
ground: true,
};
shipTrack.xbsjFromJSON(objConfig);
return shipTrack;
};
//创建报警扫描线
export const addScanline = (pos: number[], radius: number, timeDuration: number): unknown => {
const sl = new window.XE.Obj.Scanline(window.$earth);
const objConfig = {
xbsjType: "Scanline",
name: "报警扫描线",
xbsjType: 'Scanline',
name: '报警扫描线',
position: pos,
radius: radius,
color: [1, 0.09803921568627451, 0, 1],
timeDuration: timeDuration,
playing: true
}
playing: true,
};
sl.xbsjFromJSON(objConfig);
return sl;
}
};
//创建属性展示牌
export const addBillboard = async (pos: number[], rot: number[], type: string, canvas: number[]): Promise<any> => {
const cp = new window.XE.Obj.CustomPrimitive(window.$earth);
const objConfig = {
"position": pos,
"rotation": rot,
"scale": [15, 15, 10],
"positions": [0, -1, 0, 0, 1, 0, 0, 1, 2, 0, -1, 2, 0, 1, 0, 0, -1, 0, 0, -1, 2, 0, 1, 2],
"sts": [0, 0, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1],
"indices": [0, 1, 2, 0, 2, 3, 4, 5, 6, 4, 6, 7],
"renderState": {
"cull": {
"enabled": true
},
"polygonOffset": {},
"scissorTest": {
"rectangle": {}
},
"depthRange": {},
"depthTest": {
"enabled": true
},
"colorMask": {},
"depthMask": true,
"blending": {
"enabled": true,
"color": {},
"equationRgb": 32774,
"equationAlpha": 32774,
"functionSourceRgb": 770,
"functionDestinationRgb": 771,
"functionDestinationAlpha": 771
},
"stencilTest": {
"frontOperation": {},
"backOperation": {}
},
"sampleCoverage": {}
},
"canvasWidth": canvas[0],
"canvasHeight": canvas[1],
"autoRegisterEditing": true
}
position: pos,
rotation: rot,
scale: [15, 15, 10],
positions: [0, -1, 0, 0, 1, 0, 0, 1, 2, 0, -1, 2, 0, 1, 0, 0, -1, 0, 0, -1, 2, 0, 1, 2],
sts: [0, 0, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1],
indices: [0, 1, 2, 0, 2, 3, 4, 5, 6, 4, 6, 7],
renderState: {
cull: {
enabled: true,
},
polygonOffset: {},
scissorTest: {
rectangle: {},
},
depthRange: {},
depthTest: {
enabled: true,
},
colorMask: {},
depthMask: true,
blending: {
enabled: true,
color: {},
equationRgb: 32774,
equationAlpha: 32774,
functionSourceRgb: 770,
functionDestinationRgb: 771,
functionDestinationAlpha: 771,
},
stencilTest: {
frontOperation: {},
backOperation: {},
},
sampleCoverage: {},
},
canvasWidth: canvas[0],
canvasHeight: canvas[1],
autoRegisterEditing: true,
};
cp.xbsjFromJSON(objConfig);
await setDiv(cp, type, canvas);
return cp;
}
};
export function setDiv(p: any, htmlText: string, canvasWH: number[]) {
const canvas = window.XE.HTML.div2Canvas(htmlText, { width: canvasWH[0], height: canvasWH[1] });
canvas.then(
(ca: any) => {
canvas.then((ca: any) => {
// console.log(p);
p.drawCanvas((ctx: any) => {
@ -394,9 +431,7 @@ export function setDiv(p: any, htmlText: string, canvasWH: number[]) {
ctx.clearRect(0, 0, canvasWH[0], canvasWH[1]);
ctx.drawImage(ca, 0, 0);
});
}
)
});
}
//创建单体化模型
@ -423,25 +458,35 @@ export const addHCZ = (param: any): unknown => {
//移入事件
cp.onmouseover = (e: any) => {
e.id.color = JSON.parse(param.color);
window.$earth.czm.viewer._container.style.cursor = "pointer";
window.$earth.czm.viewer._container.style.cursor = 'pointer';
};
//移出事件
cp.onmouseout = (e: any) => {
e.id.color = cpColorTP;
window.$earth.czm.viewer._container.style.cursor = "default";
window.$earth.czm.viewer._container.style.cursor = 'default';
};
//点击事件
cp.onclick = () => {
cp.onmouseover = () => { }
cp.onmouseout = () => { }
cp.onmouseover = () => {};
cp.onmouseout = () => {};
};
return cp;
}
export const addCanvas = (lon: number, lat: number, height: number, imgUrl: string, rt = [0, 0, 0], id = '', scale = [1, 5, 4], pathId = '', deviceUid = '') => {
};
export const addCanvas = (
lon: number,
lat: number,
height: number,
imgUrl: string,
rt = [0, 0, 0],
id = '',
scale = [1, 5, 4],
pathId = '',
deviceUid = ''
) => {
const cp = new window.XE.Obj.CustomPrimitive(window.$earth);
const objConfig = {
xbsjType: "CustomPrimitive",
xbsjType: 'CustomPrimitive',
position: [lon, lat, height],
rotation: rt,
scale,
@ -450,15 +495,15 @@ export const addCanvas = (lon: number, lat: number, height: number, imgUrl: stri
indices: [0, 1, 2, 0, 2, 3, 4, 5, 6, 4, 6, 7],
renderState: {
cull: {
enabled: true
enabled: true,
},
polygonOffset: {},
scissorTest: {
rectangle: {}
rectangle: {},
},
depthRange: {},
depthTest: {
enabled: true
enabled: true,
},
colorMask: {},
depthMask: false,
@ -469,13 +514,13 @@ export const addCanvas = (lon: number, lat: number, height: number, imgUrl: stri
equationAlpha: 32774,
functionSourceRgb: 770,
functionDestinationRgb: 771,
functionDestinationAlpha: 771
functionDestinationAlpha: 771,
},
stencilTest: {
frontOperation: {},
backOperation: {}
backOperation: {},
},
sampleCoverage: {}
sampleCoverage: {},
},
color: [1, 1, 1, 1],
canvasWidth: 500,
@ -486,10 +531,10 @@ export const addCanvas = (lon: number, lat: number, height: number, imgUrl: stri
id,
pathId,
deviceUid,
}
};
cp.xbsjFromJSON(objConfig);
return cp;
}
};
//循环删除所有entity对象
export const deleteAllEntity = (objName: string): void => {
const entities = window.$earth.czm.viewer.entities._entities._array;
@ -499,32 +544,39 @@ export const deleteAllEntity = (objName: string): void => {
i--;
}
}
}
};
//创建看板
export const productionBoard = (lon: number, lat: number, height: number, imgUrl: string, rt = [0, 0, 0], scale = [1, 5, 4], canvas: number[] = [521, 298]) => {
export const productionBoard = (
lon: number,
lat: number,
height: number,
imgUrl: string,
rt = [0, 0, 0],
scale = [1, 5, 4],
canvas: number[] = [521, 298]
) => {
const cp = new window.XE.Obj.CustomPrimitive(window.$earth);
const objConfig = {
xbsjType: "CustomPrimitive",
xbsjType: 'CustomPrimitive',
position: [window.Cesium.Math.toRadians(lon), window.Cesium.Math.toRadians(lat), height],
rotation: rt,
scale,
name: "看板",
name: '看板',
positions: [0, -1, 0, 0, 1, 0, 0, 1, 2, 0, -1, 2, 0, 1, 0, 0, -1, 0, 0, -1, 2, 0, 1, 2],
sts: [0, 0, 1, 0, 1, 1, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1],
indices: [0, 1, 2, 0, 2, 3, 4, 5, 6, 4, 6, 7],
renderState: {
cull: {
enabled: true
enabled: true,
},
polygonOffset: {},
scissorTest: {
rectangle: {}
rectangle: {},
},
depthRange: {},
depthTest: {
enabled: true
enabled: true,
},
colorMask: {},
depthMask: false,
@ -535,24 +587,23 @@ export const productionBoard = (lon: number, lat: number, height: number, imgUrl
equationAlpha: 32774,
functionSourceRgb: 770,
functionDestinationRgb: 771,
functionDestinationAlpha: 771
functionDestinationAlpha: 771,
},
stencilTest: {
frontOperation: {},
backOperation: {}
backOperation: {},
},
sampleCoverage: {}
sampleCoverage: {},
},
color: [1, 1, 1, 1],
canvasWidth: canvas[0],
canvasHeight: canvas[1],
autoRegisterEditing: true,
imageUrl: imgUrl,
}
};
cp.xbsjFromJSON(objConfig);
return cp;
}
};
//创建防区
export const defenceArea = (positions: any, color: number[], height = 3, loop = false, fenceId?: string): any => {
const dc = new window.XE.Obj.CustomPrimitive.createDynamicCountour({
@ -568,28 +619,23 @@ export const defenceArea = (positions: any, color: number[], height = 3, loop =
if (fenceId) dc.customProp = fenceId;
//移入移出事件
dc.onmouseover = () => {
window.$earth.czm.viewer._container.style.cursor = "pointer";
window.$earth.czm.viewer._container.style.cursor = 'pointer';
};
dc.onmouseout = () => {
window.$earth.czm.viewer._container.style.cursor = "default";
window.$earth.czm.viewer._container.style.cursor = 'default';
};
//这2句代码应该可以不用
//dc.setStartTime(Math.random());
//dc.setFPS(120 * Math.random());
return dc;
}
};
//创建3D模型
export const addModel = (
name: string,
url: string,
options: any = {},
hasMouseOver: boolean= true
): void => {
const tileset = new window.XE.Obj.Model(window.$earth)
export const addModel = (name: string, url: string, options: any = {}, hasMouseOver: boolean = true): void => {
const tileset = new window.XE.Obj.Model(window.$earth);
// 创建一个Model对象
const objConfig = {
xbsjType: "Model",
xbsjType: 'Model',
name: name,
url: url,
id: options.id || name,
@ -618,17 +664,16 @@ export const addModel = (
// }
return tileset
}
return tileset;
};
// 创建管控区域
export const addKeyControlArea = (name: string, image: string, height: number, positions: number[][], loop: boolean): any => {
if (!name) {
name = 'defaultKeyControlAreaName'
name = 'defaultKeyControlAreaName';
}
// 位置信息格式转换
const positionList: number[] = []
const positionList: number[] = [];
positions.map((item: number[]) => {
positionList.push(earthUtils.radianToDegree(item[0]));
positionList.push(earthUtils.radianToDegree(item[1]));
@ -644,8 +689,8 @@ export const addKeyControlArea = (name: string, image: string, height: number, p
const guid = window.Cesium.createGuid();
const material = d3Kit.getCustomMaterialWall({
image: image,
freely: "vertical",
direction: "+",
freely: 'vertical',
direction: '+',
count: 1,
color: new window.Cesium.Color(0, 0, 0, 0),
duration: 1000,
@ -657,9 +702,9 @@ export const addKeyControlArea = (name: string, image: string, height: number, p
positions: window.Cesium.Cartesian3.fromDegreesArrayHeights(positionList),
material: material,
},
}
return window.$earth.czm.viewer.entities.add(entitiesOptions)
}
};
return window.$earth.czm.viewer.entities.add(entitiesOptions);
};
/**
* 新建 Pin
@ -680,14 +725,14 @@ export const addPin = (name, url, options) => {
position: options.position,
pinBuilder: options.pinBuilder,
scale: options.scale,
}
};
if (options.far) {
objConfig.far = options.far
objConfig.far = options.far;
}
pin.xbsjFromJSON(objConfig);
return pin;
}
};
//雷达扫描范围
export const addViewShedRadar = (pos, far = 60, left = -30, right = 30, rgba = [0, 1, 0, 0.5]) => {
@ -698,25 +743,22 @@ export const addViewShedRadar = (pos, far = 60,left=-30,right=30,rgba=[0, 1, 0,
//角度切换
for (let i = left; i < right; ) {
i += 0.01;
let clon = far * Math.sin(i * Math.PI / 180);
let clat = far * Math.cos(i * Math.PI / 180);
let ec = 6356725 + (6378137 - 6356725) * (90 - olat) / 90;
let ed = ec * Math.cos(olat * Math.PI / 180);
let jlon = (clon / ed + olon * Math.PI / 180) * 180 / Math.PI;
let jlat = (clat / ec + olat * Math.PI / 180) * 180 / Math.PI;
let clon = far * Math.sin((i * Math.PI) / 180);
let clat = far * Math.cos((i * Math.PI) / 180);
let ec = 6356725 + ((6378137 - 6356725) * (90 - olat)) / 90;
let ed = ec * Math.cos((olat * Math.PI) / 180);
let jlon = ((clon / ed + (olon * Math.PI) / 180) * 180) / Math.PI;
let jlat = ((clat / ec + (olat * Math.PI) / 180) * 180) / Math.PI;
fromDegreesArray.push(jlon, jlat);
}
fromDegreesArray.push(olon, olat);
return window.$earth._viewer.entities.add({
name: "雷达扫描范围",
name: '雷达扫描范围',
polygon: {
hierarchy: window.Cesium.Cartesian3.fromDegreesArray(
fromDegreesArray
),
hierarchy: window.Cesium.Cartesian3.fromDegreesArray(fromDegreesArray),
//颜色透明度
material: new window.Cesium.Color(rgba[0], rgba[1], rgba[2], rgba[3]),
zIndex:11111
}
})
}
zIndex: 11111,
},
});
};

Write Preview
Loading…
Cancel
Save