Merge remote-tracking branch 'origin/master'

xiangpei

2024-03-18 987027d23b3a1b5935d36de691a19749b4778432

Merge remote-tracking branch 'origin/master'

 package.json

@@ -36,6 +36,7 @@
    "url": "https://gitee.com/y_project/RuoYi-Vue.git"
  },
  "dependencies": {
    "@jiaminghi/data-view": "^2.10.0",
    "@riophae/vue-treeselect": "0.4.0",
    "axios": "0.24.0",
    "clipboard": "2.0.8",
@@ -54,6 +55,7 @@
    "quill": "1.3.7",
    "screenfull": "5.0.2",
    "sortablejs": "1.10.2",
    "v-scale-screen": "1.0.0",
    "vue": "2.6.12",
    "vue-count-to": "1.0.13",
    "vue-cropper": "0.5.5",

 src/assets/images/screen/header_bg.png

 src/assets/images/screen/icon/icon1.png

 src/assets/images/screen/icon/icon2.png

 src/assets/images/screen/pageBg1.jpg

 src/assets/images/screen/title_bg.png

 src/main.js

@@ -1,7 +1,7 @@
import Vue from 'vue'

import Cookies from 'js-cookie'
import {getToken} from "@/utils/auth";
import { getToken } from "@/utils/auth";
import Element from 'element-ui'
import './assets/styles/element-variables.scss'

@@ -38,6 +38,12 @@
// 字典数据组件
import DictData from '@/components/DictData'

// 大屏
import VScaleScreen from 'v-scale-screen'
import dataV from '@jiaminghi/data-view'



// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
@@ -62,6 +68,8 @@
Vue.use(directive)
Vue.use(plugins)
Vue.use(VueMeta)
Vue.use(VScaleScreen)
Vue.use(dataV)
DictData.install()

/**

 src/permission.js

@@ -8,7 +8,7 @@

NProgress.configure({ showSpinner: false })

const whiteList = ['/login', '/register']
const whiteList = ['/login', '/register', '/screen']

router.beforeEach((to, from, next) => {
  NProgress.start()

 src/router/index.js

@@ -75,6 +75,14 @@
    ]
  },
  {
    path: '/screen',
    component: Layout,
    hidden: true,
    component: () => import('@/views/screen/index'),
    name: 'Profile',
    meta: { title: '大屏信息', icon: 'user' }
  },
  {
    path: '/user',
    component: Layout,
    hidden: true,

 src/views/home/data-view/components/data-hola.vue

@@ -16,6 +16,7 @@
    top: '5%',
    left: 'center'
  },
  color: ['#7868d9','#3eba45','#3da7f8','#ffbe40','#fe640d'],
  series: [
    {
      type: 'pie',

 src/views/home/data-view/components/data-map.vue

@@ -41,7 +41,8 @@
      beta: -30,
      alpha: 90,
      distance: 100,
      maxBeta: 180
      maxBeta: 180,
      panSensitivity: 0
    },
    // 鼠标移入时样式
    emphasis: {

 src/views/home/data-view/index.vue

@@ -8,6 +8,14 @@


    <el-card class="map-wrapper">
      <el-row>
        <el-col :offset="21" :span="3">
          <el-select v-model="selectOption" placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-col>
      </el-row>
      <el-row :gutter="40" class="data-plane" style="height: 100%;">
        <el-col :xs='24' :md="24" :sm="24" :lg="6" :xl="6" style="height: 100%;">
          <data-icon :activeData="activeData"></data-icon>
@@ -105,7 +113,18 @@
          "data5": 95
        }
      ],
      activeData: {name: '自贡市', data1: 0, data2: 0, data3: 0, data4: 0, data5:0}
      activeData: { name: '自贡市', data1: 0, data2: 0, data3: 0, data4: 0, data5: 0 },
      options: [
        {
          value: 1,
          label: '省厅数据'
        },
        {
          value: 2,
          label: '市局数据'
        }, 
      ],
      selectOption: 1
    }
  },
  methods: {

 src/views/home/data-wrapper/index.vue

@@ -1,6 +1,12 @@
<template>
  <div class="data-container">
    <el-row :gutter="40">
      <el-col :xs='24' :md="24" :sm="24" :lg="24" :xl="12">
        <data-chart></data-chart>
      </el-col>
      <el-col :xs='24' :md="24" :sm="24" :lg="24" :xl="12">
        <work-order></work-order>
      </el-col>
      <el-col :xs='24' :md="24" :sm="24" :lg="17" :xl="17">
        <data-table></data-table>
        <examine></examine>
@@ -8,12 +14,6 @@
      <el-col :xs='24' :md="24" :sm="24" :lg="7" :xl="7">
        <data-rank></data-rank>
        <data-check></data-check>
      </el-col>
      <el-col :xs='24' :md="24" :sm="24" :lg="12" :xl="12">
        <data-chart></data-chart>
      </el-col>
      <el-col :xs='24' :md="24" :sm="24" :lg="12" :xl="12">
        <work-order></work-order>
      </el-col>
    </el-row>
  </div>

 src/views/home/work-order/index.vue

@@ -3,7 +3,7 @@
    <el-card class="data-card" :body-style="{ height: '100%' }">
      <div class="card-content">
        <div class="title-container">
          <h1>运维监控报表</h1>
          <h1>运维工单报表</h1>
          <div class="select-container">
            <el-select v-model="company" placeholder="请选择运维公司" @change="companyChange">
              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">

 src/views/screen/components/screen-car/index.vue

New file
@@ -0,0 +1,19 @@
<template>
  <div class="car-container">
    <wrapper-title :title="'人脸数据趋势'"></wrapper-title>

  </div>
</template>

<script>
import WrapperTitle from '../wrapper-title/index';

export default {
  name: 'ScreenCar',
  components: {
    WrapperTitle
  },
}
</script>

<style lang="scss" scoped></style>

 src/views/screen/components/screen-detection/index.vue

New file
@@ -0,0 +1,91 @@
<template>
  <div class="detection-container">
    <wrapper-title :title="'运行监控数据'"></wrapper-title>

    <div class="detection-content">
      <div class="water-item">
        <dv-water-level-pond :config="config1" style="width:100px;height:100px" />
        <div class="water-num water-text">6250/0</div>
        <div class="water-label water-text">接入率</div>
      </div>
      <div class="water-item">
        <dv-water-level-pond :config="config2" style="width:100px;height:100px" />
        <div class="water-num water-text">6236/6250</div>
        <div class="water-label water-text">GIS率</div>
      </div>
      <div class="water-item">
        <dv-water-level-pond :config="config3" style="width:100px;height:100px" />
        <div class="water-num water-text">5962/6250</div>
        <div class="water-label water-text">在线率</div>
      </div>
      <div class="water-item">
        <dv-water-level-pond :config="config4" style="width:100px;height:100px" />
        <div class="water-num water-text">5255/5962</div>
        <div class="water-label water-text">完好率</div>
      </div>
    </div>
  </div>
</template>

<script>
import WrapperTitle from '../wrapper-title/index';
export default {
  components: {
    WrapperTitle
  },
  data() {
    return {
      config1: {
        data: [0],
        shape: 'round',
        waveHeight: 5
      },
      config2: {
        data: [99.77],
        shape: 'round',
        waveHeight: 5
      },
      config3: {
        data: [95.39],
        shape: 'round',
        waveHeight: 5
      },
      config4: {
        data: [88.14],
        shape: 'round',
        waveHeight: 5
      },
    }
  }
}
</script>

<style lang="scss" scoped>

.detection-content {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  background: rgba(67, 102, 155, 0.3);
  border: 1px solid rgba(47, 91, 157, 0.8);
  padding: 20px 20px;
}

.water-item {
  font-size: 16px;
  color: #fff;

  .water-text {
    text-align: center;
  }

  .water-num {
    margin-top: 20px;
  }

  .water-label {
    font-size: 20px;
  }
}
</style>

 src/views/screen/components/screen-examine/components/examine-chart.vue

New file
@@ -0,0 +1,61 @@
<template>
  <div class="chart-container">
    <div class="rank-chart" ref="rankChart"></div>
  </div>
</template>

<script>
import * as echarts from 'echarts';
let barChart = null;
export default {
  name: 'ExamineChart',
  data() {
    return {

    }
  },

  methods: {
    initChart() {
      const options = {
        xAxis: {
          type: 'category',
          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            data: [120, 200, 150, 80, 70, 110, 130],
            type: 'bar'
          }
        ]
      }
      barChart.setOption(options,true);
    }
  },
  mounted() {
    barChart = echarts.init(this.$refs.rankChart);

    this.initChart();
  },
  beforeDestroy() {
    if (lineChart) {
      barChart.dispose();
    }
  },

}
</script>

<style lang="scss" scoped>
.chart-container {
  width: 100%;
  height: 400px;
  .rank-chart {
    width: 100%;
    height: 100%;
  }
}
</style>

 src/views/screen/components/screen-examine/index.vue

New file
@@ -0,0 +1,47 @@
<template>
  <div class="examine-container">
    <wrapper-title :title="'考核成绩数据'"></wrapper-title>
    <div class="examine-content">
      <div class="examine-wrapper">
        <examine-chart></examine-chart>
      </div>
    </div>
  </div>
</template>

<script>
import WrapperTitle from '../wrapper-title/index';
import ExamineChart from './components/examine-chart';
export default {
  name: 'ScreenExamine',
  components: {
    WrapperTitle,
    ExamineChart
  }
}

</script>

<style lang="scss" scoped>
.examine-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.examine-content {
  width: 100%;
  flex: 1;
  background: rgba(67, 102, 155, 0.3);
  border: 1px solid rgba(47, 91, 157, 0.8);
  padding: 20px 20px;
  position: relative;
  .examine-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
</style>

 src/views/screen/components/screen-face/index.vue

New file
@@ -0,0 +1,186 @@
<template>
  <div class="face-container">
    <wrapper-title :title="'人脸数据趋势'"></wrapper-title>

    <div class="face-content">
      <div class="data-plane">
        <dv-border-box-13 class="plane">
          <div class="data-item">
            <div class="data-icon">
              <img src="@/assets/images/screen/icon/icon1.png" alt="" class="width-img">
            </div>
            <div class="data-info">
              <div class="data-lable">昨日人脸采集设备总数</div>
              <div class="data-num">{{formatNumber(1123)}}</div>
            </div>
          </div>
        </dv-border-box-13>

        <dv-border-box-13 class="plane">
          <div class="data-item">
            <div class="data-icon">
              <img src="@/assets/images/screen/icon/icon2.png" alt="" class="width-img">
            </div>
            <div class="data-info">
              <div class="data-lable">昨日抓拍数据量</div>
              <div class="data-num">{{ formatNumber(200000) }}</div>
            </div>
          </div>
        </dv-border-box-13>

        <dv-border-box-13 class="plane">
          <div class="data-item">
            <div class="data-icon">
              <img src="@/assets/images/screen/icon/icon2.png" alt="" class="width-img">
            </div>
            <div class="data-info">
              <div class="data-lable">历史抓拍数据量</div>
              <div class="data-num">{{ formatNumber(112313141111) }}</div>
            </div>
          </div>
        </dv-border-box-13>
      </div>
      <div id="faceChart" ref="faceChart"></div>
    </div>
  </div>

</template>

<script>
import WrapperTitle from '../wrapper-title/index';
import * as echarts from 'echarts';
let lineChart = null;
export default {
  name: 'ScreenFace',
  components: {
    WrapperTitle
  },
  data() {
    return {
      dataList: {
        state: { '01:00': 1000, '02:00': 2131, '03:00': 1233, '04:00': 2132, '05:00': 3211, '06:00': 213, '07:00': 123, '08:00': 566 },
        state2: { '01:00': 900, '02:00': 1131, '03:00': 1533, '04:00': 2132, '05:00': 3011, '06:00': 13, '07:00': 113, '08:00': 566 },
      },
    }
  },

  methods: {
    initChart() {
      const option = {
        legend: {
          right: 'right',
          top: 'top',
          orient: "vertical",
          icon: 'rect',
          data: [
            {
              name: '正常数',
              itemStyle: {
                color: 'rgba(62, 144, 247, 1)'
              }
            },
            {
              name: '异常数',
              itemStyle: {
                color: 'rgba(85, 192, 191, 1)'
              }
            },
          ],
        },
        grid: {
          left: '2%',
          right: '5%',
          bottom: '5%',
          top: '8%',
          containLabel: true
        },
        tooltip: {},
        xAxis: {
          type: 'category',
          data: Object.keys(this.dataList.state),
        },
        yAxis: {},
        series: [
          {
            name: '今日',
            data: Object.entries(this.dataList.state).map(([key, value]) => value),
            type: 'line',
            itemStyle: {
              color: 'rgba(62, 144, 247, 1)'
            }
          },
          {
            name: '昨日',
            data: Object.entries(this.dataList.state2).map(([key, value]) => value),
            type: 'line',
            itemStyle: {
              color: 'rgba(85, 192, 191, 1)'
            }
          }
        ]
      };
      lineChart.setOption(option, true);
    },

    formatNumber(value) {
      return new Intl.NumberFormat('en-US').format(value);
    }
  },

  mounted() {
    lineChart = echarts.init(this.$refs.faceChart);
    this.initChart();
  },
  beforeDestroy() {
    if (lineChart) {
      lineChart.dispose();
    }
  },
}
</script>

<style lang="scss" scoped>
.face-content {
  background: rgba(67, 102, 155, 0.3);
  border: 1px solid rgba(47, 91, 157, 0.8);

  .plane {
    margin-bottom: 10px;
  }

  .data-plane {
    .data-item {
      width: 100%;
      padding: 20px 20px;
      display: flex;
      align-items: center;

      .data-icon {
        width: 40px;
        margin: 0 20px;
      }

      .data-info {
        flex: 1;
        color: #5b83bd;
        font-size: 16px;

        .data-num {
          margin-top: 5px;
          font-size: 24px;
          color: #fff;
        }
      }
    }
  }

  #faceChart {
    width: 100%;
    height: 300px;
  }
}

.width-img {
  width: 100%;
}
</style>

 src/views/screen/components/screen-title/index.vue

New file
@@ -0,0 +1,41 @@
<template>
  <div class="header-container">
    <div class="header-content">
      <div class="header-bg">
        <img src="@/assets/images/screen/header_bg.png" class="width-img" alt="">
      </div>
      <div class="header-text">
        自贡运维考核可视化大屏
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'ScreenTitle'
}
</script>

<style lang="scss" scoped>
.header-container {
  width: 1000px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.width-img {
  width: 100%;
  display: block;
}
.header-text {
  position: absolute;
  left: 49%;
  top: 15px;
  transform: translateX(-50%);
  color: #fff;
  font-size: 30px;
}
</style>

 src/views/screen/components/screen-wrapper/index.vue

New file
@@ -0,0 +1,68 @@
<template>
  <div class="wrapper-container">
    <div class="wrapper-content">
      <div class="left-container wrapper">
        <screen-face></screen-face>
      </div>
      <div class="center-container wrapper">
        <screen-detection></screen-detection>
      </div>
      <div class="right-container wrapper">
        <screen-examine></screen-examine>
      </div>
    </div>
  </div>
</template>

<script>
import ScreenFace from '../screen-face/index';
import ScreenDetection from '../screen-detection/index';
import ScreenExamine from '../screen-examine/index';
export default {
  name: 'ScreenWrapper',
  components: {
    ScreenFace,
    ScreenDetection,
    ScreenExamine,
  },
}
</script>

<style lang="scss" scoped>
.wrapper-container {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  .wrapper-content {
    width: 100%;
    height: calc(100% - 100px);
    margin-top: 100px;
    border: 1px solid red;
    position: relative;
    box-sizing: border-box;
    padding: 20px;
    display: flex;
    align-items: center;
  }
}

.wrapper {
  width: 33.3%;
  height: 100%;
  box-sizing: border-box;
  padding: 0 10px;
  border: 1px solid red;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  &:first-of-type {
    padding-left: 0;
  }
  &:last-of-type {
    padding-right: 0;
  }
}
</style>

 src/views/screen/components/select-item/index.vue

New file
@@ -0,0 +1,15 @@
<template>
  <div class="select-container">
    
  </div>
</template>

<script>
  export default {
    
  }
</script>

<style lang="scss" scoped>

</style>

 src/views/screen/components/wrapper-title/index.vue

New file
@@ -0,0 +1,40 @@
<template>
  <div class="title-container">
    <span class="title">{{ title }}</span>
  </div>
</template>

<script>
export default {
  name: 'WrapperTitle',
  props: {
    title: {
      type: String,
      required: true
    }
  }
}
</script>

<style lang="scss" scoped>
.title-container {
  background-image: url("../../../../assets/images/screen/title_bg.png");
  background-size: 231px 100%;
  background-repeat: no-repeat;
  height: 38px;
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 10px;

  .title {
    margin-left: 20px;
    margin-top: -2px;
    color: #fff;
    letter-spacing: 2px;
    font-size: 20px;
    font-style: italic;
  }
}
</style>

 src/views/screen/index.vue

New file
@@ -0,0 +1,38 @@
<template>
  <div class="screen-container">
    <screen-title></screen-title>
    <v-scale-screen width="1920" height="1080" :autoScale="true" :delay="0" class="screen">
      <screen-wrapper></screen-wrapper>
    </v-scale-screen>
  </div>

</template>

<script>
import ScreenTitle from './components/screen-title/index.vue';
import ScreenWrapper from './components/screen-wrapper/index.vue';

export default {
  name: 'App',
  components: {
    ScreenTitle,
    ScreenWrapper,
  },
  data() {
    return {
    }
  },
  mounted() {

  }
}
</script>

<style lang="scss" scoped>
.screen {
  background: url('../../assets/images/screen/pageBg1.jpg') !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}
</style>

 src/views/system/car/index.vue

@@ -1,5 +1,39 @@
<template>
  <div class="app-container">
    <el-card class="box-card" >
      <el-row type="flex" align="middle" justify="space-between">
        <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6">
          <div class="icon-container" style="background-color: #5599F7">
            <i class="el-icon-truck"></i>
          </div>
        </el-col>
        <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16">
          <div class="dashboard">
            <div class="dashboard-item">
              <h3 style="color: #5C9BF8">{{ totalPosts }}</h3>
              <p>设备总数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #3eba45">{{ totalMembers }}</h3>
              <p>正常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #fe640d">{{ postsPercentage }}</h3>
              <p>异常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #7868d9">{{ totalViews }}</h3>
              <p>生成异常工单数</p >
            </div>
            <div class="dashboard-item">
              <h3>{{ viewsPercentage }}%</h3>
              <p>设备运行率</p >
            </div>
          </div>
        </el-col>
      </el-row>
    </el-card>

    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="设备名称" prop="name">
        <el-input
@@ -24,30 +58,7 @@
        />
        </el-select>
      </el-form-item>
      <el-form-item label="地址" prop="address">
        <el-input
          v-model="queryParams.address"
          placeholder="请输入行政区域"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="安装时间" prop="installedTime">
        <el-date-picker clearable
          v-model="queryParams.installedTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择安装时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="管理单位" prop="managementUnit">
        <el-input
          v-model="queryParams.managementUnit"
          placeholder="请输入管理单位"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>

       <el-form-item label="是否生成异常工单" prop="defaultOrder" label-width="130px">
         <el-select
           v-model="queryParams.defaultOrder"
@@ -169,6 +180,12 @@
  dicts: ['sys_normal_disable','platform_yes_no','camera_state'],
  data() {
    return {
      totalPosts: 1156,
      totalMembers: 1000,
      postsPercentage: 156,
      totalViews: 75,
      viewsPercentage: 91.36,
      totalErrors: 0,
      // 遮罩层
      loading: true,
      // 选中数组
@@ -327,3 +344,37 @@
  }
};
</script>

<style lang="scss" scoped>

.box-card {
  background-color: #F5F9FE;
  width: 100%;
  margin-bottom: 20px;
  height: 120px
}
.icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  width: 20%;
  height: 80px;
  margin-left: 5%;
}
.el-icon-truck {
  font-size: 50px;
  color: #FFFFFF;
}

.dashboard {
  display: flex;
  gap: 10%;
  align-items: center;
  margin-left: -50%;
}

.dashboard-item {
  text-align: center;
}
</style>

 src/views/system/check-result/index.vue

@@ -100,12 +100,12 @@
            icon="el-icon-view"
            @click="handleDetail(scope.row)"
          >详情</el-button>
          <el-button
            type="text"
            size="mini"
            icon="el-icon-edit"
            @click="handleSetManualScore(scope.row)"
          >人工打分</el-button>
<!--          <el-button-->
<!--            type="text"-->
<!--            size="mini"-->
<!--            icon="el-icon-edit"-->
<!--            @click="handleSetManualScore(scope.row)"-->
<!--          >人工打分</el-button>-->
          <el-button
            size="mini"
            type="text"
@@ -168,7 +168,7 @@
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-medal"></i>
            综合分数
            系统分数
          </template>
          <el-tag type="danger" size="small">{{detail.checkScore}}</el-tag>
        </el-descriptions-item>
@@ -182,7 +182,7 @@
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-medal"></i>
            系统分数
            综合分数
          </template>
          <el-tag type="danger" size="small">{{detail.systemScore}}</el-tag>
        </el-descriptions-item>

 src/views/system/contract/index.vue

@@ -380,7 +380,7 @@
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加【请填写功能名称】";
      this.title = "添加合同";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
@@ -389,7 +389,7 @@
      getContract(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改【请填写功能名称】";
        this.title = "修改合同";
      });
    },
    /** 提交按钮 */

 src/views/system/face/index.vue

@@ -1,5 +1,39 @@
<template>
  <div class="app-container">
    <el-card class="box-card" >
      <el-row type="flex" align="middle" justify="space-between">
        <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6">
          <div class="icon-container" style="background-color: #5599F7">
            <i class="el-icon-user"></i>
          </div>
        </el-col>
        <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16">
          <div class="dashboard">
            <div class="dashboard-item">
              <h3 style="color: #5C9BF8">{{ totalPosts }}</h3>
              <p>设备总数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #3eba45">{{ totalMembers }}</h3>
              <p>正常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #fe640d">{{ postsPercentage }}</h3>
              <p>异常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #7868d9">{{ totalViews }}</h3>
              <p>生成异常工单数</p >
            </div>
            <div class="dashboard-item">
              <h3>{{ viewsPercentage }}%</h3>
              <p>设备运行率</p >
            </div>
          </div>
        </el-col>
      </el-row>
    </el-card>

    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="设备名称" prop="name">
        <el-input
@@ -23,30 +57,6 @@
          :value="dict.value"
        />
        </el-select>
      </el-form-item>
      <el-form-item label="地址" prop="address">
        <el-input
          v-model="queryParams.address"
          placeholder="请输入地址"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="安装时间" prop="installedTime">
        <el-date-picker clearable
          v-model="queryParams.installedTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择安装时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="管理单位" prop="managementUnit">
        <el-input
          v-model="queryParams.managementUnit"
          placeholder="请输入管理单位"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
       <el-form-item label="是否生成异常工单" prop="defaultOrder" label-width="130px">
         <el-select
@@ -210,6 +220,12 @@
  dicts: ['sys_normal_disable','platform_yes_no','camera_state'],
  data() {
    return {
      totalPosts: 1156,
      totalMembers: 1000,
      postsPercentage: 156,
      totalViews: 75,
      viewsPercentage: 91.36,
      totalErrors: 0,
      // 遮罩层
      loading: true,
      // 选中数组
@@ -368,3 +384,37 @@
  }
};
</script>

<style lang="scss" scoped>

.box-card {
  background-color: #F5F9FE;
  width: 100%;
  margin-bottom: 20px;
  height: 120px
}
.icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  width: 20%;
  height: 80px;
  margin-left: 5%;
}
.el-icon-user {
  font-size: 50px;
  color: #FFFFFF;
}

