bestunion/Shanghai-SanFenYuan
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
Rhett霍 2026-03-30 14:16:01 +08:00
commit b769299005
3 changed files with 57 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/views/inspector/components/Card.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="card"> <div class="card" v-bind="$attrs">
<div class="title"> <div class="title">
{{ title }} {{ title }}
</div> </div>
@ -12,10 +12,19 @@
<script> <script>
export default { export default {
name: 'Card', name: 'Card',
props:{ inheritAttrs:false,
props: {
title: { title: {
type: String, type: String,
default: '标题' default: '标题'
},
click:{
type: Function,
}
},
methods: {
handleChangeStatistics() {
console.log(123)
} }
} }
} }
@ -29,14 +38,17 @@ export default {
height: 100%; height: 100%;
padding: 10px; padding: 10px;
border-radius: 15px; border-radius: 15px;
cursor: pointer;
} }
.title{
.title {
font-size: 20px; font-size: 20px;
font-weight: bolder; font-weight: bolder;
color: #fff1cc; color: #fff1cc;
margin-bottom: 10px; margin-bottom: 10px;
} }
.body{
.body {
position: relative; position: relative;
z-index: 20; z-index: 20;
} }

66
src/views/inspector/index.vue
View File

@ -5,40 +5,40 @@
</div> </div>
<div class="inspector-container"> <div class="inspector-container">
<div style="display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: 20px"> <div style="display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: 20px">
<Card title="总同录数量"> <Card title="总同录数量" @click.native="handleChangeStatistics(0)">
<div class="shu"> <div class="shu">
<span>{{ tongji.totalCount }}</span> <span>{{ tongji.totalCount }}</span>
</div> </div>
</Card> </Card>
<Card title="本年同录数量"> <Card title="本年同录数量" @click.native="handleChangeStatistics(1)">
<div class="shu"> <div class="shu">
<span>{{ tongji.yearCount }}</span> <span>{{ tongji.yearCount }}</span>
</div> </div>
</Card> </Card>
<Card title="本季度同录数量"> <Card title="本季度同录数量" @click.native="handleChangeStatistics(2)">
<div class="shu"> <div class="shu">
<span>{{ tongji.monthCount }}</span> <span>{{ tongji.monthCount }}</span>
</div> </div>
</Card> </Card>
<Card title="本月同录数量"> <Card title="本月同录数量" @click.native="handleChangeStatistics(3)">
<div class="shu"> <div class="shu">
<span>{{ tongji.weekCount }}</span> <span>{{ tongji.weekCount }}</span>
</div> </div>
</Card> </Card>
</div> </div>
<div style="flex:1;display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: 20px"> <div style="flex:1;display: flex;justify-content: center;align-items: center;">
<Card title="总同录数量"> <Card :title="title">
<div id="total" style="width: 100%;height: 500px"/> <div id="total" style="width: 100%;height: 500px"/>
</Card> </Card>
<Card title="本年同录数量"> <!-- <Card title="本年同录数量">-->
<div id="year" style="width: 100%;height: 500px"/> <!-- <div id="year" style="width: 100%;height: 500px"/>-->
</Card> <!-- </Card>-->
<Card title="本月同录数量"> <!-- <Card title="本月同录数量">-->
<div id="month" style="width: 100%;height: 500px"/> <!-- <div id="month" style="width: 100%;height: 500px"/>-->
</Card> <!-- </Card>-->
<Card title="本周同录数量"> <!-- <Card title="本周同录数量">-->
<div id="week" style="width: 100%;height: 500px"/> <!-- <div id="week" style="width: 100%;height: 500px"/>-->
</Card> <!-- </Card>-->
</div> </div>
</div> </div>
</div> </div>
@ -55,27 +55,41 @@ export default {
components: {Card}, components: {Card},
data() { data() {
return { return {
tongji: {} title: '总同录数量',
tongji: {},
chart: null
} }
}, },
async mounted() { async mounted() {
this.initialEcharts()
await this.getTongJi() await this.getTongJi()
await this.getPinTongJiData(document.getElementById('total'), 0) await this.getPinTongJiData(0)
await this.getPinTongJiData(document.getElementById('year'), 1) // await this.getPinTongJiData(document.getElementById('year'), 1)
await this.getPinTongJiData(document.getElementById('month'), 3) // await this.getPinTongJiData(document.getElementById('month'), 3)
await this.getPinTongJiData(document.getElementById('week'), 2) // await this.getPinTongJiData(document.getElementById('week'), 2)
}, },
methods: { methods: {
initialEcharts() {
if (this.chart) return
const dom = document.getElementById('total')
this.chart = echarts.init(dom)
this.chatOptions = this.getEchartsOptions([])
this.chart.setOption(this.chatOptions)
},
async handleChangeStatistics(type) {
this.title = ['总同录数量', '本年同录数量', '本季度同录数量', '本月同录数量'][type]
await this.getPinTongJiData(type)
},
async getTongJi() { async getTongJi() {
const data = await getTongJiData() const data = await getTongJiData()
this.tongji = data.data this.tongji = data.data
}, },
async getPinTongJiData(documentSelect, period) { async getPinTongJiData(period) {
const charts = echarts.init(documentSelect)
const {data} = await getPieData(period) const {data} = await getPieData(period)
charts.setOption(this.getEchartsOptions(data)) this.chart.setOption(this.getEchartsOptions(data))
}, },
getEchartsOptions(data) { getEchartsOptions(data) {
return { return {
@ -100,10 +114,10 @@ export default {
// borderColor: 'transparent', // borderColor: 'transparent',
// borderWidth: 10 // borderWidth: 10
// }, // },
data: data.map(r => ({ data: data?.map(r => ({
value: r.num, value: r.num,
name: r.clerk name: r.clerk
})) })) ?? []
} }
] ]
} }

2
vue.config.js
View File

@ -46,7 +46,7 @@ module.exports = {
// target: `http://120.79.202.7:443`, // target: `http://120.79.202.7:443`,
// target: `http://100.100.10.216:8099`, // target: `http://100.100.10.216:8099`,
// target: 'http://106.15.139.36:18090', // target: 'http://106.15.139.36:18090',
// target: 'http://192.168.3.12:18098/', //小乌龟本地 target: 'http://127.0.0.1:18098/', //小乌龟本地
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ['^' + process.env.VUE_APP_BASE_API]: ''