bri-components 1.2.50 → 1.2.52

package/src/abolish/DshFlatTable.less

@@ -1,93 +0,0 @@
-.DshFlatTable {
-    width: 100%;
-    position: relative;
-
-    &-block {
-        width: 100%;
-        overflow: auto;
-
-        .table {
-            width: 100%;
-            border-spacing: 0;
-            border-collapse: collapse;
-            border-color: #E5E5E5;
-            background-color: #fff;
-
-            &-head {
-                background-color: #f0f0f0;
-                color: #666;
-
-                &-description {
-                    color: #828499;
-                }
-            }
-
-            &-row {
-                height: 50px;
-
-                &:hover {
-                    .table-row-td-add {
-                        display: inline-block;
-                    }
-                }
-
-                &-td {
-                    position: relative;
-
-                    .td-inner {
-                        &-compare {
-                            width: 100%;
-                        }
-                    }
-
-                    &-tip {
-                        padding: 2px 5px 0px 10px;
-                        font-size: 12px;
-                        line-height: 1;
-                        color: #ed4014;
-                        position: absolute;
-                        top: calc(100% -15px);
-                        left: 0px;
-                    }
-                    
-                    &-add {
-                        line-height: 20px;
-                        position: absolute;
-                        bottom: 0px;
-                        right: 0px;
-                        display: none;
-                    }
-                }
-
-                &-nodata {
-                    width: 100%;
-                    height: 40px;
-                    text-align: center;
-                }
-            }
-
-            tbody {
-                // display: block;
-                // overflow-y: scroll;
-            }
-
-            thead {
-                // display: block;
-            }
-        }
-    }
-
-    &-create {
-        margin: 5px 0px;
-        
-        button {
-            border-color: @theme-focus;
-            color: @theme-focus;
-            background-color: @bgColor;
-        
-            &:hover {
-                background-color: @bgColor;
-            }
-        }
-    }
-}

package/src/abolish/DshFlatTable.vue

