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> </tr>
</tbody> </tbody>
</table> </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"/> <ExecuteJob ref="executeJobModal"/>
</div> </div>
</template> </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-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> <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> <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>
<div class="ui action input"> <div class="ui action input">
<input type="text" ref="gopage" style="width: 70px;"> <input type="text" ref="gopage" style="width: 70px;">
@ -20,22 +20,19 @@ export default {
name: 'pager', name: 'pager',
props: { props: {
total: {type: Number, default: 1, required: true}, total: {type: Number, default: 1, required: true},
length: {type: Number, default: 5} maxBtn: {type: Number, default: 5}
}, },
data: function(){ data: function(){
return { return {
_pagevar: '', _pagevar: 'page',
_current: 1//, _current: 1,
//_startPage: 1, startPage: 1
//_pageBtnNum: 5
} }
}, },
created: function(){ created: function(){
this._pagevar = this.pageVar || 'page'; this._pagevar = this.pageVar || 'page';
this._current = this.$route.query[this._pagevar] || 1; this._current = parseInt(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;
}, },
methods: { methods: {
@ -52,9 +49,8 @@ export default {
watch: { watch: {
'$route': function(){ '$route': function(){
this._current = this.$route.query[this._pagevar] || 1; this._current = parseInt(this.$route.query[this._pagevar]) || 1;
// this._startPage = Math.floor((this._current-1)/this.length) * this.length + 1; this.startPage = Math.floor((this._current-1)/this.maxBtn) * this.maxBtn + 1;
// this._pageBtnNum = this.total - this._startPage - this.length <= 0 ? this.total - this._startPage + 1 : this.length;
} }
}, },
@ -69,13 +65,9 @@ export default {
return this.$route.path+'?'+query.join('&') + '&'; return this.$route.path+'?'+query.join('&') + '&';
}, },
startPage: function(){
return Math.floor((this._current-1)/this.length) * this.length + 1;
},
pageBtnNum: function(){ 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> </script>