大屏

Mr.Shi

2023-08-22 f43c3e45aa4fa2b8dd74775894808765bf076908

大屏

 screen_standard/src/App.vue

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

const enterprise = useCounterStore()
// const route = useRoute()
let query = window.location.href.split('?')[1].split('&')
let queryStr = window.location.href.split('?')[1]||''
let query = queryStr.split('&')||[]
let data = { companyId: enterprise.companyId }
query.forEach(item => {
  let subQuery = item.split('=')

 screen_standard/src/components/AppLayout.vue

@@ -2,7 +2,7 @@
  <div class="content">
    <div class="header">
      <div class="header-item" style="font-size: 20px;">
        <el-dropdown trigger="click">
        <el-dropdown trigger="click" v-if="route.name=='home'">
          <div class="eare-title">
            {{ tempCom.name}}
            <div class="right-icon">
@@ -15,8 +15,10 @@
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      

        <img v-else src="@/assets/img/btn_back@2x.png" style="width: 108px;height: 34px; margin-top: 14px;" @click="router.go(-1)">
      </div>
      
      <div class="title">DM云工厂车间大屏</div>
      <div class="header-item right">

@@ -30,7 +32,6 @@
        <!-- <img src="@/assets/img/title_line@2x.png" class="right-line" alt=""> -->
      </div>
    </div>
    <!-- 'background': `url(${getAssets(item.bgImg)})`, -->
    <div class="num-list">
      <div
        v-for="(item, index) in layoutList"
@@ -41,9 +42,8 @@
        <img :src="getAssets(item.logo)" alt="">
        <div class="item-right">
          <div class="item-title">{{ item.name }}</div>
          <div class="num-value">1</div>
          <div class="num-value">{{ countList[index] }}</div>
        </div>
        
      </div>
    </div>
    <RouterView />
@@ -54,10 +54,12 @@
<script setup>
import { getAssets } from '@/utils'
import { getDepartmentList } from '@/utils/apis.js'
import { reactive, toRefs, ref, onMounted } from 'vue';
import { reactive, toRefs, onMounted, computed } from 'vue';
import { useCounterStore } from '@/stores/counter.js'
import { RouterView } from 'vue-router'
import { RouterView, useRoute, useRouter } from 'vue-router'
const enterprise = useCounterStore()
const route = useRoute()
const router = useRouter()
const layoutList = [
  { bgImg: 'bg_zhixingzhong@2x.png', name: '执行中计划数(个)', logo: 'ic_zhixingzhong@2x.png' },
  { bgImg: 'bg_yanqijihua@2x.png', name: '延期计划数(个)', logo: 'ic_yanqijihua@2x.png' },
@@ -65,6 +67,21 @@
  { bgImg: 'bg_jinrishebei@2x.png', name: '今日生产设备(台)', logo: 'ic_jinrishebei@2x.png' },
  { bgImg: 'bg_jinribuliang@2x.png', name: '今日不良品率(%)', logo: 'ic_jinribuliang@2x.png' },
]
const ingNum = computed(() => {
    return enterprise.ingNum
})
const delayNum = computed(() => {
    return enterprise.delayNum
})
const prouserNum = computed(() => {
    return enterprise.prouserNum
})
const deviceNum = computed(() => {
    return enterprise.deviceNum
})
const unqualifiedRate = computed(() => {
    return enterprise.unqualifiedRate
})

const data = reactive({
  tempCom: { name: '豆米科技' },
@@ -74,13 +91,21 @@
    date: '',
    day: ''
  },
  comList: []
  comList: [],
  countList: [
    ingNum||0,
    delayNum||0,
    prouserNum||0,
    deviceNum||0,
    unqualifiedRate||0
  ]
})

let { tempCom, isFull, tempDate, comList } = toRefs(data)


let { tempCom, isFull, tempDate, comList, countList } = toRefs(data)

const selectCom = (item, index) => {
  console.log(item);
  data.tempCom = item
  enterprise.setDepartId(data.tempCom.id)
}
@@ -114,6 +139,7 @@
}

