如何用vue+免费的webdb 实现一个世界杯足球竞猜系统

1

2

3

4

5

6

7

8

9

10

11

12

13

import { createApp } from "vue";

import App from "./App.vue";

import installElementPlus from "@/libs/element";

import { createPinia } from "pinia";

/* eslint-disable */

kintone.events.on("portal.show", (event) => {

    const myContainer = kintone.portal.getContentSpaceElement();

    const app = createApp(App);

    installElementPlus(app);

    app.use(createPinia());

    app.mount(myContainer);

    return event;

});

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

import { KintoneRestAPIClient } from "@kintone/rest-api-client";

const client = new KintoneRestAPIClient();

//获取比赛列表

export const GetMatchList = async () => {

    const app = appList.matchInfo;

    import {appList,matchInfoField,usersField,userChipInField,picField} from "@/config";

    try {

        const params = {

            app,

        };

        const resp = await client.record.getRecords(params);

        if (resp.records.length > 0) {

        return resp.records.map((record) => {

            return dataConvert(record);

        });

        } else {

            return null;

        }

    } catch (err) {

        console.log(err);

    }

};

1

2

const { language } = kintone.getLoginUser();

//   'language': 'zh'

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

import {

  GetLeftScore,

  GetChipInList,

  GetMatchList,

} from "@/services/kintoneApi";

import { defineStore } from "pinia";

export const useStore = defineStore("store", {

  state: () => {

    return {

      myScore: 0,

      chipInList: [],

    };

  },

  getters: {

    chipListShow(state) {

      return state.chipInList.map((record) => {

        if (record.Score_result == 0) {

          record.scoreWin = "--";

          record.teamInfo.Score = "--";

          record.type = "chip in";

        } else if (record.Score_result < 0) {

          record.scoreWin = `--`;

          record.type = "loss";

        } else {

          record.scoreWin = `+ ${record.Score_result}`;

          record.type = "win";

        }

        return record;

      });

    },

  },

  actions: {

    async init() {

      const initLeftScorePromise = this.getLeftScore();

      const initChipInListPromise = this.getChipInList();

      return Promise.all([initLeftScorePromise, initChipInListPromise]);

    },

    async getLeftScore() {

      this.myScore = await GetLeftScore();

    },

    async getChipInList() {

      const chipInList = await GetChipInList();

      const matches = await GetMatchList();

      const matchMapping = {};

      for (const item of matches) {

        matchMapping[item.Match_id] = {

          FlagA: item.FlagA,

          FlagB: item.FlagB,

          TeamA_name: item.TeamA_name,

          TeamB_name: item.TeamB_name,

          Score: `${item.ScoreA}:${item.ScoreB}`,

        };

      }

      chipInList.map((chip) => {

        chip.teamInfo = matchMapping[chip.Match_id];

        return chip;

      });

      this.chipInList = chipInList;

    },

  },

});