From 137dd06a07e9bff0fa54ab6a13588d5383cd1f1f Mon Sep 17 00:00:00 2001
From: tianyongbao <tianyongbao@haier.com>
Date: Tue, 3 Feb 2026 12:29:05 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=E7=B3=BB=E7=BB=9F?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=EF=BC=8C=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E5=AD=97=E5=85=B8=E5=8A=9F=E8=83=BD=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages.json                                |  42 ++
 src/pages/mine.vue                            |  24 +
 src/pages_mine/pages/system/dict/addEdit.vue  | 209 ++++++
 src/pages_mine/pages/system/dict/details.vue  | 257 +++++++
 src/pages_mine/pages/system/dict/list.vue     | 597 ++++++++++++++++
 .../pages/system/dictData/addEdit.vue         | 256 +++++++
 .../pages/system/dictData/details.vue         | 278 ++++++++
 src/pages_mine/pages/system/dictData/list.vue | 660 ++++++++++++++++++
 src/pages_mine/pages/system/index.vue         | 137 ++++
 9 files changed, 2460 insertions(+)
 create mode 100644 src/pages_mine/pages/system/dict/addEdit.vue
 create mode 100644 src/pages_mine/pages/system/dict/details.vue
 create mode 100644 src/pages_mine/pages/system/dict/list.vue
 create mode 100644 src/pages_mine/pages/system/dictData/addEdit.vue
 create mode 100644 src/pages_mine/pages/system/dictData/details.vue
 create mode 100644 src/pages_mine/pages/system/dictData/list.vue
 create mode 100644 src/pages_mine/pages/system/index.vue

diff --git a/src/pages.json b/src/pages.json
index d9a0e75..71fe898 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -839,6 +839,48 @@
             "navigationBarTitleText": "关于我们",
             "disableScroll": true
           }
+        },
+        {
+          "path": "system/index",
+          "style": {
+            "navigationBarTitleText": "系统管理"
+          }
+        },
+        {
+          "path": "system/dict/list",
+          "style": {
+            "navigationBarTitleText": "字典管理"
+          }
+        },
+        {
+          "path": "system/dict/addEdit",
+          "style": {
+            "navigationBarTitleText": "字典管理"
+          }
+        },
+        {
+          "path": "system/dict/details",
+          "style": {
+            "navigationBarTitleText": "字典详情"
+          }
+        },
+        {
+          "path": "system/dictData/list",
+          "style": {
+            "navigationBarTitleText": "字典数据"
+          }
+        },
+        {
+          "path": "system/dictData/addEdit",
+          "style": {
+            "navigationBarTitleText": "字典数据"
+          }
+        },
+        {
+          "path": "system/dictData/details",
+          "style": {
+            "navigationBarTitleText": "数据详情"
+          }
         }
       ]
     },
diff --git a/src/pages/mine.vue b/src/pages/mine.vue
index 804ca82..81c7bfe 100644
--- a/src/pages/mine.vue
+++ b/src/pages/mine.vue
@@ -85,6 +85,24 @@
         </view>
       </view>
 
+      <view class="menu-section" v-show="auth.hasPermi('system:user:list')">
+        <view class="section-title">
+          <view class="title-bar"></view>
+          <text class="title-text">系统管理</text>
+        </view>
+        <view class="menu-card">
+          <view class="menu-item" @click="handleToSystemManage">
+            <view class="item-left">
+              <view class="menu-icon-wrapper" style="background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);">
+                <uni-icons type="settings" size="20" color="#ffffff"></uni-icons>
+              </view>
+              <text class="menu-text">系统管理</text>
+            </view>
+            <uni-icons type="right" size="16" color="#c0c4cc"></uni-icons>
+          </view>
+        </view>
+      </view>
+
       <view class="menu-section">
         <view class="section-title">
           <view class="title-bar"></view>
@@ -130,6 +148,7 @@
 import { ref, computed } from "vue";
 import config from '@/config.js'
 import useUserStore from '@/store/modules/user'
+import auth from "@/plugins/auth"; // 导入鉴权插件
 const userStore = useUserStore()
 const name = userStore.name;
 const userId = computed(() => userStore.userId || '');
@@ -151,6 +170,11 @@ function handleToSetting() {
     url: '/pages_mine/pages/setting/index'
   });
 };
+function handleToSystemManage() {
+  uni.navigateTo({
+    url: '/pages_mine/pages/system/index'
+  });
+};
 function handleToLogin() {
   uni.reLaunch({
     url: '/pages/login'
diff --git a/src/pages_mine/pages/system/dict/addEdit.vue b/src/pages_mine/pages/system/dict/addEdit.vue
new file mode 100644
index 0000000..26d2760
--- /dev/null
+++ b/src/pages_mine/pages/system/dict/addEdit.vue
@@ -0,0 +1,209 @@
+<template>
+  <view class="container" style="paddingBottom:1rpx;">
+    <u-navbar
+      leftIconSize="40rpx"
+      leftIconColor="#333333"
+      :title="title"
+    >
+    </u-navbar>
+    <view class="section">
+      <view class="section-title">{{ title }}</view>
+      <view class="form-view">
+        <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
+          :labelStyle="{ color: '#333333', fontSize: '30rpx' }">
+          <u-form-item label="字典名称" prop="dictName" required>
+            <u--input v-model="form.dictName" placeholder="请输入字典名称"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="字典类型" prop="dictType" required>
+            <u--input v-model="form.dictType" placeholder="请输入字典类型"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
+            <u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
+              inputAlign="right" border="none"></u--input>
+            <template #right>
+              <u-icon name="arrow-down"></u-icon>
+            </template>
+          </u-form-item>
+
+          <u-form-item label="备注" prop="remark" labelPosition="top">
+            <u--textarea v-model="form.remark" placeholder="请输入备注" border="none" autoHeight inputAlign="right" count
+              maxlength="500" style="padding:18rpx 0;"></u--textarea>
+          </u-form-item>
+        </u--form>
+        <view class="form-btn">
+          <u-button type="primary" text="提交" @click="submit"></u-button>
+        </view>
+      </view>
+    </view>
+    <u-toast ref="uToast"></u-toast>
+    <u-picker itemHeight="88" :show="showStatusPicker" :columns="statusList" keyName="dictLabel" @cancel="showStatusPicker = false"
+      @confirm="handleStatusConfirm"></u-picker>
+  </view>
+</template>
+
+<script setup>
+import { ref, reactive, getCurrentInstance } from 'vue'
+import { getType, addType, updateType } from '@/api/system/dict/type'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad } from "@dcloudio/uni-app"
+
+const { proxy } = getCurrentInstance()
+const statusList = ref([])
+const title = ref('添加字典类型')
+const showStatusPicker = ref(false)
+const statusName = ref('')
+
+const form = reactive({
+  dictId: undefined,
+  dictName: undefined,
+  dictType: undefined,
+  status: '0',
+  remark: undefined
+})
+
+const rules = {
+  dictName: [
+    { required: true, message: '字典名称不能为空', trigger: ['blur', 'change'] }
+  ],
+  dictType: [
+    { required: true, message: '字典类型不能为空', trigger: ['blur', 'change'] }
+  ]
+}
+
+onLoad((option) => {
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = [res.data]
+  })
+
+  if (option.id) {
+    title.value = '修改字典类型'
+    getDetail(option.id)
+  } else {
+    // 新增时默认显示状态
+    setTimeout(() => {
+      updateStatusName()
+    }, 100)
+  }
+})
+
+// 获取详情
+function getDetail(id) {
+  getType(id).then(res => {
+    Object.assign(form, res.data)
+    updateStatusName()
+  })
+}
+
+// 更新状态名称显示
+function updateStatusName() {
+  if (statusList.value.length > 0 && statusList.value[0].length > 0) {
+    const item = statusList.value[0].find(v => v.dictValue === form.status)
+    statusName.value = item ? item.dictLabel : ''
+  }
+}
+
+// 状态选择确认
+function handleStatusConfirm(e) {
+  form.status = e.value[0].dictValue
+  statusName.value = e.value[0].dictLabel
+  showStatusPicker.value = false
+}
+
+// 提交
+function submit() {
+  console.log('submit 被调用')
+  proxy.$refs['uForm'].validate().then(() => {
+    console.log('验证通过', form.dictId)
+    if (form.dictId) {
+      updateType(form).then(() => {
+        console.log('修改成功,将跳转')
+        proxy.$refs['uToast'].show({
+          message: '修改成功', complete() {
+            console.log('complete 被调用,执行跳转')
+            uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
+          }
+        })
+      })
+    } else {
+      addType(form).then(() => {
+        console.log('新增成功,将跳转')
+        proxy.$refs['uToast'].show({
+          message: '新增成功', complete() {
+            console.log('complete 被调用,执行跳转')
+            uni.navigateTo({ url: `/pages_mine/pages/system/dict/list` })
+          }
+        })
+      })
+    }
+  }).catch(() => {
+    console.log('验证失败')
+    proxy.$refs['uToast'].show({
+      type: 'error',
+      message: '请填写完整信息'
+    })
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+  background-color: #f5f5f5;
+}
+
+.section {
+  margin: 24rpx;
+  padding: 0;
+  background-color: #fff;
+  border-radius: 16rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  overflow: hidden;
+
+  .section-title {
+    padding: 16rpx 24rpx;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: #ffffff;
+    line-height: 1.2;
+    font-size: 28rpx;
+    font-weight: 600;
+    display: flex;
+    align-items: center;
+    
+    &::before {
+      content: '';
+      width: 6rpx;
+      height: 28rpx;
+      background: #ffffff;
+      border-radius: 3rpx;
+      margin-right: 12rpx;
+    }
+  }
+
+  .form-view {
+    padding: 24rpx;
+
+    .form-btn {
+      padding-top: 16rpx;
+    }
+  }
+}
+</style>
+
+<style lang="scss">
+.form-btn .u-button {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
+  border: none !important;
+  border-radius: 24rpx !important;
+  height: 80rpx !important;
+  box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.4) !important;
+}
+
+.form-btn .u-button__text {
+  font-size: 30rpx !important;
+  font-weight: 500 !important;
+  letter-spacing: 2rpx !important;
+}
+</style>
diff --git a/src/pages_mine/pages/system/dict/details.vue b/src/pages_mine/pages/system/dict/details.vue
new file mode 100644
index 0000000..c15b873
--- /dev/null
+++ b/src/pages_mine/pages/system/dict/details.vue
@@ -0,0 +1,257 @@
+<template>
+  <view class="container">
+    <u-navbar
+      leftIconSize="40rpx"
+      leftIconColor="#333333"
+      title="字典详情"
+    >
+    </u-navbar>
+    
+    <view class="detail-card">
+      <view class="card-header">
+        <view class="header-icon">
+          <uni-icons type="bars" size="24" color="#ffffff"></uni-icons>
+        </view>
+        <view class="header-info">
+          <text class="card-name">{{ detailInfo.dictName }}<text class="card-code">({{ detailInfo.dictType }})</text></text>
+        </view>
+      </view>
+      
+      <view class="card-body">
+        <view class="info-section">
+          <view class="section-title">
+            <view class="title-icon"></view>
+            <text>基本信息</text>
+          </view>
+          <view class="info-list">
+            <view class="list-item">
+              <text class="item-label">字典编号</text>
+              <text class="item-value">{{ detailInfo.dictId }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">字典名称</text>
+              <text class="item-value">{{ detailInfo.dictName }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">字典类型</text>
+              <text class="item-value">{{ detailInfo.dictType }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">状态</text>
+              <text class="item-value" :class="getStatusClass(detailInfo.status)">{{ statusText }}</text>
+            </view>
+            <view class="list-item" v-if="detailInfo.createTime">
+              <text class="item-label">创建时间</text>
+              <text class="item-value">{{ detailInfo.createTime }}</text>
+            </view>
+            <view class="list-item" v-if="detailInfo.updateTime">
+              <text class="item-label">更新时间</text>
+              <text class="item-value">{{ detailInfo.updateTime }}</text>
+            </view>
+          </view>
+        </view>
+        
+        <view class="info-section" v-if="detailInfo.remark">
+          <view class="section-title">
+            <view class="title-icon"></view>
+            <text>备注</text>
+          </view>
+          <view class="remark-content">
+            <text>{{ detailInfo.remark }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+    
+    <u-toast ref="uToast"></u-toast>
+  </view>
+</template>
+
+<script setup>
+import { ref, reactive, toRefs, computed } from 'vue'
+import { getType } from '@/api/system/dict/type'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad } from "@dcloudio/uni-app"
+
+const id = ref('')
+const statusList = ref([])
+const data = reactive({
+  detailInfo: {}
+})
+const { detailInfo } = toRefs(data)
+
+const statusText = computed(() => {
+  if (statusList.value.length > 0) {
+    const item = statusList.value.find(v => v.dictValue === detailInfo.value.status)
+    return item ? item.dictLabel : ''
+  }
+  return ''
+})
+
+function getStatusClass(status) {
+  const statusStr = String(status)
+  if (statusStr === '0') {
+    return 'status-normal'
+  }
+  if (statusStr === '1') {
+    return 'status-disabled'
+  }
+  return 'status-default'
+}
+
+onLoad((option) => {
+  id.value = option.id
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = res.data
+  })
+  getInfo()
+})
+
+function getInfo() {
+  getType(id.value).then(res => {
+    detailInfo.value = res.data
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+  background: #f5f7fa;
+  padding-bottom: 24rpx;
+}
+
+.detail-card {
+  margin: 24rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  overflow: hidden;
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16rpx 20rpx;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  
+  .header-icon {
+    width: 48rpx;
+    height: 48rpx;
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 16rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-right: 12rpx;
+    backdrop-filter: blur(10rpx);
+  }
+  
+  .header-info {
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+    
+    .card-name {
+      color: #ffffff;
+      font-size: 28rpx;
+      font-weight: 600;
+      line-height: 1.2;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      
+      .card-code {
+        color: rgba(255, 255, 255, 0.85);
+        font-size: 28rpx;
+        font-weight: 400;
+        margin-left: 8rpx;
+      }
+    }
+  }
+}
+
+.card-body {
+  padding: 24rpx;
+}
+
+.info-section {
+  margin-bottom: 32rpx;
+  
+  &:last-child {
+    margin-bottom: 0;
+  }
+  
+  .section-title {
+    display: flex;
+    align-items: center;
+    margin-bottom: 20rpx;
+    
+    .title-icon {
+      width: 6rpx;
+      height: 28rpx;
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      border-radius: 3rpx;
+      margin-right: 12rpx;
+    }
+    
+    text {
+      color: #2c3e50;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+  }
+  
+  .info-list {
+    .list-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 20rpx;
+      background: #f8f9fa;
+      border-radius: 8rpx;
+      margin-bottom: 12rpx;
+      
+      &:last-child {
+        margin-bottom: 0;
+      }
+      
+      .item-label {
+        color: #7f8c8d;
+        font-size: 26rpx;
+      }
+      
+      .item-value {
+        color: #2c3e50;
+        font-size: 28rpx;
+        font-weight: 500;
+        text-align: right;
+        
+        &.status-normal {
+          color: #52c41a;
+        }
+        
+        &.status-disabled {
+          color: #ff4d4f;
+        }
+        
+        &.status-default {
+          color: #666666;
+        }
+      }
+    }
+  }
+  
+  .remark-content {
+    padding: 20rpx;
+    background: #f8f9fa;
+    border-radius: 8rpx;
+    
+    text {
+      color: #2c3e50;
+      font-size: 26rpx;
+      line-height: 1.6;
+    }
+  }
+}
+</style>
diff --git a/src/pages_mine/pages/system/dict/list.vue b/src/pages_mine/pages/system/dict/list.vue
new file mode 100644
index 0000000..3362bd9
--- /dev/null
+++ b/src/pages_mine/pages/system/dict/list.vue
@@ -0,0 +1,597 @@
+<template>
+  <view class="container">
+    <u-sticky offsetTop="0rpx" customNavHeight="0rpx">
+      <view class="search-view">
+        <u--input v-model="queryParams.dictName" border="false" placeholder="请输入字典名称" class="search-input"
+          @blur="searchBlur" suffixIcon="search" suffixIconStyle="color: #909399">
+        </u--input>
+        <view class="filter-btn" @click="filterPanel = !filterPanel">
+          <uni-icons type="list" size="18" color="#667eea"></uni-icons>
+          <text>筛选</text>
+        </view>
+        <view class="add-btn" @click="handleAdd()">
+          <uni-icons type="plusempty" size="18" color="#667eea"></uni-icons>
+          <text>新增</text>
+        </view>
+        <u-transition :show="filterPanel" mode="fade">
+          <view class="filter-panel" :style="{ height: `${windowHeight - 42}px` }">
+            <view class="filter-panel-content">
+              <view class="filter-title">字典类型</view>
+              <u--input v-model="queryParams.dictType" placeholder="请输入字典类型" border="surround"></u--input>
+              
+              <view class="filter-title">状态</view>
+              <view class="state-list">
+                <view v-for="item in statusList" :key="item.dictValue" class="state-item"
+                  :class="item.selected ? 'active' : ''" @click="selectStatus(item)">{{ item.dictLabel }}</view>
+              </view>
+            </view>
+            <view class="btn-box">
+              <view class="btn-reset" @click="resetQuery()">
+                <uni-icons type="reload" size="16" color="#909399"></uni-icons>
+                <text>重置</text>
+              </view>
+              <view class="btn-confirm" @click="searchSubmit()">
+                <uni-icons type="checkmarkempty" size="16" color="#ffffff"></uni-icons>
+                <text>确定</text>
+              </view>
+            </view>
+          </view>
+        </u-transition>
+      </view>
+    </u-sticky>
+    <u-list @scrolltolower="loadmore" :spaceHeight="116" lowerThreshold="100">
+      <u-list-item v-for="(item, index) in listData" :key="index">
+        <view class="list-item" @click="enterDetails(item)">
+          <view class="item-header">
+            <view class="card-name-section">
+              <view class="card-icon">
+                <uni-icons type="bars" size="20" color="#ffffff"></uni-icons>
+              </view>
+              <view class="card-info">
+                <text class="card-name">{{ item.dictName }}<text class="card-code" v-if="item.dictType">({{ item.dictType }})</text></text>
+              </view>
+            </view>
+            <view class="balance-section">
+              <view class="status-tag" :class="item.status === '0' ? 'status-normal' : 'status-disabled'">
+                {{ dictStr(item.status, statusList) }}
+              </view>
+            </view>
+          </view>
+          
+          <view class="card-body">
+            <view class="info-row">
+              <view class="info-item" v-if="item.remark">
+                <text class="info-label">备注</text>
+                <text class="info-value">{{ item.remark }}</text>
+              </view>
+              <view class="info-item" v-if="item.createTime">
+                <text class="info-label">创建时间</text>
+                <text class="info-value">{{ item.createTime }}</text>
+              </view>
+            </view>
+          </view>
+          
+          <view class="operate" @click.stop>
+            <view class="btn-data" @click="handleDictData(item)">
+              <uni-icons type="list" size="16" color="#67c23a"></uni-icons>
+              <text>字典数据</text>
+            </view>
+            <view class="btn-edit" @click="handleUpdate(item)">
+              <uni-icons type="compose" size="16" color="#667eea"></uni-icons>
+              <text>修改</text>
+            </view>
+            <view class="btn-delete" @click="handleDelete(item)">
+              <uni-icons type="trash" size="16" color="#f5576c"></uni-icons>
+              <text>删除</text>
+            </view>
+          </view>
+        </view>
+      </u-list-item>
+      <view></view>
+      <u-loadmore :status="loadStatus" loadingIcon="semicircle" height="88" fontSize="32rpx" @loadmore="loadmore" />
+    </u-list>
+  </view>
+  <suspend></suspend>
+  <refresh></refresh>
+</template>
+
+<script setup>
+import { ref, reactive, computed } from 'vue'
+import { listType, delType } from '@/api/system/dict/type'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad, onShow } from "@dcloudio/uni-app"
+import modal from '@/plugins/modal'
+
+const pageNum = ref(1)
+const listData = ref([])
+const isShow = ref(false)
+const loadStatus = ref('loadmore')
+const statusList = ref([])
+const filterPanel = ref(false)
+
+const queryParams = reactive({
+  dictName: undefined,
+  dictType: undefined,
+  status: undefined
+})
+
+const windowHeight = computed(() => {
+  uni.getSystemInfoSync().windowHeight - 50
+})
+
+onLoad(() => {
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = res.data.map(item => ({
+      ...item,
+      selected: false
+    }))
+  })
+  getList()
+})
+
+onShow(() => {
+  if (isShow.value) {
+    listData.value = []
+    pageNum.value = 1
+    getList()
+    isShow.value = false
+  }
+})
+
+// 获取列表
+function getList() {
+  loadStatus.value = 'loading'
+  listType({ pageSize: 10, pageNum: pageNum.value, ...queryParams }).then(res => {
+    listData.value = listData.value.concat(res.rows)
+    if (listData.value.length < res.total) {
+      loadStatus.value = 'loadmore'
+    } else {
+      loadStatus.value = 'nomore'
+    }
+  }).catch(() => {
+    loadStatus.value = 'nomore'
+  })
+}
+
+// 搜索框失焦
+function searchBlur() {
+  listData.value = []
+  pageNum.value = 1
+  getList()
+}
+
+// 选择状态
+function selectStatus(item) {
+  statusList.value.forEach(v => v.selected = false)
+  item.selected = !item.selected
+  queryParams.status = item.dictValue
+}
+
+// 搜索提交
+function searchSubmit() {
+  listData.value = []
+  pageNum.value = 1
+  filterPanel.value = false
+  getList()
+}
+
+// 重置查询
+function resetQuery() {
+  queryParams.dictName = undefined
+  queryParams.dictType = undefined
+  queryParams.status = undefined
+  listData.value = []
+  pageNum.value = 1
+  statusList.value.forEach(v => v.selected = false)
+  filterPanel.value = false
+  getList()
+}
+
+// 上拉加载
+function loadmore() {
+  pageNum.value += 1
+  if (loadStatus.value == 'loadmore') {
+    getList()
+  }
+}
+
+// 新增
+function handleAdd() {
+  isShow.value = true
+  uni.navigateTo({
+    url: '/pages_mine/pages/system/dict/addEdit'
+  })
+}
+
+// 编辑
+function handleUpdate(row) {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dict/addEdit?id=${row.dictId}`
+  })
+}
+
+// 字典数据
+function handleDictData(row) {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dictData/list?dictId=${row.dictId}`
+  })
+}
+
+// 删除
+function handleDelete(row) {
+  modal.confirm('是否确认删除字典编号为"' + row.dictId + '"的数据项？').then(() => {
+    return delType(row.dictId)
+  }).then(() => {
+    listData.value = []
+    pageNum.value = 1
+    getList()
+    modal.msgSuccess('删除成功')
+  }).catch(() => {})
+}
+
+// 进入详情
+function enterDetails(row) {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dictData/list?dictId=${row.dictId}`
+  })
+}
+
+// 字典翻译
+function dictStr(value, list) {
+  const item = list.find(v => v.dictValue === value)
+  return item ? item.dictLabel : value
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+}
+
+.search-view {
+  display: flex;
+  align-items: center;
+  padding: 20rpx 24rpx;
+  background-color: #ffffff;
+  position: relative;
+
+  .search-input {
+    background: rgba(102, 126, 234, 0.08);
+    color: #333333;
+    flex: 1;
+    margin-right: 16rpx;
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    height: 66rpx !important;
+    display: flex;
+    align-items: center;
+  }
+
+  .filter-btn {
+    display: flex;
+    align-items: center;
+    gap: 6rpx;
+    padding: 12rpx 24rpx;
+    background: rgba(102, 126, 234, 0.08);
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    transition: all 0.3s ease;
+    flex-shrink: 0;
+    
+    &:active {
+      transform: scale(0.95);
+      background: rgba(102, 126, 234, 0.12);
+    }
+    
+    text {
+      color: #667eea;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+    
+    uni-icons {
+      color: #667eea;
+    }
+  }
+  
+  .add-btn {
+    display: flex;
+    align-items: center;
+    gap: 6rpx;
+    padding: 12rpx 24rpx;
+    background: rgba(102, 126, 234, 0.08);
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    transition: all 0.3s ease;
+    flex-shrink: 0;
+    margin-left: 10rpx;
+    
+    &:active {
+      transform: scale(0.95);
+      background: rgba(102, 126, 234, 0.12);
+    }
+    
+    text {
+      color: #667eea;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+    
+    uni-icons {
+      color: #667eea;
+    }
+  }
+
+  .filter-panel {
+    position: absolute;
+    top: 100rpx;
+    left: 0;
+    right: 0;
+    background-color: #ffffff;
+    z-index: 999;
+    display: flex;
+    flex-direction: column;
+    box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
+
+    .filter-panel-content {
+      flex: 1;
+      padding: 32rpx;
+      overflow-y: auto;
+
+      .filter-title {
+        font-size: 28rpx;
+        font-weight: bold;
+        margin: 32rpx 0 24rpx 0;
+        color: #303133;
+
+        &:first-child {
+          margin-top: 0;
+        }
+      }
+
+      .state-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 16rpx;
+
+        .state-item {
+          padding: 16rpx 32rpx;
+          background-color: #f5f5f5;
+          border-radius: 32rpx;
+          font-size: 28rpx;
+          color: #606266;
+
+          &.active {
+            background-color: #667eea;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+
+    .btn-box {
+      display: flex;
+      padding: 24rpx 32rpx;
+      border-top: 1rpx solid #f0f0f0;
+
+      .btn-reset,
+      .btn-confirm {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 20rpx 0;
+        border-radius: 32rpx;
+        font-size: 28rpx;
+
+        text {
+          margin-left: 12rpx;
+        }
+      }
+
+      .btn-reset {
+        background-color: #f5f5f5;
+        color: #909399;
+        margin-right: 16rpx;
+      }
+
+      .btn-confirm {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: #ffffff;
+      }
+    }
+  }
+}
+
+.list-item {
+  margin: 10rpx 24rpx;
+  background-color: #fff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  transition: all 0.2s ease;
+  
+  &:active {
+    transform: scale(0.98);
+    box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.06);
+  }
+
+  .item-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 16rpx 24rpx;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    
+    .card-name-section {
+      display: flex;
+      align-items: center;
+      flex: 1;
+      min-width: 0;
+      margin-right: 16rpx;
+    }
+    
+    .card-icon {
+      width: 40rpx;
+      height: 40rpx;
+      background: rgba(255, 255, 255, 0.25);
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-right: 12rpx;
+      flex-shrink: 0;
+    }
+    
+    .card-info {
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      gap: 4rpx;
+      
+      .card-name {
+        color: #ffffff;
+        font-size: 28rpx;
+        font-weight: 600;
+        line-height: 1.2;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      
+      .card-code {
+        color: rgba(255, 255, 255, 0.85);
+        font-size: 22rpx;
+        font-weight: 400;
+        line-height: 1;
+      }
+    }
+    
+    .balance-section {
+      display: flex;
+      align-items: center;
+      flex-shrink: 0;
+      white-space: nowrap;
+      
+      .status-tag {
+        padding: 8rpx 20rpx;
+        border-radius: 20rpx;
+        font-size: 22rpx;
+        font-weight: 500;
+
+        &.status-normal {
+          background-color: rgba(82, 196, 26, 0.2);
+          color: #ffffff;
+        }
+
+        &.status-disabled {
+          background-color: rgba(255, 77, 79, 0.2);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+
+  .card-body {
+    padding: 24rpx;
+    background: #fff;
+  }
+
+  .info-row {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 24rpx;
+    margin-bottom: 0;
+
+    .info-item {
+      flex: 0 0 calc(50% - 12rpx);
+      display: flex;
+      flex-direction: column;
+      gap: 4rpx;
+      min-width: 0;
+      margin-bottom: -5rpx;
+      
+      &.info-item-full {
+        flex: 0 0 100%;
+      }
+
+      .info-label {
+        font-size: 24rpx;
+        color: #667eea;
+        font-weight: 500;
+        background: rgba(102, 126, 234, 0.08);
+        padding: 6rpx 12rpx;
+        border-radius: 8rpx;
+        align-self: flex-start;
+      }
+
+      .info-value {
+        font-size: 26rpx;
+        color: #333;
+        font-weight: 500;
+        flex: 1;
+        line-height: 1.5;
+        word-break: break-all;
+      }
+      
+      &:not(.info-item-full) .info-value {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+
+  .operate {
+    display: flex;
+    justify-content: flex-end;
+    padding: 16rpx 24rpx 24rpx;
+    gap: 8rpx;
+    flex-wrap: nowrap;
+
+    .btn-data,
+    .btn-edit,
+    .btn-delete {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 4rpx;
+      padding: 0 14rpx;
+      height: 60rpx;
+      border-radius: 10rpx;
+      font-size: 24rpx;
+      font-weight: 500;
+      transition: all 0.3s ease;
+      white-space: nowrap;
+      flex-shrink: 0;
+      
+      &:active {
+        transform: scale(0.95);
+      }
+    }
+    
+    .btn-data {
+      background: rgba(103, 194, 58, 0.1);
+      color: #67c23a;
+      border: 1rpx solid rgba(103, 194, 58, 0.3);
+    }
+    
+    .btn-edit {
+      background: rgba(102, 126, 234, 0.1);
+      color: #667eea;
+      border: 1rpx solid rgba(102, 126, 234, 0.3);
+    }
+    
+    .btn-delete {
+      background: rgba(245, 87, 108, 0.1);
+      color: #f5576c;
+      border: 1rpx solid rgba(245, 87, 108, 0.3);
+    }
+  }
+}
+</style>
diff --git a/src/pages_mine/pages/system/dictData/addEdit.vue b/src/pages_mine/pages/system/dictData/addEdit.vue
new file mode 100644
index 0000000..b9a5593
--- /dev/null
+++ b/src/pages_mine/pages/system/dictData/addEdit.vue
@@ -0,0 +1,256 @@
+<template>
+  <view class="container" style="paddingBottom:1rpx;">
+    <u-navbar
+      leftIconSize="40rpx"
+      leftIconColor="#333333"
+      :title="title"
+    >
+    </u-navbar>
+    <view class="section">
+      <view class="section-title">{{ title }}</view>
+      <view class="form-view">
+        <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
+          :labelStyle="{ color: '#333333', fontSize: '30rpx' }">
+          <u-form-item label="字典类型">
+            <u--input v-model="form.dictType" disabled disabledColor="#ffffff" placeholder="字典类型"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="数据标签" prop="dictLabel" required>
+            <u--input v-model="form.dictLabel" placeholder="请输入数据标签"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="数据键值" prop="dictValue" required>
+            <u--input v-model="form.dictValue" placeholder="请输入数据键值"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="显示排序" prop="dictSort" required>
+            <u--input v-model="form.dictSort" type="number" placeholder="请输入显示排序"
+              inputAlign="right" border="none"></u--input>
+          </u-form-item>
+
+          <u-form-item label="回显样式" prop="listClassName" @click="showListClassPicker = true">
+            <u--input v-model="listClassName" disabled disabledColor="#ffffff" placeholder="请选择回显样式"
+              inputAlign="right" border="none"></u--input>
+            <template #right>
+              <u-icon name="arrow-down"></u-icon>
+            </template>
+          </u-form-item>
+
+          <u-form-item label="状态" prop="statusName" @click="showStatusPicker = true">
+            <u--input v-model="statusName" disabled disabledColor="#ffffff" placeholder="请选择状态"
+              inputAlign="right" border="none"></u--input>
+            <template #right>
+              <u-icon name="arrow-down"></u-icon>
+            </template>
+          </u-form-item>
+
+          <u-form-item label="备注" prop="remark" labelPosition="top">
+            <u--textarea v-model="form.remark" placeholder="请输入备注" border="none" autoHeight inputAlign="right" count
+              maxlength="500" style="padding:18rpx 0;"></u--textarea>
+          </u-form-item>
+        </u--form>
+        <view class="form-btn">
+          <u-button type="primary" text="提交" @click="submit"></u-button>
+        </view>
+      </view>
+    </view>
+    <u-toast ref="uToast"></u-toast>
+    <u-picker itemHeight="88" :show="showStatusPicker" :columns="statusList" keyName="dictLabel" @cancel="showStatusPicker = false"
+      @confirm="handleStatusConfirm"></u-picker>
+    <u-picker itemHeight="88" :show="showListClassPicker" :columns="listClassList" keyName="label" @cancel="showListClassPicker = false"
+      @confirm="handleListClassConfirm"></u-picker>
+  </view>
+</template>
+
+<script setup>
+import { ref, reactive, getCurrentInstance } from 'vue'
+import { getData, addData, updateData } from '@/api/system/dict/data'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad } from "@dcloudio/uni-app"
+
+const { proxy } = getCurrentInstance()
+const statusList = ref([])
+const listClassList = ref([[
+  { value: 'default', label: '默认' },
+  { value: 'primary', label: '主要' },
+  { value: 'success', label: '成功' },
+  { value: 'info', label: '信息' },
+  { value: 'warning', label: '警告' },
+  { value: 'danger', label: '危险' }
+]])
+const title = ref('添加字典数据')
+const showStatusPicker = ref(false)
+const showListClassPicker = ref(false)
+const statusName = ref('')
+const listClassName = ref('')
+
+const form = reactive({
+  dictCode: undefined,
+  dictType: undefined,
+  dictLabel: undefined,
+  dictValue: undefined,
+  dictSort: '0',
+  listClass: 'default',
+  status: '0',
+  remark: undefined
+})
+
+const rules = {
+  dictLabel: [
+    { required: true, message: '数据标签不能为空', trigger: ['blur', 'change'] }
+  ],
+  dictValue: [
+    { required: true, message: '数据键值不能为空', trigger: ['blur', 'change'] }
+  ],
+  dictSort: [
+    { required: true, message: '显示排序不能为空', trigger: ['blur', 'change'] }
+  ]
+}
+
+onLoad((option) => {
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = [res.data]
+  })
+
+  if (option.dictCode) {
+    title.value = '修改字典数据'
+    getDetail(option.dictCode)
+  } else if (option.dictType) {
+    form.dictType = option.dictType
+    // 新增时默认显示状态和回显样式
+    setTimeout(() => {
+      updateStatusName()
+      updateListClassName()
+    }, 100)
+  }
+})
+
+// 获取详情
+function getDetail(dictCode) {
+  getData(dictCode).then(res => {
+    Object.assign(form, res.data)
+    updateStatusName()
+    updateListClassName()
+  })
+}
+
+// 更新状态名称显示
+function updateStatusName() {
+  if (statusList.value.length > 0 && statusList.value[0].length > 0) {
+    const item = statusList.value[0].find(v => v.dictValue === form.status)
+    statusName.value = item ? item.dictLabel : ''
+  }
+}
+
+// 更新回显样式名称显示
+function updateListClassName() {
+  if (listClassList.value.length > 0 && listClassList.value[0].length > 0) {
+    const item = listClassList.value[0].find(v => v.value === form.listClass)
+    listClassName.value = item ? item.label : ''
+  }
+}
+
+// 状态选择确认
+function handleStatusConfirm(e) {
+  form.status = e.value[0].dictValue
+  statusName.value = e.value[0].dictLabel
+  showStatusPicker.value = false
+}
+
+// 回显样式选择确认
+function handleListClassConfirm(e) {
+  form.listClass = e.value[0].value
+  listClassName.value = e.value[0].label
+  showListClassPicker.value = false
+}
+
+// 提交
+function submit() {
+  proxy.$refs['uForm'].validate().then(() => {
+    if (form.dictCode) {
+      updateData(form).then(() => {
+        proxy.$refs['uToast'].show({
+          message: '修改成功', complete() {
+            uni.navigateTo({ url: `/pages_mine/pages/system/dictData/list?dictType=${form.dictType}` })
+          }
+        })
+      })
+    } else {
+      addData(form).then(() => {
+        proxy.$refs['uToast'].show({
+          message: '新增成功', complete() {
+            uni.navigateTo({ url: `/pages_mine/pages/system/dictData/list?dictType=${form.dictType}` })
+          }
+        })
+      })
+    }
+  }).catch(() => {
+    proxy.$refs['uToast'].show({
+      type: 'error',
+      message: '请填写完整信息'
+    })
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+  background-color: #f5f5f5;
+}
+
+.section {
+  margin: 24rpx;
+  padding: 0;
+  background-color: #fff;
+  border-radius: 16rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  overflow: hidden;
+
+  .section-title {
+    padding: 16rpx 24rpx;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: #ffffff;
+    line-height: 1.2;
+    font-size: 28rpx;
+    font-weight: 600;
+    display: flex;
+    align-items: center;
+    
+    &::before {
+      content: '';
+      width: 6rpx;
+      height: 28rpx;
+      background: #ffffff;
+      border-radius: 3rpx;
+      margin-right: 12rpx;
+    }
+  }
+
+  .form-view {
+    padding: 24rpx;
+
+    .form-btn {
+      padding-top: 16rpx;
+    }
+  }
+}
+</style>
+
+<style lang="scss">
+.form-btn .u-button {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
+  border: none !important;
+  border-radius: 24rpx !important;
+  height: 80rpx !important;
+  box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.4) !important;
+}
+
+.form-btn .u-button__text {
+  font-size: 30rpx !important;
+  font-weight: 500 !important;
+  letter-spacing: 2rpx !important;
+}
+</style>
diff --git a/src/pages_mine/pages/system/dictData/details.vue b/src/pages_mine/pages/system/dictData/details.vue
new file mode 100644
index 0000000..6ecacea
--- /dev/null
+++ b/src/pages_mine/pages/system/dictData/details.vue
@@ -0,0 +1,278 @@
+<template>
+  <view class="container">
+    <u-navbar
+      leftIconSize="40rpx"
+      leftIconColor="#333333"
+      title="数据详情"
+    >
+    </u-navbar>
+    
+    <view class="detail-card">
+      <view class="card-header">
+        <view class="header-icon">
+          <uni-icons type="star" size="24" color="#ffffff"></uni-icons>
+        </view>
+        <view class="header-info">
+          <text class="card-name">{{ detailInfo.dictLabel }}<text class="card-code">({{ detailInfo.dictValue }})</text></text>
+        </view>
+      </view>
+      
+      <view class="card-body">
+        <view class="info-section">
+          <view class="section-title">
+            <view class="title-icon"></view>
+            <text>基本信息</text>
+          </view>
+          <view class="info-list">
+            <view class="list-item">
+              <text class="item-label">字典编码</text>
+              <text class="item-value">{{ detailInfo.dictCode }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">字典类型</text>
+              <text class="item-value">{{ detailInfo.dictType }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">数据标签</text>
+              <text class="item-value">{{ detailInfo.dictLabel }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">数据键值</text>
+              <text class="item-value">{{ detailInfo.dictValue }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">显示排序</text>
+              <text class="item-value">{{ detailInfo.dictSort }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">回显样式</text>
+              <text class="item-value">{{ listClassText }}</text>
+            </view>
+            <view class="list-item">
+              <text class="item-label">状态</text>
+              <text class="item-value" :class="getStatusClass(detailInfo.status)">{{ statusText }}</text>
+            </view>
+            <view class="list-item" v-if="detailInfo.createTime">
+              <text class="item-label">创建时间</text>
+              <text class="item-value">{{ detailInfo.createTime }}</text>
+            </view>
+          </view>
+        </view>
+        
+        <view class="info-section" v-if="detailInfo.remark">
+          <view class="section-title">
+            <view class="title-icon"></view>
+            <text>备注</text>
+          </view>
+          <view class="remark-content">
+            <text>{{ detailInfo.remark }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+    
+    <u-toast ref="uToast"></u-toast>
+  </view>
+</template>
+
+<script setup>
+import { ref, reactive, toRefs, computed } from 'vue'
+import { getData } from '@/api/system/dict/data'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad } from "@dcloudio/uni-app"
+
+const id = ref('')
+const statusList = ref([])
+const listClassOptions = [
+  { value: 'default', label: '默认' },
+  { value: 'primary', label: '主要' },
+  { value: 'success', label: '成功' },
+  { value: 'info', label: '信息' },
+  { value: 'warning', label: '警告' },
+  { value: 'danger', label: '危险' }
+]
+const data = reactive({
+  detailInfo: {}
+})
+const { detailInfo } = toRefs(data)
+
+const statusText = computed(() => {
+  if (statusList.value.length > 0) {
+    const item = statusList.value.find(v => v.dictValue === detailInfo.value.status)
+    return item ? item.dictLabel : ''
+  }
+  return ''
+})
+
+const listClassText = computed(() => {
+  const item = listClassOptions.find(v => v.value === detailInfo.value.listClass)
+  return item ? item.label : ''
+})
+
+function getStatusClass(status) {
+  const statusStr = String(status)
+  if (statusStr === '0') {
+    return 'status-normal'
+  }
+  if (statusStr === '1') {
+    return 'status-error'
+  }
+  return 'status-default'
+}
+
+onLoad((option) => {
+  id.value = option.dictCode
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = res.data
+  })
+  getInfo()
+})
+
+function getInfo() {
+  getData(id.value).then(res => {
+    detailInfo.value = res.data
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+.container {
+  background: #f5f7fa;
+  padding-bottom: 24rpx;
+}
+
+.detail-card {
+  margin: 24rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  overflow: hidden;
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16rpx 20rpx;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  
+  .header-icon {
+    width: 48rpx;
+    height: 48rpx;
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 16rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-right: 12rpx;
+    backdrop-filter: blur(10rpx);
+  }
+  
+  .header-info {
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+    
+    .card-name {
+      color: #ffffff;
+      font-size: 28rpx;
+      font-weight: 600;
+      line-height: 1.2;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      
+      .card-code {
+        color: rgba(255, 255, 255, 0.85);
+        font-size: 28rpx;
+        font-weight: 400;
+        margin-left: 8rpx;
+      }
+    }
+  }
+}
+
+.card-body {
+  padding: 24rpx;
+}
+
+.info-section {
+  margin-bottom: 32rpx;
+  
+  &:last-child {
+    margin-bottom: 0;
+  }
+  
+  .section-title {
+    display: flex;
+    align-items: center;
+    margin-bottom: 20rpx;
+    
+    .title-icon {
+      width: 6rpx;
+      height: 28rpx;
+      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+      border-radius: 3rpx;
+      margin-right: 12rpx;
+    }
+    
+    text {
+      color: #2c3e50;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+  }
+  
+  .info-list {
+    .list-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 20rpx;
+      background: #f8f9fa;
+      border-radius: 8rpx;
+      margin-bottom: 12rpx;
+      
+      &:last-child {
+        margin-bottom: 0;
+      }
+      
+      .item-label {
+        color: #7f8c8d;
+        font-size: 26rpx;
+      }
+      
+      .item-value {
+        color: #2c3e50;
+        font-size: 28rpx;
+        font-weight: 500;
+        text-align: right;
+        
+        &.status-normal {
+          color: #52c41a;
+        }
+        
+        &.status-error {
+          color: #ff4d4f;
+        }
+        
+        &.status-default {
+          color: #666666;
+        }
+      }
+    }
+  }
+  
+  .remark-content {
+    padding: 20rpx;
+    background: #f8f9fa;
+    border-radius: 8rpx;
+    
+    text {
+      color: #2c3e50;
+      font-size: 26rpx;
+      line-height: 1.6;
+    }
+  }
+}
+</style>
diff --git a/src/pages_mine/pages/system/dictData/list.vue b/src/pages_mine/pages/system/dictData/list.vue
new file mode 100644
index 0000000..e956120
--- /dev/null
+++ b/src/pages_mine/pages/system/dictData/list.vue
@@ -0,0 +1,660 @@
+<template>
+  <view class="container">
+    <u-sticky offsetTop="0rpx" customNavHeight="0rpx">
+      <view class="search-view">
+        <view class="dict-name-row">
+          <view class="divider-line"></view>
+          <view class="dict-name-text">
+            <text>字典类型：{{ dictName }}</text>
+          </view>
+          <view class="divider-line"></view>
+        </view>
+        <view class="search-row">
+          <u--input v-model="queryParams.dictLabel" border="false" placeholder="请输入字典标签" class="search-input"
+            @blur="searchBlur" suffixIcon="search" suffixIconStyle="color: #909399">
+          </u--input>
+          <view class="filter-btn" @click="filterPanel = !filterPanel">
+            <uni-icons type="list" size="18" color="#667eea"></uni-icons>
+            <text>筛选</text>
+          </view>
+          <view class="add-btn" @click="handleAdd()">
+            <uni-icons type="plusempty" size="18" color="#667eea"></uni-icons>
+            <text>新增</text>
+          </view>
+        </view>
+        <u-transition :show="filterPanel" mode="fade">
+          <view class="filter-panel" :style="{ height: `${windowHeight - 42}px` }">
+            <view class="filter-panel-content">
+              <view class="filter-title">状态</view>
+              <view class="state-list">
+                <view v-for="item in statusList" :key="item.dictValue" class="state-item"
+                  :class="item.selected ? 'active' : ''" @click="selectStatus(item)">{{ item.dictLabel }}</view>
+              </view>
+            </view>
+            <view class="btn-box">
+              <view class="btn-reset" @click="resetQuery()">
+                <uni-icons type="reload" size="16" color="#909399"></uni-icons>
+                <text>重置</text>
+              </view>
+              <view class="btn-confirm" @click="searchSubmit()">
+                <uni-icons type="checkmarkempty" size="16" color="#ffffff"></uni-icons>
+                <text>确定</text>
+              </view>
+            </view>
+          </view>
+        </u-transition>
+      </view>
+    </u-sticky>
+    <u-list @scrolltolower="loadmore" :spaceHeight="116" lowerThreshold="100">
+      <u-list-item v-for="(item, index) in listData" :key="index">
+        <view class="list-item" @click="enterDetails(item)">
+          <view class="item-header">
+            <view class="card-name-section">
+              <view class="card-icon">
+                <uni-icons type="star" size="20" color="#ffffff"></uni-icons>
+              </view>
+              <view class="card-info">
+                <view class="card-name">
+                  <text class="label-text">{{ item.dictLabel }}</text>
+                  <text class="value-text" v-if="item.dictValue">{{ item.dictValue }}</text>
+                </view>
+              </view>
+            </view>
+            <view class="balance-section">
+              <view class="status-tag" :class="item.status === '0' ? 'status-normal' : 'status-disabled'">
+                {{ dictStr(item.status, statusList) }}
+              </view>
+            </view>
+          </view>
+          
+          <view class="card-body">
+            <view class="info-row">
+              <view class="info-item">
+                <text class="info-label">显示排序</text>
+                <text class="info-value">{{ item.dictSort }}</text>
+              </view>
+              <view class="info-item">
+                <text class="info-label">字典类型</text>
+                <text class="info-value">{{ item.dictType }}</text>
+              </view>
+              <view class="info-item" v-if="item.createTime">
+                <text class="info-label">创建时间</text>
+                <text class="info-value">{{ item.createTime }}</text>
+              </view>
+              <view class="info-item" v-if="item.listClass">
+                <text class="info-label">回显样式</text>
+                <text class="info-value">{{ item.listClass }}</text>
+              </view>
+              <view class="info-item" v-if="item.remark">
+                <text class="info-label">备注</text>
+                <text class="info-value">{{ item.remark }}</text>
+              </view>
+            </view>
+          </view>
+
+          <view class="operate" @click.stop>
+            <view class="btn-edit" @click="handleUpdate(item)">
+              <uni-icons type="compose" size="16" color="#667eea"></uni-icons>
+              <text>修改</text>
+            </view>
+            <view class="btn-delete" @click="handleDelete(item)">
+              <uni-icons type="trash" size="16" color="#f5576c"></uni-icons>
+              <text>删除</text>
+            </view>
+          </view>
+        </view>
+      </u-list-item>
+      <view></view>
+      <u-loadmore :status="loadStatus" loadingIcon="semicircle" height="88" fontSize="32rpx" @loadmore="loadmore" />
+    </u-list>
+  </view>
+  <suspend></suspend>
+  <refresh></refresh>
+</template>
+
+<script setup>
+import { ref, reactive, computed } from 'vue'
+import { listData as getDataList, delData } from '@/api/system/dict/data'
+import { getType } from '@/api/system/dict/type'
+import { getDicts } from "@/api/system/dict/data"
+import { onLoad, onShow } from "@dcloudio/uni-app"
+import modal from '@/plugins/modal'
+
+const pageNum = ref(1)
+const listData = ref([])
+const isShow = ref(false)
+const loadStatus = ref('loadmore')
+const statusList = ref([])
+const filterPanel = ref(false)
+const dictType = ref('')
+const dictName = ref('')
+
+const queryParams = reactive({
+  dictType: undefined,
+  dictLabel: undefined,
+  status: undefined
+})
+
+const windowHeight = computed(() => {
+  uni.getSystemInfoSync().windowHeight - 50
+})
+
+onLoad((option) => {
+  getDicts('sys_normal_disable').then(res => {
+    statusList.value = res.data.map(item => ({
+      ...item,
+      selected: false
+    }))
+  })
+  
+  if (option.dictId) {
+    // 获取字典类型信息
+    getType(option.dictId).then(res => {
+      queryParams.dictType = res.data.dictType
+      dictType.value = res.data.dictType
+      dictName.value = res.data.dictName
+      // 在获取字典类型后再查询列表
+      getList()
+    })
+  } else {
+    getList()
+  }
+})
+
+onShow(() => {
+  if (isShow.value) {
+    listData.value = []
+    pageNum.value = 1
+    getList()
+    isShow.value = false
+  }
+})
+
+// 获取列表
+function getList() {
+  loadStatus.value = 'loading'
+  getDataList({ pageSize: 10, pageNum: pageNum.value, ...queryParams }).then(res => {
+    listData.value = listData.value.concat(res.rows)
+    if (listData.value.length < res.total) {
+      loadStatus.value = 'loadmore'
+    } else {
+      loadStatus.value = 'nomore'
+    }
+  }).catch(() => {
+    loadStatus.value = 'nomore'
+  })
+}
+
+// 搜索框失焦
+function searchBlur() {
+  listData.value = []
+  pageNum.value = 1
+  getList()
+}
+
+// 选择状态
+function selectStatus(item) {
+  statusList.value.forEach(v => v.selected = false)
+  item.selected = !item.selected
+  queryParams.status = item.dictValue
+}
+
+// 搜索提交
+function searchSubmit() {
+  listData.value = []
+  pageNum.value = 1
+  filterPanel.value = false
+  getList()
+}
+
+// 重置查询
+function resetQuery() {
+  queryParams.dictLabel = undefined
+  queryParams.status = undefined
+  listData.value = []
+  pageNum.value = 1
+  statusList.value.forEach(v => v.selected = false)
+  filterPanel.value = false
+  getList()
+}
+
+// 上拉加载
+function loadmore() {
+  pageNum.value += 1
+  if (loadStatus.value == 'loadmore') {
+    getList()
+  }
+}
+
+// 新增
+function handleAdd() {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dictData/addEdit?dictType=${dictType.value}`
+  })
+}
+
+// 编辑
+function handleUpdate(row) {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dictData/addEdit?dictCode=${row.dictCode}`
+  })
+}
+
+// 删除
+function handleDelete(row) {
+  modal.confirm('是否确认删除字典编码为"' + row.dictCode + '"的数据项？').then(() => {
+    return delData(row.dictCode)
+  }).then(() => {
+    listData.value = []
+    pageNum.value = 1
+    getList()
+    modal.msgSuccess('删除成功')
+  }).catch(() => {})
+}
+
+// 进入详情
+function enterDetails(item) {
+  isShow.value = true
+  uni.navigateTo({
+    url: `/pages_mine/pages/system/dictData/details?dictCode=${item.dictCode}`
+  })
+}
+
+// 字典翻译
+function dictStr(value, list) {
+  const item = list.find(v => v.dictValue === value)
+  return item ? item.dictLabel : value
+}
+</script>
+
+<style lang="scss" scoped>
+page {
+  height: 100%;
+  overflow: auto;
+}
+
+.container {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+}
+
+.search-view {
+  display: flex;
+  flex-direction: column;
+  padding: 20rpx 24rpx;
+  background-color: #ffffff;
+  position: relative;
+  gap: 16rpx;
+
+  .dict-name-row {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 16rpx;
+    padding: 0 24rpx;
+    
+    .divider-line {
+      flex: 1;
+      height: 2rpx;
+      background: linear-gradient(to right, transparent, #667eea, transparent);
+    }
+    
+    .dict-name-text {
+      padding: 0 24rpx;
+      white-space: nowrap;
+      
+      text {
+        color: #667eea;
+        font-size: 26rpx;
+        font-weight: 600;
+        letter-spacing: 1rpx;
+      }
+    }
+  }
+  
+  .search-row {
+    display: flex;
+    align-items: center;
+    gap: 16rpx;
+  }
+
+  .search-input {
+    background: rgba(102, 126, 234, 0.08);
+    color: #333333;
+    flex: 1;
+    min-width: 0;
+    margin-right: 16rpx;
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    height: 66rpx !important;
+    display: flex;
+    align-items: center;
+  }
+
+  .filter-btn {
+    display: flex;
+    align-items: center;
+    gap: 6rpx;
+    padding: 12rpx 24rpx;
+    background: rgba(102, 126, 234, 0.08);
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    transition: all 0.3s ease;
+    flex-shrink: 0;
+    
+    &:active {
+      transform: scale(0.95);
+      background: rgba(102, 126, 234, 0.12);
+    }
+    
+    text {
+      color: #667eea;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+    
+    uni-icons {
+      color: #667eea;
+    }
+  }
+  
+  .add-btn {
+    display: flex;
+    align-items: center;
+    gap: 6rpx;
+    padding: 12rpx 24rpx;
+    background: rgba(102, 126, 234, 0.08);
+    border-radius: 24rpx;
+    border: 2rpx solid rgba(102, 126, 234, 0.3);
+    transition: all 0.3s ease;
+    flex-shrink: 0;
+    margin-left: 10rpx;
+    
+    &:active {
+      transform: scale(0.95);
+      background: rgba(102, 126, 234, 0.12);
+    }
+    
+    text {
+      color: #667eea;
+      font-size: 28rpx;
+      font-weight: 600;
+    }
+    
+    uni-icons {
+      color: #667eea;
+    }
+  }
+
+  .filter-panel {
+    position: absolute;
+    top: 100rpx;
+    left: 0;
+    right: 0;
+    background-color: #ffffff;
+    z-index: 999;
+    display: flex;
+    flex-direction: column;
+    box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
+
+    .filter-panel-content {
+      flex: 1;
+      padding: 32rpx;
+      overflow-y: auto;
+
+      .filter-title {
+        font-size: 28rpx;
+        font-weight: bold;
+        margin: 32rpx 0 24rpx 0;
+        color: #303133;
+
+        &:first-child {
+          margin-top: 0;
+        }
+      }
+
+      .state-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 16rpx;
+
+        .state-item {
+          padding: 16rpx 32rpx;
+          background-color: #f5f5f5;
+          border-radius: 32rpx;
+          font-size: 28rpx;
+          color: #606266;
+
+          &.active {
+            background-color: #667eea;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+
+    .btn-box {
+      display: flex;
+      padding: 24rpx 32rpx;
+      border-top: 1rpx solid #f0f0f0;
+
+      .btn-reset,
+      .btn-confirm {
+        flex: 1;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 20rpx 0;
+        border-radius: 32rpx;
+        font-size: 28rpx;
+
+        text {
+          margin-left: 12rpx;
+        }
+      }
+
+      .btn-reset {
+        background-color: #f5f5f5;
+        color: #909399;
+        margin-right: 16rpx;
+      }
+
+      .btn-confirm {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: #ffffff;
+      }
+    }
+  }
+}
+
+.list-item {
+  margin: 10rpx 24rpx;
+  background-color: #fff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
+  transition: all 0.2s ease;
+  
+  &:active {
+    transform: scale(0.98);
+    box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.06);
+  }
+
+  .item-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 16rpx 24rpx;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    
+    .card-name-section {
+      display: flex;
+      align-items: center;
+      flex: 1;
+      min-width: 0;
+      margin-right: 16rpx;
+    }
+    
+    .card-icon {
+      width: 40rpx;
+      height: 40rpx;
+      background: rgba(255, 255, 255, 0.25);
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-right: 12rpx;
+      flex-shrink: 0;
+    }
+    
+    .card-info {
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      gap: 4rpx;
+      
+      .card-name {
+        display: flex;
+        align-items: center;
+        gap: 160rpx;
+        color: #ffffff;
+        font-size: 26rpx;
+        font-weight: 600;
+        line-height: 1.2;
+        
+        .label-text {
+          color: #ffffff;
+        }
+        
+        .value-text {
+          color: rgba(255, 255, 255, 0.85);
+        }
+      }
+      
+      .card-code {
+        color: rgba(255, 255, 255, 0.85);
+        font-size: 22rpx;
+        font-weight: 400;
+        line-height: 1;
+      }
+    }
+    
+    .balance-section {
+      display: flex;
+      align-items: center;
+      flex-shrink: 0;
+      white-space: nowrap;
+      
+      .status-tag {
+        padding: 8rpx 20rpx;
+        border-radius: 20rpx;
+        font-size: 22rpx;
+        font-weight: 500;
+
+        &.status-normal {
+          background-color: rgba(82, 196, 26, 0.2);
+          color: #ffffff;
+        }
+
+        &.status-disabled {
+          background-color: rgba(255, 77, 79, 0.2);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+
+  .card-body {
+    padding: 24rpx;
+    background: #fff;
+  }
+
+  .info-row {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 24rpx;
+    margin-bottom: 0;
+
+    .info-item {
+      flex: 0 0 calc(50% - 12rpx);
+      display: flex;
+      flex-direction: column;
+      gap: 4rpx;
+      min-width: 0;
+      margin-bottom: -5rpx;
+      
+      &.info-item-full {
+        flex: 0 0 100%;
+      }
+
+      .info-label {
+        font-size: 24rpx;
+        color: #667eea;
+        font-weight: 500;
+        background: rgba(102, 126, 234, 0.08);
+        padding: 6rpx 12rpx;
+        border-radius: 8rpx;
+        align-self: flex-start;
+      }
+
+      .info-value {
+        font-size: 26rpx;
+        color: #333;
+        font-weight: 500;
+        flex: 1;
+        line-height: 1.5;
+        word-break: break-all;
+      }
+      
+      &:not(.info-item-full) .info-value {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+  }
+
+  .operate {
+    display: flex;
+    justify-content: flex-end;
+    padding: 16rpx 24rpx 24rpx;
+    gap: 8rpx;
+    flex-wrap: nowrap;
+
+    .btn-edit,
+    .btn-delete {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 4rpx;
+      padding: 0 14rpx;
+      height: 60rpx;
+      border-radius: 10rpx;
+      font-size: 24rpx;
+      font-weight: 500;
+      transition: all 0.3s ease;
+      white-space: nowrap;
+      flex-shrink: 0;
+      
+      &:active {
+        transform: scale(0.95);
+      }
+    }
+    
+    .btn-edit {
+      background: rgba(102, 126, 234, 0.1);
+      color: #667eea;
+      border: 1rpx solid rgba(102, 126, 234, 0.3);
+    }
+    
+    .btn-delete {
+      background: rgba(245, 87, 108, 0.1);
+      color: #f5576c;
+      border: 1rpx solid rgba(245, 87, 108, 0.3);
+    }
+  }
+}
+</style>
diff --git a/src/pages_mine/pages/system/index.vue b/src/pages_mine/pages/system/index.vue
new file mode 100644
index 0000000..9d8e89f
--- /dev/null
+++ b/src/pages_mine/pages/system/index.vue
@@ -0,0 +1,137 @@
+<template>
+  <view class="content">
+    <!-- 系统管理 -->
+    <view class="section-header">
+      <text class="section-title">系统管理</text>
+    </view>
+    <view class="grid-body">
+      <view class="grid-wrapper">
+        <view 
+          v-for="(item, index) in systemGridList" 
+          :key="index" 
+          @click="navigateTo(item.path)"
+          class="grid-item">
+          <view class="item-icon" :style="{ background: item.color }">
+            <uni-icons :type="item.icon" size="22" color="#ffffff"></uni-icons>
+          </view>
+          <text class="item-text">{{ item.text }}</text>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from "vue";
+
+const systemGridList = ref([
+  { path: '/pages/system/user/index', text: '用户管理', icon: 'person', color: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' },
+  { path: '/pages/system/role/index', text: '角色管理', icon: 'staff', color: 'linear-gradient(135deg, #fa709a 0%, #fee140 100%)' },
+  { path: '/pages/system/menu/index', text: '菜单管理', icon: 'list', color: 'linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)' },
+  { path: '/pages/system/dept/index', text: '部门管理', icon: 'chat', color: 'linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)' },
+  { path: '/pages/system/post/index', text: '岗位管理', icon: 'contact', color: 'linear-gradient(135deg, #fd79a8 0%, #e84393 100%)' },
+  { path: '/pages_mine/pages/system/dict/list', text: '字典管理', icon: 'bars', color: 'linear-gradient(135deg, #f6d365 0%, #fda085 100%)' },
+  { path: '/pages/system/config/index', text: '参数设置', icon: 'gear', color: 'linear-gradient(135deg, #5f72bd 0%, #9b23ea 100%)' },
+  { path: '/pages/system/notice/index', text: '通知公告', icon: 'notification', color: 'linear-gradient(135deg, #0be881 0%, #0fbcf9 100%)' },
+  { path: '/pages/system/job/index', text: '定时任务', icon: 'calendar', color: 'linear-gradient(135deg, #6366f1 0%, #a855f7 100%)' },
+  { path: '/pages/system/log/operlog/index', text: '操作日志', icon: 'compose', color: 'linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%)' },
+  { path: '/pages/system/log/logininfor/index', text: '登录日志', icon: 'eye', color: 'linear-gradient(135deg, #00d2ff 0%, #3a7bd5 100%)' }
+])
+
+function navigateTo(path) {
+  // 字典管理已开发完成,可以跳转
+  if (path === '/pages_mine/pages/system/dict/list') {
+    uni.navigateTo({
+      url: path
+    });
+  } else {
+    uni.showToast({
+      title: '功能开发中',
+      icon: 'none',
+      duration: 2000
+    });
+  }
+}
+</script>
+
+<style lang="scss">
+  .container {
+    min-height: 100vh;
+    background-color: #f5f5f5;
+  }
+
+  /* #ifndef APP-NVUE */
+  /* #endif */
+
+  .content {
+    padding: 12rpx 0;
+  }
+
+  .section-header {
+    padding: 12rpx 24rpx 8rpx;
+  }
+
+  .section-title {
+    font-size: 28rpx;
+    font-weight: 700;
+    color: #333;
+    position: relative;
+    padding-left: 16rpx;
+  }
+
+  .section-title::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 50%;
+    transform: translateY(-50%);
+    width: 6rpx;
+    height: 28rpx;
+    background: linear-gradient(135deg, #667eea, #764ba2);
+    border-radius: 3rpx;
+  }
+
+  .grid-body {
+    padding: 0 16rpx;
+  }
+
+  .grid-wrapper {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .grid-item {
+    width: 25%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 16rpx 8rpx;
+    box-sizing: border-box;
+  }
+
+  .item-icon {
+    width: 80rpx;
+    height: 80rpx;
+    border-radius: 20rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 12rpx;
+    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
+    transition: all 0.3s;
+  }
+
+  .grid-item:active .item-icon {
+    transform: scale(0.95);
+    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.15);
+  }
+
+  .item-text {
+    text-align: center;
+    font-size: 22rpx;
+    color: #333;
+    font-weight: 500;
+    line-height: 1.3;
+  }
+</style>