demo-dr-form/dr.html at main · healthdatasafe/demo-dr-form · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />

  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  <link rel="icon" href="https://healthdatasafe.github.io/style-old/images/Favicon/favicon.ico" type="image/x-icon">
  <link rel="stylesheet" type="text/css" href="https://healthdatasafe.github.io/style-old/hds.min.css">
  <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Inter:300,400">
  <title>Demo Form - Dr's page</title>
</head>
<script src="https://healthdatasafe.github.io/hds-lib-js/hds-lib.js"></script>
<script type="module" src="dr-controler.js"></script>

<body style="background-color:powderblue;">
  <div class="container">
    <a href="https://www.healthdatasafe.org" target="_hds"><a href="https://www.healthdatasafe.org" target="_hds"><img src="https://healthdatasafe.github.io/style-old/images/Horizontal/hds-logo-hz-1024x400-hz-color.png" alt="Logo" width="300px"></a></a>
    <h1>Demo Form - Doctor's page</h1>
    <div class="card">
      <div class="card-login">
        <h2 class="card-title">Welcome</h2>
        <span id="login-button"></span>
        <br><br>
        <span id="welcome-message-mme">
          Dear Doctor, from this page, you can visualize the data from patients and share an invitation to fill your questionnaire.
        </span>
        <br>
        <span id="welcome-message-viewer" style="display: none;"> Welcome message
        </span>
        <br>
        <span id="please-login">
          Please login.
        </span>
      </div>
    </div>
    <div class="card" id="data-view" style="display: none;">
      <table id='questionnary-table' class="table">
        <thead>
          <th> Select a questionnaire:</th>
        </thead>
        <tbody>
          <!-- will be filled by getQuestionaires-->
        </tbody>
      </table>

      <div id="questionnary-view">
        <div class="card">
          <h2 class="card-title">Request Content</h2>
          <table class="table">
            <tr>
              <td><table border="1" class="table" style="background-color: white;">
                <tr><td>Title</td><td><span id="request-title"></span></td></tr>
                <tr><td>Requester</td><td><span id="request-requester"></span></td></tr>
                <tr><td>Description</td><td><span id="request-description"></span></td></tr>
                <tr><td>Consent</td><td><span id="request-consent"></span></td></tr>
                <tr><td>App Id</td><td><span id="request-app-id"></span></td></tr>
                <tr><td>App Url</td><td><span id="request-app-url"></span></td></tr>
              </table></td>
              <td><table border="1" class="table" style="background-color: white;">
                <tr><td>Permissions</td></tr>
                <tr><td><span id="request-permissions"></span></td></tr>
              </table></td>
            </tr>
          </table>
          <table class="table" id='forms-sections' border="1" style="background-color: white;">

          </table>
          <pre id="requestContent"></pre>

          <h2 class="card-title">Create Sharing link</h2>
          <input type="text" id="title-new-sharing"/><button id="button-new-sharing">Create</button>
          <span id="sharing-link"></span>

          <h2 class="card-title">Pending invites</h2>
          <table id='invites-table' class="table">
          </table>
        </div>
        <div class="card">
          <h2 class="card-title">Patients</h2>
          <button id="button-download" class="btn btn-secondary">Download</button>
          <table id='patients-table' class="table">
            <thead>
              <!-- will be filled by refreshPatientList Headers-->
            </thead>
            <tbody>
              <!-- will be filled by refreshPatientList-->
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</body>

</html>