修改审核页面，添加积分审核代办，积分审核已办，协议审核代办，协议审核代办，修改规则分页显示bug，修改订购问题BUG

p-honggang.li

8 天以前 b9271e9537308854e20d7e6c7af2c77d8475a288

 src/views/pointsManage/ruleList/index.vue

@@ -1,98 +1,116 @@
<template>
  <div class="points-rule-list">
    <!-- 页面标题 -->
    <div class="page-title">积分规则管理</div>
    <!-- 列表页面 -->
    <div v-if="currentView === 'list'">
      <!-- 页面标题 -->
      <div class="page-title">积分规则管理</div>

    <!-- 规则列表卡片 -->
    <el-card shadow="never" class="rule-list-card">
      <!-- 筛选条件 -->
      <div class="filter-section">
        <div class="filter-row">
          <div class="filter-item">
            <span class="filter-label">生效时间:</span>
            <el-date-picker
                v-model="queryParams.dateRange"
                type="datetimerange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                format="YYYY-MM-DD HH:mm:ss"
                value-format="YYYY-MM-DD HH:mm:ss"
      <!-- 规则列表卡片 -->
      <el-card shadow="never" class="rule-list-card">
        <!-- 筛选条件 -->
        <div class="filter-section">
          <div class="filter-row">
            <div class="filter-item">
              <span class="filter-label">生效时间:</span>
              <el-date-picker
                  v-model="queryParams.dateRange"
                  type="datetimerange"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  format="YYYY-MM-DD HH:mm:ss"
                  date-format="YYYY-MM-DD"
                  time-format="HH:mm:ss"
                style="margin-left: 8px;"
                @change="handleDateChange"
              />
          </div>
          
        </div>
        <div class="filter-actions">
          <el-button type="primary" @click="queryData">
            <el-icon><Search /></el-icon>
            查询
          </el-button>
          <el-button @click="resetQuery">
            <el-icon><Refresh /></el-icon>
            重置
          </el-button>
        </div>
      </div>
                  style="margin-left: 8px;"
                  @change="handleDateChange"
                />
            </div>

      <!-- 规则表格 -->
      <div class="table-section">
        <el-table :data="ruleList" stripe style="width: 100%">
          <el-table-column prop="id" label="序号" width="80" align="center" />
          <el-table-column prop="pointsName" label="名称"  align="ceter">
            <template #default="{ row }">
                 {{ row.pointsName}}{{ row.updatedAt}}V{{ row.version }}
            </template>
          </el-table-column>
      
          <el-table-column prop="effectiveStart" label="开始生效时间"   align="center" />
          <el-table-column prop="modifierName" label="修改人"  align="center" />
        
          <el-table-column label="操作"  align="center" fixed="right">
            <template #default="{ row }">
              <el-button type="primary" size="small" @click="editRule(row)">查看</el-button>
              <el-button type="primary" size="small" @click="editRule(row)">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页 -->
        <div class="pagination-section">
          <div class="pagination-info">
            共{{ total }}条
          </div>
          <el-pagination
            v-model:current-page="queryParams.pageNum"
            v-model:page-size="queryParams.pageSize"
            :page-sizes="[10, 20, 50, 100]"
            :total="total"
            layout="sizes, prev, pager, next, jumper"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
          />
          <div class="filter-actions">
            <el-button type="primary" @click="queryData">
              <el-icon><Search /></el-icon>
              查询
            </el-button>
            <el-button @click="resetQuery">
              <el-icon><Refresh /></el-icon>
              重置
            </el-button>
          </div>
        </div>
      </div>
    </el-card>

        <!-- 规则表格 -->
        <div class="table-section">
          <el-table :data="ruleList" stripe style="width: 100%">
            <el-table-column type="index" label="序号" width="80" align="center" />
            <el-table-column prop="pointsName" label="名称"  align="ceter">
              <template #default="{ row }">
                   {{ row.pointsName}}{{ dayjs(row.updatedAt).format('YYYYMMDD')}}V{{ row.version }}
              </template>
            </el-table-column>

            <el-table-column prop="effectiveStart" label="开始生效时间"   align="center" />
            <el-table-column prop="modifierName" label="修改人"  align="center" />

            <el-table-column label="操作"  align="center" fixed="right">
              <template #default="{ row }">
                <el-button type="primary" size="small" @click="viewRule(row)">查看</el-button>
                <el-button type="primary" size="small" @click="editRule(row)">编辑</el-button>
              </template>
            </el-table-column>
          </el-table>

          <!-- 分页 -->
          <div class="pagination-section">
            <div class="pagination-info">
              共{{ total }}条
            </div>
            <el-pagination
              v-model:current-page="queryParams.pageNum"
              v-model:page-size="queryParams.pageSize"
              :page-sizes="[10, 20, 50, 100]"
              :total="total"
              layout="sizes, prev, pager, next, jumper"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
            />
          </div>
        </div>
      </el-card>
    </div>

    <!-- 编辑页面 -->
    <div v-if="currentView === 'edit'" class="edit-container">
      <SettingsComponent 
        :ruleId="currentRuleId"
        @goBack="goBackToList"
        @saveSuccess="handleSaveSuccess"
      />
    </div>

    <!-- 查看详情页面 -->
    <div v-if="currentView === 'view'" class="view-container">
      <RuleDetailComponent 
        :ruleId="currentRuleId"
        @goBack="goBackToList"
      />
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { dayjs, ElMessage } from 'element-plus'
import { Search, Refresh } from '@element-plus/icons-vue'
import pointsApi from '@/api/pointsApi'
import type { PointsRule, PointsQueryParams } from '@/types/points'
// 导入路由钩子
import { useRouter } from 'vue-router'
import SettingsComponent from '@/views/pointsManage/settings/index.vue'
import RuleDetailComponent from '@/views/pointsManage/ruleDetail/index.vue'

