Merge remote-tracking branch 'origin/dev' into dev

liuleilei

2023-09-11 faf1d3cc35a3a5f83558946c8056537a4d77fa1f

 minipro_standard/pages_inspect/pages/InspectionRecords/InspectionRecords.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,511 @@
<template>
   <view class="content">
      <view class="content_search">
         <Search @searchInput="searchInput" @submit="submit" @reset="reset" :isShow="true" placeholder="搜索工单编码/物料编码">
            <template v-slot:content>
               <view class="Search_item">
                  <view class="Search_item_label">检验日期</view>
                  <view class="Search_item_content" @click="timeShow = true">
                     <view class="Search_item_content_a" :style="pageData.checkStartDate ? 'color: #000;' : ''">{{ pageData.checkStartDate ? pageData.checkStartDate : '开始日期'}}</view>
                     <text>-</text>
                     <view class="Search_item_content_a" :style="pageData.checkEndDate ? 'color: #000;' : ''">{{ pageData.checkEndDate ? pageData.checkEndDate : '结束日期'}}</view>
                  </view>
               </view>
               <view class="Search_item">
                  <view class="Search_item_label">检验类型</view>
                  <view class="Search_item_content">
                     <view class="tag">
                        <view class="tag_item" :class="{'tag_active': item.isActive}" v-for="(item, i) in data" :key="item.id" @click="changeTag(i)">{{item.name}}</view>
                     </view>
                  </view>
               </view>
               <view class="Search_item">
                  <view class="Search_item_label">检验工序</view>
                  <view class="Search_item_content">
                     <view class="tag">
                        <view class="tag_item" :class="{'tag_active': item.isActive}" v-for="(item, i) in workingProcedure" :key="item.id" @click="changeTag1(i)">{{item.name}}</view>
                     </view>
                  </view>
               </view>
               <view class="Search_item">
                  <view class="Search_item_label">批次号</view>
                  <view class="Search_item_content">
                     <u--input placeholder="请输入批次号" border="surround" v-model="pageData.batch"></u--input>
                  </view>
               </view>
            </template>
         </Search>
      </view>
      <view class="content_total" :style="{top: top}">共{{pageData.total}}条数据</view>
      <view class="content_list">
         <scroll-view
         :refresher-enabled="true"
         :refresher-triggered="isLoading"
         @refresherrefresh="onRefresh"
         refresher-background="#fff"
         @scrolltolower="onLoads"
         scroll-y
         :style="{height: height}">
            <view class="content_list_item" v-for="item in listData" :key="item.id" @click="jumpDesc(item)">
               <view class="content_list_item_title">
                  <text>{{item.code}}</text>
                  <text class="warning" v-if="item.checkType === 0">巡线</text>
                  <text v-if="item.checkType === 1">巡检</text>
                  <text class="green" v-if="item.checkType === 2">完工检</text>
               </view>
               <view class="content_list_item_nr">
                  <view class="content_list_item_nr_box">
                     <view class="label">物料信息：</view>
                     <view class="cr" v-if="item.mmodel">{{item.mmodel.name}}丨{{item.mmodel.code}}</view>
                  </view>
                  <view class="content_list_item_nr_boxs">
                     <view class="label">生产数量：</view>
                     <view class="cr" v-if="item.umodel">{{item.num}}{{item.umodel.name}}</view>
                  </view>
                  <view class="content_list_item_nr_box">
                     <view class="label">生产批次：</view>
                     <view class="cr">{{item.batch}}</view>
                  </view>
                  <view class="content_list_item_nr_boxs">
                     <view class="label">生产工序：</view>
                     <view class="cr" v-if="item.pmodel">{{item.pmodel.name}}</view>
                  </view>
                  <view class="content_list_item_nr_box">
                     <view class="label">工单编号：</view>
                     <view class="cr">{{item.workorderCode}}</view>
                  </view>
                  <view class="content_list_item_nr_boxs">
                     <view class="label">检验人员：</view>
                     <view class="cr">{{item.smodelRealName}}/{{item.checkUserDepartName}}</view>
                  </view>
                  <!-- <view class="content_list_item_nr_box">
                     <view class="label">检验日期：</view>
                     <view class="cr">{{item.checkDate}}</view>
                  </view> -->
                  <!-- <view class="content_list_item_nr_boxs">
                     <view class="label">工装码：</view>
                     <view class="cr" v-if="item.amodel">{{item.amodel.code}}</view>
                  </view> -->
                  <view class="content_list_item_nr_box">
                     <view class="label">合格数量：</view>
                     <view class="cr" v-if="item.umodel">{{item.qualifiedNum}}{{item.umodel.name}}</view>
                  </view>
                  <view class="content_list_item_nr_boxs">
                     <view class="label">不良数量：</view>
                     <view class="cr warning" v-if="item.umodel">{{item.unqualifiedNum}}{{item.umodel.name}}</view>
                  </view>
               </view>
            </view>
         </scroll-view>
      </view>
      <!-- é€‰æ‹©æ—¥æœŸ -->
      <u-calendar :show="timeShow" mode="range" @confirm="timeConfirm" @close="timeShow = false"></u-calendar>
   </view>
</template>

<script>
   import Search from '@/components/Search.vue'
   import { page } from '@/util/api/QualityAPI'
   import { getWorkingProcedure, deletejy } from "@/util/api/PlanningAPI"
   import { mapState } from 'vuex'
	
   export default {
      components: { Search },
      data() {
         return {
            height: '',
            top: '',
            isLoading: false,
            pageData: {
               capacity: 10,
               page: 0,
               total: 0,
               checkStartDate: '',
               checkEndDate: '',
               minParam: '',
               batch: '',
               checkType: '',
               procedureId: '',
               workorderId: ''
            },
            data: [      // æ£€éªŒç±»åž‹
               { id: '0', name: '巡线', isActive: false },
               { id: '1', name: '巡检', isActive: false },
               { id: '2', name: '完工检', isActive: false }
            ],
            minDate: new Date(2021, 0, 1),
            maxDate: new Date(new Date().getFullYear() + 1, 12, 30),
            listData: [],
            workingProcedure: [],   // å·¥åº
            loading: false,
            finished: false,
            refreshing: false,
            timeShow: false
         };
      },
      onReady() {
         var that = this
         this.$nextTick(() => {
            uni.createSelectorQuery().in(this).select('.content_search').boundingClientRect((rect) => {
               that.height = `calc(100vh - ${rect.height + 80}px)`
               that.top = `${rect.height}px`
            }).exec()
         })
      },
      computed: {
         ...mapState(['userInfo'])
      },
      onLoad(option) {
         if (option.id) {
            this.pageData.workorderId = option.id
         }
         this.onLoads()
         this.getWorkingProcedures()
      },
      methods: {
         // è·³è½¬
         jumpDesc(item) {
            uni.navigateTo({
               url: `/pages_inspect/pages/InspectionDetails/InspectionDetails?id=${item.id}`
            })
         },
         // èŽ·å–头部组件高度
         getHeight(height) {
            this.height = height
         },
         onRefresh() {
            if (this.isLoading) return
            this.isLoading = true
            this.listData = []
            this.pageData.page = 0
            this.onLoads()
         },
         // é‡ç½®
         reset() {
            this.pageData.checkStartDate = ''
            this.pageData.checkEndDate = ''
            this.pageData.minParam = ''
            this.pageData.checkType = ''
            this.pageData.procedureId = ''
            this.pageData.batch = ''
            this.pageData.page = 0
            this.listData = []
            this.finished = false
            this.data.forEach(item => { item.isActive = false })
            this.workingProcedure.forEach(item => { item.isActive = false })
            this.onLoads()
         },
         // æ—¥æœŸç¡®å®š
         timeConfirm(val) {
            this.pageData.checkStartDate = val[0]
            this.pageData.checkEndDate = val[val.length - 1]
            this.timeShow = false
         },
         // åˆ‡æ¢æ£€ç±»åž‹
         changeTag(i) {
            this.data.forEach((item, index) => {
               item.isActive = index === i;
            })
         },
         // åˆ‡æ¢æ£€å·¥åº
         changeTag1(i) {
            this.workingProcedure.forEach((item, index) => {
               item.isActive = index === i;
            })
         },
         // æ‰“开日期插件
         openDate() {
            this.timeShow = true
         },
         // æœç´¢
         searchInput(val) {
            this.pageData.minParam = val
            this.pageData.page = 0
            this.listData = []
            this.finished = false
            this.onLoads()
         },
         // èŽ·å–工序数据
         getWorkingProcedures() {
            getWorkingProcedure({
               capacity: 100,
               page: 1,
               model: {
                  userId: this.userInfo.id
               }
            }).then(res => {
               if (res.code === 200 && res.data.records.length !== 0) {
                  res.data.records.forEach((item, index) => {
                     // if (index === 0) {
                     //     workingProcedure.push({ id: item.id, name: item.name, isActive: true })
                     // } else {
                        this.workingProcedure.push({ id: item.id, name: item.name, isActive: false })
                     // }
                  })
               }
            })
         },
         // æœç´¢å¼¹æ¡†æäº¤
         submit() {
            this.data.forEach(item => {
               if (item.isActive) {
                  this.pageData.checkType = item.id
               }
            })
            this.workingProcedure.forEach(item => {
               if (item.isActive) {
                  this.pageData.procedureId = item.id
               }
            })
            this.pageData.page = 0
            this.listData = []
            this.finished = false
            this.onLoads()
         },
         // åˆ—表
         onLoads() {
            if (!this.finished) {
               this.pageData.page = this.pageData.page += 1
               this.loading = true
               page({
                  capacity: this.pageData.capacity,
                  page: this.pageData.page,
                  model: {
                     minParam: this.pageData.minParam,
                     checkStartDate: this.pageData.checkStartDate,
                     checkEndDate: this.pageData.checkEndDate,
                     checkType: this.pageData.checkType,
                     procedureId: this.pageData.procedureId,
                     workorderId: this.pageData.workorderId,
                     batch: this.pageData.batch
                  }
               }).then(res => {
                  this.isLoading = false
                  if (this.refreshing) {
                     this.listData = []
                     this.refreshing = false;
                  }
                  this.loading = false
                  if (res.code === 200 && res.data.records && res.data.records.length !== 0) {
                     this.pageData.total = res.data.total
                     this.listData.push(...res.data.records)
                  } else {
                     this.finished = true
                  }
               }).catch(err => {
                  this.isLoading = false
                  this.loading = false
                  this.finished = true
                  if (this.refreshing) {
                     this.listData = []
                     this.refreshing = false;
                  }
               })
            }
         }
      }
   }
