ADD: Utm Convert

FIX: Features data not saving and not loading
This commit is contained in:
2025-05-10 20:48:03 +03:30
parent abddf06a28
commit 8bae1d064a
6 changed files with 272 additions and 27 deletions
+92 -19
View File
@@ -47,7 +47,6 @@ const route = useRoute();
const router = useRouter();
const mapKey = 'web.79abbab4970e401781f434da3e41cfa6';
const serviceKey = 'service.11d860f52c434bd29e5f84d0a0a41108';
const mapRef = ref();
const transactions = ref([]);
const stockData = ref({});
@@ -118,6 +117,7 @@ onBeforeMount(async () => {
if (route.name === 'edit-belonging') {
editMode.value = true;
belonging.value = await BelongingService.getBelonging(route.params.belongingId);
featuresValues.value = extractFeaturesValues(belonging.value.features);
transactions.value = await TransactionService.getTransactionsByBelongingId(route.params.belongingId);
stockData.value = await TransactionService.getStockByBelongingId(route.params.belongingId);
mainImageUrlsWithData.value = fillImagesArray(belonging.value?.mainImageUrls || []);
@@ -126,6 +126,67 @@ onBeforeMount(async () => {
});
const showTransactionDialog = ref(false);
import { UTMtoLatLon, LatLontoUTM } from '@/utm';
const easting = ref();
const northing = ref();
const zone = ref();
const lat = ref();
const long = ref();
const convertUTMtoLatLng = () => {
if (easting.value && northing.value && zone.value) {
try {
const result = UTMtoLatLon(
Number(easting.value),
Number(northing.value),
Number(zone.value),
'N' // Change to 'S' if in Southern Hemisphere
);
lat.value = result.latitude;
long.value = result.longitude;
console.log(lat.value, long.value);
searchLocation(lat.value, long.value);
} catch (error) {
console.error('Error converting UTM to Lat/Lng:', error);
}
}
};
// Watch nationalGeoCode to split and convert to Lat/Lng
watch(
() => belonging.value.nationalGeoCode,
(newCode) => {
if (newCode && newCode.length === 15) {
easting.value = newCode.substring(0, 6); // First 6 digits for easting
northing.value = newCode.substring(6, 13); // Next 6 digits for northing
zone.value = newCode.substring(13, 15); // Last 2 digits for zone
// Convert to Lat/Lng after splitting
convertUTMtoLatLng();
}
}
);
const mapRef = ref();
const searchLocation = (lat, lon) => {
if (mapRef.value) {
mapRef.value.searchByCoordinates(lat, lon);
}
};
watch(
() => belonging.value.category,
(newCategory) => {
if (editMode.value && newCategory) {
selectedCategory.value = categories.value.find((x) => x._id === newCategory);
if (selectedCategory.value) {
features.value = selectedCategory.value.features;
}
}
}
);
const fillImagesArray = (imageUrls) => {
const images = [];
for (let url of imageUrls) {
@@ -161,12 +222,36 @@ const handleSelectCategory = ($event) => {
}
};
const extractFeatures = (featuresValues) => {
const features = [];
for (const [key, value] of Object.entries(featuresValues)) {
features.push({
definition: key,
value: value
});
}
return features;
};
const extractFeaturesValues = (features) => {
const featuresValues = {};
for (let feature of features) {
featuresValues[feature.definition] = feature.value;
}
return featuresValues;
};
const saveBelonging = async () => {
let status = 'failed';
console.log(belonging);
if (belonging?.value._id?.trim()) {
belonging.value.mainImageUrls = mainImageUrlsWithData.value.map((x) => x.url);
belonging.value.documentUrls = documentUrlsWithData.value.map((x) => x.url);
belonging.value.features = extractFeatures(featuresValues.value);
status = await BelongingService.updateBelonging(belonging.value._id, belonging.value);
} else {
status = await BelongingService.createBelonging(belonging.value);
@@ -181,23 +266,6 @@ const saveBelonging = async () => {
await router.push('/belonging/list-belongings');
};
watch(
() => mapRef.value?.state.map,
(nv, ol) => {
if (ol) return;
setTimeout(() => {
mapRef.value?.state.map?.setMapType('standard-night');
if (mapRef.value?.state.mapType) mapRef.value.state.mapType = 'standard-night';
}, 2000);
setTimeout(() => {
mapRef.value?.search({
term: 'ولی عصر',
coords: [51.36281969540723, 35.69672648316882]
});
}, 3000);
}
);
const filters = ref({
global: { value: null, matchMode: FilterMatchMode.CONTAINS },
type: { value: null, matchMode: FilterMatchMode.EQUALS },
@@ -336,7 +404,7 @@ const formatDate = (dateString) => {
</div>
<div class="my-10">
<label class="text-lg"> موقعیت دارایی </label>
<MapComponent v-model="belonging.location.coordinates" />
<MapComponent ref="mapRef" v-model="belonging.location.coordinates" />
<!-- <MapIrComponent />-->
</div>
@@ -447,6 +515,11 @@ const formatDate = (dateString) => {
<label class="text-lg"> برچسب ها </label>
<KiwiChips v-model="belonging.tags" class="w-full" placeholder="مثلا: زمین، ملک، کیانپارس..." />
</div>
<div class="my-8">
<label class="text-lg"> شناسه ملی جغرافیایی </label>
<InputText v-model="belonging.nationalGeoCode" class="w-full" placeholder="شناسه 14 رقمی سند" />
</div>
</div>
</div>
@@ -1,5 +1,5 @@
<script setup>
import { ref, reactive } from 'vue';
import { ref, reactive, watch, onMounted } from 'vue';
import { useToast } from 'primevue/usetoast';
import { TransactionService } from '@/service/TransactionService';
@@ -11,6 +11,14 @@ const props = defineProps({
belongingId: {
type: String,
required: true
},
editMode: {
type: Boolean,
default: false
},
transactionData: {
type: Object,
default: null
}
});
@@ -23,7 +31,8 @@ const transaction = reactive({
status: 'pending',
value: null,
description: '',
date: new Date().toISOString()
date: new Date().toISOString(),
_id: null
});
const typeOptions = [
@@ -43,6 +52,43 @@ const errors = reactive({
value: ''
});
// Watch for changes in editMode and transactionData
watch(
() => props.transactionData,
(newValue) => {
if (newValue && props.editMode) {
// Load transaction data for editing
Object.assign(transaction, {
type: newValue.type || 'deposit',
status: newValue.status || 'pending',
value: newValue.value || null,
description: newValue.description || '',
date: newValue.date || new Date().toISOString(),
_id: newValue._id || null
});
}
},
{ immediate: true }
);
// Reset form when dialog opens
watch(
() => props.visible,
(isVisible) => {
if (isVisible && !props.editMode) {
// Reset form for create mode
Object.assign(transaction, {
type: 'deposit',
status: 'pending',
value: null,
description: '',
date: new Date().toISOString(),
_id: null
});
}
}
);
const validateForm = () => {
let isValid = true;
@@ -78,9 +124,19 @@ const saveTransaction = async () => {
try {
transaction.belongingId = props.belongingId;
const result = await TransactionService.createTransaction(transaction);
let result;
if (props.editMode && transaction._id) {
// Update existing transaction
result = await TransactionService.updateTransaction(transaction._id, transaction);
} else {
// Create new transaction
result = await TransactionService.createTransaction(transaction);
}
if (result === 'success') {
toast.add({ severity: 'success', summary: 'موفق', detail: 'تراکنش با موفقیت ثبت شد', life: 3000 });
const message = props.editMode ? 'تراکنش با موفقیت بروزرسانی شد' : 'تراکنش با موفقیت ثبت شد';
toast.add({ severity: 'success', summary: 'موفق', detail: message, life: 3000 });
emit('saved');
closeDialog();
} else {
@@ -98,7 +154,7 @@ const closeDialog = () => {
</script>
<template>
<Dialog v-model:visible="props.visible" :modal="true" :closable="true" :style="{ width: '450px' }" header="افزایش یا کاهش موجودی" @update:visible="closeDialog">
<Dialog v-model:visible="props.visible" :modal="true" :closable="true" :style="{ width: '450px' }" :header="props.editMode ? 'ویرایش تراکنش' : 'افزایش یا کاهش موجودی'" @update:visible="closeDialog">
<div class="p-fluid">
<div class="field mb-4">
<label class="font-bold mb-2 block">نوع تراکنش</label>
@@ -127,7 +183,7 @@ const closeDialog = () => {
<template #footer>
<div class="flex justify-end gap-2">
<Button label="انصراف" icon="pi pi-times" class="p-button-text" @click="closeDialog" />
<Button label="ذخیره" icon="pi pi-check" @click="saveTransaction" />
<Button :label="props.editMode ? 'بروزرسانی' : 'ذخیره'" icon="pi pi-check" @click="saveTransaction" />
</div>
</template>
</Dialog>