2016-07-04 4 views
0

私は作業者とその作業を計画しましたが、今は予定を簡単に変更して改善する必要があります。タスクを移動して継続時間を変更するためにドラッグアンドドロップを行うことが可能かどうかを知りたいですか?SAPUI5:PlanningCalendarの予定の拡張と移動

私はそれがそうだと思いますが、私がインターネット上で見つけたものはすべて、mvcアプリケーションに適合しません。プランニングは単一のビューになっているので、ビューのコントローラーでのみ自分の仕事をしたいと思います。

EDIT:私のコントローラで、私はこのコードをした:

onInit : function(){ 
     var oView = this.getView(); 

     //load jquery libraries for drag n drop 
     jQuery.sap.require("sap.ui.thirdparty.jqueryui.jquery-ui-core"); 
     jQuery.sap.require("sap.ui.thirdparty.jqueryui.jquery-ui-widget"); 
     jQuery.sap.require("sap.ui.thirdparty.jqueryui.jquery-ui-mouse"); 
     jQuery.sap.require("sap.ui.thirdparty.jqueryui.jquery-ui-draggable"); 
     jQuery.sap.require("sap.ui.thirdparty.jqueryui.jquery-ui-droppable"); 

     //make the appointments drag n droppables 
     var oAppointment = oView.byId("draggable"); 
     var idAppointment = oAppointment.getId(); 
     oAppointment.onAfterRendering = function(){ 
      $("#"+idAppointment).draggable({ 
       cancel:false 
      }) 
     }; 
    } 

draggable idはこのように私のCalendarAppointmentsに設定されています:1つだけで、別のプロジェクトで

<appointments> 
    <unified:CalendarAppointment 
      id="draggable" 
      startDate="{CustomModel>EarlSchedStartdate}" 
      endDate="{CustomModel>EarlSchedFindate}" 
      title="{CustomModel>Description}"> 

    </unified:CalendarAppointment> 
</appointments> 

ボタン、それは動作しますが、それは私の計画の任命のためではありません。

+0

'jquery-ui-draggable/droppable'を使用するには、' draggable() 'と' droppable() 'イベントハンドラを'CalendarAppointment'や' PlanningCalendar'オブジェクトのいずれかを呼び出すことができます。 – Qualiture

+0

コンパイラはドラッグ可能な関数を認識しませんが、同じ場所で使用することはできません。私のonInit()関数では、 'jQuery.sap.require'で正しい名前空間を得ました。私はこれをしました: 'oView.byId(" draggable ")。draggable();'; 'Uncaught TypeError:oView.byId(...)。draggableは関数ではありません。 ' – Nicaps

+0

説明が不明確な場合は、私の投稿を編集しました。 – Nicaps

答えて

1

コントロールを拡張することによって、PlanningCalendarでドラッグアンドドロップがうまく機能しています。

IMOは、この種のDOMロジックをコントローラで行うのは意味がありません。

"Dom Manipulations should not exist in controllers, services or anywhere else but in directives"

AngularJSのベストプラクティスは、UI5

のjQuery UI doesntの支援タッチのためのコントロールまたはコンポーネントとの指示を交換するので、携帯電話、タブレットやタッチスクリーンで使用することができなかった、道路は代替ドラッグの多くをテストしましたタッチライブラリ、いくつかのクールなものがあり、必要なものがほとんど残っていますが、ネイティブJSと標準のSAPUI5コントロールイベント処理を可能な限り行って、必要なところでjQueryにフォールバックしました。 PlanningCalendarで

- が予定のonAfterRenderingにイベントデリゲートを追加しました、条件付きなど

のサイズを変更するためにドラッグし、マウスカーソルのような要素のスタイルを追加しやすい再び、CalendarRowコントロールに類似したイベントのデリゲートを追加しましたPlanningCalendar内では、ドロップ可能な領域を設定し、時間の衝突などを管理します。

KendoUI SchedulerとWidjimo Events Calendarのソースを研究していましたが、どちらもODataとうまく機能します。 SAPUI5以外の機能を追加しなければならない人は、インスピレーションのためにこれらのUIライブラリや類似のUIライブラリを見てみることをお勧めします。

私は最終的な結果に満足しています。バッチを実行しているOData V2とシームレスに連携しています。ゴースト機能がありません(sap.ui.dt.plugin.DragDropにいくつかのコードが追加されていません)コントローラやコールバックなどでイベントを処理するために使用します。

+0

ありがとうございます。私はフランス語なので、あなたが書いたことをほとんど理解していませんでした^^ "要約すると、私のコードをindex.htmlの