Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
G
gs_carton
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
gs_carton
Commits
6a68a275
Commit
6a68a275
authored
Nov 15, 2024
by
liujiangnan
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat
parent
92a9e726
Changes
5
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
163 additions
and
44 deletions
+163
-44
Unit.ts
src/app/common/custom-hot-zone/Unit.ts
+0
-3
custom-hot-zone.component.html
...app/common/custom-hot-zone/custom-hot-zone.component.html
+134
-14
custom-hot-zone.component.ts
src/app/common/custom-hot-zone/custom-hot-zone.component.ts
+29
-16
form.component.html
src/app/form/form.component.html
+0
-1
form.component.ts
src/app/form/form.component.ts
+0
-10
No files found.
src/app/common/custom-hot-zone/Unit.ts
View file @
6a68a275
...
...
@@ -1957,9 +1957,6 @@ export class HotZoneItem extends MySprite {
audio_url
;
pic_url
;
text
;
text_cn
;
time_start
;
time_end
;
gIdx
;
private
_itemType
;
...
...
src/app/common/custom-hot-zone/custom-hot-zone.component.html
View file @
6a68a275
...
...
@@ -22,30 +22,93 @@
<div
nz-col
nzSpan=
"5"
nzOffset=
"1"
class=
"img-box"
*
ngFor=
"let it of hotZoneArr; let i = index"
>
<div
style=
"margin: auto; padding: 5px; margin-top: 30px; width:90%; border: 2px dashed #ddd; border-radius: 10px; position: relative;"
>
<button
style=
"position: absolute; right: -5px; top: -5px; z-index: 100;"
nz-button
nzType=
"danger"
nzSize=
"small"
(
click
)="
deleteBtnClick
(
i
)"
>
<div
style=
"margin: auto; padding: 5px; margin-top: 30px; width:90%; border: 2px dashed #ddd; border-radius: 10px"
>
<span
style=
"margin-left: 40%;"
>
item-{{i + 1}}
</span>
<button
style=
"float: right;"
nz-button
nzType=
"danger"
nzSize=
"small"
(
click
)="
deleteBtnClick
(
i
)"
>
X
</button>
<app-upload-image-with-preview
[
picUrl
]="
it
?.
pic_url
"
(
imageUploaded
)="
onItemImgUploadSuccess
($
event
,
it
)"
>
</app-upload-image-with-preview>
<nz-divider
style=
"margin-top: 10px;"
></nz-divider>
<div
style=
"margin-top: -20px; margin-bottom: 5px; width: 100%;"
>
<div
*
ngIf=
"customTypeGroupArr"
>
<nz-radio-group
[
ngModel
]="
it
.
gIdx
"
(
ngModelChange
)="
customRadioChange
($
event
,
it
)"
style=
"display: flex; align-items: center; justify-content: center; flex-wrap: wrap;"
>
<div
*
ngFor=
"let group of customTypeGroupArr; let gIdx = index"
style=
"display: flex; "
>
<label
nz-radio
nzValue=
"{{gIdx}}"
>
{{group.name}}
</label>
</div>
</nz-radio-group>
</div>
<div
*
ngIf=
"!customTypeGroupArr"
>
<nz-radio-group
[
ngModel
]="
it
.
itemType
"
(
ngModelChange
)="
radioChange
($
event
,
it
)"
style=
"display: flex; align-items: center; justify-content: center"
>
<label
*
ngIf=
"isHasRect"
nz-radio
nzValue=
"rect"
>
矩形
</label>
<label
*
ngIf=
"isHasPic"
nz-radio
nzValue=
"pic"
>
图片
</label>
<label
*
ngIf=
"isHasText"
nz-radio
nzValue=
"text"
>
文本
</label>
</nz-radio-group>
</div>
<div
style=
"margin-top: 5px"
>
<input
type=
"text"
nz-input
[(
ngModel
)]="
it
.
text
"
(
blur
)="
saveText
(
it
)"
placeholder=
"英文"
>
</div>
<div
style=
"margin-top: 5px"
>
<input
type=
"text"
nz-input
[(
ngModel
)]="
it
.
text_cn
"
(
blur
)="
saveText
(
it
)"
placeholder=
"中文"
>
<div
*
ngIf=
"customTypeGroupArr && customTypeGroupArr[it.gIdx]"
>
<div
*
ngIf=
"customTypeGroupArr[it.gIdx].pic"
>
<app-upload-image-with-preview
[
picUrl
]="
it
?.
pic_url
"
(
imageUploaded
)="
onItemImgUploadSuccess
($
event
,
it
)"
>
</app-upload-image-with-preview>
</div>
<div
*
ngIf=
"customTypeGroupArr[it.gIdx].text"
style=
"margin-top: 5px"
>
<input
type=
"text"
nz-input
[(
ngModel
)]="
it
.
text
"
(
blur
)="
saveText
(
it
)"
>
</div>
<div
*
ngIf=
"customTypeGroupArr[it.gIdx].anima"
align=
"center"
style=
"margin-top: 5px"
>
<button
nz-button
(
click
)="
setAnimaBtnClick
(
i
)"
>
<i
nz-icon
nzType=
"tool"
nzTheme=
"outline"
></i>
配置龙骨动画
</button>
</div>
<div
*
ngIf=
"customTypeGroupArr[it.gIdx].audio"
style=
"display: flex;align-items: center; margin-top: 5px"
>
<app-audio-recorder
style=
"margin: auto"
[
audioUrl
]="
it
.
audio_url
"
(
audioUploaded
)="
onItemAudioUploadSuccess
($
event
,
it
)"
></app-audio-recorder>
</div>
</div>
<div
style=
"margin-top: 5px"
>
<input
type=
"text"
nz-input
style=
"width: 100px;"
[(
ngModel
)]="
it
.
time_start
"
(
blur
)="
saveText
(
it
)"
placeholder=
"开始时间"
>
-
<input
type=
"text"
nz-input
style=
"width: 100px;"
[(
ngModel
)]="
it
.
time_end
"
(
blur
)="
saveText
(
it
)"
placeholder=
"结束时间"
>
<div
*
ngIf=
"!customTypeGroupArr"
>
<app-upload-image-with-preview
[
picUrl
]="
it
?.
pic_url
"
(
imageUploaded
)="
onItemImgUploadSuccess
($
event
,
it
)"
>
</app-upload-image-with-preview>
<input
type=
"text"
nz-input
[(
ngModel
)]="
it
.
text
"
(
blur
)="
saveText
(
it
)"
>
<div
*
ngIf=
"isHasAudio"
style=
"width: 100%; margin-top: 5px; display: flex; align-items: center; justify-items: center;"
>
<app-audio-recorder
style=
"margin: auto"
[
audioUrl
]="
it
.
audio_url
"
(
audioUploaded
)="
onItemAudioUploadSuccess
($
event
,
it
)"
></app-audio-recorder>
</div>
</div>
</div>
</div>
<div
nz-col
nzSpan=
"5"
nzOffset=
"1"
>
<div
class=
"bg-box"
>
<button
nz-button
nzType=
"dashed"
(
click
)="
addBtnClick
()"
class=
"add-btn"
>
...
...
@@ -81,7 +144,64 @@
<button
style=
"margin-left: 5px;"
nz-button
[
disabled
]="
pasteData=
=''"
nzType=
"primary"
(
click
)="
importData
()"
>
导入
</button>
</div>
<!--<button style="margin-left: 20px; margin-top: -5px" nz-button (click)="pasteHotZoneData()" > 粘贴数据 </button>-->
</div>
</div>
</div>
<label
style=
"opacity: 0; position: absolute; top: 0px; font-family: 'BRLNSR_1'"
>
1
</label>
<!--龙骨面板-->
<nz-modal
[(
nzVisible
)]="
animaPanelVisible
"
nzTitle=
"配置资源文件"
(
nzOnCancel
)="
animaPanelCancel
()"
(
nzOnOk
)="
animaPanelOk
()"
nzOkText=
"保存"
>
<div
class=
"anima-upload-btn"
>
<span
style=
"margin-right: 10px"
>
上传 ske_json 文件:
</span>
<nz-upload
[
nzShowUploadList
]="
false
"
nzAccept=
"application/json"
[
nzAction
]="
uploadUrl
"
[
nzData
]="
uploadData
"
(
nzChange
)="
skeJsonHandleChange
($
event
)"
>
<button
nz-button
><i
nz-icon
nzType=
"upload"
></i><span>
Upload
</span></button>
</nz-upload>
<i
*
ngIf=
"isSkeJsonLoading"
style=
"margin-left: 10px;"
nz-icon
[
nzType
]="'
loading
'"
></i>
<span
*
ngIf=
"skeJsonData['name']"
style=
"margin-left: 10px"
><u>
{{skeJsonData['name']}}
</u></span>
</div>
<div
class=
"anima-upload-btn"
>
<span
style=
"margin-right: 10px"
>
上传 tex_json 文件:
</span>
<nz-upload
[
nzShowUploadList
]="
false
"
nzAccept=
"application/json"
[
nzAction
]="
uploadUrl
"
[
nzData
]="
uploadData
"
(
nzChange
)="
texJsonHandleChange
($
event
)"
>
<button
nz-button
><i
nz-icon
nzType=
"upload"
></i><span>
Upload
</span></button>
</nz-upload>
<i
*
ngIf=
"isTexJsonLoading"
style=
"margin-left: 10px;"
nz-icon
[
nzType
]="'
loading
'"
></i>
<span
*
ngIf=
"texJsonData['name']"
style=
"margin-left: 10px"
><u>
{{texJsonData['name']}}
</u></span>
</div>
<div
class=
"anima-upload-btn"
>
<span
style=
"margin-right: 10px"
>
上传 tex_png 文件:
</span>
<nz-upload
[
nzShowUploadList
]="
false
"
nzAccept =
"image/*"
[
nzAction
]="
uploadUrl
"
[
nzData
]="
uploadData
"
(
nzChange
)="
texPngHandleChange
($
event
)"
>
<button
nz-button
><i
nz-icon
nzType=
"upload"
></i><span>
Upload
</span></button>
</nz-upload>
<i
*
ngIf=
"isTexPngLoading"
style=
"margin-left: 10px;"
nz-icon
[
nzType
]="'
loading
'"
></i>
<span
*
ngIf=
"texPngData['name']"
style=
"margin-left: 10px"
><u>
{{texPngData['name']}}
</u></span>
</div>
</nz-modal>
src/app/common/custom-hot-zone/custom-hot-zone.component.ts
View file @
6a68a275
...
...
@@ -252,7 +252,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
this
.
hotZoneArr
[
i
].
index
=
i
;
if
(
this
.
hotZoneArr
[
i
])
{
//
this.hotZoneArr[i].title = 'item-' + (i + 1);
this
.
hotZoneArr
[
i
].
title
=
'
item-
'
+
(
i
+
1
);
}
}
...
...
@@ -507,24 +507,32 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
}
initHotZoneArr
()
{
// console.log('this.hotZoneArr: ', this.hotZoneArr);
let
curBgRect
;
if
(
this
.
bg
)
{
curBgRect
=
this
.
bg
.
getBoundingBox
();
}
else
{
curBgRect
=
{
x
:
0
,
y
:
0
,
width
:
this
.
canvasWidth
,
height
:
this
.
canvasHeight
};
}
let
oldBgRect
=
this
.
bgItem
.
rect
;
if
(
!
oldBgRect
)
{
oldBgRect
=
curBgRect
;
}
const
rate
=
curBgRect
.
width
/
oldBgRect
.
width
;
console
.
log
(
'
rate:
'
,
rate
);
this
.
hotZoneArr
=
[];
const
arr
=
this
.
hotZoneItemArr
.
concat
();
console
.
log
(
'
this.hotZoneItemArr:
'
,
this
.
hotZoneItemArr
);
for
(
let
i
=
0
;
i
<
arr
.
length
;
i
++
)
{
const
data
=
JSON
.
parse
(
JSON
.
stringify
(
arr
[
i
]));
// const img = {pic_url: data.pic_url};
data
.
rect
.
x
*=
rate
;
data
.
rect
.
y
*=
rate
;
data
.
rect
.
width
*=
rate
;
...
...
@@ -533,20 +541,32 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
data
.
rect
.
x
+=
curBgRect
.
x
;
data
.
rect
.
y
+=
curBgRect
.
y
;
// img['picItem'] = this.getPicItem(img, data);
// img['audio_url'] = arr[i].audio_url;
// this.imgArr.push(img);
const
item
=
this
.
getHotZoneItem
(
data
);
item
.
audio_url
=
data
.
audio_url
;
item
.
pic_url
=
data
.
pic_url
;
item
.
text
=
data
.
text
;
item
.
text_cn
=
data
.
text_cn
;
item
.
time_start
=
data
.
time_start
;
item
.
time_end
=
data
.
time_end
;
item
.
itemType
=
data
.
itemType
;
this
.
refreshCustomItem
(
item
);
if
(
this
.
customTypeGroupArr
)
{
this
.
refreshCustomItem
(
item
);
}
else
{
this
.
refreshItem
(
item
);
}
console
.
log
(
'
item:
'
,
item
);
this
.
hotZoneArr
.
push
(
item
);
}
// this.refreshHotZoneId();
this
.
refreshHotZoneId
();
// this.refreshImageId();
}
...
...
@@ -931,9 +951,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
index
:
hotZoneArr
[
i
].
index
,
pic_url
:
hotZoneArr
[
i
].
pic_url
,
text
:
hotZoneArr
[
i
].
text
,
text_cn
:
hotZoneArr
[
i
].
text_cn
,
time_start
:
hotZoneArr
[
i
].
time_start
,
time_end
:
hotZoneArr
[
i
].
time_end
,
audio_url
:
hotZoneArr
[
i
].
audio_url
,
itemType
:
hotZoneArr
[
i
].
itemType
,
fontScale
:
hotZoneArr
[
i
].
textLabel
?
hotZoneArr
[
i
].
textLabel
.
scaleX
:
1
,
...
...
@@ -974,9 +991,6 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
saveText
(
item
)
{
item
.
textLabel
.
text
=
item
.
text
;
item
.
textLabel
.
text_cn
=
item
.
text_cn
;
item
.
textLabel
.
time_start
=
item
.
time_start
;
item
.
textLabel
.
time_end
=
item
.
time_end
;
}
setAnimaBtnClick
(
index
)
{
...
...
@@ -1234,12 +1248,11 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
private
loadHotZonePic
(
pic
:
HotZoneImg
,
url
,
scale
=
null
)
{
const
baseLen
=
this
.
hotZoneImgSize
*
this
.
mapScale
;
pic
.
load
(
url
).
then
(()
=>
{
if
(
!
scale
)
{
scale
=
getMinScale
(
pic
,
baseLen
);
}
pic
.
visible
=
true
;
// pic.label.visible = true;
pic
.
setScaleXY
(
scale
);
});
}
...
...
src/app/form/form.component.html
View file @
6a68a275
...
...
@@ -8,7 +8,6 @@
[
hotZoneItemArr
]="
hotZoneItemArr
"
[
hotZoneFontObj
]="
null
"
[
customTypeGroupArr
]="
customTypeGroupArr
"
(
save
)="
saveHotZone
($
event
)"
>
...
...
src/app/form/form.component.ts
View file @
6a68a275
...
...
@@ -16,16 +16,6 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
hotZoneItemArr
=
[];
animaArr
=
[];
picArr
;
customTypeGroupArr
=
[
{
name
:
'
基础资源
'
,
rect
:
true
,
anima
:
false
,
pic
:
true
,
text
:
true
,
audio
:
true
,
}
]
constructor
(
private
appRef
:
ApplicationRef
,
private
changeDetectorRef
:
ChangeDetectorRef
,
private
message
:
NzMessageService
)
{
...
...
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