Provision
/
UnivateProperties
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Activity
Selaa lähdekoodia

Merge branch 'master' of http://192.168.6.188:3000/Provision/UnivateProperties

master
Lene' Scholtz 5 vuotta sitten
vanhempi
9a7d9f1398 3024011d02
commit
2b7035434d
17 muutettua tiedostoa jossa 713 lisäystä ja 221 poistoa
Jaettu näkymä Näytä diff tilastot
  1. 7
    0
      public/css/dragndrop.table.columns.css
  2. 6
    2
      public/index.html
  3. 137
    0
      public/js/dragndrop.table.columns.js
  4. 7
    0
      public/js/dragndrop.table.columns.min.js
  5. 4
    0
      public/js/jquery-3.2.1.slim.min.js
  6. 7
    0
      src/assets/staticData/itemsPerPage.js
  7. 11
    27
      src/components/admin/unitConfiguration/unitConfigurationPage.vue
  8. 0
    1
      src/components/home/homePage.vue
  9. 107
    0
      src/components/shared/basePagination.vue
  10. 32
    0
      src/components/shared/basePaginationItem.vue
  11. 187
    0
      src/components/shared/listView.vue
  12. 9
    9
      src/components/shared/navBar.vue
  13. 5
    5
      src/components/shared/searchTab.vue
  14. 1
    0
      src/main.js
  15. 176
    176
      src/router/index.js
  16. 16
    0
      src/store/modules/timeshare/weekList.js
  17. 1
    1
      vue.config.js

+ 7
- 0
public/css/dragndrop.table.columns.css Näytä tiedosto 

@@ -0,0 +1,7 @@
1 
+body {
2 
+    background-color: #f9f9f9
3 
+}
4 
+
5 
+.container {
6 
+    margin-top: 20px;
7 
+}

+ 6
- 2
public/index.html Näytä tiedosto 

@@ -16,6 +16,7 @@
16 16 
   <link href="lib/ionicons/css/ionicons.min.css" rel="stylesheet">
17 17 
   <link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
18 18 
   <link href="css/style.css" rel="stylesheet">
19 
+  <link rel="stylesheet" href="css/dragndrop.table.columns.css" />
19 20 
 </head>
20 21
21 22 
 <body>
 
@@ -32,7 +33,10 @@
32 33 
 <script src="lib/easing/easing.min.js"></script>
33 34 
 <script src="lib/owlcarousel/owl.carousel.min.js"></script>
34 35 
 <script src="lib/scrollreveal/scrollreveal.min.js"></script>
35 
-
36 
+<script src="js/dragndrop.table.columns.js" type="text/javascript"></script>
36 37 
 <script src="js/main.js"></script>
38 
+<script>
39 
+  $('.table').dragableColumns();
40 
+</script>
37 41
38 
-</html>
42 
+</html>

+ 137
- 0
public/js/dragndrop.table.columns.js Näytä tiedosto 

