essa-platform / es-ng-antd

Commit 50f4289a9f7cba0e3ab55996de24c34937ea3d02

Authored by Imshann
1 parent 1145f171

优化Form组件

Showing 7 changed files with 147 additions and 150 deletions   Show diff stats
Inline Side-by-side
build/Button/Button.js
  Show/Hide comments   View file @50f4289
1   -import style from "antd/lib/button/style/index.css";
2 1 import template from "./Button.html";
  2 +import style from "antd/lib/button/style/index.css";
3 3 angular.module("esNgAntd").directive("antdButton", ["esNgAntd", function (esNgAntd) {
4 4 return {
5 5 template: template,
... ... @@ -30,7 +30,7 @@ angular.module("esNgAntd").directive("antdButton", ["esNgAntd", function (esNgAn
30 30 }
31 31 };
32 32 },
33   - link: function ($scope) {
  33 + link: function ($scope, $element) {
34 34 esNgAntd.createStyle("ant-btn", style);
35 35 let className = ["ant-btn"];
36 36  
... ...
build/Form/Form.js
  Show/Hide comments   View file @50f4289
1 1 import template from "./Form.html";
2 2 import style from "antd/lib/form/style/index.css";
3   -angular.module("esNgAntd").directive("antdForm", function (esNgAntd) {
4   - return {
5   - controllerAs: "antdForm",
6   - restrict: "E",
7   - transclude: true,
8   - replace: true,
9   - scope: {
10   - name: "@",
11   - labelCol: "=",
12   - wrapperCol: "=",
13   - onFinish: "&",
14   - form: "=",
15   - },
16   - template: template,
17   - controller: function ($scope, $element, $attrs) {
18   - this.getContext = function () {
19   - return $scope;
20   - };
  3 +angular.module("esNgAntd").directive("antdForm", ["esNgAntd", function (esNgAntd) {
  4 + return {
  5 + template: template,
  6 + restrict: "E",
  7 + replace: true,
  8 + transclude: true,
  9 + scope: {
  10 + name: "@",
  11 + labelCol: "=",
  12 + wrapperCol: "=",
  13 + form: "=",
  14 + onFinish: "&"
  15 + },
  16 + controller: function ($scope, $element) {
  17 + this.getContext = function () {
  18 + return $scope;
  19 + };
21 20  
22   - $scope.state = {
23   - formItems: [],
24   - };
  21 + $scope.state = {
  22 + formItems: []
  23 + };
25 24  
26   - $scope.resetFields = function () {
27   - $scope.state.formItems.forEach(function (item) {
28   - if (typeof item.setValue === "function") {
29   - item.setValue(item.defaultValue || null);
30   - } else {
31   - item.value = null;
32   - }
33   - });
34   - };
  25 + $scope.resetFields = function () {
  26 + $scope.state.formItems.forEach(function (item) {
  27 + if (typeof item.setValue === "function") {
  28 + item.setValue(item.defaultValue || null);
  29 + } else {
  30 + item.value = null;
  31 + }
  32 + });
  33 + };
35 34  
36   - $scope.submit = function () {
37   - $scope.handleSubmit();
38   - };
  35 + $scope.submit = function () {
  36 + $scope.handleSubmit();
  37 + };
39 38  
40   - $scope.handleSubmit = function () {
41   - let values = {};
42   - $scope.state.formItems.forEach(function (item) {
43   - let name = item.antdFormItem && item.antdFormItem.name;
44   - let value = null;
  39 + $scope.handleSubmit = function () {
  40 + let values = {};
  41 + $scope.state.formItems.forEach(function (item) {
  42 + let name = item.antdFormItem && item.antdFormItem.name;
  43 + let value = null;
45 44  
46   - if (item.state.type === "checkbox") {
47   - value = item.state.checked;
48   - } else {
49   - value = item.value || item.state.value;
50   - }
  45 + if (item.state.type === "checkbox") {
  46 + value = item.state.checked;
  47 + } else {
  48 + value = item.value || item.state.value;
  49 + }
51 50  
52   - values[name] = value;
53   - });
54   - $scope.onFinish({
55   - values: values,
56   - });
57   - };
58   - },
59   - link: function ($scope, $element, $attrs, $controllers, $transclude) {
60   - esNgAntd.createStyle("ant-form", style);
  51 + values[name] = value;
  52 + });
  53 + $scope.onFinish({
  54 + values: values
  55 + });
  56 + };
  57 + },
  58 + link: function ($scope, $element) {
  59 + esNgAntd.createStyle("ant-form", style);
61 60  
62   - if ($scope.form !== undefined) {
63   - $scope.form = $scope;
64   - }
  61 + if ($scope.form !== undefined) {
  62 + $scope.form = $scope;
  63 + }
65 64  
66   - if ($scope.name) {
67   - let inputs = $element[0].querySelectorAll("input");
  65 + if ($scope.name) {
  66 + let inputs = $element[0].querySelectorAll("input");
68 67  
69   - for (let i = 0; i < inputs.length; i++) {
70   - const element = inputs[i];
71   - element.id = $scope.name + "_" + element.id;
72   - }
73   - }
74   - },
75   - };
76   -});
  68 + for (let i = 0; i < inputs.length; i++) {
  69 + const element = inputs[i];
  70 + element.id = $scope.name + "_" + element.id;
  71 + }
  72 + }
  73 + }
  74 + };
  75 +}]);
77 76 \ No newline at end of file
... ...
build/FormItem/FormItem.js
  Show/Hide comments   View file @50f4289
1 1 /**
2 2 * 表单域
3   - *
4   - * @Author: Shann
5   - * @LastEditors: Shann
6   - * @Date: 2021-07-26 08:53:33
7   - * @LastEditTime: 2021-08-05 14:03:05
8   - * @FilePath: \angular-js-for-bootstrap\src\Essa\FormItem\FormItem.js
9   - * @Copyright: Copyright 2021-2021, all rights reserved. Essa.cn
10 3 */
11 4 import template from "./FormItem.html";
12 5 angular.module("esNgAntd").directive("antdFormItem", function () {
13   - return {
14   - controllerAs: "antdFormItem",
15   - restrict: "E",
16   - transclude: true,
17   - replace: true,
18   - scope: {
19   - name: "@",
20   - label: "@",
21   - labelCol: "=",
22   - wrapperCol: "=",
23   - required: "@",
24   - },
25   - template: template,
26   - controller: function ($scope, $element, $attrs) {
27   - this.getContext = function () {
28   - return $scope;
29   - };
  6 + return {
  7 + template: template,
  8 + restrict: "E",
  9 + replace: true,
  10 + transclude: true,
  11 + scope: {
  12 + name: "@",
  13 + label: "@",
  14 + labelCol: "=",
  15 + wrapperCol: "=",
  16 + required: "="
  17 + },
  18 + require: ["^?antdForm"],
  19 + controller: function ($scope, $element, $attrs) {
  20 + this.getContext = function () {
  21 + return $scope;
  22 + };
30 23  
31   - $scope.state = {
32   - labelCol: null,
33   - wrapperCol: null,
34   - };
35   - },
36   - require: ["?^antdForm"],
37   - link: function ($scope, $element, $attrs, $controllers, $transclude) {
38   - let [antdForm] = $controllers;
39   - $scope.antdForm = antdForm.getContext();
  24 + $scope.state = {
  25 + labelCol: null,
  26 + wrapperCol: null
  27 + };
  28 + },
  29 + link: function ($scope, $element, $attrs, $controllers) {
  30 + let [antdForm] = $controllers;
40 31  
41   - if ($scope.labelCol && $scope.labelCol.span) {
42   - $scope.state.labelCol = $scope.labelCol.span;
43   - } else if (
44   - $scope.antdForm.labelCol &&
45   - $scope.antdForm.labelCol.span
46   - ) {
47   - $scope.state.labelCol = $scope.antdForm.labelCol.span;
48   - }
  32 + if (antdForm) {
  33 + $scope.antdForm = antdForm.getContext();
  34 + }
49 35  
50   - if ($scope.wrapperCol && $scope.wrapperCol.span) {
51   - $scope.state.wrapperCol = $scope.wrapperCol.span;
52   - } else if (
53   - $scope.antdForm.wrapperCol &&
54   - $scope.antdForm.wrapperCol.span
55   - ) {
56   - $scope.state.wrapperCol = $scope.antdForm.wrapperCol.span;
57   - }
58   - },
59   - };
60   -});
  36 + if ($scope.labelCol && $scope.labelCol.span) {
  37 + $scope.state.labelCol = $scope.labelCol.span;
  38 + } else if ($scope.antdForm.labelCol && $scope.antdForm.labelCol.span) {
  39 + $scope.state.labelCol = $scope.antdForm.labelCol.span;
  40 + }
  41 +
  42 + if ($scope.wrapperCol && $scope.wrapperCol.span) {
  43 + $scope.state.wrapperCol = $scope.wrapperCol.span;
  44 + } else if ($scope.antdForm.wrapperCol && $scope.antdForm.wrapperCol.span) {
  45 + $scope.state.wrapperCol = $scope.antdForm.wrapperCol.span;
  46 + }
  47 + }
  48 + };
  49 +});
61 50 \ No newline at end of file
... ...
dist/ng-antd.js
  Show/Hide comments   View file @50f4289
... ... @@ -49,7 +49,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Bre
49 49 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
50 50  
51 51 "use strict";
52   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var antd_lib_button_style_index_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! antd/lib/button/style/index.css */ \"./node_modules/antd/lib/button/style/index.css\");\n/* harmony import */ var _Button_html__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button.html */ \"./build/Button/Button.html\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdButton\", [\"esNgAntd\", function (esNgAntd) {\n return {\n template: _Button_html__WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n type: \"@\",\n size: \"@\",\n htmlType: \"@\",\n ghost: \"=\",\n loading: \"=\"\n },\n controller: function ($scope, $element) {\n $scope.state = {\n disabled: null,\n className: \"\"\n };\n $scope.watch = {\n loading: newVal => {\n if (newVal !== undefined) {\n if (newVal === \"true\") {\n $scope.state.className += \" ant-btn-loading\";\n } else {\n $scope.state.className = $scope.state.className.replace(\" ant-btn-loading\", \"\");\n }\n }\n }\n };\n },\n link: function ($scope) {\n esNgAntd.createStyle(\"ant-btn\", antd_lib_button_style_index_css__WEBPACK_IMPORTED_MODULE_0__[\"default\"]);\n let className = [\"ant-btn\"];\n\n if ($scope.type) {\n className.push(\"ant-btn-\" + $scope.type);\n }\n\n if ($scope.size && [\"lg\", \"sm\", \"xs\"].includes($scope.size)) {\n className.push(\"ant-btn-\" + $scope.size);\n }\n\n if ($scope.ghost) {\n className.push(\"ant-btn-background-ghost\");\n }\n\n $scope.state.className = className.join(\" \");\n\n if ($scope.htmlType) {\n $element[0].setAttribute(\"type\", $scope.htmlType);\n }\n }\n };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/Button/Button.js?");
  52 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Button_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Button.html */ \"./build/Button/Button.html\");\n/* harmony import */ var antd_lib_button_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/button/style/index.css */ \"./node_modules/antd/lib/button/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdButton\", [\"esNgAntd\", function (esNgAntd) {\n return {\n template: _Button_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n type: \"@\",\n size: \"@\",\n htmlType: \"@\",\n ghost: \"=\",\n loading: \"=\"\n },\n controller: function ($scope, $element) {\n $scope.state = {\n disabled: null,\n className: \"\"\n };\n $scope.watch = {\n loading: newVal => {\n if (newVal !== undefined) {\n if (newVal === \"true\") {\n $scope.state.className += \" ant-btn-loading\";\n } else {\n $scope.state.className = $scope.state.className.replace(\" ant-btn-loading\", \"\");\n }\n }\n }\n };\n },\n link: function ($scope, $element) {\n esNgAntd.createStyle(\"ant-btn\", antd_lib_button_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n let className = [\"ant-btn\"];\n\n if ($scope.type) {\n className.push(\"ant-btn-\" + $scope.type);\n }\n\n if ($scope.size && [\"lg\", \"sm\", \"xs\"].includes($scope.size)) {\n className.push(\"ant-btn-\" + $scope.size);\n }\n\n if ($scope.ghost) {\n className.push(\"ant-btn-background-ghost\");\n }\n\n $scope.state.className = className.join(\" \");\n\n if ($scope.htmlType) {\n $element[0].setAttribute(\"type\", $scope.htmlType);\n }\n }\n };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/Button/Button.js?");
53 53  
54 54 /***/ }),
55 55  
... ... @@ -137,7 +137,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
137 137 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
138 138  
139 139 "use strict";
140   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Form_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Form.html */ \"./build/Form/Form.html\");\n/* harmony import */ var antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/form/style/index.css */ \"./node_modules/antd/lib/form/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdForm\", function (esNgAntd) {\n return {\n controllerAs: \"antdForm\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n name: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n onFinish: \"&\",\n form: \"=\",\n },\n template: _Form_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 formItems: [],\n };\n\n $scope.resetFields = function () {\n $scope.state.formItems.forEach(function (item) {\n if (typeof item.setValue === \"function\") {\n item.setValue(item.defaultValue || null);\n } else {\n item.value = null;\n }\n });\n };\n\n $scope.submit = function () {\n $scope.handleSubmit();\n };\n\n $scope.handleSubmit = function () {\n let values = {};\n $scope.state.formItems.forEach(function (item) {\n let name = item.antdFormItem && item.antdFormItem.name;\n let value = null;\n\n if (item.state.type === \"checkbox\") {\n value = item.state.checked;\n } else {\n value = item.value || item.state.value;\n }\n\n values[name] = value;\n });\n $scope.onFinish({\n values: values,\n });\n };\n },\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n esNgAntd.createStyle(\"ant-form\", antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n\n if ($scope.form !== undefined) {\n $scope.form = $scope;\n }\n\n if ($scope.name) {\n let inputs = $element[0].querySelectorAll(\"input\");\n\n for (let i = 0; i < inputs.length; i++) {\n const element = inputs[i];\n element.id = $scope.name + \"_\" + element.id;\n }\n }\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/Form/Form.js?");
  140 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Form_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Form.html */ \"./build/Form/Form.html\");\n/* harmony import */ var antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/form/style/index.css */ \"./node_modules/antd/lib/form/style/index.css\");\n\n\nangular.module(\"esNgAntd\").directive(\"antdForm\", [\"esNgAntd\", function (esNgAntd) {\n return {\n template: _Form_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n name: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n form: \"=\",\n onFinish: \"&\"\n },\n controller: function ($scope, $element) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n formItems: []\n };\n\n $scope.resetFields = function () {\n $scope.state.formItems.forEach(function (item) {\n if (typeof item.setValue === \"function\") {\n item.setValue(item.defaultValue || null);\n } else {\n item.value = null;\n }\n });\n };\n\n $scope.submit = function () {\n $scope.handleSubmit();\n };\n\n $scope.handleSubmit = function () {\n let values = {};\n $scope.state.formItems.forEach(function (item) {\n let name = item.antdFormItem && item.antdFormItem.name;\n let value = null;\n\n if (item.state.type === \"checkbox\") {\n value = item.state.checked;\n } else {\n value = item.value || item.state.value;\n }\n\n values[name] = value;\n });\n $scope.onFinish({\n values: values\n });\n };\n },\n link: function ($scope, $element) {\n esNgAntd.createStyle(\"ant-form\", antd_lib_form_style_index_css__WEBPACK_IMPORTED_MODULE_1__[\"default\"]);\n\n if ($scope.form !== undefined) {\n $scope.form = $scope;\n }\n\n if ($scope.name) {\n let inputs = $element[0].querySelectorAll(\"input\");\n\n for (let i = 0; i < inputs.length; i++) {\n const element = inputs[i];\n element.id = $scope.name + \"_\" + element.id;\n }\n }\n }\n };\n}]);\n\n//# sourceURL=webpack://ng-antd/./build/Form/Form.js?");
