add template submitters
This commit is contained in:
Alex Turchyn
@@ -6,44 +6,32 @@
|
||||
@mousedown.stop="startDrag"
|
||||
>
|
||||
<div
|
||||
v-if="field"
|
||||
v-if="isSelected"
|
||||
class="top-0 bottom-0 right-0 left-0 absolute border border-1.5 pointer-events-none"
|
||||
:class="borderColors[submitterIndex]"
|
||||
/>
|
||||
<div
|
||||
v-if="field?.type"
|
||||
class="absolute bg-white rounded-t border overflow-visible whitespace-nowrap group-hover:flex group-hover:z-10"
|
||||
:class="{ flex: isNameFocus || isSelected, hidden: !isNameFocus && !isSelected }"
|
||||
:class="{ 'flex z-10': isNameFocus || isSelected, hidden: !isNameFocus && !isSelected }"
|
||||
style="top: -25px; height: 25px"
|
||||
@mousedown.stop
|
||||
@pointerdown.stop
|
||||
>
|
||||
<span class="dropdown dropdown-start border-r">
|
||||
<label
|
||||
tabindex="0"
|
||||
title="Submitter"
|
||||
class="cursor-pointer text-base-100"
|
||||
@click="selectedAreaRef.value = area"
|
||||
>
|
||||
<button class="mx-1 w-3 h-3 rounded-full bg-yellow-600" />
|
||||
</label>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="dropdown-content bg-white menu menu-xs p-2 shadow rounded-box w-52 rounded-t-none"
|
||||
style="left: -1px"
|
||||
@click="closeDropdown"
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
href="#"
|
||||
class="text-sm py-1 px-2"
|
||||
@click.prevent
|
||||
>
|
||||
Submitter 1
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
<FieldSubmitter
|
||||
v-model="field.submitter_uuid"
|
||||
class="border-r"
|
||||
:compact="true"
|
||||
:menu-classes="'dropdown-content bg-white menu menu-xs p-2 shadow rounded-box w-52 rounded-t-none -left-[1px]'"
|
||||
:submitters="template.submitters"
|
||||
@click="selectedAreaRef.value = area"
|
||||
/>
|
||||
<FieldType
|
||||
v-model="field.type"
|
||||
:button-width="27"
|
||||
:button-classes="'px-1'"
|
||||
:menu-classes="'bg-white rounded-t-none'"
|
||||
@update:model-value="maybeDeleteOptions"
|
||||
@click="selectedAreaRef.value = area"
|
||||
/>
|
||||
<span
|
||||
@@ -64,7 +52,8 @@
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="bg-red-100 opacity-50 flex items-center justify-center h-full w-full"
|
||||
class="opacity-50 flex items-center justify-center h-full w-full"
|
||||
:class="bgColors[submitterIndex]"
|
||||
>
|
||||
<span
|
||||
v-if="field"
|
||||
@@ -74,23 +63,25 @@
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="absolute top-0 bottom-0 right-0 left-0"
|
||||
class="absolute top-0 bottom-0 right-0 left-0 cursor-pointer"
|
||||
/>
|
||||
<span
|
||||
class="h-2 w-2 -right-1 rounded-full -bottom-1 bg-red-900 absolute cursor-nwse-resize"
|
||||
class="h-2.5 w-2.5 -right-1.5 rounded-full -bottom-1.5 bg-white shadow border absolute cursor-nwse-resize"
|
||||
@mousedown.stop="startResize"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FieldSubmitter from './field_submitter'
|
||||
import FieldType from './field_type'
|
||||
import Field from './field'
|
||||
|
||||
export default {
|
||||
name: 'FieldArea',
|
||||
components: {
|
||||
FieldType
|
||||
FieldType,
|
||||
FieldSubmitter
|
||||
},
|
||||
inject: ['template', 'selectedAreaRef'],
|
||||
props: {
|
||||
@@ -115,6 +106,30 @@ export default {
|
||||
computed: {
|
||||
defaultName: Field.computed.defaultName,
|
||||
fieldIcons: FieldType.computed.fieldIcons,
|
||||
submitter () {
|
||||
return this.template.submitters.find((s) => s.uuid === this.field.submitter_uuid)
|
||||
},
|
||||
submitterIndex () {
|
||||
return this.template.submitters.indexOf(this.submitter)
|
||||
},
|
||||
borderColors () {
|
||||
return [
|
||||
'border-red-500',
|
||||
'border-sky-500',
|
||||
'border-emerald-500',
|
||||
'border-yellow-300',
|
||||
'border-purple-600'
|
||||
]
|
||||
},
|
||||
bgColors () {
|
||||
return [
|
||||
'bg-red-100',
|
||||
'bg-sky-100',
|
||||
'bg-emerald-100',
|
||||
'bg-yellow-100',
|
||||
'bg-purple-100'
|
||||
]
|
||||
},
|
||||
withName () {
|
||||
return !['checkbox', 'radio'].includes(this.field.type) || this.field.options
|
||||
},
|
||||
@@ -145,6 +160,11 @@ export default {
|
||||
}, 1)
|
||||
}
|
||||
},
|
||||
maybeDeleteOptions () {
|
||||
if (!['radio', 'select', 'checkbox'].includes(this.field.type)) {
|
||||
delete this.field.options
|
||||
}
|
||||
},
|
||||
onNameBlur (e) {
|
||||
this.isNameFocus = false
|
||||
this.$refs.name.style.minWidth = ''
|
||||
|
||||
@@ -74,8 +74,8 @@
|
||||
:key="document.uuid"
|
||||
:ref="setDocumentRefs"
|
||||
:areas-index="fieldAreasIndex[document.uuid]"
|
||||
:selected-submitter="selectedSubmitter"
|
||||
:document="document"
|
||||
:is-draw="!!drawField"
|
||||
:is-drag="!!dragFieldType"
|
||||
@draw="onDraw"
|
||||
@drop-field="onDropfield"
|
||||
@@ -84,7 +84,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="relative w-80 flex-none pt-0.5 pr-4"
|
||||
class="relative w-80 flex-none pt-0.5 pr-4 pl-0.5"
|
||||
:class="drawField ? 'overflow-hidden' : 'overflow-auto'"
|
||||
>
|
||||
<div
|
||||
@@ -99,9 +99,12 @@
|
||||
<div>
|
||||
<Fields
|
||||
ref="fields"
|
||||
v-model:fields="template.fields"
|
||||
:fields="template.fields"
|
||||
:submitters="template.submitters"
|
||||
:selected-submitter="selectedSubmitter"
|
||||
@set-draw="drawField = $event"
|
||||
@set-drag="dragFieldType = $event"
|
||||
@change-submitter="selectedSubmitter = $event"
|
||||
@drag-end="dragFieldType = null"
|
||||
@scroll-to-area="scrollToArea"
|
||||
/>
|
||||
@@ -154,6 +157,7 @@ export default {
|
||||
return {
|
||||
documentRefs: [],
|
||||
isSaving: false,
|
||||
selectedSubmitter: null,
|
||||
drawField: null,
|
||||
dragFieldType: null
|
||||
}
|
||||
@@ -183,11 +187,14 @@ export default {
|
||||
})
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.selectedSubmitter = this.template.submitters[0]
|
||||
},
|
||||
mounted () {
|
||||
document.addEventListener('keyup', this.disableDrawOnEsc)
|
||||
document.addEventListener('keyup', this.onKeyUp)
|
||||
},
|
||||
unmounted () {
|
||||
document.removeEventListener('keyup', this.disableDrawOnEsc)
|
||||
document.removeEventListener('keyup', this.onKeyUp)
|
||||
},
|
||||
beforeUpdate () {
|
||||
this.documentRefs = []
|
||||
@@ -203,12 +210,21 @@ export default {
|
||||
|
||||
ref.$el.scrollIntoView({ behavior: 'smooth', block: 'start' })
|
||||
},
|
||||
disableDrawOnEsc (e) {
|
||||
onKeyUp (e) {
|
||||
if (e.code === 'Escape') {
|
||||
this.drawField = null
|
||||
selectedAreaRef.value = null
|
||||
}
|
||||
|
||||
if (['Backspace', 'Delete'].includes(e.key) && selectedAreaRef.value && document.activeElement === document.body) {
|
||||
this.removeArea({ area: selectedAreaRef.value })
|
||||
|
||||
selectedAreaRef.value = null
|
||||
}
|
||||
},
|
||||
removeArea ({ field, area }) {
|
||||
removeArea ({ area }) {
|
||||
const field = this.template.fields.find((f) => f.areas?.includes(area))
|
||||
|
||||
field.areas.splice(field.areas.indexOf(area), 1)
|
||||
|
||||
if (!field.areas.length) {
|
||||
@@ -241,19 +257,21 @@ export default {
|
||||
uuid: v4(),
|
||||
required: true,
|
||||
type,
|
||||
submitter_uuid: this.selectedSubmitter.uuid,
|
||||
areas: [area]
|
||||
}
|
||||
|
||||
selectedAreaRef.value = area
|
||||
|
||||
this.template.fields.push(field)
|
||||
}
|
||||
|
||||
selectedAreaRef.value = area
|
||||
},
|
||||
onDropfield (area) {
|
||||
const field = {
|
||||
name: '',
|
||||
type: this.dragFieldType,
|
||||
uuid: v4(),
|
||||
submitter_uuid: this.selectedSubmitter.uuid,
|
||||
required: true
|
||||
}
|
||||
|
||||
@@ -270,7 +288,7 @@ export default {
|
||||
|
||||
if (this.selectedField?.type === this.dragFieldType) {
|
||||
baseArea = selectedAreaRef.value
|
||||
} else if (previousField) {
|
||||
} else if (previousField?.areas) {
|
||||
baseArea = previousField.areas[previousField.areas.length - 1]
|
||||
} else {
|
||||
if (['checkbox', 'radio'].includes(this.dragFieldType)) {
|
||||
@@ -344,7 +362,7 @@ export default {
|
||||
this.isSaving = true
|
||||
|
||||
this.save().then(() => {
|
||||
window.Turbo.visit('/')
|
||||
// window.Turbo.visit('/')
|
||||
}).finally(() => {
|
||||
this.isSaving = false
|
||||
})
|
||||
@@ -353,6 +371,8 @@ export default {
|
||||
const documentRef = this.documentRefs.find((a) => a.document.uuid === area.attachment_uuid)
|
||||
|
||||
documentRef.scrollToArea(area)
|
||||
|
||||
selectedAreaRef.value = area
|
||||
},
|
||||
save () {
|
||||
this.$el.closest('template-builder').dataset.template = JSON.stringify(this.template)
|
||||
|
||||
@@ -6,8 +6,8 @@
|
||||
:ref="setPageRefs"
|
||||
:number="index"
|
||||
:areas="areasIndex[index]"
|
||||
:is-draw="isDraw"
|
||||
:is-drag="isDrag"
|
||||
:selected-submitter="selectedSubmitter"
|
||||
:image="image"
|
||||
@drop-field="$emit('drop-field', {...$event, attachment_uuid: document.uuid })"
|
||||
@remove-area="$emit('remove-area', $event)"
|
||||
@@ -33,10 +33,9 @@ export default {
|
||||
required: false,
|
||||
default: () => ({})
|
||||
},
|
||||
isDraw: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
selectedSubmitter: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
isDrag: {
|
||||
type: Boolean,
|
||||
|
||||
@@ -4,13 +4,14 @@
|
||||
@click="field.areas?.[0] && $emit('scroll-to', field.areas[0])"
|
||||
>
|
||||
<div
|
||||
class="border border-gray-300 rounded rounded-tr-none relative group"
|
||||
class="border border-base-300 rounded rounded-tr-none relative group"
|
||||
>
|
||||
<div class="flex items-center justify-between space-x-1">
|
||||
<div class="flex items-center p-1 space-x-1">
|
||||
<FieldType
|
||||
v-model="field.type"
|
||||
:button-width="20"
|
||||
@update:model-value="maybeDeleteOptions"
|
||||
/>
|
||||
<Contenteditable
|
||||
ref="name"
|
||||
@@ -36,7 +37,7 @@
|
||||
</label>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="mt-1.5 dropdown-content menu menu-xs p-2 shadow bg-base-100 rounded-box w-52"
|
||||
class="mt-1.5 dropdown-content menu menu-xs p-2 shadow bg-base-100 rounded-box w-52 z-10"
|
||||
@click="closeDropdown"
|
||||
>
|
||||
<li
|
||||
@@ -178,6 +179,11 @@ export default {
|
||||
closeDropdown () {
|
||||
document.activeElement.blur()
|
||||
},
|
||||
maybeDeleteOptions () {
|
||||
if (!['radio', 'select', 'checkbox'].includes(this.field.type)) {
|
||||
delete this.field.options
|
||||
}
|
||||
},
|
||||
onNameBlur (e) {
|
||||
if (e.target.innerText.trim()) {
|
||||
this.field.name = e.target.innerText.trim()
|
||||
|
||||
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<div class="dropdown">
|
||||
<label
|
||||
v-if="compact"
|
||||
tabindex="0"
|
||||
:title="selectedSubmitter.name"
|
||||
class="cursor-pointer text-base-100"
|
||||
>
|
||||
<button
|
||||
class="mx-1 w-3 h-3 rounded-full"
|
||||
:class="colors[submitters.indexOf(selectedSubmitter)]"
|
||||
/>
|
||||
</label>
|
||||
<label
|
||||
v-else
|
||||
tabindex="0"
|
||||
class="rounded-md p-2 border border-base-300 w-full flex justify-between"
|
||||
>
|
||||
<div class="flex items-center space-x-2">
|
||||
<span
|
||||
class="w-3 h-3 rounded-full"
|
||||
:class="colors[submitters.indexOf(selectedSubmitter)]"
|
||||
/>
|
||||
<Contenteditable
|
||||
v-model="selectedSubmitter.name"
|
||||
:icon-inline="true"
|
||||
:icon-width="18"
|
||||
/>
|
||||
</div>
|
||||
<span>
|
||||
▼
|
||||
</span>
|
||||
</label>
|
||||
<ul
|
||||
tabindex="0"
|
||||
:class="menuClasses"
|
||||
@click="closeDropdown"
|
||||
>
|
||||
<li
|
||||
v-for="(submitter, index) in submitters"
|
||||
:key="submitter.uuid"
|
||||
>
|
||||
<a
|
||||
href="#"
|
||||
class="flex px-2 group justify-between items-center"
|
||||
:class="{ 'active': submitter === selectedSubmitter }"
|
||||
@click.prevent="selectSubmitter(submitter)"
|
||||
>
|
||||
<span class="py-1 flex items-center">
|
||||
<span
|
||||
class="rounded-full w-3 h-3 ml-1 mr-3"
|
||||
:class="colors[index]"
|
||||
/>
|
||||
<span>
|
||||
{{ submitter.name }}
|
||||
</span>
|
||||
</span>
|
||||
<button
|
||||
v-if="!compact && submitters.length > 1"
|
||||
class="hidden group-hover:block px-2"
|
||||
@click.stop="remove(submitter)"
|
||||
>
|
||||
<IconTrashX :width="18" />
|
||||
</button>
|
||||
</a>
|
||||
</li>
|
||||
<li v-if="submitters.length < 5">
|
||||
<a
|
||||
href="#"
|
||||
class="flex px-2"
|
||||
@click.prevent="addSubmitter"
|
||||
>
|
||||
<IconUserPlus
|
||||
:width="20"
|
||||
:stroke-width="1.6"
|
||||
/>
|
||||
<span class="py-1">
|
||||
Add Submitter
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { IconUserPlus, IconTrashX } from '@tabler/icons-vue'
|
||||
import Contenteditable from './contenteditable'
|
||||
import { v4 } from 'uuid'
|
||||
|
||||
export default {
|
||||
name: 'FieldSubmitter',
|
||||
components: {
|
||||
IconUserPlus,
|
||||
Contenteditable,
|
||||
IconTrashX
|
||||
},
|
||||
props: {
|
||||
submitters: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
compact: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
},
|
||||
modelValue: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
menuClasses: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'dropdown-content menu p-2 shadow bg-base-100 rounded-box w-full z-10'
|
||||
}
|
||||
},
|
||||
emits: ['update:model-value', 'remove'],
|
||||
computed: {
|
||||
colors () {
|
||||
return [
|
||||
'bg-red-500',
|
||||
'bg-sky-500',
|
||||
'bg-emerald-500',
|
||||
'bg-yellow-300',
|
||||
'bg-purple-600'
|
||||
]
|
||||
},
|
||||
selectedSubmitter () {
|
||||
return this.submitters.find((e) => e.uuid === this.modelValue)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectSubmitter (submitter) {
|
||||
this.$emit('update:model-value', submitter.uuid)
|
||||
},
|
||||
remove (submitter) {
|
||||
if (window.confirm('Are you sure?')) {
|
||||
this.$emit('remove', submitter)
|
||||
}
|
||||
},
|
||||
addSubmitter () {
|
||||
const newSubmitter = {
|
||||
name: `Submitter ${this.submitters.length + 1}`,
|
||||
uuid: v4()
|
||||
}
|
||||
|
||||
this.submitters.push(newSubmitter)
|
||||
|
||||
this.$emit('update:model-value', newSubmitter.uuid)
|
||||
},
|
||||
closeDropdown () {
|
||||
document.activeElement.blur()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -14,7 +14,7 @@
|
||||
</label>
|
||||
<ul
|
||||
tabindex="0"
|
||||
class="dropdown-content menu menu-xs p-2 shadow rounded-box w-52"
|
||||
class="dropdown-content menu menu-xs p-2 shadow rounded-box w-52 z-10"
|
||||
:class="menuClasses"
|
||||
@click="closeDropdown"
|
||||
>
|
||||
|
||||
@@ -1,11 +1,18 @@
|
||||
<template>
|
||||
<div class="mb-1">
|
||||
<FieldSubmitter
|
||||
:model-value="selectedSubmitter.uuid"
|
||||
class="w-full"
|
||||
:submitters="submitters"
|
||||
@remove="removeSubmitter"
|
||||
@update:model-value="$emit('change-submitter', submitters.find((s) => s.uuid === $event))"
|
||||
/>
|
||||
<div class="mb-1 mt-2">
|
||||
<Field
|
||||
v-for="field in fields"
|
||||
v-for="field in submitterFields"
|
||||
:key="field.uuid"
|
||||
:field="field"
|
||||
:type-index="fields.filter((f) => f.type === field.type).indexOf(field)"
|
||||
@remove="fields.splice(fields.indexOf($event), 1)"
|
||||
@remove="removeField"
|
||||
@move-up="move(field, -1)"
|
||||
@move-down="move(field, 1)"
|
||||
@scroll-to="$emit('scroll-to-area', $event)"
|
||||
@@ -17,7 +24,7 @@
|
||||
v-for="(icon, type) in fieldIcons"
|
||||
:key="type"
|
||||
draggable="true"
|
||||
class="flex items-center justify-center border border-dashed border-gray-300 bg-base-100 w-full rounded relative"
|
||||
class="flex items-center justify-center border border-dashed border-base-300 bg-base-100 w-full rounded relative"
|
||||
@dragstart="onDragstart(type)"
|
||||
@dragend="$emit('drag-end')"
|
||||
@click="addField(type)"
|
||||
@@ -62,26 +69,52 @@
|
||||
import Field from './field'
|
||||
import { v4 } from 'uuid'
|
||||
import FieldType from './field_type'
|
||||
import FieldSubmitter from './field_submitter'
|
||||
|
||||
export default {
|
||||
name: 'TemplateFields',
|
||||
components: {
|
||||
Field
|
||||
Field,
|
||||
FieldSubmitter
|
||||
},
|
||||
props: {
|
||||
fields: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
submitters: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
selectedSubmitter: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
emits: ['set-draw', 'set-drag', 'drag-end', 'scroll-to-area'],
|
||||
emits: ['set-draw', 'set-drag', 'drag-end', 'scroll-to-area', 'change-submitter'],
|
||||
computed: {
|
||||
fieldIcons: FieldType.computed.fieldIcons
|
||||
fieldIcons: FieldType.computed.fieldIcons,
|
||||
submitterFields () {
|
||||
return this.fields.filter((f) => f.submitter_uuid === this.selectedSubmitter.uuid)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onDragstart (fieldType) {
|
||||
this.$emit('set-drag', fieldType)
|
||||
},
|
||||
removeSubmitter (submitter) {
|
||||
[...this.fields].forEach((field) => {
|
||||
if (field.submitter_uuid === submitter.uuid) {
|
||||
this.removeField(field)
|
||||
}
|
||||
})
|
||||
|
||||
this.submitters.splice(this.submitters.indexOf(submitter), 1)
|
||||
|
||||
if (this.selectedSubmitter === submitter) {
|
||||
this.$emit('change-submitter', this.submitters[0])
|
||||
}
|
||||
},
|
||||
move (field, direction) {
|
||||
const currentIndex = this.fields.indexOf(field)
|
||||
|
||||
@@ -95,11 +128,15 @@ export default {
|
||||
this.fields.splice(currentIndex + direction, 0, field)
|
||||
}
|
||||
},
|
||||
removeField (field) {
|
||||
this.fields.splice(this.fields.indexOf(field), 1)
|
||||
},
|
||||
addField (type, area = null) {
|
||||
const field = {
|
||||
name: '',
|
||||
uuid: v4(),
|
||||
required: true,
|
||||
submitter_uuid: this.selectedSubmitter.uuid,
|
||||
type
|
||||
}
|
||||
|
||||
|
||||
@@ -18,14 +18,15 @@
|
||||
:ref="setAreaRefs"
|
||||
:area="item.area"
|
||||
:field="item.field"
|
||||
@start-resize="showMask = true"
|
||||
@stop-resize="showMask = false"
|
||||
@start-drag="showMask = true"
|
||||
@stop-drag="showMask = false"
|
||||
@start-resize="[showMask = true, isResize = true]"
|
||||
@stop-resize="[showMask = false, isResize = false]"
|
||||
@start-drag="[showMask = true, isMove = true]"
|
||||
@stop-drag="[showMask = false, isMove = false]"
|
||||
@remove="$emit('remove-area', item)"
|
||||
/>
|
||||
<FieldArea
|
||||
v-if="newArea"
|
||||
:field="{ submitter_uuid: selectedSubmitter.uuid }"
|
||||
:area="newArea"
|
||||
/>
|
||||
</div>
|
||||
@@ -33,7 +34,8 @@
|
||||
v-show="isDrag || showMask"
|
||||
id="mask"
|
||||
ref="mask"
|
||||
class="top-0 bottom-0 left-0 right-0 absolute"
|
||||
class="top-0 bottom-0 left-0 right-0 absolute z-10"
|
||||
:class="{ 'cursor-grab': isDrag || isMove, ' cursor-nwse-resize': isResize }"
|
||||
@pointermove="onPointermove"
|
||||
@dragover.prevent
|
||||
@drop="onDrop"
|
||||
@@ -60,10 +62,9 @@ export default {
|
||||
required: false,
|
||||
default: () => []
|
||||
},
|
||||
selectedArea: {
|
||||
selectedSubmitter: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: () => ({})
|
||||
required: true
|
||||
},
|
||||
isDrag: {
|
||||
type: Boolean,
|
||||
@@ -80,6 +81,8 @@ export default {
|
||||
return {
|
||||
areaRefs: [],
|
||||
showMask: false,
|
||||
isMove: false,
|
||||
isResize: false,
|
||||
newArea: null
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user