<template> 
 | 
    <wd-card class="card_bg" @click="handleCardClick"> 
 | 
        <template #title> 
 | 
            <view class="flex justify-between w-full"> 
 | 
                <text class="font-medium text-[#252525]">机台: {{ data[map.deviceModel] }}</text> 
 | 
                <wd-tag color="#0D867F" bg-color="#E7F4EC"> 
 | 
                    <text class="text-xs">{{ data[map.model] }}</text> 
 | 
                </wd-tag> 
 | 
            </view> 
 | 
        </template> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="24"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        首检单号: 
 | 
                        <text class="text-[#252525]">{{ data[map.firstNo] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="24"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        班次: 
 | 
                        <text class="text-[#252525]">{{ data[map.workShift] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="24"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        班组: 
 | 
                        <text class="text-[#252525]">{{ data[map.teamName] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="24"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        领用杆号: 
 | 
                        <text class="text-[#252525]">{{ data[map.poleNumber] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
        <wd-col :span="12"> 
 | 
            <view class="flex"> 
 | 
                <view class="icon_box"> 
 | 
                    <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                </view> 
 | 
                <text class="text-[#646874] mx-2"> 
 | 
                    杆型号: 
 | 
                    <text class="text-[#252525]">{{ data[map.poleModel] }}</text> 
 | 
                </text> 
 | 
            </view> 
 | 
        </wd-col> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="12"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        生产轴数: 
 | 
                        <text class="text-[#252525]">{{ data[map.outputNumber] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
  
 | 
        </wd-row> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="12"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        自检人: 
 | 
                        <text class="text-[#252525]">{{ data[map.inspectPerson] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
            <wd-col :span="12"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        状态: 
 | 
                        <text class="text-[#252525]">{{ data[map.status] == 1 ? "被驳回" : "巡检" }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
        <wd-row class="my-2"> 
 | 
            <wd-col :span="16"> 
 | 
                <view class="flex"> 
 | 
                    <view class="icon_box"> 
 | 
                        <wd-icon name="folder" color="#0D867F"></wd-icon> 
 | 
                    </view> 
 | 
                    <text class="text-[#646874] mx-2"> 
 | 
                        记录时间: 
 | 
                        <text class="text-[#252525]">{{ data[map.recordDate] }}</text> 
 | 
                    </text> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
            <wd-col :span="8"> 
 | 
                <view class="flex"> 
 | 
                    <wd-button v-if="data[map.status] == 1" size="small" type="primary" @click.stop="showRejectPopup = true" 
 | 
                        style="margin-left: auto;"> 
 | 
                        查看驳回信息 
 | 
                    </wd-button> 
 | 
                </view> 
 | 
            </wd-col> 
 | 
        </wd-row> 
 | 
    </wd-card> 
 | 
<wd-popup v-model="showRejectPopup" title="驳回信息" custom-style="border-radius:32rpx;height: 500rpx;width: 600rpx;"> 
 | 
  <wd-card v-for="(item, index) in data.rejectList" :key="index"  
 | 
           :class="index % 2 === 0 ? 'reject-card-bg-1' : 'reject-card-bg-2'" 
 | 
           style="margin-bottom: 15px; padding: 10px; border-radius: 8px;"> 
 | 
    <view class="content"> 
 | 
      <view> 
 | 
        <view style="display: flex; justify-content: space-between; align-items: center; color: rgba(0,0,0,0.85); font-size: 14px; margin-bottom: 8px;"> 
 | 
          <view>{{ item.rejectPerson }}</view> 
 | 
          <view>{{ item.rejectTime }}</view> 
 | 
        </view> 
 | 
        <view style="color: rgba(0,0,0,0.85); font-size: 14px; word-break: break-word; overflow-wrap: break-word; max-width: 100%; padding: 5px 0;"> 
 | 
          {{ item.rejectReason.reason }} 
 | 
        </view> 
 | 
      </view> 
 | 
    </view> 
 | 
  </wd-card> 
 | 
</wd-popup> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
import { ref } from "vue"; 
 | 
const emit = defineEmits(['click']); 
 | 
    defineProps({ 
 | 
        data: { 
 | 
            type: Object, 
 | 
            default: () => { }, 
 | 
        }, 
 | 
        map: { 
 | 
            type: Object, 
 | 
            default: () => { }, 
 | 
        }, 
 | 
    }); 
 | 
const showRejectPopup = ref<boolean>(false) 
 | 
const handleCardClick = () => { 
 | 
  emit('click'); 
 | 
}; 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
  .card_bg { 
 | 
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.05); 
 | 
    padding-bottom: 10px; 
 | 
  } 
 | 
  
 | 
  // 添加:两种不同的背景色样式 
 | 
  .reject-card-bg-1 { 
 | 
    background-color: #f5f7fa; 
 | 
  } 
 | 
   
 | 
  .reject-card-bg-2 { 
 | 
    background-color: #eef2f7; 
 | 
  } 
 | 
  
 | 
  .page-class { 
 | 
    :deep() { 
 | 
      .custom-shadow { 
 | 
        box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%); 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
  
 | 
  .header { 
 | 
    display: flex; 
 | 
    align-items: center; 
 | 
    justify-content: space-between; 
 | 
  } 
 | 
  
 | 
  // 修改:调整内容区域的样式 
 | 
  .content { 
 | 
    padding: 5px; 
 | 
  } 
 | 
</style> 
 |