Detail.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. // Utils
  3. import { createNamespace } from '../utils';
  4. import { isAndroid } from '../utils/validate/system'; // Components
  5. import Cell from '../cell';
  6. import Field from '../field';
  7. var _createNamespace = createNamespace('address-edit-detail'),
  8. createComponent = _createNamespace[0],
  9. bem = _createNamespace[1],
  10. t = _createNamespace[2];
  11. var android = isAndroid();
  12. export default createComponent({
  13. props: {
  14. value: String,
  15. errorMessage: String,
  16. focused: Boolean,
  17. detailRows: [Number, String],
  18. searchResult: Array,
  19. detailMaxlength: [Number, String],
  20. showSearchResult: Boolean
  21. },
  22. computed: {
  23. shouldShowSearchResult: function shouldShowSearchResult() {
  24. return this.focused && this.searchResult && this.showSearchResult;
  25. }
  26. },
  27. methods: {
  28. onSelect: function onSelect(express) {
  29. this.$emit('select-search', express);
  30. this.$emit('input', ((express.address || '') + " " + (express.name || '')).trim());
  31. },
  32. onFinish: function onFinish() {
  33. this.$refs.field.blur();
  34. },
  35. genFinish: function genFinish() {
  36. var h = this.$createElement;
  37. var show = this.value && this.focused && android;
  38. if (show) {
  39. return h("div", {
  40. "class": bem('finish'),
  41. "on": {
  42. "click": this.onFinish
  43. }
  44. }, [t('complete')]);
  45. }
  46. },
  47. genSearchResult: function genSearchResult() {
  48. var _this = this;
  49. var h = this.$createElement;
  50. var value = this.value,
  51. shouldShowSearchResult = this.shouldShowSearchResult,
  52. searchResult = this.searchResult;
  53. if (shouldShowSearchResult) {
  54. return searchResult.map(function (express) {
  55. return h(Cell, {
  56. "key": express.name + express.address,
  57. "attrs": {
  58. "clickable": true,
  59. "border": false,
  60. "icon": "location-o",
  61. "label": express.address
  62. },
  63. "class": bem('search-item'),
  64. "on": {
  65. "click": function click() {
  66. _this.onSelect(express);
  67. }
  68. },
  69. "scopedSlots": {
  70. title: function title() {
  71. if (express.name) {
  72. var text = express.name.replace(value, "<span class=" + bem('keyword') + ">" + value + "</span>");
  73. return h("div", {
  74. "domProps": {
  75. "innerHTML": text
  76. }
  77. });
  78. }
  79. }
  80. }
  81. });
  82. });
  83. }
  84. }
  85. },
  86. render: function render() {
  87. var h = arguments[0];
  88. return h(Cell, {
  89. "class": bem()
  90. }, [h(Field, {
  91. "attrs": {
  92. "autosize": true,
  93. "rows": this.detailRows,
  94. "clearable": !android,
  95. "type": "textarea",
  96. "value": this.value,
  97. "errorMessage": this.errorMessage,
  98. "border": !this.shouldShowSearchResult,
  99. "label": t('label'),
  100. "maxlength": this.detailMaxlength,
  101. "placeholder": t('placeholder')
  102. },
  103. "ref": "field",
  104. "scopedSlots": {
  105. icon: this.genFinish
  106. },
  107. "on": _extends({}, this.$listeners)
  108. }), this.genSearchResult()]);
  109. }
  110. });