Code Monkey home page Code Monkey logo

cool-team-official / cool-admin-vue Goto Github PK

View Code? Open in Web Editor NEW
1.4K 1.4K 414.0 14.76 MB

🔥 cool-admin一个很酷的后台权限管理框架,模块化、插件化、CRUD极速开发,永久开源免费,基于midway.js 3.0、typeorm、mysql、jwt、element-ui、vuex、vue-router、vue等构建

Home Page: https://cool-js.com

License: MIT License

JavaScript 0.07% Vue 10.88% SCSS 0.44% HTML 81.68% Dockerfile 0.01% TypeScript 6.91%
crud element-ui vite vue vue-router vue3-typescript vuex

cool-admin-vue's Introduction

cool-admin [vue3 - ts - vite]

cool-admin Logo

cool-admin 一个很酷的后台权限管理系统,开源免费,模块化、插件化、极速开发 CRUD,方便快速构建迭代后台管理系统, 到文档 进一步了解

GitHub license GitHub tag GitHub tag

地址

演示

https://show.cool-admin.com

账户:admin,密码:123456

Admin Home

项目后端

https://github.com/cool-team-official/cool-admin-midway

微信群

Admin Wechat

安装项目依赖

推荐使用 yarn

yarn

运行应用程序

安装过程完成后,运行以下命令启动服务。您可以在浏览器中预览网站 http://localhost:9000

yarn dev

低价服务器

阿里云、腾讯云、华为云低价云服务器,不限新老

cool-admin-vue's People

Contributors

cool-team-official avatar gcslaoli avatar icssoa avatar jqmin19 avatar kaneone avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

cool-admin-vue's Issues

使用el-date-picker会报警告

vue3-ts-vite分支

src\cool\modules\task\views\task.vue文件下开始时间和结束时间使用的el-date-picker会报警告

[Vue warn]: Extraneous non-props attributes (props, scope) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.

使用npm run build打包后前端页面打开提示这个错

vendors-app.70e7b8b7.js:formatted:11779 Uncaught TypeError: (void 0) is not a function
at Object.5c7f (vendors-app.70e7b8b7.js:formatted:11779)
at r (app.217f8218.js:1)
at Module.56d7 (app.217f8218.js:1)
at r (app.217f8218.js:1)
at Object.0 (app.217f8218.js:1)
at r (app.217f8218.js:1)
at o (app.217f8218.js:1)
at app.217f8218.js:1
at app.217f8218.js:1

