ewide/zsxt_nbzs_h5
22
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Browse Source
This commit is contained in:
ky_sunl
2021-04-22 13:37:25 +00:00
parent 575a22954f
commit d1c9e5a71e
699 changed files with 1062425 additions and 40640 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
Web/src/pages/home/charts.vue Normal file
View File

@@ -0,0 +1,104 @@
<template>
<a-card :bordered="false" title="年度项目总完成情况">
<a-form-model :model="query" layout="inline">
<a-form-model-item label="区域">
<a-dropdown>
<span>
宁波市
<a-icon type="down" />
</span>
<a-menu slot="overlay">
<a-menu-item>宁波市</a-menu-item>
<a-menu-item>鄞州区</a-menu-item>
</a-menu>
</a-dropdown>
</a-form-model-item>
<a-form-model-item label="年份">
<a-dropdown>
<span>
2021
<a-icon type="down" />
</span>
<a-menu slot="overlay">
<a-menu-item>2021</a-menu-item>
<a-menu-item>2020</a-menu-item>
<a-menu-item>2019</a-menu-item>
</a-menu>
</a-dropdown>
</a-form-model-item>
</a-form-model>
<div :style="{ height: '300px' }" ref="chart"></div>
</a-card>
</template>
<script>
import * as echarts from 'echarts';
export default {
data() {
return {
query: {
area: '宁波市',
year: '2021',
},
options: {
tooltip: {
trigger: 'axis',
},
legend: {
show: false,
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
},
yAxis: {
type: 'value',
},
series: [
{
name: '邮件营销',
type: 'line',
stack: '总量',
data: [120, 132, 101, 134, 90, 230, 210],
},
{
name: '联盟广告',
type: 'line',
stack: '总量',
data: [220, 182, 191, 234, 290, 330, 310],
},
{
name: '视频广告',
type: 'line',
stack: '总量',
data: [150, 232, 201, 154, 190, 330, 410],
},
{
name: '直接访问',
type: 'line',
stack: '总量',
data: [320, 332, 301, 334, 390, 330, 320],
},
{
name: '搜索引擎',
type: 'line',
stack: '总量',
data: [820, 932, 901, 934, 1290, 1330, 1320],
},
],
},
};
},
mounted() {
var chartDom = this.$refs.chart;
var myChart = echarts.init(chartDom);
myChart.setOption(this.options);
},
};
</script>

38
Web/src/pages/home/index.less Normal file
View File

@@ -0,0 +1,38 @@
@import (reference) '~@/assets/style/app.less';
.home-header {
margin-bottom: @padding-md;
padding: @padding-lg 0;
background-color: @white;
}
.home-header-row {
display: flex;
}
.home-header-content {
margin-left: @padding-lg;
span {
color: @primary-color;
}
p {
margin: 0;
}
}
.home-container {
.ant-card-meta-title {
font-size: @font-size-base + 1px;
display: -webkit-box;
-webkit-box-orient: vertical;
height: 42px;
white-space: normal;
-webkit-line-clamp: 2;
}
.ant-card-meta-description {
.ant-row-flex {
height: 24px;
}
}
}

65
Web/src/pages/home/index.vue Normal file
View File

