Merge branch 'master' of http://provision-sa.co.za:3000/Provision/UnivateProperties into master

src/components/property/commercial/createProperty/commercialCreateNew.vue

             >
               <option value="0">Please select type *</option>
               <option v-for="item in propertyTypes" :value="item.id" :key="item.id">
-                {{
-                item.description
-                }}
+                {{ item.description }}
               </option>
             </select>
           </div>
                     for="price"
                     class="uniSelectLabel"
                     style="text-transform:uppercase; margin-left:17px; background-color:white"
-                  >{{ salesType }} Price</label>
+                    >{{ salesType }} Price</label
+                  >
                 </div>
                 <float-label label="price">
                   <currency-input
                     onclick="this.setSelectionRange(0, this.value.length)"
                     name="price"
-                    :value="value"
-                    @input="value = $event"
+                    :value="property.price"
+                    @input="property.price = $event"
                     v-model="property.price"
                     id="price"
                     class="form-control uniInput"
                   class="form-control uniInput"
                   type="text"
                   name="streetNumber"
-                  id="unit"
+                  id="streetNumber"
                   v-model="property.streetNumber"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="streetName"
-                  id="unit"
+                  id="streetName"
                   v-model="property.streetName"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="suburb"
-                  id="unit"
+                  id="suburb"
                   v-model="property.suburb"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="city"
-                  id="unit"
+                  id="city"
                   v-model="property.city"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="province"
-                  id="unit"
+                  id="province"
                   v-model="property.province"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="postalCode"
-                  id="unit"
+                  id="postalCode"
                   v-model="property.postalCode"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="country"
-                  id="unit"
+                  id="country"
                   v-model="property.country"
                 />
               </div>
             </div>
             <div class="row my-3">
               <div class="col-md-12">
-                <button type="button" @click="clearAddress()" class="btn-solid-blue">Clear Address</button>
+                <button type="button" @click="clearAddress()" class="btn-solid-blue">
+                  Clear Address
+                </button>
               </div>
             </div>
           </div>
         <div v-for="item in propertyFields" :key="item.id">
           <div v-if="item.name === 'Commercial Fields'">
             <UserField
-              :fields="item.fields"
+              :fields="sortFields"
               :id="item.name"
               @UpdateUserDefinedFields="UpdateUserDefinedFields"
               :fieldValues="item.fields"
             />
           </div>
         </div>
+
         <div class="row">
           <div class="col-sm-12">
             <div class="section-header">
           :savedImages="propertyImages"
           @DefaultImage="UpdateDefaultImage"
         />
-        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">Save</button>
+        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">
+          Save
+        </button>
         <div v-if="showPropertyTypeError">
-          <p class="alert myError">Missing fields. Please fill in all required fields. Marked with *</p>
+          <p class="alert myError">
+            Missing fields. Please fill in all required fields. Marked with *
+          </p>
         </div>
         <div v-if="wait" id="preloader"></div>
       </div>
     ImageLoad,
     VueEditor,
     carouselSection,
-    mapSection,
+    mapSection
   },
   data() {
     return {
       customToolbar: [
         [{ header: [false, 1, 2, 3, 4, 5, 6] }],
         ["bold", "italic", "underline", "strike"],
-        [
-          { align: "" },
-          { align: "center" },
-          { align: "right" },
-          { align: "justify" },
-        ],
+        [{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }],
         [{ list: "ordered" }, { list: "bullet" }, { list: "check" }],
         [{ script: "sub" }, { script: "super" }],
-        [{ indent: "-1" }, { indent: "+1" }],
+        [{ indent: "-1" }, { indent: "+1" }]
       ],
       error: "",
       addressSet: false,
       showPropertyTypeError: false,
       showDateError: false,
       user: Log.getUser(),
-      mayEdit: Log.isLoggedIn(),
+      mayEdit: Log.isLoggedIn()
     };
   },
   methods: {
       "getPropertyEditDisplay",
       "getPropertySavedOverviewFields",
       "getPropertySavedFields",
-      "getSavedPropertyData",
+      "getSavedPropertyData"
     ]),
     updateLocation(place) {
       this.addressSet = true;
     TypeChanged() {
       this.property.propertyUsageType = this.propertyType;
     },
+
     SubmitData() {
       if (this.property.propertyTypeId === 0) {
         this.showPropertyTypeError = true;
       }
 
-      if (
-        this.salesType === "Rental" &&
-        this.property.dateAvailable === "undef"
-      ) {
+      if (this.salesType === "Rental" && this.property.dateAvailable === "undef") {
         this.showDateError = true;
       }
 
         }
         this.property.propertyImages.push({
           image: this.images[i],
-          isDefault: setAsDefault,
+          isDefault: setAsDefault
         });
       }
       this.property.propertyUserFields = this.propertyFieldValues;
         this.property.userId = this.user.id;
       }
 
-      this.property.propertyUserFields.forEach((item) => {
+      this.property.propertyUserFields.forEach(item => {
         if (item.value === true) {
           item.value = "yes";
         } else if (item.value === false) {
       console.log(this.property);
 
       this.saveProperty(this.property)
-        .then((fulfilled) => {
-          this.$router.push(
-            `/property/commercial/property/${fulfilled.data.id}`
-          );
+        .then(fulfilled => {
+          this.$router.push(`/property/commercial/property/${fulfilled.data.id}`);
         })
-        .catch((error) => {
+        .catch(error => {
           console.log(error.message);
         });
     },
     },
     UpdateUserDefinedFields(item) {
       let update = false;
-      this.propertyFieldValues.forEach((element) => {
+      this.propertyFieldValues.forEach(element => {
         if (element.userDefinedFieldId === item.userDefinedFieldId) {
           element.value = item.value;
           update = true;
       this.property.postalCode = undefined;
       this.property.addressUrl = undefined;
       this.property.propertCoords = undefined;
-    },
+    }
   },
   mounted() {
     this.wait = false;
       "propertyOverviewFields",
       "propertyFields",
       "property",
-      "propertyImages",
+      "propertyImages"
     ]),
     ...mapState("authentication", ["user"]),
     ...mapGetters("fees", ["getListingFee"]),
+    sortFields() {
+      var display = [];
+
+      display = this.propertyFields[0].fields.sort((a, b) => (a.rank > b.rank ? 1 : -1));
+      console.log(display);
+
+      return display;
+    },
     SalesTypeChanged() {
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
       // this.propertyType = this.$route.params.propType;
       this.getPropertyTypes(this.propertyType);
 
       return this.propertyType;
-    },
+    }
   },
   watch: {
     SalesTypeChanged() {
       return null;
-    },
-  },
+    }
+  }
 };
 </script>
 

src/components/property/residential/createProperty/residentialCreateNew.vue

             >
               <option value="0">Please select type *</option>
               <option v-for="item in propertyTypes" :value="item.id" :key="item.id">
-                {{
-                item.description
-                }}
+                {{ item.description }}
               </option>
             </select>
           </div>
                     for="price"
                     class="uniSelectLabel"
                     style="text-transform:uppercase; margin-left:17px; background-color:white"
-                  >{{ salesType }} Price</label>
+                    >{{ salesType }} Price</label
+                  >
                 </div>
                 <float-label label="Price">
-                  <currency-input
-                    onclick="this.setSelectionRange(0, this.value.length)"
-                    name="price"
-                    :value="value"
-                    @input="value = $event"
-                    v-model="property.price"
-                    id="price"
-                    class="form-control uniInput"
-                  />
+                  <currency-input <<<<<<< HEAD ======= onclick="this.setSelectionRange(0,
+                  this.value.length)" >>>>>>> 6bbfd86e089da859d019dcbda5cc0fe053af8db2 name="price"
+                  :value="property.price" @input="property.price = $event" v-model="property.price"
+                  id="price" class="form-control uniInput" />
                 </float-label>
               </div>
               <div v-if="salesType === 'Rental'" class="col-md-6">
                   class="form-control uniInput"
                   type="text"
                   name="streetNumber"
-                  id="unit"
+                  id="streetNumber"
                   v-model="property.streetNumber"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="streetName"
-                  id="unit"
+                  id="streetName"
                   v-model="property.streetName"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="suburb"
-                  id="unit"
+                  id="suburb"
                   v-model="property.suburb"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="city"
-                  id="unit"
+                  id="city"
                   v-model="property.city"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="province"
-                  id="unit"
+                  id="province"
                   v-model="property.province"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="postalCode"
-                  id="unit"
+                  id="postalCode"
                   v-model="property.postalCode"
                 />
               </div>
                   class="form-control uniInput"
                   type="text"
                   name="country"
-                  id="unit"
+                  id="country"
                   v-model="property.country"
                 />
               </div>
             </div>
             <div class="row my-3">
               <div class="col-md-12">
-                <button type="button" @click="clearAddress()" class="btn-solid-blue">Clear Address</button>
+                <button type="button" @click="clearAddress()" class="btn-solid-blue">
+                  Clear Address
+                </button>
               </div>
             </div>
           </div>
           :fields="propertyOverviewFields[0].fields"
           @UpdateUserDefinedFields="UpdateUserDefinedFields"
           :id="1"
-        ></UserField>
-        <div class="row">
+        ></UserField> -->
+        <!-- <div class="row">
           <div class="col-md-12">
             <div v-for="item in propertyFields" :key="item.id">
               <div class="row">
           :savedImages="propertyImages"
           @DefaultImage="UpdateDefaultImage"
         />
-        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">Save</button>
+        <button v-if="!wait" type="button" @click="SubmitData()" class="btn-solid-blue">
+          Save
+        </button>
         <div v-if="showPropertyTypeError">
-          <p class="alert myError">Missing fields. Please fill in all required fields. Marked with *</p>
+          <p class="alert myError">
+            Missing fields. Please fill in all required fields. Marked with *
+          </p>
         </div>
         <div v-if="wait" id="preloader"></div>
       </div>
     ImageLoad,
     VueEditor,
     carouselSection,
-    mapSection,
+    mapSection
   },
   data() {
     return {
       customToolbar: [
         [{ header: [false, 1, 2, 3, 4, 5, 6] }],
         ["bold", "italic", "underline", "strike"],
-        [
-          { align: "" },
-          { align: "center" },
-          { align: "right" },
-          { align: "justify" },
-        ],
+        [{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }],
         [{ list: "ordered" }, { list: "bullet" }, { list: "check" }],
         [{ script: "sub" }, { script: "super" }],
-        [{ indent: "-1" }, { indent: "+1" }],
+        [{ indent: "-1" }, { indent: "+1" }]
       ],
       error: "",
       addressSet: false,
       showPropertyTypeError: false,
       showDateError: false,
       user: Log.getUser(),
-      mayEdit: Log.isLoggedIn(),
+      mayEdit: Log.isLoggedIn()
     };
   },
   methods: {
       "getPropertyEditDisplay",
       "getPropertySavedOverviewFields",
       "getPropertySavedFields",
-      "getSavedPropertyData",
+      "getSavedPropertyData"
     ]),
     updateLocation(place) {
       this.addressSet = true;
         this.showPropertyTypeError = true;
       }
 
-      if (
-        this.salesType === "Rental" &&
-        this.property.dateAvailable === "undef"
-      ) {
+      if (this.salesType === "Rental" && this.property.dateAvailable === "undef") {
         this.showDateError = true;
       }
 
         }
         this.property.propertyImages.push({
           image: this.images[i],
-          isDefault: setAsDefault,
+          isDefault: setAsDefault
         });
       }
       this.property.propertyUserFields = this.propertyFieldValues;
       if (this.user) {
         this.property.userId = this.user.id;
       }
