Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
4b496d79 by 任超
Options

style:首页完成修改

1 parent 6b2f5c56
Expand all
Inline Side-by-side
Showing 9 changed files with 153 additions and 427 deletions
1
2 <template>
3 <el-calendar v-model="date">
4 <template slot="dateCell" slot-scope="{date, data}">
5 <div :class="{ selected: isSelected(date, data) }">
6 <div class="solar">{{ data.day.split('-')[2] }}</div>
7 <div class="lunar" :class="{ festival: isFestival(date, data) }">{{ solarToLunar(date, data) }}</div>
8 </div>
9 </template>
10 </el-calendar>
11 </template>
12
13 <script>
14 import calendar from './calendar'
15 export default {
16 name: 'calendar',
17 data () {
18 return {
19 date: new Date(),
20 // 根据selectedDates设置选中日期
21 selectedDates: []
22 }
23 },
24 methods: {
25 // 是否选中日期
26 isSelected: function (slotDate, slotData) {
27 return this.selectedDates.includes(slotData.day)
28 },
29 // 是否节假日
30 isFestival (slotDate, slotData) {
31 let solarDayArr = slotData.day.split('-');
32 let lunarDay = calendar.solar2lunar(solarDayArr[0], solarDayArr[1], solarDayArr[2])
33
34 // 公历节日\农历节日\农历节气
35 let festAndTerm = [];
36 festAndTerm.push(lunarDay.festival == null ? '' : ' ' + lunarDay.festival)
37 festAndTerm.push(lunarDay.lunarFestival == null ? '' : '' + lunarDay.lunarFestival)
38 festAndTerm.push(lunarDay.Term == null ? '' : '' + lunarDay.Term)
39 festAndTerm = festAndTerm.join('')
40
41 return festAndTerm != ''
42 },
43 // 公历转农历
44 solarToLunar (slotDate, slotData) {
45 let solarDayArr = slotData.day.split('-');
46 let lunarDay = calendar.solar2lunar(solarDayArr[0], solarDayArr[1], solarDayArr[2])
47
48 // 农历日期
49 let lunarMD = lunarDay.IMonthCn + lunarDay.IDayCn
50
51 // 公历节日\农历节日\农历节气
52 let festAndTerm = [];
53 festAndTerm.push(lunarDay.festival == null ? '' : ' ' + lunarDay.festival)
54 festAndTerm.push(lunarDay.lunarFestival == null ? '' : '' + lunarDay.lunarFestival)
55 festAndTerm.push(lunarDay.Term == null ? '' : '' + lunarDay.Term)
56 festAndTerm = festAndTerm.join('')
57
58 return festAndTerm == '' ? lunarMD : festAndTerm
59 }
60 }
61 }
62 </script>
63
64 <style scoped>
65 /**隐藏上一月、本月、下一月*/
66 .el-calendar__button-group {
67 display: none;
68 }
69
70 /deep/.el-calendar__body {
71 padding: 8px;
72 }
73
74 /deep/.el-calendar-table .el-calendar-day {
75 height: auto;
76 padding: 5px;
77 }
78
79 /**月份居中*/
80 .el-calendar__title {
81 width: 100%;
82 text-align: center;
83 }
84
85 /deep/.el-calendar-table thead th {
86 padding: 0 0 6px 0 !important;
87 }
88
89 /deep/.el-calendar-day {
90 padding: 3px !important;
91 }
92
93 /deep/.el-calendar-table td.is-today {
94 font-weight: 700;
95 }
96
97 /deep/.el-calendar-table td.is-selected {
98 background-color: rgb(179, 216, 255);
99 }
100
101 /deep/.el-calendar__header {
102 padding: 8px 15px;
103 }
104
105 /**日期div的样式*/
106 .el-calendar-table tr td:first-child {
107 border-left: 0px;
108 }
109
110 .el-calendar-table td {
111 min-height: 110px;
112 min-width: 110px;
113 border-right: 0px;
114 }
115
116 .el-calendar-table td.is-selected {
117 background-color: white;
118 }
119
120 .el-calendar-table .el-calendar-day {
121 padding: 0px;
122 text-align: center;
123 }
124
125 .el-calendar-table .el-calendar-day>div {
126 text-align: center
127 }
128
129 /**日期div的样式-公历*/
130 .el-calendar-table .el-calendar-day>div .solar {
131 text-align: center;
132 margin-top: 3px;
133 }
134
135 /**日期div的样式-农历*/
136 .el-calendar-table .el-calendar-day>div .lunar {
137 padding-top: 5px;
138 font-size: 12px;
139 text-align: center;
140 margin-bottom: 5px;
141 }
142
143 /**日期div的样式-选中*/
144 .el-calendar-table .el-calendar-day>div.selected {
145 background-color: #fef2f2;
146 border: 3px solid #fb0;
147 border-radius: 20px;
148 text-align: center
149 }
150
151 /**本月周末设置为红色*/
152 /* .el-calendar-table .current:nth-last-child(-n+2) .solar {
153 color: red;
154 } */
155
156 /**本月农历设置为灰色*/
157 .el-calendar-table .current .lunar {
158 color: #606266;
159 font-size: 12px;
160 }
161
162 /**本月农历节日设置为红色*/
163 .el-calendar-table .current .lunar.festival {
164 color: red;
165 }
166
167 .el-calendar-table td {
168 border-right: none !important;
169 }
170
171 /**禁用点击效果*/
172 /*.el-calendar-table td {*/
173 /*pointer-events: none;*/
174 /*}*/
175 </style>
...\ No newline at end of file ...\ No newline at end of file
1
2 <template>
3 <el-calendar v-model="date">
4 <template slot="dateCell" slot-scope="{date, data}">
5 <div :class="{ selected: isSelected(date, data) }">
6 <div class="solar">{{ data.day.split('-')[2] }}</div>
7 <div class="lunar" :class="{ festival: isFestival(date, data) }">{{ solarToLunar(date, data) }}</div>
8 </div>
9 </template>
10 </el-calendar>
11 </template>
12
13 <script>
14 import calendar from './calendar'
15 export default {
16 name: 'calendar',
17 data () {
18 return {
19 date: new Date(),
20 // 根据selectedDates设置选中日期
21 selectedDates: []
22 }
23 },
24 methods: {
25 // 是否选中日期
26 isSelected: function (slotDate, slotData) {
27 return this.selectedDates.includes(slotData.day)
28 },
29 // 是否节假日
30 isFestival (slotDate, slotData) {
31 let solarDayArr = slotData.day.split('-');
32 let lunarDay = calendar.solar2lunar(solarDayArr[0], solarDayArr[1], solarDayArr[2])
33
34 // 公历节日\农历节日\农历节气
35 let festAndTerm = [];
36 festAndTerm.push(lunarDay.festival == null ? '' : ' ' + lunarDay.festival)
37 festAndTerm.push(lunarDay.lunarFestival == null ? '' : '' + lunarDay.lunarFestival)
38 festAndTerm.push(lunarDay.Term == null ? '' : '' + lunarDay.Term)
39 festAndTerm = festAndTerm.join('')
40
41 return festAndTerm != ''
42 },
43 // 公历转农历
44 solarToLunar (slotDate, slotData) {
45 let solarDayArr = slotData.day.split('-');
46 let lunarDay = calendar.solar2lunar(solarDayArr[0], solarDayArr[1], solarDayArr[2])
47
48 // 农历日期
49 let lunarMD = lunarDay.IMonthCn + lunarDay.IDayCn
50
51 // 公历节日\农历节日\农历节气
52 let festAndTerm = [];
53 festAndTerm.push(lunarDay.festival == null ? '' : ' ' + lunarDay.festival)
54 festAndTerm.push(lunarDay.lunarFestival == null ? '' : '' + lunarDay.lunarFestival)
55 festAndTerm.push(lunarDay.Term == null ? '' : '' + lunarDay.Term)
56 festAndTerm = festAndTerm.join('')
57
58 return festAndTerm == '' ? lunarMD : festAndTerm
59 }
60 }
61 }
62 </script>
63
64 <style scoped>
65 /**隐藏上一月、本月、下一月*/
66 .el-calendar__button-group {
67 display: none;
68 }
69
70 /deep/.el-calendar__body {
71 padding: 8px;
72 }
73
74 /deep/.el-calendar-table .el-calendar-day {
75 height: auto;
76 padding: 5px;
77 }
78
79 /**月份居中*/
80 .el-calendar__title {
81 width: 100%;
82 text-align: center;
83 }
84
85 /deep/.el-calendar-table thead th {
86 padding: 0 0 6px 0 !important;
87 }
88
89 /deep/.el-calendar-day {
90 padding: 3px !important;
91 }
92
93 /deep/.el-calendar-table td.is-today {
94 font-weight: 700;
95 }
96
97 /deep/.el-calendar-table td.is-selected {
98 background-color: rgb(179, 216, 255);
99 }
100
101 /deep/.el-calendar__header {
102 padding: 8px 15px;
103 }
104
105 /**日期div的样式*/
106 .el-calendar-table tr td:first-child {
107 border-left: 0px;
108 }
109
110 .el-calendar-table td {
111 min-height: 110px;
112 min-width: 110px;
113 border-right: 0px;
114 }
115
116 .el-calendar-table td.is-selected {
117 background-color: white;
118 }
119
120 .el-calendar-table .el-calendar-day {
121 padding: 0px;
122 text-align: center;
123 }
124
125 .el-calendar-table .el-calendar-day>div {
126 text-align: center
127 }
128
129 /**日期div的样式-公历*/
130 .el-calendar-table .el-calendar-day>div .solar {
131 text-align: center;
132 margin-top: 3px;
133 }
134
135 /**日期div的样式-农历*/
136 .el-calendar-table .el-calendar-day>div .lunar {
137 padding-top: 5px;
138 font-size: 12px;
139 text-align: center;
140 margin-bottom: 5px;
141 }
142
143 /**日期div的样式-选中*/
144 .el-calendar-table .el-calendar-day>div.selected {
145 background-color: #fef2f2;
146 border: 3px solid #fb0;
147 border-radius: 20px;
148 text-align: center
149 }
150
151 /**本月周末设置为红色*/
152 /* .el-calendar-table .current:nth-last-child(-n+2) .solar {
153 color: red;
154 } */
155
156 /**本月农历设置为灰色*/
157 .el-calendar-table .current .lunar {
158 color: #606266;
159 font-size: 12px;
160 }
161
162 /**本月农历节日设置为红色*/
163 .el-calendar-table .current .lunar.festival {
164 color: red;
165 }
166
167 .el-calendar-table td {
168 border-right: none !important;
169 }
170
171 /**禁用点击效果*/
172 /*.el-calendar-table td {*/
173 /*pointer-events: none;*/
174 /*}*/
175 </style>
...\ No newline at end of file ...\ No newline at end of file
...@@ -38,13 +38,7 @@ export const constantRoutes = [ ...@@ -38,13 +38,7 @@ export const constantRoutes = [
38 name: 'workFrameView', 38 name: 'workFrameView',
39 hidden: true, 39 hidden: true,
40 meta: { title: '发起申请' } 40 meta: { title: '发起申请' }
41 } 41 },
42 ]
43 /**
44 * asyncRoutes
45 * the routes that need to be dynamically loaded based on user roles
46 */
47 export const asyncRoutes = [
48 { 42 {
49 path: '/', 43 path: '/',
50 component: Layout, 44 component: Layout,
...@@ -59,6 +53,12 @@ export const asyncRoutes = [ ...@@ -59,6 +53,12 @@ export const asyncRoutes = [
59 } 53 }
60 ] 54 ]
61 }, 55 },
56 ]
57 /**
58 * asyncRoutes
59 * the routes that need to be dynamically loaded based on user roles
60 */
61 export const asyncRoutes = [
62 { 62 {
63 path: '/ywbl', 63 path: '/ywbl',
64 id: '2', 64 id: '2',
......
...@@ -20,7 +20,8 @@ const actions = { ...@@ -20,7 +20,8 @@ const actions = {
20 return new Promise(resolve => { 20 return new Promise(resolve => {
21 // 将权限菜单数组转成路由树数据结构 21 // 将权限菜单数组转成路由树数据结构
22 let permission_tree = asyncRouter(getMenuInfo) 22 let permission_tree = asyncRouter(getMenuInfo)
23 commit('SET_ROUTES', permission_tree) 23 const mergeResult = _.cloneDeep(constantRoutes).concat(permission_tree);
24 commit('SET_ROUTES', mergeResult)
24 resolve(permission_tree) 25 resolve(permission_tree)
25 }) 26 })
26 }, 27 },
......
1 <template> 1 <template>
2 <dialogBox title="配置常办项目" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="50%" 2 <dialogBox title="配置常办项目" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="50%"
3 @closeDialog="closeDialog" v-model="value"> 3 @closeDialog="closeDialog" v-model="value">
4 <el-form ref="ruleForm" :model="ruleForm" label-width="100px" > 4 <el-form ref="ruleForm" :model="ruleForm" label-width="100px">
5 <el-tree 5 <el-tree :data="projectList" show-checkbox node-key="id" ref="tree" default-expand-all :props="defaultProps"
6 :data="projectList" 6 @check-change="handleClick"></el-tree>
7 show-checkbox
8 node-key="id"
9 ref="tree"
10 check-strictly
11 :highlight-current='true'
12 :check-on-click-node="true"
13 :accordion="true"
14 :props="defaultProps"
15 :default-expand-all="true"
16 @check-change="handleClick"
17 ></el-tree>
18 </el-form> 7 </el-form>
19 </dialogBox> 8 </dialogBox>
20 </template> 9 </template>
21 <script> 10 <script>
22 import { getMenuInfo} from "@/api/user.js"; 11 import { getMenuInfo } from "@/api/user.js";
23 import { saveFrequentProjectsList } from "@/api/home.js"; 12 import { saveFrequentProjectsList } from "@/api/home.js";
24 export default { 13 export default {
25 props: { 14 props: {
26 value: { type: Boolean, default: false }, 15 value: { type: Boolean, default: false },
27 bindItem: {type:Array, default: []} 16 bindItem: { type: Array, default: [] }
28 }, 17 },
29 data () { 18 data () {
30 return { 19 return {
...@@ -36,60 +25,64 @@ export default { ...@@ -36,60 +25,64 @@ export default {
36 defaultProps: { 25 defaultProps: {
37 children: "children", 26 children: "children",
38 label: "name", 27 label: "name",
39 disabled:function(data,node){ 28 disabled: function (data, node) {
40 if(data.children && data.children.length > 0){ 29 if (data.children && data.children.length > 0) {
41 return true 30 return true
42 }else{ 31 } else {
43 return false 32 return false
44 } 33 }
45 } 34 }
46 }, 35 },
47 uniqueValue:''//最后拿到的唯一选择的moduldCode值,相当于id 36 uniqueValue: ''//最后拿到的唯一选择的moduldCode值,相当于id
48 } 37 }
49 }, 38 },
50 mounted () { 39 mounted () {
51 this.queryClick() 40 this.queryClick()
52 this.dealCheckedItem(); 41 this.dealCheckedItem();
53 }, 42 },
54 methods: { 43 methods: {
55 submitForm () { 44 submitForm () {
56 var checkedNodes = this.$refs.tree.getCheckedNodes(); 45 var checkedNodes = this.$refs.tree.getCheckedNodes();
57 if(checkedNodes.length > 6){ 46 if (checkedNodes.length > 6) {
58 this.$message.error("最多选择6个项目！"); 47 this.$message.error("最多选择6个项目！");
59 return 48 return
49 }
50 saveFrequentProjectsList(checkedNodes).then(res => {
51 if (res.code == 200) {
52 this.$parent.queryProjectList();
53 this.$message.success("保存成功");
54 this.$emit("input", false);
55 } else {
56 this.$message.error(res.message);
60 } 57 }
61 saveFrequentProjectsList(checkedNodes).then(res => { 58 })
62 if(res.code == 200){
63 this.$parent.queryProjectList();
64 this.$message.success("保存成功");
65 this.$emit("input", false);
66 }else{
67 this.$message.error(res.message);
68 }
69 })
70 }, 59 },
71 queryClick(){ 60 queryClick () {
72 getMenuInfo().then(res => { 61 getMenuInfo().then(res => {
73 this.projectList = res.result 62 this.projectList = res.result
74 }) 63 })
75 }, 64 },
76 dealCheckedItem(){ 65 dealCheckedItem () {
77 }, 66 },
78 //关闭窗口 67 //关闭窗口
79 closeDialog () { 68 closeDialog () {
80 this.$emit("input", false); 69 this.$emit("input", false);
81 }, 70 },
82 //节点选择状态发生改变时 71 //节点选择状态发生改变时
83 handleClick(data,checked, node){ 72 handleClick (data, checked, node) {
84 var checkedNodes = this.$refs.tree.getCheckedNodes(); 73 var checkedNodes = this.$refs.tree.getCheckedNodes();
85 if(checked){ 74 if (checked) {
86 checkedNodes.push(data); 75 checkedNodes.push(data);
87 } 76 }
88 this.$refs.tree.setCheckedNodes(checkedNodes); 77 this.$refs.tree.setCheckedNodes(checkedNodes);
89 console.log(this.$refs.tree.getCheckedNodes()); 78 console.log(this.$refs.tree.getCheckedNodes());
90 }, 79 },
91 } 80 }
92 } 81 }
93 </script> 82 </script>
94 <style scoped lang='scss'> 83 <style scoped lang='scss'>
84 /deep/.el-tree-node.is-expanded>.el-tree-node__children {
85 display: flex;
86 flex-wrap: wrap;
87 }
95 </style> 88 </style>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
14 14
15 li { 15 li {
16 width: 32.5%; 16 width: 32.5%;
17 height: 118px; 17 height: 90px;
18 @include flex-center; 18 @include flex-center;
19 flex-direction: column; 19 flex-direction: column;
20 color: #fff; 20 color: #fff;
...@@ -71,7 +71,7 @@ ...@@ -71,7 +71,7 @@
71 71
72 .box-mountNode { 72 .box-mountNode {
73 flex: 1; 73 flex: 1;
74 height: calc(100% - 510px); 74 height: calc(100% - 490px);
75 } 75 }
76 76
77 .home-right { 77 .home-right {
......
...@@ -3,14 +3,14 @@ ...@@ -3,14 +3,14 @@
3 <div class="home-left"> 3 <div class="home-left">
4 <el-row :gutter="8"> 4 <el-row :gutter="8">
5 <el-col :span="12"> 5 <el-col :span="12">
6 <el-card shadow="hover" :body-style="{ padding: '0' }" style="height:302px"> 6 <el-card shadow="hover" :body-style="{ padding: '0' }" style="height:260px">
7 <div slot="header" class="flexst"> 7 <div slot="header" class="flexst">
8 <h5 class="title">常办项目</h5> 8 <h5 class="title">常办项目</h5>
9 <el-button type="primary" @click="setFrequencyProject()">配置常办</el-button> 9 <el-button type="primary" @click="setFrequencyProject()">配置常办</el-button>
10 </div> 10 </div>
11 <ul class="workbench flexst"> 11 <ul class="workbench flexst">
12 <li v-for="(item, index) in projectList" class="pointer" :key="index" 12 <li v-for="(item, index) in projectList" class="pointer" :key="index"
13 :style="{ backgroundColor: newsListData[index] }"> 13 :style="{ backgroundColor: newsListColor[index] }">
14 <i class="el-icon-s-claim"></i> 14 <i class="el-icon-s-claim"></i>
15 {{ item.name }} 15 {{ item.name }}
16 </li> 16 </li>
...@@ -18,12 +18,12 @@ ...@@ -18,12 +18,12 @@
18 </el-card> 18 </el-card>
19 </el-col> 19 </el-col>
20 <el-col :span="12"> 20 <el-col :span="12">
21 <el-card shadow="hover" style="height:302px"> 21 <el-card shadow="hover" style="height:260px">
22 <div slot="header" class="flexst"> 22 <div slot="header" class="flexst">
23 <h5 class="title">系统通知</h5> 23 <h5 class="title">系统通知</h5>
24 <el-popover placement="right" width="50" trigger="hover"> 24 <el-popover placement="right" width="50" trigger="hover">
25 <ul class="pointer"> 25 <ul class="pointer">
26 <li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li> 26 <li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li>
27 </ul> 27 </ul>
28 <i class="el-icon-s-unfold pointer" slot="reference"></i> 28 <i class="el-icon-s-unfold pointer" slot="reference"></i>
29 </el-popover> 29 </el-popover>
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
60 <h5 class="title">政策法规</h5> 60 <h5 class="title">政策法规</h5>
61 <el-popover placement="right" width="50" trigger="hover"> 61 <el-popover placement="right" width="50" trigger="hover">
62 <ul class="pointer"> 62 <ul class="pointer">
63 <li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li> 63 <li @click="$store.dispatch('tagsView/addView', moreNotice)">查看更多</li>
64 </ul> 64 </ul>
65 <i class="el-icon-s-unfold pointer" slot="reference"></i> 65 <i class="el-icon-s-unfold pointer" slot="reference"></i>
66 </el-popover> 66 </el-popover>
...@@ -81,8 +81,13 @@ ...@@ -81,8 +81,13 @@
81 </el-card> 81 </el-card>
82 </div> 82 </div>
83 <div class="home-right"> 83 <div class="home-right">
84 <calendar /> 84 <el-card shadow="hover" style="height:345px">
85 <el-card shadow="hover" class="marginTop10" style="height:345px"> 85 <div slot="header" class="flexst">
86 <h5 class="title">用户登录时间</h5>
87 </div>
88 <div id="loginTime"></div>
89 </el-card>
90 <el-card class="marginTop10" shadow="hover" style="height:395px">
86 <div slot="header" class="flexst"> 91 <div slot="header" class="flexst">
87 <h5 class="title">动态信息</h5> 92 <h5 class="title">动态信息</h5>
88 <i class="el-icon-s-unfold pointer"></i> 93 <i class="el-icon-s-unfold pointer"></i>
...@@ -95,22 +100,47 @@ ...@@ -95,22 +100,47 @@
95 </ul> 100 </ul>
96 </el-card> 101 </el-card>
97 </div> 102 </div>
98 <addDialog ref="addProject" v-model="projectDialog" :bindItem="projectList"/> 103 <addDialog ref="addProject" v-model="projectDialog" :bindItem="projectList" />
99 </div> 104 </div>
100 </template> 105 </template>
101 <script> 106 <script>
102 import * as G2 from '@antv/g2' 107 import * as G2 from '@antv/g2'
103 import calendar from '@/components/Calendar/index'
104 import vueSeamlessScroll from "vue-seamless-scroll" 108 import vueSeamlessScroll from "vue-seamless-scroll"
105 import { getHomeNoticeList, getHomeTodoList, getHomeDoneList,getHomeFrequentProjects } from "@/api/home.js"; 109 import { getHomeNoticeList, getHomeTodoList, getHomeDoneList, getHomeFrequentProjects } from "@/api/home.js";
106 import { setReadStatus } from "@/api/notice.js"; 110 import { setReadStatus } from "@/api/notice.js";
107 import addDialog from "./components/addProject.vue"; 111 import addDialog from "./components/addProject.vue";
108 export default { 112 export default {
109 name: 'home', 113 name: 'home',
110 components: { calendar, vueSeamlessScroll,addDialog }, 114 components: { vueSeamlessScroll, addDialog },
111 data () { 115 data () {
112 return { 116 return {
113 newsListData: ['#61AEFF','#43DEB3','#F3C143','#F09936','#9C92FF','#589FFF',], 117 listData: [
118 {
119 icon: '',
120 title: '任务'
121 },
122 {
123 icon: '',
124 title: '邮件'
125 },
126 {
127 icon: '',
128 title: '消息'
129 },
130 {
131 icon: '',
132 title: '日历'
133 },
134 {
135 icon: '',
136 title: '常用功能'
137 },
138 {
139 icon: '',
140 title: '申请'
141 }
142 ],
143 newsListColor: ['#61AEFF', '#43DEB3', '#F3C143', '#F09936', '#9C92FF', '#589FFF',],
114 chartData: [{ 144 chartData: [{
115 year: '1991', 145 year: '1991',
116 value: 15468 146 value: 15468
...@@ -145,12 +175,13 @@ export default { ...@@ -145,12 +175,13 @@ export default {
145 fullPath: '/system/xttz/xttzview', 175 fullPath: '/system/xttz/xttzview',
146 name: '系统通知', 176 name: '系统通知',
147 path: '/system/xttz/xttzview', 177 path: '/system/xttz/xttzview',
148 meta: { title: '系统通知' } 178 meta: { title: '系统通知' }
149 }, 179 },
150 } 180 }
151 }, 181 },
152 mounted () { 182 mounted () {
153 this.buildChart();//构建图标 183 this.buildChart();//构建图标
184 this.loginTimeChart()
154 this.queryTodoList();//获取待办列表 185 this.queryTodoList();//获取待办列表
155 this.queryDoneList();//获取已办列表 186 this.queryDoneList();//获取已办列表
156 this.queryNoticeList();//获取通知、法律法规列表 187 this.queryNoticeList();//获取通知、法律法规列表
...@@ -190,10 +221,12 @@ export default { ...@@ -190,10 +221,12 @@ export default {
190 }) 221 })
191 }, 222 },
192 //获取常办项目列表 223 //获取常办项目列表
193 queryProjectList(){ 224 queryProjectList () {
194 getHomeFrequentProjects().then(res => { 225 getHomeFrequentProjects().then(res => {
195 if(res.result){ 226 if (res.result && res.result.length > 0) {
196 this.projectList = res.result 227 this.projectList = res.result
228 } else {
229 this.projectList = this.listData
197 } 230 }
198 }) 231 })
199 }, 232 },
...@@ -241,13 +274,62 @@ export default { ...@@ -241,13 +274,62 @@ export default {
241 chart.line().position('year*value').size(2).shape('smooth'); 274 chart.line().position('year*value').size(2).shape('smooth');
242 chart.render(); 275 chart.render();
243 }, 276 },
277 loginTimeChart () {
278 var data = [{
279 item: '用户1',
280 count: 40,
281 percent: 0.4
282 }, {
283 item: '用户2',
284 count: 21,
285 percent: 0.21
286 }, {
287 item: '用户3',
288 count: 17,
289 percent: 0.17
290 }]
291 var chart = new G2.Chart({
292 container: 'loginTime',
293 height: 260
294 });
295 chart.source(data, {
296 percent: {
297 formatter: function formatter (val) {
298 val = val * 100 + '%';
299 return val;
300 }
301 }
302 });
303 chart.coord('theta');
304 chart.tooltip({
305 showTitle: false
306 });
307 chart.interval().position('percent').color('item').label('percent', {
308 offset: -40,
309 textStyle: {
310 textAlign: 'center',
311 shadowBlur: 2,
312 shadowColor: 'rgba(0, 0, 0, .45)'
313 }
314 }).tooltip('item*percent', function (item, percent) {
315 percent = percent * 100 + '%';
316 return {
317 name: item,
318 value: percent
319 };
320 }).style({
321 lineWidth: 1,
322 stroke: '#fff'
323 });
324 chart.forceFit();
325 chart.render();
326 },
244 //跳转到更多通知列表页面 327 //跳转到更多通知列表页面
245 jumpToMoreNotice(){ 328 jumpToMoreNotice () {
246 console.log(this.$route); 329 console.log(this.$route);
247
248 }, 330 },
249 //配置常办项目 331 //配置常办项目
250 setFrequencyProject(){ 332 setFrequencyProject () {
251 this.projectDialog = true; 333 this.projectDialog = true;
252 }, 334 },
253 handleNotice (item) { 335 handleNotice (item) {
......