{extend name="Public/base" /}
{block name="js"}
<script>
    $(function(){
        $(".nul_bli").eq(3).find(".navb").addClass("active");
    });
    var staff_name = "{$Think.session.staff_name}";
    var colModel = "{$colModel}";
    var colNames = "{$colNames}";
//    var cid = "{$cid}";
</script>
<!--<script src="__PUBLIC__/js/public.js?v={$Think.const.APP_VERSION}"></script>-->
  <!--<script src="__PUBLIC__/js/cus-index.min.js?v={$Think.const.APP_VERSION}"></script>-->
<!--<script src="__PUBLIC__/js/cus-index.js?v={$Think.const.APP_VERSION}"></script>-->
{/block}
{block name="css"}
<!-- <link rel="stylesheet" href="__PUBLIC__/font/fonts/iconfont.css?v={$Think.const.APP_VERSION}"> -->
<link rel="stylesheet" href="__PUBLIC__/css/customer.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/item/css/layui.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/set.css?v={$Think.const.APP_VERSION}">
<link rel="stylesheet" href="__PUBLIC__/css/font-awesome.min.css">
<link rel="stylesheet" href="__PUBLIC__/css/jquery.contextmenu.css">

{/block}
{block name="style"}
    html,body{
        height: 100%;
        overflow: hidden;
    }
    .over_hide:hover  {  
        width: 124px;
        font-size: 12px;
        border: 0px solid #ddd;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        cursor:pointer;
    }  
    .over_hide{  
        width: 124px;
        font-size: 12px;
        border: 0px solid #ddd;
        color:#5f5f5f;
        overflow: hidden;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .ui-search-toolbar{display:none;}
    .ui-widget-content-altclass{
        background-color: {￥};
    }
    .trSelected{
        background-color: #ffd7dc;
    }
    .if_wrap .cus-con {
        min-width: 1200px;
    }
.choose-wrap {
border: 1px solid #d7d7d7;
overflow: hidden;
width: 100%;
box-sizing: border-box;
padding: 20px;
}
.sort-wrap{
width: 50%;
float: left;
}
.sortable {
list-style-type: none;
margin: 0;
padding: 0;
width: 100%;
}

.sortable li {
margin: 0 3px 3px 3px;
padding: 5px;
padding-left: 30px;
font-size: 14px;
}

.sortable li span {
position: absolute;
margin-left: -1.3em;
}

.sortable .fa-minus, .sortable .fa-plus {
font-size: 12px;
float: right;
line-height: 18px;
color: #888;
cursor: pointer;
}
.sor-tit{
margin:0 0 10px 10px;
}
#add-col .ui-icon{
display: none;
}
#add-col li{
padding-left: 5px;
}
{/block}

{block name="main"}
<div class="if_wrap">
    <div class="cus-con">
        <div class="set_tit" style="width: 1200px;"><span>题库</span></div>
            <div class="cus-top" style="width: 1200px;" id="cus-top">

                <!--<form class="layui-form layui-form-pane1">-->
                    <div class="cus-top-left layui-form layui-form-pane1" style="width: 1200px;">
                        <!--<div class="layui-inline"id="appShop">-->
                            <!---->
                            <!--<div class="layui-input-block w-120">-->
                                <!--<input type="text" class="layui-input"  name="more_like" id="username" placeholder="请输入用户名">-->
                            <!--</div>-->
                        <!--</div>-->
                        <label class="layui-form-label">考题名称：</label>
                        <div class="layui-input-block w-120" >
                            <input type="text" class="layui-input"  name="question" id="question">
                        </div>
                        <label class="layui-form-label">考题类型：</label>
                        <div class="layui-input-block w-150 mr10" style="margin-left: 5px">
                            <select name="question_type" id="question_type">
                                <option value="">请选择</option>
                                <option value="1">单选题</option>
                                <option value="2">多选题</option>
                                <option value="3">填空题</option>
                                <option value="4">简单题</option>.
                            </select>
                        </div>
