AddressEditDetail.mjs 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. import { ref, defineComponent, createVNode as _createVNode, Fragment as _Fragment } from "vue";
  2. import { createNamespace, numericProp } from "../utils/index.mjs";
  3. import { Cell } from "../cell/index.mjs";
  4. import { Field } from "../field/index.mjs";
  5. const [name, bem] = createNamespace("address-edit-detail");
  6. const t = createNamespace("address-edit")[2];
  7. var stdin_default = defineComponent({
  8. name,
  9. props: {
  10. show: Boolean,
  11. rows: numericProp,
  12. value: String,
  13. rules: Array,
  14. focused: Boolean,
  15. maxlength: numericProp,
  16. searchResult: Array,
  17. showSearchResult: Boolean
  18. },
  19. emits: ["blur", "focus", "input", "selectSearch"],
  20. setup(props, {
  21. emit
  22. }) {
  23. const field = ref();
  24. const showSearchResult = () => props.focused && props.searchResult && props.showSearchResult;
  25. const onSelect = (express) => {
  26. emit("selectSearch", express);
  27. emit("input", `${express.address || ""} ${express.name || ""}`.trim());
  28. };
  29. const renderSearchResult = () => {
  30. if (!showSearchResult()) {
  31. return;
  32. }
  33. const {
  34. searchResult
  35. } = props;
  36. return searchResult.map((express) => _createVNode(Cell, {
  37. "clickable": true,
  38. "key": (express.name || "") + (express.address || ""),
  39. "icon": "location-o",
  40. "title": express.name,
  41. "label": express.address,
  42. "class": bem("search-item"),
  43. "border": false,
  44. "onClick": () => onSelect(express)
  45. }, null));
  46. };
  47. const onBlur = (event) => emit("blur", event);
  48. const onFocus = (event) => emit("focus", event);
  49. const onInput = (value) => emit("input", value);
  50. return () => {
  51. if (props.show) {
  52. return _createVNode(_Fragment, null, [_createVNode(Field, {
  53. "autosize": true,
  54. "clearable": true,
  55. "ref": field,
  56. "class": bem(),
  57. "rows": props.rows,
  58. "type": "textarea",
  59. "rules": props.rules,
  60. "label": t("addressDetail"),
  61. "border": !showSearchResult(),
  62. "maxlength": props.maxlength,
  63. "modelValue": props.value,
  64. "placeholder": t("addressDetail"),
  65. "onBlur": onBlur,
  66. "onFocus": onFocus,
  67. "onUpdate:modelValue": onInput
  68. }, null), renderSearchResult()]);
  69. }
  70. };
  71. }
  72. });
  73. export {
  74. stdin_default as default
  75. };