af-mobile-client-vue3 1.2.25 → 1.2.27
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/package.json +1 -1
- package/src/components/core/ImageUploader/index.vue +159 -159
- package/src/components/data/XForm/index.vue +37 -26
- package/src/components/data/XFormGroup/index.vue +134 -172
- package/src/components/data/XOlMap/utils/wgs84ToGcj02.js +154 -154
- package/src/components/data/XReportGrid/XReportDemo.vue +33 -33
- package/src/components/data/XReportGrid/print.js +184 -184
- package/src/views/component/XCellListView/index.vue +13 -126
- package/src/views/component/XFormGroupView/index.vue +2 -49
- package/src/views/component/XFormView/index.vue +29 -57
- package/src/views/component/XFormView/oldindex.vue +70 -0
- package/src/views/component/XOlMapView/XLocationPicker/index.vue +118 -118
- package/vite.config.ts +2 -2
package/package.json
CHANGED
|
@@ -1,159 +1,159 @@
|
|
|
1
|
-
<script setup lang="ts">
|
|
2
|
-
import { deleteFile } from '@af-mobile-client-vue3/services/api/common'
|
|
3
|
-
import { mobileUtil } from '@af-mobile-client-vue3/utils/mobileUtil'
|
|
4
|
-
import {
|
|
5
|
-
Button as vanButton,
|
|
6
|
-
Uploader as vanUploader,
|
|
7
|
-
} from 'vant'
|
|
8
|
-
import { ref, watch } from 'vue'
|
|
9
|
-
|
|
10
|
-
const props = defineProps({
|
|
11
|
-
imageList: Array<any>,
|
|
12
|
-
outerIndex: { default: undefined },
|
|
13
|
-
authority: { default: 'user' },
|
|
14
|
-
uploadMode: { default: 'server' },
|
|
15
|
-
attr: { type: Object as () => { addOrEdit?: string }, default: () => ({}) },
|
|
16
|
-
})
|
|
17
|
-
const emit = defineEmits(['updateFileList'])
|
|
18
|
-
|
|
19
|
-
const imageList = ref<Array<any>>(props.imageList ?? [])
|
|
20
|
-
|
|
21
|
-
// 同步 props.imageList 到内部 imageList,保证每次变化都响应
|
|
22
|
-
watch(() => props.imageList, (newVal) => {
|
|
23
|
-
imageList.value = Array.isArray(newVal) ? [...newVal] : []
|
|
24
|
-
}, { immediate: true })
|
|
25
|
-
|
|
26
|
-
// 触发拍照
|
|
27
|
-
function triggerCamera() {
|
|
28
|
-
mobileUtil.execute({
|
|
29
|
-
funcName: 'takePicture',
|
|
30
|
-
param: {},
|
|
31
|
-
callbackFunc: (result: any) => {
|
|
32
|
-
if (result.status === 'success') {
|
|
33
|
-
handlePhotoUpload(result.data)
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
})
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
// 处理拍照后的上传
|
|
40
|
-
function getImageMimeType(fileName: string): string {
|
|
41
|
-
const ext = fileName.split('.').pop()?.toLowerCase()
|
|
42
|
-
if (ext === 'jpg' || ext === 'jpeg')
|
|
43
|
-
return 'image/jpeg'
|
|
44
|
-
if (ext === 'png')
|
|
45
|
-
return 'image/png'
|
|
46
|
-
if (ext === 'gif')
|
|
47
|
-
return 'image/gif'
|
|
48
|
-
return 'image/png' // 默认
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
function handlePhotoUpload(photoData: any) {
|
|
52
|
-
// 添加临时预览
|
|
53
|
-
const mimeType = getImageMimeType(photoData.filePath)
|
|
54
|
-
const tempFile = {
|
|
55
|
-
uid: Date.now() + Math.random().toString(36).substr(2, 5),
|
|
56
|
-
name: photoData.filePath.split('/').pop(),
|
|
57
|
-
status: 'uploading',
|
|
58
|
-
message: '上传中...',
|
|
59
|
-
url: `data:${mimeType};base64,${photoData.content}`,
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
if (!imageList.value) {
|
|
63
|
-
imageList.value = [tempFile]
|
|
64
|
-
}
|
|
65
|
-
else {
|
|
66
|
-
imageList.value.push(tempFile)
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
const param = {
|
|
70
|
-
resUploadMode: props.uploadMode,
|
|
71
|
-
pathKey: 'Default',
|
|
72
|
-
formType: 'image',
|
|
73
|
-
useType: 'Default',
|
|
74
|
-
resUploadStock: '1',
|
|
75
|
-
filename: photoData.name,
|
|
76
|
-
filesize: photoData.size,
|
|
77
|
-
f_operator: 'server',
|
|
78
|
-
imgPath: photoData.filePath,
|
|
79
|
-
urlPath: `/api/${import.meta.env.VITE_APP_SYSTEM_NAME}/resource/upload`,
|
|
80
|
-
}
|
|
81
|
-
// 上传到服务器
|
|
82
|
-
mobileUtil.execute({
|
|
83
|
-
funcName: 'uploadResource',
|
|
84
|
-
param,
|
|
85
|
-
callbackFunc: (result: any) => {
|
|
86
|
-
if (result.status === 'success') {
|
|
87
|
-
const index = imageList.value.findIndex(item => item.uid === tempFile.uid)
|
|
88
|
-
if (index !== -1) {
|
|
89
|
-
imageList.value[index].uid = result.data.id
|
|
90
|
-
imageList.value[index].id = result.data.id
|
|
91
|
-
delete imageList.value[index].message
|
|
92
|
-
imageList.value[index].status = 'done'
|
|
93
|
-
imageList.value[index].url = result.data.f_downloadpath
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
else {
|
|
97
|
-
const index = imageList.value.findIndex(item => item.uid === tempFile.uid)
|
|
98
|
-
if (index !== -1) {
|
|
99
|
-
imageList.value[index].status = 'failed'
|
|
100
|
-
imageList.value[index].message = '上传失败'
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
if (props.outerIndex !== undefined)
|
|
105
|
-
emit('updateFileList', imageList.value.filter(item => item.status === 'done'), props.outerIndex)
|
|
106
|
-
else
|
|
107
|
-
emit('updateFileList', imageList.value.filter(item => item.status === 'done'))
|
|
108
|
-
},
|
|
109
|
-
})
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
// 删除图片
|
|
113
|
-
function deleteFileFunction(file: any) {
|
|
114
|
-
if (file.id) {
|
|
115
|
-
deleteFile({ ids: [file.id], f_state: '删除' }).then((res: any) => {
|
|
116
|
-
if (res.msg !== undefined) {
|
|
117
|
-
const targetIndex = imageList.value.findIndex(item => item.id === file.id)
|
|
118
|
-
if (targetIndex !== -1) {
|
|
119
|
-
imageList.value.splice(targetIndex, 1)
|
|
120
|
-
if (props.outerIndex !== undefined)
|
|
121
|
-
emit('updateFileList', imageList.value.filter(item => item.status === 'done'), props.outerIndex)
|
|
122
|
-
else
|
|
123
|
-
emit('updateFileList', imageList.value.filter(item => item.status === 'done'))
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
})
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
</script>
|
|
130
|
-
|
|
131
|
-
<template>
|
|
132
|
-
<div class="uploader-container">
|
|
133
|
-
<van-button
|
|
134
|
-
v-if="props.attr?.addOrEdit !== 'readonly'"
|
|
135
|
-
icon="photograph"
|
|
136
|
-
type="primary"
|
|
137
|
-
@click="triggerCamera"
|
|
138
|
-
>
|
|
139
|
-
拍照
|
|
140
|
-
</van-button>
|
|
141
|
-
|
|
142
|
-
<van-uploader
|
|
143
|
-
v-model="imageList"
|
|
144
|
-
:show-upload="false"
|
|
145
|
-
:deletable="props.attr?.addOrEdit !== 'readonly' && props.authority === 'admin'"
|
|
146
|
-
:multiple="props.authority === 'admin'"
|
|
147
|
-
:preview-image="true"
|
|
148
|
-
:before-delete="props.attr?.addOrEdit !== 'readonly' && props.authority === 'admin' ? deleteFileFunction : undefined"
|
|
149
|
-
/>
|
|
150
|
-
</div>
|
|
151
|
-
</template>
|
|
152
|
-
|
|
153
|
-
<style scoped lang="less">
|
|
154
|
-
.uploader-container {
|
|
155
|
-
display: flex;
|
|
156
|
-
flex-direction: column;
|
|
157
|
-
gap: 16px;
|
|
158
|
-
}
|
|
159
|
-
</style>
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import { deleteFile } from '@af-mobile-client-vue3/services/api/common'
|
|
3
|
+
import { mobileUtil } from '@af-mobile-client-vue3/utils/mobileUtil'
|
|
4
|
+
import {
|
|
5
|
+
Button as vanButton,
|
|
6
|
+
Uploader as vanUploader,
|
|
7
|
+
} from 'vant'
|
|
8
|
+
import { ref, watch } from 'vue'
|
|
9
|
+
|
|
10
|
+
const props = defineProps({
|
|
11
|
+
imageList: Array<any>,
|
|
12
|
+
outerIndex: { default: undefined },
|
|
13
|
+
authority: { default: 'user' },
|
|
14
|
+
uploadMode: { default: 'server' },
|
|
15
|
+
attr: { type: Object as () => { addOrEdit?: string }, default: () => ({}) },
|
|
16
|
+
})
|
|
17
|
+
const emit = defineEmits(['updateFileList'])
|
|
18
|
+
|
|
19
|
+
const imageList = ref<Array<any>>(props.imageList ?? [])
|
|
20
|
+
|
|
21
|
+
// 同步 props.imageList 到内部 imageList,保证每次变化都响应
|
|
22
|
+
watch(() => props.imageList, (newVal) => {
|
|
23
|
+
imageList.value = Array.isArray(newVal) ? [...newVal] : []
|
|
24
|
+
}, { immediate: true })
|
|
25
|
+
|
|
26
|
+
// 触发拍照
|
|
27
|
+
function triggerCamera() {
|
|
28
|
+
mobileUtil.execute({
|
|
29
|
+
funcName: 'takePicture',
|
|
30
|
+
param: {},
|
|
31
|
+
callbackFunc: (result: any) => {
|
|
32
|
+
if (result.status === 'success') {
|
|
33
|
+
handlePhotoUpload(result.data)
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
})
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// 处理拍照后的上传
|
|
40
|
+
function getImageMimeType(fileName: string): string {
|
|
41
|
+
const ext = fileName.split('.').pop()?.toLowerCase()
|
|
42
|
+
if (ext === 'jpg' || ext === 'jpeg')
|
|
43
|
+
return 'image/jpeg'
|
|
44
|
+
if (ext === 'png')
|
|
45
|
+
return 'image/png'
|
|
46
|
+
if (ext === 'gif')
|
|
47
|
+
return 'image/gif'
|
|
48
|
+
return 'image/png' // 默认
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
function handlePhotoUpload(photoData: any) {
|
|
52
|
+
// 添加临时预览
|
|
53
|
+
const mimeType = getImageMimeType(photoData.filePath)
|
|
54
|
+
const tempFile = {
|
|
55
|
+
uid: Date.now() + Math.random().toString(36).substr(2, 5),
|
|
56
|
+
name: photoData.filePath.split('/').pop(),
|
|
57
|
+
status: 'uploading',
|
|
58
|
+
message: '上传中...',
|
|
59
|
+
url: `data:${mimeType};base64,${photoData.content}`,
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
if (!imageList.value) {
|
|
63
|
+
imageList.value = [tempFile]
|
|
64
|
+
}
|
|
65
|
+
else {
|
|
66
|
+
imageList.value.push(tempFile)
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
const param = {
|
|
70
|
+
resUploadMode: props.uploadMode,
|
|
71
|
+
pathKey: 'Default',
|
|
72
|
+
formType: 'image',
|
|
73
|
+
useType: 'Default',
|
|
74
|
+
resUploadStock: '1',
|
|
75
|
+
filename: photoData.name,
|
|
76
|
+
filesize: photoData.size,
|
|
77
|
+
f_operator: 'server',
|
|
78
|
+
imgPath: photoData.filePath,
|
|
79
|
+
urlPath: `/api/${import.meta.env.VITE_APP_SYSTEM_NAME}/resource/upload`,
|
|
80
|
+
}
|
|
81
|
+
// 上传到服务器
|
|
82
|
+
mobileUtil.execute({
|
|
83
|
+
funcName: 'uploadResource',
|
|
84
|
+
param,
|
|
85
|
+
callbackFunc: (result: any) => {
|
|
86
|
+
if (result.status === 'success') {
|
|
87
|
+
const index = imageList.value.findIndex(item => item.uid === tempFile.uid)
|
|
88
|
+
if (index !== -1) {
|
|
89
|
+
imageList.value[index].uid = result.data.id
|
|
90
|
+
imageList.value[index].id = result.data.id
|
|
91
|
+
delete imageList.value[index].message
|
|
92
|
+
imageList.value[index].status = 'done'
|
|
93
|
+
imageList.value[index].url = result.data.f_downloadpath
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
else {
|
|
97
|
+
const index = imageList.value.findIndex(item => item.uid === tempFile.uid)
|
|
98
|
+
if (index !== -1) {
|
|
99
|
+
imageList.value[index].status = 'failed'
|
|
100
|
+
imageList.value[index].message = '上传失败'
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
if (props.outerIndex !== undefined)
|
|
105
|
+
emit('updateFileList', imageList.value.filter(item => item.status === 'done'), props.outerIndex)
|
|
106
|
+
else
|
|
107
|
+
emit('updateFileList', imageList.value.filter(item => item.status === 'done'))
|
|
108
|
+
},
|
|
109
|
+
})
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
// 删除图片
|
|
113
|
+
function deleteFileFunction(file: any) {
|
|
114
|
+
if (file.id) {
|
|
115
|
+
deleteFile({ ids: [file.id], f_state: '删除' }).then((res: any) => {
|
|
116
|
+
if (res.msg !== undefined) {
|
|
117
|
+
const targetIndex = imageList.value.findIndex(item => item.id === file.id)
|
|
118
|
+
if (targetIndex !== -1) {
|
|
119
|
+
imageList.value.splice(targetIndex, 1)
|
|
120
|
+
if (props.outerIndex !== undefined)
|
|
121
|
+
emit('updateFileList', imageList.value.filter(item => item.status === 'done'), props.outerIndex)
|
|
122
|
+
else
|
|
123
|
+
emit('updateFileList', imageList.value.filter(item => item.status === 'done'))
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
})
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
</script>
|
|
130
|
+
|
|
131
|
+
<template>
|
|
132
|
+
<div class="uploader-container">
|
|
133
|
+
<van-button
|
|
134
|
+
v-if="props.attr?.addOrEdit !== 'readonly'"
|
|
135
|
+
icon="photograph"
|
|
136
|
+
type="primary"
|
|
137
|
+
@click="triggerCamera"
|
|
138
|
+
>
|
|
139
|
+
拍照
|
|
140
|
+
</van-button>
|
|
141
|
+
|
|
142
|
+
<van-uploader
|
|
143
|
+
v-model="imageList"
|
|
144
|
+
:show-upload="false"
|
|
145
|
+
:deletable="props.attr?.addOrEdit !== 'readonly' && props.authority === 'admin'"
|
|
146
|
+
:multiple="props.authority === 'admin'"
|
|
147
|
+
:preview-image="true"
|
|
148
|
+
:before-delete="props.attr?.addOrEdit !== 'readonly' && props.authority === 'admin' ? deleteFileFunction : undefined"
|
|
149
|
+
/>
|
|
150
|
+
</div>
|
|
151
|
+
</template>
|
|
152
|
+
|
|
153
|
+
<style scoped lang="less">
|
|
154
|
+
.uploader-container {
|
|
155
|
+
display: flex;
|
|
156
|
+
flex-direction: column;
|
|
157
|
+
gap: 16px;
|
|
158
|
+
}
|
|
159
|
+
</style>
|
|
@@ -37,6 +37,8 @@ interface GroupFormItems {
|
|
|
37
37
|
showSubmitBtn?: boolean
|
|
38
38
|
groupName?: string
|
|
39
39
|
tableName?: string
|
|
40
|
+
paramLogicName?: string
|
|
41
|
+
isGroupForm?: boolean
|
|
40
42
|
}
|
|
41
43
|
|
|
42
44
|
interface InitParams {
|
|
@@ -55,6 +57,7 @@ const props = withDefaults(defineProps<{
|
|
|
55
57
|
submitButton?: boolean
|
|
56
58
|
isHandleFormKey?: boolean
|
|
57
59
|
paramLogicNameParam?: any
|
|
60
|
+
isGroupForm?: boolean
|
|
58
61
|
}>(), {
|
|
59
62
|
configName: undefined,
|
|
60
63
|
groupFormItems: null,
|
|
@@ -64,7 +67,8 @@ const props = withDefaults(defineProps<{
|
|
|
64
67
|
mode: '查询',
|
|
65
68
|
submitButton: true,
|
|
66
69
|
isHandleFormKey: true,
|
|
67
|
-
paramLogicNameParam:
|
|
70
|
+
paramLogicNameParam: {},
|
|
71
|
+
isGroupForm: false,
|
|
68
72
|
})
|
|
69
73
|
|
|
70
74
|
const emits = defineEmits(['onSubmit', 'xFormItemEmitFunc'])
|
|
@@ -170,29 +174,6 @@ async function loadFormConfig(): Promise<void> {
|
|
|
170
174
|
return new Promise((resolve, reject) => {
|
|
171
175
|
getConfigByName(props.configName!, (result) => {
|
|
172
176
|
if (result) {
|
|
173
|
-
// 如果有 paramLogicName,自动请求并赋值
|
|
174
|
-
if (result.paramLogicName && (!props.formData || (props.formData && Object.keys(props.formData).length === 0))) {
|
|
175
|
-
let logicParam = props.paramLogicNameParam
|
|
176
|
-
if (typeof logicParam === 'string') {
|
|
177
|
-
try {
|
|
178
|
-
logicParam = JSON.parse(logicParam)
|
|
179
|
-
}
|
|
180
|
-
catch {
|
|
181
|
-
logicParam = { value: logicParam }
|
|
182
|
-
}
|
|
183
|
-
}
|
|
184
|
-
logicParam = {
|
|
185
|
-
...logicParam,
|
|
186
|
-
currUserName: userStore.getUserInfo().name,
|
|
187
|
-
currUserId: userStore.getUserInfo().id,
|
|
188
|
-
orgId: userStore.getUserInfo().orgid,
|
|
189
|
-
}
|
|
190
|
-
runLogic(result.paramLogicName, logicParam || {}, props.serviceName).then((data: any) => {
|
|
191
|
-
if (data) {
|
|
192
|
-
form.value = data
|
|
193
|
-
}
|
|
194
|
-
})
|
|
195
|
-
}
|
|
196
177
|
setupFormConfig(result)
|
|
197
178
|
resolve()
|
|
198
179
|
}
|
|
@@ -220,6 +201,7 @@ async function initWithGroupFormItems() {
|
|
|
220
201
|
|
|
221
202
|
// 设置表单配置
|
|
222
203
|
function setupFormConfig(config: GroupFormItems) {
|
|
204
|
+
loadParamLogicNameData(config.paramLogicName)
|
|
223
205
|
formConfig.value = config
|
|
224
206
|
myServiceName.value = props.serviceName || ''
|
|
225
207
|
formGroupName.value = config.groupName || 'default'
|
|
@@ -351,6 +333,32 @@ function init(params: InitParams) {
|
|
|
351
333
|
}
|
|
352
334
|
}
|
|
353
335
|
|
|
336
|
+
function loadParamLogicNameData(paramLogicName) {
|
|
337
|
+
// 如果有 paramLogicName,自动请求并赋值
|
|
338
|
+
if (paramLogicName && (!props.formData || (props.formData && Object.keys(props.formData).length === 0))) {
|
|
339
|
+
let logicParam = props?.paramLogicNameParam || {}
|
|
340
|
+
if (typeof logicParam === 'string') {
|
|
341
|
+
try {
|
|
342
|
+
logicParam = JSON.parse(logicParam)
|
|
343
|
+
}
|
|
344
|
+
catch {
|
|
345
|
+
logicParam = { value: logicParam }
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
logicParam = {
|
|
349
|
+
...logicParam,
|
|
350
|
+
currUserName: userStore.getUserInfo().name,
|
|
351
|
+
currUserId: userStore.getUserInfo().id,
|
|
352
|
+
orgId: userStore.getUserInfo().orgid,
|
|
353
|
+
}
|
|
354
|
+
runLogic(paramLogicName, logicParam || {}, props.serviceName).then((data: any) => {
|
|
355
|
+
if (data) {
|
|
356
|
+
form.value = data
|
|
357
|
+
}
|
|
358
|
+
})
|
|
359
|
+
}
|
|
360
|
+
}
|
|
361
|
+
|
|
354
362
|
function setForm(obj: object) {
|
|
355
363
|
Object.assign(form.value, obj)
|
|
356
364
|
}
|
|
@@ -564,7 +572,7 @@ defineExpose({ init, form, formGroupName, validate, asyncSubmit, setForm, getFor
|
|
|
564
572
|
</script>
|
|
565
573
|
|
|
566
574
|
<template>
|
|
567
|
-
<VanForm v-if="loaded" ref="xFormRef" class="x-form-container" @submit="onSubmit">
|
|
575
|
+
<VanForm v-if="loaded" ref="xFormRef" class="x-form-container" :class="{ 'use-full-height': !props.isGroupForm }" @submit="onSubmit">
|
|
568
576
|
<div class="form-fields-scrollable">
|
|
569
577
|
<VanCellGroup inset>
|
|
570
578
|
<XFormItem
|
|
@@ -603,8 +611,11 @@ defineExpose({ init, form, formGroupName, validate, asyncSubmit, setForm, getFor
|
|
|
603
611
|
</template>
|
|
604
612
|
|
|
605
613
|
<style scoped>
|
|
606
|
-
.
|
|
614
|
+
.use-full-height {
|
|
607
615
|
height: calc(100vh - var(--van-nav-bar-height) - 20px);
|
|
616
|
+
}
|
|
617
|
+
|
|
618
|
+
.x-form-container {
|
|
608
619
|
display: flex;
|
|
609
620
|
flex-direction: column;
|
|
610
621
|
max-height: 100vh;
|