框架PasteForm實際開發案例,換個口味顯示數據,支持echarts,只需要標記幾個特性即可在管理端顯示(2)

PasteForm框架的主要思想就是對Dto進行標記特性,然后管理端的頁面就會以不一樣的UI呈現
使用PasteForm框架開發,讓你免去開發管理端的煩惱,你只需要專注于業務端和用戶端!

在管理端中,如果說表格是基本的顯示方式,那么圖表chart就是一個錦上添花的體現!
如果一個項目擁有100個數據庫表,那么大概有多少表需要以圖表顯示,或者說有多少需要支持圖表和表格顯示?
10個? 那你開發這些要花費多少時間呢?
使用PasteForm開發,你只需要幾行代碼即可實現一個圖表的顯示!
一起來看看是如何實現的
那么如果使用PasteForm框架開發的項目的管理端如何實現echarts的顯示呢?

圖表效果

在這里插入圖片描述
上面是模擬表的顯示效果,可以看到目前的測試字段是成績一 成績二 身高和X軸的時間!
可以說是非常普遍的需求,對吧!
顯示方式的話支持line和bar

我們一起來看看要實現上面的東西的Dto是怎樣的

Dto寫法

在這里插入圖片描述
看上圖,是不是很簡單,只做了7個標記!

特性介紹

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/76709.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/76709.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/76709.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

【工具】在 Visual Studio 中使用 Dotfuscator 對“C# 類庫(DLL)或應用程序(EXE)”進行混淆

在 Visual Studio 中使用 Dotfuscator 進行混淆 Dotfuscator 是 Visual Studio 自帶的混淆工具(Dotfuscator Community Edition,簡稱 CE)。它可以混淆 C# 類庫(DLL)或應用程序(EXE)&#xff0c…

線程同步與互斥(上)

上一篇:線程概念與控制https://blog.csdn.net/Small_entreprene/article/details/146704881?sharetypeblogdetail&sharerId146704881&sharereferPC&sharesourceSmall_entreprene&sharefrommp_from_link我們學習了線程的控制及其相關概念之后&#…

[Linux系統編程]進程信號

進程信號 1. 信號入門1.1 信號基本概念1.2 技術應用角度的信號2. 信號的產生2.1 通過終端按鍵(如鍵盤)產生信號2.2 通過異常產生信號2.3 調用系統函數向進程發信號2.4 由軟件條件產生信號2.5 總結3. 阻塞信號3.1 信號其他相關常見概念3.2 內核中的信號表示3.3 sigset_t3.3.1 …

要素的選擇與轉出

1.要素選擇的三種方式 當要在已有的數據中選擇部分要素時,ArcMap提供了三種方式:按屬性選擇、位置選擇及按圖形選擇。 1)按屬性選擇 通過設置 SQL查詢表達式,用來選擇與選擇條件匹配的要素。 (1)單擊主菜單下【選擇】【按屬性選擇】,打開【按…

Springboot + Vue + WebSocket + Notification實現消息推送功能

實現功能 基于Springboot與Vue架構,首先使用Websocket實現頻道訂閱,在實現點對點與群發功能后,在前端調用windows自帶的消息通知,實現推送功能。 開發環境 Springboot 2.6.7vue 2.6.11socket-client 1.0.0 準備工作 在 Vue.js…

云手機如何防止設備指紋被篡改

云手機如何防止設備指紋被篡改 云手機作為虛擬化設備,其設備指紋的防篡改能力直接關系到賬戶安全、反欺詐和隱私保護。以下以亞矩陣云手機為例,講解云手機防止設備指紋被篡改的核心技術及實現方式: 系統層加固:硬件級安全防護 1…

有人DTU使用MQTT協議控制Modbus協議的下位機-含數據庫

本文為備忘錄,不做太多解釋。 DTU型號:G780 服務器:win2018 一。DTU設置 正確設置波特率,進入配置狀態,獲取當前參數,修改參數,設置并保存所有參數。 1.通道1設置 2.Modbus輪詢設置 二&am…

湖北師范大學計信學院研究生課程《工程倫理》9.6章節練習

以下是圖片中識別出的文字內容: 1【單選題】當工程師發現所在的企業或公司進行的工程活動會對環境、社會和公眾的人身安全產生危害時,應該及時地給予反映或揭發。這屬于工程師的( ) A、職業倫理責任 B、社會倫理責任 C、個人倫理責任 D、法律責任 2【單選題】下列哪個不屬于工…

Axure RP 9 詳細圖文安裝流程(附安裝包)教程包含下載、安裝、漢化、授權

文章目錄 前言一、Axure RP 9介紹二、Axure RP 9 安裝流程1. Axure RP 9 下載2. 啟動安裝程序3. 安裝向導操作4.完成安裝 三、Axure RP 9 漢化四、Axure RP 9授權 前言 本基礎安裝流程教程,將以清晰、詳盡且易于遵循的步驟介紹Axure RP 9 詳細圖文安裝流程&#xf…

SpringBoot全局exception處理最佳實踐

目錄 自定義異常類 拋出異常 全局異常處理器 自定義異常類 通常會繼承 Exception 或其子類(如 RuntimeException)來定義業務異常類,用于封裝業務相關的錯誤信息。一般選擇繼承 RuntimeException,因為它是一個非受檢異常,在方法中拋出時不需要顯式聲明。 // 自定義業…

node ---- 解決錯誤【Error: error:0308010C:digital envelope routines::unsupported】

1. 報錯 在 Node.js 18.18.0 的版本中,遇到以下錯誤: this[kHandle] new _Hash(algorithm, xofLen);^ Error: error:0308010C:digital envelope routines::unsupported這個錯誤通常發生在運行項目或構建時,尤其是在使用 Webpack、Vite 或其他…

浙江大學鄭小林教授解讀智能金融與AI的未來|附PPT下載方法

導 讀INTRODUCTION 隨著人工智能技術的飛速發展,智能金融已成為金融行業的重要變革力量。浙江大學人工智能研究所的鄭小林教授在2025年3月24日的《智能金融:AI驅動的金融變革》講座中,深入探討了新一代人工智能在金融領域的應用及未來展望。 …

如何實現瀏覽器中的報表打印

在瀏覽器中實現打印一個報表,可以通過以下幾種方法來完成。這里介紹一個基本的流程和相關代碼示例: 1. 使用 JavaScript 的 window.print() 方法 這是最簡單的方法,它會打開打印對話框,讓用戶選擇打印選項。 示例代碼&#xff1…

Linux系統調用編程

進程和線程 進程是操作系統資源分配的基本單位,擁有獨立的地址空間、內存、文件描述符等資源,進程間相互隔離。每個進程由程序代碼、數據段和進程控制塊(PCB)組成,PCB記錄了進程狀態、資源分配等信息。 線程是…

【力扣hot100題】(054)全排列

挺經典的回溯題的。 class Solution { public:vector<vector<int>> result;void recursion(vector<int>& nums,vector<int>& now){if(nums.size()0){result.push_back(now);return ;}for(int i0;i<nums.size();i){now.push_back(nums[i]);…

【Ragflow】11. 文件解析流程分析/批量解析實現

概述 本文繼續對ragflow文檔解析部分進行分析&#xff0c;并通過腳本的方式實現對文件的批量上傳解析。 文件解析流程 文件解析的請求處理流程大致如下&#xff1a; 1.前端上傳文件&#xff0c;通過v1/document/run接口&#xff0c;發起文件解析請求 2.后端api\apps\docum…

2024年零知識證明(ZK)研究進展

Sumcheck 整個領域正在轉向更多地依賴于 Sumcheck Protocol Sumcheck是用于驗證多項式承諾的協議,常用于零知識證明(ZKP)中,尤其是在可驗證計算和擴展性上。它的主要目的是通過對多項式進行分段檢查,從而保證某個多項式在給定輸入上的正確性,而不需要直接計算出整個多項…

thinkphp每條一級欄目中可自定義添加多條二級欄目,每條二級欄目包含多個字段信息

小程序客戶端需要展示團購詳情這種結構的內容,后臺會新增多條套餐,每條套餐可以新增多條菜品信息,每條菜品信息包含菜品名稱,價格,份數等字段信息,類似于購物網的商品多規格屬性,數據表中以json類型存儲,手寫了一個后臺添加和編輯的demo 添加頁面 編輯頁面(json數據…

Vue3引入ElementPlus

1.ElementPlus屬于第三方的應用框架&#xff0c;官網地址&#xff1a;設計 | Element Plus &#xff0c;學習可以參考該網站的指南。 2.安裝element-plus &#xff0c;指令為&#xff1a;npm install element-plus --save 3.引入elementplus的全局&#xff0c;組件、樣式、圖標…

react+antd封裝一個可回車自定義option的select并且與某些內容相互禁用

需求背景 一個select框 現在要求可多選 并且原有一個any的選項 其他選項為輸入后回車自己增加 若選擇了any 則其他選項不可選擇反之選擇其他選項any不可選擇 并且回車新增時也不可直接加入到選中數組只加入到option內 并且不可重復添加新內容 實現過程 <Form.Item …