From 1dee40ea46601f2ee5d10aa0190625ebf03bdc4e Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 02 Dec 2024 17:02:19 +0800
Subject: [PATCH] 1
---
src/views/companyInfo/components/centerContainer.vue | 177 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 101 insertions(+), 76 deletions(-)
diff --git a/src/views/companyInfo/components/centerContainer.vue b/src/views/companyInfo/components/centerContainer.vue
index 9678336..0549987 100644
--- a/src/views/companyInfo/components/centerContainer.vue
+++ b/src/views/companyInfo/components/centerContainer.vue
@@ -1,113 +1,138 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2024-11-08 11:00:30
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2024-11-08 12:07:12
+ * @FilePath: \bigScreen\src\views\companyInfo\components\centerContainer.vue
+ * @Description:
+ *
+ * Copyright (c) 2024 by shuishen, All Rights Reserved.
+-->
<script setup>
+import EventBus from 'utils/bus'
+import { getAssetsFile } from 'utils/utils'
+const loginOutBg = getAssetsFile('back.png', '/images')
import { useRouter, useRoute } from 'vue-router'
let router = useRouter()
import { useRouterStore } from 'store/router'
const store = useRouterStore()
-
-
-
let data = reactive({
- companyInfo: {}
+ companyInfo: {}
})
-let buttonIndex = defineProps({
- buttonIndex: Number
+let { buttonIndex } = defineProps({
+ buttonIndex: Number
})
onMounted(() => {
- data.companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
+ data.companyInfo = JSON.parse(localStorage.getItem('companyInfo'))
})
// 父级方法
-const emit = defineEmits(['childEvent']);
+const emit = defineEmits(['childEvent'])
// 回调父级方法
const handleClick = (index) => {
- console.log(index)
- emit('childEvent', index)
+ emit('childEvent', index)
}
// 返回首页
const goHome = () => {
- store.setLoadSub(false)
- router.push('/layout')
+ store.setLoadSub(false)
+ EventBus.emit('flyToyqfw', 'flyToyqfw')
+ router.push({
+ path: '/layout'
+ })
}
-
</script>
-
+
<template>
- <div class="center-container">
- <div class="center-container-title">
- <el-row>
- <el-col :span="7">
- <div class="center-name">{{ data.companyInfo.name }}</div>
- </el-col>
- <el-col :span="10">
- <div class="button-group">
- <button @click="handleClick(1)">基本信息</button>
- <button @click="handleClick(2)">应急物质</button>
- <button @click="handleClick(3)">救援队伍</button>
- </div>
- </el-col>
- <el-col :span="7">
- <div class="center-info">
- <button @click="goHome()">返回首页</button>
- </div>
- </el-col>
- </el-row>
- </div>
+ <div class="title">{{ data.companyInfo.name }}</div>
+ <!-- <div class="menu-box">
+ <div :class="{ on: buttonIndex == 1 }" class="sub-menu" @click="handleClick(1)"> 基本信息 </div>
+ <div :class="{ on: buttonIndex == 2 }" class="sub-menu" @click="handleClick(2)"> 应急物质 </div>
+ <div :class="{ on: buttonIndex == 3 }" class="sub-menu" @click="handleClick(3)"> 救援队伍 </div>
+ </div> -->
+ <div class="back-hoem">
+ <!-- <div class="center-info cursor-p" @click="goHome()">返回</div> -->
+ <div class="center-info cursor-p" @click="goHome()">
+ <img :src="loginOutBg" class="img" />
+ <span>返回</span>
</div>
+ </div>
</template>
-
-<style lang="scss" scoped >
-.center-container {
- margin: 10px auto;
- color: #fff;
- pointer-events: auto;
+
+<style lang="scss" scoped>
+.title {
+ position: absolute;
+ bottom: 2px;
+ left: 74px;
+
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
+ font-size: 24px;
+ color: #FFFFFF;
+ line-height: 38px;
+ letter-spacing: 3px;
+ text-shadow: 2px 3px 0px rgba(17, 20, 22, 0.2196);
+ text-align: left;
+ font-style: normal;
+ text-transform: none;
}
-.center-container-title {}
+.menu-box {
+ position: absolute;
+ bottom: 0px;
+ left: 592px;
-.center-name {
- font-size: 30px;
- margin: 10px 0;
- margin-left: 45px;
- font-family: YouSheBiaoTiHei;
+ display: flex;
-}
+ &>div {
+ width: 146px;
+ height: 36px;
+ line-height: 48px;
-.button-group {
- margin-top: 26px;
cursor: pointer;
-}
-
-.button-group button {
- width: 120px;
- border: none;
- background-color: transparent;
- color: #fff;
- font-size: 18px;
- font-family: YouSheBiaoTiHei;
- background-image: url(/images/mode-tab-ac.png);
-}
-
-.center-info {
- text-align: right;
- margin-top: 10px;
- margin-right: 30px;
-}
-
-.center-info button {
- width: 120px;
- height: 40px;
- border: none;
- border-radius: 20px;
- color: #fff;
- background-color: transparent;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
+ font-weight: 400;
font-size: 20px;
- background-image: url(/images/mode-tab.png);
+ color: #BFD3E5;
+ text-align: center;
+ font-style: normal;
+ text-transform: none;
+ }
+
+ &>div.on {
+ color: #F6FCFF;
+ background: url(/images/mode-tab-ac.png) no-repeat center / 100% 100%;
+ }
}
-button:hover {
+.back-hoem {
+ position: absolute;
+ bottom: 2px;
+ right: 30px;
+
+ .center-info {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #fff;
+ font-size: 13px;
+ }
+
+ .center-info span {
+ margin-right: 10px;
+ }
+
+ .img {
+ width: 36px;
+ height: 36px;
+ // margin-right: 5px;
+ }
+
+ .center-info:hover {
background-color: #3c5e8f;
+ border-radius: 20px;
+ }
}
</style>
--
Gitblit v1.9.3