上下班控件和页面修改

assets/js/config.router.js

@@ -440,7 +440,7 @@ app.config(['$authProvider', '$httpProvider', '$stateProvider', '$urlRouterProvi
             }).state('app.working.manage', {
                 url: '/manage',
                 templateUrl: "assets/views/working/manage.html",
-                resolve: loadSequence('jquery-sparkline', 'api-check', 'formly', 'angularFormly', 'ckeditor-plugin', 'ckeditor', 'angularFileUpload', 'multi.select.tree', 'angularBootstrapNavTree', 'customformCtrl', 'workingFormCtr'),
+                resolve: loadSequence('jquery-sparkline', 'api-check', 'formly', 'angularFormly', 'ckeditor-plugin', 'ckeditor', 'angularFileUpload', 'multi.select.tree', 'angularBootstrapNavTree', 'angularTree', 'customformCtrl', 'workingFormCtr'),
                 title: 'working.manage',
                 icon: 'fa-tint',
                 ncyBreadcrumb: {

assets/js/controllers/customform/customformCtrl.js

@@ -90,6 +90,7 @@ appFormly.config(function config(formlyConfigProvider) {
   }
 
   formlyConfigProvider.setWrapper({
+    overwriteOk: true,
     name: "bootstrapLabel",
     templateUrl: "assets/views/customform/tpl/normal-label.html",
   });

assets/views/working/manage.html

@@ -1,80 +1,429 @@
 <style>
-    .tree-control .tree-input {
-        min-height: 30px !important;
-        padding-top: 5px;
-    }
-
-    .tree-control .tree-view .item-container:hover,
-    .tree-control .tree-view .selected,
-    .tree-control .tree-view .active {
-        background-color: #428bca;
-        background-image: linear-gradient(#428bca, #428bca) !important;
-        background: #428bca;
-        color: #fff;
-    }
-
-    .tree-control .tree-view .item-container:hover .expand,
-    .tree-control .tree-view .selected .expand,
-    .tree-control .tree-view .active .expand {
-        border-left: 10px solid #fff;
-    }
-
-    .tree-control .tree-view .item-container:hover .expand-opened,
-    .tree-control .tree-view .selected .expand-opened,
-    .tree-control .tree-view .active .expand-opened {
-        border-bottom: 0px solid transparent;
-        border-left: 6px solid transparent;
-        border-right: 6px solid transparent;
-        border-top: 10px solid #fff;
-    }
-
-    /* .jry_selectHeight .dropdown-menu{
+  .allSeletedUsers li{
+    margin-bottom: 8px;
+  }
+  .allSeletedUsers li .allSeletedUser {
+    padding: 8px;
+    border: 1px solid #dde1e5;
+    background-color: #f9fafb;
+    display: inline-block;
+    position: relative;
+    border-radius: 8px;
+  }
+  .allSeletedUsers li .allSeletedUser span {
+    vertical-align: middle;
+  }
+  .allSeletedUsers li .allSeletedUser em {
+    display: inline-block;
+    font-style: normal;
+    background-color: #fff;
+    font-size: 16px;
+    border: 1px solid #333;
+    width: 16px;
+    height: 16px;
+    font-weight: normal;
+    border-radius: 50%;
+    color: #333;
+    text-align: center;
+    line-height: 10px;
+    margin-left: 8px;
+    cursor: pointer;
+  }
+  .allSeletedUsers li .allSeletedUser em:hover{
+    color: #fff;
+    background-color: #eb3941;
+    border-color: #eb3941;
+  }
+  .tree-control .tree-input {
+    min-height: 30px !important;
+    padding-top: 5px;
+  }
+
+  .tree-control .tree-view .item-container:hover,
+  .tree-control .tree-view .selected,
+  .tree-control .tree-view .active {
+    background-color: #428bca;
+    background-image: linear-gradient(#428bca, #428bca) !important;
+    background: #428bca;
+    color: #fff;
+  }
+
+  .tree-control .tree-view .item-container:hover .expand,
+  .tree-control .tree-view .selected .expand,
+  .tree-control .tree-view .active .expand {
+    border-left: 10px solid #fff;
+  }
+
+  .tree-control .tree-view .item-container:hover .expand-opened,
+  .tree-control .tree-view .selected .expand-opened,
+  .tree-control .tree-view .active .expand-opened {
+    border-bottom: 0px solid transparent;
+    border-left: 6px solid transparent;
+    border-right: 6px solid transparent;
+    border-top: 10px solid #fff;
+  }
+
+  /* .jry_selectHeight .dropdown-menu{
         height: 150px!important;
     } */
-    .dropdown-menu {
-        z-index: 9999;
-    }
-    .autosize{
-        height: auto!important;
-    }
+  .dropdown-menu {
+    z-index: 9999;
+  }
+  .autosize {
+    height: auto !important;
+  }
+  /* -----------------------选择上班人员----------------------- */
+  /* 公共css,需要复用 */
+
+  .iconfont {
+    font-size: 14px;
+  }
+
+  .nav-pills > li > a {
+    border-radius: 0px;
+  }
+
+  .nav-pills > li.active > a,
+  .nav-pills > li.active > a:hover,
+  .nav-pills > li.active > a:focus {
+    background-color: #006bbf;
+    color: white !important;
+  }
+
+  .mainDiv {
+    overflow: hidden;
+    float: left;
+    width: 100%;
+    margin-top: 8px;
+  }
+
+  .mainDiv-wrapper {
+    padding-left: 14px;
+    padding-right: 14px;
+  }
+
+  .mainDivLeft {
+    display: inline-block;
+    width: 32%;
+    border-radius: 8px;
+    border: 1px solid #eeeeee;
+    margin-right: 1%;
+  }
+
+  .mainDivRight {
+    display: inline-block;
+    width: 32%;
+    border-radius: 8px;
+    border: 1px solid #eeeeee;
+  }
+
+  .mainDiv-head {
+    height: 47px;
+    line-height: 47px;
+    background: #f5f5f5;
+    font-size: 16px;
+    color: #606367;
+    border-radius: 8px 8px 0 0;
+    padding-left: 10px;
+    padding-right: 4px;
+  }
+
+  .mainDivLeft-span {
+    border: 1px solid;
+    padding-left: 15px;
+    padding-right: 15px;
+    padding-top: 4px;
+    padding-bottom: 4px;
+    height: 28px;
+    line-height: 28px;
+    border-radius: 4px;
+    margin-right: 10px;
+    font-size: 14px;
+  }
+
+  .mainDiv-head-right {
+    float: right;
+  }
+
+  .edit-left {
+    display: inline-block;
+    margin-left: 10px;
+  }
+
+  .span-1 {
+    border: none;
+    color: white;
+    background-color: #2edbb8;
+  }
+
+  .span-2 {
+    border: none;
+    color: white;
+    background-color: #006bc0;
+  }
+
+  .span-3 {
+    border: none;
+    color: white;
+    background-color: #fc4c58;
+  }
+
+  .mainDiv-body {
+    border-radius: 8px;
+    border: 1px solid #eeeeee;
+    margin: 14px;
+    padding-top: 14px;
+  }
+
+  .mainDiv-body-1 {
+    height: 50px;
+    line-height: 50px;
+    font-size: 16px;
+    color: #606367;
+    padding: 0px 14px;
+    border-bottom: 1px solid #eeeeee;
+  }
+
+  .mainDiv-body-2 {
+    height: 70px;
+    line-height: 70px;
+    font-size: 14px;
+    color: #606367;
+    padding: 0px 30px;
+    border-bottom: 1px solid #eeeeee;
+  }
+
+  .mainDiv-body-2:last-child {
+    border-bottom: none;
+  }
+
+  .fixHeight {
+    height: 450px;
+    overflow: auto;
+  }
+
+  .mainDiv-body-3 {
+    height: 50px;
+    line-height: 50px;
+    font-size: 14px;
+    color: #606367;
+    padding: 0px 30px;
+    border-bottom: 1px solid #eeeeee;
+  }
+
+  .mainDiv-body-3:last-child {
+    border-bottom: none;
+  }
+
+  .mainDiv-body-img {
+    height: 90px;
+    border-radius: 4px;
+    margin: 14px;
+    margin-bottom: 0px;
+    overflow: hidden;
+  }
+
+  .mainDiv-body-noList {
+    height: 110px;
+    margin: 50px 0;
+    text-align: center;
+  }
+
+  .form-control {
+    display: inline-block;
+  }
+
+  .mainDivLeft-span-1 {
+    border: 1px solid;
+    padding-left: 15px;
+    padding-right: 15px;
+    height: 28px;
+    line-height: 28px;
+    border-radius: 4px;
+    margin-right: 10px;
+    font-size: 14px;
+    display: inline-block;
+  }
+
+  .mainDivLeft-span-2 {
+    border: 1px solid;
+    padding-left: 15px;
+    padding-right: 15px;
+    height: 28px;
+    line-height: 28px;
+    border-radius: 4px;
+    margin-right: 10px;
+    font-size: 14px;
+    display: inline-block;
+  }
+
+  .mainDivLeft-span-edit-1 {
+    border: 1px solid;
+    padding-left: 8px;
+    padding-right: 8px;
+    height: 22px;
+    line-height: 22px;
+    border-radius: 2px;
+    margin-right: 10px;
+    font-size: 12px;
+    display: inline-block;
+  }
+
+  .mainDivLeft-span-edit-2 {
+    border: 1px solid;
+    padding-left: 8px;
+    padding-right: 8px;
+    height: 22px;
+    line-height: 22px;
+    border-radius: 2px;
+    margin-right: 10px;
+    font-size: 12px;
+    display: inline-block;
+  }
 </style>
 <div ng-controller="workingFormCtrl">
-    <!--{{title}}-->
-    <div class="col-xs-12 panel">
-        <section id="page-title-form">
-            <div class="row">
-                <div class="col-sm-8">
-                    <h1 class="mainTitle">{{vm.model.label}}<i tooltip={{vm.model.placeholder}}
-                            tooltip-placement="right"
-                            class="fa  ti-help-alt margin-left-10 fontcolor-five pointfont"></i></h1>
-                </div>
-            </div>
-        </section>
-    </div>
-    <form ng-submit="vm.submit(vm.model,'sm')" class="jry_selectHeight">
-        <!-- <formly-form model="vm.model" fields="vm.fields" options="vm.options" form="vm.form" ng-if="vm.fields.length">
+  <div class="col-xs-12 panel">
+    <section id="page-title-form">
+      <div class="row">
+        <div class="col-sm-8">
+          <h1 class="mainTitle">
+            {{vm.model.label}}<i
+              tooltip="{{vm.model.placeholder}}"
+              tooltip-placement="right"
+              class="fa ti-help-alt margin-left-10 fontcolor-five pointfont"
+            ></i>
+          </h1>
+        </div>
+      </div>
+    </section>
+  </div>
+  <form ng-submit="vm.submit(vm.model,'sm')" class="jry_selectHeight">
+    <!-- <formly-form model="vm.model" fields="vm.fields" options="vm.options" form="vm.form" ng-if="vm.fields.length">
         </formly-form> -->
-        <div class="panel col-xs-12 col-0 bg-lightgrey">
-            <formly-form model="vm.model " fields="vm.fields[0].fields " form="vm.form" options="vm.options ">
-            </formly-form>
+    <div class="panel col-xs-12 col-0 bg-lightgrey">
+      <formly-form
+        model="vm.model "
+        fields="vm.fields[0].fields "
+        form="vm.form"
+        options="vm.options "
+      >
+      </formly-form>
+    </div>
+    <div
+      class="panel col-xs-12 col-0 bg-lightgrey margin-top-15"
+      ng-if="vm.fields[1].fields"
+    >
+      <formly-form
+        model="vm.model "
+        fields="vm.fields[1].fields"
+        form="vm.form"
+        options="vm.options "
+      >
+      </formly-form>
+    </div>
+    <div
+      class="panel col-xs-12 col-0 bg-lightgrey margin-top-15"
+      ng-if="vm.fields[2].fields"
+    >
+      <formly-form
+        model="vm.model "
+        fields="vm.fields[2].fields "
+        form="vm.form"
+        options="vm.options "
+      >
+      </formly-form>
+    </div>
+    <div
+      class="panel col-xs-12 col-0 bg-lightgrey margin-top-15"
+      ng-if="vm.fields[3].fields"
+    >
+      <formly-form
+        model="vm.model "
+        fields="vm.fields[3].fields "
+        form="vm.form"
+        options="vm.options "
+      >
+      </formly-form>
+    </div>
+    <!-- 选择上班人员 -->
+    <div class="mainDiv">
+      <div class="mainDivLeft">
+        <div class="mainDiv-head">
+          <span>工作组</span>
         </div>
-        <div class="panel col-xs-12 col-0 bg-lightgrey margin-top-15" ng-if="vm.fields[1].fields">
-            <formly-form model="vm.model " fields="vm.fields[1].fields" form="vm.form" options="vm.options ">
-            </formly-form>
+        <div class="mainDiv-body fixHeight group-tree">
+          <div class="box-tree">
+            <span ng-if="doing_async">...加载中...</span>
+            <abn-tree
+              tree-data="my_data"
+              tree-control="my_tree"
+              on-select="my_tree_handler(branch)"
+              expand-level="2"
+              icon-leaf="iconfont icon-zuzhijigou"
+              icon-expand="ti-plus"
+              icon-collapse="ti-minus "
+            ></abn-tree>
+          </div>
         </div>
-        <div class="panel col-xs-12 col-0 bg-lightgrey margin-top-15" ng-if="vm.fields[2].fields">
-            <formly-form model="vm.model " fields="vm.fields[2].fields " form="vm.form" options="vm.options ">
-            </formly-form>
+      </div>
+      <div class="mainDivLeft">
+        <div class="mainDiv-head">
+          <span>人员列表</span>
         </div>
-        <div class="panel col-xs-12 col-0 bg-lightgrey margin-top-15" ng-if="vm.fields[3].fields">
-            <formly-form model="vm.model " fields="vm.fields[3].fields " form="vm.form" options="vm.options ">
-            </formly-form>
+        <div class="mainDiv-body fixHeight">
+          <div class="mainDiv-wrapper">
+            <div class="box-tree">
+              <span ng-if="doing_asyncuser ">...加载中...</span>
+              <abn-trees
+                tree-data="my_user"
+                on-chioce="formbranch(item)"
+                tree-control="my_tree"
+                expand-level=""
+                icon-expand="ti-plus "
+                icon-collapse="ti-minus "
+                check-boxs="true"
+              ></abn-trees>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="mainDivLeft">
+        <div class="mainDiv-head">
+          <span>上班人员（{{getbranchs.length}}）</span>
         </div>
-        <div class="col-xs-12 margin-top-30 margin-bottom-30 text-center">
-            <button type="submit" ladda="ldloading.sm" class="btn btn-addbutton  addbutton"
-                translate="form.button.SUBMIT" ng-if="vm.model.showSub=='true'">Submit</button>
-            <button type="close" class="btn btn-removebutton removebutton" ng-click="closeModel()"
-                translate="form.button.CLOSE">CLOSE </button>
+        <div class="mainDiv-body fixHeight">
+          <div class="mainDiv-wrapper">
+            <div class="box-tree">
+              <ul class="allSeletedUsers">
+                <li ng-repeat="u in getbranchs">
+                  <div class="allSeletedUser">
+                    <span>{{u.name}}</span><em ng-click="removeBranch(u)">x</em>
+                  </div>
+                </li>
+              </ul>
+            </div>
+          </div>
         </div>
-    </form>
-</div>
+      </div>
+    </div>
+    <div class="col-xs-12 margin-top-30 margin-bottom-30 text-center">
+      <button
+        type="submit"
+        ladda="ldloading.sm"
+        class="btn btn-addbutton addbutton"
+        translate="form.button.SUBMIT"
+        ng-if="vm.model.showSub=='true'"
+      >
+        Submit
+      </button>
+      <button
+        type="close"
+        class="btn btn-removebutton removebutton"
+        ng-click="closeModel()"
+        translate="form.button.CLOSE"
+      >
+        CLOSE
+      </button>
+    </div>
+  </form>
+</div>