feature-JimuReport-1106-yjl
sunzehua 1 month ago
parent 8a447a6ae2
commit d5acb72a84

@ -36,7 +36,7 @@ export const searchFormSchema: FormSchema[] = [
colProps: { span: 5 },
},
{
field: 'carrierCode',
field: 'carrierId',
label: '船公司',
component: 'ApiSelect',
required: false,
@ -47,7 +47,7 @@ export const searchFormSchema: FormSchema[] = [
api: GetCarrierSelectList,
labelField: 'pinYinCode',
showName: 'cnName',
valueField: 'cnName',
valueField: 'id',
resultField: 'data',
immediate: false,
}

@ -1,5 +1,5 @@
<template>
<BasicModal v-bind="$attrs" :use-wrapper="true" :title="getTitle" :width="900" @register="registerModal"
<BasicModal v-bind="$attrs" :use-wrapper="true" :title="getTitle" :width="1000" @register="registerModal"
@ok="handleSave">
<!-- 费用模版表单 -->
<BasicForm @register="registerForm" @linkageForm="ChangeColumnView" />
@ -325,6 +325,7 @@ const [registerModal, { setModalProps, closeModal, updateFormField }] = useModal
resetFields()
setModalProps({ confirmLoading: false, loading: true })
isUpdate.value = !!data?.isUpdate
console.log(data)
if (unref(isUpdate)) {
setModalProps({ confirmLoading: true })
rowId.value = data.record.id
@ -336,10 +337,11 @@ const [registerModal, { setModalProps, closeModal, updateFormField }] = useModal
...res.data,
})
columnViewType.value = true
setTimeout(() => {
console.log(JSON.parse(res.data.dataRules))
RefcolumnView.value.init(JSON.parse(res.data.dataRules))
RefcolumnView1.value.init(JSON.parse(res.data.additionDataRules))
}, 200);
if(res.data.additionDataRules){
RefcolumnView1.value.init(JSON.parse(res.data.additionDataRules))
}
detailId.value = res.data.id
}