-      this.property.propertyUserFields.forEach((item) => {
+      this.property.propertyUserFields.forEach(item => {
         if (item.value === true) {
           item.value = "yes";
         } else if (item.value === false) {
       });
 
       this.saveProperty(this.property)
-        .then((fulfilled) => {
-          this.$router.push(
-            `/property/residential/property/${fulfilled.data.id}`
-          );
+        .then(fulfilled => {
+          this.$router.push(`/property/residential/property/${fulfilled.data.id}`);
         })
-        .catch((error) => {
+        .catch(error => {
           console.log(error.message);
         });
     },
     },
     UpdateUserDefinedFields(item) {
       let update = false;
-      this.propertyFieldValues.forEach((element) => {
+      this.propertyFieldValues.forEach(element => {
         console.log(element);
 
         if (element.userDefinedFieldId === item.userDefinedFieldId) {
         fields.push(arr.slice(i, (i += len)));
       }
       return fields;
-    },
+    }
   },
   mounted() {
     console.log(this.propertyFields);
       "propertyOverviewFields",
       "propertyFields",
       "property",
-      "propertyImages",
+      "propertyImages"
     ]),
     ...mapState("authentication", ["user"]),
     ...mapGetters("fees", ["getListingFee"]),
+    sortFields() {
+      return this.propertyFields[0].fields.sort((a, b) => (a.rank > b.rank ? 1 : -1));
+    },
     SalesTypeChanged() {
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
       // this.propertyType = this.$route.params.propType;
     },
     userFieldsArr() {
       return this.userFieldsArrFunc(this.propertyFields, 4);
-    },
+    }
   },
   watch: {
     SalesTypeChanged() {
       return null;
-    },
-  },
+    }
+  }
 };
 </script>
 

vue.config.js

   devServer: {
     proxy: {
       "/api": {
-        // target: "http://localhost:57260/",
+        //target: "http://localhost:57260/",
         target: "http://training.provision-sa.com:82",
         changeOrigin: true
       },