141 141  
142 142 /***/ }),
143 143  
... ... @@ -148,7 +148,7 @@ eval(&quot;__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _For
148 148 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
149 149  
150 150 "use strict";
151   -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _FormItem_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FormItem.html */ \"./build/FormItem/FormItem.html\");\n/**\n * 表单域\n *\n * @Author: Shann\n * @LastEditors: Shann\n * @Date: 2021-07-26 08:53:33\n * @LastEditTime: 2021-08-05 14:03:05\n * @FilePath: \\angular-js-for-bootstrap\\src\\Essa\\FormItem\\FormItem.js\n * @Copyright: Copyright 2021-2021, all rights reserved. Essa.cn\n */\n\nangular.module(\"esNgAntd\").directive(\"antdFormItem\", function () {\n return {\n controllerAs: \"antdFormItem\",\n restrict: \"E\",\n transclude: true,\n replace: true,\n scope: {\n name: \"@\",\n label: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n required: \"@\",\n },\n template: _FormItem_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 labelCol: null,\n wrapperCol: null,\n };\n },\n require: [\"?^antdForm\"],\n link: function ($scope, $element, $attrs, $controllers, $transclude) {\n let [antdForm] = $controllers;\n $scope.antdForm = antdForm.getContext();\n\n if ($scope.labelCol && $scope.labelCol.span) {\n $scope.state.labelCol = $scope.labelCol.span;\n } else if (\n $scope.antdForm.labelCol &&\n $scope.antdForm.labelCol.span\n ) {\n $scope.state.labelCol = $scope.antdForm.labelCol.span;\n }\n\n if ($scope.wrapperCol && $scope.wrapperCol.span) {\n $scope.state.wrapperCol = $scope.wrapperCol.span;\n } else if (\n $scope.antdForm.wrapperCol &&\n $scope.antdForm.wrapperCol.span\n ) {\n $scope.state.wrapperCol = $scope.antdForm.wrapperCol.span;\n }\n },\n };\n});\n\n\n//# sourceURL=webpack://ng-antd/./build/FormItem/FormItem.js?");
  151 +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _FormItem_html__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FormItem.html */ \"./build/FormItem/FormItem.html\");\n/**\n * 表单域\n */\n\nangular.module(\"esNgAntd\").directive(\"antdFormItem\", function () {\n return {\n template: _FormItem_html__WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n restrict: \"E\",\n replace: true,\n transclude: true,\n scope: {\n name: \"@\",\n label: \"@\",\n labelCol: \"=\",\n wrapperCol: \"=\",\n required: \"=\"\n },\n require: [\"^?antdForm\"],\n controller: function ($scope, $element, $attrs) {\n this.getContext = function () {\n return $scope;\n };\n\n $scope.state = {\n labelCol: null,\n wrapperCol: null\n };\n },\n link: function ($scope, $element, $attrs, $controllers) {\n let [antdForm] = $controllers;\n\n if (antdForm) {\n $scope.antdForm = antdForm.getContext();\n }\n\n if ($scope.labelCol && $scope.labelCol.span) {\n $scope.state.labelCol = $scope.labelCol.span;\n } else if ($scope.antdForm.labelCol && $scope.antdForm.labelCol.span) {\n $scope.state.labelCol = $scope.antdForm.labelCol.span;\n }\n\n if ($scope.wrapperCol && $scope.wrapperCol.span) {\n $scope.state.wrapperCol = $scope.wrapperCol.span;\n } else if ($scope.antdForm.wrapperCol && $scope.antdForm.wrapperCol.span) {\n $scope.state.wrapperCol = $scope.antdForm.wrapperCol.span;\n }\n }\n };\n});\n\n//# sourceURL=webpack://ng-antd/./build/FormItem/FormItem.js?");
