vue-super-crud 1.7.1 → 1.7.4

package/packages/crud/defaultColumn.vue

@@ -1,130 +0,0 @@
-<script>
-import { isFunction } from "lodash-es";
-export default {
-  inject: ["ctx"],
-  props: {
-    col: Object,
-  },
-  watch: {
-    col() {
-      this.bindColumnConfig();
-    },
-  },
-  created() {
-    const span = this.col.spanProp || this.col.sameRowSpan;
-    span && this.ctx.sameRowSpans.push(span);
-  },
-  computed: {
-    crudOptions() {
-      return this.ctx.crudOptions;
-    },
-    defaultFixed() {
-      return this.fixed;
-    },
-    showColumn() {
-      if (this.ctx.setOptions.hidden.includes(this.col.prop)) return false;
-      return true;
-    },
-    fixed() {
-      if (this.col.fixed) return this.col.fixed;
-      const fixed = this.ctx.setOptions.fixed[this.col.prop];
-      if (fixed) return fixed;
-    },
-  },
-  methods: {
-    bindColumnConfig() {
-      const columnConfig = this.$refs.column?.columnConfig;
-      if (columnConfig) {
-        columnConfig.col = { ...this.col };
-        columnConfig.options = { ...this.ctx.crudOptions };
-      }
-    },
-  },
-  render(h) {
-    if (!this.showColumn) return null;
-
-    const defaultColumn = (slots, type) => (
-      <el-table-column
-        ref="column"
-        key={this.col.type}
-        prop={this.col.type}
-        type={type}
-        fixed={this.defaultFixed}
-        props={this.col}
-        on={{
-          "hook:mounted": this.bindColumnConfig,
-        }}
-        scopedSlots={slots}
-      />
-    );
-    if (this.ctx.showSingleSelection) {
-      return defaultColumn({
-        default: (scope) => {
-          let selectable = false;
-          if (isFunction(this.ctx.singleSelection.selectable)) {
-            selectable = !this.ctx.singleSelection.selectable(
-              scope.row,
-              scope.$index
-            );
-          }
-          return (
-            <el-radio
-              v-model={this.ctx.singleSelect}
-              label={scope.row[this.ctx.operateKey]}
-              disabled={selectable}
-              onChange={() => {
-                this.ctx.$emit("update:selected", scope.row);
-              }}
-            >
-              {"  "}
-            </el-radio>
-          );
-        },
-      });
-    }
-    const span = this.col.spanProp || this.col.sameRowSpan;
-    if (this.col.type === "index" && (isFunction(this.col.index) || span)) {
-      return defaultColumn(
-        {
-          default: (scope) => {
-            if (span) {
-              const sameRowMap = this.ctx.sameRowMap[span] || {};
-
-              const rowValue = scope.row[span] || "";
-
-              const map = sameRowMap?.[rowValue]?.find(
-                (g) =>
-                  scope.$index >= g.firstIndex &&
-                  scope.$index < g.firstIndex + g.span
-              );
-              const spanIndex = map?.spanIndex || scope.$index;
-              if (this.col.render) {
-                return this.col.render(spanIndex + 1);
-              }
-              return spanIndex + 1;
-            }
-            return this.col.index(scope.$index, scope);
-          },
-        },
-        this.col.type
-      );
-    }
-    return defaultColumn(
-      {
-        default:
-          this.col.render || this.ctx.$scopedSlots[this.col.type]
-            ? (scope) => {
-                if (this.col.render) {
-                  return this.col.render(scope);
-                }
-                if (this.ctx.$scopedSlots[this.col.type]) {
-                  return this.ctx.$scopedSlots[this.col.type](scope);
-                }
-              }
-            : null,
-      },
-      this.col.type
-    );
-  },
-};
-</script>

package/packages/crud/drawerColumn.vue

