<template>
    <v-dialog v-model="$store.state.UserDetail" width="90%" transition="slide-x-transition">
        <v-card class="RTL">
            <v-card-title class=" grey lighten-3" primary-title>
                <PartTitle class="WM-Margin-T-20" TitleFa=" اطلاعات کاربر " TitleEn=" Member's Info " Color="cyan"></PartTitle>
            </v-card-title>

            <v-card-text>
                <div class="row">
                    <div class="col-md-3 WM-Align-R">
                        <div class="WM-Font-14 WM-Color-Gray"><i class="WMi-user"></i> نام و نام خانوادگی </div>
                        <div class="WM-Font-20"> علیرضا حسنی </div>
                    </div>
                    <div class="col-md-3 WM-Align-R">
                        <div class="WM-Font-14 WM-Color-Gray"><i class="WMi-mail-alt"></i> آدرس آیمیل </div>
                        <div class="WM-Font-20"> Alireza-Hassani@outlook.com </div>
                    </div>
                    <div class="col-md-3 WM-Align-R">
                        <div class="WM-Font-14 WM-Color-Gray"><i class="WMi-phone"></i> شماره ی همراه </div>
                        <div class="WM-Font-20"> 09127004945 </div>
                    </div>

                </div>
            </v-card-text>

            <v-divider></v-divider>

            <v-card-actions>
                <v-spacer></v-spacer>
                <v-btn color="cyan" depressed dark @click="$store.state.UserDetail = false">
                    <v-icon dark right>fas fa-check</v-icon> بسیار خب، ممنونم
                </v-btn>
            </v-card-actions>
        </v-card>
    </v-dialog>
</template>

<script>
import PartTitle from "../Dividers/PartTitle.vue";
import { mapGetters } from 'Vuex';

export default {
    components: {
        PartTitle,
    }
};
</script>
