linkassets.vue 9.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326
  1. <template>
  2. <el-dialog title="批量关联资产" :visible.sync="dialog.linkAssets" @open="handleOpenReset" width="700px">
  3. <el-row>
  4. <span class="condition-title">设备类型:</span>
  5. <el-select v-model="deviceType" filterable size="small" @change="handleChangeDevice" style="width:350px;">
  6. <el-option v-for="item in deviceTypeList" :key="item.classCode" :label="item.name"
  7. :value="item.classCode"></el-option>
  8. </el-select>
  9. </el-row>
  10. <el-row style="margin-top:30px;">
  11. <span class="condition-title">建筑楼层:</span>
  12. <el-cascader :options="bfoptions" v-model="buildFloor" filterable size="small" @change="handleChangeBf"
  13. style="width:350px;"></el-cascader>
  14. </el-row>
  15. <el-row style="margin-top:30px;" v-show="spaceShow">
  16. <span class="condition-title">分区类型:</span>
  17. <el-select v-model="zone" filterable size="small" @change="handleChangeZone" style="width:350px;">
  18. <el-option v-for="item in zoneList" :key="item.code" :label="item.name" :value="item.code"></el-option>
  19. </el-select>
  20. </el-row>
  21. <el-row style="margin-top:30px;" v-show="spaceShow && zone != 'all' && zone != 'noKnow'">
  22. <span class="condition-title">空间实例:</span>
  23. <el-select v-model="space" multiple filterable collapse-tags style="width:350px;" placeholder="请选择">
  24. <el-option v-for="item in spaceList" :key="item.value" :label="item.label" :value="item.value">
  25. </el-option>
  26. </el-select>
  27. </el-row>
  28. <span slot="footer" class="dialog-footer">
  29. <el-button @click="handleClickClose">取 消</el-button>
  30. <el-button type="primary" @click="toLinkAssets">确 认</el-button>
  31. </span>
  32. </el-dialog>
  33. </template>
  34. <script>
  35. import { zoneQuery, TypePartsDie } from '@/api/scan/request'
  36. import { queryPhysicsAllType } from '@/api/dict'
  37. import { buildingQuery } from '@/api/object/build'
  38. import { floorQuery } from '@/api/object/floor'
  39. import { mapGetters } from "vuex"
  40. export default {
  41. props: {
  42. dialog: {
  43. type: Object,
  44. default: function () {
  45. return {
  46. linkAssets: false
  47. };
  48. }
  49. }
  50. },
  51. computed: {
  52. ...mapGetters("layout", ["projectId", "secret", "userId"])
  53. },
  54. data() {
  55. return {
  56. bfoptions: [], //建筑楼层列表
  57. buildFloor: ['all'], //选择的建筑楼层
  58. deviceTypeList: [], //未关联资产的设备或部件列表
  59. deviceType: '', //选择的设备类型
  60. zone: 'all', //空间分区
  61. zoneList: [], //空间分区列表
  62. spaceList: [], //空间实例列表
  63. space: [], //选择的空间实例
  64. spaceShow: false
  65. };
  66. },
  67. created() {
  68. this.getPartsDieType() //获取未关联资产的设备或部件类型
  69. this.getBuildFloorData() //获取建筑楼层数据
  70. this.getSpaceData() //获取分区类型数据
  71. },
  72. mounted() {
  73. },
  74. methods: {
  75. //打开弹窗回调,初始化选择
  76. handleOpenReset() {
  77. this.deviceType = ''
  78. this.buildFloor = ['all']
  79. this.zone = 'all'
  80. this.space = []
  81. this.spaceShow = false
  82. },
  83. //获取未关联资产的设备或部件类型
  84. getPartsDieType() {
  85. let _this = this
  86. TypePartsDie(res => {
  87. _this.deviceTypeList = res.content
  88. })
  89. },
  90. //获取建筑楼层数据
  91. getBuildFloorData() {
  92. let data, buildParams = {
  93. pageNumber: 1,
  94. pageSize: 1000,
  95. orders: "localName asc",
  96. projection: [
  97. "id",
  98. "localName"
  99. ]
  100. }, floorParams = {
  101. orders: "floorSequenceId desc",
  102. pageNumber: 1,
  103. pageSize: 1000,
  104. projection: [
  105. "buildingId",
  106. "id",
  107. "localName",
  108. "floorSequenceId"
  109. ]
  110. }
  111. let promise1 = new Promise((resolve, reject) => {
  112. buildingQuery(buildParams, res => {
  113. resolve(res)
  114. })
  115. })
  116. let promise2 = new Promise((resolve, reject) => {
  117. floorQuery(floorParams, res => {
  118. resolve(res)
  119. })
  120. })
  121. Promise.all([promise1, promise2]).then(values => {
  122. let builData = values[0].content, floorData = values[1].content
  123. data = builData.map(build => {
  124. return {
  125. value: build.id,
  126. label: build.localName
  127. }
  128. })
  129. data.unshift({
  130. value: "all",
  131. label: "全部"
  132. }, {
  133. value: "noKnow",
  134. label: "不在建筑内"
  135. })
  136. data.forEach(build => {
  137. floorData.forEach(floor => {
  138. if (build.value == floor.buildingId && floor.id && floor.localName) {
  139. if (build.children) {
  140. build.children.push({
  141. value: floor.id,
  142. label: floor.localName,
  143. FloorSequenceID: floor.floorSequenceId
  144. })
  145. } else {
  146. build.children = []
  147. build.children.push({
  148. value: "all",
  149. label: "全部"
  150. }, {
  151. value: 'noKnow',
  152. label: "不在楼层内"
  153. }, {
  154. value: floor.id,
  155. label: floor.localName,
  156. FloorSequenceID: floor.floorSequenceId
  157. })
  158. }
  159. }
  160. })
  161. })
  162. this.bfoptions = data
  163. })
  164. },
  165. //获取空间分区数据
  166. getSpaceData() {
  167. let params = {
  168. type: "space"
  169. }
  170. queryPhysicsAllType(params, res => {
  171. if (res.content) {
  172. this.zoneList = res.content.filter(item => {
  173. if (item.name !== item.aliasName) {
  174. item.name = `${item.name}(${item.aliasName})`
  175. }
  176. if (item.code != 'Ispace') {
  177. return item
  178. }
  179. })
  180. this.zoneList.unshift({
  181. name: '全部',
  182. code: 'all'
  183. })
  184. this.zoneList.push({
  185. name: '不在任何业务空间内',
  186. code: 'noKnow'
  187. })
  188. }
  189. })
  190. },
  191. // 修改设备类型
  192. handleChangeDevice(val) {
  193. this.zoneListIsShow()
  194. },
  195. // 修改建筑楼层
  196. handleChangeBf(val) {
  197. this.zoneListIsShow()
  198. // 重置空间实例选择
  199. this.space = []
  200. this.spaceList = []
  201. this.handleChangeSpaceItem()
  202. },
  203. //判断是否显示空间分区选择
  204. zoneListIsShow() {
  205. let lastVal = this.buildFloor.slice(-1)[0]
  206. if (!lastVal || lastVal == 'noKnow' || this.buildFloor[0] == 'all' || this.deviceType.length != 6) {
  207. this.spaceShow = false
  208. } else {
  209. this.spaceShow = true
  210. }
  211. },
  212. //修改分区类型
  213. handleChangeZone() {
  214. // 重置空间实例选择
  215. this.space = []
  216. this.spaceList = []
  217. this.handleChangeSpaceItem()
  218. },
  219. // 获取空间实例
  220. handleChangeSpaceItem() {
  221. if (this.zone != 'all' && this.zone != 'noKnow') {
  222. let nodes = []
  223. let recursionGetData = (pageNum, zone) => {
  224. pageNum = pageNum ? pageNum : 1
  225. let params = {
  226. orders: "createTime desc, id asc",
  227. pageNumber: pageNum,
  228. pageSize: 1000,
  229. projection: ["id", "name", "localName", "createTime"],
  230. zoneType: zone
  231. }
  232. if (this.spaceShow) {
  233. if (this.buildFloor.length == 2 && this.buildFloor[1] != 'all') {
  234. params.buildingId = this.buildFloor[0];
  235. params.floorId = this.buildFloor[1];
  236. } else {
  237. params.buildingId = this.buildFloor[0];
  238. }
  239. }
  240. zoneQuery(params, res => {
  241. nodes = nodes.concat(res.content.map(item => ({
  242. value: item.id,
  243. label: item.localName ? item.localName : item.name
  244. })))
  245. if (res.total / (res.pageSize * res.pageNumber) > 1) {
  246. recursionGetData(res.pageNumber + 1, zone)
  247. } else {
  248. this.spaceList = nodes
  249. }
  250. })
  251. }
  252. recursionGetData(1, this.zone)
  253. }
  254. },
  255. // 点击取消关闭弹窗
  256. handleClickClose() {
  257. this.dialog.linkAssets = false
  258. },
  259. // 批量关联资产详情页
  260. toLinkAssets() {
  261. let query = {}
  262. // 校验必填项
  263. if (!this.deviceType) {
  264. this.$message.info('请选择设备类型!')
  265. return false
  266. } else if (!this.buildFloor.length) {
  267. this.$message.info('请选择建筑楼层!')
  268. return false
  269. }
  270. if (this.spaceShow) { //选择了空间
  271. if (this.zone == 'all') {//全部空间
  272. query = {
  273. deviceType: this.deviceType,
  274. buildFloor: this.buildFloor
  275. }
  276. } else {
  277. if (this.space.length) {//选择了具体的空间实例
  278. query = {
  279. deviceType: this.deviceType,
  280. buildFloor: this.buildFloor,
  281. spaceList: this.space
  282. }
  283. } else {
  284. query = {
  285. deviceType: this.deviceType,
  286. buildFloor: this.buildFloor,
  287. spaceList: this.zone //(包含具体的业务空间分区和不在任何分区两种情况)
  288. }
  289. }
  290. }
  291. } else {
  292. query = {
  293. deviceType: this.deviceType,
  294. buildFloor: this.buildFloor
  295. }
  296. }
  297. this.$router.push({
  298. name: "batchlinkAssets",
  299. params: query
  300. })
  301. }
  302. },
  303. watch: {}
  304. };
  305. </script>
  306. <style lang="less" scoped>
  307. .condition-title {
  308. width: 100px;
  309. display: inline-block;
  310. text-align: right;
  311. margin-left: 10px;
  312. margin-right: 12px;
  313. color: #999999;
  314. font-size: 14px;
  315. vertical-align: top;
  316. }
  317. /deep/ .el-dialog__body {
  318. max-height: 420px;
  319. overflow-y: auto;
  320. }
  321. </style>