vue-super-crud 1.7.1

package/docs/.vuepress/components/crud/buttons/common.vue

@@ -0,0 +1,115 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        action: {
+          handles: [
+            {
+              icon: "el-icon-search",
+              label: "自定义按钮隐藏",
+              hidden: (scope) => {
+                return scope.$index === 0;
+              },
+            },
+          ],
+        },
+        handleRow: {
+          tempGlobalButton: {
+            label: "自定义temp按钮",
+          },
+          handles: [
+            {
+              label: "自定义按钮",
+              icon: "el-icon-edit",
+              type: "primary",
+              hidden: false,
+              onClick: () => {
+                this.$message.success("自定义按钮");
+              },
+            },
+            {
+              label: "自定义按钮1",
+              icon: "el-icon-edit",
+              type: "primary",
+              round: true,
+            },
+            {
+              label: "折叠按钮",
+              children: [
+                {
+                  label: "折叠按钮1",
+                  icon: "el-icon-search",
+                  onClick: () => {
+                    console.log("折叠按钮1");
+                  },
+                },
+                {
+                  presetType: "add",
+                  label: "自定义新增",
+                  onClick: (scope, rawClick) => {
+                    console.log("自定义新增", rawClick);
+                  },
+                },
+                "add",
+              ],
+            },
+          ],
+        },
+        renderColumns: [
+          { prop: "name", label: "昵称", search: true },
+          {
+            prop: "username",
+            label: "姓名",
+          },
+          {
+            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: "石洋",
+        },
+        {
+          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/buttons/fast.vue

@@ -0,0 +1,82 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        action: {
+          handles: [
+            {
+              icon: "el-icon-circle-check",
+              label: "操作确认",
+              confirm: "操作确认",
+              onClick: (scope) => {
+                this.$message.info("操作确认");
+              },
+            },
+            {
+              icon: "el-icon-circle-check",
+              label: "操作后返回指定页",
+              successBack: () => {
+                this.$router.push({
+                  path: "/",
+                });
+              },
+              onClick: (scope, cb) => {
+                this.$message.info("操作后返回指定页");
+                cb();
+              },
+            },
+          ],
+        },
+        renderColumns: [
+          {
+            prop: "username",
+            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: "石洋",
+        },
+        {
+          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/contextMenu/base.vue

@@ -0,0 +1,72 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        action: [
+          "delete",
+          "edit",
+          {
+            label: "自定义action",
+          },
+        ],
+        contextMenu: {
+          actionBtn: true,
+          copy: true,
+          handles: [
+            {
+              label: "自定义",
+              icon: "el-icon-document-copy",
+              onClick: () => {
+                console.log("自定义");
+              },
+            },
+          ],
+        },
+        renderColumns: [
+          { prop: "name", label: "昵称", search: true },
+          {
+            prop: "username",
+            label: "姓名",
+            search: {
+              comp: {
+                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/copy.vue

@@ -0,0 +1,52 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        renderColumns: [
+          { prop: "name", label: "昵称", search: true },
+          {
+            prop: "username",
+            label: "姓名",
+            search: {
+              comp: {
+                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/crudEvents/api.vue

@@ -0,0 +1,157 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        // 接收promise api 远程调用方法
+        api: {
+          getList: this.listApi,
+          add: this.addApi,
+          edit: (param) => {
+            //自定义api传参
+            console.log(param, "param");
+            return this.editApi(param);
+          },
+          delete: this.deleteApi,
+          getDetail: this.detailApi, // 没有detailApi则默认取表格本地row数据
+        },
+        props: {
+          pageNum: "pageNum", // 分页参数
+          pageSize: "pageSize", // 分页参数
+          listResult: "data", // 列表数据
+          total: "total", // 列表条数
+          detailResult: "data", // 自定义详情返回数据
+        },
+        isLocal: true, // crud是否修改本地数据，在真实请求中可以禁用该项
+        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: [],
+    };
+  },
+  methods: {
+    // 模拟请求api
+    listApi() {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          resolve({
+            code: 200,
+            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: "石洋",
+              },
+              {
+                createTime: "2018-06-02 12:28:47",
+                createUser: 94,
+                id: 57,
+                idNumber: "8",
+                name: "识间华中张认1",
+                password: "sed laboris",
+                phone: "18157668675",
+                gender: "男",
+                age: 20,
+                status: 35,
+                updateTime: "2018-09-08 16:33:19",
+                updateUser: 58,
+                username: "石洋11",
+              },
+            ],
+            total: 2,
+          });
+        }, 1000);
+      });
+    },
+    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);
+      });
+    },
+    // 在真实增删改请求中不需要传参给本地，刷新列表即可
+    addApi(params) {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          resolve(params);
+        }, 500);
+      });
+    },
+    editApi(params) {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          resolve(params);
+        }, 500);
+      });
+    },
+    deleteApi() {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          resolve();
+        }, 500);
+      });
+    },
+  },
+};
+</script>

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

@@ -0,0 +1,93 @@
+<template>
+  <div>
+    <sc-crud :search.sync="searchForm" :options="options" :data="data">
+    </sc-crud>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      searchForm: {},
+      options: {
+        api: {
+          delete: this.deleteApi,
+        },
+        deleteMsgTip: (scope) => `自定义删除${scope.$index + 1}?`, // 删除提示信息，传false则不提示
+        batchDeleteMsgTip: (selectRows) =>
+          `自定义批量删除提示，${selectRows.length}?`, // 批量删除提示信息，传false则不提示
+        successTip: (scope) => "自定义成功提示", // 成功提示信息，传false则不提示
+        isLocal: true,
+        action: {
+          delete: true,
+        },
+        handleRow: {
+          batchDelete: true,
+        },
+        selection: 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: "石洋",
+        },
+        {
+          createTime: "2018-06-02 12:28:47",
+          createUser: 94,
+          id: 57,
+          idNumber: "8",
+          name: "识间华中张认1",
+          password: "sed laboris",
+          phone: "18157668675",
+          gender: "男",
+          age: 20,
+          status: 35,
+          updateTime: "2018-09-08 16:33:19",
+          updateUser: 58,
+          username: "石洋11",
+        },
+      ],
+    };
+  },
+  methods: {
+    // 模拟请求api
+    deleteApi() {
+      return new Promise((resolve, reject) => {
+        setTimeout(() => {
+          resolve();
+        }, 500);
+      });
+    },
+  },
+};
+</script>