@using IwbZero.IwbDataQuery
@using IwbZero.ToolCommon.StringModel
@using WeEngine.Enum
@using WePlatform.Configuration
@using WePlatform.Authorization
@using WePlatform.Views.Shared.Modals
@using WePlatform.Views.Shared.Query
@using WePlatform.Views.Shared.SearchForm
@using WePlatform.Views.Shared.Table

@{
    ViewBag.Title = "情景库管理";
    string activeMenu = PermissionNames.PagesResourceMgSceneMg;
    string category = ViewBag.Category, sceneType = ViewBag.SceneType, guideType = ViewBag.GuideType, environment = ViewBag.Environment, behaviorType = ViewBag.BehaviorType, behaviorType2 = ViewBag.BehaviorType2, variableType = IwbDataType.GetDataTypeSelectStr();
    ViewBag.ActiveMenu = activeMenu;
    var searchForm = new SearchFormViewModel(new List<SearchItem>()
{
        new SearchItem("name","情景名称"),
        //new SearchItem("sceneCategory","场景类别").SetSelectItem(category,isTree:true),
        new SearchItem("sceneType","情景类型",FieldType.I).SetSelectItem(sceneType),
    });

    var table = new TableViewModel(IwbConsts.ApiAppUrl + "Scene/GetAll", activeMenu, searchForm)
    .SetFields(new List<FieldItem>()
    {
        new FieldItem("id", "编码"),
        new FieldItem("name", "情景名称"),
        new FieldItem("sceneCategoryName", "场景类别",isSort:false),
        new FieldItem("sceneType", "情景类型","SceneTypeFormatter"),
        new FieldItem("sceneTag", "情景标签"),
            });
}
@section css{
    <link href="~/Content/Libs/jstree/themes/proton/style.min.css" rel="stylesheet" />
    <style>

        .non-var-box {
            margin: 20px auto;
            font-size: 24px;
            font-weight: bold
        }
    </style>

}
@*<button class="btn btn-iwb" type="button" onclick="ExportTemplate()">导出模板</button>
    <button class="btn btn-iwb" type="button" onclick="Export()">导出</button>
    <button class="btn btn-iwb" type="button" onclick="Import()">导入</button>*@
<div class="row">
    <div class="col-sm-3">
        <div class="iwb-tree-box">
            <div class="box-header">场景类别</div>
            <div class="scroll box-body">
                <div id="sc-tree"></div>
            </div>
        </div>
    </div>
    <div class="col-sm-9">
        @Html.Partial("Table/_Table", table)
    </div>
</div>

@section modal{
    @{
        var baseInput = new ModalBodyViewModel(new List<Input>()
{
            new InputHide("id"),
            new InputHide("guideNos"),
            new Input("name", "情景名称"),
            new Input("sceneCategory", "场景类别").SetSelectOptions(category),
            new Input("sceneType", "情景类型").SetSelectOptions(sceneType),
            new Input("sceneTag", "情景标签").SetNotRequired(),
            new Input("guideNames", "情景引导").SetNotRequired().SetDisabled().SetSearchIcon("qm_guide","modal"),
            new InputTextarea("description", "情景描述").SetNotRequired(),
        });
        var uploadModal = new ModalViewModel("上传情景", "", new ModalBodyViewModel(new List<Input>(){
            new InputFile("uploadExcel","上传文件").SetFileOption("excelInfo","excelName","excelExt")
        }, "upload-form"), "upload-modal");
    }
    <!--Main Modal-->
    <section>
        <div class="modal fade show" id="modal" tabindex="-1" aria-modal="true">
            <div class="modal-dialog modal-lg" style="margin-top: 190.5px;">
                <div class="modal-content">
                    @Html.Partial("Modals/_ModalHeader", new ModalHeaderViewModel("情景"))
                    <div class="modal-body" style="padding: 0">
                        <form class="form-horizontal " id="form" novalidate="novalidate" style="padding: 0">
                            <div class="card card-primary card-outline card-outline-tabs" style="margin-bottom: 0; border-top: 0; ">
                                <div class="card-header p-0 border-bottom-0">
                                    <ul class="nav nav-tabs" id="scene-tab" role="tablist">
                                        <li class="nav-item">
                                            <a class="nav-link active" id="tab-base" data-toggle="pill" href="#tab-content-base" role="tab">基础信息</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" id="tab-behavior" data-toggle="pill" href="#tab-content-behavior" role="tab">处理行为</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" id="tab-environment" data-toggle="pill" href="#tab-content-environment" role="tab">情景资源</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" id="tab-variable" data-toggle="pill" href="#tab-content-variable" role="tab">情景变量</a>
                                        </li>
                                    </ul>
                                </div>

                                <div class="card-body">
                                    <div class="tab-content" id="scene-tabContent">

                                        <div class="tab-pane fade show active" id="tab-content-base" role="tabpanel">
                                            @Html.Partial("Modals/_ModalInput", baseInput)
                                        </div>

                                        <div class="tab-pane fade" id="tab-content-behavior" role="tabpanel">
                                            <div class="form-group row">
                                                <label class=" iwb-label iwb-label-sm iwb-label-required" for="sceneCategoryEx">场景类别</label>
                                                <div class="">
                                                    <div class="input-group input-group-sm">
                                                        <select class="form-control required" id="sceneCategoryEx" name="sceneCategoryEx" placeholder="请选择场景类别..." style="width: 100%">@(Html.Raw(category))</select>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="dynamic-box evolution" style="margin: 0 10px;">
                                                <div class="row iwb-dynamic-box">
                                                    <div class="dynamic-label col-sm-4">
                                                        <label class="iwb-label">处理行为</label>
                                                    </div>
                                                    <div class="dynamic-label col-sm-3">
                                                        <label class="iwb-label">评分类型</label>
                                                    </div>
                                                    <div class="dynamic-label col-sm-3">
                                                        <label class="iwb-label">行为权重</label>
                                                    </div>
                                                    <div class="dynamic-control col-sm-2">
                                                        <label class="iwb-label">增加/删除</label>
                                                    </div>
                                                </div>

                                                <div class="row iwb-dynamic-box">
                                                    <div class="col-sm-4">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control" name="behavior" style="width: 100%"></select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-3">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control" name="behaviorType" style="width: 100%">
                                                                @(Html.Raw(behaviorType))
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-3">
                                                        <div class="input-group input-group-sm">
                                                            <input class="form-control number" type="number" min="0" max="100" name="weight" placeholder="请输入权重" style="width: 100%" />
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-2">
                                                        <button class="btn btn-sm btn-block btn-add" type="button" onclick="AddDynamicBox(this)">增加</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="dynamic-box non-evolution" style="margin: 0 10px; display: none">
                                                <div class="row iwb-dynamic-box">
                                                    <div class="dynamic-label col-sm-5">
                                                        <label class="iwb-label">答案选项</label>
                                                    </div>
                                                    <div class="dynamic-label col-sm-5">
                                                        <label class="iwb-label">是否正确</label>
                                                    </div>
                                                    <div class="dynamic-control col-sm-2">
                                                        <label class="iwb-label">增加/删除</label>
                                                    </div>
                                                </div>

                                                <div class="row iwb-dynamic-box">
                                                    <div class="col-sm-5">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control" name="behavior" style="width: 100%"></select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-5">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control" name="behaviorType" style="width: 100%">
                                                                @(Html.Raw(behaviorType2))
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-2">
                                                        <button class="btn btn-sm btn-block btn-add" type="button" onclick="AddDynamicBox(this)">增加</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="tab-pane fade" id="tab-content-environment" role="tabpanel">
                                            <div class="dynamic-box">
                                                <div class="row iwb-dynamic-box">
                                                    <div class="dynamic-label col-sm-10">
                                                        <label class="iwb-label">环境资源</label>
                                                    </div>

                                                    <div class="dynamic-control col-sm-2">
                                                        <label class="iwb-label">增加/删除</label>
                                                    </div>
                                                </div>

                                                <div class="row iwb-dynamic-box ">
                                                    <div class="col-sm-10">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control" name="environment" style="width: 100%">
                                                                @(Html.Raw(environment))
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-2">
                                                        <button class="btn btn-sm btn-block btn-add" type="button" onclick="AddDynamicBox(this)">增加</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="tab-pane fade" id="tab-content-variable" role="tabpanel">
                                            <div class="dynamic-box" style="display: none">
                                                <div class="row iwb-dynamic-box">
                                                    <div class="dynamic-label col-sm-4">
                                                        <label class="iwb-label">变量</label>
                                                    </div>
                                                    <div class="dynamic-label col-sm-4">
                                                        <label class="iwb-label">类型</label>
                                                    </div>
                                                    <div class="dynamic-label col-sm-4">
                                                        <label class="iwb-label">默认值</label>
                                                    </div>
                                                </div>

                                                <div class="row iwb-dynamic-box ">
                                                    <div class="col-sm-4">
                                                        <div class="input-group input-group-sm">
                                                            <input class="form-control " name="variableId" placeholder="请输入变量" style="width: 100%" />
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-4">
                                                        <div class="input-group input-group-sm">
                                                            <select class="form-control " name="variableType" style="width: 100%">
                                                                @(Html.Raw(variableType))
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-sm-4">
                                                        <div class="input-group input-group-sm">
                                                            <input class="form-control " name="defaultValue" placeholder="请输入默认值" style="width: 100%" />
                                                        </div>
                                                    </div>
                                                    <div style="display: none">
                                                        <button class="btn btn-sm btn-block btn-add" type="button" onclick="AddDynamicBox(this)">增加</button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="non-var-box">暂无变量</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    @Html.Partial("Modals/_ModalFooter", "0")
                </div>
            </div>
        </div>
    </section>

    @Html.Partial("Query/_GuideInfo", new QueryWithSelect("guideNos,guideNames", new Dictionary<string, string>() { ["guideType"] = guideType }))
    @Html.Partial("Modals/_Modal", uploadModal)

}

