zizhujiandang.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395
  1. var $nameInput = $("#name"),//姓名
  2. $sscInput = $("#ybcard").find("input"),// 医保卡号
  3. $mobileInput = $("#phonenum").find("input"),// 手机号码
  4. $Birthday = $("#Birthday").find("input"),// 出生日期
  5. $address = $("#address").find("input"),// 户口所在地
  6. $committee = $("#committee"),//所属居委会
  7. $Present_Address = $('#Present_Address').find('input'),//现住址
  8. $infoList = $("#info_list"),// 表单的ul容器
  9. $nextStep = $('#next_step');// 下一步按钮
  10. var nation, blood, marryed;
  11. var nationObj = {},
  12. marryedObj = {},
  13. bloodObj = {};
  14. var signData;//缓存签约数据
  15. var jiandangCase;
  16. var d = dialog({contentType:'load', skin:'bk-popup'});
  17. function toast(msg){
  18. dialog({contentType:'tipsbox',bottom:true, skin:'bk-popup' , content:msg}).show()
  19. }
  20. //请求失败
  21. function queryFailed(){ d.close();toast('请求失败');}
  22. $(function(){
  23. var cases = window.localStorage.getItem('jiandangCase1')
  24. jiandangCase = cases?JSON.parse(cases):''
  25. if(jiandangCase){//有缓存
  26. $('#name').text(jiandangCase.name)
  27. $('#idcard').val(jiandangCase.idcard)
  28. $('#ssc').val(jiandangCase.ssc)
  29. $committee.val(jiandangCase.countryName)
  30. $committee.attr('data-jwcode',jiandangCase.countryCode)
  31. $Birthday.val(jiandangCase.Birthday)
  32. $mobileInput.val(jiandangCase.mobile)
  33. $address.val(jiandangCase.address)
  34. $address.attr('data-code',jiandangCase.addressCode)
  35. $Present_Address.val(jiandangCase.Present_Address)
  36. $('#sex').attr('data-code',jiandangCase.sex)
  37. $('#national').attr('data-code',jiandangCase.national)
  38. $('#national').attr('data-name',jiandangCase.nationalName)
  39. $('#marry').attr('data-code',jiandangCase.marry)
  40. $('#marry').attr('data-name',jiandangCase.marryName)
  41. $('#Blood_type').attr('data-code',jiandangCase.Blood_type)
  42. $('#Blood_type').attr('data-name',jiandangCase.Blood_typeName)
  43. }else{
  44. signData = JSON.parse(window.localStorage.getItem('is_signData'));// 获取缓存
  45. $('#name').text(signData.name)
  46. $('#idcard').val(signData.idcard)
  47. $('#ssc').val(signData.ssc)
  48. $('#committee').val(signData.countryName)
  49. $('#committee').attr('data-jwcode',signData.jwCountryCode)
  50. //提取身份证
  51. var idStr;
  52. var dd = signData.idcard;
  53. if(dd.length == 18){
  54. idStr = dd.substring(6,10)+'-'+dd.substring(10,12)+'-'+dd.substring(12,14)
  55. if(dd.substring(16,17)%2==0){
  56. $('#sex').attr('data-code','2')
  57. }else{
  58. $('#sex').attr('data-code','1')
  59. }
  60. }else if(dd.length == 15){
  61. idStr = '19'+dd.substring(6,8)+'-'+dd.substring(8,10)+'-'+dd.substring(10,12)
  62. if(dd.substring(14,15)%2==0){
  63. $('#sex').attr('data-code','2')
  64. }else{
  65. $('#sex').attr('data-code','1')
  66. }
  67. }
  68. $Birthday.val(idStr)
  69. }
  70. // 获取血型、婚姻、民族字典
  71. sendPost('patient/getNationDict', {}, 'json', 'get',queryFailed, function(res) {
  72. if(res.status==200) {
  73. nationObj = res.data
  74. addOneContent1(nationObj);
  75. }else{
  76. toast('获取民族字典数据失败')
  77. }
  78. })
  79. sendPost('patient/getMarryDict', {}, 'json', 'get',queryFailed, function(res) {
  80. if(res.status==200) {
  81. marryedObj = res.data
  82. addOneContent2(marryedObj);
  83. }else{
  84. toast('获取婚姻字典数据失败')
  85. }
  86. })
  87. sendPost('patient/getBloodDict', {}, 'json', 'get',queryFailed, function(res) {
  88. if(res.status==200) {
  89. bloodObj = res.data
  90. addOneContent3(bloodObj);
  91. }else{
  92. toast('获取血型字典数据失败')
  93. }
  94. })
  95. addOneContent4([{'code':'1','name':'男'},{'code':'2','name':'女'}])
  96. $Birthday.mobiscroll().date({
  97. theme: "ios",
  98. lang: "zh",
  99. display: "bottom",
  100. dateFormat: "yy-mm-dd",
  101. onSelect: function(valueText, inst) {
  102. }
  103. })
  104. // 弹出框生成民族内容
  105. function addOneContent1(arr) {
  106. var len = arr.length;
  107. var html = "<option disabled selected></option>";
  108. for(var i = 0; i < len; i++) {
  109. if(jiandangCase&&jiandangCase.national == arr[i].NATION_CODE){
  110. html += '<option selected value="'+arr[i].NATION_CODE+'">' + arr[i].NATION_NAME + '</option>'
  111. }else{
  112. html += '<option value="'+arr[i].NATION_CODE+'">' + arr[i].NATION_NAME + '</option>'
  113. }
  114. }
  115. $('#nation').html(html)
  116. $('#nation').mobiscroll().select({
  117. theme: "ios",
  118. lang: "zh",
  119. placeholder:'请选择民族',
  120. display: "bottom",
  121. onSelect: function(valueText, inst) {
  122. $('#national').attr('data-code',inst._tempValue)
  123. $('#national').attr('data-name',valueText)
  124. }
  125. })
  126. }
  127. // 弹出框生成婚姻内容
  128. function addOneContent2(arr) {
  129. var len = arr.length;
  130. var html = "<option disabled selected></option>";
  131. for(var i = 0; i < len; i++) {
  132. if(jiandangCase&&jiandangCase.marry == arr[i].code){
  133. html += '<option selected value="'+arr[i].code+'">' + arr[i].value + '</option>'
  134. }else{
  135. html += '<option value="'+arr[i].code+'">' + arr[i].value + '</option>'
  136. }
  137. }
  138. $('#marryed').html(html)
  139. $('#marryed').mobiscroll().select({
  140. theme: "ios",
  141. lang: "zh",
  142. placeholder:'请选择婚姻情况',
  143. display: "bottom",
  144. onSelect: function(valueText, inst) {
  145. $('#marry').attr('data-code',inst._tempValue)
  146. $('#marry').attr('data-name',valueText)
  147. }
  148. })
  149. }
  150. // 弹出框生成血型内容
  151. function addOneContent3(arr) {
  152. var len = arr.length;
  153. var html = "<option disabled selected></option>";
  154. for(var i = 0; i < len; i++) {
  155. if(jiandangCase&&jiandangCase.Blood_type == arr[i].code){
  156. html += '<option selected value="'+arr[i].code+'">' + arr[i].value + '</option>'
  157. }else{
  158. html += '<option value="'+arr[i].code+'">' + arr[i].value + '</option>'
  159. }
  160. }
  161. $('#Bloodtype').html(html)
  162. $('#Bloodtype').mobiscroll().select({
  163. theme: "ios",
  164. lang: "zh",
  165. placeholder:'请选择血型',
  166. display: "bottom",
  167. onSelect: function(valueText,inst) {
  168. $('#Blood_type').attr('data-code',inst._tempValue)
  169. $('#Blood_type').attr('data-name',valueText)
  170. }
  171. })
  172. }
  173. // 弹出框生成性别
  174. function addOneContent4(arr) {
  175. var len = arr.length;
  176. var html = "<option disabled selected></option>";
  177. for(var i = 0; i < len; i++) {
  178. if(arr[i].code == $('#sex').attr('data-code') || arr[i].code == jiandangCase.sex){
  179. html += '<option selected value="'+arr[i].code+'">' + arr[i].name + '</option>'
  180. }else{
  181. html += '<option value="'+arr[i].code+'">' + arr[i].name + '</option>'
  182. }
  183. }
  184. $('#sexs').html(html)
  185. $('#sexs').mobiscroll().select({
  186. theme: "ios",
  187. lang: "zh",
  188. placeholder:'请选择性别',
  189. display: "bottom",
  190. onSelect: function(valueText, inst) {
  191. $('#sex').attr('data-code',inst._tempValue)
  192. }
  193. })
  194. }
  195. initExpressAddr();
  196. //初始化户口所在地选择下拉框数据
  197. function initExpressAddr(){
  198. picker = new mui.PopPicker({
  199. layer: 2,
  200. layerNames: ["省","市"]
  201. });
  202. //获取省份信息
  203. getDistrict(1, '', 0);
  204. bindPickerEvent();
  205. }
  206. //绑定picker的事件
  207. function bindPickerEvent(){
  208. $(picker.pickers[0].holder).on('change', function(event) {
  209. var eventData = event.originalEvent.detail || {},
  210. item = eventData.item;
  211. if(!item || !item.value) {
  212. return ;
  213. }
  214. //获取市信息
  215. getDistrict(2, item.value, 1);
  216. });
  217. }
  218. /**
  219. * 获得省市区数据
  220. * @param {number} type 1-省,2-市,3-区
  221. * @param {string} code 省市对应的code
  222. * @param {number} level 对应下拉框对应的列 0-省,1-市,2-区
  223. */
  224. function getDistrict(type, code, level){
  225. var url = 'common/district',
  226. params = {type: type, code: code};
  227. sendPost(url,params,'json', 'post',queryFailed, function(res) {
  228. if(res.status==200) {
  229. var data = _.map(res.list, function(o){
  230. return {
  231. value: o.code,
  232. text: o.name
  233. }
  234. });
  235. picker.pickers[level].setItems(data);
  236. }else{
  237. toast('获取地址数据失败')
  238. }
  239. })
  240. }
  241. //选择地址下拉框
  242. $("#address").on('click', function(){
  243. picker.show(function(selected){
  244. var text = selected[0].text+selected[1].text;
  245. $("#address .select-input").val(text);
  246. $("#address .select-input").attr('data-code',selected[1].value);
  247. })
  248. })
  249. // 获取填写的数据
  250. var getInputs = function() {
  251. var data = {
  252. idcard:jiandangCase?jiandangCase.idcard:signData.idcard,
  253. name: jiandangCase?jiandangCase.name:signData.name, // 姓名
  254. sex:$('#sex').attr('data-code'),
  255. ssc:jiandangCase?jiandangCase.ssc:signData.ssc,
  256. sexName:$('#sex').attr('data-code')=='1'?'男':'女',
  257. mobile: $mobileInput.val().trim(), // 手机号码
  258. Birthday: $Birthday.val(), // 出生日期
  259. address: $address.val(), // 户口所在地
  260. addressCode:$address.attr('data-code'),
  261. national: $('#national').attr('data-code'), // 民族
  262. nationalName: $('#national').attr('data-name'),
  263. marry: $('#marry').attr('data-code'), // 婚姻情况
  264. marryName: $('#marry').attr('data-name'),
  265. Blood_type: $('#Blood_type').attr('data-code'), // 血型
  266. Blood_typeName: $('#Blood_type').attr('data-name'),
  267. countryCode: $committee.attr('data-jwcode'), //居委会
  268. countryName: $committee.val(),
  269. Present_Address: $Present_Address.val().trim(), //现住址
  270. }
  271. return data;
  272. },
  273. // 必输验证
  274. validRequired = function(data) {
  275. var fieldsStr = "mobile,Birthday,address,national,marry,Blood_type,countryCode,Present_Address",
  276. fieldMap = {
  277. mobile: "手机号码",
  278. Birthday: "出生日期",
  279. address: "户口所在地",
  280. national: "民族",
  281. marry: "婚姻情况",
  282. Blood_type: "血型",
  283. countryCode: "居委会",
  284. Present_Address: "现住址"
  285. },
  286. fields = fieldsStr.split(","),
  287. invalidField;
  288. // 某个字段为""、null、undefined,则该字段不能通过必输校验
  289. invalidField = _.find(fields, function(key) {
  290. return !data[key] && data[key] !== 0;
  291. });
  292. if(invalidField) {
  293. toast(fieldMap[invalidField] + '不能为空');
  294. return false;
  295. } else {
  296. return true;
  297. }
  298. },
  299. // 校验医保卡号格式
  300. validSSC = function(ssc, isshow) {
  301. var sscReg = /^([a-zA-Z]{1}[a-zA-Z0-9]{8}|[0-9]{12})$/;
  302. if(!ssc) return;
  303. if(!sscReg.test(ssc)) {
  304. $sscInput.css("color", "red")
  305. if(isshow != false) {
  306. toast("请填写有效的医保卡卡号");
  307. }
  308. return false;
  309. }
  310. $sscInput.css("color", "");
  311. return true;
  312. },
  313. // 校验手机号格式
  314. validMobile = function(mobile) {
  315. var mobileReg = /^[1][3578][0-9]{9}$/;
  316. if(!mobile) return;
  317. if(!mobileReg.test(mobile)) {
  318. $mobileInput.css("color", "red");
  319. toast("请填写有效的手机号码");
  320. return false;
  321. }
  322. $mobileInput.css("color", "");
  323. return true;
  324. },
  325. // 输入格式验证
  326. validFormat = function(data) {
  327. return validSSC(data.ssc) && (!data.mobile || validMobile(data.mobile))
  328. },
  329. // 所有输入验证
  330. validInputsPromise = function(fun) {
  331. // 表单数据
  332. var data = getInputs();
  333. return Promise.resolve()
  334. .then(function() {
  335. if(!validRequired(data)) throw new Error("必输校验失败");
  336. })
  337. .then(function() {
  338. if(!validFormat(data)) throw new Error("格式校验失败");
  339. })
  340. .then(function() {
  341. return fun&&fun.call(this,data);
  342. })
  343. .then(function(flag) {
  344. if(!flag) throw new Error("数据有效性校验失败");
  345. })
  346. .then(function() {
  347. // 所有校验成功
  348. $infoList.find('input').css("color", "");
  349. return data;
  350. });
  351. },
  352. bindEvents = function() {
  353. //选择居委会
  354. selectCommittee()
  355. // 预览
  356. $nextStep.on('tap', function() {
  357. validInputsPromise(function(data){
  358. d.show()
  359. window.localStorage.setItem("jiandangCase1",JSON.stringify(data))
  360. window.location.href = "xinxiqueren.html";
  361. })
  362. })
  363. //详细信息
  364. $(".detail").on('tap', function() {
  365. validInputsPromise(function(data){
  366. d.show()
  367. window.localStorage.setItem("jiandangCase1",JSON.stringify(data))
  368. window.location.href = "xinxicaiji.html";
  369. })
  370. })
  371. // 获取焦点时恢复输入的字体颜色
  372. $('input').on('focus',function() {
  373. $(this).css("color", "");
  374. })
  375. $sscInput.on('blur', function() {
  376. validSSC($(this).val().trim());
  377. })
  378. $mobileInput.on('blur', function() {
  379. validMobile($(this).val().trim());
  380. })
  381. }
  382. bindEvents()
  383. })