From 0f5c580f07e40475cd8e5d3d205ac29c071f4e98 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Wed, 8 Jan 2025 15:04:56 +0800
Subject: [PATCH] =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../custom-module/condition-config/index.vue  |  2 +-
 .../common/custom-module/model-text/index.vue |  7 ++-
 .../model-text/model-text-style.vue           |  8 +++
 .../components/custom-dialog/index.vue        | 35 +++++------
 .../model-custom/components/index-default.ts  |  5 ++
 src/components/model-custom/index.vue         |  2 +-
 .../model-custom/model-custom-content.vue     | 53 +++++++++-------
 src/components/model-tabs-carousel/index.vue  |  1 -
 src/utils/index.ts                            | 63 ++++++++++++++++---
 9 files changed, 123 insertions(+), 53 deletions(-)

diff --git a/src/components/common/custom-module/condition-config/index.vue b/src/components/common/custom-module/condition-config/index.vue
index 6570a3ac..96f2c2f5 100644
--- a/src/components/common/custom-module/condition-config/index.vue
+++ b/src/components/common/custom-module/condition-config/index.vue
@@ -3,7 +3,7 @@
         <div class="mb-12">条件设置</div>
         <el-form-item label="条件字段">
             <el-select v-model="form.condition.field" clearable filterable placeholder="请选择数据字段" size="default" class="flex-1" @change="operation_end">
-                <el-option v-for="item in options" :key="item.field" :label="item.name" :value="item.field" />
+                <el-option v-for="item in options" :key="item.field + '-' + item.type" :label="item.name" :value="item.field + '{|}' + item.type" />
             </el-select>
         </el-form-item>
         <el-form-item label="条件判断">
