areaList.js 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. import { getAreaAll } from '@/api/data'
  2. import { arrayToTree } from '@/utils/util'
  3. const AreaList = {
  4. template: `
  5. <a-cascader
  6. :size="size"
  7. :changeOnSelect="changeOnSelect"
  8. :show-search="{ filter }"
  9. @change="handleChange"
  10. :value="defaultVal"
  11. expand-trigger="hover"
  12. :allowClear="allowClear"
  13. :options="list"
  14. :field-names="{ label: 'name', value: defValKey, children: 'children' }"
  15. :id="id"
  16. :placeholder="placeholder"
  17. style="width: 100%;" />
  18. `,
  19. props: {
  20. value: {
  21. type: Array,
  22. defatut: function(){
  23. return []
  24. }
  25. },
  26. id: {
  27. type: String,
  28. default: ''
  29. },
  30. defValKey: {
  31. type: String,
  32. default: 'areaSn'
  33. },
  34. placeholder: {
  35. type: String,
  36. default: '请选择省/市/区'
  37. },
  38. allowClear: {
  39. type: Boolean,
  40. default: true
  41. },
  42. size: {
  43. type: String,
  44. default: 'default'
  45. },
  46. changeOnSelect:{
  47. type: Boolean,
  48. default: false
  49. }
  50. },
  51. data() {
  52. return {
  53. defaultVal: this.value,
  54. list: []
  55. };
  56. },
  57. watch: {
  58. value(newValue, oldValue) {
  59. this.defaultVal = newValue
  60. },
  61. },
  62. mounted() {
  63. this.getArea()
  64. },
  65. methods: {
  66. filter(inputValue, path) {
  67. return path.some(option => option.name.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
  68. },
  69. handleChange (value, selectedOptions) {
  70. this.defaultVal = value
  71. this.$emit('input', this.defaultVal)
  72. this.$emit('change', this.defaultVal, selectedOptions)
  73. },
  74. // 省/市/区
  75. getArea () {
  76. getAreaAll().then(res => {
  77. if (res.status == 200) {
  78. this.list = arrayToTree(res.data,0)
  79. }
  80. })
  81. },
  82. clearData(){
  83. this.handleChange([],null)
  84. }
  85. },
  86. };
  87. export default AreaList