完成车间大屏

baoshiwei

2023-08-01 3efe2606474fba1905fa4edab82b713b9cfb5ef3

完成车间大屏

 .env

@@ -2,7 +2,7 @@
VITE_PORT = 3100

#  ç½‘站标题
VITE_GLOB_APP_TITLE = æ™ºèƒ½ä¸­è‰è¯å¹²ç‡¥ç³»ç»Ÿ
VITE_GLOB_APP_TITLE = æ™ºèƒ½ä¸­è‰è¯å¹²ç‡¥é…æ–¹ç®¡ç†ç³»ç»Ÿ

# ç®€ç§°ï¼Œç”¨äºŽé…ç½®æ–‡ä»¶åå­— ä¸è¦å‡ºçŽ°ç©ºæ ¼ã€æ•°å­—开头等特殊字符
VITE_GLOB_APP_SHORT_NAME = JeecgBootAdmin

 src/assets/images/dry/bg/1.jpg

Binary files differ

 src/assets/images/dry/bg/2.jpg

Binary files differ

 src/assets/images/dry/bg/3.jpg

Binary files differ

 src/assets/images/dry/bg/4.jpg

Binary files differ

 src/assets/images/dry/bg/5.jpg

Binary files differ

 src/assets/images/dry/bg/6.jpg

Binary files differ

 src/assets/images/dry/bg/7.jpg

Binary files differ

 src/assets/images/dry/bg/wkshop.png

 src/assets/images/dry/bg/wksp.png

 src/assets/images/dry/bg/wksp1.png

 src/assets/images/dry/bg/wksp2.png

 src/assets/images/dry/bg/workshop.png

 src/layouts/default/header/components/user-dropdown/index.vue

@@ -15,7 +15,7 @@
                <MenuDivider v-if="getShowDoc" />
                <MenuItem key="account" :text="t('layout.header.dropdownItemSwitchAccount')" icon="ant-design:setting-outlined" />
                <MenuItem key="password" :text="t('layout.header.dropdownItemSwitchPassword')" icon="ant-design:edit-outlined" />
                <MenuItem key="depart" :text="t('layout.header.dropdownItemSwitchDepart')" icon="ant-design:cluster-outlined" />
                <!-- <MenuItem key="depart" :text="t('layout.header.dropdownItemSwitchDepart')" icon="ant-design:cluster-outlined" /> -->
                <MenuItem key="cache" :text="t('layout.header.dropdownItemRefreshCache')" icon="ion:sync-outline" />
                <!-- <MenuItem
            v-if="getUseLockPage"

 src/views/dry/DryOrderList.vue

@@ -53,6 +53,8 @@
    import { BasicTable, TableAction } from '/@/components/Table'
    import { useListPage } from '/@/hooks/system/useListPage'
    import { downloadFile } from '/@/utils/common/renderUtils'
    import { router } from '/@/router'

    const checkedKeys = ref<Array<string | number>>([])
    //注册model
    const [registerModal, { openModal }] = useModal()
@@ -141,8 +143,8 @@
    function getTableAction(record) {
        return [
            {
                label: '编辑',
                onClick: handleEdit.bind(null, record),
                label: '操作记录',
                onClick: openReport.bind(null, record),
            },
        ]
    }
@@ -151,6 +153,10 @@
     */
    function getDropDownAction(record) {
        return [
            {
                label: '编辑',
                onClick: handleEdit.bind(null, record),
            },
            {
                label: '详情',
                onClick: handleDetail.bind(null, record),
@@ -164,6 +170,17 @@
            },
        ]
    }

    /**打开报表 */
    function openReport(record: Recordable) {
        console.log(`output->record`, record)
        router.push({
            path: '/dry/order/report',
            query: {
                batch: record.code,
            },
        })
    }
</script>

<style scoped></style>

 src/views/dry/bigScreen/BigEqp.vue

@@ -1,144 +1,148 @@
<template>
    <dv-full-screen-container>
    <div class="eqpBox">
        <div class="eqpRow">
            <div class="eqpImage"  :style="{'background-position':position + 'px'}">
				
                <div class="leftEqp">
                    <div style="width: 350px;  ">
                    <div class="herbInfo">
						
                            <dv-border-box7 class="curEqp">
                                <div class="eqpName" style="padding: 30px" @click="changeEqp">
                                    <div class="mainInfo" style="font-size: 26px">{{ eqp?.name }}</div>
                                    <div class="subhead">{{ eqp?.type }}</div>
                                    <dv-decoration-1 style="width:300px;height:90px; margin-left: 20px;" />
                                    <!-- è®¾å¤‡ï¼š{{ eqp.name }}</div>
    <dv-full-screen-container>
        <div class="eqpBox">
            <div class="eqpRow">
                <div class="eqpImage" :style="{ 'background-position': position + 'px' }">
                    <div class="leftEqp">
                        <div style="width: 350px">
                            <div class="herbInfo">
                                <dv-border-box7 class="curEqp">
                                    <div style="display: flex">
                                        <div style="padding-top: 20px; padding-left: 10px" @click="back">
                                            <Icon style="color: powderblue" icon="ion:caret-back-sharp" :size="35" />
                                        </div>
                                        <div class="eqpName" style="text-align: right" @click="changeEqp">
                                            <div class="mainInfo" style="font-size: 26px">{{ eqp?.name }}</div>
                                            <div class="subhead">{{ eqp?.type }}</div>
                                            <dv-decoration-1 style="width: 240px; height: 90px; margin-left: 20px" />
                                            <!-- è®¾å¤‡ï¼š{{ eqp.name }}</div>
                                <div class="eqpName">型号：{{ eqp.type }}</div> -->
                                </div>
                            </dv-border-box7>
                            <dv-border-box7 class="curHerb" :style="{'background-image': 'url('+getHerbImageUrl(realData?.herbImage)+')'}">
                                <div class="eqpName" style="margin-left: 176px; height: 190px">
                                    <div class="mainInfo" style="font-size: 26px">{{ realData?.herbName }}</div>
                                    <div class="subhead">干燥配方</div>
                                </div>
                                <div class="formula">
                                    <div class="formulaItem">
                                        <Icon style="color: powderblue" icon="icon-park-twotone:box" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.feed }} ç­</div>
                                            <div class="subhead2">投料量</div>
                                        </div>
                                    </div>
                                    <div class="formulaItem">
                                        <Icon style="color: red" icon="bx:wind" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.windTemp }} Â°C</div>
                                            <div class="subhead2">热风</div>
                                </dv-border-box7>
                                <dv-border-box7 class="curHerb" :style="{ 'background-image': 'url(' + getHerbImageUrl(realData?.herbImage) + ')' }">
                                    <div class="eqpName" style="margin-left: 156px; height: 190px">
                                        <div class="mainInfo" style="font-size: 26px">{{ realData?.herbName }}</div>
                                        <div class="subhead">干燥配方</div>
                                    </div>
                                    <div class="formula">
                                        <div class="formulaItem">
                                            <Icon style="color: powderblue" icon="icon-park-twotone:box" :size="35" />
                                            <div>
                                                <div class="mainInfo2">{{ realData?.feed }} ç­</div>
                                                <div class="subhead2">投料量</div>
                                            </div>
                                        </div>
                                        <div class="formulaItem">
                                            <Icon style="color: red" icon="bx:wind" :size="35" />
                                            <div>
                                                <div class="mainInfo2">{{ realData?.windTemp }} Â°C</div>
                                                <div class="subhead2">热风</div>
                                            </div>
                                        </div>
                                        <div class="formulaItem">
                                            <Icon style="color: green" icon="tabler:target-arrow" :size="35" />
                                            <div>
                                                <div class="mainInfo2">{{ realData?.target }} %</div>
                                                <div class="subhead2">目标</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="formulaItem">
                                        <Icon style="color: green" icon="tabler:target-arrow" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.target }} %</div>
                                            <div class="subhead2">目标</div>
                                        </div>
                                    </div>
                                </div>
                                <!-- <div class="eqpName">{{ realData?.herbName }}</div>
                                    <!-- <div class="eqpName">{{ realData?.herbName }}</div>
                                <div class="eqpName">{{ realData?.feed }} ç­</div> -->
                            </dv-border-box7>
                        </div>
                        <!-- <dv-border-box7 class="infoChart" style="margin-left: 0px;">
                                </dv-border-box7>
                            </div>
                            <!-- <dv-border-box7 class="infoChart" style="margin-left: 0px;">
                            <div class="chartTittle">风机频率</div>
                            <div class="outDiv" style="padding-top: 10px">
                                <div id="fanFreq" style="width: 240px; height: 240px"></div>
                            </div>
                        </dv-border-box7> -->
                        <dv-border-box7 class="infoChart" style="margin-left: 0px;">
                            <div class="chartTittle">含水率</div>
                            <div class="outDiv" style="padding-top: 20px">
                                <div class="leftData">
                                    <div class="center" style="height: 50%">
                                        <div class="centerText">
                                            <div class="mainInfo3"
                                                ><span>{{ realData?.target }}</span
                                                > %
                            <dv-border-box7 class="infoChart" style="margin-left: 0px">
                                <div class="chartTittle">含水率</div>
                                <div class="outDiv" style="padding-top: 20px">
                                    <div class="leftData">
                                        <div class="center" style="height: 50%">
                                            <div class="centerText">
                                                <div class="mainInfo3"
                                                    ><span>{{ realData?.target }}</span> %
                                                </div>
                                                <div class="subhead2">目标含水率</div>
                                            </div>
                                            <div class="subhead2">目标含水率</div>
                                        </div>
                                        <div class="center" style="height: 50%">
                                            <div>
                                                <div class="mainInfo3"
                                                    ><span>{{ realData?.initial }}</span> %</div
                                                >
                                                <div class="subhead2">来料含水率</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="center" style="height: 50%">
                                        <div>
                                            <div class="mainInfo3"
                                                ><span>{{ realData?.initial }}</span
                                                > %</div
                                    <div id="moisture" style="width: 170px; height: 170px"></div>
                                </div>
                                <div class="subhead2" style="margin-top: -37px; padding-left: 205px; font-weight: bold">实时含水率</div>
                            </dv-border-box7>
                        </div>
                        <dv-border-box7 class="leftTop">
                            <div class="leftTop0">
                                <div class="leftTop1">
                                    <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                                    <div>
                                        <div class="mainInfo">{{ realData?.totalRemain | 0 }} Min</div>
                                        <div class="subhead">剩余时间</div>
                                    </div>
                                </div>
                                <div class="leftTop1">
                                    <Icon icon="bi:fan" :size="50" />
                                    <div>
                                        <div class="mainInfo">{{ realData.trendVo?.fanFrequency | 0 }} Hz</div>
                                        <div class="subhead">风机频率</div>
                                    </div>
                                </div>
                                <div class="leftTop3" :style="{ 'background-image': 'url(' + getStatusImageUrl(statusGif) + ')' }"></div>
                                <div class="outDiv eqpStatus">
                                    <div
                                        style="
                                            font-size: 28px;
                                            margin-top: 190px;
                                            color: white;
                                            background-color: #1595ea;
                                            height: 60px;
                                            width: 180px;
                                            line-height: 60px;
                                            text-align: center;
                                            border-radius: 5px;
                                            font-weight: bold;
                                        "
                                    >
                                        {{ statusTxt }}
                                    </div>
                                    <div
                                        v-if="realData?.isError"
                                        class="eqpInfoText blingbling"
                                        style="
                                            position: absolute;
                                            font-size: 30px;
                                            max-height: 200px;
                                            max-width: 720px;
                                            border-radius: 10px;
                                            background-color: #ce0000;
                                            color: white;
                                            padding: 10px;
                                        "
                                    >
                                        <div class="outDiv">
                                            <div><Icon icon="bx:error" :size="30" /> </div>
                                            <div
                                                ><span>{{ realData?.errorMsg }}</span></div
                                            >
                                            <div class="subhead2">来料含水率</div>
                                        </div>
                                    </div>
                                </div>
                                <div id="moisture" style="width: 170px; height: 170px"></div>
                            </div>
                            <div class="subhead2" style="margin-top: -37px; padding-left: 205px; font-weight: bold;">实时含水率</div>
                        </dv-border-box7>
                </div>
                    <dv-border-box7 class="leftTop">
                        <div class="leftTop0">
                        <div class="leftTop1">
                            <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                            <div>
                                <div class="mainInfo">{{ realData?.totalRemain | 0 }} Min</div>
                                <div class="subhead">剩余时间</div>
                            </div>
                        </div>
                        <div class="leftTop1">
                            <Icon icon="bi:fan" :size="50" />
                            <div>
                                <div class="mainInfo">{{ realData.trendVo?.fanFrequency | 0 }} Hz</div>
                                <div class="subhead">风机频率</div>
                            </div>
                        </div>
                        <div class="leftTop3" :style="{ 'background-image': 'url(' + getStatusImageUrl(statusGif) + ')' }"></div>
                        <div class="outDiv eqpStatus">
                            <div
                                style="
                                    font-size: 28px;
                                    margin-top: 190px;
                                    color: white;
                                    background-color: #1595ea;
                                    height: 60px;
                                    width: 180px;
                                    line-height: 60px;
                                    text-align: center;
                                    border-radius: 5px;
                                    font-weight: bold;
                                "
                            >
                            {{ statusTxt }}
                            </div>
                            <div v-if="realData?.isError"
                                class="eqpInfoText blingbling"
                                style="
                                    position: absolute;
                                    font-size: 30px;
                                    max-height: 200px;
                                    max-width: 720px;
                                    border-radius: 10px;
                                    background-color: #ce0000;
                                    color: white;
                                    padding: 10px;
                                "
                            >
                                <div class="outDiv">
                                    <div><Icon icon="bx:error" :size="30" /> </div>
                                    <div><span>{{realData?.errorMsg}}</span></div>
                                </div>
                            </div>
                        </div>
                        </div>
                    </dv-border-box7>
                    <dv-border-box7 class="infoChart" style="margin-left: 0px; margin-right: 10px;">
                        <dv-border-box7 class="infoChart" style="margin-left: 0px; margin-right: 10px">
                            <div class="chartTittle">风箱温度</div>
                            <div class="outDiv">
                                <div id="bellowsTemp" style="width: 230px; height: 230px">
