Bläddra i källkod

详情新开页及路由配置。
-组件开发-(基本信息,图片)

shaun-sheep 5 år sedan
förälder
incheckning
557b462200

+ 13 - 0
src/components/ledger/details/detail/exhibitionBaseInformation.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+    export default {
+        name: "exhibition-baseInformation"
+    }
+</script>
+
+<style scoped>
+
+</style>

+ 13 - 0
src/components/ledger/details/detail/exhibitionFile.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+    export default {
+        name: "exhibition-file"
+    }
+</script>
+
+<style scoped>
+
+</style>

+ 55 - 0
src/components/ledger/details/detail/exhibitionImage.vue

@@ -0,0 +1,55 @@
+<template>
+  <div class="exhibition-image">
+    <p class="title">
+      <span class=" el-icon-picture"></span>
+      {{exhibitionImage.title}}</p>
+    <div class="image">
+      <el-image
+        :preview-src-list="srcList"
+        :src="item"
+        style="width: 20rem;height: 15rem;"
+        v-for="item in url">
+      </el-image>
+    </div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "exhibition-image",
+    props: ['exhibitionImage'],
+    data() {
+      return {
+        url: [
+          'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+          'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
+          'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
+        ],
+        srcList: [
+          'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+          'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
+          'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
+        ]
+      }
+    }
+  }
+</script>
+
+<style lang="less" scoped>
+  .exhibition-image {
+    .title {
+      border-bottom: 1px solid #eee;
+      padding: 10px 0;
+      font-weight: 600;
+      text-indent: 10px;
+    }
+
+    .image {
+      margin: 10px;
+      text-align: center;
+    }
+
+  }
+
+</style>

+ 33 - 0
src/components/ledger/details/detail/selectRadio.vue

