StepThird.vue 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737
  1. <template>
  2. <!--最后一步-->
  3. <div class="section" style="overflow-y: auto;position: absolute;height: 100%;">
  4. <div class="step-last">
  5. <!--<h4 class="h4">免费开店</h4>
  6. <p class="title">申请开店完全免费,一个企业只能开一家店,申请到正式开通预计需1-3个工作日。了解更多请看《开店规则》</p>-->
  7. </div>
  8. <!--<div class="radioCheck">-->
  9. <!--<label for="1" class="radioLabel">-->
  10. <!--<input type="radio" v-model="selectFlag" name="role" value="open" id="1"/>-->
  11. <!--<label for="1" class="txtContact"></label>-->
  12. <!--<span>免费开店</span>-->
  13. <!--</label>-->
  14. <!--<label for="2" class="radioLabel">-->
  15. <!--<input type="radio" v-model="selectFlag" name="role" value="seller" id="2" checked/>-->
  16. <!--<label for="2" class="txtContact"></label>-->
  17. <!--<span>暂不开店直接寄售</span>-->
  18. <!--</label>-->
  19. <!--</div>-->
  20. <!--导入店铺模板-->
  21. <div class="mobile-vendor_store_apply" v-show="selectFlag == 'open'">
  22. <div>
  23. <!-- Nav tabs -->
  24. <ul class="nav nav-tabs" v-show="false">
  25. <li><div style="height: 39px;line-height: 39px;font-size: 14px;">店铺类型:</div></li>
  26. <li class="custom_tab" :class="{active: tab == 'ORIGINAL_FACTORY'}" @click="toggleTab('ORIGINAL_FACTORY')">
  27. <a href="javascript:void(0)">原厂</a>
  28. </li>
  29. <li class="custom_tab" :class="{active: tab == 'AGENCY'}" @click="toggleTab('AGENCY')">
  30. <a href="javascript:void(0)">代理商</a>
  31. </li>
  32. <li class="custom_tab" :class="{active: tab == 'DISTRIBUTION'}" @click="toggleTab('DISTRIBUTION')">
  33. <a href="javascript:void(0)">经销商</a>
  34. </li>
  35. </ul>
  36. <!-- Tab panes -->
  37. <div class="mobile-tab-content">
  38. <!-- 原厂 -->
  39. <div role="tabpanel" class="tab-pane" v-if="tab == 'ORIGINAL_FACTORY'" :class="{active: tab == 'ORIGINAL_FACTORY'}">
  40. <div class="row com_row">
  41. <div class="custom_col">
  42. <div class="wrap-title"><span class="line"></span>营业执照</div>
  43. <div class="clearfix" style="margin: 0 0.25rem">
  44. <div class="show_image_area show_image pull-left">
  45. <upload ref="Pom" :typeData="'BUSINESS_LICENSE'" :url="businessLicenseUrl" @uploadAction="onUpload"></upload>
  46. </div>
  47. <div class="pull-left infoTextMobile" style="width: 5.1rem;margin-left: 0.2rem">
  48. <em style="color: #FF0000;">*</em>如已上传最新版营业执照(三证合一),则其他两证无需上传;仅支持上传JPG、PNG、GIF、PDF格式,每张大小不超过3M
  49. </div>
  50. <!--<div class="col-md-5" style="padding: 0;">-->
  51. <!--<span style="margin-top: 50%;padding-right: 20px;">营业执照<em style="color: #FF0000;">*</em></span>-->
  52. <!--</div>-->
  53. </div>
  54. </div>
  55. <div class="custom_col">
  56. <div class="wrap-title"><span class="line"></span>纳税人证明</div>
  57. <div class="" style="margin: 0 0.25rem">
  58. <div class="show_image_area show_image">
  59. <upload ref="Pom" :typeData="'TAX_PAYER'" @uploadAction="onUpload"></upload>
  60. </div>
  61. </div>
  62. </div>
  63. <div class="custom_col">
  64. <div class="wrap-title"><span class="line"></span>税务登记证</div>
  65. <div class="" style="margin: 0 0.25rem">
  66. <div class="show_image_area show_image">
  67. <upload ref="Pom" :typeData="'TAX_REGISTRATION'" @uploadAction="onUpload"></upload>
  68. </div>
  69. <!--<div class="col-md-5" style="padding: 0;">-->
  70. <!--<span style="margin-top: 50%;padding-right: 20px;">税务登记证</span>-->
  71. <!--</div>-->
  72. </div>
  73. </div>
  74. <!--<div class="col-md-12"><em>* </em>如已上传最新版营业执照(三证合一),则其他两证无需上传 ; 仅支持JPG、PNG、GIF、PDF格式,每张大小不超过3M</div>-->
  75. </div>
  76. <!--增加品牌-->
  77. <div class="custom_col brand-type" v-for="(brand, index) in brands" style="margin-top: 0px">
  78. <div class="wrap-title"><span class="line"></span>品牌{{index+1}}</div>
  79. <!--<div class="col-md-1">品牌{{index+1}}<em v-if="index == 0">*</em></div>-->
  80. <div class="" style="margin: 0px 0.25rem;position: relative">
  81. <div class="mobile-register-brand-name">品牌名称:<input @input="onBrandInput(brand, index)"
  82. @blur.stop.prevent="onBrandChanged(brand, index)"
  83. type="text" v-model="brand.name"
  84. placeholder="请输入英文品牌或中文品牌"
  85. name="brandName" />
  86. </div>
  87. <!--<input type="text" v-model="brand.name"-->
  88. <!--@input="onBrandInput(brand, index)"-->
  89. <!--@blur.stop.prevent="onBrandChanged(brand, index)"-->
  90. <!--class="form-control" name="brandName" autocomplete="off" placeholder="请输入英文品牌或中文品牌,如:松下; panasonic等"/>-->
  91. <ul class="dropdown-menu"
  92. v-show="showSimilarKey.flag && showSimilarKey.index == index"
  93. @mouseenter="showFlag = true"
  94. @mouseleave="showFlag = false">
  95. <li @mouseenter="setKeyActive"
  96. @mouseleave="setKeyDefault"
  97. @click.stop.prevent="changedName(brand, index, key_index)"
  98. v-for="(key, key_index) in similarKeys[index]">
  99. <a v-text="key.nameCn">
  100. <!--<strong>C</strong>apital Advan<strong>c</strong>ed-->
  101. </a>
  102. </li>
  103. </ul>
  104. </div>
  105. <div class="brand-small-upload clearfix" style="margin: 0.1rem 0.25rem 0 0.25rem">
  106. <div class="brand-small-img">
  107. <upload ref="Pom" :typeData="index" @uploadAction="onUpload" :NopassThree="true"></upload>
  108. </div>
  109. <div class="file-text">品牌logo/商标注册原件/授权说明书</div>
  110. <div v-show="brands.length > 1" @click="deleteBrand(index)" class="delete" title="删除" style="float: right;text-align: center;line-height: 1.09rem;height: 1.09rem;padding-top: 0.36rem;"><i class="fa fa-trash"></i></div>
  111. <!--<div class="col-md-12"><em v-if="index == 0">*</em>仅支持JPG、PNG、GIF、PDF格式,大小不超过3M</div>-->
  112. </div>
  113. </div>
  114. <div class="add-brand" @click="addBrand">
  115. <i class="fa fa-plus-circle"></i>增加品牌
  116. <!--<a href="javascript:void(0)" title="增加品牌" @click="addBrand"><em><i class="fa fa-plus-circle"></i>增加品牌</em></a>-->
  117. </div>
  118. <div class="unpass-reason row" style="display: none">
  119. 原因:<span style="color: #d32526;">原因</span>
  120. </div>
  121. </div>
  122. <!--原厂end-->
  123. <!--代理商 begin-->
  124. <div role="tabpanel" class="tab-pane" v-if="tab == 'AGENCY'" :class="{active: tab == 'AGENCY'}">
  125. <div class="row com_row">
  126. <div class="custom_col">
  127. <div class="wrap-title"><span class="line"></span>营业执照</div>
  128. <div class="clearfix" style="margin: 0 0.25rem">
  129. <div class="show_image_area show_image pull-left">
  130. <upload ref="Pom" :typeData="'BUSINESS_LICENSE'" :url="businessLicenseUrl" @uploadAction="onUpload" :NopassThree="true"></upload>
  131. </div>
  132. <div class="pull-left infoTextMobile" style="width: 5.1rem;margin-left: 0.2rem">
  133. <em style="color: #FF0000;">*</em>如已上传最新版营业执照(三证合一),则其他两证无需上传;仅支持上传JPG、PNG、GIF、PDF格式,每张大小不超过3M
  134. </div>
  135. <!--<div class="" style="padding: 0;">-->
  136. <!--<span style="margin-top: 50%;padding-right: 20px;">营业执照<em style="color: #FF0000;">*</em></span>-->
  137. <!--</div>-->
  138. </div>
  139. </div>
  140. <div class="custom_col">
  141. <div class="wrap-title"><span class="line"></span>纳税人证明</div>
  142. <div class="" style="margin: 0 0.25rem">
  143. <div class="show_image_area show_image">
  144. <upload ref="Pom" :typeData="'TAX_PAYER'" @uploadAction="onUpload" :NopassThree="true"></upload>
  145. </div>
  146. </div>
  147. </div>
  148. <div class="custom_col">
  149. <div class="wrap-title"><span class="line"></span>税务登记证</div>
  150. <div class="" style="margin: 0 0.25rem">
  151. <div class="show_image_area show_image">
  152. <upload ref="Pom" :typeData="'TAX_REGISTRATION'" @uploadAction="onUpload" :NopassThree="true"></upload>
  153. </div>
  154. <!--<div class="col-md-5" style="padding: 0;">-->
  155. <!--<span style="margin-top: 50%;padding-right: 20px;">税务登记证</span>-->
  156. <!--</div>-->
  157. </div>
  158. </div>
  159. <!--<div class=""><em>* </em>如已上传最新版营业执照(三证合一),则其他两证无需上传 ; 仅支持JPG、PNG、GIF、PDF格式,每张大小不超过3M</div>-->
  160. </div>
  161. <!--增加品牌-->
  162. <div class="custom_col brand-type" v-for="(brand, index) in brands" style="margin-top: 0px">
  163. <!--<div class="col-md-1">品牌{{index+1}}<em>*</em></div>-->
  164. <div class="wrap-title"><span class="line"></span>品牌{{index+1}}</div>
  165. <div class="" style="margin: 0px 0.25rem;position: relative">
  166. <div class="mobile-register-brand-name">品牌名称:<input type="text" v-model="brand.name"
  167. @input="onBrandInput(brand, index)"
  168. @blur.stop.prevent="onBrandChanged(brand, index)"
  169. placeholder="请输入英文品牌或中文品牌"
  170. name="brandName" />
  171. </div>
  172. <!--<input type="text" v-model="brand.name"-->
  173. <!--@input="onBrandInput(brand, index)"-->
  174. <!--@blur.stop.prevent="onBrandChanged(brand, index)"-->
  175. <!--class="form-control" name="brandName" autocomplete="off" placeholder="请输入英文品牌或中文品牌,如:松下; panasonic等"/>-->
  176. <ul class="dropdown-menu"
  177. v-show="showSimilarKey.flag && showSimilarKey.index == index"
  178. @mouseenter="showFlag = true"
  179. @mouseleave="showFlag = false">
  180. <li @mouseenter="setKeyActive"
  181. @mouseleave="setKeyDefault"
  182. v-for="(key, key_index) in similarKeys[index]">
  183. <a v-text="key.nameCn" @click.stop.prevent="changedName(brand, index, key_index)">
  184. <!--<strong>C</strong>apital Advan<strong>c</strong>ed-->
  185. </a>
  186. </li>
  187. </ul>
  188. </div>
  189. <div class="brand-small-upload clearfix" style="margin: 0.1rem 0.25rem 0 0.25rem">
  190. <div class="brand-small-img">
  191. <upload ref="Pom" :typeData="index" @uploadAction="onUpload" :NopassThree="true"></upload>
  192. </div>
  193. <div class="file-text">代理资格证/代理授权书</div>
  194. <div v-show="brands.length > 1" @click="deleteBrand(index)" class="delete" title="删除"><i class="fa fa-trash"></i></div>
  195. <!--<div class="col-md-12"> <em>*</em>仅支持JPG、PNG、GIF、PDF格式,大小不超过3M</div>-->
  196. </div>
  197. </div>
  198. <div class="add-brand" @click="addBrand">
  199. <i class="fa fa-plus-circle"></i>增加品牌
  200. <!--<a href="javascript:void(0)" title="增加品牌" @click="addBrand"><em><i class="fa fa-plus-circle"></i>增加品牌</em></a>-->
  201. </div>
  202. <!--<div class="add-brand row">-->
  203. <!--<a href="javascript:void(0)" title="增加品牌" @click="addBrand"><em><i class="fa fa-plus-circle"></i>增加品牌</em></a>-->
  204. <!--</div>-->
  205. <div class="unpass-reason row" style="display: none">
  206. 原因:<span style="color: #d32526;">原因</span>
  207. </div>
  208. </div>
  209. <!--代理商 end-->
  210. <!--经销商 begin-->
  211. <div role="tabpanel" class="tab-pane" v-if="tab == 'DISTRIBUTION'" :class="{active: tab == 'DISTRIBUTION'}">
  212. <div class="row com_row">
  213. <div class="custom_col">
  214. <div class="wrap-title"><span class="line"></span>营业执照</div>
  215. <div class="clearfix" style="margin: 0 0.25rem">
  216. <div class="show_image_area show_image pull-left">
  217. <upload ref="Pom" :typeData="'BUSINESS_LICENSE'" :url="businessLicenseUrl" @uploadAction="onUpload" :NopassThree="true"></upload>
  218. </div>
  219. <div class="pull-left infoTextMobile" style="width: 5.1rem;margin-left: 0.2rem">
  220. <em style="color: #FF0000;">*</em>如已上传最新版营业执照(三证合一),则其他两证无需上传;仅支持上传JPG、PNG、GIF、PDF格式,每张大小不超过3M
  221. </div>
  222. <!--<div class="col-md-5" style="padding: 0;">-->
  223. <!--<span style="margin-top: 50%;padding-right: 20px;">营业执照<em style="color: #FF0000;">*</em></span>-->
  224. <!--</div>-->
  225. </div>
  226. </div>
  227. <div class="custom_col">
  228. <div class="wrap-title"><span class="line"></span>纳税人证明</div>
  229. <div class="" style="margin: 0 0.25rem">
  230. <div class="show_image_area show_image">
  231. <upload ref="Pom" :typeData="'TAX_PAYER'" @uploadAction="onUpload" :NopassThree="true"></upload>
  232. </div>
  233. </div>
  234. </div>
  235. <div class="custom_col">
  236. <div class="wrap-title"><span class="line"></span>税务登记证</div>
  237. <div class="" style="margin: 0 0.25rem">
  238. <div class="show_image_area show_image">
  239. <upload ref="Pom" :typeData="'TAX_REGISTRATION'" @uploadAction="onUpload" :NopassThree="true"></upload>
  240. </div>
  241. <!--<div class="col-md-5" style="padding: 0;">-->
  242. <!--<span style="margin-top: 50%;padding-right: 20px;">税务登记证</span>-->
  243. <!--</div>-->
  244. </div>
  245. </div>
  246. <!--<div class="col-md-12"><em>* </em>如已上传最新版营业执照(三证合一),则其他两证无需上传 ; 仅支持JPG、PNG、GIF、PDF格式,每张大小不超过3M</div>-->
  247. </div>
  248. </div>
  249. <!--经销商 end-->
  250. </div>
  251. <!-- Submit button -->
  252. <!-- <div style="padding: 28px 40px;">
  253. <button type="button" class="btn btn-primary" style="float: right" @click="submitApply">提交申请</button>
  254. <div class="clear-fix"></div>
  255. </div>-->
  256. </div>
  257. <!--删除上传图片-->
  258. <div class="com-del-box" style="display: none">
  259. <div class="title">
  260. <a><i class="fa fa-close fa-lg"></i></a>
  261. </div>
  262. <div class="content">
  263. <p><i class="fa fa-exclamation-circle"></i>是否删除选中信息</p>
  264. <div><a>取消</a><a>确认</a></div>
  265. </div>
  266. </div>
  267. <!--删除品牌图片-->
  268. <div class="com-del-box" style="display: none">
  269. <div class="title">
  270. <a><i class="fa fa-close fa-lg"></i></a>
  271. </div>
  272. <div class="content">
  273. <p><i class="fa fa-exclamation-circle"></i>品牌信息为重要信息,确定删除吗?</p>
  274. <div><a>取消</a><a>确认</a></div>
  275. </div>
  276. </div>
  277. <!--提示框-->
  278. <div class="com-del-box" v-if="false">
  279. <div class="title">
  280. <a @click="showBrandNameInvalid = false"><i class="fa fa-close fa-lg"></i></a>
  281. </div>
  282. <div class="content">
  283. <p style="line-height: 20px;margin-top: 10px;padding:0 10px">非常抱歉,目前暂无此品牌!<br>若直接前往“品牌申请”,我们将为您先开通寄售功能,待申请通过后再提交开店申请。</p>
  284. <p style="line-height: 20px;">前往<a @click="goBrandApply()" target="_blank" style="color: #5078CB">品牌申请&nbsp;<i class="fa fa-arrow-right"></i></a></p>
  285. </div>
  286. </div>
  287. </div>
  288. <!--<div class="step-last">
  289. <h4 class="h4">库存寄售</h4>
  290. <p class="title">无需开店,即可发布贵司仓库里的滞销产品,优软商城代为销售,匿名清仓无压力<button class="no-apply" @click="goProduct">暂不开店,直接寄售</button></p>
  291. </div>-->
  292. <div class="btn-area">
  293. <span @click="sectionChange(3)" style="background: #c1c1c1;border:#c1c1c1">上一步</span>
  294. <!--<span @click="btnDisabled?'':selectFlag == 'open'?submitApply():goProduct()" :class="btnDisabled?'btn-disabled':''">提交申请</span>-->
  295. </div>
  296. <div class="btn-area">
  297. <!--<span @click="sectionChange(2)">上一步</span>-->
  298. <span @click="btnDisabled?'':selectFlag == 'open'?submitApply():goProduct()" :class="btnDisabled?'btn-disabled':''">提交申请</span>
  299. </div>
  300. <div class="loading" v-show="showLoading">
  301. <!--<img src="/images/all/loading.gif" alt="">-->
  302. </div>
  303. <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
  304. </div>
  305. </template>
  306. <script>
  307. import { RemindBox } from '~components/mobile/common'
  308. import Upload from '~components/common/upload/upload.vue'
  309. export default {
  310. // props: {
  311. // tab: {
  312. // default: 'ORIGINAL_FACTORY'
  313. // }
  314. // },
  315. data () {
  316. return {
  317. // tab: 'AGENCY',
  318. collectResult: '',
  319. timeoutCount: 0,
  320. brands: [{
  321. type: 'BRAND',
  322. name: '',
  323. url: '',
  324. isPdf: false,
  325. brandUuid: ''
  326. }],
  327. businessLicenseUrl: '',
  328. taxPayerUrl: '',
  329. taxRegistrationUrl: '',
  330. // defaultBusinessUrl: '',
  331. showBrandNameInvalid: false,
  332. similarKeys: [[]],
  333. showSimilarKey: {
  334. flag: false,
  335. index: 0
  336. },
  337. showFlag: false,
  338. isSelfRegisterSuccess: true,
  339. selectFlag: 'open',
  340. showLoading: false,
  341. btnDisabled: false
  342. }
  343. },
  344. props: [
  345. 'checkData',
  346. 'registerData',
  347. 'loginData',
  348. 'enterpriseData',
  349. 'businessImgUrl',
  350. 'tab'
  351. ],
  352. watch: {
  353. enterpriseData: function (val, oldVal) {
  354. if (val !== {}) {
  355. console.log(1)
  356. this.businessLicenseUrl = val.url || val.businessCodeImage || ''
  357. // this.defaultBusinessUrl = val.enBussinessCodeImage || ''
  358. }
  359. },
  360. businessImgUrl: function (val, oldVal) {
  361. console.log(2)
  362. this.businessLicenseUrl = val
  363. }
  364. },
  365. components: {
  366. Upload,
  367. RemindBox
  368. },
  369. computed: {
  370. user () {
  371. return this.$store.state.option.user
  372. }
  373. },
  374. methods: {
  375. clearInfo() {
  376. this.brands = [{
  377. type: 'BRAND',
  378. name: '',
  379. url: '',
  380. isPdf: false,
  381. brandUuid: ''
  382. }]
  383. this.businessLicenseUrl = ''
  384. this.taxPayerUrl = ''
  385. this.taxRegistrationUrl = ''
  386. console.log('clear')
  387. // for (let i = 0; i < this.$refs.Pom.length; i++) {
  388. // this.$refs.Pom[i].clearInfo()
  389. // }
  390. },
  391. sectionChange: function (type) {
  392. this.$emit('sectionEvent', type)
  393. },
  394. toggleTab (t) {
  395. this.tab = t
  396. this.brands = [{
  397. type: 'BRAND',
  398. name: '',
  399. url: '',
  400. isPdf: false,
  401. brandUuid: ''
  402. }]
  403. },
  404. onUpload: function (obj) {
  405. if (obj.type === 'BUSINESS_LICENSE') {
  406. // this.businessLicenseUrl = obj.url
  407. this.businessLicenseUrl = obj.url
  408. if (obj.url !== '') {
  409. this.$emit('businessImgUrlAction', this.businessLicenseUrl)
  410. }
  411. } else if (obj.type === 'TAX_PAYER') {
  412. this.taxPayerUrl = obj.url
  413. } else if (obj.type === 'TAX_REGISTRATION') {
  414. this.taxRegistrationUrl = obj.url
  415. } else if (typeof obj.type === 'number') {
  416. this.brands[obj.type].url = obj.url
  417. }
  418. },
  419. onBrandChanged: function (item, index) {
  420. this.showSimilarKey.flag = this.showFlag
  421. if (!this.showFlag) {
  422. this.onCheck(item)
  423. }
  424. },
  425. onCheck: function (item, index) {
  426. if (item.name && item.name !== '') {
  427. this.$http.get('/api/product/brand', {params: {name: item.name, op: 'by_name'}})
  428. .then(response => {
  429. item.brandUuid = response.data.uuid
  430. item.isPdf = item.url.substring(item.url.length - 4, item.url.length) === '.pdf'
  431. }, err => {
  432. console.log(err)
  433. this.showBrandNameInvalid = true
  434. })
  435. }
  436. },
  437. onBrandInput: function (brand, index) {
  438. this.showSimilarKey.flag = false
  439. this.$http.get('/search/similarBrands?keyword=' + brand.name)
  440. .then(response => {
  441. if (response.data.length > 0 && response.data instanceof Array) {
  442. this.similarKeys[index] = response.data
  443. }
  444. if (response.data.length > 0 && response.data instanceof Array) {
  445. this.showSimilarKey.flag = true
  446. this.showSimilarKey.index = index
  447. }
  448. })
  449. },
  450. changedName: function (brand, index, keyIndex) {
  451. brand.name = this.similarKeys[index][keyIndex].nameCn
  452. this.showSimilarKey.flag = false
  453. this.onCheck(brand)
  454. },
  455. setKeyActive: function (e) {
  456. e.target.setAttribute('class', 'active')
  457. },
  458. setKeyDefault: function (e) {
  459. e.target.setAttribute('class', '')
  460. },
  461. submitApply: function () {
  462. // 个人
  463. if (this.loginData.isSelf) {
  464. if (!this.registerData.isValidRegister) {
  465. // this.$message.error('请输入正确的注册信息')
  466. this.collectResult = '请输入正确的注册信息'
  467. this.timeoutCount++
  468. } else if (!this.checkData.checked) {
  469. // this.$message.error('您还没有勾选相关条款')
  470. this.collectResult = '您还没有勾选相关条款'
  471. this.timeoutCount++
  472. } else {
  473. // 注册企业,并提交申请
  474. this.registerSelf()
  475. }
  476. } else {
  477. // 企业
  478. if (!this.checkData.checked) {
  479. // this.$message.error('您还没有勾选相关条款')
  480. this.collectResult = '您还没有勾选相关条款'
  481. this.timeoutCount++
  482. } else {
  483. // 提交申请
  484. this.storeApply(this.loginData.enterprise.uu)
  485. }
  486. }
  487. },
  488. // 个人用户,先注册企业,成功后,提交开店申请
  489. registerSelf: function () {
  490. this.showLoading = true
  491. this.$http.post('/basic/enterprise/register?filePath=' + this.registerData.url, this.registerData.enterprise)
  492. .then(response => {
  493. if (response.data.success) {
  494. this.isSelfRegisterSuccess = true
  495. // 删除保存的缓存企业信息
  496. this.$http.delete('/basic/user/userCacheEnterprise')
  497. // 把当前用户登录企业信息切换为注册的企业
  498. this.$http.get(`/user/authentication/` + response.data.data.enuu).then(() => {
  499. // 重新获取登录用户信息
  500. this.$store.dispatch('loadUserInfo')
  501. this.loginData.isSelf = false
  502. this.loginData.enterprise.uu = response.data.data.enuu
  503. // 提交开店申请
  504. this.storeApply(response.data.data.enuu)
  505. // window.location.reload()
  506. this.showLoading = false
  507. })
  508. } else {
  509. this.isSelfRegisterSuccess = false
  510. this.showLoading = false
  511. // this.$message.error(response.data.message || '企业注册失败,请重新填写信息')
  512. this.collectResult = response.data.message || '企业注册失败,请重新填写信息'
  513. this.timeoutCount++
  514. }
  515. }, err => {
  516. console.log(err)
  517. this.isSelfRegisterSuccess = false
  518. this.showLoading = false
  519. this.collectResult = '企业注册失败,请重新填写信息'
  520. this.timeoutCount++
  521. // this.$message.error('企业注册失败,请重新填写信息')
  522. })
  523. },
  524. storeApply: function (enuu) {
  525. this.showLoading = true
  526. let validCode = 0
  527. if (this.businessLicenseUrl === '') {
  528. // this.$message.error('请上传营业执照')
  529. this.collectResult = '请上传营业执照'
  530. this.timeoutCount++
  531. this.showLoading = false
  532. } else {
  533. if (this.brands[0].name === '') {
  534. validCode = 1
  535. } else if (this.brands[0].url === '') {
  536. validCode = 2
  537. }
  538. if (validCode === 0 || this.tab === 'DISTRIBUTION') {
  539. let qualifications = []
  540. qualifications.push({
  541. type: 'BUSINESS_LICENSE',
  542. resourceUrl: this.businessLicenseUrl,
  543. isPdf: this.isPdf(this.businessLicenseUrl)
  544. })
  545. if (this.taxPayerUrl !== '') {
  546. qualifications.push({
  547. type: 'TAX_PAYER',
  548. resourceUrl: this.taxPayerUrl,
  549. isPdf: this.isPdf(this.taxPayerUrl)
  550. })
  551. }
  552. if (this.taxPayerUrl !== '') {
  553. qualifications.push({
  554. type: 'TAX_REGISTRATION',
  555. resourceUrl: this.taxRegistrationUrl,
  556. isPdf: this.isPdf(this.taxRegistrationUrl)
  557. })
  558. }
  559. // console.log(qualifications)
  560. let tmpBrands = []
  561. this.brands.forEach(function (item) {
  562. if (item.name !== '' && item.url !== '') {
  563. tmpBrands.push(item)
  564. }
  565. })
  566. // 申请开店
  567. this.$http.post('/store-service/applications', {
  568. brands: tmpBrands,
  569. qualifications: qualifications,
  570. type: this.tab
  571. }).then(response => {
  572. this.showLoading = false
  573. if (response.data.success) {
  574. this.btnDisabled = true
  575. this.collectResult = '感谢您对优软商城的支持,我们会尽快对您提交的信息进行审核,预计审核时间为3个工作日,审核结果将以站内消息及邮件形式通知您!'
  576. this.timeoutCount++
  577. // this.push('/mobile/')
  578. // this.$message.success('感谢您对优软商城的支持,我们会尽快对您提交的信息进行审核,预计审核时间为3个工作日,审核结果将以站内消息及邮件形式通知您!')
  579. } else {
  580. this.btnDisabled = true
  581. this.collectResult = '开通店铺异常,请前往PC端,我的店铺查看店铺开通进度'
  582. this.timeoutCount++
  583. // this.$message.error('开通店铺异常,请前往我的店铺查看店铺开通进度')
  584. }
  585. this.$http.post('/basic/enterprise/openVendor/' + enuu)
  586. .then(() => {
  587. setTimeout(() => {
  588. window.location.href = '/mobile/user'
  589. // this.$router.push('/mobile/user')
  590. }, 1500)
  591. })
  592. }, err => {
  593. console.log(err)
  594. this.$http.post('/basic/enterprise/openVendorSetRead/' + enuu)
  595. this.collectResult = '开通店铺失败'
  596. this.timeoutCount++
  597. // this.$message.error('开通店铺失败')
  598. this.showLoading = false
  599. })
  600. } else {
  601. if (validCode === 1) {
  602. this.collectResult = '请添加品牌信息'
  603. this.timeoutCount++
  604. // this.$message.error('请添加品牌信息')
  605. this.showLoading = false
  606. } else if (validCode === 2) {
  607. this.collectResult = '请上传品牌图片'
  608. this.timeoutCount++
  609. // this.$message.error('请上传品牌图片')
  610. this.showLoading = false
  611. }
  612. }
  613. }
  614. },
  615. addBrand: function () {
  616. this.brands.push({
  617. type: 'BRAND',
  618. name: '',
  619. url: '',
  620. isPdf: false,
  621. brandUuid: ''
  622. })
  623. this.similarKeys.push([])
  624. },
  625. deleteBrand: function (index) {
  626. this.brands.splice(index, 1)
  627. this.similarKeys.splice(index, 1)
  628. },
  629. isPdf: function (url) {
  630. return url.substring(url.length - 4, url.length) === '.pdf'
  631. },
  632. reflashEnterprise: function (enuu, url) {
  633. this.$http.post('/basic/enterprise/openVendor/' + enuu)
  634. .then(() => {
  635. this.$http.get('/user/authentication/reflash')
  636. .then(() => {
  637. this.$http.get(`/user/authentication/` + enuu).then(() => {
  638. this.$store.dispatch('loadUserInfo')
  639. // window.location.href = url
  640. this.$router.push('/mobile/user')
  641. })
  642. }
  643. )
  644. })
  645. },
  646. goProduct: function (baseUrl) {
  647. if (this.loginData.isSelf) {
  648. if (!this.registerData.isValidRegister) {
  649. this.collectResult = '请输入正确的注册信息'
  650. this.timeoutCount++
  651. // this.$message.error('请输入正确的注册信息')
  652. } else if (!this.checkData.checked) {
  653. this.collectResult = '您还没有勾选相关条款'
  654. this.timeoutCount++
  655. // this.$message.error('您还没有勾选相关条款')
  656. } else {
  657. this.showLoading = true
  658. this.$http.post('/basic/enterprise/register?filePath=' + this.registerData.url, this.registerData.enterprise)
  659. .then(response => {
  660. if (response.data.success) {
  661. this.isSelfRegisterSuccess = true
  662. this.$http.delete('/basic/user/userCacheEnterprise')
  663. this.reflashEnterprise(response.data.data.enuu, baseUrl || '/vendor#/vendor_upload')
  664. } else {
  665. this.isSelfRegisterSuccess = false
  666. this.collectResult = response.data.message || '企业注册失败,请重新填写信息'
  667. this.timeoutCount++
  668. // this.$message.error(response.data.message || '企业注册失败,请重新填写信息')
  669. }
  670. this.showLoading = false
  671. }, err => {
  672. console.log(err)
  673. this.isSelfRegisterSuccess = false
  674. this.showLoading = false
  675. this.collectResult = '企业注册失败,请重新填写信息'
  676. this.timeoutCount++
  677. // this.$message.error('企业注册失败,请重新填写信息')
  678. })
  679. }
  680. } else {
  681. if (!this.checkData.checked) {
  682. this.collectResult = '您还没有勾选相关条款'
  683. this.timeoutCount++
  684. // this.$message.error('您还没有勾选相关条款')
  685. } else {
  686. this.reflashEnterprise(this.loginData.enterprise.uu, baseUrl || '/vendor#/vendor_upload')
  687. }
  688. }
  689. },
  690. goBrandApply: function () {
  691. this.showBrandNameInvalid = false
  692. this.goProduct('/vendor#/brand/apply/')
  693. }
  694. }
  695. }
  696. </script>
  697. <style lang="scss">
  698. .mobile-vendor_store_apply{
  699. #image-box{
  700. overflow:visible;
  701. height:95vh;
  702. margin-top:0;
  703. top:2%;
  704. padding:1rem;
  705. .x-close-wrap{
  706. right:-.15rem;
  707. top:-.15rem;
  708. width:.35rem;
  709. height:.35rem;
  710. line-height: .3rem;
  711. a{
  712. font-size: .35rem;
  713. }
  714. }
  715. }
  716. .wrap-title {
  717. color: #333;
  718. font-size: 0.28rem;
  719. border-bottom: 1px solid #d3d3d3;
  720. height: 0.5rem;
  721. text-align: left;
  722. padding: 0 0 0.1rem 0.05rem;
  723. margin: 0.17rem 0.25rem 0.13rem 0.25rem;
  724. line-height: 0.5rem;
  725. .line{
  726. width: 0.05rem;
  727. background: #3f84f6;
  728. display: inline-block;
  729. vertical-align: top;
  730. margin-right: 0.08rem;
  731. height: 0.28rem;
  732. margin-top: 0.09rem;
  733. }
  734. }
  735. }
  736. </style>