|
@@ -1,328 +1,502 @@
|
|
|
<template>
|
|
|
- <div id="playerMap" ref="playerMap" class="app-container yunMapDiv" style="height:200%;">
|
|
|
- <!-- 全屏 -->
|
|
|
- <el-row :gutter="20" class="rowCls">
|
|
|
- <div class="headerBg">
|
|
|
- <h2>现场工控端</h2>
|
|
|
- <div class="battonDiv">
|
|
|
- <el-tooltip v-if="!isFullSreen" class="item" effect="dark" :content="$t('largeScreen.common.screening')" placement="top-start">
|
|
|
- <a @click="fullPing()"><i class="el-icon-full-screen"></i></a>
|
|
|
- </el-tooltip>
|
|
|
- <el-tooltip v-else class="item" effect="dark" :content="$t('largeScreen.common.cancel')" placement="top-start">
|
|
|
- <a @click="exitFullPing()"><i class="el-icon-switch-button"></i></a>
|
|
|
- </el-tooltip>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--
|
|
|
+ <div
|
|
|
+ id="playerMap"
|
|
|
+ ref="playerMap"
|
|
|
+ class="app-container yunMapDiv"
|
|
|
+ style="height: 200%"
|
|
|
+ >
|
|
|
+ <!-- 全屏 -->
|
|
|
+ <el-row :gutter="20" class="rowCls">
|
|
|
+ <div class="headerBg">
|
|
|
+ <h2>现场工控端</h2>
|
|
|
+ <div class="battonDiv">
|
|
|
+ <el-tooltip
|
|
|
+ v-if="!isFullSreen"
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="$t('largeScreen.common.screening')"
|
|
|
+ placement="top-start"
|
|
|
+ >
|
|
|
+ <a @click="fullPing()"><i class="el-icon-full-screen"></i></a>
|
|
|
+ </el-tooltip>
|
|
|
+ <el-tooltip
|
|
|
+ v-else
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="$t('largeScreen.common.cancel')"
|
|
|
+ placement="top-start"
|
|
|
+ >
|
|
|
+ <a @click="exitFullPing()"><i class="el-icon-switch-button"></i></a>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--
|
|
|
<el-image
|
|
|
style="width: 100%; height: 100%"
|
|
|
:src="url"
|
|
|
fit="fill"
|
|
|
- ></el-image> -->
|
|
|
- </el-row>
|
|
|
+ ></el-image> -->
|
|
|
+ </el-row>
|
|
|
|
|
|
- <!-- 区域模块 -->
|
|
|
- <div style="text-align:left;margin-left:5%;">
|
|
|
- <!-- 搜索-部分 -->
|
|
|
- <div class="defaultRow noBorder">
|
|
|
- <el-select v-model="opValue" :span="2" @change="selectChange" :placeholder='$t("common.pleaseSelect")'>
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.name"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
+ <!-- 区域模块 -->
|
|
|
+ <div style="text-align: left; margin-left: 5%">
|
|
|
+ <!-- 搜索-部分 -->
|
|
|
+ <div class="defaultRow noBorder">
|
|
|
+ <el-select
|
|
|
+ v-model="opValue"
|
|
|
+ :span="2"
|
|
|
+ @change="selectChange"
|
|
|
+ :placeholder="$t('common.pleaseSelect')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
|
|
|
- <span :span="2" style="margin-left: 2%;">
|
|
|
- <el-button plain type="primary" icon="el-icon-view" size="medium" @click="readView" >
|
|
|
- 读RFID
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- <span :span="2" style="margin-right: 5%; float:right;">
|
|
|
- <el-button plain type="primary" icon="el-icon-view" size="medium" @click="navigator">
|
|
|
- 我的班表
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- </div>
|
|
|
+ <span :span="2" style="margin-left: 2%">
|
|
|
+ <el-button
|
|
|
+ plain
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-view"
|
|
|
+ size="medium"
|
|
|
+ @click="readView"
|
|
|
+ >
|
|
|
+ 读RFID
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ <span :span="2" style="margin-right: 5%; float: right">
|
|
|
+ <el-button
|
|
|
+ plain
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-view"
|
|
|
+ size="medium"
|
|
|
+ @click="navigator"
|
|
|
+ >
|
|
|
+ 我的班表
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
|
|
|
- <el-tabs style="text-align: left;margin-top:25px;">
|
|
|
- <el-tab-pane label="未完成">
|
|
|
- <span class="tabTitle" slot="label"><el-badge :value="taskCount" class="badge"><i class="el-icon-date"></i> 未完成</el-badge> </span>
|
|
|
- <el-col :span="(index==0)? 12:8" :gutter="24" v-for="(item, index) in taskData.slice(0,3)" :key="item.id" :offset="(index==0)?0:1" v-show="(item.status==0)?true:false" :style="(index==0)?'zoom:1;min-width:300px;':'zoom:0.6;min-width:180px;'">
|
|
|
- <el-card :gutter="24" class="box-card" style="margin:5px;" >
|
|
|
- <div class="card_content">
|
|
|
- <div class="block card_header">
|
|
|
- <el-image
|
|
|
- style="width: 90px; height: 80px;max-width:200%;max-height:200%;"
|
|
|
- :src="resolveLogo('status'+(index+1)+'.png')"
|
|
|
- fit="fill"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- <span>{{ item.taskName }}</span>
|
|
|
- <div class="itemNo">任务编号: {{ item.no }}</div>
|
|
|
- </div>
|
|
|
- <el-form style="margin-top:10px;">
|
|
|
- <el-form-item label="零件名称:" >
|
|
|
- <span>{{ item.name }}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="工序号:" >
|
|
|
- <span>{{ item.taskNo }}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="托盘编号:" >
|
|
|
- <span>{{ item.trayNo }}</span>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="额定时间:" >
|
|
|
- <span>{{ item.time }}分钟</span>
|
|
|
- <div class="timeprogress">
|
|
|
- <el-progress :text-inside="true" :stroke-width="15" :percentage="setPercentage(item.time, item.left)" color="#FF3366" :format="setItemText(item.time, item.left)" ></el-progress>
|
|
|
- </div>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item>
|
|
|
- <span style="margin:2% 0; float:right;">
|
|
|
- <el-button plain type="primary" icon="el-icon-view" size="medium" @click="finishTask(item)">
|
|
|
- 完成
|
|
|
- </el-button>
|
|
|
- </span>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- </el-card>
|
|
|
- </el-col>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane label="已完成">
|
|
|
- <span class="tabTitle" slot="label">
|
|
|
- <i class="el-icon-date"></i> 已完成
|
|
|
- </span>
|
|
|
- <el-table
|
|
|
- :data="finishData"
|
|
|
- stripe
|
|
|
- style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- prop="taskName"
|
|
|
- label="名称"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="name"
|
|
|
- label="零件名"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="no"
|
|
|
- label="编号"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="taskNo"
|
|
|
- label="工序号"
|
|
|
- width="150">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="trayNo"
|
|
|
- label="托盘编号"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- </div>
|
|
|
- <!-- 【查看】组件 -->
|
|
|
- <task-view
|
|
|
- ref="view"
|
|
|
- :dialog-visible="tenantViewVisible"
|
|
|
- @get-data="showRFID"
|
|
|
- @close="viewClose"
|
|
|
- />
|
|
|
- </div>
|
|
|
+ <el-tabs style="text-align: left; margin-top: 25px">
|
|
|
+ <el-tab-pane label="未完成">
|
|
|
+ <span class="tabTitle" slot="label"
|
|
|
+ ><el-badge :value="taskCount" class="badge"
|
|
|
+ ><i class="el-icon-date"></i> 未完成</el-badge
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ <el-col
|
|
|
+ :span="index == 0 ? 12 : 8"
|
|
|
+ :gutter="24"
|
|
|
+ v-for="(item, index) in taskData.slice(0, 3)"
|
|
|
+ :key="item.id"
|
|
|
+ :offset="index == 0 ? 0 : 1"
|
|
|
+ v-show="item.status == 0 ? true : false"
|
|
|
+ :style="
|
|
|
+ index == 0
|
|
|
+ ? 'zoom:1;min-width:300px;'
|
|
|
+ : 'zoom:0.6;min-width:180px;'
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <el-card :gutter="24" class="box-card" style="margin: 5px">
|
|
|
+ <div class="card_content">
|
|
|
+ <div class="block card_header">
|
|
|
+ <el-image
|
|
|
+ style="
|
|
|
+ width: 90px;
|
|
|
+ height: 80px;
|
|
|
+ max-width: 200%;
|
|
|
+ max-height: 200%;
|
|
|
+ "
|
|
|
+ :src="resolveLogo('status' + (index + 1) + '.png')"
|
|
|
+ fit="fill"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ <span>{{ item.taskName }}</span>
|
|
|
+ <div class="itemNo">任务编号: {{ item.no }}</div>
|
|
|
+ </div>
|
|
|
+ <el-form style="margin-top: 10px">
|
|
|
+ <el-form-item label="零件名称:">
|
|
|
+ <span>{{ item.name }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="工序号:">
|
|
|
+ <span>{{ item.taskNo }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="托盘编号:">
|
|
|
+ <span>{{ item.trayNo }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="额定时间:">
|
|
|
+ <span>{{ item.time }}分钟</span>
|
|
|
+ <div class="timeprogress">
|
|
|
+ <el-progress
|
|
|
+ :text-inside="true"
|
|
|
+ :stroke-width="15"
|
|
|
+ :percentage="setPercentage(item.time, item.left)"
|
|
|
+ color="#FF3366"
|
|
|
+ :format="setItemText(item.time, item.left)"
|
|
|
+ ></el-progress>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <span style="margin: 2% 0; float: right">
|
|
|
+ <el-button
|
|
|
+ plain
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-view"
|
|
|
+ size="medium"
|
|
|
+ :disabled="index == 0 ? false : true"
|
|
|
+ @click="finishTask(item)"
|
|
|
+ >
|
|
|
+ 完成
|
|
|
+ </el-button>
|
|
|
+ </span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="已完成">
|
|
|
+ <span class="tabTitle" slot="label">
|
|
|
+ <i class="el-icon-date"></i> 已完成
|
|
|
+ </span>
|
|
|
+ <div class="tableTransparent">
|
|
|
+ <el-table
|
|
|
+ :data="finishData"
|
|
|
+ border
|
|
|
+ style="height:100%;min-height:80px;"
|
|
|
+ :header-cell-style="{ background: '#1890ff', color: '#fff' }"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('common.serialNo')"
|
|
|
+ width="55px"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{
|
|
|
+ scope.$index +
|
|
|
+ (queryParams.current - 1) * queryParams.size +
|
|
|
+ 1
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="name" label="零件名称" width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="taskNo" label="工序号" width="80">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="taskName" label="工序名称" width="100">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="planTime" label="额定时间" width="100">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="activeTime" label="实际时间" width="100">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="startTime" label="开始时间" width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="endTime" label="结束时间" width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="overTime" label="是否超时" width="100">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.overTime ? "是" : "否" }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ <!-- 【查看】组件 -->
|
|
|
+ <task-view
|
|
|
+ ref="view"
|
|
|
+ :dialog-visible="tenantViewVisible"
|
|
|
+ @get-data="showRFID"
|
|
|
+ @close="viewClose"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
|
|
|
<script>
|
|
|
- // 【查看】组件
|
|
|
- import TaskView from "../waitingTasks/components/View"
|
|
|
- import { fullScreen, exitFullScreen } from '@/utils/commons'
|
|
|
- import stationMgrApi from "@/api/machiningClient/stationMgr";
|
|
|
+// 【查看】组件
|
|
|
+import TaskView from "../waitingTasks/components/View";
|
|
|
+import { fullScreen, exitFullScreen, initQueryParams } from "@/utils/commons";
|
|
|
+import stationMgrApi from "@/api/machiningClient/stationMgr";
|
|
|
export default {
|
|
|
- name: 'TouchScreen',
|
|
|
+ name: "TouchScreen",
|
|
|
components: { TaskView },
|
|
|
- props: {
|
|
|
- },
|
|
|
- data () {
|
|
|
+ props: {},
|
|
|
+ data() {
|
|
|
return {
|
|
|
- options:[{name:"上下料站1",value:1},{name:"上下料站2",value:2},{name:"上下料站2",value:3},{name:"上下料站4",value:4}],
|
|
|
- opValue: 1,
|
|
|
- taskCount:6,
|
|
|
- taskData:[{id:1,taskName:"上料",no:"12235566",name:"框体",taskNo:"OP10",trayNo:"TP7788",time:15,left:2,status:0},{id:2,taskName:"翻面",no:"12235566",name:"框体",taskNo:"OP50",trayNo:"TP7788",time:25,left:6,status:0},{id:3,taskName:"下料",no:"12235566",name:"框体",taskNo:"OP90",trayNo:"TP7788",time:5,left:1,status:0},{id:4,taskName:"下料",no:"12235566",name:"框体",taskNo:"OP90",trayNo:"TP7788",time:5,left:1,status:0}],
|
|
|
- finishData:[],
|
|
|
- step: 1,
|
|
|
- tenantViewVisible: false,
|
|
|
- isFullSreen: false, // 默认不全屏
|
|
|
- }
|
|
|
- },
|
|
|
- // 实例已经在内存中创建好,此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法,最早只能在created中操作
|
|
|
- created() {
|
|
|
- this.fetch()
|
|
|
- },
|
|
|
- computed: {
|
|
|
- currentUser () {
|
|
|
- return this.$store.state.account.user
|
|
|
- }
|
|
|
- },
|
|
|
- mounted () {
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
- // 全屏
|
|
|
- fullPing(){
|
|
|
- this.$nextTick(() => {
|
|
|
- // 显示【退出全屏】
|
|
|
- this.isFullSreen = true
|
|
|
- // 如果是退出全屏
|
|
|
- let $playerMap = this.$refs.playerMap
|
|
|
- if($playerMap){
|
|
|
- fullScreen($playerMap)
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- // 退出全屏
|
|
|
- exitFullPing(){
|
|
|
- this.$nextTick(() => {
|
|
|
- // 显示【全屏】
|
|
|
- this.isFullSreen = false
|
|
|
- // 如果是全屏
|
|
|
- exitFullScreen(document.getElementById('playerMap'))
|
|
|
- })
|
|
|
- },
|
|
|
- selectChange(value){
|
|
|
- console.log(value)
|
|
|
- },
|
|
|
- fetch(){
|
|
|
- stationMgrApi.getStation({userId:this.$store.state.account.user.id}).then((res) => {
|
|
|
- res = res.data;
|
|
|
- if(res.isSuccess){
|
|
|
- if(res.data.length>0){
|
|
|
- this.options = res.data
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- readView(){
|
|
|
- //this.tenantViewVisible = true
|
|
|
- this.$refs.view.read(null)
|
|
|
- },
|
|
|
- showRFID(code){
|
|
|
- console.log(code)
|
|
|
- },
|
|
|
- resolveLogo(logo) {
|
|
|
- return require(`@/assets/yunMap/${logo}`);
|
|
|
+ queryParams: initQueryParams({}),
|
|
|
+ options: [
|
|
|
+ { name: "上下料站1", value: 1 },
|
|
|
+ { name: "上下料站2", value: 2 },
|
|
|
+ { name: "上下料站2", value: 3 },
|
|
|
+ { name: "上下料站4", value: 4 },
|
|
|
+ ],
|
|
|
+ opValue: 1,
|
|
|
+ taskCount: 6,
|
|
|
+ taskData: [
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ taskName: "上料",
|
|
|
+ no: "12235566",
|
|
|
+ name: "框体",
|
|
|
+ taskNo: "OP10",
|
|
|
+ trayNo: "TP7788",
|
|
|
+ time: 15,
|
|
|
+ left: 2,
|
|
|
+ status: 0,
|
|
|
},
|
|
|
- viewClose () {
|
|
|
- this.tenantViewVisible = false
|
|
|
- },
|
|
|
- setPercentage(time, left){
|
|
|
- return this.formatGap(time, left)[0]>100? 100 : this.formatGap(time, left)[0]
|
|
|
- },
|
|
|
- // 设置进度文本内容
|
|
|
- setItemText(time, left){
|
|
|
- return () => {
|
|
|
- return this.formatGap(time, left)[1]
|
|
|
- }
|
|
|
- },
|
|
|
- //时间差转换
|
|
|
- formatGap(time, left) {
|
|
|
- return [Number(parseInt(100*left/time)), "剩余"+ left +"分钟"]
|
|
|
- },
|
|
|
- finishTask(item){
|
|
|
- item.status = 1
|
|
|
- this.taskCount = this.taskCount - 1
|
|
|
- this.finishData.push(item)
|
|
|
- this.taskData.shift()
|
|
|
- },
|
|
|
- navigator(){
|
|
|
- this.$router.push("/classScheduleMgr/classScheduleMgr")
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ taskName: "翻面",
|
|
|
+ no: "12235566",
|
|
|
+ name: "框体",
|
|
|
+ taskNo: "OP50",
|
|
|
+ trayNo: "TP7788",
|
|
|
+ time: 25,
|
|
|
+ left: 6,
|
|
|
+ status: 0,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ taskName: "下料",
|
|
|
+ no: "12235566",
|
|
|
+ name: "框体",
|
|
|
+ taskNo: "OP90",
|
|
|
+ trayNo: "TP7788",
|
|
|
+ time: 5,
|
|
|
+ left: 1,
|
|
|
+ status: 0,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ taskName: "下料",
|
|
|
+ no: "12235566",
|
|
|
+ name: "框体",
|
|
|
+ taskNo: "OP90",
|
|
|
+ trayNo: "TP7788",
|
|
|
+ time: 5,
|
|
|
+ left: 1,
|
|
|
+ status: 0,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ finishData: [],
|
|
|
+ step: 1,
|
|
|
+ confirmDisabled: true,
|
|
|
+ tenantViewVisible: false,
|
|
|
+ isFullSreen: false, // 默认不全屏
|
|
|
+ };
|
|
|
+ },
|
|
|
+ // 实例已经在内存中创建好,此时data和methods已将ok,如果要操作data中的数据或是调用methods中的方法,最早只能在created中操作
|
|
|
+ created() {
|
|
|
+ this.fetch();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ currentUser() {
|
|
|
+ return this.$store.state.account.user;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ // 全屏
|
|
|
+ fullPing() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ // 显示【退出全屏】
|
|
|
+ this.isFullSreen = true;
|
|
|
+ // 如果是退出全屏
|
|
|
+ let $playerMap = this.$refs.playerMap;
|
|
|
+ if ($playerMap) {
|
|
|
+ fullScreen($playerMap);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ // 退出全屏
|
|
|
+ exitFullPing() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ // 显示【全屏】
|
|
|
+ this.isFullSreen = false;
|
|
|
+ // 如果是全屏
|
|
|
+ exitFullScreen(document.getElementById("playerMap"));
|
|
|
+ });
|
|
|
+ },
|
|
|
+ selectChange(value) {
|
|
|
+ console.log(value);
|
|
|
+ },
|
|
|
+ fetch() {
|
|
|
+ stationMgrApi
|
|
|
+ .getStation({ userId: this.$store.state.account.user.id })
|
|
|
+ .then((res) => {
|
|
|
+ res = res.data;
|
|
|
+ if (res.isSuccess) {
|
|
|
+ if (res.data.length > 0) {
|
|
|
+ this.options = res.data;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ readView() {
|
|
|
+ //this.tenantViewVisible = true
|
|
|
+ this.$refs.view.read(null);
|
|
|
+ },
|
|
|
+ showRFID(code) {
|
|
|
+ console.log(code);
|
|
|
+ },
|
|
|
+ resolveLogo(logo) {
|
|
|
+ return require(`@/assets/yunMap/${logo}`);
|
|
|
+ },
|
|
|
+ viewClose() {
|
|
|
+ this.tenantViewVisible = false;
|
|
|
+ },
|
|
|
+ setPercentage(time, left) {
|
|
|
+ return this.formatGap(time, left)[0] > 100
|
|
|
+ ? 100
|
|
|
+ : this.formatGap(time, left)[0];
|
|
|
+ },
|
|
|
+ // 设置进度文本内容
|
|
|
+ setItemText(time, left) {
|
|
|
+ return () => {
|
|
|
+ return this.formatGap(time, left)[1];
|
|
|
+ };
|
|
|
+ },
|
|
|
+ //时间差转换
|
|
|
+ formatGap(time, left) {
|
|
|
+ return [Number(parseInt((100 * left) / time)), "剩余" + left + "分钟"];
|
|
|
+ },
|
|
|
+ finishTask(item) {
|
|
|
+ item.status = 1;
|
|
|
+ this.taskCount = this.taskCount - 1;
|
|
|
+ let planTime = Math.ceil(Math.random() * 30);
|
|
|
+ let activeTime = Math.ceil(Math.random() * 30);
|
|
|
+ let currentTime = new Date();
|
|
|
+ //let currentTime2 = new Date(currentTime.valueOf() + activeTime * 60);
|
|
|
+ currentTime.setMinutes(currentTime.getMinutes() + activeTime);
|
|
|
+ let finishParams = {
|
|
|
+ planTime: planTime,
|
|
|
+ activeTime: activeTime,
|
|
|
+ startTime: this.getFullTime(new Date()),
|
|
|
+ endTime: this.getFullTime(currentTime),
|
|
|
+ overTime: planTime < activeTime ? true : false,
|
|
|
+ };
|
|
|
+ let result = Object.assign(item, finishParams);
|
|
|
+ this.finishData.push(result);
|
|
|
+ console.log(this.finishData);
|
|
|
+ this.taskData.shift();
|
|
|
+ },
|
|
|
+ getFullTime(date) {
|
|
|
+ var yy = date.getFullYear(); //年
|
|
|
+ var mm = date.getMonth() + 1; //月
|
|
|
+ var dd = date.getDate(); //日
|
|
|
+ var hh = date.getHours(); //时
|
|
|
+ var ii = date.getMinutes(); //分
|
|
|
+ var ss = date.getSeconds(); //秒
|
|
|
+ var clock = yy + "-";
|
|
|
+ if (mm < 10) clock += "0";
|
|
|
+ clock += mm + "-";
|
|
|
+ if (dd < 10) clock += "0";
|
|
|
+ clock += dd + " ";
|
|
|
+ if (hh < 10) clock += "0";
|
|
|
+ clock += hh + ":";
|
|
|
+ if (ii < 10) clock += "0";
|
|
|
+ clock += ii + ":";
|
|
|
+ if (ss < 10) clock += "0";
|
|
|
+ clock += ss;
|
|
|
+ return clock;
|
|
|
+ },
|
|
|
+ navigator() {
|
|
|
+ this.$router.push("/classScheduleMgr/classScheduleMgr");
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .tabDiv{
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- .battonDiv {
|
|
|
- z-index: 9;
|
|
|
- }
|
|
|
- }
|
|
|
- .tabTitle {
|
|
|
- font-size: 24px;
|
|
|
- height: 24px;
|
|
|
- line-height:24px;
|
|
|
- }
|
|
|
- .card_content{
|
|
|
- padding: 8px;
|
|
|
- width:100%;
|
|
|
- text-align:left;
|
|
|
- color:#fff;
|
|
|
- }
|
|
|
- .card_header{
|
|
|
- position:relative;
|
|
|
- border-bottom:1px solid #fff;
|
|
|
- margin:10px 0;
|
|
|
- }
|
|
|
- .indexNo {
|
|
|
- position:absolute;
|
|
|
- top:25%;
|
|
|
- left:9%;
|
|
|
- font-size:24px;
|
|
|
- line-height:24px;
|
|
|
- height:24px;
|
|
|
- color:#fff;
|
|
|
- z-index:999;
|
|
|
- }
|
|
|
- .indexNo2 {
|
|
|
- position:absolute;
|
|
|
- top:25%;
|
|
|
- left:6%;
|
|
|
- font-size:24px;
|
|
|
- line-height:24px;
|
|
|
- height:24px;
|
|
|
- color:#fff;
|
|
|
- z-index:999;
|
|
|
- }
|
|
|
- .itemNo {
|
|
|
- font-size:12px;
|
|
|
- line-height:12px;
|
|
|
- height:12px;
|
|
|
- text-align:right;
|
|
|
- color:#fff;
|
|
|
- margin-left:20%;
|
|
|
- margin-bottom:10px;
|
|
|
- }
|
|
|
- .timeprogress >>> .el-progress-bar__outer {
|
|
|
- background-color: #1890ff;
|
|
|
- }
|
|
|
- .timeprogress .el-progress-bar__inner {
|
|
|
- text-align:center;
|
|
|
- }
|
|
|
- .el-form-item >>> .el-form-item__label {
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .el-form-item {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .tabTitle >>> .el-badge {
|
|
|
- position: relative;
|
|
|
- display: inline-block;
|
|
|
- vertical-align: baseline;
|
|
|
- }
|
|
|
- .badge {
|
|
|
- margin-top: 10px;
|
|
|
- margin-right: 20px;
|
|
|
- }
|
|
|
+.tabDiv {
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ .battonDiv {
|
|
|
+ z-index: 9;
|
|
|
+ }
|
|
|
+}
|
|
|
+.tabTitle {
|
|
|
+ font-size: 24px;
|
|
|
+ height: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+}
|
|
|
+.card_content {
|
|
|
+ padding: 8px;
|
|
|
+ width: 100%;
|
|
|
+ text-align: left;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.card_header {
|
|
|
+ position: relative;
|
|
|
+ border-bottom: 1px solid #fff;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+.indexNo {
|
|
|
+ position: absolute;
|
|
|
+ top: 25%;
|
|
|
+ left: 9%;
|
|
|
+ font-size: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ height: 24px;
|
|
|
+ color: #fff;
|
|
|
+ z-index: 999;
|
|
|
+}
|
|
|
+.indexNo2 {
|
|
|
+ position: absolute;
|
|
|
+ top: 25%;
|
|
|
+ left: 6%;
|
|
|
+ font-size: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ height: 24px;
|
|
|
+ color: #fff;
|
|
|
+ z-index: 999;
|
|
|
+}
|
|
|
+.itemNo {
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 12px;
|
|
|
+ height: 12px;
|
|
|
+ text-align: right;
|
|
|
+ color: #fff;
|
|
|
+ margin-left: 20%;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.timeprogress >>> .el-progress-bar__outer {
|
|
|
+ background-color: #1890ff;
|
|
|
+}
|
|
|
+.timeprogress .el-progress-bar__inner {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.el-form-item >>> .el-form-item__label {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.el-form-item {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.tabTitle >>> .el-badge {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: baseline;
|
|
|
+}
|
|
|
+.badge {
|
|
|
+ margin-top: 10px;
|
|
|
+ margin-right: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.tableTransparent >>> .el-table,
|
|
|
+.el-table__expanded-cell {
|
|
|
+ background-color: transparent;
|
|
|
+}
|
|
|
</style>
|