Vue implementiert den Anwesenheitskalender von DingTalk

<style lang="scss" rel="stylesheet/scss">
    @media screen und (min-width: 460px) {
        .wh_item_date:hover {
            Hintergrund: #71c7a5;
            Cursor: Zeiger;
        }
    }

    * {
        Rand: 0;
        Polsterung: 0;
    }

    .wh_container {
        maximale Breite: 410px;
        Rand: automatisch;
    }

    li {
        Listenstiltyp: keiner;
    }

    .wh_top_title {
        Anzeige: Flex;
    }

    .wh_top_title li {
        Cursor: Zeiger;
        Anzeige: Flex;
        Farbe: #fff;
        Schriftgröße: 18px;
        biegen: 1;
        Inhalt ausrichten: zentriert;
        Elemente ausrichten: zentrieren;
        Höhe: 47px;
    }

    .wh_top_title .wh_content_li {
        Cursor: automatisch;
        Flex: 2,5;
        Farbe: Schwarz;
    }

    .wh_inhalt_alle {
        Schriftfamilie: -apple-system, BlinkMacSystemFont, "PingFang SC",
        „Helvetica Neue“, STHeiti, „Microsoft Yahei“, Tahoma, Simsun, serifenlos;
        Hintergrundfarbe: weiß;
        Breite: 100 %;
        Überlauf: versteckt;
        Polsterung unten: 8px;
    }

    .wh_inhalt {
        Anzeige: Flex;
        Flex-Wrap: Umwickeln;
        Polsterung: 0,3 % 0,3 %;
        Breite: 100 %;
    }

    .wh_content:erstes-Kind .wh_content_item_tag,
    .wh_content:erstes-Kind .wh_content_item {
        Farbe: #ddd;
        Schriftgröße: 16px;
    }

    .wh_content_item,
    wh_content_item_tag {
        Schriftgröße: 15px;
        Breite: 13,4 %;
        Textausrichtung: zentriert;
        Farbe: #fff;
        Position: relativ;
    }

    .wh_content_item {
        Höhe: 40px;
    }

    .wh_top_tag {
        Breite: 40px;
        Höhe: 40px;
        Zeilenhöhe: 40px;
        Rand: automatisch;
        Anzeige: Flex;
        Inhalt ausrichten: zentriert;
        Elemente ausrichten: zentrieren;
        Farbe: Schwarz;
    }

    .wh_item_date {
        Breite: 30px;
        Höhe: 30px;
        Zeilenhöhe: 30px;
        Rand: automatisch;
        Anzeige: Flex;
        Inhalt ausrichten: zentriert;
        Elemente ausrichten: zentrieren;
        Farbe: Schwarz;

        .kleinerPunkt {
            Hintergrundfarbe: #f99341;
            Breite: 5px;
            Höhe: 5px;
            Randradius: 50 %;
            Textausrichtung: zentriert;
            Rand links: 13px;
        }

        .smallDot1 {
            Hintergrundfarbe: #1989fa;
            Breite: 5px;
            Höhe: 5px;
            Randradius: 50 %;
            Textausrichtung: zentriert;
            Rand links: 13px;
        }
    }

    .wh_left {
        Breite: 12px;
        Höhe: 12px;
        Rahmen oben: 2px durchgezogen #ffffff;
        Rahmen links: 2px durchgezogen #ffffff;
        transformieren: drehen (-45 Grad);
        Rahmenfarbe: schwarz;
    }

    .wh_left:aktiv,
    .wh_right:aktiv {
        Rahmenfarbe: #ddd;
    }

    .wh_rechts {
        Breite: 12px;
        Höhe: 12px;
        Rahmen oben: 2px durchgezogen #ffffff;
        Rahmen rechts: 2px durchgezogen #ffffff;
        transformieren: drehen (45 Grad);
        Rahmenfarbe: schwarz;
    }

    .wh_content_item > .wh_isMark {
        Rand: automatisch;
        Randradius: 50 %;
        Hintergrund: blau;
        Z-Index: 2;
    }

    .wh_content_item .wh_other_dayHide {
        Farbe: #bfbfbf;
    }

    .wh_content_item .wh_want_dayHide {
        Farbe: #bfbfbf;
    }

    .wh_content_item .wh_istHeute {
        Hintergrund: #77adfa;
        Randradius: 50 %;
    }

    .wh_content_item .wh_chose_day {
        Hintergrund: #1989fa;
        Randradius: 50 %;
    }