@@ -1,225 +0,0 @@
-<script>
-import create from "core/create";
-import draggable from "vuedraggable";
-import cache from "utils/cache.js";
-export default create({
-  name: "crud-drawer",
-  components: { draggable },
-  inject: ["ctx"],
-  data() {
-    return {
-      active: false,
-      title: "",
-      currentValue: [],
-    };
-  },
-  computed: {
-    action() {
-      if (this.ctx.crudOptions.action || this.ctx.rowEdit) {
-        return [
-          {
-            prop: "action",
-            label: "操作",
-          },
-        ];
-      }
-      return [];
-    },
-    defaultColumns() {
-      return this.ctx.defaultColumns || [];
-    },
-    columns() {
-      const columns = [...this.defaultColumns, ...this.listColumns];
-      if (this.action.length) columns.push(...this.action);
-      return columns;
-    },
-    listColumns() {
-      return this.ctx.columns.filter((item) => !item.hiddenList) || [];
-    },
-    fixed() {
-      return this.ctx.setOptions.fixed;
-    },
-    hidden: {
-      get() {
-        return this.ctx.setOptions.hidden;
-      },
-      set(val) {
-        this.ctx.setOptions.hidden = val;
-      },
-    },
-    show: {
-      get() {
-        return this.columns
-          .filter((i) => !this.hidden.includes(i.prop))
-          .map((i) => i.prop);
-      },
-      set(val) {
-        this.hidden = this.columns
-          .filter((i) => !val.includes(i.prop))
-          .map((i) => i.prop);
-      },
-    },
-    isIndeterminate() {
-      return this.hidden.length > 0 && this.hidden.length < this.columns.length;
-    },
-    checkAll: {
-      get() {
-        return this.show.length === this.columns.length;
-      },
-      set(val) {
-        this.hidden = val ? [] : this.columns.map((i) => i.prop);
-      },
-    },
-  },
-  methods: {
-    flatColumn(columns) {
-      const flattenColumns = [];
-      columns.forEach((col) => {
-        flattenColumns.push(col);
-        if (col.children) {
-          const children = this.flatColumn(col.children);
-          flattenColumns.push(...children);
-        }
-      });
-      return flattenColumns;
-    },
-    showDrawer() {
-      this.active = true;
-    },
-    reset() {
-      this.ctx.resetLocalCache();
-    },
-    changeFixed(property, type) {
-      this.$set(this.ctx.setOptions.fixed, property, type);
-      this.ctx.saveLocalCache();
-    },
-    handleCheckedChange(value) {
-      this.ctx.saveLocalCache();
-    },
-    saveTableOptions() {
-      if (!this.$route) return;
-      let cacheData = cache.local.getJSON("tableOptions");
-      cacheData[this.$route.path] = this.ctx.setOptions;
-      cache.local.setJSON("tableOptions", cacheData);
-    },
-    onEnd({ newIndex, oldIndex }) {
-      const sort = this.ctx.setOptions.sort;
-      const endProp = this.listColumns[newIndex].prop;
-      const prop = this.listColumns[oldIndex].prop;
-      let startIndex, endIndex, adjustment;
-      if (oldIndex < newIndex) {
-        startIndex = oldIndex + 1;
-        endIndex = newIndex + 1;
-        adjustment = -1;
-      } else if (oldIndex > newIndex) {
-        startIndex = newIndex;
-        endIndex = oldIndex;
-        adjustment = 1;
-      } else {
-        return;
-      }
-      const clipColumns = this.listColumns.slice(startIndex, endIndex);
-      clipColumns.forEach((item) => {
-        if (item.prop !== prop) {
-          this.$set(sort, item.prop, item.order + adjustment);
-        }
-      });
-      this.$set(sort, prop, newIndex);
-      this.ctx.saveLocalCache();
-    },
-    renderColumnItems(columns, isDraggable = false) {
-      return columns.map((i, index) => (
-        <div class="col-item" key={index}>
-          <el-checkbox class="col-item--left" label={i.prop} title={i.label}>
-            {i.label}
-          </el-checkbox>
-          <div class="col-item--right">
-            {this.renderFixedButtons(i.prop)}
-            {isDraggable && !i.type ? (
-              <div class={["el-icon-sort", "sort-drag", "mover"]}></div>
-            ) : (
-              <div style="width: 22px; background: #fff;"></div>
-            )}
-          </div>
-        </div>
-      ));
-    },
-    renderFixedButtons(prop) {
-      return (
-        <el-button-group>
-          {["left", false, "right"].map((direction) => (
-            <el-button
-              class="fixed-btn"
-              icon={direction ? `el-icon-arrow-${direction}` : "el-icon-close"}
-              type={
-                direction
-                  ? this.fixed[prop] === direction
-                    ? "primary"
-                    : "default"
-                  : !this.fixed[prop]
-                  ? "primary"
-                  : "default"
-              }
-              onClick={() => this.changeFixed(prop, direction)}
-            />
-          ))}
-        </el-button-group>
-      );
-    },
-  },
-  render(h) {
-    return (
-      <el-drawer
-        class={this.b()}
-        title="列设置"
-        visible_sync={this.active}
-        size="300px"
-        appendToBody
-      >
-        <div class="wrapper">
-          <el-card shadow="never">
-            <div class="header">
-              <el-checkbox
-                indeterminate={this.isIndeterminate}
-                vModel={this.checkAll}
-                onChange={this.handleCheckedChange}
-              >
-                {this.show.length} / {this.columns.length}
-              </el-checkbox>
-              <span class="title">固定 / 排序</span>
-            </div>
-            <el-checkbox-group
-              class="col-list"
-              vModel={this.show}
-              onChange={this.handleCheckedChange}
-            >
-              {this.renderColumnItems(this.defaultColumns)}
-              <draggable
-                ghostClass="ghost"
-                handle=".sort-drag"
-                filter=".unMover"
-                animation={150}
-                vModel={this.currentValue}
-                onEnd={this.onEnd}
-              >
-                {this.renderColumnItems(this.listColumns, true)}
-              </draggable>
-              {this.renderColumnItems(this.action)}
-            </el-checkbox-group>
-          </el-card>
-          <el-button
-            class="reset-btn"
-            size="default"
-            icon="el-icon-refresh"
-            onClick={this.reset}
-          >
-            重置
-          </el-button>
-        </div>
-      </el-drawer>
-    );
-  },
-});
-</script>
-
-<style lang="scss" scoped></style>

