|
Lines 11-16
Link Here
|
| 11 |
</div> |
11 |
</div> |
| 12 |
<div class="row"> |
12 |
<div class="row"> |
| 13 |
<div class="col-md-6 dashboard-left-col"> |
13 |
<div class="col-md-6 dashboard-left-col"> |
|
|
14 |
<div |
| 15 |
v-if="selectedWidgetsLeft.length === 0" |
| 16 |
class="empty-placeholder" |
| 17 |
> |
| 18 |
{{ $__("Drop widgets here") }} |
| 19 |
</div> |
| 14 |
<draggable |
20 |
<draggable |
| 15 |
:ghost="true" |
21 |
:ghost="true" |
| 16 |
@drag="handleDrag" |
22 |
@drag="handleDrag" |
|
Lines 18-23
Link Here
|
| 18 |
:list="selectedWidgetsLeft" |
24 |
:list="selectedWidgetsLeft" |
| 19 |
group="widgets" |
25 |
group="widgets" |
| 20 |
handle=".widget-drag-handle" |
26 |
handle=".widget-drag-handle" |
|
|
27 |
:class="[ |
| 28 |
'dragArea', |
| 29 |
'list-group', |
| 30 |
'w-full', |
| 31 |
{ 'empty-drag-area': selectedWidgetsLeft.length === 0 }, |
| 32 |
]" |
| 21 |
> |
33 |
> |
| 22 |
<component |
34 |
<component |
| 23 |
v-for="(widget, index) in selectedWidgetsLeft" |
35 |
v-for="(widget, index) in selectedWidgetsLeft" |
|
Lines 32-37
Link Here
|
| 32 |
</draggable> |
44 |
</draggable> |
| 33 |
</div> |
45 |
</div> |
| 34 |
<div class="col-md-6 dashboard-right-col"> |
46 |
<div class="col-md-6 dashboard-right-col"> |
|
|
47 |
<div |
| 48 |
v-if="selectedWidgetsRight.length === 0" |
| 49 |
class="empty-placeholder" |
| 50 |
> |
| 51 |
{{ $__("Drop widgets here") }} |
| 52 |
</div> |
| 35 |
<draggable |
53 |
<draggable |
| 36 |
:ghost="true" |
54 |
:ghost="true" |
| 37 |
@drag="handleDrag" |
55 |
@drag="handleDrag" |
|
Lines 39-44
Link Here
|
| 39 |
:list="selectedWidgetsRight" |
57 |
:list="selectedWidgetsRight" |
| 40 |
group="widgets" |
58 |
group="widgets" |
| 41 |
handle=".widget-drag-handle" |
59 |
handle=".widget-drag-handle" |
|
|
60 |
:class="[ |
| 61 |
'dragArea', |
| 62 |
'list-group', |
| 63 |
'w-full', |
| 64 |
{ 'empty-drag-area': selectedWidgetsRight.length === 0 }, |
| 65 |
]" |
| 42 |
> |
66 |
> |
| 43 |
<component |
67 |
<component |
| 44 |
v-for="(widget, index) in selectedWidgetsRight" |
68 |
v-for="(widget, index) in selectedWidgetsRight" |
|
Lines 253-256
export default {
Link Here
|
| 253 |
.sortable-ghost.sortable-chosen > * { |
277 |
.sortable-ghost.sortable-chosen > * { |
| 254 |
visibility: hidden; |
278 |
visibility: hidden; |
| 255 |
} |
279 |
} |
|
|
280 |
.dashboard-right-col, |
| 281 |
.dashboard-left-col { |
| 282 |
position: relative; |
| 283 |
} |
| 284 |
|
| 285 |
.empty-placeholder { |
| 286 |
position: absolute; |
| 287 |
top: 0; |
| 288 |
left: 0; |
| 289 |
right: 0; |
| 290 |
min-height: 150px; |
| 291 |
background-color: #fafafa; |
| 292 |
color: #999; |
| 293 |
font-style: italic; |
| 294 |
font-size: 1.2rem; |
| 295 |
pointer-events: none; |
| 296 |
border: 2px dotted #ccc; |
| 297 |
display: flex; |
| 298 |
align-items: center; |
| 299 |
justify-content: center; |
| 300 |
border-radius: 8px; |
| 301 |
z-index: 2; |
| 302 |
} |
| 303 |
|
| 304 |
.empty-drag-area { |
| 305 |
min-height: 150px; |
| 306 |
} |
| 256 |
</style> |
307 |
</style> |
| 257 |
- |
|
|