iş akışları

Ve işte burada, web uygulamaları oluşturmanın en önemli anına geldik. Sonuçta, şimdiye kadar yaptığımız her şey sadece bir resim yaratmaktı. Oldukça sevimli, muhtemelen, ama hemen hemen işe yaramaz. Şimdi ana şeyi yapmamız gerekiyor. Onu canlandırın ve eylemlerimize bir tepki ekleyin.

Her bileşenin bu görev için bir Workflow sekmesi vardır. İçinde, iş süreçleri oluşturabilir ve bunların başlatılması için koşullar (tetikleyiciler) tanımlayabilirsiniz. Calculate butonu için böyle bir iş süreci oluşturalım.

tetikleyiciler

Bir iş süreci oluşturmak, arka uç için bir iş süreci oluşturduğumuzda modül 4'te gördüğümüze çok benzer. Ortak bir tuval vardır, buraya eklenen bloklar ve bunlar arasındaki bağlantılar eylemlerin sırasını belirler. Önemli bir fark, ön uç iş akışının bir iş sürecini başlatmak için birçok farklı bloğa sahip olmasıdır. Bunlar iş sürecini başlatan tetikleyicilerdir. Tetikleyicilerin kendileri her bileşen için farklı olabilir (bir düğmenin bir tıklaması vardır, bir tabloda bir veri güncellemesi vardır ve bir listede bazı seçenekler bulunur), ancak genel çalışma mantığı her durumda aynıdır. Bir olay meydana gelir ve bu olay ilgili iş sürecini başlatır.

Genel bir plana karar verelim. Butona tıklandığında ne yapmamız gerekiyor:

• X ve Y değerlerini bulun. Bunları ilgili giriş alanlarından alın.
• Hesaplamalar için bir uç nokta başlatın ve ona X ve Y parametrelerini iletin.
• Sonuç kapsayıcısını görünür yapın.
• Hesaplama sonucunu gerekli Label alanlarına koyun.
  

İş süreci blokları

İlk adım, bir InputFloat Get Properties bloğu gerektirir. Yalnızca kullanıcının girdiğini değil, aynı zamanda diğer ayarları da (örneğin, görünüm ayarları veya izin verilen değer aralığı) bileşenin mevcut değerlerini okur. Value almamız gerekiyor, tam olarak bu kullanıcı tarafından girilen verileri içeriyor. Giriş alanındaki her değer ve bunun için iki bloğa ihtiyacımız var (X ve Y için). Onlarda, girişte Component ID değerini seçmeniz gerekir. Oluştururken isimlerini belirtmeyi unutmadıysanız, gerekli bileşeni bulmak ve seçmek zor olmayacaktı.

Bir sonraki adım, uç noktayı başlatmaktır. Burası ön uç ile arka uç arasındaki bağlantının gerçekleştiği ve hesaplama komutlarının tarayıcıdan sunucuya iletildiği yerdir. Uygulamamızın her uç noktası ayrı bir blok olarak temsil edilir. İhtiyacınız olanı seçmeniz ve bağlamanız yeterlidir. Beşinci modül sırasında bu uç noktaya bir GET yöntemi ve bir module4-basic URL atanmıştır. Blok listesinde bu ad altında olacaktır - Server request GET /module4-basic/

Bileşenlerin aksine, uç noktaların Endpoint ID ayarlamaları gerekmez (varsayılan olarak doğru ayarlanır). Yalnızca bir önceki adımda elde edilen X ve Y girişine başvurmak gerekir.

Bir sonraki görev, sonuç kapsayıcısını görünür kılmaktır. Bunu yapmak için Container Update Properties bloğunu kullanın. Bloğun kendisinde, istenen kapsayıcının ID seçin ve Visible = true olarak ayarlayın.

Yapılması gereken son şey, dizideki 5 sonuç öğesini web uygulamasının karşılık gelen bileşenlerine dağıtmaktır. Sonucun her zaman kesin olarak tanımlanmış bir sırada gelmesi gerektiğini biliyoruz, bu nedenle istenen indekse sahip öğeyi sırayla almamız ve değerini Label bileşenine atamamız gerekiyor. Bunu yapmak için, Label metnini değiştirmek ve sonucu görüntülemek için Array Element bloklarını (0'dan 4'e bir indeks ile), toString ( Float verilerini String dönüştürmek için) ve Label Update Properties kullanırız.

Herhangi bir bileşenin özelliklerini güncellemek için iki blok seçeneği olduğunu fark etmiş olabilirsiniz - Update Properties Set Properties . Aralarındaki fark, Rest API'deki Patch ve Put yöntemleri arasındaki farkla aynıdır. Birincisi yalnızca açıkça belirtilen özellikleri değiştirir, ikincisi ise hepsinin üzerine yazar.

Son sonuç

Bu, iş sürecinin oluşturulmasını tamamlar. Nihai sonucu kaydedebilir, yayınlayabilir ve kontrol edebilirsiniz.

Her şey doğru yapıldıysa, nihai sonuç şöyle görünmelidir: