Añadir un campo de búsqueda al modal de búsqueda avanzada

Aprenda a añadir un campo de búsqueda personalizado utilizando la técnica de personalización mediante configuración. En esta lección, modificará un search_fields.json archivo que define los campos que se mostrarán en las páginas de búsqueda.

Para este escenario, desea añadir un campo de búsqueda en el modal de búsqueda avanzada. El modal de búsqueda avanzada se encuentra en el paso Añadir líneas de la creación de un pedido para buscar un artículo. La API OMS, getCompleteItemList, se invoca para buscar elementos. Queremos añadir un criterio de búsqueda para AliasValue ( <ItemAliasList><ItemAliasAliasValue=""/></ItemAliasList> )
Captura de pantalla del modal de búsqueda avanzada

Procedimiento

  1. En primer lugar, debe encontrar la clave JSON asociada al modal en el que desea añadir el campo de búsqueda personalizado.
    1. Dado que la página que hay que personalizar forma parte del buc-app-order módulo, abra el buc-app-order/packages/create-order/src-custom/assets/buc-app-order/search_fields.json archivo.
    2. Busca una etiqueta en el JSON que coincida con la etiqueta del modal.
      Por ejemplo, el modal tiene una etiqueta «ID del catálogo maestro». Busca el término «maestro ». El archivo contiene dos ocurrencias. Si observas todos los demás campos del mismo objeto principal, verás que la clave del modal «Búsqueda avanzada» es la clave add-order.
  2. Cree un archivo search_fields.json dentro de la packages/create-order/src-custom/assets/custom carpeta.
  3. Utilizando la tecla «Añadir pedido», pegue el siguiente código para añadir un campo personalizado « ItemAlias » (Código de identificación del artículo) que represente el código UPC, EAN o el código del fabricante del artículo. Para obtener más información sobre cómo definir campos de búsqueda en JSON, consulte Añadir campos de búsqueda a páginas de búsqueda existentes.
    {
    "add-order": {
        "fields": [
            {
            "label": "Alias value",
            "type": "dropdownQuery",
            "target": "add-order",
            "request": "ItemAliasList.ItemAlias.AliasValue",
            "operator": "LIKE",
            "fetch": {
              "api": "getQueryTypeList",
              "type": "oms",
              "parameters": {},
              "response": {
                "listAttribute": "StringQueryTypes.QueryType",
                "map": {
                  "id": "QueryType",
                  "label": "QueryTypeDesc"
                }
              }
            }
        }
        ]
    }
    }
    
  4. Has añadido correctamente un campo de búsqueda al modal de búsqueda avanzada. Ahora prueba los cambios.
    1. Si aún está conectado al Order Hub de última generación, vuelva a cargar el marco. De lo contrario, inicie sesión en el Order Hub de última generación.
    2. Seleccione Órdenes > Salientes.
    3. Haga clic en Crear pedido.
    4. Rellene todos los datos y haga clic en Siguiente para acceder a la página Añadir líneas.
    5. En la página Añadir líneas, haga clic en Búsqueda avanzada.
      Ahora puede ver el valor del campo Alias.
      Captura de pantalla del modal de búsqueda avanzada con el campo personalizado «Valor del alias»
    6. Abre la pestaña Red de la consola en tu navegador para verificar que la carga útil de la solicitud de API incluye la nueva entrada Alias.
    7. Añade un valor en el campo Valor del alias y ejecuta una búsqueda.
      Asegúrate de que ves ItemAlias en la carga útil.
      Captura de pantalla del modal de búsqueda avanzada con el campo personalizado «Valor del alias»

Qué hacer a continuación

Implemente su personalización. Para obtener más información, consulte Preparación para implementar personalizaciones en aplicaciones existentes.