af-mobile-client-vue3 1.1.6 → 1.1.8
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.
- package/.env +1 -1
- package/package.json +1 -1
- package/src/components/data/XCellList/index.vue +2 -1
- package/src/components/data/XForm/index.vue +5 -0
- package/src/components/data/XFormItem/index.vue +3 -4
- package/src/components/data/XOlMap/README.md +0 -2
- package/src/components/data/XOlMap/XLocationPicker/index.vue +21 -9
- package/src/components/data/XOlMap/index.vue +81 -74
- package/src/components/data/XOlMap/types.ts +0 -4
- package/src/views/component/XCellListView/index.vue +2 -2
- package/src/views/component/XOlMapView/index.vue +0 -1
package/.env
CHANGED
package/package.json
CHANGED
|
@@ -127,7 +127,7 @@ onBeforeMount(() => {
|
|
|
127
127
|
function initComponent() {
|
|
128
128
|
getConfigByName(configName, (result) => {
|
|
129
129
|
groupFormItems.value = result
|
|
130
|
-
title.value = result
|
|
130
|
+
title.value = result?.title
|
|
131
131
|
for (let i = 0; i < result.columnJson.length; i++) {
|
|
132
132
|
const item = result.columnJson[i]
|
|
133
133
|
item.span = item.flexSpan
|
|
@@ -436,6 +436,7 @@ function evaluateCustomFunction(funcString: string | undefined, record: any, ind
|
|
|
436
436
|
<VanRow gutter="20" class="card_item_details" @click="emit('toDetail', item)">
|
|
437
437
|
<VanCol v-for="column of detailColumns" :key="`details_${column.dataIndex}`" :span="column.span">
|
|
438
438
|
<p>
|
|
439
|
+
{{ `${column.title}: ` }}
|
|
439
440
|
<XBadge
|
|
440
441
|
:style="handleFunctionStyle(column.styleFunctionForValue, item[column.dataIndex])"
|
|
441
442
|
:dict-name="column.dictName" :dict-value="item[column.dataIndex]"
|
|
@@ -112,6 +112,10 @@ function setFormProps(form, item) {
|
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
114
|
|
|
115
|
+
function setForm(obj) {
|
|
116
|
+
Object.assign(form.value, obj)
|
|
117
|
+
}
|
|
118
|
+
|
|
115
119
|
function onSubmit() {
|
|
116
120
|
emits('onSubmit', form.value)
|
|
117
121
|
}
|
|
@@ -137,6 +141,7 @@ defineExpose({ init, form, formGroupName, validate })
|
|
|
137
141
|
:rules="rules"
|
|
138
142
|
:service-name="myServiceName"
|
|
139
143
|
:get-data-params="myGetDataParams"
|
|
144
|
+
@set-form="setForm"
|
|
140
145
|
/>
|
|
141
146
|
</VanCellGroup>
|
|
142
147
|
<div v-if="props.submitButton && props.mode !== '预览'" style="margin: 16px;">
|
|
@@ -88,7 +88,7 @@ const props = defineProps({
|
|
|
88
88
|
|
|
89
89
|
})
|
|
90
90
|
|
|
91
|
-
const emits = defineEmits(['update:modelValue'])
|
|
91
|
+
const emits = defineEmits(['update:modelValue', 'set-form'])
|
|
92
92
|
// 判断并初始化防抖函数
|
|
93
93
|
let debouncedUserLinkFunc: (() => void) | null = null
|
|
94
94
|
let debouncedDepLinkFunc: (() => void) | null = null
|
|
@@ -127,7 +127,8 @@ const currInst = getCurrentInstance()
|
|
|
127
127
|
// 配置中心->表单项变更触发函数
|
|
128
128
|
const dataChangeFunc = debounce(async () => {
|
|
129
129
|
if (attr.dataChangeFunc)
|
|
130
|
-
|
|
130
|
+
// eslint-disable-next-line vue/custom-event-name-casing
|
|
131
|
+
await executeStrFunctionByContext(currInst, attr.dataChangeFunc, [form, val => emits('set-form', val), attr, null, mode])
|
|
131
132
|
}, 500)
|
|
132
133
|
|
|
133
134
|
// 配置中心->表单项展示函数
|
|
@@ -1018,8 +1019,6 @@ function handleAddressConfirm(location) {
|
|
|
1018
1019
|
v-model="localValue as LocationResult"
|
|
1019
1020
|
tian-di-tu-key="c16876b28898637c0a1a68b3fa410504"
|
|
1020
1021
|
amap-key="5ebabc4536d4b42e0dd1e20175cca8ab"
|
|
1021
|
-
:default-center="[108.948024, 34.263161]"
|
|
1022
|
-
:default-zoom="12"
|
|
1023
1022
|
@confirm="handleAddressConfirm"
|
|
1024
1023
|
/>
|
|
1025
1024
|
</VanPopup>
|
|
@@ -1,22 +1,36 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
import type { LocationResult } from '../types'
|
|
2
|
+
import type { LocationResult, PhoneLocationStatus } from '../types'
|
|
3
|
+
import { mobileUtil } from '@af-mobile-client-vue3/utils/mobileUtil'
|
|
3
4
|
import { Button } from 'vant'
|
|
4
5
|
import { nextTick, onMounted, ref, watch } from 'vue'
|
|
5
6
|
import XOlMap from '../index.vue'
|
|
6
7
|
|
|
7
8
|
interface Props {
|
|
8
9
|
modelValue?: LocationResult
|
|
9
|
-
tianDiTuKey: string
|
|
10
|
-
amapKey: string
|
|
11
10
|
defaultCenter?: [number, number]
|
|
12
11
|
defaultZoom?: number
|
|
13
12
|
}
|
|
14
13
|
|
|
15
14
|
const props = withDefaults(defineProps<Props>(), {
|
|
16
|
-
defaultCenter: () =>
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
defaultCenter: () => {
|
|
16
|
+
try {
|
|
17
|
+
mobileUtil.execute({
|
|
18
|
+
param: undefined,
|
|
19
|
+
funcName: 'getPhoneStatus',
|
|
20
|
+
callbackFunc: (result) => {
|
|
21
|
+
const locationResult = result as PhoneLocationStatus
|
|
22
|
+
if (locationResult.f_latitude && locationResult.f_longitude) {
|
|
23
|
+
return [locationResult.f_longitude, locationResult.f_latitude]
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
})
|
|
27
|
+
}
|
|
28
|
+
catch (error) {
|
|
29
|
+
console.error('获取位置信息失败:', error)
|
|
30
|
+
}
|
|
31
|
+
return [108.948024, 34.263161] // 北京天安门坐标
|
|
32
|
+
},
|
|
33
|
+
defaultZoom: 16,
|
|
20
34
|
})
|
|
21
35
|
|
|
22
36
|
const emit = defineEmits<{
|
|
@@ -55,8 +69,6 @@ onMounted(() => {
|
|
|
55
69
|
mapRef.value.init({
|
|
56
70
|
center: props.defaultCenter,
|
|
57
71
|
zoom: props.defaultZoom,
|
|
58
|
-
tianDiTuKey: props.tianDiTuKey,
|
|
59
|
-
amapKey: props.amapKey,
|
|
60
72
|
})
|
|
61
73
|
|
|
62
74
|
// 初始化后尝试获取地址信息
|
|
@@ -17,6 +17,7 @@ import type {
|
|
|
17
17
|
WMSOptions,
|
|
18
18
|
} from './types'
|
|
19
19
|
import locationIcon from '@af-mobile-client-vue3/assets/img/component/positioning.png'
|
|
20
|
+
import { getConfigByName } from '@af-mobile-client-vue3/services/api/common'
|
|
20
21
|
import { mobileUtil } from '@af-mobile-client-vue3/utils/mobileUtil'
|
|
21
22
|
import { Map, View } from 'ol'
|
|
22
23
|
import { defaults as defaultControls, ScaleLine } from 'ol/control'
|
|
@@ -73,6 +74,8 @@ const wmsLayerStatus = ref<WMSLayerConfig[]>([])
|
|
|
73
74
|
const vectorLayers: Record<number, VectorLayer<VectorSource>> = {}
|
|
74
75
|
const pointLayerStatus = ref<PointLayerConfig[]>([])
|
|
75
76
|
|
|
77
|
+
const tiandityKey = ref()
|
|
78
|
+
const gaodeKey = ref()
|
|
76
79
|
/** 导航模式 是否正在跟随定位 */
|
|
77
80
|
const isFollowingLocation = ref(false)
|
|
78
81
|
/** 定位定时器 */
|
|
@@ -85,11 +88,10 @@ let locationLayer: VectorLayer<VectorSource> | null = null
|
|
|
85
88
|
*/
|
|
86
89
|
function createLocationLayer(): VectorLayer<VectorSource> {
|
|
87
90
|
const source = new VectorSource()
|
|
88
|
-
|
|
91
|
+
return new VectorLayer({
|
|
89
92
|
source,
|
|
90
93
|
zIndex: 10, // 确保位置图标在最上层
|
|
91
94
|
})
|
|
92
|
-
return layer
|
|
93
95
|
}
|
|
94
96
|
|
|
95
97
|
/**
|
|
@@ -252,7 +254,7 @@ function initializeLayers(tianDiTuKey = ''): void {
|
|
|
252
254
|
*/
|
|
253
255
|
async function getAddressInfo(location: [number, number]): Promise<string> {
|
|
254
256
|
try {
|
|
255
|
-
const key =
|
|
257
|
+
const key = gaodeKey.value
|
|
256
258
|
|
|
257
259
|
if (!key) {
|
|
258
260
|
return '获取地址失败: 未配置密钥'
|
|
@@ -320,86 +322,91 @@ function init(params: InitParams = {}): void {
|
|
|
320
322
|
zoom = 10,
|
|
321
323
|
maxZoom = 18,
|
|
322
324
|
minZoom = 4,
|
|
323
|
-
tianDiTuKey = '',
|
|
324
|
-
amapKey = '',
|
|
325
325
|
} = params
|
|
326
326
|
|
|
327
327
|
try {
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
328
|
+
getConfigByName('webConfig', (res) => {
|
|
329
|
+
const tianDiTuKey = res.tianDiTuKey || 'c16876b28898637c0a1a68b3fa410504'
|
|
330
|
+
const amapKey = res.amapKey || '5ebabc4536d4b42e0dd1e20175cca8ab'
|
|
331
|
+
|
|
332
|
+
tiandityKey.value = tianDiTuKey
|
|
333
|
+
gaodeKey.value = amapKey
|
|
334
|
+
// 初始化所有底图图层
|
|
335
|
+
initializeLayers(tianDiTuKey)
|
|
336
|
+
|
|
337
|
+
// 创建地图实例 - 加载所有底图图层,但默认只显示高德地图
|
|
338
|
+
map = new Map({
|
|
339
|
+
target: mapRef.value,
|
|
340
|
+
layers: Object.values(baseMaps), // 加载所有底图图层
|
|
341
|
+
view: new View({
|
|
342
|
+
center: fromLonLat(center),
|
|
343
|
+
zoom,
|
|
344
|
+
projection: 'EPSG:3857',
|
|
345
|
+
maxZoom,
|
|
346
|
+
minZoom,
|
|
347
|
+
}),
|
|
348
|
+
controls: defaultControls({
|
|
349
|
+
zoom: false,
|
|
350
|
+
rotate: false,
|
|
351
|
+
attribution: false,
|
|
352
|
+
}).extend([
|
|
353
|
+
new ScaleLine({
|
|
354
|
+
units: 'metric',
|
|
355
|
+
className: 'ol-scale-line',
|
|
356
|
+
}),
|
|
357
|
+
]),
|
|
358
|
+
interactions: defaultInteractions({
|
|
359
|
+
altShiftDragRotate: false,
|
|
360
|
+
pinchRotate: false,
|
|
350
361
|
}),
|
|
351
|
-
]),
|
|
352
|
-
interactions: defaultInteractions({
|
|
353
|
-
altShiftDragRotate: false,
|
|
354
|
-
pinchRotate: false,
|
|
355
|
-
}),
|
|
356
|
-
})
|
|
357
|
-
|
|
358
|
-
// 更新地图大小,确保地图正确渲染
|
|
359
|
-
setTimeout(() => {
|
|
360
|
-
if (map) {
|
|
361
|
-
map.updateSize()
|
|
362
|
-
// 确保默认图层正确显示
|
|
363
|
-
handleMapChange('tianditu')
|
|
364
|
-
}
|
|
365
|
-
}, 200)
|
|
366
|
-
|
|
367
|
-
// 监听地图移动结束事件
|
|
368
|
-
map.on('moveend', handleMoveEnd)
|
|
369
|
-
|
|
370
|
-
// 设置鼠标样式
|
|
371
|
-
if (mapRef.value) {
|
|
372
|
-
mapRef.value.style.cursor = 'grab'
|
|
373
|
-
// 监听地图事件
|
|
374
|
-
const mapElement = mapRef.value
|
|
375
|
-
|
|
376
|
-
// 鼠标按下时
|
|
377
|
-
mapElement.addEventListener('mousedown', () => {
|
|
378
|
-
mapElement.style.cursor = 'grabbing'
|
|
379
|
-
// 用户开始拖动地图,取消跟随定位
|
|
380
|
-
if (locationTimer) {
|
|
381
|
-
isFollowingLocation.value = false
|
|
382
|
-
}
|
|
383
362
|
})
|
|
384
363
|
|
|
385
|
-
//
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
364
|
+
// 更新地图大小,确保地图正确渲染
|
|
365
|
+
setTimeout(() => {
|
|
366
|
+
if (map) {
|
|
367
|
+
map.updateSize()
|
|
368
|
+
// 确保默认图层正确显示
|
|
369
|
+
handleMapChange('tianditu')
|
|
390
370
|
}
|
|
391
|
-
})
|
|
371
|
+
}, 200)
|
|
372
|
+
|
|
373
|
+
// 监听地图移动结束事件
|
|
374
|
+
map.on('moveend', handleMoveEnd)
|
|
375
|
+
|
|
376
|
+
// 设置鼠标样式
|
|
377
|
+
if (mapRef.value) {
|
|
378
|
+
mapRef.value.style.cursor = 'grab'
|
|
379
|
+
// 监听地图事件
|
|
380
|
+
const mapElement = mapRef.value
|
|
381
|
+
|
|
382
|
+
// 鼠标按下时
|
|
383
|
+
mapElement.addEventListener('mousedown', () => {
|
|
384
|
+
mapElement.style.cursor = 'grabbing'
|
|
385
|
+
// 用户开始拖动地图,取消跟随定位
|
|
386
|
+
if (locationTimer) {
|
|
387
|
+
isFollowingLocation.value = false
|
|
388
|
+
}
|
|
389
|
+
})
|
|
392
390
|
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
391
|
+
// 触摸开始时
|
|
392
|
+
mapElement.addEventListener('touchstart', () => {
|
|
393
|
+
// 用户开始拖动地图,取消跟随定位
|
|
394
|
+
if (locationTimer) {
|
|
395
|
+
isFollowingLocation.value = false
|
|
396
|
+
}
|
|
397
|
+
})
|
|
397
398
|
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
399
|
+
// 鼠标释放时
|
|
400
|
+
mapElement.addEventListener('mouseup', () => {
|
|
401
|
+
mapElement.style.cursor = 'grab'
|
|
402
|
+
})
|
|
403
|
+
|
|
404
|
+
// 鼠标离开地图时
|
|
405
|
+
mapElement.addEventListener('mouseleave', () => {
|
|
406
|
+
mapElement.style.cursor = 'grab'
|
|
407
|
+
})
|
|
408
|
+
}
|
|
409
|
+
})
|
|
403
410
|
}
|
|
404
411
|
catch (error) {
|
|
405
412
|
console.error('地图初始化失败:', error)
|
|
@@ -28,12 +28,8 @@ export interface InitParams {
|
|
|
28
28
|
maxZoom?: number
|
|
29
29
|
/** 最小缩放级别 */
|
|
30
30
|
minZoom?: number
|
|
31
|
-
/** 天地图密钥 */
|
|
32
|
-
tianDiTuKey?: string
|
|
33
31
|
/** 是否开启地址选择模式 */
|
|
34
32
|
enableLocationPicker?: boolean
|
|
35
|
-
/** 高德地图 API key */
|
|
36
|
-
amapKey?: string
|
|
37
33
|
}
|
|
38
34
|
|
|
39
35
|
/** 点位数据接口 */
|
|
@@ -12,8 +12,8 @@ const router = useRouter()
|
|
|
12
12
|
const idKey = ref('o_id')
|
|
13
13
|
|
|
14
14
|
// 简易crud表单测试
|
|
15
|
-
const configName = ref('
|
|
16
|
-
const serviceName = ref('af-
|
|
15
|
+
const configName = ref('mobile_ChargeQueryCRUD')
|
|
16
|
+
const serviceName = ref('af-revenue')
|
|
17
17
|
|
|
18
18
|
// 资源权限测试
|
|
19
19
|
// const configName = ref('crud_sources_test')
|