2023年8月15日 星期二

一些用網頁就可以做出的即時互動應用(by extjs4)

Xamarin 跨平台之app (IOS & Andriod) 一二 ,請點此處....

 I also do  xamarin projects, you can see them there .  


這是使用 ExtJS 4 完成的最新工作的一部分。由於系統的龐大和複雜性,我只選擇了一個具有代表性的部分來展示。這些界面不僅美觀,而且經過深思熟慮,旨在提供最佳的用戶體驗。在開發這個系統時,我們面臨了多種技術挑戰,但每一次都成功地找到了解決方案。這不僅僅是一個界面;它反映了企業流程的深度整合和資訊系統的真實價值。當然,一個出色的界面必須與強大的後端和有效的業務流程相結合。我提供的不僅僅是一個界面,而是一個可以幫助企業提高效率、提升服務品質和獲利能力的完整解決方案。

Below are some parts of my recent work done with ExtJS 4. Due to the vastness and complexity of the system, I've chosen to showcase just a representative portion. These interfaces are not only aesthetically pleasing but have also been thoughtfully designed to offer the best user experience. During the development of this system, we faced various technical challenges, but each time we successfully found a solution. This is not just an interface; it reflects the deep integration of business processes and the true value of the information system. Naturally, an excellent interface must be combined with a robust backend and efficient business workflows. What I offer is not just an interface but a comprehensive solution that can help businesses enhance efficiency, improve service quality, and boost profitability.




使用 GridEditor,使用者不再需要透過彈出窗口逐行編輯和保存數據。
相反地,他們可以像遍歷 Excel 單元格一樣,在行內快速導航和編輯。
此外,通過 Grid 鎖定機制,可以創建一個類似於 Excel 的固定區域,方便在編輯時比較其他列的資訊,從而減少錯誤的發生。
另外,Grid Head 也支持分組,使其更容易閱讀和分類。
(以上片段是油井員工訓練機構的課程資料單元之學員資料編輯畫面)


With GridEditor, users no longer have to edit and save data row by row through pop-up windows. Instead, they can navigate and edit within the rows quickly in a manner similar to traversing Excel cells. Moreover, through the Grid lock mechanism, a fixed area similar to Excel can be created, making it convenient to compare information from other columns while editing, thus reducing the occurrence of errors. Additionally, Grid Head also supports grouping, making it easier to read and categorize.

(The above segment is the student data editing interface from a course module of the oil well employee training institution.)





透過多樣的grid plugin,您可以直接在行列裡切換欄位型態,快意輸入,不必再東奔西跑.
(上為進銷存系統後台之帳記錄單元)
by extjs plugin, we can switch component in cell of grid dynamicly
(above video is a brief demo of accouting unit in ERP backend)




使用 SVG 和拖放功能的平面圖來提高產品放置的效率並增強外勤服務的品質。

Using a SVG & drag-and-drop floor map to improve the efficiency of product placement and enhance the quality of out-field service.



就算是網頁,透過server push 機制,設備也可以快速地回應其狀態,無需等待所有事件都被處理完畢才查看log才可以知道發生了什麼。這可以提高回應速度並減少不必要的等待。
(上例:門禁卡資料寫入門禁控制器的對話過程)

Even for web pages, Devices can  quickly respond  their status by server push , without having to wait for all events to be processed before checking the log files to know what happened. This can increase the response speed and reduce unnecessary waiting. (Example: The process of writing access control data to the access control controller.)





該單元為「黑白配--促銷活動設計區」, 此單元可定義促銷活動的組成和進行的時間。 一旦系統時間位於促銷活動的時間內並在此單元有定義時,促銷條件將被推送到 POS 系統,讓消費者享受到購物的樂趣,而外場同仁也不必東查西找(我的網頁版 POS 需要其他裝置連接才能啟用,所以我在這裡沒有展示。) 此外,如果需要,促銷活動還可以被推送到貨架上的電子紙或是其他顯示器上.這當然要再建置相關設備再來說了.

The unit of "Define promotional activities based on product composition conditions",
this unit can define the composition and duration of promotion activities
Once system time is in the duration of an activity,the promition condition will be pushed to POS System.(my web-base POS needs other connections of device,so I don't show it here.)
Besides,the promotion activity can be pushed to E-paper(or displayer) on shelfs ,if you need,I can do it.





而backend也可以從server的websocket 等pushback的notification方式,第一時間知道前台事件,而作出處置,大大節省公司及客人的時間,
(上例是用sencha touch實作的手機下單app,而backend是用extjs,在app下單後,backend即會收到訊息,以進行後續程序)
The backend can also receive real-time notifications from the server's WebSocket or other pushback methods. This allows for immediate awareness of front-end events and prompt actions, thereby saving both the company and customers a lot of time.
(The above example is a mobile ordering system app implemented with Sencha Touch, and the backend is developed using ExtJS. After an order is submitted through the app, the backend will immediately receive a message to proceed with subsequent processes.)

結論:通常技術不是問題,問題在於我們的創意及想像力,期待與您合作,共創多嬴.
So, exjts is so powerful and useful; the only limitation is our imagination and creativity.






0 個意見:

張貼留言

訂閱 張貼留言 [Atom]

<< 首頁