ocpview-plus 1.3.15 → 1.3.17

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

@@ -1,346 +1,346 @@
-<template>
-    <div>
-        <div ref="head">
-            <Row v-if="showCondition">
-                <Col span="24">
-                    <ConditionBox
-                        ref="condition"
-                        :config="myConfig"
-                        @conditionAction="conditionAction"
-                        :dictData="dictData"
-                        :isPop="isPop"
-                    ></ConditionBox>
-                </Col>
-            </Row>
-        </div>
-        <template v-if="!myConfig.multiSelectGrid">
-            <Card :padding="0" :bordered="false" dis-hover>
-                <!-- 表格覆写点开始 -->
-                <vxe-grid
-                    ref="table"
-                    border="full"
-                    :columns="RewriteColumns"
-                    :data="RewriteData"
-                    :height="tableHeight"
-                    :max-height="tableMaxHeight"
-                    :loading="loading"
-                    :sort-config="{ remote: true, trigger: 'cell' }"
-                    :seq-config="seqConfig"
-                    @sort-change="RewriteTableOnSortChange"
-                    @cell-dblclick="RewriteTableCellDBlclick"
-                >
-                    <template #loading>
-                        <Spin size="large" style="display: inline-block"></Spin>
-                    </template>
-                </vxe-grid>
-                <!-- 表格覆写点结束 -->
-            </Card>
-            <div ref="page" name="page">
-                <div v-if="myConfig.showPage" style="padding-top: 10px">
-                    <Card
-                        :bordered="false"
-                        :padding="0"
-                        :dis-hover="true"
-                        style="border-radius: 0px"
-                    >
-                        <Row
-                            type="flex"
-                            justify="end"
-                            style="padding-right: 10px"
-                        >
-                            <PageCustom
-                                v-model="culPage"
-                                :total="myConfig.pageConfig.total_results"
-                                :size="myConfig.pageSize"
-                                :current="myConfig.pageConfig.page_no"
-                                :page-size="myConfig.pageConfig.page_size"
-                                :page-size-opts="
-                                    myConfig.pageConfig.pageSizeList
-                                "
-                                @on-page-size-change="changePageSize"
-                                @on-change="changePage"
-                                :show-total="myConfig.pageShowTotal"
-                                :show-elevator="myConfig.pageShowElevator"
-                                :show-sizer="myConfig.pageShowSizer"
-                            ></PageCustom>
-                        </Row>
-                    </Card>
-                </div>
-            </div>
-        </template>
-        <template v-else>
-            <Row type="flex" justify="center" align="middle">
-                <Col :span="gridCol">
-                    <Card :padding="0" bordered dis-hover>
-                        <template #title>
-                            <span v-text="myConfig.gridTitle"></span>
-                        </template>
-                        <Table
-                            ref="table"
-                            :row-class-name="myConfig.rowClassName"
-                            :show-summary="myConfig.showSummary"
-                            :summary-method="handleSummary"
-                            :loading="loading"
-                            :size="myConfig.tableSize"
-                            :stripe="myConfig.showStripe"
-                            :border="myConfig.showBorder"
-                            :height="tableHeight"
-                            :max-height="tableMaxHeight"
-                            :show-header="myConfig.showHeader"
-                            :columns="tableColumns"
-                            :data="tempData"
-                            @on-sort-change="sortChagne"
-                            @on-current-change="onCurrentChange"
-                            :highlight-row="myConfig.highLightRow"
-                            @on-row-dblclick="dbclick"
-                            @on-select="onSelect"
-                            @on-select-cancel="onSelectCancel"
-                            @on-selection-change="OnSelectionChange"
-                            @on-row-click="click"
-                            @on-column-width-resize="onColumnWidthResize"
-                        >
-                            <template
-                                v-for="config in soltTableColumns"
-                                v-slot:[config.key]="{ row, index }"
-                                :key="'show_' + config.key"
-                            >
-                                <ShowText
-                                    :label="formatValue(index, config, row)"
-                                    :contentAlign="config.contentAlign"
-                                    :class="config.cellClassName"
-                                    :config="config"
-                                    :rowIndex="index"
-                                ></ShowText>
-                            </template>
-                        </Table>
-                    </Card>
-                    <div ref="page" name="page">
-                        <div
-                            v-if="myConfig.showPage"
-                            ref="page"
-                            style="padding-top: 10px"
-                        >
-                            <Card
-                                :bordered="false"
-                                :padding="0"
-                                :dis-hover="true"
-                                style="border-radius: 0px"
-                            >
-                                <Row
-                                    type="flex"
-                                    justify="end"
-                                    style="padding-right: 10px"
-                                    :gutter="0"
-                                >
-                                    <PageCustom
-                                        v-model="culPage"
-                                        :total="
-                                            myConfig.pageConfig.total_results
-                                        "
-                                        :size="myConfig.pageSize"
-                                        :current="myConfig.pageConfig.page_no"
-                                        :page-size="
-                                            myConfig.pageConfig.page_size
-                                        "
-                                        :page-size-opts="
-                                            myConfig.pageConfig.pageSizeList
-                                        "
-                                        @on-page-size-change="changePageSize"
-                                        @on-change="changePage"
-                                        :show-total="myConfig.pageShowTotal"
-                                        :show-elevator="
-                                            myConfig.pageShowElevator
-                                        "
-                                        :show-sizer="myConfig.pageShowSizer"
-                                    ></PageCustom>
-                                </Row>
-                            </Card>
-                        </div>
-                    </div>
-                </Col>
-                <Col span="2">
-                    <Row
-                        type="flex"
-                        justify="center"
-                        align="middle"
-                        style="padding: 5px"
-                    >
-                        <Tooltip content="删除" placement="left">
-                            <Button
-                                type="primary"
-                                size="small"
-                                icon="ios-arrow-back"
-                                :disabled="!rightActive"
-                                @click="moveToLeft"
-                            ></Button>
-                        </Tooltip>
-                    </Row>
-                    <Row
-                        type="flex"
-                        justify="center"
-                        align="middle"
-                        style="padding: 5px"
-                    >
-                        <Tooltip content="添加" placement="right">
-                            <Button
-                                type="primary"
-                                size="small"
-                                icon="ios-arrow-forward"
-                                :disabled="!leftActive"
-                                @click="moveToRight"
-                            ></Button>
-                        </Tooltip>
-                    </Row>
-                </Col>
-                <Col :span="multiGridCol" style="padding-bottom: 40px">
-                    <Card :padding="0" bordered dis-hover>
-                        <template #title>
-                            <span v-text="myConfig.multiGridTitle"></span>
-                        </template>
-                        <Table
-                            ref="multiSelectTable"
-                            :row-class-name="myConfig.rowClassName"
-                            :size="myConfig.tableSize"
-                            :stripe="myConfig.showStripe"
-                            :border="myConfig.showBorder"
-                            :height="tableHeight"
-                            :max-height="tableMaxHeight"
-                            :show-header="myConfig.showHeader"
-                            :columns="multiTableColumns"
-                            :data="tempMultiSelectData"
-                            :highlight-row="myConfig.highLightRow"
-                            @on-selection-change="OnMultiSelectionChange"
-                        >
-                            <template
-                                v-for="config in multiSoltTableColumns"
-                                v-slot:[config.key]="{ row, index }"
-                                :key="'mshow_' + config.key"
-                            >
-                                <ShowText
-                                    :label="formatMulValue(index, config, row)"
-                                    :contentAlign="config.contentAlign"
-                                ></ShowText>
-                            </template>
-                        </Table>
-                    </Card>
-                </Col>
-            </Row>
-        </template>
-    </div>
-</template>
-<script>
-import simpleviewgrid from "../simpleviewgrid.vue";
-
-export default {
-    name: "BillListPanelTable",
-    extends: simpleviewgrid,
-    data() {
-        return {};
-    },
-    computed: {
-        /**
-         * 表格列定义清洗
-         */
-        RewriteColumns() {
-            return this.tableColumns.map((item) => {
-                const columnsItemType = this.getColumnsItemType(item.key);
-                return {
-                    ...(item.title && {
-                        title: item.title,
-                    }),
-                    ...(item.name && {
-                        field: item.name,
-                    }),
-                    ...(item.width && {
-                        width: item.width < 60 ? 60 : item.width,
-                    }),
-                    ...(item.minWidth && {
-                        minWidth: item.minWidth < 60 ? 60 : item.minWidth,
-                    }),
-                    ...(item.align && {
-                        align: item.align,
-                    }),
-                    ...(item.resizable && {
-                        resizable: item.resizable,
-                    }),
-                    sortable: true,
-                    ...(columnsItemType && {
-                        type: columnsItemType,
-                        sortable: false,
-                    }),
-                    // showOverflow: "tooltip",
-                    formatter: (params) => {
-                        const { row, cellValue } = params;
-                        const valueFormat = this.$Method.formatValue(
-                            cellValue,
-                            row,
-                            item
-                        );
-                        return valueFormat;
-                    },
-                };
-            });
-        },
-        /**
-         * 表格数据
-         */
-        RewriteData() {
-            return this.tempData.map((item) => {
-                return {
-                    ...item,
-                };
-            });
-        },
-
-        /**
-         * 表格分页行号起始值
-         */
-        seqConfig() {
-            return {
-                startIndex:
-                    (this.myConfig.pageConfig.page_no - 1) *
-                    this.myConfig.pageConfig.page_size,
-            };
-        },
-    },
-    methods: {
-        /**
-         * 【覆写】获取多选数据事件
-         */
-        getSelection() {
-            const selectDataList = this.$refs.table.getCheckboxRecords(true);
-            return [...selectDataList];
-        },
-        /**
-         * 表格列 type 类型转义
-         */
-        getColumnsItemType(key) {
-            const columnsItemType = {
-                selection: "checkbox",
-                index: "seq",
-            };
-            return this.$utils.get(columnsItemType, key, null);
-        },
-        /**
-         * 表格排序事件
-         */
-        RewriteTableOnSortChange(params) {
-            const { order, field } = params;
-            const orderType = order ? order : "normal";
-            this.sortChagne({ order: orderType, key: field });
-        },
-        /**
-         * 表格双击事件
-         */
-        RewriteTableCellDBlclick(params) {
-            const { row } = params;
-            this.dbclick(row);
-        },
-    },
-    mounted() {
-        // console.log("我继承覆写了22222", this.myConfig);
-    },
-};
-</script>
-
-<style lang="scss" scoped></style>
+<template>
+    <div>
+        <div ref="head">
+            <Row v-if="showCondition">
+                <Col span="24">
+                    <ConditionBox
+                        ref="condition"
+                        :config="myConfig"
+                        @conditionAction="conditionAction"
+                        :dictData="dictData"
+                        :isPop="isPop"
+                    ></ConditionBox>
+                </Col>
+            </Row>
+        </div>
+        <template v-if="!myConfig.multiSelectGrid">
+            <Card :padding="0" :bordered="false" dis-hover>
+                <!-- 表格覆写点开始 -->
+                <vxe-grid
+                    ref="table"
+                    border="full"
+                    :columns="RewriteColumns"
+                    :data="RewriteData"
+                    :height="tableHeight"
+                    :max-height="tableMaxHeight"
+                    :loading="loading"
+                    :sort-config="{ remote: true, trigger: 'cell' }"
+                    :seq-config="seqConfig"
+                    @sort-change="RewriteTableOnSortChange"
+                    @cell-dblclick="RewriteTableCellDBlclick"
+                >
+                    <template #loading>
+                        <Spin size="large" style="display: inline-block"></Spin>
+                    </template>
+                </vxe-grid>
+                <!-- 表格覆写点结束 -->
+            </Card>
+            <div ref="page" name="page">
+                <div v-if="myConfig.showPage" style="padding-top: 10px">
+                    <Card
+                        :bordered="false"
+                        :padding="0"
+                        :dis-hover="true"
+                        style="border-radius: 0px"
+                    >
+                        <Row
+                            type="flex"
+                            justify="end"
+                            style="padding-right: 10px"
+                        >
+                            <PageCustom
+                                v-model="culPage"
+                                :total="myConfig.pageConfig.total_results"
+                                :size="myConfig.pageSize"
+                                :current="myConfig.pageConfig.page_no"
+                                :page-size="myConfig.pageConfig.page_size"
+                                :page-size-opts="
+                                    myConfig.pageConfig.pageSizeList
+                                "
+                                @on-page-size-change="changePageSize"
+                                @on-change="changePage"
+                                :show-total="myConfig.pageShowTotal"
+                                :show-elevator="myConfig.pageShowElevator"
+                                :show-sizer="myConfig.pageShowSizer"
+                            ></PageCustom>
+                        </Row>
+                    </Card>
+                </div>
+            </div>
+        </template>
+        <template v-else>
+            <Row type="flex" justify="center" align="middle">
+                <Col :span="gridCol">
+                    <Card :padding="0" bordered dis-hover>
+                        <template #title>
+                            <span v-text="myConfig.gridTitle"></span>
+                        </template>
+                        <Table
+                            ref="table"
+                            :row-class-name="myConfig.rowClassName"
+                            :show-summary="myConfig.showSummary"
+                            :summary-method="handleSummary"
+                            :loading="loading"
+                            :size="myConfig.tableSize"
+                            :stripe="myConfig.showStripe"
+                            :border="myConfig.showBorder"
+                            :height="tableHeight"
+                            :max-height="tableMaxHeight"
+                            :show-header="myConfig.showHeader"
+                            :columns="tableColumns"
+                            :data="tempData"
+                            @on-sort-change="sortChagne"
+                            @on-current-change="onCurrentChange"
+                            :highlight-row="myConfig.highLightRow"
+                            @on-row-dblclick="dbclick"
+                            @on-select="onSelect"
+                            @on-select-cancel="onSelectCancel"
+                            @on-selection-change="OnSelectionChange"
+                            @on-row-click="click"
+                            @on-column-width-resize="onColumnWidthResize"
+                        >
+                            <template
+                                v-for="config in soltTableColumns"
+                                v-slot:[config.key]="{ row, index }"
+                                :key="'show_' + config.key"
+                            >
+                                <ShowText
+                                    :label="formatValue(index, config, row)"
+                                    :contentAlign="config.contentAlign"
+                                    :class="config.cellClassName"
+                                    :config="config"
+                                    :rowIndex="index"
+                                ></ShowText>
+                            </template>
+                        </Table>
+                    </Card>
+                    <div ref="page" name="page">
+                        <div
+                            v-if="myConfig.showPage"
+                            ref="page"
+                            style="padding-top: 10px"
+                        >
+                            <Card
+                                :bordered="false"
+                                :padding="0"
+                                :dis-hover="true"
+                                style="border-radius: 0px"
+                            >
+                                <Row
+                                    type="flex"
+                                    justify="end"
+                                    style="padding-right: 10px"
+                                    :gutter="0"
+                                >
+                                    <PageCustom
+                                        v-model="culPage"
+                                        :total="
+                                            myConfig.pageConfig.total_results
+                                        "
+                                        :size="myConfig.pageSize"
+                                        :current="myConfig.pageConfig.page_no"
+                                        :page-size="
+                                            myConfig.pageConfig.page_size
+                                        "
+                                        :page-size-opts="
+                                            myConfig.pageConfig.pageSizeList
+                                        "
+                                        @on-page-size-change="changePageSize"
+                                        @on-change="changePage"
+                                        :show-total="myConfig.pageShowTotal"
+                                        :show-elevator="
+                                            myConfig.pageShowElevator
+                                        "
+                                        :show-sizer="myConfig.pageShowSizer"
+                                    ></PageCustom>
+                                </Row>
+                            </Card>
+                        </div>
+                    </div>
+                </Col>
+                <Col span="2">
+                    <Row
+                        type="flex"
+                        justify="center"
+                        align="middle"
+                        style="padding: 5px"
+                    >
+                        <Tooltip content="删除" placement="left">
+                            <Button
+                                type="primary"
+                                size="small"
+                                icon="ios-arrow-back"
+                                :disabled="!rightActive"
+                                @click="moveToLeft"
+                            ></Button>
+                        </Tooltip>
+                    </Row>
+                    <Row
+                        type="flex"
+                        justify="center"
+                        align="middle"
+                        style="padding: 5px"
+                    >
+                        <Tooltip content="添加" placement="right">
+                            <Button
+                                type="primary"
+                                size="small"
+                                icon="ios-arrow-forward"
+                                :disabled="!leftActive"
+                                @click="moveToRight"
+                            ></Button>
+                        </Tooltip>
+                    </Row>
+                </Col>
+                <Col :span="multiGridCol" style="padding-bottom: 40px">
+                    <Card :padding="0" bordered dis-hover>
+                        <template #title>
+                            <span v-text="myConfig.multiGridTitle"></span>
+                        </template>
+                        <Table
+                            ref="multiSelectTable"
+                            :row-class-name="myConfig.rowClassName"
+                            :size="myConfig.tableSize"
+                            :stripe="myConfig.showStripe"
+                            :border="myConfig.showBorder"
+                            :height="tableHeight"
+                            :max-height="tableMaxHeight"
+                            :show-header="myConfig.showHeader"
+                            :columns="multiTableColumns"
+                            :data="tempMultiSelectData"
+                            :highlight-row="myConfig.highLightRow"
+                            @on-selection-change="OnMultiSelectionChange"
+                        >
+                            <template
+                                v-for="config in multiSoltTableColumns"
+                                v-slot:[config.key]="{ row, index }"
+                                :key="'mshow_' + config.key"
+                            >
+                                <ShowText
+                                    :label="formatMulValue(index, config, row)"
+                                    :contentAlign="config.contentAlign"
+                                ></ShowText>
+                            </template>
+                        </Table>
+                    </Card>
+                </Col>
+            </Row>
+        </template>
+    </div>
+</template>
+<script>
+import simpleviewgrid from "../simpleviewgrid.vue";
+
+export default {
+    name: "BillListPanelTable",
+    extends: simpleviewgrid,
+    data() {
+        return {};
+    },
+    computed: {
+        /**
+         * 表格列定义清洗
+         */
+        RewriteColumns() {
+            return this.tableColumns.map((item) => {
+                const columnsItemType = this.getColumnsItemType(item.key);
+                return {
+                    ...(item.title && {
+                        title: item.title,
+                    }),
+                    ...(item.name && {
+                        field: item.name,
+                    }),
+                    ...(item.width && {
+                        width: item.width < 60 ? 60 : item.width,
+                    }),
+                    ...(item.minWidth && {
+                        minWidth: item.minWidth < 60 ? 60 : item.minWidth,
+                    }),
+                    ...(item.align && {
+                        align: item.align,
+                    }),
+                    ...(item.resizable && {
+                        resizable: item.resizable,
+                    }),
+                    sortable: true,
+                    ...(columnsItemType && {
+                        type: columnsItemType,
+                        sortable: false,
+                    }),
+                    // showOverflow: "tooltip",
+                    formatter: (params) => {
+                        const { row, cellValue } = params;
+                        const valueFormat = this.$Method.formatValue(
+                            cellValue,
+                            row,
+                            item
+                        );
+                        return valueFormat;
+                    },
+                };
+            });
+        },
+        /**
+         * 表格数据
+         */
+        RewriteData() {
+            return this.tempData.map((item) => {
+                return {
+                    ...item,
+                };
+            });
+        },
+
+        /**
+         * 表格分页行号起始值
+         */
+        seqConfig() {
+            return {
+                startIndex:
+                    (this.myConfig.pageConfig.page_no - 1) *
+                    this.myConfig.pageConfig.page_size,
+            };
+        },
+    },
+    methods: {
+        /**
+         * 【覆写】获取多选数据事件
+         */
+        getSelection() {
+            const selectDataList = this.$refs.table.getCheckboxRecords(true);
+            return [...selectDataList];
+        },
+        /**
+         * 表格列 type 类型转义
+         */
+        getColumnsItemType(key) {
+            const columnsItemType = {
+                selection: "checkbox",
+                index: "seq",
+            };
+            return this.$utils.get(columnsItemType, key, null);
+        },
+        /**
+         * 表格排序事件
+         */
+        RewriteTableOnSortChange(params) {
+            const { order, field } = params;
+            const orderType = order ? order : "normal";
+            this.sortChagne({ order: orderType, key: field });
+        },
+        /**
+         * 表格双击事件
+         */
+        RewriteTableCellDBlclick(params) {
+            const { row } = params;
+            this.dbclick(row);
+        },
+    },
+    mounted() {
+        // console.log("我继承覆写了22222", this.myConfig);
+    },
+};
+</script>
+
+<style lang="scss" scoped></style>