@@ -146,17 +150,17 @@
                                </div>
                            </div>
                        </dv-border-box7>
                    <dv-border-box7 class="leftMid">
                        <div class="chartTittle">实时进度</div>
                        <div id="efficiencyLine" style="width: 848px; height: 180px;margin-top: -10px;"></div>
                        <div style="height: 10px; display: flex; width: 848px; padding: 0 60px; justify-content: space-between">
                            <div style="width: 100px; height: 20px">0 min</div>
                            <div style="width: 100px; height: 20px; text-align: right">{{ realData?.totalTime | 0 }} min</div>
                        </div>
                        <div id="progressBar" style="width: 848px; height: 80px"></div>
                    </dv-border-box7>
                        <dv-border-box7 class="leftMid">
                            <div class="chartTittle">实时进度</div>
                            <div id="efficiencyLine" style="width: 848px; height: 180px; margin-top: -10px"></div>
                            <div style="height: 10px; display: flex; width: 848px; padding: 0 60px; justify-content: space-between">
                                <div style="width: 100px; height: 20px">0 min</div>
                                <div style="width: 100px; height: 20px; text-align: right">{{ realData?.totalTime | 0 }} min</div>
                            </div>
                            <div id="progressBar" style="width: 848px; height: 80px"></div>
                        </dv-border-box7>

                    <!-- <div class="outDiv">
                        <!-- <div class="outDiv">
                        <div style="height: 100px; width: 400px">
                            <Progress
                                :stroke-color="{
@@ -173,181 +177,186 @@
                            </div>
                        </div>
                    </div> -->
                </div>
                <div class="rightInfo">
                    <div class="rightTop">
						
                        <dv-border-box7 class="tempMoisChart">
                            <div :id="'moisChart'" style="width: 690px; height: 420px"></div>
                        </dv-border-box7>
                    </div>
                    <div class="rightTwo">
                        <dv-border-box7 class="infoChart">
                            <div class="chartTittle">
                                å¹²ç‡¥æ•ˆçŽ‡(kg/h)
                                <div class="rightLabel">
                                    <div class="label good">&gt;{{ standard.xiaolv }} ä¼˜ </div>
                                    <div class="label bad">&lt;{{ standard.xlMin }} å·®</div>
                                </div>
                            </div>
                            <div class="outDiv" style="padding-top: 20px">
                                <div class="leftData">
                                    <div class="center" style="height: 50%">
                                        <div class="centerText">
                                            <div class="mainInfo3"
                                                ><span>{{ (realData?.originWeight - realData?.yield) | 0 }}</span
                                                > kg
                                            </div>
                                            <div class="subhead2">水分蒸发</div>
                                        </div>
                                    </div>
                                    <div class="center" style="height: 50%">
                                        <div>
                                            <div class="mainInfo3">{{ realData?.dryTime | 0 }} min</div>
                                            <div class="subhead2">干燥用时</div>
                                        </div>
                    <div class="rightInfo">
                        <div class="rightTop">
                            <dv-border-box7 class="tempMoisChart">
                                <div :id="'moisChart'" style="width: 690px; height: 420px"></div>
                            </dv-border-box7>
                        </div>
                        <div class="rightTwo">
                            <dv-border-box7 class="infoChart">
                                <div class="chartTittle">
                                    å¹²ç‡¥æ•ˆçŽ‡(kg/h)
                                    <div class="rightLabel">
                                        <div class="label good">&gt;{{ standard.xiaolv }} ä¼˜ </div>
                                        <div class="label bad">&lt;{{ standard.xlMin }} å·®</div>
                                    </div>
                                </div>
                                <div class="rightChart center">
                                    <div class="center compareBar">
                                        <div class="barTop">{{ standard.xiaolv }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :style="{ height: realData?.xlsHeight }"></div>
                                        </div>
                                        <div style="line-height: 20px">
                                            é¢å®š
                                            <br />
                                            æ•ˆçŽ‡
                                        </div>
                                    </div>
                                    <div class="center compareBar">
                                        <div class="barTop">{{ realData?.xiaolv | 0 }}</div>
                                        <div class="barBack">
                                            <div
                                                class="barDiv"
                                                :class="{ good: realData?.xlgood, bad: realData?.xlbad }"
                                                :style="[realData?.xlrHeight && { height: realData?.xlrHeight }]"
                                            >
                                <div class="outDiv" style="padding-top: 20px">
                                    <div class="leftData">
                                        <div class="center" style="height: 50%">
                                            <div class="centerText">
                                                <div class="mainInfo3"
                                                    ><span>{{ (realData?.originWeight - realData?.yield) | 0 }}</span> kg
                                                </div>
                                                <div class="subhead2">水分蒸发</div>
                                            </div>
                                        </div>
                                        <div style="line-height: 20px">
                                            å®žæ—¶
                                            <br />
                                            æ•ˆçŽ‡
                                        <div class="center" style="height: 50%">
                                            <div>
                                                <div class="mainInfo3">{{ realData?.dryTime | 0 }} min</div>
                                                <div class="subhead2">干燥用时</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="rightChart center">
                                        <div class="center compareBar">
                                            <div class="barTop">{{ standard.xiaolv }}</div>
                                            <div class="barBack">
                                                <div class="barDiv" :style="{ height: realData?.xlsHeight }"></div>
                                            </div>
                                            <div style="line-height: 20px">
                                                é¢å®š
                                                <br />
                                                æ•ˆçŽ‡
                                            </div>
                                        </div>
                                        <div class="center compareBar">
                                            <div class="barTop">{{ realData?.xiaolv | 0 }}</div>
                                            <div class="barBack">
                                                <div
                                                    class="barDiv"
                                                    :class="{ good: realData?.xlgood, bad: realData?.xlbad }"
                                                    :style="[realData?.xlrHeight && { height: realData?.xlrHeight }]"
                                                >
                                                </div>
                                            </div>
                                            <div style="line-height: 20px">
                                                å®žæ—¶
                                                <br />
                                                æ•ˆçŽ‡
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </dv-border-box7>
					
					
						
						
                        <dv-border-box7 class="infoChart">
                            <div class="chartTittle"
                                >蒸汽消耗(m³/kg)
                                <div class="rightLabel">
                                    <div class="label bad">&gt;{{ standard.zhengqi }} å·®</div>
                                    <div class="label good">&lt;{{ standard.zqMin }} ä¼˜</div>
                            </dv-border-box7>

                            <dv-border-box7 class="infoChart">
                                <div class="chartTittle"
                                    >蒸汽消耗(m³/kg)
                                    <div class="rightLabel">
                                        <div class="label bad">&gt;{{ standard.zhengqi }} å·®</div>
                                        <div class="label good">&lt;{{ standard.zqMin }} ä¼˜</div>
                                    </div>
                                </div>
                            </div>
                            <div class="outDiv" style="padding-top: 20px">
                                <div class="leftData">
                                    <div class="center" style="height: 100%">
                                        <div class="centerText">
                                            <div class="mainInfo3"><span>{{realData?.steam}}</span> m³ </div>
                                            <div class="subhead2">蒸汽用量</div>
                                <div class="outDiv" style="padding-top: 20px">
                                    <div class="leftData">
                                        <div class="center" style="height: 100%">
                                            <div class="centerText">
                                                <div class="mainInfo3"
                                                    ><span>{{ realData?.steam }}</span> m³
                                                </div>
                                                <div class="subhead2">蒸汽用量</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="rightChart center">
                                        <div class="center compareBar">
                                            <div class="barTop">{{ standard.zhengqi }}</div>
                                            <div class="barBack">
                                                <div class="barDiv" :style="{ height: realData?.zqsHeight }"></div>
                                            </div>
                                            <div style="line-height: 20px">
                                                é¢å®š
                                                <br />
                                                æ¶ˆè€—
                                            </div>
                                        </div>
                                        <div class="center compareBar">
                                            <div class="barTop">{{ realData?.zhengqi | 0 }}</div>
                                            <div class="barBack">
                                                <div
                                                    class="barDiv"
                                                    :class="{ good: realData?.zqgood, bad: realData?.zqbad }"
                                                    :style="[realData?.zqrHeight && { height: realData?.zqrHeight }]"
                                                >
                                                </div>
                                            </div>
                                            <div style="line-height: 20px">
                                                å®žæ—¶
                                                <br />
                                                æ¶ˆè€—
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="rightChart center">
                                    <div class="center compareBar">
                                        <div class="barTop">{{standard.zhengqi}}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :style="{ height: realData?.zqsHeight }"></div>
                                        </div>
                                        <div style="line-height: 20px">
                                            é¢å®š
                                            <br />
                                            æ¶ˆè€—
                            </dv-border-box7>
                            <dv-border-box7 class="infoChart">
                                <div class="chartTittle">效率对比</div>
                                <div class="outDiv" style="padding-top: 10px">
                                    <div id="compare" style="width: 300px; height: 250px"></div>
                                </div>
                            </dv-border-box7>
                            <dv-border-box7 class="infoChart">
                                <div class="chartTittle">
                                    <div> ç”µèƒ½æ¶ˆè€—(kWh/kg)</div>
                                    <div class="rightLabel">
                                        <div class="label bad">&gt;{{ standard.dian }} å·®</div>
                                        <div class="label good">&lt;{{ standard.dMin }} ä¼˜</div>
                                    </div>
                                </div>
                                <div class="outDiv" style="padding-top: 20px">
                                    <div class="leftData">
                                        <div class="center" style="height: 100%">
                                            <div class="centerText">
                                                <div class="mainInfo3"
                                                    ><span>{{ realData?.watt }}</span> kWh
                                                </div>
                                                <div class="subhead2">电能用量</div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="center compareBar">
                                        <div class="barTop">{{realData?.zhengqi | 0 }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :class="{ good: realData?.zqgood, bad: realData?.zqbad }"
                                                :style="[realData?.zqrHeight && { height: realData?.zqrHeight }]"> </div>
                                    <div class="rightChart center">
                                        <div class="center compareBar">
                                            <div class="barTop">{{ standard.dian }}</div>
                                            <div class="barBack">
                                                <div class="barDiv" :style="{ height: realData?.dnsHeight }"></div>
                                            </div>
                                            <div style="line-height: 20px">
                                                é¢å®š
                                                <br />
                                                æ¶ˆè€—
                                            </div>
                                        </div>
                                        <div style="line-height: 20px">
                                            å®žæ—¶
                                            <br />
                                            æ¶ˆè€—
                                        <div class="center compareBar">
                                            <div class="barTop">{{ realData?.dian | 0 }}</div>
                                            <div class="barBack">
                                                <div
                                                    class="barDiv"
                                                    :class="{ good: realData?.dngood, bad: realData?.dnbad }"
                                                    :style="[realData?.dnrHeight && { height: realData?.dnrHeight }]"
                                                ></div>
                                            </div>
                                            <div style="line-height: 20px">
                                                å®žæ—¶
                                                <br />
                                                æ¶ˆè€—
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </dv-border-box7>
                        <dv-border-box7 class="infoChart" >
                            <div class="chartTittle">效率对比</div>
                            <div class="outDiv" style="padding-top: 10px">
                                <div id="compare" style="width: 300px; height: 250px"></div>
                            </div>
                        </dv-border-box7>
                        <dv-border-box7 class="infoChart">
                            <div class="chartTittle">
                                <div> ç”µèƒ½æ¶ˆè€—(kWh/kg)</div>
                                <div class="rightLabel">
                                    <div class="label bad">&gt;{{ standard.dian }} å·®</div>
                                    <div class="label good">&lt;{{ standard.dMin }} ä¼˜</div>
                                </div>
                            </div>
                            <div class="outDiv" style="padding-top: 20px">
                                <div class="leftData">
                                    <div class="center" style="height: 100%">
                                        <div class="centerText">
                                            <div class="mainInfo3"><span>{{realData?.watt}}</span> kWh </div>
                                            <div class="subhead2">电能用量</div>
                                        </div>
                                    </div>
                                </div>
                                <div class="rightChart center">
                                    <div class="center compareBar">
                                        <div class="barTop">{{standard.dian}}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :style="{ height: realData?.dnsHeight }"></div>
                                        </div>
                                        <div style="line-height: 20px">
                                            é¢å®š
                                            <br />
                                            æ¶ˆè€—
                                        </div>
                                    </div>
                                    <div class="center compareBar">
                                        <div class="barTop">{{realData?.dian | 0}}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :class="{ good: realData?.dngood, bad: realData?.dnbad }"
                                                :style="[realData?.dnrHeight && { height: realData?.dnrHeight }]"></div>
                                        </div>
                                        <div style="line-height: 20px">
                                            å®žæ—¶
                                            <br />
                                            æ¶ˆè€—
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </dv-border-box7>
						
                            </dv-border-box7>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</dv-full-screen-container>
    </dv-full-screen-container>
</template>

<script setup lang="ts">
  import { useFullscreen } from '@vueuse/core';
    import { useFullscreen } from '@vueuse/core'
    import { BorderBox7 as DvBorderBox7 } from '@kjgl77/datav-vue3'
    import { router } from '/@/router'
    import { onMounted, ref, onUnmounted } from 'vue'
@@ -356,19 +365,16 @@
    import 'echarts-liquidfill'
    import { Icon, IconPicker, SvgIcon } from '/@/components/Icon/index'
    import { defHttp } from '/@/utils/http/axios'
    import { queryById,listAll } from '../api/DryEquipment.api'
    import { queryById, listAll } from '../api/DryEquipment.api'
    import { dryEquipment } from '../dataDefine/DryEquipment.data'
    import { useUserStore } from '/@/store/modules/user'

	
    const domRef = ref<Nullable<HTMLElement>>(null)
    const { enter, toggle, exit, isFullscreen } = useFullscreen()


    const domRef = ref<Nullable<HTMLElement>>(null);
        const { enter, toggle, exit, isFullscreen } = useFullscreen();

const { toggle: toggleDom } = useFullscreen(domRef);
    const { toggle: toggleDom } = useFullscreen(domRef)
    const Timer = ref()
    const Timer2 = ref()
    const Timer2 = ref()
    const marks = ref<Record<number, any>>({
        0: '0°C',
        1: '',
@@ -472,10 +478,10 @@
        99: '',
        100: '100°C',
    })
    const eqps =  ref([] as dryEquipment[])
	
    const eqp = ref({} as dryEquipment)
    const eqpNum = ref(1)
    const eqps = ref([] as dryEquipment[])
    //console.log(`output->router.currentRoute.value.params.num `, router.currentRoute.value.query)
    const eqp = ref({} as dryEquipment)
    const eqpNum = ref(router.currentRoute.value.query.num || 1)
    const userStore = useUserStore()
    const realData = ref({})
    const standard = ref({
@@ -487,7 +493,7 @@
        dMin: 7.5,
    })

    const position = ref(1)
    const position = ref(1)
    //realData.value.tempValue = [0, 100]
    realData.value.mois = [0.5, 0.35, 0.2]
    statusGif = 'tmrefeng2'
@@ -526,9 +532,8 @@
                text: '含水率/温度趋势',
                textStyle: {
                    color: '#fff',
                    fontSize: 15
                    fontSize: 15,
                },
				
            },
            tooltip: {
                trigger: 'axis',
@@ -542,8 +547,8 @@
            legend: {
                right: 60,
                textStyle: {
                    color: '#fff'
                }
                    color: '#fff',
                },
            },
            // toolbox: {
            //     show: true,
@@ -559,8 +564,8 @@
            // },
            xAxis: {
                type: 'value',
                axisLabel:{
                    color: '#fff'
                axisLabel: {
                    color: '#fff',
                },
                //boundaryGap: false,
                // data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
@@ -575,22 +580,22 @@
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: ['#2b2b2b']
                    }
                }
                        color: ['#2b2b2b'],
                    },
                },
            },
            yAxis: {
                type: 'value',
                boundaryGap: ['10%', '10%'],
                axisLabel:{
                    color: '#fff'
                axisLabel: {
                    color: '#fff',
                },
                splitLine: {
                    lineStyle: {
                        type: 'dashed',
                        color: ['#2b2b2b']
                    }
                }
                        color: ['#2b2b2b'],
                    },
                },
                // min: 0,
                // max: function (value) {
                //     if (value.max < 100) {
