add save search by 'zengjun2'

app/Http/Controllers/WaveController.php

@@ -0,0 +1,78 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Authority;
+use App\Services\WaveService;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Support\Facades\Gate;
+
+class WaveController extends Controller
+{
+
+    public function __construct()
+    {
+        app()->bind("WaveService",WaveService::class);
+    }
+
+    // 主页
+    public function index(Request $request){
+        if(!Gate::allows('订单管理-波次-查询')){ return redirect(url('/'));  }
+        $waveService = app("WaveService");
+        $waves = $waveService->queryWave($request);
+        $waveStatus = $waveService->getWaveStatus();
+        $param =  $waveService->getPageParameter($request);
+        $search = $waveService->getSearchCondition($request);
+        foreach ($waves as $index=>$wave){
+            $wave->pickerPrint = '';
+            $wave->pickerPrintTime = '';
+            $wave->expressPrinting = '';
+            $wave->expressPrintTime = '';
+            if(!is_null($wave->userdefine1)){
+                $str = $wave->userdefine1;
+                $index = strpos($str,'-PK');
+                $wave->pickerPrint = substr($str,0,$index);
+                $wave->pickerPrintTime = substr($str,$index+3);
+            }
+            if(!is_null($wave->userdefine2)){
+                $str = $wave->userdefine2;
+                $index = strpos($str,'-EX');
+                $wave->expressPrinting = substr($str,0,$index);
+                $wave->expressPrintTime = substr($str,$index+3);
+            }
+        }
+        return view("order/wave/search",compact('waves','waveStatus','param','search'));
+    }
+
+    public function create(){
+
+    }
+    public function store(Request $request){
+
+    }
+    public function edit($id){
+
+    }
+    public function update(Request $request, $id){
+
+    }
+    public function destroy($id){
+
+    }
+
+    public function cancelPrinting(Request $request){
+        if(!Gate::allows('订单管理-波次-取消打印标记')){ return ['success'=>false,'fail_info'=>'没有权限，请联系管理员'];  }
+        $waveService = app("WaveService");
+        $meg = ['success'=>false];
+        $ids = $request->input("ids");
+        $meg = $waveService->cancelPrint($ids);
+        if($meg['fail_info']){
+            return $meg;
+        }
+        $this->log(__METHOD__,'取消打印标记'.__FUNCTION__,json_encode($request->toArray()),Auth::user()['id']);
+        return $meg;
+    }
+
+
+}

database/migrations/2020_07_22_102857_add_wave_search_and_wave_cancel_print.php

@@ -0,0 +1,36 @@
+<?php
+
+use App\Authority;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddWaveSearchAndWaveCancelPrint extends Migration
+{
+    protected $authNames =["订单管理-波次-查询","订单管理-波次-取消打印标记","订单管理-波次-查询"];
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        //
+        foreach ($this->authNames as $name){
+            if(!Authority::where('name',$name)->first())(new Authority(['name'=>$name,'alias_name'=>$name]))->save();
+        }
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        //
+        foreach ($this->authNames as $name){
+            Authority::where('name',$name)->delete();
+        }
+    }
+}

resources/js/queryForm/queryForm.js

