addSystemDialog.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <template>
  2. <el-dialog :title="title" :visible.sync="dialogVisible" width="800px" id="addSyDialog">
  3. <div class="table-box">
  4. <el-table :data="tableData" style="width: 100%" height="100%" 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="action" label="操作" min-width="100">
  16. <template slot-scope="scope">
  17. <el-button size="mini" @click="toDetail(scope.$index, scope.row)" type="primary" plain>查看详情</el-button>
  18. </template>
  19. </el-table-column>
  20. </el-table>
  21. </div>
  22. <span slot="footer" class="dialog-footer">
  23. <el-button size="small" @click="dialogVisible = false">取 消</el-button>
  24. <el-button size="small" type="primary" @click="savaRelation">确 定</el-button>
  25. </span>
  26. </el-dialog>
  27. </template>
  28. <script>
  29. import {
  30. notSyInSpaceQuery, //没有和当前空间绑定的系统
  31. syInSpaceCreate, //系统所在业务空间--创建关系
  32. } from "@/api/scan/request";
  33. export default {
  34. data() {
  35. return {
  36. title: '添加空间内的系统',
  37. inSpaceType: '系统',
  38. dialogVisible: false,
  39. tableData: [],
  40. loading: false,
  41. headerStyle: {
  42. backgroundColor: '#e1e4e5',
  43. color: '#2b2b2b',
  44. lineHeight: '30px'
  45. }, // 列表样式
  46. selections: [], // 选中项
  47. }
  48. },
  49. props: {
  50. type: {}, //equipment--equipmentFor
  51. spaceId: {},
  52. zone: {}, //分区类型
  53. },
  54. methods: {
  55. // 显示
  56. showDialog() {
  57. this.dialogVisible = true;
  58. this.tableData = [];
  59. this.getTableData();
  60. },
  61. // 选中项修改
  62. handleSelectionChange(val) {
  63. this.selections = val;
  64. },
  65. // 确认
  66. savaRelation() {
  67. let pa = {
  68. data: {
  69. SpaceId: this.spaceId,
  70. SysIdList: []
  71. },
  72. type: this.zone
  73. }
  74. this.selections.map(t => {
  75. pa.data.SysIdList.push(t.SysID)
  76. })
  77. syInSpaceCreate(pa, res => {
  78. this.$message.success('关联成功');
  79. this.$emit('refresh');
  80. this.dialogVisible = false;
  81. })
  82. },
  83. // 获取表格数据
  84. getTableData() {
  85. let pa = {
  86. data: {
  87. PageSize: 200,
  88. },
  89. type: this.zone,
  90. spaceId: this.spaceId
  91. }
  92. notSyInSpaceQuery(pa, res => {
  93. this.tableData = res.Content;
  94. })
  95. },
  96. // 查看详情
  97. toDetail() {
  98. this.$message('开发中')
  99. }
  100. }
  101. }
  102. </script>
  103. <style lang="less" scoped>
  104. #addSyDialog {
  105. .table-box {
  106. height: 350px;
  107. }
  108. }
  109. </style>