Snapshot原田

備忘録

f-Revoカスタマイズ -フィルターをいじるためのファイル構造

主なテンプレート

  • layouts\vlayout\modules\Vtiger\ListViewHeader.tpl
    ListViewのページの上のほうのヘッダー部分。 ユーザがフィルターを選択したり、顧客情報を追加するための機能をもつテンプレート

f:id:machikoikenouchi:20170417101022j:plain

  • layouts\vlayout\modules\CustomView\EditView.tpl
    EditViewページのテンプレート。AdvanceFilterをIncludeしている。

f:id:machikoikenouchi:20170417102928j:plain

  • layouts\vlayout\modules\Vtiger\AdvanceFilter.tpl

EditViewの子のテンプレート。
表示名:からのINPUT要素とチェックボタン三つがある。

  • layouts\vlayout\modules\Vtiger\AdvanceFilterCondition.tpl
    AdvanceFilterが親で、EditViewの孫テンプレート。
    すべての条件以下、フィルタ条件の設定を行う機能がある。

やりたいこと

f:id:machikoikenouchi:20170419110708j:plain

  1. EditView.tplの表示名:からのINPUTを値固定で無効化
  2. EditView.tplのチェックボタンをチェック状態で無効化×3
  3. AdvanceFilterCondition.tplの1つ目の条件のSELECTを値固定で無効化×2
  4. AdvanceFilterCondition.tplの1つ目の条件の識別のチェックボタンをチェック状態で無効化
  5. AdvanceFilterCondition.tplの1つ目の条件のINPUT-text要素を値固定で無効化
  6. AdvanceFilterCondition.tplの1つ目の条件の最後のゴミ箱ボタンを消す

実際にやってみる

1. EditView.tplの表示名:からのINPUTを値固定で無効化

{if ($CUSTOMVIEW_MODEL->get('viewname') eq '私のフィルター')}
        readonly
    {/if}

これをEditViewCondition.tpsの表示名:の後のINPUTタグの中に追加する だけでOKでした。

2. EditView.tplのチェックボタンをチェック状態で無効化×3

{if $CUSTOMVIEW_MODEL->get('viewname') eq '私のフィルター'}
    checked="checked" disabled
{else $CUSTOMVIEW_MODEL->isDefault()}
    checked="checked"
{/if}

これをEditViewCondition.tplの中のINPUT-checkcoxの中に追加する だけでOKでした。

3. AdvanceFilterCondition.tplの1つ目の条件のSELECTを値固定で無効化×2

f:id:machikoikenouchi:20170419113417p:plain

SELECTタグ2つの中に"disabled"という要素を追加します。

4. AdvanceFilterCondition.tplの1つ目の条件の識別のチェックボタンをチェック状態で無効化 f:id:machikoikenouchi:20170419114830p:plain

INPUT-checkboxタグ2つの中に"disabled"という要素を追加します。

5. AdvanceFilterCondition.tplの1つ目の条件のINPUT-text要素を値固定で無効化

f:id:machikoikenouchi:20170419115036p:plain

INPUT-checkboxタグ2つの中に"readonly"という要素を追加します。

6. AdvanceFilterCondition.tplの1つ目の条件の最後のゴミ箱ボタンを消す

<i class="deleteCondition icon-trash alignMiddle" title="{vtranslate('LBL_DELETE', $MODULE)}"></i>

これをただ消していきます。

※ここまでは正直簡単でした。
問題はここからです。

f:id:machikoikenouchi:20170419115223p:plain

これらを適応したあと、当たり前ですが要素が丸ごと コピーされちゃうので上の画像のようにボタンを 押すことでどんどん無効化のフォームが増えて行きます。

こうなったらJquery操作でなんとかするしかない

addNewCondition : function(conditionGroupElement){
    
var basicElement = jQuery('.basic',conditionGroupElement);
        //class="basic"を探して、ここをconditionGroupElementに設定
        //class="hide basic"を持つDIVはAdvanceFilter.tpl内にあります。
        //basicクラス内の要素をすべて消し、そこに追加していくという形です。

var newRowElement = basicElement.find('.conditionRow').clone(true,true);
        //AdvanceFilter.tplの中の<div class="conditionRow">をみつけてコピー(しかしここではコピーの出力はされない)

jQuery('select',newRowElement).addClass('chzn-select');
        //selectタグを探して、ここをnewRowElementとする。
        //そしてそこにclass='chzn-select'を生成する。
       
var conditionList = jQuery('.conditionList', conditionGroupElement);
        //class="conditionList"を探して、ここにもconditionGroupElementを設定。
conditionList.append(newRowElement);
//コピーしたものをconditionListクラスをもつタグに出力する。
        
 
 //ここに新たな処理 index=0のとき  一個クローンしたときにdisabledをはずす


 
app.changeSelectElementView(newRowElement);
        //app.js内にあるchangeSelectElementViewメソッドにnewRowElementを渡している。
       
return this;

    },