yxt_group
/
supervise
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

添加销售报表、在途商品管理表、阀值分析

master
yxt_njy 2 years ago
parent
e50d4b565e
commit
f09f3624ba
3 changed files with 533 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 151
      base-ui/src/views/reportCenter/goodsOnWay.vue
  2. 163
      base-ui/src/views/reportCenter/salesReport.vue
  3. 219
      base-ui/src/views/risk/thresholdAnalysis.vue

151
base-ui/src/views/reportCenter/goodsOnWay.vue
View File

@ -0,0 +1,151 @@
<template>
<div class="app-container">
<div style="margin-left: 16px;">
<h3>{{ name }}</h3>
</div>
<div class = "current-data">
<div class = "left">
<div class="top">
<span>当前数据</span>
<span>{{currentDate}}</span>
</div>
</div>
<div ref="charta" class ="middle">
</div>
<div class ="right" /></div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts'
export default {
name: '在途商品管理表',
// components: { },
data() {
return {
currentDate:"2023-01-01",
name: '在途商品管理表',
myCharta: null
}
},
created() {
// 初始化变量
// this.init()
// 加载列表
// this.getList()
},
beforeDestroy() {
if (this.myCharta) {
this.myCharta.dispose()
this.myCharta = null
}
},
mounted() {
this.$nextTick(() => {
this.initCharta()
})
},
methods: {
initCharta() {
// 基于准备好的dom，初始化echarts实例
this.myCharta = echarts.init(this.$refs.charta)
this.myCharta.setOption(
{
legend: {
top: 'bottom'
},
toolbox: {
show: true,
feature: {
mark: { show: true },
dataView: { show: true, readOnly: false },
restore: { show: true },
saveAsImage: { show: true }
}
},
series: [
{
name: 'Nightingale Chart',
type: 'pie',
radius: [50, 250],
center: ['50%', '50%'],
roseType: 'area',
itemStyle: {
borderRadius: 8
},
data:[
{
"value": 2313123,
"name": "订单总额"
},
{
"value": 4359354,
"name": "实际到货价值"
},
{
"value": 2313123,
"name": "在途货价值"
},
{
"value": 2313123,
"name": "超出价值"
}
]
}
]
}
)
},
getList() {},
// 返回
handleReturn() {
this.$router.go(-1)
}
}
}
</script>
<style>
.current-data{
width:100%;
height:500px;
display: flex;
}
.current-data .top{
height:30px;
line-height:30px;
width:100%;
}
.current-data .left{
background-color: aqua;
width:250px;
height:600px;
margin-left: 16px;
}
.current-data .middle{
width:600px;
height:600px;
float: left;
margin-left: 10px;
}
.current-data .right{
background-color: red;
width:700px;
height:600px;
float: left;
margin-left: 10px;
}
.current-data .right .top{
text-align: center;
}
.current-data .right .charts{
height:480px;
width:100%;
}
</style>

163
base-ui/src/views/reportCenter/salesReport.vue
View File

