From 39a1165908577a3f45be5457d3460d2a96b2f99a Mon Sep 17 00:00:00 2001
From: Echo <1711788888@qq.com>
Date: Mon, 8 Dec 2025 19:28:04 +0800
Subject: [PATCH] =?UTF-8?q?:art:=20=E6=96=B0=E5=A2=9Eip=E6=A3=80=E6=B5=8B?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=E6=A8=A1=E5=9D=97=EF=BC=8C=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E6=94=AF=E4=BB=98=E9=85=8D=E7=BD=AE=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                                   |   2 +
 src/api/payConfig/index.js                   |  63 +++
 src/api/user/index.js                        |  27 +
 src/components/richtext/rich-edit.vue.backup | 556 +++++++++++++++++++
 src/config.js                                |  10 +-
 src/router/index.js                          |  18 +
 src/view/goods/article/edit.vue.backup       | 355 ++++++++++++
 src/view/payConfig/index.vue                 | 476 ++++++++++++++++
 src/view/system/ipConfig.vue                 | 358 ++++++++++++
 9 files changed, 1864 insertions(+), 1 deletion(-)
 create mode 100644 src/api/payConfig/index.js
 create mode 100644 src/components/richtext/rich-edit.vue.backup
 create mode 100644 src/view/goods/article/edit.vue.backup
 create mode 100644 src/view/payConfig/index.vue
 create mode 100644 src/view/system/ipConfig.vue

diff --git a/.gitignore b/.gitignore
index e726301..873815c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,3 +5,5 @@ bun.lockb
 config.yaml
 .idea
 dist
+.claude
+.vscode
\ No newline at end of file
diff --git a/src/api/payConfig/index.js b/src/api/payConfig/index.js
new file mode 100644
index 0000000..6af0e57
--- /dev/null
+++ b/src/api/payConfig/index.js
@@ -0,0 +1,63 @@
+import service from '@/utils/request'
+
+// 获取支付配置列表
+export const list = (params) => {
+  return service({
+    url: '/payConfig/list',
+    method: 'get',
+    params
+  })
+}
+
+// 获取单个支付配置详情
+export const detail = (id) => {
+  return service({
+    url: `/payConfig/${id}`,
+    method: 'get'
+  })
+}
+
+// 获取启用的支付配置（按编码）
+export const getEnabled = (params) => {
+  return service({
+    url: '/payConfig/enabled',
+    method: 'get',
+    params
+  })
+}
+
+// 创建支付配置
+export const createPayConfig = (data) => {
+  return service({
+    url: '/payConfig',
+    method: 'post',
+    data
+  })
+}
+
+// 更新支付配置
+export const updatePayConfig = (data) => {
+  return service({
+    url: '/payConfig',
+    method: 'put',
+    data
+  })
+}
+
+// 删除支付配置
+export const removePayConfig = (id) => {
+  return service({
+    url: `/payConfig/${id}`,
+    method: 'delete'
+  })
+}
+
+// 切换启用状态
+export const togglePayConfig = (data) => {
+  return service({
+    url: '/payConfig/toggle',
+    method: 'post',
+    data
+  })
+}
+
diff --git a/src/api/user/index.js b/src/api/user/index.js
index 87f561f..db62f7d 100644
--- a/src/api/user/index.js
+++ b/src/api/user/index.js
@@ -123,3 +123,30 @@ export const setTeacherRate = (data) => {
   })
 }
 