onMounted(() => {
  console.log(route.name);
  getDepartmentList(enterprise.companyId)
    .then(res => {
      data.comList = res

 screen_standard/src/stores/counter.js

@@ -5,7 +5,19 @@

  state: () => {
    // 678
<<<<<<< HEAD
    return { companyId: '', departId: '' };
=======
    return {
      companyId: '8',
      departId: '132',
      delayNum: 0, // 延期计划数
      deviceNum: 0, // 今日生产设备数
      ingNum: 0, // 执行中计划数
      prouserNum: 0, // 今日生产人数
      unqualifiedRate: 0 // 今日不良品率
    };
>>>>>>> 8eebd3b823c2e477f949b7f06b6e972ec09327df
  },

  actions: {
@@ -18,6 +30,13 @@
    setDepartId(departId) {
      this.departId = departId;
      window.sessionStorage.setItem('departId', departId);
    },
    setNum(num) {
      this.delayNum = num.delayNum
      this.deviceNum = num.deviceNum
      this.ingNum = num.ingNum
      this.prouserNum = num.prouserNum
      this.unqualifiedRate = num.unqualifiedRate
    }
  }


 screen_standard/src/utils/apis.js

@@ -1,6 +1,16 @@
import axiosInstance from './request';

// 员工产品统计TOP10
// 查询企业全部公司部门
export function getDepartmentList (companyId) {
  return axiosInstance.get(`statistics/getDepartmentList/${companyId}`)
}

// 数据统计-成品计划，执行中、延期计划数、今日生产人数、今日生产设备数、今日不良品
export function getProcedurePlanData (companyId, departId, params) {
  return axiosInstance.get(`statistics/getProcedurePlanData/${companyId}/${departId}`, {params} )
}

// 员工产品统计TOP10
export function getTop (companyId, departId, params) {
  return axiosInstance.get(`statistics/userProduceTop/${companyId}/${departId}`, {params})
}

 screen_standard/src/views/process.vue

@@ -34,31 +34,31 @@
        <div class="yield-content">
          <div class="yield-content-left">
            <div class="content_left_item1_content">
              <div class="content_left_item1_content_row" v-for="(item, index) in 5" :key="index">
              <div class="content_left_item1_content_row" v-for="(item, index) in top1" :key="index">
                <div class="content_left_item1_content_row_name">
                  <div :class="index > 2 ? 'num bg1' : 'num bg2'">{{ index + 1 }}</div>
                  <span>赵立{{ index }}</span>
                  <span>{{ item.userName }}</span>
                </div>
                <div class="content_left_item1_content_row_line">
                  <el-progress :show-text="false" :percentage="50">
                  <el-progress :show-text="false" :percentage="item.doneNum/baseNum">
                  </el-progress>
                </div>
                <div class="content_left_item1_content_row_num">342</div>
                <div class="content_left_item1_content_row_num">{{ item.doneNum }}</div>
              </div>
            </div>
          </div>
          <div class="yield-content-left">
            <div class="content_left_item1_content">
              <div class="content_left_item1_content_row" v-for="(item, index) in 5" :key="index">
              <div class="content_left_item1_content_row" v-for="(item, index) in top2" :key="index">
                <div class="content_left_item1_content_row_name">
                  <div class="num bg1">{{ index + 6 }}</div>
                  <span>赵立{{ index }}</span>
                  <span>{{ item.userName }}</span>
                </div>
                <div class="content_left_item1_content_row_line">
                  <el-progress :show-text="false" :percentage="50">
                  <el-progress :show-text="false" :percentage="item.doneNum/baseNum">
                  </el-progress>
                </div>
                <div class="content_left_item1_content_row_num">342</div>
                <div class="content_left_item1_content_row_num">{{ item.doneNum }}</div>
              </div>
            </div>
          </div>
@@ -107,54 +107,60 @@
</template>

<script setup>
import { reactive, ref, onMounted, onBeforeUnmount, onUnmounted, nextTick } from 'vue'
import { reactive, ref, toRefs, onMounted, onBeforeUnmount, onUnmounted, nextTick } from 'vue'
import { getProcedurePlanData, getTop } from '@/utils/apis.js'
import { useCounterStore } from '@/stores/counter.js'
import { useRoute } from 'vue-router'
import * as echarts from 'echarts'
const route = useRoute()
const enterprise = useCounterStore()
let planTimer = ref(null)
let reportTimer = ref(null)
let planContainer = ref(null)
let reportLogContainer = ref(null)
let listData = reactive([
  { name: 'dom第一个' },
  { name: 'dom第二个' },
  { name: 'dom第三个' },
  { name: 'dom第四个' },
  { name: 'dom第五个' },
  { name: 'dom第六个' },
  { name: 'dom第七个' },
  { name: 'dom第八个' },
  { name: 'dom第九个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
  { name: 'dom第十个' },
])
let dayDistribution = reactive([
  { date: '8/1', num: '20' },
  { date: '8/2', num: '10' },
  { date: '8/3', num: '20' },
  { date: '8/4', num: '40' },
  { date: '8/5', num: '30' },
  { date: '8/6', num: '10' },
  { date: '8/7', num: '20' },
])
let typeDistribution = reactive([
  { name: '外观不良', num: 15 },
  { name: '有毛刺', num: 12 },
  { name: '尺寸不良', num: 22 },
  { name: '有划痕', num: 5 },
  { name: '其他', num: 2 },
const data = reactive({
  listData: [
    { name: 'dom第一个' },
    { name: 'dom第二个' },
    { name: 'dom第三个' },
    { name: 'dom第四个' },
    { name: 'dom第五个' },
    { name: 'dom第六个' },
    { name: 'dom第七个' },
    { name: 'dom第八个' },
    { name: 'dom第九个' },
    { name: 'dom第十个' },
  ],
  top1: [],
  top2: [],
  baseNum: 0,
  dayDistribution: [
    { date: '8/1', num: '20' },
    { date: '8/2', num: '10' },
    { date: '8/3', num: '20' },
    { date: '8/4', num: '40' },
    { date: '8/5', num: '30' },
    { date: '8/6', num: '10' },
    { date: '8/7', num: '20' },
  ],
  typeDistribution: [
    { name: '外观不良', num: 15 },
    { name: '有毛刺', num: 12 },
    { name: '尺寸不良', num: 22 },
    { name: '有划痕', num: 5 },
    { name: '其他', num: 2 },
  ]
})

])
let { listData, top1, top2, baseNum } = toRefs(data)

// start()
onBeforeUnmount(() => {
  clearTimeout(planTimer.value)
  clearTimeout(reportTimer.value)
})
onMounted(() => {
  initData()
  nextTick(() => {
    start()
    reportStart()
@@ -168,6 +174,36 @@
  clearTimeout(planTimer.value)
  clearTimeout(reportTimer.value)
})

function initData() {
  // 计划数
  getProcedurePlanData(enterprise.companyId, enterprise.departId, { procedureId: route.query.procedureId })
    .then(res => {
      enterprise.setNum(res)
    })
  // top10
  getTop(enterprise.companyId, enterprise.departId, { procedureId: route.query.procedureId })
    .then(res => {
      if (res.length) {

        data.baseNum = res[0].doneNum
        data.top1 = []
        data.top2 = []
        if (res.length <= 5) {
          data.top1 = res
        } else {
          res.forEach((item, index) => {
            if (index < 5) {
              data.top1.push(item)
            } else {
              data.top2.push(item)
            }
          })
        }
      }
    })
  
}

function handleMouseEnter() {
  clearTimeout(planTimer.value)
@@ -200,12 +236,12 @@
    scrollDom = planContainer.value
  } else {
    // 如果列表数量过少不进行滚动
    if (scrollDom.children.length < 4) {
    if (scrollDom.children.length <=10) {
      clearTimeout(planTimer.value)
      return
    }
    // 组件进行滚动
    scrollDom.scrollTop += 2
    scrollDom.scrollTop += 1.5
    // 判断是否滚动到底部
    if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) {
      // 获取组件第一个节点
@@ -233,12 +269,12 @@
    scrollDom = reportLogContainer.value
  } else {
    // 如果列表数量过少不进行滚动
    if (scrollDom.children.length < 4) {
    if (scrollDom.children.length <= 10) {
      clearTimeout(reportTimer.value)
      return
    }
    // 组件进行滚动
    scrollDom.scrollTop += 2
    scrollDom.scrollTop += 1.5
    // 判断是否滚动到底部
    if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) {
      // 获取组件第一个节点
@@ -259,7 +295,7 @@
  let dateList = []
  let numList = []

  dayDistribution.forEach(item => {
  data.dayDistribution.forEach(item => {
    dateList.push(item.date)
    numList.push(item.num)
  })
@@ -350,20 +386,11 @@
  let myChart = echarts.init(dayChartDom);
  let legendData = []
  let seriesData = []
  typeDistribution.forEach(item => {
  data.typeDistribution.forEach(item => {
    legendData.push(item.name)
    seriesData.push({name:item.name, value:item.num})
  })
  let option = {
    // title: {
    //   text: '同名数量统计',
    //   subtext: '纯属虚构',
    //   left: 'center'
    // },
    // tooltip: {
    //   trigger: 'item',
    //   formatter: '{a} <br/>{b} : {c} ({d}%)'
    // },
    legend: {
      show: false,
      type: 'scroll',

 server/src/main/java/doumeemes/dao/system/model/SystemLoginLog.java

@@ -24,14 +24,13 @@
    @TableId(type = IdType.AUTO)
    @ApiModelProperty(value = "主键", example = "1")
    private Integer id;

    @ApiModelProperty(value = "登录用户ID", example = "1")
    private Integer userId;
    @ApiModelProperty(value = "企业编码", example = "1")
    private Integer companyId;
    @ApiModelProperty(value = "来源  0pc 1钉钉 2羚羊平台 3EDGP平台", example = "1")

    @ExcelColumn(name="来源", valueMapping = "0=PC平台;1=钉钉平台;2=羚羊平台;3=EDGP平台;4=微信小程序", align = HorizontalAlignment.CENTER)
    @ExcelColumn(name="来源", valueMapping = "0=PC平台;1=钉钉平台;2=羚羊平台;3=EDGP平台;4=微信小程序",width = 6,align = HorizontalAlignment.CENTER)
    private Integer orgin;
    @ApiModelProperty(value = "企业用户编码", example = "1")
    private Integer companyUserId;