zhoule
11 months ago
38 changed files with 815 additions and 420 deletions
@ -1,75 +1,98 @@ |
|||||
<template> |
<template> |
||||
<div class='congestion'> |
<div class="congestion"> |
||||
<WgtTitle :title="'气温变化趋势'"></WgtTitle> |
<WgtTitle :title="'气温变化趋势'"></WgtTitle> |
||||
<div class="board"> |
<div class="board"> |
||||
<div class="charts" id="temperatureTrend"></div> |
<div class="charts" id="temperatureTrend"></div> |
||||
</div> |
|
||||
</div> |
</div> |
||||
</template> |
</div> |
||||
|
</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 temperatureCharts from "./assets/charts"; |
||||
export default { |
import { |
||||
name: 'temperatureTrend', |
getListLatest, |
||||
components: { |
getDeviceNameListLatest, |
||||
WgtTitle |
getIdDevices, |
||||
|
} from "@/api/perception/meteorologyCheck"; |
||||
|
export default { |
||||
|
name: "temperatureTrend", |
||||
|
components: { |
||||
|
WgtTitle, |
||||
|
}, |
||||
|
props: { |
||||
|
data: { |
||||
|
type: Array, |
||||
}, |
}, |
||||
data() { |
}, |
||||
return { |
watch: { |
||||
myChart:null, |
data: { |
||||
} |
handler(data) { |
||||
}, |
let newData = []; |
||||
|
data.forEach((item) => { |
||||
created() { |
newData.push(item.avgVisibility); |
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
reiszeChart(){ |
|
||||
this.$nextTick(() => { |
|
||||
if ( this.myChart ) { |
|
||||
this.myChart.resize(); |
|
||||
} |
|
||||
}); |
}); |
||||
} |
temperatureCharts.series[0].data = newData; |
||||
}, |
this.myChart.setOption(temperatureCharts); |
||||
update(){ |
}, |
||||
|
deep: true, |
||||
}, |
}, |
||||
mounted() { |
}, |
||||
setTimeout(() => { |
data() { |
||||
this.$nextTick(() => { |
return { |
||||
this.myChart = echarts.init(document.getElementById('temperatureTrend')); |
myChart: null, |
||||
this.myChart.setOption(chartsStatistics); |
}; |
||||
}); |
}, |
||||
|
|
||||
|
created() {}, |
||||
|
methods: { |
||||
|
reiszeChart() { |
||||
|
this.$nextTick(() => { |
||||
|
if (this.myChart) { |
||||
|
this.myChart.resize(); |
||||
|
} |
||||
}); |
}); |
||||
}, |
}, |
||||
|
}, |
||||
|
update() {}, |
||||
|
mounted() { |
||||
|
setTimeout(() => { |
||||
|
this.$nextTick(() => { |
||||
|
this.myChart = echarts.init( |
||||
|
document.getElementById("temperatureTrend") |
||||
|
); |
||||
|
this.myChart.setOption(temperatureCharts); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.congestion { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
.board { |
||||
|
flex: 1; |
||||
|
padding: 0px 20px; |
||||
|
background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%); |
||||
|
border-radius: 5px 5px 5px 5px; |
||||
|
opacity: 1; |
||||
|
border: 1px solid; |
||||
|
border-image: linear-gradient( |
||||
|
360deg, |
||||
|
rgba(55, 231, 255, 0.3), |
||||
|
rgba(55, 231, 255, 0) |
||||
|
) |
||||
|
1 1; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
} |
} |
||||
</script> |
} |
||||
|
.charts { |
||||
<style lang='scss' scoped> |
height: 200px; |
||||
.congestion { |
width: 100%; |
||||
display: flex; flex-direction: column; |
} |
||||
.board{ |
</style> |
||||
flex: 1; |
|
||||
padding: 0px 20px; |
|
||||
background: linear-gradient(180deg, rgba(6,66,88,0.2) 0%, #064258 100%); |
|
||||
border-radius: 5px 5px 5px 5px; |
|
||||
opacity: 1; |
|
||||
border: 1px solid; |
|
||||
border-image: linear-gradient(360deg, rgba(55, 231, 255,0.3), rgba(55, 231, 255, 0)) 1 1; |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
.charts { |
|
||||
height:200px; |
|
||||
width: 100%; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
|
|
||||
|
|||||
@ -1,74 +1,94 @@ |
|||||
<template> |
<template> |
||||
<div class='congestion'> |
<div class="congestion"> |
||||
<WgtTitle :title="'能见度变化趋势'"></WgtTitle> |
<WgtTitle :title="'能见度变化趋势'"></WgtTitle> |
||||
<div class="board"> |
<div class="board"> |
||||
<div class="charts" id="VisibilityTrends"></div> |
<div class="charts" id="VisibilityTrends"></div> |
||||
</div> |
|
||||
</div> |
</div> |
||||
</template> |
</div> |
||||
|
</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 visibilityCharts from "./assets/charts"; |
||||
export default { |
export default { |
||||
name: 'VisibilityTrends', |
name: "VisibilityTrends", |
||||
components: { |
components: { |
||||
WgtTitle |
WgtTitle, |
||||
|
}, |
||||
|
props: { |
||||
|
data: { |
||||
|
type: Array, |
||||
}, |
}, |
||||
data() { |
}, |
||||
return { |
watch: { |
||||
myChart:null, |
data: { |
||||
} |
handler(data) { |
||||
}, |
let newData = []; |
||||
|
data.forEach((item) => { |
||||
created() { |
newData.push(item.avgTemperature); |
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
reiszeChart(){ |
|
||||
|
|
||||
this.$nextTick(() => { |
|
||||
if ( this.myChart ) { |
|
||||
this.myChart.resize(); |
|
||||
} |
|
||||
}); |
}); |
||||
} |
visibilityCharts.series[0].data = newData; |
||||
}, |
this.myChart.setOption(visibilityCharts); |
||||
update(){ |
}, |
||||
|
deep: true, |
||||
}, |
}, |
||||
mounted() { |
}, |
||||
setTimeout(() => { |
data() { |
||||
this.$nextTick(() => { |
return { |
||||
this.myChart = echarts.init(document.getElementById('VisibilityTrends')); |
myChart: null, |
||||
this.myChart.setOption(chartsStatistics); |
}; |
||||
}); |
}, |
||||
|
|
||||
|
created() {}, |
||||
|
methods: { |
||||
|
reiszeChart() { |
||||
|
this.$nextTick(() => { |
||||
|
if (this.myChart) { |
||||
|
this.myChart.resize(); |
||||
|
} |
||||
}); |
}); |
||||
}, |
}, |
||||
|
}, |
||||
|
update() {}, |
||||
|
mounted() { |
||||
|
setTimeout(() => { |
||||
|
this.$nextTick(() => { |
||||
|
this.myChart = echarts.init( |
||||
|
document.getElementById("VisibilityTrends") |
||||
|
); |
||||
|
this.myChart.setOption(visibilityCharts); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.congestion { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: stretch; |
||||
|
.board { |
||||
|
flex: 1; |
||||
|
padding: 0px 20px; |
||||
|
background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%); |
||||
|
border-radius: 5px 5px 5px 5px; |
||||
|
opacity: 1; |
||||
|
border: 1px solid; |
||||
|
border-image: linear-gradient( |
||||
|
360deg, |
||||
|
rgba(55, 231, 255, 0.3), |
||||
|
rgba(55, 231, 255, 0) |
||||
|
) |
||||
|
1 1; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
align-items: stretch; |
||||
} |
} |
||||
</script> |
} |
||||
|
.charts { |
||||
<style lang='scss' scoped> |
height: 200px; |
||||
.congestion { |
} |
||||
display: flex; flex-direction: column; align-items: stretch; |
</style> |
||||
.board{ |
|
||||
flex: 1; |
|
||||
padding: 0px 20px; |
|
||||
background: linear-gradient(180deg, rgba(6,66,88,0.2) 0%, #064258 100%); |
|
||||
border-radius: 5px 5px 5px 5px; |
|
||||
opacity: 1; |
|
||||
border: 1px solid; |
|
||||
border-image: linear-gradient(360deg, rgba(55, 231, 255,0.3), rgba(55, 231, 255, 0)) 1 1; |
|
||||
display: flex; flex-direction: column; |
|
||||
justify-content: center; |
|
||||
align-items: stretch; |
|
||||
} |
|
||||
} |
|
||||
.charts { |
|
||||
height:200px; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
|
|
||||
|
|||||
@ -1,156 +1,167 @@ |
|||||
<template> |
<template> |
||||
<div class='congestion'> |
<div class="congestion"> |
||||
<WgtTitle :title="'气象监测数据'"></WgtTitle> |
<WgtTitle :title="'气象监测数据'"></WgtTitle> |
||||
<div class="board"> |
<div class="board"> |
||||
<div class="showRoad"> |
<div class="showRoad"> |
||||
<div :class="it.type?it.type+' item':'item'" v-for="(it,index) in dataList" > |
<div class="item"> |
||||
<span class="label" >{{ it.text }}</span> |
<span class="label">温度：</span> |
||||
<span class="text" >{{ it.value }}</span> |
<span class="text">{{ |
||||
</div> |
data.temperature ? data.temperature + "℃" : "-" |
||||
|
}}</span> |
||||
</div> |
</div> |
||||
</div> |
<div class="item"> |
||||
|
<span class="label">湿度：</span> |
||||
|
<span class="text">{{ |
||||
|
data.humidity ? data.humidity + "mm" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="item"> |
||||
|
<span class="label">风向：</span> |
||||
|
<span class="text">{{ |
||||
|
data.windDirection ? data.windDirection + "°" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="item"> |
||||
|
<span class="label">风速：</span> |
||||
|
<span class="text">{{ |
||||
|
data.windSpeed ? data.windSpeed + "级" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="item"> |
||||
|
<span class="label">能见度：</span> |
||||
|
<span class="text">{{ |
||||
|
data.visibilityType ? data.visibilityType + "级" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<!-- <div class="item"> |
||||
|
<span class="label">能见度类型：</span> |
||||
|
<span class="text">{{ data.visibilityType }}</span> |
||||
|
</div> --> |
||||
|
<!-- <div class="item"> |
||||
|
<span class="label">降雨类型：</span> |
||||
|
<span class="text">{{ |
||||
|
data.recipitationType ? data.recipitationType : "-" |
||||
|
}}</span> |
||||
|
</div> --> |
||||
|
<div class="item"> |
||||
|
<span class="label">降雨量：</span> |
||||
|
<span class="text">{{ |
||||
|
data.rainfall ? data.rainfall + "mm" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="item"> |
||||
|
<span class="label">路面温度：</span> |
||||
|
<span class="text">{{ |
||||
|
data.remoteRoadSurfaceTemperature |
||||
|
? data.remoteRoadSurfaceTemperature + "℃" |
||||
|
: "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
<div class="item"> |
||||
|
<span class="label"> 气压：</span> |
||||
|
<span class="text">{{ |
||||
|
data.atmosphericPressure ? data.atmosphericPressure + "Pa" : "-" |
||||
|
}}</span> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</template> |
</div> |
||||
|
</template> |
||||
<script> |
|
||||
|
<script> |
||||
import WgtTitle from '../../../../../widgets/title' |
import WgtTitle from "../../../../../widgets/title"; |
||||
|
|
||||
export default { |
export default { |
||||
name: 'MonthStatistics', |
name: "MonthStatistics", |
||||
components: { |
components: { |
||||
WgtTitle |
WgtTitle, |
||||
}, |
}, |
||||
data() { |
props: { |
||||
return { |
data: { |
||||
myChart:null, |
type: Object, |
||||
dataList:[ |
default: () => {}, |
||||
{ |
|
||||
text:"天气状态：", |
|
||||
value:"无降水", |
|
||||
class:"km" |
|
||||
}, |
|
||||
{ |
|
||||
text:"风速：", |
|
||||
value:"55m/s", |
|
||||
class:"km" |
|
||||
}, |
|
||||
{ |
|
||||
text:"天气温度：", |
|
||||
value:"23°C", |
|
||||
class:"km" |
|
||||
}, |
|
||||
{ |
|
||||
text:"风向：", |
|
||||
value:"东南风", |
|
||||
class:"km" |
|
||||
}, |
|
||||
{ |
|
||||
text:"路面温度：", |
|
||||
value:"23°C", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"风级：", |
|
||||
value:"2级", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"空气湿度：", |
|
||||
value:"79.40%", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"道路危险等级：", |
|
||||
value:"0级", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"能见度：", |
|
||||
value:"2610.00m", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"能见度：", |
|
||||
value:"0.00m", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"能见度：", |
|
||||
value:"0.00m", |
|
||||
class:"km" |
|
||||
}, { |
|
||||
text:"能见度：", |
|
||||
value:"0.00m", |
|
||||
class:"km" |
|
||||
} |
|
||||
] |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
created() { |
|
||||
|
|
||||
}, |
|
||||
methods: { |
|
||||
|
|
||||
}, |
}, |
||||
mounted() { |
}, |
||||
setTimeout(() => { |
watch: { |
||||
this.$nextTick(() => { |
data: { |
||||
|
handler(newVal) { |
||||
}); |
console.log(newVal); |
||||
}); |
}, |
||||
|
deep: true, |
||||
}, |
}, |
||||
} |
}, |
||||
</script> |
data() { |
||||
|
return { |
||||
<style lang='scss' scoped> |
myChart: null, |
||||
.congestion { |
dataList: [], |
||||
width: 100%; display: flex; |
}; |
||||
.board{ |
}, |
||||
flex: 1; |
created() {}, |
||||
width: 100%; |
methods: {}, |
||||
padding: 0px 20px; |
mounted() { |
||||
background: linear-gradient(180deg, rgba(6,66,88,0.2) 0%, #064258 100%); |
setTimeout(() => { |
||||
border-radius: 5px 5px 5px 5px; |
this.$nextTick(() => {}); |
||||
opacity: 1; |
}); |
||||
border: 1px solid; |
}, |
||||
border-image: linear-gradient(360deg, rgba(55, 231, 255,0.3), rgba(55, 231, 255, 0)) 1 1; |
}; |
||||
display: flex; |
</script> |
||||
justify-content: space-between; |
|
||||
align-items: center; |
|
||||
flex-direction: row; |
|
||||
overflow: auto; |
|
||||
|
|
||||
.showRoad { |
<style lang="scss" scoped> |
||||
display: flex; |
.congestion { |
||||
flex-wrap: wrap; |
width: 100%; |
||||
|
display: flex; |
||||
|
.board { |
||||
|
flex: 1; |
||||
|
width: 100%; |
||||
|
padding: 0px 20px; |
||||
|
background: linear-gradient(180deg, rgba(6, 66, 88, 0.2) 0%, #064258 100%); |
||||
|
border-radius: 5px 5px 5px 5px; |
||||
|
opacity: 1; |
||||
|
border: 1px solid; |
||||
|
border-image: linear-gradient( |
||||
|
360deg, |
||||
|
rgba(55, 231, 255, 0.3), |
||||
|
rgba(55, 231, 255, 0) |
||||
|
) |
||||
|
1 1; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
flex-direction: row; |
||||
|
overflow: auto; |
||||
|
|
||||
> .item { |
.showRoad { |
||||
display: inline-flex; |
display: flex; |
||||
width:50%; |
flex-wrap: wrap; |
||||
height:23px; |
|
||||
margin-top:12px; |
|
||||
flex-direction: row; |
|
||||
|
|
||||
> span.label { |
> .item { |
||||
width:50%; |
display: inline-flex; |
||||
height:25px; |
width: 50%; |
||||
font-size: 12px; |
height: 23px; |
||||
font-family: PingFang SC, PingFang SC; |
margin-top: 12px; |
||||
font-weight: 400; |
flex-direction: row; |
||||
color: #00B3CC; |
|
||||
} |
|
||||
|
|
||||
>span.text { |
> span.label { |
||||
font-size: 14px; |
width: 50%; |
||||
font-family: PingFang SC, PingFang SC; |
height: 25px; |
||||
font-weight: 400; |
font-size: 12px; |
||||
color: #FFFFFF; |
font-family: PingFang SC, PingFang SC; |
||||
} |
font-weight: 400; |
||||
|
color: #00b3cc; |
||||
} |
} |
||||
} |
|
||||
|
|
||||
|
> span.text { |
||||
|
font-size: 14px; |
||||
|
font-family: PingFang SC, PingFang SC; |
||||
|
font-weight: 400; |
||||
|
color: #ffffff; |
||||
|
} |
||||
|
} |
||||
} |
} |
||||
} |
} |
||||
.charts { |
} |
||||
height:180px; |
.charts { |
||||
width: 100%; |
height: 180px; |
||||
} |
width: 100%; |
||||
|
} |
||||
</style> |
</style> |
||||
|
|
||||
|
|||||
|
After Width: | Height: | Size: 3.1 KiB |
@ -0,0 +1,186 @@ |
|||||
|
<template> |
||||
|
<div class='board_record'> |
||||
|
|
||||
|
<!-- 搜索栏 --> |
||||
|
<div class="filter"> |
||||
|
<div> |
||||
|
<ButtonGradient @click="onRefresh" class="refresh-btn"> |
||||
|
<template #prefix> |
||||
|
<img src="./images/refresh.svg" /> |
||||
|
</template> |
||||
|
刷新 |
||||
|
</ButtonGradient> |
||||
|
<!-- <ButtonGradient> |
||||
|
<template #prefix> |
||||
|
<img src="@screen/images/insert.svg" /> |
||||
|
</template> |
||||
|
新增 |
||||
|
</ButtonGradient> --> |
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 内容 --> |
||||
|
<div class="body"> |
||||
|
<Table :data="tableData"> |
||||
|
<ElTableColumn label="序号" width="60" /> |
||||
|
<ElTableColumn label="发布设备" width="60" /> |
||||
|
<ElTableColumn label="屏幕尺寸" width="60" /> |
||||
|
<ElTableColumn label="设备方向" width="60" /> |
||||
|
<ElTableColumn label="设备桩号" width="60" /> |
||||
|
<ElTableColumn prop="eventName" label="发布内容" width="240" /> |
||||
|
<ElTableColumn prop="eventName" label="发布事件" width="240" /> |
||||
|
<ElTableColumn prop="eventName" label="发布状态" width="240" /> |
||||
|
<ElTableColumn prop="eventName" label="发布用户" width="240" /> |
||||
|
<ElTableColumn label="操作" width="210"> |
||||
|
<template slot-scope="scope"> |
||||
|
<ElButton type="text" style="color: #00D1FF;" @click="showDisposal(scope.row.eventType)">流程配置</ElButton> |
||||
|
<ElButton type="text" style="color: #00EBC1;" @click="showPhrases(scope.row)">常用语</ElButton> |
||||
|
</template> |
||||
|
</ElTableColumn> |
||||
|
</Table> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 分页 --> |
||||
|
<div class="footer"> |
||||
|
<Pagination @current-change="initData" @size-change="onSizeChange" width="'100%'" :page-sizes="[10, 20, 30, 40, 50]" |
||||
|
:page-size="searchData.pageSize" :current-page.sync="searchData.pageNum" layout="total, sizes, prev, pager, next" |
||||
|
:total="total"> |
||||
|
</Pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue'; |
||||
|
import Pagination from '@screen/components/Pagination.vue'; |
||||
|
import Table from '@screen/components/Table.vue'; |
||||
|
import request from "@/utils/request"; |
||||
|
|
||||
|
export default { |
||||
|
name: 'boardRecord', |
||||
|
components: { |
||||
|
ButtonGradient, |
||||
|
Pagination, |
||||
|
Table |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
isShowPhrases: false, |
||||
|
isShowDisposal: false, |
||||
|
total: 20, |
||||
|
eventType: 1, |
||||
|
searchData: { |
||||
|
pageSize: 20, |
||||
|
pageNum: 1, |
||||
|
}, |
||||
|
phrasesData: [], |
||||
|
process: [] |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.initData(); |
||||
|
}, |
||||
|
methods: { |
||||
|
initData() { |
||||
|
request({ |
||||
|
url: `/business/dcEventType/list`, |
||||
|
method: "get", |
||||
|
params: this.searchData, |
||||
|
}).then((result) => { |
||||
|
if (result.code != 200) return Message.error(result?.msg); |
||||
|
this.tableData = result.rows; |
||||
|
this.total = result.total; |
||||
|
}); |
||||
|
}, |
||||
|
onRefresh() { |
||||
|
this.tableData = []; |
||||
|
setTimeout(() => { |
||||
|
this.initData(); |
||||
|
}, 100); |
||||
|
}, |
||||
|
onSizeChange(pageSize) { |
||||
|
this.searchData.pageSize = pageSize; |
||||
|
this.getData(); |
||||
|
}, |
||||
|
showPhrases(data) { |
||||
|
if (data?.processConfigList.length <= 0) { |
||||
|
Message.warning('请先配置流程！'); |
||||
|
return; |
||||
|
} |
||||
|
let process = [] |
||||
|
data.processConfigList.forEach(it => { |
||||
|
process.push({ |
||||
|
id: it.id, |
||||
|
commonPhrases: it.commonPhrases, |
||||
|
label: it.processNode, |
||||
|
isActive: false, |
||||
|
}) |
||||
|
}) |
||||
|
this.process = process; |
||||
|
this.isShowPhrases = true; |
||||
|
this.eventType = data.eventType; |
||||
|
}, |
||||
|
showDisposal(eventType) { |
||||
|
this.isShowDisposal = true; |
||||
|
this.eventType = eventType; |
||||
|
}, |
||||
|
onClosePhrases() { |
||||
|
this.isShowPhrases = false |
||||
|
}, |
||||
|
onCloseDisposal() { |
||||
|
this.isShowDisposal = false; |
||||
|
}, |
||||
|
onUpdatePhrasesData(phrasesData) { |
||||
|
this.phrasesData = phrasesData; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang='scss' scoped> |
||||
|
.board_record { |
||||
|
padding: 21px; |
||||
|
|
||||
|
height: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
z-index: 6; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
|
||||
|
.filter { |
||||
|
height: 60px; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
|
||||
|
>div { |
||||
|
display: flex; |
||||
|
gap: 6px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.body { |
||||
|
flex: 1; |
||||
|
position: relative; |
||||
|
overflow: hidden; |
||||
|
|
||||
|
.content { |
||||
|
position: absolute; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
overflow: auto; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.footer { |
||||
|
margin-top: 15px; |
||||
|
height: 36px; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue