| | |
| | | <template> |
| | | <view> |
| | | <view class="form-container"> |
| | | <form :modelValue="formData"> |
| | | <view class="form-group"> |
| | | <label class="form-label">首检单号:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.billNo"/> |
| | | </view> |
| | | <view class="form-group"> |
| | | <label class="form-label">创建时间:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.createTime"/> |
| | | </view> |
| | | <view class="uni-form-item uni-column form-item edit"> |
| | | <text class="form-label">生产线别:</text> |
| | | <superwei-combox v-if="isUpdate" :candidates="DAA020List" placeholder="请选择或输入" |
| | | v-model="formData.line" |
| | | @select="onDaa020Change" |
| | | class="picker form-input" |
| | | style="border: none;"></superwei-combox> |
| | | <input v-else class="form-input" disabled="true" type="text" v-model="formData.line"/> |
| | | </view> |
| | | <view class="uni-form-item uni-column form-item edit"> |
| | | <text class="form-label">物料编码:</text> |
| | | <superwei-combox v-if="isUpdate" :candidates="boardItems" placeholder="请选择或输入" |
| | | v-model="formData.itemNo" |
| | | :isJSON="true" keyName="itemName" |
| | | @select="onItemChange" |
| | | class="picker form-input" |
| | | style="border: none;"></superwei-combox> |
| | | <input v-else class="form-input" disabled="true" type="text" v-model="formData.itemNo"/> |
| | | </view> |
| | | <view class="uni-form-item uni-column form-item edit"> |
| | | <text class="form-label">计划编号:</text> |
| | | <picker v-if="isUpdate" class="picker form-input" name="selector" :range="DAA001List" |
| | | @change="onDaa001Change"> |
| | | <text>{{ DAA001List[DAA001Index] }}</text> |
| | | </picker> |
| | | <input v-else class="form-input" disabled="true" type="text" v-model="formData.daa001"/> |
| | | </view> |
| | | <view class="form-group"> |
| | | <label class="form-label">产品名称:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.daa003"/> |
| | | </view> |
| | | <view class="form-group"> |
| | | <label class="form-label">规格型号:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.daa004"/> |
| | | </view> |
| | | <view class="form-group"> |
| | | <label class="form-label">工单数量:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.daa008"/> |
| | | </view> |
| | | <view class="form-group"> |
| | | <label class="form-label">不合格描述:</label> |
| | | <input class="form-input" disabled="true" type="text" v-model="formData.remarks"/> |
| | | </view> |
| | | </form> |
| | | <view class="inspection-sheet"> |
| | | <!-- 头部信息 --> |
| | | <view class="sheet-header"> |
| | | <h1>首检单</h1> |
| | | <view class="inspection-number">检验单号:{{ formData.billNo }}</view> |
| | | </view> |
| | | <view class="list-container"> |
| | | <uni-table ref="table" border emptyText="暂无更多数据"> |
| | | <uni-tr> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF;">检验项目</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF">是否合格</uni-th> |
| | | <uni-th align="center" class="th" style="color: #FFFFFF">记录(点击)</uni-th> |
| | | </uni-tr> |
| | | <uni-tr v-for="(item, index) in tableData" :key="index"> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.projName"/> |
| | | </uni-td> |
| | | <uni-td align="center"> |
| | | <input class="form-input" disabled="true" type="text" v-model="item.result"/> |
| | | </uni-td> |
| | | <uni-td> |
| | | <view class="uni-group"> |
| | | <button v-if="item.isCheck >=item.levelNum" type="default" @click="toDetail(item)"> |
| | | {{ item.levelNum + '/' + item.isCheck }} |
| | | </button> |
| | | <button v-else type="warn" @click="toDetail(item)"> {{ item.levelNum + '/' + item.isCheck }}</button> |
| | | </view> |
| | | </uni-td> |
| | | </uni-tr> |
| | | </uni-table> |
| | | |
| | | <!-- 基本信息区 --> |
| | | <view class="basic-info"> |
| | | <view class="info-row"> |
| | | <span class="info-label">创建时间:</span> |
| | | <span class="info-value">{{ formData.createTime }}</span> |
| | | <span class="info-label">检验人:</span> |
| | | <span class="info-value">{{ formData.statusUser }}</span> |
| | | </view> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="isUpdate && !isShowTable" @click="save">创建检验单并生成部分默认值</button> |
| | | |
| | | <!-- 物料信息区 --> |
| | | <view class="material-info"> |
| | | <view class="info-block"> |
| | | <view class="info-label">生产线别:</view> |
| | | <view v-if="!isUpdate" class="info-value">{{ formData.line }}</view> |
| | | <superwei-combox v-else v-model="formData.line" :candidates="DAA020List" |
| | | class="picker info-value-input" placeholder="请选择或输入" |
| | | @select="onDaa020Change"></superwei-combox> |
| | | </view> |
| | | <view class="info-block"> |
| | | <view class="info-label">物料编码:</view> |
| | | <view v-if="!isUpdate" class="info-value">{{ formData.itemNo }}</view> |
| | | <superwei-combox v-else v-model="formData.itemNo" :candidates="boardItems" :isJSON="true" |
| | | class="picker info-value-input" keyName="itemName" placeholder="请选择或输入" |
| | | @select="onItemChange"></superwei-combox> |
| | | </view> |
| | | <view class="info-block"> |
| | | <view class="info-label">产品名称:</view> |
| | | <view class="info-value">{{ formData.daa003 }}</view> |
| | | </view> |
| | | <view class="info-block"> |
| | | <view class="info-label">规格型号:</view> |
| | | <view class="info-value">{{ formData.daa004 }}</view> |
| | | </view> |
| | | <view class="info-block"> |
| | | <view class="info-label">工单编号:</view> |
| | | <view v-if="!isUpdate" class="info-value">{{ formData.daa001 }}</view> |
| | | <picker v-else :range="DAA001List" class="picker info-value-input" name="selector" |
| | | @change="onDaa001Change"> |
| | | <view>{{ DAA001List[DAA001Index] }}</view> |
| | | </picker> |
| | | <view class="info-label">项目:</view> |
| | | <view class="info-value">{{ formData.projecT_CODE }}</view> |
| | | <view class="info-label">工单数量:</view> |
| | | <view class="info-value highlight">{{ formData.daa008 }}</view> |
| | | </view> |
| | | <view v-if="formData.remarks && current" class="info-block"> |
| | | <view class="info-label">备注:</view> |
| | | <view class="info-value">{{ formData.remarks }}</view> |
| | | </view> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="!isUpdate && !isShowTable" @click="toImage">上传/查看图片</button> |
| | | |
| | | <!-- 操作按钮区 --> |
| | | <view class="action-buttons"> |
| | | <button v-if="!isUpdate && !isShowTable" class="secondary-btn" @click="toSNScanCode(formData.releaseNo)">SN确认</button> |
| | | <button v-if="!isUpdate && !isShowTable" class="secondary-btn" @click="toYzxSubmitFrom(formData.releaseNo)">一致性核对</button> |
| | | <button class="secondary-btn" @click="getTable">获取检验项目</button> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="!isUpdate && formData.result == '未完成' && !isShowTable" @click="removeXJ">删除单据 |
| | | </button> |
| | | |
| | | <!-- 检验项目表格 --> |
| | | <view v-if="tableData.length > 0" class="inspection-table"> |
| | | <table> |
| | | <thead> |
| | | <tr> |
| | | <th style="text-align: center;" width="15%">检验项目</th> |
| | | <th style="text-align: center;" width="50%">检验描述</th> |
| | | <th style="text-align: center;" width="20%">记录(点击)</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody> |
| | | <tr v-for="(item, index) in tableData" :key="index"> |
| | | <td>{{ item.projName }}</td> |
| | | <td> |
| | | <view v-if="item.result=='合格'" class="watermark approved">合格</view> |
| | | <view v-if="item.result=='不合格'" class="watermark rejected">不合格</view> |
| | | <view v-if="item.result=='未完成'" class="watermark pending">待确认</view> |
| | | <view class="description-text">{{ item.itemMod }}</view> |
| | | </td> |
| | | <td> |
| | | <button v-if="item.isCheck < item.levelNum" class="record-btn record-btn-fill" |
| | | @click="toDetail(item, index)"> |
| | | 填写 <!--({{ item.isCheck }}/{{ item.levelNum }})--> |
| | | </button> |
| | | <button v-else class="record-btn record-btn-view" @click="toDetail(item, index)"> |
| | | 查看<!--({{ item.isCheck }}/{{ item.levelNum }})--> |
| | | </button> |
| | | </td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="!isUpdate && !isShowTable" @click="saveRemarks">添加不合格描述</button> |
| | | |
| | | <!-- 操作按钮区 --> |
| | | <view class="action-buttons"> |
| | | <button v-if="isUpdate && !isShowTable" class="secondary-btn" @click="save">创建检验单并生成部分默认值</button> |
| | | <button v-if="!isUpdate && !isShowTable" class="secondary-btn" @click="uploadImages">查看所有图片</button> |
| | | <button v-if="!isUpdate && !isShowTable" class="secondary-btn" @click="addDefectDescription">查看不良描述</button> |
| | | <!-- <button v-if="!isUpdate && !formData.statusUser && !isShowTable" class="secondary-btn" @click="removeXJ"> |
| | | 删除单据 |
| | | </button> --> |
| | | <button v-if="!isUpdate && !isShowTable" class="secondary-btn" @click="saveRemarks">添加备注</button> |
| | | <button v-if="!isUpdate && !isShowTable && formData.fSubmit != 1" class="primary-btn" @click="submit">检验提交</button> |
| | | <!-- <button class="secondary-btn" @click="getTable">获取检验项目</button> --> |
| | | <!-- <button v-if="isShowTable && isUpdate" class="primary-btn" @click="saveTable">生成检验项目</button> --> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="isShowTable" @click="getTable">获取检验项目</button> |
| | | </view> |
| | | <view class="plus-button"> |
| | | <button type="warn" v-if="isShowTable && isUpdate" @click="saveTable">生成检验项目</button> |
| | | </view> |
| | | |
| | | <!-- 弹窗 --> |
| | | <view v-if="remarksPopup" class="overlay"> |
| | | <view class="popup"> |
| | | <h3>修改不合格描述</h3> |
| | | <h3>修改备注</h3> |
| | | <form> |
| | | <view class="form-group"> |
| | | <label class="form-label">不合格描述:</label> |
| | | <input class="form-input" type="text" v-model="remarks"/> |
| | | <label class="form-label">备注:</label> |
| | | <textarea v-model="remarks" class="form-input form-textarea" placeholder="请输入备注信息..."></textarea> |
| | | </view> |
| | | <button type="warn" @click="editRemarks">修改</button> |
| | | <button class="updateBut" @click="editRemarks">修改</button> |
| | | <button @click="remarksPopup = !remarksPopup">取消</button> |
| | | </form> |
| | | </view> |
| | |
| | | line: "", |
| | | lineName: "", |
| | | comments: "", |
| | | statusUser: "" |
| | | statusUser: "", |
| | | itemId: "", |
| | | fSubmit: 0, |
| | | yzxChecked: false, // 添加一致性核对状态字段 |
| | | }, |
| | | |
| | | DAA020List: [], |
| | |
| | | |
| | | remarks: "", |
| | | remarksPopup: false, |
| | | |
| | | comments: "", |
| | | commentsPopup: false, |
| | | current: true, |
| | | |
| | | }; |
| | | }, |
| | | onLoad(options) { |
| | | //options中包含了url附带的参数 |
| | | |
| | | let params = options; |
| | | |
| | | if(params["current"]==='A') |
| | | { |
| | | this.current=true; |
| | | }else if(params["current"]==='B'){ |
| | | this.current=false; |
| | | } |
| | | if (params["id"]) { |
| | | this.isUpdate = false; |
| | | this.formData.id = params["id"]; |
| | |
| | | } |
| | | }, |
| | | methods: { |
| | | // 获取合格项目数量 |
| | | getPassedCount() { |
| | | return this.tableData.filter(item => item.result === '合格').length; |
| | | }, |
| | | // 获取不合格项目数量 |
| | | getFailedCount() { |
| | | return this.tableData.filter(item => item.result === '不合格').length; |
| | | }, |
| | | // 获取待检验项目数量 |
| | | getPendingCount() { |
| | | return this.tableData.filter(item => item.result === '未完成').length; |
| | | }, |
| | | removeXJ() { |
| | | if (this.formData.id) { |
| | | this.$post({ |
| | |
| | | this.$showMessage("请先选择检验单号"); |
| | | } |
| | | }, |
| | | |
| | | submit() { |
| | | // 检查是否需要一致性核对 |
| | | if (this.current && !this.formData.yzxChecked) { |
| | | // 先检查该物料是否维护了一致性核对项目 |
| | | this.$post({ |
| | | url: "/SJ/getYzxItem", |
| | | data: { |
| | | id: this.formData.id |
| | | } |
| | | }).then(res => { |
| | | // 如果维护了一致性核对项目(components.length > 0),则要求完成核对 |
| | | if (res.data && res.data.length > 0) { |
| | | uni.showModal({ |
| | | title: "提示", |
| | | content: "请先完成一致性核对后再提交检验", |
| | | confirmText: "去核对", |
| | | cancelText: "取消", |
| | | success: (modalRes) => { |
| | | if (modalRes.confirm) { |
| | | this.toYzxSubmitFrom(this.formData.billNo); |
| | | } |
| | | } |
| | | }); |
| | | } else { |
| | | // 未维护一致性核对项目,允许直接提交 |
| | | this.submitInspection(); |
| | | } |
| | | }).catch(() => { |
| | | // 接口异常,允许提交 |
| | | this.submitInspection(); |
| | | }); |
| | | return; |
| | | } |
| | | |
| | | // 已完成一致性核对或不需要核对,直接提交 |
| | | this.submitInspection(); |
| | | }, |
| | | |
| | | submitInspection() { |
| | | this.$post({ |
| | | url: "/SJ/SJQaSubmit", |
| | | data: { |
| | | userNo: this.$loginInfo.account, |
| | | gid: this.formData.id |
| | | } |
| | | }).then(res => { |
| | | |
| | | //2024-11-28 kyy 校验合格提交增加提示 |
| | | console.log("完整响应数据:", res); |
| | | console.log("Status Code的值:", res.statusCode); |
| | | console.log("返回的数据:", res.data); |
| | | |
| | | // 检查多种成功条件 |
| | | if (res.statusCode === 200 || res.status === 0 || res.data === true || res.data.tbBillList === true) { |
| | | |
| | | this.$showMessage("成功提交检验"); |
| | | // 提交成功后刷新页面数据 |
| | | this.init(); |
| | | // 1.5秒后跳转到列表页面 |
| | | setTimeout(() => { |
| | | uni.navigateTo({ |
| | | url: '/pages/QC/SJ/List' |
| | | }); |
| | | }, 1500); |
| | | } else { |
| | | this.$showMessage(res.data.message || res.message || "提交失败"); |
| | | } |
| | | }).catch(err => { |
| | | console.log("提交出错:", err); |
| | | this.$showMessage("提交失败,请重试"); |
| | | }) |
| | | }, |
| | | |
| | | init() { |
| | | if (this.formData.id) { |
| | | this.$post({ |
| | |
| | | }).then(res => { |
| | | let tbBillListElement = res.data.tbBillList[0]; |
| | | if (tbBillListElement) { |
| | | // 保存当前的yzxChecked状态 |
| | | const currentYzxChecked = this.formData.yzxChecked; |
| | | this.formData = tbBillListElement; |
| | | // 恢复yzxChecked状态,避免被服务器数据覆盖 |
| | | this.formData.yzxChecked = currentYzxChecked; |
| | | this.$post({ |
| | | url: "/SJ/getQSItems", |
| | | data: { |
| | |
| | | |
| | | }); |
| | | }, |
| | | toDetail(item) { |
| | | toDetail(item, index) { |
| | | if (this.isUpdate) { |
| | | uni.showToast({ |
| | | icon: "none", |
| | |
| | | }); |
| | | } else { |
| | | uni.navigateTo({ |
| | | url: 'detail?id=' + item.id + '&billNo=' + this.formData.billNo + '&gid=' + this.formData.id |
| | | url: 'detail?id=' + item.id + '&billNo=' + this.formData.billNo + '&gid=' + this.formData |
| | | .id + '&index=' + index |
| | | }); |
| | | } |
| | | }, |
| | |
| | | } |
| | | }).then(res => { |
| | | if (res.data.tbBillList.length > 0) { |
| | | |
| | | this.tableData = res.data.tbBillList; // 在箭头函数中,this 指向外层作用域的 this |
| | | this.isShowTable = true; |
| | | this.isUpdate = true; |
| | | //生成检验项目 |
| | | if (this.tableData.length === 0) { |
| | | return; |
| | | } |
| | | |
| | | this.$post({ |
| | | url: "/SJ/SaveItem", |
| | | data: { |
| | | gid: this.formData.id, |
| | | items: this.tableData, |
| | | statusUser: this.$loginInfo.account, |
| | | ItemNo:this.formData.itemNo |
| | | } |
| | | }).then(res => { |
| | | this.tableData = res.data.tbBillList.items; |
| | | this.isShowTable = false; |
| | | this.isUpdate = false; |
| | | }) |
| | | } else { |
| | | this.$showMessage("此物料没有启用的检验项目,请维护!"); |
| | | this.isShowTable = true; |
| | |
| | | this.isUpdate = false; |
| | | }) |
| | | }, |
| | | toYzxSubmitFrom(releaseNo){ |
| | | uni.navigateTo({ |
| | | url: 'yzxFrom?id=' +this.formData.id+'¤t='+(this.current ? 'true' : 'false') |
| | | }); |
| | | }, |
| | | toSNScanCode(releaseNo){ |
| | | uni.navigateTo({ |
| | | url: 'ScanCode?id=' +this.formData.id+'¤t='+(this.current ? 'true' : 'false') |
| | | }); |
| | | }, |
| | | save() { |
| | | |
| | | if (this.tableData.length === 0) { |
| | | this.$showMessage(this.formData.itemNo + "物料没有检验项目"); |
| | | return; |
| | | } |
| | | // if (this.tableData.length === 0) { |
| | | // this.$showMessage(this.formData.itemNo + "物料没有检验项目"); |
| | | // return; |
| | | // } |
| | | |
| | | if (!this.formData.daa001) { |
| | | this.$showMessage("请选择计划编号"); |
| | |
| | | this.tableData = res.data.tbBillList.items; |
| | | this.isUpdate = false; |
| | | }) |
| | | }, saveRemarks() { |
| | | }, |
| | | saveRemarks() { |
| | | this.remarksPopup = !this.remarksPopup; |
| | | this.remarks = this.formData.remarks; |
| | | }, |
| | | saveComments() { |
| | | this.commentsPopup = !this.commentsPopup; |
| | | this.comments = this.formData.comments; |
| | | }, |
| | | editRemarks() { |
| | | if (this.remarks) { |
| | |
| | | }) |
| | | } |
| | | }, |
| | | toImage() { |
| | | editComments() { |
| | | if (this.comments) { |
| | | //saveRemarksGid |
| | | this.$post({ |
| | | url: "/SJ/saveCommentGid", |
| | | data: { |
| | | gid: this.formData.id, |
| | | comments: this.comments |
| | | } |
| | | }).then(res => { |
| | | if (res.data.tbBillList > 0) { |
| | | this.formData.comments = this.comments; |
| | | this.commentsPopup = !this.commentsPopup; |
| | | this.$showMessage("保存成功"); |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | uploadImages() { |
| | | // 查看所有图片的逻辑 |
| | | console.log('点击了查看所有图片按钮,billNo:', this.formData.billNo); |
| | | uni.navigateTo({ |
| | | url: 'ImageItem?id=' + this.formData.id |
| | | url: 'ImageItemALL?id=' + this.formData.id |
| | | }); |
| | | }, |
| | | addDefectDescription() { |
| | | // 查看所有不良描述的逻辑 |
| | | console.log('点击了查看不良描述按钮,billNo:', this.formData.billNo); |
| | | uni.navigateTo({ |
| | | url: 'Blms?id=' + this.formData.id |
| | | }); |
| | | } |
| | | }, |
| | | onShow() { |
| | | //每次进入页面都会执行的方法 |
| | | this.init(); |
| | | // 每次进入页面都会执行的方法 |
| | | // 注释掉init()调用,避免覆盖一致性核对状态 |
| | | // this.init(); |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style> |
| | | .form-group { |
| | | /* 基础样式 */ |
| | | .inspection-sheet { |
| | | font-family: 'Microsoft YaHei', 'Segoe UI', sans-serif; |
| | | max-width: 1000px; |
| | | margin: 0 auto; |
| | | padding: 20px; |
| | | background-color: #fff; |
| | | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | /* 头部样式 */ |
| | | .sheet-header { |
| | | text-align: center; |
| | | margin-bottom: 20px; |
| | | padding-bottom: 15px; |
| | | border-bottom: 2px solid #e0e0e0; |
| | | } |
| | | |
| | | .sheet-header h1 { |
| | | color: #2c3e50; |
| | | font-size: 24px; |
| | | margin-bottom: 5px; |
| | | } |
| | | |
| | | .inspection-number { |
| | | font-size: 16px; |
| | | font-weight: bold; |
| | | color: #3498db; |
| | | } |
| | | |
| | | /* 基本信息区样式 */ |
| | | .basic-info, |
| | | .material-info { |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | .info-row { |
| | | display: flex; |
| | | margin-bottom: 10px; |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .info-label { |
| | | font-weight: bold; |
| | | color: #34495e; |
| | | min-width: 80px; |
| | | margin-right: 5px; |
| | | } |
| | | |
| | | .info-value { |
| | | color: #2c3e50; |
| | | margin-right: 20px; |
| | | } |
| | | |
| | | .highlight { |
| | | font-weight: bold; |
| | | color: #e74c3c; |
| | | } |
| | | |
| | | /* 物料信息区样式 */ |
| | | .material-info { |
| | | border: 1px solid #eee; |
| | | padding: 15px; |
| | | border-radius: 5px; |
| | | } |
| | | |
| | | .info-block { |
| | | display: flex; |
| | | align-items: center; |
| | | border-bottom: 1px solid #c9c9c9; |
| | | margin-bottom: 10px; |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .form-label { |
| | | margin-bottom: 0; |
| | | padding: 5px; |
| | | } |
| | | |
| | | .form-input { |
| | | .info-value-input { |
| | | flex: 1; |
| | | margin-bottom: 0; |
| | | padding: 5px; |
| | | padding: 8px 12px; |
| | | border: 1px solid #e9ecef; |
| | | border-radius: 6px; |
| | | background: #ffffff; |
| | | font-size: 14px; |
| | | margin-top: 6px; |
| | | } |
| | | |
| | | |
| | | .picker { |
| | | flex: 1; |
| | | margin-bottom: 0; |
| | | padding: 5px; |
| | | width: 100%; |
| | | padding: 8px 12px; |
| | | border: 1px solid #e9ecef; |
| | | border-radius: 6px; |
| | | background: #ffffff; |
| | | font-size: 14px; |
| | | margin-top: 6px; |
| | | } |
| | | |
| | | /* 表格样式 */ |
| | | .inspection-table { |
| | | margin: 25px 0; |
| | | } |
| | | |
| | | .inspection-table table { |
| | | width: 100%; |
| | | border-collapse: collapse; |
| | | } |
| | | |
| | | .inspection-table th, .inspection-table td { |
| | | padding: 12px 15px; |
| | | border: 1px solid #ddd; |
| | | text-align: left; |
| | | } |
| | | |
| | | .inspection-table th { |
| | | background-color: #f8f9fa; |
| | | font-weight: bold; |
| | | color: #34495e; |
| | | } |
| | | |
| | | .inspection-table tr:nth-child(even) { |
| | | background-color: #f9f9f9; |
| | | } |
| | | |
| | | .inspection-table tr:hover { |
| | | background-color: #f1f5f9; |
| | | } |
| | | |
| | | /* 检验描述列特殊样式 */ |
| | | .inspection-table td:nth-child(2) { |
| | | position: relative; |
| | | overflow: hidden; |
| | | padding: 0; |
| | | } |
| | | |
| | | /* 按钮样式 */ |
| | | .action-buttons { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | gap: 10px; |
| | | margin-top: 20px; |
| | | } |
| | | |
| | | .primary-btn, |
| | | .secondary-btn { |
| | | padding: 10px 20px; |
| | | border: none; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | cursor: pointer; |
| | | transition: all 0.3s; |
| | | } |
| | | |
| | | .primary-btn { |
| | | background-color: #3498db; |
| | | color: white; |
| | | } |
| | | |
| | | .primary-btn:hover { |
| | | background-color: #2980b9; |
| | | } |
| | | |
| | | .secondary-btn { |
| | | background-color: #ecf0f1; |
| | | color: #7f8c8d; |
| | | } |
| | | |
| | | .secondary-btn:hover { |
| | | background-color: #d5dbdb; |
| | | } |
| | | |
| | | .record-btn { |
| | | padding: 6px 12px; |
| | | background-color: #f8f9fa; |
| | | border: 1px solid #ddd; |
| | | cursor: pointer; |
| | | transition: all 0.2s; |
| | | } |
| | | |
| | | .record-btn:hover { |
| | | background-color: #e9ecef; |
| | | } |
| | | |
| | | /* 填写状态按钮 */ |
| | | .record-btn-fill { |
| | | background-color: #f8f9fa; |
| | | border: 1px solid #ddd; |
| | | } |
| | | |
| | | .record-btn-fill:hover { |
| | | background-color: #e9ecef; |
| | | } |
| | | |
| | | /* 查看状态按钮 */ |
| | | .record-btn-view { |
| | | background-color: #f8f9fa; |
| | | border: 1px solid #ddd; |
| | | } |
| | | |
| | | .record-btn-view:hover { |
| | | background-color: #e9ecef; |
| | | } |
| | | |
| | | /* 水印样式 */ |
| | | .watermark { |
| | | position: absolute; |
| | | font-size: 40px; |
| | | font-weight: bold; |
| | | opacity: 1; |
| | | z-index: 1; |
| | | pointer-events: none; |
| | | transform: rotate(-15deg); |
| | | width: 100%; |
| | | text-align: center; |
| | | top: 50%; |
| | | left: 50%; |
| | | transform: translate(-50%, -50%) rotate(-15deg); |
| | | } |
| | | |
| | | .watermark.approved { |
| | | color: #2ecc71; /* 绿色 */ |
| | | } |
| | | |
| | | .watermark.rejected { |
| | | color: #e74c3c; /* 红色 */ |
| | | } |
| | | |
| | | .watermark.pending { |
| | | color: #f39c12; /* 橙色 */ |
| | | } |
| | | |
| | | /* 描述文本容器 */ |
| | | .description-text { |
| | | position: relative; |
| | | z-index: 2; |
| | | padding: 25px; |
| | | background-color: rgba(255, 255, 255, 0.7); |
| | | } |
| | | |
| | | .sysLike { |
| | | color: #3498db; |
| | | text-decoration: none; |
| | | margin-left: 15px; |
| | | padding: 3px 8px; |
| | | border: 1px solid #3498db; |
| | | border-radius: 3px; |
| | | font-size: 12px; |
| | | } |
| | | |
| | | .uni-form-item { |
| | | display: flex; |
| | | border-bottom: 1px solid #c9c9c9; |
| | | .sysLike:hover { |
| | | background-color: #f0f8ff; |
| | | } |
| | | |
| | | .edit { |
| | | background-color: white; |
| | | } |
| | | |
| | | /* 默认样式 */ |
| | | .list-container { |
| | | height: 60vh; |
| | | /* 设置列表容器的高度为剩余空间,并减去表单容器的高度 */ |
| | | overflow-y: auto; |
| | | /* 允许列表容器垂直滚动 */ |
| | | padding: 10px; |
| | | /* 可选:添加一些内边距,使列表内容更美观 */ |
| | | } |
| | | |
| | | /* 在小屏幕设备上,重置高度为适应屏幕 */ |
| | | @media (max-width: 768px) { |
| | | .list-container { |
| | | height: calc(100vh - 376px); |
| | | /* 适当调整高度 */ |
| | | } |
| | | } |
| | | |
| | | |
| | | .form-container { |
| | | padding: 10px; |
| | | /* 可选:添加一些内边距,使表单内容更美观 */ |
| | | } |
| | | |
| | | .th { |
| | | background-color: lightskyblue; |
| | | color: #FFFFFF; |
| | | } |
| | | |
| | | |
| | | .plus-button { |
| | | line-height: 59px; |
| | | font-size: 24px; |
| | | cursor: pointer; |
| | | z-index: 1000; |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | /* 弹出层样式 */ |
| | | .overlay { |
| | | position: fixed; |
| | | top: 0; |
| | |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | z-index: 10; |
| | | } |
| | | |
| | | .popup { |
| | |
| | | padding: 20px; |
| | | border: 1px solid #ccc; |
| | | box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
| | | width: 68vw; |
| | | /* 设置宽度为视口宽度的80% */ |
| | | height: 25vh; |
| | | /* 设置高度为视口高度的80% */ |
| | | width: 85vw; |
| | | min-height: 35vh; |
| | | max-height: 60vh; |
| | | border-radius: 8px; |
| | | } |
| | | |
| | | .popup h3 { |
| | | margin-top: 0; |
| | | color: #2c3e50; |
| | | border-bottom: 1px solid #eee; |
| | | padding-bottom: 10px; |
| | | margin-bottom: 15px; |
| | | font-size: 16px; |
| | | text-align: center; |
| | | } |
| | | |
| | | .popup .form-group { |
| | | margin-bottom: 15px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .popup .form-label { |
| | | margin-bottom: 5px; |
| | | font-weight: bold; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .popup .form-input { |
| | | width: 100%; |
| | | padding: 8px; |
| | | border: 1px solid #ddd; |
| | | border-radius: 4px; |
| | | font-size: 14px; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .popup .form-textarea { |
| | | min-height: 120px; |
| | | resize: vertical; |
| | | font-family: inherit; |
| | | line-height: 1.5; |
| | | } |
| | | |
| | | .popup-buttons { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | gap: 10px; |
| | | margin-top: 20px; |
| | | } |
| | | |
| | | .updateBut { |
| | | background-color: #3498db; |
| | | color: white; |
| | | border: none; |
| | | padding: 8px 15px; |
| | | border-radius: 4px; |
| | | margin-right: 10px; |
| | | cursor: pointer; |
| | | transition: all 0.3s; |
| | | } |
| | | |
| | | .updateBut:hover { |
| | | background-color: #2980b9; |
| | | } |
| | | |
| | | /* 响应式设计 */ |
| | | @media (max-width: 500px) { |
| | | .info-row, |
| | | .info-block { |
| | | flex-direction: column; |
| | | align-items: flex-start; |
| | | } |
| | | |
| | | .doc-links { |
| | | margin-left: 0; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | .action-buttons { |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .inspection-table table { |
| | | display: block; |
| | | overflow-x: auto; |
| | | } |
| | | } |
| | | </style> |