fvtt-pegasus-rpg/templates/item-perk-sheet.html

<form class="{{cssClass}}" autocomplete="off">
    <header class="sheet-header">
        <img class="profile-img" src="{{img}}" data-edit="img" title="{{name}}"/>
        <div class="header-fields">
            <h1 class="charname"><input name="name" type="text" value="{{name}}" placeholder="Name"/></h1>
        </div>
    </header>

    {{!-- Sheet Body --}}
    <section class="sheet-body">

        <div class="tab" data-group="primary">
          <ul>
            <li class="flexrow"><label class="generic-label">Level</label>
              <input type="text" class="input-numeric-short padd-right" name="data.level" value="{{data.level}}" data-dtype="Number"/>
            </li>
            
            <li class="flexrow"><label class="generic-label">Perk Status</label>
              <select class="competence-base flexrow" type="text" name="data.status" value="{{data.status}}" data-dtype="String">
                {{#select data.status}}
                <option value="ready">Ready</option>
                <option value="activated">Activated</option>
                <option value="round2">2 Rounds left</option>
                <option value="round1">1 Round left</option>
                {{/select}}
              </select> 
            </li>
            <li class="flexrow"><label class="generic-label">Number of use during activation</label>
              <select class="competence-base flexrow" type="text" name="data.nbuse" value="{{data.nbuse}}" data-dtype="String">
                {{#select data.nbuse}}
                <option value="perkduration">For Duration of Perk</option>
                <option value="next1action">Next 1 Stated Action</option>
                <option value="next2action">Next 2 Stated Action</option>
                <option value="next3action">Next 3 Stated Action</option>
                {{/select}}
              </select> 
            </li>
            <li class="flexrow"><label class="generic-label">Is Weaver Perk?</label>
              <label class="attribute-value checkbox"><input type="checkbox" name="data.isweaver" {{checked data.isweaver}}/></label>
            </li>

            <li class="flexrow"><label class="generic-label">Effects Gained</label>
            </li>
            <li>
              <ul class="ul-level1">
                <li class="flexrow"><div class="drop-perk-effect"><label>Drop Effects here !</label></div>
                </li>
                {{#each data.effectsgained as |effect idx|}}
                <li class="flexrow">
                  <label name="data.effectsgained[{{idx}}].name"><a class="view-subitem" data-type="effectsgained" data-index="{{idx}}">{{effect.name}}</a></label>
                  <div class="item-controls padd-left">
                    <a class="item-control delete-subitem padd-left" data-type="effectsgained" data-index="{{idx}}" title="Delete Effect"><i class="fas fa-trash"></i></a>
                  </div>   
                </li>
                {{/each}}
              </ul>              
            </li>
                
            {{#each data.features as |feature key|}}
              {{#if feature.isvalid}}
              <li class="flexrow">
                <label class="generic-label">{{feature.label}} ? </label>
                <label class="attribute-value checkbox"><input type="checkbox" name="data.features.{{key}}.flag" {{checked feature.flag}}/></label>
              </li>
                {{#if feature.flag}}
                <ul class="ul-level1">
                  <li class="flexrow"><label class="generic-label">{{feature.label}}</label>
                    {{#if (eq feature.type "statdice")}}
                      <select class="competence-base flexrow" type="text" name="data.features.{{key}}.value" value="{{feature.value}}" data-dtype="String">
                        {{#select feature.value}}
                        {{> systems/fvtt-pegasus-rpg/templates/partial-options-statistics.html notapplicable=true}}
                        {{/select}}
                      </select> 
                    {{/if}}
                    {{#if (eq feature.type "range")}}
                      <select class="competence-base flexrow" type="text" name="data.features.{{key}}.value" value="{{feature.value}}" data-dtype="String">
                        {{#select feature.value}}
                        {{> systems/fvtt-pegasus-rpg/templates/partial-options-range.html notapplicable=true}}
                        {{/select}}
                        </select> 
                    {{/if}}
                    {{#if (eq feature.type "number")}}
                    <input type="text" class="padd-right" name="data.features.{{key}}.value" value="{{feature.value}}" data-dtype="Number"/>
                    {{/if}}
                    {{#if (eq feature.type "string")}}
                    <input type="text" class="padd-right" name="data.features.{{key}}.value" value="{{feature.value}}" data-dtype="String"/>
                    {{/if}}
                    {{#if (eq feature.type "dropspec")}}
                    <ul class="ul-level1">
                      <li class="flexrow"><div class="drop-spec-perk" data-key={{key}}><label>Drop Specialisation here !</label></div>
                      </li>
                      <input type="text" class="padd-right" name="data.features.{{key}}.value" value="{{feature.value}}" data-dtype="String"/>
                    </ul>              
                    {{/if}}        
                    {{#if (eq feature.type "text")}}
                    <div class="small-editor item-text-long-line">
                      {{editor content=features.value target="data.features.{{key}}.value" button=true owner=owner editable=editable}}
                    </div>
                    {{/if}}
                  </li>
                </ul>                
                {{/if}}
              {{/if}}
            {{/each}}
          </ul>

          <label class="generic-label">Description</label>
          <div class="small-editor item-text-long-line">
          {{editor content=data.description target="data.description" button=true owner=owner editable=editable}}
          </div>
        </div>

    </section>
</form>