Browse Source

样式调整

LXXXY 5 years ago
parent
commit
81d0f91883

+ 3 - 3
src/components/point/report/addTabFunNum.vue

@@ -1,7 +1,7 @@
 <template>
   <!-- 新增表号-功能号 -->
   <div id="addTabFunNum">
-    <el-form :model='form' label-width="150px" ref="ruleForm" :rules="rules" style="height:300px;overflow:auto;">
+    <el-form :model='form' label-width="150px" ref="ruleForm" :rules="rules" style="height:258px;overflow:auto;">
       <el-form-item label="表号-功能号" prop="MeterFunc">
         <el-input v-model="form.MeterFunc" placeholder="请输入表号-功能号"></el-input>
       </el-form-item>
@@ -14,9 +14,9 @@
       <el-form-item label="取值公式" prop="DataRuleContent">
         <el-input type="textarea" placeholder="请输入取值公式" v-model="form.DataRuleContent"></el-input>
       </el-form-item>
-      <el-form-item label="" style="text-align:right;">
-        <el-button type="primary" @click="add()">新增</el-button>
+      <el-form-item label="" style="text-align:right;margin-bottom:0px">
         <el-button @click="$emit('closeDrawer')">取消</el-button>
+        <el-button type="primary" @click="add()">新增</el-button>
       </el-form-item>
     </el-form>
   </div>

+ 1 - 1
src/components/point/report/dataSource.vue

@@ -72,7 +72,7 @@ export default {
 }
 .data-item {
   margin: 15px 10px;
-  box-shadow: 2px 2px 2px 2px #aaa;
+  box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.2);
   background-color: white;
   padding: 10px 10px;
 }

+ 1 - 2
src/components/point/report/integrateStatistics.vue

@@ -272,8 +272,7 @@ export default {
   border-top: 5px solid #eee;
 }
 .statistics-chart {
-  border: 1px solid rgba(0, 0, 0, 0.3);
-  min-height: 50%;
+  min-height: calc(50% - 3px);
 }
 .chart-title {
   padding: 5px 5%;

+ 9 - 4
src/components/point/report/objectInstance.vue

@@ -2,7 +2,7 @@
   <!-- 对象实例 -->
   <div id="objectInstance" v-loading="loading">
     <div ref="test1"></div>
-    <div class="obj-item" v-for="form in forms" :key="form.id">
+    <div class="obj-item" v-for="form in forms" :key="form.id" :style="{height:drawCanvas? '600px' : '350px'}">
       <el-form :model="form" label-width="150px">
         <el-form-item label="对象类型:">
           {{form.TypeName || '--'}}
@@ -24,7 +24,9 @@
         </el-form-item>
         <el-form-item label="对象实例位置图:">
           <span v-show="!drawCanvas">--</span>
-          <canvas v-show="drawCanvas" height="300px" width="600" class="instanceMap" :id="form.instanceId" :k="refreshCanvas"></canvas>
+          <div v-show="drawCanvas" style="border:1px solid rgba(0, 0, 0, 0.2);height:300px;">
+            <canvas v-show="drawCanvas" height="300" width="450" class="instanceMap" :id="form.instanceId" :k="refreshCanvas"></canvas>
+          </div>
         </el-form-item>
       </el-form>
     </div>
@@ -137,7 +139,7 @@ export default {
         else if (typecode == 'Sp') {
           that.scenes[key] = new DivideFloorScene();
         }
-        if (floorMsg.Content[0].StructureInfo && floorMsg.Content[0].StructureInfo.FloorMap) {
+        if (floorMsg.Content[0] && floorMsg.Content[0].StructureInfo && floorMsg.Content[0].StructureInfo.FloorMap) {
           //获取数据,并加载canvas
           that.scenes[key].loadUrl(`/image-service/common/file_get?systemId=revit&key=${floorMsg.Content[0].StructureInfo.FloorMap}`).then(() => {
             that.drawCanvas = true;
@@ -152,6 +154,9 @@ export default {
             that.views[key].fitSceneToView();
           })
         }
+        else{
+          that.drawCanvas = false;
+        }
       });
     }
   },
@@ -184,7 +189,7 @@ export default {
 }
 .obj-item {
   margin: 15px 10px;
-  box-shadow: 2px 2px 2px 2px #aaa;
+  box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.2);
   background-color: white;
   padding: 10px 10px;
   height: 600px;

+ 38 - 26
src/components/point/report/tabFunNumOverview.vue

