Remove ajax_select from counters

counter/api.py

@@ -22,8 +22,6 @@ from ninja_extra.pagination import PageNumberPaginationExtra
 from ninja_extra.schemas import PaginatedResponseSchema
 
 from core.api_permissions import CanAccessLookup, CanView, IsRoot
-from core.models import Group
-from core.schemas import GroupSchema
 from counter.models import Counter, Product
 from counter.schemas import (
     CounterFilterSchema,
@@ -78,15 +76,3 @@ class ProductController(ControllerBase):
             .filter(archived=False)
             .values()
         )
-
-
-@api_controller("/group")
-class GroupController(ControllerBase):
-    @route.get(
-        "/search",
-        response=PaginatedResponseSchema[GroupSchema],
-        permissions=[CanAccessLookup],
-    )
-    @paginate(PageNumberPaginationExtra, page_size=50)
-    def search_group(self, search: Annotated[str, MinLen(1)]):
-        return Group.objects.filter(name__icontains=search).values()

counter/forms.py

@@ -1,10 +1,15 @@
-from ajax_select import make_ajax_field
-from ajax_select.fields import AutoCompleteSelectField, AutoCompleteSelectMultipleField
 from django import forms
 from django.utils.translation import gettext_lazy as _
 from phonenumber_field.widgets import RegionalPhoneNumberWidget
 
+from club.widgets.select import AutoCompleteSelectClub
 from core.views.forms import NFCTextInput, SelectDate, SelectDateTime
+from core.views.widgets.select import (
+    AutoCompleteSelect,
+    AutoCompleteSelectMultipleGroup,
+    AutoCompleteSelectMultipleUser,
+    AutoCompleteSelectUser,
+)
 from counter.models import (
     BillingInfo,
     Counter,
@@ -14,6 +19,11 @@ from counter.models import (
     Refilling,
     StudentCard,
 )
+from counter.widgets.select import (
+    AutoCompleteSelectMultipleCounter,
+    AutoCompleteSelectMultipleProduct,
+    AutoCompleteSelectProduct,
+)
 
 
 class BillingInfoForm(forms.ModelForm):
@@ -68,8 +78,11 @@ class GetUserForm(forms.Form):
         required=False,
         widget=NFCTextInput,
     )
-    id = AutoCompleteSelectField(
-        "users", required=False, label=_("Select user"), help_text=None
+    id = forms.CharField(
+        label=_("Select user"),
+        help_text=None,
+        widget=AutoCompleteSelectUser,
+        required=False,
     )
 
     def as_p(self):
@@ -122,8 +135,10 @@ class CounterEditForm(forms.ModelForm):
         model = Counter
         fields = ["sellers", "products"]
 
-    sellers = make_ajax_field(Counter, "sellers", "users", help_text="")
-    products = make_ajax_field(Counter, "products", "products", help_text="")
+        widgets = {
+            "sellers": AutoCompleteSelectMultipleUser,
+            "products": AutoCompleteSelectMultipleProduct,
+        }
 
 
 class ProductEditForm(forms.ModelForm):
@@ -145,44 +160,37 @@ class ProductEditForm(forms.ModelForm):
             "tray",
             "archived",
         ]
+        widgets = {
+            "parent_product": AutoCompleteSelectMultipleProduct,
+            "product_type": AutoCompleteSelect,
+            "buying_groups": AutoCompleteSelectMultipleGroup,
+            "club": AutoCompleteSelectClub,
+        }
 
