From df7f58f8141e97b90627e3725f12cf62a8920e94 Mon Sep 17 00:00:00 2001 From: 叶松 <2217086471@qq.com> Date: 星期三, 06 十二月 2023 16:16:15 +0800 Subject: [PATCH] 大屏修改 --- web/src/views/MixingInfo/messageInfo.vue | 228 ++++++++++++++++++++++++++++++-------------------------- web/src/assets/mixing/mixing_bg3.png | 0 web/src/assets/mixing/mixing_bg1.png | 0 web/src/views/LayoutIndex/components/LayoutAside.vue | 2 4 files changed, 124 insertions(+), 106 deletions(-) diff --git a/web/src/assets/mixing/mixing_bg1.png b/web/src/assets/mixing/mixing_bg1.png new file mode 100644 index 0000000..a9bf675 --- /dev/null +++ b/web/src/assets/mixing/mixing_bg1.png Binary files differ diff --git a/web/src/assets/mixing/mixing_bg3.png b/web/src/assets/mixing/mixing_bg3.png new file mode 100644 index 0000000..2df17a7 --- /dev/null +++ b/web/src/assets/mixing/mixing_bg3.png Binary files differ diff --git a/web/src/views/LayoutIndex/components/LayoutAside.vue b/web/src/views/LayoutIndex/components/LayoutAside.vue index ae8893a..097dbf4 100644 --- a/web/src/views/LayoutIndex/components/LayoutAside.vue +++ b/web/src/views/LayoutIndex/components/LayoutAside.vue @@ -34,7 +34,7 @@ <template v-else> <el-menu-item :index="item.path" :key="item.name"> - <span slot="title">{{ item.meta.title }}</span> + <span slot="title" >{{ item.meta.title }}</span> </el-menu-item> </template> diff --git a/web/src/views/MixingInfo/messageInfo.vue b/web/src/views/MixingInfo/messageInfo.vue index 7b832cd..c2a3a46 100644 --- a/web/src/views/MixingInfo/messageInfo.vue +++ b/web/src/views/MixingInfo/messageInfo.vue @@ -1,36 +1,37 @@ <template> <div class="mixing_index"> <div class="mixing_header"> - <div class="mixing_main"> - <div class="mixing_left"> - <div class="mixing_left_num"><span>{{mixingList&&mixingList.tableNum}}</span></div> - <div class="mixing_left_name">{{mixingList&&mixingList.materialName}}</div> + <span>中铁十四局通甬站前I标管片场拌合站</span> + </div> + <div class="mixing_main"> + <div class="mixing_left"> + <div class="mixing_left_num"><span>{{mixingList&&mixingList.tableNum}}</span></div> + <div class="mixing_left_name">{{mixingList&&mixingList.materialName}}</div> + </div> + <div class="mixing_right"> + <div class="mixing_rows"> + <div class="mixing_rows_titles">产地名称:</div> + <div class="mixing_rows_datas">{{mixingList&&mixingList.nameOfOrigin}}</div> </div> - <div class="mixing_right"> - <div class="mixing_rows"> - <div class="mixing_rows_titles">产地名称:</div> - <div class="mixing_rows_datas">{{mixingList&&mixingList.nameOfOrigin}}</div> - </div> - <div class="mixing_rows"> - <div class="mixing_rows_titles">进场数量:</div> - <div class="mixing_rows_datas">{{mixingList&&mixingList.incomingQuantity}} t</div> - </div> - <div class="mixing_rows"> - <div class="mixing_rows_titles">进场日期:</div> - <div class="mixing_rows_datas">{{mixingList&&mixingList.inTime}}</div> - </div> - <div class="mixing_rows"> - <div class="mixing_rows_titles">检验日期:</div> - <div class="mixing_rows_datas">{{mixingList&&mixingList.inspectionDate}}</div> - </div> - <div class="mixing_rows"> - <div class="mixing_rows_titles">检验状态:</div> - <div class="mixing_rows_datas" :class="{'standardStyle':mixingList.status===1,'notStandardStyle':mixingList.status!==1}">{{mixingList&&mixingList.status===1?'合格':mixingList&&mixingList.status===2?'待检':''}}</div> - </div> - <div class="mixing_rows"> - <div class="mixing_rows_titles">报告编号:</div> - <div class="mixing_rows_datas">{{mixingList&&mixingList.reportNumber}}</div> - </div> + <div class="mixing_rows"> + <div class="mixing_rows_titles">进场数量:</div> + <div class="mixing_rows_datas">{{mixingList&&mixingList.incomingQuantity}} t</div> + </div> + <div class="mixing_rows"> + <div class="mixing_rows_titles">进场日期:</div> + <div class="mixing_rows_datas">{{mixingList&&mixingList.inTime}}</div> + </div> + <div class="mixing_rows"> + <div class="mixing_rows_titles">检验日期:</div> + <div class="mixing_rows_datas">{{mixingList&&mixingList.inspectionDate}}</div> + </div> + <div class="mixing_rows"> + <div class="mixing_rows_titles">检验状态:</div> + <div class="mixing_rows_datas" :class="{'standardStyle':mixingList.status===1,'notStandardStyle':mixingList.status!==1}">{{mixingList&&mixingList.status===1?'合格':mixingList&&mixingList.status===2?'待检':''}}</div> + </div> + <div class="mixing_rows"> + <div class="mixing_rows_titles">报告编号:</div> + <div class="mixing_rows_datas">{{mixingList&&mixingList.reportNumber}}</div> </div> </div> </div> @@ -78,95 +79,112 @@ .mixing_index{ width: 100%; height: 100%; - background-color: #041A3F; padding: 5px; + background: url("../../assets/mixing/mixing_bg3.png") no-repeat; + background-size: 100% 100%; + background-position: center center; + .mixing_header{ width: 100%; - height: 100%; - padding: 108px 50px 40px; - background: url("../../assets/mixing/mixing_bg.png") no-repeat; - background-size: 100% 100%; - background-position: center center; + height: 3.2rem; + position: relative; + padding: 50px; + display: flex; + justify-content: center; + align-items: center; + + span{ + position: absolute; + font-size: 3rem; + font-weight: bold; + line-height: 3.2rem; + letter-spacing: 2px; + text-shadow: 0px 3px 3px rgba(25, 63, 95, 0.05); + background: -webkit-linear-gradient(90deg, #2AC0FF 0%, #FFFFFF 70%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + } + } - .mixing_main{ - width: 100%; - height: 100%; - padding: 20px 15px; + .mixing_main{ + width: 100%; + height: calc(100% - 3rem); + position: absolute; + padding: 20px 15px; + display: flex; + .mixing_left{ + width: 45%; + margin-right: 15px; display: flex; - .mixing_left{ - width: 45%; - margin-right: 15px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: space-between; + flex-direction: column; + align-items: center; + justify-content: space-between; - .mixing_left_num{ - width: 100%; - height: 78%; - padding: 10px; - background: url("../../assets/mixing/mixing_left_bg.png") no-repeat; - background-size: 100% 100%; - span{ - height: 100%; - padding: 10px 0; - display: flex; - justify-content: center; - align-items: center; - color: rgba(254, 252, 94, 1); - font-size: 44rem; - font-weight: bold; - background-color: rgba(37, 129, 255, 0.29); - } - } - .mixing_left_name{ - width: 100%; - height: 20%; - margin-top: 15px; + .mixing_left_num{ + width: 100%; + height: 78%; + padding: 10px; + background: url("../../assets/mixing/mixing_left_bg.png") no-repeat; + background-size: 100% 100%; + span{ + height: 100%; + padding: 10px 0; display: flex; justify-content: center; align-items: center; - text-shadow: 5px 7px 0px rgba(0,66,255,0.2), 16px 23px 16px rgba(14,19,48,0.15); - background: linear-gradient(to bottom,#FFFFFF 0%,rgba(140, 186, 255, 0.88) 100%); - background-clip: text; - -webkit-background-clip: text; - text-fill-color: transparent; - -webkit-text-fill-color: transparent; - color: #FFFFFF; - font-size: 9rem; - font-weight: 500; + color: rgba(254, 252, 94, 1); + font-size: 44rem; + font-weight: bold; + background-color: rgba(37, 129, 255, 0.29); } } - .mixing_right{ - width:55%; - background: linear-gradient(to right,#0D3776 0%,#041A40 100%); + .mixing_left_name{ + width: 100%; + height: 20%; + margin-top: 15px; display: flex; - flex-direction: column; - justify-content: space-around; - .mixing_rows{ - padding: 10px 20px; - display: flex; - .mixing_rows_titles{ - flex: none; - color: #FFFFFF; - font-weight: 400; - font-size: 5rem; - } - .mixing_rows_datas{ - flex: none; - color: #FFFFFF; - font-weight: 400; - font-size: 5rem; - } - .standardStyle{ - color:#15EF48; - font-size:8rem; - } - .notStandardStyle{ - color:rgba(255, 102, 0, 1); - font-size:8rem; - } + justify-content: center; + align-items: center; + text-shadow: 5px 7px 0px rgba(0,66,255,0.2), 16px 23px 16px rgba(14,19,48,0.15); + background: linear-gradient(to bottom,#FFFFFF 0%,rgba(140, 186, 255, 0.88) 100%); + background-clip: text; + -webkit-background-clip: text; + text-fill-color: transparent; + -webkit-text-fill-color: transparent; + color: #FFFFFF; + font-size: 9rem; + font-weight: 500; + } + } + .mixing_right{ + width:55%; + background: linear-gradient(to right,#0D3776 0%,#041A40 100%); + display: flex; + flex-direction: column; + justify-content: space-around; + .mixing_rows{ + padding: 10px 20px; + display: flex; + .mixing_rows_titles{ + flex: none; + color: #FFFFFF; + font-weight: 400; + font-size: 5rem; + } + .mixing_rows_datas{ + flex: none; + color: #FFFFFF; + font-weight: 400; + font-size: 5rem; + } + .standardStyle{ + color:#15EF48; + font-size:8rem; + } + .notStandardStyle{ + color:rgba(255, 102, 0, 1); + font-size:8rem; } } } -- Gitblit v1.9.3