+// =============IP检测相关=================
+export const getIpCon = () => {
+  return service({
+    url: '/app_user/ipCon',
+    method: 'get',
+  })
+}
+export const setIpCon = (data) => {
+  return service({
+    url: '/app_user/ipCon',
+    method: 'put',
+    data
+  })
+}
+export const setIpStatus = (data) => {
+  return service({
+    url: '/app_user/ipStatus',
+    method: 'put',
+    data
+  })
+}
+export const getIpStatus = () => {
+  return service({
+    url: '/app_user/ipStatus',
+    method: 'get',
+  })
+}
\ No newline at end of file
diff --git a/src/components/richtext/rich-edit.vue.backup b/src/components/richtext/rich-edit.vue.backup
new file mode 100644
index 0000000..f1349dd
--- /dev/null
+++ b/src/components/richtext/rich-edit.vue.backup
@@ -0,0 +1,556 @@
+<template>
+  <div class="rich-edit-wrapper border border-solid border-gray-100 h-full">
+    <Toolbar
+      :editor="editorRef"
+      :default-config="toolbarConfig"
+      mode="default"
+    />
+    <Editor
+      v-model="valueHtml"
+      class="overflow-y-hidden mt-0.5"
+      style="min-height: 25rem; height: 400px;"
+      :default-config="editorConfig"
+      mode="default"
+      @onCreated="handleCreated"
+      @onChange="change"
+    />
+  </div>
+</template>
+
+<script setup>
+  import '@wangeditor/editor/dist/css/style.css' // 引入 css
+
+  const basePath = import.meta.env.VITE_BASE_API
+
+  import { onBeforeUnmount, ref, shallowRef, watch, computed } from 'vue'
+  import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
+
+  import { ElMessage } from 'element-plus'
+  import { getUrl } from '@/utils/image'
+  import botLogo from '@/assets/bot_logo.png'
+  import { useUserStore } from '@/pinia/modules/user'
+
+  const emits = defineEmits(['change', 'update:modelValue'])
+
+  const change = (editor) => {
+    emits('change', editor)
+    emits('update:modelValue', valueHtml.value)
+  }
+
+  const props = defineProps({
+    modelValue: {
+      type: String,
+      default: ''
+    },
+    useWatermark: {
+      type: Boolean,
+      default: false
+    }
+  })
+
+  // 调试：监听 props 变化
+  watch(() => props.useWatermark, (newVal) => {
+    console.log('useWatermark prop changed to:', newVal)
+  }, { immediate: true })
+
+  const editorRef = shallowRef()
+  const valueHtml = ref('')
+  const userStore = useUserStore()
+
+  const toolbarConfig = {}
+
+  // 创建自定义上传函数，直接检查当前 props 值
+  const createCustomUpload = () => {
+    return async (file, insertFn) => {
+      // 直接获取当前的 props.useWatermark 值
+      const shouldUseWatermark = props.useWatermark
+      console.log('customUpload called, useWatermark:', shouldUseWatermark)
+      console.log('props.useWatermark:', props.useWatermark)
+
+      // 未开启水印则直接上传原图
+      if (!shouldUseWatermark) {
+        const formData = new FormData()
+        formData.append('file', file)
+        const resp = await fetch(basePath + '/fileUploadAndDownload/upload?noSave=1', {
+          method: 'POST',
+          body: formData,
+          headers: {
+            'x-token': userStore.token,
+            'x-user-id': userStore.userInfo.ID
+          }
+        })
+        const res = await resp.json()
+        if (res.code === 0) {
+          const urlPath = getUrl(res.data.file.url)
+          insertFn(urlPath, res.data.file.name)
+        } else {
+          ElMessage.error(res.msg || '上传失败')
+        }
+        return
+      }
+      try {
+        console.log('开始添加水印，文件:', file.name)
+        const watermarkedBlob = await addBottomWatermark(file, {
+          stripRatio: 0.18, // 水印条高度占原图高度比例
+          background: 'rgba(255,255,255,0.96)',
+          text: '好运助手',
+          textColor: '#333',
+          fontFamily: 'PingFang SC, Microsoft YaHei, Arial',
+          logo: botLogo
+        })
+        console.log('水印处理完成，新文件大小:', watermarkedBlob.size)
+
+        const newFile = new File([watermarkedBlob], file.name, { type: watermarkedBlob.type || file.type })
+        const formData = new FormData()
+        formData.append('file', newFile)
+        const resp = await fetch(basePath + '/fileUploadAndDownload/upload?noSave=1', {
+          method: 'POST',
+          body: formData,
+          headers: {
+            'x-token': userStore.token,
+            'x-user-id': userStore.userInfo.ID
+          }
+        })
+        const res = await resp.json()
+        if (res.code === 0) {
+          const urlPath = getUrl(res.data.file.url)
+          insertFn(urlPath, res.data.file.name)
+        } else {
+          ElMessage.error(res.msg || '上传失败')
+        }
+      } catch {
+        ElMessage.error('处理水印失败')
+        // 降级：直接走原图上传
+        const formData = new FormData()
+        formData.append('file', file)
+        const resp = await fetch(basePath + '/fileUploadAndDownload/upload?noSave=1', { method: 'POST', body: formData })
+        const res = await resp.json()
+        if (res.code === 0) {
+          const urlPath = getUrl(res.data.file.url)
+          insertFn(urlPath, res.data.file.name)
+        } else {
+          ElMessage.error(res.msg || '上传失败')
+        }
+      }
+    }
+  }
+
+  // 将 editorConfig 改为计算属性，使其响应 props 变化
+  const editorConfig = computed(() => ({
+    showFullScreen: true,
+    placeholder: '请输入内容...',
+    MENU_CONF: {
+      uploadImage: {
+        server: basePath + '/fileUploadAndDownload/upload?noSave=1',
+        fieldName: 'file',
+        maxFileSize: 1024 * 1024 * 10, // 限制图片大小为10MB
+        maxNumberOfFiles: 1,
+        customUpload: createCustomUpload(),
+        customInsert(res, insertFn) {
+          if (res.code === 0) {
+            const urlPath = getUrl(res.data.file.url)
+            insertFn(urlPath, res.data.file.name)
+            return
+          }
+          ElMessage.error(res.msg)
+        }
+      },
+      uploadVideo: {
+        server: basePath + '/fileUploadAndDownload/upload?noSave=1',
+        fieldName: 'file',
+        maxFileSize: 1024 * 1024 * 100, // 限制视频大小为100MB
+        maxNumberOfFiles: 1,
+        customInsert(res, insertFn) {
+          if (res.code === 0) {
+            const urlPath = getUrl(res.data.file.url)
+            insertFn(urlPath, res.data.file.name)
+            return
+          }
+          ElMessage.error(res.msg)
+        }
+      }
+    }
+  }))
+
+  // 组件销毁时，也及时销毁编辑器
+  onBeforeUnmount(() => {
+    const editor = editorRef.value
+    if (editor == null) return
+    editor.destroy()
+  })
+
+  const handleCreated = (editor) => {
+    editorRef.value = editor
+    valueHtml.value = props.modelValue
+
+    // 动态更新上传配置
+    if (editor && editor.getConfig) {
+      const config = editor.getConfig()
+      if (config.MENU_CONF && config.MENU_CONF.uploadImage) {
+        config.MENU_CONF.uploadImage.customUpload = createCustomUpload()
+      }
+    }
+
+    // 修复点击区域问题
+    setTimeout(() => {
+      const editorContainer = editor.getEditableContainer()
+      if (editorContainer) {
+        // 确保整个编辑器区域都可以点击
+        editorContainer.style.cursor = 'text'
+        editorContainer.style.minHeight = '300px'
+
+        // 添加点击事件监听器
+        editorContainer.addEventListener('click', (e) => {
+          if (e.target === editorContainer) {
+            // 如果点击的是容器本身，聚焦到编辑器
+            editor.focus()
+          }
+        })
+      }
+    }, 100)
+  }
+
+  watch(
+    () => props.modelValue,
+    () => {
+      valueHtml.value = props.modelValue
+    }
+  )
+
+  // 监听 useWatermark 变化，动态更新编辑器配置
+  watch(
+    () => props.useWatermark,
+    () => {
+      if (editorRef.value && editorRef.value.getConfig) {
+        const config = editorRef.value.getConfig()
+        if (config.MENU_CONF && config.MENU_CONF.uploadImage) {
+          config.MENU_CONF.uploadImage.customUpload = createCustomUpload()
+        }
+      }
+    }
+  )
+
+  async function addBottomWatermark(file, options) {
+    console.log('addBottomWatermark 开始处理，文件:', file.name, '大小:', file.size)
+    const { stripRatio = 0.18, background = 'rgba(255,255,255,0.96)', text = '', textColor = '#333', fontFamily = 'Arial', logo } = options || {}
+
+    const img = await fileToImage(file)
+    const width = img.naturalWidth || img.width
+    const height = img.naturalHeight || img.height
+    const stripHeight = Math.max(60, Math.floor(height * stripRatio))
+    console.log('图片尺寸:', width, 'x', height, '水印条高度:', stripHeight)
+
+    const canvas = document.createElement('canvas')
+    canvas.width = width
+    canvas.height = height + stripHeight
+    const ctx = canvas.getContext('2d')
+
+    // 原图
+    ctx.drawImage(img, 0, 0, width, height)
+
+    // 底部水印条背景
+    ctx.fillStyle = background
+    ctx.fillRect(0, height, width, stripHeight)
+
+    // 左侧 Logo（可选）
+    let logoSize = Math.floor(stripHeight * 0.6)
+    let logoPadding = Math.floor(stripHeight * 0.2)
+    if (logo) {
+      try {
+        const logoImg = await srcToImage(logo)
+        const ratio = logoImg.width / logoImg.height
+        const drawW = logoSize
+        const drawH = Math.floor(drawW / ratio)
+        const y = height + Math.floor((stripHeight - drawH) / 2)
+        ctx.drawImage(logoImg, logoPadding, y, drawW, drawH)
+      } catch { void 0 }
+    }
+
+    // 右侧文字
+    ctx.fillStyle = textColor
+    const fontSize = Math.floor(stripHeight * 0.38)
+    ctx.font = `${fontSize}px ${fontFamily}`
+    ctx.textBaseline = 'middle'
+    ctx.textAlign = 'right'
+    const textPadding = Math.floor(stripHeight * 0.25)
+    ctx.fillText(text, width - textPadding, height + Math.floor(stripHeight / 2))
+
+    const blob = await canvasToBlob(canvas, file.type || 'image/png')
+    return blob
+  }
+
+  function fileToImage(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader()
+      reader.onload = () => {
+        const img = new Image()
+        img.onload = () => {
+          console.log('图片加载成功，尺寸:', img.naturalWidth, 'x', img.naturalHeight)
+          resolve(img)
+        }
+        img.onerror = (error) => {
+          console.error('图片加载失败:', error)
+          reject(error)
+        }
+        img.src = reader.result
+      }
+      reader.onerror = (error) => {
+        console.error('文件读取失败:', error)
+        reject(error)
+      }
+      reader.readAsDataURL(file)
+    })
+  }
+
+  function srcToImage(src) {
+    return new Promise((resolve, reject) => {
+      const img = new Image()
+      img.crossOrigin = 'anonymous'
+      img.onload = () => {
+        console.log('Logo 加载成功，尺寸:', img.naturalWidth, 'x', img.naturalHeight)
+        resolve(img)
+      }
+      img.onerror = (error) => {
+        console.error('Logo 加载失败:', error, 'src:', src)
+        reject(error)
+      }
+      img.src = src
+    })
+  }
+
+  function canvasToBlob(canvas, mime) {
+    return new Promise((resolve) => {
+      if (canvas.toBlob) {
+        canvas.toBlob((blob) => {
+          console.log('Canvas 转 Blob 成功，大小:', blob.size, '类型:', blob.type)
+          resolve(blob)
+        }, mime, 0.92)
+      } else {
+        // 兼容处理
+        const dataURL = canvas.toDataURL(mime)
+        const arr = dataURL.split(',')
+        const bstr = atob(arr[1])
+        let n = bstr.length
+        const u8arr = new Uint8Array(n)
+        while (n--) u8arr[n] = bstr.charCodeAt(n)
+        const blob = new Blob([u8arr], { type: mime })
+        console.log('Canvas 转 Blob (兼容模式) 成功，大小:', blob.size, '类型:', blob.type)
+        resolve(blob)
+      }
+    })
+  }
+</script>
+
+<style scoped lang="scss">
+// 确保富文本编辑器的点击区域
+:deep(.w-e-text-container) {
+  min-height: 300px !important;
+  cursor: text !important;
+}
+
+:deep(.w-e-scroll) {
+  min-height: 300px !important;
+  cursor: text !important;
+}
+
+:deep(.w-e-text-placeholder) {
+  pointer-events: none;
+}
+
+// 确保整个编辑器区域都可以点击
+:deep(.w-e-text-container .w-e-scroll) {
+  cursor: text !important;
+}
+
+// 修复编辑器内容区域的点击问题
+:deep(.w-e-text-container .w-e-scroll .w-e-text) {
+  min-height: 300px !important;
+  cursor: text !important;
+}
+
+// 全屏关闭按钮样式
+.fullscreen-close-btn {
+  position: fixed !important;
+  top: 20px !important;
+  right: 20px !important;
+  z-index: 100000 !important; // 确保在最上层
+  display: flex !important;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 20px;
+  background: rgba(0, 0, 0, 0.85) !important;
+  color: white !important;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 14px;
+  transition: all 0.3s;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
+  font-weight: 500;
+  pointer-events: auto !important;
+
+  &:hover {
+    background: rgba(0, 0, 0, 0.95) !important;
+    transform: translateY(-2px);
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
+  }
+
+  .el-icon {
+    font-size: 18px;
+  }
+}
+</style>
+
+<style lang="scss">
+// 全局样式：全屏模式下隐藏其他元素
+body.editor-fullscreen-mode {
+  overflow: hidden !important;
+
+  // 隐藏顶层主要容器
+  .gva-header {
+    display: none !important;
+  }
+
+  .gva-aside {
+    display: none !important;
+  }
+
+  .gva-tabs {
+    display: none !important;
+  }
+
+  // 隐藏页面内容区域中不包含全屏编辑器的元素
+  // 使用 :has() 选择器（现代浏览器都支持）
+  .gva-container:not(:has(.w-e-full-screen-editor)),
+  .gva-container2:not(:has(.w-e-full-screen-editor)) {
+    display: none !important;
+  }
+
+  // 隐藏容器包装器（如果不包含全屏编辑器）
+  .container-wrapper:not(:has(.w-e-full-screen-editor)) {
+    display: none !important;
+  }
+
+  // 在包含全屏编辑器的容器内，隐藏其他元素
+  .el-form:has(.w-e-full-screen-editor) {
+    // 让表单占满全屏
+    position: fixed !important;
+    top: 0 !important;
+    left: 0 !important;
+    right: 0 !important;
+    bottom: 0 !important;
+    width: 100vw !important;
+    height: 100vh !important;
+    z-index: 9998 !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    background: #fff !important;
+    overflow: hidden !important;
+  }
+
+  // 隐藏 ColumnItem 中不包含全屏编辑器的内容
+  .column-item:has(.w-e-full-screen-editor) {
+    width: 100% !important;
+    height: 100% !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    border-radius: 0 !important;
+
+    // 隐藏 ColumnItem 的标题
+    > *:not(.cont) {
+      display: none !important;
+    }
+
+    // 让 .cont 占满空间
+    > .cont {
+      width: 100% !important;
+      height: 100% !important;
+      margin: 0 !important;
+      padding: 0 !important;
+    }
+  }
+
+  // 隐藏不包含全屏编辑器的 ColumnItem
+  .column-item:not(:has(.w-e-full-screen-editor)) {
+    display: none !important;
+  }
+
+  // 隐藏 el-row 中不包含全屏编辑器的内容
+  .el-row:has(.w-e-full-screen-editor) {
+    width: 100% !important;
+    height: 100% !important;
+    margin: 0 !important;
+
+    // 隐藏其他 el-row
+    & ~ .el-row {
+      display: none !important;
+    }
+  }
+
+  .el-row:not(:has(.w-e-full-screen-editor)) {
+    display: none !important;
+  }
+
+  // el-col 处理
+  .el-col:has(.w-e-full-screen-editor) {
+    width: 100% !important;
+    height: 100% !important;
+    margin: 0 !important;
+    padding: 0 !important;
+  }
+
+  // el-form-item 处理
+  .el-form-item:has(.w-e-full-screen-editor) {
+    // 隐藏 label
+    .el-form-item__label {
+      display: none !important;
+    }
+
+    // 确保 form-item 占满全屏
+    width: 100% !important;
+    height: 100% !important;
+    margin: 0 !important;
+    padding: 0 !important;
+
+    .el-form-item__content {
+      width: 100% !important;
+      height: 100% !important;
+      margin: 0 !important;
+      padding: 0 !important;
+    }
+  }
+
+  .el-form-item:not(:has(.w-e-full-screen-editor)) {
+    display: none !important;
+  }
+
+  // 隐藏底部按钮区域
+  .footer-box {
+    display: none !important;
+  }
+
+  // 确保全屏编辑器正确显示
+  .w-e-full-screen-editor {
+    position: fixed !important;
+    top: 0 !important;
+    left: 0 !important;
+    right: 0 !important;
+    bottom: 0 !important;
+    width: 100vw !important;
+    height: 100vh !important;
+    z-index: 99999 !important;
+    background: #fff !important;
+    margin: 0 !important;
+    padding: 0 !important;
+    display: flex !important;
+    flex-direction: column !important;
+  }
+
+  // 确保全屏关闭按钮始终可见
+  .fullscreen-close-btn {
+    z-index: 100000 !important;
+    display: flex !important;
+    visibility: visible !important;
+    opacity: 1 !important;
+  }
+}
+</style>
diff --git a/src/config.js b/src/config.js
index 1f8b90e..f62c200 100644
--- a/src/config.js
+++ b/src/config.js
@@ -393,7 +393,13 @@ export const LOGIN_LOG_SEARCH_CONFIG = [
     prop: 'user_name',
     label: '用户名称',
     placeholder: '请输入用户名称',
-  }
+  },
+  {
+    type: 'input',
+    prop: 'ip',
+    label: '登录IP',
+    placeholder: '请输入登录IP地址',
+  },
 ]
 
 // 用户登录日志表格配置