@@ -625,15 +630,15 @@
                    areaStyle: {
                        opacity: 0.2,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        {
                            offset: 0,
                            color: 'rgb(128, 255, 165)'
                        },
                        {
                            offset: 1,
                            color: 'rgb(1, 191, 236)'
                        }
                        ])
                            {
                                offset: 0,
                                color: 'rgb(128, 255, 165)',
                            },
                            {
                                offset: 1,
                                color: 'rgb(1, 191, 236)',
                            },
                        ]),
                    },
                },
                {
@@ -651,15 +656,15 @@
                    areaStyle: {
                        opacity: 0.2,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        {
                            offset: 0,
                            color: 'rgb(255, 0, 135)'
                        },
                        {
                            offset: 1,
                            color: 'rgb(135, 0, 157)'
                        }
                        ])
                            {
                                offset: 0,
                                color: 'rgb(255, 0, 135)',
                            },
                            {
                                offset: 1,
                                color: 'rgb(135, 0, 157)',
                            },
                        ]),
                    },
                    // markLine: {
                    //     data: [
@@ -694,7 +699,7 @@
                    amplitude: 3,
                    animationDuration: 5,
                    //animationDurationUpdate: 0,
                    data: [0.56,0.44,0.32],
                    data: [0.56, 0.44, 0.32],
                    shape:
                        'path://M828.817,706.209C828.817,881.725,686.98,1024,512,1024c-174.98,0-316.817-142.275-316.817-317.791C195.183,530.74,512,0,512,0s316.817,530.74,316.817,706.209z',
                    outline: {
@@ -1109,8 +1114,8 @@
            legend: {
                right: 60,
                textStyle: {
                    color: '#fff'
                }
                    color: '#fff',
                },
            },
            xAxis: {
                show: false,
@@ -1160,18 +1165,18 @@
                        ],
                    },
                    markLine: {
                                    symbol: 'none',
                                    data: [
                                        {
                                            name: '额定',
                                            yAxis: standard.value.xiaolv,
                                        },
                                    ],
                                    label: {
                                        formatter: '{b}\n{c}',
                                        color: '#fff'
                                    },
                                },
                        symbol: 'none',
                        data: [
                            {
                                name: '额定',
                                yAxis: standard.value.xiaolv,
                            },
                        ],
                        label: {
                            formatter: '{b}\n{c}',
                            color: '#fff',
                        },
                    },
                    // markLine: {
                    //     data: [{ type: 'average', name: 'Avg' }],
                    // },
@@ -1180,32 +1185,29 @@
        }

        const compareOption = {
					
            tooltip: {
                trigger: 'axis',
			
            },
            grid: {
                top: '6%',
                left: '3%',
                right: '10%',
                bottom: '3%',
                containLabel: true
                containLabel: true,
            },
            xAxis: {
                show: false,
                type: 'value',
			
            },
            yAxis: {
                axisLine: {
                    show:false,
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                type: 'category',
                data: ['1#', '2#', '3#', '4#', '5#', '6#']
                data: ['1#', '2#', '3#', '4#', '5#', '6#'],
            },
            series: [
                {
@@ -1217,13 +1219,12 @@
                        show: true,
                        position: 'right',
                        valueAnimation: true,
						
                        color: '#fff' 
                    }
                },
            ]
        }

                        color: '#fff',
                    },
                },
            ],
        }

        option && moisChart.setOption(option)
        waterOption && waterChart.setOption(waterOption)
@@ -1236,14 +1237,14 @@
    }

    // åŠ¨æ€è¯»å–图片
