@burh/nuxt-core 1.0.371 → 1.0.373

package/components/burh-ds/Modals/AddCustomerModal.vue

@@ -104,22 +104,23 @@
 									v-model="city"
 									placeholder="Cidade"
 									filterable
-									:auto-complete="`${city}-new`"
+									remote
+									:remote-method="getCityListFiltered"
+									:auto-complete="`new-${city}`"
 									:error="errors[0]"
 									:valid="errors.length ? true : false"
+									:loading="isSelectLoading"
 								>
 									<div class="text-center" slot="empty">
 										<p class="small mb-2 mt-3">Nenhuma cidade encontrada</p>
 									</div>
 
 									<el-option
-										v-for="city in cityList"
+										v-for="city in cityListFiltered"
 										:key="city.value"
 										:value="city.value"
 										:label="city.value"
-									>
-										{{ city.value }}
-									</el-option>
+									/>
 								</el-select>
 							</div>
 						</validation-provider>
@@ -200,6 +201,7 @@ export default {
 		isActive(to) {
 			if (!to) {
 				this.resetFields();
+				this.cityList = [];
 			}
 		},
 		userData(to) {
@@ -227,10 +229,10 @@ export default {
 			cep: '',
 			address: '',
 			city: '',
-
 			isEditing: false,
-
+			isSelectLoading: false,
 			cityList: [],
+			cityListFiltered: [],
 			permissions: false,
 			permessionsData: [
 				{
@@ -278,15 +280,21 @@ export default {
 			});
 		},
 		async getCityList() {
-			let cityList = await fetch('https://raw.githubusercontent.com/Skuth/cidades-com-estados-brasil/main/cidades.json')
+			this.cityList = await fetch('https://raw.githubusercontent.com/Skuth/cidades-com-estados-brasil/main/cidades.json')
 				.then(res => res.json())
 				.catch(() => {});
-
-			this.cityList = cityList.map(city => {
-				return {
-					value: `${city.city} / ${city.uf}`
-				};
-			});
+		},
+		getCityListFiltered(query) {
+			if (query && query.length > 3) {
+				this.cityListFiltered = this.cityList.filter(city => String(city.city).toLowerCase().startsWith(query.toLowerCase()));
+				this.cityListFiltered = this.cityListFiltered.map(city => {
+					return {
+						value: `${city.city} / ${city.uf}`
+					};
+				});
+			} else {
+				this.cityListFiltered = [];
+			}
 		},
 		async checkZipcode() {
 			await this.$services.company

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@burh/nuxt-core",
-  "version": "1.0.371",
+  "version": "1.0.373",
   "description": "Design System and Components.",
   "author": "Burh",
   "scripts": {