zordertest

Overview

zordertest is full-stack project which has:

• small CAP project of OData service with simple model by composition between orders and items.

• UI Orders based on Fiori Elements.

how to use

• Prepare local environment into your VS code, you can use dockerized environment which is prepared by mere from this repository: caplukcadhf.git

• Clone this project to your prepared local environment by VS code using terminal:

  git clone https://github.com/lukcad/zordertest.git
  

• Open project as itself:

  code zordertest
  

• In opened project by VS code open terminal and run

  npm i
  

• Initialize local persistence sqlite database zordertest.sqlite by run

  cds deploy
  

• run applicaiton by using

  cds w
  

• Explore applicaiton by http://localhost:4004

DB model of backend

Service model of OData

Example of event handlers on service level

const cds = require('@sap/cds')

// prepare new value for pos when create new record in OrderItems.draft
async function genOrderItemsDraftPos(req) {
  if (req.data) {
    const {id} = await SELECT.one.from(req.target).columns('max(pos) as id') 
    req.data.pos = id + 1
  }
}

class mainsrv extends cds.ApplicationService {

  init() {

    // example of event handler for BEFORE UPDATE of entity Orders
    this.before("UPDATE", "Orders", (req) => this.onUpdateOrders(req.data));

    // example of event handler for after read of entity Order
    this.after("READ", "Orders", (results) => this.onReadOrders(results));

    // create event for calculating new pos for item in order in draft table
    this.before("CREATE", "OrderItems.drafts", genOrderItemsDraftPos);

    return super.init();
  }

  onUpdateOrders(data) {
    if (data.Items){
        for (let index = 0; index < data.Items.length; index++) {
          const element = data.Items[index];
          console.log(element);
        }
    }
  }

  onReadOrders(results) {
    if (results){
        for (let index = 0; index < results.length; index++) {
          const element = results[index];
          console.log(element);
        }
    }
  }
}

Fiori Pages

Orders list:

Order with Items:

Order in Edit mode:

Add new item during edit mode:

Studidng this project you can find how generate new pos value during cretaing Item of Order in Draft mode.

Happy progremming,

Thank you,

Mikhail.

Learn More

Learn more about CAP CDS at https://cap.cloud.sap/docs/get-started/.