function getHerbImageUrl(name: string) {
  return new URL(`/src/assets/images/dry/yaocai/${name}`, import.meta.url).href;
}
    function getHerbImageUrl(name: string) {
        return new URL(`/src/assets/images/dry/yaocai/${name}`, import.meta.url).href
    }

    // åŠ¨æ€è¯»å–图片
    function getStatusImageUrl(name: string) {
  return new URL(`/src/assets/images/dry/${name}.gif`, import.meta.url).href;
}
        return new URL(`/src/assets/images/dry/${name}.gif`, import.meta.url).href
    }
    function queryEqp() {
        queryById({ id: router.currentRoute.value.params.id }).then((res) => {
            // console.log(`output->res`, res)
@@ -1253,7 +1254,7 @@
        })
    }

    function listAllEqp() {
    function listAllEqp() {
        listAll({ enable: 'Y' })
            .then((result) => {
                //console.log(`output->result`, result)
@@ -1262,168 +1263,181 @@
                //     eqpCodes.push(item.code)
                // })
                queryRealTime()
            setTimeout(initCharts, 500)
				
                setTimeout(initCharts, 500)
            })
            .catch((err) => {
                //console.log(`output->err`, err)
            })
    }


    var num = eqpNum.value;
    var num = eqpNum.value

    function changeEqp() {
        //console.log("changeEqp::",eqps.value.length);
        num ++;
     if (eqps.value.length > 0) {
            var i = num%eqps.value.length
            //eqp.value = eqps.value[i]
          //  console.log("777",i);
            eqpNum.value = i;
            //console.log("888",eqp.value);
            queryRealTime()
        num++
        if (eqps.value.length > 0) {
            var i = num % eqps.value.length
            //eqp.value = eqps.value[i]
            //  console.log("777",i);
            eqpNum.value = i
            //console.log("888",eqp.value);
            queryRealTime()
            //setTimeout(initCharts, 500)
        }
        
        }
    }

    // function queryEqpsReal() {
        
    //     if (eqps.value.length > 0) {
    //         var i = num%eqps.value.length
    //         eqp.value = eqps[i]
    //         console.log("777",i);
    //         console.log("888",eqp.value);
    //         queryRealTime()
    //         //setTimeout(initCharts, 500)
    //     }
    //     num ++;
    // }
    // function queryEqpsReal() {

    var shangliaoFlag = false;
    var statusGif = 'tmrefeng2';
    //     if (eqps.value.length > 0) {
    //         var i = num%eqps.value.length
    //         eqp.value = eqps[i]
    //         console.log("777",i);
    //         console.log("888",eqp.value);
    //         queryRealTime()
    //         //setTimeout(initCharts, 500)
    //     }
    //     num ++;
    // }

    var shangliaoFlag = false
    var statusGif = 'tmrefeng2'
    var statusTxt = '正在干燥'

    function chaiwangban() {
        statusGif = 'chaiwangban-1'
        setTimeout(shangliao,7000)
					
        setTimeout(shangliao, 7000)
    }

    function shangliao() {
        statusGif = "shangliao-N"
        setTimeout(()=>{
            statusGif = "zhuangwangban"
            setTimeout(()=>{
                statusGif = "guanmen1"
                setTimeout(()=>{
        statusGif = 'shangliao-N'
        setTimeout(() => {
            statusGif = 'zhuangwangban'
            setTimeout(() => {
                statusGif = 'guanmen1'
                setTimeout(() => {
                    shangliaoFlag = false
                },4000)
				
            },7000)
        },15000)
                }, 4000)
            }, 7000)
        }, 15000)
    }


    function queryRealTime() {

        if (eqp.value) {
        eqp.value = eqps.value[eqpNum.value]
       // console.log("888",eqp.value);
        let tenantId = 1003
        let eqpCode = eqp.value.code
        let queryRealTimeUrl = '/dry/real/getRealTimeData'
        defHttp.get({ url: queryRealTimeUrl, params: { tenantid: tenantId, machineid: eqpCode} }).then((res) => {
			
            if (res && res.trendVo) {
                //console.log(`output->re11s`, res)
                //    res.tempValue = [res.windTemp, 100]
                //res.percent = ((res.dryTime / res.et) * 100).toFixed(2)
                /**水滴图含水量 */
                res.mois = [
                    (res.trendVo.moisture / 100).toFixed(2),
                    (res.trendVo.moisture / 100 / 1.5).toFixed(2),
                    (res.trendVo.moisture / 100 / 3).toFixed(2),
                ]
                if (waterChart) {
                    waterChart.setOption({
                        series: [
                            {
                                data: res.mois,
                                label: {
                                    formatter: function () {
                                        return res.trendVo.moisture + '%'
        if (eqp.value) {
            eqp.value = eqps.value[eqpNum.value]
            // console.log("888",eqp.value);
            let tenantId = 1003
            let eqpCode = eqp.value.code
            let queryRealTimeUrl = '/dry/real/getRealTimeData'
            defHttp.get({ url: queryRealTimeUrl, params: { tenantid: tenantId, machineid: eqpCode } }).then((res) => {
                if (res && res.trendVo) {
                    //console.log(`output->re11s`, res)
                    //    res.tempValue = [res.windTemp, 100]
                    //res.percent = ((res.dryTime / res.et) * 100).toFixed(2)
                    /**水滴图含水量 */
                    res.mois = [
                        (res.trendVo.moisture / 100).toFixed(2),
                        (res.trendVo.moisture / 100 / 1.5).toFixed(2),
                        (res.trendVo.moisture / 100 / 3).toFixed(2),
                    ]
                    if (waterChart) {
                        waterChart.setOption({
                            series: [
                                {
                                    data: res.mois,
                                    label: {
                                        formatter: function () {
                                            return res.trendVo.moisture + '%'
                                        },
                                        fontSize: 20,
                                    },
                                    fontSize: 20,
                                },
                            },
                        ],
                    })
                }
                            ],
                        })
                    }

                /**温度环形图 */
                if (bellowsTempChart) {
                    bellowsTempChart.setOption({
                        series: [{ data: [{ value: res.windTemp }] }, { data: [{ value: res.windTemp }] }],
                    })
                }
                /**风机频率环形图 */
                // if (fanFreqChart) {
                //     fanFreqChart.setOption({
                //         series: [
                //             {
                //                 data: [
                //                     {
                //                         value: res.trendVo.fanFrequency,
                //                     },
                //                 ],
                //             },
                //         ],
                //     })
                // }
                /**干燥进度、走势与阶段效率和阶段消耗 */
                if (res && res.detailList) {
                    var progressSeries = []
                    var ganZaoXiaoLv = []
                    var zhengQiXiaoHao = []
                    var dianNengXiaoHao = []
                    var totalTime = 0
                    var beforeWeight = 0
                    res.moisList = []
                    beforeWeight = res.originWeight
                    //console.log(`output->res`, res)
                    res.detailList.forEach((item) => {
                        //console.log(`output->bef`, beforeWeight)
                        //console.log(`output->cur`, item.weight)
                        res.moisList.push([item.totalTime, item.moisture])
                        //console.log(`output->totalTime,item.totalTime`, totalTime, item.totalTime)
                        var curDryTime = item.totalTime - totalTime
                    /**温度环形图 */
                    if (bellowsTempChart) {
                        bellowsTempChart.setOption({
                            series: [{ data: [{ value: res.windTemp }] }, { data: [{ value: res.windTemp }] }],
                        })
                    }
                    /**风机频率环形图 */
                    // if (fanFreqChart) {
                    //     fanFreqChart.setOption({
                    //         series: [
                    //             {
                    //                 data: [
                    //                     {
                    //                         value: res.trendVo.fanFrequency,
                    //                     },
                    //                 ],
                    //             },
                    //         ],
                    //     })
                    // }
                    /**干燥进度、走势与阶段效率和阶段消耗 */
                    if (res && res.detailList) {
                        var progressSeries = []
                        var ganZaoXiaoLv = []
                        var zhengQiXiaoHao = []
                        var dianNengXiaoHao = []
                        var totalTime = 0
                        var beforeWeight = 0
                        res.moisList = []
                        beforeWeight = res.originWeight
                        //console.log(`output->res`, res)
                        res.detailList.forEach((item) => {
                            //console.log(`output->bef`, beforeWeight)
                            //console.log(`output->cur`, item.weight)
                            res.moisList.push([item.totalTime, item.moisture])
                            //console.log(`output->totalTime,item.totalTime`, totalTime, item.totalTime)
                            var curDryTime = item.totalTime - totalTime

                        if (curDryTime > 0) {
                            if (curDryTime > 0) {
                                progressSeries.push({
                                    name: item.moisture,
                                    type: 'bar',
                                    stack: 'total',
                                    label: {
                                        show: true,
                                    },
                                    emphasis: {
                                        focus: 'series',
                                    },
                                    data: [item.totalTime - totalTime],
                                })
                                ganZaoXiaoLv.push([curDryTime / 2 + totalTime, (((beforeWeight - item.weight) / curDryTime) * 60).toFixed(1)])

                                totalTime = item.totalTime
                            }
                            beforeWeight = item.weight
                        })

                        if (res.remain) {
                            if (res.dryTime - totalTime > 0) {
                                progressSeries.push({
                                    name: '当前',
                                    type: 'bar',
                                    stack: 'total',
                                    label: {
                                        show: true,
                                    },
                                    emphasis: {
                                        focus: 'series',
                                    },
                                    data: [
                                        {
                                            value: res.dryTime - totalTime,
                                        },
                                    ],
                                })
                            }

                            // ganZaoXiaoLv.push([totalTime + res.remain,standard.value.xiaolv])

                            res.totalRemain = res.remain - (res.dryTime - totalTime) > 0 ? res.remain - (res.dryTime - totalTime) : 0
                            progressSeries.push({
                                name: item.moisture,
                                type: 'bar',
                                stack: 'total',
                                label: {
                                    show: true,
                                },
                                emphasis: {
                                    focus: 'series',
                                },
                                data: [item.totalTime - totalTime],
                            })
                            ganZaoXiaoLv.push([curDryTime / 2 + totalTime, (((beforeWeight - item.weight) / curDryTime) * 60).toFixed(1)])

                            totalTime = item.totalTime
                        }
                        beforeWeight = item.weight
                    })

                    if (res.remain) {
                        if (res.dryTime - totalTime > 0) {
                            progressSeries.push({
                                name: '当前',
                                name: '剩余',
                                type: 'bar',
                                stack: 'total',
                                label: {
@@ -1434,308 +1448,282 @@
                                },
                                data: [
                                    {
                                        value: res.dryTime - totalTime,
                                        value: res.remain - (res.dryTime - totalTime),
                                        itemStyle: {
                                            color: '#c0c0c0',
                                        },
                                    },
                                ],
                            })
                        }

                        // ganZaoXiaoLv.push([totalTime + res.remain,standard.value.xiaolv])

                        res.totalRemain = res.remain - (res.dryTime - totalTime)>0?res.remain - (res.dryTime - totalTime):0
                        progressSeries.push({
                            name: '剩余',
                            type: 'bar',
                            stack: 'total',
                            label: {
                                show: true,
                            },
                            emphasis: {
                                focus: 'series',
                            },
                            data: [
                        /**干燥进度 */
                        if (progressBarChart) {
                            //console.log(`output->progressSeries`, progressSeries)
                            progressBarChart.setOption(
                                {
                                    value: res.remain - (res.dryTime - totalTime),
                                    itemStyle: {
                                        color: '#c0c0c0',
                                    xAxis: {
                                        max: totalTime + res.remain,
                                    },
                                    series: progressSeries,
                                },
                            ],
                        })
                                { replaceMerge: ['series'] }
                            )
                        }



                    }

                    /**干燥进度 */
                    if (progressBarChart) {
                        //console.log(`output->progressSeries`, progressSeries)
                        progressBarChart.setOption(
                            {
                        res.totalTime = totalTime + res.remain
                        /**干燥效率、消耗 */
                        if (efficiencyLineChart) {
                            //console.log(`output->ganZaoXiaoLv`, ganZaoXiaoLv)
                            efficiencyLineChart.setOption({
                                xAxis: {
                                    max: totalTime + res.remain,
                                },
                                series: progressSeries,
                            },
                            { replaceMerge: ['series'] }
                        )
                                series: [
                                    {
                                        data: ganZaoXiaoLv,
                                        markLine: {
                                            symbol: 'none',
                                            data: [
                                                {
                                                    name: '额定',
                                                    yAxis: standard.value.xiaolv,
                                                },
                                            ],
                                            label: {
                                                formatter: '{b}\n{c}',
                                                color: '#fff',
                                            },
                                        },
                                    },
                                    { data: zhengQiXiaoHao },
                                    { data: dianNengXiaoHao },
                                ],
                            })
                        }

                        res.moisList.push([res.dryTime, res.trendVo.moisture])
                    }

                    res.totalTime = totalTime + res.remain
                    /**干燥效率、消耗 */
                    if (efficiencyLineChart) {
                        //console.log(`output->ganZaoXiaoLv`, ganZaoXiaoLv)
                        efficiencyLineChart.setOption({
                            xAxis: {
                                max: totalTime + res.remain,
                            },
                            series: [{ data: ganZaoXiaoLv,
                            markLine: {
                                symbol: 'none',
                                    data: [
                                        {
                                            name: '额定',
                                            yAxis: standard.value.xiaolv,
                    /**温度趋势 */
                    if (res && res.bellowsTemp) {
                        Array.from(Object.entries(res.bellowsTemp))
                        var arr = Object.keys(res.bellowsTemp)
                        var temArr = []
                        arr.forEach((item) => {
                            temArr.push([item * 1, res.bellowsTemp[item]])
                        })

                        //console.log(`output->arr` + JSON.stringify(temArr))
                        res.tempArr = temArr
                    }

                    /**干燥过程趋势 */
                    if (moisChart) {
                        //console.log(`output->更新chart`)
                        moisChart.setOption({
                            series: [
                                {
                                    data: res.moisList,
                                    markLine: {
                                        symbol: 'none',
                                        data: [
                                            {
                                                name: '目标',
                                                yAxis: res.target,
                                            },
                                        ],
                                        label: {
                                            formatter: '{b}\n{c}%',
                                            color: '#fff',
                                        },
                                    ],
                                    label: {
                                        formatter: '{b}\n{c}',
                                        color: '#fff'
                                    },
                            } },
                             { data: zhengQiXiaoHao },
                              { data: dianNengXiaoHao }],
                                },
                                {
                                    data: res.tempArr,
                                },
                            ],
                        })
                    }

                    res.moisList.push([res.dryTime, res.trendVo.moisture])
                }

                /**温度趋势 */
                if (res && res.bellowsTemp) {
                    Array.from(Object.entries(res.bellowsTemp))
                    var arr = Object.keys(res.bellowsTemp)
                    var temArr = []
                    arr.forEach((item) => {
                        temArr.push([item * 1, res.bellowsTemp[item]])
                    })

                    //console.log(`output->arr` + JSON.stringify(temArr))
                    res.tempArr = temArr
                }

                /**干燥过程趋势 */
                if (moisChart) {
                    //console.log(`output->更新chart`)
                    moisChart.setOption({
                        series: [
                            {
                                data: res.moisList,
                                markLine: {
                                    symbol: 'none',
                                    data: [
                                        {
                                            name: '目标',
                                            yAxis: res.target,
                                        },
                                    ],
                                    label: {
                                        formatter: '{b}\n{c}%',
                                        color: '#fff'
                                    },
                                },
                            },
                            {
                                data: res.tempArr,
                            },
                        ],
                    })
                }

                /**效率对比图 */
                if( (res.originWeight - res.yield) <= 0) {
                    res.xiaolv =  standard.value.xiaolv + 6
                } else {
                    res.xiaolv = (((res.originWeight - res.yield) / res.dryTime) * 60).toFixed(2)
                }
				
                if (res.xiaolv > standard.value.xiaolv) {
                    res.xlgood = true
                    res.xlsHeight = (standard.value.xiaolv / res.xiaolv) * 100 + '%'
                    res.xlrHeight = '100%'
                } else if (res.xiaolv < standard.value.xlMin) {
                    res.xlbad = true
                    res.xlsHeight = '100%'
                    res.xlrHeight = (res.xiaolv / standard.value.xiaolv) * 100 + '%'
                } else {
                    res.xlsHeight = '100%'
                    res.xlrHeight = (res.xiaolv / standard.value.xiaolv) * 100 + '%'
                }


				
                /** è’¸æ±½æ¶ˆè€— */
                if( (res.originWeight - res.yield) <= 0) {
                    res.zhengqi = standard.value.zhengqi -3
                } else {
                    res.zhengqi = (res.steam / (res.originWeight - res.yield)).toFixed(1)
                }
                //console.log('zhengqi:', res.zhengqi);
                if (res.zhengqi > standard.value.zhengqi) {
                    res.zqbad = true
                    res.zqsHeight = (standard.value.zhengqi / res.zhengqi) * 100 + '%'
                    res.zqrHeight = '100%'
                } else if (res.zhengqi < standard.value.zqMin) {
                    res.zqgood = true
                    res.zqsHeight = '100%'
                    res.zqrHeight = (res.zhengqi / standard.value.zhengqi) * 100 + '%'
                } else {
                    res.zqsHeight = '100%'
                    res.zqrHeight = (res.zhengqi / standard.value.zhengqi) * 100 + '%'
                }

				
				
                /** ç”µèƒ½æ¶ˆè€— */
                if( (res.originWeight - res.yield) <= 0) {
                    res.dian = standard.value.dian -1.5
                } else {
                    res.dian = (res.watt / (res.originWeight - res.yield)).toFixed(1)
                }
				
                if (res.dian > standard.value.dian) {
                    res.dnbad = true
                    res.dnsHeight = (standard.value.dian / res.dian) * 100 + '%'
                    res.dnrHeight = '100%'
                } else if (res.dian < standard.value.dMin) {
					
                    res.dngood = true
                    res.dnsHeight = '100%'
                    res.dnrHeight = (res.dian / standard.value.dian) * 100 + '%'
                } else {
                    res.dnsHeight = '100%'
                    res.dnrHeight = (res.dian / standard.value.dian) * 100 + '%'
                }

                console.log("state:::fan::", res.state_fan,"roller::", res.state_roller,"windbox::", res.state_windbox);
                console.log("===========================");
                //console.log("state:::state_windbox::", res.state_windbox);

                /**状态/gif动图 */
                if (!shangliaoFlag) {
                    if (res.orderStatus == 0) {
                    statusGif = 'zanting'
                    statusTxt = '准备'
                } else if (res.orderStatus == 1) {
                    shangliaoFlag = true
                    statusGif = 'kaimen1'
                    statusTxt = '上料'
                    setTimeout(chaiwangban,4000)
                } else if (res.orderStatus == 2) {
                    if(res.state_fan == 1) {
                        statusGif = 'tmrefeng2'
                        statusTxt = '正在干燥'
                    /**效率对比图 */
                    if (res.originWeight - res.yield <= 0) {
                        res.xiaolv = standard.value.xiaolv + 6
                    } else {
                        res.xiaolv = (((res.originWeight - res.yield) / res.dryTime) * 60).toFixed(2)
                    }

                    if(res.state_roller == 4) {
                        statusGif = 'fanliao-N'
                        statusTxt = '正在翻料'
                    if (res.xiaolv > standard.value.xiaolv) {
                        res.xlgood = true
                        res.xlsHeight = (standard.value.xiaolv / res.xiaolv) * 100 + '%'
                        res.xlrHeight = '100%'
                    } else if (res.xiaolv < standard.value.xlMin) {
                        res.xlbad = true
                        res.xlsHeight = '100%'
                        res.xlrHeight = (res.xiaolv / standard.value.xiaolv) * 100 + '%'
                    } else {
                        res.xlsHeight = '100%'
                        res.xlrHeight = (res.xiaolv / standard.value.xiaolv) * 100 + '%'
                    }

                    if (res.state_roller == 5) {
                        statusGif = 'chuliao-N'
                        statusTxt = '正在出料'
                    /** è’¸æ±½æ¶ˆè€— */
                    if (res.originWeight - res.yield <= 0) {
                        res.zhengqi = standard.value.zhengqi - 3
                    } else {
                        res.zhengqi = (res.steam / (res.originWeight - res.yield)).toFixed(1)
                    }
					
                    if (res.state_windbox == 2 || res.state_windbox == 3) {
                        statusGif = 'fengxiangsheng-1'
                        statusTxt = '正在干燥'
                    //console.log('zhengqi:', res.zhengqi);
                    if (res.zhengqi > standard.value.zhengqi) {
                        res.zqbad = true
                        res.zqsHeight = (standard.value.zhengqi / res.zhengqi) * 100 + '%'
                        res.zqrHeight = '100%'
                    } else if (res.zhengqi < standard.value.zqMin) {
                        res.zqgood = true
                        res.zqsHeight = '100%'
                        res.zqrHeight = (res.zhengqi / standard.value.zhengqi) * 100 + '%'
                    } else {
                        res.zqsHeight = '100%'
                        res.zqrHeight = (res.zhengqi / standard.value.zhengqi) * 100 + '%'
                    }
                } else if(res.orderStatus == 3) {
                    statusGif = 'zanting'
                    statusTxt = '暂停'
                } else if(res.orderStatus == 4) {
                    statusGif = 'zanting'
                    statusTxt = '干燥完成'
                }
                }
				
				

                if (compareChart) {
                    compareChart.setOption({
                        yAxis: {
                            data: res.compEqpNum
                        },
                        series: {
                            data: res.compEqpEffic
                    /** ç”µèƒ½æ¶ˆè€— */
                    if (res.originWeight - res.yield <= 0) {
                        res.dian = standard.value.dian - 1.5
                    } else {
                        res.dian = (res.watt / (res.originWeight - res.yield)).toFixed(1)
                    }

                    if (res.dian > standard.value.dian) {
                        res.dnbad = true
                        res.dnsHeight = (standard.value.dian / res.dian) * 100 + '%'
                        res.dnrHeight = '100%'
                    } else if (res.dian < standard.value.dMin) {
                        res.dngood = true
                        res.dnsHeight = '100%'
                        res.dnrHeight = (res.dian / standard.value.dian) * 100 + '%'
                    } else {
                        res.dnsHeight = '100%'
                        res.dnrHeight = (res.dian / standard.value.dian) * 100 + '%'
                    }

                    //console.log('state:::fan::', res.state_fan, 'roller::', res.state_roller, 'windbox::', res.state_windbox)
                    //console.log('===========================')
                    //console.log("state:::state_windbox::", res.state_windbox);

                    /**状态/gif动图 */
                    if (!shangliaoFlag) {
                        if (res.orderStatus == 0) {
                            statusGif = 'zanting'
                            statusTxt = '准备'
                        } else if (res.orderStatus == 1) {
                            shangliaoFlag = true
                            statusGif = 'kaimen1'
                            statusTxt = '上料'
                            setTimeout(chaiwangban, 4000)
                        } else if (res.orderStatus == 2) {
                            if (res.state_fan == 1) {
                                statusGif = 'tmrefeng2'
                                statusTxt = '正在干燥'
                            }

                            if (res.state_roller == 4) {
                                statusGif = 'fanliao-N'
                                statusTxt = '正在翻料'
                            }

                            if (res.state_roller == 5) {
                                statusGif = 'chuliao-N'
                                statusTxt = '正在出料'
                            }

                            if (res.state_windbox == 2 || res.state_windbox == 3) {
                                statusGif = 'fengxiangsheng-1'
                                statusTxt = '正在干燥'
                            }
                        } else if (res.orderStatus == 3) {
                            statusGif = 'zanting'
                            statusTxt = '暂停'
                        } else if (res.orderStatus == 4) {
                            statusGif = 'zanting'
                            statusTxt = '干燥完成'
                        }
                    })
                    }

                    if (compareChart) {
                        compareChart.setOption({
                            yAxis: {
                                data: res.compEqpNum,
                            },
                            series: {
                                data: res.compEqpEffic,
                            },
                        })
                    }

                    res.herbImage = 'yaocai1.png'

                    if (res.herbName == '白花蛇舌草') {
                        res.herbImage = 'baihuasheshecao.png'
                    } else if (res.herbName == '糥稻根') {
                        res.herbImage = 'nuodaogen.png'
                    } else if (res.herbName == '淫羊藿') {
                        res.herbImage = 'yinyanghuo.png'
                    } else if (res.herbName == '马齿苋') {
                        res.herbImage = 'machixian.png'
                    } else if (res.herbName == '墨旱莲') {
                        res.herbImage = 'mohanlian.png'
                    } else if (res.herbName == '桑白皮') {
                        res.herbImage = 'sangbaipi.png'
                    }
                    res.isError = false

                    res.errorMsg = '有一个故障，请检查。'
                } else {
                    res = {
                        mois: [],
                        gif: 'tmrefeng2',
                        herbImage: 'yaocai1.png',
                    }
                }

                res.herbImage = 'yaocai1.png'

                if (res.herbName == '白花蛇舌草') {
                    res.herbImage = 'baihuasheshecao.png'
                } else if (res.herbName == '糥稻根') {
                    res.herbImage = 'nuodaogen.png'
                } else if (res.herbName == '淫羊藿') {
                    res.herbImage = 'yinyanghuo.png'
                } else if (res.herbName == '马齿苋') {
                    res.herbImage = 'machixian.png'
                } else if (res.herbName == '墨旱莲') {
                    res.herbImage = 'mohanlian.png'
                } else if (res.herbName == '桑白皮') {
                    res.herbImage = 'sangbaipi.png'
                }
                res.isError = false

                res.errorMsg = '有一个故障，请检查。'
            } else {
                res = {
                    mois: [],
                    gif: 'tmrefeng2',
                    herbImage: 'yaocai1.png'
                }
            }
			
            //console.log(`output->res`, res)
            realData.value = res
        })
    }
                //console.log(`output->res`, res)
                realData.value = res
            })
        }
    }

    var move = true;
    function moveImage() {
       
        if (move) {
            position.value -= 0.3
        } else {
            position.value += 0.3
        }
        if(position.value < -240 ) {
            move = false
        }
        if (position.value > -1) {
            move = true
        }
    var move = true
    function moveImage() {
        if (move) {
            position.value -= 0.3
        } else {
            position.value += 0.3
        }
        if (position.value < -240) {
            move = false
        }
        if (position.value > -1) {
            move = true
        }
    }

        
    }
    function back() {
        router.back()
    }

    listAllEqp()
    listAllEqp()
    //queryEqp()
    // DOM挂载完成后渲染图表
    onMounted(() => {
        Timer.value = setInterval(queryRealTime, 3000)
        Timer2.value = setInterval(moveImage, 50)
        Timer2.value = setInterval(moveImage, 50)
    })

    onUnmounted(() => {
        clearInterval(Timer.value)
        clearInterval(Timer2.value)
        clearInterval(Timer2.value)
        Timer.value = null
        Timer2.value = null
        Timer2.value = null
    })
</script>

@@ -1748,12 +1736,12 @@
    .eqpImage {
        height: 1080px;
        width: 1920px;
         background-image: url(/src/assets/images/dry/bg.png);
        background-image: url(/src/assets/images/dry/bg.png);
        background-repeat: no-repeat;
        color: white;
        color: white;
        /*background-position: 160px 280px; */
        /* background-color: red; */
        background-size: 120%;
        background-size: 120%;
        padding: 10px;
        display: flex;
        flex-wrap: wrap;
@@ -1765,8 +1753,8 @@
        width: 1200px;
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
		
        align-content: flex-start;

        /* background-color: white;
        background-image: url(/src/assets/images/dry/shebei1.png);
        background-repeat: no-repeat;
@@ -1777,24 +1765,22 @@

    .leftTop {
        height: 750px;
    width: 850px;
    display: flex;
    justify-content: center;
    align-content: flex-start;
    background-image: url(/src/assets/images/dry/ganzaoji-x.png);
    background-repeat: no-repeat;
    background-size: 79%;
    border-radius: 10px;
    flex-wrap: wrap;
    background-position: 85px 279px;

        width: 850px;
        display: flex;
        justify-content: center;
        align-content: flex-start;
        background-image: url(/src/assets/images/dry/ganzaoji-x.png);
        background-repeat: no-repeat;
        background-size: 79%;
        border-radius: 10px;
        flex-wrap: wrap;
        background-position: 85px 279px;
    }
    .leftMid {
		
        width: 850px;
        height: 300px;
        /* border: 1px solid; */
        margin-top: 10px;
        margin-top: 10px;
        border-radius: 10px;
        /* background: white; */
    }
@@ -1802,7 +1788,7 @@
        line-height: 33px;
        padding-left: 10px;
        font-size: 30px;
        color: white;
        color: white;
    }
    .subhead {
        color: #a19f9c;
@@ -1858,7 +1844,6 @@
        align-items: center;
        font-size: 30px;
        color: #727272;
		
    }
    .leftTop2 {
        width: 250px;
@@ -1983,6 +1968,7 @@
    .curEqp {
        width: 340px;
        height: 170px;

        /* background: white;
        border-radius: 10px; */
    }
@@ -1992,7 +1978,7 @@
        height: 260px;
        /* background: white;
        border-radius: 10px; */
		

        background-repeat: no-repeat;
        background-size: 200px;
        background-position: 0px 10px;
@@ -2001,7 +1987,7 @@
        width: 690px;
        height: 440px;
        /* background: white; */
		

        padding: 20px;
        border-radius: 10px;
    }

 src/views/dry/bigScreen/BigWorkShop.vue

@@ -1,14 +1,366 @@
<template>
  <dv-full-screen-container>
     
  </dv-full-screen-container>
    <dv-full-screen-container>
        <div class="fbg">
            <div class="bgImage">
                <div class="head">
                    <div style="width: 600px; height: 50px"> <dv-decoration-8 style="width: 500px; height: 50px" /></div>

                    <div class="title">
                        <span>兰浦智能干燥车间</span>

                        <dv-decoration-5 :dur="20" style="margin-top: -40px; width: 700px; height: 80px" />
                    </div>
                    <div style="width: 600px; height: 50px; display: flex; justify-content: end">
                        <dv-decoration-8 :reverse="true" style="width: 500px; height: 50px"
                    /></div>
                </div>
                <div class="body">
                    <div class="humiture">
                        <div style="display: flex; width: 120px">
                            <Icon style="color: #f7b733" icon="solar:temperature-line-duotone" :size="28" />
                            &nbsp;
                            <div style="font-size: 20px; line-height: 26px"> 26 â„ƒ </div>
                        </div>
                        <div style="display: flex">
                            <Icon style="color: #f7b733" icon="material-symbols:humidity-percentage-outline" :size="28" />
                            &nbsp;
                            <div style="font-size: 20px; line-height: 26px"> 53 %rh </div>
                        </div>
                    </div>
                    <div class="up">
                        <div v-for="num in eqpNum" :key="num" :class="{ one: num === 1, two: num === 2, three: num === 3, four: num === 4 }">
                            <div class="eqpInfoup" @click="gotoeqp(num - 1)">
                                <div class="eqp-title">
                                    <div class="eqp-name">{{ eqpMap.get(eqpCodes[num - 1])?.name || '预留' }}</div>
                                    <!-- <div class="process"> </div> -->
                                    <Progress
                                        :stroke-color="{
                                            from: '#108ee9',
                                            to: '#87d068',
                                        }"
                                        :percent="parseFloat(realTime.get(eqpCodes[num - 1])?.percent || '0')"
                                        status="active"
                                        trailColor="#2b2b2b2b"
                                        :show-info="false"
                                    />
                                    <!-- <div class="eqp-name">50%</div> -->
                                </div>
                                <div class="eqp-info-up">
                                    <div class="herb">{{ realTime.get(eqpCodes[num - 1])?.herbName || '暂无' }}</div>
                                </div>
                                <div class="water">
                                    <div class="temp">
                                        <div style="line-height: 28px"><Icon style="color: #2a5a63" icon="ic:twotone-water-drop" :size="28" /> </div>
                                        <div class="font">
                                            <span class="value"> {{ realTime.get(eqpCodes[num - 1])?.trendVo.moisture || '0' }}</span> %
                                        </div>
                                    </div>
                                    <div class="temp">
                                        <div style="line-height: 28px"><Icon style="color: #6c5b7b" icon="solar:temperature-bold-duotone" :size="30" /> </div>
                                        <div class="font">
                                            <span class="value">{{ realTime.get(eqpCodes[num - 1])?.trendVo.bellowsTemp || '0' }} </span> â„ƒ
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="down">
                        <div v-for="num in eqpNum" :key="num" :class="{ one: num === 1, two: num === 2, three: num === 3, four: num === 4 }">
                            <div class="eqpInfodown" @click="gotoeqp(num + 3)">
                                <div class="eqp-info-down">
                                    <div class="herb">{{ realTime.get(eqpCodes[num + 3])?.herbName || '暂无' }}</div>
                                </div>
                                <div class="water">
                                    <div class="temp">
                                        <div style="line-height: 28px">
                                            <Icon style="color: #2a5a63" icon="ic:twotone-water-drop" :size="28" />
                                        </div>
                                        <div class="font">
                                            <span class="value">{{ realTime.get(eqpCodes[num + 3])?.trendVo.moisture || '0' }}</span> %
                                        </div>
                                    </div>
                                    <div class="temp">
                                        <div style="line-height: 28px"><Icon style="color: #6c5b7b" icon="solar:temperature-bold-duotone" :size="30" /> </div>
                                        <div class="font">
                                            <span class="value">{{ realTime.get(eqpCodes[num + 3])?.trendVo.bellowsTemp || '0' }}</span> â„ƒ
                                        </div>
                                    </div>
                                </div>

                                <div style="height: 70px"></div>
                                <div class="eqp-title">
                                    <!-- <div class="process"> </div> -->
                                    <Progress
                                        :stroke-color="{
                                            from: '#108ee9',
                                            to: '#87d068',
                                        }"
                                        :percent="parseFloat(realTime.get(eqpCodes[num + 3])?.percent || '0')"
                                        status="active"
                                        trailColor="#2b2b2b2b"
                                        :show-info="false"
                                    />
                                    <!-- <div class="eqp-name">50%</div> -->
                                    <div class="eqp-name-down">{{ eqpMap.get(eqpCodes[num + 3])?.name || '预留' }}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </dv-full-screen-container>
</template>

<script setup lang="ts">
    import { Progress } from 'ant-design-vue'
    import { onMounted, ref, onUnmounted } from 'vue'
    import { Icon, IconPicker, SvgIcon } from '/@/components/Icon/index'
    import { listAll } from '../api/DryEquipment.api'
    import { dryEquipment } from '../dataDefine/DryEquipment.data'
    import { router } from '/@/router'
    import { defHttp } from '/@/utils/http/axios'
    import { useUserStore } from '/@/store/modules/user'
    const eqpNum = ref(4)
    const eqpMap = ref(new Map())
    const eqpCodes = ref(['GM001', 'GM002', 'GM003', 'GM004', 'GM005', 'GM006'])
    const eqps = ref([] as dryEquipment[])

    const userStore = useUserStore()
    const Timer = ref()

    const realTime = ref(new Map())

    function listAllEqp() {
        listAll({ enable: 'Y' })
            .then((result) => {
                //console.log(`output->result`, result)
                eqps.value = result

                result.forEach((item) => {
                    eqpMap.value.set(item.code, item)
                })
                updateRealTime()
            })
            .catch((err) => {
                console.log(`output->err`, err)
            })
    }

    function updateRealTime() {
        //console.log(`output->定时刷新数据`)
        eqps.value.forEach((item) => {
            queryRealTime(item)
        })
    }

    function queryRealTime(eqp: dryEquipment) {
        let tenantId = userStore.getTenant
        let eqpCode = eqp.code
        let queryRealTimeUrl = '/dry/real/getRealTimeData'
        defHttp.get({ url: queryRealTimeUrl, params: { tenantid: tenantId, machineid: eqpCode } }).then((res) => {
            //console.log(`output->res`, res)
            if (res && res.trendVo) {
                res.tempValue = [res.windTemp, 100]
                res.percent = ((res.dryTime / (res.dryTime + res.remain)) * 100).toFixed(2)
            } else {
                res = {
                    tempValue: [0, 100],
                    percent: 0,
                    mois: [],
                }
            }

            realTime.value.set(eqp.code, res)
        })
    }
    function gotoeqp(num) {
        if (num < eqpCodes.value.length) {
            router.push({ path: '/bigEqp', query: { num: num } })
        }
    }

    listAllEqp()
    onMounted(() => {
        Timer.value = setInterval(updateRealTime, 3000)
    })

    onUnmounted(() => {
        clearInterval(Timer.value)
        Timer.value = null
    })
</script>

<style scoped>
    .fbg {
        height: 1080px;
        width: 1920px;
        background-image: url(/src/assets/images/dry/bg/bg5.png);
        background-repeat: no-repeat;
    }
    .bgImage {
        height: 1080px;
        width: 1920px;
        background-image: url(/src/assets/images/dry/bg/wksp2.png);
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: 0% 50%;
    }

</style>
    .head {
        display: flex;
        align-content: center;
        justify-content: center;
    }

    .body {
        height: 980px;
        width: 100%;
        margin-top: -100px;
        font-size: 20px;
    }
    .title {
        height: 200px;
        padding: 20px;
        font-size: 30px;
        font-weight: bold;
        text-align: center;
        color: white;
    }

    .humiture {
        height: 0px;
        justify-content: center;
        color: white;
        display: flex;
    }

    .up {
        padding-left: 100px;
        padding-top: 00px;
        display: flex;

        align-content: center;
        justify-content: flex-start;
    }
    .down {
        padding-left: 392px;
        margin-top: -334px;
        display: flex;

        align-content: center;
        justify-content: flex-start;
    }
    .eqpInfoup {
        width: 280px;
        height: 300px;
        margin: 0 41px;
        display: flex;
        flex-direction: column;
    }

    .eqpInfodown {
        width: 280px;
        height: 300px;
        margin: 0 41px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

    .one {
        margin-top: 280px;
    }

    .two {
        margin-top: 220px;
    }

    .three {
        margin-top: 160px;
    }

    .four {
        margin-top: 100px;
    }

    .eqp-title {
        height: 30px;
        border-radius: 20px;
        /* background: rgb(182, 182, 182);
        border: 1px solid green; */
        width: 100%;
    }

    .eqp-name {
        line-height: 30px;
        text-align: center;
        color: white;
        margin-top: -30px;
    }

    .eqp-name-down {
        line-height: 40px;
        text-align: center;
        color: white;
    }

    .process {
        width: 50%;
        height: 100%;
        overflow: hidden;
        border-radius: 20px;
        background: #3f4c6b;
    }

    .eqp-info-up {
        flex: 1;
        padding-top: 120px;
        display: flex;
    }

    .eqp-info-down {
        flex: 1;
        padding-top: 50px;
        display: flex;
    }

    .herb {
        height: 30px;
        background: #3f4c6b;
        color: white;
        line-height: 30px;
        padding: 0 10px;
    }
    .water {
        height: 120px;
        width: 110px;
        margin-left: 170px;
        display: flex;
        flex-wrap: wrap;
        align-content: space-evenly;
    }

    .temp {
        display: flex;
    }
    .font {
        line-height: 26px;
    }

    .value {
    }
    :deep() .progress {
        padding: 25px 25px;

        width: 360px;
        display: flex;
    }
    :deep() .ant-progress-bg {
        height: 25px !important;
    }
    :deep() .ant-progress-inner {
        background-color: rgb(197 197 197 / 52%) !important;
    }
</style>

 src/views/dry/common/prodRecordReport.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,18 @@
<template>
    <iframe :src="reportUrl" style="width: 100%; height: 100%"></iframe>
</template>

<script setup lang="ts">
    import { onMounted, ref } from 'vue'
    import { router } from '/@/router'
    console.log(`output->router1`, router)
    const reportUrl = ref('')
    reportUrl.value = window._CONFIG['domianURL'] + '/jmreport/view/833110227445567488?batch=' + router.currentRoute.value.query.batch
    //reportUrl.value = 'www.baidu.com'
    console.log(`output->reportUrl.value`, reportUrl.value)
    // onMounted(() => {
    //     console.log(`output->router`, router)
    // })
</script>

<style></style>

 src/views/dry/dataDefine/DryEqpType.data.ts

@@ -1,65 +1,65 @@
import { BasicColumn, FormSchema } from '/@/components/Table';
import { rules } from '/@/utils/helper/validator';
import { BasicColumn, FormSchema } from '/@/components/Table'
import { rules } from '/@/utils/helper/validator'
//列表数据
export const columns: BasicColumn[] = [
  {
    title: 'code',
    align: 'center',
    dataIndex: 'code',
  },
  {
    title: 'name',
    align: 'center',
    dataIndex: 'name',
  },
];
    {
        title: '编码',
        align: 'center',
        dataIndex: 'code',
    },
    {
        title: '名称',
        align: 'center',
        dataIndex: 'name',
    },
]
//查询数据
export const searchFormSchema: FormSchema[] = [
  {
    label: 'code',
    field: 'code',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    label: 'name',
    field: 'name',
    component: 'Input',
    colProps: { span: 6 },
  },
];
    {
        label: '编码',
        field: 'code',
        component: 'Input',
        colProps: { span: 6 },
    },
    {
        label: '名称',
        field: 'name',
        component: 'Input',
        colProps: { span: 6 },
    },
]
//表单数据
export const formSchema: FormSchema[] = [
  {
    label: 'code',
    field: 'code',
    component: 'Input',
    dynamicRules: ({ model, schema }) => {
      return [{ required: true, message: '请输入code!' }, { ...rules.duplicateCheckRule('dry_eqp_type', 'code', model, schema)[0] }];
    },
  },
  {
    label: 'name',
    field: 'name',
    component: 'Input',
    dynamicRules: ({ model, schema }) => {
      return [{ required: true, message: '请输入name!' }, { ...rules.duplicateCheckRule('dry_eqp_type', 'name', model, schema)[0] }];
    },
  },
  // TODO ä¸»é”®éšè—å­—段，目前写死为ID
  {
    label: '',
    field: 'id',
    component: 'Input',
    show: false,
  },
];
    {
        label: '编码',
        field: 'code',
        component: 'Input',
        dynamicRules: ({ model, schema }) => {
            return [{ required: true, message: '请输入编码!' }, { ...rules.duplicateCheckRule('dry_eqp_type', 'code', model, schema)[0] }]
        },
    },
    {
        label: '名称',
        field: 'name',
        component: 'Input',
        dynamicRules: ({ model, schema }) => {
            return [{ required: true, message: '请输入名称!' }, { ...rules.duplicateCheckRule('dry_eqp_type', 'name', model, schema)[0] }]
        },
    },
    // TODO ä¸»é”®éšè—å­—段，目前写死为ID
    {
        label: '',
        field: 'id',
        component: 'Input',
        show: false,
    },
]

/**
 * æµç¨‹è¡¨å•è°ƒç”¨è¿™ä¸ªæ–¹æ³•èŽ·å–formSchema
 * @param param
 */
export function getBpmFormSchema(_formData): FormSchema[] {
  // é»˜è®¤å’ŒåŽŸå§‹è¡¨å•ä¿æŒä¸€è‡´ å¦‚果流程中配置了权限数据，这里需要单独处理formSchema
  return formSchema;
    // é»˜è®¤å’ŒåŽŸå§‹è¡¨å•ä¿æŒä¸€è‡´ å¦‚果流程中配置了权限数据，这里需要单独处理formSchema
    return formSchema
}

 src/views/dry/dataDefine/DryOrder.data.ts

@@ -23,6 +23,16 @@
        dataIndex: 'herbId_dictText',
    },
    {
        title: '设备',
        align: 'center',
        dataIndex: 'equId_dictText',
    },
    {
        title: '车间',
        align: 'center',
        dataIndex: 'shopId_dictText',
    },
    {
        title: '初始含水率',
        align: 'center',
        dataIndex: 'initial',
@@ -87,16 +97,7 @@
        align: 'center',
        dataIndex: 'remain',
    },
    {
        title: '设备',
        align: 'center',
        dataIndex: 'equId_dictText',
    },
    {
        title: '车间',
        align: 'center',
        dataIndex: 'shopId_dictText',
    },

    {
        title: '工单状态',
        align: 'center',
@@ -153,71 +154,71 @@
            dictCode: 'dry_herb,name,id,tenant_id=' + getTenantId(),
        },
    },
    {
        label: '初始含水率',
        field: 'initial',
        component: 'InputNumber',
    },
    {
        label: '目标含水率',
        field: 'target',
        component: 'InputNumber',
    },
    // {
    //     label: '初始含水率',
    //     field: 'initial',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '目标含水率',
    //     field: 'target',
    //     component: 'InputNumber',
    // },
    {
        label: '投料量',
        field: 'feed',
        component: 'InputNumber',
    },
    {
        label: '原始重量',
        field: 'originWeight',
        component: 'InputNumber',
    },
    {
        label: '预计干燥时间',
        field: 'et',
        component: 'InputNumber',
    },
    {
        label: '干料重量',
        field: 'yield',
        component: 'InputNumber',
    },
    {
        label: '干燥时间',
        field: 'dryTime',
        component: 'InputNumber',
    },
    {
        label: '热风温度',
        field: 'windTemp',
        component: 'InputNumber',
    },
    {
        label: '环境温度',
        field: 'envTemp',
        component: 'InputNumber',
    },
    {
        label: '环境湿度',
        field: 'envHum',
        component: 'InputNumber',
    },
    {
        label: '荡料延时（ms）',
        field: 'delay',
        component: 'InputNumber',
    },
    {
        label: '翻料次数',
        field: 'turn',
        component: 'InputNumber',
    },
    {
        label: '预计剩余时间',
        field: 'remain',
        component: 'InputNumber',
    },
    // {
    //     label: '原始重量',
    //     field: 'originWeight',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '预计干燥时间',
    //     field: 'et',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '干料重量',
    //     field: 'yield',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '干燥时间',
    //     field: 'dryTime',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '热风温度',
    //     field: 'windTemp',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '环境温度',
    //     field: 'envTemp',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '环境湿度',
    //     field: 'envHum',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '荡料延时（ms）',
    //     field: 'delay',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '翻料次数',
    //     field: 'turn',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '预计剩余时间',
    //     field: 'remain',
    //     component: 'InputNumber',
    // },
    {
        label: '设备',
        field: 'equId',
@@ -234,19 +235,19 @@
            dictCode: 'dry_shop,name,id,tenant_id=' + getTenantId(),
        },
    },
    {
        label: '工单状态',
        field: 'orderStatus',
        component: 'InputNumber',
    },
    {
        label: '操作人',
        field: 'operator',
        component: 'JDictSelectTag',
        componentProps: {
            dictCode: 'sys_user,realname,id,tenant_id=' + getTenantId(),
        },
    },
    // {
    //     label: '工单状态',
    //     field: 'orderStatus',
    //     component: 'InputNumber',
    // },
    // {
    //     label: '操作人',
    //     field: 'operator',
    //     component: 'JDictSelectTag',
    //     componentProps: {
    //         dictCode: 'sys_user,realname,id,tenant_id=' + getTenantId(),
    //     },
    // },
    // TODO ä¸»é”®éšè—å­—段，目前写死为ID
    {
        label: '',

 src/views/dry/monitor/Eqp.vue

@@ -1,14 +1,12 @@
<template>
    <div  class="eqpBox">
    <div class="eqpBox">
        <div class="eqpRow">
            <div class="eqpImage" >
				
            <div class="eqpImage">
                <div class="leftEqp">
                    <div style="width: 300px;  ">
                    <div class="herbInfo">
						
                    <div style="width: 300px">
                        <div class="herbInfo">
                            <dv-border-box7 class="curEqp">
                                <div class="eqpName"  @click="changeEqp">
                                <div class="eqpName" @click="changeEqp">
                                    <div class="mainInfo" style="font-size: 26px">{{ eqp?.name }}</div>
                                    <div class="subhead">{{ eqp?.type }}</div>
                                    <!-- <dv-decoration-1 style="width:150px;height:60px; margin-left: 20px;" /> -->
@@ -16,28 +14,28 @@
                                <div class="eqpName">型号：{{ eqp.type }}</div> -->
                                </div>
                            </dv-border-box7>
                            <dv-border-box7 class="curHerb" :style="{'background-image': 'url(/src/assets/images/dry/yaocai/'+realData?.herbImage+')'}">
                            <dv-border-box7 class="curHerb" :style="{ 'background-image': 'url(/src/assets/images/dry/yaocai/' + realData?.herbImage + ')' }">
                                <div class="eqpName" style="margin-left: 100px">
                                    <div class="mainInfo" style="font-size: 26px">{{ realData?.herbName }}</div>
                                    <div class="subhead">干燥配方</div>
                                </div>
                                <div class="formula">
                                    <div class="formulaItem">
                                        <Icon  style="color: powderblue"  icon="icon-park-twotone:box" :size="35" />
                                        <Icon style="color: powderblue" icon="icon-park-twotone:box" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.feed }}筐</div>
                                            <div class="subhead2">投料量</div>
                                        </div>
                                    </div>
                                    <div class="formulaItem">
                                        <Icon  style="color: red"  icon="bx:wind" :size="35" />
                                        <Icon style="color: red" icon="bx:wind" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.windTemp }}°C</div>
                                            <div class="subhead2">热风</div>
                                        </div>
                                    </div>
                                    <div class="formulaItem">
                                        <Icon  style="color: green"  icon="tabler:target-arrow" :size="35" />
                                        <Icon style="color: green" icon="tabler:target-arrow" :size="35" />
                                        <div>
                                            <div class="mainInfo2">{{ realData?.target }}%</div>
                                            <div class="subhead2">目标</div>
@@ -54,7 +52,7 @@
                                <div id="fanFreq" style="width: 220px; height: 200px"></div>
                            </div>
                        </dv-border-box7> -->
                        <dv-border-box7 class="infoChart" style="margin-left: 0px;">
                        <dv-border-box7 class="infoChart" style="margin-left: 0px">
                            <div class="chartTittle">含水率</div>
                            <div class="outDiv" style="padding-top: 20px">
                                <div class="leftData">
@@ -81,72 +79,74 @@
                            </div>
                            <div class="subhead2" style="margin-top: -37px; padding-left: 172px">实时含水率</div>
                        </dv-border-box7>
                </div>
                    <dv-border-box7  class="leftTop">

                        <div class="leftTop0">
                        <div class="leftTop1">
                            <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                            <div>
                                <div class="mainInfo">{{ realData?.totalRemain | 0 }}min</div>
                                <div class="subhead">剩余时间</div>
                            </div>
                        </div>
                        <div class="leftTop1">
                            <Icon icon="bi:fan" :size="50" />
                            <div>
                                <div class="mainInfo">{{ realData.trendVo?.fanFrequency | 0 }} Hz</div>
                                <div class="subhead">风机频率</div>
                            </div>
                        </div>
                        <div class="leftTop3" :style="{ 'background-image': 'url(/src/assets/images/dry/' + statusGif + '.gif)' }"></div>
                        <div class="outDiv eqpStatus">
                            <div
                                style="
                                    font-size: 28px;
                                    margin-top: 60px;
                                    color: white;
                                    background-color: #1595ea;
                                    height: 60px;
                                    width: 180px;
                                    line-height: 60px;
                                    text-align: center;
                                    border-radius: 5px;
                                    font-weight: bold;
                                "
                            >
                                {{ statusTxt }}
                            </div>
                            <div v-if="realData?.isError"
                                class="eqpInfoText blingbling"
                                style="
                                    position: absolute;

                                    max-height: 130px;
                                    max-width: 360px;
                                    border-radius: 10px;
                                    background-color: #ce0000;
                                    color: white;
                                    padding: 10px;
                                "
                            >
                                <div class="outDiv">
                                    <div><Icon icon="bx:error" :size="30" /> </div>
                                    <div><span> {{realData?.errorMsg}}</span></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    </dv-border-box7>
						
                    <dv-border-box7 class="infoChart" style="margin-left: 0px; margin-right: 10px;">
                            <div class="chartTittle">风箱温度</div>
                            <div class="outDiv">
                                <div id="bellowsTemp" style="width: 220px; height: 200px">
                                    <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                    <dv-border-box7 class="leftTop">
                        <div class="leftTop0">
                            <div class="leftTop1">
                                <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                                <div>
                                    <div class="mainInfo">{{ realData?.totalRemain | 0 }}min</div>
                                    <div class="subhead">剩余时间</div>
                                </div>
                            </div>
                        </dv-border-box7>
                            <div class="leftTop1">
                                <Icon icon="bi:fan" :size="50" />
                                <div>
                                    <div class="mainInfo">{{ realData.trendVo?.fanFrequency | 0 }} Hz</div>
                                    <div class="subhead">风机频率</div>
                                </div>
                            </div>
                            <div class="leftTop3" :style="{ 'background-image': 'url(/src/assets/images/dry/' + statusGif + '.gif)' }"></div>
                            <div class="outDiv eqpStatus">
                                <div
                                    style="
                                        font-size: 28px;
                                        margin-top: 60px;
                                        color: white;
                                        background-color: #1595ea;
                                        height: 60px;
                                        width: 180px;
                                        line-height: 60px;
                                        text-align: center;
                                        border-radius: 5px;
                                        font-weight: bold;
                                    "
                                >
                                    {{ statusTxt }}
                                </div>
                                <div
                                    v-if="realData?.isError"
                                    class="eqpInfoText blingbling"
                                    style="
                                        position: absolute;

                                        max-height: 130px;
                                        max-width: 360px;
                                        border-radius: 10px;
                                        background-color: #ce0000;
                                        color: white;
                                        padding: 10px;
                                    "
                                >
                                    <div class="outDiv">
                                        <div><Icon icon="bx:error" :size="30" /> </div>
                                        <div
                                            ><span> {{ realData?.errorMsg }}</span></div
                                        >
                                    </div>
                                </div>
                            </div>
                        </div>
                    </dv-border-box7>

                    <dv-border-box7 class="infoChart" style="margin-left: 0px; margin-right: 10px">
                        <div class="chartTittle">风箱温度</div>
                        <div class="outDiv">
                            <div id="bellowsTemp" style="width: 220px; height: 200px">
                                <Icon icon="emojione:hourglass-with-flowing-sand" :size="50" />
                            </div>
                        </div>
                    </dv-border-box7>
                    <dv-border-box7 class="leftMid">
                        <div class="chartTittle">实时进度</div>
                        <div id="efficiencyLine" style="width: 780px; height: 130px; margin-top: -10px"></div>
@@ -156,7 +156,7 @@
                        </div>
                        <div id="progressBar" style="width: 780px; height: 80px"></div>
                    </dv-border-box7>
			

                    <!-- <div class="outDiv">
                        <div style="height: 100px; width: 400px">
                            <Progress
@@ -177,7 +177,6 @@
                </div>
                <div class="rightInfo">
                    <div class="rightTop">
						
                        <dv-border-box7 class="tempMoisChart">
                            <div :id="'moisChart'" style="width: 550px; height: 320px"></div>
                        </dv-border-box7>
@@ -241,7 +240,6 @@
                            </div>
                        </dv-border-box7>

						
                        <dv-border-box7 class="infoChart">
                            <div class="chartTittle"
                                >蒸汽消耗(m³/kg)
@@ -254,14 +252,17 @@
                                <div class="leftData">
                                    <div class="center" style="height: 100%">
                                        <div class="centerText">
                                            <div class="mainInfo3"><span>{{realData?.steam}}</span>m³ </div>
                                            <div class="mainInfo3"
                                                ><span>{{ realData?.steam }}</span
                                                >m³
                                            </div>
                                            <div class="subhead2">蒸汽用量</div>
                                        </div>
                                    </div>
                                </div>
                                <div class="rightChart center">
                                    <div class="center compareBar">
                                        <div class="barTop">{{standard.zhengqi}}</div>
                                        <div class="barTop">{{ standard.zhengqi }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :style="{ height: realData?.zqsHeight }"></div>
                                        </div>
@@ -272,10 +273,14 @@
                                        </div>
                                    </div>
                                    <div class="center compareBar">
                                        <div class="barTop">{{realData?.zhengqi | 0 }}</div>
                                        <div class="barTop">{{ realData?.zhengqi | 0 }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :class="{ good: realData?.zqgood, bad: realData?.zqbad }"
                                                :style="[realData?.zqrHeight && { height: realData?.zqrHeight }]"> </div>
                                            <div
                                                class="barDiv"
                                                :class="{ good: realData?.zqgood, bad: realData?.zqbad }"
                                                :style="[realData?.zqrHeight && { height: realData?.zqrHeight }]"
                                            >
                                            </div>
                                        </div>
                                        <div style="line-height: 18px">
                                            å®žæ—¶
@@ -286,7 +291,7 @@
                                </div>
                            </div>
                        </dv-border-box7>
                        <dv-border-box7 class="infoChart" >
                        <dv-border-box7 class="infoChart">
                            <div class="chartTittle">效率对比</div>
                            <div class="outDiv" style="padding-top: 10px">
                                <div id="compare" style="width: 300px; height: 200px"></div>
@@ -304,14 +309,17 @@
                                <div class="leftData">
                                    <div class="center" style="height: 100%">
                                        <div class="centerText">
                                            <div class="mainInfo3"><span>{{realData?.watt}}</span>kWh </div>
                                            <div class="mainInfo3"
                                                ><span>{{ realData?.watt }}</span
                                                >kWh
                                            </div>
                                            <div class="subhead2">电能用量</div>
                                        </div>
                                    </div>
                                </div>
                                <div class="rightChart center">
                                    <div class="center compareBar">
                                        <div class="barTop">{{standard.dian}}</div>
                                        <div class="barTop">{{ standard.dian }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :style="{ height: realData?.dnsHeight }"></div>
                                        </div>
@@ -322,10 +330,13 @@
                                        </div>
                                    </div>
                                    <div class="center compareBar">
                                        <div class="barTop">{{realData?.dian | 0}}</div>
                                        <div class="barTop">{{ realData?.dian | 0 }}</div>
                                        <div class="barBack">
                                            <div class="barDiv" :class="{ good: realData?.dngood, bad: realData?.dnbad }"
                                                :style="[realData?.dnrHeight && { height: realData?.dnrHeight }]"></div>
                                            <div
                                                class="barDiv"
                                                :class="{ good: realData?.dngood, bad: realData?.dnbad }"
                                                :style="[realData?.dnrHeight && { height: realData?.dnrHeight }]"
                                            ></div>
                                        </div>
                                        <div style="line-height: 18px">
                                            å®žæ—¶
@@ -344,7 +355,7 @@
</template>

<script setup lang="ts">
  import { useFullscreen } from '@vueuse/core';
    import { useFullscreen } from '@vueuse/core'
    import { BorderBox13 as DvBorderBox7 } from '@kjgl77/datav-vue3'
    import { router } from '/@/router'
    import { onMounted, ref, onUnmounted } from 'vue'
@@ -356,10 +367,10 @@
    import { queryById } from '../api/DryEquipment.api'
    import { dryEquipment } from '../dataDefine/DryEquipment.data'
    import { useUserStore } from '/@/store/modules/user'
    const domRef = ref<Nullable<HTMLElement>>(null);
        const { enter, toggle, exit, isFullscreen } = useFullscreen();
    const domRef = ref<Nullable<HTMLElement>>(null)
    const { enter, toggle, exit, isFullscreen } = useFullscreen()

const { toggle: toggleDom } = useFullscreen(domRef);
    const { toggle: toggleDom } = useFullscreen(domRef)
    const Timer = ref()
    const marks = ref<Record<number, any>>({
        0: '0°C',
@@ -464,7 +475,7 @@
        99: '',
        100: '100°C',
    })
	

    const eqp = ref({} as dryEquipment)
    const userStore = useUserStore()
    const realData = ref({})
@@ -513,7 +524,7 @@
                text: '含水率/温度趋势',
                textStyle: {
                    //color: '#fff',
                    fontSize: 15
                    fontSize: 15,
                },
            },
            tooltip: {
@@ -590,15 +601,15 @@
                    areaStyle: {
                        opacity: 0.2,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        {
                            offset: 0,
                            color: 'rgb(128, 255, 165)'
                        },
                        {
                            offset: 1,
                            color: 'rgb(1, 191, 236)'
                        }
                        ])
                            {
                                offset: 0,
                                color: 'rgb(128, 255, 165)',
                            },
                            {
                                offset: 1,
                                color: 'rgb(1, 191, 236)',
                            },
                        ]),
                    },
                },
                {
@@ -616,15 +627,15 @@
                    areaStyle: {
                        opacity: 0.2,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        {
                            offset: 0,
                            color: 'rgb(255, 0, 135)'
                        },
                        {
                            offset: 1,
                            color: 'rgb(135, 0, 157)'
                        }
                        ])
                            {
                                offset: 0,
                                color: 'rgb(255, 0, 135)',
                            },
                            {
                                offset: 1,
                                color: 'rgb(135, 0, 157)',
                            },
                        ]),
                    },
                    // markLine: {
                    //     data: [
@@ -659,7 +670,7 @@
                    amplitude: 3,
                    animationDuration: 5,
                    //animationDurationUpdate: 0,
                    data: [0.56,0.44,0.32],
                    data: [0.56, 0.44, 0.32],
                    shape:
                        'path://M828.817,706.209C828.817,881.725,686.98,1024,512,1024c-174.98,0-316.817-142.275-316.817-317.791C195.183,530.74,512,0,512,0s316.817,530.74,316.817,706.209z',
                    outline: {
@@ -1073,7 +1084,6 @@
            },
            legend: {
                right: 60,
				
            },
            xAxis: {
                show: false,
@@ -1123,18 +1133,17 @@
                        ],
                    },
                    markLine: {
                                    symbol: 'none',
                                    data: [
                                        {
                                            name: '额定',
                                            yAxis: standard.value.xiaolv,
                                        },
                                    ],
                                    label: {
                                        formatter: '{b}\n{c}',
									
                                    },
                                },
                        symbol: 'none',
                        data: [
                            {
                                name: '额定',
                                yAxis: standard.value.xiaolv,
                            },
                        ],
                        label: {
                            formatter: '{b}\n{c}',
                        },
                    },
                    // markLine: {
                    //     data: [{ type: 'average', name: 'Avg' }],
                    // },
