ShWasher/src_0nline/ShwasherSys/ShwasherSys.Web/Views/Shared/New/Query/_QueryModal.cshtml

@using System.Linq;
@using Abp.Extensions
@using ShwasherSys
@using ShwasherSys.Views.Shared.New.Query

@model QueryViewModel
@{
    string modalId = Model.ModalId ?? "";
    string submit = Model.SubmitEventName ?? "";
    //string click = Model.ItemClickEventName ?? "";
    string dbClick = Model.ItemDbClickEventName ?? "";
    string width = Model.ModalWidth > 0 ? "min-width:" + Model.ModalWidth + "px" : "";
    QueryTreeSearch treeSearch = Model.QueryTreeSearch;
    string tField = "", selectUrl = "", tSelectFiledName = "";
    int tFType = 0; int tExpType = 0;
    if (treeSearch != null)
    {
        tField = treeSearch.Field;
        tFType = treeSearch.FType;
        tExpType = treeSearch.EType;
        selectUrl = treeSearch.SelectUrl;
        tSelectFiledName = treeSearch.SelectFieldName;
    }
    string searBindFunc = Model.SearchBindFunc;
    string isAddBind = "false";
    if (!searBindFunc.IsNullOrEmpty())
    {
        isAddBind = "true";
    }
}

<!-- QUERY-MODAL  @(Model.ModalId)  START-->
<style>
    .query-modal.KeyWords {
        text-decoration: none;
    }
</style>
<section>
    <div class="modal fade query-modal" id="@modalId" role="dialog" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog" role="document" style="@width">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title">
                        <span>@Html.Raw(Model.ModalName)</span>
                    </h4>
                </div>
                <div class="modal-body container-fluid" style="padding: 5px">
                    <div id="tree-box" class="row">
                        @{
                            string colClass = "col-md-12";
                            if (treeSearch != null)
                            {
                                colClass = "col-md-9";
                                <div class="col-md-3" style="padding-right: 0;">
                                    <div style="height: 100%; padding: 5px 0;">
                                        <div id="treeView_@modalId" class="iwb-treeView"></div>
                                    </div>
                                </div>
                            }
                        }

                        <div class="@colClass" style="">
                            <div class="table-box iwb-bootstrap-table">
                                <div class="btn-toolbar row" id="query_tableTool" role="toolbar" aria-label="Toolbar with button groups">
                                    <div class="col-sm-12 pull-left" style="padding: 0">
                                        <form>
                                            @if (Model.QueryItems != null && Model.QueryItems.Any())
                                            {
                                                string colMd = Model.QueryItems.Count(a => a.IsSearch) > 2 ? "col-md-4" : "col-md-6";
                                                int i = 0;
                                                foreach (var item in Model.QueryItems)
                                                {
                                                    if (item.IsSearch)
                                                    {
                                                        i++;
                                                        int fieldType = (int)item.FieldType, expType = (int)item.ExpType;
                                                        <div class="@colMd">
                                                            <div class="input-group">
                                                                <input type="text" class="form-control" id="Q-KeyWords-@i" name="KeyWords-@i" placeholder="@(L("PlaceholderHeader"))@(item.Name)">
                                                                @*<input type="hidden" id="Q-KeyField-@i" name="KeyField-@i" value="@item.Key">
                                                                    <input type="hidden" id="Q-FieldType-@i" name="FieldType-@i" value="@filedType">
                                                                    <input type="hidden" id="Q-ExpType-@i" name="ExpType-@i" value="@expType">*@

                                                                <input id="@(modalId)-@(item.Key)" name="@(modalId)-@(item.Key)" class="form-control KeyWords" data-field="@(item.Key)" data-ftype="@(fieldType)" data-etype="@(expType)" placeholder="@(L("SearchPlaceholder"))" autocomplete="off" type="text" />
                                                                <span class="input-group-addon search-icon" onclick="@(modalId)Refresh()">
                                                                    <i class="iconfont icon-search"></i>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    }
                                                }
                                            }
                                        </form>
                                    </div>
                                </div>
                                <table data-url="@Model.QueryUrl"
                                       data-striped="true" data-id-field="id" data-unique-id="id"
                                       data-method="get"
                                       data-side-pagination="server"
                                       data-content-type="application/x-www-form-urlencoded; charset=UTF-8"
                                       data-cache="false"
                                       data-pagination="true" data-page-size="10" data-page-number="1" data-page-list="[10,20,50]" data-pagination-detail-h-align="right" data-pagination-h-align="left"
                                       data-query-params="QueryParams_@(modalId)"
                                       data-response-handler="ResponseHandler"
                                       data-click-to-select="true"
                                       data-single-select="true">
                                    <thead>
                                        <tr class="row">
                                            @if (Model.QueryItems != null && Model.QueryItems.Any())
                                            {
                                                <th data-field="state" data-checkbox="true"></th>
                                                foreach (var item in Model.QueryItems)
                                                {
                                                    var formatter = string.IsNullOrEmpty(item.Formatter) ? "" : "data-formatter=\"" + item.Formatter + "\"";
                                                    <th data-align="center" data-field="@item.Key" @Html.Raw(formatter)>@item.Name</th>

                                                }
                                            }
                                        </tr>
                                    </thead>
                                </table>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="modal-footer" style="text-align: center;padding-top: 10px">
                    <button type="button" class="btn btn-sm  btn-default waves-effect" data-dismiss="modalProduct" style="min-width: 100px;" onclick="Clear_@(modalId)()">@(L("Clear"))</button>
                    <button type="button" class="btn btn-sm save-btn waves-effect" style="min-width: 100px;" onclick="Submit_@(modalId)()">@(L("OK"))</button>
                </div>

            </div>
        </div>
    </div>
