From 204cae9df06661ef0013cb64510777ed997cd8d3 Mon Sep 17 00:00:00 2001
From: hailu <962012470@qq.com>
Date: 星期四, 23 十一月 2023 13:48:37 +0800
Subject: [PATCH] 主营
---
src/view/MacIndustryAnalysisroData/agriculture/comSearch.vue | 515 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 510 insertions(+), 5 deletions(-)
diff --git a/src/view/MacIndustryAnalysisroData/agriculture/comSearch.vue b/src/view/MacIndustryAnalysisroData/agriculture/comSearch.vue
index 419fedf..25dc60f 100644
--- a/src/view/MacIndustryAnalysisroData/agriculture/comSearch.vue
+++ b/src/view/MacIndustryAnalysisroData/agriculture/comSearch.vue
@@ -1,15 +1,520 @@
<template>
<div>
+ <Card style="margin-top: 3px;">
+ <div style="display: flex;flex-wrap: wrap;">
+ <div style="width: 400px;height: 400px;" id="echarts1"></div>
+ <div style="width: 400px;height: 400px;" id="echarts2"></div>
+ <div style="width: 400px;height: 400px;" id="echarts3"></div>
+ </div>
+
+ </Card>
+ <Card style="margin-top: 3px;">
+ <CheckboxGroup v-model="exchangeCode">
+ <Checkbox label="SH">涓婃捣璇佸埜浜ゆ槗鎵�</Checkbox>
+ <Checkbox label="SZ">娣卞湷璇佸埜浜ゆ槗鎵�</Checkbox>
+ <Checkbox label="HK">棣欐腐鑱斿悎浜ゆ槗鎵�</Checkbox>
+ </CheckboxGroup>
+ <div class="rentScrollOut table" style="margin-top: 12px;">
+ <Table border :columns="tableListColumns" :data="tableList" :loading="loading" max-height="600">
+ <template slot="CompanyName" slot-scope="params">
+ <div>
+ <Tag color="primary">{{ params.row.ExchangeCode }}</Tag>
+ {{ params.row.CompanyName }}
+ </div>
+
+ </template>
+ </Table>
+ <div style="margin-top: 12px">
+ <Page :current="pageIndex" :total="TotalItems" :page-size="pageSize" style="text-align: right"
+ @on-change="changePageIndex" show-elevator />
+ </div>
+ </div>
+ </Card>
</div>
</template>
<script>
- export default {
-
+import * as echarts from 'echarts';
+
+import axios from '@/libs/api.request'
+export default {
+ data() {
+ return {
+ pageIndex: 1,
+ TotalItems: 0,
+ pageSize: 10,
+ tableList: [],
+ exchangeCode: ['SH', 'SZ', 'HK'],
+ loading: false,
+ tableListColumns: [],
+ }
+ },
+ mounted() {
+ this.GetChainIncomeCostPage()
+ this.setEcharts1()
+ this.setEcharts2()
+ this.setEcharts3()
+ },
+ methods: {
+ //鑾峰彇琛ㄦ牸鏁版嵁
+ GetChainIncomeCostPage() {
+ this.loading = true
+ let data = {
+ pageIndex: this.pageIndex,
+ pageSize: this.pageSize,
+ exchangeCodes: this.exchangeCode,
+ }
+ axios.request({
+ url: 'rcy/GetChainIncomeCostPage',
+ method: 'POST',
+ data: data
+ }).then((res) => {
+ if (res.data.Check) {
+ console.log(res.data);
+ this.tableList = res.data.Data.Items
+ this.TotalItems = res.data.Data.TotalItems
+ this.tableListColumns = this.setTableListColumns()
+ this.loading = false
+ } else {
+ this.tableList = [{}]
+ this.TotalItems = 0
+ this.loading = false
+ }
+ }).catch((err) => {
+ this.tableList = [{}]
+ this.TotalItems = 0
+ this.loading = false
+ console.log(err);
+ })
+ },
+ setTableListColumns() {
+ let columns = []
+ columns.push({
+ title: '搴忓彿',
+ key: 'Id',
+ render: (h, params) => {
+ return h('span', params.index + this.pageIndex * 10 - 9)
+ },
+ width: 80,
+ align: 'center',
+ fixed: 'left'
+ })
+ columns.push({
+ title: '浼佷笟鍚嶇О',
+ slot: 'CompanyName',
+ // key: 'CompanyName',
+ // render: (h, params) => {
+ // return h('span', params.row.CompanyName ? params.row.CompanyName : '--')
+ // },
+ minWidth: 120,
+ align: 'left',
+ })
+ columns.push({
+ title: '2023涓姤',
+ align: 'center',
+ children: [
+ {
+ title: '浜у搧鏀跺叆(浜垮厓)',
+ key: 'Income2023',
+ render: (h, params) => {
+ return h('span', params.row.Income2023 ? this.CustomMethods.numTo$(params.row.Income2023) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧鎴愭湰(浜垮厓)',
+ key: 'Cost2023',
+ render: (h, params) => {
+ return h('span', params.row.Cost2023 ? this.CustomMethods.numTo$(params.row.Cost2023) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧姣涘埄鐜�(%)',
+ key: 'GrossMargin2023',
+ render: (h, params) => {
+ return h('span', params.row.GrossMargin2023 ? params.row.GrossMargin2023 : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ }
+ ]
+ })
+ columns.push({
+ title: '2022涓姤',
+ align: 'center',
+ children: [
+ {
+ title: '浜у搧鏀跺叆(浜垮厓)',
+ key: 'Income2022',
+ render: (h, params) => {
+ return h('span', params.row.Income2022 ? this.CustomMethods.numTo$(params.row.Income2022) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧鎴愭湰(浜垮厓)',
+ key: 'Cost2022',
+ render: (h, params) => {
+ return h('span', params.row.Cost2022 ? this.CustomMethods.numTo$(params.row.Cost2022) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧姣涘埄鐜�(%)',
+ key: 'GrossMargin2022',
+ render: (h, params) => {
+ return h('span', params.row.GrossMargin2022 ? params.row.GrossMargin2022 : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ }
+ ]
+ })
+ columns.push({
+ title: '2021涓姤',
+ align: 'center',
+ children: [
+ {
+ title: '浜у搧鏀跺叆(浜垮厓)',
+ key: 'Income2021',
+ render: (h, params) => {
+ return h('span', params.row.Income2021 ? this.CustomMethods.numTo$(params.row.Income2021) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧鎴愭湰(浜垮厓)',
+ key: 'Cost2021',
+ render: (h, params) => {
+ return h('span', params.row.Cost2021 ? this.CustomMethods.numTo$(params.row.Cost2021) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧姣涘埄鐜�(%)',
+ key: 'GrossMargin2021',
+ render: (h, params) => {
+ return h('span', params.row.GrossMargin2021 ? params.row.GrossMargin2021 : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ }
+ ]
+ })
+ columns.push({
+ title: '2020涓姤',
+ align: 'center',
+ children: [
+ {
+ title: '浜у搧鏀跺叆(浜垮厓)',
+ key: 'Income2020',
+ render: (h, params) => {
+ return h('span', params.row.Income2020 ? this.CustomMethods.numTo$(params.row.Income2020) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧鎴愭湰(浜垮厓)',
+ key: 'Cost2020',
+ render: (h, params) => {
+ return h('span', params.row.Cost2020 ? this.CustomMethods.numTo$(params.row.Cost2020) : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ },
+ {
+ title: '浜у搧姣涘埄鐜�(%)',
+ key: 'GrossMargin2020',
+ render: (h, params) => {
+ return h('span', params.row.GrossMargin2020 ? params.row.GrossMargin2020 : '--')
+ },
+ minWidth: 80,
+ align: 'center',
+ }
+ ]
+ })
+ return columns
+
+
+
+
+
+
+ },
+ changePageIndex(e) {
+ this.pageIndex = e
+ this.GetChainIncomeCostPage()
+ },
+ setEcharts1() {
+ var chartDom = document.getElementById('echarts1');
+ var myChart = echarts.init(chartDom);
+ var option;
+ option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ crossStyle: {
+ color: '#999'
+ }
+ }
+ },
+ title: {
+ text: '涓昏惀浜у搧鏀跺叆',
+ show: true,
+
+ },
+ legend: {
+ data: ['浜垮厓', '鐧惧垎姣�']
+ },
+ xAxis: [
+ {
+ type: 'category',
+ data: ['2023', '2022', '2021', '2020'],
+ axisPointer: {
+ type: 'shadow'
+ }
+ }
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ name: '浜垮厓',
+ min: 0,
+ max: 250,
+ interval: 50,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ },
+ {
+ type: 'value',
+ name: '%',
+ min: 0,
+ max: 25,
+ interval: 5,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '浜垮厓',
+ type: 'bar',
+ // tooltip: {
+ // valueFormatter: function (value) {
+ // return value + '';
+ // }
+ // },
+ data: [
+ 2.6, 5.9, 9.0, 26.4,
+ ]
+ },
+ {
+ name: '鐧惧垎姣�',
+ type: 'line',
+ yAxisIndex: 1,
+ // tooltip: {
+ // valueFormatter: function (value) {
+ // return value + ' 掳C';
+ // }
+ // },
+ data: [2.0, 2.2, 3.3, 4.5,]
+ }
+ ]
+ };
+ option && myChart.setOption(option);
+
+ },
+ setEcharts2() {
+ var chartDom = document.getElementById('echarts2');
+ var myChart = echarts.init(chartDom);
+ var option;
+ option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ crossStyle: {
+ color: '#999'
+ }
+ }
+ },
+ title: {
+ text: '涓昏惀浜у搧鎴愭湰',
+ show: true,
+
+ },
+ legend: {
+ data: ['浜垮厓', '鐧惧垎姣�']
+ },
+ xAxis: [
+ {
+ type: 'category',
+ data: ['2023', '2022', '2021', '2020'],
+ axisPointer: {
+ type: 'shadow'
+ }
+ }
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ name: '浜垮厓',
+ min: 0,
+ max: 250,
+ interval: 50,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ },
+ {
+ type: 'value',
+ name: '%',
+ min: 0,
+ max: 25,
+ interval: 5,
+ axisLabel: {
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '浜垮厓',
+ type: 'bar',
+ // tooltip: {
+ // valueFormatter: function (value) {
+ // return value + '';
+ // }
+ // },
+ data: [
+ 2.6, 5.9, 9.0, 26.4,
+ ]
+ },
+ {
+ name: '鐧惧垎姣�',
+ type: 'line',
+ yAxisIndex: 1,
+ // tooltip: {
+ // valueFormatter: function (value) {
+ // return value + ' 掳C';
+ // }
+ // },
+ data: [2.0, 2.2, 3.3, 4.5,]
+ }
+ ]
+ };
+ option && myChart.setOption(option);
+ },
+ setEcharts3() {
+ var chartDom = document.getElementById('echarts3');
+ var myChart = echarts.init(chartDom);
+ var option;
+ option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ crossStyle: {
+ color: '#999'
+ }
+ }
+ },
+ title: {
+ text: '涓昏惀浜у搧姣涘埄鐜�',
+ show: true,
+ },
+ xAxis: {
+ type: 'category',
+ data: ['2023', '2022', '2021', '2020',]
+ },
+ yAxis: {
+ name: '%',
+ type: 'value'
+ },
+ series: [
+ {
+ name: '鐧惧垎姣�',
+ data: [120, 200, 150, 80,],
+ type: 'bar'
+ }
+ ]
+ }
+ option && myChart.setOption(option);
+ },
+ },
+ watch: {
+ exchangeCode(newVal, oldVal) {
+ this.changePageIndex(1)
+ }
+ },
+ computed: {
+ // tableListColumns() {
+ // let columns = []
+ // columns.push({
+ // title: '搴忓彿',
+ // key: 'Id',
+ // render: (h, params) => {
+ // return h('span', params.index + this.pageIndex * 10 - 9)
+ // },
+ // width: 80,
+ // align: 'center',
+ // fixed: 'left'
+ // })
+ // columns.push({
+ // title: '浼佷笟鍚嶇О',
+ // key: 'CompanyName',
+ // render: (h, params) => {
+ // return h('span', params.row.CompanyName ? params.row.CompanyName : '--')
+ // },
+ // minWidth: 80,
+ // align: 'center',
+ // fixed: 'left'
+ // })
+ // columns.push({
+ // title: '2023涓姤',
+ // key: 'Qymc',
+ // children: [
+ // {
+ // title: 'Age',
+ // key: 'age',
+ // align: 'center',
+ // width: 200,
+ // sortable: true
+ // },
+ // ]
+ // })
+ // columns.push({
+ // title: '2022涓姤',
+ // key: 'Ygs',
+ // children: [
+ // {
+ // title: 'Age',
+ // key: 'age',
+ // align: 'center',
+ // width: 200,
+ // sortable: true
+ // },
+ // ]
+ // })
+ // return columns
+ // },
+
}
+
+
+}
</script>
-<style lang="less" scoped>
-
-</style>
\ No newline at end of file
+<style lang="less" scoped></style>
\ No newline at end of file
--
Gitblit v1.8.0