@ -0,0 +1,163 @@
<template>
<div class="app-container">
<div>
<h3>{{ name }}</h3>
</div>
<div class = "current-data">
<div class = "left">
<div class="top">
<span>当前数据</span>
<span>{{currentDate}}</span>
</div>
</div>
<div ref="charta" class ="right" /></div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts'
export default {
name: '销售报表',
// components: { },
data() {
return {
currentDate:"2023-01-01",
name: '销售报表',
myCharta: null
}
},
created() {
// 初始化变量
// this.init()
// 加载列表
// this.getList()
},
beforeDestroy() {
if (this.myCharta) {
this.myCharta.dispose()
this.myCharta = null
}
},
mounted() {
this.$nextTick(() => {
this.initCharta()
})
},
methods: {
initCharta() {
// 基于准备好的dom，初始化echarts实例
this.myCharta = echarts.init(this.$refs.charta)
this.myCharta.setOption({
legend: {},
tooltip: {},
dataset: {
"dimensions": [
"报表日期",
"销售商品收到的现金",
"收到其他与经营活动有关的现金"
],
"source": [
{
"报表日期": "2023-01-01",
"销售商品收到的现金": 123123.21,
"收到其他与经营活动有关的现金": 23554.43
},
{
"报表日期": "2023-01-02",
"销售商品收到的现金": 235553.23,
"收到其他与经营活动有关的现金": 234423.11
},
{
"报表日期": "2023-01-03",
"销售商品收到的现金": 347534.13,
"收到其他与经营活动有关的现金": 234234.11
},
{
"报表日期": "2023-01-04",
"销售商品收到的现金": 346532.21,
"收到其他与经营活动有关的现金": 234342.11
},
{
"报表日期": "2023-01-05",
"销售商品收到的现金": 345354.23,
"收到其他与经营活动有关的现金": 213123.11
},
{
"报表日期": "2023-01-06",
"销售商品收到的现金": 543266.23,
"收到其他与经营活动有关的现金": 34234.11
},
{
"报表日期": "2023-01-07",
"销售商品收到的现金": 564365.23,
"收到其他与经营活动有关的现金": 234342.11
}
]
},
xAxis: { type: 'category' },
yAxis: {},
// Declare several bar series, each will be mapped
// to a column of dataset.source by default.
series: [{ type: 'bar' }, { type: 'bar' }]
})
},
getList() {},
// 返回
handleReturn() {
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.current-data{
width:100%;
height:500px;
display: flex;
}
.current-data .top{
height:30px;
line-height:30px;
width:100%;
}
.current-data .left{
background-color: aqua;
width:450px;
height:500px;
margin-left: 16px;
}
.current-data .right{
width:1200px;
height:500px;
float: left;
margin-left: 10px;
}
.current-data .right .top{
text-align: center;
}
.current-data .right .charts{
height:480px;
width:100%;
}
.wenjiantit {
font-size: 16px;
font-weight: bold;
margin: 25px 0 10px 0;
}
.forminfo {
margin: 0;
padding: 0;
}
.listcon {
height: calc(100vh - 250px);
overflow-y: auto;
overflow-x: hidden;
}
</style>

219
base-ui/src/views/risk/thresholdAnalysis.vue
View File

@ -0,0 +1,219 @@
<template>
<div class="app-container">
<div style="margin-left:16px;">
<h3>{{ name }}</h3>
</div>
<div class = "current-data">
<div class = "upper">
</div>
<div ref="charta" class ="lower" /></div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts'
export default {
name: '阀值分析',
// components: { },
data() {
return {
currentDate:"2023-01-01",
name: '阀值分析',
myCharta: null,
}
},
created() {
// 初始化变量
// this.init()
// 加载列表
// this.getList()
},
beforeDestroy() {
if (this.myCharta) {
this.myCharta.dispose()
this.myCharta = null
}
},
mounted() {
this.$nextTick(() => {
// this.initChartaThreshold()
this.initCharta()
})
},
methods: {
initCharta() {
// 基于准备好的dom，初始化echarts实例
// this.myChartaThreshold = echarts.init(this.$refs.myChartaThreshold)
this.myCharta = echarts.init(this.$refs.charta)
this.myCharta.setOption(
{
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
toolbox: {
feature: {
dataView: { show: false, readOnly: false },
magicType: { show: false, type: ['line', 'bar'] },
restore: { show: false },
saveAsImage: { show: false }
}
},
legend: {
data: ['仓库货值', '在途货值', ' 门店货值', '帐户余额', '应收帐款', '借款金额', '阀值']
},
xAxis: [
{
type: 'category',
data: ['2023-01-01', '2023-01-02', '2023-01-03', '2023-01-04', '2023-01-05', '2023-01-06', '2023-01-07'],
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.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
]
},
{
name: '在途货值',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' 元';
}
},
data: [
2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
]
},
{
name: ' 门店货值',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' 元';
}
},
data: [
2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
]
},
{
name: '帐户余额',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' 元';
}
},
data: [
2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
]
},
{
name: '应收帐款',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + ' 元';
}
},
data: [
2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
]
},
{
name: '借款金额',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value + '元';
}
},
data: [
2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
]
},
{
name: '阀值',
type: 'line',
yAxisIndex: 1,
tooltip: {
valueFormatter: function (value) {
return value + '%';
}
},
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
},
]
}
)
},
getList() {},
// 返回
handleReturn() {
this.$router.go(-1)
}
}
}
</script>
<style>
.current-data{
width:100%;
height:500px;
}
.current-data .upper{
width:100%;
height:100px;
}
.current-data .lower{
width:100%;
height:600px;
float: left;
margin-left: 10px;
}
</style>
Write Preview
Loading…
Cancel
Save