未完成明细列表

刘淇
1 parent fb13622a
Showing 4 changed files with 99 additions and 195 deletions
api/maintain-manage/maintain-manage.js
pages-sub/daily/maintain-manage/index.vue
pages-sub/daily/maintain-manage/pending-plan-detail.vue
pages-sub/daily/patrol-manage/pending-plan-detail/index.vue
  
-
-
 import { post, get } from '@/common/utils/request';
  
-
 /**
  * 道路汇总
  * @returns {Promise}
@@ -49,8 +46,8 @@ export const notFinish = (data) =&gt; {
  *  计划详情
  * @returns {Promise}
  */
-export const detailList = (data) => {
-  return post('/app-api/app/garden/maintain-plan-commit/page',data);
+export const detailList = (params) => {
+  return get('/app-api/app/garden/maintain-plan-commit/page',params);
 };
  
  
@@ -63,10 +63,10 @@
         <up-card
             :border="false"
             :foot-border-top="false"
-            ：head-border-bottom="false"
+            :head-border-bottom="false"
             v-for="(item,index) in currentList"
             :key="`${item.planNo}_${index}`"
-            :show-header="false"
+            :show-head="false"
         >
           <template #body>
             <view class="card-body">
@@ -171,9 +171,9 @@
 </template>
  
 <script setup>
-import { ref, computed, onMounted } from 'vue'
-import { onLoad } from '@dcloudio/uni-app'
-import { roadPage, getRoadDetails, planTypePage } from "@/api/maintain-manage/maintain-manage";
+import { ref, computed } from 'vue'
+import { onLoad, onShow } from '@dcloudio/uni-app'
+import { roadPage, planTypePage } from "@/api/maintain-manage/maintain-manage";
 import { timeFormat } from '@/uni_modules/uview-plus';
  
 // 初始化响应式数据
@@ -312,17 +312,14 @@ const submitRecord = (item) =&gt; {
 onLoad(() => {
   // 先处理字典数据
   handleDictData()
+})
+onShow(()=>{
   // 初始化分页数据
   pagingRef.value?.reload()
 })
 </script>
  
 <style scoped lang="scss">
-.main-container {
-  min-height: 100vh;
-  background-color: #f8f8f8;
-}
-
 // 吸顶区域样式
 .sticky-wrap {
   background-color: #fff;
@@ -334,70 +331,5 @@ onLoad(() =&gt; {
   }
 }
  
-// 内容区域样式
-.content-wrap {
-  padding:200rpx 20rpx 20rpx;
-  box-sizing: border-box;
-}
-
-// 卡片列表样式
-.card-list {
-  display: flex;
-  flex-direction: column;
-  gap: 20rpx;
-}
-
-// 卡片项样式
-.card-item {
-  background-color: #fff;
-  border-radius: 12rpx;
-  padding: 20rpx;
-  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
-
-  .card-content {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    gap: 12rpx;
-
-    .card-text {
-      font-size: 28rpx;
-      color: #333;
-      line-height: 1.4;
-      width: 100%;
-      display: flex;
-      align-items: center;
-      justify-content: space-between; // 让文本和按钮两端对齐
-
-      &.font-bold {
-        font-weight: 600;
-        font-size: 30rpx;
-      }
-
-      .field-name {
-        color: #999;
-        display: inline-block;
-        margin-right: 15rpx;
-        flex-shrink: 0;
-      }
-    }
-  }
-}
-
-// 行内操作按钮样式
-.inline-action {
-  font-size: 26rpx;
-  color: #1989fa;
-  padding: 4rpx 12rpx;
-  border-radius: 4rpx;
-  background-color: #f0f8ff;
-  white-space: nowrap;
-  float: right;
-  &.submit-btn {
-    background-color: #1989fa;
-    color: #fff;
-  }
-}
-
  
 </style>
 \ No newline at end of file
 <template>
-  <view class="pending-plan-detail">
-    <!-- 计划详情卡片 -->
-    <view class="detail-card" v-for="i in planInfo" :key="i.planNo">
-      <!-- 标题行 -->
-      <view class="detail-item">
-        <text class="label">计划名称：</text>
-        <text class="value up-line-1">{{ i.planName || '-' }}</text>
-      </view>
-
-      <!-- 计划编码行 -->
-      <view class="detail-item">
-        <text class="label">计划编码：</text>
-        <text class="value up-line-1">{{ i.planNo || '-' }}</text>
-      </view>
-
-      <!-- 养护周期行 -->
-      <view class="detail-item">
-        <text class="label">养护周期：</text>
-        <text class="value up-line-1">{{ i.rate || '-' }} {{ uni.$dict.getDictLabel('cycle_id_type', i.cycleId) }}
-        </text>
-      </view>
-      <!--      cycle_id_type-->
-      <!-- 计划完成次数行 -->
-      <view class="detail-item">
-        <text class="label">计划完成次数：</text>
-        <text class="value up-line-1">{{ i.planNum || 0 }} 次</text>
-      </view>
-
-      <!-- 已完成次数行 + 查看记录按钮 -->
-      <view class="detail-item flex-between">
-        <view class="left-wrap">
-          <text class="label">已完成次数：</text>
-          <text class="value up-line-1">{{ planInfo.i || 0 }} 次</text>
-        </view>
-        <!-- 查看记录按钮（限制宽度+紧凑样式） -->
-
+  <view class="page-container">
+    <!-- 计划详情卡片区域（复用目标卡片结构） -->
+    <view class="common-card-list">
+      <up-card
+          :border="false"
+          :foot-border-top="false"
+          v-for="(i, index) in planInfo"
+          :key="`${i.planNo}_${index}`"
+      >
+        <!-- 自定义标题区域（计划名称） -->
+        <template #head>
+          <view class="card-header">
+            <view class="common-card-title u-line-1">{{ i.planName || '无计划名称' }}</view>
+          </view>
+        </template>
+
+        <!-- 卡片主体内容（原详情项） -->
+        <template #body>
+          <view class="card-body">
+            <!-- 计划编码 -->
+            <view class="u-body-item u-flex">
+              <view class="u-body-item-title">计划编码：</view>
+              <view class="u-line-1 u-body-value">{{ i.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">
+                {{ i.rate || '-' }} {{ uni.$dict.getDictLabel('cycle_id_type', i.cycleId) }}
+              </view>
+            </view>
+
+<!--            &lt;!&ndash; 计划完成次数 &ndash;&gt;-->
+<!--            <view class="u-body-item u-flex">-->
+<!--              <view class="u-body-item-title">计划完成次数：</view>-->
+<!--              <view class="u-line-1 u-body-value">{{ i.planNum || 0 }} 次</view>-->
+<!--            </view>-->
+
+            <!-- 已完成次数 + 查看记录按钮 -->
+            <view class="u-body-item u-flex common-item-center common-justify-between">
+              <view class="u-body-item-title">已完成比例： {{ i.finishPercent || 0 }} %</view>
+              <view class="u-line-1">
+                <up-button
+                    type="primary"
+                    size="mini"
+                    @click="gotoFinishPlanDetail(i)"
+                    class="submit-record-btn"
+                    :style="{ width: '80px', height: '28px', fontSize: '14px', borderRadius: 4 }"
+                >
+                  查看记录
+                </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">
+                {{ timeFormat(i.beginTime, 'yyyy-mm-dd') || '-' }} 至
+                {{ timeFormat(i.endTime, 'yyyy-mm-dd') || '-' }}
+              </view>
+            </view>
+          </view>
+        </template>
+      </up-card>
+
+      <!-- 底部新增记录按钮 -->
+      <view class="fixed-bottom-btn-wrap" v-if="finishState==1">
         <up-button
             type="primary"
-            size="mini"
-            @click="gotoFinishPlanDetail(i)"
-            :style="{ width: '80px', height: '28px', fontSize: '14px', borderRadius: 4 }"
+            size="default"
+            @click="addNewRecord"
+            :style="{ width: '100%', height: '88rpx', fontSize: '32rpx', borderRadius: 0 }"
         >
-          查看记录
+          新增记录
         </up-button>
       </view>
-
-      <!-- 计划有效期行 -->
-      <view class="detail-item">
-        <text class="label">计划有效期：</text>
-        <!--        <text class="value up-line-1">{{ planInfo && planInfo.validTime ? planInfo.validTime : '-' }}</text>-->
-        <text class="value up-line-1">{{ timeFormat(i.beginTime, 'yyyy-mm-dd') }} 至
-          {{ timeFormat(i.endTime, 'yyyy-mm-dd') }}
-        </text>
-      </view>
-    </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>
@@ -75,22 +87,21 @@ import { ref } from &#39;vue&#39;;
 import { onLoad, onShow } from '@dcloudio/uni-app';
 import { notFinish } from "@/api/maintain-manage/maintain-manage";
  
-// 响应式数据定义
+// 响应式数据定义（逻辑完全保留）
 const planInfo = ref([]);
 const batchNo = ref('')
 const planNo = ref('')
 const finishState = ref('')
 const planTypeId = ref('')
  
-
-
-// 页面加载接收参数
+// 页面加载接收参数（逻辑完全保留）
 onLoad((options) => {
   planNo.value = options.planNo;
-  finishState.value = options.status
+  finishState.value = options.finishState
   planTypeId.value = options.planTypeId
 });
-// 页面显示时请求数据
+
+// 页面显示时请求数据（逻辑完全保留）
 onShow(() => {
   if (!planNo.value) {
     uni.showToast({
@@ -101,76 +112,38 @@ onShow(() =&gt; {
   }
   getPlanDetail();
 });
+
+// 获取计划详情（逻辑完全保留）
 const getPlanDetail = async () => {
   const queryData = {
     planNo: planNo.value,
-    planTypeId:planTypeId.value
+    planTypeId: planTypeId.value
   }
   console.log(queryData)
   const planInfoRes = await notFinish(queryData)
   planInfo.value = planInfoRes
   console.log(planInfoRes)
 };
-// 跳转到已完成计划明细
+
+// 跳转到已完成计划明细（逻辑完全保留）
 const gotoFinishPlanDetail = (i) => {
   uni.navigateTo({
-    // url: `/pages-sub/daily/maintain-manage/finish-plan-detail?planNo=${i.planNo}`
+    url: `/pages-sub/daily/maintain-manage/finish-plan-detail?planNo=${i.planNo}`
   });
 };
-// 新增记录
+
+// 新增记录（逻辑完全保留）
 const addNewRecord = () => {
   uni.navigateTo({
-    url: `/pages-sub/daily/maintain-manage/add-record/index?planNo=${planInfo.value[0].planNo}&batchNo=${batchNo.value}`,
+    url: `/pages-sub/daily/maintain-manage/add-record?planNo=${planInfo.value[0].planNo}&batchNo=${batchNo.value}`,
   });
 };
 </script>
  
 <style scoped lang="scss">
-.pending-plan-detail {
-
-}
-
-.detail-card {
-  padding: 20rpx;
-  background-color: #fff;
-  margin-bottom: 20px;
-}
-
-.detail-item {
-  display: flex;
-  align-items: center;
-  font-size: 28rpx;
-  line-height: 1.8;
-  padding: 10rpx 0;
-  border-bottom: 1px solid #f5f5f5;
+.page-container {
  
-  &:last-child {
-    border-bottom: none;
-  }
-}
-
-.flex-between {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  .left-wrap {
-    display: flex;
-    align-items: center;
-    flex: 1; // 占满剩余空间，按钮靠右
-  }
-}
-
-.label {
-  color: #999;
-  width: 200rpx;
-  flex-shrink: 0;
 }
  
-.value {
-  color: #333;
-  flex: 1;
-  word-break: break-all;
-}
  
 </style>
 \ No newline at end of file
@@ -112,6 +112,8 @@ const getPlanDetail = async () =&gt; {
 const gotoFinishPlanDetail = (i) => {
   uni.navigateTo({
     url: `/pages-sub/daily/patrol-manage/finish-plan-detail/index?planNo=${i.planNo}`
+
+
   });
 };
 // 新增记录