@@ -1,19 +1,20 @@
 <template>
   <div id="tabFunNumOverview">
     <!-- 查询 新增 -->
-    <div class="query-area">
+    <div class="query-area" style="padding:10px;">
       <el-input :placeholder="`请输入表号功能号`" v-model="tabFunNum" @keyup.enter.native="getOverViewList()" style="width:240px;">
         <i slot="suffix" class="el-input__icon el-icon-search" @click="getOverViewList()"></i>
       </el-input>
-
-      <el-button type="primary" size="mini" @click="handleDrawer({},3)" style="float: right;">新增自定义</el-button>
+      <p style="overflow: hidden;float:right;">
+        <el-button style="height:32px" @click='handleDrawer({},3)'>新增自定义</el-button>
+      </p>
     </div>
     <!-- 数据表格 -->
     <div class="table-area">
-      <el-table :data="tableData" style="width: 100%" height="calc(100% - 40px)" v-loading="loading" :header-cell-style="headerStyle">
+      <el-table :data="tableData" style="width: 100%" height="calc(100% - 32px)" v-loading="loading" :header-cell-style="headerStyle">
         <el-table-column prop='' label='' show-overflow-tooltip width="30" header-align='center'>
           <template slot-scope="scope">
-            <el-tooltip v-if="scope.row.DataQuality!=0" content="已断数,请检查" placement="bottom" effect="light">
+            <el-tooltip v-if="scope.row.DataQuality!=0" content="已断数,请检查" effect="dark" placement="top">
               <i class="el-icon-warning-outline" style="float:left;margin: 0 5px;color: red;"></i>
             </el-tooltip>
           </template>
@@ -21,32 +22,39 @@
         <el-table-column prop='MeterFunc' label='表号-功能号' show-overflow-tooltip min-width="100" header-align='center'></el-table-column>
         <el-table-column prop='Data.Data' label='对应值(单位)' show-overflow-tooltip min-width="90" header-align='center'>
           <template slot-scope="scope">
-            <span>{{ scope.row.Data? scope.row.Data.Data : '' }}</span>
-            <i @click="handleDrawer(scope.row, 0)" class="el-icon-s-data"></i>
+            <span style="line-height:29px;">{{ scope.row.Data? scope.row.Data.Data : '' }}</span>
+            <el-button style="padding:7px 15px;float:right;" @click="handleDrawer(scope.row, 0)"><i class="el-icon-s-data"></i></el-button>
           </template>
         </el-table-column>
         <el-table-column prop='Data.Time' label='获取时间' show-overflow-tooltip min-width="130" header-align='center'>
           <template slot-scope="scope">
-            <span>{{ scope.row.Data? scope.row.Data.Time: '' }}</span>
-            <i class="el-icon-refresh" @click="refreshThisRow(scope.row)"></i>
+            <span style="line-height:29px;">{{ scope.row.Data? scope.row.Data.Time: '' }}</span>
+            <el-button style="padding:7px 15px;float:right;" @click="refreshThisRow(scope.row)"><i class="el-icon-refresh"></i></el-button>
           </template>
         </el-table-column>
         <el-table-column prop='RelatedPoint' label='涉及子系统点位(数据来源)' show-overflow-tooltip min-width="150" align='center'>
           <template slot-scope="scope">
-            <span style="display:inline-block;width:16px;">{{ scope.row.RelatedPoint }}</span>
-            <i @click="handleDrawer(scope.row, 1)" class="el-icon-coin" style="float:none;margin-left:10px;"></i>
+            <span style="display:inline-block;width:16px;line-height:29px;">{{ scope.row.RelatedPoint }}</span>
+            <p style="width:55.33px;display:inline-block;">
+              <el-button v-if="scope.row.RelatedPoint" style="padding:7px 15px;margin-left:10px;" @click="handleDrawer(scope.row, 1)"><i
+                  class="el-icon-coin"></i></el-button>
+            </p>
           </template>
         </el-table-column>
         <el-table-column prop='RelatedInstance' label='涉及的对象实例(应用到)' show-overflow-tooltip min-width="150" align='center'>
           <template slot-scope="scope">
-            <span style="display:inline-block;width:16px;">{{ scope.row.RelatedInstance }}</span>
-            <i @click="handleDrawer(scope.row, 2)" class="el-icon-coin" style="float:none;margin-left:10px;"></i>
+            <span style="display:inline-block;width:16px;line-height:29px;">{{ scope.row.RelatedInstance }}</span>
+            <p style="width:55.33px;display:inline-block;">
+              <el-button v-if="scope.row.RelatedInstance" style="padding:7px 15px;margin-left:10px;" @click="handleDrawer(scope.row, 2)"><i
+                  class="el-icon-coin"></i></el-button>
+            </p>
           </template>
         </el-table-column>
       </el-table>
       <!-- 分页 -->
       <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="pageSizes"
-        :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="allTableData.length" style="float:right;margin-right: 15px;">
+        :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="allTableData.length"
+        style="float:right;margin-top:10px;padding:2px 5px;">
       </el-pagination>
     </div>
     <!-- 对话框和抽屉统一放在drawers中 -->
@@ -55,10 +63,10 @@
       <historyChart :tabFunNum='drawers[0].objId'></historyChart>
     </el-dialog>
     <!-- 抽屉 -->
-    <el-drawer :title="'< ' + drawers[1].objId + ' > 的子系统点位'" :visible.sync="drawers[1].drawer" :direction="drawers[1].direction" size="50%">
+    <el-drawer :title="'< ' + drawers[1].objId + ' > 的子系统点位'" :visible.sync="drawers[1].drawer" :direction="drawers[1].direction" size="35%">
       <dataSource :tabFunNum='drawers[1].objId'></dataSource>
     </el-drawer>
-    <el-drawer :title="'< ' + drawers[2].objId + ' > 的对象实例'" :visible.sync="drawers[2].drawer" :direction="drawers[2].direction" size="50%">
+    <el-drawer :title="'< ' + drawers[2].objId + ' > 的对象实例'" :visible.sync="drawers[2].drawer" :direction="drawers[2].direction" size="35%">
       <objectInstance :tabFunNum='drawers[2].objId' :reValue='drawers[2].value'></objectInstance>
     </el-drawer>
     <el-dialog title="新增表号功能号" :visible.sync="drawers[3].drawer">
@@ -68,6 +76,7 @@
 </template>
 
 <script>
+import { Message } from 'element-ui';
 import {
   getTabFunNumOverview
 } from '@/api/scan/request'
@@ -120,8 +129,8 @@ export default {
     getOverViewList() {
       this.loading = true;
       getTabFunNumOverview({ MeterFunc: this.tabFunNum }, res => {
-          this.allTableData = res.Content;
-          this.loading = false;
+        this.allTableData = res.Content;
+        this.loading = false;
       });
     },
     //刷新当前行数据
@@ -131,11 +140,14 @@ export default {
         MeterFunc: row.MeterFunc
       }
       getTabFunNumOverview(pa, res => {
-        this.tableData[index].Data.Data = res.Content[0].Data.Data;
-        this.tableData[index].Data.Time = res.Content[0].Data.Time;
+        if (res.Content[0].Data) {
+          this.tableData[index].Data.Data = res.Content[0].Data.Data;
+          this.tableData[index].Data.Time = res.Content[0].Data.Time;
+        }
         this.tableData[index].DataQuality = res.Content[0].DataQuality;
         this.tableData[index].RelatedInstance = res.Content[0].RelatedInstance;
         this.tableData[index].RelatedPoint = res.Content[0].RelatedPoint;
+        Message.success('已刷新');
       });
     },
     //分页更换size
@@ -186,20 +198,20 @@ export default {
   width: 100%;
   overflow: hidden;
 }
-.query-area {
-  margin: 4px 8px;
-}
 .table-area {
-  height: calc(100% - 40px);
+  height: calc(100% - 72px);
+  padding: 0px 10px 10px 10px;
 }
 .table-area i {
   text-align: right;
-  font-size: 16px;
+  font-size: 12px;
   cursor: pointer;
   float: right;
-  line-height: 22.4px;
 }
 /deep/ .el-drawer__body {
   height: 90%;
 }
+/deep/ .el-dialog__body {
+  padding-bottom:20px;
+}
 </style>

+ 2 - 2
src/views/point/report/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <!-- 系统集成统计页面 -->
-    <div class="contain-block" style="width:calc(30% - 20px);margin-right:20px;">
+    <div class="contain-block" style="width:29%;margin-right:1%;">
       <span class="contain-title-leftblock">系统集成统计</span>
       <div class="contain-data">
         <integrateStatistics ref="chart" style="height: calc(100% - 15px);" :key="refresh"></integrateStatistics>
@@ -69,6 +69,6 @@ export default {
 }
 .contain-data {
   overflow: auto;
-  height: calc(100% - 50px);
+  height: calc(100% - 46px);
 }
 </style>