-    parent_product = AutoCompleteSelectField(
-        "products", show_help_text=False, label=_("Parent product"), required=False
-    )
-    buying_groups = AutoCompleteSelectMultipleField(
-        "groups",
-        show_help_text=False,
-        help_text="",
-        label=_("Buying groups"),
-        required=True,
-    )
-    club = AutoCompleteSelectField("clubs", show_help_text=False)
-    counters = AutoCompleteSelectMultipleField(
-        "counters",
-        show_help_text=False,
-        help_text="",
+    counters = forms.ModelMultipleChoiceField(
+        help_text=None,
         label=_("Counters"),
         required=False,
+        widget=AutoCompleteSelectMultipleCounter,
+        queryset=Counter.objects.all(),
     )
 
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         if self.instance.id:
-            self.fields["counters"].initial = [
-                str(c.id) for c in self.instance.counters.all()
-            ]
+            self.fields["counters"].initial = self.instance.counters.all()
 
     def save(self, *args, **kwargs):
         ret = super().save(*args, **kwargs)
         if self.fields["counters"].initial:
-            for cid in self.fields["counters"].initial:
-                c = Counter.objects.filter(id=int(cid)).first()
-                c.products.remove(self.instance)
-                c.save()
-        for cid in self.cleaned_data["counters"]:
-            c = Counter.objects.filter(id=int(cid)).first()
-            c.products.add(self.instance)
-            c.save()
+            # Remove the product from all counter it was added to
+            # It will then only be added to selected counters
+            for counter in self.fields["counters"].initial:
+                counter.products.remove(self.instance)
+                counter.save()
+        for counter in self.cleaned_data["counters"]:
+            counter.products.add(self.instance)
+            counter.save()
         return ret
 
 
@@ -199,8 +207,7 @@ class EticketForm(forms.ModelForm):
     class Meta:
         model = Eticket
         fields = ["product", "banner", "event_title", "event_date"]
-        widgets = {"event_date": SelectDate}
-
-    product = AutoCompleteSelectField(
-        "products", show_help_text=False, label=_("Product"), required=True
-    )
+        widgets = {
+            "product": AutoCompleteSelectProduct,
+            "event_date": SelectDate,
+        }

counter/static/webpack/counter/components/ajax-select-index.ts

@@ -0,0 +1,60 @@
+import { AjaxSelect } from "#core:core/components/ajax-select-base";
+import { registerComponent } from "#core:utils/web-components";
+import type { TomOption } from "tom-select/dist/types/types";
+import type { escape_html } from "tom-select/dist/types/utils";
+import {
+  type CounterSchema,
+  type ProductSchema,
+  counterSearchCounter,
+  productSearchProducts,
+} from "#openapi";
+
+@registerComponent("product-ajax-select")
+export class ProductAjaxSelect extends AjaxSelect {
+  protected valueField = "id";
+  protected labelField = "name";
+  protected searchField = ["code", "name"];
+
+  protected async search(query: string): Promise<TomOption[]> {
+    const resp = await productSearchProducts({ query: { search: query } });
+    if (resp.data) {
+      return resp.data.results;
+    }
+    return [];
+  }
+
+  protected renderOption(item: ProductSchema, sanitize: typeof escape_html) {
+    return `<div class="select-item">
+            <span class="select-item-text">${sanitize(item.code)} - ${sanitize(item.name)}</span>
+          </div>`;
+  }
+
+  protected renderItem(item: ProductSchema, sanitize: typeof escape_html) {
+    return `<span>${sanitize(item.code)} - ${sanitize(item.name)}</span>`;
+  }
+}
+
+@registerComponent("counter-ajax-select")
+export class CounterAjaxSelect extends AjaxSelect {
+  protected valueField = "id";
+  protected labelField = "name";
+  protected searchField = ["code", "name"];
+
+  protected async search(query: string): Promise<TomOption[]> {
+    const resp = await counterSearchCounter({ query: { search: query } });
+    if (resp.data) {
+      return resp.data.results;
+    }
+    return [];
+  }
+
+  protected renderOption(item: CounterSchema, sanitize: typeof escape_html) {
+    return `<div class="select-item">
+            <span class="select-item-text">${sanitize(item.name)}</span>
+          </div>`;
+  }
+
+  protected renderItem(item: CounterSchema, sanitize: typeof escape_html) {
+    return `<span>${sanitize(item.name)}</span>`;
+  }
+}

counter/widgets/select.py

@@ -0,0 +1,35 @@
+from django.forms import Select, SelectMultiple
+
+from core.views.widgets.select import AutoCompleteSelectMixin
+from counter.models import Counter, Product
+from counter.schemas import ProductSchema, SimplifiedCounterSchema
+
+
+class CounterAutoCompleteSelectMixin(AutoCompleteSelectMixin):
+    js = [
+        "webpack/counter/components/ajax-select-index.ts",
+    ]
+
+
+class AutoCompleteSelectCounter(CounterAutoCompleteSelectMixin, Select):
+    component_name = "counter-ajax-select"
+    model = Counter
+    schema = SimplifiedCounterSchema
+
+
+class AutoCompleteSelectMultipleCounter(CounterAutoCompleteSelectMixin, SelectMultiple):
+    component_name = "counter-ajax-select"
+    model = Counter
+    schema = SimplifiedCounterSchema
+
+
+class AutoCompleteSelectProduct(CounterAutoCompleteSelectMixin, Select):
+    component_name = "product-ajax-select"
+    model = Product
+    schema = ProductSchema
+
+
+class AutoCompleteSelectMultipleProduct(CounterAutoCompleteSelectMixin, SelectMultiple):
+    component_name = "product-ajax-select"
+    model = Product
+    schema = ProductSchema