frontend-backend integration

[katunilya]

Requested Changes

We need to make frontend interact with backend. In this issue @SixDevelop you will find issues that should be solved for frontend.

Implementation Details

• add question type picking

Currently we have the following input types stored as enum in

ShortText = 0
LongText = 1
Email = ...
PhoneNumber
Label // forbidden
Integer
Decimal
Financial
MultipleChoiceOptionList // forbidden
SingleOptionSelect // forbidden 
Boolean

I suggest hard coding this value to drop down select menu

• report template question entity lacks order

when sending information about report template do not forget to include order field to question. Currently you send only this information:

{
  "id": "",
  "title": "report title",
  "questionnaires": [
    {
      "title": "Модуль 1",
      "order": 0,
      "sections": [
        {
          "title": "1 секция",
          "order": 1,
          "questions": [
            { "questionText": "1 вопрос", "inputType": 1 },
            { "questionText": "Новый вопрос", "inputType": 1 }
          ]
        }
      ]
    }
  ],
  "tables": []
}

which lack order field in each entity in array of questions. It may seem that this can be omitted but it does make a difference in future.

Possibly core changes should be made there:

focus-frontend/focus-frontend/src/app/create-report/module/module.component.ts

Lines 25 to 30 in 34d112c

	questions:[
	{
	questionText: "1 вопрос",
	inputType: this.types[0],
	}
	]

and code responsible for creating new questions.

Also it might be easy to ignore this data at first and only generate when you push this to the server just before POST request.

Additional Info

Better ask questions in comments under this issue

[katunilya]

• schedule page get reports

you can get reports by calling get request on api/report/template/info which will return pairs of titile-id values for all templates added to the database (example):

[
  {
    "id": "5eb467df257e630001f7543e",
    "title": "Title"
  },
  {
    "id": "5eb46d17bae54200012a2647",
    "title": "Title"
  }
]

can be easily used to build option list

possibly this stackoverflow question can help:

remember that in final version of api this can be achieved only with admin JWT token

• schedule page get organizations

you can get list of organizations via api/org/info which will return array of triples id-title-is_head (example with only 1 - head organization which will always be present):

[
  {
    "id": "5eb449e8cc9501000185a9a9",
    "title": "Head Organization",
    "isHead": true
  }
]

This might be useful (there we need multiple)

THIS PAGE LACKS POST!!!

[katunilya]

• fix auth page bugs

password is not hidden and route to login should be api/identity/login

also it seems that for some reason page generates some with username/password fields

also noticed that you are awaiting for wrong kind of result. Via login action you will get a string that will be ready to be inserted into Authorization request header

Bearer <token>

BUG

it seems that input on auth page is not configured properly. See code below:

focus-frontend/focus-frontend/src/app/auth/auth.component.html

Lines 6 to 11 in 34d112c

	<div formControlName="username" class="form-group">
	<input type="text" placeholder="Username" class="">
	</div>
	<div formControlName="password" class="form-group">
	<input type="text" placeholder="Password">
	</div>

it seems that formControlName parameter is placed in wrong tag. It should be in input, not in div container for input which causes the bug described above. See art-area implementation as example:

        <div class="form-group">
          <div class="col-12">
            <input
              type="text"
              formControlName="username"
              placeholder="Username"
              class="form-control"
            />
          </div>
        </div>

[katunilya]

• pages are not linked

as i remember you had site map - not really urgent and can be done afterwards

[katunilya]

• study how to write http urls

actually this

focus-frontend/focus-frontend/src/app/servises/timetable-list.service.ts

Line 21 in 34d112c

.get<SimpleTimetable[]>("http//localhost5000/api/timetable/info", this.httpOptions)

should be http://localhost:5400/api/report/schedule/info

[katunilya]

• fix schedule reaching

you completely screwed up naming which struggles me much - as I understood what you call timetable is Report Schedule. See comment above to figure out how to get them.

Also notice that your SampleTimetable model is not compatible with the one that server returns

<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< REQUEST >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

GET: /api/report/schedule/info
Authorization: Bearer <token>

<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< RESPONSE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

Content-Type: application/json
[
    {
        "id"                : string,       // stringed ObjectId
        "reportTemplate"    : string,       // stringed ObjectId
        "organizations"     : []string,     // list of stringed ObjectId
        "emissionPeriod"    : string,       // "dd.MM.yyyy-dd.MM.yyyy"
        "deadlinePeriod"    : string        // "days.months.years"
    }
]

this could be found in service documentation

[katunilya]

Admin vs User

We should also consider when we go to the same page as administrator and as user. We can use separated pages, or we can use same pages.

As I think there is only one page - Dashboard - where users will see reports of their organization (I already have request that does this job for organization, but it's not valid for admin - I will fix it). Or maybe we could have some separated page for administrator. In this case we need some filtering system for this page where administrator can group available reports by organizations and by template.

[katunilya]

• install spell checker

dammit just install spellchecker and fix all bullshit you wrote - organisation, servise, etc.

[katunilya]

• again study how to write urls

focus-frontend/focus-frontend/src/app/servises/organisations-list.service.ts

Line 21 in 34d112c

.get<SimpleOrganization[]>("http//localhost5000/api/identity/info", this.httpOptions)

should be http://localhost:5200/api/org/info

[katunilya]

• tag mismatch in create user form

same as in this comment but for user create page