CountryDict.vue 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <view>
  3. <uni-nav-bar
  4. status-bar = true
  5. fixed = true
  6. background-color="#03b6b3"
  7. color="#ffffff"
  8. left-icon="arrowleft"
  9. @clickLeft="navigateBack">
  10. <text slot="default" style="text-align: center; flex: 1; font-size: 18px; font-weight: bold;">国家</text>
  11. </uni-nav-bar>
  12. <uni-indexed-list :options="list" :showSelect="false" @click="bindClick"></uni-indexed-list>
  13. </view>
  14. </template>
  15. <script>
  16. import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue";
  17. import uniIndexedList from "@/components/uni-indexed-list/uni-indexed-list.vue";
  18. export default {
  19. comments: {uniNavBar, uniIndexedList},
  20. data() {
  21. return {
  22. list: [],
  23. sourceList: []
  24. }
  25. },
  26. mounted(){
  27. this.initDicts();
  28. },
  29. methods: {
  30. bindClick(e){
  31. // console.log(e)
  32. let key;
  33. this.sourceList.forEach(item => {
  34. // console.log(item)
  35. if(e.item.name == item.label){
  36. key = item.value;
  37. }
  38. })
  39. let selectedCountry = e.item.name;
  40. const eventChannel = this.getOpenerEventChannel();
  41. eventChannel.emit('acceptSelectedCountry', {country: selectedCountry, key: key});
  42. uni.navigateBack();
  43. },
  44. navigateBack() {
  45. uni.navigateBack()
  46. },
  47. async initDicts(){
  48. const res= await this.$myRequest({
  49. url: '/sys/sysDicts',
  50. data: {
  51. type: 'unit_country_dict'
  52. }
  53. })
  54. this.sourceList = res.data[0];
  55. res.data[0].forEach(code => {
  56. let letter = code.value[0].toUpperCase();
  57. let itemValue = code.label;
  58. if(this.list.length){
  59. let hasSameLetter = false;
  60. let listItemIndex;
  61. for(let l = 0; l < this.list.length; l++){
  62. if(this.list[l].letter == letter){
  63. hasSameLetter = true;
  64. listItemIndex = l;
  65. break;
  66. }
  67. }
  68. if(hasSameLetter){
  69. this.list[listItemIndex].data.push(itemValue);
  70. }else{
  71. this.list.push({
  72. letter: letter,
  73. data: [itemValue]
  74. });
  75. }
  76. }else{
  77. this.list.push({
  78. letter: letter,
  79. data: [itemValue]
  80. });
  81. }
  82. this.list.sort(function(a, b){
  83. return a.letter.charCodeAt()-b.letter.charCodeAt();
  84. })
  85. })
  86. },
  87. }
  88. }
  89. </script>
  90. <style scoped>
  91. /deep/ .uni-indexed-list__menu{
  92. width: 30px;
  93. }
  94. </style>