forked from github/dataease
feat(查询组件): 下拉树
This commit is contained in:
parent
b60489fd7c
commit
e4ba3b5ed3
@ -60,7 +60,6 @@ const renameInput = ref([])
|
||||
const valueSource = ref([])
|
||||
const conditions = ref([])
|
||||
const checkAll = ref(false)
|
||||
const multiple = ref(false)
|
||||
const activeConditionForRename = reactive({
|
||||
id: '',
|
||||
name: '',
|
||||
@ -209,12 +208,59 @@ const handleCheckAllChange = (val: boolean) => {
|
||||
curComponent.value.checkedFields = val ? fields.value.map(ele => ele.componentId) : []
|
||||
isIndeterminate.value = false
|
||||
}
|
||||
|
||||
const setTreeDefault = () => {
|
||||
if (!!curComponent.value.checkedFields.length) {
|
||||
let checkId = ''
|
||||
let tableId = ''
|
||||
let comId = ''
|
||||
fields.value.forEach(ele => {
|
||||
if (
|
||||
curComponent.value.checkedFields.includes(ele.componentId) &&
|
||||
curComponent.value.checkedFieldsMap[ele.componentId] &&
|
||||
!checkId
|
||||
) {
|
||||
checkId = curComponent.value.checkedFieldsMap[ele.componentId]
|
||||
comId = ele.componentId
|
||||
tableId = datasetFieldList.value.find(itx => itx.id === ele.componentId)?.tableId
|
||||
}
|
||||
})
|
||||
if (checkId && tableId) {
|
||||
const componentObj = fields.value.find(ele => ele.componentId === comId)
|
||||
const fieldArr = (
|
||||
curComponent.value.optionValueSource === 0
|
||||
? componentObj?.fields?.dimensionList
|
||||
: curComponent.value.dataset?.fields
|
||||
).filter(ele => ele.deType === +curComponent.value.field.deType)
|
||||
fields.value.forEach(ele => {
|
||||
if (curComponent.value.checkedFields.includes(ele.componentId)) {
|
||||
if (datasetFieldList.value.find(itx => itx.id === ele.componentId)?.tableId === tableId) {
|
||||
curComponent.value.checkedFieldsMap[ele.componentId] = checkId
|
||||
}
|
||||
}
|
||||
})
|
||||
const fieldObj = fieldArr.find(element => element.id === checkId)
|
||||
if (!!curComponent.value.treeFieldList.length) {
|
||||
const [fir] = curComponent.value.treeFieldList
|
||||
if (fir.field !== checkId) {
|
||||
curComponent.value.treeFieldList = [fieldObj]
|
||||
}
|
||||
} else {
|
||||
curComponent.value.treeFieldList = [fieldObj]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
const handleCheckedFieldsChange = (value: string[]) => {
|
||||
if (curComponent.value.displayType === '8') return
|
||||
handleDialogClick()
|
||||
const checkedCount = value.length
|
||||
checkAll.value = checkedCount === fields.value.length
|
||||
isIndeterminate.value = checkedCount > 0 && checkedCount < fields.value.length
|
||||
if (curComponent.value.displayType === '8') return
|
||||
if (curComponent.value.displayType === '9') {
|
||||
setTreeDefault()
|
||||
return
|
||||
}
|
||||
setType()
|
||||
}
|
||||
|
||||
@ -281,6 +327,10 @@ const setTypeChange = () => {
|
||||
) {
|
||||
curComponent.value.timeGranularityMultiple = curComponent.value.timeGranularity
|
||||
}
|
||||
|
||||
if (curComponent.value.displayType === '9') {
|
||||
setTreeDefault()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { guid } from '@/views/visualized/data/dataset/form/util.js'
|
||||
import { ElMessage } from 'element-plus-secondary'
|
||||
import { ref, shallowRef } from 'vue'
|
||||
import { ref, shallowRef, computed } from 'vue'
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
|
||||
const dialogVisible = ref(false)
|
||||
@ -24,6 +24,10 @@ const init = (arr, treeArr) => {
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
const disableFieldArr = computed(() => {
|
||||
return treeList.value.map(ele => ele.field)
|
||||
})
|
||||
|
||||
const cancelClick = () => {
|
||||
handleBeforeClose()
|
||||
}
|
||||
@ -87,8 +91,19 @@ defineExpose({
|
||||
<div class="cascade-item" v-for="(ele, idx) in treeList" :key="ele.id">
|
||||
<div class="label">层级{{ indexCascade[idx + 1] }}</div>
|
||||
<div class="item-name">
|
||||
<el-select value-key="id" v-model="ele.field" style="width: 300px">
|
||||
<el-option v-for="item in datasetMap" :key="item.id" :label="item.name" :value="item" />
|
||||
<el-select
|
||||
:disabled="idx === 0 && ele.field"
|
||||
value-key="id"
|
||||
v-model="ele.field"
|
||||
style="width: 300px"
|
||||
>
|
||||
<el-option
|
||||
:disabled="disableFieldArr.includes(item.id)"
|
||||
v-for="item in datasetMap"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-button v-show="idx !== 0" @click="deleteCascade(idx)" class="cascade-delete" text>
|
||||
|
@ -133,7 +133,6 @@ onMounted(() => {
|
||||
<el-icon
|
||||
class="preview-download_icon"
|
||||
:class="navigateBg === 'light' && 'is-light-setting'"
|
||||
style="margin: 0 10px"
|
||||
>
|
||||
<Icon name="dv-preview-download" @click="downloadClick" />
|
||||
</el-icon>
|
||||
@ -160,7 +159,6 @@ onMounted(() => {
|
||||
|
||||
<style lang="less" scoped>
|
||||
.preview-download_icon {
|
||||
margin: 0 10px;
|
||||
padding: 5px;
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
|
Loading…
Reference in New Issue
Block a user