首页

imt-ui/.env.dev

@@ -2,9 +2,9 @@
 ENV = 'development'
 
 # 页面标题
-VUE_APP_TITLE = 芋道管理系统
+VUE_APP_TITLE = 智能机床运维管理系统
 
-# 芋道管理系统/开发环境
+# 智能机床运维管理系统/开发环境
 VUE_APP_BASE_API = 'http://localhost:48080'
 
 # 路由懒加载

imt-ui/.env.front

@@ -2,9 +2,9 @@
 ENV = 'development'
 
 # 页面标题
-VUE_APP_TITLE = 芋道管理系统
+VUE_APP_TITLE = 智能机床运维管理系统
 
-# 芋道管理系统/本地环境
+# 智能机床运维管理系统/本地环境
 VUE_APP_BASE_API = 'http://api-dashboard.yudao.iocoder.cn'
 
 # 路由懒加载

imt-ui/.env.prod

@@ -2,9 +2,9 @@
 NODE_ENV = 'production'
 
 # 页面标题
-VUE_APP_TITLE = 芋道管理系统
+VUE_APP_TITLE = 智能机床运维管理系统
 
-# 芋道管理系统/生产环境
+# 智能机床运维管理系统/生产环境
 VUE_APP_BASE_API = '/prod-api'
 
 # 根据服务器或域名修改

imt-ui/.env.stage

@@ -1,12 +1,12 @@
 NODE_ENV = production
 
 # 页面标题
-VUE_APP_TITLE = 芋道管理系统
+VUE_APP_TITLE = 智能机床运维管理系统
 
 # 测试环境配置
 ENV = 'staging'
 
-# 芋道管理系统/测试环境
+# 智能机床运维管理系统/测试环境
 VUE_APP_BASE_API = 'http://api-dashboard.yudao.iocoder.cn'
 
 # 静态资源地址

imt-ui/.env.static

@@ -4,9 +4,9 @@ NODE_ENV = development
 ENV = 'staging'
 
 # 页面标题
-VUE_APP_TITLE = 芋道管理系统
+VUE_APP_TITLE = 智能机床运维管理系统
 
-# 芋道管理系统/测试环境
+# 智能机床运维管理系统/测试环境
 VUE_APP_BASE_API = 'http://127.0.0.1:48080'
 
 # 根据服务器或域名修改

imt-ui/src/assets/styles/login.scss

@@ -14,7 +14,7 @@ $containerBgImage: '../assets/images/bg.png';
 // container-logo
 $logoWidth: 417px;
 $logoHeight: 64px;
-$logoImage: '../assets/logo/login-logo.png';
+// $logoImage: '../assets/logo/login-logo.png';
 // container-content
 $contentWidth: round($W / $H * 100) * 1vw;
 $contentHeight: round($picH / $W * 100) / 100 * $contentWidth;
@@ -65,13 +65,15 @@ $buttonHeight: $buttonH * 1px;
     // 元素
     width: $logoWidth;
     height: $logoHeight;
-    background-image: url($logoImage);
+    //background-image: url($logoImage);
     background-size: contain;
     // 定位
     position: absolute;
-    top: 50px;
+    top: 10%;
     left: 50%;
     margin-left: -$logoWidth/2;
