Commit f2676ee2 authored by 李志鸣's avatar 李志鸣

Merge branch 'dev' of git.vtstar.net:zhongtong/zhongtong-avi-web into dev

parents 26fc373a 61725d1f
<template> <template>
<div> <div>面/漆</div>
<span>面/色漆工作区</span>
</div>
</template> </template>
<script> <script>
export default { /**
* @author MARS 2019-09-28 <wangyunfan@vtstar.net>
* @fileoverview 面/漆作业区
*/
export default {
data () { data () {
return {} return {}
} },
}
</script>
<style> mounted () {},
methods: {}
}
</script>
<style lang="scss" scoped>
</style> </style>
<template> <template>
<div> <div class="page-body">中涂作业区</div>
<span>中涂作业区</span>
</div>
</template> </template>
<script> <script>
export default { /**
* @author MARS 2019-09-28 <wangyunfan@vtstar.net>
* @fileoverview 中涂作业区
*/
export default {
data () { data () {
return {} return {}
} },
}
</script>
<style> mounted () {},
methods: {}
}
</script>
<style lang="scss" scoped>
.page-body {
background: #001927;
}
</style> </style>
<template> <template>
<div> <div class="page-body">
<span>腻子工作区</span> <div class="putty-content">
<div
class="putty-row-1-1"
v-if="show"
>
<p>CDA233231231231321312</p>
</div>
<div class="putty-row-1-2">
<p>CDA213</p>
</div>
<div class="putty-row-1-3">
<p>CDA213</p>
</div>
<div class="putty-row-1-4">
<p>CDA213</p>
</div>
<div class="putty-row-1-5">
<p>CDA213</p>
</div>
<div class="putty-row-1-6">
<p>CDA213</p>
</div>
<div class="putty-row-2-1">
<p>CDA213</p>
</div>
<div class="putty-row-2-2">
<p>CDA213</p>
</div>
<div class="putty-row-2-3">
<p>CDA213</p>
</div>
<div class="putty-row-2-4">
<p>CDA213</p>
</div>
<div class="putty-row-2-5">
<p>CDA213</p>
</div>
<div class="putty-row-2-6">
<p>CDA213</p>
</div>
<div class="putty-row-3-1">
<p>CDA213</p>
</div>
<div class="putty-row-3-2">
<p>CDA213</p>
</div>
<div class="putty-row-3-3">
<p>CDA213</p>
</div>
<div class="putty-row-3-4">
<p>CDA213</p>
</div>
<div class="putty-row-3-5">
<p>CDA213</p>
</div>
<div class="putty-row-3-6">
<p>CDA213</p>
</div>
<div class="putty-row-4-1">
<p>CDA213</p>
</div>
<div class="putty-row-4-2">
<p>CDA213</p>
</div>
<div class="putty-row-4-3">
<p>CDA213</p>
</div>
<div class="putty-row-4-4">
<p>CDA213</p>
</div>
<div class="putty-row-4-5">
<p>CDA213</p>
</div>
<div class="putty-row-4-6">
<p>CDA213</p>
</div>
<div
class="putty-row-5-6"
@click="showPopover(data.pr56)"
>
<p>{{ data.pr56.name }}</p>
</div>
</div>
<el-popover
placement="bottom"
title="标题"
width="200"
trigger="click"
content='1111111111111111'
>
<el-button slot="reference">click 激活</el-button>
</el-popover>
</div> </div>
</template> </template>
<script> <script>
export default { /**
* @author MARS 2019-09-28 <wangyunfan@vtstar.net>
* @fileoverview 腻子作业区
*/
export default {
data () { data () {
return {} return {
show: true,
data: {
pr56: {
name: 'SDE1111'
},
pr561: {},
pr562: {},
pr536: {}
}
}
},
mounted () {},
methods: {
/**
* @method 点击展示popover
* @description
*/
showPopover (val) {
console.log(val)
} }
} }
}
</script> </script>
<style lang="scss" scoped>
.page-body {
height: 100%;
background: rgba(0, 7, 12, 1);
<style> .putty-content {
position: relative;
margin: 0 auto;
width: 1600px;
height: 900px;
background: url('../../../assets/images/Monitor/putty-bg.png') no-repeat;
// ? 公共样式
.putty-row-1-1,
.putty-row-1-2,
.putty-row-1-3,
.putty-row-1-4,
.putty-row-1-5,
.putty-row-1-6,
.putty-row-2-1,
.putty-row-2-2,
.putty-row-2-3,
.putty-row-2-4,
.putty-row-2-5,
.putty-row-2-6,
.putty-row-3-1,
.putty-row-3-2,
.putty-row-3-3,
.putty-row-3-4,
.putty-row-3-5,
.putty-row-3-6,
.putty-row-4-1,
.putty-row-4-2,
.putty-row-4-3,
.putty-row-4-4,
.putty-row-4-5,
.putty-row-4-6,
.putty-row-5-6 {
position: absolute;
width: 140px;
height: 50px;
cursor: pointer;
background: url('../../../assets/images/Monitor/monitor_car.png') no-repeat;
background-size: 35px 18px;
background-position: 0 16px;
p {
font-size: 14px;
margin: 0;
color: #ffffff;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
img {
width: 35px;
height: 18px;
}
}
// ? 第一行top定位
.putty-row-1-1,
.putty-row-1-2,
.putty-row-1-3,
.putty-row-1-4,
.putty-row-1-5,
.putty-row-1-6 {
top: 308px;
}
// ?第二行top定位
.putty-row-2-1,
.putty-row-2-2,
.putty-row-2-3,
.putty-row-2-4,
.putty-row-2-5,
.putty-row-2-6 {
top: 398px;
}
// ?第三行top定位
.putty-row-3-1,
.putty-row-3-2,
.putty-row-3-3,
.putty-row-3-4,
.putty-row-3-5,
.putty-row-3-6 {
top: 485px;
}
// ?第四行top定位
.putty-row-4-1,
.putty-row-4-2,
.putty-row-4-3,
.putty-row-4-4,
.putty-row-4-5,
.putty-row-4-6 {
top: 575px;
}
// ?一, 二行left定位
.putty-row-1-1,
.putty-row-2-1 {
left: 170px;
}
.putty-row-1-2,
.putty-row-2-2 {
left: 400px;
}
.putty-row-1-3,
.putty-row-2-3 {
left: 575px;
}
.putty-row-1-4,
.putty-row-2-4 {
left: 755px;
}
.putty-row-1-5,
.putty-row-2-5 {
left: 891px;
}
.putty-row-1-6,
.putty-row-2-6 {
left: 1256px;
}
// ?三, 四行left定位
.putty-row-3-1,
.putty-row-4-1 {
left: 220px;
}
.putty-row-3-2,
.putty-row-4-2 {
left: 355px;
}
.putty-row-3-3,
.putty-row-4-3 {
left: 575px;
}
.putty-row-3-4,
.putty-row-4-4 {
left: 710px;
}
.putty-row-3-5,
.putty-row-4-5 {
left: 891px;
}
.putty-row-3-6,
.putty-row-4-6,
.putty-row-5-6 {
left: 1256px;
}
.putty-row-5-6 {
top: 655px;
}
}
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment