index.vue 61 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289
  1. <template>
  2. <!-- 提现账号 -->
  3. <div class="shandeMchPage flex-col"
  4. :class="{ page1: pageType === '1', page2: pageType === '2', page3: pageType === '3', page4: pageType === '4' }">
  5. <s-header :name="$t('joinpayMch.settlementAccount')" :noback="false"></s-header>
  6. <div class="shandeMchBox flex-col">
  7. <div class="topSpeed" v-if="pageType !== '4'"
  8. :class="{ page1: pageType === '1', page2: pageType === '2', page3: pageType === '3' }"></div>
  9. <div v-if="pageType === '1' || pageType === '4'">
  10. <van-form @submit="saveJoinPayMchFun">
  11. <div class="van-cell van-field">
  12. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.joinpayAuditStatus') }}</span></div>
  13. <div class="van-cell__value van-field__value" style="text-align: left;">
  14. <span :style="{
  15. color: joinPayMchID != null ? (joinPayMchType == '1' ? (joinPayMchStep == '1' ? (signStatus == '签约成功' ? '#00ff80'
  16. : '#FFA500') : '#FFA500') : '#FFA500') : '#FFA500'
  17. }">
  18. {{ joinPayMchID != null ? (joinPayMchType == '1' ? (joinPayMchStep == '1' ? (signStatus == '签约成功' ? '注册成功'
  19. : '待签约') : '待上传证件图片') : '审核未通过') : '未注册' }}
  20. </span>
  21. </div>
  22. </div>
  23. <div class="van-cell van-field">
  24. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.huifuAuditStatus') }}</span></div>
  25. <div class="van-cell__value van-field__value" style="text-align: left;">
  26. <!-- <span :style="{
  27. color: huifuMchID != null ? (huifuAuditStatus == '2' ? (conStat == '5' ? '#00ff80' : '#FFA500') :
  28. (huifuAuditStatus == '0' ? '#FFA500' : (huifuAuditStatus == '1' || huifuAuditStatus == '4' ? '#FFA500' :
  29. '#FF0000'))) : '#FFA500'
  30. }">
  31. {{ huifuMchID != null ? (huifuAuditStatus == '2' ? (conStat == '5' ? '注册成功' : '待签约') :
  32. (huifuAuditStatus == '0' ? '待上传证件图片' : (huifuAuditStatus == '1' || huifuAuditStatus == '4' ? '待签约' :
  33. '审核未通过'))) : '未注册' }}
  34. </span> -->
  35. <span :style="{
  36. color: huifuMchID != null ? (huifuAuditStatus == '2' ? '#00ff80' : (huifuAuditStatus == '0' ? '#FFA500' :
  37. (huifuAuditStatus == '1' || huifuAuditStatus == '4' ? '#FFA500' :
  38. '#FF0000'))) : '#FFA500'
  39. }">
  40. {{ huifuMchID != null ? (huifuAuditStatus == '2' ? '注册成功' : (huifuAuditStatus == '0' ? '待上传证件图片' :
  41. (huifuAuditStatus == '1' || huifuAuditStatus == '4' ? '待签约' :
  42. '审核未通过'))) : '未注册' }}
  43. </span>
  44. </div>
  45. </div>
  46. <div v-if="pageType === '4'">
  47. <van-field v-model="altMchName" name="altMchName" :label="$t('joinpayMch.merchantNameLabel')" readonly />
  48. <van-field v-model="altMchNo" name="altMchNo" :label="$t('joinpayMch.merchantAccountLabel')" readonly />
  49. <!-- <van-field v-model="altMchShortName" name="altMchShortName" :label="$t('joinpayMch.merchantAbbreviationLabel')" readonly /> -->
  50. </div>
  51. <div class="intervalRow"></div>
  52. <!-- 商户类型 -->
  53. <div class="van-cell van-field requiredLeft">
  54. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.merchantType') }}</span></div>
  55. <div class="van-cell__value van-field__value radioBox">
  56. <van-radio-group v-model="altMerchantType" direction="horizontal" @change="fieldUpdate"
  57. :disabled="huifuMchID != null || joinPayMchID != null">
  58. <van-radio name="10" icon-size="18px">{{ $t('joinpayMch.personal') }}</van-radio>
  59. <!-- <van-radio name="11" icon-size="18px">{{$t('joinpayMch.individualBusinesses')}}</van-radio> -->
  60. <van-radio name="12" icon-size="18px">{{ $t('joinpayMch.enterprise') }}</van-radio>
  61. </van-radio-group>
  62. </div>
  63. </div>
  64. <div v-if="altMerchantType == 12" class="requiredLeft">
  65. <!-- 商户名称 -->
  66. <div class="cell-input">
  67. <van-popover v-model:show="regNameVisible" trigger="manual" placement="top" popover-class="custom-popover"
  68. :offset="[25,]" theme="dark">
  69. <template #reference>
  70. <van-field v-model="regNameValue" name="regNameValue" :label="$t('huifuMch.huifuRegName')"
  71. :placeholder="$t('huifuMch.huifuRegNamePlaceholder')"
  72. :rules="[{ required: true, message: $t('huifuMch.huifuRegNamePlaceholder') }]"
  73. @update:model-value="fieldUpdate" @click="showPopover(1)" />
  74. </template>
  75. {{ $t('joinpayMch.merchantNameTips') }}
  76. </van-popover>
  77. </div>
  78. <!-- 商户简称 -->
  79. <!-- <div class="cell-input">
  80. <van-popover v-model:show="shortNameVisible" trigger="manual" placement="bottom"
  81. popover-class="custom-popover" :offset="[25, 0]" theme="dark">
  82. <template #reference>
  83. <van-field v-model="shortNameValue" name="shortNameValue" :label="$t('huifuMch.shortNameLabel')"
  84. :placeholder="$t('huifuMch.shortNamePlaceholder')"
  85. :rules="[{ required: true, message: $t('huifuMch.shortNamePlaceholder') }]"
  86. @update:model-value="fieldUpdate" @click="showPopover(2)" />
  87. </template>
  88. {{ $t('joinpayMch.merchantAbbreviationTips') }}
  89. </van-popover>
  90. </div> -->
  91. <!-- 注册地址 -->
  92. <van-field v-model="registeredAddress" is-link readonly name="registeredAddress"
  93. :label="$t('huifuMch.huifuRegisteredAddress')"
  94. :placeholder="$t('huifuMch.huifuRegisteredAddressPlaceholder')"
  95. :rules="[{ required: true, message: $t('huifuMch.huifuRegisteredAddressPlaceholder') }]"
  96. @click="showReAddress = true" />
  97. <!-- 成立时间 -->
  98. <!-- <van-field v-model="companyFoundDate" readonly name="companyFoundDate"
  99. :label="$t('huifuMch.companyFoundDate')" :placeholder="$t('huifuMch.companyFoundDatePlaceholder')"
  100. @click="showFoundDate = true"
  101. :rules="[{ required: true, message: $t('huifuMch.companyFoundDatePlaceholder') }]" /> -->
  102. <!-- 客服电话 -->
  103. <!-- <van-field v-model="servicePhoneValue" name="servicePhoneValue" :label="$t('huifuMch.huifuServicePhone')"
  104. :placeholder="$t('huifuMch.huifuServicePhonePlaceholder')"
  105. :rules="[{ required: true, message: $t('huifuMch.huifuServicePhonePlaceholder') }]"
  106. @update:model-value="fieldUpdate" /> -->
  107. </div>
  108. <div class="intervalRow"></div>
  109. <!-- 联系人姓名 -->
  110. <van-field class="requiredLeft" v-model="busiContactName" name="busiContactName"
  111. :label="$t('joinpayMch.contactNameLabel')" :placeholder="$t('joinpayMch.contactNamePlaceholder')"
  112. :rules="[{ required: true, message: $t('joinpayMch.contactNamePlaceholder') }]"
  113. @update:model-value="fieldUpdate" />
  114. <!-- 联系人手机号码 -->
  115. <van-field class="requiredLeft" v-model="busiContactMobileNo" name="busiContactMobileNo"
  116. :label="$t('joinpayMch.cellPhoneLabel')" :placeholder="$t('joinpayMch.cellPhonePlaceholder')"
  117. :rules="[{ required: true, message: $t('joinpayMch.cellPhonePlaceholder') }]"
  118. @update:model-value="fieldUpdate" />
  119. <!-- 联系人邮箱 -->
  120. <!-- <van-field class="requiredLeft" v-model="emailValue" name="emailValue" :label="$t('huifuMch.huifuContactEmail')"
  121. :placeholder="$t('huifuMch.huifuContactEmailPlaceholder')"
  122. :rules="[{ required: true, pattern: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/, message: $t('huifuMch.huifuContactEmailMessage') }]"
  123. @update:model-value="fieldUpdate" /> -->
  124. <!-- 法人/个人姓名 -->
  125. <van-field class="requiredLeft" v-model="legalPerson" name="legalPerson"
  126. :label="$t('joinpayMch.nameOfLegalPerson/IndividualLabel')"
  127. :placeholder="$t('joinpayMch.nameOfLegalPerson/IndividualPlaceholder')"
  128. :rules="[{ required: true, message: $t('joinpayMch.nameOfLegalPerson/IndividualPlaceholder') }]"
  129. @update:model-value="fieldUpdate" />
  130. <!-- 法人/个人手机号 -->
  131. <van-field class="requiredLeft" v-model="phoneNo" name="phoneNo"
  132. :label="$t('joinpayMch.phoneNumberOfLegalPerson/IndividualLabel')"
  133. :placeholder="$t('joinpayMch.phoneNumberOfLegalPerson/IndividualPlaceholder')"
  134. :rules="[{ required: true, message: $t('joinpayMch.phoneNumberOfLegalPerson/IndividualPlaceholder') }]"
  135. @update:model-value="fieldUpdate" />
  136. <!-- 身份证号 -->
  137. <van-field class="requiredLeft" v-model="idCardNo" name="idCardNo" :label="$t('joinpayMch.IDLabel')"
  138. :placeholder="$t('joinpayMch.IDPlaceholder')"
  139. :rules="[{ required: true, message: $t('joinpayMch.IDPlaceholder') }]" @update:model-value="fieldUpdate" />
  140. <!-- 身份证地址 -->
  141. <van-field v-if="bankAccountType == '4'" class="requiredLeft" v-model="certAddressValue" name="certAddressValue"
  142. :label="$t('huifuMch.certAddress')" :placeholder="$t('huifuMch.certAddressPlaceholder')"
  143. :rules="[{ required: true, message: $t('huifuMch.certAddressPlaceholder') }]"
  144. @update:model-value="fieldUpdate" />
  145. <!-- 身份证有效期类型 -->
  146. <div class="van-cell van-field requiredLeft">
  147. <div class="van-cell__title van-field__label"><span>{{ $t('huifuMch.certType') }}</span></div>
  148. <div class="van-cell__value van-field__value radioBox">
  149. <van-radio-group v-model="validityType" direction="horizontal" @change="fieldUpdate">
  150. <van-radio name="1" icon-size="18px">{{ $t('huifuMch.permanent') }}</van-radio>
  151. <van-radio name="0" icon-size="18px">{{ $t('huifuMch.noPermanent') }}</van-radio>
  152. </van-radio-group>
  153. </div>
  154. </div>
  155. <!-- 有效开始日期 -->
  156. <van-field class="requiredLeft" v-model="beginDate" readonly name="beginDate" :label="$t('huifuMch.beginDate')"
  157. :placeholder="$t('huifuMch.beginDatePlaceholder')" @click="showBeginDate = true"
  158. :rules="[{ required: true, message: $t('huifuMch.beginDatePlaceholder') }]" />
  159. <!-- 有效截止日期 -->
  160. <van-field class="requiredLeft" v-if="validityType == 0" v-model="endDate" readonly name="endDate"
  161. :label="$t('huifuMch.endDate')" :placeholder="$t('huifuMch.endDatePlaceholder')" @click="showEndDate = true"
  162. :rules="[{ required: true, message: $t('huifuMch.endDatePlaceholder') }]" />
  163. <!-- 图片审核情况 -->
  164. <div class="van-cell van-field" v-if="pageType === '4'">
  165. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.pictureReview') }}</span></div>
  166. <div class="van-cell__value van-field__value radioBox" style="display: flex; justify-content: space-around;">
  167. <span
  168. :style="{ color: approveStatus === '审核通过' ? (huifuPicUpStatus === 1 ? '#00ff80' : '#FF0000') : (approveStatus === '审核中' ? '#FFA500' : '#FF0000') }">
  169. {{ approveStatus === '审核通过' ? (huifuPicUpStatus === 1 ? '审核通过' : '请重新上传') : approveStatus }}
  170. </span>
  171. <van-button span="5" round type="primary" style="height: 2em; padding: 0 1.5em" @click='updateSentImage()'>
  172. {{ $t('joinpayMch.reUpload') }}</van-button>
  173. </div>
  174. </div>
  175. <!-- 签约状态 -->
  176. <div class="van-cell van-field" v-if="pageType === '4'">
  177. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.signingStatus') }}</span></div>
  178. <div class="van-cell__value van-field__value radioBox" style="display: flex; justify-content: space-around;">
  179. <!-- <span
  180. :style="{ color: signStatus == '签约成功' ? (conStat == null && huifuMchID == null ? '#00ff80' : (conStat == 5 && huifuAuditStatus == '2' ? '#00ff80' : '#FFA500')) : '#FFA500' }">
  181. {{ signStatus == '签约成功' ? (conStat == null && huifuMchID == null ? signStatus : (conStat == 5 &&
  182. huifuAuditStatus == '2' ?
  183. signStatus : '待签约')) : '待签约' }}
  184. </span> -->
  185. <span
  186. :style="{ color: signStatus == '签约成功' ? (huifuMchID == null ? '#00ff80' : (huifuAuditStatus == '2' ? '#00ff80' : '#FFA500')) : '#FFA500' }">
  187. {{ signStatus == '签约成功' ? (huifuMchID == null ? signStatus : (huifuAuditStatus == '2' ? signStatus :
  188. '待签约')) : '待签约' }}
  189. </span>
  190. <van-button
  191. :disabled="huifuMchID == null ? (signStatus == '签约成功' ? true : false) : (huifuAuditStatus == '2' && signStatus == '签约成功' ? true : false)"
  192. span="5" round type="primary" style="height: 2em; padding: 0 2.5em" @click='altMchSignFun()'>{{
  193. $t('joinpayMch.signAContract') }}
  194. </van-button>
  195. </div>
  196. </div>
  197. <div class="intervalRow"></div>
  198. <!-- 账户类型 -->
  199. <div class="van-cell van-field requiredLeft">
  200. <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.accountType') }}</span></div>
  201. <div class="van-cell__value van-field__value radioBox">
  202. <van-radio-group v-model="bankAccountType" direction="horizontal" @change="fieldUpdate"
  203. :disabled="altMerchantType === '10'">
  204. <van-radio name="1" icon-size="18px">{{ $t('joinpayMch.debitCard') }}</van-radio>
  205. <van-radio name="4" icon-size="18px">{{
  206. $t('joinpayMch.corporateAccount')
  207. }}</van-radio>
  208. </van-radio-group>
  209. </div>
  210. </div>
  211. <!-- 银行账户名称 -->
  212. <div class="cell-input">
  213. <van-popover v-model:show="popoverVisible" trigger="manual" placement="top" popover-class="custom-popover"
  214. :offset="[25, 5]" theme="dark">
  215. <template #reference>
  216. <van-field class="custom-input" v-model="bankAccountName" name="bankAccountName"
  217. :label="$t('joinpayMch.bankAccountNameLabel')"
  218. :placeholder="$t('joinpayMch.bankAccountNamePlaceholder')"
  219. :rules="[{ required: true, message: $t('joinpayMch.bankAccountNamePlaceholder') }]"
  220. @update:model-value="fieldUpdate" @click="showPopover(3)" />
  221. </template>
  222. {{ $t('joinpayMch.bankAccountNameTips') }}
  223. </van-popover>
  224. </div>
  225. <!-- 银行账号 -->
  226. <van-field class="requiredLeft" v-model="bankAccountNo" name="bankAccountNo"
  227. :label="$t('joinpayMch.bankAccountLabel')" :placeholder="$t('joinpayMch.bankAccountPlaceholder')"
  228. :rules="[{ required: true, message: $t('joinpayMch.bankAccountPlaceholder') }]"
  229. @update:model-value="fieldUpdate" />
  230. <!-- 银行地址 -->
  231. <van-field class="requiredLeft" v-model="bankAddress" is-link readonly name="bankAddress"
  232. :label="$t('huifuMch.huifuBankAddress')" :placeholder="$t('huifuMch.huifuBankAddressPlaceholder')"
  233. :rules="[{ required: true, message: $t('huifuMch.huifuBankAddressPlaceholder') }]"
  234. @click="showBankAddress = true" />
  235. <div v-if="bankAccountType === '4'" class="requiredLeft">
  236. <!-- 联行号 -->
  237. <van-field v-model="bankChannelNo" name="bankChannelNo" :label="$t('joinpayMch.interBankNoLabel')"
  238. :placeholder="$t('joinpayMch.interBankNoPlaceholder')"
  239. :rules="[{ required: bankAccountType === '4', message: $t('joinpayMch.interBankNoPlaceholder') }]"
  240. @update:model-value="fieldUpdate" />
  241. <van-field v-model="bankCodeValue" name="bankCodeValue" :label="$t('huifuMch.bankCodeLabel')"
  242. :placeholder="$t('huifuMch.bankCodePlaceholder')"
  243. :rules="[{ required: true, message: $t('huifuMch.bankCodePlaceholder') }]"
  244. @update:model-value="fieldUpdate" />
  245. <!-- <van-field v-model="openLicenceNoValue" name="openLicenceNoValue" :label="$t('huifuMch.openLicenceNo')"
  246. :placeholder="$t('huifuMch.openLicenceNoPlaceholder')"
  247. :rules="[{ required: true, message: $t('huifuMch.openLicenceNoPlaceholder') }]"
  248. @update:model-value="fieldUpdate" /> -->
  249. </div>
  250. <div v-if="altMerchantType === '12'" class="requiredLeft">
  251. <!-- 营业执照有效期 -->
  252. <div class="van-cell van-field">
  253. <div class="van-cell__title van-field__label"><span>{{ $t('huifuMch.validityType') }}</span></div>
  254. <div class="van-cell__value van-field__value radioBox">
  255. <van-radio-group v-model="validityType1" direction="horizontal" @change="fieldUpdate">
  256. <van-radio name="1" icon-size="18px">{{ $t('huifuMch.permanent') }}</van-radio>
  257. <van-radio name="0" icon-size="18px">{{ $t('huifuMch.noPermanent') }}</van-radio>
  258. </van-radio-group>
  259. </div>
  260. </div>
  261. <!-- 营业执照编号 -->
  262. <van-field v-model="licenseNo" name="licenseNo" :label="$t('joinpayMch.businessLicenseNoLabel')"
  263. :placeholder="$t('joinpayMch.businessLicenseNoPlaceholder')"
  264. :rules="[{ required: bankAccountType === '4', message: $t('joinpayMch.businessLicenseNoPlaceholder') }]"
  265. @update:model-value="fieldUpdate" />
  266. <van-field v-model="beginDateLicense" readonly name="beginDateLicense" :label="$t('huifuMch.beginDate')"
  267. :placeholder="$t('huifuMch.beginDatePlaceholder')" @click="showBeginDateLicense = true"
  268. :rules="[{ required: true, message: $t('huifuMch.beginDatePlaceholder') }]" />
  269. <van-field v-if="validityType1 == 0" v-model="endDateLicense" readonly name="endDateLicense"
  270. :label="$t('huifuMch.endDate')" :placeholder="$t('huifuMch.endDatePlaceholder')"
  271. @click="showEndDateLicense = true"
  272. :rules="[{ required: true, message: $t('huifuMch.endDatePlaceholder') }]" />
  273. </div>
  274. <!-- <div class="intervalRow"></div> -->
  275. <!-- 经营范围 -->
  276. <!-- <van-field v-model="manageScope" name="manageScope" :label="$t('joinpayMch.natureOfBusinessLabel')"
  277. :placeholder="$t('joinpayMch.natureOfBusinessPlaceholder')" @update:model-value="fieldUpdate" />
  278. <van-field class="requiredLeft" v-model="manageAddr" is-link readonly name="manageAddr"
  279. :label="$t('huifuMch.huifuBusinessAddress')" :placeholder="$t('huifuMch.huifuBusinessAddressPlaceholder')"
  280. :rules="[{ required: true, message: $t('huifuMch.huifuBusinessAddressPlaceholder') }]"
  281. @click="showArea = true" />
  282. <van-field v-if="huifuMchNO != null" v-model="sms" center clearable :label="$t('huifuMch.sms')"
  283. class="requiredLeft" :placeholder="$t('huifuMch.smsPlaceholder')"
  284. :rules="[{ required: true, message: $t('huifuMch.smsPlaceholder') }]">
  285. <template #button>
  286. <van-button size="small" type="primary" @click="sendCode()" :disabled="time !== 0" style="padding: 0 1em">
  287. {{ time === 0 ? $t('huifuMch.sendSms') : time + $t('huifuMch.replaysInSeconds') }}
  288. </van-button>
  289. </template>
  290. </van-field> -->
  291. <!-- 操作 -->
  292. <van-row justify="space-around" v-if="huifuAuditStatus != '4' && huifuAuditStatus != '1'"
  293. style="padding: 1em; margin: 2em 0;">
  294. <van-button span="5" round type="primary" style="height: 2em; padding: 1.5em 2em" native-type="submit">{{
  295. $t('joinpayMch.submitDataForReview') }}
  296. </van-button>
  297. </van-row>
  298. </van-form>
  299. <!-- 时间弹窗 -->
  300. <van-popup v-model:show="showBeginDate" position="bottom">
  301. <van-date-picker :min-date="minDate" :max-date="maxDate" @confirm="onConfirmBeginDate"
  302. @cancel="showBeginDate = false" />
  303. </van-popup>
  304. <van-popup v-model:show="showEndDate" position="bottom">
  305. <van-date-picker :min-date="minDate" :max-date="maxDate" @confirm="onConfirmEndDate"
  306. @cancel="showEndDate = false" />
  307. </van-popup>
  308. <van-popup v-model:show="showFoundDate" position="bottom">
  309. <van-date-picker :min-date="minDate" :max-date="maxDate" @confirm="onConfirmFoundDate"
  310. @cancel="showFoundDate = false" />
  311. </van-popup>
  312. <van-popup v-model:show="showEndDateLicense" position="bottom">
  313. <van-date-picker :min-date="minDate" :max-date="maxDate" @confirm="onConfirmEndDateLicense"
  314. @cancel="showEndDateLicense = false" />
  315. </van-popup>
  316. <van-popup v-model:show="showBeginDateLicense" position="bottom">
  317. <van-date-picker :min-date="minDate" :max-date="maxDate" @confirm="onConfirmBeginDateLicense"
  318. @cancel="showBeginDateLicense = false" />
  319. </van-popup>
  320. <!-- 地址弹窗 -->
  321. <van-popup v-model:show="showArea" position="bottom">
  322. <van-area :area-list="areaList" @confirm="onConfirm" @cancel="showArea = false" />
  323. </van-popup>
  324. <van-popup v-model:show="showBankAddress" position="bottom">
  325. <van-area :area-list="areaList" :columns-num="2" @confirm="onConfirmBankAddress"
  326. @cancel="showBankAddress = false" />
  327. </van-popup>
  328. <van-popup v-model:show="showReAddress" position="bottom">
  329. <van-area :area-list="areaList" @confirm="onConfirmReAddress" @cancel="showReAddress = false" />
  330. </van-popup>
  331. </div>
  332. <div v-if="pageType === '2'" class="joinPayMch2">
  333. <img src='../../assets/joinPayMch/center.png' style="width: 50%; margin-top: 3em;" />
  334. <div v-if="joinPayMchType === '0'" style="width: 100%;">
  335. <div style="width: 100%; text-align: center;">
  336. <span style=" font-size: 1.4em; font-weight: bold; line-height: 3;">{{
  337. $t('joinpayMch.thePlatformAdministratorIsReviewing') }}</span>
  338. </div>
  339. <div style="width: 100%; text-align: center;">
  340. <span style="line-height: 1.2;">{{ $t('joinpayMch.youCan') }}<span
  341. style="color: #4d6add; text-decoration: underline;" @click='updateJoinPay()'>{{
  342. $t('joinpayMch.withdrawAndRevise') }}</span></span>
  343. </div>
  344. </div>
  345. <div v-if="joinPayMchType === '2' || joinPayMchType === '3'" style="width: 100%;">
  346. <div style="width: 100%; text-align: center;">
  347. <span style=" font-size: 1.4em; font-weight: bold; line-height: 3; color: #ee0a24;">{{
  348. $t('joinpayMch.failedToPassTheReview') }}</span>
  349. </div>
  350. <div style="width: 100%; text-align: center;">
  351. <span style="line-height: 1.2;">{{ $t('joinpayMch.failedToPassTheReview') }},<span
  352. style="color: #4d6add; text-decoration: underline;" @click='pageType = "1"'>{{
  353. $t('joinpayMch.clickHereToFillInTheInformationAgain') }}</span></span>
  354. </div>
  355. </div>
  356. <div v-if="joinPayMchStep === '0'">
  357. <div style="width: 100%; text-align: center;">
  358. <span style=" font-size: 1.4em; font-weight: bold; line-height: 3; color: #07c160;">{{
  359. $t('joinpayMch.approvalPassed') }}</span>
  360. </div>
  361. <div style="width: 100%; text-align: center;">
  362. <span style="line-height: 1.2;">{{ $t('joinpayMch.approvalPassed') }},{{ $t('joinpayMch.youCan') }}<span
  363. style="color: #4d6add; text-decoration: underline;" @click='pageType = "1"'>{{
  364. $t('joinpayMch.clickHereToFillInAgainAndSubmitForReview') }}</span></span>
  365. </div>
  366. <van-row justify="space-around" style="padding: 1em">
  367. <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" @click='pageType = "3"'>
  368. {{ $t('joinpayMch.nextGoToUploadIDPhotos') }}</van-button>
  369. </van-row>
  370. </div>
  371. </div>
  372. <div v-if="pageType === '3'">
  373. <van-form @submit="sentImageFun">
  374. <div class="upLoaderRow">
  375. <div class="baseRow flex-row justify-between">
  376. <div class="group2 flex-col"></div>
  377. <span class="baseText">{{ $t('joinpayMch.uploYourIdCard') }}</span>
  378. </div>
  379. <div class="cardRow">
  380. <div class="cardLi">
  381. <van-uploader v-model="cardNegativeList" :max-size="2 * 1024 * 1024" :max-count="1"
  382. :after-read="afterRead" :before-delete="deleteCertFront" @oversize="onOversize" />
  383. <p>{{ $t('joinpayMch.uploPortrait') }}</p>
  384. </div>
  385. <div class="cardLi">
  386. <van-uploader v-model="cardPositiveList" :max-size="2 * 1024 * 1024" :max-count="1"
  387. :after-read="afterRead" :before-delete="deleteCertBack" @oversize="onOversize" />
  388. <p>{{ $t('joinpayMch.uploNatiEmblem') }}</p>
  389. </div>
  390. </div>
  391. </div>
  392. <div class="upLoaderRow" v-if="bankAccountType === '1'">
  393. <div class="baseRow flex-row justify-between">
  394. <div class="group2 flex-col"></div>
  395. <span class="baseText">{{ $t('joinpayMch.upStatementCard') }}</span>
  396. </div>
  397. <div class="cardRow">
  398. <div class="cardLi">
  399. <van-uploader v-model="statementCard" :max-size="2 * 1024 * 1024" :max-count="1" :after-read="afterRead"
  400. :before-delete="deleteCard" @oversize="onOversize" />
  401. <p>{{ $t('joinpayMch.statementCard') }}</p>
  402. </div>
  403. </div>
  404. </div>
  405. <div class="upLoaderRow" v-if="bankAccountType === '4'">
  406. <div class="baseRow flex-row justify-between">
  407. <div class="group2 flex-col"></div>
  408. <span class="baseText">{{ $t('joinpayMch.businessLicensePlace') }}</span>
  409. </div>
  410. <div class="cardRow">
  411. <div class="cardLi">
  412. <van-uploader v-model="tradeLicenceList" :max-size="2 * 1024 * 1024" :max-count="1"
  413. :before-delete="deleteTradeLicence" :after-read="afterRead" @oversize="onOversize" />
  414. <p>{{ $t('joinpayMch.businessLicense') }}</p>
  415. </div>
  416. </div>
  417. </div>
  418. <div class="upLoaderRow" v-if="bankAccountType === '4'">
  419. <div class="baseRow flex-row justify-between">
  420. <div class="group2 flex-col"></div>
  421. <span class="baseText">{{ $t('joinpayMch.accountOpeningLicensePlace') }}</span>
  422. </div>
  423. <div class="cardRow">
  424. <div class="cardLi">
  425. <van-uploader v-model="openAccountLicenceList" :max-size="2 * 1024 * 1024" :max-count="1"
  426. :before-delete="deleteAccountLicence" :after-read="afterRead" @oversize="onOversize" />
  427. <p>{{ $t('joinpayMch.accountOpeningLicense') }}</p>
  428. </div>
  429. </div>
  430. </div>
  431. <van-row justify="space-around" style="padding: 1em">
  432. <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" native-type="submit">{{
  433. $t('joinpayMch.submissions') }}
  434. </van-button>
  435. </van-row>
  436. </van-form>
  437. </div>
  438. </div>
  439. </div>
  440. </template>
  441. <script>
  442. import { onMounted, reactive, toRefs, ref } from "vue";
  443. import sHeader from "../../components/SimpleHeader";
  444. import { showFailToast, showSuccessToast, showToast, showLoadingToast } from "vant";
  445. import { areaList } from "@vant/area-data";
  446. import {
  447. getOneJoinPayMch, updateJoinPayMchCheck, altMchSign,
  448. sentImage, updateApproveStatus, saveJoinPayMch
  449. } from '../../service/joinpayMch';
  450. import { newUploadPic, getHuifuMchCheck, newSaveHuifuMch, updateMerchant, openAccount, sendSms } from "@/service/huifuMch";
  451. import { getLoginUser, styleUrl, getLocal, setLocal } from "../../common/js/utils";
  452. import dateUtil from "../../utils/dateUtil";
  453. import { useI18n } from "vue-i18n";
  454. export default {
  455. components: { sHeader },
  456. setup() {
  457. // 引入语言
  458. const { t } = useI18n();
  459. const user = getLoginUser();
  460. const idCardExpiryShow = ref(false);
  461. const idCardExpiryOnConfirm = (value) => {
  462. idCardExpiryShow.value = false;
  463. addParams.idCardExpiry = dateUtil.formateDate(value, "yyyy-MM-dd");
  464. fieldUpdate();
  465. };
  466. const licenseExpiryShow = ref(false);
  467. const licenseExpiryOnConfirm = (value) => {
  468. licenseExpiryShow.value = false;
  469. addParams.licenseExpiry = dateUtil.formateDate(value, "yyyy-MM-dd");
  470. fieldUpdate();
  471. };
  472. const showBeginDate = ref(false);
  473. const showEndDate = ref(false);
  474. const showBeginDateLicense = ref(false);
  475. const showEndDateLicense = ref(false);
  476. const showFoundDate = ref(false);
  477. const showArea = ref(false); // 是否弹窗
  478. const showBankAddress = ref(false);
  479. const showReAddress = ref(false);
  480. const verCodeTime = reactive({
  481. time: 0
  482. });
  483. const regNameVisible = ref(false);
  484. const shortNameVisible = ref(false);
  485. const popoverVisible = ref(false);
  486. const showPopover = (value) => {
  487. console.log(value);
  488. switch (value) {
  489. case 1:
  490. regNameVisible.value = true;
  491. break;
  492. case 2:
  493. shortNameVisible.value = true;
  494. break;
  495. case 3:
  496. popoverVisible.value = true;
  497. break;
  498. }
  499. }
  500. let addParams = reactive({
  501. adminId: user.id, // 当前登录账户的id Long 必填
  502. altMchName: '', // 分账方名称; string 必填
  503. altMchNo: '', // 分账方账号; string 必填
  504. altMchShortName: '', // 分账方商户简称; string
  505. altMerchantType: '10', // 分账方商户类型,10:个人,11:个体工商户,12:企业; integer(int32) 必填
  506. regNameValue: '', // 汇付商户名称
  507. shortNameValue: '', // 汇付商户简称
  508. registeredAddress: '', // 汇付商户注册地址
  509. companyFoundDate: '', // 汇付商户公司成立时间
  510. servicePhoneValue: '', // 汇付客服电话
  511. busiContactName: '', // 业务联系人姓名; string 必填
  512. busiContactMobileNo: '', // 业务联系人手机; string 必填
  513. legalPerson: '', // 法人; string 必填
  514. phoneNo: '', // 电话; string 必填
  515. emailValue: '', // 联系人邮箱
  516. idCardNo: '', // 身份证; string 必填
  517. certAddressValue: '', // 汇付参数,身份证地址,对公账户必填
  518. validityType: '1', // 身份证有效期类型
  519. idCardExpiry: '', // 身份证有效期; string
  520. beginDate: '', // 有效期开始日期
  521. endDate: '', // 有效期截日期
  522. bankAccountType: '1', // 账户类型 * 1 借记卡,4 对公账户; integer(int32) 必填
  523. bankAccountName: '', // 银行账户名称,分账方结算银行账户名称; string 必填
  524. bankAccountNo: '', // 银行账号; string 必填
  525. bankAddress: '', // 银行地址,个人账户必填
  526. bankChannelNo: '', // 联行号; string 对公账户;必填
  527. openLicenceNoValue: '', // 汇付参数,基本存款账户编号或核准号,对公账户必填
  528. bankCodeValue: '', // 汇付参数,银行编号
  529. validityType1: '1', // 营业执照有效期类型
  530. licenseNo: '', // 营业执照编号; string 对公账户;必填
  531. licenseExpiry: '', // 营业执照有效期; string
  532. beginDateLicense: '', // 有效期开始日期
  533. endDateLicense: '', // 有效期截日期
  534. settMode: 1, // 结算方式 * 1 由汇聚自动结算 * 2 由商户平台手工结算(结算接口); integer(int32) 默认填1
  535. settDateType: 1, // 结算周期类型 * 1 工作日,2 自然日,3 月结日; integer(int32) 默认填1
  536. riskDay: 1, // 结算周期; integer(int32) 默认填1
  537. manageScope: '', // 经营范围; string
  538. manageAddr: '', // 经营地址; string
  539. bizCode: '', // 业务响应码; string
  540. loginName: '', // 分账方登录名,即邮箱; string
  541. });
  542. // 汇付字段
  543. let huifuParams = reactive({
  544. id: null,
  545. adminId: user.id, // 当前登录账户的id
  546. type: '0', // 类型 String 必填 企业:type='1'; 个人:type='0'
  547. regName: '', // 商户名称
  548. shortName: '', // 商户简称
  549. foundDate: '', // 成立时间
  550. licenseCode: '', // 营业执照编号
  551. licenseValidityType: "1", // 营业执照有效期类型
  552. licenseBeginDate: '', // 营业执照有效开始日期
  553. licenseEndDate: '', // 营业执照有效截止日期
  554. regProvId: '', // 注册省编码
  555. regAreaId: '', // 注册市编码
  556. regDistrictId: '', // 注册区编码
  557. regDetail: '', // 注册详细地址
  558. name: '', // 联系人姓名
  559. phone: '', // 联系人手机号码
  560. email: '', // 联系人邮箱
  561. provId: '', // 省编码
  562. areaId: '', // 省编码
  563. districtId: '', // 市编码
  564. detailAddr: '', // 经营地址
  565. servicePhone: '', // 客服电话
  566. cardName: '', // 卡户名
  567. cardType: '1', // 结算账户类型,“0”为对公账户,“1”为个人账户
  568. cardNo: '', // 银行卡号
  569. branchCode: '', // 联行号
  570. openLicenceNo: '', // 基本存款账户编号或核准号
  571. bankCode: '',
  572. cardProvId: '', // 省编码
  573. cardAreaId: '', // 省编码
  574. mp: '', // 结算手机号
  575. certNo: '', // 身份证号
  576. certAddress: '', // 身份证地址
  577. certValidityType: '1', // 身份证有效期类型
  578. certBeginDate: '', // 有效期开始日期
  579. certEndDate: '', // 有效期截止日期
  580. sms: '', // 验证码
  581. });
  582. let cardPositiveList = ref([]);
  583. let cardNegativeList = ref([]);
  584. let tradeLicenceList = ref([]);
  585. let statementCard = ref([]);
  586. let openAccountLicenceList = ref([]);
  587. let sentImageForm = reactive({
  588. cardPositive: '', // 身份证正面 String 必填
  589. cardNegative: '', // 身份证背面 String 必填
  590. tradeLicence: '', // 营业执照图片 String Type=0时必填
  591. openAccountLicence: '', // 开户许可证 String Type=0时必填
  592. type: '', // 账户类型 String 必填 0:对公;1,个人
  593. status: '0', // 第几次提交 String 必填 0,第一次提交;1,第n次提交(重新上传)
  594. });
  595. const pageType = ref('1');
  596. const joinPayMchType = ref(null);
  597. const joinPayMchStep = ref(null);
  598. const joinPayMchID = ref(null); // 汇聚账号ID
  599. const huifuMchID = ref(null); //汇付账号ID
  600. const huifuPicUpStatus = ref(0); // 汇付照片上传状态
  601. // let joinPayMchNo = null; // 汇聚商户号
  602. const huifuMchNO = ref(null); // 汇付商户号
  603. const approveStatus = ref(null);
  604. const signStatus = ref(null); // 汇聚签约状态
  605. const huifuAuditStatus = ref(null); // 汇付审核状态
  606. const conStat = ref(null); // 汇付签约状态
  607. let isMemoryFormType = false;
  608. // 日期选择
  609. const onConfirmBeginDate = ({ selectedValues }) => {
  610. addParams.beginDate = selectedValues.join("-");
  611. showBeginDate.value = false;
  612. fieldUpdate();
  613. };
  614. const onConfirmEndDate = ({ selectedValues }) => {
  615. addParams.endDate = selectedValues.join("-");
  616. showEndDate.value = false;
  617. fieldUpdate();
  618. };
  619. const onConfirmFoundDate = ({ selectedValues }) => {
  620. addParams.companyFoundDate = selectedValues.join("-");
  621. showFoundDate.value = false;
  622. fieldUpdate();
  623. };
  624. const onConfirmEndDateLicense = ({ selectedValues }) => {
  625. addParams.endDateLicense = selectedValues.join("-");
  626. showEndDateLicense.value = false;
  627. fieldUpdate();
  628. };
  629. const onConfirmBeginDateLicense = ({ selectedValues }) => {
  630. addParams.beginDateLicense = selectedValues.join("-");
  631. showBeginDateLicense.value = false;
  632. fieldUpdate();
  633. };
  634. // 地址选择
  635. const onConfirm = ({ selectedOptions }) => {
  636. console.log(selectedOptions[0].value);
  637. showArea.value = false;
  638. addParams.manageAddr = (selectedOptions[0]?.text != selectedOptions[1]?.text ? selectedOptions[0]?.text : '')
  639. + selectedOptions[1]?.text + selectedOptions[2]?.text;
  640. console.log(addParams.manageAddr)
  641. huifuParams.provId = selectedOptions[0]?.value || '';
  642. huifuParams.areaId = selectedOptions[1]?.value || '';
  643. huifuParams.districtId = selectedOptions[2]?.value || '';
  644. huifuParams.detailAddr = addParams.manageAddr;
  645. };
  646. const onConfirmBankAddress = ({ selectedOptions }) => {
  647. showBankAddress.value = false;
  648. addParams.bankAddress = (selectedOptions[0]?.text != selectedOptions[1]?.text ? selectedOptions[0]?.text : '')
  649. + selectedOptions[1]?.text;
  650. huifuParams.cardProvId = selectedOptions[0]?.value || '';
  651. huifuParams.cardAreaId = selectedOptions[1]?.value || '';
  652. };
  653. const onConfirmReAddress = ({ selectedOptions }) => {
  654. showReAddress.value = false;
  655. addParams.registeredAddress = (selectedOptions[0]?.text != selectedOptions[1]?.text ? selectedOptions[0]?.text : '')
  656. + selectedOptions[1]?.text + selectedOptions[2]?.text;
  657. huifuParams.regProvId = selectedOptions[0]?.value || '';
  658. huifuParams.regAreaId = selectedOptions[1]?.value || '';
  659. huifuParams.regDistrictId = selectedOptions[2]?.value || '';
  660. huifuParams.regDetail = addParams.registeredAddress;
  661. console.log("详细地址", huifuParams.regDetail);
  662. };
  663. onMounted(async () => {
  664. styleUrl('joinpayMch');
  665. getOneJoinPayMchFun();
  666. getHuifuMchFun();
  667. verCodeTime.time = getLocal('registerVerCodeTime');
  668. if (huifuMchID.value == null) {
  669. huifuPicUpStatus.value = 1;
  670. console.log(huifuPicUpStatus.value);
  671. }
  672. if (verCodeTime.time && verCodeTime.time !== '') {
  673. verCodeTime.time = parseInt(verCodeTime.time);
  674. if (verCodeTime.time > 0) {
  675. verCodeTimeInterval();
  676. }
  677. } else {
  678. verCodeTime.time = 0;
  679. }
  680. });
  681. // 获取汇聚账号回显
  682. const getOneJoinPayMchFun = async () => {
  683. const { data } = await getOneJoinPayMch({ adminId: user.id });
  684. console.log(data);
  685. if (data.code === "00000") {
  686. joinPayMchType.value = data.data.type;
  687. if (data.data.type === '2' || data.data.type === '3' || data.data.type === '0') {
  688. pageType.value = '2';
  689. }
  690. if ((data.data.type === null || data.data.type === '1') && data.data.step === '0') {
  691. pageType.value = '2';
  692. joinPayMchStep.value = '0';
  693. }
  694. if ((data.data.type === null || data.data.type === '1') && data.data.step === '1') {
  695. pageType.value = '4';
  696. joinPayMchStep.value = '1';
  697. }
  698. console.log('pageType', pageType.value);
  699. joinPayMchID.value = data.data.id;
  700. approveStatus.value = data.data.approveStatus;
  701. signStatus.value = data.data.signStatus;
  702. addParams.altMchName = data.data.altMchName;
  703. addParams.altMchNo = data.data.altMchNo;
  704. // joinPayMchNo = data.data.altMchNo;
  705. addParams.altMchShortName = data.data.altMchShortName;
  706. addParams.altMerchantType = data.data.altMerchantType ? data.data.altMerchantType.toString() : '';
  707. addParams.busiContactName = data.data.busiContactName;
  708. addParams.busiContactMobileNo = data.data.busiContactMobileNo;
  709. addParams.legalPerson = data.data.legalPerson;
  710. addParams.phoneNo = data.data.phoneNo;
  711. addParams.idCardNo = data.data.idCardNo;
  712. if (data.data.idCardExpiry) {
  713. addParams.idCardExpiry = dateUtil.formateDate(new Date(data.data.idCardExpiry), "yyyy-MM-dd");
  714. }
  715. addParams.bankAccountType = data.data.bankAccountType ? data.data.bankAccountType.toString() : '';
  716. addParams.bankAccountName = data.data.bankAccountName;
  717. addParams.bankAccountNo = data.data.bankAccountNo;
  718. addParams.bankChannelNo = data.data.bankChannelNo;
  719. addParams.licenseNo = data.data.licenseNo;
  720. if (data.data.licenseExpiry) {
  721. addParams.licenseExpiry = dateUtil.formateDate(new Date(data.data.licenseExpiry), "yyyy-MM-dd");
  722. }
  723. addParams.settMode = data.data.settMode ? data.data.settMode.toString() : '';
  724. addParams.settDateType = data.data.settDateType ? data.data.settDateType.toString() : '';
  725. addParams.riskDay = data.data.riskDay;
  726. addParams.manageScope = data.data.manageScope;
  727. addParams.manageAddr = data.data.manageAddr;
  728. addParams.bizCode = data.data.bizCode;
  729. addParams.loginName = data.data.loginName;
  730. if (data.data.approveStatus === "审核中") {
  731. changeApproveStatus();
  732. }
  733. } else {
  734. pageType.value = '1';
  735. // showFailToast(data.message);
  736. }
  737. memoryForm();
  738. isMemoryFormType = true;
  739. };
  740. // 获取汇付账号回显
  741. const getHuifuMchFun = async () => {
  742. const { data } = await getHuifuMchCheck({ adminId: user.id });
  743. console.log("huifu", data);
  744. if (data.code === "00000") {
  745. if (data.data != null) {
  746. huifuMchID.value = data.data.id;
  747. huifuParams.id = data.data.id;
  748. console.log("huifuMchID", huifuMchID.value);
  749. conStat.value = data.data.conStat;
  750. addParams.altMerchantType = "10";
  751. addParams.busiContactName = data.data.name;
  752. addParams.busiContactMobileNo = data.data.phone;
  753. addParams.legalPerson = data.data.name;
  754. addParams.phoneNo = data.data.phone;
  755. addParams.idCardNo = data.data.certNo;
  756. addParams.bankAccountName = data.data.cardName;
  757. addParams.bankAccountNo = data.data.cardNo;
  758. huifuAuditStatus.value = data.data.status;
  759. addParams.emailValue = data.data.email;
  760. addParams.manageAddr = areaList.province_list[data.data.provId] + areaList.city_list[data.data.areaId] + areaList.county_list[data.data.districtId];
  761. huifuMchNO.value = data.data.huifuId;
  762. // if (huifuMchNO.value != null && conStat.value != "5") {
  763. // changeConStat();
  764. // }
  765. addParams.validityType = data.data.certValidityType;
  766. addParams.beginDate = dateUtil.formatDate(data.data.certBeginDate);
  767. addParams.endDate = dateUtil.formatDate(data.data.certEndDate);
  768. huifuParams.provId = data.data.provId;
  769. huifuParams.areaId = data.data.areaId;
  770. huifuParams.districtId = data.data.districtId;
  771. huifuParams.cardProvId = data.data.cardProvId;
  772. huifuParams.cardAreaId = data.data.cardAreaId;
  773. huifuParams.detailAddr = data.data.detailAddr;
  774. addParams.bankAddress = areaList.province_list[data.data.cardProvId] == areaList.city_list[data.data.cardAreaId] ? areaList.province_list[data.data.cardProvId] :
  775. (areaList.province_list[data.data.cardProvId] + areaList.city_list[data.data.cardAreaId]);
  776. if (data.data.cardFrontPic != null && data.data.legalCertBackPic != null && data.data.legalCertFrontPic) {
  777. huifuPicUpStatus.value = 1;
  778. }
  779. console.log(data.data.cardProvId);
  780. if (data.data.type === "1") {
  781. addParams.altMerchantType = "12";
  782. addParams.regNameValue = data.data.regName;
  783. addParams.shortNameValue = data.data.shortName;
  784. addParams.registeredAddress = areaList.province_list[data.data.regProvId] == areaList.city_list[data.data.regAreaId] ? (areaList.city_list[data.data.regAreaId] + areaList.county_list[data.data.regDistrictId]) :
  785. (areaList.province_list[data.data.regProvId] + areaList.city_list[data.data.regAreaId] + areaList.county_list[data.data.regDistrictId]);
  786. huifuParams.regProvId = data.data.regProvId;
  787. huifuParams.regAreaId = data.data.regAreaId;
  788. huifuParams.regDistrictId = data.data.regDistrictId;
  789. addParams.companyFoundDate = dateUtil.formatDate(data.data.foundDate);
  790. addParams.servicePhoneValue = data.data.servicePhone;
  791. addParams.licenseNo = data.data.licenseCode;
  792. if (data.data.cardType === "0") {
  793. addParams.bankAccountType = '4';
  794. addParams.certAddressValue = data.data.certAddress;
  795. addParams.openLicenceNoValue = data.data.openLicenceNo;
  796. addParams.bankCodeValue = data.data.bankCode;
  797. addParams.bankChannelNo = data.data.branchCode;
  798. }
  799. addParams.validityType1 = data.data.licenseValidityType;
  800. addParams.beginDateLicense = dateUtil.formatDate(data.data.licenseBeginDate);
  801. addParams.endDateLicense = dateUtil.formatDate(data.data.licenseEndDate);
  802. if (data.data.licensePic != null && data.data.certBackPic != null && data.data.certFrontPic != null && data.data.regAcctPic != null) {
  803. huifuPicUpStatus.value = 1;
  804. }
  805. }
  806. if (data.data.status === '0') {
  807. huifuPicUpStatus.value = 0;
  808. console.log(huifuPicUpStatus.value)
  809. }
  810. console.log('huifuAuditStatus', huifuAuditStatus.value)
  811. }
  812. }
  813. }
  814. // 更新汇付签约状态
  815. // const changeConStat = async () => {
  816. // const { data } = await updateConStat(huifuParams);
  817. // if (data.code === "00000") {
  818. // // showSuccessToast(t('joinpayMch.withdrawalSucceeded'));
  819. // if (data.data === "5") {
  820. // location.reload();
  821. // }
  822. // }
  823. // }
  824. // 更新图片审核情况
  825. const changeApproveStatus = async () => {
  826. const { data } = await updateApproveStatus({ id: joinPayMchID.value });
  827. if (data.code === "00000") {
  828. // showSuccessToast(t('joinpayMch.withdrawalSucceeded'));
  829. if (data.data === "P1000") {
  830. location.reload();
  831. }
  832. }
  833. }
  834. // 记忆表单
  835. const memoryForm = () => {
  836. const formDataString = localStorage.getItem('joinPayMchForm');
  837. if (formDataString) {
  838. const formData = JSON.parse(formDataString);
  839. Object.keys(formData).forEach(key => {
  840. addParams[key] = formData[key];
  841. });
  842. }
  843. };
  844. // 发送验证码
  845. const sendCode = async () => {
  846. const { data } = await sendSms({
  847. adminId: user.id,
  848. });
  849. console.log('seedVerCodeSuccess', data);
  850. if (data.code === '00000') {
  851. showToast({
  852. duration: 2000,
  853. message: t('huifuMch.successSend') + '\n' + maskPhoneNumber(data.data.phone)
  854. });
  855. console.log('seedVerCodeSuccess');
  856. verCodeTime.time = 60;
  857. verCodeTimeInterval();
  858. } else {
  859. showFailToast(data.message);
  860. }
  861. }
  862. // 格式手机号码
  863. const maskPhoneNumber = (value) => {
  864. const prefix = value.slice(0, 3);
  865. const suffix = value.slice(-4);
  866. return `${prefix}****${suffix}`;
  867. }
  868. // 验证码发送成功开始3分钟倒计时
  869. const verCodeTimeInterval = () => {
  870. verCodeTime.time--;
  871. setLocal('registerVerCodeTime', verCodeTime.time)
  872. if (verCodeTime.time !== 0) {
  873. setTimeout(() => {
  874. verCodeTimeInterval();
  875. }, 1000);
  876. }
  877. }
  878. // 提交审批表单
  879. const saveJoinPayMchFun = async () => {
  880. const params = Object.assign({}, addParams);
  881. params.altMerchantType = parseInt(params.altMerchantType);
  882. params.bankAccountType = parseInt(params.bankAccountType);
  883. params.settMode = parseInt(params.settMode);
  884. params.settDateType = parseInt(params.settDateType);
  885. addParams.idCardExpiry = addParams.beginDate;
  886. addParams.licenseExpiry = addParams.beginDateLicense;
  887. if (addParams.validityType === '0') {
  888. addParams.idCardExpiry = addParams.endDate;
  889. }
  890. if (addParams.validityType1 === '0') {
  891. addParams.licenseExpiry = addParams.endDateLicense;
  892. }
  893. huifuParams.regName = addParams.legalPerson;
  894. huifuParams.name = addParams.legalPerson;
  895. huifuParams.phone = addParams.phoneNo;
  896. huifuParams.email = addParams.emailValue;
  897. huifuParams.cardName = addParams.bankAccountName;
  898. huifuParams.cardNo = addParams.bankAccountNo.replace(/\s/g, '');
  899. huifuParams.mp = addParams.phoneNo;
  900. huifuParams.certNo = addParams.idCardNo;
  901. huifuParams.certValidityType = addParams.validityType;
  902. huifuParams.certBeginDate = addParams.beginDate.replace(/-/g, "");
  903. huifuParams.certEndDate = addParams.endDate.replace(/-/g, "");
  904. if (addParams.altMerchantType === '12') {
  905. huifuParams.type = '1';
  906. huifuParams.regName = addParams.regNameValue;
  907. huifuParams.foundDate = addParams.companyFoundDate.replace(/-/g, "");
  908. huifuParams.licenseCode = addParams.licenseNo;
  909. huifuParams.licenseValidityType = addParams.validityType1;
  910. huifuParams.licenseBeginDate = addParams.beginDateLicense.replace(/-/g, "");
  911. huifuParams.licenseEndDate = addParams.endDateLicense.replace(/-/g, "");
  912. huifuParams.servicePhone = addParams.servicePhoneValue;
  913. huifuParams.regDetail = addParams.registeredAddress;
  914. if (addParams.bankAccountType === '4') {
  915. huifuParams.cardType = '0';
  916. huifuParams.branchCode = addParams.bankChannelNo;
  917. huifuParams.openLicenceNo = addParams.openLicenceNoValue;
  918. huifuParams.bankCode = addParams.bankCodeValue;
  919. huifuParams.certAddress = addParams.certAddressValue
  920. }
  921. }
  922. console.log("addParams:", addParams);
  923. console.log("huifuParams:", huifuParams)
  924. try {
  925. const { data } = await saveJoinPayMch(addParams);
  926. if (data.code === "00000") {
  927. let huifuMch = null;
  928. if (huifuMchNO.value == null) {
  929. huifuMch = await newSaveHuifuMch(huifuParams);
  930. } else {
  931. // huifuMch = await auditMerchantUpdate(huifuParams);
  932. huifuMch = await updateMerchant(huifuParams);
  933. }
  934. if (huifuMch.data.code === "00000") {
  935. showSuccessToast(t(('joinpayMch.submittedSuccessfully')));
  936. localStorage.removeItem('joinPayMchForm');
  937. setTimeout(() => {
  938. location.reload();
  939. }, 1500);
  940. } else {
  941. showFailToast(`${huifuMch.data.message}`);
  942. }
  943. } else {
  944. showFailToast(`${t('joinpayMch.submitFailed')} ${data.message}`);
  945. }
  946. } catch (error) {
  947. console.error('请求发生错误:', error);
  948. showFailToast(t('joinpayMch.submitFailed'));
  949. }
  950. };
  951. // 撤回
  952. const updateJoinPay = async () => {
  953. const { data } = await updateJoinPayMchCheck({ id: joinPayMchID.value });
  954. if (data.code === "00000") {
  955. showSuccessToast(t('joinpayMch.withdrawalSucceeded'));
  956. setTimeout(() => {
  957. location.reload();
  958. }, 1500);
  959. } else { showFailToast(`${data.message}`); }
  960. }
  961. // 图片上传表单提交
  962. const sentImageFun = async () => {
  963. const loadingUp = showLoadingToast({
  964. message: '上传中...',
  965. forbidClick: true,
  966. duration: 0,
  967. });
  968. const params = {
  969. id: joinPayMchID.value,
  970. type: addParams.bankAccountType === '4' ? '0' : '1',
  971. status: sentImageForm.status,
  972. tradeLicence: null,
  973. openAccountLicence: null
  974. };
  975. if (cardNegativeList.value.length < 1) { showFailToast(t('joinpayMch.uploPortrait')); return; }
  976. if (cardPositiveList.value.length < 1) { showFailToast(t('joinpayMch.uploNatiEmblem')); return; }
  977. if (addParams.bankAccountType === '1') {
  978. if (statementCard.value.length < 1) { showFailToast(t('joinpayMch.upStatementCard')); return; }
  979. }
  980. params.cardPositive = cardPositiveList.value[0].content;
  981. params.cardNegative = cardNegativeList.value[0].content;
  982. if (addParams.bankAccountType === '4') {
  983. if (tradeLicenceList.value.length < 1) { showFailToast(t('joinpayMch.businessLicensePlace')); return; }
  984. if (openAccountLicenceList.value.length < 1) { showFailToast(t('joinpayMch.accountOpeningLicensePlace')); return; }
  985. }
  986. if (tradeLicenceList.value.length > 0) { params.tradeLicence = tradeLicenceList.value[0].content; }
  987. if (openAccountLicenceList.value.length > 0) { params.openAccountLicence = openAccountLicenceList.value[0].content; }
  988. try {
  989. const { data } = await sentImage(params);
  990. let response = null;
  991. if (data.code === "00000") {
  992. if (huifuMchNO.value == null) {
  993. response = await openAccount({ id: huifuMchID.value });
  994. if (response.data.code === "00000") {
  995. console.log("response", response);
  996. loadingUp.close();
  997. showSuccessToast(t('joinpayMch.uploadSucceeded'));
  998. setTimeout(() => {
  999. location.reload();
  1000. }, 1500);
  1001. } else {
  1002. console.log("response", response);
  1003. loadingUp.close();
  1004. showFailToast(`${response.data.message}`);
  1005. }
  1006. } else {
  1007. showSuccessToast(t('joinpayMch.uploadSucceeded'));
  1008. setTimeout(() => {
  1009. location.reload();
  1010. }, 1500);
  1011. }
  1012. } else { showFailToast(t('joinpayMch.submitFailed')); }
  1013. } catch (error) {
  1014. loadingUp.close();
  1015. console.error('请求发生错误:', error);
  1016. showFailToast(t('joinpayMch.submitFailed'));
  1017. }
  1018. }
  1019. // 图片重新上传触发
  1020. const updateSentImage = () => {
  1021. sentImageForm.status = '1';
  1022. pageType.value = '3';
  1023. }
  1024. // 签约触发
  1025. const altMchSignFun = async () => {
  1026. console.log("joinPayMchID", joinPayMchID.value);
  1027. console.log("huifuMchID", huifuMchID.value);
  1028. try {
  1029. const { data } = await altMchSign({ id: joinPayMchID.value });
  1030. if (data.code === "00000") {
  1031. console.log(huifuAuditStatus.value);
  1032. let huifuMch = await openAccount({ id: huifuMchID.value });
  1033. if (huifuMch.data.code === "00000") {
  1034. showSuccessToast(t('joinpayMch.signingSuccessfully'));
  1035. setTimeout(() => {
  1036. location.reload();
  1037. }, 1500);
  1038. } else {
  1039. showFailToast(`${huifuMch.data.message}`);
  1040. }
  1041. } else {
  1042. showFailToast(`${data.message}`);
  1043. }
  1044. } catch (error) {
  1045. console.error('请求发生错误:', error);
  1046. showFailToast(t('joinpayMch.submitFailed'));
  1047. }
  1048. }
  1049. // 记录表单填写
  1050. const fieldUpdate = () => {
  1051. // console.log('fieldUpdate');
  1052. if (addParams.altMerchantType === '10') {
  1053. addParams.bankAccountType = '1';
  1054. }
  1055. if (isMemoryFormType) {
  1056. localStorage.setItem('joinPayMchForm', JSON.stringify(addParams));
  1057. }
  1058. };
  1059. // 图片上传状态,0:未上传 1:已上传
  1060. const uploadCertFront = ref(0);
  1061. const uploadCertBack = ref(0);
  1062. const uploadCard = ref(0);
  1063. const tradeLicenceStatus = ref(0);
  1064. const accountLicenceStatus = ref(0);
  1065. // 文件上传
  1066. const afterRead = async (file) => {
  1067. file.status = 'uploading';
  1068. file.message = '上传中...';
  1069. const params = {
  1070. adminId: user.id,
  1071. base64Str: null,
  1072. fileType: null,
  1073. };
  1074. // 人像面
  1075. if (cardNegativeList.value.length > 0 && uploadCertFront.value === 0) {
  1076. params.base64Str = cardNegativeList.value[0].content;
  1077. if (addParams.bankAccountType === '1') {
  1078. params.fileType = "F40";
  1079. } else {
  1080. params.fileType = "F02";
  1081. }
  1082. try {
  1083. console.log(params.fileType);
  1084. const { data } = await newUploadPic(params);
  1085. if (data.code == "00000") {
  1086. file.status = 'done';
  1087. uploadCertFront.value = 1;
  1088. } else {
  1089. file.status = 'failed';
  1090. file.message = '上传失败';
  1091. }
  1092. } catch {
  1093. file.status = 'failed';
  1094. file.message = '上传失败';
  1095. }
  1096. }
  1097. // 国徽面
  1098. if (cardPositiveList.value.length > 0 && uploadCertBack.value === 0) {
  1099. params.base64Str = cardPositiveList.value[0].content;
  1100. if (addParams.bankAccountType === '1') {
  1101. params.fileType = "F41";
  1102. } else {
  1103. params.fileType = "F03";
  1104. }
  1105. try {
  1106. console.log(params.fileType);
  1107. const { data } = await newUploadPic(params);
  1108. if (data.code == "00000") {
  1109. file.status = 'done';
  1110. uploadCertBack.value = 1;
  1111. } else {
  1112. file.status = 'failed';
  1113. file.message = '上传失败';
  1114. }
  1115. } catch {
  1116. file.status = 'failed';
  1117. file.message = '上传失败';
  1118. }
  1119. }
  1120. // 结算卡
  1121. if (statementCard.value.length > 0 && uploadCard.value === 0) {
  1122. params.base64Str = statementCard.value[0].content;
  1123. params.fileType = "F13";
  1124. try {
  1125. console.log(params.fileType);
  1126. const { data } = await newUploadPic(params);
  1127. if (data.code == "00000") {
  1128. file.status = 'done';
  1129. uploadCard.value = 1;
  1130. } else {
  1131. file.status = 'failed';
  1132. file.message = '上传失败';
  1133. }
  1134. } catch {
  1135. file.status = 'failed';
  1136. file.message = '上传失败';
  1137. }
  1138. }
  1139. // 营业执照
  1140. if (tradeLicenceList.value.length > 0 && tradeLicenceStatus.value === 0) {
  1141. params.base64Str = tradeLicenceList.value[0].content;
  1142. params.fileType = "F07";
  1143. try {
  1144. const { data } = await newUploadPic(params);
  1145. if (data.code == "00000") {
  1146. file.status = 'done';
  1147. tradeLicenceStatus.value = 1;
  1148. } else {
  1149. file.status = 'failed';
  1150. file.message = '上传失败';
  1151. }
  1152. } catch {
  1153. file.status = 'failed';
  1154. file.message = '上传失败';
  1155. }
  1156. }
  1157. // 开户许可证
  1158. if (openAccountLicenceList.value.length > 0 && accountLicenceStatus.value === 0) {
  1159. params.base64Str = openAccountLicenceList.value[0].content;
  1160. params.fileType = "F08";
  1161. try {
  1162. const { data } = await newUploadPic(params);
  1163. if (data.code == "00000") {
  1164. file.status = 'done';
  1165. accountLicenceStatus.value = 1;
  1166. } else {
  1167. file.status = 'failed';
  1168. file.message = '上传失败';
  1169. }
  1170. } catch {
  1171. file.status = 'failed';
  1172. file.message = '上传失败';
  1173. }
  1174. }
  1175. }
  1176. // 删除时改变上传状态
  1177. const deleteCertFront = () => {
  1178. uploadCertFront.value = 0;
  1179. cardNegativeList.value = [];
  1180. }
  1181. const deleteCertBack = () => {
  1182. uploadCertBack.value = 0;
  1183. cardPositiveList.value = [];
  1184. }
  1185. const deleteCard = () => {
  1186. uploadCard.value = 0;
  1187. statementCard.value = [];
  1188. }
  1189. const deleteTradeLicence = () => {
  1190. tradeLicenceStatus.value = 0;
  1191. tradeLicenceList.value = [];
  1192. }
  1193. const deleteAccountLicence = () => {
  1194. accountLicenceStatus.value = 0;
  1195. openAccountLicenceList.value = [];
  1196. }
  1197. const onOversize = () => { showFailToast(t('joinpayMch.exceedPictSize')); }
  1198. return {
  1199. pageType,
  1200. joinPayMchType,
  1201. joinPayMchStep,
  1202. ...toRefs(addParams),
  1203. ...toRefs(huifuParams),
  1204. ...toRefs(sentImageForm),
  1205. cardPositiveList,
  1206. cardNegativeList,
  1207. tradeLicenceList,
  1208. statementCard,
  1209. openAccountLicenceList,
  1210. saveJoinPayMchFun,
  1211. updateJoinPay,
  1212. sentImageFun,
  1213. approveStatus,
  1214. signStatus,
  1215. conStat,
  1216. updateSentImage,
  1217. altMchSignFun,
  1218. idCardExpiryShow,
  1219. idCardExpiryOnConfirm,
  1220. licenseExpiryShow,
  1221. licenseExpiryOnConfirm,
  1222. fieldUpdate,
  1223. afterRead,
  1224. deleteCertFront,
  1225. deleteCertBack,
  1226. deleteCard,
  1227. deleteTradeLicence,
  1228. deleteAccountLicence,
  1229. onOversize,
  1230. showBeginDate,
  1231. showEndDate,
  1232. minDate: new Date(2000, 0, 1),
  1233. maxDate: new Date(2050, 11, 31),
  1234. onConfirmBeginDate,
  1235. onConfirmEndDate,
  1236. showBankAddress,
  1237. areaList,
  1238. onConfirmBankAddress,
  1239. showArea,
  1240. onConfirm,
  1241. showReAddress,
  1242. onConfirmReAddress,
  1243. showFoundDate,
  1244. onConfirmFoundDate,
  1245. showBeginDateLicense,
  1246. showEndDateLicense,
  1247. onConfirmEndDateLicense,
  1248. onConfirmBeginDateLicense,
  1249. huifuMchNO,
  1250. sendCode,
  1251. maskPhoneNumber,
  1252. verCodeTimeInterval,
  1253. verCodeTime,
  1254. ...toRefs(verCodeTime),
  1255. huifuAuditStatus,
  1256. huifuPicUpStatus,
  1257. huifuMchID,
  1258. joinPayMchID,
  1259. showPopover,
  1260. regNameVisible,
  1261. shortNameVisible,
  1262. popoverVisible
  1263. };
  1264. },
  1265. };
  1266. </script>
  1267. <style lang="less" scoped>
  1268. @import "../../common/style/common.less";
  1269. @import "../../styles/joinpayMch/index.less";</style>