@@ -1,605 +0,0 @@
-<template>
-    <div class="DshFlatTable">
-        <!-- 表格内容 -->
-        <div class="DshFlatTable-block">
-            <table
-                class="table"
-                border="1"
-                cellspacing="0"
-                bordercolor="#CFD9EB"
-            >
-                <!-- 表头 -->
-                <thead>
-                    <tr class="table-head">
-                        <th
-                            v-for="(col, colIndex) in showColumns"
-                            :key="colIndex"
-                            :style="getThStyle('head', col)"
-                            @click="clickTh(col, colIndex)"
-                        >
-                            <span>
-                                <i
-                                    v-if="col._required"
-                                    style="color:#ed4014"
-                                >*</i>
-
-                                <template v-if="col._type === 'selection'">
-                                    <Checkbox
-                                        :indeterminate="indeterminate"
-                                        :value="checkAll"
-                                        @click.prevent.native="clickCheckAll"
-                                    ></Checkbox>
-                                </template>
-                                <template v-else>
-                                    {{ col._name }}
-                                </template>
-
-                                <Tooltip
-                                    v-if="col._description"
-                                    transfer
-                                    max-width="200"
-                                >
-                                    <Icon
-                                        class="table-head-description"
-                                        custom="bico-font bico-explain"
-                                    ></Icon>
-                                    <div slot="content">
-                                        <span style="font-weight:normal;">{{ col._description }}</span>
-                                    </div>
-                                </Tooltip>
-                            </span>
-                        </th>
-                    </tr>
-                </thead>
-
-                <!-- 行数据 -->
-                <tbody
-                    v-if="listData.length"
-                    :style="{ 'max-height': contentHeight + 'px' }"
-                >
-                    <tr
-                        v-for="(row, rowIndex) in listData"
-                        :key="rowIndex"
-                        class="table-row"
-                    >
-                        <!-- 单元格 -->
-                        <td
-                            v-for="(col, colIndex) in showColumns"
-                            :key="colIndex"
-                            :style="getThStyle('row', col)"
-                            class="table-row-td"
-                            @click="clickTd(row, col)"
-                        >
-                            <div
-                                class="td-inner"
-                                :style="{
-                                    padding: '5px 8px 16px'
-                                }"
-                            >
-                                <!--对比值 -->
-                                <Tooltip
-                                    v-if="isShowCompare(col, row, oldListData[rowIndex])"
-                                    class="td-inner-compare"
-                                    :content="$isEmptyData(oldListData[rowIndex][col._key]) ? '空' : `${oldListData[rowIndex][col._key]}`"
-                                    placement="top"
-                                    :transfer="true"
-                                    maxWidth="200"
-                                >
-                                    <dsh-list-unit
-                                        class="td-inner-compare-unit"
-                                        :canEdit="getUnitCanEdit(col, row)"
-                                        :parentData="listData"
-                                        :formData="row"
-                                        :formItem="col"
-                                        :rowIndex="rowIndex"
-                                        @blur="controlBlur(null, col, row, arguments)"
-                                        @change="$dispatchEvent(operationMap.changeVal, col, row, rowIndex, arguments)"
-                                    ></dsh-list-unit>
-                                </Tooltip>
-
-                                <dsh-list-unit
-                                    v-else
-                                    :canEdit="getUnitCanEdit(col, row)"
-                                    :parentData="listData"
-                                    :formData="row"
-                                    :formItem="col"
-                                    :rowIndex="rowIndex"
-                                    @blur="controlBlur(null, col, row, arguments)"
-                                    @change="$dispatchEvent(operationMap.changeVal, col, row, rowIndex, arguments)"
-                                ></dsh-list-unit>
-                            </div>
-
-                            <!-- 必填提示 -->
-                            <span
-                                v-if="!getRuleResult(col, row).bool"
-                                class="table-row-td-tip"
-                            >
-                                {{ getRuleResult(col, row).message }}
-                            </span>
-
-                            <!-- 添加图标 -->
-                            <a
-                                v-if="col._type === 'index' && operationMap.create && !operationMap.create.disabled"
-                                class="table-row-td-add"
-                                href="javascript:void(0)"
-                                @click="$dispatchEvent(operationMap.create, row, rowIndex, listData)"
-                            >
-                                <Icon
-                                    type="md-add-circle"
-                                    size="20"
-                                />
-                            </a>
-                        </td>
-                    </tr>
-
-                    <!-- 汇总行 -->
-                    <tr
-                        v-if="useSummary && listData.length"
-                        :key="listData.length + 1"
-                        class="table-row"
-                    >
-                        <td
-                            v-for="(col, colIndex) in showColumns"
-                            :key="colIndex"
-                            :style="getThStyle('foot', col)"
-                        >
-                            <span>{{ getSummaryRowVal(col) }}</span>
-                        </td>
-                    </tr>
-                </tbody>
-
-                <!-- 脚 -->
-                <tfoot v-else>
-                    <tr>
-                        <td
-                            class="table-row-nodata"
-                            :colspan="showColumns.length"
-                        >暂无内容……</td>
-                    </tr>
-                </tfoot>
-            </table>
-        </div>
-
-        <!-- 添加行 -->
-        <dsh-buttons
-            class="DshFlatTable-create"
-            :list="$getOperationList(['create'])"
-            @click="$dispatchEvent($event, null, null, listData)"
-        ></dsh-buttons>
-    </div>
-</template>
-
-<script>
-    import DshListUnit from "../unit/DshListUnit.vue";
-
-    export default {
-        name: "DshFlatTable",
-        components: {
-            DshListUnit
-        },
-        props: {
-            canEdit: {
-                type: Boolean,
-                default: true
-            },
-            columns: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            data: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            oldData: {
-                type: Array,
-                default () {
-                    return [];
-                }
-            },
-            rowDefault: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            },
-
-            outObj: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            },
-            propsObj: {
-                type: Object,
-                default () {
-                    return {};
-                }
-            }
-        },
-        data () {
-            return {
-                selections: [],
-
-                showRuleMessage: false, // 显示校验文字
-                ruleRecordMap: {}
-                // createRowMap: {} // 用作标记哪些是新增行
-            };
-        },
-        computed: {
-            listData () {
-                this.data.forEach(item => {
-                    !item._id && this.$set(item, "_id", this.$ObjectID().str);
-                });
-                return this.data;
-            },
-            oldListData () {
-                this.oldData.forEach(item => {
-                    !item._id && this.$set(item, "_id", this.$ObjectID().str);
-                });
-                return this.oldData;
-            },
-
-            selfPropsObj () {
-                return {
-                    isShare: false, // 是否是分享页在用
-                    _contentHeight: 500,
-                    _useSelection: false, // 使用选择列
-                    _useIndex: true, // 使用序号列
-                    _useSummary: false, // 使用汇总行
-                    _disabledBtns: false, // 禁用增删按钮
-                    _disabledCreateBtn: false, // 置灰新增按钮，目前只内部使用，comp_web数据表配置页那块
-                    _disabledOldDataRow: false, // 置灰老数据行包含删除
-
-                    ...this.propsObj
-                };
-            },
-            isShare () {
-                return this.selfPropsObj.isShare;
-            },
-            contentHeight () {
-                return this.selfPropsObj._contentHeight;
-            },
-            useSelection () {
-                return this.selfPropsObj._useSelection;
-            },
-            useIndex () {
-                return this.selfPropsObj._useIndex;
-            },
-            useSummary () {
-                return this.selfPropsObj._useSummary;
-            },
-            disabledBtns () {
-                return this.selfPropsObj._disabledBtns;
-            },
-            disabledCreateBtn () {
-                return this.selfPropsObj._disabledCreateBtn;
-            },
-            disabledOldDataRow () {
-                return this.selfPropsObj._disabledOldDataRow;
-            },
-
-            useCompare () {
-                return !!this.oldListData.length;
-            },
-            showColumns () {
-                const operationList = this.$getOperationList(["delete"]);
-                const showColumns = [
-                    ...(
-                        this.useSelection === true
-                            ? [
-                                {
-                                    _id: this.$ObjectID().str,
-                                    _name: "全选",
-                                    _type: "selection",
-                                    _key: "selection",
-                                    _align: "center",
-                                    render: (h, { row, index, column }) => {
-                                        return h("Checkbox", {
-                                            props: {
-                                                value: this.selections.some(item => item._id === row._id)
-                                            },
-                                            on: {
-                                                input: ($event) => this.clickRowCheck($event, row)
-                                            }
-                                        });
-                                    }
-                                }
-                            ]
-                            : []
-                    ),
-
-                    ...(
-                        this.useIndex === true
-                            ? [
-                                {
-                                    _id: this.$ObjectID().str,
-                                    _name: "序号",
-                                    _type: "index",
-                                    _key: "index",
-                                    _align: "center"
-                                }
-                            ]
-                            : []
-                    ),
-
-                    ...this.columns.filter(colItem => this.$isAdvRelyShow(colItem, this.outObj)),
-
-                    ...(
-                        this.canEdit && operationList.length
-                            ? [
-                                {
-                                    _id: this.$ObjectID().str,
-                                    _name: "操作",
-                                    _type: "operation",
-                                    _key: "operation",
-                                    _align: "center",
-                                    _width: 80,
-                                    render: (h, params) => {
-                                        return h("dsh-buttons", {
-                                            props: {
-                                                list: this.disabledOldDataRow && !params.row.__isCreate__ ? [] : operationList
-                                                // list: this.disabledOldDataRow && !this.createRowMap[params.row._id] ? [] : operationList
-                                            },
-                                            on: {
-                                                click: (operationItem) => {
-                                                    this.$dispatchEvent(operationItem, params.row, params.index, this.listData);
-                                                }
-                                            }
-                                        });
-                                    }
-                                }
-                            ]
-                            : []
-                    )
-                ];
-
-                return showColumns;
-            },
-            selfRowDefault () {
-                return this.$filterObj(this.columns, this.rowDefault);
-            },
-            checkAll () {
-                return !!this.selections.length && !!this.listData.length && this.selections.length === this.listData.length;
-            },
-            indeterminate () {
-                return !!this.selections.length && !!this.listData.length && this.selections.length !== this.listData.length;
-            },
-
-            operationMap () {
-                const allOperationMap = {
-                    create: {
-                        name: "添加一行",
-                        type: "create",
-                        icon: "md-add",
-                        size: "default",
-                        long: true,
-                        disabled: !!this.disabledCreateBtn,
-                        event: "clickCreate"
-                    },
-                    delete: {
-                        name: "删除",
-                        type: "delete",
-                        color: "#ed4014",
-                        btnType: "text",
-                        // icon: "md-trash",
-                        disabled: false,
-                        event: "clickDelete"
-                    },
-                    // expand: {
-                    //     name: "展开",
-                    //     type: "expand",
-                    //     event: "clickExpand"
-                    // },
-                    changeVal: {
-                        name: "改变输入框值",
-                        type: "changeVal",
-                        event: "changeVal"
-                    }
-                };
-
-                return this.canEdit
-                    ? this.$categoryMapToMap(
-                        allOperationMap,
-                        null,
-                        this.disabledBtns ? ["create", "delete"] : []
-                    )
-                    : {};
-            }
-        },
-        created () {},
-        methods: {
-            // 共外部使用
-            validate () {
-                this.showRuleMessage = true;
-
-                return this.listData.every(dataItem =>
-                    this.showColumns.every(col => this.getRuleResult(col, dataItem, true).bool)
-                );
-            },
-
-            // 点击表头
-            clickTh (col, colIndex) {
-                this.$emit("clickTh", col, colIndex);
-            },
-            // 点击单元格
-            clickTd (row, col) {},
-            // // 点击 -打开行
-            // clickExpand (operationItem, row, index, list) {},
-            // 点击全选
-            clickCheckAll () {
-                if (this.selections.length) {
-                    this.selections = [];
-                } else {
-                    this.selections = this.listData;
-                }
-
-                this.$emit("selectAll", this.selections);
-            },
-            // 点击行选择
-            clickRowCheck (bool, row) {
-                if (bool) {
-                    this.selections.push(row);
-                } else {
-                    this.selections = this.selections.filter(checkItem => checkItem._id !== row._id);
-                }
-
-                this.$emit("changeSelect", this.selections, row, bool);
-            },
-            // 点击 -添加行
-            clickCreate (operationItem, row, index, list) {
-                const newRow = {
-                    ...this.$deepCopy(this.selfRowDefault),
-                    __isCreate__: true,
-                    _id: this.$ObjectID().str
-                };
-                const newRowIndex = index == null ? list.length : index + 1;
-                list.splice(newRowIndex, 0, newRow);
-
-                // this.$set(this.createRowMap, newRow._id, true);
-                this.$forceUpdate(); // 自定义页中点击添加一行没有更新页面
-
-                this.change("createRow", null, newRow, newRowIndex);
-            },
-            // 点击 -删除行
-            clickDelete (operationItem, row, rowIndex, list) {
-                this.$Modal.confirm({
-                    title: "警告",
-                    content: "确定删除吗？",
-                    onOk: () => {
-                        list.splice(rowIndex, 1);
-                        this.selections = [];
-
-                        this.change("deleteRow", null, row, rowIndex);
-                    }
-                });
-            },
-            // 表单控件值改变
-            changeVal (operationItem, col, row, rowIndex, params) {
-                this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
-
-                this.change("changeVal", col, row, rowIndex, ...params);
-            },
-            // 表单控件失去焦点
-            controlBlur (operationItem, col, row, params) {
-                this.$set(this.ruleRecordMap, `${row._id}dsh${col._key}`, { showRuleMessage: true });
-            },
-            change (...params) {
-                this.$emit("change", { list: this.listData, rowDefault: this.rowDefault }, ...params);
-            },
-
-            /* --------------- 工具方法 ------------- */
-            getUnitCanEdit (col, row) {
-                return this.canEdit && // 是否是编辑状态
-                    // (!this.disabledOldDataRow || !!this.createRowMap[row._id]) && // 是否让老数据行置灰
-                    (!this.disabledOldDataRow || !!row.__isCreate__) && // 是否让老数据行置灰
-                (!col.dependRowCanEdit || row.canEdit !== false); // 在老数据行里某些列不可编辑
-            },
-            isShowCompare (col, row, oldRow = {}) {
-                return this.useCompare && ["number"].includes(col._type) &&
-                    !(this.$isEmptyData(row[col._key]) && this.$isEmptyData(oldRow[col._key])) &&
-                    row[col._key] !== oldRow[col._key];
-            },
-            // 获取单元格样式
-            getThStyle (type, col) {
-                let textAlign = col._align || "left";
-                if (["index", "selection"].includes(col._type)) {
-                    col.width = col._width || 46;
-                } else if (["text", "textarea", "email"].includes(col._type)) {
-                    col.width = col._width || 200;
-                } else if (["idcard"].includes(col._type)) {
-                    col.width = col._width || 190;
-                } else if (["phone"].includes(col._type)) {
-                    col.width = col._width || 130;
-                } else if (["number"].includes(col._type)) {
-                    col.width = col._width || 120;
-                    // textAlign = col._align || "right";
-                } else if (["date"].includes(col._type)) {
-                    switch (col._dateType) {
-                    case "date": col.width = col._width || 120; break;
-                    case "year": col.width = col._width || 96; break;
-                    case "month": col.width = col._width || 120; break;
-                    case "time": col.width = col._width || 120; break;
-                    case "datetime": col.width = col._width || 180; break;
-                    default: col.width = 120; break;
-                    }
-                } else if (["switch"].includes(col._type)) {
-                    col.width = col._width || 80;
-                    textAlign = col._align || "center";
-                } else if (["select"].includes(col._type)) {
-                    col.width = col._width || 120;
-                    textAlign = col._align || "center";
-                } else if (["checkbox"].includes(col._type)) {
-                    col.width = col._width || 180;
-                } else if (["cascader"].includes(col._type)) {
-                    col.width = col._width || 150;
-                } else if (["region"].includes(col._type)) {
-                    col.width = col._width || 212;
-                } else if (["file", "image"].includes(col._type)) {
-                    col.width = col._width || 170;
-                    textAlign = col._align || "center";
-                } else if (["flatTable", "cascaderTable", "editor"].includes(col._type)) {
-                    col.width = col._width || 100;
-                    textAlign = col._align || "center";
-                } else if (["departments"].includes(col._type)) {
-                    col.width = col._width || 100;
-                } else if (["users"].includes(col._type)) {
-                    col.width = col._width || 120;
-                } else if (["reference"].includes(col._type)) {
-                    col.width = (col._name ? col._name.length * 14 : 36) + 60;
-                } else if (["referenceBy"].includes(col._type)) {
-                    col.width = col._width || 100;
-                } else {
-                    col.width = col._width || 120;
-                }
-                let styleObj = {
-                    width: col.width && `${col.width}px`,
-                    minWidth: col.width && `${col.width}px`,
-                    maxWidth: col.width && `${col.width}px`,
-                    // width: colIndex === this.showColumns.length - 1 ? col.width && `${col.width}px` : undefined,
-                    padding: "5px 8px 16px",
-                    textAlign: textAlign,
-
-                    ...(
-                        type === "head"
-                            ? {
-                                cursor: "pointer"
-                            }
-                            : type === "row"
-                                ? {
-                                    height: "30px",
-                                    padding: undefined
-                                }
-                                : {
-                                    height: "30px"
-                                }
-                    )
-                };
-
-                return styleObj;
-            },
-            // 获取汇总单元格的值
-            getSummaryRowVal (col) {
-                return col._type === "index"
-                    ? "汇总"
-                    : col._type === "number"
-                        ? this.$calNumList(this.listData.map(item => item[col._key]), col._summaryType, { ...col, _defaultDigit: 2 })
-                        : null;
-
-            },
-            // 是否显示 单元格校验提示文字
-            getRuleResult (col, row, showRuleMessage = this.showRuleMessage) {
-                if ((this.ruleRecordMap[`${row._id}dsh${col._key}`] || {}).showRuleMessage || showRuleMessage) {
-                    return this.$getFieldRuleResult(col, row);
-                } else {
-                    return {
-                        bool: true
-                    };
-                }
-            }
-        }
-    };
-</script>