ContactEdit.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. var __defProp = Object.defineProperty;
  2. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  3. var __getOwnPropNames = Object.getOwnPropertyNames;
  4. var __hasOwnProp = Object.prototype.hasOwnProperty;
  5. var __export = (target, all) => {
  6. for (var name2 in all)
  7. __defProp(target, name2, { get: all[name2], enumerable: true });
  8. };
  9. var __copyProps = (to, from, except, desc) => {
  10. if (from && typeof from === "object" || typeof from === "function") {
  11. for (let key of __getOwnPropNames(from))
  12. if (!__hasOwnProp.call(to, key) && key !== except)
  13. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  14. }
  15. return to;
  16. };
  17. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  18. var stdin_exports = {};
  19. __export(stdin_exports, {
  20. contactEditProps: () => contactEditProps,
  21. default: () => stdin_default
  22. });
  23. module.exports = __toCommonJS(stdin_exports);
  24. var import_vue = require("vue");
  25. var import_utils = require("../utils");
  26. var import_cell = require("../cell");
  27. var import_form = require("../form");
  28. var import_field = require("../field");
  29. var import_button = require("../button");
  30. var import_switch = require("../switch");
  31. const [name, bem, t] = (0, import_utils.createNamespace)("contact-edit");
  32. const DEFAULT_CONTACT = {
  33. tel: "",
  34. name: ""
  35. };
  36. const contactEditProps = {
  37. isEdit: Boolean,
  38. isSaving: Boolean,
  39. isDeleting: Boolean,
  40. showSetDefault: Boolean,
  41. setDefaultLabel: String,
  42. contactInfo: {
  43. type: Object,
  44. default: () => (0, import_utils.extend)({}, DEFAULT_CONTACT)
  45. },
  46. telValidator: {
  47. type: Function,
  48. default: import_utils.isMobile
  49. }
  50. };
  51. var stdin_default = (0, import_vue.defineComponent)({
  52. name,
  53. props: contactEditProps,
  54. emits: ["save", "delete", "changeDefault"],
  55. setup(props, {
  56. emit
  57. }) {
  58. const contact = (0, import_vue.reactive)((0, import_utils.extend)({}, DEFAULT_CONTACT, props.contactInfo));
  59. const onSave = () => {
  60. if (!props.isSaving) {
  61. emit("save", contact);
  62. }
  63. };
  64. const onDelete = () => emit("delete", contact);
  65. const renderButtons = () => (0, import_vue.createVNode)("div", {
  66. "class": bem("buttons")
  67. }, [(0, import_vue.createVNode)(import_button.Button, {
  68. "block": true,
  69. "round": true,
  70. "type": "primary",
  71. "text": t("save"),
  72. "class": bem("button"),
  73. "loading": props.isSaving,
  74. "nativeType": "submit"
  75. }, null), props.isEdit && (0, import_vue.createVNode)(import_button.Button, {
  76. "block": true,
  77. "round": true,
  78. "text": t("delete"),
  79. "class": bem("button"),
  80. "loading": props.isDeleting,
  81. "onClick": onDelete
  82. }, null)]);
  83. const renderSwitch = () => (0, import_vue.createVNode)(import_switch.Switch, {
  84. "modelValue": contact.isDefault,
  85. "onUpdate:modelValue": ($event) => contact.isDefault = $event,
  86. "onChange": (checked) => emit("changeDefault", checked)
  87. }, null);
  88. const renderSetDefault = () => {
  89. if (props.showSetDefault) {
  90. return (0, import_vue.createVNode)(import_cell.Cell, {
  91. "title": props.setDefaultLabel,
  92. "class": bem("switch-cell"),
  93. "border": false
  94. }, {
  95. "right-icon": renderSwitch
  96. });
  97. }
  98. };
  99. (0, import_vue.watch)(() => props.contactInfo, (value) => (0, import_utils.extend)(contact, DEFAULT_CONTACT, value));
  100. return () => (0, import_vue.createVNode)(import_form.Form, {
  101. "class": bem(),
  102. "onSubmit": onSave
  103. }, {
  104. default: () => [(0, import_vue.createVNode)("div", {
  105. "class": bem("fields")
  106. }, [(0, import_vue.createVNode)(import_field.Field, {
  107. "modelValue": contact.name,
  108. "onUpdate:modelValue": ($event) => contact.name = $event,
  109. "clearable": true,
  110. "label": t("name"),
  111. "rules": [{
  112. required: true,
  113. message: t("nameEmpty")
  114. }],
  115. "maxlength": "30",
  116. "placeholder": t("name")
  117. }, null), (0, import_vue.createVNode)(import_field.Field, {
  118. "modelValue": contact.tel,
  119. "onUpdate:modelValue": ($event) => contact.tel = $event,
  120. "clearable": true,
  121. "type": "tel",
  122. "label": t("tel"),
  123. "rules": [{
  124. validator: props.telValidator,
  125. message: t("telInvalid")
  126. }],
  127. "placeholder": t("tel")
  128. }, null)]), renderSetDefault(), renderButtons()]
  129. });
  130. }
  131. });