@lx-frontend/wrap-element-ui 1.0.25 → 2.0.0

package/src/components/EditableTable/features/bizTableHeaderPopover/index.vue

@@ -1,160 +0,0 @@
-<template>
-  <el-popover
-    ref="popoverRef"
-    placement="bottom"
-    trigger="click"
-    popper-class="editable-table-sort-filter"
-    data-popper-name="editable-table-sort-filter"
-    :data-prop="column.prop"
-    @show="() => emit('popover-show')"
-  >
-    <template slot="reference">
-      <slot name="custom">
-        <!-- 筛选中，或排序中，高亮 -->
-        <span
-          :class="['editable-table__sort-reference', headActive && 'editable-table__sort-reference--active']"
-        >
-          {{ column.label }}
-          <div :class="['editable-table__sort-icon', headActive && 'editable-table__sort-icon--active']" />
-        </span>
-      </slot>
-    </template>
-    <div class="editable-table-sort-filter">
-      <div class="editable-table-sort-filter__column-title">
-        {{ column.label }}
-      </div>
-
-      <div class="editable-table-sort-filter__item">
-        <BizSortFilter
-          v-if="column.isColumnSortable"
-          :column="column"
-          :temp-sort-prop="tempSortProp"
-          :temp-sort-type="tempSortType"
-          @update:sort="(type, prop) => emit('update:sort', type, prop)"
-        />
-      </div>
-
-      <template v-if="column.filters">
-        <div
-          v-for="(filterItem, index) in column.filters"
-          :key="index"
-          class="editable-table-sort-filter__item editable-table__filter-group__filter"
-        >
-          <slot
-            v-if="filterItem.type === 'slot'"
-            :name="filterItem.slotName"
-          />
-          <component
-            v-else
-            :is="componentMap[filterItem.type]"
-            :config="filterItem"
-            :temp-filtered-value="tempFilteredValue"
-            @update:tempFilteredValue="onUpdate"
-          />
-        </div>
-      </template>
-
-      <div
-        v-if="column.summary"
-        class="editable-table-sort-filter__item editable-table-sort-filter__filter"
-      >
-        <div class="editable-table-sort-filter__filter-title">
-          统计
-        </div>
-        <el-checkbox-group
-          class="editable-table-sort-filter__filter-checkbox-group"
-          :value="tempSummaryList"
-          @input="val => emit('update:tempSummaryList', val)"
-        >
-          <el-checkbox
-            :label="column.prop"
-            class="editable-table-sort-filter__filter-checkbox"
-          >
-            <slot
-              name="summay-item"
-              v-bind="column"
-            >
-              {{ column.label }}
-            </slot>
-          </el-checkbox>
-        </el-checkbox-group>
-      </div>
-
-      <div class="editable-table-sort-filter__footer">
-        <el-button
-          class="editable-table-sort-filter__reset-btn"
-          @click="() => emit('reset')"
-        >
-          重置
-        </el-button>
-        <el-button
-          class="editable-table-sort-filter__confirm-btn"
-          type="primary"
-          @click="() => emit('confirm')"
-        >
-          确定
-        </el-button>
-      </div>
-    </div>
-  </el-popover>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-import BizCheckboxFilter from './BizCheckboxFilter.vue';
-import BizColorRadioFilter from './BizColorRadioFilter.vue';
-import BizDoubleDatePickerFilter from './BizDoubleDatePickerFilter.vue';
-import BizInputFilter from './BizInputFilter.vue';
-import BizMonthDayPicker from './BizMonthDayPicker.vue';
-import BizSortFilter from './BizSortFilter.vue';
-import BizRadioFilter from "./BizRadioFilter.vue";
-import { FilterItem, IColumnConfig } from '../../types'
-
-defineProps<{
-  headActive: boolean
-  column: IColumnConfig
-  tempSummaryList: string[]
-  tempSortType: 'ascending' | 'descending' | ''
-  tempSortProp: string
-  tempFilteredValue: Record<string, string | number | number[] | string[]>
-}>()
-
-const emit = defineEmits<{
-  (e: 'update:tempFilteredValue', key: string, value: string): void
-  (e: 'update:tempSummaryList', value: string[]): void
-  (e: 'update:sort', type: 'ascending' | 'descending', prop: string): void
-  (e: 'popover-show'): void
-  (e: 'reset'): void
-  (e: 'confirm'): void
-}>()
-
-// 把 filterItem.type 映射到组件
-const componentMap: Record<Exclude<FilterItem['type'], 'slot'>, any> = {
-  /** 输入框 */
-  input: BizInputFilter,
-  /** 日期范围 */
-  doubleDatePicker: BizDoubleDatePickerFilter,
-  /** 单选框 */
-  radio: BizRadioFilter,
-  /** 复选框 */
-  checkbox: BizCheckboxFilter,
-  /** 月日选择器 */
-  monthDayPicker: BizMonthDayPicker,
-  /** 颜色选择器 */
-  colorRadio: BizColorRadioFilter,
-}
-
-const popoverRef = ref(null as any)
-
-// 统一的事件派发
-function onUpdate(key: string, val: any) {
-  emit('update:tempFilteredValue', key, val)
-}
-
-defineExpose({
-  close: () => {
-    popoverRef.value?.doClose()
-  }
-})
-</script>

package/src/components/EditableTable/features/bizTableOperatePopover.vue

@@ -1,67 +0,0 @@
-<template>
-  <el-popover
-    ref="operationPopoverRef"
-    placement="bottom"
-    trigger="click"
-    popper-class="editable-table-operation-popover"
-  >
-    <div
-      slot="reference"
-      class="editable-table-operation-popover__operation-reference btn-pointer"
-    >
-      <el-button class="editable-table-operation-popover__operation-btn">
-        操作
-      </el-button>
-    </div>
-    <div class="editable-table-operation-popover__operation">
-      <div
-        v-if="defaultOperations.includes('delete')"
-        class="editable-table-operation-popover__operation-item btn-pointer"
-        @click="() => emit('delete')"
-      >
-        删除
-      </div>
-      <div
-        v-if="defaultOperations.includes('edit')"
-        class="editable-table-operation-popover__operation-item btn-pointer"
-        @click="() => emit('edit')"
-      >
-        编辑
-      </div>
-      <div
-        v-if="defaultOperations.includes('top')"
-        class="editable-table-operation-popover__operation-item btn-pointer"
-        @click="() => emit('rowPinToTop')"
-      >
-        置顶
-      </div>
-      <slot />
-    </div>
-  </el-popover>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import { IDefaultOperationType } from '../types';
-
-defineProps<{
-  defaultOperations: IDefaultOperationType[]
-  // hoveringCellInfo: {
-  //   rowIndex: number
-  //   columnProperty: string
-  // }
-  scope: any
-}>()
-
-const emit = defineEmits<{
-  (e: 'edit'): void
-  (e: 'delete'): void
-  (e: 'rowPinToTop'): void
-}>()
-
-const operationPopoverRef = ref(null as any)
-
-defineExpose({
-  doClose: () => operationPopoverRef.value?.doClose?.()
-})
-</script>

package/src/components/EditableTable/features/bizViewSettingDialog.vue

@@ -1,137 +0,0 @@
-<template>
-  <el-dialog
-    title="显示设置"
-    :visible.sync="viewSettingVisible"
-    width="750px"
-    top="12vh"
-    :close-on-click-modal="false"
-    append-to-body
-    custom-class="editable-table-view-setting__dialog"
-  >
-    <div class="editable-table-view-setting__content">
-      <div class="editable-table-view-setting__content-left">
-        <div class="editable-table-view-setting__checkbox-wrapper">
-          <el-checkbox-group v-model="columnsToBeShown">
-            <el-checkbox
-              v-for="item in props.columnConfig"
-              :key="item.label"
-              :label="item.prop"
-              :disabled="item.isAlwaysShow"
-            >
-              <div class="editable-table-view-setting__content-left-item">
-                {{ item.label }}
-              </div>
-            </el-checkbox>
-          </el-checkbox-group>
-        </div>
-      </div>
-      <div class="editable-table-view-setting__content-right">
-        <div class="editable-table-view-setting__content-right-title">
-          已选择
-          <div class="editable-table-view-setting__selected-count">
-            {{ columnsToBeShown.length }}
-          </div>
-        </div>
-        <div class="editable-table-view-setting__content-right-frize">
-          冻结前
-          <el-input
-            class="editable-table-view-setting__content-right-input"
-            :value="tempLeftFixedColumnCount"
-            @input="handleInputTempLeftFixedColumnCount"
-          />
-          列
-        </div>
-        <div class="editable-table-view-setting__content-right-selected">
-          <div
-            v-for="(item, index) in viewSettingDragSortOptions"
-            :key="item.prop"
-            class="editable-table-view-setting__selected-item editable-table-view-setting-draggable-item"
-          >
-            <div class="editable-table-view-setting__selected-item-left">
-              <div
-                class="editable-table-view-setting-drag-target editable-table-view-setting__icon-wrapper"
-                :data-index="index"
-              >
-                <div
-                  class="editable-table-view-setting-drag-target editable-table-drag-icon"
-                  :data-index="index"
-                />
-              </div>
-              <div class="editable-table-view-setting__selected-item-name">
-                {{ item.label }}
-              </div>
-            </div>
-            <div
-              :class="['editable-table-view-setting__selected-item-close', item.isAlwaysShow ? 'editable-table-view-setting__selected-item-close--disabled' : '']"
-              @click="handleColumnClose(item)"
-            >
-              <i class="el-icon-close" />
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <template #footer>
-      <el-button @click="handleViewSettingClose">
-        取消
-      </el-button>
-      <el-button
-        type="primary"
-        @click="handleViewSettingConfirm"
-      >
-        确认
-      </el-button>
-    </template>
-  </el-dialog>
-</template>
-
-<script setup lang="ts">
-import { toRefs } from 'vue';
-import { useViewSetting } from '../bizHooks'
-import { IColumnConfig, IProps } from '../types';
-
-const emit = defineEmits<{
-  (e: 'update:leftFixedColumnCount', val: number): void
-  (e: 'update:showingColumns', val: string[]): void
-  (e: 'update:viewSettingDragSortOptions', val: IColumnConfig[]): void
-  (e: 'tableDoLayout'): void
-}>()
-
-const _props = defineProps<{
-  actualColumns: IColumnConfig[]
-  viewSettingDragSortOptions: IColumnConfig[]
-  showingColumns: string[]
-  props: IProps
-}>()
-
-const {
-  actualColumns,
-  showingColumns,
-  viewSettingDragSortOptions,
-} = toRefs(_props)
-
-const {
-  columnsToBeShown,
-  viewSettingVisible,
-  tempLeftFixedColumnCount,
-  handleInputTempLeftFixedColumnCount,
-  handleViewSettingShow,
-  handleViewSettingClose,
-  handleViewSettingConfirm
-} = useViewSetting({
-  showingColumns,
-  actualColumns,
-  viewSettingDragSortOptions,
-  props: _props.props,
-  emit,
-});
-
-const handleColumnClose = (item) => {
-  if (item.isAlwaysShow) return;
-  columnsToBeShown.value = columnsToBeShown.value.filter(c => c !== item.prop);
-};
-
-defineExpose({
-  open: handleViewSettingShow
-})
-</script>