feat(会员管理): 添加第三方账户绑定和会员等级功能

- 在登录API中新增获取第三方账户绑定列表、绑定和解绑功能 - 在会员API中新增获取当前会员等级、等级规则和等级列表的接口 - 在会员中心页面中添加第三方账户绑定的UI和逻辑 - 新增会员等级页面，展示当前等级、经验值和经验值记录
2026-06-21 17:40:25 +08:00 · 2026-05-13 18:53:33 +08:00
parent fe4e0ce75c
commit aa4bc81da4
22 changed files with 3262 additions and 386 deletions
--- a/buyer/src/api/login.js
+++ b/buyer/src/api/login.js
@@ -69,6 +69,32 @@ export function loginCallback (uuid) {
  });
 }

+export function getThirdAccountBindList () {
+  return request({
+    url: '/buyer/passport/connect/bind/list',
+    method: Method.GET,
+    needToken: true
+  });
+}
+
+export function bindThirdAccount (data) {
+  return request({
+    url: '/buyer/passport/connect/bind',
+    method: Method.POST,
+    needToken: true,
+    data
+  });
+}
+
+export function unbindThirdAccount (data) {
+  return request({
+    url: '/buyer/passport/connect/bind/unbind',
+    method: Method.POST,
+    needToken: true,
+    data
+  });
+}
+
 /**
 * 忘记密码  验证手机验证码
 */
@@ -109,3 +135,12 @@ export function sCLogin(token,params) {
    params
  });
 }
+
+export function getWechatH5QrCode (params) {
+  return request({
+    url: '/buyer/other/wechat/h5/qrcode',
+    method: Method.GET,
+    needToken: true,
+    params
+  })
+}
--- a/buyer/src/api/member.js
+++ b/buyer/src/api/member.js
@@ -489,6 +489,31 @@ export function memberPointHistory (params) {
    params
  });
 }