@@ -1143,50 +1152,46 @@
        }

        const compareOption = {
					
                    tooltip: {
                        trigger: 'axis',
					
            tooltip: {
                trigger: 'axis',
            },
            grid: {
                top: '6%',
                left: '10%',
                right: '10%',
                bottom: '3%',
                containLabel: true,
            },
            xAxis: {
                show: false,
                type: 'value',
            },
            yAxis: {
                axisLine: {
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                type: 'category',
                data: ['1#', '2#', '3#', '4#', '5#', '6#'],
            },
            series: [
                {
                    name: '2011',
                    type: 'bar',
                    barWidth: 10,
                    data: [190, 89, 34, 70, 44, 30],
                    label: {
                        show: true,
                        position: 'right',
                        valueAnimation: true,

                        color: '#fff',
                    },
                    grid: {
                        top: '6%',
                        left: '10%',
                        right: '10%',
                        bottom: '3%',
                        containLabel: true
                    },
                    xAxis: {
                        show: false,
                        type: 'value',
					
                    },
                    yAxis: {
                        axisLine: {
                            show:false,
                        },
                        axisTick: {
                            show: false,
                        },
                        type: 'category',
                        data: ['1#', '2#', '3#', '4#', '5#', '6#']
                    },
                    series: [
                        {
                            name: '2011',
                            type: 'bar',
                            barWidth: 10,
                            data: [190, 89, 34, 70, 44, 30],
                            label: {
                                show: true,
                                position: 'right',
                                valueAnimation: true,
								
                                color: '#fff' 
                            }
                        },
                    ]
                }
		
                },
            ],
        }

        option && moisChart.setOption(option)
        waterOption && waterChart.setOption(waterOption)
@@ -1198,7 +1203,6 @@
        compareOption && compareChart.setOption(compareOption)
    }


    function queryEqp() {
        queryById({ id: router.currentRoute.value.params.id }).then((res) => {
            // console.log(`output->res`, res)
@@ -1208,29 +1212,26 @@
        })
    }


    var shangliaoFlag = false;
    var statusGif = 'tmrefeng2';
    var shangliaoFlag = false
    var statusGif = 'tmrefeng2'
    var statusTxt = '正在干燥'

    function chaiwangban() {
        statusGif = 'chaiwangban-1'
        setTimeout(shangliao,7000)
					
        setTimeout(shangliao, 7000)
    }

    function shangliao() {
        statusGif = "shangliao-N"
        setTimeout(()=>{
            statusGif = "zhuangwangban"
            setTimeout(()=>{
                statusGif = "guanmen1"
                setTimeout(()=>{
        statusGif = 'shangliao-N'
        setTimeout(() => {
            statusGif = 'zhuangwangban'
            setTimeout(() => {
                statusGif = 'guanmen1'
                setTimeout(() => {
                    shangliaoFlag = false
                },4000)
				
            },5000)
        },13000)
                }, 4000)
            }, 5000)
        }, 13000)
    }

    function queryRealTime() {
@@ -1238,9 +1239,8 @@
        let eqpCode = eqp.value.code
        let queryRealTimeUrl = '/dry/real/getRealTimeData'
        defHttp.get({ url: queryRealTimeUrl, params: { tenantid: tenantId, machineid: eqpCode } }).then((res) => {
			
            if (res && res.trendVo) {
                console.log(`output->re11s`, res)
                //console.log(`output->re11s`, res)
                //    res.tempValue = [res.windTemp, 100]
                //res.percent = ((res.dryTime / res.et) * 100).toFixed(2)
                /**水滴图含水量 */
@@ -1341,7 +1341,7 @@
                                ],
                            })
                        }
                        res.totalRemain = res.remain - (res.dryTime - totalTime)>0?res.remain - (res.dryTime - totalTime):0
                        res.totalRemain = res.remain - (res.dryTime - totalTime) > 0 ? res.remain - (res.dryTime - totalTime) : 0
                        progressSeries.push({
                            name: '剩余',
                            type: 'bar',
@@ -1387,32 +1387,33 @@
                            },
                            yAxis: {
                                max: function (value) {
									
                                    console.log("max::",value);
                                        if (value.max < standard.value.xiaolv + 3) {
                                            return standard.value.xiaolv + 3
                                        } else {
                                            return value.max
                                        }
                                    },
								
								
								
                                    //    console.log("max::",value);
                                    if (value.max < standard.value.xiaolv + 3) {
                                        return standard.value.xiaolv + 3
                                    } else {
                                        return value.max
                                    }
                                },
                            },
                            series: [{ data: ganZaoXiaoLv,
                                markLine: {
                                symbol: 'none',
                                    data: [
                                        {
                                            name: '额定',
                                            yAxis: standard.value.xiaolv,
                            series: [
                                {
                                    data: ganZaoXiaoLv,
                                    markLine: {
                                        symbol: 'none',
                                        data: [
                                            {
                                                name: '额定',
                                                yAxis: standard.value.xiaolv,
                                            },
                                        ],
                                        label: {
                                            formatter: '{b}\n{c}',
                                        },
                                    ],
                                    label: {
                                        formatter: '{b}\n{c}',
										
                                    },
                            } }, { data: zhengQiXiaoHao }, { data: dianNengXiaoHao }],
                                },
                                { data: zhengQiXiaoHao },
                                { data: dianNengXiaoHao },
                            ],
                        })
                    }

