vue-super-crud 1.7.1 → 1.7.4

package/docs/.vuepress/components/crud/crudEvents/events.vue

@@ -1,188 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :search.sync="searchForm"
-      :options="options"
-      :data="data"
-      @view="view"
-      @add="add"
-      @edit="edit"
-      @save="save"
-      @delete="handleDelete"
-      @cancel="cancel"
-      @change="change"
-      @getDetail="getDetail"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      options: {
-        action: {
-          view: true,
-          edit: true,
-          delete: true,
-        },
-        handleRow: {
-          add: true,
-        },
-        renderColumns: [
-          { prop: "name", label: "昵称", search: true, form: true },
-          {
-            prop: "username",
-            label: "姓名",
-            search: {
-              comp: {
-                name: "el-date-picker",
-              },
-            },
-            form: true,
-          },
-          {
-            prop: "gender",
-            label: "性别",
-            form: true,
-          },
-        ],
-      },
-      data: [
-        {
-          createTime: "2018-06-02 12:28:47",
-          createUser: 94,
-          id: 56,
-          idNumber: "8",
-          name: "识间华中张认",
-          password: "sed laboris",
-          phone: "18157668675",
-          gender: "男",
-          age: 20,
-          status: 35,
-          updateTime: "2018-09-08 16:33:19",
-          updateUser: 58,
-          username: "石洋",
-        },
-      ],
-    };
-  },
-  methods: {
-    getDetail(done, scope, unLoading) {
-      this.detailApi().then((res) => {
-        done(res.data);
-        this.$message.success("获取详情");
-      });
-    },
-    // 点击新增触发 add（行编辑与单元格编辑只有在保存后才会改变数据）
-    add(done, scope, unLoading) {
-      this.$message.success("新增自定义参数");
-      // 传入自定义新增参数
-      done({
-        name: "测试",
-        username: "自定义新增参数",
-        gender: "男",
-      });
-    },
-    // 点击编辑触发 edit
-    edit(done, scope, unLoading) {
-      done({
-        // 自定义进入编辑时的参数
-        ...scope.row,
-        username: "自定义进入编辑时的参数",
-      });
-    },
-    // 点击保存触发 save（自由编辑没有save事件）
-    save(done, scope, unLoading) {
-      console.log(scope.mode);
-      if (scope.mode === "add") {
-        this.addApi(scope.row).then((res) => {
-          done({
-            // 自定义保存参数
-            ...scope.row,
-            gender: "自定义保存参数",
-          });
-        });
-      } else {
-        this.editApi(scope.row)
-          .then((res) => {})
-          .catch(() => {
-            unLoading(); // 失败时，手动停止loading
-            this.$message.error("保存失败");
-          });
-      }
-    },
-    // 点击查看触发 view
-    view(done, scope, unLoading) {
-      done();
-    },
-    // 点击删除触发 delete
-    handleDelete(done, scope, unLoading) {
-      this.deleteApi(scope.row).then((res) => {
-        done();
-      });
-    },
-    // 点击取消触发 cancel
-    cancel(done) {
-      done();
-      this.$message.success("取消编辑");
-    },
-    // 数据变化触发
-    change(done, scope) {
-      done();
-      setTimeout(() => {
-        this.$message.success("change，事件模式：" + scope.mode);
-      }, 500);
-    },
-    // 模拟请求api，在真实请求中除了 detailApi 不需要传参给本地，刷新列表即可
-    addApi(params) {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          resolve();
-        }, 500);
-      });
-    },
-    editApi(params) {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          reject();
-        }, 500);
-      });
-    },
-    deleteApi() {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          resolve();
-        }, 500);
-      });
-    },
-    detailApi(scope) {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          resolve({
-            code: 200,
-            msg: "success",
-            data: {
-              createTime: "2018-06-02 12:28:47",
-              createUser: 94,
-              id: 56,
-              idNumber: "8",
-              name: "识间华中张认1",
-              password: "sed laboris",
-              phone: "18157668675",
-              gender: "男",
-              age: 20,
-              status: 35,
-              updateTime: "2018-09-08 16:33:19",
-              updateUser: 58,
-              username: "石洋1",
-            },
-          });
-        }, 500);
-      });
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/dataSort/base.vue

