dev
This commit is contained in:
parent
1936df69b7
commit
3329690de8
|
|
@ -72,6 +72,7 @@
|
|||
bottom: 0; // 调整下划线与文字的距离
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
a.router-link-active.router-link-exact-active.child-item{
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
<template>
|
||||
<div class="layout-container">
|
||||
<Header class="header"/>
|
||||
<header>
|
||||
<div class="body">
|
||||
<header style="height: 50px">
|
||||
<div class="center-wrapper">
|
||||
<div class="childMenu">
|
||||
<router-link :to="item.path" class="child-item" v-for="(item,index) in childMenuList" :key="index">
|
||||
|
|
@ -10,47 +11,74 @@
|
|||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="space"></div>
|
||||
<main class="layout-main">
|
||||
<main class="layout-main" style="margin-top: 24px">
|
||||
<router-view/>
|
||||
</main>
|
||||
<div class="space"></div>
|
||||
</div>
|
||||
<Footer class="footer"/>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.body{
|
||||
height: 100%;
|
||||
padding: 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.childMenu {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 8px;
|
||||
|
||||
.child-item {
|
||||
width: 136px;
|
||||
display: inline-block;
|
||||
color: #151515;
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
height: 35px;
|
||||
height: 50px;
|
||||
position: relative;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
&::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top:50%;
|
||||
display: block;
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
background: #D8D8D8;
|
||||
border-radius: 1px;
|
||||
transform: translate(0 ,-50%);
|
||||
}
|
||||
&:last-child::before{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.router-link-active:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #151515; // 下划线颜色
|
||||
width: 80px;
|
||||
height: 4px;
|
||||
background-color: #4D6DE4; // 下划线颜色
|
||||
position: absolute;
|
||||
bottom: -5px; // 调整下划线与文字的距离
|
||||
left: 0;
|
||||
bottom: 0; // 调整下划线与文字的距离
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
a.router-link-active.router-link-exact-active.child-item{
|
||||
color: #4D6DE4;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -73,11 +73,16 @@
|
|||
formatListTime(listItem.lastVisitTime) || "-"
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="证件类型">{{certTypeList.find((item:any)=>item.id==listItem.certType)?.name}}</el-descriptions-item>>
|
||||
<el-descriptions-item label="证件类型">
|
||||
{{ certTypeList.find((item: any) => item.id == listItem.certType)?.name }}
|
||||
</el-descriptions-item>
|
||||
>
|
||||
<el-descriptions-item label="证件号码">{{ listItem.certNo || "-" }}</el-descriptions-item>
|
||||
<el-descriptions-item label="积分"><span>{{ listItem.integralBalance }}</span>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="地址">{{ areaName}}{{areaName?'/'+listItem.address : listItem.address || "-" }}</el-descriptions-item>
|
||||
<el-descriptions-item label="地址">
|
||||
{{ areaName }}{{ areaName ? '/' + listItem.address : listItem.address || "-" }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="既往史">{{ listItem.beforeMedicalHistory || "-" }}</el-descriptions-item>
|
||||
<el-descriptions-item label="过敏史">{{ listItem.allergyHistory || "-" }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注">{{ listItem.remark || "-" }}</el-descriptions-item>
|
||||
|
|
@ -86,10 +91,12 @@
|
|||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
<Panel title="消费记录" class="right-list">
|
||||
<div class="list-content">
|
||||
<div class="right-list">
|
||||
<Panel title="消费记录">
|
||||
<div class="panel-content" style="display: flex;flex-direction: column;height: 100%;padding: 0 24px;">
|
||||
<div class="list">
|
||||
<el-table :data="tableData" :header-cell-style="{ backgroundColor: '#F1F5FB' }" style="width: 100%"
|
||||
<el-table :data="tableData" :header-cell-style="{ backgroundColor: '#F1F5FB' }"
|
||||
style="width: 100%;height: 100%"
|
||||
@cell-click="openDetail">
|
||||
<el-table-column label="单号" prop="code" show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
|
|
@ -142,6 +149,7 @@
|
|||
</Panel>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<VipEdit ref="refEdit" @close="init"></VipEdit>
|
||||
<VipLevelEdit ref="levelEditRef" @close="init"></VipLevelEdit>
|
||||
<Mask :width="600" :height="400" :is-show="isGrant" @close="isGrant=false" :title="'发放积分'">
|
||||
|
|
@ -596,34 +604,19 @@ const certTypeList=ref<any>(Object.entries(psnCertTypes).map(([id,name])=>({id,n
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
|
||||
.list-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 24px;
|
||||
height: 100%;
|
||||
|
||||
.list {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background-color: #FFF;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
position: relative;
|
||||
border-top: 1px solid #EEE;
|
||||
|
||||
.page_btn_list {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue