查看历史 -Go服务器开发

根据您提供的代码，我注意到在循环中存在问题。为了正确展示步骤条，您需要调整模板代码。请参考以下修改后的代码：

<template>
  <div>
    <a-row style="margin-left: 70px; margin-top: 20px">
      <a-button style="margin-right: 10px" @click="showSteps">查看历史</a-button>
    </a-row>

    <a-modal v-model="changeModal" :footer="null">
      <h3 style="text-align: center;">流程查看</h3>
      <div class="check-steps">
        <a-steps direction="vertical" :current="currentNum.length - 1" class="steps-style" :status="currentNum[currentNum.length - 1].operateType === '拒绝' ? 'error' : 'finish'">
          <template v-for="(current, index) in currentNum">
            <a-step :key="index" :title="current.operateNode">
              <template slot="description">
                <div class="desc-info" style="margin-top: 15px">
                  <div>{{ formatDateTime(current.examDt) }}</div>
                  <div v-if="current.operateType === '拒绝'" style="color: #d53d2a;">{{ current.operateType }}</div>
                  <div v-else style="color: #2eabff;">{{ current.operateType }}</div>
                </div>
              </template>
            </a-step>
          </template>
        </a-steps>
      </div>
    </a-modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      changeModal: false, // 控制模态框显示与隐藏的变量
      currentNum: [], // 假设这是用于显示历史记录的数据
    }
  },
  methods: {
    showSteps() { // 显示步骤条模态框
      console.log(this.formState); // 打印表单状态
      this.changeModal = true; // 设置 changeModal 为 true，显示模态框
      // 发起 HTTP POST 请求获取历史记录数据
      this.$http
        .post(`/gw/api/acm-service/aomUse/aomExamLogQuery`, { docExamSeq: this.formState.docExamseg })
        .then(response => {
          let data = response.data;
          this.currentNum = data; // 将获取到的历史记录数据赋值给 currentNum
          console.log(this.currentNum, 'this.currentNum');
        })
        .catch(error => {
          console.error(error);
        });
    }
  }
}
</script>

在修改后的代码中，我将循环移动到 <template> 标签上，并将其应用于每个 a-step 元素。这样就可以正确地展示步骤条，并且不会出现重复循环的问题。

请尝试使用上述代码进行调整，并确保您的数据源 currentNum 包含正确的历史记录数据。如果还有其他问题，请提供更多详细信息，以便我们能够帮助您进一步。

内容由零声教学AI助手提供，问题来源于学员提问