</Stil>

<Vorlage>
    <Abschnitt Klasse="wh_container">
        <div Klasse="wh_content_all">
            <div Klasse="wh_top_title">
                <li @click="Vormonat(meinDatum,false)">
                    <div Klasse="wh_left"></div>
                </li>
                <li class="wh_content_li">{{dateTop}}</li>
                <li @click="NächsterMonat(meinDatum,false)">
                    <div Klasse="wh_right"></div>
                </li>
            </div>
            <div Klasse="wh_content">
                <div class="wh_content_item" v-for="Tag im TextTop">
                    <div class="wh_top_tag">{{tag}}</div>
                </div>
            </div>
            <div Klasse="wh_content">
                <div Klasse="wh_content_item" v-for="(Element,Index) in Liste" @click="clickDay(Element,Index)">
                    <div Klasse = "wh_item_date" Stil = "Anzeige: Block"
                         v-bind:class="[{ wh_isMark: item.isMark},{wh_other_dayHide:item.otherMonth!=='nowMonth'},{wh_want_dayHide:item.dayHide},{wh_isToday:item.isToday},{wh_chose_day:item.chooseDay},setClass(item)]">
                        {{item.id}}
                        <!--Dies ist der kleine Punkt, der Anomalie und Normalität kontrolliert-->
                        <span v-for="(Datum,Index) in Datumsliste" :Schlüssel="Index">
                            <span v-if="date.offDutyTime&&date.onDutyTime&&formatDate(date.recordDate)==item.date&&(isLate(date.serverEndTime,date.offDutyTime)||isLate(date.onDutyTime,date.serverStartTime))">
                                    <div Klasse="smallDot"></div>
                            </span>
                            <span v-if="date.offDutyTime&&date.onDutyTime&&formatDate(date.recordDate)==item.date&&!isLate(date.serverEndTime,date.offDutyTime)&&!isLate(date.onDutyTime,date.serverStartTime)">
                                <div Klasse="smallDot1"></div>
                            </span>
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </Abschnitt>
</Vorlage>

