section.project-values-table

    div.project-values-title
        h2 {{sectionName | translate}}
        a.button.button-gray.show-add-new(href="", title="{{'ADMIN.PROJECT_VALUES_POINTS.ACTION_ADD' | translate}}")
            span(translate="ADMIN.PROJECT_VALUES_POINTS.ACTION_ADD")

    div.project-values-header
        div.project-values-row
            div.project-values-name
                span(translate="COMMON.FIELDS.NAME")
            div.project-values-value
                span(translate="COMMON.FIELDS.VALUE")
            div.project-values-settings

    div.project-values-body
        div.sortable
            div(ng-repeat="value in values track by value.id", tg-bind-scope)
                form(tg-bind-scope)
                    div.project-values-row.row.table-main.visualization
                        tg-svg(svg-icon="icon-drag")

                        div.project-values-name
                            span {{ value.name }}

                        div.project-values-value
                            span {{ value.value }}

                        div.project-values-settings
                            a.edit-value(href="")
                                tg-svg(
                                    title="{{'ADMIN.COMMON.TITLE_ACTION_EDIT_VALUE' | translate}}",
                                    svg-icon="icon-edit"
                                )
                            a.delete-value(href="")
                                tg-svg(
                                    title="{{'ADMIN.COMMON.TITLE_ACTION_DELETE_VALUE' | translate}}"
                                    svg-icon="icon-trash"
                                )

                    div.project-values-row.row.table-main.edition.hidden
                        div.project-values-name
                            input(name="name", type="text", placeholder="{{'COMMON.FIELDS.NAME' | translate}}", ng-model="value.name")

                        div.project-values-value
                            input(name="value", type="text", placeholder="{{'COMMON.FIELDS.VALUE' | translate}}", ng-model="value.value", data-type="number")

                        div.project-values-settings
                            a.save.e2e-save(href="", title="{{'COMMON.SAVE' | translate}}")
                                tg-svg(svg-icon="icon-save")

                            a.cancel(href="", title="{{'COMMON.CANCEL' | translate}}")
                                tg-svg.cancel(svg-icon="icon-close")

        form
            div.project-values-row.new-value.hidden
                div.project-values-name
                    input(
                        name="name"
                        type="text"
                        placeholder="{{'COMMON.FIELDS.NAME' | translate}}"
                        ng-model="newValue.name"
                        data-required="true"
                    )

                div.project-values-value
                    input(
                        name="value"
                        type="text"
                        placeholder="{{'COMMON.FIELDS.VALUE' | translate}}"
                        ng-model="newValue.value"
                        data-type="number"
                    )

                div.project-values-settings
                    a.add-new.e2e-save(href="", title="{{'COMMON.ADD' | translate}}")
                        tg-svg(svg-icon="icon-save")

                    a.delete-new(href="", title="{{'COMMON.CANCEL' | translate}}")
                        tg-svg(svg-icon="icon-close")
