YM
2025-03-10 f2a13e01e8843302dfb2e80fe18edec3a4ba137f
public/static/assets/gougu/module/oaPicker.js
@@ -1,514 +1,724 @@
layui.define(['tool'], function (exports) {
   const layer = layui.layer, tool = layui.tool,form=layui.form, table=layui.table,tree = layui.tree;
   const dataPicker ={
      'department':{
         title:'选择部门',
         url:'/api/index/get_department',
         area: ['400px', '524px'],
         searchbar:'',
         page:false,
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'部门名称'}]
      },
      'position':{
         title:'选择岗位',
         url:'/api/index/get_position',
         area: ['400px', '524px'],
         searchbar:'',
         page:false,
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'岗位名称'}]
      },
      'services':{
         title:'选择服务类型',
         url:'/api/index/get_services',
         area: ['400px', '524px'],
         searchbar:'',
         page:false,
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'服务名称'},{field:'price',title:'服务单价'}]
      },
      'template':{
         title:'选择消息模板',
         url:'/api/index/get_template',
         area: ['600px', '568px'],
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'消息模板名称'}]
      },
      'workcate':{
         title:'选择工作类型',
         url:'/api/index/get_work_cate',
         area: ['400px', '524px'],
         searchbar:'',
         page:false,
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'工作类型名称'}]
      },
      'property':{
         title:'选择固定资产',
         url:'/adm/api/get_property',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'资产名称'}]
      },
      'car':{
         title:'选择车辆信息',
         url:'/adm/api/get_car',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'车辆名称'},{field:'name',width:100,title:'车牌号码',align:'center'}]
      },
      'room':{
         title:'选择会议室',
         url:'/adm/api/get_meeting_room',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'会议室名称'},{field:'num',width:100,title:'可容纳人数',align:'center'}]
      },
      'customer':{
         title:'选择客户',
         url:'/customer/api/get_customer',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'name',title:'客户名称'}]
      },
      'supplier':{
         title:'选择供应商',
         url:'/contract/api/get_supplier',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'供应商名称'}]
      },
      'contract':{
         title:'选择销售合同',
         url:'/contract/api/get_contract',
         area: ['800px', '568px'],
         cols:[{ field: 'code',width:160,title:'合同编号',align:'center'},{field:'name',title:'合同名称'},{ field:'customer',title:'关联客户',width: 240}]
      },
      'product':{
         title:'选择产品',
         url:'/contract/api/get_product',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'产品名称'},{field:'sale_price',title:'销售单价',width: 120,align:'center'}]
      },
      'purchase':{
         title:'选择采购合同',
         url:'/contract/api/get_purchase',
         area: ['800px', '568px'],
         cols:[{ field: 'code',width:160,title:'合同编号',align:'center'},{field:'name',title:'合同名称'},{ field:'supplier',title:'关联供应商',width: 240}]
      },
      'purchased':{
         title:'选择采购物品',
         url:'/contract/api/get_purchased',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'采购物品名称'},{field:'purchase_price',title:'采购单价',width: 120,align:'center'}]
      },
      'project':{
         title:'选择项目',
         url:'/project/api/get_project',
         cols:[{field:'id',width:90,title:'序号',align:'center'},{field:'title',title:'项目名称'}]
      },
      'task':{
         title:'选择任务',
         url:'/project/api/get_task',
         area: ['800px', '568px'],
         cols:[{field:'id',width:90,title:'序号',align:'center'},{ field:'title',title:'任务主题'},{field:'project',width:240,title:'关联项目'}]
      }
   }
layui.define(["tool"], function (exports) {
  const layer = layui.layer,
    tool = layui.tool,
    form = layui.form,
    table = layui.table,
    tree = layui.tree;
   let select_ids=[];select_names=[];select_array=[];
   const obj = {
      employeeRender:function(){
         var me=this,letterTem='';
         for(var i=0;i<26;i++){
            letterTem+='<span class="layui-letter-span" data-code="'+String.fromCharCode(97+i)+'">'+String.fromCharCode(65+i)+'</span>';
         }
         var tpl='<div style="width:210px; height:388px; border-right:1px solid #eee; overflow-x: hidden; overflow-y: auto; float:left;">\
  const dataPicker = {
    department: {
      title: "选择部门",
      url: "/api/index/get_department",
      area: ["400px", "524px"],
      searchbar: "",
      page: false,
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "部门名称" }
      ]
    },
    position: {
      title: "选择岗位",
      url: "/api/index/get_position",
      area: ["400px", "524px"],
      searchbar: "",
      page: false,
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "岗位名称" }
      ]
    },
    services: {
      title: "选择服务类型",
      url: "/api/index/get_services",
      area: ["400px", "524px"],
      searchbar: "",
      page: false,
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "服务名称" },
        { field: "price", title: "服务单价" }
      ]
    },
    template: {
      title: "选择消息模板",
      url: "/api/index/get_template",
      area: ["600px", "568px"],
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "消息模板名称" }
      ]
    },
    workcate: {
      title: "选择工作类型",
      url: "/api/index/get_work_cate",
      area: ["400px", "524px"],
      searchbar: "",
      page: false,
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "工作类型名称" }
      ]
    },
    property: {
      title: "选择固定资产",
      url: "/adm/api/get_property",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "资产名称" }
      ]
    },
    car: {
      title: "选择车辆信息",
      url: "/adm/api/get_car",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "车辆名称" },
        { field: "name", width: 100, title: "车牌号码", align: "center" }
      ]
    },
    room: {
      title: "选择会议室",
      url: "/adm/api/get_meeting_room",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "会议室名称" },
        { field: "num", width: 100, title: "可容纳人数", align: "center" }
      ]
    },
    customer: {
      title: "选择客户",
      url: "/customer/api/get_customer",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "name", title: "客户名称" }
      ]
    },
    supplier: {
      title: "选择供应商",
      url: "/contract/api/get_supplier",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "供应商名称" }
      ]
    },
    contract: {
      title: "选择销售合同",
      url: "/contract/api/get_contract",
      area: ["800px", "568px"],
      cols: [
        { field: "code", width: 160, title: "合同编号", align: "center" },
        { field: "name", title: "合同名称" },
        { field: "customer", title: "关联客户", width: 240 }
      ]
    },
    product: {
      title: "选择产品",
      url: "/contract/api/get_product",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "产品名称" },
        { field: "sale_price", title: "销售单价", width: 120, align: "center" }
      ]
    },
    purchase: {
      title: "选择采购合同",
      url: "/contract/api/get_purchase",
      area: ["800px", "568px"],
      cols: [
        { field: "code", width: 160, title: "合同编号", align: "center" },
        { field: "name", title: "合同名称" },
        { field: "supplier", title: "关联供应商", width: 240 }
      ]
    },
    purchased: {
      title: "选择采购物品",
      url: "/contract/api/get_purchased",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "采购物品名称" },
        {
          field: "purchase_price",
          title: "采购单价",
          width: 120,
          align: "center"
        }
      ]
    },
    project: {
      title: "选择项目",
      url: "/project/api/get_project",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "项目名称" }
      ]
    },
    task: {
      title: "选择任务",
      url: "/project/api/get_task",
      area: ["800px", "568px"],
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "title", title: "任务主题" },
        { field: "project", width: 240, title: "关联项目" }
      ]
    },
    workPlan: {
      title: "选择班次",
      url: "/user/api/get_work_plan",
      cols: [
        { field: "id", width: 90, title: "序号", align: "center" },
        { field: "name", title: "班次名称" },
        {
          field: "time",
          width: 240,
          title: "考勤时间"
        }
      ]
    }
  };
  let select_ids = [];
  select_names = [];
  select_array = [];
  const obj = {
    employeeRender: function () {
      var me = this,
        letterTem = "";
      for (var i = 0; i < 26; i++) {
        letterTem +=
          '<span class="layui-letter-span" data-code="' +
          String.fromCharCode(97 + i) +
          '">' +
          String.fromCharCode(65 + i) +
          "</span>";
      }
      var tpl =
        '<div style="width:210px; height:388px; border-right:1px solid #eee; overflow-x: hidden; overflow-y: auto; float:left;">\
                     <div id="employeeDepament" style="padding:6px 0;"></div>\
                  </div>\
                  <div style="width:588px; height:388px; user-select:none; overflow-x: hidden; overflow-y: auto; float:left;">\
                     <div style="padding:12px 10px 0;"><div style="color:#999; text-align:center;">⇐ 点击左边部门筛选员工,或者点击下面字母筛选</div><div id="letterBar" style="color:#999; text-align:center;">'+letterTem+'</div></div>\
                     <div style="padding:12px 10px 0;"><div style="color:#999; text-align:center;">⇐ 点击左边部门筛选员工,或者点击下面字母筛选</div><div id="letterBar" style="color:#999; text-align:center;">' +
        letterTem +
        '</div></div>\
                     <div id="employee" style="padding:6px 12px"></div>\
                     <div style="padding:10px 15px; border-top:1px solid #eee;;"><strong>已选择</strong><span class="layui-tags-all">全选</span></div>\
                     <div id="selectTags" style="padding:10px 15px;">'+me.employeeSelect(0)+'</div>\
                  </div>';
         return tpl;
      },
      employeeSelect:function(t){
         var me=this,select_tags='';
         if(me.settings.type == 0){
            select_tags+='<span style="color:#1E9FFF">'+me.settings.names+'</span>';
         }
         else{
            select_ids=[];
            select_names=[];
            for(var a=0;a<select_array.length;a++){
               if(me.settings.fixedid==select_array[a].id && me.settings.fixedid!=0){
                  select_tags+='<span class="layui-tags-span">'+select_array[a].name+'</span>';
               }
               else{
                  select_tags+='<span class="layui-tags-span">'+select_array[a].name+'<i data-id="'+select_array[a].id+'" class="layui-icon layui-tags-close">ဆ</i></span>';
               }
               if(t==1){
                  $('#employee').find('[data-id="'+select_array[a].id+'"]').addClass('on');
               }
               select_ids.push(parseInt(select_array[a].id));
               select_names.push(select_array[a].name);
            }
         }
         //console.log(select_array);
         return select_tags;
      },
      employeeInit: function (options) {
         const opts={
            "title":"选择员工",
            "department_url": "/api/index/get_department_tree",
            "employee_url": "/api/index/get_employee",
            "type":1,//1单人,2多人
            "fixedid":0,
            "ids":"",
            "names":"",
            "ajax_data":[],
            "callback": function(){}
         };
         this.settings = $.extend({}, opts, options);
         var me=this;
         select_ids=[];
         select_names=[];
         select_array=[];
         if(me.settings.ids!='' && me.settings.names!=''){
            select_ids=me.settings.ids.split(',');
            select_names=me.settings.names.split(',');
            select_ids.sort((a, b) => a - b);
            for(var m=0;m<select_ids.length;m++){
               select_array.push({id:select_ids[m],name:select_names[m]});
            }
         }
         $(parent.$('.express-close')).addClass('parent-colse');
         layer.open({
            type:1,
            title:me.settings.title,
            area:['800px','500px'],
            resize:false,
            content:me.employeeRender(),
            end: function(){
               $(parent.$('.express-close')).removeClass('parent-colse');
            },
            success:function(obj,idx){
                  var dataList=[],letterBar=$('#letterBar'),employee = $('#employee'),selectTags = $('#selectTags');
                  $.ajax({
                     url:me.settings.department_url,
                     type:'get',
                     success:function(res){
                        //仅节点左侧图标控制收缩
                        tree.render({
                           elem: '#employeeDepament',
                           data: res.trees,
                           onlyIconControl: true,  //是否仅允许节点左侧图标控制展开收缩
                           click: function(obj){
                              var tagsItem='<div style="color:#999; text-align:center;">暂无员工</div>';
                              $("#employeeDepament").find('.layui-tree-main').removeClass('on');
                              $(obj.elem).find('.layui-tree-main').eq(0).addClass('on');
                              letterBar.find('span').removeClass('on');
                              $.ajax({
                                 url:me.settings.employee_url,
                                 type:'get',
                                 data:{did:obj.data.id},
                                 success:function(res){
                                    me.ajax_data = res.data;
                                    dataList=me.ajax_data;
                                    if(dataList.length>1 && me.settings.type == 2){
                                       $('.layui-tags-all').show();
                                    }
                                    else{
                                       $('.layui-tags-all').hide();
                                    }
                                    if(dataList.length>0){
                                       tagsItem='';
                                       for(var i=0; i<dataList.length; i++){
                                          if(select_ids.indexOf(dataList[i].id) == -1){
                                             tagsItem+='<span class="layui-tags-span" data-idx="'+i+'" data-id="'+dataList[i].id+'">'+dataList[i].name+'</span>';
                                          }
                                          else{
                                             tagsItem+='<span class="layui-tags-span on" data-idx="'+i+'" data-id="'+dataList[i].id+'">'+dataList[i].name+'</span>';
                                          }
                                       }
                                    }
                                    employee.html(tagsItem);
                                 }
                              })
                           }
                        });
                        letterBar.on("click" ,'span',function(){
                           var code=$(this).data('code');
                           $(this).addClass('on').siblings().removeClass('on');
                           $.ajax({
                              url:me.settings.employee_url,
                              type:'get',
                              data:{id:1},
                              success:function(res){
                                 me.ajax_data = res.data;
                                 var letterData=[],tagsItem='<div style="color:#999; text-align:center;">暂无员工</div>';;
                                 if(me.ajax_data.length>0){
                                    var tagsItemCode='';
                                    for(var i=0; i<me.ajax_data.length; i++){
                                       if(me.ajax_data[i].username.slice(0,1)==code){
                                          if(select_ids.indexOf(me.ajax_data[i].id) == -1){
                                             tagsItemCode+='<span class="layui-tags-span" data-idx="'+i+'" data-id="'+me.ajax_data[i].id+'">'+me.ajax_data[i].name+'</span>';
                                          }
                                          else{
                                             tagsItemCode+='<span class="layui-tags-span on" data-idx="'+i+'" data-id="'+me.ajax_data[i].id+'">'+me.ajax_data[i].name+'</span>';
                                          }
                                          letterData.push(me.ajax_data[i]);
                                       }
                                    }
                                    dataList=letterData;
                                    if(dataList.length>2 && me.settings.type == 2){
                                       $('.layui-tags-all').show();
                                    }
                                    else{
                                       $('.layui-tags-all').hide();
                                    }
                                    if(tagsItemCode!=''){
                                       tagsItem = tagsItemCode;
                                    }
                                 }
                                 employee.html(tagsItem);
                              }
                           })
                        });
                     }
                  })
                  if(me.settings.type == 2){
                     $('.layui-tags-all').on('click',function(){
                        for(var a=0; a<dataList.length;a++){
                           if(select_ids.indexOf(dataList[a]['id']) == -1){
                              select_array.push(dataList[a]);;
                           }
                        }
                        selectTags.html(me.employeeSelect(1));
                     });
                  }
                  employee.on('click','.layui-tags-span',function(){
                     let item_idx=$(this).data('idx');
                     let select_item = me.ajax_data[item_idx];
                     if(me.settings.type == 1){
                        me.settings.callback([select_item]);
                        layer.close(idx);
                     }
                     else{
                        if(select_ids.indexOf(select_item['id']) == -1){
                           select_array.push(select_item);
                           selectTags.html(me.employeeSelect(1));
                        }
                     }
                  });
                  selectTags.on('click','.layui-tags-close',function(){
                     let id=$(this).data('id');
                     let new_slected=[];
                     $('#employee').find('[data-id="'+id+'"]').removeClass('on');
                     for(var i=0;i<select_array.length;i++){
                        if(select_array[i].id!=id){
                           new_slected.push(select_array[i]);
                        }
                     }
                     select_array=new_slected;
                     selectTags.html(me.employeeSelect(1));
                  });
                  if(me.settings.type == 1){
                     $('#layui-layer'+idx).find('.layui-layer-btn0').hide();
                  }
               },
               btn: ['确定添加', '清空已选'],
               btnAlign:'c',
               btn1: function(idx){
                  me.settings.callback(select_array);
                  layer.close(idx);
               },
               btn2: function(idx){
                  let canceldata= {department:"",did:0,id:0,mobile:0,name:"",nickname:"",position_id:0,sex:0,status:0,thumb:"",username:""};
                  me.settings.callback([canceldata]);
                  layer.close(idx);
               }
         })
      },
      picker:function(types,type,callback,map){
         let pickerIndex = new Date().getTime();
         let pickerTable,options;
         const opts={
            "title":"选择",
            "url": "",
            "ids":"",
            "titles":"",
            "where":map,
            "area": ['600px', '568px'],
            "cols":[{field: 'id',width: 80,title:'序号',align:'center'},{field:'title',title:'名称'}],
            "searchbar":'<form class="layui-form pb-2"><div class="layui-input-inline" style="width:420px; margin-right:5px;"><input type="text" name="keywords" placeholder="请输入关键字" class="layui-input" autocomplete="off" /></div><button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="picker">提交搜索</button><button type="reset" class="layui-btn layui-btn-reset" lay-filter="picker-reset">清空</button></form>',
            "page":true,
            "type":type,//1单选择,2多选
            "btnno":true,
            "add": "",//新增url
            "callback": callback
         };
         if(Object.prototype.toString.call(types) === '[object Object]'){
            options = types;
         }
         else{
            options = dataPicker[types];
         }
         let settings = $.extend({},opts,options);
         //console.log(settings);
         let btn = ['确定选择'];
         if(settings.btnno==true){
            btn = ['确定选择','清空已选'];
         }
         if(settings.add!=''){
            btn = ['确定选择','清空已选','新增'];
         }
         $(parent.$('.express-close')).addClass('parent-colse');
         layer.open({
            title: settings.title,
            area: settings.area,
            type: 1,
            skin: 'gougu-picker',
            content: '<div class="picker-table" id="pickerBox'+pickerIndex+'">'+settings.searchbar+'<div id="pickerTable'+pickerIndex+'"></div></div>',
            end: function(){
               $(parent.$('.express-close')).removeClass('parent-colse');
            },
            success: function () {
               let cols=JSON.parse(JSON.stringify(settings.cols));
               if(settings.type==1){
                  cols.splice(0, 0, {type: 'radio', title: '选择'});
               }
               if(settings.type==2){
                  cols.splice(0, 0, {type: 'checkbox', title: '选择'});
               }
               pickerTable = table.render({
                  elem: '#pickerTable'+pickerIndex,
                  url: settings.url,
                  where:settings.where,
                  page: settings.page, //开启分页
                  limit: 10,
                  height: '407',
                  cols: [cols]
               });
               //搜索提交
               form.on('submit(picker)', function (data) {
                  let maps = $.extend({}, settings.where, data.field);
                  pickerTable.reload({where:maps,page:{curr: 1}});
                  return false;
               });
               //重置搜索提交
               $('#pickerBox'+pickerIndex).on('click', '[lay-filter="picker-reset"]', function () {
                  let prev = $(this).prev();
                  if (typeof(prev) != "undefined" ) {
                     setTimeout(function () {
                        prev.click();
                     }, 10)
                  }
               });
            },
            btn: btn,
            btnAlign: 'c',
            btn1: function (idx) {
               var checkStatus = table.checkStatus(pickerTable.config.id);
               var data = checkStatus.data;
               if (data.length > 0) {
                  callback(data);
                  layer.close(idx);
               }
               else {
                  layer.msg('请先选择内容');
                  return false;
               }
            },
            btn2: function (idx) {
               callback([{'id':0,'title':'','name':''}]);
               layer.close(idx);
            },
            btn3: function (idx) {
               tool.side(settings.add);
               layer.close(idx);
            }
         })
      }
   }
   //选择员工弹窗
   $('body').on('click','.picker-admin',function () {
      let that = $(this);
      let type = that.data('type');
      if (typeof(type) == "undefined" || type == '') {
         type = 1;
      }
      let ids=that.next().val()+'',names = that.val()+'';
      obj.employeeInit({
         ids:ids,
         names:names,
         type:type,
         callback:function(data){
            let select_id=[],select_name=[];
            for(var a=0; a<data.length;a++){
               select_id.push(data[a].id);
               select_name.push(data[a].name);
            }
            console.log(select_name);
            that.val(select_name.join(','));
            that.next().val(select_id.join(','));
         }
      });
   });
   //选择下属员工弹窗
   $('body').on('click','.picker-sub',function () {
      let that = $(this);
      let type = that.data('type');
      if (typeof(type) == "undefined" || type == '') {
         type = 1;
      }
      let ids=that.next().val()+'',names = that.val()+'';
      obj.employeeInit({
         title:"选择下属",
         department_url: "/api/index/get_department_tree_sub",
         employee_url: "/api/index/get_employee_sub",
         ids:ids,
         names:names,
         type:type,
         callback:function(data){
            let select_id=[],select_name=[];
            for(var a=0; a<data.length;a++){
               select_id.push(data[a].id);
               select_name.push(data[a].name);
            }
            console.log(select_name);
            that.val(select_name.join(','));
            that.next().val(select_id.join(','));
         }
      });
   });
   //选择OA数据弹层
   $('body').on('click','.picker-oa',function () {
      let that = $(this),ids = [],titles=[],map = {};
      let types = that.data('types');
      let type = that.data('type');
      let where = that.data('where');
      if (typeof(types) == "undefined" || types == '') {
         layer.msg('请设置【picker】的类型');
         return false;
      }
      if (typeof(type) == "undefined" || type == '') {
         type = 1;
      }
      if (typeof(where) == "undefined" || where == '') {
         map = {};
      }
      else{
         map = JSON.parse(where);
      }
      let callback = function(data){
         for ( var i = 0; i <data.length; i++){
            ids.push(data[i].id);
            if(!data[i].title){
               titles.push(data[i].name);
            }else{
               titles.push(data[i].title);
            }
         }
         that.val(titles.join(','));
         that.next().val(ids.join(','));
      }
      obj.picker(types,type,callback,map);
   });
   //输出接口
   exports('oaPicker', obj);
});
                     <div id="selectTags" style="padding:10px 15px;">' +
        me.employeeSelect(0) +
        "</div>\
                  </div>";
      return tpl;
    },
    employeeSelect: function (t) {
      var me = this,
        select_tags = "";
      if (me.settings.type == 0) {
        select_tags +=
          '<span style="color:#1E9FFF">' + me.settings.names + "</span>";
      } else {
        select_ids = [];
        select_names = [];
        for (var a = 0; a < select_array.length; a++) {
          if (
            me.settings.fixedid == select_array[a].id &&
            me.settings.fixedid != 0
          ) {
            select_tags +=
              '<span class="layui-tags-span">' +
              select_array[a].name +
              "</span>";
          } else {
            select_tags +=
              '<span class="layui-tags-span">' +
              select_array[a].name +
              '<i data-id="' +
              select_array[a].id +
              '" class="layui-icon layui-tags-close">ဆ</i></span>';
          }
          if (t == 1) {
            $("#employee")
              .find('[data-id="' + select_array[a].id + '"]')
              .addClass("on");
          }
          select_ids.push(parseInt(select_array[a].id));
          select_names.push(select_array[a].name);
        }
      }
      //console.log(select_array);
      return select_tags;
    },
    employeeInit: function (options) {
      const opts = {
        title: "选择员工",
        department_url: "/api/index/get_department_tree",
        employee_url: "/api/index/get_employee",
        type: 1, //1单人,2多人
        fixedid: 0,
        ids: "",
        names: "",
        ajax_data: [],
        callback: function () {}
      };
      this.settings = $.extend({}, opts, options);
      var me = this;
      select_ids = [];
      select_names = [];
      select_array = [];
      if (me.settings.ids != "" && me.settings.names != "") {
        select_ids = me.settings.ids.split(",");
        select_names = me.settings.names.split(",");
        select_ids.sort((a, b) => a - b);
        for (var m = 0; m < select_ids.length; m++) {
          select_array.push({ id: select_ids[m], name: select_names[m] });
        }
      }
      $(parent.$(".express-close")).addClass("parent-colse");
      layer.open({
        type: 1,
        title: me.settings.title,
        area: ["800px", "500px"],
        resize: false,
        content: me.employeeRender(),
        end: function () {
          $(parent.$(".express-close")).removeClass("parent-colse");
        },
        success: function (obj, idx) {
          var dataList = [],
            letterBar = $("#letterBar"),
            employee = $("#employee"),
            selectTags = $("#selectTags");
          $.ajax({
            url: me.settings.department_url,
            type: "get",
            success: function (res) {
              //仅节点左侧图标控制收缩
              tree.render({
                elem: "#employeeDepament",
                data: res.trees,
                onlyIconControl: true, //是否仅允许节点左侧图标控制展开收缩
                click: function (obj) {
                  var tagsItem =
                    '<div style="color:#999; text-align:center;">暂无员工</div>';
                  $("#employeeDepament")
                    .find(".layui-tree-main")
                    .removeClass("on");
                  $(obj.elem).find(".layui-tree-main").eq(0).addClass("on");
                  letterBar.find("span").removeClass("on");
                  $.ajax({
                    url: me.settings.employee_url,
                    type: "get",
                    data: { did: obj.data.id },
                    success: function (res) {
                      me.ajax_data = res.data;
                      dataList = me.ajax_data;
                      if (dataList.length > 1 && me.settings.type == 2) {
                        $(".layui-tags-all").show();
                      } else {
                        $(".layui-tags-all").hide();
                      }
                      if (dataList.length > 0) {
                        tagsItem = "";
                        for (var i = 0; i < dataList.length; i++) {
                          if (select_ids.indexOf(dataList[i].id) == -1) {
                            tagsItem +=
                              '<span class="layui-tags-span" data-idx="' +
                              i +
                              '" data-id="' +
                              dataList[i].id +
                              '">' +
                              dataList[i].name +
                              "</span>";
                          } else {
                            tagsItem +=
                              '<span class="layui-tags-span on" data-idx="' +
                              i +
                              '" data-id="' +
                              dataList[i].id +
                              '">' +
                              dataList[i].name +
                              "</span>";
                          }
                        }
                      }
                      employee.html(tagsItem);
                    }
                  });
                }
              });
              letterBar.on("click", "span", function () {
                var code = $(this).data("code");
                $(this).addClass("on").siblings().removeClass("on");
                $.ajax({
                  url: me.settings.employee_url,
                  type: "get",
                  data: { id: 1 },
                  success: function (res) {
                    me.ajax_data = res.data;
                    var letterData = [],
                      tagsItem =
                        '<div style="color:#999; text-align:center;">暂无员工</div>';
                    if (me.ajax_data.length > 0) {
                      var tagsItemCode = "";
                      for (var i = 0; i < me.ajax_data.length; i++) {
                        if (me.ajax_data[i].username.slice(0, 1) == code) {
                          if (select_ids.indexOf(me.ajax_data[i].id) == -1) {
                            tagsItemCode +=
                              '<span class="layui-tags-span" data-idx="' +
                              i +
                              '" data-id="' +
                              me.ajax_data[i].id +
                              '">' +
                              me.ajax_data[i].name +
                              "</span>";
                          } else {
                            tagsItemCode +=
                              '<span class="layui-tags-span on" data-idx="' +
                              i +
                              '" data-id="' +
                              me.ajax_data[i].id +
                              '">' +
                              me.ajax_data[i].name +
                              "</span>";
                          }
                          letterData.push(me.ajax_data[i]);
                        }
                      }
                      dataList = letterData;
                      if (dataList.length > 2 && me.settings.type == 2) {
                        $(".layui-tags-all").show();
                      } else {
                        $(".layui-tags-all").hide();
                      }
                      if (tagsItemCode != "") {
                        tagsItem = tagsItemCode;
                      }
                    }
                    employee.html(tagsItem);
                  }
                });
              });
            }
          });
          if (me.settings.type == 2) {
            $(".layui-tags-all").on("click", function () {
              for (var a = 0; a < dataList.length; a++) {
                if (select_ids.indexOf(dataList[a]["id"]) == -1) {
                  select_array.push(dataList[a]);
                }
              }
              selectTags.html(me.employeeSelect(1));
            });
          }
          employee.on("click", ".layui-tags-span", function () {
            let item_idx = $(this).data("idx");
            let select_item = me.ajax_data[item_idx];
            if (me.settings.type == 1) {
              me.settings.callback([select_item]);
              layer.close(idx);
            } else {
              if (select_ids.indexOf(select_item["id"]) == -1) {
                select_array.push(select_item);
                selectTags.html(me.employeeSelect(1));
              }
            }
          });
          selectTags.on("click", ".layui-tags-close", function () {
            let id = $(this).data("id");
            let new_slected = [];
            $("#employee")
              .find('[data-id="' + id + '"]')
              .removeClass("on");
            for (var i = 0; i < select_array.length; i++) {
              if (select_array[i].id != id) {
                new_slected.push(select_array[i]);
              }
            }
            select_array = new_slected;
            selectTags.html(me.employeeSelect(1));
          });
          if (me.settings.type == 1) {
            $("#layui-layer" + idx)
              .find(".layui-layer-btn0")
              .hide();
          }
        },
        btn: ["确定添加", "清空已选"],
        btnAlign: "c",
        btn1: function (idx) {
          me.settings.callback(select_array);
          layer.close(idx);
        },
        btn2: function (idx) {
          let canceldata = {
            department: "",
            did: 0,
            id: 0,
            mobile: 0,
            name: "",
            nickname: "",
            position_id: 0,
            sex: 0,
            status: 0,
            thumb: "",
            username: ""
          };
          me.settings.callback([canceldata]);
          layer.close(idx);
        }
      });
    },
    picker: function (types, type, callback, map) {
      let pickerIndex = new Date().getTime();
      let pickerTable, options;
      const opts = {
        title: "选择",
        url: "",
        ids: "",
        titles: "",
        where: map,
        area: ["600px", "568px"],
        cols: [
          { field: "id", width: 80, title: "序号", align: "center" },
          { field: "title", title: "名称" }
        ],
        searchbar:
          '<form class="layui-form pb-2"><div class="layui-input-inline" style="width:420px; margin-right:5px;"><input type="text" name="keywords" placeholder="请输入关键字" class="layui-input" autocomplete="off" /></div><button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="picker">提交搜索</button><button type="reset" class="layui-btn layui-btn-reset" lay-filter="picker-reset">清空</button></form>',
        page: true,
        type: type, //1单选择,2多选
        btnno: true,
        add: "", //新增url
        callback: callback
      };
      if (Object.prototype.toString.call(types) === "[object Object]") {
        options = types;
      } else {
        options = dataPicker[types];
      }
      let settings = $.extend({}, opts, options);
      //console.log(settings);
      let btn = ["确定选择"];
      if (settings.btnno == true) {
        btn = ["确定选择", "清空已选"];
      }
      if (settings.add != "") {
        btn = ["确定选择", "清空已选", "新增"];
      }
      $(parent.$(".express-close")).addClass("parent-colse");
      layer.open({
        title: settings.title,
        area: settings.area,
        type: 1,
        skin: "gougu-picker",
        content:
          '<div class="picker-table" id="pickerBox' +
          pickerIndex +
          '">' +
          settings.searchbar +
          '<div id="pickerTable' +
          pickerIndex +
          '"></div></div>',
        end: function () {
          $(parent.$(".express-close")).removeClass("parent-colse");
        },
        success: function () {
          let cols = JSON.parse(JSON.stringify(settings.cols));
          if (settings.type == 1) {
            cols.splice(0, 0, { type: "radio", title: "选择" });
          }
          if (settings.type == 2) {
            cols.splice(0, 0, { type: "checkbox", title: "选择" });
          }
          // 单独处理
          // 班次的列格式化显示
          if (types == "workPlan") {
            cols[cols.length - 1].templet = function (d) {
              var html = "";
              if (d.times && d.times.length) {
                for (var i = 0; i < d.times.length; i++) {
                  html +=
                    "<span style='margin-right: 30px'>" +
                    d.times[i].begin_time +
                    " - " +
                    d.times[i].end_time +
                    "</span>";
                }
              } else {
                html = "-";
              }
              return html;
            };
          }
          pickerTable = table.render({
            elem: "#pickerTable" + pickerIndex,
            url: settings.url,
            where: settings.where,
            page: settings.page, //开启分页
            limit: 10,
            height: "407",
            cols: [cols]
          });
          //搜索提交
          form.on("submit(picker)", function (data) {
            let maps = $.extend({}, settings.where, data.field);
            pickerTable.reload({ where: maps, page: { curr: 1 } });
            return false;
          });
          //重置搜索提交
          $("#pickerBox" + pickerIndex).on(
            "click",
            '[lay-filter="picker-reset"]',
            function () {
              let prev = $(this).prev();
              if (typeof prev != "undefined") {
                setTimeout(function () {
                  prev.click();
                }, 10);
              }
            }
          );
        },
        btn: btn,
        btnAlign: "c",
        btn1: function (idx) {
          var checkStatus = table.checkStatus(pickerTable.config.id);
          var data = checkStatus.data;
          if (data.length > 0) {
            callback(data);
            layer.close(idx);
          } else {
            layer.msg("请先选择内容");
            return false;
          }
        },
        btn2: function (idx) {
          callback([{ id: 0, title: "", name: "" }]);
          layer.close(idx);
        },
        btn3: function (idx) {
          tool.side(settings.add);
          layer.close(idx);
        }
      });
    }
  };
  //选择员工弹窗
  $("body").on("click", ".picker-admin", function () {
    let that = $(this);
    let type = that.data("type");
    if (typeof type == "undefined" || type == "") {
      type = 1;
    }
    let ids = that.next().val() + "",
      names = that.val() + "";
    obj.employeeInit({
      ids: ids,
      names: names,
      type: type,
      callback: function (data) {
        let select_id = [],
          select_name = [];
        for (var a = 0; a < data.length; a++) {
          select_id.push(data[a].id);
          select_name.push(data[a].name);
        }
        console.log(select_name);
        that.val(select_name.join(","));
        that.next().val(select_id.join(","));
      }
    });
  });
  //选择下属员工弹窗
  $("body").on("click", ".picker-sub", function () {
    let that = $(this);
    let type = that.data("type");
    if (typeof type == "undefined" || type == "") {
      type = 1;
    }
    let ids = that.next().val() + "",
      names = that.val() + "";
    obj.employeeInit({
      title: "选择下属",
      department_url: "/api/index/get_department_tree_sub",
      employee_url: "/api/index/get_employee_sub",
      ids: ids,
      names: names,
      type: type,
      callback: function (data) {
        let select_id = [],
          select_name = [];
        for (var a = 0; a < data.length; a++) {
          select_id.push(data[a].id);
          select_name.push(data[a].name);
        }
        console.log(select_name);
        that.val(select_name.join(","));
        that.next().val(select_id.join(","));
      }
    });
  });
  //选择OA数据弹层
  $("body").on("click", ".picker-oa", function () {
    let that = $(this),
      ids = [],
      titles = [],
      map = {};
    let types = that.data("types");
    let type = that.data("type");
    let where = that.data("where");
    if (typeof types == "undefined" || types == "") {
      layer.msg("请设置【picker】的类型");
      return false;
    }
    if (typeof type == "undefined" || type == "") {
      type = 1;
    }
    if (typeof where == "undefined" || where == "") {
      map = {};
    } else {
      map = JSON.parse(where);
    }
    let callback = function (data) {
      for (var i = 0; i < data.length; i++) {
        ids.push(data[i].id);
        if (!data[i].title) {
          titles.push(data[i].name);
        } else {
          titles.push(data[i].title);
        }
      }
      that.val(titles.join(","));
      that.next().val(ids.join(","));
      // 单独处理班次按钮的处理结果
      if (types == "workPlan") {
        var selectName = data[0].name;
        var html = "";
        if (selectName) {
          html += selectName + ":";
        }
        if (data[0].times && data[0].times.length) {
          for (var i = 0; i < data[0].times.length; i++) {
            var timeItem = data[0].times[i];
            html +=
              "<span style='margin-right: 30px'>" +
              timeItem.begin_time +
              " - " +
              timeItem.end_time +
              "</span>";
          }
        }
        that.parent().prev().html(html);
      }
    };
    obj.picker(types, type, callback, map);
  });
  //输出接口
  exports("oaPicker", obj);
});