| | |
|---|
| | | columns: [ |
|---|
| | | { field: 'HICMOBillNO', title: '生产订单', align: "left" }, |
|---|
| | | { field: 'HNUMBER', title: '物料编码', align: "left" }, |
|---|
| | | { field: 'HNAME', title: '物料名称', align: "left" }, |
|---|
| | | { field: 'HMODEL', title: '规格型号', align: "left" }, |
|---|
| | | { field: 'HNAME', title: '物料名称', align: "left",cellStyle: function (value, row, index) { |
|---|
| | | return { |
|---|
| | | css: { |
|---|
| | | "min-width": "100px", |
|---|
| | | "white-space": "nowrap", |
|---|
| | | "text-overflow": "ellipsis", |
|---|
| | | "overflow": "hidden", |
|---|
| | | "max-width": "120px" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } }, |
|---|
| | | { field: 'HMODEL', title: '规格型号', align: "left",cellStyle: function (value, row, index) { |
|---|
| | | return { |
|---|
| | | css: { |
|---|
| | | "min-width": "100px", |
|---|
| | | "white-space": "nowrap", |
|---|
| | | "text-overflow": "ellipsis", |
|---|
| | | "overflow": "hidden", |
|---|
| | | "max-width": "120px" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } }, |
|---|
| | | { field: 'HQTY', title: '叫料数量', align: "left" , formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | }}, |
|---|
| | |
|---|
| | | columns: [ |
|---|
| | | { field: 'KSTATUS', title: '库存状态', align: "left" }, |
|---|
| | | { field: 'KNUMBER', title: '物料编码', align: "left" }, |
|---|
| | | { field: 'KNAME', title: '物料名称', align: "left" }, |
|---|
| | | { field: 'KMODEL', title: '物料规格', align: "left" }, |
|---|
| | | { field: 'KNAME', title: '物料名称', align: "left",cellStyle: function (value, row, index) { |
|---|
| | | return { |
|---|
| | | css: { |
|---|
| | | "min-width": "100px", |
|---|
| | | "white-space": "nowrap", |
|---|
| | | "text-overflow": "ellipsis", |
|---|
| | | "overflow": "hidden", |
|---|
| | | "max-width": "120px" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } }, |
|---|
| | | { field: 'KMODEL', title: '物料规格', align: "left",cellStyle: function (value, row, index) { |
|---|
| | | return { |
|---|
| | | css: { |
|---|
| | | "min-width": "100px", |
|---|
| | | "white-space": "nowrap", |
|---|
| | | "text-overflow": "ellipsis", |
|---|
| | | "overflow": "hidden", |
|---|
| | | "max-width": "120px" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } }, |
|---|
| | | { field: 'KQTY', title: '库存数量', align: "left" , formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | }}, |
|---|
| | |
|---|
| | | <meta charset="UTF-8"> |
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|---|
| | | <title>中国地图</title> |
|---|
| | | |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | body{ |
|---|
| | | font-family: Arial, "Microsoft YaHei"; |
|---|
| | | background-color: #000000; |
|---|
| | | padding: 20px 10px 10px 10px; |
|---|
| | | color: #F0F0F0; |
|---|
| | | } |
|---|
| | | #chinamap{ |
|---|
| | | height: 1000px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | </head> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div id="chinamap"></div> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | </html> |
|---|
| | |
|---|
| | | <script src='js/echarts.min.js'></script> |
|---|
| | | <script src='js/china.js'></script> |
|---|
| | | <script> |
|---|
| | | $("#chinamap").height($(window).height() - 0); |
|---|
| | | //$("#chinamap").height($(window).height() - 0); |
|---|
| | | $(function () { |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | var myChart = echarts.init(document.getElementById('chinamap')); |
|---|
| | | chinadatas(myChart); |
|---|
| | | //根据窗口的大小变动图表 --- 重点 |
|---|
| | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | function chinadatas(myChart) { |
|---|
| | | |
|---|
| | | |
|---|
| | | var chinaGeoCoordMap = { |
|---|
| | | '黑龙江': [127.9688, 45.368], |
|---|
| | | '内蒙古': [110.3467, 41.4899], |
|---|
| | |
|---|
| | | '上海': [121.4648, 31.2891] |
|---|
| | | }; |
|---|
| | | var chinaDatas = [ |
|---|
| | | [{ |
|---|
| | | name: '黑龙江', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '内蒙古', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '吉林', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '辽宁', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '河北', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '天津', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '山西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '陕西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '甘肃', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '宁夏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '青海', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '新疆', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '西藏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '四川', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '重庆', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '山东', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '河南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '江苏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '安徽', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '湖北', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '浙江', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '福建', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '江西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '湖南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '贵州', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '广西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '海南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '上海', |
|---|
| | | value: 1 |
|---|
| | | }] |
|---|
| | | [{ |
|---|
| | | name: '黑龙江', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '内蒙古', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '吉林', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '辽宁', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '河北', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '天津', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '山西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '陕西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '甘肃', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '宁夏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '青海', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '新疆', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '西藏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '四川', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '重庆', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '山东', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '河南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '江苏', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '安徽', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '湖北', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '浙江', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '福建', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '江西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '湖南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '贵州', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '广西', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '海南', |
|---|
| | | value: 0 |
|---|
| | | }], [{ |
|---|
| | | name: '上海', |
|---|
| | | value: 1 |
|---|
| | | }] |
|---|
| | | ]; |
|---|
| | | |
|---|
| | | |
|---|
| | | var convertData = function (data) { |
|---|
| | | var res = []; |
|---|
| | | for (var i = 0; i < data.length; i++) { |
|---|
| | |
|---|
| | | }; |
|---|
| | | }), |
|---|
| | | }, |
|---|
| | | //被攻击点 |
|---|
| | | { |
|---|
| | | type: 'scatter', |
|---|
| | | coordinateSystem: 'geo', |
|---|
| | | zlevel: 2, |
|---|
| | | rippleEffect: { |
|---|
| | | period: 4, |
|---|
| | | brushType: 'stroke', |
|---|
| | | scale: 4 |
|---|
| | | }, |
|---|
| | | label: { |
|---|
| | | normal: { |
|---|
| | | show: true, |
|---|
| | | position: 'right', |
|---|
| | | //offset:[5, 0], |
|---|
| | | color: '#0f0', |
|---|
| | | formatter: '{b}', |
|---|
| | | textStyle: { |
|---|
| | | color: "#0f0" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | emphasis: { |
|---|
| | | show: true, |
|---|
| | | color: "#f60" |
|---|
| | | //被攻击点 |
|---|
| | | { |
|---|
| | | type: 'scatter', |
|---|
| | | coordinateSystem: 'geo', |
|---|
| | | zlevel: 2, |
|---|
| | | rippleEffect: { |
|---|
| | | period: 4, |
|---|
| | | brushType: 'stroke', |
|---|
| | | scale: 4 |
|---|
| | | }, |
|---|
| | | label: { |
|---|
| | | normal: { |
|---|
| | | show: true, |
|---|
| | | position: 'right', |
|---|
| | | //offset:[5, 0], |
|---|
| | | color: '#0f0', |
|---|
| | | formatter: '{b}', |
|---|
| | | textStyle: { |
|---|
| | | color: "#0f0" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | symbol: 'pin', |
|---|
| | | symbolSize: 50, |
|---|
| | | data: [{ |
|---|
| | | name: item[0], |
|---|
| | | value: chinaGeoCoordMap[item[0]].concat([10]), |
|---|
| | | }], |
|---|
| | | } |
|---|
| | | emphasis: { |
|---|
| | | show: true, |
|---|
| | | color: "#f60" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | symbol: 'pin', |
|---|
| | | symbolSize: 50, |
|---|
| | | data: [{ |
|---|
| | | name: item[0], |
|---|
| | | value: chinaGeoCoordMap[item[0]].concat([10]), |
|---|
| | | }], |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | option = { |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | |
|---|
| | | return res; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | backgroundColor: "#013954", |
|---|
| | | backgroundColor: "#000000;", |
|---|
| | | visualMap: { //图例值控制 |
|---|
| | | min: 0, |
|---|
| | | max: 1, |
|---|
| | |
|---|
| | | }; |
|---|
| | | myChart.setOption(option); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </script> |
|---|
| | |
|---|
| | | <title>韩电流水线看板</title> |
|---|
| | | <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> |
|---|
| | | <link rel="stylesheet" type="text/css" href="css/bootstrap-table.min.css"> |
|---|
| | | <link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css"> |
|---|
| | | <link rel="stylesheet" type="text/css" href="css/index.css"> |
|---|
| | | <script src="js/jquery.min.js"></script> |
|---|
| | | <script src='js/echarts.min.js'></script> |
|---|
| | | <script src="js/bootstrap.min.js"></script> |
|---|
| | | <script src='js/bootstrap-table.min.js'></script> |
|---|
| | | <script src='js/bootstrap-select.min.js'></script> |
|---|
| | | <script src='js/bootstrap-table-zh-CN.min.js'></script> |
|---|
| | | <script src="js/jquery.SuperSlide.2.1.3.js"></script> |
|---|
| | | <script src='js/template.js'></script> |
|---|
| | |
|---|
| | | |
|---|
| | | #cList li { |
|---|
| | | margin: 26px auto; |
|---|
| | | white-space:nowrap; |
|---|
| | | overflow: hidden; |
|---|
| | | text-overflow:ellipsis; |
|---|
| | | } |
|---|
| | | |
|---|
| | | #cList li span{ |
|---|
| | | word-wrap: break-word;word-break: break-all;overflow: hidden; |
|---|
| | | |
|---|
| | | } |
|---|
| | | #cList0 { |
|---|
| | | height: 450px; |
|---|
| | | width: 3%; |
|---|
| | |
|---|
| | | .col-sm-3 { |
|---|
| | | width: 20%; |
|---|
| | | } |
|---|
| | | .bootstrap-select.form-control:not([class*=col-]) { |
|---|
| | | width: 220px; |
|---|
| | | /* float: right; */ |
|---|
| | | } |
|---|
| | | .bootstrap-select>.dropdown-toggle.bs-placeholder, |
|---|
| | | .bootstrap-select>.dropdown-toggle.bs-placeholder:active, |
|---|
| | | .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, |
|---|
| | | .bootstrap-select>.dropdown-toggle.bs-placeholder:hover { |
|---|
| | | border-color: #080E2D!important; |
|---|
| | | background-color: #000!important; |
|---|
| | | color: #09d1ea!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text { |
|---|
| | | color: #09d1ea!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bootstrap-select.btn-group .dropdown-menu { |
|---|
| | | background-color: #000!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .form-control { |
|---|
| | | background-color: #000!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .form-control:focus { |
|---|
| | | border-color: #09d1ea!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .form-control:hover { |
|---|
| | | border-color: #000!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn-default:hover { |
|---|
| | | border-color: #09d1ea!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bootstrap-select.btn-group .dropdown-menu li a:hover { |
|---|
| | | background-color:rgba(255, 255, 255, 0.3)!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn-default { |
|---|
| | | border-color: #09d1ea!important; |
|---|
| | | color: #09d1ea!important; |
|---|
| | | background-color: #000!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bootstrap-select.form-control:hover { |
|---|
| | | background-color: #000!important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn-default:hover { |
|---|
| | | background-color: #000!important; |
|---|
| | | border-color: #09d1ea!important; |
|---|
| | | color: #09d1ea!important; |
|---|
| | | } |
|---|
| | | .dropdown-menu > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .active > a:hover{ |
|---|
| | | background-color:rgba(255, 255, 255, 0.3)!important; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | //配置参数 |
|---|
| | | var LineCode='509'//流水线编码 |
|---|
| | | var LineCode=''//流水线编码 |
|---|
| | | var LineCodeList='509'+','+'510'+','+'511'+','+'512'+','+'513'+','+'514';//流水线看板今日全部流水线编码:产线1、产线2、产线3、产线4、产线5、产线6 |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | }); |
|---|
| | | $(function () { |
|---|
| | | LineCode=$(".selectpicker").val(); |
|---|
| | | var mychart1 = echarts.init(document.getElementById('mychart1')); |
|---|
| | | var mychart2 = echarts.init(document.getElementById('mychart2')); |
|---|
| | | var mychart3 = echarts.init(document.getElementById('mychart3')); |
|---|
| | |
|---|
| | | DataTable(); |
|---|
| | | // 定时器 |
|---|
| | | interval = setInterval(function () { |
|---|
| | | LineCode=$(".selectpicker").val(); |
|---|
| | | hours = []; |
|---|
| | | hoursqty = []; |
|---|
| | | CloseProgress = 0; //完工率 |
|---|
| | |
|---|
| | | Chart(mychart1, mychart2, mychart3, mychart4, mychart5); |
|---|
| | | }, 20000); |
|---|
| | | setInterval(function () { |
|---|
| | | LineCode=$(".selectpicker").val(); |
|---|
| | | //num+=1; |
|---|
| | | //$("#tb_order").bootstrapTable('refreshOptions',{offset:num}); // pageNumber:1, 指定页码为第1页 |
|---|
| | | $("#tb_order").bootstrapTable('refresh'); |
|---|
| | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | function Chart(mychart1, mychart2, mychart3, mychart4, mychart5) { |
|---|
| | | $.ajax({ |
|---|
| | | url: "http://localhost:53860/api/loaddata/LineData", |
|---|
| | | dataType: "JSON", |
|---|
| | | async: false,//使用同步的方式,true为异步方式 |
|---|
| | | type: "Get", |
|---|
| | | data:{"LineCode":LineCode,"LineCodeList":LineCodeList}, |
|---|
| | | success: function (data) { |
|---|
| | | |
|---|
| | | // $.ajax({ |
|---|
| | | // url: "http://localhost:53860/api/loaddata/LineData", |
|---|
| | | // dataType: "JSON", |
|---|
| | | // async: false,//使用同步的方式,true为异步方式 |
|---|
| | | // type: "Get", |
|---|
| | | // data:{"LineCode":LineCode,"LineCodeList":LineCodeList}, |
|---|
| | | // success: function (data) { |
|---|
| | | var data= {"code":200,"data":[[{"hour":7,"Count":29.0000000000},{"hour":8,"Count":67.0000000000},{"hour":9,"Count":49.0000000000},{"hour":10,"Count":95.0000000000},{"hour":11,"Count":18.0000000000},{"hour":12,"Count":51.0000000000},{"hour":13,"Count":66.0000000000},{"hour":14,"Count":0.0000000000},{"hour":15,"Count":0.0000000000},{"hour":16,"Count":0.0000000000},{"hour":17,"Count":0.0000000000},{"hour":18,"Count":0.0000000000},{"hour":19,"Count":0.0000000000}],[{"qty":25608.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":5227.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":15922.0000000000,"FNAME":"","FSPECIFICATION":""},{"qty":375.0000000000,"FNAME":"","FSPECIFICATION":""}],[{"FBILLNO":"SCHBD00004252","FNAME":"商标KEG\\BCD315W\\莫兰灰","FSPECIFICATION":"BCD276WCP\\莫兰灰(GS-0012)\\深灰色\\韩电\\CCC","FSTATUS":"6"}],[{"FNAME":"一线","qty":30.0000000000,"inqty":0.0000000000},{"FNAME":"二线","qty":271.0000000000,"inqty":0.0000000000},{"FNAME":"三线","qty":100.0000000000,"inqty":0.0000000000},{"FNAME":"五线","qty":8.0000000000,"inqty":0.0000000000},{"FNAME":"六线","qty":20.0000000000,"inqty":0.0000000000}],[{"weekqty":3828.0000000000},{"weekqty":4063.0000000000},{"weekqty":25226.0000000000},{"weekqty":14099.0000000000}]]} |
|---|
| | | $.each(data.data[0], function (index, val) { |
|---|
| | | hours.push(val.hour + '点'); |
|---|
| | | hoursqty.push(parseFloat(val.Count).toFixed(2)); |
|---|
| | |
|---|
| | | $("#OrderWork").html(data.data[2][0].FBILLNO);//当前订单 |
|---|
| | | $("#PartName").html(data.data[2][0].FNAME); //当前物料名称 |
|---|
| | | $("#PartSpec").html(data.data[2][0].FSPECIFICATION);//当前物料规格 |
|---|
| | | |
|---|
| | | } |
|---|
| | | CloseProgress = parseFloat(data.data[1][1].qty / data.data[1][0].qty).toFixed(2); //完成率 |
|---|
| | | |
|---|
| | | |
|---|
| | | //今日全部流水线产量对比 |
|---|
| | | $.each(data.data[3], function (index, val) { |
|---|
| | | LineName.push(val.FNAME); |
|---|
| | | LineOrderQty.push(parseFloat(val.qty).toFixed(2)); |
|---|
| | | LineOrderCloseQty.push(parseFloat(val.inqty).toFixed(2)); |
|---|
| | | |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //本周分析 |
|---|
| | | Week = parseFloat(data.data[4][1].weekqty / data.data[4][0].weekqty).toFixed(2); |
|---|
| | | //本月分析 |
|---|
| | | Month = parseFloat(data.data[4][3].weekqty / data.data[4][2].weekqty).toFixed(2); |
|---|
| | | }, |
|---|
| | | error: function (data) { |
|---|
| | | |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | option1 = { |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | formatter: "{a} <br/>{b}月 : {c}万" |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | boundaryGap: false, |
|---|
| | | data: hours, //时间点数据 |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: true, |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: [{ |
|---|
| | | type: 'value', |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | width: 0, //隐藏y轴 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitLine: { //网格线 |
|---|
| | | lineStyle: { |
|---|
| | | type: 'dotted', //设置网格线类型 dotted：虚线 solid:实线 |
|---|
| | | }, |
|---|
| | | show: false //隐藏或显示 |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false, |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitNumber: 5 |
|---|
| | | }], |
|---|
| | | title: { |
|---|
| | | show: true, |
|---|
| | | text: '生产效率分析', |
|---|
| | | x: 'left', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 18, |
|---|
| | | fotweight: 'normal', |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | icon: 'line', |
|---|
| | | data: ['小时产能'], |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 20, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '小时产能', |
|---|
| | | data: hoursqty, //时间点值 |
|---|
| | | type: 'line', |
|---|
| | | smooth: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: 'orange', |
|---|
| | | lineStyle: { |
|---|
| | | width: 4, //设置线条粗细 |
|---|
| | | shadowColor: 'rgba(255, 94, 91,.1)', |
|---|
| | | shadowOffsetX: 3, |
|---|
| | | shadowOffsetY: 5, |
|---|
| | | // $("#PartName").each(function() { |
|---|
| | | // var maxwidth =36;//显示多少字符 |
|---|
| | | // if ($(this).text().length > maxwidth) { |
|---|
| | | // $(this).text($(this).text().substring(0, maxwidth)); |
|---|
| | | // $(this).html($(this).html() + '...'); |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | textStyle: { |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | const colorList = ['#47A2FF ', '#FBD444'] |
|---|
| | | |
|---|
| | | option2 = { |
|---|
| | | title: { |
|---|
| | | text: '总完工率', |
|---|
| | | subtext: CloseProgress * 100 + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 20, |
|---|
| | | color: '#00c6ff', |
|---|
| | | lineHeight: 20, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 18, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '占比', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '总完工率', value: CloseProgress }, |
|---|
| | | { name: '未完工率', value: 1 - CloseProgress } |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option3 = { |
|---|
| | | title: { |
|---|
| | | text: '今日全部流水线产量对比', |
|---|
| | | left: '0', |
|---|
| | | top: 2, |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 20, |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'], |
|---|
| | | tooltip: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '10%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | left: 'right', |
|---|
| | | data: ['任务数', '完成数'], |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 16, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | xAxis: [ |
|---|
| | | { |
|---|
| | | type: 'category', |
|---|
| | | data: LineName, |
|---|
| | | axisTick: { |
|---|
| | | alignWithLabel: true |
|---|
| | | }, |
|---|
| | | |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | type: 'solid', //设置网格线类型 dotted：虚线 solid:实线 |
|---|
| | | width: 1, //隐藏y轴 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | type: 'value', |
|---|
| | | axisLine: { |
|---|
| | | show: false, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | splitLine: { //网格线 |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | CloseProgress = parseFloat(data.data[1][1].qty / data.data[1][0].qty).toFixed(2); //完成率 |
|---|
| | | |
|---|
| | | }, |
|---|
| | | show: true //隐藏或显示 |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '任务数', |
|---|
| | | type: 'bar', |
|---|
| | | data: LineOrderQty |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: '完成数', |
|---|
| | | type: 'bar', |
|---|
| | | data: LineOrderCloseQty |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option4 = { |
|---|
| | | title: [ |
|---|
| | | { |
|---|
| | | text: '达成率', |
|---|
| | | subtext: Week * 100 + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 16, |
|---|
| | | color: '#999', |
|---|
| | | lineHeight: 20 |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 28, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | show: true, |
|---|
| | | text: '本周分析', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: '16', |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '5%' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '姓名', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '达成率', value: Week }, |
|---|
| | | { name: '未达成率', value: 1 - Week } |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option5 = { |
|---|
| | | title: [ |
|---|
| | | { |
|---|
| | | text: '达成率', |
|---|
| | | subtext: Month * 100 + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 16, |
|---|
| | | color: '#999', |
|---|
| | | lineHeight: 20 |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 28, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | show: true, |
|---|
| | | text: '本月分析', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: '16', |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '5%' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '姓名', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '达成率', value: Month }, |
|---|
| | | { name: '未达成率', value: 1 - Month } |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | |
|---|
| | | mychart1.setOption(option1); |
|---|
| | | mychart2.setOption(option2); |
|---|
| | | mychart3.setOption(option3); |
|---|
| | | mychart4.setOption(option4); |
|---|
| | | mychart5.setOption(option5); |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | function DataTable() { |
|---|
| | | $('#tb_order').bootstrapTable({ |
|---|
| | | url: 'http://localhost:12298/api/loaddata/LineTableData', |
|---|
| | | //data: dataJson, |
|---|
| | | method: 'get', //请求方式（*） |
|---|
| | | dataType: "json", |
|---|
| | | queryParams :queryParams, |
|---|
| | | striped: false, //是否显示行间隔色 |
|---|
| | | cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*） |
|---|
| | | pagination: true, //是否显示分页（*） |
|---|
| | | sortable: false, //是否启用排序 |
|---|
| | | sortable: false, //是否启用排序 |
|---|
| | | search: false, //是否启用搜索框 |
|---|
| | | sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*） |
|---|
| | | pageNumber: 1, //初始化加载第一页，默认第一页 |
|---|
| | | pageSize: 10, //每页的记录行数（*） |
|---|
| | | pageList: [10], //可供选择的每页的行数（*） |
|---|
| | | strictSearch: false, //设置为 true启用 全匹配搜索，否则为模糊搜索 |
|---|
| | | clickToSelect: true, //是否启用点击选中行 |
|---|
| | | singleSelect: true, //设置True 将禁止多选 |
|---|
| | | uniqueId: "ID", //每一行的唯一标识，一般为主键列 |
|---|
| | | cardView: false, //是否显示详细视图 |
|---|
| | | detailView: false, //是否显示父子表 |
|---|
| | | |
|---|
| | | columns: [ |
|---|
| | | { field: 'FBILLNO', title: '生产订单号', align: "left" }, |
|---|
| | | { field: 'FNUMBER', title: '产品编码', align: "left" }, |
|---|
| | | { field: 'FNAME', title: '产品名称', align: "left" }, |
|---|
| | | { |
|---|
| | | field: 'FQTY', title: '任务数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FRepQuaAuxQty', title: '完成数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FSTOCKINQUAAUXQTY', title: '入库数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FSTATUS', title: '状态', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | switch (value) { |
|---|
| | | case '1': |
|---|
| | | "计划"; |
|---|
| | | break; |
|---|
| | | case '2': |
|---|
| | | "计划确认"; |
|---|
| | | break; |
|---|
| | | case '3': |
|---|
| | | "下达"; |
|---|
| | | break; |
|---|
| | | case '4': |
|---|
| | | "开工"; |
|---|
| | | break; |
|---|
| | | case '5': |
|---|
| | | "完工"; |
|---|
| | | break; |
|---|
| | | case '6': |
|---|
| | | "结案"; |
|---|
| | | break; |
|---|
| | | case '7': |
|---|
| | | "结算"; |
|---|
| | | default: |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'Progress', title: '进度', align: "left", formatter: function (value, row, index) { |
|---|
| | | var res = 100 * row.FRepQuaAuxQty / row.FQTY; |
|---|
| | | //return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%'>" + res.toFixed(2) + "</div> </div>"]; |
|---|
| | | return "<div class='w40 div_co pw'><div class='PA' style='text-align:right;color:#4b2dba;float:right;height:20px;line-height:25px'>" + res.toFixed(2) + "%</div><div class='progress' style='margin-top:4px;'><div class='progress-bar progress-diy-info' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%';text-align:center;'></div></div></div>"; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | onClickRow: function (row, $element) { |
|---|
| | | //今日全部流水线产量对比 |
|---|
| | | $.each(data.data[3], function (index, val) { |
|---|
| | | LineName.push(val.FNAME); |
|---|
| | | LineOrderQty.push(parseFloat(val.qty).toFixed(2)); |
|---|
| | | LineOrderCloseQty.push(parseFloat(val.inqty).toFixed(2)); |
|---|
| | | |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //本周分析 |
|---|
| | | Week = parseFloat(data.data[4][1].weekqty / data.data[4][0].weekqty).toFixed(2); |
|---|
| | | console.log(Week); |
|---|
| | | //本月分析 |
|---|
| | | Month = parseFloat(data.data[4][3].weekqty / data.data[4][2].weekqty).toFixed(2); |
|---|
| | | console.log(Month); |
|---|
| | | // }, |
|---|
| | | // error: function (data) { |
|---|
| | | |
|---|
| | | // } |
|---|
| | | // }) |
|---|
| | | |
|---|
| | | |
|---|
| | | option1 = { |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | formatter: "{a} <br/>{b}月 : {c}万" |
|---|
| | | }, |
|---|
| | | xAxis: { |
|---|
| | | type: 'category', |
|---|
| | | boundaryGap: false, |
|---|
| | | data: hours, //时间点数据 |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: true, |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | yAxis: [{ |
|---|
| | | type: 'value', |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | width: 0, //隐藏y轴 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitLine: { //网格线 |
|---|
| | | lineStyle: { |
|---|
| | | type: 'dotted', //设置网格线类型 dotted：虚线 solid:实线 |
|---|
| | | }, |
|---|
| | | show: false //隐藏或显示 |
|---|
| | | }, |
|---|
| | | axisTick: { |
|---|
| | | show: false, |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | splitNumber: 5 |
|---|
| | | }], |
|---|
| | | title: { |
|---|
| | | show: true, |
|---|
| | | text: '生产效率分析', |
|---|
| | | x: 'left', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 18, |
|---|
| | | fotweight: 'normal', |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | icon: 'line', |
|---|
| | | data: ['小时产能'], |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 20, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '小时产能', |
|---|
| | | data: hoursqty, //时间点值 |
|---|
| | | type: 'line', |
|---|
| | | smooth: true, |
|---|
| | | itemStyle: { |
|---|
| | | normal: { |
|---|
| | | color: 'orange', |
|---|
| | | lineStyle: { |
|---|
| | | width: 4, //设置线条粗细 |
|---|
| | | shadowColor: 'rgba(255, 94, 91,.1)', |
|---|
| | | shadowOffsetX: 3, |
|---|
| | | shadowOffsetY: 5, |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | textStyle: { |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | |
|---|
| | | const colorList = ['#47A2FF ', '#FBD444'] |
|---|
| | | |
|---|
| | | option2 = { |
|---|
| | | title: { |
|---|
| | | text: '总完工率', |
|---|
| | | subtext: (CloseProgress * 100).toFixed(0) + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 20, |
|---|
| | | color: '#00c6ff', |
|---|
| | | lineHeight: 20, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 18, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '占比', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '总完工率', value: CloseProgress >1?1:CloseProgress}, |
|---|
| | | { name: '未完工率', value: CloseProgress>1?0:1-CloseProgress } |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option3 = { |
|---|
| | | title: { |
|---|
| | | text: '今日全部流水线产量对比', |
|---|
| | | left: '0', |
|---|
| | | top: 2, |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 20, |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | color: ['#5b9bd5', '#ed7d31', '#a9d18e', '#ffc000'], |
|---|
| | | tooltip: { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | grid: { |
|---|
| | | left: '3%', |
|---|
| | | right: '4%', |
|---|
| | | bottom: '10%', |
|---|
| | | containLabel: true |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | left: 'right', |
|---|
| | | data: ['任务数', '完成数'], |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: 16, |
|---|
| | | fontFamily: "微软雅黑" |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | xAxis: [ |
|---|
| | | { |
|---|
| | | type: 'category', |
|---|
| | | data: LineName, |
|---|
| | | axisTick: { |
|---|
| | | alignWithLabel: true |
|---|
| | | }, |
|---|
| | | |
|---|
| | | axisLine: { |
|---|
| | | show: true, |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | type: 'solid', //设置网格线类型 dotted：虚线 solid:实线 |
|---|
| | | width: 1, //隐藏y轴 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | show: true, |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | yAxis: [ |
|---|
| | | { |
|---|
| | | type: 'value', |
|---|
| | | axisLine: { |
|---|
| | | show: false, |
|---|
| | | |
|---|
| | | }, |
|---|
| | | splitLine: { //网格线 |
|---|
| | | lineStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | |
|---|
| | | }, |
|---|
| | | show: true //隐藏或显示 |
|---|
| | | }, |
|---|
| | | axisLabel: { |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', //坐标值得具体的颜色 |
|---|
| | | fontSize: '16' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '任务数', |
|---|
| | | type: 'bar', |
|---|
| | | data: LineOrderQty |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: '完成数', |
|---|
| | | type: 'bar', |
|---|
| | | data: LineOrderCloseQty |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option4 = { |
|---|
| | | title: [ |
|---|
| | | { |
|---|
| | | text: '达成率', |
|---|
| | | subtext: (Week * 100).toFixed(0) + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 16, |
|---|
| | | color: '#999', |
|---|
| | | lineHeight: 20 |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 28, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | show: true, |
|---|
| | | text: '本周分析', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: '16', |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '5%' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '姓名', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '达成率', value: Week>1?1:Week }, |
|---|
| | | { name: '未达成率', value: Week>1?0:1-Week } |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | option5 = { |
|---|
| | | title: [ |
|---|
| | | { |
|---|
| | | text: '达成率', |
|---|
| | | subtext: (Month * 100).toFixed(0) + '%', |
|---|
| | | textStyle: { |
|---|
| | | fontSize: 16, |
|---|
| | | color: '#999', |
|---|
| | | lineHeight: 20 |
|---|
| | | }, |
|---|
| | | subtextStyle: { |
|---|
| | | fontSize: 28, |
|---|
| | | color: '#00c6ff' |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '70%' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | show: true, |
|---|
| | | text: '本月分析', |
|---|
| | | textStyle: { |
|---|
| | | color: '#00c6ff', |
|---|
| | | fontSize: '16', |
|---|
| | | }, |
|---|
| | | textAlign: 'center', |
|---|
| | | left: '50%', |
|---|
| | | top: '5%' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | tooltip: { |
|---|
| | | trigger: 'item', |
|---|
| | | }, |
|---|
| | | legend: { |
|---|
| | | type: 'scroll', |
|---|
| | | icon: 'pin', |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | color: colorList, |
|---|
| | | series: [ |
|---|
| | | { |
|---|
| | | name: '姓名', |
|---|
| | | type: 'pie', |
|---|
| | | radius: [50, 80], |
|---|
| | | center: ['50%', '50%'], |
|---|
| | | label: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | labelLine: { |
|---|
| | | show: false |
|---|
| | | }, |
|---|
| | | itemStyle: { |
|---|
| | | borderWidth: 3, |
|---|
| | | borderColor: '#000000' |
|---|
| | | }, |
|---|
| | | data: [ |
|---|
| | | { name: '达成率', value: Month>1?1:Month}, |
|---|
| | | { name: '未达成率', value: Month>1?0:1-WeeMonthk} |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | |
|---|
| | | mychart1.setOption(option1); |
|---|
| | | mychart2.setOption(option2); |
|---|
| | | mychart3.setOption(option3); |
|---|
| | | mychart4.setOption(option4); |
|---|
| | | mychart5.setOption(option5); |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | function DataTable() { |
|---|
| | | $('#tb_order').bootstrapTable({ |
|---|
| | | url: 'http://localhost:12298/api/loaddata/LineTableData', |
|---|
| | | //data: dataJson, |
|---|
| | | method: 'get', //请求方式（*） |
|---|
| | | dataType: "json", |
|---|
| | | queryParams :queryParams, |
|---|
| | | striped: false, //是否显示行间隔色 |
|---|
| | | cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*） |
|---|
| | | pagination: true, //是否显示分页（*） |
|---|
| | | sortable: false, //是否启用排序 |
|---|
| | | sortable: false, //是否启用排序 |
|---|
| | | search: false, //是否启用搜索框 |
|---|
| | | sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*） |
|---|
| | | pageNumber: 1, //初始化加载第一页，默认第一页 |
|---|
| | | pageSize: 10, //每页的记录行数（*） |
|---|
| | | pageList: [10], //可供选择的每页的行数（*） |
|---|
| | | strictSearch: false, //设置为 true启用 全匹配搜索，否则为模糊搜索 |
|---|
| | | clickToSelect: true, //是否启用点击选中行 |
|---|
| | | singleSelect: true, //设置True 将禁止多选 |
|---|
| | | uniqueId: "ID", //每一行的唯一标识，一般为主键列 |
|---|
| | | cardView: false, //是否显示详细视图 |
|---|
| | | detailView: false, //是否显示父子表 |
|---|
| | | |
|---|
| | | columns: [ |
|---|
| | | { field: 'FBILLNO', title: '生产订单号', align: "left" }, |
|---|
| | | { field: 'FNUMBER', title: '产品编码', align: "left" }, |
|---|
| | | { field: 'FNAME', title: '产品名称', align: "left" }, |
|---|
| | | { |
|---|
| | | field: 'FQTY', title: '任务数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FRepQuaAuxQty', title: '完成数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FSTOCKINQUAAUXQTY', title: '入库数量', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | return parseFloat(value).toFixed(2); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'FSTATUS', title: '状态', align: "left", width: 100, formatter: function (value, row, index) { |
|---|
| | | switch (value) { |
|---|
| | | case '1': |
|---|
| | | "计划"; |
|---|
| | | break; |
|---|
| | | case '2': |
|---|
| | | "计划确认"; |
|---|
| | | break; |
|---|
| | | case '3': |
|---|
| | | "下达"; |
|---|
| | | break; |
|---|
| | | case '4': |
|---|
| | | "开工"; |
|---|
| | | break; |
|---|
| | | case '5': |
|---|
| | | "完工"; |
|---|
| | | break; |
|---|
| | | case '6': |
|---|
| | | "结案"; |
|---|
| | | break; |
|---|
| | | case '7': |
|---|
| | | "结算"; |
|---|
| | | default: |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'Progress', title: '进度', align: "left", formatter: function (value, row, index) { |
|---|
| | | var res = 100 * row.FRepQuaAuxQty / row.FQTY; |
|---|
| | | //return ["<div class='progress'> <div class='progress-bar' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%'>" + res.toFixed(2) + "</div> </div>"]; |
|---|
| | | return "<div class='w40 div_co pw'><div class='PA' style='text-align:right;color:#4b2dba;float:right;height:20px;line-height:25px'>" + res.toFixed(2) + "%</div><div class='progress' style='margin-top:4px;'><div class='progress-bar progress-diy-info' role='progressbar' aria-valuenow='50' aria-valuemin='0' aria-valuemax='100' style='width:" + res.toFixed(2) + "%';text-align:center;'></div></div></div>"; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | onClickRow: function (row, $element) { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onCheck: function (row, $element) { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onLoadSuccess: function (row) { |
|---|
| | | var num_total = (row.total)/ 10 |
|---|
| | | if (num >= num_total) { |
|---|
| | | num = 0 |
|---|
| | | } |
|---|
| | | //var a = $('#tb_order').bootstrapTable('getSelections'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | //得到查询的参数 |
|---|
| | | function queryParams(params) { |
|---|
| | | num += 1; |
|---|
| | | var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的 |
|---|
| | | LineCode:LineCode, |
|---|
| | | limit: params.limit, //页面大小 |
|---|
| | | offset: num, //页码 |
|---|
| | | }; |
|---|
| | | return temp; |
|---|
| | | } |
|---|
| | | //选择事件 |
|---|
| | | function selectOnchang(obj) { |
|---|
| | | LineCode=obj.options[obj.selectedIndex].value; |
|---|
| | | Chart(mychart1, mychart2, mychart3, mychart4, mychart5) |
|---|
| | | //DataTable(); |
|---|
| | | $('#tb_order').bootstrapTable('refresh'); |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | </head> |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onCheck: function (row, $element) { |
|---|
| | | <body> |
|---|
| | | <div class='title'>韩电流水线看板</div> |
|---|
| | | <div class="clock0"> |
|---|
| | | <select class="selectpicker show-tick form-control" data-live-search="true" title="搜索或选择流水线" style="float: left;" onchange="selectOnchang(this)"> |
|---|
| | | <option value='509' selected="selected">1#流水线</option> |
|---|
| | | <option value='510'>2#流水线</option> |
|---|
| | | <option value='511'>3#流水线</option> |
|---|
| | | <option value='512'>4#流水线</option> |
|---|
| | | <option value='513'>5#流水线</option> |
|---|
| | | <option value='514'>6#流水线</option> |
|---|
| | | </select> |
|---|
| | | </div> |
|---|
| | | <div class="clock"> |
|---|
| | | <ul> |
|---|
| | | <li id="Date"></li> |
|---|
| | | <li id="hours"> </li> |
|---|
| | | <li id="point">:</li> |
|---|
| | | <li id="min"> </li> |
|---|
| | | <li id="point">:</li> |
|---|
| | | <li id="sec"> </li> |
|---|
| | | </ul> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-8"> |
|---|
| | | <div class="col-sm-7"> |
|---|
| | | <div id="mychart1"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-3"> |
|---|
| | | <ul id="cList"> |
|---|
| | | <li><span>本线状态：</span><span id="LineStus"></span></li> |
|---|
| | | <li><span>总订单：</span><span id="OrderQty">0</span></li> |
|---|
| | | <li><span>已完工：</span><span id="OrderInQty">0</span></li> |
|---|
| | | <li><span>返工数：</span><span id="FGQty">0</span></li> |
|---|
| | | <li><span>翻包率：</span><span id="FBprogress">0%</span></li> |
|---|
| | | <li><span>当前订单：</span><span id="OrderWork"></span></li> |
|---|
| | | <li><span>当前物料名称：</span><span id="PartName"></span></li> |
|---|
| | | <li><span>当前规格：</span><span id="PartSpec"></span></li> |
|---|
| | | <li><span>今日总汇报：</span><span id="SumDay">0</span></li> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-2"> |
|---|
| | | <div id="mychart2"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-4"> |
|---|
| | | <div id="mychart3"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-8"> |
|---|
| | | <div id="cList0"> |
|---|
| | | <ul id="cList1"> |
|---|
| | | <li><span>本线当日全部订单</span></li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div id="cList2"> |
|---|
| | | <table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-4"> |
|---|
| | | <div class="col-sm-6"> |
|---|
| | | <div id="mychart4"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-6"> |
|---|
| | | <div id="mychart5"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onLoadSuccess: function (row) { |
|---|
| | | var num_total = (row.total)/ 10 |
|---|
| | | if (num >= num_total) { |
|---|
| | | num = 0 |
|---|
| | | } |
|---|
| | | //var a = $('#tb_order').bootstrapTable('getSelections'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | //得到查询的参数 |
|---|
| | | function queryParams(params) { |
|---|
| | | num += 1; |
|---|
| | | var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的 |
|---|
| | | LineCode:LineCode, |
|---|
| | | limit: params.limit, //页面大小 |
|---|
| | | offset: num, //页码 |
|---|
| | | }; |
|---|
| | | return temp; |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | </head> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <div class='title'>韩电流水线看板</div> |
|---|
| | | <div class="clock0">1#流水线</div> |
|---|
| | | <div class="clock"> |
|---|
| | | <ul> |
|---|
| | | <li id="Date"></li> |
|---|
| | | <li id="hours"> </li> |
|---|
| | | <li id="point">:</li> |
|---|
| | | <li id="min"> </li> |
|---|
| | | <li id="point">:</li> |
|---|
| | | <li id="sec"> </li> |
|---|
| | | </ul> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-8"> |
|---|
| | | <div class="col-sm-7"> |
|---|
| | | <div id="mychart1"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-3"> |
|---|
| | | <ul id="cList"> |
|---|
| | | <li>本线状态：<span id="LineStus"></span></li> |
|---|
| | | <li>总订单：<span id="OrderQty">0</span></li> |
|---|
| | | <li>已完工：<span id="OrderInQty">0</span></li> |
|---|
| | | <li>返工数：<span id="FGQty">0</span></li> |
|---|
| | | <li>翻包率：<span id="FBprogress">0%</span></li> |
|---|
| | | <li>当前订单：<span id="OrderWork"></span></li> |
|---|
| | | <li>当前物料名称：<span id="PartName"></span></li> |
|---|
| | | <li>当前规格：<span id="PartSpec"></span></li> |
|---|
| | | <li>今日总汇报：<span id="SumDay">0</span></li> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-2"> |
|---|
| | | <div id="mychart2"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-4"> |
|---|
| | | <div id="mychart3"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-8"> |
|---|
| | | <div id="cList0"> |
|---|
| | | <ul id="cList1"> |
|---|
| | | <li><span>本线当日全部订单</span></li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div id="cList2"> |
|---|
| | | <table id="tb_order" class="table-condensed table-responsive tb_order" data-filter-control="true"></table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-4"> |
|---|
| | | <div class="col-sm-6"> |
|---|
| | | <div id="mychart4"></div> |
|---|
| | | </div> |
|---|
| | | <div class="col-sm-6"> |
|---|
| | | <div id="mychart5"></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | </html> |
|---|
| | | </html> |
|---|
| New file |
| | |
|---|
| | | /*! |
|---|
| | | * Bootstrap-select v1.12.4 (http://silviomoreto.github.io/bootstrap-select) |
|---|
| | | * |
|---|
| | | * Copyright 2013-2017 bootstrap-select |
|---|
| | | * Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE) |
|---|
| | | */ |
|---|
| | | select.bs-select-hidden,select.selectpicker{display:none!important}.bootstrap-select{width:220px\9}.bootstrap-select>.dropdown-toggle{width:100%;padding-right:25px;z-index:1}.bootstrap-select>.dropdown-toggle.bs-placeholder,.bootstrap-select>.dropdown-toggle.bs-placeholder:active,.bootstrap-select>.dropdown-toggle.bs-placeholder:focus,.bootstrap-select>.dropdown-toggle.bs-placeholder:hover{color:#999}.bootstrap-select>select{position:absolute!important;bottom:0;left:50%;display:block!important;width:.5px!important;height:100%!important;padding:0!important;opacity:0!important;border:none}.bootstrap-select>select.mobile-device{top:0;left:0;display:block!important;width:100%!important;z-index:2}.error .bootstrap-select .dropdown-toggle,.has-error .bootstrap-select .dropdown-toggle{border-color:#b94a48}.bootstrap-select.fit-width{width:auto!important}.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){width:220px}.bootstrap-select .dropdown-toggle:focus{outline:thin dotted #333!important;outline:5px auto -webkit-focus-ring-color!important;outline-offset:-2px}.bootstrap-select.form-control{margin-bottom:0;padding:0;border:none}.bootstrap-select.form-control:not([class*=col-]){width:100%}.bootstrap-select.form-control.input-group-btn{z-index:auto}.bootstrap-select.form-control.input-group-btn:not(:first-child):not(:last-child)>.btn{border-radius:0}.bootstrap-select.btn-group:not(.input-group-btn),.bootstrap-select.btn-group[class*=col-]{float:none;display:inline-block;margin-left:0}.bootstrap-select.btn-group.dropdown-menu-right,.bootstrap-select.btn-group[class*=col-].dropdown-menu-right,.row .bootstrap-select.btn-group[class*=col-].dropdown-menu-right{float:right}.form-group .bootstrap-select.btn-group,.form-horizontal .bootstrap-select.btn-group,.form-inline .bootstrap-select.btn-group{margin-bottom:0}.form-group-lg .bootstrap-select.btn-group.form-control,.form-group-sm .bootstrap-select.btn-group.form-control{padding:0}.form-group-lg .bootstrap-select.btn-group.form-control .dropdown-toggle,.form-group-sm .bootstrap-select.btn-group.form-control .dropdown-toggle{height:100%;font-size:inherit;line-height:inherit;border-radius:inherit}.form-inline .bootstrap-select.btn-group .form-control{width:100%}.bootstrap-select.btn-group.disabled,.bootstrap-select.btn-group>.disabled{cursor:not-allowed}.bootstrap-select.btn-group.disabled:focus,.bootstrap-select.btn-group>.disabled:focus{outline:0!important}.bootstrap-select.btn-group.bs-container{position:absolute;height:0!important;padding:0!important}.bootstrap-select.btn-group.bs-container .dropdown-menu{z-index:1060}.bootstrap-select.btn-group .dropdown-toggle .filter-option{display:inline-block;overflow:hidden;width:100%;text-align:left}.bootstrap-select.btn-group .dropdown-toggle .caret{position:absolute;top:50%;right:12px;margin-top:-2px;vertical-align:middle}.bootstrap-select.btn-group[class*=col-] .dropdown-toggle{width:100%}.bootstrap-select.btn-group .dropdown-menu{min-width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bootstrap-select.btn-group .dropdown-menu.inner{position:static;float:none;border:0;padding:0;margin:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none}.bootstrap-select.btn-group .dropdown-menu li{position:relative}.bootstrap-select.btn-group .dropdown-menu li.active small{color:#fff}.bootstrap-select.btn-group .dropdown-menu li.disabled a{cursor:not-allowed}.bootstrap-select.btn-group .dropdown-menu li a{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.bootstrap-select.btn-group .dropdown-menu li a.opt{position:relative;padding-left:2.25em}.bootstrap-select.btn-group .dropdown-menu li a span.check-mark{display:none}.bootstrap-select.btn-group .dropdown-menu li a span.text{display:inline-block}.bootstrap-select.btn-group .dropdown-menu li small{padding-left:.5em}.bootstrap-select.btn-group .dropdown-menu .notify{position:absolute;bottom:5px;width:96%;margin:0 2%;min-height:26px;padding:3px 5px;background:#f5f5f5;border:1px solid #e3e3e3;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.05);box-shadow:inset 0 1px 1px rgba(0,0,0,.05);pointer-events:none;opacity:.9;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bootstrap-select.btn-group .no-results{padding:3px;background:#f5f5f5;margin:0 5px;white-space:nowrap}.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option{position:static}.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret{position:static;top:auto;margin-top:-1px}.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark{position:absolute;display:inline-block;right:15px;margin-top:5px}.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text{margin-right:34px}.bootstrap-select.show-menu-arrow.open>.dropdown-toggle{z-index:1061}.bootstrap-select.show-menu-arrow .dropdown-toggle:before{content:'';border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid rgba(204,204,204,.2);position:absolute;bottom:-4px;left:9px;display:none}.bootstrap-select.show-menu-arrow .dropdown-toggle:after{content:'';border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff;position:absolute;bottom:-4px;left:10px;display:none}.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before{bottom:auto;top:-3px;border-top:7px solid rgba(204,204,204,.2);border-bottom:0}.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after{bottom:auto;top:-3px;border-top:6px solid #fff;border-bottom:0}.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before{right:12px;left:auto}.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after{right:13px;left:auto}.bootstrap-select.show-menu-arrow.open>.dropdown-toggle:after,.bootstrap-select.show-menu-arrow.open>.dropdown-toggle:before{display:block}.bs-actionsbox,.bs-donebutton,.bs-searchbox{padding:4px 8px}.bs-actionsbox{width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bs-actionsbox .btn-group button{width:50%}.bs-donebutton{float:left;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.bs-donebutton .btn-group button{width:100%}.bs-searchbox+.bs-actionsbox{padding:0 8px 4px}.bs-searchbox .form-control{margin-bottom:0;width:100%;float:none} |
|---|
| New file |
| | |
|---|
| | | /*! |
|---|
| | | * Bootstrap-select v1.12.4 (http://silviomoreto.github.io/bootstrap-select) |
|---|
| | | * |
|---|
| | | * Copyright 2013-2017 bootstrap-select |
|---|
| | | * Licensed under MIT (https://github.com/silviomoreto/bootstrap-select/blob/master/LICENSE) |
|---|
| | | */ |
|---|
| | | !function(a,b){"function"==typeof define&&define.amd?define(["jquery"],function(a){return b(a)}):"object"==typeof module&&module.exports?module.exports=b(require("jquery")):b(a.jQuery)}(this,function(a){!function(a){"use strict";function b(b){var c=[{re:/[\xC0-\xC6]/g,ch:"A"},{re:/[\xE0-\xE6]/g,ch:"a"},{re:/[\xC8-\xCB]/g,ch:"E"},{re:/[\xE8-\xEB]/g,ch:"e"},{re:/[\xCC-\xCF]/g,ch:"I"},{re:/[\xEC-\xEF]/g,ch:"i"},{re:/[\xD2-\xD6]/g,ch:"O"},{re:/[\xF2-\xF6]/g,ch:"o"},{re:/[\xD9-\xDC]/g,ch:"U"},{re:/[\xF9-\xFC]/g,ch:"u"},{re:/[\xC7-\xE7]/g,ch:"c"},{re:/[\xD1]/g,ch:"N"},{re:/[\xF1]/g,ch:"n"}];return a.each(c,function(){b=b?b.replace(this.re,this.ch):""}),b}function c(b){var c=arguments,d=b;[].shift.apply(c);var e,f=this.each(function(){var b=a(this);if(b.is("select")){var f=b.data("selectpicker"),g="object"==typeof d&&d;if(f){if(g)for(var h in g)g.hasOwnProperty(h)&&(f.options[h]=g[h])}else{var i=a.extend({},l.DEFAULTS,a.fn.selectpicker.defaults||{},b.data(),g);i.template=a.extend({},l.DEFAULTS.template,a.fn.selectpicker.defaults?a.fn.selectpicker.defaults.template:{},b.data().template,g.template),b.data("selectpicker",f=new l(this,i))}"string"==typeof d&&(e=f[d]instanceof Function?f[d].apply(f,c):f.options[d])}});return"undefined"!=typeof e?e:f}String.prototype.includes||!function(){var a={}.toString,b=function(){try{var a={},b=Object.defineProperty,c=b(a,a,a)&&b}catch(a){}return c}(),c="".indexOf,d=function(b){if(null==this)throw new TypeError;var d=String(this);if(b&&"[object RegExp]"==a.call(b))throw new TypeError;var e=d.length,f=String(b),g=f.length,h=arguments.length>1?arguments[1]:void 0,i=h?Number(h):0;i!=i&&(i=0);var j=Math.min(Math.max(i,0),e);return!(g+j>e)&&c.call(d,f,i)!=-1};b?b(String.prototype,"includes",{value:d,configurable:!0,writable:!0}):String.prototype.includes=d}(),String.prototype.startsWith||!function(){var a=function(){try{var a={},b=Object.defineProperty,c=b(a,a,a)&&b}catch(a){}return c}(),b={}.toString,c=function(a){if(null==this)throw new TypeError;var c=String(this);if(a&&"[object RegExp]"==b.call(a))throw new TypeError;var d=c.length,e=String(a),f=e.length,g=arguments.length>1?arguments[1]:void 0,h=g?Number(g):0;h!=h&&(h=0);var i=Math.min(Math.max(h,0),d);if(f+i>d)return!1;for(var j=-1;++j<f;)if(c.charCodeAt(i+j)!=e.charCodeAt(j))return!1;return!0};a?a(String.prototype,"startsWith",{value:c,configurable:!0,writable:!0}):String.prototype.startsWith=c}(),Object.keys||(Object.keys=function(a,b,c){c=[];for(b in a)c.hasOwnProperty.call(a,b)&&c.push(b);return c});var d={useDefault:!1,_set:a.valHooks.select.set};a.valHooks.select.set=function(b,c){return c&&!d.useDefault&&a(b).data("selected",!0),d._set.apply(this,arguments)};var e=null,f=function(){try{return new Event("change"),!0}catch(a){return!1}}();a.fn.triggerNative=function(a){var b,c=this[0];c.dispatchEvent?(f?b=new Event(a,{bubbles:!0}):(b=document.createEvent("Event"),b.initEvent(a,!0,!1)),c.dispatchEvent(b)):c.fireEvent?(b=document.createEventObject(),b.eventType=a,c.fireEvent("on"+a,b)):this.trigger(a)},a.expr.pseudos.icontains=function(b,c,d){var e=a(b).find("a"),f=(e.data("tokens")||e.text()).toString().toUpperCase();return f.includes(d[3].toUpperCase())},a.expr.pseudos.ibegins=function(b,c,d){var e=a(b).find("a"),f=(e.data("tokens")||e.text()).toString().toUpperCase();return f.startsWith(d[3].toUpperCase())},a.expr.pseudos.aicontains=function(b,c,d){var e=a(b).find("a"),f=(e.data("tokens")||e.data("normalizedText")||e.text()).toString().toUpperCase();return f.includes(d[3].toUpperCase())},a.expr.pseudos.aibegins=function(b,c,d){var e=a(b).find("a"),f=(e.data("tokens")||e.data("normalizedText")||e.text()).toString().toUpperCase();return f.startsWith(d[3].toUpperCase())};var g={"&":"&","<":"<",">":">",'"':""","'":"'","`":"`"},h={"&":"&","<":"<",">":">",""":'"',"'":"'","`":"`"},i=function(a){var b=function(b){return a[b]},c="(?:"+Object.keys(a).join("|")+")",d=RegExp(c),e=RegExp(c,"g");return function(a){return a=null==a?"":""+a,d.test(a)?a.replace(e,b):a}},j=i(g),k=i(h),l=function(b,c){d.useDefault||(a.valHooks.select.set=d._set,d.useDefault=!0),this.$element=a(b),this.$newElement=null,this.$button=null,this.$menu=null,this.$lis=null,this.options=c,null===this.options.title&&(this.options.title=this.$element.attr("title"));var e=this.options.windowPadding;"number"==typeof e&&(this.options.windowPadding=[e,e,e,e]),this.val=l.prototype.val,this.render=l.prototype.render,this.refresh=l.prototype.refresh,this.setStyle=l.prototype.setStyle,this.selectAll=l.prototype.selectAll,this.deselectAll=l.prototype.deselectAll,this.destroy=l.prototype.destroy,this.remove=l.prototype.remove,this.show=l.prototype.show,this.hide=l.prototype.hide,this.init()};l.VERSION="1.12.4",l.DEFAULTS={noneSelectedText:"Nothing selected",noneResultsText:"No results matched {0}",countSelectedText:function(a,b){return 1==a?"{0} item selected":"{0} items selected"},maxOptionsText:function(a,b){return[1==a?"Limit reached ({n} item max)":"Limit reached ({n} items max)",1==b?"Group limit reached ({n} item max)":"Group limit reached ({n} items max)"]},selectAllText:"Select All",deselectAllText:"Deselect All",doneButton:!1,doneButtonText:"Close",multipleSeparator:", ",styleBase:"btn",style:"btn-default",size:"auto",title:null,selectedTextFormat:"values",width:!1,container:!1,hideDisabled:!1,showSubtext:!1,showIcon:!0,showContent:!0,dropupAuto:!0,header:!1,liveSearch:!1,liveSearchPlaceholder:null,liveSearchNormalize:!1,liveSearchStyle:"contains",actionsBox:!1,iconBase:"glyphicon",tickIcon:"glyphicon-ok",showTick:!1,template:{caret:'<span class="caret"></span>'},maxOptions:!1,mobile:!1,selectOnTab:!1,dropdownAlignRight:!1,windowPadding:0},l.prototype={constructor:l,init:function(){var b=this,c=this.$element.attr("id");this.$element.addClass("bs-select-hidden"),this.liObj={},this.multiple=this.$element.prop("multiple"),this.autofocus=this.$element.prop("autofocus"),this.$newElement=this.createView(),this.$element.after(this.$newElement).appendTo(this.$newElement),this.$button=this.$newElement.children("button"),this.$menu=this.$newElement.children(".dropdown-menu"),this.$menuInner=this.$menu.children(".inner"),this.$searchbox=this.$menu.find("input"),this.$element.removeClass("bs-select-hidden"),this.options.dropdownAlignRight===!0&&this.$menu.addClass("dropdown-menu-right"),"undefined"!=typeof c&&(this.$button.attr("data-id",c),a('label[for="'+c+'"]').click(function(a){a.preventDefault(),b.$button.focus()})),this.checkDisabled(),this.clickListener(),this.options.liveSearch&&this.liveSearchListener(),this.render(),this.setStyle(),this.setWidth(),this.options.container&&this.selectPosition(),this.$menu.data("this",this),this.$newElement.data("this",this),this.options.mobile&&this.mobile(),this.$newElement.on({"hide.bs.dropdown":function(a){b.$menuInner.attr("aria-expanded",!1),b.$element.trigger("hide.bs.select",a)},"hidden.bs.dropdown":function(a){b.$element.trigger("hidden.bs.select",a)},"show.bs.dropdown":function(a){b.$menuInner.attr("aria-expanded",!0),b.$element.trigger("show.bs.select",a)},"shown.bs.dropdown":function(a){b.$element.trigger("shown.bs.select",a)}}),b.$element[0].hasAttribute("required")&&this.$element.on("invalid",function(){b.$button.addClass("bs-invalid"),b.$element.on({"focus.bs.select":function(){b.$button.focus(),b.$element.off("focus.bs.select")},"shown.bs.select":function(){b.$element.val(b.$element.val()).off("shown.bs.select")},"rendered.bs.select":function(){this.validity.valid&&b.$button.removeClass("bs-invalid"),b.$element.off("rendered.bs.select")}}),b.$button.on("blur.bs.select",function(){b.$element.focus().blur(),b.$button.off("blur.bs.select")})}),setTimeout(function(){b.$element.trigger("loaded.bs.select")})},createDropdown:function(){var b=this.multiple||this.options.showTick?" show-tick":"",c=this.$element.parent().hasClass("input-group")?" input-group-btn":"",d=this.autofocus?" autofocus":"",e=this.options.header?'<div class="popover-title"><button type="button" class="close" aria-hidden="true">×</button>'+this.options.header+"</div>":"",f=this.options.liveSearch?'<div class="bs-searchbox"><input type="text" class="form-control" autocomplete="off"'+(null===this.options.liveSearchPlaceholder?"":' placeholder="'+j(this.options.liveSearchPlaceholder)+'"')+' role="textbox" aria-label="Search"></div>':"",g=this.multiple&&this.options.actionsBox?'<div class="bs-actionsbox"><div class="btn-group btn-group-sm btn-block"><button type="button" class="actions-btn bs-select-all btn btn-default">'+this.options.selectAllText+'</button><button type="button" class="actions-btn bs-deselect-all btn btn-default">'+this.options.deselectAllText+"</button></div></div>":"",h=this.multiple&&this.options.doneButton?'<div class="bs-donebutton"><div class="btn-group btn-block"><button type="button" class="btn btn-sm btn-default">'+this.options.doneButtonText+"</button></div></div>":"",i='<div class="btn-group bootstrap-select'+b+c+'"><button type="button" class="'+this.options.styleBase+' dropdown-toggle" data-toggle="dropdown"'+d+' role="button"><span class="filter-option pull-left"></span> <span class="bs-caret">'+this.options.template.caret+'</span></button><div class="dropdown-menu open" role="combobox">'+e+f+g+'<ul class="dropdown-menu inner" role="listbox" aria-expanded="false"></ul>'+h+"</div></div>";return a(i)},createView:function(){var a=this.createDropdown(),b=this.createLi();return a.find("ul")[0].innerHTML=b,a},reloadLi:function(){var a=this.createLi();this.$menuInner[0].innerHTML=a},createLi:function(){var c=this,d=[],e=0,f=document.createElement("option"),g=-1,h=function(a,b,c,d){return"<li"+("undefined"!=typeof c&&""!==c?' class="'+c+'"':"")+("undefined"!=typeof b&&null!==b?' data-original-index="'+b+'"':"")+("undefined"!=typeof d&&null!==d?'data-optgroup="'+d+'"':"")+">"+a+"</li>"},i=function(d,e,f,g){return'<a tabindex="0"'+("undefined"!=typeof e?' class="'+e+'"':"")+(f?' style="'+f+'"':"")+(c.options.liveSearchNormalize?' data-normalized-text="'+b(j(a(d).html()))+'"':"")+("undefined"!=typeof g||null!==g?' data-tokens="'+g+'"':"")+' role="option">'+d+'<span class="'+c.options.iconBase+" "+c.options.tickIcon+' check-mark"></span></a>'};if(this.options.title&&!this.multiple&&(g--,!this.$element.find(".bs-title-option").length)){var k=this.$element[0];f.className="bs-title-option",f.innerHTML=this.options.title,f.value="",k.insertBefore(f,k.firstChild);var l=a(k.options[k.selectedIndex]);void 0===l.attr("selected")&&void 0===this.$element.data("selected")&&(f.selected=!0)}var m=this.$element.find("option");return m.each(function(b){var f=a(this);if(g++,!f.hasClass("bs-title-option")){var k,l=this.className||"",n=j(this.style.cssText),o=f.data("content")?f.data("content"):f.html(),p=f.data("tokens")?f.data("tokens"):null,q="undefined"!=typeof f.data("subtext")?'<small class="text-muted">'+f.data("subtext")+"</small>":"",r="undefined"!=typeof f.data("icon")?'<span class="'+c.options.iconBase+" "+f.data("icon")+'"></span> ':"",s=f.parent(),t="OPTGROUP"===s[0].tagName,u=t&&s[0].disabled,v=this.disabled||u;if(""!==r&&v&&(r="<span>"+r+"</span>"),c.options.hideDisabled&&(v&&!t||u))return k=f.data("prevHiddenIndex"),f.next().data("prevHiddenIndex",void 0!==k?k:b),void g--;if(f.data("content")||(o=r+'<span class="text">'+o+q+"</span>"),t&&f.data("divider")!==!0){if(c.options.hideDisabled&&v){if(void 0===s.data("allOptionsDisabled")){var w=s.children();s.data("allOptionsDisabled",w.filter(":disabled").length===w.length)}if(s.data("allOptionsDisabled"))return void g--}var x=" "+s[0].className||"";if(0===f.index()){e+=1;var y=s[0].label,z="undefined"!=typeof s.data("subtext")?'<small class="text-muted">'+s.data("subtext")+"</small>":"",A=s.data("icon")?'<span class="'+c.options.iconBase+" "+s.data("icon")+'"></span> ':"";y=A+'<span class="text">'+j(y)+z+"</span>",0!==b&&d.length>0&&(g++,d.push(h("",null,"divider",e+"div"))),g++,d.push(h(y,null,"dropdown-header"+x,e))}if(c.options.hideDisabled&&v)return void g--;d.push(h(i(o,"opt "+l+x,n,p),b,"",e))}else if(f.data("divider")===!0)d.push(h("",b,"divider"));else if(f.data("hidden")===!0)k=f.data("prevHiddenIndex"),f.next().data("prevHiddenIndex",void 0!==k?k:b),d.push(h(i(o,l,n,p),b,"hidden is-hidden"));else{var B=this.previousElementSibling&&"OPTGROUP"===this.previousElementSibling.tagName;if(!B&&c.options.hideDisabled&&(k=f.data("prevHiddenIndex"),void 0!==k)){var C=m.eq(k)[0].previousElementSibling;C&&"OPTGROUP"===C.tagName&&!C.disabled&&(B=!0)}B&&(g++,d.push(h("",null,"divider",e+"div"))),d.push(h(i(o,l,n,p),b))}c.liObj[b]=g}}),this.multiple||0!==this.$element.find("option:selected").length||this.options.title||this.$element.find("option").eq(0).prop("selected",!0).attr("selected","selected"),d.join("")},findLis:function(){return null==this.$lis&&(this.$lis=this.$menu.find("li")),this.$lis},render:function(b){var c,d=this,e=this.$element.find("option");b!==!1&&e.each(function(a){var b=d.findLis().eq(d.liObj[a]);d.setDisabled(a,this.disabled||"OPTGROUP"===this.parentNode.tagName&&this.parentNode.disabled,b),d.setSelected(a,this.selected,b)}),this.togglePlaceholder(),this.tabIndex();var f=e.map(function(){if(this.selected){if(d.options.hideDisabled&&(this.disabled||"OPTGROUP"===this.parentNode.tagName&&this.parentNode.disabled))return;var b,c=a(this),e=c.data("icon")&&d.options.showIcon?'<i class="'+d.options.iconBase+" "+c.data("icon")+'"></i> ':"";return b=d.options.showSubtext&&c.data("subtext")&&!d.multiple?' <small class="text-muted">'+c.data("subtext")+"</small>":"","undefined"!=typeof c.attr("title")?c.attr("title"):c.data("content")&&d.options.showContent?c.data("content").toString():e+c.html()+b}}).toArray(),g=this.multiple?f.join(this.options.multipleSeparator):f[0];if(this.multiple&&this.options.selectedTextFormat.indexOf("count")>-1){var h=this.options.selectedTextFormat.split(">");if(h.length>1&&f.length>h[1]||1==h.length&&f.length>=2){c=this.options.hideDisabled?", [disabled]":"";var i=e.not('[data-divider="true"], [data-hidden="true"]'+c).length,j="function"==typeof this.options.countSelectedText?this.options.countSelectedText(f.length,i):this.options.countSelectedText;g=j.replace("{0}",f.length.toString()).replace("{1}",i.toString())}}void 0==this.options.title&&(this.options.title=this.$element.attr("title")),"static"==this.options.selectedTextFormat&&(g=this.options.title),g||(g="undefined"!=typeof this.options.title?this.options.title:this.options.noneSelectedText),this.$button.attr("title",k(a.trim(g.replace(/<[^>]*>?/g,"")))),this.$button.children(".filter-option").html(g),this.$element.trigger("rendered.bs.select")},setStyle:function(a,b){this.$element.attr("class")&&this.$newElement.addClass(this.$element.attr("class").replace(/selectpicker|mobile-device|bs-select-hidden|validate\[.*\]/gi,""));var c=a?a:this.options.style;"add"==b?this.$button.addClass(c):"remove"==b?this.$button.removeClass(c):(this.$button.removeClass(this.options.style),this.$button.addClass(c))},liHeight:function(b){if(b||this.options.size!==!1&&!this.sizeInfo){var c=document.createElement("div"),d=document.createElement("div"),e=document.createElement("ul"),f=document.createElement("li"),g=document.createElement("li"),h=document.createElement("a"),i=document.createElement("span"),j=this.options.header&&this.$menu.find(".popover-title").length>0?this.$menu.find(".popover-title")[0].cloneNode(!0):null,k=this.options.liveSearch?document.createElement("div"):null,l=this.options.actionsBox&&this.multiple&&this.$menu.find(".bs-actionsbox").length>0?this.$menu.find(".bs-actionsbox")[0].cloneNode(!0):null,m=this.options.doneButton&&this.multiple&&this.$menu.find(".bs-donebutton").length>0?this.$menu.find(".bs-donebutton")[0].cloneNode(!0):null;if(i.className="text",c.className=this.$menu[0].parentNode.className+" open",d.className="dropdown-menu open",e.className="dropdown-menu inner",f.className="divider",i.appendChild(document.createTextNode("Inner text")),h.appendChild(i),g.appendChild(h),e.appendChild(g),e.appendChild(f),j&&d.appendChild(j),k){var n=document.createElement("input");k.className="bs-searchbox",n.className="form-control",k.appendChild(n),d.appendChild(k)}l&&d.appendChild(l),d.appendChild(e),m&&d.appendChild(m),c.appendChild(d),document.body.appendChild(c);var o=h.offsetHeight,p=j?j.offsetHeight:0,q=k?k.offsetHeight:0,r=l?l.offsetHeight:0,s=m?m.offsetHeight:0,t=a(f).outerHeight(!0),u="function"==typeof getComputedStyle&&getComputedStyle(d),v=u?null:a(d),w={vert:parseInt(u?u.paddingTop:v.css("paddingTop"))+parseInt(u?u.paddingBottom:v.css("paddingBottom"))+parseInt(u?u.borderTopWidth:v.css("borderTopWidth"))+parseInt(u?u.borderBottomWidth:v.css("borderBottomWidth")),horiz:parseInt(u?u.paddingLeft:v.css("paddingLeft"))+parseInt(u?u.paddingRight:v.css("paddingRight"))+parseInt(u?u.borderLeftWidth:v.css("borderLeftWidth"))+parseInt(u?u.borderRightWidth:v.css("borderRightWidth"))},x={vert:w.vert+parseInt(u?u.marginTop:v.css("marginTop"))+parseInt(u?u.marginBottom:v.css("marginBottom"))+2,horiz:w.horiz+parseInt(u?u.marginLeft:v.css("marginLeft"))+parseInt(u?u.marginRight:v.css("marginRight"))+2};document.body.removeChild(c),this.sizeInfo={liHeight:o,headerHeight:p,searchHeight:q,actionsHeight:r,doneButtonHeight:s,dividerHeight:t,menuPadding:w,menuExtras:x}}},setSize:function(){if(this.findLis(),this.liHeight(),this.options.header&&this.$menu.css("padding-top",0),this.options.size!==!1){var b,c,d,e,f,g,h,i,j=this,k=this.$menu,l=this.$menuInner,m=a(window),n=this.$newElement[0].offsetHeight,o=this.$newElement[0].offsetWidth,p=this.sizeInfo.liHeight,q=this.sizeInfo.headerHeight,r=this.sizeInfo.searchHeight,s=this.sizeInfo.actionsHeight,t=this.sizeInfo.doneButtonHeight,u=this.sizeInfo.dividerHeight,v=this.sizeInfo.menuPadding,w=this.sizeInfo.menuExtras,x=this.options.hideDisabled?".disabled":"",y=function(){var b,c=j.$newElement.offset(),d=a(j.options.container);j.options.container&&!d.is("body")?(b=d.offset(),b.top+=parseInt(d.css("borderTopWidth")),b.left+=parseInt(d.css("borderLeftWidth"))):b={top:0,left:0};var e=j.options.windowPadding;f=c.top-b.top-m.scrollTop(),g=m.height()-f-n-b.top-e[2],h=c.left-b.left-m.scrollLeft(),i=m.width()-h-o-b.left-e[1],f-=e[0],h-=e[3]};if(y(),"auto"===this.options.size){var z=function(){var m,n=function(b,c){return function(d){return c?d.classList?d.classList.contains(b):a(d).hasClass(b):!(d.classList?d.classList.contains(b):a(d).hasClass(b))}},u=j.$menuInner[0].getElementsByTagName("li"),x=Array.prototype.filter?Array.prototype.filter.call(u,n("hidden",!1)):j.$lis.not(".hidden"),z=Array.prototype.filter?Array.prototype.filter.call(x,n("dropdown-header",!0)):x.filter(".dropdown-header");y(),b=g-w.vert,c=i-w.horiz,j.options.container?(k.data("height")||k.data("height",k.height()),d=k.data("height"),k.data("width")||k.data("width",k.width()),e=k.data("width")):(d=k.height(),e=k.width()),j.options.dropupAuto&&j.$newElement.toggleClass("dropup",f>g&&b-w.vert<d),j.$newElement.hasClass("dropup")&&(b=f-w.vert),"auto"===j.options.dropdownAlignRight&&k.toggleClass("dropdown-menu-right",h>i&&c-w.horiz<e-o),m=x.length+z.length>3?3*p+w.vert-2:0,k.css({"max-height":b+"px",overflow:"hidden","min-height":m+q+r+s+t+"px"}),l.css({"max-height":b-q-r-s-t-v.vert+"px","overflow-y":"auto","min-height":Math.max(m-v.vert,0)+"px"})};z(),this.$searchbox.off("input.getSize propertychange.getSize").on("input.getSize propertychange.getSize",z),m.off("resize.getSize scroll.getSize").on("resize.getSize scroll.getSize",z)}else if(this.options.size&&"auto"!=this.options.size&&this.$lis.not(x).length>this.options.size){var A=this.$lis.not(".divider").not(x).children().slice(0,this.options.size).last().parent().index(),B=this.$lis.slice(0,A+1).filter(".divider").length;b=p*this.options.size+B*u+v.vert,j.options.container?(k.data("height")||k.data("height",k.height()),d=k.data("height")):d=k.height(),j.options.dropupAuto&&this.$newElement.toggleClass("dropup",f>g&&b-w.vert<d),k.css({"max-height":b+q+r+s+t+"px",overflow:"hidden","min-height":""}),l.css({"max-height":b-v.vert+"px","overflow-y":"auto","min-height":""})}}},setWidth:function(){if("auto"===this.options.width){this.$menu.css("min-width","0");var a=this.$menu.parent().clone().appendTo("body"),b=this.options.container?this.$newElement.clone().appendTo("body"):a,c=a.children(".dropdown-menu").outerWidth(),d=b.css("width","auto").children("button").outerWidth();a.remove(),b.remove(),this.$newElement.css("width",Math.max(c,d)+"px")}else"fit"===this.options.width?(this.$menu.css("min-width",""),this.$newElement.css("width","").addClass("fit-width")):this.options.width?(this.$menu.css("min-width",""),this.$newElement.css("width",this.options.width)):(this.$menu.css("min-width",""),this.$newElement.css("width",""));this.$newElement.hasClass("fit-width")&&"fit"!==this.options.width&&this.$newElement.removeClass("fit-width")},selectPosition:function(){this.$bsContainer=a('<div class="bs-container" />');var b,c,d,e=this,f=a(this.options.container),g=function(a){e.$bsContainer.addClass(a.attr("class").replace(/form-control|fit-width/gi,"")).toggleClass("dropup",a.hasClass("dropup")),b=a.offset(),f.is("body")?c={top:0,left:0}:(c=f.offset(),c.top+=parseInt(f.css("borderTopWidth"))-f.scrollTop(),c.left+=parseInt(f.css("borderLeftWidth"))-f.scrollLeft()),d=a.hasClass("dropup")?0:a[0].offsetHeight,e.$bsContainer.css({top:b.top-c.top+d,left:b.left-c.left,width:a[0].offsetWidth})};this.$button.on("click",function(){var b=a(this);e.isDisabled()||(g(e.$newElement),e.$bsContainer.appendTo(e.options.container).toggleClass("open",!b.hasClass("open")).append(e.$menu))}),a(window).on("resize scroll",function(){g(e.$newElement)}),this.$element.on("hide.bs.select",function(){e.$menu.data("height",e.$menu.height()),e.$bsContainer.detach()})},setSelected:function(a,b,c){c||(this.togglePlaceholder(),c=this.findLis().eq(this.liObj[a])),c.toggleClass("selected",b).find("a").attr("aria-selected",b)},setDisabled:function(a,b,c){c||(c=this.findLis().eq(this.liObj[a])),b?c.addClass("disabled").children("a").attr("href","#").attr("tabindex",-1).attr("aria-disabled",!0):c.removeClass("disabled").children("a").removeAttr("href").attr("tabindex",0).attr("aria-disabled",!1)},isDisabled:function(){return this.$element[0].disabled},checkDisabled:function(){var a=this;this.isDisabled()?(this.$newElement.addClass("disabled"),this.$button.addClass("disabled").attr("tabindex",-1).attr("aria-disabled",!0)):(this.$button.hasClass("disabled")&&(this.$newElement.removeClass("disabled"),this.$button.removeClass("disabled").attr("aria-disabled",!1)),this.$button.attr("tabindex")!=-1||this.$element.data("tabindex")||this.$button.removeAttr("tabindex")),this.$button.click(function(){return!a.isDisabled()})},togglePlaceholder:function(){var a=this.$element.val();this.$button.toggleClass("bs-placeholder",null===a||""===a||a.constructor===Array&&0===a.length)},tabIndex:function(){this.$element.data("tabindex")!==this.$element.attr("tabindex")&&this.$element.attr("tabindex")!==-98&&"-98"!==this.$element.attr("tabindex")&&(this.$element.data("tabindex",this.$element.attr("tabindex")),this.$button.attr("tabindex",this.$element.data("tabindex"))),this.$element.attr("tabindex",-98)},clickListener:function(){var b=this,c=a(document);c.data("spaceSelect",!1),this.$button.on("keyup",function(a){/(32)/.test(a.keyCode.toString(10))&&c.data("spaceSelect")&&(a.preventDefault(),c.data("spaceSelect",!1))}),this.$button.on("click",function(){b.setSize()}),this.$element.on("shown.bs.select",function(){if(b.options.liveSearch||b.multiple){if(!b.multiple){var a=b.liObj[b.$element[0].selectedIndex];if("number"!=typeof a||b.options.size===!1)return;var c=b.$lis.eq(a)[0].offsetTop-b.$menuInner[0].offsetTop;c=c-b.$menuInner[0].offsetHeight/2+b.sizeInfo.liHeight/2,b.$menuInner[0].scrollTop=c}}else b.$menuInner.find(".selected a").focus()}),this.$menuInner.on("click","li a",function(c){var d=a(this),f=d.parent().data("originalIndex"),g=b.$element.val(),h=b.$element.prop("selectedIndex"),i=!0;if(b.multiple&&1!==b.options.maxOptions&&c.stopPropagation(),c.preventDefault(),!b.isDisabled()&&!d.parent().hasClass("disabled")){var j=b.$element.find("option"),k=j.eq(f),l=k.prop("selected"),m=k.parent("optgroup"),n=b.options.maxOptions,o=m.data("maxOptions")||!1;if(b.multiple){if(k.prop("selected",!l),b.setSelected(f,!l),d.blur(),n!==!1||o!==!1){var p=n<j.filter(":selected").length,q=o<m.find("option:selected").length;if(n&&p||o&&q)if(n&&1==n)j.prop("selected",!1),k.prop("selected",!0),b.$menuInner.find(".selected").removeClass("selected"),b.setSelected(f,!0);else if(o&&1==o){m.find("option:selected").prop("selected",!1),k.prop("selected",!0);var r=d.parent().data("optgroup");b.$menuInner.find('[data-optgroup="'+r+'"]').removeClass("selected"),b.setSelected(f,!0)}else{var s="string"==typeof b.options.maxOptionsText?[b.options.maxOptionsText,b.options.maxOptionsText]:b.options.maxOptionsText,t="function"==typeof s?s(n,o):s,u=t[0].replace("{n}",n),v=t[1].replace("{n}",o),w=a('<div class="notify"></div>');t[2]&&(u=u.replace("{var}",t[2][n>1?0:1]),v=v.replace("{var}",t[2][o>1?0:1])),k.prop("selected",!1),b.$menu.append(w),n&&p&&(w.append(a("<div>"+u+"</div>")),i=!1,b.$element.trigger("maxReached.bs.select")),o&&q&&(w.append(a("<div>"+v+"</div>")),i=!1,b.$element.trigger("maxReachedGrp.bs.select")),setTimeout(function(){b.setSelected(f,!1)},10),w.delay(750).fadeOut(300,function(){a(this).remove()})}}}else j.prop("selected",!1),k.prop("selected",!0),b.$menuInner.find(".selected").removeClass("selected").find("a").attr("aria-selected",!1),b.setSelected(f,!0);!b.multiple||b.multiple&&1===b.options.maxOptions?b.$button.focus():b.options.liveSearch&&b.$searchbox.focus(),i&&(g!=b.$element.val()&&b.multiple||h!=b.$element.prop("selectedIndex")&&!b.multiple)&&(e=[f,k.prop("selected"),l],b.$element.triggerNative("change"))}}),this.$menu.on("click","li.disabled a, .popover-title, .popover-title :not(.close)",function(c){c.currentTarget==this&&(c.preventDefault(),c.stopPropagation(),b.options.liveSearch&&!a(c.target).hasClass("close")?b.$searchbox.focus():b.$button.focus())}),this.$menuInner.on("click",".divider, .dropdown-header",function(a){a.preventDefault(),a.stopPropagation(),b.options.liveSearch?b.$searchbox.focus():b.$button.focus()}),this.$menu.on("click",".popover-title .close",function(){b.$button.click()}),this.$searchbox.on("click",function(a){a.stopPropagation()}),this.$menu.on("click",".actions-btn",function(c){b.options.liveSearch?b.$searchbox.focus():b.$button.focus(),c.preventDefault(),c.stopPropagation(),a(this).hasClass("bs-select-all")?b.selectAll():b.deselectAll()}),this.$element.change(function(){b.render(!1),b.$element.trigger("changed.bs.select",e),e=null})},liveSearchListener:function(){var c=this,d=a('<li class="no-results"></li>');this.$button.on("click.dropdown.data-api",function(){c.$menuInner.find(".active").removeClass("active"),c.$searchbox.val()&&(c.$searchbox.val(""),c.$lis.not(".is-hidden").removeClass("hidden"),d.parent().length&&d.remove()),c.multiple||c.$menuInner.find(".selected").addClass("active"),setTimeout(function(){c.$searchbox.focus()},10)}),this.$searchbox.on("click.dropdown.data-api focus.dropdown.data-api touchend.dropdown.data-api",function(a){a.stopPropagation()}),this.$searchbox.on("input propertychange",function(){if(c.$lis.not(".is-hidden").removeClass("hidden"),c.$lis.filter(".active").removeClass("active"),d.remove(),c.$searchbox.val()){var e,f=c.$lis.not(".is-hidden, .divider, .dropdown-header");if(e=c.options.liveSearchNormalize?f.not(":a"+c._searchStyle()+'("'+b(c.$searchbox.val())+'")'):f.not(":"+c._searchStyle()+'("'+c.$searchbox.val()+'")'),e.length===f.length)d.html(c.options.noneResultsText.replace("{0}",'"'+j(c.$searchbox.val())+'"')),c.$menuInner.append(d),c.$lis.addClass("hidden");else{e.addClass("hidden");var g,h=c.$lis.not(".hidden");h.each(function(b){var c=a(this);c.hasClass("divider")?void 0===g?c.addClass("hidden"):(g&&g.addClass("hidden"),g=c):c.hasClass("dropdown-header")&&h.eq(b+1).data("optgroup")!==c.data("optgroup")?c.addClass("hidden"):g=null}),g&&g.addClass("hidden"),f.not(".hidden").first().addClass("active"),c.$menuInner.scrollTop(0)}}})},_searchStyle:function(){var a={begins:"ibegins",startsWith:"ibegins"};return a[this.options.liveSearchStyle]||"icontains"},val:function(a){return"undefined"!=typeof a?(this.$element.val(a),this.render(),this.$element):this.$element.val()},changeAll:function(b){if(this.multiple){"undefined"==typeof b&&(b=!0),this.findLis();var c=this.$element.find("option"),d=this.$lis.not(".divider, .dropdown-header, .disabled, .hidden"),e=d.length,f=[];if(b){if(d.filter(".selected").length===d.length)return}else if(0===d.filter(".selected").length)return;d.toggleClass("selected",b);for(var g=0;g<e;g++){var h=d[g].getAttribute("data-original-index");f[f.length]=c.eq(h)[0]}a(f).prop("selected",b),this.render(!1),this.togglePlaceholder(),this.$element.triggerNative("change")}},selectAll:function(){return this.changeAll(!0)},deselectAll:function(){return this.changeAll(!1)},toggle:function(a){a=a||window.event,a&&a.stopPropagation(),this.$button.trigger("click")},keydown:function(b){var c,d,e,f,g=a(this),h=g.is("input")?g.parent().parent():g.parent(),i=h.data("this"),j=":not(.disabled, .hidden, .dropdown-header, .divider)",k={32:" ",48:"0",49:"1",50:"2",51:"3",52:"4",53:"5",54:"6",55:"7",56:"8",57:"9",59:";",65:"a",66:"b",67:"c",68:"d",69:"e",70:"f",71:"g",72:"h",73:"i",74:"j",75:"k",76:"l",77:"m",78:"n",79:"o",80:"p",81:"q",82:"r",83:"s",84:"t",85:"u",86:"v",87:"w",88:"x",89:"y",90:"z",96:"0",97:"1",98:"2",99:"3",100:"4",101:"5",102:"6",103:"7",104:"8",105:"9"};if(f=i.$newElement.hasClass("open"),!f&&(b.keyCode>=48&&b.keyCode<=57||b.keyCode>=96&&b.keyCode<=105||b.keyCode>=65&&b.keyCode<=90))return i.options.container?i.$button.trigger("click"):(i.setSize(),i.$menu.parent().addClass("open"),f=!0),void i.$searchbox.focus();if(i.options.liveSearch&&/(^9$|27)/.test(b.keyCode.toString(10))&&f&&(b.preventDefault(),b.stopPropagation(),i.$menuInner.click(),i.$button.focus()),/(38|40)/.test(b.keyCode.toString(10))){if(c=i.$lis.filter(j),!c.length)return;d=i.options.liveSearch?c.index(c.filter(".active")):c.index(c.find("a").filter(":focus").parent()),e=i.$menuInner.data("prevIndex"),38==b.keyCode?(!i.options.liveSearch&&d!=e||d==-1||d--,d<0&&(d+=c.length)):40==b.keyCode&&((i.options.liveSearch||d==e)&&d++,d%=c.length),i.$menuInner.data("prevIndex",d),i.options.liveSearch?(b.preventDefault(),g.hasClass("dropdown-toggle")||(c.removeClass("active").eq(d).addClass("active").children("a").focus(),g.focus())):c.eq(d).children("a").focus()}else if(!g.is("input")){var l,m,n=[];c=i.$lis.filter(j),c.each(function(c){a.trim(a(this).children("a").text().toLowerCase()).substring(0,1)==k[b.keyCode]&&n.push(c)}),l=a(document).data("keycount"),l++,a(document).data("keycount",l),m=a.trim(a(":focus").text().toLowerCase()).substring(0,1),m!=k[b.keyCode]?(l=1,a(document).data("keycount",l)):l>=n.length&&(a(document).data("keycount",0),l>n.length&&(l=1)),c.eq(n[l-1]).children("a").focus()}if((/(13|32)/.test(b.keyCode.toString(10))||/(^9$)/.test(b.keyCode.toString(10))&&i.options.selectOnTab)&&f){if(/(32)/.test(b.keyCode.toString(10))||b.preventDefault(),i.options.liveSearch)/(32)/.test(b.keyCode.toString(10))||(i.$menuInner.find(".active a").click(),g.focus());else{var o=a(":focus");o.click(),o.focus(),b.preventDefault(),a(document).data("spaceSelect",!0)}a(document).data("keycount",0)}(/(^9$|27)/.test(b.keyCode.toString(10))&&f&&(i.multiple||i.options.liveSearch)||/(27)/.test(b.keyCode.toString(10))&&!f)&&(i.$menu.parent().removeClass("open"),i.options.container&&i.$newElement.removeClass("open"),i.$button.focus())},mobile:function(){this.$element.addClass("mobile-device")},refresh:function(){this.$lis=null,this.liObj={},this.reloadLi(),this.render(),this.checkDisabled(),this.liHeight(!0),this.setStyle(), |
|---|
| | | this.setWidth(),this.$lis&&this.$searchbox.trigger("propertychange"),this.$element.trigger("refreshed.bs.select")},hide:function(){this.$newElement.hide()},show:function(){this.$newElement.show()},remove:function(){this.$newElement.remove(),this.$element.remove()},destroy:function(){this.$newElement.before(this.$element).remove(),this.$bsContainer?this.$bsContainer.remove():this.$menu.remove(),this.$element.off(".bs.select").removeData("selectpicker").removeClass("bs-select-hidden selectpicker")}};var m=a.fn.selectpicker;a.fn.selectpicker=c,a.fn.selectpicker.Constructor=l,a.fn.selectpicker.noConflict=function(){return a.fn.selectpicker=m,this},a(document).data("keycount",0).on("keydown.bs.select",'.bootstrap-select [data-toggle=dropdown], .bootstrap-select [role="listbox"], .bs-searchbox input',l.prototype.keydown).on("focusin.modal",'.bootstrap-select [data-toggle=dropdown], .bootstrap-select [role="listbox"], .bs-searchbox input',function(a){a.stopPropagation()}),a(window).on("load.bs.select.data-api",function(){a(".selectpicker").each(function(){var b=a(this);c.call(b,b.data())})})}(a)}); |
|---|
| | | //# sourceMappingURL=bootstrap-select.js.map |
|---|
