封装数据中台api请求

.env.development

@@ -9,6 +9,8 @@ VUE_APP_API_SERVER =  http://192.168.1.144/api
 # VUE_APP_API_SERVER =  https://epmet-dev.elinkservice.cn:41080/api
 # VUE_APP_API_SERVER =  https://epmet-dev.elinkservice.cn/api
 
+VUE_APP_BIPASS_API_SERVER =  http://bipaas.elinkservice.cn/linkdata/linkdata-gateway/route
+
 # VUE_APP_NODE_ENV=dev_sdtdt
 VUE_APP_NODE_ENV=dev
 #项目根路径

.env.production

@@ -1,4 +1,5 @@
 NODE_ENV=production
 VUE_APP_API_SERVER =  https://epmet-cloud.elinkservice.cn/api
+VUE_APP_BIPASS_API_SERVER =  http://bipaas.elinkservice.cn/linkdata/linkdata-gateway/route
 VUE_APP_NODE_ENV=prod
 VUE_APP_PUBLIC_PATH=epmet-oper

.env.production.sit

@@ -2,5 +2,6 @@ NODE_ENV=production
 # VUE_APP_API_SERVER =  https://epmet-test.elinkservice.cn/api
 # VUE_APP_API_SERVER =  http://192.168.1.140/api
 VUE_APP_API_SERVER =  http://192.168.1.144/api
+VUE_APP_BIPASS_API_SERVER =  http://bipaas.elinkservice.cn/linkdata/linkdata-gateway/route
 VUE_APP_NODE_ENV=prod:sit
 VUE_APP_PUBLIC_PATH=epmet-oper

.env.shibei_production

@@ -1,4 +1,5 @@
 NODE_ENV=production
 VUE_APP_API_SERVER =  https://epdc-shibei.elinkservice.cn/api
+# VUE_APP_BIPASS_API_SERVER =  http://bipaas.elinkservice.cn/linkdata/linkdata-gateway/route
 VUE_APP_NODE_ENV=shibei_prod
 VUE_APP_PUBLIC_PATH=epmet-oper

src/assets/scss/dataBoard/renfang/index.scss

@@ -277,27 +277,32 @@
     right: 0;
     display: flex;
     align-items: center;
+    justify-content: space-around;
     padding-left: 10px;
 
     .item {
         display: flex;
-        width: 160px;
+        width: 120px;
 
-        img {
-            display: block;
-            margin-right: 16px;
-            width: 48px;
-            height: 48px;
-        }
         .item-info {
             font-size: 14px;
             font-family: PingFangSC-Regular, PingFang SC;
             font-weight: 400;
             color: rgba(255, 255, 255, 0.65);
-            line-height: 20px;
+            line-height: 40px;
             vertical-align: bottom;
             div {
                 margin-bottom: 6px;
+                &:first-child {
+                    line-height: 20px;
+                }
+            }
+            img {
+                display: inline-block;
+                margin-right: 5px;
+                width: 20px;
+                height: 20px;
+                vertical-align: bottom;
             }
             b {
                 font-weight: 500;

src/assets/scss/dataBoardMain.scss

@@ -54,16 +54,50 @@
         color: #ffffff;
     }
 
+    .btn-back {
+        position: absolute;
+        top: 52px;
+        left: 40px;
+        display: flex;
+        width: 60px;
+        align-items: center;
+        line-height: 22px;
+        font-size: 16px;
+        color: #1a95ff;
+        cursor: pointer;
+
+        img {
+            width: 16px;
+            margin-right: 5px;
+        }
+        .z-default {
+            display: block;
+        }
+        .z-on {
+            display: none;
+        }
+
+        &:hover {
+            color: #fff;
+            .z-default {
+                display: none;
+            }
+            .z-on {
+                display: block;
+            }
+        }
+    }
+
     .nav-list {
         position: absolute;
         top: 40px;
-        left: 40px;
+        left: 120px;
         display: flex;
         width: 500px;
 
         &.z-right {
             left: auto;
-            right: 40px;
+            right: 120px;
             .nav-item {
                 background-image: url(../images/shuju/main/nav-right.png);
                 &.z-on {

src/js/dai/request-bipass.js

@@ -0,0 +1,114 @@
+/*---------------------------------------------------------------
+ |                  【数据中台专用】请求接口封装                  |
+ ---------------------------------------------------------------*/
+import axios from "axios";
+import curry from "dai-js/tools/curry";
+import { Message } from "element-ui";
+import { clearLoginInfo } from "@/utils";
+
+axios.defaults.withCredentials = true;
+axios.defaults.crossDomain = true;
+
+const request = curry((method, uri, data = {}, params = {}) => {
+	return new Promise((reslove) => {
+		let returnIniData = {
+			httpCode: "",
+			data: {},
+			msg: "",
+			code: "",
+		};
+
+		const { headers, mockId } = params;
+
+		// env文件配置接口
+		let url = process.env.VUE_APP_BIPASS_API_SERVER;
+
+		// mock 开发临时用接口
+		if (mockId) {
+			url = "https://mock.apifox.cn/m2/2242395-0-default/" + mockId;
+		}
+
+		const succFn = (res) => {
+			// log(`[request成功] ${url}`, data, res);
+			let retData = {
+				...returnIniData,
+				...res.data,
+				httpCode: res.statusCode,
+			};
+			// if(typeof Vue.$afterRequestHook == 'function'){
+			// 	retData = Vue.$afterRequestHook(retData);
+			// }
+			if (res.data.code > 8000 && res.data.code < 10000) {
+				// Message.error(res.data.msg);
+			}
+			if (res.code == 1007 || res.code == 1024 || res.code == 2003) {
+				// 10005 token为空  10006登陆超时 10007别处登录
+				console.log("登录失效");
+				Message.error(res.data.msg);
+				clearLoginInfo();
+				return next({
+					name: "login",
+				});
+			}
+
+			reslove(retData);
+		};
+
+		const failFn = (err) => {
+			// log(`[request失败] ${url}`, data, err);
+
+			reslove(
+				Object.assign({}, returnIniData, {
+					httpCode: "9999", //访问出现意外
+					msg: "网络错误",
+				})
+			);
+		};
+
+		if (method.toUpperCase() == "POST") {
+			axios
+				.post(
+					url,
+					{
+						apiCode: "/api/post",
+						dispatcherSystem: "dataservice",
+						param: {
+							ds_code: uri,
+							app_code: "empet",
+							orderby: "[]",
+							...data,
+						},
+					},
+					{
+						headers,
+						responseType: "json",
+					}
+				)
+				.then(succFn)
+				.catch(failFn);
+		} else {
+			axios
+				.post(
+					url,
+					{
+						apiCode: "/api/get",
+						dispatcherSystem: "dataservice",
+						param: {
+							ds_code: uri,
+							app_code: "empet",
+							orderby: "[]",
+							...data,
+						},
+					},
+					{
+						headers,
+						responseType: "json",
+					}
+				)
+				.then(succFn)
+				.catch(failFn);
+		}
+	});
+});
+
+export const requestPostBi = request("post");

src/views/dataBoard/renfang/index.vue

@@ -34,12 +34,12 @@
 			<div class="m-map">
 				<div class="m-per">
 					<div class="item">
+						<div class="item-info">
+							<div>
 								<img
-              class="item-icon"
 									src="~@/assets/images/shuju/renfang/index/per/lnr.png"
-            />
+								/>老年人
-            <div class="item-info">
+							</div>
-              <div>老年人</div>
 							<div>
 								<b>10.22</b>
 								%
@@ -47,12 +47,12 @@
 						</div>
 					</div>
 					<div class="item">
+						<div class="item-info">
+							<div>
 								<img
-              class="item-icon"
 									src="~@/assets/images/shuju/renfang/index/per/qsn.png"
-            />
+								/>青少年
-            <div class="item-info">
+							</div>
-              <div>青少年</div>
 							<div>
 								<b>10.22</b>
 								%
@@ -60,12 +60,12 @@
 						</div>
 					</div>
 					<div class="item">
+						<div class="item-info">
+							<div>
 								<img
-              class="item-icon"
 									src="~@/assets/images/shuju/renfang/index/per/zyz.png"
-            />
+								/>志愿者
-            <div class="item-info">
+							</div>
-              <div>志愿者</div>
 							<div>
 								<b>10.22</b>
 								%
@@ -73,12 +73,12 @@
 						</div>
 					</div>
 					<div class="item">
+						<div class="item-info">
+							<div>
 								<img
-              class="item-icon"
 									src="~@/assets/images/shuju/renfang/index/per/dy.png"
-            />
+								/>党员
-            <div class="item-info">
+							</div>
-              <div>党员</div>
 							<div>
 								<b>10.22</b>
 								%
@@ -86,12 +86,26 @@
 						</div>
 					</div>
 					<div class="item">
+						<div class="item-info">
+							<div>
 								<img
-              class="item-icon"
 									src="~@/assets/images/shuju/renfang/index/per/syry.png"
-            />
+								/>失业人员
+							</div>
+							<div>
+								<b>10.22</b>
+								%
+							</div>
+						</div>
+					</div>
+					<div class="item">
 						<div class="item-info">
-              <div>失业人员</div>
+							<div>
+								<img
+									src="~@/assets/images/shuju/renfang/index/per/ygxl.png"
+								/>
+								月更新率
+							</div>
 							<div>
 								<b>10.22</b>
 								%
@@ -137,7 +151,10 @@
 
 						<div class="i-div"></div>
 
-            <div class="card-btn" @click="searchModule.displayedCard = false">
+						<div
+							class="card-btn"
+							@click="searchModule.displayedCard = false"
+						>
 							<img
 								src="~@/assets/images/shuju/renfang/index/search/close.png"
 							/>
@@ -146,38 +163,51 @@
 					<div class="card-show">
 						<div class="card-tabs">
 							<div
-                :class="{ 'z-on': searchModule.resultTab == 'all' }"
+								:class="{
+									'z-on': searchModule.resultTab == 'all',
+								}"
 								@click="searchModule.resultTab = 'all'"
 							>
 								全部
 							</div>
 							<div
-                :class="{ 'z-on': searchModule.resultTab == 'resi' }"
+								:class="{
+									'z-on': searchModule.resultTab == 'resi',
+								}"
 								@click="searchModule.resultTab = 'resi'"
 							>
 								居民
 							</div>
 							<div
-                :class="{ 'z-on': searchModule.resultTab == 'all' }"
+								:class="{
+									'z-on': searchModule.resultTab == 'all',
+								}"
 								@click="searchModule.resultTab = 'all'"
 							>
 								小区
 							</div>
 							<div
-                :class="{ 'z-on': searchModule.resultTab == 'all' }"
+								:class="{
+									'z-on': searchModule.resultTab == 'all',
+								}"
 								@click="searchModule.resultTab = 'all'"
 							>
 								楼栋
 							</div>
 							<div
-                :class="{ 'z-on': searchModule.resultTab == 'all' }"
+								:class="{
+									'z-on': searchModule.resultTab == 'all',
+								}"
 								@click="searchModule.resultTab = 'all'"
 							>
 								房屋
 							</div>
 						</div>
 
-            <div class="card-list" v-if="searchModule.result.length > 0">
+						<div
+							class="card-list"
+							v-if="searchModule.result.length > 0"
+						>
 							<div
 								class="card-item"
 								:key="item.id"
@@ -196,7 +226,9 @@
 						</div>
 
 						<div class="card-empty" v-else>
-              <img src="~@/assets/images/shuju/renfang/index/empty.png" />
+							<img
+								src="~@/assets/images/shuju/renfang/index/empty.png"
+							/>
 							<span>没有找到搜索结果～</span>
 						</div>
 					</div>
@@ -212,9 +244,13 @@
 					<div class="box-title-txt">居民分类分析</div>
 
 					<div class="box-title-btn">
-            <img src="~@/assets/images/shuju/renfang/index/znyc.png" />
+						<img
+							src="~@/assets/images/shuju/renfang/index/znyc.png"
+						/>
 						<span>智能预测</span>
-            <img src="~@/assets/images/shuju/renfang/index/i-hint.png" />
+						<img
+							src="~@/assets/images/shuju/renfang/index/i-hint.png"
+						/>
 					</div>
 				</div>
 
@@ -238,7 +274,10 @@
 								v-if="false"
 								src="~@/assets/images/shuju/renfang/index/up.png"
 							/>
-              <img v-else src="~@/assets/images/shuju/renfang/index/down.png" />
+							<img
+								v-else
+								src="~@/assets/images/shuju/renfang/index/down.png"
+							/>
 							<b>{{ item.count }}</b>
 							<span>人</span>
 						</div>
@@ -299,6 +338,7 @@ import jmgl from "@/views/dataBoard/renfang/cpts/jmgl";
 import rkfx from "@/views/dataBoard/renfang/cpts/rkfx";
 import rkyj from "@/views/dataBoard/renfang/cpts/rkyj";
 import szsq from "@/views/dataBoard/renfang/cpts/szsq";
+import { requestPostBi } from "@/js/dai/request-bipass";
 import { requestPost } from "@/js/dai/request";
 import getQueryPara from "dai-js/modules/getQueryPara";
 
@@ -353,6 +393,14 @@ export default {
 					},
 				],
 			},
