SJ,XJ,RKJ

xwt

2025-09-18 688505dded0a49ee685abcb980bd0dc521df4241

 pages/QC/SJ/detail.vue

@@ -93,17 +93,32 @@
          </view>
          
          <view class="input-group input1">
            <view class="input-wrapper">
              <input v-if="tableData.length < formData.levelNum" class="result-input" type="number" v-model="formData.fcheckResu" placeholder="请输入检验结果..."/>
              <button v-if="tableData.length < formData.levelNum" class="btn primary-btn" @click="submit">保存结果</button>
              <button class="btn upload-btn" @click="previewImage" v-if="isShowImg">
                <uni-icons type="image" size="16" color="#fff"></uni-icons>
                查看图片
            <view class="input-wrapper llj-flex-row">
              <input v-if="tableData.length < formData.levelNum"
                     class="result-input"
                     type="number"
                     v-model="formData.fcheckResu"
                     placeholder="请输入检验结果..." />
              <button v-if="tableData.length < formData.levelNum"
                      class="llj-btn llj-btn-save"
                      @click="submit">保存结果</button>
              <button
                class="llj-btn llj-btn-image"
                @click="previewImage"
                v-if="isShowImg"
              >
                <uni-icons type="image" size="20" color="#fff" style="margin-right:6px;"/>
                上传/查看图片
              </button>
              <button class="btn upload-btn" @click="saveRemarks">
                <uni-icons type="compose" size="16" color="#fff"></uni-icons>
              <button
                      class="llj-btn llj-btn-desc"
                      @click="saveRemarks">
                <uni-icons type="compose" size="20" color="#fff" style="margin-right:6px;"/>
                不合格描述
              </button>
              <view v-if="formData.remarks" class="llj-desc-tag">
                {{ formData.remarks.length > 10 ? formData.remarks.substr(0,10)+'...' : formData.remarks }}
              </view>
            </view>
          </view>
          
@@ -159,8 +174,8 @@
              
              <!-- NG/OK状态样式 -->
              <view v-else class="simple-status-result">
                <view class="simple-status" :class="{'pass': item.fcheckResu === '1', 'fail': item.fcheckResu !== '1'}">
                  {{ item.fcheckResu === '1' ? '合格' : '不合格' }}
                <view class="simple-status" :class="{'pass': item.fcheckResu == 1 || item.fcheckResu == 'OK' || item.fcheckResu == 'ok', 'fail': item.fcheckResu != 1 && item.fcheckResu != 'OK' && item.fcheckResu != 'ok'}">
                  {{ (item.fcheckResu == 1 || item.fcheckResu == 'OK' || item.fcheckResu == 'ok') ? '合格' : '不合格' }}
                </view>
              </view>
            </view>
