liuyg
2022-03-09 f7167fe6e19783eeef8386b5f74dbc7bdfdab327
pages/registerUser/registerUser.vue
@@ -21,22 +21,29 @@
               </u-radio>
            </u-radio-group>
         </u-form-item>
         <u-form-item v-show="jobValue == '有'" label="单位名称" prop="jobUnit" label-width="200" left-icon="home"
            :required="true">
            <u-input v-model="form.jobUnit" placeholder="请输入单位名称" />
         </u-form-item>
         <u-form-item v-show="jobValue == '有'" label="工作地点" prop="xq" left-icon="map-fill" label-width="200"
            :required="true">
            <u-input v-model="form.xq" type="select" placeholder="请选择工作地点" :border="true"
               @click="regionClick('工作地点')" />
            <u-field :disabled="true" style="width: 100%;" label-width="0" v-model="form.xq" type="textarea"
               placeholder="请选择工作地点" :fixed="true">
               <u-icon @click="regionClick" name="map-fill" slot="right" size="44" label="定位" label-pos="bottom"
                  label-color="#103289" color="#103289"></u-icon>
            </u-field>
         </u-form-item>
         <u-form-item label="居住地" prop="address" left-icon="map" label-width="200" :required="true">
            <u-input v-model="form.address" type="select" placeholder="请选择居住地" :border="true"
               @click="placeClick('居住地')" />
            <u-field :disabled="true" style="width: 100%;" label-width="0" v-model="form.address" type="textarea"
               placeholder="请选择居住地" :fixed="true">
               <u-icon @click="placeClick" name="map-fill" slot="right" size="44" label="定位" label-pos="bottom"
                  label-color="#103289" color="#103289"></u-icon>
            </u-field>
         </u-form-item>
         <u-form-item label="性别" label-width="200" left-icon="man">
            <u-radio-group v-model="form.sex">
               <u-radio v-for="(item, index) in sex" :key="index" :name="item.name" :disabled="item.disabled">
@@ -66,24 +73,6 @@
      <u-button class="submit" @click="zc">
         注册</u-button>
      <map v-show="signLocation" id="SignLocationMap"
         style="position: fixed; left: 0; width: 100%; z-index: 99;"
         :style="{height: screenHeight + 'px', top: screenTop + 'px'}"
         @regionchange="regionChange" :latitude="latitude" :longitude="longitude" :scale="scale">
         <cover-view class="dingwBut">
            <cover-image class="location-log" src="../../static/img/location.png">
            </cover-image>
         </cover-view>
         <cover-view class="confirmBtn" @click="confirmChangeBtn">
            获取地址
         </cover-view>
      </map>
      <!-- <u-button @click="signLocation = true">dakai</u-button> -->
      <!-- <u-button class="submit" @click="submit">提交</u-button> -->
   </view>
</template>
@@ -95,42 +84,35 @@
            var identity =
               /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/;
            if (value.length <= 11) {
               if (phone.test(value)) {
                  this.form.phone = value;
                  return true
               } else {
                  return callback(new Error('手机号格式不正确'));
               }
            // if (value.length <= 11) {
            //    if (phone.test(value)) {
            //       this.form.phone = value;
            //       return true
            //    } else {
            //       return callback(new Error('手机号格式不正确'));
            //    }
            // }
            if (identity.test(value)) {
               this.form.carId = value;
               return true
            } else {
               return callback(new Error('身份证号格式不正确'));
            }
            if (value.length > 11) {
               if (identity.test(value)) {
                  this.form.carId = value;
                  return true
               } else {
                  return callback(new Error('身份证号格式不正确'));
               }
            }
            // if (value.length > 11) {
            // }
         };
         return {
            // 设置高度, TOP值
            screenHeight: 0,
            screenTop: 0,
            // 记录地区获取居住地
            regionOrPlace: '',
            // 地图相关
            scale: 15, //缩放级别
            signLocation: false,
            latitude: 28.678983439095823,
            longitude: 115.84414205551147,
            mapLocationName: '',
            mapLocationLatitude: '',
            mapLocationLongitude: '',
            // 工作地点经纬度
            jobLng: '',
            jobLat: '',
            // 居住地经纬度
            liveLng: '',
            liveLat: '',
            userConsent: false,
            jobValue: '无',
@@ -143,7 +125,6 @@
                  disabled: false
               }
            ],
            regionName: '',
            radioList: [{
                  name: '是',
                  disabled: false
@@ -166,7 +147,7 @@
                  img: 'man-add-fill',
                  froms: 'user',
                  requireds: true,
                  placeholder: '请输入身份证号或手机号'
                  placeholder: '请输入身份证号'
               },
               {
                  title: '密码',
@@ -261,7 +242,6 @@
                  trigger: ['change', 'blur'],
               }, {
                  validator: (rule, value, callback) => {
                     console.log(this.form.pass, value)
                     if (this.form.pass == value) {
                        return true
                     } else {
@@ -279,14 +259,14 @@
                  trigger: ['change', 'blur'],
               }],
               jobUnit: [{
                  required: true,
                  required: false,
                  message: '请输入单位名称',
                  // 可以单个或者同时写两个触发验证方式 
                  trigger: ['change', 'blur'],
               }],
               address: [{
                  required: false,
                  message: '请输入居住地',
                  required: true,
                  message: '请选择居住地',
                  // 可以单个或者同时写两个触发验证方式 
                  trigger: ['change', 'blur'],
               }],
@@ -297,14 +277,14 @@
                  trigger: ['change', 'blur'],
               }],
               signals: [{
                  required: true,
                  required: false,
                  message: '请输入警号',
                  // 可以单个或者同时写两个触发验证方式 
                  trigger: ['change', 'blur'],
               }],
               xq: [{
                  required: true,
                  message: '请选择辖区',
                  required: false,
                  message: '请选择工作地点',
                  // 可以单个或者同时写两个触发验证方式 
                  trigger: ['change', 'blur'],
               }],
@@ -360,13 +340,40 @@
               url: '/pages/registerUser/agreement?e=' + e
            });
         },
         regionClick(e) {
            this.regionOrPlace = e
            this.signLocation = true
         regionClick() {
            let that = this;
            //监听事件
            uni.$on('getLocation', (res) => {
               that.form.xq = res.mapLocationName
               that.form.workjurisdiction = res.regionID
               that.jobLng = res.mapLocationLongitude
               that.jobLat = res.mapLocationLatitude
               //清除监听,不清除会消耗资源
               uni.$off('getLocation');
            })
            uni.navigateTo({
               url: '/pages/registerUser/map?lng=' + that.jobLng + '&lat=' + that.jobLat,
            });
         },
         placeClick(e) {
            this.regionOrPlace = e
            this.signLocation = true
         placeClick() {
            let that = this;
            //监听事件
            uni.$on('getLocation', (res) => {
               that.form.address = res.mapLocationName
               that.form.jurisdiction = res.regionID
               that.liveLng = res.mapLocationLongitude
               that.liveLat = res.mapLocationLatitude
               //清除监听,不清除会消耗资源
               uni.$off('getLocation');
            })
            uni.navigateTo({
               // url: '/pages/registerUser/map'
               url: '/pages/registerUser/map?lng=' + that.liveLng + '&lat=' + that.liveLat
            });
         },
         zc() {
            if (this.userConsent == false) {
@@ -379,6 +386,26 @@
               return
            }
            var that = this;
            //判断是否必填警号和工作地点
            if(that.form.role == "民警"){
               that.rules.signals[0].required = true;
            }
            if(that.jobValue == "有"){
               that.rules.jobUnit[0].required = true;
               that.rules.xq[0].required = true;
            }
            that.$refs.uForm.validate(valid => {
               if (valid) {
                  that.registerEvent()
               }else{
                  return
               }
            });
            uni.request({
               url: that.$store.state.piAPI + '/zc/inspect',
               method: 'GET',
@@ -397,9 +424,7 @@
                     return
                  }
                  that.registerEvent()
                  // that.$refs.uForm.validate(valid => {
                  //    if (valid) {
                  //       var d = that.form;
@@ -415,10 +440,11 @@
            });
         },
         registerEvent() {
            var d = this.form;
            var url = this.$store.state.piAPI + '/zc/inster',
            var that = this;
            var d = that.form;
            var url = that.$store.state.piAPI + '/zc/inster',
               data = {
                  // deptid: ,
                  password: d.pass,
@@ -446,7 +472,6 @@
               method: 'POST',
               data: data,
               success: (result) => {
                  console.log(result, 456)
                  uni.showToast({
                     title: '注册成功,请等待审核',
                     icon: 'none',
@@ -459,9 +484,10 @@
                  }, 2000);
               }
            });
         },
         depl() {
            this.show = true;
         },
