|
|
|
|
@ -10,7 +10,7 @@ import {CanvasShareDataService} from '../../canvas-share-data.service' //引入
|
|
|
|
|
import Viewer from 'viewerjs'; |
|
|
|
|
import Swiper from 'swiper'; |
|
|
|
|
import * as ObjectID from 'bson-objectid'; |
|
|
|
|
|
|
|
|
|
import { AxMessageSystem } from 'src/app/working-area/model/axMessageSystem'; |
|
|
|
|
@Component({ |
|
|
|
|
selector: 'app-collection-tools', |
|
|
|
|
templateUrl: './collection-tools.component.html', |
|
|
|
|
@ -73,9 +73,11 @@ export class CollectionToolsComponent implements OnInit {
|
|
|
|
|
setTimeout(() => { |
|
|
|
|
obj.PropertyInfos.forEach(item => { |
|
|
|
|
if(item.PropertyType == 4){ |
|
|
|
|
this.gallery = new Viewer(document.getElementById('viewerjs'),{ |
|
|
|
|
url: 'data-original' |
|
|
|
|
}); |
|
|
|
|
if(document.getElementById('viewerjs')){ |
|
|
|
|
this.gallery = new Viewer(document.getElementById('viewerjs'),{ |
|
|
|
|
url: 'data-original' |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, 0); |
|
|
|
|
@ -431,10 +433,72 @@ export class CollectionToolsComponent implements OnInit {
|
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
isMultiSelect:boolean = false; // 多选/单选 切换
|
|
|
|
|
changeMultiSelect (e) { this.canvas.setMulitSelect(this.isMultiSelect) } |
|
|
|
|
isMultipleAsset:boolean = false//框选多个素材属性显隐
|
|
|
|
|
multipleAsset:any = { |
|
|
|
|
Width:null, |
|
|
|
|
Height:null, |
|
|
|
|
Angle:null, |
|
|
|
|
Thickness:null, |
|
|
|
|
Color:null, |
|
|
|
|
PropertyInfos:[] |
|
|
|
|
}//多个素材共同属性
|
|
|
|
|
multipleAssetData:any//当前多选的素材
|
|
|
|
|
firstMultipleAssetData:any//当前多选的第一个素材
|
|
|
|
|
ngOnInit(): void { |
|
|
|
|
|
|
|
|
|
this.getAllLibrary() |
|
|
|
|
let _this = this |
|
|
|
|
AxMessageSystem.addListener('selectionChanged', ()=>{ |
|
|
|
|
if(this.canvas.selection.size() == 1){//如果是单选
|
|
|
|
|
this.isMultipleAsset = false |
|
|
|
|
this.setAssetsProperty(this.canvas.selection.first().assetData) |
|
|
|
|
}else if(this.canvas.selection.size()){ |
|
|
|
|
this.isShowProperty = true |
|
|
|
|
this.multipleAssetData = this.canvas.selection.all() |
|
|
|
|
this.firstMultipleAssetData = this.canvas.selection.first() |
|
|
|
|
this.multipleAsset = { |
|
|
|
|
Width:null, |
|
|
|
|
Height:null, |
|
|
|
|
Angle:null, |
|
|
|
|
Thickness:null, |
|
|
|
|
Color:null, |
|
|
|
|
PropertyInfos:[] |
|
|
|
|
} |
|
|
|
|
this.isMultipleAsset = true |
|
|
|
|
let firstAssetData = this.canvas.selection.first().assetData;//拿出第一个素材作为例子与其他素材进行对比
|
|
|
|
|
let InteractiveMode = firstAssetData.InteractiveMode //素材连接方式
|
|
|
|
|
let isInteractiveMode = this.canvas.selection.all().every(item => item.assetData.InteractiveMode === InteractiveMode) |
|
|
|
|
if(isInteractiveMode){ |
|
|
|
|
this.multipleAsset.InteractiveMode = InteractiveMode |
|
|
|
|
} |
|
|
|
|
let isFillMode = this.canvas.selection.all().every(item => item.assetData.FillMode === 0) //素材填充方式都为0
|
|
|
|
|
if(isFillMode){ |
|
|
|
|
this.multipleAsset.FillMode = 0 |
|
|
|
|
} |
|
|
|
|
this.canvas.selection.first().assetData.PropertyInfos.forEach(i => { |
|
|
|
|
let index = 0 |
|
|
|
|
this.canvas.selection.all().forEach(item => { |
|
|
|
|
item.assetData.PropertyInfos.forEach(element => { |
|
|
|
|
if(element.PropertyName == i.PropertyName && element.PropertyType == i.PropertyType && element.PropertyType != 3 && element.PropertyType != 4){ |
|
|
|
|
index++ |
|
|
|
|
if(index == this.canvas.selection.size()){ |
|
|
|
|
let newElement = JSON.parse(JSON.stringify(element)) |
|
|
|
|
newElement.PropertyValue = '' |
|
|
|
|
this.multipleAsset.PropertyInfos.push(newElement) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
})
|
|
|
|
|
}) |
|
|
|
|
}else if(this.canvas.selection.size() == 0){ |
|
|
|
|
this.isShowProperty = false |
|
|
|
|
} |
|
|
|
|
}, this) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.getAllLibrary() |
|
|
|
|
let that = this |
|
|
|
|
window.setTimeout(()=>{ |
|
|
|
|
document.getElementById("functionalDomainContent").oncontextmenu = function (event) { |
|
|
|
|
@ -445,19 +509,107 @@ export class CollectionToolsComponent implements OnInit {
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
ngAfterViewInit(): void { |
|
|
|
|
this.getAllBuildings(true) |
|
|
|
|
|
|
|
|
|
// 监听canvas组件选中素材事件
|
|
|
|
|
this.canvas.on("select",obj=>{ |
|
|
|
|
//选中素材属性注入函数
|
|
|
|
|
this.setAssetsProperty(obj.assetData) |
|
|
|
|
//多选宽度共同改变
|
|
|
|
|
multipleAssetWidthInput(){ |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.Width = this.multipleAsset.Width |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选高度共同改变
|
|
|
|
|
multipleAssetHeightInput(){ |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.Height = this.multipleAsset.Height |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选角度共同改变
|
|
|
|
|
multipleAssetAngleInput(){ |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.Angle = this.multipleAsset.Angle |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选厚度共同改变
|
|
|
|
|
multipleAssetThicknessInput(){ |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.Thickness = this.multipleAsset.Thickness |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选颜色共同改变
|
|
|
|
|
multipleSelectedcolor:any |
|
|
|
|
multipleAssetSelectcolor(item,key){ |
|
|
|
|
//在当前透明度基础上改变颜色
|
|
|
|
|
this.multipleSelectedcolor = item |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.Color = this.multipleSelectedcolor |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选颜色滑竿改变
|
|
|
|
|
multipleColorDivSliderChange(){ |
|
|
|
|
let colorOpacity = Math.round(255 * this.colorDivSliderValue * 0.01)
|
|
|
|
|
//根据滑竿值改变16进制颜色后两位
|
|
|
|
|
function replacepos(text,start,stop,replacetext){ |
|
|
|
|
let mystr = text.substring(0,stop-1)+replacetext+text.substring(stop+1); |
|
|
|
|
return mystr; |
|
|
|
|
} |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
this.multipleSelectedcolor = replacepos(this.multipleSelectedcolor,7,8,colorOpacity.toString(16)) |
|
|
|
|
item.assetData.Color = this.multipleSelectedcolor |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
//多选状态动态属性素材input框值改变
|
|
|
|
|
multipleAssetInputChange(i,e){ |
|
|
|
|
e.stopPropagation() |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.PropertyInfos.forEach(element => { |
|
|
|
|
if(element.PropertyName == i.PropertyName){ |
|
|
|
|
element.PropertyValue = i.PropertyValue |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
}, 0); |
|
|
|
|
} |
|
|
|
|
//多选状态动态属性素材radio框值改变
|
|
|
|
|
multipleAssetRadioChange(i,value){ |
|
|
|
|
// e.stopPropagation()
|
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.PropertyInfos.forEach(element => { |
|
|
|
|
if(element.PropertyName == i.PropertyName){ |
|
|
|
|
element.PropertyValue = value |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
// 监听canvas组件取消选中素材事件
|
|
|
|
|
this.canvas.on("deselect",obj=>{ |
|
|
|
|
this.isShowProperty = false |
|
|
|
|
} |
|
|
|
|
//多选状态动态属性素材下拉框值改变
|
|
|
|
|
multipleSupplyArea(i,e){ |
|
|
|
|
e.stopPropagation() |
|
|
|
|
this.multipleAssetData.forEach(item=>{ |
|
|
|
|
item.assetData.PropertyInfos.forEach(element => { |
|
|
|
|
if(element.PropertyName == i.PropertyName){ |
|
|
|
|
element.PropertyValue = i.PropertyValue |
|
|
|
|
this.canvas.refreshIcon(item.assetData.Id) |
|
|
|
|
this.canvasData.isChange = true |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
ngAfterViewInit(): void { |
|
|
|
|
this.getAllBuildings(true) |
|
|
|
|
// 监听canvas组件新增素材事件
|
|
|
|
|
this.canvas.on("canvasDataChanged",obj=>{ |
|
|
|
|
this.renovateTreeData(false) |
|
|
|
|
|
