<template>
    <tr
        :class="{
            'is-active': isActive
        }"
        :style="htmlStyle"
        @click="$emit('click:row', row)"
        @dblclick="$emit('dblclick:row', row)"
    >
        <cs-datatable-cell
            v-for="(column, index) in columns"
            :key="'column-' + index"
            :app="datatable.app"
            :column="column"
            :item="row.item"
            :rowIndex="row.index"
            :per_page="per_page"
            :current_page="current_page"
            :htmlStyle="htmlStyle"
        />
    </tr>
</template>

<script>
    export default {
        props: {
            row: {required: true},
            datatable: {required: true},
        },

        computed: {
            columns() {
                return this.datatable.columns;
            },

            per_page() {
                return this.datatable.dataprovider.perPageFromResponse;
            },

            current_page() {
                return this.datatable.dataprovider.current_page;
            },

            isActive() {
                return this.datatable.activeRow && (this.datatable.activeRow.item.id == this.row.item.id)
            },

            htmlStyle() {
                return this.datatable.RowHtmlStyle(this.row.item)
            }
        },

        methods: {
            OnRowDblclick() {
            }
        },

        components: {
            CsDatatableCell: require('./cell/CsDatatableCell').default,
        },

        name: 'CsDatatableRow',
    }
</script>>