@panpanzhao/component-ui 1.0.2 → 1.24.813

package/lib/components/table.js

@@ -82,7 +82,7 @@ module.exports =
 /******/
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 75);
+/******/ 	return __webpack_require__(__webpack_require__.s = 76);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -197,6 +197,13 @@ function normalizeComponent(
 }
 
 
+/***/ }),
+
+/***/ 12:
+/***/ (function(module, exports) {
+
+module.exports = require("element-ui/lib/message");
+
 /***/ }),
 
 /***/ 18:
@@ -213,7 +220,7 @@ module.exports = require("lodash");
 
 /***/ }),
 
-/***/ 20:
+/***/ 22:
 /***/ (function(module, exports) {
 
 module.exports = require("element-ui/lib/table-column");
@@ -255,15 +262,15 @@ module.exports = require("element-ui/lib/pagination");
 
 /***/ }),
 
-/***/ 75:
+/***/ 76:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 // ESM COMPAT FLAG
 __webpack_require__.r(__webpack_exports__);
 
-// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_css-loader@2.1.1_lodash@4.17.21_vue-template-compiler@2.7.16_webpack@4.47.0/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_css-loader@2.1.1_lodash@4.17.21_vue-template-compiler@2.7.16_webpack@4.47.0/node_modules/vue-loader/lib??vue-loader-options!./src/components/table/src/table.vue?vue&type=template&id=1a5269fa
-var tablevue_type_template_id_1a5269fa_render = function render() {
+// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_css-loader@2.1.1_lodash@4.17.21_vue-template-compiler@2.7.16_webpack@4.47.0/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_css-loader@2.1.1_lodash@4.17.21_vue-template-compiler@2.7.16_webpack@4.47.0/node_modules/vue-loader/lib??vue-loader-options!./src/components/table/src/table.vue?vue&type=template&id=31feda6c
+var tablevue_type_template_id_31feda6c_render = function render() {
   var _vm = this,
     _c = _vm._self._c
   return _c("div", { staticClass: "table" }, [
@@ -324,28 +331,121 @@ var tablevue_type_template_id_1a5269fa_render = function render() {
       1
     ),
     _vm.pagination
-      ? _c(
-          "div",
-          { staticClass: "table__pagination" },
-          [
-            _c(
-              "el-pagination",
-              _vm._g(
-                _vm._b({}, "el-pagination", _vm.paginationProps, false),
-                _vm.paginationListeners
+      ? _c("div", { staticClass: "table__pagination" }, [
+          _c(
+            "div",
+            [
+              _c(
+                "el-pagination",
+                _vm._g(
+                  _vm._b({}, "el-pagination", _vm.paginationProps, false),
+                  _vm.paginationListeners
+                )
+              ),
+            ],
+            1
+          ),
+          _vm.columnsKey
+            ? _c(
+                "div",
+                [
+                  _c("el-popover", { attrs: { placement: "top" } }, [
+                    _c("div", { staticClass: "table-setting" }, [
+                      _c(
+                        "div",
+                        { staticClass: "table-setting__title" },
+                        [
+                          _c("el-input", {
+                            attrs: { size: "small", placeholder: "请输入列名" },
+                            model: {
+                              value: _vm.columnKey,
+                              callback: function ($$v) {
+                                _vm.columnKey = $$v
+                              },
+                              expression: "columnKey",
+                            },
+                          }),
+                        ],
+                        1
+                      ),
+                      _c(
+                        "div",
+                        { staticClass: "table-setting__body" },
+                        _vm._l(_vm.columnsSetting, function (item) {
+                          return _c(
+                            "div",
+                            { key: item.prop, staticClass: "item" },
+                            [
+                              _c("el-switch", {
+                                on: {
+                                  change: (value) =>
+                                    _vm.handleSetting(value, item),
+                                },
+                                model: {
+                                  value: item.disable,
+                                  callback: function ($$v) {
+                                    _vm.$set(item, "disable", $$v)
+                                  },
+                                  expression: "item.disable",
+                                },
+                              }),
+                              _c("span", { staticClass: "item-label" }, [
+                                _vm._v(_vm._s(item.label)),
+                              ]),
+                            ],
+                            1
+                          )
+                        }),
+                        0
+                      ),
+                      _c(
+                        "div",
+                        {
+                          staticStyle: {
+                            "text-align": "right",
+                            "margin-top": "10px",
+                          },
+                        },
+                        [
+                          _c(
+                            "el-button",
+                            {
+                              attrs: { size: "mini" },
+                              on: { click: _vm.resetColumn },
+                            },
+                            [_vm._v("重置")]
+                          ),
+                          _c(
+                            "el-button",
+                            {
+                              attrs: { type: "primary", size: "mini" },
+                              on: { click: _vm.saveColumn },
+                            },
+                            [_vm._v("保存")]
+                          ),
+                        ],
+                        1
+                      ),
+                    ]),
+                    _c(
+                      "span",
+                      { attrs: { slot: "reference" }, slot: "reference" },
+                      [_c("i", { staticClass: "el-icon-s-grid" })]
+                    ),
+                  ]),
+                ],
+                1
               )
-            ),
-          ],
-          1
-        )
+            : _vm._e(),
+        ])
       : _vm._e(),
   ])
 }
 var staticRenderFns = []
-tablevue_type_template_id_1a5269fa_render._withStripped = true
+tablevue_type_template_id_31feda6c_render._withStripped = true
 
 
-// CONCATENATED MODULE: ./src/components/table/src/table.vue?vue&type=template&id=1a5269fa
+// CONCATENATED MODULE: ./src/components/table/src/table.vue?vue&type=template&id=31feda6c
 
 // EXTERNAL MODULE: external "@vue/babel-helper-vue-jsx-merge-props"
 var babel_helper_vue_jsx_merge_props_ = __webpack_require__(0);
@@ -360,7 +460,7 @@ var table_ = __webpack_require__(32);
 var table_default = /*#__PURE__*/__webpack_require__.n(table_);
 
 // EXTERNAL MODULE: external "element-ui/lib/table-column"
-var table_column_ = __webpack_require__(20);
+var table_column_ = __webpack_require__(22);
 var table_column_default = /*#__PURE__*/__webpack_require__.n(table_column_);
 
 // EXTERNAL MODULE: external "element-ui/lib/pagination"
@@ -380,6 +480,10 @@ var index_ = __webpack_require__(18);
 // EXTERNAL MODULE: external "lodash"
 var external_lodash_ = __webpack_require__(2);
 
+// EXTERNAL MODULE: external "element-ui/lib/message"
+var message_ = __webpack_require__(12);
+var message_default = /*#__PURE__*/__webpack_require__.n(message_);
+
 // CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.3.0_@babel+core@7.23.9_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_css-loader@2.1.1_lodash@4.17.21_vue-template-compiler@2.7.16_webpack@4.47.0/node_modules/vue-loader/lib??vue-loader-options!./src/components/table/src/table.vue?vue&type=script&lang=js
 
 
@@ -390,6 +494,7 @@ var external_lodash_ = __webpack_require__(2);
 
 
 
+
 /* harmony default export */ var tablevue_type_script_lang_js = ({
   name: "Table",
   componentName: "Table",
@@ -494,6 +599,7 @@ var external_lodash_ = __webpack_require__(2);
       }
     },
     dataSource: Object,
+    columnsKey: String,
     columns: {
       type: Array,
       default: function _default() {
@@ -532,7 +638,9 @@ var external_lodash_ = __webpack_require__(2);
       remoteData: null,
       currentPage: 1,
       pageSize: 10,
-      total: 0
+      total: 0,
+      columnKey: null,
+      columnMap: {}
     };
   },
   watch: {
@@ -542,13 +650,34 @@ var external_lodash_ = __webpack_require__(2);
     }
   },
   computed: {
-    filterColumns: function filterColumns() {
+    columnsSetting: function columnsSetting() {
       var _this2 = this;
+      var columns = this.columns.reduce(function (pre, cur) {
+        if (["Sequence", "Selection", "Operate"].indexOf(cur.control) > -1) {
+          return pre;
+        }
+        if (_this2.columnKey && cur.label && cur.label.indexOf(_this2.columnKey) === -1) {
+          return pre;
+        }
+        pre.push({
+          prop: cur.prop,
+          label: cur.label,
+          disable: _this2.columnMap[cur.prop] === false ? false : true
+        });
+        return pre;
+      }, []);
+      return columns;
+    },
+    filterColumns: function filterColumns() {
+      var _this3 = this;
       return this.columns.filter(function (item) {
+        if (_this3.columnMap[item.prop] === false) {
+          return false;
+        }
         if (item.show === false) {
           return false;
         }
-        if (typeof item.show === "function" && !item.show.call(_this2, {
+        if (typeof item.show === "function" && !item.show.call(_this3, {
           item: item
         })) {
           return false;
@@ -582,32 +711,32 @@ var external_lodash_ = __webpack_require__(2);
       });
     },
     tableListeners: function tableListeners() {
-      var _this3 = this;
+      var _this4 = this;
       return Object.assign({}, this.$listeners, this.on, {
         "row-click": function rowClick(row) {
-          var selectColumns = _this3.columns.filter(function (item) {
+          var selectColumns = _this4.columns.filter(function (item) {
             return item.control === "Selection";
           });
           if (selectColumns && selectColumns.length > 0) {
             var selectColumn = selectColumns[0];
             if (selectColumn.type === "radio") {
-              var key = selectColumn.prop || _this3.tableProps.rowKey;
-              _this3.rowId = row[key];
-              _this3.selection = [row];
+              var key = selectColumn.prop || _this4.tableProps.rowKey;
+              _this4.rowId = row[key];
+              _this4.selection = [row];
             } else {
-              _this3.$refs.table.toggleRowSelection(row); // 点击选中
+              _this4.$refs.table.toggleRowSelection(row); // 点击选中
             }
           }
-          _this3.$emit("row-click", row);
-          if (typeof _this3.on["row-click"] === "function") {
-            _this3.on["row-click"].call(_this3, row);
+          _this4.$emit("row-click", row);
+          if (typeof _this4.on["row-click"] === "function") {
+            _this4.on["row-click"].call(_this4, row);
           }
         },
         "selection-change": function selectionChange(selection) {
-          _this3.selection = selection;
-          _this3.$emit("selection-change", selection);
-          if (typeof _this3.on["selection-change"] === "function") {
-            _this3.on["selection-change"].call(_this3, selection);
+          _this4.selection = selection;
+          _this4.$emit("selection-change", selection);
+          if (typeof _this4.on["selection-change"] === "function") {
+            _this4.on["selection-change"].call(_this4, selection);
           }
         }
       });
@@ -626,27 +755,37 @@ var external_lodash_ = __webpack_require__(2);
       });
     },
     paginationListeners: function paginationListeners() {
-      var _this4 = this;
+      var _this5 = this;
       return Object.assign({}, this.pagination.on, {
         "size-change": function sizeChange(pageSize) {
-          _this4.$emit("size-change", pageSize);
-          _this4.pageSize = pageSize;
-          _this4.$emit("pageChange", _this4.paginationProps.currentPage, pageSize);
-          _this4.search();
+          _this5.$emit("size-change", pageSize);
+          _this5.pageSize = pageSize;
+          _this5.$emit("pageChange", _this5.paginationProps.currentPage, pageSize);
+          _this5.search();
         },
         "current-change": function currentChange(currentPage) {
-          _this4.$emit("current-change", currentPage);
-          _this4.currentPage = currentPage;
-          _this4.$emit("pageChange", currentPage, _this4.paginationProps.pageSize);
-          _this4.search();
+          _this5.$emit("current-change", currentPage);
+          _this5.currentPage = currentPage;
+          _this5.$emit("pageChange", currentPage, _this5.paginationProps.pageSize);
+          _this5.search();
         }
       });
     }
   },
   created: function created() {
+    var _this6 = this;
     if (this.pagination && this.pagination.pageSize) {
       this.pageSize = this.pagination.pageSize;
     }
+    if (this.columnsKey) {
+      var columnStorage = JSON.parse(localStorage.getItem("component_columns") || "{}");
+      var columnList = columnStorage && columnStorage[this.columnsKey];
+      if (columnList) {
+        columnList.forEach(function (prop) {
+          _this6.$set(_this6.columnMap, prop, false);
+        });
+      }
+    }
   },
   mounted: function mounted() {
     if (this.hasInit) {
@@ -662,11 +801,11 @@ var external_lodash_ = __webpack_require__(2);
       this.search();
     },
     search: function search() {
-      var _this5 = this;
+      var _this7 = this;
       if (!(this.requester && this.api.url)) {
         return false;
       }
-      var reqData = Object.assign({}, this.api.data);
+      var reqData = Object.assign({}, this.api.body, this.api.data);
       if (this.pagination) {
         Object(external_lodash_["set"])(reqData, this.remoteDataProp.currentPage, this.currentPage);
         Object(external_lodash_["set"])(reqData, this.remoteDataProp.pageSize, this.pageSize);
@@ -684,26 +823,48 @@ var external_lodash_ = __webpack_require__(2);
         headers: this.api.headers,
         data: reqData
       }).then(function (res) {
-        if (typeof _this5.api.after === "function") {
-          res = _this5.api.after.call(_this5, res);
+        if (typeof _this7.api.after === "function") {
+          res = _this7.api.after.call(_this7, res);
         }
-        _this5.remoteData = _this5.remoteDataProp.data ? Object(external_lodash_["get"])(res, _this5.remoteDataProp.data, []) : res;
-        if (_this5.pagination) {
-          _this5.total = Object(external_lodash_["get"])(res, _this5.remoteDataProp.total, 0);
+        _this7.remoteData = _this7.remoteDataProp.data ? Object(external_lodash_["get"])(res, _this7.remoteDataProp.data, []) : res;
+        if (_this7.pagination) {
+          _this7.total = Object(external_lodash_["get"])(res, _this7.remoteDataProp.total, 0);
         }
-        _this5.$emit("success", {
-          request: _this5.requester,
+        _this7.$emit("success", {
+          request: _this7.requester,
           reqData: reqData,
           resData: res
         });
       }).catch(function (error) {
-        _this5.remoteData = [], _this5.total = 0;
-        _this5.$emit("error", {
-          request: _this5.requester,
+        _this7.remoteData = [], _this7.total = 0;
+        _this7.$emit("error", {
+          request: _this7.requester,
           reqData: reqData,
           resError: error
         });
       });
+    },
+    resetColumn: function resetColumn() {
+      this.columnMap = {};
+    },
+    saveColumn: function saveColumn() {
+      var _this8 = this;
+      var columnStorage = JSON.parse(localStorage.getItem("component_columns") || "{}");
+      columnStorage[this.columnsKey] = Object.keys(this.columnMap).filter(function (itemKey) {
+        if (_this8.columnMap[itemKey] === false) {
+          return true;
+        }
+        return false;
+      });
+      localStorage.setItem("component_columns", JSON.stringify(columnStorage));
+      message_default()({
+        showClose: true,
+        message: "设置成功",
+        type: "success"
+      });
+    },
+    handleSetting: function handleSetting(value, item) {
+      this.$set(this.columnMap, item.prop, value);
     }
   }
 });
@@ -722,7 +883,7 @@ var componentNormalizer = __webpack_require__(1);
 
 var component = Object(componentNormalizer["a" /* default */])(
   src_tablevue_type_script_lang_js,
-  tablevue_type_template_id_1a5269fa_render,
+  tablevue_type_template_id_31feda6c_render,
   staticRenderFns,
   false,
   null,