index.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <template>
  2. <el-select
  3. v-model="selectedCompanyId"
  4. placeholder="选择租户"
  5. clearable
  6. filterable
  7. size="small"
  8. class="tenant-selector"
  9. @change="handleTenantChange"
  10. >
  11. <el-option
  12. v-for="item in tenantList"
  13. :key="item.id"
  14. :label="item.tenantName"
  15. :value="item.id"
  16. />
  17. </el-select>
  18. </template>
  19. <script>
  20. import { tenantList } from '@/api/tenant/tenant'
  21. export default {
  22. name: 'TenantSelector',
  23. data() {
  24. return {
  25. tenantList: [],
  26. selectedCompanyId: null
  27. }
  28. },
  29. created() {
  30. this.loadTenants()
  31. // 从Vuex恢复上次选择
  32. const saved = this.$store.getters.selectedCompanyId
  33. if (saved) {
  34. this.selectedCompanyId = saved
  35. }
  36. },
  37. methods: {
  38. loadTenants() {
  39. tenantList().then(response => {
  40. this.tenantList = response.rows || response.data || []
  41. }).catch(() => {
  42. this.tenantList = []
  43. })
  44. },
  45. handleTenantChange(val) {
  46. this.$store.dispatch('tenant/setTenantId', val)
  47. }
  48. }
  49. }
  50. </script>
  51. <style lang="scss" scoped>
  52. .tenant-selector {
  53. width: 180px;
  54. margin-right: 10px;
  55. ::v-deep .el-input__inner {
  56. height: 30px;
  57. line-height: 30px;
  58. }
  59. }
  60. </style>