|
@@ -2,13 +2,14 @@
|
|
<view class="labelColor itemBox" style="height: 45px;">
|
|
<view class="labelColor itemBox" style="height: 45px;">
|
|
<view class="item" v-for="(item) in filterList" :key="item[props.idValue]">
|
|
<view class="item" v-for="(item) in filterList" :key="item[props.idValue]">
|
|
<m-filter
|
|
<m-filter
|
|
- class="itemFilter"
|
|
|
|
:items="item.array"
|
|
:items="item.array"
|
|
:label="item.label"
|
|
:label="item.label"
|
|
|
|
+ :value="item.value"
|
|
:multiple="item.multiple"
|
|
:multiple="item.multiple"
|
|
:item-label="item.itemLabel"
|
|
:item-label="item.itemLabel"
|
|
:item-value="item.itemValue"
|
|
:item-value="item.itemValue"
|
|
- :popupStyle="{ 'padding-bottom': '80px' }"
|
|
|
|
|
|
+ :style="{ 'width': labelWidth }"
|
|
|
|
+ :popupStyle="{ 'padding-bottom': paddingBottom + 'px' }"
|
|
@change="($event, $name) => handleClick($event, $name, item)"
|
|
@change="($event, $name) => handleClick($event, $name, item)"
|
|
>
|
|
>
|
|
<view
|
|
<view
|
|
@@ -42,60 +43,43 @@
|
|
import { ref, watch } from 'vue'
|
|
import { ref, watch } from 'vue'
|
|
import { getDict } from '@/hooks/useDictionaries'
|
|
import { getDict } from '@/hooks/useDictionaries'
|
|
import MFilter from './mFilter.vue'
|
|
import MFilter from './mFilter.vue'
|
|
|
|
+import { formatName } from '@/utils/getText'
|
|
|
|
|
|
const emit = defineEmits(['change'])
|
|
const emit = defineEmits(['change'])
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
list: { type: Array, default: () => [] },
|
|
list: { type: Array, default: () => [] },
|
|
idValue: { type: String, default: 'id' },
|
|
idValue: { type: String, default: 'id' },
|
|
labelValue: { type: String, default: 'label' },
|
|
labelValue: { type: String, default: 'label' },
|
|
- // selectIdValue: { type: String, default: 'id' },
|
|
|
|
- // selectLabelValue: { type: String, default: 'label' },
|
|
|
|
- // useApiData: { type: Boolean, default: true },
|
|
|
|
lazy: { type: Boolean, default: false },
|
|
lazy: { type: Boolean, default: false },
|
|
|
|
+ paddingBottom: { type: [Number, String], default: 80 },
|
|
|
|
+ labelWidth: { type: String, default: '100%' }
|
|
})
|
|
})
|
|
|
|
|
|
-// const popup = ref()
|
|
|
|
-
|
|
|
|
-// const handleOpen = (index) => {
|
|
|
|
-// popup.value[index].open('bottom')
|
|
|
|
-// }
|
|
|
|
-// const handleChangeItem = (i, item) => {
|
|
|
|
-// if (i === item.active) {
|
|
|
|
-// return
|
|
|
|
-// }
|
|
|
|
-// item.active = i
|
|
|
|
-// }
|
|
|
|
-
|
|
|
|
|
|
|
|
const handleClick = (e, name, item) => {
|
|
const handleClick = (e, name, item) => {
|
|
item.value = e
|
|
item.value = e
|
|
item.name = name ?? item.label
|
|
item.name = name ?? item.label
|
|
- // const obj = e.detail.value?.length ? e.detail.value[e.detail.value.length-1] : {}
|
|
|
|
- // const obj0 = e.detail.value?.length ? e.detail.value[0] : {}
|
|
|
|
- // //
|
|
|
|
- // let val = obj.value
|
|
|
|
- // item.value = obj.value
|
|
|
|
- // item.text = obj.text || ''
|
|
|
|
- // if (typeof val === 'string' && val.includes('unlimited') && obj0) {
|
|
|
|
- // val = Number.isInteger(obj0.id) ? Number(val.split('unlimited')[0]) : val.split('unlimited')[0]
|
|
|
|
- // }
|
|
|
|
emit('change', item.key, e)
|
|
emit('change', item.key, e)
|
|
}
|
|
}
|
|
|
|
|
|
-// const handleClear = (item, index) => {
|
|
|
|
-// item.value = e.multiple ? [] : null
|
|
|
|
-// item.text = null
|
|
|
|
-// emit('change', item.key, item.value)
|
|
|
|
-// }
|
|
|
|
-
|
|
|
|
// 获取字典数据
|
|
// 获取字典数据
|
|
const getData = (e) => {
|
|
const getData = (e) => {
|
|
- getDict(e.dictType, e.map ? {} : null, e.map ? e.dictType : 'dict').then(({ data }) => {
|
|
|
|
- e.array = data.data
|
|
|
|
- e.itemLabel = e.map?.text
|
|
|
|
- e.itemValue = e.map?.value
|
|
|
|
- e.value = e.multiple ? [] : null
|
|
|
|
- })
|
|
|
|
|
|
+ if (e?.dictType) {
|
|
|
|
+ getDict(e.dictType, e.map ? {} : null, e.map ? e.dictType : 'dict').then(({ data }) => {
|
|
|
|
+ e.array = data.data
|
|
|
|
+ e.itemLabel = e.map?.text
|
|
|
|
+ e.itemValue = e.map?.value
|
|
|
|
+ e.value = e.multiple ? [] : null
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ if (e?.api) {
|
|
|
|
+ e.api().then(({ data }) => {
|
|
|
|
+ e.array = data.map(k => {
|
|
|
|
+ const label = e.isRichText ? k[e.dataLabel].replace(/<\/?p[^>]*>/gi, '') : e.isFormatText ? formatName(k[e.dataLabel]) : k[e.dataLabel]
|
|
|
|
+ return { label, value: k[e.dataValue] }
|
|
|
|
+ })
|
|
|
|
+ })
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
const setItemSelectData = () => {
|
|
const setItemSelectData = () => {
|
|
@@ -135,9 +119,6 @@ watch(() => props.list,
|
|
flex: 1;
|
|
flex: 1;
|
|
width: 0;
|
|
width: 0;
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
- .itemFilter {
|
|
|
|
- width: 100%;
|
|
|
|
- }
|
|
|
|
.name {
|
|
.name {
|
|
width: 100%;
|
|
width: 100%;
|
|
display: flex;
|
|
display: flex;
|