大屏

Mr.Shi

2023-08-22 fa5f9a7fe01331584db5cb0e30966ee77eaa4756

大屏

 screen_standard/src/stores/counter.js

@@ -6,7 +6,7 @@
  state: () => {
    return {
      companyId: '8',
      departId: '132',
      departId: '178',
      delayNum: 0, // 延期计划数
      deviceNum: 0, // 今日生产设备数
      ingNum: 0, // 执行中计划数

 screen_standard/src/views/index.vue

@@ -67,24 +67,24 @@
                    <div @mouseenter="handleMouseEnter1" @mouseleave="handleMouseLeave1" class="main_container">
                        <div ref="scrollContainer1" class="scroll_container">
                            <div v-for="(item, index) in data.plannedProgress" :key="index" :class="index % 2 == 0 ? 'scroll_item scroll_item_bg1' : 'scroll_item scroll_item_bg2'">
                                <div class="scroll_item_row">323444112</div>
                                <div class="scroll_item_row">电吉他</div>
                                <div class="scroll_item_row">CP003</div>
                                <div class="scroll_item_row">1000</div>
                                <div class="scroll_item_row">{{ item.code }}</div>
                                <div class="scroll_item_row">{{ item.materialName }}</div>
                                <div class="scroll_item_row">{{ item.materialCode }}</div>
                                <div class="scroll_item_row">{{ item.num }}</div>
                                <div class="scroll_item_row">
                                    <el-tooltip
                                        v-for="(child, i) in 6" :key="i"
                                        v-for="(child, i) in item.procedureList" :key="i"
                                        effect="dark"
                                        content="已报工良品数1000；工序计划数500"
                                        placement="top">
                                        <div class="scroll_item_row_item">
                                        <div class="scroll_item_row_item" @click="jump(child.procedureId)">
                                            <div class="scroll_item_row_item_x"></div>
                                            <img v-if="i == 0 || i == 1" src="@/assets/img/ic_complete@2x.png" alt="" />
                                            <span v-else>98%</span>
                                            <span v-else>{{ child.rate }}%</span>
                                        </div>
                                    </el-tooltip>
                                </div>
                                <div class="scroll_item_row">498/500</div>
                                <div class="scroll_item_row">{{ item.qualifiedNum }}/{{ item.doneNum }}</div>
                            </div>
                        </div>
                    </div>
@@ -153,7 +153,7 @@
                </div>
                <div class="content_right_top_nr">
                    <div class="content_right_top_nr_bottom_yuan" v-if="data.typeDistribution.length > 0">
                        <span>67</span>
                        <span>{{ data.num }}</span>
                        <span>不良项分布</span>
                    </div>
                    <div class="content_right_top_nr_top" id="lineChrat"></div>
@@ -189,10 +189,13 @@
</template>

<script setup>
    import { reactive, ref, onMounted, onBeforeUnmount, onUnmounted, nextTick, computed, watch } from 'vue'
    import { reactive, ref, onBeforeUnmount, onUnmounted, nextTick, computed, watch } from 'vue'
    import { getTop, getStockList, getWorkPlansList, getProcedureProcessList, getRecordLogPage, getDeviceCheckPage, getUnqualified7DayData, getUnqualifiedCateData } from '@/utils/api.js'
    import { useCounterStore } from '@/stores/counter.js'
    import * as echarts from 'echarts'
    import { useRouter } from 'vue-router'

    const router = useRouter()

    let data = reactive({
        production: [],
@@ -202,7 +205,8 @@
        log: [],
        patrolInspection: [],
        dayDistribution: [],
        typeDistribution: []
        typeDistribution: [],
        num: 0
    })

    let timer = ref(null)
@@ -240,6 +244,10 @@
    const departId = computed(() => {
        return enterprise.departId
    })

    const jump = (procedureId) => {
        router.push({ name: 'process', query: { procedureId } })
    }

    watch(() => departId.value, (val) => {
        if (val) {
@@ -310,7 +318,9 @@
            getUnqualifiedCateData(companyId.value, departId.value, '')
                .then(res => {
                    if (res && res.length > 0) {
                        data.num = 0
                        data.typeDistribution = res.map(item => {
                            data.num += item.unqualifiedNum
                            return {
                                name: item.categoryName,
                                num: item.unqualifiedNum
@@ -332,15 +342,16 @@
        let myChart = echarts.init(dayChartDom);
        let dateList = []
        let numList = []

        let num = 0
        data.dayDistribution.forEach(item => {
            dateList.push(item.date)
            numList.push(item.num)
            num += item.num
        })
        let option;
        option = {
            title: {
                text: '近七日不良品总数：67',
                text: `近七日不良品总数：${num}`,
                textStyle: {
                    color: '#fff',
                    fontSize: 12