@@ -0,0 +1,1222 @@
+const query = function getQueryForm(data) {
+    {
+        this.el = data.el || '#form_div';
+        this.form = data.form;
+        this.method = data.method || 'get';
+        this.url = data.url || getPathname();
+        this.condition = data.condition;
+        this.paginations = [50, 100, 200, 500] || data.paginations;
+        this.keydownfun = data.keydownfun || undefined;
+        this.selectChange = data.selectChange || undefined;
+        this.searchClick = data.searchClick || undefined;
+        this.selectfun = data.selectfun || undefined;
+        this._onsubmit = data._onsubmit || undefined;
+        this.keydownSearch = data.keydownSearch || true;
+        this.selectChangeSearch = data.selectChangeSearch || true;
+        this.tip = data.tip || '';
+        this.nextPage = nextPage;
+        this.pervPage = pervPage;
+        this.goPage =goPage;
+        this.getSearchData = getSearchData;
+        this.autoSubmit = (data.autoSubmit === false) ? false : true ;
+        this.param = data.param || [];
+
+
+        // 提交表单
+        this.onsubmit = function () {
+            if(!this.autoSubmit){
+                return;
+            }
+            saveSearchOnCookie();
+            let form = $("<form method='" + _this.method +"'></form>");
+            for (const key in _data) {
+                let map = _data[key];
+                if (["string", "number"].includes(fetchJsType(map.value)) && map.value !== '') {
+                    form.append("<input name='" + key + "' value='" + map.value + "'>")
+                } else if ('array' === fetchJsType(map.value)) {
+                    map.value.forEach(function (value) {
+                        form.append("<input type='checkbox' name='" + key + "' value='" + value + "' checked='checked' >");
+                    })
+                }
+            }
+            for (let key in this.param){
+                form.append("<input type='text' name='" + key + "' value='" + this.param[key] + "'>");
+            }
+            if (_this.method !== 'get') {
+                form.append("<input type='hidden' name='_token' value='" + $('meta[name="csrf-token"]').attr('content') + "'>");
+                form.append("<input type='hidden' name='_method' value='" + _this.method + "'>");
+                form.attr('action', _this.url);
+            }
+            _hidden_div.html('');
+            _hidden_div.append(form);
+            form.submit();
+        }
+
+    }
+    let _this = this;
+    let _parentNode = null;
+    let _data = {};
+    let _form = [];
+    let _table = null;
+    let _clearTr = null;
+    let _pagination = null;
+    let _baseData = data;
+    let _searchBtn = null;
+    let _hidden_div = null;
+    let _parentNode_top = null;
+    let _page = '';
+
+    this.init = function () {
+        _parentNode = $(_this.el);
+        _form = $("<div ></div>");
+        _table = $("<table class='table table-sm table-bordered m-0 position-static' style='background: rgb(255, 255, 255);'></table>");
+        fillTable();
+        switchData();
+        addHiedDiv();
+        rendererSearchForm();
+        visibleClearBtn();
+        parentNodeFloat();
+        inputKeyDown();
+        selectChange();
+        createTip();
+        $('[data-toggle="tooltip"]').tooltip({'trigger': 'hover'})
+    }
+
+    // form fixed
+    function parentNodeFloat() {
+        _parentNode_top = _parentNode.offset().top;
+        let height = _parentNode.height();
+        window.onscroll = function () {
+            let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+            if (scrollTop > _parentNode_top) {
+                _form.addClass('fixed-top');
+                _parentNode.height(height);
+            } else {
+                _form.removeClass('fixed-top');
+            }
+        }
+    }
+
+    // add  hide div (on submit form )
+    function addHiedDiv() {
+        _parentNode.append(_form.append(_table));
+        _hidden_div = $('<div></div>');
+        _hidden_div.hide();
+        $("body").append(_hidden_div);
+    }
+
+    // fill table
+    function fillTable() {
+        _table.html('');
+        _table.append(crateClearBtn());
+        _table.append(createPagination());
+        _baseData.condition.forEach(function (conditions, index, arrays) {
+            let tr = $("<tr></tr>");
+            conditions.forEach(function (condition, index, array) {
+                let td = $("<td style='width: 260px'></td>");
+                if ([null, '', undefined].includes(condition.type) && ![null, undefined].includes(condition.name)) {
+                    condition.type = 'input';
+                }
+                if (['dataTime_dataTime', 'input_input'].includes(condition.type)) {
+                    td = $("<td  style='width: 330px'</td>")
+                } else if (['select_multiple_select', 'time', 'dataTime_select'].includes(condition.type)) {
+                    td = $("<td  style='width: 280px'</td>");
+                } else if (['time', 'dataTime_select'].includes(condition.type)) {
+                    td = $("<td  style='width: 320px'</td>");
+                }
+                td.append(createModule(condition));
+                tr.append(td);
+            })
+            _table.append(tr);
+            if (arrays.length === index + 1) {
+                let td = $("<td ></td>");
+                tr.append(td.append(createSearchBt()));
+            }
+
+        })
+        $.cookie.raw = true;
+        $.cookie.json = true;
+        setTableWidth();
+    }
+
+    function setTableWidth() {
+        let max_width = 0;
+        _baseData.condition.forEach(function (conditions, xindex, xarrays) {
+            let _width = 0;
+            conditions.forEach(function (condition, index, array) {
+                if (['input', 'select', 'dataTime', 'input_select'].includes(condition.type)) {
+                    _width += 260;
+                } else if (['dataTime_dataTime', 'input_input'].includes(condition.type)) {
+                    _width += 330;
+                } else if (['select_multiple_select','search_select'].includes(condition.type)) {
+                    _width += 280;
+                } else if (['checkbox'].includes(condition.type)) {
+                    _width += 260;
+                } else if (['time', 'dataTime_select'].includes(condition.type)) {
+                    _width += 320;
+                } else if ([undefined, null, ''].includes(condition)) {
+                    _width += 260;
+                }
+
+                if (index === array.length - 1 && xindex === xarrays.length - 1) {
+                    _width += 260;
+                }
+                if (max_width < _width) {
+                    max_width = _width;
+                }
+            })
+        })
+        _parentNode.css('min-width', 1920 - 30)
+        _parentNode.css('max-width', (max_width || window.screen.availWidth) - 30);
+        _table.css('width', max_width + 'px');
+    }
+
+    // 清空过滤条件按钮
+    function crateClearBtn() {
+        let clearbtn = $("<button type='button' class='btn btn-warning text-dark '>清除过滤条件</button>");
+        clearbtn.click(function () {
+            clearData();
+            visibleClearBtn();
+        })
+        let tr = $("<tr ><td colspan='10'></td></tr>");
+        tr.find('td').append(clearbtn);
+        _clearTr  = tr;
+        return tr;
+    }
+
+    // create SearchBtn
+    function createSearchBt() {
+        _searchBtn = $("<span class='btn btn-sm btn-outline-dark ml-1' >按条件搜索</span>");
+        let div = $("<div class='form-inline'></div>");
+        div.append(_searchBtn);
+        _searchBtn.click(function () {
+            if (controlJsType(_this.searchClick, 'fun')) {
+                _this.searchClick();
+            }
+            if (controlJsType(_this._onsubmit, 'fun')) {
+                _this._onsubmit();
+            }else{
+                _this.onsubmit();
+            }
+        })
+        return div;
+    }
+
+    // create _pagination
+    function createPagination() {
+        _pagination = $("<select id='paginate' name='paginate' class='form-control form-control-sm' style='vertical-align: middle; max-width: 150px;'></select>");
+        let tr = $("<tr ><td colspan='10'><div class='col p-0' style='height: 100%'></div></td></tr>");
+        tr.find('div').append(_pagination);
+        _this.paginations.forEach(function (map) {
+            let option = $("<option value='" + map + "'>每页显示" + map + "</option>");
+            _pagination.append(option);
+        })
+        _pagination.change(function () {
+            let dom = {name: 'paginate', type: 'select', value: _pagination.val(), mold: 'select'};
+            _data['paginate'] = dom;
+            modifyData(dom);
+            _data['paginate'] = dom;
+            _this.onsubmit();
+        })
+        return tr;
+    }
+
+    // create Tip
+    function createTip() {
+        let data = fetchCookie();
+        let search = window.location.search;
+        if (!data || !search) {
+            return;
+        }
+        let cookies = JSON.parse(data);
+        if (!cookies['success_tip']) {
+            return;
+        }
+        if (!cookies['success_tip'] && !!_this.tip) {
+            cookies['success_tip'].value = _this.tip;
+            cookies['success_tip'].count = 1;
+            _data['page'].value = _page;
+            saveCookie(cookies);
+            set_dataOnCookie();
+            _this.onsubmit();
+            // 重定向
+        } else if (!cookies['success_tip'] && cookies['success_tip'].count === 1) {
+            let tip = $("<div class='alert alert-success h1'></div>")
+            let tipdiv = $("<div style='max-width: " + window.screen.availWidth + "px'>" + cookies['success_tip'].value + "</div>").append(tip);
+            _form.append(tipdiv);
+            cookies['success_tip'] = '';
+            saveCookie(cookies);
+        }
+    }
+
+    // 数据清空
+    function clearData() {
+        saveCookie({});
+        let url=_this.url;
+        if (_this.param !== []){
+            url += "?";
+            let i=0;
+            for (let key in _this.param){
+                if (i!==0) url += "&";
+                url += key+"="+_this.param[key];
+                i++;
+            }
+        }
+        window.location.href = url;
+    }
+
+    // 存cookie
+    function saveCookie(data) {
+        $.cookie(getPathname(), data, {expires: 1});
+    }
+
+    // 取cookie
+    function fetchCookie() {
+        return $.cookie(getPathname());
+    }
+
+    // 获取路径
+    function getPathname() {
+        return window.location.pathname;
+    }
+
+    // 获取js对象类型types.call
+    function fetchJsType(JsObj) {
+        let types = Object.prototype.toString;
+        let obj = types.call(JsObj);
+        return (obj === "[object Number]" && 'number')
+            || (obj === "[object Boolean]" && 'boolean')
+            || (obj === "[object String]" && 'string')
+            || (obj === "[object Array]" && 'array')
+            || (obj === "[object Function]" && 'fun')
+            || (obj === "[object Object]" && 'object')
+            || (obj === "[object Null]" && 'null')
+            || (obj === "[object Undefined]" && 'undefined');
+    }
+
+    // 判断js类型
+    function controlJsType(JsObj, type) {
+        if (fetchJsType(type) === 'array') {
+            return type.includes(fetchJsType(JsObj));
+        } else if (fetchJsType(type) === 'string') {
+            return fetchJsType(JsObj) === type;
+        } else {
+            return JsObj === type;
+        }
+    }
+
+    // create Module
+    function createModule(condition) {
+        let type = condition.type;
+        return (['input', '', null].includes(type) && getInput(condition))
+            || (type === "select" && getSelect(condition))
+            || (type === "search_select" && getSearchSelect(condition))
+            || (type === "input_select" && getInputSelect(condition))
+            || (type === "dataTime" && getDataTime(condition))
+            || (type === "time" && getTime(condition))
+            || (type === "input_input" && getInputInput(condition))
+            || (type === "dataTime_dataTime" && getDataTimeDataTime(condition))
+            || (type === "dataTime_select" && getDataTimeSelect(condition))
+            || (type === "select_multiple_select" && getSelectMultipleSelect(condition))
+            || (type === "checkbox" && getCheckBox(condition));
+    }
+
+    // input
+    function getInput(condition) {
+        let input = $("<input name='" + condition.name + "' class='form-control form-control-sm' style='vertical-align: middle; max-width: 200px;' placeholder='" + condition.placeholder + "' autocomplete='off' data-toggle='tooltip' data-placement='top' >");
+        input.attr('title', condition.tip === undefined ? '' : condition.tip);
+        input.on('input', function () {
+            let dom = {name: condition.name, type: 'input', value: this.value, mold: 'input'}
+            modifyData(dom)
+        });
+        return input;
+    }
+
+    // select
+    function getSelect(condition) {
+        let select = $("<select name='" + condition.name + "' class='form-control form-control-sm' style='max-width: 200px;' data-toggle='tooltip' data-placement='top'></select>")
+        select.attr('title', condition.tip === undefined ? '' : condition.tip);
+        let tip = $("<option value class='text-secondary'>" + condition.placeholder + "</option>")
+        select.append(tip);
+        condition.data.forEach(function (map) {
+            let option = $("<option value='" + map.name + "' class='text-secondary'>" + map.value + "</option>")
+            select.append(option);
+        })
+        select.on('change', function () {
+            let dom = {name: condition.name, type: 'select', value: this.value, mold: 'select'}
+            modifyData(dom)
+        })
+        return select;
+    }
+
+    // search_select
+    function getSearchSelect(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let input = $("<input class='form-control form-control-sm'  placeholder='" + condition.placeholder[0] + "'  style='width: 70px;' autocomplete='off' data-toggle='tooltip' data-placement='top'>");
+        input.attr('title', controlJsType(condition.tip[0], 'undefined') ? '输入关键词快速定位下拉列表，回车确定' : condition.tip[0]);
+
+        let select = $("<select class='form-control form-control-sm ml-2' name='" + condition.name + "' style='min-width: 120px;max-width: 150px;' data-toggle='tooltip' data-placement='top' data-toggle='tooltip' data-placement='top'></select>");
+        select.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+
+        let placeholder = '';
+        if (controlJsType(condition.placeholder, 'array') && !['', undefined, null].includes(condition.placeholder[1])) {
+            placeholder = condition.placeholder[1];
+        }
+        fillSelectOption(select, condition.data, placeholder);
+        input.bind('input propertychange', function () {
+            let value = this.value;
+            let data = condition.data.filter(function (map) {
+                return map.value.includes(value);
+            })
+            fillSelectOption(select, data || condition.data);
+            select.val(_data[condition.name].select);
+        })
+        select.change(function () {
+            let dom = {name: condition.name, type: 'input_select', value: this.value, mold: 'select'};
+            modifyData(dom);
+        })
+        return div.append(input).append(select);
+    }
+
+    // input_select
+    function getInputSelect(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let input = $("<input class='form-control form-control-sm' name='" + condition.name[0] + "' placeholder='" + condition.placeholder[0] + "' autocomplete='off' style='max-width: 120px;' data-toggle='tooltip' data-placement='top' >");
+        input.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+        let select = $("<select class='form-control form-control-sm ml-2' name='" + condition.name[1] + "'  style='max-width: 200px;' title='" + condition.tip[1] + "''>");
+        fillSelectOption(select, condition.data);
+        input.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'input_select_longtext', value: this.value, mold: 'input'};
+            modifyData(dom);
+        })
+        select.change(function () {
+            let dom = {name: this.name, type: 'input_select_longtext', value: this.value, mold: 'select'};
+            modifyData(dom);
+        })
+        return div.append(input).append(select);
+    }
+
+    // datTime
+    function getDataTime(condition) {
+        let dataTime = $("<input type='date' class='form-control form-control-sm' name='" + condition.name + "'  style='max-width: 150px' data-toggle='tooltip' data-placement='top' title='" + condition.tip + "' style='width: 200px'>");
+        dataTime.attr('title', controlJsType(condition.tip, 'undefined') ? '' : condition.tip);
+        dataTime.bind('input propertychange', function () {
+            let dom = {name: condition.name, type: 'dataTime', value: this.value, mold: 'dataTime'};
+            modifyData(dom);
+        })
+        return dataTime;
+    }
+
+    // time
+    function getTime(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let dataTime = $("<input type='date' class='form-control form-control-sm' name='" + condition.name + "'  style='width:150px' data-toggle='tooltip' data-placement='top' >");
+        dataTime.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+        let min = $("<input id='" + condition.name + "_min' class='form-control form-control-sm ml-2' style='max-width: 100px;' placeholder='00:00' data-toggle='tooltip' data-placement='top' >");
+        min.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+
+        dataTime.bind('input propertychange', function () {
+            let value = this.value !== '' ? this.value + ' ' + ([null, undefined, ''].includes(min.value) ? '00:00' : min.value) : '';
+            let dom = {name: condition.name, type: 'time', value: value, mold: 'time'};
+            modifyData(dom);
+        })
+        min.bind('input propertychange', function () {
+            verifyTime(this);
+        })
+        min.bind('input propertychange', function () {
+            if (['null', 'undefined', ''].includes(dataTime.val())) {
+                return;
+            }
+
+            let value = ['null', 'undefined', ''].includes(dataTime.val()) ? '' : dataTime.val() + ' ' + min.val();
+            //let value = dataTime.value !== '' ? dataTime.value + ' ' + (min.value === '' ? '00:00' : min. value) : '';
+            let dom = {name: condition.name, type: 'time', value: value, mold: 'time'};
+            modifyData(dom);
+        })
+        return div.append(dataTime).append(min);
+    }
+
+    // input_input
+    function getInputInput(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let input1 = $("<input name='" + condition.name[0] + "' class='form-control form-control-sm' style='vertical-align: middle; max-width: 150px;' placeholder='" + condition.placeholder[0] + "' data-toggle='tooltip' data-placement='top' title='" + condition.tip[0] + "'>");
+        input1.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+        let input2 = $("<input name='" + condition.name[1] + "' class='form-control form-control-sm ml-2' style='vertical-align: middle; max-width: 150px;' placeholder='" + condition.placeholder[1] + "' data-toggle='tooltip' data-placement='top' title='" + condition.tip[1] + "'>");
+        input2.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+
+        input1.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'input_input', value: this.value, mold: 'input'};
+            modifyData(dom);
+        })
+        input2.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'input_input', value: this.value, mold: 'input'};
+            modifyData(dom);
+        })
+        return div.append(input1).append(input2);
+    }
+
+    // dataTime_dataTime
+    function getDataTimeDataTime(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let dataTime1 = $("<input type='date' class='form-control form-control-sm' name='" + condition.name[0] + "'  style='width: 150px' data-toggle='tooltip' data-placement='top' >");
+        dataTime1.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+
+        let dataTime2 = $("<input type='date' class='form-control form-control-sm ml-2' name='" + condition.name[1] + "'  style='width: 150px;' data-toggle='tooltip' data-placement='top' >");
+        dataTime2.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+
+        dataTime1.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'dataTime_dataTime', value: this.value, mold: 'dataTime'};
+            modifyData(dom);
+        })
+        dataTime2.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'dataTime_dataTime', value: this.value, mold: 'dataTime'};
+            modifyData(dom);
+        })
+        return div.append(dataTime1).append(dataTime2);
+    }
+
+    // dataTime_select
+    function getDataTimeSelect(condition) {
+        let div = $("<div class='form-inline'></div>");
+        let dataTime = $("<input type='date' class='form-control form-control-sm' name='" + condition.name[0] + "'  style='max-width: 150px;' data-toggle='tooltip' data-placement='top' >");
+        dataTime.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+
+        let select = $("<select name='" + condition.name[1] + "' class='form-control form-control-sm ml-2' data-toggle='tooltip' data-placement='top' style='max-width: 100px'></select>");
+        select.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+
+        fillSelectOption(select, condition.data)
+        dataTime.bind('input propertychange', function () {
+            let dom = {name: this.name, type: 'dataTime_select', value: this.value, mold: 'dataTime'};
+            modifyData(dom);
+        })
+        select.change(function () {
+            let dom = {name: this.name, type: 'dataTime_select', value: this.value, mold: 'select'};
+            modifyData(dom);
+        })
+        return div.append(dataTime).append(select);
+    }
+
+    // select_multiple_select
+    function getSelectMultipleSelect(condition) {
+        let div = $("<div class='form-inline' style='position: relative'></div>");
+        let select = $("<select class='form-control form-control-sm' name='" + condition.name + "_sel'  id='" + condition.name + "_sel' style='vertical-align: middle; width: 100px;' data-toggle='tooltip' data-placement='top'  ></select>");
+        let label = $("<label id='" + condition.name + "_lab' style='vertical-align: middle; width: 100px'  >(多选)</label>").hide();
+        let select_div = $("<div ></div>");
+        select.attr('title', controlJsType(condition.tip[0], 'undefined') ? '' : condition.tip[0]);
+        let placeholder = controlJsType(condition.placeholder[0], 'undefined') ? '' : condition.placeholder[0];
+
+        fillSelectOption(select, condition.data, placeholder);
+        let input = $("<input name='" + condition.name + "_tip' class='form-control form-control-sm ml-2' style='max-width: 150px' data-toggle='tooltip' data-placement='top'>");
+
+        input.attr('title', controlJsType(condition.tip[1], 'undefined') ? '' : condition.tip[1]);
+        input.attr('placeholder', controlJsType(condition.placeholder[1], 'undefined') ? '' : condition.placeholder[1])
+
+        let ul_div = $("<div class='pl-0' style='position: absolute;left: 100px;top:25px; max-height: 150px; overflow-y: scroll; border: 1px solid rgb(221, 221, 221); border-radius: 5px; text-align: center; transform: scale(0.9);z-index:1' tabindex='1'></div>");
+        let ul = $("<ul name='" + condition.name + "' class='list-group pl-0 m-0 p-0 bg-white' style='list-style-type: none;width: 150px;top:35px; z-index: 100' ></ul>");
+
+        select_div.append(input).append(ul_div.append(ul));
+        div.append(select).append(label).append(select_div);
+
+        fillMultipleSelectOption(ul, condition.data, condition.name);
+
+        input.bind('input propertychange', function () {
+            let value = this.value;
+            if (value === '') {
+                fillMultipleSelectOption(ul, _data[condition.name].data, condition.name);
+                redenerUl(ul);
+                return;
+            }
+            let select = _data[condition.name].select;
+            if ([undefined, null, ''].includes(select)) {
+                select = [];
+            }
+            let select_data = _data[condition.name].data.filter(function (map) {
+                return map.value.includes(value) || select.includes(map.name);
+            })
+
+            fillMultipleSelectOption(ul, select_data, condition.name);
+            redenerUl(ul);
+        })
+
+        select.change(function () {
+            let dom = {
+                name: condition.name,
+                type: 'select_multiple_select',
+                value: [this.value]
+            }
+            modifyData(dom);
+            redenerUl(ul);
+        })
+        input.focus(function () {
+            ul_div.show();
+        })
+        input.blur(function () {
+            setTimeout(function () {
+                if (!select_div.is(':focus')) {
+                    ul_div.hide();
+                }
+            }, 1000);
+        })
+        select_div.focus(function () {
+            ul_div.show();
+        })
+        select_div.blur(function () {
+            ul_div.hide();
+        })
+        ul_div.blur(function () {
+            ul_div.hide();
+        })
+        ul_div.hide();
+        return div;
+    }
+
+    // checkbox
+    function getCheckBox(condition) {
+        let div1 = $("<div class='form-inline'></div>")
+        condition.data.forEach(function (map, index) {
+            let div = $('<div class="custom-control custom-control-inline custom-checkbox"></div>');
+            let checkbox = $("<input type='checkbox' name='" + condition.name + "' class='custom-control-input' id='" + condition.name + index + "' value='" + map.name + "' >");
+            let label = $("<label class='custom-control-label text-left font-weight-norma' for='" + condition.name + index + "'>" + map.value + "</label>")
+            div1.append(div.append(checkbox).append(label));
+            checkbox.click(function () {
+                let value = [];
+                $.each($("input:checkbox[name='" + condition.name + "']:checked"), function () {
+                    value.push($(this).val());
+                })
+                let dom = {name: condition.name, type: 'checkbox', value: value, mold: 'check'};
+                modifyData(dom);
+            });
+        })
+        return div1;
+    }
+
+    // fill select
+    function fillSelectOption(select, data, placeholder = '') {
+        select.html('');
+        if (![undefined, null].includes(placeholder)) {
+            let option = $("<option value></option>");
+            if ('' === placeholder) {
+                option = $("<option value>" + '全部' + placeholder + "</option>");
+            } else {
+                option = $("<option value>" + placeholder + "</option>");
+            }
+            select.append(option);
+        }
+        data.forEach(function (map) {
+            let option = $("<option value='" + map.name + "'>" + map.value + "</optio>");
+            select.append(option);
+        })
+        if (data !== undefined) {
+        }
+    }
+
+    // fill multiple select ul
+    function fillMultipleSelectOption(ul, data, name) {
+        ul.html('');
+        data.forEach(function (map) {
+            let span = $("<span  style='cursor:default'>" + map.value + "</span>");
+            let li = $("<li class='list-group-item pt-0 pb-0' value='" + map.name + "'></li>");
+            li.append(span);
+            ul.append(li);
+            li.click(function () {
+                let value = li.attr('value');
+                let dom_data = _data[name].value;
+                if (controlJsType(dom_data, ['undefined', 'null', 'string'])) {
+                    dom_data = [dom_data];
+                }
+                if (dom_data.includes(value)) {
+                    dom_data.splice(dom_data.indexOf(value), 1);
+                } else {
+                    dom_data.push(value);
+                    dom_data = arrDuplicate(dom_data);
+                }
+                let dom = {
+                    name: ul.attr('name'),
+                    type: 'select_multiple_select',
+                    value: dom_data,
+                    select: dom_data,
+                    mold: 'select_multiple_select'
+                };
+                modifyData(dom);
+                redenerUl(ul);
+                isMultiple(name);
+                _this.onsubmit();
+            })
+        })
+    }
+
+    function isMultiple(name) {
+        let label = $('#' + name + '_lab');
+        let select = $('#' + name + '_sel');
+        let dom_data = _data[name].value;
+
+        if (dom_data.length === 1 ) {
+            select.show();
+            select.val(dom_data[0]);
+            label.hide();
+        }else if(controlJsType(dom_data,'string')){
+            select.show();
+            select.val(dom_data);
+            label.hide();
+        } else if (dom_data.length >= 2) {
+            select.hide();
+            label.show();
+        }
+    }
+
+    // modify _data
+    function modifyData(dom) {
+        _data[dom.name].mold = dom.mold;
+        _data[dom.name].value = dom.value;
+        _data[dom.name].select = dom.value;
+        redenerSearchFormOnData(dom.name, dom.value, dom.mold);
+    }
+
+    // save search on cookie
+    function saveSearchOnCookie() {
+        let saveData = {};
+        for (const key in _data) {
+            if (!['', null, undefined].includes(_data[key].value)) {
+                if (controlJsType(_data[key].value, 'array') && _data[key].value.length === 0) {
+                    //console.log(key);
+                    continue;
+                }
+                saveData[key] = {
+                    value: _data[key].value,
+                    mold: _data[key].mold,
+                }
+            }
+        }
+        if (!_this.page) {
+            saveData['page'] = _this.page;
+        }
+        saveCookie(saveData);
+    }
+
+    // hour_minute
+    function verifyTime(time) {
+        setTimeout(function () {
+            time.value = time.value.replace('：', ':');
+            time.value = time.value.replace(/[a-zA-Z]/, '');
+            time.value = time.value.replace(/[^\d^\:]/, '');
+            time.value = time.value.replace(/\:\:/, ':');
+            time.value = time.value.replace(/^([\d]{1})([\s]{1})/, "$1:");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})([\s]{1})/, "$1$2:");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})([\d]{1})/, "$1$2:$3");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})([\d]{1})([\d]{1})(.*?)/, "$1$2$3$4");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})([\d]{1})([\d]{1})/, "$1$2:$3$4");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1}):([\d]{1})([\d]{1})([\s\S]{1})/, "$1$2:$3$4");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1}):([\D]{1,99})/, "$1$2:");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})([\d]{1})\./, "$1:$2$3");
+            time.value = time.value.replace(/^([\d]{1})\.([\d]{1})([\d]{1})/, "$1:$2$3");
+            time.value = time.value.replace(/^([\d]{1})([\d]{2})([\S\s]{1,99})/, "$1$2:$3");
+            time.value = time.value.replace(/^([\d]{1}):([\d]{2})([\S\s]{1,99})/, "$1:$2");
+            time.value = time.value.replace(/^([\d])/, "$1");
+            time.value = time.value.replace(/^([1])([\d]{1})/, "$1$2");
+            time.value = time.value.replace(/^([3-9])([\d]{1})/, "2$2");
+            time.value = time.value.replace(/^([2-9]{1})([4-9]{1})/, "$13");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1}):([6-9]{1})/, "$1$2:5");
+            time.value = time.value.replace(/^([\d]{1})([\d]{1})$/, "$1$2:");
+        }, 10);
+    }
+
+    // array duplicate
+    function arrDuplicate(arr) {
+        let res = [];
+        let obj = {};
+        for (let i = 0; i < arr.length; i++) {
+            if ([undefined, null, ''].includes(arr[i])) {
+                continue;
+            }
+            if (!obj[arr[i]]) {
+                obj[arr[i]] = 1;
+                res.push(arr[i]);
+            }
+        }
+        return res;
+    }
+
+    // get search data
+    function getSearchData(type = 'array') {
+        let data = {};
+        if (type === 'array') {
+            for (let key in _data) {
+                if (_data[key].value !== undefined && _data[key].value !== '') {
+                    data[key] = _data[key].value
+                }
+            }
+        } else if (type === 'string') {
+            data = '';
+            for (let key in _data) {
+                if (![undefined, null, ''].includes(_data[key].value)) {
+                    let value = _data[key].value;
+                    if (controlJsType(value, 'string')) {
+                        data = data + "&" + key + "=" + value;
+                    } else if (controlJsType(value, 'array')) {
+                        value.forEach(function (val) {
+                            data = data + "&" + key + "=" + val;
+                        });
+                    }
+                }
+            }
+        }
+        return data;
+    }
+
+    // renderer input
+    function rendererSearchFormOnInput(key, value, mold) {
+        if ([undefined, null, ''].includes(value)) {
+            $(_form).find("input[name='" + key + "']").val('');
+            $(_form).find("input[name='" + key + "']").removeClass('bg-warning');
+        } else {
+            $(_form).find("input[name='" + key + "']").val(value);
+            $(_form).find("input[name='" + key + "']").addClass('bg-warning');
+        }
+    }
+
+    // renderer select
+    function rendererSearchFormOnSelect(key, value, mold) {
+        if ([undefined, null, ''].includes(value)) {
+            $(_form).find("select[name='" + key + "']").val('').removeClass('bg-warning');
+            if (key === 'paginate') {
+                $(_form).find("select[name='" + key + "']").val(_this.paginations[0]).removeClass('bg-warning');
+            }
+        } else {
+            $(_form).find("select[name='" + key + "']").val(value);
+            //console.log(value === _this.paginations[0]);
+            if (key === 'paginate' && value == _this.paginations[0]) {
+                return;
+            }
+            $(_form).find("select[name='" + key + "']").addClass('bg-warning');
+        }
+    }
+
+    // renderer check
+    function rendererSearchFormOnCheck(key, value, mold) {
+        if ([undefined, null, ''].includes(value)) {
+            $(_form).find("input[name='" + key + "']").prop("checked", false).removeClass('bg-warning');
+        } else {
+            if (controlJsType(value, 'array')) {
+                value.forEach(function (_value) {
+                    $(_form).find("input[name='" + key + "'][value='" + _value + "']").prop("checked", true).addClass('bg-warning');
+                })
+            } else if (controlJsType(value, 'string')) {
+                $(_form).find("input[name='" + key + "'][value='" + value + "']").prop("checked", true).addClass('bg-warning');
+            }
+        }
+    }
+
+    // redener multiple select     input
+    function rendererSearchFormOnMultipleSelect(key, value, mold) {
+        let ul = $(_form).find("ul[name='" + key + "']");
+        if ([undefined, null, ''].includes(value) || (controlJsType(value, 'array') && value.length === 0)) {
+            $(_form).find("input[name='" + key + "_tip']").removeClass('bg-warning');
+            ul.addClass('bg-warning');
+        } else if (!!value) {
+            $(_form).find("input[name='" + key + "_tip']").addClass('bg-warning');
+            ul.addClass('bg-warning');
+        } else if (controlJsType(value, 'array') && value.length >= 1) {
+            $(_form).find("input[name='" + key + "_tip']").addClass('bg-warning');
+            ul.addClass('bg-warning');
+        }
+        redenerUl(ul);
+    }
+
+    // redener multiple select     ul
+    function redenerUl(ul) {
+        let name = ul.attr('name');
+        let select = _data[name].select;
+        if ([null, undefined].includes(select)) {
+            _data[name].select = [];
+            select = [];
+        }
+        let lis = ul.find('li');
+        if ([null, undefined, ''].includes(lis)) {
+            return;
+        } else {
+            lis.get().forEach(function (dom) {
+                if (select.includes($(dom).attr('value'))) {
+                    dom.style.backgroundColor = "#4AA0E6";
+                    $(dom).addClass('active');
+                } else {
+                    dom.style.backgroundColor = "#FFFFFF";
+                    $(dom).removeClass('active');
+                }
+            })
+            isMultiple(name);
+        }
+    }
+
+    function rendererSearchFormOnTime(key, value, mold) {
+        if ([undefined, null, ''].includes(value)) {
+            $(_form).find("input[name='+key+']").val(value.substring(0, 10)).addClass('bg-warning');
+            if (value.length > 11 + 5) {
+                $(_form).find("input[name='" + key + "_tim']").val(value.substring(11, 5));
+            }
+        } else {
+            $(_form).find("input[name='+key+']").val("").removeClass('bg-warning');
+            $(_form).find("input[name='" + key + "_tim']").val("");
+        }
+    }
+
+    function visibleClearBtn() {
+        let bool = false;
+        for (const key in _data) {
+            if (key === 'paginate') {
+                if ((key === 'paginate' && _data[key].value !== _this.paginations[0])) {
+                    bool = true;
+                }
+            } else {
+                if (![undefined, null, ''].includes(_data[key].value)) {
+                    bool = true;
+                }
+            }
+        }
+        if (bool) {
+            _clearTr.show();
+
+        } else {
+            _clearTr.hide();
+        }
+    }
+
+    function inputKeyDown() {
+        $(_form).find('input').keydown(function (e) {
+            if (e.keyCode === 13) {
+                if (_this.keydownSearch) {
+                    _this.onsubmit()
+                }
+                if (controlJsType(_this.keydownfun, 'fun')) {
+                    _this.keydownfun();
+                }
+            }
+        });
+
+        $(_form).find("input[type='date']").change(function (e) {
+            if (_this.keydownSearch) {
+                _this.onsubmit()
+            }
+            if (controlJsType(_this.keydownfun, 'fun')) {
+                _this.keydownfun();
+            }
+        });
+    }
+
+    function selectChange() {
+        $(_form).find('select').change(function () {
+            _this.onsubmit();
+        })
+    }
+
+    function redenerSearchFormOnData(key, value, mold) {
+        if (mold === 'input') {
+            rendererSearchFormOnInput(key, value, mold);
+        } else if (mold === 'select') {
+            rendererSearchFormOnSelect(key, value, mold);
+        } else if (mold === 'check') {
+            rendererSearchFormOnCheck(key, value, mold);
+        } else if (mold === 'select_multiple_select') {
+            rendererSearchFormOnMultipleSelect(key, value, mold);
+        } else if (mold === 'time') {
+            rendererSearchFormOnTime(key, value, mold);
+        }
+    }
+
+    // 数据转换
+    function switchData() {
+        _this.condition.forEach(function (conditions) {
+            conditions.forEach(function (condition) {
+                if (['input', 'select', 'dataTime', 'search_select', 'time', 'select_multiple_select','checkbox'].includes(condition.type)) {
+                    if (!condition.select) {
+                        condition.select = '';
+                    }
+                    let data = {
+                        name: condition.name,
+                        type: condition.type,
+                        value: condition.value,
+                        select: condition.select,
+                        mold: ['input', 'dataTime'].includes(condition.type) ? 'input' : condition.type
+                    }
+                    if (condition.type === 'search_select') {
+                        data.mold = 'select';
+                    }
+                    _data[condition.name] = data;
+                } else if (['dataTime_dataTime', 'input_input', 'input_select', 'dataTime_select'].includes(condition.type)) {
+                    let types = condition.type.split("_");
+                    if (!condition.select) {
+                        condition.select = ['', ''];
+                    }
+                    if (!condition.value) {
+                        condition.value = ['', ''];
+                    }
+                    condition.name.forEach(function (_name, index) {
+                        let data = {
+                            name: _name,
+                            type: types[index],
+                            value: condition.value[index],
+                            select: condition.select[index],
+                            mold: ['input', 'dataTime'].includes(types[index]) ? 'input' : types[index]
+                        }
+                        _data[_name] = data;
+                    })
+                }
+            })
+        })
+    }
+
+    // redererSearchForm on cookie
+    function rendererSearchForm() {
+        let url = document.referrer;
+        let partt = /(Edit\/)|(\/eidt)|(eidt\/)/i;
+        if (url.search(partt) > 0) {
+            rendererOptionOnCookie();
+        } else {
+            rendererOptionOnUrl();
+        }
+    }
+
+    function rendererOptionOnCookie() {
+        //console.log('rendererSearchFromOnCookie');
+        let data = fetchCookie();
+        if (data === undefined) {
+            return;
+        }
+        data = JSON.parse(data);
+        for (let key in data) {
+            _data[key].value = data[key].value;
+            _data[key].mold = data[key].mold;
+            _data[key].select = data[key].select;
+        }
+        rendererSearchFormOn_data();
+    }
+
+    function rendererOptionOnUrl() {
+        if (!window.location.search) {
+            return;
+        }
+        searchOptionToUrlsearch();
+        rendererSearchFormOn_data();
+    }
+
+    function rendererSearchFormOn_data() {
+        // console.log('rendererSearchFormOn_data', _data);
+
+        for (let key in _data) {
+            let value = _data[key].value, type = _data[key].type, mold = _data[key].mold;
+            _data[key].select = value;
+
+            if (['input', 'dataTime'].includes(mold)) {
+                rendererSearchFormOnInput(key, value, mold);
+            } else if (['select'].includes(mold)) {
+                rendererSearchFormOnSelect(key, value, mold);
+            } else if (['checkbox'].includes(mold)) {
+                rendererSearchFormOnCheck(key, value, mold);
+            } else if (['select_multiple_select'].includes(mold)) {
+                if (controlJsType(value, ['array', 'string'])) {
+                    let ul = $(_form).find("ul[name='" + key + "']");
+                    redenerUl(ul);
+                    rendererSearchFormOnMultipleSelect(key, value, mold);
+                }
+            } else if (['time'].includes(type) && value !== undefined) {
+                $(_form).find("input[name='" + key + "']").val(value.substr(0, 10));
+                $(_form).find("input[id='" + key + "_min']").val(value.substr(11, value.length));
+            }
+
+            /*  if (['input', 'dataTime', 'input_input', 'dataTime_dataTime'].includes(type)) {
+                  rendererSearchFormOnInput(key,value,mold);
+              } else if (['select', 'input_select', 'dataTime_select'].includes(type)) {
+                  if (mold === 'select') {
+                      rendererSearchFormOnSelect(key,value,mold)
+                  } else if (mold === 'input') {
+                      rendererSearchFormOnInput(key,value,mold);
+                  } else if (mold === 'dataTime') {
+                      rendererSearchFormOnInput(key,value,mold);
+                  }
+              } else if (['input_select_text'].includes(type)) {
+                  if (mold === 'input') {
+                      rendererSearchFormOnInput(key,value,mold);
+                  } else if (mold === 'select') {
+                      rendererSearchFormOnSelect(key,value,mold)
+                  }
+              } else if (['checkbox'].includes(type)) {
+                  if (controlJsType(value, 'array')) {
+                      value.forEach(function (map) {
+                          $(_form).find("input[type='checkbox'][name='" + key + "'][value='" + map + "']").attr("checked", true);
+                      })
+                  }
+              } else if (['select_multiple_select'].includes(type)) {
+                  if (controlJsType(value, ['array','string']) ) {
+                      let ul = $(_form).find("ul[name='" + key + "']");
+                      redenerUl(ul);
+                      rendererSearchFormOnMultipleSelect(key,value,mold);
+                  }
+              } else if (['time'].includes(type) && value !== undefined) {
+                  $(_form).find("input[name='"+key+"']").val(value.substr(0,10));
+                  $(_form).find("input[id='"+key+"_min']").val(value.substr(11,value.length));
+              }*/
+        }
+        if ([undefined, null, ''].includes(data['paginate'])) {
+            return;
+        }
+        if ([undefined, null, ''].includes(data['paginate'].value)) {
+            $(_form).find("select[name='paginate']").val(_this.paginations[0]);
+        } else {
+            $(_form).find("select[name='paginate']").val(data['paginate'].value);
+        }
+    }
+
+    // url path on search form option  renderer
+    function searchOptionToUrlsearch() {
+        let data = window.location.search;
+        data = decodeURIComponent(data);
+        if (!!data) {
+            data = (data.substr(1)).split('&');
+            data = convertArrayToObj(data);
+            for (const key in data) {
+                if(!data[key] || _this.param[key]){
+                    continue;
+                }
+                if (key === 'paginate') {
+                    _data[key] = {
+                        name: key,
+                        value: data[key],
+                        type: 'select',
+                        mold: 'select'
+                    }
+                } else if (key === 'page') {
+                    _page = data[key];
+                } else {
+                    _data[key].value = data[key];
+                }
+                // console.log('key', key, typeof key);
+            }
+        }
+    }
+
+    // cookie -> data
+    function set_dataOnCookie() {
+        let data = fetchCookie();
+        data = JSON.parse(data);
+        if (!data) {
+            return;
+        }
+        for (const key in data) {
+            if (!!data[key]) {
+                _data[key].value = data[key].value;
+            }
+        }
+    }
+
+    // array - > object
+    function convertArrayToObj(arr) {
+        if (!arr || !controlJsType(arr, 'array')) {
+            return {};
+        } else if (controlJsType(arr, 'array') && arr.length > 0) {
+            let data = {};
+            arr.forEach(function (map) {
+                let arr = map.split('='), key = arr[0], value = arr[1];
+                if (!data[key]) {
+                    data[key] = value;
+                } else {
+                    if (controlJsType(data[key], 'string')) {
+                        data[key] = [data[key], value];
+                    } else if (controlJsType(data[key], 'array')) {
+                        data[key].push(value);
+                    }
+                }
+            })
+            return data;
+        }
+    }
+
+    //  paginate
+    function pervPage() {
+        let obj = getSearchData();
+        _page = getPage();
+        if(!obj['paginate']){
+            obj['paginate'] = 50;
+        }
+        if(Number(_page)>1){
+            _page= Number(_page)-1;
+        }else{
+            _page = 1;
+        }
+        return getSearchUri(obj);
+    }
+
+    function nextPage() {
+        let obj = getSearchData();
+        _page = getPage();
+        if(!_page){_page=1;}
+        if(_page){
+            _page = Number(_page)+ 1;
+        }
+        if(!obj['paginate']){
+            obj['paginate'] = 50;
+        }
+        return getSearchUri(obj);
+    }
+
+    function goPage(page){
+        let obj = getSearchData();
+        _page = page;
+        return getSearchUri(obj);
+    }
+
+    function getSearchObj() {
+        let data = window.location.search;
+        data = decodeURIComponent(data);
+        if(!data){
+            return {};
+        }
+        let saveData = {};
+        data = data.substr(1).split('&');
+        data.forEach(function (map) {
+            let arr = map.split('='),key = arr[0],value = arr[1];
+            if(!!value){
+                if (!saveData[key]) {
+                    saveData[key] = value;
+                } else {
+                    if (controlJsType(data[key], 'string')) {
+                        saveData[key] = [saveData[key] , value];
+                    } else if (controlJsType(data[key], 'array')) {
+                        saveData[key].push(value);
+                    }
+                }
+            }
+        })
+        return saveData;
+    }
+
+    function getPage(){
+       return  getSearchObj()['page'];
+    }
+
+    function getSearchUri(obj){
+        let string = "?";
+        let param = _this.param;
+        for (const key in param) {
+            if(controlJsType(param[key],['string','number'])){
+                string+= key + "=" + param[key]+'&';
+            }else if( controlJsType(param[key],'array')&&param[key].length > 0){
+                param[key].forEach(function(value){
+                    string+=key + "=" + value+'&';
+                })
+            }
+        }
+        for (const key in obj) {
+            if(controlJsType(obj[key],['string','number'])){
+                string+= key + "=" + obj[key]+'&';
+            }else if( controlJsType(obj[key],'array')&&obj[key].length > 0){
+                obj[key].forEach(function(value){
+                    string+=key + "=" + value+'&';
+                })
+            }
+        }
+        if(_page){
+            string+='page='+_page;
+        }
+        return window.location.pathname +string;
+    }
+
+};

resources/views/order/menu.blade.php

@@ -4,7 +4,11 @@
         <ul class="nav nav-pills">
             @can('订单管理-查询')
             <li class="nav-item">
-                <a class="nav-link" href="{{url('order/index/delivering')}}" :class="{active:isActive('index',2)}">订单</a>
+                <a class="nav-link" href="{{url('order/index/delivering')}}" :class="{active:isActive('delivering',3)}">订单</a>
+            </li> @endcan
+            @can('订单管理-波次-查询')
+                <li class="nav-item">
+                    <a class="nav-link" href="{{url('wave/index/')}}" :class="{active:isActive('wave',1)}">新建波次</a>
             </li> @endcan
         </ul>
     </div>

resources/views/order/wave/menu.blade.php

@@ -0,0 +1,14 @@
+<div id="nav2">
+    @component('order.menu')
+    @endcomponent
+    <div class="container-fluid nav3">
+        <div class="card menu-third" >
+            <ul class="nav nav-pills">
+                @can('订单管理-波次-查询')
+                    <li class="nav-item">
+                        <a class="nav-link text-dark" href="{{url('wave/index/')}}" :class="{active:isActive('wave',1)}">查询</a>
+                    </li> @endcan
+            </ul>
+        </div>
+    </div>
+</div>