.dashboard {
  display: flex;
  gap: 10%;
  align-items: center;
  margin-left: -50%;
}

.dashboard-item {
  text-align: center;
}
</style>

 src/views/system/recovery/index.vue

@@ -1,5 +1,39 @@
<template>
  <div class="app-container">
    <el-card class="box-card" >
      <el-row type="flex" align="middle" justify="space-between">
        <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6">
          <div class="icon-container" style="background-color: #5599F7">
            <i class="el-icon-refresh-left"></i>
          </div>
        </el-col>
        <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16">
          <div class="dashboard">
            <div class="dashboard-item">
              <h3 style="color: #5C9BF8">{{ totalPosts }}</h3>
              <p>设备总数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #3eba45">{{ totalMembers }}</h3>
              <p>正常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #fe640d">{{ postsPercentage }}</h3>
              <p>异常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #7868d9">{{ totalViews }}</h3>
              <p>生成异常工单数</p >
            </div>
            <div class="dashboard-item">
              <h3>{{ viewsPercentage }}%</h3>
              <p>设备运行率</p >
            </div>
          </div>
        </el-col>
      </el-row>
    </el-card>

    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="设备名称" prop="name">
        <el-input
@@ -23,32 +57,6 @@
          :value="dict.value"
        />
        </el-select>
      </el-form-item>
      <el-form-item label="地址" prop="address">
        <el-input
          v-model="queryParams.address"
          placeholder="请输入地址"
          clearable
          @keyup.enter.native="handleQuery"
          style="width: 170px"
        />
      </el-form-item>
      <el-form-item label="异常恢复时间" prop="recoveryTime" label-width="130px">
        <el-date-picker clearable
          v-model="queryParams.recoveryTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择异常恢复时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="管理单位" prop="managementUnit">
        <el-input
          v-model="queryParams.managementUnit"
          placeholder="请输入管理单位"
          clearable
          @keyup.enter.native="handleQuery"
          style="width: 170px"
        />
      </el-form-item>
       <el-form-item label="是否生成异常工单" prop="defaultOrder" label-width="130px">
         <el-select
@@ -170,6 +178,12 @@
  dicts: ['sys_normal_disable','platform_yes_no','camera_state'],
  data() {
    return {
      totalPosts: 1156,
      totalMembers: 1000,
      postsPercentage: 156,
      totalViews: 75,
      viewsPercentage: 91.36,
      totalErrors: 0,
      // 遮罩层
      loading: true,
      // 选中数组
@@ -328,3 +342,37 @@
  }
};
</script>

<style lang="scss" scoped>

.box-card {
  background-color: #F5F9FE;
  width: 100%;
  margin-bottom: 20px;
  height: 120px
}
.icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  width: 20%;
  height: 80px;
  margin-left: 5%;
}
.el-icon-refresh-left {
  font-size: 50px;
  color: #FFFFFF;
}

.dashboard {
  display: flex;
  gap: 10%;
  align-items: center;
  margin-left: -50%;
}

.dashboard-item {
  text-align: center;
}
</style>

 src/views/system/score/index.vue

@@ -17,16 +17,6 @@
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="操作类型" prop="operateCategory">
        <el-select v-model="queryParams.operateCategory" placeholder="请选择操作类型" clearable>
          <el-option
            v-for="dict in dict.type.platform_operate_category"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="积分类型" prop="scoreCategory">
        <el-input
          v-model="queryParams.scoreCategory"
