Commit cc35f3f075169514b70bb3e8e037c71003683af9
1 parent
fe17acf4
feat(table): 优化组件
Showing
7 changed files
with
123 additions
and
11 deletions
Show diff stats
build/Slot/Slot.js
| @@ -17,6 +17,7 @@ angular.module("esNgAntd").directive("antdSlot", function ($compile) { | @@ -17,6 +17,7 @@ angular.module("esNgAntd").directive("antdSlot", function ($compile) { | ||
| 17 | content: (newValue) => { | 17 | content: (newValue) => { |
| 18 | if (newValue !== undefined) { | 18 | if (newValue !== undefined) { |
| 19 | if (/<[^>]+>/.test(newValue)) { | 19 | if (/<[^>]+>/.test(newValue)) { |
| 20 | + console.log(newValue); | ||
| 20 | $element.replaceWith( | 21 | $element.replaceWith( |
| 21 | $compile(newValue)( | 22 | $compile(newValue)( |
| 22 | $scope.context ? $scope.context : $scope | 23 | $scope.context ? $scope.context : $scope |
build/Table/Table.js
| @@ -67,11 +67,7 @@ angular.module("esNgAntd").directive("antdTable", function (esNgAntd) { | @@ -67,11 +67,7 @@ angular.module("esNgAntd").directive("antdTable", function (esNgAntd) { | ||
| 67 | } | 67 | } |
| 68 | 68 | ||
| 69 | row[column.key] = column.render | 69 | row[column.key] = column.render |
| 70 | - ? column.render( | ||
| 71 | - record[column.key], | ||
| 72 | - record, | ||
| 73 | - index | ||
| 74 | - ) | 70 | + ? $scope.getRender(column, record, index) |
| 75 | : record[column.key]; | 71 | : record[column.key]; |
| 76 | }); // 主键 | 72 | }); // 主键 |
| 77 | 73 | ||
| @@ -108,6 +104,42 @@ angular.module("esNgAntd").directive("antdTable", function (esNgAntd) { | @@ -108,6 +104,42 @@ angular.module("esNgAntd").directive("antdTable", function (esNgAntd) { | ||
| 108 | $scope.$watch(key, $scope.watch[key], true); | 104 | $scope.$watch(key, $scope.watch[key], true); |
| 109 | } | 105 | } |
| 110 | 106 | ||
| 107 | + $scope.getParameterName = function (fn) { | ||
| 108 | + if (typeof fn !== "object" && typeof fn !== "function") return; | ||
| 109 | + const COMMENTS = /((\/\/.*$)|(\/\*[\s\S]*?\*\/))/gm; | ||
| 110 | + const DEFAULT_PARAMS = /=[^,)]+/gm; | ||
| 111 | + const FAT_ARROWS = /=>.*$/gm; | ||
| 112 | + let code = fn.prototype | ||
| 113 | + ? fn.prototype.constructor.toString() | ||
| 114 | + : fn.toString(); | ||
| 115 | + code = code | ||
| 116 | + .replace(COMMENTS, "") | ||
| 117 | + .replace(FAT_ARROWS, "") | ||
| 118 | + .replace(DEFAULT_PARAMS, ""); | ||
| 119 | + let result = code | ||
| 120 | + .slice(code.indexOf("(") + 1, code.indexOf(")")) | ||
| 121 | + .match(/([^\s,]+)/g); | ||
| 122 | + return result === null ? [] : result; | ||
| 123 | + }; | ||
| 124 | + | ||
| 125 | + $scope.getRender = function (column, record, index) { | ||
| 126 | + let params = $scope.getParameterName(column.render); | ||
| 127 | + return column | ||
| 128 | + .render(record[column.key], record, index) | ||
| 129 | + .replace( | ||
| 130 | + new RegExp(`(\{\{.*?)${params[0]}(.*?\}\})`, "g"), | ||
| 131 | + `$1dataSource[${index}].${column.key}$2` | ||
| 132 | + ) | ||
| 133 | + .replace( | ||
| 134 | + new RegExp(`(\{\{.*?)${params[1]}(.*?\}\})`, "g"), | ||
| 135 | + `$1dataSource[${index}]$2` | ||
| 136 | + ) | ||
| 137 | + .replace( | ||
| 138 | + new RegExp(`(\{\{.*?)${params[2]}(.*?\}\})`, "g"), | ||
| 139 | + `$1${index}$2` | ||
| 140 | + ); | ||
| 141 | + }; | ||
| 142 | + | ||
| 111 | $scope.handleSelectAll = function (event) { | 143 | $scope.handleSelectAll = function (event) { |
| 112 | $scope.state.isSelectAll = event.target.checked; | 144 | $scope.state.isSelectAll = event.target.checked; |
| 113 | $scope.state.selectedrecordKeys = []; | 145 | $scope.state.selectedrecordKeys = []; |
dist/ng-antd.js
| @@ -104,7 +104,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Col | @@ -104,7 +104,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Col | ||
| 104 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { | 104 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
| 105 | 105 | ||
| 106 | "use strict"; | 106 | "use strict"; |
| 107 | -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/style/index.css */ \"./node_modules/antd/lib/style/index.css\");\n\nangular.module(\"esNgAntd\").service(\"esNgAntd\", [\n \"$compile\",\n function ($compile) {\n this.styleSheets = null;\n\n this.createStyle = function (key, style) {\n if (!document.querySelector(\"#antd\")) {\n let styleElement = document.createElement(\"style\");\n styleElement.setAttribute(\"id\", \"antd\");\n styleElement.setAttribute(\"type\", \"text/css\");\n styleElement.innerHTML = antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__[\"default\"].toString();\n document.head.appendChild(styleElement);\n }\n\n if (!document.querySelector(\"#\" + key)) {\n let styleElement = document.createElement(\"style\");\n styleElement.setAttribute(\"id\", key);\n styleElement.setAttribute(\"type\", \"text/css\");\n styleElement.innerHTML = style.toString();\n document.head.appendChild(styleElement);\n\n if (this.styleSheets) {\n this.disableStyle(key);\n }\n }\n };\n\n this.disableStyle = function (name) {\n for (let i = 0; i < this.styleSheets.cssRules.length; i++) {\n let rule = this.styleSheets.cssRules[i];\n\n if (\n rule.selectorText &&\n rule.selectorText.indexOf(name) !== -1\n ) {\n rule.selectorText = rule.selectorText.replace(\n /\\.ant\\-/g,\n \".disabled-ant-\"\n );\n }\n }\n };\n\n this.conflict = function (filename) {\n for (let i = 0; i < document.styleSheets.length; i++) {\n const element = document.styleSheets[i];\n\n if (element.href && element.href.indexOf(filename) !== -1) {\n this.styleSheets = element;\n }\n }\n };\n\n this.createLayer = function (content, scope) {\n let div = document.createElement(\"div\");\n div.innerHTML = content;\n document.body.appendChild(div);\n $compile(div)(scope);\n };\n\n this.getOffset = function (ele) {\n if (!ele || ele.nodeType != 1) {\n return;\n }\n\n let rect = ele.getBoundingClientRect();\n let doc = ele.ownerDocument.documentElement;\n return {\n top: rect.top + window.pageYOffset - doc.clientTop,\n left: rect.left + window.pageXOffset - doc.clientLeft,\n };\n };\n },\n]);\n\n\n//# sourceURL=webpack://ng-antd/./build/Common/Common.js?"); | 107 | +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/style/index.css */ \"./node_modules/antd/lib/style/index.css\");\n\nangular.module(\"esNgAntd\").service(\"esNgAntd\", [\n \"$compile\",\n function ($compile) {\n this.styleSheets = null;\n this.conflictType = null;\n\n this.createStyle = function (key, style) {\n if (!document.querySelector(\"#antd\")) {\n let styleElement = document.createElement(\"style\");\n styleElement.setAttribute(\"id\", \"antd\");\n styleElement.setAttribute(\"type\", \"text/css\");\n styleElement.innerHTML = antd_lib_style_index_css__WEBPACK_IMPORTED_MODULE_0__[\"default\"].toString();\n document.head.appendChild(styleElement);\n\n if (this.styleSheets) {\n this.disableStyle(\"anticon\");\n }\n }\n\n if (!document.querySelector(\"#\" + key)) {\n let styleElement = document.createElement(\"style\");\n styleElement.setAttribute(\"id\", key);\n styleElement.setAttribute(\"type\", \"text/css\");\n styleElement.innerHTML = style.toString();\n document.head.appendChild(styleElement);\n\n if (this.styleSheets) {\n this.disableStyle(key);\n }\n }\n };\n\n this.disableStyle = function (name) {\n for (let i = 0; i < this.styleSheets.cssRules.length; i++) {\n let rule = this.styleSheets.cssRules[i];\n\n if (\n rule.selectorText &&\n rule.selectorText.indexOf(name) !== -1 &&\n rule.selectorText.indexOf(\"ant3\") === -1\n ) {\n rule.selectorText = rule.selectorText\n .split(\",\")\n .map(function (item) {\n return \".ant3 \" + item;\n })\n .join(\",\");\n }\n }\n };\n\n this.conflict = function (filename, type) {\n this.conflictType = type;\n\n for (let i = 0; i < document.styleSheets.length; i++) {\n const element = document.styleSheets[i];\n\n if (element.href && element.href.indexOf(filename) !== -1) {\n this.styleSheets = element;\n }\n }\n };\n\n this.createLayer = function (content, scope) {\n let div = document.createElement(\"div\");\n div.innerHTML = content;\n document.body.appendChild(div);\n $compile(div)(scope);\n };\n\n this.getOffset = function (ele) {\n if (!ele || ele.nodeType != 1) {\n return;\n }\n\n let rect = ele.getBoundingClientRect();\n let doc = ele.ownerDocument.documentElement;\n return {\n top: rect.top + window.pageYOffset - doc.clientTop,\n left: rect.left + window.pageXOffset - doc.clientLeft,\n };\n };\n },\n]);\n\n\n//# sourceURL=webpack://ng-antd/./build/Common/Common.js?"); |
| 108 | 108 | ||
| 109 | /***/ }), | 109 | /***/ }), |
| 110 | 110 | ||
| @@ -367,7 +367,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Sel | @@ -367,7 +367,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Sel | ||
| 367 | \****************************/ | 367 | \****************************/ |
| 368 | /***/ (() => { | 368 | /***/ (() => { |
| 369 | 369 | ||
| 370 | -eval("angular.module(\"esNgAntd\").directive(\"antdSlot\", function ($compile) {\n return {\n controllerAs: \"antdSlot\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n content: \"@\",\n context: \"=\",\n },\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.watch = {\n content: (newValue) => {\n if (newValue !== undefined) {\n if (/<[^>]+>/.test(newValue)) {\n $element.replaceWith(\n $compile(newValue)(\n $scope.context ? $scope.context : $scope\n )\n );\n } else {\n $element.text(newValue);\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {},\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Slot/Slot.js?"); | 370 | +eval("angular.module(\"esNgAntd\").directive(\"antdSlot\", function ($compile) {\n return {\n controllerAs: \"antdSlot\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n content: \"@\",\n context: \"=\",\n },\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.watch = {\n content: (newValue) => {\n if (newValue !== undefined) {\n if (/<[^>]+>/.test(newValue)) {\n console.log(newValue);\n $element.replaceWith(\n $compile(newValue)(\n $scope.context ? $scope.context : $scope\n )\n );\n } else {\n $element.text(newValue);\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {},\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Slot/Slot.js?"); |
| 371 | 371 | ||
| 372 | /***/ }), | 372 | /***/ }), |
| 373 | 373 | ||
| @@ -411,7 +411,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Tab | @@ -411,7 +411,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Tab | ||
| 411 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { | 411 | /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
| 412 | 412 | ||
| 413 | "use strict"; | 413 | "use strict"; |
| 414 | -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Table_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Table.html */ \"./build/Table/Table.html\");\n/* harmony import */ var antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/table/style/index.css */ \"./node_modules/antd/lib/table/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdTable\", function (esNgAntd) {\n return {\n controllerAs: \"antdTable\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n columns: \"=\",\n dSource: \"=\",\n rowSelection: \"=\",\n rowKey: \"@\",\n loading: \"@\",\n onChange: \"&\",\n size: \"@\",\n },\n template: _Table_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n size: $scope.size || \"default\",\n dataSource: [],\n selectedrecordKeys: [],\n selectedrecords: [],\n isSelectAll: false,\n rowKey: $scope.rowKey || \"id\",\n sortDirections: [\"ascend\", \"descend\"],\n sorter: {\n field: null,\n order: null,\n },\n };\n $scope.watch = {\n dSource: (newValue) => {\n if (newValue !== undefined) {\n let dataSource = [];\n newValue.forEach((record, index) => {\n let row = {};\n\n if ($scope.rowSelection) {\n row.checked = false;\n row.disabled = false;\n }\n\n if (\n $scope.rowSelection &&\n typeof $scope.rowSelection.getCheckboxProps ===\n \"function\"\n ) {\n let extraAttr =\n $scope.rowSelection.getCheckboxProps(\n record\n );\n row = Object.assign(row, extraAttr);\n }\n\n $scope.columns.forEach((column) => {\n // 排序\n if (column.sortOrder) {\n $scope.state.sorter.field = column.key;\n $scope.state.sorter.order =\n column.sortOrder;\n }\n\n row[column.key] = column.render\n ? column.render(\n record[column.key],\n record,\n index\n )\n : record[column.key];\n }); // 主键\n\n if ($scope.rowKey !== undefined) {\n row[$scope.state.rowKey] =\n record[$scope.state.rowKey];\n } else {\n row[$scope.state.rowKey] = index + 1;\n }\n\n dataSource[index] = row;\n });\n $scope.state.dataSource = dataSource;\n }\n },\n \"rowSelection.selectedRowKeys\": (newVal) => {\n if (Array.isArray(newVal)) {\n if (newVal.length > 0) {\n $scope.state.dataSource.map(function (row, key) {\n if (newVal.includes(key)) {\n row.checked = true;\n }\n });\n } else {\n $scope.state.dataSource.map(function (row) {\n row.checked = false;\n });\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.handleSelectAll = function (event) {\n $scope.state.isSelectAll = event.target.checked;\n $scope.state.selectedrecordKeys = [];\n $scope.state.selectedrecords = [];\n $scope.state.dataSource.map((record, key) => {\n if (record.disabled === false) {\n record.checked = event.target.checked;\n }\n\n if (record.checked) {\n $scope.state.selectedrecordKeys.push(key);\n $scope.state.selectedrecords.push($scope.dSource[key]);\n }\n\n return record;\n });\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSelect = function (event, index) {\n let pos = $scope.state.selectedrecordKeys.findIndex(\n (value) => value === index\n );\n\n if (event.target.checked && pos === -1) {\n $scope.state.selectedrecordKeys.push(index);\n $scope.state.selectedrecords.push($scope.dSource[index]);\n } else {\n $scope.state.selectedrecordKeys.splice(pos, 1);\n $scope.state.selectedrecords.splice(pos, 1);\n }\n\n if ($scope.state.selectedrecordKeys.length === 0) {\n $scope.state.isSelectAll = false;\n }\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSorter = function (key) {\n $scope.state.sorter.field = key;\n\n if ($scope.state.sorter.order === null) {\n $scope.state.sorter.order = \"ascend\";\n } else if ($scope.state.sorter.order === \"ascend\") {\n $scope.state.sorter.order = \"descend\";\n } else if ($scope.state.sorter.order === \"descend\") {\n $scope.state.sorter.order = null;\n $scope.state.sorter.field = null;\n }\n\n $scope.onChange({\n sorter: $scope.state.sorter,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-table\", antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.js?"); | 414 | +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Table_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Table.html */ \"./build/Table/Table.html\");\n/* harmony import */ var antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/table/style/index.css */ \"./node_modules/antd/lib/table/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdTable\", function (esNgAntd) {\n return {\n controllerAs: \"antdTable\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n columns: \"=\",\n dSource: \"=\",\n rowSelection: \"=\",\n rowKey: \"@\",\n loading: \"@\",\n onChange: \"&\",\n size: \"@\",\n },\n template: _Table_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n size: $scope.size || \"default\",\n dataSource: [],\n selectedrecordKeys: [],\n selectedrecords: [],\n isSelectAll: false,\n rowKey: $scope.rowKey || \"id\",\n sortDirections: [\"ascend\", \"descend\"],\n sorter: {\n field: null,\n order: null,\n },\n };\n $scope.watch = {\n dSource: (newValue) => {\n if (newValue !== undefined) {\n let dataSource = [];\n newValue.forEach((record, index) => {\n let row = {};\n\n if ($scope.rowSelection) {\n row.checked = false;\n row.disabled = false;\n }\n\n if (\n $scope.rowSelection &&\n typeof $scope.rowSelection.getCheckboxProps ===\n \"function\"\n ) {\n let extraAttr =\n $scope.rowSelection.getCheckboxProps(\n record\n );\n row = Object.assign(row, extraAttr);\n }\n\n $scope.columns.forEach((column) => {\n // 排序\n if (column.sortOrder) {\n $scope.state.sorter.field = column.key;\n $scope.state.sorter.order =\n column.sortOrder;\n }\n\n row[column.key] = column.render\n ? $scope.getRender(column, record, index)\n : record[column.key];\n }); // 主键\n\n if ($scope.rowKey !== undefined) {\n row[$scope.state.rowKey] =\n record[$scope.state.rowKey];\n } else {\n row[$scope.state.rowKey] = index + 1;\n }\n\n dataSource[index] = row;\n });\n $scope.state.dataSource = dataSource;\n }\n },\n \"rowSelection.selectedRowKeys\": (newVal) => {\n if (Array.isArray(newVal)) {\n if (newVal.length > 0) {\n $scope.state.dataSource.map(function (row, key) {\n if (newVal.includes(key)) {\n row.checked = true;\n }\n });\n } else {\n $scope.state.dataSource.map(function (row) {\n row.checked = false;\n });\n }\n }\n },\n };\n\n for (const key in $scope.watch) {\n $scope.$watch(key, $scope.watch[key], true);\n }\n\n $scope.getParameterName = function (fn) {\n if (typeof fn !== \"object\" && typeof fn !== \"function\") return;\n const COMMENTS = /((\\/\\/.*$)|(\\/\\*[\\s\\S]*?\\*\\/))/gm;\n const DEFAULT_PARAMS = /=[^,)]+/gm;\n const FAT_ARROWS = /=>.*$/gm;\n let code = fn.prototype\n ? fn.prototype.constructor.toString()\n : fn.toString();\n code = code\n .replace(COMMENTS, \"\")\n .replace(FAT_ARROWS, \"\")\n .replace(DEFAULT_PARAMS, \"\");\n let result = code\n .slice(code.indexOf(\"(\") + 1, code.indexOf(\")\"))\n .match(/([^\\s,]+)/g);\n return result === null ? [] : result;\n };\n\n $scope.getRender = function (column, record, index) {\n let params = $scope.getParameterName(column.render);\n return column\n .render(record[column.key], record, index)\n .replace(\n new RegExp(`(\\{\\{.*?)${params[0]}(.*?\\}\\})`, \"g\"),\n `$1dataSource[${index}].${column.key}$2`\n )\n .replace(\n new RegExp(`(\\{\\{.*?)${params[1]}(.*?\\}\\})`, \"g\"),\n `$1dataSource[${index}]$2`\n )\n .replace(\n new RegExp(`(\\{\\{.*?)${params[2]}(.*?\\}\\})`, \"g\"),\n `$1${index}$2`\n );\n };\n\n $scope.handleSelectAll = function (event) {\n $scope.state.isSelectAll = event.target.checked;\n $scope.state.selectedrecordKeys = [];\n $scope.state.selectedrecords = [];\n $scope.state.dataSource.map((record, key) => {\n if (record.disabled === false) {\n record.checked = event.target.checked;\n }\n\n if (record.checked) {\n $scope.state.selectedrecordKeys.push(key);\n $scope.state.selectedrecords.push($scope.dSource[key]);\n }\n\n return record;\n });\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSelect = function (event, index) {\n let pos = $scope.state.selectedrecordKeys.findIndex(\n (value) => value === index\n );\n\n if (event.target.checked && pos === -1) {\n $scope.state.selectedrecordKeys.push(index);\n $scope.state.selectedrecords.push($scope.dSource[index]);\n } else {\n $scope.state.selectedrecordKeys.splice(pos, 1);\n $scope.state.selectedrecords.splice(pos, 1);\n }\n\n if ($scope.state.selectedrecordKeys.length === 0) {\n $scope.state.isSelectAll = false;\n }\n\n if (typeof $scope.rowSelection.onChange === \"function\") {\n $scope.rowSelection.onChange(\n $scope.state.selectedrecordKeys,\n $scope.state.selectedrecords\n );\n }\n };\n\n $scope.handleSorter = function (key) {\n $scope.state.sorter.field = key;\n\n if ($scope.state.sorter.order === null) {\n $scope.state.sorter.order = \"ascend\";\n } else if ($scope.state.sorter.order === \"ascend\") {\n $scope.state.sorter.order = \"descend\";\n } else if ($scope.state.sorter.order === \"descend\") {\n $scope.state.sorter.order = null;\n $scope.state.sorter.field = null;\n }\n\n $scope.onChange({\n sorter: $scope.state.sorter,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-table\", antd_lib_table_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Table/Table.js?"); |
| 415 | 415 | ||
| 416 | /***/ }), | 416 | /***/ }), |
| 417 | 417 |
| @@ -0,0 +1,45 @@ | @@ -0,0 +1,45 @@ | ||
| 1 | +<!DOCTYPE html> | ||
| 2 | +<html> | ||
| 3 | + | ||
| 4 | +<head> | ||
| 5 | + <meta charset="UTF-8" /> | ||
| 6 | + <title></title> | ||
| 7 | +</head> | ||
| 8 | + | ||
| 9 | +<body style="padding: 50px;"> | ||
| 10 | + <div ng-app="esNgAntd" ng-controller="mainCtrl"> | ||
| 11 | + <div class="container"> | ||
| 12 | + <antd-table columns="columns" d-source="dataSource"></antd-table> | ||
| 13 | + </div> | ||
| 14 | + </div> | ||
| 15 | + <script src="https://cdn.staticfile.org/angular.js/1.2.28/angular.min.js"></script> | ||
| 16 | + <script src="../../dist/ng-antd.js"></script> | ||
| 17 | + <script> | ||
| 18 | + angular | ||
| 19 | + .module("esNgAntd") | ||
| 20 | + .controller("mainCtrl", function ($scope) { | ||
| 21 | + $scope.columns = [ | ||
| 22 | + { | ||
| 23 | + title: "AAA", | ||
| 24 | + key: "name", | ||
| 25 | + render(value, item, index) { | ||
| 26 | + return `<div>{{value}} - {{item.name}} {{index}}</div>`; | ||
| 27 | + } | ||
| 28 | + }, | ||
| 29 | + ]; | ||
| 30 | + | ||
| 31 | + $scope.dataSource = [ | ||
| 32 | + { | ||
| 33 | + id: 1, | ||
| 34 | + name: "AAA", | ||
| 35 | + }, | ||
| 36 | + { | ||
| 37 | + id: 2, | ||
| 38 | + name: "BBB", | ||
| 39 | + }, | ||
| 40 | + ]; | ||
| 41 | + }); | ||
| 42 | + </script> | ||
| 43 | +</body> | ||
| 44 | + | ||
| 45 | +</html> | ||
| 0 | \ No newline at end of file | 46 | \ No newline at end of file |
src/Slot/Slot.js
| @@ -10,6 +10,7 @@ class Slot { | @@ -10,6 +10,7 @@ class Slot { | ||
| 10 | content: (newValue) => { | 10 | content: (newValue) => { |
| 11 | if (newValue !== undefined) { | 11 | if (newValue !== undefined) { |
| 12 | if (/<[^>]+>/.test(newValue)) { | 12 | if (/<[^>]+>/.test(newValue)) { |
| 13 | + console.log(newValue) | ||
| 13 | $element.replaceWith( | 14 | $element.replaceWith( |
| 14 | $compile(newValue)( | 15 | $compile(newValue)( |
| 15 | $scope.context ? $scope.context : $scope | 16 | $scope.context ? $scope.context : $scope |
src/Table/Table.js
| @@ -56,7 +56,7 @@ class Table { | @@ -56,7 +56,7 @@ class Table { | ||
| 56 | this.state.sorter.order = column.sortOrder; | 56 | this.state.sorter.order = column.sortOrder; |
| 57 | } | 57 | } |
| 58 | row[column.key] = column.render | 58 | row[column.key] = column.render |
| 59 | - ? column.render(record[column.key], record, index) | 59 | + ? this.getRender(column, record, index) |
| 60 | : record[column.key]; | 60 | : record[column.key]; |
| 61 | }); | 61 | }); |
| 62 | // 主键 | 62 | // 主键 |
| @@ -91,6 +91,39 @@ class Table { | @@ -91,6 +91,39 @@ class Table { | ||
| 91 | esNgAntd.createStyle("ant-table", style); | 91 | esNgAntd.createStyle("ant-table", style); |
| 92 | } | 92 | } |
| 93 | 93 | ||
| 94 | + getParameterName(fn) { | ||
| 95 | + if (typeof fn !== "object" && typeof fn !== "function") return; | ||
| 96 | + const COMMENTS = /((\/\/.*$)|(\/\*[\s\S]*?\*\/))/gm; | ||
| 97 | + const DEFAULT_PARAMS = /=[^,)]+/gm; | ||
| 98 | + const FAT_ARROWS = /=>.*$/gm; | ||
| 99 | + let code = fn.prototype | ||
| 100 | + ? fn.prototype.constructor.toString() | ||
| 101 | + : fn.toString(); | ||
| 102 | + code = code | ||
| 103 | + .replace(COMMENTS, "") | ||
| 104 | + .replace(FAT_ARROWS, "") | ||
| 105 | + .replace(DEFAULT_PARAMS, ""); | ||
| 106 | + let result = code | ||
| 107 | + .slice(code.indexOf("(") + 1, code.indexOf(")")) | ||
| 108 | + .match(/([^\s,]+)/g); | ||
| 109 | + return result === null ? [] : result; | ||
| 110 | + } | ||
| 111 | + | ||
| 112 | + getRender(column, record, index) { | ||
| 113 | + let params = this.getParameterName(column.render); | ||
| 114 | + return column | ||
| 115 | + .render(record[column.key], record, index) | ||
| 116 | + .replace( | ||
| 117 | + new RegExp(`(\{\{.*?)${params[0]}(.*?\}\})`, "g"), | ||
| 118 | + `$1dataSource[${index}].${column.key}$2` | ||
| 119 | + ) | ||
| 120 | + .replace( | ||
| 121 | + new RegExp(`(\{\{.*?)${params[1]}(.*?\}\})`, "g"), | ||
| 122 | + `$1dataSource[${index}]$2` | ||
| 123 | + ) | ||
| 124 | + .replace(new RegExp(`(\{\{.*?)${params[2]}(.*?\}\})`, "g"), `$1${index}$2`); | ||
| 125 | + } | ||
| 126 | + | ||
| 94 | handleSelectAll(event) { | 127 | handleSelectAll(event) { |
| 95 | this.state.isSelectAll = event.target.checked; | 128 | this.state.isSelectAll = event.target.checked; |
| 96 | this.state.selectedrecordKeys = []; | 129 | this.state.selectedrecordKeys = []; |
webpack.config.js
| @@ -8,11 +8,11 @@ module.exports = { | @@ -8,11 +8,11 @@ module.exports = { | ||
| 8 | // bpms | 8 | // bpms |
| 9 | // path: "/Users/shann/Project/essa/bpms/bpms-webapp/src/main/webapp/lib/ng-antd", | 9 | // path: "/Users/shann/Project/essa/bpms/bpms-webapp/src/main/webapp/lib/ng-antd", |
| 10 | // boss | 10 | // boss |
| 11 | - path: "/Users/shann/Project/essa/boss/trunk/vendor-lib/ng-antd", | 11 | + // path: "/Users/shann/Project/essa/boss/trunk/vendor-lib/ng-antd", |
| 12 | // mvo | 12 | // mvo |
| 13 | // path: "/Users/shann/Project/essa/mvo/mvo-webapp/public/browser-vendor/ng-antd", | 13 | // path: "/Users/shann/Project/essa/mvo/mvo-webapp/public/browser-vendor/ng-antd", |
| 14 | // local | 14 | // local |
| 15 | - // path: path.resolve(__dirname, "dist"), | 15 | + path: path.resolve(__dirname, "dist"), |
| 16 | filename: "ng-antd.js", | 16 | filename: "ng-antd.js", |
| 17 | }, | 17 | }, |
| 18 | module: { | 18 | module: { |