Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
4844deea by renchao@pashanhoo.com
Options

Merge branch 'dev' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web into dev

2 parents 26ec19af 0f180440
Expand all
Inline Side-by-side
Showing 12 changed files with 1352 additions and 8 deletions
......@@ -17,6 +17,7 @@
"bpmn-js-token-simulation": "^0.10.0",
"core-js": "^3.6.5",
"diagram-js": "^6.8.2",
"echarts": "^5.4.3",
"js-cookie": "2.2.0",
"lodash": "^4.17.21",
"mxdraw": "^0.1.157",
......
......@@ -294,16 +294,22 @@ export const asyncRoutes = [
name: 'tjfx',
children: [
{
path: 'ywltj',
component: () => import('@/views/tjfx/ywltj/index.vue'),
name: 'qyxxba',
meta: { title: '业务量统计' }
path: 'bdcdjtjfx',
component: () => import('@/views/tjfx/bdcdjtjfx/index.vue'),
name: 'bdcdjtjfx',
meta: { title: '不动产登记统计分析' }
},
{
path: 'tjltj',
component: () => import('@/views/tjfx/tjltj/index.vue'),
name: 'tjltj',
meta: { title: '退件率统计' }
},
{
path: 'gzltj',
component: () => import('@/views/tjfx/gzltj/index.vue'),
name: 'gzltj',
meta: { title: '工作量统计' }
path: 'cstj',
component: () => import('@/views/tjfx/cstj/index.vue'),
name: 'cstj',
meta: { title: '超时统计' }
}
]
},
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="djlx">
<div class="inquire">
<el-form :model="queryForm" ref="queryForm" label-width="100px">
<el-row>
<el-col :span="6">
<el-form-item label="开始时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="结束时间" class="width100">
<el-date-picker
v-model="queryForm.kssj"
class="width100"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="区域" class="width100">
<el-select
v-model="queryForm.qy"
class="width100"
clearable
placeholder="请选择权利类型"
>
<el-option
v-for="item in dictData['A8']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="5" class="btnColRight">
<el-form-item>
<el-button
type="primary"
native-type="submit"
@click="handleSearch"
>查询</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<div class="concent">
<div class="left">
<el-table
height="187"
stripe
:data="tableList"
size="mini"
border
header-cell-class-name="table-header-gray"
>
<el-table-column
label="类型"
prop="name"
minWidth="100"
align="center" />
<el-table-column
label="数量"
prop="agent"
minWidth="120"
align="center"
/></el-table>
</div>
<div class="right">
<div ref="chart" style="width: 100%; height: 200px"></div>
</div>
</div>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
export default {
components: {},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data () {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-25 08:59:04
-->
<template>
<div class="yhjgba">
<el-row :gutter="8">
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">根据登记类型统计分析收件</h5>
</div>
<djlx/>
</el-card>
</el-col>
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">根据证书种类统计分析发证情况</h5>
</div>
<zszl/>
</el-card>
</el-col>
</el-row>
<el-row :gutter="8" class="marginTop10">
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">根据收件人统计分析收件</h5>
</div>
<djlx/>
</el-card>
</el-col>
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">收件日统计</h5>
</div>
<ul class="workbench flexst"></ul>
</el-card>
</el-col>
</el-row>
<el-row :gutter="8" class="marginTop10">
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">根据区域统计分析收件</h5>
</div>
<qytj/>
</el-card>
</el-col>
<el-col :span="12">
<el-card
shadow="hover"
:body-style="{ padding: '0' }"
style="height: 270px"
>
<div slot="header" class="flexst">
<h5 class="title">收件月统计</h5>
</div>
<ul class="workbench flexst"></ul>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
import * as echarts from "echarts";
import { mapGetters } from "vuex";
import djlx from "./components/djlx.vue";
import zszl from "./components/zszl.vue";
import qytj from "./components/qytj.vue";
export default {
components: {djlx,zszl,qytj},
computed: {
...mapGetters(["dictData", "transfer"]),
},
data() {
return {
queryForm: {},
tableList: [{ name: "111" }, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 23],
};
},
mounted() {
// 创建一个 ECharts 实例
this.chart = echarts.init(this.$refs.chart);
// 在 ECharts 实例中配置图表
this.chart.setOption(this.getOption());
},
methods: {
getOption() {
return {
tooltip: {
trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)",
},
series: [
{
name: "饼图名称",
type: "pie",
radius: ["20%", "70%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "数据1" },
{ value: 310, name: "数据2" },
{ value: 234, name: "数据3" },
{ value: 135, name: "数据4" },
{ value: 1548, name: "数据5" },
],
},
],
};
},
handleSearch() {},
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
/deep/.el-card__header {
padding: 8px 10px;
}
/deep/.el-card__body {
padding: 3px 10px 5px 10px;
overflow: hidden;
}
.yhjgba {
.el-col {
padding: 4px;
}
.inquire {
width: 100%;
height: 40px;
border: 1px solid rgb(184, 217, 243);
// background-color: rebeccapurple;
}
.concent {
width: 100%;
height: 300px;
display: flex;
.left {
width: 70%;
height: 200px;
}
.right {
width: 30%;
height: 200px;
}
}
}
</style>