accountCheck.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  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%" :confirm-loading="confirmLoading">
  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-tree
  20. v-model="checkedKeys"
  21. checkable
  22. :expanded-keys="expandedKeys"
  23. :auto-expand-parent="autoExpandParent"
  24. :selected-keys="selectedKeys"
  25. :tree-data="treeData"
  26. @expand="onExpand"
  27. @select="onSelect"
  28. />
  29. </a-modal>
  30. </div>
  31. </template>
  32. <script>
  33. import { deleteAction, getAction } from '@/api/manage'
  34. // import lifting from './components/lifting'
  35. export default {
  36. name: 'modules',
  37. components: {},
  38. data: function () {
  39. return {
  40. checkedKeys: [],
  41. showEdit: false,
  42. dataList: [],
  43. showList: null,
  44. dataValue: [],
  45. indeterminate: false,
  46. checkAll: false,
  47. expandedKeys: [],
  48. autoExpandParent: true,
  49. selectedKeys: [],
  50. treeData:[],
  51. confirmLoading:false,
  52. }
  53. },
  54. watch: {
  55. checkedKeys(val) {
  56. console.log('onCheck', val)
  57. },
  58. },
  59. methods: {
  60. onExpand(expandedKeys) {
  61. console.log('onExpand', expandedKeys)
  62. // if not set autoExpandParent to false, if children expanded, parent can not collapse.
  63. // or, you can remove all expanded children keys.
  64. this.expandedKeys = expandedKeys
  65. this.autoExpandParent = false
  66. },
  67. onCheck(checkedKeys) {
  68. this.checkedKeys = checkedKeys
  69. },
  70. onSelect(selectedKeys, info) {
  71. this.selectedKeys = selectedKeys
  72. },
  73. handleOk(e) {
  74. this.confirmLoading = true
  75. let defaultData = this.checkedKeys.filter(item => item.toString().indexOf('-') === -1);
  76. this.showEdit = false
  77. this.$emit('synchro', defaultData)
  78. },
  79. close() {
  80. this.showEdit = false
  81. this.dataList = []
  82. this.showList = null
  83. this.dataValue = []
  84. this.indeterminate = false
  85. this.checkAll = false
  86. },
  87. onCheckAllChange(e) {
  88. Object.assign(this, {
  89. dataValue: e.target.checked
  90. ? this.showList.map((item) => {
  91. return item.value
  92. })
  93. : [],
  94. indeterminate: false,
  95. checkAll: e.target.checked,
  96. })
  97. },
  98. onChange(checkedList) {
  99. this.indeterminate = !!this.dataValue.length && this.dataValue.length < this.showList.length
  100. this.checkAll = this.dataValue.length === this.showList.length
  101. },
  102. getData(url, item) {
  103. this.confirmLoading = false
  104. this.showEdit = true
  105. this.dataList = []
  106. this.showList = null
  107. this.dataValue = []
  108. this.checkedKeys = []
  109. this.indeterminate = false
  110. this.checkAll = false
  111. console.log(url, item)
  112. getAction(url, item).then((res) => {
  113. if (res.success) {
  114. let arrList = []
  115. this.treeData = res.result.map(item=>{
  116. return {
  117. title: item.projectName,
  118. key: item.projectId + '-',
  119. children:item.userAllocationList.map(i=>{
  120. return {
  121. title: i.authName+'\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0'+(i.userName?i.userName:'管理员'),
  122. key: i.accountId
  123. }
  124. })
  125. }
  126. })
  127. }
  128. console.log(res)
  129. })
  130. },
  131. },
  132. computed: {},
  133. }
  134. </script>