Browse Source

首页大屏前端1.0

main
parent
commit
1aab61ab13
  1. 16
      src/api/data/basicScreen.ts
  2. 1
      src/views/data/Mail12337.vue
  3. 205
      src/views/datav/Gobal.vue
  4. 20
      src/views/datav/SceneInsp.vue

16
src/api/data/basicScreen.ts

@ -6,6 +6,9 @@ import request from "@/api/request";
* @date: 2024-011-7
*/
/*
*
*/
export function getAllGobalCount(times) {
return request.get({
url: `/datav/dataGobalScreen?beginTime=${times[0]}&endTime=${times[1]}`
@ -13,6 +16,19 @@ export function getAllGobalCount(times) {
}
/**
*
*/
export function getGobalRecentlyTrendByMonth(year) {
return request.get({
url: `/datav/dataGobalScreen/getGobalRecentlyTrendByMonth?year=${year}`
});
}

1
src/views/data/Mail12337.vue

@ -246,6 +246,7 @@ const query = ref({
current: 1,
responderKey: "name",
problemSourcesCode: ProblemSources.XF12337,
checkStatus: 1
});
const list = ref([]);

205
src/views/datav/Gobal.vue

@ -6,7 +6,6 @@
<el-row :gutter="16">
<el-col :span="6">
<datav-card title="机构问题排名" sub-title="问题数">
<datav-tabs
v-model="activeOrgTab"
type="bottom-button"
@ -14,7 +13,7 @@
<datav-tab-item label="分县市局" name="1">
<el-scrollbar height="300px">
<datav-chart-bar
:data="data1"
:data="fxsjlist"
size="large"
:max="11"
:color="colors"
@ -24,7 +23,7 @@
<datav-tab-item label="局属单位" name="2">
<el-scrollbar height="300px">
<datav-chart-bar
:data="data1"
:data="jsdwlist"
:max="11"
size="large"
:color="colors"
@ -33,60 +32,12 @@
</datav-tab-item>
</datav-tabs>
</datav-card>
<datav-card title="警务评议">
<el-row class="mb-32">
<el-col :span="6">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
4323
</div>
<div class="descriptions_label">
样本总数
</div>
</div>
</el-col>
<el-col :span="6">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
4323
</div>
<div class="descriptions_label">
满意/共本满意数
</div>
</div>
</el-col>
<el-col :span="6">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
2356
</div>
<div class="descriptions_label">
不满意数
</div>
</div>
</el-col>
<el-col :span="6">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
91%
</div>
<div class="descriptions_label">
满意率
</div>
</div>
</el-col>
</el-row>
<datav-chart-bar
title="满意率排名"
sub-title="满意样本数/样本总数"
:data="data1"
<datav-card title="业务类型占比">
<v-charts
style="height: 320px"
:option="zfbaPieOption"
autoresize
/>
<div class="flex tab-title flex center mt-16">
<div class="tab-title-item active">
分县市局
</div>
<div class="tab-title-item">局属单位</div>
</div>
</datav-card>
</el-col>
<el-col :span="12">
@ -133,7 +84,7 @@
<datav-card title="问题趋势">
<v-charts
style="height: 300px"
:option="option1"
:option="proTrend"
autoresize
/>
</datav-card>
@ -194,55 +145,18 @@
<div class="tab-title-item">局属单位</div>
</div>
</datav-card>
<datav-card title="案件核查">
<el-row class="mb-32">
<el-col :span="8">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
4323
</div>
<div class="descriptions_label">
问题数
</div>
</div>
</el-col>
<el-col :span="8">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
4323
</div>
<div class="descriptions_label">
问题数
</div>
</div>
</el-col>
<el-col :span="8">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
91%
</div>
<div class="descriptions_label">
问题数
</div>
</div>
</el-col>
</el-row>
<datav-chart-bar
title="满意率排名"
sub-title="满意样本数/样本总数"
:data="data1"
<datav-card title="问题类型占比">
<v-charts
style="height: 320px"
:option="zfbaPieOption"
autoresize
/>
<div class="flex tab-title flex center mt-16">
<div class="tab-title-item active">
分县市局
</div>
<div class="tab-title-item">局属单位</div>
</div>
</datav-card>
</el-col>
</el-row>
</main>
</div>
</el-scrollbar>
</template>
<script setup>
@ -251,7 +165,7 @@ import changshaMap from "@/assets/data/changsha.json";
import * as echarts from "echarts/core";
import moment from "moment/moment";
import {getCaseVerifData} from "@/api/datav";
import {getAllGobalCount} from "@/api/data/basicScreen.ts";
import {getAllGobalCount, getGobalRecentlyTrendByMonth} from "@/api/data/basicScreen.ts";
const router = useRouter();
@ -301,26 +215,12 @@ const option = {
],
};
const option1 = ref({
// 线
const proTrend =ref({
xAxis: {
type: "category",
boundaryGap: false,
data: [
"9/10",
"9/11",
"9/12",
"9/13",
"9/14",
"9/15",
"9/16",
"9/17",
"9/18",
"9/19",
"9/20",
"9/21",
"9/22",
"9/23",
],
data: [],
},
yAxis: {
type: "value",
@ -329,14 +229,23 @@ const option1 = ref({
lineStyle: {
color: "#193775",
},
}
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'line',
label: {
backgroundColor: '#6a7985'
}
}
},
series: [
{
type: "line",
smooth: true,
label: {
show: false,
show: false
},
lineStyle: {
color: "#28E6FF",
@ -354,10 +263,7 @@ const option1 = ref({
},
]),
},
data: [
2000, 1160, 2310, 3000, 3100, 3100, 3100, 2000, 1160, 2310,
3000, 3100, 3100, 3100,
],
data: [],
},
],
});
@ -399,7 +305,49 @@ function go() {
// region
const activeOrgTab = ref("1");
const fxsjlist = ref([]);
const jsdwlist = ref([]);
const ywzblist = ref([]);
const wtlxlist = ref([]);
// endregion
// region
//
const zfbaPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: ywzblist.value,
},
],
};
});
//
const wtlxPieOption = computed(() => {
return {
tooltip: {
trigger: "item",
},
series: [
{
type: "pie",
radius: ["40%", "70%"],
label: {
color: "#fff",
},
data: wtlxlist.value,
},
],
};
});
// endregion
// region
@ -418,10 +366,16 @@ const time = ref([
]);
function getData() {
getAllGobalCount(time.value).then((res) => {
console.log(res);
console.log(res.overview)
overview.value = res.overview;
fxsjlist.value = res.fxsjlist;
jsdwlist.value = res.jsdwlist;
ywzblist.value = res.ywzblist;
});
getGobalRecentlyTrendByMonth(new Date().getFullYear()).then((res) => {
proTrend.value.xAxis.data = res.monthList;
proTrend.value.series[0].data = res.totalList;
});
}
@ -430,6 +384,7 @@ watch(time, () => {
});
onMounted(() => {
getData();
});
const colors = [

20
src/views/datav/SceneInsp.vue

@ -136,9 +136,15 @@
</datav-card>
</el-col>
<el-col :span="6">
<datav-card >
<datav-card>
<datav-tabs v-model="activeTabRight" size="small">
<!-- <el-row class="mb-32">
<datav-tab-item label="枪支管理" name="1">
<datav-tabs
v-model="activeMailTabRight"
type="bottom-button"
>
<el-row class="mb-32">
<el-col :span="6">
<div class="descriptions_cell text-center">
<div class="descriptions_content">
@ -179,12 +185,7 @@
</div>
</div>
</el-col>
</el-row> -->
<datav-tab-item label="枪支管理" name="1">
<datav-tabs
v-model="activeMailTabRight"
type="bottom-button"
>
</el-row>
<datav-tab-item label="分县市局" name="1">
<el-scrollbar height="300px">
<datav-chart-bar-mail
@ -192,7 +193,6 @@
size="large"
/>
</el-scrollbar>
</datav-tab-item>
<datav-tab-item label="局属单位" name="2">
<el-scrollbar height="300px">
@ -307,7 +307,7 @@
</datav-tab-item>
</datav-tabs>
<!-- <datav-chart-bar
<!-- <datav-chart-bar
title="问题数排名"
sub-title="问题数"
:data="data2"

Loading…
Cancel
Save