<template>
  <view class="page-container">

    <view class="common-card-list" style=" ">
      <up-card
          :border="false"
          :foot-border-top="false"
          v-for="(item,index) in planInfo"
          :key="`${item.planNo}_${index}`"
      >
        <!-- 自定义标题区域 -->
        <template #head>
          <view class="card-header">
            <view class="common-card-title common-name">{{ item.planName || '无计划名称' }}{{
                item.planName || '无计划名称'
              }}
            </view>
            <!-- 已失效标识 -->
            <view v-show="item.finishState == 3 " class="common-invalid-tag">已失效</view>
            <view v-show="item.finishState == 2 " class="common-finish-tag">已完成</view>
          </view>
        </template>

        <template #body>
          <view class="card-body">

              <!--                <up-button-->
              <!--                    v-if="item.finishState ==3"-->
              <!--                    type="primary"-->
              <!--                    size="mini"-->
              <!--                    @click=""-->
              <!--                    class="submit-record-btn"-->
              <!--                    :disabled="true"-->
              <!--                >-->
              <!--                  补交记录-->
              <!--                </up-button>-->

              <!--                <up-button-->
              <!--                    v-if="item.finishState !== 3 && item.planFinishNum > 0"-->
              <!--                    type="primary"-->
              <!--                    size="mini"-->
              <!--                    @click="gotoFinishPlanDetail(item)"-->
              <!--                    class="submit-record-btn"-->
              <!--                >-->
              <!--                  提交记录-->
              <!--                </up-button>-->
              <!--              </view>-->
              <view class="common-custom-btn disable" style="--btn-top: 120px;" v-if="item.finishState ==3">
                补交记录
              </view>
              <view class="common-custom-btn " style="--btn-top: 120px;"
                    v-if="item.finishState !== 3 && item.planFinishNum > 0" @click="gotoFinishPlanDetail(item)">
                提交记录
              </view>
              <view class="u-body-item u-flex">
                <view class="u-body-item-title">计划编码：</view>
                <view class="u-line-1 u-body-value">{{ item.planNo || '-' }}</view>
              </view>
              <view class="u-body-item u-flex">
                <view class="u-body-item-title">养护周期：</view>
                <view class="u-line-1 u-body-value">{{ item.rate || '-' }}
                  {{ uni.$dict.getDictLabel('cycle_id_type', item.cycleId) }}
                </view>
              </view>

              <view class="u-body-item u-flex common-item-center common-justify-between">
                <view class="u-body-item-title">计划完成次数： {{ item.planNum || 0 }}</view>
                <!--              <view class="">-->
                <!--                <up-button-->
                <!--                    v-if="item.finishState ==3"-->
                <!--                    type="primary"-->
                <!--                    size="mini"-->
                <!--                    @click=""-->
                <!--                    class="submit-record-btn"-->
                <!--                    :disabled="true"-->
                <!--                >-->
                <!--                  补交记录-->
                <!--                </up-button>-->

                <!--                <up-button-->
                <!--                    v-if="item.finishState !== 3 && item.planFinishNum > 0"-->
                <!--                    type="primary"-->
                <!--                    size="mini"-->
                <!--                    @click="gotoFinishPlanDetail(item)"-->
                <!--                    class="submit-record-btn"-->
                <!--                >-->
                <!--                  提交记录-->
                <!--                </up-button>-->
                <!--              </view>-->
              </view>

              <view class="u-body-item u-flex">
                <view class="u-body-item-title">已完成次数：</view>
                <view class="u-line-1 u-body-value">{{ item.planFinishNum || 0 }}</view>
              </view>

              <view class="u-body-item u-flex">
                <view class="u-body-item-title">计划有效期：</view>
                <view class="u-line-1 u-body-value">{{ timeFormat(item.beginTime, 'yyyy-mm-dd') || '-' }} 至
                  {{ timeFormat(item.endTime, 'yyyy-mm-dd') || '-' }}
                </view>
              </view>
            </view>
        </template>
      </up-card>
    </view>


    <!-- 底部新增记录按钮     status=3-->
    <view class="fixed-bottom-btn-wrap" v-if="finishState==1">
      <up-button
          type="primary"
          size="default"
          @click="addNewRecord"
          :style="{ width: '100%', height: '88rpx', fontSize: '32rpx', borderRadius: 0 }"
      >
        新增记录
      </up-button>
    </view>
  </view>
</template>

<script setup>
import { timeFormat } from '@/uni_modules/uview-plus';
import { ref } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import { inspectionPlanDetail } from "@/api/patrol-manage/patrol-plan";
// 响应式数据定义
const planInfo = ref([]);
const batchNo = ref('')
const planNo = ref('')
const finishState = ref('')
// 页面加载接收参数
onLoad((options) => {
  console.log('计划ID：', options.batchNo);
  batchNo.value = options.batchNo;
  // planNo.value = options.planNo;
  finishState.value = options.status
});
// 页面显示时请求数据
onShow(() => {
  if (!batchNo.value) {
    uni.showToast({
      title: '计划ID不存在',
      icon: 'none'
    });
    return;
  }
  getPlanDetail(batchNo.value);
});
const getPlanDetail = async () => {
  const queryData = {
    batchNo: batchNo.value,
    finishState: finishState.value
  }
  console.log(queryData)
  const planInfoRes = await inspectionPlanDetail(queryData)
  planInfo.value = planInfoRes
  console.log(planInfoRes)
};
// 跳转到已完成计划明细
const gotoFinishPlanDetail = (i) => {
  uni.navigateTo({
    url: `/pages-sub/daily/patrol-manage/finish-plan-detail?planNo=${i.planNo}`
  });
};
// 新增记录
const addNewRecord = () => {
  uni.navigateTo({
    url: `/pages-sub/daily/patrol-manage/add-patrol-record?planNo=${planInfo.value[0].planNo}&batchNo=${batchNo.value}`,
  });
};
</script>

<style scoped lang="scss">


</style>