模具设备证据选着源单功能，封装公用组件

zrg

2026-01-22 c5dd3c5e518906ca6ffc7c6791e7408f8cf15628

 components/BillListPopup/BillListPopuMouldRepairRecordPopup.vue

@@ -1,385 +1,389 @@
<template>
    <view>
        <uni-popup ref="popup" type="bottom" @change="popupChangeHandler">
            <view class="content">
                <view class="search-condition">
                    <view class="title"><text>日期: </text></view>
                    <view class="daterange" style="flex: 1;">
                        <view class="right general">
                            <uni-datetime-picker type="date" :clear-icon="false" v-model="HBeginDate">
                                <view>{{HBeginDate}}</view>
                            </uni-datetime-picker>
                        </view>
                        <view>—</view>
                        <view class="right general">
                            <uni-datetime-picker type="date" :clear-icon="false" v-model="HEndDate">
                                <view>{{HEndDate}}</view>
                            </uni-datetime-picker>
                        </view>
                    </view>
                </view>
                <!-- 保持与故障登记单相同的搜索条件 -->
                <view class="search-condition">
                    <view class="title"><text>模具编码: </text></view>
                    <view class="right"><input type="text" :focus="enablefocus" v-model="HNumber"
                            @confirm="getRepairRecordList" /></view>
                </view>
                <view class="search-condition">
                    <view class="title"><text>模具名称: </text></view>
                    <view class="right"><input type="text" v-model="HName" @confirm="getRepairRecordList" /></view>
                </view>
                <view class="search-condition">
                    <view class="title"><text>单据号: </text></view>
                    <view class="right"><input type="text" v-model="HBillNo" @confirm="getRepairRecordList" /></view>
                </view>
                <view class="buttons">
                    <view style="flex: 1;"></view>
                    <button size="mini" type="primary" @click="search">搜索</button>
                    <button size="mini" type="primary" @click="exit">退出</button>
                </view>
                <scroll-view id="#BillListPanel" scroll-y="true" style="height: 50vh;">
                    <view class="options-wrapper" v-show="HRepairRecordList.length != 0">
                        <uni-card :is-active="record.isActive" :class="record.isActive?'uni-card--is-active':''"
                            v-for="(record, index) in HRepairRecordList[curPage-1]" :key="index" 
                            :title="record['单据号'] || record['HBillNo'] || record['维修单号']"
                            @tap="clickCard(record, index)">
                            <view class="item">
                                <view class="left">日期: </view>
                                <view class="right">{{dayjs(record['日期'] || record['维修日期'] || record['HDate']).format('YYYY-MM-DD')}}</view>
                            </view>
                            <view class="item" v-if="record['模具编码'] || record['HMouldCode']">
                                <view class="left">模具编码: </view>
                                <view class="right">{{record['产品模具代码'] || record['HMouldCode']}}</view>
                            </view>
                            <view class="item" v-if="record['模具名称'] || record['HMouldName']">
                                <view class="left">模具名称: </view>
                                <view class="right">{{record['产品模具'] || record['HMouldName']}}</view>
                            </view>
                            <view class="item" v-if="record['模具规格'] || record['HMouldSpec']">
                                <view class="left">模具规格: </view>
                                <view class="right">{{record['模具规格'] || record['HMouldSpec']}}</view>
                            </view>
                            <view class="item" v-if="record['模具型号'] || record['HMouldModel']">
                                <view class="left">模具型号: </view>
                                <view class="right">{{record['模具型号'] || record['HMouldModel']}}</view>
                            </view>
                            <view class="item" v-if="record['维修单号'] || record['HRepairNo']">
                                <view class="left">维修单号: </view>
                                <view class="right">{{record['维修单号'] || record['HRepairNo']}}</view>
                            </view>
                            <view class="item" v-if="record['维修内容'] || record['HRepairContent']">
                                <view class="left">维修内容: </view>
                                <view class="right">{{record['维修内容'] || record['HRepairContent']}}</view>
                            </view>
                            <view class="item" v-if="record['维修人'] || record['HEmpName']">
                                <view class="left">维修人: </view>
                                <view class="right">{{record['维修人'] || record['HEmpName']}}</view>
                            </view>
                            <view class="item" v-if="record['维修人'] || record['HStatus']">
                                <view class="left">维修人: </view>
                                <view class="right">{{record['维修人'] || record['HStatus']}}</view>
                            </view>
                        </uni-card>
                    </view>
                    <view class="over" v-show="HRepairRecordList.length == 0">暂无数据</view>
                </scroll-view>
                <uni-pagination id="#pagination" title="标题文字" v-model="curPage" :pageSize="size"
                    :total="length"></uni-pagination>
            </view>
        </uni-popup>
    </view>
   <view>
      <uni-popup ref="popup" type="bottom" @change="popupChangeHandler">
         <view class="content">
            <view class="search-condition">
               <view class="title"><text>日期: </text></view>
               <view class="daterange" style="flex: 1;">
                  <view class="right general">
                     <uni-datetime-picker type="date" :clear-icon="false" v-model="HBeginDate">
                        <view>{{HBeginDate}}</view>
                     </uni-datetime-picker>
                  </view>
                  <view>—</view>
                  <view class="right general">
                     <uni-datetime-picker type="date" :clear-icon="false" v-model="HEndDate">
                        <view>{{HEndDate}}</view>
                     </uni-datetime-picker>
                  </view>
               </view>
            </view>
            <!-- 保持与故障登记单相同的搜索条件 -->
            <view class="search-condition">
               <view class="title"><text>模具编码: </text></view>
               <view class="right"><input type="text" :focus="enablefocus" v-model="HNumber"
                     @confirm="getRepairRecordList" /></view>
            </view>
            <view class="search-condition">
               <view class="title"><text>模具名称: </text></view>
               <view class="right"><input type="text" v-model="HName" @confirm="getRepairRecordList" /></view>
            </view>
            <view class="search-condition">
               <view class="title"><text>单据号: </text></view>
               <view class="right"><input type="text" v-model="HBillNo" @confirm="getRepairRecordList" /></view>
            </view>
            <view class="buttons">
               <view style="flex: 1;"></view>
               <button size="mini" type="primary" @click="search">搜索</button>
               <button size="mini" type="primary" @click="exit">退出</button>
            </view>
            <scroll-view id="#BillListPanel" scroll-y="true" style="height: 50vh;">
               <view class="options-wrapper" v-show="HRepairRecordList.length != 0">
                  <uni-card :is-active="record.isActive" :class="record.isActive?'uni-card--is-active':''"
                     v-for="(record, index) in HRepairRecordList[curPage-1]" :key="index"
                     :title="record['单据号'] || record['HBillNo'] || record['维修单号']"
                     @tap="clickCard(record, index)">
                     <view class="item">
                        <view class="left">日期: </view>
                        <view class="right">
                           {{dayjs(record['日期'] || record['维修日期'] || record['HDate']).format('YYYY-MM-DD')}}
                        </view>
                     </view>
                     <view class="item" v-if="record['模具编码'] || record['HMouldCode']">
                        <view class="left">模具编码: </view>
                        <view class="right">{{record['产品模具代码'] || record['HMouldCode']}}</view>
                     </view>
                     <view class="item" v-if="record['模具名称'] || record['HMouldName']">
                        <view class="left">模具名称: </view>
                        <view class="right">{{record['产品模具'] || record['HMouldName']}}</view>
                     </view>
                     <view class="item" v-if="record['模具规格'] || record['HMouldSpec']">
                        <view class="left">模具规格: </view>
                        <view class="right">{{record['模具规格'] || record['HMouldSpec']}}</view>
                     </view>
                     <view class="item" v-if="record['模具型号'] || record['HMouldModel']">
                        <view class="left">模具型号: </view>
                        <view class="right">{{record['模具型号'] || record['HMouldModel']}}</view>
                     </view>
                     <view class="item" v-if="record['维修单号'] || record['HRepairNo']">
                        <view class="left">维修单号: </view>
                        <view class="right">{{record['维修单号'] || record['HRepairNo']}}</view>
                     </view>
                     <view class="item" v-if="record['维修内容'] || record['HRepairContent']">
                        <view class="left">维修内容: </view>
                        <view class="right">{{record['维修内容'] || record['HRepairContent']}}</view>
                     </view>
                     <view class="item" v-if="record['维修人'] || record['HEmpName']">
                        <view class="left">维修人: </view>
                        <view class="right">{{record['维修人'] || record['HEmpName']}}</view>
                     </view>
                     <view class="item" v-if="record['维修人'] || record['HStatus']">
                        <view class="left">维修人: </view>
                        <view class="right">{{record['维修人'] || record['HStatus']}}</view>
                     </view>
                  </uni-card>
               </view>
               <view class="over" v-show="HRepairRecordList.length == 0">暂无数据</view>
            </scroll-view>
            <uni-pagination id="#pagination" title="标题文字" v-model="curPage" :pageSize="size"
               :total="length"></uni-pagination>
         </view>
      </uni-popup>
   </view>
