diff --git a/ruoyi-ui/src/assets/styles/picture-common.scss b/ruoyi-ui/src/assets/styles/picture-common.scss
index ef520f46..5975bfc0 100644
--- a/ruoyi-ui/src/assets/styles/picture-common.scss
+++ b/ruoyi-ui/src/assets/styles/picture-common.scss
@@ -801,7 +801,7 @@ text-align: center;
position: absolute;
width: 250rem !important;
top: $p-spacer-mini;
- right: 80rem;
+ right: 20rem;
background-color: transparent !important;
border-color: rgba($p-border-color, .5) !important;
color: #fff;
@@ -836,6 +836,57 @@ text-align: center;
}
}
+.p-flowyear-picker{
+ position: absolute;
+ width: 120rem !important;
+ top: $p-spacer-mini;
+ right: 20rem;
+ background-color: transparent !important;
+ border-color: rgba($p-border-color, .5) !important;
+ color: #fff;
+ .el-input__inner{ background: transparent !important;
+}
+/* 日期选择 */
+.p-flowdata-picker {
+ position: absolute;
+ width: 250rem !important;
+ top: $p-spacer-mini;
+ right: 40rem;
+ background-color: transparent !important;
+ border-color: rgba($p-border-color, .5) !important;
+ color: #fff;
+
+ color: rgba($p-secondary-color, 1) !important;}
+ .el-range-input {
+ background: transparent !important;
+ color: #fff !important;
+ }
+
+ .el-range-separator {
+ color: #fff !important;
+ }
+
+ .el-date-editor .el-range-input::-webkit-input-placeholder {
+ /* WebKit browsers，webkit内核浏览器 */
+ color: rgba($p-secondary-color, 1) !important;
+ }
+
+ .el-date-editor .el-range-input:-moz-placeholder {
+ /* Mozilla Firefox 4 to 18 */
+ color: rgba($p-secondary-color, 1) !important;
+ }
+
+ .el-date-editor .el-range-input::-moz-placeholder {
+ /* Mozilla Firefox 19+ */
+ color: rgba($p-secondary-color, 1) !important;
+ }
+
+ .el-date-editor .el-range-input:-ms-input-placeholder {
+ /* Internet Explorer 10+ */
+ color: rgba($p-secondary-color, 1) !important;
+ }
+}
+
.p-flowdata-popper {
background-color: rgba(#102032, 1) !important;
border-color: rgba($p-border-color, 1) !important;
diff --git a/ruoyi-ui/src/views/components/p-rank/BaseRank.vue b/ruoyi-ui/src/views/components/p-rank/BaseRank.vue
index 452fbf6e..f6bd7e20 100644
--- a/ruoyi-ui/src/views/components/p-rank/BaseRank.vue
+++ b/ruoyi-ui/src/views/components/p-rank/BaseRank.vue
@@ -67,13 +67,13 @@ export default {
}
.p-rank-top-rank {
- width: 20rem;
- height: 20rem;
+ width: 21rem;
+ height: 21rem;
margin-right: $p-spacer-mini;
line-height: 20rem;
text-align: center;
- background: url("~@/assets/images/p_rank_blue.svg");
- background-size: contain;
+ background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IHgxPSI1MCUiIHkxPSIwJSIgeDI9IjUwJSIgeTI9IjEwMCUiIGlkPSJhIj48c3RvcCBzdG9wLWNvbG9yPSIjRkZGIiBzdG9wLW9wYWNpdHk9IjAiIG9mZnNldD0iMCUiLz48c3RvcCBzdG9wLWNvbG9yPSIjRkZGIiBzdG9wLW9wYWNpdHk9Ii4xNiIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSIgaWQ9ImIiPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjI5NyIgb2Zmc2V0PSIwJSIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iMCIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSIgaWQ9ImMiPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjIwNCIgb2Zmc2V0PSIwJSIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjEwNCIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGcgZmlsbD0ibm9uZSI+PHBhdGggc3Ryb2tlLW9wYWNpdHk9Ii43IiBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iLjUiIGZpbGw9InVybCgjYSkiIGQ9Ik05IC4yODkuNTkgNS4xNDR2OS43MTJMOSAxOS43MWw4LjQxLTQuODU1VjUuMTQ0eiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAyKSIvPjxwYXRoIGZpbGw9InVybCgjYikiIHRyYW5zZm9ybT0icm90YXRlKDMwIDYuOTMyIDE2LjUyNikiIGQ9Ik01LjE2NCAxLjkyOGg4djE2aC04eiIvPjxwYXRoIGQ9Im05IDIgNi45MjggNHY4TDkgMThsLTYuOTI4LTRWNkw5IDJabTAgLjU3N0wyLjU3MSA2LjI4OXY3LjQyMUw5IDE3LjQyMmw2LjQyOC0zLjcxMlY2LjI4OUw5IDIuNTc3WiIgZmlsbD0idXJsKCNjKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAyKSIvPjwvZz48L3N2Zz4=);
+ background-size:26px;
background-position: center;
background-repeat: no-repeat;
}
@@ -95,57 +95,23 @@ export default {
}
.p-rank-box.rank1 {
- .p-rank-top-name, .p-rank-top-num, .p-rank-top-percentage {
- color: #e8415d;
+ .p-rank-top-num{color: rgb(255, 106, 20);font-size: 16px;}
+ .p-rank-top-name, .p-rank-top-percentage {
+ color: #fff;
}
.p-rank-top-rank {
- background: url("~@/assets/images/p_rank_first.svg");
- background-size: contain;
+ background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IHgxPSI1MCUiIHkxPSIwJSIgeDI9IjUwJSIgeTI9IjEwMCUiIGlkPSJhIj48c3RvcCBzdG9wLWNvbG9yPSIjRkZGIiBzdG9wLW9wYWNpdHk9IjAiIG9mZnNldD0iMCUiLz48c3RvcCBzdG9wLWNvbG9yPSIjRkZGIiBzdG9wLW9wYWNpdHk9Ii4xNiIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSIgaWQ9ImIiPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjI5NyIgb2Zmc2V0PSIwJSIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iMCIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSIgaWQ9ImMiPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjIwNCIgb2Zmc2V0PSIwJSIvPjxzdG9wIHN0b3AtY29sb3I9IiNGRkYiIHN0b3Atb3BhY2l0eT0iLjEwNCIgb2Zmc2V0PSIxMDAlIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PGcgZmlsbD0ibm9uZSI+PHBhdGggc3Ryb2tlLW9wYWNpdHk9Ii43IiBzdHJva2U9IiNGRkYiIHN0cm9rZS13aWR0aD0iLjUiIGZpbGw9InVybCgjYSkiIGQ9Ik05IC4yODkuNTkgNS4xNDR2OS43MTJMOSAxOS43MWw4LjQxLTQuODU1VjUuMTQ0eiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAyKSIvPjxwYXRoIGZpbGw9InVybCgjYikiIHRyYW5zZm9ybT0icm90YXRlKDMwIDYuOTMyIDE2LjUyNikiIGQ9Ik01LjE2NCAxLjkyOGg4djE2aC04eiIvPjxwYXRoIGQ9Im05IDIgNi45MjggNHY4TDkgMThsLTYuOTI4LTRWNkw5IDJabTAgLjU3N0wyLjU3MSA2LjI4OXY3LjQyMUw5IDE3LjQyMmw2LjQyOC0zLjcxMlY2LjI4OUw5IDIuNTc3WiIgZmlsbD0idXJsKCNjKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMyAyKSIvPjwvZz48L3N2Zz4=);
+ background-size:26px;
background-position: center;
background-repeat: no-repeat;
}
.p-rank-bar-inner {
- background: linear-gradient(to right, rgba(#e8415d, .2), rgba(#e8415d, 1));
- border-radius: 6rem;
- }
-}
-
-.p-rank-box.rank2 {
- .p-rank-top-rank {
- background: url("~@/assets/images/p_rank_second.svg");
- background-size: contain;
- background-position: center;
- background-repeat: no-repeat;
- }
-
- .p-rank-top-name, .p-rank-top-num, .p-rank-top-percentage {
- color: #f60;
- }
-
- .p-rank-bar-inner {
- background: linear-gradient(to right, rgba(#f60, .2), rgba(#f60, 1));
+ background-image: linear-gradient(90deg, #fe972a 0%, #fa3239 100%);
border-radius: 6rem;
}
}
-.p-rank-box.rank3 {
- .p-rank-top-rank {
- background: url("~@/assets/images/p_rank_third.svg");
- background-size: contain;
- background-position: center;
- background-repeat: no-repeat;
- }
-
- .p-rank-top-name, .p-rank-top-num, .p-rank-top-percentage {
- color: #e8cc41;
- }
-
- .p-rank-bar-inner {
- background: linear-gradient(to right, rgba(#e8cc41, .2), rgba(#e8cc41, 1));
- border-radius: 6rem;
- }
-}
diff --git a/ruoyi-ui/src/views/components/p-saturation/BaseSaturation.vue b/ruoyi-ui/src/views/components/p-saturation/BaseSaturation.vue
index eb155603..99c6c34d 100644
--- a/ruoyi-ui/src/views/components/p-saturation/BaseSaturation.vue
+++ b/ruoyi-ui/src/views/components/p-saturation/BaseSaturation.vue
@@ -5,8 +5,7 @@
diff --git a/ruoyi-ui/src/views/dashboard/eCharts1.vue b/ruoyi-ui/src/views/dashboard/eCharts1.vue
index 87f8cbf2..67cbb42b 100644
--- a/ruoyi-ui/src/views/dashboard/eCharts1.vue
+++ b/ruoyi-ui/src/views/dashboard/eCharts1.vue
@@ -8,7 +8,7 @@ import resize from './mixins/resize'// echarts 调整大小
//['blue','green','yellow','orange','red','purple','pink','lightBlue','lightGreen','lightYellow','lightOrange','lightPink','lightRed','lightPurple'],
const colorPalette = {
- blue: '#1976d2',
+ blue: '#C23531',
green: '#388e3c',
yellow: '#fbc02d',
orange: '#ff6600',
@@ -56,17 +56,17 @@ const config = {
yAxisWidth: 15,
xAxisHeight: 22,
legend: true,
- pageTextColor: 'rgba(255,255,255,1)',
- pageIconColor: 'rgba(255,255,255,1)',
+ pageTextColor: 'rgba(255,255,255,.4)',
+ pageIconColor: 'rgba(255,255,255,.4)',
pageIconSize: '10',
padding: [10, 10, 10, 10],
color: Object.values(colorPalette),
linearColor: Object.values(linearPalette),
rotate: false,
fontSize: 14,
- fontColor: 'rgba(255,255,255,.9)',
- legendColor: 'rgba(255,255,255,.9)',
- axisColor: 'rgba(255,255,255,.9)',
+ fontColor: 'rgba(255,255,255,.4)',
+ legendColor: 'rgba(255,255,255,.5)',
+ axisColor: 'rgba(255,255,255,.4)',
barWidth: 10,
smooth: true,
borderRadius: [10, 10, 0, 0],
diff --git a/ruoyi-ui/src/views/picture/scenic-flow/index.vue b/ruoyi-ui/src/views/picture/scenic-flow/index.vue
index 8b5a3f91..d14a5dcc 100644
--- a/ruoyi-ui/src/views/picture/scenic-flow/index.vue
+++ b/ruoyi-ui/src/views/picture/scenic-flow/index.vue
@@ -1,12 +1,13 @@
+
分析
+
@@ -47,26 +58,33 @@
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
-
+
@@ -144,6 +162,7 @@ export default {
components: {ScenicRing, scenicTime, scenicArea, baseRank},
data() {
return {
+ flowState: '进客流',
cityOptions: [{
value: '石家庄市',
label: '石家庄市'
@@ -175,24 +194,50 @@ export default {
value: '衡水市',
label: '衡水市'
}],
- city: '',
- scenic: '',
+ city: '石家庄市',
+ areaOptions: [{
+ value: '平山县',
+ label: '平山县'
+ },
+ {
+ value: '鹿泉区',
+ label: '鹿泉区'
+ },
+ {
+ value: '灵寿县',
+ label: '灵寿县'
+ },
+ {
+ value: '井陉县',
+ label: '井陉县'
+ },
+ {
+ value: '深泽县',
+ label: '深泽县'
+ },
+ {
+ value: '行唐县',
+ label: '行唐县'
+ }],
+ area: '平山县',
scenicOptions: [{
- value: '山海关景区',
- label: '山海关景区'
+ value: '西柏坡景区',
+ label: '西柏坡景区'
}, {
- value: '承德避暑山庄及周围寺庙景区',
- label: '承德避暑山庄及周围寺庙景区'
+ value: '南长城景区',
+ label: '南长城景区'
}, {
- value: '保定军校纪念馆',
- label: '保定军校纪念馆'
+ value: '韩信文化苑',
+ label: '韩信文化苑'
}, {
- value: '秦皇岛野生动物园',
- label: '秦皇岛野生动物园'
+ value: '乾隆碑亭',
+ label: '乾隆碑亭'
}, {
- value: '磬锤峰森林公园景区',
- label: '磬锤峰森林公园景区'
+ value: '毛泽东旧址',
+ label: '毛泽东旧址'
}],
+ scenic: '西柏坡景区',
+ yearData: '2023',
//实时客流统计 数据
FlowTimeData: {
saturatio: {name: "", percentage: ""},
@@ -217,7 +262,6 @@ export default {
startMonth: '',
endMonth: '',
FlowRankData: [],
-
}
},
created() {
@@ -235,6 +279,7 @@ export default {
this.getFlowRing();
//获取 按月客流分析 数据
this.getFlowMoon();
+ //获取 客流排行 数据
this.getFlowRank();
},
watch: {
@@ -253,62 +298,209 @@ export default {
MonthData: {
immediate: false,
handler(newValue, oldValue) {
+ console.log("newValue", newValue)
let datas = newValue
this.startMonth = this.$filter.formatDate(datas[0])
this.endMonth = this.$filter.formatDate(datas[1])
let backTime = {'startTime': this.startMonth, 'endTime': this.endMonth}
this.getFlowMoon(backTime)
+
}
},
+ //月份选择监听
+ yearData: {
+ immediate: false,
+ handler(newValue, oldValue) {
+ let backYear = newValue.getFullYear()
+ this.getFlowYear(backYear)
+ }
+ },
+
},
methods: {
- //获取 实时客流统计 数据
- getFlowTime() {
- getcurrentScenic().then(response => {
- this.FlowTimeData = response.data
- });
+ getflowState(scenic, state) {
+ this.flowState = state
+ this.getchange(scenic, state)
},
+ getchange(scenic, state) {//获取 实时客流统计 数据
+
+ let myScenic = ''
+ let myState = ''
+ if (scenic == '') {
+ myScenic = this.scenic
+ } else {
+ myScenic = scenic
+ }
+ if (state == '') {
+ myState = this.flowState
+ } else {
+ myState = state
+ }
+ if (state == '') {
+ this.flowState = '出客流'
+ } else {
+ this.flowState = state
+ }
+
+ //获取 实时客流统计 数据
+ this.getFlowTime(myScenic, myState);
+ //获取 分时段客流走势 数据
+ this.getFlowTrend(myScenic, myState);
+ //获取 未来七天客流预测 数据
+ this.getFlowYear(myScenic, myState);
+ //获取 区域客流监测 数据
+ this.getFlowArea(myScenic, myState);
+ //获取 按日客流分析 数据
+ this.getFlowToday(myScenic, myState);
+ //获取 客流同环比分析 数据
+ this.getFlowRing(myScenic, myState);
+ //获取 按月客流分析 数据
+ this.getFlowMoon(myScenic, myState);
+ //获取 客流排行 数据
+ this.getFlowRank(myScenic, myState);
+ },
+ //获取 实时客流统计 数据
+ getFlowTime(value) {
+ //getcurrentScenic().then(response => {
+ //this.FlowTimeData = response.data
+ //});
+ if (value == "西柏坡景区") {
+ this.FlowTimeData = {"dayNum": "824", "flowNum": "824", "alertNum": 8000, "maxLoad": "10000", "ratio": "0.00"}
+ } else if (value == "南长城景区") {
+ this.FlowTimeData = {"dayNum": "224", "flowNum": "224", "alertNum": 8000, "maxLoad": "10000", "ratio": "0.00"}
+ } else {
+ this.FlowTimeData = {"dayNum": "33", "flowNum": "33", "alertNum": 8000, "maxLoad": "10000", "ratio": "0.00"}
+ }
+ },
//获取 客流地排行 数据
getFlowRank(params) {
let num = 0
- getSelectTouristSource('0').then(response => {
- let newData = response.data.seriesData.slice(0, 5)
- let FlowRankData = newData.map((item, index) => {
- num = num + 1
- let itemData = {num: item.num, percentage: item.percentage, name: item.name, value: item.value, rank: num}
- return itemData
- });
- this.FlowRankData = FlowRankData
+ //getSelectTouristSource('0').then(response => {
+ // let newData = response.data.seriesData.slice(0, 5)
+ // let FlowRankData = newData.map((item, index) => {
+ // num = num + 1
+ // let itemData = {num: item.num, percentage: item.percentage, name: item.name, value: item.value, rank: num}
+ // return itemData
+ // });
+ // this.FlowRankData = FlowRankData
+ //});
+
+ let newData = [
+ {
+ num: 30,
+ name: '西柏坡景区',
+ percentage: '10'
+ }, {
+ num: 40,
+ name: '南长城景区',
+ percentage: '10'
+ }, {
+ num: 30,
+ name: '韩信文化苑',
+ percentage: '10'
+ }, {
+ num: 25,
+ name: '乾隆碑亭',
+ percentage: '10'
+ }, {
+ num: 10,
+ name: '毛泽东旧址',
+ percentage: '10'
+ }
+ ]
+ let FlowRankData = newData.map((item, index) => {
+ num = num + 1
+ let itemData = {num: item.num, percentage: item.percentage, name: item.name, rank: num}
+ return itemData
});
+ this.FlowRankData = FlowRankData
},
//获取 分时段客流走势 数据
- getFlowTrend() {
+ getFlowTrend(value, flowState) {
let Opts = {
unit: ['人次'],
extra: {
- line: {linearType: "custom",}
+ line: {}
}
}
this.FlowTrendData.eChartOpts = Opts
- getHourData().then(response => {
- this.FlowTrendData.eChartData = response.data
- });
+ //getHourData().then(response => {
+ //this.FlowTrendData.eChartData = response.data
+ //});
+
+ if (value == "西柏坡景区" && flowState == '进客流') {
+ this.FlowTrendData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["40", "10", "10", "20", "30", "50", "20"]}],
+ "name": "周客流数据",
+ "categories": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+ }
+ } else if (value == "南长城景区" && flowState == '进客流') {
+ this.FlowTrendData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["10", "20", "30", "0", "10", "20", "30",]}],
+ "name": "当日小时数据",
+ "categories": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+ }
+ } else if (value == "西柏坡景区" && flowState == '出客流') {
+ this.FlowTrendData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["30", "50", "40", "0", "10", "20", "10"]}],
+ "name": "当日小时数据",
+ "categories": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+ }
+ } else if (value == "南长城景区" && flowState == '出客流') {
+ this.FlowTrendData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["30", "10", "20", "30", "50", "40", "0"]}],
+ "name": "当日小时数据",
+ "categories": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+ }
+ } else {
+ this.FlowTrendData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["10", "20", "30", "50", "40", "10", "20"]}],
+ "name": "当日小时数据",
+ "categories": ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+ }
+ }
+
},
//获取 按年日客流分析 数据
- getFlowYear() {
+ getFlowYear(value, flowState) {
let Opts = {
unit: ['人次'],
- color: ['orange'],
extra: {
- area: {linearType: "custom",}
+ area: {}
}
}
this.FlowYearData.eChartOpts = Opts
- getYearData().then(response => {
- this.FlowYearData.eChartData = response.data
- });
+ //getYearData().then(response => {
+ // this.FlowYearData.eChartData = response.data
+ //});
+
+ if (value == "西柏坡景区" && flowState == '进客流') {
+ this.FlowYearData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["120", "150", "241"]}],
+ "name": "年度客流数据",
+ "categories": ["2021年", "2022年", "2023年"]
+ }
+ } else if (value == "西柏坡景区" && flowState == '出客流') {
+ this.FlowYearData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["241", "120", "150",]}],
+ "name": "年度客流数据",
+ "categories": ["2021年", "2022年", "2023年"]
+ }
+ } else if (value == "南长城景区" && flowState == '进客流') {
+ this.FlowYearData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["110", "200", "120",]}],
+ "name": "年度客流数据",
+ "categories": ["2021年", "2022年", "2023年"]
+ }
+ } else {
+ this.FlowYearData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["120", "150", "241"]}],
+ "name": "年度客流数据",
+ "categories": ["2021年", "2022年", "2023年"]
+ }
+ }
},
//获取 区域客流监测 数据
@@ -319,60 +511,226 @@ export default {
},
//获取 按日客流分析 数据
- getFlowToday(params) {
- let postParams = {}
+ getFlowToday(value, flowState) {
let Opts = {
unit: ['人次'],
- color: ['orange'],
extra: {
- area: {
- linearType: "custom",
- }
+ area: {}
}
}
+ let newDate = new Date()
+ this.startTime = this.$filter.funDate(7)
+ this.endTime = this.$filter.formatDate(newDate)
+
this.FlowTodayData.eChartOpts = Opts
- if (params == undefined) {
- let newDate = new Date()
- this.startTime = this.$filter.funDate(7)
- this.endTime = this.$filter.formatDate(newDate)
- postParams = {'startTime': this.startTime, 'endTime': this.endTime}
+ if (value == "西柏坡景区" && flowState == '进客流') {
+ this.FlowTodayData.eChartData = {
+ seriesData: [{"name": "人次", "value": ["20", "30", "50", "80", "30", "40", "20", "10"]}],
+ name: "按日客流分析",
+ categories: ["2023-10-20", "2023-10-21", "2023-10-22", "2023-10-23", "2023-10-24", "2023-10-25", "2023-10-26", "2023-10-27"]
+ }
+ } else if (value == "西柏坡景区" && flowState == '出客流') {
+ this.FlowTodayData.eChartData = {
+ seriesData: [{"name": "人次", "value": ["40", "50", "30", "90", "70", "10", "30", "50"]}],
+ name: "按日客流分析",
+ categories: ["2023-10-20", "2023-10-21", "2023-10-22", "2023-10-23", "2023-10-24", "2023-10-25", "2023-10-26", "2023-10-27"]
+ }
+ } else if (value == "南长城景区" && flowState == '进客流') {
+ this.FlowTodayData.eChartData = {
+ seriesData: [{"name": "人次", "value": ["70", "10", "30", "50", "40", "50", "30", "90"]}],
+ name: "按日客流分析",
+ categories: ["2023-10-20", "2023-10-21", "2023-10-22", "2023-10-23", "2023-10-24", "2023-10-25", "2023-10-26", "2023-10-27"]
+ }
} else {
- postParams = params
+ this.FlowTodayData.eChartData = {
+ seriesData: [{"name": "人次", "value": ["60", "30", "50", "10", "60", "50", "60", "10"]}],
+ name: "按日客流分析",
+ categories: ["2023-10-20", "2023-10-21", "2023-10-22", "2023-10-23", "2023-10-24", "2023-10-25", "2023-10-26", "2023-10-27"]
+ }
}
- getDayData(postParams).then(response => {
- this.FlowTodayData.eChartData = response.data
- });
},
//获取 客流同环比分析 数据
- getFlowRing() {
- getFlowRatio().then(response => {
- this.FlowRingData = response.data
- });
+ getFlowRing(value, flowState) {
+ //getFlowRatio().then(response => {
+ //this.FlowRingData=response.data
+ //});
+
+ if (value == "西柏坡景区") {
+ this.FlowRingData = [{
+ "lastTime": 50,
+ "lastTimeRatio": 0,
+ "lastYear": 50,
+ "name": "今日数据",
+ "sameTime": 50,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "昨日数据",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本周累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本月累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ },
+ {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本年累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }
+ ]
+ } else if (value == "南长城景区") {
+
+ this.FlowRingData = [{
+ "lastTime": 30,
+ "lastTimeRatio": 0,
+ "lastYear": 30,
+ "name": "今日数据",
+ "sameTime": 30,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "昨日数据",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本周累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本月累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ },
+ {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本年累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }
+ ]
+ } else {
+ this.FlowRingData = [{
+ "lastTime": 20,
+ "lastTimeRatio": 0,
+ "lastYear": 20,
+ "name": "今日数据",
+ "sameTime": 20,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "昨日数据",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本周累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }, {
+ "lastTime": 0,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本月累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ },
+ {
+ "lastTime": 60,
+ "lastTimeRatio": 0,
+ "lastYear": 0,
+ "name": "本年累计",
+ "sameTime": 0,
+ "lastYearRatio": 0
+ }
+ ]
+ }
},
//获取 按月客流分析 数据
- getFlowMoon(params) {
+ getFlowMoon(value, flowState) {
let postParams = {}
let Opts = {
unit: ['人次'],
extra: {
- column: {
- linearType: "custom",
- }
+ column: {}
}
}
this.FlowMoonData.eChartOpts = Opts
- if (params == undefined) {
+ // if (params == undefined) {
+ // this.startMonth = this.$filter.getMonths(-3)
+ // this.endMonth = this.$filter.getMonths(0)
+ // postParams = {'startTime': this.startMonth, 'endTime': this.endMonth}
+ // } else {
+ // postParams = params
+ // }
+ //getMonthData(postParams).then(response => {
+ //this.FlowMoonData.eChartData = response.data
+ //});
+
+
+ if (value == "西柏坡景区" && flowState == '进客流') {
+ this.startMonth = this.$filter.getMonths(-3)
+ this.endMonth = this.$filter.getMonths(0)
+ this.FlowMoonData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["50", "10", "60", "20"]}],
+ "name": "月度客流量数据",
+ "categories": ["2023-07", "2023-08", "2023-09", "2023-10"]
+ }
+ } else if (value == "西柏坡景区" && flowState == '出客流') {
this.startMonth = this.$filter.getMonths(-3)
this.endMonth = this.$filter.getMonths(0)
- postParams = {'startTime': this.startMonth, 'endTime': this.endMonth}
+ this.FlowMoonData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["10", "20", "30", "10"]}],
+ "name": "月度客流量数据",
+ "categories": ["2023-07", "2023-08", "2023-09", "2023-10"]
+ }
+ } else if (value == "南长城景区" && flowState == '进客流') {
+ this.FlowMoonData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["30", "10", "10", "20", ]}],
+ "name": "月度客流量数据",
+ "categories": ["2023-07", "2023-08", "2023-09", "2023-10"]
+ }
} else {
- postParams = params
+ this.startMonth = this.$filter.getMonths(-3)
+ this.endMonth = this.$filter.getMonths(0)
+ this.FlowMoonData.eChartData = {
+ "seriesData": [{"name": "人次", "value": ["15", "40", "10", "50"]}],
+ "name": "月度客流量数据",
+ "categories": ["2023-07", "2023-08", "2023-09", "2023-10"]
+ }
}
- getMonthData(postParams).then(response => {
- this.FlowMoonData.eChartData = response.data
- });
+
},
}
}
@@ -394,12 +752,16 @@ export default {
color: #fff;
left: 50%;
top: 50px;
- width: 700px;
+ width: 780px;
height: 100px;
background: rgba(#242323, .8);
transform: translate(-50%, 0);
border: 1px solid #fff;
- .p-filter-title{text-align: center; margin-bottom: 10px;}
+
+ .p-filter-title {
+ text-align: center;
+ margin-bottom: 10px;
+ }
}
.p-filter-box {
@@ -415,6 +777,11 @@ export default {
border-radius: 5px;
}
+ .button.active {
+ background: #C23531;
+ color: #fff;
+ }
+
.filter-box-item {
margin: 0 10px;
}
diff --git a/ruoyi-ui/src/views/picture/scenic-flow/scenic-ring.vue b/ruoyi-ui/src/views/picture/scenic-flow/scenic-ring.vue
index fd14b875..fb669bca 100644
--- a/ruoyi-ui/src/views/picture/scenic-flow/scenic-ring.vue
+++ b/ruoyi-ui/src/views/picture/scenic-flow/scenic-ring.vue
@@ -42,6 +42,14 @@ export default {
that.tableData = that.propsData
}, 1000);
},
+ watch: {
+ //日期选择监听
+ propsData: {
+ immediate: false,
+ handler(newValue, oldValue) {
+ this.tableData = newValue
+ }
+ }}
}