< template >
< v -container fluid >
< div class = "Tile Shadowed Padd-0 WM-Margin-B-10" >
< wm -breadcrumbs LinkClass = "WM-Link-Cyan" :items ="breadcrumbItems" > < / w m - b r e a d c r u m b s >
< / div >
< div class = "Tile Shadowed" >
< WM -PartTitle class = "WM-Margin-T-20" TitleFa = " افزودن کاربر جدید " TitleEn = " Add a new User " Color = "cyan" > < / W M - P a r t T i t l e >
< v -layout row wrap class = "WM-Section" style = "border-right-color: #32c5d2;" >
< v -flex class = "lg12 RTL text-lg-right" >
< div class = "Step En" style = "color:#32c5d2;" > 01 < / div >
< div class = "Title" >
< div class = "FA" > اطلاعـــــات عمــــــومی < / div >
< div class = "EN" > General Info < / div >
< / div >
< / v - f l e x >
< v -layout row wrap >
< v -flex class = "lg4" >
< v -card -text >
< v -autocomplete prepend -icon = " fas fa -align -justify " :items ="deparment" :filter ="customFilter" color = "cyan" item -text = " name " label = " دپارتمان کاربر " > < / v - a u t o c o m p l e t e >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex class = "lg4" >
< v -card -text >
< v -autocomplete prepend -icon = " fas fa -align -right " :items ="deparment" :filter ="customFilter" color = "cyan" item -text = " name " label = " اگر لازم است، دپارتمان کاربر را به طور جزئی تر مشخص کنید " > < / v - a u t o c o m p l e t e >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex pt -2 class = "lg1 text-lg-right" >
< v -tooltip bottom color = "black" >
< v -btn mt -4 small @ click.native = " $ store.state.ConfigUserDepartments = true " slot = "activator" outline fab color = "black" dark > < v -icon dark > fas fa - pencil - alt < / v - i c o n > < / v - b t n >
< span > ویرایش دپارتمان ه ا < / span >
< / v - t o o l t i p >
< / v - f l e x >
< / v - l a y o u t >
<!-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
Gneral Info
-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- >
< v -layout row wrap >
< v -flex lg3 >
< v -card -text >
< v -text -field label = " نام کاربر به فارسی " color = "cyan" prepend -icon = " fas fa -tag " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg3 >
< v -card -text >
< v -text -field label = " نام کاربر به انگلیسی " color = "cyan" prepend -icon = " fas fa -tag " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg3 >
< v -card -text >
< v -text -field label = " کد ملی و یا شماره گذرنامه " color = "cyan" prepend -icon = " fas fa -sort -numeric -up " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg3 >
< v -card -text >
< v -text -field label = " آدرس پست الکترونیکی " color = "cyan" prepend -icon = " fas fa -envelope " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg3 >
< v -card -text >
< v -text -field v -model = " password " : append -icon = " passwordShow ? ' fas fa -eye ' : ' fas fa -eye -slash ' " : rules = "[rules.required, rules.min]"
: type = "passwordShow ? 'text' : 'password'" label = " کلمه ی عبور " color = "cyan" prepend - icon = "fas fa-asterisk"
hint = " حداقل 8 کاراکتر " counter @ click : append = "passwordShow = !passwordShow" >
< / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg3 >
< v -card -text >
< v -text -field v -model = " passwordRetype " : append -icon = " passwordRetypeShow ? ' fas fa -eye ' : ' fas fa -eye -slash ' " : rules = "[rules.required, rules.min]"
: type = "passwordRetypeShow ? 'text' : 'password'" label = " تکرار کلمه ی عبور " color = "cyan" prepend - icon = "fas fa-asterisk"
hint = " حداقل 8 کاراکتر " counter @ click : append = "passwordRetypeShow = !passwordRetypeShow" >
< / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< / v - l a y o u t >
< / v - l a y o u t >
<!-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
Contact Info
-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- >
< v -layout row wrap class = "WM-Section" style = "border-right-color: #00838F;" >
< v -flex class = "lg12 RTL text-lg-right" >
< div class = "Step En" style = "color:#00838F;" > 02 < / div >
< div class = "Title" >
< div class = "FA" > اطلاعــــــات تمــــــاس < / div >
< div class = "EN" > Contact Info < / div >
< / div >
< / v - f l e x >
< v -flex lg2 >
< v -card -text >
< v -autocomplete prepend -icon = " fas fa -map " :items ="customerTypes" :filter ="customFilter" color = "cyan" item -text = " name " label = " شهر مشتری " > < / v - a u t o c o m p l e t e >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg2 >
< v -card -text >
< v -autocomplete prepend -icon = " fas fa -align -right " :items ="customerTypes" :filter ="customFilter" color = "cyan" item -text = " name " label = " منطقه ی مشتری " > < / v - a u t o c o m p l e t e >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg2 >
< v -card -text >
< v -text -field label = " آی دی تلگرام " color = "cyan" prepend -icon = " fas fa -telegram -plane " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg2 >
< v -card -text >
< v -text -field label = " آدرس پیج اینستاگرام " color = "cyan" prepend -icon = " fas fa -instagram " > < / v - t e x t - f i e l d >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg8 style = "position:relative; padding: 0px 15px;" >
< v -card -text class = "Duplicate" >
< v -layout row wrap pl -2 >
< v -flex lg8 >
< v -text -field label = " آدرس " color = "cyan" prepend -icon = " fas fa -map -marker " > < / v - t e x t - f i e l d >
< / v - f l e x >
< v -flex lg4 >
< v -text -field label = " شماره ی ثابت " color = "cyan" prepend -icon = " fas fa -phone " > < / v - t e x t - f i e l d >
< / v - f l e x >
< v -btn fab color = "cyan" fixed bottom left dark style = "left:15px; bottom:-25px; position:absolute" > < v -icon dark > fas fa - plus < / v - i c o n > < / v - b t n >
< v -btn fab small color = "red" fixed bottom left dark style = "left:-5px; top:-20px; position:absolute" > < v -icon dark > fas fa - times < / v - i c o n > < / v - b t n >
< / v - l a y o u t >
< / v - c a r d - t e x t >
< / v - f l e x >
< v -flex lg4 style = "position:relative; padding: 0px 20px;" >
< v -card -text class = "Duplicate" >
< v -layout row wrap pl -2 >
< v -flex lg6 >
< v -text -field label = " نام شماره " color = "cyan" prepend -icon = " fas fa -tag " > < / v - t e x t - f i e l d >
< / v - f l e x >
< v -flex lg6 >
< v -text -field label = " شماره ی تلفن " color = "cyan" prepend -icon = " fas fa -phone " > < / v - t e x t - f i e l d >
< / v - f l e x >
< v -btn fab color = "cyan" fixed bottom left dark style = "left:15px; bottom:-25px; position:absolute" > < v -icon dark > fas fa - plus < / v - i c o n > < / v - b t n >
< v -btn fab small color = "red" fixed bottom left dark style = "left:-5px; top:-20px; position:absolute" > < v -icon dark > fas fa - times < / v - i c o n > < / v - b t n >
< / v - l a y o u t >
< / v - c a r d - t e x t >
< / v - f l e x >
< / v - l a y o u t >
< v -layout row wrap >
< v -flex mt -3 class = "lg12 RTL text-lg-left" >
< hr >
< v -btn large round color = "cyan" dark > < v -icon dark > fas fa - plus < / v - i c o n > ا ف ز و د ن ک ا ر ب ر < / v - b t n >
< / v - f l e x >
< / v - l a y o u t >
< / div >
<!-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
Modals : : BEGIN
-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- >
< template >
< div class = "text-xs-center" >
< wm -user -departments -edit > < / w m - u s e r - d e p a r t m e n t s - e d i t >
< / div >
< / template >
<!-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
Modals : : END
-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- >
< / v - c o n t a i n e r >
< / template >
< script >
import DepartmentEdit from "@User/components/Config/Department/Modal-Layout.vue" ;
export default {
components : {
'wm-user-departments-edit' : DepartmentEdit ,
} ,
data ( ) {
return {
passwordShow : false ,
passwordRetypeShow : false ,
password : '' ,
passwordRetype : '' ,
rules : {
required : value => ! ! value || 'اجباری' ,
min : v => v . length >= 8 || ' کلمه ی عبور باید حداقل 8 حرف باشد ' ,
emailMatch : ( ) => ( 'The email and password you entered don\'t match' )
} ,
hasSaved : false ,
model : null ,
categories : [
{ name : ' تلفن همراه ' , abbr : 'FL' , id : 1 } ,
{ name : ' تبلت ' , abbr : 'GA' , id : 2 } ,
{ name : ' لپ تاپ ' , abbr : 'NE' , id : 3 } ,
{ name : ' کامپیوتر ' , abbr : 'CA' , id : 4 } ,
{ name : ' دوربین ' , abbr : 'NY' , id : 5 }
] ,
customerTypes : [
{ name : ' حقیقی ' , abbr : 'FL' , id : 1 } ,
{ name : ' حقوقی ' , abbr : 'GA' , id : 2 } ,
] ,
breadcrumbItems : [
{
text : ' کاربران من ' ,
disabled : false ,
routeName : 'UserList'
} ,
{
text : ' افزودن کاربر جدید ' ,
disabled : true ,
routeName : 'AddUser'
}
]
}
} ,
} ;
< / script >
< style scoped lang = "scss" >
. v - card _ _text {
padding - top : 4 px ;
}
. v - btn -- round i {
margin - left : 10 px ;
margin - top : - 4 px ;
}
< / style >