@@ -0,0 +1,137 @@
1 
+/* global $:false, jQuery:false */
2 
+/*
3 
+Drag & Drop Table Columns v.3.1.5
4 
+for jQuery 3.x
5 
+by Oleksandr Nikitin (a.nikitin@i.ua)
6 
+https://github.com/alexshnur/drag-n-drop-table-columns
7 
+*/
8 
+(function ($, window) {
9 
+  let cols;
10 
+  let dragSrcEl = null;
11 
+  let dragSrcEnter = null;
12 
+  let dragableColumns;
13 
+  let
14 
+    _this;
15 
+
16 
+  function insertAfter(elem, refElem) {
17 
+    return refElem.parentNode.insertBefore(elem, refElem.nextSibling);
18 
+  }
19 
+
20 
+  function isIE() {
21 
+    const nav = navigator.userAgent.toLowerCase();
22 
+    return (nav.indexOf('msie') !== -1) ? parseInt(nav.split('msie')[1]) : false;
23 
+  }
24 
+
25 
+  dragableColumns = (function () {
26 
+    let $table;
27 
+
28 
+    function dragColumns(table, options) {
29 
+      _this = this;
30 
+      $table = table;
31 
+      _this.options = $.extend({}, _this.options, options);
32 
+      if (_this.options.drag) {
33 
+        if (isIE() === 9) {
34 
+          $table.find('thead tr th').each(function () {
35 
+            if ($(this).find('.drag-ie').length === 0) {
36 
+              $(this).html($('<a>').html($(this).html()).attr('href', '#').addClass(
37 
+                'drag-ie',
38 
+              ));
39 
+            }
40 
+          });
41 
+        }
42 
+        cols = $table.find('thead tr th');
43 
+
44 
+        jQuery.event.addProp('dataTransfer');
45 
+        [].forEach.call(cols, (col) => {
46 
+          col.setAttribute('draggable', true);
47 
+
48 
+          $(col).on('dragstart', _this.handleDragStart);
49 
+          $(col).on('dragenter', _this.handleDragEnter);
50 
+          $(col).on('dragover', _this.handleDragOver);
51 
+          $(col).on('dragleave', _this.handleDragLeave);
52 
+          $(col).on('drop', _this.handleDrop);
53 
+          $(col).on('dragend', _this.handleDragEnd);
54 
+        });
55 
+      }
56 
+    }
57 
+
58 
+    dragColumns.prototype = {
59 
+      options: {
60 
+        drag: true,
61 
+        dragClass: 'drag',
62 
+        overClass: 'over',
63 
+        movedContainerSelector: '.dnd-moved',
64 
+      },
65 
+      handleDragStart(e) {
66 
+        $(this).addClass(_this.options.dragClass);
67 
+        dragSrcEl = this;
68 
+        e.dataTransfer.effectAllowed = 'copy';
69 
+        e.dataTransfer.setData('text/html', this.id);
70 
+      },
71 
+      handleDragOver(e) {
72 
+        if (e.preventDefault) {
73 
+          e.preventDefault();
74 
+        }
75 
+        e.dataTransfer.dropEffect = 'copy';
76 
+      },
77 
+      handleDragEnter(e) {
78 
+        dragSrcEnter = this;
79 
+        [].forEach.call(cols, (col) => {
80 
+          $(col).removeClass(_this.options.overClass);
81 
+        });
82 
+        $(this).addClass(_this.options.overClass);
83 
+      },
84 
+      handleDragLeave(e) {
85 
+        if (dragSrcEnter !== e) {
86 
+          // this.classList.remove(_this.options.overClass);
87 
+        }
88 
+      },
89 
+      handleDrop(e) {
90 
+        if (e.stopPropagation) {
91 
+          e.stopPropagation();
92 
+        }
93 
+        if (dragSrcEl !== e) {
94 
+          _this.moveColumns($(dragSrcEl).index(), $(this).index());
95 
+        }
96 
+      },
97 
+      handleDragEnd(e) {
98 
+        const colPositions = {
99 
+          array: [],
100 
+          object: {},
101 
+        };
102 
+        [].forEach.call(cols, (col) => {
103 
+          const name = $(col).attr('data-name') || $(col).index();
104 
+          $(col).removeClass(_this.options.overClass);
105 
+          colPositions.object[name] = $(col).index();
106 
+          colPositions.array.push($(col).index());
107 
+        });
108 
+        if (typeof _this.options.onDragEnd === 'function') {
109 
+          _this.options.onDragEnd(colPositions);
110 
+        }
111 
+        $(dragSrcEl).removeClass(_this.options.dragClass);
112 
+      },
113 
+      moveColumns(fromIndex, toIndex) {
114 
+        const rows = $table.find(_this.options.movedContainerSelector);
115 
+        for (let i = 0; i < rows.length; i++) {
116 
+          if (toIndex > fromIndex) {
117 
+            insertAfter(rows[i].children[fromIndex], rows[i].children[toIndex]);
118 
+          } else if (toIndex < $table.find('thead tr th').length - 1) {
119 
+            rows[i].insertBefore(rows[i].children[fromIndex], rows[i].children[toIndex]);
120 
+          }
121 
+        }
122 
+      },
123 
+    };
124 
+
125 
+    return dragColumns;
126 
+  }());
127 
+
128 
+  return $.fn.extend({
129 
+    dragableColumns() {
130 
+      const option = (arguments[0]);
131 
+      return this.each(function () {
132 
+        const $table = $(this);
133 
+        new dragableColumns($table, option);
134 
+      });
135 
+    },
136 
+  });
137 
+}(window.jQuery, window));

+ 7
- 0
public/js/dragndrop.table.columns.min.js Näytä tiedosto 

@@ -0,0 +1,7 @@
1 
+/*
2 
+ Drag & Drop Table Columns v.3.1.5
3 
+ for jQuery 3.x
4 
+ by Oleksandr Nikitin (a.nikitin@i.ua)
5 
+ https://github.com/alexshnur/drag-n-drop-table-columns
6 
+ */
7 
+!function(n,e){function t(n,e){return e.parentNode.insertBefore(n,e.nextSibling)}function a(){var n=navigator.userAgent.toLowerCase();return-1!==n.indexOf("msie")?parseInt(n.split("msie")[1]):!1}var r,o,d,i=null,s=null;return o=function(){function e(e,t){d=this,o=e,d.options=n.extend({},d.options,t),d.options.drag&&(9===a()&&o.find("thead tr th").each(function(){0===n(this).find(".drag-ie").length&&n(this).html(n("<a>").html(n(this).html()).attr("href","#").addClass("drag-ie"))}),r=o.find("thead tr th"),jQuery.event.addProp("dataTransfer"),[].forEach.call(r,function(e){e.setAttribute("draggable",!0),n(e).on("dragstart",d.handleDragStart),n(e).on("dragenter",d.handleDragEnter),n(e).on("dragover",d.handleDragOver),n(e).on("dragleave",d.handleDragLeave),n(e).on("drop",d.handleDrop),n(e).on("dragend",d.handleDragEnd)}))}var o;return e.prototype={options:{drag:!0,dragClass:"drag",overClass:"over",movedContainerSelector:".dnd-moved"},handleDragStart:function(e){n(this).addClass(d.options.dragClass),i=this,e.dataTransfer.effectAllowed="copy",e.dataTransfer.setData("text/html",this.id)},handleDragOver:function(n){n.preventDefault&&n.preventDefault(),n.dataTransfer.dropEffect="copy"},handleDragEnter:function(e){s=this,[].forEach.call(r,function(e){n(e).removeClass(d.options.overClass)}),n(this).addClass(d.options.overClass)},handleDragLeave:function(n){},handleDrop:function(e){e.stopPropagation&&e.stopPropagation(),i!==e&&d.moveColumns(n(i).index(),n(this).index())},handleDragEnd:function(e){var t={array:[],object:{}};[].forEach.call(r,function(e){var a=n(e).attr("data-name")||n(e).index();n(e).removeClass(d.options.overClass),t.object[a]=n(e).index(),t.array.push(n(e).index())}),"function"==typeof d.options.onDragEnd&&d.options.onDragEnd(t),n(i).removeClass(d.options.dragClass)},moveColumns:function(n,e){for(var a=o.find(d.options.movedContainerSelector),r=0;r<a.length;r++)e>n?t(a[r].children[n],a[r].children[e]):e<o.find("thead tr th").length-1&&a[r].insertBefore(a[r].children[n],a[r].children[e])}},e}(),n.fn.extend({dragableColumns:function(){var e=arguments[0];return this.each(function(){var t=n(this);new o(t,e)})}})}(window.jQuery,window);

+ 4
- 0
public/js/jquery-3.2.1.slim.min.js
File diff suppressed because it is too large
Näytä tiedosto


+ 7
- 0
src/assets/staticData/itemsPerPage.js Näytä tiedosto 

@@ -0,0 +1,7 @@
1 
+const items = [
2 
+  10,
3 
+  20,
4 
+  50,
5 
+  100,
6 
+];
7 
+export default items;

+ 11
- 27
src/components/admin/unitConfiguration/unitConfigurationPage.vue Näytä tiedosto 

@@ -20,44 +20,28 @@
20 20 
     </div>
21 21 
     <!-- </section> -->
22 22 
     <div class="container">
23 
-      <table class="table table-bordered">
24 
-        <thead>
25 
-          <tr>
26 
-            <th>Id</th>
27 
-            <th>Code</th>
28 
-            <th>Bedrooms</th>
29 
-            <th>Adults</th>
30 
-            <th>Children</th>
31 
-          </tr>
32 
-        </thead>
33 
-        <tbody>
34 
-          <tr v-for="(item, i) in unitConfigurationList" :key="i">
35 
-            <td>{{item.id}}</td>
36 
-            <td>{{item.code}}</td>
37 
-            <td>{{item.bedrooms}}</td>
38 
-            <td>{{item.adults}}</td>
39 
-            <td>{{item.children}}</td>
40 
-          </tr>
41 
-        </tbody>
42 
-      </table>
23 
+      <ListView :items="unitConfigurationList" />
43 24 
     </div>
44 25 
   </div>
45 26 
 </template>
46 27 
 <script>
47 
-import { mapState, mapActions } from 'vuex';
28 
+import { mapState, mapActions } from "vuex";
29 
+import ListView from "../../shared/listView.vue";
48 30
49 31 
 export default {
50 
-  name: 'UnitConfiguration',
32 
+  name: "UnitConfiguration",
33 
+  components: {
34 
+    ListView
35 
+  },
51 36 
   created() {
52 37 
     this.getUnitConfigurationList();
53 38 
   },
54 39 
   computed: {
55 
-    ...mapState('unitConfiguration', ['unitConfigurationList']),
40 
+    ...mapState("unitConfiguration", ["unitConfigurationList"])
56 41 
   },
57 42 
   methods: {
58 
-    ...mapActions('unitConfiguration', ['getUnitConfigurationList']),
59 
-  },
43 
+    ...mapActions("unitConfiguration", ["getUnitConfigurationList"])
44 
+  }
60 45 
 };
61 46 
 </script>
62 
-<style>
63 
-</style>
47 
+<style></style>

+ 0
- 1
src/components/home/homePage.vue Näytä tiedosto 

@@ -8,7 +8,6 @@
8 8 
     <a href="#" class="back-to-top">
9 9 
       <i class="fa fa-chevron-up"></i>
10 10 
     </a>
11 
-    <div id="preloader"></div>
12 11 
   </div>
13 12 
 </template>
14 13 
 <script>

+ 107
- 0
src/components/shared/basePagination.vue Näytä tiedosto 

@@ -0,0 +1,107 @@
1 
+<template>
2 
+  <div>
3 
+    <nav>
4 
+      <ul class="pagination">
5 
+        <li class="page-item" v-if="isPreviousButtonDisabled" @click="previousPage">
6 
+          <a class="page-link" href="#" aria-label="Previous">
7 
+            <span aria-hidden="true">&laquo;</span>
8 
+            <span class="sr-only">Previous</span>
9 
+          </a>
10 
+        </li>
11 
+        <li class="page-item" v-for="item in paginationItems" :key="item">
12 
+          <BasePaginationItem
13 
+            :pageNumber="item"
14 
+            :disable="item === currentPage"
15 
+            @loadPage="onLoadPage"
16 
+          />
17 
+        </li>
18 
+        <li class="page-item" v-if="isNextButtonDisabled" @click="nextPage">
19 
+          <a class="page-link" href="#" aria-label="Next">
20 
+            <span aria-hidden="true">&raquo;</span>
21 
+            <span class="sr-only">Next</span>
22 
+          </a>
23 
+        </li>
24 
+      </ul>
25 
+    </nav>
26 
+  </div>
27 
+</template>
28 
+<script>
29 
+import BasePaginationItem from './basePaginationItem.vue';
30 
+
31 
+export default {
32 
+  components: {
33 
+    BasePaginationItem,
34 
+  },
35 
+  props: {
36 
+    visiblePagesCount: {
37 
+      type: Number,
38 
+      default: 5,
39 
+    },
40 
+    currentPage: {
41 
+      type: Number,
42 
+      required: true,
43 
+    },
44 
+    pageCount: {
45 
+      type: Number,
46 
+      required: true,
47 
+    },
48 
+  },
49 
+  computed: {
50 
+    isPreviousButtonDisabled() {
51 
+      return this.currentPage !== 1;
52 
+    },
53 
+    isNextButtonDisabled() {
54 
+      return this.currentPage !== this.pageCount;
55 
+    },
56 
+    paginationItems() {
57 
+      const { currentPage } = this;
58 
+      const { pageCount } = this;
59 
+      const { visiblePagesCount } = this;
60 
+      let pagintationItemsArray = [];
61 
+      if (pageCount <= visiblePagesCount) {
62 
+        let count = 1;
63 
+        while (count <= pageCount) {
64 
+          pagintationItemsArray.push(count);
65 
+          count += 1;
66 
+        }
67 
+        return pagintationItemsArray;
68 
+      }
69 
+      const visiblePagesThreshold = (visiblePagesCount - 1) / 2;
70 
+      pagintationItemsArray = Array(this.visiblePagesCount - 1).fill(0);
71 
+      if (currentPage <= visiblePagesThreshold + 1) {
72 
+        pagintationItemsArray[0] = 1;
73 
+        const pagintationItems = pagintationItemsArray.map(
74 
+          (paginationTrigger, index) => pagintationItemsArray[0] + index,
75 
+        );
76 
+        pagintationItems.push(pageCount);
77 
+        return pagintationItems;
78 
+      }
79 
+      if (currentPage >= pageCount - visiblePagesThreshold + 1) {
80 
+        const pagintationItems = pagintationItemsArray.map(
81 
+          (paginationTrigger, index) => pageCount - index,
82 
+        );
83 
+        pagintationItems.reverse().unshift(1);
84 
+        return pagintationItems;
85 
+      }
86 
+      pagintationItemsArray[0] = currentPage - visiblePagesThreshold + 1;
87 
+      const pagintationItems = pagintationItemsArray.map(
88 
+        (paginationTrigger, index) => pagintationItemsArray[0] + index,
89 
+      );
90 
+      pagintationItems.unshift(1);
91 
+      pagintationItems[pagintationItems.length - 1] = pageCount;
92 
+      return pagintationItems;
93 
+    },
94 
+  },
95 
+  methods: {
96 
+    onLoadPage(value) {
97 
+      this.$emit('loadPage', value);
98 
+    },
99 
+    nextPage() {
100 
+      this.$emit('nextPage');
101 
+    },
102 
+    previousPage() {
103 
+      this.$emit('previousPage');
104 
+    },
105 
+  },
106 
+};
107 
+</script>

+ 32
- 0
src/components/shared/basePaginationItem.vue Näytä tiedosto 

@@ -0,0 +1,32 @@
1 
+<template>
2 
+  <div>
3 
+    <div v-if="disable">
4 
+      <span class="page-link disabled">{{pageNumber}}</span>
5 
+    </div>
6 
+    <div v-else @click="onClick">
7 
+      <a class="page-link">{{pageNumber}}</a>
8 
+    </div>
9 
+  </div>
10 
+</template>
11 
+<script>
12 
+export default {
13 
+  props: {
14 
+    pageNumber: {
15 
+      type: Number,
16 
+      required: true,
17 
+    },
18 
+    disable: undefined,
19 
+  },
20 
+  methods: {
21 
+    onClick() {
22 
+      this.$emit('loadPage', this.pageNumber);
23 
+    },
24 
+  },
25 
+};
26 
+</script>
27 
+<style scoped>
28 
+.disabled {
29 
+  cursor: arrow;
30 
+  background-color: lightgray;
31 
+}
32 
+</style>

+ 187
- 0
src/components/shared/listView.vue Näytä tiedosto 

@@ -0,0 +1,187 @@
1 
+/* eslint-disable no-restricted-syntax */
2 
+/* eslint-disable guard-for-in */
3 
+<template>
4 
+  <div>
5 
+    <div class="container">
6 
+      <div class="row">
7 
+        <div class="col-md-12">
8 
+          <input
9 
+            v-model="searchItem"
10 
+            class="form-control"
11 
+            placeholder="Filter users by name or age"
12 
+          />
13 
+          <table id="table" class="table table-bordered table-hover">
14 
+            <thead>
15 
+              <tr class="dnd-moved">
16 
+                <th v-for="(column, c) in Columns" :key="c">
17 
+                  <div @click="sortBy(column)">{{ column }}</div>
18 
+                </th>
19 
+              </tr>
20 
+            </thead>
21 
+            <tbody>
22 
+              <tr v-for="(item, i) in DisplayItems" :key="i" class="text-left dnd-moved">
23 
+                <td v-for="(column, c) in Columns" :key="c">{{ item[column] }}</td>
24 
+              </tr>
25 
+            </tbody>
26 
+          </table>
27 
+          <div class="d-flex justify-content-between">
28 
+            <div class="p-1">{{ currentPage + ' / ' + PageCount }}</div>
29 
+            <div class="p-1">
30 
+              <BasePagination
31 
+                :currentPage="currentPage"
32 
+                :pageCount="PageCount"
33 
+                @nextPage="pageChangeHandle('next')"
34 
+                @previousPage="pageChangeHandle('previous')"
35 
+                @loadPage="pageChangeHandle"
36 
+              />
37 
+            </div>
38 
+            <div class="p-2">
39 
+              <div class="d-flex flex-row">
40 
+                <div>
41 
+                  <select
42 
+                    class="form-control"
43 
+                    id="agent"
44 
+                    name="agent"
45 
+                    v-model="visibleItemsPerPageCount"
46 
+                    @change="onChangeItemsPerPage()"
47 
+                  >
48 
+                    <option v-for="(item, i) in itemsPerPageList" :key="i">{{ item }}</option>
49 
+                  </select>
50 
+                </div>
51 
+              </div>
52 
+            </div>
53 
+          </div>
54 
+        </div>
55 
+      </div>
56 
+    </div>
57 
+  </div>
58 
+</template>
59 
+
60 
+<script>
61 
+import _ from "lodash";
62 
+import ItemsPerPageList from "../../assets/staticData/itemsPerPage";
63 
+import BasePagination from "../shared/basePagination.vue";
64 
+
65 
+export default {
66 
+  components: {
67 
+    BasePagination
68 
+  },
69 
+  mounted() {
70 
+    try {
71 
+      // to assign initial value to itemsPerPage
72 
+      if (this.itemsPerPageList && this.itemsPerPageList.length > 0) {
73 
+        const [startItem] = this.itemsPerPageList;
74 
+        this.visibleItemsPerPageCount = startItem;
75 
+      }
76 
+    } catch (error) {
77 
+      throw error;
78 
+    }
79 
+  },
80 
+  props: {
81 
+    items: undefined
82 
+  },
83 
+  data() {
84 
+    return {
85 
+      sortKey: "",
86 
+      reverse: false,
87 
+      searchItem: "",
88 
+      itemsPerPageList: ItemsPerPageList,
89 
+      visibleItemsPerPageCount: 0,
90 
+      currentPage: 1
91 
+    };
92 
+  },
93 
+  methods: {
94 
+    sortBy(sortKey) {
95 
+      this.reverse = this.sortKey === sortKey ? !this.reverse : false;
96 
+      this.sortKey = sortKey;
97 
+    },
98 
+    async pageChangeHandle(value) {
99 
+      console.log(value);
100 
+      switch (value) {
101 
+        case "next":
102 
+          this.currentPage += 1;
103 
+          break;
104 
+        case "previous":
105 
+          this.currentPage -= 1;
106 
+          break;
107 
+        default:
108 
+          this.currentPage = value;
109 
+      }
110 
+    },
111 
+    onChangeItemsPerPage() {
112 
+      if (this.currentPage !== 1) {
113 
+        this.currentPage = 1;
114 
+      }
115 
+    }
116 
+  },
117 
+  computed: {
118 
+    SortDirection() {
119 
+      return this.reverse ? "desc" : "asc";
120 
+    },
121 
+    PageCount() {
122 
+      return this.visibleItemsPerPageCount !== 0
123 
+        ? Math.ceil(this.FilteredItems.length / this.visibleItemsPerPageCount)
124 
+        : 1;
125 
+    },
126 
+    Columns() {
127 
+      const list = [];
128 
+      if (this.items) {
129 
+        for (const i in Object.keys(this.items)) {
130 
+          const item = this.items[i];
131 
+          for (const o in Object.keys(item)) {
132 
+            if (
133 
+              !list.includes(Object.keys(item)[o]) &&
134 
+              !Array.isArray(Object.values(item)[o])
135 
+            ) {
136 
+              list.push(Object.keys(item)[o]);
137 
+            }
138 
+          }
139 
+        }
140 
+      }
141 
+      return list;
142 
+    },
143 
+    FilteredItems() {
144 
+      const list = _.filter(this.items, item =>
145 
+        Object.values(item).some(
146 
+          i =>
147 
+            JSON.stringify(i)
148 
+              .toLowerCase()
149 
+              .indexOf(this.searchItem) > -1
150 
+        )
151 
+      );
152 
+      return _.orderBy(list, this.sortKey, this.SortDirection);
153 
+    },
154 
+    DisplayItems() {
155 
+      const list = this.FilteredItems;
156 
+      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount;
157 
+      let endSlice = this.currentPage * this.visibleItemsPerPageCount;
158 
+      if (endSlice > list.length) {
159 
+        endSlice = list.length;
160 
+      }
161 
+      return list.slice(startSlice, endSlice);
162 
+    }
163 
+  }
164 
+};
165 
+</script>
166 
+<style scoped>
167 
+th[draggable] a,
168 
+th[draggable] {
169 
+  cursor: move;
170 
+}
171 
+th[draggable] a:hover,
172 
+th[draggable] a {
173 
+  display: block;
174 
+  text-decoration: none;
175 
+  color: #333333;
176 
+}
177 
+.drag {
178 
+  background-color: rgba(0, 255, 0, 0.35);
179 
+  opacity: 0.25;
180 
+}
181 
+.dnd-drag {
182 
+  opacity: 0.25;
183 
+}
184 
+.over {
185 
+  background-color: rgba(0, 0, 255, 0.35);
186 
+}
187 
+</style>

+ 9
- 9
src/components/shared/navBar.vue Näytä tiedosto 

@@ -227,7 +227,7 @@
227 227 
 </template>
228 228
229 229 
 <script>
230 
-import { mapGetters, mapActions } from 'vuex';
230 
+import { mapGetters, mapActions } from "vuex";
231 231
232 232 
 export default {
233 233 
   data() {
 
@@ -237,23 +237,23 @@ export default {
237 237 
   },
238 238 
   computed: {
239 239 
     showLogout() {
240 
-      return this.$store.state.authentication.status === 'success';
240 
+      return this.$store.state.authentication.status === "success";
241 241 
     },
242 242 
     hideLogin() {
243 
-      return this.$store.state.authentication.status !== 'success';
243 
+      return this.$store.state.authentication.status !== "success";
244 244 
     },
245 245 
     Logout() {
246 246 
       return this.$store.state.authentication.methods.logout;
247 
-    },
247 
+    }
248 248 
   },
249 249
250 250 
   methods: {
251 
-    ...mapGetters('authentication', ['isLoggedIn']),
252 
-    ...mapActions('authentication', ['logout']),
251 
+    ...mapGetters("authentication", ["isLoggedIn"]),
252 
+    ...mapActions("authentication", ["logout"]),
253 253
254 254 
     routerGoTo(goTo) {
255 
-      this.$emit('routerGoTo', goTo);
256 
-    },
257 
-  },
255 
+      this.$emit("routerGoTo", goTo);
256 
+    }
257 
+  }
258 258 
 };
259 259 
 </script>

+ 5
- 5
src/components/shared/searchTab.vue Näytä tiedosto 

@@ -15,7 +15,7 @@
15 15 
                 type="text"
16 16 
                 class="form-control form-control-a"
17 17 
                 placeholder="Keyword"
18 
-                v-model="keyword"
18 
+                v-model="filter.keyword"
19 19 
               />
20 20 
             </div>
21 21 
           </div>
 
@@ -107,10 +107,8 @@ export default {
107 107 
   data() {
108 108 
     return {
109 109 
       selectedPropertyType: 'timeshare',
110 
-      keyword: '',
111 110 
       propertySearch: {
112 111 
         userID: 0,
113 
-        keyword: '',
114 112 
         salesType: 'Sale',
115 113 
         propertyUsageType: 'All',
116 114 
         propertyType: 'All',
 
@@ -120,7 +118,9 @@ export default {
120 118 
       },
121 119 
     };
122 120 
   },
123 
-  computed: {},
121 
+  computed: {
122 
+    ...mapState('weekList', ['filter']),
123 
+  },
124 124 
   methods: {
125 125 
     updateType(item) {
126 126 
       this.selectedPropertyType = item;
 
@@ -128,7 +128,7 @@ export default {
128 128 
     updateSearch(item) {
129 129 
       this.propertySearch = item;
130 130 
       this.propertySearch.propertyUsageType = this.selectedPropertyType;
131 
-      this.propertySearch.keyword = this.keyword;
131 
+      this.propertySearch.keyword = this.filter.keyword;
132 132 
     },
133 133 
     Search() {
134 134 
       if (this.selectedPropertyType === 'timeshare') {

+ 1
- 0
src/main.js Näytä tiedosto 

@@ -38,6 +38,7 @@ Vue.filter('toCurrency', (value) => {
38 38 
   return `R ${formatter.format(value)}`;
39 39 
 });
40 40
41 
+
41 42 
 Vue.filter('toDate', value => value.substring(0, value.length > 9 ? 10 : value.length));
42 43
43 44 
 new Vue({

+ 176
- 176
src/router/index.js Näytä tiedosto 

@@ -53,181 +53,181 @@ export default new Router({
53 53 
     };
54 54 
   },
55 55 
   routes: [{
56 
-    path: '/',
57 
-    name: 'Home',
58 
-    component: HomePage,
59 
-  },
60 
-  {
61 
-    path: '/about/us',
62 
-    name: 'aboutus',
63 
-    component: AboutUs,
64 
-  },
65 
-  {
66 
-    path: '/about/timeshare',
67 
-    name: 'abouttimeshare',
68 
-    component: AboutTimeshare,
69 
-  },
70 
-  {
71 
-    path: '/timeshare/sell',
72 
-    name: 'TimeshareSell',
73 
-    component: TimeshareSell,
74 
-  },
75 
-  {
76 
-    path: '/timeshare/buy',
77 
-    name: 'TimeshareBuy',
78 
-    component: TimeshareBuy,
79 
-  },
80 
-  {
81 
-    path: '/timeshare/faq',
82 
-    name: 'TimeshareFAQ',
83 
-    component: TimeshareFAQ,
84 
-  },
85 
-  {
86 
-    path: '/user/login',
87 
-    name: 'Login',
88 
-    component: Login,
89 
-  },
90 
-  {
91 
-    path: '/user/register',
92 
-    name: 'PrivateIndividual',
93 
-    component: PrivateIndividual,
94 
-  },
95 
-  {
96 
-    path: '/user/registeragency',
97 
-    name: 'Agency',
98 
-    component: Agency,
99 
-  },
100 
-  {
101 
-    path: '/property/property/:id',
102 
-    name: 'PropertyPage',
103 
-    component: PropertyPage,
104 
-  },
105 
-  {
106 
-    path: '/property/:propertyUsageType/search',
107 
-    name: 'PropertySearch',
108 
-    component: PropertySearch,
109 
-  },
110 
-  {
111 
-    path: '/property/search',
112 
-    name: 'PropertySearchTab',
113 
-    component: PropertySearch,
114 
-  },
115 
-  {
116 
-    path: '/property/:propType/:saleType',
117 
-    name: 'PropertyNew',
118 
-    component: PropertyEdit,
119 
-  },
120 
-  {
121 
-    path: '/property/edit/:id/:propType/:saleType',
122 
-    name: 'PropertyEdit',
123 
-    component: PropertyEdit,
124 
-  },
125 
-  {
126 
-    path: '/property/list/:propertyType/:user',
127 
-    name: 'PropertyList',
128 
-    component: PropertyList,
129 
-  },
130 
-  {
131 
-    path: '/propertyTypes/list',
132 
-    name: 'PropertyTypeList',
133 
-    component: PropertyTypeList,
134 
-  },
135 
-  {
136 
-    path: '/propertyType/new',
137 
-    name: 'PropertyTypeNew',
138 
-    component: PropertyType,
139 
-  },
140 
-  {
141 
-    path: '/propertyType/:id',
142 
-    name: 'PropertyTypeEdit',
143 
-    component: PropertyType,
144 
-  },
145 
-  {
146 
-    path: '/userDefinedGroups/list',
147 
-    name: 'UserDefinedGroupsList',
148 
-    component: UserDefinedGroups,
149 
-  },
150 
-  {
151 
-    path: '/userDefinedGroups/userDefinedGroup/:id',
152 
-    name: 'UserDefinedGroupEdit',
153 
-    component: UserDefinedGroup,
154 
-  },
155 
-  {
156 
-    path: '/userDefinedGroups/userDefinedGroup',
157 
-    name: 'UserDefinedGroupNew',
158 
-    component: UserDefinedGroup,
159 
-  },
160 
-  {
161 
-    path: '/status/list',
162 
-    name: 'StatusList',
163 
-    component: Status,
164 
-  },
165 
-  {
166 
-    path: '/status/timeshareAdmin',
167 
-    name: 'TimeshareAdmin',
168 
-    component: timeshareAdminPage,
169 
-  },
170 
-  {
171 
-    path: '/status/tenderWeekAdmin',
172 
-    name: 'TenderWeekAdmin',
173 
-    component: tenderWeekAdminPage,
174 
-  },
175 
-  {
176 
-    path: '/status/userManagementPage',
177 
-    name: 'userManagementPage',
178 
-    component: userManagementPage,
179 
-  },
180 
-  {
181 
-    path: '/status/changeLogPage',
182 
-    name: 'changeLogPage',
183 
-    component: changeLogPage,
184 
-  },
185 
-  {
186 
-    path: '/unitConfiguration/list',
187 
-    name: 'UnitConfiguration',
188 
-    component: UnitConfiguration,
189 
-  },
190 
-  {
191 
-    path: '/contactus',
192 
-    name: 'ContactUs',
193 
-    component: ContactUs,
194 
-  },
195 
-  {
196 
-    path: '/privacypolicy',
197 
-    name: 'PrivacyPolicy',
198 
-    component: PrivacyPolicy,
199 
-  },
200 
-  {
201 
-    path: '/resort/:resortCode',
202 
-    name: 'ResortPage',
203 
-    component: ResortPage,
204 
-    props: true,
205 
-  },
206 
-  {
207 
-    path: '/resort/:resortCode/:weekId',
208 
-    name: 'UnitPage',
209 
-    component: UnitPage,
210 
-    props: true,
211 
-  },
212 
-  {
213 
-    path: '/MakeOffer',
214 
-    name: 'MakeOffer',
215 
-    component: MakeOffer,
216 
-  },
217 
-  {
218 
-    path: '/Offers',
219 
-    name: 'Offers',
220 
-    component: Offer,
221 
-  },
222 
-  {
223 
-    path: '/timeshare/search',
224 
-    name: 'TimeshareSearch',
225 
-    component: TimeshareSearch,
226 
-  },
227 
-  {
228 
-    path: '/searchLog',
229 
-    name: 'SearchLog',
230 
-    component: searchLog,
231 
-  },
56 
+      path: '/',
57 
+      name: 'Home',
58 
+      component: HomePage,
59 
+    },
60 
+    {
61 
+      path: '/about/us',
62 
+      name: 'aboutus',
63 
+      component: AboutUs,
64 
+    },
65 
+    {
66 
+      path: '/about/timeshare',
67 
+      name: 'abouttimeshare',
68 
+      component: AboutTimeshare,
69 
+    },
70 
+    {
71 
+      path: '/timeshare/sell',
72 
+      name: 'TimeshareSell',
73 
+      component: TimeshareSell,
74 
+    },
75 
+    {
76 
+      path: '/timeshare/buy',
77 
+      name: 'TimeshareBuy',
78 
+      component: TimeshareBuy,
79 
+    },
80 
+    {
81 
+      path: '/timeshare/faq',
82 
+      name: 'TimeshareFAQ',
83 
+      component: TimeshareFAQ,
84 
+    },
85 
+    {
86 
+      path: '/user/login',
87 
+      name: 'Login',
88 
+      component: Login,
89 
+    },
90 
+    {
91 
+      path: '/user/register',
92 
+      name: 'PrivateIndividual',
93 
+      component: PrivateIndividual,
94 
+    },
95 
+    {
96 
+      path: '/user/registeragency',
97 
+      name: 'Agency',
98 
+      component: Agency,
99 
+    },
100 
+    {
101 
+      path: '/property/property/:id',
102 
+      name: 'PropertyPage',
103 
+      component: PropertyPage,
104 
+    },
105 
+    {
106 
+      path: '/property/:propertyUsageType/search',
107 
+      name: 'PropertySearch',
108 
+      component: PropertySearch,
109 
+    },
110 
+    {
111 
+      path: '/property/search',
112 
+      name: 'PropertySearchTab',
113 
+      component: PropertySearch,
114 
+    },
115 
+    {
116 
+      path: '/property/:propType/:saleType',
117 
+      name: 'PropertyNew',
118 
+      component: PropertyEdit,
119 
+    },
120 
+    {
121 
+      path: '/property/edit/:id/:propType/:saleType',
122 
+      name: 'PropertyEdit',
123 
+      component: PropertyEdit,
124 
+    },
125 
+    {
126 
+      path: '/property/list/:propertyType/:user',
127 
+      name: 'PropertyList',
128 
+      component: PropertyList,
129 
+    },
130 
+    {
131 
+      path: '/propertyTypes/list',
132 
+      name: 'PropertyTypeList',
133 
+      component: PropertyTypeList,
134 
+    },
135 
+    {
136 
+      path: '/propertyType/new',
137 
+      name: 'PropertyTypeNew',
138 
+      component: PropertyType,
139 
+    },
140 
+    {
141 
+      path: '/propertyType/:id',
142 
+      name: 'PropertyTypeEdit',
143 
+      component: PropertyType,
144 
+    },
145 
+    {
146 
+      path: '/userDefinedGroups/list',
147 
+      name: 'UserDefinedGroupsList',
148 
+      component: UserDefinedGroups,
149 
+    },
150 
+    {
151 
+      path: '/userDefinedGroups/userDefinedGroup/:id',
152 
+      name: 'UserDefinedGroupEdit',
153 
+      component: UserDefinedGroup,
154 
+    },
155 
+    {
156 
+      path: '/userDefinedGroups/userDefinedGroup',
157 
+      name: 'UserDefinedGroupNew',
158 
+      component: UserDefinedGroup,
159 
+    },
160 
+    {
161 
+      path: '/status/list',
162 
+      name: 'StatusList',
163 
+      component: Status,
164 
+    },
165 
+    {
166 
+      path: '/status/timeshareAdmin',
167 
+      name: 'TimeshareAdmin',
168 
+      component: timeshareAdminPage,
169 
+    },
170 
+    {
171 
+      path: '/status/tenderWeekAdmin',
172 
+      name: 'TenderWeekAdmin',
173 
+      component: tenderWeekAdminPage,
174 
+    },
175 
+    {
176 
+      path: '/status/userManagementPage',
177 
+      name: 'userManagementPage',
178 
+      component: userManagementPage,
179 
+    },
180 
+    {
181 
+      path: '/status/changeLogPage',
182 
+      name: 'changeLogPage',
183 
+      component: changeLogPage,
184 
+    },
185 
+    {
186 
+      path: '/unitConfiguration/list',
187 
+      name: 'UnitConfiguration',
188 
+      component: UnitConfiguration,
189 
+    },
190 
+    {
191 
+      path: '/contactus',
192 
+      name: 'ContactUs',
193 
+      component: ContactUs,
194 
+    },
195 
+    {
196 
+      path: '/privacypolicy',
197 
+      name: 'PrivacyPolicy',
198 
+      component: PrivacyPolicy,
199 
+    },
200 
+    {
201 
+      path: '/resort/:resortCode',
202 
+      name: 'ResortPage',
203 
+      component: ResortPage,
204 
+      props: true,
205 
+    },
206 
+    {
207 
+      path: '/resort/:resortCode/:weekId',
208 
+      name: 'UnitPage',
209 
+      component: UnitPage,
210 
+      props: true,
211 
+    },
212 
+    {
213 
+      path: '/MakeOffer',
214 
+      name: 'MakeOffer',
215 
+      component: MakeOffer,
216 
+    },
217 
+    {
218 
+      path: '/Offers',
219 
+      name: 'Offers',
220 
+      component: Offer,
221 
+    },
222 
+    {
223 
+      path: '/timeshare/search',
224 
+      name: 'TimeshareSearch',
225 
+      component: TimeshareSearch,
226 
+    },
227 
+    {
228 
+      path: '/searchLog',
229 
+      name: 'SearchLog',
230 
+      component: searchLog,
231 
+    },
232 232 
   ],
233 233 
 });

+ 16
- 0
src/store/modules/timeshare/weekList.js Näytä tiedosto 

@@ -15,6 +15,7 @@ export default {
15 15 
       date: undefined,
16 16 
       minPrice: undefined,
17 17 
       maxPrice: undefined,
18 
+      keyword: null,
18 19 
     },
19 20 
   },
20 21 
   mutations: {
 
@@ -39,6 +40,21 @@ export default {
39 40 
       } = state;
40 41 
       // console.log(JSON.stringify(weekList));
41 42 
       if (filter) {
43 
+        if (filter.keyword) {
44 
+          const list = [];
45 
+          for (const i in weekList) {
46 
+            const item = weekList[i];
47 
+            for (const r in item) {
48 
+              const innerItem = item[r];
49 
+              if (innerItem && JSON.stringify(innerItem).toLowerCase().includes(filter.keyword
50 
+                .toLowerCase())) {
51 
+                list.push(item);
52 
+                break;
53 
+              }
54 
+            }
55 
+          }
56 
+          weekList = list;
57 
+        }
42 58 
         if (filter.region) {
43 59 
           weekList = _.filter(weekList, x => x.region && x.region.regionCode === filter.region
44 60 
             .regionCode);

+ 1
- 1
vue.config.js Näytä tiedosto 

@@ -2,7 +2,7 @@ module.exports = {
2 2 
   devServer: {
3 3 
     proxy: {
4 4 
       '/api': {
5 
-        target: 'http://localhost:57260',
5 
+        target: 'http://192.168.6.188:5000',
6 6 
         changeOrigin: true,
7 7 
       },
8 8 
     },

Write Preview
Loading…
Peruuta
Tallenna