大屏页面初始化

screen-vue/src/api/bizNote.js

@@ -0,0 +1,36 @@
+import request from '@/utils/request'
+
+/**
+ * 获取指标信息列表
+ */
+export function getNotesList(params) {
+  return request({
+    url: '/biz/notes/list',
+    method: 'get', 
+    params: params
+  })
+}
+
+
+/**
+ * 保存/修改
+ */
+export function getNotesSave(data) {
+  return request({
+    url: '/biz/notes/save',
+    method: 'post', 
+    data
+  })
+}
+
+
+/**
+ * 删除
+ */
+export function getNotesDelete(params) {
+  return request({
+    url: '/biz/notes/delete',
+    method: 'post', 
+    params: params
+  })
+}

screen-vue/src/router/index.js

@@ -103,11 +103,6 @@ const routes = [
         component: BigScreenWork
       },
       ...generateBigScreenRoutes(),
-      {
-        path: '/:pathMatch(.*)*',
-        name: 'BigScreen404',
-        component: Page404
-      }
     ]
   },
   {

screen-vue/src/views/desktop/components/ChartNote.vue

@@ -29,12 +29,11 @@ import * as echarts from 'echarts'
 import { getItemInfoList } from '@/api/bizApi'
 
 const tabDict = [
-  { key: 'NOTE_YEAR_Y001', label: '类型' },  // 默认选项
+  { key: 'NOTE_YEAR_Y001', label: '类型' },
   { key: 'NOTE_YEAR_Y002', label: '月份' },
 ]
 
-// 响应式数据
+const activeTabKey = ref(tabDict[0].key)
-const activeTabKey = ref(tabDict[0].key)  // 默认选中第一个
 const indexCode = ref(activeTabKey.value)
 const tableData = ref([])
 const chartRef = ref(null)
@@ -49,7 +48,6 @@ let seriesStatus = {
 
 const currentYear = new Date().getFullYear().toString();
 
-// 获取数据方法
 async function getDataList() {
   try {
     const reqParams = {
@@ -73,7 +71,6 @@ function switchTab(tabKey) {
   getDataList()
 }
 
-// 计算总数
 function calculateTotal() {
   const xAxisData = tableData.value.map(item => item.xaxis || '')
   const index01Data = tableData.value.map(item => Math.round(Number(item.index01) || 0))
@@ -89,7 +86,6 @@ function calculateTotal() {
   })
 }
 
-// 渲染图表
 function renderChart() {
   if (!chartRef.value || tableData.value.length === 0) return
 
@@ -106,6 +102,11 @@ function renderChart() {
   const totalData = calculateTotal()
 
   const option = {
+    animationDuration: 1000,
+    animationEasing: 'cubicOut',
+    animationDelay: function(idx) {
+      return idx * 50;
+    },
     legend: {
       show: true,
       orient: 'horizontal',
@@ -208,6 +209,9 @@ function renderChart() {
           fontSize: 10,
           color: '#fff',
           fontWeight: 'bold'
+        },
+        animationDelay: function(idx) {
+          return idx * 30;
         }
       },
       {
@@ -224,6 +228,9 @@ function renderChart() {
           fontSize: 10,
           color: '#fff',
           fontWeight: 'bold'
+        },
+        animationDelay: function(idx) {
+          return idx * 30 + 100;
         }
       },
       {
@@ -240,6 +247,9 @@ function renderChart() {
           fontSize: 10,
           color: '#fff',
           fontWeight: 'bold'
+        },
+        animationDelay: function(idx) {
+          return idx * 30 + 200;
         }
       },
       {
@@ -258,6 +268,9 @@ function renderChart() {
           fontSize: 11,
           color: '#303133',
           fontWeight: 'bold'
+        },
+        animationDelay: function(idx) {
+          return idx * 30 + 300;
         }
       }
     ]

screen-vue/src/views/myapp/note/form.vue

@@ -0,0 +1,260 @@
+<template>
+  <el-form 
+    :model="formData" 
+    :rules="formRules" 
+    ref="formRef"
+    label-width="100px"
+    class="dialog-form-container"
+  >
+    <div class="form-row">
+      <div class="form-col">
+        <el-form-item label="便签主题" prop="title">
+          <el-input 
+            v-model="formData.title" 
+            placeholder="请输入便签主题"
+            clearable
+            maxlength="50"
+            show-word-limit
+          />
+        </el-form-item>
+      </div>
+    </div>
+
+    <div class="form-row">
+      <div class="form-col">
+        <el-form-item label="便签内容" prop="content">
+          <el-input 
+            v-model="formData.content" 
+            placeholder="请输入便签内容"
+            clearable
+            type="textarea"
+            :rows="4"
+            maxlength="500"
+            show-word-limit
+          />
+        </el-form-item>
+      </div>
+    </div>
+	
+	<div class="form-row">
+		<div class="form-col">
+		  <el-form-item label="截止时间" prop="deadline">
+		    <el-date-picker
+		      v-model="formData.deadline"
+		      type="datetime"
+		      placeholder="请选择截止时间"
+		      clearable
+		      format="YYYY-MM-DD HH:mm:ss"
+		      value-format="YYYY-MM-DD HH:mm:ss"
+		      style="width: 100%;"
+		    />
+		  </el-form-item>
+		</div>
+	  <div class="form-col">
+	    <el-form-item label="便签分类" prop="type">
+	      <el-select 
+	        v-model="formData.type" 
+	        placeholder="请选择便签分类"
+	        clearable
+	      >
+	        <el-option label="工作" value="work" />
+	        <el-option label="生活" value="life" />
+	        <el-option label="学习" value="study" />
+	        <el-option label="其他" value="other" />
+	      </el-select>
+	    </el-form-item>
+	  </div>
+	</div>
+
+    <div class="form-row">
+      <div class="form-col">
+        <el-form-item label="开始时间" prop="startTime">
+          <el-date-picker
+            v-model="formData.startTime"
+            type="datetime"
+            placeholder="请选择开始时间"
+            clearable
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            style="width: 100%;"
+          />
+        </el-form-item>
+      </div>
+      <div class="form-col">
+        <el-form-item label="结束时间" prop="endTime">
+          <el-date-picker
+            v-model="formData.endTime"
+            type="datetime"
+            placeholder="请选择结束时间"
+            clearable
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            style="width: 100%;"
+          />
+        </el-form-item>
+      </div>
+    </div>
+
+    <div class="form-row">
+      <div class="form-col">
+        <el-form-item label="便签级别" prop="priority">
+          <el-select 
+            v-model="formData.priority" 
+            placeholder="请选择便签级别"
+            clearable
+          >
+            <el-option label="低" value="low" />
+            <el-option label="中" value="medium" />
+            <el-option label="高" value="high" />
+          </el-select>
+        </el-form-item>
+      </div>
+      <div class="form-col">
+        <el-form-item label="便签状态" prop="ustatus">
+          <el-select 
+            v-model="formData.ustatus" 
+            placeholder="请选择便签状态"
+            clearable
+          >
+            <el-option label="待开始" value="todo" />
+            <el-option label="进行中" value="doing" />
+            <el-option label="已完成" value="done" />
+          </el-select>
+        </el-form-item>
+      </div>
+    </div>
+  </el-form>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+
+const props = defineProps({
+  formData: {
+    type: Object,
+    required: true,
+    default: () => ({
+      title: '',
+      content: '',
+      deadline: '',
+      startTime: '',
+      endTime: '',
+      priority: '',
+      ustatus: '',
+      type: ''
+    })
+  },
+  isEdit: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const formRef = ref(null)
+
+const formRules = {
+  title: [ 
+    { required: true, message: '请输入便签主题', trigger: 'blur' },
+    { min: 2, max: 50, message: '便签主题长度在 2 到 50 个字符', trigger: 'blur' }
+  ],
+  content: [ 
+    { required: true, message: '请输入便签内容', trigger: 'blur' },
+    { min: 2, max: 500, message: '便签内容长度在 2 到 500 个字符', trigger: 'blur' }
+  ],
+  deadline: [ 
+    { required: true, message: '请选择截止时间', trigger: 'change' }
+  ],
+  type: [
+    { required: true, message: '请选择便签分类', trigger: 'change' }
+  ],
+  priority: [ 
+    { required: true, message: '请选择便签级别', trigger: 'change' }
+  ],
+  ustatus: [ 
+    { required: true, message: '请选择便签状态', trigger: 'change' }
+  ],
+}
+
+const validate = async () => {
+  if (!formRef.value) return false
+  try {
+    const valid = await formRef.value.validate()
+    return valid
+  } catch (error) {
+    console.error('表单验证失败:', error)
+    return false
+  }
+}
+
+const resetForm = () => {
+  if (formRef.value) {
+    formRef.value.resetFields()
+  }
+}
+
+defineExpose({ 
+  validate, 
+  resetForm 
+})
+
+onMounted(() => {})
+</script>
+
+<style scoped>
+.dialog-form-container {
+  width: 100%;
+  padding: 20px;
+  margin: 0;
+  border: 1px solid #e5e7eb;
+  border-radius: 8px;
+  box-sizing: border-box;
+  background-color: #fff;
+}
+
+.form-row {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+  margin: 0 0 20px 0;
+  gap: 24px;
+}
+
+.form-row:last-child { 
+  margin-bottom: 0; 
+}
+
+.form-col { 
+  flex: 1; 
+  min-width: 200px; 
+}
+
+:deep(.el-input),
+:deep(.el-select),
+:deep(.el-date-picker) {
+  width: 100%;
+}
+
+:deep(.el-textarea) {
+  width: 100%;
+}
+
+:deep(.el-form-item__label) {
+  font-weight: 500;
+  color: #333;
+}
+
+@media (max-width: 768px) {
+  .form-row {
+    flex-direction: column;
+    gap: 16px;
+  }
+  
+  .form-col {
+    min-width: 100%;
+  }
+  
+  .dialog-form-container {
+    padding: 16px;
+  }
+}
+</style>

screen-vue/src/views/myapp/note/list.vue

@@ -0,0 +1,634 @@
+<template>
+  <div class="data-manage-page">
+    <div class="search-section">
+      <CSearch
+        @search="handleSearch"
+        @reset="handleReset"
+      >
+        <el-form-item label="便签主题：" class="search-item">
+          <el-input
+            v-model="searchForm.title"
+            placeholder="请输入便签主题"
+            clearable
+            class="search-input"
+          />
+        </el-form-item>
+        <el-form-item label="便签级别：" class="search-item">
+          <el-select
+            v-model="searchForm.priority"
+            placeholder="请选择便签级别"
+            clearable
+            class="search-select"
+          >
+            <el-option 
+              v-for="(label, value) in priorityDict" 
+              :key="value"
+              :label="label" 
+              :value="value" 
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="便签状态：" class="search-item">
+          <el-select
+            v-model="searchForm.ustatus"
+            placeholder="请选择便签状态"
+            clearable
+            class="search-select"
+          >
+            <el-option 
+              v-for="(label, value) in statusDict" 
+              :key="value"
+              :label="label" 
+              :value="value" 
+            />
+          </el-select>
+        </el-form-item>
+      </CSearch>
+    </div>
+
+    <div class="action-section">
+      <el-button type="primary" icon="Plus" @click="handleAdd">
+        新增
+      </el-button>
+      <div class="tag-switcher">
+        <div
+          v-for="(tag, key) in tagDict"
+          :key="key"
+          class="tag-item"
+          :class="{ 'active': activeTag === key }"
+          @click="handleTagChange(key)"
+        >
+          {{ tag }}
+          <span class="tag-underline" />
+        </div>
+      </div>
+    </div>
+
+    <div class="list-wrapper">
+      <div class="list-section">
+        <div v-if="tableData.length === 0" class="empty-tip">
+          <el-empty description="暂无数据" />
+        </div>
+        <div v-else class="card-list">
+          <el-card
+            v-for="item in tableData"
+            :key="item.id"
+            class="list-card"
+            shadow="hover"
+          >
+            <div class="card-top">
+              <div class="site-main">
+                <el-tooltip :content="item.title" placement="top">
+                  <div class="site-name">{{ item.title }}</div>
+                </el-tooltip>
+                
+                <div class="title-divider"></div>
+                
+                <div class="meta-line">
+                  <span class="deadline-text">
+                    <el-icon size="12"><Clock /></el-icon>
+                    截止：{{ item.deadline || '无' }}
+                  </span>
+                  <div class="meta-tags">
+                    <el-tag 
+                      :type="getPriorityTagType(item.priority)" 
+                      size="small" 
+                      class="priority-tag"
+                    >
+                      {{ priorityDict[item.priority] || '无级别' }}
+                    </el-tag>
+                    <el-tag 
+                      :type="getStatusTagType(item.ustatus)" 
+                      size="small" 
+                      class="status-tag"
+                    >
+                      {{ statusDict[item.ustatus] || '无状态' }}
+                    </el-tag>
+                  </div>
+                </div>
+                
+                <div class="content-divider"></div>
+                
+                <el-tooltip :content="item.content" placement="top">
+                  <div class="site-text">{{ item.content }}</div>
+                </el-tooltip>
+              </div>
+            </div>
+            
+            <div class="card-divider"></div>
+            
+            <div class="card-bottom">
+              <span class="card-date">创建时间：{{ item.createTime }}</span>
+              <div class="card-actions">
+                <el-button size="small" type="primary" @click="handleEdit(item)">
+                  <el-icon><Edit /></el-icon>
+                </el-button>
+                <el-button size="small" type="danger" @click="handleDelete(item)">
+                  <el-icon><Delete /></el-icon>
+                </el-button>
+              </div>
+            </div>
+          </el-card>
+        </div>
+      </div>
+    </div>
+    
+    <div class="pagination-footer">
+      <el-pagination
+        v-model:current-page="pagination.pageNum"
+        v-model:page-size="pagination.pageSize"
+        :page-sizes="[20, 50, 99]"
+        :total="pagination.total"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        background
+      />
+    </div>
+
+    <PDialog
+      v-model="dialogVisible"
+      :loading="saveLoading"
+      :title="isEdit ? '编辑数据' : '新增数据'"
+      @close="handleDialogClose"
+      @reset="handleDialogReset"
+      @confirm="handleSave"
+    >
+      <VForm ref="formComponentRef" :form-data="formData" :is-edit="isEdit" />
+    </PDialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { Plus, Edit, Delete, Clock } from '@element-plus/icons-vue'
+import { getNotesList, getNotesSave, getNotesDelete } from '@/api/bizNote'
+
+import CSearch from '@/components/Search/proSearch.vue'
+import PDialog from '@/components/Dialog/proDialog.vue'
+import VForm from './form.vue'
+
+const formComponentRef = ref(null)
+const saveLoading = ref(false)
+const loading = ref(false)
+
+const searchForm = reactive({
+  title: '',
+  priority: '',
+  ustatus: ''
+})
+
+const pagination = reactive({
+  pageNum: 1,
+  pageSize: 20,
+  total: 0
+})
+
+const tableData = ref([])
+
+const isEdit = ref(false)
+const formData = ref({})
+const currentRow = ref({})
+const dialogVisible = ref(false)
+
+const priorityDict = {
+  low: '低',
+  medium: '中',
+  high: '高'
+}
+
+const statusDict = {
+  todo: '待开始',
+  doing: '进行中',
+  done: '已完成'
+}
+
+const tagDict = reactive({
+  work: '工作',
+  life: '生活',
+  study: '学习',
+  other: '其他'
+})
+const activeTag = ref('work')
+
+const getPriorityTagType = (priority) => {
+  const typeMap = {
+    low: 'success',
+    medium: 'warning',
+    high: 'danger'
+  }
+  return typeMap[priority] || 'info'
+}
+
+const getStatusTagType = (status) => {
+  const typeMap = {
+    todo: 'info',
+    doing: 'primary',
+    done: 'success'
+  }
+  return typeMap[status] || 'info'
+}
+
+const handleTagChange = (tagKey) => {
+  activeTag.value = tagKey
+  pagination.pageNum = 1
+  getDataList()
+}
+
+async function getDataList() {
+  loading.value = true
+  try {
+    const reqParams = {
+      pageNum: pagination.pageNum,
+      pageSize: pagination.pageSize,
+      type: activeTag.value,
+      ...searchForm,
+    }
+    const res = await getNotesList(reqParams);
+    pagination.total = res.total;
+    tableData.value = res.list || [];
+  } catch (error) {
+    console.error('获取数据失败:', error);
+    tableData.value = []
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleSearch = () => {
+  pagination.pageNum = 1
+  getDataList()
+}
+
+const handleReset = () => {
+  Object.assign(searchForm, {
+    title: '',
+    priority: '',
+    ustatus: ''
+  })
+  pagination.pageNum = 1
+  getDataList()
+}
+
+const handleAdd = () => {
+  isEdit.value = false
+  formData.value = {}
+  currentRow.value = {}
+  dialogVisible.value = true
+}
+
+const handleEdit = (row) => {
+  isEdit.value = true
+  formData.value = { ...row }
+  currentRow.value = { ...row }
+  dialogVisible.value = true
+}
+
+const handleDelete = async (row) => {	
+  ElMessageBox.confirm('确定要删除该条便签数据吗?', '删除确认', {
+    type: 'warning',
+    closeOnClickModal: false,
+    showClose: false
+  })
+  .then(async () => {
+    const reqParams = {
+      id: row.id
+    }
+    const res = await getNotesDelete(reqParams);
+    ElMessage.success(res.msg || '删除成功');
+    getDataList();
+  })
+  .catch(() => {
+    ElMessage.info('已取消删除数据操作');
+  });
+}
+
+const handleSizeChange = (val) => {
+  pagination.pageSize = val
+  getDataList()
+}
+
+const handleCurrentChange = (val) => {
+  pagination.pageNum = val
+  getDataList()
+}
+
+const handleDialogClose = () => {
+  formData.value = {}
+  isEdit.value = false
+  currentRow.value = {}
+  dialogVisible.value = false
+}
+
+const handleDialogReset = () => {
+  if (formComponentRef.value) {
+    formComponentRef.value.resetForm()
+    ElMessage.info('表单已重置')
+  }
+}
+
+const handleSave = async () => {
+  if (formComponentRef.value) {
+    const isValid = await formComponentRef.value.validate()
+    if (!isValid) {
+      ElMessage.warning('表单验证失败，请检查必填项')
+      return
+    }
+  }
+  saveLoading.value = true
+  try {
+    const reqParams = {
+      ...formData.value,
+      isEdit: isEdit.value,
+      id: currentRow.value?.id
+    }
+    const res = await getNotesSave(reqParams);
+    saveLoading.value = false
+    dialogVisible.value = false
+    ElMessage.success(res.msg)
+    getDataList()
+  } catch (error) {
+    console.log(error)
+    saveLoading.value = false
+    ElMessage.error('保存失败，请重试')
+  }
+}
+
+onMounted(() => {
+  getDataList()
+})
+</script>
+
+<style scoped>
+.data-manage-page {
+  width: 100%;
+  height: 100%;
+  padding: 16px;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden !important;
+}
+
+.search-section {
+  width: 100%;
+}
+
+.action-section {
+  padding: 0 0 12px 0;
+  margin-bottom: 16px;
+  display: flex;
+  gap: 8px;
+  flex-shrink: 0;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid #e5e7eb;
+}
+
+.tag-switcher {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+}
+
+.tag-item {
+  cursor: pointer;
+  position: relative;
+  font-size: 14px;
+  color: #666;
+  padding: 4px 0;
+  transition: color 0.2s ease;
+}
+
+.tag-item .tag-underline {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background-color: transparent;
+  transition: background-color 0.2s ease, width 0.2s ease;
+  border-radius: 1px;
+}
+
+.tag-item.active {
+  color: #409eff;
+  font-weight: 500;
+}
+
+.tag-item.active .tag-underline {
+  background-color: #409eff;
+  width: 100%;
+}
+
+.tag-item:hover {
+  color: #409eff;
+}
+
+.tag-item:hover .tag-underline {
+  background-color: #a0cfff;
+  width: 100%;
+}
+
+.list-wrapper {
+  flex: 1;
+  width: 100%;
+  overflow: hidden;
+  min-height: 0;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  margin-bottom: 12px; 
+}
+
+.list-section {
+  width: 100%;
+  height: 100%;
+  overflow-y: auto !important;
+  overflow-x: hidden !important;
+  padding: 12px;
+  box-sizing: border-box;
+}
+
+.empty-tip {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.card-list {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: 16px;
+  padding: 8px;
+}
+
+.list-card {
+  transition: all 0.3s ease;
+  cursor: pointer;
+  border-radius: 12px;
+  overflow: hidden;
+  border: 1px solid #f0f0f0 !important;
+}
+
+.list-card:hover {
+  transform: translateY(-4px);
+  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08) !important;
+  border-color: #409eff !important;
+}
+
+.card-top {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  padding: 6px 12px 4px;
+}
+
+.site-main {
+  flex: 1;
+  min-width: 0;
+}
+
+.site-name {
+  font-weight: 600;
+  font-size: 16px;
+  color: #1f2937;
+  margin-bottom: 6px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.title-divider {
+  height: 1px;
+  background: #e5e7eb;
+  margin: 0 0 8px 0;
+}
+
+.meta-line {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 8px;
+  font-size: 12px;
+  color: #666;
+}
+
+.deadline-text {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.meta-tags {
+  display: flex;
+  gap: 4px;
+}
+
+.priority-tag, .status-tag {
+  border-radius: 4px;
+  height: 20px;
+  line-height: 20px;
+}
+
+.content-divider {
+  height: 1px;
+  background: #e5e7eb;
+  margin: 0 0 8px 0;
+}
+
+.site-text {
+  font-size: 14px;
+  color: #666;
+  padding: 8px 12px;
+  background-color: #f9fafb;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  min-height: 60px;
+  line-height: 1.4;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.site-text:hover {
+  color: #409eff;
+  border-color: #409eff;
+  background-color: #f0f7ff;
+  transition: all 0.2s ease;
+}
+
+.card-divider {
+  height: 1px;
+  background: #f0f0f0;
+  margin: 0 12px;
+}
+
+.card-bottom {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 12px 8px;
+}
+
+.card-date {
+  font-size: 12px;
+  color: #9ca3af;
+}
+
+.card-actions {
+  display: flex;
+  gap: 4px;
+}
+
+.pagination-footer {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 8px 0;
+  border: 1px solid #e5e7eb;
+  border-radius: 6px;
+  flex-shrink: 0;
+  background: #fff;
+  z-index: 10;
+}
+
+.list-section::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+.list-section::-webkit-scrollbar-track {
+  background: #f1f5f9;
+  border-radius: 3px;
+}
+
+.list-section::-webkit-scrollbar-thumb {
+  background: #cbd5e1;
+  border-radius: 3px;
+}
+
+.list-section::-webkit-scrollbar-thumb:hover {
+  background: #94a3b8;
+}
+
+@media (max-width: 768px) {
+  .card-list {
+    grid-template-columns: 1fr;
+  }
+  
+  .meta-line {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 4px;
+  }
+  
+  .meta-tags {
+    align-self: flex-start;
+  }
+}
+</style>

src/main/java/com/mini/mybigscreen/Auth/Home/desktopController.java

@@ -39,7 +39,7 @@ public class desktopController {
     public Result<?> getNoteList() {
         LambdaQueryWrapper<Notes> query = new LambdaQueryWrapper<Notes>()
                 .notIn(Notes::getUstatus, "done")
-                .orderByDesc(Notes::getCreateUser);
+                .orderByDesc(Notes::getCreateTime);
         return Result.success(notesService.list(query));
     }
 

src/main/java/com/mini/mybigscreen/biz/controller/NotesController.java

@@ -1,7 +1,18 @@
 package com.mini.mybigscreen.biz.controller;
 
-import org.springframework.web.bind.annotation.RequestMapping;
+import cn.hutool.core.util.StrUtil;
-import org.springframework.web.bind.annotation.RestController;
+import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
+import com.baomidou.mybatisplus.core.conditions.update.LambdaUpdateWrapper;
+import com.mini.mybigscreen.Model.Message;
+import com.mini.mybigscreen.Model.PageResult;
+import com.mini.mybigscreen.Model.Result;
+import com.mini.mybigscreen.biz.domain.Notes;
+import com.mini.mybigscreen.biz.service.NotesService;
+import com.mini.mybigscreen.utils.PageUtil;
+import jakarta.annotation.Resource;
+import org.springframework.web.bind.annotation.*;
+
+import java.util.List;
 
 /**
  * <p>
@@ -15,4 +26,38 @@ import org.springframework.web.bind.annotation.RestController;
 @RequestMapping("/biz/notes")
 public class NotesController {
 
+
+    @Resource
+    private NotesService notesService;
+
+
+    @GetMapping("list")
+    public Result<?> getList(Integer pageNum, Integer pageSize,
+                             String title, String priority, String ustatus, String type) {
+        LambdaQueryWrapper<Notes> query = new LambdaQueryWrapper<Notes>()
+                .like(StrUtil.isNotBlank(title), Notes::getTitle, title)
+                .eq(StrUtil.isNotBlank(priority), Notes::getPriority, priority)
+                .eq(StrUtil.isNotBlank(ustatus), Notes::getUstatus, ustatus)
+                .eq(StrUtil.isNotBlank(type), Notes::getType, type)
+                .orderByDesc(Notes::getCreateTime);
+        List<Notes> list = notesService.list(query);
+        PageUtil<?> util = new PageUtil<>(pageNum, pageSize, list);
+        PageResult<?> result = new PageResult<>(util.OkData(), pageNum, pageSize, list.size());
+        return Result.success(result);
+    }
+
+    @PostMapping("save")
+    public Result<Message> save(@RequestBody Notes notes) {
+        boolean success = notes.getIsEdit()
+                ? notesService.update(notes,
+                new LambdaUpdateWrapper<Notes>().eq(Notes::getId, notes.getId())
+        ) : notesService.save(notes);
+        return Result.success(new Message(notes.getIsEdit() ? "数据修改成功" : "数据新增成功", 200));
+    }
+
+    @PostMapping("delete")
+    public Result<Message> delete(String id) {
+        notesService.removeById(id);
+        return Result.success(new Message("数据删除成功", 200));
+    }
 }

src/main/java/com/mini/mybigscreen/biz/domain/HomeModule.java

@@ -4,6 +4,8 @@ import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+
+import java.io.Serial;
 import java.io.Serializable;
 import java.time.LocalDateTime;
 import lombok.Getter;
@@ -22,6 +24,7 @@ import lombok.Setter;
 @TableName("biz_home_module")
 public class HomeModule implements Serializable {
 
+    @Serial
     private static final long serialVersionUID = 1L;
 
     @TableField("create_time")

src/main/java/com/mini/mybigscreen/biz/domain/HomeUser.java

@@ -4,6 +4,8 @@ import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+
+import java.io.Serial;
 import java.io.Serializable;
 import java.time.LocalDateTime;
 
@@ -24,6 +26,7 @@ import lombok.Setter;
 @TableName("biz_home_user")
 public class HomeUser extends BaseEntity implements Serializable {
 
+    @Serial
     private static final long serialVersionUID = 1L;
 
     /**

src/main/java/com/mini/mybigscreen/biz/domain/Notes.java

@@ -4,8 +4,12 @@ import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+
+import java.io.Serial;
 import java.io.Serializable;
 import java.time.LocalDateTime;
+
+import com.mini.mybigscreen.Model.BaseEntity;
 import lombok.Getter;
 import lombok.Setter;
 
@@ -20,8 +24,9 @@ import lombok.Setter;
 @Getter
 @Setter
 @TableName("biz_notes")
-public class Notes implements Serializable {
+public class Notes extends BaseEntity implements Serializable {
 
+    @Serial
     private static final long serialVersionUID = 1L;
 
     /**

src/main/java/com/mini/mybigscreen/biz/domain/QuickLogin.java

@@ -4,8 +4,12 @@ import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+
+import java.io.Serial;
 import java.io.Serializable;
 import java.time.LocalDateTime;
+
+import com.mini.mybigscreen.Model.BaseEntity;
 import lombok.Getter;
 import lombok.Setter;
 
@@ -20,8 +24,9 @@ import lombok.Setter;
 @Getter
 @Setter
 @TableName("biz_quick_login")
-public class QuickLogin implements Serializable {
+public class QuickLogin extends BaseEntity implements Serializable {
 
+    @Serial
     private static final long serialVersionUID = 1L;
 
     /**

src/main/java/com/mini/mybigscreen/biz/domain/WarningAlert.java

@@ -4,8 +4,12 @@ import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+
+import java.io.Serial;
 import java.io.Serializable;
 import java.time.LocalDateTime;
+
+import com.mini.mybigscreen.Model.BaseEntity;
 import lombok.Getter;
 import lombok.Setter;
 
@@ -20,8 +24,9 @@ import lombok.Setter;
 @Getter
 @Setter
 @TableName("biz_warning_alert")
-public class WarningAlert implements Serializable {
+public class WarningAlert extends BaseEntity implements Serializable {
 
+    @Serial
     private static final long serialVersionUID = 1L;
 
     /**