+
+export function memberGradeCurrent (params) {
+  return request({
+    url: `/buyer/member/memberGrade/current`,
+    method: Method.GET,
+    needToken: true,
+    params
+  })
+}
+
+export function memberGradeRules () {
+  return request({
+    url: `/buyer/member/memberGrade/rules`,
+    method: Method.GET,
+    needToken: true
+  })
+}
+
+export function memberGradeList () {
+  return request({
+    url: `/buyer/member/memberGrade/list`,
+    method: Method.GET,
+    needToken: true
+  })
+}
 /**
 * 分页获取会员站内信
 * @param {Object} params 请求参数，包括pageNumber、pageSize、status
--- a/buyer/src/pages/home/memberCenter/AccountSafe.vue
+++ b/buyer/src/pages/home/memberCenter/AccountSafe.vue
@@ -15,21 +15,112 @@
          <Button @click="modifyPwd">修改密码</Button>
        </Col>
      </Row>
+
+      <Row class="safeItem">
+        <Col :span="2">
+          <Icon size="40" type="md-link" />
+        </Col>
+        <Col :span="16">
+          <div class="setDivItem">第三方账户绑定</div>
+          <div class="setDivItem theme">绑定后可使用第三方账号快捷登录。</div>
+          <div class="connectList">
+            <div class="connectRow">
+              <div class="connectRowLeft">
+                <span class="connectName">{{ wechatConnect.label }}</span>
+                <Tag v-if="isBound(wechatConnect.type)" color="success">已绑定</Tag>
+                <Tag v-else>未绑定</Tag>
              </div>
            </div>
+            <Spin size="large" fix v-if="connectLoading"></Spin>
+          </div>
+        </Col>
+        <Col :span="4">
+          <Button v-if="!isBound(wechatConnect.type)" type="primary" @click="openBindModal(wechatConnect)">绑定</Button>
+          <Button v-else @click="confirmUnbind(wechatConnect)">解绑</Button>
+        </Col>
+      </Row>
+    </div>
+
+    <Modal
+      v-model="bindModalVisible"
+      title="绑定第三方账户"
+      :mask-closable="false"
+      :footer-hide="bindForm.type === 'WECHAT'"
+      :ok-text="bindModalOkText"
+      :loading="bindSubmitLoading"
+      @on-ok="submitBind"
+      @on-cancel="resetBindForm"
+    >
+      <Form :label-width="110">
+        <FormItem label="类型">
+          <Input v-model="bindForm.typeLabel" disabled />
+        </FormItem>
+
+        <FormItem v-if="bindForm.type === 'WECHAT'" label="公众号二维码">
+          <div class="wechatQrBox">
+            <div class="wechatQrImgBox">
+              <Spin fix v-if="qrCodeLoading"></Spin>
+              <img v-if="qrCodeSrc" class="wechatQrImg" :src="qrCodeSrc" alt="微信公众号二维码" />
+              <div v-else class="wechatQrEmpty">二维码获取失败，请刷新重试</div>
+            </div>
+            <div class="wechatQrActions">
+              <Button @click="fetchWechatQrCode">刷新二维码</Button>
+              <Button type="primary" @click="submitBind">我已完成绑定</Button>
+            </div>
+            <div class="wechatQrTip">请使用微信扫码关注/授权，完成后点击“我已完成绑定”检测绑定状态</div>
+          </div>
+        </FormItem>
+
+        <FormItem v-if="bindForm.type !== 'WECHAT'" label="OpenID/UnionID">
+          <Input v-model="bindForm.unionID" placeholder="请输入 OpenID/UnionID" />
+        </FormItem>
+      </Form>
+    </Modal>
+  </div>
 </template>

 <script>
 // import { getPwdStatus } from '@/api/account';
+import storage from '@/plugins/storage'
+import { bindThirdAccount, getThirdAccountBindList, getWechatH5QrCode, unbindThirdAccount } from '@/api/login.js'
 export default {
  name: 'AccountSafe',
  data () {
    return {
-      pwdStatus: '' // 密码状态
+      pwdStatus: '',
+      connectLoading: false,
+      bindModalVisible: false,
+      bindSubmitLoading: false,
+      connectBoundTypes: [],
+      thirdAccountTypes: [
+        { type: 'WECHAT', label: '微信' }
+      ],
+      qrCodeLoading: false,
+      qrCodeBase64: '',
+      bindForm: {
+        type: '',
+        typeLabel: '',
+        unionID: ''
+      }
+    }
+  },
+  computed: {
+    wechatConnect () {
+      return this.thirdAccountTypes[0]
+    },
+    qrCodeSrc () {
+      if (!this.qrCodeBase64) return ''
+      if (this.qrCodeBase64.startsWith('data:image')) return this.qrCodeBase64
+      return `data:image/png;base64,${this.qrCodeBase64}`
+    },
+    bindModalOkText () {
+      if (this.bindForm.type === 'WECHAT') return '我已完成绑定'
+      return '确定'
    }
  },
  mounted () {
    this.getPwdStatus()
+    this.refreshConnectBinds()
  },
  methods: {
    // 设置支付密码
@@ -40,6 +131,7 @@ export default {
      this.$router.push({name: 'ModifyPwd', query: { status: 1 }})
    },
    // 获取密码状态
+    getPwdStatus () {},
    // getPwdStatus () {
    //   getPwdStatus().then(res => {
    //     if (res) {
@@ -49,6 +141,124 @@ export default {
    //     }
    //   });
    // }
+    isBound (type) {
+      return this.connectBoundTypes.includes(type)
+    },
+    refreshConnectBinds () {
+      this.connectLoading = true
+      return getThirdAccountBindList()
+        .then(res => {
+          if (res && res.success) {
+            this.connectBoundTypes = Array.isArray(res.result) ? res.result : []
+          }
+        })
+        .finally(() => {
+          this.connectLoading = false
+        })
+    },
+    openBindModal (item) {
+      this.bindForm.type = item.type
+      this.bindForm.typeLabel = item.label
+      this.bindForm.unionID = ''
+      this.qrCodeBase64 = ''
+      this.bindModalVisible = true
+      if (item.type === 'WECHAT') {
+        this.fetchWechatQrCode()
+      }
+    },
+    resetBindForm () {
+      this.bindForm.type = ''
+      this.bindForm.typeLabel = ''
+      this.bindForm.unionID = ''
+      this.qrCodeLoading = false
+      this.qrCodeBase64 = ''
+      this.bindSubmitLoading = false
+    },
+    fetchWechatQrCode () {
+      if (this.bindForm.type !== 'WECHAT') return
+      const rawUserInfo = storage.getItem('userInfo')
+      const userInfo = rawUserInfo ? JSON.parse(rawUserInfo) : null
+      const userId = userInfo && userInfo.id ? String(userInfo.id) : ''
+      if (!userId) {
+        this.qrCodeBase64 = ''
+        this.$Message.error('未获取到当前用户ID，请重新登录后重试')
+        return
+      }
+      this.qrCodeLoading = true
+      getWechatH5QrCode({ scene: userId })
+        .then(res => {
+          if (res && res.success) {
+            this.qrCodeBase64 = res.result || ''
+            return
+          }
+          this.qrCodeBase64 = ''
+          this.$Message.error((res && res.message) || '二维码获取失败')
+        })
+        .catch(() => {
+          this.qrCodeBase64 = ''
+        })
+        .finally(() => {
+          this.qrCodeLoading = false
+        })
+    },
+    submitBind () {
+      if (this.bindSubmitLoading) return
+      if (this.bindForm.type === 'WECHAT' && !this.bindForm.unionID) {
+        this.bindSubmitLoading = true
+        this.refreshConnectBinds()
+          .then(() => {
+            if (this.isBound(this.bindForm.type)) {
+              this.$Message.success('绑定成功')
+              this.bindModalVisible = false
+              this.resetBindForm()
+              return
+            }
+            this.$Message.warning('暂未检测到绑定，请扫码后重试')
+            this.$nextTick(() => {
+              this.bindModalVisible = true
+            })
+          })
+          .finally(() => {
+            this.bindSubmitLoading = false
+          })
+        return
+      }
+      if (!this.bindForm.type) {
+        this.$Message.error('绑定类型不能为空')
+        return
+      }
+      if (!this.bindForm.unionID) {
+        this.$Message.error('OpenID/UnionID 不能为空')
+        this.$nextTick(() => {
+          this.bindModalVisible = true
+        })
+        return
+      }
+
+      this.bindSubmitLoading = true
+      bindThirdAccount({ unionID: this.bindForm.unionID, type: this.bindForm.type })
+        .then(() => {
+          this.$Message.success('绑定成功')
+          this.bindModalVisible = false
+          this.resetBindForm()
+          this.refreshConnectBinds()
+        })
+        .finally(() => {
+          this.bindSubmitLoading = false
+        })
+    },
+    confirmUnbind (item) {
+      this.$Modal.confirm({
+        title: '解绑确认',
+        content: `<p>确定解绑 ${item.label} 吗？</p>`,
+        onOk: () => {
+          unbindThirdAccount({ type: item.type }).then(() => {
+            this.$Message.success('解绑成功')
+            this.refreshConnectBinds()
+          })
+        }
+      })
+    }
  }
 }
 </script>
@@ -76,4 +286,67 @@ export default {

    }
  }
+
+  .connectList {
+    position: relative;
+    margin-top: 8px;
+  }
+
+  .connectRow {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px 0;
+  }
+
+  .connectRowLeft {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+  }
+
+  .connectName {
+    color: $title_color;
+  }
+
+  .wechatQrBox {
+    width: 100%;
+  }
+
+  .wechatQrImgBox {
+    position: relative;
+    width: 180px;
+    height: 180px;
+    border: 1px solid $border_color;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+  }
+
+  .wechatQrImg {
+    width: 168px;
+    height: 168px;
+    object-fit: contain;
+  }
+
+  .wechatQrEmpty {
+    color: $light_sub_color;
+    font-size: 12px;
+    text-align: center;
+    padding: 0 8px;
+  }
+
+  .wechatQrActions {
+    margin-top: 10px;
+    display: flex;
+    gap: 10px;
+  }
+
+  .wechatQrTip {
+    margin-top: 10px;
+    color: $light_sub_color;
+    font-size: 12px;
+    line-height: 1.6;
+  }
 </style>
--- a/buyer/src/pages/home/memberCenter/MemberGrade.vue
+++ b/buyer/src/pages/home/memberCenter/MemberGrade.vue
@@ -0,0 +1,431 @@
+<template>
+  <div class="memberGrade">
+    <card _Title="我的等级"/>
+    <div class="summary">
+      <div class="gradeCard">
+        <div class="gradeLeft">
+          <img v-if="currentGrade.gradeImage" class="gradeIcon" :src="currentGrade.gradeImage" alt="等级图标" />
+          <div class="gradeInfo">
+            <div class="gradeNameRow">
+              <span class="gradeNameText">{{ currentGrade.gradeName || '暂无等级' }}</span>
+              <span v-if="currentGradeBenefits.length" class="benefitTagsInline">
+                <Tag v-for="b in currentGradeBenefits" :key="b.id" class="benefitTag" color="blue">{{ b.benefitName || '-' }}</Tag>
+              </span>
+            </div>
+            <div class="gradeExp">
+              当前经验值：<span class="num">{{ currentExperience || 0 }}</span>
+            </div>
+            <div class="gradeNext" v-if="nextGrade">
+              距 {{ nextGrade.gradeName }} 还差 <span class="num">{{ diffExperience }}</span> 经验值
+            </div>
+            <div class="gradeNext" v-else>已达最高等级</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <Tabs value="rules">
+      <TabPane label="获取经验值方式" name="rules">
+        <Table :columns="ruleColumns" :data="ruleList" :loading="rulesLoading">
+          <template slot-scope="{ row }" slot="ruleItem">
+            <div class="ruleItem">
+              <div class="ruleTop">
+                <div class="ruleName">
+                  <span>{{ row.ruleName || row.ruleKey || '-' }}</span>
+                </div>
+                <Tag v-if="row.completed === true" color="success">已完成</Tag>
+                <Tag v-else color="default">未完成</Tag>
+              </div>
+              <div class="ruleDesc">{{ getRuleDesc(row.ruleKey) }}</div>
+              <div class="ruleMeta">
+                <span class="metaItem">单次获得：<b>+{{ row.value == null ? 0 : row.value }}</b></span>
+                <span v-if="row.maxValue != null && Number(row.maxValue) > 0" class="metaItem">限额：<b>{{ row.maxValue }}</b></span>
+                <span class="metaItem">已获得：<b>{{ row.gainedExperience == null ? 0 : row.gainedExperience }}</b></span>
+              </div>
+            </div>
+          </template>
+        </Table>
+        <div class="rulesDesc" v-if="rulesDescription">{{ rulesDescription }}</div>
+      </TabPane>
+      <TabPane label="经验值记录" name="logs">
+        <Table :columns="logColumns" :data="experienceLogs.records || []" :loading="logLoading">
+          <template slot-scope="{ row }" slot="rule">
+            <span>{{ getRuleName(row.ruleKey) }}</span>
+          </template>
+          <template slot-scope="{ row }" slot="delta">
+            <div :style="{color: getLogDeltaColor(row)}">
+              <span v-if="getLogDeltaSign(row) === '+'">+</span>{{ getLogDeltaAbsValue(row) }}
+            </div>
+          </template>
+        </Table>
+        <Page
+          style="float:right;margin-top:10px"
+          :current="params.pageNumber"
+          :total="experienceLogs.total || 0"
+          :page-size="params.pageSize"
+          @on-change="changePage"
+          @on-page-size-change="changePageSize"
+          :page-size-opts="[10, 20, 50]"
+          size="small"
+          show-total
+          show-elevator
+        ></Page>
+      </TabPane>
+    </Tabs>
+
+  </div>
+
+</template>
+
+<script>
+import { memberGradeCurrent, memberGradeList, memberGradeRules } from '@/api/member.js'
+
+export default {
+  name: 'MemberGrade',
+  data () {
+    return {
+      ruleList: [],
+      rulesLoading: false,
+      rulesDescription: '',
+      /** 接口返回 List MemberGradeDetailVO，每项 { grade, benefits } */
+      gradeDetails: [],
+      gradeList: [],
+      currentGrade: {},
+      currentExperience: 0,
+      currentGradeId: '',
+      selectedRuleKey: '',
+      logLoading: false,
+      gradeLoading: false,
+      params: {
+        pageNumber: 1,
+        pageSize: 10
+      },
+      experienceLogs: {},
+      ruleColumns: [
+        {
+          title: '获取方式',
+          slot: 'ruleItem',
+          minWidth: 720
+        }
+      ],
+      logColumns: [
+        {
+          title: '时间',
+          key: 'createTime',
+          align: 'center',
+          minWidth: 160
+        },
+        {
+          title: '规则',
+          slot: 'rule',
+          align: 'center',
+          minWidth: 160
+        },
+        {
+          title: '变动值',
+          slot: 'delta',
+          align: 'center',
+          minWidth: 120
+        }
+      ]
+    }
+  },
+  computed: {
+    rulesMap () {
+      const map = {}
+      this.ruleList.forEach(item => {
+        map[item.ruleKey] = item.ruleName
+      })
+      return map
+    },
+    sortedGradeList () {
+      const list = Array.isArray(this.gradeList) ? this.gradeList.slice() : []
+      list.sort((a, b) => {
+        const sa = a && a.gradeSort != null ? Number(a.gradeSort) : 0
+        const sb = b && b.gradeSort != null ? Number(b.gradeSort) : 0
+        if (sa !== sb) return sa - sb
+        const ea = a && a.requiredExperience != null ? Number(a.requiredExperience) : 0
+        const eb = b && b.requiredExperience != null ? Number(b.requiredExperience) : 0
+        return ea - eb
+      })
+      return list
+    },
+    currentGradeIndex () {
+      if (!this.currentGradeId) return -1
+      return this.sortedGradeList.findIndex(g => g && g.id === this.currentGradeId)
+    },
+    nextGrade () {
+      const idx = this.currentGradeIndex
+      if (idx < 0) return null
+      return this.sortedGradeList[idx + 1] || null
+    },
+    diffExperience () {
+      if (!this.nextGrade || this.nextGrade.requiredExperience == null) return 0
+      const diff = Number(this.nextGrade.requiredExperience) - Number(this.currentExperience || 0)
+      return diff > 0 ? diff : 0
+    },
+    /** 当前等级在列表详情中对应的启用权益（顺序与后台 benefits 一致） */
+    currentGradeBenefits () {
+      const id = this.currentGradeId
+      if (!id || !Array.isArray(this.gradeDetails) || !this.gradeDetails.length) return []
+      const detail = this.gradeDetails.find(
+        (d) => d && d.grade && String(d.grade.id) === String(id)
+      )
+      const list = detail && Array.isArray(detail.benefits) ? detail.benefits : []
+      return list.filter((b) => b && b.benefitState === 'OPEN')
+    },
+  },
+  mounted () {
+    this.init()
+  },
+  methods: {
+    init () {
+      this.loadRules()
+      this.loadGradeList()
+      this.loadCurrent()
+    },
+    loadRules () {
+      this.rulesLoading = true
+      memberGradeRules()
+        .then(res => {
+          if (res && res.success) {
+            const items = res.result && Array.isArray(res.result.items) ? res.result.items : []
+            this.rulesDescription = (res.result && res.result.description) || ''
+            this.ruleList = items
+          }
+        })
+        .finally(() => {
+          this.rulesLoading = false
+        })
+    },
+    loadGradeList () {
+      this.gradeLoading = true
+      memberGradeList()
+        .then(res => {
+          if (res && res.success) {
+            const raw = Array.isArray(res.result) ? res.result : []
+            this.gradeDetails = raw
+              .map((item) => {
+                if (!item) return null
+                if (item.grade != null) {
+                  return {
+                    grade: item.grade,
+                    benefits: Array.isArray(item.benefits) ? item.benefits : []
+                  }
+                }
+                return { grade: item, benefits: [] }
+              })
+              .filter(Boolean)
+            this.gradeList = this.gradeDetails.map((d) => d.grade).filter(Boolean)
+          } else {
+            this.gradeDetails = []
+            this.gradeList = []
+          }
+        })
+        .finally(() => {
+          this.gradeLoading = false
+        })
+    },
+    loadCurrent () {
+      this.logLoading = true
+      const params = {
+        pageNumber: this.params.pageNumber,
+        pageSize: this.params.pageSize
+      }
+      if (this.selectedRuleKey) params.ruleKey = this.selectedRuleKey
+      memberGradeCurrent(params)
+        .then(res => {
+          if (res && res.success && res.result) {
+            this.currentGrade = res.result.grade || {}
+            this.currentExperience = res.result.experience || 0
+            this.currentGradeId = res.result.gradeId || (this.currentGrade && this.currentGrade.id) || ''
+            this.experienceLogs = res.result.experienceLogs || {}
+          }
+        })
+        .finally(() => {
+          this.logLoading = false
+        })
+    },
+    selectRule (ruleKey) {
+      this.selectedRuleKey = ruleKey || ''
+      this.params.pageNumber = 1
+      this.loadCurrent()
+    },
+    changePage (val) {
+      this.params.pageNumber = val
+      this.loadCurrent()
+    },
+    changePageSize (val) {
+      this.params.pageSize = val
+      this.params.pageNumber = 1
+      this.loadCurrent()
+    },
+    getRuleName (ruleKey) {
+      if (!ruleKey) return '-'
+      return this.rulesMap[ruleKey] || ruleKey
+    },
+    getRuleDesc (ruleKey) {
+      const map = {
+        CONSUME: '客户消费1元可获取经验值，向下取整',
+        REGISTER: '会员注册成功后可获取经验值',
+        SIGN_IN: '客户每日签到后可获取的经验值',
+        COMMENT: '对已购买商品完成发表评价获取经验值；仅针对评论字数大于30字的评论进行发放',
+        SHARE: '会员分享商城页面可获取的经验值',
+        PROFILE: '完善个人基本信息可获得经验值，每个会员仅可获得一次',
+        FOLLOW_STORE: '关注店铺可获得经验值，每个客户ID同店铺仅第一次关注可进行获得',
+        BIND_WECHAT: '绑定微信成功后获得经验值，每个会员仅可获得一次',
+        ADD_ADDRESS: '添加收货地址可获得经验值，每个会员仅可获得一次',
+        SHARE_REGISTER: '仅被注册成功后可获得相应奖励经验值',
+        SHARE_BUY: '仅被购买成功后可获得相应奖励经验值'
+      }
+      if (!ruleKey) return '-'
+      return map[ruleKey] || '-'
+    },
+    getLogDeltaRaw (row) {
+      if (!row) return 0
+      const candidate = row.variableExperience != null ? row.variableExperience : (row.changeExperience != null ? row.changeExperience : (row.experience != null ? row.experience : row.value))
+      if (candidate == null) return 0
+      const num = Number(candidate)
+      if (Number.isNaN(num)) return 0
+      if (row.type === 'DECREASE') return -Math.abs(num)
+      if (row.type === 'INCREASE') return Math.abs(num)
+      return num
+    },
+    getLogDeltaSign (row) {
+      const num = this.getLogDeltaRaw(row)
+      return num >= 0 ? '+' : '-'
+    },
+    getLogDeltaAbsValue (row) {
+      const num = this.getLogDeltaRaw(row)
+      return Math.abs(num)
+    },
+    getLogDeltaColor (row) {
+      return this.getLogDeltaRaw(row) >= 0 ? 'green' : 'red'
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+h3 {
+  font-size: 16px;
+  margin: 20px 10px;
+}
+
+.summary {
+  margin-bottom: 20px;
+}
+
+.rulesDesc {
+  margin: 10px 0 0 0;
+  padding: 10px 12px;
+  border: 1px solid $border_color;
+  border-radius: 4px;
+  background: #fff;
+  color: $light_sub_color;
+  font-size: 12px;
+  line-height: 1.7;
+}
+
+.gradeCard {
+  padding: 16px;
+  border: 1px solid $border_color;
+  border-radius: 6px;
+  background: #fff;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+.gradeLeft {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+}
+
+.gradeIcon {
+  width: 48px;
+  height: 48px;
+  object-fit: contain;
+  border-radius: 4px;
+  background: #fff;
+}
+
+.gradeNameRow {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px 10px;
+  line-height: 1.4;
+}
+
+.gradeNameText {
+  font-size: 16px;
+  color: $light_title_color;
+  font-weight: 600;
+}
+
+.benefitTagsInline {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px 8px;
+  vertical-align: middle;
+}
+
+.benefitTag {
+  margin: 0 !important;
+}
+
+.gradeExp,
+.gradeNext {
+  margin-top: 6px;
+  font-size: 12px;
+  color: #000;
+}
+
+.num {
+  color: $theme_color;
+  font-size: 16px;
+}
+
+.ruleItem {
+  padding: 10px 8px;
+}
+
+.ruleTop {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+}
+
+.ruleName {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  color: $light_title_color;
+  font-size: 14px;
+}
+
+.ruleDesc {
+  margin-top: 6px;
+  color: $light_sub_color;
+  font-size: 12px;
+  line-height: 1.6;
+}
+
+.ruleMeta {
+  margin-top: 8px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  color: $light_sub_color;
+  font-size: 12px;
+}
+
+.metaItem b {
+  color: $theme_color;
+  font-weight: 600;
+}
+
+</style>
--- a/buyer/src/pages/home/memberCenter/Profile.vue
+++ b/buyer/src/pages/home/memberCenter/Profile.vue
@@ -54,14 +54,40 @@ export default {
  },
  mounted () {
    this.formItem = JSON.parse(storage.getItem('userInfo'))
+    this.formItem.birthday = this.normalizeBirthday(this.formItem.birthday)
    this.accessToken.accessToken = storage.getItem('accessToken');
  },
  methods: {
+    normalizeBirthday (value) {
+      if (!value) return ''
+      if (value instanceof Date) return value
+      if (typeof value === 'number') return new Date(value)
+      if (typeof value === 'string') {
+        const m = value.match(/^(\d{4})-(\d{2})-(\d{2})/)
+        if (m) return new Date(Number(m[1]), Number(m[2]) - 1, Number(m[3]))
+        const d = new Date(value)
+        return isNaN(d.getTime()) ? '' : d
+      }
+      return ''
+    },
+    formatBirthday (value) {
+      if (!value) return null
+      if (typeof value === 'string') {
+        const m = value.match(/^(\d{4})-(\d{2})-(\d{2})/)
+        return m ? `${m[1]}-${m[2]}-${m[3]}` : null
+      }
+      const d = value instanceof Date ? value : new Date(value)
+      if (isNaN(d.getTime())) return null
+      const yyyy = d.getFullYear()
+      const mm = String(d.getMonth() + 1).padStart(2, '0')
+      const dd = String(d.getDate()).padStart(2, '0')
+      return `${yyyy}-${mm}-${dd}`
+    },
    save () { // 保存
      this.$refs.form.validate(valid => {
        if (valid) {
          let params = {
-            birthday: this.$options.filters.unixToDate(this.formItem.birthday / 1000, 'yyyy-MM-dd'),
+            birthday: this.formatBirthday(this.formItem.birthday),
            face: this.formItem.face,
            nickName: this.formItem.nickName,
            sex: this.formItem.sex
--- a/buyer/src/pages/user/menu.js
+++ b/buyer/src/pages/user/menu.js
@@ -76,6 +76,11 @@ const member = [{
    icon: '',
    title: '我的积分',
    path: 'Point'
+  },
+  {
+    icon: '',
+    title: '我的等级',
+    path: 'MemberGrade'
  }
  ],
  display: true
--- a/buyer/src/router/index.js
+++ b/buyer/src/router/index.js
@@ -68,6 +68,8 @@ const ComplainDetail = (resolve) =>
  require(["@/pages/home/memberCenter/ComplainDetail"], resolve);
 const Point = (resolve) =>
  require(["@/pages/home/memberCenter/Point"], resolve);
+const MemberGrade = (resolve) =>
+  require(["@/pages/home/memberCenter/MemberGrade"], resolve);
 const MsgList = (resolve) =>
  require(["@/pages/home/memberCenter/memberMsg/MsgList"], resolve);
 const MsgDetail = (resolve) =>
@@ -326,6 +328,12 @@ export default new Router({
          component: Point,
          meta: { title: "我的积分" },
        },
+        {
+          path: "MemberGrade",
+          name: "MemberGrade",
+          component: MemberGrade,
+          meta: { title: "我的等级" },
+        },
        {
          path: "Profile",
          name: "Profile",
--- a/manager/src/api/member.js
+++ b/manager/src/api/member.js
@@ -175,3 +175,56 @@ export const addMemberGroupUsers = (groupId, memberIds) => {
    memberIds: Array.isArray(memberIds) ? memberIds.join(",") : memberIds,
  });
 };
+
+// 客户等级
+export const getMemberGradeByPage = (params) => {
+  return getRequest("/member/memberGrade/getByPage");
+};
+export const getMemberGrade = (id) => {
+  return getRequest(`/member/memberGrade/get/${id}`);
+};
+export const addMemberGrade = (params) => {
+  return postRequest(`/member/memberGrade`, params);
+};
+export const updateMemberGrade = (id, params) => {
+  return putRequest(`/member/memberGrade/update/${id}`, params);
+};
+export const updateMemberGradeState = (id, state) => {
+  return putRequest(`/member/memberGrade/state/${id}?state=${state}`);
+};
+export const deleteMemberGrade = (id) => {
+  return deleteRequest(`/member/memberGrade/delete/${id}`);
+};
+export const getMemberExperienceByPage = (params) => {
+  return getRequest(`/member/memberGrade/experience/getByPage`, params);
+};
+
+// 客户权益
+export const getMemberBenefitByPage = (params) => {
+  return getRequest("/member/benefit/getByPage", params);
+};
+
+export const getMemberBenefit = (id) => {
+  return getRequest(`/member/benefit/get/${id}`);
+};
+
+export const addMemberBenefit = (params) => {
+  return postRequest("/member/benefit", params);
+};
+
+export const updateMemberBenefit = (id, params) => {
+  return putRequest(`/member/benefit/update/${id}`, params);
+};
+
+export const updateMemberBenefitState = (id, state) => {
+  return putRequest(`/member/benefit/state/${id}?state=${state}`);
+};
+
+export const deleteMemberBenefit = (id) => {
+  return deleteRequest(`/member/benefit/delete/${id}`);
+};
+
+/** 客户权益类型枚举（管理端） */
+export const getMemberBenefitTypes = () => {
+  return getRequest("/member/benefit/types");
+};
--- a/manager/src/components/lili/upload-pic-input.vue
+++ b/manager/src/components/lili/upload-pic-input.vue
@@ -39,14 +39,20 @@
      <!--</Upload>-->
    </div>

-    <Modal title="图片预览" v-model="viewImage" :styles="{top: '30px'}" draggable>
+    <Modal
+      title="图片预览"
+      v-model="viewImage"
+      :styles="{ top: '30px' }"
+      :z-index="3500"
+      draggable
+    >
      <img :src="currentValue" alt="该资源不存在" style="max-width: 300px;margin: 0 auto;display: block;" />
      <div slot="footer">
        <Button @click="viewImage=false">关闭</Button>
      </div>
    </Modal>

-    <Modal width="1200px" v-model="picModalFlag">
+    <Modal width="1200px" v-model="picModalFlag" :z-index="3500">
      <ossManage @callback="callbackSelected" ref="ossManage" :isComponent="true" :initialize="picModalFlag" />
    </Modal>

--- a/manager/src/router/router.js
+++ b/manager/src/router/router.js
@@ -39,7 +39,7 @@ export const otherRouter = {
    },
    {
      path: "category",
-      title: "类型列表",
+      title: "分类列表",
      name: "category",
      component: () => import("@/views/goods/goods-manage/category.vue")
    },
@@ -105,16 +105,10 @@ export const otherRouter = {
    },
    {
      path: "goods-parameter-edit",
-      title: "商品参数维护",
+      title: "编辑商品参数",
      name: "goods-parameter-edit",
      component: () => import("@/views/goods/goods-manage/parameter-edit.vue")
    },
-    {
-      path: "goods-spec",
-      title: "商品参数",
-      name: "goods-spec",
-      component: () => import("@/views/goods/goods-manage/spec.vue")
-    },
    {
      path: "order-complaint-detail",
      title: "投诉详情",
@@ -159,6 +153,30 @@ export const otherRouter = {
      name: "member-group",
      component: () => import("@/views/member/group/index.vue")
    },
+    {
+      path: "member-grade",
+      title: "客户等级",
+      name: "member-grade",
+      component: () => import("@/views/member/grade/index.vue")
+    },
+    {
+      path: "member-benefit",
+      title: "客户权益管理",
+      name: "member-benefit",
+      component: () => import("@/views/member/benefit/index.vue")
+    },
+    {
+      path: "member-grade-experience",
+      title: "等级权益设置",
+      name: "member-grade-experience",
+      component: () => import("@/views/member/grade/experience-setting.vue")
+    },
+    {
+      path: "member-grade-experience-log",
+      title: "客户经验值记录",
+      name: "member-grade-experience-log",
+      component: () => import("@/views/member/grade/experience-log.vue")
+    },
    

    {
--- a/manager/src/utils/promotions.js
+++ b/manager/src/utils/promotions.js
@@ -85,3 +85,36 @@ export function memberPromotionsStatusRender(h, status) {
    ),
  ]);
 }
+
+/**
+ * 平台优惠券「活动时间 / 有效期」文案（活动获取券：effectiveDays 为领取后有效天数）
+ */
+export function formatPromotionCouponValidityHtml(row) {
+  if (!row) return "-";
+  if (row.getType === "ACTIVITY") {
+    const days = row.effectiveDays;
+    if (days !== undefined && days !== null && days !== "") {
+      const n = Number(days);
+      if (!Number.isNaN(n) && n > 0) {
+        return `领取后${n}天有效`;
+      }
+    }
+  }
+  if (row.startTime && row.endTime) {
+    return `${row.startTime}<br/>${row.endTime}`;
+  }
+  if (row.getType === "ACTIVITY" && row.rangeDayType === "DYNAMICTIME") {
+    return "长期有效";
+  }
+  return "-";
+}
+
+/** Table 列 render：活动时间（与 formatPromotionCouponValidityHtml 一致） */
+export function promotionsCouponActivityTimeRender(h, params) {
+  const html = formatPromotionCouponValidityHtml(params.row);
+  if (html === "-") return h("div", "-");
+  if (html.indexOf("<br/>") !== -1) {
+    return h("div", { domProps: { innerHTML: html } });
+  }
+  return h("div", html);
+}
--- a/manager/src/views/goods/goods-manage/category.vue
+++ b/manager/src/views/goods/goods-manage/category.vue
@@ -15,9 +15,6 @@
      >
        <template slot="action" slot-scope="scope">
          <div class="ops">
-            <template v-if="scope.row.level == 2">
-              <a class="ops-link" @click="parameterOperation(scope.row)">编辑绑定参数</a>
-            </template>
            <a class="ops-link" @click="edit(scope.row)">编辑</a>
            <a class="ops-link" @click="remove(scope.row)">删除</a>
            <a v-show="scope.row.level != 2" class="ops-link" @click="addChildren(scope.row)">添加子分类</a>
@@ -340,10 +337,6 @@ export default {
        }
      });
    },
-    // 编辑绑定参数
-    parameterOperation(v) {
-      this.$router.push({ name: "parameter", query: { id: v.id } });
-    },
    // 添加子分类
    addChildren(v) {
      this.modalType = 0;
--- a/manager/src/views/goods/goods-manage/spec.vue
+++ b/manager/src/views/goods/goods-manage/spec.vue
@@ -1,341 +0,0 @@
-<template>
-  <div class="search">
-    <Card>
-      <Form @submit.native.prevent @keydown.enter.native="handleSearch" ref="searchForm" :model="searchForm" inline :label-width="70"
-        class="search-form">
-        <Form-item label="规格名称" prop="specName">
-          <Input type="text" v-model="searchForm.specName" placeholder="请输入规格名称" clearable style="width: 240px" />
-        </Form-item>
-        <Button @click="handleSearch" type="primary" class="search-btn">搜索</Button>
-      </Form>
-    </Card>
-    <Card>
-      <Row class="operation padding-row">
-        <Button @click="add" type="primary">添加</Button>
-        <Button @click="delAll">批量删除</Button>
-      </Row>
-      <Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom"
-        @on-sort-change="changeSort" @on-selection-change="changeSelect">
-      </Table>
-      <Row type="flex" justify="end" class="mt_10">
-        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage"
-          @on-page-size-change="changePageSize" :page-size-opts="[20, 50, 100]" size="small" show-total show-elevator
-          show-sizer></Page>
-      </Row>
-    </Card>
-    <Modal :title="modalTitle" v-model="modalVisible" :mask-closable="false" :width="500">
-      <Form ref="form" :model="form" :label-width="100" :rules="formValidate">
-        <FormItem label="规格名称" prop="specName">
-          <Input v-model="form.specName" maxlength="30" clearable style="width: 100%" />
-        </FormItem>
-        <FormItem label="规格值" prop="specValue">
-          <Select v-model="form.specValue" placeholder="输入后回车添加" multiple filterable allow-create
-            :popper-append-to-body="false" popper-class="spec-values-popper"
-            style="width: 100%; text-align: left; margin-right: 10px" @on-create="handleCreate2">
-            <Option v-for="item in specValue" :value="item" :label="item" :key="item">
-            </Option>
-          </Select>
-        </FormItem>
-      </Form>
-      <div slot="footer">
-        <Button type="text" @click="modalVisible = false">取消</Button>
-        <Button type="primary" :loading="submitLoading" @click="saveSpec">提交</Button>
-      </div>
-    </Modal>
-  </div>
-</template>
-
-<script>
-import { getSpecListData, insertSpec, updateSpec, delSpec } from "@/api/goods";
-
-import { regular } from "@/utils";
-export default {
-  name: "spec",
-  components: {},
-  data () {
-    return {
-      loading: true, // 表单加载状态
-      modalType: 0, // 添加或编辑标识
-      modalVisible: false, // 添加或编辑显示
-      modalTitle: "", // 添加或编辑标题
-      searchForm: {
-        // 搜索框初始化对象
-        pageNumber: 1, // 当前页数
-        pageSize: 20, // 页面大小
-        sort: "createTime", // 默认排序字段
-        order: "asc", // 默认排序方式
-      },
-      // 表单验证规则
-      formValidate: {
-        specName: [
-          regular.REQUIRED,
-          // regular.VARCHAR20
-        ],
-        specValue: [regular.REQUIRED, regular.VARCHAR255],
-      },
-      form: {
-        // 添加或编辑表单对象初始化数据
-        specName: "",
-        specValue: "",
-      },
-      /** 编辑规格值 */
-      specValue: [],
-      submitLoading: false, // 添加或编辑提交状态
-      selectList: [], // 多选数据
-      selectCount: 0, // 多选计数
-      columns: [
-        // 表头
-        {
-          type: "selection",
-          width: 60,
-          align: "center",
-        },
-        {
-          title: "规格名称",
-          key: "specName",
-          width: 200,
-        },
-        {
-          title: "规格值",
-          key: "specValue",
-          minWidth: 250,
-          tooltip: true,
-        },
-        {
-          title: "操作",
-          key: "action",
-          align: "center",
-          fixed: "right",
-          width: 250,
-          render: (h, params) => {
-            return h("div", [
-              h(
-                "a",
-                {
-                  style: {
-                    color: "#2d8cf0",
-                    cursor: "pointer",
-                    textDecoration: "none",
-                    marginRight: "5px",
-                  },
-                  on: {
-                    click: () => {
-                      this.edit(params.row);
-                    },
-                  },
-                },
-                "编辑"
-              ),
-              h(
-                "span",
-                { style: { margin: "0 8px", color: "#dcdee2" } },
-                "|"
-              ),
-              h(
-                "a",
-                {
-                  style: {
-                    color: "#2d8cf0",
-                    cursor: "pointer",
-                    textDecoration: "none",
-                  },
-                  on: {
-                    click: () => {
-                      this.remove(params.row);
-                    },
-                  },
-                },
-                "删除"
-              ),
-            ]);
-          },
-        },
-      ],
-      data: [], // 表单数据
-      total: 0, // 表单数据总数
-    };
-  },
-  methods: {
-    handleCreate2 (v) {
-      console.log(v);
-    },
-    //初始化，获取数据
-    init () {
-      this.getDataList();
-    },
-    //修改分页
-    changePage (v) {
-      this.searchForm.pageNumber = v;
-      this.getDataList();
-      this.clearSelectAll();
-    },
-    //修改页面大小
-    changePageSize (v) {
-      this.searchForm.pageSize = v;
-      this.getDataList();
-    },
-    //搜索参数
-    handleSearch () {
-      this.searchForm.pageNumber = 1;
-      this.searchForm.pageSize = 20;
-      this.getDataList();
-    },
-    //重置搜索参数
-    handleReset () {
-      this.$refs.searchForm.resetFields();
-      this.searchForm.pageNumber = 1;
-      this.searchForm.pageSize = 20;
-      // 重新加载数据
-      this.getDataList();
-    },
-    //更改排序
-    changeSort (e) {
-      this.searchForm.sort = e.key;
-      this.searchForm.order = e.order;
-      if (e.order === "normal") {
-        this.searchForm.order = "";
-      }
-      this.getDataList();
-    },
-    //清除已选择
-    clearSelectAll () {
-      this.$refs.table.selectAll(false);
-    },
-    //修改已选择
-    changeSelect (e) {
-      this.selectList = e;
-      this.selectCount = e.length;
-    },
-    //获取数据
-    getDataList () {
-      this.loading = true;
-      // 带多条件搜索参数获取表单数据 请自行修改接口
-      getSpecListData(this.searchForm).then((res) => {
-        this.loading = false;
-        if (res.success) {
-          this.data = res.result.records;
-          this.total = res.result.total;
-        }
-      });
-      this.loading = false;
-    },
-    //新增规格
-    saveSpec () {
-      this.$refs.form.validate((valid) => {
-        if (valid) {
-          this.submitLoading = true;
-          if (this.modalType === 0) {
-            if (this.data.find((item) => item.specName == this.form.specName)) {
-              this.$Message.error("请勿添加重复规格名称!");
-              this.submitLoading = false;
-              return;
-            }
-            // 添加 避免编辑后传入id等数据
-            delete this.form.id;
-            insertSpec(this.form).then((res) => {
-              this.submitLoading = false;
-              if (res.success) {
-                this.$Message.success("操作成功");
-                this.getDataList();
-                this.modalVisible = false;
-              }
-            });
-          } else {
-            // 编辑
-            updateSpec(this.form.id, this.form).then((res) => {
-              this.submitLoading = false;
-              if (res.success) {
-                this.$Message.success("操作成功");
-                this.getDataList();
-                this.modalVisible = false;
-              }
-            });
-          }
-        }
-      });
-    },
-    //弹出添加框
-    add () {
-      this.modalType = 0;
-      this.modalTitle = "添加";
-      this.$refs.form.resetFields();
-      this.specValue = "";
-      delete this.form.id;
-      this.modalVisible = true;
-    },
-    //弹出编辑框
-    edit (v) {
-      this.modalType = 1;
-      this.modalTitle = "编辑";
-      // 转换null为""
-      for (let attr in v) {
-        if (v[attr] === null) {
-          v[attr] = "";
-        }
-      }
-      let localVal = v.specValue;
-      this.form.specName = v.specName;
-      this.form.id = v.id;
-      this.$nextTick(() => {
-        this.$set(this.form, 'specValue', v.specValue);
-      })
-
-      if (localVal && localVal.indexOf("," > 0)) {
-        this.$set(this.form, 'specValue', localVal.split(","));
-        this.specValue = this.form.specValue;
-      } else {
-        this.specValue = [];
-      }
-      this.modalVisible = true;
-    },
-    // 删除规格
-    remove (v) {
-      this.$Modal.confirm({
-        title: "确认删除",
-        content: "您确认要删除 " + v.specName + " ?",
-        loading: true,
-        onOk: () => {
-          delSpec(v.id).then((res) => {
-            this.$Modal.remove();
-            if (res.success) {
-              this.$Message.success("操作成功");
-              this.getDataList();
-            }
-          });
-        },
-      });
-    },
-    // 批量删除
-    delAll () {
-      if (this.selectCount <= 0) {
-        this.$Message.warning("您还未选择要删除的数据");
-        return;
-      }
-      this.$Modal.confirm({
-        title: "确认删除",
-        content: "您确认要删除所选的 " + this.selectCount + " 条数据?",
-        loading: true,
-        onOk: () => {
-          let ids = "";
-          this.selectList.forEach(function (e) {
-            ids += e.id + ",";
-          });
-          ids = ids.substring(0, ids.length - 1);
-          delSpec(ids).then((res) => {
-            this.$Modal.remove();
-            if (res.success) {
-              this.$Message.success("删除成功");
-              this.clearSelectAll();
-              this.searchForm.pageNumber = 1;
-              this.getDataList();
-            }
-          });
-        },
-      });
-    },
-  },
-  mounted () {
-    this.init();
-  },
-};
-</script>
--- a/manager/src/views/main-parts/shrinkable-menu/shrinkable-menu.vue
+++ b/manager/src/views/main-parts/shrinkable-menu/shrinkable-menu.vue
@@ -10,7 +10,7 @@
    <Menu
      ref="childrenMenu"
      :active-name="$route.name"
-      width="100px"
+      width="120px"
      @on-select="changeMenu"
    >
      <template v-for="item in menuList">
@@ -71,7 +71,7 @@ export default {
 <style lang="scss" scoped>
 .ivu-shrinkable-menu{
    height: calc(100% - 60px);
-    width: 180px;
+    width: 200px;
    display: flex;
 }

--- a/manager/src/views/main.scss
+++ b/manager/src/views/main.scss
@@ -52,7 +52,7 @@
    box-sizing: border-box;
    position: fixed;
    display: block;
-    padding-left: 180px;
+    padding-left: 200px;
    width: 100%;
    height: 100px;
    z-index: 20;
@@ -218,12 +218,12 @@
  .single-page-con {
    min-width: 740px;
    position: relative;
-    left: 180px;
+    left: 220px;
    top: 100px;
    right: 0;
    bottom: 0;
    height: calc(100% - 110px);
-    width: calc(100% - 180px);
+    width: calc(100% - 220px);
    overflow: auto;
    background-color: #f0f0f0;
    z-index: 1;
--- a/manager/src/views/member/benefit/index.vue
+++ b/manager/src/views/member/benefit/index.vue
@@ -0,0 +1,992 @@
+<template>
+  <div class="search member-benefit">
+    <Card>
+      <Row class="operation padding-row">
+        <Button type="primary" @click="openAdd">添加权益设置</Button>
+      </Row>
+      <Table
+        :loading="loading"
+        stripe
+        :columns="columns"
+        :data="data"
+        no-data-text="暂无数据"
+        class="mt_10 benefit-list-table benefit-list-table--no-vertical-borders"
+      ></Table>
+      <Row type="flex" justify="end" class="mt_10">
+        <Page
+          :current="searchForm.pageNumber"
+          :total="total"
+          :page-size="searchForm.pageSize"
+          @on-change="changePage"
+          @on-page-size-change="changePageSize"
+          :page-size-opts="[20, 30, 50]"
+          size="small"
+          show-total
+          show-elevator
+          show-sizer
+        ></Page>
+      </Row>
+    </Card>
+
+    <!-- 平台优惠券选择（与「添加优惠券活动」coupon-publish 相同组件） -->
+    <Modal
+      v-model="couponPickerVisible"
+      title="选择优惠券"
+      width="80%"
+      :z-index="3000"
+      :mask-closable="false"
+      @on-ok="handleCouponPickerClose"
+      @on-cancel="handleCouponPickerClose"
+    >
+      <couponTemplate
+        v-if="couponPickerVisible"
+        :selectedList="couponPickerSelectedList"
+        getType="ACTIVITY"
+        promotionStatus="START"
+        @selected="onCouponTemplateSelected"
+      />
+    </Modal>
+
+    <Drawer
+      v-model="addFlag"
+      title="添加权益设置"
+      width="1120"
+      placement="right"
+      :z-index="950"
+      :mask-closable="false"
+      :closable="true"
+      scrollable
+      class-name="benefit-form-drawer"
+    >
+      <Form ref="addForm" :model="formAdd" :rules="rulesAdd" :label-width="110">
+        <FormItem label="权益类型" prop="benefitType">
+          <Select
+            v-model="formAdd.benefitType"
+            clearable
+            placeholder="请选择权益类型"
+            style="width: 100%"
+            @on-change="onAddBenefitTypeChange"
+          >
+            <Option v-for="item in benefitTypeOptions" :key="item.value" :value="item.value">{{ item.description }}</Option>
+          </Select>
+        </FormItem>
+        <FormItem
+          v-show="formAdd.benefitType === 'GIFT_POINT'"
+          label="赠送积分"
+          prop="giftPoint"
+          :required="formAdd.benefitType === 'GIFT_POINT'"
+        >
+          <InputNumber
+            v-model="formAdd.giftPoint"
+            :min="0"
+            :max="99999"
+            :precision="0"
+            style="width: 220px"
+            placeholder="必填，范围 0-99999"
+          />
+        </FormItem>
+        <FormItem
+          v-show="formAdd.benefitType === 'COUPON_PACKAGE'"
+          label="赠送优惠券"
+          prop="couponPackageRows"
+          :required="formAdd.benefitType === 'COUPON_PACKAGE'"
+        >
+          <div>
+            <Button type="dashed" icon="ios-add" class="mb_10" @click="openCouponPicker('add')">添加优惠券</Button>
+            <Table
+              border
+              size="small"
+              :columns="couponPackageTableColumns"
+              :data="formAdd.couponPackageRows"
+              no-data-text="请添加优惠券"
+            ></Table>
+          </div>
+        </FormItem>
+        <FormItem label="权益名称" prop="benefitName">
+          <Input v-model="formAdd.benefitName" maxlength="50" placeholder="请输入权益名称" />
+        </FormItem>
+        <FormItem label="权益LOGO" prop="benefitLogo">
+          <div class="benefit-logo-field">
+            <div v-if="formAdd.benefitLogo" class="benefit-logo-thumb">
+              <img :src="formAdd.benefitLogo" alt="" />
+            </div>
+            <div class="benefit-logo-upload">
+              <upload-pic-input v-model="formAdd.benefitLogo" placeholder="请上传权益 LOGO 图片地址" style="width: 100%" />
+            </div>
+          </div>
+        </FormItem>
+        <FormItem label="权益介绍" prop="benefitDesc">
+          <Input v-model="formAdd.benefitDesc" type="textarea" :rows="4" maxlength="500" placeholder="请输入权益介绍" />
+        </FormItem>
+        <FormItem label="启用状态" prop="benefitState">
+          <RadioGroup v-model="formAdd.benefitState">
+            <Radio label="OPEN">开启</Radio>
+            <Radio label="CLOSE">关闭</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="排序" prop="benefitSort">
+          <InputNumber v-model="formAdd.benefitSort" :min="1" :max="9999" :precision="0" style="width: 220px" />
+        </FormItem>
+      </Form>
+      <div class="benefit-drawer-footer-btns">
+        <Button @click="addFlag = false">取消</Button>
+        <Button type="primary" :loading="submitAddLoading" @click="submitAdd">提交</Button>
+      </div>
+    </Drawer>
+
+    <Drawer
+      v-model="editFlag"
+      title="编辑权益设置"
+      width="1120"
+      placement="right"
+      :z-index="950"
+      :mask-closable="false"
+      :closable="true"
+      scrollable
+      class-name="benefit-form-drawer"
+    >
+      <Form ref="editForm" :model="formEdit" :rules="rulesEdit" :label-width="110">
+        <Input v-model="formEdit.id" v-show="false" />
+        <FormItem label="权益类型" prop="benefitType">
+          <Select
+            v-model="formEdit.benefitType"
+            clearable
+            placeholder="请选择权益类型"
+            style="width: 100%"
+            @on-change="onEditBenefitTypeChange"
+          >
+            <Option v-for="item in benefitTypeOptions" :key="item.value" :value="item.value">{{ item.description }}</Option>
+          </Select>
+        </FormItem>
+        <FormItem
+          v-show="formEdit.benefitType === 'GIFT_POINT'"
+          label="赠送积分"
+          prop="giftPoint"
+          :required="formEdit.benefitType === 'GIFT_POINT'"
+        >
+          <InputNumber
+            v-model="formEdit.giftPoint"
+            :min="0"
+            :max="99999"
+            :precision="0"
+            style="width: 220px"
+            placeholder="必填，范围 0-99999"
+          />
+        </FormItem>
+        <FormItem
+          v-show="formEdit.benefitType === 'COUPON_PACKAGE'"
+          label="赠送优惠券"
+          prop="couponPackageRows"
+          :required="formEdit.benefitType === 'COUPON_PACKAGE'"
+        >
+          <div>
+            <Button type="dashed" icon="ios-add" class="mb_10" @click="openCouponPicker('edit')">添加优惠券</Button>
+            <Table
+              border
+              size="small"
+              :columns="couponPackageTableColumnsEdit"
+              :data="formEdit.couponPackageRows"
+              no-data-text="请添加优惠券"
+            ></Table>
+          </div>
+        </FormItem>
+        <FormItem label="权益名称" prop="benefitName">
+          <Input v-model="formEdit.benefitName" maxlength="50" placeholder="请输入权益名称" />
+        </FormItem>
+        <FormItem label="权益LOGO" prop="benefitLogo">
+          <div class="benefit-logo-field">
+            <div v-if="formEdit.benefitLogo" class="benefit-logo-thumb">
+              <img :src="formEdit.benefitLogo" alt="" />
+            </div>
+            <div class="benefit-logo-upload">
+              <upload-pic-input v-model="formEdit.benefitLogo" placeholder="请上传权益 LOGO 图片地址" style="width: 100%" />
+            </div>
+          </div>
+        </FormItem>
+        <FormItem label="权益介绍" prop="benefitDesc">
+          <Input v-model="formEdit.benefitDesc" type="textarea" :rows="4" maxlength="500" placeholder="请输入权益介绍" />
+        </FormItem>
+        <FormItem label="启用状态" prop="benefitState">
+          <RadioGroup v-model="formEdit.benefitState">
+            <Radio label="OPEN">开启</Radio>
+            <Radio label="CLOSE">关闭</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="排序" prop="benefitSort">
+          <InputNumber v-model="formEdit.benefitSort" :min="1" :max="9999" :precision="0" style="width: 220px" />
+        </FormItem>
+      </Form>
+      <div class="benefit-drawer-footer-btns">
+        <Button @click="editFlag = false">取消</Button>
+        <Button type="primary" :loading="submitEditLoading" @click="submitEdit">提交</Button>
+      </div>
+    </Drawer>
+  </div>
+</template>
+
+<script>
+import * as API_Member from "@/api/member.js";
+import { getPlatformCoupon } from "@/api/promotion";
+import { formatPromotionCouponValidityHtml } from "@/utils/promotions";
+import couponTemplate from "@/views/promotions/coupon/coupon.vue";
+import uploadPicInput from "@/components/lili/upload-pic-input.vue";
+
+const GIFT_POINT = "GIFT_POINT";
+const COUPON_PACKAGE = "COUPON_PACKAGE";
+
+const buildDefaultForm = () => ({
+  id: "",
+  benefitName: "",
+  benefitCode: "",
+  benefitType: "",
+  benefitLogo: "",
+  benefitDesc: "",
+  benefitSort: 1,
+  benefitState: "OPEN",
+  benefitConfig: "",
+  /** 仅 UI：赠送积分数量；提交时写入 benefitConfig */
+  giftPoint: null,
+  /** 仅 UI：券礼包已选优惠券（含展示字段）；提交时写入 benefitConfig.coupons */
+  couponPackageRows: [],
+});
+
+export default {
+  name: "memberBenefit",
+  components: {
+    uploadPicInput,
+    couponTemplate,
+  },
+  data() {
+    return {
+      benefitTypeOptions: [],
+      loading: false,
+      total: 0,
+      searchForm: {
+        pageNumber: 1,
+        pageSize: 20,
+      },
+      columns: [
+        {
+          title: "权益类型",
+          key: "benefitType",
+          width: 132,
+          render: (h, params) => {
+            const v = params.row.benefitType;
+            let text = "-";
+            if (v) {
+              const opt = this.benefitTypeOptions.find((o) => o.value === v);
+              text = opt ? opt.description : v;
+            }
+            return h(
+              "span",
+              {
+                attrs: { title: text },
+                class: "benefit-list-cell-ellipsis benefit-list-cell-ellipsis--type",
+              },
+              text
+            );
+          },
+        },
+        {
+          title: "权益名称",
+          key: "benefitName",
+          width: 188,
+          render: (h, params) => {
+            const text = params.row.benefitName || "-";
+            return h(
+              "span",
+              {
+                attrs: { title: text },
+                class: "benefit-list-cell-ellipsis benefit-list-cell-ellipsis--name",
+              },
+              text
+            );
+          },
+        },
+        {
+          title: "权益LOGO",
+          key: "benefitLogo",
+          width: 116,
+          align: "center",
+          render: (h, params) => {
+            const src = params.row.benefitLogo;
+            if (!src) return h("span", "-");
+            return h(
+              "div",
+              {
+                class: "benefit-logo-thumb benefit-logo-thumb--table",
+              },
+              [
+                h("img", {
+                  attrs: { src, alt: "" },
+                }),
+              ]
+            );
+          },
+        },
+        {
+          title: "状态",
+          key: "benefitState",
+          width: 118,
+          align: "center",
+          render: (h, params) => {
+            const row = params.row;
+            return h("i-switch", {
+              props: {
+                value: row.benefitState === "OPEN",
+                size: "large",
+                loading: !!row._benefitStateLoading,
+              },
+              on: {
+                "on-change": (checked) => {
+                  this.onBenefitStateSwitch(row, checked);
+                },
+              },
+            }, [
+              h("span", { slot: "open" }, "开启"),
+              h("span", { slot: "close" }, "关闭"),
+            ]);
+          },
+        },
+        {
+          title: "操作",
+          key: "action",
+          align: "center",
+          width: 140,
+          render: (h, params) => {
+            const linkStyle = {
+              color: "#2d8cf0",
+              cursor: "pointer",
+              textDecoration: "none",
+            };
+            const sep = h("span", { style: { margin: "0 8px", color: "#dcdee2" } }, "|");
+            return h("div", { style: { display: "flex", justifyContent: "center" } }, [
+              h("a", { style: linkStyle, on: { click: () => this.openEdit(params.row) } }, "编辑"),
+              sep,
+              h("a", { style: linkStyle, on: { click: () => this.remove(params.row) } }, "删除"),
+            ]);
+          },
+        },
+      ],
+      data: [],
+      addFlag: false,
+      editFlag: false,
+      submitAddLoading: false,
+      submitEditLoading: false,
+      formAdd: buildDefaultForm(),
+      formEdit: buildDefaultForm(),
+      couponPickerVisible: false,
+      couponPickerWhich: "add",
+    };
+  },
+  computed: {
+    rulesAdd() {
+      return this.buildFormRules("add");
+    },
+    rulesEdit() {
+      return this.buildFormRules("edit");
+    },
+    couponPackageTableColumns() {
+      return this.buildCouponPackageTableColumns("add");
+    },
+    couponPackageTableColumnsEdit() {
+      return this.buildCouponPackageTableColumns("edit");
+    },
+    /** 传给优惠券列表组件，用于勾选回显（与 coupon-publish 一致用 id） */
+    couponPickerSelectedList() {
+      const form = this.couponPickerWhich === "add" ? this.formAdd : this.formEdit;
+      return (form.couponPackageRows || []).map((r) => ({
+        id: r.couponId,
+        couponName: r.couponName || "",
+      }));
+    },
+  },
+  methods: {
+    buildFormRules(which) {
+      const formKey = which === "add" ? "formAdd" : "formEdit";
+      return {
+        benefitType: [{ required: true, message: "请选择权益类型", trigger: "change" }],
+        benefitName: [{ required: true, message: "请输入权益名称", trigger: "blur" }],
+        benefitLogo: [{ required: true, message: "请配置权益LOGO", trigger: "change" }],
+        benefitSort: [{ required: true, type: "number", message: "请输入排序", trigger: "change" }],
+        benefitState: [{ required: true, message: "请选择启用状态", trigger: "change" }],
+        giftPoint: [
+          {
+            validator: (rule, value, callback) => {
+              const form = this[formKey];
+              this.validateGiftPoint(form, value, callback);
+            },
+            trigger: ["change", "blur"],
+          },
+        ],
+        couponPackageRows: [
+          {
+            validator: (rule, value, callback) => {
+              const form = this[formKey];
+              this.validateCouponPackage(form, callback);
+            },
+            trigger: "change",
+          },
+        ],
+      };
+    },
+    validateGiftPoint(form, value, callback) {
+      if (form.benefitType !== GIFT_POINT) return callback();
+      if (value === null || value === undefined || value === "") {
+        return callback(new Error("请输入赠送积分"));
+      }
+      const n = Number(value);
+      if (Number.isNaN(n) || n < 0 || n > 99999) {
+        return callback(new Error("赠送积分范围为 0-99999"));
+      }
+      callback();
+    },
+    validateCouponPackage(form, callback) {
+      if (form.benefitType !== COUPON_PACKAGE) return callback();
+      const rows = form.couponPackageRows || [];
+      if (!rows.length) {
+        return callback(new Error("请添加至少一张优惠券"));
+      }
+      for (let i = 0; i < rows.length; i++) {
+        const q = Number(rows[i].quantity);
+        if (Number.isNaN(q) || q < 1 || q > 10) {
+          return callback(new Error("每张券赠送张数需在 1～10 之间"));
+        }
+      }
+      callback();
+    },
+    formatCouponFace(row) {
+      if (!row) return "-";
+      if (row.price !== undefined && row.price !== null && row.price !== "") {
+        return `¥${row.price}`;
+      }
+      if (row.couponDiscount !== undefined && row.couponDiscount !== null && row.couponDiscount !== "") {
+        return `${row.couponDiscount}折`;
+      }
+      return "-";
+    },
+    formatCouponValidity(row) {
+      return formatPromotionCouponValidityHtml(row);
+    },
+    buildCouponDisplayRow(detail, quantity) {
+      const qty = Math.min(10, Math.max(1, Number(quantity) || 1));
+      return {
+        couponId: detail.id,
+        quantity: qty,
+        couponName: detail.couponName || "",
+        faceValueLabel: this.formatCouponFace(detail),
+        validRange: this.formatCouponValidity(detail),
+      };
+    },
+    buildCouponPackageTableColumns(which) {
+      const formKey = which === "add" ? "formAdd" : "formEdit";
+      const linkStyle = { color: "#2d8cf0", cursor: "pointer" };
+      return [
+        { title: "优惠券名称", key: "couponName", minWidth: 100, tooltip: true },
+        {
+          title: "有效期",
+          minWidth: 100,
+          render: (h, p) =>
+            h("span", {
+              domProps: { innerHTML: p.row.validRange || "-" },
+            }),
+        },
+        { title: "面额", key: "faceValueLabel", minWidth: 100 },
+        {
+          title: "赠送张数",
+          key: "quantity",
+          width: 150,
+          render: (h, params) =>
+            h("InputNumber", {
+              props: {
+                min: 1,
+                max: 10,
+                precision: 0,
+                value: params.row.quantity,
+              },
+              style: { width: "100px" },
+              on: {
+                "on-change": (val) => {
+                  this.$set(this[formKey].couponPackageRows[params.index], "quantity", val);
+                  this.$nextTick(() => {
+                    const ref = which === "add" ? this.$refs.addForm : this.$refs.editForm;
+                    if (ref) ref.validateField("couponPackageRows");
+                  });
+                },
+              },
+            }),
+        },
+        {
+          title: "操作",
+          key: "action",
+          width: 90,
+          align: "center",
+          render: (h, params) =>
+            h(
+              "a",
+              {
+                style: linkStyle,
+                on: {
+                  click: () => {
+                    this.removeCouponRow(which, params.index);
+                  },
+                },
+              },
+              "删除"
+            ),
+        },
+      ];
+    },
+    /** 构造 benefitConfig JSON 字符串 */
+    buildBenefitConfigString(slice) {
+      const { benefitType, giftPoint, couponPackageRows } = slice;
+      if (benefitType === GIFT_POINT) {
+        return JSON.stringify({ giftPoint: Number(giftPoint) });
+      }
+      if (benefitType === COUPON_PACKAGE) {
+        const coupons = (couponPackageRows || []).map((r) => ({
+          couponId: String(r.couponId),
+          quantity: Math.min(10, Math.max(1, Number(r.quantity) || 1)),
+        }));
+        return JSON.stringify({ coupons });
+      }
+      return "";
+    },
+    /** 从详情 benefitConfig 解析赠送积分，解析失败时返回 null */
+    parseGiftPointFromConfig(benefitType, benefitConfigStr) {
+      if (benefitType !== GIFT_POINT || !benefitConfigStr) return null;
+      try {
+        const o = JSON.parse(benefitConfigStr);
+        if (o && typeof o.giftPoint !== "undefined") {
+          const n = Number(o.giftPoint);
+          return Number.isNaN(n) ? null : n;
+        }
+      } catch (e) {
+        /* ignore */
+      }
+      return null;
+    },
+    onAddBenefitTypeChange(val) {
+      if (val !== GIFT_POINT) {
+        this.formAdd.giftPoint = null;
+      }
+      if (val !== COUPON_PACKAGE) {
+        this.formAdd.couponPackageRows = [];
+      }
+      this.$nextTick(() => {
+        if (this.$refs.addForm && val !== GIFT_POINT) {
+          this.$refs.addForm.validateField("giftPoint");
+        }
+        if (this.$refs.addForm && val !== COUPON_PACKAGE) {
+          this.$refs.addForm.validateField("couponPackageRows");
+        }
+      });
+    },
+    onEditBenefitTypeChange(val) {
+      if (val !== GIFT_POINT) {
+        this.formEdit.giftPoint = null;
+      }
+      if (val !== COUPON_PACKAGE) {
+        this.formEdit.couponPackageRows = [];
+      }
+      this.$nextTick(() => {
+        if (this.$refs.editForm && val !== GIFT_POINT) {
+          this.$refs.editForm.validateField("giftPoint");
+        }
+        if (this.$refs.editForm && val !== COUPON_PACKAGE) {
+          this.$refs.editForm.validateField("couponPackageRows");
+        }
+      });
+    },
+    parseCouponsFromConfig(str) {
+      if (!str) return [];
+      try {
+        const o = JSON.parse(str);
+        if (o && Array.isArray(o.coupons)) {
+          return o.coupons.map((c) => ({
+            couponId: c.couponId,
+            quantity: c.quantity,
+          }));
+        }
+      } catch (e) {
+        /* ignore */
+      }
+      return [];
+    },
+    /** 与添加时 formatCouponFace 一致；仅有 faceValueText 时去掉「减免」前缀 */
+    normalizeCouponFaceFromDetail(item) {
+      let face = this.formatCouponFace(item);
+      if (face !== "-") return face;
+      const raw = item.faceValueText;
+      if (raw == null || raw === "") return "-";
+      return String(raw)
+        .replace(/^减免现金\s*/, "")
+        .replace(/^减免\s*/, "")
+        .trim() || "-";
+    },
+    /** 管理端详情 couponItems → 表格行（面额展示与添加一致） */
+    mapCouponItemsToPackageRows(items) {
+      if (!Array.isArray(items)) return [];
+      return items.map((item) => {
+        const face = this.normalizeCouponFaceFromDetail(item);
+        const validHtml = item.validityText
+          ? String(item.validityText).replace(/\n/g, "<br/>")
+          : "-";
+        return {
+          couponId: item.couponId,
+          quantity: Math.min(10, Math.max(1, Number(item.quantity) || 1)),
+          couponName: item.couponName || "",
+          faceValueLabel: face,
+          validRange: validHtml,
+        };
+      });
+    },
+    async hydrateCouponRowsForEdit(snippets) {
+      const rows = [];
+      for (const s of snippets) {
+        const cid = s.couponId;
+        const qty = s.quantity;
+        try {
+          const res = await getPlatformCoupon(cid);
+          if (res && res.success && res.result) {
+            rows.push(this.buildCouponDisplayRow(res.result, qty));
+          } else {
+            rows.push({
+              couponId: cid,
+              quantity: Math.min(10, Math.max(1, Number(qty) || 1)),
+              couponName: String(cid),
+              faceValueLabel: "-",
+              validRange: "-",
+            });
+          }
+        } catch (e) {
+          rows.push({
+            couponId: cid,
+            quantity: Math.min(10, Math.max(1, Number(qty) || 1)),
+            couponName: String(cid),
+            faceValueLabel: "-",
+            validRange: "-",
+          });
+        }
+      }
+      this.$set(this.formEdit, "couponPackageRows", rows);
+    },
+    handleCouponPickerClose() {
+      this.couponPickerVisible = false;
+    },
+    openCouponPicker(which) {
+      this.couponPickerWhich = which;
+      this.couponPickerVisible = true;
+    },
+    /** 与 coupon-publish `selectedCoupon`：表格多选变更时同步到券礼包配置 */
+    onCouponTemplateSelected(selectedRows) {
+      const which = this.couponPickerWhich;
+      const form = which === "add" ? this.formAdd : this.formEdit;
+      const refName = which === "add" ? "addForm" : "editForm";
+      const list = selectedRows || [];
+      const rows = list.map((row) => {
+        const existing = (form.couponPackageRows || []).find((r) => String(r.couponId) === String(row.id));
+        const qty = existing ? existing.quantity : 1;
+        return this.buildCouponDisplayRow(row, qty);
+      });
+      this.$set(form, "couponPackageRows", rows);
+      this.$nextTick(() => {
+        const ref = this.$refs[refName];
+        if (ref) ref.validateField("couponPackageRows");
+      });
+    },
+    removeCouponRow(which, index) {
+      const form = which === "add" ? this.formAdd : this.formEdit;
+      const refName = which === "add" ? "addForm" : "editForm";
+      form.couponPackageRows.splice(index, 1);
+      this.$nextTick(() => {
+        const ref = this.$refs[refName];
+        if (ref) ref.validateField("couponPackageRows");
+      });
+    },
+    init() {
+      this.loadBenefitTypes();
+      this.getData();
+    },
+    loadBenefitTypes() {
+      API_Member.getMemberBenefitTypes().then((res) => {
+        if (res && res.success && Array.isArray(res.result)) {
+          this.benefitTypeOptions = res.result;
+        } else {
+          this.benefitTypeOptions = [];
+        }
+      });
+    },
+    changePage(page) {
+      this.searchForm.pageNumber = page;
+      this.getData();
+    },
+    changePageSize(size) {
+      this.searchForm.pageSize = size;
+      this.searchForm.pageNumber = 1;
+      this.getData();
+    },
+    getData() {
+      this.loading = true;
+      const params = { ...this.searchForm };
+      API_Member.getMemberBenefitByPage(params).then((res) => {
+        this.loading = false;
+        if (res && res.success && res.result) {
+          this.data = Array.isArray(res.result.records) ? res.result.records : [];
+          this.total = Number(res.result.total) || 0;
+        } else {
+          this.data = [];
+          this.total = 0;
+        }
+      });
+    },
+    openAdd() {
+      this.addFlag = true;
+      this.submitAddLoading = false;
+      this.$nextTick(() => {
+        if (this.$refs.addForm) this.$refs.addForm.resetFields();
+        this.formAdd = buildDefaultForm();
+      });
+    },
+    submitAdd() {
+      if (!this.$refs.addForm) {
+        this.$Message.warning("表单未就绪，请稍后重试");
+        return;
+      }
+      this.$refs.addForm.validate((valid) => {
+        if (!valid) return;
+        this.submitAddLoading = true;
+        const { giftPoint, couponPackageRows, ...rest } = this.formAdd;
+        const payload = {
+          ...rest,
+          benefitConfig: this.buildBenefitConfigString({
+            benefitType: this.formAdd.benefitType,
+            giftPoint,
+            couponPackageRows,
+          }),
+        };
+        API_Member.addMemberBenefit(payload).then((res) => {
+          this.submitAddLoading = false;
+          if (res && res.success) {
+            this.$Message.success("添加成功");
+            this.addFlag = false;
+            this.getData();
+          } else if (res && res.message) {
+            this.$Message.error(res.message);
+          } else {
+            this.$Message.error("添加失败");
+          }
+        }).catch(() => {
+          this.submitAddLoading = false;
+          this.$Message.error("网络异常，请稍后重试");
+        });
+      });
+    },
+    openEdit(row) {
+      this.editFlag = true;
+      this.submitEditLoading = false;
+      this.$nextTick(() => {
+        if (this.$refs.editForm) this.$refs.editForm.resetFields();
+      });
+      API_Member.getMemberBenefit(row.id).then((res) => {
+        if (res && res.success && res.result) {
+          const raw = res.result;
+          /** 新接口：{ benefit, couponItems }；旧接口：扁平 MemberBenefit */
+          const detail = raw.benefit != null ? raw.benefit : raw;
+          const couponItems = raw.couponItems;
+          const bt = detail.benefitType || "";
+          const parsed = this.parseGiftPointFromConfig(bt, detail.benefitConfig || "");
+          const couponSnippets = this.parseCouponsFromConfig(detail.benefitConfig || "");
+
+          let couponRows = [];
+          if (bt === COUPON_PACKAGE && Array.isArray(couponItems) && couponItems.length) {
+            couponRows = this.mapCouponItemsToPackageRows(couponItems);
+          }
+
+          this.formEdit = {
+            id: detail.id || row.id || "",
+            benefitName: detail.benefitName || "",
+            benefitCode: detail.benefitCode || "",
+            benefitType: bt,
+            benefitLogo: detail.benefitLogo || "",
+            benefitDesc: detail.benefitDesc || "",
+            benefitSort: Number(detail.benefitSort) > 0 ? Number(detail.benefitSort) : 1,
+            benefitState: detail.benefitState || "OPEN",
+            benefitConfig: detail.benefitConfig || "",
+            giftPoint: bt === GIFT_POINT ? (parsed !== null ? parsed : null) : null,
+            couponPackageRows: couponRows,
+          };
+
+          if (bt === COUPON_PACKAGE && couponRows.length === 0 && couponSnippets.length) {
+            this.hydrateCouponRowsForEdit(couponSnippets);
+          }
+        }
+      });
+    },
+    submitEdit() {
+      if (!this.$refs.editForm) {
+        this.$Message.warning("表单未就绪，请稍后重试");
+        return;
+      }
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) return;
+        this.submitEditLoading = true;
+        const { id, giftPoint, couponPackageRows, ...rest } = this.formEdit;
+        const payload = {
+          ...rest,
+          benefitConfig: this.buildBenefitConfigString({
+            benefitType: this.formEdit.benefitType,
+            giftPoint,
+            couponPackageRows,
+          }),
+        };
+        API_Member.updateMemberBenefit(id, payload).then((res) => {
+          this.submitEditLoading = false;
+          if (res && res.success) {
+            this.$Message.success("修改成功");
+            this.editFlag = false;
+            this.getData();
+          } else if (res && res.message) {
+            this.$Message.error(res.message);
+          } else {
+            this.$Message.error("修改失败");
+          }
+        }).catch(() => {
+          this.submitEditLoading = false;
+          this.$Message.error("网络异常，请稍后重试");
+        });
+      });
+    },
+    onBenefitStateSwitch(row, checked) {
+      const nextState = checked ? "OPEN" : "CLOSE";
+      const prevState = row.benefitState;
+      if (nextState === prevState) return;
+      const text = checked ? "开启" : "关闭";
+      this.$Modal.confirm({
+        title: "提示",
+        content: `<p>确定${text}该客户权益？</p>`,
+        onOk: () => {
+          this.$set(row, "_benefitStateLoading", true);
+          return API_Member.updateMemberBenefitState(row.id, nextState)
+            .then((res) => {
+              this.$set(row, "_benefitStateLoading", false);
+              if (res && res.success) {
+                this.$Message.success(`${text}成功`);
+                this.$set(row, "benefitState", nextState);
+              } else {
+                this.getData();
+              }
+            })
+            .catch(() => {
+              this.$set(row, "_benefitStateLoading", false);
+            });
+        },
+      });
+    },
+    remove(row) {
+      this.$Modal.confirm({
+        title: "提示",
+        content: "<p>确定删除该客户权益？</p>",
+        onOk: () => {
+          API_Member.deleteMemberBenefit(row.id).then((res) => {
+            if (res && res.success) {
+              this.$Message.success("删除成功");
+              this.getData();
+            } else if (res && res.message) {
+              this.$Message.error(res.message);
+            }
+          });
+        },
+      });
+    },
+  },
+  mounted() {
+    this.init();
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.benefit-drawer-footer-btns {
+  margin-top: 24px;
+  padding-top: 16px;
+  border-top: 1px solid #e8eaec;
+  text-align: right;
+}
+.benefit-drawer-footer-btns .ivu-btn + .ivu-btn {
+  margin-left: 8px;
+}
+
+</style>
+
+<!--
+  权益 LOGO 缩略图：固定 100×100。
+  不使用 .member-benefit 前缀：Modal 默认 transfer 到 body，弹窗内节点不在 .member-benefit 下。
+  Table 列 render 生成的节点在子组件内，同样用非 scoped。
+-->
+<style lang="scss">
+.benefit-logo-thumb {
+  width: 100px;
+  height: 100px;
+  min-width: 100px;
+  min-height: 100px;
+  max-width: 100px;
+  max-height: 100px;
+  flex-shrink: 0;
+  border: 1px solid #dcdee2;
+  border-radius: 4px;
+  background: #f8f8f9;
+  overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+}
+.benefit-logo-thumb img {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  display: block;
+}
+.benefit-logo-thumb--table {
+  margin: 0 auto;
+}
+
+/* 权益列表：固定类型/名称列宽并省略过长文案（悬浮 title 可看全文） */
+.member-benefit .benefit-list-table table {
+  table-layout: fixed;
+}
+.member-benefit .benefit-list-cell-ellipsis {
+  display: inline-block;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  vertical-align: middle;
+}
+.member-benefit .benefit-list-cell-ellipsis--type {
+  max-width: 118px;
+}
+.member-benefit .benefit-list-cell-ellipsis--name {
+  max-width: 172px;
+}
+
+/* 列表不出现列与列之间的竖线（保留行间分隔） */
+.member-benefit .benefit-list-table--no-vertical-borders .ivu-table th,
+.member-benefit .benefit-list-table--no-vertical-borders .ivu-table td {
+  border-right: none !important;
+}
+</style>
+
+<style lang="scss" scoped>
+.benefit-logo-field {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  flex-wrap: wrap;
+}
+.benefit-logo-upload {
+  flex: 1;
+  min-width: 200px;
+}
+</style>
--- a/manager/src/views/member/grade/experience-log.vue
+++ b/manager/src/views/member/grade/experience-log.vue
@@ -0,0 +1,197 @@
+<template>
+  <div class="search">
+    <Card>
+      <Form
+        ref="searchForm"
+        :model="searchForm"
+        inline
+        :label-width="90"
+        @keydown.enter.native="handleSearch"
+        @submit.native.prevent
+        class="search-form"
+      >
+        <FormItem label="客户手机号" prop="mobile">
+          <Input
+            v-model="searchForm.memberMobile"
+            clearable
+            placeholder="请输入客户手机号"
+            style="width: 220px"
+          />
+        </FormItem>
+        <FormItem label="规则" prop="ruleKey">
+          <Select v-model="searchForm.ruleKey" clearable filterable style="width: 220px">
+            <Option v-for="item in ruleOptions" :key="item.value" :value="item.value">
+              {{ item.label }}
+            </Option>
+          </Select>
+        </FormItem>
+        <Button type="primary" icon="ios-search" @click="handleSearch">搜索</Button>
+      </Form>
+    </Card>
+
+    <Card>
+      <Table
+        :loading="loading"
+        border
+        :columns="columns"
+        :data="data"
+        class="mt_10"
+      ></Table>
+      <Row type="flex" justify="end" class="mt_10">
+        <Page
+          :current="searchForm.pageNumber"
+          :total="total"
+          :page-size="searchForm.pageSize"
+          @on-change="changePage"
+          @on-page-size-change="changePageSize"
+          :page-size-opts="[20, 50, 100]"
+          size="small"
+          show-total
+          show-elevator
+          show-sizer
+        ></Page>
+      </Row>
+    </Card>
+  </div>
+</template>
+
+<script>
+import * as API_Member from "@/api/member";
+
+const RULE_OPTIONS = [
+  { value: "CONSUME", label: "消费" },
+  { value: "REGISTER", label: "注册" },
+  { value: "SIGN_IN", label: "签到" },
+  { value: "COMMENT", label: "评价" },
+  { value: "SHARE", label: "分享商城" },
+  { value: "PROFILE", label: "完善信息" },
+  { value: "FOLLOW_STORE", label: "关注店铺" },
+  { value: "BIND_WECHAT", label: "绑定微信" },
+  { value: "ADD_ADDRESS", label: "添加收货地址" },
+  { value: "SHARE_REGISTER", label: "分享注册" },
+  { value: "SHARE_BUY", label: "分享购买" },
+];
+
+export default {
+  name: "memberGradeExperienceLog",
+  data() {
+    return {
+      loading: false,
+      total: 0,
+      data: [],
+      ruleOptions: RULE_OPTIONS,
+      searchForm: {
+        pageNumber: 1,
+        pageSize: 20,
+        memberMobile: "",
+        ruleKey: "",
+      },
+      columns: [
+        {
+          title: "客户手机号",
+          key: "memberMobile",
+          width: 140,
+          tooltip: true,
+          render: (h, params) => {
+            const v = params.row.memberMobile || params.row.mobile || "-";
+            return h("span", v);
+          },
+        },
+        {
+          title: "规则名称",
+          key: "ruleName",
+          width: 150,
+          tooltip: true,
+          render: (h, params) => {
+            const text = params.row.ruleName || this.findRuleName(params.row.ruleKey) || "-";
+            return h("span", text);
+          },
+        },
+        {
+          title: "变化经验值",
+          key: "value",
+          width: 120,
+          render: (h, params) => {
+            const v =
+              params.row.value ??
+              params.row.variableExperience ??
+              params.row.experience ??
+              params.row.variableValue;
+            return h("span", v == null ? "-" : v);
+          },
+        },
+        {
+          title: "经验值限额",
+          key: "maxValue",
+          width: 120,
+          render: (h, params) => {
+            const v = params.row.maxValue ?? params.row.maxExperience ?? params.row.limitValue;
+            return h("span", v == null ? "-" : v);
+          },
+        },
+        {
+          title: "操作说明",
+          key: "content",
+          minWidth: 200,
+          tooltip: true,
+          render: (h, params) => {
+            const text = params.row.content || params.row.remark || params.row.description || "-";
+            return h("span", text);
+          },
+        },
+        { title: "创建时间", key: "createTime", width: 170 },
+      ],
+    };
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    findRuleName(ruleKey) {
+      const hit = this.ruleOptions.find((item) => item.value === ruleKey);
+      return hit ? hit.label : "";
+    },
+    init() {
+      this.getData();
+    },
+    buildParams() {
+      const params = {
+        pageNumber: this.searchForm.pageNumber,
+        pageSize: this.searchForm.pageSize,
+      };
+      if (this.searchForm.memberMobile) params.mobile = this.searchForm.memberMobile;
+      if (this.searchForm.ruleKey) params.ruleKey = this.searchForm.ruleKey;
+      return params;
+    },
+    getData() {
+      this.loading = true;
+      API_Member.getMemberExperienceByPage(this.buildParams())
+        .then((res) => {
+          if (res && res.success && res.result) {
+            this.data = res.result.records || [];
+            this.total = res.result.total || 0;
+          } else {
+            this.data = [];
+            this.total = 0;
+          }
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    handleSearch() {
+      this.searchForm.pageNumber = 1;
+      this.getData();
+    },
+    changePage(v) {
+      this.searchForm.pageNumber = v;
+      this.getData();
+    },
+    changePageSize(v) {
+      this.searchForm.pageNumber = 1;
+      this.searchForm.pageSize = v;
+      this.getData();
+    },
+  },
+};
+</script>
--- a/manager/src/views/member/grade/experience-setting.vue
+++ b/manager/src/views/member/grade/experience-setting.vue
@@ -0,0 +1,556 @@
+<template>
+  <div class="experience-setting">
+    <Card>
+      <Form :label-width="120" label-position="right">
+        <Table :loading="loading" :columns="columns" :data="form.items" class="mt_10 experience-table"></Table>
+        <FormItem label="经验值说明" style="margin-top: 16px" class="desc-item">
+          <Input
+            v-model="form.description"
+            type="textarea"
+            :rows="4"
+            maxlength="500"
+            show-word-limit
+            placeholder="请输入经验值说明"
+          />
+        </FormItem>
+        <FormItem>
+          <Button type="primary" :loading="submitLoading" @click="submit">保存</Button>
+        </FormItem>
+      </Form>
+    </Card>
+  </div>
+</template>
+
+<script>
+import { getSetting, setSetting } from "@/api/index";
+
+const RULE_OPTIONS = [
+  { ruleKey: "CONSUME", ruleName: "消费" },
+  { ruleKey: "REGISTER", ruleName: "注册" },
+  { ruleKey: "SIGN_IN", ruleName: "签到" },
+  { ruleKey: "COMMENT", ruleName: "评价" },
+  { ruleKey: "SHARE", ruleName: "分享商城" },
+  { ruleKey: "PROFILE", ruleName: "完善信息" },
+  { ruleKey: "FOLLOW_STORE", ruleName: "关注店铺" },
+  { ruleKey: "BIND_WECHAT", ruleName: "绑定微信" },
+  { ruleKey: "ADD_ADDRESS", ruleName: "添加收货地址" },
+  { ruleKey: "SHARE_REGISTER", ruleName: "分享注册" },
+  { ruleKey: "SHARE_BUY", ruleName: "分享购买" },
+];
+
+const defaultRuleItem = (rule) => ({
+  ruleKey: rule.ruleKey,
+  ruleName: rule.ruleName,
+  enabled: false,
+  value: 1,
+  maxValue: null,
+});
+
+const defaultForm = () => ({
+  items: RULE_OPTIONS.map((item) => defaultRuleItem(item)),
+  description: "",
+});
+
+export default {
+  name: "memberGradeExperienceSetting",
+  data() {
+    return {
+      loading: false,
+      submitLoading: false,
+      form: defaultForm(),
+      columns: [
+        {
+          title: "是否开启",
+          key: "enabled",
+          width: 90,
+          align: "center",
+          render: (h, params) => {
+            return h("Checkbox", {
+              props: { value: !!this.form.items[params.index].enabled },
+              on: {
+                "on-change": (checked) => {
+                  this.updateRuleEnabled(params.index, checked);
+                },
+              },
+            });
+          },
+        },
+        {
+          title: "类型",
+          key: "ruleName",
+          width: 160,
+        },
+        {
+          title: "经验值(1-100)",
+          key: "value",
+          minWidth: 700,
+          render: (h, params) => {
+            const row = this.form.items[params.index] || {};
+            const inputNode = h("Input", {
+              style: { width: "120px" },
+              props: {
+                value: row.value == null ? "" : String(row.value),
+                number: true,
+              },
+              on: {
+                input: (val) => {
+                  this.updateRuleValue(params.index, val);
+                },
+                "on-change": (v) => {
+                  this.updateRuleValue(params.index, v);
+                },
+                "on-blur": () => {
+                  this.commitRuleValue(params.index);
+                },
+              },
+            });
+            const maxInputNode = h("Input", {
+              style: { width: "120px" },
+              props: {
+                value: row.maxValue == null ? "" : String(row.maxValue),
+                number: true,
+              },
+              on: {
+                input: (val) => {
+                  this.updateRuleMaxValue(params.index, val);
+                },
+                "on-change": (v) => {
+                  this.updateRuleMaxValue(params.index, v);
+                },
+                "on-blur": () => {
+                  this.commitRuleMaxValue(params.index);
+                },
+              },
+            });
+            if (params.row.ruleKey === "REGISTER") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center" } },
+                    [h("span", { style: { marginRight: "8px" } }, "获得经验值:"), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "会员注册成功后可获得经验值"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "SHARE") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center", marginRight: "16px" } },
+                        [h("span", { style: { marginRight: "8px" } }, "分享商品详情页获得经验值："), inputNode]
+                      ),
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center" } },
+                        [h("span", { style: { marginRight: "8px" } }, "可获得经验值限额："), maxInputNode]
+                      ),
+                    ]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "会员分享商城页面可获得的经验值"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "COMMENT") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "对已购买商品完成提交评论获得经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "仅针对评论字数大于30字的评论进行发放"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "FOLLOW_STORE") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center", marginRight: "16px" } },
+                        [h("span", { style: { marginRight: "8px" } }, "获得经验值："), inputNode]
+                      ),
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center" } },
+                        [h("span", { style: { marginRight: "8px" } }, "可获得经验值限额："), maxInputNode]
+                      ),
+                    ]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "关注店铺可获得经验值，每个客户D相同店铺仅第一次关注可进行获得"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "PROFILE") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "获得经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "完善个人基本信息可获得经验值，每个会员仅可获得一次"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "BIND_WECHAT") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "获取经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "绑定微信成功获得经验值，每个会员仅可获得一次"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "ADD_ADDRESS") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "获取经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "添加收货地址后获得经验值，每个会员仅可获得一次"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "SHARE_REGISTER") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center", marginRight: "16px" } },
+                        [h("span", { style: { marginRight: "8px" } }, "获取的经验值："), inputNode]
+                      ),
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center" } },
+                        [h("span", { style: { marginRight: "8px" } }, "可获得经验值限额："), maxInputNode]
+                      ),
+                    ]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "仅被注册成功后才可获得相应奖励经验值"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "SHARE_BUY") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center", marginRight: "16px" } },
+                        [h("span", { style: { marginRight: "8px" } }, "获取的经验值："), inputNode]
+                      ),
+                      h(
+                        "div",
+                        { style: { display: "flex", alignItems: "center" } },
+                        [h("span", { style: { marginRight: "8px" } }, "可获得经验值限额："), maxInputNode]
+                      ),
+                    ]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "仅被购买成功后才可获得相应奖励经验值"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "SIGN_IN") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "获取的经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "客户每日签到后可获的经验值"
+                  ),
+                ]
+              );
+            }
+            if (params.row.ruleKey === "CONSUME") {
+              return h(
+                "div",
+                { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" } },
+                [
+                  h(
+                    "div",
+                    { style: { display: "flex", alignItems: "center", flexWrap: "wrap" } },
+                    [h("span", { style: { marginRight: "8px" } }, "1元获取经验值："), inputNode]
+                  ),
+                  h(
+                    "div",
+                    { style: { marginTop: "6px", color: "#808695", fontSize: "12px" } },
+                    "客户消费1元可获取经验值，向下取整"
+                  ),
+                ]
+              );
+            }
+            return inputNode;
+          },
+        },
+      ],
+    };
+  },
+  mounted() {
+    this.loadData();
+  },
+  methods: {
+    getRawInputValue(v) {
+      return v && v.target ? v.target.value : v;
+    },
+    updateRuleEnabled(index, enabled) {
+      const item = this.form.items[index] || {};
+      this.$set(this.form.items, index, {
+        ...item,
+        enabled: !!enabled,
+      });
+    },
+    updateRuleValue(index, v) {
+      const raw = this.getRawInputValue(v);
+      const next = Number(raw);
+      const item = this.form.items[index] || {};
+      this.$set(this.form.items, index, {
+        ...item,
+        value: Number.isFinite(next) ? next : null,
+      });
+    },
+    commitRuleValue(index) {
+      const item = this.form.items[index] || {};
+      const next = Number(item.value);
+      let value = 1;
+      if (Number.isFinite(next)) {
+        if (next < 1) value = 1;
+        else if (next > 100) value = 100;
+        else value = Math.floor(next);
+      }
+      this.$set(this.form.items, index, {
+        ...item,
+        value,
+      });
+    },
+    updateRuleMaxValue(index, v) {
+      const raw = this.getRawInputValue(v);
+      const item = this.form.items[index] || {};
+      if (raw == null || raw === "") {
+        this.$set(this.form.items, index, {
+          ...item,
+          maxValue: null,
+        });
+        return;
+      }
+      const next = Number(raw);
+      this.$set(this.form.items, index, {
+        ...item,
+        maxValue: Number.isFinite(next) ? next : null,
+      });
+    },
+    commitRuleMaxValue(index) {
+      const item = this.form.items[index] || {};
+      if (item.maxValue == null || item.maxValue === "") {
+        this.$set(this.form.items, index, {
+          ...item,
+          maxValue: null,
+        });
+        return;
+      }
+      const next = Number(item.maxValue);
+      this.$set(this.form.items, index, {
+        ...item,
+        maxValue: Number.isFinite(next) && next >= 1 ? Math.floor(next) : null,
+      });
+    },
+    normalizeConfig(val) {
+      if (!val) return {};
+      if (typeof val === "string") {
+        try {
+          return JSON.parse(val);
+        } catch (e) {
+          return {};
+        }
+      }
+      if (typeof val === "object") return val;
+      return {};
+    },
+    normalizeItems(items) {
+      const map = {};
+      if (Array.isArray(items)) {
+        items.forEach((item) => {
+          if (!item || !item.ruleKey) return;
+          map[item.ruleKey] = item;
+        });
+      }
+      return RULE_OPTIONS.map((rule) => {
+        const hit = map[rule.ruleKey] || {};
+        return {
+          ruleKey: rule.ruleKey,
+          ruleName: hit.ruleName || rule.ruleName,
+          enabled: !!hit.enabled,
+          value: Number(hit.value) > 0 ? Number(hit.value) : 1,
+          maxValue: hit.maxValue == null || hit.maxValue === "" ? null : Number(hit.maxValue),
+        };
+      });
+    },
+    loadData() {
+      this.loading = true;
+      getSetting("EXPERIENCE_SETTING")
+        .then((res) => {
+          if (res && res.success) {
+            const cfg = this.normalizeConfig(res.result);
+            this.form = {
+              items: this.normalizeItems(cfg.items),
+              description: cfg.description || "",
+            };
+          } else {
+            this.form = defaultForm();
+          }
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    validateForm() {
+      const invalid = this.form.items.find((item) => {
+        const v = Number(item.value);
+        if (!Number.isInteger(v) || v < 1 || v > 100) return true;
+        if (item.maxValue != null && item.maxValue !== "") {
+          const m = Number(item.maxValue);
+          if (!Number.isInteger(m) || m < 1) return true;
+        }
+        return false;
+      });
+      if (invalid) {
+        this.$Message.error("请检查经验值配置，经验值范围为1-100，限额需为正整数");
+        return false;
+      }
+      return true;
+    },
+    submit() {
+      if (!this.validateForm()) return;
+      const payload = {
+        items: this.form.items.map((item) => ({
+          ruleKey: item.ruleKey,
+          ruleName: item.ruleName,
+          enabled: !!item.enabled,
+          value: Number(item.value),
+          maxValue: item.maxValue == null || item.maxValue === "" ? null : Number(item.maxValue),
+        })),
+        description: this.form.description || "",
+      };
+      this.submitLoading = true;
+      setSetting("EXPERIENCE_SETTING", payload)
+        .then((res) => {
+          if (res && res.success) {
+            this.$Message.success("保存成功");
+          }
+        })
+        .finally(() => {
+          this.submitLoading = false;
+        });
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.experience-setting {
+  padding: 2px 0;
+}
+
+::v-deep .experience-table .ivu-table th {
+  background: #fafbfc;
+}
+
+::v-deep .experience-table .ivu-table td {
+  padding-top: 12px;
+  padding-bottom: 12px;
+}
+
+::v-deep .experience-table .ivu-table-cell {
+  font-size: 13px;
+  line-height: 1.7;
+}
+
+::v-deep .desc-item .ivu-form-item-label {
+  font-size: 16px;
+  font-weight: 600;
+}
+</style>
--- a/manager/src/views/member/grade/index.vue
+++ b/manager/src/views/member/grade/index.vue
@@ -0,0 +1,547 @@
+<template>
+  <div class="search">
+    <Card>
+      <Row class="operation padding-row">
+        <Button type="primary" @click="openAdd">添加客户等级</Button>
+      </Row>
+      <Table
+        :loading="loading"
+        border
+        :columns="columns"
+        :data="data"
+        class="mt_10"
+      ></Table>
+    </Card>
+
+    <Modal v-model="addFlag" title="添加客户等级" width="720" :z-index="950" :mask-closable="false">
+      <Form ref="addForm" :model="formAdd" :rules="rules" :label-width="110">
+        <FormItem label="等级名称" prop="gradeName">
+          <Input v-model="formAdd.gradeName" maxlength="50" placeholder="请输入等级名称" />
+        </FormItem>
+        <FormItem label="是否默认" prop="isDefault">
+          <RadioGroup v-model="formAdd.isDefault">
+            <Radio :label="true">是</Radio>
+            <Radio :label="false">否</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="等级图标" prop="gradeImage">
+          <upload-pic-input v-model="formAdd.gradeImage"></upload-pic-input>
+        </FormItem>
+        <FormItem label="等级背景图" prop="gradeBackground">
+          <upload-pic-input v-model="formAdd.gradeBackground"></upload-pic-input>
+        </FormItem>
+        <FormItem label="字体颜色" prop="gradeFontColor">
+          <Input v-model="formAdd.gradeFontColor" maxlength="20" placeholder="如：#333333" />
+        </FormItem>
+        <FormItem label="所需经验值" prop="requiredExperience">
+          <InputNumber v-model="formAdd.requiredExperience" :min="1" :precision="0" style="width: 220px"></InputNumber>
+        </FormItem>
+        <FormItem label="等级排序" prop="gradeSort">
+          <InputNumber v-model="formAdd.gradeSort" :min="1" :max="9999" :precision="0" style="width: 220px"></InputNumber>
+        </FormItem>
+        <FormItem label="等级开关" prop="gradeState">
+          <RadioGroup v-model="formAdd.gradeState">
+            <Radio label="OPEN">开启</Radio>
+            <Radio label="CLOSE">关闭</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="关联权益" prop="benefitIds">
+          <Select
+            :value="addBenefitOrder"
+            multiple
+            filterable
+            placeholder="请选择客户权益"
+            style="width: 100%"
+            @on-change="onAddBenefitIdsChange"
+          >
+            <Option v-for="b in benefitOptions" :key="b.id" :value="String(b.id)">{{ benefitOptionLabel(b) }}</Option>
+          </Select>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="addFlag = false">取消</Button>
+        <Button type="primary" :loading="submitAddLoading" @click="submitAdd">确定</Button>
+      </div>
+    </Modal>
+
+    <Modal v-model="editFlag" title="编辑客户等级" width="720" :z-index="950" :mask-closable="false">
+      <Form ref="editForm" :model="formEdit" :rules="rules" :label-width="110">
+        <Input v-model="formEdit.id" v-show="false" />
+        <FormItem label="等级名称" prop="gradeName">
+          <Input v-model="formEdit.gradeName" maxlength="50" placeholder="请输入等级名称" />
+        </FormItem>
+        <FormItem label="是否默认" prop="isDefault">
+          <RadioGroup v-model="formEdit.isDefault">
+            <Radio :label="true">是</Radio>
+            <Radio :label="false">否</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="等级图标" prop="gradeImage">
+          <upload-pic-input v-model="formEdit.gradeImage"></upload-pic-input>
+        </FormItem>
+        <FormItem label="等级背景图" prop="gradeBackground">
+          <upload-pic-input v-model="formEdit.gradeBackground"></upload-pic-input>
+        </FormItem>
+        <FormItem label="字体颜色" prop="gradeFontColor">
+          <Input v-model="formEdit.gradeFontColor" maxlength="20" placeholder="如：#333333" />
+        </FormItem>
+        <FormItem label="所需经验值" prop="requiredExperience">
+          <InputNumber v-model="formEdit.requiredExperience" :min="1" :precision="0" style="width: 220px"></InputNumber>
+        </FormItem>
+        <FormItem label="等级排序" prop="gradeSort">
+          <InputNumber v-model="formEdit.gradeSort" :min="1" :max="9999" :precision="0" style="width: 220px"></InputNumber>
+        </FormItem>
+        <FormItem label="等级开关" prop="gradeState">
+          <RadioGroup v-model="formEdit.gradeState">
+            <Radio label="OPEN">开启</Radio>
+            <Radio label="CLOSE">关闭</Radio>
+          </RadioGroup>
+        </FormItem>
+        <FormItem label="关联权益" prop="benefitIds">
+          <Select
+            :value="editBenefitOrder"
+            multiple
+            filterable
+            placeholder="请选择客户权益"
+            style="width: 100%"
+            @on-change="onEditBenefitIdsChange"
+          >
+            <Option v-for="b in benefitOptions" :key="b.id" :value="String(b.id)">{{ benefitOptionLabel(b) }}</Option>
+          </Select>
+        </FormItem>
+      </Form>
+      <div slot="footer">
+        <Button @click="editFlag = false">取消</Button>
+        <Button type="primary" :loading="submitEditLoading" @click="submitEdit">确定</Button>
+      </div>
+    </Modal>
+  </div>
+</template>
+
+<script>
+import * as API_Member from "@/api/member.js";
+import uploadPicInput from "@/components/lili/upload-pic-input";
+
+const buildDefaultForm = () => ({
+  id: "",
+  gradeName: "",
+  isDefault: false,
+  gradeImage: "",
+  gradeBackground: "",
+  gradeFontColor: "",
+  requiredExperience: 1,
+  gradeSort: 1,
+  gradeState: "OPEN",
+  benefitIds: "",
+});
+
+/** 权益多选：新勾选追加到末尾，取消勾选移除，保持已有顺序 */
+function syncOrderedBenefitIds(prevOrder, selected) {
+  const sel = Array.isArray(selected) ? selected.map((id) => String(id)) : [];
+  const out = [];
+  (prevOrder || []).forEach((id) => {
+    const s = String(id);
+    if (sel.includes(s)) out.push(s);
+  });
+  sel.forEach((s) => {
+    if (!out.includes(s)) out.push(s);
+  });
+  return out;
+}
+
+export default {
+  name: "memberGrade",
+  components: {
+    uploadPicInput,
+  },
+  data() {
+    return {
+      loading: true,
+      columns: [
+        {
+          title: "等级名称",
+          key: "gradeName",
+          width: 130,
+          tooltip: true,
+        },
+        {
+          title: "默认等级",
+          key: "isDefault",
+          width: 95,
+          render: (h, params) => {
+            const yes = params.row.isDefault === true;
+            return h(
+              "Tag",
+              {
+                props: {
+                  color: yes ? "success" : "default",
+                },
+              },
+              yes ? "是" : "否"
+            );
+          },
+        },
+        {
+          title: "等级图标",
+          key: "gradeImage",
+          width: 100,
+          render: (h, params) => {
+            if (!params.row.gradeImage) return h("span", "-");
+            return h("img", {
+              attrs: {
+                src: params.row.gradeImage,
+                alt: "等级图标",
+              },
+              style: {
+                width: "48px",
+                height: "48px",
+                objectFit: "contain",
+                border: "1px solid #dcdee2",
+                borderRadius: "4px",
+                background: "#fff",
+              },
+            });
+          },
+        },
+        {
+          title: "等级背景图",
+          key: "gradeBackground",
+          width: 120,
+          render: (h, params) => {
+            if (!params.row.gradeBackground) return h("span", "-");
+            return h("img", {
+              attrs: {
+                src: params.row.gradeBackground,
+                alt: "等级背景图",
+              },
+              style: {
+                width: "64px",
+                height: "40px",
+                objectFit: "cover",
+                border: "1px solid #dcdee2",
+                borderRadius: "4px",
+                background: "#fff",
+              },
+            });
+          },
+        },
+        {
+          title: "所需经验值",
+          key: "requiredExperience",
+          width: 110,
+        },
+        {
+          title: "等级排序",
+          key: "gradeSort",
+          width: 95,
+        },
+        {
+          title: "状态",
+          key: "gradeState",
+          width: 118,
+          align: "center",
+          render: (h, params) => {
+            const row = params.row;
+            return h("i-switch", {
+              props: {
+                value: row.gradeState === "OPEN",
+                size: "large",
+                loading: !!row._gradeStateLoading,
+              },
+              on: {
+                "on-change": (checked) => {
+                  this.onGradeStateSwitch(row, checked);
+                },
+              },
+            }, [
+              h("span", { slot: "open" }, "开启"),
+              h("span", { slot: "close" }, "关闭"),
+            ]);
+          },
+        },
+        {
+          title: "操作",
+          key: "action",
+          align: "center",
+          width: 130,
+          render: (h, params) => {
+            const linkStyle = {
+              color: "#2d8cf0",
+              cursor: "pointer",
+              textDecoration: "none",
+            };
+            const sep = h(
+              "span",
+              { style: { margin: "0 8px", color: "#dcdee2" } },
+              "|"
+            );
+            return h(
+              "div",
+              { class: "ops", style: { display: "flex", justifyContent: "center" } },
+              [
+                h(
+                  "a",
+                  { style: linkStyle, on: { click: () => this.openEdit(params.row) } },
+                  "编辑"
+                ),
+                sep,
+                h(
+                  "a",
+                  { style: linkStyle, on: { click: () => this.remove(params.row) } },
+                  "删除"
+                ),
+              ]
+            );
+          },
+        },
+      ],
+      data: [],
+      addFlag: false,
+      editFlag: false,
+      submitAddLoading: false,
+      submitEditLoading: false,
+      formAdd: buildDefaultForm(),
+      formEdit: buildDefaultForm(),
+      /** 关联权益 id 顺序（与 benefitIds 一致） */
+      addBenefitOrder: [],
+      editBenefitOrder: [],
+      benefitOptions: [],
+      benefitTypeOptions: [],
+      benefitOptionsLoading: false,
+      editDetailLoading: false,
+      rules: {
+        gradeName: [{ required: true, message: "请输入等级名称", trigger: "blur" }],
+        gradeImage: [{ required: true, message: "请上传等级图标", trigger: "change" }],
+        requiredExperience: [{ required: true, type: "number", message: "请输入所需经验值", trigger: "change" }],
+        gradeSort: [{ required: true, type: "number", message: "请输入等级排序", trigger: "change" }],
+        gradeState: [{ required: true, message: "请选择等级开关", trigger: "change" }],
+      },
+    };
+  },
+  methods: {
+    benefitOptionLabel(b) {
+      if (!b) return "";
+      const name = b.benefitName || String(b.id);
+      const opt = this.benefitTypeOptions.find((o) => o.value === b.benefitType);
+      const typeText = opt ? opt.description : b.benefitType || "";
+      return typeText ? `${name}（${typeText}）` : name;
+    },
+    onAddBenefitIdsChange(val) {
+      this.addBenefitOrder = syncOrderedBenefitIds(this.addBenefitOrder, val);
+    },
+    onEditBenefitIdsChange(val) {
+      this.editBenefitOrder = syncOrderedBenefitIds(this.editBenefitOrder, val);
+    },
+    loadBenefitTypes() {
+      API_Member.getMemberBenefitTypes().then((res) => {
+        if (res && res.success && Array.isArray(res.result)) {
+          this.benefitTypeOptions = res.result;
+        } else {
+          this.benefitTypeOptions = [];
+        }
+      });
+    },
+    loadBenefitOptions() {
+      this.benefitOptionsLoading = true;
+      const pageSize = 500;
+      const fetchPage = (pageNumber) =>
+        API_Member.getMemberBenefitByPage({ pageNumber, pageSize, sort: "benefitSort", order: "asc" });
+      return fetchPage(1)
+        .then((res) => {
+          if (!(res && res.success && res.result)) {
+            this.benefitOptions = [];
+            return;
+          }
+          const records = Array.isArray(res.result.records) ? res.result.records : [];
+          const total = Number(res.result.total) || records.length;
+          let all = records.slice();
+          if (total > pageSize) {
+            const pages = Math.ceil(total / pageSize);
+            const rest = [];
+            for (let p = 2; p <= pages; p++) {
+              rest.push(fetchPage(p));
+            }
+            return Promise.all(rest).then((results) => {
+              results.forEach((r) => {
+                if (r && r.success && r.result && Array.isArray(r.result.records)) {
+                  all = all.concat(r.result.records);
+                }
+              });
+              this.benefitOptions = all;
+            });
+          }
+          this.benefitOptions = all;
+        })
+        .catch(() => {
+          this.benefitOptions = [];
+        })
+        .finally(() => {
+          this.benefitOptionsLoading = false;
+        });
+    },
+    parseBenefitIdsFromString(str) {
+      return String(str || "")
+        .split(",")
+        .map((s) => s.trim())
+        .filter(Boolean);
+    },
+    fillEditFormFromGrade(grade, benefitsOrderedIds) {
+      this.formEdit = {
+        id: grade.id || "",
+        gradeName: grade.gradeName || "",
+        isDefault: grade.isDefault === true,
+        gradeImage: grade.gradeImage || "",
+        gradeBackground: grade.gradeBackground || "",
+        gradeFontColor: grade.gradeFontColor || "",
+        requiredExperience: Number(grade.requiredExperience) > 0 ? Number(grade.requiredExperience) : 1,
+        gradeSort: Number(grade.gradeSort) > 0 ? Number(grade.gradeSort) : 1,
+        gradeState: grade.gradeState || "OPEN",
+        benefitIds: grade.benefitIds || "",
+      };
+      this.editBenefitOrder = (benefitsOrderedIds || []).map((id) => String(id));
+    },
+    init() {
+      this.getData();
+      this.loadBenefitTypes();
+      this.loadBenefitOptions();
+    },
+    getData() {
+      this.loading = true;
+      API_Member.getMemberGradeByPage().then((res) => {
+        this.loading = false;
+        if (res && res.success) {
+          this.data = Array.isArray(res.result) ? res.result : [];
+        }
+      });
+    },
+    openAdd() {
+      this.addFlag = true;
+      this.submitAddLoading = false;
+      if (!this.benefitOptions.length && !this.benefitOptionsLoading) {
+        this.loadBenefitOptions();
+      }
+      this.$nextTick(() => {
+        if (this.$refs.addForm) this.$refs.addForm.resetFields();
+        this.formAdd = buildDefaultForm();
+        this.addBenefitOrder = [];
+      });
+    },
+    submitAdd() {
+      this.$refs.addForm.validate((valid) => {
+        if (!valid) return;
+        this.submitAddLoading = true;
+        const { benefitIds: _omit, ...rest } = this.formAdd;
+        const payload = {
+          ...rest,
+          benefitIds: (this.addBenefitOrder || []).join(","),
+        };
+        API_Member.addMemberGrade(payload).then((res) => {
+          this.submitAddLoading = false;
+          if (res && res.success) {
+            this.$Message.success("添加成功");
+            this.addFlag = false;
+            this.getData();
+          }
+        });
+      });
+    },
+    openEdit(row) {
+      this.editFlag = true;
+      this.submitEditLoading = false;
+      this.editDetailLoading = true;
+      if (!this.benefitOptions.length && !this.benefitOptionsLoading) {
+        this.loadBenefitOptions();
+      }
+      this.$nextTick(() => {
+        if (this.$refs.editForm) this.$refs.editForm.resetFields();
+      });
+      API_Member.getMemberGrade(row.id)
+        .then((res) => {
+          this.editDetailLoading = false;
+          if (res && res.success && res.result) {
+            const raw = res.result;
+            const grade = raw.grade != null ? raw.grade : raw;
+            const benefits = Array.isArray(raw.benefits) ? raw.benefits : [];
+            const orderedIds = benefits.length
+              ? benefits.map((b) => b.id).filter((id) => id != null && id !== "")
+              : String(grade.benefitIds || "")
+                  .split(",")
+                  .map((s) => s.trim())
+                  .filter(Boolean);
+            this.fillEditFormFromGrade(grade, orderedIds);
+          } else {
+            this.fillEditFormFromGrade(row, this.parseBenefitIdsFromString(row.benefitIds));
+          }
+        })
+        .catch(() => {
+          this.editDetailLoading = false;
+          this.fillEditFormFromGrade(row, this.parseBenefitIdsFromString(row.benefitIds));
+        });
+    },
+    submitEdit() {
+      this.$refs.editForm.validate((valid) => {
+        if (!valid) return;
+        this.submitEditLoading = true;
+        const { id, benefitIds: _omit, ...rest } = this.formEdit;
+        const payload = {
+          ...rest,
+          benefitIds: (this.editBenefitOrder || []).join(","),
+        };
+        API_Member.updateMemberGrade(id, payload).then((res) => {
+          this.submitEditLoading = false;
+          if (res && res.success) {
+            this.$Message.success("修改成功");
+            this.editFlag = false;
+            this.getData();
+          }
+        });
+      });
+    },
+    onGradeStateSwitch(row, checked) {
+      const nextState = checked ? "OPEN" : "CLOSE";
+      const prevState = row.gradeState;
+      if (nextState === prevState) return;
+      const text = checked ? "开启" : "关闭";
+      this.$Modal.confirm({
+        title: "提示",
+        content: `<p>确定${text}该客户等级？</p>`,
+        onOk: () => {
+          this.$set(row, "_gradeStateLoading", true);
+          return API_Member.updateMemberGradeState(row.id, nextState)
+            .then((res) => {
+              this.$set(row, "_gradeStateLoading", false);
+              if (res && res.success) {
+                this.$Message.success(`${text}成功`);
+                this.$set(row, "gradeState", nextState);
+              } else {
+                this.getData();
+              }
+            })
+            .catch(() => {
+              this.$set(row, "_gradeStateLoading", false);
+            });
+        },
+      });
+    },
+    remove(row) {
+      this.$Modal.confirm({
+        title: "提示",
+        content: "<p>确定删除该客户等级？</p>",
+        onOk: () => {
+          API_Member.deleteMemberGrade(row.id).then((res) => {
+            if (res && res.success) {
+              this.$Message.success("删除成功");
+              this.getData();
+            } else if (res && res.message) {
+              this.$Message.error(res.message);
+            }
+          });
+        },
+      });
+    },
+  },
+  mounted() {
+    this.init();
+  },
+};
+</script>
--- a/manager/src/views/member/list/index.vue
+++ b/manager/src/views/member/list/index.vue
@@ -23,6 +23,11 @@
              <Option v-for="item in memberGroupList" :value="item.id" :key="item.id">{{ item.groupName }}</Option>
            </Select>
          </Form-item>
+          <Form-item label="会员等级" prop="gradeId">
+            <Select v-model="searchForm.gradeId" clearable filterable style="width: 240px">
+              <Option v-for="item in memberGradeList" :value="item.id" :key="item.id">{{ item.gradeName }}</Option>
+            </Select>
+          </Form-item>
          <Button @click="handleSearch" class="search-btn" type="primary" icon="ios-search">搜索</Button>
        </Form>
      </Row>
@@ -255,6 +260,7 @@ export default {
        groupId: [{ required: true, message: "请选择会员分组", trigger: "change" }],
      },
      memberGroupList: [],
+      memberGradeList: [],
      memberPointRule: {
        type: [{ required: true, message: "请选择类型", trigger: "change" }],
        point: [
@@ -358,6 +364,23 @@ export default {
            );
          },
        },
+        {
+          title: "经验值",
+          key: "experience",
+          minWidth: 100,
+          render: (h, params) => {
+            return h("div", {}, params.row.experience == null ? "0" : params.row.experience);
+          },
+        },
+        {
+          title: "会员等级",
+          key: "gradeName",
+          minWidth: 120,
+          tooltip: true,
+          render: (h, params) => {
+            return h("div", {}, params.row.gradeName || "-");
+          },
+        },
        {
          title: "余额",
          key: "memberWallet",
@@ -589,6 +612,13 @@ export default {
        }
      });
    },
+    loadMemberGradeList() {
+      API_Member.getMemberGradeByPage({ pageNumber: 1, pageSize: 1000 }).then((res) => {
+        if (res && res.success && res.result) {
+          this.memberGradeList = res.result || [];
+        }
+      });
+    },
    clearSelection() {
      if (this.$refs.table && this.$refs.table.clearSelection) {
        this.$refs.table.clearSelection();
@@ -867,6 +897,7 @@ export default {
    this.getData();
    if (!this.selectedMember) {
      this.loadMemberGroupList();
+      this.loadMemberGradeList();
    }
  },
 };
--- a/manager/src/views/promotions/coupon/coupon.vue
+++ b/manager/src/views/promotions/coupon/coupon.vue
@@ -127,6 +127,7 @@ import {
 import {
  promotionsStatusRender,
  promotionsScopeTypeRender,
+  promotionsCouponActivityTimeRender,
 } from "@/utils/promotions";

 export default {
@@ -148,13 +149,14 @@ export default {
        // 表头
        {
          type: "selection",
-          width: 100,
+          width: 52,
          align: "center",
-          fixed: "left",
+          /* 不使用 fixed：左侧固定列与主体表格分开渲染，叠加全局 .ivu-table table{width:100%} 易在接缝处留白；勾选列无需横向钉住 */
        },
        {
          title: "优惠券名称",
          key: "couponName",
+          minWidth: 140,
          width: 180,
          tooltip: true,
        },
@@ -238,21 +240,7 @@ export default {
        {
          title: "活动时间",
          width: 200,
-          render: (h, params) => {
-            if (
-              params?.row?.getType === "ACTIVITY" &&
-              params?.row?.rangeDayType === "DYNAMICTIME"
-            ) {
-              return h("div", "长期有效");
-            } else if (params?.row?.startTime && params?.row?.endTime) {
-              return h("div", {
-                domProps: {
-                  innerHTML:
-                    params.row.startTime + "<br/>" + params.row.endTime,
-                },
-              });
-            }
-          },
+          render: promotionsCouponActivityTimeRender,
        },
        {
          title: "状态",
--- a/manager/src/views/sys/setting-manage/authLogin/WECHAT_CONNECT.vue
+++ b/manager/src/views/sys/setting-manage/authLogin/WECHAT_CONNECT.vue
@@ -55,10 +55,10 @@ export default {
    return {
      ruleValidate: {}, // 验证规则
      way: { // 类型
-        APP: "移动应用端",
-        H5: "移动端",
-        WECHAT_MP: "小程序端",
-        PC: "PC端",
+        APP: "APP",
+        H5: "手机网页（微商城）",
+        WECHAT_MP: "微信小程序",
+        PC: "WEB网页",
      },
      formValidate: {} // 表单数据
    };