LiLongLong
/
disinfector_vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix: 首页下方图标

master
guoapeng 2 weeks ago
parent
7aa828608c
commit
44c64723de
4 changed files with 89 additions and 107 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 73
      src/components/home/HomeSetting.vue
  2. 6
      src/components/home/PressureControl.vue
  3. 113
      src/layouts/default.vue
  4. 4
      src/views/home/index.vue

73
src/components/home/HomeSetting.vue
View File

@ -28,7 +28,6 @@ provide<(methods: Home.GrandsonMethods) => void>('registerGrandsonMethods', (met
// 状态管理
const router = useRouter()
const formulaStore = useFormulaStore()
const deviceStore = useDeviceStore()
const homeStore = useHomeStore()
// 组件状态
@ -156,53 +155,35 @@ const onCloseConfig = () => {
const onCloseRuntime = () => {
disinfectRuntimeVisible.value = false
}
const settingWidth = computed(() => {
if (__DEVICE_TYPE__ === deviceStore.deviceTypeMap.LargeSpaceDM_B) {
return '12rem'
}
return '7.5rem'
})
</script>
<template>
<div class="home-start-opt">
<div class="home-opt-flex">
<div class="home-opt-ml">
<BtButton
button-text="查看图表"
text-size="1.3rem"
border-radius="5px"
:width="settingWidth"
height="3rem"
text-color="#1989fa"
:disabled="deviceState"
@click="onShowChart"
/>
</div>
<div class="home-opt-ml">
<BtButton
v-if="deviceState"
button-text="消毒设置"
text-size="1.3rem"
border-radius="5px"
:width="settingWidth"
text-color="#1989fa"
height="3rem"
@click="onDisinfectConfig()"
/>
<BtButton
v-else
button-text="运行参数"
text-size="1.3rem"
border-radius="5px"
:width="settingWidth"
text-color="#1989fa"
height="3rem"
@click="onDisinfectRuntime()"
/>
</div>
</div>
</div>
<el-button type="primary" :disabled="deviceState" @click="onShowChart">
查看图表
</el-button>
<el-button v-if="deviceState" style="margin: 0" @click="onDisinfectConfig()">
消毒设置
</el-button>
<el-button v-else style="margin: 0" @click="onDisinfectRuntime()">
运行参数
</el-button>
<!-- <div class="home-start-opt"> -->
<!-- <div class="home-opt-flex"> -->
<!-- <div class="home-opt-ml"> -->
<!-- <el-button type="primary" :disabled="deviceState" @click="onShowChart"> -->
<!-- 查看图表 -->
<!-- </el-button> -->
<!-- </div> -->
<!-- <div class="home-opt-ml"> -->
<!-- <el-button v-if="deviceState" @click="onDisinfectConfig()"> -->
<!-- 消毒设置 -->
<!-- </el-button> -->
<!-- <el-button v-else @click="onDisinfectRuntime()"> -->
<!-- 运行参数 -->
<!-- </el-button> -->
<!-- </div> -->
<!-- </div> -->
<!-- </div> -->
<!-- 消毒设置 -->
<ft-dialog v-model="disinfectConfigVisible" title="消毒设置" width="80vw">
<div style="height: 80vh; overflow: auto">
@ -287,7 +268,7 @@ const settingWidth = computed(() => {
}
}
.home-start-opt {
margin: 0.5rem;
//margin: 0.5rem;
}
.home-opt-flex {
display: flex;

6
src/components/home/PressureControl.vue
View File

@ -75,12 +75,14 @@ const confirm = async (val: string[]) => {
.pressure-wrapper {
display: flex;
justify-content: center;
padding: 0.5rem 0;
width: 100px;
}
.pressure-cascader {
width: 100%;
max-width: 7.5rem;
}
:deep(.el-cascader .el-input .el-input__inner) {
//height: 40px;
}
</style>

113
src/layouts/default.vue
View File

@ -284,63 +284,59 @@ const handleCloseAll = async () => {
</el-main>
</el-container>
<el-footer class="footer">
<el-row>
<el-col :span="6">
<div class="ip-info">
IP : {{ deviceInfo.ip }}
</div>
</el-col>
<el-col :span="12" :class="systemStore?.systemLogList.length > 0 ? 'warning-border' : ''">
<div class="footer-left">
<img src="../assets/images/run.svg" alt="" style="padding-right: 5px">
<span v-if="!systemStore.systemLogList.length" class="text">设备运行状态</span>
<el-popover v-else width="auto" trigger="click" placement="top">
<template #reference>
<el-tag
style="width: 100%"
:type="statusMap[systemStore.systemLogList[0]?.status as keyof typeof statusMap].type"
>
{{ statusMap[systemStore.systemLogList[0]?.status as keyof typeof statusMap].name }}:
{{ systemStore.systemLogList[0]?.name }}
{{ systemStore.systemLogList[0]?.time }}
</el-tag>
</template>
<template #default>
<div class="log-box">
<div class="tag-box">
<el-tag
v-for="(item, key) in systemStore.systemLogList"
:key
:type="statusMap[item?.status as keyof typeof statusMap].type"
closable
size="large"
@close="handleClose(item, key)"
>
<div style="display: flex; justify-content: space-between; width: 100%">
<span>
<span>{{ statusMap[item.status as keyof typeof statusMap].name }}: </span>
<span>{{ item.name }}</span>
</span>
<span>{{ item.time }}</span>
</div>
</el-tag>
</div>
<div class="close-btn">
<el-button type="primary" @click="handleCloseAll">
清除所有
</el-button>
</div>
<div class="ip-info">
IP : {{ deviceInfo.ip }}
</div>
<div style="width: 50%" :class="systemStore?.systemLogList.length > 0 ? 'warning-border' : ''">
<div class="footer-left">
<img src="../assets/images/run.svg" alt="" style="padding-right: 5px">
<span v-if="!systemStore.systemLogList.length" class="text">设备运行状态</span>
<el-popover v-else width="auto" trigger="click" placement="top">
<template #reference>
<el-tag
style="width: 100%"
:type="statusMap[systemStore.systemLogList[0]?.status as keyof typeof statusMap].type"
>
{{ statusMap[systemStore.systemLogList[0]?.status as keyof typeof statusMap].name }}:
{{ systemStore.systemLogList[0]?.name }}
{{ systemStore.systemLogList[0]?.time }}
</el-tag>
</template>
<template #default>
<div class="log-box">
<div class="tag-box">
<el-tag
v-for="(item, key) in systemStore.systemLogList"
:key
:type="statusMap[item?.status as keyof typeof statusMap].type"
closable
size="large"
@close="handleClose(item, key)"
>
<div style="display: flex; justify-content: space-between; width: 100%">
<span>
<span>{{ statusMap[item.status as keyof typeof statusMap].name }}: </span>
<span>{{ item.name }}</span>
</span>
<span>{{ item.time }}</span>
</div>
</el-tag>
</div>
<div class="close-btn">
<el-button type="primary" @click="handleCloseAll">
清除所有
</el-button>
</div>
</template>
</el-popover>
</div>
</el-col>
<el-col :span="6">
<div class="time">
{{ currentTime }}
</div>
</el-col>
</el-row>
</div>
</template>
</el-popover>
</div>
</div>
<div class="time">
{{ currentTime }}
</div>
</el-footer>
<NetReconnection />
<!-- <ErrorEventsModal /> -->
@ -364,12 +360,11 @@ const handleCloseAll = async () => {
width: 100%;
display: flex;
align-items: center;
padding: 10px 15px;
position: sticky;
justify-content: space-between;
}
.header {
color: #393f46;
box-shadow: 0px 1px 5px 0px rgba(9, 39, 62, 0.15);
box-shadow: 0 1px 5px 0 rgba(9, 39, 62, 0.15);
display: flex;
padding: 0 10px;
justify-content: center;

4
src/views/home/index.vue
View File

@ -145,6 +145,10 @@ const deviceType = computed(() => {
</template>
<style lang="scss" scoped>
.bottom {
display: flex;
justify-content: space-between;
}
$input-height: 3rem;
.home {
width: 100%;

Write Preview
Loading…
Cancel
Save