@@ -1,142 +0,0 @@
-<template>
-  <div>
-    <sc-crud title="原始数据" :options="rawOptions" :data="rawData" />
-
-    <sc-crud title="排序后数据" :options="options" :data="tableData" />
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    const columns = [
-      {
-        prop: "province",
-        label: "省份",
-        render: (h, { row }) => {
-          // 使用不同颜色区分不同省份
-          const colors = {
-            浙江: "#409EFF", // 蓝色
-            江苏: "#67C23A", // 绿色
-          };
-          return (
-            <span
-              style={{
-                color: colors[row.province] || "#909399",
-                fontWeight: "bold",
-              }}
-            >
-              {row.province}
-            </span>
-          );
-        },
-      },
-      {
-        prop: "city",
-        label: "城市",
-      },
-      { prop: "amount", label: "交易金额" },
-      { prop: "company", label: "公司名称" },
-    ];
-    return {
-      rawOptions: {
-        renderColumns: columns,
-      },
-      options: {
-        // 按省份、城市、交易金额的顺序进行多层级排序
-        sortProps: ["province", "city", "amount"],
-        sortMethod: (field, a, b) => {
-          if (field === "amount") {
-            return b[field] - a[field];
-          }
-        },
-        renderColumns: columns,
-      },
-      tableData: [],
-      rawData: [
-        {
-          province: "浙江",
-          city: "宁波",
-          company: "宁波中百",
-          amount: 3000,
-        },
-        {
-          province: "江苏",
-          city: "南京",
-          company: "南京银行",
-          amount: 9000,
-        },
-        {
-          province: "江苏",
-          city: "南京",
-          company: "南京银行",
-          amount: 4000,
-        },
-        {
-          province: "江苏",
-          city: "南京",
-          company: "南京银行",
-          amount: 3000,
-        },
-        {
-          province: "浙江",
-          city: "杭州",
-          company: "网易",
-          amount: 8000,
-        },
-        {
-          province: "江苏",
-          city: "苏州",
-          company: "苏州工业园",
-          amount: 4000,
-        },
-        {
-          province: "浙江",
-          city: "杭州",
-          company: "大华",
-          amount: 6000,
-        },
-        {
-          province: "浙江",
-          city: "宁波",
-          company: "杉杉股份",
-          amount: 5000,
-        },
-        {
-          province: "浙江",
-          city: "宁波",
-          company: "宁波中百",
-          amount: 1000,
-        },
-        {
-          province: "江苏",
-          city: "南京",
-          company: "南瑞集团",
-          amount: 7000,
-        },
-        {
-          province: "浙江",
-          city: "杭州",
-          company: "阿里巴巴",
-          amount: 10000,
-        },
-        {
-          province: "浙江",
-          city: "宁波",
-          company: "宁波中百",
-          amount: 2000,
-        },
-        {
-          province: "浙江",
-          city: "宁波",
-          company: "宁波中百",
-          amount: 3000,
-        },
-      ],
-    };
-  },
-  mounted() {
-    this.tableData = [...this.rawData];
-  },
-};
-</script>

package/docs/.vuepress/components/crud/genDynamicColumns/base.vue