@@ -472,85 +498,13 @@
            this.form.jsid = e[0].value
            this.show = false;
         },
         regionChange() { // 移动地图后重新获取门店
            var that = this
            uni.createMapContext('SignLocationMap', this).getCenterLocation({
               success: res => {
                  that.getLocationInfor(res.longitude, res.latitude)
               },
               fail: res => {
                  uni.showModal({
                     content: '获取位置失败',
                     showCancel: false
                  })
               }
            })
         },
         getLocationInfor(longitude, latitude) {
            var that = this
            var point = new plus.maps.Point(longitude, latitude);
            plus.maps.Map.reverseGeocode(
               point, {},
               function(event) {
                  var address = event.address; // 转换后的地理位置
                  var point = event.coord; // 转换后的坐标信息
                  var coordType = event.coordType; // 转换后的坐标系类型
                  that.mapLocationName = address
                  that.mapLocationLongitude = point.longitude
                  that.mapLocationLatitude = point.latitude
               },
               function(e) {}
            );
         },
         confirmChangeBtn() {
            var that = this
            if (this.mapLocationName == "") {
               this.getLocationInfor(this.longitude, this.latitude)
            }
            if (this.regionOrPlace == "工作地点") {
               this.form.xq = this.mapLocationName
            } else {
               this.form.address = this.mapLocationName
            }
            uni.request({
               url: that.$store.state.piAPI + '/jurisdiction/isOnArea',
               method: 'get',
               data: {
                  jd: that.mapLocationLongitude,
                  wd: that.mapLocationLatitude
               },
               success: (res) => {
                  if (this.regionOrPlace == "工作地点") {
                     this.form.workjurisdiction = res.data.data[0].id
                  } else {
                     this.form.jurisdiction = res.data.data[0].id
                  }
               }
            });
            this.signLocation = false
         }
      },
      onReady() {
         var that = this
         this.$refs.uForm.setRules(this.rules);
         uni.getSystemInfo({success: function (res) {
            that.screenHeight = res.windowHeight
            that.screenTop = res.windowTop
         }})
      },
      watch: {
         faceState() {
            // console.log(this.faceState);
            if (this.faceState == -1) {
               this.facebc = '#ff7f29';
               this.faceco = '#fff';
@@ -630,56 +584,5 @@
         margin: 0 10rpx;
         color: #103289;
      }
   }
   @keyframes StartJump {
      0% {
         transform: translateY(-22px);
      }
      50% {
         transform: translateY(-32px);
      }
      100% {
         transform: translateY(-22px);
      }
   }
   .dingwBut {
      width: 48px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      z-index: 999;
      transform: translateY(-22px);
   }
   .confirmBtn {
      width: 96px;
      height: 36px;
      line-height: 32px;
      position: absolute;
      top: auto;
      left: 0;
      right: 0;
      bottom: 18rpx;
      margin: auto;
      z-index: 999;
      text-align: center;
      background: #103289;
      color: #fff;
      border-radius: 5px;
   }
</style>