Skip to content

Chatopera OpenSource / ferry_web

Go to a project
Commit 890e4cc0 by Mr. Lan
Options

feat: 工单提交排名统计。

parent ff1399c9
Inline Side-by-side
Showing with 70 additions and 9 deletions
package.json
...@@ -36,6 +36,7 @@ ...@@ -36,6 +36,7 @@
"management-system" "management-system"
], ],
"dependencies": { "dependencies": {
"@antv/data-set": "^0.11.8",
"@antv/g6": "3.1.10", "@antv/g6": "3.1.10",
"@antv/g6-editor": "^1.2.0", "@antv/g6-editor": "^1.2.0",
"@antv/util": "1.3.1", "@antv/util": "1.3.1",
......
src/views/dashboard/admin/components/Bar.vue
<template> <template>
<div :style="{ padding: '0 0 32px 32px' }"> <div :style="{ padding: '0 0 20px 25px' }">
<h4 :style="{ marginBottom: '20px' }">{{ title }}</h4> <h4 :style="{ marginBottom: '20px' }">{{ title }}</h4>
<v-chart <v-chart
height="254" height="254"
......
src/views/dashboard/admin/components/RankList/index.vue
...@@ -29,7 +29,7 @@ export default { ...@@ -29,7 +29,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.rank { .rank {
padding: 0 32px 32px 72px; padding: 0 32px 20px 38px;
.list { .list {
margin: 25px 0 0; margin: 25px 0 0;
padding: 0; padding: 0;
......
src/views/dashboard/admin/index.vue
...@@ -2,56 +2,116 @@ ...@@ -2,56 +2,116 @@
<div class="dashboard-editor-container"> <div class="dashboard-editor-container">
<el-row :gutter="12"> <el-row :gutter="12">
<el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }"> <el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }">
<chart-card title="工单总数" :total="dashboardValue.workOrderCount.all"> <chart-card title="工单总数" :total="dashboardValue.count.all">
<el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start"> <el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start">
<i class="el-icon-warning-outline" /> <i class="el-icon-warning-outline" />
</el-tooltip> </el-tooltip>
</chart-card> </chart-card>
</el-col> </el-col>
<el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }"> <el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }">
<chart-card title="我创建的" :total="dashboardValue.workOrderCount.my_create"> <chart-card title="我创建的" :total="dashboardValue.count.my_create">
<el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start"> <el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start">
<i class="el-icon-warning-outline" /> <i class="el-icon-warning-outline" />
</el-tooltip> </el-tooltip>
</chart-card> </chart-card>
</el-col> </el-col>
<el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }"> <el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }">
<chart-card title="我相关的" :total="dashboardValue.workOrderCount.related"> <chart-card title="我相关的" :total="dashboardValue.count.related">
<el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start"> <el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start">
<i class="el-icon-warning-outline" /> <i class="el-icon-warning-outline" />
</el-tooltip> </el-tooltip>
</chart-card> </chart-card>
</el-col> </el-col>
<el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }"> <el-col :sm="24" :xs="24" :md="6" :xl="6" :lg="6" :style="{ marginBottom: '12px' }">
<chart-card title="我的待办" :total="dashboardValue.workOrderCount.upcoming"> <chart-card title="我的待办" :total="dashboardValue.count.upcoming">
<el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start"> <el-tooltip slot="action" class="item" effect="dark" content="指标说明" placement="top-start">
<i class="el-icon-warning-outline" /> <i class="el-icon-warning-outline" />
</el-tooltip> </el-tooltip>
</chart-card> </chart-card>
</el-col> </el-col>
</el-row> </el-row>
<el-card :bordered="false" :body-style="{padding: '0'}">
<div class="salesCard">
<el-row>
<el-col :xl="18" :lg="16" :md="16" :sm="24" :xs="24">
<div>
<h4 :style="{ marginBottom: '20px' }" style="margin-left: 20px;">提交工单统计</h4>
<v-chart :force-fit="true" :height="400" :data="ticketCountData" :scale="[{ dataKey: 'month', min: 0, max: 1 }]">
<v-tooltip />
<v-axis />
<v-legend />
<v-line position="month*temperature" color="city" />
<v-point position="month*temperature" color="city" :size="4" :v-style="{ stroke: '#fff', lineWidth: 1 }" :shape="'circle'" />
</v-chart>
</div>
</el-col>
<el-col :xl="8" :lg="8" :md="8" :sm="24" :xs="24">
<rank-list title="提交工单排名" :list="dashboardValue.ranks" />
</el-col>
</el-row>
</div>
</el-card>
</div> </div>
</template> </template>
<script> <script>
const DataSet = require('@antv/data-set')
import ChartCard from './components/ChartCard' import ChartCard from './components/ChartCard'
import RankList from './components/RankList/index'
import { initData } from '@/api/dashboard' import { initData } from '@/api/dashboard'
export default { export default {
name: 'DashboardAdmin', name: 'DashboardAdmin',
components: { components: {
ChartCard ChartCard,
RankList
}, },
data() { data() {
return { return {
dashboardValue: { dashboardValue: {
workOrderCount: {} count: {}
} },
rankList: [],
ticketCountData: []
} }
}, },
created() { created() {
this.getInitData()
},
methods: {
getInitData() {
initData().then(response => { initData().then(response => {
this.dashboardValue = response.data this.dashboardValue = response.data
}) })
const sourceData = [
{ month: 'Jan', Tokyo: 7.0, London: 3.9 },
{ month: 'Feb', Tokyo: 6.9, London: 4.2 },
{ month: 'Mar', Tokyo: 9.5, London: 5.7 },
{ month: 'Apr', Tokyo: 14.5, London: 8.5 },
{ month: 'May', Tokyo: 18.4, London: 11.9 },
{ month: 'Jun', Tokyo: 21.5, London: 15.2 },
{ month: 'Jul', Tokyo: 25.2, London: 17.0 },
{ month: 'Aug', Tokyo: 26.5, London: 16.6 },
{ month: 'Sep', Tokyo: 23.3, London: 14.2 },
{ month: 'Oct', Tokyo: 18.3, London: 10.3 },
{ month: 'Nov', Tokyo: 13.9, London: 6.6 },
{ month: 'Dec', Tokyo: 9.6, London: 4.8 }
]
const dv = new DataSet.View().source(sourceData)
dv.transform({
type: 'fold',
fields: ['Tokyo', 'London'],
key: 'city',
value: 'temperature'
})
this.ticketCountData = dv.rows
}
} }
} }
</script> </script>
......
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 sign in to comment