information.vue 34 KB

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