安琪酵母(西藏)益生菌信息采集中心智能实验室
longyvfengyun
2023-06-20 4d4f00c31561f961a8c7507ac5dbc2ac728e416c
内容提交
5个文件已修改
189 ■■■■ 已修改文件
src/components/FlexLayout.vue 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/MapPin.vue 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/home/index.vue 74 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/mainLayout/components/PageHeader.vue 65 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/mainLayout/index.vue 48 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/FlexLayout.vue
@@ -90,7 +90,6 @@
        height: 100%;
    }
}
.flex-layout-body {
    flex: 1;
    background-color: #052272;
src/components/MapPin.vue
@@ -59,6 +59,7 @@
.map-pin {
    position: absolute;
    cursor: pointer;
    z-index: 1;
    .map-pin-content {
        position: relative;
        top: -@size - @size*0.1;
src/views/home/index.vue
@@ -47,45 +47,47 @@
</script>
<template>
    <flex-layout x-no-hidden>
        <div class="home-content" ref="homeContentDom">
            <map-pin
                name="数据机房"
                :c-width="cWidth" :c-height="cHeight"
                :d-width="dWidth" :d-height="dHeight"
                :x="446" :y="355"></map-pin>
            <map-pin
                name="培养间"
                :c-width="cWidth" :c-height="cHeight"
                :d-width="dWidth" :d-height="dHeight"
                :x="555" :y="385"></map-pin>
            <map-pin
                name="测序间"
                :c-width="cWidth" :c-height="cHeight"
                :d-width="dWidth" :d-height="dHeight"
                :x="765" :y="450"></map-pin>
            <div class="card-box-list">
                <div
                    class="card-box-item"
                    v-for="(item, index) in homeInfo" :key="'key'+index">
                    <card-box>
                        <div class="home-info-list">
                            <div class="home-info-item">
                                {{ item.name }}温度:{{ item.temp }}
                            </div>
                            <div class="home-info-item">
                                {{ item.name }}湿度:{{ item.hum }}
                            </div>
                            <div class="home-info-item">
                                {{ item.name }}压差:{{ item.diffPre }}
                            </div>
    <div class="home-content" ref="homeContentDom">
        <map-pin
            name="数据机房"
            :c-width="cWidth" :c-height="cHeight"
            :d-width="dWidth" :d-height="dHeight"
            :x="0" :y="0"></map-pin>
        <map-pin
            name="数据机房"
            :c-width="cWidth" :c-height="cHeight"
            :d-width="dWidth" :d-height="dHeight"
            :x="446" :y="355"></map-pin>
        <map-pin
            name="培养间"
            :c-width="cWidth" :c-height="cHeight"
            :d-width="dWidth" :d-height="dHeight"
            :x="555" :y="385"></map-pin>
        <map-pin
            name="测序间"
            :c-width="cWidth" :c-height="cHeight"
            :d-width="dWidth" :d-height="dHeight"
            :x="765" :y="450"></map-pin>
        <div class="card-box-list">
            <div
                class="card-box-item"
                v-for="(item, index) in homeInfo" :key="'key'+index">
                <card-box>
                    <div class="home-info-list">
                        <div class="home-info-item">
                            {{ item.name }}温度:{{ item.temp }}
                        </div>
                    </card-box>
                </div>
                        <div class="home-info-item">
                            {{ item.name }}湿度:{{ item.hum }}
                        </div>
                        <div class="home-info-item">
                            {{ item.name }}压差:{{ item.diffPre }}
                        </div>
                    </div>
                </card-box>
            </div>
        </div>
    </flex-layout>
    </div>
</template>
<style scoped>
src/views/mainLayout/components/PageHeader.vue
@@ -16,61 +16,60 @@
<template>
    <div class="header-wrapper">
        <flex-layout no-bg direction="row">
            <div class="header-left-wrapper">
        <div class="header-left-wrapper">
                <span class="menu-state-icon" @click="changeMenuState">
                    <el-icon size="20">
                        <Fold v-if="!isCollapse" />
                        <Expand v-else/>
                    </el-icon>
                </span>
                <span class="sys-name">安琪酵母(西藏)益生菌信息采集中心智能实验室</span>
                <span class="sys-version">V1.21</span>
            </div>
            <template #footer>
                <div class="page-header-right">
                    <div class="hdw-avatar">
                        <el-dropdown @command="commandClick" @visible-change="visibleChange">
                            <div class="hdw-avatar-wrapper">
            <span class="sys-name">安琪酵母(西藏)益生菌信息采集中心智能实验室</span>
            <span class="sys-version">V1.21</span>
        </div>
        <div class="page-header-right">
            <div class="hdw-avatar">
                <el-dropdown @command="commandClick" @visible-change="visibleChange">
                    <div class="hdw-avatar-wrapper">
                                <span class="hdw-avatar-icon">
                      <el-icon size="18"><Avatar /></el-icon>
                    </span>
                                <span class="hdw-avatar-text">admin</span>
                                <el-icon size="16">
                                    <ArrowUp v-if="isVisible" />
                                    <ArrowDown v-else />
                                </el-icon>
                            </div>
                            <template #dropdown>
                                <el-dropdown-menu>
                                    <el-dropdown-item command="passwordChange">密码修改</el-dropdown-item>
                                    <el-dropdown-item command="outSystem">安全退出</el-dropdown-item>
                                </el-dropdown-menu>
                            </template>
                        </el-dropdown>
                        <span class="hdw-avatar-text">admin</span>
                        <el-icon size="16">
                            <ArrowUp v-if="isVisible" />
                            <ArrowDown v-else />
                        </el-icon>
                    </div>
                </div>
            </template>
        </flex-layout>
                    <template #dropdown>
                        <el-dropdown-menu>
                            <el-dropdown-item command="passwordChange">密码修改</el-dropdown-item>
                            <el-dropdown-item command="outSystem">安全退出</el-dropdown-item>
                        </el-dropdown-menu>
                    </template>
                </el-dropdown>
            </div>
        </div>
    </div>
</template>
<style lang="less" scoped>
.header-left-wrapper {
    user-select: none;
    height: 64px;
.header-wrapper {
    display: flex;
}
.header-left-wrapper {
    flex: 1;
    user-select: none;
    height: 62px;
    align-items: center;
    padding-right: 150px;
    min-width: 12rem;
    background-image: url("@/assets/images/page-header-left-bg.png");
    background-repeat: no-repeat;
    background-size: 150% 100%;
    color: @font-color-high-light;
    width: 100vh;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    span {
        font-size: 24px;
        font-size: 32px;
        font-weight: bold;
        letter-spacing: 0.2rem;
        &.menu-state-icon {
@@ -87,7 +86,7 @@
        &.sys-version {
            padding-top: 8px;
            font-size: 16px;
            vertical-align: bottom;
            vertical-align: middle;
        }
    }
}
src/views/mainLayout/index.vue
@@ -5,10 +5,10 @@
</script>
<template>
    <flex-layout no-bg direction="row" bg-img>
        <template v-slot:header>
    <div class="main-layout-wrapper">
        <div class="main-layout-menu">
            <slide-menu></slide-menu>
        </template>
        </div>
        <div class="main-layout-content">
            <div class="main-layout-absolute">
                <flex-layout no-bg>
@@ -21,22 +21,38 @@
                </flex-layout>
            </div>
        </div>
    </flex-layout>
    </div>
</template>
<style scoped>
<style lang="less" scoped>
.main-layout-wrapper {
    position: relative;
    display: flex;
    height: 100%;
    flex-direction: row;
    background-image: url("@/assets/images/dw_bg.jpg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    overflow: hidden;
    .main-layout-menu {
        overflow-y: auto;
    }
    .main-layout-content {
        position: relative;
        flex: 1;
        height: 100%;
        .main-layout-absolute {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }
    }
}
.page-content {
    height: 100%;
}
.main-layout-content {
    position: relative;
    height: 100%;
    .main-layout-absolute {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
}
</style>