@@ -1460,12 +1461,12 @@
                }

                /**效率对比图 */
                if( (res.originWeight - res.yield) <= 0) {
                    res.xiaolv =  standard.value.xiaolv + 6
                if (res.originWeight - res.yield <= 0) {
                    res.xiaolv = standard.value.xiaolv + 6
                } else {
                    res.xiaolv = (((res.originWeight - res.yield) / res.dryTime) * 60).toFixed(2)
                }
				

                if (res.xiaolv > standard.value.xiaolv) {
                    res.xlgood = true
                    res.xlsHeight = (standard.value.xiaolv / res.xiaolv) * 100 + '%'
@@ -1479,15 +1480,13 @@
                    res.xlrHeight = (res.xiaolv / standard.value.xiaolv) * 100 + '%'
                }


				
                /** è’¸æ±½æ¶ˆè€— */
                if( (res.originWeight - res.yield) <= 0) {
                    res.zhengqi = standard.value.zhengqi -3
                if (res.originWeight - res.yield <= 0) {
                    res.zhengqi = standard.value.zhengqi - 3
                } else {
                    res.zhengqi = (res.steam / (res.originWeight - res.yield)).toFixed(1)
                }
                console.log('zhengqi:', res.zhengqi);
                //console.log('zhengqi:', res.zhengqi);
                if (res.zhengqi > standard.value.zhengqi) {
                    res.zqbad = true
                    res.zqsHeight = (standard.value.zhengqi / res.zhengqi) * 100 + '%'
@@ -1501,21 +1500,18 @@
                    res.zqrHeight = (res.zhengqi / standard.value.zhengqi) * 100 + '%'
                }

				
				
                /** ç”µèƒ½æ¶ˆè€— */
                if( (res.originWeight - res.yield) <= 0) {
                    res.dian = standard.value.dian -1.5
                if (res.originWeight - res.yield <= 0) {
                    res.dian = standard.value.dian - 1.5
                } else {
                    res.dian = (res.watt / (res.originWeight - res.yield)).toFixed(1)
                }
				

                if (res.dian > standard.value.dian) {
                    res.dnbad = true
                    res.dnsHeight = (standard.value.dian / res.dian) * 100 + '%'
                    res.dnrHeight = '100%'
                } else if (res.dian < standard.value.dMin) {
					
                    res.dngood = true
                    res.dnsHeight = '100%'
                    res.dnrHeight = (res.dian / standard.value.dian) * 100 + '%'
@@ -1527,51 +1523,50 @@
                /**状态/gif动图 */
                if (!shangliaoFlag) {
                    if (res.orderStatus == 0) {
                    statusGif = 'zanting'
                    statusTxt = '准备'
                } else if (res.orderStatus == 1) {
                    shangliaoFlag = true
                    statusGif = 'kaimen1'
                    statusTxt = '上料'
                    setTimeout(chaiwangban,4000)
                } else if (res.orderStatus == 2) {
                    if(res.state_fan == 1) {
                        statusGif = 'tmrefeng2'
                        statusTxt = '正在干燥'
                    }
                        statusGif = 'zanting'
                        statusTxt = '准备'
                    } else if (res.orderStatus == 1) {
                        shangliaoFlag = true
                        statusGif = 'kaimen1'
                        statusTxt = '上料'
                        setTimeout(chaiwangban, 4000)
                    } else if (res.orderStatus == 2) {
                        if (res.state_fan == 1) {
                            statusGif = 'tmrefeng2'
                            statusTxt = '正在干燥'
                        }

                    if(res.state_roller == 4) {
                        statusGif = 'fanliao-N'
                        statusTxt = '正在翻料'
                    }
                        if (res.state_roller == 4) {
                            statusGif = 'fanliao-N'
                            statusTxt = '正在翻料'
                        }

                    if (res.state_roller == 5) {
                        statusGif = 'chuliao-N'
                        statusTxt = '正在出料'
                        if (res.state_roller == 5) {
                            statusGif = 'chuliao-N'
                            statusTxt = '正在出料'
                        }

                        if (res.state_windbox == 2 || res.state_windbox == 3) {
                            statusGif = 'fengxiangsheng-1'
                            statusTxt = '正在干燥'
                        }
                    } else if (res.orderStatus == 3) {
                        statusGif = 'zanting'
                        statusTxt = '暂停'
                    } else if (res.orderStatus == 4) {
                        statusGif = 'zanting'
                        statusTxt = '干燥完成'
                    }
					
                    if (res.state_windbox == 2 || res.state_windbox == 3) {
                        statusGif = 'fengxiangsheng-1'
                        statusTxt = '正在干燥'
                    }
                } else if(res.orderStatus == 3) {
                    statusGif = 'zanting'
                    statusTxt = '暂停'
                } else if(res.orderStatus == 4) {
                    statusGif = 'zanting'
                    statusTxt = '干燥完成'
                }
                }
				

                if (compareChart) {
                    compareChart.setOption({
                        yAxis: {
                            data: res.compEqpNum
                            data: res.compEqpNum,
                        },
                        series: {
                            data: res.compEqpEffic
                        }
                            data: res.compEqpEffic,
                        },
                    })
                }

@@ -1597,10 +1592,10 @@
                res = {
                    mois: [],
                    gif: 'tmrefeng2',
                    herbImage: 'yaocai1.png'
                    herbImage: 'yaocai1.png',
                }
            }
            console.log(`output->res`, res)
            //console.log(`output->res`, res)
            realData.value = res
        })
    }
