accountCheck.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <style>
  2. .checked-account {
  3. width: 100%;
  4. }
  5. .checked-account .ant-checkbox-wrapper {
  6. width: 20%;
  7. min-width: 300px;
  8. white-space: nowrap;
  9. text-overflow: ellipsis;
  10. overflow: hidden;
  11. }
  12. </style>
  13. <template>
  14. <div>
  15. <a-modal title="账户选择" v-model="showEdit" @ok="handleOk" @cancel="close" width="80%">
  16. <a-checkbox :indeterminate="indeterminate" @change="onCheckAllChange" :checked="checkAll">全选</a-checkbox>
  17. <br />
  18. <a-checkbox-group :options="showList" v-model="dataValue" class="checked-account" @change="onChange"/>
  19. </a-modal>
  20. </div>
  21. </template>
  22. <script>
  23. import { deleteAction, getAction } from '@/api/manage'
  24. // import lifting from './components/lifting'
  25. export default {
  26. name: 'modules',
  27. components: {},
  28. data: function () {
  29. return {
  30. showEdit: false,
  31. dataList: [],
  32. showList: null,
  33. dataValue: [],
  34. indeterminate: false,
  35. checkAll: false,
  36. }
  37. },
  38. methods: {
  39. handleOk(e) {
  40. console.log(e)
  41. this.showEdit = false
  42. this.$emit('synchro', this.dataValue)
  43. },
  44. close() {
  45. this.showEdit = false
  46. this.dataList = []
  47. this.showList = null
  48. this.dataValue = []
  49. this.indeterminate = false
  50. this.checkAll = false
  51. },
  52. onCheckAllChange(e) {
  53. Object.assign(this, {
  54. dataValue: e.target.checked
  55. ? this.showList.map((item) => {
  56. return item.value
  57. })
  58. : [],
  59. indeterminate: false,
  60. checkAll: e.target.checked,
  61. })
  62. },
  63. onChange(checkedList) {
  64. this.indeterminate = !!this.dataValue.length && this.dataValue.length < this.showList.length
  65. this.checkAll = this.dataValue.length === this.showList.length
  66. },
  67. getData(url, item) {
  68. this.showEdit = true
  69. this.dataList = []
  70. this.showList = null
  71. this.dataValue = []
  72. this.indeterminate = false
  73. this.checkAll = false
  74. console.log(url, item)
  75. getAction(url, item).then((res) => {
  76. if (res.code == 0) {
  77. this.showList = res.result.map((item) => {
  78. return {
  79. label: item.authName,
  80. value: item.accountId,
  81. }
  82. })
  83. }
  84. console.log(res)
  85. })
  86. },
  87. },
  88. computed: {},
  89. }
  90. </script>