aike/emis-sapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

uu

Browse Source
This commit is contained in:
aihe 2025-02-05 18:49:56 +08:00
parent 1656463048
commit c6fbd6e4cc
1 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
components/tpx-tags/tpx-tags.vue
View File

@ -1,19 +1,25 @@
<template>
<view>
<tpx-checkitems :list="list" :type="type" :value="value" v-slot="current" item-style="display:inline-block;"
:min-checked="minChecked" @onItemClick="handleoItemClick" @onChange="handleChange"
>
<view slot class="smp-tag">
<u-tag :text="`${current.item.title}`" :plain="!current.checked" :type="mode"
border-color="transparent" shape="circle" :bg-color="`${(current.checked || (mode == 'primary'))?activeColor:color}`"
:color="`${(current.checked || (mode == 'primary'))?'#fff':'#666'}`"
@close="handleDeleteItem(current.item)" :closable="closable"
@click="current.handleCheckFun"
>
</u-tag>
</view>
</tpx-checkitems>
</view>
<u-row justify="between" align="top">
<view style="flex: 1 0 0;">
<tpx-checkitems :list="list" :type="type" :value="value" v-slot="current" item-style="display:inline-block;"
:min-checked="minChecked" @onItemClick="handleoItemClick" @onChange="handleChange"
>
<view v-if="(maxShowNum >= current.index +1) || showAll" slot class="smp-tag">
<u-tag :text="`${current.item.title}`" :plain="!current.checked" :type="mode"
border-color="transparent" shape="circle" :bg-color="`${(current.checked || (mode == 'primary'))?activeColor:color}`"
:color="`${(current.checked || (mode == 'primary'))?'#fff':'#666'}`"
@close="handleDeleteItem(current.item)" :closable="closable"
@click="current.handleCheckFun"
>
</u-tag>
</view>
</tpx-checkitems>
</view>
<view v-if="list.length > maxShowNum && maxShowNum > 0 && !showAll" style="padding: 6rpx;" @click="handleShowMore">
<span class="font-24" style="padding-right: 6rpx;">更多</span>
<span class="iconfont icon-arrow-down"></span>
</view>
</u-row>
</template>
<script>
@ -27,6 +33,7 @@
},
type: {
},
// ======================== 分割线， 上方是 tpx-checkitems属性 ======================
closable: {
default () {
@ -48,11 +55,15 @@
return '#de524e'
}
},
maxShowNum: {
default () {
return undefined
}
},
},
data() {
return {
showAll: !(this.maxShowNum > 0)
}
},
created() {
@ -75,6 +86,9 @@
handleChange(val) {
this.$emit('onChange', val)
this.$emit('update:value', val)
},
handleShowMore(){
this.showAll = true
}
}
}