Giter Club home page Giter Club logo

sap-samples / fiori-elements-feature-showcase Goto Github PK

View Code? Open in Web Editor NEW
182.0 23.0 64.0 725 KB

Sample application that demonstrates and documents a broad variety of features of SAP Fiori elements for OData V4. Developers can play around with the new features and learn how to implement them.

Home Page: https://community.sap.com/topics/fiori-elements

License: Apache License 2.0

JavaScript 31.60% CAP CDS 68.40%
sample sample-code sap-fiori-elements sap-fiori sap-cap odatav4

fiori-elements-feature-showcase's Issues

Missing example for SearchRestrictions

While there are examples for Capabilities annotations covering Crud Restrictions, I am missing an example for Capabilities.SearchRestrictions (e.g. hiding Search Field in OP table by annotating the entity used for it).
I also couldn't find anything about this in the official documentation, so it would be great to have it at least mentioned in the feature showcase.

CAP CDS:

annotate <your service entity> with @(Capabilities : {
    SearchRestrictions : {
        $Type : 'Capabilities.SearchRestrictionsType',
        Searchable: true
    }
})

XML Annotation:

<Annotations Target="<your service entity">
  <Annotation Term="Capabilities.SearchRestrictions">
    <Record Type="Capabilities.SearchRestrictionsType">
    <PropertyValue Property="Searchable" Bool="false"/>
  </Record>
</Annotation>

Validation error message on @mandatory fields

Hello,

Currently error message looks not perfect('Value is required').

  1. I did some investiogation. In the documentation metioned that they fixed returned error message: https://cap.cloud.sap/docs/releases/archive/2021/feb21#error-response-targets . However in our app target of error object contains "in/description". Do you know why it's working like that?
  2. Are you going to change this standard message to something like 'Value of mandatory field {field label} is required'?
  3. Could it be ajusted by SAP UI5 team?
  4. Are you avare about any workaround?

Expression % instead of $

Hi,

here in the enabled expression binding, a % sign is used instead of $.

"enabled": "{= %{deletePossible} === true}"

In my own Fiori Elements application, I have inserted a custom column where I needed to do something similar, and I also noticed that the $ sign in an expression is not working. Is this documented somewhere ? This repo is the only place where I found this so far.

BR,
Nico

Can't run project

Hello,

I can't run project locally. In console there are errors:
Screenshot 2022-05-09 at 10 36 57

Could somebody help?
Thanks

Copy/Pase functionality broken

Hi @schiwekM,

I am looking for a sample application that has a working copy/paste functionality on a list. I have two Fiori Element applications, where the button is visible but is always throwing a Failed to drill-down into exception. Now, when testing this sample, it is throwing the same error. Is this a general error with Fiori Elements or is there any missing annotation?

grafik

grafik

Log-dbg.js:499 2023-11-22 16:54:59.752500 Failed to drill-down into (ID=d419b9d9-897e-4e1f-9a7d-6a16e3c8f776,IsActiveEntity=true)/DataFieldForIntentBasedNavigation::FeatureShowcaseChildEntity2::manage::RequiresContext, invalid segment: DataFieldForIntentBasedNavigation::FeatureShowcaseChildEntity2::manage::RequiresContext - /srv1/RootEntities?$count=true&$select=HasActiveEntity,HasDraftEntity,ID,IsActiveEntity,childEntity2_ID,createdAt,createdBy,criticality_code,deletePossible,dimensions,fieldWithCriticality,fieldWithPrice,fieldWithURL,fieldWithURLtext,fieldWithUoM,forecastValue,imageUrl,integerValue,isoCurrency_code,modifiedAt,modifiedBy,starsValue,stringProperty,targetValue,uom_code,validFrom,validTo&$orderby=stringProperty&$filter=(IsActiveEntity%20eq%20false%20or%20SiblingEntity/IsActiveEntity%20eq%20null)%20and%20(criticality_code%20ge%200%20and%20criticality_code%20le%202)%20and%20(criticality_code%20ge%200%20and%20criticality_code%20le%202)&$expand=DraftAdministrativeData($select=DraftUUID,InProcessByUser,LastChangedByUser),childEntity2($select=ID,stringProperty),contact($select=ID,name) sap.ui.model.odata.v4.lib._Cache