diff --git a/src/components/common/custom-module/model-text/index.vue b/src/components/common/custom-module/model-text/index.vue
index 2d45151c..3ec3ef79 100644
--- a/src/components/common/custom-module/model-text/index.vue
+++ b/src/components/common/custom-module/model-text/index.vue
@@ -117,8 +117,9 @@ const text_title = computed(() => {
         try {
             // 多选判断
             if (data_source_id.length > 0) {
+                text_title += form.value?.data_split?.left || '';
                 // 遍历取出所有的值
-                data_source_id.forEach((source_id: string) => {
+                data_source_id.forEach((source_id: string, index: number) => {
                     const sourceList = option.find((item: any) => item.field == source_id);
                     // 根据数据源ID是否包含点号来区分处理方式
                     if (source_id.includes(';')) {
@@ -131,7 +132,11 @@ const text_title = computed(() => {
                     } else {
                         text_title += (sourceList?.first || '') + (data_handling(source_id) === '' && !props.isDisplayPanel ? sourceList?.name || '请在此输入文字' : data_handling(source_id) ) + (sourceList?.last || '');
                     }
+                    if (index < data_source_id.length - 1) {
+                        text_title += form.value?.data_split?.middle || '';
+                    }
                 });
+                text_title += form.value?.data_split?.right || '';
             }
         } catch (error) {
             if (!props.isDisplayPanel) {
diff --git a/src/components/common/custom-module/model-text/model-text-style.vue b/src/components/common/custom-module/model-text/model-text-style.vue
index 79ef3d03..124fda86 100644
--- a/src/components/common/custom-module/model-text/model-text-style.vue
+++ b/src/components/common/custom-module/model-text/model-text-style.vue
@@ -19,6 +19,13 @@
                         <el-option v-for="item in options.filter((item) => item.type == 'text')" :key="item.field" :label="item.name" :value="item.field" />
                     </el-select>
                 </el-form-item>
+                <el-form-item label="拼接值">
+                    <div class="flex-row gap-10">
+                        <el-input v-model="form.data_split.left" placeholder="数据左侧" type="input" clearable @blur="operation_end" @input="text_change('2')"></el-input>
+                        <el-input v-model="form.data_split.middle" placeholder="数据中间" type="input" clearable @blur="operation_end" @input="text_change('2')"></el-input>
+                        <el-input v-model="form.data_split.right" placeholder="数据右侧" type="input" clearable @blur="operation_end" @input="text_change('2')"></el-input>
+                    </div>
+                </el-form-item>
                 <el-form-item label="链接">
                     <url-value v-model="form.text_link" @update:model-value="text_link_change('1')"></url-value>
                 </el-form-item>
@@ -164,6 +171,7 @@ const text_change = (key: string) => {
             id: [],
             option: [],
         };
+        form.value.data_split = '';
     }
 };
 // 数据字段切换时，更新另外一个数据
diff --git a/src/components/model-custom/components/custom-dialog/index.vue b/src/components/model-custom/components/custom-dialog/index.vue
index aad0aef2..f137c9c2 100644
--- a/src/components/model-custom/components/custom-dialog/index.vue
+++ b/src/components/model-custom/components/custom-dialog/index.vue
@@ -6,7 +6,7 @@
             </div>
         </template>
         <div class="flex-col gap-20 w h pa-20 oh">
-            <filter-form v-if="dialogVisible && !isEmpty(config?.filter_form_config)" :filter-data="config.filter_form_config" direction="horizontal" :data-interface="default_data" @form-change="filter_form_change"></filter-form>
+            <filter-form v-if="dialogVisible && !isEmpty(config?.search_filter_form_config)" :filter-data="config.search_filter_form_config" direction="horizontal" :data-interface="default_data" @form-change="filter_form_change"></filter-form>
             <!-- 表格头部如果传输了数据，就渲染表格, 否则就不渲染 -->
             <template v-if="!isEmpty(config?.header)">
                 <table-config v-loading="loading" :table-data="tableData" :multiple="multiple" :table-column-list="config.header" :table-row-class-list="tableRowClassList" @select="table_select"></table-config>
@@ -25,8 +25,9 @@
 </template>
 
 <script lang="ts" setup>
+import { interface_field_processing } from '@/utils';
 import request from '@/utils/request';
-import { isEmpty } from 'lodash';
+import { isEmpty, pick } from 'lodash';
 
 const props = defineProps({
     type: {
@@ -41,6 +42,10 @@ const props = defineProps({
         type: Object as PropType<any>,
         default: () => {},
     },
+    extraSearchData: {
+        type: Object as PropType<any>,
+        default: () => {},
+    },
     multiple: {
         type: Boolean,
         default: false,
@@ -118,28 +123,13 @@ const pagination_data = ref({
 watchEffect(() => {
     if (!isEmpty(props.config) && dialogVisible.value) {
         // 处理数据
-        const staging_data : any = {};
         pagination_data.value = {
             page: 1,
             page_size: props?.config?.page_size || undefined,
             data_total: 0,
         }
-        const filter_form_config = props?.config?.filter_form_config || [];
         // 将数据赋值给默认数据
-        if (filter_form_config.length > 0) {
-             // 根据不同的类型，初始化不同的数据, 并将对象处理成对应的值
-             filter_form_config.forEach((item: any) => {
-                let value : number | string | Array<any> = '';
-                if (item.type == 'checkbox' || item.type == 'select' && +item?.config?.is_multiple == 1) { // 多选
-                    value = item?.config?.default ?? [];
-                } else if ((item.type == 'input' && item?.config?.type == 'number') || item.type == 'switch') { // 数字/开关
-                    value = Number(item?.config?.default ?? 0);
-                } else { // 其他
-                    value = item?.config?.default ?? '';
-                }
-                staging_data[item.form_name] = value;
-            })
-        }
+        const staging_data = interface_field_processing(props?.config?.search_filter_form_config || [], 'new', {});
         // 循环完之后赋值，避免多次赋值，传递给子组件出现多次调用和回调问题
         default_data.value = staging_data;
     }
@@ -162,12 +152,19 @@ const get_table_list = (val: any) => {
     tableData.value = [];
     // 判断是否有数据和配置和请求地址
     if (!isEmpty(props.config) && !isEmpty(props.config.data_url)) {
+        // 取出自动模式所有的字段
+        const filter_data = interface_field_processing(props?.config?.filter_form_config, 'new', {}) || {};
+        // 取出所有字段的key
+        const filter_key = Object.keys(filter_data);
+        // 移除不需要的数据
+        const extraSearchData = pick(props?.extraSearchData || {}, filter_key) || {};
         // 发送请求，获取数据
         const data = {
             ...val,
+            ...extraSearchData,
             page: pagination_data.value.page,
             page_size: pagination_data.value.page_size,
-        }
+        };
         loading.value = true;
         request({
             url: props.config.data_url, // 请求地址
diff --git a/src/components/model-custom/components/index-default.ts b/src/components/model-custom/components/index-default.ts
index 40927e07..e22174eb 100644
--- a/src/components/model-custom/components/index-default.ts
+++ b/src/components/model-custom/components/index-default.ts
@@ -16,6 +16,11 @@ const text_com_data = {
         id: '',
         option: {}
     },
+    data_split: {
+        left: '',
+        middle: '',
+        right: '',
+    },
     is_rich_text: '0',
     is_up_down: '1',
     text_color: '#000',
diff --git a/src/components/model-custom/index.vue b/src/components/model-custom/index.vue
index 1a6582d2..fde55909 100644
--- a/src/components/model-custom/index.vue
+++ b/src/components/model-custom/index.vue
@@ -125,7 +125,7 @@ const style_chunk_container = computed(() => common_styles_computer(new_style.va
 const style_chunk_img_container = computed(() => common_img_computer(new_style.value.data_style));
 
 // 数据来源的内容
-let data_source_content_list = computed(() => {
+const data_source_content_list = computed(() => {
     // 是自定义数据类型的时候，显示自定义数据，否则显示数据来源的数据
     if (form.value.is_custom_data == '1') {
         if (Number(form.value.data_source_content.data_type) === 0) {
diff --git a/src/components/model-custom/model-custom-content.vue b/src/components/model-custom/model-custom-content.vue
index 12587aa4..f7381513 100644
--- a/src/components/model-custom/model-custom-content.vue
+++ b/src/components/model-custom/model-custom-content.vue
@@ -40,9 +40,10 @@
                                 </el-radio-group>
                             </el-form-item>
                             <template v-if="Number(form.data_source_content.data_type) === 0">
-                                <div class="nav-list">
-                                    <drag-group :list="form.data_source_content.data_list" :img-params="form.show_data?.data_logo || ''" :title-params="form.show_data?.data_name || 'name'" type="custom" @onsort="data_list_sort" @remove="data_list_remove" @replace="data_list_replace"></drag-group>
-                                    <el-button class="mt-20 w" @click="add">+添加</el-button>
+                                <div class="nav-list flex-col gap-20">
+                                    <filter-form v-if="!isEmpty(default_type_data?.appoint_config?.filter_form_config || {})" :filter-data="default_type_data?.appoint_config?.filter_form_config || {}" direction="vertical" :title-width="58" :data-interface="form.data_source_content" @form-change="filter_form_change"></filter-form>
+                                    <drag-group v-if="!isEmpty(form.data_source_content.data_list)" :list="form.data_source_content.data_list" :img-params="form.show_data?.data_logo || ''" :title-params="form.show_data?.data_name || 'name'" type="custom" @onsort="data_list_sort" @remove="data_list_remove" @replace="data_list_replace"></drag-group>
+                                    <el-button class="w" @click="add">+添加</el-button>
                                 </div>
                             </template>
                             <template v-else>
@@ -63,15 +64,15 @@
         <!-- 自定义内部数据内容处理 -->
         <custom-config :key="drag_group_key + 'custom-group'" v-model:visible="dialogVisible_group" v-model:width="center_group_width" v-model:height="center_group_height" v-model:father-list="custom_group_father_list" config-type="custom-group" :dragkey="drag_group_key + 'custom-group'" :options="custom_group_option_list" :source-list="!isEmpty(new_group_source_list) ? new_group_source_list : {}" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :custom-id="center_group_id" :custom-list="custom_group_list" :custom-group-field-id="custom_group_field_id" @accomplish="accomplish"></custom-config>
         <!-- 手动筛选数据弹出框 -->
-        <custom-dialog v-model:dialog-visible="url_value_dialog_visible" :data-list-key="form.show_data?.data_key || 'id'" :config="default_type_data.appoint_config" :multiple="url_value_multiple_bool" @confirm_event="url_value_dialog_call_back"></custom-dialog>
+        <custom-dialog v-model:dialog-visible="url_value_dialog_visible" :data-list-key="form.show_data?.data_key || 'id'" :config="default_type_data.appoint_config" :extra-search-data="form.data_source_content" :multiple="url_value_multiple_bool" @confirm_event="url_value_dialog_call_back"></custom-dialog>
     </div>
 </template>
 <script setup lang="ts">
-import { isEmpty, cloneDeep, omit } from 'lodash';
+import { isEmpty, cloneDeep, pick } from 'lodash';
 import request from '@/utils/request';
 import CustomAPI from '@/api/custom';
 import { DataSourceStore } from '@/store';
-import { get_math, get_nested_property } from '@/utils';
+import { get_math, get_nested_property, interface_field_processing } from '@/utils';
 const data_source_store = DataSourceStore();
 
 const props = defineProps({
@@ -301,25 +302,26 @@ const filter_data_handling = (type: string = 'old') => {
         // 类型 历史的如果不存在，就使用第一个，否则的话，使用第一个
         data_type: type == 'old'? (form.value.data_source_content?.data_type ?? data_type) : data_type,
     };
-    // 根据不同的类型，初始化不同的数据, 并将对象处理成对应的值
-    default_type_data.value?.filter_config?.filter_form_config.forEach((item: any) => {
-        let value : number | string | Array<any> = '';
-        if (item.type == 'checkbox' || (item.type == 'select' && +item?.config?.is_multiple == 1)) { // 多选
-            value = item?.config?.default ?? [];
-        } else if ((item.type == 'input' && item?.config?.type == 'number') || item.type == 'switch') { // 数字/开关
-            value = Number(item?.config?.default ?? 0);
-        } else {
-            value = item?.config?.default ?? '';
+    let new_data_field = {};
+    // 根据不同的数据初始化不同的内容
+    if (staging_data.data_type === 0) {
+        // 如果是手动模式，就取手动模式的数据为默认数据，避免两者重复导致数据冲突
+        new_data_field = {
+            ...interface_field_processing(default_type_data.value?.filter_config?.filter_form_config, type, form.value?.data_source_content || {}),
+            ...interface_field_processing(default_type_data.value?.appoint_config?.filter_form_config, type, form.value?.data_source_content || {}),
         }
-        // 历史数据的话，需要判断一下，如果历史数据没有，那么就使用默认数据
-        if (type == 'old') {
-            staging_data[item.form_name] = form.value.data_source_content[item.form_name] == null ? value : form.value.data_source_content[item.form_name];
-        } else {
-            staging_data[item.form_name] = value;
+    } else {
+        // 如果是自动模式，就取自动模式的数据为默认数据，避免两者重复导致数据冲突
+        new_data_field = {
+            ...interface_field_processing(default_type_data.value?.appoint_config?.filter_form_config, type, form.value?.data_source_content || {}),
+            ...interface_field_processing(default_type_data.value?.filter_config?.filter_form_config, type, form.value?.data_source_content || {}),
         }
-    })
+    }
     // 循环完之后赋值，避免多次赋值，传递给子组件出现多次调用和回调问题
-    form.value.data_source_content = staging_data;
+    form.value.data_source_content = {
+        ...staging_data,
+        ...new_data_field,
+    };
 };
 // 处理显示的图片和传递到下去的数据结构
 const model_data_source = ref<data_list[]>([]);
@@ -468,7 +470,12 @@ const get_auto_data = () => {
     } else if (isEmpty(default_type_data.value.filter_config.data_url)) {
         ElMessage.error('请先配置请求地址(data_url)');
     } else {
-        const data = omit(cloneDeep(form.value.data_source_content), ['data_ids', 'data_list', 'data_auto_list', 'data_type']);
+        // 取出自动模式所有的字段
+        const filter_data = interface_field_processing(default_type_data.value?.filter_config?.filter_form_config, 'new', {}) || {};
+        // 取出所有字段的key
+        const filter_key = Object.keys(filter_data);
+        // 取出对应key的数据
+        const data = pick(cloneDeep(form.value.data_source_content), filter_key);
         request({
             url: default_type_data.value.filter_config.data_url, // 请求地址
             method: 'post', // 请求方式
diff --git a/src/components/model-tabs-carousel/index.vue b/src/components/model-tabs-carousel/index.vue
index f5a5ecf6..173e37af 100644
--- a/src/components/model-tabs-carousel/index.vue
+++ b/src/components/model-tabs-carousel/index.vue
@@ -49,7 +49,6 @@ watch(
             background_img: new_style.tabs_bg_background_img,
         }
         tabs_container.value = gradient_computer(tabs_data) + radius_computer(new_style.tabs_radius) + margin_computer(new_style.tabs_margin) + box_shadow_computer(new_style.tabs_content) + border_computer(new_style.tabs_content);
-        console.log(new_style.tabs_margin);
         tabs_img_container.value = background_computer(tabs_data) + padding_computer(new_style.tabs_padding);
         // 轮播区域背景设置
         const carousel_content_data = {
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 79501da6..26407477 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -150,6 +150,45 @@ export const border_width = (style: BorderStyle): number => {
     }
 }
 
+/**
+ * 接口字段数据处理函数
+ * 根据提供的列表和类型，处理并返回一个包含默认值或历史值的对象
+ * @param {any} list - 包含多项配置的列表，用于处理数据
+ * @param {string} type - 数据类型标识符，决定是否使用历史数据
+ * @param {any} data_source_content - 历史数据
+ * @returns {any} - 处理后的数据对象
+ */
+export const interface_field_processing = (list: any, type: string, data_source_content: any) => {
+    // 初始化一个空对象来存储处理后的数据
+    const staging_data: any = {};
+    // 如果列表不一样0，则遍历列表处理每一项
+    if (!isEmpty(list)) {
+        list.forEach((item: any) => {
+            // 初始化值变量，根据不同的类型将被赋予不同的默认值
+            let value : number | string | Array<any> = '';
+            // 处理多选类型，默认值为空数组
+            if (item.type == 'checkbox' || (item.type == 'select' && +item?.config?.is_multiple == 1)) {
+                value = item?.config?.default ?? [];
+            } else if ((item.type == 'input' && item?.config?.type == 'number') || item.type == 'switch') {
+                // 处理数字或开关类型，默认值为0
+                value = Number(item?.config?.default ?? 0);
+            } else {
+                // 其他情况，默认值为空字符串
+                value = item?.config?.default ?? '';
+            }
+            // 如果是历史数据，且历史数据存在，则使用历史数据；否则使用默认值
+            if (type == 'old') {
+                staging_data[item.form_name] = data_source_content[item.form_name] == null ? value : data_source_content[item.form_name];
+            } else {
+                // 如果不是历史数据，直接使用默认值
+                staging_data[item.form_name] = value;
+            }
+        })
+    }
+    // 返回处理后的数据对象
+    return staging_data;
+}
+
 /**
  * 根据指定的条件类型和值，判断字段值是否满足条件
  * @param fieldValue 字段值，可以是任何类型
@@ -269,6 +308,11 @@ export const get_indicator_location = (new_style: indicator_data) => {
 type condition_data = { field: string, type: string, value: string  };
 export const get_is_eligible = (field_list: any[], condition: condition_data, props: any) => {
     try {
+        // 条件加特殊标识，避免选择的时候出现重复的
+        let new_field = condition.field;
+        if (condition.field.includes('{|}')) {
+            new_field = condition.field.split('{|}')[0];
+        }
         // 获取对应条件字段的字段数据
         let option: any = {};
         if (field_list) {
@@ -279,16 +323,21 @@ export const get_is_eligible = (field_list: any[], condition: condition_data, pr
                 // 取出自定义组内部数据源参数的详细数据
                 const new_field_list = group_option_list?.data || [];
                 // 通过对应条件，筛选出对应的数据
-                option = new_field_list.find((item: any) => item.field === condition.field);
+                option = new_field_list.find((item: any) => item.field === new_field);
             } else {
-                option = field_list.find((item: any) => item.field === condition.field);
+                option = field_list.find((item: any) => item.field === new_field);
             }
         }
-        // 获取到字段的真实数据, option的使用主要是为了获取的他的中间参数和前缀，后缀等拼接在一起
-        const field_value = custom_condition_data(condition.field || '', option || {}, props.sourceList, props.isCustom);
-        // 判断条件字段是否为空并且是显示面板才会生效，则直接返回true
-        if (!isEmpty(condition.field) && !isEmpty(condition.type) && props.isDisplayPanel) {
-            return custom_condition_judg(field_value, condition.type, condition.value);
+        // 找不到对应的字段，就直接返回为成功，条件不存在
+        if (!isEmpty(option)) {
+            // 获取到字段的真实数据, option的使用主要是为了获取的他的中间参数和前缀，后缀等拼接在一起
+            const field_value = custom_condition_data(new_field || '', option || {}, props.sourceList, props.isCustom);
+            // 判断条件字段是否为空并且是显示面板才会生效，则直接返回true
+            if (!isEmpty(new_field) && !isEmpty(condition.type) && props.isDisplayPanel) {
+                return custom_condition_judg(field_value, condition.type, condition.value);
+            } else {
+                return true;
+            }
         } else {
             return true;
         }