BigW Consortium Gitlab

board_list.js.es6 2.59 KB
Newer Older
1 2
//= require ./board_card

3
(() => {
4 5
  const Store = gl.issueBoards.BoardsStore;

6 7 8 9 10 11 12
  window.gl = window.gl || {};
  window.gl.issueBoards = window.gl.issueBoards || {};

  gl.issueBoards.BoardList = Vue.extend({
    components: {
      'board-card': gl.issueBoards.BoardCard
    },
Phil Hughes committed
13 14
    props: {
      disabled: Boolean,
15
      list: Object,
Phil Hughes committed
16
      issues: Array,
Phil Hughes committed
17 18
      loading: Boolean,
      issueLinkBase: String
Phil Hughes committed
19
    },
20
    data () {
Phil Hughes committed
21
      return {
22
        scrollOffset: 250,
23 24
        filters: Store.state.filters,
        showCount: false
Phil Hughes committed
25 26
      };
    },
27
    watch: {
28 29
      filters: {
        handler () {
30
          this.list.loadingMore = false;
31 32 33
          this.$els.list.scrollTop = 0;
        },
        deep: true
34 35 36
      },
      issues () {
        this.$nextTick(() => {
37 38 39 40 41
          if (this.scrollHeight() <= this.listHeight() && this.list.issuesSize > this.list.issues.length) {
            this.list.page++;
            this.list.getIssues(false);
          }

42 43 44 45 46 47
          if (this.scrollHeight() > this.listHeight()) {
            this.showCount = true;
          } else {
            this.showCount = false;
          }
        });
48 49
      }
    },
Phil Hughes committed
50
    methods: {
51
      listHeight () {
Phil Hughes committed
52 53
        return this.$els.list.getBoundingClientRect().height;
      },
54
      scrollHeight () {
Phil Hughes committed
55 56
        return this.$els.list.scrollHeight;
      },
57
      scrollTop () {
Phil Hughes committed
58 59
        return this.$els.list.scrollTop + this.listHeight();
      },
60
      loadNextPage () {
61
        const getIssues = this.list.nextPage();
Phil Hughes committed
62

63
        if (getIssues) {
64
          this.list.loadingMore = true;
65
          getIssues.then(() => {
66
            this.list.loadingMore = false;
67 68
          });
        }
69
      },
Phil Hughes committed
70
    },
71
    ready () {
72
      const options = gl.issueBoards.getBoardSortableDefaultOptions({
73 74 75
        group: 'issues',
        sort: false,
        disabled: this.disabled,
76
        filter: '.board-list-count',
77 78
        onStart: (e) => {
          const card = this.$refs.issue[e.oldIndex];
79

80 81
          Store.moving.issue = card.issue;
          Store.moving.list = card.list;
82

83
          gl.issueBoards.onStart();
84 85 86 87 88 89 90 91
        },
        onAdd: (e) => {
          gl.issueBoards.BoardsStore.moveIssueToList(Store.moving.list, this.list, Store.moving.issue);
        },
        onRemove: (e) => {
          this.$refs.issue[e.oldIndex].$destroy(true);
        }
      });
92

Phil Hughes committed
93
      this.sortable = Sortable.create(this.$els.list, options);
Phil Hughes committed
94 95 96

      // Scroll event on list to load more
      this.$els.list.onscroll = () => {
97
        if ((this.scrollTop() > this.scrollHeight() - this.scrollOffset) && !this.list.loadingMore) {
98
          this.loadNextPage();
Phil Hughes committed
99 100 101 102
        }
      };
    }
  });
Phil Hughes committed
103
})();