apply.vue 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201
  1. <template>
  2. <view class="container register" :style="{paddingTop:CustomBar+'px'}">
  3. <cu-custom :navbar-data='nvabarData' @navigateBack="hanldNavigateBack"></cu-custom>
  4. <view class="register-error clearfix" :style="{top:CustomBar+'px'}">
  5. <view class="error-top animation" @click="showOpenError" :class="{'error-top--none': isOpenError}" >
  6. <view class="name">审核未通过原因</view>
  7. <view class="icon">{{ isOpenError ? '' : '查看详情'}}<text class="iconfont icon-xiangxiajiantou" :class="{'icon-xiangxiajiantou-active':isOpenError}"></text></view>
  8. </view>
  9. <view class="error-main animation" :class="{'error-main--hide':!isOpenError}"
  10. :style="{'transform':isOpenError?'translateY(0)':'translateY(-50%)','-webkit-transform':isOpenError?'translateY(0)':'translateY(-50%)'}">
  11. <view class="error-main-list">
  12. <view class="item" v-for="(item, index) in errorList" :key="index">
  13. <text class="num">{{ index+1 }}.</text>
  14. <text>{{ item }}</text>
  15. </view>
  16. </view>
  17. </view>
  18. </view>
  19. <view class="register-main first clearfix">
  20. <view class="register-row">
  21. <view class="register-title">基本信息</view>
  22. </view>
  23. <view class="register-row clearfix">
  24. <view class="register-from">
  25. <view class="label">机构名称:</view>
  26. <input class="row-input" type="text" v-model="clubName" placeholder="请输入您的机构名称" maxlength="30"/>
  27. </view>
  28. </view>
  29. <view class="register-row clearfix">
  30. <view class="register-from">
  31. <view class="label">联系人:</view>
  32. <input class="row-input" type="text" v-model="clubContact" placeholder="请输入联系姓名" maxlength="6"/>
  33. </view>
  34. </view>
  35. <view class="register-row clearfix">
  36. <view class="register-from">
  37. <view class="label">手机号:</view>
  38. <input class="row-input" type="number" v-model="mobile" placeholder="请输入手机号" maxlength="11"/>
  39. <view class="row-btn" @click="showCheckPhone">{{ isShowCheckPhone ? '取消修改' : '修改手机号' }}</view>
  40. </view>
  41. </view>
  42. <view class="register-row clearfix" v-show="isShowCheckPhone">
  43. <view class="register-from code">
  44. <input class="row-input" type="number" v-model="mobileCode" placeholder="请输入上述手机号的验证码" maxlength="6"/>
  45. </view>
  46. <view class="register-from btn" :class="[isMobileDisabled ? 'disabled' : '']">
  47. <button class="row-input" type="button" @click.stop="getMobileCodeFn" :disabled="isMobileDisabled">{{ mobileCodeText }}</button>
  48. </view>
  49. </view>
  50. <view class="register-row clearfix" v-show="isShowCheckPhone">
  51. <view class="register-from">
  52. <input class="row-input" type="number" v-model="newMobile" placeholder="请输入新手机号" maxlength="11"/>
  53. </view>
  54. </view>
  55. <view class="register-row clearfix" v-show="isShowCheckPhone">
  56. <view class="register-from code">
  57. <input class="row-input" type="number" v-model="newMobileCode" placeholder="请输入新手机号的验证码" maxlength="6"/>
  58. </view>
  59. <view class="register-from btn" :class="[isNewMobileDisabled ? 'disabled' : '']" >
  60. <button class="row-input" type="button" @click.stop="getNewMobileCodeFn" :disabled="isNewMobileDisabled">{{ newMobileCodeText }}</button>
  61. </view>
  62. </view>
  63. </view>
  64. <view class="register-main clearfix" >
  65. <view class="register-row">
  66. <view class="register-title">详细信息<text class="txt">(请尽量填写,有利于快速审核通过)</text></view>
  67. </view>
  68. </view>
  69. <view class="register-main detailed clearfix">
  70. <view class="register-row clearfix">
  71. <view class="register-from">
  72. <view class="label">机构简称:</view>
  73. <input class="row-input" type="text" v-model="clubContact" placeholder="请输入您的机构简称" maxlength="10"/>
  74. </view>
  75. </view>
  76. <view class="register-row clearfix">
  77. <view class="register-from" @click="showMulLinkageThreePicker">
  78. <view class="label">机构地址:</view>
  79. <text class="row-input" :class="addressData.address === '请选择机构所在地区' ? 'none' : ''">
  80. {{addressData.address}}
  81. </text>
  82. <text class="iconfont icon-xiayibu"></text>
  83. </view>
  84. </view>
  85. <view class="register-row text-textarea clearfix">
  86. <view class="textarea show" v-if="isShowInput">{{addressData.addressDetail ? addressData.addressDetail :'详细地址:如道路、门牌号、小区等'}}</view>
  87. <textarea v-else
  88. class="textarea"
  89. type="text"
  90. v-model="addressData.addressDetail"
  91. placeholder="详细地址:如道路、门牌号、小区等"
  92. placeholder-class="placeholder"
  93. maxlength="25"
  94. @input="onTextareaInput"
  95. :class="isShowInput ? '':''"
  96. />
  97. </view>
  98. <view class="register-row clearfix">
  99. <view class="register-from">
  100. <view class="label">营业执照编号:</view>
  101. <input class="row-input" type="text" v-model="clubContact" placeholder="请填写社会统一信用代码" maxlength="16"/>
  102. </view>
  103. </view>
  104. <view class="register-row clearfix">
  105. <view class="register-picture">
  106. <view class="label">营业执照:</view>
  107. <view class="upload-picture">
  108. <view class="upload-none" v-if="uploadBusinessImage === ''" @click="chooseBusinessImage"><text class="iconfont icon-jiahao"></text></view>
  109. <view class="upload-image" v-else>
  110. <image :src="uploadBusinessImage" mode="" @click="viewBusinessImage"></image>
  111. <view class="upload-del" @click="delBusinessImage">
  112. <text class='iconfont icon-shanchu1'></text>
  113. </view>
  114. </view>
  115. </view>
  116. </view>
  117. </view>
  118. <view class="register-row clearfix">
  119. <view class="register-picture">
  120. <view class="label">门头照:</view>
  121. <view class="upload-picture">
  122. <view class="upload-none" v-if="uploadMentuzImage === ''" @click="chooseMentuzImage"><text class="iconfont icon-jiahao"></text></view>
  123. <view class="upload-image" v-else>
  124. <image :src="uploadMentuzImage" mode="" @click="viewMentuzImage"></image>
  125. <view class="upload-del" @click="delMentuzImage">
  126. <text class='iconfont icon-shanchu1'></text>
  127. </view>
  128. </view>
  129. </view>
  130. </view>
  131. </view>
  132. <view class="register-row clearfix">
  133. <view class="register-from picker">
  134. <view class="label">机构类型:</view>
  135. <view class="row-input picker" @click="bindPickerChange">{{ organizationTypeText }}</view>
  136. <text class="iconfont icon-xiayibu"></text>
  137. <!-- <picker @change="bindPickerChange" :value="index" :range="organizationTypeList" range-key="name">
  138. <view class="row-input" :class="[isOrganizationType == 0 ? 'none' : '']">{{organizationTypeList[typtIndex].name}}</view>
  139. </picker>
  140. -->
  141. </view>
  142. </view>
  143. <view class="register-row clearfix" v-if="isOrganizationType == 1">
  144. <view class="register-from radio">
  145. <radio-group @change="radioChange">
  146. <label class="row-input" v-for="(item, index) in beautyList" :key="item.value">
  147. <radio class="row-radio" :value="item.value" :checked="index === current" color="#E15616"/>
  148. <view class="row-text">{{item.name}}</view>
  149. </label>
  150. </radio-group>
  151. </view>
  152. </view>
  153. <view class="register-row clearfix" v-show="isDepartment">
  154. <view class="register-from">
  155. <view class="label">科室:</view>
  156. <input class="row-input keshi" type="text" v-model="clubContact" placeholder="请填写经营的科室,至少三个,用逗号隔开" maxlength="16"/>
  157. </view>
  158. </view>
  159. <view class="register-row clearfix" v-if="isOrganizationType == 1">
  160. <view class="register-picture">
  161. <view class="label zz">医疗执业许可证:</view>
  162. <view class="upload-picture">
  163. <view class="upload-none" v-if="uploadMedicalImage === ''" @click="chooseMedicalImage"><text class="iconfont icon-jiahao"></text></view>
  164. <view class="upload-image" v-else>
  165. <image :src="uploadMedicalImage" mode="" @click="viewMedicalImage"></image>
  166. <view class="upload-del" @click="delMedicalImage">
  167. <text class='iconfont icon-shanchu1'></text>
  168. </view>
  169. </view>
  170. </view>
  171. </view>
  172. </view>
  173. <view class="register-row clearfix" v-if="isOrganizationType == 1">
  174. <view class="register-from group">
  175. <view class="label">主营内容:</view>
  176. <checkbox-group class="content-class" @change="chooseMaleLike" >
  177. <label class="item" v-for="(item, index) in mentuzCampList" :key="index" :class="{on: item.checked}">
  178. <checkbox :value="item.value"></checkbox>
  179. <text class="item-text">{{item.name}}</text>
  180. </label>
  181. </checkbox-group>
  182. </view>
  183. <view class="register-from group btn">
  184. <view class="content-class btn">
  185. <view class="item" @click="showAustomItem">
  186. <text class="item-text">其他</text>
  187. </view>
  188. </view>
  189. </view>
  190. <view class="register-from group btn" v-show="isShowAustomItem">
  191. <view class="content-class btn">
  192. <input class="row-input other" type="text" v-model="customItemValue" placeholder="请输入自定义项目" @blur="onBlurInput" maxlength="5"/>
  193. <button type="default"
  194. class="confirm-btn"
  195. :class="[isDisabled === true ? 'disabled' : 'none']"
  196. :disabled="isDisabled"
  197. @click.stop="addCustomItem"
  198. >确认添加</button>
  199. </view>
  200. </view>
  201. </view>
  202. <view class="register-row clearfix" v-if="isOrganizationType == 2">
  203. <view class="register-from group">
  204. <view class="label">主营内容:</view>
  205. <checkbox-group class="content-class" @change="chooseMaleLikes">
  206. <label class="item" v-for="(item, index) in medicaCampList" :key="index" :class="{on: item.checked}">
  207. <checkbox :value="item.value"></checkbox>
  208. <text class="item-text">{{item.name}}</text>
  209. </label>
  210. </checkbox-group>
  211. </view>
  212. <view class="register-from group btn">
  213. <view class="content-class btn">
  214. <view class="item" @click="showAustomItem">
  215. <text class="item-text">其他</text>
  216. </view>
  217. </view>
  218. </view>
  219. <view class="register-from group btn" v-show="isShowAustomItem">
  220. <view class="content-class btn">
  221. <input class="row-input other" type="text" v-model="customItemValue" placeholder="请输入自定义项目" @blur="onBlurInput" maxlength="5"/>
  222. <button type="default"
  223. class="confirm-btn"
  224. :class="[isDisabled === true ? 'disabled' : 'none']"
  225. :disabled="isDisabled"
  226. @click.stop="addCustomItem"
  227. >确认添加</button>
  228. </view>
  229. </view>
  230. </view>
  231. <view class="register-fiexd clearfix">
  232. <view class="register-agree">
  233. <view class="agree-text" @tap.stop="agreeCheck()">
  234. <button class="checkbox iconfont" :class="[isCheck ?'icon-gouxuan':'icon-weigouxuan']"></button>
  235. 我已阅读并同意
  236. <text @click.stop="this.$api.navigateTo('/pages/service/organagree')">《机构协议》</text>
  237. <text @click.stop="this.$api.navigateTo('/pages/service/useragree')">《用户协议》</text>及
  238. <text @click.stop="this.$api.navigateTo('/pages/service/privacyagree')">《隐私权政策》</text>
  239. </view>
  240. </view>
  241. <view class="register-row ">
  242. <view class="register-btn sub" @click.stop="organizationUpdateInfo">提交审核</view>
  243. </view>
  244. </view>
  245. <mpvue-city-picker :themeColor="themeColor"
  246. ref="mpvueCityPicker"
  247. :pickerValueDefault="cityPickerValueDefault"
  248. @onCancel="onCancel"
  249. @onConfirm="onConfirm">
  250. </mpvue-city-picker>
  251. </view>
  252. </view>
  253. </template>
  254. <script>
  255. import { mapMutations } from 'vuex';
  256. import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
  257. import { organizationUpdateModifyInfo , organizationModifyUpdate } from "@/api/use.js"
  258. import { getClubMobileCode,getClubNewMobileCode,uploadFileImage } from "@/api/utils.js"
  259. var self;
  260. export default{
  261. components:{
  262. mpvueCityPicker
  263. },
  264. data() {
  265. return{
  266. nvabarData: { //顶部自定义导航
  267. showCapsule: 1, // 是否显示左上角图标 1表示显示 0表示不显示,
  268. showSearch: 0,
  269. title: '修改申请信息', // 导航栏 中间的标题
  270. },
  271. CustomBar:this.CustomBar,// 顶部导航栏高度
  272. isOpenError:false,
  273. errorList:[],
  274. isShowCheckPhone:false, //是否显示修改手机
  275. tabCurrentIndex:3,
  276. isPreviewImage:false, //预览图片开关
  277. isMobileDisabled: false, //手机验证码按钮控制
  278. isNewMobileDisabled: false, //手机验证码按钮控制
  279. userID:'', //用户ID
  280. clubID:'', //会所ID
  281. count: '', //倒计时
  282. newCount: '', //倒计时
  283. codeTime: null,
  284. codeTimeNew: null,
  285. clubName:'', //机构名称
  286. abbreviation:'', //机构简称
  287. clubContact:'', //联系人
  288. mobile:'', //联系人手机号
  289. newMobile:'', //新联系人手机号
  290. mobileCode:'', //手机号验证码
  291. newMobileCode:'', //新手机号手机验证码
  292. mobileCodeText: '获取验证码',
  293. newMobileCodeText: '获取验证码',
  294. socialCreditCode:'', //统一社会信用代码
  295. isAgreed:0, //是否勾选协议
  296. isDisabled:true,
  297. isShowInput:false,
  298. isCheck:true, //是否勾选协议
  299. uploadBusinessImage:'', //营业执照图片
  300. uploadMentuzImage:'', //门头照图片
  301. uploadMedicalImage:'', //资质照图片
  302. department:'', //科室
  303. isDepartment:false, //是否显示科室
  304. secondClubType:'', //机构类型二级分类
  305. mainpro:'', //主营内容
  306. clubTelePhone:'', //固定电话
  307. clubFax:'', //传真
  308. companyPprofile:'', //公司简介
  309. firstClubType:'', //机构类型
  310. isOrganizationType:0,
  311. organizationTypeText:'请选择机构类型',
  312. beautyList:[{value:'1',name:'诊所'},{value:'2',name:'门诊'},{value:'3',name:'医院'}],
  313. mentuzCampList:[],
  314. medicaCampList:[],
  315. typtIndex:0,
  316. organizationType:0,
  317. current:0,
  318. isShowAustomItem:false, //是否显示其他添加
  319. customItemValue:'', //自定义项目
  320. isMainproCheck:false,
  321. addressData:{
  322. address:'请选择机构所在地区',
  323. townID:'', //区ID
  324. cityID:'', //市ID
  325. provinceID:'', //省ID
  326. addressDetail: '', //地址详情
  327. },
  328. }
  329. },
  330. onLoad(option) {
  331. this.organizationInfo()
  332. },
  333. methods:{
  334. hanldNavigateBack(){
  335. this.$util.modal('','资料尚未提交审核,确定放弃修改吗?','确定','取消',true,() =>{
  336. uni.navigateBack({
  337. delta: 1
  338. });
  339. })
  340. },
  341. organizationInfo(){
  342. this.$api.getStorage().then((resolve) =>{
  343. this.userID = resolve.userID
  344. organizationUpdateModifyInfo({userID:this.userID}).then(response =>{
  345. let organizationClub = response.data.club
  346. let organizationUser = response.data.user
  347. this.errorList =organizationUser.auditNoteList
  348. this.email = organizationUser.email
  349. this.clubID = organizationUser.clubID
  350. this.clubName = organizationClub.name
  351. this.clubContact = organizationClub.linkMan1
  352. this.mobile = organizationUser.bindMobile
  353. this.abbreviation = organizationClub.sname
  354. if( organizationClub.provinceID == null ){
  355. this.addressData.provinceID = ''
  356. }else{
  357. this.addressData.provinceID = organizationClub.provinceID
  358. }
  359. if( organizationClub.cityID == null ){
  360. this.addressData.cityID = ''
  361. }else{
  362. this.addressData.cityID = organizationClub.cityID
  363. }
  364. if( organizationClub.townID == null ){
  365. this.addressData.townID = ''
  366. }else{
  367. this.addressData.townID = organizationClub.townID
  368. }
  369. this.addressData.address = organizationClub.provincialAddress
  370. this.addressData.addressDetail = organizationClub.address
  371. this.socialCreditCode = organizationClub.socialCreditCode
  372. this.firstClubType = organizationClub.firstClubType
  373. this.secondClubType = organizationClub.secondClubType
  374. this.uploadBusinessImage = organizationClub.businessLicenseImage
  375. this.uploadMentuzImage = organizationClub.headpic
  376. this.uploadMedicalImage = organizationClub.medicalPracticeLicenseImg
  377. this.department = organizationClub.department
  378. this.clubTelePhone = organizationClub. contractPhone
  379. this.clubFax = organizationClub.fax
  380. this.companyPprofile = organizationClub.info
  381. //机构类型&&主营项目
  382. switch(this.firstClubType){
  383. case '1':
  384. this.organizationTypeText = '医美'
  385. this.isOrganizationType = 1
  386. break;
  387. case '2':
  388. this.organizationTypeText = '生美'
  389. this.isOrganizationType = 2
  390. break;
  391. case null:
  392. this.organizationTypeText = '请选择机构类型'
  393. this.isOrganizationType = 0
  394. break;
  395. }
  396. if(organizationClub.mainpro!=null){
  397. if(this.firstClubType == '1'){
  398. this.mentuzCampList = this.setNewMainpro(organizationClub.mainpro)
  399. }else{
  400. this.medicaCampList = this.setNewMainpro(organizationClub.mainpro)
  401. }
  402. }
  403. //机构类型
  404. switch(this.secondClubType){
  405. case '1':this.current = 0;break;
  406. case '2':this.current = 1;this.isDepartment=true;break;
  407. case '3':this.current = 2;this.isDepartment=true;break;
  408. }
  409. }).catch(response =>{
  410. this.$util.msg(response.msg,2000)
  411. })
  412. })
  413. },
  414. organizationUpdateInfo(){//提交审核
  415. if(!this.isCheck){
  416. this.$util.msg('请勾选同意协议',2000);
  417. return
  418. }
  419. if(!this.isMainproCheck){
  420. let mainproList = []
  421. if(this.firstClubType == '1'){
  422. this.mentuzCampList.forEach(item =>{
  423. mainproList.push(item.name)
  424. })
  425. }else{
  426. this.medicaCampList.forEach(item =>{
  427. mainproList.push(item.name)
  428. })
  429. }
  430. this.mainpro = mainproList.join('/')
  431. }
  432. let params ={
  433. userID:this.userID,
  434. clubID:this.clubID, //会所ID
  435. name:this.clubName,
  436. linkMan1:this.clubContact,
  437. contractMobile2:this.mobile,
  438. contractMobile:this.newMobile,
  439. mobileCode:this.mobileCode,
  440. newMobileCode:this.newMobileCode,
  441. sname:this.abbreviation,
  442. provinceID:this.addressData.provinceID,
  443. cityID:this.addressData.cityID,
  444. townID:this.addressData.townID,
  445. address:this.addressData.addressDetail,
  446. socialCreditCode:this.socialCreditCode,
  447. businessLicenseImage:this.uploadBusinessImage,
  448. headpic:this.uploadMentuzImage,
  449. firstClubType:this.isOrganizationType, //机构类型分类 医美:0和生美:1
  450. secondClubType:this.secondClubType, //机构类型二级分类 诊所:1,门诊:2,医院:3
  451. department:this.department, //科室
  452. medicalPracticeLicenseImg:this.uploadMedicalImage,//资质图片
  453. isAgreed:this.isAgreed, //是否勾选协议
  454. mainpro:this.mainpro,
  455. fax:this.clubFax,
  456. contractPhone:this.clubTelePhone,
  457. info : this.companyPprofile
  458. }
  459. organizationModifyUpdate(params).then(response =>{
  460. this.$util.msg(response.msg,2000);
  461. setTimeout(()=>{
  462. this.$api.switchTabTo('/pages/tabBar/home/home')
  463. },2000)
  464. }).catch(response =>{
  465. this.$util.msg(response.msg,2000);
  466. })
  467. },
  468. getMobileCodeFn(){
  469. if( this.mobile == ''){
  470. this.$util.msg('请输入手机号',2000);
  471. return
  472. }
  473. if(!this.$reg.isMobile(this.mobile)){
  474. this.$util.msg('请输入正确的手机号',2000);
  475. return
  476. }
  477. let params = { mobile : this.mobile }
  478. this.isMobileDisabled = true;
  479. getClubMobileCode(params).then(response =>{
  480. this.$util.msg('验证短信已发送',2000);
  481. const TIME_COUNT = 60;
  482.       if (!this.codeTime) {
  483.         this.count = TIME_COUNT;
  484.         this.isMobileDisabled = true;
  485.         this.codeTime = setInterval(() => {
  486.         if (this.count > 1 && this.count <= TIME_COUNT) {
  487.           this.count--
  488.           this.mobileCodeText = this.count +'s重新发送'
  489.          } else {
  490.           this.isMobileDisabled = false;
  491.           clearInterval(this.codeTime)
  492.           this.codeTime = null
  493. this.mobileCodeText = '获取验证码'
  494.          }
  495.         },1000)
  496.        }
  497. }).catch( response =>{
  498. this.$util.msg(response.msg,2000);
  499. this.isMobileDisabled = false;
  500. })
  501. },
  502. getNewMobileCodeFn(){
  503. if( this.newMobile == ''){
  504. this.$util.msg('请输入手机号',2000);
  505. return
  506. }
  507. if(!this.$reg.isMobile(this.newMobile)){
  508. this.$util.msg('请输入正确的手机号',2000);
  509. return
  510. }
  511. let params = { newMobile : this.newMobile }
  512. this.isNewMobileDisabled = true;
  513. getClubNewMobileCode(params).then(response =>{
  514. this.$util.msg('验证短信已发送',2000);
  515. const TIME_COUNT = 60;
  516.       if (!this.codeTimeNew) {
  517.         this.newCount = TIME_COUNT;
  518.         this.isNewMobileDisabled = true;
  519.         this.codeTimeNew = setInterval(() => {
  520.         if (this.newCount > 1 && this.newCount <= TIME_COUNT) {
  521.           this.newCount
  522.           this.newMobileCodeText = this.newCount +'s重新发送'
  523.          } else {
  524.           this.isNewMobileDisabled = false;
  525.           clearInterval(this.codeTimeNew)
  526.           this.codeTimeNew = null
  527. this.newMobileCodeText = '获取验证码'
  528.          }
  529.         },1000)
  530.        }
  531. }).catch( res =>{
  532. this.$util.msg(response.msg,2000);
  533. this.isNewMobileDisabled = false;
  534. })
  535. },
  536. // 三级联动选择
  537. showMulLinkageThreePicker() {
  538. this.isShowInput = true
  539. this.$refs.mpvueCityPicker.show()
  540. },
  541. onConfirm(e) {
  542. this.addressData.address = e.name;
  543. this.addressData.townID = e.townCode;
  544. this.addressData.cityID = e.cityCode;
  545. this.addressData.provinceID = e.provinceCode;
  546. },
  547. onTextareaInput(e){
  548. this.addressData.addressDetail = e.detail.value;
  549. },
  550. chooseBusinessImage() {//营业执照图片上传
  551. uploadFileImage().then(res =>{
  552. this.uploadBusinessImage = JSON.parse(res.data).data
  553. })
  554. },
  555. chooseMentuzImage() {//门头照图片上传
  556. uploadFileImage().then(res =>{
  557. this.uploadMentuzImage = JSON.parse(res.data).data
  558. })
  559. },
  560. chooseMedicalImage() {//资质照图片上传
  561. uploadFileImage().then(res =>{
  562. this.uploadMedicalImage = JSON.parse(res.data).data
  563. })
  564. },
  565. viewBusinessImage(e) {
  566. this.myPreviewImageFn(this.uploadBusinessImage)
  567. },
  568. viewMentuzImage(e) {
  569. this.myPreviewImageFn(this.uploadMentuzImage)
  570. },
  571. viewMedicalImage(e) {
  572. this.myPreviewImageFn(this.uploadMedicalImage)
  573. },
  574. myPreviewImageFn(url){
  575. this.isPreviewImage = true
  576. let mentuzArray = []
  577. mentuzArray.push(url)
  578. uni.previewImage({
  579. urls: mentuzArray,
  580. current: 0
  581. });
  582. },
  583. delBusinessImage(){
  584. this.$util.modal('','确定删除营业执照图片吗?','确定','取消',true,() =>{
  585. this.uploadBusinessImage = ''
  586. })
  587. },
  588. delMentuzImage(){
  589. this.$util.modal('','确定删除门头照图片吗?','确定','取消',true,() =>{
  590. this.uploadMentuzImage = ''
  591. })
  592. },
  593. delMedicalImage(){
  594. this.$util.modal('','确定删除资质图片吗?','确定','取消',true,() =>{
  595. this.uploadMedicalImage = ''
  596. })
  597. },
  598. bindPickerChange() {
  599. let self = this
  600. uni.showActionSheet({
  601. title:'标题',
  602. itemList: ['医美', '生美'],
  603. success: (e) => {
  604. self.isOrganizationType = e.tapIndex+1
  605. switch(e.tapIndex){
  606. case 0:
  607. this.organizationTypeText = '医美'
  608. break;
  609. case 1:
  610. this.organizationTypeText = '生美'
  611. break;
  612. }
  613. }
  614. })
  615. },
  616. bindPickerChange2(e) {
  617. this.typtIndex = e.target.value
  618. this.isOrganizationType = e.target.value
  619. },
  620. radioChange(e) {
  621. this.secondClubType = e.target.value;
  622. if( this.secondClubType == '2' || this.secondClubType == '3'){
  623. this.isDepartment = true
  624. }else{
  625. this.isDepartment = false
  626. }
  627. for (let i = 0; i < this.beautyList.length; i++) {
  628. if (this.beautyList[i].value === this.secondClubType) {
  629. this.current = i;
  630. break;
  631. }
  632. }
  633. },
  634. chooseMaleLike(e){
  635. this.isMainproCheck = true
  636. this.mainpro = this.checkLikes(e,this.mentuzCampList)
  637. },
  638. chooseMaleLikes(e){
  639. this.isMainproCheck = true
  640. this.mainpro = this.checkLikes(e,this.medicaCampList)
  641. },
  642. checkLikes(e,list){
  643. let items = list
  644. let values = e.detail.value
  645. let arr = []
  646. for (let i = 0, lenI = items.length; i < lenI; ++i) {
  647. const item = items[i]
  648. if(values.indexOf(item.value) >= 0){
  649. this.$set(item,'checked',true)
  650. arr.push(item.name)
  651. }else{
  652. this.$set(item,'checked',false)
  653. }
  654. }
  655. return arr.join('/')
  656. },
  657. agreeCheck() {
  658. this.isCheck = !this.isCheck
  659. if(this.isCheck){
  660. this.isAgreed = 1
  661. }else{
  662. this.isAgreed = 0
  663. }
  664. },
  665. onBlurInput(e){//
  666. if(e.detail.value ===''){
  667. this.isDisabled = true
  668. }else{
  669. this.isDisabled = false
  670. }
  671. },
  672. showAustomItem() {
  673. this.isShowAustomItem = !this.isShowAustomItem
  674. },
  675. setNewMainpro(arr){//回显处理主营内容
  676. let _ARRAY = []
  677. arr.split('/').forEach((item,index) =>{
  678. let _OBJ = {value:index,name:item,checked:true}
  679. _ARRAY.push(_OBJ)
  680. })
  681. return _ARRAY
  682. },
  683. addCustomItem(){
  684. if(this.isOrganizationType == 1){
  685. let item = {value:`${this.mentuzCampList.length+1}`,name:this.customItemValue,checked:true}
  686. this.mentuzCampList.push(item)
  687. }else{
  688. let item = {value:`${this.medicaCampList.length+1}`,name:this.customItemValue,checked:true}
  689. this.medicaCampList.push(item)
  690. }
  691. },
  692. showOpenError(){//顶部审核信息详情
  693. this.isOpenError = !this.isOpenError
  694. },
  695. showCheckPhone(){//控制修改手机显隐
  696. this.isShowCheckPhone = !this.isShowCheckPhone
  697. },
  698. steps(index) {//$attrstab切换
  699. this.tabCurrentIndex = index;
  700. }
  701. },
  702. onShow() {
  703. if(this.isPreviewImage){
  704. this.isPreviewImage = false
  705. return
  706. }
  707. }
  708. }
  709. </script>
  710. <style lang="scss">
  711. .register{
  712. width: 100%;
  713. height: auto;
  714. border-top: 1px solid #F7F7F7;
  715. .model-warp.none{
  716. display: none;
  717. }
  718. .model-warp.show{
  719. display: block;
  720. }
  721. .register-error{
  722. width: 100%;
  723. height: auto;
  724. position: fixed;
  725. top: 0;
  726. left: 0;
  727. z-index: 999;
  728. .error-top{
  729. width: 702rpx;
  730. padding: 0 24rpx;
  731. height: 90rpx;
  732. line-height: 90rpx;
  733. background: #FF0000;
  734. border-bottom: 1px solid #F7F7F7;
  735. &.error-top--none{
  736. background:#FFFFFF;
  737. .name{
  738. color: #333333;
  739. }
  740. .icon{
  741. color: #333333;
  742. }
  743. }
  744. .name{
  745. font-size: $font-size-32;
  746. color: #FFFFFF;
  747. float: left;
  748. }
  749. .icon{
  750. float: right;
  751. font-size: $font-size-32;
  752. color: #FFFFFF;
  753. }
  754. .icon-xiangxiajiantou{
  755. transform: rotate(0deg);
  756. transform-origin: center center;
  757. float: right;
  758. font-size: $font-size-32;
  759. color: #FFFFFF;
  760. /* transition: transform 0.3s ease;*/
  761. transition-property: transform;
  762. transition-duration: 0.3s;
  763. transition-timing-function: ease;
  764. margin-left: 10rpx;
  765. }
  766. .icon-xiangxiajiantou-active{
  767. transform: rotate(180deg);
  768. color: #333333;
  769. }
  770. }
  771. .animation{
  772. /* transition: transform 0.3s ease;*/
  773. transition-property: transform;
  774. transition-duration: 0.2s;
  775. transition-timing-function: ease;
  776. }
  777. .error-main{
  778. width: 702rpx;
  779. height: auto;
  780. padding: 24rpx;
  781. overflow: hidden;
  782. background: #FFFFFF;
  783. .error-main-list{
  784. width:100% ;
  785. height: auto;
  786. background: #FFFFFF;
  787. .item{
  788. height: auto;
  789. line-height: 60rpx;
  790. font-size: $font-size-28;
  791. color: #FF0000;
  792. .num{
  793. margin-right: 10rpx;
  794. }
  795. }
  796. }
  797. }
  798. .error-main--hide {
  799. padding: 0 24rpx;
  800. height: 0px;
  801. line-height: 0px;
  802. }
  803. }
  804. .register-main{
  805. width: 100%;
  806. height: auto;
  807. &.detailed{
  808. padding-bottom: 300rpx;
  809. }
  810. &.first{
  811. padding-top: 110rpx;
  812. }
  813. .register-tips{
  814. display: flex;
  815. flex-direction: column;
  816. align-items: center;
  817. line-height: 44rpx;
  818. font-size: $font-size-24;
  819. color: #FF0000;
  820. margin-bottom: 40rpx;
  821. .iconfont{
  822. font-size: $font-size-24;
  823. }
  824. }
  825. .register-row{
  826. width: 702rpx;
  827. height: auto;
  828. padding: 0 24rpx;
  829. margin-bottom: 20rpx;
  830. .register-title{
  831. line-height: 60rpx;
  832. font-size: $font-size-32;
  833. color: $text-color;
  834. text-align: left;
  835. padding-left: 20rpx;
  836. .txt{
  837. font-size: $font-size-26;
  838. }
  839. }
  840. .row-btn{
  841. position: absolute;
  842. right: 24rpx;
  843. top: 0;
  844. line-height: 88rpx;
  845. text-align: center;
  846. font-size: $font-size-28;
  847. color: $color-system;
  848. }
  849. .register-from{
  850. width: 654rpx;
  851. height: 40rpx;
  852. padding: 24rpx;
  853. background: $sub-bg-color;
  854. border-radius: 14rpx;
  855. position: relative;
  856. .label{
  857. text-align: left;
  858. font-size: $font-size-28;
  859. color: #666666;
  860. line-height: 40rpx;
  861. float: left;
  862. }
  863. .row-input{
  864. width: 440rpx;
  865. padding-left:10rpx;
  866. font-size: $font-size-28;
  867. color: $text-color;
  868. line-height: 40rpx;
  869. float: left;
  870. height: 40rpx;
  871. &.none{
  872. color: #999999;
  873. }
  874. &.picker{
  875. text-align: left;
  876. color: #999999;
  877. }
  878. &.keshi{
  879. width: 550rpx;
  880. }
  881. }
  882. &.code{
  883. width: 410rpx;
  884. float: left;
  885. margin-right: 20rpx;
  886. .row-input{
  887. width: 390rpx;
  888. }
  889. }
  890. &.btn{
  891. width: 224rpx;
  892. height: 88rpx;
  893. float: left;
  894. background: $btn-confirm;
  895. padding: 0;
  896. .row-input{
  897. width: 224rpx;
  898. height: 88rpx;
  899. line-height: 88rpx;
  900. padding: 0;
  901. color: #FFFFFF;
  902. background: $btn-confirm;
  903. text-align: center;
  904. border-radius: 14rpx;
  905. &.other{
  906. width: 224rpx;
  907. background: #F7F7F7;
  908. margin-right: 20rpx;
  909. }
  910. &.none{
  911. background: #F7F7F7;
  912. }
  913. }
  914. &.disabled{
  915. background: #F7F7F7;
  916. .row-input{
  917. background: #F7F7F7;
  918. color: #999999;
  919. }
  920. }
  921. }
  922. &.picker{
  923. padding: 0 24rpx;
  924. width: 654rpx;
  925. height: 88rpx;
  926. line-height: 88rpx;
  927. .label{
  928. line-height: 88rpx;
  929. }
  930. .row-input{
  931. width: 470rpx;
  932. height: 88rpx;
  933. line-height: 88rpx;
  934. padding-left: 30rpx;
  935. }
  936. }
  937. &.radio{
  938. padding: 0 24rpx;
  939. width: 654rpx;
  940. height: 288rpx;
  941. .row-input{
  942. width: 100%;
  943. height: 88rpx;
  944. line-height: 88rpx;
  945. padding-left: 0;
  946. }
  947. .row-radio{
  948. float: left;
  949. transform: scale(0.8);
  950. }
  951. .row-text{
  952. width: 100rpx;
  953. text-align: center;
  954. float: left;
  955. }
  956. }
  957. &.group{
  958. padding: 0 24rpx;
  959. width: 654rpx;
  960. height: auto;
  961. background: #FFFFFF;
  962. margin-top: 30rpx;
  963. .label{
  964. line-height: 76rpx;
  965. }
  966. .row-input{
  967. width: 100%;
  968. height: 88rpx;
  969. line-height: 88rpx;
  970. padding-left: 0;
  971. }
  972. .row-radio{
  973. float: left;
  974. }
  975. .row-text{
  976. width: 100rpx;
  977. text-align: center;
  978. float: left;
  979. }
  980. }
  981. &.btn{
  982. margin-top: 0;
  983. }
  984. .content-class {
  985. margin: 20rpx auto;
  986. display: flex;
  987. flex-flow: row wrap;
  988. justify-content: space-between;
  989. align-items: center;
  990. &.btn{
  991. margin: 0 auto;
  992. margin-left: 126rpx;
  993. }
  994. .row-input{
  995. display: flex;
  996. width: 220rpx;
  997. height: 40rpx;
  998. padding: 24rpx;
  999. text-align: left;
  1000. border-radius: 10rpx;
  1001. font-size: $font-size-28;
  1002. color: $text-color;
  1003. }
  1004. .confirm-btn{
  1005. width: 200rpx;
  1006. height: 88rpx;
  1007. border-radius: 10rpx;
  1008. line-height: 88rpx;
  1009. text-align: center;
  1010. &.none{
  1011. color: #FFFFFF;
  1012. background: $btn-confirm;
  1013. }
  1014. &.disabled{
  1015. color: #999999;
  1016. }
  1017. }
  1018. .item {
  1019. width: 155rpx;
  1020. height: 60rpx;
  1021. font-size:$font-size-28;
  1022. line-height: 60rpx;
  1023. border-radius:10rpx;
  1024. margin: 10rpx;
  1025. text-align: center;
  1026. box-sizing: border-box;
  1027. border: 1rpx solid #EFEFEF;
  1028. checkbox {
  1029. display: none;
  1030. }
  1031. }
  1032. .on {
  1033. border-color: $color-system;
  1034. color:$color-system;
  1035. }
  1036. }
  1037. }
  1038. .icon-xiayibu{
  1039. width: 88rpx;
  1040. height: 88rpx;
  1041. position: absolute;
  1042. right: 0;
  1043. top: 0;
  1044. line-height: 88rpx;
  1045. text-align: center;
  1046. }
  1047. &.text-textarea{
  1048. background: #FFFFFF;
  1049. .textarea{
  1050. width: 654rpx;
  1051. height: 180rpx;
  1052. background: #F7F7F7;
  1053. padding: 24rpx;
  1054. font-size: $font-size-28;
  1055. color: $text-color;
  1056. z-index: 1;
  1057. border-radius: 14rpx;
  1058. }
  1059. .textarea.hide{
  1060. opacity: 0;
  1061. }
  1062. .textarea.show{
  1063. color: #999999;
  1064. }
  1065. }
  1066. }
  1067. .register-picture{
  1068. height: 102rpx;
  1069. margin: 40rpx 0 0 0;
  1070. .label{
  1071. float: left;
  1072. font-size: $font-size-28;
  1073. color: $text-color;
  1074. line-height: 102rpx;
  1075. width: 150rpx;
  1076. text-align: right;
  1077. &.zz{
  1078. width: 230rpx;
  1079. }
  1080. }
  1081. .upload-picture{
  1082. float: left;
  1083. height: 100rpx;
  1084. .upload-none{
  1085. width: 100rpx;
  1086. height: 100rpx;
  1087. text-align: center;
  1088. line-height: 100rpx;
  1089. color: #999999;
  1090. border: 1px solid #999999;
  1091. border-radius: 10rpx;
  1092. margin: 0 20rpx;
  1093. .iconfont{
  1094. font-size: $font-size-28;
  1095. }
  1096. }
  1097. .upload-image{
  1098. width: 100rpx;
  1099. height: 100rpx;
  1100. border-radius: 10rpx;
  1101. margin: 0 20rpx;
  1102. position: relative;
  1103. image{
  1104. width: 100rpx;
  1105. height: 100rpx;
  1106. border-radius: 10rpx;
  1107. }
  1108. .upload-del{
  1109. width: 40rpx;
  1110. height: 40rpx;
  1111. position: absolute;
  1112. top: -20rpx;
  1113. right: -20rpx;
  1114. line-height: 40rpx;
  1115. text-align: center;
  1116. .iconfont{
  1117. font-size: $font-size-32;
  1118. color: #999999;
  1119. }
  1120. }
  1121. }
  1122. }
  1123. }
  1124. .register-input{
  1125. width: 654rpx;
  1126. height: 40rpx;
  1127. padding: 24rpx;
  1128. margin: 0 auto;
  1129. margin-bottom: 60rpx;
  1130. background: #F7F7F7;
  1131. border-radius: 14rpx;
  1132. .input{
  1133. width: 100%;
  1134. height: 100%;
  1135. background: #F7F7F7;
  1136. font-size: $font-size-28;
  1137. line-height: 40rpx;
  1138. color: #333333;
  1139. border-radius: 14rpx;
  1140. }
  1141. }
  1142. .register-fiexd{
  1143. width: 100%;
  1144. height: auto;
  1145. padding: 20rpx 0;
  1146. position: fixed;
  1147. bottom: 0;
  1148. left: 0;
  1149. z-index: 99;
  1150. background: #FFFFFF;
  1151. .register-agree{
  1152. display: flex;
  1153. flex-direction: column;
  1154. align-items: center;
  1155. margin: 32rpx 0;
  1156. .agree-text{
  1157. .checkbox{
  1158. float: left;
  1159. margin: 4rpx 6rpx 0 0;
  1160. color: #999999;
  1161. font-size: $font-size-32;
  1162. &.icon-gouxuan{
  1163. color: $color-system;
  1164. }
  1165. }
  1166. font-size: 20rpx;
  1167. line-height: 44rpx;
  1168. color: #999999;
  1169. text{
  1170. color:#0091FF;
  1171. }
  1172. }
  1173. }
  1174. }
  1175. .register-btn{
  1176. width: 702rpx;
  1177. height: 88rpx;
  1178. border-radius: 14rpx;
  1179. font-size: $font-size-28;
  1180. line-height: 88rpx;
  1181. color: #FFFFFF;
  1182. margin: 0 auto;
  1183. text-align: center;
  1184. background: $btn-confirm;
  1185. margin-top: 96rpx;
  1186. &.none{
  1187. background: #FFFFFF;
  1188. color: $text-color;
  1189. margin-top: 0;
  1190. }
  1191. &.sub{
  1192. margin-top: 0;
  1193. }
  1194. }
  1195. }
  1196. }
  1197. </style>