<template>
|
<div class="page-view-container">
|
<slot name="function"/>
|
<div class="header-container">现场情况上报平台</div>
|
<div class="content-container">
|
<a-row>
|
<a-col :span="8">
|
<div class="button" @click="navigateTo('work','上班')">上班</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button">下班</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button" @click="navigateTo('fault','设备故障')">设备故障</div>
|
</a-col>
|
</a-row>
|
<a-row>
|
<a-col :span="8">
|
<div class="button" @click="navigateTo('close','停机上报')">停机上报</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button" @click="navigateTo('spotCheck','点检')">点检</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button">合格率</div>
|
</a-col>
|
</a-row>
|
<a-row>
|
<a-col :span="8">
|
<div class="button">程序呼叫</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button">开工完工</div>
|
</a-col>
|
<a-col :span="8">
|
<div class="button">程序回传</div>
|
</a-col>
|
</a-row>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: 'TerminalIndex',
|
methods: {
|
navigateTo(url, projectTitle) {
|
this.$router.push('/terminal/' + url)
|
document.title = 'MDC智慧车间-' + projectTitle
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
.page-view-container {
|
background: linear-gradient(to bottom, #fff -15%, #000 55%,);
|
|
.header-container {
|
font-size: 50px;
|
color: #eee;
|
text-align: center;
|
height: 15%;
|
display: flex;
|
justify-content: center;
|
align-items: flex-end;
|
-webkit-align-items: flex-end;
|
}
|
|
.content-container {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
padding: 3% 10%;
|
|
.ant-row {
|
flex: 1;
|
|
.ant-col {
|
height: 100%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
|
.button {
|
width: 250px;
|
height: 125px;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
background-color: #E3F2D9;
|
font-size: 45px;
|
border: 2px solid #33579D;
|
box-shadow: inset -5px 5px 12px rgba(0, 0, 0, 0.6);
|
cursor: pointer;
|
transition: all .1s ease-in-out;
|
|
&:hover {
|
transform: scale(1.05);
|
}
|
}
|
}
|
/*display: flex;*/
|
/*flex-direction: column;*/
|
}
|
}
|
}
|
|
</style>
|
