cashDetail.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482
  1. <template>
  2. <view class="cash">
  3. <view
  4. style="background-image: url('../../static/images/my/qanbaobg.png');background-size: 100%;height: 400upx;">
  5. <view style="font-size: 32upx;padding-top: 100upx;">可提现总额</view>
  6. <view style="font-size: 40upx;padding-top: 20upx;">¥ {{money}}</view>
  7. <view
  8. style="width: 90%;height: max-content;margin-left: 40upx;background-color: #FFFFFF;box-shadow: rgba(183, 183, 183, 0.3) 0px 1px 10px;margin-top: 50upx;border-radius: 20upx;">
  9. <view style="display: flex;flex-direction: row;padding: 20upx;">
  10. <view style="font-size: 32upx;color: #333333;">提现金额 <text style="font-size: 28upx;color: #FF2638;"
  11. v-if="shouxufei">(注:提现手续费为{{shouxufei * 100}}%)</text>
  12. </view>
  13. </view>
  14. <view style="display: flex;flex-direction: row;padding: 20upx;">
  15. <view style="font-size: 40upx;color: #333333;">¥</view>
  16. <input type="text" v-model="moneys" placeholder="请输入金额"
  17. style="font-size: 40upx;color: #333333;text-align: left;margin-left: 10upx;width: 100%;" />
  18. </view>
  19. <view style="background: #E6E6E6;width: 100%;height: 1upx;"></view>
  20. <view style="display: flex;flex-direction: row;flex-wrap: wrap;">
  21. <view style="display: flex;flex-direction: row;" v-for="(item, index) in moneyList" :key="index">
  22. <view>
  23. <view style="padding: 20upx;" @click="getOut(item.money)">
  24. <view
  25. style="padding-top: 40upx;width: 180upx; height: 120upx;background-color: #FFFFFF;border:1px solid #FFCC00;border-radius: 10upx;">
  26. {{ item.money }}
  27. </view>
  28. </view>
  29. </view>
  30. </view>
  31. </view>
  32. </view>
  33. <view style="margin-top:59upx" class="padding-lr margin-lr-sm">
  34. <view class="flex justify-between margin-bottom-xl" v-for="(item,index) in openLists" :key="index">
  35. <view class="flex align-center">
  36. <image :src="item.image" style="width:23px;height:20px"></image>
  37. <text class="text-lg margin-left-sm" style="color:#333333;font-weight:700;">{{item.text}}</text>
  38. </view>
  39. <view>
  40. <radio-group name="openWay" style="margin-left: 20upx;" @tap='selectWay(item)'>
  41. <label class="tui-radio">
  42. <radio color="#FF7F00" :checked="openWay === item.id ? true : false" />
  43. </label>
  44. </radio-group>
  45. </view>
  46. </view>
  47. </view>
  48. <view @click="getOut()"
  49. style="margin: 32upx;font-size: 18px;background: #FFCC00;border-radius: 10px;height: 40px;line-height: 40px">
  50. 提现
  51. </view>
  52. <view style="display: flex;width: 100%;justify-content: center;">
  53. <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="goZhifuBao">提现账号
  54. </view>
  55. <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="goqianbao">钱包明细
  56. </view>
  57. <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="isShow">微信收款码
  58. </view>
  59. <view style="color: grey;padding-bottom: 30px;padding-top: 20upx;flex: 1;" @click="gojilu">提现记录
  60. </view>
  61. </view>
  62. </view>
  63. <!-- 微信收款码弹框 -->
  64. <u-popup v-model="show" mode="center">
  65. <view class="padding">
  66. <view class="text-center text-lg text-bold flex justify-between">
  67. <view></view>
  68. <view>添加微信收款码</view>
  69. <view @click="show=false">X</view>
  70. </view>
  71. <!-- <view class="text-center padding-top-sm padding-bottom-lg" style="color: #999999;">请提交微信号和微信二维码
  72. </view> -->
  73. <view style="width: 80%;margin: 0 auto;">
  74. <view class="margin-top" @click.stop="weixin"
  75. style="border: 4rpx solid #010101;border-radius: 16rpx;overflow: hidden;">
  76. <image v-if="!wximg" src="../../static/images/my/erweima.png"></image>
  77. <image v-else :src="wximg" mode=""></image>
  78. </view>
  79. </view>
  80. <!-- <view class="text-center margin-top-sm " @click="submit"
  81. style="border-radius: 10rpx;background-color: #7E59FF;color: #fff;height: 80rpx;line-height: 80rpx;">保存</view> -->
  82. </view>
  83. </u-popup>
  84. <!-- <view v-if="show" class="popup">
  85. </view> -->
  86. </view>
  87. </template>
  88. <script>
  89. export default {
  90. data() {
  91. return {
  92. show: false,
  93. money: '',
  94. moneys: '',
  95. zhifubao: '',
  96. mayMoney: '0',
  97. zhifubaoName: '',
  98. shouxufei: '',
  99. moneyList: [{
  100. money: '10'
  101. },
  102. {
  103. money: '20'
  104. },
  105. {
  106. money: '50'
  107. },
  108. {
  109. money: '100'
  110. },
  111. {
  112. money: '200'
  113. },
  114. {
  115. money: '500'
  116. }
  117. ],
  118. value: 0,
  119. min: '',
  120. zhifubao: '',
  121. zhifubaoName: '',
  122. openLists: [],
  123. openWay: 1,
  124. values: '',
  125. wximg: ''
  126. };
  127. },
  128. onLoad() {
  129. this.getUserInfo()
  130. this.$Request.getT('/common/type/290').then(res => { //判断微信提现方式
  131. if (res.code == 0) {
  132. if (res.data && res.data.value) {
  133. this.values = res.data.value
  134. }
  135. }
  136. })
  137. //提现手续费
  138. this.$Request.getT('/common/type/115').then(res => {
  139. if (res.code === 0) {
  140. this.shouxufei = res.data.value;
  141. }
  142. });
  143. this.openLists = [{
  144. image: '../../static/images/img/icon_weixin.png',
  145. text: '微信',
  146. id: 1
  147. }, {
  148. image: '../../static/images/img/zhifubao.png',
  149. text: '支付宝',
  150. id: 2
  151. }];
  152. this.openWay = 1;
  153. },
  154. onShow: function(e) {
  155. this.getwalletMoney();
  156. this.getUserInfo()
  157. },
  158. onNavigationBarButtonTap() {
  159. this.list();
  160. },
  161. methods: {
  162. //用户收款码弹框
  163. isShow() {
  164. this.getUserInfo()
  165. this.show = true
  166. },
  167. //微信 支付宝提现选择
  168. selectWay: function(item) {
  169. this.openWay = item.id;
  170. },
  171. //获取用户信息获取用户是否上传收款码
  172. getUserInfo() {
  173. this.$Request.getA("/sys/user/info").then(res => {
  174. if (res.code == 0) {
  175. this.zhifubao = res.user.userEntity.zhiFuBao
  176. this.zhifubaoName = res.user.userEntity.zhiFuBaoName
  177. this.wximg = res.user.userEntity.cashQrCode;
  178. // console.log(this.zhifubao, this.zhifubaoName, '-')
  179. }
  180. });
  181. },
  182. //获取账户余额
  183. getwalletMoney() {
  184. this.$Request.getT('/shop/shopmoney/selectShopMoney').then(res => {
  185. if (res.code == 0) {
  186. this.money = res.data.money;
  187. }
  188. uni.hideLoading();
  189. });
  190. },
  191. gojilu() {
  192. uni.navigateTo({
  193. url: '/my/other/moneydetail'
  194. });
  195. },
  196. goqianbao() {
  197. uni.navigateTo({
  198. url: '/my/other/cashList'
  199. });
  200. },
  201. goZhifuBao() {
  202. uni.navigateTo({
  203. url: '/my/other/zhifubao'
  204. });
  205. },
  206. weixin() {
  207. let that = this
  208. uni.chooseImage({
  209. count: 1, //默认9
  210. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  211. sourceType: ['album', 'camera'], //从相册选择
  212. success: (res) => {
  213. console.log('`````````````', res)
  214. that.$queue.showLoading("上传中...");
  215. for (let i = 0; i < 1; i++) {
  216. uni.uploadFile({ // 上传接口
  217. url: 'https://mxys.chuanghai-tech.com/sqx_fast/alioss/upload', //真实的接口地址
  218. filePath: res.tempFilePaths[i],
  219. name: 'file',
  220. success: (uploadFileRes) => {
  221. let img = JSON.parse(uploadFileRes.data).data
  222. // let userId = that.$queue.getData('userId');
  223. let data = {
  224. cashQrCode: img
  225. }
  226. that.$Request.getA('/shop/shopmoney/shopBindingQrCode',
  227. data).then(
  228. res => {
  229. if (res.code == 0) {
  230. that.getUserInfo()
  231. setTimeout(function() {
  232. that.$queue.showToast('上传成功')
  233. }, 1000)
  234. }
  235. });
  236. uni.hideLoading();
  237. // that.show = false
  238. }
  239. });
  240. }
  241. }
  242. });
  243. },
  244. //校验用户输入金额
  245. checkMobile(money) {
  246. return RegExp(/^1[34578]\d{9}$/).test(money);
  247. },
  248. getOut(money) {
  249. let that = this
  250. if (money) {
  251. that.moneys = money
  252. }
  253. if (!/^\d+$/.test(that.moneys)) {
  254. uni.showToast({
  255. icon: 'none',
  256. title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
  257. });
  258. return;
  259. }
  260. if (that.openWay == 2) { //支付宝提现
  261. if (that.zhifubao != null && that.zhifubaoName != null) {
  262. uni.showModal({
  263. title: "提现申请提示",
  264. content: '请仔细确认收款人信息\n\n收款人姓名:' + that.zhifubaoName + '\n\n收款人账号:' + that.zhifubao +
  265. '\n\n提现金额:' + that.moneys + '元\t\t手续费:' + (that.moneys * that.shouxufei).toFixed(
  266. 1),
  267. success: (e) => {
  268. if (e.confirm) {
  269. that.$queue.showLoading("提现中...");
  270. let data = {
  271. money: that.moneys,
  272. classify: '1'
  273. }
  274. that.$Request.getT('/shop/shopmoney/shopCashMoney', data).then(
  275. res => {
  276. if (res.status === 0 && res.data) {
  277. setTimeout(function() {
  278. that.$queue.showToast("提现申请成功,预计三个工作日到账");
  279. }, 3000)
  280. that.getwalletMoney();
  281. } else {
  282. that.$queue.showToast(res.msg);
  283. that.getwalletMoney();
  284. }
  285. uni.hideLoading();
  286. });
  287. }
  288. }
  289. });
  290. } else {
  291. uni.navigateTo({
  292. url: '/my/other/zhifubao'
  293. });
  294. }
  295. } else if (that.openWay == 1) { //微信提现
  296. if (that.values == 2) {
  297. that.$Request.getA('/sys/user/info').then(res => {
  298. if (res.code === 0) {
  299. let wxImg = res.user.userEntity.cashQrCode;
  300. if (!wxImg) {
  301. uni.showModal({
  302. title: '提现提示',
  303. content: '请上传微信收款码',
  304. showCancel: true,
  305. cancelText: '取消',
  306. confirmText: '上传',
  307. success: res => {
  308. if (res.confirm) {
  309. that.show = true
  310. }
  311. },
  312. fail: () => {},
  313. complete: () => {}
  314. });
  315. return;
  316. }
  317. if (!/^\d+$/.test(that.moneys)) {
  318. uni.showToast({
  319. icon: 'none',
  320. title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
  321. });
  322. return;
  323. }
  324. if (that.moneys * 1 >= that.value * 1) {
  325. uni.showModal({
  326. title: '提现申请提示',
  327. content: '金额:' + that.moneys + '元'+','+'手续费:' + (that.moneys *that.shouxufei).toFixed(1),
  328. success: e => {
  329. if (e.confirm) {
  330. that.$queue.showLoading('提现中...');
  331. let data = {
  332. money: that.moneys,
  333. classify: 2
  334. }
  335. that.$Request.getT('/shop/shopmoney/shopCashMoney',
  336. data).then(
  337. res => {
  338. if (res.code === 0) {
  339. setTimeout(function() {
  340. that.$queue.showToast(
  341. '提现申请成功,预计三个工作日到账');
  342. }, 1000)
  343. that.getwalletMoney();
  344. } else {
  345. uni.showModal({
  346. title: '温馨提示',
  347. content: res.msg,
  348. showCancel: false,
  349. cancelText: '取消',
  350. confirmText: '确认'
  351. });
  352. }
  353. uni.hideLoading();
  354. });
  355. }
  356. }
  357. });
  358. } else {
  359. setTimeout(function() {
  360. that.$queue.showToast('提现金额必须大于或等于' + that.value + '元才可提现');
  361. }, 1000)
  362. }
  363. } else {
  364. that.$queue.showToast('网络状态不好,请刷新后重试!');
  365. }
  366. });
  367. } else {
  368. if (!/^\d+$/.test(that.moneys)) {
  369. uni.showToast({
  370. icon: 'none',
  371. title: '请输入正确金额,不能包含中文,英文,特殊字符和小数'
  372. });
  373. return;
  374. }
  375. if (parseFloat(that.moneys).toFixed(1) >= that.value) {
  376. uni.showModal({
  377. title: '提现申请提示',
  378. content: '金额:' + that.moneys + '元'+','+'手续费:' + parseFloat(that.moneys *
  379. that.shouxufei).toFixed(1),
  380. success: e => {
  381. if (e.confirm) {
  382. that.$queue.showLoading('提现中...');
  383. let data = {
  384. money: that.moneys,
  385. classify: 2
  386. }
  387. that.$Request.getT('/shop/shopmoney/shopCashMoney', data).then(
  388. res => {
  389. if (res.code === 0) {
  390. setTimeout(function() {
  391. that.$queue.showToast('提现申请成功,预计三个工作日到账');
  392. }, 1000)
  393. that.getwalletMoney();
  394. } else {
  395. uni.showModal({
  396. title: '温馨提示',
  397. content: res.msg,
  398. showCancel: false,
  399. cancelText: '取消',
  400. confirmText: '确认'
  401. });
  402. that.getwalletMoney();
  403. }
  404. uni.hideLoading();
  405. });
  406. }
  407. }
  408. });
  409. } else {
  410. that.$queue.showToast('提现金额必须大于或等于' + that.value + '元才可提现');
  411. }
  412. }
  413. }
  414. },
  415. }
  416. };
  417. </script>
  418. <style lang="less">
  419. // @import '../../static/css/index.css';
  420. .view2-view-text {
  421. font-size: 14px;
  422. color: #000000;
  423. margin-left: 20upx;
  424. width: 80%;
  425. }
  426. .view2-view-image-right {
  427. width: 18upx;
  428. height: 30upx;
  429. margin-left: 50upx;
  430. }
  431. .cash {
  432. text-align: center;
  433. background: white;
  434. height: 100%;
  435. position: absolute;
  436. width: 100%;
  437. .cash-top {
  438. padding: 32upx 32upx 50upx 32upx;
  439. /* border-bottom: 1px solid gainsboro; */
  440. background: #FF2638;
  441. }
  442. .leiji {
  443. font-size: 14px;
  444. color: #ffffff;
  445. margin-bottom: 10px;
  446. }
  447. }
  448. </style>