vueフロントエンド実装リフレッシュレスインクリメンタルチェックおよびvue実装ページング
8541 ワード
// vue
new Vue({
el: '#app',// ，
delimiters:['@{', '}'],// vue
data: {
list:[],
id:'',
page_size:15,
page:1,
total_page:'',
type:'',
url:'',
status:'',
edit:' ',
sort:0,
key:0
},
mounted:function () {
this.update();
},
methods: {
//
up:function () {
this.page--;
if(this.page>1){
this.update();
}else{
this.page=1;
}
},
//
down:function () {
this.page++;
if(this.page<this.total_page){
this.update();
}else{
this.page = this.total_page ;
}
},
//
current:function (page) {
if(this.page !== page){
this.page = page;
this.update();
}
},//
update:function () {
var that = this;
var page_size = this.page_size;
$.post('/weather/{{$appid}}?page='+this.page,{'_token':'{{csrf_token()}}',page_size:page_size}, function (res) {
that.list = res.data.data;
that.total_page = res.total_page;
}, 'json');
},
insert:function () {
var that = this;
$.post('/move/add',{'_token': '{{csrf_token()}}',url:that.url,id:that.id,'appid':'{{$appid}}'}, function (res) {
if(res!==0){
alert(" ");
if(that.key==0){
that.list.push({
title:that.url,
id:res,
sort:0,
status:0
})
}if(that.key!=0){
//
that.list.splice(that.key,1,{
title:that.url,
id:that.id,
sort:that.url,
status:that.status
})
}
// console.log( that.list[that.key]);
}else{
alert(" ");
}
})
},
change:function (index,key) {
console.dir(index);
var that = this;
that.url = index.title
that.edit = ' ';
that.key = key;
that.status = index.status;
that.id = index.id;
that.sort = index.sort;
},
changeAdd:function () {
var that = this;
that.url = '';
that.edit = ' ';
},
//
changeSort:function (index) {
var sort = index.sort
var id = index.id
$.post('/move/sUpdate', {'_token':'{{csrf_token()}}', 'id' : id,'sort':sort}, function(res) {
if (res == 1) {
alert(" ");
location.reload();
} else {
alert(" ");
// window.location.href
}
})
},
del:function(lists){
var that = this;
var id = lists.id;
bootbox.confirm({
title: " ",
message: " ?",
callback: function (result) {
if (result) {
$.post('/move/del', {'_token':'{{csrf_token()}}', 'id' : id}, function(res){
if(res == 1){
alert(" ");
const todosIndex = that.list.indexOf(lists)
//
that.list.splice(todosIndex, 1)
}else{
alert(" ");
// window.location.href
}
});
}
},
buttons: {
"cancel": {"label": " "},
"confirm": {
"label": " ",
"className": "btn-danger"
}
}
});
}
}
})