@@ -1627,7 +1622,7 @@
    .eqpImage {
        height: 860px;
        width: 1800px;
         /* background-image: url(/src/assets/images/dry/bg.png);
        /* background-image: url(/src/assets/images/dry/bg.png);
        background-repeat: no-repeat; */

        /*background-position: 160px 280px; */
@@ -1643,7 +1638,7 @@
        width: 1080px;
        display: flex;
        flex-wrap: wrap;
		

        /* background-color: white;
        background-image: url(/src/assets/images/dry/shebei1.png);
        background-repeat: no-repeat;
@@ -1665,7 +1660,6 @@
        border-radius: 10px;
        flex-wrap: wrap;
        background-position: -78px 119px;

    }
    .leftTop0 {
        height: 600px;
@@ -1676,7 +1670,6 @@
        flex-wrap: wrap;
    }
    .leftMid {
		
        width: 780px;
        height: 230px;
        /* border: 1px solid; */
@@ -1735,7 +1728,6 @@
        align-items: center;
        font-size: 30px;
        color: #727272;
		
    }
    .leftTop2 {
        width: 250px;
@@ -1878,7 +1870,7 @@
        width: 590px;
        height: 360px;
        /* background: white; */
		

        padding: 20px;
        border-radius: 10px;
    }

 src/views/dry/monitor/WorkShop.vue

