areaCode.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <template>
  2. <view class="select-box">
  3. <u-popup v-model="areacodeShow" mode="bottom" @close="cancel">
  4. <view class="box" style="color: #333333;font-size: 28rpxrpx;">请选择您的国际区号</view>
  5. <view class="box" style="color: #2C83FF;" @click="areacode('86')">大陆+86</view>
  6. <view class="box" style="color: #2C83FF;" @click="areacode('852')">香港+852</view>
  7. <view class="box" style="color: #2C83FF;" @click="areacode('886')">台湾+886</view>
  8. <view class="box" style="color: #2C83FF;" @click="areacode('1')">美国+1</view>
  9. <view class="box" style="color: #2C83FF;" @click="areacode('65')">新加坡+65</view>
  10. <view class="box box-bottom" style="color: #A9AFB8;" @click="cancel">取消</view>
  11. </u-popup>
  12. </view>
  13. </template>
  14. <script>
  15. import {
  16. User
  17. } from "@/config/api.js"
  18. export default {
  19. watch: {
  20. isAreaCode() {
  21. this.areacodeShow = this.isAreaCode
  22. },
  23. typesignup() {
  24. this.signupType = this.typesignup
  25. }
  26. },
  27. data() {
  28. return {
  29. areacodeShow: false,
  30. }
  31. },
  32. props: {
  33. isAreaCode: {
  34. type: Boolean,
  35. default: false,
  36. },
  37. areaCode: {
  38. type: Object
  39. },
  40. },
  41. methods: {
  42. areacode(num) {
  43. User.countryCcodeAdd({
  44. CountryCode: num
  45. }).then(res => {
  46. if (res.Ret == 200) {
  47. this.areacodeShow = false
  48. this.$parent.isAreaCode = false
  49. this.$parent.isNeedAddCountryCode = false
  50. this.$parent.signupAdd(this.areaCode.id, this.areaCode.type)
  51. }
  52. })
  53. },
  54. cancel() {
  55. this.areacodeShow = false
  56. this.$parent.isAreaCode = false
  57. }
  58. }
  59. }
  60. </script>
  61. <style scoped lang="scss">
  62. .select-box {
  63. width: 100%;
  64. .box {
  65. height: 95prx;
  66. line-height: 95rpx;
  67. text-align: center;
  68. font-size: 32rpx;
  69. border-bottom: 1rpx solid #EBEBEB;
  70. }
  71. .box-bottom {
  72. border-bottom: none !important;
  73. }
  74. }
  75. </style>