// 当前视图状态：'list' | 'edit' | 'view'
const currentView = ref<'list' | 'edit' | 'view'>('list')

// 查询参数
const queryParams = reactive<PointsQueryParams>({
 // ruleType: '',
 // category: '',
 // status: '',
  dateRange: '',
  pageNum: 1,
  pageSize: 10,
@@ -103,6 +121,9 @@

// 总数
const total = ref(0)

// 当前选中的规则ID
const currentRuleId = ref<string>('')

// 页面加载时获取数据
onMounted(() => {
@@ -115,7 +136,7 @@
    const res = await pointsApi.getPointsRules(queryParams)
    // 模拟分页数据
    ruleList.value = res.data.list || []
    total.value = ruleList.value.length
    total.value = res.data.total
  } catch (error) {
    ElMessage.error('获取积分规则失败')
    console.error('获取积分规则失败:', error)
@@ -144,65 +165,41 @@
  queryData()
}

// 获取规则类型标签
const getRuleTypeLabel = (type: string) => {
  const typeMap: Record<string, string> = {
    acquisition: '获取',
    consumption: '消耗',
    conversion: '转换',
  }
  return typeMap[type] || type
}

// 获取分类标签
const getCategoryLabel = (category: string) => {
  const categoryMap: Record<string, string> = {
    resource_contribution: '资源贡献',
    resource_transaction: '资源交易',
    resource_dissemination: '资源传播',
    user_participation: '用户参与',
    other: '其他',
  }
  return categoryMap[category] || category
}

// 处理状态变化
const handleStatusChange = async (row: PointsRule) => {
  try {
    await pointsApi.savePointsRules({
      id: row.id,
      status: row.status
    })
    ElMessage.success('状态更新成功')
  } catch (error) {
    ElMessage.error('状态更新失败')
    // 恢复原来的状态
    row.status = row.status === 1 ? 0 : 1
    console.error('更新规则状态失败:', error)
  }
}

// 处理日期变化
const handleDateChange = (dates: [string, string] | null) => {
  if (dates) {
    queryParams.effectiveStartTime = dates[0]
    queryParams.effectiveEndTime = dates[1]
    queryParams.effectiveStartTime = dayjs(dates[0]).format('YYYY-MM-DD HH:mm:ss');
    queryParams.effectiveEndTime = dayjs(dates[1]).format('YYYY-MM-DD HH:mm:ss');
  } else {
    queryParams.effectiveStartTime = ''
    queryParams.effectiveEndTime = ''
  }
}

// 创建路由实例
const router = useRouter()

// 编辑规则
const editRule = (row: PointsRule) => {
  // 跳转到规则设置界面，并传入规则id
  router.push({
    path: '/points/settings',
    query: { ruleId: row.id }
  })
  currentRuleId.value = row.id?.toString() || ''
  currentView.value = 'edit'
}

// 查看规则
const viewRule = (row: PointsRule) => {
  currentRuleId.value = row.id?.toString() || ''
  currentView.value = 'view'
}

// 返回列表页面
const goBackToList = () => {
  currentView.value = 'list'
  currentRuleId.value = ''
}

// 处理保存成功
const handleSaveSuccess = () => {
  // ElMessage.success('保存成功')
  goBackToList()
  // 重新加载列表数据
  queryData()
}
</script>

@@ -265,5 +262,11 @@
      }
    }
  }

  .edit-container,
  .view-container {
    // 确保组件能够正确显示
    width: 100%;
  }
}
</style>
</style>