zhxy-jsd/src/pages/view/hr/jsQj/cxTj.vue

<template>
  <BasicLayout>
    <view class="p-15">
      <view class="info-card">
        <view class="card-header">
          <text class="card-title">重新提交请假申请</text>
        </view>
        <view class="card-content">
          <text class="info-text">您的请假申请已被驳回，请修改后重新提交。</text>
        </view>
      </view>
      
      <!-- 使用请假申请组件 -->
      <JsQjEdit :data="qjData" />
    </view>
  </BasicLayout>
</template>

<script setup lang="ts">
import { findQjById } from "@/api/base/jsQjApi";
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "vue";
import JsQjEdit from "./components/jsQjEdit.vue";

const qjId = ref<string>();
const qjData = ref<any>({});

// 加载请假信息
const loadQjData = async () => {
  try {
    const result = await findQjById({ id: qjId.value });
    if (result.code === 1) {
      qjData.value = result.data;
    }
  } catch (error) {
    console.error('获取请假信息失败:', error);
  }
};

onLoad((options) => {
  if (options.qjId) {
    qjId.value = options.qjId;
    loadQjData();
  }
});
</script>

<style lang="scss" scoped>
.info-card {
  background: white;
  border-radius: 8px;
  margin-bottom: 15px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.card-header {
  padding: 15px;
  border-bottom: 1px solid #eee;
  
  .card-title {
    font-size: 16px;
    font-weight: bold;
    color: #333;
  }
}

.card-content {
  padding: 15px;
  
  .info-text {
    font-size: 14px;
    color: #666;
    line-height: 1.5;
  }
}
</style>