Merge branch 'main' of ssh://git.jizhiweb.cn:2222/clinic-v2/web
This commit is contained in:
commit
689157875f
|
|
@ -46,8 +46,6 @@ body {
|
|||
background-color: #fff;
|
||||
@include base.center-wrapper;
|
||||
//@include base.padding;
|
||||
@include base.border-radius;
|
||||
@include base.box-shadow;
|
||||
}
|
||||
|
||||
.space {
|
||||
|
|
|
|||
|
|
@ -46,17 +46,17 @@ const generateCalendarData = (
|
|||
// 当前月日期
|
||||
if ((isFirstWeek && day >= firstDayIndex) || (!isFirstWeek && dayCounter <= daysInMonth)) {
|
||||
const isToday = dayCounter === currentDay && month === currentMonth && year === currentYear;
|
||||
weekDays.push({ day: dayCounter, isCurrentMonth: true, isCurrentDay: isToday });
|
||||
weekDays.push({day: dayCounter, isCurrentMonth: true, isCurrentDay: isToday});
|
||||
dayCounter++;
|
||||
}
|
||||
// 前月日期
|
||||
else if (isFirstWeek) {
|
||||
const prevDay = daysInPrevMonth - firstDayIndex + day + 1;
|
||||
weekDays.push({ day: prevDay, isCurrentMonth: false, isCurrentDay: false });
|
||||
weekDays.push({day: prevDay, isCurrentMonth: false, isCurrentDay: false});
|
||||
}
|
||||
// 下月日期
|
||||
else {
|
||||
weekDays.push({ day: nextMonthDayCounter, isCurrentMonth: false, isCurrentDay: false });
|
||||
weekDays.push({day: nextMonthDayCounter, isCurrentMonth: false, isCurrentDay: false});
|
||||
nextMonthDayCounter++;
|
||||
}
|
||||
}
|
||||
|
|
@ -74,9 +74,79 @@ console.log(calendarData);
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="calendar-wrapper">
|
||||
<div class="row">
|
||||
<div class="item">
|
||||
<span class="tip">日</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">一</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">二</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">三</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">四</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">五</span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="tip">六</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-for="item in calendarData" class="row">
|
||||
<div class="item" v-for="subItem in item">
|
||||
<span :class="subItem.isCurrentDay ? 'currentDay' : subItem.isCurrentMonth ? '' : 'otherMonth'">
|
||||
{{ subItem.day }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.calendar-wrapper {
|
||||
width: 100%;
|
||||
height: 320px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
background-color: #FFF;
|
||||
|
||||
.row {
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
|
||||
.item {
|
||||
|
||||
float: left;
|
||||
width: 14.2%;
|
||||
height: 45px;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
margin: auto;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.currentDay {
|
||||
background: #1677FE;
|
||||
color: #fff;
|
||||
}
|
||||
.otherMonth{
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -19,11 +19,6 @@
|
|||
<el-input v-model="userInfo.password" show-password/>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="用户名">
|
||||
<el-form-item>
|
||||
<el-input v-model="userInfo.name"/>
|
||||
</el-form-item>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-form>
|
||||
<el-form :model="memberInfo" label-width="auto">
|
||||
|
|
|
|||
|
|
@ -2,57 +2,65 @@
|
|||
<div class="container-wrapper">
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<div class="title_date">
|
||||
<Picker></Picker>
|
||||
<div class="left-top">
|
||||
<Panel title="日历">
|
||||
<Calendar></Calendar>
|
||||
</Panel>
|
||||
</div>
|
||||
<div class="search">
|
||||
<el-input v-model="keyword" placeholder="搜索医生"
|
||||
@keydown.enter="initDoctor"></el-input>
|
||||
<div class="left-bottom">
|
||||
<Panel title="医生列表">
|
||||
<div class="search">
|
||||
<el-input v-model="keyword" placeholder="搜索医生"
|
||||
@keydown.enter="initDoctor"></el-input>
|
||||
</div>
|
||||
<div class="content_list">
|
||||
<div class="role_list">
|
||||
<ul>
|
||||
<li v-for="(item, index) in roleList" :key="index"
|
||||
@click="isShowNum=index">
|
||||
<span class="name">{{ item.name }}</span>
|
||||
<span class="section_name">{{ item.sectionName }}</span>
|
||||
<span class="btn" @click="openDialog(item)">挂号</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
</div>
|
||||
|
||||
<div class="content_list">
|
||||
<div class="role_list">
|
||||
<ul>
|
||||
<li :class="isShowNum==index?'active':''" v-for="(item, index) in roleList" :key="index"
|
||||
@click="isShowNum=index">
|
||||
<span class="name" :class="isShowNum==index?'active_name':''">{{ item.name }}</span>
|
||||
<span class="name" :class="isShowNum==index?'active_name':''">{{ item.sectionName }}</span>
|
||||
<span class="btn" :class="isShowNum==index?'active_btn':''" @click="openDialog(item)">挂号</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="middle">
|
||||
<div class="date">
|
||||
<el-date-picker
|
||||
v-model="selectedDate"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
@change="handleDateChange"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
/>
|
||||
</div>
|
||||
<div class="list">
|
||||
<el-scrollbar style="height: 100%">
|
||||
<Panel title="挂号列表">
|
||||
<div class="right-content">
|
||||
<div class="top">
|
||||
<div class="date">
|
||||
<el-date-picker
|
||||
v-model="selectedDate"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
@change="handleDateChange"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="middle">
|
||||
<List :patientList="patientList" @rowClick="rowClick"></List>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="page_btn_list">
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next"
|
||||
:page-size="size"
|
||||
:current-page="page"
|
||||
:total="total"
|
||||
@current-change="changePage"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="page_btn_list">
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next"
|
||||
:page-size="size"
|
||||
:current-page="page"
|
||||
:total="total"
|
||||
@current-change="changePage"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Panel>
|
||||
</div>
|
||||
</div>
|
||||
<Edit ref="editRef" :id="id" :doctor-id="doctorId" :doctorList="roleList" @close="getPatientList"></Edit>
|
||||
|
|
@ -66,6 +74,8 @@ import Edit from "@/components/registration/Edit.vue";
|
|||
import List from "@/components/registration/List.vue";
|
||||
import {post} from "@/utils/request";
|
||||
import {formatDate, getToday, formatDateArray} from "@/utils/dateUtils.ts";
|
||||
import Calendar from "@/components/common/Calendar.vue";
|
||||
import Panel from "@/components/common/Panel.vue";
|
||||
|
||||
const isShowNum = ref(0)
|
||||
const roleList = ref<any>([])
|
||||
|
|
@ -77,11 +87,11 @@ onMounted(() => {
|
|||
const keyword = ref<any>('');
|
||||
|
||||
const initDoctor = () => {
|
||||
let query={
|
||||
let query = {
|
||||
keyword: keyword.value,
|
||||
role:1
|
||||
role: 1
|
||||
}
|
||||
post('organization/member/search',{query:query}).then((res: any) => {
|
||||
post('organization/member/search', {query: query}).then((res: any) => {
|
||||
roleList.value = res
|
||||
})
|
||||
}
|
||||
|
|
@ -125,7 +135,7 @@ const openDialog = (item: any) => {
|
|||
editRef.value?.init()
|
||||
})
|
||||
}
|
||||
const close=()=>{
|
||||
const close = () => {
|
||||
id.value = null
|
||||
getPatientList()
|
||||
}
|
||||
|
|
@ -144,19 +154,35 @@ const close=()=>{
|
|||
.left {
|
||||
height: 100%;
|
||||
width: 319px;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.left-top {
|
||||
height: 380px;
|
||||
}
|
||||
|
||||
.left-bottom {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
height: 50px;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
|
||||
.name {
|
||||
color: #000000;
|
||||
color: #999;
|
||||
|
||||
}
|
||||
|
||||
.section_name {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.btn {
|
||||
|
|
@ -164,53 +190,59 @@ const close=()=>{
|
|||
border: 1px solid #b9b9ba;
|
||||
padding: 5px;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background: #4D6DE4;
|
||||
}
|
||||
}
|
||||
|
||||
.active_name {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.active_btn {
|
||||
color: #fff;
|
||||
background: #67C23A;
|
||||
border: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #5078c8;
|
||||
}
|
||||
.search{
|
||||
.search {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.content_list{
|
||||
|
||||
.content_list {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: 20px;
|
||||
flex: 1;
|
||||
padding-left: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
.middle {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
background: #fff;
|
||||
.right-content {
|
||||
padding-left: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
|
||||
.date {
|
||||
margin: 30px auto 0;
|
||||
height: 60px;
|
||||
.top {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.list {
|
||||
.middle {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.date {
|
||||
margin: 30px auto 0;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.list {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom {
|
||||
|
|
|
|||
Loading…
Reference in New Issue