<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="widtd=device-widtd, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/css/css.css">
    <!-- 加载动画 -->
    <link rel="stylesheet" type="text/css" href="/static/css/loader.css">
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap-select.min.css">
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/bootstrap.min.js"></script>
    <script src="/static/js/vue-2.4.0.js"></script>
    <script src="/static/js/axios.min.js"></script>
    <script src="/static/js/vue-Cookies.js"></script>
    <script type="text/javascript" src="/static/js/jquery.select.js"></script>

    <script src="/static/js/bootstrap-select_new.js"></script>


    <title>Document</title>
</head>

<body>
    <div id="app">
        <div class="navbar navbar-default">
            <div class="container">
                <!-- navbar-header用于设置内容横向显示 -->
                <div class="navbar-header">
                    <a href="/index" class="navbar-brand"></a>
                </div>
                <!-- navbar-nav用来设置横向显示 -->
                <!-- navbar-right用来设置右浮动 -->
                <!-- hidden-xs用于当屏幕很小的情况下隐藏div里面的内容 -->
                <div class="hidden-xs">
                    <ul class="nav navbar-nav">
                        <li class="dropdown">
                            <!--订单一览表-->
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                订单一览表
                                <b class="caret"></b>
                            </a>
                            <ul class="nav dropdown-menu">
                                <li><a href="/index">订单一览表</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <!--月度产能评估表-->
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                月度产能评估表
                                <b class="caret"></b>
                            </a>
                            <ul class="nav dropdown-menu">
                                <li><a href="/depps">月度产能评估表</a></li>
                                <li><a href="/dessettingtm">车间标准产能设置</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <!--月度主排程计划-->
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                月度主排程计划
                                <b class="caret"></b>
                            </a>
                            <ul class="nav dropdown-menu">
                                <li><a href="/depps">计划主交期</a></li>
                                <li><a href="#">计划部门交期</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <!--ie文件号管理-->
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                IE工艺文件号管理
                                <b class="caret"></b>
                            </a>
                            <ul class="nav dropdown-menu">
                                <li><a href="/iefiletm">新增IE工艺文件号</a></li>
                                <li><a href="/iefilemaintaintm">IE工艺文件号维护</a></li>
                                <li><a href="#">IE效率明细表</a></li>
                                <li><a href="#">IE效率统计表</a></li>
                            </ul>
                        </li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li v-if="username !=''">
                            <a>{% verbatim %}{{ '欢迎'+username+'！！！' }} {% endverbatim %}</a>
                        </li>
                        <li v-else><a href="">请登录</a></li>
                        <li><a href="/logout/" @click="logout()">退出登录</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!--搜索-->
        <div class="filter">
            <div class="container ">
                <label>
                    <div class="navbar-nav">部门：</div>
                    <div class="navbar-nav">
                        <input class="input form-control" id="testInput" type="text"
                            autocomplete="off" />
                    </div>
                </label>
                <!-- <label class="save" @click="seek()">确定查询</label> -->
                <label class="save def" id="def" @click="seek(1)">
                    <div class="btn btn-primary navbar-nav">确定查询</div>
                </label>
            </div>
        </div>
        <!-- 内容 -->
        <!-- container这个类是设置居中对齐 -->
        <div class="container">
            <!-- row这个类是用于设置取消内边距 -->
            <table class="table table-bordered table-hover table-striped">
                <tbody>
                    <tr class="save" v-for="(item,i) in list" :key="item.dep"
                        :class="i == activeIndex?'tr_active':''">
                        <td v-if="i >0" width="50px" v-text="i"></td>
                        <td v-else width="50px" v-text="'行号'"></td>
                        <td width="50px" v-text="item.dep"></td>
                        <td width="200px" v-text="item.dep_name"></td>
                        <td width="100px" v-text="item.up"></td>
                        <td width="200px" v-text="item.up_dd"></td>
                        <td v-if="i >0" width="120px"><input type='number' min="0" class="input" v-model="item.s_capacity" /></td>
                        <td v-else width="120px" v-text="item.s_capacity"></td>
                        <td v-if="i >0" width="120px"><input type='number' min="0" class="input" v-model="item.s_d_staffing" /></td>
                        <td v-else width="120px" v-text="item.s_d_staffing"></td>
                        <!-- <td v-if="i >0" width="120px"><input type="checkbox"  :checked="item.selected=='T'?'checked':''" /></td> -->
                        <td v-if="i >0" width="120px"><input type="checkbox"  v-model="item.selected"/></td>
                        <td v-else width="120px" v-text="item.selected"></td>
                        <td v-if="i >0" width="50px">
                            <button class="btn btn-primary" @click="ok_save(item.dep,item.s_capacity,item.s_d_staffing,i,item.selected)">保存</button></td>
                        <td v-else width="50px" v-text="item.operation"></td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="footer refresh">
            <div class="load">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
    </div>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                activeIndex: 0,
                dep:'',
                list: [],
                username: ''
            },
            mounted() {
                // 获取登录名
                // this.username=getCookie('username');
                this.username = $cookies.get('username')
                console.log($cookies.get('username'))
            },
            methods: {
                seek(i) { // 添加的方法
                    // console.log('ok')
                    // 添加一个对象用于增加数据
                    // 获取货品
                    this.dep = $("#testInput").val()

                    if (this.dep == undefined) {
                        this.dep = ''
                    }
                    if (this.dep == null) {
                        this.dep = ''
                    }
                    // 清空数据
                    this.list = ''
                    $(".refresh").show();
                    axios.get('/dessetting', {
                        params: {
                            dep:this.dep
                        },
                    })
                        .then(res => {
                            this.list = res.data.data
                            // console.log(this.list)
                            $(".refresh").hide();
                        })
                        .catch(err => {
                            alert(err.response["data"] + err.response["status"])
                        })
                },
                ok_save(dep, s_capacity, s_d_staffing, i,selected) {
                    // console.log('ok1')
                    // console.log(OS_NO, PMC_DD, WH_REM, ITM)
                    // this.activeIndex = i
                    var dep = dep
                    var s_capacity = s_capacity
                    var s_d_staffing = s_d_staffing

                    axios.put('/dessetting/', {
                        data: {
                            dep: dep,
                            s_capacity: s_capacity,
                            s_d_staffing: s_d_staffing,
                            selected,selected
                        }
                    })
                        .then(res => {
                            // alert(res.data)
                            var data1 = res.data.code
                            alert("修改成功")
                        })
                        .catch(err => {
                            alert(err.response["data"] + err.response["status"])
                        })

                },
                 //退出登录
                logout() {
                    console.log("qweq")
                    axios.delete('/login/', {
                        params: {
                            user_1: this.user_1,
                            pswd: this.pswd,
                        }
                    })
                        .then(res => {

                        })
                        .catch(err => {
                        })

                },

            },
            created() {
                    this.seek(2)
                // this.select_cust()
            }
        });

        $(function () {
            // 开始写 jQuery 代码...
            var timer = null;
            // 定义一个公用的搜索接口
            // console.log(vm.$data.list)
            function getStr(n, url, field, clickif) {
                //n为搜索的参数 url为请求的路由，filed是定位表单的id,
                //clickif用于判断是否是第一次加载，如果不是第一次加载则需要模拟点击
                var search = n
                // 配置路由
                if (typeof search === 'undefined') {
                    search = ''
                };
                // console.log(search)
                axios.get(url, {
                    params: {
                        search_no: search
                    }
                })
                    .then(res => {
                        // alert(res.data)
                        var data1 = res.data.data
                        datas = data1
                        // console.log(datas)
                        if (datas.length == 0) {
                            alert("没有搜索到数据")
                            return
                        }
                        $.selectSuggest(field, datas);
                        // 是否第一次进入
                        if (clickif !== 1) {
                            $("#" + field).trigger("click");
                        }
                    })
                    .catch(err => {
                        alert(err.response["data"] + err.response["status"])
                    })
            };
            //查询货品资料调用
            $("#testInput").bind("input propertychange", function (event) {
                var search = $("#testInput").val()
                // console.log($("#testInput").val())
                timer && clearTimeout(timer);
                timer = setTimeout(function () {
                    getStr(search, '/dept/', 'testInput');

                }, 2000);
            });
            getStr('', '/dept/', 'testInput', 1);
            
        });
    </script>
    <!-- <script type="text/javascript" src="/static/js/export/jquery-1.8.2.js"></script> -->

</body>

</html>