Browse Source

任务页面调试

zhangyu 5 years ago
parent
commit
296d974bdd

+ 269 - 0
src/components/data_admin/buildTask/dialog/modelTaskDialog.vue

@@ -0,0 +1,269 @@
+<template>
+  <el-dialog :title="title" :visible.sync="dialogVisible" :before-close="handleClose" width="900px" id="addEqDialog">
+    <div class="table-box">
+      <el-table :data="tableData" style="width: 100%" height="350" v-loading="loading" :header-cell-style="headerStyle" ref="multipleTable"
+        @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55"></el-table-column>
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <p v-if="props.row.partsList && props.row.partsList.length" style="color:#99a9bf;line-height:32px;font-size:14px;">包含的部件:</p>
+            <el-form label-position="left" inline class="demo-table-expand" v-if="props.row.partsList && props.row.partsList.length">
+              <el-form-item v-for="item in props.row.partsList" :key="item.name" :label="`${item.name}:`">
+                <span>{{ item.number }}</span>
+              </el-form-item>
+            </el-form>
+          </template>
+        </el-table-column>
+        <el-table-column label="所属模型文件夹" width="110" show-overflow-tooltip>
+          <template slot-scope="scope">{{ scope.row.build }}</template>
+        </el-table-column>
+        <el-table-column label="模型文件名" width="100" show-overflow-tooltip>
+          <template slot-scope="scope">{{ scope.row.floor }}</template>
+        </el-table-column>
+        <el-table-column prop="EquipLocalName" label="设备本地名称" show-overflow-tooltip width="100"></el-table-column>
+        <el-table-column prop="EquipLocalId" label="设备本地编码" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="EquipName" label="设备类" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="installation" label="BIM ID" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="type" label="现场验证操作规定" width="150">
+          <template slot-scope="scope">
+            <el-button @click.native.prevent="handleOpenDetail(scope.row, tableData)" type="text" size="small">详情</el-button>
+          </template>
+        </el-table-column>
+        <template slot="empty">
+          <div style="height: 60%;transform: translateY(50%);">
+            <i class="icon-wushuju iconfont"></i>
+            数据暂无
+          </div>
+        </template>
+      </el-table>
+      <!-- 分页 -->
+      <el-pagination class="fr" v-show="tableData && tableData.length" @size-change="handleSizeChange" @current-change="handleCurrentChange"
+        :current-page="page.pageNumber" :page-sizes="page.pageSizes" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
+        :total="page.total"></el-pagination>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button size="small" @click="$emit('update:dialogVisible',false)">返回重选</el-button>
+      <el-button size="small" type="primary" @click="savaRelation">确认创建</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import {  } from "@/api/scan/request";
+import { mapGetters } from "vuex";
+export default {
+  components: {
+    
+  },
+  computed: {
+    ...mapGetters("layout", ["projectId"])
+  },
+  data() {
+    return {
+      title: "确认创建任务",
+      tableData: [{
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1',
+        partsList: [{
+          name: '部件1',
+          number: 6
+        }, {
+          name: '部件2',
+          number: 23
+        }, {
+          name: '部件3',
+          number: 5
+        }, {
+          name: '部件4',
+          number: 9
+        }, {
+          name: '部件5',
+          number: 1
+        }]
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }],
+      loading: false,
+      selections: [], // 选中项
+      page: {
+        pageSize: 50,
+        pageSizes: [10, 20, 50, 100],
+        pageNumber: 1,
+        total: 0
+      },
+      headerStyle: {
+        backgroundColor: '#e1e4e5',
+        color: '#2b2b2b',
+        lineHeight: '30px'
+      } // 列表样式
+    };
+  },
+  props: {
+    dialogVisible: Boolean,//是否显示弹窗
+    params: Object //模型和设备的信息
+  },
+  created() { },
+  methods: {
+    getTableData() {
+      let params = {
+        Cascade: [{ Name: 'equipCategory' }],
+        Orders: "CreateTime desc, EquipID desc",
+        PageNumber: this.page.pageNumber,
+        PageSize: this.page.pageSize,
+      }
+      // unshaftInSys(params, res => {
+        /**将模型文件夹和模型文件名加入到table数据中 */
+        this.tableData = res.Content
+        this.page.total = res.Total
+      // })
+    },
+    //选中项修改
+    handleSelectionChange(val) {
+      this.selections = val;
+    },
+    savaRelation() {
+      if(this.selections.length){
+        let params = {
+          
+        }
+        // linkSySh(params, res => {
+          this.$emit('update:dialogVisible',false)
+          this.$message.success('创建成功!')
+          this.$router.push({name:'buildTask'})//跳转回首页
+        // })
+      }else {
+        this.$message('请选择要创建的设备!')
+      }
+    },
+    //改变pagesize
+    handleSizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+      this.getTableData();
+    },
+    //改变pageno
+    handleCurrentChange(pageNo) {
+      this.page.pageNumber = pageNo;
+      this.getTableData();
+    },
+    handleClose(){//关闭弹窗
+      this.$emit('update:dialogVisible',false);
+    }
+  },
+  watch: {
+    dialogVisible(newData,oldData){
+      if(newData){
+        this.tableData = [{
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1',
+        partsList: [{
+          name: '部件1',
+          number: 6
+        }, {
+          name: '部件2',
+          number: 23
+        }, {
+          name: '部件3',
+          number: 5
+        }, {
+          name: '部件4',
+          number: 9
+        }, {
+          name: '部件5',
+          number: 1
+        }]
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }, {
+        build: 'A栋',
+        floor: '12F',
+        EquipLocalName: 'XXXXXXXXXXX',
+        EquipLocalId: '5484161891',
+        EquipName: '低压开关柜',
+        installation: '王小虎夫妻店',
+        type: '1'
+      }]
+        this.page.pageNumber = 1
+        this.getTableData()
+      }
+    }
+  },
+};
+</script>
+<style lang="less" scoped>
+#addEqDialog {
+  .filters {
+    margin-bottom: 10px;
+    /deep/ .el-input__inner {
+      vertical-align: baseline;
+    }
+  }
+  .table-box {
+    height: 370px;
+    .fr{
+      margin-top: 10px;
+    }
+  }
+}
+</style>
+
+<style>
+  .demo-table-expand {
+    font-size: 0;
+  }
+  .demo-table-expand label {
+    width: 90px;
+    color: #99a9bf;
+  }
+  .demo-table-expand .el-form-item {
+    margin-right: 0;
+    margin-bottom: 0;
+    margin-left: 120px;
+    width: 100%;
+  }
+</style>