@@ -1,53 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :loading.sync="loading"
-      :search.sync="search"
-      :options="options"
-      :data="data"
-      :total="total"
-      @getList="getList"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-import { mockApi } from "../../mock";
-export default {
-  data() {
-    return {
-      loading: false,
-      search: {
-        pageNum: 1,
-        pageSize: 10,
-      },
-      options: {
-        init: true,
-        dynamicConfig: [
-          {
-            path: "firstChildren",
-            prop: "id",
-            label: "name",
-          },
-        ],
-        renderColumns: [
-          { prop: "materialCode", label: "编码" },
-          { prop: "materialName", label: "名称" },
-        ],
-      },
-      data: [],
-      total: 0,
-    };
-  },
-  methods: {
-    async getList() {
-      this.loading = true;
-      const { data, total } = await mockApi.getDynamicData(this.search);
-      this.data = data;
-      this.total = total;
-      this.loading = false;
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/genDynamicColumns/dynamicAndFixed.vue

@@ -1,111 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :loading.sync="loading"
-      :search.sync="search"
-      :options="options"
-      :data="data"
-      :total="total"
-      @getList="getList"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-import { mockApi } from "../../mock";
-export default {
-  data() {
-    return {
-      loading: false,
-      search: {
-        pageNum: 1,
-        pageSize: 10,
-      },
-      options: {
-        init: true,
-        dynamicConfig: [
-          {
-            path: "firstChildren",
-            prop: "id",
-            label: "name",
-            columnConfig: (path, source) => {
-              return {
-                render: () => <div>空</div>,
-              };
-            },
-          },
-          {
-            path: "secondChildren",
-            prop: "sort",
-            label: (item) => `第${item.sort}轮报价`,
-            columnConfig: (path, source) => {
-              return {
-                children: [
-                  {
-                    label: "入选",
-                    prop: `${path}.choose`,
-                    comp: {
-                      name: "el-checkbox",
-                      trueLabel: "Y",
-                      falseLabel: "N",
-                    },
-                  },
-                  {
-                    label: "单价",
-                    prop: `${path}.productUnitPrice`,
-                    render: (h, { row }) => {
-                      return (
-                        <el-input
-                          v-model={source[row.$index].productUnitPrice}
-                        />
-                      );
-                    },
-                  },
-                  {
-                    label: "跟价",
-                    prop: `${path}.priceFollow`,
-                    render: (h, { row }) => {
-                      if (!source[row.$index].priceFollow) return;
-                      const isFollow = source[row.$index].priceFollow === "Y";
-                      return (
-                        <span
-                          style={{ color: isFollow ? "#67C23A" : "#F56C6C" }}
-                        >
-                          {isFollow ? "是" : "否"}
-                        </span>
-                      );
-                    },
-                  },
-                  {
-                    label: "降幅比例",
-                    prop: `${path}.pricePercentageChange`,
-                    formatter: (row) =>
-                      source[row.$index].pricePercentageChange &&
-                      source[row.$index].pricePercentageChange * 100 + "%",
-                  },
-                ],
-              };
-            },
-          },
-        ],
-        renderColumns: [
-          { prop: "materialCode", label: "编码" },
-          { prop: "materialName", label: "名称" },
-        ],
-      },
-      data: [],
-      total: 0,
-    };
-  },
-  methods: {
-    async getList() {
-      this.loading = true;
-      const { data, total } = await mockApi.getDynamicData(this.search);
-      this.data = data;
-      this.total = total;
-      this.loading = false;
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/genDynamicColumns/treeDynamic.vue

@@ -1,68 +0,0 @@
-<template>
-  <div>
-    <sc-crud
-      :loading.sync="loading"
-      :search.sync="search"
-      :options="options"
-      :data="data"
-      :total="total"
-      @getList="getList"
-    >
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-import { mockApi } from "../../mock";
-export default {
-  data() {
-    return {
-      loading: false,
-      search: {
-        pageNum: 1,
-        pageSize: 10,
-      },
-      options: {
-        init: true,
-        dynamicConfig: [
-          {
-            path: "firstChildren",
-            prop: "id",
-            label: "name",
-            columnConfig: (path, source) => {
-              return {
-                render: () => <div>空</div>,
-              };
-            },
-          },
-          {
-            path: "secondChildren",
-            prop: "sort",
-            label: (item) => `第${item.sort}轮报价`,
-            columnConfig: (path, source) => {
-              return {
-                prop: `${path}.productUnitPrice`,
-              };
-            },
-          },
-        ],
-        renderColumns: [
-          { prop: "materialCode", label: "编码" },
-          { prop: "materialName", label: "名称" },
-        ],
-      },
-      data: [],
-      total: 0,
-    };
-  },
-  methods: {
-    async getList() {
-      this.loading = true;
-      const { data, total } = await mockApi.getDynamicData(this.search);
-      this.data = data;
-      this.total = total;
-      this.loading = false;
-    },
-  },
-};
-</script>

package/docs/.vuepress/components/crud/handleBar/handleRow.vue

@@ -1,65 +0,0 @@
-<template>
-  <div>
-    <sc-crud :search.sync="searchForm" :options="options" :data="data">
-      <template #handleRow-left="{size}">
-        <el-button :size="size">handleRow插槽</el-button>
-      </template>
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      options: {
-        rowEdit: true,
-        handleRow: {
-          add: {
-            label: "自定义弹窗新增",
-          }, // 自定义弹窗新增按钮
-          batchDelete: {
-            label: "自定义批量删除",
-          }, // 自定义批量删除按钮
-          rowAdd: {
-            label: "定义行新增",
-          }, // 自定义行新增按钮
-        },
-        renderColumns: [
-          { prop: "name", label: "昵称", search: true },
-          {
-            prop: "username",
-            label: "姓名",
-            search: {
-              name: "el-date-picker",
-            },
-          },
-          {
-            prop: "gender",
-            label: "性别",
-          },
-        ],
-      },
-      data: [
-        {
-          createTime: "2018-06-02 12:28:47",
-          createUser: 94,
-          id: 56,
-          idNumber: "8",
-          name: "识间华中张认",
-          password: "sed laboris",
-          phone: "18157668675",
-          gender: "男",
-          age: 20,
-          status: 35,
-          updateTime: "2018-09-08 16:33:19",
-          updateUser: 58,
-          username: "石洋",
-        },
-      ],
-    };
-  },
-  methods: {},
-};
-</script>

package/docs/.vuepress/components/crud/handleBar/toolbar.vue

@@ -1,69 +0,0 @@
-<template>
-  <div>
-    <sc-crud :search.sync="searchForm" :options="options" :data="data">
-      <template #toolbar-left="config">
-        <!-- ctx为crud组件实例 -->
-        <el-button :size="config.size">toolbar插槽</el-button>
-      </template>
-    </sc-crud>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      searchForm: {},
-      options: {
-        // 不需要自定义内置按钮时可以简写为数组 toolbar: [{label: "自定义按钮"...}]
-        toolbar: {
-          search: {
-            label: "自定义搜索显隐", // 自定义 hover 提示词
-          },
-          reset: {
-            label: "自定义重置", // 自定义 hover 提示词
-          },
-          zoom: {
-            label: "自定义最大化", // 自定义 hover 提示词
-          },
-          column: {
-            label: "自定义列设置", // 自定义 hover 提示词
-          },
-        },
-        renderColumns: [
-          { prop: "name", label: "昵称", search: true },
-          {
-            prop: "username",
-            label: "姓名",
-            search: {
-              name: "el-date-picker",
-            },
-          },
-          {
-            prop: "gender",
-            label: "性别",
-          },
-        ],
-      },
-      data: [
-        {
-          createTime: "2018-06-02 12:28:47",
-          createUser: 94,
-          id: 56,
-          idNumber: "8",
-          name: "识间华中张认",
-          password: "sed laboris",
-          phone: "18157668675",
-          gender: "男",
-          age: 20,
-          status: 35,
-          updateTime: "2018-09-08 16:33:19",
-          updateUser: 58,
-          username: "石洋",
-        },
-      ],
-    };
-  },
-  methods: {},
-};
-</script>