config.html 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441
  1. <form id="config-form" class="edit-form form-horizontal" role="form" data-toggle="validator" method="POST" action="">
  2. <div class="panel panel-default panel-intro">
  3. <div class="panel-heading">
  4. <ul class="nav nav-tabs nav-group">
  5. <li class="active"><a href="#wechat" data-toggle="tab">微信支付</a></li>
  6. <li><a href="#alipay" data-toggle="tab">支付宝</a></li>
  7. </ul>
  8. </div>
  9. <div class="panel-body">
  10. <div id="myTabContent" class="tab-content">
  11. {foreach $addon.config as $item}
  12. {if $item.name=='version'}
  13. <input type="hidden" value="{$item.value}" name="row[version]"/>
  14. {elseif $item.name=='wechat'/}
  15. <div class="tab-pane fade active in" id="wechat">
  16. <table class="table table-striped table-config">
  17. <tbody>
  18. <tr>
  19. <td width="20%">APP的app_id</td>
  20. <td>
  21. <div class="row">
  22. <div class="col-sm-8 col-xs-12">
  23. <input type="text" name="row[wechat][appid]" value="{$item.value.appid|default=''}" class="form-control" data-rule="" data-tip="APP应用中支付时使用"/>
  24. </div>
  25. <div class="col-sm-4"></div>
  26. </div>
  27. </td>
  28. </tr>
  29. <tr>
  30. <td>公众号的app_id</td>
  31. <td>
  32. <div class="row">
  33. <div class="col-sm-8 col-xs-12">
  34. <input type="text" name="row[wechat][app_id]" value="{$item.value.app_id|default=''}" class="form-control" data-rule="" data-tip="公众号中支付时使用"/>
  35. </div>
  36. <div class="col-sm-4"></div>
  37. </div>
  38. </td>
  39. </tr>
  40. <tr>
  41. <td>公众号的app_secret</td>
  42. <td>
  43. <div class="row">
  44. <div class="col-sm-8 col-xs-12">
  45. <input type="text" name="row[wechat][app_secret]" value="{$item.value.app_secret|default=''}" class="form-control" data-rule="" data-tip="公众号中支付时使用"/>
  46. </div>
  47. <div class="col-sm-4"></div>
  48. </div>
  49. </td>
  50. </tr>
  51. <tr>
  52. <td>小程序的app_id</td>
  53. <td>
  54. <div class="row">
  55. <div class="col-sm-8 col-xs-12">
  56. <input type="text" name="row[wechat][miniapp_id]" value="{$item.value.miniapp_id|default=''}" class="form-control" data-rule="" data-tip="仅在小程序支付时使用"/>
  57. </div>
  58. <div class="col-sm-4"></div>
  59. </div>
  60. </td>
  61. </tr>
  62. <tr>
  63. <td>微信支付商户号</td>
  64. <td>
  65. <div class="row">
  66. <div class="col-sm-8 col-xs-12">
  67. <input type="text" name="row[wechat][mch_id]" value="{$item.value.mch_id|default=''}" class="form-control" data-rule="" data-tip=""/>
  68. </div>
  69. <div class="col-sm-4"></div>
  70. </div>
  71. </td>
  72. </tr>
  73. <tr>
  74. <td>微信支付商户API密钥V2</td>
  75. <td>
  76. <div class="row">
  77. <div class="col-sm-8 col-xs-12">
  78. <input type="text" name="row[wechat][key]" value="{$item.value.key|default=''}" class="form-control" data-rule="" data-tip=""/>
  79. </div>
  80. <div class="col-sm-4"></div>
  81. </div>
  82. </td>
  83. </tr>
  84. <tr>
  85. <td>微信支付商户API密钥V3</td>
  86. <td>
  87. <div class="row">
  88. <div class="col-sm-8 col-xs-12">
  89. <input type="text" name="row[wechat][key_v3]" value="{$item.value.key_v3|default=''}" class="form-control" data-rule="" data-tip=""/>
  90. </div>
  91. <div class="col-sm-4"></div>
  92. </div>
  93. </td>
  94. </tr>
  95. <tr>
  96. <td>支付模式</td>
  97. <td>
  98. <div class="row">
  99. <div class="col-sm-8 col-xs-12">
  100. {:Form::radios('row[wechat][mode]',['normal'=>'正式环境','dev'=>'沙箱环境','service'=>'服务商模式'],$item.value.mode??'normal')}
  101. <div style="margin-top:5px;" data-type="dev" class="text-muted {if ($item.value.mode??'')!=='dev'}hidden{/if}">
  102. <i class="fa fa-info-circle"></i> 沙箱环境:<a href="https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=23_1&index=2" target="_blank">微信支付验收指引</a>
  103. </div>
  104. </div>
  105. <div class="col-sm-4"></div>
  106. </div>
  107. </td>
  108. </tr>
  109. <tr data-type="service" class="{:$item.value.mode!='service'?'hidden':''}">
  110. <td>子商户商户号ID</td>
  111. <td>
  112. <div class="row">
  113. <div class="col-sm-8 col-xs-12">
  114. <input type="text" name="row[wechat][sub_mch_id]" value="{$item.value.sub_mch_id|default=''}" class="form-control" data-rule="" data-tip="如果未用到子商户,请勿填写"/>
  115. </div>
  116. <div class="col-sm-4"></div>
  117. </div>
  118. </td>
  119. </tr>
  120. <tr data-type="service" class="{:$item.value.mode!='service'?'hidden':''}">
  121. <td>子商户APP的app_id</td>
  122. <td>
  123. <div class="row">
  124. <div class="col-sm-8 col-xs-12">
  125. <input type="text" name="row[wechat][sub_appid]" value="{$item.value.sub_appid|default=''}" class="form-control" data-rule="" data-tip="如果未用到子商户,请勿填写"/>
  126. </div>
  127. <div class="col-sm-4"></div>
  128. </div>
  129. </td>
  130. </tr>
  131. <tr data-type="service" class="{:$item.value.mode!='service'?'hidden':''}">
  132. <td>子商户公众号的app_id</td>
  133. <td>
  134. <div class="row">
  135. <div class="col-sm-8 col-xs-12">
  136. <input type="text" name="row[wechat][sub_app_id]" value="{$item.value.sub_app_id|default=''}" class="form-control" data-rule="" data-tip="如果未用到子商户,请勿填写"/>
  137. </div>
  138. <div class="col-sm-4"></div>
  139. </div>
  140. </td>
  141. </tr>
  142. <tr data-type="service" class="{:$item.value.mode!='service'?'hidden':''}">
  143. <td>子商户小程序的app_id</td>
  144. <td>
  145. <div class="row">
  146. <div class="col-sm-8 col-xs-12">
  147. <input type="text" name="row[wechat][sub_miniapp_id]" value="{$item.value.sub_miniapp_id|default=''}" class="form-control" data-rule="" data-tip="如果未用到子商户,请勿填写"/>
  148. </div>
  149. <div class="col-sm-4"></div>
  150. </div>
  151. </td>
  152. </tr>
  153. <tr>
  154. <td>回调通知地址</td>
  155. <td>
  156. <div class="row">
  157. <div class="col-sm-8 col-xs-12">
  158. <input type="text" name="row[wechat][notify_url]" value="{$item.value.notify_url|default=''}" class="form-control" data-rule="" data-tip="请勿随意修改,实际以逻辑代码中请求的为准"/>
  159. </div>
  160. <div class="col-sm-4"></div>
  161. </div>
  162. </td>
  163. </tr>
  164. <tr>
  165. <td>微信支付API证书cert</td>
  166. <td>
  167. <div class="row">
  168. <div class="col-sm-8 col-xs-12">
  169. <div class="input-group">
  170. <input id="c-cert_client" class="form-control" size="50" name="row[wechat][cert_client]" type="text" value="{$item.value.cert_client|htmlentities}" data-tip="可选, 仅在退款、红包等情况时需要用到">
  171. <div class="input-group-addon no-border no-padding">
  172. <span><button type="button" id="faupload-cert_client" class="btn btn-danger faupload" data-url="epay/upload" data-multipart='{"certname":"cert_client"}' data-mimetype="pem" data-input-id="c-cert_client" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  173. </div>
  174. <span class="msg-box n-right" for="c-cert_client"></span>
  175. </div>
  176. <div style="margin-top:5px;"><a href="https://pay.weixin.qq.com" target="_blank"><i class="fa fa-question-circle"></i> 如何获取微信支付API证书?</a></div>
  177. </div>
  178. <div class="col-sm-4"></div>
  179. </div>
  180. </td>
  181. </tr>
  182. <tr>
  183. <td>微信支付API证书key</td>
  184. <td>
  185. <div class="row">
  186. <div class="col-sm-8 col-xs-12">
  187. <div class="input-group">
  188. <input id="c-cert_key" class="form-control" size="50" name="row[wechat][cert_key]" type="text" value="{$item.value.cert_key|htmlentities}" data-tip="可选, 仅在退款、红包等情况时需要用到">
  189. <div class="input-group-addon no-border no-padding">
  190. <span><button type="button" id="faupload-cert_key" class="btn btn-danger faupload" data-url="epay/upload" data-multipart='{"certname":"cert_key"}' data-mimetype="pem" data-input-id="c-cert_key" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  191. </div>
  192. <span class="msg-box n-right" for="c-cert_key"></span>
  193. </div>
  194. <div style="margin-top:5px;"><a href="https://pay.weixin.qq.com" target="_blank"><i class="fa fa-question-circle"></i> 如何获取微信支付API证书?</a></div>
  195. </div>
  196. <div class="col-sm-4"></div>
  197. </div>
  198. </td>
  199. </tr>
  200. <tr>
  201. <td>记录日志</td>
  202. <td>
  203. <div class="row">
  204. <div class="col-sm-8 col-xs-12">
  205. {:Form::radios('row[wechat][log]',['1'=>'开启','0'=>'关闭'],$item.value.log)}
  206. </div>
  207. <div class="col-sm-4"></div>
  208. </div>
  209. </td>
  210. </tr>
  211. </tbody>
  212. </table>
  213. </div>
  214. {elseif $item.name=='alipay'}
  215. <div class="tab-pane fade" id="alipay">
  216. <table class="table table-striped table-config">
  217. <tbody>
  218. <tr>
  219. <td>支付模式</td>
  220. <td>
  221. <div class="row">
  222. <div class="col-sm-12 col-xs-12">
  223. {:Form::radios('row[alipay][mode]',['normal'=>'正式环境','dev'=>'沙箱环境', 'service'=>'服务商模式'],$item.value.mode??'normal')}
  224. <div style="margin-top:5px;" data-mode="dev" class="text-muted {if ($item.value.mode??'')!=='dev'}hidden{/if}">
  225. <i class="fa fa-info-circle"></i> 如果使用沙箱环境,务必使用沙箱的app_id和沙箱配置,以及使用沙箱账号进行测试。<br>
  226. 沙箱环境:<a href="https://openhome.alipay.com/develop/sandbox/app" target="_blank">https://openhome.alipay.com/develop/sandbox/app</a>
  227. </div>
  228. </div>
  229. </div>
  230. </td>
  231. </tr>
  232. <tr class="text-muted {if ($item.value.mode??'')!=='service'}hidden{/if}" data-mode="service">
  233. <td width="20%">服务商ID(pid)</td>
  234. <td>
  235. <div class="row">
  236. <div class="col-sm-8 col-xs-12">
  237. <input type="text" name="row[alipay][pid]" value="{$item.value.pid|default=''}" class="form-control" data-rule="" data-tip=""/>
  238. </div>
  239. <div class="col-sm-4"></div>
  240. </div>
  241. </td>
  242. </tr>
  243. <tr>
  244. <td width="20%">应用ID(app_id)</td>
  245. <td>
  246. <div class="row">
  247. <div class="col-sm-8 col-xs-12">
  248. <input type="text" name="row[alipay][app_id]" value="{$item.value.app_id|default=''}" class="form-control" data-rule="" data-tip=""/>
  249. </div>
  250. <div class="col-sm-4"></div>
  251. </div>
  252. </td>
  253. </tr>
  254. <tr>
  255. <td>回调通知地址</td>
  256. <td>
  257. <div class="row">
  258. <div class="col-sm-8 col-xs-12">
  259. <input type="text" name="row[alipay][notify_url]" value="{$item.value.notify_url|default=''}" class="form-control" data-rule="" data-tip="请勿随意修改,实际以逻辑代码中请求的为准"/>
  260. </div>
  261. <div class="col-sm-4"></div>
  262. </div>
  263. </td>
  264. </tr>
  265. <tr>
  266. <td>支付跳转地址</td>
  267. <td>
  268. <div class="row">
  269. <div class="col-sm-8 col-xs-12">
  270. <input type="text" name="row[alipay][return_url]" value="{$item.value.return_url|default=''}" class="form-control" data-rule="" data-tip="请勿随意修改,实际以逻辑代码中请求的为准"/>
  271. </div>
  272. <div class="col-sm-4"></div>
  273. </div>
  274. </td>
  275. </tr>
  276. <tr>
  277. <td>应用私钥(private_key)</td>
  278. <td>
  279. <div class="row">
  280. <div class="col-sm-8 col-xs-12">
  281. <input type="text" name="row[alipay][private_key]" value="{$item.value.private_key|default=''}" class="form-control" data-rule=""/>
  282. <div style="margin-top:5px;"><a href="https://opensupport.alipay.com/support/helpcenter/207/201602469554" target="_blank"><i class="fa fa-question-circle"></i> 如何获取应用私钥?</a></div>
  283. </div>
  284. <div class="col-sm-4"></div>
  285. </div>
  286. </td>
  287. </tr>
  288. <tr>
  289. <td>签名方式</td>
  290. <td>
  291. <div>
  292. <div class="radio">
  293. <label for="row[alipay][signtype]-publickey"><input id="row[alipay][signtype]-publickey" name="row[alipay][signtype]" {if isset($item.value.signtype)&&$item.value.signtype=='publickey'}checked{/if} type="radio" value="publickey"> 普通公钥</label>
  294. <label for="row[alipay][signtype]-cert"><input id="row[alipay][signtype]-cert" {if isset($item.value.signtype)&&$item.value.signtype=='cert'}checked{/if} name="row[alipay][signtype]" type="radio" value="cert"> 公钥证书</label>
  295. </div>
  296. </div>
  297. <div style="margin-top:5px;" class="text-muted">
  298. <i class="fa fa-info-circle"></i> 如果要使用转账、提现功能,则必须使用公钥证书
  299. </div>
  300. </td>
  301. </tr>
  302. <tr>
  303. <td>
  304. <span data-signtype="publickey" class="{if ($item.value.signtype??'')==='cert'}hidden{/if}">支付宝公钥</span>
  305. <span data-signtype="cert" class="{if ($item.value.signtype??'')==='publickey' || ($item.value.signtype??'')==''}hidden{/if}">支付宝公钥证书路径</span>
  306. (alipay_public_key)
  307. </td>
  308. <td>
  309. <div class="row">
  310. <div class="col-sm-8 col-xs-12">
  311. <div class="input-group">
  312. <input id="c-ali_public_key" class="form-control" size="50" name="row[alipay][ali_public_key]" type="text" value="{$item.value.ali_public_key|default=''|htmlentities}" placeholder="普通公钥请直接粘贴,公钥证书请点击右侧的上传">
  313. <div class="input-group-addon no-border no-padding {if ($item.value.signtype??'')==='publickey' || ($item.value.signtype??'')==''}hidden{/if}" data-signtype="cert">
  314. <span><button type="button" id="faupload-ali_public_key" class="btn btn-danger faupload" data-url="epay/upload" data-multipart='{"certname":"ali_public_key"}' data-mimetype="crt" data-input-id="c-ali_public_key" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  315. </div>
  316. <span class="msg-box n-right" for="c-ali_public_key"></span>
  317. </div>
  318. <div style="margin-top:5px;"><a href="https://opensupport.alipay.com/support/FAQ/aba5803b-ad15-4474-aed6-92e43ea253ea" target="_blank"><i class="fa fa-question-circle"></i> 如何获取支付宝公钥?</a></div>
  319. </div>
  320. <div class="col-sm-4"></div>
  321. </div>
  322. </td>
  323. </tr>
  324. <tr>
  325. <td>
  326. <span data-signtype="publickey" class="{if ($item.value.signtype??'')==='cert'}hidden{/if}">应用公钥</span>
  327. <span data-signtype="cert" class="{if ($item.value.signtype??'')==='publickey' || ($item.value.signtype??'')==''}hidden{/if}">应用公钥证书路径</span>
  328. (app_cert_public_key)
  329. </td>
  330. <td>
  331. <div class="row">
  332. <div class="col-sm-8 col-xs-12">
  333. <div class="input-group">
  334. <input id="c-app_cert_public_key" class="form-control" size="50" name="row[alipay][app_cert_public_key]" type="text" value="{$item.value.app_cert_public_key|default=''|htmlentities}">
  335. <div class="input-group-addon no-border no-padding {if ($item.value.signtype??'')==='publickey' || ($item.value.signtype??'')==''}hidden{/if}" data-signtype="cert">
  336. <span><button type="button" id="faupload-app_cert_public_key" class="btn btn-danger faupload" data-url="epay/upload" data-multipart='{"certname":"app_cert_public_key"}' data-mimetype="crt" data-input-id="c-app_cert_public_key" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  337. </div>
  338. <span class="msg-box n-right" for="c-app_cert_public_key"></span>
  339. </div>
  340. <div style="margin-top:5px;"><a href="https://opensupport.alipay.com/support/FAQ/aba5803b-ad15-4474-aed6-92e43ea253ea" target="_blank"><i class="fa fa-question-circle"></i> 如何获取应用公钥?</a></div>
  341. </div>
  342. <div class="col-sm-4"></div>
  343. </div>
  344. </td>
  345. </tr>
  346. <tr class="{if ($item.value.signtype??'')==='publickey' || ($item.value.signtype??'')==''}hidden{/if}" data-signtype="cert">
  347. <td>支付宝根证书路径(alipay_root_cert)</td>
  348. <td>
  349. <div class="row">
  350. <div class="col-sm-8 col-xs-12">
  351. <div class="input-group">
  352. <input id="c-alipay_root_cert" class="form-control" size="50" name="row[alipay][alipay_root_cert]" type="text" value="{$item.value.alipay_root_cert|default=''|htmlentities}">
  353. <div class="input-group-addon no-border no-padding">
  354. <span><button type="button" id="faupload-alipay_root_cert" class="btn btn-danger faupload" data-url="epay/upload" data-multipart='{"certname":"alipay_root_cert"}' data-mimetype="crt" data-input-id="c-alipay_root_cert" data-multiple="false"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  355. </div>
  356. <span class="msg-box n-right" for="c-alipay_root_cert"></span>
  357. </div>
  358. <div style="margin-top:5px;"><a href="https://opensupport.alipay.com/support/helpcenter/271/201602474998" target="_blank"><i class="fa fa-question-circle"></i> 如何获取支付宝根证书?</a></div>
  359. </div>
  360. <div class="col-sm-4"></div>
  361. </div>
  362. </td>
  363. </tr>
  364. <tr>
  365. <td>记录日志</td>
  366. <td>
  367. <div class="row">
  368. <div class="col-sm-8 col-xs-12">
  369. {:Form::radios('row[alipay][log]',['1'=>'开启','0'=>'关闭'],$item.value.log)}
  370. </div>
  371. <div class="col-sm-4"></div>
  372. </div>
  373. </td>
  374. </tr>
  375. <tr>
  376. <td>PC端使用扫码支付</td>
  377. <td>
  378. <div class="row">
  379. <div class="col-sm-8 col-xs-12">
  380. {:Form::radios('row[alipay][scanpay]',['1'=>'开启','0'=>'关闭'],$item.value.scanpay??0)}
  381. </div>
  382. <div class="col-sm-4"></div>
  383. </div>
  384. </td>
  385. </tr>
  386. </tbody>
  387. </table>
  388. </div>
  389. {/if}
  390. {/foreach}
  391. <div class="form-group layer-footer">
  392. <label class="control-label col-xs-12 col-sm-2"></label>
  393. <div class="col-xs-12 col-sm-8">
  394. <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
  395. <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
  396. </div>
  397. </div>
  398. </div>
  399. </div>
  400. </div>
  401. </form>
  402. <script>
  403. require.callback = function () {
  404. define('backend/addon', ['backend', 'form'], function (Backend, Form) {
  405. var Controller = {
  406. config: function () {
  407. $(document).on("click", ".nav-group li a[data-toggle='tab']", function () {
  408. if ($(this).attr("href") == "#all") {
  409. $(".tab-pane").addClass("active in");
  410. }
  411. return;
  412. });
  413. $(document).on("click", "input[name='row[wechat][mode]']", function () {
  414. $("#wechat [data-type]").addClass("hidden");
  415. $("#wechat [data-type='" + $(this).val() + "']").removeClass("hidden");
  416. });
  417. $(document).on("click", "input[name='row[alipay][mode]']", function () {
  418. $("#alipay [data-mode]").addClass("hidden");
  419. $("#alipay [data-mode='" + $(this).val() + "']").removeClass("hidden");
  420. });
  421. $(document).on("click", "input[name='row[alipay][signtype]']", function () {
  422. $("#alipay [data-signtype]").addClass("hidden");
  423. $("#alipay [data-signtype='" + $(this).val() + "']").removeClass("hidden");
  424. });
  425. Form.api.bindevent($("form[role=form]"));
  426. }
  427. };
  428. return Controller;
  429. });
  430. };
  431. </script>