vue-super-crud 1.7.1 → 1.7.2

package/docs/.vuepress/components/crud/tableEdit/cellEdit.vue

@@ -1,194 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :search.sync="searchForm"
-      :options="options"
-      :data="data"
-      @edit="edit"
-      @save="save"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      data: [
-        {
-          id: 1,
-          name: "张三",
-          gender: "男",
-          age: 20,
-          city: "北京",
-          date: "2021-01-01",
-          time: "12:00:00",
-          datetime: "2021-01-01 12:00:00",
-          color: "#409EFF",
-          switch: true,
-          rate: 3,
-          slider: 50,
-          radio: "1",
-          checkbox: ["1"],
-          select: "1",
-          cascader: ["1", "1-1"],
-          textarea: "这是一段文本",
-          number: 100,
-        },
-        {
-          id: 2,
-          name: "李四",
-          gender: "女",
-          age: 21,
-          city: "上海",
-          date: "2021-01-02",
-          time: "13:00:00",
-          datetime: "2021-01-02 13:00:00",
-          color: "#67C23A",
-          switch: false,
-          rate: 4,
-          slider: 30,
-          radio: "2",
-          checkbox: ["2"],
-          select: "2",
-          cascader: ["2", "2-1"],
-          textarea: "这是另一段文本",
-          number: 200,
-        },
-        {
-          id: 3,
-          name: "王五",
-          gender: "男",
-          age: 22,
-          city: "广州",
-          date: "2021-01-03",
-          time: "14:00:00",
-          datetime: "2021-01-03 14:00:00",
-          color: "#E6A23C",
-          switch: true,
-          rate: 5,
-        },
-        {
-          id: 4,
-          name: "赵六",
-          gender: "女",
-          age: 23,
-          city: "深圳",
-          date: "2021-01-04",
-          time: "15:00:00",
-          datetime: "2021-01-04 15:00:00",
-          color: "#F56C6C",
-          switch: false,
-          rate: 2,
-        },
-      ],
-      isEdit: true,
-    };
-  },
-  computed: {
-    options() {
-      return {
-        editConfig: {
-          mode: "cell",
-          autofocus: true,
-        },
-        renderColumns: [
-          { prop: "name", label: "输入框", required: true },
-          {
-            prop: "select",
-            label: "选择器",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "1", label: "选项1" },
-                  { value: "2", label: "选项2" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "cascader",
-            label: "级联选择器",
-            form: {
-              comp: {
-                name: "el-cascader",
-                options: [
-                  {
-                    value: "1",
-                    label: "选项1",
-                    children: [
-                      { value: "1-1", label: "选项1-1" },
-                      { value: "1-2", label: "选项1-2" },
-                    ],
-                  },
-                  {
-                    value: "2",
-                    label: "选项2",
-                    children: [
-                      { value: "2-1", label: "选项2-1" },
-                      { value: "2-2", label: "选项2-2" },
-                    ],
-                  },
-                ],
-              },
-            },
-          },
-          {
-            prop: "date",
-            label: "日期选择器",
-            form: {
-              comp: {
-                name: "el-date-picker",
-                "value-format": "yyyy-MM-dd",
-              },
-            },
-          },
-          {
-            prop: "time",
-            label: "时间选择器",
-            form: {
-              comp: {
-                name: "el-time-picker",
-                "value-format": "HH:mm:ss",
-              },
-            },
-          },
-          {
-            prop: "color",
-            label: "颜色选择器",
-            form: {
-              comp: {
-                name: "el-color-picker",
-              },
-            },
-          },
-          {
-            prop: "rate",
-            label: "评分",
-            form: {
-              comp: {
-                name: "el-rate",
-              },
-            },
-          },
-        ],
-      };
-    },
-  },
-  methods: {
-    edit(done, scope) {
-      this.$message.info("编辑");
-      console.log(scope, "edit");
-      done();
-    },
-    save(done, scope) {
-      this.$message.success("保存");
-      console.log(scope, "save");
-      done();
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/tableEdit/controlEdit.vue

@@ -1,219 +0,0 @@
-<template>
-  <div>
-    <div class="demo-section">
-      <h3>控制行编辑状态：</h3>
-      <el-button @click="handleRowChange(0)">禁用第一行</el-button>
-      <el-button @click="handleRowChange(1)">禁用第二行</el-button>
-      <el-button @click="handleRowChange(2)">禁用第三行</el-button>
-      <el-button @click="handleRowChange(null)">取消禁用</el-button>
-    </div>
-
-    <div style="margin-bottom: 20px;">
-      <h3>控制列编辑状态：</h3>
-      <el-button @click="handleColumnChange('name')">禁用姓名列</el-button>
-      <el-button @click="handleColumnChange('gender')">禁用性别列</el-button>
-      <el-button @click="handleColumnChange('age')">禁用年龄列</el-button>
-      <el-button @click="handleColumnChange(null)">取消禁用</el-button>
-    </div>
-
-    <div style="margin-bottom: 20px;">
-      <h3>控制单元格编辑状态：</h3>
-      <el-button @click="handleCellChange('name')"
-        >禁用姓名第一个单元格</el-button
-      >
-      <el-button @click="handleCellChange('gender')"
-        >禁用性别第一个单元格</el-button
-      >
-      <el-button @click="handleCellChange('age')"
-        >禁用年龄第一个单元格</el-button
-      >
-      <el-button @click="handleCellChange(null)">取消禁用</el-button>
-    </div>
-
-    <sc-crud
-      :search.sync="searchForm"
-      ref="crud"
-      :options="options"
-      :data="data"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      data: [
-        {
-          id: 1,
-          name: "张三",
-          gender: "男",
-          age: 20,
-          city: "北京",
-          date: "2021-01-01",
-        },
-        {
-          id: 2,
-          name: "李四",
-          gender: "女",
-          age: 21,
-          city: "上海",
-          date: "2021-01-02",
-        },
-        {
-          id: 3,
-          name: "王五",
-          gender: "男",
-          age: 22,
-          city: "广州",
-          date: "2021-01-03",
-        },
-        {
-          id: 4,
-          name: "赵六",
-          gender: "女",
-          age: 23,
-          city: "深圳",
-          date: "2021-01-04",
-        },
-      ],
-      disabledRowIndex: null,
-      disabledCellProp: null,
-      disabledCell: { row: null, prop: null },
-    };
-  },
-  computed: {
-    options() {
-      return {
-        editConfig: {
-          mode: "row",
-          batch: true,
-          edit: true,
-          isRowEdit: ({ row, $index }) => {
-            // 如果设置了禁用行索引，则该行不可编辑
-            if (this.disabledRowIndex !== null) {
-              return $index !== this.disabledRowIndex;
-            }
-            return true;
-          },
-        },
-        renderColumns: [
-          {
-            prop: "name",
-            label: "姓名",
-            isEdit: ({ row, $index }) => {
-              if (
-                this.disabledCell.row === 0 &&
-                this.disabledCell.prop === "name"
-              ) {
-                return $index !== 0;
-              }
-              return this.disabledCellProp !== "name";
-            },
-          },
-          {
-            prop: "gender",
-            label: "性别",
-            isEdit: ({ row, $index }) => {
-              if (
-                this.disabledCell.row === 0 &&
-                this.disabledCell.prop === "gender"
-              ) {
-                return $index !== 0;
-              }
-              return this.disabledCellProp !== "gender";
-            },
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "男", label: "男" },
-                  { value: "女", label: "女" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "age",
-            label: "年龄",
-            isEdit: ({ row, $index }) => {
-              if (
-                this.disabledCell.row === 0 &&
-                this.disabledCell.prop === "age"
-              ) {
-                return $index !== 0;
-              }
-              return this.disabledCellProp !== "age";
-            },
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: 20, label: "20" },
-                  { value: 21, label: "21" },
-                  { value: 22, label: "22" },
-                  { value: 23, label: "23" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "city",
-            label: "城市",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "北京", label: "北京" },
-                  { value: "上海", label: "上海" },
-                  { value: "广州", label: "广州" },
-                  { value: "深圳", label: "深圳" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "date",
-            label: "日期",
-            form: {
-              comp: {
-                name: "el-date-picker",
-                props: {
-                  type: "date",
-                  placeholder: "选择日期",
-                  format: "yyyy-MM-dd",
-                  valueFormat: "yyyy-MM-dd",
-                },
-              },
-            },
-          },
-        ],
-      };
-    },
-  },
-  methods: {
-    // 控制行编辑状态
-    handleRowChange(index) {
-      this.disabledRowIndex = index;
-      this.$refs.crud.clearAllEdit();
-    },
-
-    // 控制单元格编辑状态
-    handleColumnChange(prop) {
-      this.disabledCellProp = prop;
-      this.$refs.crud.clearAllEdit();
-    },
-    handleCellChange(prop) {
-      if (prop === null) {
-        this.disabledCell = { row: null, prop: null };
-      } else {
-        // 设置第一行的指定列单元格为禁用状态
-        this.disabledCell = { row: 0, prop };
-      }
-      this.$refs.crud.clearAllEdit();
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/tableEdit/dialog.vue

@@ -1,172 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :search.sync="searchForm"
-      :options="options"
-      :data="data"
-      @add="add"
-      @edit="edit"
-      @view="view"
-      @save="save"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      options: {
-        editConfig: {
-          mode: "dialog",
-          edit: {},
-          add: {
-            addType: "first",
-          },
-          view: {},
-          delete: true,
-          lastAdd: {},
-        },
-        dialog: {}, // 自定义弹窗配置
-        formOptions: {}, // 自定义表单配置
-        renderColumns: [
-          {
-            prop: "name",
-            label: "姓名",
-            form: {},
-          },
-          {
-            prop: "gender",
-            label: "性别",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "男", label: "男" },
-                  { value: "女", label: "女" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "age",
-            label: "年龄",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: 20, label: "20" },
-                  { value: 21, label: "21" },
-                  { value: 22, label: "22" },
-                  { value: 23, label: "23" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "city",
-            label: "城市",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "北京", label: "北京" },
-                  { value: "上海", label: "上海" },
-                  { value: "广州", label: "广州" },
-                  { value: "深圳", label: "深圳" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "date",
-            label: "日期",
-            form: {
-              comp: {
-                name: "el-date-picker",
-                props: {
-                  type: "date",
-                  placeholder: "选择日期",
-                  valueFormat: "yyyy-MM-dd",
-                },
-              },
-            },
-          },
-        ],
-      },
-      data: [
-        {
-          id: 1,
-          name: "张三",
-          gender: "男",
-          age: 20,
-          city: "北京",
-          date: "2021-01-01",
-        },
-        {
-          id: 2,
-          name: "李四",
-          gender: "女",
-          age: 21,
-          city: "上海",
-          date: "2021-01-02",
-        },
-        {
-          id: 3,
-          name: "王五",
-          gender: "男",
-          age: 22,
-          city: "广州",
-          date: "2021-01-03",
-        },
-        {
-          id: 4,
-          name: "赵六",
-          gender: "女",
-          age: 23,
-          city: "深圳",
-          date: "2021-01-04",
-        },
-        {
-          id: 5,
-          name: "孙七",
-          gender: "男",
-          age: 24,
-          city: "成都",
-          date: "2021-01-05",
-        },
-        {
-          id: 6,
-          name: "周八",
-          gender: "女",
-          age: 25,
-          city: "重庆",
-          date: "2021-01-06",
-        },
-      ],
-    };
-  },
-  methods: {
-    add(done, scope) {
-      this.$message("点击新增");
-      done();
-    },
-    edit(done, scope) {
-      this.$message("点击编辑");
-      done();
-    },
-    view(done, scope) {
-      this.$message("点击查看");
-      done();
-    },
-    save(done, scope) {
-      setTimeout(() => {
-        done();
-        this.$message("点击保存");
-      }, 500);
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/tableEdit/free.vue

@@ -1,88 +0,0 @@
-<template>
-  <div>
-    <sc-crud :search.sync="searchForm" :options="options" :data="data">
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      data: [
-        {
-          id: 1,
-          name: "张三",
-          gender: "男",
-          age: 20,
-          city: "北京",
-          date: "2021-01-01",
-        },
-        {
-          id: 2,
-          name: "李四",
-          gender: "女",
-          age: 21,
-          city: "上海",
-          date: "2021-01-02",
-        },
-        {
-          id: 3,
-          name: "王五",
-          gender: "男",
-          age: 22,
-          city: "广州",
-          date: "2021-01-03",
-        },
-        {
-          id: 4,
-          name: "赵六",
-          gender: "女",
-          age: 23,
-          city: "深圳",
-          date: "2021-01-04",
-        },
-      ],
-      isEdit: true,
-    };
-  },
-  computed: {
-    options() {
-      return {
-        editConfig: {
-          mode: "free",
-        },
-        renderColumns: [
-          { prop: "name", label: "姓名" },
-          {
-            prop: "gender",
-            label: "性别",
-          },
-          {
-            prop: "age",
-            label: "年龄",
-            form: {
-              comp: {
-                name: "el-select",
-                options: [
-                  { value: "1", label: "选项1" },
-                  { value: "2", label: "选项2" },
-                ],
-              },
-            },
-          },
-          {
-            prop: "city",
-            label: "城市",
-          },
-          {
-            prop: "date",
-            label: "日期",
-          },
-        ],
-      };
-    },
-  },
-};
-</script>