first commit + add fe component vue accone

test/vuex/acc-one-faktur-v4/components/dialog-attachment.vue

@@ -0,0 +1,103 @@
+<template>
+    <div>
+        <v-dialog v-model="dialog_attachment" persistent max-width="60vw">
+            <v-card>
+                <v-card-title class="headline grey lighten-2" primary-title>
+                    BUKTI PENERIMAAN
+                </v-card-title>
+                <v-card-text>
+                    <v-layout row wrap>
+                        <v-flex v-for="(docs) in preview_attachment" xs4 class="pa-2" :key="docs.attach_id">
+                            <div style="position: relative; padding-bottom: 35px;">
+                                <v-img :src="makeImgUrl(docs)" aspect-ratio="1" contain class="grey lighten-2"
+                                    @click="fullview(docs)"></v-img>
+                            </div>
+                        </v-flex>
+                    </v-layout>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn @click="dialog_attachment = false" color="error" class="white--text">Tutup</v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+
+        <v-dialog v-model="dialog_fullview" persistent max-width="50vw">
+            <v-card>
+                <v-card-title class="headline grey lighten-2" primary-title>
+                    {{ doctitle }}
+                    <v-spacer></v-spacer>
+                    <v-btn color="red" fab small outline @click="dialog_fullview = false">
+                        <v-icon color="red">close</v-icon>
+                    </v-btn>
+                </v-card-title>
+                <v-card-text style="max-height: 80vh; overflow-y: auto;">
+                    <div class="pa-2">
+                        <v-img :src="docurl" contain class="grey lighten-2"></v-img>
+                    </div>
+                </v-card-text>
+                <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn class="mr-2" color="red" flat outline @click="dialog_fullview = false">
+                        Tutup
+                    </v-btn>
+                </v-card-actions>
+            </v-card>
+        </v-dialog>
+    </div>
+</template>
+
+<script>
+module.exports = {
+    data() {
+        return {
+            dialog_fullview: false,
+            doctitle: "",
+            docurl: ""
+        }
+    },
+    computed: {
+        dialog_attachment: {
+            get() {
+                return this.$store.state.data.dialog_attachment
+            },
+            set(val) {
+                this.$store.commit("data/update_dialog_attachment", val)
+            }
+        },
+        preview_attachment: {
+            get() {
+                return this.$store.state.data.preview_attachment
+            },
+            set(val) {
+                this.$store.commit("data/update_preview_attachment", val)
+            }
+        }
+    },
+    methods: {
+        fullview(docs) {
+            this.doctitle = docs.img_url
+            this.docurl = this.makeImgUrl(docs)
+            this.dialog_fullview = true
+        },
+        makeImgUrl(docs) {
+            const year = new Date(docs.created).getFullYear()
+            let baseURL = BASE_URL;
+
+            switch (docs.category) {
+                case "4":
+                    baseURL += `/one-media/order-jasa/${year}/`
+                    return baseURL + docs.img_url
+                case "2":
+                    baseURL += `/one-media/order-inventaris/${year}/`
+                    return baseURL + docs.img_url
+                default:
+                    return null
+            }
+        }
+    },
+    watch: {
+
+    },
+}
+</script>