Mr Swift
1101 lines
41 KiB
Vue
1101 lines
41 KiB
Vue
<template>
|
|
<div>
|
|
<div class="representation-form" :class="!data && 'panel'">
|
|
<template v-if="!data">
|
|
<h1>فرم درخواست نمایندگی خدمات پس از فروش</h1>
|
|
<div class="notic">
|
|
<p>
|
|
تکمیل این فرم صرفاً جهت درخواست اخذ نمایدگی خدمات پس از فروش از شرکت آسان سرویس بوده و ارسال آن تعهدی برای
|
|
اعطای نمایندگی محسوب نشده و فقط در صورت نیاز شرکت با متقاضیان محترم تماس گرفته میشود.
|
|
</p>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- representation type -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>انتخاب نوع نمایندگی</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow selectable full" :class="validation.representation_type && 'err'">
|
|
<span>نمایندگی:</span>
|
|
<div class="options">
|
|
<label for="representation_type2">
|
|
<span>لوازم جانبی کامپیوتر و موبایل</span>
|
|
<input id="representation_type2" v-model="formData.representation_type" type="radio" value="verity" />
|
|
</label>
|
|
<label for="representation_type1">
|
|
<span>لوازم صوتی و تصویری خودرو</span>
|
|
<input id="representation_type1" v-model="formData.representation_type" type="radio" value="panatech" />
|
|
</label>
|
|
<label for="representation_type3">
|
|
<span>هر دو گزینه</span>
|
|
<input id="representation_type3" v-model="formData.representation_type" type="radio" value="both" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.representation_type">{{ validation.representation_type.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- personal info -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>مشخصات فردی متقاضی</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow" :class="validation.full_name && 'err'">
|
|
<label for="fullName">
|
|
<span>نام و نام خانوادگی:</span>
|
|
<input
|
|
id="fullName"
|
|
type="text"
|
|
name="fullName"
|
|
disabled
|
|
:title="disabledFieldTitle"
|
|
:value="isAdmin ? formData.full_name : userFullName"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.full_name">{{ validation.full_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.national_code && 'err'">
|
|
<label for="national_code">
|
|
<span>کد ملی:</span>
|
|
<input
|
|
id="national_code"
|
|
type="text"
|
|
name="national_code"
|
|
disabled
|
|
:title="disabledFieldTitle"
|
|
:value="isAdmin ? formData.national_code : user.national_code"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.national_code">{{ validation.national_code.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.id_number && 'err'">
|
|
<label for="id_number">
|
|
<span>شماره شناسنامه:</span>
|
|
<input
|
|
id="id_number"
|
|
v-model="formData.id_number"
|
|
type="text"
|
|
name="id_number"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.id_number">{{ validation.id_number.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.place_of_issue && 'err'">
|
|
<label for="place_of_issue">
|
|
<span>محل صدور:</span>
|
|
<input
|
|
id="place_of_issue"
|
|
v-model="formData.place_of_issue"
|
|
type="text"
|
|
name="place_of_issue"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.place_of_issue">{{ validation.place_of_issue.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.birth_date && 'err'">
|
|
<label for="birth_date">
|
|
<span>تاریخ تولد:</span>
|
|
<input
|
|
id="birth_date"
|
|
v-model="formData.birth_date"
|
|
type="text"
|
|
name="birth_date"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.birth_date">{{ validation.birth_date.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.fathers_name && 'err'">
|
|
<label for="fathers_name">
|
|
<span>نام پدر:</span>
|
|
<input
|
|
id="fathers_name"
|
|
v-model="formData.fathers_name"
|
|
type="text"
|
|
name="fathers_name"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.fathers_name">{{ validation.fathers_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.education_level && 'err'">
|
|
<label for="education_level">
|
|
<span>میزان تحصیلات:</span>
|
|
<input
|
|
id="education_level"
|
|
v-model="formData.education_level"
|
|
type="text"
|
|
name="education_level"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.education_level">{{ validation.education_level.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.military_status && 'err'">
|
|
<label for="military_status">
|
|
<span>وضعیت نظام وظیفه:</span>
|
|
<input
|
|
id="military_status"
|
|
v-model="formData.military_status"
|
|
type="text"
|
|
name="military_status"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.military_status">{{ validation.military_status.msg }}</p>
|
|
</div>
|
|
<div class="formRow full textarea" :class="validation.certificates && 'err'">
|
|
<label for="certificates">
|
|
<span>گواهینامه های تخصصی اخذ شده:</span>
|
|
<textarea
|
|
id="certificates"
|
|
v-model="formData.certificates"
|
|
rows="10"
|
|
:placeholder="globalPlaceholder"
|
|
></textarea>
|
|
</label>
|
|
<p v-if="validation.certificates">{{ validation.certificates.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- contact info -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>اطلاعات تماس</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow" :class="validation.province_name && 'err'">
|
|
<label for="province_name">
|
|
<span>استان:</span>
|
|
<input
|
|
id="province_name"
|
|
type="text"
|
|
name="province_name"
|
|
disabled
|
|
:title="disabledFieldTitle"
|
|
:value="isAdmin ? formData.province_name : user.province_name"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.province_name">{{ validation.province_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.city_name && 'err'">
|
|
<label for="city_name">
|
|
<span>شهرستان:</span>
|
|
<input
|
|
id="city_name"
|
|
type="text"
|
|
name="city_name"
|
|
disabled
|
|
:title="disabledFieldTitle"
|
|
:value="isAdmin ? formData.city_name : user.city_name"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.city_name">{{ validation.city_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.store_name && 'err'">
|
|
<label for="store_name">
|
|
<span>نام شرکت/تعمیرگاه:</span>
|
|
<input
|
|
id="store_name"
|
|
v-model="formData.store_name"
|
|
type="text"
|
|
name="store_name"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.store_name">{{ validation.store_name.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.postal_code && 'err'">
|
|
<label for="postal_code">
|
|
<span>کد پستی:</span>
|
|
<input
|
|
id="postal_code"
|
|
v-model="formData.postal_code"
|
|
type="text"
|
|
name="postal_code"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.postal_code">{{ validation.postal_code.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.mobile_number && 'err'">
|
|
<label for="mobile_number">
|
|
<span>تلفن همراه:</span>
|
|
<input
|
|
id="mobile_number"
|
|
v-model=" formData.mobile_number "
|
|
type="text"
|
|
name="mobile_number"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.mobile_number">{{ validation.mobile_number.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.tel_number && 'err'">
|
|
<label for="tel_number">
|
|
<span>تلفن شرکت/تعمیرگاه:</span>
|
|
<input
|
|
id="tel_number"
|
|
v-model="formData.tel_number"
|
|
type="text"
|
|
name="tel_number"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.tel_number">{{ validation.tel_number.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.fax_number && 'err'">
|
|
<label for="fax_number">
|
|
<span>فکس شرکت/تعمیرگاه:</span>
|
|
<input
|
|
id="fax_number"
|
|
v-model="formData.fax_number"
|
|
type="text"
|
|
name="fax_number"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.fax_number">{{ validation.fax_number.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.economic_code && 'err'">
|
|
<label for="economic_code">
|
|
<span>کد اقتصادی (در صورت وجود):</span>
|
|
<input
|
|
id="economic_code"
|
|
v-model="formData.economic_code"
|
|
type="text"
|
|
name="economic_code"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.economic_code">{{ validation.economic_code.msg }}</p>
|
|
</div>
|
|
<div class="formRow full" :class="validation.email && 'err'">
|
|
<label for="email">
|
|
<span>ایمیل:</span>
|
|
<input
|
|
id="email"
|
|
v-model="formData.email"
|
|
type="email"
|
|
name="email"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.email">{{ validation.email.msg }}</p>
|
|
</div>
|
|
<div class="formRow full textarea" :class="validation.address && 'err'">
|
|
<label for="address">
|
|
<span>آدرس:</span>
|
|
<textarea
|
|
id="address"
|
|
v-model="formData.address"
|
|
rows="10"
|
|
placeholder="آدرس را بدون ذکر استان و شهر و به صورت دقیق بنویسید، مرسوله های ارسالی به این آدرس پست خواهند شد."
|
|
></textarea>
|
|
</label>
|
|
<p v-if="validation.address">{{ validation.address.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- location info -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>مشخصات مکان نماینده</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow selectable" :class="validation.business_license && 'err'">
|
|
<span>جواز کسب:</span>
|
|
<div class="options">
|
|
<label for="have_business_license">
|
|
<span>دارم</span>
|
|
<input id="have_business_license" v-model="formData.business_license" type="radio" :value="true" />
|
|
</label>
|
|
<label for="not_hav_business_license">
|
|
<span>ندارم</span>
|
|
<input id="not_hav_business_license" v-model="formData.business_license" type="radio" :value="false" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.business_license">{{ validation.business_license.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow selectable" :class="validation.ownership_type && 'err'">
|
|
<span>نوع مالکیت:</span>
|
|
<div class="options">
|
|
<label for="ownership_type1">
|
|
<span>مالک</span>
|
|
<input id="ownership_type1" v-model="formData.ownership_type" type="radio" value="owner" />
|
|
</label>
|
|
|
|
<label for="ownership_type2">
|
|
<span>استیجاری</span>
|
|
<input id="ownership_type2" v-model="formData.ownership_type" type="radio" value="rent" />
|
|
</label>
|
|
|
|
<label for="ownership_type3">
|
|
<span>سرقفلی</span>
|
|
<input id="ownership_type3" v-model="formData.ownership_type" type="radio" value="rghit_of_business" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.ownership_type">{{ validation.ownership_type.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow" :class="validation.total_area && 'err'">
|
|
<label for="total_area">
|
|
<span>متراژ کل (متر):</span>
|
|
<input
|
|
id="total_area"
|
|
v-model="formData.total_area"
|
|
type="text"
|
|
name="total_area"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.total_area">{{ validation.total_area.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.repair_area && 'err'">
|
|
<label for="repair_area">
|
|
<span>متراژ محل تعمیرات (متر):</span>
|
|
<input
|
|
id="repair_area"
|
|
v-model="formData.repair_area"
|
|
type="text"
|
|
name="repair_area"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.repair_area">{{ validation.repair_area.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.stock_area && 'err'">
|
|
<label for="stock_area">
|
|
<span>متراژ انبار (متر):</span>
|
|
<input
|
|
id="stock_area"
|
|
v-model="formData.stock_area"
|
|
type="text"
|
|
name="stock_area"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.stock_area">{{ validation.stock_area.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.customer_reference_floor && 'err'">
|
|
<label for="customer_reference_floor">
|
|
<span>طبقه محل مراجعه مشتریان:</span>
|
|
<input
|
|
id="customer_reference_floor"
|
|
v-model="formData.customer_reference_floor"
|
|
type="text"
|
|
name="customer_reference_floor"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.customer_reference_floor">{{ validation.customer_reference_floor.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow selectable full" :class="validation.place_location && 'err'">
|
|
<span>موقعیت مکانی:</span>
|
|
<div class="options">
|
|
<label for="place_location1">
|
|
<span>مرکز صنف موبایل و کامپیوتر</span>
|
|
<input id="place_location1" v-model="formData.place_location" type="radio" value="tech_passage" />
|
|
</label>
|
|
<label for="place_location2">
|
|
<span>سایر</span>
|
|
<input id="place_location2" v-model="formData.place_location" type="radio" value="other" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.place_location">{{ validation.place_location.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow selectable full" :class="validation.geo_location && 'err'">
|
|
<span>موقعیت جغرافیایی:</span>
|
|
<div class="options">
|
|
<label for="geo_location1">
|
|
<span>خیابان اصلی</span>
|
|
<input id="geo_location1" v-model="formData.geo_location" type="radio" value="main_street" />
|
|
</label>
|
|
<label for="geo_location2">
|
|
<span>خیابان فرعی</span>
|
|
<input id="geo_location2" v-model="formData.geo_location" type="radio" value="side_street" />
|
|
</label>
|
|
<label for="geo_location3">
|
|
<span>کوچه</span>
|
|
<input id="geo_location3" v-model="formData.geo_location" type="radio" value="alley" />
|
|
</label>
|
|
<label for="geo_location4">
|
|
<span>داخل پاساژ</span>
|
|
<input id="geo_location4" v-model="formData.geo_location" type="radio" value="inside_passage" />
|
|
</label>
|
|
<label for="geo_location5">
|
|
<span>بر پاساژ</span>
|
|
<input id="geo_location5" v-model="formData.geo_location" type="radio" value="outside_passage" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.geo_location">{{ validation.geo_location.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow full" :class="validation.banner_info && 'err'">
|
|
<label for="banner_info">
|
|
<span>تعداد و ابعاد تابلو:</span>
|
|
<input
|
|
id="banner_info"
|
|
v-model="formData.banner_info"
|
|
type="text"
|
|
name="banner_info"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.banner_info">{{ validation.banner_info.msg }}</p>
|
|
</div>
|
|
</form>
|
|
|
|
<form class="form form_4">
|
|
<div class="formRow" :class="validation.repair_technicians && 'err'">
|
|
<label for="repair_technicians">
|
|
<span>تعداد تکنسین های تعمیرگاه:</span>
|
|
<input
|
|
id="repair_technicians"
|
|
v-model="formData.repair_technicians"
|
|
type="text"
|
|
name="repair_technicians"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.repair_technicians">{{ validation.repair_technicians.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.repair_masters && 'err'">
|
|
<label for="repair_masters">
|
|
<span>تعداد استادکار تعمیرگاه:</span>
|
|
<input
|
|
id="repair_masters"
|
|
v-model="formData.repair_masters"
|
|
type="text"
|
|
name="repair_masters"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.repair_masters">{{ validation.repair_masters.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.office_workers && 'err'">
|
|
<label for="office_workers">
|
|
<span>تعداد کارکنان اداری:</span>
|
|
<input
|
|
id="office_workers"
|
|
v-model="formData.office_workers"
|
|
type="text"
|
|
name="office_workers"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.office_workers">{{ validation.office_workers.msg }}</p>
|
|
</div>
|
|
<div class="formRow" :class="validation.bike_deliveries && 'err'">
|
|
<label for="bike_deliveries">
|
|
<span>تعداد پیک موتوری:</span>
|
|
<input
|
|
id="bike_deliveries"
|
|
v-model="formData.bike_deliveries"
|
|
type="text"
|
|
name="bike_deliveries"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.bike_deliveries">{{ validation.bike_deliveries.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- experience info -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>سابقه فعالیت</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow full" :class="validation.computer_repair_exp && 'err'">
|
|
<label for="computer_repair_exp">
|
|
<span>سابقه فعالیت در تعمیر ابزار جانبی موبایل و کامپیوتر (سال):</span>
|
|
<input
|
|
id="computer_repair_exp"
|
|
v-model="formData.computer_repair_exp"
|
|
type="text"
|
|
name="computer_repair_exp"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.computer_repair_exp">{{ validation.computer_repair_exp.msg }}</p>
|
|
</div>
|
|
<div class="formRow full" :class="validation.multimedia_repair_exp && 'err'">
|
|
<label for="multimedia_repair_exp">
|
|
<span>سابقه فعالیت در تعمیر لوزام صوتی و تصویری (سال):</span>
|
|
<input
|
|
id="multimedia_repair_exp"
|
|
v-model="formData.multimedia_repair_exp"
|
|
type="text"
|
|
name="multimedia_repair_exp"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.multimedia_repair_exp">{{ validation.multimedia_repair_exp.msg }}</p>
|
|
</div>
|
|
<div class="formRow full" :class="validation.business_exp && 'err'">
|
|
<label for="business_exp">
|
|
<span>سابقه در محل کسب (سال):</span>
|
|
<input
|
|
id="business_exp"
|
|
v-model="formData.business_exp"
|
|
type="text"
|
|
name="business_exp"
|
|
:placeholder="globalPlaceholder"
|
|
autocomplete="false"
|
|
/>
|
|
</label>
|
|
<p v-if="validation.business_exp">{{ validation.business_exp.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- common questions -->
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>آشنایی با آسان سرویس</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow selectable full" :class="validation.know_asanServ_from && 'err'">
|
|
<span>نحوه آشنایی با شرکت:</span>
|
|
<div class="options">
|
|
<label for="know_asanServ_from1">
|
|
<span>نماینده فروش</span>
|
|
<input
|
|
id="know_asanServ_from1"
|
|
v-model="formData.know_asanServ_from"
|
|
type="radio"
|
|
value="company_agents"
|
|
/>
|
|
</label>
|
|
|
|
<label for="know_asanServ_from2">
|
|
<span>وب سایت</span>
|
|
<input id="know_asanServ_from2" v-model="formData.know_asanServ_from" type="radio" value="website" />
|
|
</label>
|
|
<label for="know_asanServ_from3">
|
|
<span>پرسنل سازمان</span>
|
|
<input
|
|
id="know_asanServ_from3"
|
|
v-model="formData.know_asanServ_from"
|
|
type="radio"
|
|
value="company_workers"
|
|
/>
|
|
</label>
|
|
<label for="know_asanServ_from4">
|
|
<span>نمایشگاه</span>
|
|
<input id="know_asanServ_from4" v-model="formData.know_asanServ_from" type="radio" value="exhibition" />
|
|
</label>
|
|
<label for="know_asanServ_from5">
|
|
<span>معرفی</span>
|
|
<input id="know_asanServ_from5" v-model="formData.know_asanServ_from" type="radio" value="introduced" />
|
|
</label>
|
|
<label for="know_asanServ_from6">
|
|
<span>سایر</span>
|
|
<input id="know_asanServ_from6" v-model="formData.know_asanServ_from" type="radio" value="other" />
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.know_asanServ_from">{{ validation.know_asanServ_from.msg }}</p>
|
|
</div>
|
|
|
|
<div class="formRow full textarea" :class="validation.introducer_info && 'err'">
|
|
<label for="introducer_info">
|
|
<span>در صورتیکه معرف دارید مشخصات ایشان را ذکر کنید:</span>
|
|
<textarea
|
|
id="introducer_info"
|
|
v-model="formData.introducer_info"
|
|
rows="10"
|
|
:placeholder="globalPlaceholder"
|
|
></textarea>
|
|
</label>
|
|
<p v-if="validation.introducer_info">{{ validation.introducer_info.msg }}</p>
|
|
</div>
|
|
<div class="formRow selectable full" :class="validation.asanServ_products_knowledge && 'err'">
|
|
<span>میزان آشنایی با محصولات آسان سرویس:</span>
|
|
<div class="options">
|
|
<label for="asanServ_products_knowledge1">
|
|
<span>زیاد</span>
|
|
<input
|
|
id="asanServ_products_knowledge1"
|
|
v-model="formData.asanServ_products_knowledge"
|
|
type="radio"
|
|
:value="4"
|
|
/>
|
|
</label>
|
|
|
|
<label for="asanServ_products_knowledge2">
|
|
<span>نسبتاً خوب</span>
|
|
<input
|
|
id="asanServ_products_knowledge2"
|
|
v-model="formData.asanServ_products_knowledge"
|
|
type="radio"
|
|
:value="3"
|
|
/>
|
|
</label>
|
|
<label for="asanServ_products_knowledge3">
|
|
<span>متوسط</span>
|
|
<input
|
|
id="asanServ_products_knowledge3"
|
|
v-model="formData.asanServ_products_knowledge"
|
|
type="radio"
|
|
:value="2"
|
|
/>
|
|
</label>
|
|
<label for="asanServ_products_knowledge4">
|
|
<span>کم</span>
|
|
<input
|
|
id="asanServ_products_knowledge4"
|
|
v-model="formData.asanServ_products_knowledge"
|
|
type="radio"
|
|
:value="1"
|
|
/>
|
|
</label>
|
|
<label for="asanServ_products_knowledge5">
|
|
<span>خیلی کم</span>
|
|
<input
|
|
id="asanServ_products_knowledge5"
|
|
v-model="formData.asanServ_products_knowledge"
|
|
type="radio"
|
|
:value="0"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.asanServ_products_knowledge">
|
|
{{ validation.asanServ_products_knowledge.msg }}
|
|
</p>
|
|
</div>
|
|
<div class="formRow selectable full" :class="validation.computer_saling_exp && 'err'">
|
|
<span>آیا در زمینه فروش لوازم جانبی موبایل و کامپیوتر فعالیت دارید؟</span>
|
|
<div class="options">
|
|
<label for="have_computer_saling_exp">
|
|
<span>بله</span>
|
|
<input
|
|
id="have_computer_saling_exp"
|
|
v-model="formData.computer_saling_exp"
|
|
type="radio"
|
|
:value="true"
|
|
/>
|
|
</label>
|
|
|
|
<label for="not_have_computer_saling_exp">
|
|
<span>خیر</span>
|
|
<input
|
|
id="not_have_computer_saling_exp"
|
|
v-model="formData.computer_saling_exp"
|
|
type="radio"
|
|
:value="false"
|
|
/>
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.computer_saling_exp">{{ validation.computer_saling_exp.msg }}</p>
|
|
</div>
|
|
<div class="formRow full textarea" :class="validation.computer_saling_description && 'err'">
|
|
<label for="computer_saling_description">
|
|
<span>در صورت فعالیت فروش، نام شرکت و نوع محصول را نام ببرید:</span>
|
|
<textarea
|
|
id="computer_saling_description"
|
|
v-model="formData.computer_saling_description"
|
|
rows="10"
|
|
:placeholder="globalPlaceholder"
|
|
></textarea>
|
|
</label>
|
|
</div>
|
|
<p v-if="validation.computer_saling_description">{{ validation.computer_saling_description.msg }}</p>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- other representation data -->
|
|
<h3 class="notic2">
|
|
<span>در صورتی که نمایندگی خدمات یا نمایندگی تعمیرات نشان تجاری دیگری را هم دارید جدول زیر را تکمیل کنید.</span>
|
|
</h3>
|
|
<div class="box">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>ردیف</th>
|
|
<th>نشان تجاری</th>
|
|
<th>نام شرکت</th>
|
|
<th>سابقه همکاری (سال)</th>
|
|
<th>سال شروع همکاری</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="(item, index) in formData.other_representations" :key="'_rePre' + index">
|
|
<td>{{ index + 1 }}</td>
|
|
<td>{{ item.trademark }}</td>
|
|
<td>{{ item.company_name }}</td>
|
|
<td>{{ item.cooperation_history }}</td>
|
|
<td>
|
|
{{ item.cooperation_start_year }}
|
|
<i class="fas fa-trash-alt" @click="removeOtherRepItem(index)"></i>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="add-btn" colspan="5">
|
|
<button @click="showRepresentationsModal = true">افزودن مورد جدید +</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<h3 class="notic2">
|
|
<span>درصورتی که توضیحات بیشتری دارید میتوانید در باکس زیر بنویسید.</span>
|
|
</h3>
|
|
|
|
<div class="box">
|
|
<div class="box-title">
|
|
<p>سایر توضیحات</p>
|
|
</div>
|
|
<form class="form form_4">
|
|
<div class="formRow full textarea" :class="validation.more_descriptions && 'err'">
|
|
<label for="more_descriptions">
|
|
<span>توضیحات:</span>
|
|
<textarea
|
|
id="more_descriptions"
|
|
v-model="formData.more_descriptions"
|
|
rows="10"
|
|
:placeholder="globalPlaceholder"
|
|
></textarea>
|
|
</label>
|
|
<p v-if="validation.more_descriptions">{{ validation.more_descriptions.msg }}</p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="post-form">
|
|
<el-button v-if="!data" class="btn btn-primary custom-el-button" :loading="waiting" @click="send">
|
|
مرحله بعد
|
|
</el-button>
|
|
<el-button v-else class="btn btn-primary custom-el-button" :loading="waiting" @click="update">
|
|
بروزرسانی
|
|
</el-button>
|
|
</div>
|
|
</div>
|
|
|
|
<!----------------------- modal ----------------------->
|
|
<el-dialog
|
|
title="افزودن اطلاعات نمایندگی"
|
|
:visible.sync="showRepresentationsModal"
|
|
width="30%"
|
|
:before-close="closeRepresentationModal"
|
|
append-to-body
|
|
>
|
|
<form class="form form_3">
|
|
<div class="formRow">
|
|
<label for="">نشان تجاری</label>
|
|
<input v-model="newRepresentationData.trademark" type="text" />
|
|
</div>
|
|
<div class="formRow">
|
|
<label for="">نام شرکت</label>
|
|
<input v-model="newRepresentationData.company_name" type="text" />
|
|
</div>
|
|
<div class="formRow">
|
|
<label for="">سابقه همکاری (سال)</label>
|
|
<input v-model="newRepresentationData.cooperation_history" type="text" />
|
|
</div>
|
|
<div class="formRow">
|
|
<label for="">سال شروع همکاری</label>
|
|
<input v-model="newRepresentationData.cooperation_start_year" type="text" />
|
|
</div>
|
|
</form>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="showRepresentationsModal = false">لغو</el-button>
|
|
<el-button type="primary" @click="addToRepresentations">افزودن</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'EnrollRepresentationForm',
|
|
props: {
|
|
data: {
|
|
type: Object,
|
|
required: false,
|
|
default: null
|
|
},
|
|
isAdmin: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
newFormData: this.initForm(),
|
|
showRepresentationsModal: false,
|
|
newRepresentationData: {
|
|
trademark: '',
|
|
company_name: '',
|
|
cooperation_history: '',
|
|
cooperation_start_year: ''
|
|
},
|
|
globalPlaceholder: '. . .',
|
|
disabledFieldTitle: 'نمیتوانید این فیلد را تغییر دهید',
|
|
validation: {},
|
|
waiting: false
|
|
}
|
|
},
|
|
head() {
|
|
return {
|
|
title: 'آسان سرویس | ثبت درخواست نمایندگی'
|
|
}
|
|
},
|
|
computed: {
|
|
formData() {
|
|
return this.data || this.newFormData
|
|
},
|
|
user() {
|
|
return this.$auth.user
|
|
},
|
|
userFullName() {
|
|
return this.user.first_name + ' ' + this.user.last_name
|
|
}
|
|
},
|
|
methods: {
|
|
initForm(){
|
|
const rawForm = {
|
|
representation_type: '',
|
|
// personal info
|
|
// full_name: '',
|
|
birth_date: '',
|
|
id_number: '',
|
|
place_of_issue: '',
|
|
// national_code: '',
|
|
fathers_name: '',
|
|
education_level: '',
|
|
military_status: '',
|
|
certificates: '',
|
|
|
|
// contact info
|
|
store_name: '',
|
|
// province_name: '',
|
|
// city_name: '',
|
|
postal_code: '',
|
|
// mobile_number: '',
|
|
tel_number: '',
|
|
fax_number: '',
|
|
economic_code: '',
|
|
email: '',
|
|
address: '',
|
|
|
|
// location info
|
|
business_license: '',
|
|
ownership_type: '',
|
|
total_area: '',
|
|
repair_area: '',
|
|
stock_area: '',
|
|
customer_reference_floor: '',
|
|
place_location: '',
|
|
geo_location: '',
|
|
banner_info: '',
|
|
repair_technicians: '',
|
|
repair_masters: '',
|
|
office_workers: '',
|
|
bike_deliveries: '',
|
|
|
|
// experience info
|
|
computer_repair_exp: '',
|
|
multimedia_repair_exp: '',
|
|
business_exp: '',
|
|
|
|
// common questions
|
|
know_asanServ_from: '',
|
|
introducer_info: '',
|
|
asanServ_products_knowledge: '',
|
|
computer_saling_exp: '',
|
|
computer_saling_description: '',
|
|
other_representations: [],
|
|
more_descriptions: ''
|
|
}
|
|
return rawForm
|
|
},
|
|
removeOtherRepItem(number) {
|
|
this.formData.other_representations = this.formData.other_representations.filter(
|
|
(item, index) => index !== number
|
|
)
|
|
},
|
|
resetNewRepresentationData() {
|
|
this.newRepresentationData = {
|
|
trademark: '',
|
|
company_name: '',
|
|
cooperation_history: '',
|
|
cooperation_start_year: ''
|
|
}
|
|
},
|
|
closeRepresentationModal() {
|
|
this.resetNewRepresentationData()
|
|
this.showRepresentationsModal = false
|
|
},
|
|
addToRepresentations() {
|
|
if (
|
|
this.newRepresentationData.trademark === '' ||
|
|
this.newRepresentationData.company_name === '' ||
|
|
this.newRepresentationData.cooperation_history === '' ||
|
|
this.newRepresentationData.cooperation_start_year === ''
|
|
) {
|
|
return this.$message({
|
|
type: 'warning',
|
|
message: 'تمام فیلد ها رو پر کنید'
|
|
})
|
|
}
|
|
this.formData.other_representations.push(this.newRepresentationData)
|
|
this.resetNewRepresentationData()
|
|
this.showRepresentationsModal = false
|
|
},
|
|
send() {
|
|
if (this.waiting) {
|
|
return this.$message({
|
|
type: 'warning',
|
|
message: 'لطفا منتظر بمانید'
|
|
})
|
|
}
|
|
this.waiting = true
|
|
this.validation = {}
|
|
|
|
const data = this.formData
|
|
data.full_name = this.userFullName
|
|
data.national_code = this.user.national_code
|
|
data.province_name = this.user.province_name
|
|
data.province_id = this.user.province_id
|
|
data.city_name = this.user.city_name
|
|
data.city_id = this.user.city_id
|
|
|
|
|
|
this.$axios
|
|
.post(`/api/user/representation`, data)
|
|
.then(async res => {
|
|
this.waiting = false
|
|
// const titlt = 'ثبت موفق'
|
|
// const message = res.data.message
|
|
// this.$alert(message, titlt, {
|
|
// confirmButtonText: 'بستن'
|
|
// })
|
|
this.formData = this.initForm()
|
|
await this.$auth.fetchUser()
|
|
this.$router.push({
|
|
name: 'enroll-representation-enrollCode',
|
|
params: { enrollCode: this.$auth.user.representation_code }
|
|
})
|
|
})
|
|
.catch(err => {
|
|
this.waiting = false
|
|
if (err.response.status === 422) {
|
|
this.validation = err.response.data.validation
|
|
this.$message({
|
|
type: 'warning',
|
|
message: 'پارامتر ها رو بررسی و دوباره تلاش کنید'
|
|
})
|
|
} else if (err.response.status === 406) {
|
|
const titlt = 'خطا'
|
|
const message = err.response.data.message
|
|
this.$alert(message, titlt, {
|
|
confirmButtonText: 'متوجه شدم'
|
|
})
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: err.response.data.message
|
|
})
|
|
}
|
|
})
|
|
},
|
|
update() {
|
|
if (this.waiting) {
|
|
return this.$message({
|
|
type: 'warning',
|
|
message: 'لطفا منتظر بمانید'
|
|
})
|
|
}
|
|
this.waiting = true
|
|
this.validation = {}
|
|
|
|
const data = this.formData
|
|
if (!this.isAdmin) {
|
|
data.full_name = this.userFullName
|
|
data.national_code = this.user.national_code
|
|
data.province_name = this.user.province_name
|
|
data.province_id = this.user.province_id
|
|
data.city_name = this.user.city_name
|
|
data.city_id = this.user.city_id
|
|
data.mobile_number = this.user.mobile_number
|
|
}
|
|
|
|
const url = this.isAdmin ? `/api/admin/updateAgent/${this.data._id}` : `/api/user/representation/${this.data._id}`
|
|
this.$axios
|
|
.put(url, data)
|
|
.then(async res => {
|
|
this.waiting = false
|
|
this.$message({
|
|
type: 'success',
|
|
message: res.data.message
|
|
})
|
|
if (!this.isAdmin) {
|
|
await this.$auth.fetchUser()
|
|
}
|
|
})
|
|
.catch(err => {
|
|
this.waiting = false
|
|
if (err.response.status === 422) {
|
|
this.validation = err.response.data.validation
|
|
this.$message({
|
|
type: 'warning',
|
|
message: 'پارامتر ها رو بررسی و دوباره تلاش کنید'
|
|
})
|
|
} else if (err.response.status === 406) {
|
|
const titlt = 'خطا'
|
|
const message = err.response.data.message
|
|
this.$alert(message, titlt, {
|
|
confirmButtonText: 'متوجه شدم'
|
|
})
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: err.response.data.message
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|