@@ -49,7 +39,6 @@
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['platform:score:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
@@ -60,7 +49,6 @@
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['platform:score:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
@@ -71,7 +59,6 @@
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['platform:score:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
@@ -81,7 +68,6 @@
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['platform:score:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
@@ -92,11 +78,6 @@
      <el-table-column label="考核名" align="center" prop="examineName" />
      <el-table-column label="单位名" align="center" prop="unitName" />
      <el-table-column label="分值" align="center" prop="score" />
      <el-table-column label="操作类型" align="center" prop="operateCategory">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.platform_operate_category" :value="scope.row.operateCategory"/>
        </template>
      </el-table-column>
      <el-table-column label="积分类型" align="center" prop="scoreCategory">
      <template slot-scope="scope">
        <div v-if="scope.row.scoreCategory === 1">视频在线率</div>
@@ -113,14 +94,12 @@
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['platform:score:edit']"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['platform:score:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
@@ -154,16 +133,6 @@
          <el-select v-model="form.examineId" placeholder="请选择">
            <el-option
              v-for="item in examineList"
              :key="item.id"
              :label="item.value"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="操作类型" prop="operateCategory">
          <el-select v-model="form.operateCategory" placeholder="请选择操作类型">
            <el-option
              v-for="item in operateCategoryList"
              :key="item.id"
              :label="item.value"
              :value="item.id">

 src/views/system/unit/people/index.vue

@@ -84,6 +84,7 @@
      <el-table-column label="运维人员账号" align="center" prop="ywPersonAccount" />
      <el-table-column label="所属运维单位" align="center" prop="belongUnitName" />
      <el-table-column label="联系电话" align="center" prop="phone" />
      <el-table-column label="备注" align="center" prop="remark" />
      <el-table-column label="操作" fixed="right" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
@@ -135,6 +136,9 @@
        <el-form-item label="联系电话" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入联系电话" />
        </el-form-item>
        <el-form-item label="联系电话" prop="remark">
          <el-input v-model="form.remark" type="textarea" show-word-limit maxlength="150" placeholder="请输入备注" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>

 src/views/system/video/index.vue

@@ -1,5 +1,41 @@
<template>

  <div class="app-container">

    <el-card class="box-card" >
      <el-row type="flex" align="middle" justify="space-between">
        <el-col :xl="8" :lg="8" :md="10" :sm="8" :xs="6">
        <div class="icon-container" style="background-color: #5599F7">
          <i class="el-icon-video-camera"></i>
        </div>
        </el-col>
        <el-col :xl="14" :lg="14" :md="12" :sm="14" :xs="16">
          <div class="dashboard">
            <div class="dashboard-item">
              <h3 style="color: #5C9BF8">{{ totalPosts }}</h3>
              <p>设备总数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #3eba45">{{ totalMembers }}</h3>
              <p>正常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #fe640d">{{ postsPercentage }}</h3>
              <p>异常数</p >
            </div>
            <div class="dashboard-item">
              <h3 style="color: #7868d9">{{ totalViews }}</h3>
              <p>生成异常工单数</p >
            </div>
            <div class="dashboard-item">
              <h3>{{ viewsPercentage }}%</h3>
              <p>设备运行率</p >
            </div>
          </div>
        </el-col>
      </el-row>
    </el-card>

    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="设备名称" prop="name">
        <el-input
@@ -23,30 +59,6 @@
          :value="dict.value"
        />
        </el-select>
      </el-form-item>
      <el-form-item label="地址" prop="address">
        <el-input
          v-model="queryParams.address"
          placeholder="请输入地址"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="安装时间" prop="installedTime">
        <el-date-picker clearable
          v-model="queryParams.installedTime"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="请选择安装时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="管理单位" prop="managementUnit">
        <el-input
          v-model="queryParams.managementUnit"
          placeholder="请输入管理单位"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
       <el-form-item label="是否生成异常工单" prop="defaultOrder" label-width="130px">
         <el-select
@@ -167,6 +179,12 @@
  dicts: ['sys_normal_disable', 'platform_yes_no','camera_state'],
  data() {
    return {
      totalPosts: 1156,
      totalMembers: 1000,
      postsPercentage: 156,
      totalViews: 75,
      viewsPercentage: 91.36,
      totalErrors: 0,
      // 遮罩层
      loading: true,
      // 选中数组
@@ -327,3 +345,36 @@
  }
};
</script>
<style lang="scss" scoped>

.box-card {
  background-color: #F5F9FE;
  width: 100%;
  margin-bottom: 20px;
  height: 120px
}
.icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  width: 20%;
  height: 80px;
  margin-left: 5%;
}
.el-icon-video-camera {
  font-size: 50px;
  color: #FFFFFF;
}

.dashboard {
  display: flex;
  gap: 10%;
  align-items: center;
  margin-left: -50%;
}

.dashboard-item {
  text-align: center;
}
</style>