+    text-align: center;
+    font-size: 40px;
   }
   .content {
     // 元素

imt-ui/src/layout/components/Navbar.vue

@@ -12,13 +12,13 @@
         <!-- 站内信 -->
         <notify-message class="right-menu-item hover-effect" />
 
-        <el-tooltip content="源码地址" effect="dark" placement="bottom">
+<!--        <el-tooltip content="源码地址" effect="dark" placement="bottom">
           <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
         </el-tooltip>
 
         <el-tooltip content="文档地址" effect="dark" placement="bottom">
           <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
-        </el-tooltip>
+        </el-tooltip>-->
 
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
 

imt-ui/src/layout/components/Sidebar/Logo.vue

@@ -35,7 +35,7 @@ export default {
   },
   data() {
     return {
-      title: '芋道管理系统',
+      title: '智能机床运维管理系统',
       logo: logoImg
     }
   }

imt-ui/src/main.js

@@ -40,12 +40,12 @@ Vue.prototype.divide = divide
 
 // 全局组件挂载
 Vue.component('DictTag', DictTag)
-Vue.component('DocAlert', DocAlert)
+// Vue.component('DocAlert', DocAlert)
 Vue.component('Pagination', Pagination)
 Vue.component('RightToolbar', RightToolbar)
 // 字典标签组件
 import DictTag from '@/components/DictTag'
-import DocAlert from '@/components/DocAlert'
+// import DocAlert from '@/components/DocAlert'
 // 头部标签插件
 import VueMeta from 'vue-meta'
 

imt-ui/src/router/index.js

@@ -67,10 +67,10 @@ export const constantRoutes = [
   {
     path: '',
     component: Layout,
-    redirect: 'index',
+    redirect: 'imtIndex',
     children: [{
-        path: 'index',
+        path: 'imtIndex',
-        component: (resolve) => require(['@/views/index'], resolve),
+        component: (resolve) => require(['@/views/imtIndex'], resolve),
         name: '首页',
         meta: {title: '首页', icon: 'dashboard', affix: true}
       }

imt-ui/src/utils/constants.js

@@ -102,7 +102,7 @@ export const InfraApiErrorLogProcessStatusEnum = {
  * 用户的社交平台的类型枚举
  */
 export const SystemUserSocialTypeEnum = {
-  DINGTALK: {
+  /*DINGTALK: {
     title: "钉钉",
     type: 20,
     source: "dingtalk",
@@ -113,7 +113,7 @@ export const SystemUserSocialTypeEnum = {
     type: 30,
     source: "wechat_enterprise",
     img: "https://s1.ax1x.com/2022/05/22/OzMrzn.png",
-  }
+  }*/
 }
 
 /**

imt-ui/src/views/home/LineChart.vue

@@ -0,0 +1,107 @@
+<template>
+  <div :class="className" :style="{height:height,width:width}" />
+</template>
+
+<script>
+import * as echarts from 'echarts'
+// require('echarts/theme/macarons') // echarts theme
+import resize from '../dashboard/mixins/resize'
+
+export default {
+  mixins: [resize],
+  props: {
+    className: {
+      type: String,
+      default: 'chart'
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '300px'
+    },
+    autoResize: {
+      type: Boolean,
+      default: true
+    },
+    chartData: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      chart: null
+    }
+  },
+  watch: {
+    chartData: {
+      deep: true,
+      handler(val) {
+        this.setOptions(val)
+      }
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons')
+      this.setOptions(this.chartData)
+    },
+    setOptions({ yData, xData } = {}) {
+      this.chart.setOption({
+        grid: {
+          left: '0%',    // 左边距
+          right: '2%',   // 右边距
+          top: '5%',     // 上边距
+          bottom: '5%',  // 下边距
+          containLabel: true // 如果标签(label)过长超过了grid区域，是否保持全部显示
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: xData
+        },
+        yAxis: {
+          type: 'value'
+        },
+        series: [
+          {
+            data: yData,
+            type: 'line',
+            symbol: 'none',
+            smooth: false, // 可选，是否平滑曲线
+            itemStyle: {
+              normal: {
+                color: 'green', // 折线点的颜色
+                lineStyle: {
+                  color: 'green', // 折线的颜色
+                  width: 2, // 折线宽度
+                  type: 'solid' // 折线类型
+                },
+                areaStyle: {
+                  type: 'default', // 填充类型
+                  color: 'rgba(0, 255, 0, 0.1)' // 折线下方区域的颜色及透明度
+                }
+              }
+            }
+          }
+        ]
+      })
+    }
+  }
+}
+</script>

imt-ui/src/views/imtIndex.vue

@@ -0,0 +1,333 @@
+<template>
+  <div class="dashboard-editor-container">
+    <el-row :gutter="30" class="panel-group">
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="customerImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              接入厂家数量
+            </div>
+            <count-to :start-val="0" :end-val="groupData.customer" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="deviceImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              接入设备数量
+            </div>
+            <count-to :start-val="0" :end-val="groupData.device" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="onLineImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              在线设备
+            </div>
+            <count-to :start-val="0" :end-val="groupData.onLine" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="offLineImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              离线设备
+            </div>
+            <count-to :start-val="0" :end-val="groupData.offLine" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="runningImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              运行中设备
+            </div>
+            <count-to :start-val="0" :end-val="groupData.running" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+      <el-col :sm="8" :lg="4" class="card-panel-col">
+        <div class="card-panel" >
+          <div class="card-panel-icon-wrapper">
+            <el-image  :src="shutdownImage"></el-image>
+          </div>
+          <div class="card-panel-description">
+            <div class="card-panel-text">
+              停机维护设备
+            </div>
+            <count-to :start-val="0" :end-val="groupData.shutdown" :duration="2600" class="card-panel-num" />
+          </div>
+        </div>
+      </el-col>
+    </el-row>
+    <el-row class="second-row" :gutter="40" >
+      <el-col :sm="32" :lg="16" class="statisticchart" style="padding-left: 0px; padding-right: 0px;">
+        <el-card class="box-card">
+          <div slot="header" class="head">
+            <el-image :src="titleImage" style="height: 20px;"></el-image>
+            <span>&nbsp设备在线统计</span>
+          </div>
+          <div class="text item">
+            <line-chart :chart-data="lineChartData" />
+          </div>
+        </el-card>
+
+      </el-col>
+      <el-col :sm="16" :lg="8" class="todolist">
+        <el-card class="box-card">
+          <div slot="header" class="head">
+            <el-image :src="titleImage" style="height: 20px;"></el-image>
+            <span>&nbsp我的待办</span>
+            <el-button style="float: right; padding: 3px 0" type="text" @click="goMytodo">更多</el-button>
+          </div>
+          <el-table :data="taskList" :border="false" class="taskTable">
+            <el-table-column label="流程名称" align="center" prop="processName" :show-overflow-tooltip="true" />
+            <el-table-column label="任务名称" align="center" prop="taskName" :show-overflow-tooltip="true" />
+            <el-table-column label="发起人" align="center" prop="starter" :show-overflow-tooltip="true" />
+            <el-table-column label="任务时间" align="center" prop="createTime" width="180" :show-overflow-tooltip="true" />
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+    <el-row class="third-row" :gutter="20" >
+      <el-col :sm="24" :lg="12" class="warnlist">
+        <el-card class="box-card">
+          <div slot="header" class="head">
+            <el-image :src="titleImage" style="height: 20px;"></el-image>
+            <span>&nbsp报警信息</span>
+            <el-button style="float: right; padding: 3px 0" type="text" @click="goAlarm">更多</el-button>
+          </div>
+          <el-table :data="alarmList" :border="false" class="taskTable">
+            <el-table-column label="客户名称" align="center" prop="customerName" :show-overflow-tooltip="true" />
+            <el-table-column label="设备名称" align="center" prop="deviceName" :show-overflow-tooltip="true" />
+            <el-table-column label="报警信息" align="center" prop="alarmInfo" :show-overflow-tooltip="true" />
+            <el-table-column label="报警时间" align="center" prop="alarmTime" width="180" :show-overflow-tooltip="true" />
+          </el-table>
+        </el-card>
+      </el-col>
+      <el-col :sm="24" :lg="12" class="orderlist">
+        <el-card class="box-card">
+          <div slot="header" class="head">
+            <el-image :src="titleImage" style="height: 20px;"></el-image>
+            <span>&nbsp维修工单</span>
+            <el-button style="float: right; padding: 3px 0" type="text" @click="goOrder">更多</el-button>
+          </div>
+          <el-table :data="orderList" :border="false" class="taskTable">
+            <el-table-column label="客户名称" align="center" prop="customerName" :show-overflow-tooltip="true" />
+            <el-table-column label="故障时间" align="center" prop="failureTime" :show-overflow-tooltip="true" />
+            <el-table-column label="故障类型" align="center" prop="failureType" :show-overflow-tooltip="true" />
+            <el-table-column label="进度" align="center" prop="progress" width="180" :show-overflow-tooltip="true" />
+          </el-table>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import LineChart from './home/LineChart'
+import CountTo from 'vue-count-to'
+
+const lineChartData = {
+    yData: [28, 27, 25, 26, 28, 22, 25, 25, 23, 27],
+    xData: ['09-03','09-04','09-05','09-06', '09-07', '09-08', '09-09', '09-10', '09-11', '09-12']
+}
+
+export default {
+  name: 'Index',
+  components: {
+    LineChart,
+    CountTo
+  },
+  data() {
+    return {
+      lineChartData: lineChartData,
+      taskList: [{processName:'设备维修',taskName:'维修派单',starter:'张帆',createTime:'2024-09-13 10:56:27'},
+        {processName:'设备维修',taskName:'维修审批',starter:'吴恒',createTime:'2024-09-12 18:13:10'},
+        {processName:'设备维修',taskName:'维修评价',starter:'李科',createTime:'2024-09-12 16:29:12'}],
+      alarmList: [{customerName:'机加工一厂',deviceName:'钻工机床',alarmInfo:'X轴轴承电流过载',alarmTime:'2024-09-13 11:07:58'},
+        {customerName:'机加工二厂',deviceName:'硬轨机床',alarmInfo:'X轴排屑温度过高',alarmTime:'2024-09-13 10:27:28'},
+        {customerName:'机加工三厂',deviceName:'线轨机床',alarmInfo:'z轴轴承温度过高',alarmTime:'2024-09-12 15:09:18'}],
+      orderList: [{customerName:'机加工一厂',failureType:'轴承磨损',progress:'派工',failureTime:'2024-09-13 11:07:58'},
+        {customerName:'机加工二厂',failureType:'排屑堵塞',progress:'维修中',failureTime:'2024-09-13 10:27:28'},
+        {customerName:'机加工三厂',failureType:'机床底座不稳',progress:'待确认',failureTime:'2024-09-12 15:09:18'}],
+      groupData: {
+        customer: 5,
+        device: 28,
+        onLine: 25,
+        offLine: 3,
+        running: 23,
+        shutdown: 2
+      },
+      customerImage: require('../assets/png/customer.png'),
+      deviceImage: require('../assets/png/device.png'),
+      onLineImage: require('../assets/png/online.png'),
+      offLineImage: require('../assets/png/offline.png'),
+      runningImage: require('../assets/png/running.png'),
+      shutdownImage: require('../assets/png/shutdown.png'),
+      titleImage:require('../assets/png/title.png'),
+    }
+  },
+  methods: {
+    /*handleSetLineChartData(type) {
+      this.lineChartData = lineChartData[type]
+    }*/
+
+    goMytodo(){
+      this.$router.push({ path: "/bpm/task/todo" });
+    },
+    goAlarm(){
+      this.$router.push({ path: "/alarm/equipalarm" });
+    },
+    goOrder(){
+      this.$router.push({ path: "/maintenance/remote-maintenance-order" });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.app-main{
+  background-color: rgb(240, 242, 245);
+}
+.dashboard-editor-container {
+  padding-top: 10px;
+  padding-left: 25px;
+  padding-right: 25px;
+  padding-bottom: 25px;
+
+  background-color: rgb(240, 242, 245);
+  position: relative;
+
+  .chart-wrapper {
+    background: #fff;
+    padding: 16px 16px 0;
+    margin-bottom: 20px;
+  }
+  .panel-group{
+    margin-top: 18px;
+
+    .card-panel-col {
+      margin-bottom: 25px;
+    }
+
+    .card-panel {
+      height: 108px;
+      cursor: pointer;
+      font-size: 12px;
+      position: relative;
+      overflow: hidden;
+      background: #fff;
+      border-color: rgba(0, 0, 0, .05);
+      border-radius: 4px;
+      border: 1px solid #e6ebf5;
+      -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+
+
+      .card-panel-icon-wrapper {
+        float: left;
+        margin: 14px 0 0 14px;
+        padding: 16px;
+        transition: all 0.38s ease-out;
+        border-radius: 6px;
+        .el-image{
+          top: -5px;
+          height: 60px;
+        }
+      }
+
+      .card-panel-icon {
+        float: left;
+        font-size: 48px;
+      }
+
+      .card-panel-description {
+        float: right;
+        font-weight: bold;
+        margin: 26px 26px 26px 0;
+        text-align: center;
+
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.6);
+          font-size: 16px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 20px;
+        }
+      }
+    }
+  }
+  .second-row{
+    margin-left: 0px !important;
+    .statisticchart{
+      border-color: rgba(0, 0, 0, .05);
+      border-radius: 4px;
+      border: 1px solid #e6ebf5;
+      -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+      .box-card{
+        .head{
+          font-size: 22px;
+        }
+      }
+    }
+    .todolist{
+      .box-card{
+        height: 389px;
+        .head{
+          font-size: 22px;
+        }
+      }
+    }
+  }
+  .third-row{
+    padding-top: 25px;
+    .warnlist{
+      .box-card{
+        height: 250px;
+        .head{
+          font-size: 22px;
+        }
+      }
+    }
+    .orderlist{
+      .box-card{
+        height: 250px;
+        .head{
+          font-size: 22px;
+        }
+      }
+    }
+  }
+}
+
+@media (max-width:1024px) {
+  .chart-wrapper {
+    padding: 8px;
+  }
+}
+</style>

imt-ui/src/views/login.vue

@@ -1,6 +1,6 @@
 <template xmlns="">
   <div class="container">
-    <div class="logo"></div>
+    <div class="logo">智能机床运维管理系统</div>
     <!-- 登录区域 -->
     <div class="content">
       <!-- 配图 -->
@@ -9,7 +9,7 @@
       <div class="field">
         <!-- [移动端]标题 -->
         <h2 class="mobile-title">
-          <h3 class="title">芋道后台管理系统</h3>
+          <h3 class="title">智能机床运维管理系统</h3>
         </h2>
 
         <!-- 表单 -->
@@ -17,8 +17,8 @@
           <el-tabs class="form" v-model="loginForm.loginType" style=" float:none;">
             <el-tab-pane label="账号密码登录" name="uname">
             </el-tab-pane>
-            <el-tab-pane label="短信验证码登录" name="sms">
+<!--            <el-tab-pane label="短信验证码登录" name="sms">
-            </el-tab-pane>
+            </el-tab-pane>-->
           </el-tabs>
           <div>
             <el-form ref="loginForm" :model="loginForm" :rules="LoginRules" class="login-form">
@@ -83,14 +83,6 @@
                     </div>
                 </div>
               </el-form-item>
-
-              <!-- 教程说明 -->
-              <el-form-item style="width:100%; margin-top:-25px">
-                <el-link href="https://doc.iocoder.cn/" target="_blank">📚开发指南</el-link>
-                <el-link href="https://doc.iocoder.cn/video/" target="_blank" style="padding-left: 10px">🔥视频教程</el-link>
-                <el-link href="https://www.iocoder.cn/Interview/good-collection/" target="_blank" style="padding-left: 10px">⚡面试手册</el-link>
-                <el-link href="http://static.yudao.iocoder.cn/mp/Aix9975.jpeg" target="_blank" style="padding-left: 10px">🤝外包咨询</el-link>
-              </el-form-item>
             </el-form>
           </div>
         </div>

imt-ui/src/views/socialLogin.vue

@@ -9,7 +9,7 @@
       <div class="field">
         <!-- [移动端]标题 -->
         <h2 class="mobile-title">
-          <h3 class="title">芋道后台管理系统</h3>
+          <h3 class="title">智能机床运维管理系统</h3>
         </h2>
 
         <!-- 表单 -->

imt-ui/src/views/sso.vue

@@ -9,7 +9,7 @@
       <div class="field">
         <!-- [移动端]标题 -->
         <h2 class="mobile-title">
-          <h3 class="title">芋道后台管理系统</h3>
+          <h3 class="title">智能机床运维管理系统</h3>
         </h2>
 
         <!-- 表单 -->

imt-ui/vue.config.js

@@ -8,7 +8,7 @@ function resolve(dir) {
 
 const CompressionPlugin = require('compression-webpack-plugin')
 
-const name = process.env.VUE_APP_TITLE || '芋道管理系统' // 网页标题
+const name = process.env.VUE_APP_TITLE || '智能机床运维管理系统' // 网页标题
 
 const port = process.env.port || process.env.npm_config_port || 80 // 端口