加入select2 组件

WebService/src/main/resources/components/floorPackage/floor-select2/floorSelect2.html

@@ -1,3 +1,8 @@
 <select class="form-control floorSelector">
+    <option value="">请选择区域</option>
+    <option value="1" selected="selected">珠海</option>
+    <option value="2">深圳</option>
+    <option value="3">澳门</option>
+    <option value="4">香港</option>
 
 </select>

WebService/src/main/resources/components/floorPackage/floor-select2/floorSelect2.js

@@ -1,5 +1,8 @@
 (function(vc){
     vc.extends({
+        propTypes: {
+               parentModal:vc.propTypes.string
+        },
         data:{
             floorSelect2Info:{
                 floors:[],
@@ -9,14 +12,14 @@
             }
         },
         _initMethod:function(){
+                vc.component._initFloorSelect2();
 
         },
         _initEvent:function(){
-
-            vc.on('floorSelect2','_initFloorSelect2',function (_param) {
-                vc.component._initFloorSelect2();
-            });
-
+            //监听 modal 打开
+            $('#'+$props.parentModal).on('show.bs.modal', function () {
+                 vc.component._initFloorSelect2();
+            })
         },
         methods: {
             _initFloorSelect2: function () {
@@ -24,7 +27,7 @@
                 $('.floorSelector').select2({
                     placeholder: '必填，请选择楼栋',
                     ajax: {
-                        url: "/floorSelect2/list",
+                        url: "/callComponent/floorSelect2/list",
                         dataType: 'json',
                         delay: 250,
                         data: function (params) {
@@ -41,17 +44,19 @@
                             };
                         },
                         cache: true
-                    },
-                    minimumInputLength: 2
+                    }
                 });
                 $('.floorSelector').on("select2:select", function (evt) {
                     //这里是选中触发的事件
                     //evt.params.data 是选中项的信息
+                    console.log('select',evt)
                 });
 
                 $('.floorSelector').on("select2:unselect", function (evt) {
                     //这里是取消选中触发的事件
                     //如配置allowClear: true后，触发
+                    console.log('unselect',evt)
+
                 });
             }
         }

WebService/src/main/resources/components/machinePackage/add-machine/addMachine.html

@@ -64,7 +64,9 @@
                              v-if="addMachineInfo.locationTypeCd == '2000' || addMachineInfo.locationTypeCd == '3000'  ">
                             <label class="col-sm-2 col-form-label">归属楼栋</label>
                             <div class="col-sm-10">
-                                <vc:create name="floorSelect2"></vc:create>
+                                <vc:create name="floorSelect2"
+                                           parentModal="addMachineModel"
+                                ></vc:create>
                             </div>
                         </div>
                         <div class="form-group row"

WebService/src/main/resources/components/roomPackage/addRoomView/addRoomView.html

@@ -9,6 +9,15 @@
             </div>
             <div class="ibox-content">
 
+                <div class="form-group row"
+                     >
+                    <label class="col-sm-2 col-form-label">归属楼栋</label>
+                    <div class="col-sm-10">
+                        <vc:create name="floorSelect2"
+                                   parentModal="addMachineModel"
+                        ></vc:create>
+                    </div>
+                </div>
                 <div class="form-group row">
                     <label class="col-sm-2 col-form-label">房屋编号</label>
                     <div class="col-sm-10">

java110-front/src/main/resources/static/css/common.css

@@ -63,4 +63,31 @@
 .form-group span.required {
     color: #f00;
     font-size: 100%;
-}
+}
+
+/**  修复select2 和 modal bug  **/
+.select2-drop {
+        z-index: 10050 !important;
+    }
+
+    .select2-search-choice-close {
+        margin-top: 0 !important;
+        right: 2px !important;
+        min-height: 10px;
+    }
+
+        .select2-search-choice-close:before {
+            color: black !important;
+        }
+    /*防止select2不会自动失去焦点*/
+    .select2-container {
+        z-index: 16000 !important;
+    }
+
+    .select2-drop-mask {
+        z-index: 15990 !important;
+    }
+
+    .select2-drop-active {
+        z-index: 15995 !important;
+    }