199 lines
6.3 KiB
Vue
199 lines
6.3 KiB
Vue
<template>
|
||
<div class="drawerbox">
|
||
<el-drawer size="50%" :with-header="false" direction="rtl" v-model="dialogVisible" style="padding: 0;">
|
||
<div class="drawerbox_box">
|
||
<div class="drawerbox_bo_top">
|
||
<div class="drawerbox_bo_top_left">
|
||
<div class="drawerbox_bo_top_left_one">
|
||
{{ store.userInfo.loginName }}
|
||
</div>
|
||
<div class="drawerbox_bo_top_left_tow" style="margin-top: 10px;">
|
||
收银员：{{ store.userInfo.userCode }} <span style="color: #666;">登录：{{
|
||
store.userInfo.loginTime }}</span>
|
||
</div>
|
||
</div>
|
||
<!-- <div class="drawerbox_bo_top_ring">
|
||
<div class="drawerbox_bo_top_ring_tb">
|
||
<el-icon style="margin: 0 auto;" size="20">
|
||
<FolderAdd />
|
||
</el-icon>
|
||
<span>修改密码</span>
|
||
</div>
|
||
<div class="drawerbox_bo_top_ring_tb" style="margin-left: 10px;">
|
||
<el-icon style="margin: 0 auto;" size="20">
|
||
<CopyDocument />
|
||
</el-icon>
|
||
<span>最小化</span>
|
||
</div>
|
||
</div> -->
|
||
</div>
|
||
<div class="drawerbox_bo_box">
|
||
<div style="padding:10px;color: #999; font-weight:bold;">系统</div>
|
||
<div class="drawerbox_bo_box_itemb_felx">
|
||
<div class="drawerbox_bo_box_itembox">
|
||
<div class="drawerbox_bo_box_icon">
|
||
<el-icon size="40" style="margin:30px;">
|
||
<Setting />
|
||
</el-icon>
|
||
</div>
|
||
<div class="drawerbox_bo_box_icontext">
|
||
设置
|
||
</div>
|
||
</div>
|
||
<div class="drawerbox_bo_box_itembox" @click="router.push({ name: 'device_list' })">
|
||
<div class="drawerbox_bo_box_icon">
|
||
<el-icon size="40" style="margin:30px;">
|
||
<TurnOff />
|
||
</el-icon>
|
||
</div>
|
||
<div class="drawerbox_bo_box_icontext">
|
||
设备管理
|
||
</div>
|
||
</div>
|
||
<div class="drawerbox_bo_box_itembox" @click="screenref.shows()">
|
||
<div class="drawerbox_bo_box_icon">
|
||
<el-icon size="40" style="margin:30px;">
|
||
<Switch />
|
||
</el-icon>
|
||
</div>
|
||
<div class="drawerbox_bo_box_icontext">
|
||
锁屏
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="boxabsolute">
|
||
<div>
|
||
©银收客 v{{ packageData.version }}
|
||
</div>
|
||
<!-- <div>
|
||
有效期
|
||
</div> -->
|
||
</div>
|
||
</el-drawer>
|
||
</div>
|
||
<screen ref="screenref"></screen>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref } from 'vue'
|
||
import { useRouter } from 'vue-router'
|
||
import { useUser } from "@/store/user.js"
|
||
import screen from '@/components/screen.vue'
|
||
|
||
import packageData from '../../package.json'
|
||
|
||
const router = useRouter()
|
||
|
||
const store = useUser()
|
||
const screenref = ref(null)
|
||
|
||
const dialogVisible = ref(false)
|
||
|
||
function show() {
|
||
dialogVisible.value = true
|
||
}
|
||
|
||
defineExpose({
|
||
show
|
||
})
|
||
|
||
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.drawerbox {
|
||
:deep(.el-drawer__body) {
|
||
background: #1c1d1f !important;
|
||
position: relative;
|
||
}
|
||
|
||
.boxabsolute {
|
||
position: absolute;
|
||
bottom: 20px;
|
||
left: 50%;
|
||
transform: translate(-50%);
|
||
|
||
div {
|
||
color: #8c9196;
|
||
text-align: center;
|
||
}
|
||
|
||
div:nth-child(2) {
|
||
margin-top: 10px;
|
||
}
|
||
}
|
||
|
||
.drawerbox_box {
|
||
color: #fff;
|
||
|
||
.drawerbox_bo_top {
|
||
padding: 20px 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
border-bottom: 1px solid #ccc;
|
||
|
||
.drawerbox_bo_top_left {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.drawerbox_bo_top_ring {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.drawerbox_bo_top_ring_tb {
|
||
display: flex;
|
||
flex-direction: column;
|
||
border: 1px solid #ccc;
|
||
border-radius: 6px;
|
||
padding: 6px 10px;
|
||
|
||
span {
|
||
width: 80px;
|
||
margin-top: 5px;
|
||
text-align: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.drawerbox_bo_box {
|
||
width: 100%;
|
||
|
||
.drawerbox_bo_box_itemb_felx {
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
padding: 0 20px;
|
||
|
||
.drawerbox_bo_box_itembox:nth-child(1) {
|
||
margin-left: 0px;
|
||
|
||
}
|
||
|
||
.drawerbox_bo_box_itembox {
|
||
width: 20%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
margin-left: 40px;
|
||
|
||
.drawerbox_bo_box_icon {
|
||
border-radius: 6px;
|
||
background: #2196f3;
|
||
width: 100px;
|
||
height: 100px;
|
||
}
|
||
|
||
.drawerbox_bo_box_icontext {
|
||
margin-top: 10px;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
</style> |