<!-- 
                        <label class="layui-form-label">店面名称：</label>
                        <div class="layui-input-block w-150" >
                            <select name="brand_id" id="brand_id" lay-filter="brands" onclick="fun()">
                                <option value="">请选择事业部</option>
                                {volist name='brand' id='vo'}
                                <option value="{$vo.id}">{$vo.brandclass}</option>.
                                {/volist}
                            </select>
                        </div>
                        <div class="layui-input-block w-150" id="shop">
                            <select id="shop_code" name="shop_code">
                                <option value="">请选择店</option>

                            </select>
                        </div>

                        <div class="layui-input-block w-150 mr10" style="margin-left: 5px">
                            <select name="order_link" id="order_link">
                                <option value="">请选择</option>
                                <option value="order" selected>已订单</option>
                                <option value="photo">已拍摄</option>
                                <option value="sp">已选片</option>.
                                <option value="qj">已取件</option>
                            </select>
                        </div>
                        <div class="layui-input-block w-150">
                            <div class="layui-inline w-150">
                                <input type="text" class="layui-input test-item"  name="start_time" id="start_time" readonly>
                            </div>
                        </div>
                        <span class="date-span">-</span>
                        <div class="layui-input-block w-150">
                            <div class="layui-inline w-150">
                                <input type="text" class="layui-input test-item"  name="end_time" id="end_time" readonly>
                            </div>
                        </div> -->
                        <!--<div class="layui-input-block w-118" id="con1">-->
                            <!--<select name="" lay-filter="choose01" id="choose01">-->
                                <!--<option value="">更多选择</option>-->
                                <!--<option value="customer_type">客户类型</option>-->
                                <!--<option value="customer_channel_id">渠道账号</option>-->
                                <!--<option value="access_model_id">获取方式</option>-->
                                <!--<option value="customer_area_id">客户分区</option>-->
                                <!--<option value="op_signinfo">追踪标记</option>-->
                                <!--<option value="sign_id">客资标记</option>-->
                                <!--{auth code='menu1512650502'}-->
                                <!--<option value="sales_staff_id">追踪人</option>-->
                                <!--{/auth}-->
                            <!--</select>-->
                        <!--</div>-->
                        <!--<div class="layui-input-block w-118" id="cus-select">-->
                           <!---->
                            <!--<select name="select_name" lay-filter="choose02" id="choose02">-->
                                <!--<option value="">请选择</option>-->

                            <!--</select>-->
                            <!---->
                        <!--</div>-->

                        <div class="layui-input-block cus-search" style="z-index: 1;">
                            <!--    <span class="search-span">查询</span>  -->
                            <input type="hidden" name="type_info" id="type_info">
                            <button lay-submit lay-filter="search" id="search" data-type="reload"  value="查询" class="search-span" style="border-radius: 5px;">查询</button>
                            <!--<select name="search_time" lay-filter="search_time">-->
                                <!--<option value="week">本周</option>-->
                                <!--<option value="last_week">上周</option>-->
                                <!--<option value="month">本月</option>-->
                                <!--<option value="last_month">上月</option>-->
                            <!--</select>-->
                        </div>
                        <div class="layui-input-block cus-search" style="z-index: 1;">
                            <button lay-filter="reset" id="reset"  value="重置" class="search-span" style="border-radius: 5px;">重置</button>
                        </div>
                    </div>
                <!--</form>-->
            </div>
            <div class="cus-filter">


            </div>
            <div class="cus-model">
                <button class="layui-btn layui-btn-primary cus-model-btn fp-btn-1" data-type="add">
                    <i class="iconfont">&#xe622;</i> 单选题
                </button>
                <button class="layui-btn layui-btn-primary cus-model-btn fp-btn-2" data-type="add">
                    <i class="iconfont">&#xe622;</i> 多选题
                </button>
                <button class="layui-btn layui-btn-primary cus-model-btn fp-btn-3" data-type="add">
                    <i class="iconfont">&#xe622;</i> 填空题
                </button>
                <button class="layui-btn layui-btn-primary cus-model-btn fp-btn-4" data-type="add">
                    <i class="iconfont">&#xe622;</i> 简答题
                </button>
                <button class="layui-btn layui-btn-primary cus-model-btn" data-type="reload">
                    <i class="iconfont">&#xe668;</i> 刷新
                </button>

            </div>
            <div class="cus-link" style="width: 1230px;">

                <ul class="layui-tab-title cus-link-wrap" id="all_number">
                   <li class="layui-this" id="new_order"><span class="cus-link-text">全部考题</span></li>
                  <!--  <li id="today_visit"><span class="cus-link-text">今日回访</span><span class="layui-badge layui-bg-gray" id="today_visit_num"></span></li>
                   <li id="visiting"><span class="cus-link-text">回访中</span><span class="layui-badge layui-bg-gray" id="visiting_num"></span></li>
                   <li id="over_visit"><span class="cus-link-text">回访完成</span><span class="layui-badge layui-bg-gray" id="over_visit_num"></span></li>
                   <li id="fail_visit"><span class="cus-link-text">回访失败</span><span class="layui-badge layui-bg-gray" id="fail_visit_num"></span></li>
                   <li id="my_visit"><span class="cus-link-text">我的回访</span><span class="layui-badge layui-bg-gray" id="my_visit_num"></span></li> -->
                </ul>

            </div>
            <div class="cus-table">
                <table id="demo" lay-filter="test" lay-data="{id: 'idTest'}"></table>
                <div id="pager"></div>
            </div>
        </div>