@ -12,32 +12,92 @@
<a-switch v-model:checked="item.logicalOperator" checked-value="1" class="mt2" un-checked-value="0"
checked-children="或" un-checked-children="且" />
<div style="flex: 1; margin-left: 30px">
<div v-for="(row, key) in item.conditions" :key="`c-${key}`"
style="margin-bottom: 6px; position: relative">
<div v-if="key != item.conditions.length - 1" class="r-line"></div>
<div :style="{ left: key == 0 ? '-29px' : '-16px' }" class="v-line"></div>
<a-select v-if="Ismain" show-search :filter-option="filterOption" v-model:value="row.field"
style="width: 150px; margin-right: 6px" placeholder="查询字段" @change="changeHandle($event, row)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field" :value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-if="!Ismain" show-search @blur="handleBlur($event, row)" :filter-option="filterOption1" v-model:value="row.field"
style="width: 150px; margin-right: 6px" placeholder="查询字段" @change="changeHandle1($event, row)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field" :value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-model:value="row.operator" style="width: 90px; margin-right: 6px" placeholder="筛选符">
<a-select-option v-for="item in operatorOptions" :key="item.value" :value="item.value">
{{ item.label }}
</a-select-option>
</a-select>
<a-date-picker v-if="row.component == 'RangePicker'" placeholder="请选择" style="width: 150px"
v-model:value="row.value" />
<a-input v-else v-model:value="row.value" placeholder="请输入" style="width: 150px"></a-input>
<span v-if="item.conditions.length != 1" @click="deleteItem(index, key)"
class="iconfont icon-shanchu21"></span>
<div v-for="(row, key) in item.conditions" :key="`c-${key}`" class="box-item">
<div>
<div>
<div v-if="key != item.conditions.length - 1" class="r-line"></div>
<div :style="{ left: key == 0 ? '-29px' : '-16px' }" class="v-line"></div>
<a-select v-if="Ismain" show-search :filter-option="filterOption" v-model:value="row.field"
style="width: 150px; margin-right: 6px" placeholder="查询字段" @change="changeHandle($event, row)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field"
:value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-if="!Ismain" show-search @blur="handleBlur($event, row)" :filter-option="filterOption1"
v-model:value="row.field" style="width: 150px; margin-right: 6px" placeholder="查询字段"
@change="changeHandle1($event, row)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field"
:value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-model:value="row.operator" style="width: 90px; margin-right: 6px" placeholder="筛选符">
<a-select-option v-for="item in operatorOptions" :key="item.value" :value="item.value">
{{ item.label }}
</a-select-option>
</a-select>
<a-date-picker v-if="row.component == 'RangePicker'" placeholder="请选择" style="width: 150px"
v-model:value="row.value" />
<a-input v-else v-model:value="row.value" placeholder="请输入" style="width: 150px"></a-input>
<span v-if="item.conditions.length != 1" @click="deleteItem(index, key)"
class="iconfont icon-shanchu21"></span>
</div>
<!-- 第三级的条件组 -->
<div v-for="(detailItem, detailIndex) in row.groups" class="ds-advanced-search-item flex"
:key="`f-${detailIndex}`">
<data :style="{ left: detailIndex == 0 ? '-30px' : '-15px' }" class="v-line"
style="top: 21px"></data>
<data v-if="detailIndex != row.groups.length - 1" class="r-line r-height"
style="left: -15px; top: 21px"></data>
<a-switch v-model:checked="detailItem.logicalOperator" checked-value="1" class="mt2"
un-checked-value="0" checked-children="或" un-checked-children="且" />
<div>
<div v-for="(rowDetail, keyDetail) in detailItem.conditions" :key="`c-${keyDetail}`"
class="box-item-detail">
<div v-if="key != detailItem.conditions.length - 1" class="r-line"></div>
<div :style="{ left: key == 0 ? '-29px' : '-16px' }" class="v-line"></div>
<a-select v-if="Ismain" show-search :filter-option="filterOption"
v-model:value="rowDetail.field" style="width: 150px; margin-right: 6px" placeholder="查询字段"
@change="changeHandle($event, rowDetail)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field"
:value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-if="!Ismain" show-search @blur="handleBlur($event, rowDetail)"
:filter-option="filterOption1" v-model:value="rowDetail.field"
style="width: 150px; margin-right: 6px" placeholder="查询字段"
@change="changeHandle1($event, rowDetail)">
<a-select-option v-for="item in schemas" :label="item.label" :key="item.field"
:value="item.field">
{{ item.label }}
</a-select-option>
</a-select>
<a-select v-model:value="rowDetail.operator" style="width: 90px; margin-right: 6px"
placeholder="筛选符">
<a-select-option v-for="item in operatorOptions" :key="item.value" :value="item.value">
{{ item.label }}
</a-select-option>
</a-select>
<a-date-picker v-if="rowDetail.component == 'RangePicker'" placeholder="请选择"
style="width: 150px" v-model:value="rowDetail.value" />
<a-input v-else v-model:value="rowDetail.value" placeholder="请输入"
style="width: 150px"></a-input>
<span v-if="detailItem.conditions.length != 1" @click="deleteItemDetail(index, key, detailIndex,keyDetail)"
class="iconfont icon-shanchu21"></span>
</div>
</div>
<a-button type="link" @click="addDetailDetail(index, key, detailIndex)">
<span class="iconfont icon-new_document"></span> 添加条件
</a-button>
</div>
</div>
<a-button type="link" @click="addDetailGroup(index, key)">
<span class="iconfont icon-new_document"></span> 添加条件组
</a-button>
</div>
<div class="item-btns">
<a-button type="link" @click="addRow(index)">
@ -101,20 +161,20 @@ const props = defineProps({
default: true,
},
})
watch(
() => props.schemas,
() => {
init(null)
},
{ deep: true },
)
// watch(
// () => props.schemas,
// () => {
// init(null)
// },
// { deep: true },
// )
const emit = defineEmits(['toSearch'])
//
const modalFlag = ref(false)
const queryData = reactive({
logicalOperator: '0',
groups: [],
})
}) as any
//
const queryOldData = reactive({
logicalOperator: '0',
@ -127,24 +187,28 @@ const queryOldData = reactive({
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
],
},
@ -156,24 +220,28 @@ const queryOldData = reactive({
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
{
field: null,
operator: null,
value: null,
component: '',
groups: []
},
],
},
@ -213,8 +281,8 @@ const queryOldData1 = reactive({
},
],
})
function handleBlur(val,row){
if(result.value && !changeFlag.value){
function handleBlur(val, row) {
if (result.value && !changeFlag.value) {
row.field = result.value
}
}
@ -272,8 +340,9 @@ const loading = ref(false)
const init = (IsApiData) => {
if (props.IsApi) {
const content = IsApiData ? IsApiData : {}
console.log(content,131231)
let source = {} as any
if(props.Ismain){
if (props.Ismain) {
source = JSON.parse(JSON.stringify(queryOldData))
} else {
source = JSON.parse(JSON.stringify(queryOldData1))
@ -287,7 +356,7 @@ const init = (IsApiData) => {
}
} else {
let source = {} as any
if(props.Ismain){
if (props.Ismain) {
source = JSON.parse(JSON.stringify(queryOldData))
} else {
source = JSON.parse(JSON.stringify(queryOldData1))
@ -303,6 +372,7 @@ const init = (IsApiData) => {
const changeHandle = (e, row) => {
row.value = null
console.log(props.schemas)
props.schemas.forEach((item) => {
if (item.field == e) {
row.component = item.component
@ -311,7 +381,7 @@ const changeHandle = (e, row) => {
}
const changeFlag = ref(true)
const changeHandle1 = (e, row) => {
if(e){
if (e) {
changeFlag.value = true
}
row.value = null
@ -325,6 +395,9 @@ const changeHandle1 = (e, row) => {
const deleteItem = (index, key) => {
queryData.groups[index].conditions.splice(key, 1)
}
function deleteItemDetail(index,index1,index2,index3){
queryData.groups[index].conditions[index1].groups[index2].conditions.splice(index3, 1)
}
//
const addRow = (index) => {
queryData.groups[index].conditions.push({
@ -332,6 +405,30 @@ const addRow = (index) => {
operator: null,
value: '',
component: '',
groups: []
})
}
function addDetailGroup(index, index1) {
console.log(queryData)
queryData.groups[index].conditions[index1].groups.push({
logicalOperator: 'and',
conditions: [
{
field: null,
operator: null,
value: null,
component: '',
},
],
})
}
function addDetailDetail(index, index1, index2) {
console.log(queryData, index, index1)
queryData.groups[index].conditions[index1].groups[index2].conditions.push({
field: null,
operator: null,
value: '',
component: '',
})
}
//
@ -418,7 +515,7 @@ defineExpose({
.r-line {
width: 0.8px;
height: 35px;
height: 100%;
background: #cccccc;
display: inline-block;
position: absolute;
@ -444,4 +541,16 @@ defineExpose({
top: 13px;
}
// }</style>
.box-item {
margin-bottom: 10px;
position: relative;
display: flex;
align-items: center;
}
.box-item-detail {
margin-bottom: 6px;
position: relative;
margin-left: 35px
}
</style>

Loading…
Cancel
Save