@@ -85,8 +85,8 @@
                                    :marks="marks"
                                    vertical
                                />
                                <div
                                class="info-text">热风：<span >{{ realTime.get(item.id)?.windTemp | 0 }}</span> Â°C</div
                                <div class="info-text"
                                    >热风：<span>{{ realTime.get(item.id)?.windTemp | 0 }}</span> Â°C</div
                                >
                            </div>
                        </div>
@@ -450,13 +450,13 @@

    .eqp-content {
        height: 100%;
    background-color: #fdfdfd;
    box-shadow: 0px 0px 23px #72727278;
    background-image: url(/src/assets/images/dry/ganzaoji-x.png);
    background-repeat: no-repeat;
    background-size: 60% 60%;
    background-position: 105px 127px;
    border-radius: 8px;
        background-color: #fdfdfd;
        box-shadow: 0px 0px 23px #72727278;
        background-image: url(/src/assets/images/dry/ganzaoji-x.png);
        background-repeat: no-repeat;
        background-size: 60% 60%;
        background-position: 105px 127px;
        border-radius: 8px;
    }

    .chart {
@@ -477,13 +477,13 @@
    }
    .eqpStatus {
        width: 170px;
    background-position: -21px 19px;
    background-image: url(/src/assets/images/dry/refeng2.gif);
    background-size: 196px;
    background-repeat: no-repeat;
    display: inline-flex;
    flex-direction: column-reverse;
    padding: 15px;
        background-position: -21px 19px;
        background-image: url(/src/assets/images/dry/refeng2.gif);
        background-size: 196px;
        background-repeat: no-repeat;
        display: inline-flex;
        flex-direction: column-reverse;
        padding: 15px;
    }
    .info {
        display: flex;
@@ -517,13 +517,13 @@
    }
    .eqpName {
        margin-top: 190px;
    margin-left: 129px;
    width: 95px;
    /* font-size: 14px; */
    font-weight: bold;
    text-align: center;
    background-color: white;
    height: 22px;
        margin-left: 58px;
        width: 205px;
        /* font-size: 14px; */
        font-weight: bold;
        text-align: center;
        background-color: white;
        height: 22px;
    }

    .tempChart {

 src/views/sys/login/TokenLoginPage.vue

@@ -5,7 +5,7 @@
            <div class="app-loading-dots">
                <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
            </div>
            <div class="app-loading-title">智能中草药干燥系统</div>
            <div class="app-loading-title">智能中草药干燥配方管理系统</div>
        </div>
    </div>
</template>

 src/views/system/loginmini/MiniLogin.vue

@@ -18,7 +18,7 @@
                    <div class="aui-form">
                        <div class="aui-image">
                            <div>Lanpu</div>
                            <div>兰浦智能中草药干燥系统</div>
                            <div>智能中草药干燥配方管理系统</div>
                            <!--              <div class="aui-image-text">-->
                            <!--                <img :src="adTextImg" />-->
                            <!--              </div>-->