resources/views/order/wave/search.blade.php

@@ -0,0 +1,188 @@
+@extends('layouts.app')
+
+@section("content")
+    @component("order.wave.menu")@endcomponent
+    <div class="container-fluid" id="wave_div">
+        <div style="min-width: 2000px;">
+
+
+            <div id="form_div" style="min-width: 1950px;" class="bg-white"></div>
+
+            <table class="table table-sm table-striped table-bordered table-hover card-body mt-2 ">
+                <tr></tr>
+                <tr>
+                    <td colspan="20">
+                        <button type="button" class="btn btn-outline-dark btn-sm form-control-sm dropdown-toggle tooltipTarget" :class="[checkData.length>0?'btn-dark text-light':'']"
+                                data-toggle="dropdown" title="导出所有页将会以搜索条件得到的过滤结果，将其全部记录（每一页）导出">
+                            导出Excel
+                        </button>
+                        <div class="dropdown-menu">
+                            <a class="dropdown-item" href="javascript:">导出勾选内容</a>
+                            <a class="dropdown-item" href="javascript:">导出所有页</a>
+                        </div>
+
+                        <button type="button" class="btn btn-sm tooltipTarget btn-outline-dark" @click="batchCancelPrint">取消打印标记</button>
+                    </td>
+                </tr>
+
+                <tr class="text-nowrap">
+                    <th>
+                        <label for="all">
+                            <input type="checkbox" id="all" @click="checkAll($event)"/>
+                        </label>
+                    </th>
+                    <th>序号</th>
+                    <th>波次号</th>
+                    <th>波次状态</th>
+                    <th>波次规则</th>
+                    <th>波次描述</th>
+                    <th>承运人</th>
+                    <th>操作员</th>
+                    <th>创建时间</th>
+                    <th>拣货单打印人</th>
+                    <th>拣货单打印于</th>
+                    <th>快递单打印人</th>
+                    <th>快递单打印于</th>
+                    @can("订单管理-波次-取消打印标记")
+                        <th>取消打印</th>
+                    @endcan
+                </tr>
+
+                <tr v-for="(wave,i) in waves">
+                    <td>
+                        <input class="checkItem" type="checkbox" :value="wave.waveNo" v-model="checkData">
+
+                    </td>
+                    <td>@{{ i+1 }}</td>{{--序号--}}
+                    <td class="text-dark font-weight-bold text-nowrap">@{{ wave.waveNo }}</td>{{--波次号--}}
+                    <td class="text-muted text-nowrap">@{{ wave.codename_c }}</td>{{--波次状态--}}
+                    <td class="text-nowrap text-muted">@{{ wave.waveRule }}</td>{{--波次规则--}}
+                    <td class="text-nowrap">@{{ wave.descr }}</td>{{--波次描述--}}
+                    <td class="text-muted">@{{ wave.descr_c }}</td>{{--承运人--}}
+                    <td class="text-nowrap">@{{ wave.addWho }}</td>{{--操作员--}}
+                    <td class="text-muted">@{{ wave.addTime }}</td>{{--创建时间--}}
+                    <td class="text-nowrap">@{{ wave.pickerPrint }}</td>{{--拣货单打印人--}}
+                    <td class="text-muted">@{{ wave.pickerPrintTime }}</td>{{--拣货单打印时间--}}
+                    <td class="text-nowrap">@{{ wave.expressPrinting }}</td>{{--快递单号打印人--}}
+                    <td class="text-muted">@{{ wave.expressPrintTime }}</td>{{--快递单号打时间--}}
+                    @can("订单管理-波次-取消打印标记")
+                    <td class="text-center">
+                        <button v-if="wave.waveStatus != '99' && wave.UdfPrintFlag2 === 'Y' " type="button" class="btn btn-sm btn-outline-dark text-nowrap" :data-value="wave.waveNo" @click="singleCancelPrint($event)">取消</button>
+                    </td>
+                    @endcan
+                </tr>
+            </table>
+            <button type="button" class="btn btn-sm " @click="pervPage" :class="'{{$param['currPage']}}'> 1? 'btn-outline-info ':'disabled'" {{--disabled="'{{$param['currPage']}}'> 1?'':true"--}}>上一页</button>
+            <button type="button" class="btn btn-sm " @click="nextPage" :class="'{{$param['currPage']}}'<'{{$param['pageTotal']}}'? 'btn-outline-info':'disabled'"  @if({{$param['currPage']}} < {{$param['pageTotal']}}) @endif>下一页</button>
+            <input @keyup.enter="pageTurning($event)" class="form-control-sm ml-3 tooltipTarget"
+                   :placeholder="'当前页数：'+'{{$param['currPage']}}'+'/'+'{{$param['pageTotal']}}'" title="去往指定页">
+            <span class="text-muted m-1">共 {{$param['count']}} 条 </span>
+        </div>
+    </div>
+@endsection
+
+@section("lastScript")
+    <script type="text/javascript" src="{{asset('js/queryForm/queryForm.js')}}"></script>
+    <script>
+        let vueList = new Vue({
+            el: "#wave_div",
+            data: {
+                waves: [
+                        @foreach($waves as $wave)
+                    {
+                        waveNo: '{{$wave->waveno}}',
+                        waveStatus: '{{$wave->wavestatus}}',
+                        codename_c: '{{$wave->codename_c}}',
+                        descr: '{{$wave->descr}}',
+                        descr_c: '{{$wave->descr_c}}',
+                        addTime: '{{$wave->addtime}}',
+                        addWho: '{{$wave->addwho}}',
+                        waveRule: '{{$wave->waverule}}',
+                        waveDispatchId: '{{$wave->wavedispatchid}}',
+                        userDefine1: '{{$wave->userdefine1}}',
+                        userDefine2: '{{$wave->userdefine2}}',
+                        pickerPrint: '{{$wave->pickerPrint}}',
+                        pickerPrintTime: '{{$wave->pickerPrintTime}}',
+                        expressPrinting: '{{$wave->expressPrinting}}',
+                        expressPrintTime: '{{$wave->expressPrintTime}}',
+                        UdfPrintFlag2:'{{$wave->udfprintflag2}}'
+                    },
+                    @endforeach
+                ],
+                form: '',
+                checkData: [],
+
+
+            },
+            mounted: function () {
+
+                let data = [[
+                    {name: 'start_time', type: 'dataTime', tip: '选择显示指定日期的起始时间', placeholder: ''},
+                    {name: 'end_time', type: 'dataTime', tip: '选择显示指定日期的结束时间', placeholder: ''},
+                    {name: 'wave_num', type: 'input', tip: '波次编号：支持模糊搜索，回车提交', placeholder: ''},
+                    // {name:'wave_status',type:'select',tip:'',placeholder:'',data:[]},
+                ]];
+                this.form = new query({
+                    el: '#form_div',
+                    condition: data,
+                })
+                this.form.init();
+                $(".tooltipTarget").tooltip({'trigger': 'hover'});
+            },
+            methods: {
+                singleCancelPrint: function ($event) {
+                    let ids = $($event.target).attr("data-value");
+                    if (ids) {
+                        this.cancelPrint(ids);
+                    }
+                },
+                batchCancelPrint: function () {
+                    let ids = this.checkData;
+                    if (ids.length === 0) {
+                        tempTip.show('没有勾选记录');
+                        return;
+                    }
+                    this.cancelPrint(ids);
+                },
+                cancelPrint: function (ids, type = 'string') {
+                    let _this = this;
+                    axios.post("{{url("wave/cancelPrinting")}}", {ids: ids}).then(function (res) {
+                        if (res.data.success) {
+                            _this.waves.forEach(function (wave) {
+                                if (ids.includes(wave.waveNo)) {
+                                    wave.expressPicking = '';
+                                    wave.expressPickTime = '';
+                                }
+                            })
+                            tempTip.setDuration(3000);
+                            tempTip.showSuccess('取消打印成功！');
+                            if (type === 'array') {
+                                _this.checkData = [];
+                            }
+                        } else {
+                            tempTip.setDuration(2500);
+                            tempTip.show('标记勾选内容取消打印失败，错误：' + response.data.fail_info);
+                        }
+                    }).catch(function (err) {
+                        tempTip.setDuration(4000);
+                        tempTip.show('网络错误：' + err);
+                    });
+                    console.log(this.waves);
+                },
+                pageTurning: function (event) {
+                    let page = $(event.target).val();
+                    if (!page) {
+                        return;
+                    }
+                    window.location = this.form.goPage(page);
+                },
+                pervPage() {
+                    window.location = this.form.pervPage();
+                },
+                nextPage() {
+                    window.location = this.form.nextPage();
+                }
+            }
+        });
+    </script>
+@endsection

routes/web.php

@@ -305,3 +305,13 @@ Route::group(['prefix'=>'order'],function(){
     //批量取消分配
     Route::post('deAllocationAll','OrderController@deAllocationAll');
 });
+
+/**
+ * 新建波次
+ */
+Route::group(['prefix'=>'wave'],function(){
+    // index
+    Route::get('index','WaveController@index');
+    // cancel printing by id or ids
+    Route::post('cancelPrinting','WaveController@cancelPrinting');
+});

webpack.mix.js

@@ -21,4 +21,5 @@ mix.copy('resources/icon','public/icon');
 mix.copy('resources/images','public/images');
 mix.copy('resources/icon/faviconc.ico','public/faviconc.ico');
 mix.js('resources/js/trix.js','public/js/trix.js');
-mix.copy('resources/sass/trix.css','public/css/trix.css');
+mix.copy('resources/sass/trix.css','public/css/trix.css');
+mix.copy('resources/js/queryForm/queryForm.js','public/js/queryForm/queryForm.js');