Go to file
林鑫 6a7019ec1a
Update FUNDING.yml
2024-05-25 10:29:18 +08:00
.github Update FUNDING.yml 2024-05-25 10:29:18 +08:00
public 大版本更新 2024-04-13 10:59:18 +08:00
screenshots 大版本更新 2024-04-13 10:59:18 +08:00
src 修改username 2024-04-18 22:51:36 +08:00
.gitignore 大版本更新 2024-04-13 10:59:18 +08:00
LICENSE 改为typescript;升级elementplus 2022-08-21 16:59:12 +08:00
README.md Update README.md 2024-05-25 10:24:33 +08:00
README_EN.md 改为typescript;升级elementplus 2022-08-21 16:59:12 +08:00
auto-imports.d.ts 改为typescript;升级elementplus 2022-08-21 16:59:12 +08:00
components.d.ts 大版本更新 2024-04-13 10:59:18 +08:00
index.html 大版本更新 2024-04-13 10:59:18 +08:00
package.json 大版本更新 2024-04-13 10:59:18 +08:00
tsconfig.json 大版本更新 2024-04-13 10:59:18 +08:00
tsconfig.node.json 大版本更新 2024-04-13 10:59:18 +08:00
vite.config.ts 大版本更新 2024-04-13 10:59:18 +08:00
yarn.lock 大版本更新 2024-04-13 10:59:18 +08:00

README_EN.md

vue-manage-system

vue element-ui license GitHub release donate

The web management system solution based on Vue3 and ElementPlus。live demo

Please check the version of vue2 in tag V4.2.0

Donation

WeChat

Preface

The scheme as a set of multi-function background frame templates, suitable for most of the WEB management system development. Convenient development fast simple good components based on Vue3 and ElementPlus. Color separation of color style, support manual switch themes, and it is convenient to use a custom theme color.

Function

  • Element-UI
  • Login/Logout
  • Dashboard
  • Table
  • Tabs
  • From
  • Chart 📊
  • Editor
  • Markdown
  • Upload pictures by clipping or dragging
  • Permission
  • Three level menu
  • Custom icon

Installation steps

git clone https://github.com/lin-xin/vue-manage-system.git		// Clone templates
cd vue-manage-system											// Enter template directory
npm install													// Installation dependency

Local development

npm run dev

Constructing production

// Constructing project
npm run build

Component description and presentation

vue-schart

Vue.js wrapper for sChart.js. Github : vue-schart

<template>
    <div>
        <schart class="wrapper" canvasId="myCanvas" :options="options"></schart>
    </div>
</template>
<script setup>
import { ref } from 'vue';
import Schart from "vue-schart"; // 导入Schart组件
const options = ref({
    type: "bar",
    title: {
        text: "最近一周各品类销售图",
    },
    labels: ["周一", "周二", "周三", "周四", "周五"],
    datasets: [
        {
            label: "家电",
            data: [234, 278, 270, 190, 230],
        },
        {
            label: "百货",
            data: [164, 178, 190, 135, 160],
        },
        {
            label: "食品",
            data: [144, 198, 150, 235, 120],
        },
    ],
})
</script>
<style>
    .wrapper {
        width: 7rem;
        height: 5rem;
    }
</style>

Screenshot

Default theme

Image text

Login

Image text

License

MIT