Skip to content

M
md-vue-chc
Commit e9a69d19 authored by 何鹏程's avatar 何鹏程
Browse files
Options

增加急诊车统计

parent 97bc6a02
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 476 additions and 13011 deletions
package-lock.json deleted 100644 → 0
View file @ 97bc6a02
This diff is collapsed.
src/api/common.js
View file @ e9a69d19
......@@ -30,4 +30,12 @@ export function queryExtendConfig(params) {
method: 'POST',
data: params
})
}
\ No newline at end of file
}
export function queryEmergencyResource(params) {
return request({
url: '/api/team/site/queryEmergencyResource',
method: 'POST',
data: params
})
}
src/main.js
View file @ e9a69d19
......@@ -5,7 +5,6 @@ import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui';
import Echarts from 'echarts';
import store from './store'
import axios from './util/ajax'
import checkPermission from './util/permission'
......@@ -18,7 +17,6 @@ import {
Vue.config.productionTip = false
Vue.prototype.$axios = axios;
Vue.prototype.$echarts = Echarts;
Vue.use(ElementUI)
Vue.prototype.$message = message;
Vue.prototype.checkPermission = checkPermission
......
src/page/carStatistics/components/echartsBar.vue 0 → 100644
View file @ e9a69d19
<template>
<div class="main">
<div
class="chart"
:id="idKey"
>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts';
export default {
props: {
dataList: {
type: Array,
default: []
},
idKey: {
type: String,
default: 'chart'
},
title: {
type: String,
default: ''
},
areaList: {
type: Array,
default: []
}
},
watch: {
dataList: function(val) {
if (val.length > 0) {
this.init()
}
}
},
data() {
return {
chart: null
}
},
mounted() {
this.init()
},
methods: {
init() {
var myChart = echarts.init(document.getElementById(this.idKey));
const data = this.dataList.map(item => {
return [item.name, item.value]
})
let option = {
title: {
text: this.title + '数',
textStyle: {
fontSize: 14,
fontWeight: 400,
color: '#444444'
},
top: 0,
left: 30
},
grid: {
left: '60',
right: '30',
bottom: '65',
top: '48'
},
legend: {
data: [this.title + '总数'],
top: 0,
right: 30
},
xAxis: [
{
type: 'category',
nameLocation: 'center',
axisLabel: {
formatter: function(value) {
if (value.length > 5) {
let i = 0
const strList = []
while (i < value.length) {
strList.push(value.slice(i, i + 5))
i += 5
}
return strList.join("\n");
} else {
return value
}
}
},
}
],
yAxis: [
{
type: 'value'
}
],
series: [{
data: data,
type: 'bar',
name: this.title + '总数',
label: {
show: true,
position: 'top'
},
itemStyle: {
color: '#4495E6'
},
barWidth: 28
}]
};
option && myChart.setOption(option);
}
}
}
</script>
<style lang="scss" scoped>
.main {
height: 300px;
width: 100%;
.chart {
width: 100%;
height: 100%;
}
}
</style>
\ No newline at end of file
src/page/carStatistics/components/echartsPie.vue 0 → 100644
View file @ e9a69d19
<template>
<div class="main">
<div
class="chart"
:id="idKey"
>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts';
export default {
props: {
dataList: {
type: Array,
default: []
},
colorList: {
type: Array,
default: []
},
idKey: {
type: String,
default: 'chart'
}
},
watch: {
dataList: function(val) {
if (val.length > 0) {
this.init()
}
}
},
data() {
return {
chart: null
}
},
mounted() {
this.init()
},
methods: {
init() {
var myChart = echarts.init(document.getElementById(this.idKey));
let option = {
tooltip: {
trigger: 'item'
},
legend: {
left: 'center',
bottom: '24',
itemWidth: 12,
itemHeight: 12,
itemGap: 12,
orient: 'horizontal',
textStyle: {
color: '#666666',
fontSize: 12,
height: 12,
padding: [2, 20, 0, 0]
}
},
series: [
{
// name: '车辆类型占比',
type: 'pie',
radius: ['60%', '100%'],
left: 'center',
height: 200,
width: 584,
minAngle: 5,
bottom: 100,
top: 50,
label: {
alignTo: 'edge',
edgeDistance: 10,
minMargin: 5,
margin: '15%',
formatter: (params) => {
return '{a|' + params.name + '}\n{a|' + Math.round(params.percent) + '% ' + params.value + '辆}'
},
rich: {
a: {
color: '#333333',
fontSize: 14,
fontWeight: 500
}
},
},
labelLine: {
lineStyle: {
color: '#B3B3B3'
},
length: 15,
length2: 15
},
labelLayout: function(params) {
var isLeft = params.labelRect.x < myChart.getWidth() / 2;
var points = params.labelLinePoints;
// Update the end point.
points[2][0] = isLeft
? params.labelRect.x
: params.labelRect.x + params.labelRect.width;
return {
labelLinePoints: points
};
},
itemStyle: {
color: (color) => {
const item = this.colorList.find(i => i.name === color.name)
return item.color || '#333333'
}
},
data: this.dataList
}
]
};
option && myChart.setOption(option);
}
}
}
</script>
<style lang="scss" scoped>
.main {
height: 370px;
width: 100%;
.chart {
width: 100%;
height: 100%;
}
}
</style>
\ No newline at end of file
src/page/carStatistics/index.vue 0 → 100644
View file @ e9a69d19
<template>
<div class="main-page carStatistics">
<div class="main-page-header">
<p class="title">急诊车统计</p>
<el-form
:inline="true"
:model="searchForm"
ref="searchForm"
size="small"
>
<el-form-item
prop="area"
label="辖区"
>
<el-select
v-model="searchForm.area"
placeholder="请选择车辆类型"
style="width: 100%"
:clearable="true"
>
<el-option
label="全部"
value=""
/>
<el-option
v-for="item in areaList"
:label="item.name"
:key="item.id"
:value="item.val"
/>
</el-select>
</el-form-item>
<div class="btns">
<el-button
type="primary"
size="small"
@click="getData"
>查询</el-button>
</div>
</el-form>
</div>
<div class="main-page-body">
<div class="top-main">
<div class="box">
<div class="title">
车辆用途占比
</div>
<EchartsPie
:dataList="vechieSpecialList"
:colorList="vechieSpecialPurpose"
idKey="vechieSpecialPurpose"
/>
</div>
<div class="box">
<div class="title">
车辆类型占比
</div>
<EchartsPie
:dataList="vechieTypeList"
:colorList="vechieType"
idKey="vechieType"
/>
</div>
</div>
<div class="box">
<div class="title">辖区急救车辆总数排行</div>
<EchartsBar
:dataList="carCountList"
idKey="carCount"
:areaList="areaList"
title="车辆"
/>
</div>
<div class="box mb">
<div class="title">辖区站点总数排行</div>
<EchartsBar
:dataList="siteCountList"
idKey="siteCount"
:areaList="areaList"
title="站点"
/>
</div>
</div>
</div>
</template>
<script>
import { queryEmergencyResource } from '@/api/common'
import { getDic } from '../../util/dict'
import EchartsPie from './components/echartsPie.vue'
import EchartsBar from './components/echartsBar.vue'
export default {
name: 'siteStatistics',
components: {
EchartsBar,
EchartsPie
},
data() {
return {
searchForm: {
area: ''
},
areaList: [],
carCountList: [],
siteCountList: [],
vechieSpecialList: [],
vechieTypeList: [],
vechieType: [],
vechieSpecialPurpose: []
}
},
mounted() {
// 获取字典
getDic(['area', 'vechie_type', 'vechie_special_purpose']).then(res => {
this.areaList = res.area
this.vechieType = res.vechie_type
this.vechieSpecialPurpose = res.vechie_special_purpose
})
this.getData()
},
methods: {
getData() {
queryEmergencyResource(this.searchForm).then(res => {
if (res.msg == 201) {
const { carCountList, siteCountList, vechieSpecialList, vechieTypeList } = res.respData
this.carCountList = carCountList || []
this.siteCountList = siteCountList || []
this.vechieSpecialList = vechieSpecialList || []
this.vechieTypeList = vechieTypeList || []
} else {
this.$message.error(res.content)
}
})
}
}
}
</script>
<style lang="scss" scoped>
.carStatistics {
.main-page-body {
background-color: transparent !important;
display: block;
.top-main {
position: relative;
.box {
width: calc(50% - 12px);
.title {
padding: 16px 32px;
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
font-weight: 500;
}
&:last-child {
position: absolute;
top: 0;
right: 1px;
}
}
}
.box {
background: #ffffff;
margin-bottom: 24px;
.title {
font-size: 20px;
color: rgba(0, 0, 0, 0.87);
padding: 24px 36px;
font-weight: 500;
}
&.mb {
margin-bottom: 0;
}
}
}
}
</style>
src/util/auth.js
View file @ e9a69d19
......@@ -41,9 +41,10 @@ const Auth = {
setLoginInfo: function(obj) {
// TODO: 设置超时登录时间，在该时间范围内没有任何请求操作则自动删除
var maxAge = new Date(new Date().getTime() + 30 * 60 * 1000)
Cookies.set(this.loginKey, obj, {
expires: maxAge
})
// Cookies.set(this.loginKey, obj, {
// expires: maxAge
// })
Cookies.set(this.loginKey, obj)
return obj
},
......@@ -53,4 +54,7 @@ const Auth = {
}
}
export {Auth, Cache}
export {
Auth,
Cache
}
yarn.lock
View file @ e9a69d19
......@@ -2663,12 +2663,13 @@ ecc-jsbn@~0.1.1:
jsbn "~0.1.0"
safer-buffer "^2.1.0"
echarts@^4.9.0:
version "4.9.0"
resolved "https://registry.nlark.com/echarts/download/echarts-4.9.0.tgz#a9b9baa03f03a2a731e6340c55befb57a9e1347d"
integrity sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0=
echarts@^5.1.2:
version "5.1.2"
resolved "https://registry.nlark.com/echarts/download/echarts-5.1.2.tgz#aa1ab0cef5b74fa2f7c620261a5f286893d30fd1"
integrity sha1-qhqwzvW3T6L3xiAmGl8oaJPTD9E=
dependencies:
zrender "4.3.2"
tslib "2.0.3"
zrender "5.1.1"
ee-first@1.1.1:
version "1.1.1"
......@@ -7883,6 +7884,11 @@ tsconfig-paths@^3.9.0:
minimist "^1.2.0"
strip-bom "^3.0.0"
tslib@2.0.3:
version "2.0.3"
resolved "https://registry.nlark.com/tslib/download/tslib-2.0.3.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftslib%2Fdownload%2Ftslib-2.0.3.tgz#8e0741ac45fc0c226e58a17bfc3e64b9bc6ca61c"
integrity sha1-jgdBrEX8DCJuWKF7/D5kubxsphw=
tty-browserify@0.0.0:
version "0.0.0"
resolved "https://registry.nlark.com/tty-browserify/download/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
......@@ -8622,7 +8628,9 @@ yargs@~3.10.0:
decamelize "^1.0.0"
window-size "0.1.0"
zrender@4.3.2:
version "4.3.2"
resolved "https://registry.npm.taobao.org/zrender/download/zrender-4.3.2.tgz?cache=0&sync_timestamp=1618215769844&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fzrender%2Fdownload%2Fzrender-4.3.2.tgz#ec7432f9415c82c73584b6b7b8c47e1b016209c6"
integrity sha1-7HQy+UFcgsc1hLa3uMR+GwFiCcY=
zrender@5.1.1:
version "5.1.1"
resolved "https://registry.nlark.com/zrender/download/zrender-5.1.1.tgz#0515f4f8cc0f4742f02a6b8819550a6d13d64c5c"
integrity sha1-BRX0+MwPR0LwKmuIGVUKbRPWTFw=
dependencies:
tslib "2.0.3"
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment