|
@@ -1,188 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="parent-wrapper">
|
|
|
- <div class="title-box">
|
|
|
- <img :src="logo" alt="">
|
|
|
- <p class="title-text">今日开放号源</p>
|
|
|
- <p class="title-time">{{currentTimeText}}</p>
|
|
|
- </div>
|
|
|
- <table>
|
|
|
- <tr>
|
|
|
- <td class="colored-background">出诊科室</td>
|
|
|
- <td class="colored-background">出诊医生</td>
|
|
|
- <td class="colored-background">出诊号别</td>
|
|
|
- <td class="colored-background">出诊时间</td>
|
|
|
- <td class="colored-background">医事服务费</td>
|
|
|
- <td class="colored-background">就诊地点</td>
|
|
|
- </tr>
|
|
|
- <tr v-for="item in displayList">
|
|
|
- <td class="colored-text">{{item.deptName}}</td>
|
|
|
- <td class="colored-text">{{item.doctorName}}</td>
|
|
|
- <td class="colored-text">{{item.reqType}}</td>
|
|
|
- <td class="colored-text">{{item.reqTime}}</td>
|
|
|
- <td class="colored-text">{{item.reqFee}}</td>
|
|
|
- <td class="colored-text">{{item.reqAddress}}</td>
|
|
|
- </tr>
|
|
|
- </table>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup>
|
|
|
-import logo from '@/assets/thyylogo.png'
|
|
|
-import {selectTodayClinicResource} from "@/api/single-page/today-clinic-resource";
|
|
|
-
|
|
|
-const resourceList = ref([])
|
|
|
-const queryResourceData = () => {
|
|
|
- selectTodayClinicResource().then(res => {
|
|
|
- resourceList.value = res
|
|
|
- analyzeStatistics()
|
|
|
- })
|
|
|
-}
|
|
|
-
|
|
|
-const currentTimeText = ref('')
|
|
|
-
|
|
|
-const displayList = ref([]);
|
|
|
-const pageInfoSize = 4; //每页显示4条信息
|
|
|
-const maxPageNumber = ref(0);
|
|
|
-
|
|
|
-const analyzeStatistics = () => {
|
|
|
- if (resourceList.value.length === 0) {
|
|
|
- return
|
|
|
- }
|
|
|
- maxPageNumber.value = Math.ceil((resourceList.value.length)/pageInfoSize);
|
|
|
- splitPageInfo();
|
|
|
-}
|
|
|
-
|
|
|
-const currentPageNumber = ref(1)
|
|
|
-const executeSlice = () => {
|
|
|
- let leftIndex = (currentPageNumber.value - 1) * 4
|
|
|
- let rightIndex = currentPageNumber.value * 4
|
|
|
- if (rightIndex > resourceList.value.length - 1) {
|
|
|
- rightIndex = resourceList.value.length - 1
|
|
|
- }
|
|
|
- displayList.value = resourceList.value.slice(leftIndex, rightIndex);
|
|
|
- if (currentPageNumber.value < maxPageNumber.value) {
|
|
|
- currentPageNumber.value += 1
|
|
|
- } else {
|
|
|
- currentPageNumber.value = 1
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-const splitPageInfo = () => {
|
|
|
- executeSlice()
|
|
|
- setInterval(function () {
|
|
|
- executeSlice()
|
|
|
- }, 1000 * 20);
|
|
|
-}
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- queryResourceData()
|
|
|
- setInterval(() => {
|
|
|
- let date = new Date();
|
|
|
- let dateStr=date.getFullYear() + "/" +(date.getMonth() + 1) + "/" + date.getDate();
|
|
|
- let timeStr = date.toLocaleTimeString();
|
|
|
- let weekStr='星期'+'日一二三四五六'.charAt(new Date().getDay());
|
|
|
- currentTimeText.value = dateStr + " --- " + timeStr + " --- " + weekStr;
|
|
|
- }, 1000)
|
|
|
-})
|
|
|
-
|
|
|
-</script>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
-* {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-.parent-wrapper {
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
-
|
|
|
- .title-box {
|
|
|
- position: relative;
|
|
|
- background-image: linear-gradient(to top,white 0%, lightskyblue 100%);
|
|
|
- display: table;
|
|
|
- width: 100vw;
|
|
|
- height: 10vh;
|
|
|
-
|
|
|
- img {
|
|
|
- position: relative;
|
|
|
- margin-left: 20px;
|
|
|
- height: 75%;
|
|
|
- width: 20%;
|
|
|
- margin-top: 5px;
|
|
|
- }
|
|
|
-
|
|
|
- .title-text {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 17.5%;
|
|
|
- text-align: center;
|
|
|
- line-height: 200%;
|
|
|
- border-bottom-left-radius: 30%;
|
|
|
- border-bottom-right-radius: 30%;
|
|
|
- height: 100%;
|
|
|
- width: 20%;
|
|
|
- color: white;
|
|
|
- font-size: 50px;
|
|
|
- font-weight: bold;
|
|
|
- background-image: linear-gradient(to top, rgba(0, 82, 94, 0.88), rgba(0, 82, 94, 0.48) 100%);
|
|
|
- }
|
|
|
-
|
|
|
- .title-time {
|
|
|
- background-image: linear-gradient(to top, rgba(0, 82, 94, 0.88), rgba(0, 82, 94, 0.48) 100%);
|
|
|
- border-radius: 10px;
|
|
|
- width: 45%;
|
|
|
- font-size: 45px;
|
|
|
- color: white;
|
|
|
- font-weight: bold;
|
|
|
- display: table-cell;
|
|
|
- vertical-align: middle;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- table {
|
|
|
- margin-top: 8px;
|
|
|
- width: 100vw;
|
|
|
- height: 89vh;
|
|
|
- text-align: center;
|
|
|
- font-size: 50px;
|
|
|
- font-weight: bold;
|
|
|
- border-collapse: collapse;
|
|
|
-
|
|
|
- td {
|
|
|
- border:1px solid rgb(3, 107, 122);
|
|
|
- height: 20%;
|
|
|
- color: white;
|
|
|
- }
|
|
|
-
|
|
|
- .colored-background {
|
|
|
- background-color: rgb(0, 82, 94);
|
|
|
- padding: 16px 0;
|
|
|
- }
|
|
|
-
|
|
|
- .colored-text {
|
|
|
- color: rgb(0, 82, 94);
|
|
|
- }
|
|
|
-
|
|
|
- .w12 {
|
|
|
- width: 12%;
|
|
|
- }
|
|
|
-
|
|
|
- .w14 {
|
|
|
- width: 14%;
|
|
|
- }
|
|
|
-
|
|
|
- .w18 {
|
|
|
- width: 18%;
|
|
|
- }
|
|
|
-
|
|
|
- .w22 {
|
|
|
- width: 22%;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-</style>
|