|
@@ -8,10 +8,7 @@
|
|
|
<!--幻灯片-->
|
|
<!--幻灯片-->
|
|
|
<div class="dashboard-swipe ">
|
|
<div class="dashboard-swipe ">
|
|
|
<van-swipe :autoplay="11000">
|
|
<van-swipe :autoplay="11000">
|
|
|
- <van-swipe-item
|
|
|
|
|
- v-for="(swipe, index) in swipes"
|
|
|
|
|
- :key="index"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <van-swipe-item v-for="(swipe, index) in swipes" :key="index">
|
|
|
<img v-lazy="swipe.image||blankImage">
|
|
<img v-lazy="swipe.image||blankImage">
|
|
|
</van-swipe-item>
|
|
</van-swipe-item>
|
|
|
</van-swipe>
|
|
</van-swipe>
|
|
@@ -20,36 +17,15 @@
|
|
|
<!--通知-->
|
|
<!--通知-->
|
|
|
<template v-if="noticeList && noticeList.length > 0">
|
|
<template v-if="noticeList && noticeList.length > 0">
|
|
|
<div class="dashboard-notice" style="height: 52px;background: #F3F3F3;">
|
|
<div class="dashboard-notice" style="height: 52px;background: #F3F3F3;">
|
|
|
- <van-swipe
|
|
|
|
|
- :autoplay="6000"
|
|
|
|
|
- :height="44"
|
|
|
|
|
- :show-indicators="false"
|
|
|
|
|
- :initial-swipe="initialNotice()"
|
|
|
|
|
- style="height:44px;"
|
|
|
|
|
- vertical
|
|
|
|
|
- >
|
|
|
|
|
- <van-swipe-item
|
|
|
|
|
- v-for="(notice, index) in noticeList"
|
|
|
|
|
- :key="index"
|
|
|
|
|
- >
|
|
|
|
|
- <van-notice-bar
|
|
|
|
|
- background="#ffffff"
|
|
|
|
|
- style="height:44px;"
|
|
|
|
|
- color="#979797"
|
|
|
|
|
- mode="link"
|
|
|
|
|
- @click="onNotice(notice)"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <van-swipe :autoplay="6000" :height="44" :show-indicators="false" :initial-swipe="initialNotice()"
|
|
|
|
|
+ style="height:44px;" vertical>
|
|
|
|
|
+ <van-swipe-item v-for="(notice, index) in noticeList" :key="index">
|
|
|
|
|
+ <van-notice-bar background="#ffffff" style="height:44px;" color="#979797" mode="link"
|
|
|
|
|
+ @click="onNotice(notice)">
|
|
|
<span class="ibps-pl-10"> {{ notice.title }}</span>
|
|
<span class="ibps-pl-10"> {{ notice.title }}</span>
|
|
|
<template #left-icon>
|
|
<template #left-icon>
|
|
|
- <ibps-avatar
|
|
|
|
|
- icon="volume-o"
|
|
|
|
|
- bg-color="#3396FB"
|
|
|
|
|
- color="#ffffff"
|
|
|
|
|
- radius="8"
|
|
|
|
|
- width="24"
|
|
|
|
|
- height="24"
|
|
|
|
|
- icon-size="12"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <ibps-avatar icon="volume-o" bg-color="#3396FB" color="#ffffff" radius="8" width="24" height="24"
|
|
|
|
|
+ icon-size="12" />
|
|
|
</template>
|
|
</template>
|
|
|
</van-notice-bar>
|
|
</van-notice-bar>
|
|
|
</van-swipe-item>
|
|
</van-swipe-item>
|
|
@@ -62,24 +38,12 @@
|
|
|
|
|
|
|
|
<!--栏目-->
|
|
<!--栏目-->
|
|
|
<template v-if="dashboards && dashboards.length >0">
|
|
<template v-if="dashboards && dashboards.length >0">
|
|
|
- <van-collapse
|
|
|
|
|
- v-model="activeDashboards"
|
|
|
|
|
- :border="false"
|
|
|
|
|
- >
|
|
|
|
|
- <van-collapse-item
|
|
|
|
|
- v-for="(dashboard,index) in dashboards"
|
|
|
|
|
- :key="dashboard[aliasKey]+index"
|
|
|
|
|
- :name="dashboard[aliasKey]"
|
|
|
|
|
- :border="false"
|
|
|
|
|
- :is-link="false"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <van-collapse v-model="activeDashboards" :border="false">
|
|
|
|
|
+ <van-collapse-item v-for="(dashboard,index) in dashboards" :key="dashboard[aliasKey]+index"
|
|
|
|
|
+ :name="dashboard[aliasKey]" :border="false" :is-link="false">
|
|
|
<template #title>
|
|
<template #title>
|
|
|
<h2 class="menus-title">
|
|
<h2 class="menus-title">
|
|
|
- <van-icon
|
|
|
|
|
- :name="dashboard.icon"
|
|
|
|
|
- :color="dashboard.iconBgColor"
|
|
|
|
|
- class-prefix="ibps-icon"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <van-icon :name="dashboard.icon" :color="dashboard.iconBgColor" class-prefix="ibps-icon" />
|
|
|
{{ getText(dashboard) }}
|
|
{{ getText(dashboard) }}
|
|
|
<span class="icon-wrapper">
|
|
<span class="icon-wrapper">
|
|
|
<van-icon :name="getIcon(dashboard.alias) ?'arrow-down':'arrow-up'" class="icon-displacement" />
|
|
<van-icon :name="getIcon(dashboard.alias) ?'arrow-down':'arrow-up'" class="icon-displacement" />
|
|
@@ -87,23 +51,11 @@
|
|
|
</h2>
|
|
</h2>
|
|
|
</template>
|
|
</template>
|
|
|
<van-grid :column-num="4" :border="false" class="avatar-grid">
|
|
<van-grid :column-num="4" :border="false" class="avatar-grid">
|
|
|
- <van-grid-item
|
|
|
|
|
- v-for="menu in dashboard[childrenKey]"
|
|
|
|
|
- :key="menu[aliasKey]"
|
|
|
|
|
- :badge="getBadge(menu)"
|
|
|
|
|
- :text="getText(menu)"
|
|
|
|
|
- @click.native="onClick(menu)"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <van-grid-item v-for="menu in dashboard[childrenKey]" :key="menu[aliasKey]" :badge="getBadge(menu)"
|
|
|
|
|
+ :text="getText(menu)" @click.native="onClick(menu)">
|
|
|
<template #icon>
|
|
<template #icon>
|
|
|
- <ibps-avatar
|
|
|
|
|
- :icon="menu.icon"
|
|
|
|
|
- :text="getText(menu)"
|
|
|
|
|
- :bg-color="menu.iconBgColor"
|
|
|
|
|
- :color="menu.iconFontColor"
|
|
|
|
|
- icon-prefix="ibps-icon"
|
|
|
|
|
- radius="17"
|
|
|
|
|
- class="ibps-mb-10 avatar-layout"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <ibps-avatar :icon="menu.icon" :text="getText(menu)" :bg-color="menu.iconBgColor"
|
|
|
|
|
+ :color="menu.iconFontColor" icon-prefix="ibps-icon" radius="17" class="ibps-mb-10 avatar-layout" />
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
</van-grid-item>
|
|
</van-grid-item>
|
|
@@ -112,24 +64,13 @@
|
|
|
</van-collapse>
|
|
</van-collapse>
|
|
|
</template>
|
|
</template>
|
|
|
<div v-else>
|
|
<div v-else>
|
|
|
- <van-empty
|
|
|
|
|
- v-if="emptyData"
|
|
|
|
|
- :type="resultType"
|
|
|
|
|
- :description="resultMessage"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <van-empty v-if="emptyData" :type="resultType" :description="resultMessage" />
|
|
|
<!--骨架屏-->
|
|
<!--骨架屏-->
|
|
|
<template v-else>
|
|
<template v-else>
|
|
|
- <div
|
|
|
|
|
- v-for="i in 8"
|
|
|
|
|
- :key="i"
|
|
|
|
|
- class="van-hairline--bottom dashboard-menus empty-data van-skeleton--animate"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <div v-for="i in 8" :key="i" class="van-hairline--bottom dashboard-menus empty-data van-skeleton--animate">
|
|
|
<h2 class="menus-title"> </h2>
|
|
<h2 class="menus-title"> </h2>
|
|
|
<van-grid :column-num="4" :border="false">
|
|
<van-grid :column-num="4" :border="false">
|
|
|
- <van-grid-item
|
|
|
|
|
- v-for="j in 8"
|
|
|
|
|
- :key="j"
|
|
|
|
|
- >
|
|
|
|
|
|
|
+ <van-grid-item v-for="j in 8" :key="j">
|
|
|
<template #icon>
|
|
<template #icon>
|
|
|
<div class="avatar avatar--rounded"> </div>
|
|
<div class="avatar avatar--rounded"> </div>
|
|
|
</template>
|
|
</template>
|
|
@@ -142,119 +83,95 @@
|
|
|
</template>
|
|
</template>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
- <notice-dialog
|
|
|
|
|
- :id="noticeId"
|
|
|
|
|
- :visible="noticeVisible"
|
|
|
|
|
- readonly
|
|
|
|
|
- @close="visible => noticeVisible = visible"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <notice-dialog :id="noticeId" :visible="noticeVisible" readonly @close="visible => noticeVisible = visible" />
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
<script>
|
|
<script>
|
|
|
-import Vue from 'vue'
|
|
|
|
|
-import { getMenuData, getInfoCount } from '@/api/platform/auth/appres'
|
|
|
|
|
-import { queryPageList } from '@/api/platform/system/news'
|
|
|
|
|
-import ActionUtils from '@/utils/action'
|
|
|
|
|
-// import navbar from '@/mixins/navbar'
|
|
|
|
|
-import { Lazyload } from 'vant'
|
|
|
|
|
-Vue.use(Lazyload)
|
|
|
|
|
-import TreeUtils from '@/utils/tree'
|
|
|
|
|
-import i18n from '@/utils/i18n' // Internationalization 国际化
|
|
|
|
|
-import IbpsAvatar from '@/components/ibps-avatar'
|
|
|
|
|
-import NoticeDialog from '@/views/platform/notice/edit'
|
|
|
|
|
-// 透明图片
|
|
|
|
|
-const BLANK = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
|
|
|
|
|
-export default {
|
|
|
|
|
- name: 'dashboard',
|
|
|
|
|
- // mixins: [navbar],
|
|
|
|
|
- components: {
|
|
|
|
|
- IbpsAvatar,
|
|
|
|
|
- NoticeDialog
|
|
|
|
|
- },
|
|
|
|
|
- data() {
|
|
|
|
|
- const { userInfo } = this.$store.getters
|
|
|
|
|
- return {
|
|
|
|
|
- userInfo,
|
|
|
|
|
- idKey: 'id',
|
|
|
|
|
- aliasKey: 'alias',
|
|
|
|
|
- labelKey: 'name',
|
|
|
|
|
- parentIdKey: 'parentId',
|
|
|
|
|
- childrenKey: 'children',
|
|
|
|
|
- urlKey: 'defaultUrl',
|
|
|
|
|
- dashboards: [],
|
|
|
|
|
- emptyData: false,
|
|
|
|
|
- resultType: 'empty',
|
|
|
|
|
- resultMessage: '没有应用,请联系管理员',
|
|
|
|
|
- countInfo: {}, // 右上角图标
|
|
|
|
|
- swipes: [],
|
|
|
|
|
- blankImage: BLANK,
|
|
|
|
|
-
|
|
|
|
|
- noticeList: [],
|
|
|
|
|
- emptyNoticeData: false,
|
|
|
|
|
- activeDashboards: [],
|
|
|
|
|
- noticeVisible: false,
|
|
|
|
|
- noticeId: ''
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- created() {
|
|
|
|
|
- this.loadData()
|
|
|
|
|
- },
|
|
|
|
|
- methods: {
|
|
|
|
|
- getIcon(data) {
|
|
|
|
|
- return this.activeDashboards.includes(data)
|
|
|
|
|
- },
|
|
|
|
|
- changeIcon(data) {
|
|
|
|
|
- console.info(data, this.activeDashboards)
|
|
|
|
|
|
|
+ import Vue from 'vue'
|
|
|
|
|
+ import { getMenuData, getInfoCount } from '@/api/platform/auth/appres'
|
|
|
|
|
+ import { queryPageList } from '@/api/platform/system/news'
|
|
|
|
|
+ import ActionUtils from '@/utils/action'
|
|
|
|
|
+ // import navbar from '@/mixins/navbar'
|
|
|
|
|
+ import { Lazyload } from 'vant'
|
|
|
|
|
+ Vue.use(Lazyload)
|
|
|
|
|
+ import TreeUtils from '@/utils/tree'
|
|
|
|
|
+ import i18n from '@/utils/i18n' // Internationalization 国际化
|
|
|
|
|
+ import IbpsAvatar from '@/components/ibps-avatar'
|
|
|
|
|
+ import NoticeDialog from '@/views/platform/notice/edit'
|
|
|
|
|
+ // 透明图片
|
|
|
|
|
+ const BLANK = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
|
|
|
|
|
+ export default {
|
|
|
|
|
+ name: 'dashboard',
|
|
|
|
|
+ // mixins: [navbar],
|
|
|
|
|
+ components: {
|
|
|
|
|
+ IbpsAvatar,
|
|
|
|
|
+ NoticeDialog
|
|
|
},
|
|
},
|
|
|
- svgName(name) {
|
|
|
|
|
- return `#${name}`
|
|
|
|
|
- },
|
|
|
|
|
- getImage(menu) {
|
|
|
|
|
- if (menu.iconType === 'image') {
|
|
|
|
|
- return menu.icon
|
|
|
|
|
|
|
+ data() {
|
|
|
|
|
+ const { userInfo } = this.$store.getters
|
|
|
|
|
+ return {
|
|
|
|
|
+ userInfo,
|
|
|
|
|
+ idKey: 'id',
|
|
|
|
|
+ aliasKey: 'alias',
|
|
|
|
|
+ labelKey: 'name',
|
|
|
|
|
+ parentIdKey: 'parentId',
|
|
|
|
|
+ childrenKey: 'children',
|
|
|
|
|
+ urlKey: 'defaultUrl',
|
|
|
|
|
+ dashboards: [],
|
|
|
|
|
+ emptyData: false,
|
|
|
|
|
+ resultType: 'empty',
|
|
|
|
|
+ resultMessage: '没有应用,请联系管理员',
|
|
|
|
|
+ countInfo: {}, // 右上角图标
|
|
|
|
|
+ swipes: [],
|
|
|
|
|
+ blankImage: BLANK,
|
|
|
|
|
+
|
|
|
|
|
+ noticeList: [],
|
|
|
|
|
+ emptyNoticeData: false,
|
|
|
|
|
+ activeDashboards: [],
|
|
|
|
|
+ noticeVisible: false,
|
|
|
|
|
+ noticeId: ''
|
|
|
}
|
|
}
|
|
|
- return
|
|
|
|
|
- },
|
|
|
|
|
- getText(menu) {
|
|
|
|
|
- return i18n.generateTitle(menu[this.aliasKey], menu[this.labelKey])
|
|
|
|
|
},
|
|
},
|
|
|
- getBadge(menu) {
|
|
|
|
|
- const info = this.countInfo[menu[this.aliasKey]]
|
|
|
|
|
- if (this.$utils.isNotEmpty(info)) { return info > 99 ? '99+' : info === '0' ? '' : info }
|
|
|
|
|
|
|
+ created() {
|
|
|
|
|
+ this.loadData()
|
|
|
},
|
|
},
|
|
|
- loadData() {
|
|
|
|
|
- this.loadMenus()
|
|
|
|
|
- this.loadCountInfo()
|
|
|
|
|
- this.loadNotice()
|
|
|
|
|
- },
|
|
|
|
|
- loadMenus() {
|
|
|
|
|
- this.swipes = [{}]
|
|
|
|
|
- this.swipes = [
|
|
|
|
|
- { image: './images/swipes/banner1.png' },
|
|
|
|
|
- { image: './images/swipes/banner2.png' },
|
|
|
|
|
- { image: './images/swipes/banner3.png' }
|
|
|
|
|
- ]
|
|
|
|
|
- if (this.userInfo.employee.jiNengZhiCheng !== 'inside' && this.userInfo.employee.isSuper === 'N') {
|
|
|
|
|
- this.dashboards = []
|
|
|
|
|
- if (this.$utils.isNotEmpty(this.dashboards)) {
|
|
|
|
|
- const activeDashboards = []
|
|
|
|
|
- this.dashboards.forEach((d) => {
|
|
|
|
|
- activeDashboards.push(d[this.aliasKey])
|
|
|
|
|
- })
|
|
|
|
|
- this.activeDashboards = activeDashboards
|
|
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ getIcon(data) {
|
|
|
|
|
+ return this.activeDashboards.includes(data)
|
|
|
|
|
+ },
|
|
|
|
|
+ changeIcon(data) {
|
|
|
|
|
+ console.info(data, this.activeDashboards)
|
|
|
|
|
+ },
|
|
|
|
|
+ svgName(name) {
|
|
|
|
|
+ return `#${name}`
|
|
|
|
|
+ },
|
|
|
|
|
+ getImage(menu) {
|
|
|
|
|
+ if (menu.iconType === 'image') {
|
|
|
|
|
+ return menu.icon
|
|
|
}
|
|
}
|
|
|
- this.emptyData = !(this.dashboards.length > 0)
|
|
|
|
|
- } else {
|
|
|
|
|
- getMenuData().then(response => {
|
|
|
|
|
- const data = response.data
|
|
|
|
|
- const listData = data.filter((d) => {
|
|
|
|
|
- return d.id !== '0'
|
|
|
|
|
- })
|
|
|
|
|
- this.dashboards = TreeUtils.transformToTreeFormat(listData, {
|
|
|
|
|
- idKey: this.idKey,
|
|
|
|
|
- parentIdKey: this.parentIdKey,
|
|
|
|
|
- childrenKey: this.childrenKey
|
|
|
|
|
- })
|
|
|
|
|
|
|
+ return
|
|
|
|
|
+ },
|
|
|
|
|
+ getText(menu) {
|
|
|
|
|
+ return i18n.generateTitle(menu[this.aliasKey], menu[this.labelKey])
|
|
|
|
|
+ },
|
|
|
|
|
+ getBadge(menu) {
|
|
|
|
|
+ const info = this.countInfo[menu[this.aliasKey]]
|
|
|
|
|
+ if (this.$utils.isNotEmpty(info)) { return info > 99 ? '99+' : info === '0' ? '' : info }
|
|
|
|
|
+ },
|
|
|
|
|
+ loadData() {
|
|
|
|
|
+ this.loadMenus()
|
|
|
|
|
+ this.loadCountInfo()
|
|
|
|
|
+ this.loadNotice()
|
|
|
|
|
+ },
|
|
|
|
|
+ loadMenus() {
|
|
|
|
|
+ this.swipes = [{}]
|
|
|
|
|
+ this.swipes = [
|
|
|
|
|
+ { image: './images/swipes/banner1.png' },
|
|
|
|
|
+ { image: './images/swipes/banner2.png' },
|
|
|
|
|
+ { image: './images/swipes/banner3.png' }
|
|
|
|
|
+ ]
|
|
|
|
|
+ if (this.userInfo.employee.jiNengZhiCheng !== 'inside' && this.userInfo.employee.isSuper === 'N') {
|
|
|
|
|
+ this.dashboards = []
|
|
|
if (this.$utils.isNotEmpty(this.dashboards)) {
|
|
if (this.$utils.isNotEmpty(this.dashboards)) {
|
|
|
const activeDashboards = []
|
|
const activeDashboards = []
|
|
|
this.dashboards.forEach((d) => {
|
|
this.dashboards.forEach((d) => {
|
|
@@ -262,179 +179,216 @@ export default {
|
|
|
})
|
|
})
|
|
|
this.activeDashboards = activeDashboards
|
|
this.activeDashboards = activeDashboards
|
|
|
}
|
|
}
|
|
|
- this.emptyData = !(listData.length > 0)
|
|
|
|
|
- }).catch((e) => {
|
|
|
|
|
- this.emptyData = true
|
|
|
|
|
- this.resultType = 'error'
|
|
|
|
|
- this.resultMessage = e.message
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- loadCountInfo() {
|
|
|
|
|
- getInfoCount().then(response => {
|
|
|
|
|
- const data = response.data
|
|
|
|
|
- const countInfo = {}
|
|
|
|
|
- data.forEach((d) => {
|
|
|
|
|
- countInfo[d.alias] = d.dataText
|
|
|
|
|
- })
|
|
|
|
|
- this.countInfo = countInfo
|
|
|
|
|
- }).catch((e) => {
|
|
|
|
|
- })
|
|
|
|
|
- },
|
|
|
|
|
-
|
|
|
|
|
- loadNotice() {
|
|
|
|
|
- this.emptyNoticeData = false
|
|
|
|
|
- const params = ActionUtils.formatParams({ status: 'publish' }, { page: 1, limit: 5 })
|
|
|
|
|
- queryPageList(params).then(response => {
|
|
|
|
|
- this.noticeList = response.data.dataResult
|
|
|
|
|
- this.emptyNoticeData = !(this.noticeList.length > 0)
|
|
|
|
|
- }).catch((e) => {
|
|
|
|
|
- this.emptyNoticeData = true
|
|
|
|
|
- })
|
|
|
|
|
- },
|
|
|
|
|
- initialNotice() {
|
|
|
|
|
- return Math.floor((Math.random() * this.noticeList.length))
|
|
|
|
|
- },
|
|
|
|
|
- onClick(menu) {
|
|
|
|
|
- const url = menu[this.urlKey]
|
|
|
|
|
- if (this.$utils.isNotEmpty(url)) {
|
|
|
|
|
- if (/^https:\/\/|http:\/\//.test(url)) {
|
|
|
|
|
- this.$utils.open(url)
|
|
|
|
|
|
|
+ this.emptyData = !(this.dashboards.length > 0)
|
|
|
} else {
|
|
} else {
|
|
|
- this.$router.push({ path: url })
|
|
|
|
|
- }
|
|
|
|
|
- } else {
|
|
|
|
|
- // 判断是否有下级菜单如果有
|
|
|
|
|
- if (this.$utils.isNotEmpty(menu.children)) {
|
|
|
|
|
- this.$router.push({
|
|
|
|
|
- name: 'next-menu',
|
|
|
|
|
- params: {
|
|
|
|
|
- title: menu.name,
|
|
|
|
|
- menus: menu.children
|
|
|
|
|
|
|
+ getMenuData().then(response => {
|
|
|
|
|
+ const data = response.data
|
|
|
|
|
+ const listData = data.filter((d) => {
|
|
|
|
|
+ return d.id !== '0'
|
|
|
|
|
+ })
|
|
|
|
|
+ this.dashboards = TreeUtils.transformToTreeFormat(listData, {
|
|
|
|
|
+ idKey: this.idKey,
|
|
|
|
|
+ parentIdKey: this.parentIdKey,
|
|
|
|
|
+ childrenKey: this.childrenKey
|
|
|
|
|
+ })
|
|
|
|
|
+ if (this.$utils.isNotEmpty(this.dashboards)) {
|
|
|
|
|
+ const activeDashboards = []
|
|
|
|
|
+ this.dashboards.forEach((d) => {
|
|
|
|
|
+ activeDashboards.push(d[this.aliasKey])
|
|
|
|
|
+ })
|
|
|
|
|
+ this.activeDashboards = activeDashboards
|
|
|
}
|
|
}
|
|
|
|
|
+ this.emptyData = !(listData.length > 0)
|
|
|
|
|
+ }).catch((e) => {
|
|
|
|
|
+ this.emptyData = true
|
|
|
|
|
+ this.resultType = 'error'
|
|
|
|
|
+ this.resultMessage = e.message
|
|
|
})
|
|
})
|
|
|
- } else {
|
|
|
|
|
- this.$notify({
|
|
|
|
|
- type: 'danger',
|
|
|
|
|
- message: '未配置菜单的url路径,请在PC后台配置!'
|
|
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ loadCountInfo() {
|
|
|
|
|
+ getInfoCount().then(response => {
|
|
|
|
|
+ const data = response.data
|
|
|
|
|
+ const countInfo = {}
|
|
|
|
|
+ data.forEach((d) => {
|
|
|
|
|
+ countInfo[d.alias] = d.dataText
|
|
|
})
|
|
})
|
|
|
|
|
+ this.countInfo = countInfo
|
|
|
|
|
+ }).catch((e) => {
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+
|
|
|
|
|
+ loadNotice() {
|
|
|
|
|
+ this.emptyNoticeData = false
|
|
|
|
|
+ const params = ActionUtils.formatParams({ status: 'publish' }, { page: 1, limit: 5 })
|
|
|
|
|
+ queryPageList(params).then(response => {
|
|
|
|
|
+ this.noticeList = response.data.dataResult
|
|
|
|
|
+ this.emptyNoticeData = !(this.noticeList.length > 0)
|
|
|
|
|
+ }).catch((e) => {
|
|
|
|
|
+ this.emptyNoticeData = true
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ initialNotice() {
|
|
|
|
|
+ return Math.floor((Math.random() * this.noticeList.length))
|
|
|
|
|
+ },
|
|
|
|
|
+ onClick(menu) {
|
|
|
|
|
+ const url = (menu.alias == "myTest" ? "/bpmn/myTest/index" : menu[this.urlKey])
|
|
|
|
|
+ // const url = menu[this.urlKey]
|
|
|
|
|
+ console.log("url", url);
|
|
|
|
|
+ if (this.$utils.isNotEmpty(url)) {
|
|
|
|
|
+ if (/^https:\/\/|http:\/\//.test(url)) {
|
|
|
|
|
+ this.$utils.open(url)
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$router.push({ path: url })
|
|
|
|
|
+ }
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 判断是否有下级菜单如果有
|
|
|
|
|
+ if (this.$utils.isNotEmpty(menu.children)) {
|
|
|
|
|
+ this.$router.push({
|
|
|
|
|
+ name: 'next-menu',
|
|
|
|
|
+ params: {
|
|
|
|
|
+ title: menu.name,
|
|
|
|
|
+ menus: menu.children
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.$notify({
|
|
|
|
|
+ type: 'danger',
|
|
|
|
|
+ message: '未配置菜单的url路径,请在PC后台配置!'
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
+ },
|
|
|
|
|
+ onNotice(item) {
|
|
|
|
|
+ this.noticeId = item.id
|
|
|
|
|
+ this.noticeVisible = true
|
|
|
|
|
+ // this.$router.push({
|
|
|
|
|
+ // name: 'noticeDetail',
|
|
|
|
|
+ // query: {
|
|
|
|
|
+ // id: item.id
|
|
|
|
|
+ // }
|
|
|
|
|
+ // })
|
|
|
}
|
|
}
|
|
|
- },
|
|
|
|
|
- onNotice(item) {
|
|
|
|
|
- this.noticeId = item.id
|
|
|
|
|
- this.noticeVisible = true
|
|
|
|
|
- // this.$router.push({
|
|
|
|
|
- // name: 'noticeDetail',
|
|
|
|
|
- // query: {
|
|
|
|
|
- // id: item.id
|
|
|
|
|
- // }
|
|
|
|
|
- // })
|
|
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
-}
|
|
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
|
-.dashboard {
|
|
|
|
|
- .dashboard-menus{
|
|
|
|
|
- margin: 0 15px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .menus-title{
|
|
|
|
|
- margin: 0;
|
|
|
|
|
- font-weight: 600;
|
|
|
|
|
- font-size: 14px;
|
|
|
|
|
- }
|
|
|
|
|
- .van-grid-item__text{
|
|
|
|
|
- overflow: hidden;
|
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
|
- display: -webkit-box;
|
|
|
|
|
- -webkit-line-clamp: 1;
|
|
|
|
|
- -webkit-box-orient: vertical;
|
|
|
|
|
- }
|
|
|
|
|
- /**滚屏 */
|
|
|
|
|
- .dashboard-swipe {
|
|
|
|
|
- .van-swipe {
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
|
|
+ .dashboard {
|
|
|
|
|
+ .dashboard-menus {
|
|
|
|
|
+ margin: 0 15px;
|
|
|
}
|
|
}
|
|
|
- .van-swipe-item {
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- font-size: 20px;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
- line-height: 120px
|
|
|
|
|
- }
|
|
|
|
|
- .van-swipe-item:nth-child(even) {
|
|
|
|
|
- background-color: #f7f7f7;
|
|
|
|
|
- background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .menus-title {
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ font-weight: 600;
|
|
|
|
|
+ font-size: 14px;
|
|
|
}
|
|
}
|
|
|
- .van-swipe-item:nth-child(odd) {
|
|
|
|
|
- background-color: #f0f7fb;
|
|
|
|
|
- background: -webkit-linear-gradient(#f0f7fb, #f7f7f7);
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .van-grid-item__text {
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+ display: -webkit-box;
|
|
|
|
|
+ -webkit-line-clamp: 1;
|
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
}
|
|
}
|
|
|
- .van-swipe img {
|
|
|
|
|
|
|
+
|
|
|
|
|
+ /**滚屏 */
|
|
|
|
|
+ .dashboard-swipe {
|
|
|
|
|
+ .van-swipe {
|
|
|
|
|
+ cursor: pointer;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe-item {
|
|
|
|
|
+ color: #fff;
|
|
|
|
|
+ font-size: 20px;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ line-height: 120px
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe-item:nth-child(even) {
|
|
|
|
|
+ background-color: #f7f7f7;
|
|
|
|
|
+ background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe-item:nth-child(odd) {
|
|
|
|
|
+ background-color: #f0f7fb;
|
|
|
|
|
+ background: -webkit-linear-gradient(#f0f7fb, #f7f7f7);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe img {
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
height: 180px;
|
|
height: 180px;
|
|
|
display: block;
|
|
display: block;
|
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
pointer-events: none;
|
|
pointer-events: none;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
- }
|
|
|
|
|
- /**公告 */
|
|
|
|
|
- .dashboard-notice{
|
|
|
|
|
- .van-swipe-item {
|
|
|
|
|
|
|
+
|
|
|
|
|
+ /**公告 */
|
|
|
|
|
+ .dashboard-notice {
|
|
|
|
|
+ .van-swipe-item {
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
line-height: 36px
|
|
line-height: 36px
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe-item:nth-child(even) {
|
|
|
|
|
+ background-color: #f7f7f7;
|
|
|
|
|
+ background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .van-swipe-item:nth-child(odd) {
|
|
|
|
|
+ background-color: #f0f7fb;
|
|
|
|
|
+ background: -webkit-linear-gradient(#f0f7fb, #f7f7f7);
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
- .van-swipe-item:nth-child(even) {
|
|
|
|
|
- background-color: #f7f7f7;
|
|
|
|
|
- background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
- }
|
|
|
|
|
- .van-swipe-item:nth-child(odd) {
|
|
|
|
|
- background-color: #f0f7fb;
|
|
|
|
|
- background: -webkit-linear-gradient(#f0f7fb, #f7f7f7);
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .dashboard-notice__empty {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 36px;
|
|
|
|
|
+ background-color: #f2f3f5;
|
|
|
}
|
|
}
|
|
|
- }
|
|
|
|
|
|
|
|
|
|
- .dashboard-notice__empty{
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 36px;
|
|
|
|
|
- background-color: #f2f3f5;
|
|
|
|
|
- }
|
|
|
|
|
- .empty-data{
|
|
|
|
|
- .menus-title {
|
|
|
|
|
- background-color: #f7f7f7;
|
|
|
|
|
- background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
- width: 70px;
|
|
|
|
|
- margin:10px;
|
|
|
|
|
- height: 16px;
|
|
|
|
|
|
|
+ .empty-data {
|
|
|
|
|
+ .menus-title {
|
|
|
|
|
+ background-color: #f7f7f7;
|
|
|
|
|
+ background: -webkit-linear-gradient(#f7f7f7, #f0f7fb);
|
|
|
|
|
+ width: 70px;
|
|
|
|
|
+ margin: 10px;
|
|
|
|
|
+ height: 16px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .avatar {
|
|
|
|
|
+ width: 48px;
|
|
|
|
|
+ height: 48px;
|
|
|
|
|
+ background: #f9f9f9;
|
|
|
|
|
+ margin-bottom: 5px;
|
|
|
|
|
+ border-radius: 12px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .title {
|
|
|
|
|
+ width: 48px;
|
|
|
|
|
+ height: 16px;
|
|
|
|
|
+ background: #f9f9f9;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
- .avatar{
|
|
|
|
|
- width: 48px;
|
|
|
|
|
- height: 48px;
|
|
|
|
|
- background: #f9f9f9;
|
|
|
|
|
- margin-bottom:5px ;
|
|
|
|
|
- border-radius: 12px;
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .avatar-grid {
|
|
|
|
|
+ margin: -12px -16px;
|
|
|
}
|
|
}
|
|
|
- .title{
|
|
|
|
|
- width: 48px;
|
|
|
|
|
- height: 16px;
|
|
|
|
|
- background: #f9f9f9;
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .avatar-layout {
|
|
|
|
|
+ height: 50px;
|
|
|
|
|
+ width: 50px;
|
|
|
}
|
|
}
|
|
|
- }
|
|
|
|
|
- .avatar-grid{
|
|
|
|
|
- margin: -12px -16px;
|
|
|
|
|
- }
|
|
|
|
|
- .avatar-layout{
|
|
|
|
|
- height: 50px;
|
|
|
|
|
- width: 50px;
|
|
|
|
|
- }
|
|
|
|
|
- .icon-wrapper{
|
|
|
|
|
- position: relative;
|
|
|
|
|
- margin-left: 5px;
|
|
|
|
|
- .icon-displacement{
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- top: 1px;
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .icon-wrapper {
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ margin-left: 5px;
|
|
|
|
|
+
|
|
|
|
|
+ .icon-displacement {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 1px;
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
-}
|
|
|
|
|
-</style>
|
|
|
|
|
|
|
+</style>
|