优化钥匙申请

WebService/src/main/resources/components/applicationKeyPackage/add-applicationKey/addApplicationKey.html

@@ -1,83 +1,164 @@
-<div id="addApplicationKeyModel" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
-     aria-hidden="true">
-    <div class="modal-dialog modal-lg">
-        <div class="modal-content">
-            <div class="modal-body">
-                <h3 class="m-t-none m-b ">添加钥匙申请</h3>
-                <div class="ibox-content">
-                    <div>
-                        <div>
+<div class="row">
+    <div class="col-lg-12">
+        <div class="ibox">
+            <div class="ibox-title">
+                <h5>申请钥匙</h5>
+                <div class="ibox-tools" style="top:10px;">
 
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">姓名</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.name" type="text" placeholder="必填，请填写姓名"
-                                           class="form-control">
-                                </div>
+                </div>
+            </div>
+            <div class="ibox-content">
+                <div class="row">
+                    <div class="col-sm-5" style="text-align:center">
+                        <video id="addApplicationKeyPhoto" style="width: 100%;"></video>
+                        <canvas id="AddApplicationKeyCanvas" style="display:none;"></canvas>
+                        <div style="margin-top:20px">
+                            <button class="btn btn-primary" type="button" v-on:click="_takePhoto()"><span
+                                    class="glyphicon glyphicon-camera"></span> 拍照
+                            </button>
+                            <span class="btn btn-default btn-file" v-on:click="_uploadPhoto($event)">
+                                    <span class="fileinput-new">上传照片</span>
+                                </span>
+                            <input type="file" class="file" accept="images/*" id="uploadApplicationKeyPhoto" hidden
+                                   v-on:change="_choosePhoto($event)">
+                        </div>
+                    </div>
+                    <div class="col-sm-7">
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">姓名</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.name" type="text" placeholder="必填，请填写姓名"
+                                       class="form-control">
+                            </div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">手机号</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.tel" type="text" placeholder="必填，请填写手机号"
+                                       class="form-control">
+                            </div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">用户类型</label>
+                            <div class="col-sm-10">
+                                <select class="custom-select" v-model="addApplicationKeyInfo.typeCd">
+                                    <option selected disabled value="">必填，请选择用户类型</option>
+                                    <option value="10001">保洁</option>
+                                    <option value="10002">保安</option>
+                                    <option value="10003">其他人员</option>
+                                </select></div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">钥匙类型</label>
+                            <div class="col-sm-10">
+                                <select class="custom-select" v-model="addApplicationKeyInfo.typeFlag">
+                                    <option selected disabled value="">必填，请选择钥匙类型申请</option>
+                                    <option value="1100101">人脸</option>
+                                    <option value="1100102">固定密码</option>
+                                    <option value="1100103">临时密码</option>
+                                </select></div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">性别</label>
+                            <div class="col-sm-10">
+                                <select class="custom-select" v-model="addApplicationKeyInfo.sex">
+                                    <option selected disabled value="">必填，请选择性别</option>
+                                    <option value="0">男</option>
+                                    <option value="1">女</option>
+                                </select></div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">年龄</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.age" type="text" placeholder="必填，请填写年龄"
+                                       class="form-control">
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">手机号</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.tel" type="text" placeholder="必填，请填写手机号"
-                                           class="form-control">
-                                </div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">身份证号</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.idCard" type="text" placeholder="必填，请填写身份证号"
+                                       class="form-control">
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">用户类型</label>
-                                <div class="col-sm-10">
-                                    <select class="custom-select" v-model="addApplicationKeyInfo.typeCd">
-                                        <option selected disabled value="">必填，请选择用户类型</option>
-                                        <option value="10001">保洁</option>
-                                        <option value="10002">保安</option>
-                                        <option value="10003">其他人员</option>
-                                    </select></div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">设备位置</label>
+                            <div class="col-sm-10">
+                                <select class="custom-select" v-model="addApplicationKeyInfo.locationTypeCd"
+                                        placeholder="必填，请选择设备位置">
+                                    <option selected disabled value="">必填，请选择设备位置</option>
+                                    <option value="1000">东大门</option>
+                                    <option value="1001">西大门</option>
+                                    <option value="1002">北大门</option>
+                                    <option value="1003">南大门</option>
+                                    <option value="2000">单元门</option>
+                                    <option value="3000">房屋门</option>
+                                </select>
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">性别</label>
-                                <div class="col-sm-10">
-                                    <select class="custom-select" v-model="addApplicationKeyInfo.sex">
-                                        <option selected disabled value="">必填，请选择性别</option>
-                                        <option value="0">男</option>
-                                        <option value="1">女</option>
-                                    </select></div>
+                        </div>
+                        <div class="form-group row"
+                             v-show="addApplicationKeyInfo.locationTypeCd == '2000' || addApplicationKeyInfo.locationTypeCd == '3000'  ">
+                            <label class="col-sm-2 col-form-label">归属楼栋</label>
+                            <div class="col-sm-10">
+                                <vc:create name="floorSelect2"
+                                           parentModal="addApplicationKeyModel"
+                                           namespace="addApplicationKey"
+                                ></vc:create>
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">年龄</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.age" type="text" placeholder="必填，请填写年龄"
-                                           class="form-control">
-                                </div>
+                        </div>
+                        <div class="form-group row"
+                             v-show="addApplicationKeyInfo.locationTypeCd == '2000' || addApplicationKeyInfo.locationTypeCd == '3000'  ">
+                            <label class="col-sm-2 col-form-label">归属单元</label>
+                            <div class="col-sm-10">
+                                <vc:create name="unitSelect2"
+                                           parentModal="addApplicationKeyModel"
+                                           callBackListener="addApplicationKey"
+                                           callBackFunction="notify"
+                                           namespace="addApplicationKey"
+                                ></vc:create>
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">身份证号</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.idCard" type="text" placeholder="必填，请填写身份证号"
-                                           class="form-control">
-                                </div>
+                        </div>
+                        <div class="form-group row"
+                             v-show="addApplicationKeyInfo.locationTypeCd == '3000'  ">
+                            <label class="col-sm-2 col-form-label">归属房屋</label>
+                            <div class="col-sm-10">
+                                <vc:create name="roomSelect2"
+                                           parentModal="addApplicationKeyModel"
+                                           callBackListener="addApplicationKey"
+                                           callBackFunction="notify"
+                                           namespace="addApplicationKey"
+                                ></vc:create>
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">开始时间</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.startTime" type="text"
-                                           placeholder="必填，请填写开始时间" class="form-control">
-                                </div>
+                        </div>
+                        <div class="form-group row">
+                            <label class="col-sm-2 col-form-label">开始时间</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.startTime" readonly type="text"
+                                       placeholder="必填，请填写开始时间"
+                                       class="form-control addApplicationStartTime">
                             </div>
