bri-components 1.5.22 → 1.6.0

package/src/components/form/DshAdvSearch.vue

@@ -1,510 +1,510 @@
-<template>
-    <div class="DshAdvSearch">
-        <!-- 有可选择字段 -->
-        <template v-if="canSearchFormList.length">
-            <!-- 逻辑 -->
-            <div class="DshAdvSearch-logic">
-                <div class="DshAdvSearch-logic-title">{{ logicStr }}</div>
-                <dsh-select
-                    class="DshAdvSearch-logic-option"
-                    :value="advSearchObj"
-                    :propsObj="selfLogicPropsObj"
-                    @change="change"
-                ></dsh-select>
-            </div>
-
-            <!-- 条件 -->
-            <div class="DshAdvSearch-title">{{ conditionStr }}</div>
-            <div class="DshAdvSearch-conditions">
-                <template v-for="(conditionItem, conditionIndex) in advSearchObj.conditions">
-                    <!-- 'and', 'or' 循环模式 -->
-                    <div
-                        v-if="['and', 'or'].includes(conditionItem.logic)"
-                        :key="`${conditionItem._id}andor`"
-                        class="DshAdvSearch-conditions-loop"
-                    >
-                        <dsh-adv-search
-                            :mode="mode"
-                            :isSimpleSearch="isSimpleSearch"
-                            :themeWord="themeWord"
-                            :useLoop="useLoop"
-                            :isInner="true"
-                            :value="conditionItem"
-                            :formList="canSearchFormList"
-                            :useChainField="useChainField"
-                            :dynamicFormList="dynamicFormList"
-                            @change="change('loopSearch', conditionItem, ...arguments)"
-                        >
-                            <slot
-                                slot-scope="{ conditionItem }"
-                                :conditionItem="conditionItem"
-                            ></slot>
-                        </dsh-adv-search>
-
-                        <!-- 删除 -->
-                        <dsh-icons
-                            slot="corner"
-                            class="DshAdvSearch-conditions-delete"
-                            :list="$getOperationList(['deleteCondition'])"
-                            @click="$dispatchEvent($event, conditionItem, conditionIndex, advSearchObj.conditions)"
-                        />
-                    </div>
-
-                    <!-- field 正常模式 -->
-                    <dsh-form-unit
-                        v-else-if="['field', undefined].includes(conditionItem.logic)"
-                        :key="`${conditionItem._id}field`"
-                        :class="{
-                            'DshAdvSearch-conditions-item': true,
-                            'DshAdvSearch-conditions-item-dynamic': conditionItem.dynamicList && conditionItem.dynamicList.length
-                        }"
-                        :formData="conditionItem"
-                        :formItem="conditionItem.formItem"
-                        height="80"
-                        @change="change('control', conditionItem, ...arguments)"
-                    >
-                        <template v-if="!conditionItem.__isDelete__">
-                            <slot :conditionItem="conditionItem">
-                                <!-- 为空和不为空时 啥内容也不显示 -->
-                                <div
-                                    v-if="['isnull', 'notnull', 'nosize', 'size', 'nolist', 'list'].includes(conditionItem.fieldOperator)"
-                                    class="DshAdvSearch-conditions-item-blank"
-                                >请选择右上角条件</div>
-
-                                <!-- 子表的筛选，递归 -->
-                                <template v-else-if="['subSearch', 'subTableSearch', 'cascaderTableSearch', 'treeTableSearch'].includes(conditionItem.fieldOperator)">
-                                    <!-- 出现是有条件的 -->
-                                    <dsh-adv-search
-                                        v-if="conditionItem.finished === true"
-                                        style="padding: 0px 0px 0px 8px;"
-                                        :mode="mode"
-                                        :isSimpleSearch="isSimpleSearch"
-                                        :themeWord="themeWord"
-                                        :useLoop="useLoop"
-                                        :isInner="true"
-                                        :value="conditionItem.fieldSearch"
-                                        :formList="conditionItem.subFormList"
-                                        :useChainField="useChainField"
-                                        :dynamicFormList="dynamicFormList"
-                                        @change="change('subSearch', conditionItem, ...arguments)"
-                                    ></dsh-adv-search>
-
-                                    <div
-                                        v-else
-                                        class="DshAdvSearch-conditions-item-loading"
-                                    >加载中……</div>
-                                </template>
-
-                                <!-- 其他 -->
-                                <template v-else>
-                                    <!-- 动态文本 -匹配的动态字段 -->
-                                    <template v-if="conditionItem.parameterType === 'dynamicText'">
-                                        <dsh-select
-                                            v-if="useChainField"
-                                            class="DshAdvSearch-conditions-item-control"
-                                            :value="conditionItem"
-                                            :propsObj="{
-                                                _name: `${conditionItem.formItem._name}的联动字段`,
-                                                _key: 'chainFieldKey',
-                                                _data: conditionItem.dynamicList
-                                            }"
-                                            @change="change('parameterTypeControl', conditionItem, ...arguments)"
-                                        ></dsh-select>
-
-                                        <dsh-checkbox
-                                            v-else
-                                            class="DshAdvSearch-conditions-item-control"
-                                            :value="conditionItem"
-                                            :propsObj="{
-                                                _name: `${conditionItem.formItem._name}的动态参数`,
-                                                _key: 'fieldParams',
-                                                _data: conditionItem.dynamicList
-                                            }"
-                                            @change="change('parameterTypeControl', conditionItem, ...arguments)"
-                                        ></dsh-checkbox>
-                                    </template>
-
-                                    <!-- 固定文本 -->
-                                </template>
-                            </slot>
-                        </template>
-
-                        <!-- 右上角 -->
-                        <div
-                            v-if="!conditionItem.__isDelete__"
-                            slot="extra"
-                            class="DshAdvSearch-conditions-item-extra"
-                        >
-                            <!-- 动态类型 or 固定类型 -->
-                            <dsh-dropdown
-                                v-if="
-                                    conditionItem.dynamicList.length &&
-                                    !['isnull', 'notnull', 'nosize', 'size', 'nolist', 'list'].includes(conditionItem.fieldOperator) &&
-                                    !['subSearch', 'subTableSearch', 'cascaderTableSearch', 'treeTableSearch'].includes(conditionItem.fieldOperator)
-                                "
-                                class="extra-dynamic"
-                                :list="getParameterData(conditionItem)"
-                                @click="$dispatchEvent(operationMap.selectParameterType, conditionItem, conditionIndex, advSearchObj.conditions, $event)"
-                            >
-                                <span class="extra-operator-wrap">
-                                    <span class="extra-operator-name">
-                                        {{ conditionItem.parameterTypeName }}
-                                    </span>
-                                    <Icon
-                                        v-if="getParameterData(conditionItem).length"
-                                        class="extra-operator-icon"
-                                        type="ios-arrow-down"
-                                    />
-                                </span>
-                            </dsh-dropdown>
-
-                            <!-- operators 操作类型 -->
-                            <dsh-dropdown
-                                v-if="!isSimpleSearch && conditionItem.operators.length"
-                                class="extra-operator"
-                                :list="conditionItem.operators"
-                                @click="$dispatchEvent(operationMap.selectOperator, conditionItem, conditionIndex, advSearchObj.conditions, $event)"
-                            >
-                                <span class="extra-operator-wrap">
-                                    <span class="extra-operator-name">
-                                        {{ conditionItem.fieldOperatorName }}
-                                    </span>
-                                    <Icon
-                                        class="extra-operator-icon"
-                                        type="ios-arrow-down"
-                                    />
-                                </span>
-                            </dsh-dropdown>
-                        </div>
-
-                        <!-- 删除 -->
-                        <dsh-icons
-                            slot="corner"
-                            class="DshAdvSearch-conditions-delete"
-                            :list="$getOperationList(['deleteCondition'])"
-                            @click="$dispatchEvent($event, conditionItem, conditionIndex, advSearchObj.conditions)"
-                        />
-                    </dsh-form-unit>
-
-                    <!-- text 关键字的模式 -->
-                    <div
-                        v-else-if="['text'].includes(conditionItem.logic)"
-                        :key="`${conditionItem._id}text`"
-                    >
-                        {{ conditionItem.logic }}模式暂未开发
-                    </div>
-
-                    <!-- native 以及以后可能增加的模式 -->
-                    <div
-                        v-else
-                        :key="`${conditionItem._id}other`"
-                    >
-                        {{ conditionItem.logic }}模式未开发
-                    </div>
-                </template>
-            </div>
-
-            <!-- 按钮s -->
-            <div class="DshAdvSearch-btns">
-                <!-- 添加条件项 -->
-                <dsh-dropdown
-                    class="DshAdvSearch-btns-field"
-                    menuClass="DshAdvSearch-btns-field-list"
-                    :list="canSearchFormList"
-                    :useSearch="true"
-                    trigger="click"
-                    @click="$dispatchEvent(operationMap.createCondition, false, $event, advSearchObj.conditions)"
-                >
-                    <dsh-buttons
-                        itemClass="DshAdvSearch-btns-item"
-                        :list="$getOperationList(['createCondition'])"
-                    ></dsh-buttons>
-                </dsh-dropdown>
-
-                <!-- 添加循环层 -->
-                <dsh-buttons
-                    class="DshAdvSearch-btns-loop"
-                    :list="$getOperationList(['createLoopContion'])"
-                    @click="$dispatchEvent($event, true, undefined, advSearchObj.conditions)"
-                ></dsh-buttons>
-            </div>
-        </template>
-
-        <!-- 无可选择字段 -->
-        <div
-            v-else
-            :class="{
-                'DshAdvSearch-nodata': !isInner,
-                'DshAdvSearch-nodata-small': isInner
-            }"
-        >
-            {{ noFormListStr }}
-        </div>
-    </div>
-</template>
-
-<script>
-    import searchMixin from "./searchMixin.js";
-
-    export default {
-        name: "DshAdvSearch",
-        mixins: [
-            searchMixin
-        ],
-        components: {},
-        props: {
-            mode: {
-                type: String,
-                default: "default",
-                validator (val) {
-                    // 用户态、 配置端、高级依赖、以及仪表盘乱用的地方
-                    return ["default", "set"].includes(val);
-                }
-            },
-            // 用高级筛选 但简单的像默认筛选那样使用（不要逻辑条件，筛选层，右上筛选条件）
-            isSimpleSearch: {
-                type: Boolean,
-                default: false
-            },
-            themeWord: {
-                type: String,
-                default: "筛选"
-            },
-            useLoop: {
-                type: Boolean,
-                default: true
-            },
-            isInner: {
-                type: Boolean,
-                default: false
-            }
-        },
-        data () {
-            return {
-                selfLogicPropsObj: {
-                    _name: `添加${this.themeWord}逻辑`,
-                    _key: "logic",
-                    _optionKind: "flat",
-                    _clearable: false,
-                    // _disabled: this.isSimpleSearch,
-                    _data: [
-                        { _key: "and", name: "且" },
-                        { _key: "or", name: "或" }
-                    ]
-                },
-
-                allOperationMap: {
-                    createCondition: {
-                        name: `添加${this.themeWord}条件`,
-                        type: "createCondition",
-                        icon: "md-add",
-                        size: this.isInner ? "small" : "default",
-                        long: true,
-                        event: "createCondition"
-                    },
-                    createLoopContion: {
-                        name: `添加${this.themeWord === "筛选" ? this.themeWord : "逻辑"}层`,
-                        type: "createLoopContion",
-                        icon: "md-add",
-                        size: this.isInner ? "small" : "default",
-                        long: true,
-                        event: "createCondition"
-                    },
-                    deleteCondition: {
-                        name: `删除${this.themeWord}条件`,
-                        type: "deleteCondition",
-                        customIcon: "bico-delete",
-                        size: "16",
-                        event: "deleteCondition"
-                    },
-                    selectOperator: {
-                        name: `选择${this.themeWord}类型`,
-                        type: "selectOperator",
-                        event: "changeOperator"
-                    },
-                    selectParameterType: {
-                        name: `选择${this.themeWord}方式`,
-                        type: "selectParameterType",
-                        event: "changeParameterType"
-                    }
-                }
-            };
-        },
-        computed: {
-            logicStr () {
-                return `${this.themeWord}逻辑`;
-            },
-            conditionStr () {
-                return `${this.themeWord}条件`;
-            },
-            noFormListStr () {
-                return "当前无可选择的字段";
-            },
-
-            operationMap () {
-                return this.$categoryMapToMap(
-                    this.allOperationMap,
-                    undefined,
-                    this.isSimpleSearch === true || this.useLoop === false ? ["createLoopContion"] : []
-                );
-            }
-        },
-        created () {},
-        methods: {}
-    };
-</script>
-
-<style lang="less" scoped>
-    .DshAdvSearch {
-        #title {
-            font-weight: 400;
-            font-size: 14px;
-            color: #999999;
-        }
-
-        &-title {
-            #title();
-        }
-
-        &-logic {
-            margin: 0px 0px 10px;
-            .dsh-flex-row-start-center();
-
-            &-title {
-                #title();
-            }
-
-            &-option {
-                flex: 1;
-                min-width: 100px;
-                margin-left: 20px;
-            }
-        }
-
-        &-conditions {
-            &-delete {
-                position: absolute;
-                top: 3px;
-                right: -3px;
-                padding: 3px;
-                color: red;
-                display: none;
-            }
-
-            &-loop,
-            &-item {
-                position: relative;
-
-                &:hover,
-                &-active {
-                    .DshAdvSearch-conditions-delete {
-                        display: inline-block;
-                    }
-                }
-            }
-
-            &-loop {
-                padding: 10px;
-                margin: 6px;
-                border: 1px solid @placeholderColor;
-                background-color: #F4F8FF;
-            }
-
-            &-item {
-                padding: 0!important;
-                margin-bottom: 8px!important;
-                cursor: pointer;
-
-                &-loading {
-                    margin: 5px 0px;
-                    text-align: center;
-                    font-size: 16px;
-                    color: @textColor;
-                }
-
-                &-control {
-                    margin-bottom: 5px;
-                }
-
-                &-blank {
-                    text-align: center;
-                    line-height: 30px;
-                    color: @placeholderColor;
-                }
-
-                &-extra {
-                    text-align: right;
-
-                    .extra {
-                        &-dynamic,
-                        &-operator {
-                            &-wrap {
-                                display: inline-block;
-                                padding: 3px 5px;
-                                border-radius: 3px;
-
-                                &:hover {
-                                    background-color: #e9f2f9;
-                                }
-                            }
-
-                            &-name {
-                                display: inline-block;
-                                min-width: 24px;
-                            }
-
-                            &-icon {
-
-                            }
-                        }
-                    }
-                }
-            }
-        }
-
-        &-btns {
-            width: 100%;
-            margin-top: 15px;
-            .dsh-flex-row-start-center();
-
-            &-field {
-                flex: 3;
-
-                &-list {
-                    width: 330px;
-                }
-            }
-
-            &-loop {
-                flex: 1;
-                margin-left: 12px;
-            }
-        }
-
-        &-nodata {
-            #dsh-nodata();
-
-            &-small {
-                #dsh-nodata-small();
-            }
-        }
-    }
-</style>
-<style lang="less">
-    .DshAdvSearch {
-        &-conditions {
-            &-item {
-                .DshFormUnit-label-right {
-                    flex: 3;
-                    margin-right: 10px;
-                }
-
-                &-dynamic {
-                    .DshFormUnit-label-right {
-                        flex: 4;
-                    }
-                }
-            }
-        }
-    }
-</style>
+<template>
+    <div class="DshAdvSearch">
+        <!-- 有可选择字段 -->
+        <template v-if="canSearchFormList.length">
+            <!-- 逻辑 -->
+            <div class="DshAdvSearch-logic">
+                <div class="DshAdvSearch-logic-title">{{ logicStr }}</div>
+                <dsh-select
+                    class="DshAdvSearch-logic-option"
+                    :value="advSearchObj"
+                    :propsObj="selfLogicPropsObj"
+                    @change="change"
+                ></dsh-select>
+            </div>
+
+            <!-- 条件 -->
+            <div class="DshAdvSearch-title">{{ conditionStr }}</div>
+            <div class="DshAdvSearch-conditions">
+                <template v-for="(conditionItem, conditionIndex) in advSearchObj.conditions">
+                    <!-- 'and', 'or' 循环模式 -->
+                    <div
+                        v-if="['and', 'or'].includes(conditionItem.logic)"
+                        :key="`${conditionItem._id}andor`"
+                        class="DshAdvSearch-conditions-loop"
+                    >
+                        <dsh-adv-search
+                            :mode="mode"
+                            :isSimpleSearch="isSimpleSearch"
+                            :themeWord="themeWord"
+                            :useLoop="useLoop"
+                            :isInner="true"
+                            :value="conditionItem"
+                            :formList="canSearchFormList"
+                            :useChainField="useChainField"
+                            :dynamicFormList="dynamicFormList"
+                            @change="change('loopSearch', conditionItem, ...arguments)"
+                        >
+                            <slot
+                                slot-scope="{ conditionItem }"
+                                :conditionItem="conditionItem"
+                            ></slot>
+                        </dsh-adv-search>
+
+                        <!-- 删除 -->
+                        <dsh-icons
+                            slot="corner"
+                            class="DshAdvSearch-conditions-delete"
+                            :list="$getOperationList(['deleteCondition'])"
+                            @click="$dispatchEvent($event, conditionItem, conditionIndex, advSearchObj.conditions)"
+                        />
+                    </div>
+
+                    <!-- field 正常模式 -->
+                    <dsh-form-unit
+                        v-else-if="['field', undefined].includes(conditionItem.logic)"
+                        :key="`${conditionItem._id}field`"
+                        :class="{
+                            'DshAdvSearch-conditions-item': true,
+                            'DshAdvSearch-conditions-item-dynamic': conditionItem.dynamicList && conditionItem.dynamicList.length
+                        }"
+                        :formData="conditionItem"
+                        :formItem="conditionItem.formItem"
+                        height="80"
+                        @change="change('control', conditionItem, ...arguments)"
+                    >
+                        <template v-if="!conditionItem.__isDelete__">
+                            <slot :conditionItem="conditionItem">
+                                <!-- 为空和不为空时 啥内容也不显示 -->
+                                <div
+                                    v-if="['isnull', 'notnull', 'nosize', 'size', 'nolist', 'list'].includes(conditionItem.fieldOperator)"
+                                    class="DshAdvSearch-conditions-item-blank"
+                                >请选择右上角条件</div>
+
+                                <!-- 子表的筛选，递归 -->
+                                <template v-else-if="['subSearch', 'subTableSearch', 'cascaderTableSearch', 'treeTableSearch'].includes(conditionItem.fieldOperator)">
+                                    <!-- 出现是有条件的 -->
+                                    <dsh-adv-search
+                                        v-if="conditionItem.finished === true"
+                                        style="padding: 0px 0px 0px 8px;"
+                                        :mode="mode"
+                                        :isSimpleSearch="isSimpleSearch"
+                                        :themeWord="themeWord"
+                                        :useLoop="useLoop"
+                                        :isInner="true"
+                                        :value="conditionItem.fieldSearch"
+                                        :formList="conditionItem.subFormList"
+                                        :useChainField="useChainField"
+                                        :dynamicFormList="dynamicFormList"
+                                        @change="change('subSearch', conditionItem, ...arguments)"
+                                    ></dsh-adv-search>
+
+                                    <div
+                                        v-else
+                                        class="DshAdvSearch-conditions-item-loading"
+                                    >加载中……</div>
+                                </template>
+
+                                <!-- 其他 -->
+                                <template v-else>
+                                    <!-- 动态文本 -匹配的动态字段 -->
+                                    <template v-if="conditionItem.parameterType === 'dynamicText'">
+                                        <dsh-select
+                                            v-if="useChainField"
+                                            class="DshAdvSearch-conditions-item-control"
+                                            :value="conditionItem"
+                                            :propsObj="{
+                                                _name: `${conditionItem.formItem._name}的联动字段`,
+                                                _key: 'chainFieldKey',
+                                                _data: conditionItem.dynamicList
+                                            }"
+                                            @change="change('parameterTypeControl', conditionItem, ...arguments)"
+                                        ></dsh-select>
+
+                                        <dsh-checkbox
+                                            v-else
+                                            class="DshAdvSearch-conditions-item-control"
+                                            :value="conditionItem"
+                                            :propsObj="{
+                                                _name: `${conditionItem.formItem._name}的动态参数`,
+                                                _key: 'fieldParams',
+                                                _data: conditionItem.dynamicList
+                                            }"
+                                            @change="change('parameterTypeControl', conditionItem, ...arguments)"
+                                        ></dsh-checkbox>
+                                    </template>
+
+                                    <!-- 固定文本 -->
+                                </template>
+                            </slot>
+                        </template>
+
+                        <!-- 右上角 -->
+                        <div
+                            v-if="!conditionItem.__isDelete__"
+                            slot="extra"
+                            class="DshAdvSearch-conditions-item-extra"
+                        >
+                            <!-- 动态类型 or 固定类型 -->
+                            <dsh-dropdown
+                                v-if="
+                                    conditionItem.dynamicList.length &&
+                                    !['isnull', 'notnull', 'nosize', 'size', 'nolist', 'list'].includes(conditionItem.fieldOperator) &&
+                                    !['subSearch', 'subTableSearch', 'cascaderTableSearch', 'treeTableSearch'].includes(conditionItem.fieldOperator)
+                                "
+                                class="extra-dynamic"
+                                :list="getParameterData(conditionItem)"
+                                @click="$dispatchEvent(operationMap.selectParameterType, conditionItem, conditionIndex, advSearchObj.conditions, $event)"
+                            >
+                                <span class="extra-operator-wrap">
+                                    <span class="extra-operator-name">
+                                        {{ conditionItem.parameterTypeName }}
+                                    </span>
+                                    <Icon
+                                        v-if="getParameterData(conditionItem).length"
+                                        class="extra-operator-icon"
+                                        type="ios-arrow-down"
+                                    />
+                                </span>
+                            </dsh-dropdown>
+
+                            <!-- operators 操作类型 -->
+                            <dsh-dropdown
+                                v-if="!isSimpleSearch && conditionItem.operators.length"
+                                class="extra-operator"
+                                :list="conditionItem.operators"
+                                @click="$dispatchEvent(operationMap.selectOperator, conditionItem, conditionIndex, advSearchObj.conditions, $event)"
+                            >
+                                <span class="extra-operator-wrap">
+                                    <span class="extra-operator-name">
+                                        {{ conditionItem.fieldOperatorName }}
+                                    </span>
+                                    <Icon
+                                        class="extra-operator-icon"
+                                        type="ios-arrow-down"
+                                    />
+                                </span>
+                            </dsh-dropdown>
+                        </div>
+
+                        <!-- 删除 -->
+                        <dsh-icons
+                            slot="corner"
+                            class="DshAdvSearch-conditions-delete"
+                            :list="$getOperationList(['deleteCondition'])"
+                            @click="$dispatchEvent($event, conditionItem, conditionIndex, advSearchObj.conditions)"
+                        />
+                    </dsh-form-unit>
+
+                    <!-- text 关键字的模式 -->
+                    <div
+                        v-else-if="['text'].includes(conditionItem.logic)"
+                        :key="`${conditionItem._id}text`"
+                    >
+                        {{ conditionItem.logic }}模式暂未开发
+                    </div>
+
+                    <!-- native 以及以后可能增加的模式 -->
+                    <div
+                        v-else
+                        :key="`${conditionItem._id}other`"
+                    >
+                        {{ conditionItem.logic }}模式未开发
+                    </div>
+                </template>
+            </div>
+
+            <!-- 按钮s -->
+            <div class="DshAdvSearch-btns">
+                <!-- 添加条件项 -->
+                <dsh-dropdown
+                    class="DshAdvSearch-btns-field"
+                    menuClass="DshAdvSearch-btns-field-list"
+                    :list="canSearchFormList"
+                    :useSearch="true"
+                    trigger="click"
+                    @click="$dispatchEvent(operationMap.createCondition, false, $event, advSearchObj.conditions)"
+                >
+                    <dsh-buttons
+                        itemClass="DshAdvSearch-btns-item"
+                        :list="$getOperationList(['createCondition'])"
+                    ></dsh-buttons>
+                </dsh-dropdown>
+
+                <!-- 添加循环层 -->
+                <dsh-buttons
+                    class="DshAdvSearch-btns-loop"
+                    :list="$getOperationList(['createLoopContion'])"
+                    @click="$dispatchEvent($event, true, undefined, advSearchObj.conditions)"
+                ></dsh-buttons>
+            </div>
+        </template>
+
+        <!-- 无可选择字段 -->
+        <div
+            v-else
+            :class="{
+                'DshAdvSearch-nodata': !isInner,
+                'DshAdvSearch-nodata-small': isInner
+            }"
+        >
+            {{ noFormListStr }}
+        </div>
+    </div>
+</template>
+
+<script>
+    import searchMixin from "./searchMixin.js";
+
+    export default {
+        name: "DshAdvSearch",
+        mixins: [
+            searchMixin
+        ],
+        components: {},
+        props: {
+            mode: {
+                type: String,
+                default: "default",
+                validator (val) {
+                    // 用户态、 配置端、高级依赖、以及仪表盘乱用的地方
+                    return ["default", "set"].includes(val);
+                }
+            },
+            // 用高级筛选 但简单的像默认筛选那样使用（不要逻辑条件，筛选层，右上筛选条件）
+            isSimpleSearch: {
+                type: Boolean,
+                default: false
+            },
+            themeWord: {
+                type: String,
+                default: "筛选"
+            },
+            useLoop: {
+                type: Boolean,
+                default: true
+            },
+            isInner: {
+                type: Boolean,
+                default: false
+            }
+        },
+        data () {
+            return {
+                selfLogicPropsObj: {
+                    _name: `添加${this.themeWord}逻辑`,
+                    _key: "logic",
+                    _optionKind: "flat",
+                    _clearable: false,
+                    // _disabled: this.isSimpleSearch,
+                    _data: [
+                        { _key: "and", name: "且" },
+                        { _key: "or", name: "或" }
+                    ]
+                },
+
+                allOperationMap: {
+                    createCondition: {
+                        name: `添加${this.themeWord}条件`,
+                        type: "createCondition",
+                        icon: "md-add",
+                        size: this.isInner ? "small" : "default",
+                        long: true,
+                        event: "createCondition"
+                    },
+                    createLoopContion: {
+                        name: `添加${this.themeWord === "筛选" ? this.themeWord : "逻辑"}层`,
+                        type: "createLoopContion",
+                        icon: "md-add",
+                        size: this.isInner ? "small" : "default",
+                        long: true,
+                        event: "createCondition"
+                    },
+                    deleteCondition: {
+                        name: `删除${this.themeWord}条件`,
+                        type: "deleteCondition",
+                        customIcon: "bico-delete",
+                        size: "16",
+                        event: "deleteCondition"
+                    },
+                    selectOperator: {
+                        name: `选择${this.themeWord}类型`,
+                        type: "selectOperator",
+                        event: "changeOperator"
+                    },
+                    selectParameterType: {
+                        name: `选择${this.themeWord}方式`,
+                        type: "selectParameterType",
+                        event: "changeParameterType"
+                    }
+                }
+            };
+        },
+        computed: {
+            logicStr () {
+                return `${this.themeWord}逻辑`;
+            },
+            conditionStr () {
+                return `${this.themeWord}条件`;
+            },
+            noFormListStr () {
+                return "当前无可选择的字段";
+            },
+
+            operationMap () {
+                return this.$categoryMapToMap(
+                    this.allOperationMap,
+                    undefined,
+                    this.isSimpleSearch === true || this.useLoop === false ? ["createLoopContion"] : []
+                );
+            }
+        },
+        created () {},
+        methods: {}
+    };
+</script>
+
+<style lang="less" scoped>
+    .DshAdvSearch {
+        #title {
+            font-weight: 400;
+            font-size: 14px;
+            color: #999999;
+        }
+
+        &-title {
+            #title();
+        }
+
+        &-logic {
+            margin: 0px 0px 10px;
+            .dsh-flex-row-start-center();
+
+            &-title {
+                #title();
+            }
+
+            &-option {
+                flex: 1;
+                min-width: 100px;
+                margin-left: 20px;
+            }
+        }
+
+        &-conditions {
+            &-delete {
+                position: absolute;
+                top: 3px;
+                right: -3px;
+                padding: 3px;
+                color: red;
+                display: none;
+            }
+
+            &-loop,
+            &-item {
+                position: relative;
+
+                &:hover,
+                &-active {
+                    .DshAdvSearch-conditions-delete {
+                        display: inline-block;
+                    }
+                }
+            }
+
+            &-loop {
+                padding: 10px;
+                margin: 6px;
+                border: 1px solid @placeholderColor;
+                background-color: #F4F8FF;
+            }
+
+            &-item {
+                padding: 0!important;
+                margin-bottom: 8px!important;
+                cursor: pointer;
+
+                &-loading {
+                    margin: 5px 0px;
+                    text-align: center;
+                    font-size: 16px;
+                    color: @textColor;
+                }
+
+                &-control {
+                    margin-bottom: 5px;
+                }
+
+                &-blank {
+                    text-align: center;
+                    line-height: 30px;
+                    color: @placeholderColor;
+                }
+
+                &-extra {
+                    text-align: right;
+
+                    .extra {
+                        &-dynamic,
+                        &-operator {
+                            &-wrap {
+                                display: inline-block;
+                                padding: 3px 5px;
+                                border-radius: 3px;
+
+                                &:hover {
+                                    background-color: #e9f2f9;
+                                }
+                            }
+
+                            &-name {
+                                display: inline-block;
+                                min-width: 24px;
+                            }
+
+                            &-icon {
+
+                            }
+                        }
+                    }
+                }
+            }
+        }
+
+        &-btns {
+            width: 100%;
+            margin-top: 15px;
+            .dsh-flex-row-start-center();
+
+            &-field {
+                flex: 3;
+
+                &-list {
+                    width: 330px;
+                }
+            }
+
+            &-loop {
+                flex: 1;
+                margin-left: 12px;
+            }
+        }
+
+        &-nodata {
+            #dsh-nodata();
+
+            &-small {
+                #dsh-nodata-small();
+            }
+        }
+    }
+</style>
+<style lang="less">
+    .DshAdvSearch {
+        &-conditions {
+            &-item {
+                .DshFormUnit-label-right {
+                    flex: 3;
+                    margin-right: 10px;
+                }
+
+                &-dynamic {
+                    .DshFormUnit-label-right {
+                        flex: 4;
+                    }
+                }
+            }
+        }
+    }
+</style>