统计分析
Showing
7 changed files
with
312 additions
and
76 deletions
| ... | @@ -58,3 +58,81 @@ export function exportTjtj (data) { | ... | @@ -58,3 +58,81 @@ export function exportTjtj (data) { |
| 58 | responseType: 'blob' | 58 | responseType: 'blob' |
| 59 | }) | 59 | }) |
| 60 | } | 60 | } |
| 61 | |||
| 62 | /** | ||
| 63 | * @description: getDjlxStatistic | ||
| 64 | * @author: | ||
| 65 | * @param data | ||
| 66 | */ | ||
| 67 | export function getDjlxStatistic (data) { | ||
| 68 | return request({ | ||
| 69 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getDjlxStatistic', | ||
| 70 | method: 'post', | ||
| 71 | data | ||
| 72 | }) | ||
| 73 | } | ||
| 74 | |||
| 75 | /** | ||
| 76 | * @description: getPrintBdcqzStatistic | ||
| 77 | * @author: | ||
| 78 | * @param data | ||
| 79 | */ | ||
| 80 | export function getPrintBdcqzStatistic (data) { | ||
| 81 | return request({ | ||
| 82 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getPrintBdcqzStatistic', | ||
| 83 | method: 'post', | ||
| 84 | data | ||
| 85 | }) | ||
| 86 | } | ||
| 87 | |||
| 88 | /** | ||
| 89 | * @description: getSlryStatistic | ||
| 90 | * @author: | ||
| 91 | * @param data | ||
| 92 | */ | ||
| 93 | export function getSlryStatistic (data) { | ||
| 94 | return request({ | ||
| 95 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getSlryStatistic', | ||
| 96 | method: 'post', | ||
| 97 | data | ||
| 98 | }) | ||
| 99 | } | ||
| 100 | |||
| 101 | /** | ||
| 102 | * @description: getAcceptMonthStatistic | ||
| 103 | * @author: | ||
| 104 | * @param data | ||
| 105 | */ | ||
| 106 | export function getAcceptMonthStatistic (data) { | ||
| 107 | return request({ | ||
| 108 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptMonthStatistic', | ||
| 109 | method: 'post', | ||
| 110 | data | ||
| 111 | }) | ||
| 112 | } | ||
| 113 | |||
| 114 | /** | ||
| 115 | * @description: getAcceptDayStatistic | ||
| 116 | * @author: | ||
| 117 | * @param data | ||
| 118 | */ | ||
| 119 | export function getAcceptDayStatistic (data) { | ||
| 120 | return request({ | ||
| 121 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptDayStatistic', | ||
| 122 | method: 'post', | ||
| 123 | data | ||
| 124 | }) | ||
| 125 | } | ||
| 126 | |||
| 127 | /** | ||
| 128 | * @description: getAcceptAreaStatistic | ||
| 129 | * @author: | ||
| 130 | * @param data | ||
| 131 | */ | ||
| 132 | export function getAcceptAreaStatistic (data) { | ||
| 133 | return request({ | ||
| 134 | url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptAreaStatistic', | ||
| 135 | method: 'post', | ||
| 136 | data | ||
| 137 | }) | ||
| 138 | } | ... | ... |
| ... | @@ -86,6 +86,7 @@ | ... | @@ -86,6 +86,7 @@ |
| 86 | </template> | 86 | </template> |
| 87 | <script> | 87 | <script> |
| 88 | import * as echarts from "echarts"; | 88 | import * as echarts from "echarts"; |
| 89 | import { getDjlxStatistic } from "@/api/tjfx.js"; | ||
| 89 | import { mapGetters } from "vuex"; | 90 | import { mapGetters } from "vuex"; |
| 90 | import { getdatamonth } from "@/utils/util"; | 91 | import { getdatamonth } from "@/utils/util"; |
| 91 | export default { | 92 | export default { |
| ... | @@ -97,27 +98,51 @@ export default { | ... | @@ -97,27 +98,51 @@ export default { |
| 97 | return { | 98 | return { |
| 98 | queryForm: { | 99 | queryForm: { |
| 99 | sj: [], | 100 | sj: [], |
| 101 | qy: '' | ||
| 100 | }, | 102 | }, |
| 101 | tableList: [ | 103 | tableList: [ |
| 102 | { name: "首次登记", value: "2" }, | 104 | // { name: "首次登记", value: "2" }, |
| 103 | { name: "变更登记", value: "12" }, | 105 | // { name: "变更登记", value: "12" }, |
| 104 | { name: "抵押登记", value: "23" }, | 106 | // { name: "抵押登记", value: "23" }, |
| 105 | { name: "转移登记", value: "33" }, | 107 | // { name: "转移登记", value: "33" }, |
| 106 | { name: "预告登记", value: "13" }, | 108 | // { name: "预告登记", value: "13" }, |
| 107 | { name: "注销登记", value: "3" }, | 109 | // { name: "注销登记", value: "3" }, |
| 108 | { name: "查封登记", value: "4" }, | 110 | // { name: "查封登记", value: "4" }, |
| 109 | { name: "其他登记", value: "26" }, | 111 | // { name: "其他登记", value: "26" }, |
| 110 | ], | 112 | ], |
| 111 | }; | 113 | }; |
| 112 | }, | 114 | }, |
| 113 | mounted() { | 115 | mounted() { |
| 114 | this.setdata(); | 116 | this.setdata(); |
| 115 | // 创建一个 ECharts 实例 | ||
| 116 | this.chart = echarts.init(this.$refs.chart); | ||
| 117 | // 在 ECharts 实例中配置图表 | ||
| 118 | this.chart.setOption(this.getOption()); | ||
| 119 | }, | 117 | }, |
| 120 | methods: { | 118 | methods: { |
| 119 | getDjlxStatistic() { | ||
| 120 | getDjlxStatistic( | ||
| 121 | { | ||
| 122 | startDate: this.queryForm.sj[0], | ||
| 123 | endDate: this.queryForm.sj[1], | ||
| 124 | qxdm: this.queryForm.qy | ||
| 125 | } | ||
| 126 | ).then(res => { | ||
| 127 | if (res.code === 200) { | ||
| 128 | this.tableList = [] | ||
| 129 | let dicList = this.dictData['A21'] | ||
| 130 | res.result.forEach(it=>{ | ||
| 131 | const matchingObject = dicList.find(obj => obj.dcode === it.DJLX); | ||
| 132 | const djlxmc = matchingObject != null ? matchingObject.dname : it.DJLX; | ||
| 133 | let obj = { | ||
| 134 | name: djlxmc, | ||
| 135 | value: it.SJCOUNT | ||
| 136 | } | ||
| 137 | this.tableList.push(obj) | ||
| 138 | }) | ||
| 139 | // 创建一个 ECharts 实例 | ||
| 140 | this.chart = echarts.init(this.$refs.chart); | ||
| 141 | // 在 ECharts 实例中配置图表 | ||
| 142 | this.chart.setOption(this.getOption()); | ||
| 143 | } | ||
| 144 | }) | ||
| 145 | }, | ||
| 121 | getOption() { | 146 | getOption() { |
| 122 | return { | 147 | return { |
| 123 | title: { | 148 | title: { |
| ... | @@ -171,10 +196,12 @@ export default { | ... | @@ -171,10 +196,12 @@ export default { |
| 171 | setdata() { | 196 | setdata() { |
| 172 | this.queryForm.sj = getdatamonth(); | 197 | this.queryForm.sj = getdatamonth(); |
| 173 | console.log("this.queryForm", this.queryForm); | 198 | console.log("this.queryForm", this.queryForm); |
| 199 | this.getDjlxStatistic() | ||
| 174 | }, | 200 | }, |
| 175 | 201 | ||
| 176 | handleSearch() { | 202 | handleSearch() { |
| 177 | console.log(" this.queryForm", this.queryForm); | 203 | console.log(" this.queryForm", this.queryForm); |
| 204 | this.getDjlxStatistic() | ||
| 178 | }, | 205 | }, |
| 179 | }, | 206 | }, |
| 180 | }; | 207 | }; | ... | ... |
| ... | @@ -68,28 +68,56 @@ | ... | @@ -68,28 +68,56 @@ |
| 68 | <script> | 68 | <script> |
| 69 | import * as echarts from "echarts"; | 69 | import * as echarts from "echarts"; |
| 70 | import { getdatamonth } from "@/utils/util"; | 70 | import { getdatamonth } from "@/utils/util"; |
| 71 | import { getAcceptAreaStatistic } from "@/api/tjfx.js"; | ||
| 72 | import {mapGetters} from "vuex"; | ||
| 71 | export default { | 73 | export default { |
| 72 | components: {}, | 74 | components: {}, |
| 75 | computed: { | ||
| 76 | ...mapGetters(["dictData"]), | ||
| 77 | }, | ||
| 73 | data() { | 78 | data() { |
| 74 | return { | 79 | return { |
| 75 | queryForm: {}, | 80 | queryForm: {}, |
| 76 | tableList: [ | 81 | tableList: [ |
| 77 | { name: "浐灞", value: "2" }, | 82 | // { name: "浐灞", value: "2" }, |
| 78 | { name: "长安", value: "12" }, | 83 | // { name: "长安", value: "12" }, |
| 79 | { name: "莲湖", value: "23" }, | 84 | // { name: "莲湖", value: "23" }, |
| 80 | { name: "高新", value: "33" }, | 85 | // { name: "高新", value: "33" }, |
| 81 | { name: "高新", value: "33" }, | 86 | // { name: "高新", value: "33" }, |
| 82 | ], | 87 | ], |
| 83 | }; | 88 | }; |
| 84 | }, | 89 | }, |
| 85 | mounted() { | 90 | mounted() { |
| 86 | this.setdata(); | 91 | this.setdata(); |
| 87 | // 创建一个 ECharts 实例 | ||
| 88 | this.chart = echarts.init(this.$refs.chart); | ||
| 89 | // 在 ECharts 实例中配置图表 | ||
| 90 | this.chart.setOption(this.getOption()); | ||
| 91 | }, | 92 | }, |
| 92 | methods: { | 93 | methods: { |
| 94 | |||
| 95 | getAcceptAreaStatistic() { | ||
| 96 | getAcceptAreaStatistic({ | ||
| 97 | startDate: this.queryForm.sj[0], | ||
| 98 | endDate: this.queryForm.sj[1], | ||
| 99 | qxdm: this.queryForm.qy | ||
| 100 | }).then(res => { | ||
| 101 | if (res.code === 200) { | ||
| 102 | this.tableList = [] | ||
| 103 | let dicList = this.dictData['A20'] | ||
| 104 | res.result.forEach(it=>{ | ||
| 105 | const matchingObject = dicList.find(obj => obj.dcode === it.QXDM); | ||
| 106 | const qxmc = matchingObject != null ? matchingObject.dname : it.QXDM; | ||
| 107 | let obj = { | ||
| 108 | name: qxmc, | ||
| 109 | value: it.SJCOUNT | ||
| 110 | } | ||
| 111 | this.tableList.push(obj) | ||
| 112 | }) | ||
| 113 | // 创建一个 ECharts 实例 | ||
| 114 | this.chart = echarts.init(this.$refs.chart); | ||
| 115 | // 在 ECharts 实例中配置图表 | ||
| 116 | this.chart.setOption(this.getOption()); | ||
| 117 | } | ||
| 118 | }) | ||
| 119 | }, | ||
| 120 | |||
| 93 | getOption() { | 121 | getOption() { |
| 94 | return { | 122 | return { |
| 95 | title: { | 123 | title: { |
| ... | @@ -143,9 +171,11 @@ export default { | ... | @@ -143,9 +171,11 @@ export default { |
| 143 | setdata() { | 171 | setdata() { |
| 144 | this.queryForm.sj = getdatamonth(); | 172 | this.queryForm.sj = getdatamonth(); |
| 145 | console.log("this.queryForm", this.queryForm); | 173 | console.log("this.queryForm", this.queryForm); |
| 174 | this.getAcceptAreaStatistic() | ||
| 146 | }, | 175 | }, |
| 147 | handleSearch() { | 176 | handleSearch() { |
| 148 | console.log(" this.queryForm", this.queryForm); | 177 | console.log(" this.queryForm", this.queryForm); |
| 178 | this.getAcceptAreaStatistic() | ||
| 149 | }, | 179 | }, |
| 150 | }, | 180 | }, |
| 151 | }; | 181 | }; | ... | ... |
| ... | @@ -87,6 +87,7 @@ | ... | @@ -87,6 +87,7 @@ |
| 87 | import * as echarts from "echarts"; | 87 | import * as echarts from "echarts"; |
| 88 | import { mapGetters } from "vuex"; | 88 | import { mapGetters } from "vuex"; |
| 89 | import { getdatamonth } from "@/utils/util"; | 89 | import { getdatamonth } from "@/utils/util"; |
| 90 | import { getSlryStatistic } from "@/api/tjfx.js"; | ||
| 90 | export default { | 91 | export default { |
| 91 | components: {}, | 92 | components: {}, |
| 92 | computed: { | 93 | computed: { |
| ... | @@ -94,22 +95,46 @@ export default { | ... | @@ -94,22 +95,46 @@ export default { |
| 94 | }, | 95 | }, |
| 95 | data() { | 96 | data() { |
| 96 | return { | 97 | return { |
| 97 | queryForm: {}, | 98 | queryForm: { |
| 99 | qy: '' | ||
| 100 | }, | ||
| 98 | tableList: [ | 101 | tableList: [ |
| 99 | { name: "小红", value: "2" }, | 102 | // { name: "小红", value: "2" }, |
| 100 | { name: "小张", value: "12" }, | 103 | // { name: "小张", value: "12" }, |
| 101 | { name: "小王", value: "23" }, | 104 | // { name: "小王", value: "23" }, |
| 102 | ], | 105 | ], |
| 103 | }; | 106 | }; |
| 104 | }, | 107 | }, |
| 105 | mounted() { | 108 | mounted() { |
| 106 | this.setdata(); | 109 | this.setdata(); |
| 107 | // 创建一个 ECharts 实例 | ||
| 108 | this.chart = echarts.init(this.$refs.chart); | ||
| 109 | // 在 ECharts 实例中配置图表 | ||
| 110 | this.chart.setOption(this.getOption()); | ||
| 111 | }, | 110 | }, |
| 112 | methods: { | 111 | methods: { |
| 112 | getSlryStatistic() { | ||
| 113 | getSlryStatistic({ | ||
| 114 | startDate: this.queryForm.sj[0], | ||
| 115 | endDate: this.queryForm.sj[1], | ||
| 116 | qxdm: this.queryForm.qy | ||
| 117 | }).then(res => { | ||
| 118 | if (res.code === 200) { | ||
| 119 | this.tableList = [] | ||
| 120 | res.result.forEach(it=>{ | ||
| 121 | let obj = { | ||
| 122 | name: it.SLRY, | ||
| 123 | value: it.SJCOUNT | ||
| 124 | } | ||
| 125 | this.tableList.push(obj) | ||
| 126 | }) | ||
| 127 | // 创建一个 ECharts 实例 | ||
| 128 | this.chart = echarts.init(this.$refs.chart); | ||
| 129 | // 在 ECharts 实例中配置图表 | ||
| 130 | this.chart.setOption(this.getOption()); | ||
| 131 | // 创建一个 ECharts 实例 | ||
| 132 | this.chart = echarts.init(this.$refs.chart); | ||
| 133 | // 在 ECharts 实例中配置图表 | ||
| 134 | this.chart.setOption(this.getOption()); | ||
| 135 | } | ||
| 136 | }) | ||
| 137 | }, | ||
| 113 | getOption() { | 138 | getOption() { |
| 114 | return { | 139 | return { |
| 115 | title: { | 140 | title: { |
| ... | @@ -163,9 +188,11 @@ export default { | ... | @@ -163,9 +188,11 @@ export default { |
| 163 | setdata() { | 188 | setdata() { |
| 164 | this.queryForm.sj = getdatamonth(); | 189 | this.queryForm.sj = getdatamonth(); |
| 165 | console.log("this.queryForm", this.queryForm); | 190 | console.log("this.queryForm", this.queryForm); |
| 191 | this.getSlryStatistic() | ||
| 166 | }, | 192 | }, |
| 167 | handleSearch() { | 193 | handleSearch() { |
| 168 | console.log(" this.queryForm", this.queryForm); | 194 | console.log(" this.queryForm", this.queryForm); |
| 195 | this.getSlryStatistic() | ||
| 169 | }, | 196 | }, |
| 170 | }, | 197 | }, |
| 171 | }; | 198 | }; | ... | ... |
| ... | @@ -56,8 +56,27 @@ | ... | @@ -56,8 +56,27 @@ |
| 56 | </div> | 56 | </div> |
| 57 | </template> | 57 | </template> |
| 58 | <script> | 58 | <script> |
| 59 | function getFirstAndLastDayOfMonth(dateString) { | ||
| 60 | const date = new Date(dateString); | ||
| 61 | const firstDay = new Date(date.getFullYear(), date.getMonth(), 1); | ||
| 62 | const lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0); | ||
| 63 | |||
| 64 | // 将日期格式化为 "yyyy-MM-dd" | ||
| 65 | const formatDate = (d) => { | ||
| 66 | const year = d.getFullYear(); | ||
| 67 | const month = String(d.getMonth() + 1).padStart(2, '0'); | ||
| 68 | const day = String(d.getDate()).padStart(2, '0'); | ||
| 69 | return `${year}-${month}-${day}`; | ||
| 70 | }; | ||
| 71 | |||
| 72 | return { | ||
| 73 | firstDay: formatDate(firstDay), | ||
| 74 | lastDay: formatDate(lastDay) | ||
| 75 | }; | ||
| 76 | } | ||
| 59 | import * as echarts from "echarts"; | 77 | import * as echarts from "echarts"; |
| 60 | import { mapGetters } from "vuex"; | 78 | import { mapGetters } from "vuex"; |
| 79 | import { getAcceptDayStatistic } from "@/api/tjfx.js"; | ||
| 61 | export default { | 80 | export default { |
| 62 | components: {}, | 81 | components: {}, |
| 63 | computed: { | 82 | computed: { |
| ... | @@ -66,23 +85,11 @@ export default { | ... | @@ -66,23 +85,11 @@ export default { |
| 66 | data() { | 85 | data() { |
| 67 | return { | 86 | return { |
| 68 | queryForm: { | 87 | queryForm: { |
| 69 | monthValue:"" | 88 | monthValue:"", |
| 89 | qy: '' | ||
| 70 | }, | 90 | }, |
| 71 | datas: [12, 23, 15, 28, 37, 11, 13, 32, 34, 56, 12, 15], | 91 | datas: [], |
| 72 | datatime: [ | 92 | datatime: [], |
| 73 | "1日", | ||
| 74 | "2日", | ||
| 75 | "4日", | ||
| 76 | "5日", | ||
| 77 | "7日", | ||
| 78 | "10日", | ||
| 79 | "14日", | ||
| 80 | "15日", | ||
| 81 | "17日", | ||
| 82 | "19日", | ||
| 83 | "20日", | ||
| 84 | "21日", | ||
| 85 | ], | ||
| 86 | 93 | ||
| 87 | }; | 94 | }; |
| 88 | }, | 95 | }, |
| ... | @@ -101,16 +108,13 @@ export default { | ... | @@ -101,16 +108,13 @@ export default { |
| 101 | console.log("this.queryForm",this.queryForm); | 108 | console.log("this.queryForm",this.queryForm); |
| 102 | }, | 109 | }, |
| 103 | mounted() { | 110 | mounted() { |
| 104 | // 创建一个 ECharts 实例 | 111 | this.handleSearch() |
| 105 | this.chart = echarts.init(this.$refs.chart); | ||
| 106 | // 在 ECharts 实例中配置图表 | ||
| 107 | this.chart.setOption(this.getOption()); | ||
| 108 | }, | 112 | }, |
| 109 | methods: { | 113 | methods: { |
| 110 | getOption() { | 114 | getOption() { |
| 111 | return { | 115 | return { |
| 112 | title: { | 116 | title: { |
| 113 | text: "2023年11月收件情况 ", // 主标题名称 | 117 | text: "收件情况统计(月) ", // 主标题名称 |
| 114 | 118 | ||
| 115 | textStyle: { | 119 | textStyle: { |
| 116 | //主标题文本设置 | 120 | //主标题文本设置 |
| ... | @@ -168,7 +172,20 @@ export default { | ... | @@ -168,7 +172,20 @@ export default { |
| 168 | }; | 172 | }; |
| 169 | }, | 173 | }, |
| 170 | 174 | ||
| 171 | handleSearch() {}, | 175 | handleSearch() { |
| 176 | const { firstDay, lastDay } = getFirstAndLastDayOfMonth(this.queryForm.monthValue); | ||
| 177 | getAcceptDayStatistic({startDate: firstDay, endDate: lastDay, qxdm: this.queryForm.qy}).then(res => { | ||
| 178 | if (res.code === 200) { | ||
| 179 | let dataSource = res.result | ||
| 180 | this.datas = dataSource.map(item => item.SJCOUNT) | ||
| 181 | this.datatime = dataSource.map(item => item.SJDAY) | ||
| 182 | // 创建一个 ECharts 实例 | ||
| 183 | this.chart = echarts.init(this.$refs.chart); | ||
| 184 | // 在 ECharts 实例中配置图表 | ||
| 185 | this.chart.setOption(this.getOption()); | ||
| 186 | } | ||
| 187 | }) | ||
| 188 | }, | ||
| 172 | }, | 189 | }, |
| 173 | }; | 190 | }; |
| 174 | </script> | 191 | </script> | ... | ... |
| ... | @@ -14,6 +14,7 @@ | ... | @@ -14,6 +14,7 @@ |
| 14 | class="width100" | 14 | class="width100" |
| 15 | v-model="queryForm.sj" | 15 | v-model="queryForm.sj" |
| 16 | type="year" | 16 | type="year" |
| 17 | @change="chooseDateRange" | ||
| 17 | placeholder="选择年" | 18 | placeholder="选择年" |
| 18 | > | 19 | > |
| 19 | </el-date-picker> | 20 | </el-date-picker> |
| ... | @@ -58,7 +59,7 @@ | ... | @@ -58,7 +59,7 @@ |
| 58 | <script> | 59 | <script> |
| 59 | import * as echarts from "echarts"; | 60 | import * as echarts from "echarts"; |
| 60 | import { mapGetters } from "vuex"; | 61 | import { mapGetters } from "vuex"; |
| 61 | 62 | import { getAcceptMonthStatistic } from "@/api/tjfx.js"; | |
| 62 | export default { | 63 | export default { |
| 63 | components: {}, | 64 | components: {}, |
| 64 | computed: { | 65 | computed: { |
| ... | @@ -67,50 +68,44 @@ export default { | ... | @@ -67,50 +68,44 @@ export default { |
| 67 | data() { | 68 | data() { |
| 68 | return { | 69 | return { |
| 69 | queryForm: { | 70 | queryForm: { |
| 70 | sj:"" | 71 | sj:"", |
| 72 | year: "", | ||
| 73 | qy: '' | ||
| 71 | }, | 74 | }, |
| 75 | datetime: [], | ||
| 76 | datas: [] | ||
| 72 | }; | 77 | }; |
| 73 | }, | 78 | }, |
| 74 | created() { | 79 | created() { |
| 75 | var tempDate = new Date(); | 80 | var tempDate = new Date(); |
| 81 | this.queryForm.sj = tempDate | ||
| 76 | var year = tempDate.getFullYear(); | 82 | var year = tempDate.getFullYear(); |
| 77 | console.log("year", year); | 83 | console.log("year", year); |
| 78 | // 默认当月 | 84 | // 默认当月 |
| 79 | 85 | ||
| 80 | this.$set(this.queryForm, "sj", year.toString()); | 86 | this.$set(this.queryForm, "year", year.toString()); |
| 81 | console.log("this.queryForm",this.queryForm); | 87 | console.log("this.queryForm",this.queryForm); |
| 82 | }, | 88 | }, |
| 83 | mounted() { | 89 | mounted() { |
| 84 | // 创建一个 ECharts 实例 | 90 | this.handleSearch() |
| 85 | this.chart = echarts.init(this.$refs.chart); | ||
| 86 | // 在 ECharts 实例中配置图表 | ||
| 87 | this.chart.setOption(this.getOption()); | ||
| 88 | }, | 91 | }, |
| 89 | methods: { | 92 | methods: { |
| 93 | chooseDateRange() { | ||
| 94 | var year = this.queryForm.sj.getFullYear(); | ||
| 95 | this.$set(this.queryForm, "year", year.toString()); | ||
| 96 | this.handleSearch() | ||
| 97 | }, | ||
| 90 | getOption() { | 98 | getOption() { |
| 91 | return { | 99 | return { |
| 92 | xAxis: { | 100 | xAxis: { |
| 93 | type: "category", | 101 | type: "category", |
| 94 | data: [ | 102 | data: this.datatime, |
| 95 | "1月", | ||
| 96 | "2月", | ||
| 97 | "3月", | ||
| 98 | "4月", | ||
| 99 | "5月", | ||
| 100 | "6月", | ||
| 101 | "7月", | ||
| 102 | "8月", | ||
| 103 | "9月", | ||
| 104 | "10月", | ||
| 105 | "11月", | ||
| 106 | "12月", | ||
| 107 | ], | ||
| 108 | }, | 103 | }, |
| 109 | yAxis: { | 104 | yAxis: { |
| 110 | type: "value", | 105 | type: "value", |
| 111 | }, | 106 | }, |
| 112 | title: { | 107 | title: { |
| 113 | text: "2023年收件情况 ", // 主标题名称 | 108 | text: "收件情况统计(年) ", // 主标题名称 |
| 114 | 109 | ||
| 115 | textStyle: { | 110 | textStyle: { |
| 116 | //主标题文本设置 | 111 | //主标题文本设置 |
| ... | @@ -149,7 +144,7 @@ export default { | ... | @@ -149,7 +144,7 @@ export default { |
| 149 | }, | 144 | }, |
| 150 | series: [ | 145 | series: [ |
| 151 | { | 146 | { |
| 152 | data: [38, 42, 50, 157, 40, 45, 60, 140, 36, 47, 54, 143], | 147 | data: this.datas, |
| 153 | barWidth: 40, | 148 | barWidth: 40, |
| 154 | type: "bar", | 149 | type: "bar", |
| 155 | }, | 150 | }, |
| ... | @@ -157,7 +152,22 @@ export default { | ... | @@ -157,7 +152,22 @@ export default { |
| 157 | }; | 152 | }; |
| 158 | }, | 153 | }, |
| 159 | 154 | ||
| 160 | handleSearch() {}, | 155 | handleSearch() { |
| 156 | console.log(this.queryForm) | ||
| 157 | let startAt = this.queryForm.year + '-01-01' | ||
| 158 | let endAt = this.queryForm.year + '-12-31' | ||
| 159 | getAcceptMonthStatistic({startDate: startAt, endDate: endAt, qxdm: this.queryForm.qy}).then(res => { | ||
| 160 | if (res.code === 200) { | ||
| 161 | let dataSource = res.result | ||
| 162 | this.datas = dataSource.map(item => item.SJCOUNT) | ||
| 163 | this.datatime = dataSource.map(item => item.SJMONTH) | ||
| 164 | // 创建一个 ECharts 实例 | ||
| 165 | this.chart = echarts.init(this.$refs.chart); | ||
| 166 | // 在 ECharts 实例中配置图表 | ||
| 167 | this.chart.setOption(this.getOption()); | ||
| 168 | } | ||
| 169 | }) | ||
| 170 | }, | ||
| 161 | }, | 171 | }, |
| 162 | }; | 172 | }; |
| 163 | </script> | 173 | </script> | ... | ... |
| ... | @@ -84,6 +84,7 @@ | ... | @@ -84,6 +84,7 @@ |
| 84 | </div> | 84 | </div> |
| 85 | </template> | 85 | </template> |
| 86 | <script> | 86 | <script> |
| 87 | import { getPrintBdcqzStatistic } from "@/api/tjfx.js"; | ||
| 87 | import * as echarts from "echarts"; | 88 | import * as echarts from "echarts"; |
| 88 | import { mapGetters } from "vuex"; | 89 | import { mapGetters } from "vuex"; |
| 89 | import { getdatamonth } from "@/utils/util"; | 90 | import { getdatamonth } from "@/utils/util"; |
| ... | @@ -94,7 +95,9 @@ export default { | ... | @@ -94,7 +95,9 @@ export default { |
| 94 | }, | 95 | }, |
| 95 | data() { | 96 | data() { |
| 96 | return { | 97 | return { |
| 97 | queryForm: {}, | 98 | queryForm: { |
| 99 | qy: '' | ||
| 100 | }, | ||
| 98 | tableList: [ | 101 | tableList: [ |
| 99 | { name: "单一版不动产权证书", value: "459" }, | 102 | { name: "单一版不动产权证书", value: "459" }, |
| 100 | { name: "不动产登记证明", value: "164" }, | 103 | { name: "不动产登记证明", value: "164" }, |
| ... | @@ -110,6 +113,48 @@ export default { | ... | @@ -110,6 +113,48 @@ export default { |
| 110 | this.chart.setOption(this.getOption()); | 113 | this.chart.setOption(this.getOption()); |
| 111 | }, | 114 | }, |
| 112 | methods: { | 115 | methods: { |
| 116 | getPrintBdcqzStatistic() { | ||
| 117 | getPrintBdcqzStatistic({ | ||
| 118 | startDate: this.queryForm.sj[0], | ||
| 119 | endDate: this.queryForm.sj[1], | ||
| 120 | qxdm: this.queryForm.qy | ||
| 121 | }).then(res => { | ||
| 122 | if (res.code === 200) { | ||
| 123 | this.tableList = [] | ||
| 124 | res.result.forEach(it=>{ | ||
| 125 | let obj = { | ||
| 126 | name: it.BDCQZLX == '1' ? '单一版不动产权证书' : '不动产登记证明', | ||
| 127 | ky: it.BDCQZLX, | ||
| 128 | value: it.SJCOUNT | ||
| 129 | } | ||
| 130 | this.tableList.push(obj) | ||
| 131 | }) | ||
| 132 | const hasBdclx1 = this.tableList.some(item => item.ky === '1'); | ||
| 133 | if (!hasBdclx1) { | ||
| 134 | let obj1 = { | ||
| 135 | name: '单一版不动产权证书', | ||
| 136 | ky: '1', | ||
| 137 | value: 0 | ||
| 138 | } | ||
| 139 | this.tableList.push(obj1) | ||
| 140 | } | ||
| 141 | const hasBdclx2 = this.tableList.some(item => item.ky === '2'); | ||
| 142 | if (!hasBdclx2) { | ||
| 143 | let obj2 = { | ||
| 144 | name: '不动产登记证明', | ||
| 145 | ky: '2', | ||
| 146 | value: 0 | ||
| 147 | } | ||
| 148 | this.tableList.push(obj2) | ||
| 149 | } | ||
| 150 | |||
| 151 | // 创建一个 ECharts 实例 | ||
| 152 | this.chart = echarts.init(this.$refs.chart); | ||
| 153 | // 在 ECharts 实例中配置图表 | ||
| 154 | this.chart.setOption(this.getOption()); | ||
| 155 | } | ||
| 156 | }) | ||
| 157 | }, | ||
| 113 | getOption() { | 158 | getOption() { |
| 114 | return { | 159 | return { |
| 115 | title: { | 160 | title: { |
| ... | @@ -163,9 +208,11 @@ export default { | ... | @@ -163,9 +208,11 @@ export default { |
| 163 | setdata() { | 208 | setdata() { |
| 164 | this.queryForm.sj = getdatamonth(); | 209 | this.queryForm.sj = getdatamonth(); |
| 165 | console.log("this.queryForm", this.queryForm); | 210 | console.log("this.queryForm", this.queryForm); |
| 211 | this.getPrintBdcqzStatistic() | ||
| 166 | }, | 212 | }, |
| 167 | handleSearch() { | 213 | handleSearch() { |
| 168 | console.log(" this.queryForm", this.queryForm); | 214 | console.log(" this.queryForm", this.queryForm); |
| 215 | this.getPrintBdcqzStatistic() | ||
| 169 | }, | 216 | }, |
| 170 | }, | 217 | }, |
| 171 | }; | 218 | }; | ... | ... |
-
Please register or sign in to post a comment