فهرست منبع

Merge branch 'develop' of http://39.106.8.246:3003/web/wanda-editer into develop

zhangyu 4 سال پیش
والد
کامیت
11e29c1c48
7فایلهای تغییر یافته به همراه641 افزوده شده و 538 حذف شده
  1. 407 414
      package-lock.json
  2. 4 4
      package.json
  3. 16 1
      src/api/editer.js
  4. 28 9
      src/components/baseEditer.vue
  5. 1 1
      src/components/edit/left_toolbar.vue
  6. 10 4
      src/lib/items/SZoneLegendItem.ts
  7. 175 105
      src/views/drafts.vue

تفاوت فایلی نمایش داده نمی شود زیرا این فایل بسیار بزرگ است
+ 407 - 414
package-lock.json


+ 4 - 4
package.json

@@ -8,11 +8,11 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@saga-web/base": "2.1.20",
-    "@saga-web/big": "1.0.43",
-    "@saga-web/draw": "2.1.96",
+    "@saga-web/base": "2.1.21",
+    "@saga-web/big": "1.0.44",
+    "@saga-web/draw": "2.1.97",
     "@saga-web/feng-map": "1.0.11",
-    "@saga-web/graph": "2.1.86",
+    "@saga-web/graph": "2.1.87",
     "@saga-web/topology": "1.0.84",
     "ant-design-vue": "^1.6.0",
     "core-js": "^3.6.4",

+ 16 - 1
src/api/editer.js

@@ -63,10 +63,25 @@ export function queryWzfldl(data,params){
 
 // 查询图例统计信息
 export function queryStatistic(data,params){
-    return httputils.postJson(`${testApi}/graphElement/statistic/query`, params)
+    return httputils.fetchJson(`${testApi}/graphElement/statistic/query`,data, params)
 }
 
 // 草稿箱专业楼层结构查询
 export function queryDraftGroup(data,params){
     return httputils.getJson(`${testApi}/graph/draftGroup`,data, params)
+}
+
+//查询当前分类下的typeid(提取)
+export function queryTypeGraph(params){
+    return httputils.getJson(`${testApi}/graphCategory/getInfoTypeId`, params)
+}
+
+//根据id删除图形信息
+export function deleteGraph(params){
+    return httputils.postJson(`${testApi}/graph/delete`, params)
+}
+
+// 发布系统图
+export function publishGraph(params){
+    return httputils.getJson(`${testApi}/graph/publish`, params)
 }

+ 28 - 9
src/components/baseEditer.vue

@@ -12,10 +12,11 @@ import { SFloorParser } from "@saga-web/big";
 import { FloorView } from "./../lib/FloorView";
 import { EditScence } from "./mapClass/EditScence";
 import bus from "@/bus";
-import { saveGroup, readGroup } from "@/api/editer.js";
+import { saveGroup, readGroup, queryTypeGraph } from "@/api/editer.js";
 import { STopologyParser } from "./../lib/parsers/STopologyParser";
 import { uuid } from "@/components/mapClass/until";
 import { SImageItem } from "@saga-web/graph/lib";
+import { SPainter, SColor, SFont, SPoint } from "@saga-web/draw";
 import store from "../store";
 
 let fengmap = null;
@@ -45,7 +46,8 @@ export default {
       view: null,
       floorList: {},
       urlMsg: {},
-      chiceItemList: [] //选中itemlist
+      chiceItemList: [], //选中itemlist
+      hasTypeList: [], // 当前类型下包含的typeid(提取)
     };
   },
   mounted() {
@@ -123,7 +125,8 @@ export default {
           bus.$emit("elementDataChange", this.scene);
         }
       });
-
+      // 获取typeid
+      this.getTypeId()
       this.scene.emitChange = this.emitChange;
     },
     parserData(floor) {
@@ -219,11 +222,14 @@ export default {
       });
       bus.$on("extractItem", () => {
         const map = {};
+        console.log(this.hasTypeList)
         this.fParser.spaceList.forEach(t => {
-          if (map[t.data.Type]) {
-            map[t.data.Type]++;
-          } else {
-            map[t.data.Type] = 1;
+          if (this.hasTypeList.indexOf(t.data.Type) > -1) {
+            if (map[t.data.Type]) {
+              map[t.data.Type]++;
+            } else {
+              map[t.data.Type] = 1;
+            }
           }
         });
         const data = [];
@@ -264,11 +270,15 @@ export default {
                 AttachObjectIds: [],
                 Pos: { x: t.x, y: t.y },
                 OutLine: t.pointArr[0],
+                SubType: '',
                 Properties: {
                   strokeColor: "#3d73c0",
-                  fillColor: "#eda986"
+                  fillColor: "#eda986",
+                  font: 0,
+                  color: '',
+                  TextPos: { X: 0, Y: 0 }
                 },
-                Num: 123
+                Num: 1
               };
             }
           })
