Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SST Table #866

Open
pwangai opened this issue Jul 20, 2020 · 1 comment · May be fixed by #920
Open

SST Table #866

pwangai opened this issue Jul 20, 2020 · 1 comment · May be fixed by #920

Comments

@pwangai
Copy link

pwangai commented Jul 20, 2020

Hey, when using sst, the first page populates the data to the table correctly, but when I go to another page, after I replace the old data with the new data at the setTable method table tells me no records, while when I console.log the data is coming back correctly. What might be the issue?

`<vs-table
:sst="true"
@search="handleSearch"
@change-page="handleChangePage"
@sort="handleSort"
v-model="selected"
pagination
max-items="3"
:total="table.totalElements"
search
:data="data">

        <template slot="thead">
            <vs-th v-for="(headerItem,n) in headers" :key="n">{{$t(headerItem.label)}}</vs-th>
        </template>

        <template slot-scope="{data}">
            <vs-tr :data="tr" :key="indextr" v-for="(tr, indextr) in data" >
                <vs-td v-for="(rowItem, r) in headers" :key="r" :data="data[indextr]+'.'+rowItem.key">
                    {{data[indextr][rowItem.key]}}
                </vs-td>
            </vs-tr>
        </template>
    </vs-table>`

`export default{
data:() => ({
selected:[],
data:[],
table: {
direction: 'DESC',
orderBy: 'id',
page: 0,
size: 3,
totalElements: 0,
},
headers:[
{
key: 'name',
label: 'tableName',
},
{
key: 'description',
label: 'tableDescription',
},
{
key: 'unitValue',
label:'tableUnitValue' ,
},
{
key: 'parentProduct',
label:'tableParentProduct' ,
},
{
key: 'productType',
label:'tableProductType' ,
},
{
key: 'category',
label: 'tableCategory'
},
{
key: 'dateCreated',
label: 'tableDateCreated'
}
]
}),
methods:{
handleChangePage (page) {
this.table.page = page - 1;
this.setTable();
},
setTable(){

            this.get(this.url,this.table).then((response)=>{
                this.data = response.data;
                this.table.totalElements = response.totalElements;
                console.log(JSON.stringify(this.data))
                //DATA CHANGES BUT TABLE DATE GOES TO BLANK
                
            })
        }

}
}`

@Caceresenzo
Copy link

Hi,

I was having the same issue myself.
What you are trying to do is not possible... Well not without hacks.

The SSR with pages seems to be broken.
For exemple, if you go the 2nd pages, the vs-table expect data to be content page page 1 + content for page 2. The server side rendering does not work properly...

What you can do is to have an external vs-pagination and link it to your vs-table.

When a click is detected to the pagination, you can now do your request on your server, BUT the table MUST stay on page one.

@ugorur ugorur linked a pull request Oct 8, 2020 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants