apply-clients 7.1.36-yuchuan-8 → 7.1.36-yuchuan-9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/android.html +28 -28
  2. package/build/dev-server.js +6 -6
  3. package/package.json +1 -1
  4. package/src/applyAndroid.js +97 -96
  5. package/src/components/android/AppSign.vue +1 -0
  6. package/src/components/product/ApplyMap/ApplyInputSearch.vue +212 -212
  7. package/src/components/product/ApplyMap/ApplyMapInputSearch.vue +335 -0
package/android.html CHANGED
@@ -1,28 +1,28 @@
1
- <!DOCTYPE html>
2
- <html lang="zh-CN">
3
- <head>
4
- <meta charset="utf-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
- <META HTTP-EQUIV="pragma" CONTENT="no-cache">
7
- <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
8
- <META HTTP-EQUIV="expires" CONTENT="0">
9
- <title>移动报建系统</title>
10
- <script type="text/javascript">
11
- window._AMapSecurityConfig = {
12
- serviceHost: 'http://61.134.61.238:8555/_AMapService'
13
- // 例如 ：serviceHost:'http://1.1.1.1:80/_AMapService',
14
- }
15
- </script>
16
- <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.2&key=aa8b7c6a524337cb733152217fc1e52b"></script>
17
- <!--引入UI组件库（1.1版本） -->
18
- <script src="https://webapi.amap.com/ui/1.1/main.js?v=1.1.1"></script>
19
- <style media="screen">
20
- /*url(./static/newmainbg.jpg)*/
21
- body{width: 100%;background:#7f8eaf no-repeat center bottom; background-size: cover;}
22
- body .loginbg{ width:100%; height:100%; background:url(./static/loginbg.jpg) no-repeat center top;}
23
- </style>
24
- </head>
25
- <body>
26
- <android-app></android-app>
27
- </body>
28
- </html>
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6
+ <META HTTP-EQUIV="pragma" CONTENT="no-cache">
7
+ <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
8
+ <META HTTP-EQUIV="expires" CONTENT="0">
9
+ <title>移动报建系统</title>
10
+ <script type="text/javascript">
11
+ window._AMapSecurityConfig = {
12
+ serviceHost: 'http://61.134.61.238:8555/_AMapService'
13
+ // 例如 ：serviceHost:'http://1.1.1.1:80/_AMapService',
14
+ }
15
+ </script>
16
+ <script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=aa8b7c6a524337cb733152217fc1e52b"></script>
17
+ <!--引入UI组件库（1.1版本） -->
18
+ <script src="https://webapi.amap.com/ui/1.1/main.js?v=1.1.1"></script>
19
+ <style media="screen">
20
+ /*url(./static/newmainbg.jpg)*/
21
+ body{width: 100%;background:#7f8eaf no-repeat center bottom; background-size: cover;}
22
+ body .loginbg{ width:100%; height:100%; background:url(./static/loginbg.jpg) no-repeat center top;}
23
+ </style>
24
+ </head>
25
+ <body>
26
+ <android-app></android-app>
27
+ </body>
28
+ </html>
package/build/dev-server.js CHANGED
@@ -6,14 +6,14 @@ var proxyMiddleware = require('http-proxy-middleware')
6
6
  var app = express()
7
7
  var compiler = webpack(config)
8
8
  // var proxy = httpProxy.createProxyServer()
9
- var ldap = 'http://193.168.1.44:8400/'
9
+ // var ldap = 'http://193.168.1.44:8400/'
10
10
  // var applyinstall = 'http://121.36.79.201:8400'
11
11
  // var ldap = 'http://193.168.1.64:8082'
12
- // var ldap = 'http://61.134.61.238:8555'
13
- // var applyinstall = 'http://61.134.61.238:8555'
14
- var applyinstall = 'http://193.168.1.44:8400/'
15
- var fadada = 'http://193.168.1.44:8400/'
16
- // var fadada = 'http://61.134.61.238:8555'
12
+ var ldap = 'http://61.134.61.238:8655'
13
+ var applyinstall = 'http://61.134.61.238:8655'
14
+ // var applyinstall = 'http://193.168.1.44:8400/'
15
+ // var fadada = 'http://193.168.1.44:8400/'
16
+ var fadada = 'http://61.134.61.238:8655'
17
17
  // var fadada = 'http://127.0.0.1:8080/'
18
18
  var proxyTable = {
19
19
  '/api/af-auth/login': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "apply-clients",
3
- "version": "7.1.36-yuchuan-8",
3
+ "version": "7.1.36-yuchuan-9",
4
4
  "description": "报建前端模块",
5
5
  "main": "src/index.js",
6
6
  "directories": {
package/src/applyAndroid.js CHANGED
@@ -1,96 +1,97 @@
1
- import Vue from 'vue'
2
- import { all } from 'vue-client'
3
- Vue.config.silent = true
4
- import ApplyGetSaleParam from './stores/ApplyGetSaleParams'
5
- import ApplyLoadParams from './stores/ApplyLoadParams'
6
- /** ****************服务插件*********************/
7
-
8
- export default function () {
9
- Vue.use(ApplyGetSaleParam)
10
- Vue.use(ApplyLoadParams)
11
- /** ***************************报建模块*********************************/
12
- // 报建待办 总入口
13
- Vue.component('app-exploration-user', (resolve) => { require(['./components/android/Process/AppExplorationUser'], resolve) })
14
- Vue.component('app-service-control', (resolve) => { require(['./components/android/Process/AppServiceControl'], resolve) })
15
-
16
- // 流程监控
17
- Vue.component('app-process-supervisory', (resolve) => { require(['./components/android/Supervisory/AppProcessSupervisory'], resolve) })
18
- Vue.component('app-supervisory-cart', (resolve) => { require(['./components/android/Supervisory/AppSupervisoryCart'], resolve) })
19
-
20
- // 通用组件
21
- Vue.component('app-take-pic', (resolve) => { require(['./components/android/AppTakePic'], resolve) })
22
- Vue.component('app-service-view', (resolve) => { require(['./components/android/AppServiceView'], resolve) })
23
- Vue.component('app-onetomany', (resolve) => { require(['./components/android/AppOnetomany'], resolve) })
24
- Vue.component('task-graph', (resolve) => { require(['./components/android/TaskGraph'], resolve) })
25
- Vue.component('app-sign', (resolve) => { require(['./components/android/AppSign'], resolve) })
26
- Vue.component('app-upload', (resolve) => { require(['./components/android/AppUpload'], resolve) })
27
-
28
- // 地图任务
29
- // 现场勘察
30
- Vue.component('survey-tsak', (resolve) => { require(['./components/android/Task/Survey/SurveyTsak'], resolve) })
31
- // 工程施工
32
- Vue.component('build-tsak', (resolve) => { require(['./components/android/Task/Build/BuildTsak'], resolve) })
33
- // 工程派工
34
- Vue.component('upbuild-tsak', (resolve) => { require(['./components/android/Task/UpBuild/UpBuildTsak'], resolve) })
35
- // 工程队派工
36
- Vue.component('upbuild-dui', (resolve) => { require(['./components/android/Task/UpBuild/UpBuildDui'], resolve) })
37
- // 监理单位派工
38
- Vue.component('upbuild-JianLi', (resolve) => { require(['./components/android/Task/UpBuild/UpJianLi'], resolve) })
39
- // 施工信息查看
40
- Vue.component('show-build', (resolve) => { require(['./components/android/Task/ShiGongXinXi/ShowBuild'], resolve) })
41
- // 施工信息控制层
42
- Vue.component('app-build-user', (resolve) => { require(['./components/android/Task/ShiGongXinXi/AppShowBuildUser'], resolve) })
43
- // 已办信息
44
- Vue.component('show-done', (resolve) => { require(['./components/android/Task/yiban/ShowDone'], resolve) })
45
- // 已办信息控制层
46
- Vue.component('app-satisfaction-show', (resolve) => { require(['./components/android/Task/yiban/satisfactionShow'], resolve) })
47
- Vue.component('app-build-done', (resolve) => { require(['./components/android/Task/yiban/AppShowDone'], resolve) })
48
- // 施工通气
49
- Vue.component('app-build-ignition', (resolve) => { require(['./components/android/Task/BuildIgnition/BuildIgnition'], resolve) })
50
-
51
- Vue.component('app-installation-details', (resolve) => { require(['./components/android/Process/Processes/AppInstallationDetails'], resolve) })
52
- Vue.component('app-devices-management', (resolve) => { require(['./components/android/Process/Processes/AppDevicesManagement'], resolve) })
53
- Vue.component('survey-user-sign', (resolve) => { require(['./components/android/Process/Processes/SurveyUserSign'], resolve) })
54
-
55
- // 通气点火
56
- Vue.component('ventilation-ignition', (resolve) => { require(['./components/android/Ignition/VentilationIgnition'], resolve) })
57
- Vue.component('ventilation-ignition-handle', (resolve) => { require(['./components/android/Ignition/VentilationIgnitionHandle'], resolve) })
58
-
59
- // 签字
60
- Vue.component('app-sign-task', (resolve) => { require(['./components/android/Sign/AppSignTask'], resolve) })
61
- Vue.component('sign-process', (resolve) => { require(['./components/android/Sign/SignProcess'], resolve) })
62
-
63
- // 出具设计图纸
64
- Vue.component('design-rawings', (resolve) => { require(['./components/android/newPackage/designDrawings'], resolve) })
65
- // 工程报价
66
- Vue.component('project-Price', (resolve) => { require(['./components/android/newPackage/projectPrice'], resolve) })
67
- // 客服管理
68
- Vue.component('customer-manager', (resolve) => { require(['./components/android/newPackage/customerServiceManager'], resolve) })
69
- // 详细数据
70
- Vue.component('detailed-data', (resolve) => { require(['./components/android/newPackage/detailedData'], resolve) })
71
-
72
- // 地图
73
- Vue.component('apply-map-com', (resolve) => { require(['./components/product/ApplyMap/ApplyMapCom'], resolve) })
74
- Vue.component('apply-input-search', (resolve) => { require(['./components/product/ApplyMap/ApplyInputSearch'], resolve) })
75
- Vue.component('apply-drag-list', (resolve) => { require(['./components/product/ApplyMap/ApplyDragaboutList'], resolve) })
76
- Vue.component('apply-map-location', (resolve) => { require(['./components/product/ApplyMap/ApplyMapLocation'], resolve) })
77
- // 安检维修界面
78
- Vue.component('app-repair-from', (resolve) => { require(['./components/android/Task/RepairFromSend/RepairFrom'], resolve) })
79
- Vue.component('app-repair-send', (resolve) => { require(['./components/android/Task/RepairFromSend/RepairSend'], resolve) })
80
- // 设备变更
81
- Vue.component('new-app-installation-details', (resolve) => { require(['./components/android/Process/Processes/newAppInstallationDetails.vue'], resolve) })
82
- Vue.component('new-app-devices-management', (resolve) => { require(['./components/android/Process/Processes/newAppDevicesManagement'], resolve) })
83
- // 改线业务审核
84
- Vue.component('bu-zhang-shenhe', (resolve) => { require(['./components/android/Task/ShenHe/BuZhangShenHe'], resolve) })
85
- Vue.component('jing-li-shenhe', (resolve) => { require(['./components/android/Task/ShenHe/JingLiShenHe'], resolve) })
86
- // 拆除用户管理
87
- Vue.component('app-chai-chu-management', (resolve) => { require(['./components/android/Process/Processes/AppChaiChuInfo.vue'], resolve) })
88
- // 管线建设
89
- Vue.component('app-exploration-guan-xian', (resolve) => { require(['./components/android/Task/GuanXianJianShe/AppExplorationGuanXian.vue'], resolve) })
90
- // 管线建设
91
- Vue.component('app-guan-xian-cailiao', (resolve) => { require(['./components/android/Task/GuanXianJianShe/AppGuanXianCaiLiao.vue'], resolve) })
92
- // 铅封管理
93
- Vue.component('seal-manage', (resolve) => { require(['./components/android/SealManage'], resolve) })
94
- // 铅封绑定
95
- Vue.component('seal-bind', (resolve) => { require(['./components/android/SealBind'], resolve) })
96
- }
1
+ import Vue from 'vue'
2
+ import { all } from 'vue-client'
3
+ Vue.config.silent = true
4
+ import ApplyGetSaleParam from './stores/ApplyGetSaleParams'
5
+ import ApplyLoadParams from './stores/ApplyLoadParams'
6
+ /** ****************服务插件*********************/
7
+
8
+ export default function () {
9
+ Vue.use(ApplyGetSaleParam)
10
+ Vue.use(ApplyLoadParams)
11
+ /** ***************************报建模块*********************************/
12
+ // 报建待办 总入口
13
+ Vue.component('app-exploration-user', (resolve) => { require(['./components/android/Process/AppExplorationUser'], resolve) })
14
+ Vue.component('app-service-control', (resolve) => { require(['./components/android/Process/AppServiceControl'], resolve) })
15
+
16
+ // 流程监控
17
+ Vue.component('app-process-supervisory', (resolve) => { require(['./components/android/Supervisory/AppProcessSupervisory'], resolve) })
18
+ Vue.component('app-supervisory-cart', (resolve) => { require(['./components/android/Supervisory/AppSupervisoryCart'], resolve) })
19
+
20
+ // 通用组件
21
+ Vue.component('app-take-pic', (resolve) => { require(['./components/android/AppTakePic'], resolve) })
22
+ Vue.component('app-service-view', (resolve) => { require(['./components/android/AppServiceView'], resolve) })
23
+ Vue.component('app-onetomany', (resolve) => { require(['./components/android/AppOnetomany'], resolve) })
24
+ Vue.component('task-graph', (resolve) => { require(['./components/android/TaskGraph'], resolve) })
25
+ Vue.component('app-sign', (resolve) => { require(['./components/android/AppSign'], resolve) })
26
+ Vue.component('app-upload', (resolve) => { require(['./components/android/AppUpload'], resolve) })
27
+
28
+ // 地图任务
29
+ // 现场勘察
30
+ Vue.component('survey-tsak', (resolve) => { require(['./components/android/Task/Survey/SurveyTsak'], resolve) })
31
+ // 工程施工
32
+ Vue.component('build-tsak', (resolve) => { require(['./components/android/Task/Build/BuildTsak'], resolve) })
33
+ // 工程派工
34
+ Vue.component('upbuild-tsak', (resolve) => { require(['./components/android/Task/UpBuild/UpBuildTsak'], resolve) })
35
+ // 工程队派工
36
+ Vue.component('upbuild-dui', (resolve) => { require(['./components/android/Task/UpBuild/UpBuildDui'], resolve) })
37
+ // 监理单位派工
38
+ Vue.component('upbuild-JianLi', (resolve) => { require(['./components/android/Task/UpBuild/UpJianLi'], resolve) })
39
+ // 施工信息查看
40
+ Vue.component('show-build', (resolve) => { require(['./components/android/Task/ShiGongXinXi/ShowBuild'], resolve) })
41
+ // 施工信息控制层
42
+ Vue.component('app-build-user', (resolve) => { require(['./components/android/Task/ShiGongXinXi/AppShowBuildUser'], resolve) })
43
+ // 已办信息
44
+ Vue.component('show-done', (resolve) => { require(['./components/android/Task/yiban/ShowDone'], resolve) })
45
+ // 已办信息控制层
46
+ Vue.component('app-satisfaction-show', (resolve) => { require(['./components/android/Task/yiban/satisfactionShow'], resolve) })
47
+ Vue.component('app-build-done', (resolve) => { require(['./components/android/Task/yiban/AppShowDone'], resolve) })
48
+ // 施工通气
49
+ Vue.component('app-build-ignition', (resolve) => { require(['./components/android/Task/BuildIgnition/BuildIgnition'], resolve) })
50
+
51
+ Vue.component('app-installation-details', (resolve) => { require(['./components/android/Process/Processes/AppInstallationDetails'], resolve) })
52
+ Vue.component('app-devices-management', (resolve) => { require(['./components/android/Process/Processes/AppDevicesManagement'], resolve) })
53
+ Vue.component('survey-user-sign', (resolve) => { require(['./components/android/Process/Processes/SurveyUserSign'], resolve) })
54
+
55
+ // 通气点火
56
+ Vue.component('ventilation-ignition', (resolve) => { require(['./components/android/Ignition/VentilationIgnition'], resolve) })
57
+ Vue.component('ventilation-ignition-handle', (resolve) => { require(['./components/android/Ignition/VentilationIgnitionHandle'], resolve) })
58
+
59
+ // 签字
60
+ Vue.component('app-sign-task', (resolve) => { require(['./components/android/Sign/AppSignTask'], resolve) })
61
+ Vue.component('sign-process', (resolve) => { require(['./components/android/Sign/SignProcess'], resolve) })
62
+
63
+ // 出具设计图纸
64
+ Vue.component('design-rawings', (resolve) => { require(['./components/android/newPackage/designDrawings'], resolve) })
65
+ // 工程报价
66
+ Vue.component('project-Price', (resolve) => { require(['./components/android/newPackage/projectPrice'], resolve) })
67
+ // 客服管理
68
+ Vue.component('customer-manager', (resolve) => { require(['./components/android/newPackage/customerServiceManager'], resolve) })
69
+ // 详细数据
70
+ Vue.component('detailed-data', (resolve) => { require(['./components/android/newPackage/detailedData'], resolve) })
71
+
72
+ // 地图
73
+ Vue.component('apply-map-com', (resolve) => { require(['./components/product/ApplyMap/ApplyMapCom'], resolve) })
74
+ Vue.component('apply-input-search', (resolve) => { require(['./components/product/ApplyMap/ApplyInputSearch'], resolve) })
75
+ Vue.component('apply-drag-list', (resolve) => { require(['./components/product/ApplyMap/ApplyDragaboutList'], resolve) })
76
+ Vue.component('apply-map-location', (resolve) => { require(['./components/product/ApplyMap/ApplyMapLocation'], resolve) })
77
+ Vue.component('apply-map-input-search', (resolve) => { require(['./components/product/ApplyMap/ApplyMapInputSearch'], resolve) })
78
+ // 安检维修界面
79
+ Vue.component('app-repair-from', (resolve) => { require(['./components/android/Task/RepairFromSend/RepairFrom'], resolve) })
80
+ Vue.component('app-repair-send', (resolve) => { require(['./components/android/Task/RepairFromSend/RepairSend'], resolve) })
81
+ // 设备变更
82
+ Vue.component('new-app-installation-details', (resolve) => { require(['./components/android/Process/Processes/newAppInstallationDetails.vue'], resolve) })
83
+ Vue.component('new-app-devices-management', (resolve) => { require(['./components/android/Process/Processes/newAppDevicesManagement'], resolve) })
84
+ // 改线业务审核
85
+ Vue.component('bu-zhang-shenhe', (resolve) => { require(['./components/android/Task/ShenHe/BuZhangShenHe'], resolve) })
86
+ Vue.component('jing-li-shenhe', (resolve) => { require(['./components/android/Task/ShenHe/JingLiShenHe'], resolve) })
87
+ // 拆除用户管理
88
+ Vue.component('app-chai-chu-management', (resolve) => { require(['./components/android/Process/Processes/AppChaiChuInfo.vue'], resolve) })
89
+ // 管线建设
90
+ Vue.component('app-exploration-guan-xian', (resolve) => { require(['./components/android/Task/GuanXianJianShe/AppExplorationGuanXian.vue'], resolve) })
91
+ // 管线建设
92
+ Vue.component('app-guan-xian-cailiao', (resolve) => { require(['./components/android/Task/GuanXianJianShe/AppGuanXianCaiLiao.vue'], resolve) })
93
+ // 铅封管理
94
+ Vue.component('seal-manage', (resolve) => { require(['./components/android/SealManage'], resolve) })
95
+ // 铅封绑定
96
+ Vue.component('seal-bind', (resolve) => { require(['./components/android/SealBind'], resolve) })
97
+ }
package/src/components/android/AppSign.vue CHANGED
@@ -148,6 +148,7 @@ export default {
148
148
  })
149
149
  console.log('===============上传回调=================')
150
150
  console.log(JSON.stringify(res))
151
+ debugger
151
152
  this.imgid = res.id
152
153
  HostApp.__this__.getFiles(res.id)
153
154
  },
package/src/components/product/ApplyMap/ApplyInputSearch.vue CHANGED
@@ -1,212 +1,212 @@
1
- <template>
2
- <div style="overflow: hidden">
3
- <div style="height: 5%">
4
- <!--输入框 搜索成功返回事件 搜索框被点击 搜索框内容被改变 到最后一页 -->
5
- <amap-input-search v-ref:mapinput
6
- :thiscitycode="mobiCity.citycode"
7
- :thiscity="mobiCity.city"
8
- :model.sync="mainList"
9
- @retres="syncinput"
10
- @searchinputclick="isMaskLevelShow"
11
- @closearchlist="closearchlist"
12
- @searchchange="showLevelShow"
13
- @endcount="endInputCount" ></amap-input-search>
14
- </div>
15
- <!--遮罩框 是否显示遮罩层 列表数据 滑动到底部加载 某一条数据被点击 背景色 -->
16
- <amap-search-list v-ref:maplist
17
- v-show="isMaskShow"
18
- :model.sync="mainList"
19
- @httpload="httpLoad"
20
- @selected="listSelected"
21
- :background_color="amaplist_bgcolor">
22
- <template partial='head'></template>
23
- <template partial='body'>
24
- <tr>
25
- <th>
26
- <h5>{{row.name}} <small>{{row.type}}</small></h5>
27
- <small>{{row.pname}}{{row.cityname}}{{row.adname}}{{row.address}}</small>
28
- </th>
29
- </tr>
30
- </template>
31
- </amap-search-list>
32
- <div style="height: 50%" v-show="!isMaskShow">
33
- <!--地图-->
34
- <div>
35
- <apply-map-location
36
- @locationsuccess="locationsuccess"
37
- v-ref:amapmain mapmodel="dragMap" :usenative="true"
38
- :isshowsearch="false" :mylocationinfo="false"
39
- :islocation="islocation" :locationzoomcenter="locationzoomcenter"
40
- :islocationclearmark="false" :isshowmapmodel="false"
41
- :zoomcenter="zoomcenter" mapmodel="dragMap"
42
- @getmylocation="getmylocation"
43
- @dragsuccess="dragsuccess"
44
- @initamapsuc="initamapsuc"
45
- :labelmarksarray="labelmarksarray">
46
- </apply-map-location>
47
- </div>
48
- </div>
49
- <div style="height: 45%" v-show="!isMaskShow">
50
- <!--拖拽到地方后附近的poi搜索结果-->
51
- <apply-drag-list
52
- :rimlocation="rimlocation"
53
- :location-address="locationAddress"
54
- @roundlistpoiclick="roundlistpoiclick"
55
- ></apply-drag-list>
56
- </div>
57
- </div>
58
- </template>
59
-
60
- <script>
61
- export default {
62
- /**
63
- * 请勿修改源码，此代码是模板代码，如需其他实现方法，复制到项目中修改
64
- */
65
- title: '高德选址主组件',
66
- props: ['markmapdata'],
67
- data () {
68
- return {
69
- islocation: true,
70
- locationzoomcenter: true,
71
- // 是否显示 搜索列表遮罩层
72
- isMaskShow: false,
73
- // 遮罩层背景色
74
- amaplist_bgcolor: 'rgb(250 250 250)',
75
- // 搜索列表主数据
76
- mainList: {
77
- rows: []
78
- },
79
- // 选中的城市信息
80
- mobiCity: {
81
- citycode: 610800,
82
- city: '榆林市'
83
- },
84
- // 带label的简单点集
85
- labelmarksarray: [],
86
- // 地图当前显示的居中位置
87
- zoomcenter: {
88
- grade: 12,
89
- lng: 109.741193,
90
- lat: 38.290162
91
- },
92
- // 下方搜索附近的位置 [经度，纬度]
93
- rimlocation: [],
94
- // 拖拽选址当前地址
95
- locationAddress: {}
96
- }
97
- },
98
- methods: {
99
- initamapsuc () {
100
- if (this.markmapdata) {
101
- this.toMapMarker(this.markmapdata)
102
- }
103
- },
104
- // 定位回调
105
- locationsuccess (myLocation) {
106
- this.mobiCity.citycode = myLocation.city.citycode
107
- this.mobiCity.city = myLocation.city.city
108
- },
109
- // 下方搜索附近poi组件列表的点击事件
110
- roundlistpoiclick (roeOne) {
111
- console.log('下方搜索附近Poi' + JSON.stringify(roeOne))
112
- this.$emit('locationclick', roeOne) // 外部去处理 关闭此选址组件
113
- this.toMapMarker(roeOne)
114
- },
115
- // 上方搜索列表中某项被点击
116
- listSelected (roeOne) {
117
- console.log('上方搜索附近Poi' + JSON.stringify(roeOne))
118
- this.$emit('locationclick', roeOne) // 外部去处理 关闭此选址组件
119
- this.isMaskShow = false // 关闭搜索遮罩层
120
- this.toMapMarker(roeOne)
121
- },
122
- // 切换显示搜索列表（遮罩层）
123
- isMaskLevelShow (res) {
124
- if (res === '') {
125
- return this.$showMessage('请选择城市')
126
- }
127
- this.isMaskShow = true
128
- },
129
- // 输入框内点击关闭遮罩层
130
- closearchlist () {
131
- this.isMaskShow = false
132
- },
133
- // 当搜索框内值变化 (值变化必为新的搜索，就清空之前的数据打开或关闭遮罩)
134
- showLevelShow (inputText) {
135
- this.mainList.rows = []
136
- if (inputText.trim()) {
137
- // 当搜索框是关闭状态，就打开搜索框
138
- if (this.isMaskShow === false) {
139
- this.isMaskShow = true
140
- }
141
- } else {
142
- this.isMaskShow = false
143
- }
144
- },
145
- // 搜索框返回值组装到搜索列表
146
- syncinput (res) {
147
- let status = res.status
148
- let result = res.result
149
- console.log('父组件触发-搜索事件')
150
- if (status === 'complete') {
151
- if (result.poiList.count === 0) {
152
- console.log('poi搜索为空')
153
- // return this.mainList.rows=[]
154
- }
155
- this.$refs.maplist.listsuccess() // 搜索成功调用列表的成功（隐藏加载动画）
156
- for (let i = 0, leat = result.poiList.pois.length; i < leat; i++) {
157
- this.mainList.rows.push(result.poiList.pois[i])
158
- }
159
- } else if (status === 'error') {
160
- console.log('检索POI失败====')
161
- this.$refs.maplist.listcatch() // 搜索失败调用列表失败
162
- } else if (status === 'no_data') {
163
- console.log('检索返回0结果')
164
- this.mainList.rows = []
165
- }
166
- },
167
- // 列表到底部搜索方法
168
- httpLoad () {
169
- this.$refs.mapinput.whetherToPageSearch()
170
- },
171
- // 到最后一页
172
- endInputCount () {
173
- this.$refs.maplist.listend()
174
- console.log('到最后一页了')
175
- },
176
- // 选中的当前位置改变
177
- getmylocation (res) {
178
-
179
- },
180
- // 拖拽选址到哪
181
- dragsuccess (res) {
182
- this.rimlocation = [res.position.lng, res.position.lat]
183
- this.locationAddress = res
184
- console.log('当前地址', this.locationAddress)
185
- },
186
- // 在地图上渲染点 并将视图缩放到该点处
187
- toMapMarker (data) {
188
- this.labelmarksarray = [{
189
- data: {data: '', label: '<span>' + data.name + '</span>', content: data.address},
190
- position: data.location,
191
- ismoseOpen: true, // 是否通过鼠标滑过打开信息框 true ,false
192
- isclearmarker: true, // 是否重新渲染新点时就清除页面所有点 true false 也可以手动去调用 this.map.clearMap(); 该方法属于map地图对象
193
- ismobiletouchendclear: false, // 手机端长按点后是否松开后关闭弹出的信息框 （_ismoseOpen为true并且_ismobiletouchendclear为true移动端才会在松开后关闭信息框，当你不想在松开后关闭信息框时请将_ismobiletouchendclear设置为false）
194
- islabel: true // 是否渲染label 标注(标注与信息框不同，信息框全局只有唯一一个)
195
- }]
196
- this.zoomcenter = {grade: 15, lng: data.location.lng, lat: data.location.lat}
197
- }
198
- },
199
- ready () {
200
- },
201
- created () {
202
- },
203
- watch: {
204
- },
205
- computed: {
206
- }
207
- }
208
- </script>
209
-
210
- <style scoped>
211
-
212
- </style>
1
+ <template>
2
+ <div style="overflow: hidden">
3
+ <div style="height: 5%">
4
+ <!--输入框 搜索成功返回事件 搜索框被点击 搜索框内容被改变 到最后一页 -->
5
+ <apply-map-input-search v-ref:mapinput
6
+ :thiscitycode="mobiCity.citycode"
7
+ :thiscity="mobiCity.city"
8
+ :model.sync="mainList"
9
+ @retres="syncinput"
10
+ @searchinputclick="isMaskLevelShow"
11
+ @closearchlist="closearchlist"
12
+ @searchchange="showLevelShow"
13
+ @endcount="endInputCount" ></apply-map-input-search>
14
+ </div>
15
+ <!--遮罩框 是否显示遮罩层 列表数据 滑动到底部加载 某一条数据被点击 背景色 -->
16
+ <amap-search-list v-ref:maplist
17
+ v-show="isMaskShow"
18
+ :model.sync="mainList"
19
+ @httpload="httpLoad"
20
+ @selected="listSelected"
21
+ :background_color="amaplist_bgcolor">
22
+ <template partial='head'></template>
23
+ <template partial='body'>
24
+ <tr>
25
+ <th>
26
+ <h5>{{row.name}} <small>{{row.type}}</small></h5>
27
+ <small>{{row.pname}}{{row.cityname}}{{row.adname}}{{row.address}}</small>
28
+ </th>
29
+ </tr>
30
+ </template>
31
+ </amap-search-list>
32
+ <div style="height: 50%" v-show="!isMaskShow">
33
+ <!--地图-->
34
+ <div>
35
+ <apply-map-location
36
+ @locationsuccess="locationsuccess"
37
+ v-ref:amapmain mapmodel="dragMap" :usenative="true"
38
+ :isshowsearch="false" :mylocationinfo="false"
39
+ :islocation="islocation" :locationzoomcenter="locationzoomcenter"
40
+ :islocationclearmark="false" :isshowmapmodel="false"
41
+ :zoomcenter="zoomcenter" mapmodel="dragMap"
42
+ @getmylocation="getmylocation"
43
+ @dragsuccess="dragsuccess"
44
+ @initamapsuc="initamapsuc"
45
+ :labelmarksarray="labelmarksarray">
46
+ </apply-map-location>
47
+ </div>
48
+ </div>
49
+ <div style="height: 45%" v-show="!isMaskShow">
50
+ <!--拖拽到地方后附近的poi搜索结果-->
51
+ <apply-drag-list
52
+ :rimlocation="rimlocation"
53
+ :location-address="locationAddress"
54
+ @roundlistpoiclick="roundlistpoiclick"
55
+ ></apply-drag-list>
56
+ </div>
57
+ </div>
58
+ </template>
59
+
60
+ <script>
61
+ export default {
62
+ /**
63
+ * 请勿修改源码，此代码是模板代码，如需其他实现方法，复制到项目中修改
64
+ */
65
+ title: '高德选址主组件',
66
+ props: ['markmapdata'],
67
+ data () {
68
+ return {
69
+ islocation: true,
70
+ locationzoomcenter: true,
71
+ // 是否显示 搜索列表遮罩层
72
+ isMaskShow: false,
73
+ // 遮罩层背景色
74
+ amaplist_bgcolor: 'rgb(250 250 250)',
75
+ // 搜索列表主数据
76
+ mainList: {
77
+ rows: []
78
+ },
79
+ // 选中的城市信息
80
+ mobiCity: {
81
+ citycode: 610800,
82
+ city: '榆林市'
83
+ },
84
+ // 带label的简单点集
85
+ labelmarksarray: [],
86
+ // 地图当前显示的居中位置
87
+ zoomcenter: {
88
+ grade: 12,
89
+ lng: 109.741193,
90
+ lat: 38.290162
91
+ },
92
+ // 下方搜索附近的位置 [经度，纬度]
93
+ rimlocation: [],
94
+ // 拖拽选址当前地址
95
+ locationAddress: {}
96
+ }
97
+ },
98
+ methods: {
99
+ initamapsuc () {
100
+ if (this.markmapdata) {
101
+ this.toMapMarker(this.markmapdata)
102
+ }
103
+ },
104
+ // 定位回调
105
+ locationsuccess (myLocation) {
106
+ this.mobiCity.citycode = myLocation.city.citycode
107
+ this.mobiCity.city = myLocation.city.city
108
+ },
109
+ // 下方搜索附近poi组件列表的点击事件
110
+ roundlistpoiclick (roeOne) {
111
+ console.log('下方搜索附近Poi' + JSON.stringify(roeOne))
112
+ this.$emit('locationclick', roeOne) // 外部去处理 关闭此选址组件
113
+ this.toMapMarker(roeOne)
114
+ },
115
+ // 上方搜索列表中某项被点击
116
+ listSelected (roeOne) {
117
+ console.log('上方搜索附近Poi' + JSON.stringify(roeOne))
118
+ this.$emit('locationclick', roeOne) // 外部去处理 关闭此选址组件
119
+ this.isMaskShow = false // 关闭搜索遮罩层
120
+ this.toMapMarker(roeOne)
121
+ },
122
+ // 切换显示搜索列表（遮罩层）
123
+ isMaskLevelShow (res) {
124
+ if (res === '') {
125
+ return this.$showMessage('请选择城市')
126
+ }
127
+ this.isMaskShow = true
128
+ },
129
+ // 输入框内点击关闭遮罩层
130
+ closearchlist () {
131
+ this.isMaskShow = false
132
+ },
133
+ // 当搜索框内值变化 (值变化必为新的搜索，就清空之前的数据打开或关闭遮罩)
134
+ showLevelShow (inputText) {
135
+ this.mainList.rows = []
136
+ if (inputText.trim()) {
137
+ // 当搜索框是关闭状态，就打开搜索框
138
+ if (this.isMaskShow === false) {
139
+ this.isMaskShow = true
140
+ }
141
+ } else {
142
+ this.isMaskShow = false
143
+ }
144
+ },
145
+ // 搜索框返回值组装到搜索列表
146
+ syncinput (res) {
147
+ let status = res.status
148
+ let result = res.result
149
+ console.log('父组件触发-搜索事件')
150
+ if (status === 'complete') {
151
+ if (result.poiList.count === 0) {
152
+ console.log('poi搜索为空')
153
+ // return this.mainList.rows=[]
154
+ }
155
+ this.$refs.maplist.listsuccess() // 搜索成功调用列表的成功（隐藏加载动画）
156
+ for (let i = 0, leat = result.poiList.pois.length; i < leat; i++) {
157
+ this.mainList.rows.push(result.poiList.pois[i])
158
+ }
159
+ } else if (status === 'error') {
160
+ console.log('检索POI失败====')
161
+ this.$refs.maplist.listcatch() // 搜索失败调用列表失败
162
+ } else if (status === 'no_data') {
163
+ console.log('检索返回0结果')
164
+ this.mainList.rows = []
165
+ }
166
+ },
167
+ // 列表到底部搜索方法
168
+ httpLoad () {
169
+ this.$refs.mapinput.whetherToPageSearch()
170
+ },
171
+ // 到最后一页
172
+ endInputCount () {
173
+ this.$refs.maplist.listend()
174
+ console.log('到最后一页了')
175
+ },
176
+ // 选中的当前位置改变
177
+ getmylocation (res) {
178
+
179
+ },
180
+ // 拖拽选址到哪
181
+ dragsuccess (res) {
182
+ this.rimlocation = [res.position.lng, res.position.lat]
183
+ this.locationAddress = res
184
+ console.log('当前地址', this.locationAddress)
185
+ },
186
+ // 在地图上渲染点 并将视图缩放到该点处
187
+ toMapMarker (data) {
188
+ this.labelmarksarray = [{
189
+ data: {data: '', label: '<span>' + data.name + '</span>', content: data.address},
190
+ position: data.location,
191
+ ismoseOpen: true, // 是否通过鼠标滑过打开信息框 true ,false
192
+ isclearmarker: true, // 是否重新渲染新点时就清除页面所有点 true false 也可以手动去调用 this.map.clearMap(); 该方法属于map地图对象
193
+ ismobiletouchendclear: false, // 手机端长按点后是否松开后关闭弹出的信息框 （_ismoseOpen为true并且_ismobiletouchendclear为true移动端才会在松开后关闭信息框，当你不想在松开后关闭信息框时请将_ismobiletouchendclear设置为false）
194
+ islabel: true // 是否渲染label 标注(标注与信息框不同，信息框全局只有唯一一个)
195
+ }]
196
+ this.zoomcenter = {grade: 15, lng: data.location.lng, lat: data.location.lat}
197
+ }
198
+ },
199
+ ready () {
200
+ },
201
+ created () {
202
+ },
203
+ watch: {
204
+ },
205
+ computed: {
206
+ }
207
+ }
208
+ </script>
209
+
210
+ <style scoped>
211
+
212
+ </style>
package/src/components/product/ApplyMap/ApplyMapInputSearch.vue ADDED
@@ -0,0 +1,335 @@
1
+ <template>
2
+ <div class="main-header" style="z-index: 2">
3
+ <!--响应式工具 .visible-xs 手机 (<768px) .visible-sm 平板 (≥768px) 可见-->
4
+ <div class="row">
5
+ <div class="col-sm-12 col-md-12 col-xs-12 maptop">
6
+ <div class="col-md-1 col-sm-2 col-xs-3" v-if="isshowcity">
7
+ <button type="button" class="citybtn" @click="showMobiCityPicker">
8
+ <div class="city" style="">{{thiscity}}</div>
9
+ <div class="citygly glyphicon glyphicon-menu-down" aria-hidden="true"></div>
10
+ </button>
11
+ </div>
12
+ <div :class="isshowcity ? 'col-md-11 col-sm-10 col-xs-9 d1': 'col-md-12 col-sm-12 col-xs-12 d1'" >
13
+ <div class="d2" :style="showCancel ? 'width: 80%' : 'width: 100%'">
14
+ <div class="search">
15
+ <svg class="icon searchicon" t="1629093714025" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2215" width="200" height="200"><path d="M990.980258 969.944422l-185.094554-185.094554c83.911344-83.23135 135.990938-198.518449 135.990938-325.781454C941.876642 205.950391 735.934251 0 482.824228 0 229.698205 0 23.747814 205.950391 23.747814 459.076413c0 253.142022 205.950391 459.060414 459.076414 459.060414 103.079195 0 198.334451-34.167733 275.037851-91.759283l188.342529 188.342528c6.183952 6.183952 14.279888 9.271928 22.383825 9.271928s16.199873-3.087976 22.391825-9.271928a31.655753 31.655753 0 0 0 0-44.77565zM87.06732 459.076413c0-218.222295 177.534613-395.748908 395.756908-395.748908 218.206295 0 395.732908 177.526613 395.732908 395.748908 0 218.198295-177.526613 395.740908-395.732908 395.740909-218.222295 0-395.756908-177.542613-395.756908-395.740909z" fill="#838384" p-id="2216"></path></svg>
16
+ </div>
17
+ <input type="search" placeholder="搜索地点" style="width: 90%"
18
+ v-model="searchText" id="mobileSearch"
19
+ @click="searchInputClick" @focus="showCancel = true"
20
+ class="col-xs-10">
21
+ <div class="remove" v-if="searchText" @click="closeSearchList">
22
+ <svg class="icon" t="1629094394281" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3295" width="200" height="200"><path d="M75.170909 160.907636L108.101818 128 937.192727 957.114182l-32.907636 32.907636z" p-id="3296"></path><path d="M75.194182 957.114182L904.308364 128l32.907636 32.907636L108.101818 990.021818z" p-id="3297"></path></svg>
23
+ </div>
24
+ </div>
25
+ </div>
26
+ </div>
27
+ </div>
28
+ </div>
29
+ </template>
30
+
31
+ <script>
32
+ export default {
33
+ title: "地图搜索组件",
34
+ props:{
35
+ // 每次查询条数，最大50 大于50按50算
36
+ pagesize:{
37
+ type: Number,
38
+ default: 20
39
+ },
40
+ // 是否返回详细地址信息
41
+ extensions: {
42
+ type: Boolean,
43
+ default: true
44
+ },
45
+ // 是否显示城市选择组件
46
+ isshowcity:{
47
+ type: Boolean,
48
+ default: true
49
+ },
50
+ // 当前城市
51
+ thiscity:{
52
+ require:true,
53
+ type:String,
54
+ default:'请选择城市'
55
+ },
56
+ // 当前城市编码
57
+ thiscitycode: {
58
+ require:false,
59
+ type:String,
60
+ default:''
61
+ },
62
+ // 列表中的值
63
+ model: {
64
+ type: Array,
65
+ default: []
66
+ }
67
+ },
68
+ data() {
69
+ return {
70
+ searchText: '', // 搜索框的值
71
+ lastSearchText:'',//上次搜索框的值
72
+ placeSearch: null,// 搜索组件的对象
73
+ isfullSearch: '', //返回基本信息还是详细信息 base 或者 all 与extensions关联
74
+ resResult: {}, //响应结果,未使用
75
+ pageCount: 0, //总页数
76
+ pagenumber: 1,//当前页
77
+ cityPicker: null,// 城市选择组件实例
78
+ }
79
+ },
80
+ methods : {
81
+ // 输入框被点击
82
+ searchInputClick(){
83
+ if (this.isshowcity) { // 城市选择组件显示
84
+ this.$emit('searchinputclick',this.thiscity) //输入框被点击返回当前选择的城市
85
+ }else {
86
+ this.$emit('searchinputclick')
87
+ }
88
+ },
89
+ // 初始化地图POI搜索组件
90
+ initAmapSearch(){
91
+ this.isfullSearch = this.extensions===false?'base':'all' //是否查询详情
92
+ AMap.plugin(['AMap.AutoComplete','AMap.PlaceSearch'],()=>{
93
+ this.placeSearch = new AMap.PlaceSearch({
94
+ // city 指定搜索所在城市，支持传入格式有：城市名、citycode和adcode
95
+ pageSize: this.pagesize,
96
+ lang: 'zh_cn',
97
+ extensions: this.isfullSearch //此项默认值：base，返回基本地址信息 取值：all，返回基本+详细信息
98
+ })
99
+ })
100
+ //搜索成功
101
+ if (AMap.Event){
102
+ AMap.Event.addListener(this.placeSearch, 'complete', (e)=>{
103
+ this.pagenumber = this.pagenumber + 1 // 每次查询成功都会给当前页+1 也就是下次查询页
104
+ this.pageCount=e.poiList.count;//赋值查询后的总页数
105
+ // 抛出的值组装
106
+ let res = {'status':'complete','result':e,'pagecount': e.poiList.count}
107
+ this.$emit('retres',res); // 请求后触发事件，将poi搜索的值返回 --正确或者失败都会触发 在返回值的status为complete为成功，为error为失败
108
+ this.$emit('retsuccess',res); // 搜索成功事件
109
+ })
110
+ } else {
111
+ AMap.event.addListenerOnce(this.placeSearch, 'complete', (e)=>{
112
+ this.pagenumber = this.pagenumber + 1 // 每次查询成功都会给当前页+1 也就是下次查询页
113
+ this.pageCount=e.poiList.count;//赋值查询后的总页数
114
+ // 抛出的值组装
115
+ let res = {'status':'complete','result':e,'pagecount': e.poiList.count}
116
+ this.$emit('retres',res); // 请求后触发事件，将poi搜索的值返回 --正确或者失败都会触发 在返回值的status为complete为成功，为error为失败
117
+ this.$emit('retsuccess',res); // 搜索成功事件
118
+ })
119
+ }
120
+ if (AMap.Event){
121
+ //搜索失败
122
+ AMap.Event.addListener(this.placeSearch, 'error', (e)=>{
123
+ // 抛出的值组装
124
+ let res={'status':'error','result':e,'pagecount': 0}
125
+ this.$emit('retres',res); // 请求后触发事件，将poi搜索的值返回 --正确或者失败都会触发 在返回值的status为complete为成功，为error为失败
126
+ this.$emit('reterror',res); // 搜索失败事件
127
+ })
128
+ } else {
129
+ //搜索失败
130
+ AMap.event.addListener(this.placeSearch, 'error', (e)=>{
131
+ // 抛出的值组装
132
+ let res={'status':'error','result':e,'pagecount': 0}
133
+ this.$emit('retres',res); // 请求后触发事件，将poi搜索的值返回 --正确或者失败都会触发 在返回值的status为complete为成功，为error为失败
134
+ this.$emit('reterror',res); // 搜索失败事件
135
+ })
136
+ }
137
+
138
+ },
139
+ // 同步搜索 （搜索内容）
140
+ syncSearch() {
141
+ //如果显示选择城市组件，则城市选择组件就为必选
142
+ if (this.isshowcity===true && this.thiscity==='请选择城市') {
143
+ this.searchText = '' //清空输入框内容
144
+ return this.$showMessage("请选择城市！")
145
+ }
146
+ // 如果当前总数是0，则不判断是否到最下部最后一页
147
+ if (this.pageCount!==0) {
148
+ // 计算当前页 总条数除以当前页大小
149
+ if (this.$parent.mainList.rows.length === this.pageCount){ //如果当前页等于总页数
150
+ console.log("挖空了！已经到底了！")
151
+ return this.$emit('endcount') //当到达最后一页触发
152
+ }
153
+ }
154
+ // 设置分页参数和城市信息去搜索
155
+ if (this.searchText.trim()) {
156
+ this.placeSearch.setPageIndex(this.pagenumber); //页码
157
+ this.placeSearch.setCity(this.thiscity); //设置城市
158
+ this.placeSearch.search(this.searchText) //搜索
159
+ }else {
160
+ console.log('查询内容有误')
161
+ }
162
+ },
163
+ // 清楚搜索结果
164
+ clearSearch () {
165
+ this.placeSearch.clear();
166
+ },
167
+ //初始化城市选择
168
+ async initMobiCityPicker () {
169
+ this.cityPicker = null
170
+ await AMapUI.loadUI(['misc/MobiCityPicker'], (MobiCityPicker) => {
171
+ //动态加载自定义的红色主题， 如果css已经写在当前页面中，可忽略此步骤
172
+ this.cityPicker = new MobiCityPicker({
173
+ //设置主题（同名的className会被添加到外层容器上）
174
+ theme: 'common'
175
+ });
176
+ //监听城市选中事件
177
+ this.cityPicker.on('citySelected', (cityInfo) => {
178
+ // 输出选中城市信息
179
+ console.log(cityInfo);
180
+ this.thiscity = cityInfo.adcode;//设置城市编码为当前选中城市
181
+ this.thiscity = cityInfo.name;//设置当前选中的城市名
182
+ this.$emit("mobicity", cityInfo) //选中城市后
183
+ this.clearMobiCityPicker()
184
+ // 以选中的当前城市为中心并zoom为15；
185
+ //当前地点可能并非所在城市的固定区域，考虑是否通过地点查询经纬度
186
+ // map.setZoomAndCenter(15, [cityInfo.lng, cityInfo.lat])
187
+ // var currentCenter = map.getCenter();
188
+ });
189
+ });
190
+
191
+ },
192
+ // 显示城市选择组件
193
+ showMobiCityPicker(){
194
+ if (this.cityPicker !== null) {
195
+ this.$emit('showmobicity') //开启城市选择 （PC可手动兼容，将其他组件隐藏）
196
+ this.cityPicker.show();
197
+ } else {
198
+
199
+ this.initMobiCityPicker()
200
+ }
201
+ },
202
+ // 关闭城市选择组件
203
+ clearMobiCityPicker(){
204
+ this.$emit('clearmobicity') //关闭城市选择
205
+ this.cityPicker.hide();
206
+ },
207
+ // 外部调用查询方法 判断是否分页
208
+ whetherToPageSearch () {
209
+ if ( (this.searchText.trim() === this.lastSearchText.trim()) && this.searchText.trim() ) {
210
+ this.pageCount = 0
211
+ this.pagenumber = 1
212
+ this.syncSearch()
213
+ }else {
214
+ this.syncSearch()
215
+ }
216
+ },
217
+ // 关闭搜索列表(点击关闭图标)
218
+ closeSearchList () {
219
+ this.searchText = ''
220
+ this.$emit("closearchlist")
221
+ }
222
+ },
223
+ ready () {
224
+ this.initAmapSearch() //初始化搜索
225
+ this.initMobiCityPicker() //初始化城市选择
226
+ this.$nextTick(()=>{
227
+ if (this.thiscity == null || this.thiscity==='' || this.thiscity == undefined) {
228
+ this.thiscity = '请选择城市'
229
+ }
230
+ })
231
+ },
232
+ watch: {
233
+ // 当值该表时执行查询
234
+ 'searchText':function (newValue,oldValue){
235
+ //本次和上次不同，内容改变 则将总数和当前页恢复默认
236
+ if ( (newValue.trim() !== oldValue.trim()) && newValue.trim() ) {
237
+ this.pageCount = 0
238
+ this.pagenumber = 1
239
+ this.syncSearch()
240
+ this.$emit("searchchange",this.searchText)
241
+ }else {
242
+ this.syncSearch()
243
+ this.$emit("searchchange",this.searchText)
244
+ }
245
+ // 最后将上次的搜索框内容重新赋值
246
+ this.lastSearchText = oldValue
247
+ },
248
+ "thiscity":function () {
249
+ if (this.thiscity == null || this.thiscity==='' || this.thiscity == undefined) {
250
+ this.thiscity = '请选择城市'
251
+ }
252
+ }
253
+
254
+ },
255
+ }
256
+ </script>
257
+ <style scoped lang="less">
258
+ .maptop {
259
+ padding-top: 5px;
260
+ padding-bottom: 10px;
261
+ .citybtn {
262
+ height: 100%;
263
+ width: 100%;
264
+ background: #fff;
265
+ text-align: left;
266
+ border: none;
267
+ float: left;
268
+ display: flex;
269
+ align-items:center;
270
+ .city {
271
+ width: 65%;
272
+ height: auto;
273
+ white-space: nowrap;
274
+ text-overflow: ellipsis;
275
+ overflow: hidden;
276
+ display: inline-block;
277
+ }
278
+ .citygly {
279
+ height: auto;
280
+ display: inline-block;
281
+ }
282
+ }
283
+ .d2 {
284
+ display: flex;
285
+ align-items:center;
286
+ height: 100%;
287
+ width: auto;
288
+ background: #f4f4f4;
289
+ border-radius: 20px;
290
+ padding: 0 10px;
291
+ .search {
292
+ //display: inline-block;
293
+ float: left;
294
+ display: flex;
295
+ align-items:center;
296
+ svg {
297
+ width: 16px;
298
+ height: 16px;
299
+ }
300
+ }
301
+ input {
302
+ width: 90%;
303
+ padding: 0 10px;
304
+ background: #f4f4f4;
305
+ border: none;
306
+ outline: none;
307
+ }
308
+ .remove {
309
+ display: flex;
310
+ align-items:center;
311
+ float: right;
312
+ svg {
313
+ width: 14px;
314
+ height: 14px;
315
+ }
316
+ }
317
+ }
318
+ .d1 {
319
+ display: flex;
320
+ align-items:center;
321
+ }
322
+ .cancel {
323
+ width: 20%;
324
+ display: flex;
325
+ align-items:center;
326
+ div {
327
+ text-align: right;
328
+ line-height: 200%;
329
+ width: 100%;
330
+ }
331
+ }
332
+ }
333
+
334
+ </style>
335
+