P42_UI/app/views/projects/bypass/dialogs/BypassTokenGrantProposalDialog.html

<style>
    .fasttracks-propa {
        padding: var(--eicui-base-spacing-xl);
        transition: all 0.5s;
    }
    .fasttracks-propa.loading {
        padding: var(--eicui-base-spacing-xl);
        transition: all 0.5s;
        overflow: hidden;

    }
    .fasttracks-propa .spinner { 
        text-align: center;
        display: none; 
        animation: spin 1s infinite linear;
    }
    .fasttracks-propa .content { display: block; }
    .fasttracks-propa.loading .spinner { display: block;  }
    .fasttracks-propa.loading .content { display: none; }
    .fasttracks-propa .fields-group { min-height: 490px; }
    .fasttracks-propa .fields-group.read { min-height: 380px; }
</style>
<div class="fasttracks-propa loading">
    <div large class="spinner icon-spinner">
    </div>
    <div class="content">
        <input eicinput type="hidden" name="pic" data-path="organisation" value="" />
        <div eicalert success class="wizard-message">A token has been successfully granted to <span class="company"></span></div>
        <p class="instructions">In order to immediately activate the coaching, please fill-in the following informations :</p>
        <div class="cols-2 left">
            <div class="tabs-extended vertical">
                <menu eictab>                 
                    <li data-target="token">Token</li>
                    <li data-target="enterprise">Company <span xxsmall eicbadge danger data-target="enterprise"></span></li>
                    <li data-target="proposal">Proposal <span xxsmall eicbadge danger data-target="proposal"></span></li>
                    <li data-target="contact">Contact person <span xxsmall eicbadge danger data-target="contact"></span></li>    
                </menu>
            </div>
            <div class="sections">
                <article eiccard class="fields-group" data-target="token">
                    <section class="cols-2">
                        <div>
                            <label>granted</label>
                            <input eicinput name="granted" data-path="token" data-type="ignore" disabled />
                        </div>
                        <div>
                            <label>status</label>
                            <input eicinput name="status" data-path="" data-type="ignore" disabled />
                        </div>
                        <div>
                            <label>Scheme</label>
                            <input eicinput name="track" data-path="token" data-type="ignore" disabled />
                        </div>
                        <div>
                            <label>Domain</label>
                            <input eicinput name="domain" data-path="token" data-type="ignore" disabled />
                        </div>
                        
                    </section>
                </article>
                <article eiccard class="fields-group" data-target="enterprise">
                    <section>
                        <div class="cols-2">
                            <div>
                                <label>PIC</label>
                                <input eicinput name="pic" data-path="token.enterprise" data-type="ignore" disabled />
                            </div>
                            <div>
                                <label>Legal name</label>
                                <input eicinput name="legalname" data-path="token.enterprise" data-type="ignore" disabled />
                            </div>
                        </div>
                        <div>
                            <label>Type of entity</label>
                            <select eicselect name="companyType" data-path="organisation" class="required">
                                <option value=""></option>
                                <option value="sme">SME</option>
                                <option value="midcap">Small mid-cap</option>
                                <option value="person">Natural person</option>
                            </select>
                        </div>
                    </section>
                </article>
                <article eiccard class="fields-group" data-target="proposal">
                    <section>
                        <div class="cols-2">
                            <div>
                                <label>Acronym</label>
                                <input eicinput name="acronym" data-path="proposal" data-type="text" maxlen="50" class="required" />
                            </div>
                            <div>
                                <label>Submitted</label>
                                <input eicinput name="submissiondate" data-path="token.project" data-type="ignore" disabled />
                            </div>
                        </div>
                        <div>
                            <label>Full Title</label>
                            <input eicinput name="title" data-path="proposal" data-type="text" maxlen="200" class="required" />
                        </div>
                        <div>
                            <label>Abstract</label>
                            <textarea eictextarea name="abstract" data-path="proposal" data-type="text" maxlen="1000" class="required"></textarea>
                        </div>
                        
                    </section>
                </article>
                <article eiccard class="fields-group" data-target="contact">
                    <section>
                        <div class="lookup">
                            <label>Please identify the contact person by the EU-Login</label>
                            <div class="cols-2 right center">
                                <input eicinput type="search" name="euLoginId" data-path="contact" class="required" value="" placeholder="Enter member's EU Login ID or email and press enter"/>
                                <button eicbutton icon="icon-search" class="user-search" primary ></button>
                            </div>
                        </div>            
                        <div class="cols-3">
                            <div>
                                <label>First name</label> 
                                <input eicinput disabled name="firstname" data-path="contact" data-type="text"  class="required" />
                            </div>
                            <div>
                                <label>Last name</label>
                                <input eicinput disabled name="lastname" data-path="contact" data-type="text"  class="required" />
                            </div>
                            <div>
                                <label>Gender</label>
                                <select eicselect name="gender" data-path="contact" data-type="text" class="required">
                                    <option></option>
                                    <option value="F">Female</option>
                                    <option value="M">Male</option>
                                    <option value="I">I prefer not to declare</option>
                                </select>
                            </div>
                        </div>
                        <div class="cols-2">
                            <div>
                                <label>email</label>
                                <input eicinput disabled type="email" name="email" data-path="contact" data-type="text" />
                            </div>
                            <div>
                                <label>Phone</label>
                                <input eicinput type="tel" name="phone" data-path="contact" data-type="text" maxlen="100" />
                            </div>
                        </div>
                        <div>
                            <label>Position</label>
                            <select eicselect lookup name="position" data-path="contact" data-type="text" class="required"></select>
                        </div>          
                    </section>
                </article>
            </div>
        </div>
    </div>
    
</div>