aike/emis-app
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:29 +08:00
parent 19cf6090a9
commit 58c7de9557
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> <template>
<view> <u-row justify="between" align="top">
<tpx-checkitems :list="list" :type="type" :value="value" v-slot="current" item-style="display:inline-block;" <view style="flex: 1 0 0;">
:min-checked="minChecked" @onItemClick="handleoItemClick" @onChange="handleChange" <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" <view v-if="(maxShowNum >= current.index +1) || showAll" slot class="smp-tag">
border-color="transparent" shape="circle" :bg-color="`${(current.checked || (mode == 'primary'))?activeColor:color}`" <u-tag :text="`${current.item.title}`" :plain="!current.checked" :type="mode"
:color="`${(current.checked || (mode == 'primary'))?'#fff':'#666'}`" border-color="transparent" shape="circle" :bg-color="`${(current.checked || (mode == 'primary'))?activeColor:color}`"
@close="handleDeleteItem(current.item)" :closable="closable" :color="`${(current.checked || (mode == 'primary'))?'#fff':'#666'}`"
@click="current.handleCheckFun" @close="handleDeleteItem(current.item)" :closable="closable"
> @click="current.handleCheckFun"
</u-tag> >
</view> </u-tag>
</tpx-checkitems> </view>
</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> </template>
<script> <script>
@ -27,6 +33,7 @@
}, },
type: { type: {
}, },
// ======================== 分割线， 上方是 tpx-checkitems属性 ====================== // ======================== 分割线， 上方是 tpx-checkitems属性 ======================
closable: { closable: {
default () { default () {
@ -48,11 +55,15 @@
return '#de524e' return '#de524e'
} }
}, },
maxShowNum: {
default () {
return undefined
}
},
}, },
data() { data() {
return { return {
showAll: !(this.maxShowNum > 0)
} }
}, },
created() { created() {
@ -75,6 +86,9 @@
handleChange(val) { handleChange(val) {
this.$emit('onChange', val) this.$emit('onChange', val)
this.$emit('update:value', val) this.$emit('update:value', val)
},
handleShowMore(){
this.showAll = true
} }
} }
} }