Skip to content
GitLab
Projects
Groups
Snippets
Help
Loading...
Help
What's new
10
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
Open sidebar
Motion Bank
MB.js
Quasar Components MoSys
Commits
57b1b26d
Commit
57b1b26d
authored
Mar 03, 2019
by
Anton
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Add styleClass editing dialog to cell context menu in grid editor
parent
969923a1
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
58 additions
and
20 deletions
+58
-20
partials/Cell.vue
partials/Cell.vue
+1
-1
partials/GridDisplay.vue
partials/GridDisplay.vue
+1
-1
partials/GridEditor.vue
partials/GridEditor.vue
+56
-18
No files found.
partials/Cell.vue
View file @
57b1b26d
...
...
@@ -35,7 +35,7 @@
const
classes
=
[
'
cell-content
'
]
if
(
this
.
cell
)
{
if
(
this
.
cell
.
type
)
classes
.
push
(
`cell-type-
${
this
.
cell
.
type
.
toLowerCase
()}
`
)
if
(
this
.
cell
.
styleClass
)
classes
.
push
(
this
.
cell
.
styleClass
.
substr
(
1
)
)
if
(
this
.
cell
.
styleClass
)
classes
.
push
(
this
.
cell
.
styleClass
)
}
return
classes
}
...
...
partials/GridDisplay.vue
View file @
57b1b26d
...
...
@@ -2,7 +2,6 @@
div.cell-grid-container
div.cell-grid(:style="gridStyle")
style-tag(v-if="styles", :styles="styles")
template(v-for="(cell, index) in cells")
.cell-item(
:style="getCellStyle(cell)",
...
...
@@ -12,6 +11,7 @@
q-page-sticky(position="top-right", :offset="[18, 18]", v-if="$store.state.auth.user")
q-btn(round, color="primary", small, @click="$router.push(`/mosys/grids/${$route.params.id}/annotate`)")
q-icon(name="edit")
style-tag(v-if="styles", :styles="styles")
</
template
>
...
...
partials/GridEditor.vue
View file @
57b1b26d
...
...
@@ -74,6 +74,8 @@
<
script
>
import
{
ObjectUtil
}
from
'
mbjs-utils
'
import
Cell
from
'
./Cell
'
import
{
userHasFeature
}
from
'
mbjs-quasar/src/lib
'
import
{
mapGetters
}
from
'
vuex
'
const
nullImage
=
new
Image
()
nullImage
.
src
=
'
data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
'
...
...
@@ -85,24 +87,6 @@
props
:
[
'
gridUuid
'
],
data
()
{
return
{
cellContextMenuActions
:
{
// edit: {
// label: 'Edit',
// handler: this.handleCellContextMenuEdit
// },
delete
:
{
label
:
'
Delete
'
,
handler
:
this
.
handleCellContextMenuDelete
},
insert_column_left
:
{
label
:
'
Insert Column Left
'
,
handler
:
this
.
handleGridContextMenuInsertColumnLeft
},
insert_row_above
:
{
label
:
'
Insert Row Above
'
,
handler
:
this
.
handleGridContextMenuInsertRowAbove
}
},
gridContextMenuActions
:
{
// add_cell: {
// label: 'Add Cell',
...
...
@@ -140,6 +124,38 @@
resizingGrid
:
false
}
},
computed
:
{
...
mapGetters
({
user
:
'
auth/getUserState
'
}),
cellContextMenuActions
()
{
const
actions
=
{
// edit: {
// label: 'Edit',
// handler: this.handleCellContextMenuEdit
// },
delete
:
{
label
:
'
Delete
'
,
handler
:
this
.
handleCellContextMenuDelete
},
insert_column_left
:
{
label
:
'
Insert Column Left
'
,
handler
:
this
.
handleGridContextMenuInsertColumnLeft
},
insert_row_above
:
{
label
:
'
Insert Row Above
'
,
handler
:
this
.
handleGridContextMenuInsertRowAbove
}
}
if
(
userHasFeature
(
this
.
user
,
'
cssediting
'
))
{
actions
.
edit_css_classname
=
{
label
:
'
Edit CSS class name
'
,
handler
:
this
.
handleCellContextMenuEditCSS
}
}
return
actions
}
},
async
mounted
()
{
window
.
addEventListener
(
'
resize
'
,
this
.
updateGridDimensions
)
await
this
.
fetchData
()
...
...
@@ -228,6 +244,26 @@
handleCellContextMenu
(
event
)
{
this
.
contextMenuClickPosition
=
this
.
getGridPositionForEvent
(
event
)
},
async
handleCellContextMenuEditCSS
(
event
,
cell
)
{
try
{
let
styleClass
=
await
this
.
$q
.
dialog
({
title
:
this
.
$t
(
'
forms.edit_css_class.title
'
),
ok
:
this
.
$t
(
'
buttons.set_css_class
'
),
cancel
:
this
.
$t
(
'
buttons.cancel
'
),
prompt
:
{
model
:
cell
.
styleClass
,
type
:
'
text
'
}
})
if
(
styleClass
)
{
if
(
!
styleClass
.
length
)
styleClass
=
undefined
else
if
(
styleClass
.
indexOf
(
'
.
'
)
===
0
)
styleClass
=
styleClass
.
substr
(
1
)
}
cell
.
styleClass
=
styleClass
this
.
$store
.
dispatch
(
'
annotations/patch
'
,
[
cell
.
uuid
,
{
target
:
{
styleClass
:
styleClass
||
null
}
}])
}
catch
(
e
)
{
/* dialog canceled */
}
},
handleGridDragOver
(
event
)
{
let
_this
=
this
if
(
this
.
resizingGrid
)
{
...
...
@@ -474,6 +510,8 @@
let
cell
=
JSON
.
parse
(
annotation
.
body
.
value
)
if
(
cell
)
{
cell
.
uuid
=
annotation
.
uuid
cell
.
id
=
annotation
.
id
cell
.
styleClass
=
annotation
.
target
?
annotation
.
target
.
styleClass
:
undefined
return
cell
}
return
null
...
...
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