</script>

<style lang="scss" scoped>
   .content {
      .content_search {
         width: 100%;
         padding: 30rpx;
         background: white;
         position: sticky;
         top: 0;
         z-index: 999;
         box-sizing: border-box;
         .Search_item {
            margin-bottom: 40rpx;
            .Search_item_label {
               font-size: 30rpx;
               font-weight: 500;
               color: #222222;
            }
            .Search_item_content {
               display: flex;
               align-items: center;
               justify-content: space-between;
               margin-top: 30rpx;
               input {
                  width: 100%;
                  height: 70rpx;
                  border-radius: 10rpx;
                  padding: 0 20rpx;
                  box-sizing: border-box;
                  border: 1rpx solid #939393;
                  color: black;
                  font-size: 26rpx;
               }
               input::-webkit-input-placeholder {
                  color: #999999;
                  font-size: 26rpx;
               }
               input:-moz-placeholder {
                  color: #999999;
                  font-size: 26rpx;
               }
               input::-moz-placeholder {
                  color: #999999;
                  font-size: 26rpx;
               }
               input:-ms-input-placeholder {
                  color: #999999;
                  font-size: 26rpx;
               }
               .tag {
                  display: flex;
                  flex-wrap: wrap;
                  align-items: center;
                  .tag_active {
                     background: $nav-color !important;
                     color: #ffffff !important;
                  }
                  .tag_item {
                     width: 156rpx;
                     height: 70rpx;
                     box-sizing: border-box;
                     background: #F2F2F2;
                     border-radius: 8rpx;
                     font-size: 26rpx;
                     font-weight: 400;
                     color: #333333;
                     display: flex;
                     align-items: center;
                     justify-content: center;
                     margin-right: 22rpx;
                     margin-bottom: 22rpx;
                     &:nth-child(4n) {
                        margin-right: 0;
                     }
                  }
               }
               text {
                  font-size: 26rpx;
                  font-weight: 400;
                  color: #333333;
               }
               .Search_item_content_a {
                  width: 308rpx;
                  height: 70rpx;
                  background: #F7F7F7;
                  border-radius: 8rpx;
                  border: 1rpx solid #EEEEEE;
                  font-size: 26rpx;
                  font-weight: 400;
                  color: #B2B2B2;
                  display: flex;
                  align-items: center;
                  justify-content: center;
               }
            }
         }
         .content_search_x {
            height: 24rpx;
         }
      }
      .content_list {
         width: 100%;
         display: flex;
         flex-direction: column;
         .content_list_item {
            width: 100%;
            box-sizing: border-box;
            padding: 30rpx;
            background: #ffffff;
            margin-bottom: 20rpx;
            .content_list_item_title {
               display: flex;
               align-items: center;
               justify-content: space-between;
               .warning {
                  color: $nav-stateColor5 !important;
               }
               .green {
                  color: $nav-stateColor2 !important;
               }
               text {
                  font-size: 32rpx;
                  font-weight: 500;
                  color: #333333;
               }
            }
            .content_list_item_nr {
               padding: 24rpx 30rpx;
               background: #F7F7F7;
               border-radius: 16rpx;
               margin-top: 30rpx;
               display: flex;
               justify-content: space-between;
               flex-wrap: wrap;
               .content_list_item_nr_boxs {
                  width: 45%;
                  display: flex;
                  margin-top: 24rpx;
                  &:nth-child(1) {
                     margin-top: 0;
                  }
                  &:nth-child(2) {
                     margin-top: 0;
                  }
                  .warning {
                     color: $nav-stateColor4 !important;
                  }
                  .label {
                     flex-shrink: 0;
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #666666;
                  }
                  .cr {
                     flex: 1;
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #222222;
                     overflow: hidden;
                     white-space: nowrap;
                     text-overflow: ellipsis;
                     -o-text-overflow:ellipsis;
                  }
               }
               .content_list_item_nr_box {
                  width: 55%;
                  display: flex;
                  margin-top: 24rpx;
                  &:nth-child(1) {
                     margin-top: 0;
                  }
                  &:nth-child(2) {
                     margin-top: 0;
                  }
                  .label {
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #666666;
                     flex-shrink: 0;
                  }
                  .cr {
                     font-size: 24rpx;
                     font-weight: 400;
                     color: #222222;
                  }
               }
            }
         }
      }
      .content_total {
         width: 100%;
         height: 80rpx;
         padding: 24rpx 30rpx;
         background: #F7F7F7;
         font-size: 24rpx;
         font-weight: 400;
         box-sizing: border-box;
         color: #666666;
         position: sticky;
         z-index: 99;
      }
   }
</style>