+ 130 - 0
src/components/data_admin/buildTask/draw/drawModel.vue

@@ -0,0 +1,130 @@
+<template>
+  <div :id="`drawFloor${id}`" class="drawFloor" v-loading="canvasLoading">
+    <canvas :id="`floorCanvas${id}`" :width="cadWidth" :height="cadHeight" ref="canvas" tabindex="0"></canvas>
+  </div>
+</template>
+
+<script>
+import { SGraphyView } from "@sybotan-web/graphy/lib";
+import { DivideFloorScene } from "cad-engine"
+import { SColor, SPoint } from "@sybotan-web/draw/lib";
+import canvasFun from "@/components/business_space/newGraphy/canvasFun"
+import { floorQuery } from "@/api/scan/request";
+export default {
+  components: {
+    
+  },
+  data() {
+    return {
+      drawMainScene: null,
+      view: null,
+      dataKey: '',
+      cadWidth: 800,
+      cadHeight: 600,
+      canvasLoading: false,
+      modelId: '',
+      FloorID: '',
+      Outline: [],
+    };
+  },
+  props: {
+    id: {
+      default: 0
+    },
+    CurrentModelId: String
+  },
+  created() {},
+  mounted() {
+    this.cadWidth = document.getElementById(`drawFloor${this.id}`).offsetWidth;
+    this.cadHeight = document.getElementById(`drawFloor${this.id}`).offsetHeight;
+  },
+  methods: {
+    initGraphy(ModelId) {
+      this.modelId = ModelId;
+      this.clearGraphy()
+      this.scene = new DivideFloorScene();
+      this.canvasLoading = true;
+      this.scene.getFloorData('/modelapi/base-graph/query', { ModelId: ModelId }).then(res => {
+        let Elements = res.EntityList[0].Elements;
+        let flag = false;
+        for (let key in Elements) {
+          if (Elements[key].length > 0) {
+            flag = true;
+          }
+        }
+        if (flag) {
+          this.view.scene = this.scene
+          this.view.fitSceneToView();
+          this.canvasLoading = false;
+          this.view.maxScale = this.view.scale * 10;
+          this.view.minScale = this.view.scale;
+          this.scene.click(this, this.canvasClick);
+        } else {
+          this.canvasLoading = false;
+        }
+      })
+    },
+    getFloorData() {
+      let pa = {
+        Filters: `FloorID='${this.FloorID}'`
+      }
+      floorQuery(pa, res => {
+        let newArr = res.Content[0].Outline.map(t => {
+          return new SPoint(t.X, t.Y);
+        })
+        this.drawMainScene.addSceneMark(newArr)
+      })
+    },
+    getSelectedSpaces(){//获取选中区域
+      if(this.view && this.view.scene){
+        let list =  this.view.scene.getSelectedSpaces();
+        if(list.length){
+          return list
+        } else {
+          this.$message('请选择模型空间')
+          return []
+        }
+      } else {
+        this.$message('请选择模型空间')
+        return []
+      }
+    },
+    // 清空平面图
+    clearGraphy() {
+      if (this.view) {
+        this.view.scene = null;
+        return
+      }
+      let id = `floorCanvas${this.id}`;
+      this.view = new SGraphyView(id)
+    },
+    canvasClick(item,eventObj){//点击平面图事件
+      
+    }
+  },
+  watch: {
+    CurrentModelId: {
+      handler(newName, oldName){
+        if(newName){
+          this.initGraphy(newName)
+        }
+      },
+      immediate: true,
+    }
+  }
+};
+</script>
+<style scoped lang="less">
+.drawFloor {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  .operate {
+    position: absolute;
+    left: 50%;
+    bottom: 20px;
+    transform: translateX(-50%);
+    z-index: 99;
+  }
+}
+</style>