package/packages/crud/form.vue

@@ -1,69 +0,0 @@
-<template>
-  <scForm
-    ref="crudForm"
-    v-model="ctx.form"
-    :options="options"
-    :scope="scope"
-    :loading.sync="loading"
-  ></scForm>
-</template>
-
-<script>
-import create from "core/create";
-import scForm from "../form/index.vue";
-import { isFunction, merge } from "lodash-es";
-import defaultRender from "core/defaultRender";
-import { filterColumns } from "utils";
-export default create({
-  props: {
-    ctx: {
-      type: Object,
-      default: () => {},
-    },
-    mode: String,
-    scope: {
-      type: Object,
-      default: () => {},
-    },
-    loading: Boolean,
-  },
-  components: { scForm },
-  computed: {
-    formOptions() {
-      const opt = merge(
-        {},
-        this.ctx.crudOptions.formOptions,
-        this.ctx.crudOptions[this.mode + "Form"]
-      );
-      return {
-        ...opt,
-        renderColumns: filterColumns(this.ctx.getRenderColumns(this.mode)),
-      };
-    },
-    options() {
-      return {
-        detail: this.mode === "view" ? true : false,
-        labelPosition: "left",
-        columns: 2,
-        columnGap: "10px",
-        slots: this.ctx.extendsScopedSlots,
-        mode: this.mode,
-        defaultRender: (h, scope) => {
-          if (isFunction(this.formOptions.defaultRender)) {
-            return this.formOptions.defaultRender(h, scope);
-          }
-          if (scope.mode === "view" && this.formOptions.viewType === "table") {
-            return defaultRender.formatter(h, scope);
-          }
-          return defaultRender.input(h, scope);
-        },
-        ...this.formOptions,
-      };
-    },
-  },
-  mounted() {
-    this.ctx.$refs.crudForm = this.$refs.crudForm;
-  },
-  methods: {},
-});
-</script>