代码拉取完成,页面将自动刷新
🔥🔥Vue3 + TS + Echarts + Pinia 优秀可视化数据大屏解决方案,包括移动端与 PC 端的响应式适配处理
账号:yuan
密码:123456
gitee开源地址
:https://gitee.com/yuanjinwei/DM_screen_web
github开源地址
:https://github.com/williamyuanjw/DM_screen_web
node v16.14.2
登录项目之后,在首页以关注度图表为例
项目中间部分的雷达图和虚拟列表可以进行交互,点击列表的项目可以添加至雷达图,点击雷达图某个项目可以展示详情,点击 remove 可以移除
npm install 或 yarn
npm run dev
代码提交需要符合 Eslint、Commitlint、Stylelint 等规范
使用前请在 vscode 安装 Prettier Eslint Stylelint 等插件,方便格式化代码
参数/事件 | 说明 | 类型 | 默认值 |
---|---|---|---|
dataSource | 传入的数组 | Array | 必传 |
loading | 分页加载loading状态 | Boolean | 必传 |
@scrollEnd | 列表滚动到底部触发的方法 | Function | - |
// 2023.11月更新过
<new-virtual-list
:data-source="github.dataSource"
:loading="github.loading"
@scroll-end="github.addData"
class="virtual-list"
>
<template #item="{ item }">
<a-tooltip placement="top" color="rgba(73, 146, 255, 0.8)">
<template #title>
<span>项目名:{{ item.name }}</span>
</template>
<div class="virtual-list-item" @click="radarFirst.chart.addRadarData(item.name)">
<span class="virtual-list-item-col">{{ item.name }}</span>
<span class="virtual-list-item-col">{{ item.influence }}</span>
<span class="virtual-list-item-col">{{ item.trend }}</span>
<span class="virtual-list-item-col">{{ item.response }}</span>
<span class="virtual-list-item-col">{{ item.activity }}</span>
<span class="virtual-list-item-col">{{ item.github }}</span>
</div>
</a-tooltip>
</template>
</new-virtual-list>
fork仓库
在新分支上开发
之后在 gitee 或者 github 上发起代码合并请求,请求将代码合并至 master
有问题与想法欢迎大家提Issues
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。