lb #6
@ -292,21 +292,25 @@ export default {
|
|||||||
sparepartsProps,
|
sparepartsProps,
|
||||||
sparepartsDatalist,
|
sparepartsDatalist,
|
||||||
rightSideProps,
|
rightSideProps,
|
||||||
rightSideDatalist
|
rightSideDatalist,
|
||||||
// refreshKey: 0
|
// refreshKey: 0
|
||||||
|
scale: 1
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapGetters(['sidebar'])
|
...mapGetters(['sidebar'])
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
// window.addEventListener('resize', () => {
|
this.$nextTick(() => {
|
||||||
// console.log('resizing....')
|
this.scale = this.$refs['cockpit-container-equipment'].offsetWidth / 1920
|
||||||
// this.refreshSize++
|
this.$refs['cockpit-container-equipment'].style.setProperty('--scale', this.scale)
|
||||||
// this.$nextTick(() => {
|
|
||||||
// this.$forceUpdate()
|
this.$watch(() => this.$refs['cockpit-container-equipment'].offsetWidth, function(v, o) {
|
||||||
// })
|
console.log('resize ... ref..')
|
||||||
// }) // 不可行
|
this.scale = this.$refs['cockpit-container-equipment'].offsetWidth / 1920
|
||||||
|
this.$refs['cockpit-container-equipment'].style.setProperty('--scale', this.scale)
|
||||||
|
})
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
|||||||
@ -1,17 +1,36 @@
|
|||||||
<template>
|
<template>
|
||||||
<header class="techy-header">
|
<header class="techy-header">
|
||||||
<img class="logo-img" src="./logo.png" alt="cnbm">
|
<img class="logo-img" src="./logo.png" alt="cnbm" />
|
||||||
<span style="display: line-block; margin-left: calc(100vw / 1920 * 8); letter-spacing: 3px;">{{ headTitle }}</span>
|
<span class="techy-header__title">{{ headTitle }}</span>
|
||||||
|
|
||||||
<span class="fullscreen-btn" @click="handleClick('fullscreen')">
|
<!-- <div class="date">2022.10.14</div>
|
||||||
<span v-if="isFullScreen" v-html="unfullScreenSvg" />
|
<div class="time">20:12:24</div> -->
|
||||||
<span v-else v-html="fullScreenSvg" />
|
|
||||||
</span>
|
<div class="fullscreen-btn">
|
||||||
|
<!-- <span style="color: #52fff1; margin-right: 8px;" @click="handleClick('home')" v-html="homeSvg" /> -->
|
||||||
|
<span v-if="isFullScreen" @click="handleClick('fullscreen')" v-html="unfullScreenSvg" />
|
||||||
|
<span v-else @click="handleClick('fullscreen')" v-html="fullScreenSvg" />
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
// const homeSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
const homeSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<title>首页</title>
|
||||||
|
<g id="1大屏" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||||
|
<g id="1大屏-数字工厂总览" transform="translate(-1824.000000, -46.000000)" fill-rule="nonzero">
|
||||||
|
<g id="首页" transform="translate(1824.000000, 46.000000)">
|
||||||
|
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="32" height="32"></rect>
|
||||||
|
<path d="M3.36212554,9.99760304 L14.4561021,2.03491762 C15.37881,1.37257076 16.62119,1.37257076 17.5438979,2.03491762 L28.6378745,9.99760304 C29.7265595,10.7789878 30.3723957,12.0369335 30.3723957,13.3770071 L30.3723957,26.217608 C30.3723957,28.5153002 28.5096576,30.3780383 26.2119654,30.3780383 L5.78803465,30.3780383 C3.49034244,30.3780383 1.62760433,28.5153002 1.62760433,26.217608 L1.62760433,13.3773853 C1.62760433,12.0371783 2.27333209,10.7790656 3.36212554,9.99760304 Z M4.68552062,11.8410519 C4.19052975,12.196239 3.89692996,12.7681449 3.89692996,13.3773853 L3.89692996,26.217608 C3.89692996,27.2620363 4.74360637,28.1087127 5.78803465,28.1087127 L26.2119654,28.1087127 C27.2563936,28.1087127 28.10307,27.2620363 28.10307,26.217608 L28.10307,13.3773853 C28.10307,12.7681449 27.8094702,12.196239 27.3144794,11.8410519 L16.2205028,3.87836647 C16.0887105,3.78379718 15.9112895,3.78379718 15.7794972,3.87836647 L4.68552062,11.8414301 L4.68552062,11.8410519 Z" id="形状" fill="#42D0CE"></path>
|
||||||
|
<path d="M16.25,17 C16.8972087,17 17.4295339,17.4918747 17.4935464,18.1221948 L17.5,18.25 L17.5,28.25 C17.5,28.9403559 16.9403559,29.5 16.25,29.5 C15.6027913,29.5 15.0704661,29.0081253 15.0064536,28.3778052 L15,28.25 L15,18.25 C15,17.5596441 15.5596441,17 16.25,17 Z" id="路径-3" fill="#42D0CE"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>`
|
||||||
|
|
||||||
|
// const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
const fullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
<title>编组 54备份</title>
|
<title>编组 54备份</title>
|
||||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||||
<g id="2-4设备管理" transform="translate(-1864.000000, -162.000000)">
|
<g id="2-4设备管理" transform="translate(-1864.000000, -162.000000)">
|
||||||
@ -23,7 +42,8 @@ const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" versi
|
|||||||
</g>
|
</g>
|
||||||
</svg>`
|
</svg>`
|
||||||
|
|
||||||
const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
// const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
const unfullScreenSvg = `<svg style="width: 100%; height: 100%" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
<title>编组 54备份 2</title>
|
<title>编组 54备份 2</title>
|
||||||
<g id="3WMS。1、2、3、4、5、6" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
<g id="3WMS。1、2、3、4、5、6" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||||
<g id="编组-54备份-2">
|
<g id="编组-54备份-2">
|
||||||
@ -32,13 +52,13 @@ const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" ver
|
|||||||
</g>
|
</g>
|
||||||
</g>
|
</g>
|
||||||
</svg>`
|
</svg>`
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'TechyHeader',
|
name: 'TechyHeader',
|
||||||
props: ['headTitle'],
|
props: ['headTitle'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
fullScreenSvg,
|
fullScreenSvg,
|
||||||
|
homeSvg,
|
||||||
unfullScreenSvg,
|
unfullScreenSvg,
|
||||||
isFullScreen: false
|
isFullScreen: false
|
||||||
}
|
}
|
||||||
@ -48,6 +68,8 @@ export default {
|
|||||||
if (source === 'fullscreen') {
|
if (source === 'fullscreen') {
|
||||||
this.isFullScreen = !this.isFullScreen
|
this.isFullScreen = !this.isFullScreen
|
||||||
this.$emit('toggle-full-screen', { full: this.isFullScreen })
|
this.$emit('toggle-full-screen', { full: this.isFullScreen })
|
||||||
|
} else if (source === 'home') {
|
||||||
|
this.$router.push('/')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -55,6 +77,16 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
/* @font-face {
|
||||||
|
font-family: 'zcoolqingkehuangyouti';
|
||||||
|
src: url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff2') format('woff2'),
|
||||||
|
url('./assets/fonts/zcoolqingkehuangyouti-Regular.woff') format('woff'),
|
||||||
|
url('./assets/fonts/zcoolqingkehuangyouti-Regular.ttf') format('truetype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
font-display: swap;
|
||||||
|
} */
|
||||||
|
|
||||||
.techy-header {
|
.techy-header {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -64,29 +96,70 @@ export default {
|
|||||||
color: white;
|
color: white;
|
||||||
/* font-size: 24px; */
|
/* font-size: 24px; */
|
||||||
font-size: 2vh;
|
font-size: 2vh;
|
||||||
padding: calc(100vw / 1920 * 16) 0;
|
padding: calc(100vw / 1920 * 32) 0;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
background: url(./header-new.png) no-repeat;
|
background: url(./header-new.png) no-repeat;
|
||||||
/** 背景图片好像左右不对称 : */
|
/** 背景图片好像左右不对称 : */
|
||||||
/* background-position: bottom left 40px; */
|
/* background-position: bottom left 40px; */
|
||||||
/* background-size: cover; */
|
/* background-size: cover; */
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
|
/* background-position: bottom left calc(100vw / 1920 * 40); */
|
||||||
background-position: bottom left calc(100vw / 1920 * 40);
|
background-position: bottom left calc(100vw / 1920 * 40);
|
||||||
height: calc(100vw / 1920 * 80);
|
height: calc(100vmin / 1920 * 128);
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo-img {
|
.logo-img {
|
||||||
width: calc(100vw / 1920 * 24);
|
width: calc(100vmin / 1920 * 48);
|
||||||
|
}
|
||||||
|
|
||||||
|
.techy-header__title {
|
||||||
|
display: line-block;
|
||||||
|
margin-left: calc(100vmin / 1920 * 12);
|
||||||
|
/* font-size: 29px; */
|
||||||
|
font-size: calc(100vmin / 1920 * 48);
|
||||||
|
line-height: 41px;
|
||||||
|
letter-spacing: 4px;
|
||||||
|
text-shadow: 0px 0px 11px rgba(221, 237, 255, 0.34);
|
||||||
|
}
|
||||||
|
|
||||||
|
.date,
|
||||||
|
.time {
|
||||||
|
/* font-family: zcoolqingkehuangyouti, sans-serif; */
|
||||||
|
font-size: calc(100vmin / 1920 * 42);
|
||||||
|
line-height: 1.5;
|
||||||
|
/* font-size: 28px;
|
||||||
|
line-height: 36px; */
|
||||||
|
color: #49e1de;
|
||||||
|
letter-spacing: 0.8px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: calc(100vmin / 1920 * 14);
|
||||||
|
}
|
||||||
|
|
||||||
|
.date {
|
||||||
|
/* left: 72px; */
|
||||||
|
left: calc(100vmin / 1920 * 72);
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
/* right: 128px; */
|
||||||
|
right: calc(100vmin / 1920 * 186);
|
||||||
}
|
}
|
||||||
|
|
||||||
.fullscreen-btn {
|
.fullscreen-btn {
|
||||||
width: 32px;
|
/* height: 32px; */
|
||||||
height: 32px;
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
/* right: 24px; */
|
/* right: 24px; */
|
||||||
/** techy-body 的内部 padding 值 */
|
/** techy-body 的内部 padding 值 */
|
||||||
right: calc(100vw / 1920 * 24);
|
right: calc(100vmin / 1920 * 32);
|
||||||
|
/* top: 42px; */
|
||||||
|
top: calc(100vmin / 1920 * 64);
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.fullscreen-btn > span {
|
||||||
|
display: inline-block;
|
||||||
|
width: calc(100vmin / 1920 * 52);
|
||||||
|
height: calc(100vmin / 1920 * 52);
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -45,11 +45,11 @@ export const equipmentExceptionDatalist = [
|
|||||||
{ 'eqName': 'A1一次固化机', 'pl': 'E线', 'content': '开化是专品直', 'creator': '郭娜', 'time': '1997-06-08 06:14:37', 'priority': 1 },
|
{ 'eqName': 'A1一次固化机', 'pl': 'E线', 'content': '开化是专品直', 'creator': '郭娜', 'time': '1997-06-08 06:14:37', 'priority': 1 },
|
||||||
{ 'eqName': 'B1一次冷却机', 'pl': 'B线', 'content': '书记因地观同展土军信', 'creator': '薛洋', 'time': '2006-03-15 10:39:30', 'priority': 2 },
|
{ 'eqName': 'B1一次冷却机', 'pl': 'B线', 'content': '书记因地观同展土军信', 'creator': '薛洋', 'time': '2006-03-15 10:39:30', 'priority': 2 },
|
||||||
{ 'eqName': 'A1预热机', 'pl': 'D线', 'content': '说资把话', 'creator': '曾刚', 'time': '1985-01-29 23:21:53', 'priority': 3 },
|
{ 'eqName': 'A1预热机', 'pl': 'D线', 'content': '说资把话', 'creator': '曾刚', 'time': '1985-01-29 23:21:53', 'priority': 3 },
|
||||||
{ 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 5 },
|
{ 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 2 },
|
||||||
{ 'eqName': 'A2一次固化机', 'pl': 'C线', 'content': '向江比把设', 'creator': '夏敏', 'time': '1996-12-22 09:29:57', 'priority': 3 },
|
{ 'eqName': 'A2一次固化机', 'pl': 'C线', 'content': '向江比把设', 'creator': '夏敏', 'time': '1996-12-22 09:29:57', 'priority': 3 },
|
||||||
{ 'eqName': 'A2一次固化机', 'content': '统山数里们步在', 'creator': '龙洋', 'time': '1989-07-19 05:01:55', 'priority': 3 },
|
{ 'eqName': 'A2一次固化机', 'content': '统山数里们步在', 'creator': '龙洋', 'time': '1989-07-19 05:01:55', 'priority': 3 },
|
||||||
{ 'eqName': 'A钢化炉', 'content': '快制放产口快', 'creator': '金艳', 'time': '1987-02-25 18:45:17', 'priority': 4 },
|
{ 'eqName': 'A钢化炉', 'content': '快制放产口快', 'creator': '金艳', 'time': '1987-02-25 18:45:17', 'priority': 4 },
|
||||||
{ 'eqName': 'A1一次固化机', 'content': '住指时化统高线', 'creator': '顾敏', 'time': '1982-05-09 15:28:29', 'priority': 5 },
|
{ 'eqName': 'A1一次固化机', 'content': '住指时化统高线', 'creator': '顾敏', 'time': '1982-05-09 15:28:29', 'priority': 1 },
|
||||||
{ 'eqName': 'B1二次镀膜机', 'pl': 'B线', 'content': '命些种保较会', 'creator': '罗秀英', 'time': '1986-04-02 07:40:03', 'priority': 2 },
|
{ 'eqName': 'B1二次镀膜机', 'pl': 'B线', 'content': '命些种保较会', 'creator': '罗秀英', 'time': '1986-04-02 07:40:03', 'priority': 2 },
|
||||||
{ 'pl': 'B线', 'content': '增元少号安场明去在亲', 'creator': '于丽', 'time': '2004-08-11 11:10:57', 'priority': 4 }]
|
{ 'pl': 'B线', 'content': '增元少号安场明去在亲', 'creator': '于丽', 'time': '2004-08-11 11:10:57', 'priority': 4 }]
|
||||||
|
|
||||||
@ -89,16 +89,16 @@ export const equipmentAlarmProps = [
|
|||||||
|
|
||||||
export const equipmentAlarmDatalist = [
|
export const equipmentAlarmDatalist = [
|
||||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB501464', 'pl': 'C线', 'content': '使决方不相动', 'priority': 3 },
|
{ 'eqName': 'A1预热机', 'eqCode': 'SB501464', 'pl': 'C线', 'content': '使决方不相动', 'priority': 3 },
|
||||||
{ 'eqName': 'A1一次固化机', 'eqCode': 'SB373383', 'pl': 'C线', 'content': '规问示况将料组美联', 'priority': 5 },
|
{ 'eqName': 'A1一次固化机', 'eqCode': 'SB373383', 'pl': 'C线', 'content': '规问示况将料组美联', 'priority': 1 },
|
||||||
{ 'eqName': 'B1二次镀膜机', 'eqCode': 'SB788842', 'pl': 'D线', 'content': '了进改京人表无当市手', 'priority': 2 },
|
{ 'eqName': 'B1二次镀膜机', 'eqCode': 'SB788842', 'pl': 'D线', 'content': '了进改京人表无当市手', 'priority': 2 },
|
||||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 5 },
|
{ 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 2 },
|
||||||
{ 'eqName': 'B1一次冷却机', 'eqCode': 'SB138810', 'pl': 'E线', 'content': '代利值才之', 'priority': 1 },
|
{ 'eqName': 'B1一次冷却机', 'eqCode': 'SB138810', 'pl': 'E线', 'content': '代利值才之', 'priority': 1 },
|
||||||
{ 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 5 },
|
{ 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 3 },
|
||||||
{
|
{
|
||||||
'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 5
|
'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 4
|
||||||
},
|
},
|
||||||
{ 'eqName': 'A2一次固化机', 'eqCode': 'SB955674', 'pl': 'E线', 'content': '并来水报克见克代', 'priority': 5 },
|
{ 'eqName': 'A2一次固化机', 'eqCode': 'SB955674', 'pl': 'E线', 'content': '并来水报克见克代', 'priority': 2 },
|
||||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB415026', 'pl': 'C线', 'content': '元动增断量争', 'priority': 5 },
|
{ 'eqName': 'A1预热机', 'eqCode': 'SB415026', 'pl': 'C线', 'content': '元动增断量争', 'priority': 1 },
|
||||||
{ 'eqName': 'A钢化炉', 'eqCode': 'SB19064', 'pl': 'D线', 'content': '很这置合它里革民', 'priority': 4 }
|
{ 'eqName': 'A钢化炉', 'eqCode': 'SB19064', 'pl': 'D线', 'content': '很这置合它里革民', 'priority': 4 }
|
||||||
]
|
]
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user