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

@{
    ViewBag.Title = "演练培训营管理";
    string activeMenu = PermissionNames.PagesTrainMgCampMg; //The menu item will be active for this page.
    ViewBag.ActiveMenu = activeMenu;
    string auditState = ViewBag.AutidState,
        state = ViewBag.State,
        stuHelp = ViewBag.SthHelp,
        variableType = IwbDataType.GetDataTypeSelectStr();
    var searchForm = new SearchFormViewModel(new List<SearchItem>()
{
        new SearchItem("name","培训营名称"),
        new SearchItem("packageName","方案包名称"),
        new SearchItem("campState","方案包状态",FieldType.I).SetSelectItem(state),
        new SearchItem("planDate","计划日期",FieldType.D),
    });

    var table = new TableViewModel(IwbConsts.ApiAppUrl + "Camp/GetAll", activeMenu, searchForm)
    .SetFields(new List<FieldItem>()
    {
        new FieldItem("name", "培训营名称"),
        new FieldItem("packageName", "方案包名称"),
        new FieldItem("scoreRule", "评分规则"),
        new FieldItem("campState", "方案包状态","StateFormatter").SetWidth(100),
        new FieldItem("roundScore", "每轮总分").SetWidth(100),
        new FieldItem("planDate", "计划日期","DateTimeFormatter").SetWidth(200),
        new FieldItem("", "操作","ActionFormatter").SetWidth(200),
                                                                                                                                                                                                                                            });
    var input = new ModalBodyViewModel(new List<Input>()
{
        new InputHide("id"),
        new InputHide("packageName"),
        new InputHide("engineModelType"),
        new Input("name", "培训营名称"),
        new Input("packageNo", "方案包编号").SetSelectOptions(""),
        new Input("address", "培训地点"),
        new InputDateTime("planDate", "计划日期"),
        new InputNumber("roundScore", "每轮总分").SetMin(100),
        new InputNumber("maxRoundMinute", "每轮时长").SetMin(1),
        //new Input("scoreRule", "评分规则",@class:"expression").SetHelp("请以@分隔 [系统评分(权重|总分),专家评分(权重|总分),电话评分(权重|总分)] （例: 7|500@2|10@1|100）"),
        //new Input("campState", "审核状态").SetSelectOptions(auditState),
        //new InputTextarea("description", "培训目标").SetNotRequired(),
    });
    var input2 = new ModalBodyViewModel(new List<Input>()
{
        //new InputNumber("roundScore", "每轮总分").SetMin(100),
        //new InputNumber("maxRoundMinute", "每轮时长").SetMin(1),
        new Input("scoreRule", "评分规则",@class:"expression").SetHelp("请以@分隔 [系统评分(权重|总分),专家评分(权重|总分),电话评分(权重|总分)] （例: 7|500@2|10@1|100）"),
        new Input("campState", "审核状态").SetSelectOptions(auditState),
        new Input("stuHelp", "学员提示").SetSelectOptions(stuHelp,true).SetNotRequired(),
        new InputTextarea("description", "培训目标").SetNotRequired(),
    });

}
@section css{

}

@Html.Partial("Table/_Table", table)

@section 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" 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" data-toggle="pill" href="#tab-content-base2" 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", input)
                                        </div>

                                        <div class="tab-pane fade" id="tab-content-base2" role="tabpanel">
                                            @Html.Partial("Modals/_ModalInput", input2)
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    @Html.Partial("Modals/_ModalFooter", "0")
                </div>
            </div>
        </div>
    </section>

}

