|
@@ -21,7 +21,7 @@ async function setEventInfo(date){
|
|
|
currentDay.value = date||''
|
|
|
//获取当天的日历信息,若有事项,则打开弹窗
|
|
|
await getEventsByDay()
|
|
|
- if(eventList.value.length) showEventList.value = true
|
|
|
+ showEventList.value = Boolean(eventList.value.length)
|
|
|
}
|
|
|
async function getEventsByDay(){
|
|
|
await apiGetDailyEventList({
|
|
@@ -222,17 +222,19 @@ onMounted(()=>{
|
|
|
@click-item="clickItemHandle"
|
|
|
/>
|
|
|
</Popup>
|
|
|
- <Popup v-model:show="showEventList" position="bottom" :style="{ height: '50%',display: 'flex',flexDirection: 'column' }">
|
|
|
- <div class="select-header">
|
|
|
- <span class="title">{{ currentDay }}{{ permissionName }}事项</span>
|
|
|
- <span class="btn" @click="showEventList=false"><van-icon name="cross" size="16"/></span>
|
|
|
- </div>
|
|
|
- <div class="event-list-wrap">
|
|
|
- <ul class="event-list">
|
|
|
- <li class="event-item" v-for="(item,index) in eventList" :key="index" @click="handleClickEvent(item)">
|
|
|
- {{item.title}}
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <Popup v-model:show="showEventList" position="bottom" :style="{ height: '50%' }">
|
|
|
+ <div class="pop-wrap">
|
|
|
+ <div class="select-header">
|
|
|
+ <span class="title">{{ currentDay }}{{ permissionName }}事项</span>
|
|
|
+ <span class="btn" @click="showEventList=false"><van-icon name="cross" size="16"/></span>
|
|
|
+ </div>
|
|
|
+ <div class="event-list-wrap">
|
|
|
+ <ul class="event-list">
|
|
|
+ <li class="event-item" v-for="(item,index) in eventList" :key="index" @click="handleClickEvent(item)">
|
|
|
+ {{item.title}}
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</Popup>
|
|
|
</div>
|
|
@@ -269,23 +271,39 @@ onMounted(()=>{
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .select-header {
|
|
|
+ .pop-wrap{
|
|
|
display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- padding: var(--van-picker-action-padding);
|
|
|
- font-size: var(--van-picker-action-font-size);
|
|
|
- height: var(--van-picker-toolbar-height);
|
|
|
- .cancel,.btn{
|
|
|
- color: #969799;
|
|
|
- }
|
|
|
- .ensure {
|
|
|
- color: #576b95;
|
|
|
+ flex-direction: column;
|
|
|
+ height: 100%;
|
|
|
+ .select-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: var(--van-picker-action-padding);
|
|
|
+ font-size: var(--van-picker-action-font-size);
|
|
|
+ height: var(--van-picker-toolbar-height);
|
|
|
+ .cancel,.btn{
|
|
|
+ color: #969799;
|
|
|
+ }
|
|
|
+ .ensure {
|
|
|
+ color: #576b95;
|
|
|
+ }
|
|
|
+ .title{
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
}
|
|
|
- .title{
|
|
|
- font-weight: bold;
|
|
|
+ .event-list-wrap{
|
|
|
+ font-size: var(--van-picker-action-font-size);
|
|
|
+ padding: var(--van-padding-md);
|
|
|
+ flex:1;
|
|
|
+ overflow-y: auto;
|
|
|
+ .event-item{
|
|
|
+ margin-bottom: var(--van-padding-md);
|
|
|
+ border-bottom: 1px solid #E7E7E7;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.van-tree-select {
|
|
|
::v-deep(.van-sidebar-item--select:before) {
|
|
|
background-color: #E3B377;
|
|
@@ -299,15 +317,6 @@ onMounted(()=>{
|
|
|
position: absolute !important;
|
|
|
}
|
|
|
}
|
|
|
- .event-list-wrap{
|
|
|
- font-size: var(--van-picker-action-font-size);
|
|
|
- padding: var(--van-padding-md);
|
|
|
- flex:1;
|
|
|
- overflow-y: auto;
|
|
|
- .event-item{
|
|
|
- margin-bottom: var(--van-padding-md);
|
|
|
- border-bottom: 1px solid #E7E7E7;
|
|
|
- }
|
|
|
- }
|
|
|
+
|
|
|
}
|
|
|
</style>
|