表单优化

main
userName 2025-04-22 16:02:48 +08:00
parent 2084d27b08
commit ef9ef2e62a
5 changed files with 26 additions and 9 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<div class="flex"> <div class="flex">
<a-input v-model:value="address" @change="inpChange" placeholder="" /> <a-input v-model:value="address" @change="inpChange" :disabled="disabled" placeholder="" />
<a-button type="primary" style="margin-left: 10px;" @click="showMaps"></a-button> <a-button type="primary" style="margin-left: 10px;" @click="showMaps"></a-button>
</div> </div>
@ -16,7 +16,16 @@
</a-col> </a-col>
</a-row> </a-row>
</div> </div>
<a-modal v-model:visible="mapsVisible" title="位置选择" @cancel="handleCancel" @ok="handleOk" width="1200px" height="850px" > <a-modal
v-model:visible="mapsVisible"
title="位置选择"
centered
:footer="disabled ? null : undefined"
@cancel="handleCancel"
@ok="handleOk"
width="1200px"
height="850px"
>
<div class="modalbox"> <div class="modalbox">
<MapboxMap @handlerDrawComplete="handlerDrawComplete" :location="location" :geoms="geomData" :isPoint="geoType"></MapboxMap> <MapboxMap @handlerDrawComplete="handlerDrawComplete" :location="location" :geoms="geomData" :isPoint="geoType"></MapboxMap>
</div> </div>
@ -33,14 +42,13 @@ import { propTypes } from '@/utils/propTypes';
defineOptions({ name: 'AddressDetails' }); defineOptions({ name: 'AddressDetails' });
const props = defineProps({ const props = defineProps({
disabled: propTypes.bool, disabled: propTypes.bool,
value: { type: String }, value: { type: String },
geoType: propTypes.bool, geoType: propTypes.bool,
}); });
onMounted(() => { onMounted(() => {
console.log('rrr112r', props)
}) })
const emitData = ref<any[]>([]); const emitData = ref<any[]>([]);
const [FormItemData] = useRuleFormItem(props); const [FormItemData] = useRuleFormItem(props);
@ -52,7 +60,7 @@ const geomData = ref()
const location = ref() const location = ref()
const showMaps = ()=>{ const showMaps = ()=>{
mapsVisible.value = true mapsVisible.value = true
if(paramsData.value.length>0){ if(paramsData.value && paramsData.value.length>0){
location.value = paramsData.value[0].center location.value = paramsData.value[0].center
geomData.value = paramsData.value geomData.value = paramsData.value
} }

View File

@ -39,7 +39,8 @@
<div style="margin-top: 8px">{{ t('component.upload.upload') }}</div> <div style="margin-top: 8px">{{ t('component.upload.upload') }}</div>
</div> </div>
</Upload> </Upload>
<Modal :open="previewOpen" title="预览" :footer="null" @cancel="handleCancel"> <Modal :open="previewOpen" title="预览" :footer="null" @cancel="handleCancel" centered draggable
:bodyStyle="{ maxHeight: '98vh', overflowY: 'auto' }">
<img alt="" style="width: 100%" :src="globalImagePreviewUrl" /> <img alt="" style="width: 100%" :src="globalImagePreviewUrl" />
</Modal> </Modal>
</div> </div>

View File

@ -5,7 +5,7 @@
<CloseOutlined/> <CloseOutlined/>
</div> </div>
<img src="./video.png" @click="handlePreview(item)" alt=""> <img src="./video.png" @click="handlePreview(item)" alt="">
<p>{{ item.name}}</p> <!-- <p>{{ item.name}}</p> -->
</div> </div>
<Upload <Upload
@ -27,7 +27,8 @@
</div> </div>
</Upload> </Upload>
<Modal :open="previewOpen" :title="previewTitle" :footer="null" @cancel="handleCancel"> <Modal :open="previewOpen" title="预览" :footer="null" @cancel="handleCancel" centered draggable
:bodyStyle="{ maxHeight: '99vh', overflowY: 'auto' }">
<!-- <img alt="" style="width: 100%" :src="previewImage" /> --> <!-- <img alt="" style="width: 100%" :src="previewImage" /> -->
<video :src="previewImage" class="video-player" controls muted autoplay></video> <video :src="previewImage" class="video-player" controls muted autoplay></video>
</Modal> </Modal>

View File

@ -848,3 +848,11 @@ watch(formFileState.url, (newValue, oldValue) => {
}); });
</script> </script>
<style scoped>
:deep(.ant-input-number-input) {
color: rgba(0, 0, 0, 0.8);
}
:deep(.ant-checkbox-disabled+span) {
color: rgba(0, 0, 0, 0.8);
}
</style>

View File

@ -475,7 +475,6 @@
} }
const handleClickForm = (status,record) => { const handleClickForm = (status,record) => {
console.log('aaaa', record)
const config = cloneDeep(formConfig.value); const config = cloneDeep(formConfig.value);
const rows = ref([]) const rows = ref([])
if(record){ if(record){