@@ -0,0 +1,65 @@
<template>
<div>
<div class="home-header">
<container>
<a-row align="middle" justify="space-between" type="flex">
<a-col>
<div class="home-header-row">
<div class="home-header-avatar">
<a-avatar
:size="64"
src="https://gss0.baidu.com/7Ls0a8Sm2Q5IlBGlnYG/sys/portraith/item/tb.1.9f0e4392.Q2njD2SGV-9wBUKqKFoQqA?t=1507123743"
/>
</div>
<div class="home-header-content">
<h2>
上午好，
<span>软件开发人员</span>，欢迎您登录系统！
</h2>
<p>上次IP：115.217.160.156 上次登录时间：2021-04-06 13:10:13</p>
</div>
</div>
</a-col>
<a-col>
<a-icon :style="{ fontSize: '20px', color: '#f80000' }" class="mr-xs" type="mail" />您有
<a href="#">0</a>封未读邮件，请尽快查收！
</a-col>
</a-row>
</container>
</div>
<container class="home-container">
<a-row :gutter="16">
<a-col :span="24">
<Statistics />
</a-col>
<a-col :lg="12" :md="24" :xl="16">
<Task />
<List />
</a-col>
<a-col :lg="12" :md="24" :xl="8">
<Notice />
<Charts />
</a-col>
</a-row>
</container>
</div>
</template>
<script>
import './index.less';
import Statistics from './statistics';
import Task from './task';
import Notice from './notice';
import List from './list';
import Charts from './charts';
export default {
components: {
Statistics,
Task,
Notice,
List,
Charts,
},
};
</script>

99
Web/src/pages/home/list.vue Normal file
View File

@@ -0,0 +1,99 @@
<template>
<a-card
:active-tab-key="key"
:bodyStyle="{ padding: 0 }"
:bordered="false"
:tab-list="tabList"
@tabChange="key => onTabChange(key, 'key')"
>
<a-table :columns="columns" :data-source="data" :pagination="false" />
</a-card>
</template>
<script>
export default {
data() {
return {
key: '1',
tabList: [
{
key: '1',
tab: '新建项目',
},
{
key: '2',
tab: '正在签约项目',
},
{
key: '3',
tab: '完成签约项目',
},
{
key: '4',
tab: '项目进度',
},
],
columns: [
{
title: '区域',
dataIndex: 'area',
},
{
title: '项目名称',
dataIndex: 'title',
},
{
title: '户数',
dataIndex: 'count',
},
{
title: '时间',
dataIndex: 'date',
},
],
data: [
{
key: '1',
area: '海曙区',
title: '曙光电影院地块',
count: 13,
date: '2021-01-01',
},
{
key: '2',
area: '江北区',
title: '大庆新村地块旧城区改建项目',
count: 322,
date: '2021-01-01',
},
{
key: '3',
area: '宁海县',
title: '桥头胡街道旧城区改造华驰文教地块',
count: 1,
date: '2021-01-01',
},
{
key: '4',
area: '慈溪市',
title: '七二三南延道路工程',
count: 1,
date: '2021-01-01',
},
{
key: '5',
area: '北仑区',
title: '原粮食局宿舍楼1号、2号楼（太河路北延工程）',
count: 32,
date: '2021-01-01',
},
],
};
},
methods: {
onTabChange(key, type) {
this[type] = key;
},
},
};
</script>

30
Web/src/pages/home/notice.vue Normal file
View File

@@ -0,0 +1,30 @@
<template>
<a-card :bordered="false" title="通知">
<a href="#" slot="extra">更多</a>
<a-list :data-source="data" item-layout="horizontal">
<a-list-item slot="renderItem" slot-scope="item">
<a-list-item-meta :description="moment().format('YYYY-MM-DD HH:mm:ss')" :title="item.title">
<a-icon :style="{ fontSize: '18px' }" slot="avatar" theme="twoTone" type="message" />
</a-list-item-meta>
</a-list-item>
</a-list>
</a-card>
</template>
<script>
import moment from 'moment';
export default {
data() {
return {
data: [
{ title: '关于2020年度房屋征收评估机构信用考核情况的通报' },
{ title: '关于2020年度房屋征收评估机构信用考核情况的通报' },
{ title: '关于2020年度房屋征收评估机构信用考核情况的通报' },
],
};
},
methods: {
moment,
},
};
</script>

56
Web/src/pages/home/statistics.vue Normal file
View File