I would be very interested in an error correction!

BR,
Nico

Missing dependency @sap/cds-foss

Hi,

I have installed CAP via npm i -g @sap/cds-dk and the cds command is working.
I have then run npm install in the root directory.

When I run cds watch I get this error about a missing node dependency (I have tried npm install @sap/cds-foss also but get the same)

'''
c:\gb\fiori_elements\fiori-elements-feature-showcase>cds watch

cds serve all --with-mocks --in-memory?
watching: cds,csn,csv,ts,mjs,cjs,js,json,properties,edmx,xml,env,css,gif,html,jpg,png,svg...
live reload enabled for browsers
_______________________

[cds] - model loaded from 18 file(s):

.\db\common.cds
.\db\schema.cds
.\srv\service.cds
.\app\services.cds
.\node_modules@sap\cds\common.cds
.\app\featureShowcase\capabilities.cds
.\app\featureShowcase\field-control.cds
.\app\featureShowcase\labels.cds
.\app\featureShowcase\layouts_RootEntities.cds
.\app\featureShowcase\layouts_contacts.cds
.\app\featureShowcase\layouts_RootEntityVariants.cds
.\app\featureShowcase\layouts_GrandChildEntities.cds
.\app\featureShowcase\layouts_ChildEntities3.cds
.\app\featureShowcase\layouts_ChildEntities1.cds
.\app\featureShowcase\layouts_ChildEntities2.cds
.\app\featureShowcase\layouts_ChartDataEntities.cds
.\app\featureShowcase\value-helps.cds
.\app\featureShowcaseNavigationTarget\annotations.cds

[ERROR] Cannot find module '@sap/cds-foss'
Require stack:

  • c:\gb\fiori_elements\fiori-elements-feature-showcase\node_modules@sap\cds\lib\utils\index.js
  • c:\gb\fiori_elements\fiori-elements-feature-showcase\node_modules@sap\cds\lib\index.js
  • c:\gb\fiori_elements\fiori-elements-feature-showcase\node_modules@sap\cds\bin\cds.js
  • C:\Users\Gregor\AppData\Roaming\npm\node_modules@sap\cds-dk\bin\cds.js
  • C:\Users\Gregor\AppData\Roaming\npm\node_modules@sap\cds-dk\bin\watch.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:885:15)
    at Function.Module._load (internal/modules/cjs/loader.js:730:27)
    at Module.require (internal/modules/cjs/loader.js:957:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.get uuid [as uuid] (c:\gb\fiori_elements\fiori-elements-feature-showcase\node_modules@sap\cds\lib\utils\index.js:8:43)
    at Object. (c:\gb\fiori_elements\fiori-elements-feature-showcase\node_modules@sap\cds\lib\req\context.js:1:61)
    at Module._compile (internal/modules/cjs/loader.js:1068:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
    at Module.load (internal/modules/cjs/loader.js:933:32)
    at Function.Module._load (internal/modules/cjs/loader.js:774:14)
    '''

Autoscaling in Fiori Charts

We were working on an application with CAP as backend and FIORI as UI. While trying to create an analytical app, we encountered that the Y axis was not appropriately scaling as per the Measure values (The Y axis shows 0 to 100 scale even though the minimum value of measure is 70 and maximum value of measure is 110). We have tried using some annotations for autoscaling or fixed scaling as below, but the issue still persists. We couldn't find any solution. Kindly let us know how the Y axis scaling is taken care in the Smart Chart SAPUI5 element.

