index.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <template>
  2. <view class="box">
  3. <view class="title">
  4. 请使用手机网银将货款转入下方的公司账户,转的时候一定要在“备注”或者“附言”里输入【<text>货款</text>】两个字。
  5. </view>
  6. <view class="item">
  7. <view class="flex">
  8. <view class="item_title">
  9. 【账户名称】:大卫博士(浙江)贸易有限公司
  10. </view>
  11. <view class="item_btn" @click="copyG('大卫博士(浙江)贸易有限公司')">复制</view>
  12. </view>
  13. <text>
  14. (注意:直接点击“复制”公司账户名称,转账时直接粘贴,无需手动输入)
  15. </text>
  16. </view>
  17. <view class="item">
  18. <view class="flex">
  19. <view class="item_title">
  20. 【银行账号】:366279292191
  21. </view>
  22. <view class="item_btn" @click="copyG('366279292191')">复制</view>
  23. </view>
  24. <text>
  25. (注意:直接点击“复制”银行账号,转账时直接粘贴,无需手动输入)
  26. </text>
  27. </view>
  28. <view class="item">
  29. <view class="item_title">
  30. 【开户银行】:中国银行(浙江自贸区义乌支行)
  31. </view><br>
  32. <text>
  33. (注意:如果转账时若系统不要求选择具体的支行,直接选择“中国银行”就行)
  34. </text>
  35. </view>
  36. <view class="bottom">
  37. 提示:为了以后转款方便,建议代理公司去银行开通个人手机网银,以后可以随时随地在手机网银里转账,再也不用跑去银行了。
  38. </view>
  39. </view>
  40. </template>
  41. <script>
  42. import {
  43. handleClipboard
  44. } from '../../utils.js';
  45. export default {
  46. data() {
  47. return {
  48. }
  49. },
  50. methods: {
  51. copyG(data) {
  52. console.log(data)
  53. handleClipboard(
  54. data,
  55. event,
  56. () => {
  57. uni.showToast({
  58. icon: 'none',
  59. title: '复制成功'
  60. });
  61. },
  62. () => {
  63. uni.showToast({
  64. icon: 'none',
  65. title: '复制失败'
  66. });
  67. }
  68. );
  69. },
  70. }
  71. }
  72. </script>
  73. <style lang="scss" scoped>
  74. .box {
  75. padding: 60rpx 20rpx 0 20rpx;
  76. .title {
  77. font-weight: bold;
  78. margin-bottom: 30rpx;
  79. line-height: 38rpx;
  80. text {
  81. color: #FF0000;
  82. }
  83. }
  84. .item {
  85. margin-bottom: 30rpx;
  86. .flex {
  87. display: flex;
  88. align-items: center;
  89. margin-bottom: 10rpx;
  90. }
  91. &_btn {
  92. height: 30rpx;
  93. line-height: 30rpx;
  94. text-align: center;
  95. background-color: #409EFF;
  96. padding: 10rpx 20rpx;
  97. border-radius: 8rpx;
  98. color: #fff;
  99. font-size: 24rpx;
  100. }
  101. &_title {
  102. background-color: #FFFF00;
  103. line-height: 30rpx !important;
  104. font-weight: bold;
  105. padding: 10rpx 10rpx 10rpx 0;
  106. display: inline-block;
  107. margin-right: 20rpx;
  108. }
  109. text {
  110. font-size: 22rpx;
  111. }
  112. }
  113. .bottom {
  114. margin-top: 50rpx;
  115. font-size: 24rpx;
  116. color: #3983C6;
  117. }
  118. }
  119. </style>