巡检编辑和扫码

yyb

5 天以前 a9561a3189d50f0e33d693b5226ea56adda06a08

 src/pages/routingInspection/product_card/index.vue

@@ -1,205 +1,235 @@
<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>
  <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>
        <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 }}
      </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: 800rpx;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: 8px; 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>
    </view>
  </wd-card>
</wd-popup>
    </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 emit = defineEmits(["click"]);
defineProps({
  data: {
    type: Object,
    default: () => {},
  },
  map: {
    type: Object,
    default: () => {},
  },
});
const showRejectPopup = ref<boolean>(false);
const handleCardClick = () => {
  emit('click');
  emit("click");
};
</script>

<style lang="scss" scoped>
  .card_bg {
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.05);
    padding-bottom: 10px;
  }
.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;
  }
// 添加：两种不同的背景色样式
.reject-card-bg-1 {
  background-color: #f5f7fa;
}

  .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%);
      }
.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;
  }
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

  // 修改：调整内容区域的样式
  .content {
    padding: 5px;
  }
// 修改：调整内容区域的样式
.content {
  padding: 5px;
}
</style>