https://github.com/zeelyn/vue-ui

https://github.com/zeelyn/vue-ui

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/zeelyn/vue-ui
• Owner: ZeeLyn
• License: mit
• Created: 2020-12-15T08:51:29.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2023-10-30T09:22:22.000Z (over 1 year ago)
• Last Synced: 2024-04-24T03:23:55.169Z (about 1 year ago)
• Language: Vue
• Size: 436 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-ui

## Project setup

```ps1

npm install @zeelyn/vue-ui

```

## Usage

Modify main.js

```javascript

import VueUI from "@zeelyn/vue-ui";

import "@zeelyn/vue-ui/dist/index.css";

const app = createApp(App);

app.use(VueUI,{

    theme:"dark",//or light

    minWidth:100,

    maxWidth:300

});

```

```javascript

this.$loading.show();

this.$loading.hide();

this.$alert({

            title: "this is title",

            message: "this is content",

            showCancel: true,

            confirmText: "OK",

            cancelText: "Cancel",

            confirmColor: "#fff",

            cancelColor: "#ff0000",

            onConfirm: () => {

                console.warn("click ok");

            },

            onCancel: () => {

                console.warn("click cancel");

            },

        })

            .then(() => {

                console.log("confirm");

            })

            .catch(() => {

                console.log("cancel");

            });

this.$alert("This is message");

this.$toast.show({

                    message: "This is toast content!",

                    icon: "success",

                })

                .then(() => {

                    console.log("toast closed");

                });

this.$toast.success("This is message!");

this.$toast.error("This is message!");

this.$toast.warning("This is message!");

this.$toast.info("This is message!");

```