Projekt

Obecné

Profil

« Předchozí | Další » 

Revize 5885e489

Přidáno uživatelem Jan Pašek před asi 4 roky(ů)

Re #8583 - Loading screen and error reaction in certificate.html

Zobrazit rozdíly:

static/index.html
5 5 
    <title>X.509 Certificate Management</title>
6 6 
    <link rel="stylesheet" href="/static/css/app.css">
7 7 
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
8 
    <link href="https://cdn.jsdelivr.net/npm/vue-loading-overlay@3/dist/vue-loading.css" rel="stylesheet">
8 9 
</head>
9 10 
<body>
10 11 
    <div id="certificateListingPage" class="p-4">
11 
        <div>
12 
            <h1 class="ml-2 d-inline-block">Certificate Listing</h1>
13 
            <a class="btn btn-success ml-4 mb-3" href="/static/create_certificate.html">Create certificate</a>
12 
        <div v-if="loading">
13 
            <loading :active.sync="loading"
14 
                     :can-cancel="false"
15 
                      loader="dots"
16 
                     :is-full-page="true"></loading>
14 17 
        </div>
15 
        <div class="alert alert-success" v-if="successMessage !== ''" role="alert" v-cloak>
16 
            {{ successMessage }}
18 
        <div v-if="!loading" v-cloak>
19 
            <div>
20 
                <h1 class="ml-2 d-inline-block">Certificate Listing</h1>
21 
                <a class="btn btn-success ml-4 mb-3" href="/static/create_certificate.html">Create certificate</a>
22 
            </div>
23 
            <div class="alert alert-success" v-if="successMessage !== ''" role="alert" v-cloak>
24 
                {{ successMessage }}
25 
            </div>
26 
            <table class="table table-striped table-hover text-center">
27 
                <thead class="thead-dark">
28 
                    <tr>
29 
                        <th class="align-middle" scope="col" rowspan="2">Common name</th>
30 
                        <th class="align-middle" scope="col" colspan="2">Validity</th>
31 
                        <th class="align-middle" scope="col" rowspan="2">Usage</th>
32 
                        <th class="align-middle" scope="col" rowspan="2">Certificate</th>
33 
                        <th class="align-middle" scope="col" rowspan="2">Issuer</th>
34 
                    </tr>
35 
                    <tr>
36 
                        <th scope="col">Start</th>
37 
                        <th scope="col">End</th>
38 
                    </tr>
39 
                </thead>
40 
                <tbody>
41 
                    <tr is="certificate-item"
42 
                        v-for="certificate in certificates"
43 
                        v-bind:certificate="certificate"
44 
                        v-bind:key="certificate.id">
45 
                    </tr>
46 
                </tbody>
47 
            </table>
17 48 
        </div>
18 
        <table class="table table-striped table-hover text-center">
19 
            <thead class="thead-dark">
20 
                <tr>
21 
                    <th class="align-middle" scope="col" rowspan="2">Common name</th>
22 
                    <th class="align-middle" scope="col" colspan="2">Validity</th>
23 
                    <th class="align-middle" scope="col" rowspan="2">Usage</th>
24 
                    <th class="align-middle" scope="col" rowspan="2">Certificate</th>
25 
                    <th class="align-middle" scope="col" rowspan="2">Issuer</th>
26 
                </tr>
27 
                <tr>
28 
                    <th scope="col">Start</th>
29 
                    <th scope="col">End</th>
30 
                </tr>
31 
            </thead>
32 
            <tbody>
33 
                <tr is="certificate-item"
34 
                    v-for="certificate in certificates"
35 
                    v-bind:certificate="certificate"
36 
                    v-bind:key="certificate.id">
37 
                </tr>
38 
            </tbody>
39 
        </table>
40 49 
    </div>
41 

  		




  
  50
  
    
    <script src="https://cdn.jsdelivr.net/npm/vue-loading-overlay@3"></script>


  		




  42
  51
  
    
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>


  		




  43
  52
  
    
    <script src="/static/js/jquery-3.6.0.min.js"></script>


  		




  44
  53
  
    
    <script src="/static/js/bootstrap.bundle.min.js"></script>


  		












Také k dispozici:  Unified diff