init2

.env.development

@@ -1,10 +1,10 @@
 # 页面标题
-VUE_APP_TITLE = 商挈管理系统
+VUE_APP_TITLE = 科研生产展示平台
 
 # 开发环境配置
 ENV = 'development'
 
-# 商挈管理系统/开发环境
+# 科研生产展示平台/开发环境
 VUE_APP_BASE_API = '/dev-api'
 
 # 路由懒加载

.env.production

@@ -1,9 +1,9 @@
 # 页面标题
-VUE_APP_TITLE = 商挈管理系统
+VUE_APP_TITLE = 科研生产展示平台
 
 # 生产环境配置
 ENV = 'production'
 
-# 商挈管理系统/生产环境
+# 科研生产展示平台/生产环境
 VUE_APP_BASE_API = 'http://120.26.107.74:1818'
 #VUE_APP_BASE_API = 'http://127.0.0.1:1818'

.env.staging

@@ -1,11 +1,11 @@
 # 页面标题
-VUE_APP_TITLE = 商挈管理系统
+VUE_APP_TITLE = 科研生产展示平台
 
 NODE_ENV = production
 
 # 测试环境配置
 ENV = 'staging'
 
-# 商挈管理系统/测试环境
+# 科研生产展示平台/测试环境
 #VUE_APP_BASE_API = '/stage-api'
 VUE_APP_BASE_API = '/'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ruoyi",
   "version": "3.7.0",
-  "description": "商挈管理系统",
+  "description": "科研生产展示平台",
   "author": "商挈",
   "license": "MIT",
   "scripts": {

src/layout/components/Navbar.vue

@@ -6,7 +6,7 @@
     <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
 
     <div class="right-menu">
-      <div @click="$router.push('/bigScreen/drivingCabin')" class="right-menu-item hover-effect">大屏</div>
+      <!-- <div @click="$router.push('/bigScreen/drivingCabin')" class="right-menu-item hover-effect">大屏</div> -->
       <template v-if="device!=='mobile'">
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
 

src/layout/components/Sidebar/Logo.vue

@@ -2,8 +2,9 @@
   <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
+      <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">红峡</h1>
+        <!-- <img v-if="logo" :src="logo" class="sidebar-logo" /> -->
+        <!-- <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1> -->
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="/">
         <img v-if="logo" :src="logo" class="sidebar-logo" />
@@ -35,8 +36,9 @@ export default {
   },
   data() {
     return {
-      title: '商挈管理系统',
-      logo: logoImg
+      title: '科研生产展示平台',
+      // logo: logoImg,
+      logo: false
     }
   }
 }
