floorCascader.vue 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <template>
  2. <div id="buildFloor">
  3. <span class="buildFloor">建筑楼层</span>
  4. <el-cascader ref="floorCascader" placeholder="请选择建筑楼层" :options="options" v-model="value" filterable size="small" :style="isWidth ? '' : 'width:160px;'" @change="changeCascader"></el-cascader>
  5. </div>
  6. </template>
  7. <script>
  8. import tools from "@/utils/scan/tools"
  9. import { floorQuery, buildingQuery } from '@/api/scan/request'
  10. import { mapGetters, mapActions } from "vuex"
  11. export default {
  12. props: {
  13. isWidth: {
  14. type: Boolean,
  15. default: true
  16. },
  17. type: {
  18. type: String,
  19. default: "yes"
  20. }
  21. },
  22. computed: {
  23. ...mapGetters("layout", [
  24. "projectId",
  25. "secret",
  26. "userId"
  27. ])
  28. },
  29. data() {
  30. return {
  31. options: [],
  32. param: {
  33. ProjId: '',
  34. secret: ''
  35. },
  36. value: ['all']
  37. };
  38. },
  39. created() {
  40. this.param.ProjId = this.projectId
  41. this.param.secret = this.secret
  42. this.getData()
  43. },
  44. watch: {
  45. projectId() {
  46. this.value = ['all'];
  47. this.options = [];
  48. this.param.ProjId = this.projectId
  49. this.param.secret = this.secret
  50. this.getData()
  51. this.changeCascader(['all'])
  52. }
  53. },
  54. methods: {
  55. //设置默认选项
  56. setValue(val) {
  57. if (val && val.length) {
  58. this.value = val
  59. }
  60. },
  61. //获取数据
  62. getData() {
  63. let data, buildParams = {
  64. PageNumber: 1,
  65. PageSize: 1000,
  66. Orders: "BuildLocalName asc",
  67. Projection: [
  68. "BuildID",
  69. "BuildLocalName"
  70. ]
  71. }, floorParams = {
  72. Orders: "FloorSequenceID desc",
  73. PageNumber: 1,
  74. PageSize: 1000,
  75. Projection: [
  76. "BuildID",
  77. "FloorID",
  78. "FloorLocalName",
  79. "FloorSequenceID",
  80. "StructureInfo",
  81. "Outline"
  82. ]
  83. }
  84. let promise1 = new Promise((resolve, reject) => {
  85. buildingQuery(buildParams, res => {
  86. resolve(res)
  87. })
  88. })
  89. let promise2 = new Promise((resolve, reject) => {
  90. floorQuery(floorParams, res => {
  91. resolve(res)
  92. })
  93. })
  94. Promise.all([promise1, promise2]).then(values => {
  95. let builData = values[0].Content, floorData = values[1].Content
  96. data = builData.map(build => {
  97. return {
  98. value: build.BuildID,
  99. label: build.BuildLocalName
  100. }
  101. })
  102. data.unshift({
  103. value: "all",
  104. label: "全部"
  105. }, {
  106. value: "noKnow",
  107. label: "未明确建筑"
  108. })
  109. data.forEach(build => {
  110. floorData.forEach(floor => {
  111. if (build.value == floor.BuildID && floor.FloorID && floor.FloorLocalName && this.type == "yes") {
  112. if (build.children) {
  113. build.children.push({
  114. value: floor.FloorID,
  115. label: floor.FloorLocalName,
  116. FloorSequenceID: floor.FloorSequenceID,
  117. StructureInfo: floor.StructureInfo || {},
  118. Outline: floor.Outline || null
  119. })
  120. } else {
  121. build.children = []
  122. build.children.push({
  123. value: "all",
  124. label: "全部"
  125. },{
  126. value: 'noKnow',
  127. label: "未明确楼层"
  128. },{
  129. value: floor.FloorID,
  130. label: floor.FloorLocalName,
  131. FloorSequenceID: floor.FloorSequenceID,
  132. StructureInfo: floor.StructureInfo || {},
  133. Outline: floor.Outline || null
  134. })
  135. }
  136. }
  137. })
  138. })
  139. this.options = data
  140. })
  141. },
  142. //改变item
  143. changeCascader(value) {
  144. let node = this.$refs.floorCascader.getCheckedNodes();
  145. this.$emit("change", value, node[0].data);
  146. }
  147. }
  148. };
  149. </script>
  150. <style lang="less">
  151. .el-cascader .el-input .el-input__inner {
  152. vertical-align: bottom;
  153. }
  154. </style>
  155. <style lang="less" scoped>
  156. #buildFloor {
  157. margin-left: 10px;
  158. float: left;
  159. }
  160. .buildFloor {
  161. color: #999999;
  162. font-size: 14px;
  163. margin-right: 12px;
  164. }
  165. </style>