@section scripts
{
    <script src="~/Content/Libs/jstree/jstree.min.js"></script>
    <script type="text/javascript">
        var $table, variables = [], cuScNo = '';
        $(function () {
            OverlayScrollbar($('.scroll'));
            InitScTree();
            //根据场景类别拉去场景角色
            $('#modal #sceneCategory').on('change.reBehavior', function() {
                $('#modal #sceneCategoryEx').val($(this).val()).select2();
                $('#modal #sceneCategoryEx').trigger("change");
            });
            $('#modal #sceneCategoryEx').on('change.reBehavior', function () {
                $('#modal #tab-content-behavior .iwb-dynamic-box-delete').remove();
                var no = $(this).val(),
                    $behavior = $('#modal #tab-content-behavior .evolution .iwb-dynamic-box').eq(1).find('.form-control[name="behavior"]'),
                    $behavior2 = $('#modal #tab-content-behavior .non-evolution .iwb-dynamic-box').eq(1).find('.form-control[name="behavior"]');
                $('#modal #sceneCategory').val(no).select2();
                if (no) {
                    $.iwbAjax4({
                        url: abp.appUrl + "query/GetBehaviorSelectStrByCategory?no=" + no,
                        success: function (res) {
                            $behavior.empty().removeData().html(res).select2();
                            $behavior2.empty().removeData().html(res).select2();
                        }
                    });
                } else {
                    $behavior.empty().removeData().html('<option value="" selected>请选择处理行为...</option>').select2();
                    $behavior2.empty().removeData().html('<option value="" selected>请选择处理行为...</option>').select2();
                    @*if ($('#modal #sceneType').val() === "@(SceneType.Evolution.ToInt())") {
                        $behavior.select2();
                    } else if ($('#modal #sceneType').val() === "@(SceneType.NonEvolution.ToInt())") {
                        $behavior2.select2();
                    }*@
                }
            });
            //情景类型
            $('#modal #sceneType').on('change.reSceneType', function() {
                var type = $(this).val(), $that = $('#modal #tab-content-behavior');
                $that.find('.dynamic-box').hide();
                if (type === "@(SceneType.Evolution.ToInt())") {
                    $that.find('.evolution').show();
                } else if (type === "@(SceneType.NonEvolution.ToInt())") {
                    $that.find('.non-evolution').show();
                }

            });
            //提取描述中的变量
            $('#modal #description').on('change.reDescription', function () {
                var text = $(this).val();

                ParseVariable(text);
            });
            $table = LoadTable({
                searchFun: TableSearchFun
            });
            var funs = window.iwbfuns || { none: function () { console.log("No type"); } };
            funs["btnCreate"] = function (url) {
                Reset();
                BtnCreate({
                    url: url,
                    dataFun: GetSceneData,
                    data: { id: "", sceneCategory: "" },
                    select2tree: "sceneCategory"
                }); }
            funs["btnUpdate"] = function(url) {
                var row = $table.bootstrapTable("getSelections")[0];
                if (row) {
                    Reset();
                    var no = row.id;
                    BtnUpdate({
                        url: url,
                        dataFun: GetSceneData,
                        disabled: "",
                        select2tree: "sceneCategory",
                        shownAfter: function () {
                            $('#modal #sceneCategoryEx').val(row.sceneCategory).select2tree();
                            $.iwbAjax4({
                                url: abp.appUrl + "query/GetBehaviorSelectStrByCategory?no=" + row.sceneCategory,
                                success: function (res) {
                                    var $behavior;
                                    if (row.sceneType === @(SceneType.Evolution.ToInt())) {
                                        $behavior = $('#modal #tab-content-behavior .evolution .iwb-dynamic-box').eq(1)
                                            .find('.form-control[name="behavior"]');
                                    } else if (row.sceneType  === @(SceneType.NonEvolution.ToInt())) {
                                        $behavior = $('#modal #tab-content-behavior  .non-evolution .iwb-dynamic-box')
                                            .eq(1).find('.form-control[name="behavior"]');
                                    }
                                    $behavior.empty().removeData().html(res).select2();
                                    $('#modal #sceneType').trigger("change");
                                    $.iwbAjax4({
                                        url: abp.appUrl + "Scene/GetSceneBehavior?no=" + no,
                                        success: function(res) {
                                            ParseBehaviors(res, row.sceneType);
                                        }
                                    });
                                }
                            });

                            $.iwbAjax4({
                                url: abp.appUrl + "Scene/GetSceneGuideByNo?no=" + no,
                                success: function (res) {
                                    if (res&&res.length>1) {
                                        $('#modal #guideNos').val(res[0]);
                                        $('#modal #guideNames').val(res[1]);
                                    }
                                }
                            });
                            $.iwbAjax4({
                                url: abp.appUrl + "Scene/GetSceneEnvironResourceNos?no=" + no,
                                success: function(res) {
                                    ParseEnvironments(res);
                                }
                            });
                            $.iwbAjax4({
                                url: abp.appUrl + "Scene/GetSceneVariable?no=" + no,
                                success: function(res) {
                                    FillVariable(res);
                                }
                            });
                        }
                    }, row);

                }
            };

            funs["btnExportTemplate"] = function(url) {
                $.iwbAjax4({
                    url: url,
                    success: function(res) {
                        window.location.href = res;
                    }
                });
            }
            funs["btnExport"] = function(url) {
                $.iwbAjax4({
                    url: url,
                    data: GetSearchList,
                    success: function(res) {
                        window.location.href = res;
                    }
                });
            }
            funs["btnImport"] = function (url) {
                OpenModal({
                    modal: "upload-modal",
                    url: url,
                    save: function() {
                        $.iwbAjax1({
                            url: url,
                            modal:"upload-modal",
                            form: "upload-form",
                            success: function() {
                                RefreshTable();
                            }
                        });
                    }
                });
            };
        });

               function InitScTree() {
            $('#sc-tree')
                .jstree({
                    'core': {
                        'data': GetNode,
                        'strings': {
                            'Loading ...': '请稍后...'
                        },
                        'force_text': true,
                        'check_callback': true,
                        'themes': {
                            'name': 'proton',
                            'responsive': true,
                            'variant': 'large'
                        }
                    },

                    'plugins': ['wholerow'] // 'state',
                }).on('ready.jstree',function(e, data) {
                        //console.log('000', e, data);
                        var inst = data.instance,
                            obj = inst.get_node('@(IwbConsts.SceneCategoryRootNo)');
                        inst.open_node(obj);
                        inst.select_node(obj);
                        cuScNo = '';
                        RefreshTable();
                }).on('activate_node.jstree',function(e, data) {
                    //console.log('111',data);
                    cuScNo = data.node.id == '@(IwbConsts.SceneCategoryRootNo)' ? "" : data.node.id;
                    RefreshTable();
                });
        }

        function GetNode(node, callback) {
            $.iwbAjax4({
                url: abp.appUrl + 'Query/GetChildSceneCategory',
                data: { id: node.id },
                success: function(res) {
                    if (callback) {
                        callback.call(this, res);
                    } else {
                        $("#sc-tree").html("暂无数据！");
                    }
                }
            });
        }

        function TableSearchFun(sl) {
            sl.push({
                KeyWords: cuScNo,
                KeyField: 'sceneCategory',
                FieldType: '0',
                ExpType: '0'
            });
        }

        function ExportTemplate() {
            $.iwbAjax4({
                url: abp.appUrl + "Scene/ExportTemplate",
                data: GetSearchList,
                success: function(res) {
                    window.location.href = res;
                }
            });
        };
        function Export() {
            $.iwbAjax4({
                url: abp.appUrl + "Scene/Export",
                data: GetSearchList,
                success: function(res) {
                    window.location.href = res;
                }
            });
        };
        function Import() {
            OpenModal({
                modal: "upload-modal",
                url: abp.appUrl + "Scene/Import",
                save: function() {
                    $.iwbAjax1({
                        url: abp.appUrl + "Scene/Import",
                        modal:"upload-modal",
                        form: "upload-form",
                        success: function() {
                            RefreshTable();
                        }
                    });
                }
            });
        };

        function GetSearchList() {
            var searchList = $('table').iwbTable('getSearchList');

            return {
                searchList: searchList
            }
        }
    </script>
    <script>
        //自定义获取提交数据
        function GetSceneData() {
            var data = {};
            var $behavior = [],behaviors = [], environments = [];if ($('#modal #sceneType').val() === "@(SceneType.Evolution.ToInt())") {
                $behavior = $('#modal #tab-content-behavior .evolution .iwb-dynamic-box');
            } else if ($('#modal #sceneType').val() === "@(SceneType.NonEvolution.ToInt())") {
                $behavior = $('#modal #tab-content-behavior  .non-evolution .iwb-dynamic-box');
            }
            $behavior.find('.form-control[name="behavior"]').each(function () {
                var id = $(this).val(), $that = $(this).closest('.iwb-dynamic-box');
                if ($(this).val()) {
                    behaviors.push({
                        behaviorNo: id,
                        behaviorEvalType: $that.find('.form-control[name="behaviorType"]').val(),
                        behaviorWeight: $that.find('.form-control[name="weight"]').val()
                    });
                }
            });
            $('#modal #tab-content-environment .iwb-dynamic-box').find('.form-control[name="environment"]').each(
                function () {
                    if ($(this).val()) {
                        environments.push($(this).val());
                    }
                });
            data.id = $('#modal #id').val();
            data.name = $('#modal #name').val();
            data.sceneCategory = $('#modal #sceneCategory').val();
            data.sceneType = $('#modal #sceneType').val();
            data.sceneTag = $('#modal #sceneTag').val();
            data.description = $('#modal #description').val();
            data.guideNos = $('#modal #guideNos').val();
            data.sceneBehaviors = behaviors;
            data.environResourceNos = environments;
            data.variables = variables;
            //console.log(data);
            return data;
        }
        //解析处理行为
        function ParseBehaviors(behaviors,type) {
            if (behaviors && behaviors.length > 0) {
                var $that;
                if (type === @(SceneType.Evolution.ToInt())) {
                    $that = $('#modal #tab-content-behavior .evolution');
                } else if (type === @(SceneType.NonEvolution.ToInt())) {
                    $that = $('#modal #tab-content-behavior  .non-evolution');
                }
                for (var i = 0; i < behaviors.length; i++) {
                    var behavior = behaviors[i];
                    var $that2 = i === 0 ? $that.find('.iwb-dynamic-box').eq(1) : AddDynamicBox($that.find('.iwb-dynamic-box').eq(1).find('.btn-add'));
                    $that2.find('.form-control[name="behavior"]').val(behavior.behaviorNo).select2();
                    $that2.find('.form-control[name="behaviorType"]').val(behavior.behaviorEvalType).select2();
                    $that2.find('.form-control[name="weight"]').val(behavior.behaviorWeight);

                }
            }
        }
        //解析环境资源
        function ParseEnvironments(nos) {
            if (!nos||nos.length<=0) {
                return;
            }
            //var noArr = nos.split(",");
            for (var i = 0; i < nos.length; i++) {
                var no = nos[i];
                var $that = i === 0 ? $('#modal #tab-content-environment .iwb-dynamic-box').eq(1) : AddDynamicBox($('#modal #tab-content-environment .iwb-dynamic-box').eq(1).find('.btn-add'));
                $that.find('.form-control[name="environment"]').val(no).select2();

            }
        }
        //解析变量
        function ParseVariable(text) {
            var regex = new RegExp(/@@[0-9,a-z,A-Z]+/g);
            var arr = text.match(regex);
            var newVariables = [];
            if (arr!=null && arr.length > 0) {
                for (var i = 0; i < arr.length; i++) {
                    var id = arr[i];
                    if (!newVariables.some(function (val) { return val.id === id; })) {
                        var variable = variables.find(function (val) {return val.id === id;});
                        variable = variable == null ? { id: arr[i],  type: "string", value: "" } : variable;
                        newVariables.push(variable);
                    }
                }
            }
            FillVariable(newVariables);
        }
        //回填变量
        function FillVariable(vs) {
            variables = vs;
            $('#modal #tab-content-variable > div').hide();
            $('#modal #tab-content-variable').find('.form-control').removeClass('required');
            $('#modal #tab-content-variable .iwb-dynamic-box-delete').remove();
            if (vs.length > 0) {
                $('#modal #tab-content-variable .dynamic-box').show();
                $('#modal #tab-content-variable').find('.form-control').addClass('required');
                for (var j = 0; j < vs.length; j++) {
                    var data = vs[j],
                        $that = j === 0 ? $('#modal #tab-content-variable .iwb-dynamic-box').eq(1) : AddDynamicBox($('#modal #tab-content-variable .iwb-dynamic-box').eq(1).find('.btn-add'));
                    $that.find('.form-control[name="variableId"]').val(data.id).prop("disabled", true);
                    //$that.find('.form-control[name="variableName"]').val(data.name).off('change.reVn').on('change.reVn', function () {
                    //    var id = $(this).closest('.iwb-dynamic-box').find('.form-control[name="variable"]').val();
                    //    var index = vs.findIndex(function (val) { return val.id === id; });
                    //    if (index >= 0) {
                    //        vs[index].name = $(this).val();
                    //    }
                    //});
                    $that.find('.form-control[name="variableType"]').val(data.type).select2().off('change.reVt').on('change.reVt', function () {
                        var id = $(this).closest('.iwb-dynamic-box').find('.form-control[name="variableId"]').val();
                        var index = vs.findIndex(function (val) { return val.id === id; });
                        if (index >= 0) {
                            vs[index].type = $(this).val();
                        }
                    });
                    $that.find('.form-control[name="defaultValue"]').val(data.value).off('change.reDv').on('change.reDv', function () {
                        var id = $(this).closest('.iwb-dynamic-box').find('.form-control[name="variableId"]').val();
                        var index = vs.findIndex(function (val) { return val.id === id; });
                        if (index >= 0) {
                            vs[index].value = $(this).val();
                        }
                    });
                }
            } else {
                $('#modal #tab-content-variable .non-var-box').show();
            }
        }

        //复位modal
        function Reset() {
            variables = [];
            $('#modal .iwb-dynamic-box-delete').remove();
            $('#scene-tab li').eq(0).find('a').tab('show');
        }
    </script>

    <!--格式化-->
    <script id="formatter-script" type="text/javascript">
        function TypeFormatter(v) {
            var name = $('#hid-type option[value="' + v + '"]').text();
            switch (v) {
                case 0:
                    return '<span class="label label-danger">' + name + '</span>';
                default:
                    return '<span class="label label-info">' + name + '</span>';
            }
        }
        function SceneTypeFormatter(v) {
            var name = $('#hid-sceneType option[value="' + v + '"]').text();
            switch (v) {
                case 1:
                    return '<span class="label label-danger">' + name + '</span>';
                default:
                    return '<span class="label label-info">' + name + '</span>';
            }
        }
    </script>
}

<section style="display: none">
    <select id="hid-type">
        <option value=""></option>
    </select>
    <select id="hid-sceneType">
        @(Html.Raw(sceneType))
    </select>

    @*@Html.DropDownList("hid-type", type)*@
</section>