index.wxml 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <view class="address-detail">
  2. <view class="divider-line" />
  3. <t-location
  4. title="获取微信收获地址"
  5. isCustomStyle
  6. t-class="address-detail-wx-location"
  7. bind:change="getWeixinAddress"
  8. >
  9. <t-icon class="address-detail-wx-arrow" name="arrow_forward" prefix="wr" color="#bbb" size="32rpx" />
  10. </t-location>
  11. <view class="divider-line" />
  12. <view class="form-address">
  13. <form class="form-content">
  14. <t-cell-group>
  15. <t-cell class="form-cell" t-class-title="t-cell-title" title="收货人" t-class-note="t-cell-note">
  16. <t-input
  17. class="t-input"
  18. slot="note"
  19. t-class="field-text"
  20. borderless
  21. data-item="name"
  22. maxlength="20"
  23. type="text"
  24. value="{{locationState.name}}"
  25. placeholder="您的姓名"
  26. bind:change="onInputValue"
  27. />
  28. </t-cell>
  29. <t-cell class="form-cell" t-class-title="t-cell-title" title="手机号">
  30. <t-input
  31. slot="note"
  32. class="t-input"
  33. t-class="field-text"
  34. borderless
  35. type="number"
  36. value="{{locationState.phone}}"
  37. maxlength="11"
  38. placeholder="联系您的手机号"
  39. bind:change="onInputValue"
  40. data-item="phone"
  41. />
  42. </t-cell>
  43. <t-cell class="form-cell" t-class-title="t-cell-title" title="地区">
  44. <t-input
  45. slot="note"
  46. class="t-input"
  47. t-class="field-text"
  48. borderless
  49. placeholder="省/市/区"
  50. data-item="address"
  51. value="{{locationState.provinceName ? locationState.provinceName+'/':'' }}{{locationState.cityName ? locationState.cityName+'/':''}}{{locationState.districtName}}"
  52. catch:tap="onPickArea"
  53. disabled
  54. />
  55. <t-icon slot="right-icon" t-class="map" prefix="wr" name="location" catch:tap="onSearchAddress" />
  56. </t-cell>
  57. <t-cell class="form-cell" t-class-title="t-cell-title" title="详细地址" bordered="{{false}}">
  58. <view slot="note" class="textarea__wrapper">
  59. <t-textarea
  60. slot="note"
  61. type="text"
  62. value="{{locationState.detailAddress}}"
  63. placeholder="门牌号等(例如:10栋1001号)"
  64. autosize
  65. bind:change="onInputValue"
  66. data-item="detailAddress"
  67. />
  68. </view>
  69. </t-cell>
  70. <view class="divider-line" />
  71. <t-cell
  72. class="form-cell"
  73. t-class-note="t-cell-note address__tag"
  74. t-class-title="t-cell-title"
  75. title="标签"
  76. bordered="{{false}}"
  77. >
  78. <view class="t-input address-flex-box" slot="note">
  79. <t-button
  80. wx:for="{{labels}}"
  81. wx:for-item="label"
  82. wx:key="index"
  83. size="extra-small"
  84. t-class="label-list {{locationState.labelIndex === index ? 'active-btn':''}}"
  85. bindtap="onPickLabels"
  86. data-item="{{index}}"
  87. >
  88. {{label.name}}
  89. </t-button>
  90. <t-button size="extra-small" t-class="label-list" bindtap="addLabels">
  91. <t-icon name="add" size="40rpx" color="#bbb" />
  92. </t-button>
  93. </view>
  94. </t-cell>
  95. <view class="divider-line" />
  96. <t-cell title="设置为默认收货地址" bordered="{{false}}">
  97. <t-switch
  98. value="{{locationState.isDefault}}"
  99. slot="note"
  100. colors="{{['#0ABF5B', '#c6c6c6']}}"
  101. bind:change="onCheckDefaultAddress"
  102. />
  103. </t-cell>
  104. </t-cell-group>
  105. <view class="submit">
  106. <t-button shape="round" block disabled="{{!submitActive}}" bind:tap="formSubmit"> 保存 </t-button>
  107. </view>
  108. </form>
  109. </view>
  110. <t-cascader
  111. data-item="address"
  112. data-type="1"
  113. visible="{{areaPickerVisible}}"
  114. theme="tab"
  115. options="{{areaData}}"
  116. value="{{locationState.districtCode}}"
  117. title="选择地区"
  118. bind:change="onInputValue"
  119. ></t-cascader>
  120. </view>
  121. <t-dialog
  122. visible="{{visible}}"
  123. t-class-confirm="dialog__button-confirm"
  124. t-class-cancel="dialog__button-cancel"
  125. title="填写标签名称"
  126. confirm-btn="确定"
  127. cancel-btn="取消"
  128. bind:confirm="confirmHandle"
  129. bind:cancel="cancelHandle"
  130. >
  131. <t-input slot="content" class="dialog__input" model:value="{{labelValue}}" placeholder="请输入标签名称" borderless />
  132. </t-dialog>
  133. <t-toast id="t-toast" />