ocpview-plus 1.0.9 → 1.0.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ocpview-plus",
-  "version": "1.0.9",
+  "version": "1.0.11",
   "title": "ocpviewPlus",
   "description": "A high quality Service UI components Library with Vue.js",
   "homepage": "",

package/src/components/masterplate/RewriteBillListDetails/BillInfoPanelEditTable.vue

@@ -351,6 +351,12 @@ export default {
                         enabled: false,
                         defaultValue: item.defaultValue || "",
                     },
+                    ...(item.isFilters && {
+                        filters: [{ data: null }],
+                        filterRender: {
+                            name: "FilterInput",
+                        },
+                    }),
                     ...(!item.readOnly &&
                         !columnsItemType && {
                             editRender: {

package/src/components/masterplate/RewriteBillListDetails/BillListPanel.vue

@@ -7,13 +7,14 @@
             style="background: #fff; padding: 14px 16px 14px 16px"
         >
             <div ref="toolbar" style="padding-bottom: 14px">
-                <QueryBar
+                <BillListPanelQueryBar
+                    ref="BillListPanelQueryBarVM"
                     :config="myConfig.queryConfig"
                     :dictData="dictData"
                     :moduleMethod="moduleMethod"
                     @conditionAction="conditionAction"
                     @doAction="doAction"
-                />
+                ></BillListPanelQueryBar>
             </div>
             <Card
                 class="billquerygrid"
@@ -75,18 +76,31 @@
 <script>
 import billquerygrid from "../billquerygrid.vue";
 import BillListPanelTable from "./BillListPanelTable.vue";
+import BillListPanelQueryBar from "./BillListPanelQueryBar.vue";
 
 export default {
     name: "BillListPanel",
     extends: billquerygrid,
-    components: { BillListPanelTable },
+    components: { BillListPanelTable, BillListPanelQueryBar },
     data() {
         return {};
     },
     computed: {},
+    methods: {
+        clearSearchParams() {
+            this.$refs.BillListPanelQueryBarVM.clearSearchParams();
+        },
+    },
     mounted() {
         // console.log("我继承覆写了1111");
     },
+    created() {
+        if (this.myConfig.gridConfig.searchFormList) {
+            this.myConfig.queryConfig.searchFormList = this.$Method.copy(
+                this.myConfig.gridConfig.searchFormList
+            );
+        }
+    },
 };
 </script>
 

package/src/components/masterplate/RewriteBillListDetails/BillListPanelQueryBar.vue

@@ -0,0 +1,274 @@
+<template>
+    <div class="querybar">
+        <Row type="flex" :gutter="0">
+            <Col span="16">
+                <Row type="flex" :gutter="0">
+                    <Col span="6" style="margin-right: 12px">
+                        <ControlBox
+                            ref="field"
+                            :config="fieldConfig"
+                        ></ControlBox>
+                    </Col>
+                    <Col span="6" style="margin-right: 20px">
+                        <ControlBox
+                            v-if="hackReset"
+                            ref="editors"
+                            :config="editorsConfig"
+                        ></ControlBox>
+                    </Col>
+                    <Col style="margin-right: 10px">
+                        <Button
+                            customIcon="iconfont icon-custom-search"
+                            type="primary"
+                            @click="search"
+                            >查询</Button
+                        >
+                    </Col>
+                    <Col>
+                        <Button
+                            customIcon="iconfont icon-custom-reset"
+                            @click="clear"
+                            >重置</Button
+                        >
+                    </Col>
+                    <Col>
+                        <Divider type="vertical" class="dividercommon" />
+                    </Col>
+                    <Col>
+                        <Dropdown
+                            trigger="custom"
+                            :visible="filterSceneFlag"
+                            @on-click="filterAction"
+                            placement="bottom-start"
+                            @on-clickoutside="closeFilterScene"
+                        >
+                            <Badge class-name="badgeclass" :count="sceneNum">
+                                <ButtonGroup>
+                                    <Button
+                                        customIcon="iconfont icon-custom-filter"
+                                        @click="updataFilterScene"
+                                        >高级查询</Button
+                                    >
+                                    <Button
+                                        v-if="!filterSceneFlag && sceneFlag"
+                                        icon="ios-arrow-down"
+                                        @click="openFilterScene"
+                                    >
+                                    </Button>
+                                    <Button
+                                        v-if="filterSceneFlag && sceneFlag"
+                                        icon="ios-arrow-up"
+                                        @click="closeFilterScene"
+                                    >
+                                    </Button>
+                                </ButtonGroup>
+                            </Badge>
+                            <template #list>
+                                <DropdownMenu>
+                                    <DropdownItem
+                                        v-for="(temp, index) in sceneData"
+                                        :selected="
+                                            temp.scenename == selectedScence
+                                        "
+                                        :name="temp.scenename"
+                                        :key="'scene_' + index"
+                                        >{{ temp.scenename }}</DropdownItem
+                                    >
+                                </DropdownMenu>
+                            </template>
+                        </Dropdown>
+                    </Col>
+                </Row>
+            </Col>
+            <Col span="8">
+                <Row type="flex" justify="end" :gutter="0">
+                    <Col style="padding-right: 10px">
+                        <Dropdown
+                            trigger="custom"
+                            :visible="btnFlag"
+                            @on-click="action"
+                            placement="bottom-start"
+                            @on-clickoutside="closeBtn"
+                        >
+                            <ButtonGroup>
+                                <Button
+                                    customIcon="iconfont icon-custom-add"
+                                    v-if="addDataBtnFlag"
+                                    @click="addData"
+                                    >新增</Button
+                                >
+                                <Button
+                                    v-if="!btnFlag && moreBtnFlag"
+                                    icon="ios-arrow-down"
+                                    @click="openBtn"
+                                >
+                                </Button>
+                                <Button
+                                    v-if="btnFlag && moreBtnFlag"
+                                    icon="ios-arrow-up"
+                                    @click="closeBtn"
+                                >
+                                </Button>
+                            </ButtonGroup>
+                            <template #list>
+                                <DropdownMenu>
+                                    <DropdownItem
+                                        v-for="(item, index) in btnData"
+                                        style="padding-left: 0px"
+                                        :key="'btn_' + index"
+                                    >
+                                        <Button
+                                            :icon="item.icon"
+                                            type="text"
+                                            :customIcon="item.customIcon"
+                                            @click="action(item.name)"
+                                            >{{ item.text }}</Button
+                                        >
+                                    </DropdownItem>
+                                </DropdownMenu>
+                            </template>
+                        </Dropdown>
+                    </Col>
+                    <Col>
+                        <PromptMessages style="height: 100%" />
+                    </Col>
+                </Row>
+            </Col>
+        </Row>
+        <!-- 列表快捷查询 -->
+        <FormBox
+            v-if="searchFormListShowType"
+            style="padding-top: 16px"
+            ref="searchFormListVM"
+            :config="searchFormList"
+            :dictData="dictData"
+        />
+        <!-- 列表快捷查询 -->
+        <div v-show="filterFlag" style="margin-top: 20px">
+            <BillConditionsBox
+                ref="filter"
+                @doAction="doAction"
+                @conditionAction="conditionAction"
+                :config="config"
+                :dictData="dictData"
+            />
+        </div>
+    </div>
+</template>
+<script>
+import querybar from "../querybar.vue";
+
+export default {
+    name: "BillListPanelQueryBar",
+    extends: querybar,
+    data() {
+        return {
+            searchFormListShowType: false,
+            searchFormList: {},
+            searchFormItemHashMap: {},
+        };
+    },
+    methods: {
+        /**
+         * 快捷查询参数整理复写
+         */
+        customGetQuerySearchParam() {
+            let searchParam = {};
+            let obj = {};
+            let el = {};
+            el.field = this.$refs.field.getValue();
+            el.editors = this.$refs.editors.getValue();
+            el.calculator = "==";
+            if (el.field && el.editors) {
+                if (this.dataType[el.field].calculator) {
+                    el.calculator = this.dataType[el.field].calculator;
+                }
+                obj = this.getConditionValue(
+                    el.field,
+                    el.editors,
+                    el.calculator,
+                    this.dataType[el.field]
+                );
+            }
+            searchParam = obj;
+            // ==============================================
+            if (this.$refs.searchFormListVM) {
+                const searchFormData = this.$refs.searchFormListVM.getData();
+                this.$utils.objectEach(searchFormData, (value, key) => {
+                    const itemConfig = this.$utils.get(
+                        this.searchFormItemHashMap,
+                        key,
+                        {}
+                    );
+                    const valueStr = this.$utils.toValueString(value);
+                    if (
+                        !this.$utils.isEmpty(itemConfig) &&
+                        !this.$utils.isEmpty(valueStr)
+                    ) {
+                        const fieldKey = this.$utils.get(
+                            itemConfig,
+                            "field",
+                            key
+                        );
+                        const calculator = this.$utils.get(
+                            itemConfig,
+                            "calculator",
+                            "=="
+                        );
+                        const transformObj = this.getConditionValue(
+                            fieldKey,
+                            value,
+                            calculator,
+                            itemConfig
+                        );
+                        searchParam = { ...searchParam, ...transformObj };
+                    }
+                });
+            }
+            // ==============================================
+            return searchParam;
+        },
+        /**
+         * 重置事件复写
+         */
+        clear() {
+            this.customClear();
+            let temp = {};
+            temp.name = "condition_clear";
+            this.$emit("conditionAction", temp);
+            // ==============================================
+            this.clearSearchParams();
+            // ==============================================
+        },
+        clearSearchParams() {
+            if (this.$refs.searchFormListVM) {
+                this.$refs.searchFormListVM.clearData();
+            }
+        },
+    },
+    computed: {},
+    mounted() {},
+    created() {
+        this.searchFormList = this.$utils.get(
+            this.config,
+            "searchFormList",
+            {}
+        );
+        const items = this.$utils.get(this.searchFormList, "items", []);
+        this.searchFormListShowType = items.length > 0;
+        this.searchFormItemHashMap = this.$utils.reduce(
+            items,
+            (previous, item) => {
+                previous[item.name] = {
+                    ...item,
+                    field: this.$utils.get(item, "field", item.name),
+                };
+                return previous;
+            },
+            {}
+        );
+    },
+};
+</script>
+
+<style lang="less" scoped></style>

package/src/components/masterplate/RewriteBillListDetails/index.vue

@@ -138,6 +138,10 @@ export default {
                         let temp = {};
                         let self = this;
                         temp.onOk = () => {
+                            // ==========================================
+                            // 清空自定义列表查询条件
+                            self.$refs.billqureygrid.clearSearchParams();
+                            // ==========================================
                             self.$refs.billqureygrid.refurbish();
                             self.$nextTick(() => {
                                 self.showHead = false;

package/src/components/poptextbox/poptextbox.vue

@@ -436,7 +436,6 @@
                                 if( JSON.stringify(lastParam) === '{}') {
                                     this.query.Config.lastQueryParam = newParam;
                                 }
-
                                 this.searchParam = { ...newParam };
                                 this.$refs['popView'].setSearchBeforeSearchParam(this.searchParam);
                             }
@@ -604,6 +603,13 @@
                     if (this.config.onOpenChange) {
                         this.config.onOpenChange(newValue);
                     }
+                    if(!newValue) {
+                        if(this.searchParam) {
+                            if(!this.searchParam.notfatherclean) {
+                                this.query.Config.lastQueryParam = {}
+                            }
+                        }
+                    }
                 },
                 immediate: true
             }

package/src/index.js

@@ -92,6 +92,7 @@ import MapBox from './components/map';
 import wRichTextBox from './components/wrichtextbox';
 
 import VXETable from "./plugins/vxeTable";
+import XEUtils from "xe-utils";
 
 const components = {
     /*自定义组件*/
@@ -185,6 +186,7 @@ const install = function(app, opts = {}) {
     if (install.installed) return;
 
     VXETable.install(app)
+    app.config.globalProperties.$utils = XEUtils;
 
     iviewCoustom.initEview(ViewUI);
     app.use(ViewUI);

package/src/plugins/vxeTable/index.js

@@ -3,7 +3,7 @@ import "vxe-table/lib/style.css";
 import "../theme/theme-variable.css";
 
 // ========== 全局renderer引入位置 ==========
-// import './renderer/filter'
+import "./renderer/filter";
 // import './renderer/edit'
 // import './renderer/cell'
 // ========== 全局renderer引入位置 ==========

package/src/plugins/vxeTable/renderer/components/TableFilterInput.vue

@@ -0,0 +1,51 @@
+<template>
+    <div class="filter-input">
+        <i-input
+            v-model="option.data"
+            @on-change="onChange"
+            @on-enter="onPressEnter"
+            clearable
+            placeholder="请输入搜索词"
+        ></i-input>
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted, defineProps } from "vue";
+
+/**
+ * props参数
+ *
+ * params   渲染器传递的scope参数
+ * option   更新数据模型
+ * onChange 更新选项触发事件
+ * onPressEnter 确认筛选触发事件
+ */
+const props = defineProps({
+    params: {
+        params: Object,
+        default: function () {
+            return {};
+        },
+    },
+});
+const option = ref({ data: null });
+onMounted(() => {
+    option.value = props.params.column.filters[0];
+});
+const onChange = () => {
+    const { $panel } = props.params;
+    const checked = !!option.value.data;
+    $panel.changeOption(null, checked, option.value);
+};
+const onPressEnter = () => {
+    const { $panel } = props.params;
+    $panel.confirmFilter();
+};
+</script>
+
+<style lang="less" scoped>
+.filter-input {
+    padding: 5px;
+}
+</style>

package/src/plugins/vxeTable/renderer/filter.js

@@ -0,0 +1,32 @@
+import VXETable from "vxe-table";
+import { h } from "vue";
+import TableFilterInput from "./components/TableFilterInput.vue";
+
+// 创建一个简单的输入框筛选
+VXETable.renderer.add("FilterInput", {
+    // 筛选模板
+    renderFilter(renderOpts, params) {
+        return h(TableFilterInput, { params });
+    },
+    // 重置数据方法
+    filterResetMethod(params) {
+        const { options } = params;
+        options.forEach((option) => {
+            option.data = "";
+        });
+    },
+    // 重置筛选复原方法（当未点击确认时，该选项将被恢复为默认值）
+    filterRecoverMethod({ option }) {
+        option.data = "";
+    },
+    // 筛选方法
+    filterMethod(params) {
+        const { option, row, column } = params;
+        const { data } = option;
+        const cellValue = row[column.field];
+        if (cellValue) {
+            return cellValue.indexOf(data) > -1;
+        }
+        return false;
+    },
+});