办公、空间调整

src/components/business/space/charts/spaceCostChart.vue

@@ -12,8 +12,8 @@ export default {
           ]
         },
         grid: {
-          left: '8%', //默认10%
-          right: '10%', //默认10%
+          left: '15px', //默认10%
+          right: '15px', //默认10%
           bottom: '20px', //默认60
           top: '60px',
           containLabel: true
@@ -58,16 +58,9 @@ export default {
             smooth: true,
             showSymbol:false,
             areaStyle: {
-              color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                offset: 0,
-                color: '#A6C9FF' // 0% 处的颜色
-              }, {
-                offset: 0.8,
-                color: '#ffffff' // 100% 处的颜色
-              }], false),
+              color: {},
             },
             lineStyle: {
-              color: "#5A9BFE",
               width: 1,
             },
             emphasis: {
@@ -82,16 +75,9 @@ export default {
             smooth: true,
             showSymbol:false,
             areaStyle: {
-              color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                offset: 0,
-                color: '#B0E5CB' // 0% 处的颜色
-              }, {
-                offset: 0.8,
-                color: '#ffffff' // 100% 处的颜色
-              }], false),
+              color: {}
             },
             lineStyle: {
-              color: "#62CC97",
               width: 1,
             },
             emphasis: {

src/components/business/space/space.vue

@@ -18,17 +18,22 @@
         <CoreData :data-list="coreData"></CoreData>
       </card>
     </div>
-    <a-row style="margin-top: 12px">
-      <a-col :span="18">
+    <a-row style="margin-top: 12px" :gutter="[12,12]">
+      <a-col :span="24">
         <div class="left ioc-card-content">
           <card :title="'空间分析'">
-            <div style="padding: 8px" class="space-image">
-              <img :src="requireImg('business/联通img.png')" width="100%" />
+            <div class="space-image-left">
+              <a-table :columns="columns" :data-source="data" :pagination="false">
+
+              </a-table>
+            </div>
+            <div style="padding: 8px;text-align: center" class="space-image">
+              <img style="border-radius: 12px;margin: 0 auto" :src="requireImg('business/zhuyuguoji.png')" height="95%" />
             </div>
           </card>
         </div>
       </a-col>
-      <a-col :span="6">
+      <a-col :span="24">
         <div class="right ioc-card-content">
           <card :title="'空间成本'">
             <div style="height: 40px">
@@ -37,16 +42,16 @@
                   font-size: 16px;
                   font-weight: 400;
                   color: #b2b2b2;
-                  margin-left: 25%;
+                  margin-left: 15px;
                 "
                 >人均空间成本</span
               >
-              <span style="padding: 0 10%; font-size: 20px; color: #4d4d4d"
+              <span style="padding: 0 6px; font-size: 20px; color: #656565"
                 >36</span
               >
               <span style="color: #b2b2b2">元/m2/人</span>
             </div>
-            <div style="padding: 0 15px">
+            <div >
               <SpaceCostChart
                 ref="SpaceCostChart"
                 :query-data="queryData"
@@ -87,6 +92,36 @@ export default {
         companyId: "0",
         timeRange: this.$util.dateUtil.getNearlyMonthRange(),
       },
+      columns: [
+        {
+          dataIndex: 'name',
+          key: 'name',
+          title: '区域',
+        },
+        {
+          dataIndex: 'area',
+          key: 'area',
+          title: '面积(㎡)',
+        }
+      ],
+      data: [
+        {
+          name: '餐厅(21F)',
+          area: '211',
+        },{
+          name: '展厅(18F)',
+          area: '211',
+        },{
+          name: '办公区(3-20F)',
+          area: '3798',
+        },{
+          name: '大厅(1F)',
+          area: '211',
+        },{
+          name: '停车区(B2-B3)',
+          area: '422',
+        },
+      ],
       coreData: [
         {
           title: "自用工位分配率",
@@ -180,19 +215,30 @@ export default {
 </script>
 
 <style lang="less" scoped>
+.space-image-left {
+  width: 20%;
+  display: inline-block;
+  vertical-align: top;
+}
 .space-image {
-  //background-image: url("@/assets/images/business/联通img.png");
+  //background-image: url("@/assets/images/business/zhuyuguoji.png");
   //background-position: 50% 50%;
   //background-repeat: no-repeat;
+  width: 80%;
+  display: inline-block;
   height: 550px;
+  border-radius: 12px;
+  vertical-align: top;
   //background-size: 100% auto;
 }
 .left {
-  margin-right: 6px;
+  //margin-right: 6px;
 }
 
 .right {
-  margin-left: 6px;
+  //margin-left: 6px;
+  padding-bottom: 15px;
+  margin-bottom: 12px;
 }
 
 .cben {

src/components/work/overview/workOverview.vue

@@ -33,7 +33,7 @@
                 <div style="height: 670px; text-align: center" v-else>
                   <!--<iocThreeFbx  />-->
                   <img
-                    :src="requireImg('security/area_1F.png')"
+                    :src="requireImg(imgSrc)"
                     style="border-radius: 12px"
                     height="100%"
                   />
@@ -89,16 +89,24 @@ export default {
     let timeRange = this.$util.dateUtil.getNearlyMonthRange();
     return {
       showFloorData: true,
+      imgSrc: 'security/area_1F.png',
+      imgs: {
+        '1': 'security/area_1F.png',
+        '-2': 'security/area_B2.png',
+        '-3': 'security/area_B3.png',
+        '15': 'security/area_15F.png',
+        '20': 'security/area_20F.png',
+      },
       queryData: {
         companyId: "0",
-        floorId: "-99",
+        floorId: "0",
         timeRange: timeRange,
       },
       floorData: [
-        {
-          value: "-99",
-          label: "全部",
-        },
+        //{
+        //  value: "-99",
+        //  label: "全部",
+        //},
         {
           value: -3,
           label: "B3",
@@ -107,29 +115,17 @@ export default {
           value: -2,
           label: "B2",
         },
-        {
-          value: -1,
-          label: "B1",
-        },
         {
           value: "1",
           label: "1F",
         },
         {
-          value: 7,
-          label: "7F",
-        },
-        {
-          value: 8,
-          label: "8F",
+          value: 15,
+          label: "15F",
         },
         {
-          value: 9,
-          label: "9F",
-        },
-        {
-          value: 21,
-          label: "21F",
+          value: 20,
+          label: "20F",
         },
       ],
       columns: [
@@ -184,9 +180,13 @@ export default {
     },
     reset() {},
     search() {
-      if (!this.queryData.floorId || this.queryData.floorId == "-99") {
+      if (!this.queryData.floorId || this.queryData.floorId == "-99" || this.queryData.floorId=='0') {
         this.showFloorData = true;
       } else {
+        this.imgSrc = this.imgs['1']
+        if (this.imgs[''+this.queryData.floorId]) {
+          this.imgSrc = this.imgs[''+this.queryData.floorId]
+        }
         this.showFloorData = false;
       }
       this.$util.asyncPromise(this.getCoreData(), this.getDoorEnterPerson());
@@ -194,7 +194,8 @@ export default {
     },
     getCoreData() {
       let params = JSON.parse(JSON.stringify(this.queryData));
-      if (params.floorId == "-99") {
+      params.floorId = ""+params.floorId
+      if (params.floorId == "-99" || params.floorId == '0') {
         delete params.floorId;
       }
       return apiWorkFloor.getCoreData(params).then((res) => {