Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
C
cc_mz_004
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
template admin
cc_mz_004
Commits
0eb69da6
Commit
0eb69da6
authored
Aug 19, 2020
by
limingzhe
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
refactor: 数据重构 添加动画
parent
f7658cb6
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
108 additions
and
97 deletions
+108
-97
custom-hot-zone.component.html
...app/common/custom-hot-zone/custom-hot-zone.component.html
+2
-2
custom-hot-zone.component.ts
...c/app/common/custom-hot-zone/custom-hot-zone.component.ts
+106
-95
No files found.
form/src/app/common/custom-hot-zone/custom-hot-zone.component.html
View file @
0eb69da6
...
...
@@ -152,8 +152,8 @@
<label
style=
"margin-left: 40px"
nz-checkbox
[(
ngModel
)]="
bgItem
.
isShowDebugLine
"
>
显示辅助框
</label>
<button
style=
"margin-left: 20px; margin-top: -5px"
nz-button
(
click
)="
copyHotZoneData
()"
>
复制数据
</button>
<div
style=
"margin-left:
2
0px; margin-top: -5px"
>
<button
style=
"margin-left: 20px; margin-top: -5px"
nz-button
(
click
)="
copyHotZoneData
()"
>
复制
基础
数据
</button>
<div
style=
"margin-left:
1
0px; margin-top: -5px"
>
<span>
粘贴数据:
</span>
<input
style=
"width: 100px;"
type=
"text"
nz-input
[(
ngModel
)]="
pasteData
"
>
...
...
form/src/app/common/custom-hot-zone/custom-hot-zone.component.ts
View file @
0eb69da6
...
...
@@ -14,9 +14,9 @@ import {Subject} from 'rxjs';
import
{
debounceTime
}
from
'
rxjs/operators
'
;
import
{
EditorItem
,
HotZoneImg
,
HotZoneItem
,
HotZoneLabel
,
Label
,
MySprite
,
removeItemFromArr
}
from
'
./Unit
'
;
import
TWEEN
from
'
@tweenjs/tween.js
'
;
import
{
getMinScale
}
from
"
../../play/Unit
"
;
import
{
tar
}
from
"
compressing
"
;
import
{
NzMessageService
}
from
"
ng-zorro-antd
"
;
import
{
getMinScale
}
from
'
../../play/Unit
'
;
import
{
tar
}
from
'
compressing
'
;
import
{
NzMessageService
}
from
'
ng-zorro-antd
'
;
@
Component
({
...
...
@@ -47,11 +47,12 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
@
Input
()
customTypeGroupArr
;
// [{name:string, rect:boolean, pic:boolean, text:boolean, audio:boolean, anima:boolean}, ...]
@
Input
()
hotZoneFontObj
=
{
size
:
50
,
name
:
'
BRLNSR_1
'
,
color
:
'
#8f3758
'
}
hotZoneFontObj
;
// hotZoneFontObj = {
// size: 50,
// name: 'BRLNSR_1',
// color: '#8f3758'
// }
@
Input
()
defaultItemType
=
'
text
'
;
@
Input
()
...
...
@@ -109,10 +110,9 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
isTexPngLoading
=
false
;
constructor
(
private
nzMessageService
:
NzMessageService
)
{
this
.
uploadUrl
=
(
<
any
>
window
).
courseware
.
uploadUrl
();
this
.
uploadData
=
(
<
any
>
window
).
courseware
.
uploadData
();
this
.
uploadUrl
=
(
<
any
>
window
).
courseware
.
uploadUrl
();
this
.
uploadData
=
(
<
any
>
window
).
courseware
.
uploadData
();
window
[
'
air
'
].
getUploadCallback
=
(
url
,
data
)
=>
{
this
.
uploadUrl
=
url
;
...
...
@@ -141,7 +141,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
ngOnInit
()
{
this
.
initListener
();
// this.init();
...
...
@@ -434,19 +433,27 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
refreshCustomItem
(
item
)
{
this
.
hideHotZoneItem
(
item
);
const
group
=
this
.
customTypeGroupArr
[
item
.
gIdx
];
if
(
!
group
)
{
return
;
}
if
(
group
.
text
)
{
item
.
textLabel
.
visible
=
true
;
item
.
itemType
=
'
text
'
;
}
if
(
group
.
pic
)
{
item
.
pic
.
visible
=
true
;
item
.
itemType
=
'
pic
'
;
}
if
(
group
.
rect
)
{
item
.
visible
=
true
;
item
.
itemType
=
'
rect
'
;
}
if
(
group
.
pic
&&
!
group
.
anima
)
{
item
.
pic
.
visible
=
true
;
item
.
itemType
=
'
pic
'
;
}
}
hideHotZoneItem
(
item
)
{
...
...
@@ -781,7 +788,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
// }
this
.
updateArr
(
this
.
hotZoneArr
);
this
.
updatePos
()
this
.
updatePos
()
;
TWEEN
.
update
();
...
...
@@ -1073,7 +1080,85 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
}
}
copyHotZoneData
()
{
const
{
bgItem
,
hotZoneItemArr
}
=
this
.
getSendData
();
// const hotZoneItemArrNew = [];
// const tmpArr = JSON.parse(JSON.stringify(hotZoneItemArr));
// tmpArr.forEach((item) => {
// if (item.gIdx === '0') {
// hotZoneItemArr.push(item);
// }
// })
const
jsonData
=
{
bgItem
,
hotZoneItemArr
,
isHasRect
:
this
.
isHasRect
,
isHasPic
:
this
.
isHasPic
,
isHasText
:
this
.
isHasText
,
isHasAudio
:
this
.
isHasAudio
,
isHasAnima
:
this
.
isHasAnima
,
hotZoneFontObj
:
this
.
hotZoneFontObj
,
defaultItemType
:
this
.
defaultItemType
,
hotZoneImgSize
:
this
.
hotZoneImgSize
,
};
const
oInput
=
document
.
createElement
(
'
input
'
);
oInput
.
value
=
JSON
.
stringify
(
jsonData
);
document
.
body
.
appendChild
(
oInput
);
oInput
.
select
();
// 选择对象
document
.
execCommand
(
'
Copy
'
);
// 执行浏览器复制命令
document
.
body
.
removeChild
(
oInput
);
this
.
nzMessageService
.
success
(
'
复制成功
'
);
// alert('复制成功');
}
importData
()
{
if
(
!
this
.
pasteData
)
{
return
;
}
try
{
const
data
=
JSON
.
parse
(
this
.
pasteData
);
console
.
log
(
'
data:
'
,
data
);
const
{
bgItem
,
hotZoneItemArr
,
isHasRect
,
isHasPic
,
isHasText
,
isHasAudio
,
isHasAnima
,
hotZoneFontObj
,
defaultItemType
,
hotZoneImgSize
,
}
=
data
;
this
.
hotZoneItemArr
=
hotZoneItemArr
;
this
.
isHasRect
=
isHasRect
;
this
.
isHasPic
=
isHasPic
;
this
.
isHasText
=
isHasText
;
this
.
isHasAudio
=
isHasAudio
;
this
.
isHasAnima
=
isHasAnima
;
this
.
hotZoneFontObj
=
hotZoneFontObj
;
this
.
defaultItemType
=
defaultItemType
;
this
.
hotZoneImgSize
=
hotZoneImgSize
;
this
.
bgItem
=
bgItem
;
this
.
pasteData
=
''
;
}
catch
(
e
)
{
console
.
log
(
'
err:
'
,
e
);
this
.
nzMessageService
.
error
(
'
导入失败
'
);
}
}
private
updatePos
()
{
this
.
hotZoneArr
.
forEach
((
item
)
=>
{
...
...
@@ -1143,10 +1228,10 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
if
(
item
.
lineDashFlag
&&
this
.
checkClickTarget
(
item
.
arrow
))
{
this
.
changeItemSize
(
item
);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowTop)) {
// this.changeItemTopSize(item);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowRight)) {
// this.changeItemRightSize(item);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowTop)) {
// this.changeItemTopSize(item);
// } else if (item.lineDashFlag && this.checkClickTarget(item.arrowRight)) {
// this.changeItemRightSize(item);
}
else
{
this
.
changeCurItem
(
item
);
}
...
...
@@ -1172,78 +1257,4 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
});
}
copyHotZoneData
()
{
const
{
bgItem
,
hotZoneItemArr
}
=
this
.
getSendData
();
const
jsonData
=
{
bgItem
,
hotZoneItemArr
,
isHasRect
:
this
.
isHasRect
,
isHasPic
:
this
.
isHasPic
,
isHasText
:
this
.
isHasText
,
isHasAudio
:
this
.
isHasAudio
,
isHasAnima
:
this
.
isHasAnima
,
hotZoneFontObj
:
this
.
hotZoneFontObj
,
defaultItemType
:
this
.
defaultItemType
,
hotZoneImgSize
:
this
.
hotZoneImgSize
,
};
const
oInput
=
document
.
createElement
(
'
input
'
);
oInput
.
value
=
JSON
.
stringify
(
jsonData
);
document
.
body
.
appendChild
(
oInput
);
oInput
.
select
();
// 选择对象
document
.
execCommand
(
"
Copy
"
);
// 执行浏览器复制命令
document
.
body
.
removeChild
(
oInput
);
this
.
nzMessageService
.
success
(
'
复制成功
'
);
// alert('复制成功');
}
importData
()
{
if
(
!
this
.
pasteData
)
{
return
;
}
try
{
const
data
=
JSON
.
parse
(
this
.
pasteData
);
console
.
log
(
'
data:
'
,
data
);
const
{
bgItem
,
hotZoneItemArr
,
isHasRect
,
isHasPic
,
isHasText
,
isHasAudio
,
isHasAnima
,
hotZoneFontObj
,
defaultItemType
,
hotZoneImgSize
,
}
=
data
;
this
.
hotZoneItemArr
=
hotZoneItemArr
;
this
.
isHasRect
=
isHasRect
;
this
.
isHasPic
=
isHasPic
;
this
.
isHasText
=
isHasText
;
this
.
isHasAudio
=
isHasAudio
;
this
.
isHasAnima
=
isHasAnima
;
this
.
hotZoneFontObj
=
hotZoneFontObj
;
this
.
defaultItemType
=
defaultItemType
;
this
.
hotZoneImgSize
=
hotZoneImgSize
;
this
.
bgItem
=
bgItem
;
this
.
pasteData
=
''
;
}
catch
(
e
)
{
console
.
log
(
'
err:
'
,
e
);
this
.
nzMessageService
.
error
(
'
导入失败
'
);
}
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment