Lene 4 years ago
parent
commit
88f5b3a453
37 changed files with 1492 additions and 313 deletions
  1. 5
    0
      package-lock.json
  2. 1
    0
      package.json
  3. BIN
      public/img/icons/Download-grey.png
  4. BIN
      public/img/icons/Download.png
  5. BIN
      public/img/icons/Edit.png
  6. BIN
      public/img/icons/Upload.png
  7. BIN
      public/img/icons/delete.png
  8. 22
    0
      src/components/admin/fees/feesPage.vue
  9. 53
    0
      src/components/admin/fees/listingFee.vue
  10. 19
    0
      src/components/admin/property/propertyAdmin.vue
  11. 177
    0
      src/components/admin/property/propertyList.vue
  12. 27
    25
      src/components/admin/property/userDefinedGroupPage.vue
  13. 6
    32
      src/components/misc/bondCaclculator.vue
  14. 1
    1
      src/components/property/ListProperty/contentSection.vue
  15. 4
    1
      src/components/property/commercial/commercialSearchResults.vue
  16. 162
    27
      src/components/property/commercial/createProperty/commercialCreateNew.vue
  17. 8
    2
      src/components/property/commercial/singleView/contentSection.vue
  18. 459
    0
      src/components/property/editProperty/editProperty.vue
  19. 26
    13
      src/components/property/mapSection.vue
  20. 11
    3
      src/components/property/propertyCard.vue
  21. 18
    7
      src/components/property/propertyImage.vue
  22. 20
    10
      src/components/property/propertyUserField.vue
  23. 39
    41
      src/components/property/residential/createProperty/residentialCreate.vue
  24. 157
    35
      src/components/property/residential/createProperty/residentialCreateNew.vue
  25. 11
    36
      src/components/property/residential/singleView/contentSection.vue
  26. 92
    11
      src/components/shared/navBar.vue
  27. 4
    3
      src/components/timeshare/resort/unit/summarySection.vue
  28. 6
    2
      src/components/timeshare/sell/carouselSection.vue
  29. 3
    1
      src/components/timeshare/sell/contentSection.vue
  30. 9
    3
      src/main.js
  31. 12
    6
      src/router/index.js
  32. 2
    0
      src/store/index.js
  33. 28
    0
      src/store/modules/financial/fees.js
  34. 41
    4
      src/store/modules/property/property.js
  35. 33
    33
      src/store/modules/property/propertyAdmin.js
  36. 35
    16
      src/store/modules/property/propertyLists.js
  37. 1
    1
      src/store/modules/property/propertySearch.js

+ 5
- 0
package-lock.json View File

12315
       "integrity": "sha512-TigfiZUs7SN3Z6uxKilqJUtYxte8vp0F4QxabCli6hkKPqU97JzAZc3P7AL6omkRAd2DMI26fOrIGjuALTvXww==",
12315
       "integrity": "sha512-TigfiZUs7SN3Z6uxKilqJUtYxte8vp0F4QxabCli6hkKPqU97JzAZc3P7AL6omkRAd2DMI26fOrIGjuALTvXww==",
12316
       "dev": true
12316
       "dev": true
12317
     },
12317
     },
12318
+    "vue-currency-input": {
12319
+      "version": "1.22.3",
12320
+      "resolved": "https://registry.npmjs.org/vue-currency-input/-/vue-currency-input-1.22.3.tgz",
12321
+      "integrity": "sha512-vrOaaiCSG8Hh7Fw7CYROIymFvVprWKaze3h67sihqJ4QAI9F+YElTQYv0fJwFK1NkKUS8H/MvAL0mwg9qrUfgg=="
12322
+    },
12318
     "vue-disable-autocomplete": {
12323
     "vue-disable-autocomplete": {
12319
       "version": "0.0.4",
12324
       "version": "0.0.4",
12320
       "resolved": "https://registry.npmjs.org/vue-disable-autocomplete/-/vue-disable-autocomplete-0.0.4.tgz",
12325
       "resolved": "https://registry.npmjs.org/vue-disable-autocomplete/-/vue-disable-autocomplete-0.0.4.tgz",

+ 1
- 0
package.json View File

28
     "v-file-upload": "^3.1.7",
28
     "v-file-upload": "^3.1.7",
29
     "vue": "^2.6.11",
29
     "vue": "^2.6.11",
30
     "vue-carousel": "^0.18.0",
30
     "vue-carousel": "^0.18.0",
31
+    "vue-currency-input": "^1.22.3",
31
     "vue-disable-autocomplete": "0.0.4",
32
     "vue-disable-autocomplete": "0.0.4",
32
     "vue-eva-icons": "^1.1.1",
33
     "vue-eva-icons": "^1.1.1",
33
     "vue-js-modal": "^1.3.33",
34
     "vue-js-modal": "^1.3.33",

BIN
public/img/icons/Download-grey.png View File


BIN
public/img/icons/Download.png View File


BIN
public/img/icons/Edit.png View File


BIN
public/img/icons/Upload.png View File


BIN
public/img/icons/delete.png View File


+ 22
- 0
src/components/admin/fees/feesPage.vue View File

1
+<template>
2
+  <main id="main" style="padding-top:50px; padding-bottom:100px">
3
+    <div class="container">
4
+      <div class="section-header">
5
+        <h2>Fees</h2>
6
+      </div>
7
+      <listingFee />
8
+    </div>
9
+  </main>
10
+</template>
11
+
12
+<script>
13
+/* eslint-disable */
14
+import listingFee from "./listingFee";
15
+export default {
16
+  components: {
17
+    listingFee
18
+  }
19
+};
20
+</script>
21
+
22
+<style lang="scss" scoped></style>

+ 53
- 0
src/components/admin/fees/listingFee.vue View File

1
+<template>
2
+  <section id="content">
3
+    <label for="fee" class="uniLabel">LISTING FEE</label>
4
+    <currency-input
5
+      onClick="this.setSelectionRange(0, this.value.length)"
6
+      name="fee"
7
+      :value="value"
8
+      @input="value = $event"
9
+      v-model="fee"
10
+      id="price"
11
+      class="form-control uniInput"
12
+    />
13
+    <button @click="saveListingFee" class="btn-solid-blue mt-4">Save</button>
14
+  </section>
15
+</template>
16
+
17
+<script>
18
+/* eslint-disable */
19
+import { mapActions, mapGetters, mapState } from "vuex";
20
+export default {
21
+  data() {
22
+    return {
23
+      fee: 0.0
24
+    };
25
+  },
26
+  mounted() {
27
+    this.pullListingFee();
28
+  },
29
+  methods: {
30
+    ...mapActions("fees", ["retrieveListingFee", "setListingFee"]),
31
+    saveListingFee() {
32
+      var feeObj = {
33
+        amount: parseFloat(this.fee),
34
+        name: "Listing Fee"
35
+      };
36
+
37
+      this.setListingFee(feeObj);
38
+    },
39
+    async pullListingFee() {
40
+      await this.retrieveListingFee();
41
+      console.log(this.getListingFee);
42
+
43
+      this.fee = this.getListingFee.amount;
44
+    }
45
+  },
46
+  computed: {
47
+    ...mapGetters("fees", ["getListingFee"]),
48
+    ...mapState("fees", ["listingFee"])
49
+  }
50
+};
51
+</script>
52
+
53
+<style lang="scss" scoped></style>

+ 19
- 0
src/components/admin/property/propertyAdmin.vue View File

1
+<template>
2
+  <div>
3
+    <main id="main">
4
+      <propertyList />
5
+    </main>
6
+  </div>
7
+</template>
8
+
9
+<script>
10
+/* eslint-disable */
11
+import propertyList from "./propertyList";
12
+export default {
13
+  components: {
14
+    propertyList
15
+  }
16
+};
17
+</script>
18
+
19
+<style lang="scss" scoped></style>

+ 177
- 0
src/components/admin/property/propertyList.vue View File

1
+<template>
2
+  <section id="contact2">
3
+    <div class="container">
4
+      <div class="section-header">
5
+        <h1>Property Admin</h1>
6
+      </div>
7
+      <div class="row">
8
+        <div class="col-lg-6 offset-3">
9
+          <input class="form-control uniSelect" type="text" placeholder="SEARCH" v-model="filter" />
10
+        </div>
11
+      </div>
12
+      <div class="row">
13
+        <br />
14
+      </div>
15
+      <div class="row">
16
+        <div class="col-lg-12">
17
+          <table class="table table-striped table-responsive">
18
+            <thead>
19
+              <tr>
20
+                <th scope="col">Owner</th>
21
+                <th scope="col">Reference</th>
22
+                <th scope="col">Property</th>
23
+                <th scope="col">Unit</th>
24
+                <th scope="col">Size</th>
25
+                <th scope="col">Price Ex VAT</th>
26
+                <th scope="col">Region</th>
27
+                <th scope="col">Town</th>
28
+                <th scope="col">Suburb</th>
29
+                <th scope="col">Status</th>
30
+                <th scope="col">Type</th>
31
+                <th scope="col">Publish</th>
32
+                <th scope="col">Edit</th>
33
+                <th scope="col">Delete</th>
34
+              </tr>
35
+            </thead>
36
+            <tbody>
37
+              <tr v-for="(item, i) in FilteredProperties" :key="i">
38
+                <td>{{ item.owner }}</td>
39
+                <td>{{ item.reference }}</td>
40
+                <td>{{ item.property }}</td>
41
+                <td>{{ item.unit }}</td>
42
+                <td>{{ item.size }}</td>
43
+                <td>{{ item.price | toCurrency }}</td>
44
+                <td>{{ item.region }}</td>
45
+                <td>{{ item.town }}</td>
46
+                <td>{{ item.suburb }}</td>
47
+                <td>{{ item.status }}</td>
48
+                <td>{{ item.type }}</td>
49
+                <td v-if="!item.isPublished">
50
+                  <a v-on:click="Publish(item)">
51
+                    <img src="../../../../public/img/icons/Upload.png" height="25" width="25" />
52
+                  </a>
53
+                </td>
54
+                <td v-else>
55
+                  <a v-on:click="Unpublish(item)">
56
+                    <img
57
+                      src="../../../../public/img/icons/Download-grey.png"
58
+                      height="25"
59
+                      width="25"
60
+                    />
61
+                  </a>
62
+                </td>
63
+                <td>
64
+                  <a v-on:click="Edit(item)">
65
+                    <img src="../../../../public/img/icons/Edit.png" height="25" width="25" />
66
+                  </a>
67
+                </td>
68
+                <td>
69
+                  <a v-on:click="Delete(item)">
70
+                    <img src="../../../../public/img/icons/delete.png" height="25" width="25" />
71
+                  </a>
72
+                </td>
73
+              </tr>
74
+            </tbody>
75
+          </table>
76
+        </div>
77
+      </div>
78
+      <div v-if="wait" id="preloader"></div>
79
+    </div>
80
+  </section>
81
+</template>
82
+
83
+<script>
84
+import { mapState, mapActions } from "vuex";
85
+import Log from "../../../assets/Log";
86
+import _ from "lodash";
87
+
88
+export default {
89
+  data() {
90
+    return {
91
+      filter: undefined,
92
+      userId: Log.getUser().id,
93
+      wait: true,
94
+    };
95
+  },
96
+  methods: {
97
+    ...mapActions("propertyList", [
98
+      "getAdminProperties",
99
+      "deleteProperty",
100
+      "publishProperty",
101
+      "unpublishProperty",
102
+    ]),
103
+    Publish(item) {
104
+      this.publishProperty(item);
105
+    },
106
+    Unpublish(item) {
107
+      this.unpublishProperty(item);
108
+    },
109
+    Edit(item) {
110
+      this.$router.push(`/property/edit/${item.id}`);
111
+    },
112
+    Delete(item) {
113
+      this.deleteProperty(item.id);
114
+    },
115
+  },
116
+  computed: {
117
+    ...mapState("propertyList", ["properties"]),
118
+    FilteredProperties() {
119
+      if (this.filter) {
120
+        const list = _.filter(this.properties, (item) =>
121
+          Object.values(item).some(
122
+            (i) =>
123
+              JSON.stringify(i)
124
+                .toLowerCase()
125
+                .indexOf(this.filter.toLowerCase()) > -1
126
+          )
127
+        );
128
+        return list;
129
+      } else {
130
+        return this.properties;
131
+      }
132
+    },
133
+  },
134
+  mounted() {
135
+    this.wait = true;
136
+    this.getAdminProperties(this.userId).then((fulfuilled) => {
137
+      this.wait = false;
138
+    });
139
+  },
140
+};
141
+</script>
142
+
143
+<style lang="scss" scoped>
144
+.refbyAgent {
145
+  will-change: transform;
146
+  transition: height 500ms;
147
+  height: 0px;
148
+}
149
+
150
+.refbyAgent--clicked {
151
+  height: 150px;
152
+}
153
+
154
+.spacebanked1 {
155
+  will-change: transform;
156
+  transition: height 500ms;
157
+  height: 0px;
158
+}
159
+
160
+.spacebanked1--clicked {
161
+  height: 150px;
162
+}
163
+
164
+.custom-file-label {
165
+  border-width: 2px;
166
+  border-color: rgb(27, 117, 187);
167
+  margin-bottom: 20px;
168
+}
169
+
170
+.custom-file-label::after {
171
+  border-left: none;
172
+  border-bottom: solid;
173
+  border-width: 2px;
174
+  border-color: rgb(27, 117, 187);
175
+  font-family: "Muli";
176
+}
177
+</style>

+ 27
- 25
src/components/admin/property/userDefinedGroupPage.vue View File

124
 </template>
124
 </template>
125
 
125
 
126
 <script>
126
 <script>
127
-import { mapState, mapActions } from 'vuex';
128
-import userFields from './userDefinedField.vue';
129
-import listView from '../../shared/listView.vue';
127
+import { mapState, mapActions } from "vuex";
128
+import userFields from "./userDefinedField.vue";
129
+import listView from "../../shared/listView.vue";
130
 
130
 
131
 export default {
131
 export default {
132
-  name: 'UserDefinedGroup',
132
+  name: "UserDefinedGroup",
133
   components: {
133
   components: {
134
     userFields,
134
     userFields,
135
-    listView,
135
+    listView
136
   },
136
   },
137
   data() {
137
   data() {
138
     return {
138
     return {
139
       item: {},
139
       item: {},
140
       showField: false,
140
       showField: false,
141
-      columns: ['fieldName', 'fieldType', 'rank'],
141
+      columns: ["fieldName", "fieldType", "rank"]
142
     };
142
     };
143
   },
143
   },
144
   mounted() {
144
   mounted() {
151
     }
151
     }
152
   },
152
   },
153
   computed: {
153
   computed: {
154
-    ...mapState('propertyAdmin', ['userDefinedGroup', 'userFields', 'userField']),
154
+    ...mapState("propertyAdmin", ["userDefinedGroup", "userFields", "userField"])
155
   },
155
   },
156
   methods: {
156
   methods: {
157
-    ...mapActions('propertyAdmin', [
158
-      'getUserDefinedGroup',
159
-      'getUserFields',
160
-      'saveUserDefinedGroup',
161
-      'updateUserDefinedGroup',
162
-      'clearUserGroup',
163
-      'clearUserFields',
164
-      'clearUserField',
165
-      'saveUserField',
166
-      'updateUserField',
167
-      'deleteUserField',
157
+    ...mapActions("propertyAdmin", [
158
+      "getUserDefinedGroup",
159
+      "getUserFields",
160
+      "saveUserDefinedGroup",
161
+      "updateUserDefinedGroup",
162
+      "clearUserGroup",
163
+      "clearUserFields",
164
+      "clearUserField",
165
+      "saveUserField",
166
+      "updateUserField",
167
+      "deleteUserField"
168
     ]),
168
     ]),
169
     SubmitData() {
169
     SubmitData() {
170
       this.userDefinedGroup.fields = [];
170
       this.userDefinedGroup.fields = [];
171
       let reload = false;
171
       let reload = false;
172
       if (this.$route.params.id > 0) {
172
       if (this.$route.params.id > 0) {
173
         this.updateUserDefinedGroup(this.userDefinedGroup);
173
         this.updateUserDefinedGroup(this.userDefinedGroup);
174
-        this.userFields.forEach((fieldData) => {
174
+        this.userFields.forEach(fieldData => {
175
           if (fieldData.id === 0) {
175
           if (fieldData.id === 0) {
176
             fieldData.groupId = this.userDefinedGroup.id;
176
             fieldData.groupId = this.userDefinedGroup.id;
177
             this.saveUserField(fieldData);
177
             this.saveUserField(fieldData);
181
         });
181
         });
182
       } else {
182
       } else {
183
         reload = true;
183
         reload = true;
184
-        this.userFields.forEach((fieldData) => {
184
+        this.userFields.forEach(fieldData => {
185
           this.userDefinedGroup.fields.push({
185
           this.userDefinedGroup.fields.push({
186
             fieldName: fieldData.fieldName,
186
             fieldName: fieldData.fieldName,
187
             fieldType: fieldData.fieldType,
187
             fieldType: fieldData.fieldType,
188
-            rank: fieldData.rank,
188
+            rank: fieldData.rank
189
           });
189
           });
190
         });
190
         });
191
         this.saveUserDefinedGroup(this.userDefinedGroup);
191
         this.saveUserDefinedGroup(this.userDefinedGroup);
192
       }
192
       }
193
-      this.$router.push('/userDefinedGroups/list');
193
+      this.$router.push("/userDefinedGroups/list");
194
       // this.$router.push({
194
       // this.$router.push({
195
       //   path: '/userDefinedGroups/list',
195
       //   path: '/userDefinedGroups/list',
196
       //   query: { reload },
196
       //   query: { reload },
207
       this.showField = true;
207
       this.showField = true;
208
     },
208
     },
209
     Close() {
209
     Close() {
210
-      this.$router.push('/userDefinedGroups/list');
210
+      this.$router.push("/userDefinedGroups/list");
211
     },
211
     },
212
     UpdateUserField(item) {
212
     UpdateUserField(item) {
213
       if (item.id === 0) {
213
       if (item.id === 0) {
216
       this.showField = false;
216
       this.showField = false;
217
     },
217
     },
218
     Delete(item) {
218
     Delete(item) {
219
+      console.log(item);
220
+
219
       if (item.id === 0) {
221
       if (item.id === 0) {
220
         this.userFields.pop(this.userFields.find(p => p.id === item.id));
222
         this.userFields.pop(this.userFields.find(p => p.id === item.id));
221
       } else {
223
       } else {
222
         this.deleteUserField(item.id);
224
         this.deleteUserField(item.id);
223
       }
225
       }
224
-    },
225
-  },
226
+    }
227
+  }
226
 };
228
 };
227
 </script>
229
 </script>

+ 6
- 32
src/components/misc/bondCaclculator.vue View File

6
       type="text"
6
       type="text"
7
       class="form-control mb-2"
7
       class="form-control mb-2"
8
       name="income"
8
       name="income"
9
+      v-currency="{ currency: ['ZAR', null, { prefix: 'R' }][2] }"
9
       id="gross-income"
10
       id="gross-income"
10
       placeholder="Gross Monthly Household Income"
11
       placeholder="Gross Monthly Household Income"
11
       v-model="amount"
12
       v-model="amount"
12
-      @input="displayValue()"
13
     />
13
     />
14
     <input
14
     <input
15
       type="text"
15
       type="text"
16
       class="form-control mb-2"
16
       class="form-control mb-2"
17
       name="deposit"
17
       name="deposit"
18
+      v-currency="{ currency: ['ZAR', null, { prefix: 'R' }][2] }"
18
       id="deposit"
19
       id="deposit"
19
       placeholder="Deposit Amount – May be Required"
20
       placeholder="Deposit Amount – May be Required"
20
       v-model="deposit"
21
       v-model="deposit"
21
-      @input="displayDeposit()"
22
     />
22
     />
23
     <div class="slidecontainer mt-4">
23
     <div class="slidecontainer mt-4">
24
       <input type="range" min="5" max="30" value="10" class="slider" id="myRange" v-model="term" />
24
       <input type="range" min="5" max="30" value="10" class="slider" id="myRange" v-model="term" />
60
 export default {
60
 export default {
61
   data() {
61
   data() {
62
     return {
62
     return {
63
-      amount: "R1000000",
64
-      deposit: "R0",
63
+      amount: 1000000,
64
+      deposit: 0,
65
       term: 10,
65
       term: 10,
66
       rate: 7,
66
       rate: 7,
67
       isInputActive: false
67
       isInputActive: false
70
   props: ["value"],
70
   props: ["value"],
71
   methods: {
71
   methods: {
72
     calculate() {
72
     calculate() {
73
-      var rate = this.calcRate();
73
+      var rate = this.rate / 100 / 12;
74
       var years = this.term * 12;
74
       var years = this.term * 12;
75
       var topPart = rate * Math.pow(1 + rate, years);
75
       var topPart = rate * Math.pow(1 + rate, years);
76
       var bottomPart = Math.pow(1 + rate, years) - 1;
76
       var bottomPart = Math.pow(1 + rate, years) - 1;
77
       var netAmnt = this.amount - this.deposit;
77
       var netAmnt = this.amount - this.deposit;
78
       var bond = (netAmnt * topPart) / bottomPart;
78
       var bond = (netAmnt * topPart) / bottomPart;
79
-    },
80
-    calcRate() {
81
-      var answer = this.rate / 100 / 12;
82
-      return answer;
83
-    },
84
-    displayValue() {
85
-      const formatter = new Intl.NumberFormat("en-US", {
86
-        minimumFractionDigits: 2
87
-      });
88
-      if (this.amount.charAt(0) !== "R") {
89
-        this.amount = "R" + formatter.format(this.amount);
90
-        if (this.amount < 1) {
91
-          this.amount = "R" + 0;
92
-        }
93
-      }
94
-    },
95
-    displayDeposit() {
96
-      if (this.deposit.charAt(0) !== "R") {
97
-        if (this.deposit < 1) {
98
-          this.deposit = "R" + 0;
99
-        }
100
-      }
101
     }
79
     }
102
   },
80
   },
103
   computed: {
81
   computed: {
107
       var topPart = rate * Math.pow(1 + rate, years);
85
       var topPart = rate * Math.pow(1 + rate, years);
108
       var bottomPart = Math.pow(1 + rate, years) - 1;
86
       var bottomPart = Math.pow(1 + rate, years) - 1;
109
 
87
 
110
-      var netAmnt = parseFloat(this.amount.substring(1)) - parseFloat(this.deposit.substring(1));
88
+      var netAmnt = parseFloat(this.amount) - parseFloat(this.deposit);
111
       var bond = (netAmnt * topPart) / bottomPart;
89
       var bond = (netAmnt * topPart) / bottomPart;
112
       if (isNaN(bond)) {
90
       if (isNaN(bond)) {
113
         return 0;
91
         return 0;
115
         return bond;
93
         return bond;
116
       }
94
       }
117
     },
95
     },
118
-    calcRate() {
119
-      var answer = this.rate / 100 / 12;
120
-      return answer;
121
-    },
122
     grossIncome() {
96
     grossIncome() {
123
       return this.totalMonthlyPayment * 3.335120643;
97
       return this.totalMonthlyPayment * 3.335120643;
124
     }
98
     }

+ 1
- 1
src/components/property/ListProperty/contentSection.vue View File

9
         <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
9
         <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
10
           <li class="nav-item">
10
           <li class="nav-item">
11
             <a
11
             <a
12
-              class="nav-link btn-solid-blue"
12
+              class="nav-link btn-solid-blue active"
13
               id="pills-residential-tab"
13
               id="pills-residential-tab"
14
               data-toggle="pill"
14
               data-toggle="pill"
15
               href="#pills-residential"
15
               href="#pills-residential"

+ 4
- 1
src/components/property/commercial/commercialSearchResults.vue View File

17
               <div class="portfolio-item">
17
               <div class="portfolio-item">
18
                 <img style="width:255px; height:255px" :src="currentProperty.displayImage" alt />
18
                 <img style="width:255px; height:255px" :src="currentProperty.displayImage" alt />
19
                 <h4>{{ currentProperty.displayPrice }}</h4>
19
                 <h4>{{ currentProperty.displayPrice }}</h4>
20
-                <p>Address | 00m</p>
20
+                <p>
21
+                  {{ currentProperty.suburb }}, {{ currentProperty.city }} |
22
+                  {{ currentProperty.area }}M<sup>2</sup>
23
+                </p>
21
                 <p>{{ currentProperty.shortDescription }}</p>
24
                 <p>{{ currentProperty.shortDescription }}</p>
22
                 <br />
25
                 <br />
23
 
26
 

+ 162
- 27
src/components/property/commercial/createProperty/commercialCreateNew.vue View File

84
                     >{{ salesType }} Price</label
84
                     >{{ salesType }} Price</label
85
                   >
85
                   >
86
                 </div>
86
                 </div>
87
-                <input
88
-                  class="form-control uniInput"
89
-                  type="number"
87
+                <currency-input
88
+                  onClick="this.setSelectionRange(0, this.value.length)"
90
                   name="price"
89
                   name="price"
91
-                  id="price"
90
+                  :value="value"
91
+                  @input="value = $event"
92
                   v-model="property.price"
92
                   v-model="property.price"
93
+                  id="price"
94
+                  class="form-control uniInput"
93
                 />
95
                 />
94
               </div>
96
               </div>
95
               <div v-if="salesType === 'Rental'" class="col-md-6">
97
               <div v-if="salesType === 'Rental'" class="col-md-6">
115
                 />
117
                 />
116
               </div>
118
               </div>
117
             </div>
119
             </div>
118
-            <div class="row">
120
+            <div class="row my-3">
121
+              <br />
122
+            </div>
123
+            <div class="row my-3">
124
+              <div class="col-md-12">
125
+                <div v-if="!property.streetNumber">
126
+                  <label for="streetNumber" class="uniSelectLabel">STREET NUMBER</label>
127
+                </div>
128
+                <input
129
+                  class="form-control uniInput"
130
+                  type="text"
131
+                  name="streetNumber"
132
+                  id="unit"
133
+                  v-model="property.streetNumber"
134
+                  disabled
135
+                />
136
+              </div>
137
+            </div>
138
+            <div class="row my-3">
139
+              <div class="col-md-12">
140
+                <div v-if="!property.streetName">
141
+                  <label for="streetName" class="uniSelectLabel">STREET NAME</label>
142
+                </div>
143
+                <input
144
+                  class="form-control uniInput"
145
+                  type="text"
146
+                  name="streetName"
147
+                  id="unit"
148
+                  v-model="property.streetName"
149
+                  disabled
150
+                />
151
+              </div>
152
+            </div>
153
+            <div class="row my-3">
154
+              <div class="col-md-12">
155
+                <div v-if="!property.suburb">
156
+                  <label for="suburb" class="uniSelectLabel">SUBURB</label>
157
+                </div>
158
+                <input
159
+                  class="form-control uniInput"
160
+                  type="text"
161
+                  name="suburb"
162
+                  id="unit"
163
+                  v-model="property.suburb"
164
+                  disabled
165
+                />
166
+              </div>
167
+            </div>
168
+            <div class="row my-3">
169
+              <div class="col-md-12">
170
+                <div v-if="!property.city">
171
+                  <label for="city" class="uniSelectLabel">CITY</label>
172
+                </div>
173
+                <input
174
+                  class="form-control uniInput"
175
+                  type="text"
176
+                  name="city"
177
+                  id="unit"
178
+                  v-model="property.city"
179
+                  disabled
180
+                />
181
+              </div>
182
+            </div>
183
+            <div class="row my-3">
184
+              <div class="col-md-12">
185
+                <div v-if="!property.province">
186
+                  <label for="province" class="uniSelectLabel">PROVINCE</label>
187
+                </div>
188
+                <input
189
+                  class="form-control uniInput"
190
+                  type="text"
191
+                  name="province"
192
+                  id="unit"
193
+                  v-model="property.province"
194
+                  disabled
195
+                />
196
+              </div>
197
+            </div>
198
+            <div class="row my-3">
119
               <div class="col-md-12">
199
               <div class="col-md-12">
120
-                <label for="Property Description" style="font-family:'muli'">Description:</label>
121
-                <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
122
-                <br />
123
-                <p>
124
-                  * A listing fee of R380 including VAT is payable to list your Property on the
125
-                  Uni-Vate website
126
-                </p>
200
+                <div v-if="!property.postalCode">
201
+                  <label for="postalCode" class="uniSelectLabel">POSTAL CODE</label>
202
+                </div>
203
+                <input
204
+                  class="form-control uniInput"
205
+                  type="text"
206
+                  name="postalCode"
207
+                  id="unit"
208
+                  v-model="property.postalCode"
209
+                  disabled
210
+                />
211
+              </div>
212
+            </div>
213
+            <div class="row my-3">
214
+              <div class="col-md-12">
215
+                <div v-if="!property.country">
216
+                  <label for="country" class="uniSelectLabel">COUNTRY</label>
217
+                </div>
218
+                <input
219
+                  class="form-control uniInput"
220
+                  type="text"
221
+                  name="country"
222
+                  id="unit"
223
+                  v-model="property.country"
224
+                  disabled
225
+                />
226
+              </div>
227
+            </div>
228
+            <div class="row my-3">
229
+              <div class="col-md-12">
230
+                <button type="button" @click="clearAddress()" class="btn-solid-blue">
231
+                  Clear Address
232
+                </button>
127
               </div>
233
               </div>
128
             </div>
234
             </div>
129
           </div>
235
           </div>
130
         </div>
236
         </div>
131
-        <div class="row" />
132
-
237
+        <div class="row">
238
+          <div class="col-md-12">
239
+            <label for="Property Description" style="font-family:'muli'">Description:</label>
240
+            <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
241
+            <br />
242
+            <p>
243
+              * A listing fee of R{{ getListingFee.amount }} including VAT is payable to list your
244
+              Property on the Uni-Vate website
245
+            </p>
246
+          </div>
247
+        </div>
133
         <div class="section-header">
248
         <div class="section-header">
134
           <h2>Property Information</h2>
249
           <h2>Property Information</h2>
135
         </div>
250
         </div>
136
-        <div class="row mb-3" v-for="item in propertyFields" :key="item.id">
137
-          <div class="col-md-6" v-for="field in item.fields" :key="field.id">
138
-            <div v-if="field.type === 'number'">
139
-              {{ field.name }}
140
-              <input type="number" class="form-control uniInput" v-model="field.value" />
141
-            </div>
142
-            <div v-else class="display:none"></div>
143
-            <div v-if="field.type === 'yesno'">
144
-              {{ field.name }}
145
-              <input type="checkbox" v-model="field.value" />
146
-            </div>
251
+        <div v-for="item in propertyFields" :key="item.id">
252
+          <div v-if="item.name === 'Commercial Fields'">
253
+            <UserField
254
+              :fields="item.fields"
255
+              :id="item.name"
256
+              @UpdateUserDefinedFields="UpdateUserDefinedFields"
257
+              :fieldValues="item.fields"
258
+            />
147
           </div>
259
           </div>
148
         </div>
260
         </div>
149
         <div class="row">
261
         <div class="row">
211
 
323
 
212
 <script>
324
 <script>
213
 /* eslint-disable */
325
 /* eslint-disable */
214
-import { mapState, mapActions } from "vuex";
326
+import { mapState, mapActions, mapGetters } from "vuex";
215
 import { VueEditor } from "vue2-editor";
327
 import { VueEditor } from "vue2-editor";
216
 import UserField from "../../propertyUserField.vue";
328
 import UserField from "../../propertyUserField.vue";
217
 import ImageLoad from "../../propertyImage.vue";
329
 import ImageLoad from "../../propertyImage.vue";
319
         this.property.userId = this.user.id;
431
         this.property.userId = this.user.id;
320
       }
432
       }
321
 
433
 
434
+      this.property.propertyUserFields.forEach(item => {
435
+        if (item.value === true) {
436
+          item.value = "yes";
437
+        } else if (item.value === false) {
438
+          item.value = "no";
439
+        }
440
+      });
441
+
442
+      console.log(this.property);
443
+
322
       this.saveProperty(this.property)
444
       this.saveProperty(this.property)
323
         .then(fulfilled => {
445
         .then(fulfilled => {
324
-          this.$router.push(`/property/residential/property/${fulfilled.data.id}`);
446
+          this.$router.push(`/property/commercial/property/${fulfilled.data.id}`);
325
         })
447
         })
326
         .catch(error => {
448
         .catch(error => {
327
           console.log(error.message);
449
           console.log(error.message);
357
     },
479
     },
358
     UpdateDefaultImage(item) {
480
     UpdateDefaultImage(item) {
359
       this.defaultImage = item;
481
       this.defaultImage = item;
482
+    },
483
+    clearAddress() {
484
+      this.addressSet = false;
485
+      this.property.streetNumber = undefined;
486
+      this.property.streetName = undefined;
487
+      this.property.suburb = undefined;
488
+      this.property.city = undefined;
489
+      this.property.province = undefined;
490
+      this.property.country = undefined;
491
+      this.property.postalCode = undefined;
492
+      this.property.addressUrl = undefined;
493
+      this.property.propertCoords = undefined;
360
     }
494
     }
361
   },
495
   },
362
   mounted() {
496
   mounted() {
393
       "propertyImages"
527
       "propertyImages"
394
     ]),
528
     ]),
395
     ...mapState("authentication", ["user"]),
529
     ...mapState("authentication", ["user"]),
530
+    ...mapGetters("fees", ["getListingFee"]),
396
     SalesTypeChanged() {
531
     SalesTypeChanged() {
397
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
532
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
398
       // this.propertyType = this.$route.params.propType;
533
       // this.propertyType = this.$route.params.propType;

+ 8
- 2
src/components/property/commercial/singleView/contentSection.vue View File

36
           <div class="panel-left p-5" style="margin-top:140px;">
36
           <div class="panel-left p-5" style="margin-top:140px;">
37
             <h2>Property Detial</h2>
37
             <h2>Property Detial</h2>
38
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
38
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
39
-            <p>{{ property.suburb }}, {{ property.city }}</p>
39
+            <p>{{ property.city }}, {{ property.suburb }}</p>
40
+            <div v-for="field in property.displayData[0].values" :key="field.id">
41
+              <p v-if="field.name === 'Floor Size'">{{ field.value }}M<sup>2</sup></p>
42
+              <p v-if="field.name === 'Rates & Taxes'">
43
+                Rates & Taxes: R{{ field.value | toCurrency }}
44
+              </p>
45
+            </div>
40
             <p>{{ property.shortDescription }}</p>
46
             <p>{{ property.shortDescription }}</p>
41
             <p>{{ property.price | toCurrency }}</p>
47
             <p>{{ property.price | toCurrency }}</p>
42
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
48
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
68
             </div>
74
             </div>
69
             {{ property.streetNumber }} {{ property.streetName }}
75
             {{ property.streetNumber }} {{ property.streetName }}
70
           </h2>
76
           </h2>
71
-          <h2>{{ property.propertyName }}</h2>
77
+          <h2 v-else>{{ property.propertyName }}</h2>
72
           <p>{{ property.shortDescription }}</p>
78
           <p>{{ property.shortDescription }}</p>
73
           <h4>Property Features</h4>
79
           <h4>Property Features</h4>
74
           <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
80
           <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">

+ 459
- 0
src/components/property/editProperty/editProperty.vue View File

1
+<template>
2
+  <div>
3
+    <main id="main">
4
+      <section id="services">
5
+        <div class="container">
6
+          <div class="col-12">
7
+            <h1>Property Details</h1>
8
+          </div>
9
+          <main id="main" style="margin-top:-20px">
10
+            <div class="container pt-5 pb-5">
11
+              <div class="row my-3">
12
+                <div class="col-md-6">
13
+                  <select
14
+                    class="form-control uniSelect"
15
+                    v-model="property.propertyUsageType"
16
+                    @change="UpdateUsageType"
17
+                  >
18
+                    <option>Commercial</option>
19
+                    <option>Residential</option>
20
+                  </select>
21
+                </div>
22
+                <div class="col-md-6">
23
+                  <select class="form-control uniSelect" v-model="property.statusString">
24
+                    <option v-for="(item, i) in statuses" :key="i">{{ item }}</option>
25
+                  </select>
26
+                </div>
27
+              </div>
28
+              <div class="row my-3">
29
+                <div class="col-md-6">
30
+                  <div v-if="!property.propertyName">
31
+                    <label for="propertyName" class="uniSelectLabel">PROPERTY NAME</label>
32
+                  </div>
33
+                  <input
34
+                    class="form-control uniInput"
35
+                    type="text"
36
+                    name="propertyName"
37
+                    v-model="property.propertyName"
38
+                  />
39
+                </div>
40
+                <div class="col-md-6">
41
+                  <div v-if="!property.propertyRef">
42
+                    <label for="propertyName" class="uniSelectLabel">PROPERTY REFERENCE</label>
43
+                  </div>
44
+                  <input
45
+                    class="form-control uniInput"
46
+                    type="text"
47
+                    name="propertyRef"
48
+                    v-model="property.propertyRef"
49
+                  />
50
+                </div>
51
+              </div>
52
+              <div class="row my-3">
53
+                <div class="col-md-6">
54
+                  <select
55
+                    class="form-control uniSelect"
56
+                    name="propertyType"
57
+                    id="propertyType"
58
+                    v-model="property.propertyTypeId"
59
+                  >
60
+                    <option value="0">Please select type *</option>
61
+                    <option
62
+                      v-for="item in propertyTypes"
63
+                      :value="item.id"
64
+                      :key="item.id"
65
+                    >{{ item.description }}</option>
66
+                  </select>
67
+                </div>
68
+                <div v-if="property.propertyUsageType === 'Commercial'" class="col-md-2">
69
+                  <div v-if="!property.unit">
70
+                    <label for="unit" class="uniSelectLabel">UNIT</label>
71
+                  </div>
72
+                  <input
73
+                    class="form-control uniInput"
74
+                    type="text"
75
+                    name="unit"
76
+                    id="unit"
77
+                    v-model="property.unit"
78
+                  />
79
+                </div>
80
+              </div>
81
+              <div class="row my-3">
82
+                <div class="col-md-6">
83
+                  <mapSection
84
+                    v-on:map-location="updateLocation"
85
+                    :savedCoords="property.propertCoords"
86
+                  />
87
+                  <input
88
+                    type="checkbox"
89
+                    v-model="property.showAddress"
90
+                    style="margin-right: 10px; margin-top: 10px;"
91
+                  />
92
+                  <label>Show address on listing</label>
93
+                </div>
94
+                <div class="col-md-6">
95
+                  <div class="row">
96
+                    <div class="col-md-6">
97
+                      <div v-if="property.price < 1">
98
+                        <label
99
+                          for="price"
100
+                          class="uniSelectLabel"
101
+                          style="text-transform:uppercase; margin-left:17px; background-color:white"
102
+                        >{{ property.salesTypeString }} Price</label>
103
+                      </div>
104
+                      <input
105
+                        class="form-control uniInput"
106
+                        type="number"
107
+                        name="price"
108
+                        id="price"
109
+                        v-model="property.price"
110
+                      />
111
+                    </div>
112
+                    <div v-if="property.salesTypeString === 'Rental'" class="col-md-6">
113
+                      <select
114
+                        class="form-control uniSelect"
115
+                        name="propertyType"
116
+                        id="propertyType"
117
+                        v-model="property.pricePer"
118
+                      >
119
+                        <option value>Please select</option>
120
+                        <option value="Month">Month</option>
121
+                        <option value="Day">Day</option>
122
+                      </select>
123
+                    </div>
124
+                  </div>
125
+                  <div class="row my-3">
126
+                    <div class="col-md-12">
127
+                      <input
128
+                        type="date"
129
+                        class="form-control uniInput"
130
+                        name="date"
131
+                        v-model="property.dateAvailable"
132
+                      />
133
+                    </div>
134
+                  </div>
135
+                  <div class="row my-3">
136
+                    <br />
137
+                  </div>
138
+                  <div class="row my-3">
139
+                    <div class="col-md-12">
140
+                      <div v-if="!property.streetNumber">
141
+                        <label for="streetNumber" class="uniSelectLabel">STREET NUMBER</label>
142
+                      </div>
143
+                      <input
144
+                        class="form-control uniInput"
145
+                        type="text"
146
+                        name="streetNumber"
147
+                        id="unit"
148
+                        v-model="property.streetNumber"
149
+                        disabled
150
+                      />
151
+                    </div>
152
+                  </div>
153
+                  <div class="row my-3">
154
+                    <div class="col-md-12">
155
+                      <div v-if="!property.streetName">
156
+                        <label for="streetName" class="uniSelectLabel">STREET NAME</label>
157
+                      </div>
158
+                      <input
159
+                        class="form-control uniInput"
160
+                        type="text"
161
+                        name="streetName"
162
+                        id="unit"
163
+                        v-model="property.streetName"
164
+                        disabled
165
+                      />
166
+                    </div>
167
+                  </div>
168
+                  <div class="row my-3">
169
+                    <div class="col-md-12">
170
+                      <div v-if="!property.suburb">
171
+                        <label for="suburb" class="uniSelectLabel">SUBURB</label>
172
+                      </div>
173
+                      <input
174
+                        class="form-control uniInput"
175
+                        type="text"
176
+                        name="suburb"
177
+                        id="unit"
178
+                        v-model="property.suburb"
179
+                        disabled
180
+                      />
181
+                    </div>
182
+                  </div>
183
+                  <div class="row my-3">
184
+                    <div class="col-md-12">
185
+                      <div v-if="!property.city">
186
+                        <label for="city" class="uniSelectLabel">CITY</label>
187
+                      </div>
188
+                      <input
189
+                        class="form-control uniInput"
190
+                        type="text"
191
+                        name="city"
192
+                        id="unit"
193
+                        v-model="property.city"
194
+                        disabled
195
+                      />
196
+                    </div>
197
+                  </div>
198
+                  <div class="row my-3">
199
+                    <div class="col-md-12">
200
+                      <div v-if="!property.province">
201
+                        <label for="province" class="uniSelectLabel">PROVINCE</label>
202
+                      </div>
203
+                      <input
204
+                        class="form-control uniInput"
205
+                        type="text"
206
+                        name="province"
207
+                        id="unit"
208
+                        v-model="property.province"
209
+                        disabled
210
+                      />
211
+                    </div>
212
+                  </div>
213
+                  <div class="row my-3">
214
+                    <div class="col-md-12">
215
+                      <div v-if="!property.postalCode">
216
+                        <label for="postalCode" class="uniSelectLabel">POSTAL CODE</label>
217
+                      </div>
218
+                      <input
219
+                        class="form-control uniInput"
220
+                        type="text"
221
+                        name="postalCode"
222
+                        id="unit"
223
+                        v-model="property.postalCode"
224
+                        disabled
225
+                      />
226
+                    </div>
227
+                  </div>
228
+                  <div class="row my-3">
229
+                    <div class="col-md-12">
230
+                      <div v-if="!property.country">
231
+                        <label for="country" class="uniSelectLabel">COUNTRY</label>
232
+                      </div>
233
+                      <input
234
+                        class="form-control uniInput"
235
+                        type="text"
236
+                        name="country"
237
+                        id="unit"
238
+                        v-model="property.country"
239
+                        disabled
240
+                      />
241
+                    </div>
242
+                  </div>
243
+                  <div class="row my-3">
244
+                    <div class="col-md-12">
245
+                      <button
246
+                        type="button"
247
+                        @click="clearAddress()"
248
+                        class="btn-solid-blue"
249
+                      >Clear Address</button>
250
+                    </div>
251
+                  </div>
252
+                </div>
253
+              </div>
254
+              <div class="row">
255
+                <div class="col-md-12">
256
+                  <label for="Property Description" style="font-family:'muli'">Description:</label>
257
+                  <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
258
+                  <br />
259
+                  <p>
260
+                    * A listing fee of R380 including VAT is payable to list your Property on the
261
+                    Uni-Vate website
262
+                  </p>
263
+                </div>
264
+              </div>
265
+              <div class="row">
266
+                <div class="section-header">
267
+                  <h2>Property Information</h2>
268
+                </div>
269
+                <div class="row mb-3" v-for="item in propertyFields" :key="item.id">
270
+                  <div class="col-md-6" v-for="field in item.fields" :key="field.id">
271
+                    <div v-if="field.type === 'number'">
272
+                      {{ field.name }}
273
+                      <input
274
+                        type="number"
275
+                        class="form-control uniInput"
276
+                        v-model="field.value"
277
+                      />
278
+                    </div>
279
+                    <div v-else class="display:none"></div>
280
+                    <div v-if="field.type === 'yesno'">
281
+                      {{ field.name }}
282
+                      <input type="checkbox" v-model="field.value" />
283
+                    </div>
284
+                  </div>
285
+                </div>
286
+              </div>
287
+              <div class="row">
288
+                <div class="col-sm-12">
289
+                  <div class="section-header">
290
+                    <h2>Media</h2>
291
+                  </div>
292
+                </div>
293
+              </div>
294
+              <div class="form-group row">
295
+                <div class="col-md-12">
296
+                  <label class="uniSelectLabel">Virtual Tour (URL)</label>
297
+                  <div class="input-group-prepend">
298
+                    <input
299
+                      class="form-control uniInput"
300
+                      type="link"
301
+                      name="vtlink"
302
+                      id="vtlink"
303
+                      v-model="property.virtualTour"
304
+                    />
305
+                  </div>
306
+                </div>
307
+              </div>
308
+              <div class="row">
309
+                <div class="col-md-12">
310
+                  <label class="uniSelectLabel">Video (URL)</label>
311
+                  <div class="input-group-prepend">
312
+                    <input
313
+                      class="form-control uniInput"
314
+                      type="link"
315
+                      name="vlink"
316
+                      id="vlink"
317
+                      v-model="property.video"
318
+                    />
319
+                  </div>
320
+                </div>
321
+              </div>
322
+              <div class="row mt-3">
323
+                <div class="col-md-6">
324
+                  <div class="content-header">
325
+                    <h2>Images</h2>
326
+                  </div>
327
+
328
+                  <div class="input-group-prepend"></div>
329
+                </div>
330
+              </div>
331
+              <ImageLoad
332
+                :savedImaged="propertyImages"
333
+                :loadedImages="loadedImages"
334
+                @DefaultImage="UpdateDefaultImage"
335
+              />
336
+              <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">Save</button>
337
+              <button v-if="!wait" type="button" @click="Close()" class="btn-solid-blue">Close</button>
338
+              <div v-if="showPropertyTypeError">
339
+                <p
340
+                  class="alert myError"
341
+                >Missing fields. Please fill in all required fields. Marked with *</p>
342
+              </div>
343
+              <div v-if="!addressSet">
344
+                <p class="alert myError">Please enter an address.</p>
345
+              </div>
346
+              <div v-if="wait" id="preloader"></div>
347
+            </div>
348
+          </main>
349
+        </div>
350
+      </section>
351
+    </main>
352
+  </div>
353
+</template>
354
+
355
+<script>
356
+/* eslint-disable */
357
+import { mapState, mapActions } from "vuex";
358
+import mapSection from "../mapSection";
359
+import ImageLoad from "../propertyImage";
360
+import _ from "lodash";
361
+
362
+export default {
363
+  components: {
364
+    mapSection,
365
+    ImageLoad,
366
+  },
367
+  data() {
368
+    return {
369
+      addressSet: true,
370
+      defaultImage: 0,
371
+      images: [],
372
+      wait: false,
373
+    };
374
+  },
375
+  methods: {
376
+    ...mapActions("property", [
377
+      "getProperty",
378
+      "getPropertyTypes",
379
+      "getPropertyFields",
380
+      "updateProperty",
381
+    ]),
382
+    clearAddress() {
383
+      this.addressSet = false;
384
+      this.property.streetNumber = undefined;
385
+      this.property.streetName = undefined;
386
+      this.property.suburb = undefined;
387
+      this.property.city = undefined;
388
+      this.property.province = undefined;
389
+      this.property.country = undefined;
390
+      this.property.postalCode = undefined;
391
+      this.property.addressUrl = undefined;
392
+      this.property.propertCoords = undefined;
393
+    },
394
+    UpdateUsageType() {
395
+      this.getPropertyTypes(this.property.propertyUsageType);
396
+      this.getPropertyFields(this.property.propertyUsageType);
397
+    },
398
+    UpdateDefaultImage(item) {
399
+      this.defaultImage = item;
400
+    },
401
+    loadedImages(values) {
402
+      this.images = values;
403
+    },
404
+    SubmitData() {
405
+      this.wait = true;
406
+      this.property.propertyFields = this.propertyFields;
407
+
408
+      if (this.images.length > 0) {
409
+        this.property.newImages = [];
410
+      }
411
+      // eslint-disable-next-line no-plusplus
412
+      for (let i = 0; i < this.images.length; i++) {
413
+        let setAsDefault = false;
414
+        if (i === this.defaultImage) {
415
+          setAsDefault = true;
416
+        }
417
+        this.property.newImages.push({
418
+          image: this.images[i],
419
+          isDefault: setAsDefault,
420
+        });
421
+      }
422
+
423
+      this.updateProperty(this.property).then((fulfilled) => {
424
+        this.$router.push("/PropertyAdmin");
425
+      });
426
+    },
427
+    Close() {
428
+      this.$router.push("/PropertyAdmin");
429
+    },
430
+    updateLocation(place) {
431
+      this.addressSet = true;
432
+      this.property.streetNumber = place.streetNumber;
433
+      this.property.streetName = place.streetName;
434
+      this.property.suburb = place.suburb;
435
+      this.property.city = place.city;
436
+      this.property.province = place.province;
437
+      this.property.country = place.country;
438
+      this.property.postalCode = place.postalCode;
439
+      this.property.addressUrl = place.url;
440
+      this.property.propertCoords = place.coords;
441
+    },
442
+  },
443
+  mounted() {
444
+    this.wait = false;
445
+    this.getProperty(this.$route.params.id);
446
+  },
447
+  computed: {
448
+    ...mapState("property", [
449
+      "property",
450
+      "propertyTypes",
451
+      "propertyImages",
452
+      "propertyFields",
453
+      "statuses",
454
+    ]),
455
+  },
456
+};
457
+</script>
458
+
459
+<style lang="scss" scoped></style>

+ 26
- 13
src/components/property/mapSection.vue View File

1
 <template>
1
 <template>
2
   <div>
2
   <div>
3
-    <gmap-autocomplete class="form-control mb-3 uniInput" @place_changed="setPlace">*</gmap-autocomplete>
3
+    <gmap-autocomplete class="form-control mb-3 uniInput" @place_changed="setPlace"
4
+      >*</gmap-autocomplete
5
+    >
4
     <GmapMap
6
     <GmapMap
5
       :center="mapCenter"
7
       :center="mapCenter"
6
       :zoom="mapZoom"
8
       :zoom="mapZoom"
18
 import { gmapApi } from "vue2-google-maps";
20
 import { gmapApi } from "vue2-google-maps";
19
 export default {
21
 export default {
20
   computed: {
22
   computed: {
21
-    google: gmapApi,
23
+    google: gmapApi
24
+  },
25
+  props: {
26
+    savedCoords: { default: "" }
22
   },
27
   },
23
   data() {
28
   data() {
24
     return {
29
     return {
33
       country: "",
38
       country: "",
34
       postalCode: "",
39
       postalCode: "",
35
       url: "",
40
       url: "",
36
-      coords: {},
41
+      coords: {}
37
     };
42
     };
38
   },
43
   },
39
 
44
 
65
         if (place.address_components[i].types[0] === "locality") {
70
         if (place.address_components[i].types[0] === "locality") {
66
           this.city = place.address_components[i].long_name;
71
           this.city = place.address_components[i].long_name;
67
         }
72
         }
68
-        if (
69
-          place.address_components[i].types[0] === "administrative_area_level_1"
70
-        ) {
73
+        if (place.address_components[i].types[0] === "administrative_area_level_1") {
71
           this.province = place.address_components[i].long_name;
74
           this.province = place.address_components[i].long_name;
72
         }
75
         }
73
         if (place.address_components[i].types[0] === "country") {
76
         if (place.address_components[i].types[0] === "country") {
79
         this.url = place.url;
82
         this.url = place.url;
80
       }
83
       }
81
 
84
 
82
-      var coords =
83
-        place.geometry.viewport.Za.j + "," + place.geometry.viewport.Va.j;
84
-      this.coords = coords;
85
-
86
       this.$emit("map-location", {
85
       this.$emit("map-location", {
87
         streetNumber: this.streetNumber,
86
         streetNumber: this.streetNumber,
88
         streetName: this.streetName,
87
         streetName: this.streetName,
91
         province: this.province,
90
         province: this.province,
92
         country: this.country,
91
         country: this.country,
93
         postalCode: this.postalCode,
92
         postalCode: this.postalCode,
94
-        url: this.url,
95
-        coords: this.coords,
93
+        url: this.url
96
       });
94
       });
97
-    },
95
+    }
98
   },
96
   },
97
+  watch: {
98
+    savedCoords: {
99
+      immediate: true,
100
+      handler(val, oldVal) {
101
+        if (val) {
102
+          var array = val.split(",");
103
+          this.mapCenter = {
104
+            lat: Number(array[0]),
105
+            lng: Number(array[1])
106
+          };
107
+          this.mapZoom = 17;
108
+        }
109
+      }
110
+    }
111
+  }
99
 };
112
 };
100
 </script>
113
 </script>
101
 
114
 

+ 11
- 3
src/components/property/propertyCard.vue View File

3
     <div class="container-fluid">
3
     <div class="container-fluid">
4
       <div class="row">
4
       <div class="row">
5
         <div
5
         <div
6
-          class="col-lg-3 col-md-6 col-sm-6"
6
+          class="col-lg-3 col-md-6 col-sm-6 my-3"
7
           v-for="currentProperty in properties"
7
           v-for="currentProperty in properties"
8
           :key="currentProperty.id"
8
           :key="currentProperty.id"
9
         >
9
         >
12
               <div class="portfolio-item p-4 wow fadeInUp justify-content-md-center">
12
               <div class="portfolio-item p-4 wow fadeInUp justify-content-md-center">
13
                 <div class="feature-top pt-3 mb-2">
13
                 <div class="feature-top pt-3 mb-2">
14
                   <h3>{{ currentProperty.displayPrice }}</h3>
14
                   <h3>{{ currentProperty.displayPrice }}</h3>
15
-                  <img :src="currentProperty.displayImage" alt="" />
15
+                  <img
16
+                    style="max-height:165px; object-fit: cover;"
17
+                    :src="currentProperty.displayImage"
18
+                    alt=""
19
+                  />
16
                 </div>
20
                 </div>
17
                 <h1>{{ currentProperty.suburb }}</h1>
21
                 <h1>{{ currentProperty.suburb }}</h1>
18
                 <p><strong>Property Reference</strong> #{{ currentProperty.id }}</p>
22
                 <p><strong>Property Reference</strong> #{{ currentProperty.id }}</p>
24
               <div class="portfolio-item p-4 wow fadeInUp justify-content-md-center">
28
               <div class="portfolio-item p-4 wow fadeInUp justify-content-md-center">
25
                 <div class="feature-top pt-3 mb-2">
29
                 <div class="feature-top pt-3 mb-2">
26
                   <h3>{{ currentProperty.displayPrice }}</h3>
30
                   <h3>{{ currentProperty.displayPrice }}</h3>
27
-                  <img :src="currentProperty.displayImage" alt="" />
31
+                  <img
32
+                    style="max-height:165px; object-fit: cover;"
33
+                    :src="currentProperty.displayImage"
34
+                    alt=""
35
+                  />
28
                 </div>
36
                 </div>
29
                 <h1>{{ currentProperty.suburb }}</h1>
37
                 <h1>{{ currentProperty.suburb }}</h1>
30
                 <p><strong>Property Reference</strong> #{{ currentProperty.id }}</p>
38
                 <p><strong>Property Reference</strong> #{{ currentProperty.id }}</p>

+ 18
- 7
src/components/property/propertyImage.vue View File

30
         <br />
30
         <br />
31
         <!-- <span class="input-group-text" align="center" style="width:150px" @click="removeImage(key)">
31
         <!-- <span class="input-group-text" align="center" style="width:150px" @click="removeImage(key)">
32
           <eva-icon name="trash-2-outline" fill="#60CBEB"></eva-icon>Delete
32
           <eva-icon name="trash-2-outline" fill="#60CBEB"></eva-icon>Delete
33
-        </span> -->
34
-        <button align="center" class="imageDeleteButton" @click="removeImage(key)">
33
+        </span>-->
34
+        <button align="center" class="imageDeleteButton" @click="removeImage(i)">
35
           <i class="fa fa-trash"></i>
35
           <i class="fa fa-trash"></i>
36
         </button>
36
         </button>
37
       </div>
37
       </div>
45
   props: {
45
   props: {
46
     loadedImages: Function,
46
     loadedImages: Function,
47
     mayEdit: { type: Boolean, default: () => true },
47
     mayEdit: { type: Boolean, default: () => true },
48
-    allowMultiple: { type: Boolean, default: () => true }
48
+    allowMultiple: { type: Boolean, default: () => true },
49
+    savedImaged: { type: Array, default: () => [] },
49
   },
50
   },
50
   data() {
51
   data() {
51
     return {
52
     return {
52
       images: {},
53
       images: {},
53
       image: [],
54
       image: [],
54
-      imagesDefault: []
55
+      imagesDefault: [],
55
     };
56
     };
56
   },
57
   },
57
   // Commented out for now.
58
   // Commented out for now.
84
         const reader = new FileReader();
85
         const reader = new FileReader();
85
         var vm = this;
86
         var vm = this;
86
 
87
 
87
-        reader.onload = e => {
88
+        reader.onload = (e) => {
88
           vm.image.push(e.target.result);
89
           vm.image.push(e.target.result);
89
         };
90
         };
90
         reader.readAsDataURL(file[i]);
91
         reader.readAsDataURL(file[i]);
109
         }
110
         }
110
         this.$emit("DefaultImage", index);
111
         this.$emit("DefaultImage", index);
111
       }
112
       }
112
-    }
113
-  }
113
+    },
114
+  },
115
+  watch: {
116
+    savedImaged: {
117
+      immediate: true,
118
+      handler(val, oldVal) {
119
+        if (val) {
120
+          this.image = val;
121
+        }
122
+      },
123
+    },
124
+  },
114
 };
125
 };
115
 </script>
126
 </script>
116
 
127
 

+ 20
- 10
src/components/property/propertyUserField.vue View File

1
 <template>
1
 <template>
2
   <div class="row">
2
   <div class="row">
3
     <div class="col-md-4 mb-2" v-for="(currentField, i) in fields" :key="i">
3
     <div class="col-md-4 mb-2" v-for="(currentField, i) in fields" :key="i">
4
-      <div v-if="!setFields[i]">
5
-        <label class="uniSelectLabel">{{ currentField.name }}</label>
6
-      </div>
7
-
8
       <div class="input-group-prepend">
4
       <div class="input-group-prepend">
9
         <!-- <span class="input-group-text" style="color: #60CBEB">
5
         <!-- <span class="input-group-text" style="color: #60CBEB">
10
           <b>{{ GetFirstLetter(currentField.name) }}</b>
6
           <b>{{ GetFirstLetter(currentField.name) }}</b>
11
         </span> -->
7
         </span> -->