@@ -537,7 +543,9 @@ export const USER_TABLE_CONFIG = {
 
 // 文章列表
 export const ARTICLE_TABLE_CONFIG = {
+  select: true,
   index: true,
+  rowKey: 'ID',
   schemes: [
     {
       attrs: {
diff --git a/src/router/index.js b/src/router/index.js
index dbb799b..bd50fca 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -33,6 +33,24 @@ const routes = [
     },
     component: () => import('@/view/example/upload/scanUpload.vue')
   },
+  {
+    path: '/ipConfig',
+    name: 'IpConfig',
+    meta: {
+      title: 'IP检测配置',
+      keepAlive: true
+    },
+    component: () => import('@/view/system/ipConfig.vue')
+  },
+  {
+    path: '/cdkManagement',
+    name: 'CdkManage',
+    meta: {
+      title: '兑换码管理',
+      keepAlive: true
+    },
+    component: () => import('@/view/cdk/cdkManage.vue')
+  },
   {
     path: '/:catchAll(.*)',
     meta: {
diff --git a/src/view/goods/article/edit.vue.backup b/src/view/goods/article/edit.vue.backup
new file mode 100644
index 0000000..ad0820c
--- /dev/null
+++ b/src/view/goods/article/edit.vue.backup
@@ -0,0 +1,355 @@
+<template>
+  <div class="container-wrapper">
+    <el-form
+      ref="ruleFormRef"
+      :model="formData"
+      :rules="rules"
+      label-width="auto"
+      style="margin-top: 0.5rem; "
+    >
+      <ColumnItem title="文章编辑">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="标题" prop="title">
+              <el-input v-model="formData.title" placeholder="请输入文章标题" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="分类" prop="categoryId">
+              <el-select v-model="formData.categoryId" placeholder="请选择文章分类" clearable style="width: 100%">
+                <el-option
+                  v-for="item in articleCategoryList"
+                  :key="item.ID"
+                  :label="item.name"
+                  :value="item.ID"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="讲师" prop="teacherId">
+              <el-input v-model="formData.teacherName" readonly placeholder="点击选择讲师" @click="() => userDialogRef.open()" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="是否免费" prop="isFree">
+              <el-radio-group v-model="formData.isFree">
+                <el-radio :label="1">免费</el-radio>
+                <el-radio :label="0">付费</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20" v-if="formData.isFree === 0">
+          <el-col :span="12">
+            <el-form-item label="价格(元)" prop="price">
+              <el-input v-model="formData.price" type="number" placeholder="请输入价格，单位：元" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="24">
+            <el-form-item label="封面图片" prop="coverImg">
+              <SelectImage v-model="formData.coverImg" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 文章介绍（放在文章详情上方，使用富文本） -->
+        <el-row :gutter="20">
+          <el-col :span="24">
+            <el-form-item label="文章介绍" prop="desc">
+              <RichEdit style="width: 100%" v-model="formData.desc"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="20">
+          <el-col :span="24">
+            <el-form-item label="文章详情" prop="content">
+              <RichEdit style="width: 100%" v-model="formData.content"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 定时发布选项 -->
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="定时发布">
+              <el-switch 
+                v-model="formData.isScheduled" 
+                active-text="启用"
+                inactive-text="禁用"
+                @change="handleScheduledChange"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12" v-if="formData.isScheduled">
+            <el-form-item label="发布时间" prop="publishTime">
+              <el-date-picker
+                v-model="formData.publishTime"
+                type="datetime"
+                placeholder="选择发布时间"
+                format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss"
+                :disabled-date="disabledDate"
+                style="width: 100%"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+      </ColumnItem>
+    </el-form>
+    <div class="gva-table-box footer-box">
+      <el-button @click="$router.back()">返回</el-button>
+      <el-button type="primary" @click="submit(ruleFormRef)">提交</el-button>
+    </div>
+  </div>
+  <!--    选择人员弹窗-->
+  <userChoose
+    ref="userDialogRef"
+    @getRecipientInfo="getStaffInfo"
+    title="讲师人员"
+  />
+</template>
+<script setup>
+  import SelectImage from '@/components/selectImage/selectImage.vue'
+  import {onMounted, ref, computed } from 'vue'
+  import userChoose from '@/components/userChoose/index.vue'
+  import { useRouter, useRoute} from 'vue-router'
+  import { add, detail, edit } from '@/api/goods/index.js'
+  import { getCategoryList } from '@/api/category/category.js'
+  import ColumnItem from '@/components/columnItem/ColumnItem.vue'
+  import { ElMessage } from 'element-plus'
+  import RichEdit from '@/components/richtext/rich-edit.vue'
+  
+  const router = useRouter()
+  const route = useRoute()
+  const userDialogRef = ref()
+  const isEdit = ref(false)
+  const categoryList = ref([])
+
+  const ruleFormRef = ref(null), formData = ref({
+    isFree: 0, // 默认付费
+    price: 0,
+    isScheduled: false, // 定时发布开关
+    publishTime: '' // 发布时间
+  }), rules = ref({
+    title: [
+      { required: true, message: '请输入文章标题', trigger: 'blur' }
+    ],
+    categoryId: [
+      { required: true, message: '请选择文章分类', trigger: 'change' }
+    ],
+    teacherId: [
+      { required: true, message: '请选择讲师', trigger: 'blur' }
+    ],
+    isFree: [
+      { required: true, message: '请选择是否免费', trigger: 'change' }
+    ],
+    price: [
+      { 
+        required: true, 
+        message: '请输入价格', 
+        trigger: 'blur',
+        validator: (rule, value, callback) => {
+          if (formData.value.isFree === 0 && (!value || value <= 0)) {
+            callback(new Error('付费文章请输入大于0的价格'))
+          } else {
+            callback()
+          }
+        }
+      }
+    ],
+    coverImg: [
+      { required: true, message: '请上传封面', trigger: 'blur' }
+    ],
+    // 文章介绍改为富文本，也做必填校验
+    desc: [
+      { required: true, message: '请输入文章介绍', trigger: 'blur' }
+    ],
+    content: [
+      { required: true, message: '请输入文章内容', trigger: 'blur' }
+    ],
+    publishTime: [
+      { 
+        required: true, 
+        message: '请选择发布时间', 
+        trigger: 'change',
+        validator: (rule, value, callback) => {
+          if (formData.value.isScheduled && (!value || value === '')) {
+            callback(new Error('启用定时发布时，请选择发布时间'))
+          } else {
+            callback()
+          }
+        }
+      }
+    ]
+  })
+
+  // 计算属性：筛选出文章分类（url字段为空的分类）
+  const articleCategoryList = computed(() => {
+    return categoryList.value.filter(item => !item.url || item.url === '')
+  })
+
+  onMounted(() => {
+    console.log(route.query.id)
+    getCategoryData()
+    if(route.query.id) {
+      isEdit.value = true
+      getDetail()
+    }
+  })
+
+  // 获取分类数据
+  async function getCategoryData() {
+    try {
+      const res = await getCategoryList()
+      if (res.code === 0) {
+        categoryList.value = res.data.list || []
+      }
+    } catch (error) {
+      console.error('获取分类数据失败:', error)
+    }
+  }
+
+  async function getDetail() {
+    const res = await detail(route.query.id)
+    if(res.code === 0) {
+      formData.value = res.data
+      // 如果数据库存储的是分，转换为元显示
+      if (formData.value.price) {
+        formData.value.price = (formData.value.price / 100).toFixed(2)
+      }
+      // 确保isFree字段有值
+      if (formData.value.isFree === undefined || formData.value.isFree === null) {
+        formData.value.isFree = 0
+      }
+      // 处理定时发布字段
+      if (formData.value.publishTime) {
+        formData.value.isScheduled = true
+      } else {
+        formData.value.isScheduled = false
+        formData.value.publishTime = ''
+      }
+    }
+  }
+  
+  function getStaffInfo(data) {
+    console.log(formData)
+    formData.value.teacherId = data.id
+    formData.value.teacherName = data.nick_name
+  }
+
+  // 处理定时发布开关变化
+  function handleScheduledChange(value) {
+    if (!value) {
+      // 关闭定时发布时，清空发布时间
+      formData.value.publishTime = ''
+    } else {
+      // 开启定时发布时，设置默认发布时间为当前时间
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      const day = String(now.getDate()).padStart(2, '0')
+      const hours = String(now.getHours()).padStart(2, '0')
+      const minutes = String(now.getMinutes()).padStart(2, '0')
+      const seconds = String(now.getSeconds()).padStart(2, '0')
+      formData.value.publishTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+    }
+  }
+
+  // 禁用过去的日期
+  function disabledDate(time) {
+    return time.getTime() < Date.now() - 8.64e7 // 禁用今天之前的日期
+  }
+  
+  function submit(formRef) {
+    if(!formRef) return
+    // 校验
+    formRef.validate(async (valid) => {
+      if(!valid) return
+      let fn = isEdit.value ? edit : add
+      
+      // 处理价格字段
+      if (formData.value.isFree === 1) {
+        // 免费文章，价格设为0
+        formData.value.price = 0
+      } else {
+        // 付费文章，价格转为分（数据库存储单位）
+        if (formData.value.price) {
+          formData.value.price = Math.round(Number(formData.value.price) * 100)
+        }
+      }
+
+      // 处理定时发布参数
+      const submitData = { ...formData.value }
+      if (!submitData.isScheduled) {
+        // 如果未启用定时发布，则不传递publishTime参数
+        delete submitData.publishTime
+      }
+      delete submitData.isScheduled // 移除前端使用的开关字段
+      
+      const res = await fn(submitData)
+      console.log(res)
+      if(res.code === 0) {
+        ElMessage({
+          type: 'success',
+          message: isEdit.value ? '编辑成功' : '添加成功!'
+        })
+        router.back()
+      } else {
+        ElMessage({
+          type: 'error',
+          message: res.msg
+        })
+      }
+    })
+  }
+</script>
+<style lang="scss" scoped>
+  .avatar-uploader .el-upload {
+    border: 1px dashed var(--el-border-color) !important;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+    transition: var(--el-transition-duration-fast);
+  }
+
+  .avatar-uploader .el-upload:hover {
+    border-color: var(--el-color-primary);
+  }
+
+  .el-icon.avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    text-align: center;
+  }
+
+  :deep{
+    .el-row {
+      margin-bottom: 20px;
+    }
+    .el-form{
+      flex: 1;
+      background: white;
+      overflow: hidden;
+    }
+    .el-form-item {
+      margin-bottom: 18px;
+    }
+    .el-form-item__label {
+      font-weight: 500;
+      color: #606266;
+    }
+  }
+</style>
diff --git a/src/view/payConfig/index.vue b/src/view/payConfig/index.vue
new file mode 100644
index 0000000..a69419a
--- /dev/null
+++ b/src/view/payConfig/index.vue
@@ -0,0 +1,476 @@
+<template>
+  <div>
+    <div class="gva-search-box">
+      <el-form :inline="true" :model="searchForm" class="demo-form-inline" @keyup.enter="handleSearch">
+        <el-form-item label="支付名称">
+          <el-input v-model="searchForm.name" placeholder="输入名称" clearable />
+        </el-form-item>
+        <el-form-item label="支付编码">
+          <el-input v-model="searchForm.code" placeholder="输入编码" clearable />
+        </el-form-item>
+        <el-form-item label="支付类型">
+          <el-select v-model="searchForm.type" placeholder="全部" clearable style="width: 160px">
+            <el-option v-for="opt in typeOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="启用状态">
+          <el-select v-model="searchForm.enable" placeholder="全部" clearable style="width: 140px">
+            <el-option label="启用" :value="true" />
+            <el-option label="禁用" :value="false" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="search" @click="handleSearch">查询</el-button>
+          <el-button icon="refresh" @click="handleReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button type="primary" icon="plus" @click="openCreate">新增支付配置</el-button>
+      </div>
+
+      <el-table
+        :data="tableData"
+        v-loading="tableLoading"
+        style="width: 100%"
+        row-key="ID"
+      >
+        <el-table-column prop="ID" label="ID" width="80" />
+        <el-table-column prop="name" label="名称" min-width="180" show-overflow-tooltip />
+        <el-table-column prop="code" label="编码" min-width="160" show-overflow-tooltip />
+        <el-table-column label="类型" width="120">
+          <template #default="{ row }">
+            <el-tag :type="row.type === 'wechat' ? 'success' : 'primary'">
+              {{ formatType(row.type) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="sort" label="排序" width="90" />
+        <el-table-column label="启用" width="110">
+          <template #default="{ row }">
+            <el-switch
+              v-model="row.enable"
+              :loading="row._toggleLoading"
+              active-text="启用"
+              inactive-text="禁用"
+              @change="() => handleToggle(row)"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column prop="remark" label="备注" min-width="200" show-overflow-tooltip />
+        <el-table-column prop="CreatedAt" label="创建时间" width="180">
+          <template #default="{ row }">
+            {{ formatDate(row.CreatedAt) }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" fixed="right" min-width="230">
+          <template #default="{ row }">
+            <el-button link type="primary" @click="openDetail(row)">查看</el-button>
+            <el-button link type="primary" icon="edit" @click="openEdit(row)">编辑</el-button>
+            <el-button link type="danger" icon="delete" @click="handleDelete(row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div class="gva-pagination">
+        <el-pagination
+          layout="total, sizes, prev, pager, next, jumper"
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 20, 50, 100]"
+          :total="total"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+    </div>
+
+    <el-drawer
+      destroy-on-close
+      v-model="formVisible"
+      :size="appStore.drawerSize"
+      :show-close="false"
+      :before-close="closeForm"
+    >
+      <template #header>
+        <div class="flex justify-between items-center">
+          <span class="text-lg">{{ isEdit ? '编辑支付配置' : '新增支付配置' }}</span>
+          <div>
+            <el-button type="primary" :loading="btnLoading" @click="submitForm">确 定</el-button>
+            <el-button @click="closeForm">取 消</el-button>
+          </div>
+        </div>
+      </template>
+
+      <el-form ref="formRef" :model="formData" :rules="rules" label-position="top">
+        <el-form-item label="支付名称" prop="name">
+          <el-input v-model="formData.name" placeholder="例如：微信支付-主账号" />
+        </el-form-item>
+        <el-form-item label="支付编码（唯一，创建后不建议修改）" prop="code">
+          <el-input v-model="formData.code" :disabled="isEdit" placeholder="例如：wechat_main" />
+        </el-form-item>
+        <el-form-item label="支付类型" prop="type">
+          <el-radio-group v-model="formData.type" @change="handleTypeChange">
+            <el-radio label="shenqi">神奇支付</el-radio>
+            <el-radio label="wechat">微信支付</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="是否启用" prop="enable">
+          <el-switch v-model="formData.enable" active-text="启用" inactive-text="禁用" />
+        </el-form-item>
+        <el-form-item label="排序（越小越靠前，建议10的倍数）" prop="sort">
+          <el-input-number v-model="formData.sort" :min="0" :step="1" controls-position="right" style="width: 100%;" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="formData.remark" type="textarea" :rows="2" placeholder="备注说明" />
+        </el-form-item>
+
+        <el-divider>神奇支付配置</el-divider>
+        <template v-if="formData.type === 'shenqi'">
+          <el-form-item label="神奇支付商户ID" prop="shenqiPid">
+            <el-input-number v-model="formData.shenqiPid" :min="1" :step="1" controls-position="right" style="width: 100%;" />
+          </el-form-item>
+          <el-form-item label="商户私钥" prop="shenqiPrivateKey">
+            <el-input v-model="formData.shenqiPrivateKey" type="textarea" :rows="4" placeholder="支持Base64或PEM格式" />
+          </el-form-item>
+          <el-form-item label="平台公钥" prop="shenqiPlatformPubKey">
+            <el-input v-model="formData.shenqiPlatformPubKey" type="textarea" :rows="3" placeholder="平台公钥" />
+          </el-form-item>
+          <el-form-item label="异步回调地址" prop="shenqiNotifyUrl">
+            <el-input v-model="formData.shenqiNotifyUrl" placeholder="http://your-domain.com/app_order/shenqi/notify/{code}" />
+          </el-form-item>
+          <el-form-item label="同步跳转地址" prop="shenqiReturnUrl">
+            <el-input v-model="formData.shenqiReturnUrl" placeholder="http://your-domain.com/pay/success" />
+          </el-form-item>
+          <el-form-item label="API基础地址" prop="shenqiBaseUrl">
+            <el-input v-model="formData.shenqiBaseUrl" placeholder="默认：https://www.shenqiyzf.cn" />
+          </el-form-item>
+        </template>
+
+        <el-divider>微信支付配置</el-divider>
+        <template v-if="formData.type === 'wechat'">
+          <el-form-item label="微信AppID" prop="wechatAppId">
+            <el-input v-model="formData.wechatAppId" placeholder="微信开放平台AppID" />
+          </el-form-item>
+          <el-form-item label="商户号" prop="wechatMchId">
+            <el-input v-model="formData.wechatMchId" placeholder="微信商户号" />
+          </el-form-item>
+          <el-form-item label="API V3密钥" prop="wechatMchApiV3Key">
+            <el-input v-model="formData.wechatMchApiV3Key" placeholder="32位API V3密钥" />
+          </el-form-item>
+          <el-form-item label="商户私钥" prop="wechatPrivateKey">
+            <el-input v-model="formData.wechatPrivateKey" type="textarea" :rows="4" placeholder="PEM格式私钥" />
+          </el-form-item>
+          <el-form-item label="证书序列号" prop="wechatSerialNo">
+            <el-input v-model="formData.wechatSerialNo" placeholder="证书序列号" />
+          </el-form-item>
+          <el-form-item label="回调地址" prop="wechatNotifyUrl">
+            <el-input v-model="formData.wechatNotifyUrl" placeholder="http://your-domain.com/app_order/notify/{code}" />
+          </el-form-item>
+        </template>
+      </el-form>
+    </el-drawer>
+
+    <el-drawer destroy-on-close v-model="detailVisible" :size="appStore.drawerSize" title="支付配置详情">
+      <el-descriptions :column="1" border>
+        <el-descriptions-item label="名称">{{ detailData.name }}</el-descriptions-item>
+        <el-descriptions-item label="编码">{{ detailData.code }}</el-descriptions-item>
+        <el-descriptions-item label="类型">{{ formatType(detailData.type) }}</el-descriptions-item>
+        <el-descriptions-item label="启用">{{ detailData.enable ? '是' : '否' }}</el-descriptions-item>
+        <el-descriptions-item label="排序">{{ detailData.sort ?? '-' }}</el-descriptions-item>
+        <el-descriptions-item label="备注">{{ detailData.remark || '-' }}</el-descriptions-item>
+        <el-descriptions-item label="创建时间">{{ formatDate(detailData.CreatedAt) }}</el-descriptions-item>
+        <el-descriptions-item label="更新时间">{{ formatDate(detailData.UpdatedAt) }}</el-descriptions-item>
+        <template v-if="detailData.type === 'shenqi'">
+          <el-descriptions-item label="商户ID">{{ detailData.shenqiPid }}</el-descriptions-item>
+          <el-descriptions-item label="商户私钥">
+            <div class="secret-text">{{ detailData.shenqiPrivateKey || '-' }}</div>
+          </el-descriptions-item>
+          <el-descriptions-item label="平台公钥">
+            <div class="secret-text">{{ detailData.shenqiPlatformPubKey || '-' }}</div>
+          </el-descriptions-item>
+          <el-descriptions-item label="回调地址">{{ detailData.shenqiNotifyUrl || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="跳转地址">{{ detailData.shenqiReturnUrl || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="基础地址">{{ detailData.shenqiBaseUrl || '-' }}</el-descriptions-item>
+        </template>
+        <template v-else-if="detailData.type === 'wechat'">
+          <el-descriptions-item label="AppID">{{ detailData.wechatAppId }}</el-descriptions-item>
+          <el-descriptions-item label="商户号">{{ detailData.wechatMchId }}</el-descriptions-item>
+          <el-descriptions-item label="API V3密钥">{{ detailData.wechatMchApiV3Key || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="商户私钥">
+            <div class="secret-text">{{ detailData.wechatPrivateKey || '-' }}</div>
+          </el-descriptions-item>
+          <el-descriptions-item label="证书序列号">{{ detailData.wechatSerialNo || '-' }}</el-descriptions-item>
+          <el-descriptions-item label="回调地址">{{ detailData.wechatNotifyUrl || '-' }}</el-descriptions-item>
+        </template>
+      </el-descriptions>
+    </el-drawer>
+  </div>
+</template>
+
+<script setup>
+import { list, detail, createPayConfig, updatePayConfig, removePayConfig, togglePayConfig } from '@/api/payConfig/index.js'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { ref, reactive, computed, nextTick } from 'vue'
+import { formatDate } from '@/utils/format'
+import { useAppStore } from '@/pinia'
+
+defineOptions({ name: 'PayConfig' })
+
+const appStore = useAppStore()
+
+const typeOptions = [
+  { label: '神奇支付', value: 'shenqi' },
+  { label: '微信支付', value: 'wechat' }
+]
+
+const searchForm = ref({
+  name: '',
+  code: '',
+  type: '',
+  enable: ''
+})
+
+const tableData = ref([])
+const tableLoading = ref(false)
+const page = ref(1)
+const pageSize = ref(10)
+const total = ref(0)
+
+const btnLoading = ref(false)
+const formVisible = ref(false)
+const formRef = ref(null)
+const formType = ref('create')
+
+const initForm = () => ({
+  ID: undefined,
+  name: '',
+  code: '',
+  type: 'shenqi',
+  enable: false,
+  sort: 10,
+  remark: '',
+  shenqiPid: null,
+  shenqiPrivateKey: '',
+  shenqiPlatformPubKey: '',
+  shenqiNotifyUrl: '',
+  shenqiReturnUrl: '',
+  shenqiBaseUrl: 'https://www.shenqiyzf.cn',
+  wechatAppId: '',
+  wechatMchId: '',
+  wechatMchApiV3Key: '',
+  wechatPrivateKey: '',
+  wechatSerialNo: '',
+  wechatNotifyUrl: ''
+})
+
+const formData = ref(initForm())
+
+const isEdit = computed(() => formType.value === 'update')
+
+const requiredWhen = (type, message) => ({
+  validator: (_, value, callback) => {
+    if (formData.value.type !== type) return callback()
+    if (value === null || value === undefined || value === '') return callback(new Error(message))
+    callback()
+  },
+  trigger: 'blur'
+})
+
+const rules = reactive({
+  name: [{ required: true, message: '请输入支付名称', trigger: ['blur', 'input'] }],
+  code: [{ required: true, message: '请输入支付编码', trigger: ['blur', 'input'] }],
+  type: [{ required: true, message: '请选择支付类型', trigger: 'change' }],
+  shenqiPid: [requiredWhen('shenqi', '请输入神奇支付商户ID')],
+  shenqiPrivateKey: [requiredWhen('shenqi', '请输入商户私钥')],
+  shenqiPlatformPubKey: [requiredWhen('shenqi', '请输入平台公钥')],
+  shenqiNotifyUrl: [requiredWhen('shenqi', '请输入神奇支付回调地址')],
+  shenqiReturnUrl: [requiredWhen('shenqi', '请输入神奇支付跳转地址')],
+  wechatAppId: [requiredWhen('wechat', '请输入微信AppID')],
+  wechatMchId: [requiredWhen('wechat', '请输入微信商户号')],
+  wechatMchApiV3Key: [requiredWhen('wechat', '请输入API V3密钥')],
+  wechatPrivateKey: [requiredWhen('wechat', '请输入微信商户私钥')],
+  wechatSerialNo: [requiredWhen('wechat', '请输入证书序列号')],
+  wechatNotifyUrl: [requiredWhen('wechat', '请输入微信回调地址')]
+})
+
+const formatType = (type) => (type === 'wechat' ? '微信支付' : '神奇支付')
+
+const fetchList = async () => {
+  tableLoading.value = true
+  try {
+    const params = {
+      page: page.value,
+      pageSize: pageSize.value,
+      ...searchForm.value
+    }
+    const res = await list(params)
+    if (res.code === 0) {
+      tableData.value = (res.data?.list || []).map((item) => ({
+        ...item,
+        enable: !!item.enable,
+        _toggleLoading: false
+      }))
+      total.value = res.data?.total || 0
+      page.value = res.data?.page || page.value
+      pageSize.value = res.data?.pageSize || pageSize.value
+    }
+  } finally {
+    tableLoading.value = false
+  }
+}
+
+const handleSearch = () => {
+  page.value = 1
+  fetchList()
+}
+
+const handleReset = () => {
+  searchForm.value = {
+    name: '',
+    code: '',
+    type: '',
+    enable: ''
+  }
+  page.value = 1
+  pageSize.value = 10
+  fetchList()
+}
+
+const handleSizeChange = (val) => {
+  pageSize.value = val
+  fetchList()
+}
+
+const handleCurrentChange = (val) => {
+  page.value = val
+  fetchList()
+}
+
+const closeForm = () => {
+  formVisible.value = false
+  formRef.value?.resetFields()
+  formData.value = initForm()
+}
+
+const handleTypeChange = () => {
+  // 清空另一类型的字段，避免脏数据提交
+  if (formData.value.type === 'shenqi') {
+    formData.value.wechatAppId = ''
+    formData.value.wechatMchId = ''
+    formData.value.wechatMchApiV3Key = ''
+    formData.value.wechatPrivateKey = ''
+    formData.value.wechatSerialNo = ''
+    formData.value.wechatNotifyUrl = ''
+  } else {
+    formData.value.shenqiPid = null
+    formData.value.shenqiPrivateKey = ''
+    formData.value.shenqiPlatformPubKey = ''
+    formData.value.shenqiNotifyUrl = ''
+    formData.value.shenqiReturnUrl = ''
+    formData.value.shenqiBaseUrl = 'https://www.shenqiyzf.cn'
+  }
+  nextTick(() => formRef.value?.clearValidate())
+}
+
+const openCreate = () => {
+  formType.value = 'create'
+  formData.value = initForm()
+  formVisible.value = true
+}
+
+const normalizeDetail = (data) => ({
+  ...initForm(),
+  ...(data || {}),
+  enable: !!data?.enable
+})
+
+const openEdit = async (row) => {
+  const res = await detail(row.ID)
+  if (res.code === 0) {
+    formType.value = 'update'
+    formData.value = normalizeDetail(res.data)
+    formVisible.value = true
+  }
+}
+
+const submitForm = () => {
+  formRef.value?.validate(async (valid) => {
+    if (!valid) return
+    btnLoading.value = true
+    try {
+      const payload = { ...formData.value }
+      const api = isEdit.value ? updatePayConfig : createPayConfig
+      const res = await api(payload)
+      if (res.code === 0) {
+        ElMessage.success(isEdit.value ? '更新成功' : '创建成功')
+        closeForm()
+        fetchList()
+      }
+    } finally {
+      btnLoading.value = false
+    }
+  })
+}
+
+const handleDelete = async (row) => {
+  await ElMessageBox.confirm('确定删除该支付配置吗？', '提示', {
+    type: 'warning',
+    confirmButtonText: '确定',
+    cancelButtonText: '取消'
+  })
+  const res = await removePayConfig(row.ID)
+  if (res.code === 0) {
+    ElMessage.success('删除成功')
+    if (tableData.value.length === 1 && page.value > 1) {
+      page.value--
+    }
+    fetchList()
+  }
+}
+
+const handleToggle = async (row) => {
+  const nextVal = row.enable
+  row._toggleLoading = true
+  try {
+    const res = await togglePayConfig({ id: row.ID, enable: nextVal })
+    if (res.code === 0) {
+      ElMessage.success(nextVal ? '已启用' : '已禁用')
+    } else {
+      row.enable = !nextVal
+      ElMessage.error(res.msg || '操作失败')
+    }
+  } catch (e) {
+    row.enable = !nextVal
+  } finally {
+    row._toggleLoading = false
+  }
+}
+
+const detailVisible = ref(false)
+const detailData = ref({})
+
+const openDetail = async (row) => {
+  const res = await detail(row.ID)
+  if (res.code === 0) {
+    detailData.value = normalizeDetail(res.data)
+    detailVisible.value = true
+  }
+}
+
+fetchList()
+</script>
+
+<style scoped>
+.gva-pagination {
+  margin-top: 20px;
+  text-align: right;
+}
+.secret-text {
+  white-space: pre-wrap;
+  word-break: break-all;
+}
+</style>
+
diff --git a/src/view/system/ipConfig.vue b/src/view/system/ipConfig.vue
new file mode 100644
index 0000000..d7464a7
--- /dev/null
+++ b/src/view/system/ipConfig.vue
@@ -0,0 +1,358 @@
+<template>
+  <div class="ip-config-container">
+    <div class="config-header">
+      <h2>IP检测配置</h2>
+      <p class="config-desc">配置允许访问的地区IP范围，控制用户访问权限</p>
+    </div>
+
+    <div class="config-content">
+      <!-- 开关控制 -->
+      <el-card class="config-card" shadow="hover">
+        <template #header>
+          <div class="card-header">
+            <span>IP检测开关</span>
+            <el-switch
+              v-model="configData.status"
+              :loading="statusLoading"
+              active-text="开启"
+              inactive-text="关闭"
+              @change="handleStatusChange"
+            />
+          </div>
+        </template>
+        <div class="status-info">
+          <el-alert
+            :title="configData.status ? 'IP检测已开启' : 'IP检测已关闭'"
+            :type="configData.status ? 'success' : 'info'"
+            :description="configData.status ? '系统将根据配置的地区限制用户访问' : '系统不会进行IP地区检测'"
+            show-icon
+            :closable="false"
+          />
+        </div>
+      </el-card>
+
+      <!-- 重定向URL配置 -->
+      <el-card class="config-card" shadow="hover">
+        <template #header>
+          <div class="card-header">
+            <span>重定向URL</span>
+          </div>
+        </template>
+        <div class="url-config">
+          <el-form :model="configData" label-width="100px">
+            <el-form-item label="跳转地址" required>
+              <el-input
+                v-model="configData.toUrl"
+                placeholder="请输入重定向URL，如：https://news.qq.com"
+                type="url"
+                clearable
+              />
+            </el-form-item>
+            <el-form-item>
+              <el-text type="info" size="small">
+                当用户IP不在允许地区时，将重定向到此URL
+              </el-text>
+            </el-form-item>
+          </el-form>
+        </div>
+      </el-card>
+
+      <!-- 地区配置 -->
+      <el-card class="config-card" shadow="hover">
+        <template #header>
+          <div class="card-header">
+            <span>允许访问地区</span>
+            <el-button type="primary" icon="plus" @click="showAddDialog = true">
+              添加地区
+            </el-button>
+          </div>
+        </template>
+
+        <div class="region-list">
+          <el-empty v-if="!regionList.length" description="暂无配置地区" />
+          <div v-else class="region-tags">
+            <el-tag
+              v-for="(region, index) in regionList"
+              :key="index"
+              closable
+              type="success"
+              size="large"
+              @close="removeRegion(index)"
+              class="region-tag"
+            >
+              {{ region }}
+            </el-tag>
+          </div>
+        </div>
+
+        <div class="action-buttons">
+          <el-button 
+            type="primary" 
+            :loading="saveLoading"
+            @click="saveConfig"
+            :disabled="!regionList.length || !configData.toUrl"
+          >
+            保存配置
+          </el-button>
+          <el-button @click="resetConfig">重置</el-button>
+        </div>
+      </el-card>
+    </div>
+
+    <!-- 添加地区对话框 -->
+    <el-dialog
+      v-model="showAddDialog"
+      title="添加允许访问地区"
+      width="400px"
+      destroy-on-close
+    >
+      <el-form :model="addForm" label-width="80px">
+        <el-form-item label="地区名称" required>
+          <el-input
+            v-model="addForm.region"
+            placeholder="请输入地区名称，如：北京、上海、广东"
+            maxlength="20"
+            show-word-limit
+          />
+        </el-form-item>
+      </el-form>
+      
+      <template #footer>
+        <el-button @click="showAddDialog = false">取消</el-button>
+        <el-button type="primary" @click="addRegion" :disabled="!addForm.region.trim()">
+          确定
+        </el-button>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getIpCon, setIpCon, setIpStatus } from '@/api/user/index.js'
+
+// 响应式数据
+const configData = ref({
+  ID: null,
+  status: false,
+  toUrl: '',
+  addrs: ''
+})
+const statusLoading = ref(false)
+const regionList = ref([])
+const saveLoading = ref(false)
+const showAddDialog = ref(false)
+const addForm = ref({ region: '' })
+
+// 获取IP检测配置
+async function getIpDetectionConfig() {
+  try {
+    const res = await getIpCon()
+    if (res.code === 0) {
+      const data = res.data
+      configData.value = {
+        ID: data.ID,
+        status: data.status,
+        toUrl: data.toUrl || '',
+        addrs: data.addrs || ''
+      }
+      // 解析地区字符串为数组
+      regionList.value = data.addrs ? data.addrs.split(',').filter(addr => addr.trim()) : []
+    }
+  } catch (error) {
+    console.error('获取IP检测配置失败:', error)
+    ElMessage.error('获取IP检测配置失败')
+  }
+}
+
+// 切换IP检测状态
+async function handleStatusChange(value) {
+  statusLoading.value = true
+  try {
+    const res = await setIpStatus({ status: value })
+    if (res.code === 0) {
+      ElMessage.success(value ? 'IP检测已开启' : 'IP检测已关闭')
+      configData.value.status = value
+    } else {
+      ElMessage.error(res.msg || '状态更新失败')
+      configData.value.status = !value // 恢复原状态
+    }
+  } catch (error) {
+    ElMessage.error('状态更新失败')
+    configData.value.status = !value // 恢复原状态
+  } finally {
+    statusLoading.value = false
+  }
+}
+
+// 添加地区
+function addRegion() {
+  const region = addForm.value.region.trim()
+  if (!region) {
+    ElMessage.warning('请输入地区名称')
+    return
+  }
+  
+  if (regionList.value.includes(region)) {
+    ElMessage.warning('该地区已存在')
+    return
+  }
+  
+  regionList.value.push(region)
+  addForm.value.region = ''
+  showAddDialog.value = false
+  ElMessage.success('地区添加成功')
+}
+
+// 删除地区
+function removeRegion(index) {
+  ElMessageBox.confirm('确定要删除该地区吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(() => {
+    regionList.value.splice(index, 1)
+    ElMessage.success('地区删除成功')
+  }).catch(() => {
+    // 用户取消删除
+  })
+}
+
+// 保存完整配置
+async function saveConfig() {
+  if (!regionList.value.length) {
+    ElMessage.warning('请至少添加一个地区')
+    return
+  }
+  
+  if (!configData.value.toUrl.trim()) {
+    ElMessage.warning('请输入重定向URL')
+    return
+  }
+  
+  saveLoading.value = true
+  try {
+    const saveData = {
+      ID: configData.value.ID,
+      status: configData.value.status,
+      toUrl: configData.value.toUrl.trim(),
+      addrs: regionList.value.join(',')
+    }
+    
+    const res = await setIpCon(saveData)
+    if (res.code === 0) {
+      ElMessage.success('配置保存成功')
+      // 更新本地配置数据
+      if (res.data && res.data.ID) {
+        configData.value.ID = res.data.ID
+      }
+    } else {
+      ElMessage.error(res.msg || '保存失败')
+    }
+  } catch (error) {
+    ElMessage.error('保存失败')
+  } finally {
+    saveLoading.value = false
+  }
+}
+
+// 重置配置
+function resetConfig() {
+  ElMessageBox.confirm('确定要重置所有配置吗？', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning'
+  }).then(() => {
+    regionList.value = []
+    configData.value.toUrl = ''
+    ElMessage.success('配置已重置')
+  }).catch(() => {
+    // 用户取消重置
+  })
+}
+
+// 页面初始化
+onMounted(() => {
+  getIpDetectionConfig()
+})
+</script>
+
+<style lang="scss" scoped>
+.ip-config-container {
+  padding: 20px;
+  background: #f5f5f5;
+  min-height: 100vh;
+}
+
+.config-header {
+  margin-bottom: 20px;
+  
+  h2 {
+    margin: 0 0 8px 0;
+    color: #303133;
+    font-size: 24px;
+    font-weight: 600;
+  }
+  
+  .config-desc {
+    margin: 0;
+    color: #606266;
+    font-size: 14px;
+  }
+}
+
+.config-content {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+}
+
+.config-card {
+  .card-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-weight: 600;
+    color: #303133;
+  }
+  
+  .status-info {
+    margin-top: 16px;
+  }
+  
+  .url-config {
+    margin-top: 16px;
+  }
+  
+  .region-list {
+    margin: 16px 0;
+    min-height: 60px;
+    
+    .region-tags {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 8px;
+      
+      .region-tag {
+        margin: 0;
+      }
+    }
+  }
+  
+  .action-buttons {
+    margin-top: 16px;
+    display: flex;
+    gap: 12px;
+  }
+}
+
+:deep(.el-card__header) {
+  background: #fafafa;
+  border-bottom: 1px solid #ebeef5;
+}
+
+:deep(.el-alert) {
+  border: none;
+}
+</style>