{"remainingRequest":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\sfz-lh-fvue\\src\\views\\BigScreen\\homePage.vue?vue&type=template&id=79c95bda&scoped=true&","dependencies":[{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\src\\views\\BigScreen\\homePage.vue","mtime":1703617757286},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\loaders\\templateLoader.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\sfz-lh-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n<div class=\"screen-page\">\n    <threeDModel\n        ref=\"model\"\n        :activeDeviceList=\"activeDeviceList\"\n    ></threeDModel>\n    <div class=\"screen-page-mask\"></div>\n    <headline @changeTollStation=\"getDate\"></headline>\n    <div class=\"left-sidebar blue-border\">\n        <div class=\"tollstation-infor\">\n            <div class=\"section-header\" @click=\"showModel\">\n                <span>当日信息概括</span>\n            </div>\n            <div class=\"section1\">\n                <div class=\"circle\"></div>\n                <div class=\"target target1\">\n                    <div class=\"label\">当日通行费</div>\n                    <div class=\"count\">{{ actualityMoney }} 元</div>\n                </div>\n                <div class=\"target target2\">\n                    <div class=\"label\">当日车流量</div>\n                    <div class=\"count\">{{ carFlow }} 辆</div>\n                </div>\n                <div class=\"zhiban flex-start\">\n                    <img\n                        class=\"avator\"\n                        src=\"../../assets/img/bigScreen/defaultAvator.png\"\n                        alt=\"照片\"\n                    />\n                    <div class=\"zhiban-info flex-column\">\n                        <div>当班人：{{ responseName }}</div>\n                        <div>联系电话：{{ responseTel }}</div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"section-content-block\">\n                <div class=\"icon-transit-time\"></div>\n                <div class=\"section-content-container flex-column\">\n                    <div class=\"container-name\">当日车辆平均通行时间</div>\n                    <div class=\"container-content\">\n                        <template v-for=\"item in transitTime.minute\">\n                            <keep-alive :key=\"item\"\n                                ><div\n                                    class=\"number-blocks-wrapper\"\n                                    :style=\"`transform: translate(0, ${\n                                        -100 * Number(item)\n                                    }%)`\"\n                                >\n                                    <div\n                                        v-for=\"num in 10\"\n                                        :key=\"num\"\n                                        class=\"number-block\"\n                                    >\n                                        {{ num - 1 }}\n                                    </div>\n                                </div>\n                            </keep-alive>\n                        </template>\n                        <div class=\"container-content-unit\">\n                            <span>分</span>\n                        </div>\n                        <template\n                            v-for=\"item in transitTime.second.split('')\"\n                        >\n                            <keep-alive :key=\"item\">\n                                <div\n                                    class=\"number-blocks-wrapper\"\n                                    :style=\"`transform: translate(0, ${\n                                        -100 * Number(item)\n                                    }%)`\"\n                                >\n                                    <div\n                                        v-for=\"num in 10\"\n                                        :key=\"num\"\n                                        class=\"number-block\"\n                                    >\n                                        {{ num - 1 }}\n                                    </div>\n                                </div>\n                            </keep-alive>\n                        </template>\n                        <div class=\"container-content-unit\">\n                            <span>秒</span>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"section-content-block\">\n                <div class=\"icon-transaction-rate\"></div>\n                <div class=\"section-content-container flex-column\">\n                    <div class=\"container-name\">当日交易成功率</div>\n                    <div class=\"container-content\">\n                        <template\n                            v-for=\"item in transactionRate.int.split('')\"\n                        >\n                            <keep-alive :key=\"item\">\n                                <div\n                                    class=\"number-blocks-wrapper\"\n                                    :style=\"`transform: translate(0, ${\n                                        -100 * Number(item)\n                                    }%)`\"\n                                >\n                                    <div\n                                        v-for=\"num in 10\"\n                                        :key=\"num\"\n                                        class=\"number-block\"\n                                    >\n                                        {{ num - 1 }}\n                                    </div>\n                                </div>\n                            </keep-alive>\n                        </template>\n                        <div\n                            class=\"container-content-unit point\"\n                            v-if=\"transactionRate.decimal\"\n                        >\n                            <span>.</span>\n                        </div>\n                        <template\n                            v-for=\"item in transactionRate.decimal.split(\n                                ''\n                            )\"\n                        >\n                            <keep-alive :key=\"item\"\n                                ><div\n                                    class=\"number-blocks-wrapper\"\n                                    :style=\"`transform: translate(0, ${\n                                        -100 * Number(item)\n                                    }%)`\"\n                                >\n                                    <div\n                                        v-for=\"num in 10\"\n                                        :key=\"num\"\n                                        class=\"number-block\"\n                                    >\n                                        {{ num - 1 }}\n                                    </div>\n                                </div>\n                            </keep-alive>\n                        </template>\n                        <div class=\"container-content-unit\">\n                            <span>%</span>\n                        </div>\n                    </div>\n                </div>\n            </div>\n            <div class=\"section-bottom flex-column\">\n                <div class=\"section-content-wrapper flex-between\">\n                    <div\n                        :class=\"`type-content type${item.dictValue}`\"\n                        v-for=\"item in pieData.slice(0, 2)\"\n                        :key=\"item.dictValue\"\n                    >\n                        <div class=\"label\">{{ item.name }}</div>\n                        <div class=\"count\">\n                            <span>{{ item.value }}</span\n                            ><span class=\"unit\">辆</span>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"section-content-wrapper flex-between\">\n                    <div\n                        :class=\"`type-content type${item.dictValue}`\"\n                        v-for=\"item in pieData.slice(-2)\"\n                        :key=\"item.dictValue\"\n                    >\n                        <div class=\"label\">{{ item.name }}</div>\n                        <div class=\"count\">\n                            <span>{{ item.value }}</span\n                            ><span class=\"unit\">辆</span>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"center-wrapper flex-center\">\n                    <div id=\"pie-chart\"></div>\n                </div>\n            </div>\n        </div>\n    </div>\n    <div class=\"right-sidebar blue-border\">\n        <div class=\"lane-info\">\n            <div class=\"section-header\">\n                <span>车道信息</span>\n            </div>\n            <div class=\"lane-wrapper\">\n                <div class=\"lane-total flex-around\">\n                    <img\n                        src=\"../../assets/img/bigScreen/icon-lane1.png\"\n                        class=\"img-lane\"\n                    />\n                    <span class=\"lane-label\">车道总数</span>\n                    <img\n                        src=\"../../assets/img/bigScreen/icon-arrow.png\"\n                        class=\"img-arrow\"\n                    />\n                    <span class=\"lane-count\">{{ laneDataTotal }}</span>\n                </div>\n                <div class=\"lane-type flex-around\">\n                    <div class=\"lane-type-item\">\n                        <div class=\"label\">ETC车道</div>\n                        <div class=\"count\">{{ laneDataETC }}</div>\n                    </div>\n                    <div class=\"lane-type-item\">\n                        <div class=\"label\">混合车道</div>\n                        <div class=\"count\">{{ laneDataMixin }}</div>\n                    </div>\n                </div>\n            </div>\n        </div>\n        <div class=\"device-info\">\n            <div class=\"section-header\">\n                <span>设备信息</span>\n            </div>\n            <div class=\"device-wrapper\">\n                <div class=\"guage-wrapper flex-around\">\n                    <div class=\"guage-content\">\n                        <img\n                            class=\"pan\"\n                            :src=\"\n                                require('@/assets/img/bigScreen/gauge.png')\n                            \"\n                            alt=\"仪表盘\"\n                        />\n                        <keep-alive>\n                            <img\n                                class=\"zhen\"\n                                :style=\"`transform: rotate(${\n                                    (onlineRate / 100) * 268 - 132\n                                }deg)`\"\n                                :src=\"\n                                    require('@/assets/img/bigScreen/zhen.png')\n                                \"\n                            />\n                        </keep-alive>\n                        <div class=\"device-rate-count\">\n                            {{ onlineRate }}<span>%</span>\n                        </div>\n                        <div class=\"device-rate-label\">设备在线率</div>\n                    </div>\n                    <div class=\"device-status\">\n                        <div class=\"status-item item1 flex-column\">\n                            <div class=\"label\">在线设备</div>\n                            <div class=\"count\">{{ onlineDevice }}</div>\n                        </div>\n                        <div class=\"status-item item2 flex-column\">\n                            <div class=\"label\">离线设备</div>\n                            <div class=\"count\">{{ offlineDevice }}</div>\n                        </div>\n                        <div class=\"status-item item3 flex-column\">\n                            <div class=\"label\">故障设备</div>\n                            <div class=\"count\">{{ faultDevice }}</div>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"table-wrapper\">\n                    <div class=\"scroll-table-header\">\n                        <div\n                            class=\"header-item\"\n                            v-for=\"column in scrollheader\"\n                            :key=\"column.name\"\n                            :style=\"{width: column.width}\"\n                        >\n                            {{ column.name }}\n                        </div>\n                    </div>\n                    <div\n                        v-if=\"\n                            !scrollListData.length &&\n                            !loadObj.scrollListData\n                        \"\n                        class=\"scroll-table-body flex-center\"\n                    >\n                        暂无数据\n                    </div>\n                    <vue-seamless-scroll\n                        v-else\n                        v-loading=\"loadObj.scrollListData\"\n                        :element-loading-background=\"loadingColor\"\n                        class=\"scroll-table-body\"\n                        :data=\"scrollListData\"\n                        :class-option=\"optionSingleHeightTime\"\n                    >\n                        <div\n                            class=\"scroll-table-column\"\n                            v-for=\"column in scrollListData\"\n                            :key=\"column.id\"\n                        >\n                            <div\n                                class=\"column-item ellipsis\"\n                                style=\"width: 38%\"\n                                :title=\"column.code\"\n                            >\n                                {{ column.code }}\n                            </div>\n                            <div\n                                class=\"column-item ellipsis\"\n                                style=\"width: 38%\"\n                                :title=\"column.name\"\n                            >\n                                {{ column.name }}\n                            </div>\n                            <div\n                                class=\"column-item ellipsis flex-center\"\n                                style=\"width: 24%\"\n                            >\n                                <div class=\"flex-center\">\n                                    <span\n                                        :class=\"[\n                                            'dot',\n                                            `dot${column.status}`,\n                                            {dotshine: column.status !== 1},\n                                        ]\"\n                                    ></span>\n                                    <span>{{\n                                        formatStatus(column.status)\n                                    }}</span>\n                                </div>\n                            </div>\n                        </div>\n                    </vue-seamless-scroll>\n                </div>\n            </div>\n        </div>\n    </div>\n    <div\n        :class=\"[\n            'device-selector',\n            'flex-center',\n            {'show-device': showDevice},\n        ]\"\n    >\n        <div\n            class=\"device-hidden-btn\"\n            v-show=\"!showDevice\"\n            @click=\"showDevice = true\"\n        >\n            <img src=\"../../assets/img/bigScreen/device-layer.png\" />\n        </div>\n        <div v-show=\"showDevice\" class=\"device-layer\">\n            <div class=\"title flex-between\">\n                <span class=\"flex-between\">\n                    <img\n                        class=\"title-icon\"\n                        src=\"../../assets/img/bigScreen/icon-lane1.png\"\n                    />\n                    <span>设备信息</span>\n                    <!-- <el-popover\n                        placement=\"bottom\"\n                        width=\"220\"\n                        trigger=\"hover\"\n                        content=\"设备类型最多可选三类同时展示。\"\n                    >\n                        <i class=\"el-icon-info\" slot=\"reference\" />\n                    </el-popover> -->\n                </span>\n                <i\n                    class=\"el-icon-d-arrow-left\"\n                    @click=\"showDevice = false\"\n                />\n            </div>\n            <div class=\"select-options\">\n                <!-- :max=\"3\" -->\n                <el-checkbox-group\n                    @change=\"changeDeviceList\"\n                    class=\"options-wrapper\"\n                    v-model=\"checkListDevice\"\n                >\n                    <el-checkbox\n                        v-for=\"item in btnType\"\n                        :key=\"item.value\"\n                        :label=\"item.name\"\n                    ></el-checkbox>\n                </el-checkbox-group>\n            </div>\n            <div class=\"title flex-between\">\n                <span class=\"flex-between\">\n                    <img\n                        class=\"title-icon\"\n                        src=\"../../assets/img/bigScreen/icon-lane1.png\"\n                    />\n                    <span>车道信息</span>\n                </span>\n            </div>\n            <div class=\"select-options\">\n                <el-checkbox-group\n                    @change=\"changeDeviceList\"\n                    v-model=\"checkListLane\"\n                    class=\"options-wrapper\"\n                >\n                    <el-checkbox label=\"入口\"></el-checkbox>\n                    <el-checkbox label=\"出口\"></el-checkbox>\n                </el-checkbox-group>\n            </div>\n        </div>\n    </div>\n</div>\n",null]}