@section scripts
{
    <script type="text/javascript">
        jQuery.validator.addMethod("expression",
            function(value, element) {
                var tel = /^\d{1,}\|\d{1,}@@+\d{1,}\|\d{1,}@@+\d{1,}\|\d{1,}$/;
                return  (tel.test(value));
            },
            "请正确填写表达式！");
        var $table;
        $(function() {
            $table = LoadTable();
            var packageSettingStr =
                '<div style="margin: 0px 20px 10px;"><button type="button" class="btn btn-sm btn-block btn-success" id="package-btn" onclick="PackageSetting(\'{0}\')">方案包配置</button></div>';
            $('#modal #packageNo').off('change.package').on('change.package',
                function() {
                    $('#modal #packageName').val('');
                    $('#modal #engineModelType').val('');
                    $('#modal #package-btn').remove();
                    _PackageSetting = null;
                    var packageNo = $('#modal #packageNo').val();
                    if (packageNo) {
                        GetPackageSetting(packageNo);
                        $('#modal #packageName').val($('#modal #packageNo option:selected').text());
                        $('#modal #engineModelType').val($('#modal #packageNo option:selected').data('model-type'));
                        $(this).closest('.form-group').after(packageSettingStr.format(packageNo));
                    }
                });
            var funs = window.iwbfuns || { none: function() { console.log("No type"); } };
            funs["btnCreate"] = function() {
                $('#modal #package-btn').remove();
                _PackageSetting = null;
                $('#tab-base').tab('show');
                $.iwbAjax4({
                    url: abp.appUrl + 'Camp/GetPackageSelectStr',
                    block: true,
                    success: function(res) {
                        $('#modal #packageNo').html(res).select2();
                        BtnCreate({
                            data: { id: "", scoreRule:'7|500@2|10@1|100', campState: '@(CampStateDefinition.New)' },
                            disabled: 'campState',
                            dataFun: GetSaveData
                        });
                    }
                });
            }
            funs["btnUpdate"] = function() {
                var row = $table.bootstrapTable('getSelections')[0];
                $('#modal #package-btn').remove();
                if (row) {
                    $('#tab-base').tab('show');
                    if (row.campState == @(CampStateDefinition.New) || row.campState == @(CampStateDefinition.Audit)) {
                        $('#modal #packageNo').closest('.form-group').after(packageSettingStr.format(row.packageNo));
                        _PackageSetting = null;
                        $.iwbAjax4({
                            url: abp.appUrl + 'Camp/GetPackageSelectStr',
                            block: true,
                            success: function(res) {
                                $('#modal #packageNo').html(res).select2();
                                BtnUpdate({
                                        disabled: "",
                                        dataFun: GetSaveData,
                                        shownAfter: function() {
                                            GetPackageSetting(row.packageNo);
                                            GetStuHelp(row.id);
                                        }
                                    },
                                    row);
                            }
                        });

                    } else {
                        abp.message.warn("培训营已运行不能再修改！");
                    }
                } else {
                    abp.message.warn(abp.localization.iwbZero('SelectRecordOperation'));
                }
            };
            funs["btnGroup"] = function(url) {
                var row = $table.bootstrapTable('getSelections')[0];
                if (row) {
                    $.iwbAjax4({
                        url: abp.appUrl + 'Camp/CheckCampGroup?no=' + row.id,
                        isAlert: false,
                        success: function(res) {
                            if (res) {
                                window.open(res, "_blank");
                            } else {
                                $(document).iwbModal('create',
                                    {
                                        url: url,
                                        modal: 'modal-group',
                                        modaltitle: '分组管理',
                                        data: { campNo: row.id, count: 1 },
                                        modalBody:
                                            '<form style="margin-top:10px"><input class="form-control" id="campNo" name="campNo" type="hidden"><div class="form-group row"><label class=" iwb-label iwb-label-sm iwb-label-required" for="count">分组数量</label><div class=""><div class="input-group input-group-sm "><input class="form-control required number" id="count" name="count" min="1" type="number" placeholder="请输入分组数量..."></div></div></div></form>',
                                        success: function(res) {
                                            if (res) {
                                                window.open(res, "_blank");
                                            }
                                        }

                                    });
                            }
                        }
                    });
                } else {
                    abp.message.warn(abp.localization.iwbZero('SelectRecordOperation'));
                }
            }
            funs["btnAttach"] = function() {
                var row = $table.bootstrapTable('getSelections')[0];
                if (row) {
                    $.iwbAjax1({
                        url: abp.appUrl + 'Camp/CheckAttach?no=' + row.id,
                        isAlert: false,
                        success: function(res) {
                            if (res) {
                                window.open(res, "_blank");
                            }
                        }
                    });
                } else {
                    abp.message.warn(abp.localization.iwbZero('SelectRecordOperation'));
                }

            }
            funs["btnTag"] = function(url) {
                var row = $table.bootstrapTable('getSelections')[0];
                if (row) {
                    $.iwbAjax4({
                        url: abp.appUrl + 'Camp/GetBehaviorTags?no=' + row.id,
                        isAlert: false,
                        success: function(res) {
                            if (res) {
                                TagModal(res, url);
                            }
                        }
                    });
                } else {
                    abp.message.warn(abp.localization.iwbZero('SelectRecordOperation'));
                }
            }
            funs["btnRole"] = function(url) {
                var row = $table.bootstrapTable('getSelections')[0];
                if (row) {
                    $.iwbAjax4({
                        url: abp.appUrl + 'Camp/GetGroupRoles?no=' + row.id,
                        isAlert: false,
                        success: function(res) {
                            if (res) {
                                GroupRoleModal(res, url);
                            }
                        }
                    });
                } else {
                    abp.message.warn(abp.localization.iwbZero('SelectRecordOperation'));
                }
            }
        });

        function GetSaveData() {
            _PackageSetting = _PackageSetting || {};
            var data = $.formSerialize($('#modal #form'));
            //data.roundScore = _PackageSetting.roundScore;
            data.assessRoleNames = _PackageSetting.assessRoleNames;
            data.assessAuto = _PackageSetting.assessAuto;
            data.variable = _PackageSetting.variable;
            return data;
        }

        function GetStuHelp(id) {
            $.iwbAjax4({
                url: abp.appUrl + 'query/GetStuHelpStrByCamp?no=' + id ,
                success: function(res) {
                    if (res) {
                        $('#modal #stuHelp').val(res).select2();
                    }
                }
            });
        }
    </script>

    <script id="PackageSetting-S">
        var _PackageSetting = null;

        function PackageSetting() {
            if (_PackageSetting) {
                console.log("qq",_PackageSetting)
                PackageSettingModal(_PackageSetting);
            } else {
                abp.message.warn('未发现配置信息！');
            }
        }

        function GetPackageSetting(no) {
            var id = $('#modal #id').val() || 'none';
            $.iwbAjax4({
                url: abp.appUrl + 'camp/GetPackageSetting?id=' + id + '&packageNo=' + no,
                success: function(res) {
                    if (res) {
                        _PackageSetting = res;
                    }
                }
            });
        }

        function PackageSettingModal(data) {
            var $body = FormatterPackageSettingBody(data);
            $(document).iwbModal('create',
                {
                    modal: 'modal-package-setting',
                    modaltitle: "方案包配置",
                    modalBody: $body,
                    save: SavePackageSetting
                });
        }

        function FormatterPackageSettingBody(data) {
            var $form = $('<form>', { 'css': { 'padding': '10px' } });
            //$form.append(
            //    '<div class="form-group row"><label class=" iwb-label iwb-label-sm" for="roundScore">每轮总分</label><div class=""><div class="input-group input-group-sm "><input class="form-control number" id="roundScore" name="roundScore" type="text" placeholder="请输入每轮总分..." style="" aria-required="true"></div></div></div>');
            //if (data.roundScore) {
            //    $form.find('#roundScore').val(data.roundScore);
            //}
            $form.append(FormatterVariableBox(data.variable));
            $form.append(FormatterRoleBox(data.allRoles, data.assessRoleNames, data.assessAuto));
            return $form;
        }

        function FormatterRoleBox(allRoles, assessRoleNames, assessAuto) {
            var temp =
                '<label class="iwb-checkbox iwb-{3}"><input type="checkbox" id="role-{0}" data-role-no="{0}" data-role-name="{1}" name="assess-role{4}" value="{0}" {2}><span></span>{1}</label>';

            var $roleBox = $('<div>',
                { 'class': 'dynamic-box row', 'css': { 'margin': '10px', 'paddingBottom': '0' } });
            var roleArr = assessRoleNames ? assessRoleNames.split(',') : undefined;
            var modelType = $('#modal #engineModelType').val();
            if (allRoles) {
                allRoles.forEach(function(v) {
                    var checkedStr = "";
                    if (roleArr && roleArr.indexOf(v.roleName) >= 0) {
                        checkedStr = "checked";
                    }
                    var $role = $('<div>', { 'class': 'col-sm-4' }).append(temp.format(v.roleName,
                        v.roleName + "(" + v.rolePer + "%)",
                        checkedStr,
                        'green',""));
                    if (modelType == @(ModelType.IndependentTeam.ToInt()) ||
                        modelType == @(ModelType.Independent.ToInt())) {
                        $role.on('click',
                            function(e) {
                                e.preventDefault();
                                e.stopPropagation();
                                var flag = $(this).find('input').is(':checked');
                                $(this).closest('.role-box').find('input').prop('checked', false);
                                $(this).find('input').prop('checked', !flag);
                            });
                    }
                    $roleBox.append($role);
                });
            }
            var $info = $('<div>',
                { 'class': 'iwb-info-box iwb-sm', 'id': 'role-box', 'css': { 'padding': '0 10px' } });
            $info.append('<div class="box-header">考核角色<small>(不配置即视为关闭关联角色)</small></div>');
            $info.append($roleBox);
            $info.append($('<div>',
                    {
                        'class': 'role-auto',
                        'css': { 'border': 'none', 'textAlign': 'right', 'marginRight': '0 30px 0 0' }
                    })
                .append(temp.format('auto', '未考核角色自动满分', assessAuto != false ? "checked" : "", 'danger',"auto")));
            return $info;
        }

        function FormatterVariableBox(variableStr) {
            if (!variableStr) {
                return '';
            }
            var label = '<div class="dynamic-label col-sm-{0}"><label class="iwb-label">{1}</label></div >',
                $box = $('<div>', { 'class': 'dynamic-box', 'css': { 'margin': '10px' } }),
                $box1 = $('<div>', { 'class': 'row iwb-dynamic-box' }),
                $box2 = $('<div>', { 'class': 'row iwb-dynamic-box' });
            $box1.append(label.format('4', '变量'))
                .append(label.format('4', '类型'))
                .append(label.format('4', '默认值'));
            $box2.append(
                '<div class="col-sm-4"><div class="input-group input-group-sm"><input class="form-control required" name="variableId" placeholder="请输入变量" style="width: 100%" /></div></div><div class="col-sm-4"><div class="input-group input-group-sm"><select class="form-control required" 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 required" 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>');
            $box.append($box1).append($box2);

            var variableArr = variableStr.split(',');
            for (var i = 0; i < variableArr.length; i++) {
                var str = variableArr[i];
                var arr = str.split(':');
                var $that = i === 0
                    ? $box.find('.iwb-dynamic-box').eq(1)
                    : AddDynamicBox($box.find('.iwb-dynamic-box').eq(1).find('.btn-add'));
                $that.find('.form-control[name="variableId"]').val(arr[0]).prop('disabled', true);
                $that.find('.form-control[name="variableType"]').val(arr[1].toLocaleLowerCase() || "string").select2()
                    .prop('disabled', true);
                $that.find('.form-control[name="defaultValue"]').val(arr[2] || "");
            }
            var $info = $('<div>',
                { 'class': 'iwb-info-box iwb-sm', 'id': 'variable-box', 'css': { 'padding': '0 10px' } });
            $info.append('<div class="box-header">全局变量</div>');
            $info.append($box);
            return $info;
        }

        function SavePackageSetting() {
            var $modal = $('#modal-package-setting');
            _PackageSetting = _PackageSetting || {};
            //_PackageSetting.roundScore = $modal.find('#roundScore').val();

            var roleNames = '';
            $modal.find('#role-box input[name="assess-role"]:checked').each(function() {
                if ($(this).is(':checked')) {
                    roleNames += (roleNames === "" ? "" : ",") + $(this).data('role-no');
                }
            });
            _PackageSetting.assessAuto = $modal.find('#role-auto').is(':checked');
            _PackageSetting.assessRoleNames = roleNames;
            var variableStr = '';
            $modal.find('#variable-box').find('.iwb-dynamic-box').each(function() {
                var name = $(this).find('.form-control[name="variableId"]').val();
                if (name) {
                    var type = $(this).find('.form-control[name="variableType"]').val() || 'string';
                    var value = $(this).find('.form-control[name="defaultValue"]').val() || '';
                    variableStr += (variableStr == '' ? '' : ',') + '{0}:{1}:{2}'.format(name, type, value);
                }
            });
            _PackageSetting.variable = variableStr;
            $modal.modal('hide');
        }
    </script>

    <script id="tag-s">
        function TagModal(data, url) {
            var $body = FormatterTagBody(data);
            $(document).iwbModal('create',
                {
                    modal: 'modal-tag',
                    modaltitle: "筛选行为标签",
                    modalBody: $body,
                    save: function () {
                        SaveTag(url);
                    }
                });
        }

        function FormatterTagBody(data) {
            var $form = $('<form>', { 'css': { 'padding': '10px' } });
            $form.append('<input class="form-control" id="campNo" name="campNo" type="hidden">');
            $form.find("#campNo").val(data.campNo);
            var temp =
                '<label class="iwb-checkbox iwb-{3}"><input type="checkbox" id="tag-{0}" data-tag-no="{0}" name="tag" value="{0}" {2}><span></span>{1}</label>';

            var $tagBox = $('<div>', { 'class': 'dynamic-box row', 'css': { 'margin': '10px', 'paddingBottom': '0' } });
            var tagArr = data.behaviorTagNos ? data.behaviorTagNos.split(',') : undefined;
            if (data.allTags) {
                data.allTags.forEach(function (v) {
                    var checkedStr = "";
                    if (tagArr && tagArr.indexOf(v.tagNo) >= 0) {
                        checkedStr = "checked";
                    }
                    var $tag = $('<div>', { 'class': 'col-sm-3' })
                        .append(temp.format(v.tagNo, v.tagName, checkedStr, 'green'));
                    $tagBox.append($tag);
                });
            }
            var $info = $('<div>', { 'class': 'iwb-info-box iwb-sm', 'id': 'tag-box', 'css': { 'padding': '0 10px' } });
            $info.append('<div class="box-header">评估标签</div>');
            $info.append($tagBox);
            $form.append($info);
            return $form;
        }

        function SaveTag(url) {
            var $modal = $('#modal-tag'), data = { campNo: $modal.find('#campNo').val() };
            var tagNos = '';
            $modal.find('#tag-box input[name="tag"]:checked').each(function () {
                if ($(this).is(':checked')) {
                    tagNos += (tagNos === "" ? "" : ",") + $(this).data('tag-no');
                }
            });
            data.behaviorTagNos = tagNos;
            $.iwbAjax1({
                url: url,
                data: data,
                success: function () {
                    $modal.modal('hide');
                }
            });
        }
    </script>

    <script id="groupRole-s">
        function GroupRoleModal(data, url) {
            var $body = FormatterGroupRoleBody(data);
            $(document).iwbModal('create',
                {
                    modal: 'modal-group-role',
                    modaltitle: "筛选角色组预案",
                    modalBody: $body,
                    save: function () {
                        SaveGroupRole(url);
                    }
                });
        }

        function FormatterGroupRoleBody(data) {
            var $form = $('<form>', { 'css': { 'padding': '10px' } });
            $form.append('<input class="form-control" id="campNo" name="campNo" type="hidden">');
            $form.find("#campNo").val(data.campNo);
            var temp =
                '<label class="iwb-checkbox iwb-{3}"><input type="checkbox" id="group-{0}" data-group-no="{0}" name="group" value="{0}" {2}><span></span>{1}</label>';

            var $groupBox = $('<div>',
                { 'class': 'dynamic-box row', 'css': { 'margin': '10px', 'paddingBottom': '0' } });
            //var groupArr = data.groupNos ? data.groupNos.split(',') : undefined;
            if (data.allGroups) {
                data.allGroups.forEach(function (v) {
                    var checkedStr = "";
                    if (data.groupNos && data.groupNos.indexOf(v.id) >= 0) {
                        checkedStr = "checked";
                    }
                    var $group = $('<div>', { 'class': 'col-sm-3' })
                        .append(temp.format(v.id, v.roleGroupName, checkedStr, 'green'));
                    $groupBox.append($group);
                });
            }
            var $info = $('<div>',
                { 'class': 'iwb-info-box iwb-sm', 'id': 'group-box', 'css': { 'padding': '0 10px' } });
            $info.append('<div class="box-header">角色组预案</div>');
            $info.append($groupBox);
            $form.append($info);
            return $form;
        }

        function SaveGroupRole(url) {
            var $modal = $('#modal-group-role'), data = { campNo: $modal.find('#campNo').val() };
            var groupNos = [];
            $modal.find('#group-box input[name="group"]:checked').each(function () {
                if ($(this).is(':checked')) {
                    groupNos.push($(this).data('group-no'));
                }
            });
            data.groupNos = groupNos;
            $.iwbAjax1({
                url: url,
                data: data,
                success: function () {
                    $modal.modal('hide');
                }
            });
        }
    </script>
    <!--格式化-->
    <script id="formatter-script" type="text/javascript">
        var icon = '<i class="fa fa-angle-double-right"></i>';

        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 ActionFormatter(v, r) {
            var temp = '<a class="table-action" href="{1}" target="_blank">' + icon + '{0}</a>';
            var str = '';
            if (r.campState == @(CampStateDefinition.Audit) || r.campState == @(CampStateDefinition.Run)) {
                str += temp.format("演练实施", '/Train/Eval/{0}'.format(r.id));

            }
            if (r.campState == @(CampStateDefinition.Run)) {
                @if (IsGranted(PermissionNames.PagesTrainMgPortraitMgGenerate))
                {
                    <text>
                        str += temp.format("生成画像", '/Train/GeneratePortrait/{0}'.format(r.id));
                    </text>
                }
            }
            if (r.campState == @(CampStateDefinition.End)) {
                @if (IsGranted(PermissionNames.PagesTrainMgPortraitMgGenerate))
                {
                    <text>
                str += temp.format("生成画像", '/Train/GeneratePortrait/{0}'.format(r.id));
                    </text>
                }
                else if (IsGranted(PermissionNames.PagesTrainMgPortraitMgQuery))
                {
                    <text>
                str += temp.format("演练画像", '/Train/Portrait/{0}'.format(r.id));
                    </text>
                }
            }
            if (!str) {
                str += '<span class="table-action">暂无操作</span>';
            }
            return str;
        }

        function StateFormatter(v) {
            var name = $('#hid-state option[value="' + v + '"]').text();
            switch (v) {
            case @(CampStateDefinition.New):
                return '<span class="label label-info">' + name + '</span>';
            case @(CampStateDefinition.Audit):
                return '<span class="label label-success">' + name + '</span>';
            case @(CampStateDefinition.Run):
                return '<span class="label label-iwb">' + name + '</span>';
            case @(CampStateDefinition.Error):
            case @(CampStateDefinition.End):
                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-state">
        @(Html.Raw(state))
    </select>

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