</template>

<script>
    import dayjs from 'dayjs';
    import {
        CommonUtils
    } from '../../utils/common';
    import {
        getUserInfo
    } from '../../utils/auth';
    export default {
        name: "RepairRecordPopup",
        data() {
            return {
                dayjs: dayjs,
                enablefocus: false,
                size: 20,
                curPage: 1,
                length: 0,
                page: 0,
                HMouldID: 0, // 当前选择的模具ID
                HRepairRecordList: [],
                
                // 搜索条件 - 与故障登记单保持一致
                HBeginDate: dayjs(new Date()).subtract(30, 'd').format("YYYY-MM-DD"),
                HEndDate: dayjs(new Date()).format("YYYY-MM-DD"),
                HNumber: '',
                HName: '',
                HBillNo: '',
                
            };
        },
        props: {
            HBillType: {
                type: [String, Number],
                required: true
            },
            HStockOrgID: {
                type: [String, Number],
                required: true
            },
            // 新增一个是否显示模具信息的参数
            showMouldInfo: {
                type: Boolean,
                default: true
            }
        },
        methods: {
            popupChangeHandler(e) {
                if (e.show === true) {
                    this.getRepairRecordList()
                }
            },
            async exit() {
                this.resetSearchConditions();
                await this.$nextTick();
                this.$refs.popup.close();
            },
            
            resetSearchConditions() {
                this.size = 20;
                this.curPage = 1;
                this.length = 0;
                this.page = 0;
                this.HRepairRecordList = [];
                this.enablefocus = false;
                
                // 重置搜索条件
                this.HBeginDate = dayjs(new Date()).subtract(30, 'd').format("YYYY-MM-DD");
                this.HEndDate = dayjs(new Date()).format("YYYY-MM-DD");
                this.HNumber = '';
                this.HName = '';
                this.HBillNo = '';
                this.HRepairNo = '';
                this.HRepairContent = '';
                this.HRepairStatus = '';
            },
            
            showPopup(HMouldID) {
                this.HMouldID = HMouldID || 0;
                this.resetSearchConditions();
                this.$refs.popup.open();
            },
            
            search() {
                this.getRepairRecordList();
            },
            
            repairStatusChange(e) {
                const index = e.detail.value;
                if (index == 0) {
                    this.HRepairStatus = ''; // 全部
                } else {
                    this.HRepairStatus = this.repairStatusOptions[index];
                }
            },
            
            clickCard(record, index) {
                // 发送选择完成事件
                uni.$emit('RepairRecordSelectComplete', {	
                    HInterID: record["hmainid"],
                    HEntryID: record["hsubid"] || record["HEntryID"] || 0,
                    HBillNo: record["单据号"] || record["HBillNo"] || "",
                    HMouldID: record['HMouldID'] || this.HMouldID || 0,
                    HMouldName: record['产品模具'],
                    HMouldCode: record['产品模具代码'],
                    HMouldSpec: record['模具规格'],
                    HMouldModel: record['模具型号']
                });
            },
            
            getsWhere() {
                let sWhere = '';
                
                // 日期范围条件 - 与故障登记单保持一致
                if (this.HBeginDate && this.HEndDate) {
                    sWhere += ` and (CONVERT(varchar(100),日期, 23) between '${this.HBeginDate}' and '${this.HEndDate}') `;
                }
                // 模具ID条件 - 如果传入了模具ID
                if (this.HMouldID) {
                    sWhere += ` and HMouldID = ${this.HMouldID} `;
                }
                // 模具编码条件 
                if (this.HNumber) {
                    sWhere += ` and (产品模具代码 like '%${this.HNumber}%'  `;
                }
                // 模具名称条件 
                if (this.HName) {
                    sWhere += ` and (产品模具 like '%${this.HName}%' `;
                }
                // 单据号条件 
                if (this.HBillNo) {
                    sWhere += ` and (单据号 like '%${this.HBillNo}%'  `;
                }
                return sWhere;
            },
            
            getRepairRecordList() {
                this.HRepairRecordList = [];
                this.length = 0;
                this.page = 0;
                this.curPage = 1;
                
                // 调用维修记录列表接口
                CommonUtils.doRequest(
                    "/Sb_MouldRepairWorkBill/GetMouldRepairWorkBill_PDA", {  // 请根据实际情况调整接口路径
                        sWhere: this.getsWhere(),
                        user: getUserInfo()["Czymc"]
                    },
                    (res) => {
                        let {
                            data,
                            count,
                            Message
                        } = res.data;
                        if (count == 1) {
                            this.length = Array.from(data).length;
                            const result = [];
                            for (let i = 0; i < data.length; i += this.size) {
                                result.push(data.slice(i, i + this.size));
                            }
                            this.HRepairRecordList = result;
                            this.page = result.length;
                            setTimeout(() => {
                                this.enablefocus = true;
                            }, 500);
                        } else {
                            setTimeout(() => {
                                this.enablefocus = true;
                            }, 500);
                            uni.showToast({
                                icon: 'none',
                                title: Message || '暂无维修记录数据'
                            });
                        }
                    },
                    (err) => {
                        setTimeout(() => {
                            this.enablefocus = true;
                        }, 500);
                        uni.showToast({
                            icon: 'none',
                            title: '加载失败: ' + (err.message || '未知错误')
                        });
                    }
                );
            }
        }
    }
   import dayjs from 'dayjs';
   import {
      CommonUtils
   } from '../../utils/common';
   import {
      getUserInfo
   } from '../../utils/auth';
   export default {
      name: "RepairRecordPopup",
      data() {
         return {
            dayjs: dayjs,
            enablefocus: false,
            size: 20,
            curPage: 1,
            length: 0,
            page: 0,
            HMouldID: 0, // 当前选择的模具ID
            HRepairRecordList: [],

            // 搜索条件 - 与故障登记单保持一致
            HBeginDate: dayjs(new Date()).subtract(30, 'd').format("YYYY-MM-DD"),
            HEndDate: dayjs(new Date()).format("YYYY-MM-DD"),
            HNumber: '',
            HName: '',
            HBillNo: '',

         };
      },
      props: {
         HBillType: {
            type: [String, Number],
            required: true
         },
         HStockOrgID: {
            type: [String, Number],
            required: true
         },
         // 新增一个是否显示模具信息的参数
         showMouldInfo: {
            type: Boolean,
            default: true
         }
      },
      methods: {
         popupChangeHandler(e) {
            if (e.show === true) {
               this.getRepairRecordList()
            }
         },
         async exit() {
            this.resetSearchConditions();
            await this.$nextTick();
            this.$refs.popup.close();
         },

         resetSearchConditions() {
            this.size = 20;
            this.curPage = 1;
            this.length = 0;
            this.page = 0;
            this.HRepairRecordList = [];
            this.enablefocus = false;

            // 重置搜索条件
            this.HBeginDate = dayjs(new Date()).subtract(30, 'd').format("YYYY-MM-DD");
            this.HEndDate = dayjs(new Date()).format("YYYY-MM-DD");
            this.HNumber = '';
            this.HName = '';
            this.HBillNo = '';
            this.HRepairNo = '';
            this.HRepairContent = '';
            this.HRepairStatus = '';
         },

         showPopup(HMouldID) {
            this.HMouldID = HMouldID || 0;
            this.resetSearchConditions();
            this.$refs.popup.open();
         },

         search() {
            this.getRepairRecordList();
         },

         repairStatusChange(e) {
            const index = e.detail.value;
            if (index == 0) {
               this.HRepairStatus = ''; // 全部
            } else {
               this.HRepairStatus = this.repairStatusOptions[index];
            }
         },

         clickCard(record, index) {
            // 发送选择完成事件
            uni.$emit('RepairRecordSelectComplete', {
               HInterID: record["hmainid"],
               HEntryID: record["hsubid"] || record["HEntryID"] || 0,
               HBillNo: record["单据号"] || record["HBillNo"] || "",
               HMouldID: record['HMouldID'] || this.HMouldID || 0,
               HMouldName: record['产品模具'],
               HMouldCode: record['产品模具代码'],
               HMouldSpec: record['模具规格'],
               HMouldModel: record['模具型号']
            });
         },

         getsWhere() {
            let sWhere = '';

            // 日期范围条件 - 与故障登记单保持一致
            if (this.HBeginDate && this.HEndDate) {
               sWhere += ` and (CONVERT(varchar(100),日期, 23) between '${this.HBeginDate}' and '${this.HEndDate}') `;
            }
            // 模具ID条件 - 如果传入了模具ID
            if (this.HMouldID) {
               sWhere += ` and HMouldID = ${this.HMouldID} `;
            }
            // 模具编码条件 
            if (this.HNumber) {
               sWhere += ` and (产品模具代码 like '%${this.HNumber}%'  `;
            }
            // 模具名称条件 
            if (this.HName) {
               sWhere += ` and (产品模具 like '%${this.HName}%' `;
            }
            // 单据号条件 
            if (this.HBillNo) {
               sWhere += ` and (单据号 like '%${this.HBillNo}%'  `;
            }
            sWhere += ` and isnull(维修人,'')!='${uni.getStorageSync('HUserName')}$'  `
            sWhere += ` and isnull(关闭人,'')!=''  `
            return sWhere;
         },

         getRepairRecordList() {
            this.HRepairRecordList = [];
            this.length = 0;
            this.page = 0;
            this.curPage = 1;

            // 调用维修记录列表接口
            CommonUtils.doRequest(
               "/Sb_MouldRepairWorkBill/GetMouldRepairWorkBill_PDA", { // 请根据实际情况调整接口路径
                  sWhere: this.getsWhere(),
                  user: getUserInfo()["Czymc"]
               },
               (res) => {
                  let {
                     data,
                     count,
                     Message
                  } = res.data;
                  if (count == 1) {
                     this.length = Array.from(data).length;
                     const result = [];
                     for (let i = 0; i < data.length; i += this.size) {
                        result.push(data.slice(i, i + this.size));
                     }
                     this.HRepairRecordList = result;
                     this.page = result.length;
                     setTimeout(() => {
                        this.enablefocus = true;
                     }, 500);
                  } else {
                     setTimeout(() => {
                        this.enablefocus = true;
                     }, 500);
                     uni.showToast({
                        icon: 'none',
                        title: Message || '暂无维修记录数据'
                     });
                  }
               },
               (err) => {
                  setTimeout(() => {
                     this.enablefocus = true;
                  }, 500);
                  uni.showToast({
                     icon: 'none',
                     title: '加载失败: ' + (err.message || '未知错误')
                  });
               }
            );
         }
      }
   }
