Showing [object Object] in the column Revolist vue3-DataGrid - grid

How to Render "Object" Types in Revolist vue3-DataGrid.
I am trying to render object details with name property.
How Can I add custom types for the grid
const columns = [
{
prop: "name",
name: "First",
size: 150,
columnType: "select",
source: ["According", "Source"]
},
{
prop: "details.name",
name: "Second column",
size: 200
}
];
const items = [
{
name: "Source",
details: { name: "Item Description" }
}
];

Related

How to separate Realm Object into two and get them into one variable?

My goal to divide Realm.Object, so we can reuse specific object in different place. To reduce storage use.
The practical use would be:
call realm.objects("ChatList") to get the lastMessage value, without the need to get all of Message objects.
e.g reusing User Object. A User Object can be used in Message Object and ChatList Object.
User Object
const UserSchema: Realm.Object = {
name: "User",
properties: {
user: "string",
displayName: "string",
}
}
Message Object
const MessageObject: Realm.Object = {
name: "Message",
properties: {
user: "User",
message: "string",
}
}
ChatList Object
const ChatListSchema: Realm.Object = {
name: "ChatList",
properties: {
name: "string",
lastMessage: "Message",
}
}
What I've did:
I have read about Realm Data Model > Relationsihp. It requires to explicitly define it in the properties
e.g.
const User: Realm.Object = {
name: "User",
properties: {
name: "string",
tasks: "Task[]",
}
};
const Tasks: realm.Object = {
name: "Task",
properties: {
text: "string",
}
}
However, I am not sure how to link Task to other object. e.g if I use it like this
const write = () => {
realm.write(() => {
realm.create("User", {
name: "Jack",
tasks: [
{
text: "Say 1",
},
],
});
});
}

How to add array of ids to entity that doesn't have them

