ocpview-plus 1.0.3 → 1.0.5

package/package.json

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

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

@@ -49,10 +49,10 @@
             </div>
         </template>
         <div :style="divStyle">
-            <div v-if="$slots.header">
+            <!-- <div v-if="$slots.header">
                 <slot name="header"></slot>
-            </div>
-            <Row
+            </div> -->
+            <!-- <Row
                 v-else
                 v-show="showGrid"
                 type="flex"
@@ -84,7 +84,7 @@
                         >删除</Button
                     >
                 </Col>
-            </Row>
+            </Row> -->
             <Row v-show="showGrid" style="width: 100%">
                 <!-- 编辑表格 覆写开始 -->
                 <vxe-grid
@@ -107,22 +107,55 @@
                     :show-footer="showFooter"
                     :footer-method="footerMethod"
                     :footer-cell-class-name="footerCellClassName"
+                    :toolbar-config="toolbarConfig"
+                    :keyboard-config="VG_keyboardConfig"
+                    :mouse-config="VG_mouseConfig"
                     @sort-change="RewriteTableOnSortChange"
                     @cell-dblclick="RewriteTableCellDBlclick"
+                    @edit-activated="VG_editActivated"
+                    @keydown="VG_keydown"
                 >
-                    <template #columnEdit="{ row, rowIndex, columnIndex }">
-                        <!-- <ControlBox
-                            v-if="editIndex === index && editKey === config.key"
-                            :ref="'cell_' + index + '_' + config.key"
-                            :autofocus="true"
-                            :config="getCellConfig(index, config)"
-                            :valueData="getCurRow(index)"
-                            @inputValue="input"
-                            :editIndex="index"
-                            @doAction="doAction"
-                        ></ControlBox> -->
+                    <!-- 操作面板插槽 -->
+                    <template #toolbar_buttons>
+                        <Row
+                            v-show="showGrid"
+                            type="flex"
+                            justify="start"
+                            align="middle"
+                            :gutter="0"
+                        >
+                            <Col v-if="showAddBtn">
+                                <Button
+                                    :style="btnStyle"
+                                    customIcon="iconfont icon-custom-rowadd3"
+                                    type="text"
+                                    :disabled="myConfig.readOnly"
+                                    @click="handleAddRow"
+                                    >添加</Button
+                                >
+                            </Col>
+                            <Col v-if="showAddBtn && showDelBatchBtn">
+                                <Divider
+                                    type="vertical"
+                                    style="margin: 0 6px 0 6px"
+                                />
+                            </Col>
+                            <Col v-if="showDelBatchBtn">
+                                <Button
+                                    :style="btnStyle"
+                                    customIcon="iconfont icon-custom-rowdel3"
+                                    type="text"
+                                    :disabled="myConfig.readOnly"
+                                    @click="delBatchRow"
+                                    >删除</Button
+                                >
+                            </Col>
+                        </Row>
+                    </template>
 
-                        <ControlBox
+                    <!-- 编辑列插槽 -->
+                    <template #columnEdit="{ row, rowIndex, columnIndex }">
+                        <BillInfoPanelEditTableControlbox
                             :autofocus="true"
                             :config="getTableColumnConfig(columnIndex)"
                             :valueData="row"
@@ -133,19 +166,9 @@
                                 }
                             "
                             @doAction="doAction"
-                        ></ControlBox>
-                        <!-- <p>asdf</p> -->
-                        <!-- <vxe-input type="text"></vxe-input> -->
+                        ></BillInfoPanelEditTableControlbox>
                     </template>
                 </vxe-grid>
-                <!-- <Table ref="table"  :row-class-name="rowClassName" :loading="loading" :size="myConfig.tableSize"  :stripe="myConfig.showStripe"  :border="myConfig.showBorder" :height="tableHeight" :maxHeight="tableMaxHeight" :show-header="myConfig.showHeader" @on-selection-change="OnSelectionChange" :columns="tableColumns"  :data="data" @on-column-width-resize="onColumnWidthResize" @on-row-click="rowClick" :show-summary="myConfig.showSummary"  :summary-method="handleSummary">
-                        <template  v-for="config in soltTableColumns" v-slot:[config.key]="{ index }" :key="'show_' + config.key">
-                            <div @click="EditCell(index,config)" :class="config.cellClassName">
-                                <ControlBox v-if="editIndex === index && editKey=== config.key"  :ref="'cell_'+ index + '_' + config.key"  :autofocus="true" :config="getCellConfig(index,config)"  :valueData="getCurRow(index)" @inputValue="input" :editIndex="index" @doAction="doAction"></ControlBox>
-                                <ShowText v-else  :label="formatValue(index,config)"  :contentAlign="config.contentAlign"  :class="IsCellError(index,config)" :config="config" :rowIndex="index"></ShowText>
-                            </div>
-                        </template>
-                    </Table> -->
                 <!-- 编辑表格 覆写结束 -->
                 <div
                     ref="page"