8
+        <div v-if="!setFields[i] && currentField.type !== 'yesno'">
9
+          <label class="uniSelectLabel">{{ currentField.name }}</label>
10
+        </div>
12
         <input
11
         <input
13
           v-if="currentField.type === 'number'"
12
           v-if="currentField.type === 'number'"
14
           class="form-control uniInput"
13
           class="form-control uniInput"
18
           v-model="setFields[i]"
17
           v-model="setFields[i]"
19
           @change="UpdateSetFields(currentField, i)"
18
           @change="UpdateSetFields(currentField, i)"
20
         />
19
         />
20
+
21
         <input
21
         <input
22
           v-if="currentField.type === 'text'"
22
           v-if="currentField.type === 'text'"
23
           class="form-control uniInput"
23
           class="form-control uniInput"
27
           v-model="setFields[i]"
27
           v-model="setFields[i]"
28
           @change="UpdateSetFields(currentField, i)"
28
           @change="UpdateSetFields(currentField, i)"
29
         />
29
         />
30
-        <select
30
+      </div>
31
+    </div>
32
+
33
+    <div class="col-md-4 mb-2" v-for="(currentField, i) in fields" :key="'checkField' + i">
34
+      <div class="input-group-prepend">
35
+        <!-- <span class="input-group-text" style="color: #60CBEB">
36
+          <b>{{ GetFirstLetter(currentField.name) }}</b>
37
+        </span> -->
38
+        <div v-if="currentField.type === 'yesno'">
39
+          <label class="uniSelectLabel">{{ currentField.name }}</label>
40
+        </div>
41
+
42
+        <input
31
           v-if="currentField.type === 'yesno'"
43
           v-if="currentField.type === 'yesno'"
32
-          class="form-control uniSelect"
44
+          type="checkbox"
33
           id="currentField.id"
45
           id="currentField.id"
46
+          style="margin-left:-5px; margin-top:10px"
34
           v-model="setFields[i]"
47
           v-model="setFields[i]"
35
           @change="UpdateSetFields(currentField, i)"
48
           @change="UpdateSetFields(currentField, i)"
36
-        >
37
-          <option value="yes">Yes</option>
38
-          <option value="no">No</option>
39
-        </select>
49
+        />
40
       </div>
50
       </div>
41
     </div>
51
     </div>
42
   </div>
52
   </div>

+ 39
- 41
src/components/property/residential/createProperty/residentialCreate.vue View File

38
               @change="PropertyTypeSelected"
38
               @change="PropertyTypeSelected"
39
             >
39
             >
40
               <option value="0">Please select type *</option>
40
               <option value="0">Please select type *</option>
41
-              <option
42
-                v-for="item in propertyTypes"
43
-                :value="item.id"
44
-                :key="item.id"
45
-              >{{ item.description }}</option>
41
+              <option v-for="item in propertyTypes" :value="item.id" :key="item.id">{{
42
+                item.description
43
+              }}</option>
46
             </select>
44
             </select>
47
           </div>
45
           </div>
48
           <div v-if="propertyType === 'Commercial'" class="col-md-2">
46
           <div v-if="propertyType === 'Commercial'" class="col-md-2">
76
                     for="price"
74
                     for="price"
77
                     class="uniSelectLabel"
75
                     class="uniSelectLabel"
78
                     style="text-transform:uppercase; margin-left:17px; background-color:white"
76
                     style="text-transform:uppercase; margin-left:17px; background-color:white"
79
-                  >{{ salesType }} Price</label>
77
+                    >{{ salesType }} Price</label
78
+                  >
80
                 </div>
79
                 </div>
81
                 <input
80
                 <input
82
                   class="form-control uniInput"
81
                   class="form-control uniInput"
219
             </div>
218
             </div>
220
             <div class="row my-3">
219
             <div class="row my-3">
221
               <div class="col-md-12">
220
               <div class="col-md-12">
222
-                <button type="button" @click="clearAddress()" class="btn-solid-blue">Clear Address</button>
221
+                <button type="button" @click="clearAddress()" class="btn-solid-blue">
222
+                  Clear Address
223
+                </button>
223
               </div>
224
               </div>
224
             </div>
225
             </div>
225
           </div>
226
           </div>
230
             <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
231
             <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
231
             <br />
232
             <br />
232
             <p>
233
             <p>
233
-              * A listing fee of R380 including VAT is payable to list your Property on the
234
-              Uni-Vate website
234
+              * A listing fee of R380 including VAT is payable to list your Property on the Uni-Vate
235
+              website
235
             </p>
236
             </p>
236
           </div>
237
           </div>
237
         </div>
238
         </div>
315
           :savedImages="propertyImages"
316
           :savedImages="propertyImages"
316
           @DefaultImage="UpdateDefaultImage"
317
           @DefaultImage="UpdateDefaultImage"
317
         />
318
         />
318
-        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">Save</button>
319
+        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">
320
+          Save
321
+        </button>
319
         <div v-if="showPropertyTypeError">
322
         <div v-if="showPropertyTypeError">
320
-          <p class="alert myError">Missing fields. Please fill in all required fields. Marked with *</p>
323
+          <p class="alert myError">
324
+            Missing fields. Please fill in all required fields. Marked with *
325
+          </p>
321
         </div>
326
         </div>
322
         <div v-if="wait" id="preloader"></div>
327
         <div v-if="wait" id="preloader"></div>
323
       </div>
328
       </div>
342
     ImageLoad,
347
     ImageLoad,
343
     VueEditor,
348
     VueEditor,
344
     carouselSection,
349
     carouselSection,
345
-    mapSection,
350
+    mapSection
346
   },
351
   },
347
   data() {
352
   data() {
348
     return {
353
     return {
355
       customToolbar: [
360
       customToolbar: [
356
         [{ header: [false, 1, 2, 3, 4, 5, 6] }],
361
         [{ header: [false, 1, 2, 3, 4, 5, 6] }],
357
         ["bold", "italic", "underline", "strike"],
362
         ["bold", "italic", "underline", "strike"],
358
-        [
359
-          { align: "" },
360
-          { align: "center" },
361
-          { align: "right" },
362
-          { align: "justify" },
363
-        ],
363
+        [{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }],
364
         [{ list: "ordered" }, { list: "bullet" }, { list: "check" }],
364
         [{ list: "ordered" }, { list: "bullet" }, { list: "check" }],
365
         [{ script: "sub" }, { script: "super" }],
365
         [{ script: "sub" }, { script: "super" }],
366
-        [{ indent: "-1" }, { indent: "+1" }],
366
+        [{ indent: "-1" }, { indent: "+1" }]
367
       ],
367
       ],
368
       error: "",
368
       error: "",
369
       addressSet: false,
369
       addressSet: false,
370
       showPropertyTypeError: false,
370
       showPropertyTypeError: false,
371
       showDateError: false,
371
       showDateError: false,
372
       user: Log.getUser(),
372
       user: Log.getUser(),
373
-      mayEdit: Log.isLoggedIn(),
373
+      mayEdit: Log.isLoggedIn()
374
     };
374
     };
375
   },
375
   },
376
   methods: {
376
   methods: {
385
       "getPropertyEditDisplay",
385
       "getPropertyEditDisplay",
386
       "getPropertySavedOverviewFields",
386
       "getPropertySavedOverviewFields",
387
       "getPropertySavedFields",
387
       "getPropertySavedFields",
388
-      "getSavedPropertyData",
388
+      "getSavedPropertyData"
389
     ]),
389
     ]),
390
     updateLocation(place) {
390
     updateLocation(place) {
391
       this.addressSet = true;
391
       this.addressSet = true;
407
         this.showPropertyTypeError = true;
407
         this.showPropertyTypeError = true;
408
       }
408
       }
409
 
409
 
410
-      if (
411
-        this.salesType === "Rental" &&
412
-        this.property.dateAvailable === "undef"
413
-      ) {
410
+      if (this.salesType === "Rental" && this.property.dateAvailable === "undef") {
414
         this.showDateError = true;
411
         this.showDateError = true;
415
       }
412
       }
416
 
413
 
434
         }
431
         }
435
         this.property.propertyImages.push({
432
         this.property.propertyImages.push({
436
           image: this.images[i],
433
           image: this.images[i],
437
-          isDefault: setAsDefault,
434
+          isDefault: setAsDefault
438
         });
435
         });
439
       }
436
       }
440
       this.property.propertyUserFields = this.propertyFieldValues;
437
       this.property.propertyUserFields = this.propertyFieldValues;
442
       if (this.user) {
439
       if (this.user) {
443
         this.property.userId = this.user.id;
440
         this.property.userId = this.user.id;
444
       }
441
       }
442
+      console.log(this.propertyFieldValues);
445
 
443
 
446
-      this.saveProperty(this.property)
447
-        .then((fulfilled) => {
448
-          this.$router.push(
449
-            `/property/residential/property/${fulfilled.data.id}`
450
-          );
451
-        })
452
-        .catch((error) => {
453
-          console.log(error.message);
454
-        });
444
+      // this.saveProperty(this.property)
445
+      //   .then((fulfilled) => {
446
+      //     this.$router.push(
447
+      //       `/property/residential/property/${fulfilled.data.id}`
448
+      //     );
449
+      //   })
450
+      //   .catch((error) => {
451
+      //     console.log(error.message);
452
+      //   });
455
     },
453
     },
456
     Close() {
454
     Close() {
457
       this.$router.push("/property/admin/list/my");
455
       this.$router.push("/property/admin/list/my");
471
     },
469
     },
472
     UpdateUserDefinedFields(item) {
470
     UpdateUserDefinedFields(item) {
473
       let update = false;
471
       let update = false;
474
-      this.propertyFieldValues.forEach((element) => {
472
+      this.propertyFieldValues.forEach(element => {
475
         if (element.userDefinedFieldId === item.userDefinedFieldId) {
473
         if (element.userDefinedFieldId === item.userDefinedFieldId) {
476
           element.value = item.value;
474
           element.value = item.value;
477
           update = true;
475
           update = true;
495
       this.property.postalCode = undefined;
493
       this.property.postalCode = undefined;
496
       this.property.addressUrl = undefined;
494
       this.property.addressUrl = undefined;
497
       this.property.propertCoords = undefined;
495
       this.property.propertCoords = undefined;
498
-    },
496
+    }
499
   },
497
   },
500
   mounted() {
498
   mounted() {
501
     this.wait = false;
499
     this.wait = false;
530
       "propertyOverviewFields",
528
       "propertyOverviewFields",
531
       "propertyFields",
529
       "propertyFields",
532
       "property",
530
       "property",
533
-      "propertyImages",
531
+      "propertyImages"
534
     ]),
532
     ]),
535
     ...mapState("authentication", ["user"]),
533
     ...mapState("authentication", ["user"]),
536
     SalesTypeChanged() {
534
     SalesTypeChanged() {
550
       this.getPropertyTypes(this.propertyType);
548
       this.getPropertyTypes(this.propertyType);
551
 
549
 
552
       return this.propertyType;
550
       return this.propertyType;
553
-    },
551
+    }
554
   },
552
   },
555
   watch: {
553
   watch: {
556
     SalesTypeChanged() {
554
     SalesTypeChanged() {
557
       return null;
555
       return null;
558
-    },
559
-  },
556
+    }
557
+  }
560
 };
558
 };
561
 </script>
559
 </script>
562
 
560
 

+ 157
- 35
src/components/property/residential/createProperty/residentialCreateNew.vue View File

84
                     >{{ salesType }} Price</label
84
                     >{{ salesType }} Price</label
85
                   >
85
                   >
86
                 </div>
86
                 </div>
87
-                <input
88
-                  class="form-control uniInput"
89
-                  type="number"
87
+                <currency-input
88
+                  onClick="this.setSelectionRange(0, this.value.length)"
90
                   name="price"
89
                   name="price"
91
-                  id="price"
90
+                  :value="value"
91
+                  @input="value = $event"
92
                   v-model="property.price"
92
                   v-model="property.price"
93
+                  id="price"
94
+                  class="form-control uniInput"
93
                 />
95
                 />
94
               </div>
96
               </div>
95
               <div v-if="salesType === 'Rental'" class="col-md-6">
97
               <div v-if="salesType === 'Rental'" class="col-md-6">
115
                 />
117
                 />
116
               </div>
118
               </div>
117
             </div>
119
             </div>
118
-            <div class="row">
120
+            <div class="row my-3">
121
+              <br />
122
+            </div>
123
+            <div class="row my-3">
124
+              <div class="col-md-12">
125
+                <div v-if="!property.streetNumber">
126
+                  <label for="streetNumber" class="uniSelectLabel">STREET NUMBER</label>
127
+                </div>
128
+                <input
129
+                  class="form-control uniInput"
130
+                  type="text"
131
+                  name="streetNumber"
132
+                  id="unit"
133
+                  v-model="property.streetNumber"
134
+                  disabled
135
+                />
136
+              </div>
137
+            </div>
138
+            <div class="row my-3">
139
+              <div class="col-md-12">
140
+                <div v-if="!property.streetName">
141
+                  <label for="streetName" class="uniSelectLabel">STREET NAME</label>
142
+                </div>
143
+                <input
144
+                  class="form-control uniInput"
145
+                  type="text"
146
+                  name="streetName"
147
+                  id="unit"
148
+                  v-model="property.streetName"
149
+                  disabled
150
+                />
151
+              </div>
152
+            </div>
153
+            <div class="row my-3">
119
               <div class="col-md-12">
154
               <div class="col-md-12">
120
-                <label for="Property Description" style="font-family:'muli'">Description:</label>
121
-                <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
122
-                <br />
123
-                <p>
124
-                  * A listing fee of R380 including VAT is payable to list your Property on the
125
-                  Uni-Vate website
126
-                </p>
155
+                <div v-if="!property.suburb">
156
+                  <label for="suburb" class="uniSelectLabel">SUBURB</label>
157
+                </div>
158
+                <input
159
+                  class="form-control uniInput"
160
+                  type="text"
161
+                  name="suburb"
162
+                  id="unit"
163
+                  v-model="property.suburb"
164
+                  disabled
165
+                />
127
               </div>
166
               </div>
128
             </div>
167
             </div>
168
+            <div class="row my-3">
169
+              <div class="col-md-12">
170
+                <div v-if="!property.city">
171
+                  <label for="city" class="uniSelectLabel">CITY</label>
172
+                </div>
173
+                <input
174
+                  class="form-control uniInput"
175
+                  type="text"
176
+                  name="city"
177
+                  id="unit"
178
+                  v-model="property.city"
179
+                  disabled
180
+                />
181
+              </div>
182
+            </div>
183
+            <div class="row my-3">
184
+              <div class="col-md-12">
185
+                <div v-if="!property.province">
186
+                  <label for="province" class="uniSelectLabel">PROVINCE</label>
187
+                </div>
188
+                <input
189
+                  class="form-control uniInput"
190
+                  type="text"
191
+                  name="province"
192
+                  id="unit"
193
+                  v-model="property.province"
194
+                  disabled
195
+                />
196
+              </div>
197
+            </div>
198
+            <div class="row my-3">
199
+              <div class="col-md-12">
200
+                <div v-if="!property.postalCode">
201
+                  <label for="postalCode" class="uniSelectLabel">POSTAL CODE</label>
202
+                </div>
203
+                <input
204
+                  class="form-control uniInput"
205
+                  type="text"
206
+                  name="postalCode"
207
+                  id="unit"
208
+                  v-model="property.postalCode"
209
+                  disabled
210
+                />
211
+              </div>
212
+            </div>
213
+            <div class="row my-3">
214
+              <div class="col-md-12">
215
+                <div v-if="!property.country">
216
+                  <label for="country" class="uniSelectLabel">COUNTRY</label>
217
+                </div>
218
+                <input
219
+                  class="form-control uniInput"
220
+                  type="text"
221
+                  name="country"
222
+                  id="unit"
223
+                  v-model="property.country"
224
+                  disabled
225
+                />
226
+              </div>
227
+            </div>
228
+            <div class="row my-3">
229
+              <div class="col-md-12">
230
+                <button type="button" @click="clearAddress()" class="btn-solid-blue">
231
+                  Clear Address
232
+                </button>
233
+              </div>
234
+            </div>
235
+          </div>
236
+        </div>
237
+        <div class="row">
238
+          <div class="col-md-12">
239
+            <label for="Property Description" style="font-family:'muli'">Description:</label>
240
+            <vue-editor v-model="property.description" :editor-toolbar="customToolbar" />
241
+            <br />
242
+            <p>
243
+              * A listing fee of R{{ getListingFee.amount }} including VAT is payable to list your
244
+              Property on the Uni-Vate website
245
+            </p>
129
           </div>