I have my schema set up almost exactly how I want it in redux state, except I want to add an array of form ids to the formTemplate object.
It would look like this:
// Normalized Form Templates
{
1: {
id: '1',
isGlobal: true,
name: 'Form Template Name',
forms: [1, 2], // This is the line I want to add...but how?
},
}
// Normalized Forms
{
1: {
id: '1',
createdAt: '2016-12-28T23:30:13.547Z',
name: 'Form 1',
parentTemplate: '1',
pdfs: [1, 2],
},
2: {
id: '2',
createdAt: '2016-12-28T23:30:13.547Z',
name: 'Form 2',
parentTemplate: '1',
pdfs: [],
},
}
Here is my schema
import { schema } from 'normalizr'
const formTemplate = new schema.Entity('formTemplates', {}, {
processStrategy: value => ({
id: value.id,
name: value.attributes.title,
isGlobal: value.attributes.is_global,
}),
})
const form = new schema.Entity('forms', {
pdfs: [pdf],
}, {
processStrategy: value => ({
id: value.id,
createdAt: value.attributes.created_at,
name: value.attributes.title,
parentTemplate: value.attributes.form_template_id,
pdfs: [...value.relationships.documents.data],
}),
})
const pdf = new schema.Entity('pdfs')
export default {
data: [form],
included: [formTemplate],
}
This is an example of the API response that I'm normalizing
{
"data": [
{
"id": "5",
"type": "provider_forms",
"attributes": {
"title": "Form 1",
"created_at": "2017-01-02T06:00:42.518Z",
"form_template_id": 1
},
"relationships": {
"form_template": {
"data": {
"id": "1",
"type": "form_templates"
}
},
"documents": {
"data": [ // some pdf data here ]
}
}
}
],
"included": [
{
"id": "1",
"type": "form_templates",
"attributes": {
"title": "Form Template",
"created_at": "2016-12-29T22:24:36.201Z",
"updated_at": "2017-01-02T06:00:20.205Z",
"is_global": true
},
}
]
}
You won't be able to do this with Normalizr because the form template entity has no context back to the forms entities. Your actions/reducer need to handle this.
Okay I figured out a way to do this. I changed my formTemplate entity to map them in manually like so:
const formTemplate = new schema.Entity('formTemplates', {}, {
processStrategy: (value, parent) => {
// eslint-disable-next-line eqeqeq
const childrenForms = parent.data.filter(form => form.attributes.form_template_id == value.id)
return {
id: value.id,
name: value.attributes.title,
isGlobal: value.attributes.is_global,
forms: childrenForms.map(form => form.id),
}
},
})

how to extend faceted search by passing extra argument to the url in alfresco 5.1.1

We want to customize the faceted search by passing extra argument in the faceted search URL and read it in org\alfresco\slingshot\search\search.get.js---->search.lib.js.
http://localhost:8080/share/page/dp/ws/faceted-search#searchTerm=Koala.jpg&scope=repo&nodeRef=test
In searchDocLib json ,we have nodeRef value assigned it to selectedContainer but that argument is not coming in search.get.js. Basically how to pass extra argument in searchDocLib?How to enable logs for faceted-search.get.js so that logger statements should be printed in share.log?
var noderef = (page.url.args["nodeRef"] != null) ? page.url.args["nodeRef"] : "";
logger.log(page.url.templateArgs.nodeRef+"....nodeRef = "+nodeRef);
// Build the searchDocLib model
var searchDocLib = {
id: "FCTSRCH_SEARCH_RESULTS_LIST",
name: "alfresco/documentlibrary/AlfSearchList",
config: {
viewPreferenceProperty: "org.alfresco.share.searchList.viewRendererName",
view: viewRendererName,
waitForPageWidgets: true,
useHash: true,
useLocalStorageHashFallback: true,
hashVarsForUpdate: [
"searchTerm",
"facetFilters",
"sortField",
"sortAscending",
"query",
"scope",
"selectedContainer"
],
selectedScope: "repo",
useInfiniteScroll: true,
siteId: null,
rootNode: repoRootNode,
repo: false,
selectedContainer: noderef,
additionalControlsTarget: "FCTSRCH_RESULTS_MENU_BAR",
additionalViewControlVisibilityConfig: hideOnZeroResultsConfig,
widgets: [
{
id: "FCTSRCH_SEARCH_ADVICE_NO_RESULTS",
name: "alfresco/documentlibrary/views/AlfSearchListView",
config: {
widgetsForNoDataDisplay: widgetsForNoDataDisplay,
a11yCaption: msg.get("faceted-search.results.caption"),
a11yCaptionClass: "hiddenAccessible",
widgetsForHeader: [
{
id: "FCTSRCH_THUMBNAIL_HEADER_CELL",
name: "alfresco/documentlibrary/views/layouts/HeaderCell",
config: {
label: msg.get("faceted-search.results.heading.thumbnail"),
class: "hiddenAccessible",
a11yScope: "col"
}
},
{
id: "FCTSRCH_DETAILS_HEADER_CELL",
name: "alfresco/documentlibrary/views/layouts/HeaderCell",
config: {
label: msg.get("faceted-search.results.heading.details"),
class: "hiddenAccessible",
a11yScope: "col"
}
},
{
id: "FCTSRCH_ACTIONS_HEADER_CELL",
name: "alfresco/documentlibrary/views/layouts/HeaderCell",
config: {
label: msg.get("faceted-search.results.heading.actions"),
class: "hiddenAccessible",
a11yScope: "col"
}
}
],
widgets: [
{
id: "FCTSRCH_SEARCH_RESULT",
name: "alfresco/search/AlfSearchResult",
config: {
enableContextMenu: false
}
}
]
}
},
{
id: "FCTSRCH_GALLERY_VIEW",
name: "alfresco/documentlibrary/views/AlfGalleryView",
config: {
showNextLink: true,
nextLinkLabel: msg.get("faceted-search.show-more-results.label"),
widgetsForNoDataDisplay: widgetsForNoDataDisplay,
widgets: [
{
id: "FCTSRCH_GALLERY_VIEW_THUMBNAIL_DOC_OR_FOLDER",
name: "alfresco/search/SearchGalleryThumbnail",
config: {
widgetsForSelectBar: [
{
id: "FCTSRCH_GALLERY_VIEW_MORE_INFO_OR_FOLDER",
name: "alfresco/renderers/MoreInfo",
align: "right",
config: {
filterActions: true,
xhrRequired: true
}
}
],
publishTopic: "ALF_NAVIGATE_TO_PAGE",
renderFilter: [
{
property: "type",
values: ["document","folder"],
negate: false
}
]
}
},
{
id: "FCTSRCH_GALLERY_VIEW_THUMBNAIL_OTHER",
name: "alfresco/search/SearchGalleryThumbnail",
config: {
widgetsForSelectBar: [
{
id: "FCTSRCH_GALLERY_VIEW_MORE_INFO_OTHER",
name: "alfresco/renderers/MoreInfo",
align: "right",
config: {
filterActions: true,
allowedActionsString: "[\"document-delete\"]",
xhrRequired: true
}
}
],
publishTopic: "ALF_NAVIGATE_TO_PAGE",
renderFilter: [
{
property: "type",
values: ["document","folder"],
negate: true
}
]
}
}
]
}
},
{
id: "FCTSRCH_INFINITE_SCROLL",
name: "alfresco/documentlibrary/AlfDocumentListInfiniteScroll"
}
]
}
};
I've written a blog post that covers customizing the search page. Although it isn't exactly the same use case, the principle remains the same - you're going to want to create your own SearchService (extending the default one) and then swap yours for the default one in the faceted-search page model. You'll want to extend the onSearchRequest function to include the extra request parameter.

kendo grid with java.util.Date doesn't work

I have a kendo grid with data being populated using ajax request.
the model returned from the controller has a java.util.Date field called someDate and the returned data in json for that field is like
{"total":3,
"data":[
{"someDate":1433116800000,"someValue":111.00},
{"someDate":1444116800000,"someValue":222.00},
{"someDate":1455116800000,"someValue":333.00}]}
The dataSouce is as below:
"dataSource": {
"schema": {
"total":"total",
"data":"data"
},
"transport":{
"parameterMap":function parameterMap(options, operation) {
if(operation==="read"){
return JSON.stringify(options);
} else {
return JSON.stringify(options.models);
}
},
"read":{
"dataType":"json",
"contentType":"application/json",
"type":"POST",
url : "${ajaxGetData}&param="+someParam
}
}
columns in the grid is like this
"columns":
[{
"field":"someValue",
"title":"Some Value",
"type":"numeric"
},{
"field":"someDate",
"title":"Date",
"type":"date",
format:"{0:yyyy-MM-dd hh:mm:ss tt}"
}
The issue is that the date and time is not displayed properly. If I use a template, I have to remove the "type":"date" for it to work however the filters don't work properly.
template:'#= kendo.toString( new Date(someDate), "yyyy/MM/dd hh:mm:ss tt") #'
How to show Date in a specific format "yyyy/MM/dd hh:mm:ss tt".
This JS Fiddle might help (but doesn't have the exact json structure with data and total)
Would it be possible to use ISO 8601 format for you dates, if that's possible the type date in the model definition should work (if you're using GSON library take a look here)
edit
According to the comments you can make use of the schema.parse, a sample of this using your provided fiddle will look like this:
var grid = $("#grid").kendoGrid({
dataSource: {
data: createRandomData(10),
schema: {
model: {
fields: {
FirstName: { type: "string" },
LastName: { type: "string" },
City: { type: "string" },
Title: { type: "string" },
BirthDate: { type: "date" },
Age: { type: "number" }
}
},
parse: function(response) {
var products = [];
for (var i = 0; i < response.length; i++) {
response[i].BirthDate = new Date(response[i].BirthDate);
}
return response;
}
},
pageSize: 10
},
height: 500,
scrollable: true,
sortable: true,
selectable: true,
change:onChangeSelection,
filterable: true,
pageable: true,
columns: [
{
field: "FirstName",
title: "First Name"
},
{
field: "LastName",
title: "Last Name"
},
{
field: "City"
},
{
field: "Title"
},
{
field: "BirthDate",
title: "Birth Date",
//template: '#= kendo.toString(BirthDate,"MM/dd/yyyy") #'
},
{
field: "Age"
}
]
}).data("kendoGrid");
I hope it works.

for hierarchy grid, bind to local data, after edit in detail, will auto unexpand the detail

After I edit in the detal grid, the detail grid will unexpand.
I want it keep expand.
Thank you.
The following is my grid code:
$("#grid").kendoGrid({
editable:true,
columns: [
{ field: "name" },
{ field: "address" }
],
dataSource: [
{
name: "Beverages",
address: "street 1",
products: [
{ name: "Tea", price: 20 },
{ name: "Coffee", price: 23 }
]
},
{
name: "Food",
address: "street 2",
products: [
{ name: "Ham", price: 32 },
{ name: "Bread", price:34 }
]
}
],
detailInit: function (e) {
$("<div/>").appendTo(e.detailCell).kendoGrid({
dataSource: e.data.products,
editable:true,
});
}
});
The grid will collapse (unexpand) because it re-binds itself whenever a data item is updated. You will have to prevent the databinding.
detailInit: function (e) {
var grid = this;
$("<div/>").appendTo(e.detailCell).kendoGrid({
dataSource: e.data.products,
editable:true,
save: function() {
// Prevent the next data-binding
grid.one("dataBinding", function(e) {
e.preventDefault();
});
}
});
}
Here is a complete sample: http://dojo.telerik.com/uWuyI

Resources