btn.js 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314
  1. const utils = require('../../api/utils')
  2. const processDataSet = require('../utils/processDataSet')
  3. Component({
  4. data: {
  5. isUpdating: false,
  6. scope: '',
  7. getAuthorize: '',
  8. styleV2: my.styleV2,
  9. },
  10. props: {
  11. size: 'default',
  12. type: '',
  13. plain: false,
  14. disabled: false,
  15. loading: false,
  16. 'form-type': '',
  17. 'open-type': '',
  18. 'app-parameter': '',
  19. 'hover-class': 'button-hover',
  20. 'hover-stop-propagation': false,
  21. 'hover-start-time': false,
  22. className: '',
  23. onTap: () => {},
  24. onGetUserInfo: '',
  25. onGetPhoneNumber: '',
  26. },
  27. onInit() {
  28. this.updateData()
  29. },
  30. deriveDataFromProps(nextProps) {
  31. const {
  32. size,
  33. type,
  34. plain,
  35. disabled,
  36. loading,
  37. formType,
  38. openType,
  39. hoverClass,
  40. hoverStopPropagation,
  41. hoverStartTime,
  42. appParameter,
  43. } = nextProps
  44. const opentype = this.getOpenType(openType)
  45. const scope = this.getScope(openType)
  46. const params = {
  47. size,
  48. type,
  49. plain,
  50. disabled,
  51. loading,
  52. formType,
  53. opentype,
  54. scope,
  55. hoverClass,
  56. hoverStopPropagation,
  57. hoverStartTime,
  58. appParameter,
  59. }
  60. Object.keys(params).forEach(
  61. (key) => params[key] === undefined && delete params[key],
  62. )
  63. this.setData(params)
  64. },
  65. methods: {
  66. updateData() {
  67. if (this.data.isUpdating) {
  68. return
  69. }
  70. this.setData({
  71. isUpdating: true,
  72. })
  73. for (const key in this.props) {
  74. if (this.props.hasOwnProperty(key)) {
  75. typeof this.props[key] === 'string'
  76. && (this.props[key] = this.props[key].replace(/(^\s*)|(\s*$)/g, ''))
  77. }
  78. }
  79. const {
  80. size,
  81. type,
  82. plain,
  83. disabled,
  84. loading,
  85. formType,
  86. hoverClass,
  87. hoverStopPropagation,
  88. hoverStartTime,
  89. appParameter,
  90. openType,
  91. } = this.props
  92. this.getSystem(() => {
  93. const opentype = this.getOpenType(openType)
  94. const scope = this.getScope(openType)
  95. this.setData({
  96. isUpdating: false,
  97. size,
  98. type,
  99. plain,
  100. disabled,
  101. loading,
  102. formType,
  103. opentype,
  104. hoverClass,
  105. hoverStopPropagation,
  106. hoverStartTime,
  107. appParameter,
  108. scope,
  109. })
  110. })
  111. },
  112. getSystem(cb) {
  113. const that = this
  114. my.getSystemInfo({
  115. success(res) {
  116. let app = ''
  117. if (res.app && res.app === 'amap') {
  118. app = 'amap'
  119. } else {
  120. app = 'alipay'
  121. }
  122. that.setData({
  123. app,
  124. })
  125. cb()
  126. },
  127. })
  128. },
  129. getOpenType(opentype) {
  130. const transformList = {
  131. getPhoneNumber: 'getAuthorize',
  132. getUserInfo: 'getAuthorize',
  133. }
  134. if (transformList[opentype]) {
  135. return transformList[opentype]
  136. }
  137. let allowList = ['share', 'launchApp', 'getAuthorize', 'openSetting']
  138. if (this.data.app === 'amap') {
  139. allowList = ['share', 'getAuthorize', 'openSetting']
  140. }
  141. if (opentype) {
  142. if (allowList.indexOf(opentype) !== -1) {
  143. return opentype
  144. } else {
  145. utils.warn(`小程序open-type值不支持${opentype}`, {
  146. apiName: `button/open-type/${opentype}`,
  147. errorType: 0,
  148. type: 'component',
  149. })
  150. }
  151. }
  152. return ''
  153. },
  154. getScope(opentype) {
  155. const scopeMap = {
  156. getPhoneNumber: 'phoneNumber',
  157. getUserInfo: 'userInfo',
  158. }
  159. return scopeMap[opentype] || ''
  160. },
  161. onError(err) {
  162. if (this.props.onError === 'function') {
  163. this.props.onError(err)
  164. }
  165. },
  166. getAuthorize() {
  167. const that = this
  168. const resObj = {}
  169. if (
  170. this.data.opentype === 'getAuthorize'
  171. && this.data.scope === 'phoneNumber'
  172. ) {
  173. my.getPhoneNumber({
  174. success: (res) => {
  175. if (typeof that.props.onGetPhoneNumber === 'function') {
  176. resObj.detail = res
  177. resObj.type = 'getphonenumber'
  178. that.props.onGetPhoneNumber(resObj)
  179. }
  180. },
  181. fail: (res) => {
  182. if (typeof that.props.onGetPhoneNumber === 'function') {
  183. resObj.detail = res
  184. resObj.type = 'getphonenumber'
  185. that.props.onGetPhoneNumber(resObj)
  186. }
  187. },
  188. })
  189. }
  190. if (
  191. this.data.opentype === 'getAuthorize'
  192. && this.data.scope === 'userInfo'
  193. ) {
  194. my.getOpenUserInfo({
  195. success: (res) => {
  196. if (typeof that.props.onGetUserInfo === 'function') {
  197. const _res = JSON.parse(res.response).response
  198. _res.gender && _res.gender === 'm'
  199. ? (_res.gender = 1)
  200. : (_res.gender = 2)
  201. _res.avatarUrl = _res.avatar
  202. delete _res.avatar
  203. resObj.detail = {}
  204. resObj.detail.userInfo = _res
  205. resObj.type = 'getuserinfo'
  206. that.props.onGetUserInfo(resObj)
  207. }
  208. },
  209. fail: (res) => {
  210. if (typeof that.props.onGetUserInfo === 'function') {
  211. resObj.detail = res
  212. resObj.type = 'getuserinfo'
  213. that.props.onGetUserInfo(resObj)
  214. }
  215. },
  216. })
  217. }
  218. },
  219. stopEvent() {},
  220. btnOnTap(e) {
  221. const that = this
  222. const tapEvent = processDataSet(e, this.props)
  223. if (this.props.openType === 'openSetting') {
  224. my.openSetting({
  225. success(res) {
  226. if (typeof that.props.onOpenSetting === 'function') {
  227. that.props.onOpenSetting({
  228. ...tapEvent,
  229. type: 'opensetting',
  230. detail: {
  231. authSetting: utils.mapAuthSetting(res.authSetting),
  232. },
  233. })
  234. }
  235. },
  236. })
  237. }
  238. this.props.catchTap && this.props.catchTap(tapEvent)
  239. this.props.onTap && this.props.onTap(tapEvent)
  240. },
  241. getPhone(e) {
  242. const eve = { ...e }
  243. my.getPhoneNumber({
  244. success: (res) => {
  245. if (typeof res.response === 'string') {
  246. const response = JSON.parse(res.response)
  247. if (response.response.code === '40001') {
  248. utils.warn('请去小程序开发管理后台的功能列表中添加获取电话功能', {
  249. apiName: 'button/bindgetphonenumber',
  250. errorType: 1,
  251. type: 'component',
  252. })
  253. }
  254. return false
  255. }
  256. eve.detail = res.response
  257. if (typeof this.props.onGetPhoneNumber === 'function') {
  258. this.props.onGetPhoneNumber(eve)
  259. }
  260. },
  261. fail(err) {
  262. throw err
  263. },
  264. })
  265. },
  266. getUserInfo(e) {
  267. const that = this
  268. // 获取用户信息
  269. const eve = { ...e }
  270. my.getAuthCode({
  271. scopes: 'auth_user',
  272. success: () => {
  273. my.getOpenUserInfo({
  274. success: (userInfo) => {
  275. eve.detail = {
  276. userInfo: {},
  277. rawData: '',
  278. }
  279. if (typeof userInfo.response === 'string') {
  280. const response = JSON.parse(userInfo.response)
  281. if (response.response.code === '40006') {
  282. utils.warn(
  283. '请去小程序开发管理后台的功能列表中添加会员信息功能',
  284. {
  285. apiName: 'button/bindgetuserinfo',
  286. errorType: 1,
  287. type: 'component',
  288. },
  289. )
  290. }
  291. return false
  292. }
  293. eve.detail.userInfo = { ...userInfo.response }
  294. eve.detail.userInfo.avatarUrl = eve.detail.userInfo.avatar
  295. delete eve.detail.userInfo.avatar
  296. eve.detail.rawData = JSON.stringify(eve.detail.userInfo)
  297. if (typeof that.props.onGetUserInfo === 'function') {
  298. that.props.onGetUserInfo(eve)
  299. }
  300. },
  301. fail(err) {
  302. throw err
  303. },
  304. })
  305. },
  306. })
  307. },
  308. },
  309. })