feat: refs #6683 add PropertyDms and PropertyDmsImportForm components

src/pages/Property/Card/PropertyDms.vue

@@ -0,0 +1,42 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+
+import VnDmsList from 'src/components/common/VnDmsList.vue';
+import PropertyDmsImportForm from 'src/pages/Property/Card/PropertyDmsImportForm.vue';
+
+const { t } = useI18n();
+
+const dmsListRef = ref(null);
+const showImportDialog = ref(false);
+
+const onDataSaved = () => dmsListRef.value.dmsRef.fetch();
+</script>
+<template>
+    <VnDmsList
+        ref="dmsListRef"
+        model="PropertyDms"
+        update-model="propertyDms"
+        delete-model="propertyDms"
+        download-model="dms"
+        default-dms-code="propertyDms"
+        filter="propertyFk"
+    />
+    <QDialog v-model="showImportDialog">
+        <PropertyDmsImportForm @on-data-saved="onDataSaved()" />
+    </QDialog>
+    <QPageSticky position="bottom-right" :offset="[25, 90]">
+        <QBtn
+            fab
+            color="primary"
+            icon="file_copy"
+            @click="showImportDialog = true"
+            class="fill-icon"
+            data-cy="importBtn"
+        >
+            <QTooltip>
+                {{ t('property.dms.import') }}
+            </QTooltip>
+        </QBtn>
+    </QPageSticky>
+</template>

src/pages/Property/Card/PropertyDmsImportForm.vue

@@ -0,0 +1,65 @@
+<script setup>
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
+
+import VnSelect from 'src/components/common/VnSelect.vue';
+import FormModelPopup from 'components/FormModelPopup.vue';
+import FetchData from 'components/FetchData.vue';
+import useNotify from 'src/composables/useNotify.js';
+
+import axios from 'axios';
+
+const emit = defineEmits(['onDataSaved']);
+
+const { t } = useI18n();
+const { notify } = useNotify();
+const route = useRoute();
+
+const dmsOptions = ref([]);
+const dmsId = ref(null);
+
+const importDms = async () => {
+    try {
+        if (!dmsId.value) throw new Error(t(`globals.errors.documentIdEmpty`));
+
+        const data = {
+            propertyFk: route.params.id,
+            dmsFk: dmsId.value,
+        };
+
+        await axios.post('propertyDms', data);
+        notify(t('globals.dataSaved'), 'positive');
+        dmsId.value = null;
+        emit('onDataSaved');
+    } catch (e) {
+        throw new Error(e.message);
+    }
+};
+</script>
+
+<template>
+    <FetchData
+        url="Dms"
+        :filter="{ fields: ['id'], order: 'id ASC' }"
+        auto-load
+        @on-fetch="(data) => (dmsOptions = data)"
+    />
+    <FormModelPopup
+        model="DmsImport"
+        :title="t('globals.selectDocumentId')"
+        :form-initial-data="{}"
+        :save-fn="importDms"
+    >
+        <template #form-inputs>
+            <VnSelect
+                :label="t('property.dms.document')"
+                :options="dmsOptions"
+                hide-selected
+                option-label="id"
+                option-value="id"
+                v-model="dmsId"
+            />
+        </template>
+    </FormModelPopup>
+</template>