@@ -0,0 +1,56 @@
<template>
<a-row :gutter="16">
<a-col :lg="5" :md="8" :sm="24">
<a-card :bordered="false" :hoverable="true">
<a-statistic :value="0" class="text-center" title="已完成的项目" />
</a-card>
</a-col>
<a-col :lg="5" :md="8" :sm="24">
<a-card :bordered="false" :hoverable="true">
<a-statistic :value="c" class="text-center" title="正在进行的项目" />
</a-card>
</a-col>
<a-col :lg="5" :md="8" :sm="24">
<a-card :bordered="false" :hoverable="true">
<a-statistic :value="0" class="text-center" title="还未开始的项目" />
</a-card>
</a-col>
<a-col :lg="9" :md="24">
<a-card :bordered="false" :hoverable="true">
<a-row>
<a-col :span="12">
<a-statistic :value="8893" class="text-center" title="用户总量" />
</a-col>
<a-col :span="12">
<a-statistic :value="1255" :value-style="{ color: '#3f8600' }" class="text-center">
<template #title>
<a-dropdown>
<span>
当月活跃用户
<a-icon type="down" />
</span>
<a-menu slot="overlay">
<a-menu-item>当月活跃用户</a-menu-item>
<a-menu-item>当年活跃用户</a-menu-item>
</a-menu>
</a-dropdown>
</template>
<template #prefix>
<a-icon :style="{ fontSize: '13px' }" type="arrow-up" />
</template>
</a-statistic>
</a-col>
</a-row>
</a-card>
</a-col>
</a-row>
</template>
<script>
export default {
data() {
return {
c: 6,
};
},
};
</script>

56
Web/src/pages/home/task.vue Normal file
View File

@@ -0,0 +1,56 @@
<template>
<a-card :bordered="false" title="待办">
<a href="#" slot="extra">更多</a>
<a-card-grid :key="n" v-for="(item, n) in data">
<a-card-meta>
<div slot="title">
<a-tooltip placement="top">
<template slot="title">{{ item.title }}</template>
{{ item.title }}
</a-tooltip>
</div>
<a-row align="middle" slot="description" type="flex">
<a-col flex="32px" v-if="item.avatar">
<a-avatar :size="24" :src="item.avatar" shape="square" />
</a-col>
<a-col flex="auto">
<a-row justify="space-between" type="flex">
<a-col>软件开发人员</a-col>
<a-col>2020-01-01</a-col>
</a-row>
</a-col>
</a-row>
</a-card-meta>
</a-card-grid>
</a-card>
</template>
<script>
export default {
data() {
return {
data: [
{
title: '市区雷公巷地块项目选择评估机构及上传相关材料(软件开发人员)',
avatar: 'https://tb1.bdstatic.com/tb/steam.jpeg',
},
{
title: '宁海县山河岭6号地块备案(胡靖)',
avatar:
'https://gss0.bdstatic.com/6LZ1dD3d1sgCo2Kml5_Y_D3/sys/portrait/item/tb.1.ac342cde.2vNGrtpPcIUN6lJpSnty3g?t=1615176031',
},
{ title: '宁海县盛宁线力洋至胡陈段公路工程田交朱村 地块备案(胡靖)' },
{
title: '慈溪市慈溪市危旧房改造一期（西门小区A1区块）项目备案(陆承)',
avatar:
'https://gss0.bdstatic.com/6LZ1dD3d1sgCo2Kml5_Y_D3/sys/portrait/item/tb.1.54e2faca.uBtqRshdnVUXL9XFfQMTwg?t=1604074726',
},
{ title: '江北区孔浦成片危旧住宅区改造项目（六号区块）备案(成薇)' },
{ title: '镇海区宁镇路改扩建工程（庄市段）备案(董力)' },
{ title: '鄞州区茶桃公路（同谷路—金峨路延伸段）项目备案(软件开发人员)' },
{ title: '鄞州区咸祥大嵩湖工程备案(软件开发人员)' },
{ title: '江北区三官堂大桥及接线工程项目备案(成薇)' },
],
};
},
};
</script>