246
           </div>
130
         </div>
247
         </div>
131
-        <div class="row" />
132
 
248
 
133
         <div class="section-header">
249
         <div class="section-header">
134
           <h2>Property Information</h2>
250
           <h2>Property Information</h2>
135
         </div>
251
         </div>
136
 
252
 
137
-        <div class="row mb-3" v-for="item in propertyFields" :key="item.id">
138
-          <div class="col-md-6" v-for="field in item.fields" :key="field.id">
139
-            <div v-if="field.type === 'number'">
140
-              {{ field.name }}
141
-              <input type="number" class="form-control uniInput" v-model="field.value" />
142
-            </div>
143
-            <div v-else class="display:none"></div>
144
-            <div v-if="field.type === 'yesno'">
145
-              {{ field.name }}
146
-              <input type="checkbox" v-model="field.value" />
147
-            </div>
253
+        <div v-for="item in propertyFields" :key="item.id">
254
+          <div v-if="item.name === 'Residential Fields'">
255
+            <UserField
256
+              :fields="item.fields"
257
+              :id="item.name"
258
+              @UpdateUserDefinedFields="UpdateUserDefinedFields"
259
+              :fieldValues="item.fields"
260
+            />
148
           </div>
261
           </div>
149
         </div>
262
         </div>
150
         <!-- <UserField
263
         <!-- <UserField
237
 
350
 
238
 <script>
351
 <script>
239
 /* eslint-disable */
352
 /* eslint-disable */
240
-import { mapState, mapActions } from "vuex";
353
+import { mapState, mapActions, mapGetters } from "vuex";
241
 import { VueEditor } from "vue2-editor";
354
 import { VueEditor } from "vue2-editor";
242
 import UserField from "../../propertyUserField.vue";
355
 import UserField from "../../propertyUserField.vue";
243
 import ImageLoad from "../../propertyImage.vue";
356
 import ImageLoad from "../../propertyImage.vue";
339
           isDefault: setAsDefault
452
           isDefault: setAsDefault
340
         });
453
         });
341
       }
454
       }
342
-      this.property.propertyUserFields = this.propertyFields;
455
+      this.property.propertyUserFields = this.propertyFieldValues;
343
 
456
 
344
       if (this.user) {
457
       if (this.user) {
345
         this.property.userId = this.user.id;
458
         this.property.userId = this.user.id;
346
       }
459
       }
347
       this.property.propertyUserFields.forEach(item => {
460
       this.property.propertyUserFields.forEach(item => {
348
-        item.fields.forEach(field => {
349
-          if (field.type === "yesno") {
350
-            if (field.value) {
351
-              field.value = "yes";
352
-            } else {
353
-              field.value = "no";
354
-            }
355
-          }
356
-        });
461
+        if (item.value === true) {
462
+          item.value = "yes";
463
+        } else if (item.value === false) {
464
+          item.value = "no";
465
+        }
357
       });
466
       });
358
 
467
 
359
       this.saveProperty(this.property)
468
       this.saveProperty(this.property)
397
     UpdateDefaultImage(item) {
506
     UpdateDefaultImage(item) {
398
       this.defaultImage = item;
507
       this.defaultImage = item;
399
     },
508
     },
509
+    clearAddress() {
510
+      this.addressSet = false;
511
+      this.property.streetNumber = undefined;
512
+      this.property.streetName = undefined;
513
+      this.property.suburb = undefined;
514
+      this.property.city = undefined;
515
+      this.property.province = undefined;
516
+      this.property.country = undefined;
517
+      this.property.postalCode = undefined;
518
+      this.property.addressUrl = undefined;
519
+      this.property.propertCoords = undefined;
520
+    },
400
     userFieldsArrFunc(arr, len) {
521
     userFieldsArrFunc(arr, len) {
401
       const fields = [];
522
       const fields = [];
402
       const i = 0;
523
       const i = 0;
446
       "propertyImages"
567
       "propertyImages"
447
     ]),
568
     ]),
448
     ...mapState("authentication", ["user"]),
569
     ...mapState("authentication", ["user"]),
570
+    ...mapGetters("fees", ["getListingFee"]),
449
     SalesTypeChanged() {
571
     SalesTypeChanged() {
450
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
572
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
451
       // this.propertyType = this.$route.params.propType;
573
       // this.propertyType = this.$route.params.propType;

+ 11
- 36
src/components/property/residential/singleView/contentSection.vue View File

36
             <p v-if="property.showAddress">{{ property.addressOther }}</p>
36
             <p v-if="property.showAddress">{{ property.addressOther }}</p>
37
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
37
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
38
             <p>{{ property.city }}, {{ property.suburb }}</p>
38
             <p>{{ property.city }}, {{ property.suburb }}</p>
39
-            <!-- <div v-for="(data, i) in property.displayData" :key="i">
40
-              {{ data }}
41
-            </div> -->
42
-            <p>
43
-              Bedrooms {{ property.displayData[1].values[0].value }}, Bathrooms
44
-              {{ property.displayData[1].values[1].value }}
45
-            </p>
46
-            <p>
47
-              Yard Size {{ property.displayData[0].values[1].value }}M<sup>2</sup>, Floor Size
48
-              {{ property.displayData[0].values[2].value }}M<sup>2</sup>
49
-            </p>
39
+            <div v-for="(data, i) in property.displayData" :key="i">
40
+              <div v-for="field in data.values" :key="field.id">
41
+                <p v-if="field.name === 'Floor Size'">{{ field.value }}M<sup>2</sup></p>
42
+                <p v-if="field.name === 'Bedrooms'">Bedrooms {{ field.value }}</p>
43
+                <p v-if="field.name === 'Bathrooms'">Bathrooms {{ field.value }}</p>
44
+              </div>
45
+            </div>
50
 
46
 
51
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
47
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
52
           </div>
48
           </div>
76
             {{ property.streetNumber }} {{ property.streetName }}
72
             {{ property.streetNumber }} {{ property.streetName }}
77
           </h2>
73
           </h2>
78
           <h2 v-else>{{ property.propertyName }}</h2>
74
           <h2 v-else>{{ property.propertyName }}</h2>
75
+
79
           <div class="container">
76
           <div class="container">
80
             <div class="row">
77
             <div class="row">
81
               <div class="col">
78
               <div class="col">
84
             </div>
81
             </div>
85
           </div>
82
           </div>
86
           <div>
83
           <div>
87
-            <!-- <table class="table table-striped">
88
-              <thead>
89
-                <tr>
90
-                  <th scope="col">Reference</th>
91
-                  <th scope="col">Size</th>
92
-                  <th scope="col">Rooms</th>
93
-                  <th scope="col">Bathrooms</th>
94
-                  <th scope="col">Garages</th>
95
-                  <th scope="col"></th>
96
-                </tr>
97
-              </thead>
98
-
99
-              <tbody>
100
-                <tr>
101
-                  <td>#{{ property.id }}</td>
102
-                  <td>{{ property.displayData[0].values[2].value }}M<sup>2</sup></td>
103
-                  <td>{{ property.displayData[1].values[0].value }}</td>
104
-                  <td>{{ property.displayData[1].values[1].value }}</td>
105
-                  <td>{{ property.displayData[2].values[0].value }}</td>
106
-                  <td><a href="#" class="btn-solid-blue">BOOK A VIEWING</a></td>
107
-                </tr>
108
-              </tbody>
109
-            </table>-->
110
             <h4>Property Features</h4>
84
             <h4>Property Features</h4>
85
+
111
             <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
86
             <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
112
               <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
87
               <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
113
                 <div v-if="field.value.toUpperCase() != 'YES'">
88
                 <div v-if="field.value.toUpperCase() != 'YES'">
165
     console.log(this.property.displayData);
140
     console.log(this.property.displayData);
166
   },
141
   },
167
   mounted() {
142
   mounted() {
168
-    var facebookShare = document.getElementById("fb_share");
169
-    facebookShare.href = "http://www.facebook.com/share.php?u=" + encodeURIComponent(location.href);
143
+    // var facebookShare = document.getElementById("fb_share");
144
+    // facebookShare.href = "http://www.facebook.com/share.php?u=" + encodeURIComponent(location.href);
170
   },
145
   },
171
   data() {
146
   data() {
172
     return {
147
     return {

+ 92
- 11
src/components/shared/navBar.vue View File

40
               </div>
40
               </div>
41
               <nav id="nav-menu-container">
41
               <nav id="nav-menu-container">
42
                 <ul class="nav-menu sf-js-enabled sf-arrows">
42
                 <ul class="nav-menu sf-js-enabled sf-arrows">
43
-                  <li class="menu-has-children" style="margin-left:-20px">
44
-                    <div
43
+                  <li style="margin-left:-20px">
44
+                    <router-link to="/property/commercial">Commercial</router-link>
45
+                    <!-- <div
45
                       @mouseover="commercialClass = 'ts-display'"
46
                       @mouseover="commercialClass = 'ts-display'"
46
                       @mouseleave="commercialClass = 'no-display'"
47
                       @mouseleave="commercialClass = 'no-display'"
47
                     ></div>
48
                     ></div>
50
                     </a>
51
                     </a>
51
                     <ul style="margin-top:-10px; text-align:left" :class="commercialClass">
52
                     <ul style="margin-top:-10px; text-align:left" :class="commercialClass">
52
                       <li>
53
                       <li>
53
-                        <router-link to="/property/commercial">To Buy / To Rent</router-link>
54
+                        
54
                       </li>
55
                       </li>
55
                       <hr />
56
                       <hr />
56
                       <li>
57
                       <li>
61
                           >To Rent</a
62
                           >To Rent</a
62
                         >
63
                         >
63
                       </li>
64
                       </li>
64
-                    </ul>
65
+                    </ul> -->
65
                   </li>
66
                   </li>
66
-                  <li class="menu-has-children mx-1">
67
-                    <div
67
+                  <li class="mx-1">
68
+                    <router-link to="/property/residential">Residential</router-link>
69
+                    <!-- <div
68
                       @mouseover="residentialClass = 'ts-display'"
70
                       @mouseover="residentialClass = 'ts-display'"
69
                       @mouseleave="residentialClass = 'no-display'"
71
                       @mouseleave="residentialClass = 'no-display'"
70
                     ></div>
72
                     ></div>
86
                           >To Rent</a
88
                           >To Rent</a
87
                         >
89
                         >
88
                       </li>
90
                       </li>
89
-                    </ul>
91
+                    </ul> -->
90
                   </li>
92
                   </li>
91
                   <li class="menu-has-children mx-1">
93
                   <li class="menu-has-children mx-1">
92
                     <div
94
                     <div
193
                         <router-link to="/status/list">Status</router-link>
195
                         <router-link to="/status/list">Status</router-link>
194
                       </li>
196
                       </li>
195
                       <li v-if="ROLE === 'Super Admin'">
197
                       <li v-if="ROLE === 'Super Admin'">
198
+                      <li>
199
+                        <router-link to="/property/list">List My Property</router-link>
200
+                      </li>
201
+
202
+                      <li>
196
                         <router-link to="/status/timeshareAdmin">Timeshare Week Admin</router-link>
203
                         <router-link to="/status/timeshareAdmin">Timeshare Week Admin</router-link>
197
                       </li>
204
                       </li>
198
                       <li v-if="ROLE === 'Super Admin'">
205
                       <li v-if="ROLE === 'Super Admin'">
228
                         <router-link to="/searchLog">Search Logs</router-link>
235
                         <router-link to="/searchLog">Search Logs</router-link>
229
                       </li>
236
                       </li>
230
                       <li v-if="ROLE === 'Super Admin'">
237
                       <li v-if="ROLE === 'Super Admin'">
238
+                      <hr />
239
+                      <li class="menu-has-children">
240
+                        <div
241
+                          @mouseover="submenu1Class = 'ts-display'"
242
+                          @mouseleave="submenu1Class = 'no-display'"
243
+                        ></div>
244
+                        <a href="#" class="sf-with-ul">
245
+                          Website Setup
246
+                        </a>
247
+                        <ul
248
+                          style="margin-top:-10px;text-align:left;width:250px"
249
+                          :class="submenu1Class"
250
+                        >
251
+                          <li>
252
+                            <router-link to="/status/list">Status</router-link>
253
+                          </li>
254
+                          <li>
255
+                            <router-link to="/unitConfiguration/list"
256
+                              >Unit Configuration</router-link
257
+                            >
258
+                          </li>
259
+                          <li>
260
+                            <router-link to="/communication/template">Templates</router-link>
261
+                          </li>
262
+                          <li>
263
+                            <router-link to="/status/userManagementPage"
264
+                              >User Management & Access</router-link
265
+                            >
266
+                          </li>
267
+                          <li>
268
+                            <router-link to="/userDefinedGroups/list"
269
+                              >Property User Defined Groups</router-link
270
+                            >
271
+                          </li>
272
+                          <li>
273
+                            <router-link to="/PropertyAdmin">Property Admin</router-link>
274
+                          </li>
275
+                          <li>
276
+                            <router-link to="/propertyTypes/list">Property Types</router-link>
277
+                          </li>
278
+                          <li>
279
+                            <router-link to="/fees">Fees</router-link>
280
+                          </li>
281
+                        </ul>
282
+                      </li>
283
+                      <li class="menu-has-children">
284
+                        <div
285
+                          @mouseover="submenu1Class = 'ts-display'"
286
+                          @mouseleave="submenu1Class = 'no-display'"
287
+                        ></div>
288
+                        <a href="#" class="sf-with-ul">
289
+                          Logs
290
+                        </a>
291
+                        <ul
292
+                          style="margin-top:-10px;text-align:left;width:250px"
293
+                          :class="submenu1Class"
294
+                        >
295
+                          <li>
296
+                            <router-link to="/status/changeLogPage">Changes Logs</router-link>
297
+                          </li>
298
+                          <li>
299
+                            <router-link to="/searchLog">Search Logs</router-link>
300
+                          </li>
301
+                        </ul>
302
+                      </li>
303
+                      <hr />
304
+                      <li>
231
                         <router-link to="/Offers">Offers</router-link>
305
                         <router-link to="/Offers">Offers</router-link>
232
                       </li>
306
                       </li>
233
                       <li v-if="ROLE === 'Super Admin'">
307
                       <li v-if="ROLE === 'Super Admin'">
332
       registerClass: "no-display",
406
       registerClass: "no-display",
333
       commercialClass: "no-display",
407
       commercialClass: "no-display",
334
       residentialClass: "no-display",
408
       residentialClass: "no-display",
335
-      propManClass: "no-display"
409
+      propManClass: "no-display",
410
+      submenu1Class: "no-display"
336
     };
411
     };
337
   },
412
   },
