<div class="app-header bg-header-1">
    <div class="layout-fixed full-h text-center">
        <div class="full-h v-bottom-i pdB15">
            <div class="app-content-header bg-header-1">
                <div class="text-title-header-1 nowrap mgT10">New task filter query</div>
            </div>
        </div>
    </div>
    <button class="popup-back-button bg-transparent pd0-i biger-3-time" type="button" ng-click="closeTarget('#popupAddTaskFilterQuery')"></button>
</div>
<form class="app-content" id="formFilterQueryAdd" name="formFilterQueryAdd" ng-submit="addtaskquery(formFilterQueryAdd)" novalidate="">
    <div class="app-content-inner content-pd">
        <button id="submitformFilterQueryAdd" style="display:none;" type="submit">Submit</button>
        <ion-scroll class="scroll-area" direction="y" has-bouncing="false" overflow-scroll="false" delege-handle="scrollFilterQueryAdd" on-scroll="scrollContent('scrollFilterQueryAdd')">
            <div class="box-setting-4 form-field-container no-saperator">
                <div class="content content-in">
                    <div class="itm">
                        <label class="label-form-field-1" ng-class="{ 'has-errors' : formFilterQueryAdd.name.$invalid }">Name</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-class="{ 'has-errors' : formFilterQueryAdd.name.$invalid }" ng-click="focusHandle($event)">
                                    <input type="text" class="h32px" name="name" value="" placeholder="" ng-model="dataTaskFilterAddQuery.queryname" required>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <div class="layout-fixed input-1-group">
                            <div>
                                <label class="label-form-field-1">Due Date</label>
                                <div class="layout-fixed">
                                    <div>
                                        <div class="input-form-field-1" ng-click="focusHandle($event)">
                                            <input class="h32px" name="due_start_filter_add" id="due_start_filter_add" placeholder="From" type="text" value="{{duestartAdd| date: 'MM/dd/yyyy'}}">
                                            <div class="field-overlay datetime" date="" ion-datetime-picker="" name="duestartAdd" ng-model="duestartAdd" placeholder=""
                                                 readonly="true" only-valid="{'between': {'initial':'1980-01-01', 'final': dueendAdd}, 'inclusive': true}">
                                                {{duestartAdd| date: 'MM/dd/yyyy'}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div class="layout-fixed">
                                    <div>
                                        <div class="input-form-field-1" ng-click="focusHandle($event)">
                                            <input class="h32px" id="due_end_filter_add" name="due_end_filter_add" placeholder="To" type="text" value="{{dueendAdd| date: 'MM/dd/yyyy'}}">
                                            <div class="field-overlay datetime" date="" ion-datetime-picker="" name="dueendAdd" ng-model="dueendAdd" placeholder="" readonly="true" only-valid="{'after':duestartAdd}">
                                                {{dueendAdd| date: 'MM/dd/yyyy'}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <div class="layout-fixed input-1-group">
                            <div>
                                <label class="label-form-field-1">Created date</label>
                                <div class="layout-fixed">
                                    <div>
                                        <div class="input-form-field-1" ng-click="focusHandle($event)">
                                            <input class="h32px" id="created_start_filter_add" name="created_start_filter_add" placeholder="Start" type="text" value="{{createdstartAdd| date: 'MM/dd/yyyy'}}">
                                            <div class="field-overlay datetime" date="" ion-datetime-picker="" name="createdstartAdd" ng-model="createdstartAdd" placeholder=""
                                                 readonly="true" only-valid="{'between': {'initial':'1980-01-01', 'final': createdendAdd}, 'inclusive': true}">
                                                {{createdstartAdd| date: 'MM/dd/yyyy'}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <div class="layout-fixed">
                                    <div>
                                        <div class="input-form-field-1" ng-click="focusHandle($event)">
                                            <input class="h32px" id="created_end_filter_add" name="created_end_filter_add" placeholder="End" type="text" value="{{createdendAdd| date: 'MM/dd/yyyy'}}">
                                            <div class="field-overlay datetime" date="" ion-datetime-picker="" name="createdendAdd" ng-model="createdendAdd" placeholder=""
                                                 readonly="true" only-valid="{'after':createdstartAdd}">
                                                {{createdendAdd| date: 'MM/dd/yyyy'}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Assignee</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <textarea autocomplete="off"
                                              class="ion-autocomplete"
                                              ion-autocomplete=""
                                              item-value-key="id"
                                              item-view-value-key="screen_name"
                                              items-clicked-method="onSelectTaskFilterUser(callback,'assignAdd')"
                                              items-removed-method="onRemoveTaskFilterUser(callback,'assignAdd')"
                                              items-method="filterTaskFilterUser(query,'assignAdd')"
                                              items-method-value-key="items"
                                              max-selected-items="50"
                                              ng-model="autocompleteList.TaskFilterAssigneeAdd"
                                              placeholder=""
                                              readonly="readonly" type="text"
                                              external-model="initialTaskFilterAssigneeAdd"
                                              model-to-item-method="setValueTaskFilter(modelValue)"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Task creator</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <textarea autocomplete="off"
                                              class="ion-autocomplete"
                                              ion-autocomplete=""
                                              item-value-key="id"
                                              item-view-value-key="screen_name"
                                              items-clicked-method="onSelectTaskFilterUser(callback,'creatorAdd')"
                                              items-removed-method="onRemoveTaskFilterUser(callback,'creatorAdd')"
                                              items-method="filterTaskFilterUser(query,'creatorAdd')"
                                              items-method-value-key="items"
                                              max-selected-items="50"
                                              ng-model="autocompleteList.TaskFilterCreatorAdd"
                                              placeholder=""
                                              readonly="readonly" type="text"
                                              external-model="initialTaskFilterCreatorAdd"
                                              model-to-item-method="setValueTaskFilter(modelValue)"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Follower</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <textarea autocomplete="off"
                                              class="ion-autocomplete"
                                              ion-autocomplete=""
                                              item-value-key="id"
                                              item-view-value-key="screen_name"
                                              items-clicked-method="onSelectTaskFilterUser(callback,'followerAdd')"
                                              items-removed-method="onRemoveTaskFilterUser(callback,'followerAdd')"
                                              items-method="filterTaskFilterUser(query,'followerAdd')"
                                              items-method-value-key="items"
                                              max-selected-items="50"
                                              ng-model="autocompleteList.TaskFilterFollowerAdd"
                                              placeholder=""
                                              readonly="readonly" type="text"
                                              external-model="initialTaskFilterFollowerAdd"
                                              model-to-item-method="setValueTaskFilter(modelValue)"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Type of task</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <input type="text" class="h32px" name="" value="{{dataTaskFilterAddQuery.taskType}}" placeholder="">
                                    <div class="sign-r clear">
                                        <button class="bg-transparent full-h right pdR10" type="button">
                                            <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                        </button>
                                    </div>
                                    <select class="field-overlay" ng-model="dataTaskFilterAddQuery.taskType">
                                        <option value="Standard">Standard</option>
                                        <option value="Downtime">Downtime</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Task status</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <input type="text" class="h32px" name="" value="{{dataTaskFilterAddQuery.taskStatus}}" placeholder="">
                                    <div class="sign-r clear">
                                        <button class="bg-transparent full-h right pdR10" type="button">
                                            <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                        </button>
                                    </div>
                                    <select class="field-overlay" ng-model="dataTaskFilterAddQuery.taskStatus">
                                        <option value="All" selected>All</option>
                                        <option value="Incomplete">Incomplete</option>
                                        <option value="Upcoming">Upcoming</option>
                                        <option value="Following">Following</option>
                                        <option value="Complete">Complete</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Search mode</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <input type="text" class="h32px" name="" value="{{dataTaskFilterAddQuery.seachMode_}}" placeholder="">
                                    <div class="sign-r clear">
                                        <button class="bg-transparent full-h right pdR10" type="button">
                                            <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                        </button>
                                    </div>
                                    <select class="field-overlay" ng-model="dataTaskFilterAddQuery.seachMode_">
                                        <option value="Exact search">Exact search</option>
                                        <option value="Fuzzy search">Fuzzy search</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <label class="label-form-field-1">Text search: includes title, body & comment</label>
                        <div class="layout-fixed">
                            <div>
                                <div class="input-form-field-1" ng-click="focusHandle($event)">
                                    <textarea class="h80px" ng-model="dataTaskFilterAddQuery.textSearch"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="itm">
                        <div class="layout-fixed input-1-group">
                            <div>
                                <label class="label-form-field-1">Sort by</label>
                                <div class="layout-fixed">
                                    <div>
                                        <div class="input-form-field-1" ng-click="focusHandle($event)">
                                            <input type="text" class="h32px" name="" value="{{switchSortByValue(dataTaskFilterAddQuery.sortBy)}}" placeholder="">
                                            <div class="sign-r clear">
                                                <button class="bg-transparent full-h right pdR10" type="button">
                                                    <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                                </button>
                                            </div>
                                            <select class="field-overlay" ng-model="dataTaskFilterAddQuery.sortBy">
                                                <option value="duedate">Due date</option>
                                                <option value="createdate">Create date</option>
                                                <option value="creator">Creator</option>
                                                <option value="assignee">Assignee</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="w80px clear v-bottom-i pdB5">
                                <div class="layout-fixed w-auto-i right">
                                    <div class="pdR2 v-bottom-i">
                                        <div class="checkbox-image-1 block-i">
                                            <input type="radio" value="true" name="rdFilter" ng-model="dataTaskFilterAddQuery.sortType_">
                                            <i class="pd5">
                                                <svg class="h12px" viewBox="0 0 612.021 612.021"> <path d="M590.927,517.491H337.79c-11.645,0-21.095,9.45-21.095,21.116c0,11.665,9.45,21.115,21.095,21.115l253.137-0.611     c11.645,0,21.095-8.839,21.095-20.504C612.021,526.941,602.592,517.491,590.927,517.491z M295.601,52.88l295.326-0.042     c11.645,0,21.095-9.408,21.095-21.074s-9.45-21.116-21.095-21.116H295.601c-11.645,0-21.095,9.45-21.095,21.116     S283.956,52.88,295.601,52.88z M331.188,396.745c-8.27-8.312-21.686-8.312-29.955,0L190.127,524.6V10.648h-42.189v514.711     L36.156,396.745c-8.269-8.312-21.686-8.312-29.954,0c-8.27,8.312-8.27,21.77,0,30.06l146.439,168.526     c4.409,4.43,10.273,6.307,16.032,6.012c5.779,0.295,11.623-1.582,16.031-6.012l146.44-168.526     C339.457,418.515,339.457,405.057,331.188,396.745z M590.927,137.364H295.601c-11.645,0-21.095,9.451-21.095,21.116     c0,11.666,9.45,20.926,21.095,20.926h295.326c11.645,0,21.095-9.261,21.095-20.926     C612.021,146.815,602.592,137.364,590.927,137.364z M590.927,264.059H295.601c-11.645,0-21.095,9.451-21.095,21.116     c0,11.666,9.45,20.778,21.095,20.778l295.326,0.338c11.645,0,21.095-9.451,21.095-21.116     C612.021,273.531,602.592,264.059,590.927,264.059z M590.927,390.775H422.169c-11.645,0-21.095,9.45-21.095,21.115     c0,11.666,9.45,20.652,21.095,20.652h168.758c11.645,0,21.095-8.986,21.095-20.652     C612.021,400.226,602.592,390.775,590.927,390.775z" /> </svg>
                                            </i>
                                        </div>
                                    </div>
                                    <div class="v-bottom-i">
                                        <div class="checkbox-image-1 block-i">
                                            <input type="radio" value="false" name="rdFilter" ng-model="dataTaskFilterAddQuery.sortType_">
                                            <i class="pd5">
                                                <svg class="h12px" viewBox="0 0 612 612"> <path d="M590.905,559.173H295.58c-11.644,0-21.095,9.408-21.095,21.073c0,11.666,9.451,21.116,21.095,21.116h295.326     c11.645,0,21.095-9.45,21.095-21.116C612,568.581,602.57,559.173,590.905,559.173z M331.166,215.266     c8.27-8.312,8.27-21.77,0-30.061L184.727,16.68c-4.409-4.43-10.273-6.308-16.032-6.012c-5.78-0.296-11.623,1.582-16.032,6.012     L6.202,185.185c-8.269,8.312-8.269,21.77,0,30.06c8.27,8.29,21.686,8.312,29.955,0L147.938,86.63v514.712h42.189V87.41     l111.105,127.855C309.48,223.556,322.896,223.556,331.166,215.266z M337.769,95.089h253.137c11.645,0,21.095-10.02,21.095-21.686     c0-11.665-9.45-21.115-21.095-21.115H337.769c-11.645,0-21.095,9.45-21.095,21.115C316.674,85.069,326.124,95.089,337.769,95.089     z M590.905,432.415H295.58c-11.644,0-21.095,9.45-21.095,21.115c0,11.666,9.451,21.116,21.095,21.116h295.326     c11.645,0,21.095-9.45,21.095-21.116C612,441.865,602.57,432.415,590.905,432.415z M590.905,305.698H295.58     c-11.644,0-21.095,9.451-21.095,21.116c0,11.666,9.451,21.116,21.095,21.116h295.326c11.645,0,21.095-9.45,21.095-21.116     C612,315.149,602.57,305.698,590.905,305.698z M590.905,178.982l-168.758,0.464c-11.645,0-21.095,8.986-21.095,20.652     c0,11.665,9.45,21.537,21.095,21.537l168.758-0.422c11.645,0,21.095-9.45,21.095-21.115     C612,188.433,602.57,178.982,590.905,178.982z" /> </svg>
                                            </i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </ion-scroll>
    </div>
</form>
<div class="app-control">
    <div class="layout-fixed full-h pdT2">
        <div class="w42px full-h relative">
            <button class="bg-transparent pd0-i full text-left pdL10-i" type="button" onclick="openQuickOption(this)">
                <svg class="h20px" viewBox="0 0 460.713 460.713"> <g> <rect y="115.356" width="302" height="30" fill="#FFFFFF" /> <polygon points="335.786,202.231 398.25,264.694 460.713,202.232  " fill="#FFFFFF" /> <rect y="315.356" width="302" height="30" fill="#FFFFFF" /> <rect y="215.356" width="302" height="30" fill="#FFFFFF" /> </g> </svg>
            </button>
            <div class="quick-popup box-popup-1 display-bottom-left mgB55" onclick="closeQuickOption(this)">
                <div class="popup-content w140px">
                    <ul class="list-item-03">
                        <li ng-click="clearFormFilterAdd()">
                            <div class="layout-fixed">
                                <div class="icon-area">
                                    <svg class="h15px" viewBox="0 0 423.755 423.755"> <path d="M43.84,281.457c-18.585-44.869-18.586-94.29,0-139.159c10.649-25.709,26.678-48.152,46.86-66.135l60.86,60.86V15.099   H29.635l39.88,39.88c-64.293,58.426-88.5,153.2-53.391,237.959c14.167,34.202,37.07,64.159,66.234,86.634   c28.275,21.789,61.873,36.201,97.162,41.677l4.601-29.646C120.778,381.774,68.337,340.597,43.84,281.457z" fill="#FFFFFF" /> <path d="M407.516,292.938c21.652-52.272,21.652-109.848,0-162.12c-14.167-34.202-37.071-64.159-66.234-86.633   C313.007,22.395,279.409,7.983,244.12,2.507l-4.601,29.646c63.342,9.829,115.783,51.005,140.28,110.146   c18.586,44.869,18.586,94.29,0,139.159c-10.649,25.709-26.678,48.152-46.859,66.135l-60.86-60.86v121.924h121.924l-39.801-39.801   C377.118,348.099,395.334,322.348,407.516,292.938z" fill="#FFFFFF" /> </svg>
                                </div>
                                <div class="name-area text-link-1">
                                    Clear all
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="popup-overlay"></div>
            </div>
        </div>
        <div class="full-h">
            <button class="button-form-field-1 darkgray position-left full" type="button" ng-click="closeTarget('#popupAddTaskFilterQuery');">
                Cancel
            </button>
        </div>
        <div class="full-h">
            <button class="button-form-field-1 position-right full" onclick="getElementById('submitformFilterQueryAdd').click()">
                <svg class="icon h14px" viewBox="0 0 28.91 28.91"> <path style="fill:#030104;" d="M4.594,11.533c0,0-3.091,12.141-4.2,16.889l5.937-8.125c-0.539-1.199-0.214-3.018,0.729-4.049   c1.266-1.383,3.52-1.383,4.904-0.117s1.479,3.414,0.213,4.797c-0.959,1.053-2.733,1.477-3.989,1.008L0.771,28.91l15.646-6.059   l6.287-9.42l-8.229-7.705L4.594,11.533z" /> <polygon style="fill:#030104;" points="20.669,0 16.153,4.193 24.241,11.988 28.515,7.555  " /> </svg>
                Add
            </button>
        </div>
    </div>
</div>