-                            <div class="form-group row">
-                                <label class="col-sm-2 col-form-label">结束时间</label>
-                                <div class="col-sm-10">
-                                    <input v-model="addApplicationKeyInfo.endTime" type="text" placeholder="必填，请填写结束时间"
-                                           class="form-control">
-                                </div>
+                        </div>
+                        <div class="form-group row" v-show="addApplicationKeyInfo.typeFlag == '1100101' || addApplicationKeyInfo.typeFlag == '1100102' ">
+                            <label class="col-sm-2 col-form-label">结束时间</label>
+                            <div class="col-sm-10">
+                                <input v-model="addApplicationKeyInfo.endTime" readonly type="text"
+                                       placeholder="必填，请填写结束时间"
+                                       class="form-control addApplicationEndTime">
                             </div>
+                        </div>
+                        <div class="form-group row" v-if="addApplicationKeyInfo.typeFlag == '1100101'">
+                            <label class="col-sm-2 col-form-label">照片</label>
+                            <div class="col-sm-10"><img width="100%" height="100%"
+                                                        v-bind:src="addApplicationKeyInfo.photo" alt="申请人照片"></div>
+                        </div>
 
-                            <div class="ibox-content">
-                                <button class="btn btn-primary float-right" type="button"
-                                        v-on:click="saveApplicationKeyInfo()"><i class="fa fa-check"></i>&nbsp;保存
-                                </button>
-                                <button type="button" class="btn btn-warning float-right" style="margin-right:20px;"
-                                        data-dismiss="modal">取消
-                                </button>
-                            </div>
+                        <div class="ibox-content">
+                            <button class="btn btn-primary float-right" type="button"
+                                    v-on:click="saveApplicationKeyInfo()"><i class="fa fa-check"></i>&nbsp;保存
+                            </button>
+                            <button type="button" class="btn btn-warning float-right" style="margin-right:20px;"
+                                    v-on:click="_closeAddApplicationKeyView()">取消
+                            </button>
                         </div>
                     </div>
                 </div>
@@ -86,3 +167,4 @@
     </div>
 </div>
 
+

WebService/src/main/resources/components/applicationKeyPackage/add-applicationKey/addApplicationKey.js

@@ -16,19 +16,78 @@
                 idCard: '',
                 startTime: '',
                 endTime: '',
-
+                floorId: '',
+                floorNum: '',
+                floorName: '',
+                unitId: '',
+                unitName: '',
+                roomId: '',
+                locationTypeCd: '',
+                locationObjId: '',
+                roomName: '',
+                typeFlag:'',
+                photo: '',
+                mediaStreamTrack: null
             }
         },
         _initMethod: function () {
-
+            vc.component._initAddApplicationKeyDateInfo();
+            //vc.component._initAddApplicationKeyMedia();
         },
         _initEvent: function () {
             vc.on('addApplicationKey', 'openAddApplicationKeyModal', function () {
                 $('#addApplicationKeyModel').modal('show');
             });
+            vc.on('addApplicationKey', "_initAddApplicationKeyData", function () {
+                vc.component._initAddApplicationKeyMedia();
+            });
+            vc.on("addApplicationKey", "notify", function (_param) {
+                if (_param.hasOwnProperty("floorId")) {
+                    vc.component.addApplicationKeyInfo.floorId = _param.floorId;
+                }
+
+                if (_param.hasOwnProperty("unitId")) {
+                    vc.component.addApplicationKeyInfo.unitId = _param.unitId;
+                }
+
+                if (_param.hasOwnProperty("roomId")) {
+                    vc.component.addApplicationKeyInfo.roomId = _param.roomId;
+                }
+            });
         },
         methods: {
-            addApplicationKeyValidate() {
+            _initAddApplicationKeyDateInfo: function () {
+                vc.component.addApplicationKeyInfo.startTime = vc.dateFormat(new Date().getTime());
+                $('.addApplicationStartTime').datetimepicker({
+                    language: 'zh-CN',
+                    format: 'yyyy-mm-dd hh:ii:ss',
+                    initTime: true,
+                    initialDate: new Date(),
+                    autoClose: 1,
+                    todayBtn: true
+
+                });
+                $('.addApplicationStartTime').datetimepicker()
+                    .on('changeDate', function (ev) {
+                        var value = $(".addApplicationStartTime").val();
+                        vc.component.addApplicationKeyInfo.startTime = value;
+                    });
+                $('.addApplicationEndTime').datetimepicker({
+                    language: 'zh-CN',
+                    format: 'yyyy-mm-dd hh:ii:ss',
+                    initTime: true,
+                    initialDate: new Date(),
+                    autoClose: 1,
+                    todayBtn: true
+                });
+                $('.addApplicationEndTime').datetimepicker()
+                    .on('changeDate', function (ev) {
+                        var value = $(".addApplicationEndTime").val();
+                        vc.component.addApplicationKeyInfo.endTime = value;
+                    });
+            },
+
+            addApplicationKeyValidate: function () {
                 return vc.validate.validate({
                     addApplicationKeyInfo: vc.component.addApplicationKeyInfo
                 }, {
@@ -73,12 +132,8 @@
                             limit: "required",
                             param: "",
                             errInfo: "性别不能为空"
-                        },
-                        {
-                            limit: "num",
-                            param: "",
-                            errInfo: "性别格式错误"
-                        },
+                        }
+
                     ],
                     'addApplicationKeyInfo.age': [
                         {
@@ -128,18 +183,42 @@
                             errInfo: "不是有效的时间格式"
                         },
                     ],
+                    'addApplicationKeyInfo.locationTypeCd': [
+                        {
+                            limit: "required",
+                            param: "",
+                            errInfo: "申请位置不能为空"
+                        }
+                    ],
+                    'addApplicationKeyInfo.locationObjId': [
+                        {
+                            limit: "required",
+                            param: "",
+                            errInfo: "具体位置不能为空"
+                        }
+                    ]
 
 
                 });
             },
             saveApplicationKeyInfo: function () {
+                vc.component.addApplicationKeyInfo.communityId = vc.getCurrentCommunity().communityId;
+                if (vc.component.addApplicationKeyInfo.locationTypeCd != '2000' && vc.component.addApplicationKeyInfo.locationTypeCd != '3000') { //大门时直接写 小区ID
+                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.communityId;
+                } else if (vc.component.addApplicationKeyInfo.locationTypeCd == '2000') {
+                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.unitId;
+                } else if (vc.component.addApplicationKeyInfo.locationTypeCd == '3000') {
+                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.roomId;
+                } else {
+                    vc.toast("设备位置值错误");
+                    return;
+                }
                 if (!vc.component.addApplicationKeyValidate()) {
                     vc.toast(vc.validate.errInfo);
 
                     return;
                 }
 
-                vc.component.addApplicationKeyInfo.communityId = vc.getCurrentCommunity().communityId;
                 //不提交数据将数据 回调给侦听处理
                 if (vc.notNull($props.callBackListener)) {
                     vc.emit($props.callBackListener, $props.callBackFunction, vc.component.addApplicationKeyInfo);
@@ -158,7 +237,7 @@
                         //vm.menus = vm.refreshMenuActive(JSON.parse(json),0);
                         if (res.status == 200) {
                             //关闭model
-                            $('#addApplicationKeyModel').modal('hide');
+                            //$('#addApplicationKeyModel').modal('hide');
                             vc.component.clearAddApplicationKeyInfo();
                             vc.emit('applicationKeyManage', 'listApplicationKey', {});
 
@@ -184,9 +263,92 @@
                     idCard: '',
                     startTime: '',
                     endTime: '',
-
+                    floorId: '',
+                    floorNum: '',
+                    floorName: '',
+                    unitId: '',
+                    unitName: '',
+                    roomId: '',
+                    locationTypeCd: '',
+                    locationObjId: '',
+                    roomName: '',
+                    photo: '',
+                    videoPlaying: false,
+                    mediaStreamTrack: null,
+                    typeFlag:'',
                 };
-            }
+            },
+            _closeAddApplicationKeyView: function () {
+                vc.emit('applicationKeyManage', 'listApplicationKey', {});
+                //关闭拍照摄像头
+                if (vc.component.addApplicationKeyInfo.mediaStreamTrack != null) {
+                    vc.component.addApplicationKeyInfo.mediaStreamTrack.stop();
+                }
+            },
+            _addUserMedia: function () {
+                return navigator.getUserMedia = navigator.getUserMedia ||
+                    navigator.webkitGetUserMedia ||
+                    navigator.mozGetUserMedia ||
+                    navigator.msGetUserMedia || null;
+            },
+            _initAddApplicationKeyMedia: function () {
+                if (vc.component._addUserMedia()) {
+                    vc.component.addApplicationKeyInfo.videoPlaying = false;
+                    var constraints = {
+                        video: true,
+                        audio: false
+                    };
+                    var addVideo = document.getElementById('addApplicationKeyPhoto');
+                    var media = navigator.getUserMedia(constraints, function (stream) {
+                        var url = window.URL || window.webkitURL;
+                        //video.src = url ? url.createObjectURL(stream) : stream;
+                        vc.component.addApplicationKeyInfo.mediaStreamTrack = typeof stream.stop === 'function' ? stream : stream.getTracks()[0];
+                        try {
+                            addVideo.src = url ? url.createObjectURL(stream) : stream;
+                        } catch (error) {
+                            addVideo.srcObject = stream;
+                        }
+                        addVideo.play();
+                        vc.component.addApplicationKeyInfo.videoPlaying = true;
+                    }, function (error) {
+                        console.log("ERROR");
+                        console.log(error);
+                    });
+                } else {
+                    console.log("初始化视频失败");
+                }
+            },
+            _takePhoto: function () {
+                if (vc.component.addApplicationKeyInfo.videoPlaying) {
+                    var canvas = document.getElementById('AddApplicationKeyCanvas');
+                    var takeAddVideo = document.getElementById('AddApplicationKeyPhoto');
+                    canvas.width = takeAddVideo.videoWidth;
+                    canvas.height = takeAddVideo.videoHeight;
+                    canvas.getContext('2d').drawImage(takeAddVideo, 0, 0);
+                    var data = canvas.toDataURL('image/webp');
+                    vc.component.addApplicationKeyInfo.photo = data;
+                    //document.getElementById('photo').setAttribute('src', data);
+                }
+            },
+            _uploadPhoto: function (event) {
+                $("#uploadApplicationKeyPhoto").trigger("click")
+            },
+            _choosePhoto: function (event) {
+                var photoFiles = event.target.files;
+                if (photoFiles && photoFiles.length > 0) {
+                    // 获取目前上传的文件
+                    var file = photoFiles[0];// 文件大小校验的动作
+                    if (file.size > 1024 * 1024 * 1) {
+                        vc.toast("图片大小不能超过 2MB!")
+                        return false;
+                    }
+                    var reader = new FileReader(); //新建FileReader对象
+                    reader.readAsDataURL(file); //读取为base64
+                    reader.onloadend = function (e) {
+                        vc.component.addApplicationKeyInfo.photo = reader.result;
+                    }
+                }
+            },
         }
     });
 

WebService/src/main/resources/components/applicationKeyPackage/add-applicationKeyView/addApplicationKey.html

@@ -1,170 +0,0 @@
-<div class="row">
-    <div class="col-lg-12">
-        <div class="ibox">
-            <div class="ibox-title">
-                <h5>申请钥匙</h5>
-                <div class="ibox-tools" style="top:10px;">
-
-                </div>
-            </div>
-            <div class="ibox-content">
-                <div class="row">
-                    <div class="col-sm-5" style="text-align:center">
-                        <video id="addApplicationKeyPhoto" style="width: 100%;"></video>
-                        <canvas id="AddApplicationKeyCanvas" style="display:none;"></canvas>
-                        <div style="margin-top:20px">
-                            <button class="btn btn-primary" type="button" v-on:click="_takePhoto()"><span
-                                    class="glyphicon glyphicon-camera"></span> 拍照
-                            </button>
-                            <span class="btn btn-default btn-file" v-on:click="_uploadPhoto($event)">
-                                    <span class="fileinput-new">上传照片</span>
-                                </span>
-                            <input type="file" class="file" accept="images/*" id="uploadApplicationKeyPhoto" hidden
-                                   v-on:change="_choosePhoto($event)">
-                        </div>
-                    </div>
-                    <div class="col-sm-7">
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">姓名</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.name" type="text" placeholder="必填，请填写姓名"
-                                       class="form-control">
-                            </div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">手机号</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.tel" type="text" placeholder="必填，请填写手机号"
-                                       class="form-control">
-                            </div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">用户类型</label>
-                            <div class="col-sm-10">
-                                <select class="custom-select" v-model="addApplicationKeyInfo.typeCd">
-                                    <option selected disabled value="">必填，请选择用户类型</option>
-                                    <option value="10001">保洁</option>
-                                    <option value="10002">保安</option>
-                                    <option value="10003">其他人员</option>
-                                </select></div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">钥匙类型</label>
-                            <div class="col-sm-10">
-                                <select class="custom-select" v-model="addApplicationKeyInfo.typeFlag">
-                                    <option selected disabled value="">必填，请选择钥匙类型申请</option>
-                                    <option value="1100101">人脸</option>
-                                    <option value="1100102">固定密码</option>
-                                    <option value="1100103">临时密码</option>
-                                </select></div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">性别</label>
-                            <div class="col-sm-10">
-                                <select class="custom-select" v-model="addApplicationKeyInfo.sex">
-                                    <option selected disabled value="">必填，请选择性别</option>
-                                    <option value="0">男</option>
-                                    <option value="1">女</option>
-                                </select></div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">年龄</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.age" type="text" placeholder="必填，请填写年龄"
-                                       class="form-control">
-                            </div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">身份证号</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.idCard" type="text" placeholder="必填，请填写身份证号"
-                                       class="form-control">
-                            </div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">设备位置</label>
-                            <div class="col-sm-10">
-                                <select class="custom-select" v-model="addApplicationKeyInfo.locationTypeCd"
-                                        placeholder="必填，请选择设备位置">
-                                    <option selected disabled value="">必填，请选择设备位置</option>
-                                    <option value="1000">东大门</option>
-                                    <option value="1001">西大门</option>
-                                    <option value="1002">北大门</option>
-                                    <option value="1003">南大门</option>
-                                    <option value="2000">单元门</option>
-                                    <option value="3000">房屋门</option>
-                                </select>
-                            </div>
-                        </div>
-                        <div class="form-group row"
-                             v-show="addApplicationKeyInfo.locationTypeCd == '2000' || addApplicationKeyInfo.locationTypeCd == '3000'  ">
-                            <label class="col-sm-2 col-form-label">归属楼栋</label>
-                            <div class="col-sm-10">
-                                <vc:create name="floorSelect2"
-                                           parentModal="addApplicationKeyModel"
-                                           namespace="addApplicationKey"
-                                ></vc:create>
-                            </div>
-                        </div>
-                        <div class="form-group row"
-                             v-show="addApplicationKeyInfo.locationTypeCd == '2000' || addApplicationKeyInfo.locationTypeCd == '3000'  ">
-                            <label class="col-sm-2 col-form-label">归属单元</label>
-                            <div class="col-sm-10">
-                                <vc:create name="unitSelect2"
-                                           parentModal="addApplicationKeyModel"
-                                           callBackListener="addApplicationKey"
-                                           callBackFunction="notify"
-                                           namespace="addApplicationKey"
-                                ></vc:create>
-                            </div>
-                        </div>
-                        <div class="form-group row"
-                             v-show="addApplicationKeyInfo.locationTypeCd == '3000'  ">
-                            <label class="col-sm-2 col-form-label">归属房屋</label>
-                            <div class="col-sm-10">
-                                <vc:create name="roomSelect2"
-                                           parentModal="addApplicationKeyModel"
-                                           callBackListener="addApplicationKey"
-                                           callBackFunction="notify"
-                                           namespace="addApplicationKey"
-                                ></vc:create>
-                            </div>
-                        </div>
-                        <div class="form-group row">
-                            <label class="col-sm-2 col-form-label">开始时间</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.startTime" readonly type="text"
-                                       placeholder="必填，请填写开始时间"
-                                       class="form-control addApplicationStartTime">
-                            </div>
-                        </div>
-                        <div class="form-group row" v-show="addApplicationKeyInfo.typeFlag == '1100101' || addApplicationKeyInfo.typeFlag == '1100102' ">
-                            <label class="col-sm-2 col-form-label">结束时间</label>
-                            <div class="col-sm-10">
-                                <input v-model="addApplicationKeyInfo.endTime" readonly type="text"
-                                       placeholder="必填，请填写结束时间"
-                                       class="form-control addApplicationEndTime">
-                            </div>
-                        </div>
-                        <div class="form-group row" v-if="addApplicationKeyInfo.typeFlag == '1100101'">
-                            <label class="col-sm-2 col-form-label">照片</label>
-                            <div class="col-sm-10"><img width="100%" height="100%"
-                                                        v-bind:src="addApplicationKeyInfo.photo" alt="申请人照片"></div>
-                        </div>
-
-                        <div class="ibox-content">
-                            <button class="btn btn-primary float-right" type="button"
-                                    v-on:click="saveApplicationKeyInfo()"><i class="fa fa-check"></i>&nbsp;保存
-                            </button>
-                            <button type="button" class="btn btn-warning float-right" style="margin-right:20px;"
-                                    v-on:click="_closeAddApplicationKeyView()">取消
-                            </button>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
-
-