</section>
@using (Html.BeginScripts())
{

    <script>
    //$(function() {

    //});
    var $@(modalId)_table = $("#@modalId table"), _searchList_@modalId = [], _searchKeyWord_@modalId = "";
    $("#@modalId").off('show.bs.modal').on('show.bs.modal', function () {
        $("#@modalId form").find(".key").val("");
        if ("@(tField)" && "@(tField)".length > 0){
            $('#treeView_@modalId').iwbTreeView({
                url: '@(selectUrl)',
                onNodeSelected: function(e, d) {
                    _searchKeyWord_@(modalId) = d["@(tSelectFiledName)"];
                    console.log("_searchKeyWord_", _searchKeyWord_@(modalId));
                    $@(modalId)_table.iwbTable('refresh', true);
                },
                onNodeUnselected: function() {
                    _searchKeyWord_@(modalId) = "";
                    $@(modalId)_table.iwbTable('refresh', true);
                },
                table:$@(modalId)_table
            });
        }
        @(modalId)Search();
    });
    function @(modalId)Refresh() {
        $@(modalId)_table.iwbTable('refresh', true);
    }
    function @(modalId)Search() {
        $@(modalId)_table.iwbTable("destroy");
        SearchList_@(modalId)();
        LoadTable({
            table: $@(modalId)_table,
            height: 500,
            onDblClickRow: DbClickRow_@(modalId),
            queryParams: QueryParams_@(modalId)
        });
    }
    function QueryParams_@(modalId)(params) {
        SearchList_@(modalId)();
        return {
            MaxResultCount: params.limit,
            SkipCount: params.offset,
            sort: params.sort,
            sortOrder: params.order,
            SearchList: _searchList_@modalId,
            KeyField: "@(tField)",
            FieldType: "@(tFType)",
            ExpType: "@(tExpType)",
            KeyWords: _searchKeyWord_@modalId
        };
    }

    function SearchList_@(modalId)() {
        _searchList_@modalId = [];
        if (@(isAddBind)) {
            _searchList_@(modalId).push(@(searBindFunc));
        }
        $("#@modalId form").find(".KeyWords").each(function() {
            var $this = $(this), keyWords = $this.val();
            if (keyWords) {
                searchList.push({
                    KeyWords: keyWords,
                    KeyField: $this.data('field'),
                    FieldType: $this.data('ftype'),
                    ExpType: $this.data('etype')
                });
            }
        });
    }

    function Clear_@(modalId)() {
        Submit_@(modalId)(false, true);
    }

    function Submit_@(modalId)(row, isClear) {
        console.log('@(modalId)submit', row,isClear);
        @{
            string str;
            if (string.IsNullOrEmpty(submit))
            {
                str = " var $target,value, row =row|| $" + modalId + "_table.bootstrapTable(\"getSelections\")[0];\r\n";
                str += "if (row) {\r\n";
                int i = 0;
                foreach (var targetFields in Model.TargetFields)
                {
                    str += "value = row." + Model.OriginFields[i] + " ? row." + Model.OriginFields[i] + ":'';\r\n";
                    foreach (var targetFiled in targetFields)
                    {
                        str += @"$target = $(window.queryModalTarget + ' " + targetFiled + "');\r\n";
                        str += "if ($target) {\r\n";
                        str += "value= isClear?'':value\r\n";
                        str += "$target.val(value);try{if ($target.is('select')) {$target.select2();}}catch (e) {} }\r\n";
                    }
                    i++;
                }

                str += " } else\r\n" +
                       "{\r\n" +
                       "abp.message.warn(abp.localization.localize(\"ChooseOneToOp\"));\r\n" +
                       "}\r\n";

            }
            else
            {
                str = submit + "(row);\r\n";
            }
        }
        @Html.Raw(str)
        $("#@modalId").modal('hide');
    }

    function DbClickRow_@(modalId)(row) {
        row = row || {};
        @{
            str = string.IsNullOrEmpty(dbClick) ? "Submit_" + modalId+ "(row)" : dbClick + "(row);";
        }
        @Html.Raw(str)
    }

    @*function ClickRow_@(modalId)() {
        "use strict";
        @{
            str = "";
            if (!string.IsNullOrEmpty(click))
            {
                str = click + "();";
            }
        }
        @Html.Raw(str)
    }*@

    </script>
}


<!-- QUERY-MODAL  @(Model.ModalId)  END-->