applystudio.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432
  1. <template>
  2. <view>
  3. <public-module></public-module>
  4. <view class="box" :style="{background:`url(${indexBackgroundImage})`,backgroundSize: 'contain',backgroundRepeat: 'no-repeat'}">
  5. <view class="box-con">
  6. <uni-forms :value="personData" ref="personData" validate-trigger="bind"
  7. err-show-type="toast" label-width="100" :rules="rules" >
  8. <uni-forms-item label="姓名" name="name" required >
  9. <input class="uni-input-input textColor" placeholder="输入姓名" v-model="personData.name"
  10. placeholder-style="font-size:28upx" />
  11. </uni-forms-item>
  12. <uni-forms-item label="手机号" required name="mobile">
  13. <input class="uni-input-input textColor" maxlength="11" placeholder="输入手机号" v-model="personData.mobile"
  14. placeholder-style="font-size:28upx" />
  15. </uni-forms-item>
  16. <uni-forms-item label="证件号" required name="identity">
  17. <input class="uni-input-input textColor" placeholder="输入证件号" v-model="personData.identity"
  18. placeholder-style="font-size:28upx" />
  19. </uni-forms-item>
  20. <uni-forms-item label="密码" required name="password">
  21. <input class="uni-input-input textColor" placeholder="输入密码" v-model="personData.password"
  22. placeholder-style="font-size:28upx" />
  23. </uni-forms-item>
  24. <uni-forms-item label="地址" required name="address">
  25. <input class="uni-input-input textColor" placeholder="输入地址" v-model="personData.address"
  26. placeholder-style="font-size:28upx" />
  27. </uni-forms-item>
  28. </uni-forms>
  29. </view>
  30. </view>
  31. <!-- <view class="box-con" style="margin-top:10px">
  32. <uni-forms :rules="carRules" :value="personData" ref="personData" validate-trigger="bind"
  33. err-show-type="toast" label-width="100">
  34. <uni-forms-item label="开户行">
  35. <input class="uni-input-input textColor" placeholder="输入开户行" v-model="personData.bankName"
  36. placeholder-style="font-size:28upx" />
  37. </uni-forms-item>
  38. <uni-forms-item label="开户账号">
  39. <input class="uni-input-input textColor" placeholder="输入开户账号" v-model="personData.accountno"
  40. placeholder-style="font-size:28upx" />
  41. </uni-forms-item>
  42. <view >
  43. <view>银行卡照片</view>
  44. <view class="dis j-c" >
  45. <image style="height: 95px;width: 150px;padding: 10px 0;" :src=" userfrontImg?userfrontImg:'/static/image/my/yinhangka.png'" mode=""
  46. @click="userfrontChange"></image>
  47. </view>
  48. </view>
  49. </uni-forms>
  50. </view> -->
  51. <view class="userBox" style="margin-top:10px">
  52. <text>身份证件照</text>
  53. <view class="dis j-s" style="margin: 10px 0;">
  54. <view class="imgOcr-border">
  55. <image :src=" userfrontImg?userfrontImg:'/static/image/my/shenfenzz.png'" mode=""
  56. @click="userfrontChange"></image>
  57. <view>人像面</view>
  58. </view>
  59. <view class="imgOcr-border">
  60. <image :src="userbackImg?userbackImg:'/static/image/my/shenzf.png'" mode=""
  61. @click="userbackChange"></image>
  62. <view>国徽面</view>
  63. </view>
  64. </view>
  65. </view>
  66. <!-- <view class="userBox">
  67. <uni-forms :rules="carRules" :value="personData" ref="personData" validate-trigger="bind"
  68. err-show-type="toast" label-width="100">
  69. <uni-forms-item label="选择来源" required name="deptSourceName">
  70. <u-input v-model="personData.deptSourceName" type="select" :select-open="energyTypeShow"
  71. @click="energyTypeShow = true" :custom-style="{textAlign:'right'}"
  72. placeholder-style="color:#808080" placeholder="请选择来源" />
  73. <u-select mode="single-column" :list="energyTypeoptions" v-model="energyTypeShow"
  74. label-name="lable" value-name="value"
  75. @confirm="dictionaryConfirm($event)"></u-select>
  76. </uni-forms-item>
  77. <uni-forms-item label="机构类型" required name="deptName">
  78. <u-input v-model="personData.deptName" type="select" :select-open="deptShow"
  79. @click="deptShow = true" :custom-style="{textAlign:'right'}"
  80. placeholder-style="color:#808080" placeholder="请选择机构类型" />
  81. <u-select mode="single-column" :list="deptoptions" v-model="deptShow"
  82. label-name="lable" value-name="value"
  83. @confirm="deptConfirm($event)"></u-select>
  84. </uni-forms-item>
  85. </uni-forms>
  86. </view> -->
  87. <!-- <view class="userBox">
  88. <u-checkbox v-model="checked"></u-checkbox>
  89. <text>同时创建我的团队</text>
  90. </view> -->
  91. <view class="submit" @click="submit('personData')">
  92. 提交
  93. </view>
  94. </view>
  95. </template>
  96. <script>
  97. // import {
  98. // mapState,
  99. // mapMutations
  100. // } from "vuex"
  101. // import store from '@/store';
  102. import indexBackgroundImage from "@/static/shenqing.png"
  103. export default {
  104. // computed: {
  105. // ...mapState(['userInfo' ]),
  106. // },
  107. data(){
  108. return {
  109. indexBackgroundImage:indexBackgroundImage,
  110. rules: {
  111. name:{
  112. rules: [{
  113. required: true,
  114. errorMessage: '姓名不能为空'
  115. }]
  116. },
  117. mobile:{
  118. rules: [{
  119. required: true,
  120. errorMessage: '请输入手机号',
  121. },
  122. {
  123. pattern: /^1[3-9]\d{9}$/,
  124. errorMessage: '请输入正确的手机号',
  125. }]
  126. },
  127. identity:{
  128. rules: [{
  129. required: true,
  130. errorMessage: '请输入身份证号',
  131. },
  132. {
  133. pattern: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/,
  134. errorMessage: '请输入正确的身份证号',
  135. }]
  136. },
  137. password:{
  138. rules: [{
  139. required: true,
  140. errorMessage: '请输入密码'
  141. }]
  142. },
  143. address:{
  144. rules: [{
  145. required: true,
  146. errorMessage: '请输入地址',
  147. }]
  148. },
  149. },
  150. energyTypeShow:false,
  151. deptShow:false,
  152. deptoptions:[
  153. {
  154. lable:'股份',
  155. value:'gufen'
  156. },{
  157. lable:'直营',
  158. value:'dir'
  159. },{
  160. lable:'加盟',
  161. value:'jiameng'
  162. }],
  163. energyTypeoptions:[
  164. {
  165. lable:'渠道',
  166. value:'1'
  167. },{
  168. lable:'个代',
  169. value:'2'
  170. }],
  171. checked:false,
  172. userfrontImg: "",
  173. userbackImg: "",
  174. personData:{
  175. name:'',
  176. mobile:'',
  177. identity:'',
  178. password:'',
  179. address:'',
  180. esmUserImageVo:[]
  181. },
  182. deptSource:'',
  183. userId:''
  184. }
  185. },
  186. async onLoad(e) {
  187. this.deptSource=e.deptSource?e.deptSource:''
  188. this.userId=e.userId?e.userId:''
  189. if(e.id){
  190. this.id=e.id
  191. this.$http.get('/user/' +e.id).then(res=>{
  192. if(res.code==200){
  193. this.personData={...res.data.sysUser,esmUserImageVo:[]}
  194. }
  195. else{
  196. uni.showModal({
  197. showCancel: false,
  198. title: res.msg
  199. })
  200. }
  201. })
  202. }
  203. },
  204. methods:{
  205. submit(){
  206. this.$refs.personData.validate().then(res => {
  207. if(this.id){
  208. this.$http.post('/user/updateUserInfo1/' +this.id, {
  209. esmUserImageVo: this.personData.esmUserImageVo,
  210. sysUser: this.personData,
  211. sysUserInfo:this.personData,
  212. }).then(res=>{
  213. if(res.code==200){
  214. let obj = JSON.stringify(res.data);
  215. uni.redirectTo({
  216. url: "/pages/index/result?data="+obj
  217. })
  218. }
  219. else{
  220. uni.showModal({
  221. showCancel: false,
  222. title: res.msg
  223. })
  224. }
  225. })
  226. }else{
  227. this.$http.post('/user/saveUserInfoByPartner', {
  228. isPartner:"1",
  229. sysUser:{...this.personData,roleId:"22",referrerId:this.userId,type:2,deptSource:this.deptSource},
  230. esmUserImageVo:this.personData.esmUserImageVo
  231. }).then(res=>{
  232. if(res.code==200){
  233. let obj = JSON.stringify(res.data);
  234. uni.redirectTo({
  235. url: "/pages/index/result?data="+obj
  236. })
  237. }
  238. else{
  239. uni.showModal({
  240. showCancel: false,
  241. title: res.msg
  242. })
  243. }
  244. })
  245. }
  246. }).catch(err => {
  247. console.log('err', err);
  248. })
  249. },
  250. // submit(){
  251. // uni.redirectTo({
  252. // url: "/pages/index/result?key="+encodeURIComponent(JSON.stringify({status:2}))
  253. // // url: "/pages/index/result?status=1&remark=111"
  254. // })
  255. // // this.$refs.personData.validate().then(res => {
  256. // this.$refs.baseForm.submit().then(res => {
  257. // this.$http.post('/user/saveUserInfo', {
  258. // isPartner:"1",
  259. // sysUser:{...this.personData,roleId:"22",referrerId:this.userInfo.sysUser.userId,type:2,deptSource:this.deptSource},
  260. // esmUserImageVo:this.personData.esmUserImageVo
  261. // }).then(res=>{
  262. // if(res.code==200){
  263. // uni.redirectTo({
  264. // url: "/pages/index/result?key="+encodeURIComponent(JSON.stringify({status:1}))
  265. // })
  266. // }
  267. // else{
  268. // uni.showModal({
  269. // showCancel: false,
  270. // title: res.msg
  271. // })
  272. // // uni.showToast({
  273. // // title: res.msg
  274. // // })
  275. // }
  276. // })
  277. // // if (data.code == '200') {
  278. // // }
  279. // }).catch(err => {
  280. // console.log('err', err);
  281. // })
  282. // },
  283. dictionaryConfirm(val){
  284. this.personData.deptSourceName=val[0].label
  285. this.personData.deptSource=val[0].value
  286. },
  287. deptConfirm(val){
  288. this.personData.deptName=val[0].label
  289. this.personData.deptType=val[0].value
  290. },
  291. async userfrontChange() {
  292. // this.personData.esmUserImageVo[0]={}
  293. let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
  294. count: 1,
  295. sizeType: ['compressed']
  296. });
  297. let size = chooseImageRes.tempFiles[0].size / 1024 / 1024 < 5;
  298. if (!size) {
  299. this.$refs.uToast.show({
  300. title: '上传图片大小不能超过 5MB!',
  301. type: 'error',
  302. })
  303. return false
  304. }
  305. if (chooseImageRes) {
  306. this.userfrontImg = chooseImageRes.tempFilePaths[0];
  307. uni.uploadFile({
  308. url: this.$base.baseUrl + '/ins/taskImage/uploadFileByPartner',
  309. filePath: chooseImageRes.tempFilePaths[0],
  310. name: "multipartFile",
  311. formData: {
  312. 'type': 'image',
  313. },
  314. // header: {
  315. // Authorization: store.state.token,
  316. // },
  317. success: (imgRes) => {
  318. let data = JSON.parse(imgRes.data);
  319. if (data.code == '200') {
  320. this.personData.esmUserImageVo.push(
  321. {
  322. imageId: data.data.id,
  323. type: "SFZ_01",
  324. }
  325. )
  326. // this.personData.esmUserImageVo[0]={
  327. // imageId: data.data.id,
  328. // type: "SFZ_01",
  329. // }
  330. }
  331. }
  332. });
  333. }
  334. },
  335. async userbackChange() {
  336. // this.personData.esmUserImageVo[1]={}
  337. let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
  338. count: 1,
  339. sizeType: ['compressed']
  340. });
  341. let size = chooseImageRes.tempFiles[0].size / 1024 / 1024 < 5;
  342. if (!size) {
  343. this.$refs.uToast.show({
  344. title: '上传图片大小不能超过 5MB!',
  345. type: 'error',
  346. })
  347. return false
  348. }
  349. if (chooseImageRes) {
  350. this.userbackImg = chooseImageRes.tempFilePaths[0];
  351. uni.uploadFile({
  352. url: this.$base.baseUrl + '/ins/taskImage/uploadFileByPartner',
  353. filePath: chooseImageRes.tempFilePaths[0],
  354. name: "multipartFile",
  355. formData: {
  356. 'type': 'image',
  357. },
  358. // header: {
  359. // Authorization: store.state.token,
  360. // },
  361. success: (imgRes) => {
  362. let data = JSON.parse(imgRes.data);
  363. if (data.code == '200') {
  364. // this.personData.esmUserImageVo[1]=data.data
  365. this.personData.esmUserImageVo.push(
  366. {
  367. imageId: data.data.id,
  368. type: "SFZ_02",
  369. }
  370. )
  371. }
  372. }
  373. });
  374. }
  375. },
  376. },
  377. }
  378. </script>
  379. <style lang="scss" scoped>
  380. .box {
  381. height: 330px;
  382. width: 100%;
  383. // background-repeat: no-repeat;
  384. // background: #F9F9F9;
  385. // background: url(/static/shenqing.png) no-repeat;
  386. // background-size: contain;
  387. padding: 130px 15px 0 15px;
  388. // padding: 200px 16px 15px 16px;
  389. }
  390. .box-con{
  391. background: #FFFFFF;
  392. padding: 10px 15px;
  393. border-radius: 5px 5px 5px 5px;
  394. }
  395. .userBox{
  396. border-radius: 5px 5px 5px 5px;
  397. margin:10px 15px;
  398. padding: 10px 15px;
  399. background: #fff;
  400. font-size: 15px;
  401. color: #666666;
  402. .imgOcr-border {
  403. // position: relative;
  404. width: 48%;
  405. text-align: center;
  406. image {
  407. display: inline-block;
  408. height: 95px;
  409. width: 100%;
  410. }
  411. }
  412. }
  413. .submit{
  414. margin: 15px;
  415. text-align: center;
  416. color: #fff;
  417. height: 46px;
  418. line-height: 46px;
  419. background: linear-gradient( 133deg, #2DD9FF 0%, #2D6DFF 100%);
  420. border-radius: 31px 31px 31px 31px;
  421. }
  422. </style>