<Skript>
    importiere timeUtil aus "./calendar";

    Standard exportieren {
        Daten() {
            zurückkehren {
                meinDatum: [],
                Liste: [],
                VerlaufAusgewählt: [],
                DatumTop: "",
                loginNannyUser: {},
                loginGzhBenutzer: {},
                Datumsliste: []
            };
        },
        Requisiten: {
            markDate: {
                Typ: Array,
                Standard: () => []
            },
            markDateMore: {
                Typ: Array,
                Standard: () => []
            },
            textTop: {
                Typ: Array,
                Standard: () => ["Mo", "Di", "Mi", "Do", "Fr", "Sa", "So"]
            },
            SonntagStart: {
                Typ: Boolean,
                Standard: () => false
            },
            vorTagAusblenden: {
                Typ: Zeichenfolge,
                Standard: `0`
            },
            futureDayHide: {
                Typ: Zeichenfolge,
                Standard: `2554387200`
            },
            beitretenWishId: {
                Standard: null
            }
        },
        erstellt() {
            sei $this = dies;
            this.getLoginAllUser("nanny", {}, function () {//Das geht mich nur etwas an, löschen Sie es einfach});
            this.intStart(); //Daten initialisieren this.myDate = new Date();
        },
        Methoden: {
            isLate(str, str1) {//Größe von zwei Stunden, Minuten und Sekunden beurteilen return new Date((this.formatDates(new Date()) + " " + str).replace(/-/g, '/')) > new Date((this.formatDates(new Date()) + " " + str1).replace(/-/g, '/'));
            },
            formatDate(Datum) {
                Datum = Typ des Datums === 'Zeichenfolge'? Neues Datum (Datum.Ersetzen(/\-/g, '/')): Datum;
                returniere date.getFullYear() + '/' + (date.getMonth() + 1) + '/'
                    + date.getDate();
            },
            intStart() {
                timeUtil.sundayStart = dies.sundayStart;
            },
            setzeKlasse(Daten) {
                lass obj = {};
                obj[Daten.Markierungsklassenname] = Daten.Markierungsklassenname;
                gibt Objekt zurück;
            },
            KlickTag(Element, Index) {
                wenn (item.otherMonth === "nowMonth" && !item.dayHide) {
                    dies.getList(dieses.meinDate, item.date);
                }
                wenn (item.otherMonth !== "jetztMonat") {
                    item.otherMonth === "Vormonat"
                        ? dies.PreMonth(Artikel.Datum)
                        : dieser.NächsterMonat(Artikel.Datum);
                }
            },
            Monat auswählen(Datum, istAusgewählterTag = true) {
                Datum = Zeitutil.Datumsformat(Datum);
                this.myDate = neues Datum(Datum);
                dies.$emit("changeMonth", timeUtil.dateFormat(dieses.meinDate));
                if (istAusgewählterTag) {
                    this.getList(this.myDate, date, isSelectedDay);
                } anders {
                    dies.getList(dieses.meinDatum);
                }
            },
            Vormonat(Datum, istAusgewählterTag = true) {
                Datum = Zeitutil.Datumsformat(Datum);
                this.myDate = timeUtil.getOtherMonth(this.myDate, "preMonth");
                dies.$emit("changeMonth", timeUtil.dateFormat(dieses.meinDate));
                this.axiosPost("/nannyCheckIn/findMonthList.n", {Datum: this.myDate,joinWishListId: this.joinWishId,}, Funktion (resData) {
                    diese.Datumsliste = resData.Liste;
                });
                if (istAusgewählterTag) {
                    this.getList(this.myDate, date, isSelectedDay);
                } anders {
                    dies.getList(dieses.meinDatum);
                }
            },
            NächsterMonat(Datum, istAusgewählterTag = true) {
                Datum = Zeitutil.Datumsformat(Datum);
                this.myDate = timeUtil.getOtherMonth(this.myDate, "nextMonth");
                dies.$emit("changeMonth", timeUtil.dateFormat(dieses.meinDate));
                this.axiosPost("/nannyCheckIn/findMonthList.n", {Datum: this.myDate,joinWishListId: this.joinWishId,}, Funktion (resData) {
                    diese.Datumsliste = resData.Liste;
                });
                if (istAusgewählterTag) {
                    this.getList(this.myDate, date, isSelectedDay);
                } anders {
                    dies.getList(dieses.meinDatum);
                }
            },
            fürMatArgs() {
                Lassen Sie markDate = this.markDate;
                Lassen Sie markDateMore = this.markDateMore;
                markDate = markDate.map(k => {
                    gibt timeUtil.dateFormat(k) zurück;
                });
                markDateMore = markDateMore.map(k => {
                    k.date = timeUtil.dateFormat(k.date);
                    Rückkehr k;
                });
                return [Datum markieren, Datum mehr markieren];
            },
            getList(Datum, wähleTag, istAusgewählterTag = true) {
                const [markDate, markDateMore] = this.forMatArgs();
                this.dateTop = `${date.getFullYear()}Jahr${date.getMonth() + 1}Monat`;

                Lassen Sie arr = timeUtil.getMonthList(this.myDate);
                für (sei i = 0; i < arr.length; i++) {
                    lassen Sie markClassName = "";
                    sei k = arr[i];
                    k.wählenTag = falsch;
                    const jetztZeit = k.date;
                    const t = neues Date(jetzteUhrzeit).getTime() / 1000;
                    //Schauen Sie sich die Klasse jedes Tages an
                    für (const c von markDateMore) {
                        wenn (c.date === jetztUhrzeit) {
                            markClassName = c.klassenName || "";
                        }
                    }
                    //Ausgewählte Tage zum Festlegen der Klasse markieren
                    k.markClassName = markClassName;
                    k.isMark = markDate.indexOf(jetzteZeit) > -1;
                    //Ein bestimmter Tag kann nicht ausgewählt werden k.dayHide = t < this.agoDayHide || t > this.futureDayHide;
                    wenn (k.istHeute) {
                        dies.$emit("istHeute", jetztZeit);
                    }
                    let flag = !k.dayHide und k.otherMonth === "jetztMonat";
                    wenn (wähleTag && wähleTag === jetztUhrzeit && flag) {
                        dies.$emit("gewählterTag", aktuelleUhrzeit);
                        dies.historyChose.push(jetztZeit);
                        k.wählenTag = true;
                    } sonst wenn (
                        this.historyChose[this.historyChose.length - 1] === jetztZeit &&
                        !Tag wählen &&
                        Flagge
                    ) {
                        k.wählenTag = true;
                    }
                }
                diese.Liste = arr;
            }
        },
        montiert() {
            dies.getList(dieses.meinDatum);
            this.axiosPost("/nannyCheckIn/findMonthList.n", {//Business, ändern Sie joinWishListId entsprechend Ihren Anforderungen: this.joinWishId,
            }, Funktion (resData) {
                diese.Datumsliste = resData.Liste;
            });
        },
        betrachten:
            markDate: {
                handler(val, alterWert) {
                    dies.getList(dieses.meinDatum);
                },
                tief: wahr
            },
            markDateMore: {
                handler(val, alterWert) {
                    dies.getList(dieses.meinDatum);
                },
                tief: wahr
            },
            vorTagAusblenden: {
                handler(val, alterWert) {
                    dies.getList(dieses.meinDatum);
                },
                tief: wahr
            },
            futureDayHide: {
                handler(val, alterWert) {
                    dies.getList(dieses.meinDatum);
                },
                tief: wahr
            },
            SonntagStart: {
                handler(val, alterWert) {
                    dies.intStart();
                    dies.getList(dieses.meinDatum);
                },
                tief: wahr
            },
            joinWishId: {//Hören Sie sich das an, denn wir müssen die Arbeitsreihenfolge ändern und den Datenhandler (val, oldVal) ändern {
                    dies.axiosPost("/nannyCheckIn/findMonthList.n", {
                        beitretenWishListId: val,
                    }, Funktion (resData) {
                        diese.Datumsliste = resData.Liste;
                    });
                },
                tief: wahr
            }
        }
    };
