| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- import { Address } from "../model/Address"
- import { CustomTextStyle } from "../style/CustomTextStyle"
- @ComponentV2
- export struct AddressItemComp {
- @Param index: number = 0
- @Param selectIndex: number = 0
- // 0 - 查看 1 - 编辑 2 - 选择 ( icon 不同 ) 3 - 不要 icon
- @Param type: 0 | 1 | 2 | 3 = 0
- @Param needBorder: boolean = true
- @Param isLocation: boolean = true
- @Param align_: VerticalAlign = VerticalAlign.Center
- @Param address: Address = {
- userName: '占三峰',
- phone: '13598728343',
- address: '高新区火炬园路321号韩菲诗.诚享大厦304室内',
- region: '福建-厦门-火炬园',
- }
- @Event click: () => void
- build() {
- Row(){
- if(this.isLocation){
- Image($r('[basic].media.icon_location')).width(24).aspectRatio(1)
- } else {
- Image($r('[basic].media.icon_send')).width(24).aspectRatio(1)
- }
- Column({space: 5}){
- Text(`${this.address.region?.split('-').join('')}${this.address.address}`)
- .attributeModifier(new CustomTextStyle({ size: 14, weight: 400, color: '#FF000000' }))
- Row({space: 8}){
- Text(this.address.userName).attributeModifier(new CustomTextStyle({ size: 14, weight: 500, color: '#FF000000' }))
- Text(this.address.phone).attributeModifier(new CustomTextStyle({ size: 14, weight: 500, color: '#FF000000' }))
- }
- }
- .layoutWeight(1)
- .margin({left: 11, right: 19})
- .alignItems(HorizontalAlign.Start)
- if(this.type == 0) {
- Image($r('[basic].media.ic_public_arrow_left'))
- .rotate({angle: 180})
- .width(24).aspectRatio(1)
- } else if (this.type == 1) {
- Image($r('[basic].media.icon_edit'))
- .width(24).aspectRatio(1)
- } else if (this.type == 2) {
- if(this.selectIndex == this.index) {
- Image($r('[basic].media.icon_select'))
- .width(15).aspectRatio(1)
- } else {
- Row()
- .borderRadius(15)
- .border({width: 1})
- .width(15).aspectRatio(1)
- }
- }
- }.width('100%')
- .backgroundColor(Color.White)
- .alignItems(this.align_)
- .borderRadius(this.needBorder ? 8 : 0)
- .border(this.needBorder ? {width: 2, color: '#FF000000'} : null)
- .padding({left: 16, right: 16, top: 18, bottom: 18})
- }
- }
|