+
+			perInfo: {
+				unused_count: 10,
+				lease_count: 10,
+				house_count: 100,
+				org_id: "10001",
+				self_dwelling_count: 10,
+			},
 		};
 	},
 	async mounted() {
@@ -367,11 +415,37 @@ export default {
 		//加载组织数据
 		await this.loadOrgData();
 		this.getWarningList();
+		this.getPerInfo();
 	},
 	methods: {
+		clickAgencyItem() {},
+
 		handleSearch() {
 			console.log(this.searchModule);
 		},
+		//地图上居民分类百分比数据 ps:感觉有点重复显示
+		async getPerInfo() {
+      console.log('=========================getPerInfo')
+			const url = "house_view";
+
+			const { data, code, msg } = await requestPostBi(
+				url,
+				{
+					queryParam: {
+						org_id: this.orgData.id,
+					},
+				},
+				{
+					mockId: 60810589,
+				}
+			);
+
+			if (code === 0) {
+				this.perInfo = data[0];
+			} else {
+				this.$message.error(msg);
+			}
+		},
 
 		//加载组织数据
 		async getWarningList() {

src/views/dataBoardMain/main-navbar.vue

@@ -1,6 +1,11 @@
 <template>
 	<div class="m-topnav">
 		<div class="title">{{ customerName }}综合服务平台数据看板</div>
+		<div class="btn-back" @click="toPage('/')">
+			<img class="z-default" src="~@/assets/images/shuju/main/back.png" />
+			<img class="z-on" src="~@/assets/images/shuju/main/back-on.png" />
+			<span>返回</span>
+		</div>
 		<div class="nav-list z-left">
 			<div
 				class="nav-item"
@@ -10,19 +15,19 @@
 				<span>人房总览</span>
 			</div>
 			<div class="nav-item" @click="toPage('/')">
-        <span>人口分析</span>
+				<span>问题清单</span>
 			</div>
 			<div class="nav-item" @click="toPage('/')">
-        <span>人口变化</span>
+				<span>需求清单</span>
 			</div>
 			<div class="nav-item" @click="toPage('/')">
-        <span>人口预警</span>
+				<span>资源清单</span>
 			</div>
 		</div>
 
 		<div class="nav-list z-right">
-      <div class="nav-item" @click="toPage('/')">
+			<div class="nav-item">
-        <span>回首页</span>
+				<span>15分钟生活圈</span>
 			</div>
 		</div>
 
@@ -72,7 +77,10 @@
 					v-else-if="weather.weather == '多云'"
 					src="~@/assets/images/shuju/main/weather/duoyun.png"
 				/>
-        <img v-else src="~@/assets/images/shuju/main/weather/qing.png" />
+				<img
+					v-else
+					src="~@/assets/images/shuju/main/weather/qing.png"
+				/>
 
 				<div>{{ weather.temperature }}℃</div>
 				<div>{{ weather.weather }}</div>
@@ -87,8 +95,13 @@
 
 		<nav v-if="false" class="m-navbar">
 			<div class="navbar__header">
-        <h1 class="navbar__brand" @click="$router.push({ name: 'home' })">
+				<h1
-          <a class="navbar__brand-lg" href="javascript:;">{{ customerName }}</a>
+					class="navbar__brand"
+					@click="$router.push({ name: 'home' })"
+				>
+					<a class="navbar__brand-lg" href="javascript:;">{{
+						customerName
+					}}</a>
 					<a class="navbar__brand-mini" href="javascript:;">{{
 						customerName.slice(0, 2)
 					}}</a>
@@ -98,7 +111,9 @@
 				<el-menu class="navbar__menu mr-auto" mode="horizontal">
 					<el-menu-item
 						index="1"
-            @click="$store.state.sidebarFold = !$store.state.sidebarFold"
+						@click="
+							$store.state.sidebarFold = !$store.state.sidebarFold
+						"
 					>
 						<svg
 							class="icon-svg navbar__icon-menu navbar__icon-menu--switch"
@@ -109,7 +124,10 @@
 					</el-menu-item>
 
 					<el-menu-item index="2" @click="refresh()">
-            <svg class="icon-svg navbar__icon-menu" aria-hidden="true">
+						<svg
+							class="icon-svg navbar__icon-menu"
+							aria-hidden="true"
+						>
 							<use xlink:href="#icon-sync"></use>
 						</svg>
 					</el-menu-item>
@@ -126,11 +144,15 @@
 						<span>首页</span>
 					</el-menu-item>
 
-          <template v-for="(menu, idx) in $store.state.mainShuju.menuList">
+					<template
+						v-for="(menu, idx) in $store.state.mainShuju.menuList"
+					>
 						<li
 							class="sub-menu"
 							:class="
-                $store.state.mainShuju.activeName == menu.id ? 'z-on' : ''
+								$store.state.mainShuju.activeName == menu.id
+									? 'z-on'
+									: ''
 							"
 							v-if="menu.children"
 							:key="menu.id"
@@ -140,12 +162,15 @@
 							<div class="sub-menu-list">
 								<div
 									:class="
-                    $store.state.mainShuju.activeName == subMenu.id
+										$store.state.mainShuju.activeName ==
+										subMenu.id
 											? 'z-on'
 											: ''
 									"
 									:key="subMenu.id"
-                  @click="gotoRouteHandle(subMenu.id, subIndex)"
+									@click="
+										gotoRouteHandle(subMenu.id, subIndex)
+									"
 									v-for="(subMenu, subIndex) in menu.children"
 								>
 									{{ subMenu.name }}
@@ -186,7 +211,10 @@
             </a>
           </el-menu-item> -->
 					<el-menu-item index="3" @click="fullscreenHandle()">
-            <svg class="icon-svg navbar__icon-menu" aria-hidden="true">
+						<svg
+							class="icon-svg navbar__icon-menu"
+							aria-hidden="true"
+						>
 							<use xlink:href="#icon-fullscreen"></use>
 						</svg>
 					</el-menu-item>
@@ -194,17 +222,23 @@
 					<el-menu-item index="4" class="navbar__avatar">
 						<el-dropdown placement="bottom" :show-timeout="0">
 							<span class="el-dropdown-link">
-                <img src="~@/assets/img/staff-default-avatar.png" />
+								<img
+									src="~@/assets/img/staff-default-avatar.png"
+								/>
 								<span>{{ $store.state.user.realName }}</span>
 								<i class="el-icon-arrow-down"></i>
 							</span>
 							<el-dropdown-menu slot="dropdown">
-                <el-dropdown-item @click.native="updatePasswordHandle()">{{
+								<el-dropdown-item
+									@click.native="updatePasswordHandle()"
+									>{{
 										$t("updatePassword.title")
-                }}</el-dropdown-item>
+									}}</el-dropdown-item
-                <el-dropdown-item @click.native="logoutHandle()">{{
+								>
-                  $t("logout")
+								<el-dropdown-item
-                }}</el-dropdown-item>
+									@click.native="logoutHandle()"
+									>{{ $t("logout") }}</el-dropdown-item
+								>
 							</el-dropdown-menu>
 						</el-dropdown>
 					</el-menu-item>