information.vue 28 KB

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