visaEdit.vue 73 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591
  1. <template>
  2. <div class="visaedit-box">
  3. <div class="visaedit-title">
  4. {{ typeStr }}
  5. </div>
  6. <div class="plate-box">
  7. <div class="small-title">
  8. <span>基础信息</span>
  9. </div>
  10. <div class="foundation-form">
  11. <div class="tips">
  12. 姓名等需要与护照所示一致;曾用姓名包括未婚时称呼、宗教用称呼、工作用称呼、化名
  13. </div>
  14. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  15. @submit.native.prevent>
  16. <div class="foundation-box">
  17. <el-form-item label="姓:" prop="lastName">
  18. <el-input v-model="deleClient.lastName"></el-input>
  19. </el-form-item>
  20. <el-form-item label="名:" prop="firstName">
  21. <el-input v-model="deleClient.firstName"></el-input>
  22. </el-form-item>
  23. <el-form-item label="曾用姓名:" prop="oldName">
  24. <el-input v-model="deleClient.oldName"></el-input>
  25. </el-form-item>
  26. <el-form-item label="拼音:" prop="pinyin">
  27. <el-input v-model="deleClient.pinyin"></el-input>
  28. </el-form-item>
  29. <el-form-item label="移动电话:" prop="phone">
  30. <el-input v-model="deleClient.phone" placeholder="请输入11位手机号"></el-input>
  31. </el-form-item>
  32. <el-form-item label="出生日期:" prop="birthDay">
  33. <el-date-picker v-model="deleClient.birthDay" type="date" placeholder="选择日期">
  34. </el-date-picker>
  35. </el-form-item>
  36. <el-form-item label="婚姻状况:" prop="marriage">
  37. <el-select v-model="deleClient.marriage" filterable placeholder="请选择">
  38. <el-option :key=0 label="未设置" :value=0></el-option>
  39. <el-option :key=1 label="未婚" :value=1></el-option>
  40. <el-option :key=2 label="已婚" :value=2></el-option>
  41. <el-option :key=3 label="离异" :value=3></el-option>
  42. <el-option :key=4 label="丧偶" :value=4></el-option>
  43. </el-select>
  44. </el-form-item>
  45. <el-form-item label="党派宗教:" prop="party">
  46. <el-input v-model="deleClient.party"></el-input>
  47. </el-form-item>
  48. <el-form-item label="国籍:" prop="nationality">
  49. <el-input v-model="deleClient.nationality"></el-input>
  50. </el-form-item>
  51. <el-form-item label="性别" prop="sex">
  52. <el-radio-group v-model="deleClient.sex">
  53. <el-radio :label="0">男</el-radio>
  54. <el-radio :label="1">女</el-radio>
  55. </el-radio-group>
  56. </el-form-item>
  57. <el-form-item label="出生地 城市:" prop="birthCity">
  58. <el-input v-model="deleClient.birthCity"></el-input>
  59. </el-form-item>
  60. <el-form-item label="省份:" prop="birthProvince">
  61. <el-input v-model="deleClient.birthProvince"></el-input>
  62. </el-form-item>
  63. <el-form-item label="最高学历:" prop="highestEducation">
  64. <el-select v-model="deleClient.highestEducation" filterable placeholder="请选择">
  65. <el-option key="高中" label="高中" value="高中"></el-option>
  66. <el-option key="大专" label="大专" value="大专"></el-option>
  67. <el-option key="本科" label="本科" value="本科"></el-option>
  68. <el-option key="研究生" label="研究生" value="研究生"></el-option>
  69. <el-option key="博士" label="博士" value="博士"></el-option>
  70. <el-option key="硕士" label="硕士" value="硕士"></el-option>
  71. </el-select>
  72. </el-form-item>
  73. <el-form-item label="家庭电话:" prop="tel">
  74. <el-input v-model="deleClient.tel" placeholder="(座机)"></el-input>
  75. </el-form-item>
  76. <el-form-item label="电子信箱:" prop="email">
  77. <el-input v-model="deleClient.email"></el-input>
  78. </el-form-item>
  79. <el-form-item label="邮编:" prop="postCodes">
  80. <el-input v-model="deleClient.postCodes"></el-input>
  81. </el-form-item>
  82. <el-form-item label="现居地址" prop="address" style="width: 100%;">
  83. <el-input type="textarea" v-model="deleClient.address" placeholder="现居地址"></el-input>
  84. </el-form-item>
  85. </div>
  86. </el-form>
  87. </div>
  88. </div>
  89. <div class="plate-box">
  90. <div class="small-title">
  91. <span>证件信息</span>
  92. </div>
  93. <el-form v-for="(item, i) in customerCerts" :key="i" :rules="rulesCert" ref="deleClient" @submit.native.prevent>
  94. <div class="foundation-box1">
  95. <el-form-item label="证件类型" prop="sdId">
  96. <el-select v-model="item.sdId" filterable placeholder="请选择" style="width: 164px;">
  97. <el-option v-for="item1 in SetData" :key=item1.id :label=item1.name :value=item1.id></el-option>
  98. </el-select>
  99. </el-form-item>
  100. <el-form-item label="证件号" prop="certNo">
  101. <el-input v-model="item.certNo"></el-input>
  102. </el-form-item>
  103. <el-form-item label="证件签发地" prop="area">
  104. <el-input v-model="item.area" style="width: 120px;"></el-input>
  105. </el-form-item>
  106. <el-form-item label="目的地国家" prop="targetCountry">
  107. <el-input v-model="item.targetCountry" style="width: 120px;">
  108. </el-input>
  109. </el-form-item>
  110. <el-form-item label="证件有效期:" prop="issueDt">
  111. <div>
  112. <el-date-picker v-model="item.issueDt" type="date" placeholder="身份证有效期">
  113. </el-date-picker>
  114. </div>
  115. </el-form-item>
  116. <el-form-item label="至:" prop="expiryDt">
  117. <el-date-picker v-model="item.expiryDt" type="date" placeholder="身份证有效期">
  118. </el-date-picker>
  119. </el-form-item>
  120. <div style="margin-top: 40px;,margin-left: 40px;">
  121. <el-button circle icon="el-icon-minus" @click="subcustomerCertsAdd(i, item.id)"
  122. v-if="i >= 0"></el-button>
  123. </div>
  124. </div>
  125. <hr style='background-color:#5555; height:1px; border:none;' />
  126. </el-form>
  127. <div style="text-align: center;">
  128. <el-button circle icon="el-icon-plus" @click="customerCertsAdd()"></el-button>
  129. </div>
  130. </div>
  131. <div class="plate-box">
  132. <div class="small-title">
  133. <span>现就职单位</span>
  134. </div>
  135. <div class="flats-form">
  136. <el-form :model="customerCompany" :rules="rules" ref="customerCompany" label-width="100px"
  137. class="demo-deleClient" @submit.native.prevent>
  138. <div class="foundation-box">
  139. <div style="width: 100%;padding-left: 50px;color: red;font-size: 12px;">
  140. 若下拉框没有你想选择的公司,请点击+添加
  141. </div>
  142. <el-form-item label="单位名称:" prop="companyName">
  143. <el-select v-model="customerCompany.id" clearable filterable placeholder="请选择公司"
  144. @change="companyChange(customerCompany.id)">
  145. <el-option v-for="item in CompanySelectData" :key="item.id" :label="item.companyName"
  146. :value="item.id">
  147. </el-option>
  148. </el-select>
  149. <el-button circle icon="el-icon-plus" @click="btnAddCom()"></el-button>
  150. </el-form-item>
  151. <el-form-item label="单位地址:" disabled prop="companyAddress">
  152. <el-input v-model="customerCompany.address" :disabled="true"></el-input>
  153. </el-form-item>
  154. <el-form-item label="单位邮编:" prop="companyPostCodes">
  155. <el-input v-model="customerCompany.postCodes" :disabled="true"></el-input>
  156. </el-form-item>
  157. </div>
  158. </el-form>
  159. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  160. @submit.native.prevent>
  161. <div class="foundation-box">
  162. <el-form-item label="职务:" prop="job">
  163. <el-input v-model="deleClient.job"></el-input>
  164. </el-form-item>
  165. <el-form-item label="入职时间" prop="workDate">
  166. <el-date-picker v-model="deleClient.workDate" type="date" placeholder="(注明年月日)">
  167. </el-date-picker>
  168. </el-form-item>
  169. <el-form-item label="月薪" prop="wage">
  170. <el-input v-model="deleClient.wage" placeholder="(人民币)"></el-input>
  171. </el-form-item>
  172. <el-form-item label="单位电话:" prop="clientPhone">
  173. <el-input v-model="deleClient.clientPhone"></el-input>
  174. </el-form-item>
  175. <el-form-item label="单位传真:" prop="clientFax">
  176. <el-input v-model="deleClient.clientFax"></el-input>
  177. </el-form-item>
  178. <el-form-item label="单位邮箱:" prop="clientEmail">
  179. <el-input v-model="deleClient.clientEmail"></el-input>
  180. </el-form-item>
  181. <el-form-item label="单位主管:" prop="clientLeader">
  182. <el-input v-model="deleClient.clientLeader" placeholder="姓名:(除本人以外)"></el-input>
  183. </el-form-item>
  184. <el-form-item label="主管职务:" prop="clientLeaderJob">
  185. <el-input v-model="deleClient.clientLeaderJob" placeholder="单位主管职务"></el-input>
  186. </el-form-item>
  187. <el-form-item label="工作内容" prop="workState" style="width: 100%;">
  188. <el-input type="textarea" v-model="deleClient.workState"
  189. placeholder="工作内容简单介绍(美加签证必填)"></el-input>
  190. </el-form-item>
  191. </div>
  192. </el-form>
  193. </div>
  194. </div>
  195. <div class="plate-box">
  196. <div class="small-title">
  197. <span>配偶信息</span>
  198. </div>
  199. <div class="flats-form">
  200. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  201. @submit.native.prevent>
  202. <div class="foundation-box">
  203. <el-form-item label="结婚时间:" prop="weddingDate">
  204. <el-date-picker v-model="deleClient.weddingDate" type="date" placeholder="请注明结婚时间">
  205. </el-date-picker>
  206. </el-form-item>
  207. <el-form-item label="离婚时间:" prop="divorceDate">
  208. <el-date-picker v-model="deleClient.divorceDate" type="date" placeholder="如离婚,请注明离婚时间">
  209. </el-date-picker>
  210. </el-form-item>
  211. <el-form-item label="配偶姓名:" prop="mateName">
  212. <el-input v-model="deleClient.mateName" placeholder="客户配偶姓名(若离异或分居或去世也应填写此项)"></el-input>
  213. </el-form-item>
  214. <el-form-item label="出生日期:" prop="mateBirthDay">
  215. <el-date-picker v-model="deleClient.mateBirthDay" type="date">
  216. </el-date-picker>
  217. </el-form-item>
  218. <el-form-item label="出生城市" prop="mateBirthCity">
  219. <el-input v-model="deleClient.mateBirthCity"></el-input>
  220. </el-form-item>
  221. <el-form-item label="省份" prop="mateBirthCountry">
  222. <el-input v-model="deleClient.mateBirthCountry"></el-input>
  223. </el-form-item>
  224. <el-form-item label="配偶住址:" prop="mateAddress">
  225. <el-input v-model="deleClient.mateAddress"
  226. placeholder="客户配偶住址(如果与客户不一样,须提供其配偶的地址,国家-省-市-街道-单元-门牌号)"></el-input>
  227. </el-form-item>
  228. <el-form-item label="工作单位:" prop="mateClient">
  229. <el-input v-model="deleClient.mateClient" placeholder="客户配偶工作单位名称"></el-input>
  230. </el-form-item>
  231. <el-form-item label="单位地址:" prop="mateClientAddress">
  232. <el-input v-model="deleClient.mateClientAddress" placeholder="客户配偶工作单位地址"></el-input>
  233. </el-form-item>
  234. <el-form-item label="职务:" prop="mateJob">
  235. <el-input v-model="deleClient.mateJob" placeholder="客户配偶工作单位职务"></el-input>
  236. </el-form-item>
  237. </div>
  238. </el-form>
  239. </div>
  240. </div>
  241. <div class="plate-box">
  242. <div class="small-title">
  243. <span>家庭成员信息</span>
  244. </div>
  245. <el-form v-for="(item, index) in customerFamily" :key="index">
  246. <div class="foundation-box1">
  247. <el-form-item label="称谓:" prop="appellation">
  248. <el-select v-model="item.appellation" filterable placeholder="请选择">
  249. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
  250. </el-option>
  251. </el-select>
  252. </el-form-item>
  253. <el-form-item label="姓名:" prop="name">
  254. <el-input v-model="item.name" clearable></el-input>
  255. </el-form-item>
  256. <el-form-item label="出生日期:" prop="FamilybirthDay">
  257. <el-date-picker v-model="item.birthDay" type="date">
  258. </el-date-picker>
  259. </el-form-item>
  260. <el-form-item label="出生地:" prop="birthPlace">
  261. <el-input v-model="item.birthPlace" clearable></el-input>
  262. </el-form-item>
  263. <el-form-item label="政治面貌:" prop="politics">
  264. <el-input v-model="item.politics" clearable></el-input>
  265. </el-form-item>
  266. <el-form-item label="是否生活在美国:" prop="isUSA">
  267. <el-radio-group v-model="item.isUSA">
  268. <el-radio :label=1>是</el-radio>
  269. <el-radio :label=0>否</el-radio>
  270. </el-radio-group>
  271. </el-form-item>
  272. <el-form-item label="工作单位:" prop="client">
  273. <el-input v-model="item.client" clearable style="width: 400px;"></el-input>
  274. </el-form-item>
  275. <el-form-item label="家庭住址:" prop="address">
  276. <el-input v-model="item.address" clearable style="width: 400px;"></el-input>
  277. </el-form-item>
  278. <el-form-item label="是否欧盟公民:" prop="isEu">
  279. <el-radio-group v-model="item.isEu">
  280. <el-radio :label=1>是</el-radio>
  281. <el-radio :label=0>否</el-radio>
  282. </el-radio-group>
  283. </el-form-item>
  284. </div>
  285. 若家庭成员是欧盟、欧洲经济区或瑞士公民,请填写下方信息:
  286. <div class="foundation-box1">
  287. <div style="width: 32%;display: flex;">
  288. <el-form-item label="成员国籍:" prop="nationality">
  289. <el-input v-model="item.nationality"></el-input>
  290. </el-form-item>
  291. <el-form-item label="证件号码" prop="idCard">
  292. <el-input v-model="item.idCard" placeholder="旅行证件编号或身份证号码"></el-input>
  293. </el-form-item>
  294. </div>
  295. <div>
  296. <div class="textClass">
  297. 客户与该欧盟、欧洲经济区或瑞士公民亲属关系
  298. </div>
  299. <el-form-item prop="reletionship">
  300. <el-radio-group v-model="item.reletionship">
  301. <el-radio label="配偶"></el-radio>
  302. <el-radio label="子女"></el-radio>
  303. <el-radio label="孙女儿"></el-radio>
  304. <el-radio label="赡养的老人"></el-radio>
  305. </el-radio-group>
  306. </el-form-item>
  307. </div>
  308. <div style="line-height: 70px;margin-left: 15%;">
  309. <el-button circle icon="el-icon-minus" @click="subcustomerFamilyAdd(index, item.id)"
  310. v-if="index >= 0"></el-button>
  311. </div>
  312. </div>
  313. <hr style='background-color:#5555; height:1px; border:none;' />
  314. </el-form>
  315. <div style="text-align: center;">
  316. <el-button circle icon="el-icon-plus" @click="customerFamilyAdd()"></el-button>
  317. </div>
  318. </div>
  319. <div class="plate-box">
  320. <div class="small-title">
  321. <span>其他信息</span>
  322. </div>
  323. <div class="flats-form">
  324. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  325. @submit.native.prevent>
  326. <div class="foundation-box">
  327. <el-form-item label="出访的国家" prop="visitCountry" style="width: 100%;">
  328. <el-input type="textarea" v-model="deleClient.visitCountry"
  329. placeholder="过去五年因公出访的国家(XX年XX月出访XX国):"></el-input>
  330. </el-form-item>
  331. <el-form-item label="发表文件" prop="paper" style="width: 100%;">
  332. <el-input type="textarea" v-model="deleClient.paper"
  333. placeholder="是否发表过期刊、论文(日期、题目、期刊名字):"></el-input>
  334. </el-form-item>
  335. <el-form-item label="拥有专利" prop="papent" style="width: 100%;">
  336. <el-input type="textarea" v-model="deleClient.papent"
  337. placeholder="是否拥有任何专利(日期、名字、专利号):"></el-input>
  338. </el-form-item>
  339. <el-form-item label="博士论文" prop="phD" style="width: 100%;">
  340. <el-input type="textarea" v-model="deleClient.phD"
  341. placeholder="是否发表过博士论文(日期、题目、指导老师、研究领域):"></el-input>
  342. </el-form-item>
  343. <el-form-item label-width="220px" label="是否因公去过美国/加拿大?" prop="isVisitUC" style="width: 100%;">
  344. <el-radio-group v-model="deleClient.isVisitUC">
  345. <el-radio :label=1>是</el-radio>
  346. <el-radio :label=0>否</el-radio>
  347. </el-radio-group>
  348. <span>(请列出最近1次出访信息,不记得具体日期,请提供尽量靠近的日期)</span>
  349. </el-form-item>
  350. <el-form-item label="美国:" prop="usaDate">
  351. <el-date-picker v-model="deleClient.usaDate" placeholder="抵达日期" type="date">
  352. </el-date-picker>
  353. </el-form-item>
  354. <el-form-item label="天数:" prop="usaDays">
  355. <el-input v-model="deleClient.usaDays" placeholder="停留天数"></el-input>
  356. </el-form-item>
  357. <el-form-item label="加拿大:" prop="canDate">
  358. <el-date-picker v-model="deleClient.canDate" placeholder="抵达日期" type="date">
  359. </el-date-picker>
  360. </el-form-item>
  361. <el-form-item label="天数:" prop="canDays">
  362. <el-input v-model="deleClient.canDays" placeholder="停留天数"></el-input>
  363. </el-form-item>
  364. <el-form-item label-width="220px" label="是否有获批的申根签证 ?" prop="isGetSchengen" style="width: 100%;">
  365. <el-radio-group v-model="deleClient.isGetSchengen">
  366. <el-radio :label=1>是</el-radio>
  367. <el-radio :label=0>否</el-radio>
  368. </el-radio-group>
  369. </el-form-item>
  370. <el-form-item label-width="220px" label="申根是否在使馆有指纹记录?" prop="isFinger" style="width: 100%;">
  371. <el-radio-group v-model="deleClient.isFinger">
  372. <el-radio :label=1>是</el-radio>
  373. <el-radio :label=0>否</el-radio>
  374. </el-radio-group>
  375. </el-form-item>
  376. <el-form-item label="申根有效期起:" prop="startTime">
  377. <el-date-picker v-model="deleClient.startTime" type="date">
  378. </el-date-picker>
  379. </el-form-item>
  380. <el-form-item label="申根有效期止:" prop="endTime">
  381. <el-date-picker v-model="deleClient.endTime" type="date">
  382. </el-date-picker>
  383. </el-form-item>
  384. <el-form-item label="申根指纹录入:" prop="fingerDate">
  385. <el-date-picker v-model="deleClient.fingerDate" type="date" placeholder="选择日期">
  386. </el-date-picker>
  387. </el-form-item>
  388. <el-form-item label-width="220px" label="是否曾获得过因公美国签证?" prop="isUSAVia" style="width: 100%;">
  389. <el-radio-group v-model="deleClient.isUSAVia">
  390. <el-radio :label=1>是</el-radio>
  391. <el-radio :label=0>否</el-radio>
  392. </el-radio-group>
  393. </el-form-item>
  394. <el-form-item label="获得日期:" prop="getUSAVisaDate">
  395. <el-date-picker v-model="deleClient.getUSAVisaDate" type="date">
  396. </el-date-picker>
  397. </el-form-item>
  398. <el-form-item label="地点:" prop="getUPPlace">
  399. <el-input v-model="deleClient.getUPPlace"></el-input>
  400. </el-form-item>
  401. <el-form-item label="签证种类:" prop="USAVisaCate">
  402. <el-select v-model="deleClient.USAVisaCate" filterable placeholder="请选择">
  403. <el-option key="外交签证" label="外交签证" value="外交签证">
  404. </el-option>
  405. <el-option key="公务签证" label="公务签证" value="公务签证">
  406. </el-option>
  407. <el-option key="普通签证" label="普通签证" value="普通签证">
  408. </el-option>
  409. </el-select>
  410. </el-form-item>
  411. <el-form-item label="签证编码:" prop="usaVisaCate">
  412. <el-input v-model="deleClient.usaVisaCate"></el-input>
  413. </el-form-item>
  414. <el-form-item label-width="220px" label="是否在使馆留过十指的指纹?" prop="usaFinger" style="width: 100%;">
  415. <el-radio-group v-model="deleClient.usaFinger">
  416. <el-radio :label=1>是</el-radio>
  417. <el-radio :label=0>否</el-radio>
  418. </el-radio-group>
  419. </el-form-item>
  420. <el-form-item label-width="430px" label="是否曾经被拒签或被拒绝入境美国或在入境时被撤回入境申请?" prop="isRejected"
  421. style="width: 100%;">
  422. <el-radio-group v-model="deleClient.isRejected">
  423. <el-radio :label=1>是</el-radio>
  424. <el-radio :label=0>否</el-radio>
  425. </el-radio-group>
  426. </el-form-item>
  427. <el-form-item label="何时:" prop="rejectedDate">
  428. <el-date-picker v-model="deleClient.rejectedDate" type="date">
  429. </el-date-picker>
  430. </el-form-item>
  431. <el-form-item label="何地:" prop="rejectedPlace">
  432. <el-input v-model="deleClient.rejectedPlace"></el-input>
  433. </el-form-item>
  434. <el-form-item label="签证种类:" prop="rejectedVisa">
  435. <el-select v-model="deleClient.rejectedVisa" filterable placeholder="请选择">
  436. <el-option key="外交签证" label="外交签证" value="外交签证">
  437. </el-option>
  438. <el-option key="公务签证" label="公务签证" value="公务签证">
  439. </el-option>
  440. <el-option key="普通签证" label="普通签证" value="普通签证">
  441. </el-option>
  442. </el-select>
  443. </el-form-item>
  444. <el-form-item label-width="220px" label="美国签证是否被吊销过?" prop="isRevoke" style="width: 100%;">
  445. <el-radio-group v-model="deleClient.isRevoke">
  446. <el-radio :label=1>是</el-radio>
  447. <el-radio :label=0>否</el-radio>
  448. </el-radio-group>
  449. </el-form-item>
  450. <el-form-item label-width="220px" label="护照是否曾经丢失或被盗?" prop="isLose" style="width: 100%;">
  451. <el-radio-group v-model="deleClient.isLose">
  452. <el-radio :label=1>是</el-radio>
  453. <el-radio :label=0>否</el-radio>
  454. </el-radio-group>
  455. </el-form-item>
  456. <el-form-item label="何时:" prop="loseDate">
  457. <el-date-picker v-model="deleClient.loseDate" type="date">
  458. </el-date-picker>
  459. </el-form-item>
  460. <el-form-item label="护照编码:" prop="loseCode">
  461. <el-input v-model="deleClient.loseCode"></el-input>
  462. </el-form-item>
  463. <el-form-item label="是否有美国签证" prop="isUSAVisa">
  464. <el-radio-group v-model="deleClient.isUSAVisa">
  465. <el-radio :label=1>是</el-radio>
  466. <el-radio :label=0>否</el-radio>
  467. </el-radio-group>
  468. </el-form-item>
  469. </div>
  470. </el-form>
  471. </div>
  472. <hr style='background-color:#5555; height:1px; border:none;' />
  473. <div class="tips">
  474. 下列亲属中是否有人已在美国?他们是否是合法永久居民或公民?
  475. </div>
  476. <div class="flats-form">
  477. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  478. @submit.native.prevent>
  479. <div class="citizens-box">
  480. <div class="citizens-li">
  481. <el-form-item label-width="76px" label="夫/妻" prop="mateUSA">
  482. <el-radio-group v-model="deleClient.mateUSA">
  483. <el-radio :label=0>不在美国</el-radio>
  484. <el-radio :label=1>在美国</el-radio>
  485. </el-radio-group>
  486. </el-form-item>
  487. <el-form-item label="身份:" prop="mateIden">
  488. <el-input v-model="deleClient.mateIden"></el-input>
  489. </el-form-item>
  490. </div>
  491. <div class="citizens-li">
  492. <el-form-item label-width="136px" label="未婚夫/未婚妻" prop="whusa">
  493. <el-radio-group v-model="deleClient.whusa">
  494. <el-radio :label=0>不在美国</el-radio>
  495. <el-radio :label=1>在美国</el-radio>
  496. </el-radio-group>
  497. </el-form-item>
  498. <el-form-item label="身份:" prop="whIden">
  499. <el-input v-model="deleClient.whIden"></el-input>
  500. </el-form-item>
  501. </div>
  502. <div class="citizens-li">
  503. <el-form-item label-width="76px" label="父/母" prop="parentUSA">
  504. <el-radio-group v-model="deleClient.parentUSA">
  505. <el-radio :label=0>不在美国</el-radio>
  506. <el-radio :label=1>在美国</el-radio>
  507. </el-radio-group>
  508. </el-form-item>
  509. <el-form-item label="身份:" prop="parentIden">
  510. <el-input v-model="deleClient.parentIden"></el-input>
  511. </el-form-item>
  512. </div>
  513. <div class="citizens-li">
  514. <el-form-item label-width="106px" label="兄弟/姐妹" prop="broUSA">
  515. <el-radio-group v-model="deleClient.broUSA">
  516. <el-radio :label=0>不在美国</el-radio>
  517. <el-radio :label=1>在美国</el-radio>
  518. </el-radio-group>
  519. </el-form-item>
  520. <el-form-item label="身份:" prop="broIden">
  521. <el-input v-model="deleClient.broIden"></el-input>
  522. </el-form-item>
  523. </div>
  524. <div class="citizens-li">
  525. <el-form-item label-width="106px" label="儿子/女儿" prop="childUSA">
  526. <el-radio-group v-model="deleClient.childUSA">
  527. <el-radio :label=0>不在美国</el-radio>
  528. <el-radio :label=1>在美国</el-radio>
  529. </el-radio-group>
  530. </el-form-item>
  531. <el-form-item label="身份:" prop="childIden">
  532. <el-input v-model="deleClient.childIden"></el-input>
  533. </el-form-item>
  534. </div>
  535. <el-form-item label="慈善机构" prop="social" style="width: 100%;">
  536. <el-input type="textarea" v-model="deleClient.social"
  537. placeholder="列出所有现在和曾经所属/捐助/工作过的职业协会、社会团体和慈善机构(没有请写“无”):/捐助/工作过的职业协会、社会团体和慈善机构(没有请写“无”)"></el-input>
  538. </el-form-item>
  539. <el-form-item label-width="140px" label="是否曾经参军?" prop="isArmy">
  540. <el-radio-group v-model="deleClient.isArmy">
  541. <el-radio :label=1>是</el-radio>
  542. <el-radio :label=0>否</el-radio>
  543. </el-radio-group>
  544. </el-form-item>
  545. <el-form-item label="军事信息" prop="armyState" style="width: 100%;">
  546. <el-input type="textarea" v-model="deleClient.armyState"
  547. placeholder="如果是,请列出所服役的国家、军种、军衔、军事特长以及服役期限(X年X月X日)"></el-input>
  548. </el-form-item>
  549. </div>
  550. </el-form>
  551. </div>
  552. <hr style='background-color:#5555; height:1px; border:none;' />
  553. <div class="plate-box">
  554. <div class="small-title">
  555. <span>工作经历</span>
  556. </div>
  557. <div class="tips">
  558. <span>请列出过去10年的工作经历(请填写现任公司之前的工作经历,如果没有请写“无”):</span>
  559. </div>
  560. <div>
  561. <el-form v-for="(item, w) in workExperience" :key="w" @submit.native.prevent>
  562. <div class="foundation-box1">
  563. <el-form-item label="公司名称:" prop="company">
  564. <el-input v-model="item.company" clearable style="width: 200px;"></el-input>
  565. </el-form-item>
  566. <el-form-item label="电话:" prop="phone">
  567. <el-input v-model="item.phone" clearable style="width: 150px;"></el-input>
  568. </el-form-item>
  569. <el-form-item label="职务:" prop="job">
  570. <el-input v-model="item.job" clearable style="width: 150px;"></el-input>
  571. </el-form-item>
  572. <el-form-item label="主管名字:" prop="leaderName">
  573. <el-input v-model="item.leaderName" clearable style="width: 150px;"></el-input>
  574. </el-form-item>
  575. <el-form-item label="起始日期:" prop="workStart">
  576. <el-date-picker v-model="item.workStart" type="date">
  577. </el-date-picker>
  578. </el-form-item>
  579. <el-form-item label="结束日期:" prop="workEnd">
  580. <el-date-picker v-model="item.workEnd" type="date">
  581. </el-date-picker>
  582. </el-form-item>
  583. </div>
  584. <div class="foundation-box1">
  585. <el-form-item label="公司地址:" prop="companyAddress">
  586. <el-input type="textarea" :rows="3" placeholder="请输入内容" style="width: 500px;"
  587. v-model="item.companyAddress"></el-input>
  588. </el-form-item>
  589. <el-form-item label="工作职责及内容简述:" prop="workState">
  590. <el-input type="textarea" :rows="3" placeholder="请输入内容" style="width: 500px;"
  591. v-model="item.workState"></el-input>
  592. </el-form-item>
  593. <el-form-item style="margin-top: 5%;margin-left: 10%;">
  594. <el-button circle icon="el-icon-minus" @click="subworkExperience(w, item.id)"
  595. v-if="w >= 0"></el-button>
  596. </el-form-item>
  597. </div>
  598. <hr style='background-color:#5555; height:1px; border:none;' />
  599. </el-form>
  600. <div style="text-align: center;">
  601. <el-button circle icon="el-icon-plus" @click="workExperienceadd()"></el-button>
  602. </div>
  603. </div>
  604. </div>
  605. </div>
  606. <div class="plate-box">
  607. <div class="small-title">
  608. <span>学历信息</span>
  609. </div>
  610. <hr style='background-color:#5555; height:1px; border:none;' />
  611. <div class="tips">
  612. <span>列出除小学以外的所有教育经历:从高中开始填写</span>
  613. </div>
  614. <div>
  615. <el-form v-for="(item, e) in customerSchool" :key="e" @submit.native.prevent>
  616. <div class="foundation-box1">
  617. <el-form-item label="学校名称和学历:" prop="school">
  618. <el-input v-model="item.school" clearable></el-input>
  619. </el-form-item>
  620. <el-form-item label="学校地址:" prop="address">
  621. <el-input v-model="item.address" clearable></el-input>
  622. </el-form-item>
  623. <el-form-item label="指导老师:" prop="teacher">
  624. <el-input v-model="item.teacher" clearable style="width: 150px;"></el-input>
  625. </el-form-item>
  626. <el-form-item label="课程或专业:" prop="subject">
  627. <el-input v-model="item.subject" clearable></el-input>
  628. </el-form-item>
  629. <el-form-item label="起始日期:" prop="studyStart">
  630. <el-date-picker v-model="item.studyStart" type="date" style="width: 150px;">
  631. </el-date-picker>
  632. </el-form-item>
  633. <el-form-item label="结束日期:" prop="studyEnd">
  634. <el-date-picker v-model="item.studyEnd" type="date" style="width: 150px;">
  635. </el-date-picker>
  636. </el-form-item>
  637. <el-form-item style="margin-top: 3%;margin-left: 5px;">
  638. <el-button circle icon="el-icon-minus" @click="subcustomerSchool(e, item.id)"
  639. v-if="e >= 0"></el-button>
  640. </el-form-item>
  641. </div>
  642. <hr style='background-color:#5555; height:1px; border:none;' />
  643. </el-form>
  644. <div style="text-align: center;">
  645. <el-button circle icon="el-icon-plus" @click="addcustomerSchool()"></el-button>
  646. </div>
  647. </div>
  648. </div>
  649. <div class="plate-box">
  650. <div class="small-title">
  651. <span>提交信息</span>
  652. </div>
  653. <el-form :model="deleClient" :rules="rules" ref="deleClient" label-width="100px" class="demo-deleClient"
  654. @submit.native.prevent>
  655. <div class="foundation-box">
  656. <el-form-item label="费用承担者:" prop="costBearers">
  657. <el-input v-model="deleClient.costBearers" placeholder="在外费用承担者"></el-input>
  658. </el-form-item>
  659. <el-form-item label="经办人:" prop="tableOpName">
  660. <el-input v-model="deleClient.tableOpName" placeholder="填表经办人"></el-input>
  661. </el-form-item>
  662. <el-form-item label="联系电话:" prop="tableOpTel">
  663. <el-input v-model="deleClient.tableOpTel" placeholder="填表经办人联系电话"></el-input>
  664. </el-form-item>
  665. <el-form-item label="填表日期:" prop="tableDate">
  666. <el-date-picker v-model="deleClient.tableDate" type="date" placeholder="选择日期">
  667. </el-date-picker>
  668. </el-form-item>
  669. </div>
  670. </el-form>
  671. </div>
  672. <div>
  673. <el-button type="primary" @click="submitForm">确定</el-button>
  674. <router-link to="/home/DeleClient">
  675. <el-button type="primary" style="margin-left: 10px;">取消</el-button>
  676. </router-link>
  677. </div>
  678. <el-dialog title="添加客户公司信息" :visible.sync="TypeVisible" width="30%" :before-close="handleClose"
  679. :close-on-click-modal="false">
  680. <div>
  681. <el-form :model="OperationData" :rules="rulesCompany" ref="OperationData" label-width="100px"
  682. class="demo-ruleForm">
  683. <el-form-item label="公司名称" prop="companyName">
  684. <el-input placeholder="请输入内容" v-model="OperationData.companyName">
  685. </el-input>
  686. </el-form-item>
  687. <el-form-item label="公司地址" prop="address">
  688. <el-input placeholder="请输入内容" v-model="OperationData.address">
  689. </el-input>
  690. </el-form-item>
  691. <el-form-item label="公司编码" prop="postCodes">
  692. <el-input placeholder="请输入内容" v-model="OperationData.postCodes">
  693. </el-input>
  694. </el-form-item>
  695. <el-form-item label="备 注" prop="remark">
  696. <el-input type="textarea" :rows="3" placeholder="请输入内容" v-model="OperationData.remark"></el-input>
  697. </el-form-item>
  698. </el-form>
  699. </div>
  700. <span slot="footer" class="dialog-footer">
  701. <el-button @click="TypeVisible = false">取 消</el-button>
  702. <el-button type="primary" @click="AddBtn">确 定</el-button>
  703. </span>
  704. </el-dialog>
  705. </div>
  706. </template>
  707. <script>
  708. export default {
  709. data() {
  710. return {
  711. rules: {
  712. lastName: [
  713. { required: true, message: '请输入姓', trigger: 'change' },
  714. { required: true, message: '请输入姓', trigger: 'blur' },
  715. { min: 1, max: 3, message: '长度在 1 到 3 个字符', trigger: 'change' }
  716. ],
  717. firstName: [
  718. { required: true, message: '请输入名', trigger: 'change' },
  719. { required: true, message: '请输入名', trigger: 'blur' },
  720. { min: 1, max: 3, message: '长度在 1 到 3 个字符', trigger: 'change' }
  721. ],
  722. pinyin: [
  723. { required: true, message: '请输入英文名或拼音', trigger: 'blur' },
  724. ],
  725. oldName: [{ required: true, message: '请输入曾用名,没有则填写无', trigger: 'blur' },],
  726. phone: [
  727. { required: true, message: '请输入移动电话', trigger: 'change' },
  728. {
  729. pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
  730. message: "请输入正确的手机号码",
  731. trigger: "change"
  732. }
  733. ],
  734. birthDay: [{ required: true, message: '请选择出生日期', trigger: 'blur', },],
  735. party: [{ required: true, message: '请输入党派宗教', trigger: 'blur', },],
  736. sex: [{ required: true, message: '请选择性别', trigger: 'blur', },],
  737. marriage: [{ required: true, message: '请选择婚姻状态', trigger: 'blur', }],
  738. nationality: [{ required: true, message: '请输入国籍', trigger: 'blur' },],
  739. birthCity: [{ required: true, message: '请输入出生城市', trigger: 'blur' }],
  740. birthProvince: [{ required: true, message: '请输入出生省份', trigger: 'blur' }],
  741. highestEducation: [{ required: true, message: '请输入最高学历', trigger: 'blur' }],
  742. tel: [
  743. { required: true, message: '请输入固话', trigger: 'change' },
  744. {
  745. pattern: /0\d{2,3}-\d{7,8}/,
  746. message: "请输入正确固话",
  747. trigger: "change"
  748. }
  749. ],
  750. email: [
  751. { required: true, message: '请输入邮箱', trigger: 'change' },
  752. {
  753. pattern: /^([a-zA-Z0-9]+[-_\.]?)+@[a-zA-Z0-9]+\.[a-z]+$/,
  754. message: "请输入正确的邮箱",
  755. trigger: "change"
  756. }
  757. ],
  758. postCodes: [
  759. { required: true, message: '请输入邮箱', trigger: 'change' },
  760. {
  761. pattern: /^[0-9]{6}$/,
  762. message: "请输入正确的邮政编码",
  763. trigger: "change"
  764. }
  765. ],
  766. address: [{ required: true, message: '请输入现居住地址', trigger: 'blur' }],
  767. costBearers: [{ required: true, message: '请输入费用承担着', trigger: 'blur' }],
  768. tableOpName: [{ required: true, message: '请输入经办人', trigger: 'blur' }],
  769. tableOpTel: [
  770. { required: true, message: '请输入经办人联系方式', trigger: 'change' },
  771. {
  772. pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
  773. message: "请输入正确的手机号码",
  774. trigger: "change"
  775. }
  776. ],
  777. tableDate: [{ required: true, message: '请输入填表时间', trigger: 'blur' }],
  778. //证件验证
  779. },
  780. rulesCert: {
  781. certNo: [{ required: true, message: '请输入费用承担着', trigger: 'change' }],
  782. },
  783. rulesCompany: {
  784. companyName: [
  785. { required: true, message: '请输入客户公司名称', trigger: 'blur' },
  786. ],
  787. address: [
  788. { required: true, message: '请输入客户公司地址', trigger: 'blur' },
  789. ],
  790. postCodes: [
  791. { required: true, message: '请输入客户公司邮编', trigger: 'blur' },
  792. ],
  793. },
  794. Id: 0,
  795. token: '',
  796. userId: 0,
  797. Status: 0,
  798. typeStr: '',
  799. DiId: '',
  800. TypeVisible: false,
  801. OperationData: {
  802. status: 0,
  803. id: 0,
  804. companyName: "",
  805. address: "",
  806. postCodes: "",
  807. lastedOpUserId: 0,
  808. createUserId: 0,
  809. remark: ""
  810. },
  811. //基础信息
  812. deleClient: {
  813. id: 0,
  814. diId: 0,
  815. lastName: '',
  816. firstName: '',
  817. oldName: '',
  818. pinyin: '',
  819. sex: 0,
  820. marriage: 0,
  821. phone: '',
  822. birthProvince: '',
  823. birthCity: '',
  824. birthDay: this.dateFormat(new Date()),
  825. airType: '',
  826. seatPref: 0,
  827. airRemark: '',
  828. roomType: '',
  829. roomPref: '',
  830. tel: '',
  831. email: '',
  832. address: '',
  833. highestEducation: '',
  834. postCodes: '',
  835. crmCompanyId: '',
  836. job: '',
  837. workState: '',
  838. workDate: this.dateFormat(new Date()),
  839. wage: '',
  840. clientPhone: '',
  841. clientFax: '',
  842. clientEmail: '',
  843. clientLeader: '',
  844. clientLeaderJob: '',
  845. isGetSchengen: 0,
  846. startTime: this.dateFormat(new Date()),
  847. endTime: this.dateFormat(new Date()),
  848. isFinger: 0,
  849. fingerDate: this.dateFormat(new Date()),
  850. isVisitUC: 0,
  851. usaDate: this.dateFormat(new Date()),
  852. usaDays: 0,
  853. canDate: this.dateFormat(new Date()),
  854. canDays: 0,
  855. isUSAVia: 0,
  856. getUSAVisaDate: this.dateFormat(new Date()),
  857. getUPPlace: '',
  858. usaVisaCate: '',
  859. usaVisaCode: '',
  860. usaFinger: 0,
  861. isRejected: 0,
  862. rejectedDate: this.dateFormat(new Date()),
  863. rejectedPlace: '',
  864. rejectedVisa: '',
  865. isRevoke: 0,
  866. isLose: 0,
  867. loseDate: this.dateFormat(new Date()),
  868. loseCode: '',
  869. isUSAVisa: 0,
  870. mateUSA: 0,
  871. mateIden: '',
  872. whusa: 0,
  873. whIden: '',
  874. parentUSA: 0,
  875. parentIden: '',
  876. childUSA: 0,
  877. childIden: '',
  878. broUSA: 0,
  879. broIden: '',
  880. social: '',
  881. isArmy: 0,
  882. armyState: '',
  883. costBearers: '',
  884. tableOpName: '',
  885. tableOpTel: '',
  886. tableDate: this.dateFormat(new Date()),
  887. party: '',
  888. nationality: '',
  889. weddingDate: this.dateFormat(new Date()),
  890. divorceDate: this.dateFormat(new Date()),
  891. mateName: '',
  892. mateBirthDay: this.dateFormat(new Date()),
  893. mateBirthCity: '',
  894. mateBirthCountry: '',
  895. mateAddress: '',
  896. mateClient: '',
  897. mateClientAddress: '',
  898. mateJob: '',
  899. visitCountry: '',
  900. paper: '',
  901. papent: '',
  902. phD: '',
  903. createUserId: this.userId,
  904. remark: '',
  905. },
  906. //证件信息
  907. customerCerts:
  908. [
  909. {
  910. id: 0,
  911. dcId: 0,
  912. sdId: '',
  913. certNo: '',
  914. country: '',
  915. area: '',
  916. targetCountry: '',
  917. issueDt: this.dateFormat(new Date()),
  918. expiryDt: this.dateFormat(new Date()),
  919. idCardAddress: '',
  920. createUserId: this.userId,
  921. remark: '',
  922. }
  923. ],
  924. //现就职单位
  925. customerCompany:
  926. {
  927. address: "",
  928. companyName: "",
  929. createTime: this.dateFormat(new Date()),
  930. id: '',
  931. postCodes: "",
  932. remark: "",
  933. userName: "",
  934. },
  935. //客户工作经历表
  936. workExperience: [
  937. {
  938. id: 0,
  939. dcId: 0,
  940. company: "",
  941. companyAddress: "",
  942. phone: "",
  943. job: "",
  944. leaderName: "",
  945. workStart: this.dateFormat(new Date()),
  946. workEnd: this.dateFormat(new Date()),
  947. workState: "",
  948. createUserId: this.userId,
  949. remark: ""
  950. }
  951. ],
  952. //客户学历表
  953. customerSchool: [
  954. {
  955. id: 0,
  956. dcId: 0,
  957. school: '',
  958. address: '',
  959. teacher: '',
  960. education: '',
  961. subject: '',
  962. studyStart: this.dateFormat(new Date()),
  963. studyEnd: this.dateFormat(new Date()),
  964. createUserId: this.userId,
  965. remark: ''
  966. }
  967. ],
  968. //家庭成员
  969. customerFamily: [
  970. {
  971. id: 0,
  972. dcId: 0,
  973. appellation: "",
  974. name: "",
  975. birthDay: this.dateFormat(new Date()),
  976. birthPlace: "",
  977. politics: "",
  978. client: "",
  979. address: "",
  980. isEu: 0,
  981. nameSnd: "",
  982. birthDaySnd: this.dateFormat(new Date()),
  983. nationality: "",
  984. idCard: "",
  985. reletionship: "",
  986. isUSA: 0,
  987. createUserId: this.userId,
  988. remark: ""
  989. }
  990. ],
  991. educationalList: [
  992. { name: '', age: '' }
  993. ],
  994. options: [{
  995. value: '0',
  996. label: '父亲'
  997. }, {
  998. value: '1',
  999. label: '母亲'
  1000. }, {
  1001. value: '2',
  1002. label: '儿子'
  1003. }, {
  1004. value: '3',
  1005. label: '女儿'
  1006. }, {
  1007. value: '4',
  1008. label: '妻子'
  1009. }, {
  1010. value: '5',
  1011. label: '丈夫'
  1012. }],
  1013. value: '',
  1014. CompanySelectData: [],//单位数据
  1015. SetData: [],//证件类型数据
  1016. };
  1017. },
  1018. methods: {
  1019. CustomerInfo() {
  1020. var url = "/api/CRM/CustomerInfo"
  1021. var that = this
  1022. this.$axios({
  1023. method: 'post',
  1024. url: url,
  1025. headers: {
  1026. Authorization: 'Bearer ' + this.token
  1027. },
  1028. data: {
  1029. Id: that.Id,
  1030. }
  1031. }).then(function (res) {
  1032. console.log(res)
  1033. if (res.data.code == 200) {
  1034. console.log(res.data.data.deleClient)
  1035. that.deleClient = res.data.data.deleClient
  1036. that.customerCompany = res.data.data.customerCompany
  1037. if (res.data.data.customerCerts != 0) {
  1038. that.customerCerts = res.data.data.customerCerts
  1039. }
  1040. if (res.data.data.customerFamily != 0) {
  1041. that.customerFamily = res.data.data.customerFamily
  1042. }
  1043. if (res.data.data.workExperience != 0) {
  1044. that.workExperience = res.data.data.workExperience
  1045. }
  1046. if (res.data.data.customerSchool != 0) {
  1047. that.customerSchool = res.data.data.customerSchool
  1048. }
  1049. }
  1050. }).catch(function (error) {
  1051. that.$message.error("网络错误,请稍后重试");
  1052. });
  1053. },
  1054. handleClose(done) {
  1055. done();
  1056. },
  1057. btnAddCom() {
  1058. this.OperationData = {
  1059. status: 1,
  1060. id: 0,
  1061. companyName: "",
  1062. address: "",
  1063. postCodes: "",
  1064. lastedOpUserId: this.userId,
  1065. createUserId: this.userId,
  1066. remark: ""
  1067. },
  1068. this.TypeVisible = true;
  1069. this.typeName = "添加客户公司资料"
  1070. },
  1071. AddBtn() {
  1072. this.$refs.OperationData.validate((valid) => {
  1073. if (valid) {
  1074. var that = this
  1075. var url = "/api/CRM/OperationClientCompany"
  1076. that.$axios({
  1077. method: 'post',
  1078. url: url,
  1079. headers: {
  1080. Authorization: 'Bearer ' + that.token
  1081. },
  1082. data: that.OperationData
  1083. }).then(function (res) {
  1084. if (res.data.code == 200) {
  1085. that.$message({
  1086. message: res.data.msg,
  1087. type: 'success'
  1088. });
  1089. that.CompanySelect();
  1090. that.TypeVisible = false;
  1091. } else {
  1092. that.$message.error(res.data.msg);
  1093. }
  1094. })
  1095. }
  1096. })
  1097. },
  1098. CompanySelect() {
  1099. var url = "/api/CRM/GetClientCompanyList"
  1100. var that = this
  1101. this.$axios({
  1102. method: 'post',
  1103. url: url,
  1104. headers: {
  1105. Authorization: 'Bearer ' + this.token
  1106. },
  1107. data: {
  1108. PortType: 1,
  1109. }
  1110. }).then(function (res) {
  1111. console.log(res)
  1112. if (res.data.code == 200) {
  1113. that.CompanySelectData = res.data.data
  1114. }
  1115. }).catch(function (error) {
  1116. that.$message.error("网络错误,请稍后重试");
  1117. });
  1118. },
  1119. companyChange(Id) {
  1120. this.CompanySelectData.forEach((item, index) => {
  1121. if (item.id == Id) {
  1122. this.customerCompany = {
  1123. address: item.address,
  1124. companyName: item.companyName,
  1125. createTime: item.createTime,
  1126. id: item.id,
  1127. postCodes: item.postCodes,
  1128. remark: item.remark,
  1129. userName: item.userName,
  1130. };
  1131. }
  1132. })
  1133. console.log(this.customerCompany)
  1134. },
  1135. QuerySetData() {
  1136. var url = "/api/System/QuerySetData"
  1137. var that = this
  1138. this.$axios({
  1139. method: 'post',
  1140. url: url,
  1141. headers: {
  1142. Authorization: 'Bearer ' + this.token
  1143. },
  1144. data: {
  1145. DataType: 57,
  1146. }
  1147. }).then(function (res) {
  1148. console.log(res)
  1149. if (res.data.code == 200) {
  1150. that.SetData = res.data.data
  1151. }
  1152. }).catch(function (error) {
  1153. that.$message.error("网络错误,请稍后重试");
  1154. });
  1155. },
  1156. submitForm() {
  1157. debugger
  1158. this.deleClient.diId = parseInt(this.DiId)
  1159. if (isNaN(this.deleClient.diId)) {
  1160. this.deleClient.diId = 0
  1161. }
  1162. this.$refs.deleClient.validate((valid) => {
  1163. if (valid) {
  1164. var that = this
  1165. that.deleClient.crmCompanyId = that.customerCompany.id
  1166. that.deleClient.createUserId = that.userId;
  1167. debugger
  1168. that.customerFamily.forEach((element, index) => {
  1169. debugger
  1170. if (element.name == '' && element.appellation == '') {
  1171. that.customerFamily.splice(index, 1)
  1172. } else {
  1173. element.nameSnd = element.name
  1174. element.BirthDaySnd = element.birthDay
  1175. element.dcId = that.Id
  1176. element.createUserId = that.userId
  1177. }
  1178. });
  1179. that.customerCerts.forEach((element, index) => {
  1180. if (element.certNo == '' && element.sdId == '') {
  1181. that.customerCerts.splice(index, 1)
  1182. }
  1183. element.dcId = that.Id
  1184. element.createUserId = that.userId
  1185. });
  1186. that.workExperience.forEach((element, index) => {
  1187. if (element.company == '' && element.companyAddress == '') {
  1188. that.workExperience.splice(index, 1)
  1189. }
  1190. element.dcId = that.Id
  1191. element.createUserId = that.userId
  1192. });
  1193. that.customerSchool.forEach((element, index) => {
  1194. if (element.school == '' && element.address == '') {
  1195. that.customerSchool.splice(index, 1)
  1196. }
  1197. element.dcId = that.Id
  1198. element.createUserId = that.userId
  1199. });
  1200. var dttaStr = {
  1201. Status: that.Status,
  1202. DeleClient: that.deleClient,
  1203. CustomerFamily: that.customerFamily,
  1204. CustomerCert: that.customerCerts,
  1205. WorkExperience: that.workExperience,
  1206. CustomerSchool: that.customerSchool
  1207. }
  1208. console.log(dttaStr)
  1209. var url = "/api/CRM/EditCustomer"
  1210. this.$axios({
  1211. method: 'post',
  1212. url: url,
  1213. headers: {
  1214. Authorization: 'Bearer ' + this.token
  1215. },
  1216. data: dttaStr
  1217. }).then(function (res) {
  1218. console.log(res)
  1219. if (res.data.code == 200) {
  1220. that.$message({
  1221. message: res.data.msg,
  1222. type: 'success'
  1223. });
  1224. that.loading = true;
  1225. setTimeout(() => {
  1226. that.$router.push('/home/DeleClient')
  1227. }, 3000);
  1228. } else {
  1229. that.$message.error(res.data.msg);
  1230. }
  1231. }).catch(function (error) {
  1232. that.$message.error("网络错误,请稍后重试");
  1233. });
  1234. } else {
  1235. this.$message.error('请完善基础信息在提交');
  1236. return false;
  1237. }
  1238. });
  1239. },
  1240. //添加家庭信息
  1241. customerFamilyAdd() {
  1242. this.customerFamily.push({
  1243. id: 0,
  1244. dcId: this.Id,
  1245. appellation: "",
  1246. name: "",
  1247. birthDay: this.dateFormat(new Date()),
  1248. birthPlace: "",
  1249. politics: "",
  1250. client: "",
  1251. address: "",
  1252. isEu: 0,
  1253. nameSnd: "",
  1254. birthDaySnd: this.dateFormat(new Date()),
  1255. nationality: "",
  1256. idCard: "",
  1257. reletionship: "",
  1258. isUSA: 0,
  1259. createUserId: 0,
  1260. remark: ""
  1261. })
  1262. },
  1263. //删除家庭信息
  1264. subcustomerFamilyAdd(index, Id) {
  1265. if (Id != 0) {
  1266. var url = "/api/CRM/DelCustomerFamily"
  1267. var that = this
  1268. this.$axios({
  1269. method: 'post',
  1270. url: url,
  1271. headers: {
  1272. Authorization: 'Bearer ' + this.token
  1273. },
  1274. data: {
  1275. Id: Id,
  1276. DeleteUserId: that.userId
  1277. }
  1278. }).then(function (res) {
  1279. if (res.data.code == 200) {
  1280. that.$message({
  1281. message: '删除家庭成员成功',
  1282. type: 'success'
  1283. });
  1284. } else {
  1285. that.$message.error('删除失败!');
  1286. }
  1287. }).catch(function (error) {
  1288. that.$message.error("网络错误,请稍后重试");
  1289. });
  1290. }
  1291. this.customerFamily.splice(index, 1)
  1292. },
  1293. //添加证件信息
  1294. customerCertsAdd() {
  1295. this.customerCerts.push({
  1296. id: 0,
  1297. dcId: this.Id,
  1298. sdId: '',
  1299. certNo: '',
  1300. country: '',
  1301. area: '',
  1302. targetCountry: '',
  1303. issueDt: this.dateFormat(new Date()),
  1304. expiryDt: this.dateFormat(new Date()),
  1305. idCardAddress: '',
  1306. createUserId: 0,
  1307. remark: '',
  1308. })
  1309. },
  1310. //删除证件信息
  1311. subcustomerCertsAdd(index, Id) {
  1312. if (Id != 0) {
  1313. var url = "/api/CRM/DelCustomerCerts"
  1314. var that = this
  1315. this.$axios({
  1316. method: 'post',
  1317. url: url,
  1318. headers: {
  1319. Authorization: 'Bearer ' + this.token
  1320. },
  1321. data: {
  1322. Id: Id,
  1323. DeleteUserId: that.userId
  1324. }
  1325. }).then(function (res) {
  1326. console.log(res)
  1327. if (res.data.code == 200) {
  1328. that.$message({
  1329. message: '删除证件成功',
  1330. type: 'success'
  1331. });
  1332. } else {
  1333. that.$message.error('删除失败!');
  1334. }
  1335. }).catch(function (error) {
  1336. that.$message.error("网络错误,请稍后重试");
  1337. });
  1338. }
  1339. this.customerCerts.splice(index, 1)
  1340. },
  1341. //添加工作经历
  1342. workExperienceadd() {
  1343. this.workExperience.push({
  1344. id: 0,
  1345. dcId: 0,
  1346. company: "",
  1347. companyAddress: "",
  1348. phone: "",
  1349. job: "",
  1350. leaderName: "",
  1351. workStart: this.dateFormat(new Date()),
  1352. workEnd: this.dateFormat(new Date()),
  1353. workState: "",
  1354. createUserId: 0,
  1355. remark: ""
  1356. })
  1357. },
  1358. //删除工作经历表
  1359. subworkExperience(index, Id) {
  1360. if (Id != 0) {
  1361. var url = "/api/CRM/DelVisaCustomerCompany"
  1362. var that = this
  1363. this.$axios({
  1364. method: 'post',
  1365. url: url,
  1366. headers: {
  1367. Authorization: 'Bearer ' + this.token
  1368. },
  1369. data: {
  1370. Id: Id,
  1371. DeleteUserId: that.userId
  1372. }
  1373. }).then(function (res) {
  1374. console.log(res)
  1375. if (res.data.code == 200) {
  1376. that.$message({
  1377. message: '删除证件成功',
  1378. type: 'success'
  1379. });
  1380. } else {
  1381. that.$message.error('删除失败!');
  1382. }
  1383. }).catch(function (error) {
  1384. that.$message.error("网络错误,请稍后重试");
  1385. });
  1386. this.workExperience.splice(index, 1)
  1387. }
  1388. },
  1389. //添加客户学历
  1390. addcustomerSchool() {
  1391. this.customerSchool.push(
  1392. {
  1393. id: 0,
  1394. dcId: 0,
  1395. school: '',
  1396. address: '',
  1397. teacher: '',
  1398. education: '',
  1399. subject: '',
  1400. studyStart: this.dateFormat(new Date()),
  1401. studyEnd: this.dateFormat(new Date()),
  1402. createUserId: this.userId,
  1403. remark: ''
  1404. }
  1405. )
  1406. },
  1407. //删除客户学历
  1408. subcustomerSchool(index, Id) {
  1409. if (Id != 0) {
  1410. var url = "/api/CRM/DelCustomerSchool"
  1411. var that = this
  1412. this.$axios({
  1413. method: 'post',
  1414. url: url,
  1415. headers: {
  1416. Authorization: 'Bearer ' + this.token
  1417. },
  1418. data: {
  1419. Id: Id,
  1420. DeleteUserId: that.userId
  1421. }
  1422. }).then(function (res) {
  1423. if (res.data.code == 200) {
  1424. that.$message({
  1425. message: '删除证件成功',
  1426. type: 'success'
  1427. });
  1428. } else {
  1429. that.$message.error('删除失败!');
  1430. }
  1431. }).catch(function (error) {
  1432. that.$message.error("网络错误,请稍后重试");
  1433. });
  1434. }
  1435. this.customerSchool.splice(index, 1)
  1436. }
  1437. },
  1438. mounted() {
  1439. this.token = JSON.parse(localStorage.getItem('userinif')).token;
  1440. this.userId = JSON.parse(localStorage.getItem('userinif')).userInfo.userId
  1441. this.Id = this.$route.query.id
  1442. this.DiId = this.$route.query.DiId
  1443. if (this.Id == 0 || this.Id == undefined) {
  1444. this.Status = 1;
  1445. this.Id = 0;
  1446. this.typeStr = "添加客户信息"
  1447. } else {
  1448. this.CustomerInfo();
  1449. this.typeStr = "修改客户信息"
  1450. this.Status = 2
  1451. }
  1452. this.CompanySelect();
  1453. this.QuerySetData();
  1454. }
  1455. }
  1456. </script>
  1457. <style>
  1458. .plate-box {
  1459. background-color: #fff;
  1460. padding: 10px;
  1461. box-shadow: 0 0 5px #0005;
  1462. border-radius: 10px;
  1463. margin-bottom: 20px;
  1464. }
  1465. .visaedit-title {
  1466. display: flex;
  1467. font-size: 17px;
  1468. font-weight: 600;
  1469. color: #555;
  1470. margin-top: 8px;
  1471. margin-bottom: 2px;
  1472. justify-content: space-between;
  1473. align-items: center;
  1474. margin-bottom: 10px;
  1475. }
  1476. .tips {
  1477. margin-bottom: 10px;
  1478. font-size: 12px;
  1479. color: #555;
  1480. }
  1481. .foundation-box {
  1482. display: flex;
  1483. flex-wrap: wrap;
  1484. }
  1485. .foundation-box1 {
  1486. display: flex;
  1487. flex-wrap: wrap;
  1488. }
  1489. .foundation-box .el-form-item {
  1490. width: 33%;
  1491. }
  1492. .small-title {
  1493. font-size: 14px;
  1494. font-weight: 600;
  1495. color: #555;
  1496. margin: 18px 0 25px;
  1497. }
  1498. .small-title>span {
  1499. display: inline;
  1500. padding: 5px 10px;
  1501. box-shadow: 0 0 5px #0005;
  1502. border-radius: 5px;
  1503. }
  1504. .member-li {
  1505. display: flex;
  1506. align-items: end;
  1507. justify-content: space-between;
  1508. }
  1509. .member-li>.el-form-item {
  1510. width: 10%;
  1511. }
  1512. .visaedit-box .el-form-item .el-form-item__content span {
  1513. color: #606266;
  1514. }
  1515. .citizens-box {
  1516. display: flex;
  1517. flex-wrap: wrap;
  1518. }
  1519. .citizens-box>.el-form-item {
  1520. width: 25%;
  1521. }
  1522. .citizens-box>.citizens-li {
  1523. display: flex;
  1524. width: 50%;
  1525. }
  1526. .textClass {
  1527. text-align: right;
  1528. vertical-align: middle;
  1529. float: left;
  1530. font-size: 14px;
  1531. color: #606266;
  1532. line-height: 40px;
  1533. padding: 0 12px 0 0;
  1534. -webkit-box-sizing: border-box;
  1535. box-sizing: border-box;
  1536. }
  1537. .el-date-editor.el-input,
  1538. .el-date-editor.el-input__inner {
  1539. width: 100%;
  1540. }
  1541. </style>