@cloudbase/weda-ui 3.5.3 → 3.6.0

package/dist/configs/components/listView.js

@@ -1,11 +1,15 @@
 import { Type } from '../type-utils';
 import { genericErrorType } from '../type-utils/error';
 const rawTemplate = `
+[extra.commonStyle.padding]
+bottom='8PX'
+left= '16PX'
+right='16PX'
+top='8PX'
 
-{{#with (helper_utils 'filter' _fields (helper_utils 'concat' 'type' 'string')) as |_stringFields|}}
+{{#with (helper_utils 'reject' (helper_utils 'filter' _fields (helper_utils 'concat' 'type' 'string')) (helper_utils 'concat' 'format' 'x-rtf')) as |_stringFields|}}
 
 {{#if (helper_utils '===' $self.attributes.template 'simpleList')}}
-
 [[template]]
 component = 'Repeater'
 [template.attributes]
@@ -19,21 +23,21 @@ key = '_id'
 component = 'Container'
 [template.items.extra.commonStyle]
 boxSizing='border-box'
-borderBottom='1px dashed #acacac'
+borderBottom='1px solid var(--wd-color-border-separator)'
 display='flex'
 [template.items.extra.commonStyle.flexConfig]
 alignItems='center'
 [template.items.extra.commonStyle.padding]
-bottom='14PX'
-left= '19PX'
-right='18PX'
-top='15PX'
+bottom='12PX'
+left= '0PX'
+right='0PX'
+top='12PX'
 [template.items.extra.commonStyle.position]
 position='relative'
 [template.items.extra.commonStyle.size]
 width='100%'
 [template.items.extra.commonStyle.self]
-borderBottom='1px dashed #acacac'
+borderBottom='1px solid var(--wd-color-border-separator)'
 boxSizing='border-box'
 
 [[template.items.items]]
@@ -44,41 +48,55 @@ wordBreak='break-all'
 [template.items.items.extra.commonStyle.self]
 flex='1'
 wordBreak='break-all'
+display='flex'
+flexDirection='column'
+alignItems='flex-start'
+gap='4PX'
+
 [[template.items.items.items]]
 component = 'WdText'
 [template.items.items.items.attributes]
 {{#with (helper_utils 'get' _stringFields '[0].name') as |_name0|}}
 ':text'='$w.item_{{$self.id}}.{{_name0}}'
 {{/with}}
-level='title-6'
+level='title-8'
 textAlign = 'left'
 
 [[template.items.items.items]]
 component = 'WdText'
 [template.items.items.items.extra.commonStyle.text]
-opacity=40
+color='var(--wd-color-text-placeholder)'
 [template.items.items.items.attributes]
 {{#with (helper_utils 'get' _stringFields '[1].name') as |_name1|}}
 ':text'='$w.item_{{$self.id}}.{{_name1}}'
 {{/with}}
+level='body-sm'
 overflow=true
 
 [[template.items.items]]
 component = 'Container'
 [template.items.items.extra.commonStyle.margin]
-left='10PX'
+left='16PX'
 [template.items.items.extra.commonStyle.size]
 width='24PX'
 height='24PX'
 [template.items.items.extra.commonStyle.text]
-opacity=30
+opacity=90
+color='var(--wd-color-text-default)'
+[template.items.items.extra.commonStyle]
+display='flex'
+[template.items.items.extra.commonStyle.flexConfig]
+alignItems='center'
+justifyContent='center'
+
 [[template.items.items.items]]
 component = 'WdIcon'
 [template.items.items.items.attributes]
 name = 'chevronright'
+size='xs'
+sizeSelfAdaptive=true
 
 {{else if (helper_utils '===' $self.attributes.template 'detailList')}}
-
 [[template]]
 component = 'Repeater'
 [template.attributes]
@@ -91,20 +109,20 @@ key = '_id'
 [[template.items]]
 component = 'Container'
 [template.items.extra.commonStyle]
-borderBottom = '1px dashed #acacac'
+borderBottom = '1px solid var(--wd-color-border-separator)'
 boxSizing = 'border-box'
 display = 'flex'
 [template.items.extra.commonStyle.flexConfig]
 alignItems = 'center'
 [template.items.extra.commonStyle.padding]
-bottom = '15PX'
-left = '26PX'
-right = '25PX'
-top = '15PX'
+bottom = '12PX'
+left = '0PX'
+right = '0PX'
+top = '12PX'
 [template.items.extra.commonStyle.position]
 position = 'relative'
 [template.items.extra.commonStyle.self]
-borderBottom = '1px dashed #acacac'
+borderBottom = '1px solid var(--wd-color-border-separator)'
 boxSizing = 'border-box'
 [template.items.extra.commonStyle.size]
 width = '100%'
@@ -123,8 +141,10 @@ component = 'WdText'
 {{#with (helper_utils 'get' _stringFields '[0].name') as |_name0|}}
 ':text'='$w.item_{{$self.id}}.{{_name0}}'
 {{/with}}
-level='title-6'
+level='title-8'
 textAlign = 'left'
+[template.items.items.items.extra.commonStyle]
+marginBottom='4PX'
 
 {{#repeat 3}}
 [[template.items.items.items]]
@@ -135,8 +155,6 @@ whiteSpace = 'pre-line'
 [template.items.items.items.extra.commonStyle.flexConfig]
 alignItems = 'center'
 flexWrap = 'nowrap'
-[template.items.items.items.extra.commonStyle.text]
-opacity = 40
 [template.items.items.items.extra.commonStyle.self]
 whiteSpace = 'pre-line'
 
@@ -145,6 +163,9 @@ component='WdText'
 [template.items.items.items.items.attributes]
 text='{{helper_utils 'get' _stringFields (helper_utils 'join' (helper_utils 'concat' '[' (helper_utils '+' @index 1) '].title') '') '名称'}}：'
 overflow=true
+level='body-sm'
+[template.items.items.items.items.extra.commonStyle.text]
+color='var(--wd-color-text-placeholder)'
 
 [[template.items.items.items.items]]
 component='WdText'
@@ -153,27 +174,37 @@ component='WdText'
 ':text'='$w.item_{{$self.id}}.{{_name}}'
 {{/with}}
 overflow=true
+level='body-sm'
+[template.items.items.items.items.extra.commonStyle.text]
+color='var(--wd-color-text-placeholder)'
 
 {{/repeat}}
 
 [[template.items.items]]
 component='Container'
 [template.items.items.extra.commonStyle.margin]
-left = '10PX'
+left = '16PX'
 [template.items.items.extra.commonStyle.size]
 height = '24PX'
 width = '24PX'
 [template.items.items.extra.commonStyle.text]
-opacity = 30
+opacity=90
+color='var(--wd-color-text-default)'
+[template.items.items.extra.commonStyle]
+display='flex'
+[template.items.items.extra.commonStyle.flexConfig]
+alignItems='center'
+justifyContent='center'
+
 [[template.items.items.items]]
 component = 'WdIcon'
 [template.items.items.items.attributes]
-name = 'more'
-size = 48
+name = 'chevronright'
+size='xs'
 type = 'inner'
+sizeSelfAdaptive=true
 
 {{else if (helper_utils '===' $self.attributes.template 'imageTextList')}}
-
 [[template]]
 component = 'Repeater'
 [template.attributes]
@@ -186,21 +217,19 @@ key = '_id'
 [[template.items]]
 component = 'Container'
 [template.items.extra.commonStyle]
-borderBottom = '1px dashed #acacac'
+borderBottom = '1px solid var(--wd-color-border-separator)'
 boxSizing = 'border-box'
 custom = []
 display = 'flex'
-[template.items.extra.commonStyle.flexConfig]
-alignItems = 'center'
 [template.items.extra.commonStyle.padding]
-bottom = '14PX'
-left = '16PX'
-right = '18PX'
-top = '15PX'
+bottom = '12PX'
+left = '0PX'
+right = '0PX'
+top = '12PX'
 [template.items.extra.commonStyle.position]
 position = 'relative'
 [template.items.extra.commonStyle.self]
-borderBottom = '1px dashed #acacac'
+borderBottom = '1px solid var(--wd-color-border-separator)'
 boxSizing = 'border-box'
 [template.items.extra.commonStyle.size]
 width = '100%'
@@ -209,21 +238,25 @@ width = '100%'
 component = 'Container'
 [template.items.items.extra.commonStyle]
 custom = []
+
 [template.items.items.extra.commonStyle.margin]
-right = '10PX'
+right = '12PX'
 [template.items.items.extra.commonStyle.position]
 position = 'relative'
 [template.items.items.extra.commonStyle.size]
-height = '52PX'
-width = '52PX'
+height = '48PX'
+width = '48PX'
 [[template.items.items.items]]
 component='WdImage'
 [template.items.items.items.attributes]
 fit = 'cover'
 mode = 'scaleToFill'
+src = 'https://qcloudimg.tencent-cloud.cn/raw/ce64fdb4d9709898df65c0606c0dd885.svg'
 {{#with (helper_utils 'get' (helper_utils 'filter' _fields (helper_utils 'concat' 'format' 'x-image')) '[0].name') as |_name0|}}
 ':src'='$w.item_{{$self.id}}.{{_name0}}'
 {{/with}}
+[template.items.items.items.extra.commonStyle]
+borderRadius='3px'
 [template.items.items.items.extra.commonStyle.size]
 height = '100%'
 width = '100%'
@@ -237,11 +270,15 @@ wordBreak = 'break-all'
 [template.items.items.extra.commonStyle.self]
 flex = '1'
 wordBreak = 'break-all'
+display='flex'
+flexDirection='column'
+alignItems='flex-start'
+gap='4PX'
 
 [[template.items.items.items]]
 component = 'WdText'
 [template.items.items.items.attributes]
-level='title-6'
+level='title-8'
 textAlign = 'left'
 {{#with (helper_utils 'get' (helper_utils 'reject' _stringFields (helper_utils 'concat' 'format' 'x-image')) '[0].name') as |_name0|}}
 ':text'='$w.item_{{$self.id}}.{{_name0}}'
@@ -251,123 +288,314 @@ textAlign = 'left'
 component = 'WdText'
 [template.items.items.items.attributes]
 maxLines = '2'
+level='body-sm'
 overflow=true
 {{#with (helper_utils 'get' (helper_utils 'reject' _stringFields (helper_utils 'concat' 'format' 'x-image')) '[1].name') as |_name1|}}
 ':text'='$w.item_{{$self.id}}.{{_name1}}'
 {{/with}}
 textAlign = 'left'
 [template.items.items.items.extra.commonStyle.text]
-opacity = 40
+color='var(--wd-color-text-placeholder)'
 
 [[template.items.items]]
 component='Container'
 [template.items.items.extra.commonStyle.margin]
-left = '10PX'
+left = '16PX'
+bottom='auto'
+right= '0PX'
+top='auto'
 [template.items.items.extra.commonStyle.size]
 height = '24PX'
 width = '24PX'
 [template.items.items.extra.commonStyle.text]
-opacity = 30
+opacity = 90
+color='var(--wd-color-text-default)'
+[template.items.items.extra.commonStyle]
+display='flex'
+[template.items.items.extra.commonStyle.flexConfig]
+alignItems='center'
+justifyContent='center'
 
 [[template.items.items.items]]
 component='WdIcon'
 [template.items.items.items.attributes]
 name = 'chevronright'
-size = 48
+size='xs'
+sizeSelfAdaptive=true
 
 {{else if (helper_utils '===' $self.attributes.template 'cardList')}}
 
 [[template]]
-component = 'Repeater'
+component = 'Grid'
 [template.attributes]
+gutterY='16px'
+gutterX='16px'
+[template.extra.commonStyle.padding]
+top='8PX'
+bottom='8PX'
+left='0PX'
+right='0PX'
+[template.extra.commonStyle.size]
+width='100%'
+
+[[template.items]]
+component = 'Row'
+[template.items.attributes]
+colCount=12
+gutterX='16px'
+
+[[template.items.items]]
+component = 'Repeater'
+[template.items.items.attributes]
 ':data' = '$w.{{$self.id}}.records'
 suffix = '{{$self.id}}'
 forItem = 'item_{{$self.id}}'
 forIndex = 'index_{{$self.id}}'
 key = '_id'
 
-[[template.items]]
-component = 'Container'
-[template.items.extra.commonStyle]
-boxSizing = 'border-box'
-custom = []
-display = 'flex'
-[template.items.extra.commonStyle.border]
-color = 'rgb(172, 172, 172)'
-type = 'dashed'
-width = '1px'
-[template.items.extra.commonStyle.flexConfig]
-alignItems = 'center'
-flexDirection = 'column'
-[template.items.extra.commonStyle.padding]
-bottom = '11PX'
-left = '8PX'
-right = '8PX'
-top = '8PX'
-[template.items.extra.commonStyle.position]
-position = 'relative'
-[template.items.extra.commonStyle.self]
-boxSizing = 'border-box'
-[template.items.extra.commonStyle.size]
-width = 'calc(50%)'
+[[template.items.items.items]]
+component = 'Col'
+[template.items.items.items.attributes.lgWidthType]
+type='twelve-adjust'
+value='2'
+unit='px'
+[template.items.items.items.attributes.widthType]
+type='twelve-adjust'
+value='6'
+unit='px'
+[template.items.items.items.extra.commonStyle.self]
+display='flex'
+flexDirection='column'
+gap='8PX'
 
-[[template.items.items]]
+[[template.items.items.items.items]]
 component = 'Container'
-[template.items.items.extra.commonStyle]
-custom = []
-[template.items.items.extra.commonStyle.margin]
-bottom = '10PX'
-right = '0'
-[template.items.items.extra.commonStyle.size]
-height = '118PX'
-width = '100%'
+[template.items.items.items.items.extra.commonStyle.self]
+display='flex'
 
-[[template.items.items.items]]
-component='WdImage'
-[template.items.items.items.attributes]
+[[template.items.items.items.items.items]]
+component = 'WdImage'
+[template.items.items.items.items.items.attributes]
 fit = 'cover'
 mode = 'scaleToFill'
+src='https://qcloudimg.tencent-cloud.cn/raw/6b5a0b0b3226879a8f40356519c82e09.svg'
 {{#with (helper_utils 'get' (helper_utils 'filter' _fields (helper_utils 'concat' 'format' 'x-image')) '[0].name') as |_name0|}}
 ':src'='$w.item_{{$self.id}}.{{_name0}}'
 {{/with}}
-[template.items.items.items.extra.commonStyle.size]
-height = '100%'
-width = '100%'
+[template.items.items.items.items.items.extra.commonStyle.size]
+width='100%'
+height='120PX'
+[template.items.items.items.items.items.extra.commonStyle.border.radiusInfo]
+topLeft='3PX'
+topRight='3PX'
+bottomLeft='3PX'
+bottomRight='3PX'
 
-[[template.items.items]]
+[[template.items.items.items.items]]
 component = 'Container'
-[template.items.items.extra.commonStyle]
+[template.items.items.items.items.extra.commonStyle]
 custom = []
+wordBreak='break-all'
+[template.items.items.items.items.extra.commonStyle.size]
+width='100%'
+[template.items.items.items.items.extra.commonStyle.self]
 wordBreak = 'break-all'
-[template.items.items.extra.commonStyle.padding]
-bottom = '0'
-left = '5PX'
-right = '4PX'
-top = '0'
-[template.items.items.extra.commonStyle.self]
-wordBreak = 'break-all'
-[template.items.items.extra.commonStyle.size]
-width = '100%'
-
-{{#repeat 3}}
+display='flex'
+flexDirection='column'
+alignItems='flex-start'
+gap='4PX'
 
-[[template.items.items.items]]
+{{#repeat 2}}
+[[template.items.items.items.items.items]]
 component = 'WdText'
-[template.items.items.items.attributes]
+[template.items.items.items.items.items.attributes]
 textAlign = 'left'
 {{#if (helper_utils '===' @index 0)}}
-level='title-6'
+level='title-8'
 {{else if (helper_utils '===' @index 1)}}
 maxLines = '3'
 overflow=true
+level='body-sm'
 {{else}}
+level='body-sm'
 overflow=true
 {{/if}}
 {{#with (helper_utils 'get' (helper_utils 'reject' _stringFields (helper_utils 'concat' 'format' 'x-image')) (helper_utils 'join' (helper_utils 'concat' '[' @index '].name') '')) as |_name|}}
 ':text'='$w.item_{{$self.id}}.{{_name}}'
 {{/with}}
+[template.items.items.items.items.items.extra.commonStyle.text]
+{{#if (helper_utils '!==' @index 0)}}
+color='var(--wd-color-text-placeholder)'
+{{/if}}
 {{/repeat}}
 
+{{else if (helper_utils '===' $self.attributes.template 'goodsList')}}
+
+[[template]]
+component = 'Grid'
+[template.attributes]
+gutterY='16px'
+gutterX='16px'
+[template.extra.commonStyle.padding]
+top='8PX'
+bottom='8PX'
+left='0PX'
+right='0PX'
+[template.extra.commonStyle.size]
+width='100%'
+
+[[template.items]]
+component = 'Repeater'
+[template.items.attributes]
+':data' = '$w.{{$self.id}}.records'
+suffix = '{{$self.id}}'
+forItem = 'item_{{$self.id}}'
+forIndex = 'index_{{$self.id}}'
+key = '_id'
+
+[[template.items.items]]
+component = 'Row'
+[template.items.items.attributes]
+colCount=12
+gutterX='16px'
+[template.items.items.extra.commonStyle.size]
+width='100%'
+[template.items.items.extra.commonStyle.margin]
+left='0PX'
+right='0PX'
+
+[[template.items.items.items]]
+component = 'Col'
+[template.items.items.items.attributes.lgWidthType]
+type='twelve-adjust'
+value='2'
+unit='px'
+[template.items.items.items.attributes.widthType]
+type='twelve-adjust'
+value='4'
+unit='px'
+[template.items.items.items.extra.commonStyle.padding]
+left='0PX'
+
+[[template.items.items.items.items]]
+component = 'WdImage'
+[template.items.items.items.items.attributes]
+mode = 'scaleToFill'
+src='https://qcloudimg.tencent-cloud.cn/raw/d32f80059ff33716dd45255d87e96052.svg'
+{{#with (helper_utils 'get' (helper_utils 'filter' _fields (helper_utils 'concat' 'format' 'x-image')) '[0].name') as |_name0|}}
+':src'='$w.item_{{$self.id}}.{{_name0}}'
+{{/with}}
+[template.items.items.items.items.extra.commonStyle.size]
+width='100%'
+[template.items.items.items.items.extra.commonStyle.border.radiusInfo]
+topLeft='3PX'
+topRight='3PX'
+bottomLeft='3PX'
+bottomRight='3PX'
+
+[[template.items.items.items]]
+component = 'Col'
+[template.items.items.items.attributes.lgWidthType]
+type='twelve-adjust'
+value='10'
+unit='px'
+[template.items.items.items.attributes.widthType]
+type='twelve-adjust'
+value='8'
+unit='px'
+[template.items.items.items.extra.commonStyle.padding]
+right='0PX'
+
+[[template.items.items.items.items]]
+component = 'Container'
+[template.items.items.items.items.extra.commonStyle]
+wordBreak='break-all'
+gap='4PX'
+display='flex'
+[template.items.items.items.items.extra.commonStyle.size]
+height='100%'
+[template.items.items.items.items.extra.commonStyle.flexConfig]
+justifyContent='space-between'
+alignItems='flex-start'
+flexDirection='column'
+[template.items.items.items.items.extra.commonStyle.text]
+color='rgb(211, 90, 33)'
+[template.items.items.items.items.extra.commonStyle.self]
+wordBreak='break-all'
+gap='4PX'
+[template.items.items.items.items.extra.commonStyle.padding]
+top='4PX'
+bottom='4PX'
+left='0PX'
+right='0PX'
+
+[[template.items.items.items.items.items]]
+component = 'WdText'
+[template.items.items.items.items.items.attributes]
+level='body-md'
+maxLines='2'
+overflow=true
+textAlign = 'left'
+text='商品名称'
+{{#with (helper_utils 'get' (helper_utils 'reject' _stringFields (helper_utils 'concat' 'format' 'x-image')) '[0].name') as |_name0|}}
+':text'='$w.item_{{$self.id}}.{{_name0}}'
+{{/with}}
+
+[[template.items.items.items.items.items]]
+component = 'Container'
+[template.items.items.items.items.items.extra.commonStyle]
+gap='4PX'
+display='flex'
+[template.items.items.items.items.items.extra.commonStyle.size]
+width='100%'
+[template.items.items.items.items.items.extra.commonStyle.flexConfig]
+justifyContent='space-between'
+alignItems='center'
+[template.items.items.items.items.items.extra.commonStyle.self]
+gap='4PX'
+
+[[template.items.items.items.items.items.items]]
+component = 'Container'
+[template.items.items.items.items.items.items.extra.commonStyle]
+display='flex'
+alignItems='center'
+
+[[template.items.items.items.items.items.items.items]]
+component = 'WdText'
+[template.items.items.items.items.items.items.items.attributes]
+level='body-sm'
+text='¥'
+textAlign = 'left'
+[template.items.items.items.items.items.items.items.extra.commonStyle.text]
+color='rgb(211, 90, 33)'
+[template.items.items.items.items.items.items.items.extra.commonStyle.margin]
+right='4PX'
+
+[[template.items.items.items.items.items.items.items]]
+component = 'WdText'
+[template.items.items.items.items.items.items.items.attributes]
+level='body-md'
+text='48.00'
+{{#with (helper_utils 'get' (helper_utils 'filter' (helper_utils 'filter' _fields (helper_utils 'concat' 'type' 'number')) (helper_utils 'concat' 'format' '')) '[0].name') as |_name0|}}
+':text'='$w.item_{{$self.id}}.{{_name0}}'
+{{/with}}
+textAlign = 'left'
+[template.items.items.items.items.items.items.items.extra.commonStyle.text]
+color='rgb(211, 90, 33)'
+
+[[template.items.items.items.items.items.items]]
+component = 'Container'
+[template.items.items.items.items.items.items.extra.commonStyle]
+display='flex'
+
+[[template.items.items.items.items.items.items.items]]
+component = 'WdIcon'
+[template.items.items.items.items.items.items.items.attributes]
+src='https://qcloudimg.tencent-cloud.cn/raw/a43cd71d342b3c3535ab6539ad0a9790.svg'
+size='xs'
+type='custom'
+sizeSelfAdaptive=true
+
 {{else}}
 [[template]]
 component = 'Repeater'
@@ -516,35 +744,69 @@ export default {
                     {
                         label: '空白',
                         value: 'none',
-                        tooltip: '不使用模板',
-                        src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/924e8472-9c52-46bc-bae7-e1ec30b92974.svg',
                     },
                     {
                         label: '简单列表',
                         value: 'simpleList',
-                        tooltip: '使用简单列表模板',
-                        src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/2563df4d-2db0-449f-a545-825f5a66a848.svg',
                     },
                     {
                         label: '详细列表',
                         value: 'detailList',
-                        tooltip: '使用详细列表模板',
-                        src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/c4f78f1c-f93a-4b40-8253-42541a609fa4.svg',
                     },
                     {
                         label: '图文列表',
                         value: 'imageTextList',
-                        tooltip: '使用图文列表模板',
-                        src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/58cad863-a9b6-4c51-b3f3-d6036ef4d0b7.svg',
                     },
                     {
                         label: '卡片列表',
                         value: 'cardList',
-                        tooltip: '使用卡片列表模板',
-                        src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/d92ff460-bc94-4162-9c0e-d04224dd1919.svg',
+                    },
+                    {
+                        label: '商品列表',
+                        value: 'goodsList',
                     },
                 ],
                 'x-component': 'data-sources-template-selector',
+                'x-component-props': {
+                    options: [
+                        {
+                            label: '空白',
+                            value: 'none',
+                            tooltip: '不使用模板',
+                            src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/924e8472-9c52-46bc-bae7-e1ec30b92974.svg',
+                        },
+                        {
+                            label: '简单列表',
+                            value: 'simpleList',
+                            tooltip: '使用简单列表模板',
+                            src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/2563df4d-2db0-449f-a545-825f5a66a848.svg',
+                        },
+                        {
+                            label: '详细列表',
+                            value: 'detailList',
+                            tooltip: '使用详细列表模板',
+                            src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/c4f78f1c-f93a-4b40-8253-42541a609fa4.svg',
+                        },
+                        {
+                            label: '图文列表',
+                            value: 'imageTextList',
+                            tooltip: '使用图文列表模板',
+                            src: 'https://qcloudimg.tencent-cloud.cn/raw/55579a824f8ee45039358be4594a9cf7.png',
+                        },
+                        {
+                            label: '卡片列表',
+                            value: 'cardList',
+                            tooltip: '使用卡片列表模板',
+                            src: 'https://cloudcache.tencent-cloud.com/qcloud/ui/static/static_source_business/d92ff460-bc94-4162-9c0e-d04224dd1919.svg',
+                        },
+                        {
+                            label: '商品列表',
+                            value: 'goodsList',
+                            tooltip: '使用商品列表模板',
+                            src: 'https://qcloudimg.tencent-cloud.cn/raw/b413a9c18a7ebac69d05419fb56343f4.png',
+                        },
+                    ],
+                },
                 'x-props': {
                     'data-hidebind': true,
                 },
@@ -571,6 +833,17 @@ export default {
                     },
                 ],
                 'x-linkages': [
+                    {
+                        type: 'value:state',
+                        target: '*(isSetStatus,isSetLoading)',
+                        condition: "{{$self.value !=='expression'}}",
+                        state: {
+                            display: true,
+                        },
+                        otherwise: {
+                            display: false,
+                        },
+                    },
                     {
                         type: 'value:state',
                         target: '*(orderType,queryCondition,orderBy,datasource)',
@@ -595,7 +868,7 @@ export default {
                     },
                     {
                         type: 'value:state',
-                        target: '*(dataSourceData,enableTotal,total,exprToFieldsSchema)',
+                        target: '*(dataSourceData,enableTotal,total,exprToFieldsSchema,loading)',
                         condition: "{{$self.value=='expression'}}",
                         state: {
                             display: true,
@@ -776,6 +1049,7 @@ export default {
                 'x-props': {
                     'data-hidebind': true,
                 },
+                default: '',
                 'x-group': '数据',
                 'x-index': 15,
                 'x-component': 'expr-to-fields-schema',
@@ -857,7 +1131,7 @@ export default {
                     methodValuePath: 'name',
                     paramsKeyName: 'connectorParams',
                 },
-                'x-helper-text': '当配置了「显示条数」属性后，pageSize参数将不会生效',
+                'x-helper-text': '当配置了「每页条数」属性后，pageSize参数将不会生效',
             },
             queryCondition: {
                 'x-index': 20,
@@ -972,9 +1246,21 @@ export default {
                         target: 'loadCompletedText',
                         condition: "{{$self.value == 'loadMoreButton' || $self.value == 'bottomLoad'}}",
                     },
+                    {
+                        type: 'value:visible',
+                        target: 'loadButtonText',
+                        condition: "{{$self.value == 'loadMoreButton'}}",
+                    },
                 ],
                 description: '数据分页样式',
             },
+            loadButtonText: {
+                'x-index': 55,
+                title: '加载按钮名称',
+                type: 'string',
+                default: '加载更多',
+                'x-group': '分页器',
+            },
             pageSize: {
                 'x-index': 60,
                 title: '每页条数',
@@ -991,7 +1277,7 @@ export default {
                 title: '启用动态分页',
                 type: 'boolean',
                 description: '开启后，可支持动态分页',
-                'x-helper-text': '默认为前端分页，启用后可实现动态加载数据   ',
+                'x-helper-text': '默认为前端分页，启用后可实现动态加载数据',
                 'x-group': '分页器',
                 'x-index': 70,
                 default: false,
@@ -1027,13 +1313,29 @@ export default {
                 default: '',
                 description: '加载全部数据后的提示说明，内容为空时则不显示该提示',
             },
-            isSetStatus: {
+            isSetLoading: {
                 'x-index': 110,
                 title: '显示加载状态',
                 'x-group': '状态',
                 type: 'boolean',
-                default: false,
-                description: '是否开启数据列表的加载状态，默认不显示',
+                'x-runtime-default': true,
+                description: '是否开启数据列表的加载状态，默认显示',
+            },
+            isSetStatus: {
+                'x-index': 112,
+                title: '显示异常状态',
+                'x-group': '状态',
+                type: 'boolean',
+                'x-runtime-default': false,
+                description: '是否开启数据列表的异常状态，默认不显示',
+            },
+            loading: {
+                'x-index': 114,
+                title: '数据加载状态',
+                'x-group': '状态',
+                type: 'boolean',
+                'x-runtime-default': false,
+                description: '开启后会展示数据加载中状态',
             },
             isSupportApis: Type.Optional(Type.Boolean({
                 title: '是否支持apis',
@@ -1104,7 +1406,6 @@ export default {
         {
             name: 'onPagingChange',
             title: '分页变化',
-            'x-platforms': ['MOBILEWEB', 'PCWEB'],
             description: '分页变化',
             detail: {
                 query: Type.Object({
@@ -1171,6 +1472,7 @@ export default {
         description: '适用于从数据源中查询多条数据，并将返回列表循环展示的场景，如查询用户列表。',
         categoryOrder: 100,
         componentOrder: 10,
+        figureIcon: '../figureIcons/ListView.svg',
         icon: '../icons/ListView.svg',
         templates: [
             {
@@ -1190,6 +1492,12 @@ export default {
                 body: query_condition_template,
             },
         ],
+        inlineStyleForm: {
+            $text: {
+                visible: false,
+            },
+        },
+        keywords: ['数据列表', '商品列表', '卡片列表', '图文卡片', '列表页'],
         docsUrl: 'https://docs.cloudbase.net/lowcode/components/wedaUI/src/docs/compsdocs/database/ListView',
         shortcut: {
             props: [