</Skript>

Standard exportieren {
  // Die Anzahl der Tage in einem Monat getDaysInOneMonth(date) {
    const year = date.getFullYear();
    const Monat = Datum.getMonth() + 1;
    const d = neues Datum (Jahr, Monat, 0);
    Gibt d.getDate( zurück);
  },
  // einige leeren getMonthweek(date) {
    const year = date.getFullYear();
    const Monat = Datum.getMonth() + 1;
    const dateFirstOne = neues Datum (Jahr + '/' + Monat + '/1');
    this.sundayStart zurückgeben?
      dateFirstOne.getDay() == 0 ? 7 : dateFirstOne.getDay() :
      dateFirstOne.getDay() == 0 ? 6 : dateFirstOne.getDay() - 1;
  },
  /**
   * Holen Sie sich den vorherigen oder nächsten Monat des aktuellen Datums */
  getOtherMonth(date, str = 'nächsterMonat') {
    const timeArray = this.dateFormat(date).split('/');
    const jahr = zeitArray[0];
    const Monat = ZeitArray[1];
    const Tag = ZeitArray[2];
    sei Jahr2 = Jahr;
    lass Monat2;
    wenn (str === 'nächsterMonat') {
      Monat2 = parseInt(Monat) + 1;
      wenn (Monat2 == 13) {
        Jahr2 = parseInt(Jahr2) + 1;
        Monat2 = 1;
      }
    } anders {
      Monat2 = parseInt(Monat) - 1;
      wenn (Monat2 == 0) {
        Jahr2 = parseInt(Jahr2) - 1;
        Monat2 = 12;
      }
    }
    sei Tag2 = Tag;
    const Tage2 = neues Datum (Jahr2, Monat2, 0).getDate();
    if (Tag2 > Tage2) {
      Tag2 = Tage2;
    }
    wenn (Monat2 < 10) {
      Monat2 = '0' + Monat2;
    }
    wenn (Tag2 < 10) {
      Tag2 = '0' + Tag2;
    }
    const t2 = Jahr2 + '/' + Monat2 + '/' + Tag2;
    gib ein neues Datum (t2) zurück;
  },
  // Einige Daten am Ende des letzten Monats getLeftArr(date) {
    const arr = [];
    const leftNum = this.getMonthweek(date);
    const num = this.getDaysInOneMonth(this.getOtherMonth(date, 'preMonth')) - leftNum + 1;
    const preDate = this.getOtherMonth(date, 'preMonth');
    // Wie viele Tage hat es letzten Monat begonnenfor (let i = 0; i < leftNum; i++) {
      const nowTime = preDate.getFullYear() + '/' + (preDate.getMonth() + 1) + '/' + (num + i);
      arr.push({
        ID: Nummer + i,
        Datum: aktuelle Uhrzeit,
        istHeute: falsch,
        andererMonat: 'vorMonat',
      });
    }
    Rückflug an;
  },
  // Irgendein Datum am Ende des nächsten Monats getRightArr(date) {
    const arr = [];
    const nextDate = this.getOtherMonth(date, 'nextMonth');
    const leftLength = this.getDaysInOneMonth(Datum) + this.getMonthweek(Datum);
    const _length = 7 – linke Länge % 7;
    für (lass i = 0; i < _Länge; i++) {
      const nowTime = nextDate.getFullYear() + '/' + (nextDate.getMonth() + 1) + '/' + (i + 1);
      arr.push({
        Ich würde: i + 1,
        Datum: aktuelle Uhrzeit,
        istHeute: falsch,
        andererMonat: 'nächsterMonat',
      });
    }
    Rückflug an;
  },
  // Datum formatieren dateFormat(Datum) {
    Datum = Typ des Datums === 'Zeichenfolge'? Neues Datum (Datum.Ersetzen(/\-/g, '/')): Datum;
    return date.getFullYear() + '/' + (date.getMonth() + 1) + '/'
      + date.getDate();
  },
  // Liste eines bestimmten Monats abrufen, ausgenommen den vorherigen und den nächsten Monat getMonthListNoOther(date) {
    const arr = [];
    const num = this.getDaysInOneMonth(Datum);
    const year = date.getFullYear();
    const Monat = Datum.getMonth() + 1;
    const toDay = dieses.dateFormat(neues Datum());

    für (sei i = 0; i < num; i++) {
      const nowTime = Jahr + '/' + Monat + '/' + (i + 1);
      arr.push({
        Ich würde: i + 1,
        Datum: aktuelle Uhrzeit,
        istHeute: heute === jetztZeit,
        andererMonat: 'jetztMonat',
      });
    }
    Rückflug an;
  },
  // Eine Liste der Monate zum Rendern abrufen getMonthList(date) {
    zurückgeben [ …this.getLeftArr(Datum), …this.getMonthListNoOther(Datum), …this.getRightArr(Datum) ];
  },
  // Der Standardwert ist Montag sundayStart: false,
};