152 152  
153 153 /***/ }),
154 154  
... ...
src/Button/Button.js
  Show/Hide comments   View file @50f4289
... ... @@ -25,7 +25,7 @@ class Button {
25 25 },
26 26 };
27 27  
28   - constructor() {
  28 + constructor($element) {
29 29 esNgAntd.createStyle("ant-btn", style);
30 30  
31 31 let className = ["ant-btn"];
... ...
src/Form/Form.js
  Show/Hide comments   View file @50f4289
... ... @@ -4,21 +4,13 @@ import style from &quot;antd/lib/form/style/index.css&quot;;
4 4 class Form {
5 5 useModules = ["esNgAntd"];
6 6  
7   - template = template;
8   -
9   - props = {
10   - name: String,
11   - labelCol: Object,
12   - wrapperCol: Object,
13   - onFinish: Function,
14   - form: Object,
15   - };
  7 + context = true;
16 8  
17 9 state = {
18 10 formItems: [],
19 11 };
20 12  
21   - constructor() {
  13 + constructor($element) {
22 14 esNgAntd.createStyle("ant-form", style);
23 15  
24 16 if (this.form !== undefined) {
... ... @@ -64,4 +56,16 @@ class Form {
64 56 values: values,
65 57 });
66 58 }
  59 +
  60 + render() {
  61 + return template;
  62 + }
67 63 }
  64 +
  65 +Form.propTypes = {
  66 + name: PropTypes.string,
  67 + labelCol: PropTypes.object,
  68 + wrapperCol: PropTypes.object,
  69 + form: PropTypes.object,
  70 + onFinish: PropTypes.function,
  71 +};
... ...
src/FormItem/FormItem.js
  Show/Hide comments   View file @50f4289
1 1 /**
2 2 * 表单域
3   - *
4   - * @Author: Shann
5   - * @LastEditors: Shann
6   - * @Date: 2021-07-26 08:53:33
7   - * @LastEditTime: 2021-08-05 14:03:05
8   - * @FilePath: \angular-js-for-bootstrap\src\Essa\FormItem\FormItem.js
9   - * @Copyright: Copyright 2021-2021, all rights reserved. Essa.cn
10 3 */
11 4 import template from "./FormItem.html";
12 5  
13 6 class FormItem {
14   - props = {
15   - name: String,
16   - label: String,
17   - labelCol: Object,
18   - wrapperCol: Object,
19   - required: Boolean,
20   - };
  7 +
  8 + require = ["^?antdForm"];
  9 +
  10 + context = true;
  11 +
21 12 state = {
22 13 labelCol: null,
23 14 wrapperCol: null,
24 15 };
25 16  
26   - template = template;
  17 + constructor($element, $attrs, $controllers) {
  18 + let [antdForm] = $controllers;
27 19  
28   - constructor(antdForm) {
29   - this.antdForm = antdForm.getContext();
  20 + if (antdForm) {
  21 + this.antdForm = antdForm.getContext();
  22 + }
30 23  
31 24 if (this.props.labelCol && this.props.labelCol.span) {
32 25 this.state.labelCol = this.props.labelCol.span;
... ... @@ -46,4 +39,16 @@ class FormItem {
46 39 this.state.wrapperCol = this.antdForm.wrapperCol.span;
47 40 }
48 41 }
  42 +
  43 + render() {
  44 + return template;
  45 + }
49 46 }
  47 +
  48 +FormItem.propTypes = {
  49 + name: PropTypes.string,
  50 + label: PropTypes.string,
  51 + labelCol: PropTypes.object,
  52 + wrapperCol: PropTypes.object,
  53 + required: PropTypes.boolean,
  54 +};
... ...