From 0e6ddf5d62b9cfc9c9eef94cd62f061627a95633 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 21 Feb 2022 19:45:51 +0800
Subject: [PATCH] 地图
---
pages/registerUser/registerUser - 副本.vue | 677 ++++++++++++++++++++++++++++++++++++++++++++++++
pages/registerUser/registerUser.vue | 78 ++---
leafletMapOur/loginMap/js/vueMain.js | 19 -
pages.json | 4
pages/currentMap/currentMap.vue | 6
5 files changed, 719 insertions(+), 65 deletions(-)
diff --git a/leafletMapOur/loginMap/js/vueMain.js b/leafletMapOur/loginMap/js/vueMain.js
index faf0089..4aef551 100644
--- a/leafletMapOur/loginMap/js/vueMain.js
+++ b/leafletMapOur/loginMap/js/vueMain.js
@@ -23,11 +23,13 @@
popupDisplay: "none",
regionName: '',
- byValue: ''
},
methods: {
getLocalPoliceStation () {
- this.regionName = this.byValue
+
+ uni.postMessage({
+ data: this.regionName
+ })
},
getDataList () {
@@ -121,7 +123,7 @@
// 定位成功之后调用的方法
function showPosition (position) {
- that.byValue = position.district || position.city
+ that.regionName = position.district || position.city
that.lat = position.lat //
that.lng = position.lng //火星坐标 //TODO 实现业务代码逻辑
@@ -170,17 +172,6 @@
},
created () {
- var that = this
- document.addEventListener('UniAppJSBridgeReady', function (e) {
- uni.getEnv(function (res) {
- console.log('当前环境：' + JSON.stringify(res))
- })
-
- // 向uniapp底座发送消息
- uni.postMessage({
- data: that.regionName
- })
- })
},
mounted () {
this.getDataList()
diff --git a/pages.json b/pages.json
index d4c1245..7741474 100644
--- a/pages.json
+++ b/pages.json
@@ -403,9 +403,7 @@
"style": {
"navigationBarTitleText": "获取辖区",
"navigationBarBackgroundColor": "#103289",
- "navigationBarTextStyle": "white",
- "enablePullDownRefresh": false,
- "navigationStyle": "custom"
+ "navigationBarTextStyle": "white"
}
},
{
diff --git a/pages/currentMap/currentMap.vue b/pages/currentMap/currentMap.vue
index 2522f0b..f96a40d 100644
--- a/pages/currentMap/currentMap.vue
+++ b/pages/currentMap/currentMap.vue
@@ -19,11 +19,11 @@
console.log(event)
var regionName = event.detail.data[0]
if (regionName.indexOf('区') != -1) {
- that.regionName = regionName.replace('区', '派出所');
+ that.regionName = regionName.replace('区', '分局');
} else if (regionName.indexOf('县') != -1) {
- that.regionName = regionName.replace('县', '派出所');
+ that.regionName = regionName.replace('县', '分局');
} else if (regionName.indexOf('市') != -1) {
- that.regionName = regionName.replace('市', '市派出所');
+ that.regionName = regionName.replace('市', '市公安局');
}
this.goBack()
diff --git "a/pages/registerUser/registerUser - \345\211\257\346\234\254.vue" "b/pages/registerUser/registerUser - \345\211\257\346\234\254.vue"
new file mode 100644
index 0000000..8975bd2
--- /dev/null
+++ "b/pages/registerUser/registerUser - \345\211\257\346\234\254.vue"
@@ -0,0 +1,677 @@
+<template>
+ <view class="registerUser">
+ <u-form :model="form" ref="uForm">
+ <u-form-item :label="item.title" :prop="item.froms" label-width="200" :left-icon="item.img"
+ :required="item.requireds" v-for="(item, index) in list" :key="index">
+ <u-input v-model="form[item.froms]" :placeholder="item.placeholder" />
+ </u-form-item>
+ <u-form-item label="角色" prop="role" left-icon="account-fill" label-width="200" :required="true">
+ <u-input v-model="form.role" type="select" placeholder="请选择角色" :border="true" @click="depl" />
+ <u-select v-model="show" mode="mutil-column-auto" :list="roleList" @confirm="radioGroupChange">
+ </u-select>
+ </u-form-item>
+ <u-form-item label="工作单位" prop="obj" left-icon="account-fill" label-width="200" :required="true"
+ v-if="xqShow">
+ <u-input v-model="form.obj" placeholder="请输入工作单位" />
+ </u-form-item>
+ <u-form-item label="辖区" prop="xq" left-icon="account-fill" label-width="200" :required="true">
+ <u-input v-model="form.xq" type="select" placeholder="请选择辖区" :border="true" @click="openLoginMap" />
+ <!-- <u-select v-model="showxq" mode="mutil-column-auto" :list="listxq" @confirm="confirmxq"></u-select> -->
+ </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">
+ {{ item.name }}
+ </u-radio>
+ </u-radio-group>
+ </u-form-item>
+ <u-form-item label="是否人脸登录" label-width="240" left-icon="server-man">
+ <u-radio-group v-model="radioValue">
+ <u-radio v-for="(item, index) in radioList" :key="index" :name="item.name"
+ :disabled="item.disabled">
+ {{item.name}}
+ </u-radio>
+ </u-radio-group>
+ (功能研发中)
+ </u-form-item>
+ </u-form>
+ <view class="agree">
+ 注册即代表同意
+ <text class="a">《用户协议》</text>
+ 和
+ <text class="a">《隐私政策》</text>
+ </view>
+ <div class="login-map-bc" v-if="mapShow">
+ <div @click="mapShow = false">
+
+ </div>
+ <div class="login-map-content">
+ <u-icon class="login-map-close" name="close" @click="mapShow = false"></u-icon>
+
+ <view style="width: 100%; height: 100%; position: absolute; ">
+ <web-view :src="loginMapUrl"></web-view>
+ </view>
+ </div>
+ </div>
+
+ <u-button class="submit" @click="zc">
+ 下一步</u-button>
+
+ <!-- <u-button class="submit" @click="submit">提交</u-button> -->
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ var validateUser = (rule, value, callback) => {
+ var phone = /^1(3\d|4[5-9]|5[0-35-9]|6[567]|7[0-8]|8\d|9[0-35-9])\d{8}$/;
+ 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)) {
+ return true
+ } else {
+ return callback(new Error('手机号格式不正确'));
+ }
+ }
+
+ if (value.length <= 18) {
+ if (identity.test(value)) {
+ return true
+ } else {
+ return callback(new Error('身份证号格式不正确'));
+ }
+ }
+
+ };
+
+ return {
+ regionName: '',
+ loginMapUrl: "",
+ radioList: [{
+ name: '是',
+ disabled: false
+ },
+ {
+ name: '否',
+ disabled: false
+ }
+ ],
+ radioValue: '否',
+ mapShow: false,
+ latitude: 28.68, //纬度
+ longitude: 115.85, //经度
+ scale: 12, //缩放级别
+ polyline: [
+ // { //指定一系列坐标点，从数组第一项连线至最后一项
+ // points: [{
+ // latitude: 34.79977,
+ // longitude: 113.66072
+ // },
+ // {
+ // latitude: 34.795541,
+ // longitude: 113.681646
+ // },
+ // ],
+ // color: "#0000AA", //线的颜色
+ // width: 1, //线的宽度
+ // // dottedLine:true,//是否虚线
+ // arrowLine: true, //带箭头的线 开发者工具暂不支持该属性
+ // },
+ ],
+ marker: [],
+ show: false,
+ showxq: false,
+ xqShow: true,
+ listbm: [],
+ listxq: [],
+ deptXb: "",
+ flag: false,
+ list: [{
+ title: '账号',
+ img: 'man-add-fill',
+ froms: 'user',
+ requireds: true,
+ placeholder: '请输入身份证号或手机号'
+ },
+ {
+ title: '密码',
+ img: 'lock-fill',
+ froms: 'pass',
+ requireds: true,
+ placeholder: '请输入6~16位密码'
+ },
+ {
+ title: '确认密码',
+ img: 'lock-fill',
+ froms: 'passTwo',
+ requireds: true,
+ placeholder: '请确认密码'
+ },
+ {
+ title: '姓名',
+ img: 'account',
+ froms: 'name',
+ requireds: true,
+ placeholder: '请输入姓名'
+ },
+ {
+ title: '手机号',
+ img: 'phone-fill',
+ froms: 'phone',
+ requireds: false,
+ placeholder: '请输入手机号'
+ },
+ // {
+ // title: '部门',
+ // img: 'phone-fill',
+ // froms: 'depl',
+ // placeholder: '请选择部门'
+ // },
+
+ ],
+ sex: [{
+ name: '男',
+ disabled: false
+ },
+ {
+ name: '女',
+ disabled: false
+ },
+ ],
+ form: {
+ user: '',
+ pass: '',
+ passTwo: '',
+ name: '',
+ carId: '',
+ phone: '',
+ sex: '男',
+ obj: '',
+ objId: '',
+ xq: '',
+ xqobjId: '',
+ jsid: ''
+ },
+ rules: {
+ user: [{
+ /*
+ u-form提供的可直接调用的js验证，
+ 具体有哪些可以观看官方文档，这里就不在赘述了。
+ */
+ validator: validateUser,
+ trigger: ['change', 'blur'],
+ }, ],
+ pass: [{
+ required: true,
+ message: '请输入6~16位密码',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }, {
+ min: 6,
+ message: '密码不能少于6位',
+ trigger: ['change', 'blur']
+ }, {
+ max: 16,
+ message: '密码不能超出16位',
+ trigger: ['change', 'blur']
+ }],
+ passTwo: [{
+ required: true,
+ message: '请再次输入密码',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }, {
+ validator: (rule, value, callback) => {
+ console.log(this.form.pass, value)
+ if (this.form.pass == value) {
+ return true
+ } else {
+ return false
+ }
+ // return this.$u.test.code(this.form.pass,value);
+ },
+ message: '两次输入密码不正确',
+ trigger: ['change', 'blur'],
+ }],
+ name: [{
+ required: true,
+ message: '请输入姓名',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }],
+ obj: [{
+ required: true,
+ message: '请输入工作单位',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }],
+ role: [{
+ required: true,
+ message: '请选择角色',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }],
+ xq: [{
+ required: true,
+ message: '请选择辖区',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }],
+ depts: [{
+ required: true,
+ message: '请输入姓名',
+ // 可以单个或者同时写两个触发验证方式
+ trigger: ['change', 'blur'],
+ }],
+ // phone: [{
+ // required: false,
+ // message: '请输入手机号',
+ // // 可以单个或者同时写两个触发验证方式
+ // trigger: ['change', 'blur'],
+ // }, {
+ // validator: (rule, value, callback) => {
+ // return this.$u.test.mobile(value);
+ // },
+ // message: '手机号码不正确',
+ // trigger: ['change', 'blur'],
+ // }],
+ },
+ showGetFace: false,
+ faceState: -2,
+ facebc: '#fff',
+ faceco: '#000',
+ faceMsg: '',
+ roleList: [{
+ label: '民警',
+ value: 1417092295132561409
+ },
+ {
+ label: '治保会队伍',
+ value: 1424615693403414529
+ },
+ {
+ label: '内保干部队伍',
+ value: 1424615773594312705
+ },
+ {
+ label: '治安巡防队伍',
+ value: 1424615835435130881
+ },
+ {
+ label: '信息员队伍',
+ value: 1424615909959524354
+ },
+ {
+ label: '保安员队伍',
+ value: 1424615972718895106
+ },
+ {
+ label: '警务辅助队伍',
+ value: 1424616047083905026
+ },
+ {
+ label: '平安志愿者',
+ value: 1494565079268491266
+ }
+ ]
+ };
+ },
+
+ onShow() {
+ let that = this
+ uni.$on('updateDataRegionName', function(data) {
+ that.regionName = data
+ that.form.xq = that.regionName
+ })
+ },
+ methods: {
+ handleMessage(name) {
+ console.log(name)
+ if (name.indexOf('区') != -1) {
+ that.regionName = name.replace('区', '派出所');
+ } else if (name.indexOf('县') != -1) {
+ that.regionName = name.replace('县', '派出所');
+ } else if (name.indexOf('市') != -1) {
+ that.regionName = name.replace('市', '市派出所');
+ }
+
+
+ },
+ openLoginMap() {
+ var that = this
+ uni.getLocation({
+ type: 'wgs84',
+ success: function(res) {
+ console.log('当前位置的经度：' + res.longitude);
+ console.log('当前位置的纬度：' + res.latitude);
+ that.latitude = res.latitude
+ that.longitude = res.longitude
+ that.marker = [{
+ id: 0,
+ latitude: res.latitude, //纬度
+ longitude: res.longitude, //经度
+ iconPath: '/static/img/map/location.png', //显示的图标
+ rotate: 0, // 旋转度数
+ width: 20, //宽
+ height: 20, //高
+ title: '位置', //标注点名
+ alpha: 1, //透明度
+ }]
+
+ var data = [{
+ "id": '100000',
+ "place": '无数据',
+ "state": '0',
+ "dtype": '0',
+ "size": '300',
+ "jd": res.longitude,
+ "wd": res.latitude
+ }]
+
+ uni.navigateTo({
+ url: '/pages/currentMap/currentMap?data=' + JSON.stringify(data)
+ })
+
+
+ // that.loginMapUrl =
+ // 'http://192.168.0.115:5500/leafletMapOur/loginMap/loginMap.html?data=' + data
+
+ // // that.loginMapUrl = 'http://223.82.109.183:2082/loginMap/loginMap.html?data=' + data
+ // that.mapShow = true
+ }
+ })
+
+ },
+ zc() {
+ var that = this;
+ uni.request({
+ url: that.$store.state.piAPI + '/zc/inspect',
+ method: 'GET',
+ data: {
+ username: this.form.user
+ },
+ success: (res) => {
+
+ if (res.data.code == 400) {
+ uni.showToast({
+ title: res.data.msg,
+ icon: 'none',
+ duration: 2000
+ });
+
+ return
+
+ }
+
+ that.$refs.uForm.validate(valid => {
+ if (valid) {
+ var d = that.form;
+ uni.navigateTo({
+ url: '/pages/registerUser/idphoto?data= ' +
+ encodeURIComponent(JSON.stringify(
+ d))
+ });
+ }
+ });
+ }
+ });
+
+ },
+ depl() {
+ var that = this;
+ that.show = true;
+ },
+ // depl() {
+ // var that = this;
+ // uni.request({
+ // url: that.$store.state.piAPI + "/blade-system/dept/trees",
+ // method: 'get',
+ // success: (res) => {
+ // var routerArr = res.data.data;
+ // var arr = that.formatRoutes(routerArr);
+ // var list = [];
+ // if (that.deptXb != "") {
+ // list.push(arr[that.deptXb]);
+ // for (var i = 0; i < list.length; i++) {
+ // list[i].children.unshift({
+ // label: '--请选择--',
+ // value: 0,
+ // children: []
+ // })
+ // for (var j = 0; j < list[i].children.length; j++) {
+ // list[i].children[j].children.unshift({
+ // label: '--请选择--',
+ // value: 0,
+ // })
+ // }
+ // }
+ // that.listbm = list;
+ // that.show = true;
+ // } else {
+ // uni.showToast({
+ // title: '请选择角色',
+ // icon: "none",
+ // duration: 1000
+ // });
+ // }
+ // }
+ // })
+ // },
+ deplxq() {
+ var that = this;
+ uni.request({
+ url: that.$store.state.piAPI + "/jurisdiction/tree",
+ method: 'get',
+ success: (res) => {
+ var routerArr = res.data.data;
+ var arr = that.formatRoutes(routerArr);
+ var list = [];
+ list.push(arr);
+ for (var i = 0; i < arr.length; i++) {
+ arr[i].children.unshift({
+ label: '--请选择--',
+ value: 0,
+ children: []
+ })
+ for (var j = 0; j < arr[i].children.length; j++) {
+ arr[i].children[j].children.unshift({
+ label: '--请选择--',
+ value: 0,
+ })
+ }
+ }
+ that.listxq = arr;
+ that.showxq = true;
+ }
+ })
+ },
+ confirmxq(e) {
+ var arr = "";
+ var data = [];
+ for (var i = 0; i < e.length; i++) {
+ if (e[i].value != "0") {
+ arr += e[i].value + ",";
+ data.push(e[i]);
+ }
+ }
+ var obj = arr.substr(0, arr.length - 1);
+ this.form.xq = data[data.length - 1].label;
+ this.form.xqobjId = obj;
+ console.log(obj)
+ },
+ formatRoutes(routerArr) {
+ var that = this;
+ const arr = [];
+ let obj = {};
+ routerArr.forEach(router => {
+ const tmp = {
+ ...router
+ };
+ if (tmp.hasChildren == true) {
+ tmp.children = that.formatRoutes(tmp.children);
+
+ const {
+ id,
+ title
+ } = router;
+
+ obj = {
+ label: tmp.title,
+ value: tmp.id,
+ children: tmp.children
+ }
+ } else if (tmp.hasChildren == false || typeof(tmp.hasChildren) == 'undefined') {
+ obj = {
+ label: tmp.title,
+ value: tmp.id,
+ children: []
+ }
+ }
+ arr.push(obj);
+ })
+ return arr;
+ },
+ startRecord() {
+ this.flag = true;
+ // this.$message.success('开始录制')
+ this.$refs.video.startRecord();
+ },
+ stopRecord() {
+ this.flag = false;
+ // this.$message.success('请看控制台视频文件的base64')
+ this.$refs.video.stopRecord();
+ },
+ dataChange(data) {
+ console.log(data);
+ },
+ // 选中任一radio时，由radio-group触发
+ radioGroupChange(e) {
+
+ this.form.role = e[0].label
+ this.form.jsid = e[0].value
+
+ this.show = false;
+ }
+ },
+ onReady() {
+ this.$refs.uForm.setRules(this.rules);
+ },
+ watch: {
+ faceState() {
+ // console.log(this.faceState);
+ if (this.faceState == -1) {
+ this.facebc = '#ff7f29';
+ this.faceco = '#fff';
+ this.faceMsg = '(信息有误！请重新验证)';
+ } else if (this.faceState == 1) {
+ this.facebc = '#15dd55';
+ this.faceMsg = '(验证成功！)';
+ this.faceco = '#fff';
+ } else if (this.faceState == 0) {
+ this.facebc = '#f7f7f7';
+ this.faceco = '#000';
+ this.faceMsg = '(服务连接失败！)';
+ }
+ }
+
+ }
+ };
+</script>
+</script>
+
+<style lang="scss" scoped>
+ .login-map-bc {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 111;
+ background: rgba(0, 0, 0, .3);
+ }
+
+ .login-map-content {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 222;
+ border-radius: 15px 15px 0 0;
+ overflow: hidden;
+
+ iframe {
+ border: none;
+ }
+ }
+
+ .login-map-close {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ width: 20px;
+ height: 20px;
+ z-index: 11;
+ }
+
+ .warp {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ }
+
+ .rect {
+ text-align: center;
+ width: 120px;
+ height: 120px;
+ }
+
+ .submit {
+ margin: 30rpx 50rpx 50rpx;
+ border: none;
+ width: 572rpx;
+ height: 86rpx;
+ line-height: 86rpx;
+ box-sizing: border-box;
+ border-radius: 15rpx;
+ background-color: #103289;
+ color: #ffffff;
+
+ &::after {
+ content: none;
+ }
+
+ &::before {
+ content: none;
+ }
+
+ &[disabled='true'] {
+ background: #e4e4e4;
+ font-size: 36rpx;
+ font-family: Source Han Sans CN;
+ font-weight: 500;
+ color: #ffffff;
+ }
+ }
+
+ .registerUser {
+ padding: 0 1.2rem;
+ }
+
+ .agree {
+ margin: 27rpx 95rpx 0;
+ font-size: 22rpx;
+ font-family: Adobe Heiti Std;
+ font-weight: normal;
+ color: #cacaca;
+ line-height: 34rpx;
+
+ .a {
+ color: #000000;
+ }
+ }
+</style>
diff --git a/pages/registerUser/registerUser.vue b/pages/registerUser/registerUser.vue
index 8975bd2..ce91e85 100644
--- a/pages/registerUser/registerUser.vue
+++ b/pages/registerUser/registerUser.vue
@@ -316,6 +316,39 @@
label: '平安志愿者',
value: 1494565079268491266
}
+ ],
+ region: [{
+ label: '民警',
+ value: 1417092295132561409
+ },
+ {
+ label: '治保会队伍',
+ value: 1424615693403414529
+ },
+ {
+ label: '内保干部队伍',
+ value: 1424615773594312705
+ },
+ {
+ label: '治安巡防队伍',
+ value: 1424615835435130881
+ },
+ {
+ label: '信息员队伍',
+ value: 1424615909959524354
+ },
+ {
+ label: '保安员队伍',
+ value: 1424615972718895106
+ },
+ {
+ label: '警务辅助队伍',
+ value: 1424616047083905026
+ },
+ {
+ label: '平安志愿者',
+ value: 1494565079268491266
+ }
]
};
},
@@ -338,51 +371,6 @@
that.regionName = name.replace('市', '市派出所');
}
-
- },
- openLoginMap() {
- var that = this
- uni.getLocation({
- type: 'wgs84',
- success: function(res) {
- console.log('当前位置的经度：' + res.longitude);
- console.log('当前位置的纬度：' + res.latitude);
- that.latitude = res.latitude
- that.longitude = res.longitude
- that.marker = [{
- id: 0,
- latitude: res.latitude, //纬度
- longitude: res.longitude, //经度
- iconPath: '/static/img/map/location.png', //显示的图标
- rotate: 0, // 旋转度数
- width: 20, //宽
- height: 20, //高
- title: '位置', //标注点名
- alpha: 1, //透明度
- }]
-
- var data = [{
- "id": '100000',
- "place": '无数据',
- "state": '0',
- "dtype": '0',
- "size": '300',
- "jd": res.longitude,
- "wd": res.latitude
- }]
-
- uni.navigateTo({
- url: '/pages/currentMap/currentMap?data=' + JSON.stringify(data)
- })
-
-
- // that.loginMapUrl =
- // 'http://192.168.0.115:5500/leafletMapOur/loginMap/loginMap.html?data=' + data
-
- // // that.loginMapUrl = 'http://223.82.109.183:2082/loginMap/loginMap.html?data=' + data
- // that.mapShow = true
- }
- })
},
zc() {
--
Gitblit v1.9.3