ElementU日历Demo
嗯,项目需求有这个,试着写了一个Demo看看效果。有好的建议请小伙伴留言
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!-- import CSS --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <!-- import Vue before Element --> <script src="https://unpkg.com/vue/dist/vue.js"></script> <!-- import JavaScript --> <script src="https://unpkg.com/element-ui/lib/index.js"></script> </head> <body style="display: flex;justify-content: center;"> <div id="app" style="display: flex;justify-content: center;width: 80%;;margin-top: 50px;"> <el-card class="box-card"> <el-calendar> <!-- 这里使用的是 2.5 slot 语法,对于新项目请使用 2.6 slot 语法--> <template slot="dateCell" slot-scope="{date, data}"> <div :class="data.isSelected ? 'is-selected' : ''"> <p class="dayItem">{{ date.getDate()}}</p> <div style="display: flex;flex-wrap: wrap;"> <div v-for="(item,index) in initDataFu(date)" :key="index"> <el-popover trigger="hover" placement="top-end" title="计划内容" close-delay="0"> <div style=" flex: 0 50px; margin: 5px;width: 260px;"> <el-date-picker v-model="dateform(item)" type="daterange" range-separator="至" :editable="false" :clearable="false" size="mini" style="margin: 2.5px;width: 250px;" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker><br> <!-- <template> <el-radio v-model="radio" label="1">备选项</el-radio> <el-radio v-model="radio" label="2">备选项</el-radio> </template> --> <el-input size="mini" v-model="item[1].name" style="margin: 2.5px;width: 250px;" readonly> <template slot="prepend">内容:</template> </el-input> <el-input size="mini" v-model="item[1].adderss" style="margin: 2.5px;width: 250px;" readonly> <template slot="prepend">地点</template> </el-input> </div> <el-tag size="mini" @click="disabled = !disabled" slot="reference" :type="types(index)" style="margin: 2px;"> {{ item[0]}}</el-tag> </el-popover> </div> </div> </div> <!-- <div style="display: flex;justify-content:center;flex-wrap:wrap;"> --> <div> </div> </div> </template> </el-calendar> </el-card> </div> </body> <script> new Vue({ el: '#app', data() { return { value: new Date(), disabled: '', visible: false, dateRange: [], initData: { "userList": [ { "userId": "1111", "userName": "admin", "projList": [ { "id": "08c6ac458e8a420daa87", "userId": "1111", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-01", "endDate": "2020-10-20", "name": "9999", "address": null, "userType": 0, "userMajor": null, "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 303, "dayOfMonth": 29, "hour": 10, "minute": 34, "monthValue": 10, "nano": 0, "second": 32, "dayOfWeek": "THURSDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "395ad5ffe1b04553a53b", "userId": "1111", "planId": "d1451de7feee46499412", "projId": null, "type": 0, "startDate": "2020-10-21", "endDate": "2020-10-23", "name": "休假中", "address": "1111", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 17, "minute": 26, "monthValue": 10, "nano": 0, "second": 21, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 17, "minute": 26, "monthValue": 10, "nano": 0, "second": 21, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }, { "id": "6fd149272ac34c18b4c6", "userId": "1111", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-22", "endDate": "2020-10-22", "name": "测试项目1009-2", "address": "清水河", "userType": 0, "userMajor": "3", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 32, "monthValue": 10, "nano": 0, "second": 38, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 32, "monthValue": 10, "nano": 0, "second": 38, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }, { "id": "75b5e335597d4adc852b", "userId": "1111", "planId": "d1451de7feee46499412", "projId": null, "type": 1, "startDate": "2020-10-12", "endDate": "2020-10-30", "name": "asdasdasda", "address": "北京", "userType": 1, "userMajor": "", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 23, "monthValue": 10, "nano": 0, "second": 14, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 23, "monthValue": 10, "nano": 0, "second": 14, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }, { "id": "88128ddaa860432c920b", "userId": "1111", "planId": "d1451de7feee46499412", "projId": "f0e51da27e8e4390bf49", "type": 0, "startDate": "2020-10-29", "endDate": "2020-11-02", "name": "测试项目0907-3", "address": "上海", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 23, "monthValue": 10, "nano": 0, "second": 58, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 23, "monthValue": 10, "nano": 0, "second": 58, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }, { "id": "98385c6c80dc4a64bfe3", "userId": "1111", "planId": "30dec21ce4bc4ad58a43", "projId": "57cfa87c6ba14fe480bf", "type": 0, "startDate": "2020-10-02", "endDate": "2020-10-23", "name": "1026-LRL-评审权限测试", "address": "77", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 4, "monthValue": 11, "nano": 0, "second": 31, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "ae11662ca3e74d91a537", "userId": "1111", "planId": "d1451de7feee46499412", "projId": "95ca510eddf741a8b424", "type": 0, "startDate": "2020-10-19", "endDate": "2020-10-22", "name": "测试0907-4", "address": "杭州", "userType": 0, "userMajor": "3", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 28, "monthValue": 10, "nano": 0, "second": 12, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 28, "monthValue": 10, "nano": 0, "second": 12, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }] }, { "userId": "13f673b3998b42e89613", "userName": "项目经理", "projList": [] }, { "userId": "1f9f869a6afd43988b82", "userName": "sj102", "projList": [{ "id": "009b151a5ff74dffae82", "userId": "1f9f869a6afd43988b82", "planId": "30dec21ce4bc4ad58a43", "projId": "310ec5a1cf274dea9356", "type": 0, "startDate": "2020-10-08", "endDate": "2020-10-09", "name": "测试-2020-11-03-01", "address": "", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 308, "dayOfMonth": 3, "hour": 13, "minute": 41, "monthValue": 11, "nano": 0, "second": 6, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "35e7437cf1c64aab90a3", "userId": "1f9f869a6afd43988b82", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试项目1009-2", "address": "", "userType": 0, "userMajor": null, "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 15, "minute": 48, "monthValue": 11, "nano": 0, "second": 41, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "69d4244af88245889de8", "userId": "1f9f869a6afd43988b82", "planId": "30dec21ce4bc4ad58a43", "projId": "310ec5a1cf274dea9356", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试-2020-11-03-01", "address": "3366666", "userType": 0, "userMajor": "3", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 8, "monthValue": 11, "nano": 0, "second": 50, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "e85ae8bac3e442dc92c5", "userId": "1f9f869a6afd43988b82", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-15", "endDate": "2020-10-16", "name": "测试项目1009-2", "address": "45445465465", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 20, "monthValue": 11, "nano": 0, "second": 12, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "2ea262356baf4c5c8f1d", "userName": "ps102", "projList": [{ "id": "20c3fe8c93da4eda9a41", "userId": "2ea262356baf4c5c8f1d", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-15", "endDate": "2020-10-16", "name": "测试项目1009-2", "address": "45445465465", "userType": 0, "userMajor": "3", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 20, "monthValue": 11, "nano": 0, "second": 12, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "e6061bad513040bab034", "userId": "2ea262356baf4c5c8f1d", "planId": "30dec21ce4bc4ad58a43", "projId": "fc0d7aaeca3148738287", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试-2020-11-03-02", "address": "8946465", "userType": 0, "userMajor": null, "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 2, "monthValue": 11, "nano": 0, "second": 4, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "3356769b538e4e839e08", "userName": "刘小城", "projList": [] }, { "userId": "51bd1f014df943ea8dcb", "userName": "设计单位1", "projList": [] }, { "userId": "5d038e8f4d0c4a1cb754", "userName": "电气二次", "projList": [{ "id": "1563bb6647154cb88273", "userId": "5d038e8f4d0c4a1cb754", "planId": "30dec21ce4bc4ad58a43", "projId": "310ec5a1cf274dea9356", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试-2020-11-03-01", "address": "3366666", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 8, "monthValue": 11, "nano": 0, "second": 50, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "678ac8c4fce44242bb1d", "userName": "副总师", "projList": [] }, { "userId": "741d93d40c1546c3a250", "userName": "评审101", "projList": [{ "id": "530df0a93bd34d9db135", "userId": "741d93d40c1546c3a250", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-01", "endDate": "2020-10-20", "name": "9999", "address": null, "userType": 0, "userMajor": null, "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 303, "dayOfMonth": 29, "hour": 10, "minute": 34, "monthValue": 10, "nano": 0, "second": 32, "dayOfWeek": "THURSDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "788c17e52c9349bf96f8", "userId": "741d93d40c1546c3a250", "planId": "d1451de7feee46499412", "projId": null, "type": 1, "startDate": "2020-10-19", "endDate": "2020-10-14", "name": "休假中", "address": "北京", "userType": 1, "userMajor": "", "releaseState": 0, "ver": 0, "createTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 22, "monthValue": 10, "nano": 0, "second": 38, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": { "month": "OCTOBER", "year": 2020, "dayOfYear": 297, "dayOfMonth": 23, "hour": 16, "minute": 22, "monthValue": 10, "nano": 0, "second": 38, "dayOfWeek": "FRIDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "updateUser": null }, { "id": "a394420334ec4aa0be75", "userId": "741d93d40c1546c3a250", "planId": "30dec21ce4bc4ad58a43", "projId": "310ec5a1cf274dea9356", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试-2020-11-03-01", "address": "3333", "userType": 0, "userMajor": "4", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 7, "monthValue": 11, "nano": 0, "second": 56, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "7e5b6dbccb69447a8647", "userName": "变电土建", "projList": [{ "id": "e3ac463dfa4e474d9358", "userId": "7e5b6dbccb69447a8647", "planId": "18d99c1b7c264b3e8607", "projId": null, "type": 1, "startDate": "2020-10-07", "endDate": "2020-10-08", "name": "11123", "address": "111", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 308, "dayOfMonth": 3, "hour": 14, "minute": 40, "monthValue": 11, "nano": 0, "second": 26, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "82eba4b7396e4565be6e", "userName": "js102", "projList": [{ "id": "091395f874ac472cb0d1", "userId": "82eba4b7396e4565be6e", "planId": "30dec21ce4bc4ad58a43", "projId": "fc0d7aaeca3148738287", "type": 0, "startDate": "2020-10-12", "endDate": "2020-10-13", "name": "测试-2020-11-03-02", "address": "78", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 16, "minute": 3, "monthValue": 11, "nano": 0, "second": 27, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "2ac075f1717a4f5c89a1", "userId": "82eba4b7396e4565be6e", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试项目1009-2", "address": "231", "userType": 0, "userMajor": "3", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 24, "monthValue": 11, "nano": 0, "second": 26, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "a3f4dc74a9944e61ba08", "userName": "部门主任", "projList": [] }, { "userId": "a7c1b098477f4aa6a420", "userName": "电气一次", "projList": [{ "id": "62542342bc6d4355b885", "userId": "a7c1b098477f4aa6a420", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试项目1009-2", "address": "231", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 24, "monthValue": 11, "nano": 0, "second": 26, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "6b97c7ef62e548f4b74e", "userId": "a7c1b098477f4aa6a420", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-08", "endDate": "2020-10-09", "name": "测试项目1009-2", "address": "IPIPOi", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 32, "monthValue": 11, "nano": 0, "second": 15, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }, { "userId": "fe73b4c46ae84906b783", "userName": "汇总人", "projList": [{ "id": "abb23e99279e43d59fdd", "userId": "fe73b4c46ae84906b783", "planId": "18d99c1b7c264b3e8607", "projId": "91b69e8bd3ac4d319828", "type": 0, "startDate": "2020-10-18", "endDate": "2020-10-19", "name": "测试项目1009-1", "address": "12", "userType": 0, "userMajor": "2", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 308, "dayOfMonth": 3, "hour": 14, "minute": 18, "monthValue": 11, "nano": 0, "second": 37, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "ce895eabfde7428d81a8", "userId": "fe73b4c46ae84906b783", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-03", "endDate": "2020-10-04", "name": "测试项目1009-2", "address": "23423423", "userType": 0, "userMajor": null, "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 22, "monthValue": 11, "nano": 0, "second": 55, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }, { "id": "d2ac7a83ad5c4cda9f8e", "userId": "fe73b4c46ae84906b783", "planId": "d1451de7feee46499412", "projId": "5753a75fe5bf4d6c8b0b", "type": 0, "startDate": "2020-10-15", "endDate": "2020-10-16", "name": "测试项目1009-2", "address": "45445465465", "userType": 0, "userMajor": "1", "releaseState": 0, "ver": 0, "createTime": { "month": "NOVEMBER", "year": 2020, "dayOfYear": 315, "dayOfMonth": 10, "hour": 9, "minute": 20, "monthValue": 11, "nano": 0, "second": 12, "dayOfWeek": "TUESDAY", "chronology": { "id": "ISO", "calendarType": "iso8601" } }, "createUser": "1111", "updateTime": null, "updateUser": null }] }] } } }, mounted() { this.initPlanDate(); }, methods: { dateform(vle){ return [vle[1].startDate,vle[1].endDate]; }, types(index) { let style = ['success', 'info', 'warning', 'danger']; return style[this.randomNum(0, 4)]; }, initDataFu(day) { let item = this.initData.userList; let dateDay = new Date(day); let userList = new Map(); if ((dateDay.getMonth() + 1) == 10) { if (item.length == 0) { return userList; } else { for (let i = 0; i < item.length; i++) { let boo = false; item[i].projList.forEach(e => { let startDate = new Date(Date.parse(e.startDate.replace(/-/g, "/"))); let endDate = new Date(Date.parse(e.endDate.replace(/-/g, "/"))); console.log(endDate.getDate()) console.log(startDate.getDate()) console.log(dateDay.getDate()) if ((startDate.getDate() <= dateDay.getDate() && endDate.getDate() >= dateDay.getDate())) { if (userList.has(item[i])) { userList.set(item[i].userName, userList.get(item[i]) + ";" + e) } else { userList.set(item[i].userName, e); } } }); } return userList; } } console.log((dateDay.getMonth() + 1), dateDay.getDate(), item) }, // 数据初始化 initPlanDate() { }, randomNum(minNum, maxNum) { switch (arguments.length) { case 1: return parseInt(Math.random() * minNum + 1, 10); break; case 2: return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10); break; default: return 0; break; } }, crunt(data) { userdata.forEach(element => { console.log(element); userName = element.userName; }); new Date(Date.parse("".replace(/-/g, "/"))); return userName; } }, props: {}, computed: {}, created() { }, watch: {}, }) </script> <style> .is-selected { color: #1989FA; } .dayItem { position: absolute; margin-top: 1%; margin-left: 8%; font-size: 20px; opacity: 0.2; } .current .is-selected {} </style> </html>
加油,愿被这世界温柔以待 ^_^