From 3719b73ec409815d84aaf53f1c35b8149508d46f Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Fri, 7 Mar 2025 17:14:41 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A9=BE=E9=A9=B6=E8=88=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                           |  18 +-
 src/components/Progress/jscindex.vue   | 179 ++++++++++++
 src/layout/components/Navbar/index.vue |   2 +-
 src/main.js                            |   2 +
 src/router/index.js                    |  12 +
 src/views/dashboard/index.vue          |   2 +
 src/views/jsc/components/all.vue       | 362 +++++++++++++++++++++++++
 src/views/jsc/components/car.vue       | 140 ++++++++++
 src/views/jsc/components/evection.vue  | 150 ++++++++++
 src/views/jsc/components/level.vue     | 146 ++++++++++
 src/views/jsc/components/overtime.vue  | 147 ++++++++++
 src/views/jsc/components/total.vue     | 153 +++++++++++
 src/views/jsc/jsc.vue                  | 124 +++++++++
 src/views/jsc/static/icon1.png         | Bin 0 -> 3187 bytes
 src/views/jsc/static/icon2.png         | Bin 0 -> 3117 bytes
 src/views/jsc/static/icon3.png         | Bin 0 -> 2973 bytes
 src/views/jsc/static/icon4.png         | Bin 0 -> 3607 bytes
 src/views/jsc/static/icon5.png         | Bin 0 -> 643 bytes
 src/views/jsc/static/icon6.png         | Bin 0 -> 626 bytes
 src/views/jsc/static/icon7.png         | Bin 0 -> 469 bytes
 src/views/jsc/static/icon8.png         | Bin 0 -> 753 bytes
 src/views/jsc/static/icon9.png         | Bin 0 -> 755 bytes
 22 files changed, 1427 insertions(+), 10 deletions(-)
 create mode 100644 src/components/Progress/jscindex.vue
 create mode 100644 src/views/jsc/components/all.vue
 create mode 100644 src/views/jsc/components/car.vue
 create mode 100644 src/views/jsc/components/evection.vue
 create mode 100644 src/views/jsc/components/level.vue
 create mode 100644 src/views/jsc/components/overtime.vue
 create mode 100644 src/views/jsc/components/total.vue
 create mode 100644 src/views/jsc/jsc.vue
 create mode 100644 src/views/jsc/static/icon1.png
 create mode 100644 src/views/jsc/static/icon2.png
 create mode 100644 src/views/jsc/static/icon3.png
 create mode 100644 src/views/jsc/static/icon4.png
 create mode 100644 src/views/jsc/static/icon5.png
 create mode 100644 src/views/jsc/static/icon6.png
 create mode 100644 src/views/jsc/static/icon7.png
 create mode 100644 src/views/jsc/static/icon8.png
 create mode 100644 src/views/jsc/static/icon9.png

