feat: 首次提交
This commit is contained in:
436
components/firstui/fui-data-tag/fui-data-tag.vue
Normal file
436
components/firstui/fui-data-tag/fui-data-tag.vue
Normal file
@ -0,0 +1,436 @@
|
||||
<!--本文件由FirstUI授权予新疆天衡创新研究院有限公司(手机号: 18 6140 72 54 9,身份证尾号:5A07X5)专用,请尊重知识产权,勿私下传播,违者追究法律责任。-->
|
||||
<template>
|
||||
<view class="fui-data__tag-wrap" :style="{marginBottom:'-'+gap+'rpx'}">
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<view class="fui-data__tag-item" :class="{'fui-data__tag-disable':item.disable}"
|
||||
:style="{width:width?width+'rpx':'auto',height:height?height+'rpx':'auto',paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,borderRadius:radius+'rpx',marginRight:gap+'rpx',marginBottom:gap+'rpx',background:item.selected?activeBgColor:background,borderColor:item.selected?(borderColor || primaryColor):(defaultBorderColor || background)}"
|
||||
v-for="(item,index) in dataList" :key="index">
|
||||
<view class="fui-data__tag-inner" @tap.stop="handleClick(index)">
|
||||
<text class="fui-dt__icon"
|
||||
:style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
|
||||
v-if="mark && item.selected">{{icon}}</text>
|
||||
</view>
|
||||
<text class="fui-data__tag-text"
|
||||
:style="{fontSize:size+'rpx',color:item.selected?(activeColor || primaryColor):color}">{{item.text}}</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<view class="fui-data__tag-item" :class="{'fui-data__tag-disable':item.disable}"
|
||||
:style="{width:width?width+'rpx':'auto',height:height?height+'rpx':'auto',paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,borderRadius:radius+'rpx',marginRight:gap+'rpx',marginBottom:gap+'rpx',background:item.selected?activeBgColor:background,borderColor:item.selected?(borderColor || primaryColor):defaultBorderColor || background}"
|
||||
v-for="(item,index) in dataList" :key="index" @tap.stop="handleClick(index)">
|
||||
<text class="fui-dt__icon"
|
||||
:style="{color:markColor || primaryColor,fontSize:markSize+'rpx',lineHeight:markSize+'rpx'}"
|
||||
v-if="mark && item.selected">{{icon}}</text>
|
||||
<text class="fui-data__tag-text"
|
||||
:style="{fontSize:size+'rpx',lineHeight:size+'rpx',color:item.selected?(activeColor || primaryColor):color}">{{item.text}}</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
var domModule = weex.requireModule('dom');
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': 'fuitag',
|
||||
'src': "url('data:font/truetype;charset=utf-8;base64,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')"
|
||||
});
|
||||
// #endif
|
||||
export default {
|
||||
name: "fui-data-tag",
|
||||
emits: ['change', 'input', 'update:modelValue'],
|
||||
props: {
|
||||
options: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// #ifdef VUE3
|
||||
modelValue: {
|
||||
type: [Array, String, Number],
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
value: {
|
||||
type: [Array, String, Number],
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
multiple: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//最小选择数,仅单选有效,可选值仅0、1
|
||||
min: {
|
||||
type: [Number, String],
|
||||
default: 1
|
||||
},
|
||||
//最小选择数,仅多选有效
|
||||
multipleMin: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
//最大选择数
|
||||
max: {
|
||||
type: [Number, String],
|
||||
default: -1
|
||||
},
|
||||
width: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
height: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
padding: {
|
||||
type: Array,
|
||||
default () {
|
||||
return ['16rpx', '32rpx']
|
||||
}
|
||||
},
|
||||
gap: {
|
||||
type: [Number, String],
|
||||
default: 20
|
||||
},
|
||||
radius: {
|
||||
type: [Number, String],
|
||||
default: 6
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 24
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#333'
|
||||
},
|
||||
activeColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
background: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
activeBgColor: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
//默认边框颜色
|
||||
defaultBorderColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
borderColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
//设为true时,圆角值不建议设过大
|
||||
mark: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
markSize: {
|
||||
type: [Number, String],
|
||||
default: 52
|
||||
},
|
||||
markColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
options(vals) {
|
||||
this.initData(vals)
|
||||
},
|
||||
// #ifdef VUE3
|
||||
modelValue(vals) {
|
||||
this.modelChange(vals)
|
||||
},
|
||||
// #endif
|
||||
value(vals) {
|
||||
this.modelChange(vals)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initData(this.options)
|
||||
},
|
||||
computed: {
|
||||
primaryColor() {
|
||||
const app = uni && uni.$fui && uni.$fui.color;
|
||||
return (app && app.primary) || '#465CFF';
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
icon: '\ue600',
|
||||
dataList: [],
|
||||
val: '',
|
||||
vals: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
initData(vals) {
|
||||
vals = JSON.parse(JSON.stringify(vals))
|
||||
if (vals && vals.length > 0) {
|
||||
if (typeof vals[0] !== 'object') {
|
||||
vals = vals.map((item, index) => {
|
||||
return {
|
||||
text: item,
|
||||
value: item,
|
||||
selected: false
|
||||
}
|
||||
})
|
||||
} else {
|
||||
vals.map((item, index) => {
|
||||
item.selected = false
|
||||
if (item.value === undefined) {
|
||||
item.value = item.text
|
||||
}
|
||||
})
|
||||
}
|
||||
this.dataList = vals;
|
||||
// #ifdef VUE3
|
||||
this.modelChange(this.modelValue)
|
||||
// #endif
|
||||
|
||||
// #ifndef VUE3
|
||||
this.modelChange(this.value)
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
emitsChange(e) {
|
||||
this.$emit('change', e)
|
||||
this.$emit('input', e.detail.value)
|
||||
// #ifdef VUE3
|
||||
this.$emit("update:modelValue", e.detail.value);
|
||||
// #endif
|
||||
},
|
||||
radioChange(index, model) {
|
||||
const min = Number(this.min)
|
||||
if (this.val === model.value && min > 0) return;
|
||||
let val = '';
|
||||
let i = index;
|
||||
let entity = {}
|
||||
this.dataList.forEach((item, idx) => {
|
||||
if (idx === index) {
|
||||
const bool = this.val === item.value && min <= 0
|
||||
val = bool ? '' : item.value
|
||||
i = bool ? -1 : index
|
||||
entity = bool ? {} : item
|
||||
item.selected = bool ? false : true
|
||||
} else {
|
||||
item.selected = false
|
||||
}
|
||||
})
|
||||
this.val = val
|
||||
let e = {
|
||||
detail: {
|
||||
index: i,
|
||||
value: val,
|
||||
item: entity
|
||||
}
|
||||
}
|
||||
this.emitsChange(e)
|
||||
},
|
||||
toast(title) {
|
||||
uni.showToast({
|
||||
title: title,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
checkboxChange(index, model) {
|
||||
const min = Number(this.multipleMin)
|
||||
const max = Number(this.max)
|
||||
let vals = this.vals
|
||||
let i = vals.indexOf(model.value)
|
||||
if (vals.length <= min && i !== -1) {
|
||||
this.toast(`至少选择${min}个选项`)
|
||||
return
|
||||
}
|
||||
const isAllIndex = this.dataList.findIndex(item => item.isAll)
|
||||
let item = this.dataList[index]
|
||||
if (isAllIndex !== -1) {
|
||||
if (model.isAll) {
|
||||
item.selected = i !== -1 ? false : true
|
||||
if (item.selected) {
|
||||
vals = [model.value]
|
||||
} else {
|
||||
vals.splice(i, 1)
|
||||
}
|
||||
this.dataList.forEach((item, idx) => {
|
||||
if (index !== idx) {
|
||||
item.selected = false
|
||||
}
|
||||
})
|
||||
} else {
|
||||
if (vals.length >= max && max !== -1 && i === -1) {
|
||||
this.toast(`最多只能选择${max}个选项`)
|
||||
return
|
||||
}
|
||||
let entity = this.dataList[isAllIndex]
|
||||
const allI = vals.indexOf(entity.value)
|
||||
if (allI !== -1) {
|
||||
entity.selected = false;
|
||||
vals.splice(allI, 1)
|
||||
}
|
||||
this.dataList.forEach((item, idx) => {
|
||||
if (index === idx) {
|
||||
item.selected = i !== -1 ? false : true
|
||||
if (item.selected) {
|
||||
vals.push(item.value)
|
||||
} else {
|
||||
vals.splice(i, 1)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
if (vals.length >= max && max !== -1 && i === -1) {
|
||||
this.toast(`最多只能选择${max}个选项`)
|
||||
return
|
||||
}
|
||||
item.selected = i !== -1 ? false : true
|
||||
if (item.selected) {
|
||||
vals.push(item.value)
|
||||
} else {
|
||||
vals.splice(i, 1)
|
||||
}
|
||||
}
|
||||
this.vals = vals
|
||||
const entity = this.dataList.filter(item => vals.indexOf(item.value) != -1)
|
||||
let e = {
|
||||
detail: {
|
||||
value: vals,
|
||||
item: entity
|
||||
}
|
||||
}
|
||||
this.emitsChange(e)
|
||||
},
|
||||
modelChange(vals) {
|
||||
if (this.multiple) {
|
||||
this.dataList.forEach(item => {
|
||||
if (vals.includes(item.value)) {
|
||||
item.selected = true;
|
||||
} else {
|
||||
item.selected = false
|
||||
}
|
||||
})
|
||||
this.vals = vals
|
||||
|
||||
} else {
|
||||
this.dataList.forEach(item => {
|
||||
if (vals == item.value) {
|
||||
item.selected = true;
|
||||
} else {
|
||||
item.selected = false
|
||||
}
|
||||
})
|
||||
this.val = vals
|
||||
}
|
||||
},
|
||||
handleClick(index) {
|
||||
let item = this.dataList[index]
|
||||
if (item.disable) return;
|
||||
if (this.multiple) {
|
||||
this.checkboxChange(index, item)
|
||||
} else {
|
||||
this.radioChange(index, item)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* #ifndef APP-NVUE */
|
||||
/* 头条小程序组件内如果不能引入字体,则需要在父级页面引入字体文件*/
|
||||
@font-face {
|
||||
font-family: fuitag;
|
||||
src: url(data:font/ttf;base64,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) format("truetype");
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.fui-dt__icon {
|
||||
font-family: fuitag;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
right: -4rpx;
|
||||
bottom: -6rpx;
|
||||
}
|
||||
|
||||
.fui-data__tag-wrap {
|
||||
/* #ifndef APP-NVUE */
|
||||
max-width: 100%;
|
||||
display: flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.fui-data__tag-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: inline-flex;
|
||||
white-space: nowrap;
|
||||
box-sizing: border-box;
|
||||
transform: translateZ(0);
|
||||
/* #endif */
|
||||
border-width: 1px;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-overflow: ellipsis;
|
||||
/* #ifdef APP-NVUE */
|
||||
overflow: hidden;
|
||||
/* #endif */
|
||||
border-style: solid;
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.fui-data__tag-inner {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
/* #ifndef APP-NVUE */
|
||||
z-index: 1;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.fui-data__tag-text {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
/* #endif */
|
||||
/* #ifdef APP-NVUE */
|
||||
lines: 1;
|
||||
/* #endif */
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
text-overflow: ellipsis;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.fui-data__tag-disable {
|
||||
/* #ifdef H5 */
|
||||
cursor: not-allowed;
|
||||
/* #endif */
|
||||
opacity: .5;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user