importiere nCalendar aus './checkCalendar'

Standard exportieren (Vue) => {
    Vue.component("nCalendar", nCalendar);
}

<style lang="scss" rel="stylesheet/scss">
    .nKalender {

        .detailDiv {
            Rand: 20px 0;

            .imgDiv {
                img {
                    Breite: 60px;
                    Höhe: 60px;
                }
            }

            .hourDiv {
                Hintergrundfarbe: weiß;
                Polsterung oben: 10px;

                .Uhrstil {
                    Schriftgröße: 16px;
                    Farbe: #4b90ed;
                }

                .StundenText {
                    Schriftgröße: 14px;
                    Rand links: 5px;
                }
            }

            .stepDiv {
                .tagDiv {
                    Rand oben: 10px;
                }
            }
        }
    }
</Stil>
<Vorlage>
    <div Klasse="nKalender">
        <Navigationsleiste
                :showLeft="wahr"
                :borderLine=true
                Hintergrund="f2f2f2"
                Titel="Anwesenheitskalender">
            <div @click="$router.push('/h5nAddCard')" slot="right">Karte hinzufügen</div>
        </navBar>
        <van-field label="Arbeitsauftrag auswählen" v-if="list.length>1"
                   :Wert="obj1!=null&&obj1.joinWishId!=null?obj1.joinWishId:null">
            <selectJoinTemp slot="Eingabe" name="joinWishId" name1="auditUserId"
                            v-Modell="obj1" :isDefault="true"/>
        </van-field>
        <!--Kalender-->
        <div Klasse="CalendarDiv" v-if="obj1&&obj1.joinWishId&&obj1.joinWishId>0">
            <nKalender
                    :joinWishId="obj1.joinWishId"
                    v-on:choseDay="Klicktag"
                    v-on:changeMonth="Änderungsdatum"/>
        </div>

        <div v-if="list.length==0" class="detailDiv" style="text-align: center;color: #bfbfbf">
            <div Klasse="imgDiv">
                <img src="../img/rest.png"/>
            </div>
            <div Stil="margin-top: 2%">
                Kein Vertrag</div>
        </div>
        <!--Einzelheiten des Tages-->
        <span></span>
        <div Klasse="detailDiv"
             v-if="obj!=null&&obj.id>0&&obj.recordDate&&neues Datum(obj.recordDate.replace(/-/g,'/'))<neues Datum()">
            <div Klasse="StundenDiv">
                <van-Reihe>
                    <van-col offset="1">
                        <van-icon name="Uhr" Klasse="Uhrenstil"/>
                    </van-col>
                    <van-col class="hourText">Gesamtarbeitsstunden: <span v-if="obj.totalHour!=null">{{obj.totalHour}} Stunden</span>
                        <span v-else>Keine</span></van-col>
                </van-row>
            </div>
            <div Klasse="SchrittDiv">
                <van-steps direction="vertikal" :aktiv="-1">
                    <van-Schritt>
                        <div>
                            Anmeldezeit
                            <span v-if="obj.onDutyTime">{{formatMinuten(obj.onDutyTime)}}</span>
                            <span v-else>Keine</span> (Arbeitsstunden: {{formatMinutes(obj.serverStartTime)}})
                        </div>
                        <div Klasse="tagDiv">
                            <van-tag v-if="obj.onDutyTime&&!isLate(obj.onDutyTime,obj.serverStartTime)" rund
                                     Typ="primary">Normal</van-tag>
                            <van-tag v-else round
                                     type="warning">Spät</van-tag>
                        </div>
                    </van-Schritt>
                    <van-Schritt>
                        <div>
                            Abmeldezeit
                            <span v-if="obj.offDutyTime">{{formatMinuten(obj.offDutyTime)}}</span>
                            <span v-else>Keine</span> (Arbeitszeit: {{formatMinutes(obj.serverEndTime)}})
                        </div>
                        <div Klasse="tagDiv">
                            <van-tag v-if="obj.offDutyTime&&isLate(obj.serverEndTime,obj.offDutyTime)" rund
                                     type="warning">Früh losfahren</van-tag>
                            <van-tag v-if="obj.offDutyTime&&!isLate(obj.serverEndTime,obj.offDutyTime)" rund
                                     Typ="primary">Normal</van-tag>
                        </div>
                    </van-Schritt>
                </van-steps>
            </div>

        </div>
        <div v-if="obj!=null&&obj.id>0&&!obj.offDutyTime&&!obj.onDutyTime" Klasse="detailDiv"
             Stil="Textausrichtung: Mitte;Farbe: #bfbfbf">
            <div Klasse="imgDiv">
                <img src="../img/rest.png"/>
            </div>
            <div Stil="margin-top: 2%">
                Kein Stempeldatensatz für diesen Tag</div>
        </div>
    </div>
