jquery-ui实现拖拽进行人员员工工作任务安排分配效果代码-html代码-BFW代码库

jquery-ui实现拖拽进行人员员工工作任务安排分配效果代码

代码语言：html

所属分类：拖放

代码描述：jquery-ui实现拖拽进行人员员工工作任务安排效果代码，只需要拖动人员名字到工作任务后面即可分配工作，右侧拖入车辆即可分配车辆。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/jquery-ui-1.11.0.min.css">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">

    <style>
        @charset "UTF-8";
        html {
          box-sizing: border-box;
          font-family: "Segoe UI";
          font-size: 13px;
        }
        
        *, *:before, *:after {
          box-sizing: inherit;
        }
        
        .overlay {
          position: fixed;
          z-index: 99998;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          background: rgba(0, 0, 0, 0.3);
        }
        
        .em-edit-day {
          position: fixed;
          z-index: 99999;
          width: 900px;
          height: 300px;
          top: 50%;
          left: 50%;
          transform: translateY(-50%) translateX(-50%);
          background: #fff;
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.16), 0 6px 12px rgba(0, 0, 0, 0.32);
          clear: both;
          border-radius: 2px;
        }
        
        .em-day-header {
          height: 30px;
          background: #4285f4;
          color: #fff;
          border-top-left-radius: 2px;
          border-top-right-radius: 2px;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.24);
        }
        
        .emp-head,
        .job-head,
        .vhc-head {
          display: inline-block;
          float: left;
          padding: 5px;
          text-align: center;
      .........完整代码请登录后点击上方下载按钮下载查看