jinql
/
cronsun
mirror of https://github.com/shunfei/cronsun
1
0
Fork 0
Code Issues Releases Wiki Activity

ui: fix Pager component

pull/69/head
Doflatango 2018-03-07 09:50:12 +08:00
parent 79fb9da2ca
commit 5ac4ed6fda
3 changed files with 22 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
web/static_assets.go
View File

File diff suppressed because one or more lines are too long

2
web/ui/src/components/Log.vue
View File

@ -66,7 +66,7 @@
</tr>
</tbody>
</table>
<Pager v-if="list && list.length>0" :total="total" :length="5"/>
<Pager v-if="list && list.length>0" :total="total" :maxBtn="5"/>
<ExecuteJob ref="executeJobModal"/>
</div>
</template>

28
web/ui/src/components/basic/Pager.vue
View File

@ -4,7 +4,7 @@
<router-link :to="pageURL(startPage-1)" class="ui button" :class="{disabled: startPage<=1}"><i class="angle left icon"></i></router-link>
<router-link :to="pageURL(startPage + n - 1)" v-for="n in pageBtnNum" class="ui button" :class="{blue: startPage+n-1 == _current}">{{startPage + n-1}}</router-link>
<a class="ui button disabled">{{_current}}/{{total}}</a>
<router-link :to="pageURL(startPage+length)" class="ui button" :class="{disabled: startPage+length>total}"><i class="angle right icon"></i></router-link>
<router-link :to="pageURL(startPage+maxBtn)" class="ui button" :class="{disabled: startPage+maxBtn>total}"><i class="angle right icon"></i></router-link>
</div>
<div class="ui action input">
<input type="text" ref="gopage" style="width: 70px;">
@ -20,22 +20,19 @@ export default {
name: 'pager',
props: {
total: {type: Number, default: 1, required: true},
length: {type: Number, default: 5}
maxBtn: {type: Number, default: 5}
},
data: function(){
return {
_pagevar: '',
_current: 1//,
//_startPage: 1,
//_pageBtnNum: 5
_pagevar: 'page',
_current: 1,
startPage: 1
}
},
created: function(){
this._pagevar = this.pageVar || 'page';
this._current = this.$route.query[this._pagevar] || 1;
// this._startPage = Math.floor((this._current-1)/this.length) * this.length + 1;
// this._pageBtnNum = this.total - this._startPage - this.length <= 0 ? this.total - this._startPage + 1 : this.length;
this._current = parseInt(this.$route.query[this._pagevar]) || 1;
},
methods: {
@ -52,9 +49,8 @@ export default {
watch: {
'$route': function(){
this._current = this.$route.query[this._pagevar] || 1;
// this._startPage = Math.floor((this._current-1)/this.length) * this.length + 1;
// this._pageBtnNum = this.total - this._startPage - this.length <= 0 ? this.total - this._startPage + 1 : this.length;
this._current = parseInt(this.$route.query[this._pagevar]) || 1;
this.startPage = Math.floor((this._current-1)/this.maxBtn) * this.maxBtn + 1;
}
},
@ -69,13 +65,9 @@ export default {
return this.$route.path+'?'+query.join('&') + '&';
},
startPage: function(){
return Math.floor((this._current-1)/this.length) * this.length + 1;
},
pageBtnNum: function(){
return this.total - this.startPage - this.length <= 0 ? this.total - this.startPage + 1 : this.length;
},
return this.total - this.startPage - this.maxBtn <= 0 ? this.total - this.startPage + 1 : this.maxBtn;
}
}
}
</script>