diff --git a/package.json b/package.json
index 25528ee..c7cc7fa 100644
--- a/package.json
+++ b/package.json
@@ -15,30 +15,30 @@
   },
   "dependencies": {
     "@riophae/vue-treeselect": "^0.4.0",
+    "@vue-office/docx": "^1.6.2",
+    "@vue-office/excel": "^1.7.11",
+    "@vue-office/pdf": "^2.0.2",
+    "@vue/composition-api": "^1.7.2",
     "axios": "0.18.1",
-    "echarts": "^5.0.0",
     "bpmn-js": "^7.3.1",
     "bpmn-js-properties-panel": "^0.37.2",
     "camunda-bpmn-moddle": "^4.4.0",
     "core-js": "3.6.5",
-    "element-ui": "2.15.14",
+    "echarts": "^5.0.0",
     "element-resize-detector": "^1.2.4",
+    "element-ui": "2.15.14",
     "gojs": "^2.3.11",
     "js-cookie": "2.2.0",
+    "moment": "^2.29.4",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",
     "vue": "2.6.10",
+    "vue-grid-layout": "^2.4.0",
     "vue-router": "3.0.6",
     "vuex": "3.1.0",
     "vxe-table": "^3.8.22",
-    "wujie-vue2": "^1.0.22",
-    "moment": "^2.29.4",
-    "vue-grid-layout": "^2.4.0",
-    "@vue-office/docx": "^1.6.2",
-    "@vue-office/excel": "^1.7.11",
-    "@vue-office/pdf": "^2.0.2",
-    "@vue/composition-api": "^1.7.2"
+    "wujie-vue2": "^1.0.22"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "4.4.4",
diff --git a/src/components/Progress/jscindex.vue b/src/components/Progress/jscindex.vue
new file mode 100644
index 0000000..be049d2
--- /dev/null
+++ b/src/components/Progress/jscindex.vue
@@ -0,0 +1,179 @@
+<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 '@/mixins/resize'
+export default {
+  mixins: [resize],
+  props: {
+    className: {
+      type: String,
+      default: ''
+    },
+    height: {
+      type: String,
+      default: '100px'
+    },
+    width: {
+      type: String,
+      default: '100px'
+    },
+    percent: {
+      type: [Number, String],
+      default: 100
+    },
+    chartData: {
+      type: Array,
+      default: () => []
+    },
+    title: {
+      type: String,
+      default: '标题'
+    }
+  },
+  data() {
+    return {
+      flag: true,
+      chart: null
+    }
+  },
+  computed: {
+    options() {
+      return {
+        legend: {
+          show: false,
+          bottom: 0,
+          left: 'center',
+          orient: 'horizontal',
+          itemWidth: 8,
+          itemHeight: 5
+        },
+        color: ['#feae42', '#e386ef', '#4771f8','#e64a43'],
+        series: [
+          {
+            name:this.title,
+            type: 'pie',
+            radius: ['50%', '70%'],
+            // center: ['50%', '36%'],
+            padAngle: 4,
+            itemStyle: {
+              borderRadius: 10,
+              padding: 10
+            },
+            label: {
+              show: true,
+              position: 'center',
+              formatter: `${this.title}`
+            },
+            avoidLabelOverlap: true, // 是否启用防止标签重叠策略
+            emphasis: { // 高亮，即鼠标经过时的样式
+              scale: true // 表示不放大item
+            },
+            labelLine: {
+              show: false
+            },
+            data: (() => {
+              // if (this.percent || this.percent === 0) {
+              //   return [
+              //     { value: parseFloat(this.percent), name: `${this.title}` },
+              //   ]
+              // } else {
+                return this.chartData
+              // }
+            })()
+          }
+        ],
+        graphic: {
+          elements: []
+        }
+      }
+    }
+  },
+  watch: {
+    chartData() {
+      this.setOptions()
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.initChart()
+    })
+  },
+  methods: {
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons')
+      this.setOptions()
+    },
+    setOptions() {
+      this.chart?.setOption(this.options)
+      // this.setGraphics()
+    },
+    setGraphics() {
+      const getPointOnCircle = (angle, radiusPercent) => {
+        const radian = (angle - 90 - 12) * Math.PI / 180
+        const radius = this.chart.getWidth() / 2 * radiusPercent / 100
+        const x = this.chart.getWidth() / 2 + Math.cos(radian) * radius
+        const y = this.chart.getHeight() / 2 + Math.sin(radian) * radius - this.chart.getHeight() * 0.1
+        return { x: x, y: y }
+      }
+      const graphicElements = []
+      let total = 0
+      if (!this.options?.series[0]?.data) return
+      this.options?.series[0]?.data.forEach(function(item) {
+        total += item.value
+      })
+
+      let startAngle = 0
+      this.options?.series[0]?.data.forEach(function(item) {
+        const angle = (item.value / total) * 360
+        const endAngle = startAngle + angle
+        const middleAngle = (startAngle + endAngle) / 2
+
+        // 计算开始和结束点的位置
+        const pointStart = getPointOnCircle(middleAngle - angle / 2, 60)
+        const pointEnd = getPointOnCircle(middleAngle + angle / 2, 60)
+
+        // 添加小圆的装饰
+        graphicElements.push({
+          type: 'circle',
+          shape: {
+            cx: pointStart.x,
+            cy: pointStart.y,
+            r: 3
+          },
+          style: {
+            fill: '#fff'
+          },
+          z: 100
+        })
+        graphicElements.push({
+          type: 'circle',
+          shape: {
+            cx: pointEnd.x,
+            cy: pointEnd.y,
+            r: 3
+          },
+          style: {
+            fill: '#fff'
+          },
+          z: 100
+        })
+
+        startAngle += angle
+      })
+
+      this.chart.setOption({
+        graphic: {
+          elements: graphicElements
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+</style>
diff --git a/src/layout/components/Navbar/index.vue b/src/layout/components/Navbar/index.vue
index 5da3745..9de932c 100644
--- a/src/layout/components/Navbar/index.vue
+++ b/src/layout/components/Navbar/index.vue
@@ -52,7 +52,7 @@
                 </svg>
               </div>
             </template>
-            <theme-picker class="tool-item" />
+            <!-- <theme-picker class="tool-item" /> -->
             <!--            <el-badge :is-dot="device === 'mobile'" :max="99" :value="12" class="tool-item">-->
             <!--              <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3h-16a4 4 0 0 0 2 -3v-3a7 7 0 0 1 4 -6" /><path d="M9 17v1a3 3 0 0 0 6 0v-1" /></svg>-->
             <!--            </el-badge>-->
diff --git a/src/main.js b/src/main.js
index 00dddd3..9924559 100644
--- a/src/main.js
+++ b/src/main.js
@@ -39,6 +39,7 @@ Vue.use(ElementUI)
 
 // vxetable
 import { VxeIcon, VxeTable, VxeColumn, VxeColgroup, VxeTableEditModule, VxeTableValidatorModule, VxeModal, VxeToolbar } from 'vxe-table'
+// import vxeTable from 'vxe-table'
 import 'vxe-table/styles/index.scss'
 Vue.use(VxeTableEditModule)
 Vue.use(VxeTableValidatorModule)
@@ -48,6 +49,7 @@ Vue.use(VxeColumn)
 Vue.use(VxeColgroup)
 Vue.use(VxeModal)
 Vue.use(VxeToolbar)
+// Vue.use(vxeTable)
 import domZIndex from 'dom-zindex'
 domZIndex.setCurrent(2000)
 
diff --git a/src/router/index.js b/src/router/index.js
index 6160efd..b809c79 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -89,6 +89,18 @@ export const constantRoutes = [
       meta: { title: '首页', icon: 'dashboard' }
     }]
   },
+  {
+    path: '/jsc',
+    component: Layout,
+    redirect: '/jsc',
+    meta: { title: '驾驶舱', icon: 'dashboard' },
+    children: [{
+      path: 'jsc',
+      name: 'jsc',
+      component: () => import('@/views/jsc/jsc'),
+      meta: { title: '驾驶舱', icon: 'dashboard' }
+    }]
+  },
   {
     path: '/info',
     component: Layout,
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index f8d3e63..7fe355b 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -67,12 +67,14 @@ export default {
   computed: {},
   created() {
     this.$store.dispatch('app/getLayout').then(res => {
+
       this.layoutList = res?.filter(item => layout.find(lay => lay.i === item.i)).map(item => {
         layout.forEach(lay => {
           lay.i === item.i ? item.component = lay.component : ''
         })
         return item
       }) ?? []
+      console.log("this.layoutList",this.layoutList,'res',res)
     })
   },
   methods: {
diff --git a/src/views/jsc/components/all.vue b/src/views/jsc/components/all.vue
new file mode 100644
index 0000000..e53429f
--- /dev/null
+++ b/src/views/jsc/components/all.vue
@@ -0,0 +1,362 @@
+<template>
+  <el-card class-name="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <img style="width: 31px;height:32px" src="../static/icon7.png" alt="">
+      <span style="padding-left: 15px">总览</span>
+      <div style="margin-left: auto; font-size: 20px">
+        <el-select style="width:250px" v-model="department_id" @change="changeDepartment" placeholder="请选择">
+          <el-option v-for="item in departments" :key="item.id" :label="item.name" :value="item.id">
+          </el-option>
+        </el-select>
+      </div>
+    </div>
+
+    <div v-loading="loading" class="progress-card" element-loading-text="拼命加载中"
+      element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.8)">
+      <div class="progress-card-left progress-card-item">
+        <el-table style="width: 100%;" size="mini" :header-cell-style="{
+            'font-weight': '600',
+            'background': '#fff',
+            'color': '#515a6e',
+            'text-align':'left'
+          }" :height="tableHeight" :data="list">
+          <el-table-column v-for="(item, index) in table" :key="index" :width="item.width" :label="item.title"
+            :prop="item.key" :show-overflow-tooltip="item['show-overflow-tooltip']" header-align="center"
+            :align="item.align" :formatter="item.formatter" />
+        </el-table>
+      </div>
+      <div class="progress-card-right progress-card-item">
+        <div class="progress-card-right-chart">
+          <MyProgress width="250px" height="250px" :title="myTitle" :chart-data="[{value:progress.chuchai,name:'出差'},{value:progress.jiaban,name:'加班'}
+            ,{value:progress.qingjia,name:'请假'},{value:progress.yongche,name:'用车'}]" />
+        </div>
+
+        <div class="progress-card-right-card">
+          <div class="progress-card-right-change">
+            <i class="el-icon-arrow-left" @click="changeDatePara(-1)"></i>
+            <div>
+              <i class="el-icon-date"></i>
+              <span v-if="changeDate==item" v-for="item in changeList">{{item}}</span>
+            </div>
+            <i class="el-icon-arrow-right" @click="changeDatePara(1)"></i>
+          </div>
+          <div class="progress-card-right-count">
+            <div>
+              <span class="chuchai"></span>出差<span>{{progress.chuchai}}</span>
+            </div>
+            <div>
+              <span class="jiaban"></span>加班<span>{{progress.jiaban}}</span>
+            </div>
+            <div>
+              <span class="qingjia"></span>请假<span>{{progress.qingjia}}</span>
+            </div>
+            <div>
+              <span class="yongche"></span>用车<span>{{progress.yongche}}</span>
+            </div>
+            <div>
+              <span></span>单位：人次<span></span>
+            </div>
+          </div>
+          <!-- <div v-for="item."></div> -->
+        </div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+  import ElementResize from 'element-resize-detector'
+  import {
+    parseMoney
+  } from '@/utils'
+  import SvgIcon from '@/components/SvgIcon/index.vue'
+  import MyProgress from '@/components/Progress/jscindex.vue'
+  import axios from 'axios'
+  import {
+    getToken
+  } from '@/utils/auth'
+
+  export default {
+    name: 'All',
+    components: {
+      SvgIcon,
+      MyProgress
+    },
+    layout: {
+      x: 5,
+      y: 0,
+      w: 7,
+      h: 8,
+      i: 'All',
+      name: '总览'
+    },
+    data() {
+      return {
+        loading: false,
+        departments: [],
+        myTitle: '今日总览',
+        progress: {
+          chuchai: 0,
+          yongche: 0,
+          jiaban: 0,
+          qingjia: 0
+        },
+        changeList: ['今日', '明日', '本周', '本月', '本年'],
+        changeDate: '今日',
+        changeIndex:0,
+        tableHeight: 200,
+        department_id: 0,
+        list: [],
+        table: [{
+            title: '日期',
+            key: 'name',
+            align: 'center',
+          },
+          {
+            title: '出差',
+            key: 'chuchai',
+            align: 'center',
+            'show-overflow-tooltip': true,
+          },
+          {
+            title: '用车',
+            key: 'yongche',
+            align: 'center',
+            'show-overflow-tooltip': true,
+          },
+          {
+            title: '加班',
+            key: 'jiaban',
+            align: 'center',
+            'show-overflow-tooltip': true,
+          },
+          {
+            title: '请假',
+            key: 'qingjia',
+            align: 'center',
+            'show-overflow-tooltip': true,
+          }
+        ]
+      }
+    },
+    created() {},
+    mounted() {
+      this.init()
+      this.getData()
+    },
+    methods: {
+      parseMoney,
+      init() {
+        const cardDom = this.$el
+        const cardTitleH = 69
+        const elementResize = ElementResize({
+          strategy: 'scroll'
+        })
+        elementResize.listenTo(cardDom, ele => {
+          this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH
+        })
+      },
+      changeDatePara(para){
+        this.changeIndex = parseInt(this.changeIndex+para)
+        this.changeDate = this.changeList[this.changeIndex]
+        if(this.changeIndex<0){
+          this.changeIndex = this.changeList.length-1
+          this.changeDate = this.changeList[this.changeIndex]
+        }
+        if(this.changeIndex>this.changeList.length-1){
+          this.changeIndex = 0
+          this.changeDate = this.changeList[0]
+        }
+        console.log("this.changeIndex",this.changeIndex,this.changeDate)
+        this.list.map(item => {
+          if (item.name == this.changeDate) {
+            this.progress = item
+          }
+        })
+      },
+      changeDepartment(e) {
+        this.department_id = e
+        this.departments.map(item => {
+          if (item.id == e) {
+            this.myTitle = item.name
+          }
+        })
+        this.getChartOverall()
+      },
+      // 总览数据
+      async getChartOverall() {
+        try {
+          this.loading = true
+          const res = await axios.get(`${process.env.VUE_APP_BASE_API}/api/oa/chart/overall`, {
+            headers: {
+              'Authorization': `Bearer ${getToken()}`
+            },
+            params: {
+              department_id: this.department_id
+            }
+          })
+          if (res.status === 200) {
+            this.list = res.data?.data
+            this.list.map(item => {
+              if (item.name == '今日') {
+                this.progress = item
+              }
+            })
+          }
+          this.loading = false
+        } catch (err) {
+          this.loading = false
+        }
+      },
+
+      // 获取部门
+      async getDepartment() {
+        try {
+          const res = await axios.get(`${process.env.VUE_APP_BASE_API}/api/backend/simple-department`, {
+            headers: {
+              'Authorization': `Bearer ${getToken()}`
+            },
+            params: {}
+          })
+          if (res.status === 200) {
+            let arr = res.data?.data
+            this.departments = arr.filter(item => item.name != '中心领导').filter(item => item.name != '公共')
+          }
+        } catch (err) {
+          this.loading = false
+        }
+      },
+      async getData() {
+        try {
+          this.loading = true
+          await this.getDepartment()
+          this.department_id = this.departments.length > 0 ? this.departments[0].id : ''
+          this.myTitle = this.departments.length > 0 ? this.departments[0].name : ''
+          if (this.department_id) {
+            await this.getChartOverall()
+          }
+
+          this.loading = false
+        } catch (err) {
+          this.loading = false
+          console.error(err)
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .clearfix {
+    display: flex;
+    align-items: center;
+  }
+
+  ::v-deep .el-card__body {
+    width: 100%;
+    height: calc(100% - 58px);
+  }
+
+  ::v-deep .ivu-table th,
+  ::v-deep .ivu-table td {
+    border-bottom-style: dashed;
+  }
+
+  .progress-card {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    height: 100%;
+
+    &-item {
+      // min-width: 120px;
+      width: 50%;
+      // margin: 10px;
+      height: 100%;
+      display: flex;
+      justify-content: center;
+    }
+
+    &-left {}
+
+    &-right {
+      display: flex;
+      justify-content: center;
+
+      &-chart {
+        width: 60%;
+      }
+
+      &-card {
+        width: 40%;
+      }
+
+      &-change {
+        display: flex;
+        align-items: center;
+        font-size: 14px;
+        width: 100%;
+        justify-content: center;
+        margin:20px 0;
+        &>div{
+          margin:0 25px;
+          span{
+            margin-left:10px;
+          }
+        }
+      }
+
+      &-count {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+
+        &>div {
+          display: flex;
+          align-items: center;
+
+          span {
+            display: inline-block;
+            margin: 10px;
+          }
+
+          &>span:first-child {
+            width: 14px;
+            height: 14px;
+
+          }
+
+          &>span:last-child {
+            margin-left: 30px
+          }
+
+          .chuchai {
+            background-color: #feae42;
+          }
+
+          .jiaban {
+            background-color: #e386ef;
+          }
+
+          .qingjia {
+            background-color: #4771f8;
+          }
+
+          .yongche {
+            background-color: #e64a43;
+          }
+        }
+
+        &>div:last-child {
+          color: #3b4252;
+          font-size: 14px;
+        }
+      }
+    }
+  }
+
+  ::v-deep .el-progress--circle .el-progress__text {
+    white-space: break-spaces;
+  }
+</style>
diff --git a/src/views/jsc/components/car.vue b/src/views/jsc/components/car.vue
new file mode 100644
index 0000000..e6f2200
--- /dev/null
+++ b/src/views/jsc/components/car.vue
@@ -0,0 +1,140 @@
+<template>
+  <el-card id="todo-card" class="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <img src="../static/icon6.png" alt="">
+      <span style="padding-left: 15px">今日车辆去向</span>
+      <i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
+    </div>
+
+    <div style="position: relative;height: 100%;width: 100%;">
+      <div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
+        <el-table style="width: 100%;" size="mini" :header-cell-style="{
+            'font-weight': '600',
+            'background': '#fff',
+            'color': '#515a6e',
+             'text-align':'left'
+          }" :height="tableHeight" :data="list">
+          <el-table-column v-for="(item, index) in table" :key="index" :width="item.width" :label="item.title"
+            :prop="item.key" :show-overflow-tooltip="item['show-overflow-tooltip']" header-align="center"
+            :align="item.align" :formatter="item.formatter" />
+        </el-table>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+  import ElementResize from 'element-resize-detector'
+  import {
+    defaultModalSize
+  } from '@/settings'
+
+  export default {
+    name: 'Car',
+    components: {},
+    props: {
+      myData: {
+        type: Array,
+        default: () => {
+          return []
+        }
+      }
+    },
+    layout: {
+      x: 0,
+      y: 12,
+      w: 5,
+      h: 7,
+      i: 'Car',
+      name: '今日车辆去向',
+      data_id: 'chucheqingkuang',
+      data: null
+    },
+    data() {
+      return {
+        defaultModalSize,
+        tableHeight: 120,
+        list: [],
+        total: 0,
+        table: [{
+            title: '车辆',
+            key: 'chepaihao',
+            width: 120,
+            align: 'left',
+          },
+          {
+            title: '驾驶员',
+            key: 'jiashiyuan',
+            align: 'left',
+            'show-overflow-tooltip': true,
+            width: 100,
+          },
+          {
+            title: '目的地',
+            key: 'daodadidian',
+            align: 'left',
+            'show-overflow-tooltip': true,
+            minWidth: 200,
+          },
+          {
+            title: '用车时间',
+            key: 'yongchekaishiriqi',
+            align: 'left',
+            'show-overflow-tooltip': true,
+            width: 140,
+          }
+        ]
+      }
+    },
+    computed: {},
+    watch: {
+      myData(newval) {
+        console.log('newval', newval)
+        this.list = newval
+      },
+    },
+    created() {},
+    beforeDestroy() {},
+    mounted() {
+      this.init()
+    },
+    methods: {
+
+      init() {
+        const cardDom = document.getElementById('todo-card')
+        const cardTitleH = 59
+        const elementResize = ElementResize({
+          strategy: 'scroll'
+        })
+        elementResize.listenTo(cardDom, (ele) => {
+          this.tableHeight =
+            cardDom.getBoundingClientRect().height -
+            40 -
+            cardTitleH
+        })
+      },
+
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-card__body {
+    width: 100%;
+    height: calc(100% - 58px);
+  }
+
+  ::v-deep .el-table th,
+  ::v-deep .el-table td {
+    border-bottom-style: dashed;
+  }
+
+  .clearfix {
+    display: flex;
+    align-items: center;
+  }
+
+  ::v-deep .vxe-modal--content {
+    padding: 0;
+  }
+</style>
diff --git a/src/views/jsc/components/evection.vue b/src/views/jsc/components/evection.vue
new file mode 100644
index 0000000..01e1241
--- /dev/null
+++ b/src/views/jsc/components/evection.vue
@@ -0,0 +1,150 @@
+<template>
+  <el-card id="evection-card" class="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <img src="../static/icon5.png" alt="">
+      <span
+        style="padding-left: 15px"
+      >今日出差明细</span>
+      <i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
+    </div>
+
+    <div style="position: relative;height: 100%;width: 100%;">
+      <div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
+        <el-table
+          style="width: 100%;"
+          size="mini"
+          :header-cell-style="{
+            'font-weight': '600',
+            'background': '#fff',
+            'color': '#515a6e',
+            'text-align':'left'
+          }"
+          :height="tableHeight"
+          :data="list"
+        >
+          <el-table-column
+            v-for="(item, index) in table"
+            :key="index"
+            :width="item.width"
+            :label="item.title"
+            :prop="item.key"
+            :show-overflow-tooltip="item['show-overflow-tooltip']"
+            header-align="center"
+            :align="item.align"
+            :formatter="item.formatter"
+          />
+        </el-table>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import ElementResize from 'element-resize-detector'
+import { defaultModalSize } from '@/settings'
+
+export default {
+  name: 'Evection',
+  components: {
+  },
+  props:{
+    myData:{
+     type:Array,
+      default:()=>{
+        return []
+      }
+    }
+  },
+  layout: {
+    x: 0,
+    y: 5,
+    w: 5,
+    h: 7,
+    i: 'Evection',
+    name: '今日出差明细',
+    data_id:'chuchaiListToday',
+    data:null
+  },
+  data() {
+    return {
+      defaultModalSize,
+      timer: null,
+      tableHeight: 120,
+      list: [],
+      table: [
+        {
+          title: '人员',
+          key: 'flow.creator.name',
+          width: 120,
+          align: 'left',
+        },
+        {
+          title: '去向',
+          key: 'mudidi',
+          align: 'left',
+          'show-overflow-tooltip': true,
+          minWidth: 120
+        },
+        {
+          title: '交通方式',
+          key: 'jiaotongfangshi',
+          align: 'left',
+          'show-overflow-tooltip': true,
+          minWidth: 120
+        },
+        {
+          title: '出差说明',
+          key: 'chuchaishiyou',
+          align: 'left',
+          'show-overflow-tooltip': true,
+        }
+      ]
+    }
+  },
+  computed: {},
+  watch: {
+      myData(newval){
+        this.list = newval
+      },
+  },
+  created() {
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+    init() {
+      const cardDom = document.getElementById('evection-card')
+      const cardTitleH = 59
+      const elementResize = ElementResize({
+        strategy: 'scroll'
+      })
+      elementResize.listenTo(cardDom, (ele) => {
+        this.tableHeight =
+          cardDom.getBoundingClientRect().height -
+          40 -
+          cardTitleH
+      })
+    },
+
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+::v-deep .el-card__body {
+  width: 100%;
+  height: calc(100% - 58px);
+}
+::v-deep .el-table th,::v-deep .el-table td {
+  border-bottom-style: dashed;
+}
+.clearfix {
+  display: flex;
+  align-items: center;
+}
+::v-deep .vxe-modal--content {
+  padding: 0;
+}
+</style>
diff --git a/src/views/jsc/components/level.vue b/src/views/jsc/components/level.vue
new file mode 100644
index 0000000..a6d5554
--- /dev/null
+++ b/src/views/jsc/components/level.vue
@@ -0,0 +1,146 @@
+<template>
+  <el-card id="level-card" class="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <img src="../static/icon8.png" alt="">
+      <span
+        style="padding-left: 15px"
+      >今日请假情况</span>
+      <i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
+    </div>
+
+    <div style="position: relative;height: 100%;width: 100%;">
+      <div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
+        <el-table
+          style="width: 100%;"
+          size="mini"
+          :header-cell-style="{
+            'font-weight': '600',
+            'background': '#fff',
+            'color': '#515a6e',
+            'text-align':'left'
+          }"
+          :height="tableHeight"
+          :data="list"
+        >
+          <el-table-column
+            v-for="(item, index) in table"
+            :key="index"
+            :width="item.width"
+            :label="item.title"
+            :prop="item.key"
+            :show-overflow-tooltip="item['show-overflow-tooltip']"
+            header-align="center"
+            :align="item.align"
+            :formatter="item.formatter"
+          />
+        </el-table>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import ElementResize from 'element-resize-detector'
+import { defaultModalSize } from '@/settings'
+
+export default {
+  name: 'Level',
+  components: {
+
+  },
+  props:{
+    myData:{
+      type:Array,
+      default:()=>{
+        return []
+      }
+    }
+  },
+  layout: {
+    x: 5,
+    y: 8,
+    w: 3.5,
+    h: 11,
+    i: 'Level',
+    name: '今日请假情况',
+    data_id:'qingjiaListToday',
+    data:null
+  },
+  data() {
+    return {
+      defaultModalSize,
+      tableHeight: 120,
+      list: [],
+      table: [
+        {
+          title: '人员',
+          key: 'flow.creator.name',
+          width: 100,
+          align: 'left',
+        },
+        {
+          title: '事由',
+          key: 'qingjiashiyou',
+          align: 'left',
+          'show-overflow-tooltip': true,
+          minWidth: 200
+        },
+        {
+          title: '时间',
+          key: 'kaishishijian',
+          align: 'left',
+          'show-overflow-tooltip': true,
+           width: 140,
+        },
+      ]
+    }
+  },
+  computed: {},
+  watch: {
+    myData(newval){
+      this.list = newval
+    },
+  },
+  created() {
+  },
+  beforeDestroy() {
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+
+
+    init() {
+      const cardDom = document.getElementById('level-card')
+      const cardTitleH = 59
+      const elementResize = ElementResize({
+        strategy: 'scroll'
+      })
+      elementResize.listenTo(cardDom, (ele) => {
+        this.tableHeight =
+          cardDom.getBoundingClientRect().height -
+          40 -
+          cardTitleH
+      })
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+::v-deep .el-card__body {
+  width: 100%;
+  height: calc(100% - 58px);
+}
+::v-deep .el-table th,::v-deep .el-table td {
+  border-bottom-style: dashed;
+}
+.clearfix {
+  display: flex;
+  align-items: center;
+}
+::v-deep .vxe-modal--content {
+  padding: 0;
+}
+</style>
diff --git a/src/views/jsc/components/overtime.vue b/src/views/jsc/components/overtime.vue
new file mode 100644
index 0000000..d011eaf
--- /dev/null
+++ b/src/views/jsc/components/overtime.vue
@@ -0,0 +1,147 @@
+<template>
+  <el-card id="overtime-card" class="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <img style="width: 31px;height:32px" src="../static/icon9.png" alt="">
+      <span
+        style="padding-left: 15px"
+      >今日加班情况</span>
+      <i class="el-icon-more" style="margin-left: auto; font-size: 20px" />
+    </div>
+
+    <div style="position: relative;height: 100%;width: 100%;">
+      <div style="position: absolute;top: 0;left: 0;right: 0;bottom: 0;">
+        <el-table
+          style="width: 100%;"
+          size="mini"
+          :header-cell-style="{
+            'font-weight': '600',
+            'background': '#fff',
+            'color': '#515a6e',
+            'text-align':'left'
+          }"
+          :height="tableHeight"
+          :data="list"
+        >
+          <el-table-column
+            v-for="(item, index) in table"
+            :key="index"
+            :width="item.width"
+            :label="item.title"
+            :prop="item.key"
+            :show-overflow-tooltip="item['show-overflow-tooltip']"
+            header-align="center"
+            :align="item.align"
+            :formatter="item.formatter"
+          />
+        </el-table>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import ElementResize from 'element-resize-detector'
+import { defaultModalSize } from '@/settings'
+
+export default {
+  name: 'Overtime',
+  components: {
+
+  },
+  props: {
+    myData: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    }
+  },
+  layout: {
+    x: 8.5,
+    y: 8,
+    w: 3.5,
+    h: 11,
+    i: 'Overtime',
+    name: '今日加班情况',
+    data_id:'jiabanListToday',
+    data:null
+  },
+  data() {
+    return {
+      defaultModalSize,
+      tableHeight: 120,
+      list: [],
+      total: 0,
+      table: [
+        {
+          title: '人员',
+          key: 'flow.creator.name',
+          width: 100,
+          align: 'left',
+        },
+        {
+          title: '原因',
+          key: 'yuanyinshuoming',
+          align: 'left',
+          'show-overflow-tooltip': true,
+          minWidth: 200
+        },
+        {
+          title: '时间',
+          key: 'kaishiriqi',
+          align: 'left',
+          'show-overflow-tooltip': true,
+          width: 140
+        }
+      ]
+    }
+  },
+  computed: {},
+  watch: {
+      myData(newval) {
+        console.log('newval', newval)
+        this.list = newval
+      },
+  },
+  created() {
+  },
+  beforeDestroy() {
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+
+    init() {
+      const cardDom = document.getElementById('overtime-card')
+      const cardTitleH = 59
+      const elementResize = ElementResize({
+        strategy: 'scroll'
+      })
+      elementResize.listenTo(cardDom, (ele) => {
+        this.tableHeight =
+          cardDom.getBoundingClientRect().height -
+          40 -
+          cardTitleH
+      })
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+::v-deep .el-card__body {
+  width: 100%;
+  height: calc(100% - 58px);
+}
+::v-deep .el-table th,::v-deep .el-table td {
+  border-bottom-style: dashed;
+}
+.clearfix {
+  display: flex;
+  align-items: center;
+}
+::v-deep .vxe-modal--content {
+  padding: 0;
+}
+</style>
diff --git a/src/views/jsc/components/total.vue b/src/views/jsc/components/total.vue
new file mode 100644
index 0000000..a236da1
--- /dev/null
+++ b/src/views/jsc/components/total.vue
@@ -0,0 +1,153 @@
+<template>
+  <el-card class-name="box-card" shadow="hover">
+    <div class="progress-card">
+      <div class="progress-card-item" v-for="item in totalList">
+        <div class="worker-progress__icon">
+          <img :src="item.icon" alt="">
+        </div>
+        <div class="progress-card-item__num">{{ item.total }}</div>
+        <div class="progress-card-item__label">{{item.name}}</div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+  import ElementResize from 'element-resize-detector'
+  export default {
+    name: 'Total',
+    components: {
+    },
+    props:{
+      myData:{
+        type:Object,
+        default:()=>{
+          return {
+            level:0,
+            normal:0,
+            chuchai:0
+          }
+        }
+      }
+    },
+    layout: {
+      x: 0,
+      y: 0,
+      w: 5,
+      h: 5,
+      i: 'Total',
+      name: '当日情况',
+      data_id:'attendance',
+      data:null
+    },
+    data() {
+      return {
+        totalList: [{
+            icon: require('../static/icon1.png'),
+            total: 0,
+            name: '当日在岗',
+            id:'normal'
+          },{
+            icon: require('../static/icon2.png'),
+            total: 0,
+            name: '当日请假',
+            id:'leave'
+          },{
+            icon: require('../static/icon3.png'),
+            total: 0,
+            name: '当日出差',
+            id:'chuchai'
+          }
+          // ,{
+          //   icon: require('../static/icon4.png'),
+          //   total: 0,
+          //   name: '其他'
+          // }
+        ],
+        tableHeight: 200
+      }
+    },
+    created() {},
+    mounted() {
+    },
+    watch:{
+      myData(newval){
+        this.totalList.map(item=>{
+          item.total = newval[item.id]
+        })
+      },
+    },
+    methods: {
+      init() {
+        const cardDom = this.$el
+        const cardTitleH = 69
+        const elementResize = ElementResize({
+          strategy: 'scroll'
+        })
+        elementResize.listenTo(cardDom, ele => {
+          this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH
+        })
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .clearfix {
+    display: flex;
+    align-items: center;
+  }
+
+  ::v-deep .el-card__body {
+    width: 100%;
+    height: calc(100% - 58px);
+  }
+
+  ::v-deep .ivu-table th,
+  ::v-deep .ivu-table td {
+    border-bottom-style: dashed;
+  }
+
+  .progress-card {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+
+    &-item {
+      min-width: 120px;
+      margin: 10px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      text-align: center;
+
+      &__label {
+        font-size: 15px;
+        color: #000000;
+        padding-top: 20px;
+      }
+
+      &__num {
+        font-size: 20px;
+        line-height: 7px;
+        color: #000000;
+        font-weight: bold;
+        padding-top: 18px;
+      }
+
+      .worker-progress__icon {
+        border-radius: 20px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 92px;
+        height: 92px;
+      }
+    }
+  }
+
+  ::v-deep .el-progress--circle .el-progress__text {
+    white-space: break-spaces;
+  }
+</style>
diff --git a/src/views/jsc/jsc.vue b/src/views/jsc/jsc.vue
new file mode 100644
index 0000000..fbc8f91
--- /dev/null
+++ b/src/views/jsc/jsc.vue
@@ -0,0 +1,124 @@
+<template>
+  <div v-loading="loading" class="progress-card" element-loading-text="拼命加载中"
+  element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.8)">
+    <grid-layout id="grid-card" class="gird-card" :layout.sync="layoutList" :col-num="12" :row-height="40"
+      :is-draggable="false" :is-resizable="false" :is-mirrored="false" :vertical-compact="true" :margin="[10, 10]"
+      :auto-size="true" :use-css-transforms="true">
+      <grid-item v-for="item in layoutList" :key="item.i" :x="item.x" :y="item.y" :w="item.w" :h="item.h" :i="item.i"
+        style="touch-action: none">
+        <component :is="item.component" style="position: absolute; inset: 0 0 0 0" :myData="item.data"
+          @send-data="sendData" />
+      </grid-item>
+    </grid-layout>
+  </div>
+</template>
+
+<script>
+  import VueGridLayout from 'vue-grid-layout'
+  import request from '@/utils/request'
+  import {
+    getToken
+  } from '@/utils/auth'
+  import axios from 'axios'
+  const files = require.context(
+    '@/views/jsc/components',
+    false,
+    /.vue$/
+  )
+  const cpns = files.keys().map((key) => {
+    return files(key).default || files(key)
+  })
+  const layout = cpns.filter(item => !item.layout.disabled).map((item) => {
+    return {
+      ...item.layout,
+      component: item
+    }
+  })
+  export default {
+    components: {
+      'GridLayout': VueGridLayout.GridLayout,
+      'GridItem': VueGridLayout.GridItem
+    },
+    data() {
+      return {
+        loading: true,
+        layoutList: [],
+        data: {
+          statistic: {}
+        }
+      }
+    },
+    computed: {},
+    created() {
+      this.layoutList = layout.map(item => {
+        layout.forEach(lay => {
+          lay.i === item.i ? item.component = lay.component : ''
+        })
+        return item
+      }) ?? []
+      console.log("this.", this.layoutList)
+      this.getChartToday()
+    },
+    methods: {
+      sendData(data) {
+        this.data.statistic = data
+      },
+      // 今日数据
+      async getChartToday(loading = false) {
+        try {
+          if (loading) {
+            this.loading = true
+          }
+          const res = await axios.get(`${process.env.VUE_APP_BASE_API}/api/oa/chart/today`, {
+            headers: {
+              'Authorization': `Bearer ${getToken()}`
+            },
+            params: {
+            }
+          })
+          console.log("res", res)
+          if (res.status === 200) {
+            let list = res.data?.data
+            this.layoutList.map(item => {
+              // 用车情况
+              if(item.data_id=='chucheqingkuang'){
+                let carList = []
+                let arr = list['chuchaiListToday']
+                arr.map(a=>{
+                  if(a.chucheqingkuang){
+                    carList.push(...JSON.parse(a.chucheqingkuang))
+                  }
+                })
+                item['data'] = carList
+              }else{
+                item['data'] = list[item.data_id]
+              }
+            })
+          }
+          console.log("this.layoutList", this.layoutList)
+          this.loading = false
+        } catch (err) {
+          console.error(err)
+          this.loading = false
+        }
+      },
+
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  @media (max-width: 768px) {
+    ::v-deep .vue-grid-item {
+      width: 100% !important;
+      position: relative !important;
+      transform: none !important;
+      margin-bottom: 10px;
+      touch-action: auto !important;
+    }
+
+    //#grid-card {
+    //  overflow-y: scroll;
+    //}
+  }
+</style>
diff --git a/src/views/jsc/static/icon1.png b/src/views/jsc/static/icon1.png
new file mode 100644
index 0000000000000000000000000000000000000000..710fa42d8b1df2e0dadedca41833bf25c1803ba6
GIT binary patch
literal 3187
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
Z{{z!&0hQ-0*B1Z)002ovPDHLkV1hiYL^c2b

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon2.png b/src/views/jsc/static/icon2.png
new file mode 100644
index 0000000000000000000000000000000000000000..9dc89e3f54ba834c7673ccc577100a3e815eb85c
GIT binary patch
literal 3117
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
Hu0mjfgP0Rt

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon3.png b/src/views/jsc/static/icon3.png
new file mode 100644
index 0000000000000000000000000000000000000000..e538db683240db0b07c881128950dc3aa8a7866a
GIT binary patch
literal 2973
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
TFv#7R00000NkvXXu0mjfz`oFY

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon4.png b/src/views/jsc/static/icon4.png
new file mode 100644
index 0000000000000000000000000000000000000000..3befb84a45c95af3961ad51709e6939826a61ab5
GIT binary patch
literal 3607
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

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon5.png b/src/views/jsc/static/icon5.png
new file mode 100644
index 0000000000000000000000000000000000000000..bd3cc72b28952d79e2982e2aaa867f096d3e5f31
GIT binary patch
literal 643
zcmV-}0(||6P)<h;3K|Lk000e1NJLTq0018V000~a1^@s6nL1>b0006?Nkl<ZNQu?f
zOQ=m@6bJC%)<yElBO;}U5XAtA#6%fUlA>flDT%bFSHeV&l5~rKA$d&<7|3hpk)h<B
zSBg*yk!$PIcWQUqXYYM(7x~xeeEZvLt^c>yw;nsmvP=_6Dv!aqgpXK<A1aVF<ZT_m
zLafOe-WO?hm6)4^<#9b8udB#guoHtY7gve|29zlG=GK*77vMvc?(eWCsqL7T+Yezn
zg<JTBW!Q*eA-W}mN&G*I9xTR^82;Hgxo6nlm880{x4_WFNc261eR~I9Uycqm540IG
zTV&>hu&*yreuXy}h*5ZsPaTlo!<e{!i>C!LYeT|)DR?mv)3G{wFbg9(AYXw^G323Y
z78S^R8PFyn!v5Llc?j3(4u}H|Vna;2s~BA%(_2<*gW>`Diak|&Wu^AV@n4XC4t0r>
zHRT`SL4T0njoIHFlV}=t<9>nc!!QT3hUr<u45S4z9g+WRsqx3y7t3!|Y)0?mfo5b4
zXPSap!y#O2XSgieo0uP)#{7bwa3TJN;A?)W<<Pb{)xGmsvEz+x^ZskmW|CTim3<|D
z5!xWO#-!`16RjjQHc6epx!5lXQD*2RCg+}yVQR%xYfi|J6C<k*S?2lRg0}diWzOfZ
zG)djWkvhax<l|yyPpYsHrq^-Yh;zF(s_s0D)7xzZL%_D!P_}eJ+C-gfpMX0Up4(f1
z>o^(@*eBGf^MEP*zR%F*mSRU=3G=8+F4p?_{vd7QpHH<;yzf`;KpsAa{{@ByufzBG
duD{OCrC$Leb!aU4Vx#~7002ovPDHLkV1k7AHqrn9

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon6.png b/src/views/jsc/static/icon6.png
new file mode 100644
index 0000000000000000000000000000000000000000..4509f8ba35d721240139f587d5fac71ed4960e36
GIT binary patch
literal 626
zcmV-&0*(ENP)<h;3K|Lk000e1NJLTq0012T000*V1^@s6_XtF30006xNkl<ZNQt$U
zO^A+B6vuz}o!1y+e3X2QW;H1_8Vef+<zpeSP(*ghg6zaC#a32N7E&Y@7Fbw|1*Rk>
zE7L6GV>HZaB&k;^O|H(<x!jKDd2`3izuunbeBJ+Z&pG$p*M$&>aGn$$z&T(Su#h~A
z0@p*q)2gUC(gnZ>us)N_Vp}M9VwKGr=Mzf!3CgdXpF#8kSOIJSZUcSRp>C&dfi=JY
z@akXLLXj-&83+1-wV~im>er}<U9E)gatJGMQB{YmsfzS~K8p%l4sNOMaT`;n*Liv+
zJHRyXSkt-+_?*KM%x5}ZuC)Ugf->FGL#?Ls3<KM>0fe+0n93!r!2>0I4txi?grlLy
zL(r*&f@Q$5|6y~UL6chHalkys=^$I)2i#R<iZNhPYj166Nh~B=OM$Hww#&fzW+<3;
zzTA4%qJ#RIEi4WNQ?Yx8W^v(mkox{UGTk#;A|GAO(;3I$N)!GCxTfRmXriA0Uh8EL
z%ON%F0X8SP7r;Yc6R<OhUnIVfv_CPlfDOP0m1Qzr(0BQO;hO!8>bxEa#h-FH&wXIG
zigIL@#Plvtf?p<tf=kK!`!)&vs?VE7f5XUqai{5Rvrf~{Qu#<?I|Dp2o&HmMVnF5n
zz}3Wl(2(}TF*t5gEGfOBL*i_k-PPfq)^sCq*!b+NBb`g^sk&w69I=*m8co)Wu^h;V
zJO!LIF&&XquCWx-NFTFV{=VA2Rk$@`dhZy6m1he1e<gE0Vgh*f3upX(tmJ~aSO5S3
M07*qoM6N<$f>z@t$N&HU

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon7.png b/src/views/jsc/static/icon7.png
new file mode 100644
index 0000000000000000000000000000000000000000..87a21ecbf3a4da27509fc7d0a6a9a6102979f117
GIT binary patch
literal 469
zcmV;`0V@89P)<h;3K|Lk000e1NJLTq000>P000>X1^@s6#OZ}&0004;Nkl<ZNQt$U
zyGjHx6o$WyQz$HmY^7o)h$y~*f}jf`c8VY(?1H7Y#=L-iDnYC)#6m4BY!w8tu(Gkx
zH?R{{yn;$3vl)ppmz~|&AHw7efAS?clVpU}nkWg$Ixqn2YQ<fospeY*#(-n3xQg<4
zagBiuU=8R>@EFYktH4m4!55N2VA96!w1j;w3CV~PyE6Vh8<&I(JfY7AUV&4=rhWjr
zQ%2j2w#{;Nv=Cra@a&XYsrRJB=O*u8vRfkG7Ncw6CFQfOSKmOtEdik2Hk{FlYF;xD
zk`-XbRNdt&=Dbveu;M!}{b+BpgyaHf1Lm~i(J}undqW+E5|Tq;!iK%@2h!Z=sR53F
z1shIj#ciCop)V-{aGvCkg$T*8kX#DMax;KL2n6@UIIt%qqZV+G6+lW(w(K!p2F}c^
z%wEb0NQ7v`Cr}YG2+NHEs3-ASQ2|bDSjq~h3t~a@=6cmC*m#-cIoIV=3g|v#=Wk)f
zch0UJA$iW}6#jC5Knx@dZgS{6N<{<N2d05ed(h<}lY$SR3Y`A{Kr>$wNskor00000
LNkvXXu0mjf4zbQU

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon8.png b/src/views/jsc/static/icon8.png
new file mode 100644
index 0000000000000000000000000000000000000000..558bd3b8ae0fc081abb034c00e384436a6d21511
GIT binary patch
literal 753
zcmV<N0uKF&P)<h;3K|Lk000e1NJLTq0018V001Be1^@s6>Vl&|0008GNkl<ZNQteN
zU5E}*7{`CJyJF>YN!C(qZ6b1GDOt3*P-=bV!VRquE|hUYAz2qXN}=448xj_)T=^=?
z1;rI9ANeSeh%HgRj-J`)-KO=<oHH};zuwODo;lBN&N*|Q|1$wQEDqHIZNM5}YV6jR
zz(wGaHGFjiDJK_v0I(a_28=4xFVJ(qUTgT66<(FnR}CDLzzJZ{2w*dCH3%77N%#t2
zyJwu)z@bXPWw}G3CPS>YAY@i0;7!2HEP;Swz}!l}=Qy?`NzFm%KQ8IUh8$o~BQUrq
zyf!C%P?npM;1hDf<wy=G0-p{n$_bb4T3-Y{PLoGoH5GwB0G<|rUoHaw0<;6~GeX5A
zI)H0M;G&1Xsf_Svz+r3n>pLJVeVzf<0uw!BowO!ewLWRW5reYU@Voy2m!-}J&I4l{
z;4W)e7K6^v8lVNJ1AYLHflh0<?h8k~{HWueR%^Je;4Q%Z6dRTm4XxpW4_wTmJEgx1
zSOxr1C-kw_`@j+(6KG87`!2K8{gf@*=MfL}{|*;iYPLNo{Wq=QQ4kUUo3faS)PzZI
z`xIFgU?-%OM;Ejm3M?-Dd1ouMOe#O1`xVSP9$nVO;bJDMb&s2Y@g7hATH6MFtDOpD
zjZ`&SGRczd0_uGN#Pm}ye?gR7<V=@l=9KLDIz38R!J^^Xz60K79W3ybIiMv?me!gm
ziFg}|>XX1n7J#?Lu1^4;GmJf5m9_Ngrv*V66(2JD=fDO{r7qn94&<p&<C3D|ND%f;
zz#6UqOVt(2sRuYF8POVgB)#4M78ZPnPVoTA*YxIhNjA$N`iQ7k=nLSkHQXx=68J{_
z7?h%4l0|e}a_EgLrCMvBVFV%7)<k*#Kgl^i3p~-RHcjnww3g2UW4~B>h$QD)&i6N+
jnQWmvytI9=Brw1~{5O`}xN@kL00000NkvXXu0mjf#!OPh

literal 0
HcmV?d00001

diff --git a/src/views/jsc/static/icon9.png b/src/views/jsc/static/icon9.png
new file mode 100644
index 0000000000000000000000000000000000000000..e3f43250a7b1b637022e24e2c7dfbdc0ce7536be
GIT binary patch
literal 755
zcmV<P0u23$P)<h;3K|Lk000e1NJLTq0018V001Be1^@s6>Vl&|0008INkl<ZNQteN
zU5E}*7{`CJAF-RSkg#0XED^b}yOCXz8>M_iTa=Ou!i6$YE|74cQ3{vbhznU?<w_{K
zQi>F%<hx{(VoSDsjh@+Obj-|q-kCG+zos)E=RE)Ooadb9|BM%gA(i0yGy$uD9$>D~
z?G<ntxB`5wXuv=iq~A4Ih#P@@z%F1y;`1zE5zr1C1U}`NKoWHoi0gr4YB)(8V;ry@
zxB*PA89A^H*qzfxCvdzb<htCxEhHI`ebG^x9B2a;7PK=4SW*k}#g=f`&|Y+0R_7K6
zVnHj=T$a4ak$hy)0a@hJ9m(ZLj&dgVeC7iy9LXhITb#*(shT`o(N>21A@IBe`Bi7~
zFyITY75G??RMhDxaMPJwC-4Y3SCIS#a02*Kid=C4cw4~ES%_9GX}i&?oR#$4^H~a9
z0wz@<z7DK0o)>7Y?*hgHL%=hjHw?Iyi(DrlT7Ieu`EuZ{-tPboTVz;P)DHs&$e~<M
zs(cr(`(&P~gehsgw{y7dJ`**YfSI1p$~@$)mT%wH%U{4U;80elt{JIUoq95?Wt7xx
z2Q1{bfye6gwt}M4LsrZ^pE(dM%ib#G(PrShYWZt3&a%`Q9!KbV^DhL$o_l^ICL6RM
z5M7>@WA^b;Y|&kv3!bc#qCt1`eqc&o1BxHo{?z1BAAg8F!zh_OKW(5+k5W-$!B}lS
z0Ph{fJC#c@W@|fS6BLPYe>zuwmdj(0CCk`x4Opu^L`ol6l1ma%Fv^h2Z&Ek#RG%fq
zUd&O3-O>MoQp+wy$4R4hla*Knkt$|k5I7C24+93}D&u*KUj3gN(C20iM~7}?A$<w-
zhXMD^fkOUH6UAurxD<rgIHJ;OIwSUe%T1-f)Qu2jwRtL^6E$uljLS$35#(IU`TnM!
lN%&;)(ne$o^ZtJTe*xnul`tRP4m$t<002ovPDHLkV1g=QSW*B0

literal 0
HcmV?d00001