Following annotations were tried:
AxisScaling : {
$Type : 'UI.ChartAxisScalingType',
ScaleBehavior : #AutoScale,
AutoScaleBehavior : {
$Type : 'UI.ChartAxisAutoScaleBehaviorType',
ZeroAlwaysVisible: false
}
}

Or
AxisScaling : {
$Type : 'UI.ChartAxisScalingType',
ScaleBehavior : #FixedScale
}
with datapoints assigned to Measures as below:
UI.DataPoint #DataPointQualifier : {
$Type : 'UI.DataPointType',
Value: price,
MinimumValue : 70,
MaximumValue : 115,
ValueFormat : {
$Type : 'UI.NumberFormat',
ScaleFactor : 100,
NumberOfFractionalDigits : 2
}
}

Navigation within the application

Hi Marten,

This is definitely an excellent sample application which incorporates a lot of features of SAP Fiori Elements. I have referred to the code for a few of my requirements. However, I am trying to achieve something, for which, I am not finding a suitable solution anywhere. You have incorporated navigation to a different application when the user clicks on the IBN button; I am trying to navigate to another Object page within my application when a custom action button on the Object page header is clicked. Would you be able to kindly guide me with an approach for this? Any help is highly appreciated!

SAP UI5 component cannot be loaded

Hello colleagues,

i cloned this repository, run npm install and cds watch. Opened http://localhost:4004, clicked on a UI5 tile and got this error:

Title: FehlerMessage: App kann nicht geöffnet werden, weil die SAP-UI5-Komponente der Anwendung nicht geladen werden konnte.Details: {	"info": "UI5-Komponente für Navigationsabsicht \"#FeatureShowcase-manage\" wurde nicht geladen.",	"technicalMessage": "Error: adding object \"component\" with duplicate id 'application-FeatureShowcase-manage-component'\n@https://ui5.sap.com/resources/sap-ui-core.js:416:545\ne@https://ui5.sap.com/resources/sap-ui-core.js:416:710\n@https://ui5.sap.com/resources/sap-ui-core.js:404:2762\nconstructor@https://ui5.sap.com/resources/sap-ui-core.js:404:2956\nconstructor@https://ui5.sap.com/resources/sap-ui-core.js:452:2915\nconstructor@\ns@\nc@https://ui5.sap.com/resources/sap-ui-core.js:422:4457\np@https://ui5.sap.com/resources/sap-ui-core.js:452:26719\n@https://ui5.sap.com/resources/sap-ui-core.js:404:4821"}

invokeAction - error handling and results

Hello,

Scenario 1

  1. CAP V4 service with an action with 3 parameters. The implementation checks the parameters, if invalid it throws an error.
  2. This action is added to the List page, in the table toolbar
 "targets": {
        "MyListPage": {
          "type": "Component",
          "id": "MyListPage",
          "name": "sap.fe.templates.ListReport",
          "options": {
            "settings": {
              "entitySet": "MyEntitySet",
              "variantManagement": "Page",
              "hideFilterBar": true,
              "navigation": {
                ...
              },
              "controlConfiguration": {
                "@com.sap.vocabularies.UI.v1.LineItem": {
                  "actions": {
                    "CustomAction": {
                      "press": "my.custom.action",
                      "text": "Some Text",
                      "enabled": true,
                      "visible": true
                    }
                  }
                }
  1. The controller extends ControllerExtension, invokes action passing only the model (unbound action).
...
let parameters = {
   model: this.base.editFlow.getView().getModel(),
    label: "Confirm",
};
this.base.editFlow.invokeAction(actionName, parameters)
  1. If the backend responds with an error, no error dialog shown in the ui, dumps on operations.js.
    error

Scenario 2

  1. The same action responds with req.reply passing a result object.
  2. invokeAction.then((res) => { }) function does not receive it (res is undefined)?

BR,
Jacek

Image not refreshing

I have been struggling with keeping the UI in sync with the backend when it comes to file uploading. I now stumble across this repo, and find there is the exact same issue.

To reproduce:

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.