applystudio.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433
  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. this.personData.password = ''
  195. }
  196. else{
  197. uni.showModal({
  198. showCancel: false,
  199. title: res.msg
  200. })
  201. }
  202. })
  203. }
  204. },
  205. methods:{
  206. submit(){
  207. this.$refs.personData.validate().then(res => {
  208. if(this.id){
  209. this.$http.post('/user/updateUserInfo1/' +this.id, {
  210. esmUserImageVo: this.personData.esmUserImageVo,
  211. sysUser: this.personData,
  212. sysUserInfo:this.personData,
  213. }).then(res=>{
  214. if(res.code==200){
  215. let obj = JSON.stringify(res.data);
  216. uni.redirectTo({
  217. url: "/pages/index/result?data="+obj
  218. })
  219. }
  220. else{
  221. uni.showModal({
  222. showCancel: false,
  223. title: res.msg
  224. })
  225. }
  226. })
  227. }else{
  228. this.$http.post('/user/saveUserInfoByPartner', {
  229. isPartner:"1",
  230. sysUser:{...this.personData,roleId:"22",referrerId:this.userId,type:2,deptSource:this.deptSource},
  231. esmUserImageVo:this.personData.esmUserImageVo
  232. }).then(res=>{
  233. if(res.code==200){
  234. let obj = JSON.stringify(res.data);
  235. uni.redirectTo({
  236. url: "/pages/index/result?data="+obj
  237. })
  238. }
  239. else{
  240. uni.showModal({
  241. showCancel: false,
  242. title: res.msg
  243. })
  244. }
  245. })
  246. }
  247. }).catch(err => {
  248. console.log('err', err);
  249. })
  250. },
  251. // submit(){
  252. // uni.redirectTo({
  253. // url: "/pages/index/result?key="+encodeURIComponent(JSON.stringify({status:2}))
  254. // // url: "/pages/index/result?status=1&remark=111"
  255. // })
  256. // // this.$refs.personData.validate().then(res => {
  257. // this.$refs.baseForm.submit().then(res => {
  258. // this.$http.post('/user/saveUserInfo', {
  259. // isPartner:"1",
  260. // sysUser:{...this.personData,roleId:"22",referrerId:this.userInfo.sysUser.userId,type:2,deptSource:this.deptSource},
  261. // esmUserImageVo:this.personData.esmUserImageVo
  262. // }).then(res=>{
  263. // if(res.code==200){
  264. // uni.redirectTo({
  265. // url: "/pages/index/result?key="+encodeURIComponent(JSON.stringify({status:1}))
  266. // })
  267. // }
  268. // else{
  269. // uni.showModal({
  270. // showCancel: false,
  271. // title: res.msg
  272. // })
  273. // // uni.showToast({
  274. // // title: res.msg
  275. // // })
  276. // }
  277. // })
  278. // // if (data.code == '200') {
  279. // // }
  280. // }).catch(err => {
  281. // console.log('err', err);
  282. // })
  283. // },
  284. dictionaryConfirm(val){
  285. this.personData.deptSourceName=val[0].label
  286. this.personData.deptSource=val[0].value
  287. },
  288. deptConfirm(val){
  289. this.personData.deptName=val[0].label
  290. this.personData.deptType=val[0].value
  291. },
  292. async userfrontChange() {
  293. // this.personData.esmUserImageVo[0]={}
  294. let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
  295. count: 1,
  296. sizeType: ['compressed']
  297. });
  298. let size = chooseImageRes.tempFiles[0].size / 1024 / 1024 < 5;
  299. if (!size) {
  300. this.$refs.uToast.show({
  301. title: '上传图片大小不能超过 5MB!',
  302. type: 'error',
  303. })
  304. return false
  305. }
  306. if (chooseImageRes) {
  307. this.userfrontImg = chooseImageRes.tempFilePaths[0];
  308. uni.uploadFile({
  309. url: this.$base.baseUrl + '/ins/taskImage/uploadFileByPartner',
  310. filePath: chooseImageRes.tempFilePaths[0],
  311. name: "multipartFile",
  312. formData: {
  313. 'type': 'image',
  314. },
  315. // header: {
  316. // Authorization: store.state.token,
  317. // },
  318. success: (imgRes) => {
  319. let data = JSON.parse(imgRes.data);
  320. if (data.code == '200') {
  321. this.personData.esmUserImageVo.push(
  322. {
  323. imageId: data.data.id,
  324. type: "SFZ_01",
  325. }
  326. )
  327. // this.personData.esmUserImageVo[0]={
  328. // imageId: data.data.id,
  329. // type: "SFZ_01",
  330. // }
  331. }
  332. }
  333. });
  334. }
  335. },
  336. async userbackChange() {
  337. // this.personData.esmUserImageVo[1]={}
  338. let [chooseImageErr, chooseImageRes] = await uni.chooseImage({
  339. count: 1,
  340. sizeType: ['compressed']
  341. });
  342. let size = chooseImageRes.tempFiles[0].size / 1024 / 1024 < 5;
  343. if (!size) {
  344. this.$refs.uToast.show({
  345. title: '上传图片大小不能超过 5MB!',
  346. type: 'error',
  347. })
  348. return false
  349. }
  350. if (chooseImageRes) {
  351. this.userbackImg = chooseImageRes.tempFilePaths[0];
  352. uni.uploadFile({
  353. url: this.$base.baseUrl + '/ins/taskImage/uploadFileByPartner',
  354. filePath: chooseImageRes.tempFilePaths[0],
  355. name: "multipartFile",
  356. formData: {
  357. 'type': 'image',
  358. },
  359. // header: {
  360. // Authorization: store.state.token,
  361. // },
  362. success: (imgRes) => {
  363. let data = JSON.parse(imgRes.data);
  364. if (data.code == '200') {
  365. // this.personData.esmUserImageVo[1]=data.data
  366. this.personData.esmUserImageVo.push(
  367. {
  368. imageId: data.data.id,
  369. type: "SFZ_02",
  370. }
  371. )
  372. }
  373. }
  374. });
  375. }
  376. },
  377. },
  378. }
  379. </script>
  380. <style lang="scss" scoped>
  381. .box {
  382. height: 330px;
  383. width: 100%;
  384. // background-repeat: no-repeat;
  385. // background: #F9F9F9;
  386. // background: url(/static/shenqing.png) no-repeat;
  387. // background-size: contain;
  388. padding: 130px 15px 0 15px;
  389. // padding: 200px 16px 15px 16px;
  390. }
  391. .box-con{
  392. background: #FFFFFF;
  393. padding: 10px 15px;
  394. border-radius: 5px 5px 5px 5px;
  395. }
  396. .userBox{
  397. border-radius: 5px 5px 5px 5px;
  398. margin:10px 15px;
  399. padding: 10px 15px;
  400. background: #fff;
  401. font-size: 15px;
  402. color: #666666;
  403. .imgOcr-border {
  404. // position: relative;
  405. width: 48%;
  406. text-align: center;
  407. image {
  408. display: inline-block;
  409. height: 95px;
  410. width: 100%;
  411. }
  412. }
  413. }
  414. .submit{
  415. margin: 15px;
  416. text-align: center;
  417. color: #fff;
  418. height: 46px;
  419. line-height: 46px;
  420. background: linear-gradient( 133deg, #2DD9FF 0%, #2D6DFF 100%);
  421. border-radius: 31px 31px 31px 31px;
  422. }
  423. </style>