</Vorlage>

<Skript>
    Standard exportieren {
        Name: "nCalender",
        Daten() {
            zurückkehren {
                loginNannyUser: {},
                loginGzhBenutzer: {},
                Objekt: {},
                obj1: {},
                Liste: [],
                dateTemp: null
            }
        },
        Methoden: {
            isLate(str, str1) {//Größe von zwei Stunden, Minuten und Sekunden beurteilen return new Date((this.formatDates(new Date()) + " " + str).replace(/-/g, '/')) > new Date((this.formatDates(new Date()) + " " + str1).replace(/-/g, '/'));
            },
            clickDay(data) {//Wählen Sie einen Tag aus this.dateTemp = data
                this.axiosPost("/nannyCheckIn/findNowRecord.n", {
                    queryDate: Daten,
                    ID: this.obj1.joinWishId
                }, Funktion (resData) {
                    dieses.obj = resData.obj;
                });
            },
            changeDate(data) {//Klicken Sie links oder rechts, um den Monat zu wechseln console.log(data);
            },
        },
        montiert() {

        },
        erstellt() {
            sei $this = dies;
            this.getLoginAllUser("nanny", {}, Funktion () {
                $this.axiosPost("/joinWishList/findNannyCon.n", {}, Funktion (resData) {
                    $this.list = resData.list;
                    wenn (resData.list != null und resData.list.length != 0) {
                        $this.$set($this.obj1, "joinWishId", resData.list[0].id);
                    }
                    $this.axiosPost("/nannyCheckIn/findNowRecord.n", {id: $this.obj1.joinWishId}, Funktion (resData) {
                        : $this.obj = resData.obj;
                    });
                });
            });
        },
        betrachten:
            "obj1.joinWishId": {
                handler(neuesObjekt, altesObjekt) {
                    wenn (neuesObj != altesObj && neuesObj && neuesObj != null) {
                        this.axiosPost("/nannyCheckIn/findNowRecord.n", {
                            Abfragedatum: this.dateTemp,
                            ID: neuesObjekt
                        }, Funktion (resData) {
                            dieses.obj = resData.obj;
                        });
                    }
                },
                tief: wahr
            },
        }

    }
</Skript>