Page
Page
https://app.elektraweb.com/app/page/ Standart grid ve recordun yanısıra page yapısını kullanarak da ekranlar yapılabilir. Bunu yapmak için URL'de record veya grid yazılan yere page yazmak gerekmektedir. Devamında istenilen ekranın adı yazılarak sıfırdan ekran yaratılabilir.
Page ekranlar da record ve grid gibi requeste sahiptir.Bunun yanısıra page component bize html, css, javascript yazabileceğimiz editörü direkt olarak getirmektedir.
{
"datasetCallbackFn": "let totalTaskCount = 0;\nlet totalCallCount = 0;\nlet allergensTotal = 0;\nlet preferencesTotal = 0;\nlet extraReqTotal = 0;\nlet cinMsgTotal = 0;\nlet commentTotal = 0;\nlet gRemarkTotal = 0;\ndataset.DS1.forEach((row) => {\n if (this.filterPanelFormGroup.getRawValue().RESSTATEID === row.RESSTATEID) {\n totalTaskCount += row.TASKCOUNT;\n }\n});\nfor (const data of dataset.DS1) {\n data.totalTaskCount = totalTaskCount;\n}\n\ndataset.DS1.forEach((row) => {\n if (this.filterPanelFormGroup.getRawValue().RESSTATEID === row.RESSTATEID) {\n totalCallCount += row.CALLCOUNT;\n }\n});\n\ndataset.DS1.forEach((row) => {\n if(row.ALLERGENS){\n allergensTotal += row.ALLERGENS.split(',').length;\n }\n});\nfor (const data of dataset.DS1) {\n data.allergensTotal = allergensTotal;\n}\n\ndataset.DS1.forEach((row) => {\n if(row.PREFERENCES){\n preferencesTotal += row.PREFERENCES.split(',').length;\n }\n});\nfor (const data of dataset.DS1) {\n data.preferencesTotal = preferencesTotal;\n}\n\ndataset.DS1.forEach((row) => {\n if(row.GUESTREMARKS){\n gRemarkTotal += row.GUESTREMARKS.split(',').length;\n }\n});\nfor (const data of dataset.DS1) {\n data.gRemarkTotal = gRemarkTotal;\n}\n\ndataset.DS1.forEach((row) => {\n if (this.filterPanelFormGroup.getRawValue().RESSTATEID === row.RESSTATEID) {\n commentTotal += row.COMMENTCOUNT;\n }\n});\n\ndataset.DS1.forEach((row) => {\n if(row.EXTRA_REQ){\n extraReqTotal += row.EXTRA_REQ.split(',').length;\n }\n});\nfor (const data of dataset.DS1) {\n data.extraReqTotal = extraReqTotal;\n}\n\ndataset.DS1.forEach((row) => {\n if(row.CIN_MESSAGE){\n cinMsgTotal += row.CIN_MESSAGE.split(',').length;\n }\n});\nfor (const data of dataset.DS1) {\n data.cinMsgTotal = cinMsgTotal;\n}\n\n\ndataset.DS2 = [{\n totalTaskCount\n}];\ndataset.DS3 = [{\n totalCallCount\n}];\ndataset.DS4 = [{\n allergensTotal\n}];\ndataset.DS5 = [{\n preferencesTotal\n}];\ndataset.DS6 = [{\n extraReqTotal\n}];\ndataset.DS7 = [{\n cinMsgTotal\n}];\ndataset.DS8 = [{\n commentTotal\n}];\ndataset.DS9 = [{\n gRemarkTotal\n}];",
"filterPanel": {
"type": {
"name": "expanded",
"state": true
},
"areaName": "P1",
"header": "Filters",
"groupsLayout": [
[
"G0"
]
],
"groups": [
{
"areaName": "G0",
"fields": [
{
"controlType": "radio",
"field": "LISTTYPEID",
"value": 1,
"disabled": false,
"required": false,
"options": [
{
"key": 1,
"displayField": "InHouse"
},
{
"key": 2,
"displayField": "Expected Arrivals"
},
{
"key": 3,
"displayField": "Expected Departures"
},
{
"key": 4,
"displayField": "All"
}
]
},
{
"controlType": "date",
"label": "Expected Arrival Date",
"field": "PROGDATE",
"value": "${moment(ANG.PROGDATE)}",
"disabled": false,
"required": false
},
{
"controlType": "radio",
"field": "ISVIP",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No VIP"
},
{
"key": 1,
"displayField": "VIP"
}
]
},
{
"controlType": "radio",
"field": "ISALLERGIC",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "Non Allergic"
},
{
"key": 1,
"displayField": "Allergic"
}
]
},
{
"controlType": "radio",
"field": "ISBIRTHDAY",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No Birthday"
},
{
"key": 1,
"displayField": "Birthday"
}
]
},
{
"controlType": "radio",
"field": "ISEXTRAREQ",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No Extra Request"
},
{
"key": 1,
"displayField": "Extra Request"
}
]
},
{
"controlType": "radio",
"field": "ISCINNOTES",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No Cin Notes"
},
{
"key": 1,
"displayField": "Cin Notes"
}
]
},
{
"controlType": "radio",
"field": "ISBLACK",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No Black List"
},
{
"key": 1,
"displayField": "Black List"
}
]
},
{
"controlType": "radio",
"field": "ISWEDDINGDAY",
"value": 0,
"disabled": false,
"required": false,
"options": [
{
"key": 0,
"displayField": "No Wedding Day"
},
{
"key": 1,
"displayField": "Wedding Day"
}
]
}
],
"border": true
}
]
},
"requestList": {
"DS1": {
"requestType": "function",
"request": {
"Object": "FN_EASYPMS_RESNAMESCRM",
"Select": [
"HOTELID",
"PROGDATE",
"ISALLERGIC",
"ISBIRTHDAY",
"ISEXTRAREQ",
"ISCINNOTES",
"ISWEDDINGDAY",
"ISVIP",
"ISBLACK"
],
"Where": [],
"OrderBy": [
{
"Column": "ROOMNO",
"Direction": "ASC"
}
],
"Joins": []
}
}
},
"rowActions": [
{
"id": "preferences",
"name": "Preferences",
"requestType": "optionsRecord",
"optionsRecord": {
"Heading": "Preferences",
"MasterId": "$GUESTID",
"OptionRequest": {
"Object": "HOTEL_PREFERENCE",
"Select": [
"ID",
"PREFERENCE",
"HOTELID",
"DEPID",
"DEPID_DEPARTMENT",
"PORTALID"
],
"Joins": [
{
"Object": "USERDEPARTMENT",
"Key": "ID",
"Fields": [
"DEPARTMENT"
],
"Field": "DEPID"
}
]
},
"SelectedRequest": {
"Object": "HOTEL_GUEST_PREFERENCE",
"Select": [
"ID",
"PREFERENCEID",
"GUESTID",
"HOTELID",
"PORTALID"
]
},
"OptionIdColumn": "ID",
"OptionNameColumn": "PREFERENCE",
"GroupColumn": "DEPID_DEPARTMENT",
"SelectedMasterIdColumn": "GUESTID",
"SelectedIdColumn": "ID",
"SelectedOptionIdColumn": "PREFERENCEID",
"InsertOptionRecordId": "hotel_preference"
}
},
{
"id": "interests",
"name": "Interests",
"requestType": "optionsRecord",
"optionsRecord": {
"Heading": "Interests / Hobies",
"MasterId": "$GUESTID",
"OptionRequest": {
"Object": "HOTEL_INTERESTS",
"Select": [
"ID",
"INTERESTS",
"INTERESTGROUP"
]
},
"SelectedRequest": {
"Object": "QG_HOTEL_GUEST_INTERESTS",
"BaseObject": "HOTEL_GUEST_INTERESTS",
"Select": [
"ID",
"INTERESTID",
"GUESTID"
]
},
"OptionIdColumn": "ID",
"OptionNameColumn": "INTERESTS",
"GroupColumn": "INTERESTGROUP",
"SelectedMasterIdColumn": "GUESTID",
"SelectedIdColumn": "ID",
"SelectedOptionIdColumn": "INTERESTID",
"InsertOptionRecordId": "interests"
}
},
{
"id": "allergens",
"name": "Allergens",
"requestType": "optionsRecord",
"optionsRecord": {
"Heading": "Allergens",
"MasterId": "$GUESTID",
"OptionRequest": {
"Object": "HOTEL_ALLERGY",
"Select": [
"ALLERGENID",
"ALLERGY"
]
},
"SelectedRequest": {
"Object": "HOTEL_GUEST_ALLERGENS",
"Select": [
"ID",
"ALLERGENID",
"GUESTID"
]
},
"OptionIdColumn": "ALLERGENID",
"OptionNameColumn": "ALLERGY",
"SelectedMasterIdColumn": "GUESTID",
"SelectedIdColumn": "ID",
"SelectedOptionIdColumn": "ALLERGENID"
}
},
{
"id": "openComment",
"name": "SEÇ",
"startupMsg": "",
"successMsg": "",
"failMsg": "",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"height": "500px",
"width": "500px",
"config": {
"minWidth": "50vw",
"minHeight": "50vh"
},
"filters": {
"RESID": "$RESID"
},
"type": "grid",
"id": "comment-mobile-list"
},
"requestType": "openform"
},
{
"rowNotRequired": true,
"id": "newTask",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"data": {
"RESIDS": "${RESID}",
"GUESTID": "${GUESTID}"
},
"type": "record",
"id": "task-management-task"
},
"requestType": "openform"
},
{
"id": "taskList",
"name": "taskList",
"icon": "today",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"type": "grid",
"id": "hoteltasks-guest",
"extraFilters": {
"RESID": "$RESID",
"GUESTID": "$GUESTID"
},
"filters": {
"RESID": "$RESID",
"GUESTID": "$GUESTID"
}
},
"requestType": "openform",
"show": true
},
{
"id": "notes",
"name": "SEÇ",
"startupMsg": "",
"successMsg": "",
"failMsg": "",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"filters": {},
"data": {
"GUESTID": "$GUESTID"
},
"type": "record",
"id": "guest-note"
},
"requestType": "openform"
},
{
"id": "resCard",
"name": "SEÇ",
"startupMsg": "",
"successMsg": "",
"failMsg": "",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"filters": {},
"index": "$RESID",
"type": "record",
"id": "res-all-card"
},
"requestType": "openform"
},
{
"id": "newComment",
"name": "SEÇ",
"startupMsg": "",
"successMsg": "",
"failMsg": "",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"filters": {},
"data": {
"RESIDS": "${RESID}",
"GUESTID": "${GUESTID}"
},
"type": "record",
"id": "res-all-comment"
},
"requestType": "openform"
},
{
"id": "guestCard",
"name": "SEÇ",
"startupMsg": "",
"successMsg": "",
"failMsg": "",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"filters": {},
"index": "$GUESTID",
"type": "record",
"id": "guest-cards"
},
"requestType": "openform"
},
{
"id": "refresh",
"name": "Yenile",
"icon": "cached",
"requestType": "script",
"script": "this.parent.loadData({cache:false,dataSets:['DS1']});"
},
{
"name": "Frequently Asked Questions",
"icon": "today",
"afterEvent": [
{
"name": "rowAction",
"id": "refresh"
}
],
"openFormParams": {
"type": "grid",
"id": "crm-resnames"
},
"requestType": "openform",
"show": true
},
{
"id": "gridOpen",
"showOnGridActions": true,
"rowNotRequired": true,
"requirements": [],
"name": "Mobile",
"icon": "aod",
"requestType": "script",
"startupMsg": "",
"successMsg": "",
"afterEvent": "gridRefresh",
"failMsg": "",
"script": "angus.api.router.navigate(['/app','grid','crm-resnames']);",
"show": true
},
{
"visible": false,
"id": "prevResCard",
"name": "Prev Res Card",
"startupMsg": "",
"icon": "alarm",
"successMsg": "",
"requirements": [],
"failMsg": "",
"openFormParams": {
"index": "${PREVRESID}",
"type": "record",
"id": "res-all-card"
},
"requestType": "openform",
"show": true
},
{
"visible": false,
"id": "nextResCard",
"name": "Next Res Card",
"startupMsg": "",
"icon": "alarm",
"successMsg": "",
"requirements": [],
"failMsg": "",
"openFormParams": {
"index": "${EXTENDINGRESID}",
"type": "record",
"id": "res-all-card"
},
"requestType": "openform",
"show": true
}
],
"autoLoad": true,
"template": "<div class=\"headerIcon\">\r\n <div class=\"baslik\">{{translate 'CRM Follow-Up'}}</div>\r\n</div>\r\n<div class=\"sabit\">\r\n <button class=\"material-icons addBtn\" onclick=\"this.rowAction('gridOpen',{{arg this}})\">computer</button>\r\n <button class=\"material-icons addBtn\" onclick=\"this.rowAction('refresh',{{arg this}})\">sync</button>\r\n\r\n</div>\r\n\r\n\r\n<div class=\"widgetContainer\">\r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M10.54,14.53L8.41,12.4L7.35,13.46L10.53,16.64L16.53,10.64L15.47,9.58L10.54,14.53M12,20A7,7 0 0,1 5,13A7,7 0 0,1 12,6A7,7 0 0,1 19,13A7,7 0 0,1 12,20M12,4A9,9 0 0,0 3,13A9,9 0 0,0 12,22A9,9 0 0,0 21,13A9,9 0 0,0 12,4M7.88,3.39L6.6,1.86L2,5.71L3.29,7.24L7.88,3.39M22,5.72L17.4,1.86L16.11,3.39L20.71,7.25L22,5.72Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Tasks'}}</div>\r\n {{#each DS2}}\r\n <div class=\"widgetValue\">{{{numeral totalTaskCount \"0,0.00\"}}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#5C6BC0;\">\r\n <svg style=\"width:30px;height:30px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M2.5,19H21.5V21H2.5V19M9.68,13.27L14.03,14.43L19.34,15.85C20.14,16.06 20.96,15.59 21.18,14.79C21.39,14 20.92,13.17 20.12,12.95L14.81,11.53L12.05,2.5L10.12,2V10.28L5.15,8.95L4.22,6.63L2.77,6.24V11.41L4.37,11.84L9.68,13.27Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Calls'}}</div>\r\n {{#each DS3}}\r\n <div class=\"widgetValue\">{{totalCallCount}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#81C784;\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M9,22A1,1 0 0,1 8,21V18H4A2,2 0 0,1 2,16V4C2,2.89 2.9,2 4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H13.9L10.2,21.71C10,21.9 9.75,22 9.5,22V22H9M10,16V19.08L13.08,16H20V4H4V16H10Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Preferences'}}</div>\r\n {{#each DS5}}\r\n <div class=\"widgetValue\">{{preferencesTotal}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#FFB74D;\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M20,16V10H22V16A2,2 0 0,1 20,18H8C6.89,18 6,17.1 6,16V4C6,2.89 6.89,2 8,2H16V4H8V16H20M10.91,7.08L14,10.17L20.59,3.58L22,5L14,13L9.5,8.5L10.91,7.08M16,20V22H4A2,2 0 0,1 2,20V7H4V20H16Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Allergens'}}</div>\r\n {{#each DS4}}\r\n <div class=\"widgetValue\">{{allergensTotal}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#9575CD;\">\r\n <svg style=\"width:24px;height:24px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M20,16V10H22V16A2,2 0 0,1 20,18H8C6.89,18 6,17.1 6,16V4C6,2.89 6.89,2 8,2H16V4H8V16H20M10.91,7.08L14,10.17L20.59,3.58L22,5L14,13L9.5,8.5L10.91,7.08M16,20V22H4A2,2 0 0,1 2,20V7H4V20H16Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Extra Request'}}</div>\r\n {{#each DS6}}\r\n <div class=\"widgetValue\">{{extraReqTotal}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#90CAF9;\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M20,16V10H22V16A2,2 0 0,1 20,18H8C6.89,18 6,17.1 6,16V4C6,2.89 6.89,2 8,2H16V4H8V16H20M10.91,7.08L14,10.17L20.59,3.58L22,5L14,13L9.5,8.5L10.91,7.08M16,20V22H4A2,2 0 0,1 2,20V7H4V20H16Z\" />\r\n </svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Cin Message'}}</div>\r\n {{#each DS7}}\r\n <div class=\"widgetValue\">{{cinMsgTotal}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#F06292;\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M9,22A1,1 0 0,1 8,21V18H4A2,2 0 0,1 2,16V4C2,2.89 2.9,2 4,2H20A2,2 0 0,1 22,4V16A2,2 0 0,1 20,18H13.9L10.2,21.71C10,21.9 9.75,22 9.5,22V22H9M17,11V9H15V11H17M13,11V9H11V11H13M9,11V9H7V11H9Z\" />\r\n</svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Comment'}}</div>\r\n {{#each DS8}}\r\n <div class=\"widgetValue\">{{commentTotal}}</div>\r\n {{/each}}\r\n </div>\r\n \r\n <div class=\"widgetCard\">\r\n <div class=\"iconBack\" style=\"background-color:#BA68C8;\">\r\n <svg style=\"width:24px;height:24px\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M11 9C11 10.66 9.66 12 8 12C6.34 12 5 10.66 5 9C5 7.34 6.34 6 8 6C9.66 6 11 7.34 11 9M14 20H2V18C2 15.79 4.69 14 8 14C11.31 14 14 15.79 14 18M7 9C7 9.55 7.45 10 8 10C8.55 10 9 9.55 9 9C9 8.45 8.55 8 8 8C7.45 8 7 8.45 7 9M4 18H12C12 16.9 10.21 16 8 16C5.79 16 4 16.9 4 18M22 12V14H13V12M22 8V10H13V8M22 4V6H13V4Z\" />\r\n</svg>\r\n </div>\r\n \r\n <div class=\"widgetHeader\">{{translate 'Notes'}}</div>\r\n {{#each DS9}}\r\n <div class=\"widgetValue\">{{gRemarkTotal}}</div>\r\n {{/each}}\r\n </div>\r\n</div>\r\n\r\n<div class=\"kart\">\r\n{{#each DS1}}\r\n <div class=\"container\">\r\n <div class=\"top\">\r\n <div class=\"fullName\">\r\n <div class=\"resCard\" onclick=\"this.rowAction('resCard',{{arg this}})\">\r\n <svg style=\"width:16px;height:16px; color:#40598e; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M2.5,19H21.5V21H2.5V19M9.68,13.27L14.03,14.43L19.34,15.85C20.14,16.06 20.96,15.59 21.18,14.79C21.39,14 20.92,13.17 20.12,12.95L14.81,11.53L12.05,2.5L10.12,2V10.28L5.15,8.95L4.22,6.63L2.77,6.24V11.41L4.37,11.84L9.68,13.27Z\" />\r\n</svg>\r\n{{ROOMNO}}</div>\r\n <div class=\"nameSurname\">{{NAME}} {{LNAME}}</div>\r\n {{#if ISPREV}} \r\n <svg style=\"width:24px;height:24px\" onclick=\"this.rowAction('prevResCard',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M4,10V14H13L9.5,17.5L11.92,19.92L19.84,12L11.92,4.08L9.5,6.5L13,10H4Z\" />\r\n</svg>\r\n{{else}} {{/if}}\r\n{{#if ISNEXT}} \r\n <svg style=\"width:24px;height:24px\" onclick=\"this.rowAction('nextResCard',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M20,10V14H11L14.5,17.5L12.08,19.92L4.16,12L12.08,4.08L14.5,6.5L11,10H20Z\" />\r\n</svg>\r\n{{else}} {{/if}}\r\n {{#if BIRTHDAY}} \r\n <div class=\"isBirthday\">\r\n <svg style=\"width:16px;height:16px; color:#B71C1C; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M12,6C13.11,6 14,5.1 14,4C14,3.62 13.9,3.27 13.71,2.97L12,0L10.29,2.97C10.1,3.27 10,3.62 10,4A2,2 0 0,0 12,6M16.6,16L15.53,14.92L14.45,16C13.15,17.29 10.87,17.3 9.56,16L8.5,14.92L7.4,16C6.75,16.64 5.88,17 4.96,17C4.23,17 3.56,16.77 3,16.39V21A1,1 0 0,0 4,22H20A1,1 0 0,0 21,21V16.39C20.44,16.77 19.77,17 19.04,17C18.12,17 17.25,16.64 16.6,16M18,9H13V7H11V9H6A3,3 0 0,0 3,12V13.54C3,14.62 3.88,15.5 4.96,15.5C5.5,15.5 6,15.3 6.34,14.93L8.5,12.8L10.61,14.93C11.35,15.67 12.64,15.67 13.38,14.93L15.5,12.8L17.65,14.93C18,15.3 18.5,15.5 19.03,15.5C20.11,15.5 21,14.62 21,13.54V12A3,3 0 0,0 18,9Z\" />\r\n </svg>\r\n </div>\r\n {{else}} {{/if}}\r\n {{#if WEDDINGDAY}} \r\n <div class=\"isWedding\">\r\n <svg style=\"width:16px;height:16px; color:#B71C1C; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M12,10L8,4.4L9.6,2H14.4L16,4.4L12,10M15.5,6.8L14.3,8.5C16.5,9.4 18,11.5 18,14A6,6 0 0,1 12,20A6,6 0 0,1 6,14C6,11.5 7.5,9.4 9.7,8.5L8.5,6.8C5.8,8.1 4,10.8 4,14A8,8 0 0,0 12,22A8,8 0 0,0 20,14C20,10.8 18.2,8.1 15.5,6.8Z\" />\r\n </svg>\r\n </div>\r\n {{else}} {{/if}}\r\n {{#if ISVIP}} \r\n <div class=\"isVIP\">\r\n <svg style=\"width:16px;height:16px; color:#B71C1C; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M5 16L3 5L8.5 10L12 4L15.5 10L21 5L19 16H5M19 19C19 19.6 18.6 20 18 20H6C5.4 20 5 19.6 5 19V18H19V19Z\" />\r\n </svg>\r\n </div>\r\n {{else}} {{/if}}\r\n {{#if ISREPEAT}} \r\n <div class=\"isRepeat\">\r\n <svg style=\"width:16px;height:16px; color:#B71C1C; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M12 0L11.34 .03L15.15 3.84L16.5 2.5C19.75 4.07 22.09 7.24 22.45 11H23.95C23.44 4.84 18.29 0 12 0M12 4C10.07 4 8.5 5.57 8.5 7.5C8.5 9.43 10.07 11 12 11C13.93 11 15.5 9.43 15.5 7.5C15.5 5.57 13.93 4 12 4M.05 13C.56 19.16 5.71 24 12 24L12.66 23.97L8.85 20.16L7.5 21.5C4.25 19.94 1.91 16.76 1.55 13H.05M12 13C8.13 13 5 14.57 5 16.5V18H19V16.5C19 14.57 15.87 13 12 13Z\" />\r\n </svg>\r\n </div>\r\n {{else}} {{/if}}\r\n {{#if ISGUEST}} \r\n <div class=\"guestCard\" onclick=\"this.rowAction('guestCard',{{arg this}})\">\r\n <svg style=\"width:16px;height:16px; color:#40598e; padding-right:2px;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M2,3H22C23.05,3 24,3.95 24,5V19C24,20.05 23.05,21 22,21H2C0.95,21 0,20.05 0,19V5C0,3.95 0.95,3 2,3M14,6V7H22V6H14M14,8V9H21.5L22,9V8H14M14,10V11H21V10H14M8,13.91C6,13.91 2,15 2,17V18H14V17C14,15 10,13.91 8,13.91M8,6A3,3 0 0,0 5,9A3,3 0 0,0 8,12A3,3 0 0,0 11,9A3,3 0 0,0 8,6Z\" />\r\n</svg>\r\n </div>\r\n {{else}} {{/if}}\r\n </div>\r\n </div>\r\n <div class=\"orta\">\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Gender'}} / {{translate 'Birthdate'}}</div>\r\n <div class=\"value\">{{{translate GENDERTEXT}}} / {{moment BIRTHDATE 'L'}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Repeat'}}/{{translate 'VIP'}}</div>\r\n <div class=\"value\">{{REPEATCOUNT}} / {{VIPTYPE}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Res Id'}}/{{translate 'Room Type'}}</div>\r\n <div class=\"value\">{{RESID}} / {{ROOMTYPE}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Cin'}}/{{translate 'Cout'}}</div>\r\n <div class=\"value\">{{moment CHECKIN 'L'}}-{{moment CHECKOUT 'L'}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Trip Reason'}}</div>\r\n <div class=\"value\">{{TRIPREASON}}</div>\r\n </div>\r\n \r\n \r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Extra Request'}}</div>\r\n <div class=\"value\">{{EXTRA_REQ}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Cin Message'}}</div>\r\n <div class=\"value\">{{CIN_MESSAGE}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Cout Message'}}</div>\r\n <div class=\"value\">{{COUT_MESSAGE}}</div>\r\n </div>\r\n \r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Tasks'}} {{#if ISGUEST}} <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('newTask',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\"><div style=\"width: 90%;\">{{OPENTASKS}}</div> \r\n <svg onclick=\"this.rowAction('crm-task',{{arg this}})\" style=\"width:15px;height:15px; color:#40598e;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M7,5H21V7H7V5M7,13V11H21V13H7M4,4.5A1.5,1.5 0 0,1 5.5,6A1.5,1.5 0 0,1 4,7.5A1.5,1.5 0 0,1 2.5,6A1.5,1.5 0 0,1 4,4.5M4,10.5A1.5,1.5 0 0,1 5.5,12A1.5,1.5 0 0,1 4,13.5A1.5,1.5 0 0,1 2.5,12A1.5,1.5 0 0,1 4,10.5M7,19V17H21V19H7M4,16.5A1.5,1.5 0 0,1 5.5,18A1.5,1.5 0 0,1 4,19.5A1.5,1.5 0 0,1 2.5,18A1.5,1.5 0 0,1 4,16.5Z\" />\r\n</svg>\r\n </div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Comment'}} {{#if ISGUEST}} \r\n <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('newComment',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\"><div style=\"width: 90%;\">{{LASTCOMMENTS}}</div> <svg onclick=\"this.rowAction('crm-comments',{{arg this}})\" style=\"width:15px;height:15px; color:#40598e;\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M7,5H21V7H7V5M7,13V11H21V13H7M4,4.5A1.5,1.5 0 0,1 5.5,6A1.5,1.5 0 0,1 4,7.5A1.5,1.5 0 0,1 2.5,6A1.5,1.5 0 0,1 4,4.5M4,10.5A1.5,1.5 0 0,1 5.5,12A1.5,1.5 0 0,1 4,13.5A1.5,1.5 0 0,1 2.5,12A1.5,1.5 0 0,1 4,10.5M7,19V17H21V19H7M4,16.5A1.5,1.5 0 0,1 5.5,18A1.5,1.5 0 0,1 4,19.5A1.5,1.5 0 0,1 2.5,18A1.5,1.5 0 0,1 4,16.5Z\" />\r\n</svg></div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Preferences'}} {{#if ISGUEST}} \r\n <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('preferences',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\">{{PREFERENCES}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Allergens'}} {{#if ISGUEST}} \r\n <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('allergens',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\">\r\n {{ALLERGENS}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Interests'}} {{#if ISGUEST}} <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('interests',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\">\r\n {{INTERESTS}}</div>\r\n </div>\r\n <div class=\"headerValue\">\r\n <div class=\"header\">{{translate 'Notes'}} {{#if ISGUEST}} \r\n <svg style=\"width:25px;height:25px; color:#f44336;\" onclick=\"this.rowAction('notes',{{arg this}})\" viewBox=\"0 0 24 24\">\r\n <path fill=\"currentColor\" d=\"M17,13H13V17H11V13H7V11H11V7H13V11H17M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z\" />\r\n</svg>{{else}} {{/if}}</div>\r\n <div class=\"value\">\r\n {{GUESTREMARKS}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n{{/each}}\r\n</div>\r\n",
"css": ".anasayfa{\r\n background:#B71C1C;\r\n border-radius:50px;\r\n width:40px;\r\n height:40px;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n color:white;\r\n box-shadow:1px 1px 8px 2px #BDBDBD;\r\n margin-top:10px;\r\n margin-left:15px;\r\n}\r\n.sabit{\r\n position: fixed;\r\n margin: 0px 0px 0px 5px;\r\n height: 55px;\r\n border-radius: 7px;\r\n left: 17%;\r\n bottom: 12px;\r\n background-color: #40598e;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n.addBtn{\r\n margin-right: 3px;\r\n margin-left: 3px;\r\n background-color: #424242;\r\n color: #FAFAFA;\r\n border: 1px solid #FAFAFA;\r\n border-radius: 75px;\r\n font-size: 25px;\r\n width: 30px;\r\n height: 30px;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n}\r\n.headerIcon{\r\n display:grid;\r\n align-items :center;\r\n font-size: 2em;\r\n margin: .67em 0;\r\n color: #fff;\r\n background: #40598e;\r\n height: 50px;\r\n line-height: 50px;\r\n text-indent: 20px;\r\n font-size: 26px;\r\n box-shadow: 0 2px 5px 0 #000;\r\n font-weight:bold;\r\n margin:0px 15px 0px 15px;\r\n}\r\n.widgetContainer{\r\n display:grid;\r\n grid-template-columns:repeat(auto-fit, minmax(115px, 150px));\r\n grid-column-gap: 50px;\r\n grid-row-gap: 15px;\r\n justify-content: center;\r\n margin-bottom: 10px;\r\n}\r\n.widgetCard{\r\n margin-top: 35px;\r\n height:55px;\r\n border-radius:5px;\r\n box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);\r\n padding: 8px;\r\n}\r\n.widgetHeader{\r\n text-align: right;\r\n padding: 4px;\r\n font-size: 16px;\r\n font-weight: 500;\r\n color: rgba(0,0,0,.75);\r\n transform: translate(4px, -45px);\r\n}\r\n.widgetValue{\r\n text-align: right;\r\n padding: 4px;\r\n font-size: 24px;\r\n font-weight: 300;\r\n color: rgba(0,0,0,.87);\r\n transform: translate(4px, -40px);\r\n padding: 4px 4px 0;\r\n border-bottom: 1px solid rgba(0,0,0,.15);\r\n white-space: nowrap;\r\n overflow: hidden;\r\n}\r\n\r\n.iconBack{\r\n background-color:#FFF176;\r\n font-size: 30px;\r\n width: 40px;\r\n height: 40px;\r\n transform: translate(4px, -30px);\r\n line-height: 50px;\r\n box-shadow: 0 3px 5px -1px rgb(0 0 0 / 20%), 0 6px 10px 0 rgb(0 0 0 / 14%), 0 1px 18px 0 rgb(0 0 0 / 12%);\r\n color:white;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n border-radius: 5px;\r\n\r\n}\r\n.kart{\r\n display:grid;\r\n grid-template-columns:repeat(auto-fit, minmax(330px, 1fr));\r\n grid-column-gap:15px;\r\n grid-row-gap:15px;\r\n}\r\n.container{\r\n background-color:#FAFAFA;\r\n display:grid;\r\n grid-template-areas:\"top\"\r\n \"orta\"\r\n \"alt\";\r\n grid-template-columns:1fr;\r\n box-shadow:1px 6px 8px 1px #BDBDBD;\r\n margin:15px;\r\n border-radius:8px;\r\n padding:8px;\r\n}\r\n\r\n.top{\r\n grid-area:top;\r\n}\r\n.orta{\r\n grid-area:orta;\r\n}\r\n.alt{\r\n grid-area:alt;\r\n display:grid;\r\n grid-template-columns: 1fr;\r\n align-items:center;\r\n}\r\n.fullName{\r\n display: grid;\r\n grid-template-columns:1fr 10fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;\r\n grid-template-areas:\"resCard nameSurname isNext isPrev isBirthday isWedding isVIP isRepeat guestCard\";\r\n gap: 5px;\r\n border-radius:8px;\r\n padding:5px;\r\n align-items:center;\r\n background-color:#E0E0E0;\r\n font-size:13px;\r\n font-weight:bold;\r\n text-indent:5px;\r\n height:30px;\r\n}\r\n.nameSurname{\r\n grid-area:nameSurname;\r\n}\r\n.isBirthday{\r\n grid-area:isBirthday;\r\n}\r\n.isWedding{\r\n grid-area:isWedding;\r\n}\r\n.isNext{\r\n grid-area:isNext;\r\n}\r\n.isPrev{\r\n grid-area:isPrev;\r\n}\r\n.isVIP{\r\n grid-area:isVIP;\r\n}\r\n.isRepeat{\r\n grid-area:isRepeat;\r\n}\r\n.status{\r\n grid-area:status;\r\n display:flex;\r\n justify-content:center;\r\n align-items:center;\r\n color:#212121;\r\n}\r\n.header{\r\n font-weight:bold;\r\n font-size:13px;\r\n padding-left: 3px;\r\n color:#40598e;\r\n height:30px;\r\n line-height:30px;\r\n grid-area:header;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n}\r\n.value{\r\n font-size:12px;\r\n border-left: 1px solid #E0E0E0;\r\n padding-left: 3px;\r\n height:auto;\r\n grid-area:value; \r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n}\r\n.headerValue{\r\n display:grid;\r\n grid-template-areas:\"header value\";\r\n grid-template-columns:2fr 3fr;\r\n border-bottom: 1px solid #E0E0E0;\r\n}\r\n.header2{\r\n font-weight:bold;\r\n font-size:14px;\r\n padding-left: 3px;\r\n border-right: 1px solid #E0E0E0;\r\n color:#757575;\r\n height:20px;\r\n line-height:20px;\r\n}\r\n.value2{\r\n font-size:12px;\r\n padding-left: 3px;\r\n height:20px;\r\n line-height:20px;\r\n}\r\n.header3{\r\n font-weight:bold;\r\n font-size:13px;\r\n border-bottom: 1px solid #E0E0E0;\r\n padding-left: 3px;\r\n color:#757575;\r\n min-height:16px;\r\n overflow: auto; \r\n width: 100%;\r\n word-wrap: break-word;\r\n}\r\n.resCard{\r\n display:flex;\r\n align-items:center;\r\n grid-area:resCard;\r\n}\r\n.guestCard{\r\n display:flex;\r\n align-items:center;\r\n justify-content: flex-end;\r\n grid-area:guestCard;\r\n}\r\n.flexArea{\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-start;\r\n align-items: center;\r\n padding-bottom: 3px;\r\n}\r\n\r\n.value > .material-icons-outlined{display: none;}\r\n.value > .status{display: none;}\r\n\r\n\r\n.value.state0 > .male{display: block;}\r\n.value.state1 > .female{display: block;}\r\n\r\n.br0 {\r\n border-right: 0;\r\n }\r\n.bl0{\r\n border-left: 0;\r\n }\r\n.buttonV{\r\n width: 15%;\r\n height: 98%;\r\n border: 1px solid #BDBDBD;\r\n background: #FAFAFA;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #616161;\r\n border-radius: 5px;\r\n margin-right:5px;\r\n }\r\n.bottomCell2{\r\n background: #fff;\r\n border: solid 2px #b0b0b0;\r\n height: 75px;\r\n float: left;\r\n }\r\n.font{\r\n font-size:10px;\r\n }\r\n.lastVendor{\r\n width: calc(100% - 9px);\r\n border-top: 1;\r\n display: none;\r\n overflow: auto;\r\n }\r\n.lastBuying{\r\n padding: 4px;\r\n }\r\n\r\n@media(max-width: 768px) {\r\n .container{\r\n grid-template-columns:1fr;\r\n grid-gap:5px;\r\n }\r\n .baslik{\r\n font-size:16px;\r\n }\r\n}",
"js": "return {\n rowAction: function (id,data) { \n \n RESID = data.RESID;\n GUESTID = data.GUESTID;\n params = {\n filters: { RESID: data.RESID, GUESTID: data.GUESTID },\n };\n params2 = {\n filters: { GUESTID: data.GUESTID },\n };\n if(id === \"crm-comments\"){\n this.$popup.openPage('crm-comments', params2);\n } else if(id === \"crm-task\"){\n this.$popup.openPage('crm-task', params);\n }else{\n this.$rowAction(id,data);\n }\n }\n}",
"filterPanelFn": "if (this.get('ISWEDDINGDAY').Value != 1 || this.get('ISWEDDINGDAY').Value != true) {\n this.get('ISWEDDINGDAY').Value == 0;\n}\nif (this.get('ISALLERGIC').Value != 1 || this.get('ISALLERGIC').Value != true) {\n this.get('ISALLERGIC').Value == 0;\n}\nif (this.get('ISBIRTHDAY').Value != 1 || this.get('ISBIRTHDAY').Value != true) {\n this.get('ISALLERGIC').Value == 0;\n}\nif (this.get('ISEXTRAREQ').Value != 1 || this.get('ISEXTRAREQ').Value != true) {\n this.get('ISALLERGIC').Value == 0;\n}\nif (this.get('ISCINNOTES').Value != 1 || this.get('ISCINNOTES').Value != true) {\n this.get('ISALLERGIC').Value == 0;\n}\nif (this.get('ISVIP').Value != 1 || this.get('ISVIP').Value != true) {\n this.get('ISALLERGIC').Value == 0;\n}\nif (this.get('ISBLACK').Value != 1 || this.get('ISBLACK').Value == true) {\n this.get('ISALLERGIC').Value == 0;\n}"
}Last updated