@@ -0,0 +1,33 @@
+<template>
+  <div class="select-radio">
+    <p class="title">{{selectRadio.information}}</p>
+    <template v-for="item in selectRadio.radioList">
+      <el-radio v-model="radio" :label="item.label">{{item.value}}</el-radio>
+    </template>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "selectRadio",
+    props: ['selectRadio'],
+    data() {
+      return {
+        radio: '1'
+      };
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .select-radio {
+    .title {
+      border-left: 8px solid black;
+      margin: 10px 40px 10px 0;
+      font-weight: 600;
+      text-indent: 10px;
+      display: inline-block;
+
+    }
+  }
+</style>

+ 140 - 0
src/components/ledger/details/tableDisplay.vue

@@ -0,0 +1,140 @@
+<template>
+  <div class="tableDisplay">
+    <el-row :gutter="24">
+      <el-col :span="18">
+        <!--设备信息点-->
+        <div class="grid-content bgc-white">
+          <selectRadio :selectRadio="selectRadio"/>
+          <el-row>
+            <!-- :span的值可以根据条件改变 是一个24 or 两个 16:8-->
+            <el-col :span="16">
+              <exhibitionBaseInformation/>
+            </el-col>
+            <el-col :span="8">
+              <!--能耗信息点-->
+            </el-col>
+          </el-row>
+
+        </div>
+      </el-col>
+      <el-col :span="6">
+        <div class="grid-content bgc-white">
+          <exhibitionImage :exhibitionImage="exhibitionImage"/>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+  import exhibitionBaseInformation from "./detail/exhibitionBaseInformation";
+  import exhibitionFile from "./detail/exhibitionFile";
+  import exhibitionImage from "./detail/exhibitionImage";
+  import selectRadio from "./detail/selectRadio";
+
+  export default {
+    name: "tableDisplay",
+    components: {exhibitionBaseInformation, exhibitionFile, exhibitionImage, selectRadio},
+    data() {
+      return {
+        selectRadio: {
+          information: '设备信息点',
+          radioList: [
+            {
+              value: '显示需采集信息点',
+              label: '1'
+            },
+            {
+              value: '显示需采集信息点',
+              label: '2'
+            },
+            {
+              value: '显示需采集信息点',
+              label: '3'
+            }
+          ]
+        },
+        exhibitionBaseInformation: {
+          //产品说所有信息的key和value是动态生成的
+          base: {
+            baseInformation: '基本信息',
+            list: [
+              {
+                text: '设备本地编码:',
+                val: '123--22:'
+              },
+              {
+                text: '设备二维码图片:',
+                val: '2:'
+              },
+            ]
+          },
+          manufacture: {
+            manufacturerParameter: '台账参数 / 设备厂家',
+          },
+          supplier: {
+            supplierParameters: '台账参数 / 供应购买'
+          }
+        },
+        exhibitionFile: {},
+        exhibitionImage: {
+          title:'图片'
+        }
+      }
+    },
+    created() {
+      this.$store.dispatch('setBreadcrumb', [{
+        label: '台账管理',
+        path: '/relation/data'
+      }, {
+        label: ' 资产台账 ',
+        path: '/relation/data'
+      }, {
+        label: '资产详情'
+      }])
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .tableDisplay {
+    .bgc-white {
+      background: #fff;
+    }
+
+    .el-row {
+      margin-bottom: 20px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    .el-col {
+      border-radius: 4px;
+    }
+
+    .bg-purple-dark {
+      background: #99a9bf;
+    }
+
+    .bg-purple {
+      background: #d3dce6;
+    }
+
+    .bg-purple-light {
+      background: #e5e9f2;
+    }
+
+    .grid-content {
+      border-radius: 4px;
+      min-height: 36px;
+    }
+
+    .row-bg {
+      padding: 10px 0;
+      background-color: #f9fafc;
+    }
+  }
+
+</style>

+ 4 - 1
src/components/ledger/handsontables/device.vue

@@ -941,7 +941,10 @@
                 //操作
                 case 'caozuo':
                     // window.open(`http://adm.sagacloud.cn:8058/spread?id=${infos.EquipID}&pid=${this.projectId}&secret=${this.secret}`,"_blank")
-                    this.$message("开发中...")
+                    // this.$message("开发中...")
+                  this.$router.push({
+                    path: "tableDisplay",
+                  })
                     return false
                 //设备二维码图片
                 case 'EquipQRCode':

+ 56 - 54
src/router/system.js

@@ -1,30 +1,20 @@
 import LayoutMain from '@/framework/layout/Main'
 import MsgAllDetails from "@/framework/components/messagesever/msgAllDetails"
-
-import Login from '@/framework/layout/Login'
 import Dasboard from '@/views/dasboard'
-
-import UserList from '@/views/system/user/UserList'
-import RoleList from '@/views/system/role/RoleList'
-import ChangePwd from '@/views/system/pwd/ChangePwd'
-
 /**项目管理 */
 import projectAdm from '@/views/platfrom/project'
 import userAdm from '@/views/platfrom/user'
 import roleAdm from '@/views/platfrom/role'
-
 /**前期准备 */
 import buildFloor from '@/views/ready/buildfloor'
 import collectsetting from '@/views/ready/collectsetting'
 import buildUser from '@/views/ready/appuser'
 import repetitionGraphy from '@/views/ready/buildfloor/repetitionGraphy'
-
 /**模型管理 */
 import modelFile from '@/views/model/file'
 import modelReport from '@/views/model/report'
 import deleted from '@/views/model/report/deleted'
 import supplement from '@/views/model/report/supplement'
-
 /**系统集成 */
 import pointConfig from '@/views/point/config_point'
 import editDataSouce from '@/views/point/config_point/edit_origin'
@@ -40,7 +30,6 @@ import buildRela from '@/views/point/dynamicdata/addRelation/buildRela'
 import floorRela from '@/views/point/dynamicdata/addRelation/floorRela'
 import tenantRela from '@/views/point/dynamicdata/addRelation/tenantRela'
 import projectRela from '@/views/point/dynamicdata/addRelation/projectRela'
-
 /** 扫楼作业 */
 import buildTask from '@/views/data_admin/buildTask'
 import addDeviceTask from '@/views/data_admin/buildTask/addTask/addDeviceTask'
@@ -52,12 +41,12 @@ import buildData from '@/views/data_admin/buildData'
 import buildGraphy from '@/views/data_admin/buildGraphy'
 import updatePointZone from '@/views/data_admin/buildGraphy/updatePointZone'
 import createPointZone from '@/views/data_admin/buildGraphy/createPointZone'
-
 /**  台账管理 */
 import systemLedger from '@/views/ledger/system'
 import systemadd from '@/views/ledger/system/addsystem'
 import systemDetail from '@/views/ledger/system/systemDetail'
 import facilityLedger from '@/views/ledger/facility'
+import tableDisplay from "../components/ledger/details/tableDisplay";
 import partsLedger from '@/views/ledger/facility/parts'
 import partsmanageLedger from '@/views/ledger/facility/partsmanage'
 import partsadd from '@/views/ledger/facility/partsmanage/addparts'
@@ -78,7 +67,6 @@ import auth from '@/views/system/auth'
 import noUser from '@/views/system/nouser'
 import spaceDetail from '@/views/ledger/spacelist/spaceDetail'
 import relatedSpace from '@/views/ledger/cenotelist/relatedSpace'
-
 /**  关系维护并计算 */
 import maintain from '@/views/relation/maintain'
 import overView from '@/views/relation/overview'
@@ -86,16 +74,12 @@ import relationShip from '@/views/relation/relationShip'
 import relationDetail from '@/views/relation/overview/detail'
 import data from '@/views/relation/data'
 import datatable from '@/views/relation/datatable'
-
 /**  厂家库 */
-import supplier from '@/views/manufactor/supplier'
-
 /**  辅助屏 */
 import splitScreen from '@/views/screen/splitScreen'
 import spaceLedger from '@/views/screen/splitScreen/spaceledger'
 import equipLedger from '@/views/screen/splitScreen/equipledger'
 import integrateResults from '@/views/screen/splitScreen/integrateresults'
-
 /**  业务空间数据导入工具 */
 import dataUtil from '@/views/business_space/dataUtil/index'
 import dataUtil2 from '@/views/business_space/dataUtil/index2'
@@ -345,43 +329,61 @@ export default [{
         name: 'LayoutMain',
         component: LayoutMain,
         children: [
-            { path: '', name: 'Dasboard', component: Dasboard },
-            {
-                path: 'facility',
-                name: 'facilityLedger',
-                component: facilityLedger,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备台账' }] }
-            },
-            {
-                path: 'parts',
-                name: 'partsLedger',
-                component: partsLedger,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '包含的部件' }] }
-            },
-            {
-                path: 'partsmanage',
-                name: 'partsmanageLedger',
-                component: partsmanageLedger,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '管理部件' }] },
-            },
-            {
-                path: 'partsadd',
-                name: 'partsadd',
-                component: partsadd,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备台账', path: '/ledger/facility' }, { label: '添加部件' }] },
-            },
-            {
-                path: 'deviceadd',
-                name: 'deviceadd',
-                component: deviceadd,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备台账', path: '/ledger/facility' }, { label: '添加设备' }] }
-            },
-            {
-                path: 'batchlinkAssets',
-                name: 'batchlinkAssets',
-                component: batchlinkAssets,
-                meta: { keepAlive: false, breadcrumbs: [{ label: '台账管理', path: '/ledger/facility' }, { label: '设备台账', path: '/ledger/facility' }, { label: '批量关联资产' }] }
-            },
+          {path: '', name: 'Dasboard', component: Dasboard},
+          {
+            path: 'facility',
+            name: 'facilityLedger',
+            component: facilityLedger,
+            meta: {keepAlive: false, breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {label: '设备台账'}]}
+          },
+          {path: 'tableDisplay', name: 'tableDisplay', component: tableDisplay},
+
+          {
+            path: 'parts',
+            name: 'partsLedger',
+            component: partsLedger,
+            meta: {keepAlive: false, breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {label: '包含的部件'}]}
+          },
+          {
+            path: 'partsmanage',
+            name: 'partsmanageLedger',
+            component: partsmanageLedger,
+            meta: {keepAlive: false, breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {label: '管理部件'}]},
+          },
+          {
+            path: 'partsadd',
+            name: 'partsadd',
+            component: partsadd,
+            meta: {
+              keepAlive: false,
+              breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {
+                label: '设备台账',
+                path: '/ledger/facility'
+              }, {label: '添加部件'}]
+            },
+          },
+          {
+            path: 'deviceadd',
+            name: 'deviceadd',
+            component: deviceadd,
+            meta: {keepAlive: false,
+              breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {
+                label: '设备台账',
+                path: '/ledger/facility'
+              }, {label: '添加设备'}]
+            }
+          },
+          {
+            path: 'batchlinkAssets',
+            name: 'batchlinkAssets',
+            component: batchlinkAssets,
+            meta: {keepAlive: false,
+              breadcrumbs: [{label: '台账管理', path: '/ledger/facility'}, {
+                label: '设备台账',
+                path: '/ledger/facility'
+              }, {label: '批量关联资产'}]
+            }
+          },
             {
                 path: 'property',
                 name: 'propertyLedger',

+ 3 - 3
src/views/ledger/facility/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="deviceList">
+  <div id="deviceList" >
     <router-link to="/ledger/facility/addfacility"></router-link>
     <router-view></router-view>
     <saga-title :mess="mess"></saga-title>
@@ -96,7 +96,7 @@ export default {
   methods: {
     getProjName() {
       this.projects.forEach((item) => {
-        if(item.id == this.projectId) 
+        if(item.id == this.projectId)
         this.mess.perjectName = item.name
       })
       // this.getEqCode()
@@ -209,4 +209,4 @@ export default {
     }
   }
 }
-</style>
+</style>