338
   methods: {
413
   methods: {
339
     ...mapActions("authentication", ["logout"]),
414
     ...mapActions("authentication", ["logout"]),
415
+    ...mapActions("fees", ["retrieveListingFee"]),
340
     showDropDown() {
416
     showDropDown() {
341
       if (!this.hover) {
417
       if (!this.hover) {
342
         this.timeShareClass = "ts-display";
418
         this.timeShareClass = "ts-display";
346
       this.$emit("routerGoTo", goTo);
422
       this.$emit("routerGoTo", goTo);
347
     }
423
     }
348
   },
424
   },
425
+  mounted() {
426
+    this.retrieveListingFee();
427
+  },
349
   computed: {
428
   computed: {
350
     ...mapState("authentication", ["user", "flag", "status", "person", "token"]),
429
     ...mapState("authentication", ["user", "flag", "status", "person", "token"]),
351
     isLoggedIn() {
430
     isLoggedIn() {
352
-      console.log(Log.isLoggedIn());
353
-      console.log(this.user);
354
-
355
       return Log.isLoggedIn();
431
       return Log.isLoggedIn();
356
     },
432
     },
357
     NAME() {
433
     NAME() {
373
 </script>
449
 </script>
374
 
450
 
375
 <style lang="scss" scoped>
451
 <style lang="scss" scoped>
452
+.subItem {
453
+  background-color: white;
454
+  margin-top: -10px;
455
+}
456
+
376
 .no-display {
457
 .no-display {
377
   display: none;
458
   display: none;
378
 }
459
 }

+ 4
- 3
src/components/timeshare/resort/unit/summarySection.vue View File

35
             <tr>
35
             <tr>
36
               <td>{{ week ? week.unitNumber : "" }}</td>
36
               <td>{{ week ? week.unitNumber : "" }}</td>
37
               <td>{{ week ? week.weekNumber : "" }}</td>
37
               <td>{{ week ? week.weekNumber : "" }}</td>
38
-              <td>{{ week ? week.arrivalDate : "" }}</td>
38
+              <td v-if="week.arrivalDate === '0001-01-01T00:00:00'"></td>
39
+              <td v-else>{{ week.arrivalDate | toDate }}</td>
39
               <td>{{ week ? week.bedrooms : "" }}</td>
40
               <td>{{ week ? week.bedrooms : "" }}</td>
40
               <td>{{ week ? week.season : "" }}</td>
41
               <td>{{ week ? week.season : "" }}</td>
41
-              <td>R{{ week ? week.levyAmount : "" }}</td>
42
-              <td>R{{ week ? week.sellPrice : "" }}</td>
42
+              <td>{{ week ? week.levyAmount : "" | toCurrency }}</td>
43
+              <td>{{ week ? week.sellPrice : "" | toCurrency }}</td>
43
             </tr>
44
             </tr>
44
           </tbody>
45
           </tbody>
45
         </table>
46
         </table>

+ 6
- 2
src/components/timeshare/sell/carouselSection.vue View File

6
           <div class="intro-content box">
6
           <div class="intro-content box">
7
             <h2>Sell your Timeshare</h2>
7
             <h2>Sell your Timeshare</h2>
8
             <p>
8
             <p>
9
-              A listing fee of R380 including VAT is payable to list your timeshare week/module on
10
-              the Uni-Vate website.
9
+              A listing fee of R{{ getListingFee.amount }} including VAT is payable to list your
10
+              timeshare week/module on the Uni-Vate website.
11
             </p>
11
             </p>
12
             <div></div>
12
             <div></div>
13
           </div>
13
           </div>
41
 /* eslint-disable */
41
 /* eslint-disable */
42
 
42
 
43
 import carousel from "vue-owl-carousel";
43
 import carousel from "vue-owl-carousel";
44
+import { mapGetters } from "vuex";
44
 export default {
45
 export default {
45
   components: {
46
   components: {
46
     carousel
47
     carousel
48
+  },
49
+  computed: {
50
+    ...mapGetters("fees", ["getListingFee"])
47
   }
51
   }
48
 };
52
 };
49
 </script>
53
 </script>

+ 3
- 1
src/components/timeshare/sell/contentSection.vue View File

819
     refAgent() {
819
     refAgent() {
820
       return this.sellItem && this.sellItem.referedByAgent;
820
       return this.sellItem && this.sellItem.referedByAgent;
821
     },
821
     },
822
+    ...mapGetters("fees", ["getListingFee"]),
822
     filteredResort() {
823
     filteredResort() {
823
       let list = [];
824
       let list = [];
824
       if (this.sellItem && this.sellItem.region && this.sellItem.region.regionCode) {
825
       if (this.sellItem && this.sellItem.region && this.sellItem.region.regionCode) {
876
       } else this.$router.push("/user/login");
877
       } else this.$router.push("/user/login");
877
     },
878
     },
878
     paygateRedirect() {
879
     paygateRedirect() {
880
+      var amount = this.getListingFee.amount;
879
       var paymentObj = {
881
       var paymentObj = {
880
         timeshareWeekId: this.sellItem.id, // this.sellItem.Id,
882
         timeshareWeekId: this.sellItem.id, // this.sellItem.Id,
881
         propertyId: 0,
883
         propertyId: 0,
882
         creatydById: Log.getUser().id, //Log.getUser().id,
884
         creatydById: Log.getUser().id, //Log.getUser().id,
883
-        amount: 380.0,
885
+        amount: amount,
884
         paymentStatus: "",
886
         paymentStatus: "",
885
         paymentToken: ""
887
         paymentToken: ""
886
       };
888
       };

+ 9
- 3
src/main.js View File

9
 import * as VueGoogleMaps from "vue2-google-maps";
9
 import * as VueGoogleMaps from "vue2-google-maps";
10
 import Vuetify from "vuetify";
10
 import Vuetify from "vuetify";
11
 import VueShareSocial from "vue-share-social";
11
 import VueShareSocial from "vue-share-social";
12
+import VueCurrencyInput from "vue-currency-input";
12
 
13
 
13
 Vue.use(VueShareSocial);
14
 Vue.use(VueShareSocial);
14
 Vue.use(EvaIcons);
15
 Vue.use(EvaIcons);
15
 Vue.use(Vuetify);
16
 Vue.use(Vuetify);
17
+
16
 Vue.use(VueGoogleMaps, {
18
 Vue.use(VueGoogleMaps, {
17
   load: {
19
   load: {
18
     key: "AIzaSyD8k_Kwml_C8IDfs-gX8JFV8acli3L9cAE",
20
     key: "AIzaSyD8k_Kwml_C8IDfs-gX8JFV8acli3L9cAE",
27
 });
29
 });
28
 Vue.config.productionTip = false;
30
 Vue.config.productionTip = false;
29
 //axios.defaults.baseURL = "http://localhost:57260";
31
 //axios.defaults.baseURL = "http://localhost:57260";
30
-//axios.defaults.baseURL = "http://training.provision-sa.com:82";
31
-axios.defaults.baseURL = "http://localhost:8080/";
32
+axios.defaults.baseURL = "http://training.provision-sa.com:82";
33
+//axios.defaults.baseURL = "http://localhost:8080/";
32
 
34
 
33
 Vue.prototype.$axios = axios;
35
 Vue.prototype.$axios = axios;
34
-
36
+const pluginOptions = {
37
+  /* see config reference */
38
+  globalOptions: { currency: ["ZAR", null, { prefix: "R" }][2] }
39
+};
40
+Vue.use(VueCurrencyInput, pluginOptions);
35
 Vue.prototype.$http = axios;
41
 Vue.prototype.$http = axios;
36
 const token = localStorage.getItem("token");
42
 const token = localStorage.getItem("token");
37
 if (token) {
43
 if (token) {

+ 12
- 6
src/router/index.js View File

17
 
17
 
18
 import PropertySearch from "../components/property/propertySearchPage.vue";
18
 import PropertySearch from "../components/property/propertySearchPage.vue";
19
 import PropertyPage from "../components/property/propertyPage.vue";
19
 import PropertyPage from "../components/property/propertyPage.vue";
20
-import PropertyEdit from "../components/property/propertyeditPage.vue";
20
+import PropertyEdit from "../components/property/editProperty/editProperty.vue";
21
 
21
 
22
 import PropertyCreate from "../components/property/propertyCreate.vue";
22
 import PropertyCreate from "../components/property/propertyCreate.vue";
23
 import CommercialCreate from "../components/property/commercial/createProperty/commercialCreate.vue";
23
 import CommercialCreate from "../components/property/commercial/createProperty/commercialCreate.vue";
24
 import ResidentialCreate from "../components/property/residential/createProperty/residentialCreate.vue";
24
 import ResidentialCreate from "../components/property/residential/createProperty/residentialCreate.vue";
25
 import ListProperty from "../components/property/ListProperty/listPropertyPage.vue";
25
 import ListProperty from "../components/property/ListProperty/listPropertyPage.vue";
26
 
26
 
27
-import PropertyList from "../components/property/propertyList.vue";
27
+import PropertyAdminList from "../components/admin/property/propertyAdmin.vue";
28
 import PropertyTypeList from "../components/admin/property/propertyTypeList.vue";
28
 import PropertyTypeList from "../components/admin/property/propertyTypeList.vue";
29
 import PropertyType from "../components/admin/property/propertyTypeEdit.vue";
29
 import PropertyType from "../components/admin/property/propertyTypeEdit.vue";
30
 import UserDefinedGroups from "../components/admin/property/userDefinedGroupsPage.vue";
30
 import UserDefinedGroups from "../components/admin/property/userDefinedGroupsPage.vue";
48
 import changeLogPage from "../components/admin/status/changeLogPage.vue";
48
 import changeLogPage from "../components/admin/status/changeLogPage.vue";
49
 import UnitConfiguration from "../components/admin/unitConfiguration/unitConfigurationPage.vue";
49
 import UnitConfiguration from "../components/admin/unitConfiguration/unitConfigurationPage.vue";
50
 import agentManagementPage from "../components/admin/status/agentsUserManagementPage.vue";
50
 import agentManagementPage from "../components/admin/status/agentsUserManagementPage.vue";
51
+import Fees from "../components/admin/fees/feesPage.vue";
51
 
52
 
52
 import ResortPage from "../components/timeshare/resort/resortPage.vue";
53
 import ResortPage from "../components/timeshare/resort/resortPage.vue";
53
 import UnitPage from "../components/timeshare/resort/unit/unitPage.vue";
54
 import UnitPage from "../components/timeshare/resort/unit/unitPage.vue";
195
       component: PropertyCreate
196
       component: PropertyCreate
196
     },
197
     },
197
     {
198
     {
198
-      path: "/property/edit",
199
+      path: "/property/edit/:id",
199
       name: "PropertyEdit",
200
       name: "PropertyEdit",
200
       component: PropertyEdit
201
       component: PropertyEdit
201
     },
202
     },
202
     {
203
     {
203
-      path: "/properties",
204
-      name: "PropertyListAdmin",
205
-      component: PropertyList
204
+      path: "/PropertyAdmin",
205
+      name: "PropertyAdminList",
206
+      component: PropertyAdminList
206
     },
207
     },
207
     {
208
     {
208
       path: "/propertyTypes/list",
209
       path: "/propertyTypes/list",
372
       name: "SearchLog",
373
       name: "SearchLog",
373
       component: searchLog
374
       component: searchLog
374
     },
375
     },
376
+    {
377
+      path: "/fees",
378
+      name: "fees",
379
+      component: Fees
380
+    },
375
     {
381
     {
376
       path: "/carousel",
382
       path: "/carousel",
377
       name: "carousel",
383
       name: "carousel",

+ 2
- 0
src/store/index.js View File

33
 import PlaceHolderFormat from "./modules/misc/placeHolderFormat";
33
 import PlaceHolderFormat from "./modules/misc/placeHolderFormat";
34
 import Bank from "./modules/user/bank";
34
 import Bank from "./modules/user/bank";
35
 import bank from "./modules/user/bank";
35
 import bank from "./modules/user/bank";
36
+import Fees from "./modules/financial/fees";
36
 
37
 
37
 Vue.use(Vuex);
38
 Vue.use(Vuex);
38
 /* eslint no-param-reassign: ["error", { "props": false }] */
39
 /* eslint no-param-reassign: ["error", { "props": false }] */
68
     campaign: CampaignModule,
69
     campaign: CampaignModule,
69
     campaignItem: CampaignItemModule,
70
     campaignItem: CampaignItemModule,
70
     placeHolderFormat: PlaceHolderFormat,
71
     placeHolderFormat: PlaceHolderFormat,
72
+    fees: Fees,
71
     bank: bank
73
     bank: bank
72
   }
74
   }
73
 });
75
 });

+ 28
- 0
src/store/modules/financial/fees.js View File

1
+/* eslint-disable */
2
+import axios from "axios";
3
+
4
+export default {
5
+  namespaced: true,
6
+  state: {
7
+    listingFee: []
8
+  },
9
+  mutations: {
10
+    getListingFee: (state, fee) => (state.listingFee = fee),
11
+    newListingFee: (state, fee) => (state.listingFee = fee)
12
+  },
13
+  getters: {
14
+    getListingFee: state => state.listingFee
15
+  },
16
+  actions: {
17
+    async retrieveListingFee({ commit }) {
18
+      await axios.get("api/fees/listingFee").then(res => {
19
+        commit("getListingFee", res.data);
20
+      });
21
+    },
22
+    async setListingFee({ commit }, fee) {
23
+      await axios.post("api/fees/listingFee", fee).then(res => {
24
+        commit("newListingFee", res.data);
25
+      });
26
+    }
27
+  }
28
+};

+ 41
- 4
src/store/modules/property/property.js View File

1
 import axios from "axios";
1
 import axios from "axios";
2
 import { Date } from "core-js";
2
 import { Date } from "core-js";
3
+import { result } from "lodash";
4
+import { resolve } from "core-js/fn/promise";
3
 
5
 
4
 export default {
6
 export default {
5
   namespaced: true,
7
   namespaced: true,
6
   state: {
8
   state: {
9
+    statuses: [],
7
     property: {},
10
     property: {},
8
     propertyImages: [],
11
     propertyImages: [],
9
     propertyTypes: [],
12
     propertyTypes: [],
41
     },
44
     },
42
     clearPropertyImages(state) {
45
     clearPropertyImages(state) {
43
       state.propertyImages = [];
46
       state.propertyImages = [];
47
+    },
48
+    setStatuses(state, stats) {
49
+      state.statuses = stats;
44
     }
50
     }
45
   },
51
   },
46
   getters: {},
52
   getters: {},
47
   actions: {
53
   actions: {
48
-    getProperty({ commit }, id) {
54
+    getStatuses({ commit }) {
49
       axios
55
       axios
50
-        .get(`/api/Property/getDetailed/${id}`)
51
-        .then(result => commit("setProperty", result.data))
52
-        .catch(console.error);
56
+        .get("/api/property/GetPropertyStatuses")
57
+        .then(result => commit("setStatuses", result.data));
58
+    },
59
+    getProperty({ commit, dispatch }, id) {
60
+      return new Promise((resolve, reject) => {
61
+        axios
62
+          .get(`/api/Property/getDetailed/${id}`)
63
+          .then(result => {
64
+            commit("setProperty", result.data);
65
+            dispatch("getPropertyTypes", result.data.propertyUsageType);
66
+            dispatch("getPropertyImages", result.data.id);
67
+            dispatch("getSavedPropertyFields", result.data.id);
68
+            dispatch("getStatuses");
69
+            resolve();
70
+          })
71
+          .catch(error => reject(new Error(error.message)));
72
+      });
53
     },
73
     },
54
     getPropertyImages({ commit }, id) {
74
     getPropertyImages({ commit }, id) {
55
       axios
75
       axios
85
         .get(`/api/propertyFields/PropertyType/${propertyType}`)
105
         .get(`/api/propertyFields/PropertyType/${propertyType}`)
86
         .then(response => commit("setPropertyFields", response.data));
106
         .then(response => commit("setPropertyFields", response.data));
87
     },
107
     },
108
+    getSavedPropertyFields({ commit }, id) {
109
+      axios
110
+        .get(`/api/PropertyFields/GetSavedPropertyUserFields/${id}`)
111
+        .then(result => commit("setPropertyFields", result.data));
112
+    },
88
     getPropertySavedOverviewFields({ commit }, id) {
113
     getPropertySavedOverviewFields({ commit }, id) {
89
       axios
114
       axios
90
         .get(`/api/PropertyFields/GetSavedValues/Residential/Property Overview/${id}`)
115
         .get(`/api/PropertyFields/GetSavedValues/Residential/Property Overview/${id}`)
151
         .get(`/api/PropertyImage/GetProperySavedImages/${id}`)
176
         .get(`/api/PropertyImage/GetProperySavedImages/${id}`)
152
         .then(result => commit("setPropertyImages", result.data))
177
         .then(result => commit("setPropertyImages", result.data))
153
         .catch(console.error);
178
         .catch(console.error);
179
+    },
180
+    updateProperty({ commit }, property) {
181
+      return new Promise((resolve, reject) => {
182
+        axios
183
+          .put("/api/property", property)
184
+          .then(response => {
185
+            resolve();
186
+          })
187
+          .catch(() => {
188
+            reject(console.error);
189
+          });
190
+      });
154
     }
191
     }
155
   }
192
   }
156
 };
193
 };

+ 33
- 33
src/store/modules/property/propertyAdmin.js View File

1
-import axios from 'axios';
1
+import axios from "axios";
2
 
2
 
3
 export default {
3
 export default {
4
   namespaced: true,
4
   namespaced: true,
6
     userDefinedGroups: [],
6
     userDefinedGroups: [],
7
     userDefinedGroup: {
7
     userDefinedGroup: {
8
       id: 0,
8
       id: 0,
9
-      description: '',
9
+      description: "",
10
       usageType: 0,
10
       usageType: 0,
11
       rank: 0,
11
       rank: 0,
12
-      fields: [],
12
+      fields: []
13
     },
13
     },
14
     userFields: [],
14
     userFields: [],
15
     userField: {
15
     userField: {
16
       id: 0,
16
       id: 0,
17
       groupId: 0,
17
       groupId: 0,
18
-      fieldName: '',
19
-      fieldType: '',
20
-      rank: 0,
21
-    },
18
+      fieldName: "",
19
+      fieldType: "",
20
+      rank: 0
21
+    }
22
   },
22
   },
23
   mutations: {
23
   mutations: {
24
     setUserDefinedGroups(state, groups) {
24
     setUserDefinedGroups(state, groups) {
58
     clearUserGroup(state) {
58
     clearUserGroup(state) {
59
       state.userDefinedGroup = {
59
       state.userDefinedGroup = {
60
         id: 0,
60
         id: 0,
61
-        description: '',
61
+        description: "",
62
         usageType: 0,
62
         usageType: 0,
63
-        rank: 0,
63
+        rank: 0
64
       };
64
       };
65
     },
65
     },
66
     clearUserField(state) {
66
     clearUserField(state) {
67
       state.userField = {
67
       state.userField = {
68
         id: 0,
68
         id: 0,
69
-        fieldName: '',
70
-        fieldType: '',
71
-        rank: 0,
69
+        fieldName: "",
70
+        fieldType: "",
71
+        rank: 0
72
       };
72
       };
73
     },
73
     },
74
     clearUserFields(state) {
74
     clearUserFields(state) {
75
       state.userFields = [];
75
       state.userFields = [];
76
-    },
76
+    }
77
   },
77
   },
78
   getters: {},
78
   getters: {},
79
   actions: {
79
   actions: {
80
     getUserDefinedGroups({ commit }) {
80
     getUserDefinedGroups({ commit }) {
81
       axios
81
       axios
82
-        .get('/api/UserDefinedGroup')
83
-        .then(result => commit('setUserDefinedGroups', result.data))
82
+        .get("/api/UserDefinedGroup")
83
+        .then(result => commit("setUserDefinedGroups", result.data))
84
         .catch(console.error);
84
         .catch(console.error);
85
     },
85
     },
86
     getUserDefinedGroup({ commit }, id) {
86
     getUserDefinedGroup({ commit }, id) {
87
       axios
87
       axios
88
         .get(`/api/UserDefinedGroup/${id}`)
88
         .get(`/api/UserDefinedGroup/${id}`)
89
-        .then(result => commit('setUserDefinedGroup', result.data))
89
+        .then(result => commit("setUserDefinedGroup", result.data))
90
         .catch(console.error);
90
         .catch(console.error);
91
     },
91
     },
92
     getUserFields({ commit }, groupId) {
92
     getUserFields({ commit }, groupId) {
93
       axios
93
       axios
94
         .get(`/api/UserDefinedField/group/${groupId}`)
94
         .get(`/api/UserDefinedField/group/${groupId}`)
95
-        .then(result => commit('setUserFields', result.data))
95
+        .then(result => commit("setUserFields", result.data))
96
         .catch(console.error);
96
         .catch(console.error);
97
     },
97
     },
98
     getUserField({ commit }, id) {
98
     getUserField({ commit }, id) {
99
       axios
99
       axios
100
         .get(`/api/UserDefinedField/${id}`)
100
         .get(`/api/UserDefinedField/${id}`)
101
-        .then(result => commit('setUserField', result.data))
101
+        .then(result => commit("setUserField", result.data))
102
         .catch(console.error);
102
         .catch(console.error);
103
     },
103
     },
104
     saveUserDefinedGroup({ commit }, item) {
104
     saveUserDefinedGroup({ commit }, item) {
105
       axios
105
       axios
106
-        .post('/api/UserDefinedGroup', item)
107
-        .then(response => commit('addUserDefinedGroups', response.data))
106
+        .post("/api/UserDefinedGroup", item)
107
+        .then(response => commit("addUserDefinedGroups", response.data))
108
         .catch(console.error);
108
         .catch(console.error);
109
     },
109
     },
110
     updateUserDefinedGroup({ commit }, item) {
110
     updateUserDefinedGroup({ commit }, item) {
111
       axios
111
       axios
112
-        .put('/api/UserDefinedGroup', item)
113
-        .then(response => commit('updateUserDefinedGroups', response.data))
112
+        .put("/api/UserDefinedGroup", item)
113
+        .then(response => commit("updateUserDefinedGroups", response.data))
114
         .catch(console.error);
114
         .catch(console.error);
115
     },
115
     },
116
     saveUserField({ commit }, item) {
116
     saveUserField({ commit }, item) {
117
       axios
117
       axios
118
-        .post('/api/UserDefinedField', item)
119
-        .then(response => commit('addUserField', response.data))
118
+        .post("/api/UserDefinedField", item)
119
+        .then(response => commit("addUserField", response.data))
120
         .catch(console.error);
120
         .catch(console.error);
121
     },
121
     },
122
     updateUserField({ commit }, item) {
122
     updateUserField({ commit }, item) {
123
       axios
123
       axios
124
-        .put('/api/UserDefinedField', item)
125
-        .then(response => commit('updateUserFields', response.data))
124
+        .put("/api/UserDefinedField", item)
125
+        .then(response => commit("updateUserFields", response.data))
126
         .catch(console.error);
126
         .catch(console.error);
127
     },
127
     },
128
     deleteUserDefinedGroup({ commit }, id) {
128
     deleteUserDefinedGroup({ commit }, id) {
129
       axios
129
       axios
130
         .delete(`/api/UserDefinedGroup/${id}`)
130
         .delete(`/api/UserDefinedGroup/${id}`)
131
-        .then(result => commit('removeUserDefinedGroup', id))
131
+        .then(result => commit("removeUserDefinedGroup", id))
132
         .catch(console.error);
132
         .catch(console.error);
133
     },
133
     },
134
     deleteUserField({ commit }, id) {
134
     deleteUserField({ commit }, id) {
135
       axios
135
       axios
136
         .delete(`/api/UserDefinedField/${id}`)
136
         .delete(`/api/UserDefinedField/${id}`)
137
-        .then(result => commit('removeUserField', id))
137
+        .then(result => commit("removeUserField", id))
138
         .catch(console.error);
138
         .catch(console.error);
139
     },
139
     },
140
     clearUserGroup({ commit }) {
140
     clearUserGroup({ commit }) {
141
-      commit('clearUserGroup');
141
+      commit("clearUserGroup");
142
     },
142
     },
143
     clearUserField({ commit }) {
143
     clearUserField({ commit }) {
144
-      commit('clearUserField');
144
+      commit("clearUserField");
145
     },
145
     },
146
     clearUserFields({ commit }) {
146
     clearUserFields({ commit }) {
147
-      commit('clearUserFields');
148
-    },
149
-  },
147
+      commit("clearUserFields");
148
+    }
149
+  }
150
 };
150
 };

+ 35
- 16
src/store/modules/property/propertyLists.js View File

1
-import axios from 'axios';
1
+import axios from "axios";
2
 
2
 
3
 export default {
3
 export default {
4
   namespaced: true,
4
   namespaced: true,
5
   state: {
5
   state: {
6
     properties: [],
6
     properties: [],
7
-    propertiesLive: [],
7
+    propertiesLive: []
8
   },
8
   },
9
   mutations: {
9
   mutations: {
10
     setProperties(state, properties) {
10
     setProperties(state, properties) {
11
       state.properties = properties;
11
       state.properties = properties;
12
     },
12
     },
13
     removeProperties(state, id) {
13
     removeProperties(state, id) {
14
-      state.properties.pop(state.properties.find(item => item.id === id));
14
+      let index = 0;
15
+      for (let i = 0; i < state.properties.length; i++) {
16
+        if (state.properties[i].id == id) {
17
+          index = i;
18
+        }
19
+      }
20
+      state.properties.splice(index, 1);
15
     },
21
     },
16
     updatePropertyPublish(state, curItem) {
22
     updatePropertyPublish(state, curItem) {
17
-      state.properties.find(item => item.id === curItem.id).publish = 'Yes';
23
+      state.properties.find(item => item.id === curItem.id).isPublished = true;
18
     },
24
     },
19
     updatePropertyUnpublish(state, curItem) {
25
     updatePropertyUnpublish(state, curItem) {
20
-      state.properties.find(item => item.id === curItem.id).publish = 'No';
26
+      state.properties.find(item => item.id === curItem.id).isPublished = false;
21
     },
27
     },
22
     setLiveProperties(state, items) {
28
     setLiveProperties(state, items) {
23
       state.propertiesLive = items;
29
       state.propertiesLive = items;
24
-    },
30
+    }
25
   },
31
   },
26
   getters: {},
32
   getters: {},
27
   actions: {
33
   actions: {
34
+    getAdminProperties({ commit }, userId) {
35
+      return new Promise((resolve, reject) => {
36
+        axios
37
+          .get(`/api/property/GetAdminProperties/${userId}`)
38
+          .then(result => {
39
+            commit("setProperties", result.data);
40
+            resolve();
41
+          })
42
+          .catch(() => {
43
+            reject(console.error);
44
+          });
45
+      });
46
+    },
28
     getProperties({ commit }, item) {
47
     getProperties({ commit }, item) {
29
       console.log(`/api/property/GetPropertyList/${item}`);
48
       console.log(`/api/property/GetPropertyList/${item}`);
30
       axios
49
       axios
31
         .get(`/api/property/GetPropertyList/${item}`) // .get(`/api/property/${item.propertyType}/${item.user}`)
50
         .get(`/api/property/GetPropertyList/${item}`) // .get(`/api/property/${item.propertyType}/${item.user}`)
32
-        .then(result => commit('setProperties', result.data))
51
+        .then(result => commit("setProperties", result.data))
33
         .catch(console.error);
52
         .catch(console.error);
34
     },
53
     },
35
     getLiveProperties({ commit }) {
54
     getLiveProperties({ commit }) {
36
       axios
55
       axios
37
-        .get('/api/property/GetLivePropertyList') // .get(`/api/property/${item.propertyType}/${item.user}`)
38
-        .then(result => commit('setLiveProperties', result.data))
56
+        .get("/api/property/GetLivePropertyList") // .get(`/api/property/${item.propertyType}/${item.user}`)
57
+        .then(result => commit("setLiveProperties", result.data))
39
         .catch(console.error);
58
         .catch(console.error);
40
     },
59
     },
41
     deleteProperty({ commit }, id) {
60
     deleteProperty({ commit }, id) {
42
       axios
61
       axios
43
         .delete(`/api/property/${id}`)
62
         .delete(`/api/property/${id}`)
44
-        .then(commit('removeProperties', id))
63
+        .then(commit("removeProperties", id))
45
         .catch(console.error);
64
         .catch(console.error);
46
     },
65
     },
47
     publishProperty({ commit }, item) {
66
     publishProperty({ commit }, item) {
48
       axios
67
       axios
49
-        .put('/api/property/publishproperty', item)
50
-        .then(result => commit('updatePropertyPublish', item))
68
+        .put("/api/property/publishproperty", item)
69
+        .then(result => commit("updatePropertyPublish", item))
51
         .catch(console.error);
70
         .catch(console.error);
52
     },
71
     },
53
     unpublishProperty({ commit }, item) {
72
     unpublishProperty({ commit }, item) {
54
       axios
73
       axios
55
-        .put('/api/property/unpublishproperty', item)
56
-        .then(result => commit('updatePropertyUnpublish', item))
74
+        .put("/api/property/unpublishproperty", item)
75
+        .then(result => commit("updatePropertyUnpublish", item))
57
         .catch(console.error);
76
         .catch(console.error);
58
-    },
59
-  },
77
+    }
78
+  }
60
 };
79
 };

+ 1
- 1
src/store/modules/property/propertySearch.js View File

105
             commit("updateSearch", result.data);
105
             commit("updateSearch", result.data);
106
             resolve();
106
             resolve();
107
           })
107
           })
108
-          .catch(errro => reject(new Error(error.message)));
108
+          .catch(error => reject(new Error(error.message)));
109
       });
109
       });
110
     },
110
     },
111
     searchLatestProperties({ commit }) {
111
     searchLatestProperties({ commit }) {

Loading…
Cancel
Save