@@ -253,10 +276,14 @@
 </template>
 <script>
 import editgridcard from "../editgridcard.vue";
+import BillInfoPanelEditTableControlbox from "./BillInfoPanelEditTableControlbox.vue";
+import useVxeGridEditTypeKeydownEventHook from "./mixins/useVxeGridEditTypeKeydownEventHook.js";
 
 export default {
     name: "BillInfoPanelEditTable",
     extends: editgridcard,
+    components: { BillInfoPanelEditTableControlbox },
+    mixins: [useVxeGridEditTypeKeydownEventHook],
     data() {
         return {
             editType: false,
@@ -265,12 +292,13 @@ export default {
                 mode: "cell",
                 autoClear: false,
                 beforeEditMethod: ({ column }) => {
-                    // console.log("🚀 ~ data ~ column:", column);
                     if (this.editType) {
                         return false;
                     }
                     if (this.myConfig.cellbeginedit) {
-                        return this.myConfig.cellbeginedit({ column });
+                        return this.myConfig.cellbeginedit({
+                            column: { ...column, name: column.property },
+                        });
                     }
                     return true;
                 },
@@ -323,13 +351,24 @@ export default {
                         enabled: false,
                         defaultValue: item.defaultValue || "",
                     },
-                    ...(!item.readOnly && {
-                        editRender: {
-                            enabled: true,
-                            defaultValue: item.defaultValue || "",
-                        },
-                        slots: { edit: "columnEdit" },
-                    }),
+                    ...(!item.readOnly &&
+                        !columnsItemType && {
+                            editRender: {
+                                enabled: true,
+                                autoselect: this.$utils.get(
+                                    item,
+                                    "autoselect",
+                                    false
+                                ),
+                                autofocus: this.$utils.get(
+                                    item,
+                                    "autofocus",
+                                    ""
+                                ),
+                                defaultValue: item.defaultValue || "",
+                            },
+                            slots: { edit: "columnEdit" },
+                        }),
                 };
             });
             // console.log("newColumns:", newColumns);
@@ -370,16 +409,37 @@ export default {
                 .filter((item) => item.summary)
                 .map((item) => item.name);
         },
+        toolbarConfig() {
+            // console.log("this.myConfig", this.myConfig);
+            return {
+                zoom: this.myConfig.zoom,
+                slots: {
+                    // 自定义插槽模板
+                    buttons: "toolbar_buttons",
+                },
+            };
+        },
     },
     methods: {
         // ==================================================================
 
+        /**
+         * 【覆写】编辑项触发回车事件
+         */
+        enterKeyDown() {
+            const $table = this.$refs.table;
+            this.VG_keyCode13Event($table);
+        },
+
         /**
          * 【覆写】手工触发编辑事件
          */
         valueChanged(obj) {
             const $tableVM = this.$refs.table;
-            const editRecord = $tableVM.getEditRecord();
+            let editRecord = $tableVM.getEditRecord();
+            if (!editRecord) {
+                editRecord = this.VG_currentEditRecord;
+            }
             const params = { ...obj, rowinfo: editRecord };
             const column = this.findColumnConfig(obj.name, this.myConfig.items);
             const valueChangedSucc = column.valueChanged(params);
@@ -497,26 +557,39 @@ export default {
          */
         async handleAddRow() {
             const $tableVM = this.$refs.table;
-            let row = null;
+            let rowData = null;
             if (this.myConfig.addRowBefore) {
                 let temp = {};
                 temp.name = this.myConfig.name;
                 temp.grid = $tableVM;
-                row = this.myConfig.addRowBefore(temp);
-                if (row === false) {
+                rowData = this.myConfig.addRowBefore(temp);
+                if (rowData === false) {
                     return;
                 }
             }
-            if (!row || row === true) {
-                row = {};
+            if (!rowData || rowData === true) {
+                rowData = {};
             }
-
             const errMap = await $tableVM.validate(true);
             if (errMap) {
                 return false;
             }
-
-            const { row: newRow } = await $tableVM.insertAt(row, -1);
+            const { row: newRow } = await $tableVM.insertAt(rowData, -1);
+            // 后续完善
+            const tableColumns = $tableVM.getTableColumn();
+            const visibleColumns = this.$utils.get(
+                tableColumns,
+                "visibleColumn",
+                []
+            );
+            const column = this.$utils.find(visibleColumns, (column) => {
+                return (
+                    column &&
+                    column.editRender &&
+                    column.editRender.enabled !== false
+                );
+            });
+            await $tableVM.setEditRow(newRow, false);
         },
 
         /**
@@ -619,6 +692,10 @@ export default {
         },
 
         getTableColumnConfig(index) {
+            let column = this.tableColumns[index];
+            if (column.type === "NumberBox") {
+                column.place = "unset";
+            }
             return this.tableColumns[index];
         },
 
@@ -685,6 +762,11 @@ export default {
             const { row } = params;
             this.dbclick(row);
         },
+
+        handleZoom() {
+            const $tableVM = this.$refs.table;
+            $tableVM.zoom();
+        },
     },
     mounted() {
         // console.log("我继承覆写了999999");

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

@@ -0,0 +1,126 @@
+<template>
+    <div v-if="hackReset" @keydown.enter="keyDown('enter')">
+        <template v-if="type === 'Divider'">
+            <Divider
+                :orientation="config.orientation"
+                :dashed="config.dashed"
+                :type="config.vtype"
+                :id="config.id"
+                :style="config.style"
+            >
+                <template v-if="!!config.label || !!config.hide" #default>
+                    <span v-if="!!config.label" v-text="config.label"> </span>
+                    <div v-if="!!config.hide">
+                        <p
+                            v-if="hideFlag"
+                            @click.stop="hide"
+                            class="efuture-hide-text"
+                        >
+                            <Icon type="ios-arrow-up" />
+                            <span> 收起查询条件 </span>
+                        </p>
+                        <p v-else @click.stop="hide" class="efuture-hide-text">
+                            <Icon type="ios-arrow-down" />
+                            <span>展开查询条件</span>
+                        </p>
+                    </div>
+                </template>
+            </Divider>
+        </template>
+        <template v-else-if="type === 'NumberRangeBox'">
+            <NumberRangeBox
+                ref="myControl"
+                :fatherSvalue="svalue"
+                :fatherEvalue="evalue"
+                @inputValue="input"
+                :config="config"
+            ></NumberRangeBox>
+        </template>
+        <template v-else-if="type === 'DateRangeBox'">
+            <DateRangeBox
+                ref="myControl"
+                :fatherSvalue="svalue"
+                :fatherEvalue="evalue"
+                @inputValue="input"
+                :config="config"
+            ></DateRangeBox>
+        </template>
+        <template v-else-if="type === 'PopTextBox'">
+            <PopTextBox
+                ref="myControl"
+                :fatherValue="value"
+                :fatherText="text"
+                @inputValue="input"
+                :config="config"
+            ></PopTextBox>
+        </template>
+        <template v-else-if="type === 'PictureBox'">
+            <PictureBox
+                ref="myControl"
+                v-if="config.multiSelect !== true"
+                :fatherValue="value"
+                @inputValue="input"
+                :config="config"
+                :readOnly="readOnly"
+                :showStyle="config.showStyle"
+            ></PictureBox>
+            <PictureBox
+                ref="myControl"
+                v-else
+                :config="config"
+                :readOnly="readOnly"
+                :showStyle="config.showStyle"
+            ></PictureBox>
+        </template>
+        <template v-else-if="type === 'VideoBox'">
+            <VideoBox
+                ref="myControl"
+                v-if="config.multiSelect !== true"
+                :fatherValue="value"
+                @inputValue="input"
+                :config="config"
+                :readOnly="readOnly"
+                :showStyle="config.showStyle"
+            ></VideoBox>
+            <VideoBox
+                ref="myControl"
+                v-else
+                :config="config"
+                :readOnly="readOnly"
+                :showStyle="config.showStyle"
+            ></VideoBox>
+        </template>
+        <template v-else-if="type === 'NumberBox'">
+            <BillInfoPanelEditTableControlboxNumberbox
+                ref="myControl"
+                :fatherValue="value"
+                :readOnly="readOnly"
+                @inputValue="input"
+                :config="config"
+            ></BillInfoPanelEditTableControlboxNumberbox>
+        </template>
+        <template v-else>
+            <component
+                :is="type"
+                ref="myControl"
+                :fatherValue="value"
+                :readOnly="readOnly"
+                @inputValue="input"
+                :config="config"
+            />
+        </template>
+    </div>
+</template>
+
+<script>
+import controlbox from "../../base/controlbox.vue";
+import BillInfoPanelEditTableControlboxNumberbox from "./BillInfoPanelEditTableControlboxNumberbox.vue";
+export default {
+    name: "BillInfoPanelEditTableControlbox",
+    extends: controlbox,
+    components: { BillInfoPanelEditTableControlboxNumberbox },
+    mounted() {
+        // console.log("我继承覆写了999999");
+    },
+};
+</script>

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

@@ -0,0 +1,21 @@
+<script>
+import numberbox from "../../numberbox/numberbox.vue";
+export default {
+    name: "BillInfoPanelEditTableControlboxNumberbox",
+    extends: numberbox,
+    methods: {
+        init() {
+            // 获取默认属性
+            this.myConfig = Object.assign({}, this.globalConfig, this.myConfig);
+
+            // 获取动态属性
+            if (this.config) {
+                this.myConfig = Object.assign({}, this.myConfig, this.config);
+            }
+        },
+    },
+    mounted() {
+        // console.log("我继承覆写了999999");
+    },
+};
+</script>