</script>

<style lang="scss">
    .content {
        box-sizing: border-box;
        border-radius: 15rpx 15rpx 0 0;
        padding: 20rpx 20rpx 40rpx 20rpx;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        gap: 10rpx;
   .content {
      box-sizing: border-box;
      border-radius: 15rpx 15rpx 0 0;
      padding: 20rpx 20rpx 40rpx 20rpx;
      background-color: #fff;
      display: flex;
      flex-direction: column;
      gap: 10rpx;

        .search-condition {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20rpx;
            font-size: 30rpx;
      .search-condition {
         display: flex;
         flex-direction: row;
         align-items: center;
         gap: 20rpx;
         font-size: 30rpx;

            .title {
                width: 5rem;
                text-align: right;
            }
         .title {
            width: 5rem;
            text-align: right;
         }

            .right {
                flex: 1;
                border-radius: 22rpx;
                border: 1px solid #acacac;
                height: auto;
                padding: 8rpx 16rpx;
         .right {
            flex: 1;
            border-radius: 22rpx;
            border: 1px solid #acacac;
            height: auto;
            padding: 8rpx 16rpx;

                input {
                    width: 100%;
                    font-size: 30rpx;
                }
                
                picker {
                    width: 100%;
                    font-size: 30rpx;
                    line-height: 1.5;
                }
            }
        }
            input {
               width: 100%;
               font-size: 30rpx;
            }

        .buttons {
            display: flex;
            flex-direction: row;
            gap: 20rpx;
            justify-content: flex-end;
            picker {
               width: 100%;
               font-size: 30rpx;
               line-height: 1.5;
            }
         }
      }

            >button {
                display: inline-flex;
                width: 4rem;
            }
        }
      .buttons {
         display: flex;
         flex-direction: row;
         gap: 20rpx;
         justify-content: flex-end;

        .options-wrapper {
            padding: 20rpx;
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            gap: 20rpx;
         >button {
            display: inline-flex;
            width: 4rem;
         }
      }

            >view {
                margin: 0 !important;
                box-sizing: border-box;
      .options-wrapper {
         padding: 20rpx;
         display: grid;
         grid-template-columns: repeat(1, 1fr);
         gap: 20rpx;

            }
         >view {
            margin: 0 !important;
            box-sizing: border-box;

            .item {
                .left {
                    display: inline-block;
                    width: 6rem;
                    font-size: 26rpx;
                    color: #666;
                }
         }

                .right {
                    display: inline-block;
                    font-size: 28rpx;
                    color: #333;
                    word-break: break-all;
                }
            }
        }
         .item {
            .left {
               display: inline-block;
               width: 6rem;
               font-size: 26rpx;
               color: #666;
            }

        .uni-card--is-active {
            background-color: rgba(0, 122, 255, 0.2);
        }
            .right {
               display: inline-block;
               font-size: 28rpx;
               color: #333;
               word-break: break-all;
            }
         }
      }

        .daterange {
            display: flex;
            flex-direction: row;
            gap: 10rpx;
            justify-content: center;
            align-items: center;
      .uni-card--is-active {
         background-color: rgba(0, 122, 255, 0.2);
      }

        }
        
        .over {
            text-align: center;
            padding: 100rpx 0;
            color: #999;
            font-size: 28rpx;
        }
    }
      .daterange {
         display: flex;
         flex-direction: row;
         gap: 10rpx;
         justify-content: center;
         align-items: center;

      }

      .over {
         text-align: center;
         padding: 100rpx 0;
         color: #999;
         font-size: 28rpx;
      }
   }
</style>