@@ -334,6 +344,15 @@ export default {
         FloorID: this.urlMsg.FloorID // 楼层id
       };
       return readGroup(data);
+    },
+    // 获取typeid
+    getTypeId() {
+      const data = {
+        categoryId: this.urlMsg.categoryId
+      };
+      queryTypeGraph(data).then(res => {
+        this.hasTypeList = res.Data.map(t => Number(t));
+      })
     }
   },
   watch: {

+ 1 - 1
src/components/edit/left_toolbar.vue

@@ -321,7 +321,7 @@ export default {
       // 打开提取元素列表
       this.isExtract = true;
       this.visible = !this.visible;
-      bus.$emit("extr actItem");
+      bus.$emit("extractItem");
     },
     getBus() {
       bus.$on("exportItem", data => {

+ 10 - 4
src/lib/items/SZoneLegendItem.ts

@@ -103,10 +103,16 @@ export class SZoneLegendItem extends SPolygonItem {
             this.setPointList = [];
             let setPointList: SPoint[];
             if (data.OutLine) {
-                setPointList = data.OutLine.map(i => {
-                    return (new SPoint(i.X, i.Y))
-                })
-                this.setPointList = setPointList;
+                console.log(data.OutLine[0] instanceof SPoint)
+                if (data.OutLine[0] instanceof SPoint) {
+                    // @ts-ignore
+                    this.setPointList = data.OutLine;
+                } else {
+                    setPointList = data.OutLine.map(i => {
+                        return (new SPoint(i.X, i.Y))
+                    })
+                    this.setPointList = setPointList;
+                }
             }
             // 设置线宽
             if (data.Properties.LineWidth) {

+ 175 - 105
src/views/drafts.vue

@@ -1,54 +1,61 @@
 <template>
-  <div id="drafts">
-    <div class="tit">草稿箱</div>
-    <div class="conent">
-      <div class="left-nav">
-        <!--        <Tree :data="treeData" @change="change"></Tree>-->
-        <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
-      </div>
-      <div class="conent-right">
-        <div class="conent-tit">
-          <div class="tit-left">消防系统-4F</div>
-          <div class="tit-right">
-            <a-button>删除</a-button>
-            <a-button>发布</a-button>
-            <a-button type="primary">编辑</a-button>
-          </div>
+  <a-spin :spinning="spinning">
+    <div id="drafts">
+      <div class="tit">草稿箱</div>
+      <div class="conent">
+        <div class="left-nav">
+          <!--        <Tree :data="treeData" @change="change"></Tree>-->
+          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
         </div>
-        <div class="concent-bottom">
-          <div class="map">
-            <div class="legend-btn" @click="legend = !legend">
+        <div class="conent-right">
+          <div class="conent-tit">
+            <div class="tit-left" v-if="floorName">{{systemName}}-{{floorName}}</div>
+            <div class="tit-right">
+              <a-button @click="deleteBtn" :disabled="!floorName">删除</a-button>
+              <a-button @click="publishBtn" :disabled="!floorName">发布</a-button>
+              <a-button type="primary" @click="goToEditer" :disabled="!floorName">编辑</a-button>
+            </div>
+          </div>
+          <div class="concent-bottom">
+            <div class="map">
+              <div class="canvas-container" ref="draftsCanvas">
+                <div id="fengMap"></div>
+                <canvas
+                        id="canvas"
+                        :width="canvasWidth"
+                        :height="canvasHeight"
+                        ref="canvas"
+                        tabindex="0"
+                ></canvas>
+              </div>
+            </div>
+            <div v-show="!legend" class="legend-btn" @click="legend = !legend">
+              <a-icon type="right" style="color: #8D9399;font-size: 10px" />
+            </div>
+            <div  v-show="legend" class="legend-btn legend-btn-close" @click="legend = !legend">
               <a-icon type="right" style="color: #8D9399;font-size: 10px" />
             </div>
-            <div class="canvas-container">
-              <div id="fengMap"></div>
-              <canvas
-                id="canvas"
-                :width="canvasWidth"
-                :height="canvasHeight"
-                ref="canvas"
-                tabindex="0"
-              ></canvas>
+            <div class="legend" v-if="legend">
+              <div
+                      style="font-size:14px;color: #1F2429;padding-left: 12px;height: 40px;line-height: 40px"
+              >可能需要补充的图例</div>
+              <a-table   v-loading='legendLoading' :columns="columns"  :rowKey="(record,index)=>{return index}" :data-source="legendData" size="middle" :pagination="false">
+                <div slot="Url" slot-scope='text,record'>
+                  <img  v-if="record.Url" style=" width: 20px;height: 22px;"
+                        :src="'/serve/topology-wanda/Picture/query/'+ record.Url"
+                        alt
+                  />
+                  <span v-else>---</span>
+                </div>
+                <span></span>
+              </a-table>
             </div>
           </div>
-          <div class="legend" v-if="legend">
-            <div
-              style="font-size:14px;color: #1F2429;padding-left: 12px;height: 40px;line-height: 40px"
-            >可能需要补充的图例</div>
-            <a-table :columns="columns" :data-source="data" size="middle" :pagination="false">
-              <img
-                style="width:10px;heigth:10px"
-                slot="img"
-                slot-scope="text, record"
-                :src="require('@/assets/images/'+record.img+'.png')"
-              />
-              <template v-slot:state></template>
-            </a-table>
-          </div>
         </div>
       </div>
     </div>
-  </div>
+  </a-spin>
+
 </template>
 <script>
 import Tree from "./../components/Tree/Tree.vue";
@@ -61,7 +68,9 @@ import {
   saveGroup,
   readGroup,
   queryDraftGroup,
-  queryStatistic
+  queryStatistic,
+  deleteGraph,
+  publishGraph
 } from "@/api/editer.js";
 import { STopologyParser } from "./../lib/parsers/STopologyParser";
 import { uuid } from "@/components/mapClass/until";
@@ -76,33 +85,17 @@ export default {
       columns: [
         {
           title: "名称", // 列的名称
-          dataIndex: "name", // 列的标识
-          scopedSlots: { customRender: "name" }
+          dataIndex: "Name", // 列的标识
+          scopedSlots: { customRender: "Name" }
         },
         {
           title: "图例", // 列的名称
-          dataIndex: "img", // 列的标识
-          scopedSlots: { customRender: "img" }
+          dataIndex: "Url", // 列的标识
+          scopedSlots: { customRender: "Url" }
         }
       ],
-      data: [
-        {
-          key: "1",
-          name: "客梯",
-          img: "shubiao"
-        },
-        {
-          key: "2",
-          name: "防火分区",
-          img: "shubiao"
-        },
-        {
-          key: "3",
-          name: "消防泵室",
-          img: "shubiao"
-        }
-      ],
-      legend: false,
+      legendData: [],
+      legend: true,
       canvasWidth: 700,
       canvasHeight: 600,
       view: null,
@@ -112,38 +105,48 @@ export default {
       key: "23f30a832a862c58637a4aadbf50a566",
       appName: "万达可视化系统",
       defaultProps: {
-        children: 'Category',
-        label: 'Gcode'
+        children: "Category",
+        label: "Gcode"
       },
-      graphId:'',
+      projectId: "", //项目id
+      fmapID: "", //蜂鸟地图id
+      graphId:'124aeab6fbb346cd92057525a30aee18',
+      legendLoading:false,
+      spinning:false,//全局加载
+      systemName:'',
+      floorName:''
     };
   },
   methods: {
-    handleNodeClick(data) {
-      console.log(data);
-      this.graphId = '124aeab6fbb346cd92057525a30aee18';
-      this.getLegend();
+    handleNodeClick(data,node) {
+      console.log(data,1111111,node);
+      this.legendData = [];
+      this.systemName='';
+      this.floorName='';
+      if(data.Gname){
+        this.systemName = node.parent.data.Gcode;
+        this.floorName = data.Gcode;
+        this.getLegend();
+      }
     },
     init() {
-      console.log(this.urlMsg);
       // const loadings = this.$loading({type: 'global'});
       document.getElementById(`canvas`).focus();
       this.clearGraphy();
       this.scene = new EditScence();
       fengmap = new SFengParser(
         "fengMap",
-        this.mapServerURL + "/fmap/" + this.urlMsg.fmapID,
+        this.mapServerURL + "/fmap/" + this.fmapID,
         this.key,
         this.appName,
         null
       );
-      console.log(this.urlMsg.fmapID);
-      const floorid = this.urlMsg.FloorID;
-      fengmap.loadMap(this.urlMsg.fmapID, resp => {
+      const floorid = "f1";
+      fengmap.loadMap(this.fmapID, resp => {
         this.floorList = resp;
         fengmap
           .loadTheme(
-            `${this.mapServerURL}/webtheme/${this.urlMsg.fmapID}/${this.urlMsg.fmapID}.theme`
+            `${this.mapServerURL}/webtheme/${this.fmapID}/${this.fmapID}.theme`
           )
           .then(response => {
             console.log("获取rf成功", response);
@@ -166,7 +169,7 @@ export default {
         if (fengmap.frImg) {
           const imgItem = new SImageItem(
             null,
-            `${this.mapServerURL}/webtheme/${this.urlMsg.fmapID}/${fengmap.frImg}`
+            `${this.mapServerURL}/webtheme/${this.fmapID}/${fengmap.frImg}`
           );
           this.scene.addItem(imgItem);
           this.view.scene = this.scene;
@@ -203,31 +206,88 @@ export default {
         }
       }
     },
-    getTreeData() {
-      queryDraftGroup({ projectId: this.projectId }).then(res => {
+    getTreeData(){
+      queryDraftGroup({projectId:this.projectId}).then(res=>{
         console.log(res);
-        if(res.Result =='success'){
+        if (res.Result == "success") {
           this.treeData = res.Data;
         }else{
           this.treeData=[];
-          this.$message.err('获取楼层结构失败');
+          this.$message.error('获取楼层结构失败');
         }
-      })
+      });
     },
+    //获取补充图例
     getLegend(){
-      const data = {
-        projectId:'1000423',
+      this.legendLoading = true;
+      this.legendData = [];
+      queryStatistic({
+        projectId:this.projectId,
         flag:true,
         graphId:this.graphId,
-      }
-      queryStatistic(data).then(res=>{
+      }).then(res=>{
+        console.log(res);
+        this.legendLoading = false;
+        if(res.data.Result =='success'){
+          const data = res.data.Data;
+          data.map(item=>{
+            if(item.RealNum ==0){
+              this.legendData.push(item);
+            }
+          })
+        }else{
+          this.legendData=[];
+          this.$message.error('获取楼层结构补充图例失败');
+        }
+      })
+    },
+    //删除
+    deleteBtn(){
+      this.spinning = true;
+      deleteGraph([{Id:[this.graphId]}]).then(res =>{
+        console.log(res);
+        this.spinning = false;
+        if(res.Result =='success'){
+          this.$message.success(res.Message)
+        }else{
+          this.$message.error(res.Message)
 
+        }
       })
-    }
+    },
+    //发布
+    publishBtn(){
+      this.spinning = true;
+      publishGraph({graphId :this.graphId ,pubUser:''}).then(res=>{
+        this.spinning = false;
+        if(res.Result =='success'){
+          this.$message.success(res.Message)
+        }else{
+          this.$message.error(res.Message)
+
+        }
+      })
+    },
+    /**
+     * @name goToEditer
+     * @description t跳转editer编辑器
+     */
+    goToEditer() {
+      console.log(this.$cookie);
+      let FloorID = this.$cookie.get('floorMapId') || 'f1'
+      let categoryId = this.$cookie.get('categoryId')
+      const { conf } = window.__systemConf,
+              { editerUrl } = conf
+      let data = `categoryId=${categoryId}&projectId=${this.plazaId}&BuildingID=1&FloorID=${FloorID}&fmapID=${this.fmapID}`
+      let url = editerUrl + 'editer?' + encodeURIComponent(data)
+      window.open(url, true)
+    },
+
+
   },
   mounted() {
-    // // this.canvasWidth = this.$refs.graphy.offsetWidth;
-    // // this.canvasHeight = this.$refs.graphy.offsetHeight - 10;
+    this.canvasWidth = this.$refs.draftsCanvas.offsetWidth - 10;
+    this.canvasHeight = this.$refs.draftsCanvas.offsetHeight - 10;
 
     const href = window.location.href;
     let params = href.split("?")[1];
@@ -242,8 +302,9 @@ export default {
       const arr = item.split("=");
       obj[arr[0]] = arr[1];
     });
-    console.log('obj',obj)
-    this.projectId = obj.projectId ?obj.projectId : '1000423';
+    console.log("obj", obj);
+    this.projectId = obj.projectId ? obj.projectId : "1000423";
+    this.fmapID = obj.fmapID ? obj.fmapID : "1000423_120";
     this.init();
     this.getTreeData();
   }
@@ -309,34 +370,43 @@ export default {
           width: 246px;
           display: flex;
           justify-content: space-between;
+          margin-left: auto;
         }
       }
       .concent-bottom {
         height: calc(100% - 61px);
         display: flex;
+        position: relative;
         .map {
           flex: 1;
           position: relative;
           height: 100%;
           /*height: calc(100% - 61px);*/
           /*background: red;*/
-          .legend-btn {
-            position: absolute;
-            right: 0;
-            top: 9px;
-            width: 10px;
-            height: 24px;
-            background: rgba(228, 229, 231, 1);
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            cursor: pointer;
-          }
         }
         .legend {
+          position: absolute;
+          right: 0;
+          top: 0;
           width: 200px;
           border-left: 1px solid #eff0f1;
           height: 100%;
+          overflow-y: scroll;
+        }
+        .legend-btn {
+          position: absolute;
+          right: 0px;
+          top: 9px;
+          width: 10px;
+          height: 24px;
+          background: rgba(228, 229, 231, 1);
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          cursor: pointer;
+        }
+        .legend-btn-close {
+          right: 200px;
         }
       }
     }