+ 1 - 2
src/components/data_admin/buildTask/table/modelTable.vue

@@ -96,8 +96,7 @@ export default {
         Filters: `ProjectId='${this.projectId}'`,
         Cascade: [
           {
-            Name: 'equipment',
-            Cascade: [{ Name: 'component' }]
+            Name: 'component'
           }, {
             Name: 'equipCategory'
           }

+ 83 - 0
src/components/ready/buildfloor/modelFolder.vue

@@ -0,0 +1,83 @@
+<template>
+  <div id="modelFile">
+    <span class="modelFile" style="margin-right: 12px;">模型文件夹</span>
+    <el-select v-model="casVal" filterable clearable placeholder="请选择模型文件夹" style="width:160px;" @change="handleChange">
+      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
+    </el-select>
+  </div>
+</template>
+<script>
+import tools from "@/utils/scan/tools"
+import request from "@/api/model/file.js";
+import { mapGetters, mapActions } from "vuex"
+
+export default {
+  computed: {
+    ...mapGetters("layout", ["projectId", "secret", "userId"])
+  },
+  data() {
+    return {
+      casVal: '',
+      options: []
+    };
+  },
+  created() {
+    this.init()
+  },
+  watch: {
+    projectId() {
+      this.casVal = ''
+      this.options = []
+      this.init()
+    }
+  },
+  methods: {
+    //设置默认选项
+    setValue(val) {
+      if (val && val.length) {
+        this.casVal = val
+      }
+    },
+    //获取数据
+    init() {
+      this.getDirectory()
+    },
+    // 获取文件夹
+    getDirectory() {
+      request.queryModel("", res => {
+        this.options = res.Content.map(t => {
+          return {
+            value: t.Id,
+            label: t.Name
+          }
+        })
+      });
+    },
+    //改变item
+    handleChange(value) {
+      this.options.map(item =>{
+        if (item.value == value) {
+          value = item
+        }
+      })
+      value = value?value:{value:''}
+      this.$emit("change", value)
+    }
+  }
+};
+</script>
+<style lang="less">
+.el-cascader .el-input .el-input__inner {
+  vertical-align: bottom;
+}
+</style>
+<style lang="less" scoped>
+#modelFile {
+  margin-left: 10px;
+  float: left;
+  .modelFile {
+    color: #999999;
+    font-size: 14px;
+  }
+}
+</style>

+ 5 - 5
src/views/data_admin/buildTask/addTask/addDeviceTask.vue

@@ -36,11 +36,11 @@
             </template>
           </el-table-column>
           <template slot="empty">
-          <div style="height: 60%;transform: translateY(50%);">
-            <i class="icon-wushuju iconfont"></i>
-            数据暂无
-          </div>
-        </template>
+            <div style="height: 60%;transform: translateY(50%);">
+              <i class="icon-wushuju iconfont"></i>
+              数据暂无
+            </div>
+          </template>
         </el-table>
       </div>
       <div class=footer>

+ 192 - 0
src/views/data_admin/buildTask/addTask/addModelTask.vue

@@ -0,0 +1,192 @@
+<template>
+  <div id="bd-fl-manage">
+    <div class="header-nav">
+      <el-button style="float:left;margin-right:20px;" size="small" type="default" icon="el-icon-back" @click="goBack"></el-button>
+      <model-folder ref="modelFolder" @change="handleChangeModelFolder" style="margin-right:10px;"></model-folder>
+      <my-cascader :isWidth="false" ref="cascader" @change="changeDevice"></my-cascader>
+      <el-button style="float:right;margin-top:1px;" @click="handleClickCreate">创建所选</el-button>
+    </div>
+    <el-row>
+      <div class="l-list">
+        <h4>模型文件</h4>
+        <div class="model-file-list">
+          <el-scrollbar style="height:100%;">
+            <div v-for="item in modelFileList" :key="item.Id" :class="{'model-file-item':true,'active':item.active}" @click="handleChangeModelFile(item)">
+              <span>{{item.FloorName}}</span>
+            </div>
+          </el-scrollbar>
+        </div>
+      </div>
+      <div class="r-model">
+        <draw-model ref="drawModel" :id="1" :CurrentModelId="CurrentModelId"></draw-model>
+      </div>
+    </el-row>
+    <modelTask-dialog :dialogVisible.sync="dialogVisible" :params="params"></modelTask-dialog>
+  </div>
+</template>
+
+<script>
+import modelFolder from "@/components/ready/buildfloor/modelFolder"
+import myCascader from "@/components/ledger/lib/cascader"
+import drawModel from "@/components/data_admin/buildTask/draw/drawModel"
+import modelTaskDialog from "@/components/data_admin/buildTask/dialog/modelTaskDialog"
+import { mapGetters, mapActions } from "vuex";
+import request from "@/api/model/file.js";
+import {} from "@/api/scan/request";
+export default {
+  components: {
+    modelFolder,
+    myCascader,
+    drawModel,
+    modelTaskDialog
+  },
+  data() {
+    return {
+      dialogVisible: false,//是否显示弹窗
+      modelFolderName: '',//模型文件夹名字
+      modelFileName: '',//模型文件名字
+      modelFileList: [],
+      CurrentModelId: '',
+      device: '',//设备类别
+      spaceList: []//选中的空间
+    };
+  },
+  computed: {
+    ...mapGetters("layout", ["projectId"]),
+    params(){
+      return {
+        device: this.device,
+        modelFolderName: this.modelFolderName,
+        modelFileName: this.modelFileName,
+        spaceList: this.spaceList
+      }
+    }
+  },
+  mounted() { },
+  created() {
+    
+  },
+  methods: {
+    goBack(){//返回
+      this.$router.push({name:'buildTask'})
+    },
+    handleChangeModelFolder(item){//切换模型文件夹
+      let val = item.value
+      if(val){
+        this.modelFolderName = item.label
+        let data = {
+          FolderId: val,
+          ProjectId: this.projectId
+        };
+        request.queryFloorList(data, res => {
+          this.modelFileList = res.Content.map(item => {
+            item.active = false
+            return item
+          })
+          if (this.modelFileList.length) {
+            this.handleChangeModelFile(this.modelFileList[0]);
+          }
+        })
+      } else {
+        this.resetSelected()
+      }
+    },
+    resetSelected(){
+      this.modelFileList = []
+      this.CurrentModelId = ''
+      this.modelFolderName = ''
+      this.spaceList = []
+      this.$refs.drawModel.clearGraphy()
+    },
+    handleChangeModelFile(file){//切换模型文件
+      this.modelFileList.map(item => {
+        file.Id == item.Id?item.active = true:item.active = false
+        return item
+      })
+      this.CurrentModelId = file.CurrentModelId
+      this.modelFileName = file.FloorName
+    },
+    changeDevice(val){//切换设备类别
+      this.device = val.code
+    },
+    handleClickCreate(){//创建已选
+      this.spaceList = this.$refs.drawModel.getSelectedSpaces().map(item => {
+        return item.data.SourceId
+      })
+      this.dialogVisible = true
+    }
+  },
+  watch: {
+    projectId() {
+      this.resetSelected()
+    }
+  }
+};
+</script>
+<style lang="less" scoped>
+#bd-fl-manage {
+  overflow: hidden;
+  height: 100%;
+  position: relative;
+  .header-nav{
+    height: 32px;
+    padding-bottom: 10px;
+  }
+  .el-row {
+    height: calc(100% - 50px);
+    & > div {
+      float: left;
+      height: 100%;
+      overflow: hidden;
+      background-color: #fff;
+      box-sizing: border-box;
+      border: 1px solid #dfe6ec;
+      .action-box {
+        padding: 10px;
+        .el-button--small {
+          padding: 10px 11px;
+        }
+      }
+    }
+    .l-list {
+      width: 250px;
+      height: 100%;
+      border-right: 0;
+      h4 {
+        padding-left: 10px;
+        border-top: 1px solid #d9d9d9;
+        border-bottom: 1px solid #dfe6ec;
+        background: #d9d9d9;
+        color: #333;
+        line-height: 44px;
+      }
+      .model-file-list {
+        height: calc(100% - 46px);
+        line-height: 48px;
+        /deep/.el-scrollbar__wrap {
+          overflow-x: hidden;
+        }
+        .model-file-item {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          cursor: pointer;
+          span {
+            margin-left: 10px;
+          }
+        }
+        .model-file-item.active,
+        .model-file-item:hover {
+          background-color: #f5f7fa;
+          color: #000;
+        }
+      }
+    }
+    .r-model {
+      width: calc(100% - 250px);
+      box-sizing: border-box;
+      padding: 10px;
+    }
+  }
+}
+</style>