截取报错的代码是这个样子的
r && r.config.ignoredElements.push("x-vue-echarts");
var T = (void 0)({
name: "echarts",
props: O(O({
option: Object,
theme: {
type: [Object, String]
},
initOptions: Object,
updateOptions: Object,
group: String,
manualUpdate: Boolean
}, S), k),

使用的是git最新版本,请帮忙看下

cl-admin-crud-vue3 的 cl-query 以及 cl-upsert 组件中传递的属性不能跟随值的更新改变,只会显示初始化时候的值

cl-query 组件的 list 属性,如果想传递异步获取的值,需要加 v-if(如下代码)

<cl-query
  v-if="dict.type.length"
  field="type"
  :list="dict.type"
/>

cl-upsert 组件的 items.component.options 属性,如果想传递异步获取的值,需要 toRef(如下代码)

const dict = reactive({
  type: [],
});

setTimeout(() => {
  dict.type = [{ value: 1, label: '正常' }];
}, 100);

const upsert = reactive({
  items: [{
    prop: 'type',
    component: {
      options: toRef(dict, 'type'),
    },
  }],
});

还有就是 cl-admin-crud-vue3 中好像没有 cl-filter-group 组件

模块名不能命名为device

image

才菜单里点击访问没事,手动刷新浏览器之后会报错

看起来像是匹配dev,然后把dev替换了,所以只剩ice。

动态路由和js打包分离问题?

是否cool-admin-vue不支持动态路由按需加载,我看请求页面的时候需要等所有的包文件都加载,这样不科学吧?访问特定路由时按需加载这个部分的包文件是否更好?

cl-editor-quill无法处理图片

quill富文本编辑器做为新闻类内容管理的话,无法调整图片大小,有些不方便
查看官方文档好像需要安装quill-image-resize-module模块,
如何和cl-editor-quill结合使其可以调整图片呢

以[渲染组件方式]编写表单组件,监听事件不触发

文档中的例子:
{ label: '店铺类型', ... component: { ... // 监听事件 on: { change: (val) => { // 注意使用箭头函数 console.log(val) } } ... } }
change事件无法触发
修改为
{ label: "店铺类型", ... component: { name: "el-input", onchange: (val) => { console.log(val) } }, },
有效

How to change CRUD label ?

Hi folks,
Is there any chance to change CRUD label?
for example I wanna change from Chinese to Japanese character like,

add:  from "新增" to "新規"
delete:  from "删除" to "削除"
update:  from "编辑", to "編集"
refresh: from "刷新" to "更新"

thanks!

cli不支持node v16

npm install cl-admin-cli -g

npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE package: '[email protected]',
npm WARN EBADENGINE required: { node: '>=0.8 <=15' },
npm WARN EBADENGINE current: { node: 'v16.0.0', npm: '7.10.0' }
npm WARN EBADENGINE }

Form 自定义表单如何优化

需求是
1.弹出一个表单的时候自动在某个item上获取焦点,
2.按回车的时候自动触发点击确定按钮

查看items的组件属性有ref,设置了。但是取不到。
// 其它特殊顶层 property
key: 'myKey',
ref: 'myRef',
// 如果你在渲染函数中给多个元素都应用了相同的 ref 名,
// 那么 $refs.myRef 会变成一个数组。
refInFor: true

请问 cl-admin-crud-vue3 的源码在哪里呢?cl-filter-group 遇到问题想看一下

使用中遇到了问题,按照文档中 demo 写的,不会触发搜索,也不会添加搜索条件,所以想自己看看源码,但是 vue3 的源码找不到,只有编译后的

<cl-filter-group v-model="form">
  <cl-filter label="状态">
    <el-select size="mini" v-model="form.status">
      <el-option value="" label="全部" />
      <el-option :value="0" label="禁用" />
      <el-option :value="1" label="启用" />
    </el-select>
  </cl-filter>
</cl-filter-group>

vue3-ts-vite分支打包失败

node版本12,vue3-ts-vite分支 yarn build 失败,报错很多 Found 182 errors,请问是还没开发完善好吗

docker build failed

tip code
master branch

dependency conflict

err log:
npm notice
npm notice New minor version of npm available! 8.3.1 -> 8.5.5
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.5.5
npm notice Run npm install -g [email protected] to update!
npm notice
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/vue
npm ERR! vue@"^3.2.20" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@">= 2.5 < 3" from @vue/[email protected]
npm ERR! node_modules/@vue/composition-api
npm ERR! dev @vue/composition-api@"^1.0.0-rc.13" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-03-18T09_24_56_933Z-debug-0.log

upload error Invalid filename: test.txt

如何上传图片之外的类型,官网预览地址和自己下载的都报粗了。如上传txt文件。

<div class="demo-upload__item">
	<p>文件上传 text</p>
	<cl-upload v-model="urls" multiple :limit="5" accept="*" list-type="text" />
</div>

选中上传提示: upload error Invalid filename: test.txt

创建新模块sean报错

5.x版本中尝试执行命令(cl create sean)去创建模块报错,4.0版本是没有问题的。

错误提示:

  • node:internal/fs/utils:344
    throw err;
    ^

Error: ENOENT: no such file or directory, mkdir 'C:\Users\sean5\Desktop\cool-admin-vue-5.x\src\cool\modules\sean'
at Object.mkdirSync (node:fs:1334:3)
at next (C:\Users\sean5\AppData\Roaming\npm\node_modules\cl-admin-cli\bin\cl-create.js:103:6)
at C:\Users\sean5\AppData\Roaming\npm\node_modules\cl-admin-cli\bin\cl-create.js:156:6
at FSReqCallback.oncomplete (node:fs:199:5) {
errno: -4058,
syscall: 'mkdir',
code: 'ENOENT',
path: 'C:\Users\sean5\Desktop\cool-admin-vue-5.x\src\cool\modules\sean'

个人中心处更改头像无效

个人中心处更改头像无效,无报错
image

服务器端采用qiniu上传
image
上传至qiniu成功

image
但是观测headImg为"",同时并未提交到服务器。

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.