</div>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<script src="__PUBLIC__/js/jquery.contextmenu.js"></script>
<script type="text/html" id="operationModal">
    <a class="layui-btn layui-btn-mini" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-mini" lay-event="del">删除</a>
</script>
<script type="text/html" id="titleTpl">
    {{#  if(d.question_type == '1'){ }}
         单选题
    {{#  } else if(d.question_type == '2') { }}
        多选题
    {{#  } else if(d.question_type == '3'){ }}
        填空题
    {{#  }else { }}
        简答题
    {{# } }}
</script>
<script>
    $(function () {
        var tab='new_order';//当前标签
        var call=1;
        var orderId='';
        var shop_code='';
        var order_link='';
        var start_time='';
        var end_time='';

        $("#sortable").sortable();
        $("#sortable").disableSelection();

        //日历
        layui.use('laydate', function () {
            var now = new Date(); //当前日期
            var date1 = new Date();
            var time1=date1.getFullYear()+"-"+(date1.getMonth()+1)+"-"+date1.getDate();//time1表示当前时间
            var date2 = new Date(date1);
            date2.setDate(date1.getDate()-7);
            var time2 = date2.getFullYear()+"-"+(date2.getMonth()+1)+"-"+date2.getDate();
            var nowM = date1.getMonth()+1;
            if (nowM < 10) {
                nowM = "0" + nowM;
            }
            var startMonth = date2.getFullYear()+"-"+nowM+"-01";
            var laydate = layui.laydate;
            //单控件
            lay('.test-item').each(function () {
                laydate.render({
                    elem: this
                    , format: 'yyyy-MM-dd'
                    , value: ''
                    , trigger: 'click'
                });
            });

            // 开始时间
            laydate.render({
                elem: '#start_time'
                , format: 'yyyy-MM-dd'
                , value: startMonth
                , trigger: 'click'
            });
            // 结束时间
            laydate.render({
                elem: '#end_time'
                , format: 'yyyy-MM-dd'
                , value: now
                , trigger: 'click'
            });

            lay('.hour-item').each(function () {
                laydate.render({
                    elem: this
                    , type: 'time'
                    , done: function (value, date, endDate) {
                        console.log(value, date, endDate);
                    }
                    , change: function (value, date, endDate) {
                        //this.elem.val(value)
                    }
                });
            });

        });


        layui.use(['layer', 'table','form'], function () {
            var table = layui.table, layer = layui.layer, form = layui.form;
            form.on('select(brands)', function(data){
                var brand_id = data.value;
                $.ajax({
                    type: "POST",
                    url: '/kf/Visit/get_shop',
                    data: "brand_id="+brand_id,
                    success: function (msg) {
                        if(msg.code==1){
                            var shop=msg.data;
                            var replace = '<select name="shop_code" id="shop_code" lay-filter="shop"><option value="0" >--请选择店面--</option>';
                            for(var i=0;i<shop.length;i++){
                                replace += '<option value="'+shop[i]['shop_code']+'">'+shop[i]['shop_name']+'</option>';
                            }
                            replace +='</select>';
                            $("#shop").html(replace);
                            form.render();
                        }
                    }
                });
            });
        table.on('tool(test)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            //console.log(data)
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            if(layEvent === 'detail'){ //查看
                //do somehing
            } else if(layEvent === 'del'){ //删除
                layui.form.render(); //更新全部
                var id = obj.data.id;
                layer.confirm('真的删除行么', function(index){
                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);
                    $.ajax({
                        type: "POST",
                        url: "{:Url('kf/Question/delQuestion')}",
                        data: {id:id},
                        dataType:'json',
                        success: function(ret){
                            if(ret){
                                layer.alert('删除成功');
                                table.reload('idTest', {
                                });
                            }else{
                                layer.alert('删除失败');
                                table.reload('idTest', {
                                });
                            }
                        },
                        error:function(XMLHttpRequest, textStatus, errorThrown){
                            var ret = XMLHttpRequest.responseJSON
                            layer.alert('操作失败');
                        }
                    })
                    //向服务端发送删除指令
                });

            } else if(layEvent === 'edit'){ //编辑
                layui.form.render(); //更新全部
                var id = obj.data.id;
//                setTimeout(function(){
                    load_page(
                            '/kf/Question/questionSave.html?id='+obj.data.id,
                            '修改问题',
                            function(){
                                saveQuestion();
                            },
                            ['保存','取消'],
                            800,600
                    );
            } else if(layEvent === 'join'){
                var index = layer.load(1, {shade: false}); //0代表加载的风格，支持0-2
                layui.form.render(); //更新全部
                var id = obj.data.id;
                load_page(
                        '/kf/Training/joinTraining.html?id='+obj.data.id,
                        '报名列表',
                        function(){
                            location.reload();
                        },
                        ['关闭'],
                        800,600
                );
                // window.location.href="{:Url('kf/Training/trainList',array('id'=>"+id+"))}"; 
            }
        });

            //第一个实例
            var tableIns=table.render({
                elem: '#demo'
                , url: '/kf/Question/questionList' //数据接口
                ,id: 'testReload'
                ,width: 1210
                , page: true //开启分页
                , cols: [[ //表头
                    // {field:'id', title: 'ID', sort: true,templet: '#titleTpl'}
                    {field:'question_type', title: '类型', width:100, align: 'center',templet: '#titleTpl'}
                    ,{field:'question', title: '问题名称', width:800, align: 'center'}
                    ,{field:'score', title: '分数',width:100,  align: 'center'}
                    ,{field:'handle', title: '操作',width:200, sort: true, align: 'center',toolbar:'#operationModal'}

                ]],
                done: function(res, curr, count){
                    //如果是异步请求数据方式，res即为你接口返回的信息。
                    //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
//                    console.log(res.data);
//                    console.log($(".mark-red").length);
                    $(".mark-red").parents("tr").css({
                        "color":"#fff",
                        "background":"red"
                    });

                    //得到当前页码
//                    console.log(curr);

                    //得到数据总量
//                    console.log(count);
                }
            });

            $('.cus-model-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
                $(this).addClass("active").siblings(".cus-model-btn").removeClass("active");
                if (type == "allot") {
                    $("#allot-box").parent().css("overflow", "inherit");
                }
            });

            $('#search').on('click', function(){
                // if(tab=='new_order'&&!$('#shop_code').val()){
                //     layer.alert('请选择店面');
                //     // return false;
                // }
                question=$('#question').val();
                question_type=$('#question_type').val();
                // shop_code=$('#shop_code').val();
                // order_link=$('#order_link').val();
                // start_time=$('#start_time').val();
                // end_time=$('#end_time').val();
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';

            });

            // var orderid=0;
            // var id=0;
            // 触发事件
            var active = {

                //刷新列表
                reload: function(data){
                    call=call+1;
                    //执行重载
                    table.reload('testReload', {
                        page: {
                            curr: 1 //重新从第 1 页开始
                        }
                        ,where: {
                            key: {
                                question: question,
                                question_type:question_type,
                                // order_link:order_link,
                                // start_time:start_time,
                                // end_time:end_time,
                                // tabs:tab

                            }
                        }
                    });
                },
            };
        });

        $(".fp-btn-1").click(function(){
            layui.form.render(); //更新全部
            load_page(
                    '/kf/Question/questionSave.html?question_type=1',
                    '添加单选题',
                    function(){
                        saveQuestion();
                    },
                    ['保存','取消'],
                    800, 600
            );
        });
        $(".fp-btn-2").click(function(){
            layui.form.render(); //更新全部
            load_page(
                    '/kf/Question/questionSave.html?question_type=2',
                    '添加多选题',
                    function(){
                        saveQuestion();
                    },
                    ['保存','取消'],
                    800, 600
            );
        });
        $(".fp-btn-3").click(function(){
            layui.form.render(); //更新全部
            load_page(
                    '/kf/Question/questionSave.html?question_type=3',
                    '添加填空题',
                    function(){
                        saveQuestion();
                    },
                    ['保存','取消'],
                    800, 600
            );
        });
        $(".fp-btn-4").click(function(){
            layui.form.render(); //更新全部
            load_page(
                    '/kf/Question/questionSave.html?question_type=4',
                    '添加简答题',
                    function(){
                        saveQuestion();
                    },
                    ['保存','取消'],
                    800, 600
            );
        });

        function saveQuestion(){
          var training= $("#training").serialize();
          // console.log(training);alert(training);
          $.ajax({
              type:"POST",
              url: "saveQuestion",
              data: training,
              success: function (ret) {
                  // console.log(ret);alert(ret);
                  var dataObj = JSON.parse(ret);
                  if (dataObj.code == 1) {
                      location.reload();
                  } else {
                      layer.alert(dataObj.msg);
                  }
              }

          });

          //最后关闭弹出层
          //layui.layer.closeAll();

       }

        $("#sortable").on("click",".fa-minus",function(){
            var dom=$(this).parents("li").remove();
            dom.find(".fa").removeClass("fa-minus").addClass("fa-plus");
            dom.appendTo($("#add-col"));
        });
        $("#add-col").on("click",".fa-plus",function(){
            var dom1=$(this).parents("li").remove();
            dom1.find(".fa").removeClass("fa-plus").addClass("fa-minus");
            dom1.appendTo($("#sortable"));
        });

    });
</script>




{/block}