|
@@ -52,65 +52,26 @@ export default class ListBox extends Base {
|
|
this.eventBus._on('setProperty', this.setProperty.bind(this))
|
|
this.eventBus._on('setProperty', this.setProperty.bind(this))
|
|
this.eventBus._on('changeSelectAvailable', this.changeSelectAvailable.bind(this))
|
|
this.eventBus._on('changeSelectAvailable', this.changeSelectAvailable.bind(this))
|
|
|
|
|
|
- for (let key in this.annotation) {
|
|
|
|
- if (key === 'background-color') {
|
|
|
|
- let newName = 'backgroundColor'
|
|
|
|
- this.annotation[newName] = this.annotation[key]
|
|
|
|
- delete this.annotation[key]
|
|
|
|
- }
|
|
|
|
- if (key === 'fieldname') {
|
|
|
|
- let newKey = 'fieldName'
|
|
|
|
- this.annotation[newKey] = this.annotation[key]
|
|
|
|
- delete this.annotation[key]
|
|
|
|
- }
|
|
|
|
- if (key === 'opt') {
|
|
|
|
- let newKey = 'options'
|
|
|
|
- let options = []
|
|
|
|
- if (Array.isArray(this.annotation[key])) {
|
|
|
|
- for (const item of this.annotation[key]) {
|
|
|
|
- options.push(item.value ?? item.key)
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- options.push(this.annotation[key].value)
|
|
|
|
- }
|
|
|
|
- this.annotation[newKey] = options
|
|
|
|
- delete this.annotation[key]
|
|
|
|
- }
|
|
|
|
- if (!this.annotation['opt'] && !this.annotation['options']) {
|
|
|
|
- this.annotation.options = []
|
|
|
|
- }
|
|
|
|
- if (key === 'options' && typeof this.annotation.options === 'string') {
|
|
|
|
- this.annotation.options = this.annotation.options.split(',')
|
|
|
|
- }
|
|
|
|
- if (key === 'flags') {
|
|
|
|
- let newKey = 'isHidden'
|
|
|
|
- this.annotation[newKey] = this.annotation[key].indexOf('noview') > -1 || this.annotation[key].indexOf('hidden') > -1 ? '1' : '0'
|
|
|
|
- delete this.annotation[key]
|
|
|
|
- }
|
|
|
|
- if (key === 'select' && !this.layer.annotationStore.notFirstRender) {
|
|
|
|
- this.annotation[key] = (parseInt(this.annotation[key]) + 1).toString()
|
|
|
|
- }
|
|
|
|
- if (key === 'textStyle') {
|
|
|
|
- const textStyle = this.annotation[key]
|
|
|
|
- if (textStyle.fontColor) this.annotation.textColor = textStyle.fontColor
|
|
|
|
- if (textStyle.fontSize) this.annotation.fontSize = parseInt(textStyle.fontSize).toString()
|
|
|
|
- if (textStyle.fontName && textStyle.fontName.length > 0) {
|
|
|
|
- const fontArr = [ 'Courier', 'Courier-Bold', 'Courier-BoldOblique', 'Courier-Oblique', 'Helvetica', 'Helvetica-Bold', 'Helvetica-BoldOblique', 'Helvetica-Oblique', 'Times-Roman', 'Times-Bold', 'Times-BoldItalic', 'Times-Italic' ]
|
|
|
|
- this.annotation.fontName = 'Helvetica'
|
|
|
|
- for (const item of fontArr) {
|
|
|
|
- if (item.toLowerCase() === textStyle.fontName.toLowerCase()) {
|
|
|
|
- this.annotation.fontName = item
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- this.annotation.fontName = 'Helvetica'
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+ const annotation = this.annotation
|
|
|
|
+
|
|
|
|
+ if (!annotation.items) {
|
|
|
|
+ annotation.items = []
|
|
}
|
|
}
|
|
- if (!this.annotation['select']) {
|
|
|
|
- this.annotation.select = ''
|
|
|
|
|
|
+ if (!annotation.fontName) {
|
|
|
|
+ annotation.fontName = 'Helvetica'
|
|
|
|
+ }
|
|
|
|
+ if (annotation.isBold && annotation.isItalic) {
|
|
|
|
+ annotation.fontStyle = 'boldItalic'
|
|
|
|
+ } else if (annotation.isBold) {
|
|
|
|
+ annotation.fontStyle = 'bold'
|
|
|
|
+ } else if (annotation.isItalic) {
|
|
|
|
+ annotation.fontStyle = 'italic'
|
|
|
|
+ } else {
|
|
|
|
+ annotation.fontStyle = 'normal'
|
|
|
|
+ }
|
|
|
|
+ if (!this.annotation.selected) {
|
|
|
|
+ this.annotation.selected = ''
|
|
}
|
|
}
|
|
- const annotation = this.annotation
|
|
|
|
|
|
|
|
const { start, end } = this.getActualRect(
|
|
const { start, end } = this.getActualRect(
|
|
this.viewport,
|
|
this.viewport,
|
|
@@ -120,7 +81,6 @@ export default class ListBox extends Base {
|
|
this.end = end
|
|
this.end = end
|
|
|
|
|
|
const rect = this.calculate(start, end)
|
|
const rect = this.calculate(start, end)
|
|
- const actualbdwidth = (this.annotation.lineWidth || this.annotation.width || 2) * this.scale
|
|
|
|
|
|
|
|
const annotationContainer = document.createElement('div')
|
|
const annotationContainer = document.createElement('div')
|
|
annotationContainer.id = annotation.name
|
|
annotationContainer.id = annotation.name
|
|
@@ -139,27 +99,24 @@ export default class ListBox extends Base {
|
|
top: 0,
|
|
top: 0,
|
|
width: `${Math.abs(rect.width)}px`,
|
|
width: `${Math.abs(rect.width)}px`,
|
|
height: `${Math.abs(rect.height)}px`,
|
|
height: `${Math.abs(rect.height)}px`,
|
|
- backgroundColor: annotation.backgroundColor,
|
|
|
|
position: 'relative'
|
|
position: 'relative'
|
|
}
|
|
}
|
|
)
|
|
)
|
|
|
|
|
|
this.borderElement = borderElement
|
|
this.borderElement = borderElement
|
|
-
|
|
|
|
let selectElement = createElement(
|
|
let selectElement = createElement(
|
|
'div',
|
|
'div',
|
|
{
|
|
{
|
|
width: `${Math.abs(rect.width)}px`,
|
|
width: `${Math.abs(rect.width)}px`,
|
|
height: `${Math.abs(rect.height)}px`,
|
|
height: `${Math.abs(rect.height)}px`,
|
|
- borderColor: '#43474D',
|
|
|
|
- borderWidth: '1px',
|
|
|
|
- borderStyle: 'solid',
|
|
|
|
- borderRadius: '0',
|
|
|
|
|
|
+ borderColor: annotation.borderColor,
|
|
|
|
+ borderWidth: (annotation.borderWidth || 1) + 'px',
|
|
|
|
+ borderStyle: annotation.borderStyle || 'solid',
|
|
cursor: 'pointer',
|
|
cursor: 'pointer',
|
|
- background: 'transparent',
|
|
|
|
|
|
+ backgroundColor: annotation.backgroundColor,
|
|
fontSize: annotation.fontSize + 'px',
|
|
fontSize: annotation.fontSize + 'px',
|
|
fontFamily: annotation.fontName,
|
|
fontFamily: annotation.fontName,
|
|
- color: annotation.textColor || '#001A4E',
|
|
|
|
|
|
+ color: annotation.color || '#001A4E',
|
|
overflow: 'auto'
|
|
overflow: 'auto'
|
|
}
|
|
}
|
|
)
|
|
)
|
|
@@ -170,8 +127,8 @@ export default class ListBox extends Base {
|
|
this.container.append(this.annotationContainer)
|
|
this.container.append(this.annotationContainer)
|
|
|
|
|
|
// 添加选项
|
|
// 添加选项
|
|
- if (annotation.options && annotation.options.length > 0) {
|
|
|
|
- for (var i = 0; i < annotation.options.length; i++) {
|
|
|
|
|
|
+ if (annotation.items && annotation.items.length > 0) {
|
|
|
|
+ for (var i = 0; i < annotation.items.length; i++) {
|
|
const optionElement = createElement(
|
|
const optionElement = createElement(
|
|
'div',
|
|
'div',
|
|
{
|
|
{
|
|
@@ -187,8 +144,8 @@ export default class ListBox extends Base {
|
|
class: 'option'
|
|
class: 'option'
|
|
}
|
|
}
|
|
)
|
|
)
|
|
- optionElement.innerText = annotation.options[i]
|
|
|
|
- if (this.annotation.select - 1 === i) {
|
|
|
|
|
|
+ optionElement.innerText = annotation.items[i].Value
|
|
|
|
+ if (this.annotation.selected === i) {
|
|
optionElement.style.backgroundColor = '#dcdcdc'
|
|
optionElement.style.backgroundColor = '#dcdcdc'
|
|
}
|
|
}
|
|
this.selectElement.appendChild(optionElement)
|
|
this.selectElement.appendChild(optionElement)
|
|
@@ -378,10 +335,10 @@ export default class ListBox extends Base {
|
|
this.initial = true
|
|
this.initial = true
|
|
|
|
|
|
if (this.layer.toolMode !== 'form') {
|
|
if (this.layer.toolMode !== 'form') {
|
|
- if (this.annotation['isHidden'] === '1') {
|
|
|
|
|
|
+ if (this.annotation.isHidden === 1) {
|
|
this.annotationContainer.style.display = 'none'
|
|
this.annotationContainer.style.display = 'none'
|
|
this.annotationContainer.style.pointerEvents = 'none'
|
|
this.annotationContainer.style.pointerEvents = 'none'
|
|
- } else if (this.annotation['isHidden'] === '0') {
|
|
|
|
|
|
+ } else if (this.annotation.isHidden === 0) {
|
|
this.annotationContainer.style.display = 'block'
|
|
this.annotationContainer.style.display = 'block'
|
|
this.annotationContainer.style.pointerEvents = 'auto'
|
|
this.annotationContainer.style.pointerEvents = 'auto'
|
|
}
|
|
}
|
|
@@ -428,13 +385,13 @@ export default class ListBox extends Base {
|
|
|
|
|
|
calculate (start, end) {
|
|
calculate (start, end) {
|
|
const initRect = this.rectCalc({ start, end });
|
|
const initRect = this.rectCalc({ start, end });
|
|
- const actualbdwidth = (this.annotation.width || this.annotation.lineWidth || 2) * this.scale
|
|
|
|
|
|
+ const actualBdWidth = (this.annotation.borderWidth || 1) * this.scale
|
|
|
|
|
|
return {
|
|
return {
|
|
- top: initRect.top - actualbdwidth,
|
|
|
|
- left: initRect.left - actualbdwidth,
|
|
|
|
- width: initRect.width + actualbdwidth * 2,
|
|
|
|
- height: initRect.height + actualbdwidth * 2,
|
|
|
|
|
|
+ top: initRect.top - actualBdWidth,
|
|
|
|
+ left: initRect.left - actualBdWidth,
|
|
|
|
+ width: initRect.width + actualBdWidth * 2,
|
|
|
|
+ height: initRect.height + actualBdWidth * 2,
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -511,10 +468,11 @@ export default class ListBox extends Base {
|
|
onClickOutside([this.annotationContainer, this.outerLine, this.deletetButton, document.getElementById('propertyPanelButton'), document.getElementsByClassName('right-panel')[0]], this.handleOutside.bind(this))
|
|
onClickOutside([this.annotationContainer, this.outerLine, this.deletetButton, document.getElementById('propertyPanelButton'), document.getElementsByClassName('right-panel')[0]], this.handleOutside.bind(this))
|
|
} else {
|
|
} else {
|
|
if (event.target && event.target.className === 'option') {
|
|
if (event.target && event.target.className === 'option') {
|
|
|
|
+ debugger
|
|
const children = event.target.parentNode.children
|
|
const children = event.target.parentNode.children
|
|
for (let i = 0; i < children.length; i++) {
|
|
for (let i = 0; i < children.length; i++) {
|
|
if (children[i] === event.target) {
|
|
if (children[i] === event.target) {
|
|
- this.annotation.select = i + 1
|
|
|
|
|
|
+ this.annotation.selected = i
|
|
break
|
|
break
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -808,86 +766,169 @@ export default class ListBox extends Base {
|
|
}
|
|
}
|
|
|
|
|
|
handlePropertyPanel (props) {
|
|
handlePropertyPanel (props) {
|
|
- if (this.layer.annotationStore.selectedElementName !== this.annotation.name) return
|
|
|
|
|
|
+ const annotation = this.annotation
|
|
|
|
+ if (this.layer.annotationStore.selectedElementName !== annotation.name) return
|
|
|
|
|
|
let updatePropsNum = 0
|
|
let updatePropsNum = 0
|
|
for (const key in props) {
|
|
for (const key in props) {
|
|
- for (const item in this.annotation) {
|
|
|
|
- if (item === key && key === 'options' && JSON.stringify(this.annotation[item]) !== JSON.stringify(props[key])) {
|
|
|
|
- if (typeof props[key] === 'string') {
|
|
|
|
- props[key] = props[key].split(',')
|
|
|
|
- } else {
|
|
|
|
- props[key] = Array.from(props[key])
|
|
|
|
- }
|
|
|
|
- this.annotation[item] = props[key]
|
|
|
|
- updatePropsNum ++
|
|
|
|
-
|
|
|
|
- this.selectElement.innerText = ''
|
|
|
|
- for (var i = 0; i < this.annotation.options.length; i++) {
|
|
|
|
- const optionElement = createElement(
|
|
|
|
- 'div',
|
|
|
|
- {
|
|
|
|
- width: '100%',
|
|
|
|
- height: '30px',
|
|
|
|
- lineHeight: '30px',
|
|
|
|
- borderBottom: '1px solid #666666',
|
|
|
|
- overflow: 'hidden',
|
|
|
|
- textOverflow: 'ellipsis',
|
|
|
|
- whiteSpace: 'nowrap'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- class: 'option'
|
|
|
|
- }
|
|
|
|
- )
|
|
|
|
- optionElement.innerText = this.annotation.options[i]
|
|
|
|
- if (this.annotation.select - 1 === i) {
|
|
|
|
- optionElement.style.backgroundColor = '#dcdcdc'
|
|
|
|
- }
|
|
|
|
- this.selectElement.appendChild(optionElement)
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- if (item === key && this.annotation[item] !== props[key] && key !== 'options') {
|
|
|
|
|
|
+ for (const item in annotation) {
|
|
|
|
+ if (item === key && this.annotation[item] !== props[key] && key !== 'items') {
|
|
this.annotation[item] = props[key]
|
|
this.annotation[item] = props[key]
|
|
updatePropsNum ++
|
|
updatePropsNum ++
|
|
|
|
|
|
|
|
+ annotation[item] = props[key]
|
|
if (key === 'backgroundColor') {
|
|
if (key === 'backgroundColor') {
|
|
- this.borderElement.style[key] = props[key]
|
|
|
|
if (props[key] === '') {
|
|
if (props[key] === '') {
|
|
props.clearBackgroundColor = true
|
|
props.clearBackgroundColor = true
|
|
}
|
|
}
|
|
|
|
+ this.selectElement.style[key] = props[key]
|
|
}
|
|
}
|
|
if (key === 'fontSize') {
|
|
if (key === 'fontSize') {
|
|
this.selectElement.style.fontSize = props[key] + 'px'
|
|
this.selectElement.style.fontSize = props[key] + 'px'
|
|
}
|
|
}
|
|
- if (key === 'textColor') {
|
|
|
|
|
|
+ if (key === 'color') {
|
|
this.selectElement.style.color = props[key]
|
|
this.selectElement.style.color = props[key]
|
|
}
|
|
}
|
|
if (key === 'fontName') {
|
|
if (key === 'fontName') {
|
|
this.selectElement.style.fontFamily = props[key]
|
|
this.selectElement.style.fontFamily = props[key]
|
|
}
|
|
}
|
|
|
|
+ if (key === 'fontStyle') {
|
|
|
|
+ const fontStyle = props[key]
|
|
|
|
+ if (fontStyle === 'boldItalic') {
|
|
|
|
+ this.selectElement.style.fontStyle = 'italic'
|
|
|
|
+ this.selectElement.style.fontWeight = 'bold'
|
|
|
|
+ annotation.isBold = true
|
|
|
|
+ annotation.isItalic = true
|
|
|
|
+ } else if (fontStyle === 'bold') {
|
|
|
|
+ this.selectElement.style.fontWeight = 'bold'
|
|
|
|
+ annotation.isBold = true
|
|
|
|
+ annotation.isItalic = false
|
|
|
|
+ } else if (fontStyle === 'italic') {
|
|
|
|
+ this.selectElement.style.fontStyle = 'italic'
|
|
|
|
+ annotation.isBold = false
|
|
|
|
+ annotation.isItalic = true
|
|
|
|
+ } else {
|
|
|
|
+ annotation.isItalic = false
|
|
|
|
+ annotation.isBold = false
|
|
|
|
+ this.selectElement.style.fontStyle = 'normal'
|
|
|
|
+ this.selectElement.style.fontWeight = 'normal'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+ if (key === 'addItem') {
|
|
|
|
+ if (annotation.items.includes(props.addItem)) {
|
|
|
|
+ delete props.addItem
|
|
|
|
+ continue
|
|
|
|
+ } else {
|
|
|
|
+ updatePropsNum ++
|
|
|
|
+
|
|
|
|
+ annotation.items.push({
|
|
|
|
+ Value: props.addItem,
|
|
|
|
+ String: props.addItem
|
|
|
|
+ })
|
|
|
|
+ const optionElement = createElement('option')
|
|
|
|
+ optionElement.value = props.addItem
|
|
|
|
+ optionElement.innerHTML = props.addItem
|
|
|
|
+ this.selectElement.appendChild(optionElement)
|
|
|
|
+
|
|
|
|
+ props.addItem = {
|
|
|
|
+ item: props.addItem,
|
|
|
|
+ index: annotation.items.length - 1
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if (key === 'deleteItemIndex') {
|
|
|
|
+ updatePropsNum ++
|
|
|
|
+
|
|
|
|
+ const deleteItemIndex = props.deleteItemIndex
|
|
|
|
+ if (annotation.selected === props.deleteItemIndex) {
|
|
|
|
+ annotation.selected = null
|
|
|
|
+ }
|
|
|
|
+ annotation.items.splice(deleteItemIndex, 1)
|
|
|
|
+ this.selectElement.options[deleteItemIndex].remove()
|
|
|
|
+ // this.selectElement.options[props.selected].selected = true
|
|
|
|
+ // if (deleteIndex === annotation.selected) {
|
|
|
|
+ // this.selectElement.options[deleteIndex] && (this.selectElement.options[deleteIndex].selected = true)
|
|
|
|
+ // }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if (key === 'moveOption') {
|
|
|
|
+ updatePropsNum ++
|
|
|
|
+
|
|
|
|
+ const fromIndex = props.moveOption.fromIndex
|
|
|
|
+ const toIndex = props.moveOption.toIndex
|
|
|
|
+
|
|
|
|
+ const items = annotation.items
|
|
|
|
+ if (fromIndex > toIndex) {
|
|
|
|
+ items.splice(fromIndex - 1, 2, items[fromIndex], items[fromIndex - 1])
|
|
|
|
+ } else {
|
|
|
|
+ items.splice(fromIndex, 2, items[fromIndex + 1], items[fromIndex])
|
|
|
|
+ }
|
|
|
|
+ props.moveOption.item = {
|
|
|
|
+ Value: items[toIndex].Value,
|
|
|
|
+ String: items[toIndex].String
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ const optionElement = this.selectElement.options[fromIndex]
|
|
|
|
+ optionElement.remove()
|
|
|
|
+
|
|
|
|
+ this.selectElement.insertBefore(optionElement, this.selectElement.options[toIndex])
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
if (updatePropsNum > 0) {
|
|
if (updatePropsNum > 0) {
|
|
- const annotation = {
|
|
|
|
|
|
+ const annotationData = {
|
|
operate: "mod-form",
|
|
operate: "mod-form",
|
|
name: this.annotation.name,
|
|
name: this.annotation.name,
|
|
pageIndex: this.page,
|
|
pageIndex: this.page,
|
|
pagePtr: this.annotation.pagePtr,
|
|
pagePtr: this.annotation.pagePtr,
|
|
annotPtr: this.annotation.annotPtr,
|
|
annotPtr: this.annotation.annotPtr,
|
|
}
|
|
}
|
|
- if (props.options && Array.isArray(props.options)) {
|
|
|
|
- props.options = props.options.join(',')
|
|
|
|
- if (props.options === '') {
|
|
|
|
- props.clearOption = true
|
|
|
|
- }
|
|
|
|
|
|
+ if (!annotation.items.length) {
|
|
|
|
+ props.clearOption = true
|
|
}
|
|
}
|
|
- if (props.select && typeof props.select === 'number') {
|
|
|
|
- props.select += ''
|
|
|
|
|
|
+
|
|
|
|
+ const isFont = ['fontSize', 'fontName', 'color', 'fontStyle'].some(item => props[item])
|
|
|
|
+ if (isFont) {
|
|
|
|
+ annotationData.fontSize = annotation.fontSize
|
|
|
|
+ annotationData.color = annotation.color
|
|
|
|
+ const fontArr = {
|
|
|
|
+ Courier: {
|
|
|
|
+ normal: 'Courier',
|
|
|
|
+ bold: 'Courier-Bold',
|
|
|
|
+ italic: 'Courier-Oblique',
|
|
|
|
+ boldItalic: 'Courier-BoldOblique'
|
|
|
|
+ },
|
|
|
|
+ Helvetica: {
|
|
|
|
+ normal: 'Helvetica',
|
|
|
|
+ bold: 'Helvetica-Bold',
|
|
|
|
+ italic: 'Helvetica-Oblique',
|
|
|
|
+ boldItalic: 'Helvetica-BoldOblique'
|
|
|
|
+ },
|
|
|
|
+ Times: {
|
|
|
|
+ normal: 'Times',
|
|
|
|
+ bold: 'Times-Bold',
|
|
|
|
+ italic: 'Times-Italic',
|
|
|
|
+ boldItalic: 'Times-BoldItalic'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ const fontName = annotation.fontName
|
|
|
|
+ if (annotation.isBold && annotation.isItalic) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].boldItalic
|
|
|
|
+ } else if (annotation.isBold) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].bold
|
|
|
|
+ } else if (annotation.isItalic) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].italic
|
|
|
|
+ } else {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].normal
|
|
|
|
+ }
|
|
}
|
|
}
|
|
- const updateAnnot = Object.assign({}, annotation, props)
|
|
|
|
|
|
+
|
|
|
|
+ const updateAnnot = Object.assign({}, annotationData, props)
|
|
this.eventBus.dispatch('annotationChange', {
|
|
this.eventBus.dispatch('annotationChange', {
|
|
type: 'modify',
|
|
type: 'modify',
|
|
annotation: updateAnnot
|
|
annotation: updateAnnot
|
|
@@ -896,27 +937,66 @@ export default class ListBox extends Base {
|
|
}
|
|
}
|
|
|
|
|
|
setProperty (props) {
|
|
setProperty (props) {
|
|
- if (props.name !== this.annotation.name) return
|
|
|
|
|
|
+ const annotation = this.annotation
|
|
|
|
+ if (props.name !== annotation.name) return
|
|
|
|
|
|
for (const key in props) {
|
|
for (const key in props) {
|
|
- for (const item in this.annotation) {
|
|
|
|
- if (item === key && this.annotation[item] !== props[key]) {
|
|
|
|
- this.annotation[item] = props[key]
|
|
|
|
|
|
+ for (const item in annotation) {
|
|
|
|
+ if (item === key && annotation[item] !== props[key]) {
|
|
|
|
+ annotation[item] = props[key]
|
|
|
|
|
|
if (key === 'backgroundColor') {
|
|
if (key === 'backgroundColor') {
|
|
- this.borderElement.style[key] = props[key]
|
|
|
|
|
|
+ this.selectElement.style[key] = props[key]
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
- const annotation = {
|
|
|
|
|
|
+ const annotationData = {
|
|
operate: "mod-form",
|
|
operate: "mod-form",
|
|
pageIndex: this.page,
|
|
pageIndex: this.page,
|
|
- pagePtr: this.annotation.pagePtr,
|
|
|
|
- annotPtr: this.annotation.annotPtr,
|
|
|
|
|
|
+ pagePtr: annotation.pagePtr,
|
|
|
|
+ annotPtr: annotation.annotPtr,
|
|
}
|
|
}
|
|
- const updateAnnot = Object.assign({}, annotation, props)
|
|
|
|
|
|
+
|
|
|
|
+ const isFont = ['fontSize', 'fontName', 'color', 'fontStyle'].some(item => props[item])
|
|
|
|
+ if (isFont) {
|
|
|
|
+ annotationData.fontSize = annotation.fontSize
|
|
|
|
+ annotationData.color = annotation.color
|
|
|
|
+ const fontArr = {
|
|
|
|
+ Courier: {
|
|
|
|
+ normal: 'Courier',
|
|
|
|
+ bold: 'Courier-Bold',
|
|
|
|
+ italic: 'Courier-Oblique',
|
|
|
|
+ boldItalic: 'Courier-BoldOblique'
|
|
|
|
+ },
|
|
|
|
+ Helvetica: {
|
|
|
|
+ normal: 'Helvetica',
|
|
|
|
+ bold: 'Helvetica-Bold',
|
|
|
|
+ italic: 'Helvetica-Oblique',
|
|
|
|
+ boldItalic: 'Helvetica-BoldOblique'
|
|
|
|
+ },
|
|
|
|
+ Times: {
|
|
|
|
+ normal: 'Times',
|
|
|
|
+ bold: 'Times-Bold',
|
|
|
|
+ italic: 'Times-Italic',
|
|
|
|
+ boldItalic: 'Times-BoldItalic'
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ const fontName = annotation.fontName
|
|
|
|
+ if (annotation.isBold && annotation.isItalic) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].boldItalic
|
|
|
|
+ } else if (annotation.isBold) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].bold
|
|
|
|
+ } else if (annotation.isItalic) {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].italic
|
|
|
|
+ } else {
|
|
|
|
+ annotationData.fontName = fontArr[fontName].normal
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ const updateAnnot = Object.assign({}, annotationData, props)
|
|
this.eventBus.dispatch('annotationChange', {
|
|
this.eventBus.dispatch('annotationChange', {
|
|
type: 'modify',
|
|
type: 'modify',
|
|
annotation: updateAnnot
|
|
annotation: updateAnnot
|
|
@@ -935,11 +1015,12 @@ export default class ListBox extends Base {
|
|
for (const opt of this.selectElement.children) {
|
|
for (const opt of this.selectElement.children) {
|
|
opt.style.backgroundColor = 'unset'
|
|
opt.style.backgroundColor = 'unset'
|
|
}
|
|
}
|
|
- if (this.selectElement.children[this.annotation.select - 1]) {
|
|
|
|
- this.selectElement.children[this.annotation.select - 1].style.backgroundColor = '#dcdcdc'
|
|
|
|
|
|
+ if (this.selectElement.children[this.annotation.selected]) {
|
|
|
|
+ this.selectElement.children[this.annotation.selected].style.backgroundColor = '#dcdcdc'
|
|
}
|
|
}
|
|
|
|
+ debugger
|
|
this.setProperty({
|
|
this.setProperty({
|
|
- select: this.annotation.select + '',
|
|
|
|
|
|
+ selected: this.annotation.selected,
|
|
name: this.annotation.name
|
|
name: this.annotation.name
|
|
})
|
|
})
|
|
}
|
|
}
|