apply.vue 35 KB

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