Головна сторінка Огляд Довідка
Увійти
zk-platform
/
student-web
2
0
Відгалуження 0
Файли Проблеми 0 Запити на злиття 0 Wiki
Дерево: edf186ca21
Гілки Теги
student-web
/
public
/
login
/
reg.html

reg.html 34 KB
Історія Запис

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898 
  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. 

  4. <head>
    5. 

  5.   <title>广西自学考试网上系统</title>
    6. 

  6.   <meta charset="UTF-8">
    7. 

  7.   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    8. 

  8.   <!-- import CSS -->
    9. 

  9.   <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->
    10. 

  10. <!--<link rel="stylesheet" href="https://unpkg.com/element-ui@2.4.11/lib/theme-chalk/index.css">-->
    11. 

  11. <!--<link rel="stylesheet" href="https://unpkg.com/element-ui@2.4.11/lib/theme-chalk/index.css">-->
    12. 

  12. <link rel="stylesheet" href="https://lib.baomitu.com/element-ui/2.12.0/theme-chalk/index.css">
    13. 

  13.   <link rel="stylesheet" href="./css/icons.css">
    14. 

  14.   <!-- <link rel="stylesheet" href="./css/select-dropdown.css"> -->
    15. 

  15.   <!-- <link rel="stylesheet" href="./css/select.css"> -->
    16. 

  16. 

  17. 

  18.   <!-- <link href="./vendor/step/bootstrap.min.css" rel="stylesheet"> -->
    19. 

  19.   <!-- <link href="./vendor/step/gloab.css" rel="stylesheet"> -->
    20. 

  20. 

  21.   <script src="./vendor/md5/md5.js" type="text/javascript"></script>
    22. 

  22.   <!--<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>-->
    23. 

  23. 

  24. </head>
    25. 

  25. 

  26. <body>
    27. 

  27.   <div id="app" style="width:60%;left:20%;position:absolute;margin: 10px 10px;display: none;">
    28. 

  28.     <el-card class="box-card" body-style="max-height: 200px;">
    29. 

  29.       <!-- <div class="step">
    30. 

  30.         <ul>
    31. 

  31.           <li class="col-xs-3 on">
    32. 

  32.             <span class="num">
    33. 

  33.               <em class="f-r5"></em>
    34. 

  34.               <i>1</i>
    35. 

  35.             </span>
    36. 

  36.             <span class="line_bg lbg-r"></span>
    37. 

  37.             <p class="lbg-txt">填写基础信息</p>
    38. 

  38.           </li>
    39. 

  39.           <li class="col-xs-3 on">
    40. 

  40.             <span class="num">
    41. 

  41.               <em class="f-r5"></em>
    42. 

  42.               <i>2</i>
    43. 

  43.             </span>
    44. 

  44.             <span class="line_bg lbg-l"></span>
    45. 

  45.             <span class="line_bg lbg-r"></span>
    46. 

  46.             <p class="lbg-txt">完善资料并上传照片</p>
    47. 

  47.           </li>
    48. 

  48.           <li class="col-xs-3">
    49. 

  49.             <span class="num">
    50. 

  50.               <em class="f-r5"></em>
    51. 

  51.               <i>3</i>
    52. 

  52.             </span>
    53. 

  53.             <span class="line_bg lbg-l"></span>
    54. 

  54.             <span class="line_bg lbg-r"></span>
    55. 

  55.             <p class="lbg-txt">生成准考证</p>
    56. 

  56.           </li>
    57. 

  57.           <li class="col-xs-3">
    58. 

  58.             <span class="num">
    59. 

  59.               <em class="f-r5"></em>
    60. 

  60.               <i>4</i>
    61. 

  61.             </span>
    62. 

  62.             <span class="line_bg lbg-l"></span>
    63. 

  63.             <p class="lbg-txt">课程报考</p>
    64. 

  64.           </li>
    65. 

  65.         </ul>
    66. 

  66.       </div> -->
    67. 

  67.       <img src="./img/1.png" style="width: 700px;">
    68. 

  68. 

  69.     </el-card>
    70. 

  70.     <br>
    71. 

  71.     <el-card class="box-card" v-loading="loading" element-loading-text="初始化数据加载中...">
    72. 

  72. 

  73.       <div slot="header" class="clearfix">
    74. 

  74.         <div style="text-align: center;font-size: 15px;">
    75. 

  75.           广西自考考生注册
    76. 

  76.         </div>
    77. 

  77.       </div>
    78. 

  78.       <div style="margin-bottom: 8px;font-size: 16px">
    79. 

  79.         <el-alert title="请考生认真如实填写有关个人档案信息。其中的姓名、性别、身份证号，一旦确认即不可以随意更改。更改需要到自考办现场申请并需提交公安部门证明。" type="warning":closable="false">
    80. 

  80.         </el-alert>
    81. 

  81. 

  82.       </div>
    83. 

  83.       
    84. 

  84.         <center>
    85. 

  85.           <div style="width: 600px">
    86. 

  86.               <el-tabs type="border-card">
    87. 

  87.                 <el-tab-pane label="新考生" @click(initParam())>
    88. 

  88.                     <!-- <div style="width: 400px">  -->
    89. 

  89.                       <el-form ref="stdRegInfo" :model="stdRegInfo" :rules="stdRegInfoRule" label-width="120px">
    90. 

  90.                       <el-row>
    91. 

  91.                           <el-col :span="24">
    92. 

  92.                            <!--
    93. 

  93.                               <el-form-item label="身份证正面照片">
    94. 

  94.                                 <el-button type="primary" @click="cardOcr()" style="float: left;" title="读取身份证照片信息，自动填充。（可以不上传）">上传身份证照片</el-button> 温馨提醒：身份证照片大小不能超过1.5M。
    95. 

  95.                               </el-form-item>
    96. 

  96.                             
    97. 

  97.                             <!--
    98. 

  98.                               <el-form-item label="">
    99. 

  99.                                 &nbsp;
    100. 

  100.                               </el-form-item>
    101. 

  101. --> 
    102. 

  102.                           </el-col>
    103. 

  103.                       </el-row>                         
    104. 

  104.                         <el-row>
    105. 

  105.                           <el-col :span="24">
    106. 

  106.                             <el-form-item label="证件号码" required prop="cert_no">
    107. 

  107.                               <el-input v-model="stdRegInfo.cert_no" maxlength="18" @blur="cert_no_blur" v-bind:readonly="identifyOrc.orcSuccess"  placeholder="请填写证件号码"></el-input>
    108. 

  108.                               <div style="width: 230px; position: absolute; left: 280px; top: 0px;">
    109. 

  109.                                   <el-checkbox label="身份证" v-model="isSFZ" @change="isSFZChange">身份证</el-checkbox>
    110. 

  110.                               </div>
    111. 

  111.                             </el-form-item>
    112. 

  112.                           </el-col>
    113. 

  113.                         </el-row>
    114. 

  114.                         <!-- <el-row>
    115. 

  115.                             <el-col :span="24">
    116. 

  116.                               <el-form-item label="是否身份证">
    117. 

  117.                                   <el-checkbox label="是否身份证" v-model="isSFZ" @change="isSFZChange()">是否身份证</el-checkbox>
    118. 

  118.                               </el-form-item>
    119. 

  119.                             </el-col>
    120. 

  120.                           </el-row>-->
    121. 

  121.                         <el-row> 
    122. 

  122.                           <el-col :span="24">
    123. 

  123.                             <el-form-item label="姓名" prop="std_name">
    124. 

  124.                               <el-input v-model="stdRegInfo.std_name" placeholder="请填写姓名"></el-input>
    125. 

  125.                             </el-form-item>
    126. 

  126.                           </el-col>
    127. 

  127.                         </el-row>
    128. 

  128.                         <!--
    129. 

  129.                         <el-row> 
    130. 

  130.                           <el-col :span="24">
    131. 

  131.                             <el-form-item label="英文名(非必填)" prop="std_eng_name">
    132. 

  132.                               <el-input v-model="stdRegInfo.std_eng_name"></el-input>
    133. 

  133.                             </el-form-item>
    134. 

  134.                           </el-col>
    135. 

  135.                         </el-row>
    136. 

  136.                         -->
    137. 

  137.                         <!-- v-if="isSFZ" -->
    138. 

  138.                         <el-row>
    139. 

  139.                           <el-col :span="24">
    140. 

  140.                             <el-form-item label="性别" prop="std_sex">
    141. 

  141.                               <el-select v-model="stdRegInfo.std_sex" filterable placeholder="请选择性别">
    142. 

  142.                                 <el-option v-for="item in sexArray" :label="item.dict_value+' | '+item.dict_text" :value="item.dict_value"></el-option>
    143. 

  143.                               </el-select>
    144. 

  144.                             </el-form-item>
    145. 

  145.                           </el-col>
    146. 

  146.                         </el-row>
    147. 

  147. <!--
    148. 

  148.                         <el-row v-if="isSFZ && stdRegInfo.cert_no.length ==18">
    149. 

  149.                           <el-col :span="24">
    150. 

  150.                             <el-form-item label="出生日期" prop="std_birth">
    151. 

  151.                               <el-input v-model="stdRegInfo.std_birth" disabled></el-input>
    152. 

  152.                             </el-form-item>
    153. 

  153.                           </el-col>
    154. 

  154.                         
    155. 

  155.                         </el-row>
    156. 

  156. -->
    157. 

  157. 

  158.                         <el-row>
    159. 

  159.                           <el-col :span="24">
    160. 

  160.                             <el-form-item label="密码" prop="std_pass1">
    161. 

  161.                               <el-input type="password" v-model="stdRegInfo.std_pass1" placeholder="密码必须包含字母、数字、特殊字符至少8个字符!"></el-input>
    162. 

  162.                             </el-form-item>
    163. 

  163.                           </el-col>
    164. 

  164.                         </el-row>
    165. 

  165.                         <el-row>
    166. 

  166.                           <el-col :span="24">
    167. 

  167.                             <el-form-item label="确认密码" prop="std_pass2">
    168. 

  168.                               <el-input type="password" v-model="stdRegInfo.std_pass2" placeholder="确认密码必须与密码一致!"></el-input>
    169. 

  169.                             </el-form-item>
    170. 

  170.                           </el-col>
    171. 

  171.                         </el-row>
    172. 

  172. 

  173. 

  174.                         <el-row>
    175. 

  175.                           <el-col :span="24">
    176. 

  176.                             <div style="text-align: center;margin-bottom: 3px">
    177. 

  177.                               <el-form-item>
    178. 

  178.                                 <div style="margin-top: 10px;">
    179. 

  179.                                   <el-button type="primary" id="sbt" @click="onSubmit('new')">提交注册信息</el-button>
    180. 

  180.                                   <el-button @click="goLogin">返回登录页面</el-button>
    181. 

  181.                                 </div>
    182. 

  182. 

  183.                                 <!-- <div class="footer abs-bottom">
    184. 

  184.                                     <center>
    185. 

  185.                                       <font style="font-size: 15px">
    186. 

  186.                                           启明禾木软件 @ 2019
    187. 

  187.                                       </font>
    188. 

  188.                                     </center>
    189. 

  189.                                 </div> -->
    190. 

  190.                               </el-form-item>
    191. 

  191.                             </div>
    192. 

  192.                           </el-col>
    193. 

  193.                         </el-row>
    194. 

  194.                       </el-form>
    195. 

  195.                     <!-- </div> -->
    196. 

  196.                 </el-tab-pane>
    197. 

  197.                 <el-tab-pane label="老考生十二位准考证查询">
    198. 

  198.                     <el-form ref="stdRegInfo" :model="stdRegInfo" :rules="stdRegInfoRule" label-width="120px">
    199. 

  199.                       <el-row>
    200. 

  200.                         <el-col :span="24">
    201. 

  201.                             <el-form-item label="">
    202. 

  202.                               &nbsp;
    203. 

  203.                              </el-form-item>
    204. 

  204.                         </el-col>
    205. 

  205.                     </el-row>                     
    206. 

  206.                         <el-row>
    207. 

  207.                             <el-col :span="24">
    208. 

  208.                                 <el-form-item label="老准考证号">
    209. 

  209.                                     <el-input type="input" v-model="ticket_no_old"></el-input>
    210. 

  210.                                  </el-form-item>
    211. 

  211.                                  <div style="width: 230px; position: absolute; left: 418px; top: 0px;">
    212. 

  212.                                    <el-button type="primary" @click="check()">验证</el-button>
    213. 

  213.                                   </div>
    214. 

  214.                             </el-col>
    215. 

  215.                         </el-row>
    216. 

  216. <!--
    217. 

  217.                         <el-row>
    218. 

  218.                           <el-col :span="12">
    219. 

  219.                             <el-form-item label="十三位准考证">
    220. 

  220.                               {{stdRegInfo.old_ticket_no1}}
    221. 

  221.                             </el-form-item>
    222. 

  222.                           </el-col>
    223. 

  223.                           <el-col :span="12">
    224. 

  224.                             <el-form-item label="非十三位准考证">
    225. 

  225.                               {{stdRegInfo.old_ticket_no2}}
    226. 

  226.                             </el-form-item>
    227. 

  227.                           </el-col>
    228. 

  228.                         </el-row>
    229. 

  229. 

  230.                         <el-row>
    231. 

  231.                           <el-col :span="24">
    232. 

  232.                             <el-form-item label="证件号码" required prop="cert_no">
    233. 

  233.                               <el-input v-model="stdRegInfo.cert_no" maxlength="18" @blur="cert_no_blur"></el-input>
    234. 

  234.                               <div style="width: 230px; position: absolute; left: 280px; top: 0px;">
    235. 

  235.                                   <el-checkbox label="身份证" v-model="isSFZ" @change="isSFZChange">身份证</el-checkbox>
    236. 

  236.                               </div>
    237. 

  237.                             </el-form-item>
    238. 

  238.                           </el-col>
    239. 

  239.                         </el-row>
    240. 

  240.                       -->
    241. 

  241.                         <!-- <el-row>
    242. 

  242.                             <el-col :span="24">
    243. 

  243.                               <el-form-item label="是否身份证">
    244. 

  244.                                   <el-checkbox label="是否身份证" v-model="isSFZ" @change="isSFZChange()">是否身份证</el-checkbox>
    245. 

  245.                               </el-form-item>
    246. 

  246.                             </el-col>
    247. 

  247.                           </el-row>
    248. 

  248.                         <el-row> 
    249. 

  249.                           <el-col :span="24">
    250. 

  250.                             <el-form-item label="姓名" prop="std_name">
    251. 

  251.                               <el-input v-model="stdRegInfo.std_name" disabled></el-input>
    252. 

  252.                             </el-form-item>
    253. 

  253.                           </el-col>
    254. 

  254.                         </el-row>
    255. 

  255.                         <el-row> 
    256. 

  256.                           <el-col :span="24">
    257. 

  257.                             <el-form-item label="英文名(非必填)" prop="std_eng_name">
    258. 

  258.                               <el-input v-model="stdRegInfo.std_eng_name"></el-input>
    259. 

  259.                             </el-form-item>
    260. 

  260.                           </el-col>
    261. 

  261.                         </el-row>
    262. 

  262.                         -->
    263. 

  263.                         <!-- v-if="isSFZ" -->
    264. 

  264.                         <!--
    265. 

  265.                         <el-row>
    266. 

  266.                           <el-col :span="24">
    267. 

  267.                             <el-form-item label="性别" prop="std_sex">
    268. 

  268.                               <el-select v-model="stdRegInfo.std_sex" filterable placeholder="请选择性别">
    269. 

  269.                                 <el-option v-for="item in sexArray" :label="item.dict_value+' | '+item.dict_text" :value="item.dict_value"></el-option>
    270. 

  270.                               </el-select>
    271. 

  271.                             </el-form-item>
    272. 

  272.                           </el-col>
    273. 

  273.                         </el-row>
    274. 

  274. 

  275.                         <el-row v-if="isSFZ && stdRegInfo.cert_no.length ==18">
    276. 

  276.                           <el-col :span="24">
    277. 

  277.                             <el-form-item label="出生日期" prop="std_birth">
    278. 

  278.                               <el-input v-model="stdRegInfo.std_birth" disabled></el-input>
    279. 

  279.                             </el-form-item>
    280. 

  280.                           </el-col>
    281. 

  281.                         
    282. 

  282.                         </el-row>
    283. 

  283. 

  284. 

  285.                         <el-row>
    286. 

  286.                           <el-col :span="24">
    287. 

  287.                             <el-form-item label="密码" prop="std_pass1">
    288. 

  288.                               <el-input type="password" v-model="stdRegInfo.std_pass1"></el-input>
    289. 

  289.                             </el-form-item>
    290. 

  290.                           </el-col>
    291. 

  291.                         </el-row>
    292. 

  292.                         <el-row>
    293. 

  293.                           <el-col :span="24">
    294. 

  294.                             <el-form-item label="确认密码" prop="std_pass2">
    295. 

  295.                               <el-input type="password" v-model="stdRegInfo.std_pass2"></el-input>
    296. 

  296.                             </el-form-item>
    297. 

  297.                           </el-col>
    298. 

  298.                         </el-row>
    299. 

  299. -->
    300. 

  300. 

  301.                         <el-row>
    302. 

  302.                           <el-col :span="20">
    303. 

  303.                             <div style="text-align: center;margin-bottom: 3px">
    304. 

  304.                               <el-form-item>
    305. 

  305.                                 <div style="margin-top: 10px;">
    306. 

  306.                                   <el-button type="primary" @click="onSubmit('old')"  v-if="checkOldStd">提交注册信息</el-button>
    307. 

  307.                                   <el-button @click="goLogin">返回登录页面</el-button>
    308. 

  308.                                 </div>
    309. 

  309. 

  310.                                 <!-- <div class="footer abs-bottom">
    311. 

  311.                                     <center>
    312. 

  312.                                       <font style="font-size: 15px">
    313. 

  313.                                           启明禾木软件 @ 2019
    314. 

  314.                                       </font>
    315. 

  315.                                     </center>
    316. 

  316.                                 </div> -->
    317. 

  317.                               </el-form-item>
    318. 

  318.                             </div>
    319. 

  319.                           </el-col>
    320. 

  320.                         </el-row>
    321. 

  321.                       </el-form>
    322. 

  322.                 </el-tab-pane>
    323. 

  323.               </el-tabs>
    324. 

  324.           </div>
    325. 

  325.         </center>
    326. 

  326.       </el-tabs>
    327. 

  327.     </el-card>
    328. 

  328. 

  329.     <el-dialog title="" width="400px" :visible.sync="dialogVisible">
    330. 

  330.       <el-form>
    331. 

  331.         <el-form-item label="新老生">
    332. 

  332.           <el-select size="medium" v-model="isNewStd" filterable clearable placeholder="请选择新老考生" @change="isNewStdChange" >
    333. 

  333.             <el-option  label="新生"  value="1"></el-option>
    334. 

  334.             <el-option  label="老生"  value="0"></el-option>
    335. 

  335.           </el-select>
    336. 

  336.         </el-form-item>
    337. 

  337. 

  338.         <el-form-item label="老准考证号" v-if="isNewStd==0">
    339. 

  339.            <el-input type="input" v-model="stdRegInfo.ticket_no_old"></el-input> &nbsp;
    340. 

  340.         </el-form-item>
    341. 

  341.         <center  v-if="isNewStd==0"><el-button @click="check()">验证</el-button></center>
    342. 

  342.       </el-form>
    343. 

  343.     </el-dialog>
    344. 

  344.     <el-dialog title="上传身份证正面" width="400px" :visible.sync="identifyOrc.ocrDialogVisible">
    345. 

  345.       <el-form>
    346. 

  346.         
    347. 

  347.         <el-form-item label="" style="margin-bottom: 0px;padding-bottom: 0px;">
    348. 

  348.           <input type="file" id="file" @change="uploadImg($event)" accept="image/jpg" style="width:100%;height: 100%;margin-bottom: 0px;padding-bottom: 0px;"></input> &nbsp;
    349. 

  349.         </el-form-item>
    350. 

  350.         <el-form-item label="">
    351. 

  351.           <div class="el-form-item">
    352. 

  352.             <div class="el-form-item__content">
    353. 

  353.               <div class="el-input el-input-group el-input-group--prepend">
    354. 

  354.                 <div class="el-input-group__prepend" style="padding-left: 15px;padding-right: 15px;color: black">
    355. 

  355.                   <i class="fa fa-hand-o-right fa-fw"></i>
    356. 

  356.                 </div>
    357. 

  357.                 <input v-model="identifyOrc.validateCode" maxlength="4" type="text" style="width:240px;" autocomplete="off" placeholder="校验码" class="el-input__inner">
    358. 

  358. 

  359.                   <img :src="validateCodesrc" @click="loadValidateCode" style="cursor:pointer; position: absolute;top: 0px;right: 0px;;height: 96%;width: 87px;">
    360. 

  360. 

  361.               </div>
    362. 

  362.             </div>
    363. 

  363.             
    364. 

  364.           </div>
    365. 

  365.         </el-form-item>
    366. 

  366. 

  367.         <center
    368. 

  368.         ><el-button type="primary" @click="uploadIndentify()">提交</el-button>
    369. 

  369.         </center>
    370. 

  370.       </el-form>
    371. 

  371.     </el-dialog>
    372. 

  372.   </div>
    373. 

  373. </body>
    374. 

  374. <!-- import Vue before Element -->
    375. 

  375. <!-- <script src="https://unpkg.com/vue/dist/vue.js"></script> -->
    376. 

  376. <script src="https://lib.baomitu.com/vue/2.5.17/vue.min.js"></script>
    377. 

  377. <!-- import JavaScript -->
    378. 

  378. <!-- <script src="https://unpkg.com/element-ui/lib/index.js"></script> -->
    379. 

  379. <script src="https://lib.baomitu.com/element-ui/2.4.11/index.js"></script>
    380. 

  380. 

  381. <script src="https://lib.baomitu.com/jquery/1.12.4/jquery.min.js"></script>
    382. 

  382. <script src="./vendor/jqueryPlugPop/plug-in.min.js"></script>
    383. 

  383. <script src="./js/tool.js"></script>
    384. 

  384. 

  385. 

  386. 

  387. <script>
    388. 

  388. 

  389.   new Vue({
    390. 

  390.     el: '#app',
    391. 

  391.     data: function () {
    392. 

  392. 

  393.       var validateSpecChar = function(rule, value, callback) {
    394. 

  394.         if(value && value.length>15){
    395. 

  395.           callback(new Error('请输入正确中文姓名且长度在15个字范围内!'));
    396. 

  396.         }
    397. 

  397.         //var regEn = /^[\u4e00-\u9fa5·\u36c3\u4DAE]{0,15}$/;
    398. 

  398.         var regEn =/^((?![\u3000-\u303F])[\u2E80-\uFE4F]|\·)*(?![\u3000-\u303F])[\u2E80-\uFE4F](\·)*$/;
    399. 

  399.         if (!regEn.test(value)) {
    400. 

  400.           callback(new Error('请输入正确中文姓名且长度在15个字范围内!'));
    401. 

  401.         } else {
    402. 

  402.           callback();
    403. 

  403.         }
    404. 

  404.       };
    405. 

  405. 

  406.       var validateConfirmPass = function(rule, value, callback) {
    407. 

  407.         var this_ = window['Vue'];
    408. 

  408.         var regex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,30}');
    409. 

  409.         // var regex = /^[A-Za-z0-9]{8,20}$/;
    410. 

  410.         // var regex =   new RegExp("^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$)^.{8,}$");
    411. 

  411.         
    412. 

  412.         if (value === '') {
    413. 

  413.           callback(new Error('请再次输入密码'));
    414. 

  414.         } else if (value !== this_.stdRegInfo.std_pass1) {
    415. 

  415.           callback(new Error('两次输入密码不一致!'));
    416. 

  416.         } else if (!regex.test(this_.stdRegInfo.std_pass1)) {
    417. 

  417.           callback(new Error('密码必须包含字母、数字、特殊字符至少8个字符!'));
    418. 

  418.           // callback();
    419. 

  419.         } else {
    420. 

  420.           //密码复杂度检查
    421. 

  421.           callback();
    422. 

  422.         }
    423. 

  423.       };
    424. 

  424. 

  425.       var validateConfirmPass1 = function(rule, value, callback) {
    426. 

  426.         var this_ = window['Vue'];
    427. 

  427.         var regex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,30}');
    428. 

  428.         // var regex = /^[A-Za-z0-9]{8,20}$/;
    429. 

  429.         // var regex =   new RegExp("^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$)^.{8,}$");
    430. 

  430.         
    431. 

  431.         if (value === '') {
    432. 

  432.           callback(new Error('请再次输入密码'));
    433. 

  433.         } else if (this_.stdRegInfo.std_pass2 && value !== this_.stdRegInfo.std_pass2) {
    434. 

  434.           callback(new Error('两次输入密码不一致!'));
    435. 

  435.         } else if (!regex.test(this_.stdRegInfo.std_pass1)) {
    436. 

  436.           callback(new Error('密码中必须包含字母、数字、特殊字符至少8个字符!'));
    437. 

  437.           // callback();
    438. 

  438.         } else {
    439. 

  439.           //密码复杂度检查
    440. 

  440.           callback();
    441. 

  441.         }
    442. 

  442.       };
    443. 

  443. 

  444.       var checkPhone = function(rule, value, callback) {
    445. 

  445.         if (!value) {
    446. 

  446.           callback(new Error('请输入联系电话'));
    447. 

  447.         } else {
    448. 

  448.           var reg = /^1[0|1|2|3|4|5|6|7|8|9][0-9]\d{8}$/
    449. 

  449.           console.log(reg.test(value));
    450. 

  450.           if (reg.test(value)) {
    451. 

  451.             callback();
    452. 

  452.           } else {
    453. 

  453.             callback(new Error('请输入正确的手机号'));
    454. 

  454.           }
    455. 

  455.         }
    456. 

  456.       };
    457. 

  457.       var checkNPostNumber = function(rule, value, callback) {
    458. 

  458.         if (value) {
    459. 

  459.           var reg = /^\d{6}$/;
    460. 

  460.           if (!reg.test(value)) {
    461. 

  461.             callback(new Error('请输入正确的6位邮政编码'));
    462. 

  462.           } else {
    463. 

  463.             callback();
    464. 

  464.           }
    465. 

  465.         } else {
    466. 

  466.           callback();
    467. 

  467.         }
    468. 

  468.       };
    469. 

  469. 

  470.       var validateCertNo = function(rule, value, callback) {
    471. 

  471.         if ((new RegExp(/^[a-zA-Z0-9]+$/g).test(value))) {
    472. 

  472.           callback();
    473. 

  473.         } else {
    474. 

  474.           callback(new Error('证件号只允许填数字和英文'));
    475. 

  475.         }
    476. 

  476.       }
    477. 

  477.       return {
    478. 

  478.         randomnum:null,
    479. 

  479.         validateCodesrc:null,
    480. 

  480.         validateCode_check:"",
    481. 

  481.         loading: false,
    482. 

  482.         loaded: false,
    483. 

  483.         dialogVisible:false,
    484. 

  484.         ticket_no_old:"",
    485. 

  485.         isNewStd:"1",
    486. 

  486.         checkOldStd: false,
    487. 

  487.         isSFZ:true,
    488. 

  488.         identifyOrc:{
    489. 

  489.           ocrDialogVisible:false,
    490. 

  490.           file:"",
    491. 

  491.           validateCode:"",
    492. 

  492.           orcSuccess:false,
    493. 

  493.         },
    494. 

  494.         stdRegInfo: {
    495. 

  495.           std_name: "",
    496. 

  496.           std_pass1: "",
    497. 

  497.           std_pass2: "",
    498. 

  498.           cert_no: "",
    499. 

  499.           std_sex: "",
    500. 

  500. 

  501. 

  502.           std_eng_name: "",
    503. 

  503.           political_status: "",
    504. 

  504.           std_nation: "",
    505. 

  505.           std_family_reg: "",
    506. 

  506.           school_id: "",
    507. 

  507.           std_edu: "",
    508. 

  508.           std_occupation: "",
    509. 

  509.           std_healthy: "",
    510. 

  510.           std_birth: "",
    511. 

  511.           major_id: "",
    512. 

  512.           major_code: "",
    513. 

  513.           major_name: "",
    514. 

  514.           std_mobile: "",
    515. 

  515.           std_postcode: "",
    516. 

  516.           std_address: "",
    517. 

  517.           email: "",
    518. 

  518.           remark: "",
    519. 

  519. 

  520.         },
    521. 

  521.         stdRegInfoRule: {
    522. 

  522.           std_name: [
    523. 

  523.             { required: true, message: '请输入姓名', trigger: 'blur' },
    524. 

  524.             { validator: validateSpecChar, trigger: ['blur', 'change'] },
    525. 

  525.           ],
    526. 

  526.           std_pass1: [
    527. 

  527.             { required: true, message: '请输入密码', trigger: 'blur' },
    528. 

  528.             { validator: validateConfirmPass1, trigger: 'blur' },
    529. 

  529.           ],
    530. 

  530.           std_pass2: [
    531. 

  531.             { required: true, message: '请输入确认密码', trigger: 'blur' },
    532. 

  532.             { validator: validateConfirmPass, trigger: 'blur' },
    533. 

  533.           ],
    534. 

  534.           cert_no: [
    535. 

  535.             { required: true, message: '请输入证件号码', trigger: 'blur' },
    536. 

  536.             { validator: validateCertNo, trigger: ['blur', 'change'] },
    537. 

  537.           ],
    538. 

  538.           std_sex: [
    539. 

  539.             { required: true, message: '请输入性别', trigger: 'blur' },
    540. 

  540.           ],
    541. 

  541.           // std_birth: [
    542. 

  542.           //   { required: true, message: '请输入出生日期', trigger: 'blur' },
    543. 

  543.           // ]
    544. 

  544.         },
    545. 

  545.         sexArray: [],
    546. 

  546.   
    547. 

  547.       }
    548. 

  548.     },
    549. 

  549.     mounted: function() {
    550. 

  550.       window['Vue'] = this;
    551. 

  551.       var _this = this;
    552. 

  552.       this.loading = true;
    553. 

  553.       // ajaxRequest("",'/std/stdRegInfo/init.htm',{},function(resp){
    554. 

  554.       //     if(resp.success){
    555. 

  555.       //       let map = resp.map;
    556. 

  556.       //       _this.majorArray = map.dict['majorArray'];
    557. 

  557.       //       _this.nationArray = map.dict['nationArray'];
    558. 

  558.       //       _this.occupationArray = map.dict['occupationArray'];
    559. 

  559.       //       _this.familyRegArray = map.dict['familyRegArray'];
    560. 

  560.       //       _this.politicalStatusArray = map.dict['politicalStatusArray'];
    561. 

  561.       //       _this.sexArray = map.dict['sexArray'];
    562. 

  562.       //       _this.healthyArray = map.dict['healthyArray'];
    563. 

  563.       //       _this.eduArray = map.dict['eduArray'];
    564. 

  564.       //       _this.orgArray = map.dict['orgArray'];
    565. 

  565.       //     }
    566. 

  566.       //     _this.loading = false;
    567. 

  567.       //   })
    568. 

  568. 

  569.       this.sexArray = [{ dict_name: "StdSexType", dict_value: "1", dict_text: "男", dict_order: 1 },{ dict_name: "StdSexType", dict_value: "2", dict_text: "女", dict_order: 2 }];
    570. 

  570.       this.loading = false;
    571. 

  571. 

  572.       // this.dialogVisible = true;
    573. 

  573.     },
    574. 

  574.     created: function() {
    575. 

  575.       var this_ = this;
    576. 

  576.       setTimeout( function(){
    577. 

  577.         // this_.loaded = true;
    578. 

  578.         document.getElementById("app").style.display="block";
    579. 

  579.       }, 500);
    580. 

  580.     },
    581. 

  581.     methods: {
    582. 

  582.       
    583. 

  583.       uploadIndentify:function(){
    584. 

  584.        
    585. 

  585.         if(!this.identifyOrc.file){
    586. 

  586.           $.Pop("请选择身份证照片!", 'alert', function () {});
    587. 

  587.           return;
    588. 

  588.         }
    589. 

  589.         if(!this.identifyOrc.validateCode){
    590. 

  590.           $.Pop("请填写校验码!", 'alert', function () {});
    591. 

  591.           return;
    592. 

  592.         }
    593. 

  593.         var this_ = this;
    594. 

  594.         ajaxRequest("", '/std/identifyOrc.htm', { file: this.identifyOrc.file,validateCode:this.identifyOrc.validateCode }, function (resp) {
    595. 

  595.           if(resp.success){
    596. 

  596.            
    597. 

  597.            // $.Pop("识别成功，如果信息有误请重新提交!", 'alert', function () {});
    598. 

  598.             this_.stdRegInfo.cert_no = resp.map.cert_no;
    599. 

  599.             this_.stdRegInfo.std_sex = resp.map.std_sex;
    600. 

  600.            // this_.stdRegInfo.std_nation = resp.map.std_nation;
    601. 

  601.             if( this_.stdRegInfo.cert_no && this_.stdRegInfo.cert_no.length == 18){
    602. 

  602.               //生日
    603. 

  603.               this_.stdRegInfo.std_birth  = this_.stdRegInfo.cert_no.substring(6,14);
    604. 

  604.               //性别 
    605. 

  605.               this_.stdRegInfo.std_sex = (parseInt(this_.stdRegInfo.cert_no.substring(16,17)) % 2) == 1?"1":"2";
    606. 

  606.               this_.stdRegInfo.cert_no = this_.stdRegInfo.cert_no.toUpperCase();
    607. 

  607.             }
    608. 

  608.             this_.stdRegInfo.std_name = resp.map.std_name;
    609. 

  609.             this_.stdRegInfo.std_address = resp.map.std_address;
    610. 

  610.             this_.identifyOrc.orcSuccess=true;
    611. 

  611.             this_.identifyOrc.ocrDialogVisible=false;
    612. 

  612.           }else{
    613. 

  613.             $.Pop(resp.errorMsg, 'alert', function () {});
    614. 

  614.             this_.loadValidateCode();
    615. 

  615.           }
    616. 

  616.         })
    617. 

  617.       },
    618. 

  618.       uploadImg:function(e) {
    619. 

  619.         let _this = this;
    620. 

  620.         //上传图片
    621. 

  621.         let file = e.target.files[0];
    622. 

  622.         _this.fileName = file.name;
    623. 

  623.         if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG)$/.test(e.target.value)) {
    624. 

  624.           this.alert("图片类型必须是.gif,jpeg,jpg,png,bmp中的一种", "信息提示");
    625. 

  625.           return false;
    626. 

  626.         }
    627. 

  627.         
    628. 

  628.         let reader = new FileReader();
    629. 

  629.         reader.onload = function(e) {
    630. 

  630.          
    631. 

  631.           _this.identifyOrc.file = e.target.result;
    632. 

  632.         };
    633. 

  633.         // 转化为base64
    634. 

  634.         reader.readAsDataURL(file)
    635. 

  635.       },
    636. 

  636.       loadValidateCode:function() {
    637. 

  637.           this.randomnum = Date.parse(new Date());
    638. 

  638.           this.validateCodesrc= basePath + "/std/validateCode.htm?"+this.randomnum;
    639. 

  639.       },
    640. 

  640.       cardOcr:function(){
    641. 

  641.         this.identifyOrc.ocrDialogVisible=true;
    642. 

  642.         this.loadValidateCode();
    643. 

  643.       },
    644. 

  644.       initParam: function(){
    645. 

  645.         this.ticket_no_old = "";
    646. 

  646.         this.stdRegInfo.std_name = ""
    647. 

  647.         this.stdRegInfo.old_ticket_no1 = "";
    648. 

  648.         this.stdRegInfo.old_ticket_no2 = "";
    649. 

  649.         this.checkOldStd = false;
    650. 

  650.       },
    651. 

  651.       switchNewOld: function(){
    652. 

  652.         this.stdRegInfo.old_ticket_no1 = "";
    653. 

  653.         this.stdRegInfo.old_ticket_no2 = "";
    654. 

  654.       },
    655. 

  655. 

  656.       check: function(){
    657. 

  657.         if(!this.ticket_no_old){
    658. 

  658.           $.Pop("请填写老转考证号!", 'alert', function () {});
    659. 

  659.           return;
    660. 

  660.         }
    661. 

  661.         
    662. 

  662.         var this_ = this;
    663. 

  663.         ajaxRequest("", '/std/checkOldTicketNo.htm', { ticket_no_old: this.ticket_no_old }, function (resp) {
    664. 

  664.          
    665. 

  665.           if(resp.success){
    666. 

  666.             if(!resp.entity) {
    667. 

  667.               $.Pop("无该准考证号相关信息,请求重新填写!", 'alert', function () {});
    668. 

  668.               return;
    669. 

  669.             }
    670. 

  670.           
    671. 

  671.             this_.stdRegInfo.std_name = resp.entity.xingming.trim();
    672. 

  672.             this_.stdRegInfo.old_ticket_no1 = resp.entity.kaohao?resp.entity.kaohao.trim():"";
    673. 

  673.             this_.stdRegInfo.old_ticket_no2 = resp.entity.jiukaohao?resp.entity.jiukaohao.trim():"";
    674. 

  674.             this_.checkOldStd = true;
    675. 

  675.           }else{
    676. 

  676.             this_.checkOldStd = false;
    677. 

  677.             $.Pop(resp.errorMsg, 'alert', function () {});
    678. 

  678.           }
    679. 

  679.         })
    680. 

  680. 

  681.       },
    682. 

  682.       cert_no_blur: function(){
    683. 

  683.         if(this.isSFZ == true){
    684. 

  684.           this.isSFZChange(true);
    685. 

  685.         }
    686. 

  686.       },
    687. 

  687.       isNewStdChange: function(val){
    688. 

  688.         
    689. 

  689.       },
    690. 

  690. 

  691.       //身份证规则验证
    692. 

  692.       isSFZChange: function(val){
    693. 

  693.         if(val == true){
    694. 

  694.           if( this.stdRegInfo.cert_no && this.stdRegInfo.cert_no.length == 18){
    695. 

  695.             //生日
    696. 

  696.             this.stdRegInfo.std_birth  = this.stdRegInfo.cert_no.substring(6,14);
    697. 

  697.             //性别 
    698. 

  698.             this.stdRegInfo.std_sex = (parseInt(this.stdRegInfo.cert_no.substring(16,17)) % 2) == 1?"1":"2";
    699. 

  699.             this.stdRegInfo.cert_no = this.stdRegInfo.cert_no.toUpperCase();
    700. 

  700.           }
    701. 

  701. 

  702.           
    703. 

  703.         }
    704. 

  704.       },
    705. 

  705. 

  706.       majorChange: function(major_id, o1, o2) {
    707. 

  707.         if (!major_id) return;
    708. 

  708.         for (var i = 0; i < this.majorArray.length; i++) {
    709. 

  709.           var item = this.majorArray[i];
    710. 

  710.           if (item.id == major_id) {
    711. 

  711.             this.stdRegInfo.major_name = item.major_name
    712. 

  712.             this.stdRegInfo.major_code = item.major_code
    713. 

  713.           }
    714. 

  714.         }
    715. 

  715. 

  716.       },
    717. 

  717.       schoolIdChange: function(schoolId, o1, o2) {
    718. 

  718.         this.assistOrgArray = [];
    719. 

  719.         //非社会考生查询助学班
    720. 

  720.         if (!schoolId && (schoolId + "") != "99999999") return;
    721. 

  721.         var _this = this;
    722. 

  722.         ajaxRequest("", '/std/assistListAll.htm', { pid: schoolId }, function (resp) {
    723. 

  723.           _this.assistOrgArray = resp.array;
    724. 

  724.         })
    725. 

  725.       },
    726. 

  726.       validateForm: function() {
    727. 

  727.         this.$refs['stdRegInfo'].validate(function(valid) {
    728. 

  728.           if (valid) {
    729. 

  729.             return true;
    730. 

  730.           } else {
    731. 

  731.             console.log('error submit!!');
    732. 

  732.             return false;
    733. 

  733.           }
    734. 

  734.         });
    735. 

  735.       },
    736. 

  736.       goLogin: function() {
    737. 

  737.         window.location.href = "./login.html";
    738. 

  738.       },
    739. 

  739.       onSubmit: function(type) {
    740. 

  740.         if(this.isSFZ == true && this.stdRegInfo.cert_no.length !=18){
    741. 

  741.           if(this.stdRegInfo.cert_no.length == 0){
    742. 

  742.             $.Pop("请填写证件号码!", 'alert', function () {});
    743. 

  743.           }else{
    744. 

  744.             $.Pop("身份证号只能填写18位!", 'alert', function () {});
    745. 

  745.           }
    746. 

  746.           
    747. 

  747.           return;
    748. 

  748.         }
    749. 

  749.         this.$refs['stdRegInfo'].validate(function(valid) {
    750. 

  750.           var this_ = window['Vue'];
    751. 

  751.           if (valid) {
    752. 

  752.             //clone对象
    753. 

  753.             var stdRegInfo = JSON.parse(JSON.stringify(this_.stdRegInfo));
    754. 

  754.             //MD5密码加密
    755. 

  755.             stdRegInfo['std_pass'] = hex_md5(stdRegInfo['std_pass1']);
    756. 

  756. 

  757.             if(this_.isSFZ == true){
    758. 

  758.               stdRegInfo['cert_type'] = 1;
    759. 

  759.             }else{
    760. 

  760.               stdRegInfo['cert_type'] = 0;
    761. 

  761.             }
    762. 

  762.             //删除过程数据
    763. 

  763.             delete stdRegInfo['std_pass1'];
    764. 

  764.             delete stdRegInfo['std_pass2'];
    765. 

  765. 

  766.             if(type == 'new'){
    767. 

  767.               delete stdRegInfo['old_ticket_no1'];
    768. 

  768.               delete stdRegInfo['old_ticket_no2'];
    769. 

  769.             }
    770. 

  770. 

  771.             // 图像识别出的身份证，证件类型是身份证不允许修改
    772. 

  772.             if(type == 'new' && this_.identifyOrc && this_.identifyOrc.orcSuccess && this_.identifyOrc.orcSuccess==true){
    773. 

  773.               stdRegInfo['cert_type'] = 1;
    774. 

  774. 

  775.             }
    776. 

  776. 

  777.             $('#sbt').hide();
    778. 

  778.             ajaxRequest("", '/std/stdRegInfo/reg.htm', stdRegInfo, function (resp) {
    779. 

  779.               
    780. 

  780.               if (resp.success) {
    781. 

  781.                 $('#sbt').show();
    782. 

  782.                 //提示注册成功 跳转登录页面
    783. 

  783.                 $.Pop('注册保存成功,即将跳转登录页面', 'alert', function () {
    784. 

  784.                   setTimeout(function() {
    785. 

  785.                     window.location.href = "./login.html";
    786. 

  786.                   }, 300);
    787. 

  787.                 })
    788. 

  788.               } else {
    789. 

  789.                 $('#sbt').show();
    790. 

  790.                 $.Pop(resp.errorMsg, 'alert', function () {
    791. 

  791. 

  792.                 });
    793. 

  793.               }
    794. 

  794.             })
    795. 

  795.           } else {
    796. 

  796.             console.log('error submit!!');
    797. 

  797.           }
    798. 

  798.         });
    799. 

  799. 

  800.       }
    801. 

  801.     }
    802. 

  802.   });
    803. 

  803. </script>
    804. 

  804. 

  805. 

  806. <style scoped>
    807. 

  807.   .footer {
    808. 

  808.     height: 30px;
    809. 

  809.   }
    810. 

  810. 

  811.   .abs-bottom {
    812. 

  812.     width: 100%;
    813. 

  813.     position: absolute;
    814. 

  814.     bottom: 0;
    815. 

  815.     left: 0;
    816. 

  816.     right: 0;
    817. 

  817.     margin-bottom: 5px
    818. 

  818.   }
    819. 

  819. 

  820.   #particles-js {
    821. 

  821.     position: absolute;
    822. 

  822.     top: 0;
    823. 

  823.     left: 0;
    824. 

  824.     right: 0;
    825. 

  825.     bottom: 0;
    826. 

  826.   }
    827. 

  827. 

  828.   .particles-js-canvas-el {
    829. 

  829.     background-color: aliceblue
    830. 

  830.   }
    831. 

  831. 

  832.   .btn-long {
    833. 

  833.     width: 100%;
    834. 

  834.   }
    835. 

  835. 

  836. 

  837.   .el-select {
    838. 

  838.     width: 100%;
    839. 

  839.   }
    840. 

  840. 

  841.   .el-card__header {
    842. 

  842.     padding: 8px 8px !important;
    843. 

  843.   }
    844. 

  844. 

  845.   body {
    846. 

  846.     background-color: #F3F3F3;
    847. 

  847.   }
    848. 

  848. 

  849.   .el-checkbox__inner{
    850. 

  850.     vertical-align: text-top !important;
    851. 

  851.   }
    852. 

  852.   .el-checkbox__input{
    853. 

  853.     margin-bottom: 6px !important;
    854. 

  854.   }
    855. 

  855. 

  856.   .el-alert--warning {
    857. 

  857.     background-color: #fdf6ec !important;
    858. 

  858.     color: #e6a23c;
    859. 

  859.   }
    860. 

  860.   .el-alert {
    861. 

  861.     margin: 20px 0 0;
    862. 

  862.   }
    863. 

  863.   .el-alert {
    864. 

  864.     width: 100%;
    865. 

  865.     padding: 8px 16px;
    866. 

  866.     margin: 0;
    867. 

  867.     box-sizing: border-box;
    868. 

  868.     border-radius: 4px;
    869. 

  869.     position: relative;
    870. 

  870.     background-color: #fff;
    871. 

  871.     overflow: hidden;
    872. 

  872.     opacity: 1;
    873. 

  873.     display: flex;
    874. 

  874.     align-items: center;
    875. 

  875.     transition: opacity .2s;
    876. 

  876.   }
    877. 

  877.   .el-tabs__nav{
    878. 

  878.     width: 100% !important
    879. 

  879.   }
    880. 

  880.   .el-tabs__item{
    881. 

  881.     width: 50% !important
    882. 

  882.   }
    883. 

  883.   .el-input__icon{
    884. 

  884.     height:14px !important
    885. 

  885.   }
    886. 

  886. 

  887.   .el-icon-arrow-up{
    888. 

  888.     background: url(../image/icon/up.png) !important;
    889. 

  889.     background-repeat: no-repeat !important;
    890. 

  890.     margin-right: 2px !important;
    891. 

  891.     background-position: center !important;
    892. 

  892.     margin-top: 14px !important;
    893. 

  893.   }
    894. 

  894. 

  895.   
    896. 

  896. </style>
    897. 

  897. 

  898. </html>
    899.