Browse Source

更改

wangqin
zhangzhang 12 months ago
parent
commit
fe9107d78a
  1. 94
      ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue
  2. 79
      ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue
  3. 70
      ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/FatigueWakesUp/index.vue
  4. 5
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/auditAnalytics/StatsDialogVisible/index.vue
  5. 2
      ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js
  6. 18
      ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue
  7. 16
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/TemperatureTrend/assets/charts.js
  8. 16
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/visibilityTrends/assets/charts.js
  9. 6
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js
  10. 39
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/index.vue
  11. 1
      ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue
  12. 2
      ruoyi-ui/src/views/JiHeExpressway/pages/service/sensitive/index.vue

94
ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue

@ -1,20 +1,37 @@
<template> <template>
<div class='Descriptions keep-ratio' origin="left" :style="getStyle()"> <div class="Descriptions keep-ratio" origin="left" :style="getStyle()">
<div class="item" v-for="(item, index) in getResolveList" :key="`${item.key || item.label}${index}`" <div
:style="[gridStyle(item, index), transformStyle(itemStyle)]"> class="item"
<div class="text title" :style="{ v-for="(item, index) in getResolveList"
...transformStyle(titleStyle), :key="`${item.key || item.label}${index}`"
width: labelWidth :style="[gridStyle(item, index), transformStyle(itemStyle)]"
}"> >
<div
class="text title"
:style="{
...transformStyle(titleStyle),
width: labelWidth,
}"
>
<p> <p>
<slot :name="`title-${item.key || item.label}`" :data="item"> <slot :name="`title-${item.key || item.label}`" :data="item">
{{ item.label || '-' }} {{ item.label || "-" }}
</slot> </slot>
</p>: </p>
:
</div> </div>
<ContentText :style="transformStyle(titleStyle)" class="content text" :data="data" :_config="item"> <ContentText
:style="transformStyle(titleStyle)"
class="content text"
:data="data"
:_config="item"
>
<template #default="{ value }"> <template #default="{ value }">
<slot :name="`content-${item.key || item.label}`" :value="value" :data="item"> <slot
:name="`content-${item.key || item.label}`"
:value="value"
:data="item"
>
{{ value }} {{ value }}
</slot> </slot>
</template> </template>
@ -24,18 +41,18 @@
</template> </template>
<script> <script>
import { getContent } from "@screen/components/FormConfig/utils/index.js" import { getContent } from "@screen/components/FormConfig/utils/index.js";
import ContentText from "@screen/components/FormConfig/components/Text.vue" import ContentText from "@screen/components/FormConfig/components/Text.vue";
export default { export default {
name: 'Descriptions', name: "Descriptions",
components: { components: {
ContentText ContentText,
}, },
props: { props: {
data: { data: {
type: Object, type: Object,
default: () => ({}) default: () => ({}),
}, },
/** /**
* { * {
@ -47,74 +64,73 @@ export default {
*/ */
list: { list: {
type: Array, type: Array,
default: () => [] default: () => [],
}, },
column: { column: {
type: String, type: String,
default: "2" default: "2",
}, },
labelWidth: String, labelWidth: String,
titleStyle: { titleStyle: {
type: [String, Object], type: [String, Object],
default: null default: null,
}, },
contentStyle: { contentStyle: {
type: [String, Object], type: [String, Object],
default: null default: null,
}, },
itemStyle: { itemStyle: {
type: [String, Object], type: [String, Object],
default: null default: null,
} },
}, },
computed: { computed: {
gridStyle() { gridStyle() {
return (item, index) => ({ return (item, index) => ({
gridRow: `span ${item.gridRow || 1}`, gridRow: `span ${item.gridRow || 1}`,
gridColumn: `span ${item.gridColumn || 1}`, gridColumn: `span ${item.gridColumn || 1}`,
}) });
}, },
getText() { getText() {
return (item) => getContent(this.data, item) return (item) => getContent(this.data, item);
}, },
getResolveList() { getResolveList() {
return this.list.reduce((prev, data) => { return this.list.reduce((prev, data) => {
if (typeof data.visible === "function") {
if (typeof data.visible === 'function') {
if (!data.visible(data)) return prev; if (!data.visible(data)) return prev;
} }
prev.push(data); prev.push(data);
return prev return prev;
}, []) }, []);
} },
}, },
methods: { methods: {
getStyle() { getStyle() {
return { return {
gridTemplateColumns: `repeat(${this.column}, 1fr)`, gridTemplateColumns: `repeat(${this.column}, 1fr)`,
} };
}, },
getComponent(type) { getComponent(type) {
return `Form${type.replace(/^[a-z]/, word => word.toUpperCase())}` return `Form${type.replace(/^[a-z]/, (word) => word.toUpperCase())}`;
}, },
transformStyle(style) { transformStyle(style) {
if (typeof style != 'string') return style; if (typeof style != "string") return style;
return style.split(';').reduce((prev, cur) => { return style.split(";").reduce((prev, cur) => {
const [key, value] = cur.split(":"); const [key, value] = cur.split(":");
prev[key] = value; prev[key] = value;
return prev; return prev;
}, {}); }, {});
} },
} },
} };
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.Descriptions { .Descriptions {
display: grid; display: grid;
gap: 9px; gap: 9px;
@ -123,7 +139,7 @@ export default {
font-size: 15px; font-size: 15px;
font-family: PingFang SC, PingFang SC; font-family: PingFang SC, PingFang SC;
font-weight: 400; font-weight: 400;
color: #FFF; color: #fff;
line-height: 18px; line-height: 18px;
gap: 3px; gap: 3px;
display: flex; display: flex;
@ -135,7 +151,7 @@ export default {
gap: 6px; gap: 6px;
.title { .title {
color: #3DE8FF; color: #3de8ff;
p { p {
width: 100%; width: 100%;

79
ruoyi-ui/src/views/JiHeExpressway/components/Dialog/index.vue

@ -1,22 +1,38 @@
<template> <template>
<Teleport> <Teleport>
<Transition name="fade"> <Transition name="fade">
<div :class="['mask-layer', { 'none-mask': noneMask }]" v-if="modelVisible"> <div
<BackgroundClip class='dialog' :class="['mask-layer', { 'none-mask': noneMask }]"
v-if="modelVisible"
>
<BackgroundClip
class="dialog"
clipPath="polygon(calc(100% - var(--clip-width)) 0, 100% var(--clip-width), 100% 100%, var(--clip-width) 100%, 0 calc(100% - var(--clip-width)), 0 0)" clipPath="polygon(calc(100% - var(--clip-width)) 0, 100% var(--clip-width), 100% 100%, var(--clip-width) 100%, 0 calc(100% - var(--clip-width)), 0 0)"
borderColor="linear-gradient(180deg, rgba(78, 174, 204, .9), rgba(78, 174, 204, 0))" borderColor="linear-gradient(180deg, rgba(78, 174, 204, .9), rgba(78, 174, 204, 0))"
bgColor="linear-gradient(180deg, rgba(14, 69, 92, 0.9) 0%, rgba(20, 89, 119, 0.9) 100%)" ref="DialogContentRef"> bgColor="linear-gradient(180deg, rgba(14, 69, 92, 0.9) 0%, rgba(20, 89, 119, 0.9) 100%)"
ref="DialogContentRef"
>
<div class="dialog-title"> <div class="dialog-title">
<img class="title-icon" src="@screen/images/dialog/title-icon.svg" /> <img
class="title-icon"
src="@screen/images/dialog/title-icon.svg"
/>
<span>{{ title }}</span> <span>{{ title }}</span>
<img class="icon-close" @click.stop="modelVisible = false" src="@screen/images/dialog/icon-close.svg" /> <img
class="icon-close"
@click.stop="modelVisible = false"
src="@screen/images/dialog/icon-close.svg"
/>
</div> </div>
<div class="dialog-content"> <div class="dialog-content">
<slot /> <slot />
</div> </div>
<img class="bottom-right" src="@screen/images/dialog/right-bottom.svg"> <img
class="bottom-right"
src="@screen/images/dialog/right-bottom.svg"
/>
<div class="footer" v-if="$slots.footer"> <div class="footer" v-if="$slots.footer">
<slot name="footer"></slot> <slot name="footer"></slot>
@ -28,71 +44,74 @@
</template> </template>
<script> <script>
import Teleport from '../Teleport.vue'; import Teleport from "../Teleport.vue";
import BackgroundClip from "@screen/components/Decorations/BackgroundClip.vue"; import BackgroundClip from "@screen/components/Decorations/BackgroundClip.vue";
import { moveable, stopPropagation } from "./utils" import { moveable, stopPropagation } from "./utils";
export default { export default {
components: { components: {
Teleport, Teleport,
BackgroundClip BackgroundClip,
}, },
model: { model: {
prop: 'visible', prop: "visible",
event: "update:value" event: "update:value",
}, },
name: 'Dialog', name: "Dialog",
props: { props: {
title: { title: {
type: String type: String,
}, },
visible: Boolean, visible: Boolean,
noneMask: { noneMask: {
type: Boolean, type: Boolean,
default: false default: false,
} },
}, },
watch: { watch: {
visible: { visible: {
deep: true, deep: true,
handler(bool) { handler(bool) {
this.$nextTick(() => { this.$nextTick(() => {
if (!bool) return this.destroyMoveable?.() if (!bool) return this.destroyMoveable?.();
const container = this.$refs.DialogContentRef.$el; const container = this.$refs.DialogContentRef.$el;
this.destroyMoveable = moveable(container, { target: container.querySelector(".dialog-title") }); this.destroyMoveable = moveable(container, {
target: container.querySelector(".dialog-title"),
});
stopPropagation(container.querySelector(".dialog-title").lastChild) stopPropagation(container.querySelector(".dialog-title").lastChild);
this.$once("hook:beforeDestroy", () => this.destroyMoveable?.()); this.$once("hook:beforeDestroy", () => this.destroyMoveable?.());
}) });
} },
} },
}, },
computed: { computed: {
modelVisible: { modelVisible: {
get() { get() {
return this.visible return this.visible;
}, },
set(val) { set(val) {
this.$emit('update:value', val) console.log("val", val);
} this.$emit("update:value", val);
} },
},
}, },
beforeDestroy() { beforeDestroy() {
this.modelVisible = false; this.modelVisible = false;
}, },
} };
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.mask-layer { .mask-layer {
position: fixed; position: fixed;
top: 0; top: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, .36); background: rgba(0, 0, 0, 0.36);
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
z-index: 100; z-index: 100;
display: flex; display: flex;
@ -111,7 +130,7 @@ export default {
.fade-enter-active, .fade-enter-active,
.fade-leave-active { .fade-leave-active {
transition: opacity .24s; transition: opacity 0.24s;
} }
.fade-enter, .fade-enter,
@ -185,7 +204,7 @@ export default {
padding: 0 27px; padding: 0 27px;
::v-deep { ::v-deep {
>div { > div {
min-width: 96px; min-width: 96px;
} }
} }

70
ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/FatigueWakesUp/index.vue

@ -2,42 +2,56 @@
<Dialog v-model="obverseVisible" title="疲劳唤醒弹窗"> <Dialog v-model="obverseVisible" title="疲劳唤醒弹窗">
<div class="FatigueWakesUp"> <div class="FatigueWakesUp">
<Video class="video-stream" :pileNum="dialogData.stakeMark" /> <Video class="video-stream" :pileNum="dialogData.stakeMark" />
<ElTabs v-model="activeName" @tab-click="handleClickTabs" class="tabs">
<Descriptions labelWidth="72px" :list="list" :data="data" style="gap: 18px" /> <ElTabPane label="基本信息" name="first">
<Descriptions
labelWidth="72px"
:list="list"
:data="data"
style="gap: 18px"
/>
</ElTabPane>
<ElTabPane label="设备参数" name="second">设备参数</ElTabPane>
<ElTabPane label="在线率统计" name="third">在线率统计</ElTabPane>
</ElTabs>
</div> </div>
<template #footer> <template #footer>
<Button @click.native="deviceControlVisible = true">设备操作</Button> <Button @click.native="deviceControlVisible = true">设备操作</Button>
</template> </template>
<DeviceControlDialog v-model="deviceControlVisible" :deviceId="dialogData.iotDeviceId" /> <DeviceControlDialog
v-model="deviceControlVisible"
:deviceId="dialogData.iotDeviceId"
/>
</Dialog> </Dialog>
</template> </template>
<script> <script>
import Dialog from "@screen/components/Dialog/index.vue"; import Dialog from "@screen/components/Dialog/index.vue";
import Descriptions from '@screen/components/Descriptions.vue'; import Descriptions from "@screen/components/Descriptions.vue";
import Button from "@screen/components/Buttons/Button.vue" import Button from "@screen/components/Buttons/Button.vue";
// import { getRoadInfoByStakeMark, getProduct } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js" // import { getRoadInfoByStakeMark, getProduct } from "@screen/pages/Home/components/RoadAndEvents/utils/httpList.js"
import Video from "@screen/components/Video" import Video from "@screen/components/Video";
import DeviceControlDialog from "./components/DeviceControlDialog.vue" import DeviceControlDialog from "./components/DeviceControlDialog.vue";
import request from "@/utils/request"; import request from "@/utils/request";
import { dialogDelayVisible } from "./../mixin" import { dialogDelayVisible } from "./../mixin";
// //
export default { export default {
name: 'FatigueWakesUp', name: "FatigueWakesUp",
mixins: [dialogDelayVisible], mixins: [dialogDelayVisible],
components: { components: {
Dialog, Dialog,
Descriptions, Descriptions,
Video, Video,
DeviceControlDialog, DeviceControlDialog,
Button Button,
}, },
data() { data() {
return { return {
activeName: "first",
deviceControlVisible: false, deviceControlVisible: false,
data: { data: {
deviceType: "行车诱导", deviceType: "行车诱导",
@ -49,52 +63,52 @@ export default {
}, },
list: [ list: [
{ {
label: '设备名称', label: "设备名称",
key: "deviceName", key: "deviceName",
}, },
{ {
label: '设备桩号', label: "设备桩号",
key: "stakeMark", key: "stakeMark",
}, },
{ {
label: '道路名称', label: "道路名称",
key: "roadName", key: "roadName",
}, },
{ {
label: '设备方向', label: "设备方向",
key: "direction", key: "direction",
enum: "CameraDirectionEnum" enum: "CameraDirectionEnum",
}, },
{ {
label: '设备状态', label: "设备状态",
key: "deviceState", key: "deviceState",
enum: "DeviceTypeEnum" enum: "DeviceTypeEnum",
}, },
{ {
label: '设备厂商', label: "设备厂商",
key: "brand", key: "brand",
}, },
] ],
} };
}, },
async created() { async created() {
this.data = { ...this.dialogData }; this.data = { ...this.dialogData };
getProduct(this.dialogData.productId) getProduct(this.dialogData.productId).then((data) => {
.then(data => { this.dialogData.brand = data.brand;
this.dialogData.brand = data.brand; });
})
const roadInfo = await getRoadInfoByStakeMark(this.dialogData.stakeMark); const roadInfo = await getRoadInfoByStakeMark(this.dialogData.stakeMark);
if (roadInfo) this.data.roadName = roadInfo.roadName; if (roadInfo) this.data.roadName = roadInfo.roadName;
}, },
methods: { methods: {
} handleClickTabs() {},
} },
};
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.FatigueWakesUp { .FatigueWakesUp {
width: 420px; width: 420px;
color: #fff; color: #fff;
@ -130,7 +144,7 @@ export default {
align-items: center; align-items: center;
justify-content: end; justify-content: end;
>div { > div {
font-size: 16px; font-size: 16px;
padding: 6px 12px; padding: 6px 12px;
} }

5
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/governanceAnalysis/components/auditAnalytics/StatsDialogVisible/index.vue

@ -1,5 +1,6 @@
<template> <template>
<Dialog v-model="modelVisible" title="收费站管制统计" style="width: 100%"> <Dialog v-model="modelVisible" title="收费站管制统计" style="width: 100%">
{{ modelVisible }}
<div class="search"> <div class="search">
<InputSearch <InputSearch
:formList="searchFormList" :formList="searchFormList"
@ -379,9 +380,7 @@ export default {
}); });
this.searchFormList[2].options.options = dataList; this.searchFormList[2].options.options = dataList;
this.facilityIds = res[0].value.data.map((item) => item.id); this.facilityIds = res[0].value.data.map((item) => item.id);
this.searchFormList[2].default = res[0].value.data.map( this.searchFormList[2].default = dataList.map((item) => item.key);
(item) => item.id
);
console.log(56, this.searchFormList[2].default); console.log(56, this.searchFormList[2].default);
let currentMonth = moment().format("YYYY-MM"); let currentMonth = moment().format("YYYY-MM");
let currentDate = moment().format("YYYY-MM-DD"); let currentDate = moment().format("YYYY-MM-DD");

2
ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/data.js

@ -29,6 +29,7 @@ export const searchFormList = [
key: "time", key: "time",
required: true, required: true,
type: "datePicker", type: "datePicker",
default: "",
options: { options: {
format: "yyyy-MM-dd", format: "yyyy-MM-dd",
type: "daterange", type: "daterange",
@ -39,6 +40,7 @@ export const searchFormList = [
key: "type", key: "type",
required: true, required: true,
type: "select", type: "select",
default: "",
options: { options: {
options: [ options: [
{ {

18
ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/statisticalAnalysis/index.vue

@ -200,9 +200,6 @@ export default {
}, },
methods: { methods: {
initData() { initData() {
this.startTime = moment().startOf("month").format("YYYY-MM-DD HH:mm:ss");
this.time = moment().format("YYYY-MM-DD HH:mm:ss");
this.typeQuery = searchFormList[1].options.options[0].value;
console.log(8888, this.startTime, this.time, this.typeQuery); console.log(8888, this.startTime, this.time, this.typeQuery);
clearInterval(this.interval); clearInterval(this.interval);
if (this.activeName == "first") { if (this.activeName == "first") {
@ -247,8 +244,8 @@ export default {
handleSearch(data) { handleSearch(data) {
console.log(777, data); console.log(777, data);
this.typeQuery = data.type; this.typeQuery = data.type;
this.startTime = this.formatDate(data.time[0]); this.startTime = moment(data.time[0]).format("YYYY-MM-DD HH:mm:ss");
this.time = this.formatDate(data.time[1]); this.time = moment(data.time[1]).format("YYYY-MM-DD HH:mm:ss");
let typeText = let typeText =
this.searchFormList[1].options.options[this.typeQuery - 1].label; this.searchFormList[1].options.options[this.typeQuery - 1].label;
this.searchText = `${moment(this.startTime).format( this.searchText = `${moment(this.startTime).format(
@ -259,7 +256,6 @@ export default {
}, },
changeTabs() { changeTabs() {
this.initData(); this.initData();
console.log("======================", this.queryChart);
this.$nextTick(() => { this.$nextTick(() => {
this.queryChart.resize(); this.queryChart.resize();
}); });
@ -415,7 +411,15 @@ export default {
}, },
}, },
mounted() { mounted() {
this.initData(); this.$nextTick(() => {
this.startTime = moment().startOf("month").format("YYYY-MM-DD HH:mm:ss");
this.time = moment().format("YYYY-MM-DD HH:mm:ss");
this.typeQuery = searchFormList[1].options.options[0].value;
searchFormList[0].default = [this.startTime, this.time];
searchFormList[1].default = this.typeQuery;
console.log("__________________", searchFormList[0].default);
this.initData();
});
}, },
}; };
</script> </script>

16
ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/TemperatureTrend/assets/charts.js

@ -6,10 +6,10 @@ var options = {
}, },
color: "#FFD15C", color: "#FFD15C",
grid: { grid: {
left: "2%", left: "0",
right: "5%", right: "0",
bottom: "10%", bottom: "0",
top: "10%", top: "30px",
containLabel: true, containLabel: true,
}, },
legend: { legend: {
@ -72,14 +72,12 @@ var options = {
], ],
}, },
yAxis: { yAxis: {
name: "℃ ",
type: "value", type: "value",
min: 0,
max: 40,
minInterval: 1,
nameTextStyle: { nameTextStyle: {
fontSize: 10, fontSize: 12,
color: "#fff", color: "#fff",
align: "center", align: "right",
}, },
splitLine: { splitLine: {
lineStyle: { lineStyle: {

16
ruoyi-ui/src/views/JiHeExpressway/pages/perception/meteorologyCheck/components/weatherInfoQuery/components/visibilityTrends/assets/charts.js

@ -11,10 +11,10 @@ var options = {
// }, // },
}, },
grid: { grid: {
left: "2%", left: "0",
right: "5%", right: "0",
bottom: "10%", bottom: "0",
top: "10%", top: "30px",
containLabel: true, containLabel: true,
}, },
legend: { legend: {
@ -75,15 +75,13 @@ var options = {
], ],
}, },
yAxis: { yAxis: {
name: "M ",
type: "value", type: "value",
min: 0,
max: 40,
minInterval: 5,
splitNumber: 5, splitNumber: 5,
nameTextStyle: { nameTextStyle: {
fontSize: 12, fontSize: 12,
color: "#BDD8FB", color: "#fff",
align: "center", align: "right",
}, },
splitLine: { splitLine: {
lineStyle: { lineStyle: {

6
ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/assets/charts.js

@ -9,7 +9,11 @@ var options = {
"" ""
)}<br/>${params[0].marker}${ )}<br/>${params[0].marker}${
params[0].seriesName params[0].seriesName
}: <span style="font-weight:bold;"> ${params[0].value} </span>`; }: <span style="font-weight:bold;"> ${params[0].value} </span><br/>${
params[1].marker
}${params[1].seriesName}: <span style="font-weight:bold;"> ${
params[1].value
} </span>`;
}, },
}, },
axisPointer: { axisPointer: {

39
ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/components/flowstate/index.vue

@ -1,47 +1,42 @@
<template> <template>
<div class='flowstate'> <div class="flowstate">
<WgtTitle :title="'全路车流量状况'"></WgtTitle> <WgtTitle :title="'全路车流量状况'"></WgtTitle>
<div class="board"> <div class="board">
<div class="tag1">方向济南</div> <div class="tag1">方向济南</div>
<div class="tag2">方向菏泽</div> <div class="tag2">方向菏泽</div>
<div class="charts keep-ratio " id="flowStateEchartBox"></div> <div class="charts keep-ratio" id="flowStateEchartBox"></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import WgtTitle from "../../../widgets/title";
import WgtTitle from '../../../widgets/title'
import * as echarts from "echarts"; import * as echarts from "echarts";
import chartsStatistics from "./assets/charts"; import chartsStatistics from "./assets/charts";
export default { export default {
name: 'Flowstate', name: "Flowstate",
components: { components: {
WgtTitle WgtTitle,
}, },
data() { data() {
return { return {};
}
}, },
mounted() { mounted() {
setTimeout(() => { setTimeout(() => {
this.$nextTick(() => { this.$nextTick(() => {
var myChart = echarts.init(document.getElementById('flowStateEchartBox')); var myChart = echarts.init(
document.getElementById("flowStateEchartBox")
);
myChart.setOption(chartsStatistics); myChart.setOption(chartsStatistics);
}); });
}); });
}, },
created() { created() {},
methods: {},
}, };
methods: {
}
}
</script> </script>
<style lang='scss' scoped> <style lang="scss" scoped>
.flowstate { .flowstate {
width: 100%; width: 100%;
@ -53,11 +48,15 @@ export default {
border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px;
opacity: 1; opacity: 1;
border: 1px solid; border: 1px solid;
border-image: linear-gradient(360deg, rgba(55, 231, 255, 0.3), rgba(55, 231, 255, 0)) 1 1; border-image: linear-gradient(
360deg,
rgba(55, 231, 255, 0.3),
rgba(55, 231, 255, 0)
)
1 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.charts { .charts {

1
ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue

@ -6,7 +6,6 @@
<!-- 在途车流量车型分类 --> <!-- 在途车流量车型分类 -->
<!-- 全路段拥堵状况 --> <!-- 全路段拥堵状况 -->
<Congestion class="content-l"></Congestion> <Congestion class="content-l"></Congestion>
<!-- 畅通率 --> <!-- 畅通率 -->
<!-- <Unblocked class="content-m" /> --> <!-- <Unblocked class="content-m" /> -->
<!-- 全路车流量状况 --> <!-- 全路车流量状况 -->

2
ruoyi-ui/src/views/JiHeExpressway/pages/service/sensitive/index.vue

@ -84,7 +84,7 @@
:total="numTotal" :total="numTotal"
:current-page.sync="currentPage" :current-page.sync="currentPage"
:page-size="pageSize" :page-size="pageSize"
layout="total,prev, pager, next, jumper" layout="total,sizes,prev, pager, next, jumper"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
/> />

Loading…
Cancel
Save