addSystemDialog.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. <template>
  2. <el-dialog :title="title" :visible.sync="dialogVisible" width="900px" id="addEqDialog">
  3. <div class="table-box">
  4. <el-table :data="tableData" style="width: 100%" height="350" v-loading="loading" :header-cell-style="headerStyle" ref="multipleTable"
  5. @selection-change="handleSelectionChange">
  6. <el-table-column type="selection" width="55"></el-table-column>
  7. <el-table-column :label="`${inSpaceType}名称`" show-overflow-tooltip min-width="100">
  8. <template slot-scope="scope">
  9. <div>
  10. {{scope.row.SysLocalName||scope.row.SysName||''}}
  11. </div>
  12. </template>
  13. </el-table-column>
  14. <el-table-column prop="SysLocalId" :label="`${inSpaceType}本地编码`" show-overflow-tooltip min-width="100"></el-table-column>
  15. <el-table-column prop="CategoryNames.CategoryName" :label="`${inSpaceType}类`" show-overflow-tooltip min-width="100"></el-table-column>
  16. <el-table-column prop="action" label="操作" min-width="100">
  17. <template slot-scope="scope">
  18. <el-button size="mini" @click="toDetail(scope.$index, scope.row)" plain>查看详情</el-button>
  19. </template>
  20. </el-table-column>
  21. </el-table>
  22. <!-- 分页 -->
  23. <el-pagination class="fr" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange"
  24. :current-page="page.pageNumber" :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
  25. :total="page.total"></el-pagination>
  26. </div>
  27. <span slot="footer" class="dialog-footer">
  28. <el-button size="small" @click="dialogVisible = false">取 消</el-button>
  29. <el-button size="small" type="primary" @click="savaRelation">确 定</el-button>
  30. </span>
  31. </el-dialog>
  32. </template>
  33. <script>
  34. import { unshaftInSys, linkSySh } from "@/api/scan/request";
  35. import floorCascader from "@/components/ledger/lib/floorCascader";
  36. import { mapGetters } from "vuex";
  37. export default {
  38. components: {
  39. floorCascader
  40. },
  41. computed: {
  42. ...mapGetters("layout", ["projectId"])
  43. },
  44. data() {
  45. return {
  46. title: "添加竖井内的系统",
  47. inSpaceType: '系统',
  48. dialogVisible: false,
  49. tableData: [],
  50. loading: false,
  51. selections: [], // 选中项
  52. page: {
  53. pageSize: 50,
  54. pageSizes: [10, 20, 50, 100],
  55. pageNumber: 1,
  56. total: 0
  57. },
  58. headerStyle: {
  59. backgroundColor: '#e1e4e5',
  60. color: '#2b2b2b',
  61. lineHeight: '30px'
  62. } // 列表样式
  63. };
  64. },
  65. props: {
  66. type: String, //选中的tab页
  67. params: Object //查看的竖井关系信息
  68. },
  69. created() { },
  70. methods: {
  71. // 显示弹窗
  72. showDialog() {
  73. this.dialogVisible = true
  74. this.page.pageNumber = 1
  75. this.tableData = []
  76. this.getTableData()
  77. },
  78. getTableData() {
  79. let params = {
  80. data: {
  81. Cascade: [{ Name: 'categoryNames' }],
  82. Orders: "createTime desc, SysID desc",
  83. PageNumber: this.page.pageNumber,
  84. PageSize: this.page.pageSize,
  85. },
  86. shaftId: this.params.ShaftID
  87. }
  88. unshaftInSys(params, res => {
  89. this.tableData = res.Content
  90. this.page.total = res.Total
  91. })
  92. },
  93. //选中项修改
  94. handleSelectionChange(val) {
  95. this.selections = val;
  96. },
  97. savaRelation() {
  98. if(this.selections.length){
  99. let params = {
  100. ShaftId: this.params.ShaftID,
  101. SysIdList: this.selections.map(item => {
  102. return item.SysID
  103. })
  104. }
  105. linkSySh(params, res => {
  106. this.dialogVisible = false
  107. this.$message.success('关联成功!')
  108. this.$emit('refresh')
  109. })
  110. }else {
  111. this.$message('请选择要关联的设备')
  112. }
  113. },
  114. //改变pagesize
  115. handleSizeChange(pageSize) {
  116. this.page.pageSize = pageSize;
  117. this.getTableData();
  118. },
  119. //改变pageno
  120. handleCurrentChange(pageNo) {
  121. this.page.pageNumber = pageNo;
  122. this.getTableData();
  123. },
  124. // 查看详情
  125. toDetail() {
  126. this.$message('开发中')
  127. }
  128. },
  129. };
  130. </script>
  131. <style lang="less" scoped>
  132. #addEqDialog {
  133. .filters {
  134. margin-bottom: 10px;
  135. /deep/ .el-input__inner {
  136. vertical-align: baseline;
  137. }
  138. }
  139. .table-box {
  140. height: 370px;
  141. .fr{
  142. margin-top: 10px;
  143. }
  144. }
  145. }
  146. </style>