modelTaskDialog.vue 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
  1. <template>
  2. <el-dialog :title="title" :visible.sync="dialogVisible" :before-close="handleClose" 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 type="expand">
  8. <template slot-scope="props">
  9. <p v-if="props.row.ComponentCount && props.row.ComponentCount.length" style="color:#99a9bf;line-height:32px;font-size:14px;">包含的部件:</p>
  10. <el-form label-position="left" label-width="auto" inline class="demo-table-expand"
  11. v-if="props.row.ComponentCount && props.row.ComponentCount.length">
  12. <el-form-item v-for="item in props.row.ComponentCount?props.row.ComponentCount:[]" :key="item.code" :label="`${item.name}:`">
  13. <span>{{ item.count }}</span>
  14. </el-form-item>
  15. </el-form>
  16. </template>
  17. </el-table-column>
  18. <el-table-column prop="FolderName" label="所属模型文件夹" width="110" show-overflow-tooltip></el-table-column>
  19. <el-table-column prop="FileName" label="模型文件名" width="80" show-overflow-tooltip></el-table-column>
  20. <el-table-column prop="EquipLocalName" label="设备本地名称" show-overflow-tooltip width="100"></el-table-column>
  21. <el-table-column prop="EquipLocalID" label="设备本地编码" show-overflow-tooltip width="100"></el-table-column>
  22. <el-table-column prop="EquipCategory.EquipName" label="设备类" show-overflow-tooltip width="120"></el-table-column>
  23. <el-table-column prop="BimId" label="BIM Id" show-overflow-tooltip width="80"></el-table-column>
  24. <el-table-column prop="type" label="现场验证操作规定" width="150">
  25. <template slot-scope="scope">
  26. <el-select style="width:100px;" v-model="scope.row.SchemeId" placeholder="请选择">
  27. <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
  28. </el-select>
  29. </template>
  30. </el-table-column>
  31. <template slot="empty">
  32. <div style="height: 60%;transform: translateY(50%);">
  33. <i class="icon-wushuju iconfont"></i>
  34. 数据暂无
  35. </div>
  36. </template>
  37. </el-table>
  38. <!-- 分页 -->
  39. <el-pagination class="fr" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange"
  40. :current-page="page.pageNumber" :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
  41. :total="page.total"></el-pagination>
  42. </div>
  43. <span slot="footer" class="dialog-footer">
  44. <el-button size="small" @click="$emit('update:dialogVisible',false)">返回重选</el-button>
  45. <el-button size="small" type="primary" @click="savaRelation">确认创建</el-button>
  46. </span>
  47. </el-dialog>
  48. </template>
  49. <script>
  50. import { queryEquip } from "@/api/scan/request"
  51. import { createModelTask, queryModelDiglog } from "@/api/data_admin/buildTaskApi"
  52. import { mapGetters } from "vuex"
  53. export default {
  54. components: {
  55. },
  56. computed: {
  57. ...mapGetters("layout", ["projectId"])
  58. },
  59. data() {
  60. return {
  61. title: "确认创建任务",
  62. options: [{//方案
  63. value: '1',
  64. label: '标准'
  65. }],
  66. tableData: [],
  67. loading: false,
  68. selections: [], // 选中项
  69. page: {
  70. pageSize: 50,
  71. pageSizes: [10, 20, 50, 100],
  72. pageNumber: 1,
  73. total: 0
  74. },
  75. headerStyle: {
  76. backgroundColor: '#e1e4e5',
  77. color: '#2b2b2b',
  78. lineHeight: '30px'
  79. } // 列表样式
  80. };
  81. },
  82. props: {
  83. dialogVisible: Boolean,//是否显示弹窗
  84. params: Object, //模型和设备的信息
  85. newTaskTypes: Array
  86. },
  87. created() {
  88. },
  89. methods: {
  90. getTableData() {
  91. let params = {
  92. Cascade: [
  93. {
  94. Name: "equipCategory",
  95. Projection: ["EquipCode", "EquipName"]
  96. },
  97. {
  98. Name: "component",
  99. Cascade: [{ Name: "equipCategory" }]
  100. },
  101. {
  102. Name: "building",
  103. Projection: ["BuildLocalName", "BuildName", "BuildID"]
  104. },
  105. {
  106. Name: "floor",
  107. Projection: ["FloorLocalName", "FloorName", "FloorID"]
  108. }
  109. ],
  110. Filters: `ProjectId='${this.projectId}'`,
  111. Orders: "CreateTime desc, EquipID asc",
  112. PageNumber: this.page.pageNumber,
  113. PageSize: this.page.pageSize
  114. }
  115. if (this.params.isVerification) {
  116. params.Filters += `;TaskState isNull`
  117. }
  118. if (this.params.device) {
  119. params.Filters += `;Category='${this.params.category}'`
  120. }
  121. if (this.params.spaceList && this.params.spaceList.length) {
  122. //通过平面图区域查询
  123. params.IdList = this.params.spaceList
  124. queryModelDiglog(params, res => {
  125. this.dataFormatter(res)
  126. })
  127. } else {
  128. params.Filters += `;ModelId='${this.params.CurrentModelId}'`
  129. queryEquip(params, res => {
  130. this.dataFormatter(res)
  131. })
  132. }
  133. },
  134. // 表格数据格式化
  135. dataFormatter(res) {
  136. this.tableData = res.Content.map(item => {
  137. if (item.Component && item.Component.length) {
  138. item.ComponentCount = []
  139. item.Component.map(parts => {
  140. if (parts.EquipCategory && parts.EquipCategory.EquipCode && parts.EquipCategory.EquipName) {
  141. let index = item.ComponentCount.findIndex(c => { return c.code == parts.EquipCategory.EquipCode })
  142. if (index != -1) {
  143. item.ComponentCount[index].count++
  144. } else {
  145. item.ComponentCount.push({
  146. name: parts.EquipCategory.EquipName,
  147. code: parts.EquipCategory.EquipCode,
  148. count: 1
  149. })
  150. }
  151. }
  152. })
  153. }
  154. item.FolderName = this.params.modelFolderName
  155. item.FolderId = this.params.modelFolderId
  156. item.FileName = this.params.modelFileName
  157. item.FileId = this.params.CurrentModelId
  158. item.SchemeId = "1"
  159. return item
  160. })
  161. this.page.total = res.Total
  162. },
  163. //选中项修改
  164. handleSelectionChange(val) {
  165. this.selections = val;
  166. },
  167. savaRelation() {
  168. if (this.selections.length) {
  169. let list = this.selections.map((item) => {
  170. return {
  171. EquipId: item.EquipID,
  172. FileId: item.FileId,
  173. FileName: item.FileName,
  174. FolderId: item.FolderId,
  175. FolderName: item.FolderName
  176. }
  177. })
  178. let params = {
  179. Content: list
  180. }
  181. createModelTask(params, res => {
  182. this.$emit('update:dialogVisible', false)
  183. this.$message.success('创建成功!')
  184. this.$router.push({ name: 'buildTask', query: { newTaskTypes: this.newTaskTypes } })//跳转回首页
  185. })
  186. } else {
  187. this.$message('请选择要创建的任务!')
  188. }
  189. },
  190. //改变pagesize
  191. handleSizeChange(pageSize) {
  192. this.page.pageSize = pageSize;
  193. this.getTableData();
  194. },
  195. //改变pageno
  196. handleCurrentChange(pageNo) {
  197. this.page.pageNumber = 1
  198. this.page.pageNumber = pageNo;
  199. this.getTableData();
  200. },
  201. handleClose() {//关闭弹窗
  202. this.$emit('update:dialogVisible', false);
  203. }
  204. },
  205. watch: {
  206. dialogVisible(newData, oldData) {
  207. if (newData) {
  208. this.tableData = []
  209. this.page.pageNumber = 1
  210. this.getTableData()
  211. }
  212. }
  213. },
  214. };
  215. </script>
  216. <style lang="less" scoped>
  217. #addEqDialog {
  218. .filters {
  219. margin-bottom: 10px;
  220. /deep/ .el-input__inner {
  221. vertical-align: baseline;
  222. }
  223. }
  224. .table-box {
  225. height: 370px;
  226. .fr {
  227. margin-top: 10px;
  228. }
  229. }
  230. }
  231. </style>
  232. <style>
  233. .demo-table-expand {
  234. font-size: 0;
  235. }
  236. .demo-table-expand label {
  237. width: 90px;
  238. color: #99a9bf;
  239. }
  240. .demo-table-expand .el-form-item {
  241. margin-right: 0;
  242. margin-bottom: 0;
  243. margin-left: 120px;
  244. width: 100%;
  245. }
  246. </style>