test

src/views/IpoCalendar/index.vue

@@ -21,9 +21,16 @@
                     </el-button>
 
                 </template>
-                <!-- <template #date-cell="{ data }">
-
-                    </template> -->
+                <template #dateCell="{data}">
+               
+               <p style="margin:0px" >
+                     {{ data.day.split('-').slice(2).join() }}
+                     
+                <div v-for="(i, index) in dayTime" :key="index">
+                   <div v-if="data.day==i" class="yuan"></div>
+               </div>
+              </p>
+           </template>
             </el-calendar>
         </div>
         <div class="right-bottom1">
@@ -46,7 +53,7 @@ import moment from "moment"
 import i18n from '@/locales'
 import { getCurrentInstance } from 'vue'
 import Event from '@/views/login/components/Event.vue';
-import { getEventData, getSearchListing } from "@/api/reqIpo/ipo";
+import { getEventData, getSearchListing,getDate } from "@/api/reqIpo/ipo";
 import { getDataFromId } from "@/api/mock/home"
 const { proxy } = (getCurrentInstance() as any)
 const dayValue = ref(new Date())
@@ -60,6 +67,12 @@ watch(dayValue, async (ne, ol) => {
     const result = await getEventData(day);
     setEventdata((result as any).data)
 })
+const dayTime = ref()
+const getcalendar = async ()=>{
+    const res = await getDate()
+  dayTime.value = (res as any).data
+  console.log(dayTime.value);
+}
 const showMounth = (date: any) => {
     const arr = date.split(" ")
     if (arr.length == 3) {
@@ -72,6 +85,7 @@ onMounted(async () => {
     var day = moment(Date.now()).format("YYYY-MM-DD")
     const result = await getEventData(day);
     setEventdata((result as any).data)
+    getcalendar()
 })
 const setEventdata = (EventD: any) => {
     Eventdata.value = EventD.map((item: any) => {
@@ -92,6 +106,18 @@ const backRouter = () => {
 
 <style lang="scss"  scoped>
 @media screen and (max-width: 768px) {
+    .yuan{
+        width: 12px;
+    height: 12px;
+    background-color: #f7be39;
+    position: absolute;
+    //right: 20px;
+    //top: 36px;
+    transform: translateY(11px);
+    //transform: translateX(3px);
+    margin-left: 3px;
+    border-radius: 10px;
+}
     .right {
         width: 100vw;
         box-sizing: border-box;
@@ -239,6 +265,7 @@ const backRouter = () => {
         display: flex;
         justify-content: center;
         align-items: center;
+        position: relative;
         // font-family: "Calibri"
     }
 
@@ -262,15 +289,12 @@ const backRouter = () => {
 
     :deep(.el-calendar-table td.is-selected .el-calendar-day) {
         // background-color: #e36466;
-        border: 5px solid #e36466;
+        border: 3px solid #e36466;
     }
 
     :deep(.el-calendar-table td.is-selected .el-calendar-day span) {
         color: black;
     }
-
-
-
     :deep(.is-selected) {
         color: red;
     }