@@ -66,8 +68,9 @@ export default {
     width: 100%;
 
     & .sidebar-logo {
-      width: 32px;
-      height: 32px;
+      // width: 32px;
+      // height: 32px;
+      height: 38px;
       vertical-align: middle;
       margin-right: 12px;
     }

src/views/bigScreen/components/bigScreenBtn/index.vue

@@ -0,0 +1,55 @@
+
+
+<template>
+  <div class="bigScreenBtn" :class="{selected:selected}">
+    <div>{{title}}</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BigScreenBtn',
+  props: {
+    title: {
+      type: String,
+      default: '按钮',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.bigScreenBtn {
+  cursor: pointer;
+  user-select: none;
+  width: 125px;
+  height: 32px;
+  line-height: 25px;
+  padding-left: 22px;
+  box-sizing: border-box;
+  font-size: 18px;
+  font-family: PingFangSC-Semibold, PingFang SC;
+  font-weight: initial;
+  color: rgba(255, 255, 255, 0.6);
+  background-size: 100% 100%;
+  background-image: url(./default.png);
+}
+.bigScreenBtn:hover {
+    opacity: .8;
+}
+
+.bigScreenBtn.selected {
+  font-weight: 600;
+  color: #ffffff;
+  background-image: url(./selected.png);
+}
+</style>

src/views/bigScreen/components/bigScreenHead/index.vue

@@ -0,0 +1,74 @@
+
+
+<template>
+  <div class="bigScreenHead">
+    <div class="tit">驾驶舱总览</div>
+    <el-row style="width: 100%;">
+      <el-col :span="8">
+        <el-row style="padding: 0px 20px">
+          <el-col :span="8">
+            <bigScreenBtn title="驾驶舱总览" :selected="true"></bigScreenBtn>
+          </el-col>
+          <el-col :span="8">
+            <bigScreenBtn title="科研生产" :selected="false"></bigScreenBtn>
+          </el-col>
+          <el-col :span="8">
+            <bigScreenBtn title="经营管理" :selected="false"></bigScreenBtn>
+          </el-col>
+        </el-row>
+      </el-col>
+      <el-col :span="8" style="min-height: 1px">
+      </el-col>
+      <el-col :span="8">
+        <el-row style="padding: 0px 0 0 60px">
+          <el-col :span="8">
+            <bigScreenBtn title="质量管理" :selected="false"></bigScreenBtn>
+          </el-col>
+          <el-col :span="8">
+            <bigScreenBtn title="安全管理" :selected="false"></bigScreenBtn>
+          </el-col>
+          <el-col :span="8">
+            <bigScreenBtn title="信息化管理" :selected="false"></bigScreenBtn>
+          </el-col>
+        </el-row>
+      </el-col>
+    </el-row>
+
+  </div>
+</template>
+
+<script>
+
+import bigScreenBtn from "../bigScreenBtn/index.vue";
+export default {
+  name: 'BigScreenHead',
+  props: {},
+  components: {
+    bigScreenBtn
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.bigScreenHead {
+  width: 1920px;
+  height: 100px;
+  background-image: url(./bg.png);
+  background-size: 100% 80px;
+  background-repeat: no-repeat;
+  .tit {
+    font-size: 36px;
+    font-family: YouSheBiaoTiHei;
+    color: #91d5fe;
+    line-height: 47px;
+    letter-spacing: 6px;
+    text-align: center;
+    padding-top: 13px;
+  }
+}
+</style>

src/views/bigScreen/components/container1/index.vue

@@ -0,0 +1,82 @@
+
+
+<template>
+  <div class="container1">
+      <div class="content">
+            <slot />
+            <div class="spot spot1"></div>
+            <div class="spot spot2"></div>
+            <div class="spot spot3"></div>
+            <div class="spot spot4"></div>
+      </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Container1',
+  props: {
+    title: {
+      type: String,
+      default: '',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+.container1 {
+    width: 535px;
+    padding: 7px 0;
+    border-top: 1px solid rgba(84,130,189);
+    border-bottom: 1px solid rgba(84,130,189);
+    font-size: 18px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #FFFFFF;
+    .content {
+        position: relative;
+        height: 161px;
+        background-color: rgba(2, 18, 63, 0.2);
+        border-top: 1px solid #91D5FE;
+        border-bottom: 1px solid #91D5FE;
+        .spot {
+            position: absolute;
+            width: 6px;
+            height: 6px;
+            background-color: #91D5FE;
+            border-radius: 50%;
+        }
+        .spot1 {
+            top: -3px;
+            left: 0;
+        }
+        .spot2 {
+            top: -3px;
+            right: 0;
+        }
+        .spot3 {
+            bottom: -3px;
+            left: 0;
+        }
+        .spot4 {
+            bottom: -3px;
+            right: 0;
+        }
+    }
+
+}
+
+
+
+</style>

src/views/bigScreen/components/container2/index.vue

@@ -0,0 +1,66 @@
+
+
+<template>
+  <div class="container2">
+    <div class="tit"><rocketTit>{{title}}</rocketTit></div>
+      <div class="content">
+        <slot />
+      </div>
+  </div>
+</template>
+
+<script>
+import rocketTit from "../rocketTit/index.vue";
+
+export default {
+  name: 'Container2',
+  components: {
+    rocketTit,
+  },
+  props: {
+    title: {
+      type: String,
+      default: '',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+.container2 {
+    display: flex;
+    flex-direction: column;
+    width: 536px;
+    height: 394px;
+    background-image: url(./bg.png);
+    background-size: cover;
+    color: #FFFFFF;
+    font-size: 16px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+
+    .tit {
+      padding: 16px 16px 16px 24px;
+    }
+    .content {
+      flex: 1;
+      padding: 2px;
+      box-sizing: border-box;
+      overflow: hidden;
+    }
+
+}
+
+
+
+</style>

src/views/bigScreen/components/container3/index.vue

@@ -0,0 +1,39 @@
+
+
+<template>
+  <div class="container3">
+    <slot />
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: 'Container3',
+  props: {
+    title: {
+      type: String,
+      default: '',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.container3 {
+  width: 766px;
+  height: 632px;
+  background-image: url(./bg.png);
+  background-size: cover;
+  overflow: hidden;
+}
+</style>

src/views/bigScreen/components/container4/index.vue

@@ -0,0 +1,66 @@
+
+
+<template>
+  <div class="container2">
+    <div class="tit"><rocketTit>{{title}}</rocketTit></div>
+      <div class="content">
+        <slot />
+      </div>
+  </div>
+</template>
+
+<script>
+import rocketTit from "../rocketTit/index.vue";
+
+export default {
+  name: 'Container2',
+  components: {
+    rocketTit,
+  },
+  props: {
+    title: {
+      type: String,
+      default: '',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+.container2 {
+    display: flex;
+    flex-direction: column;
+    width: 930px;
+    height: 311px;
+    background-image: url(./bg.png);
+    background-size: cover;
+    color: #FFFFFF;
+    font-size: 16px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+
+    .tit {
+      padding: 16px 16px 16px 24px;
+    }
+    .content {
+      flex: 1;
+      padding: 2px;
+      box-sizing: border-box;
+      overflow: hidden;
+    }
+
+}
+
+
+
+</style>

src/views/bigScreen/components/rocketTit/index.vue

@@ -0,0 +1,52 @@
+
+
+<template>
+  <div class="rocketTit">
+      <img class="rocket" src="./rocket.png" alt="">
+      <span><slot /></span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'RocketTit',
+  props: {
+    title: {
+      type: String,
+      default: '',
+    },
+    selected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data () {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+
+.rocket {
+    width: 17.5px;
+    height: 17.5px;
+    margin-right: 10px;
+    vertical-align: middle;
+}
+.rocketTit {
+    font-size: 16px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #FFFFFF;
+    line-height: 22px;
+    vertical-align: middle;
+    span {
+        vertical-align: middle;
+    }
+}
+
+
+</style>

src/views/bigScreen/components/scaleBox.vue

@@ -74,6 +74,6 @@ export default {
   top: 50%;
   transition: 0.3s;
   z-index: 999;
-  background: rgba(255, 0, 0, 0.3);
+  // background: rgba(255, 0, 0, 0.3);
 }
 </style>

src/views/bigScreen/drivingCabin/bottom1.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>
+    <container4 title="总体经营情况">
+      <img src="./bottom1.png" style="width: 90%;display: block;margin: 0 auto">
+    </container4>
+  </div>
+
+</template>
+
+<script>
+import container4 from "../components/container4/index.vue";
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'bottom1',
+  components: {
+    container4,
+  },
+  data () {
+    return {}
+  },
+  mounted () {
+
+  },
+  beforeDestroy () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/bigScreen/drivingCabin/bottom2.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>
+    <container4 title="总体生产情况">
+      <img src="./bottom2.png" style="width: 90%;display: block;margin: 0 auto">
+    </container4>
+  </div>
+
+</template>
+
+<script>
+import container4 from "../components/container4/index.vue";
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'bottom1',
+  components: {
+    container4,
+  },
+  data () {
+    return {}
+  },
+  mounted () {
+
+  },
+  beforeDestroy () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/bigScreen/drivingCabin/center.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>
+    <container3>
+      <img src="./snap.png" style="width: 100%;height:100%">
+    </container3>
+  </div>
+
+</template>
+
+<script>
+import container3 from "../components/container3/index.vue";
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'left1',
+  components: {
+    container3,
+  },
+  data () {
+    return {}
+  },
+  mounted () {
+
+  },
+  beforeDestroy () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/bigScreen/drivingCabin/index.vue

@@ -1,19 +1,121 @@
 <template>
-    <scalseBox>
-        <div>111</div>
+  <scalseBox>
+    <div class="drivingCabin">
+      <div class="bg1"></div>
+      <bigScreenHead></bigScreenHead>
 
-    </scalseBox>
+      <div class="left1">
+        <left1></left1>
+      </div>
+      <div class="left2">
+        <left2></left2>
+      </div>
+      <div class="center1">
+        <center1></center1>
+      </div>
+      <div class="right1">
+        <right1></right1>
+      </div>
+      <div class="right2">
+        <right2></right2>
+      </div>
+      <div class="bottom1">
+        <bottom1></bottom1>
+      </div>
+      <div class="bottom2">
+        <bottom2></bottom2>
+      </div>
+
+    </div>
+  </scalseBox>
 
 </template>
 
 <script>
 import scalseBox from '../components/scaleBox.vue'
-import Screen from "../components/Screen";
+import bigScreenHead from "../components/bigScreenHead/index.vue";
+import rocketTit from "../components/rocketTit/index.vue";
+import container1 from "../components/container1/index.vue";
+
+
+import left1 from "./left1.vue";
+import left2 from "./left2.vue";
+import center1 from "./center.vue";
+import right1 from "./right1.vue";
+import right2 from "./right2.vue";
+import bottom1 from "./bottom1.vue";
+import bottom2 from "./bottom2.vue";
 export default {
   name: 'DrivingCabin',
   components: {
     scalseBox,
-    Screen
+    bigScreenHead,
+    rocketTit,
+    container1,
+    left1,
+    left2,
+    center1,
+    right1,
+    right2,
+    bottom1,
+    bottom2,
   }
 }
-</script>
+</script>
+
+<style lang="scss" scoped>
+.drivingCabin {
+  position: relative;
+  width: 1920px;
+  height: 1080px;
+  background-color: #0D1049;
+  // background-image: url("../img/bg.png");
+  background-size: cover;
+  .bg1 {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 1920px;
+    height: 485px;
+    background-image: url("../img/bg-1.png");
+    background-size: cover;
+  }
+}
+
+.left1 {
+  position: absolute;
+  top: 120px;
+  left: 24px;
+}
+.left2 {
+  position: absolute;
+  top: 345px;
+  left: 24px;
+}
+.center1 {
+  position: absolute;
+  top: 107px;
+  left: 578px;
+}
+
+.right1 {
+  position: absolute;
+  top: 120px;
+  right: 24px;
+}
+.right2 {
+  position: absolute;
+  top: 345px;
+  right: 24px;
+}
+.bottom1 {
+  position: absolute;
+  bottom: 16px;
+  left: 24px;
+}
+.bottom2 {
+  position: absolute;
+  bottom: 16px;
+  right: 24px;
+}
+</style>

src/views/bigScreen/drivingCabin/left1.vue

@@ -0,0 +1,238 @@
+<template>
+  <div>
+    <rocketTit style="margin-bottom: 9px">经营动态</rocketTit>
+    <container1>
+      <el-row style="height: 100%">
+        <el-col :span="12" style="height: 100%">
+          <el-row style="height: 100%">
+            <el-col :span="12" style="text-align:center,;padding: 26px 0 0 40px;">
+              <div>
+                今日收入
+              </div>
+              <div style="margin: 10px 0">
+                <span class="num">2890</span>万
+              </div>
+              <div>
+                同比增长
+              </div>
+            </el-col>
+            <el-col :span="12" style="height: 100%">
+              <div ref="chart1" style="width: 100%;height:100%;"></div>
+            </el-col>
+          </el-row>
+        </el-col>
+        <el-col :span="12" style="height: 100%">
+            <el-row style="height: 100%">
+              <el-col :span="12" style="text-align:center,;padding: 26px 0 0 40px;">
+                <div>
+                  今日合同
+                </div>
+                <div style="margin: 10px 0">
+                  <span class="num2">54</span>份
+                </div>
+                <div>
+                  同比增长
+                </div>
+              </el-col>
+              <el-col :span="12" style="height: 100%">
+                <div ref="chart2" style="width: 100%;height:100%;"></div>
+              </el-col>
+            </el-row>
+        </el-col>
+      </el-row>
+    </container1>
+  </div>
+
+</template>
+
+<script>
+import scalseBox from '../components/scaleBox.vue'
+import bigScreenHead from "../components/bigScreenHead/index.vue";
+import rocketTit from "../components/rocketTit/index.vue";
+import container1 from "../components/container1/index.vue";
+
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'left1',
+  components: {
+    scalseBox,
+    bigScreenHead,
+    rocketTit,
+    container1,
+  },
+  data () {
+    return {
+      chart1: null,
+      chart2: null,
+      option1: {
+        grid: {
+          top: "20%",
+          left: "10%",
+          right: "10%",
+          bottom: "20%"
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+          show: false,//不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
+          //   axisTick: {
+          //     show: false//不显示坐标轴刻度线
+          //   },
+          //   axisLine: {
+          //     show: false,//不显示坐标轴线
+          //   },
+          //   axisLabel: {
+          //     show: false,//不显示坐标轴上的文字
+          //   },
+          //   splitLine: {
+          //     show: false//不显示网格线
+          //   },
+        },
+        yAxis: {
+          type: 'value',
+          scale: true,
+          show: false,
+          //   splitLine: {
+          //     show: false//不显示网格线
+          //   },
+        },
+        series: [
+          {
+            data: [30, 60, 80, 70, 80, 90, 110],
+            type: 'line',
+            symbol: 'none',
+            smooth: false,
+            lineStyle: {
+              color: '#f6d97e'
+            },
+            areaStyle: {//区域填充渐变颜色
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0, color: '#f6d97e' // 0% 处的颜色
+                }, {
+                  offset: .95, color: 'rgba(234,174,10, 0)' // 100% 处的颜色
+                }],
+                global: false // 缺省为 false
+              }
+            }
+
+
+          }
+        ]
+      },
+      option2: {
+        grid: {
+          top: "20%",
+          left: "10%",
+          right: "10%",
+          bottom: "20%"
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+          show: false,//不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
+          //   axisTick: {
+          //     show: false//不显示坐标轴刻度线
+          //   },
+          //   axisLine: {
+          //     show: false,//不显示坐标轴线
+          //   },
+          //   axisLabel: {
+          //     show: false,//不显示坐标轴上的文字
+          //   },
+          //   splitLine: {
+          //     show: false//不显示网格线
+          //   },
+        },
+        yAxis: {
+          type: 'value',
+          scale: true,
+          show: false,
+          //   splitLine: {
+          //     show: false//不显示网格线
+          //   },
+        },
+        series: [
+          {
+            data: [30, 60, 80, 70, 80, 90, 110],
+            type: 'line',
+            symbol: 'none',
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(16, 152, 255, 1)'
+            },
+            areaStyle: {//区域填充渐变颜色
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0, color: 'rgba(16, 152, 255, 1)' // 0% 处的颜色
+                }, {
+                  offset: .95, color: 'rgba(16, 152, 255, 0)' // 100% 处的颜色
+                }],
+                global: false // 缺省为 false
+              }
+            }
+
+
+          }
+        ]
+      },
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
+  beforeDestroy () {
+    if (!this.chart1 || !this.chart2) {
+      return
+    }
+    this.chart1.dispose()
+    this.chart2.dispose()
+    this.chart1 = null
+    this.chart2 = null
+  },
+  methods: {
+    initChart () {
+      this.chart1 = echarts.init(this.$refs.chart1, 'macarons');
+      this.chart2 = echarts.init(this.$refs.chart2, 'macarons');
+      this.chart1.setOption(this.option1);
+      this.chart2.setOption(this.option2);
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.num {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: #f6d97e;
+  line-height: 35px;
+  //   margin-right: 3px;
+}
+.num2 {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: rgba(16, 152, 255, 1);
+  line-height: 35px;
+}
+</style>

src/views/bigScreen/drivingCabin/left2.vue

@@ -0,0 +1,137 @@
+<template>
+  <div>
+    <container2 title="生产总体走势">
+      <div style="height:100%;width:100%;" ref="chart"></div>
+    </container2>
+  </div>
+
+</template>
+
+<script>
+import scalseBox from '../components/scaleBox.vue'
+import bigScreenHead from "../components/bigScreenHead/index.vue";
+import rocketTit from "../components/rocketTit/index.vue";
+import container2 from "../components/container2/index.vue";
+
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'left2',
+  components: {
+    scalseBox,
+    bigScreenHead,
+    rocketTit,
+    container2,
+  },
+  data () {
+    return {
+      chart: null,
+      option: {
+        backgroundColor: '',
+        tooltip: {
+          trigger: 'axis'
+        },
+        legend: {
+          right: '10',
+          data: ['品类1', '品类2', '品类3'],
+          textStyle: {
+            color: '#fff'
+          },
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+          splitLine: {
+            show: false//不显示网格线
+          },
+        },
+        yAxis: {
+          type: 'value',
+          splitLine: {
+            show: false//不显示网格线
+          },
+          splitArea: {
+            show: false//不显示网格区域
+          }
+        },
+        series: [
+          {
+            name: '品类1',
+            type: 'line',
+            data: [120, 132, 101, 134, 90, 230, 210],
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(203, 97, 79, 1)'
+            },
+          },
+          {
+            name: '品类2',
+            type: 'line',
+            data: [220, 182, 191, 234, 290, 330, 310],
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(215, 170, 34, 1)'
+            },
+          },
+          {
+            name: '品类3',
+            type: 'line',
+            data: [150, 232, 201, 154, 190, 330, 410],
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(121, 139, 219, 1)'
+            },
+          },
+
+        ]
+      },
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
+  beforeDestroy () {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    initChart () {
+      this.chart = echarts.init(this.$refs.chart, 'macarons');
+      this.chart.setOption(this.option);
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.num {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: #f6d97e;
+  line-height: 35px;
+  //   margin-right: 3px;
+}
+.num2 {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: rgba(16, 152, 255, 1);
+  line-height: 35px;
+}
+</style>

src/views/bigScreen/drivingCabin/right1.vue

@@ -0,0 +1,84 @@
+<template>
+  <div>
+    <rocketTit style="margin-bottom: 9px">生产动态</rocketTit>
+    <container1>
+      <el-row style="height: 100%">
+        <el-col :span="12" style="height: 100%">
+          <div class="right1_bg right1_bg1">
+            <div style="padding: 10px 0 20px 0;">
+              <span class="num">2890</span>件
+            </div>
+            <div style="font-size: 18px;">今日装药任务</div>
+          </div>
+        </el-col>
+        <el-col :span="12" style="height: 100%">
+          <div class="right1_bg right1_bg2">
+            <div style="padding: 10px 0 20px 0;">
+              <span class="num">824</span>人
+            </div>
+            <div style="font-size: 18px;">今日职工数</div>
+          </div>
+        </el-col>
+      </el-row>
+    </container1>
+  </div>
+
+</template>
+
+<script>
+import rocketTit from "../components/rocketTit/index.vue";
+import container1 from "../components/container1/index.vue";
+import resize from '../../dashboard/mixins/resize'
+
+export default {
+  mixins: [resize],
+  name: 'right1',
+  components: {
+    rocketTit,
+    container1,
+  },
+  data () {
+    return {}
+  },
+  mounted () {
+
+  },
+  beforeDestroy () {
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.right1_bg {
+  width: 211px;
+  height: 132px;
+  background-size: cover;
+  text-align: center;
+  padding: 10px  0 10px 0;
+  margin: 20px auto 0 auto;
+  
+font-size: 14px;
+  .num {
+    font-size: 30px;
+    font-family: Roboto-Black, Roboto;
+    font-weight: 900;
+    line-height: 35px;
+    margin-right: 3px;
+    vertical-align: middle;
+  }
+}
+.right1_bg1 {
+  background-image: url(./right1-1.png);
+  .num {
+    color: #f6d97e;
+  }
+}
+.right1_bg2 {
+  background-image: url(./right1-2.png);
+  .num {
+    color: #1098ff;
+  }
+}
+</style>

src/views/bigScreen/drivingCabin/right2.vue

@@ -0,0 +1,163 @@
+<template>
+  <div>
+    <container2 title="经营总体走势">
+      <div style="height:100%;width:100%;" ref="chart"></div>
+    </container2>
+  </div>
+
+</template>
+
+<script>
+import scalseBox from '../components/scaleBox.vue'
+import bigScreenHead from "../components/bigScreenHead/index.vue";
+import rocketTit from "../components/rocketTit/index.vue";
+import container2 from "../components/container2/index.vue";
+
+
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import resize from '../../dashboard/mixins/resize'
+export default {
+  mixins: [resize],
+  name: 'right2',
+  components: {
+    scalseBox,
+    bigScreenHead,
+    rocketTit,
+    container2,
+  },
+  data () {
+    return {
+      chart: null,
+      option: {
+        backgroundColor: '',
+        tooltip: {
+          trigger: 'axis'
+        },
+        legend: {
+          right: '10',
+          data: ['XX零件收入占比', 'XY零件收入占比'],
+          textStyle: {
+            color: '#fff'
+          },
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: ['2021-04', '2021-05', '2021-06', '2021-07', '2021-08', '2021-09', '2021-10'],
+          splitLine: {
+            show: false//不显示网格线
+          },
+        },
+        yAxis: {
+          type: 'value',
+          splitLine: {
+            show: false//不显示网格线
+          },
+          splitArea: {
+            show: false//不显示网格区域
+          },
+          axisLabel: {
+            formatter: "{value}%"
+          },
+          min: 0,
+          max: 100
+        },
+        series: [
+          {
+            name: 'XX零件收入占比',
+            type: 'line',
+            data: [55, 30, 45, 35, 55, 60, 60],
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(78, 187, 147, 1)'
+            },
+            areaStyle: {//区域填充渐变颜色
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0, color: 'rgba(78, 187, 147, 0.5)' // 0% 处的颜色
+                }, {
+                  offset: .75, color: 'rgba(78, 187, 147, 0)' // 100% 处的颜色
+                }],
+                global: false // 缺省为 false
+              }
+            }
+          },
+          {
+            name: 'XY零件收入占比',
+            type: 'line',
+            data: [45, 70, 50, 65, 45, 35, 40],
+            smooth: false,
+            lineStyle: {
+              color: 'rgba(16,148,249, 1)'
+            },
+            areaStyle: {//区域填充渐变颜色
+              color: {
+                type: 'linear',
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0, color: 'rgba(16,148,249, 0.5)' // 0% 处的颜色
+                }, {
+                  offset: .75, color: 'rgba(16,148,249, 0)' // 100% 处的颜色
+                }],
+                global: false // 缺省为 false
+              }
+            }
+          },
+
+        ]
+      },
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
+  beforeDestroy () {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    initChart () {
+      this.chart = echarts.init(this.$refs.chart, 'macarons');
+      this.chart.setOption(this.option);
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.num {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: #f6d97e;
+  line-height: 35px;
+  //   margin-right: 3px;
+}
+.num2 {
+  font-size: 30px;
+  font-family: Roboto-Black, Roboto;
+  font-weight: 900;
+  color: rgba(16, 152, 255, 1);
+  line-height: 35px;
+}
+</style>

src/views/dashboard/PanelGroup.vue

@@ -1,6 +1,91 @@
 <template>
+ <!-- @click="$router.push('/bigScreen/drivingCabin')" -->
   <el-row :gutter="40" class="panel-group">
-    <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel" @click="$router.push('/bigScreen/drivingCabin')">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            驾驶舱总览
+          </div>
+          <div class="card-panel-num">点击进入</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            科研生产
+          </div>
+          <div class="card-panel-num">开发中</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            经营管理
+          </div>
+          <div class="card-panel-num">开发中</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            质量管理
+          </div>
+          <div class="card-panel-num">开发中</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            安全管理
+          </div>
+          <div class="card-panel-num">开发中</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <el-col :xs="8" :sm="8" :lg="8" class="card-panel-col">
+      <div class="card-panel">
+        <div class="card-panel-icon-wrapper icon-people">
+          <svg-icon icon-class="peoples" class-name="card-panel-icon" />
+        </div>
+        <div class="card-panel-description">
+          <div class="card-panel-text">
+            信息化管理
+          </div>
+          <div class="card-panel-num">开发中</div>
+          <!-- <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" /> -->
+        </div>
+      </div>
+    </el-col>
+    <!-- <el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
       <div class="card-panel" @click="handleSetLineChartData('newVisitis')">
         <div class="card-panel-icon-wrapper icon-people">
           <svg-icon icon-class="peoples" class-name="card-panel-icon" />
@@ -51,7 +136,7 @@
           <count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" />
         </div>
       </div>
-    </el-col>
+    </el-col> -->
   </el-row>
 </template>
 

src/views/index.vue

@@ -3,7 +3,7 @@
 
     <panel-group @handleSetLineChartData="handleSetLineChartData" />
 
-    <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
+    <!-- <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
       <line-chart :chart-data="lineChartData" />
     </el-row>
 
@@ -23,14 +23,14 @@
           <bar-chart />
         </div>
       </el-col>
-    </el-row>
+    </el-row> -->
 
     
   </div>
 </template>
 
 <script>
-import PanelGroup from './dashboard/PanelGroup'
+import PanelGroup from './dashboard/PanelGroup.vue'
 import LineChart from './dashboard/LineChart'
 import RaddarChart from './dashboard/RaddarChart'
 import PieChart from './dashboard/PieChart'

src/views/login.vue

@@ -34,6 +34,7 @@
 
       </el-form-item>
     </el-form>
+    <div class="copyright">思米西科技有限公司  地址：自由贸易试验区成都高新区吉泰二路266号18栋2单元11楼1107号 联系电话：010-888888 邮箱：****@qq.com</div>
   </div>
 </template>
 
@@ -136,6 +137,7 @@ export default {
 
 <style rel="stylesheet/scss" lang="scss">
 .login {
+  position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -143,6 +145,17 @@ export default {
   background-image: url("../assets/images/login-background_2.png");
   background-size: cover;
   flex-direction: column;
+  .copyright {
+    position: absolute;
+    width: 100%;
+    bottom: 20px;
+    text-align: center;
+    font-size: 14px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #FFFFFF;
+    line-height: 24px;
+  }
 }
 
 .loginTit {
@@ -151,6 +164,7 @@ export default {
   color: #ffffff;
   line-height: 62px;
   letter-spacing: 1px;
+  margin-bottom: 40px;
 }
 .title {
   padding: 25px 0;

src/views/register.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="register">
     <el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form">
-      <h3 class="title">商挈后台管理系统</h3>
+      <h3 class="title">科研生产展示平台</h3>
       <el-form-item prop="username">
         <el-input v-model="registerForm.username" type="text" auto-complete="off" placeholder="账号">
           <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />

vue.config.js

@@ -5,7 +5,7 @@ function resolve(dir) {
   return path.join(__dirname, dir)
 }
 
-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 // 端口