WebService/src/main/resources/components/applicationKeyPackage/add-applicationKeyView/addApplicationKey.js

@@ -1,355 +0,0 @@
-(function (vc) {
-
-    vc.extends({
-        propTypes: {
-            callBackListener: vc.propTypes.string, //父组件名称
-            callBackFunction: vc.propTypes.string //父组件监听方法
-        },
-        data: {
-            addApplicationKeyInfo: {
-                applicationKeyId: '',
-                name: '',
-                tel: '',
-                typeCd: '',
-                sex: '',
-                age: '',
-                idCard: '',
-                startTime: '',
-                endTime: '',
-                floorId: '',
-                floorNum: '',
-                floorName: '',
-                unitId: '',
-                unitName: '',
-                roomId: '',
-                locationTypeCd: '',
-                locationObjId: '',
-                roomName: '',
-                typeFlag:'',
-                photo: '',
-                mediaStreamTrack: null
-            }
-        },
-        _initMethod: function () {
-            vc.component._initAddApplicationKeyDateInfo();
-            //vc.component._initAddApplicationKeyMedia();
-        },
-        _initEvent: function () {
-            vc.on('addApplicationKey', 'openAddApplicationKeyModal', function () {
-                $('#addApplicationKeyModel').modal('show');
-            });
-            vc.on('addApplicationKey', "_initAddApplicationKeyData", function () {
-                vc.component._initAddApplicationKeyMedia();
-            });
-            vc.on("addApplicationKey", "notify", function (_param) {
-                if (_param.hasOwnProperty("floorId")) {
-                    vc.component.addApplicationKeyInfo.floorId = _param.floorId;
-                }
-
-                if (_param.hasOwnProperty("unitId")) {
-                    vc.component.addApplicationKeyInfo.unitId = _param.unitId;
-                }
-
-                if (_param.hasOwnProperty("roomId")) {
-                    vc.component.addApplicationKeyInfo.roomId = _param.roomId;
-                }
-            });
-        },
-        methods: {
-            _initAddApplicationKeyDateInfo: function () {
-                vc.component.addApplicationKeyInfo.startTime = vc.dateFormat(new Date().getTime());
-                $('.addApplicationStartTime').datetimepicker({
-                    language: 'zh-CN',
-                    format: 'yyyy-mm-dd hh:ii:ss',
-                    initTime: true,
-                    initialDate: new Date(),
-                    autoClose: 1,
-                    todayBtn: true
-
-                });
-                $('.addApplicationStartTime').datetimepicker()
-                    .on('changeDate', function (ev) {
-                        var value = $(".addApplicationStartTime").val();
-                        vc.component.addApplicationKeyInfo.startTime = value;
-                    });
-                $('.addApplicationEndTime').datetimepicker({
-                    language: 'zh-CN',
-                    format: 'yyyy-mm-dd hh:ii:ss',
-                    initTime: true,
-                    initialDate: new Date(),
-                    autoClose: 1,
-                    todayBtn: true
-                });
-                $('.addApplicationEndTime').datetimepicker()
-                    .on('changeDate', function (ev) {
-                        var value = $(".addApplicationEndTime").val();
-                        vc.component.addApplicationKeyInfo.endTime = value;
-                    });
-            },
-
-            addApplicationKeyValidate: function () {
-                return vc.validate.validate({
-                    addApplicationKeyInfo: vc.component.addApplicationKeyInfo
-                }, {
-                    'addApplicationKeyInfo.name': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "姓名不能为空"
-                        },
-                        {
-                            limit: "maxin",
-                            param: "1,64",
-                            errInfo: "姓名不能超过64位"
-                        },
-                    ],
-                    'addApplicationKeyInfo.tel': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "手机号不能为空"
-                        },
-                        {
-                            limit: "phone",
-                            param: "",
-                            errInfo: "手机号格式错误"
-                        },
-                    ],
-                    'addApplicationKeyInfo.typeCd': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "用户类型不能为空"
-                        },
-                        {
-                            limit: "num",
-                            param: "",
-                            errInfo: "用户类型格式错误"
-                        },
-                    ],
-                    'addApplicationKeyInfo.sex': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "性别不能为空"
-                        }
-
-                    ],
-                    'addApplicationKeyInfo.age': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "年龄不能为空"
-                        },
-                        {
-                            limit: "num",
-                            param: "",
-                            errInfo: "年龄不是有效数字"
-                        },
-                    ],
-                    'addApplicationKeyInfo.idCard': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "身份证号不能为空"
-                        },
-                        {
-                            limit: "idCard",
-                            param: "",
-                            errInfo: "不是有效的身份证号"
-                        },
-                    ],
-                    'addApplicationKeyInfo.startTime': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "开始时间不能为空"
-                        },
-                        {
-                            limit: "dateTime",
-                            param: "",
-                            errInfo: "不是有效的时间格式"
-                        },
-                    ],
-                    'addApplicationKeyInfo.endTime': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "结束时间不能为空"
-                        },
-                        {
-                            limit: "dateTime",
-                            param: "",
-                            errInfo: "不是有效的时间格式"
-                        },
-                    ],
-                    'addApplicationKeyInfo.locationTypeCd': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "申请位置不能为空"
-                        }
-                    ],
-                    'addApplicationKeyInfo.locationObjId': [
-                        {
-                            limit: "required",
-                            param: "",
-                            errInfo: "具体位置不能为空"
-                        }
-                    ]
-
-
-                });
-            },
-            saveApplicationKeyInfo: function () {
-                vc.component.addApplicationKeyInfo.communityId = vc.getCurrentCommunity().communityId;
-                if (vc.component.addApplicationKeyInfo.locationTypeCd != '2000' && vc.component.addApplicationKeyInfo.locationTypeCd != '3000') { //大门时直接写 小区ID
-                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.communityId;
-                } else if (vc.component.addApplicationKeyInfo.locationTypeCd == '2000') {
-                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.unitId;
-                } else if (vc.component.addApplicationKeyInfo.locationTypeCd == '3000') {
-                    vc.component.addApplicationKeyInfo.locationObjId = vc.component.addApplicationKeyInfo.roomId;
-                } else {
-                    vc.toast("设备位置值错误");
-                    return;
-                }
-                if (!vc.component.addApplicationKeyValidate()) {
-                    vc.toast(vc.validate.errInfo);
-
-                    return;
-                }
-
-                //不提交数据将数据 回调给侦听处理
-                if (vc.notNull($props.callBackListener)) {
-                    vc.emit($props.callBackListener, $props.callBackFunction, vc.component.addApplicationKeyInfo);
-                    $('#addApplicationKeyModel').modal('hide');
-                    return;
-                }
-
-                vc.http.post(
-                    'addApplicationKey',
-                    'save',
-                    JSON.stringify(vc.component.addApplicationKeyInfo),
-                    {
-                        emulateJSON: true
-                    },
-                    function (json, res) {
-                        //vm.menus = vm.refreshMenuActive(JSON.parse(json),0);
-                        if (res.status == 200) {
-                            //关闭model
-                            //$('#addApplicationKeyModel').modal('hide');
-                            vc.component.clearAddApplicationKeyInfo();
-                            vc.emit('applicationKeyManage', 'listApplicationKey', {});
-
-                            return;
-                        }
-                        vc.message(json);
-
-                    },
-                    function (errInfo, error) {
-                        console.log('请求失败处理');
-
-                        vc.message(errInfo);
-
-                    });
-            },
-            clearAddApplicationKeyInfo: function () {
-                vc.component.addApplicationKeyInfo = {
-                    name: '',
-                    tel: '',
-                    typeCd: '',
-                    sex: '',
-                    age: '',
-                    idCard: '',
-                    startTime: '',
-                    endTime: '',
-                    floorId: '',
-                    floorNum: '',
-                    floorName: '',
-                    unitId: '',
-                    unitName: '',
-                    roomId: '',
-                    locationTypeCd: '',
-                    locationObjId: '',
-                    roomName: '',
-                    photo: '',
-                    videoPlaying: false,
-                    mediaStreamTrack: null,
-                    typeFlag:'',
-                };
-            },
-            _closeAddApplicationKeyView: function () {
-                vc.emit('applicationKeyManage', 'listApplicationKey', {});
-                //关闭拍照摄像头
-                if (vc.component.addApplicationKeyInfo.mediaStreamTrack != null) {
-                    vc.component.addApplicationKeyInfo.mediaStreamTrack.stop();
-                }
-            },
-            _addUserMedia: function () {
-                return navigator.getUserMedia = navigator.getUserMedia ||
-                    navigator.webkitGetUserMedia ||
-                    navigator.mozGetUserMedia ||
-                    navigator.msGetUserMedia || null;
-            },
-            _initAddApplicationKeyMedia: function () {
-                if (vc.component._addUserMedia()) {
-                    vc.component.addApplicationKeyInfo.videoPlaying = false;
-                    var constraints = {
-                        video: true,
-                        audio: false
-                    };
-                    var addVideo = document.getElementById('addApplicationKeyPhoto');
-                    var media = navigator.getUserMedia(constraints, function (stream) {
-                        var url = window.URL || window.webkitURL;
-                        //video.src = url ? url.createObjectURL(stream) : stream;
-                        vc.component.addApplicationKeyInfo.mediaStreamTrack = typeof stream.stop === 'function' ? stream : stream.getTracks()[0];
-                        try {
-                            addVideo.src = url ? url.createObjectURL(stream) : stream;
-                        } catch (error) {
-                            addVideo.srcObject = stream;
-                        }
-                        addVideo.play();
-                        vc.component.addApplicationKeyInfo.videoPlaying = true;
-                    }, function (error) {
-                        console.log("ERROR");
-                        console.log(error);
-                    });
-                } else {
-                    console.log("初始化视频失败");
-                }
-            },
-            _takePhoto: function () {
-                if (vc.component.addApplicationKeyInfo.videoPlaying) {
-                    var canvas = document.getElementById('AddApplicationKeyCanvas');
-                    var takeAddVideo = document.getElementById('AddApplicationKeyPhoto');
-                    canvas.width = takeAddVideo.videoWidth;
-                    canvas.height = takeAddVideo.videoHeight;
-                    canvas.getContext('2d').drawImage(takeAddVideo, 0, 0);
-                    var data = canvas.toDataURL('image/webp');
-                    vc.component.addApplicationKeyInfo.photo = data;
-                    //document.getElementById('photo').setAttribute('src', data);
-                }
-            },
-            _uploadPhoto: function (event) {
-                $("#uploadApplicationKeyPhoto").trigger("click")
-            },
-            _choosePhoto: function (event) {
-                var photoFiles = event.target.files;
-                if (photoFiles && photoFiles.length > 0) {
-                    // 获取目前上传的文件
-                    var file = photoFiles[0];// 文件大小校验的动作
-                    if (file.size > 1024 * 1024 * 1) {
-                        vc.toast("图片大小不能超过 2MB!")
-                        return false;
-                    }
-                    var reader = new FileReader(); //新建FileReader对象
-                    reader.readAsDataURL(file); //读取为base64
-                    reader.onloadend = function (e) {
-                        vc.component.addApplicationKeyInfo.photo = reader.result;
-                    }
-                }
-            },
-        }
-    });
-
-})(window.vc);