upgrade.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. <!DOCTYPE html>
  2. <html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  3. xsi:schemaLocation="https://www.thymeleaf.org ">
  4. <head>
  5. <title>采美365网</title>
  6. <template th:replace="components/head-link"></template>
  7. <link th:href="@{/css/base/form.css(v=${version})}" rel="stylesheet" type="text/css">
  8. <link th:href="@{/css/base/center.css(v=${version})}" rel="stylesheet" type="text/css">
  9. <link th:href="@{/css/user-center/setting/upgrade.css(v=${version})}" rel="stylesheet" type="text/css">
  10. <template th:replace="components/analysis"></template>
  11. </head>
  12. <body>
  13. <!-- 引用头部 -->
  14. <template th:replace="components/header"></template>
  15. <!-- 升级机构 -->
  16. <div id="upgradePage">
  17. <div class="navLayout" v-cloak>
  18. <div v-if="isPC" class="crumbs">
  19. <span>机构管理中心</span>
  20. <span>&gt;</span>
  21. <span>机构升级</span>
  22. </div>
  23. <div class="wrap clear">
  24. <!--左侧导航-->
  25. <template th:replace="user-center/components/tableft"></template>
  26. <div class="right">
  27. <!--loading-->
  28. <div v-if="isRequset" class="loading">
  29. <img src="/img/base/loading.gif">
  30. </div>
  31. <div class="container clear" v-else>
  32. <div class="title">升级会员机构</div>
  33. <div class="title-tips"><p>补充以下详细信息即可升级为会员机构,享受更多更好的服务</p></div>
  34. <div class="registerClub clear">
  35. <form>
  36. <div class="formLine">
  37. <p><em>*</em>邮箱:</p>
  38. <input type="text" v-model.trim="clubUpgradeUser.contractEmail" placeholder="请输入邮箱地址" :rule="rule.email" maxlength="50" @blur="blurHandle($event)" needverify>
  39. <i class="checked icon mIcon"></i>
  40. <span class="errTips icon mIcon" tips="请输入正确的邮箱地址"></span>
  41. </div>
  42. <div class="formLine">
  43. <p><em>*</em>机构名称:</p>
  44. <input type="text" v-model.trim="clubUpgradeUser.name" placeholder="请与营业执照的注册名称保持一致" :rule="rule.name" maxlength="50" @blur="blurHandle($event)" needverify>
  45. <i class="checked icon mIcon"></i>
  46. <span class="errTips icon mIcon" tips="请输入机构名称"></span>
  47. </div>
  48. <div class="formLine">
  49. <p>机构简称:</p>
  50. <input type="text" v-model.trim="clubUpgradeUser.shortName" placeholder="请输入机构简称" :rule="rule.name" maxlength="50" needverify>
  51. </div>
  52. <div class="formLine">
  53. <p><em>*</em>联系地址:</p>
  54. <div class="address">
  55. <select name="provinceID" id="cProvince" @change="province" v-model="clubUpgradeUser.provinceId">
  56. <option value="0" >请选择</option>
  57. <option v-for="(item ,index) in provinceArray" :key="index" :value='item.provinceID' >{{item.name}}</option>
  58. </select>
  59. <select name="cityID" id="cCity" @change="getcity($event)" v-model="clubUpgradeUser.cityId">
  60. <option value="0" >请选择</option>
  61. <option v-for="(item ,index) in cityArray" :key="index" :value="item.cityID" >{{item.name}}</option>
  62. </select>
  63. <select name="townID" id="cTown" @change="getcTown($event)" v-model="clubUpgradeUser.townId">
  64. <option value="0" >请选择</option>
  65. <option v-for="(item ,index) in townArray" :key="index" :value="item.townID" >{{item.name}}</option>
  66. </select>
  67. <textarea placeholder="建议您如实填写详细地址,例如:街道名称,门牌号码,楼层和房间号等信息" v-model="clubUpgradeUser.address"></textarea>
  68. </div>
  69. <i class="checked icon mIcon"></i>
  70. <span class="errTips icon mIcon" tips="" :class="flagshow?'show':''">请输入正确的联系地址</span>
  71. </div>
  72. <div class="formLine">
  73. <p><em>*</em>营业执照:</p>
  74. <input type="text" v-model.trim="clubUpgradeUser.socialCreditCode" placeholder="请输入统一社会信用代码" maxlength="18">
  75. <i class="checked icon mIcon"></i>
  76. <span class="errTips icon mIcon" tips="请输入统一社会信用代码"></span>
  77. </div>
  78. <div class="formLine clear">
  79. <div class="form-upload">
  80. <p><em>*</em>营业执照图片:</p>
  81. <div class="form-upload-image" v-if="clubUpgradeUser.businessLicense!=''&&clubUpgradeUser.businessLicense!=null">
  82. <img class="upload-img" :src="clubUpgradeUser.businessLicense" alt="" id="businessLicenseImage" @click="showViewerImageFn()">
  83. <i class="icon mIcon" @click="deleteBusinessImage()"></i>
  84. </div>
  85. <div class="formLine-file" v-else>
  86. <input ref="businessLicenseImage" class="file" type="file" accept="image/png,image/jpeg,image/gif,image/jpg" @change="uploadBusinessLicenseImageFn">
  87. <i class="icon mIcon file-biss"></i>
  88. </div>
  89. <span class="errTips icon mIcon" :class="businessflag?'show':''" >请上传营业执照图片</span>
  90. </div>
  91. <div class="form-upload-tips">
  92. <i class="icon mIcon icon-wen"></i>
  93. <div class="wen-tips">点击图片可放大图片</div>
  94. </div>
  95. </div>
  96. <div class="formLine clear">
  97. <div class="form-upload">
  98. <p>门头照:</p>
  99. <div class="form-upload-image" v-if="clubUpgradeUser.shopPhoto!='' && clubUpgradeUser.shopPhoto!=null">
  100. <img class="upload-img" :src="clubUpgradeUser.shopPhoto" alt="" id="uploadMentuzImage" @click="showViewerImageFn1()">
  101. <i class="icon mIcon" @click="deleteMentuzImage()"></i>
  102. </div>
  103. <div class="formLine-file" v-else>
  104. <input ref="businessMentuImage" class="file" type="file" accept="image/png,image/jpeg,image/gif,image/jpg" @change="uploadMentuzImageFn">
  105. <i class="icon mIcon file-door"></i>
  106. </div>
  107. </div>
  108. </div>
  109. <div class="formLine">
  110. <p><em>*</em>机构类型:</p>
  111. <label class="diyBox"><input type="radio" name="firstShopType" v-model="clubUpgradeUser.firstClubType" value="1" ><i class="icon mIcon">医美</i></label>
  112. <label class="diyBox"><input type="radio" name="firstShopType" v-model="clubUpgradeUser.firstClubType" value="2" checked><i class="icon mIcon">生美</i></label>
  113. <span class="errTips icon mIcon" tips="" :class="typeflag?'show':''">请选择公司类型</span>
  114. </div>
  115. <div v-show="clubUpgradeUser.firstClubType == 1" class="formLine">
  116. <label class="diyBox second"><input type="radio" name="secondClubType" v-model="clubUpgradeUser.secondClubType" value="1" checked><i class="icon mIcon">诊所</i></label>
  117. <label class="diyBox second"><input type="radio" name="secondClubType" v-model="clubUpgradeUser.secondClubType" value="2" ><i class="icon mIcon">门诊</i></label>
  118. <label class="diyBox second"><input type="radio" name="secondClubType" v-model="clubUpgradeUser.secondClubType" value="3" ><i class="icon mIcon">医院</i></label>
  119. <span class="errTips icon mIcon" tips="" :class="secondtypeflag?'show':''">请选择公司类型</span>
  120. </div>
  121. <div v-show="clubUpgradeUser.firstClubType == 1" class="formLine">
  122. <div class="form-upload">
  123. <p>资质:</p>
  124. <div class="form-upload-image" v-if="clubUpgradeUser.medicalPracticeLicense!=''&&clubUpgradeUser.medicalPracticeLicense!=null">
  125. <img class="upload-img" :src="clubUpgradeUser.medicalPracticeLicense" alt="" id="medicalPracticeLicenseImg" @click="showViewerImageFn2()">
  126. <i class="icon mIcon" @click="deleteMedicalImage()"></i>
  127. </div>
  128. <div class="formLine-file" v-else>
  129. <input ref="businessMedicaImage" class="file" type="file" accept="image/png,image/jpeg,image/gif,image/jpg" @change="uploadMedicaImageFn">
  130. <i class="icon mIcon file-zizhi"></i>
  131. </div>
  132. <span class="errTips icon mIcon"></span>
  133. </div>
  134. <div class="form-upload-tips">
  135. <i class="icon icon-wen"></i>
  136. <div class="wen-tips">点击图片可放大图片</div>
  137. </div>
  138. </div>
  139. <div v-if="clubUpgradeUser.secondClubType == 2 || clubUpgradeUser.secondClubType == 3" class="formLine">
  140. <p>科室:</p>
  141. <input type="text" v-model.trim="clubUpgradeUser.department" placeholder="请填写您所经营的科室,用逗号隔开.(至少三个)" maxlength="50">
  142. </div>
  143. <div class="formLine clear" v-if="clubUpgradeUser.firstClubType == 1">
  144. <p><em>*</em>主营内容:</p>
  145. <p class="business clear">
  146. <label v-for="pro in medicaCampNullList" class="diyBox second" >
  147. <input type="checkbox" name="secondClubType" v-model="userMainPros" :value="pro.name" >
  148. <i class="icon mIcon">{{pro.name}}</i>
  149. </label>
  150. </p>
  151. <p class="business">
  152. <input type="text" placeholder="请输入其他自定义品项目" v-model.trim="mainProEdit">
  153. <a href="javascript:void(0);" @click="mainProAdd()">确认添加</a>
  154. </p>
  155. <span class="errTips icon mIcon" tips="" :class="mproflag?'show':''">请选择或添加主营产品</span>
  156. </div>
  157. <div class="formLine clear" v-if="clubUpgradeUser.firstClubType == 2">
  158. <p><em>*</em>主营内容:</p>
  159. <p class="business clear">
  160. <label v-for="pro in mentuzCampNullList" class="diyBox second">
  161. <input type="checkbox" name="secondClubType" v-model="userMainPros" :value="pro.name" >
  162. <i class="icon mIcon">{{pro.name}}</i>
  163. </label>
  164. </p>
  165. <p class="business">
  166. <input type="text" placeholder=" 请输入其他自定义主营内容" v-model.trim="mainProEdit">
  167. <a href="javascript:void(0);" @click="mainProAdd()">确认添加</a>
  168. </p>
  169. <span class="errTips icon mIcon" tips="" :class="userMainProflag?'show':''">请选择或添加主营产品</span>
  170. </div>
  171. <div class="subLine">
  172. <button class="btn" type="button" @click="SubComfirUpgradeFn()" onclick="_czc.push(['_trackEvent','升级页面','点击','用户确认升级','','Um_Event_ConfirmClubUpgrade'])">确认升级并提交审核</button>
  173. </div>
  174. </form>
  175. </div>
  176. </div>
  177. </div>
  178. </div>
  179. </div>
  180. </div>
  181. <!-- 引入底部 -->
  182. <template th:replace="components/footer"></template>
  183. <template th:replace="components/foot-link"></template>
  184. <script charset="utf-8" type="text/javascript" th:src="@{/js/center.js(v=${version})}"></script>
  185. <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/user.service.js(v=${version})}"></script>
  186. <script charset="utf-8" type="text/javascript" th:src="@{/js/user-center/setting/upgrade.js(v=${version})}"></script>
  187. </body>
  188. </html>