You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
318 lines
13 KiB
318 lines
13 KiB
<template>
|
|
<div class="m-topnav">
|
|
<div class="back" style="cursor: pointer" @click="goBack()">
|
|
<img src="~@/assets/images/shuju/main/back.png" alt="/" />
|
|
</div>
|
|
<div class="title">{{ customerName }}数据智能分析平台</div>
|
|
<div class="selectArea" v-if="$route.path == '/dataBoard/satisfactionEval/index'">
|
|
<el-select @change="setSelectName" v-model="value" popper-class="selectPopClass">
|
|
<el-option v-for="(item, index) in options" v-if="item.agencyLevel === 'grid'" :key="item.value" :label="item.label" :value="item.value"/>
|
|
</el-select>
|
|
</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" :class="{ 'z-on': $route.path == '/dataBoard/renfang/index' }" @click="toPage('/dataBoard/renfang/index')">
|
|
<span>人房总览</span>
|
|
</div>
|
|
<div class="nav-item" :class="{ 'z-on': $route.path == '/dataBoard/sida/index' }" @click="toPage('/dataBoard/sida/index')">
|
|
<span>四大清单</span>
|
|
</div>
|
|
<div class="nav-item" :class="{ 'z-on': $route.path == '/dataBoard/fifteen/index' }" @click="toPage('/dataBoard/fifteen/index')">
|
|
<span>十五分钟生活圈</span>
|
|
</div>
|
|
</div>-->
|
|
<div class="nav-list">
|
|
<div class="nav-item" :class="{ 'z-on': $route.path.indexOf('/dataBoard/overview') != -1 }" @click="toPage('/dataBoard/overview/index')">
|
|
<span>概览</span>
|
|
</div>
|
|
<div class="nav-item" :class="{ 'z-on': $route.path.includes('/organizational') }" @click="toPage('/organizational/dangTree')">
|
|
<span>组织架构</span>
|
|
</div>
|
|
<div class="nav-item" :class="{ 'z-on': $route.path.indexOf('/dataBoard/renfang') != -1 }" @click="toPage('/dataBoard/renfang/index')">
|
|
<span>人房数据</span>
|
|
</div>
|
|
<div class="nav-item" :class="{ 'z-on': $route.path.includes('/satisfactionEval') }" @click="toPage('/dataBoard/satisfactionEval/index')">
|
|
<span>满意度评价</span>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="msg">
|
|
<div class="weather">
|
|
<img v-if="weather.weather == '小雨'" src="~@/assets/images/shuju/main/weather/xiaoyu.png" />
|
|
<img v-if="weather.weather == '中雨'" src="~@/assets/images/shuju/main/weather/zhongyu.png" />
|
|
<img v-if="weather.weather == '大雨'" src="~@/assets/images/shuju/main/weather/dayu.png" />
|
|
<img v-if="weather.weather == '雷雨'" src="~@/assets/images/shuju/main/weather/leiyu.png" />
|
|
<img v-if="weather.weather == '雷暴'" src="~@/assets/images/shuju/main/weather/leibao.png" />
|
|
<img v-if="weather.weather == '雨雪'" src="~@/assets/images/shuju/main/weather/yuxue.png" />
|
|
<img v-if="weather.weather == '阴'" src="~@/assets/images/shuju/main/weather/yin.png" />
|
|
<img v-if="weather.weather == '雾'" src="~@/assets/images/shuju/main/weather/wu.png" />
|
|
<img v-if="weather.weather == '风'" src="~@/assets/images/shuju/main/weather/feng.png" />
|
|
<img v-else-if="weather.weather == '雪'" src="~@/assets/images/shuju/main/weather/xue.png" />
|
|
<img v-else-if="weather.weather == '多云'" src="~@/assets/images/shuju/main/weather/duoyun.png" />
|
|
<img v-else src="~@/assets/images/shuju/main/weather/qing.png" />
|
|
<div>{{ weather.temperature }}℃</div>
|
|
<div>{{ weather.weather }}</div>
|
|
</div>-->
|
|
<div class="date">
|
|
<div class="dateFlex">
|
|
<div class="dateFlex_mw">
|
|
<div class="date-month">{{ showMonth }}</div>
|
|
<div class="date-week">{{ showWeek }}</div>
|
|
</div>
|
|
<div class="date-time">{{ showTime }}</div>
|
|
</div>
|
|
</div>
|
|
<!-- </div> -->
|
|
<!-- <nav v-if="false" class="m-navbar">
|
|
<div class="navbar__header">
|
|
<h1 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>
|
|
</h1>
|
|
</div>
|
|
<div class="navbar__body">
|
|
<el-menu class="navbar__menu mr-auto" mode="horizontal">
|
|
<el-menu-item index="1" @click="$store.state.sidebarFold = !$store.state.sidebarFold">
|
|
<svg class="icon-svg navbar__icon-menu navbar__icon-menu--switch" aria-hidden="true">
|
|
<use xlink:href="#icon-outdent"></use>
|
|
</svg>
|
|
</el-menu-item>
|
|
<el-menu-item index="2" @click="refresh()">
|
|
<svg class="icon-svg navbar__icon-menu" aria-hidden="true">
|
|
<use xlink:href="#icon-sync"></use>
|
|
</svg>
|
|
</el-menu-item>
|
|
</el-menu>
|
|
<el-menu :default-active="$store.state.mainShuju.activeName" :unique-opened="true" :collapseTransition="false" mode="horizontal" class="navbar__menu mr-auto z-div">
|
|
<el-menu-item index="index" @click="toIndexPage">
|
|
<span>首页</span>
|
|
</el-menu-item>
|
|
<template v-for="(menu, idx) in $store.state.mainShuju.menuList">
|
|
<li class="sub-menu" :class="$store.state.mainShuju.activeName == menu.id ? 'z-on' : ''" v-if="menu.children" :key="menu.id" @click="gotoRouteHandle(menu.id, idx)">
|
|
<span>{{ menu.name }}</span>
|
|
<div class="sub-menu-list">
|
|
<div :class="$store.state.mainShuju.activeName == subMenu.id ? 'z-on' : ''" :key="subMenu.id" @click="gotoRouteHandle(subMenu.id, subIndex)" v-for="(subMenu, subIndex) in menu.children">
|
|
{{ subMenu.name }}
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<el-menu-item v-else :key="menu.id" :menu="menu" :index="menu.id" @click="gotoRouteHandle(menu.id, idx)">
|
|
<span>{{ menu.name }}</span>
|
|
</el-menu-item>
|
|
</template>
|
|
</el-menu>
|
|
<el-menu class="navbar__menu" mode="horizontal"> -->
|
|
<!-- <el-menu-item index="1">
|
|
<el-dropdown placement="bottom"
|
|
:show-timeout="0">
|
|
<el-button size="mini">{{ $t('_lang') }}</el-button>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item v-for="(val, key) in i18nMessages"
|
|
:key="key"
|
|
@click.native="$i18n.locale = key">{{ val._lang }}</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</el-menu-item> -->
|
|
<!-- <el-menu-item index="2">
|
|
<a href="//www.renren.io/"
|
|
target="_blank">
|
|
<svg class="icon-svg navbar__icon-menu"
|
|
aria-hidden="true">
|
|
<use xlink:href="#icon-earth"></use>
|
|
</svg>
|
|
</a>
|
|
</el-menu-item> -->
|
|
<!-- <el-menu-item index="3" @click="fullscreenHandle()">
|
|
<svg class="icon-svg navbar__icon-menu" aria-hidden="true">
|
|
<use xlink:href="#icon-fullscreen"></use>
|
|
</svg>
|
|
</el-menu-item>
|
|
<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" />
|
|
<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()">{{ $t("updatePassword.title") }}</el-dropdown-item>
|
|
<el-dropdown-item @click.native="logoutHandle()">{{ $t("logout") }}</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</el-menu-item>
|
|
</el-menu> -->
|
|
<!-- </div> -->
|
|
<!-- 弹窗, 修改密码 -->
|
|
<!-- <update-password-work v-if="updatePassowrdVisible" ref="updatePassowrd"></update-password-work> -->
|
|
<!-- </nav> -->
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { messages } from "@/i18n";
|
|
import UpdatePasswordWork from "@/views/main-navbar-update-password-work";
|
|
import dateFormat from "dai-js/tools/dateFormat";
|
|
import nextTick from "dai-js/tools/nextTick";
|
|
import { requestGet } from "@/js/dai/request";
|
|
|
|
export default {
|
|
inject: ["refresh"],
|
|
data() {
|
|
return {
|
|
showHeader: true,
|
|
i18nMessages: messages,
|
|
updatePassowrdVisible: false,
|
|
customerName: "",
|
|
showWeek: "",
|
|
showTime: "",
|
|
showMonth: "",
|
|
value: 0,
|
|
weather: {
|
|
weather: "晴",
|
|
temperature: "--",
|
|
},
|
|
options: [],
|
|
};
|
|
},
|
|
components: {
|
|
UpdatePasswordWork,
|
|
},
|
|
created() {
|
|
this.changeCustomerName();
|
|
const customerId = localStorage.getItem("customerId");
|
|
let siteconfigElement = window.SITE_CONFIG["menuShujuList"];
|
|
//暂时 亿联街道和 微笑崂山显示 社区治理-》多元化菜单
|
|
if ("04c0d396e298f13e57aa5904a657eaa6" != customerId && "3fdd0380deff5b30f45376cdf995d1c1" != customerId) {
|
|
for (let index in siteconfigElement) {
|
|
if (siteconfigElement[index].id == "6") {
|
|
let newMenuArr = siteconfigElement[index].children.filter((item) => item.id !== "duoyuanfuwufenxi");
|
|
siteconfigElement[index].children = newMenuArr;
|
|
}
|
|
}
|
|
}
|
|
this.$store.state.mainShuju.menuList = siteconfigElement;
|
|
const pollTime = async () => {
|
|
this.computeCurrentTime();
|
|
await nextTick(1000);
|
|
pollTime();
|
|
};
|
|
pollTime();
|
|
// this.getWeatherData();
|
|
},
|
|
computed: {},
|
|
mounted() {
|
|
this.getOrgList();
|
|
},
|
|
methods: {
|
|
getChooseLabel(key) {
|
|
const name = this.options.filter((item) => item.value === key)[0].level;
|
|
return name;
|
|
},
|
|
|
|
getOrgList() {
|
|
let params = {};
|
|
if (this.options.length) {
|
|
params = { orgId: this.value, level: this.getChooseLabel(this.value) };
|
|
}
|
|
console.log(params);
|
|
this.$http.post(`/gov/org/agency/maporg`, params).then(async ({ data: { data } }) => {
|
|
console.log(data);
|
|
this.value = data.id;
|
|
this.$store.dispatch("chooseArea/chooseName", {
|
|
orgId: data.id,
|
|
level: data.level,
|
|
});
|
|
let children = await this.dealTreeData(data.children);
|
|
if (data.parentId) {
|
|
this.options = [
|
|
{
|
|
...data,
|
|
value: data.parentId,
|
|
label: data.parentName,
|
|
},
|
|
{
|
|
...data,
|
|
value: data.id,
|
|
label: data.name,
|
|
},
|
|
...children,
|
|
];
|
|
} else {
|
|
this.options = [
|
|
{
|
|
...data,
|
|
value: data.id,
|
|
label: data.name,
|
|
},
|
|
...children,
|
|
];
|
|
}
|
|
});
|
|
},
|
|
dealTreeData(treeData, level = 0) {
|
|
const data = treeData.map((item) => ({
|
|
...item,
|
|
value: item.id,
|
|
label: item.name,
|
|
children: item.children && item.children.length ? this.dealTreeData(item.children, level++) : null,
|
|
}));
|
|
return data;
|
|
},
|
|
setSelectName(index) {
|
|
/* this.$store.dispatch("chooseArea/chooseName", {
|
|
orgId: this.options[index].id,
|
|
level: this.options[index].level
|
|
});*/
|
|
this.getOrgList();
|
|
},
|
|
computeCurrentTime() {
|
|
// let now = new Date();
|
|
// let wk = now.getDay();
|
|
// this.showWeek = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"][wk];
|
|
// this.showTime = dateFormat(now, "yyyy-MM-dd hh:mm:ss");
|
|
this.showMonth = this.$moment().format("MMM Do");
|
|
this.showWeek = this.$moment().format("dddd");
|
|
this.showTime = this.$moment().format("LT");
|
|
},
|
|
toPage(path) {
|
|
this.$router.push({
|
|
path,
|
|
});
|
|
},
|
|
toIndexPage() {
|
|
this.$router.replace("/");
|
|
},
|
|
|
|
goBack() {
|
|
this.$router.push("/main/home");
|
|
},
|
|
// 通过menuId与动态(菜单)路由进行匹配跳转至指定路由
|
|
gotoRouteHandle(menuId, idx) {
|
|
var route = window.SITE_CONFIG["dynamicMenuRoutesShuju"].filter((item) => item.meta.menuId === menuId)[0];
|
|
if (route) {
|
|
this.$router.push({
|
|
name: route.name,
|
|
});
|
|
this.$store.state.mainShuju.activeName = menuId;
|
|
}
|
|
},
|
|
changeCustomerName() {
|
|
this.customerName = localStorage.getItem("customerNameDataBoard") || "数据分析可视化平台";
|
|
},
|
|
async getWeatherData() {
|
|
const url = "https://restapi.amap.com/v3/weather/weatherInfo?key=8c87678f34ce9e8e23245c5161991c4e";
|
|
const { data, code, msg } = await requestGet(url, {
|
|
city: this.$store.state.user.areaCode,
|
|
});
|
|
if (code === 0) {
|
|
this.weather = data.lives[0];
|
|
} else {
|
|
// return this.$message.error("网络错误");
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped src="@/assets/scss/dataBoardMain.scss"></style>
|
|
|