@@ -278,7 +293,7 @@
      });
    },
    editResult(fcheckResu) {
      if (fcheckResu == '1') {
      if (fcheckResu == '1' || fcheckResu == 'OK' || fcheckResu == 'ok') {
        return "改为不合格";
      } else {
        return "改为合格";
@@ -352,8 +367,10 @@
          this.isShowImg = true;
          this.base64Image = 'data:image/jpeg;base64,' + this.formData.imageData;
        }
        if (this.formData.maxValue && this.formData.minValue && this.formData.standardValue) {
        if (this.formData.maxValue && this.formData.minValue) {
          this.isNumber = true;
        } else {
          this.isNumber = false;
        }
      }).catch(error => {
        console.error("获取检验项目失败:", error);
@@ -441,7 +458,7 @@
      let fstand = "√";
      let fcheckResu = 1;

      if (item.fcheckResu == '1') {
      if (item.fcheckResu == '1' || item.fcheckResu == 'OK' || item.fcheckResu == 'ok') {
        fstand = "×";
        fcheckResu = 0;
      }
@@ -1092,4 +1109,206 @@
      font-size: 18px;
   }
  }

  .btn-disabled {
   background-color: #ccc !important;
   color: #fff !important;
   cursor: not-allowed !important;
   border: none !important;
  }
  
  .llj-btn-group {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 24px;
   margin: 24px 0 12px 0;
   flex-wrap: wrap;
  }
  
  .llj-btn {
   display: flex;
   align-items: center;
   border: none;
   border-radius: 24px;
   font-size: 16px;
   font-weight: 500;
   height: 45px;
   line-height: 1; /* 修复：使用line-height: 1避免与height冲突 */
   padding: 0 28px;
   margin: 0;
   box-shadow: 0 2px 8px rgba(64,158,255,0.10);
   transition: background 0.2s, box-shadow 0.2s;
   cursor: pointer;
   box-sizing: border-box; /* 修复：确保盒模型一致性 */
   -webkit-appearance: none; /* 修复：移除移动端默认样式 */
   -moz-appearance: none;
   appearance: none;
   user-select: none; /* 防止文本选择 */
   touch-action: manipulation; /* 优化触摸体验 */
  }
  
  .llj-btn-save {
   background: linear-gradient(90deg, #27ae60 0%, #43e97b 100%);
   color: #fff;
   margin-right: 12px;
  }
  .llj-btn-save:active {
   background: linear-gradient(90deg, #43e97b 0%, #27ae60 100%);
  }
  
  .llj-btn-image {
   background: linear-gradient(90deg, #27ae60 0%, #43e97b 100%);
   color: #fff;
  }
  .llj-btn-image:active {
   background: linear-gradient(90deg, #43e97b 0%, #27ae60 100%);
  }
  
  .llj-btn-desc {
   background: linear-gradient(90deg, #F56C6C 0%, #e67e22 100%);
   color: #fff;
   margin-left: 12px;
  }
  .llj-btn-desc:active {
   background: linear-gradient(90deg, #e67e22 0%, #F56C6C 100%);
  }
  
  .llj-btn-disabled,
  .llj-btn[disabled] {
   background: #d3d3d3 !important;
   color: #fff !important;
   cursor: not-allowed !important;
   box-shadow: none !important;
  }
  
  .llj-desc-tag {
   background: #f5f7fa;
   color: #F56C6C;
   border-radius: 16px;
   padding: 6px 16px;
   font-size: 14px;
   margin-left: 12px;
   margin-top: 8px;
   max-width: 180px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
  }
  
  .llj-flex-row {
   display: flex;
   align-items: center;
   gap: 12px;
   width: 100%;
  }
  
  .result-input {
   flex: 1;
   height: 45px;
   padding: 0 12px;
   border: 1px solid #DCDFE6;
   border-radius: 4px;
   font-size: 14px;
   box-sizing: border-box;
   min-width: 120px;
   -webkit-appearance: none; /* 移除移动端默认样式 */
   -moz-appearance: none;
   appearance: none;
  }
  
  .llj-btn, .llj-btn-save, .llj-btn-image, .llj-btn-desc {
   height: 45px;
   line-height: 1; /* 修复：统一使用line-height: 1 */
   padding: 0 24px;
   min-width: 90px;
   display: flex;
   align-items: center;
   justify-content: center;
   box-sizing: border-box; /* 确保盒模型一致性 */
  }
  
  /* 移动端按钮优化 */
  @media (max-width: 768px) {
   .llj-btn {
     font-size: 14px;
     padding: 0 20px;
     height: 40px;
     border-radius: 20px;
   }
	
   .llj-btn, .llj-btn-save, .llj-btn-image, .llj-btn-desc {
     height: 40px;
     padding: 0 20px;
     min-width: 80px;
   }
	
   .result-input {
     height: 40px;
     font-size: 14px;
   }
  }
  
  /* 防止移动端按钮点击时的缩放 */
  @media (max-width: 500px) {
   .llj-btn {
     -webkit-tap-highlight-color: transparent;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
   }
  }
  
  /* 移动端按钮点击效果优化 */
  .llj-btn:active {
   transform: scale(0.98);
   transition: transform 0.1s ease;
  }
  
  /* 确保所有按钮在移动端都有正确的触摸区域 */
  .simple-btn {
   padding: 10px 16px;
   background: #007bff;
   color: #fff;
   border: none;
   border-radius: 6px;
   font-size: 14px;
   font-weight: bold;
   cursor: pointer;
   min-width: 80px;
   min-height: 44px; /* 确保触摸区域足够大 */
   box-sizing: border-box;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   user-select: none;
   touch-action: manipulation;
  }
  
  .simple-btn:active {
   background: #0056b3;
   transform: scale(0.98);
  }
  
  /* 移动端输入框优化 */
  @media (max-width: 768px) {
   .result-input {
     font-size: 16px; /* 防止iOS缩放 */
     -webkit-appearance: none;
     border-radius: 8px;
   }
	
   .simple-table-header {
     padding: 10px 12px;
   }
	
   .simple-header-cell,
   .simple-data-cell {
     padding: 10px 12px;
     font-size: 13px;
   }
  }
</style>