SecurityVerify.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275
  1. <template>
  2. <div>
  3. <nav-bar path="index"/>
  4. <div class='card'>
  5. <h3><strong>个人资料</strong></h3>
  6. <van-cell-group :border="false">
  7. <van-field
  8. v-model="phone"
  9. required
  10. clearable
  11. label="手机号"
  12. placeholder="请输入手机号"
  13. :error="phoneError"
  14. @click="phoneError=false"
  15. />
  16. <van-field
  17. v-model="sms"
  18. center
  19. clearable
  20. label="短信验证码"
  21. placeholder="请输入短信验证码"
  22. required
  23. disabled
  24. >
  25. <van-button slot="button" size="small" type="primary">发送验证码</van-button>
  26. </van-field>
  27. <van-field
  28. v-model="username"
  29. required
  30. clearable
  31. label="昵称"
  32. placeholder="请输入昵称"
  33. maxlength="12"
  34. :error="usernameError"
  35. @click="usernameError=false"
  36. />
  37. <van-field
  38. v-model="wechat"
  39. required
  40. clearable
  41. label="微信号"
  42. placeholder="请输入微信号"
  43. maxlength="20"
  44. :error="wechatError"
  45. @click="wechatError=false"
  46. />
  47. </van-cell-group>
  48. <p>性别</p>
  49. <van-radio-group v-model="radio">
  50. <van-radio name="0" checked-color="#fd6740" style="float: left; margin-right: 20px">男</van-radio>
  51. <van-radio name="1" checked-color="#fd6740">女</van-radio>
  52. </van-radio-group>
  53. <p>宿舍区</p>
  54. <van-button size="large" @click="show = true">{{dormitory}}</van-button>
  55. <van-actionsheet
  56. v-model="show"
  57. :actions="actions"
  58. cancel-text="取消"
  59. @select="onSelect"
  60. />
  61. </div>
  62. <div class="card" style="margin-bottom: 70px">
  63. <p>上传校卡照片</p>
  64. <div style="margin-bottom: 10px">
  65. <add-photo @onRead="onRead"/>
  66. <van-button
  67. class="submit_button"
  68. type="primary"
  69. @click="next"
  70. :loading="loading"
  71. >下一步
  72. </van-button>
  73. </div>
  74. <p>活动仅允许深大学生参与,请上传正面校卡照片审核~</p>
  75. </div>
  76. </div>
  77. </template>
  78. <script>
  79. import {BasicFunction} from "../connector/basic-service";
  80. import NavBar from '../components/navBar';
  81. import {
  82. Uploader, Icon,
  83. CellGroup, Field,
  84. RadioGroup, Radio,
  85. Picker,
  86. Button,
  87. Actionsheet,
  88. Toast
  89. } from 'vant';
  90. import AddPhoto from "../components/addPhoto";
  91. export default {
  92. name: "SecurityVerify",
  93. components: {
  94. AddPhoto,
  95. NavBar,
  96. [Uploader.name]: Uploader, [Icon.name]: Icon,
  97. [CellGroup.name]: CellGroup, [Field.name]: Field,
  98. [RadioGroup.name]: RadioGroup, [Radio.name]: Radio,
  99. [Picker.name]: Picker,
  100. [Button.name]: Button,
  101. [Actionsheet.name]: Actionsheet
  102. },
  103. data() {
  104. return {
  105. phone: '',
  106. phoneError: false,
  107. sms: '',
  108. username: '',
  109. usernameError: false,
  110. wechat: '',
  111. wechatError: false,
  112. radio: '0',
  113. show: false,
  114. dormitory: '点击选择宿舍区',
  115. dorId: -1,
  116. actions: [
  117. {id: 0, name: '斋区'},
  118. {id: 1, name: '西南'},
  119. {id: 2, name: '南区'},
  120. {id: 3, name: '西丽'}
  121. ],
  122. photo: null,
  123. loading: false
  124. };
  125. },
  126. methods: {
  127. next() {
  128. this.loading = true;
  129. // 检查输入
  130. if (this.phone.length !== 11) {
  131. this.phoneError = true;
  132. this.loading = false;
  133. return;
  134. } else if (this.username.length < 1) {
  135. this.usernameError = true;
  136. this.loading = false;
  137. return;
  138. } else if (this.wechat.length < 6) {
  139. this.wechatError = true;
  140. Toast.fail('请输入正确格式的微信号');
  141. this.loading = false;
  142. return;
  143. } else if (this.dorId === -1) {
  144. Toast.fail('请选择宿舍区');
  145. this.loading = false;
  146. return;
  147. } else if (this.photo === null) {
  148. Toast.fail('请上传校卡正面照片');
  149. this.loading = false;
  150. return;
  151. }
  152. let that = this;
  153. console.log('------- photo -------');
  154. console.log(this.photo);
  155. let formData = new FormData();
  156. formData.append('file', this.photo);
  157. BasicFunction.get_data("fileserver/upload?sign=abcdefg", function (res) {
  158. console.log('----- upload photo result -----');
  159. console.log(res);
  160. if (res.ret === '10000') {
  161. let imgURL = res.model; // TODO: 把imgurl也加入用户信息
  162. let userId = localStorage.getItem('frontend-userid');
  163. let useridentity = {
  164. reviewId: "",
  165. userId: userId,
  166. userWxAccount: that.wechat,
  167. dormDistrict: that.dorId,
  168. userSex: parseInt(that.radio),
  169. userSchoolCard: 111111,
  170. userSchoolCardPic: imgURL,
  171. userReviewStatus: 0,
  172. reviewerId: 1,
  173. reviewerNote: "nmo",
  174. reviewerNoteToUser: "noo"
  175. };
  176. console.log('----- User Identity -----');
  177. BasicFunction.get_data("smartIdentity/saveBatch", function (response) {
  178. console.log(useridentity);
  179. console.log(response);
  180. if (response.ret === "10000") {
  181. console.log('----- User Info -----');
  182. BasicFunction.get_data('smartUsers/list?uid=' + userId, function (res) {
  183. console.log(res);
  184. if (res.ret === '10000') {
  185. let user = res.model.list[0];
  186. user.name = that.username;
  187. user.phone = that.phone;
  188. console.log('----- Update User Info -----');
  189. console.log(user);
  190. BasicFunction.get_data('smartUsers/updateBatch', function (res) {
  191. console.log(res);
  192. if (res.ret === '10000') {
  193. Toast.success("注册成功");
  194. that.$router.push('presentRegister');
  195. } else {
  196. Toast.fail('注册失败');
  197. that.loading = false;
  198. }
  199. }, [user]);
  200. } else {
  201. Toast.fail('获取用户信息失败');
  202. that.loading = false;
  203. }
  204. }, {});
  205. } else {
  206. Toast.fail("注册失败,请检查网络");
  207. that.loading = false;
  208. }
  209. }, [useridentity]);
  210. } else {
  211. Toast.fail('上传图片失败,请检查网络');
  212. that.loading = false;
  213. }
  214. }, formData);
  215. },
  216. onSelect(item) {
  217. // 点击选项时默认不会关闭菜单,可以手动关闭
  218. this.show = false;
  219. this.dormitory = item.name;
  220. this.dorId = item.id;
  221. },
  222. onRead(e) {
  223. this.photo = e;
  224. }
  225. },
  226. created: function () {
  227. let userid = localStorage.getItem('frontend-userid');
  228. let that = this;
  229. BasicFunction.get_data('smartUsers/list?uid=' + userid, function (res) {
  230. console.log('----- User Info ----- ' + userid);
  231. console.log(res);
  232. if (res.ret === '10000') {
  233. if (res.model.list[0].phone.length !== 0) that.$router.push('presentRegister');
  234. }
  235. }, {});
  236. }
  237. }
  238. </script>
  239. <style scoped>
  240. p, h3 {
  241. color: #fd6740;
  242. }
  243. h3 {
  244. padding: 5px;
  245. border-bottom: solid 1px #e4e4e4;
  246. }
  247. .card {
  248. background-color: white;
  249. margin: 20px 20px;
  250. border: solid 1px #e4e4e4;
  251. padding: 15px;
  252. text-align: left;
  253. }
  254. .submit_button {
  255. margin-bottom: 10px;
  256. margin-left: auto;
  257. margin-right: auto;
  258. position: fixed;
  259. bottom: 0;
  260. left: 0;
  261. right: 0;
  262. background-color: #fd6740;
  263. border-color: #fd6740;
  264. width: 85%;
  265. }
  266. </style>