caiping/app/admin/view/project/indexcommon/project_user.html

<div class="p-3 bg-white">
  <table class="layui-hide" id="user" lay-filter="user"></table>
</div>
<script type="text/html" id="toolbaruser">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="add">+ 新增作业负责人</button>
    <button class="layui-btn layui-btn-sm picker-more" lay-event="adda">+ 新增作业成员</button>
    <button class="layui-btn layui-btn-sm picker-more" lay-event="adc">+ 新增送审单位成员</button>
  </div>
</script>
<script>
  function project_user() {
    if ($('#projectTab').find('li').eq(4).data('load') == 'true') {
      return false;
    }
    $('#projectTab').find('li').eq(4).data('load', 'true');
    let tool = layui.tool, table = layui.table, employeepicker = layui.employeepicker;
    //项目成员
    layui.userTable = table.render({
      elem: '#user',
      title: '项目成员列表',
      cellMinWidth: 80,
      toolbar: '#toolbaruser',
      url: "/admin/project.cost/project_user", //数据接口
      where: {'project_id': project_id},
      page: false, //开启分页
      limit: 20,
      cols: [[ //表头
        {field: 'nickname', fixed: 'left', title: '成员姓名', width: 200, align: 'center', rowspan: 2},
        {field: 'unit_name', title: '所在单位', align: 'center', width: 200, rowspan: 2},
        {
          field: 'type', title: '成员类型', align: 'center', width: 200, rowspan: 2,
          templet: function (a) {
            var html = "";
            if (a.type == 1) {
              html = "委托单位负责人"
            } else if (a.type == 2) {
              html = "评审单位负责人"
            } else if (a.type == 3) {
              html = "作业负责人"
            } else if (a.type == 4) {
              html = "作业成员"
            } else if (a.type == 6) {
              html = "评审单位负责人"
            }
            return html;
          }
        },
        {field: 'unit_type', title: '单位类型', align: 'center', width: 200, rowspan: 2},
        {field: 'mobile', title: '手机号码', align: 'center', rowspan: 2},
        {field: 'email', title: '单位邮箱', align: 'center', rowspan: 2},
        {
          title: '操作', fixed: 'right', align: 'center', width: 150, rowspan: 2, templet: function (d) {
            var html = '<span class="layui-btn layui-btn-danger layui-btn-xs" lay-event="remove">移除</span>';


            return html;
          }
        }
      ]]
    });

    //触发事件
    table.on('toolbar(user)', function (obj) {
      var checkStatus = table.checkStatus(obj.config.id);
      switch (obj.event) {
        case 'add':
          employeepicker.init({
            type: 0,
            department_url: "/admin/project.cost_company/get_department_tree",
            employee_url: "/admin/project.cost_company/get_employee",
            callback: function (ids, names, dids, departments) {
              let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                  layui.userTable.reload();
                }
              }

              tool.post("/admin/project.cost_company/add_user", {
                id: ids,
                project_id: project_id,
                type: 1
              }, callback);
            }
          })
          break;
        case "adda":
          employeepicker.init({
            type: 0,
            department_url: "/admin/project.cost_company/get_department_tree",
            employee_url: "/admin/project.cost_company/get_employee",
            callback: function (ids, names, dids, departments) {
              let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                  layui.userTable.reload();
                }
              }

              tool.post("/admin/project.cost_company/add_user_company_type2", {
                id: ids,
                project_id: project_id,
                type: 2
              }, callback);
            }
          })
          break;
        case "adc":
          employeepicker.init({
            type: 0,
            department_url: "/admin/project.cost_company/get_yezhu_tree",
            employee_url: "/admin/project.cost_company/get_employee",
            callback: function (ids, names, dids, departments) {
              let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                  layui.userTable.reload();
                }
              }
              tool.post("/admin/project.cost_company/add_company_user", {
                id: ids,
                project_id: project_id,
                type: 2
              }, callback);
            }
          })
          break;
      }
      ;
    });

    //监听行工具事件
    table.on('tool(user)', function (obj) {
      let postData = {"id": obj.data.id, "project_id": project_id, "type": obj.data.type};
      let callback = function (e) {
        layer.closeAll();
        layer.msg(e.msg);
        if (e.code == 0) {
          layui.userTable.reload();
        }
      }
      if (obj.event === 'remove') {

        if (obj.data.type == 3 || obj.data.type == 4) {
          console.log(postData);
          layer.confirm('确定要移除该项目成员吗?', {icon: 3, title: '提示'}, function (index) {
            tool.delete("/admin/project.cost_company/remove_user_company", postData, callback);
          });
        } else {
          layer.msg("该成员不可移除");
        }

      }
      if (obj.event === 'recover') {
        console.log(postData);
        layer.confirm('确定要恢复该项目成员吗?', {icon: 3, title: '提示'}, function (index) {
          tool.post("/project/api/recover_user", postData, callback);
        });
      }
      return;
    });
  }
</script>