From eafc031e3e6e48778d22b5455358273714944012 Mon Sep 17 00:00:00 2001
From: Your Name <123456>
Date: Mon, 05 Sep 2022 09:53:16 +0800
Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt
---
src/views/riskWarningSys/warningBigScreen/components/message.vue | 185 ++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 185 insertions(+), 0 deletions(-)
diff --git a/src/views/riskWarningSys/warningBigScreen/components/message.vue b/src/views/riskWarningSys/warningBigScreen/components/message.vue
new file mode 100644
index 0000000..637728b
--- /dev/null
+++ b/src/views/riskWarningSys/warningBigScreen/components/message.vue
@@ -0,0 +1,185 @@
+<template>
+ <div class="charts-cont">
+ <div class="message">
+ <dv-scroll-board ref="scrollBoard" :config="config" style="width:100%;height:100%" @mouseover="mouseoverHandler" @click="clickHandler" />
+ </div>
+ </div>
+</template>
+
+<script lang="ts">
+ import {toRefs, reactive, defineComponent, ref, defineAsyncComponent, onMounted} from 'vue';
+ import { storeToRefs } from 'pinia';
+ import { initBackEndControlRoutes } from '/@/router/backEnd';
+ import {useUserInfo} from "/@/stores/userInfo";
+ import { Session } from '/@/utils/storage';
+ import { Search } from '@element-plus/icons-vue'
+ import { ElMessage } from 'element-plus'
+ import type { FormInstance, FormRules } from 'element-plus'
+ import { workApplyApi } from '/@/api/specialWorkSystem/workApply';
+ import * as echarts from 'echarts';
+ import '/@/theme/bigScreen.css'
+
+
+ interface stateType {
+ }
+ export default defineComponent({
+ name: 'profession',
+ components: {},
+ props:{
+ size: Number
+ },
+ setup(props) {
+ const userInfo = useUserInfo()
+ const { userInfos } = storeToRefs(userInfo);
+ const pro = ref("eChartPro" + Date.now() + Math.random())
+ const state = reactive<stateType>({
+ config:{
+ header: ['消息列表', '同比'],
+ data: [
+ ['一月预警消息SPI报告', '↑ 94%'],
+ ['二月预警消息SPI报告', '↑ 94%'],
+ ['三月预警消息SPI报告', '↑ 94%'],
+ ['四月预警消息SPI报告', '↑ 94%'],
+ ['五月预警消息SPI报告', '↑ 94%'],
+ ['六月预警消息SPI报告', '↑ 94%'],
+ ['七月预警消息SPI报告', '↑ 94%'],
+ ['八月预警消息SPI报告', '↑ 94%'],
+ ['九月预警消息SPI报告', '↑ 94%'],
+ ['十月预警消息SPI报告', '↑ 94%'],
+ ['十一月预警消息SPI报告', '↑ 94%'],
+ ['十二月预警消息SPI报告', '↑ 94%']
+ ],
+ index: true,
+ columnWidth: [60],
+ align: ['center','center','center'],
+ headerBGC: '#0049af',
+ oddRowBGC: 'none',
+ evenRowBGC: 'rgba(57,122,206,.1)',
+ indexHeader: '序号',
+ rowNum: fontSize(5)
+ }
+ })
+
+ const mouseoverHandler = (e: any) => {
+ console.log(e)
+ }
+
+ const clickHandler = (e: any) => {
+ console.log(e)
+ }
+
+ function fontSize(val){
+ let nowClientWidth = document.documentElement.clientWidth;
+ return val * (nowClientWidth/1920) * Number(props.size);
+ }
+
+ // 页面载入时执行方法
+ onMounted(() => {
+ });
+
+ return {
+ pro,
+ Search,
+ mouseoverHandler,
+ clickHandler,
+ fontSize,
+ ...toRefs(state)
+ };
+ },
+ });
+</script>
+<style scoped lang="scss">
+
+ .charts-cont{
+ width: 100%;
+ height: 100%;
+ padding: 5%;
+ position: relative;
+
+ .message{
+ width: 100%;
+ height: 100%;
+ border-radius: 4px;
+ overflow: hidden;
+
+ .th{
+ width: 100%;
+ display: flex;
+ height: 36px;
+ justify-content: space-between;
+ background: #1882d5;
+ font-size: 1rem;
+ line-height: 36px;
+ color: #ffffff;
+ .th-num{
+ width: 15%;
+ text-align: center;
+ }
+ .th-info{
+ width: 70%;
+ text-align: left;
+ color: #11FEEE
+ }
+ .th-sum{
+ width: 15%;
+ text-align: center;
+ }
+ }
+
+ .tm{
+ height: calc(100% - 36px);
+ width: 100%;
+ overflow: hidden;
+ scroll-behavior: smooth;
+
+ .ti{
+ display: flex;
+ height: 40px;
+ line-height: 40px;
+ justify-content: space-between;
+ color: #ffffff;
+
+ .num{
+ width: 15%;
+ text-align: center;
+ }
+ .info{
+ width: 70%;
+ text-align: left;
+ color: #11FEEE
+ }
+ .sum{
+ width: 15%;
+ text-align: center;
+ }
+ }
+ .darkBg{
+ background: rgba(57,122,206,.4);
+ }
+ }
+ }
+ }
+ .home-container {
+ height: 100%;
+ overflow: hidden;
+ position: relative;
+ .el-row{
+ margin-bottom: 20px;
+ }
+ .el-row:last-child {
+ margin-bottom: 0;
+ }
+ .el-input{
+ width: 100% !important;
+ }
+ .el-date-editor::v-deep{
+ width: 100%;
+ }
+ .el-select{
+ width: 100%;
+ }
+ .el-cascader{
+ width: 100% !important;
+ }
+ }
+</style>
--
Gitblit v1.9.2